@font-face{font-family:'Archivo';src:url('/public/fonts/archivo-latin-wght-normal.woff2') format('woff2');font-weight:100 900;font-display:swap}
@font-face{font-family:'ArchivoW';src:url('/public/fonts/archivo-latin-standard-normal.woff2') format('woff2');font-weight:100 900;font-stretch:62% 125%;font-display:swap}
@font-face{font-family:'Plex';src:url('/public/fonts/ibm-plex-mono-latin-400-normal.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Plex';src:url('/public/fonts/ibm-plex-mono-latin-500-normal.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Fraunces';src:url('/public/fonts/fraunces-latin-700-normal.woff2') format('woff2');font-weight:700;font-display:swap}

:root{
  --void:#080B09; --panel:#0F1512; --neon:#43F58C; --green:#16A34A;
  --bone:#EFE7D6; --brass:#C99A3F;
  --line:rgba(239,231,214,.13);
  --w:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{margin:0;padding:0;max-width:100%;overflow-x:hidden;background:var(--void)}
body{color:var(--bone);font-family:'Archivo',system-ui,sans-serif;font-size:17px;line-height:1.62;-webkit-font-smoothing:antialiased;cursor:none}
@media(max-width:900px){body{cursor:auto}}

/* ambient field behind everything */
#dust{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.55}
#vignette{position:fixed;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(ellipse 120% 80% at 50% 0%,rgba(67,245,140,.09),transparent 60%),
             radial-gradient(ellipse 100% 100% at 50% 100%,rgba(0,0,0,.6),transparent 55%)}
body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:9997;opacity:.32;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E")}
main,nav,footer,header,section{position:relative;z-index:2}

.wrap{max-width:var(--w);margin:0 auto;padding:0 22px}
a{color:inherit}
h1,h2,h3{font-family:'ArchivoW','Archivo',sans-serif;font-weight:800;letter-spacing:-.024em;line-height:1.03;margin:0;overflow-wrap:break-word}
h1{font-size:clamp(52px,11vw,132px);font-stretch:120%;text-transform:lowercase;
   text-shadow:0 0 44px rgba(67,245,140,.34)}
h2{font-size:clamp(30px,5vw,54px);font-stretch:113%}
h3{font-size:20px;font-stretch:108%}
.lede{font-size:clamp(18px,2.2vw,23px);line-height:1.5;max-width:62ch;color:rgba(239,231,214,.74)}
.small{font-size:14px;color:rgba(239,231,214,.5)}
.mono{font-family:'Plex',ui-monospace,monospace;font-variant-numeric:tabular-nums}
.neon{color:var(--neon)}

/* ---- peg ribbon: live wobbling line pinned under the nav ---- */
#pegbar{position:sticky;top:0;z-index:70;height:34px;background:var(--void);border-bottom:1px solid var(--line);overflow:hidden}
#pegbar svg{position:absolute;inset:0;width:100%;height:100%}
#pegbar .lbl{position:absolute;left:14px;top:7px;font-family:'Plex',monospace;font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--neon);opacity:.8}
#pegbar .val{position:absolute;right:14px;top:7px;font-family:'Plex',monospace;font-size:11px;color:var(--neon);opacity:.8}

/* ---- nav ---- */
.rail{position:sticky;top:34px;z-index:60;background:rgba(8,11,9,.82);backdrop-filter:blur(13px);border-bottom:1px solid var(--line)}
.rail .wrap{display:flex;align-items:center;gap:16px;min-height:64px;flex-wrap:wrap;padding-top:8px;padding-bottom:8px}
.brandmark{display:flex;align-items:center;gap:11px;text-decoration:none;flex:0 0 auto}
.brandmark .bm{width:38px;height:38px;border-radius:10px;overflow:hidden;box-shadow:0 0 0 1px var(--line),0 0 22px rgba(67,245,140,.3)}
.brandmark b{font-family:'ArchivoW',sans-serif;font-stretch:120%;font-size:21px;letter-spacing:.01em}
.plates{display:flex;gap:7px;margin-left:auto;flex-wrap:wrap}
.plate{font-family:'Plex',monospace;font-size:12px;font-weight:500;letter-spacing:.13em;text-transform:uppercase;
  text-decoration:none;padding:9px 14px;border-radius:4px;color:rgba(239,231,214,.68);
  border:1px solid var(--line);background:rgba(239,231,214,.03);position:relative;overflow:hidden;
  transition:color .2s,border-color .2s,transform .2s}
.plate::before{content:"";position:absolute;inset:0;background:var(--neon);transform:translateY(101%);transition:transform .26s cubic-bezier(.2,.8,.2,1);z-index:-1}
.plate:hover{color:var(--void);border-color:var(--neon);transform:translateY(-2px)}
.plate:hover::before{transform:none}
.plate[aria-current="page"]{color:var(--neon);border-color:rgba(67,245,140,.5);background:rgba(67,245,140,.08)}

/* ---- hero ---- */
.hero{padding:70px 0 56px}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:44px;align-items:center}
@media(max-width:880px){.hero-grid{grid-template-columns:1fr;gap:30px}}
#stage{width:min(400px,84vw);justify-self:center;aspect-ratio:1;position:relative;cursor:grab}
#stage.grabbing{cursor:grabbing}
#stage svg{width:100%;height:100%;display:block;filter:drop-shadow(0 26px 54px rgba(0,0,0,.72)) drop-shadow(0 0 60px rgba(67,245,140,.22))}

.tag{display:inline-flex;align-items:center;gap:9px;font-family:'Plex',monospace;font-size:12px;letter-spacing:.15em;
  text-transform:uppercase;color:var(--neon);border:1px solid rgba(67,245,140,.34);background:rgba(67,245,140,.07);
  border-radius:999px;padding:6px 14px;margin-bottom:22px}
.dot{width:7px;height:7px;border-radius:50%;background:var(--neon);box-shadow:0 0 10px var(--neon);animation:pulse 1.8s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.3;transform:scale(.68)}}

