:root { color-scheme: light dark; --canvas:#f8f8f5; --surface:#fff; --ink:#151615; --body:#303832; --secondary:#666a65; --primary:#1b5933; --border:#e1e2de; --radius:8px; }
* { box-sizing:border-box; }
body { margin:0; background:var(--canvas); color:var(--body); font:1rem/1.75 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
header,main,footer { width:min(100% - 40px,760px); margin-inline:auto; }
header { padding-block:24px; border-bottom:1px solid var(--border); display:flex; flex-wrap:wrap; gap:16px; justify-content:space-between; align-items:center; }
nav { display:flex; gap:20px; flex-wrap:wrap; }
a { color:var(--primary); text-underline-offset:3px; }
nav a { display:inline-block; padding-block:10px; }
a:focus-visible { outline:3px solid var(--primary); outline-offset:4px; border-radius:var(--radius); }
.brand { font-weight:750; text-decoration:none; font-size:1.2rem; }
main { padding-block:40px; overflow-wrap:anywhere; }
h1,h2 { color:var(--ink); line-height:1.25; }
h1 { font-size:clamp(2rem,6vw,3rem); letter-spacing:-.03em; margin-block:0 20px; }
h2 { font-size:1.35rem; margin-top:36px; }
p,ul { margin-block:16px; }
li { margin-block:8px; }
.updated,footer { color:var(--secondary); font-size:.9rem; }
.notice { padding:20px; border:1px solid var(--border); border-radius:var(--radius); background:var(--surface); }
footer { padding-block:24px 40px; border-top:1px solid var(--border); }
.skip { position:absolute; top:-100px; left:20px; background:var(--surface); padding:12px; }
.skip:focus { top:10px; }
@media(prefers-color-scheme:dark) { :root { --canvas:#111211; --surface:#1b1d1b; --ink:#f2f4f0; --body:#dde3dc; --secondary:#afb8ad; --primary:#91c29c; --border:#384038; } }