@layer reset, foundation, layout, components, utilities;

@view-transition { navigation: auto; }

@keyframes today-step-forward {
  from { opacity: 0; transform: translateX(1rem); }
  to { opacity: 1; transform: translateX(0); }
}

@layer layout {
  .breadcrumbs { margin-bottom: var(--space-3); }
  .breadcrumbs ol { display: flex; flex-wrap: wrap; gap: var(--space-2); list-style: none; margin: 0; padding: 0; }
  .breadcrumbs li { align-items: center; display: flex; gap: var(--space-2); }
  .breadcrumbs li + li::before { content: "/"; }

  .hub-page { --hub-accent: var(--activity-water); padding-top: var(--space-4); }
  .hub-page--trails { --hub-accent: var(--activity-trail); }
  .hub-masthead { --field-accent: var(--hub-accent); }
  .hub-masthead .field-masthead__page--action { gap: var(--space-5); }
  .hub-updated { margin-top: var(--space-5); }
  .hub-boundary { background: var(--text-primary); color: var(--surface-canvas); display: grid; gap: var(--space-4); grid-template-columns: minmax(12rem, 0.45fr) minmax(20rem, 1.55fr); margin-bottom: var(--space-7); padding: var(--space-4); }
  .hub-boundary p { max-width: 50rem; }
  .hub-group + .hub-group { margin-top: var(--space-7); }
  .hub-masthead + .hub-group { margin-top: var(--space-7); }
  .hub-group-heading { border-bottom: 2px solid var(--text-primary); padding-bottom: var(--space-4); }
  .hub-card { border-bottom: 1px solid var(--text-primary); display: grid; grid-template-columns: minmax(18rem, 0.9fr) minmax(22rem, 1.1fr) 12rem; }
  .hub-card > * { padding: var(--space-4); }
  .hub-card > * + * { border-left: 1px solid var(--border-soft); }
  .hub-card-main, .hub-card-facts { min-width: 0; }
  .hub-card-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); margin: 0; padding: 0; }
  .hub-card-facts > div { padding: var(--space-4); }
  .hub-card-facts > div + div { border-left: 1px solid var(--border-soft); }
  .hub-card-link { align-items: flex-end; display: flex; justify-content: flex-end; }
  .hub-next-step { border-block: 2px solid var(--text-primary); display: grid; gap: var(--space-7); grid-template-columns: minmax(18rem, 0.8fr) minmax(20rem, 1.2fr); margin-top: var(--space-7); padding-block: var(--space-7); }
  .hub-next-step > div:last-child { max-width: 38rem; }

  .paddling-paths { margin-block: var(--space-7); }
  .paddling-paths > header { border-bottom: 2px solid var(--text-primary); padding-bottom: var(--space-4); }
  .paddling-path-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .paddling-path-grid article { display: flex; flex-direction: column; min-height: 0; padding: var(--space-4); }
  .paddling-path-grid article + article { border-left: 1px solid var(--text-primary); }
}

@layer components {
  .breadcrumbs { color: var(--text-secondary); font-size: var(--type-label); font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; }
  .breadcrumbs a { align-items: center; display: inline-flex; min-height: 2.75rem; text-underline-offset: 0.22rem; }
  .breadcrumbs li + li::before { color: var(--hub-accent, var(--text-secondary)); }
  .breadcrumbs [aria-current="page"] { color: var(--text-primary); }

  .hub-masthead .field-title { color: var(--text-primary); }
  .hub-boundary strong { color: inherit; font-family: var(--font-serif); font-size: clamp(1.6rem, 3vw, 2.5rem); font-weight: 500; letter-spacing: -0.04em; line-height: 1; }
  .hub-boundary p { color: color-mix(in oklch, var(--surface-canvas) 80%, transparent); font-family: var(--font-serif); }
  .hub-group-heading h2, .paddling-paths > header h2, .hub-next-step h2 { font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; letter-spacing: -0.035em; line-height: 1.05; margin-top: var(--space-2); text-wrap: balance; }
  .hub-card { --hub-card-state: var(--availability-unknown); box-shadow: inset 0.28rem 0 var(--hub-card-state); }
  .hub-card--conditions_met, .hub-card--expected_open, .hub-card--open { --hub-card-state: var(--availability-open); }
  .hub-card--verify_access, .hub-card--level_outside_guidance, .hub-card--limited { --hub-card-state: var(--availability-limited); }
  .hub-card--access_blocked, .hub-card--closed { --hub-card-state: var(--availability-closed); }
  .hub-card-main h3 { font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; letter-spacing: -0.035em; line-height: 1.05; margin-block: var(--space-2); }
  .hub-card-main h3 a { text-decoration-thickness: 1px; text-underline-offset: 0.2em; }
  .hub-card-main > p:last-child { color: var(--text-secondary); font-family: var(--font-serif); font-size: var(--type-small); }
  .hub-card-facts dt { color: var(--text-secondary); font-size: var(--type-label); font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
  .hub-card-facts dd { font-family: var(--font-serif); font-size: 1.05rem; line-height: 1.25; margin-top: var(--space-1); }
  .hub-card-facts small { color: var(--text-secondary); display: block; font-size: var(--type-label); line-height: 1.4; }
  .hub-card-link { font-size: var(--type-label); font-weight: 850; letter-spacing: 0.06em; text-align: right; text-transform: uppercase; text-underline-offset: 0.25rem; }
  .hub-next-step > div:last-child { color: var(--text-secondary); font-family: var(--font-serif); }
  .hub-next-step .field-link { color: var(--text-primary); margin-top: var(--space-4); }

  .paddling-paths > header h2 { max-width: 13ch; }
  .paddling-path-grid article:first-child { background: color-mix(in oklch, var(--activity-water) 7%, var(--surface-canvas)); }
  .paddling-path-grid article:last-child { background: color-mix(in oklch, var(--activity-water-deep) 7%, var(--surface-canvas)); }
  .hub-path-number { color: var(--activity-water-deep); font-family: var(--font-serif); font-size: 1.3rem; }
  .paddling-path-grid h3 { font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; letter-spacing: -0.035em; line-height: 1.05; margin-block: var(--space-4); }
  .paddling-path-grid h3 a { text-decoration-thickness: 1px; text-underline-offset: 0.15em; }
  .paddling-path-grid article > p:not(.hub-path-number, .field-label) { color: var(--text-secondary); font-family: var(--font-serif); max-width: 30rem; }
  .paddling-path-grid .field-link { margin-top: auto; padding-top: var(--space-5); }
}

@layer utilities {
  @media (max-width: 68rem) {
    .hub-card { grid-template-columns: minmax(17rem, 0.85fr) minmax(20rem, 1.15fr); }
    .hub-card-link { border-left: 1px solid var(--border-soft); border-top: 1px solid var(--border-soft); grid-column: 2; justify-content: flex-start; min-height: 3.5rem; }
    .hub-card-facts { grid-template-columns: 1fr; }
    .hub-card-facts > div + div { border-left: 0; border-top: 1px solid var(--border-soft); }
  }

  @media (max-width: 48rem) {
    .hub-boundary, .hub-next-step, .paddling-path-grid { grid-template-columns: 1fr; }
    .hub-card { grid-template-columns: 1fr; }
    .hub-card > * + *, .hub-card-link { border-left: 0; border-top: 1px solid var(--border-soft); grid-column: auto; }
    .paddling-path-grid article { min-height: 0; }
    .paddling-path-grid article + article { border-left: 0; border-top: 1px solid var(--text-primary); }
  }
}

@layer components {
  .river-filters { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); }
  .river-filters input, .river-filters select { background: var(--surface-canvas); color: var(--text-primary); border: 1px solid var(--border-soft); border-radius: 2px; font: inherit; font-size: var(--type-small); min-height: 2.75rem; padding: var(--space-2) var(--space-3); }
  .river-filters input[type="search"] { width: 19rem; max-width: 100%; }
  .river-filters input[type="submit"] { cursor: pointer; font-weight: 650; }
  .river-filters a { font-size: var(--type-small); }
  .river-hero-headline { font-size: var(--type-body); font-weight: 700; font-variant-numeric: tabular-nums; }
  .river-run-freshness { align-items: center; display: flex; flex-wrap: wrap; gap: 3px 6px; color: var(--text-secondary); font-size: var(--type-label); line-height: 1.3; }
  .river-run-freshness .freshness-indicator { display: inline-flex; gap: 4px; }
  .river-run-freshness .freshness-mark { height: 0.6rem; width: 0.6rem; border-width: 1px; }

  /* 48-hour trend line, shared by the homepage river list and /rivers. */
  .river-spark { margin: 0; min-width: 0; }
  .river-spark svg { display: block; width: 100%; height: 3.25rem; overflow: visible; }
  .river-spark figcaption { color: var(--text-secondary); font-size: var(--type-label); line-height: 1.3; margin-top: 2px; }
  .river-spark-area { fill: color-mix(in oklch, var(--activity-water) 14%, transparent); }
  .river-spark-line { fill: none; stroke: var(--text-primary); stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke; }
  .river-spark-dot-ring, .river-spark-dot, .river-spark-point { stroke-linecap: round; vector-effect: non-scaling-stroke; }
  .river-spark-dot-ring { stroke: var(--text-primary); stroke-width: 9; }
  .river-spark-dot { stroke: var(--surface-canvas); stroke-width: 5; }
  .river-spark-point { stroke: var(--text-primary); stroke-width: 4; }
  .river-spark-edge { stroke: var(--availability-limited); stroke-dasharray: 3 3; stroke-width: 1; vector-effect: non-scaling-stroke; }
  .river-spark-day { stroke: var(--border-soft); stroke-width: 1; vector-effect: non-scaling-stroke; }
  .river-spark--stale .river-spark-line, .river-spark--stale .river-spark-dot-ring, .river-spark--stale .river-spark-point { stroke: var(--text-secondary); }
  .river-spark--stale .river-spark-line { stroke-dasharray: 4 3; }
  .river-spark-empty { align-items: center; background: repeating-linear-gradient(to bottom, transparent 0 calc(50% - 1px), var(--border-soft) calc(50% - 1px) 50%); color: var(--text-secondary); display: flex; height: 3rem; justify-content: center; }
  .river-spark-gap { background: var(--surface-canvas); font-size: 1.5rem; line-height: 1; padding: 0 0.4rem; }
  .river-no-results { padding-block: var(--space-6); }
  .river-hub-next { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--space-2) var(--space-4); margin-top: var(--space-2); font-size: var(--type-caption); }
  @media (max-width: 60rem) {
    .river-filters { width: 100%; }
    .river-filters input[type="search"] { width: 100%; }
  }
}

@keyframes page-fade-out {
  to { opacity: 0; }
}

@keyframes page-fade-in {
  from { opacity: 0; }
}

::view-transition-old(root) {
  animation: 90ms ease-out both page-fade-out;
}

::view-transition-new(root) {
  animation: 160ms ease-out both page-fade-in;
}

@layer layout {
  .climbing-index, .climbing-show { --climb-accent: var(--activity-climb); padding-top: var(--space-4); }
  .climbing-masthead, .climbing-sector-masthead { --field-accent: var(--activity-climb); }
  .climbing-masthead-title .field-title { font-size: var(--type-title); line-height: 1.05; max-width: 12ch; }
  .climbing-masthead-action { gap: var(--space-3); justify-content: flex-start; }
  .climbing-quick-plan { width: 100%; }
  .climbing-quick-plan ol { border-block: 1px solid var(--border-soft); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); list-style: none; margin: var(--space-3) 0 0; padding: 0; }
  .climbing-quick-plan li { display: flex; flex-direction: column; min-width: 0; padding: var(--space-3); }
  .climbing-quick-plan li + li { border-left: 1px solid var(--border-soft); }
  .climbing-quick-plan .field-link { margin-top: var(--space-2); }
  .climbing-lightning-note { align-items: center; background: var(--text-primary); color: var(--surface-canvas); display: grid; gap: 1.25rem; grid-template-columns: auto minmax(0, 1fr); margin-bottom: var(--space-7); padding: 1rem var(--space-4); }
  .climbing-lightning-note p { max-width: 60rem; }
  .climbing-weather-ledger { align-items: stretch; background: var(--surface-subtle); border-block: 2px solid var(--text-primary); display: grid; grid-template-columns: minmax(18rem, 0.9fr) minmax(22rem, 1.1fr); margin-top: var(--space-7); }
  .climbing-weather-ledger > div { display: flex; flex-direction: column; gap: var(--space-3); justify-content: center; padding: var(--space-5); }
  .climbing-weather-ledger > div > a { font-size: var(--type-label); font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; text-underline-offset: 0.25rem; }
  .climbing-weather-ledger .climbing-weather-facts { border: 0; border-left: 1px solid var(--border-soft); grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .climbing-group + .climbing-group { margin-top: var(--space-7); }
  .climbing-group-heading { align-items: end; border-bottom: 2px solid var(--text-primary); display: grid; gap: var(--space-7); grid-template-columns: minmax(18rem, 0.85fr) minmax(18rem, 1.15fr); padding-bottom: 1.5rem; }
  .climbing-group-heading > p { justify-self: end; max-width: 31rem; }
  .climbing-sector-grid { list-style: none; margin: 0; padding: 0; }
  .climbing-sector-card { border-bottom: 1px solid var(--text-primary); display: grid; grid-template-columns: 4.5rem minmax(18rem, 1.35fr) minmax(16rem, 0.65fr) 10rem; min-height: 0; }
  .climbing-sector-card > * { padding: var(--space-4); }
  .climbing-sector-card > * + * { border-left: 1px solid var(--border-soft); }
  .climbing-sector-copy, .climbing-sector-facts { display: flex; flex-direction: column; justify-content: center; }
  .climbing-sector-facts { margin: 0; }
  .climbing-sector-facts > div + div { border-top: 1px solid var(--border-soft); margin-top: 0.8rem; padding-top: 0.8rem; }
  .climbing-sector-link { align-items: flex-end; display: flex; justify-content: flex-end; }
  .climbing-boundary { border-block: 2px solid var(--text-primary); display: grid; gap: var(--space-7); grid-template-columns: minmax(18rem, 0.85fr) minmax(20rem, 1.15fr); margin-top: var(--space-7); padding-block: var(--space-7); }
  .climbing-boundary > div:last-child { max-width: 38rem; }
  .climbing-boundary > div:last-child p + p { margin-top: 1rem; }

  .climbing-sector-title { justify-content: flex-end; }
  .climbing-grade-panel { background: var(--text-primary); color: var(--surface-canvas); gap: var(--space-3); justify-content: flex-end; }
  .climbing-sector-status { border-bottom: 1px solid var(--text-primary); display: grid; grid-template-columns: minmax(18rem, 0.8fr) minmax(22rem, 1.2fr); }
  .climbing-status-lead, .climbing-status-detail { padding: var(--space-5); }
  .climbing-status-detail { border-left: 1px solid var(--text-primary); }
  .climbing-status-detail > p + p { margin-top: 1rem; }
  .climbing-status-links { display: flex; flex-wrap: wrap; gap: 0.5rem 1.5rem; margin-top: 1.5rem; }
  .climbing-inspection { display: grid; gap: var(--space-7); grid-template-columns: minmax(18rem, 0.7fr) minmax(24rem, 1.3fr); margin-block: var(--space-7); }
  .climbing-inspection header > p:last-child { margin-top: 1rem; max-width: 30rem; }
  .climbing-inspection ol { border-top: 2px solid var(--text-primary); list-style: none; margin: 0; padding: 0; }
  .climbing-inspection li { border-bottom: 1px solid var(--text-primary); display: grid; gap: 1.2rem; grid-template-columns: 3rem minmax(0, 1fr); padding-block: 1.4rem; }
  .climbing-data-note { background: var(--text-primary); color: var(--surface-canvas); display: grid; grid-template-columns: minmax(18rem, 0.8fr) minmax(22rem, 1.2fr); }
  .climbing-data-note > div, .climbing-data-note > dl { padding: var(--space-5); }
  .climbing-data-note dl { border-left: 1px solid color-mix(in oklch, var(--surface-canvas) 25%, transparent); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; }
  .climbing-data-note dl div { padding: 1rem; }
  .climbing-data-note dl div:nth-child(even) { border-left: 1px solid color-mix(in oklch, var(--surface-canvas) 25%, transparent); }
  .climbing-data-note dl div:nth-child(n+3) { border-top: 1px solid color-mix(in oklch, var(--surface-canvas) 25%, transparent); }
  .climbing-related { margin-top: var(--space-7); }
  .climbing-related-heading { align-items: end; border-bottom: 2px solid var(--text-primary); display: flex; justify-content: space-between; padding-bottom: 1rem; }
  .climbing-related-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .climbing-related-card { display: flex; flex-direction: column; min-height: 0; padding: 1.25rem; text-decoration: none; }
  .climbing-related-card + .climbing-related-card { border-left: 1px solid var(--text-primary); }
}

