:root {
  color-scheme: light;
  --ink: #161a17;
  --ink-soft: #444941;
  --paper: #f4efe2;
  --paper-light: #fbf8ef;
  --line: #d2c9b5;
  --line-dark: #a89e89;
  --gold: #d8a62a;
  --red: #b33b2e;
  --shadow: 0 18px 50px rgba(27, 29, 24, 0.14);
  --museum: #246a78;
  --district: #9b5d25;
  --sacred: #70466f;
  --industry: #aa4134;
  --memorial: #2f704b;
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  min-height: 100%;
  background: var(--paper);
  color: var(--ink);
}

body {
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 1rem;
  line-height: 1.5;
  overflow: hidden;
}

button,
input,
select {
  font: inherit;
}

button,
a,
input,
select {
  -webkit-tap-highlight-color: transparent;
}

a {
  color: inherit;
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
.site-card__main:focus-visible {
  outline: 3px solid rgba(179, 59, 46, 0.32);
  outline-offset: 2px;
}

.skip-link {
  position: fixed;
  z-index: 2000;
  top: 0.5rem;
  left: 0.5rem;
  padding: 0.7rem 1rem;
  background: var(--ink);
  color: white;
  transform: translateY(-150%);
  transition: transform 160ms ease;
}

.skip-link:focus {
  transform: translateY(0);
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.masthead {
  height: 5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  padding: 0 1.5rem 0 1.25rem;
  color: var(--paper-light);
  background: var(--ink);
  border-bottom: 1px solid #050605;
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 0.8rem;
  text-decoration: none;
}

.brand-mark {
  position: relative;
  width: 2.9rem;
  height: 2.9rem;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.36);
  background: linear-gradient(to bottom, #171b18 0 60%, var(--red) 60% 80%, var(--gold) 80% 100%);
  box-shadow: inset 0 0 0 3px var(--ink);
}

.brand-mark span {
  margin-top: -0.35rem;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.04em;
}

.brand-copy {
  display: grid;
  line-height: 1.04;
}

.brand-copy strong {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.22rem;
  letter-spacing: 0.015em;
}

.brand-copy span {
  margin-top: 0.25rem;
  color: #beb8aa;
  font-size: 0.74rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.masthead-note {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  color: #d0c9ba;
  font-size: 0.82rem;
  letter-spacing: 0.035em;
}

.tricolor {
  width: 3rem;
  height: 0.3rem;
  background: linear-gradient(to right, #090a09 0 33.33%, var(--red) 33.33% 66.66%, var(--gold) 66.66%);
  border: 1px solid rgba(255, 255, 255, 0.18);
}

.atlas-shell {
  height: calc(100dvh - 5rem);
  display: grid;
  grid-template-columns: minmax(23rem, 29rem) minmax(0, 1fr);
  grid-template-rows: auto minmax(0, 1fr);
  grid-template-areas:
    "controls map"
    "results map";
}

.explorer-controls {
  grid-area: controls;
  padding: 1.65rem 1.5rem 1.25rem;
  background:
    linear-gradient(rgba(244, 239, 226, 0.95), rgba(244, 239, 226, 0.95)),
    repeating-linear-gradient(45deg, transparent 0 8px, rgba(73, 66, 51, 0.05) 8px 9px);
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.eyebrow {
  margin: 0 0 0.4rem;
  color: var(--red);
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

h1,
h2,
h3,
p {
  margin-top: 0;
}

h1,
h2,
h3 {
  font-family: Georgia, "Times New Roman", serif;
}

h1 {
  max-width: 25rem;
  margin-bottom: 0.65rem;
  font-size: clamp(1.72rem, 3vw, 2.25rem);
  line-height: 1.04;
  letter-spacing: -0.025em;
}

.lede {
  max-width: 37rem;
  margin-bottom: 1.2rem;
  color: var(--ink-soft);
  font-size: 0.94rem;
  line-height: 1.55;
}

.filter-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 9.6rem;
  gap: 0.55rem;
}

.search-wrap,
.region-wrap {
  position: relative;
  min-width: 0;
}

.search-wrap svg {
  position: absolute;
  top: 50%;
  left: 0.82rem;
  width: 1.05rem;
  height: 1.05rem;
  fill: none;
  stroke: #777162;
  stroke-width: 1.8;
  stroke-linecap: round;
  transform: translateY(-50%);
  pointer-events: none;
}

.search-wrap input,
.region-wrap select {
  width: 100%;
  min-height: 2.75rem;
  border: 1px solid var(--line-dark);
  border-radius: 0;
  background: var(--paper-light);
  color: var(--ink);
  font-size: 0.88rem;
}

.search-wrap input {
  padding: 0.65rem 0.8rem 0.65rem 2.45rem;
}

.search-wrap input::placeholder {
  color: #747061;
}

.region-wrap select {
  appearance: none;
  padding: 0.65rem 2.1rem 0.65rem 0.8rem;
  cursor: pointer;
}

.region-wrap svg {
  position: absolute;
  top: 50%;
  right: 0.7rem;
  width: 1rem;
  height: 1rem;
  fill: none;
  stroke: var(--ink);
  stroke-width: 1.6;
  transform: translateY(-50%);
  pointer-events: none;
}

.category-filters {
  display: flex;
  gap: 0.42rem;
  margin-top: 0.7rem;
  overflow-x: auto;
  scrollbar-width: none;
}

.category-filters::-webkit-scrollbar {
  display: none;
}

.filter-chip {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
  min-height: 2.25rem;
  padding: 0.45rem 0.72rem;
  border: 1px solid var(--line-dark);
  background: transparent;
  color: var(--ink-soft);
  font-size: 0.78rem;
  font-weight: 700;
  cursor: pointer;
  transition: background 140ms ease, color 140ms ease, border-color 140ms ease, transform 140ms ease;
}

.filter-chip:hover {
  transform: translateY(-1px);
  border-color: var(--ink);
}

.filter-chip[aria-pressed="true"] {
  background: var(--ink);
  border-color: var(--ink);
  color: var(--paper-light);
}

.filter-chip__dot,
.legend-dot {
  width: 0.55rem;
  height: 0.55rem;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--category-color);
  box-shadow: 0 0 0 1px rgba(22, 26, 23, 0.15);
}

.results-panel {
  grid-area: results;
  min-height: 0;
  padding: 1rem 0 0;
  overflow: hidden;
  background: var(--paper-light);
  border-right: 1px solid var(--line);
}

.results-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1rem;
  padding: 0 1.5rem;
}

.results-heading .eyebrow {
  margin-bottom: 0.15rem;
  font-size: 0.68rem;
}

.results-heading h2 {
  margin-bottom: 0;
  font-size: 1.27rem;
  line-height: 1.15;
}

.clear-button {
  flex: 0 0 auto;
  padding: 0.28rem 0;
  border: 0;
  border-bottom: 1px solid currentColor;
  background: none;
  color: var(--red);
  font-size: 0.76rem;
  font-weight: 800;
  cursor: pointer;
}

.coverage-note {
  margin: 0.52rem 0 0;
  padding: 0 1.5rem 0.85rem;
  color: #6e6a5d;
  font-size: 0.76rem;
  line-height: 1.45;
  border-bottom: 1px solid var(--line);
}

.site-list {
  height: calc(100% - 5.75rem);
  padding: 0.7rem 0.8rem 2rem;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-color: #b5ad9b transparent;
  scrollbar-width: thin;
}

.site-card {
  position: relative;
  margin-bottom: 0.55rem;
  border: 1px solid var(--line);
  background: #fffdf7;
  transition: border-color 150ms ease, box-shadow 150ms ease, transform 150ms ease;
}

.site-card::before {
  content: "";
  position: absolute;
  top: -1px;
  bottom: -1px;
  left: -1px;
  width: 4px;
  background: var(--category-color);
  opacity: 0;
  transition: opacity 150ms ease;
}

.site-card:hover {
  border-color: #b3a994;
  transform: translateY(-1px);
}

.site-card.is-selected {
  border-color: var(--ink);
  box-shadow: 0 8px 24px rgba(45, 43, 36, 0.11);
}

.site-card.is-selected::before {
  opacity: 1;
}

.site-card__main {
  width: 100%;
  display: grid;
  grid-template-columns: 2.15rem minmax(0, 1fr);
  gap: 0.75rem;
  padding: 0.92rem 0.95rem 0.7rem;
  border: 0;
  background: none;
  color: inherit;
  text-align: left;
  cursor: pointer;
}

.category-glyph {
  width: 2.15rem;
  height: 2.15rem;
  display: grid;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--category-color) 72%, black 12%);
  background: color-mix(in srgb, var(--category-color) 9%, white);
  color: var(--category-color);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 0.82rem;
  font-weight: 800;
}

.site-card__topline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
  margin-bottom: 0.18rem;
}

