.map-legends {
  position:absolute;
  left:14px;
  width:min(420px,calc(100% - 115px));
  z-index:5;
  overflow:auto;
  scrollbar-width:thin;
  display:grid;
  gap:5px;
  overscroll-behavior:contain;
  color:#fff;
  font-size:10px;
  pointer-events:none;
}
.map-legend {
  position:relative;
  background:#191219e8;
  border:1px solid #ffffff60;
  border-radius:3px;
  box-shadow:0 1px 5px #0004;
  overflow:hidden;
  pointer-events:auto;
}
.map-legend[data-source="Terrain_Shade"][open] {
  width:min(240px,100%);
  box-sizing:border-box;
}
.map-legend>summary {
  position:absolute;
  inset:0 auto 0 0;
  width:20px;
  cursor:pointer;
  list-style:none;
  user-select:none;
  display:grid;
  place-items:center;
  color:#ddd;
}
.map-legend>summary::-webkit-details-marker {
  display:none;
}
.map-legend>summary::after {
  content:'‹';
  font-size:18px;
  line-height:1;
}
.map-legend>summary:focus-visible {
  outline:2px solid #f4c361;
  outline-offset:-2px;
}
.map-legend:not([open]) {
  width:22px;
  height:24px;
}
.map-legend:not([open])>summary {
  width:100%;
}
.map-legend:not([open])>summary::after {
  content:'›';
}
.map-legend-body {
  padding:3px 4px 3px 22px;
}
.map-legend-scale {
  display:grid;
  grid-template-columns:repeat(var(--legend-columns),minmax(0,1fr));
  gap:0;
}
.map-legend-cell {
  min-width:0;
  text-align:center;
}
.map-legend-color {
  display:block;
  height:10px;
}
.map-legend-color.is-transparent {
  background:repeating-conic-gradient(#687b7c 0 25%,#c2cccc 0 50%) 50%/6px 6px;
}
.map-legend-label {
  display:block;
  font-size:10px;
  font-weight:600;
  font-variant-numeric:tabular-nums;
  line-height:1.4;
  margin-top:2px;
  white-space:nowrap;
}
@media(max-width:760px) {
  .map-legends {
    left:8px;
    width:min(420px,calc(100% - 74px));
  }
  .map-legend-label {
    font-size:9px;
  }
}
@media print {
  .map-legends {
    display:none;
  }
}
.map-legend.is-aspect[open] {
  width:112px;
  border-radius:50%;
  background:#183336db;
}
.map-legend.is-aspect[open]>.map-legend-body {
  padding:3px;
}
.map-legend.is-aspect[open]>summary {
  inset:auto 10px 10px auto;
  width:20px;
  height:20px;
  background:#183336;
  border-radius:50%;
  z-index:1;
  border:1px solid #ffffff60;
}
.map-legend-compass {
  position:relative;
  width:104px;
  height:104px;
}
.map-legend-compass-colors {
  position:absolute;
  inset:16px;
  border-radius:50%;
  box-shadow:0 0 0 1px #ffffff80;
}
.map-legend-compass-label {
  position:absolute;
  font-size:12px;
  font-weight:700;
  line-height:16px;
  text-align:center;
  text-shadow:0 1px 3px #000;
}
.map-legend-compass-label.north {
  top:0;
  left:44px;
  width:16px;
}
.map-legend-compass-label.east {
  right:0;
  top:44px;
  width:16px;
}
.map-legend-compass-label.south {
  bottom:0;
  left:44px;
  width:16px;
}
.map-legend-compass-label.west {
  left:0;
  top:44px;
  width:16px;
}
.map-legend-gradient {
  position:relative;
  height:32px;
  margin:0 5px;
}
.map-legend-gradient-bar {
  height:10px;
}
.map-legend-gradient-tick {
  position:absolute;
  top:10px;
  height:5px;
  border-left:1px solid #fff;
}
.map-legend-gradient-tick>span {
  position:absolute;
  top:6px;
  left:0;
  transform:translateX(-50%);
  font-size:11px;
  line-height:14px;
  white-space:nowrap;
  font-variant-numeric:tabular-nums;
}
.map-legend-gradient-tick.is-first>span {
  transform:none;
}
.map-legend-gradient-tick.is-last>span {
  transform:translateX(-100%);
}
.map-legend[data-source="Nakarte_Westra"][open] {
  width:min(290px,100%);
  box-sizing:border-box;
}
.map-legend-note {
  display:block;
  font-size:10px;
  line-height:1.4;
  margin:1px 4px 5px;
  color:#eee;
}
.map-legend.is-elevation[open] {
  width:min(280px,100%);
}
.elevation-legend-grid {
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:5px 12px;
  padding:4px;
}
.elevation-legend-grid .map-legend-cell {
  display:flex;
  align-items:center;
  gap:6px;
  text-align:left;
}
.elevation-legend-grid .map-legend-color {
  width:14px;
  height:10px;
  flex-shrink:0;
}
.elevation-legend-grid .map-legend-label {
  margin:0;
  font-size:10px;
}
