/* Shared visual polish layered last: cleaner hierarchy, compact heroes, consistent cards and status colours. */

:root {
  --rw-good: #477c59;
  --rw-good-soft: #e8f1ec;
  --rw-caution: #b7791f;
  --rw-caution-soft: #fff7e6;
  --rw-poor: #b42318;
  --rw-poor-soft: #fff1f0;
  --rw-water: #0f766e;
  --rw-water-soft: #ecfeff;
  --rw-muted: #64748b;
  --rw-muted-soft: #f1f5f9;
  --rw-ink: #10231b;
  --rw-card-shadow: 0 14px 34px rgba(21, 50, 37, 0.08);
  --rw-card-shadow-hover: 0 20px 46px rgba(21, 50, 37, 0.13);
}

.site-status-strip {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 10px;
  margin: -4px 0 14px;
  border: 1px solid rgba(16, 35, 27, 0.1);
  border-radius: 18px;
  padding: 10px 12px;
  background: rgba(255, 255, 255, 0.82);
  box-shadow: 0 12px 30px rgba(21, 50, 37, 0.07);
  backdrop-filter: blur(12px);
}

.site-status-strip[data-condition='good'] { border-color: rgba(71, 124, 89, 0.22); background: rgba(232, 241, 236, 0.86); }
.site-status-strip[data-condition='caution'] { border-color: rgba(183, 121, 31, 0.24); background: rgba(255, 247, 230, 0.9); }
.site-status-strip[data-condition='poor'] { border-color: rgba(180, 35, 24, 0.2); background: rgba(255, 241, 240, 0.92); }
.site-status-strip[data-condition='overflow-alert'] { border-color: rgba(15, 118, 110, 0.24); background: rgba(236, 254, 255, 0.92); }

.site-status-label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border-radius: 999px;
  padding: 7px 10px;
  background: #10231b;
  color: #fff;
  font-size: 0.76rem;
  font-weight: 950;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  white-space: nowrap;
}

.site-status-strip[data-condition='good'] .site-status-label { background: var(--rw-good); }
.site-status-strip[data-condition='caution'] .site-status-label { background: var(--rw-caution); }
.site-status-strip[data-condition='poor'] .site-status-label { background: var(--rw-poor); }
.site-status-strip[data-condition='overflow-alert'] .site-status-label { background: var(--rw-water); }

.site-status-dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: currentColor;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.22);
}

.site-status-copy {
  min-width: 0;
  color: #244334;
  font-size: 0.92rem;
  font-weight: 900;
  line-height: 1.35;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.site-status-time {
  color: #607367;
  font-size: 0.78rem;
  font-weight: 900;
  white-space: nowrap;
}

.hero-compact,
.page-hero {
  overflow: hidden;
}

.page-hero h1,
.hero-compact h1 {
  max-width: 980px;
  letter-spacing: -0.055em;
}

.page-hero .lede,
.hero-compact .lede {
  font-size: clamp(0.98rem, 1.4vw, 1.13rem);
  line-height: 1.55;
}

.jump-links {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 18px;
}

.jump-links a,
.page-hero .jump-links a,
.hero-compact .jump-links a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 999px;
  padding: 0 14px;
  background: rgba(255, 255, 255, 0.12);
  color: rgba(255, 255, 255, 0.92);
  font-size: 0.86rem;
  font-weight: 900;
  text-decoration: none;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.12);
  backdrop-filter: blur(8px);
}

.jump-links a:hover,
.page-hero .jump-links a:hover,
.hero-compact .jump-links a:hover {
  background: rgba(255, 255, 255, 0.2);
  color: #ffffff;
}

.panel,
.station-card,
.summary-card,
.chart-summary-card,
.weather-card,
.weather-insight-card,
.note-card,
.fly-card,
.guide-card,
.reason-item,
.threshold-card,
.overflow-card {
  box-shadow: var(--rw-card-shadow);
}

.summary-card strong,
.chart-summary-card strong,
.weather-card strong,
.condition-metrics dd,
.reading-list dd {
  letter-spacing: -0.035em;
}