.site-type {
  color: var(--category-color);
  font-size: 0.66rem;
  font-weight: 850;
  letter-spacing: 0.105em;
  text-transform: uppercase;
}

.site-era {
  flex: 0 0 auto;
  color: #716c5e;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 0.72rem;
  font-style: italic;
}

.site-card h3 {
  margin-bottom: 0.22rem;
  font-size: 1.04rem;
  line-height: 1.25;
}

.site-location {
  margin-bottom: 0.52rem;
  color: #625e53;
  font-size: 0.76rem;
  font-weight: 650;
}

.site-description {
  margin-bottom: 0;
  color: var(--ink-soft);
  font-size: 0.82rem;
  line-height: 1.5;
}

.site-actions {
  display: flex;
  gap: 0.45rem;
  padding: 0 0.95rem 0.82rem 3.85rem;
}

.site-actions a {
  display: inline-flex;
  align-items: center;
  gap: 0.28rem;
  padding: 0.34rem 0.55rem;
  border: 1px solid var(--line);
  text-decoration: none;
  color: var(--ink-soft);
  font-size: 0.72rem;
  font-weight: 750;
  transition: border-color 140ms ease, background 140ms ease;
}

.site-actions a:hover {
  border-color: var(--ink);
  background: var(--paper);
}

.site-actions svg {
  width: 0.78rem;
  height: 0.78rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.empty-state {
  margin: 1.5rem;
  padding: 2.5rem 1.25rem;
  border: 1px dashed var(--line-dark);
  text-align: center;
}

.empty-state > span {
  color: var(--red);
  font-size: 1.5rem;
}

.empty-state h3 {
  margin: 0.65rem 0 0.25rem;
  font-size: 1.1rem;
}

.empty-state p {
  margin-bottom: 1rem;
  color: var(--ink-soft);
  font-size: 0.84rem;
}

.empty-state button {
  border: 1px solid var(--ink);
  padding: 0.55rem 0.8rem;
  background: var(--ink);
  color: white;
  font-size: 0.78rem;
  font-weight: 800;
  cursor: pointer;
}

.map-panel {
  position: relative;
  grid-area: map;
  min-height: 0;
  overflow: hidden;
  background: #d6cfbf;
}

#map {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background:
    radial-gradient(circle at 74% 23%, rgba(255, 255, 255, 0.42), transparent 34%),
    #d8d1c1;
}

