/* =========================================================================
   Sunspot — shared design system
   Light · schematic · "solar-observatory": deep umbra + sun-gold signal + a
   warm ember accent, chunky display type, blueprint grid, hairline structure.
   A sibling skin of Kinetics: same class names and CSS-variable contract so the
   analyzer render layer restyles cleanly. Finding semantics keep green = clean.
   ========================================================================= */

:root{
  --paper:#fbfbf8; --paper-2:#f4f4ef;
  --ink:#0d0d0c; --ink2:#45453f; --ink3:#84847c; --ink4:#b4b4aa;
  --line:#0d0d0c; --line2:#e2e2dc; --line3:#efefea; --line-soft:#bcbcb4;

  --grn:#679e7b; --grn-l:rgba(21,128,61,.07); --grn-b:#8fd7a8;
  --green-deep:#293a33; --green-deep-2:#0e3223;
  --yellow:#f4b400; --yellow-2:#c98f00; --yellow-l:#fdf3d1; --yellow-b:#f0cf72;
  --red:#b91c1c; --red-l:#fdf3f3; --red-b:#f0b3b3;
  --amber:#b45309; --amber-l:rgba(180,83,9,.06); --amber-b:#fcd34d;
  --blue:#1d4ed8; --blue-l:rgba(29,78,216,.06);

  --grid:rgba(18,63,43,.05);

  --disp:'Space Grotesk','Inter',system-ui,sans-serif;
  --sans:'Inter',-apple-system,system-ui,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,monospace;
  --label:'Space Grotesk','Inter',system-ui,sans-serif;
}

*{box-sizing:border-box; margin:0; padding:0; border-radius:0;}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth;}
body{
  font-family:var(--sans);
  background-color:var(--paper);
  background-image:
    repeating-linear-gradient(0deg,transparent,transparent 31px,var(--grid) 31px,var(--grid) 32px),
    repeating-linear-gradient(90deg,transparent,transparent 31px,var(--grid) 31px,var(--grid) 32px);
  color:var(--ink); line-height:1.6; -webkit-font-smoothing:antialiased;
}
.mono{font-family:var(--mono);}
.wrap{max-width:1060px; margin:0 auto; padding:0 22px;}
a{color:var(--ink); text-decoration:none;}
button,input,textarea,select{font-family:inherit; border-radius:0;}
h1,h2,h3{font-family:var(--disp); font-weight:600; letter-spacing:-.03em; line-height:1.04;}

.noselect{-webkit-touch-callout:none; -webkit-user-select:none; user-select:none;}

/* ---- eyebrow + section headers ---- */
.eyebrow{font-family:var(--mono); font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--ink3); font-weight:500; display:inline-flex; align-items:center; gap:9px;}
.eyebrow::before{content:""; width:7px; height:7px; background:var(--yellow); display:inline-block;}
.sec-h{font-family:var(--mono); font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--ink2); font-weight:bold; margin-bottom:1.4rem; display:flex; align-items:center; gap:11px;}
.sec-h::before{content:""; width:8px; height:8px; background:var(--yellow); flex:0 0 auto;}
.sec-h::after{content:""; flex:1; height:1px; background:var(--line2);}

.rule-dashed{height:1px; background-image:linear-gradient(to right, var(--ink3) 0 6px, transparent 6px 12px); background-size:12px 1px; opacity:.5; margin:0;}

/* =====================  NAV  ===================== */
.nav{position:sticky; top:0; z-index:30; background:rgba(244,244,240,.9); backdrop-filter:blur(9px); border-bottom:1px solid var(--line-soft);}
.nav-in{max-width:1060px; margin:0 auto; padding:0 22px; height:60px; display:flex; align-items:center; gap:16px;}
.brand{display:flex; align-items:center; gap:10px;}
.brand .mark{width:32px; height:32px; flex:0 0 auto; color:var(--green-deep); margin-right:-2px; margin-top:1px;}
.brand .wm{font-family:var(--disp); font-weight:700; font-size:19px; letter-spacing:-.02em; color:var(--ink);}
.brand .tl{font-family:var(--mono); font-size:11.5px; color:var(--ink3); letter-spacing:.02em; padding-left:12px; padding-top:2px; margin-left:2px; border-left:1px solid var(--line2);}
.nav-links{margin-left:auto; display:flex; align-items:center; gap:22px;}
.nav-links a{font-family:var(--mono); font-size:12px; color:var(--ink2); letter-spacing:.05em; text-transform:uppercase; font-weight:500; padding:4px 0; border-bottom:2px solid transparent;}
.nav-links a:hover{color:var(--ink);}
.nav-links a.active{color:var(--ink); border-bottom-color:var(--yellow);}
.beta{font-family:var(--mono); font-size:10px; font-weight:600; padding:3px 8px; background:var(--green-deep); color:var(--paper); letter-spacing:.1em;}

