/* The Premier League landing, on top of landing-v2's stylesheets (tools/build_epl_landing.mjs).
   Only what differs: the counter without LaLiga's start line, and the interactive example's result and tabs. The hero's
   background is LaLiga's own, from landing-v2's stylesheets, untouched. */
@media(max-width:760px),(max-width:960px) and (max-height:500px){
  /* the counter keeps "registered" on the phone: LaLiga's dock drops it for its "starts when it fills" line */
  body.epl #wtop .wrg{display:inline}
  body.epl #dock{width:128px}
}
/* the interactive example's result: the price move is its headline, in the size LaLiga gives its gain line (the Premier League
   card has no gain line: no money-won framing), so "His price went up" / "+10.25%" rather than a lone bracketed figure */
body.epl .result-primary #result-percent{font-size:clamp(23px,6.5vw,34px);line-height:1.1;letter-spacing:-1.2px;font-variant-numeric:tabular-nums}
/* the narrowest phones: each tab as wide as its name (Fernandes does not fit a quarter of 320 px), the row still full width */
@media(max-width:359px){body.epl .player-tabs{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:auto}body.epl .player-tab{padding-left:6px;padding-right:6px}}
/* reduced motion: landing-v2's tech.css stops the price's lift but also leaves it at opacity 0 (it meant the wash behind it),
   so after "See how he performed" the heading would show no price; here it stays */
@media(prefers-reduced-motion:reduce){html body.epl .ph-val.up strong,html body.epl .ph-val.dn strong{opacity:1}}
