/* EVC Explorer PRO — dark diagnostics dashboard, TBX-family styling. */

.evc {
	--bg: #0a0f1a; --panel: #111827; --panel-2: #0d1424; --line: #1f2937;
	--blue: #3b82f6; --blue-hi: #60a5fa; --amber: #f59e0b; --red: #ef4444;
	--green: #22c55e; --text: #e5e7eb; --muted: #6b7280;
	background: var(--bg); color: var(--text);
	font-family: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
	border-radius: 12px; overflow: hidden; border: 1px solid var(--line);
	min-height: 760px; display: flex; flex-direction: column;
}
.evc *, .evc *::before, .evc *::after { box-sizing: border-box; }

/* ===== persistent debug console dock ===== */
.evc-dock { border-top: 2px solid var(--line); background: #080d16; display: flex; flex-direction: column; flex: none; height: 300px; transition: height .15s ease; }
.evc-dock.is-collapsed { height: 34px; }
.evc-dock.is-collapsed .evc-dock-log, .evc-dock.is-collapsed .evc-dock-send, .evc-dock.is-collapsed .evc-replay { display: none; }
.evc-dock-bar { display: flex; align-items: center; gap: 14px; padding: 4px 12px; background: #0d1424; border-bottom: 1px solid var(--line); flex-wrap: wrap; min-height: 34px; }
.evc-dock-toggle { background: none; border: none; color: var(--blue-hi); font-weight: 700; font-size: 12px; cursor: pointer; padding: 4px 6px; }
.evc-dock-filters { display: flex; gap: 10px; font-size: 11px; color: var(--muted); }
.evc-dock-filters label { display: flex; align-items: center; gap: 3px; cursor: pointer; }
.evc-dock-filters input { accent-color: var(--blue); }
.evc-dock-stats { display: flex; gap: 12px; font-size: 11px; color: var(--muted); font-variant-numeric: tabular-nums; }
.evc-dock-stats b { color: var(--text); }
.evc-dock-actions { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.evc-dock-chk { display: flex; align-items: center; gap: 3px; font-size: 11px; color: var(--muted); cursor: pointer; }
.evc-dock-btn { background: #111827; border: 1px solid var(--line); color: var(--text); border-radius: 6px; padding: 4px 10px; font-size: 11px; cursor: pointer; }
.evc-dock-btn:hover { border-color: var(--blue); }
.evc-dock-save { position: relative; }
.evc-dock-menu { position: absolute; right: 0; bottom: 100%; margin-bottom: 4px; background: #0d1424; border: 1px solid var(--line); border-radius: 8px; padding: 4px; display: flex; flex-direction: column; gap: 2px; min-width: 200px; z-index: 20; box-shadow: 0 8px 24px rgba(0,0,0,.5); }
/* the [hidden] attribute must win over the display:flex above (author CSS beats
   the UA [hidden]{display:none}, or the Save menu would never close) */
.evc-dock-menu[hidden] { display: none; }
.evc-dock-menu button { text-align: left; background: none; border: none; color: var(--text); padding: 7px 10px; border-radius: 5px; font-size: 12px; cursor: pointer; }
.evc-dock-menu button:hover { background: var(--blue); }

.evc-replay { display: flex; align-items: center; gap: 10px; padding: 6px 12px; background: #0b1220; border-bottom: 1px solid var(--line); font-size: 11px; color: var(--muted); }
.evc-replay-name { color: var(--blue-hi); font-weight: 600; }
.evc-replay-btn { background: #111827; border: 1px solid var(--line); color: var(--text); border-radius: 6px; padding: 3px 9px; font-size: 11px; cursor: pointer; }
.evc-replay-btn:hover { border-color: var(--blue); }
.evc-replay select { background: #111827; border: 1px solid var(--line); color: var(--text); border-radius: 5px; padding: 2px 4px; }
.evc-replay input[type=range] { flex: 1; accent-color: var(--blue); }
.evc-replay-pos { font-variant-numeric: tabular-nums; }

.evc-dock-log { flex: 1; overflow-y: auto; padding: 8px 12px; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 12px; line-height: 1.55; background: #060a12; }
.evc-logrow { display: flex; gap: 8px; align-items: baseline; white-space: pre-wrap; word-break: break-all; }
.evc-log-tag { font-weight: 700; font-size: 10px; padding: 0 5px; border-radius: 3px; flex: none; letter-spacing: .5px; }
.evc-tag-tx { background: rgba(245,158,11,.15); color: var(--amber); }
.evc-tag-rx, .evc-tag-can { background: rgba(96,165,250,.15); color: var(--blue-hi); }
.evc-tag-status { background: rgba(34,197,94,.15); color: var(--green); }
.evc-tag-cmd { background: rgba(168,85,247,.18); color: #c4b5fd; }
.evc-tag-info { background: rgba(107,114,128,.2); color: var(--muted); }
.evc-log-id { color: #fbbf24; font-size: 11px; flex: none; }
.evc-log-body { flex: 1; }

.evc-dock-send { display: flex; align-items: center; gap: 8px; padding: 8px 12px; border-top: 1px solid var(--line); background: #0d1424; }
.evc-dock-send input { flex: 1; background: #060a12; border: 1px solid var(--line); border-radius: 7px; color: var(--text); padding: 8px 12px; font-family: monospace; font-size: 13px; }
.evc-dock-send input:focus { outline: none; border-color: var(--blue); }
@media (max-width: 900px) { .evc-dock { height: 240px; } .evc-dock-filters, .evc-dock-stats { display: none; } }

/* ---------- header ---------- */
.evc-header {
	display: flex; align-items: center; gap: 20px;
	padding: 12px 20px; background: var(--panel-2);
	border-bottom: 1px solid var(--line);
	box-shadow: 0 1px 0 0 rgba(245,158,11,.22);
}
.evc-brand { font-weight: 600; font-size: 18px; color: var(--blue-hi); display: flex; align-items: baseline; gap: 8px; white-space: nowrap; }
.evc-brand-pro { color: var(--amber); font-weight: 700; letter-spacing: 1px; font-size: 13px; }
.evc-ver { color: var(--muted); font-size: 12px; font-weight: 500; }

/* signature: CAN bus activity strip */
.evc-busstrip { flex: 1; height: 30px; display: flex; align-items: center; gap: 3px; overflow: hidden; opacity: .55; }
.evc-busstrip span { flex: 1; height: 100%; background: linear-gradient(to top, transparent, rgba(96,165,250,.35)); border-radius: 1px; transform: scaleY(.2); transform-origin: bottom; transition: transform .12s ease; }
.evc-busstrip span.hot { transform: scaleY(1); background: linear-gradient(to top, transparent, var(--amber)); }

.evc-header-status { display: flex; align-items: center; gap: 10px; margin-left: auto; }
.evc-pill { display: inline-flex; align-items: center; gap: 7px; font-size: 12.5px; color: #cbd5e1; padding: 5px 10px; border-radius: 999px; background: rgba(255,255,255,.02); border: 1px solid var(--line); white-space: nowrap; }
.evc-pill.is-live { box-shadow: 0 0 0 1px var(--amber), 0 0 14px -4px var(--amber); }
.evc-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--muted); }
.evc-dot-off { background: var(--red); } .evc-dot-on { background: var(--green); }
.evc-icon-btn { background: transparent; color: var(--muted); border: 1px solid var(--line); border-radius: 6px; width: 30px; height: 28px; cursor: pointer; }
.evc-icon-btn:hover { color: var(--text); border-color: var(--blue); }

/* ---------- layout ---------- */
.evc-body { display: flex; flex: 1; min-height: 0; }
.evc-sidebar { width: 246px; background: var(--panel-2); border-right: 1px solid var(--line); padding: 12px 10px; overflow-y: auto; flex-shrink: 0; }
.evc-nav { display: flex; flex-direction: column; gap: 2px; }
.evc-nav-group { font-size: 10.5px; color: var(--muted); text-transform: uppercase; letter-spacing: .7px; margin: 14px 8px 5px; }
.evc-nav-item { display: flex; align-items: center; gap: 10px; background: transparent; color: #cbd5e1; border: none; border-radius: 8px; padding: 9px 11px; font-size: 13.5px; text-align: left; cursor: pointer; width: 100%; }
.evc-nav-item:hover { background: rgba(255,255,255,.03); color: var(--text); }
.evc-nav-item.is-active { background: var(--blue); color: #fff; }
.evc-nav-item.is-active .evc-nav-ecu { color: rgba(255,255,255,.8); border-color: rgba(255,255,255,.3); }
.evc-nav-ic { font-size: 15px; width: 18px; text-align: center; }
.evc-nav-ecu { margin-left: auto; font-size: 10px; color: var(--muted); border: 1px solid var(--line); border-radius: 4px; padding: 1px 5px; letter-spacing: .5px; }

.evc-main { flex: 1; padding: 22px 26px; overflow-y: auto; min-width: 0; }
.evc-h1 { font-size: 22px; font-weight: 600; margin: 0; }

/* ---------- system head ---------- */
.evc-syshead { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; gap: 16px; }
.evc-syshead-meta { font-size: 12.5px; color: var(--muted); font-variant-numeric: tabular-nums; }

/* ---------- dashboard cards ---------- */
.evc-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.evc-cards2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.evc-card { background: var(--panel); border: 1px solid var(--line); border-radius: 10px; padding: 16px 18px; }
.evc-card-h { color: var(--blue-hi); font-size: 14px; font-weight: 600; margin: 0 0 14px; }
.evc-kv { margin: 0; } .evc-kv > div { display: flex; justify-content: space-between; align-items: baseline; padding: 7px 0; border-bottom: 1px dashed rgba(31,41,55,.7); }
.evc-kv > div:last-child { border-bottom: none; }
.evc-kv dt { color: var(--muted); font-size: 13px; margin: 0; }
.evc-kv dd { margin: 0; font-size: 13.5px; font-variant-numeric: tabular-nums; }
.evc-kv dd.is-bad { color: var(--red); font-weight: 600; } .evc-kv dd.is-ok { color: var(--green); font-weight: 600; }

/* ---------- buttons ---------- */
.evc-actions { display: flex; gap: 12px; margin: 18px 0 24px; }
.evc-btn { border: none; border-radius: 7px; padding: 10px 16px; font-size: 13.5px; font-weight: 600; cursor: pointer; transition: filter .12s ease, opacity .12s ease; }
.evc-btn:disabled { opacity: .4; cursor: not-allowed; }
.evc-btn:not(:disabled):hover { filter: brightness(1.1); }
.evc-btn-primary { background: var(--blue); color: #fff; }
.evc-btn-ghost { background: transparent; color: #cbd5e1; border: 1px solid var(--line); }
.evc-btn-report { background: #7c4a0f; color: #fde68a; border: 1px solid #92580f; }

/* ---------- report ---------- */
.evc-report { background: var(--panel); border: 1px solid var(--line); border-left: 3px solid var(--amber); border-radius: 10px; padding: 18px 20px; }
.evc-report-h { color: var(--amber); font-size: 15px; margin: 0 0 8px; }
.evc-report-sub { color: var(--muted); font-size: 13px; margin: 0 0 14px; line-height: 1.5; }

/* ---------- system view: main + action rail ---------- */
.evc-sysgrid { display: grid; grid-template-columns: 1fr 300px; gap: 20px; align-items: start; }
.evc-sysgrid-norail { grid-template-columns: 1fr; }
.evc-sysmain { min-width: 0; }
.evc-subtabs { display: flex; gap: 4px; margin-bottom: 16px; border-bottom: 1px solid var(--line); }
.evc-subtab { background: transparent; border: none; color: var(--muted); padding: 8px 14px; font-size: 13px; cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.evc-subtab:hover { color: var(--text); }
.evc-subtab.is-active { color: var(--blue-hi); border-bottom-color: var(--blue); }
.evc-subpanel { display: none; } .evc-subpanel.is-active { display: block; }

.evc-actionrail { background: var(--panel-2); border: 1px solid var(--line); border-radius: 10px; padding: 14px; position: sticky; top: 0; }
.evc-rail-title { font-size: 12px; color: var(--amber); text-transform: uppercase; letter-spacing: .6px; margin-bottom: 12px; }
.evc-rail-group { margin-bottom: 14px; }
.evc-rail-group h4 { font-size: 11px; color: var(--muted); text-transform: uppercase; letter-spacing: .5px; margin: 0 0 6px; }
.evc-actbtn { display: block; width: 100%; text-align: left; background: var(--panel); color: #d1d5db; border: 1px solid var(--line); border-radius: 6px; padding: 8px 10px; font-size: 12.5px; cursor: pointer; margin-bottom: 4px; }
.evc-actbtn:hover { border-color: var(--blue); color: #fff; }
.evc-actbtn.is-danger:hover { border-color: var(--red); color: #fecaca; }
.evc-actbtn.is-toggle.is-on { background: var(--green); color: #052e16; border-color: var(--green); }

/* ---------- signal tiles ---------- */
.evc-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.evc-grid-temps { grid-template-columns: repeat(6, 1fr); gap: 8px; }
.evc-tile { background: var(--panel); border: 1px solid var(--line); border-radius: 10px; padding: 14px 16px; display: flex; flex-direction: column; gap: 6px; transition: border-color .3s ease; }
.evc-tile.is-fresh { border-color: var(--amber); }
.evc-tile-sm { padding: 10px 12px; }
.evc-tile-l { color: var(--muted); font-size: 12px; text-transform: uppercase; letter-spacing: .4px; }
.evc-tile-v { font-size: 24px; font-weight: 600; font-variant-numeric: tabular-nums; }
.evc-tile-sm .evc-tile-v { font-size: 16px; }

/* ---------- cell modules ---------- */
.evc-packbar { display: flex; gap: 22px; background: var(--panel); border: 1px solid var(--line); border-radius: 8px; padding: 10px 16px; margin-bottom: 14px; font-size: 12.5px; color: var(--muted); }
.evc-packbar-wrap { flex-wrap: wrap; gap: 14px 22px; }
.evc-packbar b { color: var(--text); font-variant-numeric: tabular-nums; margin-left: 6px; }
.evc-packbar .evc-legend { margin-left: auto; font-size: 11px; color: #64748b; }

/* serpentine: 2 columns × 8 rows, column-first fill → 1-8 left, 9-16 right */
.evc-modules { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: repeat(8, auto); grid-auto-flow: column; gap: 10px; }
.evc-module { background: var(--panel); border: 1px solid var(--line); border-radius: 8px; padding: 10px; }
.evc-module.is-fault { border-color: var(--red); box-shadow: inset 0 0 0 1px var(--red); }
.evc-module-h { font-size: 11px; color: var(--blue-hi); font-weight: 600; margin-bottom: 8px; }
.evc-module-cells { display: grid; grid-template-columns: repeat(3, 1fr); gap: 5px; }
.evc-cell { background: #0b1220; border: 1px solid var(--line); border-radius: 5px; padding: 5px 3px; text-align: center; font-size: 11px; font-variant-numeric: tabular-nums; }
.evc-cell small { display: block; color: var(--muted); font-size: 9px; margin-bottom: 3px; }
.evc-cell span { display: block; }
.evc-cell em { font-style: normal; color: var(--muted); font-size: 9px; }
.evc-cell.is-min { border-color: var(--amber); } .evc-cell.is-max { border-color: var(--green); }
.evc-cell.is-fault { border-color: var(--red); background: rgba(239,68,68,.08); }
.evc-cell-cac span, .evc-cell-dsoc span { color: var(--blue-hi); }
.evc-cell .evc-res { color: #f8b4b4; }

/* fault bar: fill width = value, color = severity (set in JS) */
.evc-bar { height: 5px; background: #1e293b; border-radius: 3px; overflow: hidden; margin: 3px 0; }
.evc-bar i { display: block; height: 100%; width: 0; background: var(--green); transition: width .2s ease, background .2s ease; }
.evc-bar i.warn { background: var(--amber); } .evc-bar i.bad { background: var(--red); }
.evc-bar-r { margin-top: 5px; }

.evc-module-mm { display: flex; justify-content: space-between; margin-top: 8px; font-size: 10px; color: var(--muted); }
.evc-module-mm b { color: #cbd5e1; }

/* ---------- alerts ---------- */
.evc-alerts { display: flex; flex-direction: column; gap: 8px; margin-top: 12px; }
.evc-alert-ok { color: var(--green); font-size: 14px; background: var(--panel); border: 1px solid var(--line); border-left: 3px solid var(--green); border-radius: 8px; padding: 14px 16px; }
.evc-alert-group { background: var(--panel); border: 1px solid var(--line); border-left: 3px solid var(--red); border-radius: 8px; padding: 12px 14px; }
.evc-alert-group h3 { margin: 0 0 8px; font-size: 13px; color: var(--red); }
.evc-alert-group ul { margin: 0; padding-left: 18px; } .evc-alert-group li { font-size: 13px; color: #fca5a5; padding: 2px 0; }

/* ---------- setup ---------- */
.evc-bus { display: flex; align-items: center; gap: 10px; padding: 9px 4px; border-bottom: 1px dashed rgba(31,41,55,.7); font-size: 13.5px; }
.evc-bus:last-child { border-bottom: none; }
.evc-bus-name { flex: 1; } .evc-bus-speed { color: var(--muted); font-size: 12px; font-variant-numeric: tabular-nums; }
.evc-bus-soon { opacity: .5; }

/* ---------- console ---------- */
.evc-console { background: #060a12; border: 1px solid var(--line); border-radius: 8px; height: 440px; overflow-y: auto; padding: 12px 14px; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 12.5px; line-height: 1.6; }
.evc-line-info { color: #93c5fd; } .evc-line-ok { color: var(--green); } .evc-line-err { color: var(--red); }
.evc-line-muted { color: var(--muted); } .evc-line-tx { color: var(--amber); }
.evc-line-rx { color: #6ee7b7; }

/* diagnostic response box (desktop blue box) */
.evc-respbox-wrap { margin-top: 14px; }
.evc-respbox-h { display: flex; align-items: center; justify-content: space-between; font-size: 12px; font-weight: 600; color: var(--blue-hi); margin-bottom: 6px; }
.evc-respbox { background: #0b1220; border: 1px solid var(--line); border-radius: 8px; padding: 10px 12px; min-height: 120px; max-height: 320px; overflow-y: auto; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; }
.evc-respbox:empty::before { content: '—'; color: var(--muted); }
.evc-resp-err { color: #fca5a5; padding: 2px 0; }
.evc-resp-ok { color: var(--green); padding: 2px 0; }
.evc-resp-muted { color: #93a3b8; padding: 2px 0; }
.evc-respclear { width: auto; padding: 2px 10px; }
.evc-line-ts { color: #475569; margin-right: 8px; }
.evc-send { display: flex; align-items: center; gap: 8px; margin-top: 12px; }
.evc-send-lt, .evc-send-gt { color: var(--amber); font-family: monospace; font-size: 18px; }
.evc-send input { flex: 1; background: #060a12; border: 1px solid var(--line); border-radius: 7px; color: var(--text); padding: 10px 12px; font-family: monospace; font-size: 13px; }
.evc-send input:focus { outline: none; border-color: var(--blue); }
.evc-muted { color: var(--muted); font-size: 13px; }

/* ---------- responsive ---------- */
@media (max-width: 1160px) {
	.evc-sysgrid { grid-template-columns: 1fr; } .evc-actionrail { position: static; }
	.evc-cards { grid-template-columns: repeat(2, 1fr); }
	.evc-grid { grid-template-columns: repeat(2, 1fr); } .evc-grid-temps { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 720px) {
	.evc-body { flex-direction: column; } .evc-sidebar { width: 100%; border-right: none; border-bottom: 1px solid var(--line); }
	.evc-cards, .evc-cards2, .evc-grid { grid-template-columns: 1fr; } .evc-busstrip { display: none; }
	.evc-modules { grid-template-columns: 1fr; grid-template-rows: none; grid-auto-flow: row; }
}
@media (prefers-reduced-motion: reduce) { .evc-busstrip span, .evc-tile { transition: none; } }

/* ---------- read bar (Start/Stop) ---------- */
.evc-readbar { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.evc-readbtn.is-reading { background: var(--red); }
.evc-readhint { font-size: 12px; color: var(--muted); }

/* ---------- bus select buttons (exclusive relay switch) ---------- */
.evc-busbtns { display: flex; flex-direction: column; gap: 8px; margin-top: 6px; }
.evc-busbtn { display: flex; align-items: center; justify-content: space-between; background: var(--panel-2); color: #cbd5e1; border: 1px solid var(--line); border-radius: 8px; padding: 12px 14px; cursor: pointer; font-size: 13.5px; }
.evc-busbtn:hover { border-color: var(--blue); color: #fff; }
.evc-busbtn.is-active { background: var(--blue); color: #fff; border-color: var(--blue); }
.evc-busbtn.is-active .evc-bus-speed { color: rgba(255,255,255,.8); }
.evc-busbtn .evc-bus-name { font-weight: 600; }

/* ---------- fullscreen ---------- */
.evc:fullscreen { border-radius: 0; border: 0; height: 100vh; width: 100vw; }
.evc:-webkit-full-screen { border-radius: 0; border: 0; height: 100vh; width: 100vw; }
/* CSS fallback when native requestFullscreen is blocked. The app is re-parented
   to <body> (see app.js) so this fixed layer escapes transformed theme wrappers. */
.evc.evc-css-fs { position: fixed; inset: 0; width: 100vw; height: 100vh; z-index: 2147483647; border-radius: 0; border: 0; margin: 0; }
/* lock page scroll behind the CSS-fullscreen overlay */
html.evc-fs-lock, html.evc-fs-lock body { overflow: hidden !important; }

/* seq badge on multi-frame C-command actions */
.evc-actbtn-seq { float: right; font-size: 9px; color: var(--amber); border: 1px solid var(--amber); border-radius: 3px; padding: 0 4px; opacity: .8; }

/* CAC: desktop layout — 3×2 horizontal green Ah bars + red TVSH BMB R mOhm block */
.evc-sensors { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; align-items: end; }
.evc-sensor { display: flex; flex-direction: column; align-items: center; gap: 3px; }
.evc-sbar { width: 100%; height: 46px; background: #0b1220; border: 1px solid var(--line); border-radius: 4px; display: flex; align-items: flex-end; overflow: hidden; }
.evc-sbar i { display: block; width: 100%; height: 0; background: var(--green); transition: height .2s ease, background .2s ease; }
.evc-sbar i.warn { background: var(--amber); } .evc-sbar i.bad { background: var(--red); }
.evc-sensor span { font-size: 10px; font-variant-numeric: tabular-nums; color: var(--blue-hi); }
.evc-sensor small { font-size: 9px; color: var(--muted); }

.evc-cacwrap { display: flex; gap: 10px; align-items: flex-start; }
.evc-cac-grid { flex: 1; display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px 8px; }
.evc-cac-cell { font-size: 11px; font-variant-numeric: tabular-nums; }
.evc-cac-cell .evc-bar { height: 11px; margin: 0 0 3px; }               /* desktop-style thick bar */
.evc-cac-cell span { color: var(--blue-hi); font-weight: 600; }
.evc-cac-cell em { font-style: normal; color: var(--blue-hi); font-size: 10px; margin-left: 3px; }
.evc-cac-cell.is-min span { background: var(--amber); color: #111; border-radius: 3px; padding: 0 3px; }   /* desktop orange = lowest CAC */
.evc-cac-cell.is-max span { background: #adff2f; color: #111; border-radius: 3px; padding: 0 3px; }        /* desktop green-yellow = highest */

.evc-acirblock { width: 104px; flex: none; }
.evc-acir-h { background: crimson; color: #fff; font-size: 8px; font-weight: 700; letter-spacing: .4px; text-align: center; padding: 2px 0; border-radius: 3px; }
.evc-acir-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 5px 4px; margin-top: 5px; text-align: center; }
.evc-acir-v { font-size: 11px; font-weight: 700; font-variant-numeric: tabular-nums; color: #ef4444; }
.evc-acir-v:nth-child(7) { grid-column: 1 / -1; }                        /* 7th wire centered, like desktop */
.evc-acir-v.is-hi { color: #fff; background: var(--red); border-radius: 3px; }

/* BMS V: cells | temps | min-ΔU-max, desktop layout */
.evc-vwrap { display: flex; gap: 10px; align-items: center; }
.evc-vwrap .evc-module-cells { flex: 1; }
.evc-vtemps { display: flex; flex-direction: column; gap: 10px; flex: none; }
.evc-vtemps b { color: #fbbf24; font-size: 11px; font-variant-numeric: tabular-nums; display: block; text-align: right; }
.evc-vtemps small { color: var(--blue-hi); font-size: 9px; display: block; text-align: right; }
.evc-vmm { display: flex; flex-direction: column; gap: 4px; flex: none; font-size: 10px; color: var(--muted); min-width: 74px; }
.evc-vmm b { font-variant-numeric: tabular-nums; }
.evc-red { color: #ef4444 !important; } .evc-blu { color: var(--blue-hi) !important; } .evc-grn { color: var(--green) !important; }

/* Active Alert Codes: per-CAN-ID blocks (desktop 3-column boxes) */
.evc-alertgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.evc-alertbox { background: var(--panel); border: 1px solid var(--line); border-radius: 8px; padding: 10px; min-height: 110px; }
.evc-alertbox.is-fault { border-color: var(--red); box-shadow: inset 0 0 0 1px var(--red); }
.evc-alertbox-h { font-size: 11px; font-weight: 700; color: var(--blue-hi); margin-bottom: 6px; display: flex; align-items: center; gap: 6px; }
.evc-alertbox-list { list-style: none; margin: 0; padding: 0; font-size: 10px; }
.evc-alertbox-list li { padding: 2px 0; border-bottom: 1px dashed var(--line); color: #fca5a5; }
.evc-alertbox-list li.evc-ok { color: var(--green); border: none; }
.evc-alertbox-list li.evc-muted { color: var(--muted); border: none; }
.evc-dot-done { background: var(--blue-hi); }
.evc-rescan { width: auto; padding: 3px 12px; margin-left: auto; }
@media (max-width: 900px) { .evc-alertgrid { grid-template-columns: 1fr; } }

/* panel view: desktop GroupBox cards of label:value rows */
.evc-panelgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; align-items: start; }
.evc-panelcard { padding: 12px 14px; }
.evc-panelrow { display: flex; justify-content: space-between; gap: 10px; padding: 4px 0; border-bottom: 1px dashed var(--line); font-size: 12px; }
.evc-panelrow:last-child { border-bottom: none; }
.evc-panelrow-l { color: var(--muted); }
.evc-panelrow-v { color: var(--blue-hi); font-weight: 600; font-variant-numeric: tabular-nums; text-align: right; }

/* CANBUS status tiles (desktop Charger footer: 71E NOT OK ...) */
.evc-busokgrid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.evc-busok { background: var(--panel); border: 1px solid var(--line); border-radius: 8px; padding: 14px 10px; display: flex; align-items: center; justify-content: center; gap: 12px; }
.evc-busok-id { font-size: 15px; font-weight: 800; color: #e2e8f0; }
.evc-busok-v { font-size: 13px; font-weight: 800; }
.evc-busok-v.is-ok { color: var(--green); } .evc-busok-v.is-bad { color: var(--red); }
@media (max-width: 900px) { .evc-busokgrid { grid-template-columns: repeat(2, 1fr); } }

/* DBC alerts view */
.evc-dbcalert-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; margin-top: 12px; }
.evc-alertbox-wrap { background: var(--card); border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.evc-alertbox-h { padding: 8px 12px; font-size: 12px; font-weight: 700; color: var(--blue-hi); border-bottom: 1px solid var(--line); background: #0d1424; }
.evc-alertbox { list-style: none; margin: 0; padding: 6px 12px; font-size: 12px; max-height: 220px; overflow-y: auto; }
.evc-alertbox li { padding: 3px 0; }
.evc-alertbox .evc-ok { color: var(--muted); }
.evc-alertbox .evc-fault { color: var(--red); font-weight: 600; }
.evc-alertbox-wrap.is-polling { border-color: var(--blue); box-shadow: 0 0 0 1px var(--blue) inset; }
.evc-alertbox-wrap.is-polling .evc-alertbox-h { color: #fff; }

/* DBC-driven live view */
.evc-dbclive-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; gap: 12px; flex-wrap: wrap; }
.evc-dbclive-tog { font-size: 11px; color: var(--muted); display: flex; align-items: center; gap: 5px; cursor: pointer; }
.evc-dbccard .evc-panelrow-l i { color: var(--muted); font-style: normal; font-size: 11px; }
.evc-dbccard .evc-panelrow-v.is-fresh { color: #fff; }
.evc-dbcpin { background: none; border: none; cursor: pointer; font-size: 12px; opacity: .3; filter: grayscale(1); padding: 0 4px 0 0; }
.evc-dbcpin:hover { opacity: .7; }
.evc-dbcpin.is-pinned { opacity: 1; filter: none; }
.evc-panelrow-v.is-fresh { animation: evc-flash .3s ease; }
@keyframes evc-flash { 0% { color: #fff; } 100% { color: var(--blue-hi); } }

/* DBC Explorer */
.evc-dbc-input { width: 100%; background: #060a12; border: 1px solid var(--line); border-radius: 7px; color: var(--text); padding: 9px 12px; font-family: monospace; font-size: 13px; margin: 6px 0; }
.evc-dbc-input:focus { outline: none; border-color: var(--blue); }
.evc-dbc-decrow { display: flex; gap: 8px; align-items: center; }
.evc-dbc-decrow .evc-dbc-input { flex: 1; }
.evc-dbc-result, .evc-dbc-detail { margin-top: 12px; }
.evc-dbc-msgname { font-size: 14px; font-weight: 700; color: var(--blue-hi); margin-bottom: 8px; }
.evc-dbc-bus { font-size: 11px; font-weight: 500; color: var(--muted); margin-left: 8px; }
.evc-dbc-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.evc-dbc-table th { text-align: left; color: var(--muted); font-weight: 600; padding: 5px 8px; border-bottom: 1px solid var(--line); font-size: 11px; text-transform: uppercase; letter-spacing: .4px; }
.evc-dbc-table td { padding: 5px 8px; border-bottom: 1px solid #131b2b; font-variant-numeric: tabular-nums; }
.evc-dbc-val { color: var(--blue-hi); font-weight: 600; } .evc-dbc-val.is-enum { color: #fbbf24; font-weight: 600; }
.evc-dbc-unit { color: var(--muted); } .evc-dbc-raw { color: #64748b; font-family: monospace; }
.evc-dbc-hits { margin-top: 8px; display: flex; flex-direction: column; gap: 4px; max-height: 340px; overflow-y: auto; }
.evc-dbc-hit { display: flex; gap: 10px; align-items: center; background: #0d1424; border: 1px solid var(--line); border-radius: 6px; padding: 7px 10px; cursor: pointer; text-align: left; color: var(--text); }
.evc-dbc-hit:hover { border-color: var(--blue); }
.evc-dbc-hit-id { color: #fbbf24; font-family: monospace; font-size: 12px; flex: none; width: 54px; }
.evc-dbc-hit-name { font-weight: 600; flex: 1; }
.evc-dbc-hit-bus { color: var(--muted); font-size: 11px; }
.evc-dbc-hit-n { color: var(--muted); font-size: 11px; }
.evc-dbc-detail { margin-top: 16px; }

/* BMS V: per-module temperature footer */
.evc-module-temps b { color: #fbbf24; }

/* ===== BMB Bench (UART daisy-chain bench tool) ===== */
.evc-brand-pro { color: var(--amber); }
.evc-bmb-note { background: rgba(245,158,11,.08); border: 1px solid rgba(245,158,11,.3); border-radius: 8px; padding: 9px 14px; font-size: 12px; color: #fcd9a3; margin-bottom: 14px; }
.evc-bmb-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 8px 0; }
.evc-bmb-status { margin-top: 8px; font-size: 12px; color: var(--muted); font-variant-numeric: tabular-nums; }
.evc-bmb-status.is-ok { color: var(--green); } .evc-bmb-status.is-bad { color: var(--red); }
.evc-bmb-modlist table { margin-top: 4px; }
.evc-bmb-set { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--muted); margin: 8px 0; }
.evc-bmb-set input { width: 84px; background: #060a12; border: 1px solid var(--line); border-radius: 6px; color: var(--text); padding: 6px 8px; font-family: monospace; font-size: 13px; }
.evc-bmb-set input:focus { outline: none; border-color: var(--blue); }

/* monitor cards */
.evc-bmb-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); gap: 14px; }
.evc-bmb-modcard.is-bleeding { border-color: var(--amber); box-shadow: inset 0 0 0 1px rgba(245,158,11,.5); }
.evc-bmb-cellrow { display: grid; grid-template-columns: repeat(6, 1fr); gap: 4px; margin: 8px 0; }
.evc-bmb-cellrow .evc-cell span { font-size: 11px; }
.evc-bmb-modfoot { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 11.5px; color: var(--muted); border-top: 1px solid var(--line); padding-top: 8px; }
.evc-bmb-modfoot b { color: var(--text); font-variant-numeric: tabular-nums; }

/* balance rows */
.evc-bmb-balrow { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 8px 0; border-bottom: 1px solid var(--line); }
.evc-bmb-balrow-h { font-family: monospace; color: #fbbf24; width: 46px; flex: none; }
.evc-bmb-balcells { display: flex; gap: 10px; flex-wrap: wrap; flex: 1; }
.evc-bmb-balcell { display: flex; align-items: center; gap: 4px; font-size: 12px; color: #d1d5db; cursor: pointer; }
.evc-bmb-balcell input { accent-color: var(--amber); }
.evc-bmb-balcell em { font-style: normal; color: var(--muted); font-size: 10.5px; font-variant-numeric: tabular-nums; }
.evc-bmb-balmask { font-size: 12px; color: var(--muted); } .evc-bmb-balmask b { color: #fbbf24; font-family: monospace; }
.evc-bmb-balrow .evc-btn { padding: 6px 12px; font-size: 12px; } .evc-bmb-balrow .evc-actbtn { width: auto; margin: 0; }
.evc-bmb-wd { font-size: 12px; color: var(--muted); margin-left: auto; }

/* DCir */
.evc-bmb-dcir-ctrl { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 10px 0; }
.evc-bmb-dcir-out { margin-top: 12px; } .evc-bmb-dcir-out table { margin-top: 6px; }
.evc-bmb-dcir-out td.evc-fault { color: var(--red); font-weight: 700; }

/* raw */
.evc-bmb-raw-out { margin-top: 12px; background: #0b1220; border: 1px solid var(--line); border-radius: 8px; padding: 10px 12px; min-height: 80px; max-height: 300px; overflow-y: auto; font-family: ui-monospace, monospace; font-size: 12px; }
.evc-bmb-raw-out:empty::before { content: 'responses appear here…'; color: var(--muted); }
.evc-bmb-row select { background: #060a12; border: 1px solid var(--line); color: var(--text); border-radius: 6px; padding: 6px 8px; }
.evc-bmb-row input[data-bmb-rawin] { flex: 1; min-width: 160px; }
.evc-ok { color: var(--green); } .evc-fault { color: var(--red); }

/* BMB heatmap (module groups) + tap-test */
.evc-bmb-heatlegend { font-size: 11.5px; color: var(--muted); margin: -4px 0 12px; }
.evc-bmb-heatlegend .evc-hl-lo { color: #d1493f; } .evc-bmb-heatlegend .evc-hl-hi { color: #46a046; }
.evc-bmb-heat { display: grid; grid-template-columns: repeat(3, 1fr); gap: 5px; margin: 8px 0; padding: 6px; border-radius: 8px; border: 1px solid var(--line); background-size: cover; background-position: center; }
.evc-bmb-zone { position: relative; min-height: 82px; border-radius: 6px; border: 2px solid transparent; display: flex; flex-direction: column; align-items: center; justify-content: center; background: rgba(30,41,59,.5); transition: background .25s ease; }
.evc-bmb-zone.is-min { border-color: var(--red); box-shadow: 0 0 0 1px var(--red); }
.evc-bmb-zone.is-max { border-color: var(--green); box-shadow: 0 0 0 1px var(--green); }
.evc-bmb-znum { position: absolute; top: 3px; left: 5px; font-size: 11px; font-weight: 800; color: #fff; text-shadow: 0 1px 3px #000, 0 0 2px #000; }
.evc-bmb-zv { font-size: 16px; font-weight: 800; color: #fff; font-variant-numeric: tabular-nums; text-shadow: 0 1px 3px #000, 0 0 3px #000; }
.evc-bmb-zjit { position: absolute; top: 1px; right: 3px; font-size: 12px; }
.evc-bmb-tchip { font-variant-numeric: tabular-nums; }
/* per-cell IR self-test button */
.evc-bmb-balcellwrap { display: inline-flex; align-items: center; gap: 3px; }
.evc-bmb-celltest { background: #111827; border: 1px solid var(--line); border-radius: 5px; cursor: pointer; font-size: 11px; line-height: 1; padding: 3px 5px; }
.evc-bmb-celltest:hover { border-color: var(--amber); }

/* BMB PCB resistor map (base) */
/* compact + dashed when there's no photo yet; fills out once a photo loads */
.evc-bmb-pcb { position: relative; border: 1px dashed var(--line); border-radius: 8px; background-size: contain; background-repeat: no-repeat; background-position: left center; padding: 10px; display: flex; gap: 14px; align-items: flex-start; justify-content: space-between; margin: 8px 0; flex-wrap: wrap; }
.evc-bmb-pcb.has-img { min-height: 240px; border-style: solid; justify-content: flex-end; }
.evc-bmb-pcbhint { color: var(--muted); font-size: 12px; max-width: 55%; line-height: 1.5; }
.evc-bmb-pcbhint code { color: var(--amber); }
.evc-bmb-pcb.has-img .evc-bmb-pcbhint { display: none; }
.evc-bmb-pcbcolh { font-size: 10px; color: var(--muted); text-transform: uppercase; letter-spacing: .6px; margin-bottom: 3px; }
.evc-bmb-pcbcol { display: flex; flex-direction: column; gap: 5px; background: rgba(8,13,22,.62); padding: 8px 10px; border-radius: 6px; border: 1px solid var(--line); }
.evc-bmb-pcbrow { display: flex; align-items: center; gap: 8px; font-size: 12px; }
.evc-bmb-pcbpos { font-family: monospace; color: #fbbf24; width: 26px; }
.evc-bmb-pcbprinted { color: var(--text); width: 40px; }
.evc-bmb-pcbrow label { color: var(--muted); display: flex; align-items: center; gap: 4px; }
.evc-bmb-pcbrow select { background: #060a12; border: 1px solid var(--line); color: var(--text); border-radius: 5px; padding: 3px 6px; }

/* DCir voltage graph */
.evc-bmb-dcir-viz { margin: 14px 0; background: #0b1220; border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px 12px; }
.evc-bmb-dcir-vizhead { font-size: 12px; font-weight: 600; color: var(--blue-hi); text-transform: uppercase; letter-spacing: .5px; margin-bottom: 6px; }
.evc-bmb-dcir-chart { overflow-x: auto; }

/* reconnecting connection state (amber dot) */
.evc-dot-warn { background: var(--amber); box-shadow: 0 0 8px -1px var(--amber); }

/* ===== First Init (dev) wizard ===== */
.evc-fi-gate .evc-dbc-input { max-width: 260px; }
.evc-fi-checks { list-style: none; padding: 0; margin: 4px 0 14px; display: flex; flex-direction: column; gap: 8px; }
.evc-fi-checks li { display: flex; align-items: center; gap: 9px; font-size: 13.5px; color: #cbd5e1; }
.evc-fi-checks label { display: flex; align-items: center; gap: 7px; cursor: pointer; }
.evc-fi-dot { width: 11px; height: 11px; border-radius: 50%; background: var(--muted); flex: none; }
.evc-fi-checks li.is-ok .evc-fi-dot { background: var(--green); }
.evc-fi-checks li.is-bad .evc-fi-dot { background: var(--red); }
.evc-fi-checks li.is-ok { color: var(--text); }
.evc-fi-log { margin-top: 12px; background: #060a12; border: 1px solid var(--line); border-radius: 8px; padding: 8px 10px; max-height: 260px; overflow-y: auto; font-family: ui-monospace, monospace; font-size: 12px; line-height: 1.5; }
.evc-fi-log:empty::before { content: 'AT log…'; color: var(--muted); }
.evc-fi-log-tx { color: var(--amber); }
.evc-fi-log-rx { color: var(--blue-hi); }
.evc-fi-ok { color: var(--green); font-size: 15px; font-weight: 600; margin: 4px 0 12px; }
.evc-fi-pair { padding-left: 20px; line-height: 1.7; }
.evc-fi-steps { margin: 8px 0; }

/* ===== header: vehicle label + back-to-grid ===== */
.evc-brand-veh { color: #cbd5e1; font-size: 13px; font-weight: 500; border-left: 1px solid var(--line); padding-left: 10px; margin-left: 2px; }
.evc-brand-back { color: var(--muted); text-decoration: none; font-size: 14px; border: 1px solid var(--line); border-radius: 6px; padding: 3px 9px; margin-right: 4px; }
.evc-brand-back:hover { color: var(--text); border-color: var(--blue); }

/* ===== landing / vehicle picker (Apple-style icon grid) ===== */
.evc-launch { background: var(--bg, #0a0f1a); color: var(--text, #e5e7eb); font-family: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif; border: 1px solid #1f2937; border-radius: 12px; padding: 40px 34px 48px; min-height: 620px; }
.evc-launch-head { text-align: center; margin-bottom: 34px; }
.evc-launch-brand { font-size: 30px; font-weight: 700; color: #60a5fa; letter-spacing: .5px; }
.evc-launch-brand span { color: #f59e0b; }
.evc-launch-sub { color: #6b7280; font-size: 14px; margin-top: 6px; }
.evc-launch-empty { text-align: center; color: #6b7280; }
.evc-launch-group { max-width: 1000px; margin: 0 auto 30px; }
.evc-launch-group h2 { font-size: 13px; text-transform: uppercase; letter-spacing: 1px; color: #6b7280; border-bottom: 1px solid #1f2937; padding-bottom: 8px; margin: 0 0 18px; }
.evc-launch-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 22px; }
.evc-launch-tile { display: flex; flex-direction: column; align-items: center; gap: 12px; text-decoration: none; color: #e5e7eb; padding: 8px; border-radius: 16px; transition: transform .12s ease; }
.evc-launch-tile:hover { transform: translateY(-3px); }
.evc-launch-icon { position: relative; width: 104px; height: 104px; border-radius: 24px; background: linear-gradient(160deg, #172033, #0d1424); border: 1px solid #1f2937; display: flex; align-items: center; justify-content: center; overflow: hidden; box-shadow: 0 10px 24px -12px rgba(0,0,0,.7); }
.evc-launch-tile:hover .evc-launch-icon { border-color: #3b82f6; box-shadow: 0 14px 30px -12px rgba(59,130,246,.5); }
.evc-launch-icon img { width: 100%; height: 100%; object-fit: cover; }
.evc-launch-emoji { font-size: 52px; line-height: 1; }
.evc-launch-lock { position: absolute; right: 6px; bottom: 6px; font-size: 20px; filter: drop-shadow(0 1px 2px #000); }
.evc-launch-tile.is-locked .evc-launch-icon { filter: grayscale(.7) brightness(.75); }
.evc-launch-label { font-size: 13px; text-align: center; color: #cbd5e1; line-height: 1.3; }
/* locked panel */
.evc-locked { max-width: 460px; margin: 60px auto; text-align: center; background: #111827; border: 1px solid #1f2937; border-radius: 12px; padding: 40px 30px; }
.evc-locked-lock { font-size: 48px; margin-bottom: 10px; }
.evc-locked h2 { margin: 6px 0 12px; }
.evc-locked p { color: #6b7280; margin-bottom: 20px; }
.evc-locked-price { font-size: 22px; font-weight: 700; color: #93c5fd; margin: 4px 0 14px; }
.evc-btn-link { display: inline-block; text-decoration: none; margin: 0 5px; }
.evc-locked-actions { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; margin: 6px 0 14px; }
.evc-locked-back { color: #6b7280 !important; background: transparent !important; border: none !important; }

/* grid: "soon" badge for catalog entries without an installed profile */
.evc-launch-soon { position: absolute; left: 6px; top: 6px; font-size: 10px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; color: #0a0f1a; background: #f59e0b; border-radius: 5px; padding: 1px 6px; }
.evc-launch-tile.is-soon .evc-launch-icon { opacity: .85; }
.evc-launch-tile.is-soon .evc-launch-label { color: #8a94a6; }

/* ---- glossy Apple squircle + brand-first storefront -------------------- */
.evc-launch-gloss { position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
	background: linear-gradient(180deg, rgba(255,255,255,.22), rgba(255,255,255,.05) 42%, rgba(255,255,255,0) 56%);
	box-shadow: inset 0 1px 0 rgba(255,255,255,.28), inset 0 -18px 26px -20px rgba(0,0,0,.9); }
.evc-launch-tile:active { transform: translateY(-1px); }
/* brand (first level) tiles */
.evc-brand-grid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
.evc-brand-icon { background: linear-gradient(160deg, #1b2740, #0b1120); }
.evc-brand-icon img { object-fit: contain; padding: 16px; }
.evc-brand-initial { font-size: 46px; font-weight: 800; color: #9fb4d4; line-height: 1; }
.evc-brand-count { display: inline-block; min-width: 16px; font-size: 11px; font-weight: 700; color: #93c5fd;
	background: rgba(59,130,246,.16); border-radius: 999px; padding: 1px 7px; margin-left: 3px; }
.evc-launch-back { display: inline-block; color: #93a4bd; text-decoration: none; font-size: 13px; margin: 0 0 16px; }
.evc-launch-back:hover { color: #e5e7eb; }
/* search */
.evc-search { position: relative; max-width: 420px; margin: 18px auto 0; }
.evc-search-input { width: 100%; box-sizing: border-box; padding: 11px 16px; border-radius: 12px; background: #0e1626;
	border: 1px solid #24334d; color: #e5e7eb; font-size: 14px; outline: none; }
.evc-search-input:focus { border-color: #3b82f6; box-shadow: 0 0 0 3px rgba(59,130,246,.18); }
.evc-search-results { position: absolute; left: 0; right: 0; top: calc(100% + 6px); z-index: 20; background: #0e1626;
	border: 1px solid #24334d; border-radius: 12px; overflow: hidden; box-shadow: 0 20px 44px -16px rgba(0,0,0,.85); }
.evc-search-hit { display: flex; align-items: center; gap: 8px; padding: 10px 14px; text-decoration: none;
	color: #e5e7eb; border-bottom: 1px solid #172033; }
.evc-search-hit:last-child { border-bottom: 0; }
.evc-search-hit:hover { background: #152238; }
.evc-search-l { font-weight: 600; }
.evc-search-b { margin-left: auto; font-size: 12px; color: #6b7280; }
.evc-search-lock { font-size: 13px; }
.evc-search-none { padding: 12px 14px; color: #6b7280; font-size: 13px; }
/* mobile */
@media (max-width: 600px) {
	.evc-launch { padding: 24px 14px 34px; border-radius: 0; min-height: 70vh; }
	.evc-launch-head { margin-bottom: 24px; }
	.evc-launch-brand { font-size: 24px; }
	.evc-launch-grid { grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 14px; }
	.evc-brand-grid { grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); }
	.evc-launch-icon { width: 84px; height: 84px; border-radius: 20px; }
	.evc-launch-emoji { font-size: 42px; }
	.evc-brand-initial { font-size: 36px; }
}

/* ===== packcells: simple multi-pack BMS view (Seabob etc.) ===== */
.evc-packcells { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 18px; }
.evc-pc-pack { background: var(--panel); border: 1px solid var(--line); border-radius: 10px; padding: 14px 16px; }
.evc-pc-h { font-size: 13px; text-transform: uppercase; letter-spacing: .8px; color: var(--blue-hi); margin: 0 0 12px; border-bottom: 1px solid var(--line); padding-bottom: 8px; }
.evc-pc-cells { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 18px; }
.evc-pc-cell { display: flex; align-items: baseline; justify-content: space-between; border-bottom: 1px dotted var(--line); padding: 3px 0; }
.evc-pc-cn { color: var(--muted); font-size: 12.5px; }
.evc-pc-cv { font-variant-numeric: tabular-nums; font-weight: 600; color: var(--text); }
.evc-pc-sum { margin-top: 12px; border-top: 1px solid var(--line); padding-top: 10px; display: flex; flex-direction: column; gap: 5px; }
.evc-pc-row { display: flex; align-items: baseline; justify-content: space-between; font-size: 13px; }
.evc-pc-rl { color: var(--muted); }
.evc-pc-rv { font-variant-numeric: tabular-nums; font-weight: 600; color: var(--text); }
.evc-pc-row.is-delta .evc-pc-rv { color: var(--amber); }
.evc-pc-row.is-total .evc-pc-rv { color: var(--blue-hi); font-size: 15px; }
.evc-pc-row.is-err .evc-pc-rv { color: var(--green); }

/* cellgrid: large single-pack cell view (Smart 451ED — 93 cells, 3 columns) */
.evc-cellgrid { max-width: 760px; }
.evc-pc-cells-3 { grid-template-columns: repeat(3, 1fr) !important; }
.evc-pc-sum-row { flex-direction: row !important; flex-wrap: wrap; gap: 8px 22px; }
.evc-pc-sum-row .evc-pc-row { flex: 0 0 auto; gap: 8px; }

/* heatmap cells: background colour is set inline (hsla low→high); ring the extremes */
.evc-cellgrid .evc-pc-cell { border-radius: 5px; border-bottom: none; padding: 4px 7px; transition: background .3s ease; }
.evc-cellgrid .evc-pc-cell.is-min { outline: 1.5px solid var(--red); outline-offset: -1px; }
.evc-cellgrid .evc-pc-cell.is-max { outline: 1.5px solid var(--green); outline-offset: -1px; }
.evc-heat-legend { float: right; display: inline-flex; align-items: center; gap: 5px; font-size: 10px; font-weight: 400; letter-spacing: .3px; color: var(--muted); text-transform: none; }
.evc-heat-legend i { width: 9px; height: 9px; border-radius: 2px; }
.evc-heat-legend i.lo { background: hsla(0,68%,45%,.55); }
.evc-heat-legend i.hi { background: hsla(125,68%,45%,.55); }
.evc-heat-bar { width: 46px; height: 8px; border-radius: 2px; background: linear-gradient(90deg, hsla(0,68%,45%,.55), hsla(60,68%,45%,.55), hsla(125,68%,45%,.55)); }

/* KPI stat band: grouped at-a-glance chips above the cells */
.evc-statband { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 14px; }
.evc-statgroup { flex: 1 1 auto; min-width: 150px; background: var(--panel-2); border: 1px solid var(--line); border-radius: 9px; padding: 9px 11px; }
.evc-statgroup-h { font-size: 10px; text-transform: uppercase; letter-spacing: .6px; color: var(--muted); margin-bottom: 7px; }
.evc-stats { display: flex; flex-wrap: wrap; gap: 6px 16px; }
.evc-stat { display: flex; flex-direction: column; gap: 2px; min-width: 44px; }
.evc-stat-l { font-size: 10.5px; color: var(--muted); }
.evc-stat-v { font-size: 15px; font-weight: 600; color: var(--text); font-variant-numeric: tabular-nums; }

/* module cell grid: N modules as columns + pack-variant (SR/LR) toggle (Tesla Model 3/Y) */
.evc-cellmods { max-width: none; }
.evc-modtoggle { display: flex; gap: 6px; margin-bottom: 12px; }
.evc-modbtn { background: var(--panel); border: 1px solid var(--line); color: var(--muted); border-radius: 6px; padding: 5px 16px; font-size: 12px; cursor: pointer; }
.evc-modbtn.is-active { background: var(--blue); color: #fff; border-color: var(--blue); }
.evc-modrow { display: flex; gap: 14px; align-items: flex-start; }
.evc-mod { flex: 1 1 0; min-width: 0; }
.evc-mod-cells { grid-template-columns: 1fr !important; gap: 1px 0 !important; }
.evc-cellgrid[data-variant="sr"] [data-vrow="lr"], .evc-cellgrid[data-variant="lr"] [data-vrow="sr"] { display: none; }

/* ---- Bench emulation (Tesla Model 3/Y) --------------------------------- */
.evc-emu { display: flex; flex-direction: column; gap: 14px; max-width: 720px; }
.evc-emu-warn { display: flex; gap: 12px; padding: 14px 16px; border-radius: 12px;
	background: rgba(255, 69, 58, .10); border: 1px solid rgba(255, 69, 58, .45); line-height: 1.45; }
.evc-emu-warnicon { font-size: 22px; line-height: 1; }
.evc-emu-req { margin: 8px 0 0; padding-left: 18px; opacity: .9; }
.evc-emu-req li { margin: 2px 0; }
.evc-emu-ctl { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; }
.evc-emu-field { display: flex; flex-direction: column; gap: 4px; font-size: 12px; opacity: .8; }
.evc-emu-sel { padding: 7px 10px; border-radius: 8px; background: var(--panel, #14181f);
	color: inherit; border: 1px solid rgba(255, 255, 255, .16); min-width: 240px; }
.evc-emu-chk { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; cursor: pointer; }
.evc-emu-arm { display: flex; align-items: center; gap: 9px; font-size: 14px; cursor: pointer;
	padding: 11px 14px; border-radius: 10px; background: rgba(255, 214, 10, .08);
	border: 1px solid rgba(255, 214, 10, .40); }
.evc-emu-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.evc-emu-startbtn { background: var(--red, #ff453a); color: #fff; font-weight: 600; }
.evc-emu-startbtn:disabled { opacity: .4; cursor: not-allowed; }
.evc-emu-stopbtn:disabled { opacity: .4; cursor: not-allowed; }
.evc-emu-badge { font: 600 11px/1 ui-monospace, monospace; letter-spacing: .08em; text-transform: uppercase;
	padding: 5px 9px; border-radius: 999px; background: rgba(255, 255, 255, .08); opacity: .7; }
.evc-emu-badge.is-live { background: rgba(48, 209, 88, .18); color: #30d158; opacity: 1;
	animation: evc-emu-pulse 1.1s ease-in-out infinite; }
@keyframes evc-emu-pulse { 50% { opacity: .45; } }
.evc-emu-status { font: 13px/1.4 ui-monospace, monospace; opacity: .8; }
.evc-emu-src { font-size: 11px; opacity: .5; margin: 0; }

/* ---- Seabob RTR / Bench-mode control bar ------------------------------- */
.evc-rtrbar { display: flex; flex-direction: column; gap: 10px; margin-bottom: 16px;
	padding: 12px 14px; border-radius: 12px; background: rgba(255, 255, 255, .04);
	border: 1px solid rgba(255, 255, 255, .12); max-width: 760px; }
.evc-rtr-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.evc-rtr-bench { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; cursor: pointer; }
.evc-rtr-status { font: 12px/1 ui-monospace, monospace; opacity: .75; padding: 4px 9px;
	border-radius: 999px; background: rgba(255, 255, 255, .06); }
.evc-rtr-reads { display: flex; flex-wrap: wrap; gap: 8px; }
.evc-rtr-btn:disabled { opacity: .4; cursor: not-allowed; }
.evc-rtr-auto { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; cursor: pointer; }
.evc-rtr-auto input:disabled { cursor: not-allowed; }
.evc-rtr-help { margin: 2px 0 0; font-size: 12px; line-height: 1.5; opacity: .7;
	padding: 8px 10px; border-radius: 8px; background: rgba(255, 214, 10, .07);
	border: 1px solid rgba(255, 214, 10, .28); }

/* ---- [evc_account] branded user panel ---------------------------------- */
.evc-account { background: var(--bg, #0a0f1a); color: #e5e7eb; font-family: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
	border: 1px solid #1f2937; border-radius: 12px; padding: 34px 30px 40px; max-width: 860px; margin: 0 auto; }
.evc-acct-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 22px; }
.evc-acct-head .evc-launch-brand { font-size: 22px; }
.evc-acct-search { max-width: 240px; }
.evc-acct-sec { margin-bottom: 28px; }
.evc-acct-sec h2 { font-size: 13px; text-transform: uppercase; letter-spacing: 1px; color: #6b7280;
	border-bottom: 1px solid #1f2937; padding-bottom: 8px; margin: 0 0 14px; }
.evc-acct-list { display: flex; flex-direction: column; gap: 8px; }
.evc-acct-row { display: flex; align-items: center; gap: 12px; padding: 12px 14px; background: rgba(255,255,255,.03);
	border: 1px solid #1f2937; border-radius: 10px; }
.evc-acct-name { font-weight: 600; flex: 1 1 auto; }
.evc-acct-name small { color: #6b7280; font-weight: 400; margin-left: 6px; }
.evc-acct-status { font: 600 11px/1 ui-monospace, monospace; text-transform: uppercase; letter-spacing: .05em;
	padding: 4px 9px; border-radius: 999px; background: rgba(255,255,255,.06); }
.evc-acct-status.is-ok { background: rgba(48,209,88,.16); color: #30d158; }
.evc-acct-status.is-warn { background: rgba(255,214,10,.16); color: #ffd60a; }
.evc-acct-status.is-bad { background: rgba(255,69,58,.14); color: #ff6961; }
.evc-acct-meta { font-size: 12px; color: #93a4bd; min-width: 84px; }
.evc-acct-price { font-size: 13px; color: #cbd5e1; }
.evc-acct-empty { color: #6b7280; }
.evc-acct-hist { width: 100%; border-collapse: collapse; font-size: 13px; }
.evc-acct-hist th { text-align: left; color: #6b7280; font-weight: 600; padding: 8px 10px; border-bottom: 1px solid #1f2937; }
.evc-acct-hist td { padding: 9px 10px; border-bottom: 1px solid #131c2b; }
.evc-acct-hist tr:hover td { background: rgba(255,255,255,.02); }
@media (max-width: 600px) {
	.evc-account { padding: 22px 14px 30px; border-radius: 0; }
	.evc-acct-row { flex-wrap: wrap; gap: 8px; }
	.evc-acct-meta, .evc-acct-price { min-width: 0; }
}