/* =====================  HERO  ===================== */
.hero{padding:104px 0 40px;}
.hero .eyebrow{margin-bottom:20px;}
.hero h1{font-size:clamp(38px,5.4vw,62px); font-weight:700;}
.hero h1 .hl{color:var(--grn);}
.hero .lede{font-size:clamp(15.5px,1.6vw,18px); color:var(--ink2); margin-top:20px; line-height:1.6;}
.hero .lede.narrow-none{max-width:none;}
.hero .lede a{text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:1px;}
.hero .lede a:hover{color:var(--grn);}
.hero .note{font-family:var(--mono); font-size:12.5px; color:var(--ink3); margin-top:16px; padding-left:14px; border-left:2px solid var(--grn-b); line-height:1.6;}

/* full-width body paragraphs */
.prose{font-size:15px; color:var(--ink2); line-height:1.7;}
.prose b{color:var(--ink); font-weight:600;}
section{padding:44px 0;}
.sec-head{margin-bottom:26px;}
.sec-head h2{font-size:clamp(24px,3.1vw,33px); font-weight:600; margin:12px 0 12px;}
.sec-head p{color:var(--ink2); font-size:15.5px; line-height:1.7;}

/* =====================  BUTTONS  ===================== */
.btn{display:inline-flex; align-items:center; gap:8px; font-family:var(--label); font-size:12.5px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; padding:11px 18px; border:1px solid var(--line); background:var(--paper); color:var(--ink); cursor:pointer; transition:transform .15s, background .15s;}
.btn:hover{transform:translateY(-1px);}
.btn.ink{background:var(--ink); color:var(--paper);}
.btn.ink:hover{background:#242420;}
.btn.green{background:var(--green-deep); color:var(--paper); border-color:var(--green-deep);}
.btn.green:hover{background:var(--green-deep-2);}
.btn.yellow{background:var(--yellow); color:#1c1600; border-color:var(--yellow);}
.btn.yellow:hover{filter:brightness(1.04);}

/* =====================  ANALYZER  ===================== */
.analyzer{border:1px solid var(--line); background:var(--paper); margin-bottom:1rem;}
.an-head{display:flex; align-items:center; justify-content:space-between; padding:10px 14px; border-bottom:1px solid var(--line); background:var(--green-deep);}
.an-title{font-family:var(--mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--paper); font-weight:600;}
.an-net{font-family:var(--mono); font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,.72); font-weight:500; display:flex; align-items:center; gap:6px;}
.an-net .live-dot{width:6px; height:6px; background:var(--yellow); display:inline-block;}
.an-body{padding:15px;}
.mode-row{display:flex; gap:0; margin-bottom:12px; border:1px solid var(--line);}
.mode-btn{flex:1; font-family:var(--mono); font-size:13.5px; padding:12px 10px; background:var(--paper); border:none; cursor:pointer; color:var(--ink3); letter-spacing:.04em; font-weight:500; border-right:1px solid var(--line2);}
.mode-btn:last-child{border-right:none;}
.mode-btn.active{background:var(--ink); color:var(--paper);}

/* scenario chips */
.scen{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:14px;}
.chip{font-family:var(--mono); font-size:11.5px; letter-spacing:.02em; padding:8px 11px; background:var(--paper); border:1px solid var(--line2); color:var(--ink2); cursor:pointer; display:inline-flex; align-items:center; gap:8px; transition:background .12s, border-color .12s;}
.chip:hover{background:var(--paper-2); color:var(--ink);}
.chip.active{border-color:var(--ink); background:var(--ink); color:var(--paper);}
.chip .rid{font-size:9.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--grn);}
.chip.active .rid{color:var(--grn-b);}