@layer components {
  .climbing-kicker { color: var(--climb-accent); display: flex; font-size: var(--type-label); font-weight: 850; justify-content: space-between; letter-spacing: 0.11em; text-transform: uppercase; }
  .climbing-deck { border-left: 0.42rem solid var(--climb-accent); padding-left: 1.2rem; }
  .climbing-deck strong { color: var(--climb-accent); font-weight: 650; }
  .climbing-weather-status { align-items: center; display: flex; font-size: var(--type-label); font-weight: 850; gap: 0.5rem; letter-spacing: 0.08em; text-transform: uppercase; }
  .climbing-weather-status > span { color: var(--climb-accent); font-family: var(--font-serif); font-size: 1.45rem; line-height: 0.7; }
  .climbing-weather-facts { border: 1px solid var(--border-soft); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; width: 100%; }
  .climbing-weather-facts > div { min-width: 0; padding: 0.55rem 0.7rem; }
  .climbing-weather-facts > div:nth-child(even) { border-left: 1px solid var(--border-soft); }
  .climbing-weather-facts > div:nth-child(n+3) { border-top: 1px solid var(--border-soft); }
  .climbing-weather-facts dt { color: var(--text-secondary); font-size: var(--type-label); font-weight: 850; letter-spacing: 0.07em; text-transform: uppercase; }
  .climbing-weather-facts dd { font-family: var(--font-serif); font-size: 0.78rem; line-height: 1.2; margin-top: 0.15rem; }
  .climbing-weather-facts--sector { border-color: color-mix(in oklch, var(--surface-canvas) 24%, transparent); }
  .climbing-weather-facts--sector > div:nth-child(even) { border-left-color: color-mix(in oklch, var(--surface-canvas) 24%, transparent); }
  .climbing-weather-facts--sector > div:nth-child(n+3) { border-top-color: color-mix(in oklch, var(--surface-canvas) 24%, transparent); }
  .climbing-weather-facts--sector dt { color: color-mix(in oklch, var(--surface-canvas) 72%, transparent); }
  .climbing-weather-facts--sector dd { color: var(--surface-canvas); }
  .climbing-quick-plan li a { font-family: var(--font-serif); font-size: 1.05rem; font-weight: 650; line-height: 1.1; text-underline-offset: 0.2rem; }
  .climbing-quick-plan li span { color: var(--text-secondary); font-size: var(--type-label); font-weight: 800; letter-spacing: 0.06em; margin-top: auto; padding-top: var(--space-2); text-transform: uppercase; }
  .climbing-shortlist-withheld { color: var(--text-secondary); font-family: var(--font-serif); margin-top: var(--space-2); }
  .climbing-source-state { color: var(--text-secondary); display: flex; flex-wrap: wrap; font-size: var(--type-label); gap: 0.25rem 0.65rem; justify-content: space-between; margin-top: var(--space-2); }
  .climbing-source-state b, .climbing-evidence-time strong { color: inherit; font-family: var(--font-sans); font-size: inherit; font-weight: 850; letter-spacing: 0.06em; text-transform: uppercase; }
  .climbing-source-state b { display: block; }
  .climbing-masthead-links { display: flex; flex-wrap: wrap; font-size: var(--type-label); font-weight: 800; gap: 0.5rem 1.25rem; margin-top: var(--space-2); text-transform: uppercase; }
  .climbing-evidence-time { color: var(--text-secondary); font-family: var(--font-sans); font-size: var(--type-label); }
  .climbing-warning-mark { color: var(--climb-accent); font-family: var(--font-serif); font-size: 3rem; line-height: 1; }
  .climbing-lightning-note p { font-family: var(--font-serif); font-size: 0.95rem; }
  .climbing-lightning-note strong { color: inherit; }
  .climbing-weather-ledger h2 { font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; letter-spacing: -0.035em; line-height: 1.05; }
  .climbing-weather-ledger > div > p:not(.eyebrow) { color: var(--text-secondary); font-family: var(--font-serif); }
  .climbing-group-heading h2 { font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; letter-spacing: -0.035em; line-height: 1.05; margin-top: 0.65rem; }
  .climbing-group-heading > p { color: var(--text-secondary); font-family: var(--font-serif); font-size: 1rem; }
  .climbing-sector-number { color: var(--climb-accent); font-family: var(--font-serif); font-size: 1.2rem; }
  .climbing-sector-place { color: var(--text-secondary); font-size: var(--type-label); font-weight: 850; letter-spacing: 0.08em; text-transform: uppercase; }
  .climbing-sector-copy h3 { font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; letter-spacing: -0.035em; line-height: 1.05; margin-block: 0.55rem 0.7rem; }
  .climbing-sector-copy h3 a { text-decoration: none; }
  .climbing-sector-copy h3 a:hover { color: var(--climb-accent); }
  .climbing-sector-profile { color: var(--text-secondary); font-family: var(--font-serif); font-size: 0.82rem; }
  .climbing-sector-facts dt { color: var(--text-secondary); font-size: var(--type-label); font-weight: 850; letter-spacing: 0.08em; text-transform: uppercase; }
  .climbing-sector-facts dd { font-family: var(--font-serif); font-size: 1.08rem; margin-top: 0.15rem; }
  .climbing-sector-facts dd:last-child, .climbing-access-state { align-items: center; display: flex; gap: 0.45rem; }
  .access-pip { background: var(--climb-accent); border: 1px solid currentColor; border-radius: 50%; display: inline-block; flex: 0 0 auto; height: 0.65rem; width: 0.65rem; }
  .climbing-sector-link { font-size: var(--type-label); font-weight: 850; letter-spacing: 0.06em; text-align: right; text-decoration-thickness: 1px; text-transform: uppercase; text-underline-offset: 0.25rem; }
  .climbing-sector-card--closed { background: color-mix(in oklch, var(--availability-closed) 8%, var(--surface-canvas)); --climb-accent: var(--availability-closed); }
  .climbing-boundary h2 { font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; letter-spacing: -0.035em; line-height: 1.05; margin-top: 0.6rem; }
  .climbing-boundary > div:last-child { color: var(--text-secondary); font-family: var(--font-serif); font-size: 1rem; }

  .climbing-breadcrumb { color: var(--text-secondary); font-size: var(--type-label); font-weight: 800; letter-spacing: 0.07em; margin-top: auto; text-transform: uppercase; }
  .climbing-sector-title h1 { font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; letter-spacing: -0.035em; line-height: 1.05; margin-top: 1rem; max-width: 9ch; text-wrap: balance; }
  .climbing-grade-panel > p, .climbing-grade-panel > span { font-size: var(--type-label); font-weight: 850; letter-spacing: 0.09em; text-transform: uppercase; }
  .climbing-grade-panel > span { color: color-mix(in oklch, var(--surface-canvas) 76%, transparent); }
  .climbing-grade-panel > span strong { color: inherit; font-family: var(--font-serif); font-size: 1.45rem; font-weight: 500; letter-spacing: -0.035em; text-transform: none; }
  .climbing-grade-panel h2 { font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; letter-spacing: -0.035em; line-height: 1.05; max-width: 15ch; text-wrap: balance; }
  .climbing-grade-panel .climbing-access-state { color: var(--surface-canvas); }
  .climbing-status-lead h2, .climbing-inspection h2, .climbing-data-note h2, .climbing-related h2 { font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; letter-spacing: -0.035em; line-height: 1.05; margin-top: 0.6rem; }
  .climbing-status-detail { color: var(--text-secondary); font-family: var(--font-serif); }
  .climbing-access-state { color: var(--text-primary); font-family: var(--font-sans); font-size: var(--type-label); font-weight: 850; letter-spacing: 0.07em; text-transform: uppercase; }
  .climbing-sector-status--closed { background: color-mix(in oklch, var(--availability-closed) 8%, var(--surface-canvas)); --climb-accent: var(--availability-closed); }
  .climbing-status-links a { align-items: center; display: inline-flex; font-family: var(--font-sans); font-size: var(--type-label); font-weight: 850; letter-spacing: 0.055em; min-height: 2.75rem; text-transform: uppercase; text-underline-offset: 0.25rem; }
  .climbing-inspection header > p:last-child { color: var(--text-secondary); font-family: var(--font-serif); }
  .climbing-inspection li > span { color: var(--climb-accent); font-family: var(--font-serif); font-size: 1.2rem; }
  .climbing-inspection h3 { font-family: var(--font-serif); font-size: 1.6rem; font-weight: 500; letter-spacing: -0.035em; line-height: 1; }
  .climbing-inspection li p { color: var(--text-secondary); font-family: var(--font-serif); font-size: 0.88rem; margin-top: 0.45rem; }
  .climbing-data-note .eyebrow { color: color-mix(in oklch, var(--surface-canvas) 82%, transparent); }
  .climbing-data-note dt { color: color-mix(in oklch, var(--surface-canvas) 82%, transparent); font-size: var(--type-label); font-weight: 850; letter-spacing: 0.08em; text-transform: uppercase; }
  .climbing-data-note dd { font-family: var(--font-serif); font-size: 0.9rem; line-height: 1.35; margin-top: 0.25rem; }
  .climbing-related-card span { color: var(--text-secondary); font-size: var(--type-label); font-weight: 850; letter-spacing: 0.08em; text-transform: uppercase; }
  .climbing-related-card strong { font-family: var(--font-serif); font-size: clamp(1.7rem, 3vw, 2.8rem); font-weight: 500; letter-spacing: -0.045em; line-height: 0.95; margin-block: auto; }
  .climbing-related-card small { color: var(--text-secondary); font-family: var(--font-serif); }
  .climbing-related-card:hover { background: var(--text-primary); color: var(--surface-canvas); }
  .climbing-related-card:hover span, .climbing-related-card:hover small { color: color-mix(in oklch, var(--surface-canvas) 67%, transparent); }
}

@layer utilities {
  @media (max-width: 68rem) {
    .climbing-sector-card { grid-template-columns: 4rem minmax(16rem, 1fr) minmax(14rem, 0.7fr); }
    .climbing-sector-link { border-left: 1px solid var(--border-soft); border-top: 1px solid var(--border-soft); grid-column: 2 / -1; justify-content: flex-start; min-height: 3.5rem; }
  }

  @media (max-width: 48rem) {
    .climbing-masthead-title .field-title { font-size: var(--type-title); max-width: none; }
    .climbing-deck { margin-top: 0; }
    .climbing-quick-plan ol { grid-template-columns: 1fr; }
    .climbing-quick-plan li + li { border-left: 0; border-top: 1px solid var(--border-soft); }
    .climbing-source-state { display: grid; }
    .climbing-group-heading h2 { font-size: var(--type-title); line-height: 1.05; }
    .climbing-group-heading, .climbing-boundary, .climbing-sector-status, .climbing-inspection, .climbing-data-note, .climbing-weather-ledger { grid-template-columns: 1fr; }
    .climbing-group-heading { align-items: start; gap: 1.25rem; }
    .climbing-group-heading > p { justify-self: start; }
    .climbing-sector-card { grid-template-columns: 3.5rem minmax(0, 1fr); }
    .climbing-sector-facts { border-left: 1px solid var(--border-soft); border-top: 1px solid var(--border-soft); grid-column: 2; }
    .climbing-sector-link { grid-column: 2; }
    .field-masthead--compact .climbing-sector-title { min-height: 0; }
    .climbing-status-detail, .climbing-data-note > dl { border-left: 0; border-top: 1px solid var(--text-primary); }
    .climbing-inspection { gap: 2rem; }
    .climbing-data-note dl { grid-template-columns: 1fr; }
    .climbing-data-note dl div:nth-child(even) { border-left: 0; }
    .climbing-data-note dl div + div { border-top: 1px solid color-mix(in oklch, var(--surface-canvas) 25%, transparent); }
    .climbing-related-heading { align-items: flex-start; flex-direction: column; gap: 0.5rem; }
    .climbing-related-grid { grid-template-columns: 1fr; }
    .climbing-related-card { min-height: 10rem; }
    .climbing-related-card + .climbing-related-card { border-left: 0; border-top: 1px solid var(--text-primary); }
    .climbing-weather-ledger .climbing-weather-facts { border-left: 0; border-top: 1px solid var(--border-soft); }
  }

  @media (prefers-reduced-motion: reduce) {
    .climbing-sector-grid > li { animation: none; }
  }
}

