:root{color-scheme:dark;--bg:#080f1d;--panel:#101e2ce8;--line:#92b8cb26;--ink:#eaf2f3;--muted:#8cabb9;--cyan:#8be4df;--violet:#bfaff0;--gold:#f0c17a;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink)}[hidden]{display:none!important}button,select{font:inherit;color:inherit}button,a,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer;border:1px solid var(--line);background:#18303e77;border-radius:5px;padding:10px 14px;min-height:42px}button:hover:not(:disabled){border-color:#8be4df85;background:#24506377}button:disabled{opacity:.36;cursor:not-allowed}button:focus-visible,a:focus-visible,canvas:focus-visible,select:focus-visible{outline:2px solid var(--cyan);outline-offset:4px}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline}i{font-style:normal}.primary{background:var(--cyan);border:0;color:#0c262e;font-size:12px;letter-spacing:.2px;font-weight:750;display:flex;justify-content:space-between;align-items:center;gap:15px;min-height:50px;width:100%}.primary:hover:not(:disabled){background:#b3f5ef;border-color:transparent}.primary span{font-size:20px}button:active:not(:disabled){transform:translateY(1px)}.lobby{min-height:100svh;position:relative;isolation:isolate;background:#080f1d;overflow:hidden}.lobby-art{position:absolute;inset:0;background:linear-gradient(90deg,#070e1cea 0%,#080f1dcc 22%,#080f1d35 62%,#080f1d05),linear-gradient(0deg,#080f1ded,transparent 30%),url('./assets/city-2057.webp') center/cover;z-index:-1}.lobby-header{padding:32px 5vw;display:flex;justify-content:space-between;align-items:center}.brand{font-size:28px;letter-spacing:-1.4px;font-weight:800}.brand>span{color:var(--cyan)}.brand small{font-size:8px;letter-spacing:2.4px;margin-left:24px;font-weight:500;color:#b7c7cc}.edition{font-size:9px;letter-spacing:2px;color:#b4c6ce}.lobby-main{padding:38px 7vw 25px;max-width:720px}.eyebrow{font-size:9px;letter-spacing:2.1px;font-weight:700;color:var(--cyan);margin:0 0 18px}.eyebrow i,.live-dot{width:5px;height:5px;background:var(--cyan);display:inline-block;margin-right:8px;border-radius:50%;box-shadow:0 0 10px #8be4df88}h1{font-size:clamp(54px,7vw,94px);font-weight:850;line-height:.98;letter-spacing:-4px;margin:0;color:#f0f6f6}h1>span{font-weight:350;letter-spacing:5px;font-size:.86em;color:#cbdcde}h1>small{display:block;font-size:17px;letter-spacing:17px;font-weight:400;color:var(--cyan);margin-top:23px}.intro-line{width:64px;height:1px;background:#8be4df88;margin:27px 0 20px}.lobby-copy{font-size:13px;color:#b1c4ce;line-height:1.85}.launch-card{max-width:330px;border-top:1px solid var(--line);padding-top:19px;margin-top:24px}.operation{display:grid;gap:5px}.operation>span{font-size:8px;letter-spacing:2px;color:var(--cyan)}.operation strong{font-size:18px;letter-spacing:-.3px}.operation small{font-size:10px;color:var(--muted)}.difficulty-label{display:block;font-size:9px;color:var(--muted);margin:18px 0 6px}select{width:100%;height:40px;border:1px solid #819caf40;border-radius:4px;padding:0 10px;background:#12202ecc;font-size:11px}.launch-card button{margin-top:12px}.launch-card p{font-size:9px;color:#91a5b3;line-height:1.7;margin:12px 0 0}.launch-card .secondary{background:#172a39b3;border:1px solid var(--line);color:var(--ink)}.lobby-footer{display:flex;justify-content:space-between;align-items:center;padding:24px 5vw 32px;gap:20px;color:#899eaf;font-size:10px}.lobby-footer>div{display:flex;gap:26px}.lobby-footer strong{font-size:8px;letter-spacing:2px;margin-left:7px;font-weight:500;color:#bbcbd4}.lobby-footer a{font-size:10px}.game{height:100svh;display:flex;flex-direction:column;overflow:hidden}.game-header{height:76px;flex:none;display:flex;align-items:center;gap:26px;padding:0 23px;background:#0c1725;border-bottom:1px solid #829bab2d;z-index:3}.game-logo{background:transparent;border:0;min-width:60px;font-size:24px;font-weight:850;letter-spacing:-3px;padding:0}.game-logo>span{color:var(--cyan)}.game-logo small{font-size:7px;display:block;letter-spacing:3px;font-weight:450;margin-top:2px}.resources{display:flex;gap:34px;flex:1}.resources>div{display:flex;gap:10px;align-items:center}.resources i{font-size:27px}.resources small{display:block;font-size:9px;color:var(--muted);margin-bottom:4px}.resources b{font-size:17px;letter-spacing:.1px;font-variant-numeric:tabular-nums}.data{color:var(--cyan)}.silicon{color:var(--violet)}.energy{color:var(--gold)}.population{color:#adc6d7}.era{display:flex;gap:12px;align-items:center;border-left:1px solid var(--line);padding-left:22px}.era>span{color:var(--gold);font-family:Georgia,serif;font-size:32px}.era small{font-size:8px;letter-spacing:1px;color:var(--muted);display:block;margin-bottom:4px}.era b{font-size:11px;font-weight:500;font-variant-numeric:tabular-nums}.header-actions{display:flex;gap:6px}.header-actions button{min-width:34px;min-height:34px;padding:6px 10px;font-size:10px}.battlefield{position:relative;flex:1;min-height:280px;background:#112235;overflow:hidden}.battlefield>canvas{width:100%;height:100%;display:block;touch-action:none;outline-offset:-3px}.map-caption{position:absolute;left:24px;top:20px;font-size:9px;letter-spacing:1.8px;pointer-events:none;color:#b8d0d8;text-shadow:0 1px 4px #000}.map-caption small{display:block;font-size:7px;letter-spacing:1.8px;margin:6px 0 0 13px;color:#7a9cab}.mission{position:absolute;top:76px;left:22px;width:220px;padding:17px;background:linear-gradient(120deg,#102132ec,#152b39c9);border:1px solid #a7c7d529;border-left:2px solid var(--cyan);border-radius:3px;backdrop-filter:blur(8px)}.mission .eyebrow{font-size:7px;letter-spacing:1.5px;margin:0 0 10px}.mission h2{font-size:15px;font-weight:650;line-height:1.35;margin:0 0 8px}.mission>p:not(.eyebrow){font-size:10px;line-height:1.6;color:#adc2cc;margin:0}.mission-progress{height:2px;background:#8db6c123;margin-top:13px}.mission-progress>span{display:block;height:100%;background:var(--cyan);transition:width .5s}.mission button{padding:8px 0 0;border:0;background:transparent;min-height:27px;font-size:9px;color:var(--cyan);text-align:left}.camera-controls{position:absolute;right:20px;top:20px;display:flex;gap:6px}.camera-controls button{background:#0d2030db;backdrop-filter:blur(8px);padding:0;width:34px;height:34px;min-height:34px;font-size:19px}.map-panel{position:absolute;bottom:18px;right:20px;width:175px;background:#0b1929ed;border:1px solid #7c9faf44;padding:7px;box-shadow:0 6px 24px #0003;border-radius:3px}.map-panel-label{display:flex;justify-content:space-between;color:#adbac8;font-size:6px;letter-spacing:1.2px;margin-bottom:7px}.map-panel canvas{width:159px;height:145px;display:block;cursor:crosshair;touch-action:none}.map-legend{display:flex;justify-content:space-between;font-size:6px;letter-spacing:.7px;margin-top:7px;color:#9cafbb}.map-legend i{display:inline-block;background:var(--cyan);width:4px;height:4px;margin-right:4px}.map-legend span:last-child i{background:#fa7894}.quick-select{position:absolute;left:22px;bottom:18px;display:flex;gap:6px}.quick-select button{font-size:9px;min-height:34px;background:#0c1c2bec;padding:6px 12px}.quick-select kbd{font-family:inherit;font-size:7px;color:#a0b8c6;border:1px solid #93b6c536;border-radius:2px;margin-left:9px;padding:2px 4px}.command-deck{display:grid;grid-template-columns:265px 1fr;flex:none;min-height:187px;background:#0c1827;border-top:1px solid #7894a34a;padding:17px 22px;gap:24px;z-index:3}.selection{border-right:1px solid var(--line);padding-right:23px}.panel-label{font-size:7px;letter-spacing:1.7px;color:var(--cyan)}.selection h2{font-size:18px;letter-spacing:-.3px;margin:9px 0 7px}.selection>p{font-size:10px;line-height:1.55;color:#92acba;margin:0;max-width:235px}.health{height:3px;background:#7fa5b026;margin:10px 0 0;max-width:210px}.health>span{display:block;height:3px;background:var(--cyan);transition:width .2s}.selection .queue-status{font-size:9px;color:var(--gold);margin-top:6px}.commands{min-width:0}.command-tabs{display:flex;gap:17px;align-items:center;border-bottom:1px solid var(--line);margin-top:-5px;margin-bottom:12px}.command-tabs>button{font-size:10px;border:0;border-bottom:2px solid transparent;border-radius:0;padding:8px 0;min-height:33px;background:transparent;color:#839dab}.command-tabs>button.active{border-color:var(--cyan);color:#dfefee}.command-tabs>span{font-size:8px;color:#75929f;margin-left:auto}.actions{display:flex;gap:8px;overflow-x:auto;padding-bottom:5px;scrollbar-width:thin;scrollbar-color:#3d6074 transparent;min-height:100px}.action{position:relative;text-align:left;padding:10px 12px;min-width:126px;max-width:150px;min-height:97px;background:#17293877;display:flex;flex-direction:column;gap:5px;flex-shrink:0;border-color:#7f9eae29}.action.active{border-color:var(--cyan);background:#25475666}.action .action-icon{font-size:21px;font-weight:400;color:var(--cyan);height:26px}.action strong{font-size:10px;font-weight:600}.action small{font-size:8px;color:#94acba;line-height:1.5}.action .cost{color:var(--gold);font-size:8px;line-height:1.5;margin-top:auto}.empty-actions{font-size:11px;color:var(--muted);line-height:1.8;padding-top:10px}.build-hint{position:absolute;left:50%;top:20px;transform:translateX(-50%);display:flex;align-items:center;gap:14px;padding:8px 9px 8px 15px;background:#152e3eef;border:1px solid #91e7df88;border-radius:4px;font-size:11px;max-width:55%}.build-hint button{min-height:30px;font-size:9px;padding:6px 10px}.paused-banner{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:14px;background:#06112266;backdrop-filter:blur(2px);z-index:5}.paused-banner span{letter-spacing:4px;font-size:12px;color:#d9e8ef}.paused-banner button{background:#0f273bec;color:var(--cyan)}.toast{position:fixed;bottom:215px;left:50%;transform:translate(-50%,10px);opacity:0;pointer-events:none;z-index:10;max-width:calc(100% - 30px);width:max-content;background:#cfebee;color:#112b35;border:1px solid #e3ffff;padding:11px 18px;border-radius:5px;box-shadow:0 5px 30px #0006;font-size:11px;transition:.2s}.toast.visible{opacity:1;transform:translate(-50%,0)}dialog{background:#101f30;color:var(--ink);border:1px solid #7195aa66;border-radius:8px;max-width:580px;width:calc(100% - 32px);max-height:calc(100svh - 32px);padding:30px;box-shadow:0 30px 100px #0008}dialog::backdrop{background:#030b17c9;backdrop-filter:blur(7px)}dialog h2{font-size:28px;letter-spacing:-.8px;margin:0 0 14px}dialog p,dialog li{font-size:12px;color:#aec2ce;line-height:1.8}dialog ol{padding-left:18px}dialog li{padding-left:5px;margin-bottom:13px}dialog li strong{color:var(--cyan)}dialog .help-controls{font-size:10px;border-top:1px solid var(--line);padding-top:15px}dialog .help-note{font-size:10px;color:var(--muted)}dialog .primary{margin-top:20px}#menu-dialog{max-width:370px}#menu-dialog>button{width:100%;margin-bottom:12px}#menu-dialog>a{display:block;text-align:center;font-size:11px;color:var(--muted);padding:10px}.dialog-actions{display:flex;gap:12px;align-items:center}.dialog-actions .primary{margin:0;width:auto}.noscript{position:fixed;top:30%;left:15%;right:15%;padding:30px;background:#152b40;border:1px solid var(--line);z-index:30}
@media(min-height:920px){.lobby-main{padding-top:65px;padding-bottom:50px}}
@media(max-width:1100px){.game-header{gap:17px;padding:0 16px}.resources{gap:20px}.era{padding-left:16px}.command-deck{grid-template-columns:225px 1fr;gap:18px;padding:14px 17px}.selection{padding-right:18px}.selection h2{font-size:16px}.mission{width:195px;left:17px;padding:14px}.quick-select{left:17px}.header-actions button:first-child{display:none}.resources b{font-size:15px}.era small{font-size:7px}.action{min-width:116px;padding:9px}.edition{font-size:8px}}
@media(max-width:760px){.lobby-art{background-position:62% center;background-image:linear-gradient(90deg,#070e1ceb,#080f1d66),linear-gradient(0deg,#080f1d,transparent 50%),url('./assets/city-2057.webp')}.lobby-header{padding:24px}.brand small{font-size:7px;margin-left:18px}.edition{display:none}.lobby-main{padding:38px 27px 28px}h1{font-size:66px;letter-spacing:-3px}h1>span{letter-spacing:2px}.lobby-copy{font-size:12px}.lobby-footer{padding:20px 27px;align-items:start;flex-direction:column;gap:20px}.lobby-footer>div{gap:15px}.lobby-footer strong{font-size:7px;letter-spacing:1px}.game-header{height:66px;padding:0 10px;gap:10px}.game-logo{font-size:19px;min-width:31px;letter-spacing:-2px}.game-logo small{font-size:5px}.resources{gap:12px;justify-content:space-around}.resources>div{gap:5px}.resources i{font-size:19px}.resources small{font-size:7px;margin-bottom:3px}.resources b{font-size:12px}.era{display:none}.header-actions{gap:4px}.header-actions button{min-width:30px;min-height:32px;padding:5px 7px;font-size:12px}.header-actions button:first-child{display:none}.battlefield{min-height:240px}.map-caption{font-size:7px;left:14px;top:15px;letter-spacing:1px}.map-caption small{display:none}.mission{top:44px;left:12px;width:172px;padding:11px}.mission .eyebrow{font-size:6px;letter-spacing:1.1px;margin-bottom:7px}.mission h2{font-size:12px;margin-bottom:5px}.mission>p:not(.eyebrow){font-size:9px;line-height:1.5}.mission-progress{margin-top:8px}.mission button{font-size:8px;padding-top:6px;min-height:22px}.camera-controls{right:12px;top:12px;gap:4px}.camera-controls button{width:30px;height:30px;min-height:30px;font-size:17px}.map-panel{width:108px;right:12px;bottom:12px;padding:5px}.map-panel canvas{width:96px;height:86px}.map-panel-label{font-size:5px;letter-spacing:.5px;margin-bottom:5px}.map-legend{font-size:5px;letter-spacing:0;margin-top:5px}.quick-select{left:12px;bottom:12px;gap:4px;max-width:calc(100% - 136px);flex-wrap:wrap}.quick-select button{font-size:8px;padding:6px 9px;min-height:30px}.quick-select kbd{display:none}.command-deck{display:flex;flex-direction:column;gap:9px;padding:10px 12px;min-height:207px}.selection{padding:0;border:0;display:grid;grid-template-columns:1fr auto;gap:4px 12px}.selection .panel-label{font-size:6px;grid-row:1;grid-column:1}.selection h2{font-size:14px;grid-row:2;margin:0}.selection>p:not(.queue-status){display:none}.selection .health{grid-column:2;grid-row:1 / span 2;width:95px;align-self:center;margin:0}.selection .queue-status{grid-column:1 / span 2;font-size:8px;margin:0;min-height:0}.command-tabs{gap:20px;margin-top:0;margin-bottom:9px}.command-tabs>button{font-size:9px;min-height:28px;padding:5px 0}.command-tabs>span{font-size:6px}.actions{min-height:94px;gap:7px}.action{min-width:110px;max-width:127px;min-height:91px;padding:8px 10px;gap:4px}.action strong{font-size:9px}.action small,.action .cost{font-size:7px}.action .action-icon{font-size:19px;height:22px}.toast{bottom:237px;font-size:10px;padding:10px 14px}.build-hint{top:12px;left:12px;transform:none;max-width:calc(100% - 132px);font-size:10px;padding:7px 9px;gap:8px;z-index:3}.build-hint button{font-size:8px;padding:5px;min-height:28px}.build-hint:not([hidden])~.mission{display:none}dialog{padding:24px}dialog h2{font-size:24px}dialog li{font-size:11px}}
@media(max-width:390px){.resources{gap:6px}.resources i{display:none}.game-header{gap:7px}.header-actions button{min-width:27px;padding:5px}.mission{width:150px}.mission>p:not(.eyebrow){font-size:8px}.quick-select{max-width:190px}.map-panel{width:93px}.map-panel canvas{width:81px;height:77px}.command-tabs{gap:14px}}
@media(max-height:550px) and (orientation:landscape){.game-header{height:48px}.command-deck{min-height:130px;display:grid;grid-template-columns:180px 1fr;padding:7px 12px;gap:12px}.selection{display:block}.selection h2{font-size:13px;margin:7px 0}.selection .health{width:120px}.selection .queue-status{font-size:8px;margin-top:8px}.command-tabs{margin-bottom:6px}.actions{min-height:73px}.action{min-height:73px;padding:6px 9px;min-width:115px}.action .action-icon{display:none}.battlefield{min-height:160px}.mission{top:40px;padding:9px}.mission>p:not(.eyebrow),.mission-progress,.mission button{display:none}.mission h2{font-size:10px}.map-panel{width:105px;padding:4px;bottom:8px}.map-panel canvas{width:95px;height:78px}.map-panel-label,.map-legend{display:none}.quick-select{bottom:9px}.toast{bottom:150px}.map-caption{top:12px}.camera-controls{top:9px}.lobby{min-height:100vh}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important}}

h1>span>em{font-style:normal;font-size:.35em;letter-spacing:2px;vertical-align:middle;color:var(--cyan)}
