*{box-sizing:border-box;margin:0;padding:0}html,body{-webkit-user-select:none;user-select:none;touch-action:none;-webkit-tap-highlight-color:transparent;background:#5ec8ff;width:100%;height:100%;font-family:Nunito,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;overflow:hidden}#game{width:100%;height:100%;display:block}.hidden{display:none!important}:root{--navy:#14233f;--navy2:#2c3e63;--yellow:#ffc300;--red:#e63946;--teal:#1f8a7d;--teal-dark:#16675d;--disp:"Fredoka", "Nunito", system-ui, -apple-system, "Segoe UI", sans-serif;--body:"Nunito", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--safe-l:max(24px, env(safe-area-inset-left));--safe-r:max(24px, env(safe-area-inset-right));--safe-b:max(40px, env(safe-area-inset-bottom))}#hud{top:max(20px, env(safe-area-inset-top));left:var(--safe-l);color:#fff;pointer-events:none;align-items:center;gap:16px;display:flex;position:fixed}#logo{font:700 30px var(--disp);-webkit-text-stroke:7px var(--navy);paint-order:stroke fill;letter-spacing:.01em}#status{height:44px;font:800 16px var(--body);background:#14233fcc;border-radius:999px;align-items:center;gap:8px;padding:0 16px;display:inline-flex}.live{background:#3ddc97;border-radius:50%;width:10px;height:10px;box-shadow:0 0 0 4px #3ddc9747}#status.connecting .live{background:#ffb703;box-shadow:0 0 0 4px #ffb70347}#mute{pointer-events:auto;color:#fff;cursor:pointer;background:#14233fcc;border:none;border-radius:50%;justify-content:center;align-items:center;width:44px;height:44px;display:flex;box-shadow:0 4px #14233f59}#host-panel{top:max(20px, env(safe-area-inset-top));right:var(--safe-r);gap:12px;display:flex;position:fixed}#host-panel button{color:#fff;min-width:44px;height:44px;font:800 15px var(--body);touch-action:pan-y;cursor:pointer;background:#14233fcc;border:none;border-radius:14px;justify-content:center;align-items:center;gap:8px;padding:0 14px;display:inline-flex;box-shadow:0 4px #14233f59}#host-panel button:active{transform:translateY(3px);box-shadow:0 1px #14233f59}@media (width<=520px){#hud{top:max(12px, env(safe-area-inset-top));left:max(12px, env(safe-area-inset-left));gap:10px}#logo{-webkit-text-stroke:6px var(--navy);font-size:24px}#status{height:40px;padding:0 12px;font-size:14px}#mute{top:max(12px, env(safe-area-inset-top));right:max(12px, env(safe-area-inset-right));position:fixed}body.playing #logo,body.playing #status{display:none}#host-panel{top:calc(max(12px, env(safe-area-inset-top)) + 54px + 52px);right:max(12px, env(safe-area-inset-right));flex-direction:column;gap:8px}#host-panel button{padding:0}#host-panel button span{display:none}}.screen{touch-action:pan-y;background:#143c6e40;place-items:center;padding:16px;display:grid;position:fixed;inset:0;overflow-y:auto}.card{color:#1d3557;-webkit-user-select:text;user-select:text;background:#fff;border-radius:22px;width:min(380px,100%);padding:22px 20px;box-shadow:0 10px #0000001f,0 20px 40px #0003}button.big{color:#1d3557;cursor:pointer;touch-action:pan-y;background:#ffc300;border:none;border-radius:14px;width:100%;height:52px;margin-top:18px;font:900 20px system-ui,sans-serif;box-shadow:0 5px #c99700}button.big:active{transform:translateY(3px);box-shadow:0 2px #c99700}button.big:disabled{opacity:.5}.lbl{font:800 13px var(--body);letter-spacing:.08em;text-transform:uppercase;color:#4a5c7a;display:block}.card-title{font:600 36px/1.1 var(--disp);color:var(--navy)}.card-sub{font:700 16px var(--body);color:#4a5c7a;margin-top:6px}.muted{font:700 14px var(--body);color:#4a5c7a;margin-top:2px}.btn-main{background:var(--yellow);width:100%;height:64px;color:var(--navy);font:600 26px var(--disp);cursor:pointer;touch-action:pan-y;border:none;border-radius:16px;justify-content:center;align-items:center;gap:10px;display:flex;box-shadow:0 6px #d49a00}.btn-main:hover{background:#ffcf33}.btn-main:active{transform:translateY(3px);box-shadow:0 3px #d49a00}.btn-main:disabled{opacity:.5}.btn-soft{height:48px;color:var(--navy);font:800 16px var(--body);cursor:pointer;touch-action:pan-y;background:#eef5fc;border:none;border-radius:16px;flex:1;justify-content:center;align-items:center;gap:8px;display:flex;box-shadow:0 5px #dce6f2}.btn-soft:hover{background:#e2eefa}.btn-soft:active{transform:translateY(3px);box-shadow:0 2px #dce6f2}.btn-soft.hidden{display:none}.dot{background:var(--c,#888);border-radius:50%;flex:none;width:14px;height:14px}.badge{height:22px;font:800 11px var(--body);letter-spacing:.06em;text-transform:uppercase;border-radius:999px;align-items:center;gap:4px;padding:0 8px;display:inline-flex}.badge.gold{background:var(--yellow);color:var(--navy)}.badge.soft{color:var(--navy);background:#dbe7f5}.count-badge{height:28px;color:var(--navy);font:800 13px var(--body);white-space:nowrap;background:#dbe7f5;border-radius:999px;align-items:center;padding:0 12px;display:inline-flex}.divider{background:#dce6f2;border-radius:2px;height:3px;margin:20px 0 16px}.join{touch-action:pan-y;align-items:flex-start;gap:48px;padding:40px 96px;display:flex;position:fixed;inset:0;overflow-y:auto}.join-hero{flex:1;min-width:0;margin-block:auto}.hero-chip{width:fit-content;height:52px;color:var(--navy);font:800 17px var(--body);background:#fff;border-radius:18px;align-items:center;gap:12px;padding:0 20px 0 10px;display:flex;box-shadow:0 5px #14233f2e}.hero-chip-icon{background:var(--yellow);border-radius:10px;justify-content:center;align-items:center;width:36px;height:36px;display:flex}.hero-title{font:700 112px/1.05 var(--disp);color:#fff;-webkit-text-stroke:14px var(--navy);paint-order:stroke fill;text-shadow:0 8px 0 var(--navy);margin-top:26px}.hero-tagline{font:800 32px var(--body);color:#fff;-webkit-text-stroke:6px var(--navy);paint-order:stroke fill;text-shadow:0 3px 0 var(--navy);margin-top:30px}.hero-blurb{max-width:460px;font:800 20px/1.45 var(--body);color:#fff;-webkit-text-stroke:5px var(--navy);paint-order:stroke fill;text-shadow:0 2px 0 var(--navy);margin-top:12px}.join-card{width:480px;color:var(--navy);-webkit-user-select:text;user-select:text;background:#fff;border-radius:24px;flex:none;margin-block:auto;padding:28px 32px;position:relative;box-shadow:0 8px #14233f29,0 24px 48px #143c7833}.join-card:before,.lobby:before{content:"";background:radial-gradient(14px 11px at 50% 100%,#fff 0 98%,#0000 100%) 0 0/38px 12px repeat-x;height:12px;position:absolute;top:-10px;left:24px;right:24px}.field{margin-top:14px}.field .lbl{margin-bottom:8px}#name{width:100%;height:56px;color:var(--navy);font:700 20px var(--body);-webkit-user-select:text;user-select:text;background:#fff;border:3px solid #dce6f2;border-radius:16px;outline:none;padding:0 18px}#name:focus{border-color:#2d9cf0;box-shadow:0 0 0 4px #2d9cf059}.swatch-row{grid-template-columns:repeat(8,minmax(0,1fr));gap:8px;display:grid}.sw{background:var(--c);cursor:pointer;touch-action:pan-y;border:none;border-radius:14px;height:44px;position:relative;box-shadow:inset 0 -5px #0000002e}.sw.picked{outline:4px solid var(--navy);outline-offset:3px}.sw.picked:after{content:"";border-bottom:4px solid #fff;border-left:4px solid #fff;width:14px;height:8px;position:absolute;top:50%;left:50%;transform:translate(-50%,-65%)rotate(-45deg)}.hat-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;display:grid}.chip{height:44px;color:var(--navy);font:700 14px var(--body);white-space:nowrap;cursor:pointer;touch-action:pan-y;background:#fff;border:3px solid #dce6f2;border-radius:14px;padding:0 4px}.chip.picked{border-color:var(--navy);background:var(--navy);color:#fff}.join-card .btn-main{margin-top:22px}#join-message{text-align:center;min-height:0;font:800 15px var(--body);color:var(--red);margin-top:10px}#join-message:empty{display:none}#join-waiting{font:700 15px var(--body);color:#4a5c7a;justify-content:center;align-items:center;gap:10px;margin-top:14px;display:flex}.preview{background:linear-gradient(#8fd3ff,#d6f0ff);border-radius:20px;height:176px;margin-top:16px;position:relative;overflow:hidden}.preview-name{justify-content:center;display:flex;position:absolute;top:6px;left:0;right:0}.ptag{color:#fff;max-width:90%;height:32px;font:800 16px var(--body);white-space:nowrap;background:#14233fdb;border-radius:999px;align-items:center;gap:8px;padding:0 14px 0 10px;display:inline-flex}.ptag i{border-radius:50%;flex:none;width:12px;height:12px}.ptag span{text-overflow:ellipsis;overflow:hidden}.preview-brick{background:var(--red);border-radius:8px;width:240px;height:28px;margin-left:-120px;position:absolute;top:148px;left:50%;box-shadow:inset 0 -8px #00000029}.preview-brick:before{content:"";background:radial-gradient(ellipse 13px 10px at 50% 100%, var(--red) 0 98%, transparent 100%) 0 0 / 34px 10px repeat-x;height:10px;position:absolute;top:-9px;left:10px;right:10px}.fc{width:56px;height:112px;margin-left:-28px;position:absolute;top:38px;left:50%}.fc i,.fc b{display:block;position:absolute}.fc-h{background:#f2c078;border-radius:7px;width:36px;height:34px;top:0;left:10px;box-shadow:inset 0 -4px #0000001a}.fc-h:before{content:"";background:var(--navy);width:5px;height:6px;box-shadow:13px 0 0 var(--navy);border-radius:2px;position:absolute;top:13px;left:9px}.fc-h:after{content:"";border-bottom:3px solid var(--navy);border-radius:0 0 8px 8px;width:12px;height:6px;position:absolute;top:21px;left:12px}.fc-t{background:var(--c,#7b2cbf);border-radius:7px;width:40px;height:40px;top:36px;left:8px;box-shadow:inset 0 -5px #0000002e}.fc-t:after{content:"";background:repeating-linear-gradient(90deg,#fff 0 5px,#e63946 5px 10px);border-radius:0 0 7px 7px;height:7px;position:absolute;bottom:0;left:0;right:0}.fc-a{background:#f2c078;border-radius:6px;width:11px;height:32px;top:38px}.fc-al{left:-3px}.fc-ar{right:-3px}.fc-l{background:#27385a;border-radius:6px;width:17px;height:34px;top:76px}.fc-ll{left:10px}.fc-lr{right:10px}.fc-hat{z-index:2;width:56px;height:0;top:0;left:0}.fc-hat:before,.fc-hat:after{content:"";position:absolute}.fc-hat.hat-cap:before{background:#2d9cf0;border-radius:20px 20px 4px 4px;width:40px;height:15px;top:-9px;left:8px}.fc-hat.hat-tophat:before{background:#1b1f2a;border-radius:3px;width:32px;height:24px;top:-22px;left:12px;box-shadow:0 6px 0 -1px #1b1f2a,-6px 6px 0 -2px #1b1f2a,6px 6px 0 -2px #1b1f2a}.fc-hat.hat-crown:before{clip-path:polygon(0 100%,0 20%,25% 62%,50% 0,75% 62%,100% 20%,100% 100%);background:#ffc300;width:32px;height:18px;top:-15px;left:12px}.fc-hat.hat-party:before{border-bottom:36px solid #e63946;border-left:14px solid #0000;border-right:14px solid #0000;width:0;height:0;top:-32px;left:14px}.fc-hat.hat-straw:before{background:#e8c36a;border-radius:50%;width:56px;height:9px;top:-3px;left:0}.fc-hat.hat-straw:after{background:#e8c36a;border-radius:14px 14px 2px 2px;width:32px;height:14px;top:-13px;left:12px;box-shadow:inset 0 -4px #c0392b}.fc-hat.hat-viking:before{background:#8d99ae;border-radius:20px 20px 4px 4px;width:40px;height:15px;top:-9px;left:8px}.fc-hat.hat-viking:after{background:linear-gradient(#f1e7d0,#f1e7d0) 0 0/8px 18px no-repeat,linear-gradient(#f1e7d0,#f1e7d0) 100% 0/8px 18px no-repeat;border-radius:6px 6px 0 0;width:56px;height:18px;top:-22px;left:0}.fc-hat.hat-beanie:before{background:#7b2cbf;border-radius:18px 18px 3px 3px;width:40px;height:16px;top:-10px;left:8px;box-shadow:inset 0 -5px #9d4edd}.fc-hat.hat-beanie:after{background:#fff;border-radius:50%;width:10px;height:10px;top:-18px;left:23px}.fc-hat.hat-chef:before{background:#fff;border-radius:14px 14px 3px 3px;width:34px;height:26px;top:-24px;left:11px;box-shadow:inset 0 -6px #e3e8f0}.fc-hat.hat-propeller:before{background:#2d9cf0;border-radius:10px 10px 2px 2px;width:36px;height:11px;top:-7px;left:10px}.fc-hat.hat-propeller:after{background:#1d3557;border-radius:3px;width:44px;height:5px;top:-13px;left:6px}.lobby{width:460px;max-height:calc(100% - 96px);color:var(--navy);touch-action:pan-y;background:#fff;border-radius:24px;flex-direction:column;padding:28px;display:flex;position:fixed;top:72px;right:56px;box-shadow:0 8px #14233f29,0 24px 48px #143c7833}.lobby-head{flex:none;justify-content:space-between;align-items:center;display:flex}.lobby-actions{flex:none;gap:12px;margin-top:18px;display:flex}#lobby-list{flex-direction:column;flex:0 auto;gap:8px;min-height:56px;margin-top:18px;list-style:none;display:flex;overflow-y:auto}#lobby-list li{height:48px;font:800 17px var(--body);background:#eef5fc;border-radius:14px;flex:none;align-items:center;gap:12px;padding:0 12px;display:flex}#lobby-list li.away{opacity:.55}.rname{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}#host-controls{flex:none}.seg{background:#eef5fc;border-radius:16px;gap:5px;margin-top:10px;padding:5px;display:flex}.seg button{color:#4a5c7a;height:48px;font:800 15px var(--body);cursor:pointer;touch-action:pan-y;background:0 0;border:none;border-radius:12px;flex:1}.seg button.picked{color:var(--navy);background:#fff;box-shadow:0 3px #dce6f2}.seg button:disabled{opacity:.35}#random-settings .seg.small{margin-top:6px}.seg.small button{height:38px;font-size:14px}#host-controls .lbl+.seg{margin-top:8px}#host-controls #random-settings+.lbl{margin-top:16px}#course-info{text-align:center;margin:12px 0 0}.bots-row{justify-content:space-between;align-items:center;margin-top:18px;display:flex}.stepper{background:#eef5fc;border-radius:16px;align-items:center;gap:12px;padding:5px;display:flex}.step{width:44px;height:44px;color:var(--navy);cursor:pointer;touch-action:pan-y;background:#fff;border:none;border-radius:12px;justify-content:center;align-items:center;display:flex;box-shadow:0 3px #dce6f2}.step:disabled{opacity:.35}#bots-count{text-align:center;min-width:22px;font:600 26px var(--disp)}#host-controls .btn-main{margin-top:24px}#waiting{text-align:center;font:800 16px var(--body);color:#4a5c7a;margin-top:18px}@media (width<=1100px){.join{gap:32px;padding:32px 48px}.join-card{width:440px}.hero-title{-webkit-text-stroke:12px var(--navy);font-size:84px}.hero-tagline{font-size:26px}.hero-blurb{display:none}.lobby{width:420px;right:32px}}@media (width<=760px) and (height>=521px){.join{flex-direction:column;justify-content:space-between;align-items:stretch;gap:0;padding:0;display:flex;overflow:hidden}.join-hero{padding:max(32px, env(safe-area-inset-top)) 20px 0;text-align:center;flex-direction:column;flex:none;align-items:center;margin-block:0;display:flex}.hero-chip{height:40px;padding:0 14px 0 8px;font-size:14px}.hero-chip-icon{border-radius:8px;width:26px;height:26px}.hero-chip-icon svg{width:18px;height:18px}.hero-title{-webkit-text-stroke:11px var(--navy);text-shadow:0 6px 0 var(--navy);margin-top:16px;font-size:60px;line-height:1}.hero-title br{display:none}.hero-tagline{margin-top:12px;font-size:20px}.join-card{width:auto;max-height:calc(100% - 150px);padding:20px 20px max(20px, env(safe-area-inset-bottom));border-radius:28px 28px 0 0;margin-block:0;overflow-y:auto;box-shadow:0 -8px 32px #143c7833}.join-card:before{display:none}.card-title{font-size:28px}.card-sub{display:none}.preview{height:150px;margin-top:12px}.preview-name{display:none}.preview-brick{width:200px;margin-left:-100px;top:120px}.fc{transform-origin:50% 100%;top:8px;transform:scale(.95)}.field{margin-top:12px}.hat-grid{margin:0 -20px;padding:0 20px 4px;display:flex;overflow-x:auto}.chip{flex:none;padding:0 16px}.join-card .btn-main{height:60px;margin-top:16px;font-size:24px}#join-waiting{margin-top:10px}.lobby{width:auto;max-height:72%;padding:20px 20px max(18px, env(safe-area-inset-bottom));border-radius:28px 28px 0 0;inset:auto 0 0;box-shadow:0 -8px 32px #143c7833}.lobby:before{display:none}.lobby .card-title{font-size:30px}.lobby-actions{margin-top:12px}#lobby-list{margin-top:14px}#lobby-list li{height:42px}.divider{margin:14px 0 12px}.bots-row{margin-top:12px}#host-controls .btn-main{height:62px;margin-top:14px}}@media (width<=760px) and (height>=521px) and (height<=700px){.hero-chip{display:none}.hero-title{margin-top:0;font-size:48px}.join-card{max-height:calc(100% - 110px)}}.invite-card{text-align:center}.invite-card h2{font-size:26px;font-weight:900}#invite-where{opacity:.75;margin:6px 0 12px;font-weight:700}#invite-qr{background:#fff;border-radius:12px;width:220px;height:220px}#invite-link{word-break:break-all;-webkit-user-select:all;user-select:all;margin-top:8px;font:700 14px ui-monospace,Consolas,monospace}.invite-buttons{gap:10px;display:flex}.invite-buttons button.big{flex:1}button.big.secondary{background:#e3f2fd;box-shadow:0 5px #b6d7f0}.close-button{color:#1d3557;opacity:.6;cursor:pointer;background:0 0;border:none;margin-top:14px;font:800 15px system-ui,sans-serif}#waiting{text-align:center;opacity:.7;margin-top:14px;font-weight:800}#timer{top:max(20px, env(safe-area-inset-top));color:#fff;pointer-events:none;background:#14233fcc;border-radius:22px;flex-direction:column;align-items:center;gap:7px;padding:9px 22px 11px;display:flex;position:fixed;left:50%;transform:translate(-50%)}#timer.done{background:var(--teal-dark)}.timer-row{align-items:center;gap:10px;display:flex}#timer-text{font:600 28px/1 var(--disp);font-variant-numeric:tabular-nums}#pips{gap:5px;display:flex}#pips i{background:#fff6;border-radius:3px;width:22px;height:6px}#pips i.on{background:var(--yellow)}@media (width<=520px){#timer{top:max(12px, env(safe-area-inset-top));gap:6px;padding:7px 18px 9px}#timer svg{display:none}#timer-text{font-size:26px}#pips i{width:18px}}#countdown{color:#fff;font-family:var(--disp);-webkit-text-stroke:12px var(--navy);paint-order:stroke fill;text-shadow:0 8px 0 var(--navy);pointer-events:none;font-size:clamp(80px,22vw,160px);font-weight:700;position:fixed;top:32%;left:50%;transform:translate(-50%,-50%)}#toast{background:var(--teal);color:#fff;height:48px;font:700 20px var(--disp);white-space:nowrap;pointer-events:none;border-radius:999px;align-items:center;gap:8px;padding:0 20px;display:inline-flex;position:fixed;top:22%;left:50%;transform:translate(-50%);box-shadow:0 4px #0003}.pop{animation:.45s ease-out pop}@keyframes pop{0%{opacity:0;scale:1.8}60%{opacity:1;scale:.95}to{scale:1}}#results{color:#1d3557;text-align:center;background:#fff;border-radius:22px;width:min(400px,100% - 32px);max-height:calc(100% - 32px);padding:20px 18px;position:fixed;top:50%;left:50%;overflow-y:auto;transform:translate(-50%,-50%);box-shadow:0 10px #0000001f,0 20px 40px #00000040}#results h2{font-size:26px;font-weight:900}#results-close{color:#1d3557;opacity:.5;cursor:pointer;background:0 0;border:none;font-size:20px;position:absolute;top:10px;right:12px}#results-list{text-align:left;margin:14px 0 6px;list-style:none}#results-list li{border-radius:10px;align-items:center;gap:8px;padding:8px 6px;font-weight:800;display:flex}#results-list li.mine{background:#fff7d6}#results-list .dot{border-radius:50%;flex:none;width:14px;height:14px}#results-list .names{flex:1}#results-list .time{font-family:ui-monospace,Consolas,monospace}#results-best,#results-wait{opacity:.7;margin-top:8px;font-weight:800}#results-host{gap:10px;display:flex}#results-host button.big{flex:1}#hint{color:#fff;width:max-content;max-width:calc(100vw - 32px);font:700 15px var(--body);pointer-events:none;background:#14233fcc;border-radius:20px;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px 22px;padding:12px 24px;display:flex;position:fixed;bottom:28px;left:50%;transform:translate(-50%)}#hint span{white-space:nowrap;align-items:center;gap:6px;display:inline-flex}.key{min-width:30px;height:30px;color:var(--navy);font:800 14px var(--body);background:#fff;border-radius:8px;justify-content:center;align-items:center;padding:0 8px;display:inline-flex;box-shadow:0 3px #14233f59}.key-wide{min-width:64px}body.touch #hint,body:not(.playing) #hint{display:none}#pull-badge{background:var(--teal-dark);color:#fff;height:48px;font:800 17px var(--body);pointer-events:none;border-radius:999px;align-items:center;gap:8px;padding:0 20px;display:inline-flex;position:fixed;bottom:112px;left:50%;transform:translate(-50%)}body.touch #pull-badge{bottom:auto;top:calc(max(12px, env(safe-area-inset-top)) + 58px)}#pull-badge.hidden,body:not(.playing) #pull-badge{display:none}#joystick{left:var(--safe-l);bottom:var(--safe-b);pointer-events:none;opacity:.9;background:#14233f61;border-radius:50%;width:132px;height:132px;transition:opacity .1s,background .1s;display:none;position:fixed;box-shadow:inset 0 0 0 4px #ffffffd9}body.touch.playing #joystick{display:block}#joystick.active{opacity:1;background:#14233f80}#joystick .arrow{color:#fffffff2;position:absolute}#joystick .up{top:9px;left:56px}#joystick .down{bottom:9px;left:56px}#joystick .left{top:56px;left:9px}#joystick .right{top:56px;right:9px}#knob{background:#fff;border-radius:50%;width:66px;height:66px;margin:-33px 0 0 -33px;position:absolute;top:50%;left:50%;box-shadow:0 5px #14233f40}.touch-hint{color:#fff;height:34px;font:800 14px var(--body);pointer-events:none;background:#14233fd9;border-radius:999px;align-items:center;padding:0 14px;transition:opacity .4s;display:none;position:fixed}body.touch.playing .touch-hint{display:inline-flex}.touch-hint.gone{opacity:0}#hint-move{left:calc(var(--safe-l) + 66px);bottom:calc(var(--safe-b) + 144px);transform:translate(-50%)}#hint-look{right:var(--safe-r);top:45%}.round-button{color:#fff;touch-action:none;border:none;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;gap:1px;padding:0;display:none;position:fixed;box-shadow:0 6px #0000003d,inset 0 0 0 4px #ffffffd9}body.touch.playing .round-button{display:flex}body.touch.playing #pull:not(.needed){display:none}.round-button:after{content:attr(data-label);font:800 10px var(--body);letter-spacing:.06em;text-transform:uppercase;pointer-events:none}.round-button svg{flex:none}.round-button.pressed{transform:translateY(4px);box-shadow:0 2px #0000003d,inset 0 0 0 4px #ffffffd9}#jump{width:96px;height:96px;right:var(--safe-r);bottom:var(--safe-b);background:var(--yellow);color:var(--navy)}#jump svg{width:38px;height:38px}#punch{width:64px;height:64px;right:calc(var(--safe-r) + 16px);bottom:calc(var(--safe-b) + 108px);background:#d62839}#pull{width:84px;height:84px;right:calc(var(--safe-r) + 6px);bottom:calc(var(--safe-b) + 256px);background:#17766b;animation:.9s ease-in-out infinite pull-call}#kick{width:64px;height:64px;right:calc(var(--safe-r) + 16px);bottom:calc(var(--safe-b) + 182px);background:#c75b00}#punch svg,#kick svg{width:26px;height:26px}#pull svg{width:32px;height:32px}@keyframes pull-call{0%,to{box-shadow:0 6px #0000003d,inset 0 0 0 4px #fff,0 0 #3ddc9799}50%{box-shadow:0 6px #0000003d,inset 0 0 0 4px #fff,0 0 0 10px #3ddc9700}}#pull.pressed{animation:none;box-shadow:0 2px #0000003d,inset 0 0 0 4px #fff,0 0 0 6px #3ddc978c}#emote{top:calc(max(12px, env(safe-area-inset-top)) + 54px);right:max(12px, env(safe-area-inset-right));color:#fff;touch-action:none;background:#14233fcc;border:none;border-radius:50%;justify-content:center;align-items:center;width:44px;height:44px;padding:0;display:none;position:fixed;box-shadow:0 4px #14233f59}body.touch.playing #emote{display:flex}#emote.pressed{transform:translateY(3px);box-shadow:0 1px #14233f59}#emote-menu{top:calc(max(12px, env(safe-area-inset-top)) + 54px + 44px + 8px);right:max(12px, env(safe-area-inset-right));background:#fffffff2;border-radius:999px;gap:8px;padding:6px;display:flex;position:fixed;box-shadow:0 6px 18px #0003}#emote-menu button{touch-action:pan-y;background:#eef5fc;border:none;border-radius:50%;width:50px;height:50px;font-size:26px}#emote-menu.hidden,body:not(.playing) #emote-menu{display:none}@media (height<=520px){#punch{right:calc(var(--safe-r) + 112px);bottom:calc(var(--safe-b) - 4px)}#kick{right:calc(var(--safe-r) + 186px);bottom:calc(var(--safe-b) - 4px)}#pull{right:calc(var(--safe-r) + 150px);bottom:calc(var(--safe-b) + 72px)}#emote{top:calc(max(20px, env(safe-area-inset-top)) + 56px);right:var(--safe-r)}#emote-menu{top:calc(max(20px, env(safe-area-inset-top)) + 56px + 44px + 8px);right:var(--safe-r)}}#loading{color:#fff;background:#5ec8ff;place-items:center;font-size:28px;font-weight:900;display:grid;position:fixed;inset:0}#host-panel .key{border-radius:6px;min-width:24px;height:24px;padding:0 6px;font-size:12px}body.touch #host-panel .key,#hint .host-only{display:none}body.host #hint .host-only{display:inline-flex}@media (width<=520px){#host-panel .key{display:none}}#confirm{z-index:20;background:#14233f73}.confirm-card{text-align:center;width:min(460px,100%)}.confirm-card h2{font:700 28px var(--disp)}.confirm-card p{font:700 17px var(--body);opacity:.75;margin-top:6px}.confirm-buttons{flex-wrap:wrap;gap:0 12px;display:flex}.confirm-buttons button.big{white-space:nowrap;min-width:0;font-family:var(--disp);flex:190px;justify-content:center;align-items:center;gap:8px;padding:0 14px;font-size:18px;font-weight:600;display:flex}.confirm-buttons .key{min-width:24px;height:22px;box-shadow:none;background:#14233f1f;border-radius:6px;padding:0 6px;font-size:11px}body.touch .confirm-buttons .key{display:none}@media (width<=900px){body.playing #logo{display:none}}@media (width<=520px){#mute{left:max(12px, env(safe-area-inset-left));right:auto}#emote{top:max(12px, env(safe-area-inset-top))}#emote-menu{top:calc(max(12px, env(safe-area-inset-top)) + 44px + 8px)}#host-panel{top:calc(max(12px, env(safe-area-inset-top)) + 54px)}}body.joining #logo,body.joining #status{display:none}.join-actions{margin-top:22px}@media (width<=760px){.join-card{padding-bottom:0}.join-card .card-title{display:none}.join-card .preview{height:150px;margin-top:0}.join-card .preview-brick{height:28px;top:122px}.join-card .fc{transform-origin:50% 100%;top:10px;transform:scale(.85)}.join-card .field{margin-top:10px}.join-card .field .lbl{margin-bottom:6px}#name{height:50px}.join-actions{padding:12px 20px max(20px, env(safe-area-inset-bottom));background:#fff;margin:12px -20px 0;position:sticky;bottom:0}.join-card .join-actions .btn-main{margin-top:0}}.join-card .join-actions .btn-main{margin-top:0}@media (width>=761px) and (height<=820px){.join-card{max-height:calc(100% - 24px);margin-block:0;padding:20px 28px 0;overflow-y:auto}.join{align-items:center;padding-block:12px}.join-card:before,.lobby:before{display:none}.join-card .card-title{font-size:30px}.join-card .card-sub{display:none}.join-card .preview{height:150px;margin-top:12px}.join-card .preview-brick{height:24px;top:126px}.join-card .fc{transform-origin:50% 100%;top:14px;transform:scale(.85)}.join-card .preview-name{top:6px;left:10px;right:auto}.join-card .ptag{max-width:150px}.join-actions{background:#fff;margin:12px -28px 0;padding:10px 28px 18px;position:sticky;bottom:0}.lobby{max-height:calc(100% - 48px);padding:20px 24px;top:24px;overflow-y:auto}#lobby-list{flex:none;overflow:visible}}@media (height<=560px) and (width>=521px){.join{align-items:center;padding:12px 32px}.hero-chip,.hero-blurb{display:none}.hero-title{-webkit-text-stroke:9px var(--navy);text-shadow:0 5px 0 var(--navy);margin-top:0;font-size:56px}.hero-tagline{margin-top:16px;font-size:22px}.join-card{max-height:calc(100% - 4px);margin-block:0;padding:16px 20px 0;overflow-y:auto}.join-card:before,.join-card .card-title,.join-card .card-sub{display:none}.join-card .preview{height:130px;margin-top:0}.join-card .preview-brick{height:26px;top:104px}.join-card .fc{transform-origin:50% 100%;top:-8px;transform:scale(.72)}.join-card .preview-name{display:none}.join-actions{background:#fff;margin:12px -20px 0;padding:10px 20px 14px;position:sticky;bottom:0}.join-card .join-actions .btn-main{height:56px;font-size:22px}.lobby{max-height:calc(100% - 24px);padding:16px 20px;top:12px;overflow-y:auto}.lobby:before{display:none}.lobby .card-title{font-size:28px}#lobby-list{flex:none;overflow:visible}}@media (width<=760px) and (height>=521px){.join-card{flex:0 auto;min-height:0;max-height:none}}@media (width<=760px) and (height>=521px) and (height<=700px){.lobby{max-height:88%}}@media (height<=560px) and (width>=521px){#host-controls .btn-main{position:sticky;bottom:0;box-shadow:0 6px #d49a00,0 16px 0 16px #fff}}@media (width<=520px){body:not(.playing) #mute{left:auto;right:max(12px, env(safe-area-inset-right))}}@media (width<=760px) and (height>=521px){.hero-chip{display:none}.hero-title{margin-top:0}}.hat-grid{scrollbar-width:none}.hat-grid::-webkit-scrollbar{display:none}@media (width<=520px){.swatch-row{scrollbar-width:none;gap:10px;margin:0 -20px;padding:6px 20px 8px;display:flex;overflow-x:auto}.swatch-row::-webkit-scrollbar{display:none}.sw{flex:none;width:48px;height:48px}}.join,.join-card,.swatch-row,.hat-grid,.sw,.chip{touch-action:pan-x pan-y}@media (width<=760px) and (height>=521px){.lobby{overscroll-behavior:contain;overflow-y:auto}.lobby #lobby-list{flex:none;overflow:visible}#host-controls .btn-main{position:sticky;bottom:0;box-shadow:0 6px #d49a00,0 16px 0 16px #fff}}.home #status,.home #hud{display:none}.home-card{text-align:center}.home-card h1{margin:0;font-family:Fredoka,system-ui,sans-serif;font-size:40px;line-height:1}.home-tagline{opacity:.7;margin:6px 0 18px}.home-or{opacity:.6;margin:16px 0 8px;font-size:14px}#home-form{gap:8px;display:flex}#home-code{letter-spacing:.12em;text-transform:uppercase;text-align:center;color:#1d3557;border:2px solid #c9d8ea;border-radius:14px;flex:1;min-width:0;height:48px;padding:0 14px;font:700 18px Nunito,system-ui,sans-serif}#home-message{color:#c0392b;min-height:1.2em;margin:10px 0 0;font-size:14px}