/* Vishala Space website: deep black, gold, ice. Same palette as the episodes. */
/* self-hosted fonts (no request to Google): Cinzel + Manrope SIL OFL 1.1, Syncopate Apache 2.0, licences in /fonts */
@font-face{font-family:'Cinzel';font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/cinzel-latin.woff2) format('woff2')}
@font-face{font-family:'Manrope';font-style:normal;font-weight:200 800;font-display:swap;src:url(/fonts/manrope-latin.woff2) format('woff2')}
@font-face{font-family:'Syncopate';font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/syncopate-latin.woff2) format('woff2')}
:root{
  --bg:#02030a; --ink:#EEF3FF; --dim:#9AA6C2; --faint:#5C6684;
  --gold:#F6C27A; --gold2:#FFE7A8; --ice:#8EC5FF; --line:rgba(246,194,122,.28);
  --panel:rgba(4,6,16,.62); --panelb:rgba(142,197,255,.16);
  --sans:'Manrope',system-ui,sans-serif; --wide:'Syncopate',sans-serif; --serif:'Cinzel',serif;
  --nav:72px; --gutter:clamp(16px,4vw,56px);
}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--bg);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;scroll-behavior:smooth}
body{background:var(--bg);overflow-x:hidden}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
img{display:block;max-width:100%}

#gl{position:fixed;inset:0;width:100vw;height:100vh;display:block;z-index:0}
#shade{position:fixed;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,rgba(2,3,10,.92) 0%,rgba(2,3,10,.7) 26%,rgba(2,3,10,0) 46%),
             radial-gradient(ellipse at 70% 50%,rgba(2,3,10,0) 40%,rgba(2,3,10,.55) 100%)}

/* ---- nav ---- */
.nav{position:fixed;top:0;left:0;right:0;height:var(--nav);z-index:20;display:flex;align-items:center;justify-content:space-between;
  padding:0 var(--gutter);background:linear-gradient(180deg,rgba(2,3,10,.85),rgba(2,3,10,0))}
