:root{--bg:#fbfaf7;--ink:#1f2328;--muted:#5b6570;--line:#e6e2da;--accent:#8a5a2b}
@media (prefers-color-scheme:dark){:root{--bg:#16181c;--ink:#e8e6e1;--muted:#a2aab4;--line:#2a2e35;--accent:#d9a05b}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.65 Georgia,"Times New Roman",serif}
header{display:flex;align-items:baseline;gap:22px;flex-wrap:wrap;
  max-width:720px;margin:0 auto;padding:26px 20px 14px;border-bottom:1px solid var(--line)}
.logo{font:600 20px/1 system-ui,sans-serif;color:var(--ink);text-decoration:none;letter-spacing:.01em}
nav{display:flex;gap:16px;margin-left:auto}
nav a{font:14px/1 system-ui,sans-serif;color:var(--muted);text-decoration:none}
nav a:hover{color:var(--accent)}
main{max-width:720px;margin:0 auto;padding:22px 20px 40px}
h1{font:600 28px/1.25 system-ui,sans-serif;margin:18px 0 10px}
.lead{color:var(--muted);font-size:18px;margin:0 0 26px}
article{padding:20px 0;border-bottom:1px solid var(--line)}
article:last-child{border-bottom:none}
h2{font:600 20px/1.3 system-ui,sans-serif;margin:0 0 8px}
.meta{font:13px/1 system-ui,sans-serif;color:var(--muted);margin:10px 0 0}
a{color:var(--accent)}
footer{max-width:720px;margin:0 auto;padding:18px 20px 36px;border-top:1px solid var(--line);
  font:14px/1.5 system-ui,sans-serif;color:var(--muted)}