:root {
  --bg: #f7f4ee; --fg: #1f2a37; --muted: #5b6573; --accent: #2f5d8a; --rule: #ddd6c8;
}
@media (prefers-color-scheme: dark) {
  :root { --bg: #14181d; --fg: #ece7dd; --muted: #9aa3ae; --accent: #8db8e0; --rule: #2a313a; }
}
* { box-sizing: border-box; }
html { font-size: 18px; }
body {
  margin: 0; background: var(--bg); color: var(--fg);
  font-family: Georgia, "Iowan Old Style", "Times New Roman", serif; line-height: 1.6;
}
main { max-width: 38rem; margin: 0 auto; padding: 18vh 1.25rem 4rem; }
h1 { font-size: 2.4rem; font-weight: normal; letter-spacing: -0.01em; margin: 0 0 .25rem; }
h2 { font-size: 1.4rem; font-weight: normal; margin: 2rem 0 .5rem; }
p { margin: 0 0 1rem; }
.lede { color: var(--muted); font-size: 1.1rem; margin-bottom: 2rem; }
nav, .links { display: flex; flex-wrap: wrap; gap: .4rem 1.4rem; padding: 1rem 0; border-top: 1px solid var(--rule); }
a { color: var(--accent); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { text-decoration-thickness: 2px; }
footer { color: var(--muted); font-size: .8rem; margin-top: 3rem; }