/* Qadenza site. One stylesheet for every page; the pages are generated by
   _src/build.py, so the top bar and footer are the same everywhere. */
:root{
  --bg:#0B0D0E; --bg-2:#111416; --bg-3:#171B1E;
  --line:rgba(255,255,255,.09); --line-2:rgba(255,255,255,.16);
  --text:#ECEFF1; --muted:#9AA3AB; --dim:#6B747C;
  --accent:#3FB887; --accent-2:#5FD3A2; --accent-ink:#06130D;
  --amber:#F2C27B; --focus:#5FA8E8; --danger:#FF8A7A;
  --topbar-bg:rgba(11,13,14,.86); --field:rgba(255,255,255,.04);
  --glow-a:#5FD3A2; --glow-b:#A8EDCF; --glow-c:#E6F7EF;
  --frame:1200px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth; background:var(--bg);}
body{margin:0; background:var(--bg); color:var(--text); font-family:'Geist',system-ui,sans-serif; font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased;}
a{color:inherit;}
img{max-width:100%;}
:focus-visible{outline:2px solid var(--focus); outline-offset:3px;}
code, .mono{font-family:'Geist Mono',ui-monospace,monospace;}
code{font-size:.88em; background:var(--bg-3); border:1px solid var(--line); border-radius:4px; padding:1px 5px;}
[id]{scroll-margin-top:88px;}
[hidden]{display:none !important;}

/* The frame: content sits between two hairlines, as on a drawing. */
.frame{max-width:var(--frame); margin:0 auto; border-left:1px solid var(--line); border-right:1px solid var(--line);}
.pad{padding-left:clamp(20px,5vw,72px); padding-right:clamp(20px,5vw,72px);}
.rule{border-top:1px solid var(--line);}
@media (max-width:1240px){ .frame{border-left:0; border-right:0;} }

/* TYPE */
.display{font-weight:300; font-size:clamp(44px,7vw,92px); line-height:1; letter-spacing:-.045em; margin:0; text-wrap:balance;}
.h2{font-weight:300; font-size:clamp(34px,4.6vw,60px); line-height:1.04; letter-spacing:-.04em; margin:0; text-wrap:balance;}
.h3{font-weight:400; font-size:clamp(22px,2.2vw,28px); line-height:1.2; letter-spacing:-.02em; margin:0;}
.glow{background:linear-gradient(92deg,var(--glow-a) 0%,var(--glow-b) 55%,var(--glow-c) 100%); -webkit-background-clip:text; background-clip:text; color:transparent;}
.lede{color:var(--muted); font-size:clamp(17px,1.5vw,20px); line-height:1.55; margin:0; max-width:560px; text-wrap:pretty;}
.label{font:500 12px 'Geist Mono',monospace; color:var(--dim); text-transform:uppercase; letter-spacing:.08em;}
.more{display:inline-flex; align-items:center; gap:6px; color:var(--accent-2); text-decoration:none; font-size:15px;}
.more:hover{color:#fff;}
.more::after{content:"→";}

/* BUTTONS: square-cornered, like the rest of the frame. */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; height:46px; padding:0 18px; border:1px solid transparent; border-radius:4px; font:500 15px 'Geist',sans-serif; text-decoration:none; cursor:pointer; white-space:nowrap; transition:background .15s, border-color .15s, color .15s;}
.btn-primary{background:var(--accent); color:var(--accent-ink);}
.btn-primary:hover{background:var(--accent-2);}
.btn-ghost{background:transparent; color:var(--text); border-color:var(--line-2);}
.btn-ghost:hover{border-color:var(--text);}
.btn-sm{height:38px; padding:0 14px; font-size:14px;}
.btns{display:flex; flex-wrap:wrap; gap:12px;}

/* ANNOUNCEMENT + TOP BAR */
.announce{display:block; text-align:center; padding:9px 16px; font-size:13px; color:var(--muted); background:linear-gradient(90deg,rgba(63,184,135,.06),rgba(63,184,135,.16),rgba(63,184,135,.06)); border-bottom:1px solid var(--line); text-decoration:none;}
.announce b{color:var(--text); font-weight:500;}
.announce span{color:var(--accent-2); text-decoration:underline; text-underline-offset:3px;}
.topbar{position:sticky; top:0; z-index:40; background:var(--topbar-bg); -webkit-backdrop-filter:saturate(1.4) blur(12px); backdrop-filter:saturate(1.4) blur(12px); border-bottom:1px solid var(--line);}
.topbar-inner{max-width:var(--frame); margin:0 auto; height:64px; display:flex; align-items:center; gap:36px; padding:0 0 0 clamp(16px,2vw,24px);}
.brand{display:block; line-height:0; flex-shrink:0;}
.brand img{height:38px; width:auto; display:block;}
.main-nav{display:flex; gap:26px; font-size:14px;}
.main-nav a{color:var(--muted); text-decoration:none; white-space:nowrap;}
.main-nav a:hover, .main-nav a[aria-current]{color:var(--text);}
.topbar-end{margin-left:auto; display:flex; align-items:stretch; height:100%;}
.topbar-end .contact{display:flex; align-items:center; padding:0 20px; color:var(--muted); font-size:14px; text-decoration:none;}
.topbar-end .contact:hover{color:var(--text);}
.topbar-end .cta{display:flex; align-items:center; padding:0 22px; background:var(--accent); color:var(--accent-ink); font-weight:500; font-size:14px; text-decoration:none; cursor:pointer; border:0; font-family:inherit;}
.topbar-end .cta:hover{background:var(--accent-2);}
.mnav{display:none; position:relative; align-self:center; margin:0 8px;}
.mnav summary{list-style:none; cursor:pointer; color:var(--text); border:1px solid var(--line-2); border-radius:4px; width:44px; height:40px; display:flex; align-items:center; justify-content:center;}
.mnav summary::-webkit-details-marker{display:none;}
.mnav[open] summary{background:var(--bg-3);}
.mnav-list{position:absolute; right:0; top:calc(100% + 12px); min-width:230px; background:var(--bg-2); border:1px solid var(--line-2); border-radius:6px; padding:6px; display:flex; flex-direction:column; box-shadow:0 18px 40px rgba(0,0,0,.5);}
.mnav-list a{color:var(--muted); text-decoration:none; padding:12px; border-radius:4px; font-size:15px;}
.mnav-list a:hover{background:var(--bg-3); color:var(--text);}
@media (max-width:1080px){ .main-nav, .topbar-end .contact{display:none;} .mnav{display:block;} .topbar-end{order:2;} .mnav{order:3;} }
@media (max-width:420px){ .brand img{height:30px;} .topbar-end .cta{padding:0 12px; font-size:13px;} .topbar-inner{gap:8px;} }

