/* Floating HTML labels (CSS2DRenderer) naming each structure. Centered on
   the structure by the renderer; must not eat pointer events. No box: the
   name is white glyphs with an outline in the structure's own color (set
   per-label via --label-color in js/labels.js) plus a soft black halo, so
   it stays legible over any region and overlapping labels don't hide each
   other behind opaque rectangles. */
.structure-label,
.connection-label {
  pointer-events: none;
  user-select: none;
  white-space: nowrap;
  font-size: 13px;
  font-weight: 700;
  color: var(--label-ink);
  background: none;
  --label-color: #000;
  text-shadow:
    -1px -1px 0 var(--label-color), 0 -1px 0 var(--label-color), 1px -1px 0 var(--label-color),
    -1px  0   0 var(--label-color),                              1px  0   0 var(--label-color),
    -1px  1px 0 var(--label-color), 0  1px 0 var(--label-color), 1px  1px 0 var(--label-color),
     0    0   4px rgba(var(--label-halo), 0.95);
}
/* Connection (pathway) labels: a touch smaller and italic so they read as
   the projection name rather than a region name. Color comes from an
   inline --label-color set per arrow (its kind color) in js/labels.js. */
.connection-label {
  font-size: 11px;
  font-weight: 600;
  font-style: italic;
}