.input-row{display:flex; margin-bottom:9px;}
.input-row input{flex:1; font-size:12.5px; font-family:var(--mono); border:1px solid var(--line); border-right:none; padding:10px 12px; background:var(--paper); color:var(--ink); outline:none;}
.input-row input:focus{outline:2px solid var(--grn); outline-offset:-1px;}
#analyze-btn{font-family:var(--label); font-size:11.5px; font-weight:600; padding:10px 22px; background:var(--ink); color:var(--paper); border:1px solid var(--line); cursor:pointer; letter-spacing:.06em; text-transform:uppercase; white-space:nowrap;}
#analyze-btn:hover{background:#242420;}
#analyze-btn:disabled{opacity:.4; cursor:not-allowed;}
.sub-row{display:flex; justify-content:space-between; align-items:center; gap:10px;}
.demo-link{font-family:var(--mono); font-size:11px; background:none; border:none; color:var(--ink3); cursor:pointer; padding:0; letter-spacing:.03em; text-decoration:underline; text-underline-offset:3px;}
.demo-link:hover{color:var(--grn);}
.src-toggle{font-size:10.5px; color:var(--ink4); letter-spacing:.04em;}
#paste-area{display:none; margin-bottom:9px;}
#paste-area textarea{width:100%; min-height:150px; font-size:11.5px; font-family:var(--mono); border:1px solid var(--line); padding:11px; background:var(--paper); color:var(--ink); outline:none; resize:vertical; line-height:1.55;}
#paste-area textarea:focus{outline:2px solid var(--grn); outline-offset:-1px;}
#error-msg{display:none; font-size:12px; margin-top:10px; padding:10px 12px; border:1px solid var(--red-b); background:var(--red-l); color:var(--red); line-height:1.5;}
#scenario-note{font-family:var(--mono); font-size:11.5px; color:var(--ink3); line-height:1.55; margin-bottom:12px; padding:10px 12px; background:var(--paper-2); border:1px solid var(--line2);}

/* ---- Results ---- */
#result{display:none; margin-top:1rem;}
.rgrid{display:grid; grid-template-columns:repeat(4,1fr); border:1px solid var(--line); border-bottom:none;}
.stat{padding:12px 14px; border-right:1px solid var(--line2); border-bottom:1px solid var(--line2);}
.stat:nth-child(4n){border-right:none;}
.stat-k{font-family:var(--mono); font-size:9px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink3); font-weight:600; margin-bottom:6px;}
.stat-v{font-size:20px; font-weight:600; letter-spacing:-.02em; font-family:var(--mono);}
.stat-v.green{color:var(--grn);} .stat-v.red{color:var(--red);} .stat-v.sun{color:var(--grn);}
.stat-sub{font-size:9.5px; color:var(--ink3); margin-top:2px;}
.panel{border:1px solid var(--line); border-top:none;}
.panel-h{font-family:var(--mono); font-size:9.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink2); font-weight:600; padding:9px 14px; background:var(--paper-2); border-bottom:1px solid var(--line2); display:flex; justify-content:space-between; align-items:center;}
.panel-h .meta{color:var(--ink3); font-weight:500; letter-spacing:.05em;}
.panel-b{padding:14px;}
#graph-panel svg{display:block; width:100%; height:auto; background:
  repeating-linear-gradient(0deg,transparent,transparent 15px,rgba(0,0,0,.02) 15px,rgba(0,0,0,.02) 16px),
  repeating-linear-gradient(90deg,transparent,transparent 15px,rgba(0,0,0,.02) 15px,rgba(0,0,0,.02) 16px);
  border:1px solid var(--line2);}
.gnode-box{fill:var(--paper); stroke:var(--ink); stroke-width:1;}
.gnode-box.prog{fill:var(--grn-l); stroke:var(--grn);}
.gnode-box.zk{fill:var(--yellow-l); stroke:var(--yellow-2);}
.gnode-box.leak{fill:var(--red-l); stroke:var(--red);}
.gnode-t{font-family:var(--mono); font-size:10px; fill:var(--ink);}
.gnode-sub{font-family:var(--mono); font-size:8px; fill:var(--ink3);}
.gedge{stroke:var(--ink3); stroke-width:1; fill:none;}
.gedge.zk{stroke:var(--yellow-2); stroke-width:1.5;}
.gedge.leak{stroke:var(--red); stroke-width:1.7; stroke-dasharray:4 3;}
.gedge-lbl{font-family:var(--mono); font-size:7.5px; fill:var(--ink4);}

