/* Original ElementsXT Youplay preloader styles, extracted from template/mega/css/youplay.min.css. */
.preloader-wrapp{position:fixed;top:0;left:0;width:100%;height:100%;overflow:hidden;background:#080325;z-index:100000000}.preloader-wrapp .preloader{position:absolute;top:50%;left:50%;margin-top:-100px;margin-left:-100px}.preloader-wrapp>img{position:absolute;bottom:50%;left:50%;width:100px;margin-left:-50px;margin-bottom:-10px;z-index:2}.preloader{position:relative;box-sizing:border-box;background-clip:padding-box;width:200px;height:200px;border-radius:100px;border:5px solid rgba(255,255,255,.1);-webkit-mask:linear-gradient(rgba(0,0,0,.1),#000 90%);-webkit-transform-origin:50% 60%;-ms-transform-origin:50% 60%;-o-transform-origin:50% 60%;transform-origin:50% 60%;-webkit-transform:perspective(200px) rotateX(80deg);transform:perspective(200px) rotateX(80deg)}.preloader:after,.preloader:before{content:"";position:absolute;left:0;top:0;margin:-5px;box-sizing:inherit;width:inherit;height:inherit;border-radius:inherit;border:10px solid rgba(255,255,255,.1);opacity:.85;border-color:#6B0B59 transparent transparent;-webkit-animation:youplay-preloader-spin 1s infinite;-o-animation:youplay-preloader-spin 1s infinite;animation:youplay-preloader-spin 1s infinite}.preloader:after{-webkit-animation-delay:.35s;-o-animation-delay:.35s;animation-delay:.35s}@-webkit-keyframes youplay-preloader-spin{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@-o-keyframes youplay-preloader-spin{100%{-o-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes youplay-preloader-spin{100%{-webkit-transform:rotate(360deg);-o-transform:rotate(360deg);transform:rotate(360deg)}}.preloader-wrapp>.preloader,.preloader-wrapp>img{-webkit-animation:youplay-preloader-fade .5s;-o-animation:youplay-preloader-fade .5s;animation:youplay-preloader-fade .5s}@-webkit-keyframes youplay-preloader-fade{0%{opacity:0}100%{opacity:1}}@-o-keyframes youplay-preloader-fade{0%{opacity:0}100%{opacity:1}}@keyframes youplay-preloader-fade{0%{opacity:0}100%{opacity:1}}
/* Leave the site usable when JavaScript is disabled or unavailable. */
html:not(.xt-preload-enabled) .preloader-wrapp{display:none}
/* Only the preloader can fade out; keep the existing redesigned portal unchanged. */
.preloader-wrapp{transition:opacity .35s ease,visibility .35s ease}
.preloader-wrapp.is-hiding{opacity:0;visibility:hidden;pointer-events:none}
@media(prefers-reduced-motion:reduce){.preloader-wrapp{transition:none}}

/* ElementsXT ring motion fix: isolated from the redesigned portal's styles.
   Preserve the original Youplay perspective/positioning and 2-second loader delay. */
#preloader .preloader {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 200px;
  height: 200px;
  margin: -100px 0 0 -100px;
  border: 5px solid rgba(255,255,255,.1);
  border-radius: 50%;
  box-sizing: border-box;
  -webkit-transform: perspective(200px) rotateX(80deg);
  transform: perspective(200px) rotateX(80deg);
  pointer-events: none;
}
#preloader .preloader::before,
#preloader .preloader::after {
  content: "";
  position: absolute;
  top: -5px;
  left: -5px;
  right: -5px;
  bottom: -5px;
  width: auto;
  height: auto;
  margin: 0;
  border-radius: 50%;
  box-sizing: border-box;
  border: 10px solid transparent;
  border-top-color: #8c146f;
  opacity: .95;
  -webkit-animation: xt-youplay-ring-spin 1s linear infinite;
  animation: xt-youplay-ring-spin 1s linear infinite;
  will-change: transform;
}
#preloader .preloader::after {
  border-top-color: #b21788;
  -webkit-animation-delay: -.35s;
  animation-delay: -.35s;
}
@-webkit-keyframes xt-youplay-ring-spin {
  from { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
  to   { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}
@keyframes xt-youplay-ring-spin {
  from { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
  to   { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}

/* Explicitly requested original Youplay ring motion. The redesign's
   portal.css disables *all* CSS animations with !important when the OS/browser
   requests reduced motion. This ID-scoped important animation restores ONLY
   this short-lived preloader, leaving the rest of the site unchanged. */
#preloader .preloader::before,
#preloader .preloader::after { content: none !important; display: none !important; }
#preloader .preloader .xt-ring-arc {
  display: block;
  position: absolute;
  inset: -5px;
  box-sizing: border-box;
  border-radius: 50%;
  border: 10px solid transparent;
  border-top-color: #6b0b59;
  opacity: .88;
  transform-origin: center center;
  -webkit-animation: xt-motion-fix-ring 1s linear infinite !important;
  animation: xt-motion-fix-ring 1s linear infinite !important;
  will-change: transform;
}
#preloader .preloader .xt-ring-arc-b {
  border-top-color: #b21788;
  -webkit-animation-delay: -.35s !important;
  animation-delay: -.35s !important;
}
@-webkit-keyframes xt-motion-fix-ring {
  from { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
  to { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}
@keyframes xt-motion-fix-ring {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}
