:root { --bg: #f7f4ee; --surface: #ffffff; --text: #17140f; --muted: #5b564b; --brand: #d63a14; --border: #e3ded3; }
@media (prefers-color-scheme: dark) { :root { --bg: #0e0f12; --surface: #17191e; --text: #f6f3ec; --muted: #b4afa3; --brand: #ff7a55; --border: #2a2e36; } }
* { box-sizing: border-box; }
body { background: var(--bg); color: var(--text); font: 17px/1.6 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; margin: 0; }
main { margin: 0 auto; max-width: 720px; padding: 32px 20px 64px; }
header.brand { align-items: center; display: flex; gap: 12px; margin-bottom: 8px; }
header.brand .dot { background: var(--brand); border-radius: 50%; box-shadow: 0 0 0 6px color-mix(in srgb, var(--brand) 25%, transparent), 0 0 0 14px color-mix(in srgb, var(--brand) 10%, transparent); height: 18px; width: 18px; margin: 14px; }
h1 { font-size: 34px; letter-spacing: -0.5px; line-height: 1.2; margin: 0; }
h2 { font-size: 22px; margin: 36px 0 8px; }
p, li { color: var(--text); }
.lead { color: var(--muted); font-size: 20px; margin: 8px 0 24px; }
.card { background: var(--surface); border: 1px solid var(--border); border-radius: 16px; margin: 16px 0; padding: 4px 20px 16px; }
a { color: var(--brand); }
nav a { margin-right: 16px; }
footer { border-top: 1px solid var(--border); color: var(--muted); font-size: 15px; margin-top: 48px; padding-top: 16px; }
table { border-collapse: collapse; width: 100%; }
th, td { border-bottom: 1px solid var(--border); font-size: 15px; padding: 8px 6px; text-align: left; vertical-align: top; }
.updated { color: var(--muted); font-size: 15px; }
