.vhal-wrap { max-width: 1180px; }
.vhal-wrap .btn-ghost { text-decoration: none; }
.capture-list { margin-top: 14px; display: grid; gap: 8px; }
.capture-item {
  display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 10px;
  padding: 10px 12px; border: 1px solid var(--border); border-radius: 10px;
  background: var(--card-alt); cursor: pointer;
}
.capture-item.active { border-color: var(--blue); }
.capture-item-title { margin: 0; font-family: var(--mono); font-size: 12px; overflow-wrap: anywhere; }
.capture-item-sub { margin: 4px 0 0; color: var(--text-faint); font-size: 11px; }
.capture-head { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; margin-bottom:14px; }
.capture-title { margin:0; font-size:17px; font-weight:600; overflow-wrap:anywhere; }
.capture-meta { margin-top:14px; display:grid; gap:5px; font-family:var(--mono); font-size:11px; color:var(--text-muted); }
.vhal-kpis { grid-template-columns: repeat(4, minmax(0,1fr)); }
.chart-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-bottom:18px; }
.chart-card { background:var(--card); border-radius:var(--radius); padding:16px; min-width:0; }
.chart-title { margin:0 0 8px; font-size:13px; font-weight:600; }
.chart-sub { margin:0 0 10px; font-family:var(--mono); color:var(--text-faint); font-size:11px; }
.line-chart { width:100%; min-height:210px; }
.line-chart svg, .route-chart svg { width:100%; height:auto; display:block; }
.chart-axis { stroke:var(--border); stroke-width:1; }
.chart-line { fill:none; stroke:var(--blue); stroke-width:2; vector-effect:non-scaling-stroke; }
.chart-fill { fill:var(--blue-bg); opacity:.5; }
.chart-dot { fill:var(--blue); }
.chart-label { fill:var(--text-faint); font-size:11px; font-family:var(--mono); }
.gps-grid { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); gap:20px; }
.route-chart { min-height:260px; display:flex; align-items:center; justify-content:center; background:var(--card-alt); border-radius:10px; overflow:hidden; }
.route-line { fill:none; stroke:var(--green); stroke-width:2; vector-effect:non-scaling-stroke; }
.route-point-start { fill:var(--green); }
.route-point-end { fill:var(--coral); }
.filter-row { display:flex; align-items:center; gap:10px; margin-bottom:12px; }
.filter-row input { flex:1; }
.table-scroll { overflow-x:auto; }
.vhal-table { width:100%; border-collapse:collapse; font-size:12px; }
.vhal-table th { text-align:left; color:var(--text-faint); font-family:var(--mono); font-size:10px; letter-spacing:.03em; font-weight:500; padding:8px; border-bottom:1px solid var(--border); white-space:nowrap; }
.vhal-table td { padding:8px; border-bottom:1px solid var(--border); vertical-align:top; }
.vhal-table tbody tr:last-child td { border-bottom:none; }
.vhal-table code { font-size:11px; color:var(--text); }
.value-cell { font-family:var(--mono); max-width:260px; overflow-wrap:anywhere; }
.small-btn { padding:6px 9px; font-size:11px; white-space:nowrap; }
.vhal-note { margin-top:0; font-size:12px; line-height:1.5; }
.raw-json { margin:0; padding:12px; border-radius:10px; background:var(--card-alt); color:var(--text); font:11px/1.45 var(--mono); white-space:pre-wrap; overflow-wrap:anywhere; max-height:70vh; overflow:auto; }
.error-box { color:var(--danger); }
.status-ok { color:var(--green); }
.status-bad { color:var(--danger); }
@media (max-width: 760px) {
  .vhal-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .chart-grid, .gps-grid { grid-template-columns:1fr; }
  .capture-item { grid-template-columns:1fr; }
}