:root{--accent: #6fffab;--accent-soft: #7fc98f;--glow: rgba(80,255,140,.18);--terminal-font: Fixedsys, "Lucida Console", "Courier New", monospace}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#020403;font-family:ui-monospace,Consolas,Courier New,monospace}body{min-height:100vh;overflow:hidden;color:#b7c8bd;background:radial-gradient(circle at 28% 48%,var(--glow),transparent 31%),#020403}#app{width:min(1520px,calc(100vw - 48px));margin:0 auto;min-height:100vh;display:grid;grid-template-columns:minmax(560px,1.42fr) minmax(340px,.88fr);align-items:center;gap:clamp(18px,2.2vw,36px)}#viewport{position:relative;width:100%;max-width:936px;justify-self:start;aspect-ratio:3 / 2;overflow:hidden;border:1px solid color-mix(in srgb,var(--accent) 40%,#17231c);background:#000;box-shadow:0 0 70px var(--glow),inset 0 0 0 1px #ffffff06}canvas{position:absolute;inset:0;width:100%;height:100%;background:#000;cursor:crosshair}#fx{position:absolute;inset:0;z-index:4;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(255,255,255,.012) 0,rgba(255,255,255,.012) 1px,transparent 1px,transparent 4px),radial-gradient(ellipse at center,transparent 58%,rgba(0,0,0,.08) 82%,rgba(0,0,0,.28) 100%)}#mobile-hud,#mobile-context,#touch-controls,#orientation-gate{display:none}body.touch-mode{--mobile-city-width: min(64vw, 150dvh );--mobile-city-height: min(42.6667vw,100dvh);--mobile-stick-size: clamp(82px,16vmin,128px);min-height:100dvh;overflow:hidden;overscroll-behavior:none;touch-action:none}body.touch-mode #app{position:relative;width:100vw;min-height:100dvh;margin:0;padding:0;display:block}body.touch-mode #viewport{width:100vw;height:100dvh;max-width:none;aspect-ratio:auto;border:1px solid rgba(84,214,121,.18);border-radius:clamp(28px,7vmin,58px);background:#000;box-shadow:inset 0 0 34px #47ff7c0e}body.touch-mode #viewport>canvas{position:absolute!important;inset:50% auto auto 50%!important;width:var(--mobile-city-width)!important;height:var(--mobile-city-height)!important;aspect-ratio:3 / 2!important;translate:-50% -50%!important;transform:none!important;image-rendering:auto}body.touch-mode #fx{inset:50% auto auto 50%;width:var(--mobile-city-width);height:var(--mobile-city-height);aspect-ratio:3 / 2;translate:-50% -50%;opacity:.68}body.touch-mode #interface{display:none}body.touch-mode #mobile-hud{position:absolute;z-index:7;top:max(10px,env(safe-area-inset-top));left:19vw;right:19vw;display:flex;align-items:center;gap:12px;pointer-events:none;color:#73e994c7;font:10px/1.2 var(--terminal-font);letter-spacing:.055em;text-shadow:0 0 5px rgba(54,255,112,.45)}body.touch-mode #mobile-hud span:last-child{margin-left:auto}body.touch-mode #mobile-context{position:absolute;z-index:8;left:50%;top:max(38px,calc(env(safe-area-inset-top) + 30px));translate:-50% 0;width:min(48vw,520px);max-height:74px;overflow:hidden;display:grid;gap:3px;padding:7px 10px;pointer-events:none;border:1px solid rgba(87,220,124,.25);background:#010a05bd;box-shadow:0 0 22px #36ff7014}body.touch-mode #mobile-context[hidden]{display:none}body.touch-mode #mobile-context strong{color:#82e8a0;font-size:11px;font-weight:400;letter-spacing:.06em}body.touch-mode #mobile-context span{color:#589d6b;font-size:9px;line-height:1.35;white-space:pre-line}body.touch-mode #touch-controls{position:absolute;inset:0;z-index:9;display:block;pointer-events:none;touch-action:none;user-select:none;-webkit-user-select:none}body.touch-mode #touch-move-pad,body.touch-mode #touch-look-zone{position:absolute;bottom:max(18px,calc(env(safe-area-inset-bottom) + 10px));width:var(--mobile-stick-size);height:var(--mobile-stick-size);border:1px solid rgba(99,235,139,.5);border-radius:50%;pointer-events:auto;touch-action:none;background:radial-gradient(circle,#2a864626,#0003 68%);box-shadow:inset 0 0 22px #38ff7117,0 0 18px #38ff7112}body.touch-mode #touch-move-pad{left:max(clamp(58px,9.5vw,112px),calc(env(safe-area-inset-left) + 10px))}body.touch-mode #touch-look-zone{right:max(clamp(58px,9.5vw,112px),calc(env(safe-area-inset-right) + 10px))}body.touch-mode .touch-pad-cross{position:absolute;inset:0;display:grid;place-content:center;text-align:center;color:#5cc37752;font:9px/1.4 var(--terminal-font);letter-spacing:.12em}body.touch-mode #touch-move-knob,body.touch-mode #touch-look-knob{position:absolute;left:50%;top:50%;width:42%;height:42%;translate:-50% -50%;border:1px solid rgba(116,255,157,.76);border-radius:50%;background:#26a04c75;box-shadow:0 0 18px #49ff7e33}body.touch-mode #touch-actions{position:absolute;right:max(18px,calc(env(safe-area-inset-right) + 10px));bottom:calc(max(18px,calc(env(safe-area-inset-bottom) + 10px)) + var(--mobile-stick-size) + 12px);width:clamp(58px,12vmin,84px);display:flex;flex-direction:column;gap:8px;pointer-events:auto}body.touch-mode #touch-actions button,body.touch-mode #touch-choices button,body.touch-mode #touch-pause-panel button{min-height:48px;border:1px solid rgba(105,240,144,.5);border-radius:5px;background:#031008b8;color:#7be79a;font:11px var(--terminal-font);letter-spacing:.08em;touch-action:none;text-shadow:0 0 5px rgba(70,255,126,.38)}body.touch-mode #touch-actions button:active,body.touch-mode #touch-actions button.active,body.touch-mode #touch-choices button:active,body.touch-mode #touch-pause-panel button:active{background:#3eb05e59;color:#adffc4;border-color:#93ffb1e6}body.touch-mode #touch-actions button{width:100%;min-height:clamp(36px,8vmin,48px)}body.touch-mode #touch-pause{order:1}body.touch-mode #touch-sprint{order:2}body.touch-mode #touch-interact{order:3}body.touch-mode #touch-choices{position:absolute;top:max(42px,calc(env(safe-area-inset-top) + 32px));left:50%;translate:-50% 0;display:flex;gap:7px;pointer-events:auto}body.touch-mode #touch-choices[hidden]{display:none}body.touch-mode #touch-choices button{min-width:46px;min-height:42px}body.touch-mode #touch-pause-panel{position:absolute;left:50%;top:50%;translate:-50% -50%;width:min(330px,calc(100vw - 44px));padding:24px;display:grid;gap:12px;pointer-events:auto;border:1px solid rgba(105,240,144,.65);background:#010a05f0;box-shadow:0 0 45px #35ff7029}body.touch-mode #touch-pause-panel[hidden]{display:none}body.touch-mode #touch-pause-panel strong{color:#8af0a7;text-align:center;font:14px var(--terminal-font);letter-spacing:.1em;margin-bottom:6px}body.touch-mode #orientation-gate{position:absolute;inset:0;z-index:20;display:none;place-content:center;padding:36px;text-align:center;background:#020604;color:#83e9a0}body.touch-mode #orientation-gate strong{display:block;font:18px var(--terminal-font);letter-spacing:.12em}body.touch-mode #orientation-gate span{display:block;margin-top:14px;color:#58976a;font:12px var(--terminal-font)}body.touch-mode.touch-portrait #orientation-gate{display:grid}body.touch-mode.game-paused #touch-move-pad,body.touch-mode.game-paused #touch-actions,body.touch-mode.game-paused #touch-look-zone,body.touch-mode.game-paused #touch-choices{opacity:.15;pointer-events:none}@media(max-height:430px){body.touch-mode{--mobile-stick-size: 82px}body.touch-mode #touch-actions{width:58px;gap:6px}body.touch-mode #touch-actions button{min-height:36px}body.touch-mode #mobile-hud{font-size:9px}}#interface{position:relative;isolation:isolate;height:min(720px,calc(100vh - 96px));min-height:min(720px,calc(100vh - 96px));max-height:min(720px,calc(100vh - 96px));overflow:hidden;padding:48px clamp(22px,2.4vw,38px) 30px;border:0;background:radial-gradient(ellipse at 38% 38%,rgba(26,105,55,.09),transparent 68%);color:#79b989;box-shadow:none;font-family:var(--terminal-font);font-variant-ligatures:none;-webkit-font-smoothing:antialiased;text-rendering:auto;text-shadow:0 0 1px currentColor,0 0 4px rgba(72,255,128,.3),1px 0 2px rgba(52,220,102,.1),-1px 0 2px rgba(52,220,102,.08)}#interface{transition:opacity .82s ease,transform .82s cubic-bezier(.2,.75,.2,1)}#interface-ascii{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;z-index:3;pointer-events:none;background:transparent;image-rendering:pixelated;transform:none!important;filter:none!important}#interface.ascii-ui-active #diagnostics,#interface.ascii-ui-active #context-panel{opacity:0;pointer-events:none}body.intro-active #interface{opacity:0;transform:translateY(5px);pointer-events:none}#interface>*{position:relative;z-index:1;filter:blur(.12px)}#interface:before,#interface:after{content:"";position:absolute;inset:0;pointer-events:none}#interface:before{display:none}#interface:after{z-index:2;opacity:.72;background:radial-gradient(ellipse at 42% 42%,transparent 46%,rgba(0,0,0,.22) 76%,rgba(0,0,0,.68) 100%);box-shadow:inset 0 0 58px #000000b8}.module-label{display:block;margin-bottom:12px;color:#58ad73;font-size:10px;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;overflow:hidden;opacity:.82}.module-label:before{content:">> ";color:#82e69c}.module-label:after{content:""}.readout-grid{display:grid;grid-template-columns:1fr;gap:5px;margin:0}.readout-grid div{display:grid;grid-template-columns:minmax(104px,.9fr) 1.15fr;align-items:baseline;min-width:0}.readout-grid dt{margin:0;color:#477b57;font-size:9px;letter-spacing:.05em;text-transform:uppercase}.readout-grid dt:before{content:""}.readout-grid dt:after{content:":";color:#396847}.readout-grid dd{margin:0;color:#83b990;font-size:11px;letter-spacing:.02em;white-space:nowrap}.readout-grid dd:before{content:" "}.readout-grid dd.accent{color:var(--accent)}#context-panel{min-height:220px;padding:clamp(76px,12vh,132px) clamp(2px,1vw,12px) 0;text-align:left}#context-panel[hidden]{display:none}#context-panel .module-label{margin-bottom:31px}.empty-bay{position:relative;min-height:160px;padding:0;border:0;background:none}.empty-bay:before,.empty-bay:after{content:none}.empty-bay>div{width:100%}.empty-bay strong{display:block;color:#69e58c;font-size:clamp(15px,1.15vw,18px);font-weight:400;letter-spacing:.035em;line-height:1.45;text-transform:none;text-shadow:0 0 2px rgba(105,255,145,.75),0 0 9px rgba(47,255,103,.32)}.empty-bay strong:before{content:"CITY://LOCAL> ";color:#3c8051}.empty-bay strong:after{content:" █";color:#65d983;animation:cursor-blink 1.1s steps(1,end) infinite}.empty-bay span{display:block;max-width:460px;margin:22px 0 0;color:#5f9d70;font-size:clamp(12px,.86vw,14px);letter-spacing:.025em;line-height:1.72;white-space:pre-line}#ui-context-choices{max-width:460px;margin:22px 0 0;padding:0;border:0;white-space:pre-line;color:#75bc86;font-size:clamp(11px,.78vw,13px);letter-spacing:.025em;line-height:1.82;text-align:left}#ui-context-choices[hidden]{display:none}#diagnostics{position:absolute;z-index:8;top:12px;left:clamp(2px,1vw,12px);right:auto;width:auto;min-width:250px;border:0;background:transparent;color:#6eaa7d;font-family:var(--terminal-font);box-shadow:none}#diagnostics[open]{width:min(390px,calc(100% - 28px))}#diagnostics summary{padding:7px 0;cursor:pointer;list-style:none;color:#568c65;font-size:10px;letter-spacing:.075em;text-align:left;user-select:none}#diagnostics summary::-webkit-details-marker{display:none}#diagnostics summary:focus{outline:0}#diagnostics summary:focus-visible{color:#71b982;text-shadow:0 0 2px currentColor,0 0 8px rgba(68,255,122,.38)}#diagnostics summary:before{content:"sys@city:~$ ";color:#6fd58a}#diagnostics summary:after{content:" ▒";color:#42744f}#diagnostics[open] summary:before{content:"sys@city:~$ cat "}.diagnostic-body{max-height:min(610px,calc(100vh - 170px));overflow-y:auto;padding:7px 0 18px}.diagnostic-body .module{padding:13px 0 11px;border:0}.diagnostic-body::-webkit-scrollbar{width:4px}.diagnostic-body::-webkit-scrollbar-thumb{background:#244a30}@keyframes cursor-blink{50%{color:transparent;text-shadow:none}}@media(max-width:980px){body{overflow:auto}#app{width:min(calc(100% - 28px),820px);min-height:auto;padding:42px 0 28px;grid-template-columns:1fr;align-items:start}#interface{height:620px;min-height:620px;max-height:620px}}@media(max-width:620px){#app{width:calc(100% - 16px);padding-top:28px;gap:14px}#interface{height:560px;min-height:560px;max-height:560px;padding-left:18px;padding-right:18px}}