/* Styles scoped to the Latest Headlines reading surface. */
.live-news {
  --rd-bg: #0b121a;
  --rd-panel: #101c27;
  --rd-panel-alt: #182836;
  --rd-ink: #f4eee1;
  --rd-muted: #b7c2cc;
  --rd-line: #354754;
  --rd-accent: #e5bc7c;
  --rd-warm: #f4d398;
  --rd-button: #e7be80;
  --rd-button-ink: #1c1710;
  --live-good: #a7d9bd;
}
html[data-theme="crimson"] .live-news {
  --rd-bg: #1a1016;
  --rd-panel: #261923;
  --rd-panel-alt: #34232c;
  --rd-line: #513847;
}
html[data-theme="kids"] .live-news {
  --rd-bg: #fff8eb;
  --rd-panel: #fffdf8;
  --rd-panel-alt: #f5e9d4;
  --rd-ink: #282017;
  --rd-muted: #5d5146;
  --rd-line: #cfbfa5;
  --rd-accent: #785226;
  --rd-warm: #825019;
  --rd-button: #784e23;
  --rd-button-ink: #fffaf0;
  --live-good: #296544;
}

.live-news [hidden] { display: none; }
.live-news .reading-nav [aria-current="location"] { color: var(--rd-ink); background: var(--rd-panel-alt); }
.live-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(250px, 340px);
  align-items: end;
  gap: clamp(24px, 5vw, 72px);
  padding-block: clamp(44px, 7vw, 96px) clamp(34px, 5vw, 68px);
}
.live-hero h1 { margin: .14em 0 .25em; font-size: clamp(46px, 7vw, 100px); line-height: 1.04; overflow-wrap: anywhere; }
.live-hero h1 em { color: var(--rd-warm); font-style: italic; }
.live-lead { max-width: 37rem; color: var(--rd-muted); }
.live-links { margin-top: 24px; }
.live-links a { gap: 10px; }
.live-board-status {
  padding: clamp(16px, 3vw, 25px);
  border: 1px solid var(--rd-line);
  border-top: 2px solid var(--rd-accent);
  border-radius: 12px;
  background: var(--rd-panel);
}
.live-status-message { color: var(--rd-warm); margin: 9px 0 12px; font-weight: 700; }
.live-status-message:empty { margin: 0; }
.live-status-message[data-mode="live"] { color: var(--live-good); }
.live-dates { margin: 12px 0; padding-block: 10px; border-block: 1px solid var(--rd-line); }
.live-dates dt { color: var(--rd-muted); font-size: .77rem; }
.live-dates dd { margin: 0; font-size: .92rem; font-variant-numeric: tabular-nums; }
.live-refresh-note { margin: 0; color: var(--rd-muted); font-size: .8rem; }

.live-dispatches { padding-block: 25px 75px; border-top: 1px solid var(--rd-line); }
.live-dispatch-heading { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 10px 20px; margin-bottom: 18px; }
.live-dispatch-heading h2 { margin: 5px 0 0; font-size: clamp(32px, 4vw, 48px); }
.live-dispatch-heading > p { color: var(--rd-muted); font-size: .85rem; }
.live-story-list { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--rd-line); }
.live-story {
  display: grid;
  grid-template-columns: 2.9rem minmax(0, 1fr) auto;
  align-items: baseline;
  gap: 5px 22px;
  padding-block: 19px;
  border-bottom: 1px solid var(--rd-line);
}
.live-story-index { color: var(--rd-accent); font-variant-numeric: tabular-nums; font-size: .82rem; }
.live-story-body { min-width: 0; }
.live-story h3 { margin: 0; font-size: clamp(1.15rem, 2.2vw, 1.5rem); line-height: 1.28; overflow-wrap: anywhere; }
.live-story h3 a { color: var(--rd-ink); text-underline-offset: .18em; }
.live-story h3 a:hover { color: var(--rd-warm); }
.live-story-source { margin: 4px 0 0; color: var(--rd-muted); font-size: .85rem; overflow-wrap: anywhere; }
.live-story-date { display: flex; flex-wrap: wrap; gap: 0 5px; color: var(--rd-muted); font-size: .82rem; font-variant-numeric: tabular-nums; }
.live-empty { padding: 16px; border: 1px solid var(--rd-line); background: var(--rd-panel); border-radius: 10px; }
.live-empty a { color: var(--rd-warm); }

@media (max-width: 760px) {
  .live-hero { grid-template-columns: 1fr; align-items: start; }
  .live-story { grid-template-columns: 1.85rem minmax(0, 1fr); gap: 5px 10px; }
  .live-story-date { grid-column: 2; }
}
@media (max-width: 400px) {
  .live-links a { width: 100%; justify-content: space-between; }
}