html,body,#root,.app{width:100%;height:100dvh;margin:0}body{color:#e8eef7;background:#070b12;font-family:Inter,system-ui,sans-serif}button{appearance:none;color:#f8fafc;font:inherit;cursor:pointer;background:#3d8bfd;border:0;border-radius:8px;padding:10px 14px}button:disabled{opacity:.45;cursor:not-allowed}button.ghost{color:#e2e8f0;background:0 0;border:1px solid #334155}.app{width:100%;height:100dvh;position:relative}.game-map{z-index:0;background:radial-gradient(#123a5c 0%,#071422 68%,#050b14 100%);place-items:center;width:100vw;height:100dvh;display:grid;position:fixed;inset:0}.board-svg{touch-action:none;cursor:grab;width:100%;height:100%}.board-svg:active{cursor:grabbing}.board-hex{cursor:pointer}.board-svg polygon{cursor:pointer;stroke-linejoin:round}.board-svg text{fill:#f8fafc;paint-order:stroke;stroke:#0b1220;stroke-width:3px;pointer-events:none;-webkit-user-select:none;user-select:none;font-size:15px;font-weight:700}.hud{z-index:2;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#080c14d1;border:1px solid #1e293b;border-radius:12px;flex-wrap:wrap;align-items:center;gap:10px;padding:10px 12px;display:flex;position:absolute;top:12px;left:12px;right:320px}.hud-brand,.hud-turn,.hud-scores{flex-direction:column;gap:2px;display:flex}.hud-brand span,.hud-turn span:last-child,.hint{color:#94a3b8;font-size:13px}.hud-turn{border-left:3px solid #3d8bfd;padding:4px 10px}.hud-player{font-weight:650}.hud-scores{flex-direction:row;gap:14px;font-weight:650}.hud-actions{align-items:center;gap:8px;margin-left:auto;display:flex}.panel{z-index:2;background:#080c14e0;border:1px solid #1e293b;border-radius:12px;width:280px;padding:14px;position:absolute;top:12px;right:12px}.panel h2{margin:0 0 10px;font-size:16px}.panel-actions{gap:8px;margin-top:12px;display:grid}.panel-actions>button{width:100%}.troop-list-wrap{margin-top:12px}.troop-list-head{color:#94a3b8;justify-content:space-between;align-items:center;gap:8px;margin-bottom:6px;font-size:13px;display:flex}.troop-list-head button{padding:4px 8px;font-size:12px}.troop-list{gap:4px;max-height:180px;margin:0;padding:0;list-style:none;display:grid;overflow:auto}.troop-list label{align-items:center;gap:8px;font-size:13px;display:flex}.troop-list label.spent{color:#64748b}.troop-list em{color:#94a3b8;margin-left:auto;font-size:11px;font-style:normal}.troop-control{gap:8px;display:grid}.troop-control span{color:#94a3b8;font-size:13px}.troop-stepper{align-items:center;gap:6px;display:flex}.troop-stepper strong{text-align:center;min-width:1.5rem}.troop-stepper button{padding:6px 10px}.panel dl{gap:8px;margin:0;display:grid}.panel dl div{justify-content:space-between;gap:12px;display:flex}dt{color:#94a3b8}dd{margin:0}.mono{font-family:ui-monospace,SFMono-Regular,monospace;font-size:12px}.combat{color:#cbd5e1;border-top:1px solid #1e293b;margin-top:12px;padding-top:12px;font-size:13px}.menu{z-index:3;background:#04080e8c;place-items:center;display:grid;position:absolute;inset:0}.menu-card{background:#0f172a;border:1px solid #1e293b;border-radius:16px;gap:12px;width:min(420px,100% - 32px);padding:24px;display:grid}.menu-card h1{margin:0;font-size:28px}.brand-domain{color:#64748b;letter-spacing:.04em;margin:-6px 0 0;font-size:13px}.menu-card p{color:#94a3b8;margin:0;line-height:1.45}.join-field{color:#94a3b8;gap:6px;font-size:13px;display:grid}.join-field input{appearance:none;color:#f8fafc;font:inherit;background:#0b1220;border:1px solid #334155;border-radius:8px;padding:10px 12px}