.sagsuns-loader {
  --loader-primary: #2676c9;
  --loader-secondary: #39b7aa;
  --loader-glow: rgba(38, 118, 201, 0.3);
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  display: grid;
  place-items: center;
  padding: 1.5rem;
  background:
    radial-gradient(circle at 50% 42%, var(--loader-glow), transparent 34%),
    rgba(244, 249, 255, 0.94);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 320ms ease, visibility 0s linear 320ms;
}

.sagsuns-loader[data-variant="partner"] {
  --loader-primary: #1f5f99;
  --loader-secondary: #65a8e4;
  --loader-glow: rgba(61, 130, 195, 0.32);
  background:
    radial-gradient(circle at 50% 42%, var(--loader-glow), transparent 34%),
    rgba(238, 245, 251, 0.95);
}

.sagsuns-loader[data-variant="admin"] {
  --loader-primary: #7f75e8;
  --loader-secondary: #35a7d6;
  --loader-glow: rgba(83, 133, 225, 0.34);
  color: #fff;
  background:
    radial-gradient(circle at 50% 40%, rgba(63, 127, 206, 0.42), transparent 36%),
    linear-gradient(145deg, rgba(8, 25, 49, 0.97), rgba(20, 57, 101, 0.97));
}

.sagsuns-loader.is-visible {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition: opacity 320ms ease;
}

.sagsuns-loader-card {
  position: relative;
  display: grid;
  justify-items: center;
  gap: 1rem;
  min-width: min(19rem, 88vw);
  padding: 2rem 2.2rem 1.7rem;
  color: #173b61;
  text-align: center;
  transform: translateY(.35rem) scale(.985);
  transition: transform 360ms cubic-bezier(.2, .75, .25, 1);
}

.sagsuns-loader.is-visible .sagsuns-loader-card {
  transform: translateY(0) scale(1);
}

.sagsuns-loader[data-variant="admin"] .sagsuns-loader-card {
  color: #fff;
}

.sagsuns-loader-orbit {
  position: relative;
  width: 6.4rem;
  height: 6.4rem;
  display: grid;
  place-items: center;
}

.sagsuns-loader-orbit::before,
.sagsuns-loader-orbit::after {
  content: "";
  position: absolute;
  border-radius: 50%;
}

.sagsuns-loader-orbit::before {
  inset: 0;
  border: 3px solid transparent;
  border-top-color: var(--loader-primary);
  border-right-color: var(--loader-secondary);
  filter: drop-shadow(0 0 8px var(--loader-glow));
  animation: sagsuns-loader-spin 1.05s linear infinite;
}

.sagsuns-loader-orbit::after {
  inset: .55rem;
  border: 1px solid color-mix(in srgb, var(--loader-primary) 32%, transparent);
  border-left-color: var(--loader-secondary);
  animation: sagsuns-loader-spin 1.6s linear infinite reverse;
}

.sagsuns-loader-logo {
  width: 4.2rem;
  height: 4.2rem;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.8);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 14px 34px var(--loader-glow);
  animation: sagsuns-loader-breathe 1.55s ease-in-out infinite;
}

.sagsuns-loader-logo img {
  width: 3.35rem;
  height: 2.25rem;
  object-fit: contain;
}

.sagsuns-loader-wordmark {
  display: flex;
  align-items: baseline;
  gap: .45rem;
  font-family: Inter, Nunito, system-ui, sans-serif;
  font-size: 1.55rem;
  font-weight: 800;
  letter-spacing: -.035em;
}

.sagsuns-loader-dots {
  display: inline-flex;
  gap: .24rem;
}

.sagsuns-loader-dots span {
  width: .32rem;
  height: .32rem;
  border-radius: 50%;
  background: var(--loader-secondary);
  animation: sagsuns-loader-dot 1.1s ease-in-out infinite;
}

.sagsuns-loader-dots span:nth-child(2) { animation-delay: 140ms; }
.sagsuns-loader-dots span:nth-child(3) { animation-delay: 280ms; }

.sagsuns-loader-message {
  min-height: 1.35rem;
  margin: -.45rem 0 0;
  color: #58738f;
  font-size: .9rem;
}

.sagsuns-loader[data-variant="admin"] .sagsuns-loader-message {
  color: rgba(255, 255, 255, 0.72);
}

.sagsuns-loader-long-wait {
  display: none;
}

.sagsuns-loader.is-long-wait .sagsuns-loader-default {
  display: none;
}

.sagsuns-loader.is-long-wait .sagsuns-loader-long-wait {
  display: inline;
}

@keyframes sagsuns-loader-spin {
  to { transform: rotate(360deg); }
}

@keyframes sagsuns-loader-breathe {
  0%, 100% { transform: scale(.94); }
  50% { transform: scale(1); }
}

@keyframes sagsuns-loader-dot {
  0%, 65%, 100% { transform: translateY(0); opacity: .42; }
  32% { transform: translateY(-.28rem); opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .sagsuns-loader-orbit::before,
  .sagsuns-loader-orbit::after,
  .sagsuns-loader-logo,
  .sagsuns-loader-dots span {
    animation: none;
  }

  .sagsuns-loader-orbit::before {
    border-color: color-mix(in srgb, var(--loader-primary) 58%, transparent);
  }
}
