:root{--bg:#070b16;--panel:#0a1020d1;--panel-edge:#78c8ff38;--text:#e8eef8;--muted:#9fb0c8;--accent:#57e3ff;--amber:#ffc34d;--red:#ff4d6d;--green:#39ff6a;--radius:14px}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--text);margin:0;overflow:hidden}body{-webkit-font-smoothing:antialiased;-webkit-user-select:none;user-select:none;font-family:Inter,system-ui,sans-serif}canvas{display:block;position:fixed;inset:0}#hud{transform-origin:0 0;pointer-events:none;width:1920px;height:1200px;position:fixed;top:0;left:0}#hud>*{pointer-events:auto}h1,h2,h3,.display{letter-spacing:.02em;font-family:Oswald,Arial Narrow,sans-serif}.panel{background:var(--panel);border:1px solid var(--panel-edge);border-radius:var(--radius);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);position:absolute;box-shadow:0 10px 40px #00000073}.left{flex-direction:column;gap:18px;width:580px;padding:28px;display:flex;top:40px;bottom:40px;left:40px}.left .brand{text-transform:uppercase;color:#fff;text-shadow:0 0 24px #ff3c648c;font-family:Oswald;font-size:40px;font-weight:700;line-height:1}.left .round{color:var(--muted);text-transform:uppercase;font-family:Oswald;font-size:22px}.left .phase{color:var(--accent);text-transform:uppercase;font-family:Oswald;font-size:36px}.left .help{color:var(--text);font-size:19px;line-height:1.5}.left .help small{color:var(--amber);margin-top:8px;font-size:16px;display:block}.city-card{background:#ffffff0d;border-radius:12px;align-items:center;gap:16px;padding:14px;display:flex}.city-card img{object-fit:cover;object-position:top;border-radius:10px;width:86px;height:110px}.city-card .name{font-family:Oswald;font-size:22px}.city-card .ability{color:var(--muted);font-size:15px;line-height:1.4}.log{color:var(--muted);flex-direction:column-reverse;flex:1;gap:6px;font-size:15px;display:flex;overflow:hidden;-webkit-mask-image:linear-gradient(#0000,#000 40%);mask-image:linear-gradient(#0000,#000 40%)}.log div{border-left:3px solid var(--panel-edge);padding:6px 10px}.log .bad{border-color:var(--red);color:#ffc0c8}.log .good{border-color:var(--green);color:#c8ffd4}.right{flex-direction:column;gap:14px;width:520px;padding:28px;display:flex;top:40px;right:40px}.settings-panel{width:520px;padding:16px 20px;bottom:40px;right:40px}.tray-title{text-align:center;letter-spacing:.1em;text-transform:uppercase;width:520px;color:var(--muted);font-family:Oswald;font-size:18px;position:absolute;top:760px;right:40px;pointer-events:none!important}.stats{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}.stat{background:#ffffff0d;border-radius:12px;padding:10px 12px}.stat .k{color:var(--muted);text-transform:uppercase;letter-spacing:.06em;font-size:13px}.stat .v{font-family:Oswald;font-size:30px}.stat.energy .v{color:#ffe14d}.stat.damage .v{color:#ff6d9a}.stat.research .v{color:var(--green)}.actions{flex-direction:column;gap:10px;margin-top:6px;display:flex}.row{flex-wrap:wrap;gap:10px;display:flex}.settings{flex-wrap:wrap;align-items:center;gap:8px;display:flex}button,select{font:inherit}.btn{cursor:pointer;color:var(--text);letter-spacing:.03em;background:#ffffff12;border:1px solid #ffffff2e;border-radius:12px;padding:12px 18px;font-family:Oswald;font-size:20px;transition:transform 80ms,background .15s,opacity .15s}.btn:hover:not(:disabled){background:#ffffff24}.btn:active:not(:disabled){transform:translateY(1px)}.btn:disabled{opacity:.35;cursor:not-allowed}.btn.primary{color:#fff;background:linear-gradient(#f57,#c51d4a);border-color:#ff8aa2;box-shadow:0 6px 24px #ff3c6459}.btn.go{background:linear-gradient(#2fd2ff,#0f7fb3);border-color:#9ae9ff}.btn.small{padding:8px 12px;font-size:16px}.btn.toggle.off{opacity:.5;text-decoration:line-through}select.btn{appearance:none;padding-right:18px}.toast-wrap{flex-direction:column;align-items:center;gap:8px;display:flex;position:absolute;top:24px;left:50%;transform:translate(-50%);pointer-events:none!important}.toast{border:1px solid var(--panel-edge);white-space:nowrap;background:#080c18eb;border-radius:999px;padding:12px 22px;font-family:Oswald;font-size:22px;animation:2.6s forwards toast}.toast.bad{border-color:var(--red);color:#ffd0d8}.toast.good{border-color:var(--green);color:#d4ffe0}@keyframes toast{0%{opacity:0;transform:translateY(-10px)}10%,80%{opacity:1;transform:none}to{opacity:0}}.banner{text-align:center;text-transform:uppercase;color:#fff;text-shadow:0 0 40px #57e3ffcc,0 6px #00000080;font-family:Oswald;font-size:84px;font-weight:700;animation:1.3s forwards banner;position:absolute;top:520px;left:0;right:0;pointer-events:none!important}@keyframes banner{0%{opacity:0;transform:scale(1.3)}20%{opacity:1;transform:scale(1)}75%{opacity:1}to{opacity:0;transform:scale(.96)}}.popup{z-index:5;flex-direction:column;gap:10px;width:360px;padding:18px;display:flex;position:absolute}.popup h3{margin:0;font-size:26px}.popup p{color:var(--muted);margin:0;font-size:16px;line-height:1.4}.popup .meta{gap:16px;font-family:Oswald;font-size:20px;display:flex}.popup .err{color:#ffb0bc;font-size:15px}.modal-bg{z-index:10;background:#02040ab3;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.modal{width:900px;max-height:1000px;padding:36px 44px;overflow:auto}.modal h2{margin:0 0 12px;font-size:44px}.modal h3{color:var(--accent);margin:22px 0 6px;font-size:24px}.modal p,.modal li{color:#d7e0ee;font-size:18px;line-height:1.55}.modal .btn{margin-top:16px}.over h2.win{color:var(--green)}.over h2.lose{color:var(--red)}.over{text-align:center;width:720px}.over img{border-radius:14px;width:240px;margin:10px auto;display:block}.title{z-index:8;background-position:50%;background-size:cover;justify-content:space-between;align-items:flex-end;padding:70px 90px;display:flex;position:absolute;inset:0}.title:before{content:"";background:linear-gradient(#070b161a 30%,#070b16eb 85%);position:absolute;inset:0}.title>*{position:relative}.title .logo h1{text-transform:uppercase;color:#fff;text-shadow:0 0 50px #ff3c6499,0 8px #0009;margin:0;font-size:130px;line-height:.92}.title .logo p{color:#d5def0;max-width:900px;margin:18px 0 0;font-size:28px}.title .setup{flex-direction:column;gap:18px;width:560px;padding:30px;display:flex;position:relative}.field label{color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:8px;font-family:Oswald;font-size:18px;display:block}.field .hint{color:var(--muted);margin-top:6px;font-size:14px}.chips{flex-wrap:wrap;gap:8px;display:flex}.chip{cursor:pointer;color:var(--text);background:#ffffff0d;border:1px solid #ffffff29;border-radius:10px;padding:10px 16px;font-family:Oswald;font-size:20px}.chip.on{border-color:var(--accent);background:#57e3ff2e}.check{cursor:pointer;align-items:center;gap:10px;font-size:18px;display:flex}.check input{accent-color:#f57;width:22px;height:22px}.loading{color:var(--muted);justify-content:center;align-items:center;font-family:Oswald;font-size:28px;display:flex;position:fixed;inset:0}body.portrait #hud{height:1900px}body.portrait .left{gap:8px;width:940px;height:240px;padding:18px 22px;top:1560px;bottom:auto;left:490px}body.portrait .left .brand,body.portrait .left .round,body.portrait .city-card,body.portrait .log{display:none}body.portrait .left .phase{font-size:30px}body.portrait .left .help{font-size:18px}body.portrait .right{width:940px;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;background:0 0;border:0;flex-direction:row;padding:12px;top:1215px;left:490px;right:auto}body.portrait .right .stats{flex:1}body.portrait .right .actions{flex-flow:wrap;justify-content:center;width:940px;margin:0;position:absolute;top:225px;left:0}body.portrait .settings-panel{width:940px;inset:1815px auto auto 490px}body.portrait .tray-title{display:none}body.portrait .title{flex-direction:column;justify-content:flex-end;gap:30px;width:960px;height:1900px;padding:50px 40px;left:480px}body.portrait .title .logo h1{font-size:110px}body.portrait .title .setup{width:100%}body.portrait .popup{width:420px}body.portrait .modal{width:900px}body.portrait .modal-bg{width:960px;height:1900px;left:480px}body.portrait .banner{width:960px;top:560px;left:480px}body.portrait .toast-wrap{left:960px}