.atlas-map-canvas,
.atlas-label-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  outline: none;
}
.atlas-map-canvas {
  touch-action: none;
}
.atlas-label-canvas {
  pointer-events: none;
}
.atlas-live-indicator {
  position: fixed;
  z-index: 30;
  left: 50%;
  bottom: calc(48px + env(safe-area-inset-bottom, 0px));
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 14px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--glass-strong);
  color: var(--accent);
  box-shadow: var(--shadow);
  font-size: 12px;
  white-space: nowrap;
  pointer-events: none;
}
.atlas-live-indicator::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
}
.atlas-live-indicator[hidden] {
  display: none;
}
.maplibregl-popup-content {
  position: relative;
  border-radius: 3px;
  background: white;
  padding: 10px 10px 15px;
  pointer-events: auto;
  box-shadow: 0 1px 2px #0003;
}
.maplibregl-popup-close-button {
  position: absolute;
  right: 0;
  top: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  border-radius: 0 3px 0 0;
}
/* Compact header and a single map toolbar at the upper right. */
.topbar {
  right: auto;
  width: fit-content;
  max-width: calc(100% - 380px);
  height: 50px;
  padding: 3px;
}
.topbar:focus-within {
  border-color: var(--line-bright);
}
.search-wrap {
  min-width: 0;
  width: 320px;
  max-width: 320px;
  flex: 0 1 320px;
  margin: 0;
}
.search-wrap input,
.search-wrap input:hover,
.search-wrap input:focus {
  border: 0;
  background: transparent;
  box-shadow: none;
  outline: none;
}
.search-wrap kbd {
  pointer-events: none;
  white-space: nowrap;
  font-family: inherit;
  font-size: 10px;
  line-height: 1.2;
}
/* The native Chrome clear control owns the trailing space while editing. */
.search-wrap:focus-within kbd,
.search-wrap:has(input:not(:placeholder-shown)) kbd {
  display: none;
}
.search-wrap input:focus,
.search-wrap input:not(:placeholder-shown) {
  padding-right: 14px;
}
.search-close {
  display: none;
}
.map-tools {
  top: 20px;
  right: 20px;
  width: auto;
  height: 66px;
  padding: 8px;
  flex-direction: row;
  align-items: center;
  gap: 4px;
}
.map-tools > .tool-button {
  flex: 0 0 40px;
  width: 40px;
  height: 48px;
  margin: 0;
  padding: 0;
}
.map-tools .tool-divider {
  width: 1px;
  height: 28px;
  flex: 0 0 1px;
  margin: 0 4px;
}
.map-tools > .labels-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  flex: 0 0 auto;
  width: auto;
  height: 32px;
  padding: 0 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.035);
  transition:
    background 150ms,
    color 150ms,
    border-color 150ms;
  color: var(--muted);
  font-size: 11px;
  font-weight: 500;
  white-space: nowrap;
}
.labels-button svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.map-tools > .labels-button[aria-pressed="true"] {
  color: var(--accent);
  border-color: rgba(213, 255, 114, 0.28);
  background: rgba(213, 255, 114, 0.1);
}
.map-tools > .labels-button:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
.map-tools > .labels-button:hover {
  background: rgba(255, 255, 255, 0.09);
}
.statusbar {
  padding-right: 42px;
}
.statusbar {
  gap: 0;
  padding-left: 16px;
  font-size: 10px;
  letter-spacing: 0.01em;
}
.statusbar
  > :is(
    #coordinates,
    #zoomReadout,
    #scaleReadout,
    #tileStatus,
    .status-divider
  ) {
  flex-shrink: 0;
  white-space: nowrap;
}
.statusbar .status-divider {
  margin-inline: 10px;
}
#tileStatus {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
#tileStatus i {
  margin-right: 0;
}
#tileStatus .load-progress {
  width: 48px;
  height: 3px;
  border-radius: 3px;
  background: #71847344;
  overflow: hidden;
}
#tileStatus .load-progress[hidden] {
  display: none;
}
.load-progress > span {
  display: block;
  height: 100%;
  width: var(--progress, 0%);
  background: var(--accent);
  border-radius: inherit;
  transition: width 180ms ease;
}
#tileStatus[data-state="waiting"] {
  color: #d3cba6;
}
#tileStatus[data-state="waiting"] .load-progress > span {
  background: #d3cba6;
}
.map-credits {
  position: relative;
  flex: 0 0 auto;
  margin-left: 2px;
  font-size: 9px;
}
.map-credits summary {
  cursor: pointer;
  list-style: none;
  color: #adb6af;
  border-radius: 4px;
  padding: 4px 2px;
}
.map-credits summary::-webkit-details-marker {
  display: none;
}
.map-credits summary:hover {
  color: #f1f5e9;
}
.map-credits summary:focus-visible {
  outline: 1px solid var(--accent);
  outline-offset: 2px;
}
.map-credits summary > span {
  display: inline-block;
  margin-left: 5px;
  transition: transform 180ms;
}
.map-credits summary > .credits-wide {
  margin-left: 0;
}
.map-credits summary > .credits-compact {
  display: none;
  margin-left: 0;
}
.map-credits[open] .credits-chevron {
  transform: rotate(180deg);
}
.credits-panel {
  position: absolute;
  right: 0;
  bottom: 32px;
  width: min(330px, calc(100vw - 36px));
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #0e1b17f5;
  box-shadow: 0 8px 30px #0005;
  font-size: 11px;
  line-height: 1.7;
}
.credits-panel strong {
  display: block;
  margin-bottom: 7px;
  color: var(--text);
  font-weight: 500;
}
.credits-panel .attribution {
  display: block;
  white-space: normal;
}
@media (max-width: 800px) {
  .statusbar #coordinates,
  .statusbar #coordinates + .status-divider {
    display: none;
  }
}
@media (max-width: 540px) {
  .statusbar {
    padding-left: 10px;
    font-size: 9px;
  }
  .statusbar #scaleReadout,
  .statusbar #zoomReadout + .status-divider {
    display: none;
  }
  .statusbar .status-divider {
    margin-inline: 6px;
  }
  #tileStatus .load-progress {
    width: 28px;
  }
  .map-credits {
    font-size: 8px;
  }
}
.statusbar-toggle {
  position: absolute;
  z-index: 8;
  right: 8px;
  bottom: 4px;
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: rgba(5, 13, 11, 0.86);
  color: var(--muted);
  cursor: pointer;
}
.statusbar-toggle:hover {
  color: var(--text);
  border-color: var(--line-bright);
}
.statusbar-toggle:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
.statusbar-toggle svg {
  width: 14px;
  height: 14px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.statusbar-toggle[aria-expanded="false"] svg {
  transform: rotate(180deg);
}
.atlas-map-canvas {
  cursor: grab;
}
.atlas-map-canvas:active {
  cursor: grabbing;
}
/* Independent translate/scale preserve each overlay's existing positioning. */
:is(
  .topbar,
  .map-tools,
  .statusbar,
  .offline-notice,
  .atlas-live-indicator,
  .atlas-building-popup,
  .startup-status
) {
  --hide-x: 0px;
  --hide-y: 28px;
  opacity: 1;
  translate: 0 0;
  scale: 1;
  transition:
    opacity 260ms ease,
    translate 480ms cubic-bezier(0.22, 1, 0.36, 1),
    scale 480ms cubic-bezier(0.22, 1, 0.36, 1),
    visibility 0s;
}
.topbar {
  --hide-x: -24px;
  --hide-y: -30px;
  transform-origin: top left;
}
.map-tools {
  --hide-x: 24px;
  --hide-y: -30px;
  transform-origin: top right;
}
.statusbar {
  --hide-y: 36px;
  transform-origin: bottom;
}
.atlas-ui-hidden
  :is(
    .topbar,
    .map-tools,
    .statusbar,
    .offline-notice,
    .atlas-live-indicator,
    .atlas-building-popup,
    .startup-status
  ) {
  opacity: 0;
  translate: var(--hide-x) var(--hide-y);
  scale: 0.97;
  visibility: hidden;
  pointer-events: none;
  transition:
    opacity 220ms ease,
    translate 420ms cubic-bezier(0.4, 0, 0.2, 1),
    scale 420ms cubic-bezier(0.4, 0, 0.2, 1),
    visibility 0s 420ms;
}
.statusbar-toggle svg {
  transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}
@media (prefers-reduced-motion: reduce) {
  :is(
    .topbar,
    .map-tools,
    .statusbar,
    .offline-notice,
    .atlas-live-indicator,
    .atlas-building-popup,
    .startup-status
  ),
  .atlas-ui-hidden
    :is(
      .topbar,
      .map-tools,
      .statusbar,
      .offline-notice,
      .atlas-live-indicator,
      .atlas-building-popup,
      .startup-status
    ),
  .statusbar-toggle svg {
    transition: none;
  }
}

/* Phones and touch tablets keep their controls within reach, clear of notches. */
@media (max-width: 900px), (pointer: coarse) {
  :root {
    --map-edge-left: max(12px, env(safe-area-inset-left, 0px));
    --map-edge-right: max(12px, env(safe-area-inset-right, 0px));
    --map-edge-top: max(12px, env(safe-area-inset-top, 0px));
    --map-status-height: calc(48px + env(safe-area-inset-bottom, 0px));
    --map-dock-height: 116px;
  }
  html,
  body {
    overscroll-behavior: none;
  }
  body {
    -webkit-text-size-adjust: 100%;
  }
  #app {
    height: 100dvh;
  }
  .topbar {
    top: calc(var(--map-edge-top) + var(--atlas-viewport-top, 0px));
    left: var(--map-edge-left);
    right: var(--map-edge-right);
    width: auto;
    max-width: none;
    height: 54px;
    padding: 3px;
  }
  .search-wrap {
    width: 100%;
    max-width: none;
    height: 48px;
    flex: 1;
    margin: 0;
  }
  .search-wrap input {
    font-size: 16px;
    padding-right: 14px;
  }
  .search-wrap kbd {
    display: none;
  }
  .search-icon {
    top: 14px;
  }
  .search-wrap:focus-within input {
    padding-right: 78px;
  }
  .search-wrap:focus-within .search-close {
    position: absolute;
    top: 2px;
    right: 2px;
    display: grid;
    place-items: center;
    height: 44px;
    min-width: 70px;
    padding: 0 10px;
    border: 0;
    border-left: 1px solid var(--line);
    border-radius: 0 8px 8px 0;
    background: var(--glass-strong);
    color: var(--accent);
    font: inherit;
    font-size: 14px;
    cursor: pointer;
  }
  .search-results {
    top: 58px;
    max-height: max(
      48px,
      calc(var(--atlas-viewport-height, 100dvh) - var(--map-edge-top) - 84px)
    );
    overscroll-behavior: contain;
    scroll-padding-block: 6px;
  }
  .search-result {
    min-height: 56px;
    padding: 12px;
  }
  .result-copy {
    min-width: 0;
    overflow-wrap: anywhere;
  }
  .map-tools {
    top: auto;
    bottom: calc(var(--map-status-height) + 10px);
    left: var(--map-edge-left);
    right: var(--map-edge-right);
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 4px;
    width: auto;
    max-width: 440px;
    height: var(--map-dock-height);
    margin-inline: auto;
    padding: 7px;
    transform-origin: bottom center;
    --hide-x: 0px;
    --hide-y: 28px;
  }
  .map-tools > .tool-button {
    width: 100%;
    min-width: 0;
    height: 48px;
    margin: 0;
    border-radius: 8px;
  }
  .map-tools .tool-divider {
    display: none;
  }
  #zoomIn {
    grid-area: 1 / 1;
  }
  #zoomOut {
    grid-area: 1 / 2;
  }
  #compassButton {
    grid-area: 1 / 3;
  }
  #viewModeButton {
    grid-area: 1 / 4;
    font-size: 16px;
  }
  .map-tools > #labelsButton {
    grid-area: 2 / 1 / auto / span 2;
  }
  .map-tools > .address-check-link {
    grid-area: 2 / 3 / auto / span 2;
  }
  .map-tools > .labels-button {
    min-height: 48px;
    padding: 0 8px;
    font-size: 13px;
    text-align: center;
    text-decoration: none;
    white-space: normal;
    line-height: 1.2;
  }
  .map-tools > .tool-button:active {
    background: rgba(213, 255, 114, 0.15);
  }
  .statusbar {
    height: var(--map-status-height);
    padding: 0 calc(var(--map-edge-right) + 52px)
      env(safe-area-inset-bottom, 0px) var(--map-edge-left);
    gap: 8px;
    font-size: 11px;
    letter-spacing: 0;
  }
  .statusbar > :is(#coordinates, #zoomReadout, #scaleReadout, .status-divider) {
    display: none;
  }
  #tileStatus {
    font-size: 11px;
  }
  #tileStatus .load-progress {
    width: 28px;
  }
  .map-credits {
    font-size: 12px;
  }
  .map-credits summary {
    min-width: 70px;
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 4px;
  }
  .map-credits summary > .credits-wide {
    display: none;
  }
  .map-credits summary > .credits-compact {
    display: inline;
  }
  .credits-panel {
    position: fixed;
    left: var(--map-edge-left);
    right: var(--map-edge-right);
    bottom: calc(var(--map-status-height) + 10px);
    width: auto;
    max-height: calc(
      100dvh - var(--map-edge-top) - var(--map-status-height) - 82px
    );
    overflow-y: auto;
    overscroll-behavior: contain;
    font-size: 12px;
  }
  .credits-panel a {
    display: inline-block;
    padding-block: 5px;
  }
  .statusbar:has(.map-credits[open]) {
    z-index: 12;
  }
  .statusbar-toggle {
    right: var(--map-edge-right);
    bottom: calc(2px + env(safe-area-inset-bottom, 0px));
    width: 44px;
    height: 44px;
    padding: 12px;
    border-radius: 10px;
  }
  .statusbar-toggle svg {
    width: 18px;
    height: 18px;
  }
  .atlas-live-indicator {
    bottom: calc(var(--map-status-height) + var(--map-dock-height) + 20px);
  }
  .offline-notice {
    top: calc(var(--map-edge-top) + 66px);
    width: min(
      390px,
      calc(100% - var(--map-edge-left) - var(--map-edge-right))
    );
  }
  .atlas-building-popup {
    left: var(--map-edge-left) !important;
    right: var(--map-edge-right) !important;
    top: auto !important;
    bottom: calc(var(--map-status-height) + var(--map-dock-height) + 20px);
    max-width: 440px !important;
    max-height: max(
      100px,
      calc(
        100dvh - var(--map-edge-top) - var(--map-status-height) -
          var(--map-dock-height) - 98px
      )
    );
    margin-inline: auto;
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  .atlas-building-popup .maplibregl-popup-content {
    padding-top: 44px;
  }
  .atlas-building-popup .maplibregl-popup-close-button {
    width: 44px;
    height: 44px;
    font-size: 26px;
  }
  :is(
    .map-tools .tool-button,
    .statusbar-toggle,
    .map-credits summary,
    .search-close
  ) {
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }
  :is(.search-close, .statusbar-toggle, .map-tools .tool-button):focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 2px;
  }
  .atlas-searching
    :is(
      .map-tools,
      .statusbar,
      .statusbar-toggle,
      .atlas-building-popup,
      .atlas-live-indicator,
      .offline-notice
    ) {
    visibility: hidden;
    pointer-events: none;
    opacity: 0;
    transition: none;
  }
}

