.timing-page { overflow-x: hidden; background: #07090d; }
.timing-header { background: rgba(6,8,11,.88); backdrop-filter: blur(18px); }
.connection-dot,.live-pulse { display: inline-block; width: 8px; height: 8px; margin-right: 8px; border-radius: 50%; background: #e05e1c; box-shadow: 0 0 0 0 rgba(224,94,28,.55); animation: livePulse 1.8s infinite; }
@keyframes livePulse { 70% { box-shadow: 0 0 0 10px rgba(224,94,28,0); } }
.timing-hero { position: relative; min-height: 430px; overflow: hidden; }
.timing-hero-bg { position: absolute; inset: 0; background: url('/r2la/static/src-theme/gtw-2026.jpg') center 48% / cover; filter: saturate(.7); }
.timing-hero-overlay { position: absolute; inset: 0; background: linear-gradient(90deg,rgba(3,5,8,.96),rgba(3,5,8,.68) 55%,rgba(3,5,8,.32)),linear-gradient(0deg,#07090d,transparent 55%); }
.timing-hero-content { position: relative; z-index: 1; min-height: 430px; padding-top: 120px; display: flex; align-items: center; justify-content: space-between; gap: 60px; }
.timing-hero h1 { max-width: 860px; margin: 0; font-size: clamp(2.7rem,5.4vw,5.7rem); line-height: .9; letter-spacing: -.055em; text-transform: uppercase; }
.timing-hero-content > div:first-child > p:last-child { color: #c7ccd4; font-size: 1.06rem; }
.session-clock { min-width: 245px; padding: 24px; border: 1px solid rgba(255,255,255,.25); background: rgba(6,8,11,.7); text-align: right; }
.session-clock span,.session-clock small,.session-clock strong { display: block; }
.session-clock span { color: #e05e1c; font-size: .68rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.session-clock strong { margin: 4px 0; font-variant-numeric: tabular-nums; font-size: 2.3rem; line-height: 1; }
.session-clock small { color: #a9afb8; }
.timing-dashboard { position: relative; z-index: 3; margin-top: -36px; padding-bottom: 100px; }
.server-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.server-tabs button { padding: 11px 15px; border: 1px solid var(--line); background: #11151b; color: #b8bec7; font-size: .7rem; font-weight: 800; text-transform: uppercase; cursor: pointer; }
.server-tabs button.active,.server-tabs button:hover { border-color: #e05e1c; background: #e05e1c; color: white; }
.timing-overview { display: grid; grid-template-columns: minmax(0,1.55fr) minmax(320px,.7fr); gap: 16px; }
.track-panel,.race-panel,.standings-panel { border: 1px solid var(--line); border-radius: 18px; background: #10141a; box-shadow: 0 25px 70px rgba(0,0,0,.25); }
.track-panel,.race-panel { padding: 25px; }
.panel-heading,.standings-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 25px; }
.panel-heading .eyebrow,.standings-head .eyebrow { margin-bottom: 7px; }
.panel-heading h2,.standings-head h2 { margin: 0; font-size: 1.5rem; text-transform: uppercase; }
.track-legend { display: flex; flex-wrap: wrap; gap: 12px; color: #8f96a1; font-size: .62rem; text-transform: uppercase; }
.track-legend i { display: inline-block; width: 8px; height: 8px; margin-right: 5px; border-radius: 50%; }
.leader-key { background: #e05e1c; }.driver-key { background: #f5f6f7; }.pit-key { background: #727985; }
.track-stage { position: relative; min-height: 420px; margin-top: 12px; overflow: hidden; border-radius: 12px; background: radial-gradient(circle at 50% 50%,rgba(224,94,28,.08),transparent 52%),linear-gradient(135deg,#0b0e13,#07090d); }
.track-stage::before { content: ''; position: absolute; inset: 0; opacity: .22; background-image: linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px); background-size: 32px 32px; }
#track-map { position: relative; z-index: 1; width: 100%; height: 420px; overflow: visible; }
#track-map[data-track-image="true"] .track-shadow,
#track-map[data-track-image="true"] .track-line,
#track-map[data-track-image="true"] .track-progress,
#track-map[data-track-image="true"] #sector-points { display: none; }
#track-layout-image { pointer-events: none; }
.track-shadow,.track-line,.track-progress { fill: none; stroke-linecap: round; stroke-linejoin: round; }
.track-shadow { stroke: #020305; stroke-width: 30; }
.track-line { stroke: #525a65; stroke-width: 18; }
.track-progress { stroke: #e05e1c; stroke-width: 3; stroke-dasharray: 7 10; opacity: .85; }
.sector-point circle { fill: #0b0e13; stroke: #e05e1c; stroke-width: 3; }
.sector-point text { fill: #d9dde2; font: 800 12px Inter,sans-serif; text-anchor: middle; dominant-baseline: central; }
.driver-marker { cursor: pointer; transition: opacity .2s; }
.driver-marker circle { fill: #f2f3f5; stroke: #07090d; stroke-width: 4; filter: drop-shadow(0 3px 7px rgba(0,0,0,.65)); }
.driver-marker text { fill: #07090d; font: 900 12px Inter,sans-serif; text-anchor: middle; dominant-baseline: central; pointer-events: none; }
.driver-marker.leader circle,.driver-marker.highlighted circle { fill: #e05e1c; }
.driver-marker.pit circle { fill: #727985; }
.track-credit { position: absolute; right: 15px; bottom: 10px; z-index: 2; color: #656c76; font-size: .58rem; text-transform: uppercase; }
.track-empty { position: absolute; inset: 0; z-index: 3; display: grid; place-items: center; color: #8d949e; text-transform: uppercase; }
.track-empty[hidden] { display: none !important; }
.weather-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 22px 0; }
.weather-grid div { padding: 15px; border: 1px solid var(--line); background: #0b0e13; }
.weather-grid span,.weather-grid strong { display: block; }
.weather-grid span,.race-facts span { color: #7e858f; font-size: .62rem; font-weight: 800; text-transform: uppercase; }
.weather-grid strong { margin-top: 4px; font-size: 1.35rem; }
.race-facts { border-top: 1px solid var(--line); }
.race-facts div { display: flex; justify-content: space-between; gap: 12px; padding: 13px 2px; border-bottom: 1px solid var(--line); }
.race-facts strong { font-size: .83rem; font-variant-numeric: tabular-nums; }
.original-link { display: flex; justify-content: space-between; margin-top: 20px; padding: 13px 15px; background: #e05e1c; font-size: .7rem; font-weight: 850; text-transform: uppercase; }
.standings-panel { margin-top: 16px; padding: 25px; }
.standings-head { align-items: end; margin-bottom: 20px; }
.timing-options { display: flex; flex-wrap: wrap; gap: 7px; }
.timing-options button { padding: 8px 11px; border: 1px solid var(--line); background: transparent; color: #aeb4bd; font-size: .65rem; font-weight: 850; text-transform: uppercase; cursor: pointer; }
.timing-options button[aria-pressed="true"],.timing-options button:hover { border-color: #e05e1c; background: #e05e1c; color: white; }
.table-scroll { overflow-x: auto; }
.timing-table { width: 100%; min-width: 1180px; border-collapse: collapse; font-size: .76rem; font-variant-numeric: tabular-nums; }
.timing-table th { position: sticky; top: 0; z-index: 1; padding: 12px 10px; border-bottom: 2px solid #e05e1c; background: #0a0d11; color: #8e96a1; text-align: left; font-size: .62rem; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; }
.timing-table th:first-child,.timing-table td:first-child { text-align: center; }
.timing-table td { padding: 11px 10px; border-bottom: 1px solid rgba(255,255,255,.075); color: #c9ced5; white-space: nowrap; }
.timing-table tr { transition: background .16s; }
.timing-table tbody tr:hover,.timing-table tbody tr.highlighted { background: rgba(224,94,28,.1); }
.timing-table .position { display: inline-grid; width: 28px; height: 28px; place-items: center; border: 1px solid var(--line); font-weight: 900; }
.timing-table tr:first-child .position { background: #e05e1c; color: white; border-color: #e05e1c; }
.driver-name { color: white !important; font-weight: 800; }
.driver-name small { display: block; color: #747b85; font-size: .6rem; font-weight: 700; text-transform: uppercase; }
.sector-best { color: #b96cff !important; }.sector-personal { color: #e05e1c !important; }.muted-value { color: #686f79 !important; }.status-dnf { color: #ff7a7a !important; font-weight: 900; }.pit-value { color: #e05e1c !important; }
.tire-badge { padding: 3px 6px; border: 1px solid var(--line); font-size: .6rem; text-transform: uppercase; }
.loading-row { height: 130px; color: #8c939d !important; text-align: center !important; text-transform: uppercase; }
.timing-note { display: flex; flex-wrap: wrap; gap: 22px; margin-top: 18px; color: #858c96; font-size: .62rem; text-transform: uppercase; }
.timing-note span::before { content: ''; display: inline-block; width: 8px; height: 8px; margin-right: 7px; border-radius: 50%; background: #e05e1c; }.timing-note span:nth-child(2)::before { background: #b96cff; }.timing-note span:nth-child(3)::before { background: #ff7a7a; }
.timing-footer { padding-top: 20px; }
[data-hidden="true"] { display: none !important; }

@media (min-width: 1100px) {
  .standings-panel { width: min(1760px,calc(100vw - 32px)); margin-left: 50%; transform: translateX(-50%); }
  .table-scroll { overflow-x: hidden; }
  .timing-table { min-width: 0; table-layout: fixed; font-size: .71rem; }
  .timing-table th { padding: 11px 6px; font-size: .56rem; letter-spacing: .035em; }
  .timing-table td { overflow: hidden; padding: 10px 6px; text-overflow: ellipsis; }
  .timing-table th:nth-child(1) { width: 4%; }.timing-table th:nth-child(2) { width: 3%; }.timing-table th:nth-child(3) { width: 13%; }.timing-table th:nth-child(4) { width: 6%; }.timing-table th:nth-child(5) { width: 16%; }
  .timing-table th:nth-child(6) { width: 7%; }.timing-table th:nth-child(7) { width: 6%; }.timing-table th:nth-child(8) { width: 7.5%; }.timing-table th:nth-child(9) { width: 6%; }.timing-table th:nth-child(10) { width: 7%; }
  .timing-table th:nth-child(11),.timing-table th:nth-child(12),.timing-table th:nth-child(13) { width: 5%; }.timing-table th:nth-child(14) { width: 4%; }.timing-table th:nth-child(15) { width: 5%; }
}

@media (max-width: 980px) {
  .timing-hero-content { padding-top: 80px; }
  .timing-overview { grid-template-columns: 1fr; }
  .session-clock { min-width: 210px; }
}
@media (max-width: 700px) {
  .timing-hero { min-height: 530px; }.timing-hero-content { min-height: 530px; flex-direction: column; align-items: flex-start; justify-content: center; gap: 28px; }.session-clock { width: 100%; text-align: left; }
  .timing-dashboard { margin-top: -22px; }.track-panel,.race-panel,.standings-panel { padding: 17px; border-radius: 12px; }.panel-heading,.standings-head { flex-direction: column; }.track-legend { display: none; }.track-stage,#track-map { min-height: 310px; height: 310px; }.weather-grid { grid-template-columns: repeat(4,1fr); }.weather-grid div { padding: 10px 7px; }.weather-grid strong { font-size: 1rem; }.timing-options { width: 100%; }.timing-options button { flex: 1; }.footer-bottom div { flex-wrap: wrap; }
}


/* SRC direct language switch */
.src-language-switch {
  position: fixed;
  z-index: 10000;
  top: 8px;
  right: 14px;
  display: flex;
  align-items: center;
  gap: 5px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 10px;
  padding: 4px;
  background: rgba(7,11,16,.92);
  box-shadow: 0 8px 28px rgba(0,0,0,.32);
  backdrop-filter: blur(12px);
}
.src-language-switch a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 30px;
  border: 1px solid transparent;
  border-radius: 7px;
  padding: 3px 7px;
  color: #dbe1e7;
  font: 800 .68rem/1 Inter,Arial,sans-serif;
  letter-spacing: .06em;
  text-decoration: none;
}
.src-language-switch a:hover,
.src-language-switch a.active { border-color: #ff5a1f; background: rgba(255,90,31,.14); color: #fff; }
.src-language-switch img { width: 22px; height: 15px; border: 1px solid rgba(255,255,255,.25); border-radius: 2px; object-fit: cover; }
@media (max-width: 680px) {
  .src-language-switch { top: auto; right: 8px; bottom: 8px; }
  .src-language-switch a { padding-inline: 5px; }
}
