:root{
  color-scheme:dark;--bg:#080b0d;--panel:rgba(12,18,21,.92);--panel2:rgba(18,27,31,.94);--line:rgba(184,217,226,.18);--text:#eff7f8;--muted:#8ea3a7;--accent:#62e2a5;--accent2:#8af0c0;--danger:#ff665f;--warning:#ffc85a;--blue:#5eb7ff;--shadow:0 12px 40px rgba(0,0,0,.35)
}
*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden;background:var(--bg);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--text);touch-action:none;overscroll-behavior:none;-webkit-user-select:none;user-select:none}button,select,input{font:inherit}button{color:inherit}#gameCanvas{position:absolute;inset:0;width:100%;height:100%;display:block;outline:none;background:#15201a}.hud{position:absolute;background:linear-gradient(180deg,rgba(20,28,31,.94),rgba(9,14,16,.94));border:1px solid var(--line);box-shadow:var(--shadow);backdrop-filter:blur(12px);z-index:5}.top-hud{top:max(8px,env(safe-area-inset-top));left:max(8px,env(safe-area-inset-left));right:max(8px,env(safe-area-inset-right));height:54px;border-radius:14px;display:flex;align-items:center;padding:6px 8px;gap:10px}.brand{display:flex;gap:8px;align-items:center;font-size:12px;font-weight:900;letter-spacing:.11em;white-space:nowrap}.brand-mark{color:var(--accent)}.resource-bar{display:flex;gap:6px;flex:1;overflow:hidden}.resource-chip{min-width:76px;height:40px;border:1px solid var(--line);border-radius:9px;background:rgba(255,255,255,.03);display:flex;align-items:center;justify-content:center;gap:6px;font-variant-numeric:tabular-nums}.resource-chip small{color:var(--muted);font-size:10px}.res-mineral{color:#71c8ff}.res-energy{color:#ffd66f}.res-pop{color:#aee6d0}.top-actions{display:flex;gap:6px}.icon-btn{width:40px;height:40px;border:1px solid var(--line);background:rgba(255,255,255,.035);border-radius:10px;font-weight:800}.objective-panel{top:72px;left:max(8px,env(safe-area-inset-left));width:min(280px,36vw);padding:12px;border-radius:12px}.eyebrow{font-size:9px;color:var(--accent);letter-spacing:.16em;font-weight:900;margin-bottom:4px}.objective-panel strong{display:block;font-size:13px;line-height:1.25}.objective-progress{font-size:11px;color:var(--muted);margin-top:6px}.alert-text{color:var(--danger);font-weight:900;font-size:11px;margin-top:7px;min-height:13px}.minimap-wrap{top:72px;right:max(8px,env(safe-area-inset-right));width:min(220px,24vw);height:min(150px,18vw);min-height:92px;border-radius:12px;overflow:hidden}.minimap-wrap canvas{width:100%;height:100%;display:block}.selection-panel{left:max(8px,env(safe-area-inset-left));bottom:max(8px,env(safe-area-inset-bottom));width:min(330px,36vw);min-height:106px;border-radius:14px;padding:10px}.selection-summary{display:flex;gap:10px;align-items:center}.selection-summary strong{display:block;font-size:13px}.selection-summary small{display:block;color:var(--muted);font-size:10px;margin-top:3px}.portrait{width:54px;height:54px;border:1px solid var(--line);border-radius:10px;background:radial-gradient(circle at 50% 35%,#375449,#121a1d);display:grid;place-items:center;color:var(--accent);font-size:24px}.selection-stats{display:flex;gap:8px;margin-top:7px;font-size:10px;color:var(--muted)}.selection-stats span{padding:3px 6px;border:1px solid var(--line);border-radius:6px}.command-panel{right:max(8px,env(safe-area-inset-right));bottom:max(8px,env(safe-area-inset-bottom));width:min(430px,47vw);min-height:150px;border-radius:14px;padding:8px}.command-tabs{display:flex;gap:4px;margin-bottom:6px}.tab{flex:1;border:0;border-bottom:2px solid transparent;background:transparent;color:var(--muted);font-size:10px;padding:7px 4px;font-weight:800;text-transform:uppercase}.tab.active{color:var(--text);border-color:var(--accent)}.command-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.cmd{min-height:58px;border:1px solid var(--line);background:rgba(255,255,255,.035);border-radius:9px;padding:7px 5px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:2px;font-size:10px;font-weight:800;text-align:center}.cmd b{font-size:16px;color:var(--accent)}.cmd small{font-size:8px;color:var(--muted);font-weight:600}.cmd:disabled{opacity:.38;filter:saturate(.4)}.cmd.danger b{color:var(--danger)}.tutorial-hint{left:50%;transform:translateX(-50%);bottom:170px;max-width:56vw;border-radius:999px;padding:7px 10px 7px 14px;display:flex;gap:10px;align-items:center;font-size:10px;color:var(--muted)}.tutorial-hint button{border:0;background:transparent;color:var(--text);font-size:18px}.toast{position:absolute;z-index:20;left:50%;top:80px;transform:translate(-50%,-12px);opacity:0;pointer-events:none;background:rgba(6,10,12,.94);border:1px solid var(--line);padding:9px 14px;border-radius:999px;font-size:11px;transition:.18s ease}.toast.show{opacity:1;transform:translate(-50%,0)}.overlay{position:absolute;z-index:30;inset:0;background:rgba(3,6,7,.66);backdrop-filter:blur(10px);display:none;align-items:center;justify-content:center;padding:24px}.overlay.visible{display:flex}.modal{width:min(430px,92vw);padding:24px;border:1px solid var(--line);border-radius:20px;background:linear-gradient(160deg,#172227,#0b1013 70%);box-shadow:0 30px 90px rgba(0,0,0,.55);text-align:center}.modal h1{font-size:clamp(38px,8vw,76px);line-height:.8;margin:12px 0 18px;letter-spacing:-.05em}.modal h1 span{color:var(--accent)}.modal h2{font-size:34px;margin:8px 0 18px}.modal p{color:var(--muted);font-size:13px;line-height:1.55}.feature-row{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin:18px 0}.feature-row span{font-size:10px;border:1px solid var(--line);padding:7px 9px;border-radius:999px}.primary-btn,.secondary-btn{width:100%;padding:13px 16px;border-radius:10px;font-weight:900;letter-spacing:.06em;margin-top:8px}.primary-btn{border:1px solid #7df0bc;background:var(--accent);color:#06100b}.secondary-btn{border:1px solid var(--line);background:rgba(255,255,255,.035)}.modal small{display:block;margin-top:14px;color:var(--muted);font-size:10px}.hidden{display:none!important}.settings-modal{text-align:left}.settings-modal h2{text-align:center}.settings-modal label{display:flex;flex-direction:column;gap:7px;font-size:12px;color:var(--muted);padding:10px 0;border-bottom:1px solid var(--line)}.settings-modal select,.settings-modal input[type=range]{width:100%}.settings-modal select{background:#11191c;color:var(--text);border:1px solid var(--line);border-radius:8px;padding:8px}.switch-row{flex-direction:row!important;justify-content:space-between;align-items:center}@media(max-width:760px){.brand span:last-child{display:none}.top-hud{height:48px}.resource-chip{height:34px;min-width:60px;font-size:11px}.resource-chip small{display:none}.objective-panel{top:62px;width:43vw;padding:8px}.objective-panel strong{font-size:11px}.minimap-wrap{top:62px;width:27vw;height:18vw}.selection-panel{bottom:max(6px,env(safe-area-inset-bottom));width:36vw;min-height:94px;padding:7px}.portrait{width:42px;height:42px}.selection-summary strong{font-size:11px}.command-panel{bottom:max(6px,env(safe-area-inset-bottom));width:61vw;min-height:126px;padding:5px}.command-grid{gap:4px}.cmd{min-height:46px;font-size:9px;padding:4px}.cmd b{font-size:13px}.command-tabs{margin-bottom:3px}.tab{padding:4px 2px;font-size:8px}.tutorial-hint{display:none}.selection-stats{display:none}}@media(max-width:520px){.resource-bar{gap:3px}.resource-chip{min-width:52px}.objective-panel{width:50vw}.minimap-wrap{width:30vw}.selection-panel{width:34vw}.selection-summary small{display:none}.portrait{display:none}.command-panel{width:63vw}.cmd small{display:none}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}