/* A shallow landscape screen has room for one row of full-size controls. */
@media (max-height: 500px) and (min-width: 500px) and (max-width: 900px),
  (max-height: 500px) and (min-width: 500px) and (pointer: coarse) {
  :root {
    --map-dock-height: 64px;
  }
  .map-tools {
    grid-template-columns: repeat(4, 48px) repeat(2, minmax(0, 1fr));
    max-width: 620px;
  }
  .map-tools > #labelsButton {
    grid-area: 1 / 5;
  }
  .map-tools > .address-check-link {
    grid-area: 1 / 6;
  }
}

.atlas-search-pin {
  position: absolute;
  z-index: 4;
  top: 0;
  left: 0;
  width: 30px;
  height: 38px;
  pointer-events: none;
  filter: drop-shadow(0 2px 3px #0009);
}
.atlas-search-pin[hidden] {
  display: none;
}
.atlas-search-pin svg {
  display: block;
  width: 100%;
  height: 100%;
  fill: var(--accent);
  stroke: #142218;
  stroke-width: 1.5;
}
.atlas-search-pin circle {
  fill: #142218;
  stroke: none;
}
.atlas-search-pin-name {
  position: absolute;
  left: 50%;
  bottom: 43px;
  max-width: min(220px, 65vw);
  padding: 5px 9px;
  border: 1px solid var(--line-bright);
  border-radius: 7px;
  background: var(--glass-strong);
  color: var(--text);
  font-size: 12px;
  line-height: 1.3;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transform: translateX(-50%);
}

.atlas-research-land-overlay{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:hidden;z-index:5}.atlas-research-land-fill{fill:#d5ff722e;stroke:none}.atlas-research-land-casing{fill:none;stroke:#102019;stroke-width:6;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}.atlas-research-land-outline{fill:none;stroke:#e2ff9b;stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}.atlas-research-land-panel{position:absolute;top:86px;right:18px;z-index:24;width:330px;max-width:calc(100% - 36px);max-height:calc(100% - 190px);overflow:auto;padding:17px;border-radius:12px;color:var(--text);font-size:12px;line-height:1.5;box-sizing:border-box;overscroll-behavior:contain}.atlas-research-land-panel h2{font-size:17px;line-height:1.3;margin:0 0 12px}.atlas-research-land-panel p{margin:9px 0}.atlas-research-land-panel .atlas-research-land-kicker{font-size:10px;letter-spacing:.1em;color:var(--accent);margin-top:0}.atlas-research-land-accuracy,.atlas-research-land-share{font-weight:600}.atlas-research-land-registry{font-size:10px;overflow-wrap:anywhere}.atlas-research-land-status{font-size:11px;opacity:.85}.atlas-research-land-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:14px}.atlas-research-land-actions button,.atlas-research-land-actions a{font:inherit;color:var(--text);border:1px solid var(--line-bright);border-radius:6px;padding:8px 10px;background:#ffffff0c;text-decoration:none;cursor:pointer}.atlas-research-land-actions button:hover,.atlas-research-land-actions a:hover{background:#ffffff20}.atlas-research-land-actions button:focus-visible,.atlas-research-land-actions a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}@media(max-width:759px){.atlas-research-land-panel{left:12px;right:12px;top:88px;width:auto;max-width:none;max-height:min(39vh,330px);padding:12px 14px;font-size:11px}.atlas-research-land-panel h2{font-size:15px;margin-bottom:8px}.atlas-research-land-actions button,.atlas-research-land-actions a{min-height:42px;display:inline-flex;align-items:center;padding:8px 10px}}
.atlas-ui-hidden .atlas-research-land-panel{opacity:0;pointer-events:none}

@media(max-width:759px) and(orientation:landscape){.atlas-research-land-panel{left:auto;right:12px;top:70px;width:260px;max-width:calc(100% - 96px);max-height:calc(100% - 160px)}}
@media(min-width:760px){.atlas-linked-pole-land .atlas-pole-panel{left:18px;right:auto}}

@media(max-width:759px){.atlas-linked-pole-land .atlas-research-land-panel{max-height:26vh}.atlas-linked-pole-land .atlas-pole-panel{top:auto;bottom:75px;left:12px;right:12px;width:auto;max-height:26vh}}

.atlas-research-land-panel > details {margin:10px 0}.atlas-research-land-panel > details > summary {cursor:pointer;min-height:36px;align-content:center}
@media(min-width:760px) and(max-width:1099px){.atlas-linked-pole-land .atlas-research-land-panel{left:12px;right:12px;width:auto;top:78px;max-height:26vh}.atlas-linked-pole-land .atlas-pole-panel{top:auto;bottom:calc(var(--map-status-height,40px) + var(--atlas-dock-height,var(--map-dock-height,120px)) + 16px);left:12px;right:12px;width:auto;max-height:26vh}}
@media(max-width:759px){.atlas-linked-pole-land .atlas-pole-panel{bottom:calc(var(--map-status-height,40px) + var(--atlas-dock-height,var(--map-dock-height,120px)) + 16px)}}
@media(max-width:1099px){.atlas-linked-pole-land:has(.atlas-zone-panel:not([hidden])) .atlas-pole-panel{display:none}}

.map-tools > .share-view-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.share-view-button svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.topbar {
  max-width: calc(100% - 430px);
}
.atlas-share-status,
.atlas-share-panel {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  padding: 12px;
  border-radius: 10px;
  font-size: 12px;
  color: var(--text);
}
.atlas-share-status {
  white-space: nowrap;
  color: var(--accent);
  pointer-events: none;
}
.atlas-share-panel {
  width: min(360px, calc(100vw - 40px));
  padding: 16px;
  padding-right: 46px;
}
.atlas-share-panel label {
  display: block;
  margin-bottom: 8px;
  line-height: 1.5;
}
.atlas-share-panel input {
  width: 100%;
  height: 44px;
  border: 1px solid var(--line-bright);
  border-radius: 6px;
  background: var(--bg);
  padding: 8px;
  color: var(--text);
  user-select: text;
}
.atlas-share-close {
  position: absolute;
  top: 4px;
  right: 2px;
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  font-size: 24px;
}
.atlas-share-status[hidden],
.atlas-share-panel[hidden] {
  display: none;
}
@media (max-width: 900px), (pointer: coarse) {
  .topbar {
    max-width: none;
  }
  .map-tools {
    grid-template-columns: repeat(12, minmax(0, 1fr));
  }
  #zoomIn { grid-area: 1 / 1 / auto / span 3; }
  #zoomOut { grid-area: 1 / 4 / auto / span 3; }
  #compassButton { grid-area: 1 / 7 / auto / span 3; }
  #viewModeButton { grid-area: 1 / 10 / auto / span 3; }
  .map-tools > #labelsButton { grid-area: 2 / 1 / auto / span 4; }
  .map-tools > .address-check-link { grid-area: 2 / 5 / auto / span 4; }
  .map-tools > #shareViewButton { grid-area: 2 / 9 / auto / span 4; }
  .atlas-share-status,
  .atlas-share-panel {
    top: auto;
    bottom: calc(100% + 10px);
  }
  .atlas-share-panel {
    left: 0;
    right: 0;
    width: auto;
  }
  .atlas-share-panel input {
    font-size: 16px;
  }
}

.loading-details { position: relative; flex: 0 0 auto; min-width: 0; --loading-bar-width: 48px; }
.loading-details summary {
  display: inline-flex; align-items: center; gap: 5px; cursor: pointer;
  list-style: none; border-radius: 4px; min-height: 22px;
}
.loading-details summary::-webkit-details-marker { display: none; }
.loading-details summary:focus-visible { outline: 1px solid var(--accent); outline-offset: 3px; }
.loading-details #tileStatus {
  display: grid; grid-template-columns: 5px 12ch var(--loading-bar-width);
  text-align: left; font-variant-numeric: tabular-nums;
}
.loading-details .load-text { white-space: nowrap; }
.loading-chevron { display: inline-block; transition: transform 180ms; }
.loading-details[open] .loading-chevron { transform: rotate(180deg); }
.loading-details-panel {
  position: absolute; bottom: calc(100% + 12px); left: 0;
  width: min(290px, calc(100vw - 32px)); max-height: min(420px, 60dvh);
  overflow: auto; overscroll-behavior: contain; padding: 16px;
  border: 1px solid var(--line); border-radius: 12px;
  background: #0e1b17f5; box-shadow: 0 8px 30px #0005;
  color: #e4eade; font-size: 11px; line-height: 1.6; text-transform: none;
  letter-spacing: normal; white-space: normal; text-align: left;
}
.loading-details-panel strong { display: block; font-size: 12px; margin-bottom: 10px; }
.loading-details-panel dl { display: grid; grid-template-columns: minmax(0, 1fr) 12ch; gap: 6px 18px; margin: 0; }
.loading-details-panel dd { margin: 0; text-align: left; white-space: nowrap; font-variant-numeric: tabular-nums; }
.loading-details-panel .complete { color: #a9c8a0; }
.loading-details-panel .pending { color: #e2d6a8; }
.loading-details-panel p { margin: 12px 0 0; min-height: 3.2em; color: #b6c2b8; }
.loading-recovery { margin-top: 12px; padding: 8px 14px; border: 1px solid var(--line); border-radius: 999px; background: var(--text, #e4eade); color: var(--bg, #191d1a); font: inherit; cursor: pointer; }
.loading-recovery:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.statusbar:has(.loading-details[open]) { z-index: 55; }
@media (max-width: 900px), (pointer: coarse) {
  .loading-details { --loading-bar-width: 28px; }
  .loading-details summary { min-height: 44px; }
  .loading-details-panel {
    position: fixed; left: var(--map-edge-left); right: var(--map-edge-right);
    bottom: calc(var(--map-status-height) + 10px); width: auto; font-size: 12px;
  }
}
@media (prefers-reduced-motion: reduce) { .loading-chevron { transition: none; } }

.map-tools > #parcelsButton {
  flex: 0 0 auto;
  width: auto;
  padding: 0 9px;
}
.topbar {
  max-width: calc(100% - 510px);
}
.atlas-parcel-picking {
  cursor: crosshair;
}
.atlas-parcel-overlay {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 6;
}
.atlas-parcel-overlay path {
  vector-effect: non-scaling-stroke;
  stroke-linejoin: round;
  fill: none;
}
.atlas-parcel-neighbours {
  stroke: #69daf1;
  stroke-width: 1.5;
}
.atlas-parcel-overlay .atlas-parcel-fill {
  fill: #69daf12b;
}
.atlas-parcel-casing {
  stroke: #06212c;
  stroke-width: 5;
}
.atlas-parcel-selected {
  stroke: #a6efff;
  stroke-width: 3;
}
.atlas-parcel-panel {
  position: absolute;
  z-index: 12;
  left: 18px;
  bottom: 55px;
  width: min(340px, calc(100% - 36px));
  max-height: calc(100% - 160px);
  overflow: auto;
  overscroll-behavior: contain;
  padding: 14px;
  border-radius: 12px;
  color: var(--text);
  font-size: 12px;
  line-height: 1.5;
  user-select: text;
}
.atlas-parcel-panel[hidden] {
  display: none;
}
.atlas-ui-hidden .atlas-parcel-panel {
  visibility: hidden;
  pointer-events: none;
}
.atlas-parcel-heading {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: space-between;
}
.atlas-parcel-heading h2 {
  margin: 0;
  font-size: 14px;
}
.atlas-parcel-panel button {
  min-height: 40px;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 7px;
  background: var(--glass-strong);
  color: var(--text);
  cursor: pointer;
  font: inherit;
}
.atlas-parcel-heading button {
  min-width: 44px;
  min-height: 44px;
  font-size: 24px;
}
.atlas-parcel-content > button {
  display: block;
  width: 100%;
  margin-bottom: 6px;
  text-align: left;
}
.atlas-parcel-panel :is(a, button):focus-visible {
  outline: 2px solid #69daf1;
  outline-offset: 2px;
}
.atlas-parcel-panel p {
  margin: 8px 0;
}
.atlas-parcel-panel a {
  color: #a6efff;
  overflow-wrap: anywhere;
}
.atlas-parcel-panel dl {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 3px 12px;
  margin: 12px 0;
}
.atlas-parcel-panel dt {
  color: var(--muted);
}
.atlas-parcel-panel dd {
  margin: 0;
  overflow-wrap: anywhere;
}
.atlas-parcel-panel footer {
  margin-top: 12px;
  padding-top: 8px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: 11px;
}
.atlas-parcel-panel footer summary {
  cursor: pointer;
  min-height: 32px;
  align-content: center;
}
.atlas-parcel-panel footer summary:focus-visible {
  outline: 2px solid #69daf1;
  outline-offset: 2px;
}
.atlas-parcel-retrieved {
  color: var(--muted);
  font-size: 11px;
}
.atlas-parcel-panel[data-projection-incomplete="true"]
  .atlas-parcel-status::after {
  content: " Some selected boundary detail is outside the view or waiting for terrain.";
}
.atlas-parcel-panel[data-drawing-limited="true"] .atlas-parcel-status::after {
  content: " Some unusually large boundaries need a closer view.";
}
.atlas-parcel-panel[data-drawing-pending="true"] .atlas-parcel-status::after {
  content: " Drawing boundaries…";
}
@media (max-width: 900px), (pointer: coarse) {
  .topbar {
    max-width: none;
  }
  .map-tools > #labelsButton {
    grid-area: 2 / 1 / auto / span 3;
  }
  .map-tools > .address-check-link {
    grid-area: 2 / 4 / auto / span 3;
  }
  .map-tools > #parcelsButton {
    grid-area: 2 / 7 / auto / span 3;
  }
  .map-tools > #shareViewButton {
    grid-area: 2 / 10 / auto / span 3;
  }
  .map-tools > .labels-button {
    font-size: 11px;
    padding: 0 3px;
  }
  .map-tools > #labelsButton svg {
    display: none;
  }
  .atlas-parcel-panel {
    left: var(--map-edge-left, 12px);
    right: var(--map-edge-right, 12px);
    bottom: calc(
      var(--map-status-height, 40px) + var(--map-dock-height, 114px) + 20px
    );
    width: auto;
    max-height: min(42dvh, calc(100dvh - 270px));
    padding: 10px 12px;
  }
}
@media (max-height: 500px) and (orientation: landscape) {
  .atlas-parcel-panel {
    top: 78px;
    bottom: auto;
    right: auto;
    width: min(290px, 45vw);
    max-height: calc(100dvh - 120px);
  }
}
@media (max-height: 500px) and (min-width: 500px) and (max-width: 900px),
  (max-height: 500px) and (min-width: 500px) and (pointer: coarse) {
  .map-tools {
    grid-template-columns: repeat(4, 40px) repeat(4, minmax(0, 1fr));
    max-width: 720px;
  }
  .map-tools > #zoomIn {
    grid-area: 1 / 1;
  }
  .map-tools > #zoomOut {
    grid-area: 1 / 2;
  }
  .map-tools > #compassButton {
    grid-area: 1 / 3;
  }
  .map-tools > #viewModeButton {
    grid-area: 1 / 4;
  }
  .map-tools > #labelsButton {
    grid-area: 1 / 5;
  }
  .map-tools > .address-check-link {
    grid-area: 1 / 6;
  }
  .map-tools > #parcelsButton {
    grid-area: 1 / 7;
  }
  .map-tools > #shareViewButton {
    grid-area: 1 / 8;
  }
}

