:root{--n:#070f24;--n2:#0e1b3d;--n3:#16285a;--g:#3fd14a;--g2:#1f8a2b;--o:#f05a28;--o2:#ff7a45;--c:#f3e7d3;--ink:#e8e2d4;--mut:#9aa8c4;--px:"Press Start 2P",monospace;--vt:"VT323",monospace;--sa:"Space Grotesk",system-ui,sans-serif;--r:18px}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;overflow-x:clip}
body{background:var(--n);color:var(--ink);font-family:var(--sa);line-height:1.55;overflow-x:clip}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
em{font-style:normal;color:var(--o)}
/* CRT */
.fx-scan{position:fixed;inset:0;z-index:90;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(0,0,0,.22) 0 1px,transparent 1px 3px);opacity:.55}
.fx-vig{position:fixed;inset:0;z-index:89;pointer-events:none;background:radial-gradient(ellipse at center,transparent 55%,rgba(0,0,0,.55) 100%)}
/* BOOT */
.boot{position:fixed;inset:0;z-index:200;background:#000;display:grid;place-items:center;padding:24px;transition:opacity .4s,transform .4s}
.booted .boot{opacity:0;transform:scaleY(.002);pointer-events:none;visibility:hidden;transition:opacity .35s .1s,transform .35s,visibility 0s .5s}
.boot-in{width:min(560px,100%)}
.boot pre{font-family:var(--vt);font-size:clamp(18px,4.6vw,26px);color:var(--g);white-space:pre-wrap;min-height:7.5em;text-shadow:0 0 8px rgba(63,209,74,.6)}
.bar{height:14px;border:2px solid var(--g);margin-top:14px;overflow:hidden}
.bar i{display:block;height:100%;background:var(--g);transform-origin:left;transform:scaleX(0)}
.pct{font-family:var(--px);font-size:12px;color:var(--o);margin-top:10px}
.skip{position:absolute;right:20px;bottom:20px;font-family:var(--px);font-size:11px;color:var(--c);border:2px solid var(--c);padding:10px 14px}
.skip:hover{background:var(--c);color:#000}
/* NAV */
.nav{position:fixed;top:0;left:0;right:0;z-index:80;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px clamp(16px,4vw,48px);transition:background .3s,padding .3s}
.nav.s{background:rgba(7,15,36,.85);backdrop-filter:blur(10px);padding-block:10px;border-bottom:1px solid rgba(63,209,74,.25)}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--px);font-size:13px;color:var(--g)}
.brand img{width:36px;height:36px;aspect-ratio:1;object-fit:cover;border-radius:9px;border:2px solid var(--g)}
.links{display:flex;gap:28px;font-family:var(--vt);font-size:23px;color:var(--c)}
.links a:hover{color:var(--o)}
.nav-s{display:flex;gap:8px}
.nav-x{display:grid;place-items:center;width:40px;height:40px;border-radius:10px;background:var(--c);color:var(--n);font-weight:700;font-size:15px;border:2px solid #000;box-shadow:3px 3px 0 #000}
/* HERO */
.hero{position:relative;min-height:100svh;display:grid;align-items:center;overflow:hidden;isolation:isolate;background:radial-gradient(ellipse at 70% 50%,#13265a,var(--n) 70%)}
.hero-bg{position:absolute;top:64px;bottom:0;right:-31vw;height:calc(100% - 64px);width:auto;max-width:none;aspect-ratio:16/9;z-index:-2;animation:zoom 18s ease-out both;transform-origin:60% 60%}
.hero-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,var(--n) 0%,rgba(7,15,36,.85) 30%,rgba(7,15,36,0) 52%),linear-gradient(0deg,var(--n) 0%,transparent 22%),linear-gradient(180deg,var(--n) 0%,transparent 14%)}
.hero-c{padding:110px clamp(18px,6vw,96px) 90px;max-width:760px}
.chip{display:inline-flex;align-items:center;gap:10px;font-family:var(--px);font-size:10px;letter-spacing:1px;color:var(--c);border:1px solid rgba(243,231,211,.35);padding:8px 12px;border-radius:99px;background:rgba(7,15,36,.5)}
.dot{width:8px;height:8px;border-radius:50%;background:var(--g);box-shadow:0 0 10px var(--g)}
.glitch{position:relative;font-family:var(--px);font-size:clamp(46px,7vw,108px);line-height:1;color:var(--g);margin:22px 0 10px;text-shadow:5px 5px 0 var(--g2),10px 10px 0 #000;letter-spacing:-2px}
.glitch::before,.glitch::after{content:attr(data-t);position:absolute;inset:0;pointer-events:none;opacity:0;text-shadow:none}
.glitch::before{color:var(--o);clip-path:inset(0 0 62% 0);animation:gl1 3.4s steps(1) infinite}
.glitch::after{color:#38c8ff;clip-path:inset(58% 0 0 0);animation:gl2 3.4s steps(1) infinite}
.tick{font-family:var(--px);font-size:clamp(22px,4vw,44px);color:var(--o);text-shadow:4px 4px 0 #000}
.bio{font-family:var(--sa);font-weight:700;font-size:clamp(22px,3vw,36px);line-height:1.15;color:var(--c);margin:22px 0 30px;letter-spacing:-.5px}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;font-family:var(--px);font-size:12px;padding:17px 22px;border-radius:12px;border:3px solid #000;box-shadow:5px 5px 0 #000;transition:transform .15s,box-shadow .15s}
.btn:hover{transform:translate(-2px,-2px);box-shadow:7px 7px 0 #000}
.btn:active{transform:translate(3px,3px);box-shadow:2px 2px 0 #000}
.btn.o{background:var(--o);color:var(--c)}.btn.c{background:var(--c);color:var(--n)}.btn.g{background:var(--g);color:var(--n)}
.btn[aria-disabled]{opacity:.8;cursor:default}
.scroll{position:absolute;left:50%;bottom:22px;width:26px;height:42px;border:2px solid var(--c);border-radius:14px;transform:translateX(-50%)}
.scroll span{position:absolute;left:50%;top:8px;width:4px;height:8px;margin-left:-2px;background:var(--g);animation:sc 1.6s infinite}
/* MARQUEE */
.mq{overflow:hidden;border-block:3px solid #000;position:relative;z-index:2}
.mq.g{background:var(--g);color:var(--n)}
.mq.o{background:var(--o);color:var(--c);transform:rotate(-1.2deg) scale(1.06);margin:24px 0}
.mq-t{display:flex;width:max-content;animation:mq 34s linear infinite}
.mq-t.rev{animation-direction:reverse}
.mq-t span{font-family:var(--px);font-size:clamp(11px,1.4vw,15px);padding:16px 0;white-space:nowrap}
/* SECTIONS */
.sec{position:relative;max-width:1240px;margin:0 auto;padding:clamp(80px,11vw,140px) clamp(18px,4vw,40px)}
.px-div{position:absolute;top:0;left:clamp(18px,4vw,40px);right:clamp(18px,4vw,40px);height:12px;background:linear-gradient(90deg,var(--g) 0 12px,transparent 12px 20px) 0 0/20px 12px repeat-x;transform:scaleX(0);transform-origin:left;transition:transform 1s steps(24)}
.px-div.in{transform:scaleX(1)}
.eyebrow{font-family:var(--vt);font-size:24px;color:var(--g);letter-spacing:1px}
.h2{font-family:var(--sa);font-weight:700;font-size:clamp(36px,6vw,76px);line-height:1;letter-spacing:-2px;color:var(--c);margin:10px 0 48px}
/* reveal: pixel dissolve via stepped transform+opacity */
.rv{opacity:0;transform:translateY(34px) scale(.98);transition:opacity .7s var(--d,0ms) steps(7),transform .7s var(--d,0ms) cubic-bezier(.2,.8,.2,1)}
.rv.in{opacity:1;transform:none}
/* LORE */
.lore{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.lc{background:linear-gradient(160deg,var(--n3),var(--n2));border:3px solid #000;border-radius:var(--r);padding:30px 26px;box-shadow:8px 8px 0 #000;position:relative;overflow:hidden}
.lc::after{content:"";position:absolute;right:-30px;top:-30px;width:110px;height:110px;background:repeating-linear-gradient(45deg,rgba(63,209,74,.14) 0 6px,transparent 6px 12px);border-radius:50%}
.lc b{font-family:var(--vt);font-size:22px;font-weight:400;color:var(--o)}
.lc h3{font-family:var(--px);font-size:20px;color:var(--g);margin:14px 0 12px}
.lc p{font-size:18px;color:var(--ink)}
/* BUTTON */
.press{text-align:center}
.press .h2{margin-bottom:40px}
.big{position:relative;width:min(300px,68vw);aspect-ratio:1;border-radius:50%;background:#1a1a1a;border:6px solid #000;box-shadow:0 18px 0 #000,0 0 0 14px var(--n3),0 0 0 18px #000,0 0 80px rgba(240,90,40,.35);margin:10px auto 0;display:block}
.big-cap{position:absolute;inset:12px;border-radius:50%;background:radial-gradient(circle at 34% 28%,var(--o2),var(--o) 52%,#9c2f0c);box-shadow:inset 0 -14px 0 rgba(0,0,0,.28),0 14px 0 #5a1a06;display:grid;place-content:center;gap:6px;transform:translateY(-10px);transition:transform .12s,box-shadow .12s}
.big:hover .big-cap{transform:translateY(-6px)}
.big:active .big-cap,.glitching .big-cap{transform:translateY(6px);box-shadow:inset 0 -6px 0 rgba(0,0,0,.28),0 2px 0 #5a1a06}
.big-ico{font-size:clamp(56px,10vw,86px);line-height:1;color:var(--c)}
.big-l{font-family:var(--px);font-size:14px;color:var(--c)}
.big::before{content:"";position:absolute;inset:-34px;border-radius:50%;border:2px dashed rgba(240,90,40,.5);animation:spin 22s linear infinite}
.press-n{font-family:var(--vt);font-size:22px;color:var(--mut);margin-top:48px}
.press-n b{color:var(--g);font-weight:400}
/* GLITCH REBOOT */
.glitching main,.glitching .nav,.glitching .foot{animation:shake .65s steps(2) both}
.glitching main{filter:drop-shadow(6px 0 0 rgba(255,0,60,.7)) drop-shadow(-6px 0 0 rgba(0,220,255,.7))}
.rb{position:fixed;inset:0;z-index:150;pointer-events:none;display:grid;place-items:center;visibility:hidden}
.rb::before{content:"";position:absolute;inset:0;background:#000;opacity:0}
.rb-line{position:absolute;left:0;right:0;top:50%;height:4px;margin-top:-2px;background:#fff;box-shadow:0 0 30px #fff;transform:scaleX(0)}
.rb-txt{position:relative;font-family:var(--px);font-size:clamp(26px,6vw,64px);color:var(--g);text-shadow:0 0 18px rgba(63,209,74,.8);opacity:0}
.rb.go{visibility:visible}
.rb.go::before{animation:off 1.9s both}
.rb.go .rb-line{animation:line 1.9s both}
.rb.go .rb-txt{animation:txt 1.9s both}
.rb.calm{visibility:visible}.rb.calm .rb-txt{opacity:1}
/* GALLERY */
.gal{display:grid;gap:22px}
.grow{display:flex;gap:22px;align-items:flex-start}
.gi{flex:var(--r) 1 0;min-width:0;margin:0;background:var(--n2);border:3px solid #000;border-radius:var(--r);overflow:hidden;box-shadow:6px 6px 0 #000}
.gi button{display:block;width:100%;overflow:hidden}
.gi img{width:100%;height:auto;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.gi button:hover img{transform:scale(1.04)}
.gi figcaption{font-family:var(--vt);font-size:21px;color:var(--c);padding:10px 16px;border-top:3px solid #000}
.lb{position:fixed;inset:0;z-index:180;background:rgba(3,7,18,.92);display:grid;place-items:center;padding:clamp(16px,4vw,60px)}
.lb[hidden]{display:none}
.lb img{max-width:100%;max-height:86vh;width:auto;height:auto;border:3px solid #000;border-radius:14px;box-shadow:0 0 0 2px var(--g),0 30px 80px rgba(0,0,0,.6)}
.lb-x{position:absolute;top:18px;right:18px;width:46px;height:46px;border-radius:12px;background:var(--o);color:var(--c);font-size:20px;border:3px solid #000}
/* BUY */
.ca{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:22px 24px;border:3px solid var(--g);border-radius:var(--r);background:#030a1a;box-shadow:0 0 0 3px #000,8px 8px 0 3px #000,0 0 40px rgba(63,209,74,.15);margin-bottom:34px}
.ca-k{font-family:var(--px);font-size:11px;color:var(--o)}
.ca code{flex:1;min-width:0;font-family:var(--vt);font-size:clamp(24px,3.4vw,38px);color:var(--g);overflow-wrap:anywhere;text-shadow:0 0 10px rgba(63,209,74,.5)}
.ca-b{font-family:var(--px);font-size:12px;padding:14px 18px;border-radius:10px;background:var(--g);color:var(--n);border:3px solid #000}
.ca-b:disabled{background:#2a3858;color:#7d8bab;cursor:not-allowed}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;list-style:none}
.st{background:var(--c);color:var(--n);border:3px solid #000;border-radius:var(--r);padding:24px;box-shadow:6px 6px 0 #000}
.st i{font-family:var(--px);font-style:normal;font-size:12px;color:var(--o)}
.st h3{font-family:var(--px);font-size:16px;margin:14px 0 8px}
.st p{font-weight:500}
.ctr{text-align:center;margin-top:36px}
/* CHART */
.crt{position:relative;border:12px solid #1d1d22;border-radius:28px;background:#000;box-shadow:0 0 0 3px #000,10px 10px 0 3px #000,inset 0 0 60px rgba(63,209,74,.15);overflow:hidden;min-height:340px;display:grid;place-items:center}
.crt:has(iframe){aspect-ratio:16/9;min-height:0}
.crt iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.nosig{text-align:center;padding:30px;font-family:var(--vt);font-size:22px;color:var(--mut)}
.ns{font-family:var(--px);font-size:clamp(22px,4.5vw,44px);color:var(--g);margin-bottom:14px;animation:blink 1.4s steps(2) infinite;text-shadow:0 0 14px rgba(63,209,74,.7)}
.crt::after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(255,255,255,.04) 0 2px,transparent 2px 4px)}
/* COMMUNITY */
.com{padding-top:40px}
.banner{border:3px solid #000;border-radius:22px;overflow:hidden;box-shadow:10px 10px 0 #000}
.banner img{width:100%;height:auto;aspect-ratio:3/1;object-fit:cover}
.socs{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:26px}
.soc{display:flex;align-items:center;gap:16px;padding:22px 24px;background:var(--n2);border:3px solid #000;border-radius:var(--r);box-shadow:6px 6px 0 #000;transition:transform .15s,box-shadow .15s}
.soc:hover{transform:translate(-2px,-2px);box-shadow:8px 8px 0 #000}
.soc b{display:grid;place-items:center;width:52px;height:52px;flex:none;border-radius:12px;background:var(--g);color:var(--n);font-family:var(--px);font-size:14px;border:3px solid #000}
.soc span{flex:1;min-width:0;font-family:var(--vt);font-size:24px;color:var(--c);overflow-wrap:anywhere}
.soc em{font-family:var(--px);font-size:11px}
/* FOOTER */
.foot{text-align:center;padding:40px 20px 56px;overflow:hidden}
.foot-big{font-family:var(--px);font-size:clamp(48px,15vw,220px);line-height:1;color:transparent;-webkit-text-stroke:2px var(--g2);opacity:.6;white-space:nowrap}
.foot-t{font-weight:700;font-size:clamp(18px,2.4vw,26px);color:var(--c);margin:18px 0 10px}
.foot-s{font-size:13px;color:var(--mut);max-width:60ch;margin:0 auto}
/* KEYFRAMES */
@keyframes zoom{from{transform:scale(1.08)}to{transform:scale(1)}}
@keyframes gl1{0%,86%,95%,100%{transform:none;opacity:0}88%{transform:translate(-6px,-2px);opacity:.85}92%{transform:translate(5px,1px);opacity:.85}}
@keyframes gl2{0%,86%,95%,100%{transform:none;opacity:0}89%{transform:translate(6px,2px);opacity:.85}93%{transform:translate(-4px,-1px);opacity:.85}}
@keyframes sc{0%{transform:translateY(0);opacity:1}100%{transform:translateY(14px);opacity:0}}
@keyframes mq{to{transform:translateX(-50%)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes blink{50%{opacity:.25}}
@keyframes shake{0%{transform:translate(0)}20%{transform:translate(-10px,4px) skewX(3deg)}40%{transform:translate(8px,-6px) skewX(-4deg)}60%{transform:translate(-6px,2px)}80%{transform:translate(4px,-2px) skewX(2deg)}100%{transform:none}}
@keyframes off{0%{opacity:0}8%{opacity:1}75%{opacity:1}100%{opacity:0}}
@keyframes line{0%{transform:scaleX(1) scaleY(60)}10%{transform:scaleX(1) scaleY(1)}22%{transform:scaleX(0) scaleY(1)}55%{transform:scaleX(0)}62%{transform:scaleX(1) scaleY(1)}72%{transform:scaleX(1) scaleY(120);opacity:0}100%{opacity:0}}
@keyframes txt{0%,30%{opacity:0;transform:scale(.9)}38%,68%{opacity:1;transform:none}80%,100%{opacity:0}}
/* RESPONSIVE */
@media (max-width:980px){.steps{grid-template-columns:repeat(2,1fr)}.links{display:none}}
@media (max-width:700px){
.grow{flex-direction:column;align-items:stretch}.gi{flex:none}
.lore,.socs,.steps{grid-template-columns:1fr}
.hero{display:block;min-height:0;padding-top:60px}
.hero-bg{position:relative;inset:auto;right:auto;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;object-position:50% 45%;transform-origin:50% 50%}
.hero-shade{background:linear-gradient(0deg,var(--n) 45%,transparent 62%)}
.hero-c{position:relative;margin-top:-70px;padding:0 18px 90px}
.glitch{letter-spacing:-1px;text-shadow:3px 3px 0 var(--g2),6px 6px 0 #000}
.mq.o{transform:rotate(-1.2deg) scale(1.06)}
.btn{font-size:11px;padding:15px 16px}
.ca{padding:18px}
}
@media (prefers-reduced-motion:reduce){
*,*::before,*::after{animation:none!important;transition:none!important}
html{scroll-behavior:auto}
.rv{opacity:1;transform:none}.px-div{transform:none}
.boot{display:none}
}
@media (min-width:1350px){.hero-bg{right:-25vw}}
