.fusion-map-layout {
  display: grid;
  grid-template-columns: minmax(310px, 370px) minmax(0, 1fr);
  height: clamp(700px, 80vh, 850px);
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(16, 28, 40, .94);
  box-shadow: var(--shadow);
}

.fusion-map-sidebar {
  z-index: 2;
  display: flex;
  min-width: 0;
  min-height: 0;
  height: 100%;
  max-height: 100%;
  overflow: hidden;
  flex-direction: column;
  border-right: 1px solid var(--line);
  background: var(--panel);
}

.map-sidebar-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--line);
}

.map-sidebar-heading h2 { margin-bottom: 3px; }
.map-sidebar-heading p { margin: 0; color: var(--muted); font-size: .75rem; line-height: 1.45; }

.map-stat-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  border-bottom: 1px solid var(--line);
  background: var(--line);
}

.map-stat-grid div { padding: 9px 15px; background: var(--panel-2); }
.map-stat-grid span { display: block; color: var(--muted); font-size: .64rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.map-stat-grid strong { display: block; margin-top: 3px; font-size: 1.2rem; }

.map-scope-bar { flex: 0 0 auto; padding: 10px 14px; border-bottom: 1px solid var(--line); }
.map-scope-bar .field label { margin-bottom: 4px; font-size: .68rem; }
.map-scope-bar .field select { min-height: 36px; padding-top: 6px; padding-bottom: 6px; font-size: .76rem; }
.map-scope-bar p { margin: 6px 0 0; color: var(--muted); font-size: .62rem; line-height: 1.4; }
.map-scope-bar p.is-error { color: var(--red); font-weight: 700; }
.map-filter-disclosure { flex: 0 0 auto; border: 0; }
.map-filter-disclosure > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--line);
  color: var(--text);
  background: var(--panel-2);
  font-size: .75rem;
  font-weight: 800;
  cursor: pointer;
  list-style: none;
}
.map-filter-disclosure > summary::-webkit-details-marker { display: none; }
.map-filter-disclosure > summary small { color: var(--muted); font-size: .64rem; font-weight: 700; }
.map-filter-disclosure > summary::after { content: '+'; order: 3; font-size: 1rem; line-height: 1; }
.map-filter-disclosure[open] > summary::after { content: '−'; }
.map-filter-form { padding: 12px 14px; border-bottom: 1px solid var(--line); }
.map-filter-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 12px; }
.map-filter-group { display: flex; gap: 14px; margin: 12px 0 0; padding: 0; border: 0; }
.map-filter-group legend { margin-bottom: 6px; color: var(--muted); font-size: .75rem; font-weight: 700; }
.map-filter-group label { display: inline-flex; align-items: center; gap: 6px; color: var(--text); font-size: .76rem; font-weight: 700; }
.map-filter-group input { accent-color: var(--blue); }
.map-filter-actions { display: flex; gap: 8px; margin-top: 13px; }
.map-filter-actions .button { flex: 1 1 0; }
.map-location-panel { flex: 0 0 auto; padding: 9px 14px; border-bottom: 1px solid var(--line); background: rgba(71, 181, 255, .035); }
.map-location-row { display: grid; grid-template-columns: minmax(100px, 1fr) minmax(0, 1.25fr); align-items: end; gap: 8px; }
.map-location-row .button { min-height: 42px; padding-right: 8px; padding-left: 8px; white-space: normal; }
.map-location-status { margin: 5px 0 0; color: var(--muted); font-size: .59rem; line-height: 1.35; }
.map-location-status.is-error { color: var(--red); font-weight: 700; }