/* Atlas chrome: quiet paper surfaces. Geographic layer colours stay intact. */
:root {
  color-scheme: light;
  --bg: #fcfcfa;
  --glass: rgba(252, 252, 250, 0.97);
  --glass-strong: #fcfcfa;
  --line: #191d1a1a;
  --line-bright: #344a384d;
  --text: #191d1a;
  --muted: #62695f;
  --accent: #344a38;
  --accent-dim: #d9e5d6;
  --shadow: 0 4px 20px #191d1a12;
}
body {
  -webkit-font-smoothing: antialiased;
}
.atlas-map-canvas:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: -3px;
}
@media (min-width: 901px) and (pointer: fine) {
  .topbar {
    max-width: calc(100% - 660px);
  }
}
button,
a,
input,
select,
summary {
  -webkit-tap-highlight-color: transparent;
}
:is(button, a, input, select, summary):focus-visible {
  outline: 2px solid #344a38;
  outline-offset: 3px;
}
button:disabled {
  opacity: 0.5;
  cursor: default;
}
.glass {
  backdrop-filter: none;
}
.topbar,
.map-tools {
  border-radius: 18px;
}
.topbar {
  height: 56px;
  padding: 5px;
}
.topbar:focus-within {
  box-shadow:
    0 0 0 3px #d9e5d6,
    var(--shadow);
}
.search-wrap {
  width: 328px;
  max-width: 100%;
}
.language-choice {
  flex: 0 0 auto;
  max-width: 8em;
  min-height: 40px;
  margin-right: 6px;
  border: 0;
  border-radius: 10px;
  padding: 6px;
  background: transparent;
  color: var(--accent);
  font: inherit;
  font-size: 12px;
  cursor: pointer;
}
.language-choice:hover {
  background: var(--accent-dim);
}
.language-choice option {
  background: var(--glass-strong);
  color: var(--text);
}
.search-wrap input {
  color: var(--text);
  font-size: 14px;
}
.search-wrap input::placeholder {
  color: var(--muted);
  opacity: 1;
}
.search-icon {
  color: #344a38;
  stroke: #344a38;
}
.search-wrap kbd {
  color: var(--muted);
  background: #f0f1ec;
  border-color: transparent;
  border-radius: 5px;
}
.search-results {
  border-radius: 16px;
  padding: 6px;
}
.search-results :is(button, [role="option"]) {
  border-radius: 10px;
}
.search-results
  :is(button:hover, .search-result.active, [aria-selected="true"]) {
  background: #e9eee5;
}
.search-result-detail,
.search-note,
.search-attribution {
  color: var(--muted);
}
.map-tools {
  height: 60px;
  padding: 7px;
  gap: 3px;
}
.map-tools > .tool-button {
  height: 44px;
  border-radius: 12px;
  color: #344a38;
}
.map-tools > .tool-button:hover {
  background: #e9eee5;
  color: #191d1a;
}
.map-tools .tool-divider {
  height: 22px;
  background: var(--line);
  margin-inline: 5px;
}
.map-tools > .labels-button {
  min-height: 36px;
  height: 36px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #344a38;
  font-size: 12px;
  font-weight: 550;
}
.map-tools > .labels-button[aria-pressed="true"] {
  color: #344a38;
  background: #d9e5d6;
  border-color: transparent;
}
.map-tools > #parcelsButton {
  padding-inline: 16px;
  background: #191d1a;
  color: #fcfcfa;
  font-weight: 650;
}
.map-tools > #parcelsButton:hover {
  background: #344a38;
}
.map-tools > #parcelsButton[aria-pressed="true"]::before {
  content: "";
  flex: 0 0 6px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #dc886b;
  margin-right: 2px;
}
.map-tools > #viewModeButton {
  background: #d9e5d6;
  border-radius: 12px;
}
.compass .north {
  fill: #344a38;
}
.compass .south {
  fill: #aebcaa;
}
.statusbar {
  background: #fcfcfa;
  color: var(--muted);
  border-top-color: var(--line);
  font-size: 11px;
  letter-spacing: 0;
  box-shadow: none;
}
.statusbar a,
.map-credits summary {
  color: var(--muted);
}
.map-credits summary:hover,
.map-credits[open] summary {
  color: var(--text);
}
.statusbar-toggle {
  background: #fcfcfa;
  border-color: var(--line);
  color: #344a38;
}
#tileStatus i {
  background: #344a38;
  box-shadow: none;
}
#tileStatus[data-state="waiting"] {
  color: #915039;
}
.loading-details-panel,
.credits-panel {
  background: #fcfcfa;
  color: var(--text);
  box-shadow: var(--shadow);
  border-color: var(--line);
  border-radius: 16px;
  padding: 20px;
  font-size: 12px;
  line-height: 1.6;
}
.loading-details-panel strong,
.credits-panel strong {
  font-size: 15px;
  font-weight: 700;
}
.loading-details-panel .complete {
  color: #344a38;
}
.loading-details-panel .pending {
  color: #915039;
}
.loading-details-panel p {
  color: var(--muted);
}
.atlas-parcel-panel,
.atlas-research-land-panel {
  background: #fcfcfa;
  padding: 20px;
  border-radius: 18px;
  color: var(--text);
  font-size: 13px;
  line-height: 1.55;
  scrollbar-color: #b5bdb0 transparent;
  scrollbar-width: thin;
  overflow-x: hidden;
  overflow-wrap: anywhere;
}
.atlas-parcel-heading {
  align-items: start;
  gap: 12px;
}
.atlas-parcel-heading h2,
.atlas-research-land-panel h2 {
  font-size: 18px;
  font-weight: 720;
  letter-spacing: -0.025em;
  line-height: 1.3;
}
.atlas-parcel-heading h2 {
  padding-top: 8px;
}
.atlas-parcel-panel .atlas-parcel-heading button,
.atlas-share-close {
  border: 0;
  background: #f0f1ec;
  color: #344a38;
  border-radius: 12px;
  min-width: 36px;
  min-height: 36px;
  width: 36px;
  height: 36px;
  font-size: 22px;
}
.atlas-parcel-status {
  color: var(--muted);
  font-size: 12px;
}
.atlas-parcel-panel dl {
  gap: 9px 14px;
  padding-block: 8px;
}
.atlas-parcel-panel dt {
  color: var(--muted);
}
.atlas-parcel-panel dd {
  font-weight: 550;
  font-variant-numeric: tabular-nums;
}
.atlas-parcel-panel a,
.atlas-research-land-panel a {
  color: #344a38;
  text-underline-offset: 3px;
}
.atlas-parcel-panel footer {
  padding-top: 10px;
  font-size: 11px;
  line-height: 1.55;
}
.atlas-parcel-panel .atlas-parcel-retrieved {
  font-size: 11px;
}
.atlas-parcel-panel button:not(.atlas-parcel-heading button) {
  background: #191d1a;
  color: #fcfcfa;
  border-color: transparent;
  border-radius: 999px;
  padding: 8px 14px;
}
.atlas-parcel-content > button {
  text-align: left;
  border-radius: 10px !important;
}
.atlas-research-land-panel .atlas-research-land-kicker {
  color: #344a38;
  font-weight: 650;
  letter-spacing: 0.04em;
}
.atlas-research-land-actions {
  gap: 12px;
}
.atlas-research-land-actions button {
  background: #191d1a;
  color: #fcfcfa;
  border: 0;
  border-radius: 999px;
  padding: 10px 16px;
}
.atlas-research-land-actions a {
  border: 0;
  background: transparent;
  padding-inline: 0;
}
.atlas-research-land-actions a:hover {
  background: transparent;
  text-decoration: underline;
}
.atlas-building-popup .maplibregl-popup-content {
  background: #fcfcfa;
  color: var(--text);
  border-color: var(--line);
  box-shadow: var(--shadow);
}
.building-card {
  padding: 20px;
}
.building-card h3 {
  font-size: 18px;
  font-weight: 700;
  letter-spacing: -0.02em;
}
.building-card > small {
  color: #344a38;
  letter-spacing: 0.04em;
  font-size: 10px;
}
.building-metrics strong {
  background: #d9e5d6;
  color: #344a38;
}
.building-metrics span {
  background: transparent;
  color: var(--muted);
}
.building-card dl {
  font-size: 12px;
  gap: 9px 12px;
}
.building-card dt {
  color: var(--muted);
}
.building-card dd {
  color: var(--text);
}
.atlas-share-panel {
  border-radius: 16px;
  padding: 20px 52px 20px 20px;
}
.atlas-share-panel input {
  border-radius: 10px;
}
.atlas-share-status {
  background: #d9e5d6;
  color: #344a38;
}
.atlas-live-indicator {
  background: #fcfcfa;
  color: #344a38;
  padding: 7px 12px;
  box-shadow: var(--shadow);
  font-size: 11px;
  border-color: var(--line);
}
.atlas-live-indicator::before {
  background: #dc886b;
}
.offline-notice {
  background: #fcfcfa;
  color: var(--text);
  border-radius: 16px;
}
.offline-notice span {
  color: var(--muted);
}
.startup-status {
  background: #fcfcfa;
  padding: 20px 28px;
  border-radius: 18px;
  box-shadow: var(--shadow);
}
.startup-spinner {
  border-color: #d9e5d6;
  border-top-color: #344a38;
}
.startup-status.failed strong {
  color: #915039;
}
/* A pin is geographic feedback, not decorative chrome. Keep its contrast. */
.atlas-search-pin svg {
  fill: #d5ff72;
}
.theme-toggle svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.theme-sun {
  display: none;
}
[data-theme="dark"] .theme-sun {
  display: initial;
}
[data-theme="dark"] .theme-moon {
  display: none;
}
[data-theme="dark"] {
  color-scheme: dark;
  --bg: #141b16;
  --glass: rgba(20, 27, 22, 0.98);
  --glass-strong: #141b16;
  --line: #e3eadd22;
  --line-bright: #e3eadd44;
  --text: #f5f6ef;
  --muted: #acb6aa;
  --accent: #c4d5bb;
  --accent-dim: #2d3c2e;
  --shadow: 0 4px 20px #0003;
}
[data-theme="dark"]
  :is(
    .statusbar,
    .statusbar-toggle,
    .loading-details-panel,
    .credits-panel,
    .atlas-parcel-panel,
    .atlas-research-land-panel,
    .atlas-live-indicator,
    .offline-notice,
    .startup-status,
    .atlas-building-popup .maplibregl-popup-content
  ) {
  background: var(--glass-strong);
  color: var(--text);
}
[data-theme="dark"] :is(button, a, input, select, summary):focus-visible {
  outline-color: #c4d5bb;
}
[data-theme="dark"] .topbar:focus-within {
  box-shadow:
    0 0 0 3px #344a38,
    var(--shadow);
}
[data-theme="dark"] .search-wrap kbd {
  background: #253326;
  color: var(--muted);
}
[data-theme="dark"] .search-icon {
  stroke: #c4d5bb;
}
[data-theme="dark"]
  .search-results
  :is(button:hover, .search-result.active, [aria-selected="true"]) {
  background: #253326;
}
[data-theme="dark"] .map-tools > .tool-button {
  color: #c4d5bb;
}
[data-theme="dark"] .map-tools > .tool-button:hover {
  background: #253326;
}
[data-theme="dark"]
  .map-tools
  > :is(.labels-button[aria-pressed="true"], #viewModeButton) {
  background: #2d3c2e;
  color: #c4d5bb;
}
[data-theme="dark"] .map-tools > #parcelsButton {
  background: #e6ecdf;
  color: #1c211e;
}
[data-theme="dark"] .map-tools > #parcelsButton:hover {
  background: #d9e5d6;
}
[data-theme="dark"] .compass .north {
  fill: #c4d5bb;
}
[data-theme="dark"] .compass .south {
  fill: #71836c;
}
[data-theme="dark"] :is(.atlas-parcel-heading button, .atlas-share-close) {
  background: #253326;
  color: #c4d5bb;
}
[data-theme="dark"]
  :is(
    .atlas-parcel-panel a,
    .atlas-research-land-panel a,
    .atlas-research-land-kicker,
    .building-card > small,
    .loading-details-panel .complete
  ) {
  color: #c4d5bb;
}
[data-theme="dark"]
  :is(
    .loading-details-panel .pending,
    .startup-status.failed strong,
    #tileStatus[data-state="waiting"]
  ) {
  color: #edb39b;
}
[data-theme="dark"]
  .atlas-parcel-panel
  button:not(.atlas-parcel-heading button),
