@font-face{
  font-family:"Montserrat";
  src:url("/fonts/montserrat-v31-latin-regular.woff2") format("woff2"), url("/fonts/montserrat-v31-latin-regular.woff") format("woff");
  font-weight:400;
  font-style:normal;
  font-display:swap;
}

@font-face{
  font-family:"Montserrat";
  src:url("/fonts/montserrat-v31-latin-500.woff2") format("woff2"), url("/fonts/montserrat-v31-latin-500.woff") format("woff");
  font-weight:500;
  font-style:normal;
  font-display:swap;
}

@font-face{
  font-family:"Montserrat";
  src:url("/fonts/montserrat-v31-latin-700.woff2") format("woff2"), url("/fonts/montserrat-v31-latin-700.woff") format("woff");
  font-weight:700;
  font-style:normal;
  font-display:swap;
}

@font-face{
  font-family:"Montserrat";
  src:url("/fonts/montserrat-v31-latin-900.woff2") format("woff2"), url("/fonts/montserrat-v31-latin-900.woff") format("woff");
  font-weight:900;
  font-style:normal;
  font-display:swap;
}

@font-face{
  font-family:"Inter";
  src:url("/fonts/inter-v20-latin-regular.woff2") format("woff2"), url("/fonts/inter-v20-latin-regular.woff") format("woff");
  font-weight:400;
  font-style:normal;
  font-display:swap;
}

@font-face{
  font-family:"Inter";
  src:url("/fonts/inter-v20-latin-500.woff2") format("woff2"), url("/fonts/inter-v20-latin-500.woff") format("woff");
  font-weight:500;
  font-style:normal;
  font-display:swap;
}

@font-face{
  font-family:"Inter";
  src:url("/fonts/inter-v20-latin-600.woff2") format("woff2"), url("/fonts/inter-v20-latin-600.woff") format("woff");
  font-weight:600;
  font-style:normal;
  font-display:swap;
}

@font-face{
  font-family:"Inter";
  src:url("/fonts/inter-v20-latin-700.woff2") format("woff2"), url("/fonts/inter-v20-latin-700.woff") format("woff");
  font-weight:700;
  font-style:normal;
  font-display:swap;
}

@font-face{
  font-family:"Inter";
  src:url("/fonts/inter-v20-latin-900.woff2") format("woff2"), url("/fonts/inter-v20-latin-900.woff") format("woff");
  font-weight:900;
  font-style:normal;
  font-display:swap;
}

@keyframes loader-0{

     0%{
         opacity:0;
     }

     100%{
         opacity:0.9;
     }
 }

@keyframes loader-1{

     0%,
     100%{
         background-size:20% 100%;
     }

     33%,
     66%{
         background-size:20% 40%;
     }
 }

@keyframes loader-2{

     0%,
     33%{
         background-position:0 0, 50% 100%, 100% 0;
     }

     66%,
     100%{
         background-position:0 100%, 50% 0, 100% 100%;
     }
 }

@keyframes coockie-in{
     from{
         opacity:0;
         transform:translateX(120%);
     }

     to{
         opacity:1;
         transform:translateX(0);
     }
 }

@keyframes bg-overlay-fade-out{
     from{
         opacity:1;
     }

     to{
         opacity:0;
     }
 }

@keyframes footer-rise{
     from{
         transform:translateY(100%);
         opacity:0;
     }

     to{
         transform:translateY(0);
         opacity:1;
     }
 }

@keyframes preview-bottom-in{
     from{ opacity:0.7; transform:perspective(900px) rotateX(34deg) translateY(45%); }
     to{ opacity:1;   transform:perspective(900px) rotateX(0deg) translateY(0); }
 }

@keyframes preview-fade-down{
     from{ opacity:0; transform:translateY(-18px); }
     to{ opacity:1; transform:translateY(0); }
 }

@keyframes preview-slide-right{
     from{ opacity:0; transform:translate(84px, -14px) rotate(12deg) }
     to{ opacity:1; transform:translate(0, 0) rotate(0deg); }
 }

@keyframes case-chosen{
     0%{ opacity:1; transform:scale(1);    filter:brightness(1); }
     25%{ opacity:1; transform:scale(1.08); filter:brightness(1.9) drop-shadow(0 0 26px rgba(255, 255, 255, 0.85)); }
     50%{ opacity:1; transform:scale(1.04); filter:brightness(1.6) drop-shadow(0 0 16px rgba(255, 255, 255, 0.5)); }
     100%{ opacity:1; transform:scale(1);    filter:brightness(1); }
 }

@keyframes preview-leave{
     from{ opacity:1; transform:translateY(0); }
     to{ opacity:0; transform:translateY(-24px); }
 }

@keyframes exit-timer{
     from{ opacity:0; }
     to{ opacity:0; }
 }

@keyframes scene-top-in{
     from{ opacity:0.7; transform:perspective(900px) rotateX(-34deg) translateY(-45%); }
     to{ opacity:1;   transform:perspective(900px) rotateX(0deg) translateY(0); }
 }

@keyframes init-case-in{
     from{ opacity:0; transform:translateY(24px) scale(0.96); }
     to{ opacity:1; transform:translateY(0) scale(1); }
 }

@keyframes init-bar-fill{
     0%{ width:2%; }
     6%{ width:25%; }
     24%{ width:25%; }
     32%{ width:50%; }
     52%{ width:50%; }
     60%{ width:75%; }
     80%{ width:75%; }
     94%{ width:100%; }
     100%{ width:100%; }
 }

@keyframes init-hint-blink{
     0%, 100%{ opacity:1; }
     50%{ opacity:0.5; }
 }

@keyframes init-status-step{
     0%{ opacity:0; }
     12%{ opacity:1; }
     88%{ opacity:1; }
     100%{ opacity:0; }
 }

@keyframes init-status-last{
     0%{ opacity:0; }
     20%{ opacity:1; }
     100%{ opacity:1; }
 }

@keyframes init-complete-flash{
     0%{ opacity:0; transform:scale(0.96); }
     30%{ opacity:1; transform:scale(1.02); }
     100%{ opacity:0; transform:scale(1.08); }
 }

@keyframes init-bar-finish{
     0%{ box-shadow:0 0 0 rgba(var(--init-accent-rgb), 0); }
     35%{ box-shadow:0 0 20px rgba(var(--init-accent-rgb), 0.9); }
     100%{ box-shadow:0 0 0 rgba(var(--init-accent-rgb), 0); }
 }

@keyframes init-case-finish{
     0%{ transform:scale(1);    filter:brightness(1); }
     35%{ transform:scale(1.05); filter:brightness(1.35); }
     100%{ transform:scale(1);    filter:brightness(1); }
 }

@keyframes init-leave{
     from{ opacity:1; transform:translateY(0); }
     to{ opacity:0; transform:translateY(-26px); }
 }

@keyframes scene-bottom-out{
     from{ opacity:1; transform:perspective(900px) rotateX(0deg) translateY(0); }
     to{ opacity:0; transform:perspective(900px) rotateX(34deg) translateY(45%); }
 }

@keyframes scene-top-out{
     from{ opacity:1; transform:perspective(900px) rotateX(0deg) translateY(0); }
     to{ opacity:0; transform:perspective(900px) rotateX(-34deg) translateY(-45%); }
 }

@keyframes reel-winner-breathe{
     0%, 100%{ transform:scale(1); }
     50%{ transform:scale(1.12); }
 }

@keyframes reel-btns-in{
     from{ opacity:0; transform:translateY(34px); }
     to{ opacity:1; transform:translateY(0); }
 }

@keyframes roulette-stage-in{
     0%{ opacity:0; transform:scale(0.9) translateY(26px); filter:blur(10px); }
     60%{ opacity:1; }
     100%{ opacity:1; transform:scale(1) translateY(0); filter:blur(0); }
 }

@keyframes reel-roll-rifle{
     0%{ transform:translateX(0); }
     5%{ transform:translateX(2.5rem); }
     100%{ transform:translateX(calc(-5 * var(--items-count--RIFLE, 6) * var(--item-step))); }
 }

@keyframes reel-roll-premium{
     0%{ transform:translateX(0); }
     5%{ transform:translateX(2.5rem); }
     100%{ transform:translateX(calc(-5 * var(--items-count--PREMIUM, 6) * var(--item-step))); }
 }

@keyframes preview-case-in-left{
     from{ opacity:0; transform:translateX(-160px); }
     to{ opacity:1; transform:translateX(0); }
 }

@keyframes preview-case-in-right{
     from{ opacity:0; transform:translateX(160px); }
     to{ opacity:1; transform:translateX(0); }
 }

@keyframes preview-fade-up{
     from{ opacity:0; transform:translate(-12px, 16px); }
     to{ opacity:1; transform:translate(0, 0); }
 }

@keyframes preview-fade-in{
     from{ opacity:0; }
     to{ opacity:1; }
 }

@keyframes preview-unlock{
     to{ visibility:visible; }
 }

@keyframes preview-case-unlock{
     to{ pointer-events:auto; }
 }

@keyframes case-smoke-breathe{
     0%, 100%{ opacity:0.45; transform:translate(-50%, -50%) scale(1); }
     50%{ opacity:0.9;  transform:translate(-50%, -52%) scale(1.05); }
 }

@keyframes case-breathe{
     0%, 100%{ transform:scale(1); }
     50%{ transform:scale(1.02); }
 }

@keyframes case-light-pulse{
     0%, 100%{ opacity:0.55; transform:translateY(3%) scale(1); }
     50%{ opacity:0.95; transform:translateY(3%) scale(1.06); }
 }

@keyframes case-shimmer{
     0%{ background-position:50% 0%;   opacity:0; }
     8%{ opacity:0.9; }
     35%{ background-position:50% 100%; opacity:0.9; }
     45%{ background-position:50% 100%; opacity:0; }
     100%{ background-position:50% 100%; opacity:0; }
 }

@keyframes popup-fade-in{
     from{
         opacity:0;
     }

     to{
         opacity:1;
     }
 }

@keyframes popup-slide-in{
     from{
         transform:translate(-50%, calc(-50% + 1.5vw));
         opacity:0;
     }

     to{
         transform:translate(-50%, -50%);
         opacity:1;
     }
 }

@keyframes popup-slide-up-auth{
     from{ opacity:0; transform:translateY(2.2rem) scale(0.97); }
     to{ opacity:1; transform:translateY(0) scale(1); }
 }

@keyframes auth-btn-pulse{
     0%, 100%{
         transform:scale(1);
         box-shadow:inset 0 0 0 1px rgba(255, 255, 255, 0.06), 0 0 18px rgba(var(--auth-rgb), 0.30);
     }
     50%{
         transform:scale(1.04);
         box-shadow:inset 0 0 0 1px rgba(255, 255, 255, 0.14), 0 0 36px rgba(var(--auth-rgb), 0.75);
     }
 }

@keyframes activate-bg-in{
     from{ opacity:0; transform:perspective(1200px) rotateY(-42deg) translateX(-14%); }
     to{ opacity:1; transform:perspective(1200px) rotateY(0deg) translateX(0); }
 }

@keyframes activate-prize-in{
     from{ opacity:0; transform:translateX(90px) scale(0.96); }
     to{ opacity:1; transform:translateX(0) scale(1); }
 }

@keyframes activate-prize-in-top{
     from{ opacity:0; transform:translateY(-60px) scale(0.96); }
     to{ opacity:1; transform:translateY(0) scale(1); }
 }

@keyframes activate-bg-in-top{
     from{ opacity:0;   transform:translate(-50%, -38%) rotate(90deg) translateX(-24%); }
     to{ opacity:0.5; transform:translate(-50%, -38%) rotate(90deg) translateX(0); }
 }

@keyframes activate-fade-down{
     from{ opacity:0; transform:translateY(-22px); }
     to{ opacity:1; transform:translateY(0); }
 }

@keyframes activate-icon-wobble{
     0%, 100%{ transform:rotate(-13deg); }
     50%{ transform:rotate(13deg); }
 }

@keyframes reel-cta-pulse{
     0%, 100%{ filter:drop-shadow(0 0 1px rgba(var(--cta-rgb), 0)); }
     50%{ filter:drop-shadow(0 0 14px rgba(var(--cta-rgb), 0.9)); }
 }

.loader{
    position:fixed;
    inset:0;
    z-index:var(--z-overlay);
    transition:opacity 0.3s ease;
    display:flex;
    align-items:center;
    justify-content:center;
    background:radial-gradient(50% 55.69% at 50% 48.98%, #0D2345 0%, #143363 100%);
}

.loader .loader__inner{
        width:220px;
        aspect-ratio:1;
        --c:no-repeat linear-gradient(var(--color-orange-1) 0 0);
        background:var(--c), var(--c), var(--c);
        animation:loader-0 1s forwards, loader-1 1s infinite, loader-2 1s infinite;
    }

@media (max-width: 767px){

.loader .loader__inner{
            width:90px;
    }
        }

@media (min-width: 1024px) and (max-width: 1919px){

.loader .loader__inner{
            width:200px;
    }
        }

.loader::after{
    content:"";
    position:fixed;
    inset:0;
    z-index:-1;
    background:radial-gradient(89.91% 35.1% at 50% 64.9%, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.24) 10%), linear-gradient(180deg, rgba(0, 0, 0, 0.18) 10%, rgba(0, 0, 0, 0.5) 99.81%);
}

.loader.hide{
    opacity:0;
    pointer-events:none;
}

html{
    scrollbar-width:none;
    -ms-overflow-style:none;

}

html::-webkit-scrollbar{
    display:none;
}

