:root {
  --bg: #f6f4f0; --fg: #1d1c1a; --muted: #6b6760; --rule: #d9d4cb;
  --code: #ece9e2; --link: #1f5f8b;
  --mono: ui-monospace, "JetBrains Mono", "DejaVu Sans Mono", Consolas, monospace;
}
@media (prefers-color-scheme: dark) {
  :root { --bg: #151413; --fg: #ece8e1; --muted: #9a958c; --rule: #34312d; --code: #211f1d; --link: #7fb6dc; }
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--bg); color: var(--fg);
  font: 16px/1.55 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
a { color: var(--link); }
header { max-width: 80rem; margin: 0 auto; padding: 1rem 1.25rem; display: flex; flex-wrap: wrap;
  gap: .25rem 1.5rem; justify-content: space-between; border-bottom: 1px solid var(--rule); }
header > a { color: var(--fg); text-decoration: none; font-weight: 600; }
header nav { display: flex; flex-wrap: wrap; gap: .1rem .9rem; font-family: var(--mono); font-size: .9rem; }
main { max-width: 80rem; margin: 0 auto; padding: 1.5rem 1.25rem 4rem; }
h1 { font-size: 1.9rem; line-height: 1.2; margin: .5rem 0 .5rem; font-family: var(--mono); font-weight: 600; }
h2 { font-size: 1.25rem; margin: 2.25rem 0 .5rem; padding-top: .75rem; border-top: 1px solid var(--rule); }
h3 { font-size: 1.05rem; margin: 1.5rem 0 .4rem; }
h4 { font-size: 1rem; margin: 1.25rem 0 .3rem; }
p, ul, ol { margin: .6rem 0; }
li { margin: .2rem 0; }
code, pre, kbd { font-family: var(--mono); font-size: .86em; }
code, kbd { background: var(--code); padding: .08em .3em; border-radius: 3px; }
pre { background: var(--code); padding: .75rem .9rem; overflow-x: auto; line-height: 1.4; border-radius: 4px; }
pre code { background: none; padding: 0; font-size: inherit; }
table { border-collapse: collapse; margin: .75rem 0; display: block; overflow-x: auto; max-width: 100%; }
th, td { text-align: left; vertical-align: top; padding: .3rem .8rem .3rem 0; border-bottom: 1px solid var(--rule); }
th { font-weight: 600; }
td.n { text-align: right; white-space: nowrap; color: var(--muted); }
table.tools td:first-child { font-family: var(--mono); font-weight: 600; padding-right: 1.5rem; }
table.dl td:nth-child(2) { font-family: var(--mono); font-size: .88rem; }
.meta { color: var(--muted); font-size: .88rem; }
figure { margin: 1.25rem 0; }
figure img { display: block; max-width: 100%; height: auto; border: 1px solid var(--rule); }
figcaption { color: var(--muted); font-size: .88rem; margin-top: .35rem; }
.toc { margin: 1rem 0; border: 1px solid var(--rule); padding: .4rem .8rem; }
.toc summary { cursor: pointer; }
.toc ul { list-style: none; padding-left: 1rem; margin: .1rem 0; }
.toc > .toc { border: 0; padding: 0; margin: .25rem 0 0; }
.toc > .toc > ul { padding-left: 0; }
hr { display: none; }
/* Code highlighting: pygments classes */
:root { --hl-k: #8b2c8f; --hl-s: #2f6b2f; --hl-c: #6f6a62; --hl-n: #a0521a; --hl-f: #1f5f8b; --hl-d: #a02c2c; }
@media (prefers-color-scheme: dark) {
  :root { --hl-k: #d09ad6; --hl-s: #9ac98a; --hl-c: #98938a; --hl-n: #e0ac78; --hl-f: #8ac0e4; --hl-d: #ef9a9a; }
}
.hl .k, .hl .kd, .hl .kn, .hl .kp, .hl .kr, .hl .kt, .hl .kc, .hl .ow { color: var(--hl-k); }
.hl .s, .hl .s1, .hl .s2, .hl .sa, .hl .sb, .hl .sc, .hl .sd, .hl .se, .hl .si, .hl .sh, .hl .dl { color: var(--hl-s); }
.hl .c, .hl .c1, .hl .cm, .hl .ch, .hl .cs, .hl .cp, .hl .cpf { color: var(--hl-c); font-style: italic; }
.hl .m, .hl .mi, .hl .mf, .hl .mh, .hl .mb, .hl .mo { color: var(--hl-n); }
.hl .nf, .hl .fm, .hl .nc, .hl .nb, .hl .bp, .hl .nd, .hl .nl, .hl .nv { color: var(--hl-f); }
.hl .gd { color: var(--hl-d); }
.hl .gi { color: var(--hl-s); }
.hl .err { color: inherit; border: 0; }
/* Articles */
article h1 { font-family: inherit; font-size: 2rem; }
article pre { margin: 1rem 0; }
article blockquote { margin: 1rem 0; padding-left: 1rem; border-left: 3px solid var(--rule); color: var(--muted); }
ul.articles { list-style: none; padding: 0; }
ul.articles li { margin: .8rem 0; }
ul.articles time { color: var(--muted); font-family: var(--mono); font-size: .85rem; margin-right: .4rem; }
.draft { background: var(--code); border-left: 3px solid var(--hl-d); padding: .4rem .7rem; }