style.css

:root { --fg:#1b1b1b; --muted:#666; --rule:#dcdcdc; --bg:#fff;
        --codebg:#f7f7f4; --link:#0b5fa5; }
* { box-sizing: border-box; }
body { margin:0 auto; max-width:50em; padding:2em 1.5em 4em;
       background:var(--bg); color:var(--fg);
       font:16px/1.6 Georgia, "Times New Roman", serif; }
a { color:var(--link); }
h1 { text-align:center; font:600 30px/1.25 -apple-system,"Helvetica Neue",Arial,sans-serif;
     margin:.1em 0 .35em; }
h2.school { text-align:center; font:400 16px/1.4 -apple-system,"Helvetica Neue",Arial,sans-serif;
            color:var(--muted); margin:0 0 1.2em; }
h3.author { text-align:center; font:500 17px/1.3 -apple-system,"Helvetica Neue",Arial,sans-serif;
            margin:.2em 0; }
h4.affil { text-align:center; font:400 14px/1.3 -apple-system,"Helvetica Neue",Arial,sans-serif;
           color:var(--muted); margin:.1em 0 2.4em; font-weight:400; }
h3 { font:600 20px/1.3 -apple-system,"Helvetica Neue",Arial,sans-serif;
     margin:2.2em 0 .6em; padding-top:.4em; border-top:1px solid var(--rule); }
h3.author, h3:first-of-type { border-top:none; }
p { margin:.7em 0; }
p.note { background:#fafaf8; border:1px solid var(--rule); border-radius:4px;
         padding:.8em 1.1em; font-size:15px; }
p.licence { color:var(--muted); font-size:13.5px; line-height:1.5; }
ul { padding-left:1.5em; }
li { margin:.35em 0; }
code { background:var(--codebg); border-radius:3px; padding:.08em .3em;
       font:.86em/1.4 "DejaVu Sans Mono", Menlo, Consolas, monospace; }
pre.code { background:var(--codebg); border:1px solid var(--rule); border-radius:4px;
           padding:.8em 1em; overflow-x:auto;
           font:13.5px/1.5 "DejaVu Sans Mono", Menlo, Consolas, monospace; }
hr { border:none; border-top:1px solid var(--rule); margin:3em 0 1.2em; }
@media (prefers-color-scheme: dark) {
  :root { --fg:#e6e6e6; --muted:#9a9a9a; --rule:#3a3a3a; --bg:#191919;
          --codebg:#212121; --link:#78b7f0; }
  p.note { background:#1f1f1f; }
}