/* This layer belongs only to the upgraded race renderer. */
#kzRace #kzArena.rc-arena-ready {
  --rc-border: #d3e0d829;
  position: relative;
  height: clamp(400px, 49vw, 580px);
  min-height: 400px;
  border: 1px solid #6f84795e;
  border-radius: 6px;
  background: #142321;
  overflow: hidden;
  isolation: isolate;
  box-shadow: 0 16px 40px #00000030;
}
#kzRace #kzArena.rc-arena-ready::before,
#kzRace #kzArena.rc-arena-ready::after,
#kzRace #kzArena.rc-arena-ready > :is(.kz-sky,.kz-hills,.kz-stands,.kz-railfar,.kz-railnear) { display: none; }
#kzRace #kzTrack.rc-track-ready {
  position: absolute; inset: 44px 0 34px 168px; width: auto; height: auto;
  min-height: 0; transform: none; perspective: none; background: #5d7552;
  overflow: hidden; border: 0; border-radius: 0; z-index: 1;
}
#kzRace #kzTrack.rc-track-ready::before,
#kzRace #kzTrack.rc-track-ready::after,
#kzRace #kzTrack.rc-track-ready > :not(.rc-scene) { display: none; }
.rc-scene { position: absolute; inset: 0; overflow: hidden; }
.rc-canvas { display: block; width: 100%; height: 100%; outline: 0; }
.rc-broadcast,.rc-timeline { position: absolute; z-index: 6; display: flex; align-items: center; box-sizing: border-box; color: #e9f0e9; background: #142321; font: 500 12px/1.3 Inter,sans-serif; letter-spacing: 0; }
.rc-broadcast { inset: 0 0 auto; height: 44px; padding: 0 12px; gap: 14px; border-bottom: 1px solid var(--rc-border); }
.rc-identity { display: flex; align-items: center; gap: 15px; min-width: 0; }
.rc-brand { font-size: 12px; font-weight: 750; white-space: nowrap; }
.rc-number { color: #b7c8bd; font-variant-numeric: tabular-nums; white-space: nowrap; }
.rc-state { display: flex; align-items: center; gap: 6px; margin-left: auto; color: #d9e6dd; white-space: nowrap; font-size: 11px; }
.rc-state::before { content: ''; width: 5px; height: 5px; flex: 0 0 5px; border-radius: 50%; background: #d7bd79; }
.rc-state[data-phase="running"]::before { background: #85dfb6; }
.rc-camera-controls { display: flex; gap: 3px; align-self: stretch; align-items: center; }
#kzRace .rc-camera-button { display: grid; place-items: center; width: 34px; height: 34px; flex: 0 0 34px; padding: 0; border: 1px solid transparent; border-radius: 4px; color: #c5d8d0; background: transparent; cursor: pointer; box-shadow: none; }
#kzRace .rc-camera-button:hover { background: #30433e; color: #fff; }
#kzRace .rc-camera-button[aria-pressed="true"] { background: #2e5044; color: #b6f1d0; border-color: #69988366; }
#kzRace .rc-camera-button:focus-visible { outline: 2px solid #b6f1d0; outline-offset: -2px; }
.rc-timeline { inset: auto 0 0; height: 34px; padding: 0 14px; gap: 20px; border-top: 1px solid var(--rc-border); }
.rc-phase { font-size: 10px; font-weight: 600; color: #b8cabc; }
.rc-progress { flex: 1; height: 3px; background: #43534a; overflow: hidden; }
.rc-progress i { display: block; height: 100%; width: 100%; background: #8bd8b0; transform-origin: left; }
.rc-time { min-width: 42px; text-align: right; color: #eef4ee; font-size: 12px; font-variant-numeric: tabular-nums; }
#kzRace .rc-arena-ready #kzBoard { position: absolute; left: 0; top: 44px; bottom: 34px; right: auto; box-sizing: border-box; width: 168px; display: flex; flex-direction: column; gap: 0; margin: 0; padding: 12px 10px; border: 0; border-right: 1px solid var(--rc-border); border-radius: 0; background: #142321; box-shadow: none; backdrop-filter: none; z-index: 5; }
#kzRace .rc-arena-ready .kz-board__row { min-height: 40px; display: grid; grid-template-columns: 18px 6px minmax(0,1fr) 18px; align-items: center; gap: 5px; padding: 0 2px; border-bottom: 1px solid #c9dcd416; font: 500 11px/1.4 Inter,sans-serif; letter-spacing: 0; }
#kzRace .rc-arena-ready .kz-board__no { color: #b7c9bd; font: 600 11px/1.4 Inter,sans-serif; }
#kzRace .rc-arena-ready .kz-board__chip { width: 5px; height: 16px; border-radius: 2px; }
#kzRace .rc-arena-ready .kz-board__nm { color: #dfebe2; max-width: none; white-space: normal; overflow-wrap: normal; }
#kzRace .rc-arena-ready .kz-board__pos { font: 700 11px/1.3 Inter,sans-serif; color: #c1d0c5; }
#kzRace .rc-arena-ready .kz-board__row.is-lead { background: #74ba9220; }
#kzRace .rc-arena-ready .kz-board__row.is-lead .kz-board__pos { color: #b4edcc; }
#kzRace .rc-arena-ready .kz-board__row.is-mine .kz-board__nm { color: #b3edc9; text-decoration: underline; text-underline-offset: 3px; }
#kzRace .rc-arena-ready .kz-board__hd { font: 600 10px/1.4 Inter,sans-serif; color: #b6c9bd; padding: 0 0 8px; order: -1; }
.rc-markers { position: absolute; inset: 0; pointer-events: none; }
.rc-marker { position: absolute; left: -9px; top: -9px; z-index: 2; width: 18px; height: 18px; box-sizing: border-box; display: grid; place-items: center; background: #11251f; color: white; border: 2px solid var(--silk); border-radius: 50%; box-shadow: 0 1px 3px #0008; font: 700 10px/1 Inter,sans-serif; letter-spacing: 0; }
.rc-marker.is-lead { background: #f2f0dc; color: #1b3025; }
.rc-marker.is-mine { outline: 2px solid #f3e6ae; outline-offset: 2px; }
.rc-tether { position: absolute; left: 0; top: 0; height: 1px; background: var(--silk); transform-origin: left center; opacity: .8; }
.rc-marker[hidden],.rc-tether[hidden] { display: none; }
#kzRace #kzArena.rc-arena-ready.rc-expanded { position: fixed; inset: 0; z-index: 100; width: 100%; height: 100dvh; max-height: none; border: 0; border-radius: 0; }
@media (max-width: 760px) {
  #kzRace #kzArena.rc-arena-ready { height: 410px; min-height: 410px; }
  #kzRace #kzTrack.rc-track-ready { inset: 44px 0 130px; }
  #kzRace .rc-arena-ready #kzBoard { inset: auto 0 34px; width: auto; height: 96px; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 0 8px; padding: 5px 8px; border-right: 0; border-top: 1px solid var(--rc-border); }
  #kzRace .rc-arena-ready .kz-board__row { grid-template-columns: 12px 4px minmax(0,1fr); min-height: 38px; gap: 4px; font-size: 10px; }
  #kzRace .rc-arena-ready .kz-board__pos { display: none; }
  #kzRace .rc-arena-ready .kz-board__hd { display: none; }
  .rc-brand { display: none; }
  .rc-identity { gap: 0; }
  .rc-broadcast { padding: 0 8px; gap: 7px; }
  .rc-number { font-size: 11px; }
  .rc-state { font-size: 10px; min-width: 0; white-space: normal; text-align: right; }
  .rc-camera-controls { gap: 0; }
  #kzRace .rc-camera-button { width: 36px; height: 40px; flex-basis: 36px; }
  .rc-phase { display: none; }
  .rc-timeline { gap: 12px; }
}
@media (max-width: 380px) {
  .rc-number { font-size: 10px; }
  .rc-state { max-width: 65px; }
  .rc-camera-controls { flex-shrink: 0; }
}
@media (forced-colors: active) {
  .rc-marker { forced-color-adjust: none; }
  #kzRace .rc-camera-button[aria-pressed="true"] { outline: 2px solid Highlight; }
}