.btnrow{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.btn{display:inline-block;text-decoration:none;font-family:'Plex',monospace;font-size:13px;font-weight:500;
  letter-spacing:.1em;text-transform:uppercase;padding:14px 22px;border-radius:5px;border:1px solid transparent;
  transition:transform .16s,box-shadow .16s,background .2s,color .2s;cursor:pointer}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:var(--neon);color:#062011;box-shadow:0 0 0 rgba(67,245,140,.5)}
.btn-primary:hover{box-shadow:0 8px 34px rgba(67,245,140,.42)}
.btn-ghost{border-color:var(--line);color:var(--bone);background:rgba(239,231,214,.03)}
.btn-ghost:hover{border-color:var(--neon);color:var(--neon)}

/* ---- sections ---- */
section{padding:66px 0;border-top:1px solid var(--line)}
.eyebrow{font-family:'Plex',monospace;font-size:11.5px;letter-spacing:.19em;text-transform:uppercase;color:var(--brass);margin-bottom:14px}
.cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(255px,1fr));gap:20px;margin-top:30px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:13px;padding:23px;min-width:0;position:relative;overflow:hidden;
  transition:transform .22s cubic-bezier(.2,.8,.2,1),border-color .22s,box-shadow .22s}
.card::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .3s;
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgba(67,245,140,.12),transparent 42%)}
.card:hover{transform:translateY(-5px);border-color:rgba(67,245,140,.36);box-shadow:0 18px 44px rgba(0,0,0,.55)}
.card:hover::after{opacity:1}
.card h3{margin-bottom:9px}
.num{font-family:'Plex',monospace;font-size:34px;font-weight:500;color:var(--neon);display:block;line-height:1.14;
  text-shadow:0 0 26px rgba(67,245,140,.4)}

.rise{opacity:1;transform:none}
.js .rise{opacity:0;transform:translateY(26px);transition:opacity .66s cubic-bezier(.2,.8,.2,1),transform .66s cubic-bezier(.2,.8,.2,1)}
.js .rise.in{opacity:1;transform:none}