a,
abbr,
acronym,
address,
applet,
article,
aside,
audio,
b,
big,
blockquote,
body,
canvas,
caption,
center,
cite,
code,
dd,
del,
details,
dfn,
div,
dl,
dt,
em,
embed,
fieldset,
figcaption,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
html,
i,
iframe,
img,
ins,
kbd,
label,
legend,
li,
mark,
menu,
nav,
object,
ol,
output,
p,
pre,
q,
ruby,
s,
samp,
section,
small,
span,
strike,
strong,
sub,
summary,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
time,
tr,
tt,
u,
ul,
var,
video{
    margin:0;
    padding:0;
    border:0;
    font-size:100%;
    font:inherit;
    vertical-align:baseline;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav{
    display:block;
}

body{
    line-height:1;
}

ol,
ul{
    list-style:none;
}

blockquote,
q{
    quotes:none;
}

blockquote::after,
blockquote::before,
q::after,
q::before{
    content:"";
    content:none;
}

table{
    border-collapse:collapse;
    border-spacing:0;
}

*{
    box-sizing:border-box;
    margin:0;
    padding:0;
    -webkit-tap-highlight-color:rgba(0, 0, 0, 0);
}

a{
    cursor:pointer;
    text-decoration:none;
    color:inherit;
}

img{
    display:block;
    max-width:100%;
    height:auto;
}

button{
    cursor:pointer;
    border:none;
    background:none;
    font:inherit;
    color:inherit;
}

:root{
    --font-primary:"Montserrat", sans-serif;
    --font-secondary:"Inter", sans-serif;
    --color-white-1:#FFFFFF;

    --color-grey-1:#B3C7E4;
    --color-grey-2:#8194B1;
    --color-grey-3:#4F5E73;

    --color-black-1:#0E1016;

    --color-blue-1:#1DC3FF;
    --color-blue-2:#1DF0FF;
    --color-blue-3:#1797FD;

    --color-orange-1:#FF8820;
    --color-orange-2:#FF5B20;

    --color-yellow-1:#FFD446;
    --z-consent:10000;
    --z-logo:9000;
    --z-overlay:8000;
    --z-popup:7000;
    --z-content:1;
}

body{
    position:relative;
    display:flex;
    flex-direction:column;
    width:100%;
    height:100vh;
    height:100dvh;
    min-height:100vh;
    min-height:100dvh;
    overflow:hidden;
    font-family:var(--font-primary);
    color:var(--color-white-1);
    background-color:#0D2345;
    background-image:url("/images/decor/bg-main-2.avif");
    background-position:center center;
    background-size:cover;
    background-repeat:no-repeat;
}

body::before{
    content:"";
    position:fixed;
    inset:0;
    z-index:0;
    pointer-events:none;
    background:radial-gradient(89.91% 35.1% at 50% 64.9%, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.24) 10%), linear-gradient(180deg, rgba(0, 0, 0, 0.18) 10%, rgba(0, 0, 0, 0.5) 99.81%), radial-gradient(50% 55.69% at 50% 48.98%, #0D2345 0%, #143363 100%);
    opacity:1;
}

body.show::before{
    animation:bg-overlay-fade-out 2s ease-out 0.3s forwards;
}

.main{
    position:relative;
    width:100%;
    display:flex;
    justify-content:center;
    align-items:center;
    flex:1;
    min-height:0;
    z-index:var(--z-content);
}

@media (max-width: 767px){

.main{
        overflow:hidden;
}
    }

.content{
    position:relative;
    width:100%;
    height:100%;
    flex:1;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:flex-start;
    min-height:0;
}

@media (max-width: 767px){

.content{
        overflow:hidden;
}
    }

.scene{
    position:absolute;
    left:0;
    width:100%;
    height:auto;
    z-index:0;
    pointer-events:none;
    opacity:0;
    will-change:transform, opacity;
}

.scene--bottom{
    bottom:-4px;
    transform-origin:center bottom;
    object-fit:cover;
    object-position:bottom center;
    filter:drop-shadow(0 -22px 60px rgba(40, 160, 240, 0.22)) drop-shadow(-30px 0 48px rgba(40, 160, 240, 0.12)) drop-shadow(30px 0 48px rgba(40, 160, 240, 0.12));
}

body.show .scene--bottom{
    animation:preview-bottom-in 1.2s cubic-bezier(0.22, 0.61, 0.36, 1) 1.4s forwards;
}

.scene--top{
    top:-4px;
    transform-origin:center top;
    object-fit:cover;
    object-position:top center;
    filter:drop-shadow(0 22px 60px rgba(40, 160, 240, 0.22)) drop-shadow(-30px 0 48px rgba(40, 160, 240, 0.12)) drop-shadow(30px 0 48px rgba(40, 160, 240, 0.12));
}

.content:has(.initializing-screen.show) .scene--top{
    animation:scene-top-in 1.2s cubic-bezier(0.22, 0.61, 0.36, 1) 0.1s forwards;
}

body.show .scene--bottom.out{
    animation:scene-bottom-out 1s cubic-bezier(0.4, 0, 0.7, 0.4) forwards;
}

.content:has(.initializing-screen.leaving) .scene--top.out{
    animation:scene-top-out 1s cubic-bezier(0.4, 0, 0.7, 0.4) forwards;
}

@media (min-width: 1024px) and (max-width: 1919px){
    .scene--bottom{ height:calc(50vh + 4px); object-position:top center; }
    .scene--top{ height:calc(50vh + 4px); object-position:bottom center; }
}

.unselectable{
    user-select:none;
    -webkit-user-select:none;
}

.undraggable{
    -webkit-user-drag:none;
}

.text-selectable{
    user-select:text;
    -webkit-user-select:text;
}

.dk{
    display:block;
}

.mb{
    display:none;
}

@media (max-width: 767px){
    .dk{
        display:none;
    }

    .mb{
        display:block;
    }
    html,
    body,
    .main,
    .content{
        overflow-x:hidden;
    }
}

@media (min-width: 768px) and (max-width: 1023px){
    html,
    body,
    .main,
    .content{
        overflow-x:hidden;
    }
}

a,
button,
input,
textarea{
    -webkit-appearance:none;
}

[data-stage]{
    display:none;
}

[data-stage].show{
    display:flex;
    flex-direction:column;
}

[data-section]{
    display:none;
}

[data-section].show{
    display:block;
}

[data-popup]{
    display:none;
}

[data-popup].show{
    display:flex;
}

[data-cookie="banner"].hide{
    display:none !important;
}

.text-title-main{
    font-family:var(--font-primary);
    font-size:clamp(1.75rem, 2.33vw + 1.204rem, 4rem);
    font-style:normal;
    font-weight:700;
    line-height:1;
    text-transform:uppercase;
    color:var(--color-white-1);
    text-shadow:0 0 3px var(--color-white-1);
    -webkit-user-select:none;
            user-select:none;
}

.text-subtitle-main{
    font-family:var(--font-primary);
    font-size:clamp(1.125rem, 1.553vw + 0.761rem, 2.625rem);
    font-style:normal;
    font-weight:700;
    line-height:1.1;
    text-transform:uppercase;
    color:var(--color-white-1);
        -webkit-user-select:none;
                user-select:none;
}

.text-btn{
    font-family:var(--font-secondary);
    font-size:clamp(1.563rem, 0.324vw + 1.487rem, 1.875rem);
    font-style:normal;
    font-weight:700;
    line-height:1.2;
    text-transform:uppercase;
    color:var(--color-white-1);
    text-shadow:0 0 2px var(--color-white-1);
}

.text-openings-1{
    font-family:var(--font-secondary);
    font-size:clamp(0.9rem, 0.259vw + 0.939rem, 1.1rem);
    font-style:normal;
    font-weight:500;
    line-height:1.4;
    text-transform:uppercase;
    color:var(--color-blue-1);
    -webkit-user-select:none;
            user-select:none;
}

.text-openings-1 span{
        color:var(--color-white-1);
        text-transform:none;
        -webkit-user-select:none;
                user-select:none;
    }

.text-openings-2{
    font-family:var(--font-secondary);
    font-size:clamp(0.9rem, 0.259vw + 0.939rem, 1.1rem);
    font-style:normal;
    font-weight:500;
    line-height:1.4;
    text-transform:uppercase;
    color:var(--color-orange-1);
    -webkit-user-select:none;
            user-select:none;
}

.text-openings-2 span{
        color:var(--color-white-1);
        text-transform:none;
        -webkit-user-select:none;
                user-select:none;
    }

.text-casual-1{
    font-family:var(--font-secondary);
    font-size:clamp(0.875rem, 0.388vw + 0.784rem, 1.25rem);
    font-style:normal;
    font-weight:500;
    line-height:1.4;
    color:var(--color-white-1);
    -webkit-user-select:none;
            user-select:none;
}

.text-casual-1 span{
        background:radial-gradient(308.1% 47.08% at 50% 50%, var(--color-blue-1) 0%, var(--color-blue-2) 100%);
        background-clip:text;
        -webkit-background-clip:text;
        -webkit-text-fill-color:transparent;
        -webkit-user-select:none;
                user-select:none;
    }

.text-casual-2{
    font-family:var(--font-secondary);
    font-size:clamp(0.875rem, 0.388vw + 0.784rem, 1.25rem);
    font-style:normal;
    font-weight:500;
    line-height:1.4;
    color:var(--color-white-1);
    -webkit-user-select:none;
            user-select:none;
}

.text-casual-2 span{
        background:radial-gradient(308.1% 47.08% at 50% 50%, var(--color-orange-1) 0%, var(--color-yellow-1) 100%);
        background-clip:text;
        -webkit-background-clip:text;
        -webkit-text-fill-color:transparent;
        -webkit-user-select:none;
                user-select:none;
    }

.text-loading{
    font-family:var(--font-secondary);
    font-size:clamp(1.5rem, 0.259vw + 1.439rem, 1.75rem);
    font-style:normal;
    font-weight:500;
    line-height:1.2;
    color:var(--color-white-1);
    -webkit-user-select:none;
            user-select:none;
}

.text-card-1{
    font-family:var(--font-secondary);
    font-size:18px;
    font-style:normal;
    font-weight:500;
    line-height:1.1;
    color:var(--color-white-1);
}

.text-card-1 span{
        background:radial-gradient(308.1% 47.08% at 50% 50%, var(--color-blue-1) 0%, var(--color-blue-2) 100%);
        background-clip:text;
        -webkit-background-clip:text;
        -webkit-text-fill-color:transparent;
        -webkit-user-select:none;
                user-select:none;
    }

.text-card-2{
    font-family:var(--font-secondary);
    font-size:18px;
    font-style:normal;
    font-weight:500;
    line-height:1.1;
    color:var(--color-white-1);
}

.text-card-2 span{
        background:radial-gradient(308.1% 47.08% at 50% 50%, var(--color-orange-1) 0%, var(--color-yellow-1) 100%);
        background-clip:text;
        -webkit-background-clip:text;
        -webkit-text-fill-color:transparent;
        -webkit-user-select:none;
                user-select:none;
    }

.text-popup-title-1{
    font-family:var(--font-primary);
    font-size:clamp(2rem, 0.777vw + 1.818rem, 2.75rem);
    font-style:normal;
    font-weight:700;
    line-height:1.2;
    color:var(--color-white-1);
    -webkit-user-select:none;
            user-select:none;
}

.text-popup-title-1 span{
        background:radial-gradient(308.1% 47.08% at 50% 50%, var(--color-blue-1) 0%, var(--color-blue-2) 100%);
        background-clip:text;
        -webkit-background-clip:text;
        -webkit-text-fill-color:transparent;
        -webkit-user-select:none;
                user-select:none;
    }

.text-popup-title-2{
    font-family:var(--font-primary);
    font-size:clamp(2rem, 0.777vw + 1.818rem, 2.75rem);
    font-style:normal;
    font-weight:700;
    line-height:1.2;
    color:var(--color-white-1);
    -webkit-user-select:none;
            user-select:none;
}

.text-popup-title-2 span{
        background:radial-gradient(308.1% 47.08% at 50% 50%, var(--color-orange-1) 0%, var(--color-yellow-1) 100%);
        background-clip:text;
        -webkit-background-clip:text;
        -webkit-text-fill-color:transparent;
        -webkit-user-select:none;
                user-select:none;
    }

.text-popup-btn{
    font-family:var(--font-secondary);
    font-size:clamp(1.125rem, 0.259vw + 1.064rem, 1.375rem);
    font-style:normal;
    font-weight:700;
    line-height:1.2;
    color:var(--color-white-1);
}

.header{
	opacity:0;
	position:absolute;
	top:0;
	left:0;
	z-index:var(--z-logo);
	width:100%;
	padding:1.75rem 1.75rem;
	pointer-events:none;
	transition:opacity 1.25s ease;
}

@media (max-width: 767px){

.header{
		padding:0.6rem 0.6rem;
}
	}

@media (min-width: 768px) and (max-width: 1023px){

.header{
		padding:1.5rem;
}
	}

@media (min-width: 1024px) and (max-width: 1919px){

.header{
		padding:1.25rem;
}
	}

.header__logo{
	display:inline-flex;
	align-items:center;
	pointer-events:auto;
	filter:drop-shadow(1px 1px 0 #000000);
}

@media (min-width: 768px) and (max-width: 1023px){

.header__logo{
		padding:0rem 0.3rem;
}
	}

@media (max-width: 767px){

.header__logo{
		padding:0.3rem;
}
	}

.header__logo-img{
	height:3.5rem;
}

@media (max-width: 767px){

.header__logo-img{
		height:1.7rem;
}
	}

@media (min-width: 768px) and (max-width: 1023px){

.header__logo-img{
		height:1.8rem;
}
	}

@media (min-width: 1024px) and (max-width: 1919px){

.header__logo-img{
		height:3rem;
}
	}

@media (min-width: 2560px){

.header__logo-img{
		height:3.75rem;
}
	}

@media (min-width: 3840px){

.header__logo-img{
		height:4rem;
}
	}

body.show .header{
	opacity:1;
}

.footer{
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    z-index:5001;
    width:100%;
    flex-shrink:0;
    box-sizing:border-box;
    -webkit-user-select:none;
            user-select:none;

    display:flex;
    align-items:center;
    min-height:3.75rem;

    padding:0 clamp(1.5rem, 12.5vw, 15rem);
    padding-bottom:env(safe-area-inset-bottom, 0px);

    background-color:#071329;
    font-family:var(--font-secondary);
    transform:translateY(100%);
    opacity:0;
}

.footer.show{
        animation:footer-rise 0.8s ease-out 0.8s forwards;
    }

.footer .footer__content{
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:clamp(1rem, 2vw, 2rem);
        width:100%;
    }

.footer .footer__logo{
        display:flex;
        align-items:center;
        flex-shrink:0;
    }

.footer .footer__logo-img{
        height:1.75rem;
        width:auto;
    }

.footer .footer__brand{
        display:flex;
        align-items:center;
        flex-shrink:0;
    }

.footer .footer__copy{
        display:flex;
        flex-direction:row;
        align-items:center;
        gap:1.25rem;
        line-height:1.2;
        color:var(--color-grey-2);
        font-weight:500;
        font-size:0.7rem;
    }

:is(.footer .footer__copy) > div{
            display:flex;
            align-items:center;
            gap:0.5rem;
        }

:is(.footer .footer__copy) span{
            white-space:nowrap;
        }

:is(.footer .footer__copy) a{
            color:var(--color-blue-3);
            transition:color 0.2s ease;
        }

:is(:is(.footer .footer__copy) a):hover{
                color:var(--color-blue-1);
            }

.footer .footer__terms{
        display:flex;
        align-items:center;
        gap:2.25rem;
        color:var(--color-blue-3);
        font-size:1.125rem;
        font-weight:400;
    }

:is(.footer .footer__terms) p{
            cursor:pointer;
            white-space:nowrap;
            transition:color 0.2s ease;
        }

:is(:is(.footer .footer__terms) p):hover{
                color:var(--color-blue-1);
            }

@media (min-width: 768px) and (max-width: 1023px){

.footer{
        padding:0 1.5rem;
        padding-bottom:env(safe-area-inset-bottom, 0px);
}
        .footer .footer__copy{
            flex-direction:column;
            align-items:flex-start;
            gap:0.1rem;
            font-size:0.6rem;
            line-height:1.2;
        }

            :is(.footer .footer__copy) > div{
                flex-direction:row;
                align-items:center;
                flex-wrap:nowrap;
                gap:0.4rem;
            }

        .footer .footer__terms{
            gap:clamp(0.9rem, 1.6vw, 1.5rem);
            font-size:0.85rem;
        }
    }

@media (max-width: 767px){

.footer{
        min-height:0;
        padding:0.55rem 1rem;
        padding-bottom:calc(0.75rem + env(safe-area-inset-bottom, 0px));
}
        .footer .footer__logo{ display:none; }
        .footer .footer__content{
            flex-direction:row;
            align-items:flex-start;
            justify-content:space-between;
            gap:1rem;
        }

        .footer .footer__brand{
            flex-direction:column;
            align-items:flex-start;
            gap:0.4rem;
            padding-right:0;
        }
        .footer .footer__copy{
            flex-direction:column;
            align-items:flex-start;
            gap:0.25rem;
            font-size:0.45rem;
        }

            :is(.footer .footer__copy) > div{
                flex-direction:row;
                align-items:center;
                flex-wrap:nowrap;
                gap:0.35rem;
            }

            :is(.footer .footer__copy) > div:nth-child(2){
                flex-direction:column;
                align-items:flex-start;
                gap:0.1rem;
            }
        .footer .footer__terms{
            flex-direction:column;
            align-items:flex-end;
            gap:0.5rem;
            font-size:0.5rem;
        }

            :is(.footer .footer__terms) p{
                white-space:nowrap;
            }
    }

.coockie-banner{
    position:fixed;
    --banner-edge:1rem;
    --footer-h:3.75rem;
    right:var(--banner-edge);
    bottom:calc(var(--footer-h) + var(--banner-edge));
    z-index:var(--z-consent);
    box-sizing:border-box;
    width:clamp(180px, 42%, 360px);
    padding:1.1rem clamp(1.25rem, 1.5vw, 1.6rem);
    border-radius:0.625rem;
    background-color:#071329;
    border:2px solid #1795fd4b;
    box-shadow:0 0 15px 1px rgba(0, 0, 0, 0.45), 0 12px 32px rgba(0, 0, 0, 0.5), 0 0 22px rgba(29, 195, 255, 0.12), inset 0 1px 0 rgba(29, 195, 255, 0.14);
    backdrop-filter:blur(6px);
    -webkit-backdrop-filter:blur(6px);
    transition:bottom 0.35s ease;
    transform:translateX(120%);
    opacity:0;
}

@media (max-width: 767px){

.coockie-banner{
        right:0.75rem;
        left:0.75rem;
        width:auto;
        bottom:calc(4.5rem + env(safe-area-inset-bottom, 0px));
        padding:1rem 1.1rem;
}
    }

@media (min-width: 768px) and (max-width: 1023px){

.coockie-banner{
        width:clamp(320px, 62%, 560px);
        bottom:4.5rem;
}
    }

.coockie-banner.show{
    animation:coockie-in 0.6s cubic-bezier(0.22, 1, 0.36, 1) 5.25s forwards;
}

.coockie-banner__inner{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:0.7rem;
}

.coockie-banner__inner h3{
        color:var(--color-white-1);
        font-family:var(--font-primary);
        font-size:1rem;
        font-weight:700;
        line-height:1.1;
        margin-bottom:0.5rem;
        text-transform:uppercase;
        letter-spacing:0.02em;
        text-shadow:0 0 3px var(--color-white-1);
        -webkit-user-select:none;
                user-select:none;
    }

@media (max-width: 767px){

.coockie-banner__inner h3{
            font-size:0.9rem;
    }
        }

.coockie-banner__text{
    font-size:0.8rem;
    color:var(--color-grey-1);
    font-family:var(--font-secondary);
    -webkit-user-select:none;
            user-select:none;
    line-height:1.5;
    display:inline;
}

@media (max-width: 767px){

.coockie-banner__text{
        font-size:0.72rem;
}
    }

.coockie-banner__link{
    color:var(--color-blue-3);
    text-decoration:underline;
    text-underline-offset:3px;
    font-weight:600;
    cursor:pointer;
    display:inline;
    transition:color 0.2s ease, text-shadow 0.2s ease;
    font-family:var(--font-secondary);
    margin-left:2px;
}

.coockie-banner__link:hover{
        color:var(--color-blue-1);
    }

.coockie-banner__btn{
    align-self:flex-end;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border:none;
    border-radius:0.625rem;
    cursor:pointer;
    padding:0.55rem 1.55rem;
    background:linear-gradient(180deg, #C020FF 0%, #a660f1d3 100%);
    box-shadow:0 2px 12px rgba(169, 47, 240, 0.45), 0 0 20px rgba(156, 78, 255, 0);
    transition:transform 0.15s ease;
}

.coockie-banner__btn:hover{
        transform:translateY(-1px);
    }

.coockie-banner__btn:active{
        transform:translateY(1px);
    }

.coockie-banner__btn span{
        font-size:0.85rem;
        font-family:var(--font-secondary);
        font-weight:700;
        text-transform:uppercase;
        color:var(--color-white-1);
    }

@media (max-width: 767px){

.coockie-banner__btn span{
            font-size:0.8rem;
    }
        }

.popup-terms-wrap{
  position:fixed;
  inset:0;
  z-index:9995;
  background:rgba(5, 9, 12, 0.78);
  backdrop-filter:blur(4px);
  -webkit-backdrop-filter:blur(4px);
  display:none;
}

.popup-terms-wrap.show{
  display:block;
  animation:popup-fade-in 0.25s ease;
}

.popup-terms{
  position:fixed;
  left:50%;
  top:50%;
  transform:translate(-50%, -50%);
  z-index:9996;
  width:min(74vw, 90vw);
  max-height:80vh;
  overflow:hidden;
  background:radial-gradient(50% 55.69% at 50% 48.98%, #071329 0%, #071329 100%);
  border:2px solid #1795fd4b;
  border-radius:0.52vw;
  box-shadow:0 0 3vw rgba(29, 195, 255, 0.125), 0 0 2vw rgba(29, 195, 255, 0.1);
  cursor:default;
  display:none;
  animation:popup-slide-in 0.3s cubic-bezier(0.22, 1, 0.36, 1);
}

.popup-terms.show{
  display:block;
}

.popup-terms::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:8vw;
  background:linear-gradient(to top, #05090C 0%, rgba(5, 9, 12, 0) 100%);
  pointer-events:none;
  z-index:1;
}

.popup-terms-content{
  max-height:80vh;
  overflow-y:auto;
}

.popup-terms-close{
  position:absolute;
  top:1vw;
  right:1.6vw;
  width:2.2vw;
  height:2.2vw;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(29, 195, 255, 0.1);
  border:1px solid rgba(29, 195, 255, 0.322);
  border-radius:0.26vw;
  color:rgba(255, 255, 255, 0.5);
  cursor:pointer;
  transition:background-color 0.2s, color 0.2s, border-color 0.2s;
  flex-shrink:0;
  z-index:2;
}

.popup-terms-close svg{
  width:0.78vw;
  height:0.78vw;
}

.popup-terms-close:hover{
  background:rgba(29, 195, 255, 0.22);
  border-color:#1795fdc7;
  color:var(--color-white-1);
}

.terms{
  width:100%;
  max-width:70vw;
  margin:0 auto;
  padding:3vw 3vw 5vw;
  color:var(--color-grey-1);
  font-family:var(--font-secondary);
  font-size:1.2vw;
  font-weight:400;
  line-height:1.5;
}

.terms h2{
  color:#1DC3FF;
  text-align:center;
  font-family:var(--font-primary);
  font-size:2.5vw;
  font-weight:700;
  line-height:1;
  text-transform:uppercase;
  letter-spacing:0.04em;
}

.terms h2:after{
  content:"";
  position:relative;
  width:20vw;
  height:1px;
  display:block;
  background:linear-gradient(90deg, transparent 0%, var(--color-blue-3) 50%, transparent 100%);
  border:none;
  margin:1rem auto 2.5rem;
}

.terms h3{
  margin:2rem 0 0.75rem;
  color:#1DC3FF;
  font-family:var(--font-primary);
  font-size:1.8vw;
  font-weight:700;
  line-height:1.2;
  text-transform:uppercase;
  letter-spacing:0.05em;
}

.terms h4{
  margin:1.5rem 0 0.5rem;
  color:#1DC3FF;
  font-family:var(--font-primary);
  font-size:1.2vw;
  font-weight:700;
  line-height:1.2;
}

.terms :is(li, p){
  margin:0.4rem 0;
}

.terms strong{
  font-weight:700;
  color:var(--color-white-1);
}

.terms ol{
  list-style-type:decimal;
  padding-left:2vw;
}

.terms ul{
  list-style-type:disc;
  padding-left:2vw;
}

@media (max-width: 767px){
  .terms{
    font-size:3.73vw;
    padding:8vw 6.4vw 10vw;
    max-width:100%;
  }

  .terms h1{
    font-size:9.6vw;
  }

  .terms h2{
    font-size:7.8vw;
  }

  .terms h3{
    font-size:4.27vw;
  }

  .popup-terms-close{
    width:5.2vw;
    height:5.2vw;
  }

  .popup-terms-close svg{
    width:2.78vw;
    height:2.78vw;
  }
}

.popup-auth{
    position:fixed;
    inset:0;
    z-index:200;
    align-items:center;
    justify-content:center;
    padding:1.5rem;
}

.popup-auth__overlay{
    position:absolute;
    inset:0;
    background:rgba(3, 8, 18, 0.72);
    backdrop-filter:blur(6px);
    -webkit-backdrop-filter:blur(6px);
}

.popup-auth__modal{
    --auth-rgb:23, 151, 253;
    --auth-edge:#1797fd;
    --auth-inset:#1df0ff;
    --auth-bg-rgb:29, 92, 168;
    --auth-base:#0d2345;

    position:relative;
    z-index:1;
    width:min(55rem, 100%);
    aspect-ratio:880 / 420;
    border-radius:0.625rem;
    border:1px solid var(--auth-edge);
    overflow:hidden;
    background:radial-gradient(ellipse 82% 95% at 50% 28%,
            rgba(var(--auth-bg-rgb), 0.62) 0%,
            rgba(var(--auth-bg-rgb), 0.28) 42%,
            rgba(var(--auth-bg-rgb), 0) 74%), url("/images/decor/bg-main-2.avif") center / cover no-repeat, var(--auth-base);
    box-shadow:0 0 150px rgba(var(--auth-rgb), 0.20), 0 0 100px rgba(var(--auth-rgb), 0.25), 0 0 60px rgba(var(--auth-rgb), 0.25), inset 0 0 2px var(--auth-inset), inset 0 0 48px rgba(var(--auth-rgb), 0.22);
    animation:popup-slide-up-auth 0.4s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.popup-auth__modal:has(.popup-auth__content--rifle.show){
    --auth-rgb:23, 151, 253;
    --auth-edge:#1797fd;
    --auth-inset:#1df0ff;
    --auth-bg-rgb:29, 92, 168;
    --auth-base:#0d2345;
}

.popup-auth__modal:has(.popup-auth__content--premium.show){
    --auth-rgb:255, 91, 32;
    --auth-edge:#ff5b20;
    --auth-inset:#ffb820;
    --auth-bg-rgb:168, 78, 38;
    --auth-base:#2a1410;
}

.popup-auth__close{
    position:absolute;
    top:0.85rem;
    right:1.1rem;
    z-index:5;
    display:flex;
    align-items:center;
    justify-content:center;
    width:2rem;
    height:2rem;
    font-family:var(--font-secondary);
    font-size:1.25rem;
    line-height:1;
    color:rgba(255, 255, 255, 0.55);
    text-decoration:none;
    border-radius:50%;
    transition:color 0.2s ease, background-color 0.2s ease;
}

.popup-auth__close:hover{
    color:#fff;
    background:rgba(var(--auth-rgb), 0.25);
}

.popup-auth__content{
    display:none;
}

.popup-auth__content.show{
    display:flex;
    align-items:center;
    width:100%;
    height:100%;
}

.popup-auth__info{
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:1.6rem;
    flex:1 1 50%;
    min-width:0;
    padding:2rem 0 2rem clamp(1.5rem, 3.4vw, 3.7rem);
}

.popup-auth__title{
    margin:0;
    max-width:40rem;
}

.popup-auth__btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:0.75rem;
    width:min(26rem, 100%);
    padding:1.05rem 1.5rem;
    border-radius:0.5rem;
    border:1px solid rgba(var(--auth-rgb), 0.35);
    cursor:pointer;
    background:radial-gradient(ellipse 120% 180% at 50% 0%,
            rgba(var(--auth-rgb), 0.85) 0%,
            rgba(var(--auth-rgb), 0.25) 55%,
            rgba(var(--auth-rgb), 0) 100%), linear-gradient(180deg, rgba(var(--auth-rgb), 0.16), rgba(var(--auth-rgb), 0.06));
    box-shadow:inset 0 0 0 1px rgba(255, 255, 255, 0.06), 0 0 18px rgba(var(--auth-rgb), 0.30);
    transition:transform 0.18s ease, box-shadow 0.22s ease, background-color 0.22s ease, filter 0.22s ease;
    animation:auth-btn-pulse 1.9s ease-in-out infinite;
}

.popup-auth__btn:hover{
    filter:brightness(1.12);
    box-shadow:inset 0 0 0 1px rgba(255, 255, 255, 0.12), 0 0 28px rgba(var(--auth-rgb), 0.55);
}

.popup-auth__btn:active{
    transform:translateY(1px) scale(0.99);
}

.popup-auth__steam-icon{
    width:1.6rem;
    height:1.6rem;
    object-fit:contain;
    flex-shrink:0;
}

.popup-auth__btn .text-popup-btn{
    white-space:nowrap;
}

.popup-auth__case{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    height:100%;
}

.popup-auth__case-stage{
    position:relative;
    width:clamp(17rem, 24vw, 25rem);
    aspect-ratio:1233 / 1290;
}

.popup-auth__content--rifle .popup-auth__case-stage{
    transform:scaleX(-1);
}

.popup-auth__case-stage::after{
    content:"";
    position:absolute;
    left:50%;
    bottom:14%;
    width:80%;
    height:14%;
    transform:translateX(-50%);
    border-radius:50%;
    filter:blur(13px);
    z-index:-2;
    pointer-events:none;
    background:radial-gradient(ellipse at center,
            rgba(var(--auth-rgb), 0.6) 0%,
            rgba(var(--auth-rgb), 0.28) 45%,
            rgba(var(--auth-rgb), 0) 75%);
}

.popup-auth__case-img{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:contain;
    pointer-events:none;
}

.popup-auth__case-img--smoke{
    inset:auto;
    left:50%;
    top:50%;
    width:120%;
    height:120%;
    transform:translate(-50%, -50%);
    opacity:0.55;
    mix-blend-mode:screen;
    animation:case-smoke-breathe 4.5s ease-in-out infinite;
    will-change:opacity, transform;
}

.popup-auth__case-img--light{
    z-index:-1;
    opacity:0.85;
    transform:translateY(3%);
    mix-blend-mode:screen;
    animation:case-light-pulse 4.2s ease-in-out infinite;
    will-change:opacity, transform;
}

.popup-auth__case-img--opened{
    animation:case-breathe 3.8s ease-in-out infinite;
}

.popup-auth__content--rifle .popup-auth__case-img--opened{
    filter:drop-shadow(0 0 14px rgba(29, 195, 255, 0.85)) drop-shadow(0 0 32px rgba(23, 151, 253, 0.5));
}

.popup-auth__content--premium .popup-auth__case-img--opened{
    filter:drop-shadow(0 0 14px rgba(255, 138, 32, 0.85)) drop-shadow(0 0 32px rgba(255, 91, 32, 0.5));
}

@media (max-width: 767px){
    .popup-auth__modal{
        width:min(28rem, 100%);
        aspect-ratio:auto;
    }

    .popup-auth__content.show{
        flex-direction:column-reverse;
        padding:1.25rem 1.25rem 1.75rem;
    }

    .popup-auth__info{
        flex:0 0 auto;
        align-items:center;
        text-align:center;
        gap:1.1rem;
        padding:0;
        margin-top:-10px !important;
    }

    .popup-auth__title{
        width:auto;
        font-size:1.5rem;
        padding-left:40px;
        padding-right:40px;
    }

    .popup-auth__case{
        flex:0 0 auto;
        height:auto;
        margin-bottom:0;
    }

    .popup-auth__case-stage{
        width:clamp(13rem, 55vw, 18rem);
    }

    .popup-auth__btn{
        width:92%;
    }
        .popup-auth__btn img{
            width:1.1rem;
            height:1.1rem;
        }
        .popup-auth__btn span{
            font-size:0.9rem;
        }
}

.popup-email-push-wrap{
   position:fixed;
   inset:0;
   z-index:9995;
   background:rgba(3, 8, 18, 0.74);
   backdrop-filter:blur(5px);
   -webkit-backdrop-filter:blur(5px);
   display:none;
}

.popup-email-push-wrap.show{
   display:block;
   animation:popup-fade-in 0.25s ease;
}

.popup-sub{
   --pp-rgb:23, 151, 253;
   --pp-primary:#1797fd;
   --pp-secondary:#1df0ff;
   --pp-base:#0d2345;

   position:fixed;
   left:50%;
   top:50%;
   transform:translate(-50%, -50%);
   z-index:9996;
   box-sizing:border-box;
   width:min(28rem, 92vw);
   padding:clamp(1.75rem, 2.4vw, 2.5rem) clamp(1.5rem, 2vw, 2.1rem);
   border-radius:0.75rem;
   border:1px solid var(--pp-primary);
   overflow:hidden;
   background:radial-gradient(ellipse 90% 80% at 50% 0%,
         rgba(var(--pp-rgb), 0.28) 0%,
         rgba(var(--pp-rgb), 0) 65%), url("/images/decor/bg-main-2.avif") center / cover no-repeat, var(--pp-base);
   box-shadow:0 0 120px rgba(var(--pp-rgb), 0.18), 0 0 60px rgba(var(--pp-rgb), 0.30), 0 20px 50px rgba(0, 0, 0, 0.55), inset 0 0 2px var(--pp-secondary), inset 0 0 40px rgba(var(--pp-rgb), 0.18);
   cursor:default;
   flex-direction:column;
}

.popup-sub.show{
   animation:popup-slide-in 0.35s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.main:has(.activate-screen .item--premium.show) .popup-sub{
   --pp-rgb:255, 91, 32;
   --pp-primary:#ff5b20;
   --pp-secondary:#ffb820;
   --pp-base:#2a1410;
}

.popup-sub__close{
   position:absolute;
   top:0.85rem;
   right:0.85rem;
   z-index:2;
   display:flex;
   align-items:center;
   justify-content:center;
   width:2rem;
   height:2rem;
   border-radius:0.45rem;
   color:rgba(255, 255, 255, 0.55);
   background:rgba(var(--pp-rgb), 0.12);
   border:1px solid rgba(var(--pp-rgb), 0.4);
   cursor:pointer;
   transition:background-color 0.2s, color 0.2s, border-color 0.2s;
}

.popup-sub__close:hover{
   color:#fff;
   background:rgba(var(--pp-rgb), 0.28);
   border-color:var(--pp-primary);
}

.popup-sub__close svg{
   width:0.85rem;
   height:0.85rem;
}

.popup-sub__content{
   display:flex;
   flex-direction:column;
   align-items:center;
   text-align:center;
   gap:0.9rem;
}

.popup-sub__icon{
   display:inline-flex;
   align-items:center;
   justify-content:center;
   width:clamp(5rem, 6vw, 6.5rem);
   height:clamp(5rem, 6vw, 6.5rem);
   border-radius:50%;
   color:var(--pp-secondary);
   background:rgba(var(--pp-rgb), 0.18);
   border:1px solid rgba(var(--pp-rgb), 0.55);
   box-shadow:0 0 16px rgba(var(--pp-rgb), 0.4);
   filter:brightness(1.2);
}

.popup-sub__icon svg{
   width:52%;
   height:52%;
}

.popup-sub__title{
   margin:0;
   font-family:var(--font-primary);
   font-weight:700;
   font-size:clamp(1.35rem, 0.6vw + 1.15rem, 1.85rem);
   line-height:1.1;
   text-transform:uppercase;
   letter-spacing:0.02em;
   color:var(--color-white-1);
   text-shadow:0 0 14px rgba(var(--pp-rgb), 0.45);
}

.popup-sub__text{
   margin:0;
   font-family:var(--font-secondary);
   font-weight:500;
   font-size:clamp(0.9rem, 0.3vw + 0.82rem, 1.05rem);
   line-height:1.5;
   color:rgba(255, 255, 255, 0.75);
}

.popup-sub__text span{
   color:var(--pp-secondary);
   font-weight:700;
}

.popup-sub__form{
   display:flex;
   flex-direction:column;
   gap:0.75rem;
   width:100%;
   margin-top:0.25rem;
}

.popup-sub__input{
   width:100%;
   box-sizing:border-box;
   padding:0.85rem 1.1rem;
   border-radius:0.6rem;
   background:rgba(3, 8, 18, 0.55);
   border:1px solid rgba(var(--pp-rgb), 0.4);
   color:var(--color-white-1);
   font-family:var(--font-secondary);
   font-size:clamp(0.9rem, 0.3vw + 0.82rem, 1rem);
   outline:none;
   transition:border-color 0.2s, box-shadow 0.2s;
}

.popup-sub__input::placeholder{ color:rgba(255, 255, 255, 0.4); }

.popup-sub__input:focus{
   border-color:var(--pp-primary);
   box-shadow:0 0 0 3px rgba(var(--pp-rgb), 0.16);
}

.popup-sub__submit{
   width:100%;
   display:inline-flex;
   align-items:center;
   justify-content:center;
   padding:0.9rem 1.5rem;
   border-radius:0.6rem;
   border:1px solid rgba(var(--pp-rgb), 0.5);
   cursor:pointer;
   background:radial-gradient(140% 220% at 50% 100%,
      rgba(var(--pp-rgb), 0.9) 0%,
      rgba(var(--pp-rgb), 0.15) 70%);
   box-shadow:inset 0 0 0 1px rgba(255, 255, 255, 0.06), 0 0 18px rgba(var(--pp-rgb), 0.3);
   transition:background 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease, transform 0.15s ease, filter 0.2s ease;
}

.popup-sub__submit:hover{
   filter:brightness(1.1);
   border-color:var(--pp-primary);
   background:radial-gradient(120% 200% at 50% 100%, var(--pp-secondary) 0%, var(--pp-primary) 100%);
   box-shadow:0 0 22px rgba(var(--pp-rgb), 0.55), inset 0 0 2px var(--pp-secondary);
}

.popup-sub__submit:active{ transform:scale(0.98); }

.popup-sub__submit span{
   font-family:var(--font-secondary);
   font-weight:700;
   font-size:clamp(0.9rem, 0.3vw + 0.82rem, 1.05rem);
   text-transform:uppercase;
   letter-spacing:0.02em;
   color:var(--color-white-1);
   text-shadow:0 0 2px rgba(0, 0, 0, 0.4);
}

.popup-sub__form.is-invalid .popup-sub__submit{
   opacity:0.45;
   pointer-events:none;
}

.popup-sub__text--sent{ display:none; }

.popup-sub--mail.sent .popup-sub__text--form,
.popup-sub--mail.sent .popup-sub__form{
   display:none;
}

.popup-sub--mail.sent .popup-sub__text--sent{
   display:block;
   animation:popup-fade-in 0.3s ease both;
}

@media (max-width: 767px){
   .popup-sub{
      width:min(26rem, 94vw);
      max-height:90vh;
      overflow-y:auto;
      padding:1.6rem 1.3rem;
   }

   .popup-sub__icon{ width:4.5rem; height:4.5rem; }
}

.preview-screen{
    position:relative;
    box-sizing:border-box;
    width:100%;
    height:100%;
    overflow:hidden;
}

.preview-screen.show{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:clamp(1.4rem, 3.6vh, 3.25rem);
    padding:0 clamp(1.5rem, 3vw, 4rem) 3.75rem;
}

.preview-screen__head,
.preview-screen__cases,
.preview-screen__hint,
.preview-screen__cards{
    position:relative;
    z-index:1;
}

.preview-screen__connector{
    display:inline-flex;
    align-items:center;
    flex:0 0 auto;
    opacity:0;
    position:absolute;
    z-index:5;
}

.preview-screen__hex{
    position:static;
    flex:0 0 auto;
    height:auto;
    pointer-events:none;
}

.preview-screen__hex--left{
    width:26px;
    position:absolute;
    top:-13px;
    left:0;
}

.preview-screen__hex--right{
    width:1.5rem;
    position:absolute;
    right:-6px;
    top:13px;
}

.preview-screen__hex--zigzag{
    width:290px;
    opacity:1;
}

.preview-screen__head{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:180px;
    flex-shrink:0;
}

.preview-screen__title{
    margin:0;
    text-align:left;
    line-height:1.05;
    white-space:nowrap;
    opacity:0;
}

.preview-screen__awesome{
    position:relative;
    display:inline-block;
}

.preview-screen__choose{
    position:relative;
    display:flex;
    align-items:center;
    flex-shrink:0;
    opacity:0;
}

.preview-screen__choose-badge{
    position:relative;
    isolation:isolate;
    display:flex;
    align-items:center;
    padding:clamp(0.5rem, 0.9vw, 0.95rem) clamp(1.25rem, 2vw, 2.25rem);
}

.preview-screen__choose-badge::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:-2;
    background:linear-gradient(90deg,
            #C020FF 0%,
            #9b4bf2 20%,
            rgba(155, 75, 242, 0.15) 100%);
    clip-path:polygon(
        1rem 0, calc(100% - 1rem) 0,
        100% 1rem, 100% calc(100% - 1rem),
        calc(100% - 1rem) 100%, 1rem 100%,
        0 calc(100% - 1rem), 0 1rem);
}

.preview-screen__choose-badge::after{
    content:"";
    position:absolute;
    inset:1.5px;
    z-index:-1;
    background:linear-gradient(90deg,
            #C020FF 0%,
            #7e2fe0 20%,
            rgba(120, 45, 220, 0.15) 75%,
            rgba(120, 45, 220, 0) 100%);
    clip-path:polygon(
        1rem 0, calc(100% - 1rem) 0,
        100% 1rem, 100% calc(100% - 1rem),
        calc(100% - 1rem) 100%, 1rem 100%,
        0 calc(100% - 1rem), 0 1rem);
}

.preview-screen__choose-text{
    margin:0;
    text-align:left;
    line-height:1.1;
    white-space:nowrap;
}

.preview-screen__cases{
    display:flex;
    justify-content:center;
    align-items:stretch;
    gap:clamp(1rem, 2.4vw, 2.5rem);
    flex-shrink:0;
}

.preview-case{
    position:relative;
    flex-shrink:0;
    transition:filter 0.4s ease;
    pointer-events:none;
}

.preview-screen.show .preview-case{
    animation:preview-case-unlock 0.001s linear 3.5s forwards;
}

.preview-case__card{
    position:relative;
    width:clamp(17rem, 21.4vw, 25.7rem);
    aspect-ratio:411 / 438;
    border-radius:0.625rem;
    overflow:hidden;
    opacity:0;
    transition:box-shadow 0.4s ease, border-color 0.4s ease;
}

.preview-case--rifle .preview-case__card{
    border:2px solid rgba(29, 195, 255, 0.3);
    background:radial-gradient(ellipse 72% 58% at 50% 100%,
            rgba(20, 61, 110, 1) 0%,
            rgba(21, 84, 146, 0.75) 25%,
            rgba(22, 106, 182, 0.5) 50%,
            rgba(23, 151, 253, 0) 100%), #0f2b53;
}

.preview-case--premium .preview-case__card{
    border:2px solid rgba(255, 138, 32, 0.3);
    background:radial-gradient(ellipse 72% 58% at 50% 100%,
            rgba(146, 64, 39, 1) 0%,
            rgba(146, 64, 39, 0.5) 45%,
            rgba(146, 64, 39, 0) 100%), #462223;
}

.preview-case--rifle:hover .preview-case__card,
.preview-case--rifle:focus-within .preview-case__card{
    border-color:rgba(29, 195, 255, 0.85);
    box-shadow:0 0 32px rgba(29, 195, 255, 0.35);
}

.preview-case--premium:hover .preview-case__card,
.preview-case--premium:focus-within .preview-case__card{
    border-color:rgba(255, 138, 32, 0.9);
    box-shadow:0 0 32px rgba(255, 138, 32, 0.35);
}

.preview-case__badges{
    position:absolute;
    top:clamp(1.5rem, 1.7vw, 2rem);
    left:50%;
    transform:translateX(-50%);
    display:flex;
    align-items:stretch;
    gap:0.3125rem;
    white-space:nowrap;
    z-index:3;
    transition:opacity 0.2s ease, transform 0.3s ease;
}

.preview-case:hover .preview-case__badges,
.preview-case:focus-within .preview-case__badges{
    transform:translateX(-50%) translateY(-12px);
}

.preview-case__pill{
    display:inline-flex;
    align-items:center;
    gap:0.3125rem;
    padding:0.75rem 1rem;
    border-radius:0.3125rem;
    border:1px solid transparent;
}

.preview-case--rifle .preview-case__pill--openings{
    border-color:#1797fd;
    background:radial-gradient(120% 200% at 0% 50%,
            rgba(23, 151, 253, 0.7) 0%,
            rgba(23, 151, 253, 0) 40%), #143b6a;
}

.preview-case--premium .preview-case__pill--openings{
    border-color:#ff5b20;
    background:radial-gradient(120% 200% at 0% 50%,
            rgba(255, 91, 32, 0.7) 0%,
            rgba(255, 91, 32, 0) 40%), #6a2114;
}

.preview-case__pill-icon{
    width:1.15rem;
    height:1.15rem;
    flex-shrink:0;
}

.preview-case__pill-text{
    display:inline-flex;
    align-items:center;
}

.preview-case__pill-sep{
    margin:0 0.375rem;
    opacity:0.6;
}

.preview-case__pill-value{
    color:var(--color-white-1);
}

.preview-case__pill--name{
    color:var(--color-white-1);
    font-family:var(--font-secondary);
    font-weight:500;
    font-size:clamp(0.875rem, 0.26vw + 0.8rem, 1.125rem);
}

.preview-case__pill--name-rifle{
    border-color:rgba(23, 151, 253, 0.2);
    background:linear-gradient(to top,
            #1df0ff 0%,
            #1ac3fe 20%,
            #1797fd 50%);
}

.preview-case__pill--name-premium{
    border-color:rgba(255, 184, 32, 0.2);
    background:linear-gradient(to top,
            #ffb820 0%,
            #ff8820 20%,
            #ff5b20 50%);
}

.preview-case__stage{
    position:absolute;
    left:50%;
    top:52%;
    transform:translate(-50%, -50%);
    width:99%;
    aspect-ratio:1233 / 1290;
    z-index:1;
    transition:transform 0.45s ease;
}

.preview-case:hover .preview-case__stage,
.preview-case:focus-within .preview-case__stage{
    transform:translate(-50%, -52%);
}

.preview-case__stage::after{
    content:"";
    position:absolute;
    left:50%;
    bottom:18%;
    width:90%;
    height:15%;
    transform:translateX(-50%);
    border-radius:50%;
    filter:blur(13px);
    z-index:-1;
    pointer-events:none;
}

.preview-case--rifle .preview-case__stage::after{
    background:radial-gradient(ellipse at center,
            rgba(29, 195, 255, 0.6) 0%,
            rgba(23, 151, 253, 1) 45%,
            rgba(23, 151, 253, 0) 75%);
}

.preview-case--premium .preview-case__stage::after{
    background:radial-gradient(ellipse at center,
            rgba(255, 138, 32, 0.6) 0%,
            rgba(255, 91, 32, 0.9) 45%,
            rgba(255, 91, 32, 0) 75%);
}

.preview-case__img{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:contain;
    pointer-events:none;
}

.preview-case__img--closed{
    opacity:1;
    transition:opacity 0.45s ease;
}

.preview-case__stage::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:2;
    pointer-events:none;
    opacity:0;
    mix-blend-mode:screen;
    background:linear-gradient(to top,
            rgba(255, 255, 255, 0) 42%,
            rgba(255, 255, 255, 0.65) 50%,
            rgba(255, 255, 255, 0) 58%);
    background-size:100% 260%;
    background-repeat:no-repeat;
    -webkit-mask-size:contain;
    mask-size:contain;
    -webkit-mask-position:center;
    mask-position:center;
    -webkit-mask-repeat:no-repeat;
    mask-repeat:no-repeat;
    animation:case-shimmer 5s ease-in-out infinite;
}

.preview-case--rifle .preview-case__stage::before{
    -webkit-mask-image:url("/images/cases/rifle/case-closed.avif");
    mask-image:url("/images/cases/rifle/case-closed.avif");
}

.preview-case--premium .preview-case__stage::before{
    -webkit-mask-image:url("/images/cases/premium/case-closed.avif");
    mask-image:url("/images/cases/premium/case-closed.avif");
    animation-delay:2.5s;
}

.preview-case:hover .preview-case__stage::before,
.preview-case:focus-within .preview-case__stage::before{
    animation:none;
    opacity:0;
}

.preview-case__img--smoke{
    inset:auto;
    left:50%;
    top:52%;
    width:120%;
    height:120%;
    transform:translate(-50%, -50%);
    opacity:0.6;
    mix-blend-mode:screen;
    animation:case-smoke-breathe 4.5s ease-in-out infinite;
    will-change:opacity, transform;
}

.preview-case--premium .preview-case__img--smoke{
    animation-delay:1.1s;
}

.preview-case__img--opened{
    opacity:0;
    transition:opacity 0.45s ease;
}

.preview-case__img--light{
    z-index:-1;
    opacity:0;
    transform:translateY(3%);
    mix-blend-mode:screen;
    transition:opacity 0.45s ease;
    will-change:opacity, transform;
}

.preview-case:hover .preview-case__img--closed,
.preview-case:focus-within .preview-case__img--closed{
    opacity:0;
}

.preview-case:hover .preview-case__img--opened,
.preview-case:focus-within .preview-case__img--opened{
    opacity:1;
    animation:case-breathe 3.8s ease-in-out infinite;
}

.preview-case--rifle:hover .preview-case__img--opened,
.preview-case--rifle:focus-within .preview-case__img--opened{
    filter:drop-shadow(0 0 14px rgba(29, 195, 255, 0.85)) drop-shadow(0 0 32px rgba(23, 151, 253, 0.5));
}

.preview-case--premium:hover .preview-case__img--opened,
.preview-case--premium:focus-within .preview-case__img--opened{
    filter:drop-shadow(0 0 14px rgba(255, 138, 32, 0.85)) drop-shadow(0 0 32px rgba(255, 91, 32, 0.5));
}

.preview-case:hover .preview-case__img--light,
.preview-case:focus-within .preview-case__img--light{
    opacity:0.85;
    animation:case-light-pulse 4.2s ease-in-out infinite;
}

.preview-case__btn-wrap{
    position:absolute;
    left:0;
    right:0;
    bottom:clamp(-0.4rem, -0.6vw, -0.25rem);
    display:flex;
    justify-content:center;
    z-index:4;
}

.preview-case__btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:clamp(9rem, 11.4vw, 13.7rem);
    padding:clamp(0.6rem, 0.9vw, 1rem) clamp(2rem, 3vw, 3.5rem);
    --open-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40' preserveAspectRatio='none'%3E%3Cpath d='M0 40 L8 7 Q10 0 17 0 L83 0 Q90 0 92 7 L100 40 Z' fill='%23000'/%3E%3C/svg%3E");
    -webkit-mask:var(--open-mask) center / 100% 100% no-repeat;
    mask:var(--open-mask) center / 100% 100% no-repeat;
    transition:filter 0.3s ease, transform 0.3s ease;
}

.preview-case__btn .text-btn{
    position:relative;
    line-height:1;
}

.preview-case__btn--rifle{
    background:linear-gradient(180deg, var(--color-blue-1) 0%, var(--color-blue-3) 100%);
}

.preview-case__btn--premium{
    background:linear-gradient(180deg, var(--color-orange-1) 0%, var(--color-orange-2) 100%);
}

.preview-case__btn:hover{
    transform:translateY(-0.25rem) scale(1.085);
}

.preview-case__btn--rifle:hover,
.preview-case--rifle:hover .preview-case__btn--rifle,
.preview-case--rifle:focus-within .preview-case__btn--rifle{
    filter:brightness(1.12) saturate(1.12) drop-shadow(0 0 6px rgba(255, 255, 255, 0.7)) drop-shadow(0 0 10px rgba(29, 195, 255, 0.75)) drop-shadow(0 0.25rem 8px rgba(23, 151, 253, 0.5));
}

.preview-case__btn--premium:hover,
.preview-case--premium:hover .preview-case__btn--premium,
.preview-case--premium:focus-within .preview-case__btn--premium{
    filter:brightness(1.12) saturate(1.12) drop-shadow(0 0 6px rgba(255, 255, 255, 0.7)) drop-shadow(0 0 10px rgba(255, 138, 32, 0.75)) drop-shadow(0 0.25rem 8px rgba(255, 91, 32, 0.5));
}

.preview-case__btn:active{
    transform:scale(0.93);
    filter:brightness(0.9);
    transition:transform 0.08s ease, filter 0.08s ease;
}

.preview-case__items{
    position:absolute;
    top:50%;
    display:flex;
    flex-direction:column;
    gap:clamp(0.6rem, 1vw, 1.1rem);
    z-index:5;
    pointer-events:none;
}

.preview-case--rifle .preview-case__items{
    right:calc(100% + clamp(0.5rem, 1vw, 1.25rem));
    transform:translateY(-50%);
}

.preview-case--premium .preview-case__items{
    left:calc(100% + clamp(0.5rem, 1vw, 1.25rem));
    transform:translateY(-50%);
}

.preview-item{
    position:relative;
    isolation:isolate;
    display:flex;
    align-items:center;
    width:clamp(22rem, 17vw, 25rem);
    aspect-ratio:328 / 124;
    padding:2px;
    opacity:0;
    -webkit-user-select:none;
            user-select:none;
    transition:opacity 0.25s ease, transform 0.3s ease;
    clip-path:polygon(
        0.9rem 0, calc(100% - 0.9rem) 0,
        100% 0.9rem, 100% calc(100% - 0.9rem),
        calc(100% - 0.9rem) 100%, 0.9rem 100%,
        0 calc(100% - 0.9rem), 0 0.9rem);
}

.preview-item--rifle{ transform:translateX(-1rem); }

.preview-item--premium{ transform:translateX(1rem); }

.preview-item::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:-2;
    clip-path:polygon(
        0.9rem 0, calc(100% - 0.9rem) 0,
        100% 0.9rem, 100% calc(100% - 0.9rem),
        calc(100% - 0.9rem) 100%, 0.9rem 100%,
        0 calc(100% - 0.9rem), 0 0.9rem);
}

.preview-item--rifle::before{ background:rgba(120, 200, 255, 0.45); }

.preview-item--premium::before{ background:rgba(255, 175, 90, 0.45); }

.preview-item::after{
    content:"";
    position:absolute;
    inset:2px;
    z-index:-1;
    clip-path:polygon(
        0.9rem 0, calc(100% - 0.9rem) 0,
        100% 0.9rem, 100% calc(100% - 0.9rem),
        calc(100% - 0.9rem) 100%, 0.9rem 100%,
        0 calc(100% - 0.9rem), 0 0.9rem);
}

.preview-item--rifle::after{
    background:linear-gradient(105deg,
            rgba(29, 150, 230, 0.9) 0%,
            rgba(20, 60, 110, 0.95) 55%,
            rgba(15, 40, 75, 0.95) 100%);
}

.preview-item--premium::after{
    background:linear-gradient(105deg,
            rgba(214, 110, 35, 0.9) 0%,
            rgba(120, 55, 25, 0.95) 55%,
            rgba(74, 36, 18, 0.95) 100%);
}

.preview-item__media{
    position:relative;
    flex:0 0 50%;
    align-self:stretch;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    clip-path:polygon(
        0 0, calc(100% - 0.9rem) 0,
        100% 0.9rem, 100% calc(100% - 0.9rem),
        calc(100% - 0.9rem) 100%, 0 100%);
}

.preview-item--rifle .preview-item__media{
    background:linear-gradient(90deg, rgba(23, 151, 253, 0.2) 0%, rgba(23, 151, 253, 1) 50%, rgba(23, 151, 253, 0.2) 100%), linear-gradient(180deg, #1797fd 0%, #1df0ff 100%);
}

.preview-item--premium .preview-item__media{
    background:linear-gradient(90deg, rgba(255, 91, 32, 0.2) 0%, rgba(255, 91, 32, 1) 50%, rgba(255, 91, 32, 0.2) 100%), linear-gradient(180deg, #ff5b20 0%, #ffb820 100%);
}

.preview-item__deco{
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%, -50%);
    pointer-events:none;
    filter:brightness(0) invert(1);
}

.preview-item__deco--back{
    width:56%;
    opacity:1;
}

.preview-item__deco--front{
    width:36%;
    opacity:0.65;
}

.preview-item__img{
    position:relative;
    z-index:1;
    width:94%;
    height:auto;
    aspect-ratio:149 / 112;
    object-fit:contain;
}

.preview-item--rifle .preview-item__img{
    filter:drop-shadow(0 0 4px rgba(23, 151, 253, 0.8)) drop-shadow(0 0 8px rgba(23, 151, 253, 0.4)) drop-shadow(0 0 12px rgba(23, 151, 253, 0.2));
}

.preview-item--premium .preview-item__img{
    filter:drop-shadow(0 0 4px rgba(255, 138, 32, 0.8)) drop-shadow(0 0 8px rgba(255, 138, 32, 0.4)) drop-shadow(0 0 12px rgba(255, 138, 32, 0.2));
}

.preview-item__info{
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:0.875rem;
    min-width:0;
    flex:1;
    padding:0 1rem;
    font-family:var(--font-secondary);
}

.preview-item__name,
.preview-item__exterior{
    display:inline-flex;
    align-items:center;
    gap:0.25rem;
    white-space:nowrap;
    font-size:1.125rem;
    font-weight:500;
    line-height:1.2;
}

.preview-item__name{
    color:var(--color-white-1);
    font-weight:500;
}

.preview-item--rifle .preview-item__exterior{
    color:var(--color-blue-1);
}

.preview-item--premium .preview-item__exterior{
    color:var(--color-orange-1);
}

.preview-item__icon{
    width:1.125rem;
    height:1.125rem;
    flex-shrink:0;
    margin-right:2px;
}

.preview-case:hover .preview-case__items,
.preview-case:focus-within .preview-case__items{
    pointer-events:auto;
}

.preview-case:hover .preview-item,
.preview-case:focus-within .preview-item{
    opacity:1;
    transform:translateX(0);
}

.preview-case:hover .preview-item:nth-child(1),
.preview-case:focus-within .preview-item:nth-child(1){
    transition:opacity 0.25s ease 0.05s, transform 0.3s ease 0.05s;
}

.preview-case:hover .preview-item:nth-child(2),
.preview-case:focus-within .preview-item:nth-child(2){
    transition:opacity 0.25s ease 0.15s, transform 0.3s ease 0.15s;
}

.preview-case:hover .preview-item:nth-child(3),
.preview-case:focus-within .preview-item:nth-child(3){
    transition:opacity 0.25s ease 0.25s, transform 0.3s ease 0.25s;
}

.preview-screen__cases:has(.preview-case--rifle:hover) .preview-case--premium,
.preview-screen__cases:has(.preview-case--rifle:focus-within) .preview-case--premium,
.preview-screen__cases:has(.preview-case--premium:hover) .preview-case--rifle,
.preview-screen__cases:has(.preview-case--premium:focus-within) .preview-case--rifle{
    filter:brightness(0.5) saturate(0.7);
}

.preview-screen__hint{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:0.5rem;
    flex-shrink:0;
    white-space:nowrap;
    opacity:0;
}

.preview-screen__hint-icon{
    width:1.25rem;
    height:1.25rem;
    flex-shrink:0;
}

.preview-screen__cards{
    display:flex;
    align-items:stretch;
    justify-content:center;
    gap:clamp(7rem, 3.5vw, 9rem);
    flex-shrink:0;
}

.preview-screen__info-card{
    position:relative;
    isolation:isolate;
    display:inline-flex;
    align-items:center;
    gap:0.625rem;
    min-height:4.9rem;
    padding:0.5rem 1.5rem 0.5rem 2.25rem;
    max-width:24rem;
    opacity:0;
}

.preview-screen__info-card::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:-2;
    background:rgba(120, 200, 255, 0.55);
    clip-path:polygon(
        1.2rem 0, calc(100% - 1.2rem) 0,
        100% 1.2rem, 100% calc(100% - 1.2rem),
        calc(100% - 1.2rem) 100%, 1.2rem 100%,
        0 calc(100% - 1.2rem), 0 1.2rem);
}

.preview-screen__info-card::after{
    content:"";
    position:absolute;
    inset:1px;
    z-index:-1;
    background:linear-gradient(105deg,
            rgba(33, 118, 196, 0.9) 0%,
            rgba(20, 45, 78, 0.92) 55%,
            rgba(16, 32, 58, 0.92) 100%);
    box-shadow:inset 0 1px 0 rgba(180, 225, 255, 0.2);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
    clip-path:polygon(
        1.2rem 0, calc(100% - 1.2rem) 0,
        100% 1.2rem, 100% calc(100% - 1.2rem),
        calc(100% - 1.2rem) 100%, 1.2rem 100%,
        0 calc(100% - 1.2rem), 0 1.2rem);
}

.preview-screen__info-icon{
    width:4.3rem;
    height:4.3rem;
    flex-shrink:0;
    position:relative;
    z-index:1;
    margin-left:-4.4rem;
    filter:drop-shadow(0 0 10px rgba(29, 195, 255, 0.55));
}

.preview-screen__info-card p{
    margin:0;
}

.preview-screen.show .preview-case--rifle .preview-case__card{
    animation:preview-case-in-left 1.7s cubic-bezier(0.22, 0.61, 0.36, 1) 1.8s forwards;
}

.preview-screen.show .preview-case--premium .preview-case__card{
    animation:preview-case-in-right 1.7s cubic-bezier(0.22, 0.61, 0.36, 1) 1.8s forwards;
}

.preview-screen.show .preview-screen__title{
    animation:preview-fade-down 1.1s ease-out 1.8s forwards;
}

.preview-screen.show .preview-screen__connector,
.preview-screen.show .preview-screen__choose{
    animation:preview-slide-right 1s cubic-bezier(0.22, 0.61, 0.36, 1) 4.2s forwards;
}

.preview-screen.show .preview-screen__info-card{
    animation:preview-fade-up 0.6s ease-out forwards;
}

.preview-screen.show .preview-screen__info-card:nth-child(1){ animation-delay:2.9s; }

.preview-screen.show .preview-screen__info-card:nth-child(2){ animation-delay:3.25s; }

.preview-screen.show .preview-screen__info-card:nth-child(3){ animation-delay:3.6s; }

.preview-screen.show .preview-screen__hint{
    animation:preview-fade-in 1.4s ease-out 2.9s forwards;
}

.preview-case__items{
    visibility:hidden;
}

.preview-screen.show .preview-case__items{
    animation:preview-unlock 0.001s linear 3.6s forwards;
}

.preview-screen.show .preview-case.chosen .preview-case__card{
    animation:case-chosen 0.9s ease forwards;
}

.preview-screen.leaving .preview-screen__head,
.preview-screen.leaving .preview-screen__cases,
.preview-screen.leaving .preview-screen__hint,
.preview-screen.leaving .preview-screen__cards{
    animation:preview-leave 0.8s ease 0.85s both;
}

.preview-exit-timer{
    position:absolute;
    width:1px;
    height:1px;
    opacity:0;
    pointer-events:none;
}

.preview-exit-timer.run{
    animation:exit-timer 1.7s linear forwards;
}

@media (min-width: 1024px) and (max-width: 1919px){
    .preview-screen.show{ gap:clamp(1.1rem, 2.8vh, 2.4rem); }
    .preview-screen__head{ gap:clamp(5rem, 8vw, 9rem); }
    .preview-screen__title{ font-size:clamp(2.2rem, 2.5vw, 3rem); }
    .preview-screen__choose-text{ font-size:clamp(1.5rem, 1.7vw, 2rem); }
    .preview-screen__choose-badge{ padding:0.55rem 1.5rem; }
    .preview-case__badges{ top:clamp(1rem, 1.3vw, 1.6rem); }
    .preview-case__pill{ padding:0.5rem 0.8rem; }
    .preview-case__pill-icon{ width:1rem; height:1rem; }
    .preview-case__pill--name{ font-size:clamp(0.8rem, 0.85vw, 1rem); }
    .preview-case__pill--openings .text-openings-1,
    .preview-case__pill--openings .text-openings-2{ font-size:clamp(0.8rem, 0.85vw, 1rem); }
    .preview-item{ width:clamp(17.5rem, 17.5vw, 22rem); }
    .preview-item__info{ padding:0 0.7rem; gap:0.55rem; }
    .preview-item__name,
    .preview-item__exterior{ font-size:clamp(0.85rem, 0.85vw, 1rem); }
    .preview-screen__hex--zigzag{ width:200px; }
    .preview-screen__hex--left{ width:18px; top:-9px; }
    .preview-screen__hex--right{ width:1.05rem; top:9px; right:6px; }
    .preview-screen__cards{gap:5rem}
    .preview-screen__info-card{ min-height:4rem; padding:0.4rem 1.25rem 0.4rem 1.9rem; }
    .preview-screen__info-icon{ width:3.5rem; height:3.5rem; margin-left:-3.6rem; }
    .preview-screen__info-card p{ font-size:clamp(0.8rem, 0.8vw, 1rem); }
}

@media (min-width: 768px) and (max-width: 1023px){
    .preview-screen.show{
        justify-content:flex-start;
        gap:clamp(1rem, 2.4vh, 1.9rem);
        padding-top:clamp(1rem, 2.5vh, 2rem);
        overflow-y:auto;
    }
    .preview-screen.show .preview-screen__head{ margin-top:auto; }
    .preview-screen.show .preview-screen__cards{ margin-bottom:auto; }
    .preview-screen__head{ flex-direction:row; gap:clamp(3.25rem, 8.5vw, 5.5rem); }
    .preview-screen__title{ white-space:nowrap; text-align:left; font-size:clamp(1.75rem, 4vw, 2.7rem); }
    .preview-screen__choose-text{ font-size:clamp(1.2rem, 2.7vw, 1.8rem); }
    .preview-screen__choose-badge{ padding:0.5rem 1.25rem; }
    .preview-screen__connector{ display:inline-flex; }
    .preview-screen__hex--zigzag{ width:clamp(102px, 15vw, 158px); opacity:1; }
    .preview-screen__hex--left{ width:9px; top:-5px; }
    .preview-screen__hex--right{ width:0.55rem; top:5px; right:2px; }
    .preview-screen__cases{ flex-direction:row; gap:clamp(1.1rem, 3vw, 2.25rem); }
    .preview-case__card{ width:clamp(15.5rem, 33vw, 21rem); }
    .preview-case__badges{ top:clamp(0.6rem, 1vw, 1.1rem); gap:0.2rem; }
    .preview-case__pill{ padding:0.28rem 0.5rem; gap:0.2rem; }
    .preview-case__pill-icon{ width:0.85rem; height:0.85rem; }
    .preview-case__pill--name{ font-size:clamp(0.65rem, 1vw, 0.85rem); }
    .preview-case__pill--openings .text-openings-1,
    .preview-case__pill--openings .text-openings-2{ font-size:clamp(0.65rem, 1vw, 0.85rem); }
    .preview-case{ position:static; }
    .preview-case--rifle .preview-case__items,
    .preview-case--premium .preview-case__items{
        position:absolute;
        bottom:calc(100% + 0.75rem);
        top:auto;
        left:50%;
        right:auto;
        flex-direction:row;
        gap:0.55rem;
        transform:translateX(-50%);
        z-index:9;
    }
    .preview-item{ width:clamp(8.5rem, 16.5vw, 11.5rem); }
    .preview-item__info{ padding:0 0.5rem; gap:0.35rem; }
    .preview-item__name,
    .preview-item__exterior{ font-size:clamp(0.62rem, 1vw, 0.85rem); }
    .preview-item--rifle,
    .preview-item--premium{ transform:translateY(-0.8rem); }
    .preview-case:hover .preview-item,
    .preview-case:focus-within .preview-item{ transform:translateY(0); }
    .preview-screen:has(.preview-case:hover) .preview-screen__head,
    .preview-screen:has(.preview-case:focus-within) .preview-screen__head{
        transform:translateY(-130%);
        opacity:0;
        pointer-events:none;
        transition:transform 0.35s ease, opacity 0.3s ease;
    }
    .preview-screen__cards{ flex-wrap:wrap; justify-content:center; gap:2.2rem; }
    .preview-screen__info-card{ min-height:3.9rem; padding:0.4rem 1.15rem 0.4rem 1.85rem; max-width:18.5rem; }
    .preview-screen__info-icon{ width:3.4rem; height:3.4rem; margin-left:-3.5rem; }
    .preview-screen__info-card p{ font-size:clamp(0.78rem, 1.2vw, 1rem); }
}

.preview-case__tap{ display:none; }

.preview-screen__catcher{ display:none; }

.preview-hint-word--mb{ display:none; }

@media (max-width: 767px){
    .preview-screen.show{
        justify-content:flex-start;
        align-items:stretch;
        gap:clamp(1rem, 2vh, 1.5rem);
        padding:3.1rem clamp(1rem, 5vw, 1.5rem) 5rem;
        overflow-y:auto;
    }
    .preview-screen.show .preview-screen__head{ margin-top:auto; }
    .preview-screen.show .preview-screen__cards{ margin-bottom:auto; }
    .preview-screen__hint{
        position:absolute;
        top:1.1rem;
        right:2rem;
        z-index:2;
        max-width:13rem;
        text-align:right;
        font-size:0.7rem;
        line-height:1.3;
    }
    .preview-screen__hint-icon{ width:0.85rem; height:0.85rem; }
    .preview-hint-word--dk{ display:none; }
    .preview-hint-word--mb{ display:inline; }
    .preview-screen__head{
        flex-direction:row;
        align-items:center;
        justify-content:center;
        gap:clamp(1.5rem, 2.5vw, 4rem);
    }
    .preview-screen__title{
        white-space:normal;
        text-align:left;
        font-size:clamp(1.15rem, 5.5vw, 1.55rem);
    }
    .preview-screen__connector{ display:none; }
    .preview-screen__choose{ flex-shrink:0; }
    .preview-screen__choose-badge{ padding:0.5rem 1rem; }
    .preview-screen__choose-text{ font-size:clamp(0.7rem, 3vw, 0.9rem); }
    .preview-screen__cases{
        flex-direction:column;
        align-items:center;
        gap:clamp(0.9rem, 2.6vh, 1.35rem);
    }
    .preview-case{ width:100%; }
    .preview-case__card{
        width:min(82vw, 19rem);
        margin:0 auto;
        aspect-ratio:400 / 289;
    }
    .preview-case__stage{
        left:50%;
        right:auto;
        top:55%;
        width:90%;
        transform:translate(-50%, -50%);
    }
    .preview-case.previewing .preview-case__stage{
        transform:translate(-22%, -50%);
    }
    .preview-case.previewing .preview-case__stage::before{ animation:none; opacity:0; }
    .preview-case.previewing .preview-case__img--closed{ opacity:0; }
    .preview-case.previewing .preview-case__img--opened{
        opacity:1;
        animation:case-breathe 3.8s ease-in-out infinite;
    }
    .preview-case--rifle.previewing .preview-case__img--opened{
        filter:drop-shadow(0 0 10px rgba(29, 195, 255, 0.85)) drop-shadow(0 0 24px rgba(23, 151, 253, 0.5));
    }
    .preview-case--premium.previewing .preview-case__img--opened{
        filter:drop-shadow(0 0 10px rgba(255, 138, 32, 0.85)) drop-shadow(0 0 24px rgba(255, 91, 32, 0.5));
    }
    .preview-case.previewing .preview-case__img--light{
        opacity:0.85;
        animation:case-light-pulse 4.2s ease-in-out infinite;
    }
    .preview-case__badges{
        top:0.6rem;
        left:0.65rem;
        transform:none;
        gap:0.2rem;
        transition:opacity 0.15s ease;
    }
    .preview-case.previewing .preview-case__badges{ transform:none; }
    .preview-case__pill{ padding:0.3rem 0.5rem; gap:0.2rem; }
    .preview-case__pill-icon{ width:0.8rem; height:0.8rem; }
    .preview-case__badges .text-openings-1,
    .preview-case__badges .text-openings-2{ font-size:0.65rem; }
    .preview-case__pill--name{ font-size:0.7rem; }
    .preview-case.previewing .preview-case__badges{ opacity:0; pointer-events:none; }
    .preview-case__btn-wrap{
        left:auto;
        right:-6%;
        bottom:0;
        justify-content:flex-end;
        z-index:7;
    }
    .preview-case__btn{
        min-width:0;
        padding:0.7rem 2.3rem;
        font-size:0.95rem;
    }
    .preview-case--rifle .preview-case__items,
    .preview-case--premium .preview-case__items{
        right:auto;
        left:-2%;
        top:50%;
        transform:translateY(-50%);
        width:56%;
        gap:clamp(0.3rem, 1vh, 0.5rem);
        z-index:5;
    }
    .preview-item{
        width:105%;
        transform:none;
    }
    .preview-item__info{ gap:0.35rem; padding:0 0.75rem 0 0.5rem; }
    .preview-item__name,
    .preview-item__exterior{ font-size:clamp(0.6rem, 2.4vw, 0.78rem); gap:0.2rem; }
    .preview-item__icon{ width:0.85rem; height:0.85rem; }
    .preview-case.previewing .preview-case__items{ visibility:visible; }
    .preview-case.previewing .preview-item{
        opacity:1;
        transform:none;
    }
    .preview-case__tap{
        display:block;
        position:absolute;
        inset:0;
        z-index:6;
        background:transparent;
        border:0;
        padding:0;
        cursor:pointer;
    }
    .preview-case__tap--go{ pointer-events:none; }
    .preview-case.previewing .preview-case__tap--preview{ pointer-events:none; }
    .preview-case.previewing .preview-case__tap--go{ pointer-events:auto; }
    .preview-screen__cards{
        flex-direction:row;
        flex-wrap:wrap;
        justify-content:center;
        align-items:stretch;
        gap:0.6rem 0.75rem;
        margin-top:0.15rem;
        margin-left:0.5rem;
    }
    .preview-screen__info-card{
        flex:0 1 auto;
        max-width:46%;
        min-height:3rem;
        padding:0.4rem 1.6rem 0.4rem 1.6rem;
        text-align:center;
    }
    .preview-screen__info-card:nth-child(3){ max-width:65%; }
    .preview-screen__info-icon{ width:2.6rem; height:2.6rem; margin-left:-2.7rem; }
    .preview-screen__info-card p{ font-size:0.7rem; line-height:1.3; }
    .preview-screen__info-card p br{ display:none; }
    .preview-screen__catcher{
        display:block;
        position:absolute;
        inset:0;
        z-index:0;
        pointer-events:none;
    }
    .preview-screen:has(.preview-case.previewing) .preview-screen__catcher{
        pointer-events:auto;
    }
}

.initializing-screen{
    position:relative;
    box-sizing:border-box;
    width:100%;
    height:100%;
    overflow:hidden;
    --init-accent:#1797fd;
    --init-accent-2:#1df0ff;
    --init-accent-rgb:29, 195, 255;
    --init-plate-bg:#143b6a;
}

.initializing-screen:has(.init-case--premium.show){
    --init-accent:#ff8820;
    --init-accent-2:#ffb820;
    --init-accent-rgb:255, 138, 32;
    --init-plate-bg:#6a2114;
}

.initializing-screen.show{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:clamp(3rem, 3vh, 6rem);
    padding:0 clamp(1.5rem, 3vw, 4rem) 3.75rem;
}

.initializing-screen > *{
    position:relative;
    z-index:1;
}

.init__title{
    margin:0;
    text-align:center;
    white-space:nowrap;
    opacity:0;
}

.init__hint{
    display:none;
    align-items:center;
    gap:0.5rem;
    white-space:nowrap;
    opacity:0;
}

.init__hint.show{
    display:inline-flex;
}

.init__hint-icon{
    width:1.5rem;
    height:1.5rem;
    flex-shrink:0;
    margin-right:5px;
}

.init__case{
    position:relative;
    display:flex;
    justify-content:center;
    opacity:0;
}

.init-case{
    display:none;
}

.init-case.show{
    display:block;
}

.init-case__card{
    position:relative;
    width:clamp(20rem, 26vw, 30rem);
    aspect-ratio:411 / 438;
    border-radius:0.625rem;
    overflow:hidden;
    border:2px solid transparent;
}

.init-case--rifle .init-case__card{
    border-color:rgba(29, 195, 255, 0.8);
    box-shadow:0 0 32px rgba(29, 195, 255, 0.35);
    background:radial-gradient(ellipse 72% 58% at 50% 100%,
            rgba(20, 61, 110, 1) 0%,
            rgba(21, 84, 146, 0.75) 25%,
            rgba(22, 106, 182, 0.5) 50%,
            rgba(23, 151, 253, 0) 100%), #0f2b53;
}

.init-case--premium .init-case__card{
    border-color:rgba(255, 138, 32, 0.85);
    box-shadow:0 0 32px rgba(255, 138, 32, 0.35);
    background:radial-gradient(ellipse 72% 58% at 50% 100%,
            rgba(146, 64, 39, 1) 0%,
            rgba(146, 64, 39, 0.5) 45%,
            rgba(146, 64, 39, 0) 100%), #462223;
}

.init-case__stage{
    position:absolute;
    left:50%;
    top:52%;
    transform:translate(-49%, -54%);
    width:99%;
    aspect-ratio:1233 / 1290;
}

.init-case__stage::after{
    content:"";
    position:absolute;
    left:50%;
    bottom:19%;
    width:84%;
    height:15%;
    transform:translateX(-50%);
    border-radius:50%;
    filter:blur(13px);
    z-index:-2;
    pointer-events:none;
    background:radial-gradient(ellipse at center,
            rgba(var(--init-accent-rgb), 0.6) 0%,
            rgba(var(--init-accent-rgb), 0.28) 45%,
            rgba(var(--init-accent-rgb), 0) 75%);
}

.init-case__img{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:contain;
    pointer-events:none;
}

.init-case__img--smoke{
    inset:auto;
    left:50%;
    top:50%;
    width:120%;
    height:120%;
    transform:translate(-50%, -50%);
    opacity:0.6;
    mix-blend-mode:screen;
    animation:case-smoke-breathe 4.5s ease-in-out infinite;
    will-change:opacity, transform;
}

.init-case__img--light{
    z-index:-1;
    opacity:0.85;
    transform:translateY(3%);
    mix-blend-mode:screen;
    animation:case-light-pulse 4.2s ease-in-out infinite;
    will-change:opacity, transform;
}

.init-case__img--opened{
    animation:case-breathe 3.8s ease-in-out infinite;
}

.init-case--rifle .init-case__img--opened{
    filter:drop-shadow(0 0 14px rgba(29, 195, 255, 0.85)) drop-shadow(0 0 32px rgba(23, 151, 253, 0.5));
}

.init-case--premium .init-case__img--opened{
    filter:drop-shadow(0 0 14px rgba(255, 138, 32, 0.85)) drop-shadow(0 0 32px rgba(255, 91, 32, 0.5));
}

.init__bar{
    position:relative;
    width:clamp(24rem, 40vw, 40rem);
    aspect-ratio:489 / 42;
    opacity:0;
}

.init__bar-frame{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:fill;
    pointer-events:none;
}

.init__bar-frame--premium{ display:none; }

.initializing-screen:has(.init-case--premium.show) .init__bar-frame--rifle{ display:none; }

.initializing-screen:has(.init-case--premium.show) .init__bar-frame--premium{ display:block; }

.init__bar-track{
    position:absolute;
    left:1%;
    right:1%;
    top:50%;
    transform:translateY(-50%);
    height:25%;
    min-height:5px;
    border:1px solid var(--init-accent);
    border-radius:20px;
    background:#081b3a;
    overflow:hidden;
}

.init__bar-frame--rifle{
    filter:drop-shadow(0 0 15px rgba(29, 195, 255, 0.325));
}

.init__bar-frame--premium{
    filter:drop-shadow(0 0 15px rgba(255, 138, 32, 0.325));
}

.init__bar-fill{
    position:absolute;
    left:0;
    top:0;
    bottom:0;
    width:0;
    border-radius:20px;
    background:linear-gradient(90deg, var(--init-accent) 0%, var(--init-accent-2) 100%);
    box-shadow:0 0 8px rgba(var(--init-accent-rgb), 0.7);
}

.initializing-screen.show .init__bar-fill{
    animation:init-bar-fill 6s ease 2.2s forwards;
}

.init__status{
    position:relative;
    isolation:isolate;
    display:grid;
    place-items:center;
    padding:0.85rem 2.5rem;
    min-height:3.4rem;
    opacity:0;
    filter:drop-shadow(0 0 15px rgba(3, 22, 31, 0.325));
}

.init__status::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:-2;
    background:var(--init-accent);
    clip-path:polygon(
        0.9rem 0, calc(100% - 0.9rem) 0,
        100% 50%, calc(100% - 0.9rem) 100%,
        0.9rem 100%, 0 50%);
}

.init__status::after{
    content:"";
    position:absolute;
    inset:2px;
    z-index:-1;
    background:radial-gradient(120% 160% at 0% 50%,
            rgba(var(--init-accent-rgb), 0.55) 0%,
            rgba(var(--init-accent-rgb), 0) 70%), var(--init-plate-bg);
    clip-path:polygon(
        0.9rem 0, calc(100% - 0.9rem) 0,
        100% 50%, calc(100% - 0.9rem) 100%,
        0.9rem 100%, 0 50%);
}

.init__status-text{
    grid-area:1 / 1;
    font-family:var(--font-secondary);
    white-space:nowrap;
    opacity:0;
}

.initializing-screen.show .init__status-text--1{ animation:init-status-step 1.55s ease both 2.2s; }

.initializing-screen.show .init__status-text--2{ animation:init-status-step 1.55s ease both 3.75s; }

.initializing-screen.show .init__status-text--3{ animation:init-status-step 1.55s ease both 5.3s; }

.initializing-screen.show .init__status-text--4{ animation:init-status-last 1.55s ease both 6.85s; }

.init__complete{
    position:absolute;
    inset:0;
    z-index:2;
    pointer-events:none;
    opacity:0;
    background:radial-gradient(ellipse 60% 50% at 50% 55%,
            rgba(var(--init-accent-rgb), 0.35) 0%,
            rgba(var(--init-accent-rgb), 0) 70%);
}

.init__complete.on{
    animation:init-complete-flash 0.4s ease-out forwards;
}

.initializing-screen.show .init__title{ animation:preview-fade-down 0.45s ease-out 0.8s forwards; }

.initializing-screen.show .init__case{ animation:preview-fade-down 0.45s ease-out 1.0s forwards; }

.initializing-screen.show .init__bar{ animation:preview-fade-down 0.45s ease-out 1.5s forwards; }

.initializing-screen.show .init__status{ animation:preview-fade-down 0.45s ease-out 1.8s forwards; }

.initializing-screen.show .init__hint.show{
    animation:preview-fade-down 0.45s ease-out 1.0s forwards, init-hint-blink 2.8s ease-in-out 1.5s infinite;
}

.initializing-screen:has(.init__complete.on) .init__bar-track{
    animation:init-bar-finish 0.7s ease-out;
}

.initializing-screen:has(.init__complete.on) .init-case__card{
    animation:init-case-finish 0.7s ease-out;
}

.initializing-screen.leaving .init__title,
.initializing-screen.leaving .init__case,
.initializing-screen.leaving .init__bar,
.initializing-screen.leaving .init__status,
.initializing-screen.leaving .init__hint.show{
    animation:init-leave 0.5s ease forwards;
}

.init-exit-timer{
    position:absolute;
    width:1px;
    height:1px;
    opacity:0;
    pointer-events:none;
}

.init-exit-timer.run{
    animation:exit-timer 0.5s linear forwards;
}

@media (min-width: 1024px) and (max-width: 1919px){
    .initializing-screen.show{ gap:clamp(1.1rem, 2.4vh, 2.5rem); }
    .init__title{ font-size:clamp(2.2rem, 2.5vw, 3rem); }
    .init-case__card{ width:clamp(15rem, 19vw, 22rem); }
    .init__status{ padding:0.7rem 2.1rem; min-height:3rem; }
    .init__status-text{ font-size:clamp(1rem, 1vw, 1.3rem); }
}

@media (min-width: 768px) and (max-width: 1023px){
    .initializing-screen.show{ gap:clamp(1rem, 2.5vh, 2rem); padding:0 1.5rem 3.75rem; }
    .init__title{ white-space:normal; }
    .init-case__stage{ width:clamp(15rem, 45vw, 22rem); }
    .init__bar{ width:clamp(20rem, 60vw, 28rem); }
}

@media (max-width: 767px){
    .initializing-screen.show{ gap:1rem; padding:0 1rem 3.75rem; overflow-y:auto; }
    .init__title{ white-space:normal; font-size:clamp(1.5rem, 7vw, 2.25rem); }
    .init-case__stage{ width:min(86vw, 23rem); }
    .init__bar{ width:min(85vw, 22rem); }
    .init__status-text{ font-size:0.95rem; white-space:normal; text-align:center; }
}

.reel-screen{
    position:relative;
    box-sizing:border-box;
    width:100%;
    height:100%;
    overflow:hidden;
}

.reel-screen.show{
    display:flex;
    align-items:center;
    justify-content:center;
}

.roulette{
    display:none;
    position:relative;
    width:100%;
    height:100%;
    box-sizing:border-box;
    --item-width:clamp(11rem, 13vw, 16.5rem);
    --item-gap:0.5rem;
    --item-step:calc(var(--item-width) + var(--item-gap));
    --bar-vpad:1.25rem;
    --bar-wide-half:43rem;
}

.roulette.show{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:clamp(1.25rem, 3vh, 2.5rem);
    padding:0 clamp(1rem, 3vw, 3rem) 3.75rem;
}

.roulette--rifle{
    --theme-primary:#1797fd;
    --theme-secondary:#1df0ff;
    --theme-rgb:23, 151, 253;
    --theme-card-bg:#0f2b53;
    --theme-bar-bg:#081b3a;
    --theme-border:#20314c;
}

.roulette--premium{
    --theme-primary:#ff8820;
    --theme-secondary:#ffb820;
    --theme-rgb:255, 138, 32;
    --theme-card-bg:#462223;
    --theme-bar-bg:#2a1410;
    --theme-border:#4a2a1c;
}

.roulette__bg{
    position:absolute;
    left:50%;
    transform:translate(-50%, -50%);
    width:clamp(52rem, 100vw, 110rem);
    height:auto;
    object-fit:contain;
    z-index:0;
    pointer-events:none;
}

.roulette__bg--first{
    width:100%;
    max-height:43rem;
    top:53%;
}

.roulette__bg--second{
    max-height:31rem;
    top:47%;
}

.roulette__title{
    position:relative;
    z-index:2;
    margin:0 0 clamp(8rem, 8vh, 12rem);
    text-align:center;
    opacity:0;
}

.roulette__login-hint{
    display:inline-flex;
    align-items:center;
    gap:0.5rem;
    position:absolute;
    left:50%;
    bottom:-12.5%;
    transform:translateX(-50%);
    z-index:6;
    white-space:nowrap;
    font-family:var(--font-secondary);
    font-size:clamp(0.85rem, 0.9vw, 1.125rem);
    color:var(--color-white-1);
    text-align:center;
    opacity:0;
    pointer-events:none;
    transition:opacity 0.7s ease 0.3s;
}

.roulette__login-icon{
    width:1.4rem;
    height:1.4rem;
    flex-shrink:0;
}

.roulette.roll-result .roulette__login-hint{
    opacity:1;
}

.roulette__stage{
    position:relative;
    z-index:2;
    width:100%;
    max-width:86rem;
    height:clamp(18rem, 26vw, 24rem);
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    top:-3%;
}

.roulette__bar{
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%);
    width:100%;
    height:100%;
    border-radius:0.625rem;
    border:2px solid var(--theme-primary);
    overflow:hidden;
    z-index:1;
    background:radial-gradient(120% 90% at 50% 0%,
            rgba(20, 61, 110, 0.9) 0%,
            rgba(var(--theme-rgb), 0) 100%), var(--theme-bar-bg);
    box-shadow:inset 0 0 1.5rem rgba(var(--theme-rgb), 0.25), 0 0 1.25rem rgba(var(--theme-rgb), 0.4);
}

.roulette--premium .roulette__bar{
    background:radial-gradient(120% 90% at 50% 0%,
            rgba(146, 64, 39, 0.9) 0%,
            rgba(var(--theme-rgb), 0) 100%), var(--theme-bar-bg);
}

.roulette__bar::before,
.roulette__bar::after{
    content:"";
    position:absolute;
    top:0;
    bottom:0;
    width:calc(var(--item-width) * 1.3);
    z-index:4;
    pointer-events:none;
}

.roulette__bar::before{
    left:0;
    background:linear-gradient(to right,
            rgba(var(--theme-rgb), 0.8) 0%,
            rgba(var(--theme-rgb), 0.4) 55%,
            rgba(var(--theme-rgb), 0) 100%);
}

.roulette__bar::after{
    right:0;
    background:linear-gradient(to left,
            rgba(var(--theme-rgb), 0.8) 0%,
            rgba(var(--theme-rgb), 0.4) 55%,
            rgba(var(--theme-rgb), 0) 100%);
}

.roulette__track{
    position:absolute;
    inset:0;
    transform:translateX(0);
    will-change:transform;
}

.roulette__strip{
    position:absolute;
    top:50%;
    left:0;
    display:flex;
    align-items:center;
    gap:var(--item-gap);
    padding:0 var(--item-gap);
    height:100%;
    box-sizing:border-box;
    will-change:transform;
    transition:transform 6s cubic-bezier(0.55, 0, 0.08, 1) 0.45s;
}

.roulette--rifle .roulette__strip{
    transform:translateY(-50%) translateX(calc(var(--bar-wide-half) - var(--item-gap) - var(--item-step) * (2 * var(--items-count--RIFLE, 6) + var(--random-num--RIFLE, 0)) - (var(--item-width) / 2)));
}

.roulette--premium .roulette__strip{
    transform:translateY(-50%) translateX(calc(var(--bar-wide-half) - var(--item-gap) - var(--item-step) * (2 * var(--items-count--PREMIUM, 6) + var(--random-num--PREMIUM, 0)) - (var(--item-width) / 2)));
}

.roulette--rifle .roulette__bar.bar-scrolling .roulette__track{
    animation:reel-roll-rifle 6.5s cubic-bezier(0.16, 0.84, 0.3, 1) forwards;
}

.roulette--premium .roulette__bar.bar-scrolling .roulette__track{
    animation:reel-roll-premium 6.5s cubic-bezier(0.16, 0.84, 0.3, 1) forwards;
}

.roulette__pointer{
    position:absolute;
    left:50%;
    z-index:5;
    pointer-events:none;
    -webkit-user-drag:none;
    filter:drop-shadow(0 0 0.5rem rgba(var(--theme-rgb), 0.9));
}

.roulette__pointer--top{
    top:0;
    bottom:calc(100% - 1.6rem);
    transform:translateX(-50%);
    width:11rem;
    height:auto;
}

.roulette__pointer--bottom{
    bottom:0;
    transform:translateX(-50%);
    width:6rem;
    height:auto;
}

.roulette__bracket{
    position:absolute;
    top:50%;
    width:0.65rem;
    height:108%;
    transform:translateY(-50%);
    background:var(--theme-primary);
    border-radius:0.5rem;
    box-shadow:0 0 0.625rem rgba(var(--theme-rgb), 0.9), 0 0 1.25rem rgba(var(--theme-rgb), 0.5);
    z-index:4;
    pointer-events:none;
    filter:blur(0.5px);
}

.roulette__bracket{
    display:none;
}

.roulette .item{
    flex-shrink:0;
    width:var(--item-width);
    aspect-ratio:265 / 318;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:space-between;
    padding:1rem 1rem 0;
    border-radius:0.625rem;
    border:1px solid rgba(var(--theme-rgb), 0.4);
    box-sizing:border-box;
    list-style:none;
    position:relative;
    overflow:hidden;
    transition:background 0.5s ease, border-color 0.5s ease, box-shadow 0.5s ease, transform 0.5s cubic-bezier(0.34, 1.25, 0.5, 1);
    background:radial-gradient(ellipse 72% 58% at 50% 100%,
            rgba(20, 61, 110, 1) 0%,
            rgba(21, 84, 146, 0.75) 25%,
            rgba(22, 106, 182, 0.5) 50%,
            rgba(var(--theme-rgb), 0) 100%), var(--theme-card-bg);
}

.roulette--premium .item{
    background:radial-gradient(ellipse 72% 58% at 50% 100%,
            rgba(146, 64, 39, 1) 0%,
            rgba(146, 64, 39, 0.5) 45%,
            rgba(var(--theme-rgb), 0) 100%), var(--theme-card-bg);
}

.roulette .item__deco{
    position:absolute;
    left:50%;
    top:calc(50% - 1rem);
    transform:translate(-50%, -50%);
    width:70%;
    aspect-ratio:1;
    z-index:0;
    pointer-events:none;
}

.roulette .item__deco-img{
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%, -50%);
    width:100%;
    opacity:0.55;
    filter:brightness(1.85);
}