/* instruction rows */
.cmd-item{display:flex; gap:10px; padding:8px 0; border-bottom:1px solid var(--line3); align-items:flex-start;}
.cmd-item:last-child{border-bottom:none;}
.cmd-idx{min-width:22px; height:22px; border:1px solid var(--line); font-size:10px; font-weight:600; display:flex; align-items:center; justify-content:center; font-family:var(--mono);}
.cmd-idx.conf{border-color:var(--grn); background:var(--grn-l); color:var(--grn);}
.cmd-main{flex:1; min-width:0;}
.cmd-name{font-size:12.5px; font-weight:500; font-family:var(--mono);}
.cmd-args{font-size:9.5px; color:var(--ink3); font-family:var(--mono); margin-top:2px; word-break:break-word;}
.cmd-badges{display:flex; flex-wrap:wrap; gap:4px; margin-top:5px;}
.badge{font-size:8.5px; letter-spacing:.05em; text-transform:uppercase; padding:1px 6px; border:1px solid var(--line2); color:var(--ink3); white-space:nowrap; font-family:var(--mono);}
.badge.conf{border-color:var(--grn-b); color:var(--grn); background:var(--grn-l);}
.badge.proof{border-color:var(--yellow-b); color:var(--yellow-2); background:var(--yellow-l);}

/* proofs + contexts */
.proof-row{display:grid; grid-template-columns:120px 1fr auto; gap:10px; padding:7px 0; border-bottom:1px solid var(--line3); align-items:center; font-size:11.5px;}
.proof-row:last-child{border-bottom:none;}
.proof-kind{font-family:var(--mono); font-weight:600;}
.proof-cert{font-size:10.5px; color:var(--ink3);}
.pill{font-family:var(--mono); font-size:9px; letter-spacing:.05em; text-transform:uppercase; padding:2px 7px; border:1px solid var(--line2); justify-self:end; white-space:nowrap;}
.pill.ok{border-color:var(--grn-b); color:var(--grn); background:var(--grn-l);}
.pill.bad{border-color:var(--red-b); color:var(--red); background:var(--red-l);}
.pill.warn{border-color:var(--amber-b); color:var(--amber); background:var(--amber-l);}
.ctx-row{display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin-top:4px;}
.ctx-tag{font-family:var(--mono); font-size:10px; padding:3px 8px; border:1px solid var(--line2); background:var(--paper-2); color:var(--ink2); display:inline-flex; gap:7px; align-items:center;}
.ctx-tag .s{font-size:8.5px; letter-spacing:.05em; text-transform:uppercase; color:var(--ink3);}

/* taint / flow */
.taint-row{display:grid; grid-template-columns:150px 1fr auto; gap:8px; padding:7px 0; border-bottom:1px solid var(--line3); align-items:center;}
.taint-row:last-child{border-bottom:none;}
.taint-sink{font-size:11px; font-family:var(--mono);}
.taint-badge{display:inline-block; font-size:8px; letter-spacing:.05em; text-transform:uppercase; padding:1px 5px; margin-right:4px; font-family:var(--mono);}
.taint-badge.log,.taint-badge.event{background:var(--red-l); color:var(--red); border:1px solid var(--red-b);}
.taint-badge.writeaccount,.taint-badge.return{background:var(--amber-l); color:var(--amber); border:1px solid var(--amber-b);}
.taint-badge.cpi{background:var(--blue-l); color:var(--blue); border:1px solid rgba(29,78,216,.3);}
.taint-carry{font-size:10.5px; color:var(--ink3); font-family:var(--mono);}

