/* Northern Lights only: one continuous atmosphere behind header, content and footer. */
:root[data-atmosphere=aurora]{--paper:#0b2444;--surface:#102e46;--mist:#12354b;--line:#3a596f;--ink:#f4f8fb;--body-ink:#dce7f1;--slate:#bdd1df;--link:#a1dcff}
[data-atmosphere=aurora] body{isolation:isolate;min-height:100svh}
[data-atmosphere=aurora] body{background:#0b2444}
[data-atmosphere=aurora] body::before,[data-atmosphere=aurora] body::after{content:'';position:fixed;inset:-15vh -15vw;z-index:-1;pointer-events:none;will-change:transform;animation:aurora-drift 32s ease-in-out infinite alternate}
[data-atmosphere=aurora] body::before{background:radial-gradient(ellipse at 80% 15%,#14565b 0%,transparent 60%),radial-gradient(ellipse at 10% 85%,#103e52 0%,transparent 58%);opacity:.9}
[data-atmosphere=aurora] body::after{background:radial-gradient(ellipse at 65% 80%,#25477455 0%,transparent 55%),radial-gradient(ellipse at 25% 25%,#26756633 0%,transparent 45%);animation-name:aurora-counter;animation-duration:43s}
[data-atmosphere=aurora] .hero,[data-atmosphere=aurora] .magazine-home,[data-atmosphere=aurora] .climb-hero{background:transparent}
[data-atmosphere=aurora] .header{background:transparent;border-color:#52728b66}
[data-atmosphere=aurora] .footer{background:transparent}
[data-atmosphere=aurora] .front-story,[data-atmosphere=aurora] .card,[data-atmosphere=aurora] .news-card,[data-atmosphere=aurora] .area-card{background:#102e46dd}
[data-atmosphere=aurora] .aurora-shell{background:transparent;border-color:#52728b88}
.atmosphere-toggle{min-height:44px;padding:10px 12px;text-align:left;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink);font:600 13px var(--body)}
.atmosphere-toggle:focus-visible{outline:3px solid var(--orange);outline-offset:3px}
:root[data-motion-paused=true] body::before,:root[data-motion-paused=true] body::after,:root[data-page-hidden=true] body::before,:root[data-page-hidden=true] body::after{animation-play-state:paused}
@keyframes aurora-drift{from{transform:translate3d(-3%,-2%,0) scale(1)}to{transform:translate3d(4%,3%,0) scale(1.07)}}
@keyframes aurora-counter{from{transform:translate3d(3%,2%,0)}to{transform:translate3d(-4%,-3%,0)}}
@media(min-width:1101px) and (max-width:1250px){.header-inner>.nav{gap:13px}.header-inner>.nav a{font-size:13px}.header-inner{gap:14px}}
@media(prefers-reduced-motion:reduce){[data-atmosphere=aurora] body::before,[data-atmosphere=aurora] body::after{animation:none!important;will-change:auto}}
@media print{body::before,body::after{display:none!important}body{background:white!important}.atmosphere-toggle{display:none}}

/* Desktop veil and older-phone arrival fallback. Overscan covers Safari's
   expanding viewport and the content behind its translucent bottom controls. */
@view-transition{navigation:none}
:root::after{content:'';position:fixed;inset:-25vh -10vw;inset:-25lvh -10vw;z-index:2147483647;pointer-events:none;background:radial-gradient(ellipse at 80% 15%,#14565b 0%,transparent 70%),#0b2444;opacity:0;transition:opacity .9s cubic-bezier(.4,0,.2,1)}
:root[data-aurora-navigation=departing]::after{opacity:1;transition-duration:.7s}
:root[data-aurora-navigation=arriving]::after{opacity:1;transition:none}
/* The old phone snapshot stays opaque throughout the dissolve. Fading both
   snapshots would expose the page canvas and recreate the visible gap. */
@media(max-width:700px),(pointer:coarse){
 @view-transition{navigation:auto}
 :root::after{transition-duration:.35s}
 ::view-transition{background:#0b2444;pointer-events:none}
 ::view-transition-group(root){animation:none}
 ::view-transition-image-pair(root){isolation:isolate}
 ::view-transition-old(root){animation:none;opacity:1;mix-blend-mode:normal;z-index:1}
 ::view-transition-new(root){animation:aurora-phone-reveal .45s cubic-bezier(.22,1,.36,1) both;mix-blend-mode:normal;z-index:2}
}
@keyframes aurora-phone-reveal{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){:root::after{display:none!important;transition:none!important}}
@media print{:root::after{display:none!important}}
.atmosphere-toggle{display:none}
[data-atmosphere=aurora] .atmosphere-toggle{display:block}
[data-atmosphere=aurora] #theme-toggle{display:none}
[data-atmosphere=aurora] .header{position:relative}
[data-atmosphere=aurora] .experimental-strip{background:transparent}

@media(prefers-reduced-motion:reduce){::view-transition-old(root),::view-transition-new(root){animation:none!important}[data-atmosphere=aurora] body{animation:none!important}}
