@font-face {
    font-family: 'Google Sans';
    src: url(../fonts/GoogleSans/GoogleSans-MediumItalic.eot);
    src: local('Google Sans Medium Italic'), local('GoogleSans-MediumItalic'), url(../fonts/GoogleSans/GoogleSans-MediumItalic.eot?#iefix) format('embedded-opentype'), url(../fonts/GoogleSans/GoogleSans-MediumItalic.woff2) format('woff2'), url(../fonts/GoogleSans/GoogleSans-MediumItalic.woff) format('woff'), url(../fonts/GoogleSans/GoogleSans-MediumItalic.ttf) format('truetype');
    font-weight: 500;
    font-style: italic;
    font-display: swap
}

@font-face {
    font-family: 'Google Sans';
    src: url(../fonts/GoogleSans/GoogleSans-Bold.eot);
    src: local('Google Sans Bold'), local('GoogleSans-Bold'), url(../fonts/GoogleSans/GoogleSans-Bold.eot?#iefix) format('embedded-opentype'), url(../fonts/GoogleSans/GoogleSans-Bold.woff2) format('woff2'), url(../fonts/GoogleSans/GoogleSans-Bold.woff) format('woff'), url(../fonts/GoogleSans/GoogleSans-Bold.ttf) format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: 'Google Sans';
    src: url(../fonts/GoogleSans/GoogleSans-Italic.eot);
    src: local('Google Sans Italic'), local('GoogleSans-Italic'), url(../fonts/GoogleSans/GoogleSans-Italic.eot?#iefix) format('embedded-opentype'), url(../fonts/GoogleSans/GoogleSans-Italic.woff2) format('woff2'), url(../fonts/GoogleSans/GoogleSans-Italic.woff) format('woff'), url(../fonts/GoogleSans/GoogleSans-Italic.ttf) format('truetype');
    font-weight: 400;
    font-style: italic;
    font-display: swap
}

@font-face {
    font-family: 'Google Sans';
    src: url(../fonts/GoogleSans/GoogleSans-Medium.eot);
    src: local('Google Sans Medium'), local('GoogleSans-Medium'), url(../fonts/GoogleSans/GoogleSans-Medium.eot?#iefix) format('embedded-opentype'), url(../fonts/GoogleSans/GoogleSans-Medium.woff2) format('woff2'), url(../fonts/GoogleSans/GoogleSans-Medium.woff) format('woff'), url(../fonts/GoogleSans/GoogleSans-Medium.ttf) format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: 'Google Sans';
    src: url(../fonts/GoogleSans/GoogleSans-Regular.eot);
    src: local('Google Sans Regular'), local('GoogleSans-Regular'), url(../fonts/GoogleSans/GoogleSans-Regular.eot?#iefix) format('embedded-opentype'), url(../fonts/GoogleSans/GoogleSans-Regular.woff2) format('woff2'), url(../fonts/GoogleSans/GoogleSans-Regular.woff) format('woff'), url(../fonts/GoogleSans/GoogleSans-Regular.ttf) format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: 'Google Sans';
    src: url(../fonts/GoogleSans/GoogleSans-BoldItalic.eot);
    src: local('Google Sans Bold Italic'), local('GoogleSans-BoldItalic'), url(../fonts/GoogleSans/GoogleSans-BoldItalic.eot?#iefix) format('embedded-opentype'), url(../fonts/GoogleSans/GoogleSans-BoldItalic.woff2) format('woff2'), url(../fonts/GoogleSans/GoogleSans-BoldItalic.woff) format('woff'), url(../fonts/GoogleSans/GoogleSans-BoldItalic.ttf) format('truetype');
    font-weight: 700;
    font-style: italic;
    font-display: swap
}

@font-face {
    font-family: 'Material Icons';
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/GoogleMaterialIcons/iconsfont.woff2) format('woff2');
    font-display: swap
}

.material-icons {
    font-family: 'Material Icons', serif;
    font-weight: 400;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased
}

@-webkit-keyframes notyf-fadeinup {
    0% {
        opacity: 0;
        transform: translateY(25%)
    }

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

@keyframes notyf-fadeinup {
    0% {
        opacity: 0;
        transform: translateY(25%)
    }

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

@-webkit-keyframes notyf-fadeinleft {
    0% {
        opacity: 0;
        transform: translateX(25%)
    }

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

@keyframes notyf-fadeinleft {
    0% {
        opacity: 0;
        transform: translateX(25%)
    }

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

@-webkit-keyframes notyf-fadeoutright {
    0% {
        opacity: 1;
        transform: translateX(0)
    }

    to {
        opacity: 0;
        transform: translateX(25%)
    }
}

@keyframes notyf-fadeoutright {
    0% {
        opacity: 1;
        transform: translateX(0)
    }

    to {
        opacity: 0;
        transform: translateX(25%)
    }
}

@-webkit-keyframes notyf-fadeoutdown {
    0% {
        opacity: 1;
        transform: translateY(0)
    }

    to {
        opacity: 0;
        transform: translateY(25%)
    }
}

@keyframes notyf-fadeoutdown {
    0% {
        opacity: 1;
        transform: translateY(0)
    }

    to {
        opacity: 0;
        transform: translateY(25%)
    }
}

@-webkit-keyframes ripple {
    0% {
        transform: scale(0) translateY(-45%) translateX(13%)
    }

    to {
        transform: scale(1) translateY(-45%) translateX(13%)
    }
}

@keyframes ripple {
    0% {
        transform: scale(0) translateY(-45%) translateX(13%)
    }

    to {
        transform: scale(1) translateY(-45%) translateX(13%)
    }
}

.notyf {
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    color: #fff;
    z-index: 9999;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: flex-end;
    pointer-events: none;
    box-sizing: border-box;
    padding: 20px
}

.notyf__icon--error,
.notyf__icon--success {
    height: 21px;
    width: 21px;
    background: #fff;
    border-radius: 50%;
    display: block;
    margin: 0 auto;
    position: relative
}

.notyf__icon--error:after,
.notyf__icon--error:before {
    content: "";
    background: currentColor;
    display: block;
    position: absolute;
    width: 3px;
    border-radius: 3px;
    left: 9px;
    height: 12px;
    top: 5px
}

.notyf__icon--error:after {
    transform: rotate(-45deg)
}

.notyf__icon--error:before {
    transform: rotate(45deg)
}

.notyf__icon--success:after,
.notyf__icon--success:before {
    content: "";
    background: currentColor;
    display: block;
    position: absolute;
    width: 3px;
    border-radius: 3px
}

.notyf__icon--success:after {
    height: 6px;
    transform: rotate(-45deg);
    top: 9px;
    left: 6px
}

.notyf__icon--success:before {
    height: 11px;
    transform: rotate(45deg);
    top: 5px;
    left: 10px
}

.notyf__toast {
    display: block;
    overflow: hidden;
    pointer-events: auto;
    -webkit-animation: notyf-fadeinup .3s ease-in forwards;
    animation: notyf-fadeinup .3s ease-in forwards;
    box-shadow: 0 3px 7px 0 rgba(0, 0, 0, .25);
    position: relative;
    padding: 0 15px;
    border-radius: 2px;
    max-width: 300px;
    transform: translateY(25%);
    box-sizing: border-box;
    flex-shrink: 0
}

.notyf__toast--disappear {
    transform: translateY(0);
    -webkit-animation: notyf-fadeoutdown .3s forwards;
    animation: notyf-fadeoutdown .3s forwards;
    -webkit-animation-delay: .25s;
    animation-delay: .25s
}

.notyf__toast--disappear .notyf__icon,
.notyf__toast--disappear .notyf__message {
    -webkit-animation: notyf-fadeoutdown .3s forwards;
    animation: notyf-fadeoutdown .3s forwards;
    opacity: 1;
    transform: translateY(0)
}

.notyf__toast--disappear .notyf__dismiss {
    -webkit-animation: notyf-fadeoutright .3s forwards;
    animation: notyf-fadeoutright .3s forwards;
    opacity: 1;
    transform: translateX(0)
}

.notyf__toast--disappear .notyf__message {
    -webkit-animation-delay: .05s;
    animation-delay: .05s
}

.notyf__toast--upper {
    margin-bottom: 20px
}

.notyf__toast--lower {
    margin-top: 20px
}

.notyf__toast--dismissible .notyf__wrapper {
    padding-right: 30px
}

.notyf__ripple {
    height: 400px;
    width: 400px;
    position: absolute;
    transform-origin: bottom right;
    right: 0;
    top: 0;
    border-radius: 50%;
    transform: scale(0) translateY(-51%) translateX(13%);
    z-index: 5;
    -webkit-animation: ripple .4s ease-out forwards;
    animation: ripple .4s ease-out forwards
}

.notyf__wrapper {
    display: flex;
    align-items: center;
    padding-top: 17px;
    padding-bottom: 17px;
    padding-right: 15px;
    border-radius: 3px;
    position: relative;
    z-index: 10
}

.notyf__icon {
    width: 22px;
    text-align: center;
    font-size: 1.3em;
    opacity: 0;
    -webkit-animation: notyf-fadeinup .3s forwards;
    animation: notyf-fadeinup .3s forwards;
    -webkit-animation-delay: .3s;
    animation-delay: .3s;
    margin-right: 13px
}

.notyf__dismiss {
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 26px;
    margin-right: -15px;
    -webkit-animation: notyf-fadeinleft .3s forwards;
    animation: notyf-fadeinleft .3s forwards;
    -webkit-animation-delay: .35s;
    animation-delay: .35s;
    opacity: 0
}

.notyf__dismiss-btn {
    background-color: rgba(0, 0, 0, .25);
    border: none;
    cursor: pointer;
    transition: opacity .2s ease, background-color .2s ease;
    outline: 0;
    opacity: .35;
    height: 100%;
    width: 100%
}

.notyf__dismiss-btn:after,
.notyf__dismiss-btn:before {
    content: "";
    background: #fff;
    height: 12px;
    width: 2px;
    border-radius: 3px;
    position: absolute;
    left: calc(50% - 1px);
    top: calc(50% - 5px)
}

.notyf__dismiss-btn:after {
    transform: rotate(-45deg)
}

.notyf__dismiss-btn:before {
    transform: rotate(45deg)
}

.notyf__dismiss-btn:hover {
    opacity: .7;
    background-color: rgba(0, 0, 0, .15)
}

.notyf__dismiss-btn:active {
    opacity: .8
}

.notyf__message {
    vertical-align: middle;
    position: relative;
    opacity: 0;
    -webkit-animation: notyf-fadeinup .3s forwards;
    animation: notyf-fadeinup .3s forwards;
    -webkit-animation-delay: .25s;
    animation-delay: .25s;
    line-height: 1.5em
}

@media only screen and (max-width:480px) {
    .notyf {
        padding: 0
    }

    .notyf__ripple {
        height: 600px;
        width: 600px;
        -webkit-animation-duration: .5s;
        animation-duration: .5s
    }

    .notyf__toast {
        max-width: none;
        border-radius: 0;
        box-shadow: 0 -2px 7px 0 rgba(0, 0, 0, .13);
        width: 100%
    }

    .notyf__dismiss {
        width: 56px
    }
}

*,
::after,
::before {
    box-sizing: border-box
}

ol[class],
ul[class] {
    padding: 0
}

blockquote,
body,
dd,
dl,
figcaption,
figure,
h1,
h2,
h3,
h4,
h5,
h6,
li,
ol[class],
p,
ul[class] {
    margin: 0
}

body {
    scroll-behavior: smooth;
    text-rendering: optimizeSpeed
}

ol[class],
ul[class] {
    list-style: none
}

a:not([class]) {
    -webkit-text-decoration-skip: ink;
    text-decoration-skip-ink: auto
}

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

article>*+* {
    margin-top: 0
}

button,
input,
select,
textarea {
    font: inherit
}

@media (prefers-reduced-motion:reduce) {
    * {
        animation-duration: 0s !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0s !important;
        scroll-behavior: auto !important
    }
}

.container {
    width: 100%;
    margin-right: auto;
    margin-left: auto
}

@media (min-width:320px) {
    .container {
        max-width: 300px
    }
}

@media (min-width:480px) {
    .container {
        max-width: 460px
    }
}

@media (min-width:640px) {
    .container {
        max-width: 620px
    }
}

@media (min-width:960px) {
    .container {
        max-width: 940px
    }
}

@media (min-width:1200px) {
    .container {
        max-width: 1160px
    }
}

@media (min-width:1350px) {
    .container {
        max-width: 1280px
    }
}

@media (min-width:320px) and (max-width:479px) {
    .container {
        max-width: 100%;
        padding: 0 20px
    }
}

body {
    position: relative;
    font-family: "Google Sans", sans-serif;
    background-color: #191c2d;
    padding-top: 90px
}

a {
    text-decoration: none;
    color: #fff
}

.btn {
    outline: 0;
    cursor: pointer;
    text-decoration: none;
    border: 2px transparent solid;
    border-radius: 12px;
    padding: 16px 28px;
    font-size: 16px;
    transition: all .2s ease
}

.btn-magic {
    color: #fff;
    background-color: #6542ff;
    border: 2px #6542ff solid
}

.btn-magic:hover {
    background-color: #402aa5;
    border: 2px #402aa5 solid
}

.btn-magic[disabled] {
    background-color: #402aa5;
    border: 2px #402aa5 solid;
    cursor: not-allowed
}

.btn-white {
    color: #6542ff;
    background-color: #fff;
    border: 2px #fff solid;
    transition: color .2s ease, border-color .2s ease, background-color .2s ease
}

.btn-white:hover {
    color: #fff;
    background-color: #6542ff;
    border: 2px #6542ff solid
}

.btn-light {
    background-color: transparent;
    border: 2px #33395c solid;
    color: #fff
}

.btn-opacity {
    opacity: .7;
    transition: opacity .2s ease
}

.btn-opacity:hover {
    opacity: 1
}

.btn-opacity.active {
    background-color: #6542ff;
    border: 2px #6542ff solid;
    opacity: 1
}

.btn-flare {
    position: relative;
    overflow-x: hidden
}

.btn-flare .flare {
    position: absolute;
    top: 0;
    height: 100%;
    width: 60px;
    transform: skewX(-45deg);
    left: -150%;
    animation: flareAnimation 3s infinite ease
}

.btn-flare-white .flare {
    background: linear-gradient(90deg, rgba(255, 255, 255, .1), rgba(255, 255, 255, .4))
}

.btn-flare-magic .flare {
    background: linear-gradient(90deg, rgba(101, 66, 255, .14), rgba(101, 66, 255, 0))
}

@keyframes flareAnimation {
    0% {
        left: -150%
    }

    100% {
        left: 150%
    }
}

.btn-error {
    color: #fff;
    background-color: #ff4d4d;
    border: 2px #ff4d4d solid;
    transition: color .2s ease, border-color .2s ease, background-color .2s ease
}

.btn-error:hover {
    color: #fff;
    background-color: #f74646;
    border: 2px #f74646 solid
}

.perspective {
    perspective: 500px;
    perspective-origin: calc(50% + 120px) 50%
}

.d-block {
    display: block
}

.magic-success-noty-f {
    border: 2px solid #304820;
    border-radius: 8px;
    font-size: 14px
}

.magic-success-noty-f .notyf__wrapper {
    padding: 10px
}

.magic-error-noty-f {
    border: 2px solid rgba(255, 17, 0, .6588235294);
    border-radius: 8px;
    font-size: 14px
}

.magic-error-noty-f .notyf__wrapper {
    padding: 10px
}

.magic-word {
    position: relative;
    cursor: pointer
}

.magic-word::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    border: 1px dashed #6542ff;
    transition: border .2s ease
}

.magic-word:hover::before {
    border: 1px solid #6542ff
}

.alert {
    padding: 16px;
    color: #fff
}

.alert-info {
    background-color: #161827;
    border-radius: 16px
}

.scroll-off {
    height: 100%;
    overflow-y: hidden
}

@media (min-width:1200px) {
    .scroll-off {
        padding-right: 10px
    }

    .scroll-off .header-top {
        padding-right: 10px
    }

    .scroll-off .magic-cookie {
        left: calc(50% - 5px)
    }
}

.notyf__toast--dismissible .notyf__message {
    padding-right: 15px
}

.notyf__toast--dismissible .notyf__wrapper {
    padding-left: 0
}

.arrow-top {
    position: fixed;
    right: 20px;
    bottom: 20px;
    border: 1px solid rgba(51, 57, 92, .5019607843);
    border-radius: 50%;
    width: 44px;
    height: 44px;
    z-index: 4;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    opacity: 0;
    transition: background-color .2s ease, opacity .2s ease
}

.arrow-top:hover {
    background-color: rgba(51, 57, 92, .5019607843)
}

@media (min-width:320px) and (max-width:479px) {
    .arrow-top {
        display: none
    }
}

.border-error {
    border: 2px rgba(177, 57, 57, .5) solid !important
}

.border-success {
    border: 2px rgba(110, 168, 68, .5294117647) solid !important
}

.body-gradient {
    background: radial-gradient(106.1% 62.12% at 13.15% 49.99%, #1e233f 0, #10111e 100%)
}

::-webkit-resizer {
    background-repeat: no-repeat;
    width: 10px;
    height: 0
}

::-webkit-scrollbar {
    width: 10px
}

::-webkit-scrollbar-button {
    background-repeat: no-repeat;
    width: 5px;
    height: 0
}

::-webkit-scrollbar-thumb {
    border-radius: 0;
    background-color: #4c568a;
    -webkit-transition: .5s;
    transition: .5s
}

::-webkit-scrollbar-track {
    background-color: #33395c
}

.fade-in-fwd {
    animation: fade-in-fwd .5s cubic-bezier(.77, 0, .175, 1) both
}

.fade-in-fwd-fast {
    animation: fade-in-fwd .2s cubic-bezier(.77, 0, .175, 1) both
}

@keyframes fade-in-fwd {
    0% {
        transform: translateZ(-80px);
        opacity: 0
    }

    100% {
        transform: translateZ(0);
        opacity: 1
    }
}

.fade-in {
    animation: fade-in .3s cubic-bezier(.39, .575, .565, 1) both
}

@keyframes fade-in {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

.fade-out {
    animation: fade-out .3s ease-out both
}

@keyframes fade-out {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0
    }
}

.shake-horizontal {
    animation: shake-horizontal .8s cubic-bezier(.455, .03, .515, .955) both
}

@keyframes shake-horizontal {

    0%,
    100% {
        transform: translateX(0)
    }

    10%,
    30%,
    50%,
    70% {
        transform: translateX(-10px)
    }

    20%,
    40%,
    60% {
        transform: translateX(10px)
    }

    80% {
        transform: translateX(8px)
    }

    90% {
        transform: translateX(-8px)
    }
}

.fade-in-once {
    opacity: 0;
    animation: fadeInOnce .2s forwards
}

@keyframes fadeInOnce {
    from {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

.magic-cookie {
    position: fixed;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, -25px);
    background-color: #161827;
    border: 2px solid #33395c;
    z-index: 10;
    border-radius: 8px;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 14px;
    gap: 16px;
    transition: transform .2s ease
}

@media (min-width:320px) and (max-width:479px) {
    .magic-cookie {
        width: 300px;
        font-size: 12px
    }
}

.magic-cookie.hide {
    transform: translate(-50%, 100%)
}

.magic-cookie__icon svg {
    width: 32px;
    height: 32px;
    display: flex
}

.magic-cookie__icon svg path {
    fill: #fff
}

.magic-cookie__text {
    color: #fff
}

.magic-cookie__btn {
    padding: 8px 20px;
    font-size: 14px;
    border-radius: 8px
}

.breadcrumbs {
    margin-top: 30px;
    margin-bottom: 40px
}

.breadcrumbs__nav ul {
    display: flex;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0
}

.breadcrumbs__nav ul li {
    display: flex;
    align-items: center;
    opacity: .6;
    transition: opacity .2s ease
}

.breadcrumbs__nav ul li.active {
    opacity: 1
}

.breadcrumbs__nav ul li:not(:first-of-type)::before {
    content: "";
    width: 12px;
    height: 12px;
    background-image: url(../img/icons/arrow-right.svg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    margin: 0 8px;
    opacity: .6
}

.breadcrumbs__nav ul li:hover:not(.active) {
    opacity: .8
}

.breadcrumbs__nav ul li a {
    display: flex;
    align-items: center
}

.breadcrumbs__nav ul li a img {
    width: 20px;
    height: 20px;
    margin-right: 6px
}

.aside {
    width: 340px;
    position: sticky;
    top: 120px;
    margin-right: 40px;
    border: 2px #33395c solid;
    padding: 8px;
    border-radius: 16px;
    flex-shrink: 0;
    transition: top .2s ease
}

@media (min-width:960px) and (max-width:1199px) {
    .aside {
        width: 310px;
        margin-right: 30px
    }
}

.aside.top {
    top: 30px
}

.aside__nav-label {
    color: #8990be;
    padding: 8px 16px;
    font-size: 14px
}

.aside__nav-title {
    font-size: 16px;
    line-height: 140%;
    color: #fff;
    padding: 0 16px;
    margin-bottom: 12px
}

.aside__nav-line {
    max-width: 292px;
    margin: 0 auto;
    width: 100%;
    height: 1px;
    background-color: #33395c
}

.aside__nav-list {
    margin-top: 16px !important
}

.aside__nav-list-item:not(:last-child) {
    margin-bottom: 6px
}

.aside li .information__nav-line {
    margin-bottom: 6px
}

.aside__nav-list-link {
    display: flex;
    align-items: flex-start;
    padding: 12px 16px;
    opacity: .7;
    border-radius: 8px;
    color: #fff;
    transition: opacity .2s ease, background-color .2s ease, color .2s ease
}

.aside__nav-list-link.active {
    background-color: #6542ff;
    opacity: 1
}

.aside__nav-list-link:hover:not(.active) {
    background-color: #33395c
}

.aside__nav-list-link-icon {
    margin-right: 12px
}

.aside__nav-list-link-icon img,
.aside__nav-list-link-icon svg {
    display: flex;
    width: 20px;
    height: 20px
}

.aside__nav-list-link-number {
    margin-right: 12px;
    font-weight: 700
}

.aside__nav-list-link-name {
    margin-bottom: 4px;
    font-size: 16px
}

.aside__nav-list-link-label {
    font-size: 14px;
    opacity: .7
}

.accordion {
    background-color: #262b44;
    border-radius: 16px;
    color: #fff;
    padding: 16px;
    width: 100%;
    transition: background-color .2s ease
}

.accordion:not(:last-child) {
    margin-bottom: 16px
}

.accordion.show {
    background-color: #10111c
}

.accordion.show .accordion__title-stage-icon svg {
    transform: rotate(0)
}

.accordion__title {
    display: flex;
    align-items: center;
    position: relative;
    cursor: pointer
}

.accordion__title-icon {
    padding: 8px;
    border-radius: 8px;
    background-color: #6542ff;
    display: flex;
    align-items: center;
    margin-right: 8px
}

.accordion__title-icon svg {
    width: 20px;
    height: 20px
}

.accordion__title-stage-icon {
    position: absolute;
    right: 0;
    top: 50%;
    padding: 8px;
    background-color: #262b44;
    border-radius: 8px;
    display: flex;
    align-items: center;
    transform: translate(0, -50%)
}

.accordion__title-stage-icon svg {
    width: 20px;
    height: 20px;
    transform: rotate(180deg);
    transition: transform .2s ease
}

.accordion__content {
    display: none;
    margin-top: 16px;
    line-height: 140%;
    font-size: 16px
}

.accordion__content p:not(:last-child) {
    margin-bottom: 12px
}

.accordion__content a {
    color: #6542ff
}

.commands-bind__item {
    display: flex;
    align-items: center
}

.commands-bind__item:not(:last-child) {
    margin-bottom: 10px
}

.commands-bind__item-icon {
    opacity: .7;
    cursor: pointer;
    margin-right: 4px;
    transition: opacity .2s ease
}

.commands-bind__item-icon:hover {
    opacity: 1
}

.commands-bind__item-icon svg {
    display: flex
}

.commands-bind__item-bind {
    margin-right: 6px
}

.commands-bind__item-label {
    opacity: .7
}

.accordion-list__item {
    position: relative;
    padding-left: 16px
}

.accordion-list__item:not(:last-child) {
    margin-bottom: 10px
}

.accordion-list__item::before {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #402aa5;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translate(0, -50%)
}

.accordion-list__item-label {
    color: #6542ff
}

.table-responsive {
    overflow-x: auto
}

.table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0 8px
}

.table * {
    text-align: left
}

.table th {
    padding: 16px 30px
}

@media (min-width:320px) and (max-width:639px) {
    .table th {
        padding: 12px 14px
    }
}

.table__head {
    color: #8990be
}

.table__head tr th {
    border: 1px #33395c solid
}

.table__head tr th:not(:first-child) {
    border-left: 0
}

.table__head tr th:not(:last-child) {
    border-right: 0
}

.table__head tr th:first-child {
    text-align: left;
    border-bottom-left-radius: 12px;
    border-top-left-radius: 12px
}

.table__head tr th:last-child {
    text-align: right;
    border-bottom-right-radius: 12px;
    border-top-right-radius: 12px
}

.table tbody tr {
    background-color: #262b44
}

.table tbody tr td {
    padding: 30px 30px;
    color: #fff
}

@media (min-width:320px) and (max-width:639px) {
    .table tbody tr td {
        padding: 12px 14px
    }
}

.table tbody tr td:first-child {
    text-align: left;
    border-bottom-left-radius: 12px;
    border-top-left-radius: 12px
}

.table tbody tr td:last-child {
    text-align: right;
    border-bottom-right-radius: 12px;
    border-top-right-radius: 12px
}

.table__rounded-start {
    border-bottom-left-radius: 12px;
    border-top-left-radius: 12px
}

.table__rounded-end {
    border-bottom-right-radius: 12px;
    border-top-right-radius: 12px
}

.pagination-container {
    display: flex;
    justify-content: flex-end;
    margin-top: 20px
}

.pagination {
    display: flex;
    align-items: center;
    gap: 8px
}

@media (min-width:320px) and (max-width:639px) {
    .pagination {
        gap: 6px
    }
}

.pagination__btn {
    background-color: #0d0e17;
    color: #4c568a;
    padding: 8px 12px;
    display: flex;
    align-items: center;
    min-height: 40px
}

@media (min-width:320px) and (max-width:639px) {
    .pagination__btn {
        padding: 8px 10px
    }
}

.pagination__btn.current {
    color: #fff;
    background-color: #6542ff
}

.pagination__dots {
    background-color: #0d0e17;
    color: #4c568a
}

.form-control-group {
    position: relative
}

.form-control {
    background-color: #161827;
    border-radius: 8px;
    border: none;
    padding: 14px 16px 14px 40px;
    color: #fff
}

.form-control-icon {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translate(12px, -50%)
}

.form-control-icon svg {
    display: flex
}

.form-control-label {
    color: #8990be;
    margin-bottom: 10px
}

.form-check {
    display: flex;
    align-items: center;
    gap: 8px
}

.form-check:not(:last-child) {
    margin-bottom: 12px
}

.form-check-input {
    cursor: pointer
}

.form-check-label {
    cursor: pointer;
    color: #d1d4e6
}

.form-check-input {
    margin: 0
}

.form-check-input:checked[type=checkbox] {
    background-image: url(../img/icons/check.svg)
}

.form-check-input:checked[type=radio] {
    background-image: url(../img/icons/circle.svg)
}

.form-check-input:checked {
    background-color: #6542ff
}

.form-check-input[type=checkbox] {
    border-radius: 4px
}

.form-check-input[type=radio] {
    border-radius: 50%
}

.form-check-input {
    width: 16px;
    height: 16px;
    background-color: #262b44;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

.modal {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .2s ease, visibility .2s ease, z-index .2s ease;
    background-color: rgba(0, 0, 0, .7019607843);
    overflow-x: hidden;
    overflow-y: auto
}

@media (min-width:0) and (max-width:550px) {
    .modal {
        padding: 0 20px
    }
}

.modal__flex {
    display: flex;
    align-items: center;
    min-height: 100%
}

.modal.modal-on {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    z-index: 15
}

@media (min-width:1200px) {
    .modal {
        padding-right: 10px
    }

    .modal::-webkit-scrollbar {
        width: 0
    }
}

.modal__container {
    width: 585px;
    background: #161827;
    margin: 40px auto;
    border-radius: 16px;
    overflow: hidden;
    transition: opacity .2s ease
}

@media (min-width:0) and (max-width:600px) {
    .modal__container {
        width: 100%;
        margin: 40px auto
    }
}

.modal__wrapper {
    position: relative
}

.modal__close {
    position: absolute;
    right: 30px;
    top: 30px;
    opacity: .5;
    transition: opacity .2s ease;
    cursor: pointer;
    background-color: #262b44;
    padding: 8px;
    border-radius: 8px
}

.modal__close svg {
    display: flex
}

.modal__close:hover {
    opacity: 1
}

.modal__body {
    padding: 80px 70px
}

@media (min-width:0) and (max-width:550px) {
    .modal__body {
        padding: 30px 20px
    }
}

.modal__preloader {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #121421;
    z-index: 2;
    border-radius: 16px;
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .2s ease, visibility .2s ease, transform .2s ease
}

.modal__preloader.show {
    opacity: 1;
    visibility: visible;
    pointer-events: initial
}

.modal__preloader svg {
    width: 80px;
    height: 80px
}

.modal__title {
    font-weight: 700;
    font-size: 25px;
    line-height: 141.9%;
    text-align: center;
    color: #fff;
    margin-bottom: 15px
}

@media (min-width:0) and (max-width:550px) {
    .modal__title {
        margin-bottom: 10px;
        font-size: 20px
    }
}

.modal__subtitle {
    font-weight: 500;
    font-size: 18px;
    line-height: 132.4%;
    text-align: center;
    color: #fff;
    margin-bottom: 30px
}

@media (min-width:0) and (max-width:550px) {
    .modal__subtitle {
        font-size: 14px;
        margin-bottom: 20px
    }
}

.modal__btn {
    font-weight: 500;
    font-size: 18px;
    padding: 18px 20px
}

@media (min-width:0) and (max-width:550px) {
    .modal__btn {
        font-size: 16px;
        padding: 11.5px 20px
    }
}

.modal-product__alert {
    display: flex;
    background-color: rgba(255, 172, 77, .0509803922);
    color: #ffac4d;
    padding: 8px 12px;
    gap: 4px;
    border-radius: 8px
}

.modal-product__alert svg {
    flex-shrink: 0
}

.modal-simple-cmd .modal__body {
    padding: 50px 50px
}

@media (min-width:320px) and (max-width:479px) {
    .modal-simple-cmd .modal__body {
        padding: 20px 20px
    }
}

.modal-simple-cmd__title {
    color: #fff;
    font-size: 24px;
    line-height: 120%;
    letter-spacing: -.48px;
    margin-bottom: 12px;
    margin-top: -10px;
    font-weight: 700
}

@media (min-width:320px) and (max-width:479px) {
    .modal-simple-cmd__title {
        font-size: 20px;
        margin-top: 16px
    }
}

.modal-simple-cmd__image-container {
    display: flex;
    justify-content: center
}

.modal-simple-cmd__image {
    max-width: 300px;
    max-height: 300px
}

@media (min-width:320px) and (max-width:380px) {
    .modal-simple-cmd__image {
        max-width: 100%;
        max-height: -moz-max-content;
        max-height: max-content
    }
}

.modal-simple-cmd__description {
    margin-bottom: 30px;
    color: #5f689e
}

.modal-simple-cmd__description p:not(:last-child) {
    margin-bottom: 12px
}

.modal-simple-cmd__btn {
    width: 100%
}

.modal-simple-cmd__btn-auth {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px
}

.modal-simple-cmd__btn-auth svg {
    width: 24px;
    height: 24px
}

.modal-kit .modal__body {
    padding: 50px 50px
}

@media (min-width:320px) and (max-width:479px) {
    .modal-kit .modal__body {
        padding: 20px 20px
    }
}

.modal-kit__title {
    color: #fff;
    font-size: 24px;
    line-height: 120%;
    letter-spacing: -.48px;
    margin-bottom: 30px;
    margin-top: -10px;
    font-weight: 700
}

@media (min-width:320px) and (max-width:479px) {
    .modal-kit__title {
        font-size: 20px;
        margin-top: 16px
    }
}

.modal-kit__items {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 30px
}

.modal-kit__item {
    width: calc(25% - 8px);
    background-color: #191c2d;
    border-radius: 8px;
    overflow: hidden;
    position: relative;
    padding: 15px
}

@media (min-width:320px) and (max-width:479px) {
    .modal-kit__item {
        width: calc(33% - 8px)
    }
}

.modal-kit__item.loading {
    min-height: 113px
}

.modal-kit__item.loading::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, #191c2d 25%, #262b44 50%, #191c2d 75%);
    background-size: 200% 100%;
    animation: skeleton-loading 2.5s linear infinite
}

.modal-kit__item.loading img {
    opacity: 0
}

.modal-kit__item-img {
    width: 100%;
    transition: opacity .2s ease
}

.modal-kit__item-quantity {
    position: absolute;
    z-index: 1;
    bottom: 10px;
    right: 10px;
    color: #fff
}

@media (min-width:320px) and (max-width:479px) {
    .modal-kit__item-quantity {
        font-size: 12px
    }
}

.modal-kit__btn {
    width: 100%
}

.modal-kit__btn-auth {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px
}

.modal-kit__btn-auth svg {
    width: 24px;
    height: 24px
}

.modal-extend-cmd .modal__container {
    width: 800px
}

@media (min-width:320px) and (max-width:799px) {
    .modal-extend-cmd .modal__container {
        width: 100%
    }
}

.modal-extend-cmd .modal__body {
    padding: 30px 30px
}

@media (min-width:320px) and (max-width:479px) {
    .modal-extend-cmd .modal__body {
        padding: 20px 20px
    }
}

.modal-extend-cmd__title {
    color: #fff;
    font-size: 24px;
    line-height: 120%;
    letter-spacing: -.48px;
    margin-bottom: 30px;
    margin-top: 10px;
    font-weight: 700
}

@media (min-width:320px) and (max-width:479px) {
    .modal-extend-cmd__title {
        font-size: 20px;
        margin-top: 16px
    }
}

.modal-extend-cmd__row {
    display: flex;
    gap: 16px
}

@media (min-width:320px) and (max-width:799px) {
    .modal-extend-cmd__row {
        flex-wrap: wrap
    }
}

.modal-extend-cmd__col-left {
    width: 240px;
    flex-shrink: 0
}

@media (min-width:320px) and (max-width:799px) {
    .modal-extend-cmd__col-left {
        width: 100%
    }
}

.modal-extend-cmd__img-container {
    padding: 16px;
    border-radius: 16px;
    border: 2px #272a41 solid;
    background: radial-gradient(50% 50% at 50% 50%, rgba(39, 42, 65, .2) 80%, rgba(25, 28, 45, .2) 100%), linear-gradient(180deg, #191c2d 0, #272a41 100%);
    overflow: hidden;
    margin-bottom: 20px
}

.modal-extend-cmd__img {
    max-width: 100%
}

.modal-extend-cmd__product-label {
    color: #d1d4e6;
    margin-bottom: 16px
}

.modal-extend-cmd__product-list {
    background-color: #191c2d;
    border-radius: 16px;
    padding: 16px;
    color: #8990be
}

.modal-extend-cmd__product-list ul {
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: 14px
}

.modal-extend-cmd__product-list ul li {
    padding: 10px 0
}

.modal-extend-cmd__product-list ul li:not(:last-child) {
    border-bottom: 1px rgba(51, 57, 92, .5019607843) solid
}

@media (min-width:320px) and (max-width:799px) {
    .modal-extend-cmd__col-right {
        width: 100%
    }
}

.modal-extend-cmd__extra {
    max-height: 450px;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 10px;
    margin-top: 20px
}

@media (min-height:1000px) {
    .modal-extend-cmd__extra {
        max-height: 615px
    }
}

.modal-extend-cmd__extra::-webkit-scrollbar {
    width: 5px
}

.modal-extend-cmd__extra::-webkit-scrollbar-thumb {
    border-radius: 3px
}

.modal-extend-cmd__extra::-webkit-scrollbar-track {
    border-radius: 3px
}

.modal-extend-cmd__extra-item:nth-of-type(1) .modal-extend-cmd__extra-list-item {
    width: calc(25% - 8px)
}

.modal-extend-cmd__extra-item:not(:last-child) {
    margin-bottom: 20px
}

.modal-extend-cmd__extra-name {
    color: #d1d4e6;
    margin-bottom: 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px
}

@media (min-width:320px) and (max-width:479px) {
    .modal-extend-cmd__extra-name-title {
        font-size: 12px
    }
}

.modal-extend-cmd__extra-name-label {
    display: flex;
    align-items: center;
    color: #5f689e;
    gap: 3px
}

@media (min-width:320px) and (max-width:479px) {
    .modal-extend-cmd__extra-name-label {
        font-size: 12px
    }
}

.modal-extend-cmd__extra-name-label svg path {
    fill: #5f689e
}

.modal-extend-cmd__extra-list {
    display: flex;
    gap: 10px;
    flex-wrap: wrap
}

.modal-extend-cmd__extra-list-item {
    width: calc(20% - 8px);
    background-color: #191c2d;
    border-radius: 8px;
    overflow: hidden;
    position: relative;
    padding: 10px
}

.modal-extend-cmd__extra-list-item.loading {
    min-height: 109px
}

.modal-extend-cmd__extra-list-item.loading::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, #191c2d 25%, #262b44 50%, #191c2d 75%);
    background-size: 200% 100%;
    animation: skeleton-loading 2.5s linear infinite
}

.modal-extend-cmd__extra-list-item.loading img {
    opacity: 0
}

.modal-extend-cmd__extra-list-item img {
    transition: opacity .2s ease
}

.modal-extend-cmd__extra-list-item:hover .modal-extend-cmd__extra-list-item-label {
    opacity: 1;
    visibility: visible;
    pointer-events: auto
}

@media (min-width:320px) and (max-width:479px) {
    .modal-extend-cmd__extra-list-item {
        width: calc(33% - 8px) !important
    }
}

.modal-extend-cmd__extra-list-item[data-desc] {
    cursor: pointer
}

.modal-extend-cmd__extra-list-item[data-desc]::before {
    content: "";
    position: absolute;
    z-index: -1;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-size: 400% 400%;
    background: linear-gradient(38deg, #33395c 0, #584f9c 42%, #6146b0 62%, #442a74 100%);
    opacity: 0;
    transition: opacity .2s, background
}

.modal-extend-cmd__extra-list-item[data-desc]:hover {
    background-color: transparent
}

.modal-extend-cmd__extra-list-item[data-desc]:hover::before {
    opacity: 1
}

.modal-extend-cmd__extra-quantity {
    position: absolute;
    bottom: 6px;
    right: 6px;
    color: #fff;
    font-size: 12px
}

.modal-extend-cmd__btn-container {
    margin-top: 25px
}

.modal-extend-cmd__btn {
    width: 100%
}

.modal-extend-cmd__btn-auth {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px
}

.modal-extend-cmd__btn-auth svg {
    width: 24px;
    height: 24px
}

.modal-deposit .modal__body {
    padding: 30px
}

@media (min-width:320px) and (max-width:479px) {
    .modal-deposit .modal__body {
        padding: 20px 20px
    }
}

@media (min-width:320px) and (max-width:479px) {
    .modal-deposit .modal__close {
        right: 20px
    }
}

.modal-deposit__title {
    color: #fff;
    font-size: 24px;
    line-height: 120%;
    letter-spacing: -.48px;
    margin-bottom: 30px;
    margin-top: 10px;
    font-weight: 700
}

@media (min-width:320px) and (max-width:479px) {
    .modal-deposit__title {
        font-size: 18px;
        margin-top: 18px
    }
}

.modal-deposit__amount-control {
    width: 100%;
    border: 2px rgba(51, 57, 92, .5019607843) solid
}

.modal-deposit__amount-control::-webkit-inner-spin-button,
.modal-deposit__amount-control::-webkit-outer-spin-button {
    -webkit-appearance: none
}

.modal-deposit__amount-control:focus,
.modal-deposit__amount-control:hover {
    -webkit-appearance: none;
    appearance: none;
    -moz-appearance: textfield
}

.modal-deposit__amount-control:focus {
    outline: 0
}

.modal-deposit__currency-symbol {
    position: absolute;
    left: 16px;
    top: 50%;
    transform: translate(0, -50%);
    color: #fff;
    z-index: 2
}

.modal-deposit__currency {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translate(0, -50%);
    cursor: pointer;
    z-index: 2;
    padding: 10px;
    border-radius: 8px
}

.modal-deposit__currency.show .modal-deposit__currency-list {
    opacity: 1;
    visibility: visible;
    pointer-events: initial;
    transform: translateY(12px)
}

.modal-deposit__currency.show .modal-deposit__currency-current svg {
    transform: rotate(180deg)
}

.modal-deposit__currency:hover {
    background-color: #5f689e
}

.modal-deposit__currency-current {
    text-transform: uppercase;
    color: #fff;
    display: flex;
    align-items: center;
    gap: 4px
}

.modal-deposit__currency-current svg {
    transition: transform .2s ease
}

.modal-deposit__currency-list {
    position: absolute;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    z-index: 10;
    transform: translateY(-10px);
    min-width: -moz-max-content;
    min-width: max-content;
    right: 0;
    max-width: 150px;
    background-color: #4c568a;
    width: 100%;
    border-radius: 8px;
    text-transform: uppercase;
    overflow: hidden;
    transition: opacity .2s ease, visibility .2s ease, transform .2s ease
}

.modal-deposit__currency-list-item {
    padding: 5px 10px;
    color: #fff
}

.modal-deposit__currency-list-item.active {
    background-color: #8990be
}

.modal-deposit__bonus {
    background-color: #0d0e17;
    border-radius: 16px;
    padding: 16px;
    margin-top: 25px;
    margin-bottom: 30px
}

@media (min-width:320px) and (max-width:479px) {
    .modal-deposit__bonus {
        padding: 10px
    }
}

.modal-deposit__bonus-title {
    display: flex;
    align-items: center;
    color: #fff;
    gap: 8px;
    font-size: 22px;
    font-weight: 600;
    margin-bottom: 12px
}

@media (min-width:320px) and (max-width:479px) {
    .modal-deposit__bonus-title {
        font-size: 16px
    }
}

@media (min-width:320px) and (max-width:479px) {
    .modal-deposit__bonus-title img {
        width: 20px;
        height: 20px
    }
}

.modal-deposit__bonus-amount {
    display: flex;
    align-items: center;
    gap: 4px;
    border: 2px rgba(51, 57, 92, .5019607843) solid;
    padding: 6px;
    border-radius: 16px
}

@media (min-width:320px) and (max-width:479px) {
    .modal-deposit__bonus-amount {
        align-items: start
    }
}

.modal-deposit__bonus-amount-item {
    width: calc(20% - 8px);
    color: #fff;
    opacity: .8;
    transition: opacity .2s ease, background-color .2s ease;
    flex: 1;
    cursor: pointer
}

.modal-deposit__bonus-amount-item.active {
    opacity: 1
}

.modal-deposit__bonus-amount-item.active .modal-deposit__bonus-amount-percent {
    background-color: #6542ff
}

.modal-deposit__bonus-amount-item:hover .modal-deposit__bonus-amount-percent {
    background-color: #6542ff
}

.modal-deposit__bonus-amount-percent {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    height: 48px;
    font-weight: 600;
    margin-bottom: 8px;
    transition: background-color .2s ease
}

@media (min-width:320px) and (max-width:479px) {
    .modal-deposit__bonus-amount-percent {
        font-size: 14px
    }
}

.modal-deposit__promo {
    margin-bottom: 25px
}

.modal-deposit__promo-control {
    width: 100%;
    border: 2px rgba(51, 57, 92, .5019607843) solid;
    padding-left: 12px
}

.modal-deposit__promo-control:focus {
    outline: 0
}

.modal-deposit__promo-control-wrapper {
    position: relative
}

.modal-deposit__promo-control-wrapper::after,
.modal-deposit__promo-control-wrapper::before {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: visibility .2s ease, opacity .2s ease
}

.modal-deposit__promo-control-wrapper::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #8774b8;
    -webkit-mask-image: url("data:image/svg+xml;charset=UTF-8,%3csvg class='logo_holo' xmlns='http://www.w3.org/2000/svg' width='256' height='256' viewBox='0 0 256 256'%3e%3cdefs%3e%3cstyle%3e .logo_holo %7b filter: drop-shadow(0px 0px 10px %23FFF);%7d .char %7b fill: %23FFF0; stroke-width: 2; stroke: %23FFF;%7d .anim %7b animation: loading1 5s linear infinite;%7d .anim2 %7b animation: loading2 5s linear infinite;%7d %40keyframes loading1 %7b to%7b stroke-dashoffset: 0;%7d %7d %40keyframes loading2 %7b 0%25%7b opacity: 0.75;%7d 50%25%7b opacity: 0.25;%7d 100%25%7b opacity: 0.75;%7d %7d %3c/style%3e%3c/defs%3e%3cg transform='translate(26,230) scale(0.8,-0.8)'%3e%3cpath class='char anim2' style='stroke-dasharray: 1558;animation-duration: 2s;filter: drop-shadow(0px 0px 10px %23FFF);' d='M113.0 255.0 c-48.5 -6.2 -89.4 -38.9 -105.5 -84.3 -1.5 -4.3 -2.6 -7.9 -2.4 -8.2 0.3 -0.2 19.1 -1.8 41.9 -3.4 22.8 -1.7 43.8 -3.3 46.7 -3.7 l5.2 -0.5 20.0 39.8 c11.4 22.8 20.1 39.2 20.5 38.3 0.3 -0.8 3.7 -17.7 7.6 -37.5 3.9 -19.8 7.4 -37.0 7.7 -38.2 l.5 -2.3 31.4 0 31.4 0 -24.0 -23.7 -23.9 -23.8 8.4 -35.4 c4.7 -19.5 8.4 -35.5 8.3 -35.6 -0.2 -0.2 -13.5 12.3 -29.6 27.6 -16.1 15.3 -29.7 27.9 -30.2 27.9 -0.6 0 -14.6 -12.1 -31.3 -26.9 -16.6 -14.8 -30.3 -26.8 -30.5 -26.6 -0.1 0.1 3.6 17.0 8.2 37.6 4.6 20.6 8.3 37.5 8.2 37.6 -0.4 0.4 -78.7 16.3 -80.3 16.3 -1.4 0 -1.5 -1.3 -0.9 -9.7 2.3 -32.9 15.6 -61.5 39.0 -84.1 18.1 -17.5 38.6 -28.3 64.1 -33.8 11.1 -2.4 37.9 -2.4 49.0 0 26.7 5.8 46.9 16.7 65.6 35.5 19.0 18.9 29.9 39.3 35.6 66.1 2.4 11.6 2.4 36.2 -0.1 48.0 -5.6 27.0 -17.7 49.1 -37.0 67.8 -18.2 17.5 -39.3 28.6 -64.0 33.7 -9.4 1.9 -30.5 2.7 -39.6 1.5z'%3e%3c/path%3e%3cpath class='char anim' style='stroke-dasharray: 194.75;stroke-dashoffset: -1558;animation-duration: 5s;stroke-width: 2px;filter: drop-shadow(0px 0px 10px %23FFF);' d='M113.0 255.0 c-48.5 -6.2 -89.4 -38.9 -105.5 -84.3 -1.5 -4.3 -2.6 -7.9 -2.4 -8.2 0.3 -0.2 19.1 -1.8 41.9 -3.4 22.8 -1.7 43.8 -3.3 46.7 -3.7 l5.2 -0.5 20.0 39.8 c11.4 22.8 20.1 39.2 20.5 38.3 0.3 -0.8 3.7 -17.7 7.6 -37.5 3.9 -19.8 7.4 -37.0 7.7 -38.2 l.5 -2.3 31.4 0 31.4 0 -24.0 -23.7 -23.9 -23.8 8.4 -35.4 c4.7 -19.5 8.4 -35.5 8.3 -35.6 -0.2 -0.2 -13.5 12.3 -29.6 27.6 -16.1 15.3 -29.7 27.9 -30.2 27.9 -0.6 0 -14.6 -12.1 -31.3 -26.9 -16.6 -14.8 -30.3 -26.8 -30.5 -26.6 -0.1 0.1 3.6 17.0 8.2 37.6 4.6 20.6 8.3 37.5 8.2 37.6 -0.4 0.4 -78.7 16.3 -80.3 16.3 -1.4 0 -1.5 -1.3 -0.9 -9.7 2.3 -32.9 15.6 -61.5 39.0 -84.1 18.1 -17.5 38.6 -28.3 64.1 -33.8 11.1 -2.4 37.9 -2.4 49.0 0 26.7 5.8 46.9 16.7 65.6 35.5 19.0 18.9 29.9 39.3 35.6 66.1 2.4 11.6 2.4 36.2 -0.1 48.0 -5.6 27.0 -17.7 49.1 -37.0 67.8 -18.2 17.5 -39.3 28.6 -64.0 33.7 -9.4 1.9 -30.5 2.7 -39.6 1.5z'%3e%3c/path%3e%3cpath class='char anim' style='stroke-dasharray: 389.5;stroke-dashoffset: -1558;animation-duration: 7.5s;stroke-width: 4px;opacity: 0.75;filter: drop-shadow(0px 0px 10px %23FFF);' d='M113.0 255.0 c-48.5 -6.2 -89.4 -38.9 -105.5 -84.3 -1.5 -4.3 -2.6 -7.9 -2.4 -8.2 0.3 -0.2 19.1 -1.8 41.9 -3.4 22.8 -1.7 43.8 -3.3 46.7 -3.7 l5.2 -0.5 20.0 39.8 c11.4 22.8 20.1 39.2 20.5 38.3 0.3 -0.8 3.7 -17.7 7.6 -37.5 3.9 -19.8 7.4 -37.0 7.7 -38.2 l.5 -2.3 31.4 0 31.4 0 -24.0 -23.7 -23.9 -23.8 8.4 -35.4 c4.7 -19.5 8.4 -35.5 8.3 -35.6 -0.2 -0.2 -13.5 12.3 -29.6 27.6 -16.1 15.3 -29.7 27.9 -30.2 27.9 -0.6 0 -14.6 -12.1 -31.3 -26.9 -16.6 -14.8 -30.3 -26.8 -30.5 -26.6 -0.1 0.1 3.6 17.0 8.2 37.6 4.6 20.6 8.3 37.5 8.2 37.6 -0.4 0.4 -78.7 16.3 -80.3 16.3 -1.4 0 -1.5 -1.3 -0.9 -9.7 2.3 -32.9 15.6 -61.5 39.0 -84.1 18.1 -17.5 38.6 -28.3 64.1 -33.8 11.1 -2.4 37.9 -2.4 49.0 0 26.7 5.8 46.9 16.7 65.6 35.5 19.0 18.9 29.9 39.3 35.6 66.1 2.4 11.6 2.4 36.2 -0.1 48.0 -5.6 27.0 -17.7 49.1 -37.0 67.8 -18.2 17.5 -39.3 28.6 -64.0 33.7 -9.4 1.9 -30.5 2.7 -39.6 1.5z'%3e%3c/path%3e%3cpath class='char anim' style='stroke-dasharray: 779;stroke-dashoffset: -1558;animation-duration: 10s;stroke-width: 6px;opacity: 0.5;filter: drop-shadow(0px 0px 10px %23FFF);' d='M113.0 255.0 c-48.5 -6.2 -89.4 -38.9 -105.5 -84.3 -1.5 -4.3 -2.6 -7.9 -2.4 -8.2 0.3 -0.2 19.1 -1.8 41.9 -3.4 22.8 -1.7 43.8 -3.3 46.7 -3.7 l5.2 -0.5 20.0 39.8 c11.4 22.8 20.1 39.2 20.5 38.3 0.3 -0.8 3.7 -17.7 7.6 -37.5 3.9 -19.8 7.4 -37.0 7.7 -38.2 l.5 -2.3 31.4 0 31.4 0 -24.0 -23.7 -23.9 -23.8 8.4 -35.4 c4.7 -19.5 8.4 -35.5 8.3 -35.6 -0.2 -0.2 -13.5 12.3 -29.6 27.6 -16.1 15.3 -29.7 27.9 -30.2 27.9 -0.6 0 -14.6 -12.1 -31.3 -26.9 -16.6 -14.8 -30.3 -26.8 -30.5 -26.6 -0.1 0.1 3.6 17.0 8.2 37.6 4.6 20.6 8.3 37.5 8.2 37.6 -0.4 0.4 -78.7 16.3 -80.3 16.3 -1.4 0 -1.5 -1.3 -0.9 -9.7 2.3 -32.9 15.6 -61.5 39.0 -84.1 18.1 -17.5 38.6 -28.3 64.1 -33.8 11.1 -2.4 37.9 -2.4 49.0 0 26.7 5.8 46.9 16.7 65.6 35.5 19.0 18.9 29.9 39.3 35.6 66.1 2.4 11.6 2.4 36.2 -0.1 48.0 -5.6 27.0 -17.7 49.1 -37.0 67.8 -18.2 17.5 -39.3 28.6 -64.0 33.7 -9.4 1.9 -30.5 2.7 -39.6 1.5z'%3e%3c/path%3e%3c/g%3e%3c/svg%3e");
    background-size: contain;
    background-repeat: no-repeat;
    z-index: 2;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px)
}

.modal-deposit__promo-control-wrapper::after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    border-radius: 8px
}

.modal-deposit__promo-control-wrapper.loading::after,
.modal-deposit__promo-control-wrapper.loading::before {
    opacity: 1;
    visibility: visible;
    pointer-events: initial
}

.modal-deposit .apply-promo-code {
    position: absolute;
    border: none;
    background-color: #6ea844;
    color: #fff;
    right: 0;
    top: 50%;
    transform: translate(-10px, -50%);
    font-size: 14px;
    cursor: pointer;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: visibility .2s ease, opacity .2s ease;
    padding: 5px 10px;
    border-radius: 6px
}

.modal-deposit .apply-promo-code.show {
    opacity: 1;
    visibility: visible;
    pointer-events: initial
}

.modal-deposit__pay-type {
    width: 100%;
    border: 2px rgba(51, 57, 92, .5019607843) solid;
    padding-left: 12px;
    cursor: pointer;
    -webkit-appearance: none
}

.modal-deposit__pay-type::-ms-expand {
    display: none
}

.modal-deposit__pay-type:focus {
    outline: 0
}

.modal-deposit__bonus-amount-sum {
    text-align: center;
    margin-bottom: 10px
}

@media (min-width:320px) and (max-width:479px) {
    .modal-deposit__bonus-amount-sum {
        font-size: 12px
    }
}

.modal-deposit__result-cnt {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 30px;
    margin-top: 25px
}

@media (min-width:320px) and (max-width:479px) {
    .modal-deposit__result-cnt {
        font-size: 14px
    }
}

.modal-deposit__result-label {
    color: #8990be
}

.modal-deposit__result-col-amount {
    display: flex;
    align-items: center;
    gap: 4px
}

.modal-deposit__result-amount {
    color: #fff
}

.modal-deposit__result-bonus-amount span {
    background-color: #ffac4d;
    border-radius: 8px;
    color: #522c00;
    padding: 0 6px
}

.modal-deposit__button-group {
    display: flex;
    align-items: center;
    justify-content: flex-end
}

@media (min-width:320px) and (max-width:479px) {
    .modal-deposit__btn {
        width: 100%
    }
}

.modal-preloader {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    background-color: rgba(0, 0, 0, .5137254902);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 9;
    transition: opacity .2s ease, visibility .2s ease
}

.modal-on .modal-preloader.show {
    opacity: 1;
    visibility: visible;
    pointer-events: initial
}

.modal-preloader__body {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%
}

.modal-preloader__lds-ring {
    display: inline-block;
    position: relative;
    width: 80px;
    height: 80px
}

.modal-preloader__lds-ring div {
    display: block;
    position: absolute;
    width: 64px;
    height: 64px;
    margin: 8px;
    border-width: 8px;
    border-style: solid;
    border-radius: 50%;
    animation: lds-ring 1.2s cubic-bezier(.5, 0, .5, 1) infinite;
    border-color: #6542ff transparent transparent transparent
}

.modal-preloader__lds-ring div:nth-child(1) {
    animation-delay: -.45s
}

.modal-preloader__lds-ring div:nth-child(2) {
    animation-delay: -.3s
}

.modal-preloader__lds-ring div:nth-child(3) {
    animation-delay: -.15s
}

.modal-roulette .modal__container {
    width: 800px
}

@media (min-width:320px) and (max-width:799px) {
    .modal-roulette .modal__container {
        width: 100%
    }
}

.modal-roulette .modal__body {
    padding: 30px 30px
}

@media (min-width:320px) and (max-width:479px) {
    .modal-roulette .modal__body {
        padding: 20px 20px
    }
}

.modal-roulette__title {
    color: #fff;
    font-size: 24px;
    line-height: 120%;
    letter-spacing: -.48px;
    margin-bottom: 30px;
    margin-top: 10px;
    font-weight: 700
}

@media (min-width:320px) and (max-width:479px) {
    .modal-roulette__title {
        font-size: 20px;
        margin-top: 16px
    }
}

.modal-roulette .roulette {
    width: 100%;
    overflow: hidden;
    position: relative;
    border: 1px rgba(51, 57, 92, .5019607843) solid;
    border-radius: 16px;
    background-color: #161827;
    padding: 16px 0
}

.modal-roulette .roulette::after,
.modal-roulette .roulette::before {
    content: "";
    position: absolute;
    width: 120px;
    height: 100%;
    top: 0;
    z-index: 2;
    -webkit-backdrop-filter: blur(1px);
    backdrop-filter: blur(1px)
}

@media (min-width:320px) and (max-width:479px) {

    .modal-roulette .roulette::after,
    .modal-roulette .roulette::before {
        width: 70px
    }
}

.modal-roulette .roulette::after {
    left: 0;
    background: linear-gradient(90deg, #0d0e17 0, rgba(0, 0, 0, 0) 100%)
}

.modal-roulette .roulette::before {
    right: 0;
    background: linear-gradient(270deg, #0d0e17 0, rgba(0, 0, 0, 0) 100%)
}

.modal-roulette .roulette__wrapper {
    overflow-x: hidden;
    display: flex;
    position: relative;
    scroll-behavior: auto
}

.modal-roulette .roulette__items {
    display: flex;
    flex-wrap: nowrap;
    will-change: transform;
    gap: 15px
}

.modal-roulette .roulette__item {
    flex: 0 0 auto;
    transition: transform .3s;
    padding: 10px;
    background-color: #262b44;
    border-radius: 8px
}

.modal-roulette .roulette__item img {
    width: 130px
}

@media (min-width:320px) and (max-width:479px) {
    .modal-roulette .roulette__item img {
        width: 70px
    }
}

.modal-roulette .roulette-container {
    position: relative
}

.modal-roulette .roulette-container__centred-el {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2
}

.modal-roulette .roulette-container__centred-el-top {
    top: -7px
}

.modal-roulette .roulette-container__centred-el-bottom {
    bottom: -11px
}

.modal-roulette__btn-container {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-top: 25px
}

.modal-roulette .roulette-items-title {
    color: #d1d4e6;
    margin-bottom: 24px;
    margin-top: 30px
}

.modal-roulette .roulette-items {
    display: flex;
    flex-wrap: wrap;
    gap: 12px
}

.modal-roulette .roulette-items__item {
    width: calc(15% + 2px);
    padding: 10px;
    border-radius: 8px;
    background-color: #262b44
}

@media (min-width:320px) and (max-width:479px) {
    .modal-roulette .roulette-items__item {
        width: calc(25% - 9px)
    }
}

.modal-choosing-server .modal__body {
    padding: 50px 50px
}

@media (min-width:320px) and (max-width:479px) {
    .modal-choosing-server .modal__body {
        padding: 20px 20px
    }
}

.modal-choosing-server__title {
    color: #fff;
    font-size: 24px;
    line-height: 120%;
    letter-spacing: -.48px;
    margin-bottom: 30px;
    margin-top: -10px;
    font-weight: 700
}

@media (min-width:320px) and (max-width:479px) {
    .modal-choosing-server__title {
        font-size: 20px;
        margin-top: 16px
    }
}

.modal-choosing-server__list {
    width: calc(100% + 15px);
    position: relative;
    margin-top: 25px;
    max-height: 450px;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 10px;
    max-width: 495px
}

.modal-choosing-server__list::-webkit-scrollbar {
    width: 5px
}

.modal-choosing-server__list::-webkit-scrollbar-thumb {
    border-radius: 3px
}

.modal-choosing-server__list::-webkit-scrollbar-track {
    border-radius: 3px
}

.modal-choosing-server__item {
    background-color: #262b44;
    color: #8990be;
    border-radius: 8px;
    padding: 16px;
    transition: background-color .2s ease, color .2s ease;
    cursor: pointer
}

.modal-choosing-server__item:not(:last-child) {
    margin-bottom: 15px
}

.modal-choosing-server__item.active {
    background-color: #6542ff;
    color: #fff;
    position: relative
}

.modal-choosing-server__item.active::before {
    content: "";
    width: 10px;
    height: 10px;
    border-radius: 50%;
    position: absolute;
    right: 16px;
    top: 50%;
    background-color: #fff;
    transform: translate(0, -50%)
}

.modal-choosing-server__item:hover {
    background-color: #8990be;
    color: #fff
}

.modal-choosing-server__btn-cnt {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-top: 25px
}

.modal-choosing-server__list-state .modal-choosing-server__item::before {
    display: none
}

.modal-choosing-server-state__title {
    font-size: 32px;
    line-height: 120%;
    margin-bottom: 16px
}

@media (min-width:320px) and (max-width:479px) {
    .modal-choosing-server-state__title {
        font-size: 20px;
        margin-top: 16px
    }
}

.modal-choosing-server-state__subtitle {
    color: #8990be;
    font-size: 20px;
    margin-bottom: 16px;
    font-weight: 700
}

.modal-choosing-server-state__subtitle span {
    color: #5f689e
}

@media (min-width:320px) and (max-width:479px) {
    .modal-choosing-server-state__subtitle {
        font-size: 16px
    }
}

.modal-choosing-server-state__search-icon {
    position: absolute;
    left: 24px;
    top: 50%;
    transform: translate(0, -50%)
}

.modal-choosing-server-state__search-input {
    border: 1px solid rgba(51, 57, 92, .5019607843);
    width: 100%;
    border-radius: 8px;
    padding-left: 50px
}

.modal-choosing-server-state__search-input:focus {
    outline: 0
}

.modal-choosing-server-state__list {
    position: relative;
    max-height: 350px
}

.modal-choosing-server-state__list-item {
    position: relative;
    transition: z-index .2s ease, background-color .2s ease, opacity .2s ease
}

.modal-choosing-server-state__list-item.disabled {
    background-color: #10111c
}

.modal-choosing-server-state__list-item:hover {
    background-color: #6542ff
}

.modal-choosing-server-state__list-item.active .modal-choosing-server-state__list-item-name {
    color: #eae5ff
}

.modal-choosing-server-state__list-item.active .modal-choosing-server-state__list-item-state--soon-end {
    background-color: #f74646;
    color: #feebeb
}

.modal-choosing-server-state__list-item.active .modal-choosing-server-state__list-item-state--in-stock {
    background-color: #6ea844;
    color: #e3f0d7
}

.modal-choosing-server-state__list-item-name {
    color: #8990be;
    font-weight: 700;
    font-size: 18px
}

@media (min-width:320px) and (max-width:479px) {
    .modal-choosing-server-state__list-item-name {
        font-size: 16px
    }
}

.modal-choosing-server-state__list-item-label {
    font-size: 12px;
    color: #33395c;
    font-weight: 700;
    text-transform: uppercase
}

.modal-choosing-server-state__list-item-state {
    position: absolute;
    right: 16px;
    top: 50%;
    padding: 4px 5px;
    border-radius: 8px;
    transform: translate(0, -50%)
}

@media (min-width:320px) and (max-width:479px) {
    .modal-choosing-server-state__list-item-state {
        font-size: 12px
    }
}

.modal-choosing-server-state__list-item-state--sold-out {
    background-color: #10111c;
    color: #d1d4e6
}

.modal-choosing-server-state__list-item-state--in-stock {
    background-color: rgba(110, 168, 68, .0509803922);
    color: #6ea844
}

.modal-choosing-server-state__list-item-state--soon-end {
    background-color: rgba(132, 6, 6, .1019607843);
    color: #f74646
}

.modal-choosing-server-state__btn-cnt {
    flex-direction: column;
    gap: 16px
}

.modal-choosing-server-state__btn {
    width: 100%
}

.modal-transfer-p2p .modal__body {
    padding: 50px 50px
}

@media (min-width:320px) and (max-width:479px) {
    .modal-transfer-p2p .modal__body {
        padding: 20px 20px
    }
}

.modal-transfer-p2p__title {
    color: #fff;
    font-size: 24px;
    line-height: 120%;
    letter-spacing: -.48px;
    margin-bottom: 12px;
    margin-top: -10px;
    font-weight: 700
}

@media (min-width:320px) and (max-width:479px) {
    .modal-transfer-p2p__title {
        font-size: 20px;
        margin-top: 16px
    }
}

.modal-transfer-p2p__recipient {
    background-color: #0d0e17;
    padding: 8px 12px;
    display: flex;
    justify-content: space-between;
    gap: 20px;
    margin: 32px 0;
    border-radius: 8px;
    align-items: center
}

.modal-transfer-p2p__recipient-nickname {
    color: #d1d4e6;
    font-weight: 700;
    font-size: 16px;
    line-height: 140%
}

.modal-transfer-p2p__recipient-steam-id {
    color: #8990be;
    transition: color .2s ease;
    font-size: 14px
}

.modal-transfer-p2p__recipient-steam-id:hover {
    color: #fff
}

.modal-transfer-p2p__recipient-avatar-wrapper {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    overflow: hidden
}

.modal-transfer-p2p__btn {
    width: 100%;
    border-radius: 8px
}

.modal-transfer-p2p__confirm-text {
    color: #5f689e;
    margin-top: 16px;
    font-size: 14px;
    line-height: 140%;
    text-align: center
}

.modal-transfer-p2p__transfer-result-content {
    display: flex;
    flex-direction: column;
    align-items: center
}

.modal-transfer-p2p__transfer-result-img {
    margin-bottom: 8px
}

.modal-transfer-p2p__transfer-result-title {
    color: #d1d4e6;
    font-size: 24px;
    line-height: 120%;
    letter-spacing: -.48px
}

.modal-transfer-p2p__transfer-result-amount {
    font-size: 48px;
    color: #d1d4e6;
    letter-spacing: -.48px;
    line-height: 120%;
    margin-bottom: 8px;
    font-weight: 700
}

.modal-transfer-p2p__transfer-result-recipient {
    color: #8990be;
    line-height: 140%
}

.modal__change-modal-for-gmod {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 30px
}

.change-modal-for-gmod {
    background-color: transparent
}

.change-modal-for-gmod.active {
    background-color: #6542ff
}

.modal-promo-new-site__container {
    width: 820px;
    margin: 40px auto;
    transition: opacity .2s ease
}

@media (min-width:0) and (max-width:859px) {
    .modal-promo-new-site__container {
        width: 100%;
        margin: 40px auto
    }
}

@media (min-width:560px) and (max-width:859px) {
    .modal-promo-new-site__container {
        padding: 0 20px
    }
}

.modal-promo-new-site .modal__container {
    background-color: transparent;
    overflow: initial;
    border-right: initial
}

.modal-promo-new-site__wrapper {
    position: relative
}

.modal-promo-new-site__body {
    padding: 0;
    height: 318px;
    position: relative
}

@media (min-width:0) and (max-width:859px) {
    .modal-promo-new-site__body {
        height: auto
    }
}

.modal-promo-new-site__row {
    display: flex;
    height: 100%;
    align-items: stretch
}

@media (min-width:0) and (max-width:859px) {
    .modal-promo-new-site__row {
        flex-wrap: wrap
    }
}

.modal-promo-new-site__col-left {
    width: 318px;
    height: 100%;
    flex-shrink: 0;
    background: radial-gradient(100% 100% at 50.24% 100%, #a684cd 0, #262b44 100%);
    position: relative;
    border-radius: 12px 0 0 12px
}

@media (min-width:0) and (max-width:859px) {
    .modal-promo-new-site__col-left {
        width: 100%;
        height: 320px;
        overflow: hidden;
        border-radius: 12px 12px 0 0
    }
}

.modal-promo-new-site__col-left img {
    position: absolute;
    max-width: -moz-max-content;
    max-width: max-content;
    bottom: 0;
    left: -45px
}

@media (min-width:0) and (max-width:859px) {
    .modal-promo-new-site__col-left img {
        left: 50%;
        transform: translate(-50%, 50px)
    }
}

@media (min-width:0) and (max-width:859px) {
    .modal-promo-new-site__col-left::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        height: 150px;
        width: 100%;
        background: linear-gradient(181deg, #191c2d, rgba(25, 28, 45, 0));
        z-index: 1
    }
}

.modal-promo-new-site__col-right {
    background: #161827;
    border-radius: 0 12px 12px 0;
    padding: 32px
}

@media (min-width:0) and (max-width:859px) {
    .modal-promo-new-site__col-right {
        border-radius: 0 0 12px 12px;
        padding: 25px
    }
}

.modal-promo-new-site__title {
    color: #fff;
    margin-bottom: 16px;
    line-height: 120%;
    font-size: 32px;
    font-weight: 700
}

@media (min-width:0) and (max-width:859px) {
    .modal-promo-new-site__title {
        position: absolute;
        top: 22px;
        font-size: 22px;
        z-index: 2
    }
}

.modal-promo-new-site__subtitle {
    color: #8990be;
    line-height: 140%;
    margin-bottom: 8px
}

.modal-promo-new-site__bonus {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    background-color: rgba(110, 168, 68, .05);
    border-radius: 8px
}

.modal-promo-new-site__bonus-text {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #6ea844
}

.modal-promo-new-site__bonus-percent {
    color: #e3f0d7;
    font-weight: 700
}

.modal-promo-new-site__btn-container {
    margin-top: 32px;
    margin-bottom: 12px
}

.modal-promo-new-site__btn {
    display: flex;
    align-items: center;
    width: 100%;
    justify-content: center;
    gap: 4px
}

.modal-promo-new-site__agree-text {
    color: #5f689e;
    font-size: 12px
}

.modal-promo-new-site .modal__close {
    z-index: 2
}

@media (min-width:0) and (max-width:859px) {
    .modal-promo-new-site .modal__close {
        top: 20px
    }
}

@media (min-width:0) and (max-width:600px) {
    .progressive-deposit-modal {
        padding: 0 20px
    }
}

@media (min-width:0) and (max-width:410px) {
    .progressive-deposit-modal .modal__close {
        right: 20px
    }
}

@media (min-width:1100px) {
    .progressive-deposit-modal .modal__container {
        width: 1050px
    }
}

@media (min-width:960px) and (max-width:1099px) {
    .progressive-deposit-modal .modal__container {
        width: 940px
    }
}

@media (min-width:640px) and (max-width:959px) {
    .progressive-deposit-modal .modal__container {
        width: 620px
    }
}

.progressive-deposit-modal .modal__body {
    padding: 32px;
    background-color: #191c2d
}

@media (min-width:320px) and (max-width:479px) {
    .progressive-deposit-modal .modal__body {
        padding: 20px
    }
}

.progressive-deposit-modal__top {
    display: flex;
    align-items: center;
    gap: 16px
}

@media (min-width:0) and (max-width:960px) {
    .progressive-deposit-modal__top {
        flex-wrap: wrap
    }
}

.progressive-deposit-modal__title {
    color: #fff;
    font-size: 32px;
    font-weight: 700;
    line-height: 120%
}

@media (min-width:0) and (max-width:960px) {
    .progressive-deposit-modal__title {
        font-size: 22px;
        margin-top: 14px
    }
}

.progressive-deposit-modal__preferences {
    display: flex;
    gap: 16px;
    align-items: center
}

@media (min-width:0) and (max-width:410px) {
    .progressive-deposit-modal__preferences {
        flex-wrap: wrap;
        width: 100%
    }
}

.progressive-deposit-modal__select {
    display: inline-block;
    position: relative
}

@media (min-width:0) and (max-width:410px) {
    .progressive-deposit-modal__select {
        width: 100%
    }
}

.progressive-deposit-modal__select.show .progressive-deposit-modal__select-current {
    border: 1px solid #6542ff
}

.progressive-deposit-modal__select.show .progressive-deposit-modal__select-current::after {
    transform: rotate(0)
}

.progressive-deposit-modal__select.show .progressive-deposit-modal__select-list {
    opacity: 1;
    visibility: visible;
    pointer-events: initial;
    transform: translateY(8px);
    z-index: 10
}

.progressive-deposit-modal__select-current {
    display: flex;
    align-items: center;
    gap: 8px;
    background-color: #262b44;
    padding: 12px;
    border-radius: 8px;
    border: 1px solid rgba(51, 57, 92, .5019607843);
    min-width: 150px;
    width: -moz-max-content;
    width: max-content;
    position: relative;
    cursor: pointer;
    transition: border .2s ease;
    z-index: 4
}

@media (min-width:0) and (max-width:410px) {
    .progressive-deposit-modal__select-current {
        min-width: 100%
    }
}

.progressive-deposit-modal__select-current::after {
    content: "";
    width: 16px;
    height: 16px;
    background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'><path d='M12.4533 9.31999L10.3133 7.17999L9.00667 5.86666C8.45334 5.31333 7.55334 5.31333 7.00001 5.86666L3.54667 9.31999C3.09334 9.77333 3.42001 10.5467 4.05334 10.5467H7.79334H11.9467C12.5867 10.5467 12.9067 9.77333 12.4533 9.31999Z' fill='%238990BE'/></svg>") no-repeat center/contain;
    transform: rotate(180deg);
    transition: transform .2s ease
}

@media (min-width:0) and (max-width:410px) {
    .progressive-deposit-modal__select-current::after {
        position: absolute;
        right: 10px
    }
}

.progressive-deposit-modal__select-current-value {
    font-size: 16px;
    font-weight: 500;
    line-height: 100%;
    color: #8990be
}

.progressive-deposit-modal__select-list {
    position: absolute;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    z-index: 3;
    transform: translateY(-10px);
    left: 0;
    min-width: -moz-max-content;
    min-width: max-content;
    max-width: 150px;
    background-color: #262b44;
    padding: 6px;
    width: 100%;
    border-radius: 8px;
    transition: opacity .2s ease, visibility .2s ease, transform .2s ease
}

.progressive-deposit-modal__select-list-item {
    transition: background-color .2s ease, color .2s ease, filter .2s ease;
    color: #8990be;
    font-size: 16px;
    padding: 6px;
    font-weight: 500;
    line-height: 140%;
    border-radius: 4px;
    cursor: pointer
}

.progressive-deposit-modal__select-list-item:not(:last-child) {
    margin-bottom: 4px
}

.progressive-deposit-modal__select-list-item:hover {
    filter: grayscale(50%)
}

.progressive-deposit-modal__select-list-item.selected {
    background-color: #33395c;
    color: #d1d4e6
}

.progressive-deposit-modal__lang-current-icon {
    width: 16px;
    height: 16px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center
}

.progressive-deposit-modal__lang-current-icon[data-country-code=ru] {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'><g clip-path='url(%23clip0_7002_85517)'><path d='M12 24C18.6274 24 24 18.6274 24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 18.6274 5.37258 24 12 24Z' fill='%23F0F0F0'/><path d='M23.2539 16.1735C23.7362 14.8735 24.0002 13.4674 24.0002 11.9996C24.0002 10.5317 23.7362 9.12567 23.2539 7.82568H0.746635C0.264291 9.12567 0.000244141 10.5317 0.000244141 11.9996C0.000244141 13.4674 0.264291 14.8735 0.746635 16.1735L12.0002 17.2169L23.2539 16.1735Z' fill='%230052B4'/><path d='M12.0003 23.9995C17.1599 23.9995 21.5584 20.743 23.2539 16.1733H0.746704C2.44222 20.743 6.84073 23.9995 12.0003 23.9995Z' fill='%23D80027'/></g><defs><clipPath id='clip0_7002_85517'><rect width='24' height='24' fill='white'/></clipPath></defs></svg>")
}

.progressive-deposit-modal__lang-current-icon[data-country-code=by] {
    background-image: url("data:image/svg+xml;utf8,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><g clip-path='url(%23clip0_7003_85523)'><path d='M12 24C18.6274 24 24 18.6274 24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 18.6274 5.37258 24 12 24Z' fill='%23FCFCFC'/><path d='M4.95669 11.1288L3.65234 8.76237L4.95669 6.43311L6.26103 8.76237L4.95669 11.1288Z' fill='%23A2001D'/><path d='M2.3478 11.1288L1.04346 8.76237L2.3478 6.43311L3.65214 8.76237L2.3478 11.1288Z' fill='%23A2001D'/><path d='M4.95669 17.5643L3.65234 15.1979L4.95669 12.8687L6.26103 15.1979L4.95669 17.5643Z' fill='%23A2001D'/><path d='M2.3478 17.5643L1.04346 15.1979L2.3478 12.8687L3.65214 15.1979L2.3478 17.5643Z' fill='%23A2001D'/><path d='M6.26053 2.32887L5.89125 1.66943C5.2289 2.06187 4.60767 2.51623 4.03528 3.02454L4.95619 4.69522L6.26053 2.32887Z' fill='%23A2001D'/><path d='M4.95617 19.3042L4.02551 20.9662C4.59739 21.4752 5.2182 21.9302 5.88026 22.3235L6.26056 21.6335L4.95617 19.3042Z' fill='%23A2001D'/><path d='M7.3042 15.1309V23.0463C8.7465 23.6602 10.3334 24.0004 11.9999 24.0004C17.1594 24.0004 21.5579 20.7439 23.2535 16.1743L7.3042 15.1309Z' fill='%236DA544'/><path d='M23.2535 16.1739C23.7359 14.8739 23.9999 13.4678 23.9999 12C23.9999 5.37263 18.6272 0 11.9999 0C10.3335 0 8.7465 0.339984 7.3042 0.953813V16.1739H23.2535V16.1739Z' fill='%23A2001D'/></g><defs><clipPath id='clip0_7003_85523'><rect width='24' height='24' fill='white'/></clipPath></defs></svg>")
}

.progressive-deposit-modal__lang-current-icon[data-country-code=kz] {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'><g clip-path='url(%23clip0_7003_85536)'><path d='M12 24C18.6274 24 24 18.6274 24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 18.6274 5.37258 24 12 24Z' fill='%23338AF3'/><path d='M18.783 12.1299H5.21777C5.21777 13.0664 6.03345 13.8255 6.96987 13.8255H6.91343C6.91343 14.7621 7.67257 15.5212 8.60909 15.5212C8.60909 16.4577 9.36823 17.2169 10.3047 17.2169H13.6961C14.6326 17.2169 15.3917 16.4577 15.3917 15.5212C16.3282 15.5212 17.0874 14.7621 17.0874 13.8255H17.0309C17.9673 13.8255 18.783 13.0664 18.783 12.1299Z' fill='%23FFDA44'/><path d='M16.696 9.91357C16.696 12.5069 14.5937 14.6092 12.0003 14.6092C9.40698 14.6092 7.30469 12.5069 7.30469 9.91357' fill='%23338AF3'/><path d='M15.5865 9.91238L14.1209 10.6018L14.9014 12.0212L13.31 11.7167L13.1083 13.3243L11.9998 12.1419L10.8913 13.3243L10.6897 11.7167L9.09833 12.0211L9.87871 10.6017L8.41321 9.91238L9.87875 9.22304L9.09833 7.80371L10.6897 8.10812L10.8914 6.50049L11.9998 7.68291L13.1083 6.50049L13.31 8.10812L14.9014 7.80371L14.121 9.22308L15.5865 9.91238Z' fill='%23FFDA44'/></g><defs><clipPath id='clip0_7003_85536'><rect width='24' height='24' fill='white'/></clipPath></defs></svg>")
}

.progressive-deposit-modal__lang-current-icon[data-country-code=global] {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'><g clip-path='url(%23clip0_7003_85544)'><path d='M12 24C18.6274 24 24 18.6274 24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 18.6274 5.37258 24 12 24Z' fill='%230052B4'/><path d='M20.0867 15.8321C19.4087 15.5721 19.5294 15.6668 19.1114 14.7781C18.6934 13.8901 18.4401 13.6041 17.5001 13.5001C16.5594 13.3968 16.5947 13.4701 16.3334 13.0001C16.0721 12.5294 15.0121 13.1274 14.3334 13.3894C13.6527 13.6508 13.8207 14.2201 13.6114 14.1668C13.4014 14.1148 12.8734 13.9794 12.3494 13.5621C11.8267 13.1434 12.7381 12.8168 13.0001 12.5561C13.2621 12.2941 12.5068 12.4368 12.2447 12.2788C11.9827 12.1228 11.5141 12.5928 11.0961 12.1734C10.6774 11.7554 10.9394 11.1281 10.8874 10.6054C10.8347 10.0821 11.5661 9.9781 12.0367 9.87344C12.5067 9.76944 12.8721 9.8741 12.8721 10.5008C12.8721 11.1281 13.4474 11.3374 13.2908 10.6048C13.1341 9.8721 13.4474 9.6641 13.6574 9.2981C13.8661 8.9321 14.2321 8.40877 14.7021 7.62477C15.1727 6.84077 15.4867 7.2061 16.0614 7.2621C16.6367 7.31877 16.7934 7.20677 17.2114 7.25944C17.6281 7.3121 17.2114 6.73677 17.3687 6.1621C17.5247 5.58744 18.1001 5.69144 18.6761 5.84877C19.2507 6.00544 18.1001 5.1161 17.8914 4.6461C17.6814 4.17544 17.1068 4.6461 16.7421 3.8621C16.3734 3.0781 15.8594 2.57077 15.3887 2.50077C14.9181 2.4301 15.5388 3.49677 15.1728 4.07144C14.8054 4.6461 14.2428 4.5561 13.6661 4.5561C13.0921 4.5561 12.5587 4.07144 12.9774 3.33944C13.3947 2.6081 14.1927 2.68344 14.6107 2.0561C15.0294 1.42944 13.1241 1.48677 12.4441 1.2781C11.7641 1.06877 10.9481 1.07077 10.2687 1.59344C9.58875 2.11544 8.13475 2.27877 7.55942 2.48744C6.98475 2.6961 6.88142 2.14077 6.77742 1.7221C6.73075 1.5361 6.51875 1.47744 6.22008 1.4841C4.74008 2.3001 3.45808 3.42544 2.44275 4.76477C2.60075 5.30277 3.36608 4.63877 3.51608 4.48877C3.67275 4.3321 4.45675 4.54144 4.56075 5.1161C4.66542 5.69077 4.61342 6.31944 4.40475 6.8421C4.19542 7.3641 4.92742 8.0961 5.34542 8.8281C5.76408 9.56077 6.23408 9.5601 6.44342 9.5601C6.65208 9.5601 7.85475 10.0308 7.80208 10.6054C7.75008 11.1808 8.90008 11.7028 9.37075 12.0688C9.84142 12.4361 10.1387 12.7968 10.7494 12.9021C11.3607 13.0074 12.0754 14.0068 12.3887 14.1121C12.6294 14.1921 13.0367 14.5768 13.2827 14.6961C12.9594 15.1054 12.3334 15.9461 12.3334 16.3334C12.3334 16.8574 13.0167 17.6808 13.2781 17.8894C13.5387 18.0974 14.2894 18.2561 14.4447 18.7781C14.6021 19.3008 14.3354 21.0601 13.8661 21.5301C13.3941 22.0001 13.2227 23.1114 13.2227 23.1114C13.2227 23.1114 13.3887 23.4721 13.9447 23.1114C14.5594 22.7134 15.5887 21.5801 16.0001 21.3334C16.7841 20.8621 17.5461 20.2901 18.2781 19.6114C19.0101 18.9321 18.7447 18.4561 19.1114 17.7781C19.4774 17.0988 19.9507 17.1294 20.5774 16.5561C21.2054 15.9801 20.7667 16.0941 20.0867 15.8321V15.8321Z' fill='%236DA544'/></g><defs><clipPath id='clip0_7003_85544'><rect width='24' height='24' fill='white'/></clipPath></defs></svg>")
}

.progressive-deposit-modal__lang-current-icon[data-country-code=ua] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cg clip-path='url(%23clip0_3080_56103)'%3E%3Cpath d='M12 24C18.6274 24 24 18.6274 24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 18.6274 5.37258 24 12 24Z' fill='%23FFDA44'/%3E%3Cpath d='M0 12C0 5.37262 5.37262 0 12 0C18.6274 0 24 5.37262 24 12' fill='%23338AF3'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_3080_56103'%3E%3Crect width='24' height='24' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E")
}

.progressive-deposit-modal__lang-current-icon[data-country-code=cn] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M12 24C18.6274 24 24 18.6274 24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 18.6274 5.37258 24 12 24Z' fill='%23D80027'/%3E%3Cpath d='M6.56719 7.30139L7.60313 10.4889H10.9547L8.24531 12.4623L9.28125 15.6498L6.56719 13.6811L3.85313 15.6498L4.89375 12.4623L2.17969 10.4889H5.53125L6.56719 7.30139Z' fill='%23FFDA44'/%3E%3Cpath d='M14.226 18.5846L13.4338 17.6096L12.2619 18.0643L12.9416 17.0096L12.1494 16.03L13.3635 16.3534L14.0479 15.2987L14.1135 16.555L15.3322 16.8784L14.1557 17.3284L14.226 18.5846Z' fill='%23FFDA44'/%3E%3Cpath d='M15.802 15.7253L16.177 14.5253L15.1504 13.7987L16.4066 13.78L16.777 12.58L17.1848 13.7706L18.441 13.7565L17.4332 14.5065L17.8363 15.6971L16.8098 14.9706L15.802 15.7253Z' fill='%23FFDA44'/%3E%3Cpath d='M17.9256 8.80662L17.3725 9.9363L18.2725 10.8129L17.0303 10.6347L16.4771 11.7597L16.2615 10.5222L15.0146 10.3441L16.1303 9.75818L15.9146 8.51599L16.8146 9.39255L17.9256 8.80662Z' fill='%23FFDA44'/%3E%3Cpath d='M14.2592 5.38501L14.1654 6.63657L15.3326 7.11001L14.1092 7.41001L14.0201 8.66626L13.3592 7.59751L12.1357 7.89751L12.9467 6.93657L12.2811 5.87251L13.4482 6.34595L14.2592 5.38501Z' fill='%23FFDA44'/%3E%3C/svg%3E")
}

.progressive-deposit-modal__lang-list-item {
    display: flex;
    align-items: center;
    gap: 6px
}

.progressive-deposit-modal__lang-list-item-icon {
    width: 24px;
    height: 24px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center
}

[data-country-code=ru] .progressive-deposit-modal__lang-list-item-icon {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'><g clip-path='url(%23clip0_7002_85517)'><path d='M12 24C18.6274 24 24 18.6274 24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 18.6274 5.37258 24 12 24Z' fill='%23F0F0F0'/><path d='M23.2539 16.1735C23.7362 14.8735 24.0002 13.4674 24.0002 11.9996C24.0002 10.5317 23.7362 9.12567 23.2539 7.82568H0.746635C0.264291 9.12567 0.000244141 10.5317 0.000244141 11.9996C0.000244141 13.4674 0.264291 14.8735 0.746635 16.1735L12.0002 17.2169L23.2539 16.1735Z' fill='%230052B4'/><path d='M12.0003 23.9995C17.1599 23.9995 21.5584 20.743 23.2539 16.1733H0.746704C2.44222 20.743 6.84073 23.9995 12.0003 23.9995Z' fill='%23D80027'/></g><defs><clipPath id='clip0_7002_85517'><rect width='24' height='24' fill='white'/></clipPath></defs></svg>")
}

[data-country-code=by] .progressive-deposit-modal__lang-list-item-icon {
    background-image: url("data:image/svg+xml;utf8,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><g clip-path='url(%23clip0_7003_85523)'><path d='M12 24C18.6274 24 24 18.6274 24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 18.6274 5.37258 24 12 24Z' fill='%23FCFCFC'/><path d='M4.95669 11.1288L3.65234 8.76237L4.95669 6.43311L6.26103 8.76237L4.95669 11.1288Z' fill='%23A2001D'/><path d='M2.3478 11.1288L1.04346 8.76237L2.3478 6.43311L3.65214 8.76237L2.3478 11.1288Z' fill='%23A2001D'/><path d='M4.95669 17.5643L3.65234 15.1979L4.95669 12.8687L6.26103 15.1979L4.95669 17.5643Z' fill='%23A2001D'/><path d='M2.3478 17.5643L1.04346 15.1979L2.3478 12.8687L3.65214 15.1979L2.3478 17.5643Z' fill='%23A2001D'/><path d='M6.26053 2.32887L5.89125 1.66943C5.2289 2.06187 4.60767 2.51623 4.03528 3.02454L4.95619 4.69522L6.26053 2.32887Z' fill='%23A2001D'/><path d='M4.95617 19.3042L4.02551 20.9662C4.59739 21.4752 5.2182 21.9302 5.88026 22.3235L6.26056 21.6335L4.95617 19.3042Z' fill='%23A2001D'/><path d='M7.3042 15.1309V23.0463C8.7465 23.6602 10.3334 24.0004 11.9999 24.0004C17.1594 24.0004 21.5579 20.7439 23.2535 16.1743L7.3042 15.1309Z' fill='%236DA544'/><path d='M23.2535 16.1739C23.7359 14.8739 23.9999 13.4678 23.9999 12C23.9999 5.37263 18.6272 0 11.9999 0C10.3335 0 8.7465 0.339984 7.3042 0.953813V16.1739H23.2535V16.1739Z' fill='%23A2001D'/></g><defs><clipPath id='clip0_7003_85523'><rect width='24' height='24' fill='white'/></clipPath></defs></svg>")
}

[data-country-code=kz] .progressive-deposit-modal__lang-list-item-icon {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'><g clip-path='url(%23clip0_7003_85536)'><path d='M12 24C18.6274 24 24 18.6274 24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 18.6274 5.37258 24 12 24Z' fill='%23338AF3'/><path d='M18.783 12.1299H5.21777C5.21777 13.0664 6.03345 13.8255 6.96987 13.8255H6.91343C6.91343 14.7621 7.67257 15.5212 8.60909 15.5212C8.60909 16.4577 9.36823 17.2169 10.3047 17.2169H13.6961C14.6326 17.2169 15.3917 16.4577 15.3917 15.5212C16.3282 15.5212 17.0874 14.7621 17.0874 13.8255H17.0309C17.9673 13.8255 18.783 13.0664 18.783 12.1299Z' fill='%23FFDA44'/><path d='M16.696 9.91357C16.696 12.5069 14.5937 14.6092 12.0003 14.6092C9.40698 14.6092 7.30469 12.5069 7.30469 9.91357' fill='%23338AF3'/><path d='M15.5865 9.91238L14.1209 10.6018L14.9014 12.0212L13.31 11.7167L13.1083 13.3243L11.9998 12.1419L10.8913 13.3243L10.6897 11.7167L9.09833 12.0211L9.87871 10.6017L8.41321 9.91238L9.87875 9.22304L9.09833 7.80371L10.6897 8.10812L10.8914 6.50049L11.9998 7.68291L13.1083 6.50049L13.31 8.10812L14.9014 7.80371L14.121 9.22308L15.5865 9.91238Z' fill='%23FFDA44'/></g><defs><clipPath id='clip0_7003_85536'><rect width='24' height='24' fill='white'/></clipPath></defs></svg>")
}

[data-country-code=global] .progressive-deposit-modal__lang-list-item-icon {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'><g clip-path='url(%23clip0_7003_85544)'><path d='M12 24C18.6274 24 24 18.6274 24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 18.6274 5.37258 24 12 24Z' fill='%230052B4'/><path d='M20.0867 15.8321C19.4087 15.5721 19.5294 15.6668 19.1114 14.7781C18.6934 13.8901 18.4401 13.6041 17.5001 13.5001C16.5594 13.3968 16.5947 13.4701 16.3334 13.0001C16.0721 12.5294 15.0121 13.1274 14.3334 13.3894C13.6527 13.6508 13.8207 14.2201 13.6114 14.1668C13.4014 14.1148 12.8734 13.9794 12.3494 13.5621C11.8267 13.1434 12.7381 12.8168 13.0001 12.5561C13.2621 12.2941 12.5068 12.4368 12.2447 12.2788C11.9827 12.1228 11.5141 12.5928 11.0961 12.1734C10.6774 11.7554 10.9394 11.1281 10.8874 10.6054C10.8347 10.0821 11.5661 9.9781 12.0367 9.87344C12.5067 9.76944 12.8721 9.8741 12.8721 10.5008C12.8721 11.1281 13.4474 11.3374 13.2908 10.6048C13.1341 9.8721 13.4474 9.6641 13.6574 9.2981C13.8661 8.9321 14.2321 8.40877 14.7021 7.62477C15.1727 6.84077 15.4867 7.2061 16.0614 7.2621C16.6367 7.31877 16.7934 7.20677 17.2114 7.25944C17.6281 7.3121 17.2114 6.73677 17.3687 6.1621C17.5247 5.58744 18.1001 5.69144 18.6761 5.84877C19.2507 6.00544 18.1001 5.1161 17.8914 4.6461C17.6814 4.17544 17.1068 4.6461 16.7421 3.8621C16.3734 3.0781 15.8594 2.57077 15.3887 2.50077C14.9181 2.4301 15.5388 3.49677 15.1728 4.07144C14.8054 4.6461 14.2428 4.5561 13.6661 4.5561C13.0921 4.5561 12.5587 4.07144 12.9774 3.33944C13.3947 2.6081 14.1927 2.68344 14.6107 2.0561C15.0294 1.42944 13.1241 1.48677 12.4441 1.2781C11.7641 1.06877 10.9481 1.07077 10.2687 1.59344C9.58875 2.11544 8.13475 2.27877 7.55942 2.48744C6.98475 2.6961 6.88142 2.14077 6.77742 1.7221C6.73075 1.5361 6.51875 1.47744 6.22008 1.4841C4.74008 2.3001 3.45808 3.42544 2.44275 4.76477C2.60075 5.30277 3.36608 4.63877 3.51608 4.48877C3.67275 4.3321 4.45675 4.54144 4.56075 5.1161C4.66542 5.69077 4.61342 6.31944 4.40475 6.8421C4.19542 7.3641 4.92742 8.0961 5.34542 8.8281C5.76408 9.56077 6.23408 9.5601 6.44342 9.5601C6.65208 9.5601 7.85475 10.0308 7.80208 10.6054C7.75008 11.1808 8.90008 11.7028 9.37075 12.0688C9.84142 12.4361 10.1387 12.7968 10.7494 12.9021C11.3607 13.0074 12.0754 14.0068 12.3887 14.1121C12.6294 14.1921 13.0367 14.5768 13.2827 14.6961C12.9594 15.1054 12.3334 15.9461 12.3334 16.3334C12.3334 16.8574 13.0167 17.6808 13.2781 17.8894C13.5387 18.0974 14.2894 18.2561 14.4447 18.7781C14.6021 19.3008 14.3354 21.0601 13.8661 21.5301C13.3941 22.0001 13.2227 23.1114 13.2227 23.1114C13.2227 23.1114 13.3887 23.4721 13.9447 23.1114C14.5594 22.7134 15.5887 21.5801 16.0001 21.3334C16.7841 20.8621 17.5461 20.2901 18.2781 19.6114C19.0101 18.9321 18.7447 18.4561 19.1114 17.7781C19.4774 17.0988 19.9507 17.1294 20.5774 16.5561C21.2054 15.9801 20.7667 16.0941 20.0867 15.8321V15.8321Z' fill='%236DA544'/></g><defs><clipPath id='clip0_7003_85544'><rect width='24' height='24' fill='white'/></clipPath></defs></svg>")
}

[data-country-code=ua] .progressive-deposit-modal__lang-list-item-icon {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cg clip-path='url(%23clip0_3080_56103)'%3E%3Cpath d='M12 24C18.6274 24 24 18.6274 24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 18.6274 5.37258 24 12 24Z' fill='%23FFDA44'/%3E%3Cpath d='M0 12C0 5.37262 5.37262 0 12 0C18.6274 0 24 5.37262 24 12' fill='%23338AF3'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_3080_56103'%3E%3Crect width='24' height='24' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E")
}

[data-country-code=cn] .progressive-deposit-modal__lang-list-item-icon {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M12 24C18.6274 24 24 18.6274 24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 18.6274 5.37258 24 12 24Z' fill='%23D80027'/%3E%3Cpath d='M6.56719 7.30139L7.60313 10.4889H10.9547L8.24531 12.4623L9.28125 15.6498L6.56719 13.6811L3.85313 15.6498L4.89375 12.4623L2.17969 10.4889H5.53125L6.56719 7.30139Z' fill='%23FFDA44'/%3E%3Cpath d='M14.226 18.5846L13.4338 17.6096L12.2619 18.0643L12.9416 17.0096L12.1494 16.03L13.3635 16.3534L14.0479 15.2987L14.1135 16.555L15.3322 16.8784L14.1557 17.3284L14.226 18.5846Z' fill='%23FFDA44'/%3E%3Cpath d='M15.802 15.7253L16.177 14.5253L15.1504 13.7987L16.4066 13.78L16.777 12.58L17.1848 13.7706L18.441 13.7565L17.4332 14.5065L17.8363 15.6971L16.8098 14.9706L15.802 15.7253Z' fill='%23FFDA44'/%3E%3Cpath d='M17.9256 8.80662L17.3725 9.9363L18.2725 10.8129L17.0303 10.6347L16.4771 11.7597L16.2615 10.5222L15.0146 10.3441L16.1303 9.75818L15.9146 8.51599L16.8146 9.39255L17.9256 8.80662Z' fill='%23FFDA44'/%3E%3Cpath d='M14.2592 5.38501L14.1654 6.63657L15.3326 7.11001L14.1092 7.41001L14.0201 8.66626L13.3592 7.59751L12.1357 7.89751L12.9467 6.93657L12.2811 5.87251L13.4482 6.34595L14.2592 5.38501Z' fill='%23FFDA44'/%3E%3C/svg%3E")
}

.progressive-deposit-modal__wallet-current-icon {
    width: 13px;
    height: 13px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center
}

.progressive-deposit-modal__wallet-current-icon[data-wallet=rub] {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'><path d='M10 0C15.51 0 20 4.49 20 10C20 15.51 15.51 20 10 20C4.49 20 0 15.51 0 10C0 4.49 4.49 0 10 0ZM8.1377 3C6.58736 3 5.82227 3.7741 5.82227 5.4541V9.46582H5.37891C4.52355 9.49646 4.00021 9.97444 4 10.7275C4 11.4911 4.52338 11.9596 5.37891 11.9902H5.82227V13.1816H5.16797C4.4532 13.1816 4 13.5689 4 14.2002C4.00009 14.8314 4.45328 15.208 5.16797 15.208H5.90234V15.7783C6.12382 16.5826 6.77846 17 7.49316 17C8.1978 17 8.85201 16.5826 9.06348 15.7783V15.208H11.0977C11.8021 15.2079 12.2646 14.8312 12.2646 14.2002C12.2646 13.569 11.8022 13.1818 11.0977 13.1816H9.1543V11.9902H11.0469C14.4798 11.9902 16 10.1169 16 7.52051C15.9999 4.76136 14.2781 3 11.0869 3H8.1377ZM10.4131 5.57617C11.7921 5.57625 12.6279 6.05486 12.6279 7.51074C12.6279 8.95641 11.8117 9.46582 10.2715 9.46582H9.13379V5.57617H10.4131Z' fill='%23D1D4E6'/></svg>")
}

.progressive-deposit-modal__wallet-current-icon[data-wallet=eur] {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'><path d='M10 0C15.51 0 20 4.49 20 10C20 15.51 15.51 20 10 20C4.49 20 0 15.51 0 10C0 4.49 4.49 0 10 0ZM10.748 4C8.23935 4.00008 6.54059 5.48558 6.17969 8.06543H5.87988C5.33434 8.06557 5 8.34524 5 8.79492C5.00001 9.25307 5.34315 9.52428 5.87988 9.52441H6.08301V10.4756H5.87988C5.33434 10.4757 5 10.7557 5 11.2139C5.00015 11.6634 5.34326 11.9344 5.87988 11.9346H6.19727C6.58458 14.6927 8.30981 16 10.6953 16C12.9223 16 14.9998 14.7356 15 13.0215C15 12.3086 14.5861 11.748 13.8818 11.748C13.3626 11.7481 13.0541 12.0534 12.7549 12.4521C12.3852 13.1141 11.813 13.5645 10.8975 13.5645C9.8678 13.5643 9.31373 12.9952 9.1377 11.9346H10.5635C11.0916 11.9345 11.4434 11.6633 11.4434 11.2051C11.4434 10.7553 11.1004 10.4756 10.5635 10.4756H8.96973V9.52441H10.5635C11.0916 9.52438 11.4434 9.24467 11.4434 8.79492C11.4434 8.33667 11.1004 8.06546 10.5635 8.06543H9.14648C9.33132 7.00474 9.90303 6.4269 10.8447 6.42676C11.681 6.42676 12.2357 6.88555 12.6494 7.56445C12.9487 7.95483 13.2746 8.25195 13.7588 8.25195C14.4014 8.25195 14.956 7.73413 14.9561 6.96191C14.9561 5.38341 13.0192 4 10.748 4Z' fill='%23D1D4E6'/></svg>")
}

.progressive-deposit-modal__wallet-list-item {
    display: flex;
    align-items: center;
    gap: 6px
}

.progressive-deposit-modal__wallet-list-item-icon {
    width: 24px;
    height: 24px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center
}

.progressive-deposit-modal__input-group-icon[data-wallet=rub],
[data-wallet=rub] .progressive-deposit-modal__wallet-list-item-icon {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'><path d='M10 0C15.51 0 20 4.49 20 10C20 15.51 15.51 20 10 20C4.49 20 0 15.51 0 10C0 4.49 4.49 0 10 0ZM8.1377 3C6.58736 3 5.82227 3.7741 5.82227 5.4541V9.46582H5.37891C4.52355 9.49646 4.00021 9.97444 4 10.7275C4 11.4911 4.52338 11.9596 5.37891 11.9902H5.82227V13.1816H5.16797C4.4532 13.1816 4 13.5689 4 14.2002C4.00009 14.8314 4.45328 15.208 5.16797 15.208H5.90234V15.7783C6.12382 16.5826 6.77846 17 7.49316 17C8.1978 17 8.85201 16.5826 9.06348 15.7783V15.208H11.0977C11.8021 15.2079 12.2646 14.8312 12.2646 14.2002C12.2646 13.569 11.8022 13.1818 11.0977 13.1816H9.1543V11.9902H11.0469C14.4798 11.9902 16 10.1169 16 7.52051C15.9999 4.76136 14.2781 3 11.0869 3H8.1377ZM10.4131 5.57617C11.7921 5.57625 12.6279 6.05486 12.6279 7.51074C12.6279 8.95641 11.8117 9.46582 10.2715 9.46582H9.13379V5.57617H10.4131Z' fill='%23D1D4E6'/></svg>")
}

.progressive-deposit-modal__input-group-icon[data-wallet=eur],
[data-wallet=eur] .progressive-deposit-modal__wallet-list-item-icon {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'><path d='M10 0C15.51 0 20 4.49 20 10C20 15.51 15.51 20 10 20C4.49 20 0 15.51 0 10C0 4.49 4.49 0 10 0ZM10.748 4C8.23935 4.00008 6.54059 5.48558 6.17969 8.06543H5.87988C5.33434 8.06557 5 8.34524 5 8.79492C5.00001 9.25307 5.34315 9.52428 5.87988 9.52441H6.08301V10.4756H5.87988C5.33434 10.4757 5 10.7557 5 11.2139C5.00015 11.6634 5.34326 11.9344 5.87988 11.9346H6.19727C6.58458 14.6927 8.30981 16 10.6953 16C12.9223 16 14.9998 14.7356 15 13.0215C15 12.3086 14.5861 11.748 13.8818 11.748C13.3626 11.7481 13.0541 12.0534 12.7549 12.4521C12.3852 13.1141 11.813 13.5645 10.8975 13.5645C9.8678 13.5643 9.31373 12.9952 9.1377 11.9346H10.5635C11.0916 11.9345 11.4434 11.6633 11.4434 11.2051C11.4434 10.7553 11.1004 10.4756 10.5635 10.4756H8.96973V9.52441H10.5635C11.0916 9.52438 11.4434 9.24467 11.4434 8.79492C11.4434 8.33667 11.1004 8.06546 10.5635 8.06543H9.14648C9.33132 7.00474 9.90303 6.4269 10.8447 6.42676C11.681 6.42676 12.2357 6.88555 12.6494 7.56445C12.9487 7.95483 13.2746 8.25195 13.7588 8.25195C14.4014 8.25195 14.956 7.73413 14.9561 6.96191C14.9561 5.38341 13.0192 4 10.748 4Z' fill='%23D1D4E6'/></svg>")
}

.progressive-deposit-modal__cols {
    display: flex;
    gap: 32px
}

@media (min-width:0) and (max-width:959px) {
    .progressive-deposit-modal__cols {
        flex-wrap: wrap
    }
}

.progressive-deposit-modal__col {
    width: 50%
}

@media (min-width:0) and (max-width:959px) {
    .progressive-deposit-modal__col {
        width: 100%
    }
}

.progressive-deposit-modal__col-left {
    background-color: #161827;
    border-radius: 16px;
    padding: 12px;
    max-width: 430px;
    overflow: hidden
}

@media (min-width:0) and (max-width:499px) {
    .progressive-deposit-modal__col-left {
        padding: 9px
    }
}

@media (min-width:0) and (max-width:959px) {
    .progressive-deposit-modal__col-left {
        max-width: 100%
    }
}

.progressive-deposit-modal__tab-nav {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 32px;
    margin-bottom: 32px
}

@media (min-width:410px) and (max-width:510px) {
    .progressive-deposit-modal__tab-nav {
        gap: 4px
    }
}

@media (min-width:0) and (max-width:409px) {
    .progressive-deposit-modal__tab-nav {
        overflow-y: scroll;
        -ms-overflow-style: none
    }

    .progressive-deposit-modal__tab-nav::-webkit-scrollbar {
        width: 0;
        height: 0
    }
}

.progressive-deposit-modal__tab-nav-btn {
    background-color: transparent;
    padding: 11px 15px;
    border: 1px solid rgba(51, 57, 92, .5019607843);
    display: flex;
    align-items: center;
    gap: 8px;
    border-radius: 25px;
    cursor: pointer;
    color: #d1d4e6;
    font-size: 16px;
    transition: color .2s ease, background-color .2s ease, border .2s ease, filter .2s ease
}

@media (min-width:410px) and (max-width:510px) {
    .progressive-deposit-modal__tab-nav-btn {
        gap: 4px;
        font-size: 14px;
        padding: 10px
    }
}

@media (min-width:0) and (max-width:409px) {
    .progressive-deposit-modal__tab-nav-btn {
        flex-shrink: 0;
        font-size: 14px
    }
}

.progressive-deposit-modal__tab-nav-btn.active {
    color: #eae5ff;
    background-color: #6542ff;
    border: 1px solid #6542ff
}

.progressive-deposit-modal__tab-nav-btn:hover {
    filter: grayscale(100%)
}

.progressive-deposit-modal__tabs {
    position: relative;
    width: 100%
}

.progressive-deposit-modal__tab {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    position: absolute;
    transition: opacity .2s ease, visibility .2s ease;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 1
}

.progressive-deposit-modal__tab.active {
    opacity: 1;
    visibility: visible;
    position: relative;
    pointer-events: initial;
    z-index: 2
}

.progressive-deposit-modal__pay-methods {
    display: flex;
    gap: 8px;
    flex-wrap: wrap
}

@media (min-width:0) and (max-width:499px) {
    .progressive-deposit-modal__pay-methods {
        gap: 4px
    }
}

.progressive-deposit-modal__pay-method {
    width: 130px;
    height: 92px;
    background-color: #191c2d;
    padding: 16px 16px 22px 16px;
    border-radius: 16px;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    cursor: pointer
}

@media (min-width:500px) and (max-width:959px) {
    .progressive-deposit-modal__pay-method {
        width: calc(33.33333% - 6px)
    }
}

@media (min-width:0) and (max-width:499px) {
    .progressive-deposit-modal__pay-method {
        width: calc(50% - 2px)
    }
}

.progressive-deposit-modal__pay-method::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    border: 1px solid #6542ff;
    border-radius: 16px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: scale(1.05);
    z-index: 1;
    transition: opacity .2s ease, visibility .2s ease, transform .1s ease
}

.progressive-deposit-modal__pay-method:hover::before {
    opacity: 1;
    visibility: visible;
    pointer-events: initial;
    transform: scale(1)
}

.progressive-deposit-modal__pay-method.active {
    background-color: #262b44
}

.progressive-deposit-modal__pay-method.active::before {
    opacity: 1;
    visibility: visible;
    pointer-events: initial;
    transform: scale(1)
}

.progressive-deposit-modal__pay-method-tag {
    position: absolute;
    top: -8px;
    right: -8px;
    background-color: #6ea844;
    font-size: 12px;
    text-transform: uppercase;
    color: #e3f0d7;
    padding: 2px 4px;
    border-radius: 25px;
    cursor: pointer;
    z-index: 2
}

.progressive-deposit-modal__pay-method-info {
    color: #8990be;
    font-size: 12px;
    line-height: 100%;
    text-transform: uppercase;
    position: absolute;
    bottom: 6px;
    left: 6px;
    display: flex;
    align-items: center
}

.progressive-deposit-modal__select-pay-method {
    background-color: #262b44;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px;
    border-radius: 16px;
    margin-bottom: 12px
}

.progressive-deposit-modal__select-pay-method-label {
    color: #5f689e;
    line-height: 100%;
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 8px
}

.progressive-deposit-modal__select-pay-method-name {
    color: #8990be;
    line-height: 120%;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 20px;
    opacity: 0
}

.progressive-deposit-modal__select-pay-method-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 48px
}

.progressive-deposit-modal__select-pay-method-logo img {
    opacity: 0
}

.progressive-deposit-modal__card {
    border-radius: 16px;
    padding: 16px;
    background-color: #161827
}

.progressive-deposit-modal__card:not(:last-of-type) {
    margin-bottom: 12px
}

.progressive-deposit-modal__card-label {
    color: #8990be;
    font-size: 20px;
    font-weight: 600;
    line-height: 120%;
    margin-bottom: 12px
}

.progressive-deposit-modal__input-group {
    position: relative
}

.progressive-deposit-modal__input {
    width: 100%;
    background-color: #161827;
    border-radius: 8px;
    border: 1px solid rgba(51, 57, 92, .5019607843);
    padding: 16px 16px 16px 48px;
    outline: 0;
    transition: border .2s ease;
    color: #8990be
}

@media (min-width:0) and (max-width:499px) {
    .progressive-deposit-modal__input {
        padding: 16px 16px 16px 44px
    }
}

.progressive-deposit-modal__input.result-amount {
    background-color: #191c2d
}

.progressive-deposit-modal__input:focus {
    border: 1px solid #6542ff
}

.progressive-deposit-modal__input::-moz-placeholder {
    color: #33395c;
    font-weight: 500
}

.progressive-deposit-modal__input::placeholder {
    color: #33395c;
    font-weight: 500
}

.progressive-deposit-modal__input::-webkit-input-placeholder {
    color: #33395c
}

.progressive-deposit-modal__input::-moz-placeholder {
    color: #33395c
}

.progressive-deposit-modal__input:-ms-input-placeholder {
    color: #33395c
}

.progressive-deposit-modal__promo-code {
    position: relative
}

.progressive-deposit-modal__promo-code::after,
.progressive-deposit-modal__promo-code::before {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: visibility .2s ease, opacity .2s ease
}

.progressive-deposit-modal__promo-code::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #8774b8;
    -webkit-mask-image: url("data:image/svg+xml;charset=UTF-8,%3csvg class='logo_holo' xmlns='http://www.w3.org/2000/svg' width='256' height='256' viewBox='0 0 256 256'%3e%3cdefs%3e%3cstyle%3e .logo_holo %7b filter: drop-shadow(0px 0px 10px %23FFF);%7d .char %7b fill: %23FFF0; stroke-width: 2; stroke: %23FFF;%7d .anim %7b animation: loading1 5s linear infinite;%7d .anim2 %7b animation: loading2 5s linear infinite;%7d %40keyframes loading1 %7b to%7b stroke-dashoffset: 0;%7d %7d %40keyframes loading2 %7b 0%25%7b opacity: 0.75;%7d 50%25%7b opacity: 0.25;%7d 100%25%7b opacity: 0.75;%7d %7d %3c/style%3e%3c/defs%3e%3cg transform='translate(26,230) scale(0.8,-0.8)'%3e%3cpath class='char anim2' style='stroke-dasharray: 1558;animation-duration: 2s;filter: drop-shadow(0px 0px 10px %23FFF);' d='M113.0 255.0 c-48.5 -6.2 -89.4 -38.9 -105.5 -84.3 -1.5 -4.3 -2.6 -7.9 -2.4 -8.2 0.3 -0.2 19.1 -1.8 41.9 -3.4 22.8 -1.7 43.8 -3.3 46.7 -3.7 l5.2 -0.5 20.0 39.8 c11.4 22.8 20.1 39.2 20.5 38.3 0.3 -0.8 3.7 -17.7 7.6 -37.5 3.9 -19.8 7.4 -37.0 7.7 -38.2 l.5 -2.3 31.4 0 31.4 0 -24.0 -23.7 -23.9 -23.8 8.4 -35.4 c4.7 -19.5 8.4 -35.5 8.3 -35.6 -0.2 -0.2 -13.5 12.3 -29.6 27.6 -16.1 15.3 -29.7 27.9 -30.2 27.9 -0.6 0 -14.6 -12.1 -31.3 -26.9 -16.6 -14.8 -30.3 -26.8 -30.5 -26.6 -0.1 0.1 3.6 17.0 8.2 37.6 4.6 20.6 8.3 37.5 8.2 37.6 -0.4 0.4 -78.7 16.3 -80.3 16.3 -1.4 0 -1.5 -1.3 -0.9 -9.7 2.3 -32.9 15.6 -61.5 39.0 -84.1 18.1 -17.5 38.6 -28.3 64.1 -33.8 11.1 -2.4 37.9 -2.4 49.0 0 26.7 5.8 46.9 16.7 65.6 35.5 19.0 18.9 29.9 39.3 35.6 66.1 2.4 11.6 2.4 36.2 -0.1 48.0 -5.6 27.0 -17.7 49.1 -37.0 67.8 -18.2 17.5 -39.3 28.6 -64.0 33.7 -9.4 1.9 -30.5 2.7 -39.6 1.5z'%3e%3c/path%3e%3cpath class='char anim' style='stroke-dasharray: 194.75;stroke-dashoffset: -1558;animation-duration: 5s;stroke-width: 2px;filter: drop-shadow(0px 0px 10px %23FFF);' d='M113.0 255.0 c-48.5 -6.2 -89.4 -38.9 -105.5 -84.3 -1.5 -4.3 -2.6 -7.9 -2.4 -8.2 0.3 -0.2 19.1 -1.8 41.9 -3.4 22.8 -1.7 43.8 -3.3 46.7 -3.7 l5.2 -0.5 20.0 39.8 c11.4 22.8 20.1 39.2 20.5 38.3 0.3 -0.8 3.7 -17.7 7.6 -37.5 3.9 -19.8 7.4 -37.0 7.7 -38.2 l.5 -2.3 31.4 0 31.4 0 -24.0 -23.7 -23.9 -23.8 8.4 -35.4 c4.7 -19.5 8.4 -35.5 8.3 -35.6 -0.2 -0.2 -13.5 12.3 -29.6 27.6 -16.1 15.3 -29.7 27.9 -30.2 27.9 -0.6 0 -14.6 -12.1 -31.3 -26.9 -16.6 -14.8 -30.3 -26.8 -30.5 -26.6 -0.1 0.1 3.6 17.0 8.2 37.6 4.6 20.6 8.3 37.5 8.2 37.6 -0.4 0.4 -78.7 16.3 -80.3 16.3 -1.4 0 -1.5 -1.3 -0.9 -9.7 2.3 -32.9 15.6 -61.5 39.0 -84.1 18.1 -17.5 38.6 -28.3 64.1 -33.8 11.1 -2.4 37.9 -2.4 49.0 0 26.7 5.8 46.9 16.7 65.6 35.5 19.0 18.9 29.9 39.3 35.6 66.1 2.4 11.6 2.4 36.2 -0.1 48.0 -5.6 27.0 -17.7 49.1 -37.0 67.8 -18.2 17.5 -39.3 28.6 -64.0 33.7 -9.4 1.9 -30.5 2.7 -39.6 1.5z'%3e%3c/path%3e%3cpath class='char anim' style='stroke-dasharray: 389.5;stroke-dashoffset: -1558;animation-duration: 7.5s;stroke-width: 4px;opacity: 0.75;filter: drop-shadow(0px 0px 10px %23FFF);' d='M113.0 255.0 c-48.5 -6.2 -89.4 -38.9 -105.5 -84.3 -1.5 -4.3 -2.6 -7.9 -2.4 -8.2 0.3 -0.2 19.1 -1.8 41.9 -3.4 22.8 -1.7 43.8 -3.3 46.7 -3.7 l5.2 -0.5 20.0 39.8 c11.4 22.8 20.1 39.2 20.5 38.3 0.3 -0.8 3.7 -17.7 7.6 -37.5 3.9 -19.8 7.4 -37.0 7.7 -38.2 l.5 -2.3 31.4 0 31.4 0 -24.0 -23.7 -23.9 -23.8 8.4 -35.4 c4.7 -19.5 8.4 -35.5 8.3 -35.6 -0.2 -0.2 -13.5 12.3 -29.6 27.6 -16.1 15.3 -29.7 27.9 -30.2 27.9 -0.6 0 -14.6 -12.1 -31.3 -26.9 -16.6 -14.8 -30.3 -26.8 -30.5 -26.6 -0.1 0.1 3.6 17.0 8.2 37.6 4.6 20.6 8.3 37.5 8.2 37.6 -0.4 0.4 -78.7 16.3 -80.3 16.3 -1.4 0 -1.5 -1.3 -0.9 -9.7 2.3 -32.9 15.6 -61.5 39.0 -84.1 18.1 -17.5 38.6 -28.3 64.1 -33.8 11.1 -2.4 37.9 -2.4 49.0 0 26.7 5.8 46.9 16.7 65.6 35.5 19.0 18.9 29.9 39.3 35.6 66.1 2.4 11.6 2.4 36.2 -0.1 48.0 -5.6 27.0 -17.7 49.1 -37.0 67.8 -18.2 17.5 -39.3 28.6 -64.0 33.7 -9.4 1.9 -30.5 2.7 -39.6 1.5z'%3e%3c/path%3e%3cpath class='char anim' style='stroke-dasharray: 779;stroke-dashoffset: -1558;animation-duration: 10s;stroke-width: 6px;opacity: 0.5;filter: drop-shadow(0px 0px 10px %23FFF);' d='M113.0 255.0 c-48.5 -6.2 -89.4 -38.9 -105.5 -84.3 -1.5 -4.3 -2.6 -7.9 -2.4 -8.2 0.3 -0.2 19.1 -1.8 41.9 -3.4 22.8 -1.7 43.8 -3.3 46.7 -3.7 l5.2 -0.5 20.0 39.8 c11.4 22.8 20.1 39.2 20.5 38.3 0.3 -0.8 3.7 -17.7 7.6 -37.5 3.9 -19.8 7.4 -37.0 7.7 -38.2 l.5 -2.3 31.4 0 31.4 0 -24.0 -23.7 -23.9 -23.8 8.4 -35.4 c4.7 -19.5 8.4 -35.5 8.3 -35.6 -0.2 -0.2 -13.5 12.3 -29.6 27.6 -16.1 15.3 -29.7 27.9 -30.2 27.9 -0.6 0 -14.6 -12.1 -31.3 -26.9 -16.6 -14.8 -30.3 -26.8 -30.5 -26.6 -0.1 0.1 3.6 17.0 8.2 37.6 4.6 20.6 8.3 37.5 8.2 37.6 -0.4 0.4 -78.7 16.3 -80.3 16.3 -1.4 0 -1.5 -1.3 -0.9 -9.7 2.3 -32.9 15.6 -61.5 39.0 -84.1 18.1 -17.5 38.6 -28.3 64.1 -33.8 11.1 -2.4 37.9 -2.4 49.0 0 26.7 5.8 46.9 16.7 65.6 35.5 19.0 18.9 29.9 39.3 35.6 66.1 2.4 11.6 2.4 36.2 -0.1 48.0 -5.6 27.0 -17.7 49.1 -37.0 67.8 -18.2 17.5 -39.3 28.6 -64.0 33.7 -9.4 1.9 -30.5 2.7 -39.6 1.5z'%3e%3c/path%3e%3c/g%3e%3c/svg%3e");
    background-size: contain;
    background-repeat: no-repeat;
    z-index: 2;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px)
}

.progressive-deposit-modal__promo-code::after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    border-radius: 8px
}

.progressive-deposit-modal__promo-code.loading::after,
.progressive-deposit-modal__promo-code.loading::before {
    opacity: 1;
    visibility: visible;
    pointer-events: initial
}

.progressive-deposit-modal__promo-code .apply-promo-code {
    position: absolute;
    border: none;
    background-color: #6ea844;
    color: #fff;
    right: 0;
    top: 50%;
    transform: translate(-10px, -50%);
    font-size: 14px;
    cursor: pointer;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: visibility .2s ease, opacity .2s ease;
    padding: 5px 10px;
    border-radius: 6px
}

.progressive-deposit-modal__promo-code .apply-promo-code.show {
    opacity: 1;
    visibility: visible;
    pointer-events: initial
}

.progressive-deposit-modal__input-group-icon {
    position: absolute;
    left: 16px;
    top: 50%;
    transform: translate(0, -50%)
}

.progressive-deposit-modal__amount-input-group {
    display: flex;
    align-items: center;
    margin-bottom: 12px
}

.progressive-deposit-modal__input-group-icon[data-wallet] {
    width: 20px;
    height: 20px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    opacity: .8
}

@media (min-width:0) and (max-width:499px) {
    .progressive-deposit-modal__input-group-icon[data-wallet] {
        width: 18px;
        height: 18px
    }
}

.progressive-deposit-modal__amount-exchange {
    margin: 0 10px
}

.progressive-deposit-modal__amount-exchange svg {
    display: flex
}

.progressive-deposit-modal__bonus {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 11px;
    background-color: #121421;
    border-radius: 12px;
    padding: 8px;
    margin-bottom: 12px
}

.progressive-deposit-modal__bonus-item {
    width: calc(20% - 9px);
    position: relative;
    background-color: #262b44;
    border-radius: 8px;
    text-align: center;
    color: #8990be;
    font-size: 16px;
    font-weight: 700;
    padding: 16px;
    cursor: pointer;
    transition: filter .2s ease
}

@media (min-width:0) and (max-width:599px) {
    .progressive-deposit-modal__bonus-item {
        padding: 10px;
        font-size: 14px
    }

    .progressive-deposit-modal__bonus-item:nth-of-type(1),
    .progressive-deposit-modal__bonus-item:nth-of-type(2),
    .progressive-deposit-modal__bonus-item:nth-of-type(3) {
        width: calc(33.333333% - 9px)
    }

    .progressive-deposit-modal__bonus-item:nth-of-type(4),
    .progressive-deposit-modal__bonus-item:nth-of-type(5) {
        width: calc(50% - 9px)
    }
}

.progressive-deposit-modal__bonus-item:hover {
    filter: grayscale(1)
}

.progressive-deposit-modal__bonus-item.active {
    background-color: #ffac4d;
    color: #522c00
}

.progressive-deposit-modal__bonus-item:not(:first-child)::before {
    content: "";
    background-color: #191c2d;
    height: 100%;
    width: 1px;
    border-radius: 2px;
    position: absolute;
    top: 0;
    left: -6px
}

.progressive-deposit-modal__bonus-line {
    background-color: #191c2d;
    height: 4px;
    border-radius: 8px;
    width: 100%;
    margin-bottom: 12px;
    position: relative;
    overflow: hidden
}

.progressive-deposit-modal__bonus-line-progress {
    background-color: #ffac4d;
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    height: 100%;
    border-radius: 8px;
    transition: width .2s ease
}

.progressive-deposit-modal__bonus-amount {
    display: flex;
    align-items: center;
    gap: 11px
}

.progressive-deposit-modal__bonus-amount-item {
    width: calc(20% - 9px);
    padding: 16px 6px;
    text-align: center;
    color: #33395c;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
    transition: color .2s ease, opacity .2s ease
}

@media (min-width:0) and (max-width:599px) {
    .progressive-deposit-modal__bonus-amount-item {
        display: none;
        width: 100%;
        justify-content: center;
        padding: 10px 6px
    }
}

.progressive-deposit-modal__bonus-amount-item.active {
    color: #d1d4e6;
    opacity: 1 !important
}

@media (min-width:0) and (max-width:599px) {
    .progressive-deposit-modal__bonus-amount-item.active {
        display: flex
    }
}

.progressive-deposit-modal__bonus-amount-item:hover {
    color: #fff;
    opacity: .6
}

.progressive-deposit-modal__total {
    border-bottom: 1px rgba(51, 57, 92, .5019607843) solid;
    padding: 12px;
    margin-bottom: 12px
}

.progressive-deposit-modal__total-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px
}

.progressive-deposit-modal__total-item:not(:last-child) {
    margin-bottom: 7px
}

.progressive-deposit-modal__total-label {
    font-size: 14px;
    font-weight: 500;
    color: #8990be
}

.progressive-deposit-modal__total-value {
    color: #8990be;
    font-size: 16px;
    font-weight: 700
}

.progressive-deposit-modal__total-value.bonus,
.progressive-deposit-modal__total-value.mega-bonus {
    background-color: #ffac4d;
    color: #522c00;
    opacity: .5;
    padding: 0 4px;
    border-radius: 25px
}

.progressive-deposit-modal__mega-bonus-alert {
    display: flex;
    align-items: center;
    padding: 14px;
    color: #ffc17a;
    border: 1px rgba(255, 172, 77, .1) solid;
    border-radius: 6px;
    margin-top: 10px;
    gap: 8px;
    font-size: 15px
}

.progressive-deposit-modal__mega-bonus-alert svg {
    flex-shrink: 0
}

.progressive-deposit-modal__btn {
    width: 100%
}

.preloader-request {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    background-color: rgba(0, 0, 0, .5137254902);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 20;
    transition: opacity .2s ease, visibility .2s ease
}

.preloader-request.show {
    opacity: 1;
    visibility: visible;
    pointer-events: initial
}

.preloader-request__body {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%
}

.preloader-request__lds-ring {
    display: inline-block;
    position: relative;
    width: 80px;
    height: 80px
}

.preloader-request__lds-ring div {
    display: block;
    position: absolute;
    width: 64px;
    height: 64px;
    margin: 8px;
    border-width: 8px;
    border-style: solid;
    border-radius: 50%;
    animation: lds-ring 1.2s cubic-bezier(.5, 0, .5, 1) infinite;
    border-color: #6542ff transparent transparent transparent
}

.preloader-request__lds-ring div:nth-child(1) {
    animation-delay: -.45s
}

.preloader-request__lds-ring div:nth-child(2) {
    animation-delay: -.3s
}

.preloader-request__lds-ring div:nth-child(3) {
    animation-delay: -.15s
}

@keyframes lds-ring {
    0% {
        transform: rotate(0)
    }

    100% {
        transform: rotate(360deg)
    }
}

.grid-table {
    display: grid;
    gap: 10px
}

.grid-table-col-4 {
    grid-template-columns: repeat(4, 1fr)
}

.grid-table-col-3 {
    grid-template-columns: repeat(3, 1fr)
}

.grid-table-rows-1 {
    grid-template-rows: repeat(1, 1fr)
}

.grid-table-header {
    border: 1px rgba(51, 57, 92, .5019607843) solid;
    padding: 16px;
    border-radius: 8px;
    color: #8990be;
    font-weight: 700;
    margin-bottom: 20px
}

.grid-table-row {
    background-color: #262b44;
    padding: 16px;
    border-radius: 8px;
    color: #d1d4e6;
    align-items: center;
    position: relative;
    z-index: 6
}

.grid-table-row:not(:last-child) {
    margin-bottom: 12px
}

.grid-table-col-4-transaction {
    grid-template-columns: minmax(min-content, 90px) 1fr minmax(min-content, 90px) minmax(min-content, 155px)
}

.grid-table-col-3-basket {
    grid-template-columns: 1fr minmax(min-content, 90px) 1fr
}

.grid-table-col-4-basket {
    grid-template-columns: 1fr minmax(min-content, 90px) minmax(min-content, 90px) 1fr
}

.grid-table-null-result {
    display: flex;
    background-color: rgba(255, 172, 77, .0509803922);
    color: #ffac4d;
    padding: 16px 16px;
    gap: 4px;
    border-radius: 8px
}

.grid-table-null-result svg {
    flex-shrink: 0
}

.header-top__top {
    display: flex;
    justify-content: flex-end;
    margin-left: 10px
}

@media (min-width:320px) and (max-width:479px) {
    .header-top__top {
        display: none
    }
}

.header-top__top-col {
    display: flex;
    flex-direction: column;
    gap: 2px;
    align-items: stretch
}

.header-top__lang {
    position: relative;
    cursor: pointer
}

.header-top__lang.show .header-top__lang-list {
    opacity: 1;
    visibility: visible;
    pointer-events: initial;
    transform: translateY(2px)
}

.header-top__lang-current {
    display: flex;
    align-items: center;
    gap: 2px;
    background-color: #262b44;
    padding: 3px 6px;
    border-radius: 5px;
    font-size: 12px;
    transition: background-color .2s ease
}

.header-top__lang-current img,
.header-top__lang-current svg {
    width: 12px;
    height: 12px
}

.header-top__lang-current:hover {
    cursor: pointer;
    background-color: #121421
}

.header-top__lang-current-value {
    text-transform: uppercase;
    font-weight: 700;
    color: #8990be
}

.header-top__lang-list {
    position: absolute;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    z-index: 10;
    transform: translateY(-10px);
    min-width: -moz-max-content;
    min-width: max-content;
    right: 0;
    max-width: 150px;
    background-color: #191c2d;
    padding: 8px;
    width: 100%;
    border-radius: 8px;
    text-transform: uppercase;
    transition: opacity .2s ease, visibility .2s ease, transform .2s ease
}

.header-top__lang-list-item {
    color: #8990be;
    padding: 10px;
    border-radius: 8px;
    display: flex;
    transition: background-color .2s ease;
    font-size: 12px
}

.header-top__lang-list-item.active {
    background-color: #161827
}

.header-top__lang-list-item:hover {
    background-color: #0d0e17
}

.header-top {
    position: fixed;
    width: 100%;
    top: 0;
    left: 0;
    background-color: #161827;
    border-bottom: 2px solid #33395c;
    z-index: 10;
    transition: transform .3s ease
}

.header-top.hide {
    transform: translateY(-100%)
}

.header-top__wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 0
}

.header-top__col {
    display: flex;
    align-items: center
}

@media (min-width:320px) and (max-width:639px) {
    .header-top__logo-link {
        width: 47px;
        margin-right: 15px
    }
}

.header-top__logo-link:hover img {
    transform: scale(1.05)
}

.header-top__logo {
    margin-top: 6px;
    transition: transform .2s ease
}

@media (min-width:320px) and (max-width:639px) {
    .header-top__logo--desktop {
        display: none
    }
}

.header-top__logo--mobile {
    display: none
}

@media (min-width:320px) and (max-width:639px) {
    .header-top__logo--mobile {
        margin-top: 0;
        display: block
    }
}

@media (max-width:1200px) {
    .header-top__nav {
        display: none
    }
}

.header-top__menu {
    display: flex;
    align-items: center
}

.header-top__menu-item:not(:last-child) {
    margin-right: 16px
}

.header-top__menu-link {
    display: flex;
    align-items: center;
    padding: 12px 16px;
    opacity: .7;
    transition: opacity .2s ease, background-color .2s ease;
    background-color: #262b44;
    border-radius: 8px
}

.header-top__menu-link.active {
    opacity: 1;
    background-color: #6542ff
}

.header-top__menu-link:hover {
    opacity: 1
}

.header-top__menu-icon {
    margin-right: 4px
}

.header-top__auth {
    display: flex;
    align-items: center;
    border: 0 #6ea844 solid;
    background-color: #6ea844;
    padding: 10px 25px;
    border-radius: 12px;
    transition: filter .2s ease
}

@media (min-width:320px) and (max-width:479px) {
    .header-top__auth {
        font-size: 14px;
        padding: 8px 16px
    }

    .header-top__auth svg {
        width: 20px;
        height: 20px;
        margin-right: 4px
    }
}

.header-top__auth:hover {
    filter: grayscale(50%)
}

.header-top__auth-logo {
    width: 24px;
    height: 24px;
    margin-right: 6px
}

.header-top__player {
    display: flex;
    align-items: center
}

.header-top__player-controls {
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    position: relative
}

.header-top__player-controls:hover .header-top__player-avatar {
    filter: grayscale(50%)
}

.header-top__player-controls.show .header-top__player-drop-menu-wrapper {
    opacity: 1;
    visibility: visible;
    pointer-events: initial;
    transform: translateY(10px)
}

.header-top__player-controls.show .header-top__player-dropdown svg {
    transform: rotate(180deg)
}

.header-top__player-dropdown {
    display: flex;
    margin-left: 4px
}

.header-top__player-dropdown svg {
    transition: transform .2s ease
}

.header-top__player-drop-menu-wrapper {
    position: absolute;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    z-index: 10;
    transform: translateY(20px);
    transition: opacity .2s ease, visibility .2s ease, transform .2s ease;
    background-color: #0d0e17;
    top: 100%;
    right: 0;
    min-width: 190px;
    max-width: 300px;
    padding: 8px 16px;
    border-radius: 8px
}

.header-top__player-drop-menu-item:not(:last-child) {
    border-bottom: 1px solid rgba(51, 57, 92, .5019607843)
}

.header-top__player-drop-menu-link {
    display: flex;
    gap: 12px;
    align-items: center;
    padding: 12px 0;
    cursor: pointer;
    color: #d1d4e6;
    transition: color .2s ease
}

.header-top__player-drop-menu-link svg {
    display: flex
}

.header-top__player-drop-menu-link:hover {
    color: #fff
}

.header-top__player-balance {
    margin-right: 10px;
    display: flex;
    align-self: center;
    background-color: #191c2d;
    border-radius: 8px;
    border: 2px solid #6ea844;
    height: 46px
}

@media (min-width:320px) and (max-width:479px) {
    .header-top__player-balance {
        height: 36px;
        margin-right: 8px
    }
}

.header-top__player-amount {
    margin-left: 12px;
    color: #fff;
    display: flex;
    align-self: center;
    gap: 6px
}

.header-top__player-amount span:nth-of-type(1) {
    color: #e3f0d7
}

.header-top__player-amount span:nth-of-type(2) {
    color: #c9e3b3
}

@media (min-width:320px) and (max-width:479px) {
    .header-top__player-amount {
        font-size: 13px
    }
}

.header-top__pay {
    width: 46px;
    height: 44px;
    border-radius: 8px 4px 4px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 12px;
    background-color: #6ea844;
    cursor: pointer;
    transition: filter .2s ease
}

.header-top__pay svg path {
    fill: #e3f0d7
}

@media (min-width:320px) and (max-width:479px) {
    .header-top__pay {
        width: 36px;
        height: 34px;
        margin-left: 10px
    }

    .header-top__pay svg {
        width: 16px;
        height: 16px
    }
}

.header-top__pay:hover {
    filter: grayscale(50%)
}

.header-top__player-avatar {
    width: 44px;
    height: 44px;
    border-radius: 8px;
    overflow: hidden;
    transition: filter .2s ease
}

@media (min-width:320px) and (max-width:479px) {
    .header-top__player-avatar {
        width: 36px;
        height: 36px
    }
}

.header-top__player-avatar img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.header-top__burger {
    background-color: #6542ff;
    width: 44px;
    height: 44px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    margin-left: 12px
}

@media (min-width:320px) and (max-width:479px) {
    .header-top__burger {
        width: 36px;
        height: 36px;
        margin-left: 8px
    }
}

.header-top__burger {
    display: none
}

@media (max-width:1200px) {
    .header-top__burger {
        display: flex
    }
}

.header-top__drop-menu-item {
    position: relative
}

.header-top__drop-menu-item .header-top__menu-link {
    flex-direction: row-reverse;
    gap: 3px
}

.header-top__drop-menu-item .header-top__menu-link svg {
    height: 24px
}

.header-top__submenu-wrapper {
    position: absolute;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    z-index: 10;
    transform: translateY(20px);
    transition: opacity .2s ease, visibility .2s ease, transform .2s ease;
    background-color: #0d0e17;
    right: 0;
    min-width: 150px;
    max-width: 300px;
    padding: 10px;
    border-radius: 8px
}

.header-top__drop-menu-item.show .header-top__submenu-wrapper {
    opacity: 1;
    visibility: visible;
    pointer-events: initial;
    transform: translateY(10px)
}

.header-top__menu-link svg {
    transition: transform .2s ease
}

.header-top__drop-menu-item.show .header-top__menu-link svg {
    transform: rotate(180deg)
}

.header-top__submenu-item:not(:last-of-type) {
    margin-bottom: 4px
}

.header-top__submenu-link {
    border-radius: 8px;
    padding: 10px 12px;
    color: #fff;
    background-color: #191c2d;
    display: block;
    transition: background-color .2s ease;
    font-size: 15px
}

.header-top__submenu-link:hover {
    background-color: #33395c
}

.header-top__pay {
    position: relative
}

.header-top__wallets-wrapper {
    position: absolute;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    z-index: 10;
    transform: translateY(20px);
    transition: opacity .2s ease, visibility .2s ease, transform .2s ease;
    background-color: #0d0e17;
    right: 0;
    top: 45px;
    min-width: 200px;
    max-width: 300px;
    padding: 14px;
    border-radius: 8px
}

.header-top__pay.show .header-top__wallets-wrapper {
    opacity: 1;
    visibility: visible;
    pointer-events: initial;
    transform: translateY(10px)
}

.header-top__wallets-item {
    border-radius: 8px;
    display: flex;
    justify-content: space-between;
    padding: 4px 0
}

.header-top__wallets-item.active {
    background-color: #ffac4d
}

.header-top__wallets-item:not(:last-of-type) {
    margin-bottom: 4px
}

.header-top__wallets-line {
    width: 100%;
    height: 1px;
    background-color: #262b44;
    margin: 10px 0
}

.header-top__wallets-btn {
    background-color: #ffac4d;
    padding: 10px 26px;
    width: 100%;
    color: #fff;
    transition: background-color .2s ease
}

.header-top__wallets-btn:hover {
    background-color: #ff8100
}

.header {
    position: relative;
    z-index: 2;
    padding-top: 25px
}

.header__wrapper {
    border-radius: 16px;
    background: url(../img/header-bg2-min.jpg) center center/cover no-repeat;
    position: relative;
    z-index: 2;
    padding: 0 64px;
    overflow: hidden
}

@media (min-width:480px) and (max-width:639px) {
    .header__wrapper {
        padding: 0 44px
    }
}

@media (min-width:320px) and (max-width:479px) {
    .header__wrapper {
        padding: 0 24px
    }
}

.header__wrapper::before {
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    opacity: .5;
    background: linear-gradient(0deg, #6542ff 0, #00184f 100%);
    z-index: -1
}

.header__title {
    color: #fff;
    font-size: 48px;
    font-weight: 700;
    margin-bottom: 16px;
    margin-top: 65px;
    line-height: 120%;
    position: relative;
    z-index: 3
}

@media (min-width:640px) and (max-width:959px) {
    .header__title {
        font-size: 36px
    }
}

@media (min-width:480px) and (max-width:639px) {
    .header__title {
        font-size: 32px
    }
}

@media (min-width:320px) and (max-width:479px) {
    .header__title {
        font-size: 28px;
        margin-top: 30px
    }
}

.header__subtitle {
    color: #fff;
    font-size: 22px;
    font-weight: 400;
    line-height: 120%;
    position: relative;
    z-index: 3
}

.header__subtitle span {
    display: block
}

@media (min-width:640px) and (max-width:959px) {
    .header__subtitle {
        font-size: 18px
    }
}

@media (min-width:480px) and (max-width:639px) {
    .header__subtitle {
        font-size: 16px
    }

    .header__subtitle span {
        display: inline-block
    }
}

@media (min-width:320px) and (max-width:479px) {
    .header__subtitle {
        font-size: 15px
    }

    .header__subtitle span {
        display: inline-block
    }
}

.header__btn-container {
    margin-top: 30px;
    margin-bottom: 65px
}

@media (min-width:320px) and (max-width:479px) {
    .header__btn-container {
        margin-bottom: 30px
    }
}

.header__btn {
    display: inline-flex;
    align-items: center;
    font-weight: 500
}

.header__btn:hover path {
    fill: #fff
}

@media (min-width:320px) and (max-width:479px) {
    .header__btn {
        padding: 16px 12px;
        width: 100%
    }
}

.header__btn-icon {
    margin-right: 6px
}

.header__btn-icon path {
    fill: #6542ff;
    transition: fill .2s ease
}

.header__player {
    position: absolute;
    bottom: -22px;
    right: 64px;
    z-index: 2
}

@media (min-width:320px) and (max-width:959px) {
    .header__player {
        display: none
    }
}

.footer {
    margin-top: 100px;
    background-color: #121421;
    color: #8990be
}

.footer__wrapper {
    padding: 60px 0
}

.footer__row {
    display: flex;
    justify-content: space-between;
    gap: 20px
}

@media (min-width:320px) and (max-width:959px) {
    .footer__row {
        flex-wrap: wrap
    }
}

@media (min-width:320px) and (max-width:639px) {
    .footer__row {
        justify-content: center
    }
}

.footer__row:nth-of-type(1) {
    align-items: flex-start
}

.footer__row:nth-of-type(2) {
    align-items: flex-end
}

.footer__row:not(:last-child) {
    margin-bottom: 25px
}

.footer__flex {
    display: flex;
    align-items: center
}

.footer__logo-link {
    display: none;
    margin-right: 15px
}

@media (min-width:320px) and (max-width:959px) {
    .footer__logo-link {
        display: block
    }
}

.footer__lang {
    position: relative;
    margin-right: 16px;
    cursor: pointer;
    flex-shrink: 0
}

.footer__lang.show .footer__lang-list {
    opacity: 1;
    visibility: visible;
    pointer-events: initial;
    transform: translateY(10px)
}

.footer__lang-current {
    display: flex;
    align-items: center;
    gap: 6px;
    background-color: #191c2d;
    padding: 8px;
    border-radius: 8px;
    transition: background-color .2s ease
}

.footer__lang-current:hover {
    background-color: #33395c
}

.footer__lang-current-value {
    text-transform: uppercase;
    font-weight: 700
}

.footer__lang-list {
    position: absolute;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    z-index: 10;
    transform: translateY(-20px);
    left: 0;
    background-color: #191c2d;
    padding: 10px;
    width: 100%;
    border-radius: 8px;
    text-transform: uppercase;
    transition: opacity .2s ease, visibility .2s ease, transform .2s ease
}

.footer__lang-list-item {
    color: #8990be;
    padding: 10px;
    border-radius: 8px;
    display: flex;
    transition: background-color .2s ease
}

.footer__lang-list-item.active {
    background-color: #161827
}

.footer__lang-list-item:hover {
    background-color: #0d0e17
}

.footer__social {
    display: flex;
    align-items: center;
    gap: 6px
}

.footer__social-item {
    background-color: #191c2d;
    padding: 8px;
    border-radius: 8px;
    opacity: .8;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    transition: opacity .2s
}

.footer__social-item:hover {
    opacity: 1
}

.footer__text {
    font-size: 14px
}

.footer__info {
    opacity: .8;
    font-weight: 700
}

@media (min-width:320px) and (max-width:639px) {
    .footer__info {
        text-align: center
    }
}

.footer__info span {
    display: block
}

.footer__company {
    opacity: .4
}

@media (min-width:320px) and (max-width:639px) {
    .footer__company {
        text-align: center
    }
}

.footer__docs {
    display: flex;
    align-items: center;
    gap: 16px
}

@media (min-width:320px) and (max-width:479px) {
    .footer__docs {
        flex-wrap: wrap;
        justify-content: center
    }
}

.footer__docs-item {
    color: #8990be;
    font-weight: 700;
    opacity: .4;
    transition: opacity .2s ease
}

.footer__docs-item:hover {
    opacity: .8
}

.servers {
    margin-top: 60px
}

.servers__top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
    flex-wrap: wrap;
    gap: 10px
}

.servers__title {
    color: #fff;
    font-size: 24px;
    font-weight: 700
}

.servers__online {
    display: flex;
    align-items: center;
    gap: 8px
}

.servers__online-status {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background-color: rgba(110, 168, 68, .15);
    display: flex;
    align-items: center;
    justify-content: center
}

.servers__online-status.pulse {
    position: relative
}

.servers__online-status.pulse::after,
.servers__online-status.pulse::before {
    content: "";
    position: absolute;
    border: 2px solid #6ea844;
    left: -20px;
    opacity: 0;
    right: -20px;
    top: -20px;
    bottom: -20px;
    border-radius: 50%;
    animation: pulse 2.5s linear infinite
}

.servers__online-status.pulse::after {
    animation-delay: 1.5s
}

@keyframes pulse {
    0% {
        transform: scale(.2);
        opacity: 0
    }

    50% {
        opacity: 1
    }

    100% {
        transform: scale(.5);
        opacity: 0
    }
}

.servers__online-status-circle {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #6ea844
}

.servers__online-count {
    color: #fff
}

.servers__online-label {
    color: #646992
}

.servers__list {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    gap: 25px
}

.servers__server {
    width: calc(25% - 20px)
}

@media (min-width:960px) and (max-width:1199px) {
    .servers__server {
        width: calc(33.333333% - 17px)
    }
}

@media (min-width:480px) and (max-width:959px) {
    .servers__server {
        width: calc(50% - 13px)
    }
}

@media (min-width:320px) and (max-width:479px) {
    .servers__server {
        width: 100%
    }
}

.servers__server-top {
    display: flex;
    align-items: center;
    width: 100%;
    justify-content: space-between;
    margin-bottom: 16px
}

.servers__server-top-col {
    display: flex;
    align-items: center
}

.servers__server-number {
    background-color: #6542ff;
    border-radius: 8px;
    color: #fff;
    font-weight: 700;
    width: 36px;
    height: 34px;
    margin-right: 8px;
    display: flex;
    align-items: center;
    justify-content: center
}

.servers__server-name {
    color: #fff;
    font-size: 16px;
    margin-right: 8px
}

.servers__server-connect {
    background-color: #262b44;
    border-radius: 8px;
    width: 36px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background-color .2s ease
}

.servers__server-connect svg path {
    transition: fill .2s ease
}

.servers__server-connect img {
    opacity: .6;
    transition: opacity .2s ease
}

.servers__server-connect:hover {
    background-color: #6542ff
}

.servers__server-connect:hover svg path {
    fill: #fff
}

.servers__server-connect:hover img {
    opacity: 1
}

.servers__server-bottom {
    position: relative;
    cursor: pointer
}

.servers__server-bottom:hover .servers__server-stats {
    opacity: 1;
    visibility: visible;
    bottom: 20px
}

.servers__server-stats {
    position: absolute;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    font-size: 13px;
    width: -moz-max-content;
    width: max-content;
    min-width: 150px;
    text-align: center;
    left: 50%;
    transform: translate(-50%, 0);
    background-color: #6542ff;
    padding: 10px;
    border-radius: 8px;
    bottom: -10px;
    color: #fff;
    transition: opacity .2s ease, visibility .2s ease, bottom .2s ease
}

.servers__server-stats-name {
    font-weight: 700;
    margin-bottom: 4px
}

.servers__server-stats-stat span {
    font-weight: 700
}

.servers__server-players {
    display: flex;
    justify-content: space-between;
    color: #8990be;
    font-weight: 700;
    margin-bottom: 16px
}

.servers__server-current {
    color: #fff
}

.servers__server-progress {
    width: 100%;
    height: 10px;
    border-radius: 8px;
    background-color: #121421;
    display: flex;
    overflow: hidden
}

.servers__server-progress-level {
    width: 100%;
    height: 100%;
    background-color: #43326f;
    background-image: linear-gradient(90deg, #6ea844 0, #6ea844 var(--online-players), #ffac4d var(--online-players), #ffac4d var(--joining-players), #ff4d4d var(--joining-players), #ff4d4d var(--queued-players), transparent var(--queued-players))
}

.mobile-menu {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    z-index: 20;
    transition: visibility .2s ease, opacity .2s ease
}

.mobile-menu.show {
    opacity: 1;
    visibility: visible;
    pointer-events: initial;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px)
}

.mobile-menu__backdrop {
    position: absolute;
    background-color: rgba(0, 0, 0, .5137254902);
    width: 100%;
    height: 100%;
    z-index: 1
}

.mobile-menu__container {
    width: 300px;
    background-color: #161827;
    height: 100%;
    position: absolute;
    right: 0;
    transform: translateX(100%);
    transition: transform .2s ease;
    z-index: 2
}

.mobile-menu__wrapper {
    padding: 20px 0
}

.mobile-menu__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px 20px;
    border-bottom: 1px solid #33395c
}

.mobile-menu__header-close {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    cursor: pointer;
    background-color: #262b44
}

.mobile-menu.show .mobile-menu__container {
    transform: translateX(0)
}

.mobile-menu__wrapper {
    position: relative
}

.mobile-menu__list {
    display: flex;
    flex-direction: column;
    margin: 32px 0 !important;
    padding: 0 20px !important
}

.mobile-menu__item:not(:last-child) {
    margin-bottom: 10px
}

.mobile-menu__link {
    background-color: #262b44;
    border-radius: 8px;
    color: #8990be;
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 700;
    line-height: 100%;
    padding: 16px
}

.mobile-menu__footer {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 0 20px 20px
}

.mobile-menu__auth-btn {
    display: flex;
    width: 100%;
    gap: 8px;
    align-items: center;
    justify-content: center;
    margin-top: 30px;
    background-color: #6ea844;
    color: #fff;
    border-radius: 8px;
    padding: 10px
}

.mobile-menu__controls {
    display: flex;
    align-items: center;
    border-radius: 16px;
    background-color: #262b44;
    overflow: hidden
}

.mobile-menu__control {
    display: flex;
    width: 50%;
    flex-shrink: 0;
    align-items: center;
    gap: 8px
}

.mobile-menu__control-btn {
    display: flex;
    align-items: center;
    gap: 4px;
    height: 44px;
    padding: 0 6px;
    text-transform: uppercase;
    font-size: 14px
}

.mobile-menu__control-btn.active {
    background-color: #6542ff;
    color: #fff
}

.products {
    margin-top: 60px
}

.products__info-gm-text {
    display: flex;
    gap: 6px;
    font-size: 18px;
    color: #fff;
    margin-bottom: 20px
}

.products__info-gm-text svg {
    flex-shrink: 0
}

.products__info-gm-text svg path {
    fill: #fff
}

.products__gmod-wrapper {
    margin-bottom: 40px;
    position: relative
}

.products__gmod {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    background-color: #262b44;
    padding: 6px;
    border-radius: 16px
}

.products__gmod-item {
    position: relative;
    z-index: 1;
    display: flex;
    flex: 1 0 var(--gm-item-width)
}

@media (min-width:480px) and (max-width:639px) {
    .products__gmod-item {
        flex: 1 0 33%
    }
}

@media (min-width:320px) and (max-width:479px) {
    .products__gmod-item {
        flex: 1 0 50%
    }
}

.products__gmod-btn {
    border-color: transparent;
    position: relative;
    z-index: 1;
    display: flex;
    flex-grow: 1;
    align-items: center;
    justify-content: center;
    height: 3rem
}

.products__gmod-btn.active {
    background-color: transparent;
    border-color: transparent
}

@media (min-width:320px) and (max-width:959px) {
    .products__gmod-btn.active {
        background-color: #6542ff;
        border-color: #6542ff
    }
}

.products__gmod-filter-slider {
    pointer-events: none;
    position: absolute;
    padding: 6px;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0
}

@media (min-width:320px) and (max-width:959px) {
    .products__gmod-filter-slider {
        display: none
    }
}

.products__gmod-filter-slider-rect {
    height: 3rem;
    width: var(--gm-item-width);
    border-radius: .8rem;
    background-color: #6542ff;
    transition: transform .2s ease-in-out;
    transform: translateX(var(--translate-filters-slider))
}

.products__list {
    display: flex;
    flex-wrap: wrap;
    gap: 25px
}

.products__card {
    width: calc(20% - 20px);
    position: relative;
    cursor: pointer
}

@media (min-width:960px) and (max-width:1199px) {
    .products__card {
        width: calc(33.333333% - 17px)
    }
}

@media (min-width:480px) and (max-width:959px) {
    .products__card {
        width: calc(50% - 13px)
    }
}

@media (min-width:320px) and (max-width:479px) {
    .products__card {
        width: 100%
    }
}

.products__card:hover .products__card-img {
    transform: scale(1.1)
}

.products__card.disabled .products__card-btn {
    background-color: #10111c;
    border-color: #10111c;
    color: #33395c
}

.products__card.disabled .products__card-btn svg path {
    fill: #33395c
}

.products__card-wrapper {
    position: relative
}

.products__card-discount {
    position: absolute;
    top: -14px;
    right: -14px;
    z-index: 3;
    display: flex
}

.products__card-discount-value {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    color: #fff;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: normal
}

.products__card-preview {
    position: relative;
    border-radius: 16px;
    border: 2px #272a41 solid;
    background: radial-gradient(50% 50% at 50% 50%, rgba(39, 42, 65, .2) 80%, rgba(25, 28, 45, .2) 100%), linear-gradient(180deg, #191c2d 0, #272a41 100%);
    margin-bottom: 16px;
    overflow: hidden;
    padding-bottom: 20px
}

.products__card-preview.loading {
    min-height: 236px
}

.products__card-preview.loading::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, #191c2d 25%, #262b44 50%, #191c2d 75%);
    background-size: 200% 100%;
    animation: skeleton-loading 2.5s linear infinite
}

@media (min-width:320px) and (max-width:479px) {
    .products__card-preview {
        display: flex;
        justify-content: center
    }
}

@keyframes skeleton-loading {
    0% {
        background-position: 200% 0
    }

    100% {
        background-position: -200% 0
    }
}

.products__card-img {
    transition: transform .2s
}

@media (min-width:320px) and (max-width:479px) {
    .products__card-img {
        width: 65%
    }
}

.products__card-state {
    position: absolute;
    bottom: 10px;
    left: 10px;
    z-index: 3;
    font-size: 16px;
    border-radius: 16px;
    padding: 4px 10px
}

.products__card-state--in-stock {
    background-color: rgba(110, 168, 68, .0509803922);
    color: #6ea844
}

.products__card-state--soon-end {
    background-color: rgba(132, 6, 6, .1019607843);
    color: #f74646
}

.products__card-state--sold-out {
    background-color: #10111c;
    color: #d1d4e6
}

.products__card-state--halloween {
    background-color: rgba(255, 172, 77, .0509803922);
    color: #ffac4d;
    font-size: 13px;
    padding: 5px 10px;
    font-weight: 500
}

.products__card-halloween-timer {
    position: absolute;
    z-index: 2;
    top: 16px;
    left: 16px;
    background-color: #ffac4d;
    color: #522c00;
    font-weight: 500;
    border-radius: 16px;
    font-size: 12px;
    padding: 4px 10px
}

.products__card-sold-out {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 2;
    background-color: rgba(38, 43, 68, .7803921569);
    top: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center
}

.products__card-sold-out-text {
    color: #8990be;
    max-width: 165px;
    text-align: center;
    margin-bottom: 8px;
    font-weight: 500
}

.products__card-sold-out-timer {
    color: #fff;
    font-weight: 600;
    text-align: center
}

.products__card-name {
    font-size: 16px;
    font-weight: 500;
    color: #fff;
    margin-bottom: 16px
}

.products__card-bottom {
    display: flex;
    align-items: center;
    gap: 8px
}

.products__card-price {
    position: relative;
    display: flex;
    gap: 4px;
    width: 50%;
    flex-shrink: 0;
    font-weight: 700;
    background-color: #161827;
    color: #fff;
    padding: 16px 10px;
    justify-content: center
}

.products__card-price.discount-price {
    background-color: rgba(255, 172, 77, .05);
    color: #ffac4d
}

.products__card-old-price {
    position: absolute;
    padding: 3px 6px;
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 11px;
    text-decoration: line-through;
    top: -10px;
    left: -10px;
    z-index: 2;
    background-color: #262b44;
    color: #8990be;
    border-radius: 8px
}

.products__card-old-price svg path {
    fill: #8990be
}

.products__card-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    width: 50%
}

