/* ==========================================================================
   worstats.css — the site nav (Home / Past Winners / Race Data) added to the
   header, and the home-page race-data stat band. Loaded by index.html,
   past-winners.html, and the /racedata pages. Standalone so it can't disturb
   the existing compiled Tailwind (style.css) or hand CSS (mistyles.css).
   ========================================================================== */

/* Site nav in the header — centered, below the car lanes. */
.wor-nav {
  display: flex; justify-content: center; flex-wrap: wrap; gap: 4px 6px; margin-top: 10px;
}
.wor-nav a {
  font-family: "Racing Sans One", ui-sans-serif, system-ui, sans-serif;
  font-size: 13px; letter-spacing: .5px; color: #94a3b8; text-decoration: none;
  padding: 5px 14px; border-radius: 999px; border: 1px solid transparent;
  transition: color .15s, background-color .15s, border-color .15s;
}
.wor-nav a:hover { color: #f1f5f9; background: rgba(255,255,255,.06); }
.wor-nav a.active { color: #ffffff; border-color: #E4002B; background: rgba(228,0,43,.12); }
.wor-nav a:focus-visible { outline: 2px solid #38a9e8; outline-offset: 2px; }

/* Home-page race-data stat band (populated by js/hometiles.js). */
.wor-stats {
  max-width: 1100px; margin: 0 auto; display: grid; gap: 10px;
  grid-template-columns: repeat(4, 1fr);
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  text-align: left;
}
.wor-stat {
  background: #111c33; border: 1px solid #24344f; border-radius: 13px;
  padding: 14px 15px; position: relative; overflow: hidden;
}
.wor-stat::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: #007AC2; }
.wor-stat.r::before { background: #E4002B; } .wor-stat.a::before { background: #f5b53d; } .wor-stat.w::before { background: #ffffff; }
.wor-stat .k { font-size: 11px; text-transform: uppercase; letter-spacing: 1.1px; color: #8397b3; }
.wor-stat .v { font-size: 26px; margin-top: 3px; color: #f1f5f9; font-variant-numeric: tabular-nums; }
.wor-stat .v small { font-size: 13px; color: #8397b3; }
.wor-stat .t { font-size: 11.5px; color: #cbd5e1; margin-top: 2px; }
@media (max-width: 820px) { .wor-stats { grid-template-columns: repeat(2, 1fr); } }