.brand{font-family:var(--serif);text-align:center;line-height:1;display:inline-block}
.brand span{display:block;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;font-weight:700}
.brand .bv{font-size:22px;letter-spacing:.07em;margin-right:-.07em;
  background-image:linear-gradient(180deg,#FFF3D0 0%,#F3DDA2 28%,#D4AE52 55%,#A8782A 68%,#F0D48C 73%,#7D5A1C 100%);
  filter:drop-shadow(0 0 10px rgba(246,194,122,.25))}
.brand .bs{font-size:12.5px;letter-spacing:.52em;margin-right:-.52em;margin-top:5px;background-image:linear-gradient(180deg,#fff,#E4F0FF 55%,#C2D6EE)}
.nav nav{display:flex;gap:28px;align-items:center;font-family:var(--wide);font-size:10.5px;letter-spacing:.22em;text-transform:uppercase}
.nav nav a{color:var(--dim);transition:color .2s}
.nav nav a:hover{color:var(--gold2)}
.nav nav a.yt{color:var(--gold2);border:1px solid rgba(246,194,122,.6);border-radius:999px;padding:9px 16px 8px;box-shadow:0 0 16px rgba(246,194,122,.15) inset}
.nav nav a.yt:hover{background:rgba(246,194,122,.12)}
.nav .menu{display:none}

/* ---- story panels ---- */
#story{position:relative;z-index:5;pointer-events:none}
#story .box{pointer-events:auto}
.panel{min-height:100vh;display:flex;align-items:center;padding:calc(var(--nav) + 24px) var(--gutter) 48px}
.panel .box{width:min(440px,100%);will-change:opacity,transform}
.kicker{font-family:var(--wide);font-size:11px;letter-spacing:.28em;color:var(--gold);text-transform:uppercase;display:flex;align-items:center;gap:12px;margin-bottom:18px}
.kicker i{display:inline-block;width:28px;height:1px;background:var(--gold);opacity:.7}
.panel h1{font-family:var(--wide);font-weight:700;font-size:clamp(30px,4.2vw,52px);line-height:1.12;letter-spacing:.02em;text-transform:uppercase;margin-bottom:20px}
.panel h1 em{font-style:normal;color:transparent;background:linear-gradient(180deg,#FFF6E6,#F6C27A);-webkit-background-clip:text;background-clip:text}
.panel h2{font-weight:700;font-size:clamp(24px,2.6vw,34px);line-height:1.22;margin-bottom:14px;letter-spacing:-.005em}
.lead{font-size:17px;line-height:1.6;color:var(--dim);margin-bottom:24px}
.where{font-size:14.5px;line-height:1.55;color:var(--dim);margin-bottom:20px}
.where b{color:var(--ice);font-weight:600}
.stats{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:18px}
.chip{font-family:var(--wide);font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;padding:7px 12px 6px;border-radius:999px;border:1px solid var(--panelb);color:var(--dim);background:rgba(4,8,18,.5)}
.chip.live{border-color:rgba(246,194,122,.7);color:var(--gold2)}
.btn{display:inline-flex;align-items:center;gap:10px;font-family:var(--wide);font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;
  padding:14px 22px 13px;border-radius:999px;border:1px solid rgba(246,194,122,.75);color:var(--gold2);background:rgba(20,14,4,.45);transition:background .2s,box-shadow .2s}
.btn:hover{background:rgba(246,194,122,.16);box-shadow:0 0 24px rgba(246,194,122,.25)}
.btn.ghost{border-color:var(--panelb);color:var(--ink);background:rgba(4,8,18,.45)}
.btns{display:flex;gap:12px;flex-wrap:wrap}

/* episode rows inside a season panel and the drawer */
.eps{list-style:none;display:flex;flex-direction:column;gap:8px;margin-bottom:20px}
.ep{display:flex;gap:12px;align-items:center;padding:8px;border-radius:12px;border:1px solid transparent;background:rgba(4,8,18,.45);transition:border-color .2s,background .2s}
.ep.go{cursor:pointer}
.ep.go:hover{border-color:rgba(246,194,122,.45);background:rgba(20,14,4,.5)}
.ep .th{flex:none;width:96px;aspect-ratio:16/9;border-radius:7px;overflow:hidden;background:#070b18;border:1px solid rgba(142,197,255,.12);position:relative;display:grid;place-items:center}
.ep .th img{width:100%;height:100%;object-fit:cover}
.ep .th span{font-family:var(--wide);font-size:8.5px;letter-spacing:.12em;color:var(--faint);text-align:center;padding:0 6px;line-height:1.35}
.ep .tx{min-width:0;display:block}
.ep .t,.ep .m{display:block}
.ep .t{font-size:13.5px;font-weight:600;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ep .m{font-family:var(--wide);font-size:8.5px;letter-spacing:.18em;color:var(--faint);margin-top:5px;text-transform:uppercase}
.ep .m b{color:var(--gold);font-weight:700}
.ep .m b.soon{color:var(--ice)}

/* latest episode card in the hero */
.latest{display:flex;gap:14px;align-items:center;padding:10px;border-radius:14px;border:1px solid rgba(246,194,122,.35);background:rgba(10,8,4,.5);margin-bottom:22px;cursor:pointer;transition:background .2s}
.latest:hover{background:rgba(30,22,6,.55)}
.latest img{width:150px;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:9px}
.latest > span,.latest .m,.latest .t{display:block}
.latest .m{font-family:var(--wide);font-size:9px;letter-spacing:.22em;color:var(--gold);margin-bottom:6px}
.latest .t{font-weight:700;font-size:15px;line-height:1.35}
.hint{margin-top:34px;font-family:var(--wide);font-size:9.5px;letter-spacing:.3em;color:var(--faint);display:flex;align-items:center;gap:12px}
.hint::before{content:'';width:1px;height:34px;background:linear-gradient(var(--gold),transparent);animation:drip 2.2s infinite}
@keyframes drip{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* end section */
.panel.end .box{width:min(980px,100%)}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:26px 0 30px}
.tile{padding:22px;border-radius:16px;border:1px solid var(--panelb);background:rgba(4,6,16,.84);backdrop-filter:blur(8px)}
body.at-end #shade{background:linear-gradient(180deg,rgba(2,3,10,.2) 0%,rgba(2,3,10,.75) 45%,rgba(2,3,10,.92) 100%);transition:background .6s}
.tile h3{font-family:var(--wide);font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold2);margin-bottom:10px}
.tile p{font-size:14px;line-height:1.6;color:var(--dim);margin-bottom:14px}
.tile a.more{font-family:var(--wide);font-size:9.5px;letter-spacing:.2em;color:var(--gold);text-transform:uppercase}
.social{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:28px}
.foot{font-size:12px;line-height:1.7;color:var(--faint);border-top:1px solid rgba(142,197,255,.1);padding-top:18px}
.foot a{color:var(--dim)}

/* ---- 3D labels ---- */
#labels{position:fixed;inset:0;z-index:3;pointer-events:none}
.lab{position:absolute;left:0;top:0;transform:translate(-50%,-50%);display:flex;align-items:center;gap:8px;white-space:nowrap;
  font-family:var(--wide);font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--dim);pointer-events:auto;cursor:pointer;
  padding:6px 11px 5px;border-radius:999px;background:rgba(2,3,10,.55);border:1px solid rgba(142,197,255,.18);transition:opacity .25s,color .2s,border-color .2s}
.lab b{color:var(--ice);font-weight:700}
.lab:hover{color:var(--ink);border-color:rgba(246,194,122,.5)}
.lab.on{color:var(--gold2);border-color:rgba(246,194,122,.75);font-size:10px;box-shadow:0 0 18px rgba(246,194,122,.2)}
.lab.on b{color:var(--gold)}
.lab.off{opacity:0;pointer-events:none}
.scale{position:fixed;left:var(--gutter);bottom:18px;z-index:4;font-family:var(--wide);font-size:8.5px;letter-spacing:.26em;color:var(--faint);pointer-events:none}

/* ---- season rail ---- */
#rail{position:fixed;right:calc(var(--gutter) - 8px);top:50%;transform:translateY(-50%);z-index:15;display:flex;flex-direction:column;gap:6px}
#rail button{position:relative;width:26px;height:20px;display:grid;place-items:center}
#rail button::after{content:'';width:6px;height:6px;border-radius:50%;background:var(--faint);transition:all .25s}
#rail button.on::after{width:9px;height:9px;background:var(--gold);box-shadow:0 0 12px var(--gold)}
#rail button span{position:absolute;right:30px;top:50%;transform:translateY(-50%);white-space:nowrap;font-family:var(--wide);font-size:9px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--ink);background:rgba(2,3,10,.85);padding:6px 10px 5px;border-radius:6px;opacity:0;pointer-events:none;transition:opacity .2s}
#rail button:hover span{opacity:1}

/* ---- hover card for episode stars ---- */
#card{position:fixed;z-index:25;width:250px;pointer-events:none;border-radius:12px;overflow:hidden;background:rgba(4,6,16,.92);border:1px solid rgba(246,194,122,.4);box-shadow:0 10px 40px rgba(0,0,0,.6)}
#card img{width:100%;aspect-ratio:16/9;object-fit:cover}
#card .ph{aspect-ratio:16/9;display:grid;place-items:center;font-family:var(--wide);font-size:13px;letter-spacing:.14em;color:var(--ice);background:radial-gradient(circle,#0b1330,#03050c)}
#card .c{padding:12px}
#card .m{font-family:var(--wide);font-size:8.5px;letter-spacing:.2em;color:var(--gold);margin-bottom:6px}
#card .t{font-size:13.5px;font-weight:600;line-height:1.35}

/* ---- season drawer ---- */
#drawer{position:fixed;top:0;right:0;bottom:0;width:min(440px,100%);z-index:30;background:rgba(3,5,13,.94);backdrop-filter:blur(10px);
  border-left:1px solid rgba(246,194,122,.25);padding:28px 24px;overflow-y:auto;transform:translateX(105%);transition:transform .4s cubic-bezier(.2,.8,.2,1)}
#drawer.open{transform:none}
#drawer .x{position:absolute;top:18px;right:18px;width:38px;height:38px;border-radius:50%;border:1px solid var(--panelb);font-size:18px;color:var(--dim)}
#drawer h2{font-size:24px;line-height:1.25;margin:6px 0 10px;padding-right:40px}
#drawer .where{margin-bottom:18px}

/* ---- video player ---- */
#player{position:fixed;inset:0;z-index:40;background:rgba(0,0,0,.86);display:none;align-items:center;justify-content:center;padding:16px}
#player.open{display:flex}
#player .wrap{width:min(1100px,100%);aspect-ratio:16/9;border-radius:14px;overflow:hidden;border:1px solid rgba(246,194,122,.35);box-shadow:0 0 60px rgba(246,194,122,.12)}
#player iframe{width:100%;height:100%;border:0}
#player .x{position:absolute;top:18px;right:18px;width:44px;height:44px;border-radius:50%;border:1px solid rgba(246,194,122,.5);color:var(--gold2);font-size:20px}

/* ---- loader ---- */
#loader{position:fixed;inset:0;z-index:50;background:var(--bg);display:grid;place-items:center;transition:opacity .8s}
#loader.done{opacity:0;pointer-events:none}
#loader .brand .bv{font-size:34px}
#loader .brand .bs{font-size:19px}

/* ---- phone ---- */
@media (max-width:820px){
  :root{--nav:60px}
  .nav nav a.yt{padding:8px 12px 7px}
  .brand .bv{font-size:18px}.brand .bs{font-size:10.5px}
  #shade{background:linear-gradient(0deg,rgba(2,3,10,.96) 0%,rgba(2,3,10,.82) 38%,rgba(2,3,10,0) 60%)}
  .panel{align-items:flex-end;padding-bottom:28px}
  .panel .box{width:100%}
  .panel h1{font-size:28px}
  .panel h2{font-size:22px}
  .lead{font-size:15px;margin-bottom:18px}
  .where{font-size:13.5px;margin-bottom:14px}
  .eps .ep:nth-child(n+3){display:none}
  .latest img{width:112px}
  #rail{display:none}
  .grid3{grid-template-columns:1fr}
  .scale{display:none}
  .lab{font-size:8px;padding:5px 9px 4px}
  .lab.on{font-size:8.5px}
}

/* ---- 2026-10-23: accessibility, motion control, poster, footer, intro ---- */
.skip{position:fixed;left:16px;top:-60px;z-index:100;padding:10px 16px;border-radius:10px;background:var(--gold);color:#02030a;font-weight:700;transition:top .2s}
.skip:focus{top:12px}
.sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:6px}
.pill{font-family:var(--wide);font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--dim);padding:8px 13px 7px;border-radius:999px;border:1px solid var(--panelb);min-height:32px}
.pill:hover{color:var(--ink);border-color:rgba(246,194,122,.5)}
.pill[aria-pressed="true"]{color:var(--gold2);border-color:rgba(246,194,122,.75)}
#poster{position:fixed;inset:0;width:100vw;height:100vh;object-fit:cover;z-index:0;opacity:.0;transition:opacity 1.2s;pointer-events:none}
body.no-gl #poster,body.gl-lost #poster{opacity:.85}
body.no-gl #gl{display:none}
#gl{opacity:0;transition:opacity 1.6s ease}
body.gl-on #gl{opacity:1}
.panel h2.big{font-family:var(--wide);font-weight:700;font-size:clamp(28px,3.8vw,48px);line-height:1.12;text-transform:uppercase;letter-spacing:.02em;margin-bottom:6px}
.panel h2.big em,.panel h1 em{font-style:normal}
.panel h1 em{background:linear-gradient(100deg,#FFF6E6 0%,#F6C27A 30%,#FFF6E6 45%,#F6C27A 60%,#C9963F 100%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shimmer 6s ease-in-out infinite}
@keyframes shimmer{0%,100%{background-position:100% 0}50%{background-position:0 0}}
.hero .box{animation:rise 1.4s cubic-bezier(.2,.8,.2,1) both .2s}
@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
ol.plain{list-style:none;display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
ol.plain a{font-size:14px;color:var(--ink);line-height:1.45}
ol.plain a:hover{color:var(--gold2)}
.tile p.soon{font-family:var(--wide);font-size:9.5px;letter-spacing:.22em;color:var(--ice);text-transform:uppercase}
#flares{position:fixed;inset:0;z-index:2;pointer-events:none}
#flares i{position:absolute;left:0;top:0;border-radius:50%;mix-blend-mode:screen;transform:translate(-50%,-50%);opacity:0}
.site-foot{position:relative;z-index:6;display:flex;gap:40px;justify-content:space-between;flex-wrap:wrap;padding:34px var(--gutter) 40px;border-top:1px solid rgba(142,197,255,.1);background:rgba(2,3,10,.94);font-size:13px;color:var(--faint);line-height:1.7}
.site-foot a{color:var(--dim)} .site-foot a:hover{color:var(--gold2)}
.site-foot .fl{max-width:360px} .site-foot .fr{max-width:620px}
.site-foot p{margin-top:8px} .site-foot .fine{font-size:11.5px}
.brand.small .bv{font-size:17px}.brand.small .bs{font-size:10px}
body.paused .hero .box,body.paused .panel h1 em,body.paused .hint::before{animation:none}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}html{scroll-behavior:auto}}
@media (max-width:820px){.nav nav a[href="/about/"],.nav nav a[href="/work-with-us/"],.nav nav a[href="/"]{display:none}.nav nav{gap:10px}.pill{padding:7px 10px 6px;font-size:8.5px}.site-foot{gap:10px}}

/* ?snap (screenshots only) */
.snap *,.snap *::before,.snap *::after{transition:none!important;animation:none!important}
@media (max-width:820px){body.home .nav nav a[href="/episodes/"]{display:none}.pill{white-space:nowrap}}

/* ---- 2026-10-23 advanced: cursor glow, HUD, heading reveal, page transitions, star field ---- */
.cursor-glow{position:fixed;left:0;top:0;z-index:60;width:34px;height:34px;border-radius:50%;pointer-events:none;opacity:0;
  border:1px solid rgba(246,194,122,.55);box-shadow:0 0 18px rgba(246,194,122,.35),inset 0 0 12px rgba(246,194,122,.18);mix-blend-mode:screen;transition:opacity .3s}
#hud{position:fixed;right:calc(var(--gutter) + 34px);bottom:46px;z-index:4;display:flex;flex-direction:column;align-items:flex-end;gap:4px;pointer-events:none;text-align:right;
  opacity:0;transform:translateY(10px);transition:opacity .6s,transform .6s}
#hud.on{opacity:1;transform:none}
#hud .pill{font-size:8px;padding:5px 10px 4px;min-height:0;border-color:rgba(246,194,122,.6);color:var(--gold2);margin-bottom:6px;background:rgba(10,8,4,.5)}
#hud .k{font-family:var(--wide);font-size:9.5px;letter-spacing:.28em;color:var(--ice)}
#hud .v{font-family:var(--wide);font-weight:700;font-size:clamp(20px,2.3vw,30px);letter-spacing:.02em;color:transparent;background:linear-gradient(180deg,#FFF6E6,#F6C27A);-webkit-background-clip:text;background-clip:text;filter:drop-shadow(0 0 14px rgba(246,194,122,.35))}
#hud .l{font-size:12.5px;color:var(--dim)}
#hud .tick{width:150px;height:8px;margin-top:6px;stroke:rgba(246,194,122,.7);stroke-width:1;fill:none}
.panel h2 .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em}
.panel h2 .w>span{display:inline-block;transform:translateY(108%);transition:transform .9s cubic-bezier(.2,.8,.2,1)}
.panel.in h2 .w>span{transform:none}
body.paused .panel h2 .w>span{transform:none;transition:none}
#starfield{position:fixed;left:0;top:0;z-index:0;pointer-events:none}
@view-transition{navigation:auto}
::view-transition-old(root){animation:vt-out .35s ease both}
::view-transition-new(root){animation:vt-in .55s cubic-bezier(.2,.8,.2,1) both}
@keyframes vt-out{to{opacity:0;transform:scale(1.015);filter:blur(4px)}}
@keyframes vt-in{from{opacity:0;transform:scale(.985);filter:blur(6px)}}
@media (prefers-reduced-motion:reduce){@view-transition{navigation:none}.panel h2 .w>span{transform:none}}
@media (max-width:820px){#hud{right:var(--gutter);top:calc(var(--nav) + 6px);bottom:auto}#hud .v{font-size:17px}#hud .l{font-size:11px}#hud .tick{display:none}}
@media (max-width:820px){#sound{display:none}}
.nav nav a,.pill{white-space:nowrap}
@media (max-width:1180px){.nav nav{gap:16px}.nav nav a[href="/work-with-us/"],.nav nav a[href="/"]{display:none}}
@media (max-width:820px){#hud{display:none}}

/* ---- 2026-10-23 colour pass: one accent per season (set by map.js), violet haze, glass panels ---- */
@property --acc{syntax:'<color>';inherits:true;initial-value:#F6C27A}
:root{--violet:#9B7CFF;--rose:#FF7AD9;--teal:#5FE3D0}
body{--acc:#F6C27A;transition:--acc 1.4s ease}
.home .kicker{color:var(--acc)}
.home .kicker i{background:var(--acc)}
.home .chip.live{border-color:var(--acc);color:#FFF6E6;box-shadow:0 0 14px -4px var(--acc)}
.home .ep.go:hover{border-color:var(--acc)}
.home .btn{border-color:var(--acc);box-shadow:0 0 24px -10px var(--acc)}
.home .where b{color:var(--acc)}
.lab.on{border-color:var(--acc);box-shadow:0 0 18px -4px var(--acc)}
.lab.on b{color:var(--acc)}
#rail button.on::after{background:var(--acc);box-shadow:0 0 12px var(--acc)}
#hud .pill{border-color:var(--acc)}
#hud .v{background:linear-gradient(180deg,#FFFFFF 0%,#FFF2DC 35%,var(--acc) 100%);-webkit-background-clip:text;background-clip:text}
#hud .tick{stroke:var(--acc)}
.home .panel .box{position:relative;padding:28px 30px 26px;border-radius:24px;
  background:linear-gradient(155deg,rgba(14,14,36,.58) 0%,rgba(6,8,20,.32) 60%,rgba(6,8,20,.12) 100%);
  border:1px solid rgba(255,255,255,.06);box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 30px 90px -40px var(--acc)}
.home .panel .box::before{content:'';position:absolute;inset:-1px;border-radius:24px;padding:1px;pointer-events:none;
  background:linear-gradient(140deg,var(--acc),rgba(155,124,255,.5) 40%,rgba(255,255,255,0) 70%);opacity:.55;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.home .panel.end .box{background:none;border:0;box-shadow:none;padding:0}
.home .panel.end .box::before{display:none}
#shade{background:linear-gradient(90deg,rgba(2,3,10,.88) 0%,rgba(2,3,10,.6) 26%,rgba(2,3,10,0) 46%),
  radial-gradient(ellipse 60% 55% at 16% 52%,rgba(155,124,255,.10),rgba(155,124,255,0) 70%),
  radial-gradient(ellipse at 70% 50%,rgba(2,3,10,0) 40%,rgba(2,3,10,.55) 100%)}
.panel h1 em{background:linear-gradient(100deg,#FFF6E6 0%,#F6C27A 28%,#FFE3F4 42%,#F6C27A 58%,#B79CFF 100%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text}
.tile{background:linear-gradient(160deg,rgba(16,14,38,.86),rgba(4,6,16,.86))}
@media (max-width:820px){.home .panel .box{padding:20px 18px 18px;border-radius:18px}.home .panel .box::before{border-radius:18px}
  #shade{background:linear-gradient(0deg,rgba(2,3,10,.96) 0%,rgba(2,3,10,.8) 40%,rgba(2,3,10,0) 62%),radial-gradient(ellipse 80% 40% at 50% 80%,rgba(155,124,255,.10),rgba(155,124,255,0) 70%)}}
#hud .pill.conv{border-color:rgba(142,197,255,.75);color:#CFE8FF;background:rgba(4,8,18,.55)}

/* ---- QA audit fixes 2026-10-23 ---- */
:root{--faint:#7A85A6}
html{scroll-padding-top:calc(var(--nav) + 16px)}
#poster{background:center/cover no-repeat}
body.no-gl #poster,body.gl-lost #poster{background-image:url(/img/poster_hero.jpg)}
#rail button:focus-visible span{opacity:1}
#sound[aria-pressed="true"]{color:var(--gold2);border-color:rgba(246,194,122,.75)}
@media (max-width:820px){#pause{min-width:34px;padding:6px 9px;font-size:12px;letter-spacing:0}.nav nav{gap:8px}}
@media (max-width:820px){
  .nav nav{font-size:9px;letter-spacing:.14em}
  .brand .bv{font-size:16px}.brand .bs{font-size:9.5px}
  .nav nav a.yt{padding:7px 10px 6px}
  .hero .lead{font-size:14px;line-height:1.5;margin-bottom:14px}
  .hero .hint{display:none}
  .hero .btns{flex-wrap:nowrap}.hero .btn{padding:11px 14px 10px;font-size:9.5px}
  .panel h1{font-size:26px;margin-bottom:12px}
  .latest{margin-bottom:14px;padding:8px}.latest img{width:96px}
  .home .panel{padding-bottom:18px}
}
/* final pass: 4D button, sources link on the map */
#fourd{font-size:10.5px;letter-spacing:.12em;min-width:40px}
#fourd[aria-pressed="true"]{color:#02030a;background:linear-gradient(120deg,var(--gold),#B79CFF);border-color:transparent;box-shadow:0 0 18px rgba(183,156,255,.45)}
.scale{pointer-events:none}
.scale a{pointer-events:auto;color:var(--dim)}
.scale a:hover{color:var(--gold2)}
@media (max-width:820px){#fourd{display:inline-block;padding:6px 9px}}
body.no-gl #fourd,body.gl-lost #fourd{display:none}
.follow{margin-top:26px}.follow .social{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
.panel.end .follow .kicker{margin-bottom:6px}
/* the "not to scale" line sits on the 3D side, never under a text box */
.scale{left:46%;bottom:16px}
@media (max-width:1100px){.scale{left:auto;right:calc(var(--gutter) + 40px);bottom:10px;text-align:right}}
/* calmer flights: more scroll per season (desktop 130 vh, phone 120 vh) */
.home .panel{min-height:130vh}
.home .panel.hero{min-height:100vh}
@media (max-width:820px){.home .panel{min-height:120vh}.home .panel.hero{min-height:100vh}}
/* even calmer: more scroll per season */
.home .panel{min-height:150vh}
.home .panel.hero{min-height:100vh}
@media (max-width:820px){.home .panel{min-height:135vh}.home .panel.hero{min-height:100vh}}