@font-face { font-family: Fraunces; font-weight: 600; src: url(/fonts/Fraunces_600SemiBold.ttf) format('truetype'); font-display: swap; }
@font-face { font-family: Inter; font-weight: 400; src: url(/fonts/Inter_400Regular.ttf) format('truetype'); font-display: swap; }
@font-face { font-family: Inter; font-weight: 600; src: url(/fonts/Inter_600SemiBold.ttf) format('truetype'); font-display: swap; }

:root {
  --paper: #F6F1E7; --ink: #1F2A24; --forest: #2F5D46; --moss: #8AA77B;
  --clay: #C4704B; --muted: #6B746E; --card: #FFFDF8;
}
@media (prefers-color-scheme: dark) {
  :root { --paper: #161C18; --ink: #EDE8DC; --forest: #8FC1A4; --moss: #6E8C62; --clay: #E08A62; --muted: #A3ABA5; --card: #1F2722; }
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 17px/1.6 Inter, system-ui, sans-serif; }
main { max-width: 680px; margin: 0 auto; padding: 48px 20px 64px; }
nav.lang { text-align: right; font-size: 14px; }
h1, h2 { font-family: Fraunces, Georgia, serif; font-weight: 600; color: var(--forest); line-height: 1.2; }
h1 { font-size: 40px; margin: 24px 0 8px; }
h2 { font-size: 22px; margin: 36px 0 8px; }
.lede { font-size: 20px; color: var(--muted); margin-top: 0; }
a { color: var(--forest); }
.card { background: var(--card); border: 1px solid var(--moss); border-radius: 14px; padding: 18px 20px; margin-top: 28px; }
footer { margin-top: 48px; font-size: 14px; color: var(--muted); }