/* Daily weather and water: server-rendered, with no asynchronous layout replacement. */
.daily-current { width: 100%; max-width: 76rem; margin: 0 auto; padding: 0 clamp(1rem, 3vw, 2.5rem) 3rem; font-size: 1rem; line-height: 1.5; overflow-wrap: anywhere; }
.daily-current :is(h1,h2,h3,h4) { font-family: var(--font-serif); font-weight: 500; line-height: 1.1; text-wrap: balance; margin: 0; }
.daily-current h2 { font-size: clamp(1.6rem, 2.6vw, 2.25rem); }
.daily-current p { margin: 0; }
.daily-current a { text-underline-offset: .2em; }
.daily-current a:focus-visible, .daily-current summary:focus-visible { outline: 3px solid var(--focus-ring); outline-offset: 3px; }
.daily-action { display: inline-flex; align-items: center; min-height: 44px; padding-block: .4rem; font-weight: 600; }
.daily-meta { font-size: .875rem; color: var(--text-secondary); }
.daily-eyebrow { font-family: var(--font-sans); font-size: .8125rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--text-secondary); }
.daily-current h2.daily-eyebrow { font-family: var(--font-sans); font-size: .8125rem; font-weight: 700; }

/* The book-spread centre line belongs to two-page layouts, not this single column. */
body:has(.daily-current) { background: var(--surface-canvas); }

/* River identity: the name is always printed; color only helps scanning. */
.daily-river-tag { display: inline-flex; align-items: center; gap: .4rem; }
.daily-river-tag::before { content: ""; width: .55rem; height: .55rem; border-radius: 50%; background: currentColor; }
.daily-river-tag--new { color: var(--river-new); }
.daily-river-tag--gauley { color: var(--river-gauley); }
.daily-river-tag--meadow { color: var(--river-meadow); }

/* Opening: the answer, then tonight's weather beside it. */
.daily-opening { display: flex; flex-wrap: wrap; gap: 1.5rem 2.5rem; padding: 2rem 0 2.25rem; border-bottom: 1px solid var(--border-soft); }
.daily-answer { flex: 999 1 30rem; min-width: 0; }
.daily-dateline { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .75rem; margin-bottom: .9rem !important; font-size: .875rem; color: var(--text-secondary); }
.daily-dateline time { font-weight: 600; color: var(--text-primary); }
.daily-delay { display: inline-flex; align-items: center; gap: .4rem; padding: .1rem .6rem; border: 1px solid var(--freshness-stale); border-radius: 999px; color: var(--text-primary); font-weight: 600; font-size: .8125rem; }
.daily-delay::before { content: ""; width: .55rem; height: .55rem; background: repeating-linear-gradient(135deg, transparent 0 2px, var(--freshness-stale) 2px 4px); border: 1px solid var(--freshness-stale); }
.daily-current h1 { font-size: clamp(2.1rem, 4.6vw, 3.4rem); line-height: 1.06; letter-spacing: -.015em; }
.daily-summary { margin-top: .75rem !important; font: 500 clamp(1.25rem, 2.2vw, 1.6rem)/1.3 var(--font-serif); max-width: 34em; }
.daily-lead { margin-top: 1rem !important; font-size: 1.125rem; max-width: 40em; color: var(--text-primary); }

/* Visitor line */
.daily-visitor { display: flex; gap: .6rem; align-items: flex-start; margin-top: 1rem !important; padding: .7rem .9rem; border-radius: .5rem; background: var(--surface-subtle); font-size: .9375rem; line-height: 1.45; max-width: 40em; }
.daily-visitor svg { flex: none; margin-top: .15rem; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.daily-chip-line { margin-top: .2rem; }
.daily-change-chip { display: inline-block; padding: 0 .45rem; border-radius: 999px; font-size: .75rem; letter-spacing: .04em; border: 1px solid currentColor; color: var(--text-primary); }
.daily-change-chip--below, .daily-change-chip--above { color: var(--availability-limited); }
.daily-run-status { font-size: .8125rem; font-weight: 600; white-space: nowrap; }
.daily-run-status--below, .daily-run-status--above { color: var(--availability-limited); }
.daily-run-status--delayed, .daily-run-status--unknown { color: var(--text-secondary); }
.daily-phone-range { display: none; }
.daily-release-note { font-size: .8125rem; color: var(--text-secondary); }

/* Coming up: scheduled releases and dated local events */
.daily-coming-up { padding: 1.25rem 0 0; }
.daily-coming-up ul { list-style: none; margin: .5rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr)); gap: .75rem; }
.daily-coming-up-item { display: grid; grid-template-columns: 4.5rem minmax(0, 1fr); gap: .75rem; padding: .75rem 1rem; border: 1px solid var(--border-soft); border-radius: .5rem; background: var(--surface-raised); }
.daily-coming-up-item--release { border-left: 0; box-shadow: inset 4px 0 0 var(--river-gauley); }
.daily-coming-up-date { font-weight: 700; font-size: .875rem; line-height: 1.3; }
.daily-coming-up h3 { font: 700 1rem/1.3 var(--font-sans); }
.daily-coming-up-item p + p { margin-top: .2rem; }

