:root { color-scheme: dark; --bg:#0d0d0d; --card:#171717; --line:#303030; --text:#f5f5f5; --muted:#b4b4b4; --accent:#f5f5f5; --max:820px; font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
* { box-sizing:border-box; }
html { background:var(--bg); scroll-behavior:smooth; }
body { margin:0; color:var(--text); background:var(--bg); font-size:15px; line-height:1.7; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-underline-offset:3px; }
header, main, footer { width:min(var(--max),calc(100% - 40px)); margin-inline:auto; }
header { padding:52px 0 28px; border-bottom:1px solid var(--line); }
.brand { display:inline-block; margin-bottom:28px; color:var(--accent); font:650 12px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:.13em; text-decoration:none; text-transform:uppercase; }
h1 { margin:0 0 8px; font-size:clamp(38px,7vw,58px); line-height:1; letter-spacing:-.05em; }
header p, main p, main li { color:var(--muted); }
main { padding:22px 0 64px; }
nav, .notice { margin:0 0 28px; padding:17px 19px; border:1px solid var(--line); border-radius:12px; background:var(--card); }
nav strong { display:block; margin-bottom:6px; }
nav ol { margin:0; padding-left:20px; columns:2; column-gap:32px; }
nav li { break-inside:avoid; margin:3px 0; }
section { padding:25px 0; border-bottom:1px solid var(--line); }
h2 { margin:0 0 10px; font-size:21px; line-height:1.25; letter-spacing:-.02em; }
p { margin:9px 0; }
ul { margin:9px 0; padding-left:22px; }
li { margin:6px 0; }
strong { color:var(--text); }
footer { display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; padding:26px 0 44px; color:var(--muted); font-size:13px; }
.footer-links { display:flex; gap:16px; }
@media (max-width:620px) { header { padding-top:34px; } nav ol { columns:1; } section { padding:21px 0; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }