:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#f1f4ee;background:#172434;font-synthesis:none}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0}body{overflow:hidden}button,select{font:inherit}button{cursor:pointer}button:disabled{cursor:default;opacity:.48}.hidden{display:none!important}.shell{height:100%;height:100dvh;display:flex;flex-direction:column;gap:8px;padding:max(8px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left))}.topbar{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:30px}.brand{font-weight:900;letter-spacing:.09em;font-size:clamp(15px,2vw,23px);line-height:1}.brand span{display:block;font-size:9px;letter-spacing:.22em;opacity:.6;margin-top:3px}.stage{color:#b9d1cd;font-size:12px;white-space:nowrap}.arena-wrap{position:relative;flex:1 1 auto;min-height:0;display:grid;place-items:center;overflow:hidden}canvas{display:block;max-width:100%;max-height:100%;border:1px solid #9eb9b8;border-radius:7px}.overlay{position:fixed;z-index:20;top:50%;left:50%;transform:translate(-50%,-50%);width:min(590px,calc(100vw - 20px));max-height:calc(100dvh - 20px);overflow:auto;display:flex;flex-direction:column;gap:10px;padding:18px;border:1px solid #8ba6b0;border-radius:15px;background:#172434f7;box-shadow:0 16px 54px #061015b8}.overlay h1,.overlay h2,.overlay p{margin:0}.overlay h1,.overlay h2{font-size:22px}.objective{color:#e3ead8;font-size:13px}.help{color:#bed0cc;font-size:12px;line-height:1.35}.hero-picker{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.hero-card{display:flex;align-items:center;gap:7px;position:relative;padding:7px;border:1px solid #66818c;border-radius:9px;background:#24394b;min-height:84px;cursor:pointer}.hero-card:has(input:checked){border-color:#ffc857;background:#365267;box-shadow:inset 0 0 0 1px #ffc857}.hero-card input{position:absolute;top:9px;right:9px;accent-color:#e7d781}.portrait{flex:0 0 52px;width:52px;height:52px}.portrait svg{display:block;width:100%;height:100%}.hero-details{display:flex;flex-direction:column;gap:4px;min-width:0}.hero-card strong{font-size:13px;padding-right:14px}.hero-card small{font-size:11px;color:#cadbd5;line-height:1.35}.settings-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.settings-row label{display:flex;flex-direction:column;gap:4px;color:#c8d8d4;font-size:12px}.overlay select,.overlay button,.hud button{min-height:40px;border:1px solid #7898a6;background:#2b4a60;color:#fff;border-radius:8px;padding:7px 10px}.overlay button:focus-visible,.hud button:focus-visible,.overlay select:focus-visible,.hero-card:focus-within{outline:3px solid #ffc857;outline-offset:2px}.overlay button:hover:not(:disabled),.hud button:hover:not(:disabled){background:#387066}.overlay button.primary{background:#1d7094;border-color:#84d6f6;font-weight:700}.sound-toggle{color:#c8d8d4;font-size:12px}.sound-toggle input{accent-color:#7bcca1}.panel{width:min(450px,calc(100vw - 20px))}.panel-actions{display:flex;gap:8px}.panel-actions button{flex:1}.rotate-hint{background:#654125;color:#ffe8bc;padding:9px;border-radius:8px;font-weight:700}.final-score{font-size:35px;font-weight:900;color:#f6e5a0;text-align:center}.result-stats{display:grid;gap:4px;text-align:center;color:#e3ead8;font-size:13px;line-height:1.35}#zoneParticipation{color:#9ad8fb;font-weight:700}.countdown{position:absolute;z-index:3;font-size:clamp(72px,12vw,128px);font-weight:900;text-shadow:0 3px 15px #1c282b;pointer-events:none}.diagnostics{position:absolute;top:8px;right:8px;z-index:6;max-width:min(450px,95%);margin:0;padding:7px;border-radius:6px;background:#10232cde;color:#e5f8e9;font:10px/1.25 ui-monospace,Consolas,monospace;white-space:pre-wrap;pointer-events:none}.hud{flex:0 0 auto;min-height:50px;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:clamp(6px,1.3vw,16px);color:#b8ceca;font-size:12px}.score{display:flex;align-items:center;gap:4px;font-size:22px;color:#fff}.score strong:first-child{color:#83d1fa}.score strong:last-child{color:#fa9d95}.team-sign{width:9px;height:9px;display:inline-block;background:#248dff;border:1px solid #fff;border-radius:50%}.red-sign{background:#f55259;border-radius:0;transform:rotate(45deg)}.time{color:#f0f4e7;font-size:16px}.zone{min-width:130px;text-align:center}.zone[data-owner=contested]{color:#ffd089;font-weight:700}.zone[data-owner=blue]{color:#83d1fa}.zone[data-owner=red]{color:#fa9d95}.meters{display:flex;gap:9px}.meters label{display:flex;flex-direction:column;gap:3px;min-width:112px}.meters progress{width:100%;height:7px;accent-color:#75d9a8}#chargeBar{accent-color:#f5d36e}.hud button{min-height:44px}.hud button.ready,.touch-ability.ready{background:#8c6532;border-color:#ffc857;color:#fff6d5;opacity:1}.ability-icon{width:21px;height:21px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}.ability-icon svg{width:100%;height:100%;display:block}#abilityDesktop{display:flex;align-items:center;justify-content:center;gap:5px}.touch-controls{display:none}.stick{position:relative;width:92px;height:92px;border:2px solid #e5f4eb;border-radius:50%;background:#365c70ee;box-shadow:0 2px 10px #0b152c88;touch-action:none;user-select:none;-webkit-user-select:none}.stick.active{border-color:#f4de9c;background:#315762bd}.stick-thumb{position:absolute;left:50%;top:50%;width:41px;height:41px;border-radius:50%;background:#e2eadcc9;transform:translate(-50%,-50%);pointer-events:none}.stick span{position:absolute;left:50%;bottom:6px;transform:translate(-50%);font-size:10px;white-space:nowrap;text-shadow:0 1px 4px #000;pointer-events:none}.touch-ability{min-width:64px;min-height:64px;max-width:74px;padding:5px;border:2px solid #dce9e4;border-radius:14px;background:#365c70ee;box-shadow:0 2px 10px #0b152c88;color:#fff;font-size:11px;font-weight:700;touch-action:manipulation;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px}.touch-ability:disabled{opacity:.72}@media(pointer:coarse){.overlay button,.hud button{min-height:48px;min-width:48px}.touch-controls.playing{display:block;position:absolute;inset:0;z-index:4;pointer-events:none}.touch-cluster{position:absolute;left:8px;bottom:8px;display:flex;align-items:flex-end;gap:8px;pointer-events:auto}.touch-controls[data-side=right] .touch-cluster{left:auto;right:8px;flex-direction:row-reverse}.touch-controls.manual .touch-cluster{left:8px;right:auto;flex-direction:row}.aim-stick{display:none;position:absolute;right:8px;bottom:8px;pointer-events:auto}.touch-controls.manual .aim-stick{display:block}#abilityDesktop{display:none}}@media(max-height:450px){.shell{gap:4px}.brand span{display:none}.topbar{min-height:21px}.hud{min-height:44px;font-size:10px;gap:6px}.score{font-size:18px}.time{font-size:13px}.zone{min-width:105px}.meters label{min-width:84px}.hud button{min-height:40px;padding:5px 7px}.overlay{gap:6px;padding:10px}.overlay h1,.overlay h2{font-size:18px}.hero-card{min-height:64px;padding:5px;gap:4px}.portrait{flex-basis:39px;width:39px;height:39px}.hero-card strong{font-size:11px}.hero-card small,.objective,.help{font-size:10px}.overlay select,.overlay button{min-height:34px;padding:5px 7px}.stick{width:76px;height:76px}.stick-thumb{width:33px;height:33px}.touch-ability{min-width:58px;min-height:58px}}@media(pointer:coarse)and (max-height:450px){.overlay button,.hud button{min-height:48px}}@media(max-width:480px)and (orientation:portrait){.hero-picker{grid-template-columns:1fr}.hero-card{min-height:62px}.settings-row{grid-template-columns:1fr}.meters{width:100%;justify-content:center}.hud{gap:4px}}