[data-theme="dark"] .atlas-research-land-actions button {
  background: #e6ecdf;
  color: #1c211e;
}
[data-theme="dark"] .building-metrics strong {
  background: #2d3c2e;
  color: #c4d5bb;
}
[data-theme="dark"] .atlas-share-status {
  background: #2d3c2e;
  color: #c4d5bb;
}
@media (max-width: 900px), (pointer: coarse) {
  .topbar {
    height: 56px;
    border-radius: 16px;
  }
  .search-wrap input {
    font-size: 16px;
  }
  .language-choice {
    min-height: 44px;
    font-size: 16px;
  }
  .atlas-research-land-actions :is(a, button) {
    min-height: 44px;
  }
  .map-tools {
    height: auto;
    min-height: var(--map-dock-height);
    grid-auto-rows: minmax(48px, auto);
    align-items: stretch;
    padding: 7px;
    border-radius: 18px;
  }
  .map-tools > .tool-button {
    min-height: 44px;
    height: 48px;
  }
  .map-tools > .labels-button {
    font-size: 12px;
    padding-inline: 5px;
    height: auto;
    white-space: normal;
    overflow-wrap: anywhere;
    line-height: 1.15;
  }
  .map-tools > #parcelsButton {
    padding-inline: 6px;
  }
  .map-tools {
    grid-template-columns: repeat(30, minmax(0, 1fr));
  }
  .map-tools > #zoomIn {
    grid-area: 1 / 1 / auto / span 5;
  }
  .map-tools > #zoomOut {
    grid-area: 1 / 6 / auto / span 5;
  }
  .map-tools > #compassButton {
    grid-area: 1 / 11 / auto / span 5;
  }
  .map-tools > #viewModeButton {
    grid-area: 1 / 16 / auto / span 5;
  }
  .map-tools > #themeToggle {
    grid-area: 1 / 21 / auto / span 5;
  }
  .map-tools > #labelsButton {
    grid-area: 2 / 1 / auto / span 10;
  }
  .map-tools > .address-check-link {
    grid-area: 2 / 11 / auto / span 10;
  }
  .map-tools > #parcelsButton {
    grid-area: 2 / 21 / auto / span 10;
  }
  .map-tools > #shareViewButton {
    grid-area: 1 / 26 / auto / span 5;
  }
  .atlas-parcel-panel,
  .atlas-building-popup {
    bottom: calc(
      var(--map-status-height) +
        var(--atlas-dock-height, var(--map-dock-height)) + 20px
    );
  }
  .atlas-parcel-panel,
  .atlas-research-land-panel {
    padding: 14px 16px;
    border-radius: 16px;
  }
  .atlas-parcel-heading h2 {
    font-size: 17px;
  }
  .atlas-parcel-panel .atlas-parcel-heading button {
    min-width: 44px;
    min-height: 44px;
  }
  .statusbar {
    font-size: 11px;
  }
}
@media (max-height: 500px) and (min-width: 500px) and (max-width: 900px),
  (max-height: 500px) and (min-width: 500px) and (pointer: coarse) {
  .map-tools {
    grid-template-columns: repeat(5, 44px) repeat(4, minmax(0, 1fr));
  }
  .atlas-parcel-panel {
    bottom: auto;
  }
  .map-tools > #zoomIn {
    grid-area: 1 / 1;
  }
  .map-tools > #zoomOut {
    grid-area: 1 / 2;
  }
  .map-tools > #compassButton {
    grid-area: 1 / 3;
  }
  .map-tools > #viewModeButton {
    grid-area: 1 / 4;
  }
  .map-tools > #themeToggle {
    grid-area: 1 / 5;
  }
  .map-tools > #labelsButton {
    grid-area: 1 / 6;
  }
  .map-tools > .address-check-link {
    grid-area: 1 / 7;
  }
  .map-tools > #parcelsButton {
    grid-area: 1 / 8;
  }
  .map-tools > #shareViewButton {
    grid-area: 1 / 9;
  }
}
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
  }
}

