/* MAX PRESTIGE — dark terminal / pixel / CRT */
:root{
  --void:#050506; --void-2:#0a0a0d; --panel:#0e0e13;
  --fire:#ff5a1f; --fire-2:#ff8c1a; --blood:#c2170c; --bone:#f2e9d8;
  --sol-p:#9945FF; --sol-g:#14F195;
  --dim:#7a7268; --line:rgba(255,90,31,.18); --line-2:rgba(153,69,255,.22);
  --mono:"VT323",ui-monospace,monospace; --px:"Press Start 2P",ui-monospace,monospace;
  --ease:cubic-bezier(.16,1,.3,1);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  background:var(--void); color:var(--bone); font-family:var(--mono);
  font-size:20px; line-height:1.5; overflow-x:hidden;
  image-rendering:pixelated;
}
img{max-width:100%;display:block;image-rendering:pixelated}
a{color:inherit;text-decoration:none}
button,input{font-family:inherit;font-size:inherit}
.wrap{width:100%;max-width:1180px;margin:0 auto;padding:0 20px}
.px{font-family:var(--px);letter-spacing:0}
.fire{color:var(--fire)} .sp{color:var(--sol-p)} .sg{color:var(--sol-g)} .dim{color:var(--dim)}

/* ---------- CRT overlays ---------- */
#crt{position:fixed;inset:0;z-index:100;pointer-events:none}
#crt::before{
  content:"";position:absolute;inset:0;
  background:repeating-linear-gradient(0deg,rgba(0,0,0,.32) 0 1px,transparent 1px 3px);
  opacity:.55;
}
#crt::after{
  content:"";position:absolute;inset:0;
  background:radial-gradient(ellipse at center,transparent 52%,rgba(0,0,0,.72) 100%);
}
#noise{
  position:fixed;inset:-50%;z-index:99;pointer-events:none;opacity:.045;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grain 700ms steps(4) infinite;
}
@keyframes grain{
  0%{transform:translate(0,0)}25%{transform:translate(-3%,2%)}
  50%{transform:translate(2%,-3%)}75%{transform:translate(-2%,-2%)}100%{transform:translate(0,0)}
}
@media (prefers-reduced-motion:reduce){#noise{animation:none}}

/* ---------- Boot ---------- */
#boot{
  position:fixed;inset:0;z-index:200;background:var(--void);
  display:flex;align-items:center;justify-content:center;padding:24px;
  transition:opacity .5s var(--ease),visibility .5s;
}
#boot.done{opacity:0;visibility:hidden}
.boot-inner{width:100%;max-width:760px;font-size:17px;line-height:1.65}
.boot-line{white-space:pre-wrap;word-break:break-word}
.boot-skip{
  position:fixed;right:20px;bottom:20px;font-size:15px;color:var(--dim);
  border:1px solid var(--line);background:transparent;padding:8px 16px;cursor:pointer;
}
.boot-skip:hover{color:var(--bone);border-color:var(--fire)}
.cur{display:inline-block;width:9px;height:17px;background:var(--fire);
  vertical-align:-2px;animation:blink 1s steps(2) infinite}
@keyframes blink{50%{opacity:0}}

/* ---------- Nav ---------- */
header.nav{
  position:fixed;inset:0 0 auto 0;z-index:60;display:flex;align-items:center;
  justify-content:space-between;gap:12px;padding:10px 20px;
  background:rgba(5,5,6,.86);backdrop-filter:blur(6px);
  border-bottom:1px solid var(--line);
}
.brand{display:flex;align-items:center;gap:10px}
.brand img{width:34px;height:34px;flex:none}
.brand .bt{font-family:var(--px);font-size:11px;letter-spacing:.06em}
.nav-links{display:flex;align-items:center;gap:18px;font-size:18px;overflow-x:auto;scrollbar-width:none}
.nav-links::-webkit-scrollbar{display:none}
.nav-links a{color:var(--dim);white-space:nowrap;transition:color .2s}
.nav-links a:hover{color:var(--fire)}
.nav-cta{
  flex:none;font-family:var(--px);font-size:10px;padding:11px 16px;
  background:var(--fire);color:#0a0500;border:0;cursor:pointer;
  box-shadow:0 0 0 1px var(--fire),4px 4px 0 rgba(255,90,31,.28);
  transition:transform .15s var(--ease),box-shadow .15s;
}
.nav-cta:hover{transform:translate(-2px,-2px);box-shadow:0 0 0 1px var(--fire),6px 6px 0 rgba(255,90,31,.4)}
@media(max-width:760px){.nav-links a{font-size:16px}.brand .bt{font-size:9px}}

