/* StormBet cinematic preloader */
#ms-loader{
    position:fixed;
    inset:0;
    z-index:2147483647;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    background:
        radial-gradient(ellipse at 50% 48%,rgba(33,37,46,.72),transparent 46%),
        linear-gradient(180deg,#080a0e 0%,#11151c 48%,#050609 100%);
    transition:opacity .48s ease,visibility .48s ease;
}
#ms-loader.is-hidden{opacity:0;visibility:hidden;pointer-events:none}
html.ms-loader-lock,body.ms-loader-lock{overflow:hidden!important}
body.ms-preboot-hidden>:not(#ms-loader){visibility:hidden!important}
body.ms-preboot-hidden{overflow:hidden!important}

.ms-loader__stage{
    position:relative;
    width:100%;
    height:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    isolation:isolate;
    overflow:hidden;
}
.ms-loader__stage:after{
    content:"";
    position:absolute;
    inset:0;
    z-index:8;
    pointer-events:none;
    background:radial-gradient(ellipse at center,transparent 28%,rgba(0,0,0,.25) 65%,rgba(0,0,0,.72) 100%);
}
.ms-loader__clouds{
    position:absolute;
    z-index:1;
    left:-12%;
    width:124%;
    border-radius:50%;
    filter:blur(28px);
    opacity:.78;
    will-change:transform;
}
.ms-loader__clouds--back{
    top:-25%;
    height:68%;
    background:
        radial-gradient(ellipse at 10% 70%,#29303b 0 13%,transparent 35%),
        radial-gradient(ellipse at 32% 48%,#1d232d 0 18%,transparent 42%),
        radial-gradient(ellipse at 58% 68%,#303744 0 17%,transparent 40%),
        radial-gradient(ellipse at 84% 44%,#202630 0 17%,transparent 42%);
    animation:msCloudDriftBack 8s ease-in-out infinite alternate;
}
.ms-loader__clouds--front{
    top:4%;
    height:54%;
    z-index:3;
    opacity:.65;
    background:
        radial-gradient(ellipse at 7% 40%,#11161e 0 17%,transparent 39%),
        radial-gradient(ellipse at 27% 62%,#232a35 0 19%,transparent 43%),
        radial-gradient(ellipse at 53% 39%,#151b24 0 20%,transparent 44%),
        radial-gradient(ellipse at 78% 60%,#252c37 0 19%,transparent 43%),
        radial-gradient(ellipse at 96% 38%,#11161e 0 16%,transparent 38%);
    animation:msCloudDriftFront 6s ease-in-out infinite alternate;
}
.ms-loader__rain{
    position:absolute;
    z-index:2;
    inset:-30% -20%;
    opacity:.28;
    transform:rotate(12deg);
    background-image:
        radial-gradient(ellipse 1px 11px at 12px 12px,rgba(205,220,235,.5) 0 52%,transparent 72%),
        radial-gradient(ellipse 1px 8px at 38px 31px,rgba(181,199,218,.34) 0 48%,transparent 72%),
        radial-gradient(ellipse 1px 13px at 66px 18px,rgba(215,228,240,.4) 0 50%,transparent 70%),
        radial-gradient(ellipse 1px 6px at 86px 43px,rgba(170,189,208,.28) 0 46%,transparent 72%);
    background-size:96px 58px,112px 74px,138px 82px,124px 68px;
    background-repeat:repeat;
    animation:msRainFall .42s linear infinite;
    -webkit-mask-image:linear-gradient(transparent 5%,#000 42%,transparent 92%);
    mask-image:linear-gradient(transparent 5%,#000 42%,transparent 92%);
}
.ms-loader__flash{
    position:absolute;
    z-index:4;
    inset:0;
    opacity:0;
    background:
        radial-gradient(circle at 63% 20%,rgba(255,249,211,.9),rgba(255,200,37,.22) 23%,transparent 58%),
        rgba(222,234,255,.12);
    mix-blend-mode:screen;
    animation:msSkyFlash 3s linear infinite;
}
.ms-loader__lightning{
    position:absolute;
    z-index:5;
    inset:0;
    width:100%;
    height:100%;
    overflow:visible;
    pointer-events:none;
    filter:drop-shadow(0 0 5px #fff7c5) drop-shadow(0 0 16px rgba(255,194,25,.92));
}
.ms-loader__bolt{
    fill:none;
    stroke:#fffbd5;
    stroke-width:7;
    stroke-linecap:round;
    stroke-linejoin:miter;
    vector-effect:non-scaling-stroke;
    opacity:0;
}
.ms-loader__bolt--left{stroke-width:4;animation:msBoltLeft 3s linear infinite}
.ms-loader__bolt--main{animation:msBoltMain 3s linear infinite}
.ms-loader__bolt--branch{stroke-width:4;animation:msBoltBranch 3s linear infinite}
.ms-loader__backGlow{
    position:absolute;
    z-index:5;
    width:min(62vw,720px);
    aspect-ratio:1.5;
    border-radius:50%;
    opacity:.18;
    background:radial-gradient(ellipse,rgba(255,203,51,.6),rgba(245,185,33,.12) 42%,transparent 72%);
    filter:blur(34px);
    animation:msBackGlow 3s linear infinite;
}
.ms-loader__wrap{
    position:relative;
    z-index:7;
    width:min(82vw,620px);
    opacity:0;
    transform:translateY(18px) scale(.84);
    animation:msLogoStrike 3s cubic-bezier(.18,.9,.25,1) infinite;
}
.ms-loader__shadow{
    position:absolute;
    left:9%;
    right:9%;
    bottom:-8%;
    height:32%;
    border-radius:50%;
    background:radial-gradient(ellipse,rgba(245,185,33,.38),rgba(245,185,33,.1) 48%,transparent 75%);
    filter:blur(24px);
    animation:msLogoShadow 3s linear infinite;
}
.ms-loader__logo{
    position:relative;
    display:block;
    width:100%;
    height:auto;
    max-height:34vh;
    object-fit:contain;
    filter:brightness(.58) saturate(.72) drop-shadow(0 8px 16px rgba(0,0,0,.85));
    animation:msLogoLight 3s linear infinite;
}

@keyframes msCloudDriftBack{from{transform:translate3d(-2%,0,0) scale(1.04)}to{transform:translate3d(3%,3%,0) scale(1.1)}}
@keyframes msCloudDriftFront{from{transform:translate3d(3%,0,0) scale(1.07)}to{transform:translate3d(-3%,-2%,0) scale(1.12)}}
@keyframes msRainFall{from{transform:translate3d(0,-7%,0) rotate(12deg)}to{transform:translate3d(-18px,7%,0) rotate(12deg)}}
@keyframes msSkyFlash{
    0%,12%,20%,48%,55%,100%{opacity:0}
    13%{opacity:.2}14%{opacity:0}15%{opacity:.7}17%{opacity:.06}
    49%{opacity:.16}50%{opacity:.94}52%{opacity:.08}53%{opacity:.55}
}
@keyframes msBoltLeft{0%,13.7%,17.2%,100%{opacity:0}14%,15.8%{opacity:.82}14.8%,16.5%{opacity:.14}}
@keyframes msBoltMain{0%,49.5%,54%,100%{opacity:0}50%,51.5%,53%{opacity:1}50.8%,52.2%{opacity:.16}}
@keyframes msBoltBranch{0%,50%,53.5%,100%{opacity:0}50.5%,52.8%{opacity:.9}51.4%{opacity:.12}}
@keyframes msBackGlow{0%,12%,48%,56%,100%{opacity:.12;transform:scale(.88)}16%,52%{opacity:.62;transform:scale(1.08)}}
@keyframes msLogoStrike{
    0%,9%{opacity:0;transform:translateY(18px) scale(.84)}
    17%{opacity:.38;transform:translateY(5px) scale(.94)}
    50%{opacity:.72;transform:translateY(0) scale(.985)}
    53%{opacity:1;transform:translateY(-3px) scale(1.025)}
    61%,100%{opacity:1;transform:translateY(0) scale(1)}
}
@keyframes msLogoLight{
    0%,12%{filter:brightness(.42) saturate(.58) drop-shadow(0 8px 16px rgba(0,0,0,.85))}
    16%{filter:brightness(.82) saturate(1.1) drop-shadow(0 0 13px rgba(245,185,33,.45))}
    48%{filter:brightness(.7) saturate(.92) drop-shadow(0 7px 15px rgba(0,0,0,.78))}
    52%{filter:brightness(1.28) saturate(1.3) drop-shadow(0 0 8px rgba(255,255,255,.72)) drop-shadow(0 0 27px rgba(245,185,33,.9))}
    60%,100%{filter:brightness(1) saturate(1.08) drop-shadow(0 5px 13px rgba(0,0,0,.8)) drop-shadow(0 0 13px rgba(245,185,33,.36))}
}
@keyframes msLogoShadow{0%,12%{opacity:0;transform:scale(.7)}17%{opacity:.32}52%{opacity:.92;transform:scale(1.08)}65%,100%{opacity:.58;transform:scale(1)}}

@media (max-width:640px){
    .ms-loader__wrap{width:min(88vw,460px)}
    .ms-loader__clouds{filter:blur(20px)}
    .ms-loader__bolt--left{display:none}
}
@media (prefers-reduced-motion:reduce){
    .ms-loader__clouds,.ms-loader__rain,.ms-loader__flash,.ms-loader__bolt,.ms-loader__backGlow,.ms-loader__wrap,.ms-loader__logo,.ms-loader__shadow{animation:none!important}
    .ms-loader__wrap{opacity:1;transform:none}
    .ms-loader__logo{filter:drop-shadow(0 0 15px rgba(245,185,33,.4))}
}