/* ---- tables ---- */
.tablewrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin-top:22px;border:1px solid var(--line);border-radius:13px;background:var(--panel)}
table{border-collapse:collapse;width:100%;min-width:560px;font-size:14.5px}
th,td{text-align:left;padding:13px 16px;border-bottom:1px solid var(--line);vertical-align:top}
th{font-family:'Plex',monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--brass);background:rgba(239,231,214,.035)}
tr:last-child td{border-bottom:none}
tr:hover td{background:rgba(67,245,140,.045)}
td.n{font-family:'Plex',monospace;white-space:nowrap;color:var(--neon)}

/* ---- quotes ---- */
blockquote{margin:0 0 16px;padding:22px 26px;background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--neon);border-radius:0 13px 13px 0;transition:transform .2s,border-color .2s}
blockquote:hover{transform:translateX(5px)}
blockquote p{margin:0 0 12px;font-family:'Fraunces',Georgia,serif;font-size:21px;line-height:1.42;color:var(--bone)}
blockquote cite{font-style:normal;font-family:'Plex',monospace;font-size:12.5px;color:rgba(239,231,214,.5);display:block;line-height:1.6}
.fake{border-left-color:#FF5C3E}
.verdict{display:inline-block;font-family:'Plex',monospace;font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;
  padding:4px 10px;border-radius:3px;margin-bottom:12px;background:#FF5C3E;color:#160604}
.real .verdict{background:var(--neon);color:#062011}

/* ---- code ---- */
pre{background:#060906;color:#B8E8C8;border:1px solid var(--line);border-radius:13px;padding:20px;overflow-x:auto;
  font-family:'Plex',monospace;font-size:13px;line-height:1.62}
pre .c{color:#5C7A67}
pre .k{color:var(--neon)}
code.inl{font-family:'Plex',monospace;font-size:.9em;background:rgba(67,245,140,.1);color:var(--neon);padding:2px 6px;border-radius:4px;overflow-wrap:break-word}

/* ---- footer ---- */
footer{border-top:1px solid var(--line);background:#050705;padding:44px 0 36px;margin-top:40px}
.disc{font-size:12.5px;line-height:1.66;color:rgba(239,231,214,.42);max-width:78ch;margin-top:16px}

/* ---- cursor: hoof ring + trail ---- */
#ring{position:fixed;width:28px;height:28px;border:1.5px solid rgba(67,245,140,.75);border-radius:50%;
  pointer-events:none;z-index:9998;transform:translate(-50%,-50%);transition:width .2s,height .2s,background .2s;
  box-shadow:0 0 16px rgba(67,245,140,.35)}
#ring.hot{width:52px;height:52px;background:rgba(67,245,140,.12)}
#dotc{position:fixed;width:5px;height:5px;background:var(--neon);border-radius:50%;pointer-events:none;z-index:9998;transform:translate(-50%,-50%)}
.hoof{position:fixed;pointer-events:none;z-index:9996;width:13px;height:17px;border-radius:50% 50% 45% 45%;
  background:rgba(67,245,140,.34);animation:hoofFade 1.05s ease-out forwards}
@keyframes hoofFade{0%{opacity:.8;transform:translate(-50%,-50%) scale(.7)}100%{opacity:0;transform:translate(-50%,-50%) scale(1.25)}}
@media(max-width:900px){#ring,#dotc,.hoof{display:none}}

/* ---- stall door transition ---- */
#doors{position:fixed;inset:0;z-index:9990;pointer-events:none;display:flex}
#doors div{flex:1;background:linear-gradient(90deg,#0B110D,#121A14);transform:translateY(-101%);
  border-bottom:3px solid var(--neon);box-shadow:0 10px 40px rgba(0,0,0,.7)}
#doors.shut div{transform:none;transition:transform .42s cubic-bezier(.65,0,.35,1)}
#doors.shut div:nth-child(2){transition-delay:.05s}#doors.shut div:nth-child(3){transition-delay:.1s}
#doors.shut div:nth-child(4){transition-delay:.15s}#doors.shut div:nth-child(5){transition-delay:.2s}
#doors.open div{transform:translateY(-101%);transition:transform .42s cubic-bezier(.65,0,.35,1)}

/* ---- draggable stickers ---- */
.chip{position:fixed;width:88px;height:88px;z-index:9994;border-radius:18px;cursor:grab;touch-action:none;
  box-shadow:0 12px 30px rgba(0,0,0,.6);border:1px solid rgba(67,245,140,.25);will-change:transform}
.chip img{width:100%;height:100%;display:block;border-radius:17px;pointer-events:none}
.chip.drag{cursor:grabbing;box-shadow:0 22px 50px rgba(0,0,0,.75),0 0 32px rgba(67,245,140,.35)}
.chiptray{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
.chiptray img{width:74px;height:74px;border-radius:15px;cursor:grab;border:1px solid var(--line);
  transition:transform .18s,border-color .18s}
.chiptray img:hover{transform:translateY(-5px) rotate(-4deg);border-color:var(--neon)}

/* ---- stampede + depeg ---- */
#stampede{position:fixed;inset:0;z-index:9993;pointer-events:none;overflow:hidden}
#stampede img{position:absolute;width:104px;height:104px;border-radius:20px;opacity:.94}
@keyframes gallop{0%{transform:translateX(-160px) rotate(-7deg)}100%{transform:translateX(105vw) rotate(7deg)}}
body.depeg{animation:depegShake .42s infinite}
body.depeg .card,body.depeg blockquote,body.depeg .tablewrap{animation:tilt 1.7s ease-in-out infinite}
@keyframes depegShake{0%,100%{transform:translate(0,0) rotate(0)}25%{transform:translate(-3px,2px) rotate(-.3deg)}
  50%{transform:translate(3px,-2px) rotate(.3deg)}75%{transform:translate(-2px,-2px) rotate(.2deg)}}
@keyframes tilt{0%,100%{transform:rotate(-1.1deg)}50%{transform:rotate(1.1deg)}}
#eggbar{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(140%);z-index:9995;
  background:var(--neon);color:#062011;font-family:'Plex',monospace;font-size:12.5px;letter-spacing:.11em;
  text-transform:uppercase;padding:12px 20px;border-radius:7px;transition:transform .34s cubic-bezier(.2,.8,.2,1);
  box-shadow:0 10px 34px rgba(67,245,140,.4);white-space:nowrap;max-width:92vw;overflow:hidden;text-overflow:ellipsis}
#eggbar.show{transform:translateX(-50%) translateY(0)}

/* ---- found-eggs counter ---- */
#eggcount{font-family:'Plex',monospace;font-size:11px;letter-spacing:.14em;color:var(--brass);
  border:1px solid var(--line);border-radius:999px;padding:6px 12px;text-decoration:none}
#eggcount:hover{border-color:var(--brass);color:var(--neon)}

@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition-duration:.01ms!important}
  .js .rise{opacity:1;transform:none}
  #dust{display:none}
}

/* ---- range input, dark ---- */
input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:34px;background:transparent;cursor:pointer}
input[type=range]::-webkit-slider-runnable-track{height:6px;border-radius:99px;
  background:linear-gradient(90deg,var(--neon),rgba(67,245,140,.18));box-shadow:0 0 18px rgba(67,245,140,.3)}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;border-radius:50%;
  background:var(--neon);border:3px solid var(--void);margin-top:-10px;box-shadow:0 0 22px rgba(67,245,140,.75)}
