/* Pilot reports (pilotreport.go, report_parts.html): heat report, My day, My reports. Mobile first (390 px), theme
   tokens only, so the club's colours and light/dark both work. */
.pr-wrap { display: grid; gap: var(--s-4); padding-top: var(--s-4); padding-bottom: var(--s-6); }
.pr-report { display: grid; gap: var(--s-4); margin-top: var(--s-5); scroll-margin-top: 64px; }
.pr-report[aria-busy="true"], [data-pr-compare][aria-busy="true"] { opacity: .55; transition: opacity .15s; }

/* tabs under Me */
.pr-tabs { display: flex; gap: 4px; padding: 4px; border-radius: var(--r-pill); background: var(--surface-2); border: 1px solid var(--line); width: fit-content; max-width: 100%; overflow-x: auto; }
.pr-tabs a { padding: 8px 14px; border-radius: var(--r-pill); font-weight: 700; font-size: var(--fs-sm); color: var(--text-2); white-space: nowrap; min-height: 36px; display: inline-flex; align-items: center; text-decoration: none; }
.pr-tabs a[aria-current="page"] { background: var(--brand); color: var(--brand-ink, #04130f); }

/* headers */
.pr-head { display: flex; align-items: center; gap: var(--s-3); }
.pr-head .avatar-lg, .pr-who .avatar-lg { width: 56px; height: 56px; font-size: 20px; }
.pr-head-t { min-width: 0; flex: 1; }
.pr-eyebrow { margin: 0; font-size: var(--fs-xs); font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--brand); overflow-wrap: anywhere; }
.pr-h1, .pr-title { margin: 2px 0 0; font: var(--display-style, italic) 900 clamp(26px, 7vw, 40px)/1.05 var(--font-display); letter-spacing: -.01em; overflow-wrap: anywhere; }
.pr-title a { color: inherit; text-decoration: none; }
.pr-meta { margin: 4px 0 0; color: var(--text-2); font-size: var(--fs-sm); }
.pr-classpos { margin: 0; font-weight: 700; color: var(--text-2); }
.pr-evpick select { width: 100%; }

/* the pilot switch */
.pr-pickrow { display: grid; gap: 6px; }
.pr-label { font-size: var(--fs-xs); font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--text-3); }
.pr-chips { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 2px; scrollbar-width: none; }
.pr-chips::-webkit-scrollbar { display: none; }
.pr-chip { display: inline-flex; align-items: center; gap: 6px; padding: 8px 12px; min-height: 40px; border-radius: var(--r-pill); border: 1px solid var(--line-strong); background: var(--surface); color: var(--text); font-weight: 700; white-space: nowrap; text-decoration: none; font-size: var(--fs-sm); }
.pr-chip b { font: 800 11px/1 var(--font-mono); color: var(--text-3); }
.pr-chip.is-on { border-color: var(--brand); background: color-mix(in srgb, var(--brand) 16%, var(--surface)); box-shadow: inset 0 0 0 1px var(--brand); }
.pr-you { font-style: normal; font-size: 10px; font-weight: 800; text-transform: uppercase; padding: 2px 6px; border-radius: var(--r-pill); background: var(--brand); color: var(--brand-ink, #04130f); }

/* hero */
.pr-hero { padding: var(--s-4); display: grid; gap: var(--s-3); }
.pr-who { display: flex; align-items: center; gap: var(--s-3); }
.pr-who-t { min-width: 0; flex: 1; }
.pr-place { display: grid; justify-items: end; text-align: right; }
.pr-place .n { font: var(--display-style, italic) 900 38px/1 var(--font-display); }
.pr-place .n.is-first { color: var(--gold); }
.pr-place .of { font-size: var(--fs-xs); color: var(--text-3); font-weight: 700; }
.pr-badges { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.pr-badges li { padding: 4px 10px; border-radius: var(--r-pill); font-size: var(--fs-xs); font-weight: 800; background: color-mix(in srgb, var(--accent) 18%, transparent); color: var(--text); border: 1px solid color-mix(in srgb, var(--accent) 45%, transparent); }
.pr-badges .b-career, .pr-badges .b-season, .pr-badges .b-today, .pr-badges .b-fastest { background: color-mix(in srgb, var(--pb) 20%, transparent); border-color: color-mix(in srgb, var(--pb) 55%, transparent); }
.pr-badges .b-win { background: color-mix(in srgb, var(--gold) 22%, transparent); border-color: color-mix(in srgb, var(--gold) 60%, transparent); }
.pr-summary { margin: 0; padding-left: 1.1em; display: grid; gap: 6px; color: var(--text); }
.pr-summary li::marker { color: var(--brand); }
.pr-acts { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.pr-acts .btn { min-height: 40px; }
.pr-nav { margin-left: auto; display: flex; gap: 14px; font-weight: 700; font-size: var(--fs-sm); }

/* tiles */
.pr-tiles { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.pr-tile { padding: 12px 14px; border-radius: var(--r-md); background: var(--surface); border: 1px solid var(--line); display: grid; gap: 2px; align-content: start; min-width: 0; }
.pr-tile .k { font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--text-3); }
.pr-tile .v { font-size: 26px; font-weight: 800; line-height: 1.1; color: var(--text); }
.pr-tile .s { font-size: 12px; color: var(--text-2); line-height: 1.3; }
.pr-tile.is-pb { border-color: color-mix(in srgb, var(--pb) 60%, var(--line)); background: color-mix(in srgb, var(--pb) 10%, var(--surface)); }
.pr-tile.is-pb .v { color: var(--pb); }
.pr-tile.is-ok .v { color: var(--ok); }
.pr-tile.is-warn .v { color: var(--danger); }

/* panels */
.pr-panel { padding: var(--s-4); display: grid; gap: var(--s-3); min-width: 0; }
.pr-ph { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--s-3); flex-wrap: wrap; }
.pr-ph h3 { margin: 0; font-size: var(--fs-lg); }
.pr-ph p { margin: 2px 0 0; color: var(--text-2); font-size: var(--fs-sm); }
.pr-sub { margin: var(--s-2) 0 0; font-size: var(--fs-sm); color: var(--text-2); }
.pr-grid { display: grid; gap: var(--s-4); }
.pr-chart { min-width: 0; }
.pr-coach { border-color: color-mix(in srgb, var(--brand) 40%, var(--line)); }
.pr-insights { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.pr-insights li { display: grid; grid-template-columns: 30px 1fr; gap: 10px; align-items: start; }
.pr-insights .ic { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; background: color-mix(in srgb, var(--brand) 16%, transparent); color: var(--brand); }
.pr-insights .ic svg { width: 16px; height: 16px; }
.pr-insights .is-starts .ic { color: var(--accent); background: color-mix(in srgb, var(--accent) 16%, transparent); }
.pr-insights .is-racecraft .ic { color: var(--gold); background: color-mix(in srgb, var(--gold) 18%, transparent); }
.pr-insights .is-rivalry .ic { color: var(--pb); background: color-mix(in srgb, var(--pb) 16%, transparent); }
.pr-insights p { margin: 4px 0 0; }
.pr-focus { margin: 0; padding: 12px 14px; border-radius: var(--r-md); background: color-mix(in srgb, var(--brand) 14%, var(--surface-2)); font-weight: 700; display: grid; gap: 4px; }
.pr-focus span { font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--brand); }

/* segmented tabs on a panel */
.pr-seg { display: inline-flex; padding: 3px; border-radius: var(--r-pill); background: var(--surface-2); border: 1px solid var(--line); }
.pr-seg button { border: 0; background: none; color: var(--text-2); font: 700 var(--fs-xs)/1 var(--font-body); padding: 8px 12px; border-radius: var(--r-pill); min-height: 32px; cursor: pointer; }
.pr-seg button[aria-selected="true"] { background: var(--surface); color: var(--text); box-shadow: var(--shadow-1); }

/* svg charts */
.pr-svg { width: 100%; height: auto; display: block; overflow: visible; font-family: var(--font-mono); }
.pr-gl { stroke: var(--line); stroke-width: 1; }
.pr-sep { stroke: var(--line-strong); stroke-width: 1; stroke-dasharray: 2 3; }
.pr-tick { fill: var(--text-3); font-size: 9px; }
.pr-name { font-size: 9.5px; font-family: var(--font-body); font-weight: 700; }
.pr-name.me { font-weight: 900; }
.pr-line { fill: none; stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; stroke: var(--c, var(--text-2)); opacity: .75; }
.pr-line.emph { stroke-width: 3; opacity: 1; }
.pr-line.dashed { stroke-dasharray: 5 4; stroke-width: 1.6; }
.pr-dot { fill: var(--c, var(--text-2)); stroke: var(--surface); stroke-width: 1.2; }
.pr-dot.mark { fill: var(--pb); stroke: var(--surface); stroke-width: 2; }
.pr-ref { stroke: var(--pb); stroke-width: 1.2; stroke-dasharray: 3 3; }
.pr-reflabel { fill: var(--pb); font-size: 9px; font-weight: 700; }
.pr-name { fill: var(--c, var(--text-2)); }
.s-me { --c: var(--brand); } .s-field { --c: var(--text-3); } .s-rival { --c: var(--accent); } .s-cmp { --c: var(--pb); } .s-ok { --c: var(--ok); }
.s-l1 { --c: var(--lane-5); } .s-l2 { --c: var(--lane-7); } .s-l3 { --c: var(--lane-4); } .s-l4 { --c: var(--lane-1); }
.s-l5 { --c: var(--lane-6); } .s-l6 { --c: var(--lane-8); } .s-l7 { --c: var(--lane-3); } .s-l8 { --c: var(--lane-2); }
.pr-bar { fill: color-mix(in srgb, var(--brand) 55%, var(--surface-3)); }
.pr-bar.best { fill: var(--pb); }
.pr-bar.pb { fill: color-mix(in srgb, var(--pb) 70%, var(--brand)); }
.pr-bar.flag { fill: var(--gold); opacity: .8; }
.pr-legend { list-style: none; margin: 6px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: var(--fs-xs); color: var(--text-2); }
.pr-legend .sw, .pr-legend-k .sw { display: inline-block; width: 14px; height: 3px; border-radius: 2px; background: var(--c, var(--text-3)); vertical-align: middle; margin-right: 6px; }
.pr-legend .sw.dashed { background: repeating-linear-gradient(90deg, var(--c) 0 4px, transparent 4px 7px); }
.pr-legend-k { margin: 0; display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: var(--fs-xs); color: var(--text-2); }
.pr-legend-k .sw { width: 10px; height: 10px; border-radius: 3px; }
.pr-legend-k .sw.best { background: var(--pb); } .pr-legend-k .sw.sb { background: color-mix(in srgb, var(--pb) 50%, var(--brand)); } .pr-legend-k .sw.flag { background: var(--gold); }

/* tables */
.pr-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 0 calc(var(--s-4) * -1); padding: 0 var(--s-4); }
.pr-laps, .pr-field, .pr-mini { width: 100%; border-collapse: collapse; font-size: var(--fs-sm); }
.pr-laps th, .pr-laps td, .pr-field th, .pr-field td, .pr-mini th, .pr-mini td { padding: 9px 6px; border-bottom: 1px solid var(--line); text-align: left; white-space: nowrap; }
.pr-laps thead th, .pr-field thead th, .pr-mini thead th { font-size: 11px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: var(--text-3); }
.pr-laps .num, .pr-field .num, .pr-mini .num { text-align: right; }
.pr-laps tbody th { font-weight: 800; }
.pr-laps tr.is-best td.pr-time { color: var(--pb); font-weight: 800; }
.pr-laps tr.is-flagged td.pr-time { color: var(--text-2); }
.pr-time { white-space: normal; }
.pr-sb { margin-left: 4px; font: 800 9px/1 var(--font-body); padding: 2px 4px; border-radius: 4px; background: var(--pb); color: #fff; text-decoration: none; vertical-align: middle; }
.pr-flag { display: inline-block; margin-left: 6px; font: 800 10px/1.2 var(--font-body); padding: 2px 6px; border-radius: var(--r-pill); background: color-mix(in srgb, var(--gold) 26%, transparent); color: var(--text); border: 1px solid color-mix(in srgb, var(--gold) 70%, transparent); white-space: nowrap; }
.pr-fix { display: inline-grid; place-items: center; margin-left: 4px; width: 16px; height: 16px; border-radius: 4px; font: 800 10px/1 var(--font-body); background: var(--info, var(--accent)); color: #04130f; vertical-align: middle; }
.d-good { color: var(--ok); } .d-bad { color: var(--danger); } .d-zero { color: var(--text-3); }
.pr-secs span, .pr-secs-sm span { margin-right: 6px; color: var(--text-2); }
.pr-secs .is-best, .pr-secs-sm .is-best { color: var(--pb); font-weight: 800; }
.pr-secs-sm { display: none; }
.pr-w { text-align: right; width: 1%; }
.pr-field tr.is-me { background: color-mix(in srgb, var(--brand) 10%, transparent); }
.pr-field tr.is-me th a { color: var(--brand); }
.pr-mini tr.is-top td:first-of-type { color: var(--pb); }
@media (max-width: 520px) {
  .pr-sm-hide { display: none; }
  .pr-secs-sm { display: block; font-size: 11px; margin-top: 2px; }
}

/* delta bars */
.pr-delta { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.pr-delta li { display: grid; grid-template-columns: 64px 1fr 58px; align-items: center; gap: 8px; font-size: var(--fs-sm); }
.pr-delta .k { color: var(--text-2); font-size: var(--fs-xs); font-weight: 700; }
.pr-delta .track { position: relative; height: 12px; border-radius: 6px; background: var(--surface-2); }
.pr-delta .track::after { content: ""; position: absolute; left: 50%; top: -3px; bottom: -3px; width: 1px; background: var(--line-strong); }
.pr-delta .track i { position: absolute; top: 0; bottom: 0; border-radius: 6px; }
.pr-delta .track i.r { left: 50%; } .pr-delta .track i.l { right: 50%; }
.pr-delta .good i { background: var(--ok); } .pr-delta .bad i { background: var(--danger); }
.pr-delta .v { text-align: right; }
.pr-delta .good .v { color: var(--ok); } .pr-delta .bad .v { color: var(--danger); }

/* race story */
.pr-ots { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font-size: var(--fs-sm); }
.pr-ots li { display: flex; gap: 10px; align-items: baseline; }
.pr-ots .l { flex: none; min-width: 52px; font: 700 11px/1 var(--font-mono); color: var(--text-3); }
.pr-ots .made { color: var(--ok); font-weight: 700; } .pr-ots .lost { color: var(--danger); font-weight: 700; }
.pr-incidents ul { list-style: none; margin: 6px 0 0; padding: 0; display: grid; gap: 6px; font-size: var(--fs-sm); }
.pr-incidents .pr-flag, .pr-incidents .pr-fix { margin: 0 8px 0 0; }

/* video */
.pr-bw { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.pr-bwc { padding: 12px; border-radius: var(--r-md); background: var(--surface-2); border: 1px solid var(--line); display: grid; gap: 4px; align-content: start; }
.pr-bwc.is-pb { border-color: color-mix(in srgb, var(--pb) 55%, var(--line)); }
.pr-bwc .k { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: var(--text-3); }
.pr-bwc .v { font-size: 24px; font-weight: 800; }
.pr-bwc.is-pb .v { color: var(--pb); }
.pr-bwc .s { font-size: 12px; color: var(--text-2); }
.pr-bwc .btn { margin-top: 4px; justify-self: start; }
.pr-cta { font-weight: 700; }

/* compare */
.pr-select select { max-width: 100%; min-height: 40px; border-radius: var(--r-sm); border: 1px solid var(--line-strong); background: var(--surface); color: var(--text); padding: 0 10px; font: inherit; font-size: var(--fs-sm); width: 100%; }
.pr-select { width: 100%; }
.pr-cmp { display: grid; gap: var(--s-3); }
.pr-big { margin: 0; display: flex; justify-content: space-between; align-items: baseline; }
.pr-big span { color: var(--text-2); font-weight: 700; }
.pr-big strong { font-size: 30px; }

/* lists */
.pr-alllaps { list-style: none; margin: 0; padding: 0; display: grid; }
.pr-alllaps li { display: grid; grid-template-columns: 28px 76px 1fr auto auto; align-items: center; gap: 8px; padding: 8px 0; border-bottom: 1px solid var(--line); font-size: var(--fs-sm); }
.pr-alllaps .r { font: 700 11px/1 var(--font-mono); color: var(--text-3); text-align: right; }
.pr-alllaps .t { font-weight: 800; font-size: 16px; }
.pr-alllaps .h { color: var(--text-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; text-decoration: none; }
.pr-alllaps .is-best .t { color: var(--pb); }
.pr-alllaps .is-pb .t { color: color-mix(in srgb, var(--pb) 70%, var(--text)); }
.pr-alllaps .is-flagged .t { color: var(--text-3); text-decoration: line-through; text-decoration-thickness: 1px; }
.pr-alllaps:not(.all) li:nth-child(n+13) { display: none; }
.pr-pbtag { font: 800 10px/1.2 var(--font-body); padding: 2px 6px; border-radius: var(--r-pill); background: var(--pb); color: #fff; }
.pr-heats, .pr-days, .pr-rivals, .pr-runs { list-style: none; margin: 0; padding: 0; display: grid; }
.pr-heats li, .pr-days li { display: flex; align-items: center; gap: 8px; border-bottom: 1px solid var(--line); }
.pr-heats li > a:first-child, .pr-days li > a { flex: 1; min-width: 0; display: grid; grid-template-columns: 62px 1fr 14px; gap: 10px; align-items: center; padding: 10px 0; color: inherit; text-decoration: none; min-height: 52px; }
.pr-heats .pl, .pr-days .pl { font: var(--display-style, italic) 900 20px/1 var(--font-display); text-align: center; }
.pr-days .pl small { font-size: 11px; color: var(--text-3); font-style: normal; }
.pr-heats .pl.is-first, .pr-days .pl.is-first { color: var(--gold); }
.pr-heats .tx, .pr-days .tx { display: grid; gap: 2px; min-width: 0; }
.pr-heats .tx strong, .pr-days .tx strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pr-heats small, .pr-days small { color: var(--text-2); font-size: 12px; }
.pr-heats .go, .pr-days .go { color: var(--text-3); font-size: 20px; }
.pr-runs li a { display: grid; grid-template-columns: 80px 1fr; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--line); color: inherit; text-decoration: none; align-items: center; }
.pr-runs .t { font-weight: 800; color: var(--pb); font-size: 17px; }
.pr-runs .tx { display: grid; font-size: var(--fs-sm); min-width: 0; }
.pr-runs small { color: var(--text-2); }
.pr-rivals li { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--line); }
.pr-rivals li > a:first-child { font-weight: 800; }
.pr-rivals li .small { flex: 1; }
.pr-links { margin: 0; display: flex; flex-wrap: wrap; gap: 8px 18px; font-weight: 700; font-size: var(--fs-sm); }
.pr-needpilot { max-width: 560px; }
.print-only { display: none; }

@media (min-width: 640px) {
  .pr-tiles { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .pr-who .avatar-lg, .pr-head .avatar-lg { width: 72px; height: 72px; font-size: 26px; }
  .pr-select { width: auto; }
  .pr-select select { width: auto; max-width: 360px; }
}
@media (min-width: 960px) {
  .pr-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
  .pr-cmp { grid-template-columns: 3fr 2fr; align-items: start; }
  .pr-place .n { font-size: 48px; }
  .pr-svg { max-height: 340px; }
  .pr-bars { max-height: 220px; }
  .pr-hero { padding: var(--s-5); }
}

@media print {
  .no-print, .app-tabs, .ah-next-slot, .pr-pickrow, .rp-acts, .share-btn, .site-header, .site-footer { display: none !important; }
  .print-only { display: block; }
  html, body { background: #fff !important; color: #111 !important; }
  :root { --text: #111; --text-2: #444; --text-3: #666; --line: #ddd; --line-strong: #bbb; --surface: #fff; --surface-2: #f4f4f4; --surface-3: #eee; --bg: #fff; }
  .card, .pr-tile { box-shadow: none !important; background: #fff !important; break-inside: avoid; }
  .pr-panel { break-inside: avoid; }
  .pr-chart[hidden] { display: block !important; }
  .pr-alllaps li { display: grid !important; }
  .pr-sm-hide { display: table-cell !important; }
  .pr-secs-sm { display: none !important; }
  a { color: inherit !important; text-decoration: none !important; }
}
@media (prefers-reduced-motion: reduce) { .pr-report[aria-busy="true"] { transition: none; } }