html {
  scrollbar-gutter: stable;
}

.world-desk-page {
  overflow-x: clip;
}

.world-desk-page .world-browser {
  width: min(1500px, calc(100% - 24px));
}

.world-desk-page .world-browser-layout {
  grid-template-columns: minmax(0, 1fr) !important;
  border: 1px solid #aebcb8;
  background: #fff;
}

.world-desk-page .world-map-column {
  border-right: 0;
  border-bottom: 1px solid #aebcb8;
}

.world-desk-page .world-map-stage {
  height: clamp(610px, 72vh, 840px);
  min-height: 610px;
  background: #c7dce3;
}

.world-desk-page .world-map-stage svg [data-world-map-surface],
.world-desk-page .world-map-stage svg [data-world-map-regions],
.world-desk-page .world-map-stage svg [data-world-map-overlays] {
  transition: opacity .14s ease;
}

.world-desk-page .world-map-stage svg.is-zooming [data-world-map-surface],
.world-desk-page .world-map-stage svg.is-zooming [data-world-map-regions],
.world-desk-page .world-map-stage svg.is-zooming [data-world-map-overlays] {
  opacity: 0;
}

.world-desk-page .world-map-stage svg.is-zooming path[data-country-code] {
  transition: none;
}

.world-desk-page .world-map-stage path[data-country-code],
.world-desk-page .world-map-stage path[data-country-code].has-coverage {
  fill: #e8ece9;
  stroke: #8ca19b;
}

.world-desk-page .world-map-stage path[data-country-code]:hover,
.world-desk-page .world-map-stage path[data-country-code]:focus-visible {
  fill: #d4e8df;
  stroke: #0e7451;
}

.world-desk-page .world-map-stage path[data-country-code].is-selected {
  fill: #b9decf;
  stroke: #0a5a41;
  stroke-width: 1.4;
}

.world-ocean-label-anchor,
.world-country-label {
  pointer-events: none;
}

.world-ocean-label {
  fill: #3f6c7a;
  font: 800 8px/1 Arial, sans-serif;
  letter-spacing: 0;
  opacity: .8;
  paint-order: stroke;
  stroke: #dce9ec;
  stroke-width: 3px;
  stroke-linejoin: round;
  pointer-events: none;
}

[data-world-map-oceans][hidden] {
  display: none;
}

.world-country-label text {
  fill: #173a40;
  font: 900 8px/1 Arial, sans-serif;
  letter-spacing: 0;
  paint-order: stroke;
  stroke: #f5f8f6;
  stroke-width: 3px;
  stroke-linejoin: round;
}

.world-map-stage[data-map-detail="country"] .world-ocean-label,
.world-map-stage[data-map-detail="local"] .world-ocean-label {
  font-size: 7px;
}

.world-map-stage[data-map-detail="country"] .world-admin-marker-name {
  display: block;
  opacity: 1;
  fill: #173a40;
  font-size: 7px;
  font-weight: 900;
  paint-order: stroke;
  stroke: #f5f8f6;
  stroke-width: 3px;
  stroke-linejoin: round;
}

.world-map-stage[data-map-detail="country"] .world-admin-marker-weather {
  display: none;
}

.world-wind-marker.is-marine circle {
  fill: #0b7896;
  stroke: #fff;
  stroke-width: 2px;
}

.world-wind-marker.is-marine .world-wind-speed {
  fill: #063c4a;
  paint-order: stroke;
  stroke: #fff;
  stroke-width: 3px;
}

.world-map-layer-controls {
  gap: 4px;
  padding: 5px;
  border: 1px solid rgba(16, 23, 26, .34);
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 6px 18px rgba(16, 23, 26, .16);
}

.world-map-layer-controls button {
  min-height: 36px;
  padding: 8px 12px;
  border-color: transparent;
  background: transparent;
}

.world-map-layer-controls button[data-world-layer="alerts"].is-active {
  color: #fff;
  background: #b52333;
  box-shadow: inset 0 -3px 0 #efc832;
}

.world-map-layer-controls button[data-world-layer="weather"].is-active,
.world-map-layer-controls button[data-world-layer="wind"].is-active,
.world-map-layer-controls button[data-world-layer="precipitation"].is-active {
  color: #fff;
  background: #0e7451;
}

.world-country-search {
  position: relative;
  width: min(100%, 340px);
  justify-self: end;
  gap: 5px;
}

.world-desk-page .world-browser-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
  gap: 12px 24px;
  align-items: end;
}

.world-desk-page .world-browser-toolbar > h2 {
  margin: 0;
}

.world-desk-page .world-country-toolbar-search {
  width: 100%;
  justify-self: end;
}

.world-desk-page .world-region-tabs {
  grid-column: 1 / -1;
}