.products__card-btn svg {
    margin-right: 8px
}

.products__card-btn-free {
    width: 100%;
    background-color: #6ea844;
    border-color: #6ea844
}

.products__card-halloween {
    border-radius: 12px;
    border: none;
    background: linear-gradient(180deg, rgba(38, 43, 68, 0) 25%, rgba(255, 131, 59, .65) 100%)
}

@media (min-width:320px) and (max-width:479px) {
    .products__card-halloween {
        padding-bottom: 16px
    }
}

.products__card-halloween::before {
    content: "";
    position: absolute;
    z-index: 1;
    pointer-events: none;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    border: 2px solid rgba(255, 172, 77, .1);
    border-radius: 12px
}

.products__card-halloween .products__card-preview {
    border: none;
    background: 0 0
}

.products__card-halloween .products__card-name {
    color: #ffc17a;
    padding: 0 16px
}

.products__card-halloween .products__card-bottom {
    padding: 0 16px
}

.products__card-halloween .products__card-price {
    padding: 10px 8px
}

.products__card-halloween .products__card-price.discount-price {
    background-color: #161827
}

.products__card-halloween .products__card-btn {
    padding: 10px 8px
}

.header-information__title {
    font-size: 48px;
    color: #fff;
    line-height: 120%;
    letter-spacing: -.96px;
    margin-bottom: 48px
}

