:root {
  color-scheme: light dark;
  --fg: #1a1a1a;
  --dim: #6b7280;
  --bg: #ffffff;
}
@media (prefers-color-scheme: dark) {
  :root { --fg: #e8e8e8; --dim: #8b94a3; --bg: #111315; }
}
* { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--fg);
  font: 16px/1.65 -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
}
main { max-width: 34rem; margin: 0 auto; padding: 20vh 1.5rem 4rem; }
h1 { font-size: 1.9rem; letter-spacing: -0.025em; margin: 0 0 0.75rem; }
p { margin: 0 0 1rem; }
nav { margin: 2rem 0; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--dim); }
footer { margin-top: 4rem; color: var(--dim); font-size: 0.875rem; }
code { font-size: 0.85em; }