/* ── Iridescent ambient layer, v2 ────────────────────────────────────────
   v1 used filter:blur + scale + mix-blend-mode and ran at 8fps. Softness
   now lives in the gradient stops themselves; animation is translate+rotate
   only; no blend modes. The GPU rasterizes each ribbon once and only moves it. */
/* body backgrounds paint OVER negative-z fixed children — the canvas color
   must live on html, and body must stay transparent, or the layer is invisible */
html{background:#0b1729}
body{background:transparent !important}
.aurora{position:fixed;inset:-12vmax;z-index:-1;pointer-events:none;overflow:hidden}
.aurora i{position:absolute;border-radius:50%;will-change:transform;backface-visibility:hidden}
.aurora .b1{width:80vmax;height:60vmax;left:-20vmax;top:-18vmax;
  background:radial-gradient(closest-side at 40% 45%,
    rgba(139,92,246,.50) 0%,rgba(99,102,241,.34) 26%,rgba(34,211,238,.34) 48%,
    rgba(34,211,238,.09) 66%,transparent 82%);
  animation:au1 46s ease-in-out infinite alternate}
.aurora .b2{width:74vmax;height:56vmax;right:-24vmax;top:2vmax;
  background:radial-gradient(closest-side at 58% 42%,
    rgba(255,78,205,.44) 0%,rgba(214,58,120,.30) 30%,rgba(255,179,71,.17) 52%,
    rgba(255,179,71,.07) 68%,transparent 84%);
  animation:au2 58s ease-in-out infinite alternate}
.aurora .b3{width:84vmax;height:62vmax;left:-12vmax;bottom:-26vmax;
  background:radial-gradient(closest-side at 46% 54%,
    rgba(34,211,238,.38) 0%,rgba(45,212,191,.26) 32%,rgba(52,211,153,.14) 54%,
    rgba(52,211,153,.06) 70%,transparent 85%);
  animation:au3 52s ease-in-out infinite alternate}
.aurora .b4{width:60vmax;height:46vmax;right:-10vmax;bottom:-16vmax;
  background:radial-gradient(closest-side at 50% 50%,
    rgba(168,85,247,.34) 0%,rgba(255,78,205,.22) 34%,rgba(139,92,246,.10) 58%,
    transparent 80%);
  animation:au4 64s ease-in-out infinite alternate}
@keyframes au1{from{transform:translate3d(0,0,0) rotate(0deg)}
  to{transform:translate3d(10vmax,8vmax,0) rotate(26deg)}}
@keyframes au2{from{transform:translate3d(0,0,0) rotate(0deg)}
  to{transform:translate3d(-12vmax,10vmax,0) rotate(-22deg)}}
@keyframes au3{from{transform:translate3d(0,0,0) rotate(0deg)}
  to{transform:translate3d(11vmax,-9vmax,0) rotate(18deg)}}
@keyframes au4{from{transform:translate3d(0,0,0) rotate(0deg)}
  to{transform:translate3d(-8vmax,-10vmax,0) rotate(-28deg)}}

/* holographic sheen band — one conic ribbon, rotated slowly, faded by a static mask */
.aurora .b5{width:120vmax;height:120vmax;left:50%;top:50%;margin:-60vmax 0 0 -60vmax;
  border-radius:0;
  background:conic-gradient(from 210deg,
    rgba(255,78,205,.14),rgba(139,92,246,.16),rgba(34,211,238,.14),
    rgba(52,211,153,.10),rgba(255,179,71,.12),rgba(255,78,205,.14));
  -webkit-mask-image:radial-gradient(closest-side,transparent 22%,#000 40%,#000 58%,transparent 78%);
  mask-image:radial-gradient(closest-side,transparent 22%,#000 40%,#000 58%,transparent 78%);
  animation:au5 90s linear infinite}
@keyframes au5{to{transform:rotate(360deg)}}
@media (max-width:760px){
  .aurora .b3,.aurora .b4,.aurora .b5{display:none}
}
@media (prefers-reduced-motion:reduce){
  .aurora .b1,.aurora .b2,.aurora .b3,.aurora .b4,.aurora .b5{animation:none}
}