@media (min-width:640px) and (max-width:959px) {
    .header-information__title {
        font-size: 32px
    }
}

@media (min-width:320px) and (max-width:639px) {
    .header-information__title {
        font-size: 28px
    }
}

.header-information__subtitle {
    color: #fff
}

.header-information__monitoring-title {
    text-align: center
}

.information__wrapper {
    display: flex;
    align-items: flex-start
}

@media (min-width:320px) and (max-width:959px) {
    .information__wrapper {
        flex-wrap: wrap
    }
}

.information__wrapper main {
    width: 100%
}

@media (min-width:320px) and (max-width:959px) {
    .information__aside {
        position: relative;
        width: 100%;
        margin-right: 0;
        top: 0;
        margin-bottom: 40px
    }
}

@media (min-width:320px) and (max-width:959px) {
    .information__aside.top {
        top: 0
    }
}

@media (min-width:320px) and (max-width:959px) {
    .information__nav-label {
        position: relative
    }
}

.information__section:not(:last-child) {
    margin-bottom: 25px
}

.information__section-title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 16px;
    font-size: 16px;
    font-weight: 700;
    color: #fff
}

.information__section-title svg {
    display: flex;
    width: 28px;
    height: 28px
}

.information__article-content span[onclick] {
    cursor: pointer;
    color: #ffac4d;
    padding: 0 6px;
    background: #191c2d;
    border-radius: 8px
}