input[type=range]::-moz-range-track{height:6px;border-radius:99px;background:rgba(67,245,140,.3)}
input[type=range]::-moz-range-thumb{width:22px;height:22px;border:3px solid var(--void);border-radius:50%;background:var(--neon)}
input[type=range]:focus-visible{outline:2px solid var(--neon);outline-offset:6px}

/* ============ OPENING SEQUENCE ============ */
body.introlock{overflow:hidden}
#intro{position:fixed;inset:0;z-index:10000;background:#050705;display:grid;place-items:center;
  grid-template-areas:"stack";transition:opacity .6s ease}
#intro.out{opacity:0;pointer-events:none}
#intro > *{grid-area:stack}
#intro .i-line{width:min(760px,86vw);height:60px}
#intro .i-line svg{width:100%;height:100%;overflow:visible}
#intro.s1 #iline{transition:stroke-dashoffset .62s cubic-bezier(.65,0,.35,1);stroke-dashoffset:0}
#intro.s2 .i-line{animation:lineSnap .5s cubic-bezier(.3,1.6,.5,1) forwards}
@keyframes lineSnap{0%{transform:scaleY(1)}30%{transform:scaleY(5.5)}100%{transform:scaleY(0);opacity:0}}
#intro .i-horse{width:min(330px,62vw);opacity:0;transform:translateY(46px) scale(.82);filter:drop-shadow(0 0 70px rgba(67,245,140,.4))}
#intro.s2 .i-horse{opacity:1;transform:none;transition:opacity .7s ease,transform .8s cubic-bezier(.2,.9,.25,1)}
#intro.s3 .i-horse{transform:translateY(-104px) scale(.62);transition:transform .75s cubic-bezier(.4,0,.2,1)}
#intro .i-word{display:flex;gap:.01em;font-family:'ArchivoW','Archivo',sans-serif;font-weight:800;
  font-stretch:120%;font-size:clamp(56px,13vw,132px);letter-spacing:-.03em;transform:translateY(118px);color:var(--bone)}