/* Rivers */
.daily-rivers { padding-top: 2rem; }
.daily-section-heading { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: .5rem 1.5rem; }
.daily-section-title { display: flex; align-items: baseline; flex-wrap: wrap; gap: .25rem 1rem; }
.daily-group-summary { font-size: .9375rem; }
.daily-reading-times { font-variant-numeric: tabular-nums; }
.daily-legend { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .6rem; margin: .5rem 0 1.25rem !important; }
.daily-legend-band rect, .daily-range-band { fill: color-mix(in oklch, var(--activity-water) 30%, var(--surface-canvas)); }
/* Inside the range, medium is the darker middle; low and high stay light. */
.daily-legend-band .daily-range-zone--medium, .daily-range-zone--medium { fill: color-mix(in oklch, var(--activity-water) 55%, var(--surface-canvas)); }
.daily-legend-band line, .daily-range-edge { stroke: var(--text-secondary); stroke-width: 2; }
.daily-legend-mark line { stroke: var(--text-primary); stroke-width: 4; stroke-linecap: round; }
.daily-river-group + .daily-river-group { margin-top: 1.75rem; }
.daily-current .daily-river-group-heading { padding: .55rem 0; border-top: 2px solid var(--border-strong); font: 700 .8125rem/1.4 var(--font-sans); letter-spacing: .12em; text-transform: uppercase; }
.daily-current .daily-river-group-heading span { color: var(--text-secondary); }
.daily-river-group--below > .daily-river-group-heading, .daily-river-group--above > .daily-river-group-heading { color: var(--availability-limited); }
.daily-river-group > .daily-meta { margin-bottom: .5rem !important; }