.wipe-block__item:not(:last-child) {
    margin-bottom: 25px
}

.wipe-block__title {
    color: #8990be;
    margin-bottom: 12px;
    font-weight: 600
}

.wipe-block__game-items {
    display: flex;
    flex-wrap: wrap;
    gap: 6px
}

.wipe-block__game-item {
    width: 84px;
    height: 84px;
    background-color: #262b44;
    border-radius: 8px;
    position: relative;
    padding: 10px
}

.wipe-block__game-item-img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.wipe-block__game-item-time {
    position: absolute;
    bottom: 8px;
    right: 10px;
    color: #fff;
    z-index: 1
}

.servers-page__wrapper {
    display: flex;
    align-items: flex-start
}

@media (min-width:320px) and (max-width:959px) {
    .servers-page__wrapper {
        flex-wrap: wrap
    }
}

.servers-page__wrapper main {
    width: 100%
}

@media (min-width:320px) and (max-width:959px) {
    .servers-page__aside {
        position: relative;
        width: 100%;
        margin-right: 0;
        top: 0;
        margin-bottom: 40px
    }
}

@media (min-width:320px) and (max-width:959px) {
    .servers-page__aside.top {
        top: 0
    }
}

.servers-page__section:not(:last-child) {
    margin-bottom: 25px
}

