/* ── Brand loader ───────────────────────────────────────────────────────────
   Concentric HUD rings for <BrandLoader>. Each layer spins about the viewBox
   centre at a different rate/direction; the prime-ish durations keep the rings
   from visibly re-syncing into a single rigid wheel. */
@keyframes rwl-spin     { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@keyframes rwl-spin-rev { from { transform: rotate(0deg); } to { transform: rotate(-360deg); } }
@keyframes rwl-breathe  { 0%, 100% { transform: scale(0.985); } 50% { transform: scale(1.025); } }
@keyframes rwl-core     { 0%, 100% { opacity: 0.5; transform: scale(0.8); } 50% { opacity: 1; transform: scale(1.12); } }
@keyframes rwl-label    { 0%, 100% { opacity: 0.5; } 50% { opacity: 1; } }

.rw-loader {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 0.875rem;
  max-width: 100%;
  vertical-align: middle;
  line-height: 1.4;
}

.rw-loader--inline { flex-direction: row; gap: 0.5rem; }
.rw-loader--icon { gap: 0; flex-shrink: 0; }

/* Action buttons already choose contrasting text for their background. */
button .rw-loader {
  --brand-gold: currentColor;
  --brand-gold-soft: currentColor;
  --brand-gold-deep: currentColor;
}
button .rw-loader__svg { filter: none; }

.rw-loader__svg {
  flex-shrink: 0;
  animation: rwl-breathe 3.3s ease-in-out infinite;
  filter:
    drop-shadow(0 0 4px rgb(var(--brand-gold-rgb, 197 165 114) / 0.5))
    drop-shadow(0 0 13px rgb(var(--brand-gold-rgb, 197 165 114) / 0.28))
    drop-shadow(0 0 28px rgb(var(--brand-gold-rgb, 197 165 114) / 0.14));
}

/* fill-box would centre each ring on its own dash bounds, which drift as the
   dashes rotate — view-box pins every layer to the shared 50,50 centre. */
.rw-loader__svg > * {
  transform-box: view-box;
  transform-origin: 50% 50%;
}

.rw-loader__sweep { animation: rwl-spin 1.9s linear infinite; }
.rw-loader__outer { animation: rwl-spin 2.9s linear infinite; }
.rw-loader__ticks { animation: rwl-spin-rev 6.5s linear infinite; }
.rw-loader__mid   { animation: rwl-spin-rev 2.1s linear infinite; }
.rw-loader__hub   { animation: rwl-spin 4.7s linear infinite; }
.rw-loader__core  { animation: rwl-core 1.9s ease-in-out infinite; }

.rw-loader__label {
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.025em;
  color: inherit;
  text-align: center;
  overflow-wrap: anywhere;
}

.rw-loader--inline .rw-loader__label { font-size: 0.6875rem; text-align: start; }

@media (prefers-reduced-motion: reduce) {
  .rw-loader__svg { animation: none; }
  .rw-loader__sweep,
  .rw-loader__outer,
  .rw-loader__ticks,
  .rw-loader__mid,
  .rw-loader__hub { animation: none; }
  .rw-loader__core,
  .rw-loader__label { animation: none; }
}


.rw-boot-loader { min-height: 100vh; display: grid; place-items: center; background: #0f172a; color: #e2e8f0; }