/* HERO */
.grid-bg{background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px); background-size:56px 56px; background-position:-1px -1px;}
.hero{position:relative; overflow:hidden;}
.hero::before{content:""; position:absolute; inset:0; background:radial-gradient(60% 70% at 85% 30%, rgba(63,184,135,.14), transparent 70%), radial-gradient(50% 60% at 0% 0%, rgba(63,184,135,.08), transparent 70%); pointer-events:none;}
.hero-inner{position:relative; display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.25fr); gap:clamp(28px,3.5vw,56px); align-items:center; padding-top:clamp(56px,8vw,112px); padding-bottom:clamp(56px,8vw,112px);}
@media (max-width:980px){ .hero-inner{grid-template-columns:1fr;} }
.hero .display{font-size:clamp(44px,5.4vw,76px);}
.hero .pill{display:inline-flex; flex-wrap:wrap; gap:6px 12px; align-items:center; font:400 12px 'Geist Mono',monospace; color:var(--muted); border:1px solid var(--line-2); background:var(--topbar-bg); padding:6px 11px; border-radius:4px; margin-bottom:28px;}
.pill .live{display:inline-flex; align-items:center; gap:7px; color:var(--accent-2);}
.pill .live i{width:7px; height:7px; border-radius:50%; background:var(--accent); animation:pulse 2s infinite;}
@keyframes pulse{50%{opacity:.35}}
.hero .lede{margin-top:26px;}
.signup{display:flex; flex-wrap:wrap; gap:10px; margin-top:34px; max-width:520px;}
.signup input[type=email]{flex:1 1 230px; min-width:0; height:46px; background:var(--field); border:1px solid var(--line-2); border-radius:4px; color:var(--text); padding:0 14px; font:15px 'Geist',sans-serif;}
.signup input[type=email]::placeholder{color:var(--dim);}
.signup input[type=email]:focus{outline:none; border-color:var(--accent);}
@media (max-width:480px){ .signup input[type=email], .signup .btn{flex:1 1 100%;} }
.signup-alt{margin:14px 0 0; font-size:14px; color:var(--dim);}
.signup-alt a{color:var(--text); text-underline-offset:3px;}
.confirm{display:none; align-items:center; gap:10px; margin-top:34px; max-width:520px; padding:12px 14px; border:1px solid rgba(63,184,135,.5); background:rgba(63,184,135,.1); border-radius:4px; font-size:15px;}
.confirm i{width:7px; height:7px; border-radius:50%; background:var(--accent);}
.err{display:none; margin-top:10px; font:13px 'Geist Mono',monospace; color:var(--danger);}