.servers-page__section-title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 16px;
    font-size: 16px;
    font-weight: 700;
    color: #fff
}

.servers-page__section-title svg {
    display: flex;
    width: 28px;
    height: 28px
}

.servers-page__server-connect {
    margin-bottom: 20px
}

.servers-page__info-text {
    font-weight: 700;
    margin-bottom: 20px;
    color: #fff
}

.servers-page__server-info {
    margin-bottom: 25px
}

.servers-page__server-info-item {
    display: flex;
    align-items: center;
    gap: 6px
}

.servers-page__server-info-item:not(:last-child) {
    margin-bottom: 12px
}

.servers-page__server-info-icon svg {
    display: flex
}

.servers-page__server-info-icon svg path {
    fill: #6542ff
}

.servers-page__server-info-text {
    color: #fff
}

.server-monitoring__wrapper {
    display: flex;
    gap: 25px;
    align-items: self-start
}

@media (min-width:320px) and (max-width:959px) {
    .server-monitoring__wrapper {
        flex-wrap: wrap
    }
}

.server-monitoring__aside {
    width: 320px;
    flex-shrink: 0;
    background-color: #161827;
    border-radius: 16px;
    padding: 16px
}

@media (min-width:960px) and (max-width:1199px) {
    .server-monitoring__aside {
        width: 228px
    }
}

