:root { --ink:#111; --paper:#fff; --gutter:#8a8a8a; --faint:#c9c9c9; --muted:#595959; --red:#d0141e;
        --mono:"Source Code Pro", ui-monospace, Menlo, monospace; --lh:1.8; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --ink:#e8e8e8; --paper:#0d0d0d; --gutter:#6b6b6b; --faint:#3a3a3a; --muted:#a0a0a0; } }
:root[data-theme="dark"] { --ink:#e8e8e8; --paper:#0d0d0d; --gutter:#6b6b6b; --faint:#3a3a3a; --muted:#a0a0a0; }
* { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body { overflow-x:hidden; margin:0; background:var(--paper); color:var(--ink); font-family:var(--mono); font-size:15px; line-height:var(--lh); }
b, strong, h1, h2, h3, th { font-weight:400; }
a { color:inherit; }
.doc { counter-reset:ln; padding:48px 0 64px; }
.sheet { max-width:96ch; margin:0 auto; padding:0 16px 0 56px; }
.l { counter-increment:ln; position:relative; min-height:calc(var(--lh) * 1em); display:flex; flex-wrap:wrap; justify-content:space-between; column-gap:2ch; }
.l::before { content:counter(ln); position:absolute; left:-5ch; width:3.2ch; text-align:right; font-size:10px; color:var(--gutter); top:.55em; }
.l > * { min-width:0; }
.up { text-transform:uppercase; }
.muted { color:var(--muted); }
.red { color:var(--red); }
.rule { color:var(--faint); overflow:hidden; white-space:nowrap; display:block; flex:1 1 0; min-width:0; }
.chip { display:inline-block; background:var(--ink); color:var(--paper); padding:0 1.5ch; margin:-1px 0; }
.eye { display:inline-block; width:1.05em; height:1.05em; vertical-align:-.17em; margin-left:1.5ch; }
.p { display:block; max-width:80ch; }
.kv { display:grid; grid-template-columns:18ch minmax(0,1fr); width:100%; }
.step { display:grid; grid-template-columns:4ch minmax(0,1fr); width:100%; }
.code { display:block; white-space:pre-wrap; word-break:break-word; color:var(--muted); width:100%; }
.nav { display:flex; flex-wrap:wrap; gap:0 2ch; }
.nav a { text-decoration:none; text-transform:uppercase; color:var(--muted); }
.nav a:hover, .nav a.on { color:var(--ink); text-decoration:underline; }
@media (max-width:640px) {
  .sheet { padding:0 16px 0 40px; } .l::before { left:-4.2ch; }
  .kv { grid-template-columns:minmax(0,1fr); }
  .code { white-space:pre-wrap; word-break:break-word; }
}