@keyframes today-step-back {
  from { opacity: 0; transform: translateX(-1rem); }
  to { opacity: 1; transform: translateX(0); }
}

@keyframes today-results-reveal {
  from { opacity: 0; transform: translateY(0.75rem); }
  to { opacity: 1; transform: translateY(0); }
}

@layer layout {
  main, .site-footer { margin-inline: auto; max-width: 86rem; width: calc(100% - 3rem); }
  /* Masthead: one compact row that names the place. Its lower edge is the gorge rim,
     so the bridge never needs a row of its own. The rim is decoration. */
  .site-masthead { color: var(--masthead-text); }
  .site-masthead-band { background: var(--masthead-surface); }
  .site-header {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-3);
    justify-content: space-between;
    margin-inline: auto;
    max-width: 86rem;
    padding-top: 0.625rem;
    width: calc(100% - 3rem);
  }
  /* A zero basis lets the descriptor wrap first; the nav drops to its own line only when enlarged text leaves no room for the name. */
  .wordmark { align-content: center; align-items: baseline; color: var(--masthead-text); display: flex; flex: 1 1 0; flex-wrap: wrap; gap: 0 0.875rem; min-height: 2.75rem; text-decoration: none; }
  .wordmark-name { font-family: var(--font-serif); font-size: 1.875rem; font-weight: 500; letter-spacing: -0.015em; line-height: 1.05; white-space: nowrap; }
  .wordmark-place { color: var(--masthead-line); font-family: var(--font-serif); font-size: 0.9375rem; font-style: italic; line-height: 1.3; text-wrap: balance; }
  .masthead-rim { display: flex; height: 1.875rem; margin-top: -1px; }
  .masthead-rim svg { display: block; height: 100%; }
  .masthead-rim-side { min-width: 0; }
  .masthead-rim-side--start { flex: 1.25 1 0; }
  .masthead-rim-side--end { flex: 1 1 0; }
  /* Size the gorge from its height so the drawing never letterboxes and lets the page show through. */
  .masthead-rim-gorge { aspect-ratio: 132 / 24; flex: none; margin-inline: -1px; width: auto; }
  .masthead-rim-fill { fill: var(--masthead-surface); }
  .masthead-rim-line { fill: none; stroke: var(--masthead-line); stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.25; vector-effect: non-scaling-stroke; }
  .masthead-rim-deck { stroke-width: 1.75; }
  .masthead-rim-strut { stroke-width: 1; }
  .masthead-rim-water { opacity: 0.6; stroke: var(--masthead-text); }

  .site-nav { display: flex; flex: none; font-size: 0.8125rem; font-weight: 700; gap: var(--space-1); letter-spacing: 0.08em; margin-right: -0.375rem; text-transform: uppercase; }
  .site-nav a { align-items: center; color: var(--masthead-text); display: inline-flex; min-height: 2.75rem; padding-inline: 0.375rem; text-decoration: none; text-decoration-thickness: 2px; text-underline-offset: 0.45rem; }
  .site-nav a:hover, .site-nav a[aria-current="page"] { text-decoration: underline; }
  .site-masthead a:focus-visible { outline: 3px solid var(--masthead-text); outline-offset: 3px; }
  .site-nav[hidden] { display: none !important; }
  main { padding-block: var(--space-5); }
  .river-page { padding-top: var(--space-4); }
  .run-switcher { border-bottom: 1px solid var(--text-primary); border-top: 1px solid var(--text-primary); margin-bottom: var(--space-7); }
  .river-page .run-switcher { margin-bottom: var(--space-7); }
  .run-switcher-groups { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .run-switcher-group { min-width: 0; }
  .run-switcher-group + .run-switcher-group { border-left: 1px solid var(--text-primary); }
  .run-switcher-group h2 { border-bottom: 1px solid var(--border-soft); color: var(--text-secondary); font: 800 var(--type-label)/1 var(--font-sans); letter-spacing: 0.13em; padding: 0.65rem 0.9rem; text-transform: uppercase; }
  .run-switcher-group > div { display: grid; grid-template-columns: repeat(var(--run-count), minmax(0, 1fr)); }
  .river-decision { border: 1px solid var(--text-primary); border-top: 0.45rem solid var(--decision-accent); box-shadow: 0.55rem 0.55rem 0 var(--activity-water-deep); margin: 0 0.55rem clamp(1.75rem, 3vw, 2.5rem) 0; }
  .river-decision-header { align-items: end; display: flex; justify-content: space-between; padding: clamp(0.8rem, 1.5vw, 1.15rem); }
  .river-decision-body { border-top: 1px solid var(--text-primary); }
  .river-verdict.page-spread__page { padding: var(--space-4); }
  .river-decision-evidence { display: block; }
  .river-binary-claims { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; }
  .river-binary-claim { padding: 0.85rem 1rem; }
  .river-binary-claim + .river-binary-claim { border-left: 1px solid var(--border-soft); }
  .river-decision-footer { align-items: center; border-top: 1px solid var(--text-primary); display: flex; gap: 2rem; justify-content: space-between; padding: 0.75rem 1rem; }
  .conditions-board { border: 1px solid var(--text-primary); box-shadow: 0.55rem 0.55rem 0 var(--activity-water-deep); margin-right: 0.55rem; }
  .level-scale { border-top: 1px solid var(--text-primary); padding: var(--space-4); }
  .gauge-chart { border-top: 1px solid var(--text-primary); min-width: 0; padding: var(--space-4); }
  .observation-meta { border-top: 1px solid var(--text-primary); display: grid; grid-template-columns: repeat(2, 1fr); }
  .observation-meta--with-stage { grid-template-columns: repeat(3, 1fr); }
  .observation-meta div { padding: 1rem 1.25rem; }
  .observation-meta div + div { border-left: 1px solid var(--border-soft); }

  .access-board { margin-block: var(--space-7); }
  .access-board-heading { align-items: end; border-bottom: 2px solid var(--text-primary); display: grid; gap: 3rem; grid-template-columns: minmax(18rem, 0.85fr) minmax(20rem, 1.15fr); padding-bottom: 1.5rem; }
  .access-board-heading > p { justify-self: end; max-width: 35rem; }
  .access-route { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .access-card { display: flex; flex-direction: column; min-width: 0; }
  .access-card + .access-card { border-left: 1px solid var(--text-primary); }
  .access-card-body { flex: 1; }

  .shuttle-board { border-bottom: 1px solid var(--text-primary); border-top: 2px solid var(--text-primary); display: grid; grid-template-columns: minmax(14rem, 0.65fr) minmax(20rem, 1.35fr); margin-block: var(--space-7); }
  .shuttle-board > div, .shuttle-card { padding: var(--space-4); }
  .shuttle-card { border-left: 1px solid var(--text-primary); }
  .release-board { border-bottom: 1px solid var(--text-primary); border-top: 2px solid var(--text-primary); margin-block: var(--space-7); padding: var(--space-4); }
  .play-board { border-bottom: 1px solid var(--text-primary); border-top: 2px solid var(--text-primary); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-block: var(--space-7); }
  .play-board > div { padding: var(--space-4); }
  .play-board-list { border-left: 1px solid var(--text-primary); }
  .play-board-list article + article { border-top: 1px solid var(--border-soft); margin-top: 1.25rem; padding-top: 1.25rem; }

  .judgment-call {
    border-left: 0.65rem solid var(--activity-climb);
    display: grid;
    gap: 0.75rem;
    grid-template-columns: 10rem minmax(12rem, 0.72fr) minmax(16rem, 1.28fr);
    margin-block: var(--space-7);
    padding: 0.5rem 0 0.5rem var(--space-4);
  }

  .field-notes { border-top: 2px solid var(--text-primary); display: grid; grid-template-columns: 0.65fr repeat(4, 1fr); }
  .field-notes--compact { grid-template-columns: 0.65fr repeat(2, 1fr); }
  .field-notes > div { padding: 1.5rem 1.25rem; }
  .field-notes > div + div { border-left: 1px solid var(--border-soft); }


  .trail-masthead { --field-accent: var(--activity-trail); }
  .activity-fit { align-items: end; border-bottom: 2px solid var(--text-primary); display: grid; gap: 2rem; grid-template-columns: 0.8fr 1.2fr; padding-block: 1.5rem; }
  .activity-fit ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); list-style: none; margin: 0; padding: 0; }
  .activity-fit-item { min-height: 5rem; }
  .activity-fit-item + .activity-fit-item { border-left: 1px solid var(--border-soft); }
  .trail-condition-board { border: 1px solid var(--text-primary); box-shadow: 0.55rem 0.55rem 0 var(--activity-trail); margin: var(--space-7) 0.55rem 0 0; }
  .trail-condition-summary { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(20rem, 0.85fr); }
  .trail-today, .trail-segment-card { padding: var(--space-5); }
  .trail-segment-card { border-left: 1px solid var(--text-primary); }
  .trail-week { border-top: 1px solid var(--text-primary); padding: var(--space-4); }
  .trail-week-heading { align-items: end; display: flex; justify-content: space-between; }
  .trail-week ol { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); list-style: none; margin: 1.35rem 0 0; padding: 0; }
  .trail-day { min-height: 8.5rem; }
  .trail-day + .trail-day { border-left: 1px solid var(--text-primary); }
  .trail-alternate { border-bottom: 1px solid var(--text-primary); border-top: 1px solid var(--text-primary); display: grid; gap: var(--space-7); grid-template-columns: 0.9fr 1.1fr; margin-block: var(--space-7); padding-block: var(--space-7); }
  .trail-source { border: 1px solid var(--text-primary); display: grid; grid-template-columns: 0.9fr 1.6fr; }
  .trail-source > div, .trail-source > dl { padding: var(--space-4); }
  .trail-source > dl { border-left: 1px solid var(--text-primary); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; }
  .trail-source > a { border-top: 1px solid var(--text-primary); grid-column: 1 / -1; }
  .spot-masthead { --field-accent: var(--activity-water); }
  .spot-list { border-top: 2px solid var(--text-primary); margin-top: var(--space-7); }
  .spot-search { border: 1px solid var(--text-primary); margin-bottom: 2rem; padding: 1rem; }
  .spot-masthead .spot-search { margin: clamp(1.5rem, 4vw, 3rem) 0 0; }
  .field-masthead--compact.spot-masthead .spot-search { margin-top: var(--space-4); }
  .spot-search > label { display: block; font-size: var(--type-label); font-weight: 850; letter-spacing: 0.08em; margin-bottom: 0.5rem; text-transform: uppercase; }
  .spot-search > div { display: flex; }
  .spot-search input { background: transparent; border: 0; border-bottom: 1px solid var(--text-primary); border-radius: 0; color: var(--text-primary); flex: 1; font: inherit; min-height: 3rem; padding: 0.6rem; }
  .spot-search input:focus { outline: 3px solid var(--activity-climb); outline-offset: 2px; }
  .spot-search input[type="submit"] { background: var(--activity-water-deep); border: 0; color: var(--surface-canvas); flex: 0 0 auto; font-size: var(--type-label); font-weight: 850; letter-spacing: 0.07em; padding-inline: 1.25rem; text-transform: uppercase; }
  .spot-list-heading { align-items: end; display: flex; justify-content: space-between; padding-block: 1.25rem; }
  .spot-list-card { border-top: 1px solid var(--text-primary); display: grid; grid-template-columns: 1.2fr 0.8fr; }
  .spot-list-card > div { padding: var(--space-4); }
  .spot-list-card > div + div { border-left: 1px solid var(--border-soft); }
  .spot-access-key { border-block: 2px solid var(--text-primary); display: grid; grid-template-columns: minmax(16rem, 0.55fr) minmax(0, 1.45fr); margin-top: var(--space-7); }
  .spot-access-key-intro { padding: var(--space-4); }
  .spot-access-key ol { border-left: 1px solid var(--text-primary); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); list-style: none; margin: 0; padding: 0; }
  .spot-access-key li { min-height: 10rem; }
  .spot-access-key li + li { border-left: 1px solid var(--border-soft); }
  .spot-access-key li a { display: flex; flex-direction: column; height: 100%; padding: 1rem; text-decoration: none; }
  .spot-access-key li a:hover { background: color-mix(in oklch, var(--activity-water) 9%, transparent); }
  .spot-guide-group { scroll-margin-top: var(--space-4); }
  .spot-stop-note { background: color-mix(in oklch, var(--availability-closed) 8%, var(--surface-canvas)); border-bottom: 1px solid var(--text-primary); display: grid; gap: clamp(1.2rem, 3vw, 3rem); grid-template-columns: 4rem minmax(16rem, 0.75fr) minmax(20rem, 1.25fr); margin-block: var(--space-7); padding: var(--space-4); }
  .spot-guide-group + .spot-guide-group { margin-top: var(--space-7); }
  .spot-guide-heading { align-items: end; border-bottom: 2px solid var(--text-primary); display: grid; gap: clamp(1.2rem, 4vw, 4rem); grid-template-columns: 4rem minmax(17rem, 0.85fr) minmax(20rem, 1.15fr); padding-bottom: 1.5rem; }
  .spot-guide-heading > p:last-child { justify-self: end; max-width: 35rem; }
  .spot-guide-card { border-bottom: 1px solid var(--text-primary); display: grid; grid-template-columns: 4.5rem minmax(18rem, 0.78fr) minmax(22rem, 1.22fr); }
  .spot-guide-card-index, .spot-guide-card-main, .spot-guide-facts { padding: var(--space-4); }
  .spot-guide-card-main, .spot-guide-facts { border-left: 1px solid var(--border-soft); }
  .spot-guide-card-main { display: flex; flex-direction: column; }
  .spot-guide-facts { margin: 0; }
  .spot-guide-facts > div + div { border-top: 1px solid var(--border-soft); margin-top: 1rem; padding-top: 1rem; }
  .spot-guide-sources { align-items: center; border-left: 1px solid var(--border-soft); border-top: 1px solid var(--border-soft); display: flex; flex-wrap: wrap; gap: 0.2rem 1.25rem; grid-column: 2 / -1; min-height: 3.75rem; padding: 0.45rem var(--space-4); }
  .spot-guide-group--car_fast .spot-guide-card { background: color-mix(in oklch, var(--activity-water) 5%, var(--surface-canvas)); }
  .spot-guide-group--expedition .spot-guide-card { background: repeating-linear-gradient(135deg, transparent 0 15px, color-mix(in oklch, var(--activity-climb) 4%, transparent) 15px 16px); }
  .spot-empty { border-block: 2px solid var(--text-primary); margin-block: var(--space-7); padding: var(--space-7); }
  .spot-condition-board { border: 1px solid var(--text-primary); box-shadow: 0.55rem 0.55rem 0 var(--activity-water-deep); margin-right: 0.55rem; }
  .spot-condition-summary { display: grid; grid-template-columns: 0.9fr 1.1fr; }
  .spot-condition-summary > div { padding: var(--space-5); }
  .spot-verdict { border-left: 1px solid var(--border-soft); }
  .spot-stage-history { border-top: 1px solid var(--text-primary); display: grid; grid-template-columns: repeat(3, 1fr); margin: 0; }
  .spot-stage-history > div { padding: 1rem 1.25rem; }
  .spot-stage-history > div + div { border-left: 1px solid var(--border-soft); }
  .spot-evidence { border-top: 2px solid var(--text-primary); display: grid; grid-template-columns: 0.75fr repeat(2, 1fr); margin-block: var(--space-7); }
  .spot-evidence > div, .spot-evidence > article { padding: var(--space-4); }
  .spot-evidence > * + * { border-left: 1px solid var(--border-soft); }
  .site-footer { border-top: 1px solid var(--border-soft); display: flex; font-size: 0.78rem; justify-content: space-between; padding-block: 1.4rem 2rem; }
  .site-footer-link { align-items: center; display: inline-flex; min-height: 2.75rem; text-underline-offset: 0.2em; }

  .page-masthead--compact { max-width: 58rem; padding-bottom: var(--space-5); }

  .today-masthead { align-items: end; display: grid; gap: var(--space-7); grid-template-columns: minmax(0, 1.35fr) minmax(18rem, 0.65fr); padding-bottom: var(--space-7); }
  .today-snapshot { border-top: 1px solid var(--border-soft); }
  .today-snapshot > p { padding-block: var(--space-3); }
  .today-snapshot ol { border-bottom: 1px solid var(--border-strong); list-style: none; margin: 0; padding: 0; }
  .today-snapshot-item { --today-state: var(--text-secondary); display: grid; gap: 0.1rem var(--space-3); grid-template-columns: 5rem minmax(0, 1fr); padding-block: var(--space-2); }
  .today-snapshot-item + .today-snapshot-item { border-top: 1px solid var(--border-soft); }
  .today-snapshot-item--ready { --today-state: var(--availability-open); }
  .today-snapshot-item--caution { --today-state: var(--availability-limited); }
  .today-snapshot-item--blocked { --today-state: var(--availability-closed); }
  .today-snapshot-item a, .today-snapshot-status { grid-column: 2; }
  turbo-frame { display: block; }
  .today-wizard { border-block: 2px solid var(--text-primary); display: grid; grid-template-columns: minmax(14rem, 0.38fr) minmax(0, 1fr); min-height: 30rem; }
  .today-wizard-rail { background: var(--activity-water-deep); color: var(--surface-canvas); display: flex; flex-direction: column; padding: var(--space-4); }
  .today-wizard-rail ol { list-style: none; margin: 2rem 0; padding: 0; }
  .today-wizard-progress { display: grid; gap: 0.9rem; grid-template-columns: 2.5rem 1fr; padding-block: 1rem; }
  .today-wizard-progress + .today-wizard-progress { border-top: 1px solid color-mix(in oklch, var(--surface-canvas) 24%, transparent); }
  .today-wizard-privacy { margin-top: auto; }
  .today-wizard-stage { min-width: 0; padding: var(--space-4); transition: opacity 120ms ease, transform 120ms ease; }
  .today-wizard-options { border: 0; margin: clamp(1.25rem, 3vw, 2.5rem) 0 0; min-width: 0; padding: 0; }
  .today-wizard-actions { align-items: center; border-top: 1px solid var(--border-soft); display: flex; justify-content: space-between; margin-top: 1rem; padding-top: 1rem; }
  .today-index--results { padding-top: var(--space-5); }
  .today-index--results .today-masthead { display: none; }
  .today-answer-strip { align-items: center; border-block: 2px solid var(--text-primary); display: grid; grid-template-columns: 0.45fr 2fr 0.55fr; }
  .today-answer-strip > p, .today-start-over { padding: 1.1rem 1.25rem; }
  .today-answer-strip ul { display: grid; grid-template-columns: repeat(3, 1fr); list-style: none; margin: 0; padding: 0; }
  .today-answer-strip li { border-left: 1px solid var(--border-soft); padding: 0.8rem 1.1rem; }
  .today-answer-strip > a { border-left: 1px solid var(--border-soft); }
  .today-results { margin-top: var(--space-7); }
  .today-results--revealed { margin-top: 0; }
  .today-results-heading { align-items: end; border-bottom: 2px solid var(--text-primary); display: grid; gap: 2rem; grid-template-columns: 1fr 1fr; padding-block: var(--space-4); }
  .today-results-heading > p { justify-self: end; max-width: 32rem; }
  .today-card-list { list-style: none; margin: 0; padding: 0; }
  .today-card { --today-state: var(--text-secondary); border-bottom: 1px solid var(--text-primary); display: grid; grid-template-columns: minmax(5rem, 0.16fr) minmax(20rem, 1.35fr) minmax(16rem, 0.55fr); min-height: 0; }
  .today-card--ready { --today-state: var(--availability-open); }
  .today-card--caution { --today-state: var(--availability-limited); }
  .today-card--blocked { --today-state: var(--availability-closed); }
  .today-card--indoor { --today-state: var(--text-primary); }
  .today-card--unknown { --today-state: var(--text-primary); }
  .today-card-context, .today-card-body, .today-card-evidence { padding: var(--space-4); }
  .today-card-context { display: flex; flex-direction: column; justify-content: flex-end; }
  .today-card-body, .today-card-evidence { border-left: 1px solid var(--border-soft); }
  .today-card-evidence { display: flex; flex-direction: column; justify-content: space-between; }
  .today-empty-state { border-bottom: 1px solid var(--text-primary); padding: var(--space-7) var(--space-4); }
  .today-empty-state h2 { font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; letter-spacing: -0.035em; line-height: 1.05; margin-top: var(--space-2); max-width: 48rem; }
  .today-empty-state > p:not(.eyebrow) { color: var(--text-secondary); font-family: var(--font-serif); margin-top: var(--space-4); max-width: 42rem; }
  .today-empty-state > div { align-items: center; display: flex; flex-wrap: wrap; gap: var(--space-4); margin-top: var(--space-5); }
  .today-empty-state a { align-items: center; display: inline-flex; font-size: var(--type-label); font-weight: 850; letter-spacing: 0.055em; min-height: 2.75rem; text-underline-offset: 0.25rem; text-transform: uppercase; }
  .today-empty-state .today-primary-link { background: var(--text-primary); border: 2px solid var(--text-primary); color: var(--surface-canvas); padding: 0.45rem 0.8rem; text-decoration: none; }
  .today-caveat { border-bottom: 1px solid var(--text-primary); border-left: 0.55rem solid var(--activity-climb); font-family: var(--font-serif); padding: 1.1rem 1.25rem; }
}