@media (min-width:320px) and (max-width:959px) {
    .server-monitoring__aside {
        display: none;
        width: 100%
    }
}

.server-monitoring__filter:not(:last-child) {
    border-bottom: 1px solid rgba(51, 57, 92, .5019607843);
    margin-bottom: 20px;
    padding-bottom: 20px
}

.server-monitoring__filter-name {
    color: #8990be;
    font-weight: 700;
    line-height: 140%;
    margin-bottom: 12px
}

.server-monitoring__btn-clear-filter {
    padding: 10px 16px;
    border: 2px rgba(51, 57, 92, .5019607843) solid;
    background-color: transparent;
    color: #d1d4e6;
    width: 100%
}

.server-monitoring__btn-clear-filter:hover {
    background-color: rgba(51, 57, 92, .5019607843)
}

.server-monitoring__content {
    width: 100%
}

@media (min-width:640px) and (max-width:959px) {
    .server-monitoring__content .grid-table-col-4 {
        grid-template-columns: repeat(3, 1fr)
    }
}

@media (min-width:320px) and (max-width:959px) {
    .server-monitoring__content .grid-table-col:nth-child(4) {
        display: none
    }
}

@media (min-width:320px) and (max-width:639px) {
    .server-monitoring__content .grid-table-row {
        display: flex;
        flex-wrap: wrap
    }

    .server-monitoring__content .grid-table-col:nth-child(3) {
        width: 100%
    }
}