.roulette .item__deco-img--2{
    width:79%;
    opacity:0.7;
}

.roulette .item__deco-img--1{
    width:60%;
    opacity:0.85;
}

.roulette .item__top,
.roulette .item__img,
.roulette .item__exterior{
    position:relative;
    z-index:1;
}

.roulette .item__top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:0.4rem;
    width:100%;
    font-family:var(--font-secondary);
    font-weight:500;
    font-size:clamp(0.8rem, 0.9vw, 1rem);
}

.roulette .item__name,
.roulette .item__value{
    display:inline-flex;
    align-items:center;
    gap:0.3rem;
    white-space:nowrap;
    color:var(--color-white-1);
    -webkit-user-select:none;
            user-select:none;
}

.roulette .item__value{
    color:var(--theme-secondary);
}

.roulette .item__icon{
    width:auto;
    height:1.1rem;
    object-fit:contain;
    flex-shrink:0;
}

.roulette .item__img{
    width:120%;
    height:auto;
    aspect-ratio:4 / 3;
    object-fit:cover;
    -webkit-user-drag:none;
    -webkit-user-select:none;
            user-select:none;
}

.roulette--rifle .item__img{
    filter:drop-shadow(0 0 4px rgba(23, 151, 253, 0.7)) drop-shadow(0 0 8px rgba(23, 151, 253, 0.3)) drop-shadow(0 3px 4px rgba(0, 0, 0, 0.45));
}

