@font-face{font-family:Fredoka;font-style:normal;font-display:swap;font-weight:500;src:url(/assets/fredoka-latin-500-normal-B0JifZgm.woff2) format("woff2"),url(/assets/fredoka-latin-500-normal-BL692wg7.woff) format("woff")}@font-face{font-family:Fredoka;font-style:normal;font-display:swap;font-weight:600;src:url(/assets/fredoka-latin-600-normal-C4zohCW5.woff2) format("woff2"),url(/assets/fredoka-latin-600-normal-CcrEjrB4.woff) format("woff")}@font-face{font-family:Fredoka;font-style:normal;font-display:swap;font-weight:700;src:url(/assets/fredoka-latin-700-normal-BOIZVyIN.woff2) format("woff2"),url(/assets/fredoka-latin-700-normal-C8FeHd3X.woff) format("woff")}:root{--bg-1: #1d6b3c;--bg-2: #0f3d22;--ink: #1c2a1f;--card: #fffaf0;--card-edge: #e8d9b8;--primary: #ffd23f;--primary-dark: #d9a400;--blue: #4aa8ff;--blue-dark: #1f63b3;--red: #ff6b6b;--red-dark: #bf3434;--muted: #6b7a6e;--radius: 18px;font-family:Fredoka,system-ui,-apple-system,Segoe UI,sans-serif;color:var(--ink);color-scheme:light}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:radial-gradient(ellipse at 50% 20%,var(--bg-1),var(--bg-2));-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none;overscroll-behavior:none}#bg{position:fixed;inset:0;width:100%;height:100%;pointer-events:none}.screen{position:fixed;inset:0;display:none;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:max(16px,env(safe-area-inset-top)) 16px max(16px,env(safe-area-inset-bottom));overflow-y:auto}.screen.active{display:flex}.logo{margin:0;display:flex;align-items:center;font-size:clamp(54px,13vw,104px);font-weight:700;letter-spacing:-.02em;color:var(--primary);-webkit-text-stroke:.06em var(--ink);paint-order:stroke fill;text-shadow:0 .08em 0 var(--ink);transform:rotate(-3deg);line-height:1}.logo-o{position:relative;display:inline-block;width:.78em;height:.74em;margin:.06em .02em 0;border-radius:50%;background:radial-gradient(circle at 35% 30%,#b5ddff 0 12%,var(--blue) 45%,var(--blue-dark) 100%);border:.055em solid var(--ink);box-shadow:0 .08em 0 var(--ink);animation:jiggle 2.4s ease-in-out infinite}.logo-o:before,.logo-o:after{content:"";position:absolute;top:30%;width:.2em;height:.22em;border-radius:50%;background:#fff radial-gradient(circle at 60% 55%,var(--ink) 0 40%,transparent 42%);border:.025em solid var(--ink)}.logo-o:before{left:18%}.logo-o:after{right:18%}.logo-o i{position:absolute;left:34%;bottom:16%;width:.24em;height:.1em;border:.035em solid var(--ink);border-top:none;border-radius:0 0 .2em .2em}@keyframes jiggle{0%,to{transform:scale(1)}15%{transform:scale(1.12,.88) translateY(4%)}30%{transform:scale(.92,1.08) translateY(-6%)}45%{transform:scale(1.04,.96)}60%{transform:scale(1)}}.tagline{margin:0;color:#e9ffe9;font-weight:500;text-align:center;text-shadow:0 2px 0 rgba(0,0,0,.25)}.card{position:relative;width:min(380px,100%);display:flex;flex-direction:column;gap:12px;padding:20px;background:var(--card);border:3px solid var(--ink);border-radius:24px;box-shadow:0 8px 0 var(--ink)}.card.wide{width:min(620px,100%)}.card h2{margin:0;font-size:28px;text-align:center}.card p{margin:0;text-align:center}.field{display:flex;flex-direction:column;gap:4px;font-weight:600;font-size:14px;color:var(--muted)}input{font:inherit;font-size:18px;padding:10px 14px;border:3px solid var(--ink);border-radius:14px;background:#fff;color:var(--ink);outline:none;user-select:text;-webkit-user-select:text}input:focus{border-color:var(--blue-dark);box-shadow:0 0 0 3px #4aa8ff59}.btn,.choices button,.emote-picker button{font:inherit;font-weight:600;font-size:17px;color:var(--ink);cursor:pointer;border:3px solid var(--ink);border-radius:16px;background:#fff;padding:10px 16px;box-shadow:0 4px 0 var(--ink);transition:transform .08s,box-shadow .08s,background .15s;touch-action:manipulation}.btn:active,.choices button:active{transform:translateY(3px) scale(.98,.96);box-shadow:0 1px 0 var(--ink)}.btn.big{font-size:20px;padding:13px 20px}.btn.primary{background:var(--primary)}.btn.ghost{background:transparent;box-shadow:none;border-color:transparent;color:var(--muted)}.btn.icon{padding:10px 13px;min-width:48px}.btn:disabled{opacity:.5;cursor:default}.join{display:flex;gap:8px}.join input{flex:1;min-width:0;text-transform:uppercase;letter-spacing:.3em;text-align:center;font-weight:700}.howto{width:min(380px,100%);color:#e9ffe9;font-size:15px}.howto summary{cursor:pointer;text-align:center;font-weight:600}.howto ol{margin:8px 0 0;padding-left:20px;line-height:1.4}.group{display:flex;flex-direction:column;gap:6px;flex:1}.label{font-weight:600;font-size:14px;color:var(--muted)}.row{display:flex;gap:14px;flex-wrap:wrap}.choices{display:flex;gap:8px;flex-wrap:wrap}.choices button{flex:1;font-size:16px;padding:8px 10px;white-space:nowrap}.choices button.on{background:var(--primary)}.arenas button{display:flex;flex-direction:column;align-items:center;gap:6px;padding:8px;min-width:140px}.arenas canvas{width:100%;border-radius:8px;display:block}.actions{display:flex;gap:10px;justify-content:space-between;align-items:center}.code{font-size:64px;font-weight:700;letter-spacing:.18em;text-align:center;color:var(--blue-dark);user-select:all;-webkit-user-select:all}.waiting{display:flex;justify-content:center;align-items:center;gap:8px;color:var(--muted)}.dots i{display:inline-block;width:10px;height:10px;margin:0 2px;border-radius:50%;background:var(--red);animation:hop 1s ease-in-out infinite}.dots i:nth-child(2){background:var(--primary);animation-delay:.15s}.dots i:nth-child(3){background:var(--blue);animation-delay:.3s}@keyframes hop{0%,to{transform:translateY(0) scale(1.15,.85)}50%{transform:translateY(-9px) scale(.9,1.1)}}#match{padding:0;gap:0}#match .game{position:absolute;inset:0;width:100%;height:100%;touch-action:none}.hud-top,.hud-bottom{position:absolute;left:0;right:0;display:flex;align-items:center;gap:8px;padding:8px max(10px,env(safe-area-inset-left));pointer-events:none}.hud-top>*,.hud-bottom>*{pointer-events:auto}.hud-top{top:0;padding-top:max(8px,env(safe-area-inset-top));justify-content:space-between}.hud-bottom{bottom:0;padding-bottom:max(8px,env(safe-area-inset-bottom));justify-content:center}.chip{position:relative;display:flex;align-items:center;gap:6px;min-width:0;max-width:34vw;padding:6px 12px;background:var(--card);border:3px solid var(--ink);border-radius:999px;box-shadow:0 3px 0 var(--ink);font-weight:600;font-size:15px}.chip .names{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pname+.pname:before{content:" & ";color:var(--muted)}.pname.ready:after{content:" ✓";color:#1f9d3a;font-weight:700}.pname.offline{opacity:.5}.pname.offline:after{content:" 📡"}.chip .dot{flex:none;width:14px;height:14px;border-radius:50%;border:2px solid var(--ink)}.chip.team0 .dot{background:var(--blue)}.chip.team1 .dot{background:var(--red)}.chip .badge{display:none;flex:none;width:22px;height:22px;line-height:18px;text-align:center;border-radius:50%;background:#4cd964;border:2px solid var(--ink);font-size:13px}.chip.is-ready .badge{display:inline-block;animation:pop .3s ease-out}.chip.offline{opacity:.55}.chip.offline .name:after{content:" 📡"}@keyframes pop{0%{transform:scale(0)}70%{transform:scale(1.3)}to{transform:scale(1)}}.center{display:flex;flex-direction:column;align-items:center;flex:none}.scoreline{display:flex;gap:8px;align-items:center;padding:2px 16px;font-size:30px;font-weight:700;background:var(--ink);color:#fff;border-radius:14px;line-height:1.15}.scoreline .score0{color:#8fcaff}.scoreline .score1{color:#ffa3a3}.meta{margin-top:3px;font-size:13px;font-weight:600;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.6)}.timer.urgent{color:#ffd23f;animation:pulse .5s ease-in-out infinite alternate;display:inline-block}@keyframes pulse{to{transform:scale(1.25)}}#match:not([data-mode=planning]) .timer{visibility:hidden}.btn-skip{display:none}#match[data-mode=playback] .btn-skip{display:inline-block}#match[data-mode=playback] .btn-ready,#match[data-mode=playback] .btn-clear,#match[data-mode=finished] .btn-ready,#match[data-mode=finished] .btn-clear,#match[data-mode=idle] .btn-ready,#match[data-mode=idle] .btn-clear{display:none}#match.me-ready .btn-ready{background:#d8f5d8}#match.me-ready .btn-clear{visibility:hidden}.btn-ready{min-width:150px}.emotes{position:relative}.emote-picker{position:absolute;bottom:calc(100% + 10px);left:50%;transform:translate(-50%) scale(.6);transform-origin:bottom center;opacity:0;pointer-events:none;display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:8px;background:var(--card);border:3px solid var(--ink);border-radius:18px;box-shadow:0 4px 0 var(--ink);transition:transform .15s,opacity .15s}.emote-picker.open{opacity:1;transform:translate(-50%) scale(1);pointer-events:auto}.emote-picker button{font-size:22px;padding:4px 8px;box-shadow:0 2px 0 var(--ink)}.emote-bubble{position:absolute;top:calc(100% + 8px);left:50%;padding:4px 12px;font-size:30px;font-weight:700;background:#fff;border:3px solid var(--ink);border-radius:18px;white-space:nowrap;animation:bubble 2.6s ease-out forwards;z-index:3}.emote-bubble:before{content:"";position:absolute;top:-10px;left:50%;margin-left:-8px;border:8px solid transparent;border-bottom-color:var(--ink);border-top:none}@keyframes bubble{0%{transform:translate(-50%) scale(0)}10%{transform:translate(-50%) scale(1.2)}18%{transform:translate(-50%) scale(1)}80%{opacity:1}to{opacity:0;transform:translate(-50%) translateY(-6px)}}.tip{position:absolute;left:50%;bottom:calc(80px + env(safe-area-inset-bottom));width:min(440px,calc(100% - 32px));transform:translate(-50%,20px);opacity:0;pointer-events:none;padding:10px 14px;background:#fffbe0;border:3px solid var(--ink);border-radius:16px;box-shadow:0 4px 0 var(--ink);font-weight:500;text-align:center;transition:opacity .25s,transform .25s}.tip.open{opacity:1;transform:translate(-50%)}.results,.overlay{position:absolute;inset:0;display:none;align-items:center;justify-content:center;padding:16px;background:#0a1e0f73}.results.open,.overlay.open{display:flex;animation:fadein .3s ease-out}.results .card,.overlay .card{animation:pop .35s ease-out}.results h2{font-size:40px}.results[data-win=true] h2{color:#1f8a3a}.results[data-win=false] h2{color:var(--red-dark)}.results .sub{font-size:28px;font-weight:700}.rematch-status{min-height:1.2em;color:var(--muted)}.btn-rematch.voted{background:#d8f5d8}@keyframes fadein{0%{opacity:0}}#toast{position:fixed;left:50%;top:16px;transform:translate(-50%,-120%);max-width:calc(100% - 32px);padding:10px 16px;background:var(--ink);color:#fff;border-radius:14px;font-weight:500;transition:transform .25s,opacity .25s;opacity:0;pointer-events:none;z-index:10}#toast.open{transform:translate(-50%);opacity:1}#offline{position:fixed;left:50%;bottom:16px;transform:translate(-50%);padding:8px 14px;border-radius:12px;background:var(--red-dark);color:#fff;font-weight:600;display:none;z-index:10}body.offline #offline{display:block}@media(max-width:520px),(max-height:520px){.chip{font-size:13px;padding:4px 9px}.scoreline{font-size:24px}.btn.big{font-size:18px;padding:11px 16px}.btn-ready{min-width:120px}.arenas button{min-width:0}}@media(max-height:520px){.card{padding:14px;gap:8px}.logo{font-size:54px}}.timer:before{content:" · "}.overlay{z-index:5}.quit-dialog .sub{color:var(--muted)}.dialog-blob{align-self:center;width:70px;height:70px;animation:jiggle 2.4s ease-in-out infinite}.btn.danger{background:var(--red);color:#fff}.code-inline{color:var(--blue-dark);letter-spacing:.12em;user-select:all;-webkit-user-select:all}.lobby-meta{color:var(--muted);font-weight:500}.lobby-teams{display:grid;grid-template-columns:1fr .8fr 1fr;gap:10px}.lobby-col{display:flex;flex-direction:column;gap:8px;padding:10px;border:3px solid var(--ink);border-radius:16px;background:#fff}.lobby-col.team0{background:#e3f2ff}.lobby-col.team1{background:#ffe6e3}.lobby-col.bench{background:#f4efe3;border-style:dashed}.lobby-col h3{margin:0;font-size:18px;display:flex;align-items:center;gap:6px}.lobby-col h3 .dot{width:14px;height:14px;border-radius:50%;border:2px solid var(--ink)}.lobby-col.team0 .dot{background:var(--blue)}.lobby-col.team1 .dot{background:var(--red)}.lobby-col .slots{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;min-height:40px;flex:1}.lobby-col li{padding:6px 10px;border-radius:10px;background:#ffffffd9;border:2px solid rgba(28,42,31,.15);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lobby-col li.empty{color:var(--muted);font-weight:500;border-style:dashed;background:transparent}.lobby-col li.me{border-color:var(--ink)}.lobby-col li.offline{opacity:.5}.lobby-col .join-team{font-size:15px;padding:7px 10px}.lobby-col.mine .join-team{visibility:hidden}#lobby-start:disabled{opacity:.45;cursor:not-allowed}#match.is-local .btn-lobby{display:none}@media(max-width:560px){.lobby-teams{grid-template-columns:1fr 1fr}.lobby-col.bench{grid-column:1 / -1;order:3}}