.server-monitoring__servers-table {
    margin-top: -8px
}

.server-monitoring__servers-table tbody tr td {
    padding: 20px;
    color: #d1d4e6
}

@media (min-width:960px) and (max-width:1199px) {
    .server-monitoring__servers-table tbody tr td {
        padding: 14px
    }
}

@media (min-width:960px) and (max-width:1199px) {
    .server-monitoring .table th {
        padding: 16px 14px
    }
}

@media (min-width:320px) and (max-width:639px) {
    .server-monitoring .grid-table-header {
        display: none
    }
}

@media (min-width:390px) and (max-width:639px) {

    .server-monitoring .grid-table .grid-table-col:nth-of-type(1),
    .server-monitoring .grid-table .grid-table-col:nth-of-type(2) {
        width: calc(50% - 5px)
    }
}

@media (min-width:390px) and (max-width:639px) {
    .server-monitoring .grid-table .table-server-connect {
        justify-content: flex-end
    }
}

.table-server-connect {
    display: flex;
    align-items: center;
    gap: 8px
}

.table-server-connect-copy {
    background-color: #33395c;
    border-radius: 8px;
    width: 36px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background-color .2s ease
}

.table-server-connect-copy:hover {
    background-color: #6542ff
}

.table-server-players {
    margin-bottom: 10px
}

.table-server-players-total {
    color: #8990be
}

.table-server-progress {
    min-width: 120px;
    height: 3px;
    border-radius: 2px;
    background-color: #191c2d;
    position: relative;
    overflow: hidden
}

.table-server-progress-bar {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 0;
    background-color: #6542ff
}

.table-server-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 10px 16px;
    border: 2px rgba(51, 57, 92, .5019607843) solid;
    background-color: rgba(51, 57, 92, .5019607843);
    color: #d1d4e6;
    width: 100%;
    max-width: 150px
}

.table-server-btn svg {
    display: flex;
    flex-shrink: 0
}

.table-server-btn img {
    width: 24px;
    height: 24px
}

.table-server-btn:hover {
    background-color: transparent
}

.server-filter-alert {
    text-align: center
}

.server-filter-alert .server-monitoring__btn-clear-filter {
    max-width: 300px;
    margin-top: 15px
}

.grid-table-play-btn-container {
    display: flex;
    justify-content: flex-end
}

.filter-controls {
    display: none;
    justify-content: space-between;
    gap: 16px;
    align-items: center;
    margin-bottom: 35px
}

.filter-controls__label {
    font-weight: 600;
    color: #8990be
}

.filter-controls__btn {
    padding: 10px;
    background-color: #161827;
    border-radius: 8px
}

@media (min-width:320px) and (max-width:959px) {
    .filter-controls {
        display: flex
    }
}

.monitoring-triggers {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 35px;
    margin-bottom: 50px;
    flex-wrap: wrap
}

.monitoring-triggers__item {
    display: flex;
    align-items: center;
    gap: 4px
}

.monitoring-triggers__item-stats-value {
    color: #d1d4e6;
    font-size: 20px;
    font-weight: 600;
    line-height: 120%
}

.monitoring-triggers__item-stats-label {
    text-transform: uppercase;
    color: #8990be;
    line-height: 100%;
    font-size: 14px;
    font-weight: 500
}

.header-leaderboard__title {
    font-size: 48px;
    color: #fff;
    line-height: 120%;
    letter-spacing: -.96px;
    margin-bottom: 48px;
    text-align: center
}

.leaderboard__leaders {
    display: flex;
    gap: 15px;
    justify-content: center
}

.leaderboard__leader {
    width: 390px
}

.leaderboard__leader-avatar {
    display: flex;
    justify-content: center;
    margin-bottom: 16px
}

.leaderboard__leader-avatar img {
    width: 90px;
    height: 90px;
    border-radius: 8px;
    border: 1px solid #d9dadf;
    box-shadow: 0 15px 65px 0 rgba(225, 226, 231, .3)
}

.leaderboard__leader-name {
    font-size: 22px;
    font-style: normal;
    font-weight: 700;
    color: #fff;
    text-align: center;
    margin-bottom: 20px
}

.leaderboard__leader-position {
    position: relative
}

.leaderboard__leader-position-bg {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 2
}

.leaderboard__leader-position-container {
    position: relative;
    z-index: 3;
    min-height: 220px;
    display: flex;
    justify-content: space-between;
    padding: 0 45px
}

.leaderboard__leader-position-col {
    padding-top: 60px;
    text-align: center
}

.leaderboard__leader-position-score {
    color: #fff
}

.leaderboard__leader-position-label {
    color: #8990be;
    font-size: 14px
}

.leaderboard__leader-position-img {
    position: absolute;
    left: 50%;
    top: 0;
    z-index: 3;
    transform: translate(-50%, -16px);
    width: 150px;
    height: 150px
}

.leaderboard__leader--st2 {
    margin-top: 40px
}

.leaderboard__leader--st3 {
    margin-top: 60px
}

.leaderboard__leader--st3 .leaderboard__leader-position-img {
    width: 100px;
    height: 100px
}

.header-bans__wrapper {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px
}

@media (min-width:320px) and (max-width:639px) {
    .header-bans__wrapper {
        margin-bottom: 35px
    }
}

.header-bans__title {
    font-size: 32px;
    color: #fff;
    line-height: 120%;
    letter-spacing: -.96px;
    margin-bottom: 48px
}

@media (min-width:320px) and (max-width:639px) {
    .header-bans__title {
        font-size: 28px;
        margin-bottom: 0
    }
}

.header-bans__search-container {
    position: relative
}

@media (min-width:320px) and (max-width:639px) {
    .header-bans__search-container {
        width: 100%
    }
}

.header-bans__search {
    width: 300px;
    border: 1px solid transparent;
    outline: 0;
    transition: border .2s ease
}

@media (min-width:320px) and (max-width:639px) {
    .header-bans__search {
        width: 100%
    }
}

.header-bans__search:focus {
    border: 1px solid rgba(51, 57, 92, .5)
}

.bans__wrapper .table-responsive::-webkit-scrollbar {
    height: 4px
}

.bans__wrapper .table-responsive::-webkit-scrollbar-thumb {
    border-radius: 3px
}

.bans__wrapper .table-responsive::-webkit-scrollbar-track {
    border-radius: 3px
}

.bans__wrapper .table a {
    display: inline-block;
    max-height: 20px;
    overflow: hidden;
    max-width: 214px;
    white-space: nowrap
}

.bans__wrapper .table td:first-child {
    overflow: hidden
}

@media (min-width:640px) {
    .bans__wrapper .table td:first-child {
        width: 230px;
        max-width: 230px
    }
}

@media (min-width:960px) {
    .bans__wrapper .table td:first-child {
        width: 340px;
        max-width: 340px
    }
}

