:root{--ink:#1d2621;--muted:#5f6a63;--line:#dfe4dc;--bg:#f4f5f0;--card:#fff;--accent:#1f4f3b;--soft:#e8f0e8;--code:#f6f8f4;
font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);background:var(--bg);line-height:1.6}
@media (prefers-color-scheme:dark){:root{--ink:#e6ece8;--muted:#9fa9a2;--line:#2b3430;--bg:#131916;--card:#1a221e;--accent:#8fd0a8;--soft:#22302a;--code:#17201b}}
*{box-sizing:border-box}body{margin:0;background:var(--bg)}
.top{max-width:1120px;margin:auto;padding:22px 24px;display:flex;justify-content:space-between;align-items:center;gap:16px;border-bottom:1px solid var(--line)}
.brand{font-weight:760;letter-spacing:-1.6px;font-size:28px;color:inherit;text-decoration:none}.dot{color:#54925e}
nav{display:flex;gap:18px;flex-wrap:wrap}nav a{color:var(--muted);text-decoration:none;font-size:14px}nav a:hover{color:var(--ink)}
main{max-width:1120px;margin:auto;padding:0 24px}
.hero{padding:72px 0 56px;max-width:820px}
.pill{display:inline-block;font-size:12px;font-weight:650;letter-spacing:.4px;padding:5px 11px;border-radius:999px;background:var(--soft);color:var(--accent);margin:0 0 18px}
h1{font-size:clamp(40px,7vw,76px);line-height:1.02;letter-spacing:-2.6px;margin:0 0 22px;font-weight:680}
h2{font-size:24px;letter-spacing:-.6px;margin:0 0 12px;line-height:1.25}h3{font-size:16px;margin:0 0 8px}
.lede{font-size:19px;color:var(--muted);max-width:680px;margin:0 0 12px}.lede.small{font-size:15px}
.eyebrow{font-size:11.5px;font-weight:700;letter-spacing:1.7px;color:var(--muted);margin:0 0 16px}
.band{padding:52px 0;border-top:1px solid var(--line)}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.cards.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.cards article{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:24px}
.cards p,.split p,.intro{color:var(--muted);font-size:15px;margin:0 0 12px}
.split{display:grid;grid-template-columns:1.1fr 1fr;gap:32px;align-items:start}
code,pre{font:13px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace}
p code,td code,li code{background:var(--code);border:1px solid var(--line);border-radius:5px;padding:1px 5px;overflow-wrap:anywhere}
.record{background:var(--code);border:1px solid var(--line);border-radius:12px;padding:18px;margin:0;white-space:pre-wrap;overflow-wrap:anywhere}
.note{font-size:13px;color:var(--muted);margin:18px 0 0}
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:14px;background:var(--card)}
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{text-align:left;padding:12px 16px;border-bottom:1px solid var(--line);vertical-align:top}
thead th{font-size:12px;letter-spacing:.5px;color:var(--muted);text-transform:uppercase}
tbody th{font-weight:600;width:30%}tbody tr:last-child th,tbody tr:last-child td{border-bottom:0}
.checks{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:12px 28px}
.checks li{padding-left:22px;position:relative;color:var(--muted);font-size:15px}
.checks li::before{content:"";position:absolute;left:0;top:.62em;width:9px;height:9px;border-radius:3px;background:var(--accent)}
footer{max-width:1120px;margin:auto;padding:28px 24px 48px;border-top:1px solid var(--line);color:var(--muted);font-size:12.5px}
a:focus-visible{outline:3px solid #97bea7;outline-offset:3px}
@media(max-width:860px){.cards,.cards.two,.split,.checks{grid-template-columns:1fr}.hero{padding:44px 0 36px}nav{gap:12px}
.top,main,footer{padding-left:16px;padding-right:16px}tbody th{width:auto}}
@media(max-width:520px){nav{display:none}}