/* The season so far (js/season.js charts, js/views/season.js, the Season tabs on team and player pages).
   Bars are what happened: xG for in the info blue, xG against in the warm red. The dashed line is what was
   expected before each deadline: solid dots where it came from bookmaker odds, rings where from the
   market-calibrated model. Cards, tables and readouts are the team pages' own (css/club.css). */
.sx-scroll{overflow-x:auto;overscroll-behavior-x:contain;margin:0 -4px;padding:0 4px}
.sx-chart{display:block;width:100%;height:auto}
.sx-chart .gl{stroke:var(--hair-2);stroke-dasharray:2 5}
.sx-chart .ax,.sx-chart .lb,.sx-chart .lb3{fill:var(--muted);font:700 11px Manrope;font-variant-numeric:tabular-nums}
.sx-chart .lb.now{fill:var(--accent)}
.sx-chart .lb2{fill:var(--faint);font:700 10px Manrope;letter-spacing:.02em}
.sx-chart .lb3{fill:var(--good)}.sx-chart .lb3.k{fill:var(--muted);font-size:10px}
.sx-chart .sxb{transform-box:fill-box;transform-origin:50% 100%}
.sx-chart .sxb.for{fill:color-mix(in oklab,var(--info) 78%,transparent)}
.sx-chart .sxb.against{fill:color-mix(in oklab,var(--bad) 74%,transparent)}
.sx-chart .sxb.pts{fill:color-mix(in oklab,var(--good) 72%,transparent)}
.sx-chart .sxb.dc{fill:color-mix(in oklab,var(--accent) 70%,transparent)}
.sx-chart .sxb:hover{filter:brightness(1.15)}
.sx-chart .gl-mark{fill:var(--ink);font:800 11px Manrope;paint-order:stroke;stroke:var(--ground-2);stroke-width:4px;stroke-linejoin:round}
.sx-chart .exl{fill:none;stroke:var(--ink);stroke-width:2;stroke-dasharray:5 5;opacity:.8}
.sx-chart .ex{stroke:var(--ink);stroke-width:2}.sx-chart .ex.mk{fill:var(--ink)}.sx-chart .ex.md{fill:var(--ground-2)}.sx-chart .ex.ah{fill:var(--ground-2);stroke:var(--muted)}
.sx-chart .now-line{stroke:var(--muted);stroke-dasharray:3 4}.sx-chart .now-t{fill:var(--muted);font:800 10px Manrope;letter-spacing:.08em;text-transform:uppercase}
.sx-chart .thr{stroke:var(--accent);stroke-width:1.5;stroke-dasharray:6 4}.sx-chart .thr-t{fill:var(--accent);font:800 10px Manrope}
@media (prefers-reduced-motion:no-preference){.sx-chart .sxb{animation:sx-grow .55s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i,0) * 22ms)}}
@keyframes sx-grow{from{transform:scaleY(0)}}
/* the scatter: clubs as crests, players as dots, the league average dashed */
.sx-scatter{max-width:860px;margin:0 auto}
.sx-chart.sc .avg{stroke:var(--muted);stroke-dasharray:6 5;opacity:.7}
.sx-chart.sc .axl{fill:var(--ink-2);font:800 11px Manrope;letter-spacing:.04em}
.sx-chart .sp circle{fill:color-mix(in oklab,var(--info) 70%,transparent);stroke:var(--ground-2);stroke-width:1.5}
.sx-chart .sp.hi circle{fill:var(--accent)}
.sx-chart .sp .sp-bg{fill:var(--raised);stroke:var(--hair-2)}
.sx-chart .sp .sp-c{fill:var(--ink-2);font:800 8px Manrope}
.sx-chart .sp .sp-t{fill:var(--ink-2);font:700 10px Manrope}
.sx-chart .sp[data-href]{cursor:pointer}.sx-chart .sp[data-href]:hover .sp-bg{stroke:var(--accent)}
/* legend */
.sx-key{display:flex;flex-wrap:wrap;gap:8px 16px;margin:10px 2px 0;font:700 12px Manrope;color:var(--muted)}
.sx-key span{display:inline-flex;align-items:center;gap:7px}
.sx-key i{display:inline-block;width:14px;height:10px;border-radius:2px}
.sx-key i.for{background:color-mix(in oklab,var(--info) 78%,transparent)}.sx-key i.against{background:color-mix(in oklab,var(--bad) 74%,transparent)}
.sx-key i.pts{background:color-mix(in oklab,var(--good) 72%,transparent)}.sx-key i.dc{background:color-mix(in oklab,var(--accent) 70%,transparent)}
.sx-key i.ex{width:18px;height:0;border-top:2px dashed var(--ink);border-radius:0}
.sx-key i.mk,.sx-key i.md{width:9px;height:9px;border-radius:50%;border:2px solid var(--ink)}.sx-key i.mk{background:var(--ink)}.sx-key i.ah{width:9px;height:9px;border-radius:50%;border:2px solid var(--muted)}
.sx-key i.thr{width:18px;height:0;border-top:2px dashed var(--accent);border-radius:0}
/* a club's or player's season: the tab switch on their page */
.sx-tabs{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.sx-sum{display:flex;flex-wrap:wrap;gap:6px 18px;margin:12px 2px 0;font:600 13px Manrope;color:var(--ink-2)}
.sx-sum b{color:var(--ink);font-variant-numeric:tabular-nums}
.sx-note{margin:10px 2px 0;font:600 12px/1.5 Manrope;color:var(--muted)}
/* tables: a rate bar behind the hit rate */
.sx-rate{position:relative;display:inline-block;min-width:54px;text-align:right}
.sx-rate i{position:absolute;left:0;bottom:-3px;height:3px;width:calc(var(--r) * 100%);border-radius:2px;background:var(--accent);opacity:.8}
.cl-tab td .cl-xp{all:unset;cursor:pointer;font-weight:800;color:var(--accent);border-bottom:1px dashed currentColor}
.cl-tab td .cl-xp:hover{color:var(--ink)}
.sx-filter{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:0 0 12px}
/* ranked bar lists: the clubs opponents earn DefCon against, a club's DefCon leaders */
.sx-bars{display:grid;gap:8px}
.sx-bar{display:grid;grid-template-columns:22px minmax(0,150px) minmax(0,1fr) auto;gap:10px;align-items:center;font:700 13px Manrope;color:var(--ink)}
.sx-bar .r{color:var(--muted);font-size:11px;text-align:right}
.sx-bar .t{display:flex;align-items:center;gap:8px;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:inherit;text-decoration:none}
.sx-bar .t:hover{color:var(--accent)}
.sx-bar .tr{height:10px;border-radius:5px;background:var(--well);overflow:hidden}
.sx-bar .tr i{display:block;height:100%;width:calc(var(--w) * 100%);border-radius:inherit;background:linear-gradient(90deg,color-mix(in oklab,var(--accent) 55%,transparent),var(--accent))}
.sx-bar .v{font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}.sx-bar .v small{color:var(--muted);font-weight:600;margin-left:4px}
@media (max-width:560px){
  .sx-chart .ax,.sx-chart .lb{font-size:12px}
  .sx-bar{grid-template-columns:18px minmax(0,1fr) 70px auto;gap:8px;font-size:12px}
  .sx-chart.sc .axl,.sx-chart.sc .ax{font-size:11px}
}
.sx-ctab td small{margin-left:4px;font:800 10.5px Manrope}.sx-ctab td small.up{color:var(--good)}.sx-ctab td small.dn{color:var(--bad)}
.sx-min{display:inline-flex;align-items:center;gap:8px;font:700 12px Manrope;color:var(--muted)}
.sx-min select{font:700 13px Manrope;color:var(--ink);background:var(--well);border:1px solid var(--hair-2);border-radius:8px;padding:6px 8px}
.sx-view{margin-top:16px}
.sx-tab.narrow{min-width:0}.sx-tab.narrow th,.sx-tab.narrow td{padding-left:7px;padding-right:7px}.sx-tab.narrow .sx-rate{min-width:44px}
.sx-dc{display:grid;gap:20px}
/* three lines: made (xG or xG against) in red with a fade, goals in sky blue, expected dashed */
.sx-lines .ln{fill:none;stroke-linejoin:round;stroke-linecap:round}
.sx-lines .ln.made{stroke:var(--accent);stroke-width:3;filter:drop-shadow(0 3px 6px #0005)}
.sx-lines .ln.goals{stroke:var(--info);stroke-width:2.2}
.sx-lines .ln.exp{stroke:var(--ink);stroke-width:2;stroke-dasharray:5 5;opacity:.75}
.sx-lines .pt{stroke-width:2.2}.sx-lines .pt.made{fill:var(--ground-2);stroke:var(--accent)}.sx-lines .pt.goals{fill:var(--info);stroke:var(--ground-2)}
.sx-lines .pt.exp{stroke:var(--ink)}.sx-lines .pt.exp.mk{fill:var(--ink)}.sx-lines .pt.exp.md{fill:var(--ground-2)}.sx-lines .pt.exp.ah{fill:var(--ground-2);stroke:var(--muted)}
.sx-key i.l-made{width:18px;height:3px;border-radius:2px;background:var(--accent)}.sx-key i.l-goals{width:18px;height:3px;border-radius:2px;background:var(--info)}
.sx-key i.l-exp{width:18px;height:0;border-top:2px dashed var(--ink);border-radius:0}
/* pages of ten */
.sx-pager{display:flex;align-items:center;justify-content:flex-end;gap:12px;margin:12px 0 0;font:700 12px Manrope;color:var(--muted)}
@media (max-width:560px){.sx-tab.narrow th{white-space:normal;line-height:1.25;vertical-align:bottom}.sx-tab.narrow th button{display:inline-block;max-width:64px}.sx-tab.narrow th.pl button{max-width:none}}
.sx-chart.sc .zero{stroke:var(--ink-2);stroke-width:1.5;opacity:.7}
.sx-chart.sc .qd{fill:var(--faint);font:800 10.5px Manrope;letter-spacing:.06em;text-transform:uppercase}