:root{--navy-deep: #0e1813;--navy: #16241d;--navy-panel: #1c2e24;--navy-line: #2b4032;--orange: #f39019;--amber: #f5c518;--green: #4ba84b;--teal: #3fa38a;--purple: #a779d6;--red: #d9534f;--ink: #eaf6ee;--ink-dim: #9fc4ad;--ink-faint: #6e8a79;--ink-on-orange: #241100;--font-display: "Sora", "Segoe UI", system-ui, -apple-system, sans-serif;--font-body: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;--font-mono: "IBM Plex Mono", "SFMono-Regular", "Consolas", "Menlo", monospace;--bg: var(--navy-deep);--bg-2: var(--navy);--panel: var(--navy-panel);--panel-2: var(--navy);--border: var(--navy-line);--border-2: var(--navy-line);--text: var(--ink);--dim: var(--ink-dim);--muted: var(--ink-faint);--accent: var(--orange);--live: var(--green);--lost: var(--red);--warn: var(--amber);--anode: var(--orange);--cathode: var(--teal);--mono: var(--font-mono);--sans: var(--font-body)}*{box-sizing:border-box}body{margin:0;background:radial-gradient(1100px 620px at 78% -12%,rgba(63,163,138,.12) 0%,transparent 60%),radial-gradient(900px 520px at 8% 0%,rgba(243,144,25,.06) 0%,transparent 55%),var(--navy-deep);background-attachment:fixed;color:var(--ink);font-family:var(--font-body);font-size:14px;-webkit-font-smoothing:antialiased}.mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums;letter-spacing:.2px}.dim{color:var(--ink-dim)}.muted{color:var(--ink-faint)}.pad{padding:16px}.big{font-family:var(--font-display);font-size:22px;font-weight:700;font-variant-numeric:tabular-nums}.unit{color:var(--ink-dim);font-size:12px;margin-left:4px}.app{min-height:100vh;display:flex;flex-direction:column}.app-header{background:linear-gradient(180deg,var(--navy) 0%,var(--navy-deep) 100%);border-bottom:1px solid var(--navy-line);padding:14px 20px 0;position:sticky;top:0;z-index:10}.header-top{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}.brand{display:flex;align-items:center;gap:10px}.brand-logo{width:30px;height:30px;border-radius:8px;display:block;object-fit:contain;background:#0a120d;border:1px solid var(--navy-line);box-shadow:0 0 0 1px #f390191f,0 2px 8px #0006;flex-shrink:0}.brand-mark{font-family:var(--font-display);font-weight:700;letter-spacing:1.5px;font-size:20px;color:var(--ink)}.brand-divider{font-family:var(--font-display);color:var(--orange);font-weight:700;font-size:20px}.brand-sub{color:var(--ink-dim);font-size:13px;border-left:1px solid var(--navy-line);padding-left:10px;margin-left:4px}.header-controls{display:flex;align-items:center;gap:18px;flex-wrap:wrap}.selector{display:flex;flex-direction:column;gap:3px}.selector-label{font-family:var(--font-mono);font-size:10px;text-transform:uppercase;letter-spacing:1.5px;color:var(--ink-faint)}.selector select{background:var(--navy-panel);color:var(--ink);border:1px solid var(--navy-line);border-radius:8px;padding:7px 10px;font-family:var(--font-mono);font-size:13px;min-width:320px}.selector select:focus{outline:none;border-color:var(--orange)}.comms-indicator{display:flex;align-items:center;gap:8px}.comms-text{font-family:var(--font-display);font-size:12px;font-weight:600;letter-spacing:.5px}.led{width:12px;height:12px;border-radius:50%;display:inline-block;background:var(--ink-faint);transition:background .12s linear,box-shadow .12s linear,opacity .12s}.led-live.led-on{background:var(--orange);box-shadow:0 0 10px 2px #f39019bf;opacity:1}.led-live.led-dim{background:#2f6b3f;box-shadow:none;opacity:.5}.led-lost{background:var(--red);box-shadow:0 0 10px 2px #d9534f99;animation:none}.carrier-chip{display:flex;align-items:center;gap:10px;background:var(--navy-panel);border:1px solid var(--navy-line);border-radius:10px;padding:6px 12px}.carrier-empty{opacity:.6}.carrier-meta{display:flex;flex-direction:column;line-height:1.25}.carrier-op{font-weight:600;font-size:13px}.carrier-sub{font-size:11px;color:var(--ink-dim)}.sig-bars{display:flex;align-items:flex-end;gap:2px;height:16px}.sig-bar{width:3px;border-radius:1px;align-self:flex-end}.sig-on{background:var(--green)}.sig-off{background:var(--navy-line)}.identity-block{display:flex;flex-wrap:wrap;gap:22px;padding:12px 2px;margin-top:10px;border-top:1px solid var(--navy-line)}.identity-item{display:flex;flex-direction:column;gap:2px}.identity-label{font-family:var(--font-mono);font-size:10px;text-transform:uppercase;letter-spacing:1.5px;color:var(--ink-faint)}.identity-value{font-size:13px;font-weight:500}.ws-status-bar{display:flex;align-items:center;gap:8px;padding:6px 20px;background:var(--navy);border-bottom:1px solid var(--navy-line);font-size:12px;font-family:var(--font-mono)}.ws-dot{width:8px;height:8px;border-radius:50%}.ws-open{background:var(--green);box-shadow:0 0 8px 1px #4ba84b80}.ws-connecting{background:var(--amber)}.ws-closed{background:var(--red)}.ws-err{color:var(--amber);margin-left:12px}.app-main{padding:20px;flex:1}.module-layout{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(340px,1fr);gap:18px;align-items:start}.module-left,.module-right{display:flex;flex-direction:column;gap:18px;min-width:0}@media (max-width: 1100px){.module-layout{grid-template-columns:1fr}}.panel{background:var(--navy-panel);border:1px solid var(--navy-line);border-radius:16px;overflow:hidden}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border-bottom:1px solid var(--navy-line)}.panel-head h2{margin:0;font-family:var(--font-display);font-size:14px;font-weight:600;letter-spacing:.3px;position:relative;padding-bottom:6px}.panel-head h2:after{content:"";position:absolute;left:0;bottom:0;width:28px;height:2px;border-radius:2px;background:var(--orange)}.panel-sub{font-size:11px;color:var(--ink-dim);font-family:var(--font-mono)}.chart-body{padding:10px 8px 8px}.chart-empty{height:200px;display:flex;align-items:center;justify-content:center;color:var(--ink-faint);font-family:var(--font-mono)}.frozen{position:relative}.frozen:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:repeating-linear-gradient(45deg,rgba(217,83,79,.05) 0,rgba(217,83,79,.05) 10px,transparent 10px,transparent 20px);pointer-events:none}.stat-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:12px}.tile{background:var(--navy-panel);border:1px solid var(--navy-line);border-radius:14px;padding:12px 14px;display:flex;flex-direction:column;gap:8px;min-height:74px}.tile-wide{grid-column:span 2}.tile-warn{border-color:var(--amber);box-shadow:inset 0 0 0 1px #f5c5184d}.tile-label{font-family:var(--font-mono);font-size:10px;text-transform:uppercase;letter-spacing:1.5px;color:var(--ink-faint)}.tile-value{display:flex;align-items:baseline;gap:2px}.badge{display:inline-flex;align-items:center;padding:3px 10px;border-radius:999px;font-family:var(--font-mono);font-size:11px;font-weight:600;letter-spacing:.8px;text-transform:uppercase;border:1px solid var(--navy-line);background:#2b403259;color:var(--ink-dim)}.state-idle{color:var(--ink-dim)}.state-precheck{color:var(--amber);border-color:#f5c51880;background:#f5c5181a}.state-charge{color:var(--orange);border-color:#f390198c;background:#f390191f}.state-drain{color:var(--teal);border-color:#3fa38a8c;background:#3fa38a1f}.state-hold{color:var(--purple);border-color:#a779d680;background:#a779d61a}.state-complete{color:var(--green);border-color:#4ba84b8c;background:#4ba84b1f}.state-fault{color:var(--red);border-color:#d9534f99;background:#d9534f24}.fault-ok{color:var(--ink-faint)}.fault-active{color:var(--red);border-color:#d9534f99;background:#d9534f24}.warn-badge{color:var(--ink-on-orange);background:var(--amber);border-color:var(--amber)}.cell-grid{display:grid;grid-template-columns:repeat(16,1fr);gap:6px;padding:14px 16px}.cell-bar-wrap{display:flex;flex-direction:column;align-items:center;gap:3px}.cell-bar-track{width:100%;height:60px;background:var(--navy-deep);border:1px solid var(--navy-line);border-radius:4px;display:flex;align-items:flex-end;overflow:hidden}.cell-bar{width:100%;background:linear-gradient(180deg,var(--teal) 0%,#2c7462 100%);transition:height .3s ease}.cell-min .cell-bar{background:linear-gradient(180deg,var(--amber) 0%,#b8901f 100%)}.cell-max .cell-bar{background:linear-gradient(180deg,var(--orange) 0%,#b56911 100%)}.cell-out .cell-bar{background:linear-gradient(180deg,var(--red) 0%,#a3322f 100%)}.cell-out .cell-bar-track{border-color:var(--red)}.cell-val{font-family:var(--font-mono);font-size:10px;color:var(--ink-dim)}.cell-idx{font-family:var(--font-mono);font-size:9px;color:var(--ink-faint)}.cell-legend{display:flex;align-items:center;gap:8px;padding:0 16px 14px;font-size:11px;color:var(--ink-dim)}.legend-dot{width:10px;height:10px;border-radius:2px;display:inline-block;margin:0 4px 0 12px}.legend-dot:first-child{margin-left:0}.dot-min{background:var(--amber)}.dot-max{background:var(--orange)}.dot-out{background:var(--red)}.tune-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px 18px;padding:16px}@media (max-width: 520px){.tune-grid{grid-template-columns:1fr}}.tune-row{display:flex;flex-direction:column;gap:5px;padding:8px 10px;border-radius:10px;border:1px solid transparent}.tune-changed{border-color:#f3901980;background:#f3901914}.tune-top{display:flex;align-items:center;justify-content:space-between;gap:8px}.tune-label{font-size:12px;font-weight:500}.tune-unit{color:var(--ink-dim);font-weight:400}.tune-num{width:92px;background:var(--navy-deep);border:1px solid var(--navy-line);color:var(--ink);border-radius:6px;padding:4px 6px;font-family:var(--font-mono);font-size:12px;text-align:right}.tune-num:focus{outline:none;border-color:var(--orange)}.tune-slider{width:100%;accent-color:var(--orange)}.tune-meta{display:flex;align-items:center;justify-content:space-between;font-size:10px;font-family:var(--font-mono)}.tune-diff{color:var(--orange);font-weight:600}.tune-actions{display:flex;align-items:center;gap:10px;padding:0 16px 12px}.tune-crc{margin-left:auto;font-size:11px}.cmd-buttons{display:flex;gap:10px;padding:14px 16px 16px;border-top:1px solid var(--navy-line)}.offline-note{margin:0 16px 16px;padding:8px 12px;background:#d9534f1a;border:1px solid rgba(217,83,79,.4);border-radius:8px;color:#f0b0ae;font-size:12px}.btn{background:transparent;color:var(--ink);border:1px solid var(--navy-line);border-radius:999px;padding:8px 16px;font-family:var(--font-display);font-size:12px;font-weight:600;letter-spacing:.4px;cursor:pointer;transition:background .12s,border-color .12s,opacity .12s}.btn:hover:not(:disabled){background:#2b403280;border-color:var(--ink-faint)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn-primary{background:var(--orange);color:var(--ink-on-orange);border-color:var(--orange)}.btn-primary:hover:not(:disabled){background:#ffa02f;border-color:#ffa02f}.btn-go{border-color:#4ba84b8c;color:var(--green)}.btn-go:hover:not(:disabled){background:#4ba84b1f}.btn-stop{border-color:#f5c5188c;color:var(--amber)}.btn-stop:hover:not(:disabled){background:#f5c5181f}.btn-clear{border-color:#d9534f8c;color:#f0a29f}.btn-clear:hover:not(:disabled){background:#d9534f1f}.feed-panel .feed-list{max-height:360px;overflow-y:auto}.tabs{display:flex;gap:6px}.tab{background:transparent;border:1px solid var(--navy-line);color:var(--ink-dim);border-radius:999px;padding:4px 12px;font-family:var(--font-mono);font-size:11px;letter-spacing:.5px;cursor:pointer}.tab-on{background:#f390191f;color:var(--orange);border-color:#f390198c}.feed-row{display:flex;align-items:baseline;gap:10px;padding:8px 16px;border-bottom:1px solid var(--navy-line);font-size:12px}.feed-ts{color:var(--ink-faint);font-family:var(--font-mono);font-size:11px;flex-shrink:0}.feed-type{font-family:var(--font-mono);font-weight:600;font-size:11px;letter-spacing:.4px;flex-shrink:0}.ev-FAULT{color:var(--red)}.ev-FAULT_CLEARED,.ev-LINK_RESTORED{color:var(--green)}.ev-LINK_LOST{color:var(--amber)}.ev-PROFILE_APPLIED{color:var(--orange)}.feed-status{font-family:var(--font-mono);font-size:10px;font-weight:600;padding:1px 8px;border-radius:999px;border:1px solid var(--navy-line);flex-shrink:0}.st-applied{color:var(--green);border-color:#4ba84b8c}.st-pending,.st-sent{color:var(--amber);border-color:#f5c51880}.st-rejected,.st-timeout{color:var(--red);border-color:#d9534f8c}.feed-src{font-size:10px;flex-shrink:0}.feed-detail{color:var(--ink-dim);margin-left:auto;text-align:right}.fleet-view{display:flex;flex-direction:column;gap:18px}.sum-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px;padding:16px}.sum-tile{background:var(--navy);border:1px solid var(--navy-line);border-radius:14px;padding:14px;text-align:center}.sum-value{font-family:var(--font-display);font-size:24px;font-weight:700;font-variant-numeric:tabular-nums}.sum-label{font-family:var(--font-mono);font-size:11px;color:var(--ink-dim);margin-top:4px;text-transform:uppercase;letter-spacing:.8px}.sum-sub{font-size:10px;color:var(--ink-faint);margin-top:2px}.tone-ok .sum-value{color:var(--green)}.tone-warn .sum-value{color:var(--amber)}.tone-bad .sum-value{color:var(--red)}.module-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}.module-card{text-align:left;background:var(--navy-panel);border:1px solid var(--navy-line);border-radius:16px;padding:14px;cursor:pointer;display:flex;flex-direction:column;gap:12px;color:var(--ink);transition:border-color .12s,transform .12s}.module-card:hover{border-color:var(--orange);transform:translateY(-2px)}.card-offline{opacity:.7}.card-head{display:flex;align-items:center;gap:8px}.card-name{font-family:var(--font-display);font-weight:600;font-size:15px}.card-id{margin-left:auto;font-size:11px}.card-badges{display:flex;gap:8px;flex-wrap:wrap}.card-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.card-metric{display:flex;flex-direction:column;gap:2px}.cm-label{font-family:var(--font-mono);font-size:10px;color:var(--ink-faint);text-transform:uppercase;letter-spacing:.8px}.cm-value{font-size:14px;font-weight:600;font-variant-numeric:tabular-nums}.toast-stack{position:fixed;right:20px;bottom:20px;display:flex;flex-direction:column;gap:10px;z-index:100;max-width:380px}.toast{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border-radius:12px;border:1px solid var(--navy-line);background:var(--navy-panel);box-shadow:0 8px 24px #00000080;font-size:13px;animation:toast-in .16s ease}.toast-ok{border-color:#4ba84b8c}.toast-warn{border-color:var(--amber)}.toast-error{border-color:var(--red)}.toast-msg{flex:1}.toast-x{background:none;border:none;color:var(--ink-dim);cursor:pointer;font-size:16px;line-height:1}@keyframes toast-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
