/* Vigilar (#/vigilar, docs/plan-seguimiento-hashtags.md F2): the list of watches, the detail of one and the form Nueva vigilancia.
   Only the design tokens of tokens-ev.css, so the three themes paint it; every box can shrink (min-width: 0) and nothing scrolls the
   page sideways: the items table scrolls inside its own wrapper. */
.vg-page { min-width: 0; }
.vg-head-acts { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-left: auto; }
.vg-grid { display: grid; grid-template-columns: minmax(250px, 330px) minmax(0, 1fr); gap: 16px; align-items: start; min-width: 0; }
@media (max-width: 1080px) { .vg-grid { grid-template-columns: minmax(0, 1fr); } }
.vg-list, .vg-card, .vg-pick { min-width: 0; }
.vg-main { min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.vg-main > .ev-card, .vg-pick.ev-empty { width: 100%; max-width: none; box-sizing: border-box; }
.vg-h2 { display: flex; align-items: center; gap: 8px; margin: 0; padding: 12px 14px 8px; color: var(--ev-text); font: 600 14px/1.3 var(--ev-font-ui); }
.vg-card .vg-h2 { padding: 0; }
.vg-count { padding: 1px 7px; border-radius: var(--ev-r-pill); background: var(--ev-surface-2); color: var(--ev-text-2); font: 500 11px/16px var(--ev-font-mono); }
.vg-pad { margin: 0; padding: 8px 14px 14px; }
.vg-pad-x { margin: 0 0 8px; padding: 0 16px; }
.vg-empty { padding: 18px 14px; }
.vg-dim { color: var(--ev-text-3); }
.vg-mono { font-family: var(--ev-font-mono); font-size: 11px; }
.vg-sub { margin: 2px 0 0; font-size: 12px; line-height: 1.4; }
.vg-min { min-width: 0; }

/* the list */
.vg-rows { list-style: none; margin: 0; padding: 0 6px 6px; }
.vg-row { display: flex; align-items: center; gap: 10px; width: 100%; min-width: 0; margin: 0 0 2px; padding: 9px 10px; border: 1px solid transparent; border-radius: var(--ev-r-md); background: none;
  color: var(--ev-text); text-align: left; font: inherit; cursor: pointer; transition: background var(--ev-dur-1), border-color var(--ev-dur-1); }
.vg-row:hover { background: var(--ev-surface-2); }
.vg-row.is-current { border-color: var(--ev-border-strong); background: var(--ev-brand-soft); }
.vg-row.is-archived { opacity: 0.72; }
.vg-row:focus-visible { outline: 2px solid var(--ev-focus); outline-offset: 1px; }
.vg-row-main { display: flex; flex-direction: column; gap: 3px; flex: 1 1 auto; min-width: 0; }
.vg-row-label { overflow: hidden; color: var(--ev-text); font: 600 13px/1.3 var(--ev-font-ui); white-space: nowrap; text-overflow: ellipsis; }
.vg-row-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; font-size: 11.5px; }
.vg-row-when { font-size: 11px; }
.vg-row-side { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; flex: none; }
.vg-spark { display: block; width: 96px; height: 24px; overflow: visible; }
.vg-spark polyline { fill: none; stroke: var(--ev-brand); stroke-width: 1.5; stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.vg-badge { min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--ev-bad); color: var(--ev-surface); font: 600 10.5px/18px var(--ev-font-mono); text-align: center; }

/* chips */
.vg-chip { display: inline-flex; align-items: center; padding: 1px 8px; border-radius: var(--ev-r-pill); background: var(--ev-surface-2); color: var(--ev-text-2); font: 500 11px/18px var(--ev-font-ui); white-space: nowrap; }
.vg-chip.is-activa, .vg-chip.is-ok { background: var(--ev-ok-soft); color: var(--ev-ok); }
.vg-chip.is-leyendo { background: var(--ev-info-soft); color: var(--ev-info); }
.vg-chip.is-pausada, .vg-chip.is-warn { background: var(--ev-doubt-soft); color: var(--ev-doubt); }
.vg-chip.is-archivada, .vg-chip.is-off { background: var(--ev-surface-2); color: var(--ev-text-3); }
.vg-chip.is-account { border: 1px dashed var(--ev-border-strong); background: none; color: var(--ev-text-2); }

