:root {
  --lime: #c8ff00;
  --lime-hot: #dbff3f;
  --ink: #0b0c09;
  --soft-ink: #151811;
  --paper: #f0f6dc;
  --chrome: linear-gradient(135deg, #203015 0%, #fff 15%, #7b9463 34%, #eefdd9 49%, #304520 65%, #fff 80%, #839f6b 100%);
  --line: rgba(11, 12, 9, .18);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--lime);
  font-family: "Space Grotesk", sans-serif;
  overflow-x: hidden;
}
button, a { font: inherit; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
::selection { background: var(--ink); color: var(--lime); }

.noise {
  position: fixed; inset: 0; z-index: 90; pointer-events: none; opacity: .055;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.65'/%3E%3C/svg%3E");
}
.cursor-glow { position: fixed; width: 28rem; height: 28rem; border-radius: 50%; background: rgba(255,255,255,.22); filter: blur(60px); transform: translate(-50%,-50%); pointer-events:none; z-index:0; }
.section-pad { padding: 8rem clamp(1.25rem, 5vw, 5.5rem); position: relative; }

.nav-shell {
  position: fixed; z-index: 80; top: 1rem; left: 50%; transform: translateX(-50%);
  width: min(94%, 1360px); height: 4.25rem; padding: .55rem .65rem .55rem 1.2rem;
  display: flex; align-items: center; justify-content: space-between;
  border: 1px solid rgba(255,255,255,.55); border-radius: 1.25rem;
  background: rgba(235,255,160,.68); backdrop-filter: blur(18px) saturate(150%);
  box-shadow: 0 18px 50px rgba(41, 57, 0, .16);
}
.brand { display:flex; align-items:center; gap:.65rem; font-family:"Archivo Black"; letter-spacing:-.04em; }
.brand-orb { width: 1.45rem; aspect-ratio:1; border-radius:50%; background:var(--chrome); border:1px solid #27331d; box-shadow:inset 0 0 0 3px rgba(255,255,255,.3); }
nav { display:flex; gap:2rem; font-size:.82rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
nav a { position:relative; }
nav a::after { content:""; position:absolute; left:0; bottom:-.4rem; width:100%; height:2px; background:var(--ink); transform:scaleX(0); transition:.25s; }
nav a:hover::after { transform:scaleX(1); }

.button { display:inline-flex; align-items:center; justify-content:center; gap:.75rem; min-height:3.5rem; padding:0 1.35rem; border:1px solid var(--ink); border-radius:.8rem; font-size:.86rem; font-weight:800; letter-spacing:.08em; transition:transform .25s, box-shadow .25s, background .25s, color .25s; cursor:pointer; }
.button:hover { transform:translateY(-3px); box-shadow:5px 6px 0 var(--ink); }
.button span { font-size:1.1rem; }
.button-mini { min-height:3rem; background:var(--ink); color:white; border-radius:.75rem; }
.button-mini:hover { box-shadow:4px 5px 0 rgba(255,255,255,.65); }
.button-dark { background:var(--ink); color:white; }
.button-ghost { background:rgba(255,255,255,.28); }
.button-lime { background:var(--lime); color:var(--ink); }
.button-outline { color:white; border-color:rgba(255,255,255,.8); }
.button.is-disabled, .chart-link.is-disabled { opacity:.42; cursor:not-allowed; pointer-events:none; box-shadow:none; transform:none; }
.full-width { width:100%; }

.hero { min-height:100svh; padding-top:8.5rem; padding-bottom:6rem; display:grid; grid-template-columns:1.04fr .96fr; align-items:center; overflow:hidden; }
.hero::before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 70% 45%, rgba(255,255,255,.95) 0, rgba(255,255,255,.28) 26%, transparent 52%), linear-gradient(130deg, var(--lime) 25%, #a9f500 100%); z-index:-2; }
.hero::after { content:""; position:absolute; inset:0; background:repeating-linear-gradient(90deg, transparent 0, transparent calc(10vw - 1px), rgba(18,26,7,.08) 10vw); z-index:-1; }
.eyebrow { display:flex; align-items:center; gap:.65rem; font:500 .78rem "DM Mono"; letter-spacing:.14em; }
.eyebrow span { width:.55rem; aspect-ratio:1; background:var(--ink); border-radius:50%; box-shadow:0 0 0 .28rem rgba(11,12,9,.12); animation:pulse 2s infinite; }
h1,h2,h3,p { margin-top:0; }
h1 { margin:.65rem 0 1.4rem; font:400 clamp(5rem, 12vw, 11.5rem)/.8 "Archivo Black"; letter-spacing:-.095em; }
h1 span, h2 span { color:white; -webkit-text-stroke:2px var(--ink); text-shadow:5px 5px 0 var(--ink); }
.hero-line { max-width:35rem; font-size:clamp(1.15rem,2vw,1.65rem); line-height:1.25; font-weight:600; letter-spacing:-.025em; }
.hero-actions { display:flex; gap:.8rem; flex-wrap:wrap; margin-top:2rem; }
.mini-stats { display:flex; gap:2.5rem; margin-top:3.2rem; }
.mini-stats div { display:grid; gap:.3rem; }
.mini-stats span { font:500 .68rem "DM Mono"; opacity:.55; letter-spacing:.1em; }
.mini-stats strong { font-size:.82rem; }
.mini-stats .lime { background:var(--ink); color:var(--lime); padding:.18rem .35rem; }
.hero-visual { position:relative; display:grid; place-items:center; min-height:44rem; }
.character-frame { position:relative; width:min(87%, 38rem); aspect-ratio:1; border-radius:50%; overflow:hidden; border:1px solid rgba(25,36,11,.52); background:radial-gradient(circle, rgba(255,255,255,.95), rgba(207,255,31,.35) 52%, rgba(34,49,13,.12) 70%); box-shadow:inset 0 0 80px rgba(255,255,255,.55), 0 35px 90px rgba(50,72,5,.22); animation:float 5s ease-in-out infinite; }
.character-frame img { width:100%; height:100%; object-fit:cover; mix-blend-mode:multiply; }
.chrome-ring { position:absolute; width:92%; aspect-ratio:1; border-radius:50%; background:var(--chrome); padding:4px; animation:spin 18s linear infinite; box-shadow:0 0 40px rgba(255,255,255,.7); }
.chrome-ring::after { content:""; display:block; width:100%; height:100%; border-radius:50%; background:var(--lime); }
.hero-halo { position:absolute; border:1px solid rgba(11,12,9,.2); border-radius:50%; }
.halo-one { width:110%; aspect-ratio:1; }
.halo-two { width:130%; aspect-ratio:1; border-style:dashed; animation:spin 24s linear infinite reverse; }
.float-tag { position:absolute; background:rgba(255,255,255,.8); border:1px solid var(--ink); border-radius:999px; padding:.65rem 1rem; font:500 .7rem "DM Mono"; letter-spacing:.08em; box-shadow:4px 4px 0 var(--ink); }
.tag-one { top:18%; left:-3%; transform:rotate(-7deg); }
.tag-two { right:-2%; bottom:18%; transform:rotate(5deg); }
.scroll-cue { position:absolute; bottom:1.5rem; left:50%; transform:translateX(-50%); display:flex; align-items:center; gap:.65rem; font:500 .65rem "DM Mono"; letter-spacing:.12em; }
.scroll-cue span { width:1px; height:2rem; background:var(--ink); animation:stretch 1.5s ease-in-out infinite; }

.marquee { background:var(--ink); color:var(--lime); padding:1rem 0; overflow:hidden; transform:rotate(-1deg) scale(1.02); }
.marquee-track { display:flex; gap:2rem; width:max-content; font:400 1.25rem "Archivo Black"; animation:marquee 18s linear infinite; }
.marquee i { color:white; font-style:normal; }

.story { background:var(--paper); }
.section-index { font:500 .72rem "DM Mono"; letter-spacing:.13em; opacity:.65; margin-bottom:3rem; }
.story-grid { display:grid; grid-template-columns:1fr 1fr; gap:8vw; align-items:start; }
h2 { font:400 clamp(3.4rem,7.5vw,8.5rem)/.84 "Archivo Black"; letter-spacing:-.075em; margin-bottom:0; }
.story h2 span, .token-section h2 span { color:var(--lime); text-shadow:4px 4px 0 var(--ink); }
.story-copy { padding-top:1rem; }
.story-copy p { font-size:1.12rem; line-height:1.65; max-width:37rem; }
.story-copy .lead { font-size:clamp(1.35rem,2.2vw,2rem); line-height:1.3; font-weight:600; letter-spacing:-.03em; }
.quote { margin-top:3rem; border-left:5px solid var(--lime); padding:1rem 0 1rem 1.5rem; font:500 clamp(1.2rem,2vw,1.8rem)/1.35 "DM Mono"; }
.chrome-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin-top:6rem; }
.chrome-card { min-height:18rem; padding:1.5rem; display:flex; flex-direction:column; justify-content:flex-end; border:1px solid var(--ink); border-radius:1.4rem; background:linear-gradient(145deg, rgba(255,255,255,.9), rgba(192,255,0,.45)); position:relative; overflow:hidden; transition:.35s; }
.chrome-card::before { content:""; position:absolute; width:11rem; height:11rem; border-radius:50%; top:-4rem; right:-3rem; background:var(--chrome); filter:blur(1px); opacity:.6; }
.chrome-card:hover { transform:translateY(-9px) rotate(-1deg); box-shadow:8px 10px 0 var(--ink); }
.chrome-card > span { position:absolute; top:1.5rem; left:1.5rem; font:500 .72rem "DM Mono"; }
.chrome-card h3 { font:400 2rem "Archivo Black"; letter-spacing:-.045em; margin-bottom:.55rem; }
.chrome-card p { max-width:18rem; margin:0; line-height:1.45; }

.banner-section { background:var(--ink); color:white; }
.section-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:3rem; margin-bottom:4rem; }
.section-heading p { width:min(100%, 26rem); font-size:1.1rem; line-height:1.5; opacity:.7; }
.banner-frame { margin:0; padding:.65rem; border:1px solid rgba(255,255,255,.28); border-radius:1.5rem; background:rgba(255,255,255,.07); box-shadow:0 35px 100px rgba(196,255,0,.12); }
.banner-frame img { width:100%; aspect-ratio:3/1; object-fit:contain; border-radius:1rem; background:var(--lime); }
.banner-frame figcaption { display:flex; justify-content:space-between; padding:1rem .6rem .35rem; font:500 .68rem "DM Mono"; letter-spacing:.1em; opacity:.62; }

.token-section { background:#eaff9c; }
.token-grid { display:grid; grid-template-columns:.85fr 1.15fr; gap:1rem; }
.contract-card,.chart-card { border:1px solid var(--ink); border-radius:1.5rem; padding:1.5rem; background:rgba(255,255,255,.52); box-shadow:8px 10px 0 rgba(11,12,9,.95); }
.card-label,.chart-top { font:500 .7rem "DM Mono"; letter-spacing:.1em; }
.ca-row { margin:1rem 0 2.5rem; min-height:5.5rem; padding:1rem; display:flex; align-items:center; justify-content:space-between; gap:1rem; background:var(--ink); border-radius:1rem; color:white; }
.ca-row code { font:500 clamp(.9rem,1.5vw,1.15rem) "DM Mono"; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ca-row button { flex:0 0 auto; display:flex; align-items:center; gap:.45rem; padding:.65rem; border:1px solid rgba(255,255,255,.35); border-radius:.6rem; background:var(--lime); color:var(--ink); font-weight:800; cursor:pointer; }
.ca-row button:disabled { opacity:.4; cursor:not-allowed; }
.ca-row svg { width:1rem; fill:none; stroke:currentColor; stroke-width:1.8; }
.token-meta { display:grid; grid-template-columns:1fr 1fr; border:1px solid var(--line); border-radius:1rem; overflow:hidden; margin-bottom:1rem; }
.token-meta div { display:grid; gap:.35rem; padding:1rem; border-bottom:1px solid var(--line); }
.token-meta div:nth-child(odd) { border-right:1px solid var(--line); }
.token-meta div:nth-last-child(-n+2) { border-bottom:0; }
.token-meta span { font:500 .65rem "DM Mono"; opacity:.55; }
.token-meta strong { font-size:.9rem; }
.chart-card { display:flex; flex-direction:column; min-height:36rem; background:var(--ink); color:white; }
.chart-top { display:flex; justify-content:space-between; padding:.4rem .2rem 1rem; }
.live-dot { color:var(--lime); }
.live-dot::before { content:""; display:inline-block; width:.45rem; aspect-ratio:1; border-radius:50%; background:var(--lime); margin-right:.45rem; box-shadow:0 0 10px var(--lime); }
.chart-shell { min-height:28rem; flex:1; display:grid; place-items:center; overflow:hidden; border:1px solid rgba(255,255,255,.18); border-radius:1rem; background:radial-gradient(circle at 50% 55%, rgba(200,255,0,.16), transparent 45%), repeating-linear-gradient(0deg, transparent 0, transparent 49px, rgba(255,255,255,.06) 50px), repeating-linear-gradient(90deg, transparent 0, transparent 69px, rgba(255,255,255,.06) 70px); }
.chart-shell iframe { width:100%; height:100%; min-height:28rem; border:0; }
.chart-soon { font:400 clamp(2rem,4vw,4.5rem) "Archivo Black"; color:var(--lime); letter-spacing:-.05em; }
.chart-link { display:flex; justify-content:space-between; padding:1rem .2rem 0; font-size:.78rem; font-weight:700; letter-spacing:.1em; }

.lab { min-height:100vh; display:grid; grid-template-columns:.8fr 1.2fr; gap:7vw; align-items:center; background:var(--soft-ink); color:white; overflow:hidden; }
.lab-copy p { max-width:30rem; margin:2rem 0; font-size:1.15rem; line-height:1.6; opacity:.68; }
.lab-stage { position:relative; min-height:42rem; display:grid; place-items:center; border:1px solid rgba(255,255,255,.18); border-radius:2rem; overflow:hidden; background:radial-gradient(circle, rgba(200,255,0,.22), transparent 55%); }
.lab-stage img { position:relative; z-index:3; width:min(65%,29rem); border-radius:50%; mix-blend-mode:screen; filter:saturate(1.1) contrast(1.08); transition:filter .35s, transform .35s; }
.lab-stage.charged img { filter:saturate(1.8) contrast(1.18) drop-shadow(0 0 30px var(--lime)); transform:scale(1.025); }
.meter-copy { position:absolute; top:1.5rem; left:1.5rem; right:1.5rem; display:flex; justify-content:space-between; font:500 .7rem "DM Mono"; letter-spacing:.1em; z-index:5; }
.meter-copy strong { color:var(--lime); }
.meter { position:absolute; left:1.5rem; right:1.5rem; bottom:1.5rem; height:.5rem; background:rgba(255,255,255,.12); z-index:5; overflow:hidden; }
.meter span { display:block; width:0; height:100%; background:var(--lime); box-shadow:0 0 18px var(--lime); transition:width .35s; }
.lab-orbit { position:absolute; border:1px solid rgba(200,255,0,.38); border-radius:50%; }
.orbit-a { width:64%; aspect-ratio:1; animation:spin 9s linear infinite; }
.orbit-b { width:84%; aspect-ratio:1; border-style:dashed; animation:spin 14s linear infinite reverse; }
.particle { position:absolute; width:.8rem; aspect-ratio:1; border-radius:50%; background:var(--chrome); z-index:4; animation:burst 1.1s ease-out forwards; }

.steps { background:var(--paper); }
.steps-list { border-top:1px solid var(--ink); }
.step { min-height:17rem; display:grid; grid-template-columns:.35fr 1fr 1fr; gap:2rem; align-items:center; border-bottom:1px solid var(--ink); transition:padding .3s, background .3s; }
.step:hover { padding:0 2rem; background:var(--lime); }
.step > span { font:500 .75rem "DM Mono"; }
.step h3 { font:400 clamp(2rem,4vw,4.2rem)/.86 "Archivo Black"; letter-spacing:-.06em; margin:0; }
.step p { max-width:25rem; font-size:1.05rem; line-height:1.5; margin:0; }

.final-cta { min-height:78vh; display:grid; grid-template-columns:.75fr 1.25fr; align-items:center; background:var(--ink); color:white; overflow:hidden; }
.final-cta::after { content:""; position:absolute; width:50vw; aspect-ratio:1; right:-15vw; border-radius:50%; background:var(--lime); filter:blur(1px); opacity:.15; }
.cta-orb { width:min(80%,28rem); aspect-ratio:1; border-radius:50%; overflow:hidden; background:var(--lime); box-shadow:0 0 0 1rem rgba(200,255,0,.12),0 0 0 2rem rgba(200,255,0,.06); }
.cta-orb img { width:100%; height:100%; object-fit:cover; mix-blend-mode:multiply; }
.final-copy { position:relative; z-index:2; }
.final-copy h2 { margin-top:1.5rem; font-size:clamp(4rem,9vw,10rem); }

footer { min-height:6rem; padding:1.5rem clamp(1.25rem,5vw,5.5rem); display:flex; align-items:center; justify-content:space-between; gap:1rem; background:var(--lime); font:500 .7rem "DM Mono"; letter-spacing:.08em; }
.toast { position:fixed; left:50%; bottom:2rem; z-index:100; transform:translate(-50%,2rem); opacity:0; pointer-events:none; background:var(--ink); color:var(--lime); border:1px solid var(--lime); border-radius:.6rem; padding:.8rem 1.1rem; font:500 .75rem "DM Mono"; letter-spacing:.1em; transition:.3s; }
.toast.show { opacity:1; transform:translate(-50%,0); }
.reveal { opacity:0; transform:translateY(28px); transition:opacity .7s ease, transform .7s ease; }
.reveal.visible { opacity:1; transform:none; }

@keyframes float { 0%,100%{transform:translateY(0) rotate(-1deg)} 50%{transform:translateY(-15px) rotate(1deg)} }
@keyframes spin { to{transform:rotate(360deg)} }
@keyframes pulse { 50%{box-shadow:0 0 0 .5rem rgba(11,12,9,0)} }
@keyframes stretch { 50%{transform:scaleY(.45); transform-origin:top} }
@keyframes marquee { to{transform:translateX(-50%)} }
@keyframes burst { 0%{transform:translate(0,0) scale(.3);opacity:1} 100%{transform:translate(var(--tx),var(--ty)) scale(1.7);opacity:0} }

@media (max-width: 900px) {
  .nav-shell nav { display:none; }
  .hero { grid-template-columns:1fr; padding-top:9rem; }
  .hero-copy { position:relative; z-index:4; }
  .hero-visual { min-height:32rem; margin-top:2rem; }
  .character-frame { width:min(82vw,32rem); }
  .story-grid,.token-grid,.lab,.final-cta { grid-template-columns:1fr; }
  .chrome-cards { grid-template-columns:1fr; }
  .chrome-card { min-height:13rem; }
  .section-heading { align-items:flex-start; flex-direction:column; }
  .lab-stage { min-height:34rem; }
  .final-cta { gap:5rem; }
  .cta-orb { width:min(70vw,25rem); }
}

@media (max-width: 620px) {
  .section-pad { padding:5.5rem 1.15rem; }
  .nav-shell { height:3.8rem; top:.65rem; }
  .button-mini { min-height:2.7rem; padding:0 .9rem; font-size:.7rem; }
  h1 { font-size:clamp(4.5rem,25vw,7.2rem); }
  .hero { padding-top:7rem; }
  .hero-line { font-size:1.1rem; }
  .hero-actions { flex-direction:column; }
  .hero-actions .button { width:100%; }
  .mini-stats { gap:1rem; justify-content:space-between; }
  .mini-stats strong { font-size:.72rem; }
  .hero-visual { min-height:25rem; }
  .tag-one { left:0; top:12%; }
  .tag-two { right:0; bottom:10%; }
  .story-grid { gap:3rem; }
  .banner-frame { padding:.35rem; }
  .banner-frame img { border-radius:.75rem; }
  .banner-frame figcaption { font-size:.55rem; }
  .token-grid { gap:1.5rem; }
  .contract-card,.chart-card { padding:1rem; border-radius:1rem; box-shadow:5px 6px 0 var(--ink); }
  .ca-row { min-height:4.5rem; }
  .ca-row button span { display:none; }
  .chart-card { min-height:30rem; }
  .chart-shell,.chart-shell iframe { min-height:23rem; }
  .lab { gap:3rem; }
  .lab-stage { min-height:27rem; }
  .step { grid-template-columns:.2fr 1fr; padding:2rem 0; }
  .step p { grid-column:2; }
  .step:hover { padding:2rem .6rem; }
  .final-cta { min-height:90vh; }
  footer { align-items:flex-start; flex-direction:column; }
  .cursor-glow { display:none; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; scroll-behavior:auto !important; }
  .reveal { opacity:1; transform:none; }
}