/* NX-01: national start page (state picker) + state/county page additions, Direction B ("plat & survey").
   Uses the site tokens (--bg film, --ink graphite, --muted, --line, --accent, --wide, --serif); square corners,
   1.5px ink rules, no shadows. Falls back to the palette values when a page lacks the tokens. */
.nx-picker { --nx-ink: var(--ink, #1D2420); --nx-bg: var(--bg, #EDF1EC); --nx-sage: #6E8B7A; --nx-cyan: #1B8FB3;
  box-sizing: border-box; max-width: 1120px; margin: 24px auto 8px; padding: 20px 16px 18px; border: 1.5px solid var(--nx-ink); background: var(--card, #fff); }
.nx-picker *, .nx-picker *::before, .nx-picker *::after { box-sizing: border-box; }
.nx-picker h2 { font-family: var(--wide, 'Archivo', sans-serif); font-stretch: 125%; font-size: clamp(1.3rem, 1rem + 1.4vw, 1.9rem); margin: 0 0 8px; color: var(--nx-ink); }
.nx-picker p { font-family: var(--serif, 'Newsreader', serif); font-size: 1.02rem; line-height: 1.5; margin: 0 0 10px; max-width: 78ch; }
.nx-geo { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.nx-suggest a { color: var(--accent, var(--nx-cyan)); }
.nx-map { list-style: none; margin: 12px 0 8px; padding: 0; display: grid; grid-template-columns: repeat(11, minmax(0, 1fr)); grid-template-rows: repeat(8, auto); gap: 4px; max-width: 760px; }
.nx-tile-li { margin: 0; padding: 0; }
.nx-tile { display: flex; align-items: center; justify-content: center; aspect-ratio: 1 / 1; min-height: 28px; font-family: var(--wide, sans-serif); font-stretch: 112%;
  font-weight: 700; font-size: clamp(.62rem, .45rem + .6vw, .92rem); text-decoration: none; border: 1.5px solid var(--nx-ink); color: var(--nx-ink); background: var(--nx-bg); }
.nx-tile.live { background: var(--nx-ink); color: var(--nx-bg); }
.nx-tile.soon { background: repeating-linear-gradient(135deg, var(--nx-bg) 0 5px, #dfe6df 5px 6px); }
.nx-tile:hover, .nx-tile:focus-visible { outline: 3px solid var(--nx-cyan); outline-offset: 1px; position: relative; z-index: 1; }
.nx-tile.nx-here { box-shadow: inset 0 0 0 3px #C8372D; }
.nx-legend { font-size: .9rem !important; color: var(--muted, #4d5a52); display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.nx-key { display: inline-block; width: 14px; height: 14px; border: 1.5px solid var(--nx-ink); vertical-align: -2px; margin-right: 4px; }
.nx-key.live { background: var(--nx-ink); }
.nx-key.soon { background: repeating-linear-gradient(135deg, var(--nx-bg) 0 4px, #cfd8cf 4px 5px); }
.nx-list { margin: 6px 0 12px; }
.nx-list summary { cursor: pointer; font-family: var(--wide, sans-serif); font-weight: 650; padding: 6px 0; }
.nx-cols { list-style: none; padding: 0; margin: 6px 0 0; columns: 3 220px; column-gap: 24px; }
.nx-cols li { break-inside: avoid; padding: 3px 0; font-family: var(--serif, serif); }
.nx-st { font-family: var(--wide, sans-serif); font-size: .72rem; padding: 1px 6px; border: 1px solid var(--nx-ink, #1D2420); white-space: nowrap; }
.nx-st.live { background: var(--nx-ink, #1D2420); color: var(--nx-bg, #EDF1EC); }
.nx-st.soon { border-style: dashed; color: var(--muted, #4d5a52); }
.nx-banner { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; border: 1.5px solid var(--nx-ink, #1D2420); background: var(--nx-bg, #EDF1EC); padding: 10px 12px; margin: 0 0 14px; }
.nx-banner p { margin: 0 !important; flex: 1 1 260px; }
.nx-notify { display: flex; flex-direction: column; gap: 8px; margin: 10px 0 6px; max-width: 760px; }
.nx-notify label { font-family: var(--wide, sans-serif); font-weight: 650; font-size: .92rem; }
.nx-notify .sp-row { display: flex; gap: 0; }
.nx-notify select, .nx-notify input[type="email"] { font: inherit; font-family: var(--serif, serif); font-size: 1rem; padding: 10px; border: 1.5px solid var(--nx-ink, #1D2420); border-right: 0; border-radius: 0; background: #fff; color: var(--nx-ink, #1D2420); min-width: 0; }
.nx-notify input[type="email"] { flex: 1 1 auto; }
.nx-notify .btn { border-radius: 0; min-height: 44px; white-space: nowrap; }
.nx-notify .nx-consent { font-family: var(--serif, serif); font-weight: 400; font-size: .9rem; display: flex; gap: 8px; align-items: flex-start; }
.nx-notify .nx-consent input { margin-top: 4px; width: 18px; height: 18px; flex: 0 0 auto; }
.nx-notify-msg { min-height: 1.2em; margin: 0 !important; font-size: .92rem !important; }
.nx-fallback { font-family: var(--wide, sans-serif) !important; font-size: .9rem !important; color: var(--muted, #4d5a52); margin: 8px 0 0 !important; }

/* state and county pages */
.nx .nx-change { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; margin: 0 0 14px; }
.nx .nx-change-form { display: flex; align-items: center; gap: 8px; }
.nx .nx-change-form label { font-family: var(--wide); font-size: .82rem; font-weight: 650; }
.nx .nx-change-form select { font: inherit; font-family: var(--serif); padding: 8px; border: 1.5px solid var(--ink); border-radius: 0; background: #fff; color: var(--ink); max-width: 60vw; }
.nx .nx-change-form .btn { border-radius: 0; min-height: 40px; }
.nx .nx-all { font-family: var(--wide); font-size: .82rem; }
.nx .nx-cover { border: 1.5px solid var(--ink); background: var(--card, #fff); padding: 16px 18px; margin: 0 0 24px; }
.nx .nx-cover.soon { border-style: dashed; }
.nx .nx-cover h2 { font-size: 1.1rem; }
.nx .nx-cover p { max-width: 80ch; }
.nx .nx-cols { columns: 3 230px; }
.nx .moe { color: var(--muted); font-size: .85em; white-space: nowrap; }
.nx .nx-race { margin: 12px 0; }
.nx .nx-race summary { cursor: pointer; font-family: var(--wide); font-weight: 650; padding: 6px 0; }

@media (max-width: 720px) {
  .nx-map { gap: 2px; }
  .nx-tile { border-width: 1px; }
  .nx-notify .sp-row { flex-direction: column; }
  .nx-notify select, .nx-notify input[type="email"] { border-right: 1.5px solid var(--nx-ink, #1D2420); border-bottom: 0; }
  .nx .nx-change-form { width: 100%; }
  .nx .nx-change-form select { flex: 1 1 auto; max-width: none; }
}
.nx-removal { display: grid; gap: 12px; max-width: 720px; border: 1.5px solid var(--ink, #1D2420); background: var(--card, #fff); padding: 18px; margin: 16px 0; }
.nx-removal label { display: block; font-family: var(--wide); font-weight: 650; font-size: .88rem; margin-bottom: 4px; }
.nx-removal input, .nx-removal select, .nx-removal textarea { width: 100%; font: inherit; font-family: var(--serif); font-size: 1rem; padding: 10px; border: 1.5px solid var(--ink); border-radius: 0; background: #fff; color: var(--ink); box-sizing: border-box; }
.nx-removal .nx-two { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.nx-removal .btn { justify-self: start; border-radius: 0; min-height: 44px; }
.nx-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.nx-confirmed { border: 1.5px solid var(--ink); padding: 10px 12px; background: var(--bg); }
@media (max-width: 720px) { .nx-removal .nx-two { grid-template-columns: 1fr; } }
@media (min-width: 900px) {
  .nx-picker { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 500px); column-gap: 28px; align-items: start; }
  .nx-picker > .nx-map { grid-column: 2; grid-row: 1 / span 6; margin-top: 4px; }
  .nx-picker > :not(.nx-map) { grid-column: 1; }
}
