:root { color-scheme: light dark; --bg:#ffffff; --fg:#16161a; --muted:#5a5a66; --line:#dcdce4; --panel:#f5f5f8; --link:#0b57d0; }
@media (prefers-color-scheme: dark) { :root { --bg:#0b0b0e; --fg:#f5f5f7; --muted:#b4b4bd; --line:#2b2b34; --panel:#17171d; --link:#8ab4f8; } }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--fg); font:17px/1.65 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif; }
a { color:var(--link); }
a:focus-visible { outline:3px solid var(--link); outline-offset:2px; border-radius:4px; }
.skip { position:absolute; left:-999px; top:8px; background:var(--panel); padding:8px 12px; z-index:10; }
.skip:focus { left:8px; }
header.site { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px 24px; max-width:880px; margin:0 auto; padding:20px 24px; border-bottom:1px solid var(--line); }
.brand { font-weight:800; font-size:22px; text-decoration:none; color:var(--fg); letter-spacing:.02em; }
header.site nav a { margin-right:18px; text-decoration:none; }
header.site nav a[aria-current="page"] { text-decoration:underline; font-weight:700; }
main { max-width:880px; margin:0 auto; padding:32px 24px 56px; }
h1 { font-size:clamp(30px,6vw,48px); line-height:1.1; margin:0 0 16px; }
h2 { font-size:22px; margin:36px 0 8px; }
.lead { font-size:20px; color:var(--muted); }
.toc { background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:8px 20px 12px; margin:24px 0; }
.toc h2 { font-size:16px; margin:12px 0 4px; }
.toc ul { columns:2; padding-left:18px; margin:0; }
@media (max-width:640px) { .toc ul { columns:1; } }
li { margin:6px 0; }
footer.site { max-width:880px; margin:0 auto; padding:24px; border-top:1px solid var(--line); color:var(--muted); font-size:15px; }