:root{--bg:#fff;--fg:#262626;--muted:#737373;--line:#e5e5e5;--panel:#eff6ff;--accent:#1d4ed8;--accent-fg:#fff;--good:#10b981;--bad:#dc2626;--track:#e5e5e5;--code:#f7f4ef;--pill-a:#fff;--pill-b:#1d4ed8;--ink:#262626;--font:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;--mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#171717;--fg:#f5f5f5;--muted:#a3a3a3;--line:#333;--panel:#1e2a44;--accent:#93c5fd;--accent-fg:#0b1220;--track:#3a3a3a;--code:#222;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}:root[data-theme=dark]{--bg:#171717;--fg:#f5f5f5;--muted:#a3a3a3;--line:#333;--panel:#1e2a44;--accent:#93c5fd;--accent-fg:#0b1220;--track:#3a3a3a;--code:#222;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}body{background:var(--bg);color:var(--fg);font-family:var(--font);font-size:15px;line-height:1.5}body:before{content:"";height:env(safe-area-inset-top,0px);z-index:10;background:var(--bg);position:fixed;inset:0 0 auto}.bar{top:env(safe-area-inset-top,0px);z-index:9;background:var(--bg);border-bottom:1px solid var(--line);padding-block:8px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));position:sticky}.bar-inner{flex-wrap:wrap;align-items:end;gap:8px 16px;max-width:960px;margin:0 auto;display:flex}h1{letter-spacing:-.01em;text-wrap:balance;margin:0 0 40px;font-size:18px;font-weight:700}.bar .ctl{flex:420px}main{padding-block:20px 32px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}.stack{gap:28px;max-width:960px;margin:0 auto;display:grid}.floor{gap:8px;display:grid}.art>svg{width:100%;height:auto;display:block}.ctl{grid-template-columns:auto auto minmax(0,1fr) auto auto;align-items:end;gap:4px 12px;min-width:0;display:grid}.ctl .name{padding-bottom:12px;font-size:15px;font-weight:600}.count{color:var(--muted);font-variant-numeric:tabular-nums;margin-left:6px;font-size:12px;font-weight:400}.midway .person{animation:none}.end{color:var(--muted);text-transform:uppercase;letter-spacing:.06em;padding-bottom:14px;font-size:12px}.pct{font-variant-numeric:tabular-nums;text-align:right;min-width:3.5ch;color:var(--muted);padding-bottom:12px;font-size:14px;font-weight:600}@media (width<=560px){.ctl{grid-template-columns:auto minmax(0,1fr) auto}.ctl .name{grid-column:1/-1;padding-bottom:0}.pct{grid-column:3}}.range{align-items:flex-end;min-width:0;display:flex}.range input{z-index:1;flex:1 1 0;min-width:0;position:relative}.range .face{z-index:0;flex:0 0 90px;width:90px;height:104px;margin-left:-58px;position:relative}input[type=range]{appearance:none;cursor:pointer;--p:0%;--pc:#dc2626;background:0 0;width:100%;height:44px;margin:0}input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(90deg,var(--pc) var(--p),var(--track) var(--p) calc(100% - 60px),transparent calc(100% - 60px));border-radius:3px;height:6px}input[type=range]::-moz-range-track{background:linear-gradient(90deg,var(--pc) var(--p),var(--track) var(--p) calc(100% - 60px),transparent calc(100% - 60px));border-radius:3px;height:6px}input[type=range]::-webkit-slider-thumb{appearance:none;border:2px solid var(--ink);box-sizing:border-box;background:linear-gradient(90deg,var(--pill-a) 0 50%,var(--ink) 50% calc(50% + 1.5px),var(--pill-b) calc(50% + 1.5px) 100%);border-radius:11px;width:44px;height:22px;margin-top:-8px;box-shadow:inset 0 3px #ffffff8c,0 2px 4px #00000040}input[type=range]::-moz-range-thumb{border:2px solid var(--ink);box-sizing:border-box;background:linear-gradient(90deg,var(--pill-a) 0 50%,var(--ink) 50% calc(50% + 1.5px),var(--pill-b) calc(50% + 1.5px) 100%);border-radius:11px;width:40px;height:18px;box-shadow:inset 0 3px #ffffff8c,0 2px 4px #00000040}input[type=range]:focus-visible{outline:3px solid var(--accent);outline-offset:2px;border-radius:4px}.how{border-top:1px solid var(--line);gap:12px;max-width:960px;margin:28px auto 0;padding-top:20px;display:grid}.how h2{margin:0;font-size:15px;font-weight:600}.how p{max-width:65ch;color:var(--muted);margin:0}pre{background:var(--code);border:1px solid var(--line);font-family:var(--mono);border-radius:6px;min-width:0;margin:0;padding:12px 14px;font-size:13px;line-height:1.5;overflow-x:auto}@media (prefers-reduced-motion:reduce){.art *,.face *{animation-duration:.01ms!important;animation-iteration-count:1!important}}.bad,.mid{display:none}.rundown .bad{display:inline}.rundown .good{display:none}.person{animation:1.6s ease-in-out infinite bob}.rundown .person{animation:4.5s ease-in-out infinite sag}.fx{transform-box:fill-box;transform-origin:50%}.twinkle{animation:1.6s ease-in-out infinite twinkle}.spark{animation:1.1s ease-out infinite spark}.puff{animation:2.4s ease-out infinite rise}.steam{animation:1.8s ease-out infinite steam}.blink{animation:1s step-end infinite blink}.pulse{animation:1.4s ease-in-out infinite pulse}.glow{animation:2.2s ease-in-out infinite glow}.rundown .flick{animation:2.6s linear infinite flicker}.drift{animation:9s ease-in-out infinite alternate drift}.rain{animation:.55s linear infinite rain}.spin{animation:1s linear infinite spin}.rundown .spin{animation-duration:6s;animation-timing-function:steps(8,end)}.wave{animation:1s ease-in-out infinite wave}.tap{transform-box:fill-box;transform-origin:50% 0;animation:.7s ease-in-out infinite tap}.zz{fill:#1d4ed8;font-family:Inter,Arial,sans-serif;font-weight:700;animation:2.4s ease-out infinite zz}.shake{animation:.35s linear infinite shake}.rundown .sign{transform-box:fill-box;transform-origin:0 0;transform:rotate(-4deg)}.belt-line{animation:.5s linear infinite belt}.rundown .belt-line{animation-duration:4s;animation-timing-function:steps(6,end)}.slide{animation:2.4s linear infinite slide}.rundown .slide{animation-duration:14s;animation-timing-function:steps(24,end)}.grow{transform-box:fill-box;transform-origin:50% 100%;animation:1.4s ease-out both grow}.shrink{transform-box:fill-box;transform-origin:50% 100%;animation:1.4s ease-out both shrink}.draw{animation:1.6s ease-out both draw}.fly{animation:5s ease-in-out infinite fly}.nod{animation:1.2s ease-in-out infinite nod}.print{animation:2.2s ease-in-out infinite print}@keyframes bob{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}@keyframes sag{0%,to{transform:translateY(0)}50%{transform:translateY(3px)}}@keyframes flicker{0%,to{opacity:1}8%{opacity:.15}12%{opacity:1}43%{opacity:1}46%{opacity:.1}52%{opacity:1}}@keyframes blink{0%,to{opacity:1}50%{opacity:.15}}@keyframes glow{0%,to{opacity:.25}50%{opacity:1}}@keyframes rise{0%{opacity:.85;transform:translateY(0)scale(.6)}to{opacity:0;transform:translateY(-46px)scale(1.5)}}@keyframes steam{0%{opacity:.9;transform:translateY(0)}to{opacity:0;transform:translateY(-24px)}}@keyframes spark{0%{opacity:0;transform:scale(0)}25%{opacity:1;transform:scale(1.2)}60%{opacity:1;transform:scale(.8)}to{opacity:0;transform:scale(0)}}@keyframes twinkle{0%,to{opacity:.2;transform:scale(.3)}50%{opacity:1;transform:scale(1)}}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.3)}}@keyframes rain{0%{transform:translateY(-40px)}to{transform:translateY(0)}}@keyframes drift{0%{transform:translate(0)}to{transform:translate(40px)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes wave{0%,to{transform:rotate(0)}50%{transform:rotate(-22deg)}}@keyframes tap{0%,to{transform:rotate(0)}50%{transform:rotate(-14deg)}}@keyframes zz{0%{opacity:0;transform:translate(0)}25%{opacity:1}to{opacity:0;transform:translate(12px,-26px)}}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-1.5px,1px)}75%{transform:translate(1.5px,-1px)}}@keyframes belt{to{stroke-dashoffset:-24px}}@keyframes slide{to{transform:translate(100px)}}@keyframes grow{0%{transform:scaleY(.15)}to{transform:scaleY(1)}}@keyframes shrink{0%{transform:scaleY(1)}to{transform:scaleY(.2)}}@keyframes draw{to{stroke-dashoffset:0}}@keyframes fly{0%{opacity:0;transform:translate(0)rotate(0)}10%{opacity:1}50%{transform:translate(130px,-34px)rotate(-8deg)}90%{opacity:1}to{opacity:0;transform:translate(280px,6px)rotate(6deg)}}@keyframes nod{0%,to{transform:rotate(0)}50%{transform:rotate(8deg)}}@keyframes print{0%{opacity:0;transform:translateY(0)}20%{opacity:1}to{opacity:1;transform:translateY(18px)}}