:root{color-scheme:light;--bg:#F4F3EE;--ink:#1F1E1B;--dim:#57544C;--muted:#6E6A61;--action:#A9492A;--line:rgba(31,30,27,.12)}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:400 1.0625rem/1.7 Lora,Georgia,serif}
a{color:inherit}
header,main,footer{max-width:46rem;margin:0 auto;padding:1.5rem}
header{display:flex;justify-content:space-between;align-items:center}
header a{text-decoration:none}
h1{font-weight:500;font-size:2.4rem;line-height:1.1;margin:2rem 0 .5rem}
h2{font-weight:500;font-size:1.35rem;margin:2.4rem 0 .4rem}
.meta,.todo{color:var(--muted);font:400 .85rem/1.6 system-ui,sans-serif}
.todo{border-left:2px solid var(--action);padding-left:.8rem}
footer{border-top:1px solid var(--line);color:var(--dim);font:400 .85rem/1.7 system-ui,sans-serif}
footer nav{display:flex;flex-wrap:wrap;gap:.4rem 1.4rem}
ul{padding-left:1.2rem}li{margin:.3rem 0}
table{width:100%;border-collapse:collapse;margin:1rem 0;font:400 .9rem/1.5 system-ui,sans-serif}
th,td{text-align:left;vertical-align:top;padding:.5rem .6rem;border-bottom:1px solid var(--line)}
th{color:var(--dim);font-weight:600}
h3{font-weight:500;font-size:1.1rem;margin:1.8rem 0 .3rem}
@media (max-width:560px){table{display:block;overflow-x:auto}}

a:focus-visible{outline:2px solid var(--action);outline-offset:3px;border-radius:4px}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:var(--bg);padding:.4rem .8rem;border-radius:6px}
.skip:focus{left:8px}
main a{color:var(--action)}