/* NETWORK DIAGRAM */
.netdiag{margin:0 -24px 0 0; position:relative;
  --panel:#13171A; --hairline:#262C31; --ink:#EEF1F3; --steel:#8E979F;
  --nd-card:#1B2024; --nd-card-border:#2C3338; --nd-icon:#B5BDC4; --nd-control:#4D555C;
  --nd-green:#4FB283; --nd-green-top:#7CC49F; --nd-green-right:#3A8A64;}
[data-theme=light] .netdiag{
  --panel:#FFFFFF; --hairline:#DCDFE3; --ink:#181B1F; --steel:#5B6470;
  --nd-card:#F4F5F6; --nd-card-border:#E2E5E8; --nd-icon:#4A5058; --nd-control:#AAB1B8;
  --nd-green:#1F7A5C; --nd-green-top:#58A07C; --nd-green-right:#2D6349;}
.netdiag svg{display:block; width:100%; height:auto; font-family:'Geist',system-ui,sans-serif;}
.netdiag figcaption{margin-top:14px; font-size:14px; color:var(--dim); text-align:center;}
.netdiag figcaption a{color:var(--muted);}
.nd-panel{fill:var(--panel); stroke:var(--hairline);}
.nd-card{fill:var(--nd-card); stroke:var(--nd-card-border);}
.nd-name{fill:var(--ink); font-size:15px; font-weight:500;}
.nd-sub{fill:var(--steel); font:400 11.5px 'Geist Mono',ui-monospace,monospace;}
.nd-label{fill:var(--steel); font:400 11px 'Geist Mono',ui-monospace,monospace; letter-spacing:.14em;}
.nd-caption{fill:var(--steel); font:400 11px 'Geist Mono',ui-monospace,monospace;}
.nd-icon{fill:none; stroke:var(--nd-icon); stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round;}
.nd-lockic{fill:none; stroke:var(--nd-green); stroke-width:1.5; stroke-linecap:round;}
.nd-lockring{fill:var(--panel); stroke:var(--nd-green); stroke-width:1.5;}
.nd-cube-top{fill:var(--nd-green-top);} .nd-cube-left{fill:var(--nd-green);} .nd-cube-right{fill:var(--nd-green-right);}
.nd-cube-outline{fill:var(--panel); stroke:var(--nd-green); stroke-width:1.8; stroke-linejoin:round;}
.nd-feed{fill:none; stroke:var(--nd-green); stroke-width:1.5; opacity:.55;}
.nd-pipe{fill:var(--nd-green);}
.nd-pipe-flow{stroke:var(--panel); stroke-width:3; stroke-dasharray:1 14; stroke-linecap:round; animation:nd-flow 1.6s linear infinite;}
.nd-status{fill:var(--nd-green);}
.nd-pulse{fill:var(--nd-green); transform-box:fill-box; transform-origin:center; animation:nd-pulse 2.4s ease-out infinite;}
@keyframes nd-flow{to{stroke-dashoffset:-30;}}
@keyframes nd-pulse{0%{transform:scale(1); opacity:.5} 80%,100%{transform:scale(3); opacity:0}}
@media (prefers-reduced-motion:reduce){ .nd-pipe-flow, .nd-pulse, .pill .live i{animation:none;} .nd-pulse{opacity:0;} }

/* SECTIONS */
.section{padding-top:clamp(64px,8vw,112px); padding-bottom:clamp(64px,8vw,112px);}
.section-head{max-width:760px; margin-bottom:clamp(36px,5vw,64px);}
.section-head .lede{margin-top:18px;}
.section-head.center{margin-left:auto; margin-right:auto; text-align:center;}
.section-head.center .lede{margin-left:auto; margin-right:auto;}

/* STEPS: numbered, three across. */
.steps{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(24px,3vw,44px);}
@media (max-width:900px){ .steps{grid-template-columns:1fr;} }
.step .n{display:inline-flex; width:26px; height:26px; align-items:center; justify-content:center; background:var(--accent); color:var(--accent-ink); font:600 13px 'Geist Mono',monospace; border-radius:2px; margin-bottom:18px;}
.step h3{font-weight:400; font-size:24px; letter-spacing:-.02em; margin:0 0 10px;}
.step p{color:var(--muted); margin:0 0 22px; max-width:34ch;}
.snip{background:var(--bg-2); border:1px solid var(--line); border-radius:6px; padding:14px 16px; font:13px/1.7 'Geist Mono',monospace; color:#C9CDD3; overflow:hidden;}
.snip .p{color:var(--accent-2);} .snip .c{color:var(--dim);} .snip .ok{color:var(--accent-2);}
.snip-row{display:flex; justify-content:space-between; gap:10px; padding:6px 0; border-top:1px solid var(--line);}
.snip-row span:last-child{flex-shrink:0;}
.snip-row:first-child{border-top:0;}
.chips{list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:6px;}
.chips li{font:12.5px 'Geist Mono',monospace; color:var(--text); border:1px solid var(--line-2); border-radius:3px; padding:4px 9px;}

/* BENTO: cells divided by hairlines. */
.bento{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); border-top:1px solid var(--line);}
.bento > .cell{padding:clamp(28px,4vw,56px); border-bottom:1px solid var(--line); display:flex; flex-direction:column; gap:14px; min-width:0;}
.bento > .cell:nth-child(odd){border-right:1px solid var(--line);}
.bento > .cell.wide{grid-column:1 / -1; border-right:0; display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:clamp(24px,4vw,56px); align-items:center;}
.bento > .cell.wide ~ .cell:nth-child(odd){border-right:0;}
.bento > .cell.wide ~ .cell:nth-child(even){border-right:1px solid var(--line);}
@media (max-width:860px){ .bento{grid-template-columns:1fr;} .bento > .cell{border-right:0 !important;} .bento > .cell.wide{grid-template-columns:1fr;} }
.cell h3{font-weight:400; font-size:clamp(24px,2.4vw,32px); line-height:1.15; letter-spacing:-.025em; margin:0;}
.cell p{color:var(--muted); margin:0; max-width:46ch;}
.cell .shot{margin-top:auto; padding-top:10px;}
/* Side-by-side cards show their screenshots at one size: the same frame,
   filled from the top, so neighbouring images line up whatever their shape. */
.bento > .cell:not(.wide) .shot img{aspect-ratio:2000 / 1197; object-fit:cover; object-position:top left;}
.shot img{display:block; width:100%; height:auto; border:1px solid var(--line-2); border-radius:6px; box-shadow:0 24px 60px -20px rgba(0,0,0,.7);}
.shot.glow-under img{box-shadow:0 -10px 80px -20px rgba(63,184,135,.3), 0 24px 60px -20px rgba(0,0,0,.7);}

/* ICON GRID */
.icons{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:clamp(28px,3.5vw,48px) clamp(20px,3vw,40px);}
@media (max-width:980px){ .icons{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:520px){ .icons{grid-template-columns:1fr;} }
.icons .ic{width:30px; height:30px; display:flex; align-items:center; justify-content:center; border:1px solid rgba(63,184,135,.4); background:rgba(63,184,135,.08); border-radius:3px; color:var(--accent-2); margin-bottom:16px;}
.icons .ic svg{width:17px; height:17px;}
.icons h4{margin:0 0 6px; font-weight:500; font-size:16px;}
.icons p{margin:0; color:var(--muted); font-size:14.5px; line-height:1.55;}

/* RELAY FACTS + EGRESS CARD */
.split{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:clamp(32px,5vw,72px); align-items:center;}
@media (max-width:900px){ .split{grid-template-columns:1fr;} }
.facts{list-style:none; margin:0; padding:0; border-top:1px solid var(--line);}
.facts li{display:grid; grid-template-columns:130px 1fr; gap:18px; padding:18px 0; border-bottom:1px solid var(--line); color:var(--muted);}
.facts b{font:500 12px 'Geist Mono',monospace; color:var(--text); letter-spacing:.08em; padding-top:4px;}
@media (max-width:480px){ .facts li{grid-template-columns:1fr; gap:4px;} }
.egress{background:var(--bg-2); border:1px solid var(--line-2); border-radius:8px; padding:clamp(24px,3.2vw,40px); font:14px/1.6 'Geist Mono',monospace; box-shadow:0 30px 80px -30px rgba(63,184,135,.25);}
.egress h3{margin:0 0 6px; font:500 15px 'Geist Mono',monospace; color:var(--accent-2);}
.egress > p{margin:0 0 22px; color:var(--dim);}
.egress dl{margin:0; display:grid; gap:18px;}
.egress dt{color:var(--text); overflow-wrap:anywhere;}
.egress dd{margin:4px 0 0; color:var(--muted); font:14.5px/1.5 'Geist',sans-serif;}
.egress .none{margin:22px 0 0; padding-top:18px; border-top:1px solid var(--line); color:var(--dim);}
.egress .none b{color:var(--accent-2); font-weight:500;}

/* BAND: a full-width tinted strip inside the frame. */
.band{background:linear-gradient(180deg,rgba(63,184,135,.07),rgba(63,184,135,.02)); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.band-inner{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(28px,5vw,72px); align-items:center;}
@media (max-width:900px){ .band-inner{grid-template-columns:1fr;} }
.tag{display:inline-block; font:500 12px 'Geist Mono',monospace; color:var(--amber); border:1px solid rgba(242,194,123,.4); border-radius:3px; padding:3px 8px; margin-bottom:18px;}
.numbered{list-style:none; margin:0; padding:0; counter-reset:n;}
.numbered li{display:flex; gap:16px; padding:14px 0; border-top:1px solid var(--line); counter-increment:n; color:var(--text);}
.numbered li:last-child{border-bottom:1px solid var(--line);}
.numbered li::before{content:counter(n,decimal-leading-zero); font:500 12px 'Geist Mono',monospace; color:var(--accent-2); padding-top:4px;}

/* FEATURE ROWS (features page) */
.row{display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.3fr); gap:clamp(28px,5vw,72px); align-items:center; padding-top:clamp(48px,6vw,88px); padding-bottom:clamp(48px,6vw,88px); border-top:1px solid var(--line);}
.row.flip{grid-template-columns:minmax(0,1.3fr) minmax(0,.85fr);}
.row.flip > :first-child{order:2;}
@media (max-width:900px){ .row, .row.flip{grid-template-columns:1fr;} .row.flip > :first-child{order:0;} }
.row .label{display:block; margin-bottom:14px; color:var(--accent-2);}
.row p{color:var(--muted); margin:16px 0 0; max-width:44ch;}
.points{list-style:none; margin:24px 0 0; padding:0; display:grid; gap:12px;}
.points li{position:relative; padding-left:20px; color:var(--muted); font-size:15px;}
.points li::before{content:""; position:absolute; left:0; top:.62em; width:7px; height:7px; background:var(--accent); border-radius:1px;}
.points strong{color:var(--text); font-weight:500;}

/* TABS (MCP / OpenAI, install OS) */
.tabs{display:flex; gap:4px; margin-bottom:12px; flex-wrap:wrap;}
.tab{font:13px 'Geist Mono',monospace; background:none; border:1px solid var(--line-2); color:var(--muted); padding:9px 14px; border-radius:3px; cursor:pointer;}
.tab:hover{color:var(--text);}
.tab[aria-selected=true]{background:var(--text); border-color:var(--text); color:var(--bg);}
.stage{background:var(--bg-2); border:1px solid var(--line-2); border-radius:8px; overflow:hidden;}
.stage-bar{display:flex; align-items:center; gap:6px; padding:11px 14px; border-bottom:1px solid var(--line);}
.stage-bar i{width:9px; height:9px; border-radius:50%; background:#2A3036;}
.stage-bar span{margin-left:8px; font:12px 'Geist Mono',monospace; color:var(--dim);}
.stage-body{padding:20px 22px;}
.stage-body .h{margin:0 0 4px; font-weight:500;}
.stage-body .sub{margin:12px 0 8px; font:12.5px 'Geist Mono',monospace; color:var(--dim);}
.stage-body pre{margin:0; font:13px/1.65 'Geist Mono',monospace; color:#C9CDD3; overflow-x:auto;}
.stage-body pre .kw{color:#E7C07A;} .stage-body pre .str{color:#8FD6B4;} .stage-body pre .cm{color:var(--dim);}
.cmd{display:block; font:13px 'Geist Mono',monospace; background:var(--bg-3); border:1px solid var(--line); border-radius:4px; padding:10px 12px; overflow-x:auto; white-space:nowrap; color:#C9CDD3;}
.cmd .p{color:var(--accent-2);}
[data-cmd]{cursor:pointer;}
[data-cmd]:hover{border-color:var(--line-2); color:var(--text);}
.tab-note{font-size:14px; color:var(--dim); margin:14px 0 0;}

/* FAQ */
.faq{max-width:860px;}
.faq details{border-top:1px solid var(--line);}
.faq details:last-of-type{border-bottom:1px solid var(--line);}
.faq summary{cursor:pointer; list-style:none; padding:24px 48px 24px 0; font-size:clamp(18px,1.7vw,21px); font-weight:400; letter-spacing:-.01em; position:relative;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+"; position:absolute; right:4px; top:50%; transform:translateY(-50%); font:300 26px 'Geist Mono',monospace; color:var(--dim);}
.faq details[open] summary::after{content:"−"; color:var(--accent-2);}
.faq .a{padding:0 0 26px; color:var(--muted); max-width:70ch;}
.faq .a p{margin:0 0 12px;} .faq .a p:last-child{margin:0;}
.faq .a ul{margin:0 0 12px; padding-left:20px;} .faq .a li{margin:6px 0;}
.faq .a a{color:var(--accent-2);}
.faq .a strong{color:var(--text); font-weight:500;}

/* PAGE HEAD (inner pages) */
.page-head{padding-top:clamp(64px,9vw,128px); padding-bottom:clamp(48px,6vw,88px);}
.page-head .label{display:block; margin-bottom:20px; color:var(--accent-2);}
.page-head .lede{margin-top:24px;}
.page-head .meta{margin-top:24px; font:13px 'Geist Mono',monospace; color:var(--dim);}
.page-head .btns{margin-top:32px;}

/* PROSE (how it works, guides) */
.layout{display:grid; grid-template-columns:220px minmax(0,1fr); gap:56px; align-items:start;}
@media (max-width:900px){ .layout{grid-template-columns:1fr; gap:24px;} }
.toc{position:sticky; top:96px; font-size:14px;}
.toc ol{list-style:none; margin:12px 0 0; padding:0; border-left:1px solid var(--line);}
.toc a{display:block; padding:6px 0 6px 14px; color:var(--muted); text-decoration:none;}
.toc a:hover{color:var(--text);}
@media (max-width:900px){ .toc{position:static; border:1px solid var(--line); border-radius:6px; padding:16px 18px;} }
.prose{max-width:720px; min-width:0;}
.prose h2{font-weight:300; font-size:clamp(28px,3vw,38px); letter-spacing:-.03em; line-height:1.1; margin:64px 0 16px;}
.prose h2:first-child{margin-top:0;}
.prose h3{font-weight:500; font-size:18px; margin:32px 0 10px;}
.prose p, .prose li{color:var(--muted);}
.prose p{margin:0 0 16px;}
.prose ul, .prose ol{margin:0 0 18px; padding-left:22px;}
.prose li{margin:7px 0;}
.prose strong{color:var(--text); font-weight:500;}
.prose a{color:var(--accent-2); text-underline-offset:3px;}
.term{background:var(--bg-2); border:1px solid var(--line); color:#C9CDD3; border-radius:6px; padding:14px 18px; font:13.5px/1.7 'Geist Mono',monospace; overflow-x:auto; white-space:pre; margin:0 0 18px;}
.term .p{color:var(--accent-2);} .term .c{color:var(--dim);}
.note{border:1px solid var(--line-2); border-left:2px solid var(--accent); background:var(--bg-2); border-radius:0 6px 6px 0; padding:16px 20px; margin:0 0 20px;}
.note p:last-child{margin:0;}
.table-wrap{overflow-x:auto; margin:0 0 22px; border:1px solid var(--line); border-radius:6px;}
table{border-collapse:collapse; width:100%; min-width:620px; font-size:14.5px;}
th, td{text-align:left; padding:13px 15px; border-bottom:1px solid var(--line); vertical-align:top; color:var(--muted);}
th{font:500 12px 'Geist Mono',monospace; color:var(--dim); text-transform:uppercase; letter-spacing:.06em; background:var(--bg-2);}
tr:last-child td{border-bottom:0;}
td:first-child{color:var(--text); white-space:nowrap;}
tr.us td{background:rgba(63,184,135,.08); color:var(--text);}

/* CHANGELOG */
.entry{display:grid; grid-template-columns:180px minmax(0,1fr); gap:32px; padding:44px 0; border-top:1px solid var(--line);}
@media (max-width:700px){ .entry{grid-template-columns:1fr; gap:10px;} }
.entry time{font:13px 'Geist Mono',monospace; color:var(--dim); padding-top:10px;}
.entry h2{margin-top:0 !important;}

/* PEOPLE */
.people{display:grid; grid-template-columns:repeat(auto-fill,minmax(270px,1fr)); gap:16px; margin:0 0 32px;}
.person{border:1px solid var(--line-2); background:var(--bg-2); border-radius:6px; padding:22px; display:flex; gap:16px; align-items:center;}
.avatar{width:56px; height:56px; border-radius:50%; background:rgba(63,184,135,.12); border:1px solid rgba(63,184,135,.35); color:var(--accent-2); font:500 17px 'Geist',sans-serif; display:flex; align-items:center; justify-content:center; overflow:hidden; flex-shrink:0;}
.avatar img{width:100%; height:100%; object-fit:cover;}
.person h3{margin:0; font-weight:500; font-size:17px;}
.person p{margin:2px 0 0 !important; font-size:14px;}

/* CTA */
.cta{text-align:center;}
.cta .signup{margin-left:auto; margin-right:auto;}
.cta .confirm{margin-left:auto; margin-right:auto;}
.cta .btns{justify-content:center; margin-top:32px;}

/* FOOTER */
.footer{padding-top:64px; padding-bottom:40px;}
.footer-grid{display:grid; grid-template-columns:minmax(0,1.3fr) repeat(3,minmax(0,1fr)); gap:40px 32px;}
@media (max-width:860px){ .footer-grid{grid-template-columns:repeat(2,minmax(0,1fr));} .footer-grid > :first-child{grid-column:1 / -1;} }
.footer h5{margin:0 0 16px; font:500 12px 'Geist Mono',monospace; color:var(--dim); text-transform:uppercase; letter-spacing:.08em;}
.footer ul{list-style:none; margin:0; padding:0; display:grid; gap:4px;}
.footer ul a{display:flex; align-items:center; min-height:32px; color:var(--muted); text-decoration:none; font-size:14px;}
.footer ul a:hover{color:var(--text);}
.footer .about-us{color:var(--muted); font-size:14px; max-width:34ch; margin:16px 0 22px;}
.founders{display:flex; flex-direction:column; gap:12px;}
.founder{display:flex; align-items:center; gap:12px; text-decoration:none; font-size:14px;}
.founder .avatar{width:38px; height:38px; font-size:13px;}
.founder .who{display:block; color:var(--text);}
.founder .role{display:block; color:var(--dim); font-size:13px;}
.footer-bottom{margin-top:56px; padding-top:22px; border-top:1px solid var(--line); display:flex; flex-wrap:wrap; gap:12px; justify-content:space-between; align-items:center; font-size:13px; color:var(--dim);}
.footer-bottom .by{display:flex; align-items:center; gap:10px;}
.footer-bottom img{height:26px; width:auto;}
/* The Monolyth mark is dark; in dark mode it sits on a small white card. */
html:not([data-theme=light]) .footer-bottom .monolyth{height:34px; padding:4px 8px; background:#fff; border-radius:4px;}

/* BETA DIALOG */
dialog.beta{width:min(560px,calc(100vw - 32px)); max-height:calc(100dvh - 32px); padding:0; border:1px solid var(--line-2); border-radius:8px; background:var(--bg-2); color:var(--text); overflow:auto; box-shadow:0 30px 80px rgba(0,0,0,.6);}
dialog.beta::backdrop{background:rgba(0,0,0,.6); -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px);}
.beta-head{display:flex; justify-content:space-between; align-items:flex-start; gap:16px; padding:24px 24px 0;}
.beta-head h2{font-weight:400; font-size:22px; letter-spacing:-.02em; margin:0 0 4px;}
.beta-head p{margin:0; color:var(--muted); font-size:14.5px;}
.beta-close{background:none; border:0; font-size:24px; line-height:1; color:var(--muted); cursor:pointer; padding:2px 6px;}
.beta-close:hover{color:var(--text);}
.beta-form{display:grid; gap:18px; padding:22px 24px 26px;}
.beta-row{display:grid; grid-template-columns:1fr 1fr; gap:12px;}
@media (max-width:520px){ .beta-row{grid-template-columns:1fr;} }
.field{display:grid; gap:7px; min-width:0;}
.field > span, .field legend{font-size:13px; font-weight:500; color:var(--text); padding:0;}
.beta-form input[type=text], .beta-form input[type=email], .beta-form select{width:100%; background:var(--bg); border:1px solid var(--line-2); color:var(--text); padding:11px 12px; border-radius:4px; font:15px 'Geist',sans-serif;}
.beta-form input:focus, .beta-form select:focus{outline:none; border-color:var(--accent);}
fieldset.field{border:0; margin:0; padding:0;}
.choices{display:flex; flex-wrap:wrap; gap:8px;}
.choice{position:relative;}
.choice input{position:absolute; opacity:0; inset:0; cursor:pointer;}
.choice span{display:inline-block; font-size:14px; padding:8px 14px; border:1px solid var(--line-2); border-radius:3px; color:var(--muted);}
.choice input:checked + span{border-color:var(--accent); background:rgba(63,184,135,.12); color:var(--text);}
.choice input:focus-visible + span{outline:2px solid var(--focus); outline-offset:2px;}
.consent{display:flex; gap:10px; align-items:flex-start; font-size:14px; color:var(--muted);}
.consent input{margin-top:4px; accent-color:var(--accent);}
.consent a{color:var(--accent-2);}
.beta-foot{display:flex; flex-wrap:wrap; align-items:center; gap:12px;}
.beta-foot .err{display:block; margin:0;}
.beta-done{padding:30px 24px; display:grid; gap:12px;}
.beta-done h2{margin:0; font-weight:400; font-size:22px;}
.beta-done p{margin:0; color:var(--muted);}
.linkish{background:none; border:0; padding:0; font:inherit; font-size:14px; color:var(--accent-2); text-decoration:underline; cursor:pointer;}
.hp{position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden;}

/* REVEAL: sections ease in as they scroll into view (site.js). */
.js-reveal .reveal{opacity:0; transform:translateY(24px); transition:opacity .7s ease, transform .8s cubic-bezier(.2,.7,.2,1);}
.js-reveal .reveal.in{opacity:1; transform:none;}

/* LIGHT THEME: the same page on paper. html[data-theme] is set before first
   paint (the head script in _src/build.py) from the visitor's choice, or their
   system setting; the toggle is in site.js. */
[data-theme=light]{
  --bg:#F7F8F8; --bg-2:#FFFFFF; --bg-3:#EEF0F2;
  --line:rgba(24,27,31,.09); --line-2:rgba(24,27,31,.18);
  --text:#14171A; --muted:#4F5861; --dim:#78818A;
  --accent:#1F7A5C; --accent-2:#1F7A5C; --accent-ink:#FFFFFF;
  --amber:#9A6412; --focus:#1F6FB4; --danger:#B23A2E;
  --topbar-bg:rgba(247,248,248,.86); --field:#FFFFFF;
  --glow-a:#1F7A5C; --glow-b:#2E9A72; --glow-c:#4DB58C;
  color-scheme:light;
}
html:not([data-theme=light]){color-scheme:dark;}
[data-theme=light] .btn-primary:hover, [data-theme=light] .topbar-end .cta:hover{background:#195F49;}
[data-theme=light] .more:hover{color:var(--text);}
[data-theme=light] .shot img{box-shadow:0 24px 50px -24px rgba(24,27,31,.35);}
[data-theme=light] .shot.glow-under img{box-shadow:0 -10px 60px -24px rgba(31,122,92,.35), 0 24px 50px -24px rgba(24,27,31,.35);}
[data-theme=light] .mnav-list, [data-theme=light] dialog.beta{box-shadow:0 18px 40px rgba(24,27,31,.18);}
[data-theme=light] dialog.beta::backdrop{background:rgba(24,27,31,.35);}
[data-theme=light] .person{background:var(--bg-2);}

/* Code and terminal surfaces stay dark in both themes. */
[data-theme=light] :is(.snip, .egress, .stage, .term){
  --bg:#0B0D0E; --bg-2:#111416; --bg-3:#171B1E;
  --line:rgba(255,255,255,.09); --line-2:rgba(255,255,255,.16);
  --text:#ECEFF1; --muted:#9AA3AB; --dim:#6B747C; --accent-2:#5FD3A2;
  background:#111416; color:#C9CDD3; border-color:#111416;
}
[data-theme=light] .egress{box-shadow:0 30px 60px -30px rgba(24,27,31,.45);}
[data-theme=light] .cmd{background:#111416; border-color:#111416; color:#C9CDD3;}
[data-theme=light] .cmd .p{color:#5FD3A2;}
[data-theme=light] .stage .chips li{color:#ECEFF1; border-color:rgba(255,255,255,.16);}
/* Except the install commands and model list in the steps, which follow the page. */
[data-theme=light] .step .snip, [data-theme=light] .step .cmd{
  --text:#14171A; --muted:#4F5861; --dim:#78818A; --accent-2:#1F7A5C;
  --line:rgba(24,27,31,.09); --line-2:rgba(24,27,31,.18);
  background:#FFFFFF; border-color:var(--line-2); color:var(--text);
}
[data-theme=light] .step .cmd .p{color:#1F7A5C;}

/* Logos: a light wordmark on dark, a dark one on light. */
.logo-light{display:none !important;}
[data-theme=light] .logo-light{display:block !important;}
[data-theme=light] .logo-dark{display:none !important;}

/* THEME TOGGLE: floating, bottom right. */
.theme-toggle{position:fixed; right:18px; bottom:18px; z-index:50; width:44px; height:44px; display:flex; align-items:center; justify-content:center;
  background:var(--bg-2); color:var(--text); border:1px solid var(--line-2); border-radius:6px; cursor:pointer; box-shadow:0 8px 24px rgba(0,0,0,.25);}
.theme-toggle:hover{border-color:var(--text);}
.theme-toggle svg{width:19px; height:19px;}
.theme-toggle .sun{display:none;}
[data-theme=light] .theme-toggle .sun{display:block;}
[data-theme=light] .theme-toggle .moon{display:none;}
@media print{ .theme-toggle{display:none;} }

/* WORKS WITH: logo tiles under step 3. */
.logos{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px;}
.logos li{display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; padding:14px 6px 12px; border:1px solid var(--line); border-radius:4px; background:var(--bg-2); color:var(--text); font-size:12.5px; text-align:center;}
.logos svg{width:26px; height:26px;}
.logos span{color:var(--muted);}

/* PROFILES (about page): full photo on top, name and links below. */
.profiles{display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,320px)); gap:20px; margin:0 0 48px;}
.profile{border:1px solid var(--line-2); background:var(--bg-2); border-radius:8px; overflow:hidden; display:flex; flex-direction:column;}
.profile-photo{display:block; width:100%; height:auto; aspect-ratio:469 / 625; object-fit:cover; background:var(--bg-3);}
.profile-initials{display:flex; align-items:center; justify-content:center; font:300 64px 'Geist',sans-serif; letter-spacing:-.03em; color:var(--accent-2); background:radial-gradient(circle at 50% 40%, rgba(63,184,135,.16), transparent 70%), var(--bg-3);}
.profile-body{padding:20px 22px 22px;}
.profile-body h3{margin:0; font-weight:500; font-size:19px; letter-spacing:-.01em;}
.prose .profile-body p{margin:2px 0 0; color:var(--muted); font-size:14.5px;}
.prose .profile-link{display:inline-flex; align-items:center; gap:8px; margin-top:16px; padding:8px 12px; border:1px solid var(--line-2); border-radius:4px; color:var(--text); text-decoration:none; font-size:14px;}
.prose .profile-link:hover{border-color:var(--text);}
.profile-link svg{width:16px; height:16px;}

/* PRICING: three plan cards, an organizations strip, and a comparison table. */
.plans-wrap{padding-bottom:clamp(64px,8vw,112px);}
.plans{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; align-items:stretch;}
@media (max-width:980px){ .plans{grid-template-columns:1fr; max-width:560px; margin:0 auto;} }
.plan{position:relative; display:flex; flex-direction:column; border:1px solid var(--line-2); border-radius:8px; background:var(--bg-2); padding:28px 26px 30px;}
.plan.featured{border-color:rgba(63,184,135,.55); background:linear-gradient(180deg,rgba(63,184,135,.10),rgba(63,184,135,.02) 55%), var(--bg-2); box-shadow:0 0 0 1px rgba(63,184,135,.18), 0 30px 60px -30px rgba(63,184,135,.35);}
.plan-top{padding-bottom:24px; border-bottom:1px solid var(--line); margin-bottom:22px;}
.plan-name{display:flex; align-items:center; gap:10px; margin:0; font-weight:500; font-size:20px; letter-spacing:-.01em;}
.plan-badge{font:500 11px 'Geist Mono',monospace; text-transform:uppercase; letter-spacing:.06em; color:var(--accent-2); border:1px solid rgba(63,184,135,.45); border-radius:3px; padding:2px 7px;}
.plan-for{margin:6px 0 0; color:var(--muted); font-size:15px; min-height:3.2em;}
@media (max-width:980px){ .plan-for{min-height:0;} }
.price{display:flex; align-items:baseline; gap:10px; margin:22px 0 0;}
.price b{font-weight:300; font-size:56px; line-height:1; letter-spacing:-.045em;}
.price span{color:var(--dim); font:13px 'Geist Mono',monospace;}
.plan-machines{margin:14px 0 22px; font-weight:500; font-size:15px; color:var(--accent-2);}
.plan-top .btn{width:100%;}
.plan-intro{margin:0 0 4px; font:500 12px 'Geist Mono',monospace; text-transform:uppercase; letter-spacing:.06em; color:var(--dim);}
.plan .points{margin-top:12px;}
.plan .points li span{display:block; color:var(--dim); font-size:14px;}
.plan-org{display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap; margin-top:16px; border:1px solid var(--line); border-radius:8px; padding:26px 28px; background:var(--bg-2);}
.plan-org .tag{margin-bottom:12px;}
.plan-org p{margin:8px 0 0; color:var(--muted); font-size:15px; max-width:620px;}
.compare table{min-width:640px;}
.compare th{white-space:nowrap;}
.compare thead th:not(:first-child), .compare td:not(:first-child){text-align:center; width:18%;}
.compare thead th.hl{color:var(--accent-2);}
.compare td:first-child{white-space:normal; color:var(--text);}
.compare tr.group th{background:transparent; color:var(--accent-2); padding-top:22px; border-bottom:1px solid var(--line);}
.compare tbody:first-of-type tr.group th{padding-top:13px;}
.compare tbody tr:last-child td{border-bottom:1px solid var(--line);}
.compare tbody:last-of-type tr:last-child td{border-bottom:0;}
.compare td.yes{color:var(--accent-2); font-weight:500;}
.compare td.no{color:var(--dim);}
.sr{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap;}
[data-theme=light] .plan.featured{box-shadow:0 0 0 1px rgba(31,122,92,.25), 0 30px 60px -30px rgba(31,122,92,.35);}
.plan-note{margin:-14px 0 22px; color:var(--dim); font-size:13.5px;}