:root{--bg:#fbfbf9;--card:#ffffff;--text:#23262b;--muted:#6b7079;--accent:#4f7a94;--line:#e6e7e3}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font:17px/1.7 Georgia,"Times New Roman","PT Serif",serif}
header{background:var(--card);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:10}
.wrap{max-width:1040px;margin:0 auto;padding:0 20px}
.brand{display:block;padding:18px 0 8px;font:600 22px/1 "Helvetica Neue",Arial,sans-serif;color:var(--text);text-decoration:none;letter-spacing:.02em}
nav ul{list-style:none;margin:0;padding:0 0 12px;display:flex;flex-wrap:wrap;gap:6px 18px;font:15px/1.4 "Helvetica Neue",Arial,sans-serif}
nav a{color:var(--muted);text-decoration:none;padding:4px 0;border-bottom:2px solid transparent}
nav a:hover,nav a.active{color:var(--accent);border-bottom-color:var(--accent)}
main{max-width:720px;margin:40px auto 60px;padding:0 20px}
h1{font:600 36px/1.2 "Helvetica Neue",Arial,sans-serif;margin:0 0 12px;color:var(--text)}
.lead{font-size:20px;color:var(--muted);margin:0 0 28px;font-style:italic}
h2{font:600 22px/1.3 "Helvetica Neue",Arial,sans-serif;margin:40px 0 12px;color:var(--text)}
p{margin:0 0 18px;text-align:left;hyphens:auto}
figure{margin:0 0 32px}
figure img{width:100%;height:auto;display:block;border-radius:6px;border:1px solid var(--line);background:#eef1f3}
figcaption{font:14px/1.5 "Helvetica Neue",Arial,sans-serif;color:var(--muted);margin-top:8px}
.credit{font-size:13px;color:#9aa0a8;margin-top:6px;font-family:"Helvetica Neue",Arial,sans-serif}
footer{border-top:1px solid var(--line);background:var(--card);padding:24px 0;margin-top:40px;font:14px/1.6 "Helvetica Neue",Arial,sans-serif;color:var(--muted)}
footer a{color:var(--accent)}
@media (max-width:640px){h1{font-size:28px}body{font-size:16px}nav ul{gap:4px 14px;font-size:14px}}