#intro .i-word span{opacity:0;transform:translateY(34px) rotate(7deg);display:inline-block}
#intro.s3 .i-word span{opacity:1;transform:none;transition:opacity .42s ease,transform .52s cubic-bezier(.2,1.4,.4,1)}
#intro.s3 .i-word span:nth-child(2){transition-delay:.06s}
#intro.s3 .i-word span:nth-child(3){transition-delay:.12s}
#intro.s3 .i-word span:nth-child(4){transition-delay:.18s}
#intro.s3 .i-word span:nth-child(5){transition-delay:.24s}
#intro .i-sub{transform:translateY(212px);font-family:'Plex',monospace;font-size:clamp(12px,2.4vw,15px);
  letter-spacing:.2em;text-transform:uppercase;color:var(--neon);opacity:0}
#intro.s4 .i-sub{opacity:.9;transition:opacity .5s ease}
#intro .i-skip{position:fixed;right:22px;bottom:22px;z-index:2;background:none;border:1px solid var(--line);
  color:rgba(239,231,214,.5);font-family:'Plex',monospace;font-size:11px;letter-spacing:.15em;
  text-transform:uppercase;padding:9px 15px;border-radius:5px;cursor:pointer;transform:translate(0,0)}
#intro .i-skip:hover{color:var(--neon);border-color:var(--neon)}

/* hero copy rises in. An ANIMATION, not a class gate: it cannot get stuck hidden.
   While the intro overlay is up it is simply paused. */
@keyframes sIn{from{opacity:0;transform:translateY(32px)}to{opacity:1;transform:none}}
.scene .s-in{animation:sIn .85s cubic-bezier(.2,.8,.2,1) backwards}
.scene .s-in:nth-child(1){animation-delay:.05s}
.scene .s-in:nth-child(2){animation-delay:.16s}
.scene .s-in:nth-child(3){animation-delay:.27s}
body.introlock .scene .s-in{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.scene .s-in{animation:none}}

/* ============ HERO SCENE ============ */
.scene{position:relative;min-height:min(92vh,880px);display:flex;align-items:center;overflow:hidden;
  padding:40px 0 64px;isolation:isolate}
.scene .layer{position:absolute;inset:0;pointer-events:none;will-change:transform}
.shafts{background:
  linear-gradient(101deg,transparent 30%,rgba(67,245,140,.085) 36%,transparent 42%),
  linear-gradient(94deg,transparent 52%,rgba(67,245,140,.07) 57%,transparent 62%),
  linear-gradient(110deg,transparent 66%,rgba(239,231,214,.045) 71%,transparent 76%);
  mix-blend-mode:screen;opacity:.85}
