/* Minimal layout: the map is the page. No boxes, no frames. */

.minimal main { max-width: var(--max); }

.minimal .lead { text-align: center; padding: calc(var(--u) * 5) 0 calc(var(--u) * 3); }
.minimal h1 {
  font-size: clamp(48px, 7.2vw, 104px);
  line-height: 0.95;
  margin: 0 0 calc(var(--u) * 1.5);
}
.minimal .standfirst {
  max-width: none;
  margin: 0 0 calc(var(--u) * 4);
  font-size: clamp(22px, 2.3vw, 30px);
}

.minimal .search {
  max-width: 460px;
  margin: 0 auto;
  border-bottom: 0.75px solid var(--ink);
}
.minimal .search input { text-align: left; font-size: 24px; }
.minimal .search button { color: var(--red-ink); }
.minimal .aside { margin: 10px 0 0; }
.minimal .aside .link { margin: 0; color: var(--muted); }
.minimal .status { margin: calc(var(--u) * 1.5) 0 0; min-height: 1.5em; text-align: center; }

/* Map: land is a quiet tone, states are drawn in paper-coloured lines, no outline */
.minimal .map-fig { margin: 0; overflow: visible; }
.minimal .map-frame { width: 100%; aspect-ratio: 975 / 610; }
.minimal #map { cursor: default; }
.minimal #map .state { fill: #ECE8E1; stroke: var(--paper); stroke-width: 1; }
.minimal #map .nation { display: none; }
.minimal #map .store { stroke: #ECE8E1; stroke-width: 0.6; }
.minimal .reset {
  position: absolute; left: 50%; bottom: 0; transform: translateX(-50%);
  margin: 0; color: var(--muted);
}
.minimal .reset[hidden] { display: none; }
.minimal .tip {
  border: 0; background: var(--paper);
  box-shadow: 0 1px 2px rgba(35,31,32,.08), 0 10px 28px -10px rgba(35,31,32,.35);
}

/* Results: a quiet numbered row under the map */
.minimal .results {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: calc(var(--u) * 2.5) calc(var(--u) * 3);
  max-height: none; overflow: visible;
  margin: calc(var(--u) * 4) 0 0;
}
.minimal .results:empty { display: none; }
.minimal .results li { border: 0; }
.minimal .result { padding: 0; grid-template-columns: 1fr; }
.minimal .result .dist { order: 3; line-height: 1.4; }
.minimal .result .addr { grid-column: auto; }
.minimal .results .dir { margin: 4px 0 0; }

.minimal .foot { padding-top: calc(var(--u) * 7); }
.minimal .foot .close { margin: calc(var(--u) * 4) 0 calc(var(--u) * 2); font: 300 clamp(20px, 2vw, 26px)/1.3 var(--f-cond); }
.minimal .foot .close a { color: var(--red-ink); text-underline-offset: 4px; text-decoration-thickness: .75px; }

@media (max-width: 860px) {
  .minimal .results { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .minimal .lead { padding-top: calc(var(--u) * 3); }
}
@media (max-width: 480px) {
  .minimal .results { grid-template-columns: minmax(0, 1fr); }
  .minimal .map-frame { aspect-ratio: 4 / 3; }
}

/* Fade the map into the paper so zoomed-in land never makes a hard edge */
.minimal #map {
  -webkit-mask-image:
    linear-gradient(to right, transparent, #000 7%, #000 93%, transparent),
    linear-gradient(to bottom, transparent, #000 7%, #000 93%, transparent);
  -webkit-mask-composite: source-in;
  mask-image:
    linear-gradient(to right, transparent, #000 7%, #000 93%, transparent),
    linear-gradient(to bottom, transparent, #000 7%, #000 93%, transparent);
  mask-composite: intersect;
}
.minimal .lead { padding: calc(var(--u) * 4) 0 calc(var(--u) * 1); }
.minimal .standfirst { margin-bottom: calc(var(--u) * 3); }
.minimal .status { min-height: 1.4em; font-size: 16px; }

/* Line-only map: no land fill, so zooming never reveals a block of colour */
.minimal #map .state { fill: transparent; stroke: #D3CCC3; stroke-width: 0.8; }
.minimal #map .nation { display: block; fill: none; stroke: #A9A097; stroke-width: 0.9; }
.minimal #map .store { stroke: var(--paper); stroke-width: 0.8; }
.minimal .reset { position: static; transform: none; display: block; margin: 6px auto 0; }
