:root{color-scheme:dark;--ink:#d8e5f4;--muted:#8fa5bd;--mint:#70f5d0}*{box-sizing:border-box}body{margin:0;background:#060f1c;color:var(--ink);font:15px/1.6 system-ui,sans-serif}header{height:76px;border-bottom:1px solid #203147;display:flex;justify-content:space-between;align-items:center;padding:0 4vw}a{color:var(--mint);text-decoration:none}.brand{font-size:23px;font-weight:800;color:white}.brand span{color:var(--mint)}nav{display:flex;gap:24px}main{max-width:1700px;margin:auto;padding:32px 4vw}.eyebrow{color:var(--mint);font-size:11px;font-weight:750;letter-spacing:2px}h1{font-size:clamp(28px,3vw,46px);line-height:1.15;margin:10px 0}h2{font-size:27px;line-height:1.2}p{color:var(--muted)}.intro{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:22px}.stats{display:flex;gap:22px}.stat{min-width:75px}.stat strong{display:block;font-size:29px;color:white}.stat small{color:var(--muted)}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:20px}.map{border:1px solid #23364d;border-radius:18px;background:radial-gradient(ellipse at 50% 30%,#102641,#081421 70%);overflow:hidden}.tools{display:flex;flex-wrap:wrap;gap:7px;padding:15px;border-bottom:1px solid #203147}button,input{font:inherit;color:var(--ink);background:#102137;border:1px solid #30465f;border-radius:8px;padding:8px 12px}button{cursor:pointer}button:hover,button:focus-visible{border-color:var(--mint)}input{flex:1;min-width:180px}.viewport{height:590px;overflow:hidden;touch-action:none}svg{height:100%;width:100%;display:block;user-select:none}.caption{font-size:11px;color:var(--muted);padding:12px 18px;display:flex;gap:10px;align-items:center;flex-wrap:wrap}.dot{width:6px;height:6px;border-radius:50%;background:var(--mint)}aside{padding:24px;border:1px solid #23364d;border-radius:18px;background:#0b192a;max-height:710px;overflow:auto}.district-button,.capability{display:block;width:100%;text-align:left;margin:8px 0}.capability{padding:10px 12px;background:#132840;border-radius:7px}.site{display:block;margin:12px 0;overflow-wrap:anywhere}.site small{display:block;color:var(--muted)}.back{margin-bottom:14px}.notice,footer{font-size:12px;color:var(--muted)}.building{cursor:pointer;outline:none}.building:hover .roof,.building:focus .roof{filter:brightness(1.5)}.building text{pointer-events:none}.roads{stroke:#29445b;stroke-width:13;fill:none}.flow{stroke:#70f5d0;stroke-width:2;stroke-dasharray:3 25;fill:none;animation:flow 5s linear infinite}.off .flow{animation:none}.off .bot{animation:none}.bot{animation:work 2s ease-in-out infinite alternate}@keyframes flow{to{stroke-dashoffset:-112}}@keyframes work{to{transform:translateY(-3px)}}@media(prefers-reduced-motion:reduce){.flow,.bot{animation:none}}@media(max-width:1050px){.workspace{grid-template-columns:minmax(0,1fr) 260px}.stats{gap:10px}.viewport{height:500px}}@media(max-width:760px){main{padding:24px 16px}.intro{display:block}.stats{margin-top:20px}.workspace{grid-template-columns:1fr}.viewport{height:430px}aside{max-height:none}header{padding:0 16px}nav{font-size:12px;gap:12px}}

.telemetry{margin:24px 0;padding:24px;border:1px solid #23364d;border-radius:18px;background:#0b192a}.telemetry-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:18px}.telemetry strong{font-size:25px;display:block;color:#70f5d0}.telemetry small{color:#8fa5bd}.telemetry-table{width:100%;border-collapse:collapse;margin:20px 0;font-size:13px}.telemetry-table td,.telemetry-table th{padding:8px;border-bottom:1px solid #23364d;text-align:left}.table-scroll{overflow:auto}.telemetry-table{min-width:600px}.stale{color:#ffbd72}.live-worker-count{font-size:12px;color:#70f5d0}

.language-label{font-size:12px;color:#8fa5bd;display:flex;gap:8px;align-items:center}select{background:#102137;border:1px solid #30465f;color:#d8e5f4;border-radius:7px;padding:6px;max-width:145px}.language-label select{font:inherit}@media(max-width:760px){header{height:auto;min-height:76px;flex-wrap:wrap;gap:12px;padding:14px 16px}header nav{flex-wrap:wrap;align-items:center}.language-label{font-size:11px}}

.theme-picker{display:flex;align-items:center;gap:6px;font-size:13px}.theme-picker select{background:#14273b;color:#e6f0fc;border:1px solid #35506a;border-radius:7px;padding:8px}.tools{flex-wrap:wrap}.water-route{fill:none;stroke:#a2eee5;stroke-width:3;stroke-dasharray:8 12;opacity:.45}.water-flow{stroke:#fff0ae}.process-room{padding:10px;margin:8px 0;border:1px solid #35506a;border-radius:8px}.process-room summary{cursor:pointer;font-weight:600}.process-room small{color:#9cbbc8}.island .building:focus{outline:none}.island .building:focus path{stroke:#fff}

.live-mode .flow:not(.live-active),.live-mode .bot:not(.live-active){animation:none!important}.live-mode .flow:not(.live-active){opacity:.12}.process-room[open]{border-color:#70f5d0}.room-stat{font-size:12px;color:#bdd1df}

.packet{animation:packet-travel 7s linear infinite;offset-rotate:0deg}.screen-lines{animation:screen-work 1.4s ease-in-out infinite}.room-bot{transform-box:fill-box;transform-origin:center}.live-mode .packet:not(.live-active),.live-mode .screen-lines:not(.live-active),.off .packet,.off .screen-lines{animation-play-state:paused!important}.live-mode .packet:not(.live-active){opacity:.25}@keyframes packet-travel{from{offset-distance:0%}to{offset-distance:100%}}@keyframes screen-work{50%{opacity:.3}}#room-interior [role=button]{cursor:zoom-in}#room-interior [role=button]:focus rect{stroke:#fff;stroke-width:3}

.vessel{animation-duration:var(--tour-duration,7s)}

.bot{animation-duration:var(--bot-duration,1.5s)}

.game-asset-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px}.game-asset-grid label{background:#132840;padding:12px;border-radius:10px;overflow-wrap:anywhere}.game-asset-grid img{display:block;width:100%;height:120px}.game-asset-grid small{display:block}.minigames .water-route{stroke:#448bd0}.minigames .building:focus{filter:drop-shadow(0 0 9px #ffe795)}

.process-route{cursor:pointer;opacity:.65}.process-route:hover,.process-route:focus,.selected-route{opacity:1}.route-label{font-size:12px;fill:#f2faff;paint-order:stroke;stroke:#071726;stroke-width:5px;stroke-linejoin:round}.route-button{display:block;width:100%;text-align:left;margin:8px 0;padding:10px;border:1px solid #45647e;border-radius:8px;background:#11283d;color:#edfaff}.connections-panel{margin:18px 0;padding:12px;border:1px solid #355773;border-radius:10px}.connections-panel summary{cursor:pointer;color:#88f2d3}

.journey-panel{padding:18px;background:#11283d;border-top:1px solid #466980}.journey-panel[hidden]{display:none}.journey-panel h3{margin:8px 0}.journey-io{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.journey-io p{margin:6px 0}.journey-controls{display:flex;flex-wrap:wrap;gap:8px}.journey-controls button:disabled{opacity:.4;cursor:default}.journey-steps{display:flex;flex-wrap:wrap;gap:10px;padding-left:24px}.journey-steps button{font-size:12px;max-width:210px}.journey-steps [aria-current=step]{border-color:#7ff5cb;background:#1b514c}@media(max-width:600px){.journey-io{grid-template-columns:1fr}}

.worker-explainer{padding:16px;margin-top:18px;border:1px solid #65b9a4;border-radius:12px;background:#112c3a}.worker-explainer li{margin:7px 0}

.intro h1{font-size:clamp(14px,1.5vw,23px)}

.public-job-cards{margin-top:20px;border-top:1px solid #37505e;padding-top:14px}.job-card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(135px,1fr));gap:8px}.job-card{border:1px solid #526571;border-left:4px solid #92a2ae;border-radius:8px;padding:9px;overflow-wrap:anywhere}.job-card summary{cursor:pointer;font-size:13px}.job-card p{font-size:12px}.job-processing{border-left-color:#62d5fa}.job-completed{border-left-color:#80daa3}.job-failed{border-left-color:#f49b9b}.job-pending{border-left-color:#edcd7e}

.infrastructure-panel{margin:12px;padding:14px;border:1px solid #456478;border-radius:12px;background:#102738}.infrastructure-panel>summary{cursor:pointer;font-weight:600}.infrastructure-regions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.infrastructure-region{padding:12px;border:1px solid #456478;border-radius:10px}.machine-card{display:flex;flex-direction:column;text-align:left;width:100%;gap:6px;margin:9px 0;padding:12px;border:1px solid #5e8aa0;border-radius:9px;background:#18394c;color:#f0f8ff}.machine-card.planned{border-style:dashed;opacity:.85}.machine-card strong{font-size:14px}.infrastructure-links{display:flex;flex-direction:column;gap:8px;margin-top:12px}.infrastructure-link{padding:10px;border:1px dashed #7c98a7;background:#153044;color:#f0f8ff;text-align:left;border-radius:6px}#infrastructure-detail{margin-top:16px}#infrastructure-detail p{font-size:14px}@media(max-width:600px){.infrastructure-regions{grid-template-columns:1fr}}

.room-task-flow{margin-top:20px;border-top:1px solid #37505e;padding-top:14px}.task-steps{padding-left:24px}.task-steps li{margin:12px 0}.task-steps details,.room-task-flow>details{border:1px solid #456478;padding:12px;border-radius:8px;margin-bottom:10px}.room-task-flow summary{cursor:pointer;font-weight:600}.room-task-flow p{font-size:14px}

#room-interior .station-selected>rect{stroke:#fff;stroke-width:3;filter:brightness(1.15)}#room-interior [role=button]:hover>rect{stroke:#d2f7ee;stroke-width:2}.room-scenery,.workstation-props,.robot-role-props{pointer-events:none}@media(prefers-reduced-motion:reduce){.packet,.screen-lines{animation:none!important}}

.city-location{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 15px;border-bottom:1px solid #203147}.city-location button{font-size:12px;padding:5px 9px}.city-location span{font-size:12px;color:#b7cddd}#city-room{max-width:260px}@media(max-width:600px){#city-room{max-width:210px}}

.room-view{background:#071727}.room-micro-detail{pointer-events:none}.room-view [role=button]{outline:none}.room-view [role=button]:focus-visible>rect{stroke:#fff;stroke-width:3}

.workstation-panel{padding:20px;border-top:1px solid #456478;background:#102738}.workstation-controls{display:flex;flex-wrap:wrap;gap:8px}.workstation-controls [aria-pressed=true]{border-color:#70f5d0}.workstation-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.workstation-detail-grid>section{padding:14px;border:1px solid #456478;border-radius:10px}.workstation-panel h2{font-size:22px}.workstation-panel p{font-size:14px}@media(max-width:760px){.workstation-detail-grid{grid-template-columns:1fr}}

.guide-controls{display:flex;gap:12px;flex-wrap:wrap;margin:12px 0}.guide-controls input{flex:1;min-width:200px}.guide-controls input,.guide-controls select{padding:10px;border:1px solid #42647b;background:#102739;color:#edf5ff;border-radius:8px}.guide-room{margin:10px 0;padding:12px;border:1px solid #365266;border-radius:8px}.guide-room summary{cursor:pointer}.guide-task{padding:12px;margin-top:12px;border-top:1px solid #365266}.guide-task h3{margin:0 0 8px}.guide-task p{overflow-wrap:anywhere}

.staffing-scroll{overflow-x:auto}.staffing-table{width:100%;border-collapse:collapse}.staffing-table th,.staffing-table td{padding:12px;text-align:left;border-bottom:1px solid #365266}.staffing-table input{display:block;max-width:180px;padding:8px;background:#102739;color:#edf5ff;border:1px solid #42647b;border-radius:6px}.guide-controls label input{display:block;margin-top:6px}

.fixture-hotspot{cursor:pointer}.fixture-hotspot:hover rect,.fixture-hotspot:focus rect{fill:#a9e0d122;stroke:#fff;stroke-width:2}

.hide-route-labels .route-label{display:none}.hide-fixture-outlines .fixture-hotspot rect{stroke:transparent}.hide-fixture-outlines .fixture-hotspot:hover rect,.hide-fixture-outlines .fixture-hotspot:focus rect{stroke:#fff}.compact-guide .guide-task{padding:6px;margin-top:6px}.compact-guide .guide-task p{font-size:.875rem;line-height:1.35;margin:6px 0}.display-controls{display:flex;flex-wrap:wrap;gap:16px;margin:14px 0}.display-controls label{display:flex;align-items:center;gap:8px}

.city-presentation .intro,.city-presentation #telemetry,.city-presentation #city-coverage,.city-presentation #infrastructure-panel,.city-presentation #display-settings,.city-presentation #operations-guide,.city-presentation #staffing-comparison,.city-presentation #room-activity,.city-presentation #queue-inspector,.city-presentation #recent-activity{display:none}.city-presentation #viewport{height:72vh;min-height:420px}.city-presentation main{max-width:1800px}#presentation-caption{padding:10px 14px;background:#123449;border:1px solid #42647b;border-radius:8px;font-size:.9rem}.city-presentation #presentation-toggle{background:#b1efdd;color:#092938}@media(max-width:700px){.city-presentation #viewport{height:60vh;min-height:320px}}

.mini-game-map{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.mini-game-list{display:flex;flex-wrap:wrap;gap:8px}.mini-game-screen{display:block;width:min(100%,420px);height:auto;margin:12px 0}.city-presentation #mini-game-explorer{display:none}@media(max-width:700px){.mini-game-map{grid-template-columns:1fr}}

.map-room-entrances [role=button],.room-job-kiosk{cursor:pointer}.map-room-entrances [role=button]:hover rect,.map-room-entrances [role=button]:focus rect,.room-job-kiosk:focus rect{stroke:#fff;stroke-width:3}.room-job-access{padding:12px;border:1px solid #42647b;border-radius:8px;margin-top:12px}

/* Server Cities & Sync — Pass 2 of 3 */
.server-network-stage{width:100%;overflow:hidden;border:1px solid #476980;border-radius:12px;background:#091929;background-position:center;background-size:cover}.server-network{display:block;width:100%;height:auto;min-height:240px;max-height:560px;touch-action:none;cursor:grab}.server-network .server-city,.server-network .server-link{cursor:pointer}.server-network [role=button]:focus{outline:none;filter:drop-shadow(0 0 5px #fff)}.server-network.off .server-demo-packet{display:none}.server-controls{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0}.server-controls button{padding:10px 14px;min-height:44px}.server-demo-notice{padding:10px 14px;border:1px dashed #83a7e2;border-radius:8px;font-size:14px}.server-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:8px;margin:12px 0}.server-district-layout{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:8px}.server-planned-district{border-style:dashed!important}.server-network-stage+div{margin-top:14px}#infrastructure-detail h4{margin-top:20px}.server-metrics .stat{min-width:0}.server-network-stage{margin:12px 0}@media(prefers-reduced-motion:reduce){.server-demo-packet{display:none}}@media(max-width:600px){.server-network{min-height:200px;max-height:400px}.server-district-layout{grid-template-columns:1fr}.server-controls button{white-space:normal}}

/* Shared page theme affects navigation and controls; artwork keeps its own theme. */
body{background:var(--page-bg,#060f1c);color:var(--text,var(--ink))}body p{color:var(--muted,#8fa5bd)}body a{color:var(--blue,var(--mint))}body a:hover{text-decoration:underline}body a:focus-visible{outline:2px solid currentColor;outline-offset:4px}
body.light-theme{color-scheme:light;--ink:#182b40;--muted:#4d6278;--mint:#12674f;--page-bg:#f4f7fa;--text:#182b40;--blue:#005fcc}
body.light-theme .brand,body.light-theme .stat strong{color:var(--text)}body.light-theme header{border-color:#ccd8e3}body.light-theme aside,body.light-theme .telemetry,body.light-theme .infrastructure-panel,body.light-theme .infrastructure-region,body.light-theme .machine-card,body.light-theme .admin details,body.light-theme main>details{background:var(--panel-bg,#fff);color:var(--text);border-color:var(--border,#bdcbd9)}
body.light-theme button,body.light-theme input,body.light-theme select,body.light-theme textarea{background:var(--input-bg,#fff);color:var(--text);border-color:var(--border,#9badbf)}body.light-theme summary,body.light-theme label,body.light-theme .machine-card strong{color:var(--text)}body.light-theme .viewport,body.light-theme .server-network-stage{color-scheme:dark}

body.light-theme main details{background:var(--panel-bg,#fff)!important;color:var(--text);border-color:var(--border,#bdcbd9)!important}

/* Review closeout: finger-sized controls and readable narrow-screen navigation. */
#review-start nav{display:block}#review-start a{display:inline-block;padding:8px 0;min-height:44px}
#infrastructure-detail,#server-blueprint-detail,#detail,#viewport,#server-network-stage{scroll-margin-top:18px}
.city-location button,.tools button,.tools select,.tools input,.district-button,.back,.infrastructure-link{min-height:44px}
button:focus-visible,a:focus-visible,select:focus-visible{outline:2px solid var(--mint);outline-offset:3px}
@media(max-width:760px){.city-location{align-items:stretch}.city-location button{flex:1 1 auto}.tools select,#city-room{max-width:100%;min-width:0}.tools input{width:100%;min-width:0}.tools label{max-width:100%;flex-wrap:wrap}.stats{flex-wrap:wrap}#detail{overflow:visible}#infrastructure-detail{padding:12px;border:1px solid #456478;border-radius:10px}.infrastructure-panel{margin:12px 0;min-width:0}.server-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.server-metrics small,.machine-card,.district-button{overflow-wrap:anywhere}}

/* Single Scene: one stage, with supplementary views in its overlay. */
body.single-scene{height:100dvh;display:flex;flex-direction:column;overflow:hidden}
.single-scene header{flex:none}.single-scene main{width:100%;max-width:none;padding:8px;flex:1;min-height:0;overflow:hidden}
.single-scene .intro,.single-scene #presentation-caption,.single-scene main>footer,.single-scene main>.notice{display:none!important}
.single-scene .workspace{display:block;height:100%;min-height:0}.single-scene .map{display:flex;flex-direction:column;position:relative;height:100%;min-height:0}
.single-scene .tools{flex:none;max-height:130px;overflow:auto;padding:8px}.single-scene .city-location{flex:none;max-height:108px;overflow:auto;padding:6px 10px}.single-scene .city-location span{flex-basis:100%}
.single-scene #viewport{height:auto!important;min-height:0!important;flex:1;position:relative;overflow:hidden}
.single-scene #city{height:100%;width:100%}.single-scene #city[hidden],.single-scene #server-network-stage[hidden],.single-scene #scene-pane[hidden],.single-scene #scene-bank[hidden]{display:none!important}
.single-scene #server-network-stage{height:100%;width:100%;margin:0;border:0;border-radius:0}.single-scene .server-network{height:100%;width:100%;max-height:none;min-height:0}
.single-scene .caption{display:none}.single-scene .scene-help{flex:none;font-size:11px;padding:4px 12px;margin:0;color:#c4d8e8}
.single-scene #scene-pane{position:absolute;z-index:5;right:12px;top:180px;bottom:36px;width:min(440px,calc(100% - 24px));display:flex;flex-direction:column;border:1px solid #60889a;border-radius:12px;background:#0b192af5;box-shadow:0 8px 30px #0009;overflow:hidden}
.single-scene .scene-pane-head{flex:none;padding:8px;border-bottom:1px solid #456478;display:flex;justify-content:flex-end}.single-scene .scene-pane-head button{min-height:44px}
.single-scene #scene-pane-body{overflow:auto;min-height:0;flex:1;padding:12px;overscroll-behavior:contain}
.single-scene #scene-pane-body>*{display:block!important;margin:0;max-height:none;border:0;padding:8px;width:100%}.single-scene #scene-pane-body #infrastructure-detail{padding:8px}.single-scene #scene-pane-body nav{display:block}.single-scene #scene-pane-body .workstation-detail-grid{grid-template-columns:1fr}
.single-scene #scene-pane-body a,.single-scene #scene-pane-body button,.single-scene #scene-pane-body summary{min-height:44px}.single-scene #scene-pane-body .telemetry-table{min-width:600px}
@media(max-width:760px){.single-scene header{padding:8px 12px;min-height:48px;height:auto}.single-scene header nav{gap:8px}.single-scene .brand{font-size:18px}.single-scene .tools{max-height:104px}.single-scene .city-location{max-height:104px}.single-scene #scene-pane{top:auto;left:8px;right:8px;bottom:30px;width:auto;max-height:55%;height:55%}.single-scene .city-location button{font-size:12px;padding:6px;flex:0 1 auto}.single-scene .scene-help{font-size:10px}.single-scene #scene-pane-body .server-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}
