/* Shared by every page of the site. Kept in one file so a colour change does
   not have to be made four times — and so the pages stay small enough to be
   hosted anywhere, including a plain static bucket. */
:root { color-scheme: light dark; --brand: #1B6B4C; --ink: #1a1c1e; --bg: #fff;
        --muted: #5a5f66; --rule: #d8dbe0; --sand: #F0DCBB; }
@media (prefers-color-scheme: dark) {
  :root { --brand: #7FD1AE; --ink: #e3e2e6; --bg: #131416; --muted: #a0a5ac;
          --rule: #3a3d43; --sand: #3a2f22; }
}
body { margin: 0 auto; padding: 2rem 1.25rem 4rem; max-width: 44rem;
       font: 16px/1.65 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
       color: var(--ink); background: var(--bg); }
h1 { font-size: 1.6rem; line-height: 1.25; margin-bottom: .25rem; color: var(--brand); }
h2 { font-size: 1.15rem; margin-top: 2.2rem; color: var(--brand); }
h3 { font-size: 1rem; margin-top: 1.6rem; }
.date { color: var(--muted); font-size: .9rem; margin-top: 0; }
table { border-collapse: collapse; width: 100%; margin: 1rem 0; }
th, td { text-align: left; padding: .5rem .6rem; border-bottom: 1px solid var(--rule);
         vertical-align: top; }
th { font-weight: 600; }
.box { border-left: 3px solid var(--brand); padding: .1rem 0 .1rem 1rem; margin: 1.5rem 0; }
nav { margin-bottom: 2rem; font-size: .92rem; }
nav a { margin-right: 1rem; }
a { color: var(--brand); }
footer { margin-top: 3rem; padding-top: 1rem; border-top: 1px solid var(--rule);
         font-size: .88rem; color: var(--muted); }
.todo { background: var(--sand); color: var(--ink); padding: 0 .3rem; border-radius: 3px; }