:root{--paper:#0b0b0b;--ink:#f5f5f5;--ink-2:#cfcfcf;--muted:#8c8c8c;--line:#2b2b2b;--accent:#d7191f;
  --serif:"Newsreader",Georgia,"Times New Roman",serif;--sans:"Figtree",-apple-system,"Segoe UI",Helvetica,Arial,sans-serif}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.7;-webkit-font-smoothing:antialiased}
a{color:var(--accent)}
header{border-bottom:1px solid var(--line)}
.wrap{max-width:780px;margin:0 auto;padding:0 24px}
.top{display:flex;justify-content:space-between;align-items:center;height:72px}
.brand{text-decoration:none;color:var(--ink);font-family:var(--serif);font-size:22px}
.top a.back{font-size:14px;color:var(--ink-2);text-decoration:none}
.top a.back:hover{color:var(--accent)}
::selection{background:var(--accent);color:#fff}
main{padding:64px 0 96px}
h1{font-family:var(--serif);font-weight:500;font-size:44px;line-height:1.1;margin-bottom:8px}
.updated{color:var(--muted);font-size:14px;margin-bottom:40px}
h2{font-family:var(--serif);font-weight:500;font-size:26px;margin:40px 0 12px}
p,li{color:var(--ink-2)}
p+p{margin-top:12px}
ul{margin:10px 0 0 22px}
li+li{margin-top:6px}
.box{border:1px solid var(--line);border-left:3px solid var(--accent);padding:20px 24px;margin-top:16px;background:#141414}
.todo{background:#fff3c4;color:#5c4a00;padding:0 4px;border-radius:2px}
footer{border-top:1px solid var(--line);padding:24px 0;font-size:13px;color:var(--muted)}