:root { --bg:#faf7f2; --fg:#1d2a24; --muted:#5b6b62; --card:#ffffff; --line:#e3ddd0; --accent:#264e36; }
@media (prefers-color-scheme: dark) { :root { --bg:#121f19; --fg:#e8efe9; --muted:#9db0a4; --card:#1a2b23; --line:#2b4036; --accent:#7fc79b; } }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--fg); font:16px/1.65 "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", sans-serif; }
header, main, footer { max-width: 46rem; margin: 0 auto; padding: 0 1.25rem; }
header { padding-top: 1.5rem; display:flex; align-items:center; gap:.6rem; }
header img { width:28px; height:28px; }
header a { color:var(--fg); font-weight:700; text-decoration:none; }
h1 { font: 700 2rem/1.2 "Literata", Georgia, serif; margin: 1.5rem 0 .25rem; }
h2 { font: 700 1.25rem/1.3 "Literata", Georgia, serif; margin: 2.25rem 0 .5rem; }
h3 { font-size: 1rem; margin: 1.25rem 0 .25rem; }
p, li { color: var(--fg); }
.meta { color: var(--muted); font-size: .9rem; margin-top: 0; }
a { color: var(--accent); }
table { width:100%; border-collapse: collapse; margin: .75rem 0; font-size: .92rem; background: var(--card); border:1px solid var(--line); }
th, td { text-align:left; vertical-align:top; padding:.55rem .7rem; border-bottom:1px solid var(--line); }
th { color: var(--muted); font-weight:600; }
.callout { background: var(--card); border:1px solid var(--line); border-left:4px solid var(--accent); border-radius:.5rem; padding:.85rem 1rem; margin:1rem 0; }
code { font-size:.88em; }
footer { padding: 2.5rem 1.25rem 3rem; color: var(--muted); font-size:.88rem; }
footer a { margin-right: 1rem; }
nav.toc { background:var(--card); border:1px solid var(--line); border-radius:.5rem; padding:.75rem 1rem; margin:1.25rem 0; font-size:.92rem; }
nav.toc ol { margin:.25rem 0 0; padding-left:1.2rem; }