/* Shared public race UI. OBS has its own stylesheet and contrast rules. */
body { --race-accent: #df514b; --race-surface: #171a1f; --race-line: #32363d; }
body > header { background: #101214; border-color: #30343a; }
.desktop-nav a { display: inline-flex; align-items: center; min-height: 44px; }
body a:focus-visible, body button:focus-visible, body summary:focus-visible { outline: 2px solid #f08b85; outline-offset: 4px; }
.race-nav-link { color: #bcc0c7; border-radius: 3px; letter-spacing: .02em; }
.race-nav-link:hover { color: #fff; border-color: var(--race-accent); }
.race-nav-link[aria-current="page"] { color: #fff; border-color: var(--race-accent); }
.race-subnav { font-family: 'Noto Sans JP', sans-serif; letter-spacing: .01em; border-radius: 4px; min-height: 44px; display: inline-flex; align-items: center; }
body[data-page="live"] h1, body[data-page="results"] h1, body[data-page="entries"] h1,
body[data-page="pilots"] h1, body[data-page="heats"] h1, body[data-page="ranking"] h1,
body[data-page="race-hub"] h1, body[data-page="media-hub"] h1 {
  font-size: clamp(1.75rem, 3.5vw, 2.8rem); line-height: 1.3; font-style: normal;
  color: #f3f2ec; background-image: none; -webkit-text-fill-color: currentColor;
}
.race-event-badge { border: 1px solid var(--race-line); background: var(--race-surface); color: #e0e2e5; box-shadow: none; letter-spacing: .01em; font-family: 'Noto Sans JP', sans-serif; }
body[data-page="live"] [data-live-card] { border-color: var(--race-line); border-radius: 8px; }
body[data-page="live"] [data-live-card="latest"] { border-top: 3px solid var(--race-accent); }
body[data-page="live"] [data-live-card] p, body[data-page="live"] [data-live-card] span { letter-spacing: normal; }
body[data-page="live"] [data-live-card] > p:first-child,
body[data-page="live"] [data-live-card] > div:first-child > p:first-child { color: #c2c6cd; }
body[data-page="live"] [data-live-latest-time] { color: #fff; font-size: 2rem; }
body[data-page="live"] [data-live-rows] td:nth-child(2),
body[data-page="live"] [data-live-rows] td:nth-child(6),
body[data-page="live"] [data-live-rows] td:nth-child(7) { color: #d1d5db; }
body[data-page="live"] [data-live-rows] td:nth-child(5) { color: #fff; }
body[data-page="live"] .live-row-new td:nth-child(5) { color: #fff; }
.race-live-heading { text-align: left; border-bottom: 1px solid var(--race-line); padding-bottom: 16px; }
.race-live-heading p { font-size: 13px; line-height: 1.7; color: #b3b8c0; }
.race-live-heading a { display: inline-flex; align-items: center; min-height: 44px; color: #f08b85; text-decoration: underline; text-underline-offset: 4px; }
.race-live-heading h1 { margin-bottom: 8px; }
.race-recent-row { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 3px 12px; padding: 7px 0; border-top: 1px solid var(--race-line); }
.race-recent-row strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; }
.race-recent-row small { grid-column: 1/-1; color: #9fa6b0; font-size: 11px; }
.race-recent-row time { font-variant-numeric: tabular-nums; color: #f3f2ec; font-size: 14px; }
.race-empty { max-width: 640px; margin: 40px auto; padding: 28px; border-top: 2px solid var(--race-accent); background: var(--race-surface); }
.race-empty h2 { color: #f3f2ec; font-size: 24px; }
.race-empty p { color: #bbc0c8; line-height: 1.8; margin-top: 16px; }
.race-empty a { display: inline-flex; min-height: 44px; align-items: center; color: #f08b85; text-decoration: underline; margin-top: 12px; }
@media (max-width: 639px) {
  .race-live-heading { padding-bottom: 10px; }
  body[data-page="live"] [data-live-summary] { gap: 10px; }
  body[data-page="live"] [data-live-card] { padding: 14px; }
  .race-recent-row { padding: 5px 0; }
}
