/* Match the existing Game Highlights feature card. Live keeps its own layout. */
.streamers .streamers__heading{display:block;gap:0;text-align:center}
.streamers .streamers__heading-copy{width:100%}
.streamers .streamers__title-line{flex-direction:column;justify-content:center;gap:12px}
.streamers .streamers__heading-copy>p{margin-inline:auto}
/* Both share rows use identical button widths and fading divider endpoints. */
.xfg-home.xfg-home--community-layout .streamers .latest-news__action{display:grid;grid-template-columns:minmax(0,1fr) 212px minmax(0,1fr);align-items:center;gap:12px}
.xfg-home.xfg-home--community-layout .streamers .latest-news__action::before,.xfg-home.xfg-home--community-layout .streamers .latest-news__action::after{display:block;width:100%;height:1px;margin:0;opacity:1;background:linear-gradient(90deg,#3e3e3e00,#636262)}
.xfg-home.xfg-home--community-layout .streamers .latest-news__action::after{background:linear-gradient(90deg,#636262,#3e3e3e00)}
.xfg-home.xfg-home--community-layout .streamers .latest-news__share{width:100%;min-width:0;justify-content:center}
.streamers[data-mode=highlights] .streamers__inner{width:min(1360px,calc(100% - 96px))}
.streamers[data-mode=highlights] .streamers__stage{height:580px}
.streamers[data-mode=highlights] .streamers__slide{width:calc(56.140350877% - 11.228070175px);max-width:none}
.streamers[data-mode=highlights] .streamers__slide .streamers__spotlight{display:flex;flex-direction:column;height:500px;border:1px solid #ffffff24;border-radius:10px;background:linear-gradient(145deg,#2b2d2f,#202123);box-shadow:none}
.streamers[data-mode=highlights] .streamers__slide .streamers__media{width:100%;aspect-ratio:auto;flex:1;min-height:0}
.streamers[data-mode=highlights] .streamers__media::after{background:none}
.streamers[data-mode=highlights] .streamers__media-caption{display:none}
.streamers[data-mode=highlights] .streamers__slide .streamers__details{position:relative;display:block;visibility:visible;opacity:1;flex:none;min-height:0;padding:22px 24px 24px;background:transparent}
.streamers[data-mode=highlights] .streamers__provider{font-size:13px;line-height:1.4;margin:0;color:#b5b5b6}
.streamers[data-mode=highlights] .streamers__provider>img{display:none}
.streamers[data-mode=highlights] .streamers__creator{font:700 30px/1.1 'XFG Condensed','Arial Narrow',sans-serif!important;letter-spacing:.4px;margin:12px 0 0;text-transform:none}
.streamers[data-mode=highlights] .streamers__byline{font-size:12px;line-height:1.5;color:#c3c3c3;margin:10px 0 0}
.streamers[data-mode=highlights] .streamers__details .streamers__watch{position:absolute;inset:0;max-width:none;width:100%;height:100%;min-height:0;margin:0;padding:0;border:0;border-radius:0;background:transparent;color:transparent;opacity:0}
.streamers[data-mode=highlights] .streamers__details .streamers__watch:focus-visible{opacity:1;outline:3px solid var(--streamers-yellow);outline-offset:-4px}
.streamers[data-mode=highlights] .streamers__play{top:50%;width:60px;height:60px;border:0;background:var(--streamers-yellow);color:white;box-shadow:0 0 0 0 #ffd00040}
.streamers[data-mode=highlights] .streamers__media:hover .streamers__play{transform:translate(-50%,-50%);animation:xfg-play-ring 1.6s ease-in-out infinite;color:white}
.streamers[data-mode=highlights] .streamers__play svg{width:24px;height:24px}
@media(max-width:1180px){.streamers[data-mode=highlights] .streamers__inner{width:calc(100% - 64px)}}
@media(min-width:1181px) and (max-width:1200px){.streamers[data-mode=live] .streamers__inner{width:calc(100% - 96px)}}
@media(max-width:1100px){
 .streamers[data-mode=highlights] .streamers__stage{height:576px}
 .streamers[data-mode=highlights] .streamers__slide{width:calc(52.380952381% - 8.380952381px)}
 .streamers[data-mode=highlights] .streamers__slide .streamers__spotlight{height:496px}
 .streamers[data-mode=highlights] .streamers__creator{font-size:27px!important}
}
@media(max-width:760px){
 .streamers[data-mode=highlights] .streamers__inner{width:calc(100% - 32px)}
 .streamers[data-mode=highlights] .streamers__stage{height:calc((100vw - 34px) * .5625 + 228px)}
 .streamers[data-mode=highlights] .streamers__slide{width:100%;max-width:none}
 .streamers[data-mode=highlights] .streamers__slide .streamers__spotlight{height:auto}
 .streamers[data-mode=highlights] .streamers__slide .streamers__media{flex:none;aspect-ratio:16/9}
 .streamers[data-mode=highlights] .streamers__slide .streamers__details{padding:20px}
 .streamers[data-mode=highlights] .streamers__creator{font-size:28px!important}
}
@media(prefers-reduced-motion:reduce){.streamers[data-mode=highlights] .streamers__media:hover .streamers__play{animation:none}}

/* No cast shadow beneath the rotating highlight cards. */
.streamers[data-mode=highlights] .streamers__stage::before{content:none}

/* Enlarge the card inside its slide so the carousel position stays intact. */
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
  body.xfg-home [data-streamers] .streamers__spotlight {
    transform:scale(1);
    transform-origin:center;
    transition:transform 280ms cubic-bezier(.2,.65,.3,1);
  }
  body.xfg-home [data-streamers] .streamers__spotlight:hover {
    transform:scale(1.025);
  }
}
