/* ============================================================
   SILENT AURA (Package 5) — power reads off a high-mastery mark.
   Chosen progression COMPOUNDS by prestige: Embers → +Pulse Rings →
   +Corona (each tier ADDS a distinct layer, never the same effect
   louder). All silent — slow, low-contrast, never a danger flash.
   All color via System tokens → re-skins with the World.
   Scaled to mount behind the app's rank emblems (44–72px).
   ============================================================ */

.rk-wrap { position: relative; display: inline-grid; place-items: center; flex: none; }
.rk-wrap > .rank { position: relative; z-index: 1; }
.rk-aura { position: absolute; inset: -55%; z-index: 0; pointer-events: none; display: grid; place-items: center; }
.rk-aura .au { position: absolute; inset: 0; margin: auto; }

/* intensity — opacity envelope, escalates with prestige */
.rk-wrap[data-au="1"] .rk-aura { opacity: .72; }
.rk-wrap[data-au="2"] .rk-aura { opacity: .9; }
.rk-wrap[data-au="3"] .rk-aura { opacity: 1; }

/* ===== EMBERS — motes rising and fading (tier S) ===== */
.au-ember .em { position: absolute; bottom: 42%; width: 3px; height: 3px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 6px 1px var(--glow); animation: ember-rise linear infinite; will-change: transform, opacity; }
@keyframes ember-rise {
  0% { transform: translate(-50%, 8px) scale(.5); opacity: 0; }
  12% { opacity: .95; }
  70% { opacity: .7; }
  100% { transform: translate(calc(-50% + var(--dx)), -64px) scale(.2); opacity: 0; }
}

/* ===== PULSE RINGS — slow silent sonar (adds at SS) ===== */
.au-pulse .pr { position: absolute; inset: 16%; border: 1.5px solid var(--accent); border-radius: 50%; opacity: 0; box-shadow: 0 0 12px -4px var(--glow); animation: pulse-out 4.4s ease-out infinite; will-change: transform, opacity; }
@keyframes pulse-out { 0% { transform: scale(.82); opacity: .55; } 80% { opacity: .06; } 100% { transform: scale(1.75); opacity: 0; } }

/* ===== CORONA — rotating conic halo (adds at SSS) ===== */
.au-corona .co { position: absolute; inset: 4%; border-radius: 50%; filter: blur(2px); will-change: transform;
  -webkit-mask: radial-gradient(closest-side, transparent 56%, #000 64%, #000 84%, transparent 94%);
          mask: radial-gradient(closest-side, transparent 56%, #000 64%, #000 84%, transparent 94%); }
.au-corona .co1 { background: conic-gradient(from 0deg, transparent 0deg, color-mix(in srgb, var(--accent) 55%, transparent) 40deg, transparent 120deg, transparent 200deg, color-mix(in srgb, var(--accent-2) 42%, transparent) 250deg, transparent 320deg); animation: au-spin 13s linear infinite; }
.au-corona .co2 { background: conic-gradient(from 90deg, transparent 0deg, color-mix(in srgb, var(--accent) 34%, transparent) 60deg, transparent 150deg); animation: au-spin 19s linear infinite reverse; opacity: .7; }
@keyframes au-spin { to { transform: rotate(360deg); } }

/* reduced motion: drop the animations, keep a faint static glow.
   Fires on the OS preference OR the in-app Motion=Reduced setting. */
@media (prefers-reduced-motion: reduce) and (scripting: none) {
  .au-ember .em, .au-pulse .pr, .au-corona .co { animation: none !important; }
  .au-ember, .au-pulse { opacity: 0; }
  .au-corona .co { opacity: .35; }
  .rk-wrap[data-au] > .rank { box-shadow: 0 0 18px -4px var(--glow); }
}
:root[data-motion="reduced"] .au-ember .em, :root[data-motion="reduced"] .au-pulse .pr, :root[data-motion="reduced"] .au-corona .co { animation: none !important; }
:root[data-motion="reduced"] .au-ember, :root[data-motion="reduced"] .au-pulse { opacity: 0; }
:root[data-motion="reduced"] .au-corona .co { opacity: .35; }
:root[data-motion="reduced"] .rk-wrap[data-au] > .rank { box-shadow: 0 0 18px -4px var(--glow); }