@import url('./fonts.css');
:root{color-scheme:light;--paper:#faf6ec;--ink:#1c2420;--green:#24402c;--muted:#5a5f52;--border:#c8cbbb}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Inter,system-ui,sans-serif;font-size:1rem;line-height:1.75}
header,main,footer{width:min(100% - 40px,760px);margin-inline:auto}
header{padding-block:24px;border-bottom:1px solid var(--border)}
nav,footer{display:flex;flex-wrap:wrap;gap:12px 24px}
a{color:var(--green);text-underline-offset:4px;overflow-wrap:anywhere}
a:hover{text-decoration-thickness:2px}
a:focus-visible{outline:3px solid var(--green);outline-offset:5px;border-radius:2px}
nav a,footer a{display:inline-flex;align-items:center;min-height:44px}
main{padding-block:44px 64px}
h1,h2{font-family:Fraunces,Georgia,serif;font-weight:500;line-height:1.2;text-wrap:balance}
h1{font-size:clamp(2rem,6vw,3rem);margin:0 0 20px}
h2{font-size:1.5rem;margin:40px 0 12px;scroll-margin-top:20px}
p,ul{margin:12px 0}
.meta{color:var(--muted);font-size:.875rem}
footer{padding-block:24px 40px;border-top:1px solid var(--border)}
::selection{background:#d7dfbf;color:var(--ink)}
.skip{position:absolute;top:-100px;left:20px;background:var(--paper);padding:12px}
.skip:focus{top:8px}