:root{--on:#ffb000;--on-hot:#ffd36b;--on-dim:#ffb00024;--bg:#030303;--panel:#0a0a0a;--panel2:#101010;--line:#1b1b1b;--line2:#262626;--ink:#e2e2e2;--muted:#8c8c8c;--faint:#8c8c8c;--off:#1c1c1c;--ok:#39d353;--bad:#ff5a4f;--warn:#ffb000;--mono:ui-monospace, Menlo, Consolas, monospace;--sans:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;color-scheme:dark}:root[data-theme=green]{--on:#39ff6a;--on-hot:#8dffac;--on-dim:#39ff6a24}:root[data-theme=red]{--on:#ff3b30;--on-hot:#ff8a80;--on-dim:#ff3b3024}:root[data-theme=white]{--on:#e8e8e8;--on-hot:#fff;--on-dim:#e8e8e824}:root[data-theme=turquoise]{--on:#00d6d7;--on-hot:#7af0f0;--on-dim:#00d6d724}*{box-sizing:border-box}html{background:var(--bg)}body{background:var(--bg);color:var(--ink);font-family:var(--sans);-webkit-text-size-adjust:100%;flex-direction:column;min-height:100vh;margin:0;line-height:1.5;display:flex}[hidden]{display:none!important}a{color:var(--on)}a:hover{color:var(--on-hot)}pre,code{font-family:var(--mono)}code{color:var(--on);font-size:.92em}pre{border:1px solid var(--line2);color:var(--on);white-space:pre-wrap;word-break:break-word;background:#000;border-radius:6px;margin:12px 0;padding:10px 12px;font-size:13px;overflow-x:auto}pre code{color:inherit;font-size:inherit}.muted{color:var(--muted)}.sr{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;padding:0;position:absolute;overflow:hidden}.skip{top:8px;z-index:100;background:var(--on);color:#000;clip:rect(0 0 0 0);white-space:nowrap;border-radius:5px;width:1px;height:1px;padding:8px 12px;position:absolute;inset-inline-start:8px;overflow:hidden}.skip:focus{clip:auto;width:auto;height:auto;overflow:visible}html{overflow-x:clip}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--on);outline-offset:2px}button{font:inherit;color:inherit}.btn,.primary{cursor:pointer;font:700 12px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ink);background:linear-gradient(#171717 0 49%,#050505 49% 51%,#101010 51%);border:1px solid #262626;border-radius:5px;padding:9px 14px;text-decoration:none;display:inline-block}.btn:hover{color:#fff;border-color:#3a3a3a}.primary{color:#000;background:var(--on);border-color:var(--on)}.primary:hover{background:var(--on-hot);color:#000}.chip{font:600 12px var(--mono);border:1px solid var(--line2);color:var(--muted);background:#050505;border-radius:14px;padding:6px 10px;text-decoration:none}.chip.on,.chip:hover{color:var(--on);border-color:var(--on)}.bar{z-index:3;-webkit-backdrop-filter:blur(6px);border-bottom:1px solid var(--line);background:#030303eb;align-items:center;gap:14px;padding:12px 24px;display:flex;position:sticky;top:0}.brand{color:var(--on);align-items:center;gap:12px;text-decoration:none;display:inline-flex}.brand svg{fill:currentColor;width:64px;height:auto;display:block}.brand span{font:700 14px var(--mono);letter-spacing:.16em;text-transform:uppercase}.bar-tools{align-items:center;gap:8px;margin-left:auto;display:flex}.lang{position:relative}.lang summary{font:600 13px var(--sans);color:var(--muted);border:1px solid var(--line);cursor:pointer;background:0 0;border-radius:8px;align-items:center;gap:8px;padding:6px 10px;line-height:1;list-style:none;display:inline-flex}.lang summary::-webkit-details-marker{display:none}.lang summary:hover{color:var(--ink);border-color:var(--muted)}.lang-menu{z-index:50;background:var(--panel);border:1px solid var(--line2);border-radius:10px;flex-direction:column;gap:2px;min-width:230px;max-height:70vh;margin:0;padding:6px;list-style:none;display:flex;position:absolute;top:calc(100% + 6px);right:0;overflow:auto;box-shadow:0 12px 32px #0009}.lang-menu a{width:100%;font:600 13px var(--sans);color:var(--muted);border-radius:8px;align-items:center;gap:8px;padding:8px 10px;text-decoration:none;display:flex}.lang-menu a:hover{color:var(--ink);background:#ffffff0a}.lang-menu a.on{color:var(--on);background:#ffffff0a}.flag{border-radius:2px;flex:none;width:24px;height:16px;display:inline-block;position:relative;overflow:hidden;box-shadow:0 0 0 1px #ffffff2e}.flag img{object-fit:cover;width:24px;height:16px;display:block}.flag img+img{clip-path:polygon(100% 0,100% 100%,0 100%);position:absolute;top:0;left:0}@media (width<=560px){.lang summary .lang-name{display:none}}.nav{flex-wrap:wrap;gap:4px;width:100%;max-width:1100px;margin:0 auto;padding:12px 24px 0;display:flex}.nav a{color:var(--muted);font:700 12px var(--mono);letter-spacing:.12em;text-transform:uppercase;border-radius:6px;align-items:center;gap:10px;padding:9px 12px;text-decoration:none;display:inline-flex}.nav a:hover{color:var(--ink);background:#121212}.nav a.on{color:var(--on);box-shadow:inset 3px 0 0 var(--on);background:#141006}:root[data-theme=green] .nav a.on{background:#071409}:root[data-theme=red] .nav a.on{background:#160706}:root[data-theme=white] .nav a.on{background:#141414}:root[data-theme=turquoise] .nav a.on{background:#061414}main{flex:1;grid-template-columns:minmax(0,1fr);gap:18px;width:100%;max-width:1100px;margin:0 auto;padding:18px 24px 40px;display:grid}.hero{gap:14px;padding:8px 0 6px;display:grid}.hero .wordmark{width:min(640px,100%);height:auto;color:var(--on);display:block}.hero .wordmark .d-off{fill:var(--off)}.hero p.lead{color:var(--muted);max-width:60ch;margin:0;font-size:18px}.card{background:var(--panel);border:1px solid var(--line);border-radius:10px;min-width:0;padding:18px 20px}.card h2,h1.title{font:700 13px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--on);margin:0 0 8px}h1.title{font-size:20px}.lead{color:var(--muted);margin:0 0 12px}.when{color:var(--faint);font:12px var(--mono)}.toc{flex-wrap:wrap;gap:6px;margin:0 0 14px;padding:0;list-style:none;display:flex}.prose{max-width:72ch;font-size:16px}.prose>:first-child{margin-top:0}.prose h2{font:700 13px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--on);margin:28px 0 8px;scroll-margin-top:70px}.prose h3{font:700 15px var(--sans);color:var(--ink);margin:20px 0 6px;scroll-margin-top:70px}.prose p,.prose ul,.prose ol{margin:0 0 12px}.prose li{margin:4px 0}.prose li::marker{color:var(--on)}.prose hr{border:0;border-top:1px solid var(--line);margin:20px 0}.prose blockquote{border-left:3px solid var(--on);color:var(--muted);background:#060606;border-radius:0 6px 6px 0;margin:12px 0;padding:8px 14px}.prose table{border-collapse:collapse;width:100%;margin:12px 0;font-size:14px}.prose th,.prose td{border-top:1px solid var(--line);text-align:left;vertical-align:top;padding:8px 10px}.prose th{font:600 11px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);border-top:0}.prose td:last-child{font-family:var(--mono);font-size:13px}.prose img{border:1px solid var(--line2);background:#000;border-radius:6px;max-width:100%;height:auto;display:block}.prose img[src*="/img/part-"]{vertical-align:middle;border-radius:8px;width:56px;height:56px;margin-inline-end:12px;display:inline-block}@media (width>=1000px){.prose{max-width:none}.prose>:where(p,ul,ol,h2,h3,blockquote,table,hr){max-width:72ch}.prose>p:has(>img[src*="/img/fig-"]){float:right;clear:right;width:340px;max-width:340px;margin:4px 0 14px 28px}[dir=rtl] .prose>p:has(>img[src*="/img/fig-"]){float:left;clear:left;margin:4px 28px 14px 0}.prose h2{clear:both}}.prose strong{color:#fff}.prose kbd{font:12px var(--mono);border:1px solid var(--line2);color:var(--ink);background:#000;border-radius:4px;padding:1px 5px}.next{flex-wrap:wrap;align-items:center;gap:14px;display:flex}.next .k{font:600 11px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}.tiles{grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px;display:grid}.tile{background:var(--panel);border:1px solid var(--line);min-width:0;color:var(--ink);border-radius:10px;padding:14px 16px;text-decoration:none;display:block}.tile:hover{border-color:var(--on);color:var(--ink)}.tile .k{font:700 12px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--on);margin-bottom:4px;display:block}.tile .d{color:var(--muted);font-size:13.5px;display:block}footer{border-top:1px solid var(--line);padding:20px 24px 28px}.foot{gap:16px;max-width:1100px;margin:0 auto;display:grid}.foot-row{grid-template-columns:repeat(auto-fit,minmax(320px,1fr));align-items:start;gap:16px 32px;display:grid}.beer{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.beer .what{flex:200px;min-width:0}.beer b{font:600 11px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);display:block}.beer span{color:var(--faint);font-size:12px;display:block}.beer .btn{padding:7px 12px;font-size:11px}.colour{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.colour .what b{font:600 11px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);display:block}.colour .what span{color:var(--faint);font-size:12px;display:block}.swatches{gap:8px;display:flex}.swatch{cursor:pointer;background:var(--c);border:2px solid #222;border-radius:50%;width:30px;height:30px;padding:0;position:relative}.swatch.on{border-color:#fff}.swatch.on:after{content:"";background:#0000008c;border-radius:50%;position:absolute;inset:8px}.swatch[data-theme=amber]{--c:#ffb000}.swatch[data-theme=green]{--c:#39ff6a}.swatch[data-theme=red]{--c:#ff3b30}.swatch[data-theme=white]{--c:#e8e8e8}.swatch[data-theme=turquoise]{--c:#00d6d7}.fine{color:var(--faint);flex-wrap:wrap;gap:6px 16px;font-size:12px;display:flex}.fine a{color:var(--ink)}@media (width<=760px){.bar{padding:10px 16px;padding-top:max(10px, env(safe-area-inset-top))}.brand svg{width:52px}.nav{gap:2px;padding:10px 12px 0}.nav a{letter-spacing:.08em;padding:8px 10px;font-size:11px}main{padding:14px 16px 28px}.card{padding:14px}.hero p.lead{font-size:16px}footer{padding:16px 16px 24px}}[dir=rtl] .bar-tools{margin-left:0;margin-right:auto}[dir=rtl] .lang-menu{left:0;right:auto}[dir=rtl] .nav a.on{box-shadow:inset -3px 0 0 var(--on)}[dir=rtl] .prose blockquote{border-left:0;border-right:3px solid var(--on);border-radius:6px 0 0 6px}[dir=rtl] .prose th,[dir=rtl] .prose td{text-align:right}[dir=rtl] pre,[dir=rtl] code,[dir=rtl] kbd{text-align:left;direction:ltr;unicode-bidi:isolate}html:lang(ar) .nav a,html:lang(ar) .prose h2,html:lang(ar) .card h2,html:lang(ar) h1.title,html:lang(ar) .tile .k,html:lang(ar) .beer b,html:lang(ja) .nav a,html:lang(ja) .prose h2,html:lang(ja) .card h2,html:lang(ja) h1.title,html:lang(ja) .tile .k,html:lang(ja) .beer b,html:lang(ko) .nav a,html:lang(ko) .prose h2,html:lang(ko) .card h2,html:lang(ko) h1.title,html:lang(ko) .tile .k,html:lang(ko) .beer b,html:lang(zh) .nav a,html:lang(zh) .prose h2,html:lang(zh) .card h2,html:lang(zh) h1.title,html:lang(zh) .tile .k,html:lang(zh) .beer b{letter-spacing:0}