:root {
  color-scheme: dark;
  --canvas: #0b1016;
  --surface: #151b24;
  --ink: #e0e3ea;
  --muted: #aab3c2;
  --quiet: #303a49;
  --boundary: #788395;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.7;
  background: var(--canvas);
  color: var(--ink);
  font-synthesis: none;
}
* { box-sizing: border-box; }
body { margin: 0; }
main { max-width: 72ch; margin: 0 auto; padding: clamp(2rem, 6vw, 4rem) 1.25rem 5rem; overflow-wrap: anywhere; }
h1, h2, h3 { line-height: 1.2; text-wrap: balance; }
h1 { font-size: clamp(2rem, 5vw, 2.8rem); letter-spacing: -0.04em; }
h2 { margin-top: 2.5rem; padding-top: 1.25rem; border-top: 1px solid var(--quiet); font-size: 1.5rem; }
h3 { margin-top: 1.75rem; font-size: 1.15rem; }
p, li { max-width: 72ch; }
.brand { font-weight: 650; color: var(--muted); }
a { color: var(--ink); text-decoration-color: var(--boundary); text-underline-offset: 0.25em; }
a:hover { text-decoration-color: var(--ink); text-decoration-thickness: 2px; }
a:focus-visible { outline: 2px solid #d6d0ff; outline-offset: 4px; border-radius: 3px; }
table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; background: var(--surface); }
th, td { padding: 0.75rem; text-align: left; vertical-align: top; border: 1px solid var(--boundary); min-width: 8rem; }
th { font-weight: 650; }