:root { --ink: #2b2420; --paper: #fff8ef; --accent: #c8502e; --muted: #7a6a5e; }
* { box-sizing: border-box; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 17px/1.6 "Nunito", "Segoe UI", system-ui, sans-serif; }
header, main, footer { max-width: 760px; margin: 0 auto; padding: 0 20px; }
header { padding-top: 40px; }
header a { color: var(--ink); text-decoration: none; font: 700 22px "Fredoka", "Segoe UI", system-ui, sans-serif; }
h1, h2, h3 { font-family: "Fredoka", "Segoe UI", system-ui, sans-serif; line-height: 1.2; }
h1 { font-size: 40px; margin: 24px 0 8px; }
h2 { font-size: 24px; margin: 36px 0 8px; }
p.lead { font-size: 20px; color: var(--muted); margin-top: 0; }
a { color: var(--accent); }
table { border-collapse: collapse; width: 100%; margin: 12px 0; font-size: 15px; }
th, td { text-align: left; vertical-align: top; padding: 8px 10px; border-bottom: 1px solid #e6d9c8; }
code { background: #f3e9db; padding: 1px 5px; border-radius: 4px; font-size: 90%; }
footer { padding: 48px 20px 40px; color: var(--muted); font-size: 14px; }
@media (max-width: 600px) { h1 { font-size: 32px; } body { font-size: 16px; } }