.roulette--premium .item__img{
    filter:drop-shadow(0 0 4px rgba(255, 138, 32, 0.7)) drop-shadow(0 0 8px rgba(255, 138, 32, 0.3)) drop-shadow(0 3px 4px rgba(0, 0, 0, 0.45));
}

.roulette .item__exterior{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:0.35rem;
    width:calc(100% + 1rem);

    padding:0.85rem 0.75rem 1rem;
    font-family:var(--font-secondary);
    font-weight:500;
    font-size:clamp(1.25rem, 0.9vw, 2.25rem);
    color:var(--color-white-1);
    text-align:center;
    white-space:nowrap;
    overflow:hidden;
    --ext-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40' preserveAspectRatio='none'%3E%3Cpath d='M0 40 L8 7 Q10 0 17 0 L83 0 Q90 0 92 7 L100 40 Z' fill='%23000'/%3E%3C/svg%3E");
    -webkit-mask:var(--ext-mask) center / 100% 100% no-repeat;
    mask:var(--ext-mask) center / 100% 100% no-repeat;
    background:radial-gradient(74% 100% at 50% 0%, var(--theme-secondary) 0%, var(--theme-primary) 100%);
    -webkit-user-select:none;
            user-select:none;
    text-shadow:0 0 1px rgba(0, 0, 0, 0.6);
}

