.map-bg.mobile {
  background-color: PaleTurquoise;
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
}

#map {
  position: fixed;
  top: 0;
  right: 0;
  z-index: -1;
  transform-origin: top right;
  height: 100vh;
  aspect-ratio: 270 / 460;
  stroke-linecap: round;
  stroke-linejoin: round;
  paint-order: stroke;
  background-image: linear-gradient(
    91deg,
    transparent,
    rgba(175, 238, 238, 0.1) 3%,
    PaleTurquoise 15%,
    PaleTurquoise
  );
}
@media (orientation: landscape) and (max-height: 528px) {
  #map {
    height: 100vw;
    transform: rotate(-90deg) translateY(-100%);
  }
}
html.menu.scrollbar #map {
  right: var(--scrollbar-width);
}
.map-bg.desktop.map-on-top,
#map.desktop.map-on-top {
  z-index: 3;
}

#map .current-area {
  fill: OrangeRed;
  opacity: 0.6;
}
#map .current-city {
  stroke: OrangeRed;
}
#map .current-shore {
  visibility: visible;
  fill: none;
  stroke: OrangeRed;
  stroke-width: 0.3em;
  filter: url(#shadow);
}

#map .cities {
  stroke-width: 0.1em;
}
#map .contour {
  stroke: #00000000;
  stroke-width: 0;
  stroke-opacity: 0;
}
#map .county-area {
  stroke: DimGray;
  stroke-width: 1;
  fill: none;
}
#map .text-county {
  fill: DimGray;
  font-size: 1rem;
}
#map .river-jordan {
  stroke: PaleTurquoise;
  fill: none;
  stroke-width: 2;
}
#map .text-jordan {
  fill: PaleTurquoise;
  stroke: none;
  font-weight: bold;
}
#map .m1000 {
  fill: DarkGoldenRod;
}
#map .m500 {
  fill: GoldenRod;
}
#map .m200 {
  fill: Orange;
}
#map .m100 {
  fill: Gold;
}
#map .m0 {
  fill: OliveDrab;
}
#map .m00-land {
  fill: YellowGreen;
}
#map .m-flood {
  fill: MediumSeaGreen;
}
#map .m00-sea {
  fill: PaleTurquoise;
}
#map .river {
  stroke: PaleTurquoise;
  fill: none;
  stroke-width: 1;
}
#map .scale > path {
  fill: none;
  stroke: DimGray;
}
#map .shores {
  visibility: hidden;
}
#map .text-water {
  fill: DodgerBlue;
}

#map .end {
  text-anchor: end;
}
#map .center {
  text-anchor: middle;
}

#map text {
  font-size: 0.6rem;
  font-family: var(--serif-normal);
  white-space: pre;
  stroke-width: 0.1em;
}