/* Deliberately plain and hand-written: a personal notebook with a framework
   build and a 200KB bundle would be the wrong shape for what it claims to be. */
:root { --ink:#24282b; --muted:#6a7278; --rule:#dfe3e5; --bg:#fbfaf7; --link:#2b5f7e; }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--ink); line-height:1.65;
  font-family:"Iowan Old Style",Palatino,Georgia,serif; font-size:17px; }
header { display:flex; flex-wrap:wrap; gap:.75rem 1.5rem; align-items:baseline;
  max-width:38rem; margin:0 auto; padding:2.5rem 1.25rem 1rem; }
.wordmark { font-size:1.15rem; letter-spacing:.02em; text-decoration:none; color:var(--ink); }
header nav { display:flex; gap:1.1rem; font-size:.92rem; }
header nav a, main a, footer a { color:var(--link); text-decoration:none; border-bottom:1px solid var(--rule); }
header nav a:hover, main a:hover { border-bottom-color:var(--link); }
main { max-width:38rem; margin:0 auto; padding:.5rem 1.25rem 3rem; }
h1 { font-size:1.6rem; line-height:1.25; margin:.8rem 0 .3rem; font-weight:600; }
h2 { font-size:1.12rem; margin:2rem 0 .4rem; font-weight:600; }
.dateline, .muted { color:var(--muted); font-size:.9rem; }
.dateline { margin:0 0 1.4rem; }
ul { padding-left:1.1rem; }
li { margin:.3rem 0; }
footer { border-top:1px solid var(--rule); max-width:38rem; margin:0 auto;
  padding:1.2rem 1.25rem 3rem; color:var(--muted); font-size:.88rem; }
@media (prefers-color-scheme: dark) {
  :root { --ink:#dde2e4; --muted:#8e979c; --rule:#333a3e; --bg:#191c1e; --link:#7fb2cd; }
}