#comparison-pane { min-width:0; }
.comparison-shell { margin:18px 0; padding:22px; border:1px solid #dce3ed; border-radius:14px; background:#fff; color:#173a5d; }
.comparison-shell h2 { font-size:1.45rem; font-weight:750; margin:0 0 6px; }
.comparison-shell h3 { font-size:1.05rem; font-weight:750; margin:0 0 8px; }
.comparison-shell p { color:#536174; }
.comparison-heading-row { display:flex; gap:14px; justify-content:space-between; align-items:start; margin-bottom:14px; }
.comparison-heading-row .btn { flex:none; }
.comparison-races { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.comparison-race { min-width:0; border:1px solid #cbd8e7; border-top:4px solid #175b9b; border-radius:10px; padding:16px; margin:0; background:#f8fbff; }
.comparison-race-b { border-top-color:#9a4e0a; background:#fffcf7; }
.comparison-race legend { float:none; width:auto; font-size:1.1rem; font-weight:750; margin:0 0 8px; padding:0; }
.comparison-shell label { display:block; font-size:.8rem; font-weight:700; margin:9px 0 5px; }
.comparison-shell select { min-height:44px; width:100%; min-width:0; font-size:.88rem; text-overflow:ellipsis; }
.comparison-context { font-size:.78rem; margin:12px 0 0; overflow-wrap:anywhere; }
.comparison-status { font-size:.8rem; margin:8px 0 0; }
.comparison-athlete-control { max-width:560px; margin:18px 0 12px; }
#comparison-status { margin:12px 0; font-size:.84rem; }
.comparison-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin:20px 0; }
.comparison-summary>div { padding:14px; border:1px solid #dce3ed; border-radius:10px; min-width:0; }
.comparison-summary strong { font-size:1.3rem; display:block; font-variant-numeric:tabular-nums; }
.comparison-summary span { display:block; font-size:.8rem; }
.comparison-summary small { display:block; color:#536174; font-size:.75rem; margin-top:5px; overflow-wrap:anywhere; }
.comparison-chart-panel,.comparison-breakdown { margin-top:20px; }
.comparison-chart { height:260px; position:relative; width:100%; min-width:0; overflow:hidden; }
.comparison-chart-key { font-size:.78rem; }
.comparison-key-a { color:#175b9b; font-weight:700; margin-right:12px; }
.comparison-key-b { color:#9a4e0a; font-weight:700; }
.comparison-breakdown>p,.comparison-footnote { font-size:.78rem; }
.comparison-segment { display:grid; grid-template-columns:minmax(140px,1.1fr) repeat(2,minmax(95px,1fr)) minmax(145px,1.1fr); gap:12px; align-items:center; padding:14px 10px; border-top:1px solid #e1e7ef; }
.comparison-segment h4 { font-size:.86rem; font-weight:700; margin:0; }
.comparison-segment strong { font-size:1rem; font-variant-numeric:tabular-nums; }
.comparison-segment small { display:block; font-size:.7rem; color:#536174; margin-top:3px; }
.comparison-segment-label { display:block; font-size:.7rem; color:#536174; margin-bottom:2px; }
.comparison-delta { display:inline-block; border-radius:20px; padding:5px 9px; font-size:.8rem; font-weight:750; font-variant-numeric:tabular-nums; }
.comparison-faster { background:#e3f5ea; color:#126233; }
.comparison-slower { background:#fde8e8; color:#a32020; }
.comparison-even { background:#edf1f6; color:#475569; }
.comparison-footnote { border-top:1px solid #e1e7ef; padding-top:14px; margin:20px 0 0; }
@media(max-width:767.98px) {
  .comparison-shell { padding:14px; margin-top:12px; }
  .comparison-heading-row { flex-wrap:wrap; }
  .comparison-shell h2 { font-size:1.2rem; }
  .comparison-races { grid-template-columns:minmax(0,1fr); gap:12px; }
  .comparison-race { padding:12px; }
  .comparison-summary { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .comparison-summary>div:last-child { grid-column:1/-1; }
  .comparison-chart { height:230px; }
  .comparison-segment { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; padding:14px 0; }
  .comparison-segment h4 { grid-column:1/-1; }
  .comparison-segment>div:last-child { grid-column:1/-1; }
}