.summary-card span,
.chart-summary-card span,
.weather-card span,
.condition-metrics dt,
.reading-list dt {
  color: #607367;
  font-size: 0.76rem;
  font-weight: 950;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.condition-panel[data-condition='good'],
.status.good,
.summary-card.good {
  border-color: rgba(71, 124, 89, 0.18);
  background: linear-gradient(180deg, #ffffff 0%, var(--rw-good-soft) 100%);
}

.condition-panel[data-condition='caution'] {
  border-color: rgba(183, 121, 31, 0.2);
  background: linear-gradient(180deg, #ffffff 0%, var(--rw-caution-soft) 100%);
}

.condition-panel[data-condition='poor'] {
  border-color: rgba(180, 35, 24, 0.18);
  background: linear-gradient(180deg, #ffffff 0%, var(--rw-poor-soft) 100%);
}

.condition-panel[data-condition='overflow alert'],
.summary-card.warning {
  border-color: rgba(15, 118, 110, 0.2);
  background: linear-gradient(180deg, #ffffff 0%, var(--rw-water-soft) 100%);
}

.summary-card.muted-card,
.chart-summary-card {
  background: linear-gradient(180deg, #ffffff 0%, #f8fbf9 100%);
}

.clickable-card,
a .clickable-card,
.reason-item-link,
.overflow-card.clickable-card,
.fly-card {
  transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease, background 160ms ease;
}

.clickable-card:hover,
a:hover .clickable-card,
.reason-item-link:hover,
.overflow-card.clickable-card:hover,
.fly-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--rw-card-shadow-hover);
  border-color: rgba(71, 124, 89, 0.32) !important;
}

.clickable-card .card-action-hint,
.card-action-hint,
.reason-source-link,
.map-pill,
.count-pill,
.data-quality-pill {
  letter-spacing: 0.01em;
}

.card-action-hint::before,
.reason-source-link::before,
.map-pill::before,
.weather-back-link::before {
  content: '';
}

.status,
.condition-badge,
.count-pill,
.data-quality-pill,
.relevance-pill,
.reason-source-link,
.fly-card-purpose,
.fly-rank {
  box-shadow: 0 8px 18px rgba(16, 35, 27, 0.08);
}

.condition-badge,
.count-pill {
  background: #10231b;
  color: #fff;
}

.condition-panel[data-condition='good'] .condition-badge { background: var(--rw-good); }
.condition-panel[data-condition='caution'] .condition-badge { background: var(--rw-caution); }
.condition-panel[data-condition='poor'] .condition-badge { background: var(--rw-poor); }
.condition-panel[data-condition='overflow alert'] .condition-badge { background: var(--rw-water); }

.fly-guide-condition-strip li::before,
.weather-note-list li span:first-child,
.status-breakdown li span:first-child {
  opacity: 0.9;
}

.fly-advice-panel .section-heading,
#fly-purpose-panel .section-heading,
#fly-switch-triggers .section-heading,
#fly-leader-guidance .section-heading {
  margin-bottom: 0;
}

.fly-card-title {
  gap: 10px;
}

.site-footer {
  display: grid;
  gap: 4px;
  margin: 14px 0 0;
  border-top: 1px solid rgba(16, 35, 27, 0.08);
  padding: 14px 0 2px;
  color: #607367;
  font-size: 0.78rem;
  font-weight: 750;
  line-height: 1.45;
}

.site-footer p {
  max-width: 880px;
  margin: 0;
}

.site-footer strong {
  color: #10231b;
  font-weight: 950;
}

@media (min-width: 761px) {
  .page-shell {
    gap: 18px;
  }

  .hero-compact,
  .page-hero {
    min-height: 230px;
  }

  .hero-compact h1,
  .page-hero h1 {
    font-size: clamp(2.2rem, 4.3vw, 4.9rem);
  }
}

@media (min-width: 1181px) {
  .hero-compact,
  .page-hero {
    min-height: 235px;
  }
}

@media (max-width: 760px) {
  .site-status-strip {
    grid-template-columns: 1fr;
    align-items: start;
    gap: 7px;
    margin-bottom: 10px;
    border-radius: 15px;
    padding: 9px 10px;
    box-shadow: 0 8px 18px rgba(21, 50, 37, 0.05);
  }

  .site-status-label {
    padding: 6px 9px;
    font-size: 0.7rem;
  }

  .site-status-copy {
    white-space: normal;
    font-size: 0.84rem;
    line-height: 1.3;
  }

  .site-status-time {
    font-size: 0.72rem;
  }

  .hero-compact,
  .page-hero {
    min-height: 178px;
    padding: 20px;
    border-radius: 22px;
  }

  .home-shell .hero-compact {
    min-height: 178px;
  }

  .hero-compact h1,
  .page-hero h1 {
    font-size: clamp(1.55rem, 7.8vw, 2.55rem);
    line-height: 1;
  }

  .page-hero .lede,
  .hero-compact .lede {
    font-size: 0.93rem;
    line-height: 1.45;
  }

  .jump-links {
    margin-top: 14px;
    gap: 7px;
  }

  .jump-links a,
  .page-hero .jump-links a,
  .hero-compact .jump-links a {
    min-height: 34px;
    padding: 0 11px;
    font-size: 0.8rem;
    box-shadow: none;
  }

  .panel,
  .station-card,
  .summary-card,
  .chart-summary-card,
  .weather-card,
  .weather-insight-card,
  .note-card,
  .fly-card,
  .guide-card,
  .reason-item,
  .threshold-card,
  .overflow-card,
  .home-feature-card,
  .timeline-card,
  .condition-split-card,
  .local-note-list li {
    box-shadow: 0 8px 18px rgba(21, 50, 37, 0.055);
  }

  .clickable-card:hover,
  a:hover .clickable-card,
  .reason-item-link:hover,
  .overflow-card.clickable-card:hover,
  .fly-card:hover {
    transform: none;
    box-shadow: 0 8px 18px rgba(21, 50, 37, 0.055);
  }
}