* { box-sizing: border-box; }
body {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  height: 100vh;
  height: 100dvh;
  margin: 0;
  color: #172d3f;
  background: #eaf0f5;
  font: 16px/1.45 system-ui, -apple-system, sans-serif;
}
header {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: .5rem .75rem;
  padding: max(.75rem, env(safe-area-inset-top)) max(1rem, env(safe-area-inset-right)) .75rem max(1rem, env(safe-area-inset-left));
  background: #fff;
}
h1 { font-size: clamp(1.02rem, 5vw, 1.45rem); margin: 0; }
button {
  min-height: 46px;
  padding: .6rem .85rem;
  border: 0;
  border-radius: .5rem;
  color: #fff;
  background: #075da6;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
button:disabled { opacity: .65; cursor: default; }
#status { grid-column: 1 / -1; font-size: .9rem; margin: 0; overflow-wrap: anywhere; }
#map { min-height: 0; }
.leaflet-bottom { margin-bottom: env(safe-area-inset-bottom); }