.atlas-parcel-status button {
  display: block;
  width: max-content;
  max-width: 100%;
  white-space: nowrap;
  margin-top: 8px;
}

.atlas-pole-panel {
  position: absolute;
  z-index: 26;
  top: 78px;
  right: 18px;
  width: min(330px, calc(100vw - 36px));
  max-height: calc(
    100dvh - var(--map-status-height, 40px) -
      var(--atlas-dock-height, var(--map-dock-height, 120px)) - 108px
  );
  overflow: auto;
  padding: 18px;
  border-radius: 18px;
  box-sizing: border-box;
  background: #fcfcfa;
  color: #191d1a;
  box-shadow: var(--shadow);
  font-size: 13px;
  line-height: 1.55;
  scrollbar-color: #b5bdb0 transparent;
}
.atlas-pole-markers {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 6;
  pointer-events: none;
}
.atlas-pole-markers[hidden] { display:none; }
.atlas-pole-panel[hidden],
.atlas-ui-hidden .atlas-pole-panel {
  display: none;
}
.atlas-pole-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.atlas-pole-heading h2 {
  font-size: 21px;
  line-height: 1.2;
  letter-spacing: -0.5px;
  margin: 0;
  font-weight: 750;
}
.atlas-pole-heading button {
  background: transparent;
  border: 0;
  color: inherit;
  font-size: 24px;
  min-width: 44px;
  min-height: 44px;
  border-radius: 50%;
  cursor: pointer;
}
.atlas-pole-panel p {
  margin: 10px 0;
}
.atlas-pole-panel a {
  display: block;
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 3px;
  margin: 8px 0;
  overflow-wrap: anywhere;
}
.atlas-pole-panel details {
  margin-top: 14px;
}
.atlas-pole-panel summary {
  cursor: pointer;
  color: var(--muted);
}
.atlas-pole-panel dl {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr);
  gap: 7px 12px;
  margin: 14px 0;
}
.atlas-pole-panel dt {
  color: var(--muted);
}
.atlas-pole-panel dd {
  margin: 0;
  overflow-wrap: anywhere;
}
.atlas-pole-panel pre {
  font: 11px/1.5 monospace;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.atlas-pole-panel select {
  box-sizing: border-box;
  max-width: 100%;
  width: 100%;
  min-height: 44px;
  margin-top: 10px;
  border-radius: 10px;
  background: inherit;
  color: inherit;
  border: 1px solid var(--line);
  padding: 8px;
}
.atlas-pole-status > span {
  display: block;
  margin-top: 8px;
  color: var(--muted);
}
.atlas-pole-status button {
  display: block;
  min-height: 40px;
  padding: 8px 17px;
  border: 0;
  border-radius: 999px;
  background: #191d1a;
  color: #fcfcfa;
  cursor: pointer;
  margin-top: 10px;
}
.atlas-pole-conflict {
  padding-left: 10px;
  border-left: 3px solid #dc886b;
}
:root[data-theme="dark"] .atlas-pole-panel {
  background: #1c211e;
  color: #f1f1eb;
}
:root[data-theme="dark"] .atlas-pole-status button {
  background: #d9e5d6;
  color: #191d1a;
}
.atlas-pole-panel :is(button, select, summary, a):focus-visible {
  outline: 3px solid #dc886b;
  outline-offset: 3px;
}
@media (max-width: 900px) {
  .map-tools {
    grid-template-columns: repeat(60, minmax(0, 1fr));
  }
  .map-tools > #zoomIn {
    grid-area: 1/1 / auto/span 10;
  }
  .map-tools > #zoomOut {
    grid-area: 1/11 / auto/span 10;
  }
  .map-tools > #compassButton {
    grid-area: 1/21 / auto/span 10;
  }
  .map-tools > #viewModeButton {
    grid-area: 1/31 / auto/span 10;
  }
  .map-tools > #themeToggle {
    grid-area: 1/41 / auto/span 10;
  }
  .map-tools > #shareViewButton {
    grid-area: 1/51 / auto/span 10;
  }
  .map-tools > #labelsButton {
    grid-area: 2/1 / auto/span 15;
  }
  .map-tools > .address-check-link {
    grid-area: 2/16 / auto/span 15;
  }
  .map-tools > #parcelsButton {
    grid-area: 2/31 / auto/span 15;
  }
  .map-tools > #polesButton {
    grid-area: 2/46 / auto/span 15;
  }
  .atlas-pole-panel {
    top: 76px;
    right: 10px;
    width: min(330px, calc(100vw - 20px));
    max-height: calc(
      100dvh - var(--map-status-height, 40px) -
        var(--atlas-dock-height, var(--map-dock-height, 120px)) - 110px
    );
  }
}
@media (max-height: 500px) and (min-width: 500px) and (max-width: 900px) {
  .map-tools {
    grid-template-columns: repeat(5, 40px) repeat(5, minmax(0, 1fr));
  }
  .map-tools > #zoomIn {
    grid-area: 1/1;
  }
  .map-tools > #zoomOut {
    grid-area: 1/2;
  }
  .map-tools > #compassButton {
    grid-area: 1/3;
  }
  .map-tools > #viewModeButton {
    grid-area: 1/4;
  }
  .map-tools > #themeToggle {
    grid-area: 1/5;
  }
  .map-tools > #labelsButton {
    grid-area: 1/6;
  }
  .map-tools > .address-check-link {
    grid-area: 1/7;
  }
  .map-tools > #parcelsButton {
    grid-area: 1/8;
  }
  .map-tools > #polesButton {
    grid-area: 1/9;
  }
  .map-tools > #shareViewButton {
    grid-area: 1/10;
  }
  .atlas-pole-panel {
    top: 70px;
  }
}