.world-country-search > label {
  font-size: 10px;
  line-height: 1.2;
  text-transform: uppercase;
}

.world-country-search-control {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
}

.world-country-search .world-country-search-control input {
  min-height: 36px;
  padding: 6px 10px;
  border-radius: 3px 0 0 3px;
  font-size: 13px;
}

.world-country-search-control > button {
  min-width: 64px;
  min-height: 36px;
  padding: 6px 12px;
  border: 1px solid #0e7451;
  color: #fff;
  background: #0e7451;
  font: 900 11px/1 Arial, sans-serif;
  cursor: pointer;
}

.world-country-search-control > button:hover,
.world-country-search-control > button:focus-visible {
  color: #fff;
  background: #10171a;
}

.world-country-search-results {
  position: absolute;
  z-index: 40;
  top: calc(100% + 5px);
  right: 0;
  left: 0;
  max-height: 330px;
  overflow-y: auto;
  border: 1px solid #9eafa9;
  background: #fff;
  box-shadow: 0 14px 32px rgba(16, 23, 26, .2);
}

.world-country-search-results[hidden] {
  display: none !important;
}

.world-country-search-results > p {
  margin: 0;
  padding: 12px;
  color: #52615d;
  font-size: 12px;
}

.world-country-search-results button {
  width: 100%;
  display: grid;
  gap: 3px;
  padding: 10px 12px;
  border: 0;
  border-bottom: 1px solid #dde4e1;
  text-align: left;
  background: #fff;
  cursor: pointer;
}

.world-country-search-results button:hover,
.world-country-search-results button:focus-visible {
  outline: 0;
  background: #e9f4ef;
  box-shadow: inset 4px 0 0 #0e7451;
}

.world-country-search-results strong {
  color: #10171a;
  font-size: 13px;
}

.world-country-search-results small {
  color: #667570;
  font-size: 10px;
}

.world-map-scale[hidden] {
  display: none !important;
}

.world-map-legend {
  display: grid;
  grid-template-columns: repeat(3, max-content) minmax(280px, 1fr);
  gap: 10px 22px;
  align-items: center;
  padding: 12px 16px;
  background: #f7f9f8;
}

.world-map-legend i.administrative-layer {
  border-color: #0e7451;
  background: #d4e8df;
}

.world-map-legend small {
  margin: 0;
  text-align: right;
}

.world-country-panel.world-country-navigator {
  display: grid;
  grid-template-columns: minmax(190px, 260px) minmax(0, 1fr);
  gap: 8px 26px;
  padding: 24px;
  border: 0;
  border-top: 4px solid #0e7451;
  background: #f7faf8;
  box-shadow: inset 0 1px 0 #fff;
}

.world-country-panel.world-country-navigator[hidden] {
  display: none !important;
}

.world-country-navigator > .story-kicker,
.world-country-navigator > h2,
.world-country-navigator > .world-edition-languages {
  grid-column: 1;
}

.world-country-navigator > .story-kicker {
  align-self: end;
  margin: 0;
}

.world-country-navigator > h2 {
  margin: 0;
  font-size: clamp(34px, 4vw, 58px);
  line-height: .96;
}

.world-country-instruction {
  grid-column: 2;
  align-self: end;
  max-width: 850px;
  margin: 0;
  color: #384b45;
  font-size: 16px;
}

.world-place-search {
  position: relative;
  z-index: 9;
  grid-column: 2;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: end;
}

