/* Lake report (plan 1.2 §6 shell + §7 content). One shared hashed
   stylesheet for every /lakes/<wbic>/ page — never inlined per page. */
:root { color-scheme: light dark; font-family: system-ui, sans-serif; scroll-padding-bottom: 7rem; }
body { margin: 0 auto; max-width: 44rem; padding: 1rem; line-height: 1.5; }
header { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; align-items: baseline; }
header a { color: inherit; }
nav a { margin-right: 0.25rem; }
h1, h2, h3 { overflow-wrap: anywhere; }
main { overflow-wrap: anywhere; }
main section { scroll-margin-top: 0.5rem; }
#visit { contain: layout style paint; }
#fishing,
#water,
#sources,
main > nav,
.report-action-bar,
footer { content-visibility: auto; contain-intrinsic-size: auto 48rem; }
dl { display: grid; grid-template-columns: auto 1fr; gap: 0.25rem 0.75rem; }
dt { font-weight: 600; }
dd { min-width: 0; overflow-wrap: anywhere; }
ul { padding-left: 1.25rem; }
.report-cautions { border: 1px solid color-mix(in srgb, currentColor 35%, transparent); border-left-width: 4px; padding: 0.25rem 0.75rem; margin: 0.75rem 0; }
.report-cautions ul { margin: 0.5rem 0; }
.report-hero-facts { margin: 0.75rem 0; }
.report-actions { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.report-association-method { font-size: 0.85rem; opacity: 0.85; }
details[data-evidence-family] { margin: 0.5rem 0; }
details[data-evidence-family] summary { cursor: pointer; }
[data-evidence-detail] li { margin-bottom: 0.5rem; }
[data-evidence-retry] { margin-left: 0.5rem; }
footer { margin-top: 2rem; font-size: 0.85rem; opacity: 0.8; }

/* Plan 1.3 Round 4 — supplemental inline report map. Controls and selected
   records stay in flow; only provider attribution may overlay the map. */
.report-map { position: relative; margin: 1rem 0; contain: layout style paint; }
.report-map__summary { cursor: pointer; font: inherit; font-weight: 600; min-height: 44px; display: inline-flex; align-items: center; }
.report-map__content { display: block; margin-top: 0.6rem; contain: layout style; }
.report-map__content > * + * { margin-top: 0.55rem; }
.report-map__content[data-collapsed] { position: absolute; visibility: hidden; pointer-events: none; inline-size: 100%; }
.report-map__toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 0.45rem; }
.report-map__toolbar button,
.report-map__toolbar select,
.report-map__selection button,
.report-map [data-report-map-status] button,
.report-map [data-report-geometry-status] button,
.report-map [data-report-map-access-status] button { min-width: 44px; min-height: 44px; font: inherit; }
.report-map__toolbar label { display: flex; flex: 1 1 12rem; flex-wrap: wrap; align-items: center; gap: 0.25rem; min-width: 0; max-width: 100%; }
.report-map__toolbar select { box-sizing: border-box; min-width: 44px; max-width: 100%; }
.report-map__canvas { position: relative; box-sizing: border-box; width: 100%; max-width: 100%; height: 14rem; overflow: hidden; contain: layout paint size; border: 1px solid currentColor; }
.report-map-runtime__tiles,
.report-map-runtime__vectors,
.report-map-runtime__markers { position: absolute; inset: 0; width: 100%; height: 100%; overflow: clip; contain: strict; }
.report-map-runtime__tiles { z-index: 1; background: #dbe8ef; }
.report-map-runtime__vectors { z-index: 2; pointer-events: none; }
.report-map-runtime__markers { z-index: 3; pointer-events: none; }
.report-map-runtime__markers > .report-map-marker { pointer-events: auto; }
.report-map__attribution { position: absolute; z-index: 1000; right: 0; bottom: 0; max-width: calc(100% - 0.5rem); padding: 0.1rem 0.25rem; color: #111; background: rgb(255 255 255 / 85%); font-size: 0.65rem; line-height: 1.2; }
.report-map__tile-status .map-status { border-left: 4px solid currentColor; padding: 0.4rem 0.6rem; }
.report-map__legend { display: flex; flex-wrap: wrap; gap: 0.4rem 0.85rem; list-style: none; margin: 0; padding: 0; }
.report-map__legend li { display: inline-flex; align-items: center; gap: 0.25rem; }
.report-map__legend-symbol { display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; width: 1.7rem; height: 1.7rem; color: #fff; background: #185f8d; border: 3px solid #fff; font: 700 0.85rem/1 system-ui, sans-serif; }
.report-map-marker { position: absolute; display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; width: 44px !important; height: 44px !important; margin: -22px 0 0 -22px !important; padding: 0; color: #fff; background: transparent; border: 0; font: 700 0.65rem/1 system-ui, sans-serif; cursor: pointer; isolation: isolate; }
.report-map-marker::before { content: ''; position: absolute; z-index: 0; box-sizing: border-box; width: 22px; height: 22px; background: #185f8d; border: 2px solid #fff; box-shadow: 0 0 0 1px #123; }
.report-map-marker > span { position: relative; z-index: 1; }
.report-map-marker--carry-in::before,
.report-map__legend-symbol--carry-in { border-radius: 50% 50% 0; transform: rotate(45deg); }
.report-map__legend-symbol--carry-in { text-orientation: mixed; }
.report-map-marker--shore-fishing::before,
.report-map__legend-symbol--shore-fishing { border-radius: 50%; background: #6b3c87; }
.report-map-marker--other::before,
.report-map__legend-symbol--other { background: #735d16; }
.report-map-marker--lake::before,
.report-map__legend-symbol--lake { border-radius: 50%; background: #1674a8; }
.report-map-marker--composite::before,
.report-map__legend-symbol--composite { background: #6d2d1e; border-radius: 0.35rem; }
.report-map__selection { border: 1px solid color-mix(in srgb, currentColor 30%, transparent); padding: 0.6rem 0.75rem; }
.report-map__selection h3 { margin-top: 0; }
.visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; margin: -1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important; }

@media (forced-colors: active) {
  .report-map-marker::before,
  .report-map__legend-symbol { forced-color-adjust: none; color: Canvas; background: CanvasText; border-color: Canvas; outline: 2px solid CanvasText; }
  .report-map-marker--shore-fishing::before,
  .report-map__legend-symbol--shore-fishing { border-style: double; }
  .report-map-marker--other::before,
  .report-map__legend-symbol--other { border-style: dashed; }
  .report-map-marker--composite::before,
  .report-map__legend-symbol--composite { border-style: dotted; }
}

@media (max-width: 44rem) {
  .report-map__canvas { height: 12rem; }
}

/* §7.4 — sticky, safe-area-aware action bar for Back and
   Directions/Access on narrow viewports. Fixed placement pairs with the
   body padding and root scroll-padding so it never obscures anchors,
   focused controls, or the final page content. Desktop keeps the full
   in-flow action set instead. */
.report-action-bar { display: none; }
@media (max-width: 44rem) {
  /* Clearance for a bar that wraps to two rows once Share joins it
     (§7.4 — the fixed bar must never obscure the final content). */
  body { padding-bottom: calc(6rem + env(safe-area-inset-bottom, 0px)); }
  .report-action-bar {
    position: fixed;
    inset: auto 0 0 0;
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem 1.25rem;
    justify-content: center;
    align-items: center;
    padding: 0.6rem max(0.75rem, env(safe-area-inset-left, 0px)) calc(0.6rem + env(safe-area-inset-bottom, 0px)) max(0.75rem, env(safe-area-inset-right, 0px));
    background: Canvas;
    border-top: 1px solid color-mix(in srgb, currentColor 25%, transparent);
    font-weight: 600;
  }
}

/* §7.5 — inside an allowed iframe the HOST page owns scrolling and the
   frame is sized to full content height, so a viewport-fixed bar has no
   stable viewport to stick to; the in-flow overview actions remain. */
body.in-iframe .report-action-bar { display: none; }
body.in-iframe { padding-bottom: 1rem; }

/* Plan 1.2 §10 — reduced motion: report pages declare no motion today;
   this guard keeps that true against future additions. */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* Plan 1.4 Round 3 — report compare/save controls + action status. */
.report-actions [data-action-port] { display: inline-flex; gap: 0.5rem; align-items: center; }
.report-action-status { min-height: 1.2em; font-size: 0.9rem; opacity: 0.85; margin: 0.35rem 0 0; }
.report-action-status:empty { display: none; }

/* Plan 1.4 §4.4 — /compare/: stacked labelled groups are the DOM (every
   cell names its lake, so SR output is lake + field + value + status at
   any width); desktop lays the SAME DOM out as a table-like grid with
   the per-cell lake names visually collapsed under the lake headers. */
.compare-view { display: grid; gap: 1rem; margin-top: 1rem; }
.compare-lakes { display: grid; gap: 0.75rem; }
.compare-lake-card { border: 1px solid color-mix(in srgb, currentColor 25%, transparent); border-radius: 8px; padding: 0.6rem 0.75rem; }
.compare-lake-card h2 { margin: 0 0 0.25rem; font-size: 1.1rem; }
.compare-lake-card__meta { margin: 0 0 0.4rem; font-size: 0.9rem; opacity: 0.85; }
.compare-lake-card__actions { display: flex; flex-wrap: wrap; gap: 0.4rem; margin: 0; }
.compare-row { border-top: 1px solid color-mix(in srgb, currentColor 18%, transparent); padding-top: 0.6rem; }
.compare-row__label { margin: 0 0 0.2rem; font-size: 1rem; }
.compare-row__qualification { margin: 0 0 0.4rem; font-size: 0.85rem; opacity: 0.8; }
.compare-row__cells { display: grid; gap: 0.5rem; }
.compare-cell__lines { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.15rem; }
.compare-cell__lake { font-weight: 600; }
.compare-cell__status { opacity: 0.75; font-size: 0.85rem; }
.compare-chooser { margin-top: 1rem; }

@media (min-width: 720px) {
  .compare-lakes,
  .compare-row__cells {
    grid-template-columns: repeat(var(--compare-columns, 3), minmax(0, 1fr));
  }
  .compare-row .compare-cell__lake { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .compare-row__cells .compare-cell { border: 1px solid color-mix(in srgb, currentColor 12%, transparent); border-radius: 6px; padding: 0.4rem 0.5rem; }
}
.compare-row__provenance { margin: 0 0 0.4rem; font-size: 0.8rem; opacity: 0.7; }
.share-fallback { display: inline-flex; }
.share-fallback__input { font: inherit; font-size: 0.85rem; min-width: 14rem; max-width: 100%; }
#compare-actions { margin: 0.4rem 0; }
/* §7.4 — the bar must never grow taller than its link row: the share
   action renders link-like inside the fixed bar. */
.report-action-bar .report-share-action { background: none; border: 0; padding: 0; margin: 0; font: inherit; font-weight: 600; color: inherit; text-decoration: underline; cursor: pointer; }