@media (min-width:1200px) {
    .bans__wrapper .table td:first-child {
        width: 440px;
        max-width: 440px
    }
}

@media (min-width:0) and (max-width:639px) {
    .bans__wrapper .table td:first-child {
        width: 170px;
        max-width: 170px
    }
}

.header-gamemode__title {
    font-size: 48px;
    color: #fff;
    line-height: 120%;
    letter-spacing: -.96px;
    margin-bottom: 10px
}

@media (min-width:320px) and (max-width:639px) {
    .header-gamemode__title {
        font-size: 28px
    }
}

.header-gamemode__subtitle {
    color: #fff;
    font-size: 20px;
    font-weight: 100;
    opacity: .8;
    margin-bottom: 48px
}

.game-mode__section {
    background-color: #161827;
    border: 2px solid #33395c;
    border-radius: 16px;
    padding: 20px
}

.game-mode__title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 15px;
    color: #fff
}

.game-mode__title-icon-wrapper {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background-color: #6542ff;
    display: flex;
    align-items: center;
    justify-content: center
}

.game-mode__tags {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 12px;
    align-items: center
}

.game-mode__tag {
    padding: 4px 10px;
    background-color: #262b44;
    border-radius: 8px;
    font-size: 14px;
    color: #d1d4e6
}

.game-mode__difficulty {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 15px
}

.game-mode__difficulty-label {
    color: #5f689e
}

.game-mode__difficulty-icon {
    display: flex
}

.game-mode__difficulty-progress {
    background-color: #262b44;
    width: 80px;
    height: 4px;
    border-radius: 8px;
    position: relative;
    overflow: hidden
}

.game-mode__difficulty-progress::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    height: 100%
}

.game-mode__difficulty-progress--green::before {
    background-color: #14ae5c;
    width: 33%
}

.game-mode__difficulty-progress--orange::before {
    background-color: #ffac4d;
    width: 66%
}

.game-mode__difficulty-progress--red::before {
    background-color: #ff4d4d;
    width: 100%
}

.game-mode__desc {
    color: #8990be;
    line-height: 140%;
    margin-bottom: 15px
}

.game-mode__desc p:not(:last-child) {
    margin-bottom: 6px
}

.game-mode__btn {
    display: inline-block
}

.header-page__title {
    font-size: 32px;
    color: #fff;
    line-height: 120%;
    letter-spacing: -.96px;
    margin-bottom: 32px
}

.page__wrapper {
    background-color: #262b44;
    padding: 30px;
    color: #fff;
    border-radius: 16px
}

.page__title {
    margin-bottom: 15px
}

.page__content p:not(:last-child) {
    margin-bottom: 10px
}

.page__content h4 {
    margin-top: 25px
}

.page__content ol li {
    line-height: 120%
}

.page__content ol li:not(:last-child) {
    margin-bottom: 15px
}

.page__content a {
    color: #6542ff;
    text-decoration: none;
    border-bottom: 1px dashed #6542ff;
    display: inline-block;
    position: relative;
    padding: 0 .2em;
    transition: all .2s ease;
    z-index: 2
}

.page__content a:active,
.page__content a:hover {
    outline-width: 0
}

.page__content a:hover {
    border-color: transparent
}

.page__content a:hover::before {
    height: 100%
}

.page__content a::before {
    content: "";
    z-index: -1;
    width: 100%;
    height: 0;
    background: rgba(101, 66, 255, .13);
    border-radius: 4px;
    bottom: 0;
    left: 0;
    position: absolute;
    transition: height .2s
}

.app-status__wrapper {
    text-align: center
}

.app-status__title {
    font-size: 38px;
    color: #5f689e;
    font-weight: 600;
    margin-top: 50px;
    margin-bottom: 20px
}

.app-status__code {
    color: #8990be;
    font-size: 550px;
    font-weight: 600;
    line-height: 80%;
    margin-bottom: 50px
}

.app-status__btn-container {
    display: flex;
    justify-content: center
}

.header-success {
    margin-top: 120px;
    margin-bottom: 20px
}

.header-success__wrapper {
    text-align: center
}

.header-success__icon-wrapper {
    border-radius: 50%;
    display: inline-block;
    box-shadow: 0 0 0 20px rgba(20, 174, 92, .0509803922);
    background-color: rgba(20, 174, 92, .0509803922);
    margin-bottom: 20px
}

.header-success__icon {
    display: flex
}

.header-success__title {
    color: #8990be;
    font-size: 20px;
    line-height: 120%;
    font-weight: 600
}

.header-success__amount {
    color: #fff;
    font-weight: 700;
    font-size: 48px;
    line-height: 120%;
    letter-spacing: -.96px
}

.deposit-details__wrapper {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center
}

.deposit-details__extract {
    max-width: 450px;
    width: 100%;
    border: 1px solid #33395c;
    border-radius: 16px;
    overflow: hidden
}

.deposit-details__extract-header {
    background-color: #161827;
    padding: 20px
}

.deposit-details__extract-header span {
    text-transform: uppercase;
    color: #5f689e;
    opacity: .5;
    font-weight: 700
}

.deposit-details__extract-content {
    padding: 0 20px
}

.deposit-details__extract-row {
    display: flex;
    justify-content: space-between;
    padding: 20px 0;
    font-size: 14px;
    line-height: 100%;
    font-weight: 500
}

.deposit-details__extract-row:not(:last-child) {
    border-bottom: 1px solid #33395c
}

.deposit-details__extract-col:nth-of-type(1) {
    color: #8990be
}

.deposit-details__extract-col:nth-of-type(2) {
    color: #5f689e
}

.deposit-details__btn-container {
    display: flex;
    justify-content: center;
    gap: 12px;
    margin-top: 20px
}

.deposit-details__btn {
    display: flex;
    align-items: center;
    justify-content: center
}

.header-fail {
    margin-top: 120px;
    margin-bottom: 20px
}

.header-fail__wrapper {
    text-align: center
}

.header-fail__icon-wrapper {
    border-radius: 50%;
    display: inline-block;
    box-shadow: 0 0 0 20px rgba(132, 6, 6, .1);
    background-color: rgba(132, 6, 6, .1);
    margin-bottom: 20px
}

.header-fail__icon {
    display: flex
}

.header-fail__title {
    color: #fff;
    font-size: 20px;
    line-height: 120%;
    font-weight: 600;
    margin-bottom: 12px
}

.header-fail__text {
    line-height: 140%;
    color: #8990be;
    margin-bottom: 10px
}

.header-fail__trans-id {
    opacity: .5;
    color: #5f689e;
    font-size: 12px
}

.header-fail__btn-wrapper {
    display: flex;
    justify-content: center;
    gap: 12px;
    margin-top: 20px
}

.header-fail__btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: -moz-fit-content;
    width: fit-content
}

.profile-page {
    margin-top: 80px
}

.profile-page__wrapper {
    display: flex;
    gap: 40px;
    align-items: flex-start
}

@media (min-width:320px) and (max-width:959px) {
    .profile-page__wrapper {
        flex-wrap: wrap
    }
}

.profile-page__title {
    display: flex;
    align-items: center;
    gap: 4px;
    color: #8990be;
    font-size: 24px;
    margin-bottom: 30px;
    font-weight: 700
}

.profile-page__title svg {
    width: 32px;
    height: 32px
}

.profile-page__title svg path {
    fill: #8990be
}

.profile-page-aside {
    width: 320px;
    flex-shrink: 0;
    background-color: #161827;
    border-radius: 16px;
    position: sticky;
    top: 30px
}

@media (min-width:320px) and (max-width:959px) {
    .profile-page-aside {
        width: 100%;
        position: relative;
        top: 0
    }
}

.profile-page-aside__wrapper {
    padding: 30px
}

.profile-page-content {
    width: 100%
}

@media (min-width:320px) and (max-width:959px) {
    .profile-page-content {
        overflow: auto
    }

    .profile-page-content::-webkit-scrollbar {
        height: 4px
    }

    .profile-page-content::-webkit-scrollbar-thumb {
        border-radius: 3px
    }

    .profile-page-content::-webkit-scrollbar-track {
        border-radius: 3px
    }
}

@media (min-width:320px) and (max-width:959px) {
    .profile-page-content .grid-table {
        width: -moz-max-content;
        width: max-content;
        max-width: 600px
    }
}

.player-profile {
    margin-bottom: 16px
}

.player-profile__avatar-container {
    display: flex;
    justify-content: center;
    margin-bottom: 8px
}

.player-profile__avatar {
    width: 70px;
    height: 70px;
    border-radius: 8px
}

.player-profile__name {
    line-height: 140%;
    font-weight: 700;
    color: #d1d4e6;
    font-size: 16px;
    text-align: center
}

.player-profile__player-identity {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px
}

.player-profile__steam-id {
    display: flex;
    justify-content: center;
    align-items: center;
    color: #8990be;
    gap: 2px;
    text-decoration: none;
    transition: color .2s
}

.player-profile__steam-id:hover {
    color: #fff
}

.player-profile__steam-id svg {
    display: flex
}

.table-product-detail {
    display: flex;
    align-items: center;
    gap: 8px;
    justify-content: flex-start
}

.table-product-detail__img-container {
    width: 44px;
    height: 44px;
    background-color: #191c2d;
    padding: 2px;
    border-radius: 4px;
    flex-shrink: 0
}

.table-product-detail__img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.table-product-detail__info {
    display: flex;
    flex-direction: column
}

.table-product-detail__info-name {
    font-weight: 700;
    font-size: 14px
}

.table-product-detail__info-quantity {
    opacity: .8;
    font-size: 13px
}

.table-product-detail__status {
    font-size: 12px;
    border-radius: 8px;
    padding: 4px 8px;
    color: #fff
}

.table-product-detail__status--success {
    background-color: #14ae5c
}

.table-product-detail__status--wait {
    background-color: #ffac4d
}

.table-product-detail__status--cancel {
    background-color: #ff4d4d
}

.grid-table-product-details {
    display: none;
    background-color: #161827;
    border-radius: 8px;
    padding: 36px 16px 16px;
    transform: translateY(-8px);
    position: relative;
    z-index: 2;
    transition: margin-top .2s ease, translateY .2s ease, margin-bottom .2s ease, opacity .2s ease;
    margin-bottom: 12px;
    margin-top: -22px;
    opacity: 0;
    color: #8990be
}

.grid-table-product-details.show {
    transform: translateY(0);
    margin-top: -30px;
    opacity: 1
}

.grid-table-product-details__more-for-set {
    margin-bottom: 12px
}

.grid-table-product-details__wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap
}

.grid-table-product-details__id {
    display: flex;
    align-items: center;
    gap: 4px;
    cursor: pointer
}

.grid-table-product-details__id img {
    opacity: .6;
    transition: opacity .2s ease
}

.grid-table-product-details__id:hover img {
    opacity: .8
}

.grid-table-products-row {
    cursor: pointer;
    transition: background-color .2s ease
}

.grid-table-products-row:hover {
    background-color: #4c568a
}

.profile-page__menu {
    display: flex;
    flex-direction: column
}

.profile-page__menu__item:not(:last-child) {
    margin-bottom: 12px
}

.profile-page__menu__link {
    background-color: #262b44;
    padding: 16px;
    border-radius: 8px;
    transition: filter .2s ease
}

.profile-page__menu__link:hover {
    filter: grayscale(50%)
}

.profile-page__menu__link-extends {
    display: flex;
    flex-direction: column;
    background-color: rgba(110, 168, 68, .05);
    color: #e3f0d7;
    gap: 4px
}

.profile-page__menu__link-extends.active {
    background-color: #6ea844;
    color: #e3f0d7
}

.profile-page__menu__link-extends.active div:nth-of-type(1) svg path,
.profile-page__menu__link-extends.active div:nth-of-type(2) svg path {
    fill: #e3f0d7
}

.profile-page__menu__link-extends div {
    display: flex;
    align-items: center;
    gap: 4px
}

.profile-page__menu__link-extends div:nth-of-type(1) svg path {
    fill: #e3f0d7
}

.profile-page__menu__link-extends div:nth-of-type(2) svg {
    opacity: .8
}

.profile-page__menu__link-extends div:nth-of-type(2) svg path {
    fill: #e3f0d7
}

.profile-page__menu__link-simple {
    display: flex;
    align-items: center;
    gap: 4px;
    color: #8990be
}

.profile-page__menu__link-simple.active {
    background-color: #6542ff
}

.profile-page__menu__item-line {
    border: 1px rgba(51, 57, 92, .5019607843) solid;
    margin-bottom: 12px;
    border-radius: 2px
}

.player-logout-link-container {
    text-align: center;
    margin-top: 16px
}

.player-logout-link {
    color: #5f689e;
    opacity: .8;
    transition: opacity .2s ease;
    display: inline-block
}

.player-logout-link:hover {
    opacity: 1
}

.table-product-control {
    display: flex;
    align-items: center;
    gap: 8px
}

.table-product-control__btn {
    padding: 10px 16px;
    font-size: 14px
}

.table-product-control__btn-remove {
    padding: 8px 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(132, 6, 6, .1019607843);
    border-color: rgba(132, 6, 6, .1019607843)
}

.table-product-control__btn-remove:hover {
    background-color: rgba(132, 6, 6, .31);
    border-color: rgba(132, 6, 6, .31)
}

.profile-payment-accounts {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 20px
}

.profile-payment-accounts__item {
    border: 1px rgba(51, 57, 92, .5019607843) solid;
    padding: 16px;
    min-width: 180px;
    border-radius: 16px;
    transition: background-color .2s ease
}

.profile-payment-accounts__item.active {
    background-color: #262b44
}

.profile-payment-accounts__item:hover {
    background-color: #161827
}

.profile-payment-accounts__balance {
    font-size: 24px;
    font-weight: 700;
    color: #e8eaf2;
    margin-bottom: 6px
}

.profile-payment-accounts__bonuses {
    color: #ffc17a;
    margin-bottom: 6px
}

.profile-payment-accounts__label {
    color: #8990be
}

.profile-payment-alert {
    font-weight: 700;
    color: #5f689e;
    margin-bottom: 30px
}

.profile-page__transfer {
    display: flex;
    gap: 16px;
    align-items: flex-end;
    margin-bottom: 32px;
    width: 100%
}

@media (min-width:320px) and (max-width:639px) {
    .profile-page__transfer {
        flex-wrap: wrap
    }
}

.profile-page__transfer-col {
    width: 100%
}

.profile-page__transfer-label {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-bottom: 8px;
    color: #8990be
}

.profile-page__transfer-input {
    background-color: #161827;
    border: 1px solid rgba(51, 57, 92, .5);
    height: 48px;
    border-radius: 8px;
    width: 100%;
    padding: 0 16px;
    color: #8990be
}

.profile-page__transfer-input.error {
    border-color: rgba(177, 57, 57, .5)
}

.profile-page__transfer-input.success {
    border-color: rgba(110, 168, 68, .5294117647)
}

.profile-page__transfer-input:focus {
    outline: 0
}

.profile-page__transfer-input::-moz-placeholder {
    color: #33395c
}

.profile-page__transfer-input::placeholder {
    color: #33395c
}

.profile-page__transfer-input::-webkit-input-placeholder {
    color: #33395c
}

.profile-page__transfer-input::-moz-placeholder {
    color: #33395c
}

.profile-page__transfer-input:-ms-input-placeholder {
    color: #33395c
}

.profile-page__transfer-col-amount {
    position: relative
}

.profile-page__transfer-col-amount .profile-page__transfer-input {
    padding-left: 32px
}

.profile-page__transfer-currency-symbol {
    position: absolute;
    bottom: 14px;
    left: 16px;
    color: #8990be
}

.profile-page__transfer-currency {
    position: absolute;
    right: 16px;
    bottom: 14px;
    cursor: pointer
}

.profile-page__transfer-currency.show .profile-page__transfer-currency-list {
    opacity: 1;
    visibility: visible;
    pointer-events: initial;
    transform: translateY(2px)
}

.profile-page__transfer-currency-current {
    text-transform: uppercase;
    color: #fff;
    display: flex;
    align-items: center;
    gap: 4px
}

.profile-page__transfer-currency-current svg {
    transition: transform .2s ease
}

.profile-page__transfer-currency-current-value {
    color: #727bb1;
    font-weight: 700
}

.profile-page__transfer-currency-list {
    position: absolute;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    z-index: 10;
    transform: translateY(-10px);
    min-width: -moz-max-content;
    min-width: max-content;
    right: 0;
    max-width: 150px;
    background-color: #161827;
    width: 100%;
    border-radius: 8px;
    border: 1px solid rgba(51, 57, 92, .5);
    text-transform: uppercase;
    overflow: hidden;
    transition: opacity .2s ease, visibility .2s ease, transform .2s ease
}

.profile-page__transfer-currency-list-item {
    padding: 5px 10px;
    color: #8990be;
    transition: background-color .2s ease
}

.profile-page__transfer-currency-list-item.active {
    background-color: #262b44
}

.profile-page__transfer-currency-list-item:hover {
    background-color: #464b67
}

.profile-page__transfer-col-btn {
    width: 200px;
    flex-shrink: 0
}

.profile-page__transfer-btn {
    padding: 0 14px;
    height: 48px;
    width: 100%;
    font-weight: 700;
    border-radius: 8px
}

.profile-page__transfer-btn:disabled {
    background-color: #10111c;
    color: #33395c;
    border-color: #10111c
}

.header-promo {
    margin-bottom: 40px
}

.header-promo__wrapper {
    position: relative
}

.header-promo__inner {
    position: relative;
    z-index: 1;
    padding-top: 54px
}

.header-promo__title {
    font-size: 72px;
    font-style: italic;
    font-weight: 700;
    line-height: 120%;
    color: #e8eaf2;
    margin-bottom: 16px;
    -webkit-text-stroke: 1px #e8eaf2
}

.header-promo__subtitle {
    font-weight: 700;
    line-height: 140%;
    color: #8990be;
    font-size: 16px;
    margin-bottom: 34px
}

.header-promo__subtitle span {
    color: #8a70ff
}

.header-promo__triggers {
    margin-bottom: 34px
}

.header-promo__trigger {
    display: flex;
    align-items: center;
    gap: 16px
}

.header-promo__trigger:not(:last-child) {
    margin-bottom: 10px
}

.header-promo__trigger-title {
    display: flex;
    line-height: 120%;
    font-weight: 600;
    color: #d1d4e6;
    font-size: 20px
}

.header-promo__trigger-label {
    line-height: 140%;
    font-weight: 500;
    font-size: 14px;
    color: #8990be
}

.header-promo__bottom {
    display: flex;
    align-items: center;
    gap: 32px
}

.header-promo__btn {
    border-radius: 8px;
    background: linear-gradient(90deg, #6542ff 0, #9077ff 100%);
    display: flex;
    align-items: center;
    gap: 8px;
    color: #eae5ff;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 20px;
    line-height: 100%;
    border: none;
    padding: 16px;
    box-shadow: 0 0 20px rgba(102, 68, 255, .4)
}

.header-promo__promo-code {
    background-color: #10111c;
    padding: 16px;
    border: 1px dashed #33395c;
    border-radius: 12px;
    display: flex;
    align-items: center;
    gap: 26px
}

.header-promo__promo-code-copy {
    cursor: pointer
}

.header-promo__promo-code-label {
    color: #5f689e;
    font-size: 16px;
    font-weight: 700;
    line-height: 100%;
    border-bottom: 1px rgba(51, 57, 92, .5019607843) solid;
    padding-bottom: 7px;
    margin-bottom: 7px
}

.header-promo__promo-code-value {
    color: #e8eaf2;
    text-shadow: 0 0 43.546px rgba(232, 234, 242, .5), 0 0 24.883px rgba(232, 234, 242, .5), 0 0 14.515px rgba(232, 234, 242, .5), 0 0 7.258px rgba(232, 234, 242, .5), 0 0 2.074px rgba(232, 234, 242, .5), 0 0 1.037px rgba(232, 234, 242, .5);
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    letter-spacing: -.48px
}

.header-promo__img {
    position: absolute;
    top: 0;
    right: 0
}

.header-halloween {
    position: relative;
    z-index: 2;
    padding-top: 25px
}

.header-halloween__wrapper {
    position: relative;
    border-radius: 16px;
    z-index: 2;
    padding: 0 64px;
    overflow: hidden;
    background-blend-mode: luminosity, normal;
    background: url(../img/header-halloween-bg-min.jpg) #d3d3d3 50%/cover no-repeat
}

@media (min-width:320px) and (max-width:479px) {
    .header-halloween__wrapper {
        padding: 0 24px
    }
}

.header-halloween__wrapper::before {
    content: "";
    position: absolute;
    width: 1920px;
    height: 1280px;
    right: -762px;
    bottom: -927px;
    border-radius: 1920px;
    background: radial-gradient(50% 50% at 50% 50%, #ff833b 0, rgba(255, 131, 59, .99) 9.36%, rgba(255, 131, 59, .97) 17.57%, rgba(255, 131, 59, .94) 24.8%, rgba(255, 131, 59, .9) 31.23%, rgba(255, 131, 59, .85) 37.04%, rgba(255, 131, 59, .79) 42.4%, rgba(255, 131, 59, .72) 47.5%, rgba(255, 131, 59, .65) 52.5%, rgba(255, 131, 59, .57) 57.6%, rgba(255, 131, 59, .48) 62.96%, rgba(255, 131, 59, .39) 68.77%, rgba(255, 131, 59, .3) 75.2%, rgba(255, 131, 59, .2) 82.43%, rgba(255, 131, 59, .1) 90.64%, rgba(255, 131, 59, 0) 100%);
    filter: blur(32px);
    pointer-events: none
}

.header-halloween__btn-container {
    z-index: 2;
    position: relative
}

.header-halloween__btn {
    background-color: #ffac4d;
    color: #522c00;
    border-color: #ffac4d
}

.header-halloween__btn svg path {
    fill: #522c00
}

.header-halloween__btn:hover {
    background-color: #522c00;
    color: #ffac4d;
    border-color: #522c00
}

.header-halloween__btn:hover svg path {
    fill: #ffac4d
}

.header-halloween__player {
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 2
}

@media (min-width:320px) and (max-width:959px) {
    .header-halloween__player {
        display: none
    }
}

.halloween-spider-web {
    position: fixed;
    left: 0;
    top: 0;
    z-index: 10;
    pointer-events: none
}

@media (min-width:320px) and (max-width:479px) {
    .halloween-spider-web img {
        width: 110px
    }
}

.halloween-smoke {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 1;
    pointer-events: none
}

.halloween-smoke__wrapper {
    position: absolute;
    width: 115%;
    height: 106%;
    left: -6%;
    top: 10%;
    z-index: -1;
    background-size: cover;
    background-position: 50% 50%
}

.halloween-smoke__img {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    max-width: none;
    max-height: none;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center center;
    object-position: center center;
    opacity: .15
}

.halloween-canvas {
    position: absolute;
    z-index: -1;
    pointer-events: none;
    width: 100%;
    height: 100%;
    overflow: hidden;
    left: 0;
    top: 0
}

@media (min-width:320px) and (max-width:640px) {
    .halloween-canvas {
        display: none
    }
}

.halloween-canvas__container {
    position: relative
}

.halloween-canvas__object {
    position: absolute
}

.halloween-canvas__pumpkin {
    right: -290px;
    top: 400px
}

.halloween-canvas__skull {
    left: -280px;
    top: 1100px
}

.halloween-canvas__face {
    right: -280px;
    top: 1700px
}

.modal-tooltip-element {
    position: absolute;
    z-index: 20;
    background-color: #6542ff;
    padding: 10px;
    color: #d1d4e6;
    width: 170px;
    border-radius: 8px;
    font-size: 13px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .2s ease, visibility .2s ease, transform .2s ease
}

.modal-tooltip-element.show {
    visibility: visible;
    opacity: 1;
    pointer-events: auto
}

.modal-tooltip-element__body b {
    color: #fff
}


.footer-seo-block {
  text-align: center;
  margin-top: 40px;
  margin-bottom: 24px;
}

.footer-seo-block h1.footer__text {
  color: #8990be;
  font-size: 20px; /* чуть больше для акцента */
  font-weight: 700;
  opacity: 0.8;
  margin-bottom: 12px;
  margin-left: auto;
  margin-right: auto;
  max-width: 900px;
  line-height: 1.24;
}

.footer-seo-block p.footer__text {
  color: #8990be;
  font-size: 15px;
  opacity: 0.8;
  font-weight: 700;
  margin-left: auto;
  margin-right: auto;
  max-width: 900px;
  line-height: 1.6;
}