/* v1.7 — world-first composition. One scene plane, one HUD plane, one dialog plane. */
:root{--hud-bg:rgba(8,17,27,.91);--hud-line:rgba(154,187,205,.22);--muted:#9cb1c3;--hud-radius:4px;--accent:#7bc5e6;color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden}body{background:#040a12;color:#e5eff4;font-size:13px}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.4}button:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.hidden{display:none!important}svg{flex:none}button svg{width:20px;height:20px}p{line-height:1.6}h1,h2,h3{font-weight:600}.sub,.mini{color:var(--muted)}
#scene-root{position:fixed;inset:0;z-index:0;overflow:hidden;touch-action:none;background:#060d18}#scene-root:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(#040b14b0 0,transparent 25%,transparent 80%,#03091266),radial-gradient(ellipse,transparent 40%,#02091477 100%)}
.shell{position:fixed;inset:0;max-width:none;margin:0;padding:0;z-index:2;pointer-events:none}.layout{display:contents}.panel{border-radius:var(--hud-radius);border:1px solid var(--hud-line);background:var(--hud-bg);box-shadow:0 15px 60px #0005;backdrop-filter:blur(18px)}
.top{position:absolute;inset:0 0 auto;height:86px;margin:0;padding:18px 25px;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(#070e18f5,#0b1722e8);border:0;border-bottom:1px solid var(--hud-line);pointer-events:auto}.brand{font-size:12px;letter-spacing:.17em;line-height:1.6;width:190px;text-shadow:none}.brand small{font-size:7px;letter-spacing:.22em;color:#7993a9;max-width:180px}.topright{font-size:10px}.topright .pill{padding:6px 8px;border:1px solid var(--hud-line);border-radius:3px;background:transparent;color:var(--accent)}.topright .pill:last-child{display:none}
.resources{position:absolute;left:240px;right:160px;top:12px;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:0;margin:0;height:60px;pointer-events:auto}.resource{position:relative;padding:7px 10px 4px 37px;min-width:0;border:0;border-right:1px solid #7795ae1f;background:none;box-shadow:none;border-radius:0;display:block}.resource>span{font-size:9px;letter-spacing:.03em;color:#97b0c4;white-space:nowrap}.resource strong{display:block;font-size:15px;font-weight:600;letter-spacing:0;font-variant-numeric:tabular-nums;line-height:1.4}.resource em{display:block;font-size:9px;line-height:1.2;font-style:normal;color:#9bc5b5}.res-icon{position:absolute;left:8px;top:20px;width:23px;height:26px;filter:drop-shadow(0 0 7px #8de0f633);color:#bcdbe6}.res-icon svg{width:24px;height:26px}.resource:nth-child(3) .res-icon{color:#e4ce82}.resource:nth-child(4) .res-icon{color:#a6d392}.resource:nth-child(5) .res-icon{color:#d9a66c}.resource:nth-child(6) .res-icon{color:#ac9ee2}.resource:nth-child(7) .res-icon{color:#d9bc8a}
.nav{position:absolute;left:20px;top:50%;transform:translateY(-43%);width:82px;display:flex;flex-direction:column;gap:3px;padding:5px;background:rgba(7,17,27,.75);border:1px solid var(--hud-line);border-left:2px solid #6ba3bb66;pointer-events:auto;box-shadow:0 14px 40px #0005}.nav h4{display:none}.nav button{min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;font-size:9px;letter-spacing:.04em;height:72px;width:100%;padding:9px 0;text-align:center;border:1px solid transparent;border-radius:2px;background:transparent;color:#93aebf;transition:color .15s,background .15s}.nav button svg{width:25px;height:25px}.nav button.active,.nav button:hover{background:linear-gradient(90deg,#7399b52b,#6185970a);border:1px solid #8ad4e33d;box-shadow:none;color:#e9f6ff}.nav button.active{border-left:2px solid var(--accent)}
.main{position:absolute;inset:112px 125px 90px 132px;padding:28px;overflow:auto;overscroll-behavior:contain;pointer-events:auto;background:rgba(7,17,28,.92);border:1px solid var(--hud-line);border-top:2px solid var(--accent);border-radius:4px;max-width:1300px;margin:0 auto;box-shadow:0 20px 90px #0009;scrollbar-width:thin;scrollbar-color:#63839266 transparent}
html[data-screen="planet"] .main,html[data-screen="map"] .main{inset:0;max-width:none;margin:0;padding:0;overflow:visible;background:none;border:0;border-radius:0;box-shadow:none;backdrop-filter:none;pointer-events:none}
.scene-heading{position:absolute;top:116px;left:146px;max-width:calc(100vw - 550px);pointer-events:auto;display:block;text-shadow:0 2px 12px #000}.screen-kicker{display:block;font-size:9px;letter-spacing:.22em;color:#b2c3d0;margin-bottom:7px}.scene-heading .heading{display:block;margin:0}.scene-heading h1,.heading h1{font-size:27px;line-height:1.1;letter-spacing:.01em;margin:3px 0 7px;font-weight:500}.scene-heading .sub{font-size:11px;color:#bcc9d4}.scene-heading .toolbar{margin-top:10px}.scene-heading .toolbar label{font-size:10px}.scene-heading select{padding:5px 9px;max-width:210px}.scene-heading .toolbar>span.mini{display:none}.scene-heading .tag{display:none}.scene-heading .btn{padding:6px 10px;font-size:10px;border-color:#66859544;background:#071422b0;color:#b2c8d8}.system-sector-tabs,.sector-tabs{margin-top:11px;gap:5px;display:flex;flex-wrap:wrap}.scene-heading .btn:not(.alt){color:#ecf8ff;border-color:#8dc4d388}
.context-panel{position:absolute;right:22px;top:170px;bottom:92px;width:328px;max-height:720px;overflow:auto;pointer-events:auto;border:1px solid var(--hud-line);border-top:2px solid var(--accent);border-radius:3px;background:linear-gradient(135deg,#10212bf0,#07131eef);backdrop-filter:blur(18px);box-shadow:0 20px 70px #0008;scrollbar-width:thin;scrollbar-color:#6a91a766 transparent;animation:none}.context-cap{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:9px;text-transform:uppercase;letter-spacing:.18em;color:#8daabc;padding:12px 17px;border-bottom:1px solid var(--hud-line)}.context-cap .icon-button{width:25px;height:25px;border:0;background:none;padding:3px}.context-cap svg{width:17px;height:17px}.build-focus{display:block;padding:18px;margin:0;border:0;background:none;box-shadow:none}.build-focus>div{margin:0 0 18px}.build-focus h2{font-size:21px;line-height:1.3;margin:8px 0}.build-focus p{font-size:12px;line-height:1.65;margin:10px 0}.build-focus strong{font-size:12px;color:var(--accent);font-weight:500}.build-focus .focus-effect{font-size:12px;line-height:1.65;border-top:1px solid var(--hud-line);padding-top:16px}.focus-effect>div{margin-bottom:12px}.build-focus .focus-cost{padding:12px;background:#43576817;border:1px solid #718faa33;color:#bfd2de;font-size:11px}.build-focus .focus-actions{display:flex;flex-direction:column;gap:7px;text-align:left;margin-bottom:0}.build-focus .focus-actions .btn{margin:0;max-width:none}.build-focus .focus-actions small{font-size:10px}.focus-status{font-size:9px!important;color:var(--accent)!important}
.context-panel .map-detail{background:none;border:0;margin:0;padding:18px;box-shadow:none;border-radius:0}.context-panel h2{font-size:20px;font-weight:500}.context-panel p{font-size:12px;line-height:1.65}.pve-title{display:block}.pve-tag{display:block;font-size:8px;margin-top:9px;line-height:1.6;letter-spacing:.13em}.pve-detail .reward{font-size:11px;padding:10px;background:#65715013;border:1px solid #88966a44;border-radius:2px;color:#ced8b7}.expedition-form{display:grid;grid-template-columns:1fr 1fr;gap:12px}.expedition-form label{font-size:10px}.expedition-form input{width:100%;font-size:12px}.map-detail select{width:100%;margin:8px 0 13px}.map-detail .row{display:flex;flex-direction:column;align-items:stretch}.map-detail .btn{width:100%}.pve-detail [data-pirate-count]{width:100%;margin:8px 0}.pve-detail [data-pve-preview]{margin-top:7px;width:100%}
.aside{position:absolute;right:22px;top:170px;bottom:92px;width:328px;max-height:720px;padding:0 17px 17px;margin:0;overflow:auto;pointer-events:auto;display:none;border-top:2px solid var(--accent);scrollbar-width:thin}.aside>.context-cap{margin:0 -17px 14px}.aside h2{font-size:11px;letter-spacing:.09em}.aside .hint{font-size:12px;background:#435b6e14;border:1px solid var(--hud-line);padding:12px;border-radius:3px}.aside .section{margin-top:16px;padding-top:12px}.aside .report{max-height:none;font-size:11px;border-radius:0;background:transparent;padding:9px 0 9px 9px}.aside .queue{border:0;border-left:2px solid #78aac455;background:#3c617014;border-radius:0;padding:10px}.queue b{font-size:11px;font-weight:500}.queue span{font:13px ui-monospace,monospace;color:#d3e6ee}.queue .statbar{height:3px;border-radius:0}.queue .statbar i{border-radius:0;background:var(--accent)}html[data-command-state="open"] .aside{display:block;animation:none}.neighbors{font-size:11px;border-top:1px solid var(--hud-line);padding-top:14px}.neighbors .btn{font-size:10px;padding:7px}
#hud-controls{pointer-events:none}.command-toggle{position:absolute;right:22px;top:112px;display:flex;align-items:center;gap:12px;height:38px;padding:0 12px;background:#0b1926df;border:1px solid var(--hud-line);border-radius:3px;color:#c6d9e7;font-size:10px;letter-spacing:.04em;pointer-events:auto;backdrop-filter:blur(12px)}.command-toggle svg{width:17px;height:17px}.command-toggle b{background:#53829329;border:1px solid #76a7b733;color:var(--accent);padding:2px 5px;font-size:10px}.scene-tools{position:absolute;bottom:23px;right:22px;display:flex;gap:7px;align-items:center;pointer-events:auto}.icon-button,.tool-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:34px;height:34px;padding:7px;background:#0b1928e8;border:1px solid var(--hud-line);border-radius:3px;color:#bdd4e0}.icon-button:hover,.tool-button:hover,.command-toggle:hover{border-color:var(--accent);color:#fff;background:#183044}.icon-button[aria-pressed="false"]{opacity:.5}.tool-button{width:auto;padding:7px 11px;font-size:10px}.camera-controls{display:flex;align-items:center;gap:0;background:#0b1928e8;border:1px solid var(--hud-line);border-radius:3px}.camera-controls .icon-button{background:none;border:0}.camera-controls span{font:10px ui-monospace,monospace;color:#8da7bc;min-width:36px;text-align:center}.hud-restore{position:absolute;left:22px;bottom:25px;background:none;border:0;color:#a9c0d0;padding:6px 0;font-size:9px;letter-spacing:.04em;pointer-events:auto}.scene-footer{position:absolute;left:148px;bottom:26px;display:flex;gap:11px;align-items:center;font-size:10px;color:#b5c6d5;letter-spacing:.02em}.scene-footer>span:not(.status-light){color:#526e83}.scene-footer small{margin-left:22px;color:#6c879d;font-size:9px}.status-light{width:4px;height:4px;border-radius:50%;background:#a4ccb2;box-shadow:0 0 8px #a4ccb2}.flight-strip{position:absolute;bottom:90px;left:148px;width:280px;pointer-events:auto}.movement-row{border-left:1px solid var(--accent);background:#071320ba;font-size:10px;padding:7px 10px;backdrop-filter:blur(9px);margin-top:5px}.movement-row b{font:11px ui-monospace,monospace}.infra-disclosure{position:absolute;left:145px;bottom:90px;width:390px;max-height:60vh;overflow:auto;margin:0;background:var(--hud-bg);backdrop-filter:blur(18px);pointer-events:auto;border:1px solid var(--hud-line);box-shadow:0 15px 55px #0008}.infra-grid{grid-template-columns:1fr 1fr;gap:5px}.infra-item{padding:10px;font-size:10px;background:#19334444;border-radius:2px}.infra-disclosure summary{font-size:11px}.map-touch-hint{display:none!important}
#hud-toast{position:absolute;bottom:88px;left:50%;transform:translateX(-50%);max-width:510px;padding:12px 19px;border:1px solid var(--hud-line);border-left:2px solid var(--accent);background:#091622f5;box-shadow:0 8px 40px #0007;color:#d7e9f4;opacity:0;transition:opacity .2s;pointer-events:none;font-size:12px;z-index:8}#hud-toast.visible{opacity:1}
/* World layers are fixed to the viewport, never framed by a card. */
.colony-world,.system-scene,#scene-root .mapbox{position:absolute;inset:0;width:100%;height:100%;min-height:0;max-height:none;margin:0;border:0;border-radius:0;overflow:hidden;box-shadow:none;background:#07111c;isolation:isolate}.colony-world:before{inset:0;background:url('assets/colony_terrain_v1_7.webp') center/cover;opacity:1;filter:var(--terrain-filter,none);z-index:0}.colony-world:after{inset:0;background:linear-gradient(180deg,#0b18330a 20%,transparent 50%,#0510204d),radial-gradient(ellipse at 60% 50%,transparent 30%,#04122066);z-index:1}.world-map,.system-scene>svg,#scene-root .mapbox>svg{position:absolute;inset:0;width:100%;height:100%;min-height:0;max-width:none;z-index:2;transform-origin:50% 55%;will-change:transform}.world-map{overflow:visible}.world-hud,.world-legend,.world-swipe,.system-coordinate{display:none!important}.world-activity{z-index:2}.colony-roads{opacity:.5}.world-map .main-road{stroke:#162431;stroke-width:17;stroke-opacity:.7}.world-map .road-light{stroke:#accee0;stroke-width:1;stroke-opacity:.3;stroke-dasharray:4 15}.world-map .site-pad{fill:#253344;fill-opacity:.24;stroke:#adc6cd;stroke-opacity:.13;stroke-width:1}.world-map .site-edge{opacity:.18;stroke-width:1}.world-map .site-shadow{fill:#060e19c9;filter:blur(8px)}.site .site-caption rect{fill:#081522a8;stroke:#7eafc022;rx:2}.site .site-name{font-size:11px;font-weight:500}.site .site-level{font-size:9px}.site:hover,.site:focus-visible,.site.selected,.site:has(.site-hit:focus-visible){filter:drop-shadow(0 0 9px #9ed7e966)}.site.selected .site-pad,.site:hover .site-pad{fill:#425f68;fill-opacity:.18;stroke:var(--lit);stroke-opacity:.8}.site .building-sprite{filter:drop-shadow(8px 14px 7px #02080bb0)}.site .hologram{opacity:.25;filter:sepia(.4) hue-rotate(135deg);stroke:var(--lit)}.site.unbuilt:hover .hologram,.site.unbuilt.selected .hologram{opacity:.55}.site.unbuilt .site-caption{opacity:.65}.site .structure .power-pulse{r:2;opacity:.6;animation:pulse-light 4s ease-in-out infinite}.service-vehicle{filter:drop-shadow(0 0 3px #b8e4ff);opacity:.65}.world-activity .activity-dot{opacity:.15;animation:drift 35s ease-in-out infinite}
.colony-world.race-Imperium{--terrain-filter:saturate(.85)}.colony-world.race-Synthetics{--terrain-filter:hue-rotate(14deg) saturate(.6) brightness(1.05)}.colony-world.race-Swarms{--terrain-filter:hue-rotate(287deg) saturate(.65)}.colony-world.race-Archons{--terrain-filter:hue-rotate(28deg) saturate(.9)}.colony-world.race-Nomads{--terrain-filter:sepia(.35) saturate(.85)}.colony-world.race-Parasites{--terrain-filter:hue-rotate(55deg) saturate(.75)}
.system-scene,#scene-root .mapbox{background:radial-gradient(ellipse at 58% 55%,#0d203400,#050c18aa 80%),url('assets/star_map.webp') 50% 53%/220% auto}.system-scene:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 62% 43%,#31567f20,transparent 45%);pointer-events:none}.system-object text{font-size:15px;font-weight:500;stroke:#040b18;stroke-width:4px;fill:#d8e6f0}.system-object .object-caption{font-size:9px;letter-spacing:.1em;fill:#8ca6bb}.object-ring{stroke:#7294af;opacity:.15;stroke-width:1;stroke-dasharray:2 7}.system-object.selected .object-ring,.system-object:hover .object-ring,.system-object:has(.object-hit:focus-visible) .object-ring{stroke:#a3d7e9;stroke-width:1;stroke-dasharray:9 5;opacity:.85}.planet-sprite{pointer-events:none;filter:drop-shadow(0 0 9px #82c8e528)}.object-hit{outline:none}.orbital-lines ellipse{fill:none;stroke:#92a8bd;stroke-width:.6;opacity:.22}.asteroid-belt{pointer-events:none}.system-star text{fill:#cebd99;font-size:10px;letter-spacing:.28em}.solar-glow{animation:solar-breath 14s ease-in-out infinite;transform-origin:760px 510px}.engine-plume{filter:blur(2px);opacity:.65;animation:pulse-light 3s ease-in-out infinite}.flight-path{animation:route-flow 20s linear infinite}.deep-stars{pointer-events:none}.command-backdrop{position:absolute;inset:0;background:linear-gradient(#030d1bbe,#040e1cd9),url('assets/colony_terrain_v1_7.webp') center/cover;filter:blur(3px)}
html[data-labels-state="off"] .site-caption,html[data-labels-state="off"] .system-object text{opacity:0}html[data-labels-state="off"] .site:hover .site-caption,html[data-labels-state="off"] .site.selected .site-caption,html[data-labels-state="off"] .system-object:hover text,html[data-labels-state="off"] .system-object.selected text{opacity:1}html[data-hud="hidden"] .top,html[data-hud="hidden"] .resources,html[data-hud="hidden"] .nav,html[data-hud="hidden"] .main,html[data-hud="hidden"] .aside,html[data-hud="hidden"] .command-toggle,html[data-hud="hidden"] .scene-tools,html[data-hud="hidden"] .scene-footer,html[data-hud="hidden"] .site-caption,html[data-hud="hidden"] .system-object text{visibility:hidden;pointer-events:none}
/* Management screens share the same HUD materials. */
.btn{border:1px solid #769eaf80;border-radius:3px;background:linear-gradient(135deg,#2b5367,#193445);color:#dceaf2;padding:9px 13px;font-size:12px;box-shadow:inset 0 1px #ffffff0d}.btn.alt{background:#1b303d55;border-color:#728d9e44;color:#bed2e1}.btn:hover{background:#315c72}.card{border:1px solid #8096aa22;border-radius:3px;background:#34485513;box-shadow:none;padding:17px}.card:hover{border-color:#8096aa55}.card h2,.card h3{font-weight:500}.card p{font-size:12px}.card .meta{font-size:11px;line-height:1.7}.tag{font-size:9px;padding:5px 7px;letter-spacing:.06em;background:#2a4d5a22;border-color:#688a9f55}.grid{gap:14px}input,select{background:#07131dd9!important;border:1px solid #708b9b66!important;border-radius:3px!important;color:#d9e8f3!important;padding:8px!important}.card-head .unit-open{width:100px;height:122px;border:1px solid #6c8f9d66;border-radius:3px;background:#07131c}.heading{margin-bottom:24px}.heading>.tag{align-self:flex-start}.start{z-index:50;overflow:auto;background:linear-gradient(#030c17ad,#030c17db),url('assets/colony_terrain_v1_7.webp') center/cover}.start-inner{border:1px solid var(--hud-line);border-top:2px solid #89b7c9;border-radius:3px;background:#081621e8;backdrop-filter:blur(24px);max-height:94vh;overflow:auto}.race-card{min-height:150px}.info-dialog{z-index:60;backdrop-filter:blur(12px);background:#040b16b5}.info-panel{max-height:85dvh;border-radius:3px}.dossier-panel{max-width:760px}.info-close{position:sticky;top:0;z-index:2}.dossier-stats div{border-radius:2px;background:#35566522}.dossier-section{background:#29434f1c}.dossier-panel>h2{font-size:22px}
@keyframes panel-arrive{from{opacity:0;transform:translateX(8px)}to{opacity:1;transform:none}}@keyframes solar-breath{50%{opacity:.75;transform:scale(1.04)}}@keyframes pulse-light{50%{opacity:.35}}@keyframes route-flow{to{stroke-dashoffset:-130}}
@media(min-width:1900px){.context-panel,.aside{width:360px;right:35px;top:190px}.command-toggle{right:35px}.scene-heading{top:130px;left:170px}.scene-heading h1{font-size:34px}.nav{left:30px;width:90px}.nav button{height:80px}.scene-footer{left:170px}.colony-world:before{background-size:cover}}
@media(max-width:1200px){.brand{font-size:10px;width:150px}.resources{left:180px;right:24px}.topright{display:none}.resource{padding-left:29px}.res-icon{left:3px;width:19px}.res-icon svg{width:19px}.resource strong{font-size:13px}.resource>span{font-size:8px}.scene-heading{left:117px;max-width:calc(100vw - 460px)}.scene-heading h1{font-size:22px}.nav{left:13px;width:72px}.context-panel,.aside{width:300px;right:16px;top:174px}.command-toggle{right:16px}.scene-footer{left:115px}.scene-footer small{display:none}.scene-tools{right:16px}.main{inset:105px 35px 80px 108px;padding:22px}.flight-strip{left:115px}.infra-disclosure{left:115px}}
@media(max-width:760px){.top{height:57px;padding:10px 15px}.brand{font-size:10px;width:auto}.brand small{font-size:6px}.resources{left:0;right:0;top:57px;height:58px;display:flex;overflow-x:auto;scrollbar-width:none;background:#071420e8;border-bottom:1px solid var(--hud-line);padding:0 8px}.resource{min-width:99px;padding:7px 7px 4px 29px}.resource strong{font-size:13px}.resource em{font-size:8px}.resource>span{font-size:8px}.res-icon{top:18px;left:3px}.topright{display:flex}.topright .pill{font-size:8px}.nav{left:50%;top:auto;bottom:10px;transform:translateX(-50%);width:calc(100% - 20px);max-width:520px;flex-direction:row;gap:2px;margin:0;padding:4px;border:1px solid var(--hud-line);z-index:12;background:#071421f5}.nav button{min-width:0;height:48px;gap:3px;padding:4px;font-size:8px;flex:1}.nav button svg{width:19px;height:19px}.nav button.active{border-left:1px solid #8ad4e344;border-bottom:2px solid var(--accent)}.scene-heading{left:18px;top:132px;max-width:calc(100vw - 36px)}.scene-heading h1{font-size:22px;margin:3px 0 5px}.scene-heading .sub{font-size:10px;max-width:260px}.screen-kicker{font-size:8px;letter-spacing:.16em}.planet-head .toolbar{margin-top:8px}.scene-heading .toolbar .mini{font-size:9px}.scene-heading select{max-width:180px;font-size:10px}.scene-heading .system-sector-tabs,.scene-heading .sector-tabs{max-width:calc(100vw - 35px);overflow-x:auto;flex-wrap:nowrap;margin-top:10px}.scene-heading .system-sector-tabs .btn,.scene-heading .sector-tabs .btn{flex-shrink:0;font-size:9px;padding:6px 8px}.command-toggle{right:13px;top:15px;height:28px;padding:4px 7px;border:0;background:transparent}.command-toggle span{display:none}.command-toggle svg{width:17px}.command-toggle b{font-size:9px}.topright{display:none}.scene-footer{display:none}.scene-tools{right:12px;bottom:76px;gap:4px;z-index:11}.scene-tools .icon-button{width:29px;height:29px;padding:6px}.tool-button{height:29px;font-size:9px;padding:5px 7px}.tool-button svg{width:15px}.camera-controls span{font-size:9px;min-width:31px}.hud-restore{left:16px;bottom:82px;font-size:8px;z-index:15}.context-panel,.aside{left:10px;right:10px;top:auto;bottom:118px;width:auto;max-height:53dvh;z-index:9;background:#07131cf5;backdrop-filter:blur(22px);border-top:2px solid var(--accent)}.context-cap{padding:9px 14px}.build-focus{padding:14px}.build-focus>div{margin-bottom:12px}.build-focus h2{font-size:18px}.context-panel .map-detail{padding:14px}.context-panel .map-detail h2{font-size:18px}.context-panel .pve-detail p{font-size:11px}.context-panel .focus-actions{flex-direction:row;flex-wrap:wrap}.context-panel .focus-actions .btn{width:auto;flex:1}.context-panel .focus-actions small{width:100%}.aside{padding:0 15px 15px}.aside>.context-cap{margin:0 -15px 10px}.main{inset:130px 10px 118px;padding:16px}.main .heading h1{font-size:22px}.heading{display:block;margin-bottom:15px}.heading>.tag{margin-top:8px;display:inline-block}.grid,.pair{grid-template-columns:1fr}.colony-world:before{background-size:auto 100%;background-position:48% center}.world-map,.system-scene>svg,#scene-root .mapbox>svg{width:1050px;height:calc(100% - 120px);left:calc(50% - 525px);top:110px}.system-scene{background-size:auto 170%;background-position:50% 50%}.world-map{width:1180px;left:calc(50% - 590px);height:calc(100% - 135px);top:100px}.infra-disclosure{left:10px;right:10px;width:auto;bottom:118px;max-height:52dvh}.flight-strip{left:18px;bottom:120px;width:245px;max-height:88px;overflow:auto}.movement-row{font-size:9px;padding:5px 8px}#hud-toast{bottom:120px;max-width:calc(100vw - 25px);min-width:240px;font-size:11px;z-index:20}.info-dialog{padding:10px}.info-panel{max-height:88dvh;padding:18px}.dossier-head{gap:12px}.dossier-portrait{width:110px;height:145px}.dossier-head h3{font-size:18px}.dossier-panel>h2{font-size:20px}.dossier-stats{grid-template-columns:repeat(2,1fr)}.start-inner{padding:18px}.start h1{font-size:25px}.race-grid{grid-template-columns:1fr 1fr;gap:7px}.race-card{padding:10px;min-height:123px}.race-card b{font-size:12px}.race-card span{font-size:11px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.civilian-traffic{display:none}.scene-objects{will-change:auto}}

.context-panel>.context-cap,.aside>.context-cap{position:sticky;top:0;z-index:3;background:#0b1a26f5;backdrop-filter:blur(12px)}

.construction-countdown{font-size:11px;width:100%;padding:10px 0;color:#a7c2d5}.construction-countdown b{display:block;font:18px ui-monospace,monospace;margin:5px 0;color:#dbeef9}.construction-countdown .statbar{height:3px;border-radius:0;background:#34526155}.construction-countdown i{background:var(--accent)}

.debt-alert{position:absolute;left:146px;top:250px;width:390px;background:#251b1ddd;border:1px solid #ac81736b;pointer-events:auto;padding:12px;font-size:11px}@media(max-width:760px){.debt-alert{left:18px;top:250px;width:calc(100% - 36px)}}

.scene-intro{animation:scene-intro .55s ease-out}@keyframes scene-intro{from{opacity:.3;filter:blur(2px);transform:scale(1.025)}to{opacity:1;filter:none;transform:none}}@media(prefers-reduced-motion:reduce){.scene-intro{animation:none}}

.space-sprite{pointer-events:none;filter:drop-shadow(0 4px 9px #0008)}.raid-inactive{opacity:.35;filter:grayscale(1)}

/* Progression overlays retain the world scene beneath. */
.content-filter {position:sticky;top:0;z-index:3;background:#071321ee;padding:10px;gap:12px;border-bottom:1px solid #39536b;}
.content-filter input,.content-filter select {max-width:240px;}
.content-locked {border-color:#445163;opacity:.86;}
.main .card input[type=number] {width:100px;}
.main details.card>summary {cursor:pointer;padding:8px;color:#a9dcff;}
.site-name {font-size:9px;}
@media(max-width:700px){.content-filter {position:static}.content-filter label{width:100%}.content-filter input,.content-filter select{max-width:100%;width:100%}}

.colony-districts{position:absolute;left:140px;right:340px;bottom:94px;display:flex;gap:5px;flex-wrap:wrap;z-index:6;pointer-events:auto}.colony-districts button{padding:8px 10px;border:1px solid #69849b77;background:#091522ee;color:#b6c8d4;font:inherit;font-size:11px;cursor:pointer}.colony-districts button[aria-pressed=true]{border-color:var(--accent);color:#fff;background:#173246ee}.colony-districts small{margin-left:8px;opacity:.65}html[data-hud=hidden] .colony-districts{visibility:hidden}
@media(max-width:760px){.colony-districts{left:12px;right:12px;bottom:116px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin}.colony-districts button{flex-shrink:0;font-size:10px;padding:7px}.flight-strip{bottom:158px}}

.battle-unit-sprite.game-art{width:96px;height:96px;object-fit:contain}.research-unlock .unlock-unit-art.game-art{width:40px;height:40px;object-fit:contain}

.pve-garrison,.replay-roster{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end}.pve-garrison figure,.replay-roster figure{margin:0;flex:0 1 128px;text-align:center}.pve-garrison img,.replay-roster img{width:112px;height:112px;object-fit:contain}.pve-garrison small{display:block;color:var(--muted,#94acbd)}.replay-roster figcaption{font-size:12px;overflow-wrap:anywhere}

.building-panel-art{display:block;width:100%;height:180px;object-fit:contain;filter:drop-shadow(0 10px 15px #0008)}.infra-art{width:58px;height:58px;object-fit:contain;flex-shrink:0}

.research-atmosphere{background-image:linear-gradient(90deg,#030b16e8,#030b16c9),var(--research-art,none);background-position:center;background-size:cover}.research-detail-art{object-fit:cover;aspect-ratio:16/9}

.building-evolution{margin:12px 0 18px;border-top:1px solid var(--hud-line);padding-top:10px;font-size:11px;color:#b9d2df}.building-evolution summary{cursor:pointer;line-height:1.5;color:var(--accent)}.building-evolution summary:focus-visible{outline:2px solid var(--accent);outline-offset:4px}.building-evolution figure{margin:8px 0}.building-evolution figcaption{font-size:10px;text-align:center;color:#9bb5c7}.research-announcement:has(.research-completed){padding:10px;background:#071521ee;border:1px solid var(--hud-line);max-width:300px;max-height:160px;overflow:auto;pointer-events:auto}.research-announcement>small{font-size:8px;letter-spacing:.12em}.research-completed{display:flex;align-items:center;gap:9px;border:0;background:transparent;color:#d4e7ef;text-align:left;font-size:11px;font-family:inherit;width:100%;padding:6px;cursor:pointer}.research-completed img{width:42px;height:42px;object-fit:contain}.research-completed:hover,.research-completed:focus-visible{background:#6acbdd20;outline:1px solid var(--accent)}
/* Building complex refactor v1 */
.infra-item.is-complex{border-color:#8ec6d85c;background:linear-gradient(145deg,#1b3c4e78,#102533aa)}
.infra-item.is-complex b{display:block;font-size:10px;line-height:1.25;margin-top:5px;color:#e8f4f7}.infra-item.is-complex>span{display:block;margin-top:4px;color:#92aebb;font-size:8px}.complex-focus{max-width:760px}.complex-hero{display:grid;grid-template-columns:220px 1fr;gap:18px;align-items:center}.complex-hero>div>small{display:block;color:#91aebb;margin-top:7px}.complex-host-effect{margin-top:10px}.complex-modules{margin-top:16px;border-top:1px solid #7ba7bc32;padding-top:12px;display:grid;gap:8px}.complex-section-title{display:flex;align-items:center;justify-content:space-between;color:#adc5d1;font-size:9px;letter-spacing:.12em;text-transform:uppercase}.complex-section-title b{color:#e5c68e}.complex-module{display:grid;grid-template-columns:86px minmax(0,1fr);gap:10px;padding:9px;border:1px solid #62889c38;background:#0b1e2bd9}.complex-module.is-building{border-color:#e0c58a80}.complex-module-art{width:82px;height:82px}.complex-module-copy{min-width:0}.complex-module-head{display:flex;justify-content:space-between;gap:8px;align-items:start}.complex-module-head span{font-size:7px;letter-spacing:.1em;text-transform:uppercase;color:#7292a4}.complex-module-head h3{font-size:11px;margin:2px 0 0}.complex-module-head>b{font-size:9px;color:#e1c388;white-space:nowrap}.complex-module p{font-size:9px;line-height:1.35;margin:4px 0;color:#91a9b6}.complex-module-effect{font-size:9px;color:#b8d5c7;margin:5px 0}.complex-module small{font-size:8px;color:#7f9aa9;margin-right:7px}.complex-module-actions{display:flex;align-items:center;gap:6px;margin-top:7px;flex-wrap:wrap}.complex-module-actions>span{font-size:8px;color:#9cb3bf;flex:1;min-width:150px}.complex-module-actions .btn{padding:6px 8px;font-size:8px}.complex-module-reason{display:block!important;margin-top:5px!important;color:#c8a789!important}
@media(max-width:760px){.complex-focus{width:calc(100vw - 36px);max-width:none}.complex-hero{grid-template-columns:110px 1fr;gap:9px}.complex-hero .building-panel-art{width:108px;height:108px}.complex-module{grid-template-columns:62px minmax(0,1fr)}.complex-module-art{width:58px;height:58px}.complex-module-actions>span{min-width:100%;}.complex-module p{display:none}}
@media(min-width:1201px){.context-panel:has(.complex-focus){width:min(570px,44vw)}}
@media(min-width:761px) and (max-width:1200px){.context-panel:has(.complex-focus){width:min(480px,48vw)}}
.complex-title-row{display:flex;align-items:center;gap:10px}.complex-icon{width:48px!important;height:48px!important;flex:none;border-radius:9px}.complex-title-row h2{margin:3px 0!important}