:root{--magenta: #e20074;--magenta-dark: #b0005a;--ink: #1a1a2e;--ink-soft: #d9d9e3;--font: "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif}*{box-sizing:border-box}html,body{margin:0;padding:0;width:100%;height:100%;overflow:hidden;background:var(--ink);overscroll-behavior:none;font-family:var(--font);-webkit-user-select:none;user-select:none}#scene{position:fixed;inset:0}#scene canvas{display:block;touch-action:none}#ui{position:fixed;inset:0;pointer-events:none;z-index:10}#ui>*{pointer-events:auto}.btn{display:block;border:0;border-radius:13px;background:var(--magenta);color:#fff;font-family:var(--font);font-size:19px;font-weight:700;padding:14px 22px;min-height:48px;cursor:pointer;transition:transform .08s ease,background .12s ease;touch-action:manipulation}.btn:hover{transform:scale(1.03)}.btn:active{transform:scale(.97)}.btn.btn-disabled{background:#3a3a44;color:var(--ink-soft);cursor:default;transform:none}.btn.btn-small{font-size:16px;padding:10px 16px;min-height:44px}.btn.has-cooldown{position:relative;overflow:hidden}.cd-fill{position:absolute;left:0;right:0;bottom:0;background:#0c0c1ca6;pointer-events:none;border-radius:0 0 13px 13px}.cd-text{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:800;color:#ffd166;text-shadow:0 1px 3px rgba(0,0,0,.7);pointer-events:none}.menu{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:var(--ink);overflow:hidden;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}.menu:before{content:"";position:absolute;inset:-6%;background:url(/assets/big-picture.jpg) center / cover no-repeat;animation:menu-drift 48s ease-in-out infinite alternate;z-index:0}.menu:after{content:"";position:absolute;inset:0;background:#1a1a2ead;z-index:0}.menu>*{position:relative;z-index:1}@keyframes menu-drift{0%{transform:scale(1) translate(0)}to{transform:scale(1.1) translate(-2.5%,1.5%)}}@media(prefers-reduced-motion:reduce){.menu:before{animation:none}}.menu h1{margin:0;color:var(--magenta);font-size:clamp(44px,9vw,68px);text-shadow:0 2px 10px rgba(0,0,0,.55)}.menu .tagline{margin:0 0 26px;color:#fff;font-size:clamp(15px,3.5vw,20px)}.menu .btn{width:min(340px,86vw)}.menu .input-mode{position:absolute;bottom:calc(10px + env(safe-area-inset-bottom));color:var(--ink-soft);font-size:14px}.hud-back{position:absolute;top:calc(12px + env(safe-area-inset-top));left:calc(12px + env(safe-area-inset-left))}.hud-selected{position:absolute;top:calc(14px + env(safe-area-inset-top));right:calc(12px + env(safe-area-inset-right));background:#1a1a2ecc;color:#fff;font-size:16px;padding:7px 12px;border-radius:8px}.hud-resources{position:absolute;top:calc(14px + env(safe-area-inset-top));left:50%;transform:translate(-50%);display:flex;gap:14px;background:#1a1a2ecc;color:#fff;font-size:15px;font-weight:600;padding:8px 14px;border-radius:9px;white-space:nowrap}@media(max-width:560px){.hud-resources{top:calc(66px + env(safe-area-inset-top));font-size:13px;gap:10px;padding:6px 10px}.hud-select-all{bottom:calc(110px + env(safe-area-inset-bottom))}.hud-card{max-width:96vw;flex-wrap:wrap;justify-content:center}}.hud-card{position:absolute;bottom:calc(30px + env(safe-area-inset-bottom));left:50%;transform:translate(-50%);display:none;gap:8px;padding:8px;background:#1a1a2ea6;border-radius:14px}.btn.btn-secondary{background:#34344a}.btn.btn-secondary:hover{background:#40405a}.hud-hint{position:absolute;bottom:calc(6px + env(safe-area-inset-bottom));left:50%;transform:translate(-50%);background:#1a1a2e99;color:var(--ink-soft);font-size:12px;padding:4px 10px;border-radius:6px;white-space:nowrap;max-width:96vw;overflow:hidden;text-overflow:ellipsis}.hud-select-all{position:absolute;left:calc(14px + env(safe-area-inset-left));bottom:calc(26px + env(safe-area-inset-bottom))}.hud-quick{position:absolute;left:calc(14px + env(safe-area-inset-left));top:42%;display:flex;flex-direction:column;gap:6px}.hud-quick .btn{min-width:66px}.hud-toast{position:absolute;bottom:calc(96px + env(safe-area-inset-bottom));left:50%;transform:translate(-50%);background:#c62839eb;color:#fff;font-size:15px;font-weight:600;padding:10px 16px;border-radius:10px;white-space:nowrap;max-width:92vw}.select-box{position:absolute;border:2px solid #fff;background:#e2007424;pointer-events:none}.viewer{position:absolute;inset:0;overflow:hidden;background:#cfe0ea;touch-action:none}.viewer img{position:absolute;top:0;left:0;transform-origin:0 0;will-change:transform;pointer-events:none;-webkit-user-drag:none}.loading{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;background:var(--ink);color:var(--magenta);font-size:34px;font-weight:700}.loading .spinner{width:44px;height:44px;border:5px solid rgba(226,0,116,.25);border-top-color:var(--magenta);border-radius:50%;animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.end-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:#1a1a2ec7;text-align:center;padding:20px}.end-overlay h2{margin:0;color:#fff;font-size:clamp(30px,7vw,46px)}.end-overlay.victory h2{color:#ffd166}.end-overlay p{margin:0 0 18px;color:var(--ink-soft);font-size:17px}.end-overlay .end-stars{color:#ffd166;font-size:clamp(34px,8vw,52px);letter-spacing:.18em;text-shadow:0 2px 12px rgba(255,209,102,.45)}.end-overlay .end-stats{margin:-6px 0 14px;font-size:15px}.hud-production{position:absolute;bottom:calc(104px + env(safe-area-inset-bottom));left:50%;transform:translate(-50%);background:#1a1a2ecc;border-radius:12px;padding:9px 14px;min-width:230px;color:#fff}.prod-label{font-size:14px;font-weight:600;margin-bottom:6px;white-space:nowrap}.prod-track{height:8px;background:#3a3a44;border-radius:4px;overflow:hidden}.prod-fill{height:100%;width:0;background:var(--magenta);border-radius:4px;transition:width .15s linear}.prod-queue{margin-top:6px;display:flex;gap:4px}.prod-queue:empty{display:none}.prod-chip{background:#3a3a44;border-radius:6px;padding:2px 7px;font-size:14px}.hud-objectives{position:absolute;top:calc(70px + env(safe-area-inset-top));left:calc(12px + env(safe-area-inset-left));background:#1a1a2eb8;border-radius:10px;padding:9px 13px;color:#fff;font-size:14px;max-width:300px}.hud-objectives .obj{padding:2px 0}.hud-objectives .obj.done{color:#3ddc6a}.res-upkeep{color:#f3c945}@media(max-width:560px){.hud-objectives{top:calc(112px + env(safe-area-inset-top));left:auto;right:calc(8px + env(safe-area-inset-right));max-width:42vw;font-size:12px;padding:7px 9px}}.interlude{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;background-color:var(--ink);background-image:url(/assets/big-picture.jpg);background-size:220%;background-repeat:no-repeat;padding:24px}.interlude .panel{background:#1a1a2ee0;border-radius:16px;padding:20px 24px;max-width:620px;color:#fff;text-align:center;margin-bottom:calc(16px + env(safe-area-inset-bottom))}.interlude h2{margin:0 0 10px;color:var(--magenta)}.interlude p{margin:0 0 16px;line-height:1.5;color:var(--ink-soft)}.interlude .btn{margin:0 auto}.hud-minimap{position:absolute;right:calc(12px + env(safe-area-inset-right));bottom:calc(12px + env(safe-area-inset-bottom));width:148px;height:148px;border-radius:10px;border:2px solid rgba(255,255,255,.35);background:#1a1a2e;touch-action:none}.hud-sound{position:absolute;top:calc(12px + env(safe-area-inset-top));left:calc(122px + env(safe-area-inset-left));min-width:44px}@media(max-width:560px){.hud-minimap{width:104px;height:104px;bottom:calc(104px + env(safe-area-inset-bottom))}.hud-sound{left:calc(122px + env(safe-area-inset-left))}}.scene-vignette{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at center,transparent 62%,rgba(10,12,30,.16) 100%);z-index:1}.hud-groups{position:absolute;left:calc(14px + env(safe-area-inset-left));bottom:calc(72px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:6px}.hud-group{min-width:40px}@media(max-width:560px){.hud-groups{bottom:calc(156px + env(safe-area-inset-bottom))}}.map-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:4px 0 10px}.map-chip.active{outline:2px solid #e20074;color:#fff}.hud-info{position:absolute;left:calc(14px + env(safe-area-inset-left));bottom:calc(26px + env(safe-area-inset-bottom));display:none;align-items:flex-start;gap:10px;width:268px;padding:10px 12px;background:#1a1a2ecc;border-radius:12px;color:#f4f1ea}.info-portrait{font-size:40px;line-height:1;padding:6px;background:#ffffff12;border-radius:10px}.info-body{flex:1;min-width:0}.info-title{font-weight:700;font-size:15px;margin-bottom:4px}.info-hp-row{display:flex;align-items:center;gap:8px;margin-bottom:5px}.info-hp-track{flex:1;height:8px;background:#00000073;border-radius:4px;overflow:hidden}.info-hp-fill{height:100%;background:#3ddc6a;border-radius:4px}.info-hp-text{font-size:12px;color:var(--ink-soft, #c7cbd4);min-width:52px;text-align:right}.info-lines{font-size:12px;color:var(--ink-soft, #c7cbd4);display:grid;gap:2px}.info-chips{display:none;flex-wrap:wrap;gap:5px;margin-top:6px}.info-chip{display:flex;flex-direction:column;align-items:stretch;gap:2px;padding:3px 5px 4px;font-size:17px;line-height:1;background:#ffffff14;border:1px solid rgba(255,255,255,.12);border-radius:8px;cursor:pointer;color:inherit}.info-chip:active{background:#e2007459}.info-chip-more{justify-content:center;font-size:12px;color:var(--ink-soft, #c7cbd4)}.chip-face{text-align:center}.chip-hp{display:block;height:3px;background:#00000080;border-radius:2px;overflow:hidden}.chip-hp-fill{display:block;height:100%;background:#3ddc6a}#ui:has(.hud-groups) .hud-info{bottom:calc(238px + env(safe-area-inset-bottom))}@media(max-width:560px){.hud-info,#ui:has(.hud-groups) .hud-info{width:200px;padding:8px 10px;bottom:auto;top:calc(112px + env(safe-area-inset-top));left:calc(8px + env(safe-area-inset-left))}.info-portrait{font-size:28px}}#ui.hud-desktop .hud-console{position:absolute;left:0;right:0;bottom:0;display:grid;grid-template-columns:auto minmax(0,auto) 1fr auto;align-items:end;gap:10px;padding:0 12px calc(12px + env(safe-area-inset-bottom));pointer-events:none}#ui.hud-desktop .hud-console>*{pointer-events:none}#ui.hud-desktop .hud-console>*>*{pointer-events:auto}#ui.hud-desktop .console-left{display:flex;align-items:flex-end;gap:8px}#ui.hud-desktop .console-center{display:flex;align-items:flex-end;gap:10px}#ui.hud-desktop .hud-minimap{position:static;width:176px;height:176px}#ui.hud-desktop .hud-quick{position:static;flex-direction:column}#ui.hud-desktop .hud-info{position:static;width:312px;min-height:118px;bottom:auto;left:auto}#ui.hud-desktop .hud-production{position:static;transform:none;min-width:196px;bottom:auto;left:auto}#ui.hud-desktop .hud-card{position:static;transform:none;bottom:auto;left:auto}#ui.hud-desktop .hud-resources{left:auto;right:calc(12px + env(safe-area-inset-right));transform:none}#ui.hud-desktop .hud-hint{bottom:auto;top:calc(18px + env(safe-area-inset-top));left:calc(200px + env(safe-area-inset-left));right:calc(400px + env(safe-area-inset-right));transform:none;max-width:none;width:fit-content;margin:0 auto}#ui.hud-desktop .hud-alerts{left:calc(12px + env(safe-area-inset-left));bottom:calc(212px + env(safe-area-inset-bottom))}#ui.hud-desktop .hud-tip{right:calc(12px + env(safe-area-inset-right));bottom:calc(224px + env(safe-area-inset-bottom))}#ui.hud-desktop .hud-toast{bottom:calc(232px + env(safe-area-inset-bottom))}.hud-card{display:none;grid-template-columns:repeat(4,78px);grid-auto-rows:70px;gap:6px;padding:8px;background:#141426d1;border:1px solid rgba(255,255,255,.08);border-radius:14px}.cmd-tile{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;width:78px;height:70px;padding:10px 4px 4px;border:1px solid rgba(255,255,255,.14);border-radius:10px;background:#2b2b44;color:#fff;font-family:var(--font);cursor:pointer;overflow:hidden;transition:transform .08s ease,filter .12s ease}.cmd-tile.accent{background:var(--magenta);border-color:#ffffff47}.cmd-tile.passive{cursor:default;background:#202036;color:var(--ink-soft)}.cmd-tile.dim{opacity:.5}.cmd-tile:hover:not(.passive){filter:brightness(1.15)}.cmd-tile:active:not(.passive),.cmd-tile.pressed{transform:scale(.95)}.tile-icon{font-size:22px;line-height:1}.tile-label{font-size:10.5px;font-weight:600;line-height:1.1;text-align:center;max-height:2.3em;overflow:hidden}.tile-key{position:absolute;top:2px;left:5px;font-size:10px;font-weight:800;color:#ffd166;text-shadow:0 1px 2px rgba(0,0,0,.8)}.tile-cost{position:absolute;top:2px;right:5px;font-size:9.5px;font-weight:700;color:#cfe6ff;text-shadow:0 1px 2px rgba(0,0,0,.8)}.cmd-tile .cd-fill{border-radius:0 0 10px 10px}@media(max-width:560px){.hud-card{grid-template-columns:repeat(4,62px);grid-auto-rows:58px;gap:5px;padding:6px;max-width:96vw}.cmd-tile{width:62px;height:58px;padding:9px 3px 3px}.tile-icon{font-size:18px}.tile-label{font-size:9px}}.hud-tip{position:absolute;z-index:20;max-width:280px;padding:8px 11px;background:#0e0e1cf5;border:1px solid rgba(255,255,255,.16);border-radius:9px;color:#fff;font-size:12.5px;line-height:1.35;pointer-events:none;box-shadow:0 6px 18px #00000059}.tip-title{font-weight:700;font-size:13.5px;display:flex;align-items:center;gap:8px}.tip-key{font-size:11px;font-weight:800;color:#ffd166;border:1px solid rgba(255,209,102,.5);border-radius:4px;padding:0 5px}.tip-cost{margin-top:3px;color:#cfe6ff;font-weight:600}.tip-body{margin-top:4px;color:var(--ink-soft)}.hud-alerts{position:absolute;left:calc(8px + env(safe-area-inset-left));top:calc(150px + env(safe-area-inset-top));display:flex;flex-direction:column;gap:6px;max-width:min(340px,62vw);pointer-events:none}.hud-alerts .alert{pointer-events:auto;background:#1a1a2ee0;border-left:4px solid #ffd166;color:#fff;font-size:13px;font-weight:600;padding:7px 11px;border-radius:7px;animation:alert-in .22s ease;transition:opacity .55s ease}.hud-alerts .alert.danger{border-left-color:#ff4d4d;background:#46121ee6}.hud-alerts .alert.jump{cursor:pointer}.hud-alerts .alert.jump:hover{filter:brightness(1.2)}.hud-alerts .alert.fade{opacity:0}@keyframes alert-in{0%{transform:translate(-12px);opacity:0}to{transform:none;opacity:1}}.res-clock{color:var(--ink-soft);font-weight:500;font-variant-numeric:tabular-nums}.res-team.blocked{color:#ff7a7a}.res.flash{animation:res-flash .7s ease}@keyframes res-flash{0%,to{color:inherit}25%,75%{color:#ff4d4d}}@media(max-width:560px){.hud-card{left:calc(8px + env(safe-area-inset-left));transform:none;bottom:calc(26px + env(safe-area-inset-bottom))}.hud-minimap{right:calc(8px + env(safe-area-inset-right));bottom:calc(26px + env(safe-area-inset-bottom))}.hud-select-all{bottom:calc(176px + env(safe-area-inset-bottom))}.hud-groups{bottom:calc(230px + env(safe-area-inset-bottom))}.hud-production{left:auto;right:calc(8px + env(safe-area-inset-right));transform:none;bottom:calc(176px + env(safe-area-inset-bottom));min-width:170px}.hud-toast{bottom:calc(196px + env(safe-area-inset-bottom))}.hud-alerts{left:auto;right:calc(8px + env(safe-area-inset-right));top:42%;max-width:56vw}}.hud-macro{position:absolute;top:calc(56px + env(safe-area-inset-top));left:50%;transform:translate(-50%);display:flex;gap:6px;padding:5px;background:#141426b8;border:1px solid rgba(255,255,255,.08);border-radius:12px}.macro-chip{position:relative;display:flex;align-items:center;gap:5px;min-width:64px;height:40px;padding:0 9px 6px;border:1px solid rgba(255,255,255,.14);border-radius:9px;background:#2b2b44;color:#fff;font-family:var(--font);font-size:14px;cursor:pointer;overflow:hidden}.macro-chip:hover{filter:brightness(1.15)}.macro-chip.selected{border-color:var(--magenta);box-shadow:0 0 0 1px var(--magenta) inset}.macro-chip.idle{border-color:#f3c945b3}.macro-icon{font-size:18px}.macro-current{font-size:15px}.macro-count{font-size:11px;font-weight:700;color:#cfe6ff}.macro-idle{font-size:10px;font-weight:800;letter-spacing:.04em;color:#f3c945;text-transform:uppercase}.macro-track{position:absolute;left:0;right:0;bottom:0;height:4px;background:#ffffff1a}.macro-fill{display:block;height:100%;width:0;background:var(--magenta);transition:width .15s linear}.score-panel{display:flex;flex-direction:column;align-items:center;gap:10px;margin:0 0 16px;max-width:96vw}.score-head{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;color:var(--ink-soft);font-size:14px}.score-legend{display:flex;gap:12px}.score-swatch{display:inline-flex;align-items:center;gap:6px;color:#fff;font-weight:600}.score-dot{width:10px;height:10px;border-radius:50%;display:inline-block}.score-charts{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}.score-chart{background:#141426b3;border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:8px 10px 6px}.score-title{color:#fff;font-size:13px;font-weight:700;margin-bottom:4px;text-align:left}@media(max-width:560px){.score-chart canvas{width:82vw!important;height:80px!important}}.loading-tip{max-width:min(560px,86vw);color:var(--ink-soft);font-size:15px;font-weight:400;line-height:1.45;text-align:center}.hud-pause{position:absolute;top:calc(12px + env(safe-area-inset-top));left:calc(176px + env(safe-area-inset-left));min-width:44px}.hud-speed{position:absolute;top:calc(12px + env(safe-area-inset-top));left:calc(230px + env(safe-area-inset-left));min-width:52px}.hud-paused{position:absolute;top:38%;left:50%;transform:translate(-50%,-50%);padding:10px 26px;border-radius:12px;background:#141426d1;border:1px solid rgba(255,255,255,.14);color:#fff;font-size:24px;font-weight:800;letter-spacing:.12em;pointer-events:none}#ui.hud-desktop .hud-hint{left:calc(300px + env(safe-area-inset-left))}@media(max-width:560px){.hud-pause{top:calc(64px + env(safe-area-inset-top));left:calc(8px + env(safe-area-inset-left))}.hud-speed{top:calc(64px + env(safe-area-inset-top));left:calc(60px + env(safe-area-inset-left))}}
