:root {
  --pine: #143528;
  --pine-deep: #0c241c;
  --needle: #1e4d36;
  --water: #1f6f8f;
  --water-deep: #164e66;
  --mist: #e7eef0;
  --foam: #f7fbfb;
  --card: #ffffff;
  --ink: #1a2822;
  --muted: #5d6e66;
  --line: #d3e0dc;
  --link: #1c4334;
  --err: #8a1f12;
}
* { box-sizing: border-box; }
body {
  margin: 0;
  font: 17px/1.5 "Segoe UI", system-ui, -apple-system, sans-serif;
  color: var(--ink);
  background:
    radial-gradient(900px 280px at 10% -40px, rgba(20, 53, 40, 0.2), transparent 60%),
    radial-gradient(700px 240px at 100% 0, rgba(31, 111, 143, 0.14), transparent 55%),
    var(--mist);
}
.top {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 1rem;
  justify-content: space-between;
  align-items: center;
  padding: 0.32rem clamp(0.9rem, 2.5vw, 2rem);
  background: var(--pine-deep);
  color: #f4faf6;
}
.brand {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  color: #f4faf6;
  text-decoration: none;
}
.mark { width: 24px; height: 21px; flex: none; }
.brand strong { display: block; font-size: 0.95rem; line-height: 1.1; letter-spacing: 0.01em; }
.brand small {
  display: block;
  color: #b7d4c4;
  font-size: 0.62rem;
  line-height: 1.15;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.nav-toggle {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.nav-btn { display: none; }
nav { display: flex; flex-wrap: wrap; gap: 0.35rem; }
nav a {
  color: #e7f3ec;
  text-decoration: none;
  padding: 0.18rem 0.55rem;
  border-radius: 999px;
}
nav a:hover,
nav a:focus {
  color: #ffffff;
  background: rgba(255, 255, 255, 0.14);
}
nav a[aria-current="page"] {
  color: #ffffff;
  background: rgba(159, 212, 228, 0.22);
  box-shadow: inset 0 -2px 0 #9fd4e4;
}
.wrap {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0.7rem clamp(0.9rem, 2.5vw, 2rem) 2rem;
}
.wrap-wide { max-width: none; }
.hero { margin: 0 0 0.55rem; }
.eyebrow {
  margin: 0 0 0.35rem;
  color: var(--water-deep);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
h1 {
  font-family: Palatino, "Iowan Old Style", "Palatino Linotype", serif;
  font-size: 1.5rem;
  font-weight: 600;
  letter-spacing: -0.01em;
  line-height: 1.2;
  margin: 0 0 0.15rem;
  color: var(--pine-deep);
}
h2 {
  font-size: 1.12rem;
  line-height: 1.25;
  margin: 0.85rem 0 0.35rem;
}
h2 a.meta {
  font-family: "Segoe UI", system-ui, sans-serif;
  font-size: 0.85rem;
  font-weight: 500;
  margin-left: 0.55rem;
}
.lede, .crumb, .meta, .foot { color: var(--muted); }
.lede { margin: 0 0 0.45rem; }
.crumb { font-size: 0.9rem; margin: 0 0 0.35rem; }
.card, .tile, .lake-card {
  background: var(--card);
  border: 1px solid var(--line);
  border-top: 3px solid var(--water);
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(18, 40, 31, 0.04);
}
.card { padding: 1rem 1.05rem; }
.stats { list-style: none; padding: 0; margin: 0; }
.stats li { padding: 0.55rem 0; border-bottom: 1px solid var(--line); }
.stats li:last-child { border: 0; }
.label { display: block; color: var(--muted); font-size: 0.82rem; letter-spacing: 0.04em; text-transform: uppercase; }
.table { width: 100%; border-collapse: collapse; background: var(--card); border-radius: 12px; overflow: hidden; }
.table th, .table td { text-align: left; padding: 0.6rem 0.7rem; border-bottom: 1px solid var(--line); vertical-align: top; }
.table th { color: var(--pine); font-size: 0.78rem; letter-spacing: 0.06em; text-transform: uppercase; background: #f3f8f6; }
.table tr:last-child td { border-bottom: 0; }
.table tbody tr:hover { background: #f3faf8; }
a { color: var(--link); }
a:hover { color: var(--water-deep); }
.form { max-width: 26rem; }
.form.find {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  max-width: 32rem;
  margin: 0.4rem auto 0.7rem;
  padding: 0.4rem 0.45rem;
}
.form.find input { flex: 1 1 auto; width: auto; min-width: 0; margin: 0; }
.form.find button { margin: 0; flex: 0 0 auto; }
.form label { display: block; margin: 0.2rem 0 0.7rem; color: var(--pine); font-weight: 600; }
.form input {
  display: block;
  width: 100%;
  margin-top: 0.35rem;
  padding: 0.7rem 0.75rem;
  font: inherit;
  font-weight: 400;
  color: var(--ink);
  background: var(--foam);
  border: 1px solid var(--line);
  border-radius: 8px;
}
.form input:focus { outline: 2px solid rgba(31, 111, 143, 0.35); border-color: var(--water); }
button {
  margin-top: 0.2rem;
  padding: 0.6rem 1.05rem;
  font: inherit;
  font-weight: 650;
  background: var(--pine);
  color: #f4faf6;
  border: 0;
  border-radius: 8px;
  cursor: pointer;
}
button:hover { background: var(--needle); }
.err { color: var(--err); }
.foot {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0 clamp(0.9rem, 2.5vw, 2rem) 2.2rem;
  font-size: 0.85rem;
}
.foot p { margin: 0.2rem 0; }

.tiles { display: grid; gap: 0.75rem; grid-template-columns: 1fr; }
@media (min-width: 700px) {
  .tiles { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 1100px) {
  .tiles { grid-template-columns: 1fr 1fr 1fr 1fr; }
}
.tile { padding: 0.95rem 1rem 1rem; }
.tile .num { font-size: 1.45rem; font-weight: 700; margin: 0.2rem 0 0.25rem; color: var(--pine-deep); }
.tile .num.long { font-size: 1.05rem; line-height: 1.3; }
.tile details { margin-top: 0.35rem; }

.lake-head { margin-bottom: 0.5rem; }
.lake-head .lede { margin: 0; }
.facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 10px;
  overflow: hidden;
}
.fact {
  display: block;
  min-width: 0;
  padding: 0.36rem 0.65rem 0.4rem;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  color: inherit;
  text-decoration: none;
}
.fact:nth-child(3n) { border-right: 0; }
a.fact:hover { background: #f3faf8; }
.fact .k {
  margin: 0;
  color: var(--water-deep);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.fact .v {
  margin: 0.06rem 0 0;
  font-size: 1.18rem;
  font-weight: 700;
  line-height: 1.12;
  color: var(--pine-deep);
  font-variant-numeric: tabular-nums;
}
.fact .v span {
  display: block;
  margin-top: 0.04rem;
  color: var(--muted);
  font-size: 0.7rem;
  font-weight: 550;
  letter-spacing: 0;
  line-height: 1.2;
}
.fact .v.sm {
  font-size: 0.98rem;
  font-weight: 650;
  line-height: 1.25;
}
.lake-block {
  margin-top: 0.7rem;
  padding: 0.65rem 0.85rem 0.75rem;
}
.lake-block h2 { margin: 0 0 0.2rem; }
.lake-block .lede { margin: 0 0 0.3rem; font-size: 0.92rem; }
#ice, #landings { scroll-margin-top: 0.5rem; }
@media (min-width: 1100px) {
  .facts { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .fact:nth-child(3n) { border-right: 1px solid var(--line); }
  .fact:nth-child(6n) { border-right: 0; }
  .facts .fact { border-bottom: 0; }
}
.lake-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.85rem;
}
@media (min-width: 700px) {
  .lake-grid { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 1100px) {
  .lake-grid { grid-template-columns: 1fr 1fr 1fr 1fr; }
}
.lake-card { padding: 1rem 1.15rem 1.1rem; min-height: 7.5rem; }
.lake-card .k {
  margin: 0;
  color: var(--water-deep);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.lake-card .v {
  margin: 0.35rem 0 0.3rem;
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1.15;
  color: var(--pine-deep);
}
.lake-card .v.sm { font-size: 1.15rem; }
.lake-card .s { margin: 0; color: var(--muted); font-size: 0.88rem; }
.me-map {
  height: 70vh;
  min-height: 420px;
  margin-top: 0.75rem;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #d7e6ea;
  box-shadow: 0 8px 24px rgba(18, 40, 31, 0.04);
}
.leaflet-container { font: inherit; }
details summary { cursor: pointer; color: var(--muted); font-size: 0.9rem; }
details p { margin: 0.35rem 0 0; }
.table.slim th, .table.slim td { padding: 0.35rem 0.6rem; font-size: 0.92rem; }
.table.slim { margin-top: 0.2rem; }
code { font-size: 0.92em; color: var(--pine); }

@media (max-width: 800px) {
  .top { align-items: center; }
  .nav-btn {
    display: inline-block;
    margin-left: auto;
    padding: 0.45rem 0.8rem;
    color: #f4faf6;
    border: 1px solid rgba(255, 255, 255, 0.35);
    border-radius: 8px;
    font-weight: 650;
    cursor: pointer;
  }
  nav { display: none; width: 100%; flex-direction: column; gap: 0.15rem; }
  .nav-toggle:checked ~ nav { display: flex; }
  .nav-toggle:checked ~ .nav-btn { background: rgba(255, 255, 255, 0.14); }
  nav a {
    display: block;
    padding: 0.7rem 0.35rem;
    border-radius: 8px;
    font-size: 1.05rem;
  }
  .table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .form input, button { font-size: 1rem; }
}

img, svg, video, iframe { max-width: 100%; height: auto; }
.form input { font-size: 16px; }
button { min-height: 44px; }


.lake-list {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 12px;
  overflow: hidden;
}
.home-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.15rem 1.1rem;
  align-items: start;
}
@media (max-width: 700px) {
  .home-grid { grid-template-columns: 1fr; }
}
.hero h1 {
  font-size: 2rem;
  letter-spacing: -0.02em;
}
.hero .lede {
  max-width: 36rem;
  font-size: 1.05rem;
  line-height: 1.45;
}
.home-panel {
  background: var(--tone-wash);
  border: 1px solid var(--tone-line);
  border-top: 5px solid var(--tone);
  border-radius: 12px;
  padding: 0.65rem 0.7rem 0.75rem;
}
.home-panel h2 {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.6rem;
  margin: 0 0 0.45rem;
  font-family: Palatino, "Iowan Old Style", "Palatino Linotype", serif;
  font-size: 1.45rem;
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.15;
  color: var(--tone-deep);
}
.home-panel h2 a.meta {
  margin-left: 0;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--tone);
  text-decoration: none;
  white-space: nowrap;
}
.home-panel h2 a.meta:hover { text-decoration: underline; }
.home-empty {
  margin: 0;
  padding: 0.7rem 0.75rem;
  color: var(--muted);
  background: var(--tone-wash);
  border: 1px solid var(--tone-line);
  border-radius: 12px;
}
.home-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  background: #fff;
  border: 1px solid var(--tone-line);
  border-radius: 12px;
  overflow: hidden;
}
.home-table th,
.home-table td {
  text-align: left;
  padding: 0.42rem 0.72rem;
  vertical-align: baseline;
}
.home-table th {
  background: var(--tone);
  color: #f7fbf8;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  border-bottom: 0;
}
.home-table th:last-child,
.home-table td.fig { text-align: right; }
.home-table td {
  border-top: 1px solid var(--tone-line);
  font-size: 1.02rem;
}
.home-table tbody tr:first-child td { border-top: 0; }
.home-table tbody tr:hover { background: var(--tone-wash); }
.home-table a {
  color: var(--ink);
  font-weight: 650;
  text-decoration: none;
}
.home-table a:hover { color: var(--tone); text-decoration: underline; }
.home-table .fig {
  font-variant-numeric: tabular-nums;
  font-weight: 650;
  font-size: 0.95rem;
  color: var(--tone-deep);
  white-space: nowrap;
}
.home-table .unit {
  margin-left: 0.22rem;
  color: var(--tone);
  font-size: 0.64rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}
.tone-water {
  --tone: #1a6f92;
  --tone-deep: #134e68;
  --tone-head: #1a6f92;
  --tone-wash: #e7f4fa;
  --tone-line: #b7d6e6;
}
.tone-pine {
  --tone: #1e4d36;
  --tone-deep: #143528;
  --tone-head: #1e4d36;
  --tone-wash: #e7f2eb;
  --tone-line: #b7d2c2;
}
.tone-stone {
  --tone: #8a5424;
  --tone-deep: #633b18;
  --tone-head: #8a5424;
  --tone-wash: #f8efe4;
  --tone-line: #e0c7aa;
}
.tone-dusk {
  --tone: #4c4678;
  --tone-deep: #332e58;
  --tone-head: #4c4678;
  --tone-wash: #eeeaf6;
  --tone-line: #cfc8e2;
}
.tone-field {
  --tone: #6d5e1c;
  --tone-deep: #4d4214;
  --tone-head: #6d5e1c;
  --tone-wash: #f7f1d8;
  --tone-line: #e0d3a4;
}
.tone-shore {
  --tone: #1c6e82;
  --tone-deep: #0f4554;
  --tone-head: #1c6e82;
  --tone-wash: #e7f4f6;
  --tone-line: #b7d4de;
}
.tone-slate {
  --tone: #3d555c;
  --tone-deep: #2a3c42;
  --tone-head: #3d555c;
  --tone-wash: #e7eef0;
  --tone-line: #c5d3d8;
}
.home-snap {
  width: fit-content;
  max-width: 100%;
  margin: 1.15rem auto 0;
}
.home-snap .snap-list {
  width: max-content;
  max-width: 100%;
  background: #fff;
  border: 1px solid var(--tone-line);
  border-radius: 12px;
}
.home-snap .snap-item { border-bottom-color: var(--tone-line); }
.home-snap .snap-title,
.home-snap .snap-value,
.home-snap .snap-asof { white-space: nowrap; }
.home-snap .snap-value { color: var(--tone-deep); }
.mtn-map {
  max-width: 36rem;
  margin: 0.8rem 0 0.45rem;
}
.mtn-map iframe {
  display: block;
  width: 100%;
  height: 280px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--card);
}
.mtn-map figcaption {
  margin: 0.35rem 0 0;
  color: var(--muted);
  font-size: 0.75rem;
}
.lake-item {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(7rem, 0.8fr) auto;
  gap: 0.2rem 0.85rem;
  align-items: baseline;
  padding: 0.4rem 0.75rem;
  border-bottom: 1px solid var(--line);
}
.lake-item:last-child { border-bottom: 0; }
.lake-item:hover { background: #f3faf8; }
.lake-item-name {
  font-weight: 650;
  font-size: 1.05rem;
}
.lake-item-meta {
  display: contents;
}
.lake-item-county { color: var(--link); }
.lake-item-acres {
  font-variant-numeric: tabular-nums;
  text-align: right;
  white-space: nowrap;
}
.lake-item-acres span {
  color: var(--muted);
  font-size: 0.75rem;
  font-weight: 650;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  margin-left: 0.3rem;
}


.snap-list {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 12px;
  overflow: hidden;
}
.snap-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 0.2rem 0.85rem;
  align-items: baseline;
  padding: 0.4rem 0.75rem;
  border-bottom: 1px solid var(--line);
}
.snap-item:last-child { border-bottom: 0; }
.snap-title { margin: 0; font-weight: 650; }
.snap-meta { display: contents; }
.snap-value {
  font-variant-numeric: tabular-nums;
  font-weight: 650;
  color: var(--pine-deep);
  white-space: nowrap;
}
.snap-asof {
  color: var(--muted);
  font-size: 0.82rem;
  white-space: nowrap;
}


.dir {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 12px;
  overflow: hidden;
}
.dir-head, .dir-row {
  display: grid;
  gap: 0.2rem 0.7rem;
  align-items: baseline;
  padding: 0.38rem 0.7rem;
  border-bottom: 1px solid var(--line);
}
.dir-head {
  color: var(--pine);
  font-size: 0.78rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  background: #f3f8f6;
  font-weight: 700;
}
.dir-row:last-child { border-bottom: 0; }
.dir-row:hover { background: #f3faf8; }
.dir-name { font-weight: 650; }
.dir-num {
  font-variant-numeric: tabular-nums;
  text-align: right;
  white-space: nowrap;
}
.dir-unit { display: none; }
.dir-lakes .dir-head, .dir-lakes .dir-row {
  grid-template-columns: minmax(9rem, 1.5fr) minmax(7rem, 1fr) 6.6rem 6.2rem minmax(8rem, 1.15fr);
}
.dir-counties .dir-head, .dir-counties .dir-row {
  grid-template-columns: minmax(8rem, 1.4fr) minmax(7rem, 1fr) 8.5rem;
}
.dir-rivers .dir-head, .dir-rivers .dir-row {
  grid-template-columns: minmax(8rem, 1.25fr) 5.4rem minmax(7rem, 1fr) minmax(7rem, 1fr) minmax(8rem, 1.15fr);
}
.dir-towns .dir-head, .dir-towns .dir-row {
  grid-template-columns: minmax(8rem, 1.4fr) 7.2rem minmax(7rem, 1fr) 8.5rem;
}
.dir-mtns .dir-head, .dir-mtns .dir-row {
  grid-template-columns: minmax(9rem, 1.4fr) minmax(7rem, 1fr) 6.4rem;
}
.dir-lakes .dir-head span:nth-child(3),
.dir-lakes .dir-acres,
.dir-lakes .dir-head span:nth-child(4),
.dir-lakes .dir-depth,
.dir-rivers .dir-head span:nth-child(2),
.dir-rivers .dir-miles,
.dir-counties .dir-head span:nth-child(3),
.dir-counties .dir-num,
.dir-towns .dir-head span:nth-child(4),
.dir-towns .dir-num,
.dir-mtns .dir-head span:nth-child(3),
.dir-mtns .dir-elev {
  text-align: center;
}
.sheet {
  max-width: 40rem;
  margin: 0 auto;
}
.sheet h1,
.sheet .lede,
.sheet h2 { text-align: center; }
.sheet .form.find { margin-left: auto; margin-right: auto; }
.dir-place { max-width: 40rem; }
.dir-counties, .dir-towns { margin-left: auto; margin-right: auto; }
.county-pair {
  display: grid;
  gap: 1.2rem;
}
.dir-county-rivers { max-width: 42rem; }
@media (min-width: 900px) {
  .county-pair { grid-template-columns: 1fr 1fr; align-items: start; }
  .county-pair .dir-county-places,
  .county-pair .dir-county-lakes { max-width: none; }
}
.dir-county-places .dir-type {
  display: block;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 500;
  margin-top: 0.08rem;
}
.dir-county-places .dir-head,
.dir-county-places .dir-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: baseline;
}
.dir-county-rivers .dir-head,
.dir-county-rivers .dir-row {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) 5.5rem minmax(7rem, 1fr);
  align-items: baseline;
}
.dir-county-lakes .dir-head,
.dir-county-lakes .dir-row {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) 6.5rem minmax(8rem, 1.1fr);
  align-items: baseline;
}
.dir-county-places .dir-num,
.dir-county-rivers .dir-miles,
.dir-county-lakes .dir-acres {
  text-align: right;
}
.dir-county-rivers .dir-flow,
.dir-county-lakes .dir-drains {
  text-align: left;
}

@media (max-width: 800px) {
  .top, .wrap, .foot {
    padding-left: max(0.9rem, env(safe-area-inset-left));
    padding-right: max(0.9rem, env(safe-area-inset-right));
  }
  .form button { display: block; width: 100%; }
  .form.find { max-width: none; }
  .form.find button { display: inline-block; width: auto; }
  h1 { font-size: 1.35rem; }
  h2 { font-size: 1.2rem; overflow-wrap: anywhere; }
  .lake-card .v { font-size: 1.45rem; overflow-wrap: anywhere; }
  .facts { grid-template-columns: 1fr 1fr; }
  .fact { padding: 0.4rem 0.55rem 0.42rem; }
  .fact:nth-child(3n) { border-right: 1px solid var(--line); }
  .fact:nth-child(2n) { border-right: 0; }
  .fact .v { font-size: 1.08rem; overflow-wrap: anywhere; }
  .fact .v.sm { font-size: 0.95rem; }
  .me-map { height: 62vh; min-height: 280px; }
  .table {
    display: block;
    background: transparent;
    border-radius: 0;
    overflow: visible;
  }
  .table thead { display: none; }
  .table tbody, .table tr { display: block; }
  .table tr {
    margin: 0 0 0.75rem;
    background: var(--card);
    border: 1px solid var(--line);
    border-top: 3px solid var(--water);
    border-radius: 12px;
    overflow: hidden;
  }
  .table td {
    display: grid;
    grid-template-columns: 6.6rem minmax(0, 1fr);
    gap: 0.35rem 0.7rem;
    align-items: start;
    padding: 0.55rem 0.8rem;
    border-bottom: 1px solid var(--line);
    overflow-wrap: anywhere;
  }
  .table td::before {
    content: attr(data-label);
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
  }
  .table td.note, .table td[colspan] {
    display: block;
    grid-template-columns: none;
  }
  .table td.note::before, .table td[colspan]::before { content: none; }
  .table tr td:last-child { border-bottom: 0; }
  .table.slim td { font-size: 0.95rem; }

  .lake-list {
    background: transparent;
    border: 0;
    border-radius: 0;
    overflow: visible;
  }
  .lake-item {
    display: block;
    margin: 0 0 0.65rem;
    padding: 0.8rem 0.95rem 0.75rem;
    background: var(--card);
    border: 1px solid var(--line);
    border-top: 3px solid var(--water);
    border-radius: 12px;
  }
  .lake-item:hover { background: var(--card); }
  .lake-item-name {
    display: block;
    margin: 0 0 0.35rem;
    font-family: Palatino, "Iowan Old Style", "Palatino Linotype", serif;
    font-size: 1.35rem;
    font-weight: 600;
    line-height: 1.15;
    letter-spacing: -0.01em;
  }
  .lake-item-meta {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 0.75rem;
  }
  .lake-item-county {
    font-size: 0.98rem;
  }
  .lake-item-acres {
    color: var(--pine-deep);
    font-weight: 650;
    font-size: 1.02rem;
  }


  .snap-list {
    background: transparent;
    border: 0;
    border-radius: 0;
    overflow: visible;
  }
  .home-snap {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
  }
  .home-snap .snap-list {
    width: 100%;
    max-width: 100%;
  }
  .home-snap .snap-title,
  .home-snap .snap-value,
  .home-snap .snap-asof {
    white-space: normal;
  }
  .snap-item {
    display: block;
    margin: 0 0 0.65rem;
    padding: 0.8rem 0.95rem 0.75rem;
    background: var(--card);
    border: 1px solid var(--line);
    border-top: 3px solid var(--water);
    border-radius: 12px;
  }
  .snap-title {
    font-size: 1.05rem;
    line-height: 1.3;
    margin: 0 0 0.35rem;
    overflow-wrap: anywhere;
  }
  .snap-meta {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 0.75rem;
  }
  .snap-value { font-size: 1.2rem; }
  .snap-asof { font-size: 0.82rem; }

  .dir {
    background: transparent;
    border: 0;
    border-radius: 0;
    overflow: visible;
  }
  .dir-head { display: none; }
  .dir-row {
    display: grid;
    margin: 0 0 0.65rem;
    padding: 0.8rem 0.95rem 0.75rem;
    background: var(--card);
    border: 1px solid var(--line);
    border-top: 3px solid var(--water);
    border-radius: 12px;
  }
  .dir-row:hover { background: var(--card); }
  .dir-name {
    font-family: Palatino, "Iowan Old Style", "Palatino Linotype", serif;
    font-size: 1.28rem;
    font-weight: 600;
    line-height: 1.15;
    letter-spacing: -0.01em;
  }
  .dir-num {
    color: var(--pine-deep);
    font-weight: 650;
    font-size: 1.02rem;
  }
  .dir-unit {
    display: inline;
    color: var(--muted);
    font-size: 0.75rem;
    font-weight: 650;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    margin-left: 0.28rem;
  }
  .is-blank { display: none; }
  .dir-lakes .dir-row {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "name name" "county acres" "depth depth" "drains drains";
  }
  .dir-lakes .dir-name { grid-area: name; margin-bottom: 0.28rem; }
  .dir-lakes .dir-county { grid-area: county; }
  .dir-lakes .dir-acres { grid-area: acres; }
  .dir-lakes .dir-depth, .dir-lakes .dir-drains {
    color: var(--muted);
    font-size: 0.92rem;
    margin-top: 0.15rem;
  }
  .dir-lakes .dir-depth { grid-area: depth; }
  .dir-lakes .dir-drains { grid-area: drains; }
  .dir-lakes .dir-drains::before { content: "drains toward "; }
  .dir-counties .dir-row {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "name name" "seat pop";
  }
  .dir-counties .dir-name { grid-area: name; margin-bottom: 0.28rem; }
  .dir-counties .dir-seat { grid-area: seat; }
  .dir-counties .dir-seat::after { content: ", seat"; color: var(--muted); }
  .dir-counties .dir-num { grid-area: pop; }
  .dir-rivers .dir-row {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "name miles" "from from" "to to" "flow flow";
  }
  .dir-rivers .dir-name { grid-area: name; }
  .dir-rivers .dir-miles { grid-area: miles; }
  .dir-rivers .dir-from, .dir-rivers .dir-to, .dir-rivers .dir-flow {
    color: var(--muted);
    font-size: 0.92rem;
    margin-top: 0.12rem;
  }
  .dir-rivers .dir-from { grid-area: from; }
  .dir-rivers .dir-from::before { content: "from "; }
  .dir-rivers .dir-to { grid-area: to; }
  .dir-rivers .dir-to::before { content: "to "; }
  .dir-rivers .dir-flow { grid-area: flow; }
  .dir-towns .dir-row {
    grid-template-columns: auto auto minmax(0, 1fr) auto;
    grid-template-areas: "name name name name" "type county . pop";
  }
  .dir-towns .dir-name { grid-area: name; margin-bottom: 0.28rem; }
  .dir-towns .dir-type { grid-area: type; color: var(--muted); }
  .dir-towns .dir-type::after { content: " ·"; color: var(--muted); }
  .dir-towns .dir-county { grid-area: county; }
  .dir-towns .dir-num { grid-area: pop; }
  .dir-place .dir-row {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "name name" "acres depth";
  }
  .dir-place .dir-name { grid-area: name; margin-bottom: 0.28rem; }
  .dir-place .dir-acres { grid-area: acres; }
  .dir-place .dir-depth { grid-area: depth; text-align: right; }
  .dir-mtns .dir-row {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "name name" "town elev";
  }
  .dir-mtns .dir-name { grid-area: name; margin-bottom: 0.28rem; }
  .dir-mtns .dir-town { grid-area: town; }
  .dir-mtns .dir-elev { grid-area: elev; }

  .desk-col { display: none; }
  .dir-county-places,
  .dir-county-rivers,
  .dir-county-lakes {
    max-width: none;
  }
  .dir-county-places .dir-row,
  .dir-county-rivers .dir-row,
  .dir-county-lakes .dir-row {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "name num";
  }
  .dir-county-places .dir-name,
  .dir-county-rivers .dir-name,
  .dir-county-lakes .dir-name { grid-area: name; }
  .dir-county-places .dir-num,
  .dir-county-rivers .dir-miles,
  .dir-county-lakes .dir-acres { grid-area: num; }
}

.foot-links { margin: 0 0 0.45rem; }
.foot-links a { font-weight: 650; }
.suggest-frame {
  display: block;
  width: 100%;
  min-height: 720px;
  border: 0;
  border-radius: 12px;
  background: #fff;
}

.flow-chart { margin: 0.35rem 0 1rem; }
.flow-chart svg { max-width: 100%; }

.ice-chart { position: relative; margin: 0.1rem 0 0; }
.ice-tip {
  position: absolute;
  z-index: 2;
  transform: translate(-50%, -130%);
  margin: 0;
  background: var(--pine-deep);
  color: #f4faf6;
  font-size: 0.82rem;
  line-height: 1.3;
  padding: 0.18rem 0.45rem;
  border-radius: 6px;
  pointer-events: none;
  white-space: nowrap;
}
.ice-table { max-width: 34rem; margin-left: auto; margin-right: auto; }

.facts-county { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.fact-notes { margin: 0.4rem 0 0; }
.fact-notes summary { cursor: pointer; color: var(--muted); font-size: 0.85rem; }
.fact-notes ul { margin: 0.4rem 0 0; padding-left: 1.1rem; color: var(--muted); font-size: 0.88rem; }
.fact-notes li { margin: 0.2rem 0; }
.fact-notes strong { color: var(--ink); font-weight: 650; }
#places, #rivers, #lakes, #mountains { scroll-margin-top: 0.5rem; }
.dir-counties .dir-head, .dir-counties .dir-row { padding: 0.38rem 0.72rem; }
@media (min-width: 1100px) {
  .facts-county { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .facts-county .fact { border-bottom: 1px solid var(--line); }
  .facts-county .fact:nth-child(3n) { border-right: 1px solid var(--line); }
  .facts-county .fact:nth-child(6n) { border-right: 0; }
}
.place-top { margin: 0 0 0.55rem; }
.place-top h1 { margin-bottom: 0.15rem; }
.place-top .lede { margin: 0; }
.facts-place { grid-template-columns: 1fr 1fr; }
.facts-place .fact:nth-child(3n) { border-right: 1px solid var(--line); }
.facts-place .fact:nth-child(2n) { border-right: 0; }
.place-body {
  display: grid;
  gap: 0.75rem;
  margin-top: 0.7rem;
}
.place-body .dir-place { max-width: none; }
.place-side {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 0.65rem 0.75rem 0.75rem;
}
.place-side h2 { margin: 0 0 0.35rem; font-size: 1.05rem; }
.year-strip {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0.35rem;
}
.year-chip {
  min-width: 0;
  padding: 0.28rem 0.3rem 0.32rem;
  background: var(--foam);
  border: 1px solid var(--line);
  border-radius: 7px;
  text-align: center;
}
.year-chip span {
  display: block;
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.04em;
}
.year-chip strong {
  display: block;
  color: var(--pine-deep);
  font-size: 0.95rem;
  font-variant-numeric: tabular-nums;
}
.year-chip.is-latest { border-color: var(--water); background: #f3fafc; }
@media (min-width: 900px) {
  .facts-place { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .facts-place .fact:nth-child(2n) { border-right: 1px solid var(--line); }
  .facts-place .fact:nth-child(6n) { border-right: 0; }
  .place-body { grid-template-columns: minmax(0, 1.45fr) minmax(16rem, 0.7fr); align-items: start; }
  .place-side { position: sticky; top: 0.6rem; }
}
@media (max-width: 800px) {
  .facts-county { grid-template-columns: 1fr 1fr; }
  .dir-counties {
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: 10px;
    overflow: hidden;
  }
  .dir-counties .dir-head { display: none; }
  .dir-counties .dir-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "name pop" "seat pop";
    align-items: center;
    gap: 0.05rem 0.75rem;
    margin: 0;
    padding: 0.42rem 0.7rem;
    background: transparent;
    border: 0;
    border-bottom: 1px solid var(--line);
    border-radius: 0;
  }
  .dir-counties .dir-row:last-child { border-bottom: 0; }
  .dir-counties .dir-row:hover { background: #f3faf8; }
  .dir-counties .dir-name {
    grid-area: name;
    margin: 0;
    font-family: "Segoe UI", system-ui, sans-serif;
    font-size: 1rem;
    font-weight: 650;
    line-height: 1.2;
    letter-spacing: 0;
  }
  .dir-counties .dir-seat {
    grid-area: seat;
    font-size: 0.8rem;
  }
  .dir-counties .dir-num {
    grid-area: pop;
    align-self: center;
    font-size: 0.92rem;
  }
  .table.stay {
    display: table;
    width: 100%;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: 10px;
    overflow: hidden;
  }
  .table.stay thead { display: table-header-group; }
  .table.stay tbody { display: table-row-group; }
  .table.stay tr {
    display: table-row;
    margin: 0;
    background: transparent;
    border: 0;
    border-radius: 0;
  }
  .table.stay th, .table.stay td {
    display: table-cell;
    padding: 0.4rem 0.55rem;
    border-bottom: 1px solid var(--line);
  }
  .table.stay th:last-child,
  .table.stay td:last-child {
    text-align: right;
    white-space: nowrap;
    width: 1%;
  }
  .table.stay td::before { content: none; }
}

.banner {
  max-width: 36rem;
  margin: 0 0 1.15rem;
}
.banner img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  object-position: center 42%;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 12px;
}
.banner figcaption {
  margin: 0.35rem 0 0;
  color: var(--muted);
  font-size: 0.75rem;
}

.mtn-wrap {
  max-width: 46rem;
  margin: 0.2rem auto 0;
}
.mtn-note { max-width: 46rem; margin-left: auto; margin-right: auto; }
.mtn-wrap .table { margin: 0; }
.mtn-wrap td:last-child, .mtn-wrap th:last-child {
  text-align: right;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.pager {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  align-items: center;
  margin: 0.75rem 0 0.2rem;
}
.pager a, .pager span {
  display: inline-block;
  min-width: 2rem;
  padding: 0.28rem 0.55rem;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card);
  text-align: center;
  text-decoration: none;
}
.pager span[aria-current="page"] {
  background: var(--pine);
  color: #f4faf6;
  border-color: var(--pine);
}

body.theme-water {
  --pine: #1a6f92;
  --pine-deep: #0e3d52;
  --needle: #1a6f92;
  --water: #1a6f92;
  --water-deep: #134e68;
  --link: #145674;
  --line: #c5dde8;
  --mist: #e7f3f8;
  --muted: #4d6874;
}
body.theme-pine {
  --pine: #1e4d36;
  --pine-deep: #10281c;
  --needle: #1e4d36;
  --water: #1e4d36;
  --water-deep: #143528;
  --link: #1a4330;
  --line: #c5d9cd;
  --mist: #e8f2ec;
  --muted: #4e6558;
}
body.theme-stone {
  --pine: #8a5424;
  --pine-deep: #4e3014;
  --needle: #8a5424;
  --water: #8a5424;
  --water-deep: #633b18;
  --link: #6e431c;
  --line: #e4d0ba;
  --mist: #f8f1e8;
  --muted: #6f5b48;
}
body.theme-dusk {
  --pine: #4c4678;
  --pine-deep: #28244a;
  --needle: #4c4678;
  --water: #4c4678;
  --water-deep: #332e58;
  --link: #3d3868;
  --line: #d4cee6;
  --mist: #f1eef7;
  --muted: #5d5874;
}
body.theme-field {
  --pine: #6d5e1c;
  --pine-deep: #3e3510;
  --needle: #6d5e1c;
  --water: #6d5e1c;
  --water-deep: #4d4214;
  --link: #5a4d16;
  --line: #e4d7ae;
  --mist: #f8f4e4;
  --muted: #6c6344;
}
body.theme-slate {
  --pine: #3d555c;
  --pine-deep: #24383e;
  --needle: #3d555c;
  --water: #3d555c;
  --water-deep: #2a3c42;
  --link: #31464c;
  --line: #c9d5d9;
  --mist: #e8eeef;
  --muted: #56666b;
}
body[class^="theme-"] {
  background:
    radial-gradient(900px 280px at 10% -40px, color-mix(in srgb, var(--pine) 20%, transparent), transparent 60%),
    radial-gradient(700px 240px at 100% 0, color-mix(in srgb, var(--water) 12%, transparent), transparent 55%),
    var(--mist);
}
body[class^="theme-"] .top { background: var(--pine-deep); }
body[class^="theme-"] nav a[aria-current="page"] {
  background: color-mix(in srgb, white 18%, transparent);
  box-shadow: inset 0 -2px 0 color-mix(in srgb, white 72%, var(--pine));
}
body[class^="theme-"] .table th,
body[class^="theme-"] .dir-head {
  color: var(--pine-deep);
  background: color-mix(in srgb, var(--pine) 14%, white);
}
body[class^="theme-"] .table tbody tr:hover,
body[class^="theme-"] .lake-item:hover,
body[class^="theme-"] .dir-row:hover,
body[class^="theme-"] a.fact:hover {
  background: color-mix(in srgb, var(--pine) 8%, white);
}
body[class^="theme-"] .card,
body[class^="theme-"] .tile,
body[class^="theme-"] .lake-card,
body[class^="theme-"] .snap-item {
  border-top-color: var(--pine);
}

body.theme-shore {
  --pine: #1c6e82;
  --pine-deep: #0f4554;
  --needle: #1c6e82;
  --water: #1c6e82;
  --water-deep: #145868;
  --link: #145868;
  --line: #c5dde4;
  --mist: #e7f4f6;
  --muted: #4d6870;
}
.table td.is-alert { color: #8a1f12; font-weight: 650; }
.home-table td.is-alert { color: #8a1f12; font-weight: 650; }
a.is-alert { color: #8a1f12; font-weight: 700; }