/* a card of the detail or the form */
.vg-card { padding: 14px 16px 16px; }
.vg-card-head { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 10px 12px; margin: 0 0 12px; }
.vg-card-head > :first-child { flex: 1 1 260px; min-width: 0; }
.vg-detail-title { flex-wrap: wrap; overflow-wrap: anywhere; }
.vg-acts { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.vg-props { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 8px 16px; margin: 0 0 8px; }
.vg-props > div { min-width: 0; }
.vg-props dt { color: var(--ev-text-3); font: 600 10.5px/1.4 var(--ev-font-ui); letter-spacing: var(--ev-tracking-caps); text-transform: uppercase; }
.vg-props dd { margin: 2px 0 0; color: var(--ev-text); font-size: 12.5px; line-height: 1.45; overflow-wrap: anywhere; }
.vg-case-link { margin-right: 8px; }
.vg-h3 { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; margin: 16px 0 8px; color: var(--ev-text); font: 600 13px/1.3 var(--ev-font-ui); }
.vg-h3-sub { font-weight: 400; font-size: 11.5px; }

/* the sources and their series */
.vg-sources { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.vg-source { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); align-items: center; gap: 6px 14px; padding: 8px 10px; border: 1px solid var(--ev-border); border-radius: var(--ev-r-md); }
@media (max-width: 1280px) { .vg-source { grid-template-columns: minmax(0, 1fr); } }
.vg-source-txt { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; min-width: 0; font-size: 12px; }
.vg-src-name { color: var(--ev-text); font-weight: 600; font-size: 12.5px; }
.vg-src-when { font-size: 11px; }
.vg-series { display: block; width: 100%; height: 36px; min-width: 0; }
.vg-bar { fill: var(--ev-brand); }
.vg-bar.is-zero { fill: var(--ev-border); }
.vg-series rect:hover { fill: var(--ev-text); }
/* 2026-10-31 (F7): the historic part of a source, by day, under its live hours: its own label and a muted, outlined style */
.vg-series-col { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.vg-hist-series { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 6px; min-width: 0; }
.vg-hist-label { font-size: 11px; color: var(--ev-text-3); }
.vg-series.is-historic { height: 20px; }
.vg-bar.is-historic { fill: var(--ev-info-soft); stroke: var(--ev-info); stroke-width: 0.6; }

/* the inbox */
.vg-filters { display: flex; flex-wrap: wrap; gap: 8px 14px; margin: 0 0 8px; }
.vg-filter { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; min-width: 0; }
.vg-filter .ev-select { max-width: 220px; }
.vg-events { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.vg-event { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 8px 12px; padding: 9px 10px; border: 1px solid var(--ev-border); border-radius: var(--ev-r-md); }
.vg-event.is-new { border-left: 3px solid var(--ev-brand); }
.vg-event-txt { display: flex; flex-direction: column; gap: 2px; flex: 1 1 280px; min-width: 0; }
.vg-event-kind { color: var(--ev-text); font: 600 12.5px/1.35 var(--ev-font-ui); }
.vg-event-what { color: var(--ev-text-2); font-size: 12.5px; line-height: 1.45; overflow-wrap: anywhere; }
.vg-event-acts { display: flex; flex-wrap: wrap; gap: 6px; }
.vg-sev { flex: none; padding: 1px 8px; border-radius: var(--ev-r-pill); font: 600 11px/18px var(--ev-font-ui); }
.vg-sev.is-info { background: var(--ev-info-soft); color: var(--ev-info); }
.vg-sev.is-atencion { background: var(--ev-doubt-soft); color: var(--ev-doubt); }
.vg-sev.is-urgente { background: var(--ev-bad-soft); color: var(--ev-bad); }

/* the items read */
.vg-items-wrap { max-width: 100%; overflow-x: auto; }
.vg-items { width: 100%; table-layout: fixed; }
.vg-items th, .vg-items td { vertical-align: top; }
.vg-c-net { width: 13%; } .vg-c-date { width: 14%; } .vg-c-author { width: 16%; } .vg-c-text { width: 41%; } .vg-c-link { width: 8%; } .vg-c-ev { width: 8%; }
.vg-clip { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.vg-clamp { display: -webkit-box; overflow: hidden; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow-wrap: anywhere; font-size: 12px; line-height: 1.4; }
/* 2026-10-28: the matched term in the snippet, the meta line under it (where the term is, the counts, the language, the copies) and the
   date of an item the source gave no date for (the time it was first seen) */
.vg-hit { padding: 0 1px; border-radius: 2px; background: var(--ev-doubt-soft); color: var(--ev-text); }
.vg-hit:empty { display: none; }
.vg-item-meta { display: block; margin-top: 2px; overflow-wrap: anywhere; font-size: 11px; line-height: 1.35; }
.vg-item-meta:empty { display: none; }
.vg-c-date.is-seen { font-style: italic; }

/* the form */
.vg-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 16px; }
@media (max-width: 1280px) { .vg-fields { grid-template-columns: minmax(0, 1fr); } }
.vg-field { display: flex; flex-direction: column; gap: 4px; min-width: 0; grid-column: 1 / -1; margin: 0; padding: 0; border: 0; }
.vg-field.vg-half { grid-column: auto; }
.vg-field .ev-input { width: 100%; min-width: 0; box-sizing: border-box; }
.vg-area { resize: vertical; min-height: 52px; }
.vg-label { color: var(--ev-text); font: 600 12.5px/1.3 var(--ev-font-ui); padding: 0; }
.vg-hint { color: var(--ev-text-3); font-size: 11.5px; line-height: 1.4; }
.vg-set legend { margin-bottom: 4px; }
.vg-src-pick, .vg-case-pick { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.vg-case-pick { max-height: 180px; overflow: auto; }
.vg-src-row { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; padding: 4px 0; min-width: 0; }
.vg-check { display: inline-flex; align-items: center; gap: 7px; min-width: 0; font-size: 12.5px; color: var(--ev-text); cursor: pointer; }
.vg-check input { width: 15px; height: 15px; margin: 0; accent-color: var(--ev-brand); }
.vg-case-name { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.vg-cad { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; }
.vg-num { width: 84px; }
.vg-inline { display: flex; flex-wrap: wrap; gap: 6px 14px; }
.vg-error { margin: 12px 0 0; padding: 8px 10px; border-left: 3px solid var(--ev-bad); border-radius: 6px; background: var(--ev-bad-soft); color: var(--ev-text); font-size: 12.5px; }
.vg-form-acts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.dk-log-row.is-watch { border-left: 2px solid var(--ev-doubt); }

/* 2026-10-27 (F3): Vigilancias que citan este caso, in the Ficha of the subject; a tag of the comments that opens Nueva vigilancia */
.vg-ficha-list { list-style: none; margin: 6px 0 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.vg-ficha-row { padding: 8px 10px; border: 1px solid var(--ev-border); border-radius: var(--ev-r-md, 8px); background: var(--ev-surface-2, transparent); min-width: 0; }
.vg-ficha-head { display: flex; align-items: center; gap: 6px; min-width: 0; font-weight: 600; }
.vg-ficha-head .ev-ic { flex: none; width: 14px; height: 14px; color: var(--ev-text-3); }
.vg-ficha-head a { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vg-ficha-event { display: flex; align-items: baseline; gap: 6px; margin-top: 6px; font-size: 12px; line-height: 1.4; min-width: 0; }
.vg-ficha-txt { min-width: 0; overflow-wrap: anywhere; }
.cmt-chip-btn { display: inline-flex; align-items: center; gap: 4px; background: transparent; cursor: pointer; font: inherit; font-size: var(--ev-fs-xs); }
.cmt-chip-btn:hover, .cmt-chip-btn:focus-visible { border-color: var(--ev-accent, currentColor); }
.cmt-chip-btn .ev-ic { width: 11px; height: 11px; color: var(--ev-text-3); }
/* F4 (2026-10-27): the networks of the reader's tag job under its source, the note of a source without dates, and the diff of a page change */
.vg-subnets { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; flex-basis: 100%; margin: 4px 0 0 22px; }
.vg-src-note { flex-basis: 100%; }
.vg-diff { margin: 6px 0 0; }
.vg-diff-sum { padding: 0; border: 0; background: none; color: var(--ev-brand); font: 600 12px/1.4 var(--ev-font-ui); cursor: pointer; }
.vg-diff-sum:focus-visible { outline: 2px solid var(--ev-focus); outline-offset: 1px; border-radius: 4px; }
.vg-hunk { display: flex; flex-direction: column; gap: 2px; margin: 6px 0 0; padding: 6px 8px; border: 1px solid var(--ev-border); border-radius: var(--ev-r-md); background: var(--ev-surface-2); }
.vg-diff-line { display: block; padding: 1px 6px; border-radius: 4px; color: var(--ev-text); font-size: 12px; line-height: 1.45; text-decoration: none; overflow-wrap: anywhere; }
.vg-diff-line.is-del { background: var(--ev-bad-soft); text-decoration: line-through; text-decoration-color: var(--ev-bad); }
.vg-diff-line.is-add { background: var(--ev-ok-soft); }
.vg-diff-mark { display: inline-block; width: 12px; color: var(--ev-text-3); font-family: var(--ev-font-mono); text-decoration: none; }
/* F5 (2026-10-27): the analysis of the detail (the tone, the tags that come along, the places with their map) and the Vigilancias panel of
   Sala and of the Muro de mando */
.vg-analysis { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 12px; min-width: 0; }
.vg-an-block { min-width: 0; padding: 10px 12px; border: 1px solid var(--ev-border); border-radius: var(--ev-r-md); }
.vg-an-block .vg-hint { margin: 0 0 6px; }
.vg-h4 { margin: 0 0 4px; color: var(--ev-text); font: 600 12.5px/1.3 var(--ev-font-ui); }
.vg-an-line { margin: 0 0 4px; color: var(--ev-text-2); font-size: 12.5px; line-height: 1.45; overflow-wrap: anywhere; }
.vg-an-warn { padding: 4px 8px; border-left: 3px solid var(--ev-doubt); border-radius: 4px; background: var(--ev-doubt-soft); color: var(--ev-text); }
.vg-an-acts { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-top: 8px; }
.vg-hours { width: 72px; }
.vg-an-wrap { max-width: 100%; max-height: 260px; overflow: auto; }
.vg-an-table { width: 100%; table-layout: fixed; font-size: 12px; }
.vg-an-table th, .vg-an-table td { vertical-align: top; }
/* the headers of these short tables wrap instead of running into each other */
.vg-an-table th { white-space: normal; overflow-wrap: normal; word-break: normal; line-height: 1.3; }
.vg-num-c { width: 17%; text-align: right; font-variant-numeric: tabular-nums; }
.vg-an-block.is-wide { grid-column: 1 / -1; }
.vg-places { display: grid; grid-template-columns: minmax(160px, 260px) minmax(0, 1fr); gap: 12px; align-items: start; min-width: 0; }
.vg-map { display: block; width: 100%; max-height: 300px; min-width: 0; }
.vg-map-dept { fill: var(--ev-surface-2); stroke: var(--ev-border-strong); stroke-width: 0.6; vector-effect: non-scaling-stroke; }
.vg-map-pin { fill: var(--ev-brand); fill-opacity: 0.75; stroke: var(--ev-surface); stroke-width: 1; vector-effect: non-scaling-stroke; }
.vg-map-pin.is-old { fill: var(--ev-text-3); fill-opacity: 0.6; }
/* 2026-10-28: a pin and a row of the places pick that place (a filter of Lo leído); the one picked is marked on both */
.vg-map-pin { cursor: pointer; }
.vg-map-pin:hover { fill-opacity: 0.95; }
.vg-map-pin:focus { outline: none; }
.vg-map-pin:focus-visible { stroke: var(--ev-focus); stroke-width: 3; }
.vg-map-pin.is-sel { fill: var(--ev-doubt); fill-opacity: 0.95; stroke: var(--ev-text); stroke-width: 2; }
.vg-place-row { cursor: pointer; }
.vg-place-row:hover td { background: var(--ev-surface-2); }
.vg-place-row:focus-visible { outline: 2px solid var(--ev-focus); outline-offset: -2px; }
.vg-place-row.is-sel td { background: var(--ev-brand-soft); }
.vg-place-row.is-sel td:first-child { box-shadow: inset 3px 0 0 var(--ev-brand); }
.vg-place-pick { margin: 8px 0 0; }
.vg-place-sel { margin-top: 10px; padding: 8px 10px; border: 1px solid var(--ev-border-strong); border-radius: var(--ev-r-md); background: var(--ev-surface); }
.vg-h5 { margin: 0 0 4px; color: var(--ev-text); font: 600 12.5px/1.3 var(--ev-font-ui); }
.vg-h5:focus { outline: none; }
.vg-h5:focus-visible, .vg-h3:focus-visible { outline: 2px solid var(--ev-focus); outline-offset: 2px; border-radius: 4px; }
.vg-heads { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.vg-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; min-width: 0; font-size: 12px; line-height: 1.4; }
.vg-head .is-seen { font-style: italic; }
.vg-head-text { flex: 1 1 260px; min-width: 0; color: var(--ev-text); overflow-wrap: anywhere; }
/* the filters of Lo leído in use, each with its own Quitar; the items and the chips of an event */
.vg-active { gap: 6px; max-width: 100%; padding-right: 4px; }
.vg-active .vg-clip { max-width: 260px; }
.vg-ev-chips { display: flex; flex-wrap: wrap; gap: 4px 6px; margin-top: 4px; }
.vg-ev-chip { border: 1px solid var(--ev-border-strong); cursor: pointer; }
.vg-ev-chip:hover { background: var(--ev-surface); color: var(--ev-text); }
.vg-ev-chip.is-on { border-color: var(--ev-brand); background: var(--ev-brand-soft); color: var(--ev-text); }
.vg-ev-chip:focus-visible { outline: 2px solid var(--ev-focus); outline-offset: 1px; }
.vg-ev-toggle { align-self: flex-start; margin-top: 4px; }
.vg-ev-items { flex: 1 1 100%; min-width: 0; }
.vg-ev-items .vg-hint { margin: 0 0 6px; }
.vg-wall { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; min-width: 0; padding: 6px 10px; border: 1px solid var(--ev-border); border-radius: var(--ev-r-md);
  background: var(--ev-surface); color: var(--ev-text); font-size: 12px; }
.vg-wall-title { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; }
.vg-wall-title .ev-ic { width: 14px; height: 14px; color: var(--ev-text-3); }
.vg-wall-counts { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; }
.vg-wall-urgent { display: flex; flex-direction: column; gap: 2px; flex: 1 1 260px; min-width: 0; }
.vg-wall-line { overflow: hidden; color: var(--ev-text-2); white-space: nowrap; text-overflow: ellipsis; }
.vg-wall .ev-btn { margin-left: auto; }
.ws-sala-bar .vg-wall { flex-basis: 100%; }
/* on the wall the panel shares the band's row with the subject, the meta and the exit: a small basis, so the row never wraps at 1366 px */
.sala-muro-vig { flex: 1 1 300px; min-width: 260px; max-width: 480px; }
.sala-muro-band .vg-wall { padding: 8px 12px; font-size: 14px; }
.sala-muro-band .vg-wall .vg-sev { font-size: 13px; line-height: 22px; }
/* F5: Ajustes › Puestos › Lecturas de la vigilancia con identidades, one switch per network */
.ad-subswitches { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px 14px; min-width: 0; }
.ad-subswitch { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--ev-text); cursor: pointer; }
/* 2026-10-30: the Tone block with its evidence: every count a button that opens the classified items behind it, the reading of the rule
   of a change of tone, the "?" with the lab's help popover; the list with its hourly chart, its tabs by tone and its items */
.vg-an-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-width: 0; }
.vg-an-head .vg-h4, .vg-an-head .vg-h5 { margin-bottom: 0; }
.vg-tone-block { position: relative; }
.vg-help-pop { position: absolute; z-index: 30; top: 36px; right: 8px; box-sizing: border-box; width: 340px; max-width: calc(100% - 16px); max-height: 420px; overflow: auto; padding: 10px 12px; }
.vg-tone-count { display: inline; min-height: 0; padding: 0 2px; border: 0; border-radius: 3px; background: none; color: var(--ev-brand); font: inherit; font-weight: 600; text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }
.vg-tone-count:hover { color: var(--ev-brand-hover); background: var(--ev-brand-soft); }
.vg-tone-count:focus-visible { outline: 2px solid var(--ev-focus); outline-offset: 1px; }
.vg-tone-count:disabled { color: var(--ev-text-2); font-weight: 400; text-decoration: none; cursor: default; background: none; }
.vg-tone-count.is-hostil, .vg-tone-count.is-amenaza { color: var(--ev-bad); }
.vg-tone-count.is-sin_evaluar { color: var(--ev-text); }
.vg-tone-count.is-on { background: var(--ev-brand-soft); text-decoration-thickness: 2px; }
.vg-tone-state { padding: 4px 8px; border-left: 3px solid var(--ev-border-strong); border-radius: 4px; background: var(--ev-surface-2); color: var(--ev-text); }
.vg-tone-state.is-sube { border-left-color: var(--ev-bad); background: var(--ev-bad-soft); }
.vg-tone-state.is-pocos { border-left-color: var(--ev-doubt); }
.vg-tone-list { display: flex; flex-direction: column; gap: 8px; border-color: var(--ev-border-strong); }
.vg-tone-list .vg-hint { margin: 0; }
.vg-tone-fig { margin: 0; min-width: 0; }
.vg-tone-cap { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; margin-bottom: 4px; font-size: 11.5px; }
.vg-tone-key { display: inline-flex; align-items: center; gap: 4px; color: var(--ev-text-2); }
.vg-tone-sw { display: inline-block; width: 10px; height: 10px; border-radius: 2px; background: var(--ev-info); opacity: 0.45; }
.vg-tone-sw.is-hostile { background: var(--ev-bad); opacity: 1; }
.vg-tone-chart { display: block; width: 100%; height: 64px; border-bottom: 1px solid var(--ev-border); }
.vg-tone-bar { fill: var(--ev-info); fill-opacity: 0.45; }
.vg-tone-bar.is-hostile { fill: var(--ev-bad); fill-opacity: 1; }
.vg-tone-nums { margin-top: 4px; font-size: 11.5px; }
.vg-tone-nums summary { color: var(--ev-text-2); cursor: pointer; }
.vg-tone-nums summary:focus-visible { outline: 2px solid var(--ev-focus); outline-offset: 1px; }
.vg-tone-tabs { display: flex; flex-wrap: wrap; gap: 4px 6px; }
.vg-tone-tab { min-height: 28px; padding: 2px 10px; border: 1px solid var(--ev-border-strong); border-radius: var(--ev-r-pill); background: var(--ev-surface); color: var(--ev-text-2); font: 500 12px/1 var(--ev-font-ui); cursor: pointer; }
.vg-tone-tab:hover { background: var(--ev-surface-2); color: var(--ev-text); }
.vg-tone-tab.is-on { border-color: var(--ev-brand); background: var(--ev-brand-soft); color: var(--ev-text); }
.vg-tone-tab:focus-visible { outline: 2px solid var(--ev-focus); outline-offset: 1px; }
.vg-tone-items { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; max-height: 520px; overflow: auto; border-top: 1px solid var(--ev-border); }
.vg-tone-item { padding: 8px 2px; border-bottom: 1px solid var(--ev-border); min-width: 0; }
.vg-tone-item[data-vig-tone-kind="amenaza"], .vg-tone-item[data-vig-tone-kind="hostil"] { box-shadow: inset 3px 0 0 var(--ev-bad); padding-left: 8px; }
.vg-tone-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 8px; min-width: 0; font-size: 11.5px; }
.vg-tone-net { width: 14px; height: 14px; flex: none; color: var(--ev-text-2); }
.vg-tone-author { color: var(--ev-text); font-weight: 600; overflow-wrap: anywhere; }
.vg-tone-chip { display: inline-flex; align-items: center; padding: 1px 8px; border-radius: var(--ev-r-pill); background: var(--ev-surface-2); color: var(--ev-text-2); font: 600 11px/18px var(--ev-font-ui); }
.vg-tone-chip.is-amenaza { background: var(--ev-bad); color: var(--ev-blanco); }
.vg-tone-chip.is-hostil { background: var(--ev-bad-soft); color: var(--ev-bad); }
.vg-tone-chip.is-negativo { background: var(--ev-doubt-soft); color: var(--ev-doubt); }
.vg-tone-chip.is-positivo { background: var(--ev-ok-soft); color: var(--ev-ok); }
.vg-tone-chip.is-sin_evaluar { border: 1px dashed var(--ev-border-strong); background: none; color: var(--ev-text-2); }
.vg-tone-title { margin: 4px 0 0; color: var(--ev-text); font-weight: 600; font-size: 12.5px; line-height: 1.4; overflow-wrap: anywhere; }
.vg-tone-text { margin: 2px 0 0; color: var(--ev-text); font-size: 12.5px; line-height: 1.45; overflow-wrap: anywhere; white-space: pre-line; }
.vg-tone-acts { display: flex; flex-wrap: wrap; gap: 0 14px; }
.vg-tone-acts .wsd-linkbtn { min-height: 28px; font-size: 12px; }
.vg-country { margin: 0 0 6px; }
.vg-country .vg-an-line { margin: 0; }
.vg-country .ev-select { width: auto; min-width: 220px; max-width: 100%; }

/* 2026-10-30 (Vigilar simple): the form assistant, the proposed fields, Opciones avanzadas */
.vg-assist { display: flex; flex-direction: column; gap: 8px; padding: 12px; margin-bottom: 12px; border: 1px solid var(--ev-border); border-radius: var(--ev-r-md, 8px); background: var(--ev-surface-2); }
.vg-assist .vg-form-acts { margin: 0; }
.vg-field.is-proposed .ev-input { border-color: var(--ev-info); box-shadow: 0 0 0 1px var(--ev-info-soft); }
.vg-chip.is-proposed { margin-left: 8px; background: var(--ev-info-soft); color: var(--ev-info); }
.vg-check.vg-field { flex-direction: row; align-items: center; }
.vg-adv { flex-direction: row; align-items: center; flex-wrap: wrap; gap: 8px; }
.vg-adv-body { grid-column: 1 / -1; padding-top: 4px; border-top: 1px solid var(--ev-border); }
/* 2026-10-30 (Vigilar simple): Resumen, its timeline, Para revisar, Términos que crecen, the tabs of Análisis */
.vg-sum { margin: 0 0 16px; padding: 12px; border: 1px solid var(--ev-border); border-radius: var(--ev-r-md, 8px); }
.vg-sum-lines { list-style: none; margin: 8px 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.vg-sum-line { all: unset; cursor: pointer; color: var(--ev-text-1); font: 400 14px/20px var(--ev-font-ui); border-radius: 4px; }
.vg-sum-line:hover { text-decoration: underline; }
.vg-sum-line:focus-visible, .vg-term-btn:focus-visible { outline: 2px solid var(--ev-focus, var(--ev-info)); outline-offset: 2px; }
/* 2026-11-02: Qué está pasando, the brief at the top of a watch; the counting lines of Resumen fold under Números */
.vg-brief-lines { gap: 8px; }
.vg-brief-lines .vg-sum-line { font: 400 15px/22px var(--ev-font-ui); }
.vg-brief-lines .vg-sum-line[disabled] { cursor: default; }
.vg-brief-lines .vg-sum-line[disabled]:hover { text-decoration: none; }
.vg-brief-foot { margin: 4px 0 0; font-size: 12px; }
.vg-num-toggle { margin: 4px 0; }
.vg-timeline { margin: 8px 0 0; }
.vg-tl-svg { width: 100%; height: 120px; display: block; overflow: visible; }
.vg-tl-bar { fill: var(--ev-text-3); opacity: .55; }
.vg-tl-hostile { fill: var(--ev-danger, var(--ev-doubt)); }
.vg-tl-mark { fill: var(--ev-info); cursor: pointer; stroke: var(--ev-surface-1, #fff); stroke-width: 1.5; }
.vg-tl-mark.is-amenaza, .vg-tl-mark.is-persona { fill: var(--ev-danger, var(--ev-doubt)); }
.vg-tl-mark.is-pico, .vg-tl-mark.is-tono { fill: var(--ev-doubt); }
.vg-tl-legend { display: flex; flex-wrap: wrap; gap: 12px; font: 400 12px/16px var(--ev-font-ui); }
.vg-tl-key::before { content: ''; display: inline-block; width: 10px; height: 10px; margin-right: 4px; vertical-align: -1px; background: var(--ev-text-3); }
.vg-tl-key.is-hostile::before { background: var(--ev-danger, var(--ev-doubt)); }
.vg-tl-key.is-marks::before { background: var(--ev-info); border-radius: 50%; }
.vg-tl-table summary { cursor: pointer; font: 500 12px/20px var(--ev-font-ui); color: var(--ev-text-2); }
.vg-tl-spans { margin: 4px 0; }
.vg-review-head { align-items: center; }
.vg-group .vg-event-what { font-weight: 500; }
.vg-tabs { display: flex; flex-wrap: wrap; gap: 4px; margin: 0 0 8px; border-bottom: 1px solid var(--ev-border); }
.vg-tab { all: unset; cursor: pointer; padding: 6px 12px; font: 500 13px/20px var(--ev-font-ui); color: var(--ev-text-2); border-bottom: 2px solid transparent; }
.vg-tab[aria-selected="true"] { color: var(--ev-text-1); border-bottom-color: var(--ev-info); }
.vg-tab:focus-visible { outline: 2px solid var(--ev-info); }
.vg-terms { margin: 0; padding: 0 0 0 20px; display: flex; flex-direction: column; gap: 2px; }
.vg-term-btn { all: unset; cursor: pointer; display: flex; justify-content: space-between; gap: 12px; width: 100%; padding: 2px 4px; border-radius: 4px; font: 400 13px/20px var(--ev-font-ui); }
.vg-term-btn[aria-pressed="true"], .vg-term-btn:hover { background: var(--ev-surface-2); }
.vg-term-n { display: inline-flex; gap: 6px; font-variant-numeric: tabular-nums; }
.vg-term-up { color: var(--ev-doubt); }
.vg-src-line { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }

.vg-help-pop.is-inline { position: static; width: auto; max-width: 100%; margin: 6px 0; }
.vg-label .mu-help-btn { margin-left: 6px; vertical-align: middle; }

/* 2026-10-31 (F1): the query field, the query of a watch in its detail and Probar la consulta */
.vg-query { font-family: var(--ev-font-mono, ui-monospace, monospace); }
.vg-query-text { font: 12.5px/1.4 var(--ev-font-mono, ui-monospace, monospace); white-space: pre-wrap; word-break: break-word; }
.vg-block { display: block; }
.vg-probe { margin-top: 12px; padding: 10px 12px; border: 1px solid var(--ev-border); border-radius: 8px; background: var(--ev-surface-2, transparent); }
.vg-probe-sum { margin: 6px 0; display: flex; gap: 6px; align-items: center; }
.vg-probe-rows, .vg-probe-ex { margin: 6px 0; padding-left: 0; list-style: none; display: grid; gap: 4px; }
.vg-probe-ex { list-style: decimal; padding-left: 20px; }
.vg-probe-row { display: flex; flex-wrap: wrap; gap: 8px; }
.vg-probe-row.is-bad .vg-dim { color: var(--ev-text); }
.vg-probe-src { font-weight: 600; min-width: 9em; }
.vg-probe-meta { display: block; font-size: 12px; }

/* 2026-10-31 (F2): why a spike fired (Para revisar) */
.vg-why { display: grid; gap: 2px; margin: 4px 0; padding: 6px 8px; border-left: 3px solid var(--ev-border-strong, var(--ev-border)); font-size: 12.5px; }
.vg-why-h { font-weight: 600; }
.vg-why-heavy { margin: 2px 0 0; padding-left: 18px; }

/* 2026-10-31 (F3 of plan-vigilar-mas-que-el-mercado): the triage of a publication, the keyboard of the lists and the tray Por revisar */
.vg-c-tri { min-width: 210px; }
.vg-c-tri .vg-tri-line { display: block; font: 400 11px/16px var(--ev-font-ui); }
.vg-c-tri .vg-tri-note { color: var(--ev-text-2); white-space: normal; overflow-wrap: anywhere; }
.vg-tri-acts { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; }
.vg-tri-btn { padding: 1px 6px; min-height: 22px; font-size: 11px; }
.vg-tri-btn.is-on { background: var(--ev-info-soft); color: var(--ev-info); }
.vg-chip.vg-tri.is-nueva { background: var(--ev-doubt-soft); color: var(--ev-doubt); }
.vg-chip.vg-tri.is-revisada { background: var(--ev-surface-2); color: var(--ev-text-2); }
.vg-chip.vg-tri.is-relevante { background: var(--ev-ok-soft); color: var(--ev-ok); }
.vg-chip.vg-tri.is-descartada { background: var(--ev-surface-2); color: var(--ev-text-3); }
.vg-items tr.vg-item-row.is-descartada td { opacity: 0.6; }
.vg-items tr.vg-item-row:focus { outline: 2px solid var(--ev-brand); outline-offset: -2px; }
.vg-tri-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding: 4px 16px; }
.vg-tri-help { margin: 4px 16px 8px; padding: 10px 12px; border: 1px solid var(--ev-border); border-radius: var(--ev-r-md); background: var(--ev-surface-2); }
.vg-tri-keys { list-style: none; margin: 6px 0; padding: 0; display: grid; gap: 4px; }
.vg-tri-keys li { display: flex; gap: 8px; align-items: baseline; }
.vg-tri-keys kbd { min-width: 20px; padding: 0 5px; border: 1px solid var(--ev-border-strong); border-radius: 4px; text-align: center; font: 600 12px/18px var(--ev-font-ui); }
.vg-tray .vg-tray-filters { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: flex-end; padding: 8px 16px; }
.vg-c-watch { max-width: 160px; }

/* 2026-10-31 (F3): Informes in the detail of a watch */
.vg-reports { margin-top: 12px; border-top: 1px solid var(--ev-border); padding-top: 8px; }
.vg-rep-acts { display: flex; flex-wrap: wrap; gap: 8px; }
.vg-rep-list { list-style: none; margin: 6px 16px 12px; padding: 0; display: grid; gap: 4px; }
.vg-rep-list li { display: flex; flex-wrap: wrap; gap: 10px; align-items: baseline; font: 400 12px/18px var(--ev-font-ui); }
.vg-rep-text { color: var(--ev-text-2); }

/* 2026-10-31 (F4 of plan-vigilar-mas-que-el-mercado): Autores, the amplification graph and the coordination signals */
.vg-authors-table td .vg-clip { display: block; }
.vg-row-acts { display: flex; flex-wrap: wrap; gap: 4px 10px; }
.vg-chip.is-info { background: var(--ev-info-soft); color: var(--ev-info); }
.vg-chip.is-signal { background: var(--ev-doubt-soft); color: var(--ev-doubt); }
.vg-amp-fig { margin: 8px 0; border: 1px solid var(--ev-border); border-radius: var(--ev-r-md); background: var(--ev-surface); }
.vg-amp-svg { display: block; width: 100%; height: auto; max-height: 720px; }
.vg-amp-spoke, .vg-amp-member { fill: none; stroke: var(--ev-border-strong); stroke-width: 1; stroke-opacity: 0.5; vector-effect: non-scaling-stroke; }
.vg-amp-edge { fill: none; stroke-opacity: 0.8; stroke-linecap: round; }
.vg-amp-edge.is-repost { stroke: var(--ev-info); }
.vg-amp-edge.is-quote { stroke: var(--ev-doubt); }
.vg-amp-edge.is-link { stroke: var(--ev-brand); }
.vg-amp-edge.is-dense { stroke-opacity: 0.35; }
.vg-amp-arrow.is-repost path { fill: var(--ev-info); }
.vg-amp-arrow.is-quote path { fill: var(--ev-doubt); }
.vg-amp-arrow.is-link path { fill: var(--ev-brand); }
.vg-amp-subject { fill: var(--ev-brand-soft); stroke: var(--ev-brand); stroke-width: 2; }
.vg-amp-subject-name, .vg-amp-hub-name { fill: var(--ev-text); font: 600 17px/1 var(--ev-font-ui); paint-order: stroke; stroke: var(--ev-surface); stroke-width: 4px; }
.vg-amp-hub { fill: var(--ev-surface-2); stroke: var(--ev-text-3); stroke-width: 1.5; }
.vg-amp-leaf { fill: var(--ev-surface-2); stroke: var(--ev-text-3); stroke-width: 1.2; cursor: pointer; }
.vg-amp-leaf.is-linked { fill: var(--ev-info-soft); stroke: var(--ev-info); }
.vg-amp-leaf.is-outside { fill: var(--ev-surface); stroke-dasharray: 3 2; }
.vg-amp-leaf:hover { stroke-width: 2.4; }
.vg-amp-leaf:focus { outline: none; }
.vg-amp-leaf:focus-visible { stroke: var(--ev-focus); stroke-width: 3; }
.vg-amp-name { fill: var(--ev-text-2); font: 500 14px/1 var(--ev-font-ui); paint-order: stroke; stroke: var(--ev-surface); stroke-width: 4px; pointer-events: none; }
.vg-amp-legend { display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: center; padding: 6px 10px; border-top: 1px solid var(--ev-border); font: 500 12px/18px var(--ev-font-ui); }
.vg-amp-key::before { content: ""; display: inline-block; width: 18px; height: 3px; margin-right: 6px; vertical-align: middle; border-radius: 2px; background: currentColor; }
.vg-amp-key.is-repost { color: var(--ev-info); }
.vg-amp-key.is-quote { color: var(--ev-doubt); }
.vg-amp-key.is-link { color: var(--ev-brand); }
.vg-amp-table summary { cursor: pointer; font: 500 13px/20px var(--ev-font-ui); color: var(--ev-text-2); }
.vg-coord-list { list-style: none; margin: 6px 0 0; padding: 0; display: grid; gap: 8px; }
.vg-coord-item { padding: 8px 10px; border: 1px solid var(--ev-border); border-radius: var(--ev-r-md); }
.vg-coord-head { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center; }
.vg-coord-text { margin: 6px 0 2px; font-size: 13px; color: var(--ev-text); }
.vg-coord-accounts { margin: 0 0 4px; font-size: 12px; overflow-wrap: anywhere; }
/* 2026-10-31 (F5 of plan-vigilar-mas-que-el-mercado): Comparar and Desglose; every number is a button that opens its publications */
.vg-compare { display: flex; flex-direction: column; gap: 12px; }
.vg-cmp-form { display: flex; flex-direction: column; gap: 10px; padding: 10px 12px; border: 1px solid var(--ev-border); border-radius: var(--ev-r-md); }
.vg-cmp-form fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
.vg-cmp-modes, .vg-cmp-pick { display: flex; flex-wrap: wrap; gap: 6px 16px; align-items: center; }
.vg-cmp-modes legend, .vg-cmp-pick legend { width: 100%; margin-bottom: 4px; }
.vg-cmp-opt { display: inline-flex; gap: 6px; align-items: center; max-width: 100%; min-width: 0; font-size: 13px; cursor: pointer; }
.vg-cmp-ranges { display: flex; flex-wrap: wrap; gap: 10px 24px; }
.vg-cmp-range { display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: flex-end; }
.vg-cmp-sub { display: block; font-weight: 400; font-size: 11px; }
.vg-cmp-wrap { max-height: none; }
.vg-cmp-table { table-layout: auto; }
.vg-cmp-table .vg-num-c { width: auto; white-space: nowrap; }
.vg-cmp-table th[scope="row"] { min-width: 9em; text-transform: none; letter-spacing: normal; font-size: 12px; font-weight: 500; color: var(--ev-text); overflow-wrap: anywhere; }
.vg-cmp-table th[scope="row"].vg-dim { color: var(--ev-text-2); }
.vg-cmp-cap { caption-side: top; text-align: left; padding: 0 0 4px; font: 600 13px/18px var(--ev-font-ui); color: var(--ev-text); }
.vg-num-btn { display: inline-flex; gap: 6px; align-items: baseline; min-height: 0; padding: 0 2px; border: 0; border-radius: 3px; background: none; color: var(--ev-brand); font: inherit; font-weight: 600; font-variant-numeric: tabular-nums; text-align: left; text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }
.vg-num-btn:hover { color: var(--ev-brand-hover); background: var(--ev-brand-soft); }
.vg-num-btn:focus-visible { outline: 2px solid var(--ev-focus); outline-offset: 1px; }
.vg-num-btn:disabled { color: var(--ev-text-2); font-weight: 400; text-decoration: none; cursor: default; background: none; }
.vg-cmp-terms { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; }
.vg-cmp-termcol { min-width: 0; }
.vg-cmp-termhead { margin: 0 0 4px; font: 600 13px/18px var(--ev-font-ui); }
.vg-cmp-termlist { list-style: none; margin: 0 0 4px; padding: 0; display: grid; gap: 2px; }
.vg-cmp-term { overflow-wrap: anywhere; }
.vg-des-grid { display: grid; grid-template-columns: 1fr; gap: 12px; }
/* 2026-10-31 (F5): the emotion beside the tone */
.vg-emo { display: flex; flex-direction: column; gap: 4px; margin-top: 10px; padding-top: 8px; border-top: 1px solid var(--ev-border); }
.vg-emo .vg-h5 { margin: 0; }
.vg-emo-chip { font-size: 11px; }
.vg-emo-chip.is-enojo, .vg-emo-chip.is-miedo { color: var(--ev-bad); }
.vg-emo-chip.is-alegria { color: var(--ev-good, var(--ev-brand)); }
.vg-emo-chip.is-sin_evaluar { color: var(--ev-text-2); }
/* 2026-10-31 (F6): Resumen del periodo, its narratives and the order learned from the triage */
.vg-per-range { flex-wrap: wrap; gap: 8px; margin: 6px 0; }
.vg-per-mark { font-size: 11px; color: var(--ev-text-2); }
.vg-per-nar { list-style: none; margin: 6px 0; padding: 0; display: grid; gap: 8px; }
.vg-per-nar-item { padding: 8px; border: 1px solid var(--ev-border); border-radius: var(--ev-r-sm, 6px); min-width: 0; }
.vg-per-nar-head { display: flex; flex-wrap: wrap; gap: 8px; align-items: baseline; }
.vg-per-nar-item p { margin: 4px 0; overflow-wrap: anywhere; }
.vg-learned { list-style: none; margin: 0 0 6px; padding: 0; display: grid; gap: 2px; overflow-wrap: anywhere; }
/* 2026-10-31 (F6): Preguntar */
.vg-ask { margin-top: 12px; padding-top: 8px; border-top: 1px solid var(--ev-border); }
.vg-ask-row { flex-wrap: wrap; gap: 8px; }
.vg-ask-input { flex: 1 1 260px; min-width: 0; }
.vg-ask-answer { margin: 8px 0; }
.vg-ask-text { margin: 4px 0; overflow-wrap: anywhere; }
.vg-ask-cite { padding: 0 2px; }
.vg-ask-hist { list-style: none; margin: 6px 0; padding: 0; display: grid; gap: 8px; overflow-wrap: anywhere; }
.vg-ask-hist p { margin: 2px 0; }
/* 2026-11-02: the verified sources the assistant proposed, each with its reason and Quitar */
.vg-suggest { display: flex; flex-direction: column; gap: 4px; margin-top: 6px; }
.vg-suggest-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.vg-suggest-list li { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; min-width: 0; }
.vg-suggest-name { font: 500 12px/18px var(--ev-font-ui); color: var(--ev-text-1); overflow-wrap: anywhere; }
/* 2026-11-04 (batch T): who holds an event and its thread of comments, in the row of the event */
.vg-team { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin: 6px 0 0; }
.vg-team-box { flex-basis: 100%; display: grid; gap: 6px; padding: 6px 8px; border-left: 3px solid var(--ev-border-strong, var(--ev-border)); }
.vg-team-box .vg-area { width: 100%; }
