@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&display=swap');

:root { --bg:#f7f8f5; --panel:#fff; --ink:#17201e; --muted:#66716d; --line:#dde3df; --soft:#eef2ef; --accent:#e85d3f; --accent-dark:#b53c29; --teal:#167d73; --danger:#c0392b; --code:#10161f; --code-ink:#dce8e3; --shadow:0 18px 55px rgba(23,32,30,.08); }
:root.dark { --bg:#0c1114; --panel:#131b1c; --ink:#edf4f0; --muted:#9aaba4; --line:#2a3735; --soft:#1b2726; --accent:#ff7658; --accent-dark:#ff9b83; --teal:#55c7b8; --danger:#ff6b6b; --code:#0a1015; --code-ink:#dce8e3; --shadow:0 18px 55px rgba(0,0,0,.22); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--bg); color:var(--ink); font:15px/1.65 Manrope,system-ui,sans-serif; }
a { color:inherit; text-decoration:none; }
code, kbd, pre { font-family:'DM Mono',ui-monospace,monospace; }
code { color:var(--teal); font-size:.9em; }
.topbar { height:76px; padding:0 4.5vw; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); background:color-mix(in srgb,var(--bg) 90%,transparent); backdrop-filter:blur(18px); position:sticky; top:0; z-index:5; }
.brand { display:flex; gap:11px; align-items:center; letter-spacing:-.02em; }
.brand-logo { display:block; width:34px; height:34px; object-fit:contain; }
.brand strong { display:block; font-size:15px; line-height:1.1; }.brand small { display:block; color:var(--muted); font-size:10px; letter-spacing:.04em; margin-top:3px; }
.top-actions { display:flex; align-items:center; gap:13px; }.search { width:240px; display:flex; align-items:center; gap:8px; background:var(--panel); border:1px solid var(--line); border-radius:9px; padding:7px 9px; color:var(--muted); }.search input { width:100%; border:0; outline:0; color:var(--ink); background:transparent; font:12px 'DM Mono',monospace; }.search kbd { font-size:10px; border:1px solid var(--line); border-radius:4px; padding:1px 4px; }.icon-button { border:1px solid var(--line); color:var(--ink); background:var(--panel); border-radius:8px; height:34px; width:34px; cursor:pointer; font-size:17px; }.lang-toggle { width:auto; padding:0 11px; font-size:11px; font-weight:700; font-family:'DM Mono',monospace; letter-spacing:.03em; }.github-link { color:var(--muted); font-size:12px; font-weight:700; }.github-link:hover { color:var(--accent); }.github-link[aria-current="page"] { color:var(--ink); text-decoration:underline; text-decoration-color:var(--accent); text-decoration-thickness:2px; text-underline-offset:6px; }
.layout { display:grid; grid-template-columns:220px minmax(0,850px); gap:65px; max-width:1160px; margin:0 auto; padding:65px 30px 80px; }.sidebar { position:sticky; top:125px; align-self:start; height:calc(100vh - 170px); display:flex; flex-direction:column; }.eyebrow { color:var(--muted); font:500 10px/1.2 'DM Mono',monospace; letter-spacing:.13em; margin:0 0 15px; }.accent { color:var(--accent); }.sidebar nav { display:grid; gap:3px; }.nav-link { color:var(--muted); font-size:12px; padding:7px 10px; border-left:2px solid transparent; transition:.2s; }.nav-link:hover,.nav-link.active { color:var(--ink); border-color:var(--accent); background:var(--soft); }.sidebar-note { margin-top:auto; display:flex; gap:9px; align-items:flex-start; border-top:1px solid var(--line); padding:17px 10px 0; color:var(--muted); font-size:11px; }.sidebar-note small { font-size:9px; line-height:1.35; }.status-dot,.pulse { width:7px; height:7px; border-radius:50%; background:#43b77c; display:inline-block; margin-top:7px; box-shadow:0 0 0 4px rgba(67,183,124,.12); }
.content { min-width:0; }.doc-section { scroll-margin-top:105px; margin-bottom:125px; }.hero { min-height:560px; display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); align-items:center; gap:42px; margin-bottom:120px; }.hero h1 { font-size:clamp(42px,6vw,72px); line-height:1.01; letter-spacing:-.065em; margin:0 0 25px; font-weight:800; }.hero h1 em { color:var(--accent); font-style:normal; }.lead { color:var(--muted); font-size:17px; max-width:410px; line-height:1.7; }.hero-actions { display:flex; gap:11px; flex-wrap:wrap; margin-top:30px; }.button { display:inline-flex; gap:10px; align-items:center; border-radius:8px; padding:10px 15px; font-size:12px; font-weight:800; border:1px solid var(--line); }.button.primary { background:var(--accent); color:#fff; border-color:var(--accent); }.button.primary:hover { background:var(--accent-dark); }.button.secondary { background:var(--panel); }.hero-card { min-width:0; background:var(--code); border-radius:14px; box-shadow:var(--shadow); overflow:hidden; transform:rotate(1.2deg); }.window-bar { height:38px; display:flex; align-items:center; gap:6px; padding:0 14px; color:#768782; border-bottom:1px solid #273139; font:10px 'DM Mono',monospace; }.window-bar span { width:7px; height:7px; border-radius:50%; background:#e35c4d; }.window-bar span:nth-child(2){background:#e8af4e}.window-bar span:nth-child(3){background:#56b77d}.window-bar b { margin-left:10px; font-weight:400; }.hero-card .code-block { min-width:0; width:100%; border-radius:0; min-height:275px; overflow-x:auto; }.hero-card-foot { color:#6b8179; font:10px 'DM Mono',monospace; padding:12px 18px 16px; }.hero-card-foot .pulse { margin:0 8px 1px 0; }
.section-heading { max-width:690px; margin-bottom:32px; }.section-heading h2 { font-size:36px; letter-spacing:-.045em; line-height:1.1; margin:0 0 12px; }.section-heading p:not(.eyebrow) { color:var(--muted); max-width:650px; margin:0; }.section-body { min-width:0; }.callout { display:flex; align-items:center; gap:14px; flex-wrap:wrap; border:1px solid var(--line); border-left:3px solid var(--accent); padding:13px 15px; background:var(--panel); margin-bottom:17px; font-size:12px; }.callout strong { font-size:12px; }.callout span { color:var(--muted); font:10px 'DM Mono',monospace; }.callout code { flex-basis:100%; min-width:0; color:var(--teal); font-size:10px; overflow:auto; }
.code-wrap { position:relative; }.code-block { overflow:auto; margin:0; padding:21px 22px; border-radius:10px; background:var(--code); color:var(--code-ink); font:12px/1.75 'DM Mono',monospace; tab-size:4; }.code-block code { color:inherit; font-size:inherit; }.copy-button { position:absolute; right:9px; top:9px; z-index:1; border:1px solid #34464a; background:#19242a; color:#98aaa6; border-radius:5px; padding:4px 7px; cursor:pointer; font:10px 'DM Mono',monospace; }.copy-button:hover { color:#fff; }.inline-code { display:flex; gap:12px; align-items:center; margin-top:12px; font-size:11px; }.inline-code span { color:var(--muted); font:10px 'DM Mono',monospace; }.inline-code code { color:var(--ink); background:var(--soft); padding:5px 8px; border-radius:5px; }
.card-grid { display:grid; gap:12px; }.card-grid.three { grid-template-columns:repeat(3,1fr); }.card-grid.four { grid-template-columns:repeat(4,1fr); }.info-card { background:var(--panel); border:1px solid var(--line); padding:20px; min-height:150px; border-radius:10px; }.info-card.accent-card { border-top:2px solid var(--accent); }.card-icon { color:var(--accent); font:20px 'DM Mono',monospace; }.info-card h3 { font-size:14px; margin:14px 0 5px; }.info-card p { color:var(--muted); font-size:12px; margin:0; }.syntax-columns { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:35px; }.syntax-columns h3 { font-size:13px; margin:0 0 10px; }.syntax-columns .code-block { font-size:10px; }
.reference-table { border:1px solid var(--line); border-radius:10px; overflow:hidden; margin:28px 0 20px; }.table-row { display:grid; grid-template-columns:1fr 1.25fr 1.2fr; gap:18px; padding:12px 15px; border-top:1px solid var(--line); font-size:11px; color:var(--muted); }.table-row:first-child { border-top:0; }.table-row code { color:var(--teal); }.table-head { background:var(--soft); color:var(--ink); font:10px 'DM Mono',monospace; text-transform:uppercase; letter-spacing:.08em; }.split-section { display:grid; grid-template-columns:1fr 1.15fr; gap:42px; align-items:start; }.split-section .section-heading { margin:0; }.muted { color:var(--muted); font-size:12px; margin:19px 0 8px; }.prompt-demo { border:1px solid var(--line); border-radius:10px; overflow:hidden; }.prompt-label { padding:9px 14px; background:var(--soft); color:var(--muted); font:10px 'DM Mono',monospace; }.prompt-demo .code-block { border-radius:0; }.tip-row { display:flex; gap:12px; align-items:flex-start; border-left:2px solid var(--teal); padding:10px 13px; margin-top:18px; background:var(--soft); }.tip-row span { color:var(--teal); font:10px 'DM Mono',monospace; font-weight:500; }.tip-row p { color:var(--muted); font-size:11px; margin:0; }.native-list { display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }.native-list span { background:var(--soft); border-radius:5px; padding:6px 9px; color:var(--muted); font:10px 'DM Mono',monospace; }.native-list b { color:var(--accent); font-weight:500; }.flow-diagram { display:flex; align-items:center; justify-content:center; gap:13px; margin:25px 0 5px; color:var(--muted); font:11px 'DM Mono',monospace; }.flow-diagram strong { background:var(--accent); color:#fff; padding:7px 11px; border-radius:5px; font-weight:500; }.flow-diagram i { color:var(--accent); font-style:normal; }.mini-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:14px; }.mini-stats div { border:1px solid var(--line); border-radius:7px; padding:10px; }.mini-stats strong,.mini-stats span { display:block; }.mini-stats strong { color:var(--accent); font:12px 'DM Mono',monospace; }.mini-stats span { color:var(--muted); font-size:10px; margin-top:3px; }.cli-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:8px; }.cli-command { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:13px 14px; border:1px solid var(--line); border-radius:7px; background:var(--panel); }.cli-command code { color:var(--teal); font-size:10px; }.cli-command span { color:var(--muted); font-size:10px; text-align:right; }.security-banner { display:flex; gap:13px; padding:15px; border:1px solid rgba(232,93,63,.28); background:color-mix(in srgb,var(--accent) 7%,var(--panel)); border-radius:9px; margin-top:18px; }.security-banner>span { display:grid; place-items:center; width:21px; height:21px; border-radius:50%; background:var(--accent); color:#fff; font-weight:800; }.security-banner strong { font-size:12px; }.security-banner p { color:var(--muted); font-size:11px; margin:3px 0 0; }.site-footer { display:flex; justify-content:space-between; gap:20px; border-top:1px solid var(--line); padding-top:25px; color:var(--muted); font-size:11px; }.site-footer a { color:var(--accent); }
/* Reference-manual page */
.ref-hero { max-width:720px; margin-bottom:60px; }.ref-hero .eyebrow { margin-bottom:18px; }.ref-hero h1 { font-size:clamp(36px,5vw,52px); line-height:1.05; letter-spacing:-.05em; margin:0 0 18px; font-weight:800; }.ref-hero .lead { max-width:640px; }
.legend { display:flex; flex-wrap:wrap; gap:10px; margin-top:24px; }.legend-item { display:flex; align-items:center; gap:8px; font-size:11px; color:var(--muted); }
.status { display:inline-flex; align-items:center; gap:6px; padding:3px 10px; border-radius:20px; font:600 10px 'DM Mono',monospace; letter-spacing:.05em; text-transform:uppercase; white-space:nowrap; }
.status::before { content:''; width:6px; height:6px; border-radius:50%; }
.status-full { color:var(--teal); background:color-mix(in srgb,var(--teal) 14%,var(--panel)); }.status-full::before { background:var(--teal); }
.status-partial { color:var(--accent); background:color-mix(in srgb,var(--accent) 14%,var(--panel)); }.status-partial::before { background:var(--accent); }
.status-gap { color:var(--danger); background:color-mix(in srgb,var(--danger) 14%,var(--panel)); }.status-gap::before { background:var(--danger); }
.feature { scroll-margin-top:105px; padding-top:56px; border-top:1px solid var(--line); margin-bottom:0; }
.feature:first-of-type { border-top:0; padding-top:0; }
.feature-head { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom:10px; }
.feature-head h2 { font-size:27px; letter-spacing:-.03em; margin:0; }
.feature-num { color:var(--muted); font:500 12px 'DM Mono',monospace; margin-right:10px; }
.feature-lede { color:var(--muted); max-width:720px; margin:0 0 26px; font-size:14px; }
.block-label { color:var(--muted); font:600 10px 'DM Mono',monospace; letter-spacing:.14em; text-transform:uppercase; margin:26px 0 11px; }
.block-label:first-of-type { margin-top:0; }
.plain-list { list-style:none; margin:0; padding:0; display:grid; gap:9px; }
.plain-list li { padding-left:16px; position:relative; font-size:13px; color:var(--ink); line-height:1.6; }
.plain-list li::before { content:'—'; position:absolute; left:0; color:var(--teal); }
.plain-list code { font-size:.85em; }
.cite { display:inline-block; color:var(--muted); font:10px 'DM Mono',monospace; background:var(--soft); padding:1px 6px; border-radius:4px; white-space:nowrap; }
.gap-box { display:flex; gap:13px; padding:15px; border:1px solid color-mix(in srgb,var(--danger) 30%,var(--line)); background:color-mix(in srgb,var(--danger) 6%,var(--panel)); border-radius:9px; margin-top:8px; }
.gap-box>span { flex-shrink:0; display:grid; place-items:center; width:21px; height:21px; border-radius:50%; background:var(--danger); color:#fff; font-weight:800; font-size:12px; }
.gap-box strong { font-size:12px; }
.gap-box .plain-list { margin-top:9px; }
.gap-box .plain-list li { color:var(--muted); font-size:12px; }
.gap-box .plain-list li::before { color:var(--danger); }
.sketch-quote { border-left:2px solid var(--danger); margin:9px 0; padding:6px 13px; color:var(--muted); font:11px/1.6 'DM Mono',monospace; background:var(--soft); }
.err-table .table-row { grid-template-columns:1.1fr 1.6fr .8fr; }
.err-table code { color:var(--ink); }
.variation-grid { display:grid; gap:14px; margin-top:8px; }
.variation { border:1px solid var(--line); border-radius:9px; padding:14px 16px; background:var(--panel); }
.variation h4 { margin:0 0 6px; font-size:12px; font-family:'DM Mono',monospace; color:var(--ink); }
.variation p { margin:0; color:var(--muted); font-size:12px; }
.crosscut { border:1px solid var(--line); border-radius:10px; padding:20px 22px; margin-top:20px; background:var(--panel); }
.crosscut h3 { margin:0 0 10px; font-size:15px; }
/* MHL syntax colors */
.tok-comment { color:#70827d; }.tok-keyword { color:#f38d74; }.tok-declaration { color:#ffb86a; }.tok-string { color:#b8d98d; }.tok-string .tok-var { color:#6fd3c2; }.tok-number { color:#d5a7f5; }.tok-boolean { color:#e6a6d7; }.tok-property { color:#7fc7e8; }.tok-function { color:#f4d17a; }.tok-variable { color:#dce8e3; }.tok-operator { color:#ef9b84; }.tok-punctuation { color:#91aaa2; }.tok-escape { color:#f1c27b; }
.tok-json-key { color:#7fc7e8; }.tok-json-string { color:#b8d98d; }.tok-json-number { color:#d5a7f5; }.tok-json-literal { color:#e6a6d7; }.tok-json-punctuation { color:#91aaa2; }
.is-hidden { display:none !important; }
@media (max-width:900px) { .layout { grid-template-columns:1fr; gap:20px; padding-top:35px; }.sidebar { position:static; height:auto; }.sidebar nav { display:flex; overflow:auto; gap:3px; padding-bottom:7px; }.nav-link { white-space:nowrap; }.sidebar-note { display:none; }.hero { grid-template-columns:1fr; min-height:0; }.hero-card { transform:none; }.split-section { grid-template-columns:1fr; gap:25px; }.topbar { padding:0 20px; }.github-link { display:none; } }
@media (max-width:600px) { .topbar { height:auto; padding:14px 17px; gap:12px; align-items:flex-start; }.top-actions { flex:1; justify-content:flex-end; }.search { width:auto; flex:1; }.search kbd { display:none; }.layout { padding:30px 17px 60px; }.hero h1 { font-size:46px; }.hero { margin-bottom:85px; }.doc-section { margin-bottom:90px; }.section-heading h2 { font-size:30px; }.card-grid.three,.syntax-columns,.cli-grid { grid-template-columns:1fr; }.table-row { grid-template-columns:1fr 1.2fr; }.table-row span:last-child { display:none; }.err-table .table-row { grid-template-columns:1fr; }.err-table .table-row span:last-child { display:block; }.feature-head { align-items:flex-start; }.flow-diagram { gap:7px; font-size:9px; }.site-footer { flex-direction:column; }.code-block { font-size:10px; padding:17px 15px; } }

/* Product page */
.hero-proof { display:flex; flex-wrap:wrap; gap:7px; margin-top:22px; }
.hero-proof span { border:1px solid var(--line); color:var(--muted); background:var(--panel); border-radius:999px; padding:4px 9px; font:9px 'DM Mono',monospace; text-transform:uppercase; letter-spacing:.07em; }
.principle-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:13px; }
.principle-card { min-height:210px; padding:22px; border:1px solid var(--line); border-radius:11px; background:var(--panel); }
.principle-card>span { color:var(--accent); font:500 10px 'DM Mono',monospace; }
.principle-card h3 { margin:36px 0 8px; font-size:15px; }
.principle-card p { color:var(--muted); font-size:12px; margin:0; }
.thesis-strip { display:grid; grid-template-columns:150px 1fr; gap:20px; align-items:start; margin-top:16px; padding:20px 22px; border-radius:10px; color:#dce8e3; background:var(--code); }
.thesis-strip strong { color:#ff8c70; font:500 10px 'DM Mono',monospace; text-transform:uppercase; letter-spacing:.1em; }
.thesis-strip p { margin:0; font-size:13px; }
.comparison { border:1px solid var(--line); border-radius:11px; overflow:hidden; }
.comparison-row { display:grid; grid-template-columns:.8fr 1.15fr 1.15fr; gap:20px; padding:14px 16px; border-top:1px solid var(--line); font-size:11px; color:var(--muted); }
.comparison-row:first-child { border-top:0; }
.comparison-row strong { color:var(--ink); font-size:11px; }
.comparison-row span:last-child { color:var(--ink); }
.comparison-head { background:var(--soft); color:var(--ink); font:500 9px 'DM Mono',monospace; text-transform:uppercase; letter-spacing:.08em; }
.install-tabs { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:9px; margin-bottom:17px; }
.install-tabs .callout { margin:0; align-content:start; min-width:0; }
.install-tabs .callout code { overflow-wrap:anywhere; }
.run-stack { display:grid; gap:7px; margin-top:13px; }
.run-stack .inline-code { margin:0; }
.architecture-flow { display:grid; grid-template-columns:1fr auto 1fr auto 1fr; gap:12px; align-items:center; margin:30px 0; }
.architecture-flow>div { display:flex; flex-direction:column; min-height:145px; padding:18px; border:1px solid var(--line); border-radius:10px; background:var(--panel); }
.architecture-flow>div.active { border-color:color-mix(in srgb,var(--accent) 55%,var(--line)); background:color-mix(in srgb,var(--accent) 5%,var(--panel)); }
.architecture-flow small { color:var(--accent); font:9px 'DM Mono',monospace; letter-spacing:.1em; }
.architecture-flow strong { margin:28px 0 6px; font:500 11px 'DM Mono',monospace; }
.architecture-flow span { color:var(--muted); font-size:10px; }
.architecture-flow i { color:var(--accent); font-style:normal; }
.architecture-flow-four { grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr); gap:9px; }
.architecture-flow-four>div { min-width:0; padding:16px; }
.architecture-flow-four strong { overflow-wrap:anywhere; }
.extension-intro-grid>* { min-width:0; }
.extension-intro-grid .code-block { max-width:100%; }
.extension-intro-grid .code-block+.code-block { margin-top:12px; }
#extensions>.next-steps { margin-top:24px; }
.server-grid { grid-template-columns:repeat(3,minmax(0,1fr)); align-items:stretch; }
.server-card { min-width:0; display:flex; flex-direction:column; }
.server-card p { margin-bottom:18px; }
.server-card .code-block { width:100%; margin-top:auto; padding:14px; font-size:9px; line-height:1.55; white-space:pre-wrap; overflow-wrap:anywhere; word-break:break-word; }
#servers>.security-banner { margin-top:16px; }
#servers>.next-steps { margin-top:12px; }
.concept-note { padding:18px; border:1px solid var(--line); border-radius:10px; background:var(--panel); }
.concept-note b { font-size:13px; }
.concept-note p { color:var(--muted); font-size:11px; }
.concept-note>code { display:block; padding:8px; border-radius:5px; background:var(--soft); font-size:9px; overflow:auto; }
.feature-catalog { display:grid; grid-template-columns:repeat(3,1fr); gap:11px; }
.feature-card { position:relative; min-height:190px; padding:19px; border:1px solid var(--line); border-radius:10px; background:var(--panel); transition:transform .2s,border-color .2s,box-shadow .2s; }
.feature-card:hover { transform:translateY(-2px); border-color:color-mix(in srgb,var(--accent) 50%,var(--line)); box-shadow:var(--shadow); }
.feature-card>span { color:var(--muted); font:9px 'DM Mono',monospace; }
.feature-card h3 { margin:28px 0 7px; font-size:15px; }
.feature-card p { color:var(--muted); font-size:11px; margin:0 0 22px; }
.feature-card b { position:absolute; bottom:17px; color:var(--accent); font:500 9px 'DM Mono',monospace; text-transform:uppercase; letter-spacing:.05em; }
.example-steps { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-top:14px; }
.example-steps div { padding:12px; border:1px solid var(--line); border-radius:8px; background:var(--panel); }
.example-steps span { display:grid; place-items:center; width:21px; height:21px; border-radius:50%; color:#fff; background:var(--accent); font:9px 'DM Mono',monospace; }
.example-steps p { color:var(--muted); font-size:10px; margin:9px 0 0; }
.example-steps strong { color:var(--ink); }
.research-section { padding:32px; border:1px solid var(--line); border-radius:14px; background:var(--panel); }
.paper-card { display:grid; grid-template-columns:72px 1fr; gap:20px; align-items:start; margin:25px 0; padding:22px; border:1px solid var(--line); border-radius:10px; background:var(--bg); }
.paper-mark { display:grid; place-items:center; aspect-ratio:1; border-radius:50%; color:#fff; background:var(--accent); font:600 12px 'DM Mono',monospace; }
.paper-card h3 { max-width:600px; margin:5px 0 10px; font-size:17px; line-height:1.45; }
.paper-card p:not(.eyebrow) { color:var(--muted); font-size:11px; margin:0 0 7px; }
.paper-card a { color:var(--teal); font:10px 'DM Mono',monospace; }
.contribution-panel { display:grid; grid-template-columns:1fr 1.15fr; gap:16px; }
.contributor-list { display:grid; gap:12px; }
.creator-card,.contribution-copy { padding:24px; border:1px solid var(--line); border-radius:11px; background:var(--panel); }
.creator-card { display:flex; align-items:center; gap:17px; }
.contributor-avatar { display:block; flex:0 0 64px; width:64px; height:64px; object-fit:cover; border-radius:50%; }
.creator-monogram { display:grid; flex:0 0 64px; place-items:center; aspect-ratio:1; border-radius:50%; color:#fff; background:var(--code); font:500 17px 'DM Mono',monospace; }
.contributor-placeholder { border-style:dashed; }
.contributor-placeholder .creator-monogram { color:var(--accent); background:var(--soft); }
.creator-card small { color:var(--accent); font:9px 'DM Mono',monospace; letter-spacing:.1em; }
.creator-card h3,.contribution-copy h3 { margin:4px 0 5px; font-size:16px; }
.creator-card p,.contribution-copy p { color:var(--muted); font-size:11px; margin:0; }
.contributor-links { display:flex; flex-wrap:wrap; gap:10px; margin-top:11px; }
.contributor-links a { color:var(--teal); font:10px 'DM Mono',monospace; }
.contributor-links a:hover { color:var(--accent); }
.contribution-copy .button { margin-top:18px; }

/* Public reference */
.reference-content .feature { padding-bottom:74px; }
.quick-index { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-top:28px; }
.quick-index a { display:flex; flex-direction:column; padding:13px; border:1px solid var(--line); border-radius:8px; background:var(--panel); }
.quick-index a:hover { border-color:var(--accent); }
.quick-index span { color:var(--muted); font-size:9px; margin-top:4px; }
.file-example { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.file-example>div { min-width:0; border:1px solid var(--line); border-radius:10px; overflow:hidden; }
.file-example>div>span { display:block; padding:8px 12px; color:var(--muted); background:var(--soft); font:9px 'DM Mono',monospace; }
.file-example .code-block { min-height:100%; border-radius:0; font-size:10px; }
.grammar-block { overflow:auto; margin:0; padding:18px 20px; border:1px solid var(--line); border-radius:10px; color:var(--ink); background:var(--panel); font:10px/1.8 'DM Mono',monospace; }
.operator-line { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-bottom:13px; padding:13px; border:1px solid var(--line); border-radius:8px; background:var(--panel); }
.operator-line code { color:var(--ink); padding:3px 6px; border-radius:4px; background:var(--soft); }
.operator-line i { color:var(--accent); font-style:normal; }
.method-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:9px; margin-bottom:20px; }
.method-grid article { padding:16px; border:1px solid var(--line); border-radius:9px; background:var(--panel); }
.method-grid h3 { margin:0 0 8px; font-size:12px; }
.method-grid code { display:inline-block; margin:3px 3px 3px 0; padding:3px 6px; border-radius:4px; background:var(--soft); font-size:9px; }
.method-grid p { color:var(--muted); font-size:10px; margin:7px 0 0; }
.native-reference { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; margin-bottom:20px; }
.native-reference article { padding:15px; border:1px solid var(--line); border-radius:9px; background:var(--panel); }
.native-reference h3 { margin:0 0 8px; font-size:12px; }
.native-reference p { color:var(--muted); font-size:9px; margin:4px 0; }
.pipeline-anatomy { display:grid; grid-template-columns:repeat(2,1fr); gap:8px; margin-top:18px; }
.pipeline-anatomy div { display:grid; grid-template-columns:80px 1fr; gap:10px; padding:12px; border:1px solid var(--line); border-radius:8px; background:var(--panel); }
.pipeline-anatomy span { color:var(--muted); font-size:10px; }
.assertion-cloud { display:flex; flex-wrap:wrap; gap:7px; margin-top:15px; }
.assertion-cloud code { padding:5px 8px; border:1px solid var(--line); border-radius:5px; background:var(--panel); font-size:9px; }
.checklist { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.checklist div { display:flex; gap:10px; padding:13px; border:1px solid var(--line); border-radius:8px; background:var(--panel); }
.checklist span { color:var(--teal); font-weight:800; }
.checklist p { color:var(--muted); font-size:10px; margin:0; }

@media (min-width:901px) and (max-width:1050px) {
  .architecture-flow-four { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .architecture-flow-four i { display:none; }
}

@media (max-width:900px) {
  .principle-grid,.feature-catalog,.card-grid.four { grid-template-columns:repeat(2,1fr); }
  .example-steps { grid-template-columns:repeat(2,1fr); }
  .architecture-flow,.architecture-flow-four { grid-template-columns:1fr; }
  .architecture-flow i { transform:rotate(90deg); justify-self:center; }
  .architecture-flow-four { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .architecture-flow-four i { display:none; }
  .server-grid { grid-template-columns:1fr; }
  .server-card .code-block { font-size:10px; }
  .quick-index { grid-template-columns:repeat(2,1fr); }
}

@media (max-width:600px) {
  .principle-grid,.feature-catalog,.file-example,.method-grid,.native-reference,.pipeline-anatomy,.checklist,.contribution-panel,.card-grid.four { grid-template-columns:1fr; }
  .architecture-flow-four { grid-template-columns:1fr; }
  .install-tabs { grid-template-columns:minmax(0,1fr); }
  .comparison { overflow-x:auto; }
  .comparison-row { min-width:650px; }
  .comparison-row span:last-child { display:block; }
  .thesis-strip { grid-template-columns:1fr; gap:8px; }
  .example-steps { grid-template-columns:1fr 1fr; }
  .research-section { padding:20px 15px; }
  .paper-card { grid-template-columns:48px 1fr; padding:15px; }
  .creator-card { align-items:flex-start; }
  .reference-table { overflow-x:auto; }
  .table-row { min-width:600px; grid-template-columns:1fr 1.25fr 1.2fr; }
  .table-row span:last-child { display:block; }
}

/* How-it-works page */
.how-content .section-heading { max-width:720px; }
.how-hero { min-height:530px; display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:55px; margin-bottom:115px; }
.how-hero h1 { font-size:clamp(43px,6vw,68px); line-height:1.02; letter-spacing:-.065em; margin:0 0 23px; font-weight:800; }
.how-hero h1 em { color:var(--accent); font-style:normal; }
.orientation-card { position:relative; padding:30px; border:1px solid var(--line); border-radius:14px; background:var(--panel); box-shadow:var(--shadow); }
.orientation-card::before { content:''; position:absolute; top:0; left:26px; right:26px; height:3px; background:var(--accent); border-radius:0 0 4px 4px; }
.orientation-top { color:var(--accent); font:500 10px 'DM Mono',monospace; letter-spacing:.12em; }
.orientation-top .pulse { margin:0 8px 1px 0; }
.orientation-card p { max-width:280px; margin:35px 0 0; font-size:20px; line-height:1.3; letter-spacing:-.03em; }
.orientation-card p:nth-of-type(2) { margin-top:17px; }
.orientation-arrow { color:var(--accent); font:24px 'DM Mono',monospace; margin-top:17px; }
.orientation-rule { height:1px; margin-top:32px; background:var(--line); }
.orientation-caption { display:block; color:var(--muted); font:10px 'DM Mono',monospace; margin-top:13px; }
.anatomy-diagram { display:flex; align-items:stretch; gap:8px; margin:32px 0 0; overflow-x:auto; padding:2px 1px 8px; }
.diagram-node { flex:1 0 106px; min-height:136px; display:flex; flex-direction:column; padding:15px 13px; border:1px solid var(--line); border-radius:9px; background:var(--panel); }
.diagram-node small { color:var(--accent); font:9px 'DM Mono',monospace; letter-spacing:.08em; }
.diagram-node strong { margin:auto 0 7px; font:500 11px/1.35 'DM Mono',monospace; }
.diagram-node span { color:var(--muted); font-size:10px; line-height:1.35; }
.diagram-node.active-node { border-color:color-mix(in srgb,var(--accent) 55%,var(--line)); background:color-mix(in srgb,var(--accent) 6%,var(--panel)); }
.diagram-node.file-node { border-top:3px solid var(--teal); }
.diagram-node.result-node { border-top:3px solid var(--teal); }
.diagram-connector { display:grid; place-items:center; flex:0 0 15px; color:var(--accent); font:14px 'DM Mono',monospace; }
.diagram-caption { display:flex; gap:14px; align-items:flex-start; margin-top:8px; padding:12px 14px; background:var(--soft); border-left:2px solid var(--teal); }
.diagram-caption span { color:var(--teal); font:10px 'DM Mono',monospace; white-space:nowrap; }
.diagram-caption p { color:var(--muted); margin:0; font-size:11px; }
.runtime-timeline { display:grid; gap:10px; }
.runtime-timeline article { display:grid; grid-template-columns:38px 1fr; gap:15px; align-items:start; }
.runtime-timeline article>span { display:grid; place-items:center; width:30px; height:30px; border-radius:50%; color:#fff; background:var(--accent); font:10px 'DM Mono',monospace; }
.runtime-timeline article>div { padding:15px 17px; border:1px solid var(--line); border-radius:9px; background:var(--panel); }
.runtime-timeline h3 { margin:0 0 4px; font-size:14px; }
.runtime-timeline p { color:var(--muted); font-size:11px; margin:0 0 9px; }
.runtime-timeline code { display:inline-block; padding:5px 7px; border-radius:4px; background:var(--soft); font-size:9px; }
.loop-diagram { padding:18px; border:1px solid var(--line); border-radius:12px; background:var(--panel); }
.harness-label { display:flex; justify-content:center; padding-bottom:9px; border-bottom:1px solid var(--line); color:var(--teal); font:9px 'DM Mono',monospace; letter-spacing:.11em; }
.loop-main-flow { display:grid; grid-template-columns:1fr 22px 1fr 22px 1fr; gap:9px; align-items:center; padding:16px 0; }
.flow-arrow { color:var(--accent); font:15px 'DM Mono',monospace; font-style:normal; text-align:center; }
.loop-node { min-height:105px; display:flex; flex-direction:column; padding:14px; border:1px solid var(--line); border-radius:8px; background:var(--bg); }
.loop-node small { color:var(--muted); font:10px 'DM Mono',monospace; }
.loop-node strong { margin:auto 0 5px; font:500 12px 'DM Mono',monospace; }
.loop-node span { color:var(--muted); font-size:10px; line-height:1.35; }
.loop-node.verify { border-color:color-mix(in srgb,var(--teal) 55%,var(--line)); }
.loop-node.decision { border-color:color-mix(in srgb,var(--accent) 55%,var(--line)); }
.loop-outcomes { display:grid; grid-template-columns:.82fr 1.18fr; gap:10px; }
.outcome-card { min-height:158px; padding:13px; border:1px solid var(--line); border-radius:8px; }
.outcome-heading { display:flex; justify-content:space-between; gap:8px; align-items:baseline; flex-wrap:wrap; font:10px 'DM Mono',monospace; }
.outcome-heading b { font-weight:500; }
.outcome-heading span { color:var(--muted); }
.success-outcome { color:var(--teal); background:color-mix(in srgb,var(--teal) 8%,var(--panel)); }
.outcome-arrow { margin-top:28px; color:var(--teal); font:27px 'DM Mono',monospace; text-align:center; }
.retry-outcome { color:var(--accent); background:color-mix(in srgb,var(--accent) 6%,var(--panel)); }
.recovery-flow { display:grid; grid-template-columns:1fr 18px 1fr 18px 1fr; gap:7px; align-items:center; margin-top:12px; }
.agent-node { background:var(--code); border-color:var(--code); color:var(--code-ink); }
.loop-node.agent-node span,.loop-node.agent-node small { color:#8ea59d; }
.apply-node { min-height:105px; }
.loop-return { display:flex; flex-direction:column; gap:4px; padding:10px 8px; border:1px dashed var(--teal); border-radius:7px; color:var(--teal); }
.loop-return strong { font:500 10px/1.35 'DM Mono',monospace; }
.loop-return span { color:var(--muted); font-size:9px; }
.harness-policies { display:flex; flex-wrap:wrap; justify-content:center; gap:7px; margin-top:12px; padding-top:12px; border-top:1px solid var(--line); }
.harness-policies span { padding:4px 7px; border-radius:4px; background:var(--soft); color:var(--muted); font:9px 'DM Mono',monospace; letter-spacing:.06em; }
.how-content .example-steps { margin-top:14px; }
.guarantee-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
.guarantee-grid article { min-height:170px; padding:18px; border:1px solid var(--line); border-radius:10px; background:var(--panel); }
.guarantee-grid span { color:var(--accent); font:10px 'DM Mono',monospace; }
.guarantee-grid h3 { margin:30px 0 7px; font-size:13px; }
.guarantee-grid p { color:var(--muted); font-size:11px; line-height:1.5; margin:0; }
.next-steps { display:flex; flex-wrap:wrap; align-items:center; gap:9px 18px; margin-top:16px; padding:15px 17px; border:1px solid var(--line); border-radius:9px; background:var(--soft); }
.next-steps strong { color:var(--muted); font:10px 'DM Mono',monospace; letter-spacing:.1em; }
.next-steps a { color:var(--accent); font-size:11px; font-weight:700; }

@media (max-width:900px) {
  .how-hero { grid-template-columns:1fr; min-height:0; gap:30px; }
  .guarantee-grid { grid-template-columns:repeat(2,1fr); }
  .loop-main-flow { grid-template-columns:1fr 18px 1fr 18px 1fr; }
  .loop-outcomes { grid-template-columns:1fr 1.4fr; }
}

@media (max-width:600px) {
  .guarantee-grid { grid-template-columns:1fr 1fr; }
  .loop-diagram { padding-left:14px; padding-right:14px; }
  .loop-main-flow { grid-template-columns:1fr; gap:7px; }
  .loop-main-flow .flow-arrow { transform:rotate(90deg); }
  .loop-outcomes { grid-template-columns:1fr; }
  .recovery-flow { grid-template-columns:1fr 18px 1fr 18px 1fr; }
  .diagram-caption { flex-direction:column; gap:5px; }
}

/* Legibility scale
 * Keep small interface labels compact without letting essential copy fall
 * below a comfortable reading size.
 */
body { font-size:17px; line-height:1.7; }
.brand strong { font-size:16px; }
.brand small,
.search kbd,
.sidebar-note small { font-size:11px; }
.search input,
.github-link,
.lang-toggle,
.nav-link { font-size:13px; }
.eyebrow { font-size:12px; }
.sidebar-note { font-size:13px; }
.lead { font-size:18px; }
.button { font-size:14px; }
.window-bar,
.hero-card-foot { font-size:12px; }
.callout,
.callout strong { font-size:14px; }
.callout span,
.callout code { font-size:12px; }
.code-block { font-size:14px; line-height:1.75; }
.copy-button { font-size:11px; }
.inline-code { font-size:14px; }
.inline-code span { font-size:12px; }
.info-card h3,
.syntax-columns h3 { font-size:16px; }
.info-card p,
.muted { font-size:14px; }
.syntax-columns .code-block { font-size:13px; }
.table-row { font-size:13px; line-height:1.55; }
.table-head { font-size:12px; }
.prompt-label,
.tip-row span,
.native-list span { font-size:12px; }
.tip-row p { font-size:13px; line-height:1.6; }
.flow-diagram { font-size:13px; }
.mini-stats strong { font-size:14px; }
.mini-stats span { font-size:12px; }
.cli-command code,
.cli-command span { font-size:12px; }
.security-banner strong { font-size:14px; }
.security-banner p { font-size:13px; }
.site-footer { font-size:13px; }
.legend-item { font-size:13px; }
.feature-lede { font-size:16px; line-height:1.7; }
.plain-list li { font-size:15px; }
.gap-box strong,
.gap-box .plain-list li,
.variation h4,
.variation p { font-size:14px; }
.crosscut h3 { font-size:17px; }
.hero-proof span,
.principle-card>span,
.thesis-strip strong { font-size:11px; }
.principle-card h3 { font-size:17px; }
.principle-card p,
.thesis-strip p { font-size:14px; }
.comparison-row,
.comparison-row strong { font-size:13px; }
.comparison-head { font-size:11px; }
.architecture-flow small { font-size:11px; }
.architecture-flow strong { font-size:13px; }
.architecture-flow span { font-size:12px; line-height:1.5; }
.server-card .code-block { font-size:12px; }
.concept-note b { font-size:15px; }
.concept-note p { font-size:13px; }
.concept-note>code { font-size:12px; }
.feature-card>span,
.feature-card b { font-size:11px; }
.feature-card h3 { font-size:17px; }
.feature-card p { font-size:13px; }
.example-steps span { font-size:11px; }
.example-steps p { font-size:13px; line-height:1.55; }
.paper-card p:not(.eyebrow) { font-size:13px; }
.paper-card a,
.creator-card small,
.contributor-links a { font-size:12px; }
.creator-card p,
.contribution-copy p { font-size:13px; }
.quick-index span,
.file-example>div>span { font-size:12px; }
.file-example .code-block,
.grammar-block { font-size:13px; }
.method-grid h3,
.native-reference h3 { font-size:15px; }
.method-grid code,
.assertion-cloud code { font-size:12px; }
.method-grid p,
.native-reference p,
.pipeline-anatomy span,
.checklist p { font-size:13px; line-height:1.55; }
.orientation-top,
.orientation-caption { font-size:12px; }
.diagram-node small { font-size:11px; }
.diagram-node strong { font-size:13px; }
.diagram-node span,
.diagram-caption span { font-size:12px; }
.diagram-caption p { font-size:13px; }
.runtime-timeline article>span { font-size:11px; }
.runtime-timeline h3 { font-size:16px; }
.runtime-timeline p { font-size:13px; }
.runtime-timeline code,
.harness-label { font-size:11px; }
.loop-node small,
.loop-node span,
.outcome-heading { font-size:12px; }
.loop-node strong { font-size:13px; }
.loop-return strong,
.harness-policies span,
.guarantee-grid span,
.next-steps strong { font-size:11px; }
.loop-return span { font-size:12px; }
.guarantee-grid h3 { font-size:15px; }
.guarantee-grid p,
.next-steps a { font-size:13px; }

@media (max-width:600px) {
  body { font-size:16px; }
  .code-block,
  .file-example .code-block,
  .grammar-block { font-size:13px; }
  .flow-diagram { font-size:12px; }
}
