/* Where a line may cross a border.
   The proportion bars exist to make one comparison readable: how little of the
   public surface can carry a line across jurisdictions at all. Every segment is
   also printed as a number beside it, so nothing here is available only
   visually. */

.cl-bars {
  margin: 1.5rem 0 2rem;
  display: grid;
  gap: 0.5rem;
}

.cl-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 40% auto;
  gap: 0.75rem;
  align-items: center;
}

.cl-label {
  font-size: 0.9rem;
  min-width: 0;
}

.cl-track {
  position: relative;
  height: 0.75rem;
  border-radius: 0.375rem;
  background: rgba(0, 0, 0, 0.08);
  overflow: hidden;
}

.cl-seg {
  display: block;
  height: 100%;
  border-radius: 0.375rem;
  background: currentColor;
  opacity: 0.75;
}

/* The four states are distinguished by opacity rather than by hue, so the
   distinction survives for a reader who does not separate colours, and so
   nothing here implies a good-to-bad ramp. Comparability is not a score. */
.cl-single { opacity: 0.35; }
.cl-unclassed { opacity: 0.55; }
.cl-common { opacity: 0.9; }
.cl-broken { opacity: 0.9; }

.cl-value {
  font-variant-numeric: tabular-nums;
  font-size: 0.9rem;
  white-space: nowrap;
}

.cl-break {
  opacity: 0.7;
  font-size: 0.9em;
}

/* The theme is set by the site's own toggle, which stamps data-theme on the
   root element; the OS preference is only the default. Keying off
   prefers-color-scheme alone drew a near-white track onto a cream page on a
   machine preferring dark. Both signals, with the attribute winning. */
@media (prefers-color-scheme: dark) {
  .cl-track { background: rgba(255, 255, 255, 0.14); }
}
:root[data-theme="dark"] .cl-track { background: rgba(255, 255, 255, 0.14); }
:root[data-theme="light"] .cl-track { background: rgba(0, 0, 0, 0.08); }

.tablewrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

@media (max-width: 640px) {
  .cl-row { grid-template-columns: minmax(0, 1fr) auto; }
  .cl-track { display: none; }
}

/* A value too small for the track to draw truthfully says so, in the space the
   bar would have occupied. This replaces a minimum-width floor, which drew 408
   series and 3 series at identical width and overstated the smaller by a factor
   of four hundred. On a page arguing that a line should refuse to draw where it
   cannot be honest, a floor would have been the same mistake in miniature. */
.cl-toosmall {
  background: none;
  display: flex;
  align-items: center;
  height: auto;
}

.cl-note {
  font-size: 0.8rem;
  opacity: 0.75;
  font-style: italic;
}
