[hidden] { display: none !important; }
:root {
  --bg: #05060a; --panel: rgba(12,14,22,0.82); --line: #1b2030; --text: #dfe5f0; --muted: #6b7385;
  --cyan: #5ef2ff; --gold: #ffcf5a; --pink: #ff4fd8; --green: #5dff9e; --red: #ff5d6c;
  --exec: #7fb4ff; --ai: #d59cff; --verify: #5dff9e; --sys: #6b7385;
  --mono: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: var(--text); font: 14px/1.55 var(--mono); overflow-x: hidden; }
body::before { content: ""; position: fixed; inset: 0; pointer-events: none; z-index: -1;
  background: radial-gradient(1200px 600px at 80% -10%, rgba(94,242,255,0.08), transparent 60%), radial-gradient(900px 500px at 0% 40%, rgba(255,79,216,0.06), transparent 60%); }
.scanlines { position: fixed; inset: 0; pointer-events: none; z-index: 50; background: repeating-linear-gradient(0deg, rgba(255,255,255,0.018) 0 1px, transparent 1px 3px); mix-blend-mode: overlay; }
a { color: var(--cyan); text-decoration: none; }
a:hover { text-decoration: underline; }
.muted { color: var(--muted); } .small { font-size: 12px; }
h1, h2, h3 { font-weight: 700; margin: 0; }
h2 { font-size: 13px; text-transform: uppercase; letter-spacing: .12em; }
h3 { font-size: 11px; color: var(--muted); margin: 14px 0 6px; text-transform: uppercase; letter-spacing: .1em; }
.eyebrow { color: var(--cyan); font-size: 11px; text-transform: uppercase; letter-spacing: .14em; display: block; margin-bottom: 4px; }

/* header */
.top { display: flex; justify-content: space-between; align-items: center; padding: 14px 24px; position: fixed; inset: 0 0 auto 0; z-index: 20; background: linear-gradient(rgba(5,6,10,.9), rgba(5,6,10,.55)); backdrop-filter: blur(8px); border-bottom: 1px solid rgba(94,242,255,.08); }
.brand { color: var(--text); font-weight: 800; letter-spacing: .2em; display: flex; align-items: center; gap: 10px; }
.brand:hover { text-decoration: none; }
.dot { width: 8px; height: 8px; border-radius: 50%; background: var(--muted); display: inline-block; }
.dot.live { background: var(--green); box-shadow: 0 0 10px var(--green), 0 0 20px var(--green); animation: pulse 1.6s infinite; }
.live-label { font-size: 10px; letter-spacing: .14em; color: var(--muted); font-weight: 400; text-transform: uppercase; }
@keyframes pulse { 50% { opacity: .35; } }
nav { display: flex; gap: 20px; }
nav a { color: var(--muted); font-size: 12px; text-transform: uppercase; letter-spacing: .1em; }
nav a:hover { color: var(--cyan); text-decoration: none; text-shadow: 0 0 10px var(--cyan); }

/* hero */
.hero { position: relative; min-height: 100vh; display: flex; align-items: center; overflow: hidden; }
#hero-canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(5,6,10,.92) 0%, rgba(5,6,10,.55) 45%, rgba(5,6,10,0) 75%), linear-gradient(0deg, var(--bg), transparent 25%); pointer-events: none; }
.hero-inner { position: relative; z-index: 2; max-width: 1240px; margin: 0 auto; padding: 120px 24px 60px; width: 100%; }
.kicker { color: var(--gold); text-transform: uppercase; letter-spacing: .2em; font-size: 12px; margin: 0 0 18px; }
.blink { color: var(--red); animation: pulse 1s infinite; }
.hero h1 { font-size: clamp(32px, 5.6vw, 72px); line-height: 1.02; max-width: 900px; letter-spacing: -.02em; text-shadow: 0 0 30px rgba(94,242,255,.25); }
.glitch { position: relative; }
.glitch::before, .glitch::after { content: attr(data-text); position: absolute; inset: 0; pointer-events: none; }
.glitch::before { color: var(--pink); transform: translate(2px, 0); clip-path: inset(0 0 60% 0); animation: glitch 4s infinite steps(1); opacity: .7; }
.glitch::after { color: var(--cyan); transform: translate(-2px, 0); clip-path: inset(60% 0 0 0); animation: glitch 3.2s infinite steps(1) reverse; opacity: .7; }
@keyframes glitch { 0%, 92%, 100% { transform: translate(0); opacity: 0; } 93% { transform: translate(3px, -1px); opacity: .8; } 95% { transform: translate(-3px, 1px); opacity: .8; } 97% { transform: translate(1px, 0); opacity: .6; } }
.statement { margin: 30px 0 26px; padding: 18px 22px; border: 1px solid rgba(255,207,90,.25); border-left: 3px solid var(--gold); background: rgba(5,6,10,.6); max-width: 560px; box-shadow: 0 0 40px rgba(255,207,90,.06); }
.statement .rule { font-size: 20px; display: flex; gap: 18px; align-items: baseline; }
.statement .op { color: var(--gold); text-shadow: 0 0 12px rgba(255,207,90,.6); min-width: 160px; }
.statement p { margin: 12px 0 0; color: #a5adbd; }
.hero-counters { display: flex; gap: 36px; flex-wrap: wrap; margin: 6px 0 28px; }
.hero-counters .big { display: block; font-size: 34px; font-weight: 800; color: var(--cyan); text-shadow: 0 0 18px rgba(94,242,255,.6); font-variant-numeric: tabular-nums; }
.hero-counters .k { color: var(--muted); font-size: 11px; text-transform: uppercase; letter-spacing: .12em; }
.cta { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 22px; }
.hero-note { color: var(--muted); font-size: 11px; margin-top: 20px; }

.btn { display: inline-block; padding: 11px 18px; border: 1px solid rgba(94,242,255,.4); color: var(--cyan); background: rgba(94,242,255,.04); font: inherit; font-size: 13px; cursor: pointer; text-transform: uppercase; letter-spacing: .08em; transition: all .15s; }
.btn:hover { background: rgba(94,242,255,.12); box-shadow: 0 0 22px rgba(94,242,255,.35); text-decoration: none; }
.btn.primary { background: var(--cyan); color: #021014; border-color: var(--cyan); font-weight: 700; box-shadow: 0 0 24px rgba(94,242,255,.45); }
.btn.primary:hover { box-shadow: 0 0 40px rgba(94,242,255,.8); background: #8ff7ff; }
button { background: transparent; color: var(--muted); border: 1px solid var(--line); font: inherit; font-size: 11px; padding: 4px 10px; cursor: pointer; text-transform: uppercase; letter-spacing: .06em; }
button:hover { color: var(--text); border-color: var(--muted); }
button.on { color: #021014; background: var(--cyan); border-color: var(--cyan); box-shadow: 0 0 12px rgba(94,242,255,.5); }
.ca { display: inline-flex; align-items: center; gap: 12px; border: 1px solid rgba(255,207,90,.35); padding: 10px 14px; background: rgba(5,6,10,.7); flex-wrap: wrap; }
.ca .label { color: var(--gold); font-size: 11px; letter-spacing: .14em; }
.ca code { word-break: break-all; color: var(--text); }

section { scroll-margin-top: 70px; }
main { max-width: 1320px; margin: 0 auto; padding: 0 24px 24px; display: flex; flex-direction: column; gap: 22px; }
.panel { border: 1px solid var(--line); background: var(--panel); padding: 18px; min-width: 0; position: relative; backdrop-filter: blur(4px); }
.panel::before { content: ""; position: absolute; top: -1px; left: -1px; width: 14px; height: 14px; border-top: 2px solid var(--cyan); border-left: 2px solid var(--cyan); opacity: .7; }
.panel::after { content: ""; position: absolute; bottom: -1px; right: -1px; width: 14px; height: 14px; border-bottom: 2px solid var(--cyan); border-right: 2px solid var(--cyan); opacity: .7; }
.panel-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 14px; margin-bottom: 14px; flex-wrap: wrap; }
.filters { display: flex; gap: 6px; flex-wrap: wrap; }
.legend { color: var(--muted); font-size: 11px; margin: 10px 0 0; }

/* pipeline */
.pipeline { display: flex; align-items: stretch; gap: 0; margin: 10px 0 18px; border: 1px solid var(--line); background: var(--panel); flex-wrap: wrap; }
.stage { flex: 1; min-width: 150px; padding: 14px 16px; display: flex; flex-direction: column; gap: 2px; border-right: 1px solid var(--line); transition: all .3s; position: relative; }
.stage .num { font-size: 10px; color: var(--muted); }
.stage .name { font-size: 18px; font-weight: 800; letter-spacing: .14em; color: #3a4152; transition: all .3s; }
.stage .desc { font-size: 11px; color: var(--muted); }
.stage.active { background: rgba(94,242,255,.07); }
.stage.active .name { color: var(--cyan); text-shadow: 0 0 14px var(--cyan); }
.stage.active::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--cyan); box-shadow: 0 0 12px var(--cyan); animation: sweep 1.2s linear infinite; transform-origin: left; }
.stage.done .name { color: #7d8aa3; }
@keyframes sweep { 0% { transform: scaleX(0); } 100% { transform: scaleX(1); } }
.arrow { display: none; }
.next { padding: 14px 18px; display: flex; flex-direction: column; justify-content: center; font-size: 11px; color: var(--muted); text-transform: uppercase; letter-spacing: .1em; min-width: 150px; }
.next b { font-size: 22px; color: var(--gold); text-shadow: 0 0 12px rgba(255,207,90,.6); letter-spacing: 0; font-variant-numeric: tabular-nums; }

/* lab */
.lab-grid { display: grid; grid-template-columns: 1.55fr 1fr; gap: 22px; }
@media (max-width: 1000px) { .lab-grid, .grid2, .play-grid { grid-template-columns: 1fr !important; } nav { display: none; } }
.theater { width: 100%; height: 440px; display: block; background: #04050a; border: 1px solid #141927; cursor: crosshair; }
.stage-panel h2 { font-size: 20px; letter-spacing: .04em; text-transform: none; }
.hypo { max-width: 46%; font-size: 12px; color: #c9b3ea; border-left: 2px solid var(--ai); padding: 4px 10px; background: rgba(213,156,255,.05); }
.hypo .tag { margin-right: 6px; font-weight: 700; }
.progress { position: relative; height: 22px; margin-top: 10px; background: #0a0d16; border: 1px solid var(--line); overflow: hidden; }
.progress .bar { position: absolute; inset: 0 auto 0 0; width: 0; background: linear-gradient(90deg, rgba(94,242,255,.15), rgba(94,242,255,.5)); box-shadow: 0 0 14px rgba(94,242,255,.6); transition: width .2s; }
.progress span { position: relative; font-size: 11px; padding: 0 10px; line-height: 20px; color: var(--text); }
.result { min-height: 20px; margin: 10px 0 0; color: var(--gold); text-shadow: 0 0 10px rgba(255,207,90,.4); }
#th-status.pass { color: var(--green); } #th-status.fail { color: var(--red); } #th-status.running { color: var(--cyan); animation: pulse 1.2s infinite; }

.term { height: 548px; overflow-y: auto; background: #03040a; border: 1px solid #141927; padding: 12px; font-size: 12px; box-shadow: inset 0 0 40px rgba(94,242,255,.04); }
.term .ln { white-space: pre-wrap; word-break: break-word; padding: 2px 0; animation: appear .4s ease-out; }
@keyframes appear { from { opacity: 0; transform: translateX(-6px); background: rgba(94,242,255,.12); } to { opacity: 1; transform: none; background: transparent; } }
.term .ts { color: #3a4152; margin-right: 8px; }
.term .tag { display: inline-block; width: 58px; font-weight: 700; }
.term .caret::after { content: "▌"; color: var(--cyan); animation: pulse .8s infinite; }
.EXEC { color: var(--exec); } .AI { color: var(--ai); } .VERIFY { color: var(--verify); } .SYS { color: var(--sys); }
.term .fail { color: var(--red); }

.statusbar { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); border: 1px solid var(--line); background: var(--panel); margin-top: 22px; }
.statusbar > div { padding: 12px 14px; border-right: 1px solid var(--line); display: flex; flex-direction: column; gap: 2px; }
.statusbar .k { color: var(--muted); font-size: 10px; text-transform: uppercase; letter-spacing: .12em; }
.statusbar .v { font-size: 16px; font-variant-numeric: tabular-nums; color: var(--text); }

/* playground */
.play-form { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 14px; }
.play-form input { flex: 1; min-width: 240px; background: #03040a; border: 1px solid rgba(94,242,255,.4); color: var(--cyan); font: inherit; font-size: 18px; padding: 10px 14px; outline: none; box-shadow: inset 0 0 20px rgba(94,242,255,.06); }
.play-form input:focus { box-shadow: 0 0 20px rgba(94,242,255,.35), inset 0 0 20px rgba(94,242,255,.1); }
.play-grid { display: grid; grid-template-columns: 1.6fr 1fr; gap: 18px; }
.play-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; align-content: start; }
.play-stats .stat { border: 1px solid var(--line); padding: 12px; background: #070910; }
.play-stats .stat .k { display: block; color: var(--muted); font-size: 10px; text-transform: uppercase; letter-spacing: .12em; }
.play-stats .stat .v { font-size: 20px; color: var(--cyan); text-shadow: 0 0 12px rgba(94,242,255,.5); word-break: break-all; }
.play-stats .stat .v.sm { font-size: 13px; }
.play-stats .verdict { grid-column: 1 / -1; color: var(--green); border-color: rgba(93,255,158,.4); }
.play-stats .share { grid-column: 1 / -1; font-size: 12px; }

/* feed, records, charts */
.feed { list-style: none; margin: 0; padding: 0; max-height: 520px; overflow-y: auto; }
.feed li { padding: 12px 0; border-bottom: 1px solid var(--line); display: grid; grid-template-columns: 130px 1fr; gap: 14px; animation: appear .5s ease-out; }
.feed .cat { font-size: 10px; text-transform: uppercase; letter-spacing: .1em; font-weight: 700; }
.feed .cat.hypothesis, .feed .cat.update { color: var(--ai); } .feed .cat.experiment { color: var(--exec); } .feed .cat.verified { color: var(--verify); }
.feed .cat.failed { color: var(--red); } .feed .cat.milestone { color: var(--gold); }
.feed time { color: var(--muted); font-size: 11px; display: block; }
.grid2 { display: grid; grid-template-columns: 1.2fr 1fr; gap: 22px; }
.records-wrap { max-height: 380px; overflow-y: auto; }
table.records { width: 100%; border-collapse: collapse; font-size: 12.5px; font-variant-numeric: tabular-nums; }
.records th { text-align: left; color: var(--muted); font-weight: 400; border-bottom: 1px solid var(--line); padding: 6px 4px; font-size: 11px; text-transform: uppercase; letter-spacing: .08em; }
.records td { padding: 7px 4px; border-bottom: 1px solid #12151f; }
.records tbody tr { cursor: pointer; transition: background .15s; }
.records tbody tr:hover { background: rgba(94,242,255,.07); }
.records tbody tr:hover td:first-child { color: var(--cyan); text-shadow: 0 0 8px var(--cyan); }
.bars .bar { display: grid; grid-template-columns: 170px 1fr 50px; gap: 8px; align-items: center; margin: 6px 0; font-size: 12px; }
.bars .fill { height: 8px; background: linear-gradient(90deg, var(--cyan), var(--pink)); box-shadow: 0 0 10px rgba(94,242,255,.5); }
.bars .n { text-align: right; color: var(--muted); }
.funding-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; }
.funding-grid div { border: 1px solid var(--line); padding: 12px; }
.funding-grid .k { color: var(--muted); font-size: 11px; text-transform: uppercase; display: block; }
.funding-grid .v { font-size: 22px; color: var(--gold); text-shadow: 0 0 12px rgba(255,207,90,.5); }
.about p, .about li { color: #aeb5c4; max-width: 880px; }
.about ul { padding-left: 18px; }
footer { max-width: 1320px; margin: 0 auto; padding: 24px; border-top: 1px solid var(--line); display: flex; gap: 20px; justify-content: space-between; flex-wrap: wrap; color: var(--muted); font-size: 12px; }
footer code { word-break: break-all; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }

/* compute, tokens & funding */
.cost-lede { max-width: 760px; color: #aeb5c4; font-size: 13px; }
.cost-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
@media (max-width: 1000px) { .cost-grid, .tiers { grid-template-columns: 1fr 1fr !important; } }
.cost-grid .tile { border: 1px solid var(--line); background: #070910; padding: 14px; display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.cost-grid .tile.big { grid-row: span 2; justify-content: center; border-color: rgba(94,242,255,.3); box-shadow: inset 0 0 40px rgba(94,242,255,.05); }
.cost-grid .tile.wide { grid-column: span 2; grid-row: span 2; }
.cost-grid .k { color: var(--muted); font-size: 10px; text-transform: uppercase; letter-spacing: .12em; }
.cost-grid .v { font-size: 22px; color: var(--cyan); text-shadow: 0 0 12px rgba(94,242,255,.45); font-variant-numeric: tabular-nums; }
.cost-grid .tile.big .v { font-size: 44px; font-weight: 800; }
.cost-grid .sub { color: var(--muted); font-size: 11px; }
.spark { width: 100%; height: 70px; display: block; margin-top: 6px; }
.budget { margin-top: 16px; }
.budget-head { display: flex; justify-content: space-between; font-size: 11px; text-transform: uppercase; letter-spacing: .1em; color: var(--muted); margin-bottom: 6px; }
.budget-head span:last-child { color: var(--text); }
.budget-bar { height: 10px; background: #0a0d16; border: 1px solid var(--line); }
.budget-bar div { height: 100%; width: 0; background: linear-gradient(90deg, var(--cyan), var(--pink)); box-shadow: 0 0 12px rgba(94,242,255,.5); transition: width .6s; }
.tiers { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.tier { border: 1px solid var(--line); background: #070910; padding: 14px; position: relative; opacity: .55; }
.tier.active { opacity: 1; border-color: rgba(93,255,158,.5); box-shadow: 0 0 24px rgba(93,255,158,.12); }
.tier.upnext { opacity: 1; border-color: rgba(255,207,90,.55); box-shadow: 0 0 24px rgba(255,207,90,.12); }
.tier .badge { position: absolute; top: 12px; right: 12px; font-size: 10px; letter-spacing: .12em; font-weight: 700; }
.tier.active .badge { color: var(--green); } .tier.upnext .badge { color: var(--gold); } .tier .badge { color: var(--muted); }
.tier .tname { font-size: 16px; font-weight: 800; letter-spacing: .06em; }
.tier .unlock { color: var(--muted); font-size: 11px; margin: 2px 0 10px; }
.tier ul { list-style: none; padding: 0; margin: 0; font-size: 12px; display: grid; gap: 4px; }
.tier li b { color: var(--cyan); font-weight: 600; }
.tier .goal { margin-top: 12px; }
.tier .goal .bar { height: 8px; background: #0a0d16; border: 1px solid var(--line); }
.tier .goal .bar div { height: 100%; background: linear-gradient(90deg, var(--gold), var(--pink)); box-shadow: 0 0 10px rgba(255,207,90,.5); }
.tier .goal p { margin: 6px 0 0; font-size: 12px; color: var(--gold); }
.fees { margin-top: 16px; border: 1px solid rgba(255,207,90,.35); border-left: 3px solid var(--gold); background: rgba(255,207,90,.04); padding: 12px 16px; }
.fees .tag { color: var(--gold); font-size: 10px; text-transform: uppercase; letter-spacing: .14em; font-weight: 700; }
.fees p { margin: 6px 0 0; color: #cfd5e1; max-width: 980px; }

/* X */
.x-btn { display: inline-flex; align-items: center; gap: 8px; }
.nav-x { display: inline-flex; align-items: center; color: var(--text) !important; }
.nav-x:hover { color: var(--cyan) !important; }
footer a { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); }
footer a:hover { color: var(--cyan); text-decoration: none; }