.daily-river { display: grid; grid-template-columns: minmax(0, 1.9fr) minmax(0, 1fr) minmax(0, 1.4fr) minmax(0, 1.6fr) 44px; align-items: center; gap: .75rem 1.5rem; padding: .9rem 0; border-top: 1px solid var(--border-soft); }
.daily-run-name { min-width: 0; }
.daily-current .daily-run-title { font-size: 1.5rem; }
.daily-current .daily-run-title a { color: inherit; text-decoration: none; }
.daily-current .daily-run-title a:hover { text-decoration: underline; }
.daily-run-class, .daily-set-note { font: 600 .875rem/1.3 var(--font-sans); color: var(--text-secondary); white-space: nowrap; }
.daily-reading { font: 500 1.75rem/1.1 var(--font-serif); font-variant-numeric: tabular-nums; }
.daily-reading--stale { color: var(--text-secondary); }
.daily-trend { font-size: .9375rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.daily-run-trend .river-spark, .daily-run-trend .river-spark-empty { margin-bottom: .35rem; }
.daily-set-trend { grid-column: 3 / 5; }
.daily-range-note { font-size: .8125rem; font-weight: 600; color: var(--availability-limited); }
.daily-details { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; color: var(--text-secondary); }
.daily-details svg { fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.daily-details:hover { color: var(--text-primary); }

.daily-access-notices { list-style: none; margin: .35rem 0 0; padding: 0; display: grid; gap: .2rem; }
.daily-access-notice { display: flex; gap: .4rem; align-items: flex-start; font-size: .8125rem; color: var(--availability-limited); }
.daily-access-notice--closed { color: var(--availability-closed); font-weight: 600; }
.daily-access-notice svg { flex: none; margin-top: .15rem; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linejoin: round; stroke-linecap: round; }

/* Range bar: band = published range, mark = latest reading. */
.daily-range { min-width: 0; }
.daily-range-bar { display: block; overflow: visible; }
.daily-range-track { fill: var(--surface-subtle); }
.daily-range-mark { stroke: var(--text-primary); stroke-width: 4; stroke-linecap: round; }
.daily-range--below .daily-range-mark, .daily-range--above .daily-range-mark { stroke: var(--availability-limited); }
.daily-range--stale .daily-range-mark { stroke: var(--text-secondary); stroke-dasharray: 3 3; stroke-linecap: butt; }
.daily-range-labels { display: grid; grid-template-columns: 30% 40% 30%; font-size: .75rem; color: var(--text-secondary); font-variant-numeric: tabular-nums; }
.daily-range-labels span { text-align: center; white-space: nowrap; }
.daily-range-labels span:last-child { grid-column: 3; }

/* Runs sharing one gauge (the Meadow): one reading, then each run on the same columns as other rows. */
.daily-shared-runs { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; grid-column: 1 / -1; }
.daily-shared-runs li { display: grid; grid-template-columns: minmax(0, 1.9fr) minmax(0, 1fr) minmax(0, 1.4fr) minmax(0, 1.6fr) 44px; align-items: center; gap: .25rem 1.5rem; }
.daily-shared-name { grid-column: 1 / 3; padding-left: 1rem; border-left: 2px solid var(--border-soft); }
.daily-shared-name a { font-weight: 600; }
.daily-nowrap { white-space: nowrap; }
.daily-mobile-note { display: none; }

.daily-river-notes { margin-top: 1rem !important; padding-top: .75rem; border-top: 1px solid var(--border-soft); }
.daily-visitor-note summary { cursor: pointer; min-height: 44px; padding-block: .5rem; font-size: .875rem; }

/* Tomorrow */
.daily-fact { margin-top: 2.5rem; }
.daily-tomorrow { display: flex; flex-wrap: wrap; align-items: baseline; gap: .25rem 1.5rem; margin-top: 2rem; padding-top: 1rem; border-top: 2px solid var(--border-strong); }

@media (max-width: 60rem) {
  .daily-river { grid-template-columns: minmax(0, 1fr) auto 44px; gap: .35rem 1rem; }
  .daily-run-name { grid-column: 1 / 2; }
  .daily-run-reading { grid-column: 2 / 3; grid-row: 1; text-align: right; align-self: start; }
  .daily-details { grid-column: 3; grid-row: 1; align-self: start; }
  .daily-river > .daily-range, .daily-run-trend { grid-column: 1 / -1; }
  .daily-run-trend { display: flex; flex-wrap: wrap; align-items: baseline; gap: .25rem 1rem; }
  .daily-run-trend .river-spark, .daily-run-trend .river-spark-empty { flex-basis: 100%; }
  .daily-run-reading .daily-meta { display: none; }
  .daily-mobile-note { display: block; }
  /* The shared set has its source line here; let it wrap so the river name keeps the width. */
  .daily-river--shared .daily-run-reading { grid-column: 2 / -1; max-width: 9rem; }
  .daily-river--shared .daily-run-reading .daily-meta { display: block; }
  .daily-shared-runs li { grid-template-columns: minmax(0, 1fr); gap: .15rem; padding-top: .5rem; border-top: 1px dashed var(--border-soft); }
  .daily-shared-name { grid-column: auto; }
  .daily-current .daily-run-title { font-size: 1.3rem; }
  .daily-reading { font-size: 1.4rem; }
}
@media (max-width: 40rem) {
  /* Phone: stack the compact weather inset after the opening answer. */
  .daily-opening { padding: 1rem 0 .75rem; gap: .75rem; border-bottom: 0; }
  .daily-current h1 { font-size: 1.85rem; }
  .daily-lead { font-size: 1rem; margin-top: .5rem !important; }
  .daily-summary { font-size: 1.15rem; margin-top: .5rem !important; }
  .daily-rivers { padding-top: 1rem; }
  .daily-legend { margin: .25rem 0 .75rem !important; }
  .daily-river { padding: .6rem 0; }
  .daily-current .daily-run-title { font-size: 1.15rem; }
  /* The line shows the edges; the bar goes, but a missing comparison is still said. */
  .daily-river > .daily-range[class*="daily-range--"], .daily-shared-runs .daily-range[class*="daily-range--"] { display: none; }
  .daily-phone-range { display: block; grid-column: 1 / -1; }
  .daily-legend-band, .daily-legend-mark, .daily-legend-bar-text { display: none; }
  .daily-reading { font-size: 1.25rem; }
  .daily-run-name > .daily-meta { font-size: .8125rem; }
  .daily-opening { padding: 1.25rem 0 1.5rem; }
  .daily-sun-times { display: none; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* /rivers: the homepage river list as its own page, with search and a river filter. */
.river-list-page .daily-rivers { padding-top: 1.5rem; }
.river-list-page h1 { font-size: clamp(1.8rem, 3vw, 2.5rem); }
.river-list-page .daily-section-heading { align-items: center; }