/* Shared site tokens; map is the primary unframed experience. */
.stream-map-page main h1 { font-size: 64px; margin: 0; }
.map-heading { display: flex; align-items: center; justify-content: space-between; gap: var(--space-sm); }
.map-legend { display: flex; flex-wrap: wrap; gap: var(--space-sm) var(--space-lg); margin: var(--space-md) 0; font-size: var(--text-sm); }
.map-legend span { display: inline-flex; flex-wrap: wrap; align-items: center; gap: var(--space-2xs); }
.map-legend i { color: var(--color-accent); }
.map-legend span:first-child i { color: var(--color-feud); }
.map-legend small { font-size: var(--text-xs); color: var(--color-ink-2); }
#streamMap { position: relative; width: 100%; aspect-ratio: 1100 / 660; background: var(--color-transparent); font-family: var(--font-body); }
.stream-map-artwork { display: block; width: 100%; height: 100%; }
.stream-map-artwork path { vector-effect: non-scaling-stroke; }
.stream-marker { position: absolute; width: 28px; height: 28px; padding: 0; transform: translate(-50%, -50%); font-size: 14px; cursor: pointer; }
.stream-marker-home { width: 40px; height: 40px; font-size: 18px; z-index: 2 !important; }
.map-pin-leader { stroke: var(--color-accent); stroke-width: 1; vector-effect: non-scaling-stroke; }
.map-pin-name { position: absolute; transform: translateX(-50%); z-index: 3; padding: var(--space-2xs) var(--space-xs); background: var(--color-paper); color: var(--color-ink); border: 1px solid var(--color-rule); border-radius: var(--radius-input); font-size: var(--text-xs); white-space: nowrap; pointer-events: none; }
.map-credit { font-size: 10px; text-align: right; color: var(--color-ink-2); }
.map-credit a { color: var(--color-accent); }
.stream-marker { display: flex; align-items: center; justify-content: center; background: var(--color-accent); color: var(--color-accent-ink); border: 2px solid var(--color-paper); border-radius: 50%; box-shadow: none; }
.stream-marker-home { background: var(--color-feud); border-width: 3px; z-index: 1000; }
.stream-marker:focus-visible { outline: 3px solid var(--color-paper); outline-offset: 3px; }
.stream-map-page .leaflet-popup-content-wrapper, .stream-map-page .leaflet-popup-tip { background: var(--color-paper-2); color: var(--color-ink); border-radius: var(--radius-input); box-shadow: none; }
.stream-map-page .leaflet-popup-content { margin: var(--space-xs) var(--space-sm); font-size: var(--text-sm); font-weight: 600; }
.stream-map-page .leaflet-container a.leaflet-popup-close-button { color: var(--color-ink-2); }
.stream-map-page .leaflet-control-zoom a { background: var(--color-paper-2); color: var(--color-ink); }
.stream-map-page .leaflet-control-attribution { background: var(--color-paper); color: var(--color-ink-2); }
.stream-map-page .leaflet-control-attribution a { color: var(--color-accent); }
.map-location-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-sm); list-style: none; margin: var(--space-lg) 0 0; padding: 0; color: var(--color-ink-2); font-size: var(--text-xs); }
#mapStatus { color: var(--color-ink-2); font-size: var(--text-sm); }
.map-country { fill: none; stroke: var(--color-ink-2); stroke-opacity: 0.55; }
.map-state-line { stroke: var(--color-ink-2); stroke-opacity: 0.45; fill: none; }
.map-country-label { color: var(--color-ink-2); text-align: center; font-size: 10px; font-family: var(--font-outlier); pointer-events: none; }
@media (max-width: 767px) {
  .stream-map-page main h1 { font-size: 44px; }
  .map-location-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}