/* ICONS: animated threat icons. Owns everything inside the [data-icon] mounts.
   The mount (size, placement) belongs to LAYOUT; set --icon-size on it (default 64px).
   States are exposed on the mount as data-state="idle|scanning|resolved". */
.vi {
  --vi-ink: #191919;
  --vi-dim: #9a9a9a;
  --vi-faint: #dcdcdc;
  --vi-paper: var(--icon-paper, var(--paper, #fafafa));
  --vi-tile: var(--tile, #efefef);
  display: block;
  width: var(--icon-size, 64px);
  max-width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  shape-rendering: geometricPrecision;
  pointer-events: none;
}
/* Sized mounts (LAYOUT's .stat-icon, lab tiles): the icon fills the mount exactly. */
[data-icon] > .vi { width: 100%; height: 100%; max-width: none; aspect-ratio: auto; }
.vi .s {
  fill: none;
  stroke: var(--vi-ink);
  stroke-width: var(--vi-sw, 1.4);
  stroke-linecap: round;
  stroke-linejoin: round;
}
.vi .s.thin { stroke-width: calc(var(--vi-sw, 1.4) * .72); }
.vi .s.d { stroke: var(--vi-dim); }
.vi .s.f { stroke: var(--vi-faint); }
.vi .s.sp { stroke: var(--vi-paper); }
.vi .fk { fill: var(--vi-ink); }
.vi .fd { fill: var(--vi-dim); }
.vi .fp { fill: var(--vi-paper); }
.vi .ft { fill: var(--vi-ink); fill-opacity: .07; }
.vi .ftile { fill: var(--vi-tile); }