@import "https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@400;600;700;900&family=Outfit:wght@400;600;700;900&display=swap";:root{--bg-deep:#051329;--bg-panel:#0a192fc7;--bg-card:#0f2240bf;--border-cyan:#38bdf859;--border-blue:#0284c766;--cyan-glow:#38bdf8;--accent-cyan:#06b6d4;--team-blue:#0284c7;--team-orange:#ea580c;--danger:#ef4444;--success:#22c55e;--warning:#f59e0b;--text-white:#f8fafc;--text-muted:#94a3b8;--font-main:"Outfit", "Noto Sans TC", sans-serif}*{box-sizing:border-box;-webkit-user-select:none;user-select:none;margin:0;padding:0}body{font-family:var(--font-main);background-color:var(--bg-deep);color:var(--text-white);background:radial-gradient(circle at 50% 20%,#0d2b4f 0%,#041122 75%,#020710 100%);flex-direction:column;min-height:100vh;display:flex;overflow:hidden auto}header{z-index:50;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--border-cyan);background:#030e1ce6;padding:6px 16px;position:sticky;top:0}.top-bar{justify-content:space-between;align-items:center;gap:16px;max-width:1760px;margin:0 auto;display:flex}.header-status-box{background:var(--bg-card);border:1px solid var(--border-cyan);border-radius:10px;flex-direction:column;flex:1;gap:4px;max-width:440px;padding:6px 14px;display:flex}.header-status-box.orange-side{border-color:#ea580c73}.sub-header-meta{justify-content:space-between;align-items:center;gap:8px;display:flex}.status-label{color:#e2e8f0;white-space:nowrap;font-size:.88rem;font-weight:800}.water-pill{color:#7dd3fc;white-space:nowrap;background:#0284c738;border:1px solid #38bdf859;border-radius:12px;padding:1px 8px;font-size:.76rem;font-weight:700;transition:all .25s}.water-pill.danger{color:#fecaca;background:#dc262659;border-color:#ef4444;animation:.6s infinite alternate pulse-banner}.bar-wrap{background:#0000008c;border:1px solid #ffffff1f;border-radius:6px;width:100%;height:11px;overflow:hidden}.bar-fill{width:0%;height:100%;transition:width .25s,background .3s}.bar-fill.depth-blue{background:linear-gradient(90deg,#0284c7,#38bdf8,#2dd4bf)}.bar-fill.depth-orange{background:linear-gradient(90deg,#ea580c,#fb923c,#fde047)}.status-value{color:var(--cyan-glow);font-family:monospace;font-size:1.08rem;font-weight:900}.header-center{align-items:center;gap:10px;display:flex}.header-tools{align-items:center;gap:6px;display:flex}.timer-box{color:#fff;border:2px solid var(--cyan-glow);text-align:center;background:#000000a6;border-radius:10px;min-width:78px;padding:4px 16px;font-family:monospace;font-size:1.65rem;font-weight:900;box-shadow:0 0 16px #38bdf859}.btn-primary{color:#fff;border:1px solid var(--cyan-glow);cursor:pointer;white-space:nowrap;background:linear-gradient(135deg,#0284c7,#0369a1);border-radius:8px;padding:8px 18px;font-size:.95rem;font-weight:800;transition:all .2s;box-shadow:0 4px 12px #0284c766}.btn-primary:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 6px 20px #38bdf899}.btn-primary:disabled{opacity:.5;cursor:not-allowed;filter:grayscale(.6)}.btn-icon{background:var(--bg-card);border:1px solid var(--border-cyan);color:var(--text-white);cursor:pointer;border-radius:8px;justify-content:center;align-items:center;width:38px;height:38px;font-size:1.05rem;transition:all .2s;display:flex}.btn-icon:hover{border-color:var(--cyan-glow);background:#38bdf833}.btn-icon.active{border-color:var(--cyan-glow);color:var(--cyan-glow)}#arena{flex:1;grid-template-columns:265px 1fr 265px;gap:12px;width:100%;max-width:1760px;height:calc(100vh - 98px);min-height:560px;margin:0 auto;padding:10px 14px;display:grid}.team-panel{background:var(--bg-panel);border:1px solid var(--border-blue);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:12px;flex-direction:column;gap:8px;min-height:0;padding:10px;display:flex;box-shadow:0 8px 30px #0006}.team-panel.orange-panel{border-color:#ea580c66}.team-header-title{color:var(--cyan-glow);border-bottom:1px solid #ffffff1a;align-items:center;gap:6px;padding-bottom:5px;font-size:.92rem;font-weight:800;display:flex}.team-panel.orange-panel .team-header-title{color:#fb923c}.player-slot{background:var(--bg-card);border:1px solid var(--border-cyan);border-radius:10px;flex-direction:column;flex:1;justify-content:space-between;gap:4px;min-height:0;padding:8px 10px;transition:transform .2s,border-color .2s;display:flex}.player-slot:hover{transform:translateY(-1px)}.player-slot.in-emergency{border-color:var(--danger);animation:1s infinite alternate pulse-border}@keyframes pulse-border{0%{box-shadow:0 0 6px #ef44444d}to{box-shadow:0 0 18px #ef4444b3}}.slot-head{justify-content:space-between;align-items:center;display:flex}.role-badge{background:#0284c740;border:1px solid #38bdf84d;border-radius:5px;align-items:center;gap:5px;padding:2px 8px;font-size:.8rem;font-weight:800;display:flex}.slot-pid{color:var(--cyan-glow);font-family:monospace;font-size:.95rem;font-weight:900}.slot-metrics{background:#00000059;border-radius:6px;justify-content:space-between;align-items:baseline;padding:3px 10px;display:flex}.metric-rpm-box{align-items:baseline;gap:4px;display:flex}.metric-rpm{color:#fff;font-family:monospace;font-size:1.4rem;font-weight:900;line-height:1.1}.metric-unit{color:var(--text-muted);font-size:.72rem}.metric-count-box{color:var(--text-muted);font-size:.8rem}.metric-count{color:#fff;font-family:monospace;font-size:.95rem;font-weight:800}.slot-status-tag{text-align:center;color:var(--text-muted);background:#ffffff14;border-radius:4px;padding:2px 6px;font-size:.75rem;font-weight:800}.slot-status-tag.active{color:var(--success);background:#22c55e33}.slot-status-tag.emergency{color:var(--danger);background:#ef444440;font-weight:900}.slot-footer{border-top:1px solid #ffffff14;justify-content:space-between;align-items:center;padding-top:3px;display:flex}.ble-indicator{color:var(--text-muted);align-items:center;gap:5px;font-size:.75rem;display:flex}.ble-dot{background:#64748b;border-radius:50%;width:8px;height:8px;transition:background .3s}.ble-dot.connected{background:var(--success);box-shadow:0 0 8px var(--success)}.ble-btn{border:1px solid var(--border-cyan);color:#fff;cursor:pointer;background:#38bdf826;border-radius:6px;padding:2px 10px;font-size:.75rem;font-weight:700;transition:all .2s}.ble-btn:hover{background:#38bdf859}#center-panel{border:1px solid var(--border-cyan);background:#061022d9;border-radius:12px;flex-direction:column;min-height:0;display:flex;position:relative;overflow:hidden}.center-hud-header{border-bottom:1px solid var(--border-cyan);z-index:10;background:#0a192feb;flex-direction:column;gap:5px;padding:6px 12px;display:flex}.center-top-row{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;display:flex}.target-badge-container{border:1px solid var(--border-cyan);background:#020617bf;border-radius:16px;align-items:center;gap:10px;padding:3px 14px;display:flex}.target-badge-text{color:var(--text-muted);font-size:.8rem;font-weight:700}.target-badge-value{color:var(--cyan-glow);font-family:monospace;font-size:.98rem;font-weight:900}.module-legend{flex-wrap:wrap;justify-content:center;align-items:center;gap:6px;font-size:.74rem;display:flex}.legend-chip{border:1px solid var(--border-cyan);white-space:nowrap;background:#0f2240d9;border-radius:14px;padding:2px 10px;font-weight:700}#battlefield-canvas-wrap{background:#020617b3;flex:1;min-height:360px;position:relative;overflow:hidden;box-shadow:inset 0 0 40px #000000b3}#battlefield-canvas-wrap canvas{display:block;width:100%!important;height:100%!important}.announce-banner{border:1.5px solid var(--cyan-glow);color:#fff;pointer-events:none;z-index:12;white-space:nowrap;background:#030e1ceb;border-radius:24px;padding:6px 24px;font-size:.95rem;font-weight:800;transition:all .3s;position:absolute;bottom:12px;left:50%;transform:translate(-50%);box-shadow:0 0 20px #38bdf859}.announce-banner.emergency{border-color:var(--danger);color:#fdd;animation:.8s infinite alternate pulse-banner;box-shadow:0 0 25px #ef444499}@keyframes pulse-banner{0%{transform:translate(-50%)scale(1)}to{transform:translate(-50%)scale(1.04)}}.dev-toolbar{background:#030e1cf2;border-top:1px solid #ffffff1a;justify-content:space-between;align-items:center;padding:6px 16px;font-size:.78rem;display:flex}.dev-actions{align-items:center;gap:10px;display:flex}.btn-dev{color:#fff;cursor:pointer;background:#ffffff14;border:1px solid #fff3;border-radius:6px;padding:5px 12px;font-size:.8rem;font-weight:700;transition:all .2s}.btn-dev:hover{background:#fff3}.btn-dev.active{border-color:var(--cyan-glow);color:var(--cyan-glow);background:#38bdf840}.modal-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:100;background:#020617d9;justify-content:center;align-items:center;padding:20px;display:none;position:fixed;inset:0}.modal-overlay.open{display:flex}.modal-card{border:1px solid var(--border-cyan);background:#091a33;border-radius:16px;flex-direction:column;gap:16px;width:100%;max-width:580px;padding:24px;display:flex;box-shadow:0 16px 40px #000c}.modal-title{color:var(--cyan-glow);border-bottom:1px solid #ffffff1a;align-items:center;gap:10px;padding-bottom:10px;font-size:1.35rem;font-weight:900;display:flex}.form-group{flex-direction:column;gap:6px;display:flex}.form-group label{color:var(--text-muted);font-size:.9rem;font-weight:700}.form-control{border:1px solid var(--border-cyan);color:#fff;background:#0006;border-radius:8px;padding:8px 12px;font-size:.95rem}#countdown-modal{z-index:999;background:#000c;justify-content:center;align-items:center;display:none;position:fixed;inset:0}#countdown-modal.open{display:flex}.countdown-number{color:var(--cyan-glow);text-shadow:0 0 50px #38bdf8cc;font-size:9rem;font-weight:900;animation:.9s ease-out infinite countdown-pop}@keyframes countdown-pop{0%{opacity:0;transform:scale(.6)}50%{opacity:1;transform:scale(1.1)}to{opacity:1;transform:scale(1)}}.result-card{text-align:center;gap:20px}.result-headline{color:#fff;font-size:2.2rem;font-weight:900}.result-detail-grid{background:#00000059;border-radius:12px;grid-template-columns:1fr 1fr;gap:12px;padding:16px;display:grid}.result-sub-item{flex-direction:column;gap:6px;display:flex}.result-sub-title{color:var(--cyan-glow);font-size:1.1rem;font-weight:800}.result-stat{color:var(--text-muted);font-size:.95rem}.hidden{display:none!important}.mode-tabs{align-items:center;gap:6px;display:flex}.mode-tab-btn{color:var(--text-muted);font-family:var(--font-main);cursor:pointer;background:#0f2240bf;border:1px solid #38bdf847;border-radius:8px;padding:4px 10px;font-size:.78rem;font-weight:800;transition:all .2s}.mode-tab-btn:hover{color:#fff;background:#38bdf833}.mode-tab-btn.active{color:#fff;border-color:var(--cyan-glow);background:linear-gradient(135deg,#0284c7,#0891b2);box-shadow:0 0 10px #38bdf859}.legend-chip.chip-leak{color:#7dd3fc;background:#0ea5e933;border-color:#38bdf899}.legend-chip.chip-reef{color:#fde047;background:#eab30833;border-color:#eab30899}.legend-chip.chip-heat{color:#fca5a5;background:#ef444433;border-color:#ef444499}.slot-duty-alert{background:#dc262638;border:1px solid #ef4444a6;border-radius:6px;flex-direction:column;gap:3px;padding:4px 8px;animation:.8s ease-in-out infinite alternate duty-box-glow;display:none}.player-slot.in-duty .slot-status-tag{display:none!important}.player-slot.in-duty .slot-duty-alert{display:flex!important}.player-slot.in-duty{border-color:#ef4444!important;box-shadow:0 0 18px #ef4444a6,inset 0 0 10px #ef444440!important}.player-slot.jump-flash{transition:transform 80ms ease-out,filter 80ms ease-out;filter:brightness(1.25)!important;transform:scale(1.03)!important}@keyframes duty-box-glow{0%{background:#dc262638}to{background:#dc262673}}.duty-row{justify-content:space-between;align-items:center;gap:6px;display:flex}.duty-badge{color:#fff;white-space:nowrap;background:#dc2626;border-radius:4px;padding:1px 6px;font-size:.72rem;font-weight:900}.duty-progress-wrap{background:#0009;border:1px solid #ffffff26;border-radius:3px;width:100%;height:6px;overflow:hidden}.duty-progress-bar{background:linear-gradient(90deg,#ef4444,#eab308,#22c55e);width:0%;height:100%;transition:width .15s ease-out}.duty-status-text{color:#fef08a;white-space:nowrap;font-size:.72rem;font-weight:800}#mission-hud-overlay{pointer-events:none;z-index:15;justify-content:space-around;gap:12px;padding:0 12px;display:flex;position:absolute;top:10px;left:0;right:0}.mission-hud-card{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);opacity:0;pointer-events:none;background:#030a18eb;border:1.5px solid #0000;border-radius:12px;flex-direction:column;flex:1;gap:5px;max-width:440px;padding:8px 14px;transition:all .25s cubic-bezier(.16,1,.3,1);display:flex;transform:translateY(-14px)scale(.96);box-shadow:0 8px 24px #0009}.mission-hud-card.active{opacity:1;pointer-events:auto;transform:translateY(0)scale(1)}.mission-hud-card.hud-blue{border-color:#0284c7;box-shadow:0 0 20px #0284c773,inset 0 0 12px #0284c72e}.mission-hud-card.hud-orange{border-color:#ea580c;box-shadow:0 0 20px #ea580c73,inset 0 0 12px #ea580c2e}.mission-hud-card.hud-success{background:#062c18f2!important;border-color:#22c55e!important;box-shadow:0 0 30px #22c55ebf!important}.mission-hud-card.hud-fail{background:#2d0a0af2!important;border-color:#ef4444!important;box-shadow:0 0 30px #ef4444bf!important}.hud-card-header{justify-content:space-between;align-items:center;gap:6px;display:flex}.hud-team-tag{color:#fff;background:#ffffff1a;border-radius:5px;padding:2px 7px;font-size:.78rem;font-weight:800}.hud-blue .hud-team-tag{color:#7dd3fc;background:#0284c74d}.hud-orange .hud-team-tag{color:#fdba74;background:#ea580c4d}.hud-event-name{color:#ffedd5;font-size:.95rem;font-weight:900}.hud-timer{color:#fde047;background:#00000073;border-radius:5px;padding:1px 7px;font-family:monospace;font-size:.95rem;font-weight:900}.hud-action-call{color:#fff;background:#ef444426;border-left:3px solid #ef4444;border-radius:4px;padding:4px 10px;font-size:.86rem;font-weight:800}.hud-action-call strong{color:#fef08a;font-size:.92rem}.hud-progress-container{align-items:center;gap:10px;display:flex}.hud-progress-bar-bg{background:#0009;border:1px solid #fff3;border-radius:5px;flex:1;height:9px;overflow:hidden}.hud-progress-bar{background:linear-gradient(90deg,#ef4444,#eab308,#22c55e);width:0%;height:100%;transition:width .15s ease-out}.hud-progress-num{color:#38bdf8;text-align:right;min-width:72px;font-family:monospace;font-size:.85rem;font-weight:900}.rotation-broadcast{text-align:center;opacity:0;pointer-events:none;z-index:50;background:#030e1cf2;border:3px solid #38bdf8;border-radius:20px;padding:20px 36px;transition:all .35s cubic-bezier(.16,1,.3,1);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)scale(.8);box-shadow:0 0 50px #38bdf8cc,inset 0 0 30px #38bdf84d}.rotation-broadcast.active{opacity:1;transform:translate(-50%,-50%)scale(1)}.rotation-icon-spin{margin-bottom:6px;font-size:2.8rem;animation:2s linear infinite spin;display:inline-block}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.rotation-title{color:#38bdf8;text-shadow:0 0 15px #38bdf8cc;margin-bottom:4px;font-size:1.65rem;font-weight:900}.rotation-desc{color:#f8fafc;font-size:1rem;font-weight:700}@media (width<=1150px){#arena{grid-template-columns:220px 1fr 220px;gap:8px}}@media (width<=860px){#arena{flex-direction:column;height:auto;display:flex}.team-panel{grid-template-columns:repeat(3,1fr);display:grid}}@media (width<=640px){header{position:static}.top-bar{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.header-status-box{min-width:0;padding:6px 8px}.sub-header-meta{flex-wrap:wrap;gap:4px}.status-label{white-space:normal}.header-center{flex-wrap:wrap;order:1;grid-column:1/-1;justify-content:center;min-width:0}#center-panel{flex:none;order:-1;min-height:500px}.team-panel{grid-template-columns:minmax(0,1fr)}.player-slot{min-width:0}.mode-tabs,.target-badge-container,.dev-toolbar,.dev-actions{flex-wrap:wrap}.dev-actions{min-width:0}.legend-chip{white-space:normal}.announce-banner{white-space:normal;text-align:center;max-width:calc(100% - 16px)}.modal-card{max-height:calc(100dvh - 40px);padding:16px;overflow:auto}.form-control{min-width:0;max-width:100%}.result-detail-grid{grid-template-columns:minmax(0,1fr)}#mission-hud-overlay{flex-direction:column}.hud-card-header,.hud-progress-container{flex-wrap:wrap}.rotation-broadcast{width:calc(100% - 24px);padding:16px}}