.world-place-search label {
  display: grid;
  gap: 5px;
  min-width: 0;
  color: #33453f;
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.world-place-search input {
  width: 100%;
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid #a9bab5;
  color: #10171a;
  background: #fff;
  font: 750 14px/1.2 Arial, sans-serif;
}

.world-place-search > button {
  min-height: 44px;
  padding: 10px 18px;
  border: 1px solid #0e7451;
  color: #fff;
  background: #0e7451;
  font-weight: 900;
  cursor: pointer;
}

.world-place-search > button:hover,
.world-place-search > button:focus-visible {
  background: #10171a;
}

.world-place-results {
  position: absolute;
  top: calc(100% + 5px);
  right: 0;
  left: 0;
  max-height: 330px;
  overflow-y: auto;
  border: 1px solid #9eafa9;
  background: #fff;
  box-shadow: 0 14px 32px rgba(16, 23, 26, .2);
}

.world-place-results[hidden] {
  display: none !important;
}

.world-place-results > p {
  margin: 0;
  padding: 14px;
  color: #52615d;
}

.world-place-results button {
  width: 100%;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 3px 12px;
  padding: 11px 13px;
  border: 0;
  border-bottom: 1px solid #dde4e1;
  text-align: left;
  background: #fff;
  cursor: pointer;
}

.world-place-results button:hover,
.world-place-results button:focus-visible {
  outline: 0;
  background: #e9f4ef;
  box-shadow: inset 4px 0 0 #0e7451;
}

.world-place-results strong {
  grid-column: 1;
  color: #10171a;
  font-size: 13px;
}

.world-place-results span {
  grid-column: 1;
  color: #667570;
  font-size: 10px;
}

.world-place-results small {
  grid-column: 2;
  grid-row: 1 / 3;
  align-self: center;
  color: #0e7451;
  font-weight: 900;
}

.world-place-status {
  grid-column: 2;
  min-height: 20px;
  margin: 0;
  color: #0a684a;
  font-size: 11px;
  font-weight: 850;
}

.world-country-navigator > .world-selected-weather,
.world-country-navigator > .world-country-actions,
.world-country-navigator > .world-country-reference,
.world-country-navigator > .world-country-latest {
  grid-column: 1 / -1;
}

.world-country-navigator > [data-world-country-status] {
  display: none;
}

.world-country-navigator > .world-selected-weather {
  grid-template-columns: minmax(150px, .45fr) minmax(260px, 1fr) minmax(320px, 1.4fr);
  gap: 16px;
  align-items: center;
  margin-top: 10px;
  padding: 15px 17px;
  border: 1px solid #b9c9c4;
  border-left: 5px solid #168c62;
  background: #fff;
}

.world-country-navigator > .world-selected-weather[hidden] {
  display: none !important;
}

.world-country-navigator .world-country-reference {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(220px, .7fr) minmax(220px, .7fr);
  gap: 8px;
}

.world-country-navigator .world-country-reference details {
  margin: 0;
  background: #fff;
}

.world-country-navigator .world-admin-region-list {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.world-country-navigator .world-country-latest {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.world-country-list button {
  min-height: 46px;
  grid-template-columns: minmax(0, 1fr) auto !important;
  border-right: 0;
  background: transparent;
}

.world-country-list button b {
  display: none !important;
}

.world-country-directory-search {
  width: min(100%, 430px);
  margin: 18px 0 14px;
  justify-self: start;
}

.world-weather-marker .world-weather-disc {
  fill: var(--weather-color, #168b72);
  stroke: #fff;
  stroke-width: 2;
  vector-effect: non-scaling-stroke;
}

.world-weather-marker .world-weather-symbol,
.world-weather-marker .world-weather-temperature {
  fill: #fff;
  paint-order: stroke;
  stroke: rgba(16, 23, 26, .45);
  stroke-width: 1px;
  stroke-linejoin: round;
  font-size: 12px;
}

.world-selected-place-marker circle {
  fill: #efc832;
  stroke: #10171a;
  stroke-width: 2;
}

.world-selected-place-marker text {
  fill: #10171a;
  paint-order: stroke;
  stroke: #fff;
  stroke-width: 3px;
  font: 900 9px/1 Arial, sans-serif;
}

@media (max-width: 1050px) {
  .world-map-legend {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .world-map-legend small {
    grid-column: 1 / -1;
    text-align: left;
  }

  .world-country-navigator .world-admin-region-list,
  .world-country-navigator .world-country-latest {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .world-desk-page .world-browser {
    width: 100%;
  }

  .world-desk-page .world-browser-toolbar {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .world-desk-page .world-country-toolbar-search,
  .world-desk-page .world-region-tabs {
    grid-column: 1;
    width: 100%;
  }

  .world-country-search {
    width: 100%;
    justify-self: stretch;
  }

  .world-desk-page .world-map-stage {
    height: 520px;
    min-height: 520px;
  }

  .world-map-layer-controls {
    right: 48px;
    left: 8px;
    max-width: calc(100% - 56px);
    overflow-x: auto;
  }

  .world-map-layer-controls button {
    flex: 0 0 auto;
  }

  .world-map-legend {
    grid-template-columns: 1fr;
  }

  .world-map-legend small {
    grid-column: auto;
  }

  .world-country-panel.world-country-navigator {
    grid-template-columns: 1fr;
    padding: 20px 14px;
  }

  .world-country-navigator > *,
  .world-country-navigator > .story-kicker,
  .world-country-navigator > h2,
  .world-country-instruction,
  .world-place-search,
  .world-place-status,
  .world-country-navigator > .world-edition-languages {
    grid-column: 1 !important;
  }

  .world-place-search {
    grid-template-columns: 1fr auto;
  }

  .world-country-navigator > .world-selected-weather,
  .world-country-navigator .world-country-reference,
  .world-country-navigator .world-country-latest {
    grid-template-columns: 1fr;
  }

  .world-country-navigator .world-admin-region-list {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 480px) {
  .world-desk-page .world-map-stage {
    height: 460px;
    min-height: 460px;
  }

  .world-place-search {
    grid-template-columns: 1fr;
  }

  .world-place-search > button {
    width: 100%;
  }
}
