:root { color-scheme: light; --ink:#1d2633; --muted:#5f6b78; --paper:#fbfaf7; --accent:#b36a32; --rule:#e6e1d8; --code:#202733; }
* { box-sizing:border-box; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Georgia,'Times New Roman',serif; line-height:1.72; }
main { width:min(100% - 32px,820px); margin:0 auto; padding:28px 0 80px; }
.site-nav { border-bottom:1px solid var(--rule); display:flex; gap:18px; flex-wrap:wrap; padding:0 0 18px; }
.site-nav a { color:var(--muted); font:600 14px/1.2 system-ui,sans-serif; text-decoration:none; }
.site-nav a:hover, .site-nav a[aria-current="page"] { color:var(--accent); }
header { border-bottom:1px solid var(--rule); margin-bottom:34px; padding:32px 0 24px; }
.eyebrow { color:var(--accent); font:700 13px/1.3 system-ui,sans-serif; letter-spacing:.12em; text-transform:uppercase; }
h1 { font-size:clamp(2.2rem,7vw,4.5rem); line-height:1.02; letter-spacing:-.04em; margin:14px 0 0; max-width:720px; }
h2 { font-size:clamp(1.45rem,4vw,2rem); line-height:1.15; margin:42px 0 14px; letter-spacing:-.02em; }
h3 { font-size:1.2rem; margin:28px 0 8px; }
p { font-size:1.08rem; margin:0 0 18px; }
ol, ul { padding-left:1.35rem; font-size:1.06rem; }
li { margin:.42rem 0; }
a { color:#8c4d1e; }
code { font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:.9em; }
pre { overflow:auto; background:var(--code); color:#f1f4f7; border-radius:10px; padding:16px 18px; margin:16px 0 22px; font:14px/1.55 ui-monospace,SFMono-Regular,Consolas,monospace; }
.callout { border-left:4px solid var(--accent); padding:3px 0 3px 18px; margin:24px 0; color:var(--muted); }
footer { border-top:1px solid var(--rule); color:var(--muted); font:13px/1.5 system-ui,sans-serif; margin-top:48px; padding-top:18px; }
footer a { color:inherit; text-decoration:none; }
@media (max-width:520px) { main { width:min(100% - 24px,820px); padding-top:20px; } .site-nav { gap:14px; } p { font-size:1.02rem; } pre { font-size:12px; padding:13px; } }