/* ---------- Hero ---------- */
.hero{
  min-height:100svh;display:flex;flex-direction:column;align-items:center;
  justify-content:center;text-align:center;padding:100px 20px 60px;position:relative;
}
.hero-glow{
  position:absolute;top:18%;left:50%;transform:translateX(-50%);
  width:min(680px,90vw);aspect-ratio:1;pointer-events:none;
  background:radial-gradient(circle,rgba(255,90,31,.20),transparent 62%);
}
.hero-logo{width:min(300px,58vw);margin:0 auto 26px;position:relative}
.hero-logo img{width:100%;filter:drop-shadow(0 0 34px rgba(255,90,31,.42))}
.wordmark{
  font-family:var(--px);line-height:1.14;letter-spacing:.02em;
  font-size:clamp(1.5rem,6.4vw,4.1rem);margin-bottom:22px;
  text-shadow:3px 3px 0 var(--blood),-2px -2px 0 rgba(153,69,255,.55);
}
.tagline{
  font-size:clamp(1.1rem,2.8vw,1.6rem);color:var(--bone);margin-bottom:8px;letter-spacing:.04em;
}
.tagline b{color:var(--fire)}
.sub{color:var(--dim);font-size:1.05rem;margin-bottom:34px}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;justify-content:center}
.btn{
  font-family:var(--px);font-size:11px;padding:16px 26px;cursor:pointer;
  border:1px solid var(--fire);background:transparent;color:var(--bone);
  transition:transform .15s var(--ease),background .2s,color .2s;
}
.btn:hover{transform:translate(-2px,-2px);background:var(--fire);color:#0a0500}
.btn-p{background:var(--fire);color:#0a0500;box-shadow:5px 5px 0 rgba(194,23,12,.6)}
.btn-p:hover{background:var(--fire-2)}
.btn-s{border-color:var(--sol-p);color:var(--sol-p)}
.btn-s:hover{background:var(--sol-p);color:#fff}

/* ---------- Marquee ---------- */
.mq{border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  background:var(--void-2);overflow:hidden;padding:12px 0}
.mq-track{display:flex;gap:44px;white-space:nowrap;animation:slide 26s linear infinite;font-size:18px}
.mq-track span{color:var(--dim)} .mq-track b{color:var(--fire)}
@keyframes slide{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.mq-track{animation:none}}

/* ---------- Sections ---------- */
section{padding:clamp(64px,9vw,110px) 0;position:relative}
.kick{font-family:var(--px);font-size:10px;letter-spacing:.14em;color:var(--fire);margin-bottom:16px}
h2.t{font-family:var(--px);font-size:clamp(1.1rem,3.4vw,2rem);line-height:1.35;margin-bottom:18px}
.lead{color:var(--dim);max-width:680px;font-size:1.08rem}
.center{text-align:center}.center .lead{margin-left:auto;margin-right:auto}

/* ---------- Terminal ---------- */
.term{
  border:1px solid var(--line);background:#07070a;max-width:900px;margin:0 auto;
  box-shadow:0 0 60px rgba(255,90,31,.07),inset 0 0 90px rgba(0,0,0,.6);
}
.term-bar{display:flex;align-items:center;gap:8px;padding:9px 14px;
  border-bottom:1px solid var(--line);background:#0b0b10;font-size:15px;color:var(--dim)}
.dot{width:9px;height:9px;background:var(--blood)}
.dot.g{background:var(--sol-g)}.dot.p{background:var(--sol-p)}
.term-body{padding:16px;height:340px;overflow-y:auto;font-size:18px;line-height:1.55}
.term-body::-webkit-scrollbar{width:8px}
.term-body::-webkit-scrollbar-thumb{background:var(--line)}
.term-line{white-space:pre-wrap;word-break:break-word}
.term-in{display:flex;align-items:center;gap:8px;border-top:1px solid var(--line);padding:11px 14px}
.term-in span{color:var(--fire)}
.term-in input{flex:1;background:transparent;border:0;color:var(--bone);outline:none;font-size:18px}

/* ---------- Vault (asset grid) ---------- */
.vault{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media(max-width:900px){.vault{grid-template-columns:repeat(3,1fr)}}
@media(max-width:600px){.vault{grid-template-columns:repeat(2,1fr)}}
.vcell{
  position:relative;aspect-ratio:1;overflow:hidden;border:1px solid var(--line);
  background:#08080b;transition:border-color .2s,transform .2s var(--ease);
}
.vcell:hover{border-color:var(--fire);transform:translateY(-3px)}
.vcell img{width:100%;height:100%;object-fit:cover}
.vcell figcaption{
  position:absolute;left:0;right:0;bottom:0;padding:7px 9px;font-size:14px;
  background:linear-gradient(180deg,transparent,rgba(5,5,6,.92));color:var(--dim);
}
.vcell:hover figcaption{color:var(--bone)}

/* ---------- 1000x machine ---------- */
.mach{max-width:720px;margin:0 auto;text-align:center}
.reel{
  border:1px solid var(--line-2);background:#08080c;padding:38px 20px;margin-bottom:20px;
  min-height:210px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;
  box-shadow:inset 0 0 70px rgba(153,69,255,.09);
}
.reel-out{font-family:var(--px);font-size:clamp(1rem,4vw,2rem);line-height:1.4}
.reel-sub{color:var(--dim);font-size:1.02rem;max-width:460px}
.reel.win{box-shadow:inset 0 0 90px rgba(20,241,149,.18);border-color:var(--sol-g)}
.reel.lose{box-shadow:inset 0 0 90px rgba(194,23,12,.16);border-color:var(--blood)}
.odds{display:flex;justify-content:center;gap:26px;flex-wrap:wrap;margin-top:20px;font-size:16px;color:var(--dim)}
.odds b{color:var(--bone)}

/* ---------- Manifesto ---------- */
.manif{max-width:760px;margin:0 auto}
.manif p{margin-bottom:18px;font-size:1.12rem}
.manif .hl{color:var(--fire)}
.manif .q{font-family:var(--px);font-size:clamp(.85rem,2.4vw,1.15rem);line-height:1.6;
  color:var(--bone);margin:30px 0;padding-left:18px;border-left:2px solid var(--fire)}

/* ---------- Stats / tokenomics ---------- */
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media(max-width:820px){.grid4{grid-template-columns:repeat(2,1fr)}}
.stat{border:1px solid var(--line);padding:24px 18px;background:linear-gradient(180deg,rgba(255,90,31,.05),transparent)}
.stat .v{font-family:var(--px);font-size:clamp(.9rem,2.2vw,1.25rem);color:var(--fire);margin-bottom:9px}
.stat .k{font-size:15px;color:var(--dim);letter-spacing:.08em;text-transform:uppercase}

/* ---------- CA ---------- */
.ca{
  display:flex;align-items:center;gap:14px;max-width:100%;margin:0 auto;width:max-content;
  border:1px solid var(--line);padding:14px 14px 14px 20px;cursor:pointer;background:#08080b;
  transition:border-color .2s,transform .2s var(--ease);
}
.ca:hover{border-color:var(--fire);transform:translateY(-2px)}
.ca code{font-size:17px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:62vw}
.ca .cb{font-family:var(--px);font-size:9px;padding:10px 14px;background:var(--fire);color:#0a0500;flex:none}
.socials{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:28px}
.socials a{border:1px solid var(--line);padding:11px 20px;font-size:17px;color:var(--dim);transition:.2s}
.socials a:hover{color:var(--bone);border-color:var(--sol-p)}

/* ---------- ASCII block ---------- */
pre.ascii{
  font-family:var(--mono);font-size:clamp(5px,1.15vw,12px);line-height:1.06;
  color:var(--fire);white-space:pre;overflow-x:auto;text-align:center;
  text-shadow:0 0 12px rgba(255,90,31,.5);
}
pre.ascii.sol{color:var(--sol-g);text-shadow:0 0 12px rgba(20,241,149,.4)}

footer{border-top:1px solid var(--line);padding:38px 0;text-align:center;color:var(--dim);font-size:16px}
.toast{
  position:fixed;left:50%;bottom:28px;transform:translateX(-50%) translateY(14px);z-index:80;
  background:var(--panel);border:1px solid var(--fire);padding:12px 22px;font-size:17px;
  opacity:0;pointer-events:none;transition:.25s;
}
.toast.on{opacity:1;transform:translateX(-50%)}
.rv{opacity:0;transform:translateY(20px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none}}

/* ---------- CHAOS VAULT — sprites break the grid and bleed off-frame ---------- */
.vault{
  display:block;position:relative;min-height:1180px;
  margin-left:calc(-1 * max(0px, (100vw - 100%) / 2));
  margin-right:calc(-1 * max(0px, (100vw - 100%) / 2));
}
.vault .vcell{
  position:absolute;aspect-ratio:1;border:1px solid var(--line);
  background:#08080b;overflow:hidden;
  transition:transform .28s var(--ease),border-color .2s,z-index 0s;
  will-change:transform;
}
.vault .vcell:hover{border-color:var(--fire);z-index:20 !important;transform:scale(1.06) rotate(0deg) !important}
.vault .vcell figcaption{font-size:12px;letter-spacing:.06em}

/* hand-placed chaos: overlaps, rotations, three sizes, four bleed off the edges */
.vault .vcell:nth-child(1){ left:-6%;  top:0;    width:30%; transform:rotate(-7deg);  z-index:3}
.vault .vcell:nth-child(2){ left:20%;  top:9%;   width:20%; transform:rotate(4deg);   z-index:6}
.vault .vcell:nth-child(3){ left:36%;  top:-4%;  width:26%; transform:rotate(-3deg);  z-index:4}
.vault .vcell:nth-child(4){ left:59%;  top:6%;   width:31%; transform:rotate(6deg);   z-index:5}
.vault .vcell:nth-child(5){ left:84%;  top:20%;  width:24%; transform:rotate(-9deg);  z-index:2}
.vault .vcell:nth-child(6){ left:-4%;  top:29%;  width:23%; transform:rotate(8deg);   z-index:7}
.vault .vcell:nth-child(7){ left:15%;  top:36%;  width:28%; transform:rotate(-5deg);  z-index:9}
.vault .vcell:nth-child(8){ left:41%;  top:31%;  width:22%; transform:rotate(3deg);   z-index:8}
.vault .vcell:nth-child(9){ left:60%;  top:40%;  width:27%; transform:rotate(-6deg);  z-index:6}
.vault .vcell:nth-child(10){left:82%;  top:56%;  width:26%; transform:rotate(7deg);   z-index:4}
.vault .vcell:nth-child(11){left:-7%;  top:62%;  width:29%; transform:rotate(-4deg);  z-index:5}
.vault .vcell:nth-child(12){left:22%;  top:68%;  width:24%; transform:rotate(9deg);   z-index:7}
.vault .vcell:nth-child(13){left:44%;  top:63%;  width:31%; transform:rotate(-8deg);  z-index:3}
.vault .vcell:nth-child(14){left:70%;  top:74%;  width:22%; transform:rotate(5deg);   z-index:6}

@media(max-width:900px){
  .vault{min-height:1560px}
  .vault .vcell{width:44% !important}
  .vault .vcell:nth-child(odd){left:-5%}
  .vault .vcell:nth-child(even){left:58%}
  .vault .vcell:nth-child(1){top:0}      .vault .vcell:nth-child(2){top:6%}
  .vault .vcell:nth-child(3){top:13%}    .vault .vcell:nth-child(4){top:19%}
  .vault .vcell:nth-child(5){top:26%}    .vault .vcell:nth-child(6){top:32%}
  .vault .vcell:nth-child(7){top:39%}    .vault .vcell:nth-child(8){top:45%}
  .vault .vcell:nth-child(9){top:52%}    .vault .vcell:nth-child(10){top:58%}
  .vault .vcell:nth-child(11){top:65%}   .vault .vcell:nth-child(12){top:71%}
  .vault .vcell:nth-child(13){top:78%}   .vault .vcell:nth-child(14){top:84%}
}

/* ---------- Bleed strip: realistic stills, cropped hard, running off both sides ---------- */
.bleed{
  display:flex;gap:0;overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  margin-left:calc(-1 * max(0px,(100vw - 100%)/2));margin-right:calc(-1 * max(0px,(100vw - 100%)/2));
}
.bleed img{
  flex:1 0 auto;width:26%;aspect-ratio:1;object-fit:cover;
  filter:grayscale(.35) contrast(1.15);opacity:.82;transition:.3s var(--ease);
}
.bleed img:first-child{margin-left:-7%}
.bleed img:last-child{margin-right:-7%}
.bleed img:hover{filter:none;opacity:1;transform:scale(1.04)}
@media(max-width:760px){.bleed img{width:52%}}

/* chaos must bleed visually without creating a horizontal scrollbar */
#vault{overflow-x:clip;overflow-y:visible}
.bleed{max-width:100vw}
html,body{max-width:100%;overflow-x:hidden}

/* ---------- X community button ---------- */
.x-btn{
  display:inline-flex;align-items:center;gap:12px;
  font-family:var(--px);font-size:12px;letter-spacing:.04em;
  padding:18px 30px;border:1px solid var(--fire);color:var(--bone);
  background:linear-gradient(180deg,rgba(255,90,31,.14),rgba(255,90,31,.04));
  box-shadow:6px 6px 0 rgba(194,23,12,.55);
  transition:transform .16s var(--ease),box-shadow .16s,background .2s;
}
.x-btn:hover{transform:translate(-3px,-3px);box-shadow:9px 9px 0 rgba(194,23,12,.7);
  background:var(--fire);color:#0a0500}
.x-btn .xg{font-family:inherit;font-size:16px}
.hero .x-btn{font-size:11px;padding:15px 24px}

/* ---------- live ticker ---------- */
.ticker{position:relative;z-index:3;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  background:linear-gradient(90deg,rgba(255,90,31,.10),rgba(255,209,102,.04) 50%,rgba(255,90,31,.10))}
.ticker-inner{display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding-top:16px;padding-bottom:16px;flex-wrap:wrap}
.tk{display:flex;flex-direction:column;gap:5px;min-width:96px}
.tk .tl{font-family:var(--px);font-size:8px;letter-spacing:.1em;color:var(--dim)}
.tk .tv{font-size:1.5rem;line-height:1;color:var(--fire);font-variant-numeric:tabular-nums}
.tk .tv.up{color:var(--sol-g)} .tk .tv.down{color:var(--blood)}
.tk-cta{font-family:var(--px);font-size:10px;padding:14px 20px;background:var(--fire);color:#0a0500;
  box-shadow:5px 5px 0 rgba(194,23,12,.55);transition:transform .15s var(--ease)}
.tk-cta:hover{transform:translate(-2px,-2px)}
@media(max-width:760px){.ticker-inner{gap:14px 20px}.tk{min-width:76px}.tk .tv{font-size:1.2rem}
  .tk-cta{width:100%;text-align:center}}

/* ---------- Chart ---------- */
.chart-frame{
  position:relative;max-width:1000px;margin:0 auto;aspect-ratio:16/10;
  border:1px solid var(--line);background:#07070a;overflow:hidden;
  box-shadow:0 0 70px rgba(255,90,31,.08);
}
.chart-frame iframe{width:100%;height:100%;border:0;display:block}
.chart-lock{position:absolute;inset:0;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:14px;text-align:center;padding:24px}
.chart-lock .cl{font-family:var(--px);font-size:13px;color:var(--fire)}
.chart-lock p{color:var(--dim);max-width:420px}
@media(max-width:700px){.chart-frame{aspect-ratio:3/4}}

/* ASCII must use a true fixed-width face — VT323 skews box glyphs */
pre.ascii, #asciiWall{
  font-family:ui-monospace,"SF Mono",Menlo,Consolas,"Courier New",monospace !important;
  letter-spacing:0 !important;font-variant-ligatures:none;tab-size:1;
}
#asciiWall{line-height:1.12}

/* content rides above the code rain */
header.nav,section,footer,.mq,.bleed,.toast{position:relative;z-index:3}
