@import"https://fonts.googleapis.com/css2?family=Baloo+2:wght@600;700;800&display=swap";*{box-sizing:border-box}body{margin:0;min-height:100vh;background:#101b32;color:#fff;font-family:"Baloo 2",system-ui,sans-serif}#game{position:fixed;top:0;right:0;bottom:0;left:0;margin:auto;width:min(1200px,100vw);height:min(600px,50vw);display:none;box-shadow:0 16px 60px #0008}canvas{width:100%!important;height:100%!important;display:block}.screen{min-height:100vh;display:flex;justify-content:center;padding:24px;background:radial-gradient(circle at 50% 0,#6250a6,#152448 58%,#0c1429)}.panel{width:min(940px,100%);margin:auto;background:#1e315bdf;border:2px solid #ffffff2b;border-radius:26px;padding:28px;box-shadow:0 20px 70px #0007}.title{display:flex;align-items:center;justify-content:center;gap:12px;text-align:center;font-size:clamp(38px,7vw,76px);line-height:.9;margin:0;color:#ffe560;text-shadow:0 5px #d2594f,-2px 0 #d2594f,2px 0 #d2594f}.title-fruit{width:clamp(52px,9vw,92px);height:auto;filter:drop-shadow(0 6px 10px #0006)}.tagline{text-align:center;font-size:19px;margin:16px 0 26px;color:#d8e6ff}.actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;max-width:570px;margin:auto}.btn{border:0;border-radius:14px;background:#ffcc4f;color:#29234c;padding:13px 18px;font-family:inherit;font-weight:800;font-size:18px;cursor:pointer;box-shadow:0 5px #b7743e;transition:transform .12s,filter .12s}.btn:hover{transform:translateY(-2px);filter:brightness(1.08)}.btn:active{transform:translateY(1px)}.btn.secondary{background:#7ed8f6;box-shadow:0 5px #357da4}.btn.danger{background:#ff8091;box-shadow:0 5px #a93d5a}.row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.field{background:#112343;border:1px solid #ffffff2b;border-radius:10px;padding:10px 12px;color:#fff;font:inherit}.fruit-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.fruit{background:#142749;border:2px solid transparent;border-radius:16px;padding:10px 8px;text-align:center;cursor:pointer;color:#fff;font-family:inherit;display:grid;justify-items:center;gap:2px;transition:transform .12s,background .12s}.fruit:hover{transform:translateY(-3px);background:#1d3562}.fruit.selected{border-color:#ffe560;background:#314777}.fruit-art{width:74px;height:92px;object-fit:contain;filter:drop-shadow(0 4px 6px #0005)}.fruit.selected .fruit-art{animation:bob 1.6s ease-in-out infinite}.fruit small{color:#b7caea}@keyframes bob{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}.card{background:#102244a8;border-radius:16px;padding:16px}.fighter-card{display:flex;gap:18px;align-items:center;margin-top:14px}.fighter-card h2{margin:0 0 6px}.fighter-portrait{width:118px;height:146px;object-fit:contain;filter:drop-shadow(0 8px 12px #0006);animation:bob 2.4s ease-in-out infinite}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.bar{height:8px;background:#0b1630;border-radius:5px;overflow:hidden}.bar i{display:block;height:100%;background:#70dc8d}.room-players{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.slot{background:#102244;border-radius:10px;padding:6px 12px;display:flex;align-items:center;gap:8px;min-height:46px}.slot-art{width:34px;height:42px;object-fit:contain;vertical-align:middle}.slot .muted{margin-left:auto}.bot-tag{font-style:normal;font-size:11px;font-weight:800;letter-spacing:.5px;background:#3c5a8f;color:#cfe2ff;border-radius:6px;padding:1px 5px;margin-left:5px;vertical-align:middle}.bot-slot{border:1px dashed #ffffff33}.result-row{display:flex;align-items:center;gap:8px;margin:6px 0}.result-row span{margin-left:auto}.muted{color:#b7caea}#hud{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:5}.hud-frame{position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;width:min(1200px,100vw);height:min(600px,50vw)}.hud-top{position:absolute;top:10px;left:50%;transform:translate(-50%);background:#132544cc;border-radius:12px;padding:4px 18px;font-size:22px;font-weight:800;letter-spacing:1px}.hud-scores{position:absolute;top:10px;right:10px;background:#132544cc;border-radius:12px;padding:8px 12px;font-size:14px;min-width:130px;display:grid;gap:3px}.hud-scores div{display:flex;gap:6px}.hud-scores b{margin-left:auto}.hud-scores .me{color:#ffe560}.hud-bottom{position:absolute;bottom:10px;left:10px;background:#132544d9;border-radius:12px;padding:8px 14px;font-size:14px;min-width:250px}.hud-bottom b{font-size:16px;color:#9fd0ff}.hud-bottom b.ready{color:#ffe560}.cooldown{height:6px;background:#0b1630;border-radius:3px;overflow:hidden;margin:5px 0 6px}.cooldown i{display:block;height:100%;width:0;background:linear-gradient(90deg,#4f9de0,#ffe560);transition:width .12s linear}.carry{position:absolute;bottom:10px;right:10px;display:flex;align-items:center;gap:10px;background:#132544e6;border:2px solid var(--tint, #ffcc4f);border-radius:14px;padding:7px 14px 7px 8px;box-shadow:0 0 18px -4px var(--tint, #ffcc4f)}.carry[hidden]{display:none}.carry img{width:42px;height:42px}.carry b{display:block;font-size:16px;color:var(--tint, #ffcc4f)}.carry small{color:#d8e6ff}.carry.pop{animation:carry-pop .45s ease-out}@keyframes carry-pop{0%{transform:scale(.7);opacity:0}60%{transform:scale(1.08)}to{transform:scale(1);opacity:1}}.bot-row{display:flex;align-items:center;gap:8px;margin-top:8px;flex-wrap:wrap}.bot-picker{display:flex;gap:6px}.chip{border:2px solid #ffffff2b;background:#10203d;color:#cfe2ff;border-radius:10px;padding:5px 10px;font-family:inherit;font-weight:800;font-size:13px;cursor:pointer}.chip:hover{border-color:#7ed8f6}.chip.on{background:#ffcc4f;color:#29234c;border-color:#ffcc4f}.chip.sound,.chip.music{background:#3a2b52;color:#d9c6ff}.chip.music.on{background:#b493f0;color:#241a3d;border-color:#b493f0}.chip.sound.on{background:#7ed8f6;color:#16304a;border-color:#7ed8f6}.pause-screen{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;background:#0a1224b8;pointer-events:auto;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.pause-screen[hidden]{display:none}.pause-card{background:#1e315bf2;border:2px solid #ffffff2b;border-radius:22px;padding:22px 28px;text-align:center;box-shadow:0 20px 70px #0008}.pause-card h2{margin:0 0 4px;font-size:40px;color:#ffe560;text-shadow:0 4px #d2594f}.pause-card .bot-row{justify-content:center}.respawn{position:absolute;top:44%;left:50%;transform:translate(-50%);font-size:30px;font-weight:800;color:#ffe560;text-shadow:0 4px #00000066}.toast{position:absolute;top:16px;right:16px;background:#e15b62;padding:10px 14px;border-radius:10px}.panel.wide{width:min(1080px,100%)}.panel.narrow{width:min(560px,100%)}.row.center{justify-content:center}.muted.center{text-align:center}.section-title{text-align:center;margin:22px 0 12px;color:#ffe560;letter-spacing:1px}.join-box{display:grid;gap:6px;max-width:360px;margin:0 auto 18px}.join-box label{letter-spacing:2px;font-size:13px;text-align:center}.code-input{font-size:30px;letter-spacing:4px;text-align:center;text-transform:uppercase;padding:14px 10px}.code-input:focus{outline:none;border-color:#ffcc4f;box-shadow:0 0 0 3px #ffcc4f33}.form-error{min-height:20px;margin:0;text-align:center;color:#ff9aa6;font-size:14px}.btn:disabled{opacity:.45;cursor:not-allowed;transform:none;filter:none}.howto-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.how-card h3{margin:0 0 10px;color:#ffe560;letter-spacing:.5px}.how-card p{margin:0 0 10px;line-height:1.5;font-size:15px}.how-card p:last-child{margin-bottom:0}.keys{display:grid;grid-template-columns:auto minmax(0,1fr);gap:9px 14px;margin:0;align-items:center}.keys dt{display:flex;gap:5px;justify-content:flex-start;min-width:86px}.keys dd{margin:0}.keys dd b{display:block;font-size:15px}.keys dd small,.crate-row small,.special-card small{display:block;color:#b7caea;font-size:13px;line-height:1.3}kbd{display:inline-block;vertical-align:middle;line-height:1.1;background:#0f1d38;border:2px solid #ffffff2e;border-bottom-width:4px;border-radius:8px;padding:3px 9px;font:700 13px "Baloo 2",system-ui,sans-serif;color:#fff;white-space:nowrap}.crate-list{display:grid;gap:8px;margin-top:12px}.crate-row{display:flex;align-items:center;gap:10px;background:#0e1d3a80;border-radius:12px;padding:7px 10px}.crate-row img{width:38px;height:38px}.special-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.special-card{background:#142749;border-radius:14px;padding:10px 6px;text-align:center;display:grid;justify-items:center;gap:2px}.special-card img{width:62px;height:78px;object-fit:contain}.winner{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;gap:26px;flex-wrap:wrap;margin:10px 0 4px;padding:26px 24px;border-radius:22px;background:radial-gradient(circle at 50% 30%,#4b3f86,#1b2c52 70%);border:2px solid #ffe56055}.winner.is-you{border-color:#ffe560;box-shadow:0 0 34px -8px #ffe56099}.winner.is-draw{background:radial-gradient(circle at 50% 30%,#3b4a7a,#182643 70%);border-color:#fff3}.winner-stage{position:relative;display:grid;place-items:center;animation:winner-pop .65s cubic-bezier(.2,1.5,.45,1) both}.winner-faces{display:flex;gap:2px;align-items:flex-end;z-index:1}.winner-portrait{width:134px;height:166px;object-fit:contain;filter:drop-shadow(0 10px 14px #0007);animation:winner-float 2.6s ease-in-out infinite}.winner-faces .winner-portrait:nth-child(2){width:92px;height:116px;animation-delay:.25s}.winner-faces .winner-portrait:nth-child(3){width:78px;height:98px;animation-delay:.5s}.rays{position:absolute;width:250px;height:250px;border-radius:50%;-webkit-mask-image:radial-gradient(circle,#000 34%,transparent 72%);mask-image:radial-gradient(circle,#000 34%,transparent 72%);background:repeating-conic-gradient(from 0deg,#ffe5602e 0 10deg,transparent 10deg 30deg);animation:winner-spin 14s linear infinite;opacity:.75}.winner.is-draw .rays{display:none}.crown{position:absolute;top:-6px;z-index:2;font-size:40px;filter:drop-shadow(0 4px 6px #0008);animation:crown-drop .7s cubic-bezier(.2,1.6,.4,1) both .15s}.winner-text{text-align:left;min-width:220px}.winner-label{display:inline-block;background:#ffe560;color:#2b2340;border-radius:8px;padding:2px 10px;font-weight:800;font-size:13px;letter-spacing:2px}.winner.is-draw .winner-label{background:#b7caea;color:#1b2742}.winner-name{margin:8px 0 2px;font-size:clamp(30px,5vw,46px);line-height:1;color:#fff;text-shadow:0 4px #0006}.winner-sub{margin:0;color:#d8e6ff;font-size:16px}.winner-you{margin:8px 0 0;color:#ffe560;font-weight:800;letter-spacing:1px;animation:winner-float 1.6s ease-in-out infinite}.confetti{position:absolute;top:-14px;width:9px;height:14px;border-radius:2px;opacity:0;animation-name:confetti-fall;animation-timing-function:linear;animation-iteration-count:2}@keyframes winner-pop{0%{transform:scale(.4) translateY(18px);opacity:0}to{transform:none;opacity:1}}@keyframes winner-float{0%,to{transform:translateY(0)}50%{transform:translateY(-7px)}}@keyframes winner-spin{to{transform:rotate(360deg)}}@keyframes crown-drop{0%{transform:translateY(-34px) rotate(-22deg);opacity:0}to{transform:none;opacity:1}}@keyframes confetti-fall{0%{opacity:1;transform:translateY(0) rotate(0)}to{opacity:0;transform:translateY(240px) rotate(520deg)}}.standings .result-row{padding:5px 8px;border-radius:10px}.result-row.me{background:linear-gradient(90deg,#ffe5602e,#ffe56010);box-shadow:inset 0 0 0 1px #ffe56066}.result-row.me b{color:#ffe560}.rank{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#0f1d38;font-size:13px;font-weight:800;color:#b7caea;flex:none}.rank-1{background:#ffd54f;color:#4a3708}.rank-2{background:#cfd8e6;color:#33415c}.rank-3{background:#d59a5c;color:#3d2408}.team-tag{font-style:normal;font-size:11px;font-weight:800;border-radius:6px;padding:1px 6px;margin-left:5px}.team-tag.red{background:#7a2f3d;color:#ffc4cd}.team-tag.blue{background:#2c4a7a;color:#c4dcff}@media(max-width:620px){.winner{gap:12px;padding:16px}.winner-text{text-align:center}.winner-portrait{width:96px;height:120px}}@media(prefers-reduced-motion:reduce){.winner-stage,.winner-portrait,.crown,.rays,.confetti,.winner-you{animation:none}.confetti{display:none}}@media(max-width:760px){.howto-grid{grid-template-columns:1fr}.special-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.code-input{font-size:24px}}@media(max-width:600px){.fruit-grid{grid-template-columns:repeat(2,1fr)}.actions,.room-players{grid-template-columns:1fr}.fighter-card{flex-direction:column;text-align:center}}