:root{
  --bg:#0a080f;
  --fg:#f1eff5;
  --mut:#6d6a78;
  --line:#1e1a26;
  --acc:#a24bff;
  --acc2:#e04dff;
  --danger:#ff2438;
}
*{margin:0;padding:0;box-sizing:border-box}
/* NOTE: no `scroll-behavior:smooth` here — it corrupts ScrollTrigger's
   measurements on refresh/resize (async smooth jumps mid-measure).
   Anchor links get smooth scrolling via JS instead. */
html,body{background:var(--bg);color:var(--fg)}
body{
  font-family:'Space Grotesk',sans-serif;
  overflow-x:hidden;
  overscroll-behavior-y:none;
  -webkit-font-smoothing:antialiased;
}
body.loading{overflow:hidden}
::selection{background:var(--acc);color:#000}
::-webkit-scrollbar{width:6px}
::-webkit-scrollbar-track{background:var(--bg)}
::-webkit-scrollbar-thumb{background:#26262c;border-radius:3px}
::-webkit-scrollbar-thumb:hover{background:var(--acc)}

/* faint editorial grid — above the opaque 3D canvas so it reads */
body::before{
  content:"";position:fixed;inset:0;z-index:3;pointer-events:none;
  background-image:repeating-linear-gradient(90deg,transparent 0,transparent calc(100%/6 - 1px),rgba(255,255,255,.035) calc(100%/6 - 1px),rgba(255,255,255,.035) calc(100%/6));
}

/* film grain */
.noise{
  position:fixed;inset:-100px;z-index:200;pointer-events:none;opacity:.055;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grain 900ms steps(6) infinite;
}
@keyframes grain{
  0%{transform:translate(0,0)}20%{transform:translate(-30px,20px)}
  40%{transform:translate(20px,-35px)}60%{transform:translate(-25px,-15px)}
  80%{transform:translate(35px,25px)}100%{transform:translate(0,0)}
}

/* CRT scanlines */
.scanlines{
  position:fixed;inset:0;z-index:201;pointer-events:none;opacity:.45;
  background:repeating-linear-gradient(0deg,transparent 0 2px,rgba(0,0,0,.25) 2px 3px);
}
.scanlines::after{
  content:"";position:absolute;inset:0;background:rgba(162,75,255,.025);
  animation:flick 5s steps(80) infinite;
}
@keyframes flick{0%,100%{opacity:.5}7%{opacity:.15}9%{opacity:.6}52%{opacity:.3}54%{opacity:.7}}

/* drifting aurora light — pre-blurred gradients, transform-only anims */
.aurora{
  position:fixed;width:60vmax;height:60vmax;border-radius:50%;z-index:3;pointer-events:none;
  background:radial-gradient(circle,rgba(112,47,196,.14) 0%,rgba(112,47,196,.05) 45%,transparent 70%);
  will-change:transform;mix-blend-mode:screen;
  opacity:var(--aurora-op,1);                /* knob lives in main.js TUNE */
}
.aurora.a1{top:-18vmax;left:-12vmax;animation:aur1 46s ease-in-out infinite alternate}
.aurora.a2{
  bottom:-22vmax;right:-14vmax;
  background:radial-gradient(circle,rgba(224,77,255,.09) 0%,rgba(224,77,255,.04) 45%,transparent 70%);
  animation:aur2 58s ease-in-out infinite alternate;
}
@keyframes aur1{from{transform:translate(0,0) scale(1)}to{transform:translate(14vmax,10vmax) scale(1.25)}}
@keyframes aur2{from{transform:translate(0,0) scale(1.15)}to{transform:translate(-12vmax,-8vmax) scale(.9)}}

/* frame vignette — pulls the eye to center */
.vignette{
  position:fixed;inset:0;z-index:199;pointer-events:none;
  background:radial-gradient(ellipse at center,transparent 58%,rgba(4,2,9,.5) 100%);
}

/* ============ LOADER — CRT TERMINAL ============ */
#loader{
  position:fixed;inset:0;z-index:1000;background:#050506;
  display:flex;align-items:center;justify-content:center;
}
#loader::before{  /* ambient tube glow on the back wall */
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 62% 52% at 50% 54%,rgba(162,75,255,.09),transparent 70%);
}
/* the deck — slim graphite slab with a living neon seam. cyber, not attic. */
.crt-bezel{
  position:relative;width:min(820px,94vw);will-change:transform;
  background:linear-gradient(170deg,#14141b 0%,#0b0b11 45%,#101019 100%);
  border-radius:18px;
  padding:clamp(.8rem,1.8vw,1.3rem) clamp(.8rem,1.8vw,1.3rem) .55rem;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 30px 70px rgba(0,0,0,.75),
    0 60px 160px rgba(0,0,0,.9),
    0 0 90px rgba(162,75,255,.1);
}
/* animated neon seam around the frame */
.crt-edge{
  position:absolute;inset:-1px;border-radius:19px;pointer-events:none;padding:1.5px;
  background:linear-gradient(115deg,#4a2280,#a24bff 30%,#e04dff 50%,#a24bff 70%,#4a2280);
  background-size:300% 300%;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  animation:edgeflow 5.5s ease-in-out infinite;
  filter:drop-shadow(0 0 7px rgba(162,75,255,.55));
}
@keyframes edgeflow{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
.crt-screen{
  position:relative;width:100%;aspect-ratio:16/10;max-height:62vh;
  background:#06040a;overflow:hidden;border-radius:10px;
  border:1px solid #000;
  box-shadow:
    0 0 0 2px #1a1a24,                         /* slim glass lip */
    inset 0 0 70px rgba(0,0,0,.85),
    inset 0 0 26px rgba(162,75,255,.1);
}
@media(max-width:640px){.crt-screen{aspect-ratio:5/6}}
/* slim center column + light-bar base — floats, doesn't squat */
.crt-stand{position:absolute;left:50%;top:100%;transform:translateX(-50%);width:220px;height:44px;pointer-events:none}
.crt-stand::before{  /* neck */
  content:"";position:absolute;left:50%;top:0;transform:translateX(-50%);
  width:34px;height:30px;
  background:linear-gradient(180deg,#15151d,#0a0a10);
  clip-path:polygon(18% 0,82% 0,100% 100%,0 100%);
}
.crt-stand::after{  /* base bar with neon underglow */
  content:"";position:absolute;left:0;right:0;bottom:6px;height:8px;border-radius:5px;
  background:linear-gradient(180deg,#181822,#0b0b12);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.07),
    0 8px 22px rgba(162,75,255,.4),
    0 14px 40px rgba(162,75,255,.18);
}
.crt-inner{
  position:absolute;inset:0;display:flex;flex-direction:column;
  padding:clamp(1rem,3vw,2rem) clamp(1.1rem,3.4vw,2.4rem);
  animation:crtbreathe 7s ease-in-out infinite;    /* phosphor breath — no blinking */
}
@keyframes crtbreathe{0%,100%{opacity:1}50%{opacity:.965}}
/* believable artifact: a thin data-tear line that flashes across rarely */
.crt-glitchline{
  position:absolute;left:0;right:0;top:30%;height:2px;z-index:4;opacity:0;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.16),rgba(162,75,255,.4),rgba(255,255,255,.1),transparent);
}
/* glass stack: glare, scanlines, curvature vignette + rolling band */
.crt-fx{
  position:absolute;inset:0;pointer-events:none;border-radius:inherit;z-index:5;
  background:
    radial-gradient(ellipse at 28% 16%,rgba(255,255,255,.09),transparent 42%),
    repeating-linear-gradient(0deg,rgba(0,0,0,.3) 0 1px,transparent 1px 3px),
    radial-gradient(ellipse at center,transparent 52%,rgba(0,0,0,.6) 100%);
  /* chromatic fringe at the glass edges */
  box-shadow:inset 4px 0 9px -4px rgba(255,40,80,.25),inset -4px 0 9px -4px rgba(60,220,255,.22);
}
.crt-fx::after{
  content:"";position:absolute;left:0;right:0;height:16%;
  background:linear-gradient(rgba(255,255,255,0),rgba(255,255,255,.05),rgba(255,255,255,0));
  animation:crtroll 6.5s linear infinite;
}
@keyframes crtroll{0%{top:-18%}100%{top:110%}}
.crt-flash{position:absolute;inset:0;background:#e7ffee;opacity:0;pointer-events:none;z-index:6}
.crt-power{position:absolute;inset:0;background:#fff;opacity:0;transform:scaleY(.004);pointer-events:none;z-index:7}
/* slim chin: etched brand + micro status LEDs, nothing bulky */
.crt-base{display:flex;justify-content:space-between;align-items:center;margin-top:.55rem;padding:.15rem .35rem 0}
.crt-brand{font-family:'JetBrains Mono',monospace;font-size:.56rem;letter-spacing:.3em;color:#4e4e5c;text-shadow:0 1px 0 rgba(0,0,0,.8)}
.crt-ctrl{display:flex;align-items:center;gap:.55rem}
.mled{width:4px;height:4px;border-radius:50%}
.mled.m1{background:var(--acc);box-shadow:0 0 6px var(--acc);animation:live 1.8s ease-in-out infinite}
.mled.m2{background:#39ff6a;box-shadow:0 0 6px #39ff6a;animation:live 2.6s ease-in-out infinite .4s}
.mled.m3{background:#3a2a4a;box-shadow:none}

/* on-screen content — purple phosphor */
#loader .l-word{display:flex;overflow:hidden;justify-content:center;margin-bottom:.6rem;flex:0 0 auto}
#loader .l-word span{
  font-family:'Anton',sans-serif;font-size:clamp(1.7rem,5vw,3rem);
  line-height:1;letter-spacing:.06em;color:#ead9ff;
  text-shadow:0 0 18px rgba(162,75,255,.75),0 0 2px rgba(234,217,255,.9);
  transform:translateY(110%);
}
.crt-boot{display:flex;flex-direction:column;flex:1;min-height:0}
.crt-head{
  font-family:'JetBrains Mono',monospace;font-size:.56rem;letter-spacing:.12em;color:#5d5470;
  padding-bottom:.5rem;border-bottom:1px solid #221a30;margin-bottom:.5rem;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
#loader .l-boot{
  flex:1;min-height:0;overflow:hidden;text-align:left;
  display:flex;flex-direction:column;gap:.3rem;justify-content:flex-end;
  font-family:'JetBrains Mono',monospace;font-size:.64rem;letter-spacing:.08em;color:#b1a0d6;
  text-shadow:0 0 6px rgba(162,75,255,.35);
}
#loader .l-boot .ln{flex:0 0 auto;line-height:1.6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#loader .l-boot .ok{color:#58ff9d;text-shadow:0 0 8px rgba(57,255,106,.5)}
#loader .l-boot .warn{color:var(--acc2);text-shadow:0 0 8px rgba(224,77,255,.5)}
#loader .l-boot .dim{color:#4f4763}
.cursor-blink{display:inline-block;width:.55em;height:1em;background:var(--acc);vertical-align:-.15em;animation:blinkc 1s steps(1) infinite}
@keyframes blinkc{50%{opacity:0}}
.crt-load{display:flex;align-items:center;gap:1rem;margin-top:.7rem;flex:0 0 auto}
#loader .l-bar{flex:1;height:2px;background:#241c33;position:relative;overflow:hidden}
#loader .l-bar i{position:absolute;inset:0;background:var(--acc);box-shadow:0 0 10px var(--acc);transform:scaleX(0);transform-origin:left}
#loader .l-pct{font-family:'JetBrains Mono',monospace;font-size:.62rem;letter-spacing:.3em;color:#6d6480;white-space:nowrap}
#loader .l-pct b{color:var(--acc);font-weight:700}

/* login phase — shown once the boot log lands on the prompt */
.crt-login{
  display:none;flex-direction:column;justify-content:center;flex:1;min-height:0;gap:.95rem;
  font-family:'JetBrains Mono',monospace;text-align:left;
}
.lg-title{font-size:.82rem;letter-spacing:.3em;color:#ead9ff;text-shadow:0 0 14px rgba(162,75,255,.7)}
.lg-sub{font-size:.58rem;letter-spacing:.26em;color:#6d6480;margin-bottom:.6rem}
.lg-row{font-size:.76rem;letter-spacing:.16em;color:#b1a0d6}
.lg-row b{color:#ead9ff;font-weight:400}
#pwDots{letter-spacing:.3em}
.lg-msg{min-height:1.3em;font-size:.7rem;letter-spacing:.22em;color:#58ff9d;text-shadow:0 0 10px rgba(57,255,106,.6)}
#loader .l-enter{
  margin-top:.6rem;align-self:flex-start;
  font-family:'JetBrains Mono',monospace;font-size:.72rem;letter-spacing:.35em;
  color:#ead9ff;background:none;border:1px solid #3a2f52;padding:.95rem 2.2rem;cursor:pointer;
  animation:pulseb 2s ease-in-out infinite;transition:color .3s;
  text-shadow:0 0 10px rgba(162,75,255,.6);
}
#loader .l-enter:hover{color:var(--acc)}
@keyframes pulseb{0%,100%{border-color:#3a2f52}50%{border-color:var(--acc)}}

/* continue phase — one clean beat between boot and login */
.crt-continue{
  display:none;flex-direction:column;justify-content:center;align-items:flex-start;
  flex:1;min-height:0;gap:1.1rem;font-family:'JetBrains Mono',monospace;text-align:left;
}
/* tiny language toggle on the login screen */
.lg-lang{
  align-self:flex-start;margin-top:.2rem;background:none;border:0;cursor:pointer;
  font-family:'JetBrains Mono',monospace;font-size:.6rem;letter-spacing:.3em;
  color:#6d6480;transition:color .3s;padding:0;
}
.lg-lang:hover{color:var(--acc)}

/* ============ FIXED CHROME ============ */
#gl{position:fixed;inset:0;z-index:2;pointer-events:none}

/* DOM matrix-rain layer — above the 3D canvas (which is opaque),
   below the content, so the rain actually shows */
#matrix{position:fixed;inset:0;z-index:3;pointer-events:none;opacity:var(--matrix-op,.14)}   /* knob lives in main.js TUNE */

/* HUD chips */
.hud{
  position:fixed;z-index:140;font-family:'JetBrains Mono',monospace;
  font-size:.6rem;letter-spacing:.18em;color:#5f5f68;pointer-events:none;
  display:flex;align-items:center;gap:.5rem;
}
.hud .dotlive{width:6px;height:6px;border-radius:50%;background:var(--acc);box-shadow:0 0 8px var(--acc);animation:live 1.4s ease-in-out infinite}
@keyframes live{50%{opacity:.25}}
.hud.sysinfo{right:2rem;bottom:1.4rem;text-align:right}
.hud.sysinfo b{color:var(--acc);font-weight:400}
@media(max-width:820px){.hud.sysinfo{display:none}}

/* HERO TITLE — government word-cycle line under the header */
.hero-title{
  position:absolute;top:15vh;left:0;right:0;z-index:12;text-align:center;
  padding:0 1.2rem;pointer-events:none;opacity:0;
}
.hero-title .ht-pre{
  display:block;font-family:'JetBrains Mono',monospace;font-size:.6rem;letter-spacing:.4em;
  color:var(--acc);margin-bottom:1rem;opacity:.8;
}
.hero-title .ht-line{
  font-family:'JetBrains Mono',monospace;font-weight:400;
  font-size:clamp(.82rem,1.9vw,1.35rem);letter-spacing:.06em;color:#c4c4ca;line-height:1.5;
}
.ht-word{
  color:var(--acc);font-weight:700;position:relative;
  padding:.05em .25em;white-space:nowrap;
  text-shadow:0 0 16px rgba(162,75,255,.6);
}
.ht-word::before,.ht-word::after{content:"";position:absolute;left:0;right:0;height:1px;background:var(--acc);opacity:.5}
.ht-word::before{top:-.05em}.ht-word::after{bottom:-.05em}
.ht-word.glitching{animation:wordglitch .09s steps(2) 6}
@keyframes wordglitch{0%{transform:translate(0,0)}25%{transform:translate(-2px,1px)}50%{transform:translate(2px,-1px);opacity:.7}75%{transform:translate(-1px,-1px)}100%{transform:translate(0,0)}}
/* mobile: keep the manifesto clear of the whoami corner label */
@media(max-width:820px){
  .hero-title{top:max(12.5rem,22vh)}
  .hero-title .ht-line{font-size:.8rem;line-height:1.7}
}
.progress{
  position:fixed;top:0;left:0;right:0;height:2px;z-index:300;
  background:var(--acc);transform:scaleX(0);transform-origin:left;
}
.nav{
  position:fixed;top:0;left:0;right:0;z-index:150;
  display:flex;align-items:center;justify-content:space-between;
  padding:1.4rem 2rem;mix-blend-mode:difference;color:#fff;
}
.nav .logo{
  font-family:'Anton',sans-serif;font-size:1.35rem;letter-spacing:.06em;
  color:#fff;text-decoration:none;
}
.nav .logo sup{font-size:.55em;color:var(--acc)}
.nav .links{display:flex;gap:2.2rem}
.nav .links a{
  font-family:'JetBrains Mono',monospace;font-size:.68rem;letter-spacing:.28em;
  color:#fff;text-decoration:none;opacity:.65;transition:opacity .25s;
}
.nav .links a:hover{opacity:1}
.nav .clock{
  font-family:'JetBrains Mono',monospace;font-size:.68rem;letter-spacing:.18em;opacity:.65;
}
.nav-right{display:flex;align-items:center;gap:1.8rem}
.sound{
  display:flex;align-items:center;gap:.55rem;background:none;border:0;cursor:pointer;padding:0;
  font-family:'JetBrains Mono',monospace;font-size:.68rem;letter-spacing:.28em;
  color:#fff;opacity:.65;transition:opacity .25s;
}
.sound:hover{opacity:1}
/* language toggle chip */
.lang{
  background:none;border:1px solid rgba(255,255,255,.28);cursor:pointer;
  font-family:'JetBrains Mono',monospace;font-size:.62rem;letter-spacing:.22em;
  color:#fff;opacity:.65;padding:.28rem .55rem;transition:opacity .25s,border-color .25s;
}
.lang:hover{opacity:1;border-color:#fff}
.sound .eq{height:10px}
.sound .eq i{width:2px;background:var(--acc)}
body.muted .eq i{animation-play-state:paused}
@media(max-width:820px){.nav .links{display:none}.nav .clock{display:none}}

/* mobile hamburger + full-screen section-jump menu */
.menu-btn{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:6px 2px}
.menu-btn i{display:block;width:22px;height:2px;background:#fff;transition:transform .3s,opacity .3s}
body.menu-open .menu-btn i:nth-child(1){transform:translateY(7px) rotate(45deg)}
body.menu-open .menu-btn i:nth-child(2){opacity:0}
body.menu-open .menu-btn i:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media(max-width:820px){.menu-btn{display:flex}}
.m-menu{
  position:fixed;inset:0;z-index:145;background:rgba(7,5,12,.96);
  display:flex;flex-direction:column;justify-content:center;gap:.2rem;
  padding:0 clamp(1.6rem,8vw,4rem);opacity:0;pointer-events:none;transition:opacity .35s;
}
body.menu-open{overflow:hidden}
body.menu-open .m-menu{opacity:1;pointer-events:auto}
.m-menu a{
  display:flex;align-items:baseline;gap:1.1rem;text-decoration:none;color:var(--fg);
  padding:.45rem 0;border-bottom:1px solid var(--line);
  transform:translateX(-18px);opacity:0;transition:transform .45s,opacity .45s;
}
.m-menu a span{font-family:'JetBrains Mono',monospace;font-size:.68rem;letter-spacing:.2em;color:var(--acc)}
.m-menu a b{font-family:'Anton',sans-serif;font-weight:400;font-size:clamp(2rem,8.5vw,3.2rem);letter-spacing:.02em;text-transform:uppercase}
body.menu-open .m-menu a{transform:none;opacity:1}
body.menu-open .m-menu a:nth-child(1){transition-delay:.04s}
body.menu-open .m-menu a:nth-child(2){transition-delay:.09s}
body.menu-open .m-menu a:nth-child(3){transition-delay:.14s}
body.menu-open .m-menu a:nth-child(4){transition-delay:.19s}
body.menu-open .m-menu a:nth-child(5){transition-delay:.24s}
body.menu-open .m-menu a:nth-child(6){transition-delay:.29s}
body.menu-open .m-menu a:nth-child(7){transition-delay:.34s}
body.menu-open .m-menu a:nth-child(8){transition-delay:.39s}
/* 8 nav links — tighten the desktop bar so it never wraps */
@media(max-width:1240px){.nav .links{gap:1.3rem}.nav .links a{font-size:.6rem;letter-spacing:.2em}}

/* custom cursor */
.cursor-dot,.cursor-ring{position:fixed;top:0;left:0;z-index:999;pointer-events:none;border-radius:50%;display:none}
@media(pointer:fine){.cursor-dot,.cursor-ring{display:block}}
.cursor-dot{width:6px;height:6px;background:var(--acc);transform:translate(-50%,-50%)}
.cursor-ring{
  width:36px;height:36px;border:1px solid rgba(242,242,240,.4);
  transform:translate(-50%,-50%);transition:width .25s,height .25s,border-color .25s;
  mix-blend-mode:difference;
}
body.cursor-big .cursor-ring{width:64px;height:64px;border-color:var(--acc)}

/* ============ SECTIONS ============ */
main{position:relative;z-index:10}
.sec{position:relative;padding:0 clamp(1.2rem,5vw,4rem)}
.label{
  font-family:'JetBrains Mono',monospace;font-size:.68rem;letter-spacing:.32em;
  color:var(--mut);text-transform:uppercase;
}
.label b{color:var(--acc);font-weight:400}
.bg-word{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  font-family:'Anton',sans-serif;font-size:26vw;line-height:1;letter-spacing:.02em;
  color:transparent;-webkit-text-stroke:1px #1a1a1f;pointer-events:none;user-select:none;
  white-space:nowrap;z-index:-1;
}
/* accent words glow softly in their own color */
.about h2 i,.truth h2 i,.signal h2 i,.archive h2 i,.footer .giant i{text-shadow:0 0 26px currentColor}

/* HERO */
.hero{height:100vh;height:100svh}
.hero .corner{position:absolute;font-family:'JetBrains Mono',monospace;font-size:.68rem;letter-spacing:.28em;color:var(--mut)}
.hero .c-tl{top:6.5rem;left:clamp(1.2rem,5vw,4rem)}
.hero .c-tr{top:6.5rem;right:clamp(1.2rem,5vw,4rem);text-align:right}
.hero .c-bl{bottom:2.2rem;left:clamp(1.2rem,5vw,4rem)}
.hero .c-br{bottom:2.2rem;right:clamp(1.2rem,5vw,4rem);text-align:right}
.hero .corner .big{
  display:block;font-family:'Anton',sans-serif;font-size:1.05rem;color:var(--fg);
  letter-spacing:.12em;margin-top:.45rem;
}
.hero .idx{
  position:absolute;bottom:1.6rem;left:50%;transform:translateX(-50%);
  font-family:'Anton',sans-serif;font-size:1rem;color:var(--mut);letter-spacing:.3em;
}
.scroll-hint{
  position:absolute;bottom:5rem;left:50%;transform:translateX(-50%);
  display:flex;flex-direction:column;align-items:center;gap:.6rem;
}
.scroll-hint span{font-family:'JetBrains Mono',monospace;font-size:.6rem;letter-spacing:.4em;color:var(--mut)}
.scroll-hint i{width:1px;height:44px;background:linear-gradient(var(--acc),transparent);animation:drip 1.6s ease-in-out infinite}
@keyframes drip{0%{transform:scaleY(0);transform-origin:top}45%{transform:scaleY(1);transform-origin:top}55%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
.fallback-title{
  display:none;position:absolute;inset:0;align-items:center;justify-content:center;
  font-family:'Anton',sans-serif;font-size:clamp(4rem,18vw,15rem);letter-spacing:.02em;
}
.no-webgl .fallback-title{display:flex}
@media(max-width:820px){
  .hero .c-tr,.hero .c-br{display:none}
  .hero .c-bl{bottom:6.8rem}   /* clear of the fixed music chip */
  .hero .idx{display:none}
}

/* MARQUEE */
.marquee{
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  padding:1.1rem 0;overflow:hidden;position:relative;z-index:10;background:var(--bg);
}
.marquee-inner{display:flex;width:max-content;will-change:transform}
.marquee-inner span{
  font-family:'Anton',sans-serif;font-size:clamp(2.2rem,5vw,4rem);line-height:1;
  letter-spacing:.04em;white-space:nowrap;padding-right:1.2rem;color:var(--fg);
}
.marquee-inner span em{font-style:normal;color:transparent;-webkit-text-stroke:1px var(--acc)}
.marquee-inner span i{font-style:normal;color:var(--acc)}

/* ABOUT */
.about{padding-top:22vh;padding-bottom:22vh;min-height:160vh}
.about .inner{max-width:640px}
.about h2{
  font-family:'Anton',sans-serif;font-size:clamp(2.6rem,6.5vw,5.5rem);line-height:1.02;
  letter-spacing:.01em;margin:1.4rem 0 2.4rem;text-transform:uppercase;
}
.about h2 em{font-style:normal;color:transparent;-webkit-text-stroke:1.5px var(--fg)}
.about h2 i{font-style:normal;color:var(--acc)}
.about p{color:#b9b9bd;font-size:clamp(1rem,1.4vw,1.15rem);line-height:1.75;max-width:520px}
.about p b{color:var(--fg)}
.stats{
  display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);
  border:1px solid var(--line);margin-top:4.5rem;max-width:640px;
}
.stat{background:var(--bg);padding:1.8rem 1.6rem}
.stat .v{font-family:'Anton',sans-serif;font-size:clamp(1.8rem,3.4vw,2.8rem);letter-spacing:.02em}
.stat .v i{font-style:normal;color:var(--acc)}
.stat .k{font-family:'JetBrains Mono',monospace;font-size:.62rem;letter-spacing:.28em;color:var(--mut);margin-top:.5rem}

/* DISCIPLINES — module cards (info panels, not links) */
.disciplines{padding-top:16vh;padding-bottom:20vh;min-height:150vh}
.disciplines .head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:3.2rem}
.mods{display:grid;grid-template-columns:repeat(2,1fr);gap:1.2rem}
.mod{
  position:relative;border:1px solid var(--line);background:rgba(10,8,15,.66);
  padding:1.7rem 1.5rem 1.4rem;backdrop-filter:blur(4px);overflow:hidden;
  transition:border-color .35s;                /* transform belongs to the JS tilt */
}
.mod::before{
  content:"";position:absolute;top:0;left:0;width:22px;height:22px;
  border-top:1px solid var(--acc);border-left:1px solid var(--acc);opacity:.7;
}
.mod::after{
  content:"";position:absolute;bottom:0;right:0;width:22px;height:22px;
  border-bottom:1px solid var(--acc);border-right:1px solid var(--acc);opacity:.7;
}
.mod:hover{border-color:#3a2f52}
.mod .mhead{
  display:flex;justify-content:space-between;align-items:center;
  font-family:'JetBrains Mono',monospace;font-size:.62rem;letter-spacing:.24em;color:var(--mut);
}
.mod .mhead b{color:var(--acc);font-weight:400}
.mod .ti{
  font-family:'Anton',sans-serif;font-size:clamp(1.9rem,3.2vw,3rem);line-height:1;
  letter-spacing:.02em;text-transform:uppercase;margin:1.1rem 0 .9rem;
}
.mod .de{color:#b4b0c0;font-size:.92rem;line-height:1.65}
.mod .mfoot{
  margin-top:1.4rem;padding-top:.9rem;border-top:1px dashed #241e33;
  display:flex;align-items:center;gap:.55rem;
  font-family:'JetBrains Mono',monospace;font-size:.6rem;letter-spacing:.22em;color:var(--mut);
}
.mod .mfoot i{width:6px;height:6px;border-radius:50%;background:#27c93f;box-shadow:0 0 6px #27c93f;animation:live 1.6s ease-in-out infinite}
@media(max-width:900px){
  .mods{grid-template-columns:1fr}
  .disciplines .head{flex-direction:column;align-items:flex-start;gap:.6rem}
}

.mod .mfoot .i2{width:6px;height:6px;border-radius:50%;background:#ff8400;box-shadow:0 0 6px #ff8400;animation:live 1.6s ease-in-out infinite}
@media(max-width:900px){
  .mods{grid-template-columns:1fr}
  .disciplines .head{flex-direction:column;align-items:flex-start;gap:.6rem}
}

/* CONNECT */
.connect{padding-top:18vh;padding-bottom:24vh;min-height:130vh}
.connect .head{margin-bottom:4rem}
.connect h2{
  font-family:'Anton',sans-serif;font-size:clamp(3rem,9vw,8rem);line-height:.95;
  text-transform:uppercase;margin-top:1.2rem;
}
.connect h2 em{font-style:normal;color:transparent;-webkit-text-stroke:1.5px var(--fg)}
/* connect link cards — same skin as the CRAFT modules, but clickable:
   the purple fill sweep from the old rows lives on */
.links-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.2rem}
@media(max-width:560px){.links-grid{grid-template-columns:1fr}}
.link-card{
  position:relative;display:block;border:1px solid var(--line);background:rgba(10,8,15,.66);
  padding:1.6rem 1.4rem 1.2rem;text-decoration:none;color:inherit;overflow:hidden;
  isolation:isolate;backdrop-filter:blur(4px);
  transition:border-color .35s;                /* transform belongs to the JS tilt */
}
.link-card::after{
  content:"";position:absolute;inset:0;background:var(--acc);z-index:-1;
  transform:translateY(101%);transition:transform .4s cubic-bezier(.7,0,.2,1);
}
.link-card:hover{border-color:var(--acc)}
.link-card:hover::after{transform:translateY(0)}
.link-card .lhead{
  display:flex;justify-content:space-between;align-items:center;
  font-family:'JetBrains Mono',monospace;font-size:.62rem;letter-spacing:.24em;color:var(--mut);
  transition:color .3s;
}
.link-card .lhead b{color:var(--acc);font-weight:400;transition:color .3s}
.link-card .ar{font-size:1.25rem;color:var(--mut);transition:transform .4s cubic-bezier(.2,.8,.2,1),color .3s}
.link-card .ti{
  font-family:'Anton',sans-serif;font-size:clamp(1.7rem,2.5vw,2.7rem);line-height:1;
  letter-spacing:.02em;text-transform:uppercase;margin:1.2rem 0 .7rem;transition:color .3s;
}
.link-card .hd{font-family:'JetBrains Mono',monospace;font-size:.72rem;letter-spacing:.15em;color:#aaa6b8;transition:color .3s}
.link-card .lfoot{
  margin-top:1.3rem;padding-top:.9rem;border-top:1px dashed #241e33;
  display:flex;align-items:center;gap:.55rem;
  font-family:'JetBrains Mono',monospace;font-size:.6rem;letter-spacing:.22em;color:var(--mut);
  transition:color .3s,border-top-color .3s;
}
.link-card .lfoot i{width:6px;height:6px;border-radius:50%;background:#27c93f;box-shadow:0 0 6px #27c93f;animation:live 1.6s ease-in-out infinite}
.link-card:hover .ti{color:#000}
.link-card:hover .ar{color:#000;transform:translate(4px,-4px) rotate(45deg)}
.link-card:hover .lhead,.link-card:hover .lhead b,.link-card:hover .hd,.link-card:hover .lfoot{color:rgba(0,0,0,.7)}
.link-card:hover .lfoot{border-top-color:rgba(0,0,0,.3)}

/* ============ TRUTH — anti-phone ============ */
.truth{padding-top:18vh;padding-bottom:20vh;min-height:170vh}
.truth .head{margin-bottom:4rem}
.truth h2{
  font-family:'Anton',sans-serif;font-size:clamp(2.4rem,6.5vw,5.6rem);line-height:1.02;
  text-transform:uppercase;margin-top:1.2rem;
}
.truth h2 i{font-style:normal;color:var(--danger)}
.truth h2 em{font-style:normal;color:transparent;-webkit-text-stroke:1.5px var(--fg)}
.truth .label b{color:var(--danger)}
.truth-grid{display:grid;grid-template-columns:minmax(280px,400px) 1fr;gap:clamp(2rem,6vw,6rem);align-items:start}
.phone-wrap{position:sticky;top:14vh;display:flex;justify-content:center}
@media(max-width:900px){
  .truth-grid{grid-template-columns:1fr}
  .phone-wrap{position:relative;top:0;margin-bottom:3.5rem}
}

/* the possessed smartphone */
.phone{
  position:relative;width:min(250px,62vw);aspect-ratio:9/19;border-radius:38px;
  border:2px solid #2a2434;background:#07060b;
  box-shadow:0 0 0 6px #131018,0 0 70px rgba(255,36,56,.14),0 40px 90px rgba(0,0,0,.65);
  animation:phoneShake 6s ease-in-out infinite;
}
@keyframes phoneShake{
  0%,86%,100%{transform:rotate(0) translate(0,0)}
  88%{transform:rotate(-1.6deg) translate(-2px,1px)}
  90%{transform:rotate(1.4deg) translate(2px,-1px)}
  92%{transform:rotate(-.9deg) translate(-1px,0)}
  95%{transform:rotate(.5deg) translate(1px,1px)}
}
.phone .notch{position:absolute;top:10px;left:50%;transform:translateX(-50%);width:38%;height:15px;background:#131018;border-radius:9px;z-index:5}
.phone .screen{
  position:absolute;inset:8px;border-radius:30px;overflow:hidden;
  background:radial-gradient(120% 90% at 50% 32%,#1c060b 0%,#0b0308 58%,#050205 100%);
}
.screen .skull-svg{
  position:absolute;left:12%;right:12%;top:13%;height:52%;width:76%;
  filter:drop-shadow(0 0 20px rgba(255,36,56,.4));
  animation:skullGlitch 4.5s steps(1) infinite;
}
@keyframes skullGlitch{
  0%,90%,100%{transform:translate(0);filter:drop-shadow(0 0 20px rgba(255,36,56,.4))}
  91%{transform:translate(-6px,2px);filter:drop-shadow(4px 0 0 rgba(0,255,255,.7)) drop-shadow(-4px 0 0 rgba(255,0,255,.7))}
  93%{transform:translate(5px,-2px) scaleX(1.03)}
  95%{transform:translate(-2px,1px);filter:drop-shadow(-4px 0 0 rgba(0,255,255,.6))}
  97%{transform:translate(0) skewX(2deg)}
}
.skull-svg .jaw{animation:laugh .5s cubic-bezier(.6,0,.4,1) infinite;transform-origin:50% 78%}
@keyframes laugh{0%,100%{transform:translateY(0)}42%{transform:translateY(18px)}58%{transform:translateY(15px)}}
.skull-svg .eyeglow{animation:eyeflick 2.3s steps(1) infinite}
@keyframes eyeflick{0%,80%,100%{opacity:1}82%{opacity:.15}84%{opacity:1}90%{opacity:.35}93%{opacity:1}}
.screen .static{
  position:absolute;inset:0;opacity:.13;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grain 700ms steps(5) infinite;
}
.screen .sweep{
  position:absolute;left:0;right:0;height:26%;pointer-events:none;
  background:linear-gradient(rgba(255,36,56,0),rgba(255,36,56,.13),rgba(255,36,56,0));
  animation:sweep 3.4s linear infinite;
}
@keyframes sweep{0%{top:-30%}100%{top:110%}}
.screen .haha{
  position:absolute;z-index:4;pointer-events:none;opacity:0;
  font-family:'JetBrains Mono',monospace;font-weight:700;font-size:.8rem;letter-spacing:.2em;
  color:var(--danger);text-shadow:0 0 10px rgba(255,36,56,.9);
}
.screen .ticker{
  position:absolute;bottom:7%;left:0;right:0;overflow:hidden;padding:.35rem 0;
  border-top:1px solid rgba(255,36,56,.35);border-bottom:1px solid rgba(255,36,56,.35);
}
.screen .ticker span{
  display:inline-block;white-space:nowrap;
  font-family:'JetBrains Mono',monospace;font-size:.55rem;letter-spacing:.3em;color:#ff5a6a;
  animation:tickmove 10s linear infinite;
}
@keyframes tickmove{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

/* quotes */
.truth-q{
  border-left:2px solid var(--line);padding:1.2rem 1.6rem;margin-bottom:3.4rem;position:relative;
  background:linear-gradient(90deg,rgba(10,8,15,.85),rgba(10,8,15,.5) 70%,transparent);
}
.truth-q:hover{border-left-color:var(--danger)}
.tq-tag{font-family:'JetBrains Mono',monospace;font-size:.6rem;letter-spacing:.3em;color:var(--danger);margin-bottom:1.1rem}
.truth-q blockquote{
  font-size:clamp(1.02rem,1.7vw,1.42rem);line-height:1.65;color:#dedae8;max-width:580px;
}
.truth-q blockquote + blockquote{margin-top:1.3rem}
.tq-name{margin-top:1.2rem;font-family:'JetBrains Mono',monospace;font-size:.66rem;letter-spacing:.22em;color:#8f8a9e}
/* glitchy-but-readable attribution names */
.gl-name{position:relative;display:inline-block;color:#d8d4e4}
.gl-name::before,.gl-name::after{
  content:attr(data-text);position:absolute;left:0;top:0;opacity:0;pointer-events:none;
}
.gl-name::before{color:#4df3ff;animation:glA 3.4s steps(1) infinite}
.gl-name::after{color:#ff4df3;animation:glB 3.4s steps(1) infinite}
@keyframes glA{0%,91%,100%{opacity:0}92%{opacity:.85;transform:translate(-2px,-1px);clip-path:inset(0 0 52% 0)}96%{opacity:0}}
@keyframes glB{0%,93%,100%{opacity:0}94%{opacity:.85;transform:translate(2px,1px);clip-path:inset(52% 0 0 0)}97%{opacity:0}}

/* danger marquee */
.m3 .marquee-inner span i{color:var(--danger)}
.m3 .marquee-inner span em{-webkit-text-stroke:1px var(--danger)}

/* ============ SIGNAL — the watchers ============ */
.signal{padding-top:18vh;padding-bottom:20vh;min-height:150vh}
.signal .head{margin-bottom:4rem}
.signal h2{
  font-family:'Anton',sans-serif;font-size:clamp(2.4rem,6.5vw,5.6rem);line-height:1.02;
  text-transform:uppercase;margin-top:1.2rem;
}
.signal h2 em{font-style:normal;color:transparent;-webkit-text-stroke:1.5px var(--fg)}
.signal h2 i{font-style:normal;color:var(--danger)}
.signal .label b{color:var(--danger)}
.signal-grid{display:grid;grid-template-columns:1fr minmax(280px,420px);gap:clamp(2rem,6vw,6rem);align-items:start}
.radar-wrap{position:sticky;top:16vh;display:flex;flex-direction:column;align-items:center;gap:1.3rem}
@media(max-width:900px){
  .signal-grid{grid-template-columns:1fr}
  .radar-wrap{position:relative;top:0;order:-1;margin-bottom:3rem}
}

/* the satellite radar */
.radar{
  position:relative;width:min(340px,78vw);aspect-ratio:1;border-radius:50%;
  border:1px solid rgba(255,36,56,.5);overflow:hidden;
  background:radial-gradient(circle,rgba(255,36,56,.07) 0%,rgba(12,5,7,.92) 72%);
  box-shadow:0 0 70px rgba(255,36,56,.14),inset 0 0 46px rgba(255,36,56,.09);
}
.radar::before{  /* range rings */
  content:"";position:absolute;inset:0;border-radius:50%;
  background:repeating-radial-gradient(circle,transparent 0 24.4%,rgba(255,36,56,.28) 24.4% 25%);
}
.radar::after{  /* crosshair */
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(rgba(255,36,56,.22),rgba(255,36,56,.22)) 50% 0/1px 100% no-repeat,
    linear-gradient(rgba(255,36,56,.22),rgba(255,36,56,.22)) 0 50%/100% 1px no-repeat;
}
/* beam: bright leading edge at 12 o'clock, phosphor tail trailing behind
   the clockwise rotation. JS drives the rotation so blips can sync to it. */
.r-sweep{
  position:absolute;inset:0;border-radius:50%;z-index:2;will-change:transform;
  background:conic-gradient(from 0deg,
    transparent 0 288deg,
    rgba(255,36,56,.05) 308deg,
    rgba(255,36,56,.18) 336deg,
    rgba(255,36,56,.5) 355deg,
    rgba(255,150,160,.95) 359deg 360deg);
}
.r-blip{
  position:absolute;z-index:3;width:7px;height:7px;border-radius:50%;
  background:#39ff6a;box-shadow:0 0 12px #39ff6a;
  transform:translate(-50%,-50%);opacity:0;pointer-events:none;
}
.r-blip.you{
  width:auto;height:auto;border-radius:0;background:none;box-shadow:none;
  font-family:'JetBrains Mono',monospace;font-size:.6rem;letter-spacing:.2em;font-weight:700;
  color:var(--danger);text-shadow:0 0 9px rgba(255,36,56,.9);
}
.radar-read{
  font-family:'JetBrains Mono',monospace;font-size:.6rem;letter-spacing:.22em;
  color:var(--mut);text-align:center;line-height:1.9;
}
.radar-read b{color:var(--danger);font-weight:400}

/* intercepted-transmission text blocks */
.sig-block{
  border-left:2px solid var(--line);padding:1.2rem 1.6rem;margin-bottom:3rem;
  background:linear-gradient(90deg,rgba(10,8,15,.85),rgba(10,8,15,.5) 70%,transparent);
}
.sig-block:hover{border-left-color:var(--danger)}
.sig-tag{font-family:'JetBrains Mono',monospace;font-size:.6rem;letter-spacing:.3em;color:var(--danger);margin-bottom:1rem}
.sig-block p{font-size:clamp(1.02rem,1.7vw,1.35rem);line-height:1.7;color:#cfccda;max-width:620px}
.sig-block p b{color:var(--fg)}
.era-chain{
  display:flex;flex-wrap:wrap;align-items:center;gap:.7rem;margin-top:2.2rem;
  font-family:'JetBrains Mono',monospace;font-size:.64rem;letter-spacing:.18em;color:var(--mut);
}
.era-chain span{border:1px solid var(--line);padding:.5rem .8rem;transition:border-color .3s,color .3s}
.era-chain span:hover{border-color:var(--danger);color:var(--fg)}
.era-chain i{font-style:normal;color:var(--danger)}
.era-chain .now{border-color:var(--danger);color:var(--danger);animation:live 1.6s ease-in-out infinite}

/* ============ PLAINTEXT — same skin as the intercepts, purple, no games ============ */
.plain{padding-top:18vh;padding-bottom:20vh;min-height:120vh}
.plain .head{margin-bottom:3.6rem}
.plain h2{
  font-family:'Anton',sans-serif;font-size:clamp(2.4rem,6.5vw,5.6rem);line-height:1.02;
  text-transform:uppercase;margin-top:1.2rem;
}
.plain h2 em{font-style:normal;color:transparent;-webkit-text-stroke:1.5px var(--fg)}
.plain h2 i{font-style:normal;color:var(--acc);text-shadow:0 0 26px currentColor}
.plain-list{max-width:820px}
.plain .sig-tag{color:var(--acc)}
.plain .sig-block:hover{border-left-color:var(--acc)}
.tempo-live{
  margin-top:2.4rem;font-family:'JetBrains Mono',monospace;font-size:.66rem;
  letter-spacing:.22em;color:var(--mut);line-height:1.8;
}
.tempo-live b{color:var(--acc);font-weight:400}

/* ============ ARCHIVE — declassified dossiers ============ */
.archive{padding-top:18vh;padding-bottom:20vh;min-height:140vh}
.archive .head{margin-bottom:1.4rem}
.archive h2{
  font-family:'Anton',sans-serif;font-size:clamp(2.4rem,6.5vw,5.6rem);line-height:1.02;
  text-transform:uppercase;margin-top:1.2rem;
}
.archive h2 em{font-style:normal;color:transparent;-webkit-text-stroke:1.5px var(--fg)}
.archive h2 i{font-style:normal;color:var(--acc)}
.arch-hint{font-family:'JetBrains Mono',monospace;font-size:.62rem;letter-spacing:.28em;color:var(--mut);margin-bottom:3.2rem}
.arch-hint b{color:#39ff6a;font-weight:400}
.arch-list{border-top:1px solid var(--line)}
.arch-row{
  display:grid;grid-template-columns:120px 1fr;gap:1.6rem;align-items:start;
  padding:2.1rem .4rem;border-bottom:1px solid var(--line);
}
.ar-year{
  font-family:'Anton',sans-serif;font-size:clamp(1.5rem,2.8vw,2.4rem);line-height:1.1;
  color:transparent;-webkit-text-stroke:1px var(--mut);
  transition:color .4s,-webkit-text-stroke-color .4s;
}
.arch-row:hover .ar-year,.arch-row.open .ar-year{color:var(--acc);-webkit-text-stroke-color:var(--acc)}
.ar-name{
  font-family:'Anton',sans-serif;font-size:clamp(1.3rem,2.4vw,2rem);letter-spacing:.03em;
  text-transform:uppercase;display:flex;align-items:center;gap:1rem;flex-wrap:wrap;
}
.ar-stamp{
  font-family:'JetBrains Mono',monospace;font-size:.56rem;letter-spacing:.3em;color:#39ff6a;
  border:1px solid rgba(57,255,106,.5);padding:.3rem .6rem;transform:rotate(-2deg);
  opacity:0;transition:opacity .5s .35s;
}
.arch-row:hover .ar-stamp,.arch-row.open .ar-stamp{opacity:1}
.ar-desc{position:relative;margin-top:.8rem;color:#c9c5d6;font-size:.98rem;line-height:1.7;max-width:660px}
.ar-desc::after{   /* redaction bars — hover the row to declassify */
  content:"";position:absolute;inset:-2px 0;
  background:repeating-linear-gradient(0deg,#17131f 0 1.28em,rgba(10,8,15,.35) 1.28em 1.7em);
  clip-path:inset(0 0 0 0);
  transition:clip-path .75s cubic-bezier(.7,0,.2,1);
}
.arch-row:hover .ar-desc::after,.arch-row.open .ar-desc::after{clip-path:inset(0 0 0 100%)}
.ar-src{margin-top:.9rem;font-family:'JetBrains Mono',monospace;font-size:.6rem;letter-spacing:.18em;color:#6d6480;line-height:1.8}
.ar-src b{color:var(--acc);font-weight:400}
@media(hover:none){   /* touch: files stay redacted until tapped */
  .arch-row{cursor:pointer}
}
@media(max-width:700px){
  .arch-row{grid-template-columns:64px 1fr;gap:1rem}
  .ar-year{font-size:1.1rem;-webkit-text-stroke-width:.8px}
}
/* ACTIVE — same dossier skin, but the stamps burn red: still running */
.active-ops .ar-stamp{color:var(--danger);border-color:rgba(255,36,56,.5);animation:live 1.8s ease-in-out infinite}
.active-ops .arch-row:hover .ar-year,.active-ops .arch-row.open .ar-year{color:var(--danger);-webkit-text-stroke-color:var(--danger)}
.active-ops .arch-hint b{color:var(--danger)}
.active-ops .label b,.active-ops h2 i{color:var(--danger)}

/* FOOTER */
.footer{padding-top:14vh;padding-bottom:3rem;min-height:100vh;display:flex;flex-direction:column;justify-content:space-between;position:relative}
/* mobile: keep the bottom row clear of the fixed music chip */
@media(max-width:820px){.footer{padding-bottom:8.5rem}}
/* fixed, always-on now-playing chip (bottom-left) → links to YouTube */
.now-playing{
  position:fixed;left:1.6rem;bottom:1.4rem;z-index:140;
  display:flex;align-items:center;gap:.7rem;cursor:pointer;text-decoration:none;
  padding:.6rem .8rem;border:1px solid #1e1e24;background:rgba(8,8,10,.72);
  backdrop-filter:blur(6px);
  font-family:'JetBrains Mono',monospace;font-size:.62rem;letter-spacing:.16em;color:var(--mut);
  transition:border-color .3s,color .3s,transform .3s;opacity:0;
}
body.entered .now-playing{opacity:1}
.now-playing:hover{border-color:var(--acc);color:var(--fg);transform:translateY(-2px)}
.now-playing .np-tag{color:var(--acc)}
.now-playing .np-title{color:#d8d8dc;max-width:180px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.now-playing:hover .np-title{color:#fff}
.now-playing .yt{margin-left:.2rem;color:#4a4a52;transition:color .3s}
.now-playing:hover .yt{color:var(--acc)}
.eq{display:flex;align-items:flex-end;gap:2px;height:13px}
.eq i{width:2px;background:var(--acc);animation:eq 1s ease-in-out infinite}
.eq i:nth-child(2){animation-delay:.2s}.eq i:nth-child(3){animation-delay:.4s}.eq i:nth-child(4){animation-delay:.1s}
@keyframes eq{0%,100%{height:25%}50%{height:100%}}
body.muted .now-playing .eq i{animation-play-state:paused;height:35%}
@media(max-width:820px){
  .now-playing{left:1rem;bottom:1rem;padding:.5rem .7rem;font-size:.58rem;gap:.55rem}
}
@media(max-width:560px){.now-playing .np-title{max-width:110px}}
.footer .giant{
  font-family:'Anton',sans-serif;font-size:clamp(4rem,17vw,15rem);line-height:.92;
  text-transform:uppercase;margin:3rem 0;
}
.footer .giant em{font-style:normal;color:transparent;-webkit-text-stroke:2px var(--fg)}
.footer .giant i{font-style:normal;color:var(--acc)}
.footer .bottom{
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem;
  border-top:1px solid var(--line);padding-top:1.6rem;
  font-family:'JetBrains Mono',monospace;font-size:.62rem;letter-spacing:.25em;color:var(--mut);
}
.footer .bottom a{color:var(--mut);text-decoration:none;transition:color .3s}
.footer .bottom a:hover{color:var(--acc)}

/* ============ MOBILE POLISH ============ */
@media(max-width:820px){
  .mod,.link-card,.now-playing{backdrop-filter:none}   /* blur is a battery tax on phones */
  .truth-q{padding:1rem .9rem;margin-bottom:2.4rem}
  .sig-block{padding:1rem .9rem;margin-bottom:2.2rem}
  .bg-word{font-size:34vw}
  .marquee{padding:.85rem 0}
  .aurora{opacity:calc(var(--aurora-op,1)*.75)}
}