:root{--bg:#0d1110;--panel:#121816;--fg:#d7e0dc;--dim:#8d9a95;--line:#25302c;--ok:#7ee2a8;--warn:#f2c46d;--link:#8fd3ff;--focus:#ffd166;color-scheme:dark}
@media (prefers-color-scheme:light){:root:not([data-theme="dark"]){--bg:#f7f7f2;--panel:#efefe8;--fg:#1b211f;--dim:#55605b;--line:#d5d8cf;--ok:#11663d;--warn:#7a5200;--link:#0b5394;--focus:#b42318;color-scheme:light}}
:root[data-theme="light"]{--bg:#f7f7f2;--panel:#efefe8;--fg:#1b211f;--dim:#55605b;--line:#d5d8cf;--ok:#11663d;--warn:#7a5200;--link:#0b5394;--focus:#b42318;color-scheme:light}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);font:15px/1.65 ui-monospace,"SF Mono","Cascadia Mono","JetBrains Mono",Menlo,Consolas,"Liberation Mono",monospace;overflow-wrap:anywhere}
@media (min-width:48rem){body{font-size:16px}}
a{color:var(--link);text-underline-offset:.2em}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.skip{position:absolute;left:1rem;top:-5rem;background:var(--fg);color:var(--bg);padding:.4rem .7rem;z-index:3}
.skip:focus{top:1rem}
.wrap{max-width:82ch;margin:0 auto;padding:0 1rem}
header.bar{border-bottom:1px solid var(--line);padding:.9rem 0}
header.bar .wrap{display:flex;flex-wrap:wrap;gap:.4rem 1rem;align-items:center;justify-content:space-between}
.host{color:var(--ok);text-decoration:none;font-weight:600}
.host span{color:var(--dim);font-weight:400}
nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.2rem .8rem;align-items:center}
nav a{color:var(--fg);text-decoration:none;display:inline-block;min-height:24px;padding:.1rem 0}
nav a::before{content:"["/"";color:var(--dim)}nav a::after{content:"]"/"";color:var(--dim)}
nav a:hover,nav a[aria-current="page"]{color:var(--ok)}
.theme{font:inherit;font-size:.85em;background:none;color:var(--dim);border:1px solid var(--line);padding:.1rem .5rem;cursor:pointer;min-height:26px}
.no-js .theme{display:none}
main{display:block;padding-bottom:3rem}
h1,h2,h3{font-size:1em;margin:0;font-weight:600}
.ps{color:var(--dim);font-weight:400}
.ps b{color:var(--ok);font-weight:600}
section{padding:2.25rem 0 0}
section>h2{margin-bottom:.9rem}
.out{margin:0 0 0 0;padding-left:1.1rem;border-left:1px solid var(--line)}
.out p{margin:0 0 .8rem}
.banner{padding-top:2.5rem}
.banner h1{font-size:clamp(1.6rem,5vw,2.4rem);line-height:1.15;letter-spacing:-.01em;margin:.6rem 0 1rem;color:var(--fg)}
.kv{display:grid;grid-template-columns:max-content 1fr;gap:.15rem 1.25rem;margin:0 0 1rem}
.kv dt{color:var(--dim)}
.kv dd{margin:0}
.log{list-style:none;margin:0;padding:0}
.log>li{border-top:1px dashed var(--line)}
.log>li:last-child{border-bottom:1px dashed var(--line)}
details>summary{cursor:pointer;padding:.7rem 0;list-style:none;display:grid;grid-template-columns:auto 1fr;gap:0 .8rem}
details>summary::-webkit-details-marker{display:none}
summary .tag{color:var(--ok)}
summary .name{font-weight:600}
summary .sum{grid-column:2;color:var(--dim)}
details[open]>summary .tag::after{content:" -"/""}
details:not([open])>summary .tag::after{content:" +"/""}
.detail{padding:0 0 1.1rem 1.1rem;border-left:1px solid var(--line);margin-left:.35rem}
.detail p{margin:0 0 .8rem}
.detail .res{color:var(--ok)}
.detail .stack{color:var(--dim)}
table.t{border-collapse:collapse;width:100%;display:block;overflow-x:auto}
.t th,.t td{text-align:left;padding:.25rem 1.5rem .25rem 0;vertical-align:top}
.t th{color:var(--dim);font-weight:400;border-bottom:1px solid var(--line)}
.ok{color:var(--ok)}.pend{color:var(--warn)}
.job{margin:0 0 1.4rem}
.job h3{display:inline}
.job .when{color:var(--dim)}
.job ul{margin:.4rem 0 0;padding:0;list-style:none}
.job li{padding-left:1.4rem;text-indent:-1.4rem;margin:0 0 .3rem}
.job li::before{content:"-  "/"";color:var(--dim)}
.posts{list-style:none;margin:0;padding:0}
.posts li{margin:0 0 .9rem}
.posts .d{color:var(--dim);margin-right:1rem}
.posts p{margin:.1rem 0 0 0;color:var(--dim)}
.todo{color:var(--bg);background:var(--warn);padding:0 .3rem}
.cursor{display:inline-block;width:.6em;height:1.1em;background:var(--ok);vertical-align:text-bottom;margin-left:.2rem}
@media (prefers-reduced-motion:no-preference){.cursor{animation:blink 1.1s steps(1) infinite}@keyframes blink{50%{opacity:0}}}
footer{border-top:1px solid var(--line);padding:1rem 0 2.5rem;color:var(--dim);font-size:.9em}
footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.5rem 1rem}
footer p{margin:0}
.prose{padding-top:2rem}
.prose h1{font-size:clamp(1.3rem,4vw,1.8rem);line-height:1.25;margin:.6rem 0 .4rem}
.prose .meta{color:var(--dim);margin:0 0 1.75rem}
.prose h2{margin:2rem 0 .6rem;color:var(--ok)}
.prose h2::before{content:"## "/"";color:var(--dim)}
.prose p,.prose ul,.prose ol{margin:0 0 1rem}
.prose ul{padding-left:1.4rem}
.prose li{margin:0 0 .35rem}
.prose strong{color:var(--fg)}
.prose pre{background:var(--panel);border:1px solid var(--line);padding:.9rem;overflow-x:auto;font-size:.9em}
.prose :not(pre)>code{background:var(--panel);border:1px solid var(--line);padding:0 .25rem}
.prose blockquote{margin:1.5rem 0;padding:.6rem .9rem;border:1px solid var(--line);border-left:3px solid var(--ok);background:var(--panel)}
.prose blockquote p{margin:0}
.prose table{border-collapse:collapse;width:100%;display:block;overflow-x:auto;margin:0 0 1rem;font-size:.92em}
.prose th,.prose td{text-align:left;border:1px solid var(--line);padding:.4rem .6rem;vertical-align:top}
.prose th{color:var(--dim);font-weight:400}
.prose .demo-modes{padding-left:0}
#stage h2::before{content:none}
.mark{display:block;width:100%;padding-left:1.6rem;font-size:.88em;font-weight:600}
.right .mark{color:var(--ok)}.wrong .mark{color:var(--warn)}
.demo-modes{display:flex;flex-wrap:wrap;gap:.5rem;margin:0 0 1.25rem;padding:0;list-style:none}
.btn,.mini{font:inherit;background:var(--panel);color:var(--fg);border:1px solid var(--line);padding:.45rem .8rem;cursor:pointer;min-height:44px}
.btn:hover,.mini:hover{border-color:var(--ok)}
.btn[aria-pressed="true"]{border-color:var(--ok);color:var(--ok)}
.mini{min-height:36px;min-width:44px;padding:.2rem .5rem;font-size:.85em}
.mini:disabled,.btn:disabled{opacity:.45;cursor:default}
#stage{border:1px solid var(--line);padding:1rem;min-height:12rem}
#stage h2{color:var(--ok);margin:0 0 .4rem}
#stage .dim{color:var(--dim);margin:0 0 .9rem}
.card{border-left:3px solid var(--ok);background:var(--panel);padding:.8rem 1rem;margin:0 0 1rem}
.card p{margin:0}.card .back{margin-top:.8rem;padding-top:.8rem;border-top:1px dashed var(--line)}
.row{display:flex;flex-wrap:wrap;gap:.5rem}
fieldset{border:0;margin:0 0 1rem;padding:0}
legend{padding:0;margin:0 0 .8rem;font-weight:600}
label.choice{display:flex;flex-wrap:wrap;gap:.3rem .6rem;align-items:flex-start;padding:.55rem .6rem;border:1px solid var(--line);margin:0 0 .45rem;cursor:pointer}
label.choice .ctext{flex:1 1 0;min-width:0}
label.choice input{flex:none;margin-top:.35rem;accent-color:var(--ok)}
.right{border-color:var(--ok)!important;box-shadow:inset 3px 0 0 var(--ok)}
.wrong{border-color:var(--warn)!important;box-shadow:inset 3px 0 0 var(--warn)}
.fb{margin-top:1rem}.fb p{margin:0 0 .8rem}.fb .ok{color:var(--ok);font-weight:600}.fb .bad{color:var(--warn);font-weight:600}
ol.seq{margin:0 0 1rem;padding-left:2rem}
ol.seq li{border:1px solid var(--line);padding:.5rem .6rem;margin:0 0 .45rem;display:flex;flex-wrap:wrap;gap:.5rem;justify-content:space-between;align-items:center}
ol.seq .ctl{display:flex;gap:.35rem}
ol.key{margin:0 0 .8rem;padding-left:2rem}
.note{color:var(--dim)}
.sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}