:root{--bg:#f6f2ea;--ink:#1c1a17;--dim:#6b645b;--rule:#ddd4c6;--accent:#7a5c3e;--btn:#1c1a17;--btnink:#f6f2ea}
@media (prefers-color-scheme:dark){:root{--bg:#16150f;--ink:#e6e0d6;--dim:#9a9184;--rule:#322e26;--accent:#c9a678;--btn:#e6e0d6;--btnink:#16150f}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:400 1.125rem/1.7 "Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif}
.wrap{max-width:40rem;margin:0 auto;padding:3rem 1.25rem}
.mono,.eyebrow,footer{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.eyebrow{font-size:.75rem;letter-spacing:.18em;text-transform:uppercase;color:var(--dim);margin:0 0 1rem}
h1{font-size:clamp(2.4rem,9vw,3.6rem);line-height:1.05;margin:0 0 .5rem;letter-spacing:-.01em}
h1 .m{color:var(--accent)}
h2{font:500 .8rem/1.4 ui-monospace,Menlo,monospace;letter-spacing:.16em;text-transform:uppercase;color:var(--dim);margin:3rem 0 1rem;padding-top:1.25rem;border-top:1px solid var(--rule)}
.lead{font-size:1.3rem;color:var(--dim);font-style:italic}
a{color:var(--accent)}
.btn{display:inline-block;background:var(--btn);color:var(--btnink);padding:.8rem 1.4rem;border-radius:3px;text-decoration:none;font:500 1rem ui-monospace,Menlo,monospace;margin:.5rem .5rem .5rem 0}
.btn.alt{background:transparent;color:var(--ink);border:1px solid var(--ink)}
.note{border-left:3px solid var(--accent);padding:.1rem 1rem;color:var(--dim);font-size:1rem}
.todo{background:color-mix(in srgb,#c33 14%,transparent);border:1px dashed #c33;padding:.1rem .5rem;font-family:ui-monospace,Menlo,monospace;font-size:.95rem}
footer{border-top:1px solid var(--rule);margin-top:4rem;padding-top:1.5rem;font-size:.8rem;color:var(--dim)}
footer a{margin-right:1rem}