/* Geographic overview: no tiles, synthetic density or independent design system. */
.coverage-overview__intro {
  max-width: var(--layout-prose-max);
}

.coverage-overview__figure {
  margin: var(--space-scale-8) 0 0;
  border: var(--border-width-hairline) solid var(--color-card-border);
  border-radius: var(--radius-scale-lg);
  overflow: hidden;
  background: var(--color-surface-card);
}

.coverage-overview__canvas {
  padding: var(--space-scale-4) var(--space-scale-2);
}

.coverage-overview__map {
  display: block;
  width: 100%;
  height: auto;
}

.coverage-overview__states {
  fill: color-mix(in srgb, var(--color-brand-primary) 20%, var(--color-surface-card));
  stroke: color-mix(in srgb, var(--color-brand-primary) 45%, var(--color-text-primary));
  stroke-width: 0.8;
  stroke-linejoin: round;
}

.coverage-overview__labels {
  pointer-events: none;
  display: none;
  fill: var(--color-text-primary);
  font-family: var(--font-family-body);
  font-size: 17px;
  font-weight: var(--font-weight-semibold);
  text-anchor: middle;
}

.coverage-overview__hq {
  pointer-events: none;
  fill: var(--color-text-primary);
  font-family: var(--font-family-body);
  font-size: 25px;
  font-weight: var(--font-weight-semibold);
}

.coverage-overview__leader {
  display: none;
  fill: none;
  stroke: var(--color-text-primary);
  stroke-width: 1;
}

.coverage-overview__pin {
  r: 16px;
  fill: var(--color-brand-primary);
  stroke: var(--color-surface-card);
  stroke-width: 3;
}

.coverage-overview__hq text {
  display: none;
}

.coverage-overview__caption {
  display: grid;
  gap: var(--space-scale-5);
  padding: var(--space-scale-5);
  border-top: var(--border-width-hairline) solid var(--color-card-border);
}

.coverage-overview__key {
  display: flex;
  align-items: flex-start;
  gap: var(--space-scale-3);
  font-size: var(--font-size-small);
}

.coverage-overview__key strong {
  display: block;
  font-weight: var(--font-weight-semibold);
}

.coverage-overview__key p {
  margin: var(--space-scale-1) 0 0;
  color: var(--color-text-secondary);
}

.coverage-overview__swatch,
.coverage-overview__dot {
  flex: 0 0 var(--space-scale-3);
  height: var(--space-scale-3);
  margin-top: var(--space-scale-1);
}

.coverage-overview__swatch {
  background: color-mix(in srgb, var(--color-brand-primary) 20%, var(--color-surface-card));
  border: var(--border-width-hairline) solid color-mix(in srgb, var(--color-brand-primary) 45%, var(--color-text-primary));
  border-radius: var(--radius-scale-sm);
}

.coverage-overview__dot {
  background: var(--color-brand-primary);
  border: var(--border-width-hairline) solid var(--color-text-primary);
  border-radius: var(--radius-scale-full);
}

.coverage-overview.is-interactive [data-map-state] {
  cursor: default;
  outline: none;
  transition: fill var(--motion-duration-fast) var(--motion-easing);
}

.coverage-overview [data-map-state].is-active {
  fill: color-mix(in srgb, var(--color-brand-primary) 42%, var(--color-surface-card));
}

.coverage-overview [data-map-state]:focus-visible {
  stroke: var(--color-text-primary);
  stroke-width: 2;
}

.coverage-overview__labels .is-active {
  text-decoration: underline;
}

.coverage-overview__source {
  max-width: none;
  margin: var(--space-scale-4) 0 0;
  font-size: var(--font-size-caption);
  color: var(--color-text-secondary);
}

.coverage-overview__source a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 0.2em;
}

@media (min-width: 768px) {
  .coverage-overview__canvas {
    padding: var(--space-scale-8);
  }

  .coverage-overview__caption {
    grid-template-columns: 1fr 1fr;
    padding: var(--space-scale-6) var(--space-scale-8);
    gap: var(--space-scale-8);
  }

  .coverage-overview__hq {
    font-size: 19px;
  }

  .coverage-overview__hq text,
  .coverage-overview__leader {
    display: block;
  }

  .coverage-overview__pin {
    r: 7px;
  }
}

@media (min-width: 1024px) {
  .coverage-overview__labels {
    display: block;
  }
}

@media (prefers-reduced-motion: reduce) {
  .coverage-overview.is-interactive [data-map-state] {
    transition: none;
  }
}
