/* Motion follows the layout: reveals, light sweeps and anchored icons. */
.graphics-motion .mg-pending{opacity:0;translate:0 22px}
.graphics-motion .mg-enter.mg-item{animation:mg-rise .75s cubic-bezier(.16,1,.3,1) both;animation-delay:var(--enter-delay,0ms)}
.graphics-motion .mg-heading.mg-enter h2,.graphics-motion .mg-heading.mg-enter h3{animation:mg-title-enter .85s cubic-bezier(.16,1,.3,1) both}
.graphics-motion .mg-heading.mg-enter .eyebrow{animation:mg-rise .65s ease-out both}
.graphics-motion .mg-heading.mg-enter .section-mark{animation:mg-mark-enter .8s cubic-bezier(.16,1,.3,1) both}
.graphics-motion .mg-heading.mg-enter .heading-rule{transform-origin:left;animation:mg-line-enter 1s cubic-bezier(.16,1,.3,1) both}
.graphics-motion .motion-hero h1 em,.graphics-motion .motion-hero.t-hero h1>span{background:linear-gradient(110deg,#82b3cf 12%,#edfaff 38%,#a1d0e6 50%,#6294b1 78%);background-size:220% 100%;background-clip:text;-webkit-text-fill-color:transparent;animation:mg-title-light 9s ease-in-out infinite}
.graphics-motion .hero-action,.graphics-motion .motion-copy .button,.graphics-motion .motion-copy .text-link,.graphics-motion .tournament-tile{position:relative;isolation:isolate;overflow:hidden}
.graphics-motion .hero-action:before,.graphics-motion .motion-copy .button:before{content:'';position:absolute;inset:-70% -35%;z-index:-1;background:linear-gradient(115deg,transparent 43%,#d2f4ff20 49%,transparent 55%);transform:translateX(-75%);pointer-events:none}
.graphics-motion .hero-action.primary:before{animation:mg-button-light 8s ease-in-out infinite}
.graphics-motion .hero-action:hover:before,.graphics-motion .hero-action:focus-visible:before,.graphics-motion .motion-copy .button:hover:before,.graphics-motion .motion-copy .button:focus-visible:before{animation:mg-button-hover .65s ease-out both}
.graphics-motion .hero-action>span:last-child{transition:transform .3s ease}.graphics-motion .hero-action:hover>span:last-child,.graphics-motion .hero-action:focus-visible>span:last-child{transform:translateX(4px)}
.graphics-motion .tournament-tile:before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 50% 43%,#5788ba25,transparent 65%);opacity:.45;transition:opacity .4s ease}
.graphics-motion .tournament-tile:hover:before,.graphics-motion .tournament-tile:focus-visible:before{opacity:1}
.graphics-motion .tournament-tile>.competition-icon{animation:mg-icon-float 6s ease-in-out infinite}.graphics-motion .tournament-tile:nth-child(2)>.competition-icon{animation-delay:-3s}
.graphics-motion .tile-link{transition:translate .3s ease}.graphics-motion .tournament-tile:hover .tile-link{translate:0 -3px}
.graphics-motion .calendar-event{animation:mg-rise .4s ease-out both}.graphics-motion #days button.selected .day-icons{animation:mg-calendar-in .45s ease-out both}
.graphics-motion .highlight-card.focused{animation:mg-highlight-in .55s cubic-bezier(.16,1,.3,1) both}
.graphics-motion dialog[open]{animation:mg-dialog-in .3s cubic-bezier(.16,1,.3,1) both}.graphics-motion dialog[open]::backdrop{animation:mg-backdrop-in .3s ease-out both}
.graphics-motion .league-faq details[open] p{animation:mg-rise .35s ease-out both}.graphics-motion .league-faq summary:after{transition:transform .25s ease}.graphics-motion .league-faq details[open] summary:after{transform:rotate(180deg)}
.graphics-motion .mg-progress{position:absolute;left:0;bottom:0;width:100%;height:2px;pointer-events:none;transform-origin:left;background:linear-gradient(90deg,#73b8d5,#d2eff7 65%,#c37990);z-index:5}
.graphics-motion .mg-loop-off>.competition-icon,.graphics-motion .mg-loop-off:after{animation-play-state:paused!important}
.graphics-motion .motion-offscreen .motion-copy *,.graphics-motion .motion-offscreen .motion-copy *:before,.graphics-motion .motion-offscreen .motion-copy *:after{animation-play-state:paused!important}
.graphics-motion.motion-paused *,.graphics-motion.motion-paused *:before,.graphics-motion.motion-paused *:after{animation-play-state:paused!important}
.graphics-motion.motion-paused .mg-pending{opacity:1;translate:none}
.graphics-motion.motion-paused .mg-enter,.graphics-motion.motion-paused .mg-heading *{animation:none!important;opacity:1;clip-path:none}
@keyframes mg-rise{from{opacity:0;translate:0 22px}to{opacity:1;translate:0 0}}
@keyframes mg-title-enter{from{opacity:0;clip-path:inset(0 100% 0 0);translate:0 7px}to{opacity:1;clip-path:inset(0);translate:0 0}}
@keyframes mg-mark-enter{from{opacity:0;transform:translateY(8px) rotate(-12deg) scale(.86)}to{opacity:1;transform:none}}
@keyframes mg-line-enter{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes mg-title-light{0%,100%{background-position:100% 50%}50%{background-position:0 50%}}
@keyframes mg-button-light{0%,60%{transform:translateX(-75%)}85%,100%{transform:translateX(75%)}}
@keyframes mg-button-hover{from{transform:translateX(-75%)}to{transform:translateX(75%)}}
@keyframes mg-icon-float{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-7px) rotate(2deg)}}
@keyframes mg-calendar-in{from{opacity:.3;transform:scale(.7)}to{opacity:1;transform:scale(1)}}
@keyframes mg-highlight-in{from{opacity:.4;translate:20px 0}to{opacity:1;translate:0 0}}
@keyframes mg-dialog-in{from{opacity:0;translate:0 18px;scale:.98}to{opacity:1;translate:0 0;scale:1}}
@keyframes mg-backdrop-in{from{opacity:0}to{opacity:1}}
@media(max-width:800px){.graphics-motion .mg-enter.mg-item{animation-duration:.55s}.graphics-motion .tournament-tile>.competition-icon{animation:none}.graphics-motion .hero-action.primary:before{animation-duration:10s}}
@media(prefers-reduced-motion:reduce){
 .graphics-motion .mg-pending{opacity:1;translate:none}
 .graphics-motion *,.graphics-motion *:before,.graphics-motion *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
 .graphics-motion .mg-heading *{clip-path:none;translate:none;transform:none}
}
