/* Lakechurchen win-probability chart.
   Layout stays unchanged; only the curve/grid design is upgraded.
   Inspired by premium broadcast win-probability cards. */
.wp-history {
  box-sizing:border-box;
  --wp-home:#58bce9;
  --wp-away:#e6ab67;
  --wp-grid:color-mix(in srgb,currentColor 28%,transparent);
  --wp-axis:color-mix(in srgb,currentColor 52%,transparent);
  width:100%;
  min-width:0;
  display:grid;
  gap:10px;
  padding:14px 16px 12px;
  background:transparent;
  border-top:1px solid color-mix(in srgb,currentColor 15%,transparent);
  color:inherit;
}
.wp-header,.wp-legend {display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0}
.wp-header strong {font-size:12px;letter-spacing:.12em;font-weight:950;line-height:1.2}
.wp-status {color:inherit;opacity:.56;white-space:nowrap;font-size:11px;letter-spacing:.07em;font-weight:750}
.wp-plot {width:100%;min-height:0;position:relative;overflow:hidden}
.wp-svg {display:block;width:100%;height:236px;overflow:visible;color:inherit}
.wp-legend {font-size:11px;line-height:1.3;font-weight:850;letter-spacing:.045em}
.wp-legend>span {display:flex;align-items:center;min-width:0;gap:6px;flex:1}
.wp-legend .wp-legend-away {justify-content:flex-end}
.wp-legend b {overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:42%;font-weight:800}
.wp-legend .wp-legend-home b,.wp-legend .wp-legend-away b {max-width:100%}
.wp-legend i {
  width:16px;
  min-width:16px;
  height:6px;
  display:block;
  transform:skew(-24deg);
  border-radius:1px;
  background:linear-gradient(180deg,color-mix(in srgb,var(--wp-home) 92%,white 8%),color-mix(in srgb,var(--wp-home) 58%,transparent));
  box-shadow:0 0 0 1px color-mix(in srgb,var(--wp-home) 88%,#ffffff 12%);
}
.wp-legend-away i {
  background:linear-gradient(180deg,color-mix(in srgb,var(--wp-away) 92%,white 8%),color-mix(in srgb,var(--wp-away) 58%,transparent));
  box-shadow:0 0 0 1px color-mix(in srgb,var(--wp-away) 88%,#ffffff 12%);
  order:2;
}
.wp-clock {font-variant-numeric:tabular-nums;flex:0 0 auto!important;color:inherit;opacity:.58;justify-content:center;text-align:center;font-size:10px}

/* Home league matchup summary */
.matchup-card .wp-home {border-top:1px solid rgba(255,255,255,.12);padding:12px 18px 14px;}
.matchup-card .wp-home .wp-svg {height:228px}
.matchup-card .wp-home .wp-legend b {max-width:140px}

/* Homepage only: charts appear inside weekly matchup cards, never in /live/. */
.matchup-card .wp-history {color:var(--fg)}
.matchup-card .wp-home {padding:14px 18px 12px;border-top:1px solid var(--line)}
.matchup-card .wp-header {flex-wrap:wrap}
.matchup-card .wp-header strong {font-size:10px;letter-spacing:.08em}
.matchup-card .wp-svg {height:232px;}
.matchup-card .wp-legend {font-size:11px;}
.matchup-card .wp-legend b {max-width:135px}
.matchup-card .wp-cutline-note {color:var(--muted);font-size:9px;line-height:1.5;letter-spacing:.04em;}
@media (max-width:560px) {
 .matchup-card .wp-home {padding:10px 12px 10px}
 .matchup-card .wp-svg {height:186px}
 .matchup-card .wp-header strong {font-size:9px}
 .matchup-card .wp-legend b {max-width:92px}
 .matchup-card .wp-status {font-size:8px}
 .matchup-card .wp-clock {font-size:8px}
}

/* CFL matchup cards: the timeline stays within each duel and is never injected into the TV feed. */
.cfl-body .duel-card { display:flex; flex-direction:column; }
.cfl-body .duel-card .duel-probability { min-width:0; width:100%; margin-top:auto; }
.cfl-body .duel-card .wp-compact { padding:13px 16px 12px; border-top:1px solid var(--line); background:transparent; }
.cfl-body .duel-card .wp-header strong {font-size:10px;letter-spacing:.075em}
.cfl-body .duel-card .wp-plot { min-width:0; }
.cfl-body .duel-card .wp-svg {height:220px;}
.cfl-body .duel-card .wp-legend { font-size:9px; gap:10px; }
.cfl-body .duel-card .wp-legend>span { flex:1 1 0; }
.cfl-body .duel-card .wp-legend b { min-width:0; max-width:100%; }
.cfl-body .duel-card .wp-clock { flex:0 0 auto!important; }
.cfl-body .duel-card .duel-footer { margin-top:0; }
@media(max-width:550px) {
  .cfl-body .duel-card .wp-compact { padding:11px 13px 12px; }
  .cfl-body .duel-card .wp-svg {height:178px;}
  .cfl-body .duel-card .wp-header strong {font-size:9px;}
  .cfl-body .duel-card .wp-legend {font-size:9px;}
}

/* v3.9.50: Axis labels are HTML overlays, not stretched SVG glyphs.
   Vector-effect keeps plotted lines a constant physical stroke width even when
   the canvas is tall and narrow (CFL 3-column desktop layout). */
.wp-scale{position:absolute;right:0;top:5.55%;height:64.4%;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-end;color:inherit;opacity:.65;font-size:12px;line-height:1;font-weight:750;pointer-events:none;font-variant-numeric:tabular-nums}
.wp-quarter-labels{position:absolute;left:2.6%;right:8.8%;top:87%;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:center;text-align:center;font-size:12px;font-weight:750;line-height:1.2;color:inherit;opacity:.62;pointer-events:none}
.cfl-body .duel-card .wp-scale{font-size:11px}
.cfl-body .duel-card .wp-quarter-labels{font-size:11px}
@media(max-width:550px){.wp-scale,.cfl-body .duel-card .wp-scale{font-size:10px}.wp-quarter-labels,.cfl-body .duel-card .wp-quarter-labels{font-size:10px}}