/* balances */
.bal-row{display:grid; grid-template-columns:1fr repeat(3,minmax(72px,auto)); gap:10px; align-items:center; padding:7px 0; border-bottom:1px solid var(--line3); font-size:11.5px;}
.bal-row:last-child{border-bottom:none;}
.bal-row.head{color:var(--ink3); font-family:var(--mono); font-size:9px; letter-spacing:.1em; text-transform:uppercase; border-bottom:1px solid var(--line2);}
.bal-acct{font-family:var(--mono); color:var(--ink2);}
.bal-cell{font-family:var(--mono); text-align:right; color:var(--ink);}
.bal-cell.enc{color:var(--grn);}

/* observer planes (public / authorized / leak) */
.planes{display:grid; grid-template-columns:repeat(3,1fr); border:1px solid var(--line2);}
.plane{padding:12px 14px; border-right:1px solid var(--line2);}
.plane:last-child{border-right:none;}
.plane .pl-h{font-family:var(--mono); font-size:9.5px; letter-spacing:.1em; text-transform:uppercase; font-weight:600; margin-bottom:9px; display:flex; align-items:center; gap:7px;}
.plane .pl-h::before{content:""; width:7px; height:7px; display:inline-block;}
.plane.public .pl-h{color:var(--ink2);} .plane.public .pl-h::before{background:var(--ink3);}
.plane.viewer .pl-h{color:var(--grn);} .plane.viewer .pl-h::before{background:var(--grn);}
.plane.leak .pl-h{color:var(--red);} .plane.leak .pl-h::before{background:var(--red);}
.plane.leak.clean .pl-h{color:var(--grn);} .plane.leak.clean .pl-h::before{background:var(--grn);}
.orow{display:flex; flex-direction:column; gap:1px; padding:5px 0; border-bottom:1px solid var(--line3); font-size:11px;}
.orow:last-child{border-bottom:none;}
.orow .k{font-family:var(--mono); font-size:9px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink3);}
.orow .v{font-family:var(--mono); color:var(--ink);}

/* findings */
.finding{display:flex; gap:8px; padding:9px 11px; margin-bottom:6px; border:1px solid; border-left-width:3px; align-items:flex-start; font-size:11.5px; line-height:1.5;}
.finding:last-child{margin-bottom:0;}
.finding.ok{border-color:var(--grn-b); border-left-color:var(--grn); background:var(--grn-l);}
.finding.warn{border-color:var(--amber-b); border-left-color:var(--amber); background:var(--amber-l);}
.finding.high{border-color:var(--red-b); border-left-color:var(--red); background:var(--red-l);}
.finding-icon{font-family:var(--mono); font-weight:700;}
.finding.ok .finding-icon{color:var(--grn);} .finding.warn .finding-icon{color:var(--amber);} .finding.high .finding-icon{color:var(--red);}
.finding-txt{color:var(--ink2);}
.finding-txt b{color:var(--ink); font-weight:600;}
.finding-rule{font-family:var(--mono); font-size:9px; font-weight:700; letter-spacing:.06em; padding:1px 6px; border:1px solid currentColor; align-self:flex-start; white-space:nowrap;}
.assump{font-family:var(--mono); font-size:10.5px; color:var(--ink3); line-height:1.6; padding:11px 14px; border:1px solid var(--line2); border-top:none; background:var(--paper-2);}
.assump b{color:var(--ink2);}

/* =====================  CAPABILITY GRID  ===================== */
.caps{display:grid; grid-template-columns:repeat(3,1fr); border:1px solid var(--line); background:var(--paper);}
.cap{padding:15px 16px; border-right:1px solid var(--line2); border-bottom:1px solid var(--line2); display:flex; gap:11px; align-items:flex-start;}
.cap:nth-child(3n){border-right:none;}
.cap:nth-last-child(-n+3){border-bottom:none;}
.cap .cx{font-family:var(--mono); font-size:11px; font-weight:600; color:var(--grn); flex:0 0 auto; width:18px;}
.cap .ct b{display:block; font-size:13.5px; font-weight:600; margin-bottom:6px;}
.cap .ct span{font-size:12px; color:var(--ink3); line-height:1.35;}

