:root{--sky:#8fd3ff;--grass:#6bcb77;--sun:#ffd93d;--ball:#ff6b6b;--cloud:#fffdf7;--ink:#2b2d42;--ink-soft:#5b5e7a;--outline:3px solid var(--ink);--radius:22px;--shadow:0 6px 0 var(--ink);color:var(--ink);font-family:Fredoka,system-ui,sans-serif}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--sky);overflow:hidden}button,input{font:inherit}body{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}input,.selectable,.room-code{-webkit-user-select:text;user-select:text}:focus-visible{outline:3px solid var(--sun);outline-offset:2px}@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}.lobby{background:radial-gradient(circle at 15% 20%, #fffdf7 0 90px, transparent 91px), radial-gradient(circle at 80% 70%, #fffdf7 0 120px, transparent 121px), linear-gradient(var(--sky), #c7ecff);grid-template-columns:minmax(0,420px) minmax(0,300px);place-content:center;gap:32px;min-height:100%;padding:24px;display:grid}@media (width<=760px){.lobby{grid-template-columns:1fr}}.lobby-card{background:var(--cloud);border:var(--outline);box-shadow:var(--shadow);border-radius:32px;padding:28px}.wordmark{letter-spacing:-.03em;margin:0 0 6px;font-size:56px;font-weight:700;line-height:1}.wordmark span{color:var(--ball)}.tagline{color:var(--ink-soft);max-width:34ch;margin:0 0 22px}.field{gap:6px;margin-bottom:14px;font-weight:500;display:grid}.field input{border:var(--outline);background:#fff;border-radius:16px;width:100%;padding:12px 14px;font-size:18px}.actions{flex-wrap:wrap;gap:10px;margin:20px 0;display:flex}.btn{border:var(--outline);cursor:pointer;box-shadow:0 4px 0 var(--ink);background:#fff;border-radius:999px;padding:12px 22px;font-size:18px;font-weight:600;transition:transform 80ms,box-shadow 80ms}.btn:hover{transform:translateY(-1px)}.btn:active{box-shadow:0 1px 0 var(--ink);transform:translateY(3px)}.btn:disabled{opacity:.6;cursor:wait}.btn.primary{background:var(--sun)}.btn.google{background:#fff;padding:10px 16px;font-size:16px}.link{color:var(--ink-soft);cursor:pointer;background:0 0;border:0;padding:0;text-decoration:underline}.account{color:var(--ink-soft);border-top:2px dashed #d9d4c6;gap:10px;padding-top:16px;font-size:15px;display:grid}.error{border:2px solid var(--ball);background:#ffe3e3;border-radius:12px;margin:0;padding:10px 12px}.hint{color:var(--ink-soft);font-size:15px}.controls{grid-template-columns:auto 1fr;align-content:center;gap:10px 12px;margin:0;padding:0;font-size:16px;list-style:none;display:grid}.controls li{display:contents}.controls li>.keys{white-space:nowrap;align-items:baseline;gap:6px;display:flex}.controls kbd{text-align:center;background:var(--cloud);border:2px solid var(--ink);min-width:44px;font:inherit;border-bottom-width:4px;border-radius:8px;margin-right:8px;padding:2px 8px;font-weight:600;display:inline-block}.hud{pointer-events:none;padding:18px;padding-top:max(18px, env(safe-area-inset-top));padding-bottom:max(18px, env(safe-area-inset-bottom));grid-template-rows:auto 1fr auto;display:grid;position:fixed;inset:0}.hud-top{z-index:2;justify-content:space-between;align-items:flex-start;display:flex;position:relative}.rally{background:var(--cloud);border:var(--outline);box-shadow:var(--shadow);border-radius:20px;justify-items:center;padding:6px 18px;display:grid}.rally-num{font-size:40px;font-weight:700;line-height:1}.rally-label{color:var(--ink-soft);font-size:13px}.room-code{background:var(--cloud);border:var(--outline);letter-spacing:.08em;pointer-events:auto;cursor:pointer;font-weight:600;font:inherit;color:inherit;border-radius:999px;padding:8px 16px;font-weight:600}.room-code:active{transform:translateY(1px)}.room-code.copied{background:var(--sun)}.hud-top-right{align-items:center;gap:10px;display:flex}.icon-btn{pointer-events:auto;background:var(--cloud);border:var(--outline);cursor:pointer;width:40px;height:40px;box-shadow:0 4px 0 var(--ink);border-radius:999px;place-items:center;font-size:17px;line-height:1;transition:transform 80ms,box-shadow 80ms;display:grid}.icon-btn:active{box-shadow:0 1px 0 var(--ink);transform:translateY(3px)}.hud-center{color:var(--cloud);background:#2b2d42d9;border-radius:999px;place-self:center;padding:10px 18px;font-weight:500}.reticle{background:var(--cloud);border:2px solid var(--ink);border-radius:50%;place-self:center;width:8px;height:8px}.hud-bottom{justify-self:center;gap:8px;width:min(420px,100%);display:grid}.meter{border:2px solid var(--ink);background:var(--cloud);border-radius:999px;height:16px;overflow:hidden}.meter-fill{height:100%;transition:width 80ms linear}.meter-fill.stamina{background:var(--grass)}.meter-fill.charge{background:linear-gradient(90deg, var(--sun), var(--ball))}.hud-hint{color:var(--ink);pointer-events:auto;text-shadow:0 1px #fff;justify-content:space-between;gap:12px;font-size:14px;display:flex}.toasts{gap:8px;display:grid;position:fixed;top:90px;left:50%;transform:translate(-50%)}.toast{background:var(--cloud);border:var(--outline);border-radius:999px;padding:8px 16px;font-weight:600;animation:.2s ease-out pop}.toast.catch{background:var(--sun)}.toast.drop{background:#ffe3e3}.toast.achievement{background:#c9b6ff}.toast{gap:2px;display:grid}.toast-detail{opacity:.85;font-size:13px;font-weight:400}@keyframes pop{0%{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}.modal-backdrop{z-index:10;background:#2b2d4273;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.modal{background:var(--cloud);border:var(--outline);box-shadow:var(--shadow);border-radius:28px;width:min(680px,100%);max-height:90vh;padding:22px;overflow:auto}.modal header{justify-content:space-between;align-items:center;display:flex}.modal h2{margin:0;font-size:28px}.slots{flex-wrap:wrap;gap:8px;margin:14px 0;display:flex}.chip{border:2px solid var(--ink);cursor:pointer;background:#fff;border-radius:999px;padding:6px 14px;font-weight:500}.chip.on{background:var(--sun)}.unlock-all{background:#fff;border-style:dashed;width:100%;margin:0 0 10px}.items{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin:0;padding:0;list-style:none;display:grid}.item{border:2px solid var(--ink);cursor:pointer;text-align:left;background:#fff;border-radius:16px;justify-items:start;gap:6px;width:100%;padding:10px;display:grid}.item.on{box-shadow:0 3px 0 var(--ink);background:#fff3b8}.item.locked{opacity:.55;cursor:not-allowed}.item.rare{border-color:#4d7cff}.item.epic{border-color:#9b5cff}.item.legendary{border-color:#ff9f1c}.swatch{border:2px solid var(--ink);border-radius:10px;width:100%;height:34px}.item-name{font-weight:600}.item-gate{color:var(--ink-soft);font-size:12px}.shop-chip{background:var(--sun);font-weight:600}.price{font-weight:700}.item:disabled{opacity:.6;cursor:default}.toggle{color:var(--ink-soft);align-items:center;gap:8px;margin-top:-6px;font-size:15px;display:flex}.toggle input{width:18px;height:18px;accent-color:var(--ink)}.browser{border-top:2px dashed #d9d4c6;gap:10px;margin-top:4px;padding-top:14px;display:grid}.browser-head{justify-content:space-between;align-items:center;gap:12px;display:flex}.browser-head h2{margin:0;font-size:17px}.btn.small{box-shadow:0 3px 0 var(--ink);padding:6px 14px;font-size:14px}.room-list{gap:8px;max-height:190px;margin:0;padding:0;list-style:none;display:grid;overflow:auto}.room-row{border:2px solid var(--ink);cursor:pointer;width:100%;font:inherit;background:#fff;border-radius:14px;justify-content:space-between;align-items:center;padding:10px 14px;display:flex}.room-row:hover:not(:disabled){background:#fff3b8}.room-row:disabled{opacity:.6;cursor:default}.room-row-code{letter-spacing:.08em;font-weight:700}.room-row-count{color:var(--ink-soft);font-size:14px}.spectator{text-align:center;color:var(--cloud);background:#2b2d42d9;border-radius:20px;place-self:center;justify-items:center;gap:4px;padding:14px 22px;display:grid}.spectator code{letter-spacing:.1em;background:#fffdf72e;border-radius:6px;padding:1px 7px}.touch{pointer-events:none;touch-action:none;position:fixed;inset:0}.touch-look{pointer-events:auto;touch-action:none;position:absolute;inset:0}.touch-stick{border:var(--outline);pointer-events:auto;touch-action:none;background:#fffdf759;border-radius:50%;place-items:center;width:132px;height:132px;display:grid;position:absolute;bottom:26px;left:26px}.touch-knob{background:var(--cloud);border:var(--outline);width:58px;height:58px;box-shadow:0 3px 0 var(--ink);border-radius:50%}.touch-buttons{justify-items:center;gap:6px;display:grid;position:absolute;bottom:26px;right:22px}.touch-btn{pointer-events:auto;touch-action:none;border:var(--outline);background:var(--cloud);color:var(--ink);font:inherit;box-shadow:0 4px 0 var(--ink);cursor:pointer;border-radius:50%;place-items:center;font-weight:700;display:grid;position:relative;overflow:hidden}.touch-btn.throw{background:var(--sun);width:108px;height:108px;font-size:16px}.touch-btn.throw.idle{background:var(--cloud);font-size:13px}.touch-btn:active{box-shadow:0 1px 0 var(--ink);transform:translateY(3px)}.touch-btn-fill{background:var(--ball);opacity:.55;position:absolute;bottom:0;left:0;right:0}.touch-btn-label{position:relative}@media (width<=620px){.lobby{padding:14px}.lobby-card{border-radius:24px;padding:20px}.controls:not(.controls-touch){display:none}.controls-touch{padding-top:4px;font-size:15px}.room-list{max-height:140px}}.hud.touch-mode{grid-template-rows:auto auto 1fr auto}.hud.touch-mode .hud-top{grid-row:1}.hud.touch-mode .hud-meters-top{grid-row:2}.hud.touch-mode .hud-center,.hud.touch-mode .spectator,.hud.touch-mode .reticle{grid-row:3}.hud-meters-top{justify-self:center;gap:8px;width:min(320px,100% - 36px);margin-top:10px;display:grid}.hud.touch-mode .hud-hint{text-align:center;justify-content:center}.hud.touch-mode .hud-bottom{display:none}.hud.touch-mode~.toasts,.touch-mode .toasts{top:168px}.touch-row{gap:6px;margin-right:6px;display:flex}.touch-btn.small{width:62px;height:62px;font-size:12px}.touch-btn.jump{background:#b8e0ff}.touch-btn.dive{background:#ffc7b0}.customize-body{grid-template-columns:208px 1fr;align-items:start;gap:16px;display:grid}.preview{border:var(--outline);height:260px;box-shadow:0 4px 0 var(--ink);background:#cfeaff;border-radius:20px;overflow:hidden}.preview canvas{display:block}@media (width<=620px){.customize-body{grid-template-columns:1fr}.preview{height:190px}}