:root{
  --page:#f4f6f8; --surface:#ffffff; --ink:#0f1720; --muted:#5b6672; --line:#dde2e8;
  --accent:#2b54e6; --accent-ink:#ffffff; --ok:#13795b; --ok-bg:#e3f4ec; --chip:#eef1f5;
  --display:"Bricolage Grotesque", "Segoe UI", system-ui, sans-serif;
  --body:"Figtree", "Segoe UI", system-ui, sans-serif;
  --mono:"JetBrains Mono", ui-monospace, Consolas, monospace;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --page:#0d1116; --surface:#161b22; --ink:#eef2f6; --muted:#9aa5b1; --line:#262d36;
  --accent:#6f8dff; --accent-ink:#0d1116; --ok:#4fd1a1; --ok-bg:#12302a; --chip:#1d242d; color-scheme:dark}}
:root[data-theme="dark"]{
  --page:#0d1116; --surface:#161b22; --ink:#eef2f6; --muted:#9aa5b1; --line:#262d36;
  --accent:#6f8dff; --accent-ink:#0d1116; --ok:#4fd1a1; --ok-bg:#12302a; --chip:#1d242d; color-scheme:dark}
*{box-sizing:border-box}
body{margin:0;background:var(--page);color:var(--ink);font:16px/1.55 var(--body);padding:24px max(16px, env(safe-area-inset-right, 0px)) 48px max(16px, env(safe-area-inset-left, 0px))}
main{max-width:720px;margin:0 auto}
a{color:var(--accent);text-underline-offset:3px}
a:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:2px}
.back{display:inline-block;margin-bottom:24px}
h1,h2{font-family:var(--display);line-height:1.2}
h1{font-size:clamp(32px,5vw,44px);margin:0 0 28px}
h2{font-size:22px;margin:28px 0 8px}
p{margin:0 0 12px}
.date{color:var(--muted);margin-top:32px}