/* Auronis — Cinematic living background v4 (based on the original landing-page atmosphere).
   Real ascending embers + fog + glowing light shafts + slowly drifting world.
   Paint only: artwork and title stay sharp; animations disabled for reduced-motion users. */

/* Keep the background behind the lettering, hero artwork and navigation. */
body.my2-body .my2-inner-hero,
body.my2-body .my2-game-hero {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
}
body.my2-body .my2-inner-hero .auronis-atmosphere,
body.my2-body .my2-game-hero .auronis-atmosphere {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  overflow: hidden !important;
  pointer-events: none !important;
  isolation: isolate !important;
}
body.my2-body .my2-inner-hero .auronis-inner-art {z-index: 4 !important;}
body.my2-body .my2-inner-hero .my2-inner-content {z-index: 5 !important;}
body.my2-body .my2-inner-hero .my2-inner-sigil,
body.my2-body .my2-inner-hero .my2-inner-glow {z-index: 1 !important; pointer-events:none !important;}
body.my2-body .my2-inner-hero::after {z-index: 3 !important; pointer-events:none !important;}
body.my2-body .my2-game-hero .my2-game-hero-inner {position: relative !important; z-index: 5 !important;}
body.my2-body .my2-game-hero .my2-game-hero-veil {pointer-events:none !important;}

/* A moving translucent duplicate of the real scene. The base scene is never removed. */
.auronis-atmosphere-landscape {
  position:absolute; inset:-17% -11%;
  background-image:url('../images/cristallina-world.png');
  background-size:cover; background-position:center 48%;
  opacity:.23; filter:saturate(1.35) contrast(1.14) brightness(.78);
  mix-blend-mode:screen; will-change:transform, opacity;
  animation:auronisLandscapeDrift 24s ease-in-out infinite alternate;
}
/* Two wandering smoke clouds, inspired by the landing's dark red/gold tone. */
.auronis-atmosphere-mist {
  position:absolute;inset:-60% -25%;
  background:
    radial-gradient(ellipse 30% 26% at 23% 66%,rgba(234,78,38,.27),transparent 76%),
    radial-gradient(ellipse 28% 27% at 82% 42%,rgba(190,39,47,.2),transparent 78%),
    radial-gradient(ellipse 35% 25% at 50% 72%,rgba(236,141,64,.13),transparent 76%);
  filter:blur(35px); opacity:.92;
  will-change:transform;
  animation:auronisSmokeDrift 13s ease-in-out infinite alternate;
}
.auronis-atmosphere-aura {
  position:absolute;inset:-25%;
  background:
    radial-gradient(ellipse 29% 57% at 9% 74%,rgba(246,93,33,.43),transparent 78%),
    radial-gradient(ellipse 24% 42% at 94% 68%,rgba(247,93,39,.37),transparent 80%),
    radial-gradient(ellipse 42% 35% at 54% 102%,rgba(213,55,24,.19),transparent 78%);
  mix-blend-mode:screen;
  will-change:opacity, transform;
  animation:auronisFireBreath 5.6s ease-in-out infinite;
}
.auronis-atmosphere-rays {
  position:absolute;inset:-95% -35%;
  background:conic-gradient(from 8deg at 50% 48%, transparent 0 13deg,rgba(253,170,89,.045) 17deg,transparent 21deg 63deg,rgba(245,109,47,.057) 67deg,transparent 71deg 125deg,rgba(250,180,112,.043) 128deg,transparent 135deg 220deg,rgba(244,86,42,.045) 225deg,transparent 231deg 360deg);
  mix-blend-mode:screen; opacity:.8;
  will-change:transform,opacity;
  animation:auronisLightRays 36s linear infinite;
}
/* Ember DOM elements are generated once, not added on every animation frame. */
.auronis-atmosphere-embers {
  position:absolute; inset:0; overflow:hidden;
  pointer-events:none;
}
.auronis-atmosphere-embers i {
  position:absolute; left:var(--x); bottom:-12px;
  width:var(--size);height:var(--size);border-radius:50%;
  background:radial-gradient(circle at 45% 45%,#fff8c9 0%,#ffd184 22%,#fa833b 49%,rgba(215,49,26,.12) 78%,transparent 100%);
  box-shadow:0 0 7px rgba(255,181,89,.83),0 0 20px rgba(230,89,36,.48);
  opacity:0; will-change:transform, opacity;
  animation:auronisEmberFlight var(--duration) linear var(--delay) infinite;
}
.auronis-atmosphere-embers i:nth-child(3n){filter:blur(.65px);}
.auronis-atmosphere-embers i:nth-child(7n){filter:blur(1.8px);}

@keyframes auronisLandscapeDrift {
  0%{transform:scale(1.02) translate3d(-1.9%,1%,0);opacity:.14}
  50%{opacity:.26}
  100%{transform:scale(1.12) translate3d(2%,-2.2%,0);opacity:.2}
}
@keyframes auronisSmokeDrift {
  0%{transform:translate3d(-3%,0,0) scale(.96);opacity:.68}
  100%{transform:translate3d(4%,-3.5%,0) scale(1.05);opacity:1}
}
@keyframes auronisFireBreath {
  0%,100%{opacity:.52;transform:scale(.98) translateY(2%)}
  50%{opacity:.94;transform:scale(1.05) translateY(-2%)}
}
@keyframes auronisLightRays {
  0%{transform:rotate(-8deg)} 100%{transform:rotate(352deg)}
}
@keyframes auronisEmberFlight {
  0%{transform:translate3d(0,0,0) scale(.45);opacity:0}
  9%{opacity:var(--alpha)}
  65%{opacity:calc(var(--alpha) * .7)}
  100%{transform:translate3d(var(--drift),calc(-1 * var(--height)),0) scale(1.25);opacity:0}
}
@media(max-width:760px){
  .auronis-atmosphere-landscape{opacity:.15;}
  .auronis-atmosphere-mist{filter:blur(29px);}
  .auronis-atmosphere-aura{opacity:.7;}
}
@media(prefers-reduced-motion:reduce){
  .auronis-atmosphere-landscape,
  .auronis-atmosphere-mist,
  .auronis-atmosphere-aura,
  .auronis-atmosphere-rays,
  .auronis-atmosphere-embers i{animation:none !important;will-change:auto !important;}
  .auronis-atmosphere-embers{display:none !important;}
}
