:root{--bar-h: clamp(148px, 20vh, 240px);--ink: #e8eef5;--ink-dim: #93a2b3;--ink-faint: #64717f;--chrome-0: #0b0e12;--chrome-1: #141a21;--chrome-2: #1c242d;--chrome-3: #27313c;--edge: #38434f;--blue: #4ea3ff;--blue-deep: #3f7fe8;--red: #e0462f;--minerals: #6fe0ff;--gas: #35d67a;--hp-good: #3fdc4a;--hp-warn: #e8d23c;--hp-bad: #e0402c;--warn: #ff4b3e;--ok: #46e05a;--ui: "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;--mono: "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace}*{box-sizing:border-box}html,body{margin:0;padding:0;width:100%;height:100%;overflow:hidden;background:#05070a;color:var(--ink);font-family:var(--ui);-webkit-font-smoothing:antialiased;user-select:none;cursor:default}#app{position:fixed;inset:0}#gl{position:absolute;inset:0;display:block;width:100%;height:100%}#hud{position:absolute;inset:0;pointer-events:none;z-index:10;font-size:13px;line-height:1.25}.hud-top{position:absolute;top:0;right:0;display:flex;gap:6px;padding:6px 10px;pointer-events:auto;background:linear-gradient(180deg,rgba(8,11,15,.92),rgba(8,11,15,.55) 70%,transparent);border-bottom-left-radius:8px}.res{display:flex;align-items:center;gap:6px;min-width:78px;padding:3px 9px;border-radius:4px;background:#141a21d9;border:1px solid var(--chrome-3);font-variant-numeric:tabular-nums}.res .ico{width:9px;height:9px;border-radius:2px;flex:0 0 auto;transform:rotate(45deg)}.res .val{font-family:var(--mono);font-size:15px;font-weight:600;letter-spacing:.3px;color:var(--ink)}.res-min .ico{background:var(--minerals);box-shadow:0 0 6px #6fe0ff80}.res-gas .ico{background:var(--gas);box-shadow:0 0 6px #35d67a73}.res-sup .ico{background:var(--blue);transform:none;border-radius:50%}.res-clock .ico{display:none}.res-clock{min-width:62px;color:var(--ink-dim)}.res-clock .val{color:var(--ink-dim);font-size:14px}.res-sup.tight .val{color:var(--hp-warn)}.res-sup.blocked{border-color:var(--warn);background:#60140ee6;animation:supply-pulse .9s ease-in-out infinite}.res-sup.blocked .val{color:#ffd7d2}.res-sup.blocked .ico{background:var(--warn)}@keyframes supply-pulse{0%,to{box-shadow:0 0 #ff4b3e00}50%{box-shadow:0 0 0 3px #ff4b3e59}}.hud-warn{position:absolute;top:46px;right:12px;display:none;padding:5px 12px;border-radius:4px;background:#8c1a12eb;border:1px solid var(--warn);color:#fff3f1;font-weight:700;font-size:13px;letter-spacing:.4px;text-shadow:0 1px 2px rgba(0,0,0,.7);animation:supply-pulse .9s ease-in-out infinite}.hud-warn.show{display:block}.hud-flash{position:absolute;left:50%;top:16%;transform:translate(-50%);display:none;padding:6px 16px;border-radius:4px;background:#0a0d11d1;border:1px solid #6b3a30;color:#ffd9d2;font-size:15px;font-weight:600;letter-spacing:.3px;text-shadow:0 1px 3px #000;white-space:nowrap}.hud-flash.show{display:block}.hud-banner{position:absolute;left:50%;top:34%;transform:translate(-50%,-50%);display:none;padding:14px 46px;border-radius:6px;background:#080b0fe0;border:2px solid var(--ok);color:var(--ok);font-size:46px;font-weight:800;letter-spacing:6px}.hud-banner.show{display:block}.hud-banner.lose{border-color:var(--red);color:var(--red)}.hud-place{position:absolute;left:50%;top:22%;transform:translate(-50%);display:none;padding:4px 12px;border-radius:4px;background:#0a0d11c7;border:1px solid var(--chrome-3);color:var(--ok);font-size:13px;font-weight:600;letter-spacing:.3px;text-shadow:0 1px 3px #000;white-space:nowrap}.hud-place.show{display:block}.hud-place.bad{color:var(--red);border-color:#6b3a30}.hud-bar{position:absolute;left:0;right:0;bottom:0;height:var(--bar-h);display:flex;align-items:stretch;gap:8px;padding:8px;pointer-events:auto;background:linear-gradient(180deg,#10161d,#0b0e12);border-top:1px solid var(--edge);box-shadow:0 -6px 18px #0000008c}.hud-minimap{position:relative;flex:0 0 auto;padding:3px;border:1px solid var(--chrome-3);border-radius:4px;background:#05070a}.minimap-canvas{display:block;image-rendering:pixelated;border-radius:2px}.hud-idle{position:absolute;left:8px;bottom:calc(var(--bar-h) + 6px);display:none;align-items:baseline;gap:5px;padding:3px 9px;border-radius:4px;background:#141a21eb;border:1px solid var(--hp-warn);color:var(--hp-warn);cursor:pointer;font-size:12px;pointer-events:auto}.hud-idle.show{display:flex}.hud-idle:hover{background:#28220cf2}.hud-idle .n{font-family:var(--mono);font-size:15px;font-weight:700}.hud-idle .l{letter-spacing:.4px;text-transform:uppercase;font-size:10px}.hud-panel{position:relative;flex:1 1 auto;min-width:0;padding:8px 10px;border:1px solid var(--chrome-3);border-radius:4px;background:linear-gradient(180deg,var(--chrome-1),#0e1319);overflow:hidden}.sel-empty,.sel-one,.sel-many{display:none;height:100%}.sel-empty.show{display:block}.sel-cap{position:absolute;left:0;right:0;bottom:0;display:none;padding:2px 10px;background:#8c6012e6;border-top:1px solid var(--warn);color:#fff6e6;font-size:11px;font-weight:700;letter-spacing:.3px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sel-cap.show{display:block}.sel-hold{position:absolute;left:0;right:0;bottom:0;display:none;padding:2px 10px;background:#7a2a22eb;border-top:1px solid var(--red);color:#ffe9e4;font-size:11px;font-weight:700;letter-spacing:.3px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sel-hold.show{display:block}.sel-one.show,.sel-many.show{display:flex}.sel-empty{color:var(--ink-faint)}.sel-hint-line{font-size:13px;color:var(--ink-dim);margin-bottom:4px}.sel-hint-sub{font-size:12px}.sel-one{gap:12px;align-items:flex-start}.sel-portrait{flex:0 0 auto;width:62px;height:62px;display:flex;align-items:center;justify-content:center;border-radius:4px;border:2px solid var(--blue);background:linear-gradient(160deg,#1b3050,#14212f);color:var(--blue);font-family:var(--mono);font-weight:700;font-size:17px;letter-spacing:1px}.sel-portrait.enemy{border-color:var(--red);color:#ff9d8d;background:linear-gradient(160deg,#3a1a15,#24120f)}.sel-portrait.neutral{border-color:var(--ink-faint);color:var(--ink-dim);background:linear-gradient(160deg,#1e242b,#141a20)}.sel-info{flex:1 1 auto;min-width:0}.sel-name{font-size:15px;font-weight:700;letter-spacing:.3px;margin-bottom:5px}.sel-one.enemy .sel-name{color:#ff9d8d}.sel-hp{display:flex;align-items:center;gap:8px;margin-bottom:6px}.sel-hp .bar{position:relative;width:132px;height:9px;border-radius:2px;background:#10161c;border:1px solid #2b3540;overflow:hidden}.sel-hp .bar.hide{display:none}.sel-hp .fill{height:100%;width:100%;background:var(--hp-good);transition:width 90ms linear}.sel-hp .fill.warn{background:var(--hp-warn)}.sel-hp .fill.bad{background:var(--hp-bad)}.sel-hp .txt{font-family:var(--mono);font-size:12px;color:var(--ink-dim)}.sel-stats{display:flex;gap:14px;margin-bottom:5px}.sel-stats .stat{display:flex;gap:5px;align-items:baseline}.sel-stats .stat.hide{display:none}.sel-stats .k{font-size:10px;letter-spacing:.6px;color:var(--ink-faint)}.sel-stats .v{font-family:var(--mono);font-size:12px;color:var(--ink)}.sel-desc{font-size:11px;color:var(--ink-faint);max-width:44ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sel-queue{display:none;flex-direction:column;gap:3px;margin-left:auto;padding-left:12px}.sel-queue.show{display:flex}.q-slot{display:flex;align-items:center;gap:6px;width:118px;padding:2px 5px;border-radius:3px;border:1px solid var(--chrome-3);background:#121820;cursor:pointer}.q-slot.hide{display:none}.q-slot:hover{border-color:var(--red);background:#201317}.q-slot.research{border-left:3px solid var(--gas)}.q-code{font-family:var(--mono);font-size:10px;color:var(--ink-dim);width:30px}.q-bar{flex:1 1 auto;height:6px;border-radius:2px;background:#0c1116;overflow:hidden}.q-fill{height:100%;width:0;background:var(--blue)}.sel-many{flex-wrap:wrap;align-content:flex-start;gap:4px;overflow-y:auto}.sel-tile{width:46px;height:40px;display:flex;flex-direction:column;justify-content:space-between;align-items:center;padding:4px 3px 3px;border-radius:3px;border:1px solid var(--blue-deep);background:linear-gradient(160deg,#1a2a41,#131b25);cursor:pointer}.sel-tile:hover{border-color:var(--blue);background:linear-gradient(160deg,#22405f,#16202c)}.sel-tile.enemy{border-color:var(--red);background:linear-gradient(160deg,#3a1a15,#221310)}.sel-tile .code{font-family:var(--mono);font-size:10px;color:var(--ink);letter-spacing:.5px}.sel-tile .tbar{width:100%;height:4px;border-radius:1px;background:#0c1116;overflow:hidden}.sel-tile .tfill{height:100%;width:100%;background:var(--hp-good)}.sel-tile .tfill.warn{background:var(--hp-warn)}.sel-tile .tfill.bad{background:var(--hp-bad)}.hud-card{flex:0 0 auto;display:grid;grid-template-columns:repeat(4,66px);grid-template-rows:repeat(3,1fr);gap:4px;padding:6px;border:1px solid var(--chrome-3);border-radius:4px;background:linear-gradient(180deg,var(--chrome-1),#0e1319)}.cmd-slot{position:relative}.cmd-slot.empty .cmd-btn{visibility:hidden}.cmd-btn{position:relative;width:100%;height:100%;min-height:34px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;padding:3px 2px 2px;border-radius:3px;border:1px solid var(--chrome-3);background:linear-gradient(180deg,#26313d,#18202a);color:var(--ink);cursor:pointer;text-align:center;overflow:hidden}.cmd-btn:hover{border-color:var(--blue);background:linear-gradient(180deg,#31465e,#1c2634)}.cmd-btn:active{background:linear-gradient(180deg,#16202a,#16202a)}.cmd-btn.menu{border-color:#4a5a2f}.cmd-btn.ability{border-color:#5a4a2f}.cmd-btn.disabled{border-color:#232c35;background:#12171d;color:var(--ink-faint);cursor:not-allowed}.cmd-btn.disabled:hover{border-color:#3a2b2b;background:#16191d}.cmd-key{position:absolute;top:1px;left:3px;font-family:var(--mono);font-size:9px;font-weight:700;color:var(--hp-warn);letter-spacing:.3px}.cmd-btn.disabled .cmd-key{color:#5c5340}.cmd-name{font-size:10px;font-weight:600;line-height:1.1;letter-spacing:.1px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 2px}.cmd-cost{display:flex;gap:5px;font-family:var(--mono);font-size:9px}.cmd-cost.hide{display:none}.cmd-cost .m{color:var(--minerals)}.cmd-cost .g{color:var(--gas)}.cmd-cost .g.hide{display:none}.cmd-btn.disabled .cmd-cost .m,.cmd-btn.disabled .cmd-cost .g{color:#55606b}.hud-tip{position:absolute;right:8px;bottom:calc(var(--bar-h) + 6px);display:none;width:280px;padding:8px 10px;border-radius:4px;border:1px solid var(--edge);background:#0b0e12f5;box-shadow:0 6px 20px #0009;pointer-events:none}.hud-tip.show{display:block}.tip-name{font-size:13px;font-weight:700;margin-bottom:3px}.tip-cost{font-family:var(--mono);font-size:11px;color:var(--minerals);margin-bottom:4px}.tip-desc{font-size:11px;color:var(--ink-dim);line-height:1.35}.tip-why{margin-top:5px;font-size:11px;font-weight:700;color:var(--warn)}.hud-tip:not(.bad) .tip-why{display:none}@media(max-height:720px){.hud-card{grid-template-columns:repeat(4,58px)}.sel-portrait{width:52px;height:52px;font-size:15px}.sel-desc{display:none}}