:root{--bg: #070b14;--panel: rgba(17, 24, 39, .72);--panel-solid: #111827;--panel-2: #1a2332;--border: #263248;--border-soft: rgba(148, 163, 184, .16);--text: #e2e8f0;--text-dim: #94a3b8;--accent: #38bdf8;--accent-2: #a78bfa;--ok: #4ade80;--bad: #f87171;--warn: #fbbf24;--credits: #fde68a;--radius: 12px;--shadow-lg: 0 16px 48px rgba(0, 0, 0, .55);--shadow-glow: 0 0 0 1px rgba(56, 189, 248, .35), 0 8px 28px rgba(56, 189, 248, .18)}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{background:radial-gradient(ellipse at 50% -20%,#16223a 0%,transparent 55%),radial-gradient(ellipse at 80% 110%,rgba(167,139,250,.12) 0%,transparent 50%),var(--bg);color:var(--text);font-family:PingFang SC,Microsoft YaHei,system-ui,sans-serif;overflow:hidden}#app{height:100vh;height:100dvh;display:grid;grid-template-columns:272px minmax(0,1fr) 252px;grid-template-rows:minmax(0,1fr);gap:12px;padding:12px;--canvas-fit-w: min( calc((100dvh - 24px)*1.5) , 1920px);max-width:min(100vw,calc(var(--canvas-fit-w) + 572px));margin:0 auto}.side{display:flex;flex-direction:column;gap:12px;min-height:0;overflow-y:auto;overscroll-behavior:contain}.side::-webkit-scrollbar{width:6px}.side::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}.side-block{display:flex;flex-direction:column;gap:8px}.side-title{font-size:11px;letter-spacing:2px;color:var(--text-dim)}.side-foot{margin-top:auto;padding-top:4px}.stage-tip{font-size:11px;color:var(--text-dim);line-height:1.6}.brand{display:flex;align-items:center;gap:10px}.brand-logo{width:38px;height:38px;filter:drop-shadow(0 0 10px rgba(56,189,248,.45))}.brand-text{display:flex;flex-direction:column;line-height:1.3}.brand-text strong{font-size:15px;letter-spacing:1px;background:linear-gradient(90deg,var(--accent),var(--accent-2));-webkit-background-clip:text;background-clip:text;color:transparent}.brand-text .en{font-size:11px;letter-spacing:1px;color:var(--text-dim)}.game-stage{position:relative;min-height:0;min-width:0;display:flex;align-items:center;justify-content:center}#hud{display:flex;flex-direction:column;gap:10px}.level-picker{display:flex;align-items:center;gap:6px}.level-chip{width:28px;height:28px;border-radius:8px;background:var(--panel);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid var(--border-soft);color:var(--text-dim);font-size:12px;font-variant-numeric:tabular-nums;cursor:pointer;transition:transform .18s,border-color .18s,color .18s,background .18s}.level-chip:hover:not(:disabled){border-color:var(--accent);color:var(--text);transform:translateY(-1px)}.level-chip.cleared{color:var(--ok);border-color:#4ade8066}.level-chip.active{background:#38bdf829;border-color:var(--accent);color:var(--accent);box-shadow:0 0 12px #38bdf840}.level-chip.locked{opacity:.35;cursor:not-allowed}.hud-card{display:flex;flex-direction:column;gap:8px;background:var(--panel);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--border-soft);border-radius:var(--radius);padding:12px;box-shadow:0 8px 28px #00000059}.stat-row{display:flex;align-items:center;justify-content:space-between;gap:8px}.stat-block{display:flex;flex-direction:column;gap:5px}.stat-label{font-size:11px;color:var(--text-dim);white-space:nowrap}.stat-value{display:flex;align-items:center;gap:8px;font-size:12px;font-variant-numeric:tabular-nums}.stat-value b{font-size:14px;color:var(--bad)}.hud-level{display:flex;flex-direction:column;gap:2px;padding-bottom:8px;border-bottom:1px solid var(--border-soft)}.hud-level{display:flex;flex-direction:column;gap:1px;min-width:132px}.hud-level-name{font-size:13px;font-weight:700;letter-spacing:.5px;color:var(--text)}.hud-level-goal{font-size:11px;color:var(--text-dim)}.hud-sep{width:1px;height:26px;background:var(--border-soft)}.hud-credits{color:var(--credits);font-weight:700;font-size:16px;min-width:78px;font-variant-numeric:tabular-nums;text-shadow:0 0 12px rgba(253,230,138,.35)}.hud-wave{display:flex;align-items:center;gap:8px;color:var(--text-dim);font-size:13px}.hud-wave-dots{display:flex;gap:4px}.wave-dot{width:8px;height:8px;border-radius:50%;background:var(--panel-2);border:1px solid var(--border-soft);transition:all .25s}.wave-dot.done{background:var(--ok);border-color:var(--ok);box-shadow:0 0 8px #4ade8080}.wave-dot.current{background:var(--accent);border-color:var(--accent);box-shadow:0 0 10px #38bdf899;animation:pulse-dot 1.4s ease-in-out infinite}@keyframes pulse-dot{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.25);opacity:.75}}.hud-enemies{font-size:12px;color:var(--text-dim);font-variant-numeric:tabular-nums}.hud-enemies b{color:var(--bad);font-size:13px}.hud-integrity{display:flex;align-items:center;gap:8px;flex:1}.hud-integrity-bar{position:relative;flex:1;max-width:240px;height:12px;background:var(--panel-2);border:1px solid var(--border-soft);border-radius:6px;overflow:hidden}.hud-integrity-bar:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:repeating-linear-gradient(90deg,transparent 0 calc(25% - 1px),rgba(148,163,184,.35) calc(25% - 1px) 25%);pointer-events:none}#hud-integrity-fill{height:100%;width:100%;background:linear-gradient(90deg,var(--accent),var(--ok));border-radius:5px;transition:width .3s ease,background .4s ease;box-shadow:0 0 12px #4ade8059}#hud-integrity-fill.warn{background:linear-gradient(90deg,var(--warn),var(--accent))}#hud-integrity-fill.danger{background:linear-gradient(90deg,var(--bad),var(--warn));box-shadow:0 0 14px #f8717173}#hud-integrity-text{font-size:12px;color:var(--text-dim);font-variant-numeric:tabular-nums;min-width:52px}.hud-expect{display:flex;align-items:center;gap:8px;min-width:196px}.expect-title{font-size:12px;color:var(--text-dim);white-space:nowrap}.expect-bar{position:relative;flex:1;min-width:76px;height:8px;background:var(--panel-2);border:1px solid var(--border-soft);border-radius:4px;overflow:hidden}.expect-fill{height:100%;width:0;border-radius:3px;background:var(--ok);transition:width .35s ease,background .35s ease}.expect-fill.expect-good{background:linear-gradient(90deg,#22d3ee,var(--ok));box-shadow:0 0 10px #4ade8073}.expect-fill.expect-even{background:linear-gradient(90deg,var(--accent),var(--warn))}.expect-fill.expect-tense{background:linear-gradient(90deg,var(--warn),#fb923c);box-shadow:0 0 10px #fbbf2466}.expect-fill.expect-bad{background:linear-gradient(90deg,#fb923c,var(--bad));box-shadow:0 0 10px #f8717173}.expect-meta{display:flex;align-items:center;gap:5px;font-size:12px;font-variant-numeric:tabular-nums;white-space:nowrap}.expect-meta b{color:var(--text);min-width:34px;text-align:right}.expect-tag{padding:1px 6px;border-radius:999px;font-size:11px;border:1px solid var(--border-soft);color:var(--text-dim)}.expect-tag.expect-good{color:var(--ok);border-color:#4ade8073}.expect-tag.expect-even{color:var(--warn);border-color:#fbbf2473}.expect-tag.expect-tense{color:#fb923c;border-color:#fb923c73}.expect-tag.expect-bad{color:var(--bad);border-color:#f8717180}.expect-trend{font-size:11px;min-width:12px;text-align:center;transition:color .2s}.expect-trend.up{color:var(--ok)}.expect-trend.down{color:var(--bad)}.expect-trend.flat{color:var(--text-dim)}.hud-controls{display:flex;gap:6px}.hud-controls button{background:var(--panel-2);border:1px solid var(--border-soft);color:var(--text-dim);border-radius:8px;padding:5px 12px;cursor:pointer;font-size:13px;transition:all .18s}.hud-controls button:hover{border-color:var(--accent);color:var(--text);transform:translateY(-1px)}.hud-controls button.active{background:#38bdf829;border-color:var(--accent);color:var(--accent);box-shadow:0 0 12px #38bdf840}.hud-preview{display:flex;align-items:center;gap:8px;min-height:20px;font-size:12px;color:var(--warn);padding:2px 6px}.hud-preview:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--warn);box-shadow:0 0 8px var(--warn)}.hud-preview:empty:before{display:none}.hud-legend{display:flex;flex-direction:column;gap:6px;font-size:11px;color:var(--text-dim)}.legend-item{display:flex;align-items:center;gap:5px}.legend-item b{color:var(--text);font-variant-numeric:tabular-nums}.legend-dot{width:8px;height:8px;border-radius:50%}.hud-towerbar{display:flex;flex-direction:column;gap:8px}.tower-card{position:relative;display:flex;align-items:center;gap:10px;background:var(--panel);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--border-soft);border-radius:var(--radius);padding:9px 10px;cursor:pointer;color:var(--text);text-align:left;transition:transform .18s,border-color .18s,box-shadow .18s,background .18s;overflow:hidden}.tower-main{display:flex;flex-direction:column;gap:1px;flex:1;min-width:0}.tower-card .tower-icon{margin-bottom:0;flex-shrink:0}.tower-card .tower-key{top:4px;right:5px}.tower-card:before{content:"";position:absolute;inset:0 0 auto 0;height:1px;background:linear-gradient(90deg,transparent,rgba(56,189,248,.55),transparent);opacity:0;transition:opacity .2s}.tower-card:hover:not(.disabled):before{opacity:1}.tower-card:hover:not(.disabled){border-color:var(--accent);transform:translateY(-3px);box-shadow:0 10px 26px #38bdf82e}.tower-card.selected{border-color:var(--accent);background:#38bdf824;box-shadow:var(--shadow-glow)}.tower-card.disabled{opacity:.38;cursor:not-allowed;filter:grayscale(.5)}.tower-key{position:absolute;top:5px;right:6px;min-width:16px;height:16px;line-height:16px;text-align:center;font-size:10px;border-radius:4px;background:var(--panel-2);border:1px solid var(--border-soft);color:var(--text-dim);font-variant-numeric:tabular-nums}.tower-icon{display:flex;align-items:center;justify-content:center;width:30px;height:30px;margin-bottom:2px}.tower-icon svg{width:26px;height:26px;filter:drop-shadow(0 0 6px rgba(56,189,248,.35))}.tower-name{font-size:14px;font-weight:600}.tower-cost{color:var(--credits);font-size:13px;font-variant-numeric:tabular-nums}.tower-desc{color:var(--text-dim);font-size:11px;line-height:1.3}#game-canvas{display:block;border:1px solid var(--border-soft);border-radius:var(--radius);background:var(--bg);cursor:crosshair;box-shadow:var(--shadow-lg),0 0 0 1px #38bdf814}.pause-badge{position:absolute;top:14px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:6px;padding:6px 14px;border-radius:999px;background:#0f172ad9;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid var(--border-soft);font-size:12px;color:var(--text-dim);pointer-events:none;z-index:40;animation:fade-in .2s ease}.pause-badge b{color:var(--accent)}.start-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;border-radius:var(--radius);background:#070b14b8;backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);z-index:70;animation:fade-in .25s ease;cursor:pointer}.start-overlay h2{font-size:26px;letter-spacing:3px;background:linear-gradient(90deg,var(--accent),var(--accent-2));-webkit-background-clip:text;background-clip:text;color:transparent}.start-overlay .start-goal{font-size:13px;color:var(--text-dim)}.start-overlay .start-hint{margin-top:6px;font-size:12px;color:var(--text-dim)}.start-btn{margin-top:12px;padding:10px 30px;border-radius:999px;border:1px solid var(--accent);background:linear-gradient(90deg,#38bdf838,#a78bfa38);color:var(--accent);font-size:15px;letter-spacing:2px;cursor:pointer;box-shadow:0 8px 26px #38bdf840;transition:transform .18s,box-shadow .18s;animation:breathe 2.2s ease-in-out infinite}.start-btn:hover{transform:translateY(-2px) scale(1.02);box-shadow:0 12px 34px #38bdf861}@keyframes breathe{0%,to{box-shadow:0 8px 26px #38bdf838}50%{box-shadow:0 8px 34px #38bdf873}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.toast-container{position:fixed;top:20px;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;z-index:100;pointer-events:none}.toast{padding:9px 20px;border-radius:999px;font-size:13px;opacity:0;transform:translateY(-10px) scale(.96);transition:all .25s cubic-bezier(.2,.9,.3,1.2);border:1px solid var(--border-soft);background:#0f172aeb;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:0 8px 26px #00000073}.toast-show{opacity:1;transform:translateY(0) scale(1)}.toast-error{border-color:var(--bad);color:var(--bad);box-shadow:0 8px 26px #f8717138}.toast-info{border-color:var(--accent);color:var(--accent);box-shadow:0 8px 26px #38bdf838}.toast-warn{border-color:var(--warn);color:var(--warn);box-shadow:0 8px 26px #fbbf2438}.timeline-panel{position:absolute;inset:auto 0 0 0;margin:12px auto;max-width:860px;background:#111827f0;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(248,113,113,.45);border-radius:var(--radius);padding:14px 16px;box-shadow:var(--shadow-lg);animation:card-in .25s ease}.timeline-panel.hidden{display:none}.timeline-title{display:flex;align-items:center;gap:8px;color:var(--bad);font-size:15px;font-weight:700;margin-bottom:4px}.timeline-title:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--bad);box-shadow:0 0 10px var(--bad)}.timeline-hint{color:var(--text-dim);font-size:13px;margin-bottom:6px}.timeline-track{position:relative;height:6px;background:var(--panel-2);border-radius:3px;margin:14px 0 6px}.timeline-track:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:3px;background:linear-gradient(90deg,#38bdf840,#f8717173)}.timeline-marker{position:absolute;top:-6px;width:18px;height:18px;border-radius:50%;border:2px solid var(--bg);cursor:pointer;transform:translate(-50%);transition:transform .15s,box-shadow .15s;z-index:1}.timeline-marker:hover{transform:translate(-50%) scale(1.35);box-shadow:0 0 0 4px #ffffff14}.timeline-marker.first-hit{background:var(--bad);box-shadow:0 0 12px #f8717199}.timeline-marker.half{background:var(--warn);box-shadow:0 0 12px #fbbf2499}.timeline-marker.end{background:var(--accent);box-shadow:0 0 12px #38bdf899}.timeline-labels{display:flex;justify-content:space-between;font-size:11px;color:var(--text-dim)}.tower-info-card{position:absolute;background:#111827f2;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--border-soft);border-radius:var(--radius);padding:12px;min-width:190px;z-index:50;box-shadow:var(--shadow-lg);animation:card-in .15s ease}@keyframes card-in{0%{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.tower-info-card h3{font-size:14px;margin-bottom:8px;display:flex;align-items:center;gap:6px}.tower-info-card .info-row{display:flex;justify-content:space-between;font-size:12px;color:var(--text-dim);margin:3px 0}.tower-info-card .info-row b{color:var(--credits);font-variant-numeric:tabular-nums}.tower-info-card .info-actions{display:flex;gap:8px;margin-top:10px}.tower-info-card button{flex:1;background:var(--panel-2);border:1px solid var(--border-soft);border-radius:8px;color:var(--text);padding:6px 0;font-size:12px;cursor:pointer;transition:all .15s}.tower-info-card button:hover:not(:disabled){border-color:var(--accent);color:var(--accent);transform:translateY(-1px)}.tower-info-card button:disabled{opacity:.4;cursor:not-allowed}.tower-info-card button.danger:hover{border-color:var(--bad);color:var(--bad)}.result-panel{position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;height:fit-content;width:fit-content;max-width:90%;background:#111827eb;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--border-soft);border-radius:18px;padding:30px 46px;text-align:center;box-shadow:var(--shadow-lg);animation:card-in .28s cubic-bezier(.2,.9,.3,1.1);z-index:80}.result-panel.victory{border-color:#4ade8080;box-shadow:var(--shadow-lg),0 0 40px #4ade802e}.result-panel.defeat{border-color:#f8717180;box-shadow:var(--shadow-lg),0 0 40px #f871712e}.result-panel h2{font-size:24px;margin-bottom:6px;letter-spacing:1px}.result-panel.victory h2{color:var(--ok);text-shadow:0 0 20px rgba(74,222,128,.45)}.result-panel.defeat h2{color:var(--bad);text-shadow:0 0 20px rgba(248,113,113,.45)}.result-stars{font-size:26px;letter-spacing:6px;margin:6px 0 4px;color:var(--warn);text-shadow:0 0 18px rgba(251,191,36,.5)}.result-stars .dim{color:var(--panel-2);text-shadow:none}.result-sub{color:var(--text-dim);font-size:13px;margin-bottom:6px}.result-record{display:inline-block;margin:2px 0 6px;padding:3px 14px;border-radius:999px;font-size:12px;color:var(--warn);border:1px solid rgba(251,191,36,.5);background:#fbbf241f;box-shadow:0 0 18px #fbbf2433}.result-stats{display:flex;justify-content:center;gap:18px;margin:12px 0 18px;font-size:12px;color:var(--text-dim)}.result-stats div{display:flex;flex-direction:column;gap:2px}.result-stats b{font-size:15px;color:var(--text);font-variant-numeric:tabular-nums}.result-actions{display:flex;gap:10px;justify-content:center}.result-actions button{background:var(--panel-2);border:1px solid var(--border-soft);border-radius:10px;color:var(--text);padding:9px 22px;font-size:14px;cursor:pointer;transition:all .18s}.result-actions button:hover{border-color:var(--accent);color:var(--accent);transform:translateY(-2px)}.result-actions button.primary{background:linear-gradient(90deg,#38bdf82e,#a78bfa2e);border-color:var(--accent);color:var(--accent);box-shadow:0 8px 24px #38bdf838}.timeline-seek{margin-top:8px;font-size:13px;color:var(--accent);min-height:18px}.timeline-snapshot{display:flex;align-items:center;gap:14px;margin-top:12px;padding-top:12px;border-top:1px solid var(--border-soft)}.snapshot-canvas{border-radius:10px;border:1px solid var(--border-soft);background:var(--bg);box-shadow:0 8px 24px #00000073;flex-shrink:0}.snapshot-meta{font-size:12px;color:var(--text-dim);line-height:1.8}.footer-hotkeys{display:flex;flex-direction:column;gap:6px;font-size:11px;color:var(--text-dim)}.footer-hotkeys kbd{display:inline-block;min-width:18px;padding:1px 5px;margin-right:4px;border-radius:4px;background:var(--panel-2);border:1px solid var(--border-soft);color:var(--text);font-size:11px;font-family:inherit}.link-btn{background:none;border:none;color:var(--text-dim);text-decoration:underline;cursor:pointer;font-size:12px}.link-btn:hover{color:var(--bad)}@media (max-width: 1080px),(max-height: 620px){body{overflow:auto}#app{height:auto;min-height:100dvh;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto}.side{overflow:visible;flex-direction:row;flex-wrap:wrap;align-items:flex-start;gap:10px}.side-block{flex:1 1 240px}.side-foot{margin-top:0}.game-stage{min-height:58vh;padding:4px 0}.hud-towerbar{flex-direction:row;flex-wrap:wrap}.tower-card{flex:1 1 150px}.hud-legend{flex-direction:row;flex-wrap:wrap;gap:12px}}