.map-tools > #zonesButton {
  flex: 0 0 auto;
  width: auto;
  padding: 0 9px;
}
.atlas-zone-panel {
  left: auto;
  right: 18px;
  bottom: 55px;
}
.atlas-zone-panel[hidden] {
  display: none;
}
.atlas-zone-panel button[hidden] {
  display: none !important;
}
.atlas-ui-hidden :is(.atlas-zone-panel, .atlas-zone-overlay) {
  visibility: hidden;
  pointer-events: none;
}
.atlas-zone-overlay {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 5;
}
.atlas-zone-overlay path {
  vector-effect: non-scaling-stroke;
  stroke-linejoin: round;
}
.atlas-zone-panel > button {
  margin: 4px 6px 4px 0;
}
.atlas-zone-panel dl dd {
  overflow-wrap: anywhere;
  margin: 0;
}
.atlas-zone-panel a {
  color: #ffba68;
}
html[data-theme="light"] .atlas-zone-panel a {
  color: #793d0b;
}
html[data-theme="light"] .atlas-zone-overlay path:last-child {
  stroke: #a24c0c;
}
@media (max-width: 760px) {
  .atlas-zone-panel {
    right: 12px;
    bottom: 80px;
    width: min(340px, calc(100% - 24px));
    max-height: 43%;
  }
}

