:root{color-scheme:dark;--green:#9bec39;--panel:#0d1b12;--line:#345441;--muted:#b8cabe}*{box-sizing:border-box}body{margin:0;background:#061008;color:#f5fff8;font:16px/1.45 system-ui,-apple-system,Segoe UI,sans-serif}main{width:min(1500px,calc(100% - 24px));margin:20px auto 60px}.crumbs{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}.crumbs a,.selectors a{color:#dfffc0;border:1px solid var(--line);border-radius:9px;padding:9px 12px;text-decoration:none;background:#102219}.intro{display:flex;justify-content:space-between;gap:20px;align-items:end;margin:0 0 18px}.eyebrow{color:var(--green);font-weight:900;letter-spacing:.08em;margin:0}.intro h1{font-size:clamp(28px,4vw,48px);margin:4px 0}.intro p{margin:0}.physics{padding:8px 12px;border:1px solid #7bb52e;border-radius:999px;color:#cfff98;font-weight:800;white-space:nowrap}.selectors{display:flex;gap:12px;align-items:end;flex-wrap:wrap;background:var(--panel);border:1px solid var(--line);border-radius:13px;padding:12px;margin-bottom:14px}.selectors label,.replay-controls label{display:grid;gap:5px;color:var(--muted);font-size:13px;font-weight:800}.selectors select,.replay-controls select{min-height:42px;max-width:min(460px,82vw);padding:8px 10px;border:1px solid #557662;border-radius:8px;background:#07110b;color:#fff;font:inherit}.replay-controls{margin-top:14px;padding:14px;background:var(--panel);border:1px solid var(--line);border-radius:13px}.buttons{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.buttons button{min-height:42px;border:1px solid #4b715c;border-radius:8px;background:#1b3024;color:#fff;font-weight:850;padding:8px 13px}.buttons button.primary{background:var(--green);color:#10200e;border-color:var(--green)}#clock{margin-left:auto;font-size:24px}#timeline{width:100%;accent-color:var(--green)}.timeline-label{margin-top:10px}.timeline-label span{color:#fff}.race-order{margin-top:14px;padding:14px;background:var(--panel);border:1px solid var(--line);border-radius:13px}.race-order h2{margin:0 0 8px}.race-order ol{display:flex;gap:7px 18px;flex-wrap:wrap;margin:0;padding-left:28px}.race-order li{min-width:150px}.race-order li.leader{color:var(--green);font-weight:900}.explain{color:var(--muted);max-width:1000px}.cobra3d .c3-toolbar [data-action="open"]{display:none}.cobra3d .c3-youtube-link{display:inline-flex;min-height:42px;align-items:center;gap:8px;padding:9px 13px;border:1px solid #ff5252;border-radius:9px;background:#e62117;color:#fff;font-weight:900;text-decoration:none;white-space:nowrap}.cobra3d .c3-youtube-link:hover{background:#ff2b20;border-color:#ff8a84;color:#fff}.cobra3d .c3-youtube-link[hidden]{display:none}.c3-youtube-link svg{width:22px;height:16px;flex:none;fill:#fff}.c3-youtube-link .c3-youtube-play{fill:#e62117}@media(max-width:720px),(orientation:landscape) and (max-height:520px) and (max-width:1024px){main{width:min(100% - 12px,1500px);margin-top:8px}.intro{align-items:start;display:block}.physics{display:inline-block;margin-top:10px;font-size:12px}.selectors{display:grid;grid-template-columns:1fr}.selectors select{max-width:100%;width:100%}#clock{width:100%;margin:3px 0 0}.race-order ol{display:grid;grid-template-columns:1fr 1fr}.cobra3d .c3-toolbar [data-action="image"]{display:none}.cobra3d .c3-youtube-link{width:100%;justify-content:center;font-size:12px}}
.race-order h2::after{content:' · laps / total seconds / gap to leader';color:var(--muted);font-size:13px;font-weight:700}.race-order ol{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:7px 30px}.race-order li{min-width:0;padding-right:8px}.race-order li strong{float:right;margin-left:10px;font-variant-numeric:tabular-nums;color:#e7f4ea}.race-order li.leader strong{color:var(--green)}
.c3-timing-overlay{position:absolute;z-index:5;top:14px;right:14px;width:min(360px,calc(100% - 28px));max-height:calc(100% - 70px);overflow:auto;border:1px solid #50725d;border-radius:12px;background:#07110be8;box-shadow:0 10px 35px #0009;backdrop-filter:blur(5px);color:#f5fff8;pointer-events:none}.c3-timing-overlay[hidden]{display:none}.c3-timing-overlay header{position:sticky;top:0;z-index:1;display:flex;justify-content:space-between;gap:10px;align-items:baseline;padding:10px 12px 7px;background:#102219f5;border-bottom:1px solid #385846}.c3-timing-overlay header strong{color:var(--green);font-size:15px}.c3-timing-overlay header span{color:var(--muted);font-size:11px}.c3-timing-overlay table{width:100%;border-collapse:collapse;font-size:12px;font-variant-numeric:tabular-nums}.c3-timing-overlay th,.c3-timing-overlay td{padding:5px 8px;border-bottom:1px solid #294333;text-align:left;white-space:nowrap}.c3-timing-overlay th{color:#b8cabe;font-size:10px;text-transform:uppercase;letter-spacing:.04em}.c3-timing-overlay th:first-child,.c3-timing-overlay td:first-child{width:34px;text-align:center}.c3-timing-overlay th:nth-child(n+3),.c3-timing-overlay td:nth-child(n+3){text-align:right}.c3-timing-overlay tr.leader td{color:var(--green);font-weight:900}.c3-timing-overlay td.slow{color:#ffca53;font-weight:800}.c3-short-heading{display:none}
@media(max-width:720px),(orientation:landscape) and (max-height:520px) and (max-width:1024px){.race-order ol{grid-template-columns:1fr}.c3-timing-overlay{top:auto;right:6px;bottom:7px;width:calc(100% - 12px);max-height:min(34%,230px);border-radius:9px}.c3-timing-overlay header{padding:6px 8px 4px}.c3-timing-overlay header strong{font-size:12px}.c3-timing-overlay table{font-size:10px}.c3-timing-overlay th,.c3-timing-overlay td{padding:3px 6px}.c3-timing-overlay th{font-size:9px}}
.c3-timing-behind .c3-canvas{position:relative;z-index:2;background:transparent}.c3-timing-behind .c3-overlay,.c3-timing-behind .c3-help{z-index:4}.c3-timing-behind .c3-timing-overlay{z-index:1;background:#07110bd6}
.c3-timing-behind .c3-timing-overlay{left:50%;right:auto;top:50%;bottom:auto;transform:translate(-50%,-50%);width:min(1120px,86%);max-height:min(76%,650px);border:2px solid #62836c;border-radius:14px;background:#07110bea;box-shadow:0 16px 55px #000c;cursor:pointer}.c3-timing-behind .c3-timing-overlay header{padding:16px 20px 12px}.c3-timing-behind .c3-timing-overlay header strong{font-size:clamp(18px,2vw,28px)}.c3-timing-behind .c3-timing-overlay header span{font-size:13px}.c3-timing-behind .c3-timing-overlay table{font-size:clamp(13px,1.25vw,17px)}.c3-timing-behind .c3-timing-overlay th,.c3-timing-behind .c3-timing-overlay td{padding:8px 14px}.c3-timing-behind .c3-timing-overlay th{font-size:11px}.c3-timing-behind .c3-timing-ghost{z-index:3;opacity:.3;pointer-events:none;background:transparent;box-shadow:none;backdrop-filter:none}.c3-timing-behind .c3-timing-ghost header{background:transparent}.c3-timing-behind.c3-timing-front .c3-timing-overlay:not(.c3-timing-ghost){z-index:5;background:transparent;border-color:transparent;box-shadow:none;backdrop-filter:none;text-shadow:0 2px 3px #000,0 0 7px #000}.c3-timing-behind.c3-timing-front .c3-timing-overlay:not(.c3-timing-ghost) header{background:transparent;border-color:transparent}.c3-timing-behind.c3-timing-front .c3-timing-overlay:not(.c3-timing-ghost) th,.c3-timing-behind.c3-timing-front .c3-timing-overlay:not(.c3-timing-ghost) td{border-color:transparent}.c3-timing-behind.c3-timing-front .c3-timing-ghost{display:none}.c3-timing-behind.c3-timing-front .c3-timing-overlay:focus{outline:2px solid #d7ffac80;outline-offset:2px}
@media(max-width:720px),(orientation:landscape) and (max-height:520px) and (max-width:1024px){.c3-timing-behind .c3-timing-overlay{left:50%;right:auto;top:50%;bottom:auto;width:92%;max-height:62%;transform:translate(-50%,-50%)}.c3-timing-behind .c3-timing-overlay header{padding:7px 9px 5px}.c3-timing-behind .c3-timing-overlay header strong{font-size:13px}.c3-timing-behind .c3-timing-overlay header span{font-size:9px}.c3-timing-behind .c3-timing-overlay table{font-size:9px}.c3-timing-behind .c3-timing-overlay th,.c3-timing-behind .c3-timing-overlay td{padding:3px 4px}.c3-timing-behind .c3-timing-overlay th{font-size:8px}.c3-full-heading{display:none}.c3-short-heading{display:inline}}
.c3-track-only [data-replay-controls],.c3-track-only .c3-mobile-replay-bar[hidden],.c3-track-only [data-action="car-labels"][hidden],.c3-track-only [data-action="flyover"][hidden]{display:none!important}.track-only-mode .selectors label[hidden],.track-only-mode .selectors a[hidden],.track-only-mode .replay-controls[hidden],.track-only-mode .race-order[hidden],.track-only-mode .explain[hidden]{display:none!important}

@media(max-width:720px),(orientation:landscape) and (max-height:520px) and (max-width:1024px){.race-flyover-mode{overflow:hidden}.race-flyover-mode .cobra-site-header,.race-flyover-mode main>.crumbs,.race-flyover-mode main>.intro,.race-flyover-mode main>.selectors,.race-flyover-mode main>.replay-controls,.race-flyover-mode main>.race-order,.race-flyover-mode main>.explain,.race-flyover-mode>.cobra-site-footer{display:none!important}.race-flyover-mode main{width:100%;height:100dvh;margin:0;padding:0;overflow:hidden}.race-flyover-mode #viewer,.race-flyover-mode #viewer>.cobra3d{width:100%;height:100dvh!important;min-height:100dvh;margin:0;border-radius:0}.race-flyover-mode .cobra3d .c3-mobile-replay-bar{display:grid;grid-template-columns:.8fr 1.2fr;gap:6px;padding:7px;background:#102219;border-bottom:1px solid #355642}.race-flyover-mode .cobra3d .c3-mobile-replay-bar.c3-flyover-menu-only{grid-template-columns:1fr}.race-flyover-mode .cobra3d .c3-mobile-replay-bar.c3-flyover-menu-only [data-action="mobile-controls"]{grid-column:1}.race-flyover-mode .cobra3d:not(.c3-mobile-controls-open) .c3-toolbar{display:none}.race-flyover-mode .cobra3d.c3-mobile-controls-open .c3-toolbar{display:grid;position:absolute;z-index:9;top:57px;right:0;left:0;max-height:calc(100dvh - 57px);overflow:auto;background:#102219;box-shadow:0 12px 30px #000c}.race-flyover-mode .cobra3d .c3-canvas-wrap{height:auto!important;min-height:0;flex:1}}

/* Default mobile 3D replay to a viewer-first presentation.
   The top Play / Controls bar remains visible; additional controls open
   temporarily over the viewer without taking up permanent screen height. */
@media(max-width:720px){
  body.mobile-replay-minimal{overflow:hidden}
  .mobile-replay-minimal>.cobra-site-header,
  .mobile-replay-minimal main>.crumbs,
  .mobile-replay-minimal main>.intro,
  .mobile-replay-minimal main>.selectors,
  .mobile-replay-minimal main>.replay-controls,
  .mobile-replay-minimal main>.race-order,
  .mobile-replay-minimal main>.explain,
  .mobile-replay-minimal>.cobra-site-footer{display:none!important}
  .mobile-replay-minimal main{box-sizing:border-box;width:100%;height:100dvh;margin:0;padding:0;overflow:hidden}
  .mobile-replay-minimal #viewer,
  .mobile-replay-minimal #viewer>.cobra3d{
    box-sizing:border-box;display:flex;flex-direction:column;
    width:100%;height:100dvh!important;min-height:0!important;
    margin:0;border:0;border-radius:0;overflow:hidden;
  }
  .mobile-replay-minimal .cobra3d .c3-mobile-replay-bar{
    display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:7px;
    flex:0 0 auto;background:#102219;border-bottom:1px solid #355642;
  }
  .mobile-replay-minimal .cobra3d .c3-canvas-wrap{
    flex:1 1 auto;height:auto!important;min-height:0!important;
  }
  .mobile-replay-minimal .cobra3d .c3-status{display:none}
  .mobile-replay-minimal .cobra3d:not(.c3-mobile-controls-open) .c3-toolbar{display:none!important}
  .mobile-replay-minimal .cobra3d.c3-mobile-controls-open .c3-toolbar{
    display:grid;position:absolute;z-index:12;top:57px;left:0;right:0;
    width:100%;max-height:calc(100dvh - 57px);overflow-y:auto;
    background:#102219;box-shadow:0 12px 30px #000c;
  }
  .mobile-replay-minimal .cobra3d .c3-timing-overlay[hidden]{display:none!important}
}
