:root{--bg:#fbfaf7;--fg:#1a1a1a;--muted:#5b5b5b;--line:#e3e0d8;--accent:#0b5c4a;--ph-bg:#fff3c4;--ph-fg:#5a4500}
@media (prefers-color-scheme:dark){:root{--bg:#121413;--fg:#ecebe6;--muted:#a3a39b;--line:#2b2e2c;--accent:#6fd3b6;--ph-bg:#3a3110;--ph-fg:#f3dc8a}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);font:1.0625rem/1.65 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
.wrap{max-width:42rem;margin:0 auto;padding:1.5rem 1rem 3rem}
header a.brand{font-weight:700;font-size:1.25rem;color:var(--fg);text-decoration:none;letter-spacing:-.01em}
h1{font-size:2rem;line-height:1.2;margin:2rem 0 .75rem;letter-spacing:-.02em}
h2{font-size:1.25rem;margin:2rem 0 .5rem}
p,li{max-width:65ch}
a{color:var(--accent);text-underline-offset:.15em}
a:focus-visible{outline:3px solid var(--accent);outline-offset:2px;border-radius:2px}
footer{margin-top:3rem;padding-top:1rem;border-top:1px solid var(--line);color:var(--muted);font-size:.95rem}
footer a{margin-right:1rem}
.tag{font-size:1.25rem;color:var(--fg)}
.soon{color:var(--muted)}
.ph{background:var(--ph-bg);color:var(--ph-fg);padding:0 .25em;border-radius:3px;font-weight:600}
.skip{position:absolute;left:-999px}.skip:focus{left:1rem;top:1rem;background:var(--bg);padding:.5rem}