.floorglow{background:radial-gradient(ellipse 70% 48% at 62% 86%,rgba(67,245,140,.17),transparent 70%)}
/* the horse lives in the scene: no plate, bleeds off the right edge */
/* wrapper owns parallax; the horse itself owns centring and drag */
.stage-wrap{position:absolute;right:-4%;top:50%;width:min(660px,86vw);aspect-ratio:1;z-index:1;
  margin-top:-33%;pointer-events:none;opacity:var(--fade,1)}
#stage{width:100%;height:100%;cursor:grab;pointer-events:auto;
  transform:translate(var(--dragx,0),var(--dragy,0)) rotate(var(--dragr,0))}
#stage.grabbing{cursor:grabbing}
#stage svg{width:100%;height:100%;display:block;
  filter:drop-shadow(0 40px 70px rgba(0,0,0,.85)) drop-shadow(0 0 120px rgba(67,245,140,.3))
         drop-shadow(0 0 22px rgba(67,245,140,.18))}
@media(max-width:880px){
  .stage-wrap{position:relative;right:auto;top:auto;margin:0 auto 4px;width:min(400px,80vw);opacity:1}
  .scene{min-height:0;flex-direction:column;padding-top:18px}
}
.scene .copy{position:relative;z-index:2;max-width:640px}
@media(max-width:880px){.scene .copy{max-width:none}}
.scene h1{mix-blend-mode:normal}
/* foreground rail */
.rail-fg{position:absolute;left:-4%;right:-4%;bottom:26px;height:120px;pointer-events:none;z-index:3}
.rail-fg::before,.rail-fg::after{content:"";position:absolute;left:0;right:0;height:13px;border-radius:7px;
  background:linear-gradient(180deg,#22301f,#0d140f 60%,#060a07);
  box-shadow:0 2px 0 rgba(239,231,214,.07) inset,0 10px 26px rgba(0,0,0,.6)}
.rail-fg::before{bottom:64px}
.rail-fg::after{bottom:8px}
.scroll-hint{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);z-index:4;
  font-family:'Plex',monospace;font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;
  color:rgba(239,231,214,.4);display:flex;flex-direction:column;align-items:center;gap:7px}
.scroll-hint i{width:1px;height:26px;background:linear-gradient(180deg,var(--neon),transparent);animation:drip 1.9s ease-in-out infinite}
@keyframes drip{0%,100%{transform:scaleY(.4);opacity:.4}50%{transform:scaleY(1);opacity:1}}
@media(max-width:880px){.rail-fg,.scroll-hint{display:none}}

/* ============ DIAGRAM ============ */
.diag{width:100%;height:auto;display:block;overflow:visible}
.d-t{font-family:'ArchivoW','Archivo',sans-serif;font-weight:800;font-size:21px;fill:var(--bone)}
.d-s{font-family:'Archivo',sans-serif;font-size:14px;fill:rgba(239,231,214,.6)}
.d-n{font-family:'Plex',monospace;font-size:11.5px;fill:var(--neon)}
.d-node{opacity:0;animation:dnode .7s ease forwards}
.d-node:nth-of-type(2){animation-delay:.18s}.d-node:nth-of-type(3){animation-delay:.36s}
@keyframes dnode{to{opacity:1}}
#d-fill{animation:dfill 3.4s ease-in-out infinite}
@keyframes dfill{0%,100%{opacity:.12}50%{opacity:.3}}