#map::after {
  content: "";
  position: absolute;
  z-index: 4;
  inset: 0;
  pointer-events: none;
  box-shadow: inset 0 0 80px rgba(43, 40, 31, 0.18);
}

.map-loading {
  height: 100%;
  display: grid;
  place-items: center;
  color: #5f5b50;
  font-family: Georgia, "Times New Roman", serif;
  font-style: italic;
}

.heritage-map-svg {
  width: 100%;
  height: 100%;
  display: block;
  cursor: grab;
  touch-action: none;
  user-select: none;
}

.heritage-map-svg.is-dragging {
  cursor: grabbing;
}

.map-field {
  fill: #d8d1c1;
}

.map-grid-line {
  fill: none;
  stroke: #bdb4a2;
  stroke-width: 1;
  stroke-dasharray: 4 9;
  vector-effect: non-scaling-stroke;
}

.missouri-shadow {
  fill: rgba(36, 34, 28, 0.16);
  transform: translate(8px, 10px);
}

.missouri-shape {
  fill: #f5efdf;
  stroke: #1e221e;
  stroke-width: 3;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}

.missouri-flag {
  fill: url(#german-flag);
  opacity: 0.14;
}

.map-inner-grid {
  opacity: 0.55;
}

.missouri-river {
  fill: none;
  stroke: #78909a;
  stroke-width: 3.2;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0.72;
  vector-effect: non-scaling-stroke;
}

.mississippi-river {
  fill: none;
  stroke: #5e7f8b;
  stroke-width: 5.5;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0.78;
  vector-effect: non-scaling-stroke;
}

.map-state-name {
  fill: #463f32;
  opacity: 0.065;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 96px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-anchor: middle;
}

.map-state-name-outside {
  opacity: 0.58;
  font-family: Inter, ui-sans-serif, system-ui, sans-serif;
  font-size: 17px;
  font-weight: 800;
  letter-spacing: 0.2em;
  text-anchor: start;
}

.map-river-label {
  fill: #58727b;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 15px;
  font-style: italic;
  letter-spacing: 0.04em;
  opacity: 0.78;
}

.map-city-dot {
  fill: #5a554a;
  opacity: 0.82;
}

.map-city-label {
  fill: #514d43;
  font-family: Inter, ui-sans-serif, system-ui, sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.02em;
  paint-order: stroke;
  stroke: #f5efdf;
  stroke-width: 4px;
  stroke-linejoin: round;
}

.map-compass line,
.map-compass path,
.map-compass circle {
  fill: none;
  stroke: #4f4a3f;
  stroke-width: 1.5;
  vector-effect: non-scaling-stroke;
}

.map-compass text {
  fill: #4f4a3f;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 15px;
  font-weight: 700;
  text-anchor: middle;
}

.heritage-svg-marker {
  cursor: pointer;
  outline: none;
}

.heritage-svg-marker .marker-stem {
  stroke: #292c28;
  stroke-width: 3;
  stroke-linecap: round;
  vector-effect: non-scaling-stroke;
}

.heritage-svg-marker .marker-ring {
  fill: none;
  stroke: #171a17;
  stroke-width: 3;
  opacity: 0;
  vector-effect: non-scaling-stroke;
}

.heritage-svg-marker .marker-disc {
  fill: var(--marker-color);
  stroke: #fffaf0;
  stroke-width: 2.5;
  vector-effect: non-scaling-stroke;
  filter: drop-shadow(0 3px 3px rgba(25, 26, 22, 0.28));
  transition: r 140ms ease;
}

.heritage-svg-marker .marker-letter {
  fill: white;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 10px;
  font-weight: 800;
  text-anchor: middle;
  pointer-events: none;
}

.heritage-svg-marker:hover .marker-disc,
.heritage-svg-marker:focus-visible .marker-disc {
  r: 12px;
}

.heritage-svg-marker:focus-visible .marker-ring,
.heritage-svg-marker.is-selected .marker-ring {
  opacity: 1;
}

.heritage-svg-marker.is-selected .marker-disc {
  r: 12px;
}

.map-legend,
.map-reset,
.map-count,
.map-zoom-controls,
.map-selection {
  position: absolute;
  z-index: 6;
  border: 1px solid rgba(22, 26, 23, 0.58);
  background: rgba(251, 248, 239, 0.96);
  box-shadow: var(--shadow);
}

.map-legend {
  top: 1rem;
  right: 1rem;
  width: 11.25rem;
  padding: 0.72rem 0.8rem;
}

.legend-title {
  display: block;
  margin-bottom: 0.42rem;
  font-size: 0.65rem;
  font-weight: 850;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

#map-legend-items {
  display: grid;
  gap: 0.28rem;
}

.legend-item {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  color: var(--ink-soft);
  font-size: 0.7rem;
  line-height: 1.25;
}

.map-reset {
  top: 1rem;
  left: 4.25rem;
  min-height: 2.25rem;
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
  padding: 0.42rem 0.65rem;
  color: var(--ink);
  font-size: 0.73rem;
  font-weight: 800;
  cursor: pointer;
}

.map-zoom-controls {
  top: 1rem;
  left: 1rem;
  display: grid;
  grid-template-rows: 1fr 1fr;
}

.map-zoom-controls button {
  width: 2.35rem;
  height: 2.25rem;
  display: grid;
  place-items: center;
  border: 0;
  background: transparent;
  color: var(--ink);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
}

.map-zoom-controls button + button {
  border-top: 1px solid var(--line);
}

.map-zoom-controls button:hover,
.map-reset:hover {
  background: var(--paper);
}

.map-reset svg {
  width: 0.9rem;
  height: 0.9rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.map-count {
  right: 1rem;
  bottom: 1.8rem;
  padding: 0.52rem 0.7rem;
  color: var(--ink-soft);
  font-size: 0.71rem;
  font-weight: 750;
}

.map-selection {
  bottom: 1.8rem;
  left: 1rem;
  width: min(21rem, calc(100% - 13rem));
  padding: 0.8rem 2.5rem 0.78rem 0.9rem;
  border-left: 4px solid var(--selection-color, var(--red));
}

.map-selection[hidden] {
  display: none;
}

.map-selection__type {
  display: block;
  margin-bottom: 0.18rem;
  color: var(--selection-color, var(--red));
  font-size: 0.64rem;
  font-weight: 850;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.map-selection strong {
  display: block;
  margin-bottom: 0.15rem;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1rem;
  line-height: 1.22;
}

.map-selection__place {
  display: block;
  color: #625e53;
  font-size: 0.72rem;
}

.map-selection__close {
  position: absolute;
  top: 0.52rem;
  right: 0.55rem;
  width: 1.7rem;
  height: 1.7rem;
  display: grid;
  place-items: center;
  border: 0;
  background: transparent;
  color: var(--ink-soft);
  font-size: 1.15rem;
  line-height: 1;
  cursor: pointer;
}

.noscript-note {
  position: fixed;
  z-index: 3000;
  right: 1rem;
  bottom: 1rem;
  padding: 0.8rem 1rem;
  background: var(--red);
  color: white;
}

@media (max-width: 980px) {
  body {
    overflow: auto;
  }

  .masthead {
    height: 4.6rem;
  }

  .masthead-note {
    display: none;
  }

  .atlas-shell {
    height: auto;
    min-height: calc(100dvh - 4.6rem);
    grid-template-columns: 1fr;
    grid-template-rows: auto 48dvh auto;
    grid-template-areas:
      "controls"
      "map"
      "results";
  }

  .explorer-controls,
  .results-panel {
    border-right: 0;
  }

  .map-panel {
    min-height: 23rem;
    border-bottom: 1px solid var(--line-dark);
  }

  .results-panel {
    overflow: visible;
  }

  .site-list {
    height: auto;
    overflow: visible;
  }
}

@media (max-width: 620px) {
  .masthead {
    padding: 0 1rem;
  }

  .brand-mark {
    width: 2.55rem;
    height: 2.55rem;
  }

  .brand-copy strong {
    font-size: 1.08rem;
  }

  .brand-copy span {
    font-size: 0.67rem;
  }

  .explorer-controls {
    padding: 1.35rem 1rem 1rem;
  }

  h1 {
    font-size: 1.72rem;
  }

  .lede {
    font-size: 0.9rem;
  }

  .filter-grid {
    grid-template-columns: 1fr;
  }

  .atlas-shell {
    grid-template-rows: auto 44dvh auto;
  }

  .map-panel {
    min-height: 20rem;
  }

  .map-legend {
    top: auto;
    right: 0.6rem;
    bottom: 0.6rem;
    width: auto;
    max-width: calc(100% - 7rem);
    padding: 0.5rem 0.6rem;
  }

  .legend-title {
    display: none;
  }

  #map-legend-items {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem 0.55rem;
  }

  .legend-item {
    font-size: 0.64rem;
  }

  .map-reset {
    top: 0.6rem;
    left: 3.55rem;
  }

  .map-zoom-controls {
    top: 0.6rem;
    left: 0.6rem;
  }

  .map-count {
    display: none;
  }

  .map-selection {
    top: 3.45rem;
    right: 0.6rem;
    bottom: auto;
    left: 0.6rem;
    width: auto;
  }

  .results-panel {
    padding-top: 1.2rem;
  }

  .results-heading,
  .coverage-note {
    padding-right: 1rem;
    padding-left: 1rem;
  }

  .site-list {
    padding: 0.7rem 0.65rem 2rem;
  }

  .site-card__main {
    grid-template-columns: 1.9rem minmax(0, 1fr);
    gap: 0.62rem;
    padding: 0.82rem 0.78rem 0.6rem;
  }

  .category-glyph {
    width: 1.9rem;
    height: 1.9rem;
  }

  .site-actions {
    padding: 0 0.78rem 0.75rem 3.3rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}

/* Shared navigation and the surname field guide. */
.atlas-nav { display:flex; gap:.5rem; flex-shrink:0; }
.atlas-nav a { padding:.6rem .8rem; font-size:.85rem; font-weight:700; text-decoration:none; border-bottom:2px solid transparent; }
.atlas-nav a:hover, .atlas-nav a[aria-current="page"] { color:var(--gold); border-color:var(--gold); }
.surname-page { overflow:auto; }
.surname-main { max-width:1120px; margin:0 auto; padding:3rem 2rem; }
.surname-main h1 { max-width:850px; font-size:clamp(2rem,4vw,3.2rem); line-height:1.1; }
.surname-main h2 { font-size:1.65rem; line-height:1.2; margin-bottom:1rem; }
.surname-main p { color:var(--ink-soft); }
.surname-answer { max-width:900px; font-size:1.13rem; line-height:1.65; }
.research-date, .table-note { font-size:.82rem; }
.evidence-note { padding:1.25rem 1.5rem; margin:1.8rem 0 2.5rem; border:1px solid var(--line); border-left:4px solid var(--red); background:var(--paper-light); }
.evidence-note p { margin:.5rem 0 0; }
.surname-main a { text-underline-offset:3px; }
.surname-table-wrap { overflow-x:auto; border:1px solid var(--line-dark); background:var(--paper-light); }
.surname-table { width:100%; border-collapse:collapse; text-align:left; }
.surname-table caption { text-align:left; padding:.75rem 1rem; font-size:.8rem; color:var(--ink-soft); }
.surname-table th, .surname-table td { padding:.9rem 1rem; border-top:1px solid var(--line); vertical-align:top; }
.surname-table thead { background:var(--ink); color:var(--paper-light); font-size:.8rem; }
.surname-table small { font-weight:400; }
.surname-table tbody th { font-family:Georgia,serif; font-size:1.1rem; }
.surname-table td { font-size:.88rem; }
.surname-table td:nth-child(2), .surname-table td:nth-child(3) { font-variant-numeric:tabular-nums; white-space:nowrap; }
.surname-table tbody tr:nth-child(even) { background:var(--paper); }
.table-note { margin-top:.8rem; }
.surname-context { display:grid; grid-template-columns:1fr 1fr; gap:2.5rem; margin:2.5rem 0; padding-top:2rem; border-top:1px solid var(--line-dark); }
.surname-sources { padding:1.5rem; background:var(--paper-light); border:1px solid var(--line); }
.surname-sources ol { padding-left:1.3rem; font-size:.9rem; }
.surname-sources li { margin-bottom:.8rem; }
.back-to-map { display:inline-block; margin-top:2rem; font-weight:700; }
@media(max-width:620px) { .masthead { height:auto; min-height:4.6rem; flex-wrap:wrap; gap:.65rem; padding:1rem; } .atlas-nav { width:100%; } .atlas-nav a { padding:.4rem .6rem; } .surname-main { padding:2rem 1rem; } .surname-context { grid-template-columns:1fr; gap:1.5rem; } .surname-table { min-width:650px; } .evidence-note, .surname-sources { padding:1rem; } }

.corridor-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.2rem;margin:1.5rem 0 2.5rem}.corridor-grid article{border:1px solid var(--line);border-top:4px solid var(--gold);background:var(--paper-light);padding:1.4rem}.corridor-grid h3{font:700 1.35rem/1.25 Georgia,serif;margin:0 0 .8rem}.corridor-grid p{font-size:1rem;line-height:1.6}.corridor-grid a{font-size:1rem;font-weight:700}.atlas-nav{flex-wrap:wrap}.atlas-nav a{font-size:.875rem}@media(max-width:620px){.corridor-grid{grid-template-columns:1fr}}

.cole-camp-events{padding:1rem;border-top:1px solid var(--line);font-size:1rem}.cole-camp-events h4{margin:0 0 .5rem;font-size:1rem}.cole-camp-events p{line-height:1.5}.cole-camp-events ul{padding-left:1.2rem}.cole-camp-events li{margin:.5rem 0}.cole-camp-events a{text-underline-offset:3px}

.news-bar{position:relative;z-index:1000;background:#681d23;color:#f8ece7;display:flex;align-items:center;gap:10px;padding:4px 12px;min-height:31px;font:12px/1.3 system-ui;border-bottom:1px solid #8d3539}.news-bar strong{flex-shrink:0;font-size:11px;letter-spacing:.04em}.news-bar a{color:#f8ece7;text-decoration:underline;text-underline-offset:3px}.news-window{overflow:hidden;flex:1;min-width:0}.news-track{display:flex;width:max-content;animation:news-scroll 105s linear infinite;will-change:transform;transform:translate3d(0,0,0)}.news-track.news-static{animation:none}.news-group{display:flex;align-items:center;gap:40px;padding-right:40px}.news-track a{white-space:nowrap}.news-bar:hover .news-track,.news-bar:focus-within .news-track,.news-bar.paused .news-track{animation-play-state:paused}.news-bar button{background:#f6eee8;color:#681d23;border:0;border-radius:4px;padding:2px 7px;font:inherit;cursor:pointer}@keyframes news-scroll{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}@media(prefers-reduced-motion:reduce){.news-track{animation:none}.news-window{overflow-x:auto}}@media(max-width:650px){.news-bar strong{max-width:75px;font-size:10px}.news-bar{gap:6px;padding:4px 7px;min-height:29px}.news-group{gap:24px;padding-right:24px}.news-bar button{padding:2px 6px}}

.events-dropdown{position:relative}.events-dropdown summary{padding:.6rem .8rem;font-size:.875rem;font-weight:700;cursor:pointer}.events-dropdown[open] summary{color:var(--gold)}.events-dropdown-list{position:absolute;right:0;top:100%;min-width:240px;max-height:65vh;overflow-y:auto;background:var(--ink);color:var(--paper-light);border:1px solid var(--gold);box-shadow:0 8px 24px #0004;z-index:2000;padding:.5rem}.atlas-nav .events-dropdown-list a{display:block;font-size:1rem;padding:.55rem .8rem;white-space:nowrap}.events-dropdown summary:focus-visible{outline:2px solid var(--gold);outline-offset:2px}.city-event-section{scroll-margin-top:100px}.masthead{position:relative;z-index:2001}@media(max-width:620px){.events-dropdown-list{left:0;right:auto;min-width:220px}}
.website-previews{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;margin:1.5rem 0 2.25rem}.website-preview-card{display:block;background:var(--paper-light);border:1px solid var(--line-dark);color:var(--ink);text-decoration:none;overflow:hidden;transition:transform .18s ease,box-shadow .18s ease}.website-preview-card:hover{transform:translateY(-2px);box-shadow:0 7px 18px #161a1720}.website-preview-card:focus-visible{outline:3px solid var(--gold);outline-offset:3px}.website-preview-card img{display:block;width:100%;height:125px;object-fit:cover;background:var(--line)}.website-preview-card>span{display:block;padding:.8rem}.website-preview-card strong,.website-preview-card>span>span{display:block}.website-preview-card strong{font:700 1rem/1.25 Georgia,serif}.website-preview-card>span>span{margin-top:.25rem;color:var(--ink-soft);font-size:.82rem}@media(max-width:850px){.website-previews{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:480px){.website-previews{grid-template-columns:1fr}.website-preview-card{display:grid;grid-template-columns:105px 1fr}.website-preview-card img{height:100%;min-height:90px}.website-preview-card>span{align-self:center}}
.newsletter-invite{display:grid;gap:.45rem;margin:1.25rem 0;padding:1rem 1.1rem;background:#f7f2e5;border-left:4px solid var(--gold);color:var(--ink);font-size:.9rem}.newsletter-invite strong{font:700 1.05rem/1.3 Georgia,serif}.invite-links{display:flex;gap:.65rem;flex-wrap:wrap;margin-top:.25rem}.invite-links a{display:inline-block;padding:.48rem .7rem;background:var(--ink);color:white;text-decoration:none;font-weight:750}.invite-links a:last-child{background:transparent;color:var(--ink);border:1px solid var(--ink)}.site-footer{display:grid;gap:.35rem;padding:1.5rem clamp(1rem,4vw,3rem);background:#121512;color:#e8e2d5;border-top:4px solid var(--gold);font-size:.85rem}.site-footer>span{color:#bdb8ad}.site-footer nav{display:flex;gap:1rem;flex-wrap:wrap;margin-top:.35rem}.site-footer a{color:#f0c455;text-underline-offset:3px}

/* History and demographics */
.demographic-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.25rem;margin:2rem 0 3rem}.demographic-card{padding:1.5rem;background:var(--paper-light);border:1px solid var(--line-dark);border-top:5px solid var(--gold)}.metric-kicker{min-height:2.7em;margin:0;text-transform:uppercase;letter-spacing:.08em;font-size:.75rem;font-weight:800}.metric-number{display:block;margin:.45rem 0 .1rem;font:700 clamp(2.3rem,5vw,4rem)/1 Georgia,serif;color:var(--ink)}.metric-share{margin:.55rem 0;font-weight:800}.metric-note{margin:.75rem 0 0;font-size:.8rem;line-height:1.55}.measure-bar{height:18px;margin:.75rem 0;background:#d7d2c6;overflow:hidden}.measure-bar span{display:block;min-width:4px;height:100%;background:var(--red)}.language-bar span{background:var(--gold)}.chart-panel{margin:2.5rem 0;padding:2rem;background:var(--paper-light);border:1px solid var(--line)}.chart-panel>p{max-width:900px;line-height:1.65}.comparison-chart{display:grid;gap:.85rem;margin:1.5rem 0}.comparison-row{display:grid;grid-template-columns:150px minmax(120px,1fr) 60px;gap:1rem;align-items:center;font-size:.9rem}.comparison-row>div{height:28px;background:#e0dcd2}.comparison-row i{display:block;height:100%;background:var(--red)}.comparison-row.muted i{background:#7d817b}.comparison-row strong{text-align:right;font-variant-numeric:tabular-nums}.language-stack{display:flex;min-height:54px;margin:1.5rem 0 .85rem;color:white;font-weight:800}.language-stack span{display:flex;align-items:center;justify-content:center;padding:.5rem;min-width:70px}.very-well{background:#344f45}.less-well{background:#a83b32}.chart-legend{display:flex;gap:1.25rem;flex-wrap:wrap;font-size:.8rem}.chart-legend span{display:flex;align-items:center;gap:.4rem}.chart-legend i{width:13px;height:13px}.history-section{margin:4rem 0}.history-timeline{position:relative;margin:2rem 0 0}.history-timeline:before{content:"";position:absolute;top:.4rem;bottom:.4rem;left:92px;width:2px;background:var(--gold)}.history-timeline article{display:grid;grid-template-columns:72px 1fr;gap:42px;position:relative;padding:0 0 2rem}.history-timeline article:before{content:"";position:absolute;left:86px;top:.35rem;width:14px;height:14px;border-radius:50%;background:var(--red);border:3px solid var(--paper)}.history-timeline time{padding-top:.15rem;font-weight:850;color:var(--red);text-align:right}.history-timeline h3{margin:0 0 .35rem;font:700 1.3rem/1.25 Georgia,serif}.history-timeline p{max-width:850px;margin:0;line-height:1.6}.history-page .newsletter-invite{margin:1.5rem 0 2.5rem}@media(max-width:680px){.demographic-cards{grid-template-columns:1fr}.metric-kicker{min-height:0}.chart-panel{padding:1.25rem}.comparison-row{grid-template-columns:105px minmax(80px,1fr) 48px;gap:.55rem}.language-stack{font-size:.78rem}.history-timeline:before{left:68px}.history-timeline article{grid-template-columns:52px 1fr;gap:34px}.history-timeline article:before{left:62px}.history-timeline time{font-size:.78rem}}