:root { color-scheme: light dark; --fg: #1c1c1e; --bg: #fbfbfd; --muted: #5b5b61; --accent: #2f5bd3; }
@media (prefers-color-scheme: dark) { :root { --fg: #f2f2f7; --bg: #121214; --muted: #a1a1aa; --accent: #8fb0ff; } }
* { box-sizing: border-box; }
body { margin: 0; font: 1.0625rem/1.6 -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  color: var(--fg); background: var(--bg); }
header, main, footer { max-width: 44rem; margin: 0 auto; padding: 1.25rem 1rem; }
header nav a { margin-right: 1rem; }
a { color: var(--accent); }
a:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
h1 { font-size: 1.9rem; line-height: 1.2; }
h2 { font-size: 1.3rem; margin-top: 2rem; }
.muted, footer { color: var(--muted); }
footer { font-size: 0.9rem; border-top: 1px solid color-mix(in srgb, var(--muted) 30%, transparent); }
pre { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 0.85rem; }
.skip { position: absolute; left: -999px; }
.skip:focus { left: 1rem; top: 1rem; }