*, *::before, *::after { box-sizing: border-box; }
:root {
  --accent: #4F46E5; --accent-soft: #EEEDFF; --mint: #147A63; --mint-soft: #E8F6F1;
  --surface: #FFFFFF; --surface-2: #F6F6FA; --surface-3: #ECECF3; --border: #D8D8E3;
  --text: #171724; --body: #424255; --muted: #6C6C80; --navy: #151528;
  --sans: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --mono: 'JetBrains Mono', ui-monospace, monospace;
}
html[data-theme="night"] { --accent:#AAA2FF; --accent-soft:#2B2850; --mint:#63DDB8; --mint-soft:#12352B; --surface:#161620; --surface-2:#0D0D14; --surface-3:#222230; --border:#39394A; --text:#F3F3F8; --body:#C9C9D7; --muted:#9898AA; }
html[data-theme="hc"] { --accent:#28148A; --accent-soft:#ECE9FF; --mint:#00513B; --mint-soft:#E5F7F0; --surface:#FFFFFF; --surface-2:#FFFFFF; --surface-3:#F0F0F0; --border:#000000; --text:#000000; --body:#111111; --muted:#292929; }
html { scroll-behavior: smooth; color-scheme: light; }
html[data-theme="night"] { color-scheme: dark; }
body { margin: 0; color: var(--text); background: var(--surface-2); font-family: var(--sans); line-height: 1.6; -webkit-font-smoothing: antialiased; }
a { color: var(--accent); }
a:focus-visible, button:focus-visible, [tabindex="0"]:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
.skip-link { position: fixed; z-index: 1000; top: 8px; left: 8px; padding: 8px 12px; color: #fff; background: #000; transform: translateY(-160%); }
.skip-link:focus { transform: none; }
.topbar { position: sticky; z-index: 50; top: 0; min-height: 66px; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 10px clamp(20px,5vw,72px); color: #fff; background: rgba(21,21,40,.97); border-bottom: 1px solid rgba(255,255,255,.15); backdrop-filter: blur(14px); }
.brand { display: inline-flex; align-items: center; gap: 11px; color: inherit; text-decoration: none; }
.brand-flask { display: grid; place-items: center; width: 36px; height: 36px; }
.brand-flask img { width: 30px; height: 36px; }
.brand-wordmark { display: grid; line-height: 1.15; }
.brand-name { font-size: 16px; font-weight: 700; }
.brand-sub { margin-top: 3px; color: rgba(255,255,255,.58); font-size: 11px; }
.topbar-right { display: flex; align-items: center; gap: 18px; }
.topbar-link { color: rgba(255,255,255,.78); font-size: 13px; text-decoration: none; }
.topbar-link:hover { color: #fff; }
main { overflow: clip; }
.hero { min-height: 670px; display: grid; grid-template-columns: minmax(0,1.15fr) minmax(320px,.85fr); align-items: center; gap: clamp(44px,7vw,110px); padding: clamp(80px,10vw,148px) max(6vw,calc((100vw - 1240px)/2)); color: #F5F5FA; background: #0B1220; }
.eyebrow, .section-kicker, .instrument-label { margin: 0 0 18px; color: #71E0C0; font-family: var(--mono); font-size: 12px; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; }
.hero h1 { margin: 0; font-size: clamp(62px,9vw,132px); line-height: .9; letter-spacing: -.07em; }
.hero-lead { margin: 28px 0 0; font-size: clamp(23px,3vw,38px); font-weight: 500; line-height: 1.15; letter-spacing: -.035em; }
.hero-body { max-width: 64ch; margin: 25px 0 0; color: rgba(255,255,255,.68); font-size: 17px; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 34px; }
.button { display: inline-flex; min-height: 46px; align-items: center; padding: 0 17px; border: 1px solid rgba(255,255,255,.28); color: #fff; font-size: 14px; font-weight: 700; text-decoration: none; }
.button-primary { color: #0B1220; background: #71E0C0; border-color: #71E0C0; }
.hero-instrument { padding: 28px; border: 1px solid rgba(255,255,255,.18); background: rgba(255,255,255,.035); }
.instrument-label { margin-bottom: 22px; }
.instrument-row { display: grid; grid-template-columns: 90px 1fr; gap: 18px; padding: 13px 0; border-block: 1px solid rgba(255,255,255,.1); }
.instrument-row span { color: rgba(255,255,255,.48); font-family: var(--mono); font-size: 11px; text-transform: uppercase; }
.instrument-row strong { font-size: 14px; }
.instrument-path { width: 1px; height: 22px; margin-left: 20px; background: #71E0C0; }
.instrument-status { display: flex; align-items: center; gap: 9px; margin-top: 24px; color: rgba(255,255,255,.68); font-family: var(--mono); font-size: 11px; }
.instrument-status span { width: 8px; height: 8px; border-radius: 50%; background: #71E0C0; box-shadow: 0 0 0 5px rgba(113,224,192,.1); }
.section { max-width: 1240px; margin: 0 auto; padding: clamp(72px,9vw,128px) clamp(20px,5vw,60px); }
.section + .section { border-top: 1px solid var(--border); }
.section-heading { max-width: 760px; margin-bottom: 42px; }
.section-heading-wide { max-width: none; display: grid; grid-template-columns: 1fr minmax(280px,450px); align-items: end; gap: 40px; }
.section-kicker { margin-bottom: 12px; color: var(--mint); }
.section h2 { margin: 0; font-size: clamp(38px,5vw,68px); line-height: 1; letter-spacing: -.055em; }
.section-heading > p:last-child, .comparison-note { color: var(--body); font-size: 17px; }
.principle-grid, .project-grid, .next-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; }
.principle, .project-card, .next-grid article { padding: 28px; border: 1px solid var(--border); background: var(--surface); }
.principle > span { color: var(--mint); font-family: var(--mono); font-size: 12px; }
.principle h3, .next-grid h3 { margin: 32px 0 8px; font-size: 20px; }
.principle p, .next-grid p { margin: 0; color: var(--body); }
.project-grid { grid-template-columns: repeat(2,1fr); }
.project-card { min-width:0; padding: 32px; }
.project-top { display: flex; flex-wrap:wrap; justify-content: space-between; align-items: start; gap: 12px 20px; }
.project-name { min-width:0; margin: 0; font-size: clamp(28px,3vw,42px); letter-spacing: -.045em; }
.status { flex: none; padding: 5px 8px; border: 1px solid var(--border); color: var(--body); font-family: var(--mono); font-size: 10px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.status-stable { color: var(--mint); background: var(--mint-soft); border-color: color-mix(in srgb,var(--mint) 34%,transparent); }
.project-purpose { min-height: 78px; color: var(--body); }
.model-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; margin: 26px 0; background: var(--border); border: 1px solid var(--border); }
.model-pair > div { padding: 16px; background: var(--surface-2); }
.model-pair span { display: block; margin-bottom: 7px; color: var(--muted); font-family: var(--mono); font-size: 9px; letter-spacing: .08em; text-transform: uppercase; }
.model-pair code { overflow-wrap: anywhere; font-family: var(--mono); font-size: 12px; color: var(--text); }
.evidence-list { display: grid; gap: 0; margin: 0; }
.evidence-list div { display: grid; grid-template-columns: 1fr auto; gap: 16px; padding: 11px 0; border-top: 1px solid var(--border); }
.evidence-list dt { color: var(--body); }
.evidence-list dd { min-width:0; margin: 0; overflow-wrap:anywhere; font-family: var(--mono); font-size: 11px; text-align: right; }
.authority-note { margin: 24px 0 0; padding: 16px; color: var(--body); background: var(--surface-2); border-left: 3px solid var(--mint); }
.table-wrap { overflow-x: auto; border: 1px solid var(--border); background: var(--surface); }
table { width: 100%; min-width: 1080px; border-collapse: collapse; text-align: left; }
th { color: var(--muted); background: var(--surface-2); font-family: var(--mono); font-size: 10px; letter-spacing: .07em; text-transform: uppercase; }
th, td { padding: 16px; border-bottom: 1px solid var(--border); vertical-align: top; }
tbody tr:last-child td { border-bottom: 0; }
td { color: var(--body); font-size: 13px; }
td code { color: var(--text); font-family: var(--mono); font-size: 11px; }
.decision { display: inline-flex; padding: 4px 7px; font-family: var(--mono); font-size: 9px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; white-space: nowrap; }
.decision-current { color: var(--mint); background: var(--mint-soft); }
.decision-blocked { color: #98510A; background: #FFF2DF; }
.decision-testing { color: var(--accent); background: var(--accent-soft); }
html[data-theme="night"] .decision-blocked { color:#FFC17C; background:#3A2918; }
.benchmark-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }
.benchmark-card { padding:28px; border:1px solid var(--border); background:var(--surface); }
.benchmark-head { display:flex; justify-content:space-between; align-items:start; gap:18px; margin-bottom:28px; }
.benchmark-head span, .promotion-project { color:var(--muted); font-family:var(--mono); font-size:10px; letter-spacing:.08em; text-transform:uppercase; }
.benchmark-head h3 { margin:5px 0 0; font-size:17px; }
.benchmark-head code, .promotion-entry code { color:var(--text); font-family:var(--mono); overflow-wrap:anywhere; }
.evidence-class { display:inline-flex; padding:4px 7px; border:1px solid var(--border); font-family:var(--mono); font-size:9px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; }
.evidence-production { color:var(--mint); background:var(--mint-soft); }
.evidence-diagnostic { color:var(--accent); background:var(--accent-soft); }
.evidence-development { color:var(--body); background:var(--surface-3); }
.score-row { display:flex; justify-content:space-between; gap:16px; margin-top:16px; color:var(--body); font-size:13px; }
.score-row strong { color:var(--text); font-family:var(--mono); font-size:12px; }
.score-track { height:8px; margin-top:7px; background:var(--surface-3); overflow:hidden; }
.score-track span { display:block; height:100%; background:var(--mint); }
.score-track-gates span { background:var(--accent); }
.benchmark-meta { display:grid; grid-template-columns:1fr 1fr; margin:25px 0 18px; border-top:1px solid var(--border); }
.benchmark-meta div { padding:12px 0; border-bottom:1px solid var(--border); }
.benchmark-meta div:nth-child(even) { padding-left:16px; border-left:1px solid var(--border); }
.benchmark-meta dt { color:var(--muted); font-size:10px; text-transform:uppercase; }
.benchmark-meta dd { margin:3px 0 0; color:var(--text); font-family:var(--mono); font-size:10px; }
.benchmark-card > time { color:var(--muted); font-family:var(--mono); font-size:10px; }
.promotion-list { border:1px solid var(--border); background:var(--surface); }
.code-lab-shell { border:1px solid var(--border); background:#0B1220; color:#F5F5FA; }
.code-lab-tabs { display:flex; gap:0; overflow-x:auto; border-bottom:1px solid rgba(255,255,255,.16); }
.code-lab-tab { min-height:52px; flex:1 0 auto; padding:0 20px; color:rgba(255,255,255,.62); background:transparent; border:0; border-right:1px solid rgba(255,255,255,.12); font:600 11px/1 var(--mono); letter-spacing:.05em; text-transform:uppercase; cursor:pointer; }
.code-lab-tab[aria-selected="true"] { color:#0B1220; background:#71E0C0; }
.code-lab-stage { display:grid; grid-template-columns:minmax(220px,.34fr) minmax(0,.66fr); min-height:420px; }
.code-lab-notes { padding:30px; border-right:1px solid rgba(255,255,255,.16); }
.code-lab-version { margin:0 0 18px; color:#71E0C0; font:700 11px/1 var(--mono); letter-spacing:.1em; text-transform:uppercase; }
.code-lab-notes h3 { margin:0; font-size:clamp(25px,3vw,38px); line-height:1.05; letter-spacing:-.04em; }
.code-lab-notes p { color:rgba(255,255,255,.66); }
.code-lab-result { display:inline-flex; margin-top:18px; padding:6px 9px; color:#71E0C0; border:1px solid rgba(113,224,192,.42); font:700 10px/1 var(--mono); text-transform:uppercase; }
.code-window { min-width:0; }
.code-window-bar { display:flex; align-items:center; justify-content:space-between; gap:18px; min-height:48px; padding:0 20px; color:rgba(255,255,255,.5); border-bottom:1px solid rgba(255,255,255,.1); font:500 10px/1 var(--mono); }
.code-window-dots { display:flex; gap:6px; }
.code-window-dots i { width:7px; height:7px; border-radius:50%; background:rgba(255,255,255,.24); }
.code-window pre { min-height:370px; max-height:520px; margin:0; padding:24px; overflow:auto; font:13px/1.7 var(--mono); tab-size:2; }
.code-window code { color:#DDE8FF; white-space:pre; }
.lab-boundary { margin:18px 0 0; color:var(--body); font-size:13px; }
.visual-lab-tabs { display:flex; gap:8px; overflow-x:auto; padding-bottom:12px; }
.visual-lab-tab { min-height:42px; flex:0 0 auto; padding:0 15px; color:var(--body); background:var(--surface); border:1px solid var(--border); font:600 10px/1 var(--mono); letter-spacing:.05em; text-transform:uppercase; cursor:pointer; }
.visual-lab-tab[aria-selected="true"] { color:#0B1220; background:#71E0C0; border-color:#71E0C0; }
.visual-lab-stage { display:grid; grid-template-columns:minmax(240px,.34fr) minmax(0,.66fr); min-height:560px; border:1px solid var(--border); background:var(--surface); }
.visual-lab-copy { padding:32px; border-right:1px solid var(--border); }
.visual-lab-copy h3 { margin:0; font-size:clamp(28px,3vw,44px); line-height:1.02; letter-spacing:-.045em; }
.visual-lab-copy > p:not(.code-lab-version) { color:var(--body); }
.visual-lab-copy dl { margin:30px 0 0; }
.visual-lab-copy dl div { padding:12px 0; border-top:1px solid var(--border); }
.visual-lab-copy dt { color:var(--muted); font:600 9px/1.4 var(--mono); letter-spacing:.08em; text-transform:uppercase; }
.visual-lab-copy dd { margin:5px 0 0; color:var(--text); font-size:12px; }
.visual-frame { min-width:0; margin:0; display:grid; place-items:center; padding:24px; background:#0B1220; }
.visual-frame img { display:block; width:100%; height:100%; max-height:620px; object-fit:contain; }
.visual-frame-empty { background-color:#0B1220; background-image:linear-gradient(rgba(113,224,192,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(113,224,192,.08) 1px,transparent 1px); background-size:28px 28px; }
.visual-frame-empty > div { display:grid; gap:8px; padding:24px; text-align:center; background:#0B1220; border:1px solid rgba(113,224,192,.35); }
.visual-frame-empty span { color:#71E0C0; font:700 10px/1 var(--mono); letter-spacing:.08em; text-transform:uppercase; }
.visual-frame-empty strong { color:#F5F5FA; font-size:18px; }
.mesh-lab-grid { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr); gap:16px; }
.mesh-stage { min-width:0; border:1px solid var(--border); background:var(--surface); }
.mesh-viewport { padding:20px; color:#71E0C0; background:#0B1220; }
.mesh-viewport svg { display:block; width:100%; height:auto; max-height:520px; }
.mesh-grid path { fill:none; stroke:rgba(113,224,192,.12); stroke-width:1; }
.mesh-object { fill:rgba(113,224,192,.08); stroke:#71E0C0; stroke-width:2; }
.mesh-object circle { fill:#FFB000; stroke:#0B1220; stroke-width:2; }
.mesh-viewport text { fill:rgba(255,255,255,.5); font:10px var(--mono); letter-spacing:.08em; }
.mesh-stage-copy { padding:28px; }
.mesh-stage-copy h3 { margin:0; font-size:clamp(28px,3vw,42px); line-height:1.04; letter-spacing:-.04em; }
.mesh-stage-copy > p:last-child { color:var(--body); }
.mesh-gates { display:grid; gap:1px; border:1px solid var(--border); background:var(--border); }
.mesh-gates article { padding:20px; background:var(--surface); }
.mesh-gates span { color:var(--mint); font:600 10px/1 var(--mono); }
.mesh-gates strong { display:block; margin-top:12px; font-size:17px; }
.mesh-gates p { margin:6px 0 0; color:var(--body); font-size:13px; }
.promotion-entry { display:grid; grid-template-columns:140px 1fr auto; gap:28px; align-items:start; padding:24px; border-bottom:1px solid var(--border); }
.promotion-entry:last-child { border-bottom:0; }
.promotion-entry > time { color:var(--muted); font-family:var(--mono); font-size:10px; }
.promotion-entry h3 { margin:5px 0; font-size:16px; }
.promotion-entry p { margin:0; color:var(--body); font-size:14px; }
.promotion-tags { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:6px; }
.ladder { display: grid; gap: 0; padding: 0; list-style: none; border: 1px solid var(--border); background: var(--surface); counter-reset: gate; }
.ladder li { display: grid; grid-template-columns: 84px 1fr; gap: 24px; padding: 24px; border-bottom: 1px solid var(--border); }
.ladder li:last-child { border-bottom: 0; }
.ladder li > span { color: var(--mint); font-family: var(--mono); font-size: 12px; }
.ladder strong { font-size: 18px; }
.ladder p { margin: 4px 0 0; color: var(--body); }
.boundary-section { max-width: none; padding-inline: max(6vw,calc((100vw - 1120px)/2)); color: #F5F5FA; background: #0B1220; border: 0 !important; }
.boundary-copy { max-width: 800px; }
.boundary-copy h2 { font-size: clamp(44px,7vw,92px); }
.boundary-copy > p:last-child { max-width: 63ch; color: rgba(255,255,255,.64); font-size: 18px; }
.boundary-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 16px; margin-top: 50px; }
.boundary-grid article { padding: 30px; border: 1px solid rgba(255,255,255,.16); }
.boundary-name { display: block; margin-bottom: 24px; color: #71E0C0; font-family: var(--mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; }
.boundary-grid strong { display: block; font-size: 32px; }
.boundary-grid p { color: rgba(255,255,255,.62); }
.boundary-stop { display: inline-flex; margin-top: 20px; padding: 5px 8px; color: #FFC17C; background: rgba(255,193,124,.1); font-family: var(--mono); font-size: 10px; text-transform: uppercase; }
.timeline { position: relative; display: grid; gap: 0; padding-left: 30px; }
.timeline::before { content:""; position:absolute; top:8px; bottom:8px; left:7px; width:1px; background:var(--border); }
.timeline-entry { position: relative; display: grid; grid-template-columns: 140px 1fr; gap: 32px; padding: 0 0 36px; }
.timeline-entry::before { content:""; position:absolute; top:7px; left:-27px; width:9px; height:9px; background:var(--mint); border:4px solid var(--surface-2); box-sizing:content-box; }
.timeline-entry time { color: var(--muted); font-family: var(--mono); font-size: 11px; }
.timeline-entry h3 { margin: 0 0 6px; font-size: 18px; }
.timeline-entry p { margin: 0; color: var(--body); }
.next-section { border-top: 1px solid var(--border); }
.next-grid { grid-template-columns: repeat(2,1fr); margin-top: 38px; }
.next-grid h3 { margin-top: 0; }
.next-grid a { display: inline-flex; margin-top: 18px; font-weight: 700; }
footer { display: flex; justify-content: space-between; gap: 30px; padding: 42px max(6vw,calc((100vw - 1120px)/2)); color: rgba(255,255,255,.75); background: var(--navy); }
footer strong { color:#fff; }
footer p { margin:5px 0 0; }
.footer-meta { display:flex; gap:28px; font-family:var(--mono); font-size:11px; }
.footer-meta span { display:grid; gap:4px; }
.footer-meta b, .footer-meta time { color:#fff; font-weight:500; }
.loading-note { color: var(--muted); }
@media (max-width: 860px) {
  .hero { min-height: auto; grid-template-columns: 1fr; }
  .hero-instrument { max-width: 560px; }
  .principle-grid { grid-template-columns: 1fr; }
  .project-grid, .boundary-grid { grid-template-columns: 1fr; }
  .benchmark-grid { grid-template-columns:1fr; }
  .code-lab-stage, .visual-lab-stage { grid-template-columns:1fr; }
  .mesh-lab-grid { grid-template-columns:1fr; }
  .code-lab-notes { border-right:0; border-bottom:1px solid rgba(255,255,255,.16); }
  .visual-lab-copy { border-right:0; border-bottom:1px solid var(--border); }
  .section-heading-wide { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
  .topbar { padding-inline: 14px; }
  .brand-sub, .topbar-link { display: none; }
  .hero { padding: 70px 20px; }
  .hero h1 { font-size: clamp(56px,18vw,84px); }
  .section { padding-inline: 20px; }
  .model-pair { grid-template-columns: 1fr; }
  .evidence-list div { grid-template-columns: 1fr; gap: 3px; }
  .evidence-list dd { text-align:left; }
  .ladder li { grid-template-columns: 44px 1fr; gap: 12px; }
  .timeline-entry { grid-template-columns: 1fr; gap: 7px; }
  .promotion-entry { grid-template-columns:1fr; gap:10px; }
  .promotion-tags { justify-content:flex-start; }
  .benchmark-head h3 { font-size:14px; }
  .benchmark-meta { grid-template-columns:1fr; }
  .benchmark-meta div:nth-child(even) { padding-left:0; border-left:0; }
  .next-grid { grid-template-columns: 1fr; }
  footer { flex-direction:column; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto; } }