.vo2-compare-page { --compare-ink:#202638; --compare-muted:#596176; --compare-line:#d9dee7; --compare-pink:#c7155b; color:var(--compare-ink); }
.vo2-compare-page .main-layout { max-width:1000px; padding:32px 24px 48px; min-height:0!important; }
.compare-heading { margin:0 0 28px; text-align:right; }
.compare-heading h1 { font-size:clamp(24px,3vw,34px); font-weight:800; line-height:1.5; margin:0 0 8px; color:var(--compare-ink); }
.compare-heading p { max-width:60ch; color:var(--compare-muted); font-size:15px; line-height:1.9; margin:0; }
.compare-picker { width:100%; padding:24px; background:#fff; border:1px solid var(--compare-line); border-radius:16px; margin-bottom:24px; }
.compare-picker-fields { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); align-items:start; gap:20px; }
.compare-slot { min-width:0; position:relative; }
.compare-slot label { font-size:14px; font-weight:800; margin:0 0 10px; display:block; }
.compare-input-wrap { position:relative; }
.compare-input-wrap i { position:absolute; right:14px; top:15px; color:var(--compare-muted); pointer-events:none; }
.compare-slot input[type=search] { width:100%; height:52px; border:1px solid #b8c1d0!important; border-radius:10px; padding:10px 40px 10px 12px; background:#fafbfc!important; color:var(--compare-ink); box-shadow:none!important; font:inherit; font-size:16px; text-align:right; caret-color:var(--compare-pink); }
.compare-slot input::placeholder { color:#737b8c; font-size:14px; }
.vo2-compare-page :is(input,button,a):focus-visible { outline:3px solid #c7155b; outline-offset:3px; }
.compare-field-hint { font-size:12px; color:var(--compare-muted); line-height:1.8; min-height:22px; margin:8px 0 0; }
.compare-versus { align-self:center; font-size:12px; font-weight:700; color:var(--compare-muted); }
.compare-picker-actions { border-top:1px solid #e9ecf1; margin-top:20px; padding-top:20px; display:flex; align-items:center; justify-content:space-between; gap:16px; }
.compare-picker-actions p { color:var(--compare-muted); font-size:13px; margin:0; line-height:1.8; }
.compare-season { display:flex; align-items:center; flex-wrap:wrap; gap:10px 16px; margin-top:20px; }
.compare-season label { font-size:14px; font-weight:700; margin:0; }
.compare-season select { min-height:48px; min-width:140px; border:1px solid #b8c1d0; border-radius:10px; background:#fafbfc; color:var(--compare-ink); padding:8px 12px; font:inherit; font-size:16px; box-shadow:none; }
.compare-season p { margin:0; color:var(--compare-muted); font-size:12px; }
.compare-season select:focus-visible { outline:3px solid #c7155b; outline-offset:3px; }
.compare-submit { border:0; border-radius:10px; background:var(--compare-pink); color:white; font:inherit; font-size:15px; font-weight:700; min-height:48px; padding:12px 24px; white-space:nowrap; }
.compare-submit:hover:not(:disabled) { background:#a90f4c; }
.compare-submit:disabled { background:#e7e9ef; color:#626b7b; cursor:not-allowed; }
.compare-submit i { margin-right:14px; }
.compare-options { position:absolute; top:90px; right:0; left:0; z-index:50; max-height:280px; overflow:auto; background:#fff; border:1px solid #b8c1d0; border-radius:10px; padding:4px; }
.compare-options[hidden] { display:none; }
.compare-options button { border:0; border-bottom:1px solid #edf0f5; background:white; color:var(--compare-ink); display:flex; flex-direction:column; width:100%; text-align:right; padding:10px 12px; min-height:60px; gap:4px; font:inherit; border-radius:6px; }
.compare-options button strong { font-size:14px; }
.compare-options button span { font-size:11px; color:var(--compare-muted); }
.compare-options button:hover,.compare-options button[aria-selected=true] { background:#fcebf2; }
.compare-empty { width:100%; text-align:center; padding:24px 16px 12px; }
.compare-empty > i { font-size:32px; color:#a9b1bf; }
.compare-empty h2 { font-size:18px; font-weight:700; margin:12px 0 8px; }
.compare-empty p { font-size:14px; color:var(--compare-muted); }
.compare-preview-labels { display:flex; justify-content:center; gap:18px; flex-wrap:wrap; margin-top:20px; color:var(--compare-muted); font-size:12px; }
.compare-athletes { position:static!important; padding:24px 0; background:transparent!important; box-shadow:none!important; margin-bottom:12px; }
.compare-athletes > div { min-width:0; flex:1; }
.compare-athletes img { width:88px!important; height:88px!important; object-fit:cover; box-shadow:none!important; border:3px solid #fff; }
.compare-athletes .compare-rider { margin:12px 4px 8px; font-size:15px; background:transparent!important; padding:0; top:0!important; }
.compare-athletes .compare-score-label { font-size:11px; color:var(--compare-muted); margin:0 0 6px; }
.compare-athletes h3 { font-size:22px; }
.compare-athletes h3 .bi { display:none; }
.compare-athletes h3 :is(.text-success,.text-danger) { color:var(--compare-ink)!important; }
.vo2-compare-page .compare-data { padding:0!important; margin:0 0 28px!important; }
.compare-data > h2 { font-size:20px; text-align:right!important; margin:8px 0 16px; font-weight:800; }
.vo2-compare-page table.table { font-size:14px; color:var(--compare-ink); table-layout:fixed; width:100%; background:#fff!important; border:1px solid var(--compare-line); border-radius:0!important; box-shadow:none!important; text-align:center!important; }
.vo2-compare-page .table tbody { display:table-row-group!important; max-height:none!important; overflow:visible!important; }
.vo2-compare-page .table tr { display:table-row!important; }
.vo2-compare-page .table th { padding:14px 8px!important; font-size:12px; font-weight:700; border:0; background:#f0f2f7; color:var(--compare-ink); text-align:center; overflow-wrap:anywhere; }
.vo2-compare-page .table td { padding:16px 10px!important; width:30%; vertical-align:middle; border-bottom:1px solid #e8ebf0; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; color:var(--compare-ink)!important; }
.vo2-compare-page .table td:nth-child(2) { width:40%; background:#f7f8fb; font-size:12px; color:var(--compare-muted)!important; }
.vo2-compare-page .table a { color:inherit!important; text-decoration:underline; text-underline-offset:4px; }
.compare-no-results { color:var(--compare-muted); font-size:14px; padding:20px; background:#fff; border-radius:10px; }
.vo2-compare-page .short-link { display:flex; gap:12px; align-items:center; }
.vo2-compare-page .post-link__button { min-height:44px; border:0; background:var(--compare-pink); color:#fff; border-radius:8px; padding:10px 14px; white-space:nowrap; }
.vo2-compare-page #shortlink { min-width:0; font-size:13px; direction:ltr; border:1px solid var(--compare-line); box-shadow:none!important; }
.vo2-compare-page ::selection { background:#f8c5d9; color:#48132a; }
.compare-heading h1 { font-size:28px; }
.compare-picker { padding:20px; }
.compare-field-hint:empty,.compare-picker-actions p:empty { display:none; }
.compare-picker-actions { justify-content:flex-end; margin-top:16px; padding-top:16px; }
.compare-season { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.compare-filter { display:flex; flex-direction:column; min-width:0; gap:8px; }
.compare-filter select { width:100%; min-width:0; }
.compare-filter label { font-size:12px; color:var(--compare-muted); }
.compare-athletes { padding:20px 0 12px; margin:0; }
.compare-athletes .compare-percent { font-size:36px; font-weight:800; line-height:1.4; margin:0; font-variant-numeric:tabular-nums; }
.compare-percent.is-leading { color:#15803d; }
.compare-percent.is-trailing { color:#b42318; }
.compare-percent.is-tied,.compare-percent.is-empty { color:var(--compare-muted); }
.compare-summary { text-align:center; padding:4px 0 24px; }
.compare-scope { color:var(--compare-ink); font-size:13px; font-weight:700; }
.compare-summary span + span { margin:0; }
.compare-scope > span,.compare-match-count > span { margin:0 8px; color:#9aa3b3; }
.compare-balance { display:flex; height:8px; border-radius:6px; overflow:hidden; margin:16px auto 12px; max-width:480px; background:#dce1ea; }
.compare-balance .is-leading { background:#15803d; }
.compare-balance .is-trailing { background:#b42318; }
.compare-balance .is-tied { background:#778195; }
.compare-match-count { margin:0; font-size:12px; color:var(--compare-muted); }
.compare-data > h2 { font-size:18px; }
.compare-options { top:90px; }
@media(max-width:600px) {
 .vo2-compare-page .main-layout { padding:24px 18px 36px; }
 .compare-heading { margin-bottom:20px; }
 .compare-heading p { font-size:14px; }
 .compare-picker { padding:18px; }
 .compare-picker-fields { grid-template-columns:1fr; gap:10px; }
 .compare-versus { text-align:center; margin:0; }
 .compare-picker-actions { flex-direction:column; align-items:stretch; gap:12px; margin-top:16px; padding-top:16px; }
 .compare-picker-actions p { font-size:12px; }
 .compare-submit { width:100%; }
 .compare-empty { padding-top:14px; }
 .compare-preview-labels { gap:10px 16px; }
 .vo2-compare-page .table td { padding:14px 6px!important; font-size:13px; }
 .compare-athletes .compare-rider { font-size:13px; }
 .vo2-compare-page .short-link { flex-direction:column; align-items:stretch; }
}
