:root{color:#f6f0df;background:#151817;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:linear-gradient(180deg,rgba(11,111,122,.34),transparent 44%),#151817}button{font:inherit}button:disabled{cursor:not-allowed;opacity:.42}.app-shell{display:grid;grid-template-columns:minmax(286px,360px) minmax(0,1fr);height:100vh;height:100dvh;min-height:0}.app-shell-controls-collapsed{grid-template-columns:66px minmax(0,1fr)}.control-rail{display:flex;flex-direction:column;gap:18px;max-height:100vh;padding:22px;overflow:hidden;border-right:1px solid rgba(246,240,223,.16);background:#151817f0}.app-shell-controls-collapsed .control-rail{align-items:center;gap:0;padding:10px;overflow:hidden}.rail-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;width:100%}.rail-toggle{flex:0 0 auto}.app-shell-controls-collapsed .rail-title,.rail-content[hidden]{display:none}.rail-content{display:flex;flex:1 1 auto;min-height:0;flex-direction:column;gap:18px;overflow-y:auto}.eyebrow{margin:0 0 8px;color:#8ecae6;font-size:.78rem;font-weight:800;letter-spacing:0;text-transform:uppercase}h1{margin:0;font-size:1.75rem;line-height:1.1;letter-spacing:0}.how-to-play,.map-legend,.dispatch-panel,.camera-panel,.sea-panel,.sky-panel,.utility-panel,.housing-panel,.structure-panel,.transit-help-panel,.design-panel{padding:14px;border:1px solid rgba(246,240,223,.16);border-radius:8px;background:#f6f0df0d}.how-to-play h2,.map-legend h2,.camera-panel h2,.sea-panel h2,.sky-panel h2,.utility-panel h2,.housing-panel h2,.structure-panel h2,.transit-help-panel h2,.design-panel h2{margin:0;color:#f6f0df9e;font-size:.78rem;font-weight:700;letter-spacing:0;text-transform:uppercase}.section-kicker{display:block;margin-bottom:6px;color:#f6f0df9e;font-size:.78rem;font-weight:700;letter-spacing:0;text-transform:uppercase}.dispatch-panel{display:grid;gap:12px;border-left-width:3px}.dispatch-panel[data-state=offered]{border-left-color:#ffc857}.dispatch-panel[data-state=active]{border-left-color:#7fd18b}.dispatch-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.dispatch-heading strong{display:block;color:#f6f0df;font-size:1.05rem;line-height:1.14}.dispatch-heading svg{flex:0 0 auto;color:#ffc857}.dispatch-panel[data-state=active] .dispatch-heading svg{color:#7fd18b}.dispatch-details{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0}.dispatch-details div{min-height:52px;padding:9px;border-radius:8px;background:#15181752}.dispatch-details dt{color:#f6f0df9e;font-size:.76rem;font-weight:700}.dispatch-details dd{margin:5px 0 0;overflow-wrap:anywhere;color:#f6f0df;font-size:.96rem;font-weight:800;line-height:1.12}.how-to-play p{margin:8px 0 12px;font-size:.95rem;line-height:1.35}.how-to-play dl,.map-legend dl,.utility-panel dl,.housing-panel dl,.sea-panel dl,.structure-panel dl{display:grid;gap:6px;margin:0}.how-to-play dl div,.map-legend dl div,.utility-panel dl div,.housing-panel dl div,.sea-panel dl div,.structure-panel dl div{display:flex;justify-content:space-between;gap:12px;font-size:.86rem}.how-to-play dt,.map-legend dd,.utility-panel dt,.housing-panel dt,.sea-panel dt,.structure-panel dt{color:#f6f0df9e}.map-legend dl,.utility-panel dl,.housing-panel dl{margin-top:10px}.utility-panel dd,.housing-panel dd,.sea-panel dd,.structure-panel dd{margin:0;font-variant-numeric:tabular-nums}.housing-panel,.structure-panel{display:grid;gap:10px}.housing-panel[data-state=short]{border-color:#e0a03f80;background:#e0a03f1a}.structure-panel[data-state=loaded]{border-color:#ffc8576b}.structure-panel[data-state=stressed],.structure-panel[data-state=overstressed]{border-color:#d968548f;background:#d968541a}.housing-heading,.structure-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.housing-heading,.structure-heading>div{display:flex;align-items:center;gap:8px;color:#f6f0df9e}.structure-heading strong{color:#f6f0df;font-size:.94rem;line-height:1.16}.structure-actions{display:grid;justify-items:end;gap:8px}.structure-actions .text-button{min-height:34px;padding:0 10px;font-size:.82rem}.structure-actions .text-button[aria-pressed=true]{color:#151817;border-color:#ffc857;background:#ffc857}.transit-help-panel{display:grid;gap:10px}.transit-help-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.transit-help-heading>div{display:flex;align-items:center;gap:8px;color:#f6f0df9e}.transit-help-heading .text-button{min-height:34px;padding:0 10px;font-size:.82rem}.transit-help-heading .text-button[aria-pressed=true]{color:#151817;border-color:#ffc857;background:#ffc857}.transit-help-list{display:grid;gap:8px;margin:0;padding:0;list-style:none}.transit-help-list li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:3px 10px;min-height:54px;padding:9px;border-left:3px solid rgba(246,240,223,.2);border-radius:8px;background:#15181752}.transit-help-list li[data-state=ready]{border-left-color:#7fd18b}.transit-help-list li[data-state=active]{border-left-color:#8ecae6}.transit-help-list div{display:flex;min-width:0;align-items:center;gap:7px;color:#f6f0df;font-weight:800}.transit-help-list span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.transit-help-list strong{color:#f6f0df;font-size:.88rem;font-weight:800;line-height:1.12;text-align:right}.transit-help-list em{grid-column:1 / -1;overflow:hidden;color:#f6f0df9e;font-size:.78rem;font-style:normal;font-weight:700;text-overflow:ellipsis;white-space:nowrap}.structure-components{display:grid;gap:4px;margin:0;padding:10px 0 0;border-top:1px solid rgba(246,240,223,.14);list-style:none}.structure-components li{display:flex;justify-content:space-between;gap:12px;font-size:.82rem}.structure-components span{color:#f6f0df9e}.structure-components strong{font-variant-numeric:tabular-nums;font-weight:700}.structure-components strong[data-state=nominal]{color:#7fd18b}.structure-components strong[data-state=loaded]{color:#ffc857}.structure-components strong[data-state=stressed],.structure-components strong[data-state=overstressed]{color:#d96854}.design-panel{display:grid;gap:10px}.design-heading{display:flex;align-items:center;gap:8px;color:#f6f0df9e}.design-actions{display:grid;gap:8px;margin:0;padding:0;list-style:none}.design-actions li{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.9fr) auto;min-height:58px;align-items:center;gap:12px;padding:9px;border-left:3px solid rgba(246,240,223,.2);border-radius:8px;background:#15181752}.design-actions li[data-decision=accepted]{border-left-color:#7fd18b}.design-actions li[data-decision=warned]{border-left-color:#ffc857}.design-actions li[data-decision=rejected]{border-left-color:#d96854}.design-actions div{display:grid;gap:4px}.design-actions div:nth-child(2){justify-items:end;text-align:right}.design-actions span{color:#f6f0df9e;font-size:.74rem;font-weight:700;text-transform:uppercase}.design-actions strong{color:#f6f0df;font-size:.92rem;line-height:1.12}.design-actions li[data-decision=accepted] div:nth-child(2) strong{color:#7fd18b}.design-actions li[data-decision=warned] div:nth-child(2) strong{color:#ffc857}.design-actions li[data-decision=rejected] div:nth-child(2) strong{color:#d96854}.design-message{margin:0;color:#f6f0dfb8;font-size:.82rem}.design-actions .text-button{min-width:78px;justify-content:center;padding:8px 10px}.design-applied{display:grid;gap:6px;margin:0;padding:10px 0 0;border-top:1px solid rgba(246,240,223,.14);list-style:none}.design-applied li{display:flex;justify-content:space-between;gap:10px;color:#f6f0dfb3;font-size:.82rem}.design-applied span{color:#f6f0df80;font-weight:700;text-transform:uppercase}.utility-nodes{display:grid;gap:4px;margin:10px 0 0;padding:10px 0 0;border-top:1px solid rgba(246,240,223,.14);list-style:none}.utility-nodes li{display:flex;justify-content:space-between;gap:12px;font-size:.82rem}.utility-nodes span{color:#f6f0df9e}.utility-nodes strong{font-variant-numeric:tabular-nums;font-weight:700}.housing-blocks{display:grid;gap:4px;max-height:260px;margin:0;padding:10px 0 0;overflow:auto;border-top:1px solid rgba(246,240,223,.14);list-style:none}.housing-blocks li{display:flex;justify-content:space-between;gap:12px;font-size:.82rem}.housing-blocks span{min-width:0;overflow:hidden;color:#f6f0df9e;text-overflow:ellipsis;white-space:nowrap}.housing-blocks strong{flex:0 0 auto;color:#7fd18b;font-variant-numeric:tabular-nums;font-weight:700}.utility-nodes strong[data-flow=supply]{color:#7fd18b}.utility-nodes strong[data-flow=draw]{color:#8ecae6}.utility-nodes strong[data-flow=idle]{color:#f6f0df73}.utility-panel[data-state=brownout]{border-color:#e0a03f80;background:#e0a03f1a}.utility-warning{margin:10px 0 0;color:#e0a03f;font-size:.82rem;font-weight:700}.map-legend dt{display:flex;align-items:center;gap:8px;color:#f6f0df;font-weight:800}.map-legend dd{margin:0}.camera-panel{display:grid;gap:12px}.camera-panel-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.camera-panel-heading strong{display:block;margin-top:4px;color:#f6f0df;font-size:1rem;line-height:1.12}.camera-panel-heading span{max-width:45%;overflow-wrap:anywhere;color:#f6f0df9e;font-size:.82rem;font-weight:700;line-height:1.16;text-align:right}.camera-mode-actions{display:flex;flex-wrap:wrap;gap:8px}.sky-panel,.sea-panel{display:grid;gap:10px}.sky-panel .text-button[aria-pressed=true],.sea-panel .text-button[aria-pressed=true]{color:#151817;border-color:#7fd18b;background:#7fd18b}.sea-panel[data-mode=storm] .text-button[aria-pressed=true]{border-color:#ffc857;background:#ffc857}.sea-panel[data-mode=extreme] .text-button[aria-pressed=true]{color:#f6f0df;border-color:#d96854;background:#d96854}.legend-swatch{display:inline-block;flex:0 0 auto;width:12px;height:12px;border:1px solid rgba(21,24,23,.55)}.legend-swatch-player{border-radius:999px;background:#ffc857}.legend-swatch-resident{border-radius:999px;background:conic-gradient(#2f6f73 0,#2f6f73 16.66%,#7a3f55 16.66%,#7a3f55 33.33%,#4f6b3d 33.33%,#4f6b3d 50%,#365d7c 50%,#365d7c 66.66%,#8a5d2f 66.66%,#8a5d2f 83.33%,#5b4f7a 83.33%,#5b4f7a)}.legend-swatch-visitor{border-radius:999px;background:conic-gradient(#365d7c 0,#365d7c 20%,#8a5d2f 20%,#8a5d2f 40%,#2f6f73 40%,#2f6f73 60%,#7a3f55 60%,#7a3f55 80%,#4f6b3d 80%,#4f6b3d)}.legend-swatch-transit{background:#8ecae6}.how-to-play dd{margin:0;padding:1px 7px;border:1px solid rgba(246,240,223,.2);border-radius:5px;background:#f6f0df14;font-weight:700;white-space:nowrap}.toolbar{display:flex;flex-wrap:wrap;gap:10px}.movement-pad{display:grid;grid-template-columns:repeat(3,44px);grid-template-rows:repeat(3,44px);width:max-content}.pad-up{grid-column:2;grid-row:1}.pad-left{grid-column:1;grid-row:2}.pad-right{grid-column:3;grid-row:2}.pad-down{grid-column:2;grid-row:3}.icon-button{display:grid;width:44px;height:44px;place-items:center;border:1px solid rgba(246,240,223,.24);border-radius:8px;color:#f6f0df;background:#f6f0df14;cursor:pointer}.icon-button:hover:not(:disabled){border-color:#f6f0df80;background:#f6f0df24}.icon-button.primary{color:#151817;border-color:#ffc857;background:#ffc857}.metric-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.metric-card{min-height:82px;padding:13px;border:1px solid rgba(246,240,223,.16);border-radius:8px;background:#f6f0df12}.metric-card span{display:block;color:#f6f0df9e;font-size:.78rem;font-weight:700}.metric-card strong{display:block;min-height:1.95rem;margin-top:10px;overflow-wrap:anywhere;color:#f6f0df;font-size:1.35rem;line-height:1.08}.status-strip{display:grid;gap:3px;min-height:56px;padding:9px 14px;border:1px solid rgba(246,240,223,.18);border-left-width:3px;border-radius:8px}.status-label{overflow:hidden;font-weight:800;text-overflow:ellipsis;white-space:nowrap}.status-detail{color:#f6f0dfad;font-size:.84rem}.status-strip[data-state=ready]{border-left-color:#7fd18b;color:#7fd18b}.status-strip[data-state=blocked]{border-left-color:#e0a03f;color:#e0a03f}.status-strip[data-state=error]{border-left-color:#d96854;color:#d96854}.status-strip[data-state=inside],.status-strip[data-state=transit],.status-strip[data-state=walking]{border-left-color:#8ecae6;color:#8ecae6}.stage-fallback{display:grid;align-content:center;justify-items:center;gap:8px;width:100%;height:100%;min-height:0;padding:24px;border:1px solid rgba(246,240,223,.18);border-radius:8px;background:#0b6f7a47;text-align:center}.stage-fallback p{max-width:40ch;margin:0;color:#f6f0dfb3}.interior-panel{display:grid;gap:14px;margin-top:auto;padding:14px;border:1px solid rgba(255,200,87,.45);border-radius:8px;background:#ffc8571a}.interior-panel>div:first-child,.text-button{display:flex;align-items:center;gap:10px}.interior-panel strong{line-height:1.1}.interior-panel dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0}.interior-panel dl div{min-height:58px;padding:10px;border-radius:8px;background:#15181757}.interior-panel dt{color:#f6f0df9e;font-size:.76rem;font-weight:700}.interior-panel dd{margin:6px 0 0;font-size:1.15rem;font-weight:800}.text-button{display:flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:0 14px;border:1px solid rgba(246,240,223,.24);border-radius:8px;color:#f6f0df;background:#1518176b;font-weight:700;cursor:pointer}.text-button:hover:not(:disabled){border-color:#f6f0df80;background:#f6f0df1f}.text-button.primary{color:#151817;border-color:#7fd18b;background:#7fd18b}.simulation-stage{position:relative;height:100%;min-height:0;padding:18px}.stage-hud{position:absolute;right:18px;bottom:18px;left:18px;z-index:2;display:flex;justify-content:center;padding:0 18px 24px;pointer-events:none}.stage-hud-notice{display:flex;align-items:center;max-width:min(440px,100%);min-height:48px;gap:10px;padding:9px 14px;border:1px solid rgba(246,240,223,.32);border-radius:8px;color:#f6f0df;background:#151817c2;box-shadow:0 12px 30px #00000042;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.stage-hud-notice[data-state=ready]{border-color:#7fd18bb8}.stage-hud-notice[data-state=blocked],.stage-hud-notice[data-state=error]{border-color:#e0a03fb8}.stage-hud-notice[data-state=transit],.stage-hud-notice[data-state=inside],.stage-hud-notice[data-state=walking]{border-color:#8ecae6a3}.stage-hud-key{display:grid;min-width:32px;height:30px;place-items:center;padding:0 9px;border:1px solid rgba(246,240,223,.32);border-bottom-width:3px;border-radius:6px;background:#f6f0df1f;font-size:.86rem;font-weight:900}.stage-hud-action{overflow-wrap:anywhere;font-weight:800;line-height:1.1}.stage-hud-detail{overflow:hidden;color:#f6f0dfad;font-size:.84rem;font-weight:700;text-overflow:ellipsis;white-space:nowrap}.loading-screen{position:absolute;top:18px;right:18px;bottom:18px;left:18px;z-index:3;display:grid;place-items:center;border:1px solid rgba(246,240,223,.18);border-radius:8px;background:#151817e6;text-align:center}.loading-panel{display:grid;width:min(360px,calc(100% - 40px));gap:14px;padding:18px;border:1px solid rgba(246,240,223,.18);border-radius:8px;background:#151817bd;box-shadow:0 18px 42px #0000004d;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.loading-panel strong{color:#f6f0df;font-size:1.45rem;line-height:1.08}.loading-bar{overflow:hidden;height:8px;border-radius:999px;background:#f6f0df1f}.loading-bar span{display:block;height:100%;border-radius:inherit;background:#7fd18b;transition:width .18s ease}.loading-screen[data-loading-step=physics] .loading-bar span{width:33.33%}.loading-screen[data-loading-step=scene] .loading-bar span{width:66.66%}.loading-screen[data-loading-step=effects] .loading-bar span{width:100%}.loading-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0;padding:0;list-style:none}.loading-steps li{display:grid;justify-items:center;gap:7px;min-width:0;color:#f6f0df85;font-size:.78rem;font-weight:800;line-height:1.12}.loading-steps li>span{width:12px;height:12px;border:1px solid rgba(246,240,223,.28);border-radius:999px;background:#f6f0df14}.loading-steps li[data-state=done],.loading-steps li[data-state=active]{color:#f6f0df}.loading-steps li[data-state=done]>span{border-color:#7fd18b;background:#7fd18b}.loading-steps li[data-state=active]>span{border-color:#ffc857;background:#ffc857}.three-host{width:100%;height:100%;min-height:0;overflow:hidden;border:1px solid rgba(246,240,223,.18);border-radius:8px;background:#0b6f7a;cursor:grab;touch-action:none}.three-host:active{cursor:grabbing}.three-host canvas{display:block;width:100%;height:100%}@media (max-width: 820px){.app-shell{grid-template-columns:1fr;height:auto;min-height:100vh}.app-shell-controls-collapsed{grid-template-rows:auto minmax(0,1fr)}.control-rail{max-height:none;padding:20px;overflow:visible;border-right:0;border-bottom:1px solid rgba(246,240,223,.16)}.app-shell-controls-collapsed .control-rail{align-items:flex-start;padding:10px 12px}.rail-content{overflow:visible}.simulation-stage{height:auto;min-height:58vh;padding:12px}.stage-hud{right:12px;bottom:12px;left:12px;padding:0 10px 16px}.loading-screen{top:12px;right:12px;bottom:12px;left:12px}.three-host,.stage-fallback{min-height:58vh}.app-shell-controls-collapsed .simulation-stage{min-height:calc(100vh - 66px)}.app-shell-controls-collapsed .three-host,.app-shell-controls-collapsed .stage-fallback{min-height:calc(100vh - 90px)}}@media (max-width: 460px){.metric-grid{grid-template-columns:1fr}}
