:root { color-scheme: light dark; --page: #f9f9f7; --ink: #0b0b0b; --ink2: #52514e; --line: #e1e0d9; }
@media (prefers-color-scheme: dark) { :root { --page: #0d0d0d; --ink: #f0efec; --ink2: #c3c2b7; --line: #2c2c2a; } }
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--page); color: var(--ink); font: 16px/1.55 system-ui, -apple-system, "Segoe UI", sans-serif; }
.site-head { max-width: 860px; margin: 0 auto; padding: 22px 16px 0; }
.wordmark { color: var(--ink2); text-decoration: none; font-size: 14px; letter-spacing: .02em; }
.wordmark:hover { color: var(--ink); }
main { max-width: 860px; margin: 0 auto; padding: 18px 16px 56px; }
h1 { font-size: clamp(26px, 5vw, 36px); line-height: 1.15; margin: 8px 0 10px; font-weight: 650; letter-spacing: -.01em; }
.lede { color: var(--ink2); max-width: 62ch; margin: 0 0 20px; }
.fine { color: var(--ink2); font-size: 13px; max-width: 70ch; margin: 18px 0 0; }