:root{--ink:#080a11;--panel:#111522;--blue:#4e597a;--bone:#e7e0cd;--muted:#9999a3;--red:#df513e;--line:rgba(231,224,205,.25)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ink);color:var(--bone);font-family:"Space Grotesk",sans-serif;overflow-x:hidden}
.grain{position:fixed;inset:0;z-index:99;pointer-events:none;opacity:.075;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 220 220' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.9'/%3E%3C/svg%3E")}
#boot{position:fixed;inset:0;background:#080a11;z-index:1000;display:grid;place-content:center;justify-items:center;gap:15px;font-family:"DM Mono";letter-spacing:.13em;transition:opacity .7s,visibility .7s}
#boot.gone{opacity:0;visibility:hidden}
#boot img{width:min(260px,65vw);image-rendering:pixelated;mix-blend-mode:screen;filter:contrast(1.2)}
#boot p{font-size:10px;margin:0;color:#a9b5d5}
#boot b{color:var(--red);font-size:13px}
.boot-grid{position:absolute;inset:0;opacity:.14;background:linear-gradient(#536084 1px,transparent 1px),linear-gradient(90deg,#536084 1px,transparent 1px);background-size:40px 40px;mask-image:radial-gradient(circle,black,transparent 65%)}
header{height:80px;padding:15px 4vw;display:flex;align-items:center;justify-content:space-between;position:absolute;z-index:5;width:100%;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:8px;color:var(--bone);text-decoration:none;font-family:"Black Ops One";font-size:15px;line-height:.8;letter-spacing:.04em}
.brand i{display:block;width:26px;height:26px;background:var(--red);clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%)}
nav{display:flex;gap:27px}
nav a,.footer-links a{color:var(--bone);font:10px "DM Mono";letter-spacing:.08em;text-decoration:none}
.socials{display:flex;gap:8px}
.socials a{width:32px;height:32px;border:1px solid var(--line);display:grid;place-items:center;color:var(--bone);text-decoration:none;font:15px "DM Mono";transition:.2s}
.socials a:hover{background:var(--bone);color:var(--ink)}
.menu{display:none;background:none;color:var(--bone);border:0;font-size:20px}
.hero{min-height:100svh;display:grid;grid-template-columns:1fr 1fr;position:relative;overflow:hidden;background:radial-gradient(circle at 62% 42%,#323956 0,transparent 30%),linear-gradient(135deg,#0b0c14,#141a2d 72%,#151220)}
.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,10,17,.55),transparent 50%),repeating-linear-gradient(140deg,transparent 0 18px,rgba(231,224,205,.035) 19px 20px)}
.hero-copy{padding:165px 4vw 80px;position:relative;z-index:2}
.eyebrow,.section-label{font:10px "DM Mono";letter-spacing:.15em;color:#a5b3d4}
.eyebrow span{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--red);margin-right:8px;box-shadow:0 0 15px var(--red)}
h1,h2{font-family:"Black Ops One";font-weight:400;letter-spacing:.01em;line-height:.82;margin:22px 0;color:var(--bone)}
h1{font-size:clamp(64px,9.5vw,155px)}
h2{font-size:clamp(48px,7vw,112px)}
em{font-style:normal;color:var(--red);text-shadow:3px 3px 0 #551f26}
.hero-copy>p,.dex-panel>p{max-width:350px;line-height:1.5;color:#b4b3b5}
.hero-actions{display:flex;flex-direction:column;align-items:start;gap:12px;margin-top:30px}
.button{padding:16px 18px;text-decoration:none;display:inline-flex;justify-content:space-between;align-items:center;gap:35px;font:11px "DM Mono";letter-spacing:.08em;transition:transform .2s,background .2s;color:var(--bone)}
.button:hover{transform:translate(-3px,-3px);box-shadow:5px 5px 0 var(--blue)}
.button-main{background:var(--red);color:#180b10;border:1px solid var(--red);font-weight:bold}
.button-main b{font-size:18px}
.button-outline{border:1px solid var(--bone)}
.ca-button{background:#0d1020;border:1px solid var(--line);text-align:left;color:var(--bone);padding:9px 14px;min-width:360px}
.ca-button small{display:block;color:#85889a;font:8px "DM Mono";letter-spacing:.12em;margin-bottom:4px}
.ca-button code{font:10px "DM Mono";color:#b6c5e7;word-break:break-all}
.scroll-signal{font:9px "DM Mono";letter-spacing:.1em;position:absolute;bottom:26px;color:#9ba5c6}
.scroll-signal span{color:var(--red);font-size:20px;margin-left:8px}
.hero-media{position:relative;min-height:100%;display:grid;place-items:center;isolation:isolate}
.hero-media img{width:145%;max-width:none;position:relative;z-index:2;image-rendering:pixelated;mix-blend-mode:lighten;filter:contrast(1.1) saturate(.8);transform:rotate(-3deg)}
.orb{width:58vw;height:58vw;border-radius:50%;position:absolute;background:radial-gradient(circle at 38% 35%,#7785a8, #39415b 30%,#161827 63%,transparent 64%);filter:blur(4px)}
.stamp{position:absolute;z-index:3;bottom:14%;right:10%;border:3px solid var(--red);color:var(--red);font:20px "Black Ops One";line-height:.85;padding:9px;transform:rotate(-12deg);opacity:.8}
.ticker{position:absolute;z-index:4;bottom:0;width:120%;left:-5%;padding:12px;background:var(--bone);color:#131520;display:flex;gap:32px;justify-content:center;font:12px "DM Mono";letter-spacing:.11em;transform:rotate(-2deg)}
.ticker span:nth-child(even){color:var(--red)}
section{position:relative}
.lore{min-height:830px;padding:100px 8vw;overflow:hidden;background:#10131f}
.scene-bg{position:absolute;inset:0;background:linear-gradient(90deg,#10131f 14%,transparent 70%),url(assets/night-watch.png) 70% 50%/cover no-repeat;opacity:.65;mix-blend-mode:screen}
.lore-grid{position:relative;display:grid;grid-template-columns:1.2fr .8fr;max-width:1150px;margin:100px auto 0;align-items:center}
.lore-copy{font-size:19px;line-height:1.55;max-width:360px}
.quote{margin-top:35px;font:18px "Black Ops One";line-height:1.05;color:#b5c2df;border-left:3px solid var(--red);padding-left:16px}
.eyes{position:absolute;right:12%;bottom:8%;display:flex;gap:70px;transform:rotate(-8deg)}
.eyes b{display:block;width:65px;height:35px;background:#f8f4df;border-radius:60% 10%;box-shadow:0 0 30px #b5c2df}
.eyes b:after{content:"";display:block;margin:7px auto;width:20px;height:20px;border-radius:50%;background:#050508}
.how{padding:120px 8vw;background:linear-gradient(125deg,#0d101a,#1a2033)}
.how h2{margin:30px 0 70px}
.steps{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.step{padding:26px 30px 35px;border-right:1px solid var(--line);min-height:230px}
.step:last-child{border:0}
.step span{font:15px "DM Mono";color:var(--red)}
h3{font:24px "Black Ops One";font-weight:400;margin:40px 0 12px}
.step p{font-size:14px;max-width:220px;color:#aaa8ae;line-height:1.5}
.wide{margin-top:28px}
.dex{min-height:850px;display:grid;grid-template-columns:1fr 1fr;background:#0a0c14}
.dex-art{overflow:hidden;min-height:600px}
.dex-art img{width:100%;height:100%;object-fit:cover;opacity:.9;filter:contrast(1.1) saturate(.6)}
.dex-panel{padding:125px 8vw;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}
.chart-shell{width:100%;height:150px;border:1px solid var(--line);margin:20px 0;background:repeating-linear-gradient(0deg,transparent 0 29px,rgba(190,200,226,.08) 30px),repeating-linear-gradient(90deg,transparent 0 48px,rgba(190,200,226,.08) 49px);position:relative;overflow:hidden}
.chart-shell:after{content:"";position:absolute;inset:20px 0 10px;background:linear-gradient(150deg,transparent 0 10%,#df513e 11% 13%,transparent 14% 24%,#df513e 25% 27%,transparent 28% 38%,#df513e 39% 41%,transparent 42% 56%,#df513e 57% 59%,transparent 60%);opacity:.75}
.chart-placeholder{position:absolute;z-index:1;inset:0;display:grid;place-content:center;text-align:center;font:8px "DM Mono";letter-spacing:.08em;color:#a7a6b0}
.chart-placeholder i{font-size:26px;color:var(--red)}
.roadmap{padding:115px 8vw 160px;background:#111523}
.roadmap h2{margin:30px 0 100px}
.route{display:grid;grid-template-columns:repeat(4,1fr);position:relative}
.route:before{content:"";height:2px;background:linear-gradient(90deg,var(--red),var(--bone),#4d587a);position:absolute;top:16px;left:0;right:0}
.route article{padding:48px 23px 0 0}
.route b{display:grid;place-items:center;position:relative;width:34px;height:34px;border:2px solid var(--bone);border-radius:50%;background:#111523;color:var(--bone);font:11px "DM Mono"}
.route .active b{border-color:var(--red);color:var(--red);box-shadow:0 0 20px rgba(223,81,62,.6)}
.route span{display:block;font:17px "Black Ops One";margin:25px 0 10px}
.route p{font-size:13px;line-height:1.5;color:#a5a4aa;max-width:180px}
.final{min-height:690px;overflow:hidden;display:grid;grid-template-columns:1fr 1fr;background:radial-gradient(circle at 20% 50%,#3c4561,transparent 35%),#0a0b11}
.final-possum{width:100%;height:100%;object-fit:cover;object-position:center;opacity:.7;filter:grayscale(.2) contrast(1.2)}
.final-copy{padding:120px 8vw;align-self:center;position:relative}
.final-copy p{font:10px "DM Mono";letter-spacing:.12em}
.final-copy .ca-button{display:block;margin-top:12px}
footer{padding:45px 4vw 22px;display:grid;grid-template-columns:1fr 2fr 1fr;gap:20px;background:#080a11;border-top:1px solid var(--line);align-items:start}
.footer-links{display:flex;justify-content:center;gap:20px;flex-wrap:wrap}
.footer-links a{padding:6px;border:1px solid transparent}
.footer-links a:hover{border-color:var(--line)}
footer>p{grid-column:1/-1;margin:28px 0 0;font:8px "DM Mono";letter-spacing:.08em;color:#717583}
.reveal{opacity:0;transform:translateY(30px);transition:opacity .8s ease,transform .8s ease}
.reveal.visible{opacity:1;transform:none}
@media(max-width:800px){
header{height:65px}
nav{display:none}
.menu{display:block}
.hero{grid-template-columns:1fr;min-height:780px}
.hero-copy{padding:115px 7vw 50px}
.hero-media{position:absolute;inset:70px -12% 0 25%;opacity:.58}
.hero-media img{width:170%}
.orb{width:110vw;height:110vw}
.hero-copy{pointer-events:none}
.hero-actions,.hero-actions>*{pointer-events:auto}
.hero-copy>p{max-width:220px}
.stamp{display:none}
.ticker{font-size:8px;gap:15px}
.ca-button{min-width:0;width:min(360px,88vw)}
.lore{min-height:720px;padding:90px 7vw}
.scene-bg{background-position:65% 50%;opacity:.45}
.lore-grid{grid-template-columns:1fr;margin-top:70px}
.lore-copy{font-size:16px}
.eyes{right:20%;bottom:10%;gap:35px}
.eyes b{width:42px;height:24px}
.how,.roadmap{padding:85px 7vw}
.steps,.dex,.final{grid-template-columns:1fr}
.step{border-right:0;border-bottom:1px solid var(--line);min-height:auto}
.dex-art{height:360px;min-height:0}
.dex-panel{padding:80px 7vw}
.roadmap h2{margin-bottom:60px}
.route{grid-template-columns:1fr 1fr;gap:20px}
.route:before{height:auto;width:2px;left:16px;top:0;bottom:0}
.route article{padding:0 15px 10px 52px}
.route span{margin:0 0 8px}
.final{min-height:720px}
.final-possum{position:absolute;inset:0;opacity:.3}
.final-copy{padding:100px 7vw;z-index:1}
footer{grid-template-columns:1fr 1fr}
.footer-links{justify-content:flex-start}
.socials{justify-content:flex-end}
}
