:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--c-ink:#1d2a24;--c-paper:#f6efe0;--c-paper-2:#e9dfc7;--c-track:#c4512f;--c-track-dark:#ab4325;--c-track-line:#fbf6ea;--c-grass:#3f8a43;--c-grass-light:#4b9c4f;--c-sky-top:#8fcbe8;--c-sky-bottom:#eaf4f1;--c-stand:#38405c;--c-board:#1f3d34;--c-board-edge:#11271f;--c-frame:#9a6532;--c-frame-dark:#6b4220;--c-chalk:#f4f1e8;--c-chalk-dim:#b9c4b8;--c-chalk-yellow:#f6d55c;--c-chalk-blue:#78bff0;--c-chalk-pink:#f59ac0;--c-chalk-green:#9be09f;--c-whistle:#ffc933;--c-good:#2e9e5b;--c-bad:#d62839;--c-mat:#2f6fd0;--c-mat-dark:#1f4fa0;--c-runner:#2457d6;--c-surround:#17291f;--c-focus:#1b5fd6;--font-display:"Alfa Slab One", Georgia, Rockwell, serif;--font-body:Nunito, "Segoe UI", system-ui, sans-serif}html,body{background:var(--c-surround);height:100%;color:var(--c-ink);font-family:var(--font-body);margin:0;overflow:hidden}#game{width:100%;height:100%}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}:focus-visible{outline:3px solid var(--c-focus);outline-offset:2px}body{--camera-w:440px}body[data-camera=small]{--camera-w:220px}body[data-camera=medium]{--camera-w:320px}#hud{z-index:2;width:clamp(190px, min(var(--camera-w), calc((100vw - min(100vw, 60vh)) / 2 - 24px), calc((100vh - 240px) * 4 / 3)), var(--camera-w));overscroll-behavior:contain;scrollbar-width:none;flex-direction:column;gap:8px;max-height:calc(100vh - 24px);display:flex;position:fixed;top:12px;left:12px;overflow-y:auto}#hud::-webkit-scrollbar{display:none}#menu-button{border:2.5px solid var(--c-ink);background:var(--c-paper);color:var(--c-ink);box-shadow:0 3px 0 var(--c-ink);font:800 .9rem/1.2 var(--font-body);letter-spacing:.02em;cursor:pointer;border-radius:999px;align-self:flex-start;padding:7px 14px;transition:transform 80ms,box-shadow 80ms}#menu-button:hover{box-shadow:0 4px 0 var(--c-ink);transform:translateY(-1px)}#menu-button:active{box-shadow:0 1px 0 var(--c-ink);transform:translateY(2px)}#camera-status,#hint{border:2px solid var(--c-ink);background:var(--c-paper);font:700 .78rem/1.4 var(--font-body);border-radius:10px;margin:0;padding:7px 10px 7px 30px;position:relative}#hint{background:var(--c-paper-2);padding-left:10px;font-weight:600}#camera-status:before{content:"";border:2px solid var(--c-ink);background:var(--c-paper-2);border-radius:50%;width:11px;height:11px;position:absolute;top:12px;left:10px}#camera-status[data-level=ok]:before{background:var(--c-good)}#camera-status[data-level=warn]:before{background:var(--c-whistle)}#camera-status[data-level=error]:before{background:var(--c-bad)}#preview{box-sizing:border-box;aspect-ratio:4/3;border:3px solid var(--c-paper);width:100%;box-shadow:0 3px 0 var(--c-ink), 0 0 0 2px var(--c-ink);background:#000;border-radius:12px;position:relative;overflow:hidden}#preview video,#preview canvas{object-fit:contain;width:100%;height:100%;position:absolute;inset:0}#preview.mirrored video{transform:scaleX(-1)}#preview-movement{background:var(--c-whistle);color:var(--c-ink);font:400 .85rem/1.2 var(--font-display);opacity:0;border-radius:6px;padding:3px 9px;transition:opacity .25s;position:absolute;bottom:6px;right:6px}#preview-movement.show{opacity:1}body[data-layout=side] #game{inset:0 0 0 var(--side-column,232px);width:auto;height:auto;position:fixed}body[data-layout=side] #hud{width:calc(var(--side-column,232px) - 24px)}body[data-layout=side] .meter{grid-template-columns:50px 1fr 62px;gap:6px;font-size:.68rem}body[data-layout=stack]{--hud-bar:calc(var(--stack-bar,104px) + env(safe-area-inset-bottom,0px));--top-bar:calc(48px + env(safe-area-inset-top,0px))}body[data-layout=stack]:before{content:"";height:var(--top-bar);background:var(--c-surround);z-index:1;position:fixed;inset:0 0 auto}body[data-layout=stack] #menu-button{top:calc(6px + env(safe-area-inset-top,0px));z-index:3;padding:9px 16px;position:fixed;left:12px}body[data-layout=stack] #game{inset:var(--top-bar) 0 var(--hud-bar) 0;width:auto;height:auto;position:fixed}body[data-layout=stack] #hud{box-sizing:border-box;width:auto;height:var(--hud-bar);padding:8px 12px calc(8px + env(safe-area-inset-bottom,0px));background:var(--c-surround);flex-direction:row;align-items:center;gap:10px;inset:auto 0 0}body[data-layout=stack] #camera-status{flex:1;min-width:0}body[data-layout=stack] #preview{flex:none;width:112px}body[data-layout=stack] .meters,body[data-layout=stack] #hint{display:none}body{overscroll-behavior:none;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}#game{touch-action:none}@media (height<=560px){.menu{align-items:flex-start}#hint{display:none}}.meters{border:2px solid var(--c-ink);background:var(--c-paper);border-radius:10px;flex-direction:column;gap:5px;padding:8px 10px;display:flex}.meters[hidden]{display:none}.meter{font:800 .72rem/1.2 var(--font-body);grid-template-columns:58px 1fr 74px;align-items:center;gap:8px;display:grid}.meter-value{text-align:right;font-variant-numeric:tabular-nums}.meter-track{border:2px solid var(--c-ink);background:var(--c-paper-2);border-radius:999px;height:12px;position:relative;overflow:hidden}.meter-fill{background:var(--c-chalk-blue);width:0;position:absolute;inset:0 auto 0 0}.meter.hit .meter-fill{background:var(--c-good)}.meter-tick{background:var(--c-ink);width:3px;margin-left:-1.5px;position:absolute;top:0;bottom:0}.meter-marker{background:var(--c-track);width:8px;box-shadow:0 0 0 2px var(--c-paper);border-radius:4px;margin-left:-4px;position:absolute;top:-1px;bottom:-1px}.meter.hit .meter-marker{background:var(--c-good)}body.calibrating{--calib-w:clamp(220px, min(440px, (100vh - 440px) * 4 / 3), calc(100vw - 24px))}body.calibrating #menu-button,body.calibrating #camera-status,body.calibrating #hint{display:none}body.calibrating #hud{z-index:25;box-sizing:content-box;width:var(--calib-w);background:0 0;flex-direction:column;align-items:stretch;height:auto;padding:0;position:fixed;inset:10px auto auto 50%;transform:translate(-50%)}body.calibrating #preview{width:100%}body.calibrating .meters{display:flex}body.calibrating .meters[hidden]{display:none}@media (height<=520px) and (orientation:landscape){body.calibrating{--calib-w:42vw}body.calibrating #hud{top:12px;left:12px;transform:none}body.calibrating .menu{align-items:center;padding-left:calc(42vw + 28px)}body.calibrating .menu-card{min-height:0;max-height:calc(100vh - 24px)}}body.calibrating .menu{-webkit-backdrop-filter:none;backdrop-filter:none;background:#17291f73;align-items:flex-end;padding-bottom:12px}body.calibrating .menu-card{max-height:calc(100vh - 110px - var(--calib-w) * .75);min-height:250px}[data-screen=calibrate] h2{margin-bottom:12px;padding:12px 20px 10px;font-size:1.25rem}[data-screen=calibrate]{padding-bottom:16px}[data-screen=calibrate] .calib-instruction{min-height:2.6em;margin-bottom:8px;font-size:1.1rem}[data-screen=calibrate] .menu-actions{flex-direction:row;margin-block:12px 0}[data-screen=calibrate] .menu-actions button{flex:1;padding-block:10px}[data-screen=calibrate] .calib-steps{counter-reset:calib;flex-flow:wrap;gap:4px 14px;margin-block:10px 0;padding:0;font-size:.85rem;list-style:none;display:flex}[data-screen=calibrate] .calib-steps li{counter-increment:calib;white-space:nowrap}[data-screen=calibrate] .calib-steps li:before{content:counter(calib) ". "}.presence-banner{z-index:15;border:3px solid var(--c-ink);background:var(--c-whistle);width:min(420px,100% - 32px);box-shadow:0 5px 0 var(--c-ink);color:var(--c-ink);font:800 1.1rem/1.4 var(--font-body);text-align:center;border-radius:14px;padding:18px 22px;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)rotate(-1.5deg)}.presence-banner[hidden]{display:none}.menu{z-index:20;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#17291fb8;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0;overflow-y:auto}.menu[hidden]{display:none}.menu-card{border:3px solid var(--c-ink);background:var(--c-paper);width:min(520px,100%);max-height:calc(100vh - 32px);box-shadow:0 6px 0 var(--c-ink), 0 28px 60px #0006;scrollbar-width:thin;scrollbar-color:var(--c-ink) var(--c-paper-2);border-radius:18px;overflow-y:auto}.menu-card section{padding-bottom:24px}.menu-card section>:not(h1):not(h2){margin-inline:24px}.menu-card h1,.menu-card h2{background:var(--c-track);border-bottom:5px dashed var(--c-track-line);color:var(--c-track-line);font:400 1.9rem/1.1 var(--font-display);letter-spacing:.01em;text-wrap:balance;margin:0 0 18px;padding:20px 24px 16px}.menu-card h2{font-size:1.55rem}.lead{margin-block:0 20px;font-size:1.05rem;line-height:1.5}.menu-actions{flex-direction:column;gap:12px;margin-block:16px;display:flex}.menu-card button{border:2.5px solid var(--c-ink);background:var(--c-paper);color:var(--c-ink);box-shadow:0 3px 0 var(--c-ink);font:800 1rem/1.2 var(--font-body);text-align:center;cursor:pointer;border-radius:12px;padding:12px 16px;transition:transform 80ms,box-shadow 80ms}.menu-card button:hover:not(:disabled){box-shadow:0 4px 0 var(--c-ink);transform:translateY(-1px)}.menu-card button:active:not(:disabled){box-shadow:0 1px 0 var(--c-ink);transform:translateY(2px)}.menu-card button.primary{background:var(--c-whistle);padding-block:15px;font-size:1.15rem}.menu-card button:disabled{color:#1d2a248c;box-shadow:none;cursor:not-allowed;border-color:#1d2a2473}.menu-status{min-height:1.4em;color:var(--c-good);margin-block:4px 0;font-size:.9rem;font-weight:800}.menu-status[data-level=warn]{color:#8a5a00}.menu-status[data-level=error]{color:var(--c-bad)}.credit{text-align:center;border-top:2px dashed #1d2a244d;margin-block:14px 0;padding-top:12px;font-size:.85rem}.fineprint{opacity:.8;margin-block:14px 0;font-size:.82rem;line-height:1.5}fieldset{border:2px solid var(--c-ink);border-radius:12px;min-width:0;margin-block:0 16px;padding:12px 14px 14px}legend{font:800 .78rem/1 var(--font-body);letter-spacing:.08em;text-transform:uppercase;padding:0 6px}.field{flex-direction:column;gap:6px;margin-block:0 16px;display:flex}.field label{font-weight:800}.field select{border:2.5px solid var(--c-ink);color:var(--c-ink);font:700 1rem var(--font-body);background:#fffaf0;border-radius:10px;padding:10px 12px}.field input[type=range]{accent-color:var(--c-track)}.field input[type=range]:disabled{opacity:.4}.field label output{float:right;font-variant-numeric:tabular-nums;font-weight:800}.check-list{flex-direction:column;gap:8px;display:flex}.check{cursor:pointer;align-items:center;gap:10px;min-height:28px;font-weight:700;display:flex}.check input{width:20px;height:20px;accent-color:var(--c-track)}.menu-card kbd{border:2px solid var(--c-ink);background:var(--c-paper);font:800 .85em/1.5 var(--font-body);border-bottom-width:3px;border-radius:6px;padding:0 7px;display:inline-block}.howto-pages h3{font:400 1.25rem/1.2 var(--font-display);text-wrap:balance;margin:0 0 8px}.howto-pages p{margin-block:0 12px;line-height:1.5}.howto-pages article>:last-child{margin-bottom:0}.howto-figures{gap:10px;margin-block:4px 14px;display:grid}.howto-figures.three{grid-template-columns:repeat(3,1fr)}.howto-figures.two{grid-template-columns:repeat(2,1fr)}.howto-pages figure{text-align:center;margin:0}.howto-pages figure svg{border:2px solid var(--c-ink);background:var(--c-paper-2);border-radius:10px;width:100%;height:auto;display:block}.howto-pages figcaption{margin-top:6px;font-size:.82rem;font-weight:700;line-height:1.35}.howto-pages figcaption strong{font-weight:800;display:block}.menu-card section .howto-camera{max-width:230px;margin:0 auto 12px}.howto-steps{counter-reset:step;flex-direction:column;gap:8px;margin:0 0 12px;padding:0;line-height:1.45;list-style:none;display:flex}.howto-steps li{counter-increment:step;grid-template-columns:28px 1fr;gap:10px;display:grid}.howto-steps li:before{content:counter(step);background:var(--c-ink);width:28px;height:28px;color:var(--c-paper);font:400 .9rem/1 var(--font-display);border-radius:50%;place-items:center;display:grid}.howto-list{flex-direction:column;gap:8px;margin:0 0 12px;padding-left:20px;line-height:1.45;display:flex}.howto-tip{border:2px solid var(--c-ink);background:var(--c-paper-2);border-radius:10px;padding:10px 12px;font-size:.9rem}.howto-keys{flex-direction:column;margin:0;display:flex}.howto-keys>div{border-bottom:2px dashed #1d2a2440;grid-template-columns:9.5rem 1fr;align-items:center;gap:12px;padding-block:7px;display:grid}.howto-keys dt,.howto-keys dd{margin:0}.howto-keys dd{font-weight:700}.howto-nav{align-items:center;gap:12px;margin-block:16px 0;display:flex}.howto-nav button{flex:1}.howto-dots{gap:6px;display:flex}.howto-dots i{border:2px solid var(--c-ink);border-radius:50%;width:9px;height:9px}.howto-dots i[data-active]{background:var(--c-ink)}.svg-shadow{fill:var(--c-ink);opacity:.22}.svg-ink{fill:var(--c-ink)}.svg-paper{fill:var(--c-paper)}.svg-bad{fill:var(--c-bad)}.svg-whistle{fill:var(--c-whistle)}.svg-wood{fill:var(--c-frame-dark)}.svg-mat{fill:var(--c-mat)}.svg-mat-top{fill:var(--c-chalk-blue)}.svg-mat-dark{fill:var(--c-mat-dark)}.svg-stitch{fill:none;stroke:var(--c-mat-dark);stroke-width:1.5px}.svg-outline{fill:none;stroke:var(--c-ink);stroke-width:2px}.svg-line{fill:none;stroke:var(--c-ink);stroke-width:2px;stroke-dasharray:5 5;opacity:.5}.svg-ans-a,.svg-ans-b,.svg-ans-c{stroke:var(--c-ink);stroke-width:2.5px}.svg-ans-a{fill:var(--c-chalk-blue)}.svg-ans-b{fill:var(--c-chalk-green)}.svg-ans-c{fill:var(--c-chalk-yellow)}.howto-pages svg text{fill:var(--c-ink);font:400 15px var(--font-display)}.svg-arrow{fill:none;stroke:var(--c-ink);stroke-width:2.5px;stroke-linecap:round;stroke-linejoin:round}.svg-frame{fill:var(--c-paper);stroke:var(--c-ink);stroke-width:3px}.svg-runner{fill:var(--c-runner);stroke:var(--c-paper);stroke-width:2px}.svg-runner-limb{fill:none;stroke:var(--c-runner);stroke-width:7px;stroke-linecap:round}@media (width<=460px){.howto-figures.two{grid-template-columns:1fr}.howto-keys>div{grid-template-columns:7.5rem 1fr}}.calib-instruction{min-height:3.2em;margin-block:0 12px;font-size:1.2rem;font-weight:800;line-height:1.4}.calib-progress{border:2.5px solid var(--c-ink);background:var(--c-paper-2);border-radius:999px;height:16px;overflow:hidden}.calib-progress>div{background:var(--c-track);width:0;height:100%;transition:width .15s linear}.calib-steps{color:#1d2a2499;flex-direction:column;gap:4px;margin-block:16px 0;padding-left:22px;font-weight:700;display:flex}.calib-steps li[data-state=active]{color:var(--c-ink);font-weight:800}.calib-steps li[data-state=done]{color:var(--c-good)}.calib-steps li[data-state=skipped]{text-decoration:line-through}body.high-contrast .menu-card{color:#fff;box-shadow:none;background:#000;border-color:#fff}body.high-contrast .menu-card h1,body.high-contrast .menu-card h2{color:#fff;background:#000;border-bottom:5px dashed #fff}body.high-contrast .menu-card button,body.high-contrast #menu-button{color:#fff;box-shadow:none;background:#000;border-color:#fff}body.high-contrast .menu-card button.primary{color:#000;background:#ffe600}body.high-contrast .menu-card button:disabled{color:#aaa;border-color:#aaa}body.high-contrast fieldset,body.high-contrast .field select,body.high-contrast .calib-progress{border-color:#fff}body.high-contrast .field select{color:#fff;background:#000}body.high-contrast .calib-progress{background:#000}body.high-contrast .calib-progress>div{background:#ffe600}body.high-contrast .howto-steps li:before{color:#000;background:#fff}body.high-contrast .howto-pages figure svg{background:#f6efe0;border-color:#fff}body.high-contrast .howto-tip,body.high-contrast .menu-card kbd{color:#fff;background:#000;border-color:#fff}body.high-contrast .howto-keys>div{border-bottom-color:#fff6}body.high-contrast .howto-dots i{border-color:#fff}body.high-contrast .howto-dots i[data-active]{background:#fff}body.high-contrast .credit{color:#fff;border-top-color:#ffffff80}body.high-contrast .menu-status,body.high-contrast .menu-status[data-level],body.high-contrast .calib-steps,body.high-contrast .calib-steps li[data-state]{color:#fff}body.high-contrast #camera-status,body.high-contrast #hint{color:#fff;background:#000;border-color:#fff}body.high-contrast .presence-banner{color:#ffe600;box-shadow:none;background:#000;border-color:#fff}body.reduced-motion *,body.reduced-motion :before,body.reduced-motion :after{transition-duration:.001ms!important;animation-duration:.001ms!important}body.reduced-motion .presence-banner{transform:translate(-50%,-50%)}@media (prefers-reduced-motion:reduce){.calib-progress>div,#preview-movement,.menu-card button,#menu-button{transition:none}}.touch-controls{z-index:3;bottom:calc(10px + env(safe-area-inset-bottom,0px));box-sizing:border-box;pointer-events:none;justify-content:space-between;align-items:flex-end;width:min(100vw,60vh);padding:0 10px;display:none;position:fixed;left:50%;transform:translate(-50%)}@media (pointer:coarse){.touch-controls{display:flex}}body[data-layout=stack] .touch-controls,body[data-layout=side] .touch-controls{display:flex}body[data-layout=stack] .touch-controls{bottom:calc(var(--hud-bar) + 10px);width:100vw}body[data-layout=side] .touch-controls{left:calc(50% + var(--side-column,232px) / 2);width:min(100vw - var(--side-column,232px), 60vh)}body.calibrating .touch-controls{display:none}.touch-pad{pointer-events:auto;gap:10px;display:flex}.touch-controls button{border:2.5px solid var(--c-ink);background:color-mix(in srgb, var(--c-paper) 88%, transparent);min-width:62px;height:62px;color:var(--c-ink);box-shadow:0 4px 0 var(--c-ink);font:800 1.35rem/1 var(--font-body);touch-action:none;cursor:pointer;border-radius:18px;align-content:center;place-items:center;padding:0 10px;display:grid}.touch-controls button span{letter-spacing:.04em;text-transform:uppercase;font-size:.62rem}.touch-controls button:active{box-shadow:0 1px 0 var(--c-ink);background:var(--c-paper);transform:translateY(3px)}body.high-contrast .touch-controls button{background:var(--c-paper)}
