#map {height:clamp(420px,72vh,780px);min-height:0;overflow:hidden;touch-action:none}
#network {display:block;width:100%;height:100%;min-width:0}
#network .node {transition:none}
#network .node-inner {transition:none}
#network .d3-cluster-halo {fill:#fffdf7;stroke:#d9d2c4;stroke-dasharray:6 6}
#network .d3-cluster-title {fill:#43534d;font-size:16px;font-weight:700;pointer-events:none}
#network .link {transition:none;pointer-events:none}
#network .video-badge-triangle {fill:var(--video)}
#network .node:focus {outline:none}
#network .node:focus circle.body {stroke:#c79024;stroke-width:6}
#network .node text {font-size:12px}
#status {display:block;width:25%;font-size:11px;}
@media(max-width:760px){#map{height:65vh;min-height:420px}#network{height:100%;min-width:0}}

.map-navigation {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 6px;

  min-width: 0;
  max-width: 100%;
  overflow-x: auto;
  padding: 4px;
}

.map-navigation button {
  flex: 0 0 auto;
  white-space: nowrap;
  padding: 7px 10px;
  font-size: 0.78rem;
}
.map-panel:has(#map.gateway-mode) #zoomIn,
.map-panel:has(#map.gateway-mode) #zoomOut {
  display: none;
}
.map-navigation .map-icon-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: 44px;
  height: 44px;
  padding: 0;
  flex: 0 0 44px;
}

.map-icon-button svg {
  display: block;
  pointer-events: none;
  width:100%;
  height:60%;
}