/* Lakefront parcel map — page styles (2026-09-24). Uses site.css tokens. */
.map-page .hero.hero--quiet { padding: var(--space-5) 0 var(--space-4); }
.map-page .hero.hero--quiet h1 { max-width: 20ch; }
.map-meta { display: flex; flex-wrap: wrap; gap: .4rem 1.4rem; margin-top: var(--space-3); font-size: .86rem; color: var(--muted); letter-spacing: .01em; }
.map-meta strong { color: var(--ink); font-weight: 600; font-variant-numeric: tabular-nums; }

.lgmap-shell { scroll-margin-top: var(--header-h); position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 360px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: var(--card); }
.lgmap { height: min(78vh, 820px); min-height: 520px; background: #f1ede5; }
.lgmap-side { border-left: 1px solid var(--line); display: flex; flex-direction: column; min-height: 0; height: min(78vh, 820px); min-height: 520px; background: var(--card); }
.lgmap-controls { padding: 1.1rem 1.2rem 1rem; border-bottom: 1px solid var(--line); display: grid; gap: .75rem; }
.lgmap-controls label.lg-lab { display: block; font-size: .68rem; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); margin-bottom: .3rem; font-weight: 600; }
.lg-search { position: relative; }
.lg-search input, .lgmap-controls select { width: 100%; font: inherit; font-size: .95rem; color: var(--ink); background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius-sm); padding: .55rem .7rem; }
.lg-search input:focus, .lgmap-controls select:focus { outline: 2px solid var(--focus); outline-offset: 1px; }
.lg-suggest { position: absolute; z-index: 1200; left: 0; right: 0; top: 100%; margin: 2px 0 0; padding: 0; list-style: none; background: var(--card); border: 1px solid var(--line); border-radius: var(--radius-sm); box-shadow: var(--shadow-lift); max-height: 300px; overflow: auto; }
.lg-suggest[hidden] { display: none; }
.lg-suggest li { padding: .5rem .7rem; cursor: pointer; font-size: .9rem; border-bottom: 1px solid var(--lake-mist); }
.lg-suggest li:last-child { border-bottom: 0; }
.lg-suggest li small { display: block; color: var(--muted); font-size: .76rem; }
.lg-suggest li[aria-selected="true"], .lg-suggest li:hover { background: var(--lake-mist); }
.lg-row { display: grid; grid-template-columns: 1fr; gap: .75rem; }
.lg-toggles { display: grid; gap: .45rem; font-size: .9rem; }
.lg-toggles label { display: flex; align-items: center; gap: .55rem; cursor: pointer; }
.lg-toggles input { accent-color: var(--accent); width: 1rem; height: 1rem; }
.lg-count { font-size: .8rem; color: var(--muted); font-variant-numeric: tabular-nums; }
.lg-count strong { color: var(--ink); }

.lgmap-panel { flex: 1; overflow: auto; padding: 1.2rem 1.2rem 1.4rem; }
.lg-empty { color: var(--muted); font-size: .92rem; line-height: 1.55; }
.lg-empty h2 { font-family: var(--font-serif); color: var(--ink); font-size: 1.15rem; font-weight: 500; margin: 0 0 .5rem; letter-spacing: var(--tracking-tight); }
.lg-legend { list-style: none; padding: 0; margin: 1rem 0 0; display: grid; gap: .5rem; font-size: .84rem; color: var(--ink); }
.lg-legend li { display: flex; align-items: center; gap: .6rem; }
.lg-kicker { font-size: .68rem; letter-spacing: .16em; text-transform: uppercase; color: var(--accent); font-weight: 600; margin: 0 0 .35rem; }
.lg-parcel h2 { font-family: var(--font-serif); font-weight: 500; font-size: 1.4rem; line-height: 1.2; letter-spacing: var(--tracking-tight); margin: 0 0 .2rem; color: var(--ink); }
.lg-parcel .lg-sub { color: var(--muted); font-size: .9rem; margin: 0 0 .9rem; }
.lg-facts { display: grid; grid-template-columns: auto 1fr; gap: .45rem 1rem; margin: 0; font-size: .9rem; border-top: 1px solid var(--line); padding-top: .8rem; }
.lg-facts dt { color: var(--muted); white-space: nowrap; }
.lg-facts dd { margin: 0; color: var(--ink); font-variant-numeric: tabular-nums; }
.lg-facts dd small { color: var(--muted); }
.lg-conf { display: inline-flex; align-items: center; gap: .4rem; }
.lg-feature-link { display: block; margin: 1rem 0 .2rem; padding: .8rem .9rem; border: 1px solid var(--accent); border-radius: var(--radius-sm); color: var(--ink); text-decoration: none; background: var(--paper); }
.lg-feature-link span { display: block; font-size: .66rem; letter-spacing: .16em; text-transform: uppercase; color: var(--accent); font-weight: 600; }
.lg-feature-link:hover { background: var(--lake-mist); }
.lg-src { margin-top: 1rem; font-size: .76rem; color: var(--muted); line-height: 1.5; border-top: 1px solid var(--line); padding-top: .7rem; }
.lg-close { display: none; }
.lg-back { background: none; border: 0; padding: 0; margin: 0 0 .8rem; font: inherit; font-size: .8rem; color: var(--muted); cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }

/* Wayfinder marks */
.lg-mark { background: transparent; border: 0; }
.lg-dot { display: block; width: 12px; height: 12px; border-radius: 50%; background: var(--accent); border: 2px solid #fffcf8; box-shadow: 0 0 0 1px rgba(26,24,20,.28); transition: transform .12s ease; }
.lg-dot--p { background: #fffcf8; border: 2px solid var(--accent); box-shadow: 0 0 0 1px rgba(255,252,248,.9); }
.lg-dot--f { width: 18px; height: 18px; background: var(--ink); border: 3px solid var(--accent); box-shadow: 0 0 0 2px #fffcf8, 0 2px 6px rgba(26,24,20,.25); }
.lg-mark:hover .lg-dot, .lg-mark.is-active .lg-dot { transform: scale(1.35); }
.lg-mark.is-active .lg-dot { background: var(--ink); border-color: #fffcf8; box-shadow: 0 0 0 2px var(--accent); }
.lg-legend .lg-dot { flex: none; }
.lg-cluster { background: transparent; border: 0; }
.lg-cluster span { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; border-radius: 50%; background: rgba(255,252,248,.94); border: 1px solid var(--accent); box-shadow: 0 0 0 4px rgba(138,115,72,.14); color: var(--ink); font: 600 .78rem/1 var(--font-sans); font-variant-numeric: tabular-nums; letter-spacing: .02em; }
.lg-landmark { background: transparent; border: 0; pointer-events: none; }
.lg-landmark span { position: absolute; left: 0; top: 0; transform: translate(-50%, -50%); white-space: nowrap; font: 600 .66rem/1 var(--font-sans); letter-spacing: .18em; text-transform: uppercase; color: #4c463e; text-shadow: 0 0 3px #f7f4ef, 0 0 6px #f7f4ef; }
.lg-landmark span::before { content: ""; display: block; width: 1px; height: 8px; background: var(--accent); margin: 0 auto 4px; }

/* Leaflet chrome in the site palette */
.lgmap .leaflet-control-zoom a { color: var(--ink); background: var(--card); border-color: var(--line); }
.lgmap .leaflet-bar { border: 1px solid var(--line); box-shadow: var(--shadow-soft); border-radius: var(--radius-sm); }
.lgmap .leaflet-control-attribution { background: rgba(247,244,239,.86); color: var(--muted); font-size: 10.5px; }
.lgmap .leaflet-control-attribution a { color: var(--ink); }
.lgmap .leaflet-container, .lgmap.leaflet-container { font-family: var(--font-sans); }
.lgmap.lg-raster .leaflet-tile-pane { filter: grayscale(1) sepia(.12) contrast(.88) brightness(1.08); }

.map-notes { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: var(--space-4); }
.map-notes h3 { font-family: var(--font-serif); font-weight: 500; font-size: 1.1rem; margin: 0 0 .4rem; letter-spacing: var(--tracking-tight); }
.map-notes p, .map-notes li { color: var(--muted); font-size: .94rem; line-height: 1.6; }
.map-notes ul { padding-left: 1.1rem; margin: .3rem 0 0; }
.map-towns { width: 100%; border-collapse: collapse; font-size: .9rem; font-variant-numeric: tabular-nums; margin-top: .4rem; }
.map-towns th, .map-towns td { text-align: left; padding: .35rem .4rem; border-bottom: 1px solid var(--line); }
.map-towns th { font-size: .68rem; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); font-weight: 600; }
.map-towns td.n { text-align: right; }

@media (max-width: 900px) {
  .lgmap-shell { grid-template-columns: 1fr; }
  .lgmap { height: 68vh; min-height: 420px; }
  .lgmap-side { border-left: 0; height: auto; min-height: 0; }
  .lgmap-controls { border-top: 1px solid var(--line); }
  .lgmap-panel.has-parcel { position: fixed; z-index: 1500; left: 0; right: 0; bottom: 0; max-height: 62vh; background: var(--card); border-top: 1px solid var(--line); box-shadow: 0 -12px 32px rgba(26,24,20,.14); border-radius: var(--radius-lg) var(--radius-lg) 0 0; padding-bottom: calc(1.4rem + env(safe-area-inset-bottom)); }
  .lgmap-panel.has-parcel .lg-close { display: block; position: absolute; top: .6rem; right: .7rem; background: var(--paper); border: 1px solid var(--line); border-radius: 50%; width: 2rem; height: 2rem; font-size: 1.1rem; line-height: 1; color: var(--ink); cursor: pointer; }
  .lgmap-panel.has-parcel .lg-back { display: none; }
}