.roulette .item__ext-icon{
    width:auto;
    height:1.1rem;
    object-fit:contain;
    flex-shrink:0;
    filter:drop-shadow(0 0 1px var(--theme-primary));
}

.roulette__strip .item{
    pointer-events:none;
}

.roulette.roll-result .roulette__strip .item.show{
    transform:scale(1.05);
}

.roulette--rifle.roll-result .roulette__strip .item.show{
    border-color:#1797fd;
    background:linear-gradient(180deg, #1797fd 20%, #1df0ff 100%);
    box-shadow:0 0 30px rgba(23, 151, 253, 0.5), 0 0 20px rgba(23, 151, 253, 0.8), 0 0 10px #1797fd, inset 0 0 2px #1df0ff;
}

.roulette--premium.roll-result .roulette__strip .item.show{
    border-color:#ff5b20;
    background:linear-gradient(180deg, #ff5b20 20%, #ffb820 100%);
    box-shadow:0 0 30px rgba(255, 91, 32, 0.5), 0 0 20px rgba(255, 91, 32, 0.8), 0 0 10px #ff5b20, inset 0 0 2px #ff5b20;
}

.roulette.roll-result .roulette__strip .item.show .item__value{
    color:var(--color-white-1);
}

.roulette.roll-result .roulette__strip .item.show .item__deco{
    opacity:0.85;
    filter:brightness(3) saturate(2);
}

.roulette.roll-result .roulette__strip .item.show .item__img{
    animation:reel-winner-breathe 2.4s ease-in-out infinite;
}

.roulette.roll-result .roulette__strip .item:not(.show){
    opacity:0.4;
    filter:saturate(0.65);
    transition:opacity 0.35s ease 0.05s, filter 0.35s ease 0.05s;
}

.roulette__btns{
    position:relative;
    z-index:2;
    display:flex;
    gap:clamp(0.75rem, 1.5vw, 1.5rem);
    margin-top:clamp(2rem, 5vh, 4rem);
    opacity:0;
}

.btn-reel{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:clamp(11rem, 14vw, 15.25rem);
    padding:clamp(0.65rem, 1.3vw, 1.15rem) clamp(1rem, 2vw, 1.75rem);
    border-radius:0.625rem;
    border:1px solid transparent;
    transition:background 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease, transform 0.15s ease;
}

.btn-reel--rifle{
    border-color:rgba(23, 151, 253, 0.2);
    background:radial-gradient(140% 220% at 50% 100%, rgba(23, 151, 253, 0.85) 0%, rgba(23, 151, 253, 0) 70%), #0c2748;
}

.btn-reel--premium{
    border-color:rgba(255, 184, 32, 0.2);
    background:radial-gradient(140% 220% at 50% 100%, rgba(255, 91, 32, 0.85) 0%, rgba(255, 91, 32, 0) 70%), #6a1415;
}

.btn-reel--rifle:hover{
    border-color:#1797fd;
    background:radial-gradient(120% 200% at 50% 100%, #1df0ff 0%, #1ac3fe 50%, #1797fd 100%);
    box-shadow:0 0 15px rgba(23, 151, 253, 0.5), 0 0 10px rgba(23, 151, 253, 0.8), 0 0 5px #1797fd, inset 0 0 2px #1df0ff;
}

.btn-reel--premium:hover{
    border-color:#ff5b20;
    background:radial-gradient(120% 200% at 50% 100%, #ffb820 0%, #ff8820 50%, #ff5b20 100%);
    box-shadow:0 0 15px rgba(255, 91, 32, 0.5), 0 0 10px rgba(255, 91, 32, 0.8), 0 0 5px #ff5b20, inset 0 0 2px #ffb820;
}

.btn-reel:active{
    transform:scale(0.96);
}

.btn-reel--rifle{
    --cta-rgb:23, 151, 253;
}

.btn-reel--premium{
    --cta-rgb:255, 91, 32;
}

.roulette:not(.roll-active) .btn-reel:not(.roulette__btn-claim):not(.random_end),
.roulette.roll-result .btn-reel:not(.roulette__btn-claim):not(.random_end){
    animation:reel-cta-pulse 1.8s ease-in-out 2.9s infinite;
}

.roulette.roll-active:not(.roll-result) .roulette__btn,
.roulette .roulette__btn.random_end{
    pointer-events:none;
    filter:brightness(0.45) saturate(0.5);
    opacity:0.7;
}

.roulette .btn-text-open{
    display:inline;
}

.roulette .btn-text-try{
    display:none;
}

.roulette .roulette__btn.roll-btn-try .btn-text-open{
    display:none;
}

.roulette .roulette__btn.roll-btn-try .btn-text-try{
    display:inline;
}

.roulette .roulette__btn-claim{
    display:none;
}

.roulette.has-rolled .roulette__btn-claim,
.roulette:has(.roulette__btn.random_end) .roulette__btn-claim{
    display:inline-flex;
}

.reel-screen.show .roulette.show .roulette__bg--first{
    animation:preview-fade-in 1.3s ease-out 0.25s both;
}

.reel-screen.show .roulette.show .roulette__bg--second{
    animation:preview-fade-in 1.3s ease-out 0.5s both;
}

.reel-screen.show .roulette.show .roulette__stage{
    animation:roulette-stage-in 1.65s cubic-bezier(0.22, 0.61, 0.36, 1) 0.55s both;
}

.reel-screen.show .roulette.show .roulette__title{
    animation:preview-fade-down 1s ease-out 1.25s forwards;
}

.reel-screen.show .roulette.show .roulette__btns{
    animation:reel-btns-in 0.9s cubic-bezier(0.22, 0.61, 0.36, 1) 1.85s forwards;
}

@media (min-width: 1024px) and (max-width: 1919px){
    .roulette{
        --side-pad:clamp(1rem, 3vw, 3rem);
        --bar-w:min(74rem, calc(100vw - 2 * var(--side-pad)));
        --bar-wide-half:calc(var(--bar-w) / 2);
        --item-width:clamp(10rem, 12vw, 14.5rem);
    }
    .roulette__stage{ max-width:var(--bar-w); height:clamp(13rem, 16vw, 17.5rem); }
    .roulette__title{ margin:0 0 clamp(4.5rem, calc(6vh + 2.5rem), 7.5rem); font-size:clamp(2.2rem, 2.5vw, 3rem); top:-1.75rem; }
    .roulette__btns{ margin-top:clamp(3.75rem, calc(3vh + 2.5rem), 5rem); }
    .roulette__btn .text-btn{ white-space:nowrap; font-size:clamp(1.1rem, 1.4vw, 1.6rem); }
    .roulette__pointer--top{ width:6rem; top:-1%;}
    .roulette__pointer--bottom{ width:4.5rem; }
    .roulette .item{ min-width:0; padding-left:0.5rem; padding-right:0.5rem; }
    .roulette .item__top{ gap:0.25rem; }
    .roulette .item__name,
    .roulette .item__value{ font-size:clamp(0.78rem, 0.78vw, 0.98rem); gap:0.22rem; }
    .roulette .item__icon{ height:0.95rem; }
    .roulette .item__exterior{ font-size:clamp(0.9rem, 1vw, 1.35rem); padding:0.6rem 0.6rem 0.75rem; }
    .roulette .item__ext-icon{ height:0.85rem; }
    .roulette__bg--first{ max-height:33rem; top:50%; }
    .roulette__bg--second{ max-height:25.5rem; top:43%; }
}

@media (min-width: 768px) and (max-width: 1023px){
    .roulette{
        --side-pad:clamp(1rem, 3vw, 3rem);
        --bar-w:min(44rem, calc(100vw - 2 * var(--side-pad)));
        --bar-wide-half:calc(var(--bar-w) / 2);
        --item-width:clamp(9.5rem, 16vw, 13rem);
    }

    .roulette__stage{ max-width:var(--bar-w); height:clamp(15rem, 26vw, 19rem); }
    .roulette__btn{ min-width:0; }
    .roulette__btn .text-btn{ white-space:nowrap; font-size:clamp(1rem, 2vw, 1.4rem); }
    .roulette .item{ min-width:0; padding-left:0.5rem; padding-right:0.5rem; }
    .roulette .item__top{ gap:0.2rem; }
    .roulette .item__name,
    .roulette .item__value{ font-size:clamp(0.62rem, 1vw, 0.85rem); gap:0.18rem; }
    .roulette .item__icon{ height:0.85rem; }
    .roulette .item__exterior{ font-size:clamp(0.85rem, 1.4vw, 1.2rem); padding:0.55rem 0.5rem 0.7rem; }
    .roulette .item__ext-icon{ height:0.8rem; }
    
    .roulette__pointer--top{ width:7.5rem; }
}

@media (max-width: 767px){
    .roulette.show{
        padding:0;
        justify-content:center;
    }

    .roulette{
        --bar-wide-half:50vw;
        --item-width:clamp(13rem, 64vw, 19rem);
        --item-gap:0.4rem;
    }

    .roulette__bg{
        position:absolute;
        left:50%;
        transform:translate(-50%, -50%);
        width:100%;
        height:440px;
        object-fit:cover;
        z-index:0;
        pointer-events:none;
        top:46%;
        max-height:auto;
    }

    .roulette__bg--first{
        display:none;
    }
    .roulette__title{
        margin-bottom:0;
        font-size:clamp(1.4rem, 7vw, 2rem);
        position:relative;
        top:-5%;
    }
    .roulette__stage{
        width:100%;
        max-width:100%;
        height:clamp(17rem, 80vw, 24rem);
        top:0;
    }

    .roulette__bar{
        width:100%;
        border-radius:0;
    }
    .roulette__bar::before,
    .roulette__bar::after{
        width:clamp(2.75rem, 15vw, 5rem);
    }

    .roulette__bar::before{
        background:linear-gradient(to right,
                rgba(var(--theme-rgb), 0.4) 0%,
                rgba(var(--theme-rgb), 0.16) 55%,
                rgba(var(--theme-rgb), 0) 100%);
    }

    .roulette__bar::after{
        background:linear-gradient(to left,
                rgba(var(--theme-rgb), 0.4) 0%,
                rgba(var(--theme-rgb), 0.16) 55%,
                rgba(var(--theme-rgb), 0) 100%);
    }
    .roulette__pointer--top{
        width:5rem;
        top:-3px;
    }

    .roulette__pointer--bottom{
        width:3.5rem;
        bottom:-1px;
    }
    .roulette .item__top{
        font-size:clamp(0.72rem, 3vw, 0.92rem);
    }

    .roulette .item__icon{
        height:0.95rem;
    }

    .roulette .item__exterior{
        font-size:clamp(0.95rem, 4vw, 1.3rem);
        padding:0.55rem 0.5rem 0.7rem;
    }

    .roulette .item__ext-icon{
        height:0.95rem;
    }
    .roulette__login-hint{
        max-width:100%;
        bottom:-68px;
        text-align:center;
        font-size:0.8rem;
        line-height:1.3;
    }

    .roulette__login-icon{
        width:1.05rem;
        height:1.05rem;
    }
    .roulette__btns{
        flex-wrap:nowrap;
        gap:0.75rem;
        width:100%;
        padding:0 1rem;
        justify-content:center;
        box-sizing:border-box;
        position:relative;
        top:30px;
    }

    .btn-reel{
        width:auto;
        flex:1 1 0;
        min-width:0;
        max-width:10.5rem;
        padding:0.75rem 0.5rem;
    }

    .roulette__btn .text-btn{
        font-size:clamp(1rem, 4.5vw, 1.3rem);
    }
}

.content:has(.activate-screen.show) [data-section]:not(.activate-screen){
   display:none !important;
}

.content:has(.activate-screen.show) .scene--bottom, .content:has(.activate-screen.show) .scene--top{
    display:none !important;
}

.activate-screen{
   position:relative;
   box-sizing:border-box;
   width:100%;
   height:100%;
   overflow:hidden;
}

.activate-screen.show{
   display:flex;
   flex-direction:column;
   align-items:center;
   justify-content:center;
   gap:clamp(1.5rem, 4vh, 3rem);
}

.activate-screen__bg{
   position:absolute;
   left:0;
   top:0;
   height:100%;
   width:auto;
   max-width:60%;
   object-fit:contain;
   object-position:left center;
   z-index:0;
   pointer-events:none;
   display:none;
   filter:drop-shadow(14px 0 18px rgba(0, 0, 0, 0.28));
   transform-origin:left center;
}

.activate-screen:has(.item--rifle.show)   .activate-screen__bg--rifle{ display:block; }

.activate-screen:has(.item--premium.show) .activate-screen__bg--premium{ display:block; }

.activate-screen__inner{
   position:relative;
   z-index:1;
   display:flex;
   align-items:center;
   justify-content:center;
   gap:clamp(0.5rem, 6vw, 5rem);
   width:100%;
   max-width:84rem;
   padding:0 clamp(1.5rem, 4vw, 4rem);
   box-sizing:border-box;
}

.activate-screen__prize{
   flex-shrink:0;
   display:flex;
   align-items:center;
   justify-content:center;
}

.activate-screen__items{
   list-style:none;
   margin:0;
   padding:0;
}

.activate-screen__items .item{ display:none; }

.activate-screen__items .item.show{ display:flex; }

.activate-screen__panel{
   display:flex;
   flex-direction:column;
   align-items:flex-start;
   gap:clamp(1.25rem, 2.4vh, 2.25rem);
   max-width:28rem;
}

.activate-screen__title{
   margin:0;
   font-family:var(--font-primary);
   font-weight:700;
   line-height:1.05;
   font-size:clamp(2.25rem, 2.4vw + 1.3rem, 4rem);
   color:var(--color-white-1);
   text-shadow:0 0 3px var(--color-white-1);
   -webkit-user-select:none;
           user-select:none;
}

.activate-screen__reward{
   opacity:1;
   max-width:26rem;
   align-self:flex-end;
}

.activate-screen__reward p{ white-space:normal; }

.activate-screen__reward-icon{ display:none; }

.activate-screen:has(.item--rifle.show)   .activate-screen__reward-icon--rifle{ display:block; }

.activate-screen:has(.item--premium.show) .activate-screen__reward-icon--premium{ display:block; }

.activate-screen:has(.item--premium.show) .activate-screen__reward::before{
   background:rgba(255, 170, 80, 0.5);
}

.activate-screen:has(.item--premium.show) .activate-screen__reward::after{
   background:linear-gradient(to right, #FF5B20 0%, rgba(255, 91, 32, 0.00) 100%), #462223;
}

.activate-screen:has(.item--premium.show) .activate-screen__reward .preview-screen__info-icon{
   filter:drop-shadow(0 0 10px rgba(255, 138, 32, 0.55));
}

.activate-screen:has(.item--premium.show) .activate-screen__reward p span{
   background:radial-gradient(308.1% 47.08% at 50% 50%, var(--color-orange-1) 0%, var(--color-yellow-1) 100%);
   background-clip:text;
   -webkit-background-clip:text;
   -webkit-text-fill-color:transparent;
}

.activate-screen__btn{
   display:none;
   cursor:pointer;
   width:clamp(13rem, 18vw, 22.3rem);
}

.activate-screen:has(.item--rifle.show)   .activate-screen__btn.btn-reel--rifle{ display:inline-flex; }

.activate-screen:has(.item--premium.show) .activate-screen__btn.btn-reel--premium{ display:inline-flex; }

.activate-screen__hint{
   justify-content:center;
   align-items:center;
   align-self:center;
   gap:0.5rem;
   white-space:nowrap;
   display:none;
   font-family:var(--font-secondary);
   font-weight:500;
   font-size:clamp(0.875rem, 0.388vw + 0.784rem, 1.125rem);
   line-height:1.4;
   -webkit-user-select:none;
           user-select:none;
}

.activate-screen__hint-icon,
.activate-screen__hint .init__hint-icon{
   width:1.5rem;
   height:1.5rem;
   flex-shrink:0;
}

.activate-screen:has(.item--rifle.show)   .activate-screen__hint--rifle{
   display:inline-flex;
   color:var(--color-blue-1);
}

.activate-screen:has(.item--premium.show) .activate-screen__hint--premium{
   display:inline-flex;
   color:var(--color-orange-1);
}

.activate-screen__subs{
   --sub-rgb:23, 151, 253;
   --sub-primary:#1797fd;
   --sub-secondary:#1df0ff;

   display:flex;
   flex-direction:column;
   gap:clamp(0.75rem, 1.5vh, 1.25rem);
   width:100%;
   max-width:50.5rem;
   box-sizing:border-box;
   align-items:stretch;
}

.activate-screen:has(.item--premium.show) .activate-screen__subs{
   --sub-rgb:255, 138, 32;
   --sub-primary:#ff8820;
   --sub-secondary:#ffb820;
}

.activate-sub{
   position:relative;
   isolation:isolate;
   display:flex;
   align-items:center;
   gap:clamp(0.85rem, 1.6vw, 1.4rem);
   padding:clamp(0.85rem, 1.4vw, 1.15rem) clamp(1rem, 1.8vw, 1.6rem);
}

.activate-sub::before{
   content:"";
   position:absolute;
   inset:0;
   z-index:-2;
   background:rgba(120, 200, 255, 0.55);
   clip-path:polygon(
      1.2rem 0, calc(100% - 1.2rem) 0,
      100% 1.2rem, 100% calc(100% - 1.2rem),
      calc(100% - 1.2rem) 100%, 1.2rem 100%,
      0 calc(100% - 1.2rem), 0 1.2rem);
}

.activate-sub::after{
   content:"";
   position:absolute;
   inset:1px;
   z-index:-1;
   background:linear-gradient(105deg,
      rgba(33, 118, 196, 0.9) 0%,
      rgba(20, 45, 78, 0.92) 55%,
      rgba(16, 32, 58, 0.92) 100%);
   box-shadow:inset 0 1px 0 rgba(180, 225, 255, 0.2);
   clip-path:polygon(
      1.2rem 0, calc(100% - 1.2rem) 0,
      100% 1.2rem, 100% calc(100% - 1.2rem),
      calc(100% - 1.2rem) 100%, 1.2rem 100%,
      0 calc(100% - 1.2rem), 0 1.2rem);
}

.activate-screen:has(.item--premium.show) .activate-sub::before{
   background:rgba(255, 170, 80, 0.5);
}

.activate-screen:has(.item--premium.show) .activate-sub::after{
   background:linear-gradient(to right, #ff5b20 0%, rgba(255, 91, 32, 0) 100%), #462223;
}

.activate-sub__icon{
   display:flex;
   align-items:center;
   justify-content:center;
   flex-shrink:0;
   width:clamp(3rem, 3.4vw, 4rem);
   height:clamp(3rem, 3.4vw, 4rem);
   border-radius:50%;
   color:var(--sub-secondary);
   filter:brightness(1.3);
   background:rgba(var(--sub-rgb), 0.36);
   border:1px solid rgba(var(--sub-rgb), 1);
   box-shadow:0 0 14px rgba(var(--sub-rgb), 0.75);
   animation:activate-icon-wobble 2.4s ease-in-out infinite;
   will-change:transform;
}

.activate-sub--push .activate-sub__icon{
   animation-direction:reverse;
}

.activate-sub__icon svg{
   width:60%;
   height:60%;
}

.activate-sub__text{
   display:flex;
   flex-direction:column;
   gap:0.15rem;
   flex:1 1 auto;
   min-width:0;
}

.activate-sub__title{
   margin:0;
   font-family:var(--font-primary);
   font-weight:700;
   font-size:clamp(1rem, 1.1vw, 1.375rem);
   line-height:1.2;
   color:var(--color-white-1);
   -webkit-user-select:none;
           user-select:none;
}

.activate-sub__desc{
   margin:0;
   font-family:var(--font-secondary);
   font-weight:500;
   font-size:clamp(0.8rem, 0.9vw, 1rem);
   line-height:1.35;
   color:rgba(255, 255, 255, 0.65);
   -webkit-user-select:none;
           user-select:none;
}

.activate-sub__btn{
   flex-shrink:0;
   display:inline-flex;
   align-items:center;
   justify-content:center;
   padding:clamp(0.6rem, 1vw, 0.85rem) clamp(1rem, 1.8vw, 1.6rem);
   border-radius:0.5rem;
   border:2px solid rgba(var(--sub-rgb), 0.5);
   cursor:pointer;
   font-family:var(--font-secondary);
   font-weight:700;
   font-size:clamp(0.85rem, 0.95vw, 1.05rem);
   text-transform:uppercase;
   white-space:nowrap;
   color:var(--color-white-1);
   text-shadow:0 0 2px rgba(0, 0, 0, 0.4);
   background:radial-gradient(140% 220% at 50% 100%,
      rgba(var(--sub-rgb), 0.9) 0%,
      rgba(var(--sub-rgb), 0.15) 70%);
   transition:background 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease, transform 0.15s ease, filter 0.2s ease;
}

.activate-sub__btn:hover{
   filter:brightness(1.1);
   border-color:var(--sub-primary);
   background:radial-gradient(120% 200% at 50% 100%, var(--sub-secondary) 0%, var(--sub-primary) 100%);
   box-shadow:0 0 15px rgba(var(--sub-rgb), 0.55), inset 0 0 2px var(--sub-secondary);
}

.activate-sub__btn:active{ transform:scale(0.97); }

.activate-screen__items .item--rifle{
   --theme-rgb:23, 151, 253;
   --theme-primary:#1797fd;
   --theme-secondary:#1df0ff;
}

.activate-screen__items .item--premium{
   --theme-rgb:255, 138, 32;
   --theme-primary:#ff8820;
   --theme-secondary:#ffb820;
}

.activate-screen__items .item{
   position:relative;
   width:clamp(18rem, 22vw, 23.5rem);
   aspect-ratio:377 / 452;
   flex-direction:column;
   align-items:center;
   justify-content:space-between;
   padding:1.5rem 1.5rem 0;
   border-radius:1.25rem;
   border:1px solid var(--theme-primary);
   box-sizing:border-box;
   overflow:hidden;
}

.activate-screen__items .item--rifle{
   background:linear-gradient(180deg, #1797fd 20%, #1df0ff 100%);
   box-shadow:0 0 42px rgba(23, 151, 253, 0.5), 0 0 28px rgba(23, 151, 253, 0.8), 0 0 14px #1797fd, inset 0 0 2px #1df0ff;
}

.activate-screen__items .item--premium{
   background:linear-gradient(180deg, #ff5b20 20%, #ffb820 100%);
   box-shadow:0 0 42px rgba(255, 91, 32, 0.5), 0 0 28px rgba(255, 91, 32, 0.8), 0 0 14px #ff5b20, inset 0 0 2px #ffb820;
}

.activate-screen__items .item__deco{
   position:absolute;
   left:50%;
   top:calc(50% - 1rem);
   transform:translate(-50%, -50%);
   width:70%;
   aspect-ratio:1;
   z-index:0;
   pointer-events:none;
   opacity:0.85;
   filter:brightness(3) saturate(2);
}

.activate-screen__items .item__deco-img{
   position:absolute;
   left:50%;
   top:50%;
   transform:translate(-50%, -50%);
   width:100%;
   opacity:0.55;
   filter:brightness(1.85);
}

.activate-screen__items .item__deco-img--2{ width:79%; opacity:0.7; }

.activate-screen__items .item__deco-img--1{ width:60%; opacity:0.85; }

.activate-screen__items .item__top,
.activate-screen__items .item__img,
.activate-screen__items .item__exterior{
   position:relative;
   z-index:1;
}

.activate-screen__items .item__top{
   display:flex;
   align-items:center;
   justify-content:space-between;
   gap:0.4rem;
   width:100%;
   font-family:var(--font-secondary);
   font-weight:500;
   font-size:clamp(1.25rem, 1.5vw, 1.95rem);
}

.activate-screen__items .item__name,
.activate-screen__items .item__value{
   display:inline-flex;
   align-items:center;
   gap:0.3rem;
   white-space:nowrap;
   color:var(--color-white-1);
   -webkit-user-select:none;
           user-select:none;
}

.activate-screen__items .item__icon{
   width:auto;
   height:1.55rem;
   object-fit:contain;
   flex-shrink:0;
}

.activate-screen__items .item__img{
   width:118%;
   height:auto;
   aspect-ratio:4 / 3;
   object-fit:cover;
   -webkit-user-drag:none;
   -webkit-user-select:none;
           user-select:none;
   filter:drop-shadow(0 0 6px rgba(255, 255, 255, 0.45)) drop-shadow(0 3px 4px rgba(0, 0, 0, 0.45));
   animation:reel-winner-breathe 2.4s ease-in-out infinite;
}

.activate-screen__items .item__exterior{
   display:flex;
   align-items:center;
   justify-content:center;
   gap:0.35rem;
   width:calc(100% + 3rem);
   padding:1rem 0.75rem 1.15rem;
   font-family:var(--font-secondary);
   font-weight:500;
   font-size:clamp(1.5rem, 1.4vw, 2.25rem);
   color:var(--color-white-1);
   text-align:center;
   white-space:nowrap;
   overflow:hidden;
   --ext-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40' preserveAspectRatio='none'%3E%3Cpath d='M0 40 L8 7 Q10 0 17 0 L83 0 Q90 0 92 7 L100 40 Z' fill='%23000'/%3E%3C/svg%3E");
   -webkit-mask:var(--ext-mask) center / 100% 100% no-repeat;
   mask:var(--ext-mask) center / 100% 100% no-repeat;
   background:radial-gradient(74% 100% at 50% 0%, var(--theme-secondary) 0%, var(--theme-primary) 100%);
   -webkit-user-select:none;
           user-select:none;
   text-shadow:0 0 1px rgba(0, 0, 0, 0.6);
}

.activate-screen__items .item__ext-icon{
   width:auto;
   height:1.2rem;
   object-fit:contain;
   flex-shrink:0;
   filter:drop-shadow(0 0 1px var(--theme-primary));
}

.activate-screen.show .activate-screen__bg{
   animation:activate-bg-in 1.2s cubic-bezier(0.22, 0.61, 0.36, 1) 0.1s both;
}

.activate-screen.show .activate-screen__items .item.show{
   animation:activate-prize-in 1.5s cubic-bezier(0.22, 0.61, 0.36, 1) 0.85s both;
}

.activate-screen.show .activate-screen__title{ animation:activate-fade-down 0.75s ease-out 1.75s both; }

.activate-screen.show .activate-screen__reward{ animation:activate-fade-down 0.75s ease-out 2.1s both; }

.activate-screen.show .activate-screen__btn.btn-reel--rifle,
.activate-screen.show .activate-screen__btn.btn-reel--premium{
   animation:activate-fade-down 0.75s ease-out 2.45s both, reel-cta-pulse 1.8s ease-in-out 3.3s infinite;
}

.activate-screen.show .activate-screen__hint{ animation:activate-fade-down 0.75s ease-out 2.8s both; }

.activate-screen.show .activate-screen__subs .activate-sub{
   animation:activate-fade-down 0.7s ease-out both;
}

.activate-screen.show .activate-screen__subs .activate-sub:nth-child(1){ animation-delay:3.0s; }

.activate-screen.show .activate-screen__subs .activate-sub:nth-child(2){ animation-delay:3.2s; }

@media (min-width: 768px) and (max-width: 1919px){
   .activate-screen__panel{ align-items:flex-end; text-align:right; }
   .activate-screen__title{ text-align:right; }
   .activate-screen__hint{ align-self:flex-end; }
   .activate-screen__items .item{ width:clamp(15rem, 19vw, 21rem); }
   .activate-screen__title{ font-size:clamp(2.2rem, 2.6vw, 3.4rem); }
   .activate-screen__panel{ gap:clamp(1rem, 2vh, 1.8rem); max-width:25rem; }
   .activate-screen__reward{ max-width:23rem; }
   .activate-screen__btn{ width:clamp(11rem, 15vw, 18rem); }
   .activate-screen__subs{ max-width:39rem; gap:clamp(0.6rem, 1.2vh, 1rem); }
   .activate-sub{ padding:clamp(0.7rem, 1.1vw, 0.95rem) clamp(0.9rem, 1.5vw, 1.35rem); }
   .activate-sub__icon{ width:clamp(2.6rem, 3vw, 3.4rem); height:clamp(2.6rem, 3vw, 3.4rem); }
   .activate-sub__title{ font-size:clamp(0.9rem, 1vw, 1.2rem); }
   .activate-sub__desc{ font-size:clamp(0.72rem, 0.8vw, 0.9rem); }
   .activate-sub__btn{ padding:clamp(0.5rem, 0.85vw, 0.75rem) clamp(0.85rem, 1.5vw, 1.4rem); font-size:clamp(0.78rem, 0.85vw, 0.95rem); }
}

@media (max-width: 767px){
   .activate-screen.show{
      justify-content:flex-start;
      align-items:center;
      gap:clamp(1rem, 2.6vh, 1.75rem);
      padding:1.3rem 1rem 6rem;
      overflow-y:auto;
   }
   .activate-screen__bg{
      top:0;
      left:50%;
      width:auto;
      height:130vw;
      max-width:none;
      opacity:0.5;
      filter:none;
      transform-origin:center center;
      transform:translate(-50%, -38%) rotate(90deg);
   }
   .activate-screen__inner{
      flex-direction:column;
      align-items:center;
      gap:clamp(1.25rem, 3vh, 2rem);
      width:100%;
      max-width:24rem;
      padding:0;
   }
   .activate-screen__items .item{ width:clamp(13rem, 58vw, 17rem); }
   .activate-screen__items .item__top{ font-size:clamp(1rem, 4.4vw, 1.5rem); }
   .activate-screen__items .item__icon{ height:1.25rem; }
   .activate-screen__items .item__exterior{ font-size:clamp(1.15rem, 5.2vw, 1.65rem); padding:0.8rem 0.6rem 0.9rem; }
   .activate-screen__items .item__ext-icon{ height:1rem; }
   .activate-screen__panel{
      align-items:center;
      text-align:center;
      gap:clamp(1rem, 2.4vh, 1.6rem);
      max-width:100%;
   }
   .activate-screen__title{
      text-align:center;
      white-space:nowrap;
      font-size:clamp(1.4rem, 6.5vw, 2.4rem);
   }
   .activate-screen__title br{ display:none; }
   .activate-screen__reward{
      align-self:center;
      max-width:22rem;
   }
   .activate-screen__reward-icon{
      left:8px;
   }

   .activate-screen__reward p{ font-size:1.05rem; line-height:1.4; }
   .activate-screen__btn{
      width:auto;
      max-width:100%;
      padding:0.95rem 3rem;
   }
   .activate-screen__hint{
      white-space:nowrap;
      font-size:0.8rem;
      padding:0;
   }

      .activate-screen__hint img{
         width:1rem !important;
         height:1rem !important;
      }
   .activate-screen__hint span br{ display:none; }
   .activate-screen__subs{
      width:100%;
      max-width:24rem;
      padding:0;
   }
   .activate-sub{
      flex-wrap:nowrap;
      gap:0.6rem;
      padding:0.6rem 0.7rem;
   }
   .activate-sub__icon{ width:2.5rem; height:2.5rem; }
   .activate-sub__text{ flex:1 1 auto; min-width:0; }
   .activate-sub__title{ font-size:0.9rem; }
   .activate-sub__desc{ font-size:0.67rem; line-height:1.25; padding-right:5px;}
   .activate-sub__desc br{ display:none; }
   .activate-sub__btn{ flex-shrink:0; padding:0.5rem 0.7rem; font-size:0.72rem; }
   .activate-screen.show .activate-screen__bg{
      animation:activate-bg-in-top 1.1s cubic-bezier(0.22, 0.61, 0.36, 1) 0.1s both;
   }
   .activate-screen.show .activate-screen__items .item.show{
      animation:activate-prize-in-top 1.2s cubic-bezier(0.22, 0.61, 0.36, 1) 0.85s both;
   }
}