:root{--ui-text: #eef4ff;--ui-muted: rgba(226, 235, 255, .72);--ui-panel: rgba(21, 31, 48, .9);--ui-panel-strong: rgba(15, 24, 39, .94);--ui-border: rgba(177, 196, 228, .2);--ui-shadow: 0 18px 36px rgba(0, 0, 0, .3);--bar-bg: #1e2940;--bar-fill: linear-gradient(90deg, #2275c7 0%, #2f93e2 100%);--bar-commit: linear-gradient(90deg, #79c9ff 0%, #c8ecff 100%);color:var(--ui-text);background:#11151c;font-family:Trebuchet MS,Segoe UI,sans-serif}*{box-sizing:border-box;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}html,body,#app{margin:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none}body{background:radial-gradient(circle at top,rgba(199,170,103,.15),transparent 35%),linear-gradient(180deg,#141b24,#0c1016);-webkit-text-size-adjust:100%}.game-shell{position:relative;width:100%;height:100%}.action-menu{position:absolute;z-index:20;width:164px;height:164px;transform:translate(-50%,-50%);pointer-events:auto}.action-menu[hidden]{display:none}.action-menu-center,.action-menu-button{position:absolute;border:0;color:#f7f2e8;font:inherit;cursor:pointer;box-shadow:0 12px 24px #00000047}.action-menu-center{left:50%;top:50%;width:54px;height:54px;border-radius:50%;transform:translate(-50%,-50%);background:#626a78eb;font-size:28px;line-height:1}.action-menu-button{width:62px;height:62px;border-radius:16px;font-size:28px;display:flex;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.action-menu-button:disabled{opacity:.4;cursor:default}.action-menu button[data-hovered=true]{outline:3px solid rgba(255,255,255,.55);filter:brightness(1.12)}.action-menu-top{left:50%;top:6px;transform:translate(-50%);background:#606f7ce6}.action-menu-left{left:6px;top:50%;transform:translateY(-50%);background:#c54343eb}.action-menu-right{right:6px;top:50%;transform:translateY(-50%);background:#818da0eb}.action-menu-bottom{left:50%;bottom:6px;transform:translate(-50%);background:#3dab5feb}.top-hud{position:absolute;top:12px;left:12px;right:12px;z-index:10;display:flex;align-items:center;gap:8px;justify-content:center;flex-wrap:wrap;pointer-events:none}.status-cluster{position:relative;display:flex;align-items:center;gap:8px;pointer-events:auto}.room-button{border:1px solid rgba(255,255,255,.14);border-radius:999px;padding:10px 14px;background:#080c12d6;color:var(--ui-text);font:inherit;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;white-space:nowrap}.room-button[data-active=true],.room-button[data-mode=host]{border-color:#7eacff7a}.room-button[data-mode=live]{border-color:#48d27673}.room-menu{position:absolute;top:calc(100% + 10px);right:0;width:320px;padding:14px;border:1px solid var(--ui-border);border-radius:18px;background:#080c12f0;box-shadow:0 18px 40px #00000057;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);display:flex;flex-direction:column;gap:10px}.room-menu[hidden]{display:none}.room-menu-title,.room-list-label{font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--ui-muted)}.room-menu-status{font-size:13px;line-height:1.45;color:var(--ui-text)}.room-menu-actions{display:flex;flex-wrap:wrap;gap:8px}.room-menu-config{display:flex;flex-direction:column;gap:10px;padding:10px 0 2px;border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08)}.room-menu-slider-row{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:10px}.room-menu-slider-label{font-size:12px;font-weight:700;color:var(--ui-text);white-space:nowrap}.room-menu-button,.room-row-button{border:1px solid rgba(255,255,255,.14);border-radius:10px;padding:8px 10px;background:#ffffff0f;color:var(--ui-text);font:inherit;font-size:12px;font-weight:700;cursor:pointer}.room-menu-button{flex:1}.room-menu-button-primary{border-color:#7eacff80}.room-menu-button:disabled,.room-row-button:disabled,.speed-button:disabled,.building-button:disabled{opacity:.48;cursor:not-allowed}.room-list{display:flex;flex-direction:column;gap:8px}.room-list-empty{display:flex;flex-direction:column;gap:10px;padding:12px;border:1px dashed rgba(255,255,255,.12);border-radius:12px;font-size:12px;color:var(--ui-muted)}.room-list-empty .room-menu-button{align-self:flex-start;min-width:120px}.room-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border:1px solid rgba(255,255,255,.1);border-radius:12px;background:#ffffff0a}.room-row-meta{min-width:0;display:flex;flex-direction:column;gap:2px}.room-row-name{font-size:13px;font-weight:700;color:var(--ui-text)}.room-row-detail{font-size:11px;color:var(--ui-muted)}.diplomacy-inbox{position:static;z-index:11;width:100%;display:flex;align-items:center;gap:8px;min-height:38px;margin-top:2px;margin-bottom:2px;padding:8px 10px;border:1px solid var(--ui-border);border-radius:12px;background:var(--ui-panel);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:var(--ui-shadow)}.diplomacy-inbox[hidden]{display:none}.battle-orders-panel{width:100%;display:flex;flex-direction:column;gap:4px;margin-top:2px;margin-bottom:2px}.battle-orders-panel[hidden]{display:none}.battle-order-row{display:flex;align-items:center;gap:8px;padding:7px 10px;border:1px solid rgba(255,80,80,.35);border-radius:12px;background:#ff3c3c12;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:var(--ui-shadow)}.battle-order-label{font-size:13px;font-weight:700;color:var(--ui-text);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.diplomacy-message{font-size:13px;font-weight:700;color:var(--ui-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1}.diplomacy-button{border:1px solid rgba(255,255,255,.14);border-radius:9px;padding:6px 10px;background:#ffffff14;color:var(--ui-text);font:inherit;font-size:12px;font-weight:700;cursor:pointer}.diplomacy-accept{border-color:#48d27666}.diplomacy-deny{border-color:#eb696966}.resource-chip{min-width:104px;padding:7px 10px;border:1px solid var(--ui-border);border-radius:12px;background:var(--ui-panel);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:var(--ui-shadow);display:flex;flex-direction:column;gap:2px}.resource-chip[data-tone=growth]{border-color:#ff9b3d8c}.resource-chip[data-tone=money]{border-color:#ffd44e73}.resource-chip[data-tone=army]{border-color:#6aafff73}.resource-chip[data-tone=tech]{border-color:#91d6d466}.resource-label{font-size:9px;text-transform:uppercase;letter-spacing:.12em;color:var(--ui-muted)}.resource-value{font-size:15px;font-weight:800;line-height:1}.command-panel{position:absolute;left:50%;bottom:14px;z-index:10;width:min(480px,calc(100vw - 22px));transform:translate(-50%);padding:7px 9px 9px;border:1px solid var(--ui-border);border-radius:14px;background:var(--ui-panel-strong);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:var(--ui-shadow)}.population-panel{display:flex;flex-direction:column;gap:6px}.population-meta{display:flex;justify-content:space-between;gap:12px}.compact-stat{display:flex;align-items:baseline;gap:8px}.compact-stat-label{font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--ui-muted)}.compact-stat-value{font-size:12px;font-weight:700}.population-bar{position:relative;height:34px;overflow:hidden;border:1px solid rgba(183,203,235,.2);border-radius:10px;background:var(--bar-bg)}.population-fill,.committed-fill{position:absolute;top:0;bottom:0}.population-fill{left:0;background:var(--bar-fill)}.committed-fill{background:var(--bar-commit)}.population-bar-text{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:0 10px;font-size:13px;font-weight:800;text-align:center;text-shadow:0 2px 10px rgba(0,0,0,.55)}.command-slider-row{margin-top:7px;display:grid;grid-template-columns:118px minmax(0,1fr);gap:7px;align-items:center}.building-row{margin-top:7px;display:flex;align-items:center;justify-content:space-between;gap:10px}.building-label{font-size:10px;text-transform:uppercase;letter-spacing:.12em;color:var(--ui-muted)}.building-buttons{display:flex;gap:6px}.building-button{width:52px;height:48px;border:1px solid rgba(255,255,255,.14);border-radius:11px;background:#ffffff0f;color:#f4efe2;font:inherit;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px}.building-button[data-active=true]{background:#d6ab533d;border-color:#ecc362b3;color:#fff5df}.building-button[data-disabled=true]{opacity:.58}.building-button-icon{font-size:20px;line-height:1}.building-button-cost{font-size:10px;line-height:1;color:var(--ui-muted)}.growth-commit-box{height:31px;padding:0 9px;border:1px solid rgba(183,203,235,.2);border-radius:10px;background:#243047e6;display:flex;align-items:center;justify-content:space-between;font-weight:800}.growth-commit-percent{font-size:13px}.growth-commit-value{font-size:10px;color:var(--ui-muted)}.growth-slider{width:100%;margin:0;accent-color:#5f96ff;cursor:pointer}.command-footer{margin-top:7px;display:flex;align-items:center;gap:6px;overflow-x:auto;scrollbar-width:none}.command-footer::-webkit-scrollbar{display:none}.speed-label{font-size:10px;text-transform:uppercase;letter-spacing:.12em;color:var(--ui-muted)}.speed-buttons{display:flex;gap:6px}.speed-button{border:1px solid rgba(255,255,255,.14);background:#ffffff0f;color:#f4efe2;border-radius:9px;padding:3px 7px;font:inherit;font-size:10px;cursor:pointer;flex-shrink:0;white-space:nowrap}.speed-button[data-active=true]{background:#5f96ff38;border-color:#7eacffb3;color:#f6fbff}.footer-divider{width:1px;align-self:stretch;background:#ffffff1f;margin:0 2px;flex-shrink:0}.speed-button.brutal-btn[data-active=true]{background:#dc3c3c47;border-color:#ff6464bf;color:#ffe0e0}.status-pill{padding:10px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.12);background:#080c12bf;font-size:12px;letter-spacing:.08em;text-transform:uppercase}canvas{display:block;width:100%;height:100%;touch-action:none}@media(max-width:720px){.top-hud{left:8px;right:8px;top:8px;gap:6px}.resource-chip{min-width:88px;flex:1 1 112px}.status-cluster{gap:6px}.room-button,.status-pill{padding:9px 12px;font-size:11px}.room-menu{width:min(320px,calc(100vw - 16px))}.room-menu-slider-row{grid-template-columns:1fr}.command-panel{width:calc(100vw - 16px);bottom:8px;padding:8px}.command-slider-row{grid-template-columns:1fr}.building-row{flex-direction:column;align-items:stretch}.building-buttons{justify-content:space-between}.population-bar{height:36px}.population-bar-text{font-size:13px}}.game-over-overlay{position:absolute;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;background:#000000a6;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);animation:fadeIn .6s ease-out}.game-over-overlay[hidden]{display:none}.game-over-box{display:flex;flex-direction:column;align-items:center;gap:16px;padding:40px 56px;border:1px solid var(--ui-border);border-radius:20px;background:var(--ui-panel-strong);box-shadow:0 24px 64px #00000080;text-align:center}.game-over-title{font-size:42px;font-weight:900;letter-spacing:.15em;text-transform:uppercase}.game-over-overlay[data-result=victory] .game-over-title{color:#ffd84e;text-shadow:0 0 28px rgba(255,210,60,.4)}.game-over-overlay[data-result=defeat] .game-over-title{color:#ff6b6b;text-shadow:0 0 28px rgba(255,80,80,.35)}.game-over-sub{font-size:15px;color:var(--ui-muted);max-width:280px}.game-over-restart{margin-top:8px;padding:12px 36px;border:1px solid rgba(255,255,255,.18);border-radius:12px;background:#ffffff14;color:var(--ui-text);font:inherit;font-size:15px;font-weight:700;cursor:pointer;transition:background .15s,border-color .15s}.game-over-restart:hover{background:#ffffff29;border-color:#ffffff59}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}