@layer components {
  .run-switcher > p { color: var(--text-secondary); font-size: var(--type-label); font-weight: 800; letter-spacing: 0.12em; padding: 0.55rem 0; text-transform: uppercase; }
  .run-switcher a { min-height: 3.2rem; padding: 0.8rem 0.9rem; text-decoration: none; }
  .run-switcher-group a + a { border-left: 1px solid var(--border-soft); }
  .run-switcher a:hover { background: color-mix(in oklch, var(--activity-water) 9%, transparent); }
  .run-switcher a.is-current { background: var(--activity-water-deep); color: var(--surface-canvas); font-weight: 800; }
  .river-kicker { color: var(--activity-water-deep); display: flex; font-size: 0.75rem; font-weight: 800; justify-content: space-between; letter-spacing: 0.12em; margin-bottom: 1.25rem; max-width: 39rem; text-transform: uppercase; }
  .river-decision { --decision-accent: var(--text-secondary); }
  .river-decision--conditions_met { --decision-accent: var(--availability-open); }
  .river-decision--verify_access, .river-decision--level_outside_guidance { --decision-accent: var(--availability-limited); }
  .river-decision--access_blocked { --decision-accent: var(--availability-closed); }
  .river-decision-header h1 { font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; letter-spacing: -0.035em; line-height: 1.05; margin-top: 0.2rem; text-wrap: balance; }
  .river-run-meta { color: var(--text-secondary); font-family: var(--font-serif); font-size: 0.85rem; margin-top: 0.4rem; }
  .river-source-stamp { align-items: flex-end; display: flex; flex-direction: column; font-size: var(--type-label); letter-spacing: 0.075em; line-height: 1.45; text-align: right; text-transform: uppercase; }
  .river-source-stamp span { color: var(--text-secondary); }
  .river-verdict-question { color: var(--text-secondary); font-size: var(--type-label); font-weight: 850; letter-spacing: 0.13em; text-transform: uppercase; }
  .river-verdict h2 { font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; letter-spacing: -0.035em; line-height: 1.05; margin-block: 0.4rem 0.8rem; max-width: 15ch; text-wrap: balance; }
  .river-verdict h2 span { color: var(--decision-accent); display: inline-block; font-family: var(--font-sans); font-size: 0.38em; font-weight: 850; letter-spacing: 0; margin-right: 0.32em; vertical-align: 0.25em; }
  .river-verdict > p:last-child { font-family: var(--font-serif); font-size: clamp(0.95rem, 1.5vw, 1.1rem); line-height: 1.45; max-width: 42rem; }
  .river-binary-claim { --claim-color: var(--availability-unknown); }
  .river-binary-claim--yes { --claim-color: var(--availability-open); background: color-mix(in oklch, var(--availability-open) 9%, var(--surface-canvas)); }
  /* Outside the published range is a band fact, not a closure: clay, not red. */
  .river-binary-claim--no { --claim-color: var(--availability-limited); background: color-mix(in oklch, var(--availability-limited) 9%, var(--surface-canvas)); }
  .river-binary-claim dt { color: var(--text-secondary); font-size: var(--type-label); font-weight: 850; letter-spacing: 0.1em; text-transform: uppercase; }
  .river-binary-claim > .river-hero-status { align-items: center; display: flex; font-family: var(--font-serif); font-size: clamp(1.35rem, 2.1vw, 1.85rem); gap: 0.4rem; letter-spacing: -0.035em; line-height: 1; margin-top: 0.25rem; }
  .river-binary-claim > dd > span { color: var(--claim-color); font-family: var(--font-sans); font-size: 0.72em; font-weight: 850; }
  .river-binary-note { color: var(--text-secondary); font-size: var(--type-label); line-height: 1.35; margin-top: 0.35rem; }
  .river-decision-footer p { color: var(--text-secondary); font-family: var(--font-serif); font-size: 0.78rem; }
  .river-decision-footer a { flex: 0 0 auto; font-size: var(--type-label); font-weight: 850; letter-spacing: 0.09em; min-height: 2.75rem; padding: 0.75rem 0.25rem; text-transform: uppercase; text-underline-offset: 0.25rem; }

  .freshness-strip { align-items: center; border-bottom: 1px solid var(--text-primary); display: flex; font-size: 0.75rem; gap: 0.7rem; letter-spacing: 0.055em; padding: 0.75rem 1rem; text-transform: uppercase; }
  .freshness-strip--current { background: color-mix(in oklch, var(--freshness-current) 16%, var(--surface-canvas)); }
  .freshness-strip--stale { background: color-mix(in oklch, var(--freshness-stale) 15%, var(--surface-canvas)); }
  .freshness-strip--unknown { background: color-mix(in oklch, var(--freshness-unknown) 12%, var(--surface-canvas)); }

  .reading-label, .eyebrow, .observation-meta dt { color: var(--text-secondary); font-size: 0.75rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; }
  .reading-value { font-family: var(--font-serif); font-size: var(--type-display); letter-spacing: -0.07em; line-height: 0.92; margin-block: 0.35rem 1.25rem; }
  .reading-value span { font-family: var(--font-sans); font-size: var(--type-small); font-weight: 700; letter-spacing: 0.02em; text-transform: uppercase; }
  .primary-source-note { color: var(--text-secondary); font-family: var(--font-serif); font-size: 0.82rem; line-height: 1.35; margin: -0.6rem 0 1.15rem; max-width: 21rem; }

  .trip-readiness { border-top: 1px solid var(--border-soft); font-family: var(--font-serif); font-size: 0.9rem; line-height: 1.38; margin: 0; padding: 0.75rem 1rem; }

  .level-scale-heading { align-items: end; display: flex; justify-content: space-between; }
  .level-scale-heading h2 { font-family: var(--font-serif); font-size: clamp(1.65rem, 3vw, 2.4rem); font-weight: 500; letter-spacing: -0.04em; line-height: 1; margin-top: 0.35rem; }
  .level-scale-heading a { align-items: center; display: inline-flex; font-size: 0.75rem; font-weight: 800; letter-spacing: 0.08em; min-height: 2.75rem; text-underline-offset: 0.25rem; text-transform: uppercase; }
  .level-scale-track { border: 1px solid var(--text-primary); display: flex; height: 2.1rem; margin-top: 3.5rem; position: relative; }
  .level-segment { align-items: center; display: flex; flex-basis: var(--segment-width); flex-direction: column; justify-content: center; line-height: 1.05; min-width: 0; text-align: center; }
  .level-segment + .level-segment { border-left: 1px solid color-mix(in oklch, var(--text-primary) 45%, transparent); }
  .level-segment--below_recommended, .level-segment--above_recommended { background: repeating-linear-gradient(135deg, color-mix(in oklch, var(--availability-closed) 11%, var(--surface-canvas)) 0 5px, var(--surface-canvas) 5px 10px); }
  .level-segment--low_runnable { background: var(--condition-low); }
  .level-segment--medium_runnable { background: var(--condition-medium); }
  .level-segment--high_runnable { background: var(--condition-high); }
  .level-marker { background: var(--text-primary); bottom: -0.5rem; left: var(--marker-position); position: absolute; top: -1.2rem; transform: translateX(-50%); width: 2px; }
  .level-marker::after { background: var(--text-primary); border: 3px solid var(--surface-canvas); border-radius: 50%; bottom: 0.65rem; content: ""; height: 0.9rem; left: 50%; position: absolute; transform: translate(-50%, 50%); width: 0.9rem; }
  .level-marker-label { background: var(--text-primary); color: var(--surface-canvas); font-size: var(--type-label); font-weight: 800; left: 50%; letter-spacing: 0.05em; padding: 0.22rem 0.45rem; position: absolute; top: -1.25rem; transform: translate(-50%, -100%); white-space: nowrap; }
  .level-marker--below .level-marker-label { left: 0; transform: translate(0, -100%); }
  .level-marker--above .level-marker-label { left: auto; right: 0; transform: translate(0, -100%); }
  .level-band-ledger { border-bottom: 1px solid var(--border-soft); border-left: 1px solid var(--border-soft); display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); list-style: none; margin-top: 0.8rem; }
  .level-band-ledger-item { align-items: start; border-right: 1px solid var(--border-soft); border-top: 1px solid var(--border-soft); display: grid; gap: 0.45rem; grid-template-columns: 0.5rem minmax(0, 1fr); min-width: 0; padding: 0.7rem; position: relative; }
  .level-band-ledger-item.is-current { box-shadow: inset 0 -0.22rem var(--activity-water-deep); }
  .level-band-swatch { background: var(--availability-unknown); height: 0.65rem; margin-top: 0.1rem; width: 0.5rem; }
  .level-band-ledger-item--below_recommended .level-band-swatch, .level-band-ledger-item--above_recommended .level-band-swatch { background: var(--availability-closed); }
  .level-band-ledger-item--low_runnable .level-band-swatch { background: var(--condition-low); }
  .level-band-ledger-item--medium_runnable .level-band-swatch { background: var(--condition-medium); }
  .level-band-ledger-item--high_runnable .level-band-swatch { background: var(--condition-high); }
  .level-band-copy { min-width: 0; }
  .level-band-copy > * { display: block; }
  .level-band-copy strong { font-size: var(--type-label); letter-spacing: 0.035em; line-height: 1.15; text-transform: uppercase; }
  .level-band-copy span { color: var(--text-secondary); font-family: var(--font-serif); font-size: 0.75rem; line-height: 1.25; margin-top: 0.2rem; }
  .level-band-current { color: var(--activity-water-deep); font-size: var(--type-label); font-style: normal; font-weight: 850; grid-column: 2; letter-spacing: 0.08em; text-transform: uppercase; }
  .level-scale figcaption { color: var(--text-secondary); font-family: var(--font-serif); font-size: 0.8rem; margin-top: 0.55rem; }

  .gauge-chart svg { height: auto; overflow: visible; width: 100%; }
  .chart-scroll:focus-visible { outline: 3px solid var(--activity-climb); outline-offset: 0.35rem; }
  .chart-scroll-cue { display: none; }
  .chart-line { fill: none; stroke: var(--activity-water-deep); stroke-linecap: square; stroke-linejoin: bevel; stroke-width: 3; }
  .chart-gridline, .chart-time-rule, .chart-rule { stroke: var(--border-soft); stroke-width: 1; vector-effect: non-scaling-stroke; }
  .chart-gridline { stroke-dasharray: 2 4; }
  .chart-time-rule { opacity: 0.48; }
  .chart-axis-label, .chart-section-label, .chart-rain-total, .chart-annotation { fill: var(--text-secondary); font-family: var(--font-sans); font-size: 12px; }
  .chart-section-label, .chart-rain-total { font-size: 12px; font-weight: 800; letter-spacing: 0.08em; }
  .chart-annotation { fill: var(--text-primary); font-family: var(--font-serif); font-size: 13px; font-weight: 650; }
  .chart-annotation--current { fill: var(--activity-water-deep); }
  .chart-release { fill: color-mix(in oklch, var(--activity-water-deep) 14%, transparent); }
  .chart-release-target { stroke: var(--text-primary); stroke-dasharray: 2 4; stroke-linecap: round; stroke-width: 2; vector-effect: non-scaling-stroke; }
  .chart-release-note { font-size: 12px; }
  .chart-feet-tick { stroke: var(--text-secondary); stroke-width: 1; }
  .chart-band { stroke: none; }
  .chart-band--low_runnable { fill: color-mix(in oklch, var(--condition-low) 55%, transparent); }
  .chart-band--medium_runnable { fill: color-mix(in oklch, var(--condition-medium) 50%, transparent); }
  .chart-band--high_runnable { fill: color-mix(in oklch, var(--condition-high) 45%, transparent); }
  .chart-band--below_recommended, .chart-band--above_recommended { fill: url(#chart-band-hatch); }
  .chart-hatch-ground { fill: color-mix(in oklch, var(--availability-limited) 8%, var(--surface-canvas)); }
  .chart-hatch-line { stroke: color-mix(in oklch, var(--availability-limited) 35%, transparent); stroke-width: 3; }
  .chart-level-threshold { stroke: var(--activity-water-deep); stroke-dasharray: 6 4; stroke-width: 1.5; vector-effect: non-scaling-stroke; }
  .chart-level-label { fill: var(--activity-water-deep); font-family: var(--font-sans); font-size: 12px; font-weight: 800; letter-spacing: 0.04em; text-transform: uppercase; }
  .chart-rain-bar { fill: var(--activity-water); opacity: 0.7; }
  .chart-current-dot { fill: var(--surface-canvas); stroke: var(--activity-water-deep); stroke-width: 3; vector-effect: non-scaling-stroke; }
  .chart-peak-dot { fill: var(--activity-climb); stroke: var(--surface-canvas); stroke-width: 2; vector-effect: non-scaling-stroke; }
  .chart-summary { border-top: 1px solid var(--border-soft); font-family: var(--font-serif); font-size: 0.95rem; line-height: 1.5; margin-top: 1.25rem; max-width: 54rem; padding-top: 0.85rem; }
  .gauge-chart figcaption { color: var(--text-secondary); display: flex; font-size: 0.75rem; font-weight: 700; justify-content: space-between; letter-spacing: 0.06em; margin: 0.85rem 0 0; text-transform: uppercase; }
  .chart-empty { color: var(--text-secondary); font-family: var(--font-serif); padding-block: 2rem; }
  .observation-meta dt { margin-bottom: 0.2rem; }
  .observation-meta dd { font-family: var(--font-serif); font-size: 0.96rem; }

  .access-board-heading h2 { font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; letter-spacing: -0.035em; line-height: 1.05; margin-top: 0.45rem; }
  .access-board-heading > p { color: var(--text-secondary); font-family: var(--font-serif); font-size: 1rem; }
  .access-board-heading .run-profile { color: var(--activity-water-deep); font-family: var(--font-sans); font-size: var(--type-label); font-weight: 800; letter-spacing: 0.06em; margin-top: 0.8rem; text-transform: uppercase; }
  .access-card { --access-state: var(--text-secondary); border-bottom: 1px solid var(--text-primary); }
  .access-card--open { --access-state: var(--availability-open); }
  .access-card--limited, .access-card--needs_verification { --access-state: oklch(50% 0.13 42); }
  .access-card--closed { --access-state: var(--availability-closed); }
  .access-card--unknown { background: repeating-linear-gradient(135deg, transparent 0 10px, color-mix(in oklch, var(--text-primary) 3.5%, transparent) 10px 11px); }
  .access-card > header { align-items: center; border-bottom: 1px solid var(--border-soft); border-top: 0.4rem solid var(--access-state); display: flex; justify-content: space-between; min-height: 4rem; padding: 0.7rem 1rem; }
  .access-role { color: var(--text-secondary); font-size: var(--type-label); font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
  .access-state { align-items: center; display: flex; font-size: var(--type-label); font-weight: 850; gap: 0.42rem; letter-spacing: 0.055em; text-align: right; text-transform: uppercase; }
  .access-card-body { padding: 1.25rem; }
  .access-card-body h3 { font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; letter-spacing: -0.035em; line-height: 1.05; }
  .access-headline { color: var(--access-state); font-size: 0.76rem; font-weight: 850; letter-spacing: 0.075em; margin-top: 0.8rem; text-transform: uppercase; }
  .access-designation { align-items: center; color: var(--activity-trail); display: flex; font-size: var(--type-label); font-weight: 850; gap: 0.45rem; letter-spacing: 0.05em; margin-top: 0.9rem; text-transform: uppercase; }
  .access-designation span { align-items: center; border: 1px solid currentColor; display: inline-flex; height: 1.25rem; justify-content: center; width: 1.25rem; }
  .access-designation--missing { color: var(--text-secondary); }
  .access-designation--missing span { border-style: dashed; }
  .access-details { color: var(--text-secondary); font-family: var(--font-serif); font-size: 0.9rem; line-height: 1.48; margin-top: 0.7rem; }
  .access-stop-note { border-top: 1px solid var(--border-soft); color: var(--text-secondary); font-size: var(--type-label); margin-top: 1rem; padding-top: 0.75rem; }
  .access-conflict { border-left: 0.35rem solid var(--activity-climb); font-size: 0.78rem; font-weight: 700; margin-top: 1rem; padding-left: 0.75rem; }
  .access-card > footer { border-top: 1px solid var(--border-soft); padding: 1rem 1.25rem; }
  .access-card > footer dl { display: grid; gap: 0.65rem; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; }
  .access-card > footer dt { color: var(--text-secondary); font-size: var(--type-label); font-weight: 850; letter-spacing: 0.07em; text-transform: uppercase; }
  .access-card > footer dd { font-family: var(--font-serif); font-size: var(--type-label); line-height: 1.3; }
  .access-freshness { align-items: center; display: flex; gap: 0.35rem; }
  .access-card > footer a { align-items: center; display: inline-flex; font-size: var(--type-label); font-weight: 850; letter-spacing: 0.045em; margin-top: 0.9rem; min-height: 2.75rem; text-underline-offset: 0.25rem; text-transform: uppercase; }
  .access-no-source { color: var(--text-secondary); font-family: var(--font-serif); font-size: 0.8rem; }
  .access-caveat { border-bottom: 1px solid var(--text-primary); font-family: var(--font-serif); font-size: 0.86rem; padding: 0.9rem 1rem; }

  .shuttle-board h2 { font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; letter-spacing: -0.035em; line-height: 1.05; margin-top: 0.45rem; }
  .release-board h2 { font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; letter-spacing: -0.035em; line-height: 1.05; margin-top: 0.45rem; }
  .release-board > p { max-width: 52rem; }
  .release-board .release-label { font-size: var(--type-label); font-weight: 850; letter-spacing: 0.12em; margin: 1.5rem 0 0; text-transform: uppercase; }
  .release-board .release-date { color: var(--activity-water-deep); font-family: var(--font-serif); font-size: clamp(1.25rem, 2.5vw, 2rem); margin-top: 1.5rem; }
  .release-board .release-label + .release-date { margin-top: 0.3rem; }
  .release-board > a { display: inline-block; font-size: 0.78rem; font-weight: 800; margin-top: 1.2rem; text-underline-offset: 0.25rem; }
  .shuttle-card { background: color-mix(in oklch, var(--activity-climb) 8%, var(--surface-canvas)); }
  .shuttle-card h3 { font-family: var(--font-serif); font-size: clamp(1.8rem, 3.5vw, 3rem); font-weight: 500; letter-spacing: -0.045em; margin-block: 0.7rem; }
  .shuttle-card > p:not(.shuttle-state, .shuttle-source) { color: var(--text-secondary); font-family: var(--font-serif); margin-top: 0.45rem; max-width: 45rem; }
  .shuttle-state { align-items: center; color: var(--availability-closed); display: flex; font-size: var(--type-label); font-weight: 850; gap: 0.55rem; letter-spacing: 0.07em; text-transform: uppercase; }
  .shuttle-state span { align-items: center; background: var(--availability-closed); color: var(--surface-canvas); display: inline-flex; height: 1.5rem; justify-content: center; width: 1.5rem; }
  .shuttle-source { border-top: 1px solid var(--border-soft); font-size: var(--type-label); font-weight: 750; letter-spacing: 0.05em; margin-top: 1rem; padding-top: 0.75rem; text-transform: uppercase; }
  .shuttle-card a { align-items: center; display: inline-flex; font-size: var(--type-label); font-weight: 850; letter-spacing: 0.05em; margin-top: 0.8rem; min-height: 2.75rem; text-underline-offset: 0.25rem; text-transform: uppercase; }

  .judgment-call h2, .field-notes h2 { font-family: var(--font-serif); font-size: clamp(1.9rem, 4vw, 3.1rem); font-weight: 500; letter-spacing: -0.04em; line-height: 1.05; }
  .judgment-call > p:last-child { font-family: var(--font-serif); font-size: 1.08rem; line-height: 1.55; }
  .source-entry { display: grid; gap: 1rem; grid-template-columns: 2.2rem 1fr; }
  .source-number { color: var(--activity-water); font-family: var(--font-serif); font-size: 1.45rem; }
  .source-entry h3 { font-family: var(--font-serif); font-size: 1.35rem; line-height: 1.15; margin-bottom: 0.65rem; }
  .source-entry p { color: var(--text-secondary); font-size: 0.9rem; }
  .source-entry a { align-items: center; display: inline-flex; font-size: 0.76rem; font-weight: 800; letter-spacing: 0.05em; margin-top: 0.45rem; min-height: 2.75rem; text-underline-offset: 0.25rem; text-transform: uppercase; }
  .source-entry--pending { background: repeating-linear-gradient(135deg, transparent 0 10px, color-mix(in oklch, var(--text-primary) 3%, transparent) 10px 11px); }

  .trail-kicker { color: var(--activity-trail); display: flex; font-size: 0.75rem; font-weight: 850; justify-content: space-between; letter-spacing: 0.12em; margin-bottom: 1.25rem; max-width: 48rem; text-transform: uppercase; }
  .trail-masthead h1 span { display: block; }
  .trail-deck { margin-top: 1.25rem; max-width: 31rem; }
  .trail-masthead-status { --trail-state: var(--text-secondary); background: color-mix(in oklch, var(--trail-state) 7%, transparent); }
  .trail-masthead-status--closed { --trail-state: var(--availability-closed); }
  .trail-masthead-status--expected_open { --trail-state: var(--activity-trail); }
  .trail-masthead-status--limited { --trail-state: var(--availability-limited); }
  .trail-masthead-status h2 { align-items: baseline; color: var(--trail-state); display: flex; font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; gap: 0.6rem; letter-spacing: -0.035em; line-height: 1.05; margin-top: 0.7rem; text-wrap: balance; }
  .field-masthead--compact .trail-masthead-status h2 { font-size: var(--type-title); }
  .trail-masthead-status h2 span { font-family: var(--font-sans); font-size: 0.45em; font-weight: 850; }
  .trail-masthead-segment { border-top: 1px solid var(--border-soft); color: var(--text-secondary); font-family: var(--font-serif); margin-top: 1.35rem; padding-top: 0.85rem; }
  .trail-masthead-status > a { align-self: flex-start; margin-top: 1.2rem; }
  .activity-fit h2 { font-family: var(--font-serif); font-size: clamp(1.9rem, 3.4vw, 3.1rem); font-weight: 500; letter-spacing: -0.045em; line-height: 1; margin-top: 0.45rem; }
  .activity-fit-item { align-items: center; display: flex; gap: 0.8rem; padding: 0.75rem 1rem; }
  .activity-fit-mark { align-items: center; border: 2px solid var(--activity-trail); color: var(--activity-trail); display: inline-flex; flex: 0 0 auto; height: 1.8rem; justify-content: center; width: 1.8rem; }
  .activity-fit-item--unknown { background: repeating-linear-gradient(135deg, transparent 0 9px, color-mix(in oklch, var(--text-primary) 4%, transparent) 9px 10px); }
  .activity-fit-item--unknown .activity-fit-mark { border-style: dashed; color: var(--text-secondary); }
  .activity-fit-item strong { display: block; font-size: 0.8rem; letter-spacing: 0.07em; text-transform: uppercase; }
  .activity-fit-item small { color: var(--text-secondary); display: block; font-family: var(--font-serif); font-size: 0.8rem; margin-top: 0.12rem; }
  .trail-condition-board { --trail-state: var(--text-secondary); }
  .trail-condition-board--closed { --trail-state: var(--availability-closed); box-shadow: 0.55rem 0.55rem 0 var(--availability-closed); }
  .trail-condition-board--expected_open { --trail-state: var(--activity-trail); }
  .trail-condition-board--limited { --trail-state: var(--availability-limited); }
  .trail-freshness { background: color-mix(in oklch, var(--freshness-current) 10%, var(--surface-canvas)); border-bottom: 1px solid var(--border-strong); font-size: var(--type-label); letter-spacing: 0.055em; padding: 0.7rem 1rem; text-transform: uppercase; }
  .trail-freshness--stale { background: repeating-linear-gradient(135deg, var(--surface-canvas) 0 9px, color-mix(in oklch, var(--freshness-stale) 9%, var(--surface-canvas)) 9px 10px); }
  .trail-today h2 { color: var(--trail-state); font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; letter-spacing: -0.035em; line-height: 1.05; margin-block: 0.8rem 1.25rem; text-wrap: balance; }
  .trail-status-plain { align-items: center; display: flex; font-size: 0.78rem; font-weight: 850; gap: 0.55rem; letter-spacing: 0.075em; text-transform: uppercase; }
  .trail-status-plain span { align-items: center; border: 2px solid var(--trail-state); color: var(--trail-state); display: inline-flex; height: 1.5rem; justify-content: center; width: 1.5rem; }
  .trail-next-change { border-top: 1px solid var(--border-soft); font-family: var(--font-serif); margin-top: 1.3rem; max-width: 28rem; padding-top: 0.85rem; }
  .trail-segment-card { background: color-mix(in oklch, var(--trail-state) 6%, var(--surface-canvas)); }
  .trail-segment-card h3 { font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; letter-spacing: -0.035em; line-height: 1.05; margin-block: 0.6rem 1.5rem; }
  .trail-segment-card dl { border-block: 1px solid var(--border-soft); display: grid; grid-template-columns: repeat(2, 1fr); margin: 0 0 1.25rem; }
  .trail-segment-card dl div { padding-block: 0.75rem; }
  .trail-segment-card dl div + div { border-left: 1px solid var(--border-soft); padding-left: 1rem; }
  .trail-segment-card dt, .trail-source dt { color: var(--text-secondary); font-size: var(--type-label); font-weight: 850; letter-spacing: 0.08em; text-transform: uppercase; }
  .trail-segment-card dd, .trail-source dd { font-family: var(--font-serif); font-size: 0.82rem; line-height: 1.35; margin-top: 0.2rem; }
  .trail-segment-card > p:last-child { color: var(--text-secondary); font-family: var(--font-serif); font-size: 0.92rem; }
  .trail-week-heading h3 { font-family: var(--font-serif); font-size: clamp(1.7rem, 3vw, 2.7rem); font-weight: 500; letter-spacing: -0.04em; line-height: 1; margin-top: 0.35rem; }
  .trail-week-heading > p { color: var(--text-secondary); font-size: 0.75rem; font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; }
  .trail-day { --day-state: var(--text-secondary); display: flex; flex-direction: column; padding: 0.7rem; position: relative; }
  .trail-day--closed { --day-state: var(--availability-closed); background: color-mix(in oklch, var(--availability-closed) 8%, var(--surface-canvas)); }
  .trail-day--expected_open { --day-state: var(--activity-trail); }
  .trail-day--unknown { background: repeating-linear-gradient(135deg, transparent 0 8px, color-mix(in oklch, var(--text-primary) 4%, transparent) 8px 9px); }
  .trail-day--today { outline: 3px solid var(--text-primary); outline-offset: -3px; }
  .trail-day-name { font-size: var(--type-label); font-weight: 850; letter-spacing: 0.08em; text-transform: uppercase; }
  .trail-day-date { color: var(--text-secondary); font-family: var(--font-serif); font-size: 0.75rem; }
  .trail-day-state { align-items: center; color: var(--day-state); display: flex; font-size: var(--type-label); font-weight: 850; gap: 0.32rem; margin-top: auto; text-transform: uppercase; }
  .trail-day-state span { align-items: center; border: 1px solid currentColor; display: inline-flex; height: 1.15rem; justify-content: center; width: 1.15rem; }
  .trail-day > strong { font-size: var(--type-label); letter-spacing: 0.08em; position: absolute; right: 0.55rem; text-transform: uppercase; top: 0.55rem; }
  .trail-condition-caveat { border-top: 1px solid var(--text-primary); font-family: var(--font-serif); font-size: 0.88rem; padding: 0.9rem 1rem; }
  .trail-alternate h2, .trail-source h2 { font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; letter-spacing: -0.035em; line-height: 1.05; margin-top: 0.6rem; }
  .trail-alternate > div:last-child > p:first-child { font-family: var(--font-serif); font-size: clamp(1.25rem, 2.3vw, 1.8rem); line-height: 1.42; }
  .trail-alternate-warning { border-left: 0.4rem solid var(--activity-climb); color: var(--text-secondary); font-size: 0.82rem; margin-top: 1.5rem; padding-left: 0.85rem; }
  .trail-source > dl div { padding: 0.8rem; }
  .trail-source > dl div:nth-child(even) { border-left: 1px solid var(--border-soft); }
  .trail-source > dl div:nth-child(n+3) { border-top: 1px solid var(--border-soft); }
  .trail-source > a { align-items: center; display: inline-flex; font-size: 0.75rem; font-weight: 850; justify-content: center; letter-spacing: 0.06em; min-height: 3.5rem; padding: 0.5rem 1rem; text-underline-offset: 0.25rem; text-transform: uppercase; }
  .back-link { font-size: var(--type-label); font-weight: 800; letter-spacing: 0.06em; margin-bottom: 2rem; text-transform: uppercase; }
  .back-link a { align-items: center; display: inline-flex; min-height: 2.75rem; text-underline-offset: 0.25rem; }
  .spot-masthead-title .field-title > * { display: block; }
  .spot-masthead h1 em { color: var(--activity-water-deep); font-style: italic; font-weight: 400; }
  .spot-deck { max-width: 34rem; }
  .spot-detail-masthead h2 { color: var(--activity-water-deep); font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; letter-spacing: -0.035em; line-height: 1.05; margin-block: var(--space-3) var(--space-5); }
  .spot-detail-masthead .freshness-indicator { margin-top: var(--space-5); }
  .spot-deck strong { color: var(--activity-water-deep); font-weight: 650; }
  .spot-search-note { color: var(--text-secondary); font-family: var(--font-serif); font-size: 0.78rem; max-width: 34rem; }
  .spot-list-heading h2 { font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; letter-spacing: -0.035em; line-height: 1; }
  .spot-kind { color: var(--activity-water-deep); font-size: var(--type-label); font-weight: 850; letter-spacing: 0.09em; text-transform: uppercase; }
  .spot-list-card h3 { font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; letter-spacing: -0.035em; line-height: 1.05; margin-block: 0.55rem; }
  .spot-list-card p { color: var(--text-secondary); }
  .spot-empty { border-top: 1px solid var(--text-primary); color: var(--text-secondary); font-family: var(--font-serif); padding: 2rem; }
  .spot-stage { color: var(--activity-water-deep) !important; font-family: var(--font-serif); font-size: var(--type-title); letter-spacing: -0.04em; line-height: 1; margin-block: 0.35rem; }
  .spot-access-key h2 { font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; letter-spacing: -0.035em; line-height: 1.05; margin-top: 0.6rem; }
  .spot-access-key li a > span, .spot-guide-number, .spot-guide-card-index { color: var(--activity-water-deep); font-family: var(--font-serif); }
  .spot-access-key li a > span { font-size: 1.35rem; }
  .spot-access-key li a > strong { font-size: var(--type-label); letter-spacing: 0.07em; margin-block: auto 0.6rem; text-transform: uppercase; }
  .spot-access-key li a > small { color: var(--text-secondary); font-family: var(--font-serif); font-size: 0.75rem; line-height: 1.35; }
  .spot-stop-mark { align-items: center; border: 2px solid var(--availability-closed); color: var(--availability-closed); display: flex; font-family: var(--font-serif); font-size: 2.6rem; height: 3rem; justify-content: center; line-height: 1; width: 3rem; }
  .spot-stop-note h2 { font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; letter-spacing: -0.035em; line-height: 1.05; margin-top: 0.45rem; }
  .spot-stop-note > p:last-child { color: var(--text-secondary); font-family: var(--font-serif); }
  .spot-guide-number { font-size: 2.8rem; letter-spacing: -0.06em; line-height: 0.8; }
  .spot-guide-heading h2 { font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; letter-spacing: -0.035em; line-height: 1.05; margin-top: 0.55rem; }
  .spot-guide-heading > p:last-child { color: var(--text-secondary); font-family: var(--font-serif); }
  .spot-guide-card-index { font-size: 1.15rem; }
  .spot-guide-card h3 { font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; letter-spacing: -0.035em; line-height: 1.05; margin-block: 0.65rem; }
  .spot-guide-play { color: var(--text-secondary); font-family: var(--font-serif); }
  .spot-guide-kind { color: var(--activity-water-deep); font-size: var(--type-label); font-weight: 850; letter-spacing: 0.08em; margin-top: auto; padding-top: 1.5rem; text-transform: uppercase; }
  .spot-guide-facts dt { color: var(--text-secondary); font-size: var(--type-label); font-weight: 850; letter-spacing: 0.08em; text-transform: uppercase; }
  .spot-guide-facts dd { font-family: var(--font-serif); font-size: 0.82rem; line-height: 1.4; margin-top: 0.25rem; }
  .spot-guide-facts dd strong { color: var(--text-primary); display: block; font-family: var(--font-sans); font-size: var(--type-label); letter-spacing: 0.055em; margin-bottom: 0.35rem; text-transform: uppercase; }
  .spot-guide-caution { border-left: 0.3rem solid var(--activity-climb); padding-left: 0.8rem; }
  .spot-guide-sources span, .spot-guide-sources a { font-size: var(--type-label); font-weight: 850; letter-spacing: 0.06em; text-transform: uppercase; }
  .spot-guide-sources span { color: var(--text-secondary); }
  .spot-guide-sources a { align-items: center; display: inline-flex; min-height: 2.75rem; text-underline-offset: 0.22rem; }
  .spot-empty h2 { font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; letter-spacing: -0.035em; line-height: 1.05; margin-block: 0.5rem 1rem; }
  .spot-empty > p:last-of-type { color: var(--text-secondary); font-family: var(--font-serif); }
  .spot-empty a { align-items: center; display: inline-flex; font-size: var(--type-label); font-weight: 850; letter-spacing: 0.06em; margin-top: 1.25rem; min-height: 2.75rem; text-transform: uppercase; }
  .spot-verdict { background: repeating-linear-gradient(135deg, transparent 0 11px, color-mix(in oklch, var(--activity-climb) 6%, transparent) 11px 12px); }
  .spot-verdict h2 { font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; letter-spacing: -0.035em; line-height: 1.05; margin-block: 0.6rem 1.2rem; }
  .spot-verdict > p:last-child { color: var(--text-secondary); font-family: var(--font-serif); max-width: 32rem; }
  .spot-stage-history dt { color: var(--text-secondary); font-size: var(--type-label); font-weight: 850; letter-spacing: 0.08em; text-transform: uppercase; }
  .spot-stage-history dd { font-family: var(--font-serif); font-size: 1.35rem; margin-top: 0.15rem; }
  .spot-evidence h2 { font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; letter-spacing: -0.035em; line-height: 1.05; margin-top: 0.55rem; }
  .spot-evidence h3 { font-family: var(--font-serif); font-size: clamp(1.7rem, 3vw, 2.6rem); font-weight: 500; letter-spacing: -0.04em; line-height: 1; margin-block: 0.85rem; }
  .spot-evidence article > p:not(.spot-source-label) { color: var(--text-secondary); font-family: var(--font-serif); margin-top: 0.55rem; }
  .spot-evidence a { align-items: center; display: inline-flex; font-family: var(--font-sans); font-size: var(--type-label); font-weight: 850; letter-spacing: 0.045em; min-height: 2.75rem; text-underline-offset: 0.25rem; text-transform: uppercase; }

  .today-kicker { color: var(--activity-water-deep); display: flex; font-size: var(--type-label); font-weight: 850; justify-content: space-between; letter-spacing: 0.12em; max-width: 40rem; text-transform: uppercase; }
  .today-masthead h1 { font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; letter-spacing: -0.035em; line-height: 1.05; margin-top: 1.2rem; text-wrap: balance; }
  .today-masthead h1 span { display: block; }
  .today-masthead h1 span:last-child { color: var(--activity-water-deep); margin-left: clamp(1.5rem, 6vw, 6rem); }
  .today-snapshot > .field-label { color: var(--activity-water-deep); }
  .today-snapshot-kind { color: var(--today-state); font-size: var(--type-label); font-weight: 850; letter-spacing: 0.08em; text-transform: uppercase; }
  .today-snapshot-item a { font-family: var(--font-serif); font-size: 0.9rem; font-weight: 650; line-height: 1.2; text-underline-offset: 0.18rem; }
  .today-snapshot-status { color: var(--text-secondary); font-size: var(--type-label); line-height: 1.3; }
  .today-snapshot-note { color: var(--text-secondary); font-family: var(--font-serif); font-size: 0.78rem; }
  .today-results-heading h1 { font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; letter-spacing: -0.035em; line-height: 1.05; }
  .today-results-heading h1:focus { outline: none; }
  .today-results-heading > p { color: var(--text-secondary); font-family: var(--font-serif); font-size: 0.85rem; }
  .today-wizard-rail .eyebrow { color: color-mix(in oklch, var(--surface-canvas) 70%, transparent); }
  .today-wizard-progress > span, .today-wizard-progress-link > span { color: color-mix(in oklch, var(--surface-canvas) 72%, transparent); font-family: var(--font-serif); font-size: 1.45rem; line-height: 1; }
  .today-wizard-progress-link { color: inherit; display: grid; gap: 0.9rem; grid-column: 1 / -1; grid-template-columns: 2.5rem 1fr; text-decoration: none; }
  .today-wizard-progress-link:focus-visible { outline: 3px solid var(--activity-climb); outline-offset: 3px; }
  .today-wizard-progress-link strong { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.2rem; }
  .today-wizard-progress strong, .today-wizard-progress small, .today-wizard-progress-link strong, .today-wizard-progress-link small { display: block; }
  .today-wizard-progress strong { font-size: var(--type-label); letter-spacing: 0.1em; text-transform: uppercase; }
  .today-wizard-progress small { color: color-mix(in oklch, var(--surface-canvas) 62%, transparent); font-family: var(--font-serif); font-size: 0.76rem; margin-top: 0.18rem; }
  .today-wizard-progress--current > span { color: var(--surface-canvas); }
  .today-wizard-progress--current strong::after { color: var(--activity-climb); content: " · NOW"; }
  .today-wizard-progress--complete > span::after, .today-wizard-progress--complete .today-wizard-progress-link > span::after { content: "✓"; font-family: var(--font-sans); font-size: var(--type-label); margin-left: 0.25rem; vertical-align: top; }
  .today-wizard-privacy { color: color-mix(in oklch, var(--surface-canvas) 67%, transparent); font-family: var(--font-serif); font-size: 0.78rem; max-width: 18rem; }
  .today-wizard-count { color: var(--activity-water-deep); font-size: var(--type-label); font-weight: 850; letter-spacing: 0.11em; text-transform: uppercase; }
  .today-wizard-count span { color: var(--text-secondary); }
  .today-wizard-stage h2 { font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; letter-spacing: -0.035em; line-height: 1.05; margin-top: 0.6rem; max-width: 52rem; min-block-size: 1.72em; text-wrap: balance; }
  .today-wizard-stage h2 span { display: block; }
  .today-wizard-stage h2:focus { outline: none; }
  .today-wizard-context { border-left: 0.4rem solid var(--activity-climb); color: var(--text-secondary); font-family: var(--font-serif); margin-top: 1rem; max-width: 34rem; min-block-size: 1.55em; padding-left: 0.85rem; }
  .today-wizard-option { border-top: 1px solid var(--text-primary); position: relative; }
  .today-wizard-option:last-child { border-bottom: 1px solid var(--text-primary); }
  .today-wizard-option input { height: 1px; opacity: 0; position: absolute; width: 1px; }
  .today-wizard-option label { align-items: center; cursor: pointer; display: grid; gap: 1rem; grid-template-columns: minmax(0, 1fr) 2rem; min-height: 4.5rem; padding: 0.7rem 1rem; transition: background-color 150ms ease, color 150ms ease, padding 150ms ease; }
  .today-wizard-option label:hover { background: color-mix(in oklch, var(--activity-water) 8%, transparent); padding-left: 1.4rem; }
  .today-wizard-option input:checked + label { background: var(--text-primary); color: var(--surface-canvas); }
  .today-wizard-option input:focus-visible + label { outline: 3px solid var(--activity-climb); outline-offset: -3px; }
  .today-wizard-option input:checked + label small { color: color-mix(in oklch, var(--surface-canvas) 70%, transparent); }
  .today-wizard-option-copy strong, .today-wizard-option-copy small { display: block; }
  .today-wizard-option-copy strong { font-size: 0.8rem; letter-spacing: 0.06em; text-transform: uppercase; }
  .today-wizard-option-copy small { color: var(--text-secondary); font-family: var(--font-serif); font-size: 0.82rem; margin-top: 0.12rem; }
  .today-wizard-option-arrow { font-family: var(--font-serif); font-size: 1.7rem; transform: translateX(0); transition: transform 150ms ease; }
  .today-wizard-option label:hover .today-wizard-option-arrow { transform: translateX(0.25rem); }
  .today-wizard-actions { color: var(--text-secondary); font-size: var(--type-label); font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
  .today-wizard-actions a { align-items: center; display: inline-flex; min-height: 2.75rem; text-underline-offset: 0.25rem; }
  .today-wizard-actions input { background: transparent; border: 0; color: var(--text-secondary); cursor: pointer; font: inherit; letter-spacing: inherit; min-height: 2.75rem; padding-inline: 0.5rem; text-decoration: underline; text-underline-offset: 0.25rem; text-transform: inherit; }
  .today-wizard-actions input:focus-visible { outline: 3px solid var(--activity-climb); outline-offset: 2px; }
  .today-wizard[data-today-wizard-autofocus-value="true"] .today-wizard-stage { animation: today-step-forward 220ms cubic-bezier(0.22, 1, 0.36, 1) both; }
  .today-wizard.today-wizard--history-back .today-wizard-stage { animation-name: today-step-back; }
  .today-wizard--leaving .today-wizard-stage { opacity: 0.5; transform: translateX(-0.45rem); }
  .today-results--revealed { animation: today-results-reveal 240ms cubic-bezier(0.22, 1, 0.36, 1) both; }
  .today-results--revealed.today-wizard--history-back { animation-name: today-step-back; }
  .today-answer-strip > p { color: var(--text-secondary); }
  .today-answer-strip li span { color: var(--text-secondary); display: block; font-size: var(--type-label); font-weight: 850; letter-spacing: 0.08em; text-transform: uppercase; }
  .today-answer-strip li a { font-family: var(--font-serif); font-size: 0.9rem; text-underline-offset: 0.2rem; }
  .today-start-over { align-items: center; display: inline-flex; font-size: var(--type-label); font-weight: 850; justify-content: center; letter-spacing: 0.07em; min-height: 100%; text-transform: uppercase; text-underline-offset: 0.25rem; }
  .today-card-context p, .today-card-kind { font-size: var(--type-label); font-weight: 850; letter-spacing: 0.11em; text-transform: uppercase; }
  .today-card-context p { color: var(--text-secondary); writing-mode: vertical-rl; }
  .today-card-kind { color: var(--today-state); }
  .today-card-status { align-items: center; color: var(--today-state); display: flex; font-size: var(--type-label); font-weight: 850; gap: 0.5rem; letter-spacing: 0.055em; margin-top: 1rem; text-transform: uppercase; }
  .today-card-status span { background: var(--today-state); display: inline-block; height: 0.65rem; width: 0.65rem; }
  .today-card--unknown .today-card-status span { background: transparent; border: 1px dashed var(--today-state); }
  .today-card h2 { font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; letter-spacing: -0.035em; line-height: 1.05; margin-block: 0.55rem 0.8rem; max-width: 48rem; text-wrap: balance; }
  .today-card-summary { color: var(--text-secondary); font-family: var(--font-serif); max-width: 44rem; }
  .today-card--unknown .today-card-summary, .today-card--unknown .today-card-context p, .today-card--unknown .today-card-evidence dt, .today-card--unknown .today-card-evidence > p span { color: var(--text-primary); }
  .today-card-actions { align-items: center; display: flex; flex-wrap: wrap; gap: 0.3rem 1.2rem; margin-top: 1rem; }
  .today-card-actions a { align-items: center; display: inline-flex; font-size: var(--type-label); font-weight: 850; letter-spacing: 0.055em; min-height: 2.75rem; text-underline-offset: 0.25rem; text-transform: uppercase; }
  .today-card-actions .today-primary-link { background: var(--today-state); border: 2px solid var(--today-state); color: var(--surface-canvas); padding: 0.45rem 0.8rem; text-decoration: none; }
  .today-card--unknown .today-primary-link { color: var(--surface-canvas); }
  .today-card-actions .today-primary-link:hover { background: transparent; color: var(--today-state); }
  .today-card-evidence dl { margin: 0; }
  .today-card-evidence dl div { border-top: 1px solid var(--border-soft); padding-block: 0.75rem; }
  .today-card-evidence dt, .today-card-evidence > p span { color: var(--text-secondary); display: block; font-size: var(--type-label); font-weight: 850; letter-spacing: 0.09em; text-transform: uppercase; }
  .today-card-evidence dd { font-family: var(--font-serif); font-size: 0.83rem; line-height: 1.35; margin-top: 0.18rem; }
  .today-card-evidence > p { border-top: 1px solid var(--text-primary); font-family: var(--font-serif); font-size: 0.75rem; padding-top: 0.75rem; }
  .today-card--paddling { background: color-mix(in oklch, var(--activity-water) 5%, var(--surface-canvas)); }
  .today-card--climbing { background: repeating-linear-gradient(135deg, transparent 0 15px, color-mix(in oklch, var(--activity-climb) 4%, transparent) 15px 16px); }
  .today-card--gym { background: color-mix(in oklch, var(--text-primary) 4%, var(--surface-canvas)); }
}

@layer utilities {
  @media (max-width: 60rem) {
    .river-decision-evidence { border-top: 1px solid var(--text-primary); }
    .wordmark-county { display: none; }
  }

  @media (max-width: 48rem) {
    .site-header { padding-top: var(--space-2); }
    .wordmark { align-items: flex-start; flex-direction: column; flex-wrap: nowrap; gap: 0; justify-content: center; }
    .wordmark-name { font-size: 1.5rem; }
    .wordmark-place { font-size: 0.8125rem; }
    .masthead-rim { height: 1.375rem; }
    .masthead-rim-side--start { flex-grow: 3; }
  }

  @media (max-width: 22.5rem) {
    .site-header { gap: var(--space-2); }
    .wordmark-name { font-size: 1.3125rem; }
    .site-nav { font-size: 0.75rem; gap: 0; letter-spacing: 0.06em; margin-right: -0.3125rem; }
    .site-nav a { padding-inline: 0.3125rem; }
  }

  @media print {
    .wordmark-place { color: var(--masthead-text); }
  }

  @media (forced-colors: active) {
    .masthead-rim { display: none; }
    .site-masthead-band { border-bottom: 1px solid CanvasText; }
  }

  @media (min-width: 60.01rem) {
    .today-index--planner { align-items: start; padding-block: clamp(1.5rem, 3vh, 2.5rem); }
    .today-index--planner .today-masthead, .today-index--planner .today-wizard { min-height: 0; }
    .today-index--planner .today-masthead { align-items: stretch; align-self: stretch; display: flex; flex-direction: column; gap: 0; }
    .today-index--planner .today-masthead h1 { font-size: var(--type-display); margin-top: var(--space-5); }
    .today-index--planner .today-snapshot { margin-top: var(--space-6); max-width: 31rem; }
    .today-index--planner #today-planner-frame { min-width: 0; }
    .today-index--planner .today-wizard { grid-template-columns: 1fr; }
    .today-index--planner .today-wizard-rail { display: block; padding: 0.85rem 1rem; }
    .today-index--planner .today-wizard-rail > .eyebrow, .today-index--planner .today-wizard-privacy { display: none; }
    .today-index--planner .today-wizard-rail ol { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; }
    .today-index--planner .today-wizard-progress { gap: 0.4rem; grid-template-columns: 1.8rem 1fr; padding: 0.55rem; }
    .today-index--planner .today-wizard-progress-link { gap: 0.4rem; grid-template-columns: 1.8rem 1fr; }
    .today-index--planner .today-wizard-progress + .today-wizard-progress { border-left: 1px solid color-mix(in oklch, var(--surface-canvas) 24%, transparent); border-top: 0; }
    .today-index--planner .today-wizard-progress > span { font-size: 1rem; }
    .today-index--planner .today-wizard-progress small { font-size: var(--type-label); }
    .today-index--planner .today-wizard-stage { padding: var(--space-4); }
    .today-index--planner .today-wizard-stage h2 { font-size: var(--type-title); }
    .today-index--planner .today-wizard-context { min-block-size: 3.1em; }
    .today-index--planner .today-wizard-options { margin-top: clamp(1rem, 2vh, 1.5rem); }
    .today-index--planner .today-wizard-option label { min-height: 4.15rem; }
  }

  @media (max-width: 68rem) {
    .access-route { grid-template-columns: 1fr; }
    .access-card + .access-card { border-left: 0; border-top: 1px solid var(--text-primary); }
    .access-card > footer dl { grid-template-columns: repeat(3, 1fr); }
    .field-notes { grid-template-columns: repeat(2, 1fr); }
    .field-notes > div:first-child { border-bottom: 1px solid var(--border-soft); grid-column: 1 / -1; }
    .field-notes > div:nth-child(2) { border-left: 0; }
    .field-notes > div:nth-child(4) { border-left: 0; border-top: 1px solid var(--border-soft); }
    .field-notes > div:nth-child(5) { border-top: 1px solid var(--border-soft); }
    .trail-week ol { grid-template-columns: repeat(4, 1fr); }
    .trail-day:nth-child(5) { border-left: 0; border-top: 1px solid var(--text-primary); }
    .trail-day:nth-child(n+6) { border-top: 1px solid var(--text-primary); }
    .today-masthead { align-items: start; grid-template-columns: 1fr; }
    .today-snapshot { margin-left: auto; max-width: 35rem; }
    .today-wizard { grid-template-columns: minmax(12rem, 0.32fr) minmax(0, 1fr); }
    .today-card { grid-template-columns: minmax(6rem, 0.18fr) minmax(18rem, 1.2fr) minmax(14rem, 0.62fr); }
    .spot-access-key { grid-template-columns: 1fr; }
    .spot-access-key ol { border-left: 0; border-top: 1px solid var(--text-primary); }
    .spot-guide-heading { grid-template-columns: 4rem minmax(0, 1fr); }
    .spot-guide-heading > p:last-child { grid-column: 2; justify-self: start; }
    .spot-guide-card { grid-template-columns: 4rem minmax(15rem, 0.75fr) minmax(18rem, 1.25fr); }
  }

  @media (max-width: 48rem) {
    .run-switcher-groups { grid-template-columns: 1fr; }
    .run-switcher-group + .run-switcher-group { border-left: 0; border-top: 1px solid var(--text-primary); }
    .river-decision-header { align-items: flex-start; flex-direction: column; gap: 1rem; }
    .river-source-stamp { display: none; }
    .river-decision-body { grid-template-columns: 1fr; }
    .river-decision-evidence { order: -1; }
    .river-verdict.page-spread__page { padding: var(--space-4); }
    .river-verdict h2 { max-width: none; }
    .river-binary-claims { grid-template-columns: 1fr; }
    .river-binary-claim + .river-binary-claim { border-left: 0; border-top: 1px solid var(--border-soft); }
    .river-decision-footer { align-items: flex-start; flex-direction: column; gap: 0.25rem; }
    .play-board { grid-template-columns: 1fr; }
    .play-board-list { border-left: 0; border-top: 1px solid var(--text-primary); }
    .level-scale-heading { align-items: flex-start; flex-direction: column; gap: 0.8rem; }
    .level-band-ledger { grid-template-columns: 1fr; }
    .level-band-ledger-item { align-items: center; grid-template-columns: 0.5rem minmax(0, 1fr) auto; }
    .level-band-copy { align-items: baseline; display: flex; gap: 0.55rem; justify-content: space-between; }
    .level-band-current { grid-column: 2 / -1; grid-row: 2; }
    .chart-scroll { direction: rtl; overflow-x: auto; overscroll-behavior-inline: contain; }
    .gauge-chart svg { direction: ltr; min-width: 43rem; }
    .chart-scroll-cue { color: var(--text-secondary); display: block; font-size: 0.75rem; font-weight: 800; letter-spacing: 0.07em; margin-top: 0.5rem; text-transform: uppercase; }
    .gauge-chart figcaption { align-items: flex-start; flex-direction: column; gap: 0.25rem; margin: 0.65rem 0 0; }
    .observation-meta { grid-template-columns: 1fr; }
    .observation-meta div + div { border-left: 0; border-top: 1px solid var(--border-soft); }
    .access-board-heading { align-items: start; grid-template-columns: 1fr; gap: 1rem; }
    .access-board-heading > p { justify-self: start; }
    .access-card > footer dl { grid-template-columns: 1fr; }
    .shuttle-board { grid-template-columns: 1fr; }
    .shuttle-card { border-left: 0; border-top: 1px solid var(--text-primary); }
    .judgment-call { grid-template-columns: 1fr; }
    .field-notes { grid-template-columns: 1fr; }
    .field-notes > div:first-child { grid-column: auto; }
    .field-notes > div + div { border-left: 0; border-top: 1px solid var(--border-soft); }
    .trail-masthead h1 { line-height: 0.82; }
    .trail-deck { margin-left: 0; }
    .field-masthead--compact .trail-kicker { margin-bottom: var(--space-2); }
    .field-masthead--compact .trail-masthead-status h2 { font-size: var(--type-title); margin-top: var(--space-2); }
    .field-masthead--compact .trail-masthead-segment { margin-top: var(--space-3); padding-top: var(--space-2); }
    .field-masthead--compact .trail-masthead-status > a { margin-top: var(--space-2); }
    .activity-fit { align-items: start; grid-template-columns: 1fr; }
    .activity-fit ul { grid-template-columns: 1fr; }
    .activity-fit-item + .activity-fit-item { border-left: 0; border-top: 1px solid var(--border-soft); }
    .trail-condition-summary { grid-template-columns: 1fr; }
    .trail-segment-card { border-left: 0; border-top: 1px solid var(--text-primary); }
    .trail-week-heading { align-items: flex-start; flex-direction: column; gap: 0.65rem; }
    .trail-week ol { grid-template-columns: repeat(2, 1fr); }
    .trail-day:nth-child(odd) { border-left: 0; }
    .trail-day:nth-child(n+3) { border-top: 1px solid var(--text-primary); }
    .trail-alternate, .trail-source { grid-template-columns: 1fr; }
    .trail-source > dl { border-left: 0; border-top: 1px solid var(--text-primary); grid-template-columns: 1fr; }
    .trail-source > dl div:nth-child(even) { border-left: 0; }
    .trail-source > dl div + div { border-top: 1px solid var(--border-soft); }
    .spot-list-heading { align-items: flex-start; flex-direction: column; gap: 0.7rem; }
    .field-masthead--compact .spot-masthead-action .spot-search { margin: 0 0 var(--space-2); order: -1; padding: var(--space-3); }
    .field-masthead--compact .spot-search-note { margin-top: 0; }
    .spot-search > div { align-items: stretch; flex-direction: column; }
    .spot-search input[type="submit"] { margin-top: 0.7rem; }
    .spot-list-card, .spot-condition-summary, .spot-evidence { grid-template-columns: 1fr; }
    .spot-list-card > div + div, .spot-verdict, .spot-evidence > * + * { border-left: 0; border-top: 1px solid var(--border-soft); }
    .spot-access-key ol { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .spot-access-key li:nth-child(odd) { border-left: 0; }
    .spot-access-key li:nth-child(n+3) { border-top: 1px solid var(--border-soft); }
    .spot-access-key li { min-height: 7.5rem; }
    .spot-stop-note { grid-template-columns: 3rem minmax(0, 1fr); }
    .spot-stop-note > p:last-child { grid-column: 2; }
    .spot-guide-heading { gap: 1rem; grid-template-columns: 3rem minmax(0, 1fr); }
    .spot-guide-card { grid-template-columns: 3.25rem minmax(0, 1fr); }
    .spot-guide-card-main { min-width: 0; }
    .spot-guide-facts { border-top: 1px solid var(--border-soft); grid-column: 2; }
    .spot-guide-sources { grid-column: 2; }
    .climbing-deck { margin-top: 0; }
    .field-masthead--compact .climbing-quick-plan { margin-top: 0; padding-top: var(--space-3); }
    .climbing-quick-plan li { padding: var(--space-2); }
    .today-index--planner { padding-block: var(--space-3); }
    .today-index--planner .today-masthead { gap: var(--space-3); min-height: 0; padding-block: var(--space-3) var(--space-4); }
    .today-kicker { font-size: var(--type-label); }
    .today-masthead h1 { font-size: var(--type-title); line-height: 1.05; margin-top: var(--space-3); }
    .today-masthead h1 span { display: inline; }
    .today-masthead h1 span + span::before { content: " "; }
    .today-masthead h1 span:last-child { margin-left: 0; }
    .today-snapshot { margin-left: 0; max-width: none; width: 100%; }
    .today-snapshot > p { padding-block: var(--space-2); }
    .today-snapshot-item { gap: 0 var(--space-2); grid-template-columns: 4.25rem minmax(0, 1fr); padding-block: 0.38rem; }
    .today-snapshot-item a { font-size: 0.82rem; }
    .today-snapshot-status { font-size: var(--type-label); }
    .today-snapshot-note { display: none; }
    .today-wizard { grid-template-columns: 1fr; min-height: 0; }
    .today-wizard-rail { padding: 0.6rem 0.75rem; }
    .today-wizard-rail > .eyebrow, .today-wizard-privacy { display: none; }
    .today-wizard-rail ol { display: grid; grid-template-columns: repeat(3, 1fr); margin: 0; }
    .today-wizard-progress { gap: 0.3rem; grid-template-columns: 1.45rem 1fr; padding: 0.4rem; }
    .today-wizard-progress-link { gap: 0.3rem; grid-template-columns: 1.45rem 1fr; }
    .today-wizard-progress + .today-wizard-progress { border-left: 1px solid color-mix(in oklch, var(--surface-canvas) 24%, transparent); border-top: 0; }
    .today-wizard-progress > span, .today-wizard-progress-link > span { font-size: 1rem; }
    .today-wizard-progress small { font-size: var(--type-label); }
    .today-wizard-stage { padding: var(--space-4); }
    .today-wizard-stage h2 { font-size: var(--type-title); min-block-size: 1.72em; }
    .today-wizard-stage h2 span { display: inline; }
    .today-wizard-stage h2 span + span::before { content: " "; }
    .today-wizard-context { margin-top: var(--space-2); min-block-size: 3.1em; }
    .today-wizard-options { margin-top: var(--space-3); }
    .today-wizard-option label { grid-template-columns: minmax(0, 1fr) 1.25rem; min-height: 4.25rem; padding: 0.55rem 0.4rem; }
    .today-wizard-actions { align-items: flex-start; flex-direction: column-reverse; }
    .today-wizard-actions input { align-self: flex-end; }
    .today-index--results { padding-top: var(--space-3); }
    .today-answer-strip { align-items: stretch; grid-template-columns: minmax(0, 1fr) auto; }
    .today-answer-strip > p { display: none; }
    .today-answer-strip ul { grid-template-columns: repeat(3, 1fr); }
    .today-answer-strip li:first-child { border-left: 0; }
    .today-answer-strip li { padding: 0.55rem 0.45rem; }
    .today-answer-strip li span { font-size: var(--type-label); }
    .today-answer-strip li a { font-size: var(--type-label); }
    .today-answer-strip > a { border-left: 1px solid var(--border-soft); justify-content: center; padding: 0.55rem 0.7rem; }
    .today-results-heading { align-items: start; gap: var(--space-2); grid-template-columns: 1fr; padding-block: var(--space-3); }
    .today-results-heading > p { font-size: 0.75rem; justify-self: start; }
    .today-results-heading h1 { font-size: 2rem; }
    .today-card { grid-template-columns: 1fr; min-height: 0; }
    .today-card-context { align-items: center; border-bottom: 1px solid var(--border-soft); flex-direction: row; padding: 0.7rem 1rem; }
    .today-card-context p { font-size: var(--type-label); writing-mode: initial; }
    .today-card-body { border-left: 0; min-width: 0; padding: 1rem; }
    .today-card-status { margin-top: 0.55rem; }
    .today-card h2 { font-size: var(--type-title); }
    .today-card-summary { font-size: 0.9rem; }
    .today-card-evidence { border-left: 0; border-top: 1px solid var(--border-soft); grid-column: auto; padding: 0 1rem 1rem; }
    .today-card-evidence dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .today-card-evidence dl div { padding: 0.65rem 0.45rem; }
    .today-card-evidence dl div + div { border-left: 1px solid var(--border-soft); }
    .today-card-evidence dt, .today-card-evidence > p span { font-size: var(--type-label); }
    .today-card-evidence dd { font-size: var(--type-label); }
    .today-card-evidence > p { margin-top: 0; }
    .spot-stage-history { grid-template-columns: 1fr; }
    .spot-stage-history > div + div { border-left: 0; border-top: 1px solid var(--border-soft); }
    .site-footer { flex-direction: column; gap: 0.3rem; }
  }

  @media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    ::view-transition-group(*) { animation-duration: 0.01ms; }
    .today-wizard-option label, .today-wizard-option-arrow, .today-wizard-stage { transition: none; }
    .today-wizard-stage, .today-results--revealed { animation: none; }
    .today-wizard--leaving .today-wizard-stage { opacity: 1; transform: none; }
  }

  @media (max-width: 34rem) {
    .today-wizard-progress { display: block; }
    .today-wizard-progress-link { display: block; }
    .today-wizard-progress > span, .today-wizard-progress-link > span { display: block; margin-bottom: 0.2rem; }
    .today-wizard-progress small { display: none; }
  }
}

@layer components {
  .access-notice { color: var(--text-secondary); font-size: var(--type-label); line-height: 1.4; margin-top: var(--space-2); }
  .access-notice--current { color: var(--availability-limited); font-weight: 700; }
  .access-notice--closed { color: var(--availability-closed); }
  .access-notice a { text-decoration: underline; text-underline-offset: 0.2em; }
  .river-decision > .access-notice { border-top: 1px solid var(--border-soft); margin: 0; padding: var(--space-2) var(--space-4); }
  .river-decision-body--water .river-binary-claims { grid-template-columns: 1fr; }
  .river-decision-body--water .river-binary-claim { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--space-5); }
  .river-decision-body--water .river-hero-trend { grid-column: 2; grid-row: 1 / 6; align-self: end; margin: 0; display: grid; gap: var(--space-2); font-size: var(--type-small); }
  .river-hero-reading { font-family: var(--font-serif); font-size: clamp(2.75rem, 6vw, 4rem); font-weight: 500; letter-spacing: -0.04em; line-height: 1; margin-top: var(--space-2); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
  .river-hero-headline { font-size: var(--type-lead); }
  .river-hero-reading--stale { color: var(--text-secondary); font-size: clamp(2rem, 4vw, 2.75rem); }
  .river-rain-ahead span { color: var(--text-secondary); display: block; font-size: var(--type-label); }
  .river-hero-chart-link { align-items: center; display: inline-flex; font-size: var(--type-small); font-weight: 650; min-height: 2.75rem; }
  .river-chart-section { margin-top: var(--space-6); }
  .river-chart-heading { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--space-1) var(--space-4); margin-bottom: var(--space-2); }
  .river-chart-heading h2 { font-family: var(--font-serif); font-size: var(--type-title); font-weight: 500; letter-spacing: -0.02em; }
  .river-chart-heading p { color: var(--text-secondary); font-size: var(--type-caption); }
  .river-chart-heading .chart-key { flex-basis: 100%; }
  .chart-window { display: inline-flex; }
  .chart-window a { align-items: center; border: 1px solid var(--border-strong); display: inline-flex; font-size: var(--type-small); font-weight: 650; min-height: 2.75rem; padding: 0 var(--space-4); text-decoration: none; }
  .chart-window a + a { margin-left: -1px; }
  .chart-window a[aria-current="true"] { background: var(--text-primary); color: var(--surface-canvas); }
  .climbing-access-details { border-top: 1px solid var(--border-soft); padding-block: var(--space-4); }
  .climbing-access-details h2 { font-family: var(--font-serif); font-size: var(--type-lead); }
  .climbing-access-details p { color: var(--text-secondary); font-size: var(--type-small); }
  @media (max-width: 40rem) {
    .river-decision-body--water .river-binary-claim { display: block; }
    .river-decision-body--water .river-hero-trend { margin-top: var(--space-4); }
  }
}