/* ============ TOKEN STREAM ============ */
.streamhost{position:relative;margin-top:26px;border:1px solid var(--line);border-radius:14px;
  background:#070A08;overflow:hidden}
.streamcv{width:100%;display:block}
.streamhost::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg,#070A08 0%,transparent 9%,transparent 91%,#070A08 100%)}
.streamlab{padding:14px 20px 18px;border-top:1px solid var(--line);position:relative;z-index:1;background:#070A08}
.streamlab .mono{color:var(--neon);font-size:26px;font-weight:500;font-family:'Plex',monospace}

/* ============ section dividers ============ */
.divider{height:1px;background:linear-gradient(90deg,transparent,rgba(67,245,140,.4),transparent);
  margin:0;border:0;position:relative}
.divider::after{content:"";position:absolute;left:50%;top:-3px;width:7px;height:7px;border-radius:50%;
  background:var(--neon);transform:translateX(-50%);box-shadow:0 0 16px var(--neon)}

/* ============ INNER PAGE HERO ============ */
.phero{position:relative;overflow:hidden;padding:56px 0 46px;min-height:340px;display:flex;align-items:center}
.phero .wrap{position:relative;z-index:2}
#pagehorse{position:absolute;right:-3%;top:50%;transform:translateY(-52%);width:min(400px,58vw);
  aspect-ratio:1;z-index:1;opacity:.42;pointer-events:none;
  filter:drop-shadow(0 0 80px rgba(67,245,140,.3)) saturate(.85)}
#pagehorse svg{width:100%;height:100%;display:block}
.phero::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,var(--void) 34%,rgba(8,11,9,.55) 60%,transparent 100%)}
@media(max-width:880px){#pagehorse{opacity:.2;right:-18%;width:70vw}}

/* ============ CHAIN STRIP ============ */
.chainstrip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#0B0F0C;
  padding:20px 0;overflow:hidden}
.chainstrip .wrap{display:flex;gap:30px;flex-wrap:wrap;align-items:center;justify-content:space-between}
.cs-item{display:flex;flex-direction:column;gap:5px;min-width:0}
.cs-k{font-family:'Plex',monospace;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--brass)}
.cs-v{font-family:'ArchivoW','Archivo',sans-serif;font-stretch:112%;font-weight:800;font-size:19px;color:var(--bone)}
.cs-v.neon{color:var(--neon)}
.cs-note{font-size:12px;color:rgba(239,231,214,.42);max-width:30ch;line-height:1.5}

/* ============ DEBUNK CARDS ============ */
.debunk{position:relative;background:var(--panel);border:1px solid var(--line);border-left:3px solid #FF5C3E;
  border-radius:0 14px 14px 0;padding:24px 26px;margin-bottom:18px;overflow:hidden}
.debunk .dq{font-family:'Fraunces',Georgia,serif;font-size:clamp(19px,2.4vw,24px);line-height:1.4;
  margin:0 0 16px;padding-right:130px}
@media(max-width:620px){.debunk .dq{padding-right:0;margin-top:34px}
  .debunk .dstamp{top:14px;right:auto;left:26px}}
.debunk .dattr{font-family:'Plex',monospace;font-size:13px;color:rgba(239,231,214,.62);position:relative;display:inline-block}
.debunk .dattr .nm{position:relative;transition:color .4s ease}
.debunk .dattr .nm::after{content:"";position:absolute;left:0;top:52%;height:2px;width:0;background:#FF5C3E;
  transition:width .5s cubic-bezier(.65,0,.35,1) .15s}
.debunk.cracked .dattr .nm{color:rgba(239,231,214,.35)}
.debunk.cracked .dattr .nm::after{width:100%}
.debunk .dstamp{position:absolute;right:18px;top:16px;font-family:'Plex',monospace;font-size:11px;
  letter-spacing:.16em;text-transform:uppercase;background:#FF5C3E;color:#180604;padding:5px 11px;border-radius:4px;
  opacity:0;transform:rotate(-14deg) scale(.6)}
.debunk.cracked .dstamp{opacity:1;transform:rotate(-8deg) scale(1);
  transition:opacity .35s ease .45s, transform .5s cubic-bezier(.2,1.7,.5,1) .45s}
.debunk .dreal{max-height:0;opacity:0;overflow:hidden;transition:max-height .6s ease .3s,opacity .5s ease .45s}
.debunk.cracked .dreal{max-height:300px;opacity:1}
.debunk .dreal p{margin:16px 0 0;font-size:15px;line-height:1.6;color:rgba(239,231,214,.72);
  padding-top:16px;border-top:1px solid var(--line)}
.debunk .dreal b{color:var(--neon);font-weight:600}
.believe{margin-top:14px;background:none;border:1px solid var(--line);color:rgba(239,231,214,.55);
  font-family:'Plex',monospace;font-size:11px;letter-spacing:.13em;text-transform:uppercase;
  padding:8px 13px;border-radius:5px;cursor:pointer;transition:all .2s}
