:root{--bg:#16181d;--panel:#1f2229;--panel-edge:#2c313b;--text:#e8eaf0;--muted:#8b93a3;--accent:#4caf50;--danger:#ef5350;font-family:Segoe UI,system-ui,sans-serif}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--text);margin:0}#app{flex-direction:column;height:100vh;display:flex}.topbar{background:var(--panel);border-bottom:1px solid var(--panel-edge);align-items:center;gap:16px;padding:8px 16px;display:flex}.topbar h1{letter-spacing:1px;margin:0;font-size:20px}.content{flex:1;min-height:0;display:flex}.mode-setup .match-controls,.mode-setup .hud,.mode-setup .console,.mode-battle .setup-panel{display:none}.setup-panel{flex-shrink:0;width:760px;max-width:100%;margin:0 auto;padding:16px;overflow-y:auto}.hidden{display:none!important}.mode-toggle{margin-left:auto;display:inline-flex}.btn-mode{border-radius:0}.btn-mode:first-child{border-radius:4px 0 0 4px}.btn-mode:last-child{border-left:none;border-radius:0 4px 4px 0}.btn-mode-active{background:var(--accent);border-color:var(--accent);color:#0c130d;font-weight:600}.btn-mode-active:hover:not(:disabled){background:var(--accent)}.blocks-host{border:1px solid var(--panel-edge);border-radius:4px;width:100%;height:460px;margin-top:8px;overflow:hidden}.input-name{flex:1;min-width:0}.setup-panel h2{text-transform:uppercase;letter-spacing:1px;color:var(--muted);margin:20px 0 8px;font-size:14px}.editor{color:#d8e0ea;border:1px solid var(--panel-edge);resize:vertical;white-space:pre;background:#14161a;border-radius:4px;width:100%;height:260px;margin-top:8px;padding:10px;font-family:SF Mono,Menlo,Consolas,monospace;font-size:13px;line-height:1.45}.input,.select{color:var(--text);border:1px solid var(--panel-edge);background:#14161a;border-radius:4px;padding:6px 8px;font-size:13px}.select{min-width:0}.input-seed{width:110px}.input-player{flex:1;min-width:0}.row{flex-wrap:wrap;align-items:center;gap:8px;margin-top:8px;display:flex}.row label{color:var(--muted);font-size:13px}.row-center{justify-content:center}.btn{color:var(--text);cursor:pointer;background:#2c313b;border:1px solid #3a404d;border-radius:4px;padding:6px 14px;font-size:13px}.btn:hover:not(:disabled){background:#353b47}.btn:disabled{opacity:.4;cursor:default}.btn-primary{background:var(--accent);border-color:var(--accent);color:#0c130d;font-weight:600}.btn-primary:hover:not(:disabled){background:#5dbf61}.btn-danger{border-color:var(--danger);color:var(--danger)}.btn-icon{padding:6px 9px}.btn-start{width:100%;margin-top:16px;padding:10px;font-size:15px}.hint{color:var(--muted);margin-top:6px;font-size:12px}.error{color:var(--danger);min-height:18px;margin-top:8px;font-size:13px}.players{flex-direction:column;gap:6px;margin-bottom:8px;display:flex}.player-row{align-items:center;gap:8px;display:flex}.player-row .select{flex:1}.swatch{border:1px solid #0006;border-radius:50%;flex-shrink:0;width:14px;height:14px}.battle-area{flex:1;min-height:0;display:flex;position:relative}.game-host{flex:1;min-width:0;min-height:0}.game-host canvas{display:block}.hud{background:var(--panel);border-left:1px solid var(--panel-edge);flex-direction:column;gap:8px;width:190px;padding:10px;display:flex;overflow-y:auto}.tank-card{border:1px solid var(--panel-edge);background:#181b21;border-radius:6px;padding:8px}.tank-card.tank-dead{opacity:.45}.tank-card-head{align-items:center;gap:7px;margin-bottom:6px;display:flex}.tank-name{text-overflow:ellipsis;white-space:nowrap;font-size:13px;font-weight:600;overflow:hidden}.team-chip{color:var(--muted);background:#2c313b;border:1px solid #3a404d;border-radius:8px;flex-shrink:0;margin-left:auto;padding:1px 6px;font-size:10px;font-weight:700}.select-team{flex-shrink:0;width:96px}.hp-bar{background:#14161a;border-radius:4px;height:8px;overflow:hidden}.hp-fill{background:var(--accent);width:100%;height:100%;transition:width .15s linear}.hp-fill.hp-low{background:var(--danger)}.tank-status{color:var(--muted);margin-top:5px;font-size:11px}.tank-modules{color:#7986cb;text-transform:uppercase;letter-spacing:.5px;margin-top:3px;font-size:10px}.match-controls{flex:1;align-items:center;gap:10px;display:flex}.clock{min-width:48px;font-family:SF Mono,Menlo,Consolas,monospace;font-size:16px}.toggle{color:var(--muted);align-items:center;gap:5px;font-size:13px;display:flex}.status-line{color:var(--muted);margin-left:auto;font-size:13px}.console{background:var(--panel);border-top:1px solid var(--panel-edge);flex-direction:column;height:150px;display:flex}.console-title{text-transform:uppercase;letter-spacing:1px;color:var(--muted);padding:4px 12px;font-size:11px}.console-body{flex:1;padding:0 12px 8px;font-family:SF Mono,Menlo,Consolas,monospace;font-size:12px;line-height:1.5;overflow-y:auto}.console-line{white-space:pre-wrap;align-items:baseline;gap:7px;display:flex}.console-line .swatch{align-self:center;width:8px;height:8px}.console-source{color:var(--muted);flex-shrink:0}.console-err{color:var(--danger)}.console-info{color:#ffca28}.overlay{z-index:10;background:#0a0c0fb3;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.overlay.hidden{display:none}.winner-screen{text-align:center;animation:.45s cubic-bezier(.2,1.6,.4,1) winner-pop}.winner-trophy{margin-bottom:8px;font-size:72px;line-height:1}.winner-banner{letter-spacing:2px;text-transform:uppercase;text-shadow:0 0 24px,0 4px #0000008c;margin:0 24px;font-size:clamp(48px,8vw,96px);font-weight:800}.winner-subtitle{color:var(--text);opacity:.75;margin:14px 0 26px;font-size:18px}@keyframes winner-pop{0%{opacity:0;transform:scale(.4)}to{opacity:1;transform:scale(1)}}.overlay-card{background:var(--panel);border:1px solid var(--panel-edge);text-align:center;border-radius:10px;max-width:420px;padding:28px 36px}.overlay-card h2{margin:0 0 8px}.overlay-card p{color:var(--muted);margin:0 0 18px}
