/* VISOR DE INCIDENTE (incident-view.js) — CSS compartilhado entre o painel (tokens --ds-*)
   e a página pública /i/ (que define os mesmos tokens no :root). A cópia em
   landing/i/incident-view.css é GERADA por tools/build_live_site.py. */
.iv-hint { margin: 0 0 12px; color: var(--ds-muted, #9a9ab2); font-size: 13px; line-height: 1.45; }
.iv-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 10px; margin: 0 0 12px; }
.iv-kpi { background: var(--ds-panel-2, #23232f); border: 1px solid var(--ds-line-soft, #2a2a3a); border-radius: 10px; padding: 10px 12px; min-width: 0; }
.iv-kpi small { display: block; font: 600 11px/1 var(--ds-mono, Consolas, monospace); letter-spacing: .08em; text-transform: uppercase; color: var(--ds-dim, #8f8fa8); margin-bottom: 6px; }
.iv-kpi b { display: block; font: 700 18px/1.15 var(--ds-mono, Consolas, monospace); font-variant-numeric: tabular-nums; color: var(--ds-text, #fff); overflow-wrap: anywhere; }
.iv-kpi-sub { display: block; margin-top: 5px; font: 600 11px/1.35 var(--ds-sans, system-ui, sans-serif); color: var(--ds-muted, #9a9ab2); }
.iv-kpi.is-dim { opacity: .7; }
.iv-grid { display: grid; grid-template-columns: minmax(300px, 380px) 1fr; gap: 12px; align-items: start; }
.iv-close-wrap { margin: 0 0 12px; }
.iv-close-wrap, .iv-map-wrap, .iv-tr-wrap { min-width: 0; border: 1px solid var(--ds-line-soft, #2a2a3a); border-radius: 10px; overflow: hidden; background: var(--ds-panel-2, #23232f); }
.iv-close-wrap canvas, .iv-map-wrap canvas, .iv-tr-wrap canvas { display: block; width: 100%; }
.iv-tr-wrap canvas { cursor: crosshair; touch-action: none; }
.iv-legend { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; padding: 6px 10px; font: 600 11px/1.4 var(--ds-sans, system-ui, sans-serif); border-top: 1px solid var(--ds-line-soft, #2a2a3a); color: var(--ds-text, #fff); }
.iv-legend span { display: inline-flex; align-items: center; }
.iv-sw { display: inline-block; width: 10px; height: 14px; border-radius: 2px; vertical-align: -2px; margin-right: 6px; flex: 0 0 auto; }
.iv-muted { color: var(--ds-muted, #9a9ab2); }
.iv-mono { font-family: var(--ds-mono, Consolas, monospace); font-variant-numeric: tabular-nums; }
.iv-scrub { display: flex; align-items: center; gap: 8px; margin-top: 12px; }
.iv-range { flex: 1; min-width: 120px; accent-color: var(--ds-red, #e10600); }
.iv-t { min-width: 76px; text-align: right; font: 700 14px/1 var(--ds-mono, Consolas, monospace); font-variant-numeric: tabular-nums; color: var(--ds-text, #fff); }
.iv-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 28px; padding: 0 10px; border-radius: 6px; border: 1px solid var(--ds-line-2, #41415a); background: var(--ds-panel-2, #23232f); color: var(--ds-text, #fff); font: 600 12px/1 var(--ds-sans, system-ui, sans-serif); cursor: pointer; }
.iv-btn:hover { border-color: var(--ds-red, #e10600); }
.iv-btn.iv-icon { width: 28px; padding: 0; }
.iv-btn.iv-ghost { background: transparent; }
.iv-read { display: grid; gap: 4px; margin-top: 8px; font-size: 13px; color: var(--ds-text, #fff); }
.iv-read-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.iv-read-row b { min-width: 110px; }
.iv-chip { display: inline-flex; align-items: center; height: 20px; padding: 0 8px; border-radius: 999px; border: 1px solid var(--ds-warn, #ffd400); color: var(--ds-warn, #ffd400); font: 600 11px/1 var(--ds-sans, system-ui, sans-serif); }
@media (max-width: 900px) {
  .iv-grid { grid-template-columns: 1fr; }
  .iv-kpis { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 520px) { .iv-kpis { grid-template-columns: 1fr 1fr; } .iv-kpi b { font-size: 16px; } }

/* ---- REPLAY cinematográfico (25/08) — palco escuro fixo, como o lapreplay ---- */
.iv-cine-wrap { margin: 0 0 12px; border: 1px solid var(--ds-line-soft, #2a2a3a); border-radius: 10px; overflow: hidden; background: #0f0f14; }
.iv-cine-wrap canvas { display: block; width: 100%; }
.iv-vmsg { font: 600 11px/1.2 var(--ds-mono, Consolas, monospace); color: var(--ds-dim, #8f8fa8); white-space: nowrap; }
.iv-vmsg:empty { display: none; }

/* ---- PARECER (auxílio; o veredito é da liga) ---- */
.iv-parecer { background: var(--ds-panel-2, #23232f); border: 1px solid var(--ds-line-soft, #2a2a3a); border-left: 3px solid var(--ds-warn, #ffd400); border-radius: 10px; padding: 12px 14px; margin: 0 0 12px; }
.iv-pc-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.iv-pc-kicker { font: 600 11px/1 var(--ds-mono, Consolas, monospace); letter-spacing: .1em; text-transform: uppercase; color: var(--ds-dim, #8f8fa8); }
.iv-pc-verdict { font: 700 13px/1 var(--ds-mono, Consolas, monospace); text-transform: uppercase; letter-spacing: .04em; padding: 5px 10px; border-radius: 999px; border: 1px solid var(--ds-line-2, #33334a); color: var(--ds-muted, #9a9ab2); }
.iv-pc-verdict.is-neutral { color: var(--ds-muted, #9a9ab2); }
.iv-pc-verdict.is-low { color: var(--ds-muted, #9a9ab2); }
.iv-pc-verdict.is-med { border-color: var(--ds-warn, #ffd400); color: var(--ds-warn, #ffd400); }
.iv-pc-verdict.is-high { border-color: var(--ds-warn, #ffd400); color: #1a1205; background: var(--ds-warn, #ffd400); }
.iv-pc-conf { margin-left: auto; font: 600 11px/1 var(--ds-mono, Consolas, monospace); text-transform: uppercase; letter-spacing: .06em; color: var(--ds-dim, #8f8fa8); }
.iv-pc-sum { margin: 10px 0 12px; color: var(--ds-text, #fff); font-size: 14px; line-height: 1.4; }
.iv-pc-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.iv-pc-col b { display: block; font: 700 13px/1 var(--ds-sans, system-ui, sans-serif); margin-bottom: 7px; }
.iv-pc-sigs { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 5px; }
.iv-pc-sigs li { position: relative; padding-left: 14px; font-size: 12.5px; line-height: 1.35; color: var(--ds-muted, #9a9ab2); }
.iv-pc-sigs li::before { content: "›"; position: absolute; left: 0; color: var(--ds-dim, #8f8fa8); }
.iv-pc-note { margin: 12px 0 0; font-size: 11.5px; line-height: 1.4; color: var(--ds-dim, #8f8fa8); }
@media (max-width: 520px) { .iv-pc-cols { grid-template-columns: 1fr; } .iv-pc-conf { margin-left: 0; } }
.iv-pc-ctx { margin: 10px 0 0; font-size: 12px; line-height: 1.4; color: var(--ds-muted, #9a9ab2); }
.iv-pc-ctx b { color: var(--ds-warn, #ffd400); font-weight: 700; }

/* física do carro deste PC (fecho da Onda 2): vereditos legíveis do anel */
.iv-phys { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 10px 0 2px; }
.iv-phys-k { font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--ds-muted, #9a9ab2); }
.iv-phys-chip { font-size: 12.5px; padding: 3px 10px; border: 1px solid var(--ds-line, #32324a); border-radius: 999px; color: var(--ds-text, #e8e8f2); background: rgba(255,255,255,.03); }