.race { --race-font:ui-rounded,system-ui,sans-serif; margin:42px 0; scroll-margin-top:28px; }
.race * { font-family:var(--race-font); }
.race-heading { display:flex; align-items:baseline; justify-content:space-between; gap:16px; }
.race h2 { margin:0; }
.race-heading a { color:var(--muted); font-size:var(--type-caption); white-space:nowrap; }
.race-player { margin-top:20px; padding:26px 24px 20px; background:#fff; border:1px solid var(--line); border-radius:8px; }
.race-topline { display:flex; justify-content:space-between; align-items:center; gap:12px; color:var(--muted); font-size:var(--type-caption); }
.race-topline span { font-size:inherit; }
.race-title { margin:6px 0 0; color:#111; font-size:var(--type-title); font-weight:700; line-height:1.18; letter-spacing:-.025em; }
.race-chart { position:relative; height:350px; margin:12px 0 0; overflow:hidden; }
.race-row { position:absolute; left:0; right:0; top:0; height:36px; will-change:transform; }
.race-bar { position:absolute; left:0; top:0; height:32px; border-radius:3px; }
.race-label { position:absolute; top:0; height:32px; display:flex; gap:8px; align-items:center; white-space:nowrap; color:#111; }
.race-name { font-weight:650; font-size:var(--type-body); }
.race-value { color:#686868; font-size:var(--type-body); font-variant-numeric:tabular-nums; }
.race-scale-note { margin:0 0 8px; color:var(--muted); font-size:var(--type-caption); }
.race-timeline { display:block; width:100%; margin:0; appearance:none; background:transparent; cursor:pointer; height:24px; }
.race-timeline::-webkit-slider-runnable-track { height:4px; background:linear-gradient(to right,#111 var(--race-progress,0%),#ededed var(--race-progress,0%)); border-radius:4px; }
.race-timeline::-webkit-slider-thumb { appearance:none; width:16px; height:16px; margin-top:-6px; background:#111; border:0; border-radius:50%; }
.race-timeline::-moz-range-track { height:4px; background:#ededed; border:0; border-radius:4px; }
.race-timeline::-moz-range-progress { height:4px; background:#111; }
.race-timeline::-moz-range-thumb { width:16px; height:16px; background:#111; border:0; border-radius:50%; }
.race-range { display:flex; justify-content:space-between; color:var(--muted); margin:2px 0 16px; }
.race-range span { font-size:var(--type-caption); }
.race-controls { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.race button,.race select { color:#222; background:#fff; border:1px solid #ddd; border-radius:20px; min-height:36px; padding:6px 12px; font-size:var(--type-caption); cursor:pointer; }
.race button:hover,.race select:hover { background:#f5f5f3; }
.race button:focus-visible,.race select:focus-visible,.race input:focus-visible,.race a:focus-visible { outline:2px solid #3670ff; outline-offset:3px; }
.race .race-play { background:#111; color:#fff; min-width:80px; border-color:#111; }
.race .race-play:hover { background:#333; }
.race .race-play:disabled { opacity:.5; cursor:wait; }
.race-source { margin:16px 0 0; color:var(--muted); font-size:var(--type-caption); }
.race-source a,.race-source span { font-size:inherit; color:inherit; }
.race details { margin-top:12px; color:var(--muted); font-size:var(--type-caption); }
.race summary { font-size:inherit; cursor:pointer; }
.race details p { margin:8px 0 0; font-size:inherit; }
.race-error { color:#9d3328; font-size:var(--type-caption); }
.race-sr { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.race-standalone { width:min(100% - 48px,1100px); padding:48px 0; }
.race-standalone .race { margin:28px 0; }
.race-standalone .race-player { border:0; padding:0; }
.race-standalone .race-chart { margin-top:12px; }
@media (max-width:560px) {
  .race-player { padding:18px 12px; }
  .race-heading { align-items:center; }
  .race-name,.race-value { font-size:var(--type-caption); }
  .race-label { gap:6px; }
  .race-bar { left:0; }
  .race-topline { flex-wrap:wrap; gap:2px 12px; }
  .race-controls { gap:6px; }
  .race button,.race select { padding:6px 9px; }
  .race-standalone { width:calc(100% - 28px); padding-top:28px; }
}
@media (prefers-reduced-motion:reduce) { .race-row { will-change:auto; } }
.race-options { display:flex; align-items:flex-start; flex-wrap:wrap; gap:12px 20px; margin-top:14px; }
.race-options .race-companies { margin:0; position:relative; color:var(--ink); }
.race-companies summary { padding:6px 12px; border:1px solid #ddd; border-radius:20px; min-height:36px; }
.race-company-panel { position:absolute; z-index:20; left:0; top:44px; width:min(360px,calc(100vw - 70px)); padding:14px; background:#fff; border:1px solid #ddd; border-radius:8px; box-shadow:0 6px 22px #00000012; }
.race-company-panel input[type=search] { width:100%; padding:8px 10px; font-size:var(--type-caption); border:1px solid #ddd; border-radius:4px; }
.race-company-actions { display:flex; gap:8px; margin:10px 0; }
.race-company-list { border:0; padding:0; margin:0; max-height:250px; overflow:auto; display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.race-company-list label { display:flex; align-items:center; gap:6px; font-size:var(--type-caption); cursor:pointer; line-height:1.35; min-height:30px; }
.race-company-list label[hidden] { display:none; }
.race-company-list span { font-size:inherit; overflow-wrap:anywhere; }
.race-company-list input,.race-weight-toggle input { accent-color:#111; flex-shrink:0; width:16px; height:16px; margin:0; }
.race-weight-toggle { display:flex; align-items:center; gap:8px; font-size:var(--type-caption); min-height:36px; cursor:pointer; }
.race-selection-note,.race-no-results { margin:10px 0 0; font-size:var(--type-caption); color:var(--muted); }
.race-empty { position:absolute; top:20px; left:0; color:var(--muted); font-size:var(--type-caption); }
.race-label { width:max-content; }
.race-name { min-width:0; overflow:hidden; text-overflow:ellipsis; }
.race-value { flex-shrink:0; }
.race-companies summary:focus-visible { outline:2px solid #3670ff; outline-offset:3px; }
@media (max-width:560px) {
  .race-options .race-companies[open] { width:100%; }
  .race-company-panel { position:static; width:100%; margin-top:8px; box-shadow:none; }
}
.race-control-label { display:flex; align-items:center; gap:6px; color:var(--muted); font-size:var(--type-caption); }