:root{--bg:#14181f;--ink:#cfd6e4;--dim:#8a94a6;--line:#2b3340;--panel:#0a0d12b8;--accent:#ffd75a;--error:#ff8a80}*{box-sizing:border-box}html,body{background:var(--bg);min-height:100%;color:var(--ink);margin:0;font:14px/1.5 ui-monospace,monospace}#app{display:contents}a,code{color:var(--accent)}body.menu{place-content:center;min-height:100vh;padding:2rem 1rem;display:grid}.menu h1{letter-spacing:.5px;margin:0 0 .25rem;font-size:1.7rem}.menu .tagline{max-width:48ch;color:var(--dim);margin:0 0 1.75rem}.modes{grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px;max-width:560px;display:grid}.card{border:1px solid var(--line);color:inherit;background:#ffffff05;border-radius:8px;padding:16px 18px;text-decoration:none;display:block}.card:hover,.card:focus-visible{border-color:var(--accent);background:#ffd75a0f;outline:none}.card-title{color:#fff;margin-bottom:4px;font-size:1.15rem;display:block}.card-note{color:var(--dim);display:block}body.game{height:100vh;overflow:hidden}#game{position:fixed;inset:0}#game canvas{width:100%;height:100%;display:block}.bar{pointer-events:none;align-items:center;gap:8px;display:flex;position:fixed;top:12px;left:12px}.bar>button{pointer-events:auto}.palette{pointer-events:auto;align-items:center;gap:6px;display:flex}.palette button.active{border-color:var(--accent);color:#fff;background:#ffd75a24}.palette select{border:1px solid var(--line);background:var(--panel);color:var(--ink);font:inherit;cursor:pointer;border-radius:6px;padding:8px 10px}.palette select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.panel{border:1px solid var(--line);background:var(--panel);white-space:pre-wrap;pointer-events:none;border-radius:6px;padding:8px 10px;font-size:12px}.back{margin:0;font-size:12px;position:fixed;top:12px;right:12px}.back a{color:var(--dim);text-decoration:none}.back a:hover,.back a:focus-visible{color:var(--accent)}button.control{border:1px solid var(--line);background:var(--panel);color:var(--ink);font:inherit;cursor:pointer;border-radius:6px;padding:8px 12px}button.control:hover{border-color:var(--accent);color:#fff}button.control:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.boot-status{background:var(--bg);color:var(--dim);text-align:center;white-space:pre-wrap;place-content:center;padding:1rem;display:grid;position:fixed;inset:0}.boot-status.error{color:var(--error)}.unit-card{border:1px solid var(--line);background:var(--panel);pointer-events:none;border-radius:8px;width:220px;padding:12px 14px;position:fixed;bottom:12px;left:12px}.unit-card h2{color:#fff;margin:0;font-size:1rem}.unit-owner{color:var(--dim);margin:2px 0 8px;font-size:11px}.unit-life{color:var(--ink);margin:0 0 8px}.unit-card dl{gap:4px;margin:0;display:grid}.unit-card dl div{justify-content:space-between;gap:8px;display:flex}.unit-card dt{color:var(--dim)}.unit-card dd{color:var(--ink);margin:0}.game-over{z-index:10;background:#05070ac7;place-content:center;padding:1rem;display:grid;position:fixed;inset:0}.game-over-card{border:1px solid var(--line);background:var(--bg);text-align:center;border-radius:10px;width:min(360px,90vw);padding:24px}.game-over-kicker{color:var(--dim);letter-spacing:.08em;text-transform:uppercase;margin:0 0 4px;font-size:11px}.game-over-card h2{color:#fff;margin:0 0 8px;font-size:1.8rem}.game-over-card p{color:var(--ink);margin:0 0 4px}.game-over-tick{font-size:12px;color:var(--dim)!important}.game-over-back{border:1px solid var(--line);color:var(--accent);border-radius:6px;margin-top:16px;padding:8px 14px;text-decoration:none;display:inline-block}.game-over-back:hover,.game-over-back:focus-visible{border-color:var(--accent);background:#ffd75a14;outline:none}