.believe:hover{border-color:var(--neon);color:var(--neon)}
.believe.on{border-color:#FF5C3E;color:#FF5C3E;cursor:default}
.tally{font-family:'Plex',monospace;color:var(--neon);font-size:inherit;display:inline-block}

/* ============ MUTATION TIMELINE ============ */
.mutline{margin-top:28px;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:26px 24px 28px}
.ml-track{height:2px;background:var(--line);position:relative;border-radius:2px;margin:6px 0 0}
.ml-prog{position:absolute;left:0;top:0;height:100%;background:var(--neon);border-radius:2px;
  transition:width .6s cubic-bezier(.2,.8,.2,1);box-shadow:0 0 12px rgba(67,245,140,.6)}
.ml-steps{display:flex;justify-content:space-between;margin-top:-9px}
.ml-dot{background:var(--void);border:2px solid var(--line);width:16px;height:16px;border-radius:50%;
  padding:0;cursor:pointer;position:relative;transition:all .3s;flex:0 0 auto}
.ml-dot span{position:absolute;top:22px;left:50%;transform:translateX(-50%);font-family:'Plex',monospace;
  font-size:11px;letter-spacing:.06em;color:rgba(239,231,214,.45);white-space:nowrap;transition:color .3s}
.ml-dot.on{border-color:var(--neon);background:var(--neon);box-shadow:0 0 14px rgba(67,245,140,.7)}
.ml-dot.on span{color:var(--bone)}
.ml-body{margin-top:46px;min-height:120px}
.ml-quote{font-family:'Fraunces',Georgia,serif;font-size:clamp(17px,2.3vw,23px);line-height:1.45;margin:0;
  transition:opacity .25s ease;color:var(--bone)}
.ml-who{font-family:'Plex',monospace;font-size:13px;color:var(--neon);margin:12px 0 0;transition:opacity .25s ease}
.ml-who.bad{color:#FF5C3E}
@media(max-width:620px){.ml-dot span{font-size:9.5px}}

/* ============ LANE CHART ============ */
.ln-legend{display:flex;gap:22px;flex-wrap:wrap;margin-bottom:14px;font-size:13px;color:rgba(239,231,214,.68)}
.ln-legend span{display:flex;align-items:center;gap:8px}
.ln-legend i{width:13px;height:13px;border-radius:4px;flex:0 0 auto}
.ln-wrap{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:14px;
  padding:16px 10px;overflow-x:auto}
.ln-svg{width:100%;min-width:640px;height:auto;display:block;overflow:visible}
.ln-t{font-family:'Plex',monospace;font-size:13px;fill:var(--bone)}
.ln-v{font-family:'Plex',monospace;font-size:11.5px;fill:rgba(239,231,214,.8)}
.ln-v.dim{fill:rgba(239,231,214,.5)}
.ln-v.ins{fill:#08110B;font-weight:500}
.ln-v.dim.ins{fill:#1A0D06}
.ln .ln-hit{cursor:crosshair}
.ln:hover .ln-hit{fill:rgba(67,245,140,.05)}
.ln.hot .ln-t{fill:var(--neon);font-weight:500}
.ln-tip{position:absolute;z-index:6;background:#060906;border:1px solid rgba(67,245,140,.35);border-radius:9px;
  padding:10px 13px;font-size:12.5px;line-height:1.5;pointer-events:none;box-shadow:0 10px 30px rgba(0,0,0,.7);max-width:230px}
.ln-tip .dim{color:rgba(239,231,214,.55)}
.ln-foot{display:flex;gap:16px;align-items:center;flex-wrap:wrap;margin-top:14px}
.ln-toggle{background:none;border:1px solid var(--line);color:rgba(239,231,214,.66);font-family:'Plex',monospace;
  font-size:11px;letter-spacing:.13em;text-transform:uppercase;padding:8px 14px;border-radius:5px;cursor:pointer}
.ln-toggle:hover{border-color:var(--neon);color:var(--neon)}
.ln-table{margin-top:16px}