:root{--bg: #0b1424;--panel: rgba(9, 18, 32, .92);--panel-soft: rgba(12, 24, 42, .82);--stroke: rgba(110, 190, 255, .26);--text: #e9f4ff;--muted: #9fb6cc;--accent: #ff8a3d;--cyan: #4fd6ff;--green: #6ee7a8;--red: #ff5d5d;--safe-b: env(safe-area-inset-bottom, 0px);--safe-l: env(safe-area-inset-left, 0px);--safe-r: env(safe-area-inset-right, 0px);--safe-t: env(safe-area-inset-top, 0px)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}[hidden]{display:none!important}html,body{margin:0;padding:0;width:100%;height:100%;overflow:hidden;position:fixed;overscroll-behavior:none;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Segoe UI,Roboto,system-ui,sans-serif;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:none}#renderCanvas{position:absolute;inset:0;width:100%;height:100%;display:block;outline:none;touch-action:none}.hud{position:absolute;inset:0;pointer-events:none;z-index:10}.hud button,.hud .panel,.hud .overlay{pointer-events:auto}.topbar{position:absolute;top:calc(var(--safe-t) + 10px);left:calc(var(--safe-l) + 14px);right:calc(var(--safe-r) + 14px);display:flex;align-items:center;gap:10px;flex-wrap:wrap}.res-group{display:flex;gap:6px;background:var(--panel-soft);border:1px solid var(--stroke);border-radius:14px;padding:6px 10px;backdrop-filter:blur(8px)}.res{display:flex;align-items:center;gap:5px;min-width:58px;font-variant-numeric:tabular-nums;font-size:16px;font-weight:600}.res-icon{font-size:15px;line-height:1}.res-fiber .res-icon{color:var(--green)}.res-alloy .res-icon{color:#ffc46b}.res-credit .res-icon{color:var(--cyan)}.res.bump{animation:bump .35s ease}@keyframes bump{0%{transform:scale(1)}40%{transform:scale(1.22)}to{transform:scale(1)}}.weapon-chip{background:var(--panel-soft);border:1px solid var(--stroke);border-radius:12px;padding:7px 12px;font-size:13px;color:var(--muted);white-space:nowrap}.top-right{margin-left:auto;display:flex;align-items:center;gap:8px}.chip,.icon-btn{background:var(--panel-soft);border:1px solid var(--stroke);color:var(--text);border-radius:12px;padding:8px 11px;font-size:12.5px;font-family:inherit;min-height:40px;cursor:pointer;backdrop-filter:blur(8px)}.topbar .icon-btn{min-width:52px;min-height:52px}.icon-btn:active,.chip:active{transform:translateY(1px)}.chip-offline{color:#ffd479;border-color:#ffd47973}.chip-offline.ready{color:var(--green);border-color:#6ee7a880}.chip-offline.off{color:var(--muted)}.objective{position:absolute;top:calc(var(--safe-t) + 78px);left:50%;transform:translate(-50%);background:var(--panel);border:1px solid var(--stroke);border-radius:12px;padding:7px 16px;font-size:13.5px;color:#d6e8f8;max-width:min(70vw,620px);text-align:center;transition:opacity .25s ease}.objective.fade{opacity:.35}.training-hud{position:absolute;left:calc(var(--safe-l) + 14px);top:calc(var(--safe-t) + 128px);background:var(--panel);border:1px solid var(--stroke);border-radius:14px;padding:10px 12px;min-width:176px;font-size:12.5px;color:var(--muted);display:grid;gap:5px}.th-row{display:flex;justify-content:space-between;gap:14px}.th-row b{color:var(--text);font-variant-numeric:tabular-nums}.player-hp{position:absolute;left:calc(var(--safe-l) + 14px);bottom:calc(var(--safe-b) + 22px);width:190px;background:var(--panel);border:1px solid var(--stroke);border-radius:12px;padding:8px 10px}.hp-label{font-size:11.5px;color:var(--muted);margin-bottom:5px}.hp-label b{color:var(--text);font-variant-numeric:tabular-nums}.hp-bar{height:7px;border-radius:4px;background:#ffffff1f;overflow:hidden}.hp-bar i{display:block;height:100%;width:100%;background:linear-gradient(90deg,#4fd6ff,#6ee7a8);transition:width .18s ease}.hp-bar i.low{background:linear-gradient(90deg,#ff9a3d,#ff5d5d)}.action-btn{position:absolute;left:50%;bottom:calc(var(--safe-b) + 26px);transform:translate(-50%);width:108px;height:108px;border-radius:50%;border:2px solid rgba(255,138,61,.85);background:radial-gradient(circle at 34% 28%,#ffb05cf2,#e06018f0);color:#2a1103;font-family:inherit;font-weight:800;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;box-shadow:0 8px 26px #ff782859;transition:transform .08s ease,opacity .15s ease}.action-btn:active{transform:translate(-50%) scale(.94)}.action-btn:disabled{opacity:.42;border-color:#a0b4c880;background:#5a6e828c;color:#e6eef6;box-shadow:none}.action-label{font-size:16px;letter-spacing:.5px}.action-sub{font-size:10.5px;font-weight:600;opacity:.85;max-width:96px;text-align:center;line-height:1.15}.popups{position:absolute;inset:0;overflow:hidden}.dmg{position:absolute;transform:translate(-50%,-50%);font-weight:800;font-size:20px;color:#fff;text-shadow:0 2px 8px rgba(0,0,0,.8);animation:floatUp .72s ease-out forwards;pointer-events:none}.dmg.crit{color:var(--cyan);font-size:24px}@keyframes floatUp{0%{opacity:0;transform:translate(-50%,-50%) scale(.7)}22%{opacity:1;transform:translate(-50%,-62%) scale(1.12)}to{opacity:0;transform:translate(-50%,-128%) scale(1)}}.vignette{position:absolute;inset:0;pointer-events:none;opacity:0;background:radial-gradient(ellipse at center,#f000 42%,#ff2e2e8c);transition:opacity .18s ease}.vignette.on{opacity:1}.stick-visual{position:absolute;width:132px;height:132px;margin-left:-66px;margin-top:-66px;border-radius:50%;border:2px solid rgba(120,200,255,.28);background:#0c1e3447;display:none;pointer-events:none}.stick-visual i{position:absolute;left:50%;top:50%;width:54px;height:54px;margin-left:-27px;margin-top:-27px;border-radius:50%;background:#a0dcff57;border:2px solid rgba(190,235,255,.6)}.stick-visual.on{display:block}.stick-visual.rest{display:block;opacity:.3}.stick-visual.right{border-color:#ff965a57}.stick-visual.right i{background:#ffb07857;border-color:#ffc8969e}.overlay{position:absolute;inset:0;background:#040912b8;display:flex;align-items:center;justify-content:center;padding:24px;backdrop-filter:blur(4px);z-index:30}.overlay[hidden]{display:none}.panel{width:min(560px,92vw);max-height:88vh;overflow:auto;background:var(--panel);border:1px solid var(--stroke);border-radius:20px;padding:22px 22px 18px;box-shadow:0 24px 70px #0000008c}.panel h1{margin:6px 0 4px;font-size:30px;letter-spacing:2px}.panel h1 span{display:block;font-size:15px;letter-spacing:6px;color:var(--accent);margin-top:6px;font-weight:600}.panel h2{margin:0 0 14px;font-size:20px}.panel p{margin:8px 0;color:var(--muted);font-size:13.5px;line-height:1.6}.panel .small{font-size:12px;color:var(--muted);line-height:1.55}.panel .hint{font-size:12px;color:#ffcf8a;line-height:1.5;margin-top:6px;min-height:1em}.start-panel{text-align:center}.logo-mark{font-size:40px;color:var(--cyan);line-height:1;text-shadow:0 0 26px rgba(79,214,255,.55)}.tagline{color:var(--muted);font-size:13px}.primary,.ghost,.danger-ghost{width:100%;margin-top:14px;padding:14px 18px;border-radius:14px;font-size:16px;font-family:inherit;font-weight:700;cursor:pointer;border:1px solid transparent;min-height:52px}.primary{background:linear-gradient(180deg,#ffa45c,#f0761f);color:#2b1302;box-shadow:0 8px 24px #f0761f52}.primary:disabled{filter:grayscale(.6);opacity:.55}.ghost{background:#ffffff0f;border-color:var(--stroke);color:var(--text)}.danger-ghost{background:transparent;border-color:#ff5d5d59;color:#ff9a9a;font-size:13px;padding:10px;margin-top:10px}.btn-row{display:flex;gap:10px}.btn-row>button{flex:1}.row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid rgba(120,180,230,.12);font-size:14px;color:var(--muted)}.row b{color:var(--text);font-weight:600}.row:last-of-type{border-bottom:none}.toggle{width:74px;min-height:52px;border-radius:17px;border:1px solid var(--stroke);background:#ffffff14;position:relative;cursor:pointer;font-family:inherit;color:var(--muted);font-size:12px}.toggle i{position:absolute;top:9px;left:3px;width:32px;height:32px;border-radius:50%;background:#8ea8bf;transition:transform .16s ease,background .16s ease}.toggle b{position:absolute;right:9px;top:18px;font-size:11px}.toggle.on{background:#6ee7a833;border-color:#6ee7a88c;color:var(--green)}.toggle.on i{transform:translate(36px);background:var(--green)}.toggle.on b{left:10px;right:auto}.upgrade-compare{display:flex;align-items:center;gap:10px;margin:4px 0 12px;font-size:12px;color:var(--muted)}.upgrade-compare>div:not(.arrow){flex:1;background:#ffffff0d;border:1px solid var(--stroke);border-radius:12px;padding:10px;display:grid;gap:4px}.upgrade-compare b{color:var(--text);font-size:14px}.upgrade-compare em{font-style:normal;color:#ffcf8a;font-size:11.5px}.upgrade-compare .arrow{color:var(--accent);font-size:18px;font-weight:700}.reward-panel{text-align:center}.reward-line{color:var(--text)!important;font-size:15px!important}.reward-items{display:flex;justify-content:center;gap:18px;margin:14px 0;font-size:18px;font-weight:700}.reward-items span:first-child{color:#ffc46b}.reward-items span:last-child{color:var(--cyan)}.toast{position:absolute;left:50%;bottom:calc(var(--safe-b) + 152px);transform:translate(-50%);background:#081220f2;border:1px solid var(--stroke);color:var(--text);border-radius:12px;padding:10px 18px;font-size:13.5px;max-width:78vw;text-align:center;z-index:40;animation:toastIn .18s ease}.toast.err{border-color:#ff5d5d99;color:#ffb3b3}.toast.ok{border-color:#6ee7a88c;color:#b8ffd9}@keyframes toastIn{0%{opacity:0;transform:translate(-50%,8px)}to{opacity:1;transform:translate(-50%)}}@media(max-height:480px){.action-btn{width:90px;height:90px}.objective{font-size:12px;top:calc(var(--safe-t) + 72px)}.panel{padding:16px}}