/* --- MAP --- */
#map-mask {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  /* Matches your Dashboard size logic */
  width: 100%;
  height: 100%;

  /* If you set max-width/height on dashboard, set it here too if you want the map contained */
  max-width: 1280px;
  max-height: 720px;

  /* THE CRITICAL LINE: Hides anything sticking out */
  overflow: hidden;

  z-index: 0;
}

/* --- THE MAP (The Content) --- */
#map-container {
  position: absolute;

  /* Huge size to prevent missing corners */
  width: 200%;
  height: 200%;

  /* Center the div in the mask */
  top: -50%;
  left: -50%;
  margin-left: 0; /* Reset this so JS has full control */

  z-index: 0;

  /* Let JS handle transforms directly */
  will-change: transform;
  transform-origin: center center; /* Default pivot */
  transition:
    transform 1.5s linear,
    filter 0.5s ease;
}