@media (max-width: 900px) {
  .map-tools > #labelsButton {
    grid-area: 2/1 / auto/span 12;
  }
  .map-tools > .address-check-link {
    grid-area: 2/13 / auto/span 12;
  }
  .map-tools > #parcelsButton {
    grid-area: 2/25 / auto/span 12;
  }
  .map-tools > #zonesButton {
    grid-area: 2/37 / auto/span 12;
  }
  .map-tools > #polesButton {
    grid-area: 2/49 / auto/span 12;
  }
}
/* Keep research and zoning information available without stacking panels. */
#map:has(.atlas-zone-panel:not([hidden])) .atlas-research-land-panel {
  max-height: 32%;
}
.atlas-zone-panel {
  max-height: 43%;
  z-index: 25;
}

.atlas-zone-panel button:not(.atlas-parcel-heading button) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  height: auto;
  min-height: 40px;
  white-space: nowrap;
  line-height: 1.4;
  max-width: 100%;
}
@media (max-width: 900px) {
  .atlas-zone-panel {
    left: 12px;
    right: 12px;
    width: auto;
    bottom: calc(
      var(--map-status-height, 40px) +
        var(--atlas-dock-height, var(--map-dock-height, 120px)) + 16px
    );
    max-height: 32vh;
  }
}

.atlas-boundary-labels{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:5}.atlas-boundary-labels text{font:600 12px system-ui;fill:#ffcc8b;stroke:#17231c;stroke-width:3;paint-order:stroke;stroke-linejoin:round}