:root{--panel-bg: rgba(18, 26, 36, .86);--panel-border: rgba(255, 255, 255, .09);--text: #e7eef6;--muted: #9fb0c0;--accent: #5fd3a3;--danger: #e06464;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;user-select:none}input,textarea{-webkit-user-select:text;-moz-user-select:text;user-select:text}html,body,#root{margin:0;height:100%;width:100%;overflow:hidden;background:#0f171f;color:var(--text)}.game-root{position:fixed;top:0;right:0;bottom:0;left:0;overflow:hidden}.canvas-host{position:absolute;top:0;right:0;bottom:0;left:0}.hud{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.hud>*{pointer-events:auto}.panel{background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:12px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 6px 24px #00000059;color:var(--text)}button{font:inherit;color:var(--text);background:#ffffff0f;border:1px solid var(--panel-border);border-radius:8px;padding:7px 11px;cursor:pointer;transition:background .12s ease,border-color .12s ease}button:hover{background:#ffffff24}.resource-bar{position:absolute;top:14px;left:14px;display:flex;gap:18px;padding:9px 16px}.resource{display:flex;align-items:center;gap:7px;font-variant-numeric:tabular-nums}.resource .glyph{font-size:18px}.resource .glyph-img{width:26px;height:26px;object-fit:contain;filter:drop-shadow(0 1px 1px rgba(0,0,0,.4))}.resource .amount{font-weight:700;min-width:26px}.resource .amount.low{color:#e9c46a}.resource .amount.crit{color:#e06464}.resource .trend{font-size:9px;margin-left:2px;vertical-align:middle}.controls{position:absolute;top:14px;right:14px;display:flex;align-items:center;gap:8px;padding:8px 10px}.controls .stat{color:var(--muted);font-size:13px;font-variant-numeric:tabular-nums;padding:0 4px}.clock{position:absolute;top:14px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:10px;padding:8px 16px}.clock-icon{font-size:16px}.clock-time{font-weight:700;font-variant-numeric:tabular-nums;font-size:15px}.clock-date{color:var(--muted);font-size:12px}.clock-date small{opacity:.65}.build-area{position:absolute;bottom:16px;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:6px;max-width:96vw}.cat-tabs{display:flex;gap:4px;padding:4px}.cat-tab{padding:5px 13px;font-size:12px;background:transparent;border:1px solid transparent}.cat-tab.active{background:#5fd3a329;border-color:var(--accent)}.cat-tab.clear-tab{margin-left:6px;border-left:1px solid var(--panel-border)}.cat-tab.clear-tab.active{background:#e9c46a2e;border-color:#e9c46a;color:#f0d68a}.build-bar{display:flex;gap:8px;padding:10px;max-width:96vw;overflow-x:auto}.build-detail{position:absolute;bottom:16px;left:14px;width:300px;padding:12px 14px}.bd-head{display:flex;justify-content:space-between;align-items:center;gap:10px}.bd-head b{font-size:14px}.bd-cost{color:#e9c46a;font-size:12px;white-space:nowrap}.bd-desc{margin:6px 0;font-size:12px;color:var(--muted)}.bd-line{font-size:12px;margin-bottom:7px}.bd-reqs{margin:0;padding-left:0;list-style:none;display:flex;flex-direction:column;gap:3px}.bd-reqs li{font-size:11.5px;color:#cdd6e0}.build-btn{display:flex;flex-direction:column;align-items:center;gap:4px;flex:0 0 auto;width:88px;padding:9px 6px;background:#ffffff0a}.build-btn.locked{opacity:.45;cursor:default}.build-btn.locked .b-cost{color:var(--muted)}.build-btn .swatch{width:30px;height:30px;border-radius:7px;border:1px solid rgba(0,0,0,.35);box-shadow:inset 0 -4px 6px #0000004d}.build-btn .swatch-img{width:54px;height:42px;object-fit:contain;filter:drop-shadow(0 2px 2px rgba(0,0,0,.4))}.build-btn .b-name{font-size:12px;font-weight:600;line-height:1.1;text-align:center}.build-btn .b-cost{font-size:11px;color:var(--muted)}.build-btn.active{border-color:var(--accent);background:#5fd3a329}.build-btn.poor .b-cost{color:var(--danger)}.selection-panel{position:absolute;bottom:16px;left:14px;width:280px;padding:14px 16px;max-height:calc(100vh - 230px);overflow-y:auto}.selection-panel.collapsed{width:auto;padding:0;overflow:visible}.sp-reopen{padding:9px 13px;font-weight:600}.sp-head-btns{display:flex;gap:4px}.sp-head{display:flex;align-items:center;justify-content:space-between}.sp-head h3{margin:0;font-size:16px}.sp-close{padding:2px 8px;font-size:13px}.sp-desc{color:var(--muted);font-size:13px;line-height:1.4;margin:8px 0 12px}.sp-desc.muted{opacity:.8}.sp-row{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:13px;padding:3px 0}.sp-row span{color:var(--muted)}.progress{margin:12px 0 6px;height:8px;border-radius:5px;background:#ffffff14;overflow:hidden}.progress-fill{height:100%;background:var(--accent);transition:width .12s linear}.progress-fill.idle{background:var(--danger)}.sp-status{font-size:12px;font-weight:600}.sp-status.ok{color:var(--accent)}.sp-status.bad{color:var(--danger)}.sp-grow{margin-top:8px;padding-top:8px;border-top:1px solid rgba(255,255,255,.08);font-size:12px}.sp-grow-head{color:var(--muted)}.sp-services{display:flex;flex-direction:column;gap:3px;margin-top:5px}.svc{font-size:12px}.svc.ok{color:var(--accent)}.svc.miss{color:var(--danger)}.sp-grow-note{color:var(--muted);display:block;margin-top:4px}.danger{margin-top:14px;width:100%;border-color:#e0646480;background:#e064641f}.danger:hover{background:#e064643d}.resource.sep{border-left:1px solid rgba(255,255,255,.12);padding-left:16px}.resource .amount small{color:var(--muted);font-weight:600}.sp-row b.warn{color:var(--danger)}.trade{margin-top:4px}.trade-head{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:var(--muted);margin-bottom:8px}.trade-coins{color:#e9c46a;font-weight:700}.trade-rows{display:flex;flex-direction:column;gap:6px}.trade-row{display:grid;grid-template-columns:24px 30px 1fr 1fr;align-items:center;gap:6px}.t-icon{width:22px;height:22px;object-fit:contain}.t-have{font-variant-numeric:tabular-nums;font-weight:700;font-size:13px}.t-sell,.t-buy{padding:5px 4px;font-size:12px}.t-sell{color:#9ee6b4}.t-buy{color:#f0c987}.t-sell:disabled,.t-buy:disabled{opacity:.4;cursor:default}.trade-foot{margin-top:8px;font-size:11px;color:var(--muted)}.upgrades{margin-top:12px;border-top:1px solid rgba(255,255,255,.08);padding-top:10px;display:flex;flex-direction:column;gap:6px}.up-head{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}.up-owned{font-size:12px;color:var(--accent)}.up-opt{display:flex;justify-content:space-between;align-items:center;gap:8px;text-align:left;padding:7px 9px}.up-name{font-size:12px;font-weight:600}.up-cost{font-size:11px;color:var(--muted);white-space:nowrap}.up-opt:disabled{opacity:.45;cursor:default}.strategic{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at 50% 38%,#1a2a38,#0d141b);display:flex;flex-direction:column;pointer-events:auto}.strat-head{display:flex;align-items:center;gap:14px;margin:12px;padding:10px 14px}.strat-title{font-weight:700}.strat-coins{margin-left:auto;color:#e9c46a;font-weight:700}.strat-back{padding:6px 12px}.strat-body{flex:1;display:flex;gap:12px;padding:0 12px 12px;min-height:0}.strat-map{flex:1;height:100%;background:#0000002e;border-radius:12px}.strat-route{stroke:#5fd3a3;stroke-width:4;stroke-dasharray:8 6;opacity:.8}.strat-node{cursor:pointer}.strat-node circle{stroke:#0006;stroke-width:3}.strat-node.player circle{stroke:#5fd3a3}.strat-node.site circle{stroke:#e9c46a;stroke-dasharray:6 5}.strat-node.npc circle{stroke:#6fa8dc}.strat-node.selected circle{stroke-width:5}.strat-node.active circle{stroke:#fff}.node-icon{font-size:30px}.node-label{font-size:15px;fill:#e7eef6;font-weight:600;paint-order:stroke;stroke:#0d141b;stroke-width:3px}.strat-panel{width:300px;padding:16px;overflow-y:auto}.node-detail h3{margin:0 0 10px}.tech-btn.enter,.buy-city{width:100%;margin-top:12px;padding:9px}.buy-city{border-color:#e9c46a80;background:#e9c46a24;color:#f0d68a;font-weight:600}.buy-city:disabled{opacity:.45;cursor:default}.npc-trade{margin-top:10px;display:flex;flex-direction:column;gap:6px}.npc-trade .trade-row{grid-template-columns:24px 1fr 1fr}.t-glyph{font-size:18px}.qty-row{display:flex;align-items:center;gap:6px;margin:12px 0 4px;font-size:12px;color:var(--muted)}.qty-btn{padding:3px 9px;font-size:12px}.qty-btn.active{background:#5fd3a329;border-color:var(--accent)}.qty-input{width:58px;background:#ffffff0f;color:var(--text);border:1px solid var(--panel-border);border-radius:8px;padding:3px 6px;font:inherit;font-size:12px}.trade-warn{margin:10px 0 2px;padding:7px 10px;font-size:12px;border-radius:8px;background:#e9c46a24;color:#f0d68a}.npc-deals{margin-top:12px;border-top:1px solid rgba(255,255,255,.08);padding-top:10px}.nd-head{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin-bottom:6px}.nd-row{display:flex;justify-content:space-between;align-items:center;font-size:12px;padding:3px 0}.nd-cancel{padding:1px 7px;font-size:12px;color:var(--danger)}.nd-create{display:flex;gap:4px;margin-top:8px}.nd-create select{flex:1;min-width:0;background:#ffffff0f;color:var(--text);border:1px solid var(--panel-border);border-radius:8px;padding:5px;font:inherit;font-size:11px}.nd-create button{padding:5px 7px;font-size:11px}.stats-win{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at 50% 38%,#1a2430,#0d141b);display:flex;flex-direction:column;pointer-events:auto}.stats-tabs{display:flex;gap:4px;margin:0 12px;padding:6px}.stats-tab{padding:7px 16px;font-size:13px;background:transparent;border:1px solid transparent}.stats-tab.active{background:#5fd3a329;border-color:var(--accent)}.stats-body{flex:1;margin:12px;padding:16px 22px;overflow-y:auto}.stats-table{width:100%;border-collapse:collapse;font-size:13px}.stats-table th{text-align:left;color:var(--muted);font-weight:600;font-size:11px;text-transform:uppercase;letter-spacing:.04em;padding:6px 10px;border-bottom:1px solid rgba(255,255,255,.08)}.stats-table td{padding:7px 10px;border-bottom:1px solid rgba(255,255,255,.04)}.rs-glyph{font-size:18px}.rs-num{text-align:right;font-variant-numeric:tabular-nums}.stats-table .pos{color:#7fe0a5}.stats-table .neg{color:#e88a8a}.stats-pop h4,.stats-trade h4{margin:16px 0 8px;font-size:13px;color:var(--muted)}.stats-pop small,.stats-trade small{color:var(--muted)}.stats-routes .route-add{margin-top:12px;flex-wrap:wrap}.skilltree{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at 50% 40%,#1a2230,#0d121a);display:flex;flex-direction:column;pointer-events:auto}.skill-sp{margin-left:auto;color:#ffd966;font-weight:700}.skill-body{flex:1;display:flex;gap:12px;padding:0 12px 12px;min-height:0}.skill-canvas{flex:1;height:100%;background:#0000002e;border-radius:12px;cursor:grab}.skill-canvas:active{cursor:grabbing}.skill-edge{stroke:#ffffff24;stroke-width:3}.skill-edge.on{stroke:#5fd3a3}.skill-node{cursor:pointer}.skill-node circle{stroke-width:3}.skill-node.locked circle{fill:#2a3340;stroke:#3a4453}.skill-node.available circle{fill:#3e4a36;stroke:#e9c46a}.skill-node.unlocked circle{fill:#2e5b46;stroke:#5fd3a3}.skill-node.selected circle{stroke-width:5}.skill-icon{font-size:18px;fill:#e7eef6;font-weight:700}.skill-label{font-size:13px;fill:#e7eef6;font-weight:600;paint-order:stroke;stroke:#0d121a;stroke-width:3px}.skill-panel{width:280px;padding:16px}.region-tabs{position:absolute;top:62px;left:50%;transform:translate(-50%);display:flex;gap:6px;padding:6px}.region-tab{display:flex;flex-direction:column;align-items:center;gap:1px;padding:6px 12px;font-size:13px}.region-tab small{color:var(--muted);font-size:11px}.region-tab.active{border-color:var(--accent);background:#5fd3a329}.region-tab.claim{border-style:dashed}.region-tab.claim.poor small{color:var(--danger)}.left-stack{position:absolute;top:62px;left:14px;width:240px;display:flex;flex-direction:column;gap:8px}.research{width:100%;padding:0}.research-head{width:100%;display:flex;align-items:center;gap:8px;background:transparent;border:none;padding:10px 12px;font-size:13px}.research-pts{margin-left:auto;color:#9ee6b4;font-weight:700;font-size:12px}.research-head .routes-caret{margin-left:4px}.research-body{padding:0 12px 12px;display:flex;flex-direction:column;gap:8px}.tech-row{display:flex;justify-content:space-between;align-items:center;gap:8px}.tech-info{display:flex;flex-direction:column}.tech-name{font-size:12px;font-weight:600}.tech-desc{font-size:11px;color:var(--muted)}.tech-row.done .tech-name{color:var(--accent)}.tech-btn{padding:4px 9px;font-size:12px;white-space:nowrap}.tech-btn:disabled{opacity:.45;cursor:default}.tech-tag{font-size:11px;color:var(--muted)}.routes{width:100%;padding:0}.routes-head{width:100%;display:flex;align-items:center;gap:8px;background:transparent;border:none;padding:10px 12px;font-size:13px}.routes-count{background:#ffffff1a;border-radius:8px;padding:0 7px;font-size:11px}.routes-caret{margin-left:auto;color:var(--muted)}.routes-body{padding:0 12px 12px;display:flex;flex-direction:column;gap:6px}.routes-empty{color:var(--muted);font-size:12px}.route-row{display:flex;justify-content:space-between;align-items:center;gap:6px;font-size:12px}.route-del{padding:2px 7px}.route-add{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}.route-add select{font:inherit;font-size:11px;background:#ffffff0f;color:var(--text);border:1px solid var(--panel-border);border-radius:6px;padding:4px}.route-add-btn{padding:4px 10px;font-size:12px}.hint{position:absolute;bottom:18px;left:16px;max-width:280px;padding:9px 12px;font-size:12px;color:var(--muted);line-height:1.45}.intro-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:#060a0e8c;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center;z-index:50;pointer-events:auto}.intro-card{max-width:470px;padding:24px 26px}.intro-card h2{margin:0 0 8px}.intro-lead{color:var(--muted);margin:0 0 14px;font-size:14px}.intro-list{margin:0 0 18px;padding-left:18px;display:flex;flex-direction:column;gap:9px}.intro-list li{font-size:13px;line-height:1.45}.intro-list b{color:var(--accent)}.intro-go{width:100%;padding:11px;font-weight:600;background:#5fd3a329;border-color:var(--accent)}.speed-ctrl{display:flex;gap:2px}.speed-ctrl button{padding:6px 8px;min-width:30px}.speed-ctrl button.active{background:#5fd3a333;border-color:var(--accent)}.menu-card{width:360px;padding:20px 22px}.menu-head{display:flex;justify-content:space-between;align-items:center}.menu-head h2{margin:0}.menu-card h4{margin:16px 0 8px;font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}.save-row{display:flex;justify-content:space-between;align-items:center;padding:5px 0;font-size:13px}.save-row small{color:var(--muted);margin-left:4px}.save-btns{display:flex;gap:4px}.save-btns button{padding:4px 10px;font-size:12px}.menu-card .danger{margin-top:14px}.minimap{position:absolute;bottom:16px;right:14px;padding:5px;line-height:0}.minimap canvas{display:block;width:150px;height:150px;border-radius:6px;cursor:pointer;image-rendering:pixelated}.build-search{margin-left:6px;width:116px;background:#ffffff0f;border:1px solid var(--panel-border);border-radius:8px;color:var(--text);padding:4px 10px;font:inherit;font-size:12px}.touch-actions{position:absolute;bottom:188px;right:18px;display:flex;flex-direction:column;gap:9px;z-index:6}.touch-actions button{width:48px;height:48px;font-size:20px;border-radius:50%;background:#121a24eb;border:1px solid var(--panel-border)}.hamburger{position:absolute;top:14px;right:14px;width:46px;height:46px;font-size:22px;padding:0;z-index:20}.mobile-drawer-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;z-index:19}.mobile-drawer{position:absolute;top:68px;right:14px;width:232px;display:flex;flex-direction:column;gap:6px;padding:12px;z-index:20}.mobile-drawer button{text-align:left;padding:11px 13px;font-size:14px}.md-clock{font-weight:700;font-size:14px;padding:2px 4px 8px;border-bottom:1px solid var(--panel-border)}.md-speed{display:flex;align-items:center;justify-content:space-between;font-size:13px;color:var(--muted);padding:2px 4px 4px}.md-speed .speed-ctrl button{min-height:34px}.mobile-build-btn{position:absolute;bottom:16px;left:50%;transform:translate(-50%);padding:12px 30px;font-size:15px;font-weight:600;background:#5fd3a333;border-color:var(--accent);z-index:6}.build-area.sheet{position:absolute;bottom:0;left:0;right:0;width:100vw;max-width:100vw;transform:none;align-items:stretch;gap:8px;padding:8px 8px 16px;background:#0d141bf7;border-top:1px solid var(--panel-border);max-height:62vh;overflow-y:auto;z-index:25}.build-area.sheet .cat-tabs{overflow-x:auto;justify-content:flex-start}.build-area.sheet .build-bar{flex-wrap:wrap;justify-content:center;max-width:100%;overflow:visible}.sheet-close{align-self:flex-end;padding:6px 14px}@media (max-width: 860px){.resource-bar{gap:9px;padding:6px 9px;max-width:calc(100vw - 78px);overflow-x:auto;font-size:12px}.resource .glyph-img{width:20px;height:20px}.controls{gap:5px;padding:6px 8px;flex-wrap:wrap;max-width:58vw;justify-content:flex-end}.clock{padding:6px 10px;gap:6px}.clock-date{display:none}.left-stack{width:188px}.selection-panel{width:calc(100vw - 28px);max-width:320px;max-height:45vh}.build-detail{width:calc(100vw - 28px);max-width:320px}.build-btn{width:72px;padding:7px 5px}.minimap canvas{width:104px;height:104px}.touch-actions{bottom:150px}.build-search{width:92px}}@media (pointer: coarse){button,.cat-tab,.speed-ctrl button,.build-search{min-height:40px}}.mode-flag{position:absolute;bottom:96px;left:50%;transform:translate(-50%);padding:6px 14px;font-size:13px;color:var(--accent)}.toast{position:absolute;top:70px;left:50%;transform:translate(-50%);padding:9px 18px;border-radius:10px;background:#121a24f2;border:1px solid var(--panel-border);font-size:13px;animation:toast-in .18s ease}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,-6px)}to{opacity:1;transform:translate(-50%)}}