@font-face{font-family:Fredoka;src:url(/fonts/Fredoka.woff2)format("woff2");font-weight:400 700;font-style:normal;font-display:swap}:root{--bg:#e9ebe6;--grid:#d3d6ce;--ink:#17161d;--ink-soft:#34323f;--panel-text:#e9ebe6;--font:"Fredoka", ui-rounded, "SF Pro Rounded", system-ui, -apple-system, "Segoe UI", sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{background:var(--bg);height:100%;color:var(--ink);font-family:var(--font);touch-action:none;overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;margin:0;overflow:hidden}canvas#game{width:100%;height:100%;display:block;position:fixed;inset:0}#hint{left:calc(12px + env(safe-area-inset-left,0px));top:calc(10px + env(safe-area-inset-top,0px));opacity:.55;pointer-events:none;margin:0;font-size:12px;line-height:1.4;position:fixed}#touch{display:none}.touch-ui #touch,body.force-touch #touch{display:block}.touch-ui #hint,body.force-touch #hint{display:none}#touch .pad{left:calc(16px + env(safe-area-inset-left,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px));gap:14px;display:flex;position:fixed}#touch .jump{right:calc(20px + env(safe-area-inset-right,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px));position:fixed}#touch button{border:3px solid var(--ink);width:88px;height:88px;color:var(--ink);touch-action:none;background:#e9ebe6f0;border-radius:0;place-items:center;padding:0;display:grid;box-shadow:0 0 0 3px #e9ebe6f0}#touch .jump{width:104px;height:104px}#touch button.down{color:var(--ink);background:#e69f00}@media (max-height:460px){#touch button{width:72px;height:72px}#touch .jump{width:88px;height:88px}#touch svg{width:36px;height:36px}}#touch svg{fill:none;stroke:currentColor;stroke-width:3.5px;stroke-linecap:square;stroke-linejoin:miter;pointer-events:none;width:44px;height:44px}#tune-toggle{top:calc(8px + env(safe-area-inset-top,0px));right:calc(8px + env(safe-area-inset-right,0px));z-index:20;font:600 13px/1 var(--font);background:var(--bg);color:var(--ink);border:2px solid var(--ink);touch-action:manipulation;border-radius:0;padding:9px 12px;display:none;position:fixed}body.solo #tune-toggle{display:block}#tune-toggle[aria-expanded=true]{background:var(--ink);color:var(--bg)}#tune{z-index:10;width:min(320px,48vw);padding:calc(52px + env(safe-area-inset-top,0px)) calc(14px + env(safe-area-inset-right,0px)) calc(16px + env(safe-area-inset-bottom,0px)) 14px;background:var(--ink);color:var(--panel-text);touch-action:pan-y;overscroll-behavior:contain;font-size:12px;position:fixed;top:0;bottom:0;right:0;overflow-y:auto}#tune[hidden]{display:none}#tune pre{font:inherit;white-space:pre-wrap;color:#b9bdb3;margin:0 0 14px;line-height:1.5}#tune .row{margin-bottom:12px}#tune .row label{justify-content:space-between;margin-bottom:4px;display:flex}#tune .row output{color:#fff;font-weight:600}#tune input[type=range]{accent-color:#e69f00;touch-action:pan-y;width:100%;margin:0}#tune .actions{gap:8px;margin:16px 0 10px;display:flex}#tune .actions button{font:600 12px/1 var(--font);color:var(--panel-text);border:2px solid var(--panel-text);touch-action:manipulation;background:0 0;border-radius:0;flex:1;padding:10px 8px}#tune .actions button:active{background:var(--panel-text);color:var(--ink)}#tune textarea{resize:none;width:100%;height:92px;font:11px/1.4 var(--font);color:#d8dbd2;-webkit-user-select:text;user-select:text;background:#25232d;border:0;padding:8px}#rotate{z-index:100;background:var(--ink);color:var(--bg);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:18px;padding:24px;font-size:15px;line-height:1.5;display:none;position:fixed;inset:0}#rotate p{max-width:22ch;margin:0}#rotate svg{fill:none;width:72px;height:72px;stroke:var(--bg);stroke-width:3px;animation:2.4s ease-in-out infinite turn}@keyframes turn{0%,25%{transform:rotate(0)}60%,to{transform:rotate(90deg)}}@media (orientation:portrait) and (pointer:coarse){body.playing #rotate,body.solo #rotate{display:flex}}@media (prefers-reduced-motion:reduce){#rotate svg{animation:none}}#touch,#hint{visibility:hidden}body.playing #touch,body.solo #touch,body.playing #hint,body.solo #hint{visibility:visible}body.playing #hint{display:none}#hud{pointer-events:none;z-index:5;position:fixed;inset:0}#hud[hidden]{display:none}#hud .timer{left:50%;top:calc(10px + env(safe-area-inset-top,0px));font:700 22px/1 var(--font);background:var(--bg);border:2px solid var(--ink);padding:7px 12px;position:absolute;transform:translate(-50%)}#hud .keyinfo{left:50%;top:calc(56px + env(safe-area-inset-top,0px));opacity:.75;white-space:nowrap;font-size:12px;position:absolute;transform:translate(-50%)}#hud .netinfo{left:calc(12px + env(safe-area-inset-left,0px));top:calc(10px + env(safe-area-inset-top,0px));opacity:.6;white-space:pre;font-size:11px;position:absolute}#labels{pointer-events:none;z-index:4;position:fixed;inset:0;overflow:hidden}.label{font:600 11px/1 var(--font);color:var(--t-ink,#22223b);white-space:nowrap;will-change:transform;background:#ffffffb8;border-radius:999px;padding:3px 7px;position:absolute;top:0;left:0}.label.me{display:none}.badge{font-family:var(--font);color:var(--t-ink,#22223b);white-space:nowrap;will-change:transform;text-align:center;font-weight:700;line-height:1;position:absolute;top:0;left:0}.badge.door{border:3px solid var(--t-ink,#22223b);background:#fff;border-radius:999px;padding:.22em .62em}.badge.box{text-shadow:none;padding:0}#ui{z-index:30;touch-action:pan-y;background:#e9ebe6f7;place-items:center;display:grid;position:fixed;inset:0;overflow-y:auto}#ui[hidden]{display:none}.card{background:var(--bg);border:3px solid var(--ink);-webkit-user-select:text;user-select:text;flex-direction:column;gap:10px;width:min(360px,100vw - 32px);padding:20px;display:flex}.card.wide{width:min(420px,100vw - 32px)}.card h1{letter-spacing:-.02em;margin:0 0 6px;font-size:26px}.card h2{margin:0;font-size:18px}.card p{margin:0;font-size:13px}.card label{opacity:.7;margin-bottom:-4px;font-size:12px}.card input{font:600 16px/1 var(--font);color:var(--ink);border:2px solid var(--ink);background:#fff;border-radius:0;width:100%;min-width:0;padding:12px}.card input.code{text-transform:uppercase;letter-spacing:.3em;text-align:center}.card .row{gap:8px;display:flex}.card .or{opacity:.6;text-align:center;margin-top:4px;font-size:11px}.card button,.report button{font:700 14px/1 var(--font);background:var(--bg);color:var(--ink);border:2px solid var(--ink);touch-action:manipulation;cursor:pointer;border-radius:0;padding:13px 14px}.card button:disabled{opacity:.35;cursor:default}.card button:not(:disabled):active,.report button:active{background:var(--ink);color:var(--bg)}.card button.primary{color:#fff;border-color:var(--ink);background:#5b2eff}.card button.primary:active{background:var(--ink)}.card button.quiet,.report button.quiet{border-color:#0000;padding:8px;font-weight:600;text-decoration:underline}.card .error{color:#b3261e;font-weight:700}.card .muted{opacity:.6;text-align:center}.roomhead{justify-content:space-between;align-items:center;gap:8px;display:flex}.roomcode{font:800 34px/1 var(--font);letter-spacing:.2em}.players{gap:6px;margin:0;padding:0;list-style:none;display:grid}.players li{border:2px solid var(--ink);align-items:center;gap:10px;padding:6px 8px;display:flex}.swatch{border:2px solid var(--ink);place-items:center;width:26px;height:26px;font-size:13px;font-weight:800;display:grid}.pname{text-overflow:ellipsis;white-space:nowrap;flex:1;font-weight:700;overflow:hidden}.tag{border:1.5px solid var(--ink);padding:2px 5px;font-size:10px}.levelpick{justify-content:space-between;align-items:center;gap:8px;display:flex}.lvname{text-align:center;flex:1;font-size:13px;font-weight:700}.bigtime{font:800 48px/1 var(--font);text-align:center;padding:8px 0}.report{z-index:40;background:var(--ink);width:min(520px,100vw - 16px);max-height:70vh;color:var(--panel-text);touch-action:pan-y;padding:12px;position:fixed;bottom:8px;left:8px;overflow:auto}.report pre{font:11px/1.5 var(--font);white-space:pre-wrap;-webkit-user-select:text;user-select:text;margin:0 0 10px}.report .actions{gap:8px;display:flex}.report button{color:var(--panel-text);border-color:var(--panel-text);background:0 0}.card.two{width:min(620px,100vw - 32px)}.roomhead .count{opacity:.7;margin-left:auto;margin-right:8px;font-size:12px}.teams{grid-template-columns:1fr 1fr;gap:10px;display:grid}.team{border:3px solid var(--ink);align-content:start;gap:6px;padding:8px;display:grid}.team h3{letter-spacing:.04em;text-transform:uppercase;margin:0;font-size:13px}.team.shuffling .swatch{transition:none}.players li.pick{cursor:pointer}.teamtimes{gap:8px;display:grid}.teamtime{border:2px solid var(--ink);justify-content:space-between;align-items:baseline;padding:10px 12px;display:flex}.teamtime.win{border-width:4px}.teamtime .ttime{font:800 22px/1 var(--font)}.divider{background:var(--ink);height:3px;position:absolute;left:0;right:0}.divider[hidden]{display:none}.panelhud{margin-top:calc(6px + env(safe-area-inset-top,0px));text-align:center;white-space:nowrap;position:absolute;left:50%;transform:translate(-50%)}.panelhud[hidden]{display:none}.panelhud .ptop{background:var(--bg);border:2px solid var(--ink);align-items:baseline;gap:12px;padding:4px 10px;font-size:12px;display:inline-flex}.panelhud .pname{letter-spacing:.04em;text-transform:uppercase;font-weight:800}.panelhud .ptime{font:800 16px/1 var(--font)}.panelhud .pkey{opacity:.75;margin-top:2px;font-size:11px}.card{max-height:calc(100vh - 16px);overflow-y:auto}#reconnect{left:50%;top:calc(48px + env(safe-area-inset-top,0px));z-index:20;background:var(--ink);color:var(--bg);border:2px solid var(--ink);padding:8px 14px;font-size:13px;font-weight:700;position:fixed;transform:translate(-50%)}#reconnect[hidden]{display:none}#mute{right:calc(10px + env(safe-area-inset-right,0px));top:calc(10px + env(safe-area-inset-top,0px));z-index:30;font:700 11px var(--font);color:var(--ink);background:var(--bg);border:2px solid var(--ink);cursor:pointer;padding:6px 9px;position:fixed}#mute:active{background:var(--ink);color:var(--bg)}#dbg-report{left:calc(10px + env(safe-area-inset-left,0px));bottom:calc(10px + env(safe-area-inset-bottom,0px));z-index:30;font:600 11px var(--font);color:var(--ink);background:var(--bg);border:2px solid var(--ink);padding:5px 8px;display:none;position:fixed}body.playing #dbg-report{display:block}.timer,.bigtime,.ptime,.ttime,.pcount,.roomcode{font-variant-numeric:tabular-nums;font-feature-settings:"tnum"}:root{--ink:#22223b;--ink-soft:#3a3a5c;--bg:#fff;--sky:#8ed8f8;--accent:#ff8a5b;--accent-ink:#22223b;--good:#52b54b;--shadow:0 4px 0 var(--ink)}html,body{background:var(--sky)}#ui{background:var(--sky);overflow:hidden auto}#ui:before,#ui:after{content:"";z-index:-1;pointer-events:none;border-radius:50%;position:fixed}#ui:before{background:#b7e8a0;width:70vw;height:62vh;bottom:-42vh;left:-10vw}#ui:after{background:#8fd27f;width:80vw;height:66vh;bottom:-50vh;right:-14vw}.card{border:4px solid var(--ink);box-shadow:0 6px 0 var(--ink);background:#fff;border-radius:22px}.card h1{letter-spacing:0;font-size:34px;line-height:1}.card h2{font-size:22px}.card input{border:3px solid var(--ink);background:#fff;border-radius:14px}.card button,.report button{border:3px solid var(--ink);box-shadow:var(--shadow);background:#fff;border-radius:14px;font-weight:700;transition:transform 50ms,box-shadow 50ms}.card button:active:not(:disabled){box-shadow:0 1px 0 var(--ink);transform:translateY(3px)}.card button:disabled{opacity:.5;box-shadow:none}.card button.primary{background:var(--accent);color:var(--ink);border-color:var(--ink)}.card button.primary:active:not(:disabled){background:var(--accent)}.card button.quiet{box-shadow:none;background:0 0;border-color:#0000;text-decoration:underline}.card button.icon{padding:10px 16px}.swatch{border:3px solid var(--ink);color:var(--ink);border-radius:9px}.players li{border:3px solid var(--ink);background:#fff;border-radius:14px}.tag{border:2px solid var(--ink);border-radius:999px}.tag.me{background:var(--ink);color:#fff}.team{border:3px solid var(--ink);border-radius:16px}.team.t0{background:#ffe9d6}.team.t1{background:#d9efff}.players li.picked{background:var(--accent);color:var(--ink)}.teamtime{border:3px solid var(--ink);border-radius:14px}.teamtime.t0{background:#ffe9d6}.teamtime.t1{background:#d9efff}.roomcode{border:3px solid var(--ink);background:#fff3c4;border-radius:14px;padding:4px 12px}#hud .timer{border:3px solid var(--ink);box-shadow:0 3px 0 var(--ink);background:#fff;border-radius:999px;padding:6px 18px;font-weight:700}#hud .keyinfo{opacity:1;border:2px solid var(--ink);top:calc(58px + env(safe-area-inset-top,0px));background:#fff;border-radius:999px;padding:3px 12px;font-weight:600}#hud .keyinfo:empty{display:none}.panelhud .ptop{border:3px solid var(--ink);box-shadow:0 3px 0 var(--ink);background:#fff;border-radius:999px;padding:4px 16px}.panelhud.t0 .ptop{background:#ffd9bf}.panelhud.t1 .ptop{background:#cfe8ff}.panelhud .pkey{border:2px solid var(--ink);opacity:1;background:#fff;border-radius:999px;margin-top:4px;padding:1px 10px;display:inline-block}.panelhud .pkey:empty{display:none}.divider{background:var(--ink);height:5px}.label{color:var(--ink)}#mute,#shake{right:calc(10px + env(safe-area-inset-right,0px));z-index:30;font:700 11px var(--font);color:var(--ink);border:3px solid var(--ink);box-shadow:0 3px 0 var(--ink);cursor:pointer;background:#fff;border-radius:999px;padding:6px 12px;position:fixed}#mute{top:calc(10px + env(safe-area-inset-top,0px))}#shake{top:calc(46px + env(safe-area-inset-top,0px))}#mute:active,#shake:active{box-shadow:0 1px 0 var(--ink);transform:translateY(2px)}body:not(.playing):not(.solo) #shake{display:none}#dbg-report{border-width:3px;border-radius:999px}#touch button{border:4px solid var(--ink);box-shadow:0 4px 0 var(--ink);background:#ffffffd9;border-radius:50%}#touch button svg{stroke:var(--ink)}@media (max-height:460px){#mute,#shake{box-shadow:0 2px 0 var(--ink);border-width:2px;padding:4px 9px;font-size:10px}#shake{top:calc(36px + env(safe-area-inset-top,0px))}#hud .timer{padding:4px 14px;font-size:18px}}