/* =====================  TEASER (solid umbra)  ===================== */
.teaser{background:var(--green-deep); color:var(--paper); padding:26px 28px; position:relative; overflow:hidden;}
.teaser .kick{font-family:var(--mono); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--yellow); font-weight:600; margin-bottom:12px; display:inline-flex; align-items:center; gap:8px;}
.teaser .kick::before{content:""; width:7px; height:7px; background:var(--yellow);}
.teaser h3{font-size:24px; font-weight:700; margin-bottom:10px; color:#fff;}
.teaser p{font-size:14.5px; color:rgba(255,255,255,.82); line-height:1.65; margin-bottom:16px;}
.teaser-items{display:flex; flex-wrap:wrap; gap:8px;}
.teaser-items span{font-family:var(--mono); font-size:11.5px; color:var(--paper); border:1px solid rgba(255,255,255,.28); padding:6px 11px;}
.teaser-items span::before{content:"→ "; color:var(--yellow);}

/* =====================  PERSONAS  ===================== */
.who{display:grid; grid-template-columns:repeat(3,1fr); border:1px solid var(--line); background:var(--paper);}
.who .card{padding:18px; border-right:1px solid var(--line2);}
.who .card:last-child{border-right:none;}
.who .rid{font-family:var(--mono); font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:var(--grn); font-weight:600; margin-bottom:10px;}
.who .role{font-family:var(--disp); font-weight:600; font-size:16px; margin-bottom:7px; line-height:1.2;}
.who .job{color:var(--ink2); font-size:13px; line-height:1.6;}
.who .drives{margin-top:12px; font-family:var(--mono); font-size:10.5px; color:var(--ink3); line-height:1.55; border-top:1px solid var(--line3); padding-top:10px;}
.who .drives b{color:var(--grn); font-weight:600;}

/* scenario list (use cases) */
.scn-list{border:1px solid var(--line); background:var(--paper);}
.scn{display:grid; grid-template-columns:34px 1fr auto; gap:14px; align-items:center; padding:13px 16px; border-bottom:1px solid var(--line2);}
.scn:last-child{border-bottom:none;}
.scn .rid{font-family:var(--mono); font-weight:700; font-size:11px; color:#1c1600; background:var(--yellow); padding:4px 0; text-align:center; letter-spacing:.04em;}
.scn .st{font-size:13.5px; font-weight:600; font-family:var(--disp);}
.scn .sd{font-size:12px; color:var(--ink3); margin-top:2px; line-height:1.5;}
.scn .persona{font-family:var(--mono); font-size:10.5px; color:var(--ink3); white-space:nowrap;}

/* =====================  ROADMAP  ===================== */
.roadmap{position:relative; padding-left:26px;}
.roadmap::before{content:""; position:absolute; left:5px; top:8px; bottom:8px; width:2px; background:var(--line2);}
.phase{position:relative; margin-bottom:30px;}
.phase:last-child{margin-bottom:0;}
.phase-dot{position:absolute; left:-26px; top:3px; width:12px; height:12px; border:2px solid var(--ink); background:var(--paper);}
.phase-dot.live{background:var(--yellow); border-color:var(--green-deep);}
.phase-epoch{font-family:var(--label); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink3); margin-bottom:6px; font-weight:600; display:flex; align-items:center; gap:9px; flex-wrap:wrap;}
.phase-epoch .st{padding:2px 8px; font-size:9px;}
.phase-epoch .st.now{background:var(--grn); color:#fff;}
.phase-epoch .st.plan{background:var(--paper-2); color:var(--ink3); border:1px solid var(--line2);}
.phase h3{font-size:18px; font-weight:600; margin-bottom:7px; letter-spacing:-.01em;}
.phase p{font-size:14px; color:var(--ink2); line-height:1.65;}
.phase p code{font-family:var(--mono); font-size:12.5px; background:var(--paper-2); border:1px solid var(--line3); padding:1px 5px;}
.dist{display:flex; flex-wrap:wrap; gap:7px; margin-top:12px;}
.dist span{font-family:var(--mono); font-size:10.5px; color:var(--ink2); border:1px solid var(--line2); background:var(--paper); padding:5px 10px;}

/* ===================== ROADMAP — stage diagram (rmap) ===================== */
.rmap-wrap{margin:6px 0 42px;}
.rmap{display:flex; align-items:stretch; gap:0;}
.rstep{position:relative; flex:1 1 0; min-width:0; display:flex; flex-direction:column; gap:10px;
  background:var(--yellow); color:var(--green-deep); border-top:3px solid var(--yellow-2);
  padding:18px 14px 16px; text-decoration:none; overflow:hidden;
  transition:transform .12s ease, background .12s ease;}
.rstep::before{content:""; position:absolute; inset:0; pointer-events:none; opacity:.15;
  background-image:linear-gradient(var(--paper) 1px,transparent 1px),linear-gradient(90deg,var(--paper) 1px,transparent 1px);
  background-size:20px 20px;}
.rstep > *{position:relative;}
.rstep:hover{background:var(--yellow-2); transform:translateY(-3px);}
.rstep-ico{width:46px; height:46px; flex:0 0 auto; display:flex; align-items:center; justify-content:center;
  background:var(--green-deep); color:var(--yellow);}
.rstep-ico svg{width:25px; height:25px; display:block;}
.rstep-ph{font-family:var(--mono); font-size:10px; letter-spacing:.13em; text-transform:uppercase;
  color:var(--green-deep); display:flex; align-items:center; gap:8px; flex-wrap:wrap;}
.rstep-ph b{color:var(--green-deep); font-weight:700;}
.rstep-st{font-family:var(--label); font-size:8px; letter-spacing:.09em; text-transform:uppercase;
  font-weight:600; padding:2px 7px;}
.rstep-st.now{background:var(--green-deep); color:var(--paper);}
.rstep-st.soon{border:1px solid var(--green-deep); color:var(--green-deep);}
.rstep-t{font-family:var(--disp); font-weight:700; font-size:18px; line-height:1.16; color:#FFFFFF;}
.rconn{flex:0 0 22px; display:flex; align-items:center; justify-content:center; color:var(--ink4);}
.rconn svg{width:16px; height:16px; display:block;}
@media(max-width:860px){
  .rmap{flex-direction:column; gap:12px;}
  .rstep{flex:0 0 auto; display:grid; grid-template-columns:auto 1fr;
    column-gap:14px; row-gap:10px; padding:18px;}
  .rstep-ico{grid-column:1; grid-row:1; align-self:center;}
  .rstep-ph{grid-column:2; grid-row:1; align-self:center; display:block;}
  .rstep-ph .rstep-st{display:block; width:fit-content; margin-top:7px;}
  .rstep-t{grid-column:1 / -1; grid-row:2; font-size:19px;}
  .rconn{flex:0 0 auto; padding:1px 0;}
  .rconn svg{transform:rotate(90deg);}
}

/* ===================== ROADMAP — Stages (vertical rail) ===================== */
.stages{border-left:2px solid var(--line); margin-left:8px;}
.stage{position:relative; padding:0 0 28px 26px;}
.stage:last-child{padding-bottom:0;}
.stage::before{content:""; position:absolute; left:-7px; top:4px; width:12px; height:12px; background:var(--paper); border:2px solid var(--ink);}
.stage.done::before{background:var(--grn); border-color:var(--green-deep);}
.stage-tag{font-family:var(--mono); font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink3); font-weight:600;}
.stage-tag .on{color:var(--grn);}
.stage h3{font-size:17px; font-weight:600; margin:6px 0 6px; letter-spacing:-.01em;}
.stage p{margin-top:12px; font-size:13.5px; color:var(--ink2); line-height:1.65;}
.stage p + p{margin-top:12px;}
.stage p code{font-family:var(--mono); font-size:11.5px; background:var(--paper-2); border:1px solid var(--line3); padding:1px 5px;}
.stage p a{color:var(--grn); text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:1px;}


/* =====================  FOOTER  ===================== */
.foot{background:var(--paper-2); color:var(--ink2); margin-top:56px; padding:30px 0 50px; border-top:1px solid var(--line-soft);}
.foot-in{max-width:1060px; margin:0 auto; padding:18px 22px; display:flex; align-items:center; gap:16px; flex-wrap:wrap;}
.foot .brand .wm{color:var(--ink);} .foot .brand .mark{color:var(--green-deep);}
.foot .tl{color:var(--ink3); border-left-color:var(--line2);}
.foot .flinks{margin-left:auto; margin-top:2px; display:flex; align-items:center; gap:14px;}
.foot .flinks a{display:inline-flex; align-items:center; justify-content:center; color:#000;}
.foot .flinks a:hover{color:var(--grn);}
.foot .flinks a svg{width:28px; height:28px; display:block;}
.foot .flinks .ck-glyph{width:19px; height:19px;}
.foot a:hover{color:var(--grn);}
.foot .disc{width:100%; font-family:var(--mono); font-size:11px; color:var(--ink3); line-height:1.6; border-top:1px solid var(--line2); padding-top:16px; margin-top:4px;}
@media(max-width:360px){ .foot .tl{display:none;} }
@media(max-width:400px){
  .foot .disc{text-align:center;}
  .foot .brand{display:none;}
  .foot .flinks{margin-left:0; justify-content:center; width:100%;}
}

/* =====================  UI-CHROME LABEL FONT  ===================== */
.eyebrow,.sec-h,.brand .tl,.nav-links a,.beta,.btn,.an-title,.an-net,.mode-btn,.demo-link,
.tag,.persona,.phase-epoch,.phase-epoch .st,.foot .flinks a,.foot .disc,.chip{font-family:var(--label);}

/* =====================  RESPONSIVE  ===================== */
@media(max-width:820px){
  .brand .tl{display:none;}
  .nav-links{gap:16px;}
  .caps{grid-template-columns:1fr;}
  .cap{border-right:none; border-bottom:1px solid var(--line2);}
  .cap:last-child{border-bottom:none;}
  .who{grid-template-columns:1fr;}
  .who .card{border-right:none; border-bottom:1px solid var(--line2);}
  .who .card:last-child{border-bottom:none;}
  .rgrid{grid-template-columns:repeat(2,1fr);}
  .stat:nth-child(4n){border-right:1px solid var(--line2);}
  .stat:nth-child(2n){border-right:none;}
  .planes{grid-template-columns:1fr;}
  .plane{border-right:none; border-bottom:1px solid var(--line2);}
  .plane:last-child{border-bottom:none;}
  .taint-row{grid-template-columns:1fr; gap:4px;}
  .proof-row{grid-template-columns:1fr auto; gap:6px;}
  .proof-cert{display:none;}
  .scn{grid-template-columns:28px 1fr; }
  .scn .persona{display:none;}
}
@media(max-width:520px){ .foot .flinks{margin-left:auto;} }
:focus-visible{outline:2px solid var(--yellow); outline-offset:2px;}
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto;} *{animation:none !important;} }

/* ---- mobile hamburger nav ---- */
.nav-toggle{display:none; width:34px; height:34px; flex:0 0 auto; align-items:center; justify-content:center; padding:0; background:var(--paper); border:1px solid var(--line); cursor:pointer;}
.nav-toggle:hover{background:var(--paper-2);}
.nav-toggle-box{position:relative; width:16px; height:12px;}
.nav-toggle-inner,.nav-toggle-inner::before,.nav-toggle-inner::after{position:absolute; left:0; width:16px; height:2px; background:var(--ink); transition:transform .2s ease, opacity .12s ease, top .2s ease;}
.nav-toggle-inner{top:5px;}
.nav-toggle-inner::before{content:""; top:-5px;}
.nav-toggle-inner::after{content:""; top:5px;}
.nav-toggle.open .nav-toggle-inner{background:transparent;}
.nav-toggle.open .nav-toggle-inner::before{top:0; transform:rotate(45deg);}
.nav-toggle.open .nav-toggle-inner::after{top:0; transform:rotate(-45deg);}
@media(max-width:720px){
  .nav-toggle{display:inline-flex; margin-left:auto;}
  .nav-links{position:absolute; top:100%; left:0; right:0; flex-direction:column; align-items:stretch; gap:0; background:var(--paper); border-bottom:1px solid var(--line); box-shadow:0 8px 24px rgba(13,13,12,.08); padding:4px 0; display:none;}
  .nav-links.open{display:flex;}
  .nav-links a{padding:13px 22px; font-size:13px; border-bottom:1px solid var(--line3);}
  .nav-links a:last-child{border-bottom:none;}
  .nav-links a.active{border-bottom-color:var(--line3); box-shadow:inset 3px 0 0 var(--yellow);}
  .beta{display:none;}
}