.map-result-summary { margin: 0; padding: 11px 16px; border-bottom: 1px solid var(--line); color: var(--muted); font-size: .72rem; font-weight: 700; }
.map-results {
  flex: 1 1 auto;
  min-height: 110px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-color: var(--blue) var(--panel-2);
  scrollbar-gutter: stable;
  scrollbar-width: thin;
}
.map-results::-webkit-scrollbar { width: 10px; }
.map-results::-webkit-scrollbar-track { background: var(--panel-2); }
.map-results::-webkit-scrollbar-thumb { border: 2px solid var(--panel-2); border-radius: 999px; background: var(--blue); }
.map-result-item { min-width: 0; }
.map-result-card {
  display: block;
  width: 100%;
  padding: 13px 16px;
  border: 0;
  border-bottom: 1px solid var(--line);
  color: var(--text);
  background: transparent;
  text-align: left;
  cursor: pointer;
}
.map-result-card:hover { background: rgba(71, 181, 255, .07); }
.map-result-title { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.map-result-title strong { font-size: .86rem; letter-spacing: .03em; }
.map-result-type { padding: 3px 6px; border-radius: 999px; color: #b8f7ed; background: rgba(73, 227, 207, .12); font-size: .59rem; font-style: normal; font-weight: 800; white-space: nowrap; }
.map-result-type.is-gateway { color: #b9e3ff; background: rgba(71, 181, 255, .13); }
.map-result-links { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 5px; }
.map-link-badge { padding: 2px 6px; border: 1px solid rgba(73, 227, 207, .3); border-radius: 999px; color: #b8f7ed; background: rgba(73, 227, 207, .1); font-size: .55rem; font-style: normal; font-weight: 800; }
.map-link-badge.is-reflector-linked { border-color: rgba(255, 199, 102, .36); color: #ffe2ae; background: rgba(255, 199, 102, .1); }
.map-result-frequencies,
.map-result-access,
.map-result-place,
.map-result-meta { display: block; overflow: hidden; margin-top: 4px; color: var(--muted); font-size: .7rem; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.map-result-frequencies { margin-top: 7px; color: var(--text); font-weight: 750; }
.map-result-access { color: #8fd9ff; }
.map-result-meta { color: #bdd0dc; }
.map-no-results { padding: 28px 18px; color: var(--muted); font-size: .8rem; text-align: center; }

.fusion-map-stage { position: relative; min-width: 0; }
.fusion-map { width: 100%; height: 100%; min-height: 0; background: #d6e0e6; }
.fusion-map-legend {
  position: absolute;
  z-index: 500;
  right: 12px;
  bottom: 24px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  max-width: calc(100% - 24px);
  padding: 9px 11px;
  border: 1px solid rgba(36, 57, 75, .35);
  border-radius: 10px;
  color: #172c3a;
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 5px 20px rgba(0, 0, 0, .15);
  font-size: .66rem;
}
.fusion-map-legend strong { width: 100%; font-size: .69rem; }
.fusion-map-legend span { display: inline-flex; align-items: center; gap: 5px; }
.map-legend-dot { width: 10px; height: 10px; border: 2px solid #fff; border-radius: 50%; background: #0ba88f; box-shadow: 0 0 0 1px #087665; }
.map-legend-dot.is-gateway { background: #168fd4; box-shadow: 0 0 0 1px #0d669b; }
.map-legend-dot.is-unavailable { background: #7b8992; box-shadow: 0 0 0 1px #55636c; }
.map-legend-ring { width: 11px; height: 11px; border: 3px solid #0ba88f; border-radius: 50%; background: transparent; }
.map-legend-ring.is-reflector-linked { border-color: #d99018; }

.fusion-map-marker { border: 0; background: transparent; }
.fusion-map-marker span {
  display: block;
  position: relative;
  width: 28px;
  height: 28px;
  border: 3px solid #fff;
  border-radius: 50% 50% 50% 8px;
  background: #0ba88f;
  box-shadow: 0 3px 9px rgba(0, 0, 0, .38);
  transform: rotate(-45deg);
}
.fusion-map-marker span::after { content: ''; position: absolute; inset: 7px; border-radius: 50%; background: #fff; }
.fusion-map-marker.is-gateway span { background: #168fd4; }
.fusion-map-marker.is-unavailable span { background: #7b8992; }
.fusion-map-marker.is-room-linked span { box-shadow: 0 0 0 5px rgba(11, 168, 143, .45), 0 3px 9px rgba(0, 0, 0, .38); }
.fusion-map-marker.is-reflector-linked span { box-shadow: 0 0 0 5px rgba(217, 144, 24, .48), 0 3px 9px rgba(0, 0, 0, .38); }
.fusion-map-marker.is-dual-linked span { box-shadow: 0 0 0 4px rgba(11, 168, 143, .58), 0 0 0 8px rgba(217, 144, 24, .5), 0 3px 9px rgba(0, 0, 0, .38); }
.fusion-map-marker.is-selected span {
  box-shadow: 0 0 0 7px rgba(255, 199, 102, .52), 0 5px 14px rgba(0, 0, 0, .46);
}
.map-user-location-marker { border: 0; background: transparent; }
.map-user-location-marker span {
  display: block;
  width: 24px;
  height: 24px;
  border: 4px solid #fff;
  border-radius: 50%;
  background: #087cc1;
  box-shadow: 0 0 0 6px rgba(71, 181, 255, .25), 0 4px 12px rgba(0, 0, 0, .34);
}

.fusion-map-cluster { border-radius: 50%; color: #fff; background: rgba(7, 16, 25, .22); }
.fusion-map-cluster span {
  display: grid;
  width: 38px;
  height: 38px;
  margin: 2px;
  place-items: center;
  border: 3px solid rgba(255, 255, 255, .86);
  border-radius: 50%;
  background: #087fc2;
  box-shadow: 0 4px 13px rgba(0, 0, 0, .3);
  font-size: .72rem;
  font-weight: 900;
}
.fusion-map-cluster-medium span { background: #087d70; }
.fusion-map-cluster-large span { background: #7357b7; }

.fusion-map-popup { color: #142632; font-family: Inter, ui-sans-serif, system-ui, sans-serif; }
.fusion-map-popup h3 { margin: 1px 0 4px; color: #071d2a; font-size: 1.18rem; }
.fusion-popup-kicker { margin: 0; color: #087fc2; font-size: .65rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.fusion-popup-location { margin: 0 0 11px; color: #526a78; font-size: .76rem; }
.fusion-popup-details { border-top: 1px solid #d8e1e6; }
.fusion-popup-row { display: grid; grid-template-columns: 92px minmax(0, 1fr); gap: 8px; padding: 5px 0; border-bottom: 1px solid #e5ebee; font-size: .7rem; }
.fusion-popup-row span { color: #607684; }
.fusion-popup-row strong { overflow-wrap: anywhere; color: #122b39; }
.fusion-popup-actions { display: flex; gap: 8px; margin-top: 11px; }
.fusion-popup-actions a { padding: 6px 9px; border-radius: 7px; color: #fff; background: #087fc2; font-size: .69rem; font-weight: 800; }
.leaflet-container a { color: #087fc2; }
.leaflet-container .fusion-popup-actions a,
.leaflet-container .fusion-popup-actions a:hover,
.leaflet-container .fusion-popup-actions a:focus { color: #fff; background: #087fc2; }
.leaflet-control-attribution { font-size: 10px; }

.map-tile-status {
  position: absolute;
  z-index: 650;
  top: 12px;
  left: 50%;
  display: flex;
  align-items: center;
  gap: 10px;
  max-width: calc(100% - 110px);
  padding: 8px 10px;
  border: 1px solid rgba(36, 57, 75, .3);
  border-radius: 10px;
  color: #243b48;
  background: rgba(255, 255, 255, .95);
  box-shadow: 0 5px 20px rgba(0, 0, 0, .16);
  font-size: .7rem;
  font-weight: 700;
  transform: translateX(-50%);
}
.map-tile-status[hidden] { display: none; }
.map-tile-status .button { min-height: 30px; color: #fff; border-color: #087fc2; background: #087fc2; white-space: nowrap; }
.map-tile-status .button:hover { color: #fff; background: #056ca7; }

.map-information { margin-top: 20px; }
.map-mobile-interaction-toggle,
.map-mobile-scroll-note { display: none; }
.fusion-map-selection { display: none; }
.fusion-map-selection[hidden] { display: none !important; }
.map-source-note { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.map-source-note p { margin: 0; color: var(--muted); font-size: .76rem; line-height: 1.55; }
.map-source-note strong { color: var(--text); }

:root[data-theme="light"] .fusion-map-layout,
:root[data-theme="light"] .fusion-map-sidebar { background: rgba(255, 255, 255, .96); }
:root[data-theme="light"] .map-sidebar-heading h2,
:root[data-theme="light"] .map-stat-grid strong,
:root[data-theme="light"] .map-result-title strong,
:root[data-theme="light"] .map-filter-group label { color: #102b3b; }
:root[data-theme="light"] .map-sidebar-heading p,
:root[data-theme="light"] .map-result-summary,
:root[data-theme="light"] .map-location-status { color: #496777; }
:root[data-theme="light"] .map-stat-grid div { background: #e8f1f6; }
:root[data-theme="light"] .map-stat-grid span { color: #3f6275; }
:root[data-theme="light"] .map-filter-form { background: #fff; }
:root[data-theme="light"] .map-scope-bar,
:root[data-theme="light"] .map-location-panel { background: #f7fbfd; }
:root[data-theme="light"] .map-scope-bar p { color: #496777; }
:root[data-theme="light"] .map-filter-form .field label,
:root[data-theme="light"] .map-filter-group legend,
:root[data-theme="light"] .map-scope-bar .field label,
:root[data-theme="light"] .map-location-panel .field label { color: #456475; }
:root[data-theme="light"] .map-filter-form .field input,
:root[data-theme="light"] .map-filter-form .field select,
:root[data-theme="light"] .map-scope-bar .field select,
:root[data-theme="light"] .map-location-panel .field select { border-color: #b9cfdd; color: #102b3b; background: #fff; }
:root[data-theme="light"] .map-filter-form .field input::placeholder { color: #647f8f; opacity: 1; }
:root[data-theme="light"] .map-result-meta,
:root[data-theme="light"] .map-result-access { color: #426475; }
:root[data-theme="light"] .map-result-frequencies { color: #173d52; }
:root[data-theme="light"] .map-result-type { color: #08634f; background: #d9f3eb; }
:root[data-theme="light"] .map-result-type.is-gateway { color: #075f93; background: #dceffa; }
:root[data-theme="light"] .map-link-badge { border-color: #8ecfbd; color: #08634f; background: #d9f3eb; }
:root[data-theme="light"] .map-link-badge.is-reflector-linked { border-color: #e6bc73; color: #79500e; background: #fff0d4; }
:root[data-theme="light"] .map-result-card:hover,
:root[data-theme="light"] .map-result-card:focus-visible { background: #eaf4fa; }
:root[data-theme="light"] .map-filter-actions .button:not(.button-secondary) { color: #fff; background: #087cc1; }
:root[data-theme="light"] .map-filter-actions .button:not(.button-secondary):hover { color: #fff; background: #066aa6; }
:root[data-theme="light"] .map-location-status.is-error { color: #a61f39; }

@media (max-width: 980px) {
  .fusion-map-layout { grid-template-columns: 320px minmax(0, 1fr); }
  .map-source-note { grid-template-columns: 1fr; gap: 9px; }
}

@media (max-width: 760px) {
  .fusion-map-layout { display: flex; height: auto; min-height: 0; flex-direction: column; overflow: visible; }
  .fusion-map-sidebar { display: contents; }
  .map-sidebar-heading { order: 1; }
  .map-stat-grid { order: 2; }
  .map-scope-bar { order: 3; }
  .map-filter-disclosure { order: 4; }
  .map-location-panel { order: 5; }
  .fusion-map-stage { order: 6; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
  .map-result-summary { order: 7; }
  .map-results { order: 8; }
  .map-stat-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .all-etcc-map-layout .map-stat-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .map-stat-grid div { padding: 8px 7px; }
  .map-stat-grid span { min-height: 2.35em; font-size: .56rem; }
  .map-stat-grid strong { font-size: 1rem; }
  .map-filter-disclosure > summary { padding: 12px 14px; }
  .map-results { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); max-height: none; overflow: visible; overscroll-behavior: auto; scrollbar-gutter: auto; }
  .map-result-item:nth-child(odd) { border-right: 1px solid var(--line); }
  .fusion-map, .fusion-map-stage { min-height: 58vh; height: 58vh; }
  .fusion-map { touch-action: pan-y !important; }
  .fusion-map-layout.is-map-interactive .fusion-map { touch-action: none !important; }
  .map-mobile-interaction-toggle {
    display: inline-flex;
    position: absolute;
    z-index: 750;
    top: 10px;
    right: 10px;
    min-height: 36px;
    padding: 7px 10px;
    border-color: #087fc2;
    color: #fff;
    background: #087fc2;
    box-shadow: 0 4px 14px rgba(0, 0, 0, .2);
  }
  .map-mobile-interaction-toggle:hover,
  .map-mobile-interaction-toggle:focus-visible { color: #fff; background: #056ca7; }
  .map-mobile-scroll-note {
    display: block;
    position: absolute;
    z-index: 500;
    top: 10px;
    right: 104px;
    left: 52px;
    margin: 0;
    padding: 6px 9px;
    border: 1px solid rgba(36, 57, 75, .25);
    border-radius: 8px;
    color: #294553;
    background: rgba(255, 255, 255, .9);
    font-size: .61rem;
    line-height: 1.35;
    pointer-events: none;
  }
  .fusion-map-selection {
    position: absolute;
    z-index: 850;
    right: 10px;
    bottom: 10px;
    left: 10px;
    display: block;
    max-height: calc(100% - 64px);
    overflow: auto;
    border: 1px solid var(--line);
    border-radius: 12px;
    color: var(--text);
    background: var(--panel);
    box-shadow: 0 8px 28px rgba(0, 0, 0, .32);
    overscroll-behavior: contain;
  }
  .fusion-map-selection-heading {
    display: flex;
    position: sticky;
    z-index: 1;
    top: 0;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 9px 12px;
    border-bottom: 1px solid var(--line);
    background: var(--panel-2);
  }
  .fusion-map-selection-heading strong { font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; }
  .fusion-map-selection-heading button {
    padding: 5px 8px;
    border: 1px solid var(--line);
    border-radius: 7px;
    color: var(--text);
    background: var(--panel);
    font: inherit;
    font-size: .68rem;
    font-weight: 800;
    cursor: pointer;
  }
  .fusion-map-selection-content { padding: 12px; }
  .fusion-map-selection .fusion-map-popup,
  .fusion-map-selection .fusion-map-popup h3,
  .fusion-map-selection .fusion-popup-row strong { color: var(--text); }
  .fusion-map-selection .fusion-popup-location,
  .fusion-map-selection .fusion-popup-row span { color: var(--muted); }
  .fusion-map-selection .fusion-popup-details { border-top-color: var(--line); }
  .fusion-map-selection .fusion-popup-row { border-bottom-color: var(--line); }
  .fusion-map-stage.has-selection .fusion-map-legend,
  .fusion-map-stage.has-selection .map-mobile-scroll-note { display: none; }
}

@media (max-width: 520px) {
  .map-sidebar-heading { padding: 15px 14px; }
  .map-sidebar-heading p { display: none; }
  .map-filter-form { padding: 14px; }
  .map-filter-row { grid-template-columns: 1fr; }
  .map-filter-group { flex-direction: column; gap: 8px; }
  .map-results { display: block; max-height: none; overflow: visible; }
  .map-result-item:nth-child(odd) { border-right: 0; }
  .fusion-map, .fusion-map-stage { min-height: 54vh; height: 54vh; }
  .fusion-map-legend { right: 8px; bottom: 24px; left: 8px; }
  .map-information .panel-header .button { align-self: flex-start; }
}
