

@font-face {
    font-family: Outfit;
    font-display: swap;
    src: url(/static/fonts/Outfit-Regular.woff2) format("truetype");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: Outfit;
    font-display: swap;
    src: url(/static/fonts/Outfit-SemiBold.woff2) format("truetype");
    font-weight: 600;
    font-style: normal
}

:root {
    --black: #0f1526;
    --white: #fff;
    --bg-black: #212132;
    --primary-border-white: rgba(255, 255, 255, .15);
    --primary-red: #fe284a;
    --primary-red-dark: #de2341;
    --secondary-green: #48b41e;
    --secondary-purple: #ad29ff;
    --secondary-orange: #ff9429;
    --grey-g-90: #272c3c;
    --grey-g-40: #9fa1a8;
    --primary-blue-dark: #2c3552
}

:root {
    --seek-before-width: 0%;
    --volume-before-width: 100%;
    --doc-height: 100%
}

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

ul,
ol {
    padding: 0
}

ul li {
    list-style: none
}

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

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

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

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

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

input,
button,
textarea,
select {
    font: inherit;
    outline: none;
    border: none;
    background-color: unset;
    padding: 0
}

button {
    cursor: pointer
}

html {
    font-size: 1vw;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    scroll-behavior: smooth
}

body {
    font-family: Outfit, san-serif;
    background: var(--bg-black, #212132);
    font-size: 16px;
    line-height: 24px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 400;
    color: var(--white);
    background-image: url(/static/images/bg.svg);
    background-size: cover
}

* {
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0)
}

::-webkit-scrollbar {
    width: 4px;
    height: 4px
}

::-webkit-scrollbar-thumb {
    border-radius: 20px;
    border: 1px solid transparent
}

.clear-both {
    overflow: auto
}

.clear-both:after {
    content: "";
    clear: both;
    display: table
}


.image-button {
	all: unset;
	cursor: pointer;

	&.image-button--center {
		width: 100%;
        
		img {
			margin-left: auto;
			margin-right: auto;
			margin: 10px auto;
		}
	}

	&.image-button--left {
		float: left;
		margin: 10px 10px 10px 0;
	}

	&.image-button--right {
		float: right;
		margin: 10px 0 10px 10px;
	}
}

.over-hidden {
    overflow: hidden
}

.veneer {
    z-index: -999;
    visibility: hidden;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100vh;
    transition: .3s background ease;
    background: transparent
}

.veneer.is-active {
    background: rgba(26, 26, 26, .6);
    z-index: 10;
    visibility: visible
}

h1 {
    font-size: 32px;
    line-height: 38px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 600
}

h2 {
    font-size: 28px;
    line-height: 33px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 600
}

h3 {
    font-size: 22px;
    line-height: 26px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 600
}

p {
    font-size: 16px;
    line-height: 24px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 400
}

@media screen and (min-width: 992px) {
    h1 {
        font-size: 64px;
        line-height: 76px;
        font-feature-settings: "clig" off, "liga" off;
        font-style: normal;
        font-weight: 600
    }

    h2 {
        font-size: 48px;
        line-height: 56px;
        font-feature-settings: "clig" off, "liga" off;
        font-style: normal;
        font-weight: 600
    }

    h3 {
        font-size: 28px;
        line-height: 32px;
        font-feature-settings: "clig" off, "liga" off;
        font-style: normal;
        font-weight: 600
    }
}

.what-you-see-is-what-you-get h1 {
    margin-top: 64px;
    margin-bottom: 32px
}

.what-you-see-is-what-you-get h2,
.what-you-see-is-what-you-get h3 {
    margin-top: 48px;
    margin-bottom: 24px
}

.what-you-see-is-what-you-get p+p,
.what-you-see-is-what-you-get ul+p,
.what-you-see-is-what-you-get ol+p {
    margin-top: 16px
}

.what-you-see-is-what-you-get p+ul,
.what-you-see-is-what-you-get ul+ol,
.what-you-see-is-what-you-get ol+ul {
    margin-top: 24px
}

.what-you-see-is-what-you-get a:not([class]) {
    color: var(--primary-red);
    text-decoration: underline
}

.what-you-see-is-what-you-get ul:not([class]):not([vocab]) {
    display: flex;
    flex-direction: column;
    gap: 12px
}

.what-you-see-is-what-you-get ul:not([class]):not([vocab]) li {
    position: relative;
    padding-left: 14px
}

.what-you-see-is-what-you-get ul:not([class]):not([vocab]) li:before {
    content: "";
    background-image: url("data:image/svg+xml,%3Csvg width='6' height='7' viewBox='0 0 6 7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='3' cy='3.68457' r='3' fill='white'/%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-position: center;
    width: 6px;
    height: 6px;
    position: absolute;
    left: 0;
    top: 9px
}

.what-you-see-is-what-you-get ol:not([class]) {
    display: flex;
    flex-direction: column;
    gap: 12px;
    counter-reset: ol-counter;
    list-style: none
}

.what-you-see-is-what-you-get ol:not([class]) li {
    position: relative;
    padding-left: 22px;
    counter-increment: ol-counter
}

.what-you-see-is-what-you-get ol:not([class]) li:before {
    content: counter(ol-counter) ".";
    position: absolute;
    left: 0
}

.what-you-see-is-what-you-get .picture-center {
    margin: 24px 0
}

.what-you-see-is-what-you-get .picture img {
    max-width: 100%
}

.what-you-see-is-what-you-get .picture-right,
.what-you-see-is-what-you-get .picture-left {
    margin: 24px 0
}

.what-you-see-is-what-you-get .picture-right img,
.what-you-see-is-what-you-get .picture-left img {
    margin: 0 auto
}

.main-content .content-block div:has(table) {
/* .main-content .content-block table { */
/* .what-you-see-is-what-you-get .primary-table { */
    margin: 24px 0
}

.what-you-see-is-what-you-get .reward-card-list,
.what-you-see-is-what-you-get .faithful-card-list,
.what-you-see-is-what-you-get .gm-suppliers-list {
    margin-top: 24px
}

.what-you-see-is-what-you-get .ins-section,
.what-you-see-is-what-you-get .game-piece-layout {
    margin-top: 32px
}

.what-you-see-is-what-you-get .phase-card-list {
    margin-top: 48px
}

.what-you-see-is-what-you-get .feedbacks {
    margin-top: 32px
}

.what-you-see-is-what-you-get .summary {
    margin-top: 64px
}

@media screen and (min-width: 992px) {
    .what-you-see-is-what-you-get h1 {
        margin-top: 80px;
        margin-bottom: 40px
    }

    .what-you-see-is-what-you-get h2 {
        margin-top: 80px;
        margin-bottom: 32px
    }

    .what-you-see-is-what-you-get h3 {
        margin-top: 48px;
        margin-bottom: 24px
    }

    .what-you-see-is-what-you-get p+p {
        margin-top: 16px
    }

    .what-you-see-is-what-you-get p+ul,
    .what-you-see-is-what-you-get ul+ol,
    .what-you-see-is-what-you-get ol+ul {
        margin-top: 32px
    }

    .what-you-see-is-what-you-get .picture-center {
        margin: 40px 0
    }

    .what-you-see-is-what-you-get .picture-right {
        float: right;
        margin: 0 0 0 32px
    }

    .what-you-see-is-what-you-get .picture-left {
        float: left;
        margin: 0 32px 0 0
    }

    .main-content .content-block div:has(table) {
    /* .main-content .content-block table { */
    /* .what-you-see-is-what-you-get .primary-table { */
        margin: 32px 0
    }

    .what-you-see-is-what-you-get .reward-card-list,
    .what-you-see-is-what-you-get .faithful-card-list {
        margin-top: 32px
    }

    .what-you-see-is-what-you-get .ins-section {
        margin-top: 48px
    }

    .what-you-see-is-what-you-get .phase-card-list {
        margin-top: 66px
    }

    .what-you-see-is-what-you-get .summary {
        margin-top: 80px
    }
}

:where(html) {
    --ease-1: cubic-bezier(.25, 0, .5, 1);
    --ease-2: cubic-bezier(.25, 0, .4, 1);
    --ease-3: cubic-bezier(.25, 0, .3, 1);
    --ease-4: cubic-bezier(.25, 0, .2, 1);
    --ease-5: cubic-bezier(.25, 0, .1, 1);
    --ease-in-1: cubic-bezier(.25, 0, 1, 1);
    --ease-in-2: cubic-bezier(.5, 0, 1, 1);
    --ease-in-3: cubic-bezier(.7, 0, 1, 1);
    --ease-in-4: cubic-bezier(.9, 0, 1, 1);
    --ease-in-5: cubic-bezier(1, 0, 1, 1);
    --ease-out-1: cubic-bezier(0, 0, .75, 1);
    --ease-out-2: cubic-bezier(0, 0, .5, 1);
    --ease-out-3: cubic-bezier(0, 0, .3, 1);
    --ease-out-4: cubic-bezier(0, 0, .1, 1);
    --ease-out-5: cubic-bezier(0, 0, 0, 1);
    --ease-in-out-1: cubic-bezier(.1, 0, .9, 1);
    --ease-in-out-2: cubic-bezier(.3, 0, .7, 1);
    --ease-in-out-3: cubic-bezier(.5, 0, .5, 1);
    --ease-in-out-4: cubic-bezier(.7, 0, .3, 1);
    --ease-in-out-5: cubic-bezier(.9, 0, .1, 1);
    --ease-elastic-1: cubic-bezier(.5, .75, .75, 1.25);
    --ease-elastic-2: cubic-bezier(.5, 1, .75, 1.25);
    --ease-elastic-3: cubic-bezier(.5, 1.25, .75, 1.25);
    --ease-elastic-4: cubic-bezier(.5, 1.5, .75, 1.25);
    --ease-elastic-5: cubic-bezier(.5, 1.75, .75, 1.25);
    --ease-squish-1: cubic-bezier(.5, -.1, .1, 1.5);
    --ease-squish-2: cubic-bezier(.5, -.3, .1, 1.5);
    --ease-squish-3: cubic-bezier(.5, -.5, .1, 1.5);
    --ease-squish-4: cubic-bezier(.5, -.7, .1, 1.5);
    --ease-squish-5: cubic-bezier(.5, -.9, .1, 1.5);
    --ease-step-1: steps(2);
    --ease-step-2: steps(3);
    --ease-step-3: steps(4);
    --ease-step-4: steps(7);
    --ease-step-5: steps(10)
}

:where(html) {
    --animation-fade-in: fade-in .5s var(--ease-3);
    --animation-fade-in-bloom: fade-in-bloom 2s var(--ease-3);
    --animation-fade-out: fade-out .5s var(--ease-3);
    --animation-fade-out-bloom: fade-out-bloom 2s var(--ease-3);
    --animation-scale-up: scale-up .5s var(--ease-3);
    --animation-scale-down: scale-down .5s var(--ease-3);
    --animation-slide-out-up: slide-out-up .5s var(--ease-3);
    --animation-slide-out-down: slide-out-down .5s var(--ease-3);
    --animation-slide-out-right: slide-out-right .5s var(--ease-3);
    --animation-slide-out-left: slide-out-left .5s var(--ease-3);
    --animation-slide-in-up: slide-in-up .5s var(--ease-3);
    --animation-slide-in-down: slide-in-down .5s var(--ease-3);
    --animation-slide-in-right: slide-in-right .5s var(--ease-3);
    --animation-slide-in-left: slide-in-left .5s var(--ease-3);
    --animation-shake-x: shake-x .75s var(--ease-out-5);
    --animation-shake-y: shake-y .75s var(--ease-out-5);
    --animation-spin: spin 2s linear infinite;
    --animation-ping: ping 5s var(--ease-out-3) infinite;
    --animation-blink: blink 1s var(--ease-out-3) infinite;
    --animation-float: float 3s var(--ease-in-out-3) infinite;
    --animation-bounce: bounce 2s var(--ease-squish-2) infinite;
    --animation-pulse: pulse 2s var(--ease-out-3) infinite
}

@-webkit-keyframes fade-in {
    to {
        opacity: 1
    }
}

@keyframes fade-in {
    to {
        opacity: 1
    }
}

@-webkit-keyframes fade-in-bloom {
    0% {
        opacity: 0;
        -webkit-filter: brightness(1) blur(20px);
                filter: brightness(1) blur(20px)
    }

    10% {
        opacity: 1;
        -webkit-filter: brightness(2) blur(10px);
                filter: brightness(2) blur(10px)
    }

    to {
        opacity: 1;
        -webkit-filter: brightness(1) blur(0);
                filter: brightness(1) blur(0)
    }
}

@keyframes fade-in-bloom {
    0% {
        opacity: 0;
        -webkit-filter: brightness(1) blur(20px);
                filter: brightness(1) blur(20px)
    }

    10% {
        opacity: 1;
        -webkit-filter: brightness(2) blur(10px);
                filter: brightness(2) blur(10px)
    }

    to {
        opacity: 1;
        -webkit-filter: brightness(1) blur(0);
                filter: brightness(1) blur(0)
    }
}

@-webkit-keyframes fade-out {
    to {
        opacity: 0
    }
}

@keyframes fade-out {
    to {
        opacity: 0
    }
}

@-webkit-keyframes fade-out-bloom {
    to {
        opacity: 0;
        -webkit-filter: brightness(1) blur(20px);
                filter: brightness(1) blur(20px)
    }

    10% {
        opacity: 1;
        -webkit-filter: brightness(2) blur(10px);
                filter: brightness(2) blur(10px)
    }

    0% {
        opacity: 1;
        -webkit-filter: brightness(1) blur(0);
                filter: brightness(1) blur(0)
    }
}

@keyframes fade-out-bloom {
    to {
        opacity: 0;
        -webkit-filter: brightness(1) blur(20px);
                filter: brightness(1) blur(20px)
    }

    10% {
        opacity: 1;
        -webkit-filter: brightness(2) blur(10px);
                filter: brightness(2) blur(10px)
    }

    0% {
        opacity: 1;
        -webkit-filter: brightness(1) blur(0);
                filter: brightness(1) blur(0)
    }
}

@-webkit-keyframes scale-up {
    to {
        transform: scale(1.25)
    }
}

@keyframes scale-up {
    to {
        transform: scale(1.25)
    }
}

@-webkit-keyframes scale-down {
    to {
        transform: scale(.75)
    }
}

@keyframes scale-down {
    to {
        transform: scale(.75)
    }
}

@-webkit-keyframes slide-out-up {
    to {
        transform: translateY(-100%)
    }
}

@keyframes slide-out-up {
    to {
        transform: translateY(-100%)
    }
}

@-webkit-keyframes slide-out-down {
    to {
        transform: translateY(100%)
    }
}

@keyframes slide-out-down {
    to {
        transform: translateY(100%)
    }
}

@-webkit-keyframes slide-out-right {
    to {
        transform: translate(100%)
    }
}

@keyframes slide-out-right {
    to {
        transform: translate(100%)
    }
}

@-webkit-keyframes slide-out-left {
    to {
        transform: translate(-100%)
    }
}

@keyframes slide-out-left {
    to {
        transform: translate(-100%)
    }
}

@-webkit-keyframes slide-in-up {
    0% {
        transform: translateY(100%)
    }
}

@keyframes slide-in-up {
    0% {
        transform: translateY(100%)
    }
}

@-webkit-keyframes slide-in-down {
    0% {
        transform: translateY(-100%)
    }
}

@keyframes slide-in-down {
    0% {
        transform: translateY(-100%)
    }
}

@-webkit-keyframes slide-in-right {
    0% {
        transform: translate(-100%)
    }
}

@keyframes slide-in-right {
    0% {
        transform: translate(-100%)
    }
}

@-webkit-keyframes slide-in-left {
    0% {
        transform: translate(100%)
    }
}

@keyframes slide-in-left {
    0% {
        transform: translate(100%)
    }
}

@-webkit-keyframes shake-x {

    0%,
    to {
        transform: translate(0)
    }

    20% {
        transform: translate(-5%)
    }

    40% {
        transform: translate(5%)
    }

    60% {
        transform: translate(-5%)
    }

    80% {
        transform: translate(5%)
    }
}

@keyframes shake-x {

    0%,
    to {
        transform: translate(0)
    }

    20% {
        transform: translate(-5%)
    }

    40% {
        transform: translate(5%)
    }

    60% {
        transform: translate(-5%)
    }

    80% {
        transform: translate(5%)
    }
}

@-webkit-keyframes shake-y {

    0%,
    to {
        transform: translateY(0)
    }

    20% {
        transform: translateY(-5%)
    }

    40% {
        transform: translateY(5%)
    }

    60% {
        transform: translateY(-5%)
    }

    80% {
        transform: translateY(5%)
    }
}

@keyframes shake-y {

    0%,
    to {
        transform: translateY(0)
    }

    20% {
        transform: translateY(-5%)
    }

    40% {
        transform: translateY(5%)
    }

    60% {
        transform: translateY(-5%)
    }

    80% {
        transform: translateY(5%)
    }
}

@-webkit-keyframes spin {
    to {
        transform: rotate(1turn)
    }
}

@keyframes spin {
    to {
        transform: rotate(1turn)
    }
}

@-webkit-keyframes ping {

    90%,
    to {
        transform: scale(2);
        opacity: 0
    }
}

@keyframes ping {

    90%,
    to {
        transform: scale(2);
        opacity: 0
    }
}

@-webkit-keyframes blink {

    0%,
    to {
        opacity: 1
    }

    50% {
        opacity: .5
    }
}

@keyframes blink {

    0%,
    to {
        opacity: 1
    }

    50% {
        opacity: .5
    }
}

@-webkit-keyframes float {
    50% {
        transform: translateY(-25%)
    }
}

@keyframes float {
    50% {
        transform: translateY(-25%)
    }
}

@-webkit-keyframes bounce {
    25% {
        transform: translateY(-20%)
    }

    40% {
        transform: translateY(-3%)
    }

    0%,
    60%,
    to {
        transform: translateY(0)
    }
}

@keyframes bounce {
    25% {
        transform: translateY(-20%)
    }

    40% {
        transform: translateY(-3%)
    }

    0%,
    60%,
    to {
        transform: translateY(0)
    }
}

@-webkit-keyframes pulse {
    50% {
        transform: scale(.9)
    }
}

@keyframes pulse {
    50% {
        transform: scale(.9)
    }
}

@-webkit-keyframes slide {
    0% {
        transform: translate(-100%)
    }

    to {
        transform: translate(100%)
    }
}

@keyframes slide {
    0% {
        transform: translate(-100%)
    }

    to {
        transform: translate(100%)
    }
}

@-webkit-keyframes pulsate {
    0% {
        transform: translate(-50%, -50%) scale(.1);
        opacity: 0
    }

    50% {
        opacity: 1
    }

    to {
        transform: translate(-50%, -50%) scale(1.2);
        opacity: 0
    }
}

@keyframes pulsate {
    0% {
        transform: translate(-50%, -50%) scale(.1);
        opacity: 0
    }

    50% {
        opacity: 1
    }

    to {
        transform: translate(-50%, -50%) scale(1.2);
        opacity: 0
    }
}

@-webkit-keyframes rotation {
    0% {
        transform: rotate(0)
    }

    to {
        transform: rotate(360deg)
    }
}

@keyframes rotation {
    0% {
        transform: rotate(0)
    }

    to {
        transform: rotate(360deg)
    }
}

@-webkit-keyframes grain {

    0%,
    to {
        transform: translate(0)
    }

    10% {
        transform: translate(-5%, -10%)
    }

    20% {
        transform: translate(-15%, 5%)
    }

    30% {
        transform: translate(7%, -25%)
    }

    40% {
        transform: translate(-5%, 25%)
    }

    50% {
        transform: translate(-15%, 10%)
    }

    60% {
        transform: translate(15%)
    }

    70% {
        transform: translateY(15%)
    }

    80% {
        transform: translate(3%, 35%)
    }

    90% {
        transform: translate(-10%, 10%)
    }
}

@keyframes grain {

    0%,
    to {
        transform: translate(0)
    }

    10% {
        transform: translate(-5%, -10%)
    }

    20% {
        transform: translate(-15%, 5%)
    }

    30% {
        transform: translate(7%, -25%)
    }

    40% {
        transform: translate(-5%, 25%)
    }

    50% {
        transform: translate(-15%, 10%)
    }

    60% {
        transform: translate(15%)
    }

    70% {
        transform: translateY(15%)
    }

    80% {
        transform: translate(3%, 35%)
    }

    90% {
        transform: translate(-10%, 10%)
    }
}

.path-indicator {
    margin: 8px 0 20px
}

.path-indicator ul {
    display: flex;
    gap: 8px;
    color: var(--white)
}

.path-indicator ul li:not(:last-child) {
    opacity: .5
}

.path-indicator ul li:not(:last-child):after {
    content: "/";
    margin-left: 8px
}

.path-indicator ul li {
    font-size: 14px;
    line-height: 20px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 400
}

.path-indicator ul li a {
    color: var(--white) !important;
    text-decoration: unset !important
}

.btn {
    transition: all .3s ease;
    outline: none;
    border: 1px solid transparent;
    border-radius: 100px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    cursor: pointer
}

.btn svg {
    transition: inherit
}

.btn--green {
    background: var(--secondary-green);
    color: #fff
}

.btn--green.btn--outline {
    border-color: var(--secondary-green);
    color: var(--secondary-green)
}

.btn--purple {
    background: var(--secondary-purple, #ad29ff);
    color: #fff
}

.btn--purple.btn--outline {
    border-color: var(--secondary-purple, #ad29ff);
    color: var(--secondary-purple, #ad29ff)
}

.btn--orange {
    background: var(--secondary-orange);
    color: #fff
}

.btn--orange.btn--outline {
    border-color: var(--secondary-orange);
    color: var(--secondary-orange)
}

.btn--red {
    background: var(--primary-red);
    color: #fff
}

.btn--red:hover {
    background: var(--primary-red-dark)
}

.btn--white {
    background-color: var(--white);
    color: var(--black)
}

.btn--white.btn--outline {
    background-color: transparent;
    color: var(--white);
    border-color: var(--white)
}

.btn--white.btn--outline:hover {
    background-color: var(--white);
    color: var(--black)
}

.btn--white.btn--outline:hover svg {
    -webkit-filter: invert(1);
            filter: invert(1)
}

.btn--white-opc {
    background-color: var(--white);
    color: var(--black)
}

.btn--white-opc.btn--outline {
    background-color: transparent;
    color: var(--white);
    border-color: var(--primary-border-white)
}

.btn--white-opc.btn--outline:hover {
    background-color: var(--white);
    color: var(--black)
}

.btn--white-opc.btn--outline:hover svg {
    -webkit-filter: invert(1);
            filter: invert(1)
}

.btn--outline {
    background-color: transparent
}

.btn--icon {
    padding: 0 !important
}

.btn--m {
    padding: 5px 11px;
    font-size: 14px;
    line-height: 20px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 600
}

.btn--m svg,
.btn--m img {
    width: 16px;
    height: 16px
}

.btn--m.btn--icon {
    width: 32px;
    height: 32px
}

.btn--l {
    padding: 12px 31px;
    gap: 10px;
    font-size: 16px;
    line-height: 24px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 600
}

.btn--l svg,
.btn--l img {
    width: 24px;
    height: 24px
}

.btn--l.btn--icon {
    width: 50px;
    height: 50px
}

@media screen and (min-width: 992px) {
    .btn--m {
        padding: 11px 23px;
        font-size: 16px;
        line-height: 24px;
        font-feature-settings: "clig" off, "liga" off;
        font-style: normal;
        font-weight: 600
    }

    .btn--m svg,
    .btn--m img {
        width: 24px;
        height: 24px
    }

    .btn--m.btn--icon {
        width: 44px;
        height: 44px
    }
}

.pagination-button {
    display: flex;
    width: 50px;
    height: 50px;
    justify-content: center;
    align-items: center;
    border-radius: 100px;
    background: rgba(255, 255, 255, .2);
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    transition: all .3s ease
}

.pagination-button svg {
    transition: inherit
}

.pagination-button.swiper-button-disabled {
    opacity: .7;
    pointer-events: none
}

.pagination-button:hover {
    background-color: #fff
}

.pagination-button:hover svg {
    -webkit-filter: invert(1);
            filter: invert(1)
}

.reward-card-list {
    display: grid;
    gap: 16px
}

.reward-card {
    display: flex;
    padding: 24px;
    flex-direction: column;
    gap: 24px;
    border-radius: 12px;
    background: radial-gradient(320.26% 2583.12% at -220.26% 50%, #ad29ff 0%, rgba(173, 41, 255, 0) 100%), linear-gradient(0deg, rgba(255, 255, 255, .04), rgba(255, 255, 255, .04))
}

.reward-card>p {
    font-size: 22px;
    line-height: 26px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 600
}

.reward-card__body img {
    max-width: 100%;
    max-height: 180px;
    margin: 0 auto 24px
}

.reward-card__bottom {
    display: flex;
    flex-direction: column;
    row-gap: 24px;
    margin-top: 24px
}

.reward-card__bottom .btn {
    order: 2
}

.reward-card__bottom .info-tags {
    order: 1
}

@media screen and (min-width: 992px) {
    .reward-card {
        padding: 32px;
        border-radius: 16px
    }

    .reward-card>p {
        font-size: 28px;
        line-height: 32px;
        font-feature-settings: "clig" off, "liga" off;
        font-style: normal;
        font-weight: 600
    }

    .reward-card__body {
        display: grid;
        grid-template-columns: 306px auto;
        -moz-column-gap: 32px;
             column-gap: 32px
    }

    .reward-card__body img {
        margin: 0;
        justify-self: center
    }

    .reward-card__bottom {
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-start;
        -moz-column-gap: 24px;
             column-gap: 24px;
        margin-top: 32px
    }

    .reward-card__bottom .btn {
        order: 1;
        flex-shrink: 0
    }

    .reward-card__bottom .info-tags {
        order: 2
    }
}

.faithful-card-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px
}

.faithful-card-list .faithful-card {
    padding: 32px;
    flex-direction: column;
    align-items: center;
    border-radius: 16px;
    background: radial-gradient(335.88% 266.66% at 46.96% 278.96%, #ad29ff 0%, rgba(173, 41, 255, 0) 100%), rgba(255, 255, 255, .04);
    text-align: center;
    min-width: 0
}

.faithful-card-list .faithful-card img {
    width: 100%;
    max-width: 120px;
    max-height: 120px;
    aspect-ratio: 1/1;
    margin: 0 auto 24px
}

.faithful-card-list .faithful-card b {
    display: block;
    font-size: 20px;
    line-height: 30px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 600
}

.faithful-card-list .faithful-card span {
    font-size: 16px;
    line-height: 24px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 400;
    color: #d187ff
}

@media screen and (min-width: 768px) {
    .faithful-card-list {
        grid-template-columns: repeat(3, 1fr)
    }
}

@media screen and (min-width: 1200px) {
    .faithful-card-list {
        grid-template-columns: repeat(6, 1fr)
    }
}

.game-piece-layout {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    -moz-column-gap: 12px;
         column-gap: 12px;
    row-gap: 24px
}

.game-piece-layout .game-piece:first-child {
    grid-column: 1/3
}

.game-piece-layout .game-piece:first-child .game-piece__image img {
    aspect-ratio: 382/326
}

.game-piece-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    row-gap: 24px;
    -moz-column-gap: 12px;
         column-gap: 12px
}

.game-piece-list+button {
    align-self: center
}

.game-piece__image {
    position: relative;
    border-radius: 16px;
    overflow: hidden
}

.game-piece__image img {
    aspect-ratio: 185/138;
    width: 100%;
    -o-object-fit: cover;
       object-fit: cover
}

.game-piece__hover {
    transition: opacity .3s ease;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(15, 21, 38, .6);
    opacity: 0;
    pointer-events: none
}

.game-piece__hover .btn {
    min-width: 96px
}

.game-piece__labels {
    display: flex;
    gap: 8px;
    position: absolute;
    left: 16px;
    top: 0
}

.game-piece>span {
    font-size: 18px;
    line-height: 28px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 600;
    color: var(--white);
    text-align: center;
    margin-top: 8px;
    display: block
}

.game-piece:hover .game-piece__hover {
    opacity: 1;
    pointer-events: all
}

@media screen and (min-width: 576px) {
    .game-piece-layout {
        grid-template-columns: repeat(3, 1fr)
    }

    .game-piece-layout .game-piece:first-child {
        grid-column: 1/3;
        grid-row: 1/3
    }

    .game-piece-layout .game-piece:first-child .game-piece__image {
        aspect-ratio: 200/170
    }

    .game-piece__image img {
        aspect-ratio: 185/132
    }
}

@media screen and (min-width: 992px) {
    .game-piece-layout {
        grid-template-columns: repeat(5, 1fr);
        row-gap: 32px;
        -moz-column-gap: 24px;
             column-gap: 24px
    }

    .game-piece-layout .game-piece:first-child {
        grid-column: 1/3;
        grid-row: 1/3
    }

    .game-piece-layout .game-piece:first-child .game-piece__image img {
        aspect-ratio: 532/454
    }

    .game-piece-list {
        grid-template-columns: repeat(5, 1fr);
        row-gap: 32px;
        -moz-column-gap: 24px;
             column-gap: 24px
    }

    .game-piece__image img {
        aspect-ratio: 254/190
    }

    .game-piece__hover .btn {
        min-width: 130px
    }

    .game-piece>span {
        font-size: 20px;
        line-height: 30px;
        font-feature-settings: "clig" off, "liga" off;
        font-style: normal;
        font-weight: 600;
        margin-top: 12px
    }
}

.phase-card-list {
    display: grid;
    counter-reset: step_card_list-counter;
    gap: 42px
}

.phase-card {
    display: flex;
    flex-direction: column;
    border-radius: 12px;
    background: radial-gradient(107.13% 86.02% at 50% 132.49%, rgba(173, 41, 255, .68) 0%, rgba(173, 41, 255, 0) 100%), rgba(255, 255, 255, .04);
    padding: 32px 24px 24px;
    position: relative
}

.phase-card span {
    display: flex;
    padding: 10px 16px;
    justify-content: center;
    align-items: center;
    gap: 4px;
    border-radius: 8px;
    background: var(--secondary-purple, #ad29ff);
    font-size: 16px;
    line-height: 24px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 600;
    counter-increment: step_card_list-counter;
    position: absolute;
    left: 50%;
    top: 0;
    transform: translate(-50%, -50%);
    height: 36px
}

.phase-card span:before {
    content: counter(step_card_list-counter)
}

.phase-card img {
    border-radius: 10px;
    width: 100%;
    aspect-ratio: 334/250;
    margin: 0 auto 24px
}

.phase-card p:first-of-type {
    font-size: 18px;
    line-height: 28px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 600;
    margin-bottom: 4px
}

.phase-card p:last-of-type {
    margin: 0;
    font-size: 16px;
    line-height: 24px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 400
}

@media screen and (min-width: 576px) {
    .phase-card-list {
        grid-template-columns: repeat(2, 1fr);
        -moz-column-gap: 24px;
             column-gap: 24px;
        row-gap: 66px
    }
}

@media screen and (min-width: 992px) {
    .phase-card-list {
        grid-template-columns: repeat(3, 1fr)
    }

    .phase-card img {
        border-radius: 16px;
        aspect-ratio: 376/282
    }

    .phase-card p:first-of-type {
        font-size: 20px;
        line-height: 30px;
        font-feature-settings: "clig" off, "liga" off;
        font-style: normal;
        font-weight: 600
    }
}

.primary-input {
    cursor: pointer;
    display: inline-flex;
    padding: 12px 24px;
    align-items: center;
    gap: 12px;
    border-radius: 100px;
    border: 1.5px solid rgba(255, 255, 255, .15)
}

.primary-input>span {
    display: flex
}

.primary-input input {
    color: var(--white);
    font-size: 16px;
    line-height: 24px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 600
}

.primary-input input ::-webkit-input-placeholder {
    color: var(--grey-g-60)
} input ::-moz-placeholder {
    color: var(--grey-g-60)
} input :-ms-input-placeholder {
    color: var(--grey-g-60)
} input ::-ms-input-placeholder {
    color: var(--grey-g-60)
} input ::placeholder {
    color: var(--grey-g-60)
}

.primary-input:focus-within {
    border-radius: 100px;
    border: 1.5px solid var(--white, #fff)
}

.main-select {
    display: inline-flex;
    flex-direction: column;
    position: relative
}

.main-select__selected {
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-radius: 100px;
    border: 1.5px solid rgba(255, 255, 255, .15);
    padding: 12px 24px;
    font-size: 16px;
    line-height: 24px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 600;
    white-space: nowrap
}

.main-select__selected svg {
    transition: transform .3s ease
}

.main-select__options {
    transition: all .3s ease;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    z-index: 1;
    position: absolute;
    left: 0;
    width: 100%;
    top: 56px;
    display: inline-flex;
    flex-direction: column;
    padding: 8px 4px 8px 8px;
    gap: 4px;
    border-radius: 12px;
    background: var(--primary-blue-dark);
    box-shadow: 0 10px 20px #1d1d1d0f
}

.main-select__options li {
    padding: 8px;
    border-radius: 8px
}

.main-select__options li:hover {
    background: rgba(255, 255, 255, .1)
}

.main-select.is-active .main-select__selected {
    border: 1.5px solid var(--white)
}

.main-select.is-active .main-select__selected svg {
    transform: rotate(180deg)
}

.main-select.is-active .main-select__options {
    opacity: 1;
    visibility: visible;
    pointer-events: all
}

.btn-checkbox {
    display: inline-flex;
    position: relative;
    cursor: pointer
}

.btn-checkbox input {
    cursor: pointer;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    width: 100%;
    height: 100%
}

.btn-checkbox input:checked+.btn--green {
    background-color: var(--secondary-green);
    color: var(--white)
}

.btn-checkbox input:checked+.btn--purple {
    background-color: var(--secondary-purple);
    color: var(--white)
}

.btn-checkbox input:checked+.btn--orange {
    background-color: var(--secondary-orange);
    color: var(--white)
}

.main-content .content-block div:has(table) {
/* .primary-table { */
    /* border: 1.5px solid var(--primary-border-white); */
    border-radius: 12px;
    background: radial-gradient(164.48% 348.11% at 208.22% 295.54%, #ad29ff 0%, rgba(173, 41, 255, 0) 100%), rgba(255, 255, 255, .04);
    overflow-x: auto
}

.main-content .content-block table::-webkit-scrollbar,
.primary-table::-webkit-scrollbar {
    width: 4px;
    height: 4px
}

.main-content .content-block table::-webkit-scrollbar-thumb,
.primary-table::-webkit-scrollbar-thumb {
    border-radius: 20px;
    border: 1px solid transparent;
    background-color: #fff7
}

.main-content .content-block table,
.primary-table table {
    border-collapse: collapse;
    width: 100%;
    min-width: -webkit-max-content;
    min-width: -moz-max-content;
    min-width: max-content
}

.main-content .content-block table tr td:first-child,
.primary-table table tr td:first-child {
    padding-left: 24px
}

.main-content .content-block table tr td:last-child,
.primary-table table tr td:last-child {
    padding-right: 24px
}

.main-content .content-block table td,
.primary-table table td {
    padding: 16px 20px 16px 0
}

.main-content .content-block table thead td,
.primary-table thead td {
    background-color: #ad29ff;
    font-size: 14px;
    line-height: 20px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 600
}

.main-content .content-block table tbody tr td:first-child,
.primary-table tbody tr td:first-child {
    font-size: 14px;
    line-height: 20px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 600
}

.main-content .content-block table tbody tr:nth-child(even) td,
.primary-table tbody tr:nth-child(even) td {
    background: rgba(255, 255, 255, .04)
}

.main-content .content-block table tbody td,
.primary-table tbody td {
    font-size: 14px;
    line-height: 20px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 400
}

.primary-table .transactions-list {
    max-width: 165px
}

.primary-table.primary-table--fixed table {
    table-layout: fixed;
    overflow-x: unset;
    min-width: unset
}

.main-content .content-block table.primary-table.primary-table--fixed {
    table-layout: fixed;
    overflow-x: unset;
    min-width: unset
}

@media screen and (min-width: 992px) {
    .main-content .content-block table thead td,
    .primary-table thead td {
        font-size: 20px;
        line-height: 30px;
        font-feature-settings: "clig" off, "liga" off;
        font-style: normal;
        font-weight: 600
    }

    .main-content .content-block table tbody tr td:first-child,
    .primary-table tbody tr td:first-child {
        padding-left: 32px;
        font-size: 20px;
        line-height: 30px;
        font-feature-settings: "clig" off, "liga" off;
        font-style: normal;
        font-weight: 600
    }

    .main-content .content-block table tbody tr td:last-child,
    .primary-table tbody tr td:last-child {
        padding-right: 32px
    }

    .main-content .content-block table tbody tr:nth-child(even) td,
    .primary-table tbody tr:nth-child(even) td {
        background: rgba(255, 255, 255, .04)
    }

    .main-content .content-block table tbody td,
    .primary-table tbody td {
        font-size: 20px;
        line-height: 30px;
        font-feature-settings: "clig" off, "liga" off;
        font-style: normal;
        font-weight: 400
    }

    .primary-table .transactions-list {
        max-width: unset
    }
}

.hero-slider {
    margin: 0 -16px !important;
    padding: 0 16px !important
}

.hero-slider__controls {
    display: flex;
    justify-content: center;
    position: relative;
    margin-top: 20px
}

.hero-slider img {
    border-radius: 12px;
    width: 100%;
    max-height: 386px;
    -o-object-fit: cover;
       object-fit: cover
}

.hero-slider .swiper-slide {
    width: calc(100% - 12px) !important
}

.hero-slider .hero-carousel-indicator {
    display: flex
}

.hero-slider__counter {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 18px;
    line-height: 28px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 400;
    color: var(--white)
}

.hero-slider__counter span {
    opacity: .3
}

.hero-slider__counter span:first-of-type {
    opacity: 1
}

.hero-slider__nav {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 128px;
    width: 100%
}

@media screen and (min-width: 992px) {
    .hero-slider {
        margin: 0 !important;
        padding: 0 !important;
        position: relative
    }

    .hero-slider__controls {
        position: unset;
        display: inline-flex;
        flex-direction: column;
        align-items: flex-end;
        margin-top: 0
    }

    .hero-slider img {
        border-radius: 16px;
        max-height: 386px
    }

    .hero-slider .swiper-slide {
        width: 100% !important
    }

    .hero-slider .swiper-wrapper {
        margin-bottom: -24px
    }

    .hero-slider .hero-carousel-indicator {
        display: flex
    }

    .hero-slider__counter {
        top: 0;
        left: 0;
        transform: unset;
        -webkit-user-select: none;
           -moz-user-select: none;
            -ms-user-select: none;
                user-select: none;
        top: 40px;
        right: 40px;
        left: unset;
        z-index: 1
    }

    .hero-slider__nav {
        display: inline-flex;
        justify-content: unset;
        align-items: center;
        gap: 12px;
        width: auto;
        position: absolute;
        bottom: 40px;
        right: 40px;
        z-index: 1
    }
}

.action-links {
    display: flex;
    gap: 12px
}

.action-links li {
    padding: 6px 12px;
    color: var(--white);
    font-size: 14px;
    line-height: 20px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 400;
    border-radius: 8px;
    background: rgba(255, 255, 255, .04);
    gap: 6px
}

.action-links li,
.action-links li a {
    display: flex;
    align-items: center;
    gap: 6px
}

.live-widget {
    display: flex;
    align-items: center;
    font-size: 14px;
    line-height: 20px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 400;
    color: var(--grey-g-40);
    gap: 5px
}

.lang-toggle button {
    cursor: pointer;
    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: 8px
}

.lang-toggle button img {
    width: 20px;
    height: 20px;
    border-radius: 100%
}

.lang-toggle button span {
    color: #fff
}

.hero .hero-descr,
.hero .quick-categories {
    margin-top: 24px
}

.hero-descr {
    background: linear-gradient(1deg, rgba(44, 53, 82, .6) 0%, rgba(93, 32, 131, .6) 52.08%, rgba(44, 53, 82, .6) 100%), #2c3552;
    padding: 24px;
    border-radius: 16px
}

.hero-descr img {
    float: right;
    max-width: 97px;
    margin-left: 16px;
    margin-bottom: 16px
}

.hero-descr p {
    font-size: 18px;
    line-height: 28px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 400
}

.quick-categories {
    display: grid;
    gap: 16px
}

.quick-categories>div {
    cursor: pointer;
    background: radial-gradient(77.86% 139.26% at 56.38% 103.18%, #ad29ff 0%, #272c3c 100%);
    border-radius: 12px;
    overflow: hidden;
    padding: 16px;
    height: 110px;
    position: relative
}

.quick-categories>div span {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 16px;
    line-height: 24px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 600
}

.quick-categories>div span img {
    width: 20px;
    height: 20px
}

.quick-categories>div picture img {
    position: absolute;
    right: 0;
    bottom: -4px;
    max-width: 80%
}

.quick-categories>div>button,
.quick-categories>div>a {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 1
}

.quick-categories>div:nth-child(2) picture img {
    right: 32px;
    bottom: -8px
}

.quick-categories>div:nth-child(3) picture img {
    right: -24px;
    bottom: -64px
}

@media screen and (min-width: 992px) {
    .hero-descr {
        padding: 24px 32px;
        display: flex;
        align-items: center;
        gap: 24px
    }

    .hero-descr img {
        float: unset;
        max-width: 185px;
        margin-left: unset
    }

    .hero-descr p {
        font-size: 18px;
        line-height: 28px;
        font-feature-settings: "clig" off, "liga" off;
        font-style: normal;
        font-weight: 400
    }

    .quick-categories {
        gap: 24px;
        grid-template-columns: repeat(3, 1fr)
    }

    .quick-categories>div {
        background: radial-gradient(84.66% 118.4% at 68.94% 60.05%, #ad29ff 0%, #272c3c 100%);
        border-radius: 16px;
        padding: 24px;
        height: 100%;
        aspect-ratio: 440/250
    }

    .quick-categories>div span {
        gap: 10px;
        font-size: 20px;
        line-height: 30px;
        font-feature-settings: "clig" off, "liga" off;
        font-style: normal;
        font-weight: 600
    }

    .quick-categories>div span img {
        width: 30px;
        height: 30px
    }

    .quick-categories>div picture img {
        bottom: -16px;
        right: -24px;
        max-width: 100%
    }

    .quick-categories>div:nth-child(2) picture img {
        right: -4px;
        bottom: -8px
    }

    .quick-categories>div:nth-child(3) picture img {
        left: 0;
        bottom: -6px
    }
}

.table-of-content {
    display: flex;
    flex-direction: column;
    padding: 24px;
    border-radius: 16px;
    background: radial-gradient(357.91% 394.34% at 363.61% 257.06%, #ad29ff 0%, rgba(173, 41, 255, 0) 100%), rgba(255, 255, 255, .04)
}

.table-of-content>button {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    font-size: 18px;
    line-height: 28px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 600;
    color: var(--white);
    transition: all .3s ease
}

.table-of-content>button svg {
    transition: inherit
}

.table-of-content>button.is-active {
    margin-bottom: 16px
}

.table-of-content>button.is-active svg {
    transform: rotate(180deg)
}

.table-of-content nav {
    visibility: hidden;
    opacity: 0;
    height: 0;
    transition: all .3s ease;
    will-change: height;
    overflow: hidden
}

.table-of-content nav ul {
    display: flex;
    flex-direction: column;
    gap: 16px
}

.table-of-content nav ul li {
    transition: background-color .15s ease;
    font-size: 16px;
    line-height: 24px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 400
}

.table-of-content nav.is-expanded {
    opacity: 1;
    visibility: visible
}

@media screen and (min-width: 992px) {
    .table-of-content {
        padding: 24px 16px;
        width: 300px
    }

    .table-of-content>button {
        pointer-events: none;
        margin-bottom: 16px;
        padding: 0 8px
    }

    .table-of-content>button svg {
        display: none
    }

    .table-of-content nav {
        height: 100%;
        opacity: 1;
        visibility: visible
    }

    .table-of-content nav ul {
        gap: 0
    }

    .table-of-content nav ul li {
        display: flex;
        align-items: center;
        border-radius: 8px;
        padding: 8px
    }

    .table-of-content nav ul li a {
        margin: -8px;
        padding: 8px
    }

    .table-of-content nav ul li:hover {
        background: rgba(255, 255, 255, .1)
    }
}

@media screen and (min-width: 1200px) {
    .table-of-content {
        width: 345px
    }

    .table-of-content>button {
        font-size: 20px;
        line-height: 30px;
        font-feature-settings: "clig" off, "liga" off;
        font-style: normal;
        font-weight: 600
    }
}

.info-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 12px
}

.info-tags span {
    display: flex;
    padding: 6px 12px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    border-radius: 16px;
    border: 1px solid var(--primary-border-white);
    font-size: 16px;
    line-height: 24px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 600
}

.info-tags span small {
    font-size: 14px;
    line-height: 20px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 400;
    color: #dbb8fa
}

.ins-section>span {
    display: block;
    font-size: 20px;
    line-height: 30px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 600;
    margin-bottom: 24px
}

.ins-section ul {
    border-radius: 16px;
    background: radial-gradient(272.92% 173.76% at 48.6% 173.76%, rgba(173, 41, 255, .68) 0%, rgba(173, 41, 255, 0) 100%), rgba(255, 255, 255, .04);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    padding: 16px 24px
}

.ins-section ul li {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    gap: 8px;
    text-align: center
}

.ins-section ul li span:first-child {
    font-size: 16px;
    line-height: 24px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 400;
    color: var(--white)
}

.ins-section ul li span:last-child {
    font-size: 16px;
    line-height: 24px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 600;
    color: #d187ff
}

.ins-section ul .separator {
    display: block;
    height: 1px;
    width: 100%;
    background: rgba(255, 255, 255, .15)
}

@media screen and (min-width: 992px) {
    .ins-section>span {
        font-size: 24px;
        line-height: 36px;
        font-feature-settings: "clig" off, "liga" off;
        font-style: normal;
        font-weight: 600
    }

    .ins-section ul {
        flex-direction: row;
        justify-content: space-between;
        gap: 12px
    }

    .ins-section ul .separator {
        height: 80px;
        width: 1px
    }
}

.game-label {
    -webkit-clip-path: polygon(100% 0, 100% 100%, 51% 80%, 0 100%, 0% 0%);
            clip-path: polygon(100% 0, 100% 100%, 51% 80%, 0 100%, 0% 0%);
    width: 30px;
    height: 44px;
    background-repeat: no-repeat;
    background-position: center 6px
}

.game-label--mobile {
    background-color: var(--secondary-orange);
    background-image: url("data:image/svg+xml,%3Csvg width='25' height='24' viewBox='0 0 25 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M7.65313 2C7.00334 2 6.38018 2.26339 5.92071 2.73223C5.46125 3.20107 5.20313 3.83696 5.20312 4.5V19.5C5.20312 20.3457 5.70853 20.9743 6.11313 21.3257C6.33153 21.5157 6.57232 21.6729 6.81033 21.7857C7.02592 21.89 7.32833 22 7.65313 22H16.7531C17.4029 22 18.0261 21.7366 18.4855 21.2678C18.945 20.7989 19.2031 20.163 19.2031 19.5V4.5C19.2031 3.83696 18.945 3.20107 18.4855 2.73223C18.0261 2.26339 17.4029 2 16.7531 2H7.65313Z' fill='white'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10.416 18C10.416 17.7348 10.5289 17.4804 10.7298 17.2929C10.9308 17.1054 11.2033 17 11.4874 17H12.916C13.2001 17 13.4726 17.1054 13.6736 17.2929C13.8745 17.4804 13.9874 17.7348 13.9874 18C13.9874 18.2652 13.8745 18.5196 13.6736 18.7071C13.4726 18.8946 13.2001 19 12.916 19H11.4874C11.2033 19 10.9308 18.8946 10.7298 18.7071C10.5289 18.5196 10.416 18.2652 10.416 18Z' fill='%23FF9429'/%3E%3Crect x='9.20312' y='4.5' width='6' height='1.5' rx='0.75' fill='%23FF9429'/%3E%3C/svg%3E%0A")
}

.game-label--hit {
    background-color: var(--secondary-purple);
    background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M19.6538 11.7949C19.6482 11.8071 19.6425 11.8192 19.6368 11.8313C19.4142 12.3049 18.7022 12.1169 18.7461 11.5954C18.8263 10.6423 18.7084 9.65714 18.365 8.69784C17.2503 5.58402 13.5079 2.03851 10.1939 2.00003C9.84005 1.99593 9.63686 2.40109 9.84572 2.68679C10.1242 3.06765 10.3503 3.49698 10.5104 3.96792C11.0359 5.51382 10.7124 7.15968 9.78709 8.38249C9.40132 8.89226 8.58221 8.6405 8.56873 8.00136C8.56861 7.99675 8.56854 7.9921 8.56846 7.98745C8.56303 7.64863 8.61861 7.32331 8.72525 7.02202C8.77228 6.88917 8.64912 6.75843 8.5142 6.7991C6.63548 7.36538 5.2069 10.1301 5.2069 12.1021C5.2069 12.2461 5.2149 12.3882 5.22979 12.5283C5.23162 12.7902 5.27588 13.0566 5.36841 13.3186C5.37173 13.328 5.37509 13.3374 5.37845 13.3468C5.40728 13.4273 5.4379 13.5067 5.46939 13.5855C5.02444 13.0415 4.64594 12.441 4.34657 11.7964C4.20748 11.4968 3.76722 11.5563 3.71316 11.8821C3.61683 12.4623 3.56641 13.0283 3.56641 13.5663C3.56641 18.2241 7.34217 22 11.9998 22C16.6575 22 20.4332 18.2241 20.4332 13.5663C20.4332 13.0282 20.3828 12.4623 20.2864 11.8819C20.2325 11.5569 19.7925 11.496 19.6538 11.7949Z' fill='white'/%3E%3Cpath d='M15.8257 15.0166C15.8229 15.0227 15.8201 15.0288 15.8172 15.0348C15.706 15.2716 15.3499 15.1776 15.3718 14.9169C15.4119 14.4403 15.353 13.9478 15.1812 13.4681C14.6239 11.9112 12.7525 10.1384 11.0953 10.1192C10.9184 10.1171 10.8168 10.3197 10.9212 10.4625C11.0605 10.653 11.1735 10.8676 11.2536 11.1031C11.5164 11.8761 11.3546 12.699 10.8919 13.3104C10.699 13.5653 10.2894 13.4394 10.2827 13.1198C10.2826 13.1175 10.2826 13.1152 10.2825 13.1129C10.2798 12.9435 10.3076 12.7808 10.3609 12.6302C10.3845 12.5638 10.3229 12.4984 10.2554 12.5187C9.31597 12.8019 8.60162 14.1842 8.60162 15.1702C8.60162 15.2422 8.60564 15.3133 8.61306 15.3833C8.61397 15.5143 8.63612 15.6474 8.68238 15.7784C8.68406 15.7831 8.6857 15.7878 8.68738 15.7925C8.7018 15.8328 8.71713 15.8725 8.73284 15.9118C8.51033 15.6399 8.32109 15.3396 8.17137 15.0173C8.1018 14.8675 7.88167 14.8973 7.85463 15.0602C7.80644 15.3503 7.78125 15.6333 7.78125 15.9023C7.78125 18.2312 9.66931 20.1191 11.9984 20.1191C14.3274 20.1191 16.2155 18.2312 16.2155 15.9023C16.2155 15.6332 16.1902 15.3502 16.1421 15.0601C16.1151 14.8976 15.8951 14.8672 15.8257 15.0166Z' fill='%23AD29FF'/%3E%3C/svg%3E%0A")
}

.game-label--new {
    background-color: var(--secondary-green);
    background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M19.8981 15.7129C20.1849 15.7129 20.4623 15.6112 20.6811 15.4258C20.8999 15.2405 21.0459 14.9836 21.093 14.7007L21.9846 9.35509C22.0083 9.23513 22.0077 9.11163 21.9828 8.99192C21.9578 8.87221 21.9091 8.75873 21.8395 8.65819C21.7699 8.55765 21.6809 8.47211 21.5776 8.40664C21.4743 8.34116 21.3589 8.29709 21.2383 8.27703C21.1177 8.25697 20.9942 8.26132 20.8753 8.28984C20.7564 8.31836 20.6445 8.37047 20.5461 8.44306C20.4477 8.51566 20.3648 8.60727 20.3025 8.71246C20.2402 8.81766 20.1996 8.9343 20.1832 9.05547L19.6898 12.006L19.3043 10.8824C19.231 10.6707 19.0935 10.4871 18.9109 10.3571C18.7284 10.2272 18.5098 10.1573 18.2857 10.1573C18.0616 10.1573 17.8431 10.2272 17.6606 10.3571C17.478 10.4871 17.3405 10.6707 17.2671 10.8824L16.8816 12.006L16.3883 9.05547C16.3719 8.9343 16.3313 8.81766 16.269 8.71246C16.2066 8.60727 16.1238 8.51566 16.0254 8.44306C15.927 8.37047 15.815 8.31836 15.6961 8.28984C15.5772 8.26132 15.4538 8.25697 15.3332 8.27703C15.2125 8.29709 15.0972 8.34116 14.9939 8.40664C14.8906 8.47211 14.8015 8.55765 14.7319 8.65819C14.6623 8.75873 14.6136 8.87221 14.5887 8.99192C14.5638 9.11163 14.5631 9.23513 14.5868 9.35509L15.4784 14.7007C15.5236 14.9662 15.6558 15.2091 15.8543 15.3911C16.0527 15.5732 16.3061 15.684 16.5745 15.7062C16.8428 15.7284 17.111 15.6607 17.3366 15.5137C17.5623 15.3667 17.7326 15.1488 17.8207 14.8944L18.2867 13.5406L18.7507 14.8944C18.8329 15.1333 18.9877 15.3406 19.1934 15.4873C19.3991 15.6341 19.6455 15.7129 19.8981 15.7129ZM2.65056 8.33199C2.83801 8.27493 3.03884 8.27964 3.2234 8.34544C3.40797 8.41123 3.56648 8.53462 3.67555 8.69738L5.73284 11.7831V9.20528C5.73284 8.96301 5.82908 8.73066 6.0004 8.55935C6.17173 8.38804 6.40409 8.2918 6.64637 8.2918C6.88866 8.2918 7.12102 8.38804 7.29234 8.55935C7.46366 8.73066 7.55991 8.96301 7.55991 9.20528V14.7976C7.56015 14.9937 7.49724 15.1847 7.3805 15.3423C7.26376 15.5 7.09938 15.6158 6.91168 15.6728C6.72397 15.7298 6.52292 15.7248 6.33826 15.6586C6.1536 15.5925 5.99513 15.4686 5.88631 15.3055L3.82903 12.2216V14.7994C3.82903 15.0417 3.73278 15.274 3.56146 15.4453C3.39014 15.6166 3.15778 15.7129 2.91549 15.7129C2.67321 15.7129 2.44084 15.6166 2.26952 15.4453C2.0982 15.274 2.00195 15.0417 2.00195 14.7994V9.2071C2.00176 9.01093 2.06473 8.81991 2.18155 8.6623C2.29836 8.5047 2.46281 8.38888 2.65056 8.33199ZM9.84375 8.2918C9.60146 8.2918 9.3691 8.38804 9.19778 8.55935C9.02646 8.73066 8.93021 8.96301 8.93021 9.20528V14.8012C8.93021 15.0435 9.02646 15.2758 9.19778 15.4471C9.3691 15.6185 9.60146 15.7147 9.84375 15.7147H13.2056C13.4478 15.7147 13.6802 15.6185 13.8515 15.4471C14.0229 15.2758 14.1191 15.0435 14.1191 14.8012C14.1191 14.5589 14.0229 14.3266 13.8515 14.1553C13.6802 13.984 13.4478 13.8877 13.2056 13.8877H10.7573V12.682H12.7853C13.0276 12.682 13.26 12.5857 13.4313 12.4144C13.6026 12.2431 13.6989 12.0108 13.6989 11.7685C13.6989 11.5262 13.6026 11.2939 13.4313 11.1226C13.26 10.9513 13.0276 10.855 12.7853 10.855H10.7573V10.1206H13.2056C13.4478 10.1206 13.6802 10.0243 13.8515 9.85303C14.0229 9.68172 14.1191 9.44937 14.1191 9.2071C14.1191 8.96483 14.0229 8.73249 13.8515 8.56118C13.6802 8.38987 13.4478 8.29363 13.2056 8.29363L9.84375 8.2918Z' fill='white'/%3E%3C/svg%3E%0A")
}

.gm-suppliers-list {
    display: flex;
    gap: 12px;
    flex-wrap: wrap
}

.gm-suppliers-list li span,
.gm-suppliers-list li a {
    display: flex;
    padding: 6px 21px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 44px;
    border-radius: 8px;
    background: #fff
}

.gm-suppliers-list li img {
    max-width: 100%;
    height: 100%
}

@media screen and (min-width: 992px) {
    .gm-suppliers-list {
        display: flex;
        gap: 12px;
        flex-wrap: wrap
    }

    .gm-suppliers-list li span,
    .gm-suppliers-list li a {
        padding: 12px 41px;
        height: 90px
    }

    .gm-suppliers-list li img {
        max-width: 100%;
        height: auto
    }
}

.description img {
    float: right;
    margin-left: 16px;
    margin-bottom: 16px
}

@media screen and (min-width: 992px) {
    .description {
        display: flex;
        gap: 32px
    }
}

.transactions-list-container {
    display: flex;
    flex-direction: column;
    gap: 24px
}

.transactions-list-container>span {
    font-size: 16px;
    line-height: 24px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 400;
    color: #dbb8fa
}

.transactions-list {
    display: flex;
    flex-wrap: wrap;
    gap: 12px
}

.transactions-list li {
    display: flex;
    padding: 6px 9px;
    border-radius: 8px;
    background-color: var(--white)
}

.transactions-list li a,
.transactions-list li span {
    display: flex;
    align-items: center;
    justify-content: center
}

.transactions-list li img {
    max-height: 18px
}

@media screen and (min-width: 992px) {
    .transactions-list li {
        padding: 8px 12px
    }

    .transactions-list li img {
        max-height: 24px
    }
}

.small-contacts {
    display: flex;
    flex-direction: column;
    gap: 24px
}

.small-contacts ul {
    display: flex;
    flex-direction: column;
    gap: 16px;
    border-radius: 12px;
    background: radial-gradient(110.88% 264.38% at 144.32% 244.43%, rgba(173, 41, 255, .68) 0%, rgba(173, 41, 255, 0) 100%), rgba(255, 255, 255, .04);
    padding: 24px
}

.small-contacts ul li {
    display: flex;
    align-items: center
}

.small-contacts ul li a,
.small-contacts ul li span {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    line-height: 20px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 400;
    text-decoration: none !important;
    color: var(--white) !important
}

.small-contacts ul li img {
    width: 20px;
    height: 20px
}

@media screen and (min-width: 992px) {
    .small-contacts {
        flex-direction: row;
        align-items: flex-start;
        gap: 32px
    }

    .small-contacts ul {
        flex-shrink: 0;
        gap: 24px;
        border-radius: 16px;
        padding: 32px
    }

    .small-contacts ul li a,
    .small-contacts ul li span {
        gap: 10px;
        font-size: 20px;
        line-height: 30px;
        font-feature-settings: "clig" off, "liga" off;
        font-style: normal;
        font-weight: 400
    }

    .small-contacts ul li img {
        width: 30px;
        height: 30px
    }
}

.advantages-disadvantages {
    display: flex;
    flex-direction: column;
    gap: 16px
}

.advantages,
.downsides {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 24px;
    border-radius: 16px
}

.advantages>span,
.downsides>span {
    display: flex;
    position: relative;
    font-size: 22px;
    line-height: 26px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 600
}

.advantages>span img,
.downsides>span img {
    position: absolute;
    right: 0;
    top: -12px
}

.advantages ul,
.downsides ul {
    display: flex;
    flex-direction: column;
    gap: 16px
}

.advantages ul li,
.downsides ul li {
    position: relative;
    padding-left: 32px
}

.advantages ul li:before,
.downsides ul li:before {
    content: "";
    width: 24px;
    height: 24px;
    position: absolute;
    left: 0
}

.advantages {
    background: radial-gradient(184.49% 93.35% at 100% 0%, rgba(64, 187, 113, .4) 0%, rgba(64, 187, 113, 0) 100%), rgba(64, 187, 113, .2)
}

.advantages ul li:before {
    content: "";
    background-image: url("data:image/svg+xml,%3Csvg width='24' height='25' viewBox='0 0 24 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M22 12.8267C22 14.7017 21.475 16.4767 20.55 17.9767C18.825 20.8767 15.65 22.8267 12 22.8267C8.35 22.8267 5.175 20.8767 3.45 17.9767C2.525 16.4767 2 14.7017 2 12.8267C2 7.30166 6.475 2.82666 12 2.82666C17.525 2.82666 22 7.30166 22 12.8267Z' fill='%2348B41E'/%3E%3Cpath d='M8.09766 12.8267L10.5727 15.3016L15.8977 10.3767' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A")
}

.advantages img {
    max-width: 66.784px
}

.downsides {
    background: radial-gradient(185.04% 93.62% at 100% 0%, rgba(254, 40, 74, .4) 0%, rgba(254, 40, 74, 0) 100%), rgba(254, 40, 74, .2)
}

.downsides ul li:before {
    background-image: url("data:image/svg+xml,%3Csvg width='24' height='25' viewBox='0 0 24 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M22 12.7285C22 13.5285 21.9 14.3035 21.7 15.0535C21.475 16.0535 21.075 17.0285 20.55 17.8785C18.825 20.7785 15.65 22.7285 12 22.7285C9.425 22.7285 7.09999 21.7534 5.34999 20.1534C4.59999 19.5034 3.94997 18.7285 3.44997 17.8785C2.52497 16.3785 2 14.6035 2 12.7285C2 10.0285 3.07501 7.55357 4.82501 5.75357C6.65001 3.87857 9.2 2.72852 12 2.72852C14.95 2.72852 17.625 4.00356 19.425 6.05356C21.025 7.82856 22 10.1785 22 12.7285Z' fill='%23FE284A'/%3E%3Cpath d='M14.5748 10.0784L9.2998 15.3533' stroke='white' stroke-width='1.5' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M9.34863 10.1284L14.6486 15.4034' stroke='white' stroke-width='1.5' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A")
}

.downsides img {
    max-width: 61.525px
}

@media screen and (min-width: 992px) {
    .advantages-disadvantages {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 24px
    }

    .advantages,
    .downsides {
        min-width: 0;
        padding: 32px
    }

    .advantages>span,
    .downsides>span {
        font-size: 28px;
        line-height: 32px;
        font-feature-settings: "clig" off, "liga" off;
        font-style: normal;
        font-weight: 600
    }

    .advantages>span img,
    .downsides>span img {
        top: -16px;
        right: -26px;
        max-width: 170px
    }

    .advantages ul,
    .downsides ul {
        max-width: 80%
    }

    .advantages ul li,
    .downsides ul li {
        padding-left: 34px;
        font-size: 20px;
        line-height: 30px;
        font-feature-settings: "clig" off, "liga" off;
        font-style: normal;
        font-weight: 400
    }
}

.textimage-section {
    display: flex;
    flex-direction: column
}

.textimage-section h1,
.textimage-section h2,
.textimage-section h3 {
    order: -1
}

.textimage-section>.picture-center {
    max-width: 220px;
    margin-left: auto;
    margin-right: auto
}

.textimage-section .ins-section {
    width: 100%
}

@media screen and (min-width: 992px) {
    .textimage-section {
        display: block
    }

    .textimage-section>.picture-center {
        max-width: 100%;
        margin: 0 0 0 24px;
        float: right
    }

    .textimage-section .ins-section {
        width: 100%
    }
}

.feedbacks {
    display: flex;
    flex-direction: column;
    gap: 32px
}

.feedback {
    display: flex;
    flex-direction: column;
    gap: 24px
}

.feedback__writer {
    display: flex;
    align-items: flex-start;
    gap: 12px
}

.feedback__writer img {
    width: 48px;
    height: 48px;
    border-radius: 50%
}

.feedback__writer>div {
    display: flex;
    flex-direction: column
}

.feedback__writer span {
    font-size: 18px;
    line-height: 28px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 600
}

.feedback__writer small {
    font-size: 14px;
    line-height: 20px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 400;
    color: #dbb8fa
}

.feedback>p {
    font-size: 22px;
    line-height: 26px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 600
}

.feedback-reply {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 24px;
    border-radius: 16px;
    background: radial-gradient(283.54% 14683.38% at -191.64% 50%, #ad29ff 0%, rgba(173, 41, 255, 0) 100%), linear-gradient(0deg, rgba(255, 255, 255, .04), rgba(255, 255, 255, .04))
}

.feedback-reply__writer {
    display: flex;
    flex-direction: column
}

.feedback-reply__writer>span {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 18px;
    line-height: 28px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 600
}

.feedback-reply__writer>small {
    font-size: 14px;
    line-height: 20px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 400;
    color: #dbb8fa
}

.feedback-reply p {
    font-size: 16px;
    line-height: 24px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 400
}

@media screen and (min-width: 992px) {
    .feedback {
        padding-left: 60px;
        gap: 24px
    }

    .feedback__writer {
        gap: 12px;
        margin-left: -60px
    }

    .feedback__writer img {
        width: 50px;
        height: 50px
    }

    .feedback__writer span {
        font-size: 20px;
        line-height: 30px;
        font-feature-settings: "clig" off, "liga" off;
        font-style: normal;
        font-weight: 600
    }

    .feedback>p {
        font-size: 28px;
        line-height: 32px;
        font-feature-settings: "clig" off, "liga" off;
        font-style: normal;
        font-weight: 600
    }

    .feedback-reply {
        gap: 16px;
        padding: 32px
    }

    .feedback-reply__writer>span {
        font-size: 20px;
        line-height: 30px;
        font-feature-settings: "clig" off, "liga" off;
        font-style: normal;
        font-weight: 600
    }
}

.summary {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 24px;
    border-radius: 12px;
    background: radial-gradient(143.44% 309.35% at 46.96% 291.34%, #ad29ff 0%, rgba(173, 41, 255, 0) 100%), rgba(255, 255, 255, .04)
}

.summary h1,
.summary h2,
.summary h3 {
    margin-top: 0
}

.summary .btn {
    margin-top: 24px;
    width: 100%
}

@media screen and (min-width: 768px) {
    .summary {
        flex-direction: row;
        align-items: flex-start;
        gap: 32px;
        padding: 48px;
        border-radius: 16px
    }

    .summary img {
        max-width: 44%
    }

    .summary .btn {
        margin-top: 32px;
        width: auto
    }
}

.qna {
    display: flex;
    flex-direction: column;
    gap: 16px
}

.faq-item__toggler {
    cursor: pointer;
    transition: all .3s ease;
    display: flex;
    justify-content: space-between;
    padding: 24px;
    gap: 16px;
    border-radius: 16px;
    background: radial-gradient(342.09% 17715.66% at -242.09% 50%, rgba(173, 41, 255, .678431) 0%, rgba(173, 41, 255, 0) 100%), linear-gradient(0deg, rgba(255, 255, 255, .04), rgba(255, 255, 255, .04));
    font-size: 22px;
    line-height: 26px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 600
}

.faq-item__toggler:after {
    content: "";
    background-image: url("data:image/svg+xml,%3Csvg width='38' height='39' viewBox='0 0 38 39' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M28.5 15.5707L20.6793 23.3913C19.7557 24.3149 18.2443 24.3149 17.3207 23.3913L9.5 15.5707' stroke='white' stroke-width='2' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
    background-size: 26px 26px;
    width: 26px;
    height: 26px;
    flex-shrink: 0;
    transition: inherit
}

.faq-item__toggler.is-active {
    margin-bottom: 16px
}

.faq-item__toggler.is-active:after {
    transform: rotate(180deg)
}

.qna-item__content {
    visibility: hidden;
    height: 0;
    opacity: 0;
    transition: .3s all ease;
    will-change: height;
    overflow: hidden
}

.qna-item__content.is-expanded {
    opacity: 1;
    visibility: visible
}

@media screen and (min-width: 992px) {
    .qna {
        gap: 24px
    }

    .faq-item__toggler {
        padding: 32px;
        gap: 32px;
        font-size: 28px;
        line-height: 32px;
        font-feature-settings: "clig" off, "liga" off;
        font-style: normal;
        font-weight: 600
    }

    .faq-item__toggler:after {
        background-size: 38px 38px;
        width: 38px;
        height: 38px
    }
}

.network-list {
    display: flex;
    align-items: flex-start;
    gap: 12px
}

.games-section {
    display: flex;
    flex-direction: column;
    gap: 32px
}

.games-block__filters {
    display: flex;
    flex-wrap: wrap;
    -moz-column-gap: 16px;
         column-gap: 16px;
    row-gap: 16px
}

.games-section__controls {
    display: flex;
    gap: 12px
}

.games-block__search {
    position: relative
}

.games-block__search button {
    opacity: 0;
    pointer-events: none;
    display: flex;
    position: absolute;
    right: 0;
    top: 50%;
    right: 24px;
    transform: translateY(-50%)
}

@media screen and (max-width: 1199px) {
    .games-block__filters .main-select {
        width: calc(100% - 66px)
    }

    .games-block__filters.is-search {
        -moz-column-gap: 0;
             column-gap: 0
    }

    .games-block__filters.is-search .main-select {
        width: 0;
        opacity: 0
    }

    .games-block__filters.is-search .games-block__search,
    .games-block__filters.is-search .games-block__search .primary-input {
        width: 100%
    }

    .games-block__filters.is-search .games-block__search .primary-input input {
        width: auto
    }

    .games-block__filters.is-search .games-block__search button {
        opacity: 1;
        pointer-events: all;
        z-index: 1
    }

    .games-block__filters:not(.is-search) .games-block__search .primary-input {
        gap: 0;
        width: 50px;
        height: 50px;
        display: flex;
        align-items: center;
        justify-content: center
    }

    .games-block__filters:not(.is-search) .games-block__search .primary-input span {
        padding: 0
    }

    .games-block__filters:not(.is-search) .games-block__search .primary-input input {
        width: 0
    }
}

@media screen and (min-width: 1200px) {
    .games-section {
        display: flex;
        flex-direction: column;
        gap: 32px
    }

    .games-block__filters {
        -moz-column-gap: 32px;
             column-gap: 32px;
        align-items: center
    }

    .games-section__controls {
        display: flex;
        gap: 12px;
        order: 2
    }

    .games-section__controls .games-section__clear {
        order: 4;
        margin-left: 20px
    }

    .games-block__search {
        order: 3;
        margin-left: auto
    }
}

.game-section {
    margin-top: 24px;
    display: grid;
    position: relative;
    gap: 24px
}

.game-screen {
    position: relative;
    display: flex;
    align-items: center
}

.game-screen:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(15, 21, 38, .8);
    opacity: .85;
    border-radius: 12px;
    overflow: hidden
}

.game-screen img {
    aspect-ratio: 382/214;
    -o-object-fit: contain;
       object-fit: contain;
    -o-object-position: center;
       object-position: center;
    width: 100%;
    border-radius: 16px
}

.game-screen iframe {
    display: none;
    aspect-ratio: 382/214;
    width: 100%;
    height: 100%;
    border-radius: 16px
}

.game-display__controls {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    flex-direction: column;
    gap: 12px
}

.game-display__controls button,
.game-display__controls a {
    white-space: nowrap
}

.game-screen__fulltoggle {
    position: absolute;
    bottom: 16px;
    right: 16px
}

.game-screen__fulltoggle svg:last-of-type {
    display: none
}

.game-screen.is-demo:before {
    display: none
}

.game-screen.is-demo>img {
    display: none
}

.game-screen.is-demo iframe {
    display: flex
}

.game-screen.is-demo .game-display__controls {
    display: none
}

.game-screen.is-full .game-screen__fulltoggle svg:first-of-type {
    display: none
}

.game-screen.is-full .game-screen__fulltoggle svg:last-of-type {
    display: block
}

.game-section {
    border-radius: 16px;
    background: radial-gradient(553.59% 348.11% at 208.22% 295.54%, rgba(173, 41, 255, .7) 0%, rgba(173, 41, 255, 0) 100%), rgba(255, 255, 255, .04);
    display: flex;
    padding: 24px;
    flex-direction: column;
    gap: 24px;
    align-self: stretch
}

.game-section table {
    padding: 0;
    width: 100%;
    border-collapse: collapse
}

.game-section table tr td:first-child {
    font-size: 14px;
    line-height: 20px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 600
}

.game-section table tr td {
    border-bottom: 1px solid rgba(255, 255, 255, .15);
    padding: 16px 0;
    font-size: 14px;
    line-height: 20px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 400
}

.game-section table tr:first-child {
    border-top: 1px solid rgba(255, 255, 255, .15)
}

.game-section__reward {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px
}

.game-section__reward span {
    font-size: 18px;
    line-height: 28px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 600
}

.game-section__reward button {
    width: 100%
}

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

.game-section__score>span {
    font-size: 14px;
    line-height: 20px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 600
}

.game-section__score small {
    font-size: 14px;
    line-height: 20px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 400;
    color: var(--grey-g-40)
}

@media screen and (min-width: 992px) {
    .game-section {
        grid-template-columns: 1fr 320px
    }

    .game-screen img {
        aspect-ratio: 1016/570
    }

    .game-display__controls {
        gap: 12px
    }

    .game-screen__fulltoggle {
        bottom: 24px;
        right: 24px
    }

    .game-section {
        padding: 32px;
        gap: 24px;
        align-self: stretch
    }

    .game-section table tr td:first-child {
        font-size: 16px;
        line-height: 24px;
        font-feature-settings: "clig" off, "liga" off;
        font-style: normal;
        font-weight: 600
    }

    .game-section table tr td {
        font-size: 16px;
        line-height: 24px;
        font-feature-settings: "clig" off, "liga" off;
        font-style: normal;
        font-weight: 400
    }

    .game-section__reward {
        margin-top: auto
    }

    .game-section__reward span {
        font-size: 20px;
        line-height: 30px;
        font-feature-settings: "clig" off, "liga" off;
        font-style: normal;
        font-weight: 600
    }

    .game-section__score>span {
        font-size: 16px;
        line-height: 24px;
        font-feature-settings: "clig" off, "liga" off;
        font-style: normal;
        font-weight: 600
    }
}

.score-stars {
    display: inline-flex;
    content: "";
    background-image: url(../images/other/stars_.webp);
    width: 124px;
    height: 26px;
    background-repeat: no-repeat;
    background-position: left center;
    position: relative
}

.score-stars span {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    content: "";
    display: inline-flex;
    background-image: url(../images/other/stars.webp);
    background-position: left center;
    background-size: contain;
    background-repeat: no-repeat;
    background-size: 124px 20px
}

@media screen and (max-width: 991px) {
    .content-truncated>div {
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden
    }

    .content-truncated>button {
        margin-top: 8px;
        display: flex;
        gap: 8px;
        font-size: 14px;
        line-height: 20px;
        font-feature-settings: "clig" off, "liga" off;
        font-style: normal;
        font-weight: 600;
        color: var(--grey-g-40)
    }

    .content-truncated.is-expanded>div {
        -webkit-line-clamp: unset
    }

    .content-truncated.is-expanded>button {
        display: none
    }
}

@media screen and (min-width: 992px) {
    .content-truncated>button {
        display: none
    }
}

.container {
    max-width: 1400px;
    width: 100%;
    padding-left: 16px;
    padding-right: 16px;
    margin-left: auto;
    margin-right: auto
}

.main-content {
    display: flex;
    flex-direction: column;
    -moz-column-gap: 32px;
         column-gap: 32px
}

.main-content .content-block>:first-child {
    margin-top: 64px
}

@media screen and (min-width: 992px) {
    .main-content {
        flex-direction: row
    }

    .main-content .content-block {
        flex-grow: 1;
        min-width: 0
    }

    .main-content .content-block>:first-child {
        margin-top: 80px
    }

    .main-content .content-sidebar>:first-child {
        margin-top: 80px
    }
}

.heading {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 99;
    transition: .3s all ease
}

.heading.is-sticky {
    background: var(--bg-black);
    box-shadow: 0 4px 55px #00000080
}

.heading__upper {
    display: none
}

.heading__body {
    position: relative;
    z-index: 101;
    padding: 12px 0;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.header__nav {
    position: fixed;
    top: 56px;
    left: 0;
    width: 100%;
    height: calc(100% - 56px);
    padding: 0 16px;
    transition: all .3s ease;
    background-color: var(--bg-black);
    transform: translate(100%);
    opacity: 0;
    pointer-events: none;
    border-top: 1px solid var(--primary-border-white);
    overflow-y: auto
}

.header__nav.is-active {
    pointer-events: all;
    transform: translateY(0);
    opacity: 1
}

.heading__tasks {
    display: flex;
    gap: 12px
}

.heading__brand {
    max-width: 107px
}

.heading__login span {
    display: none
}

.header__burger span {
    display: flex;
    width: 24px;
    height: 24px;
    position: relative;
    overflow: hidden
}

.header__burger span svg {
    transition: all .3s ease;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%)
}

.header__burger span svg:first-of-type {
    opacity: 1
}

.header__burger span svg:last-of-type {
    opacity: 0;
    transform: translate(-200%, -50%)
}

.header__burger.is-active span svg:first-of-type {
    opacity: 0;
    transform: translate(200%, -50%)
}

.header__burger.is-active span svg:last-of-type {
    opacity: 1;
    transform: translate(-50%, -50%)
}

@media screen and (min-width: 992px) {
    .heading__upper {
        position: relative;
        display: flex;
        align-items: center;
        padding: 8px 0
    }

    .heading__upper:before {
        z-index: -1;
        content: "";
        position: absolute;
        left: 50%;
        top: 0;
        width: 100vw;
        height: 100%;
        transform: translate(-50%);
        background: var(--grey-g-90)
    }

    .heading__upper .action-links li:nth-child(n+3) {
        display: none
    }

    .heading__upper .live-widget {
        margin-left: auto
    }

    .heading__upper .lang-toggle {
        margin-left: 32px
    }

    .header__nav {
        position: relative;
        top: 0;
        left: 0;
        width: auto;
        height: unset;
        padding: 0;
        background-color: unset;
        transform: unset;
        opacity: 1;
        pointer-events: all;
        border-top: none;
        overflow: unset
    }

    .header__burger {
        display: none
    }
}

@media screen and (min-width: 1200px) {
    .heading__upper .action-links li:nth-child(n+3) {
        display: flex
    }

    .heading__brand {
        max-width: 170px
    }

    .heading__login span {
        display: flex
    }

    .heading__login svg {
        display: none
    }
}

@media screen and (max-width: 991px) {

    .list,
    .menu__item {
        display: flex;
        flex-direction: column
    }

    .menu__item>.menu__link {
        padding: 16px 0
    }

    .menu__item>.menu__link a {
        font-size: 18px;
        line-height: 28px;
        font-feature-settings: "clig" off, "liga" off;
        font-style: normal;
        font-weight: 600;
        color: var(--white);
        flex-grow: 1
    }

    .menu__item>.menu__link button {
        transition: transform .3s ease;
        display: flex;
        margin: -16px;
        padding: 16px
    }

    .menu__item>.list {
        max-height: 0;
        transition: max-height .15s ease-out;
        overflow: hidden
    }

    .menu__item>.list .menu__item {
        border: none !important
    }

    .menu__item>.list .menu__link {
        padding: 20px 0
    }

    .menu__item>.list .menu__link a {
        font-size: 16px;
        line-height: 24px;
        font-feature-settings: "clig" off, "liga" off;
        font-style: normal;
        font-weight: 400
    }

    .menu__item .list {
        padding-left: 16px
    }

    .menu__item.is-expanded>.menu__link button {
        transform: rotate(180deg)
    }

    .menu__item.is-expanded>.list {
        max-height: 1200px;
        transition: max-height .25s ease-in
    }

    .list>.menu__item:not(:last-child) {
        border-bottom: 1px solid var(--primary-border-white)
    }

    .menu__link {
        display: flex;
        align-items: center;
        justify-content: space-between
    }
}

@media screen and (min-width: 992px) {
    .list {
        font-size: 14px;
        line-height: 20px;
        font-feature-settings: "clig" off, "liga" off;
        font-style: normal;
        font-weight: 400;
        color: var(--white);
        display: flex;
        align-items: center;
        gap: 12px;
        pointer-events: all
    }

    .menu__item {
        position: relative
    }

    .menu__item:before {
        content: "";
        position: absolute;
        width: 100%;
        height: 48px;
        background: transparent
    }

    .menu__item .list {
        transition: all .3s ease;
        opacity: 0;
        pointer-events: none;
        border-radius: 12px;
        padding: 8px;
        background: var(--primary-blue-dark);
        box-shadow: 0 10px 20px #1d1d1d0f;
        flex-direction: column;
        align-items: start;
        gap: 0
    }

    .menu__item .menu__item {
        white-space: nowrap;
        display: flex;
        width: 100%
    }

    .menu__item .menu__item:before {
        content: "";
        position: absolute;
        width: 100%;
        height: 100%;
        left: -48px;
        background: transparent
    }

    .menu__item .menu__item:hover>.menu__link {
        opacity: unset;
        background: rgba(255, 255, 255, .1)
    }

    .menu__item .menu__item:hover>.menu__link button {
        transform: rotate(-90deg)
    }

    .menu__item .menu__link {
        display: flex;
        width: 100%;
        padding: 8px;
        border-radius: 8px
    }

    .menu__item .menu__link a {
        flex-grow: 1;
        padding: 8px;
        margin: -8px
    }

    .menu__item:hover>.menu__link {
        opacity: .5
    }

    .menu__item:hover>.menu__link button {
        transform: rotate(180deg)
    }

    .menu__item:hover>.list {
        opacity: 1;
        pointer-events: all
    }

    .menu__link {
        cursor: pointer;
        display: flex;
        align-items: center;
        gap: 12px
    }

    .menu__link a {
        display: flex;
        z-index: 1
    }

    .menu__link button {
        transition: all .3s ease;
        display: flex
    }
}

@media screen and (min-width: 1400px) {
    .list {
        font-size: 16px;
        line-height: 24px;
        font-feature-settings: "clig" off, "liga" off;
        font-style: normal;
        font-weight: 400;
        gap: 32px
    }
}

.page-bottom {
    margin-top: 64px;
    padding-top: 64px;
    padding-bottom: 24px
}

.footer__information,
.footer__head {
    display: flex;
    flex-direction: column;
    gap: 32px
}

.footer__head>div {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between
}

.footer__head>div img {
    max-width: 170px
}

.footer__head>div p {
    display: none
}

.footer__head nav {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    row-gap: 32px
}

.footer__head nav ul {
    display: flex;
    flex-direction: column;
    gap: 12px
}

.footer__head nav ul li {
    font-size: 16px;
    line-height: 24px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 600
}

.footer__element:not(:last-child) {
    border-bottom: 1.5px solid var(--primary-border-white);
    padding-bottom: 32px
}

.footer__base {
    display: flex;
    flex-direction: column;
    gap: 24px
}

.footer__base>div {
    display: flex;
    align-items: flex-start;
    gap: 12px
}

.footer__base>div img {
    max-width: 48px;
    flex-shrink: 0
}

.footer__base>div p {
    font-size: 14px;
    line-height: 20px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 400;
    color: #dbb8fa
}

@media screen and (min-width: 992px) {
    .page-bottom {
        margin-top: 80px;
        padding-top: 80px;
        padding-bottom: 32px;
        background: radial-gradient(78.09% 167.33% at 111.03% 195.75%, rgba(173, 41, 255, .678431) 0%, rgba(173, 41, 255, 0) 100%), linear-gradient(0deg, rgba(255, 255, 255, .04), rgba(255, 255, 255, .04))
    }

    .footer__head {
        flex-direction: row;
        justify-content: space-between;
        gap: 32px
    }

    .footer__head>div {
        flex-direction: column;
        align-items: flex-start
    }

    .footer__head>div img {
        margin-bottom: 32px
    }

    .footer__head>div p {
        display: block;
        color: #dbb8fa;
        margin-bottom: 16px
    }

    .footer__head nav {
        justify-content: space-between;
        gap: 24px
    }

    .footer__head nav ul {
        gap: 12px;
        min-width: 200px
    }

    .footer__element:not(:last-child) {
        padding-bottom: 48px
    }

    .footer__base {
        gap: 48px;
        flex-direction: row
    }

    .footer__base div:first-child {
        max-width: 545px
    }

    .footer__base div:last-child {
        max-width: 613px
    }
}

@media screen and (min-width: 1200px) {
    .footer__head nav ul {
        min-width: 324px
    }
}

.hero {
    margin-top: 4px
}

.page-details {
    font-size: 18px;
    line-height: 28px;
    font-feature-settings: "clig" off, "liga" off;
    font-style: normal;
    font-weight: 400
}

.page-details h1,
.page-details h2,
.page-details h3 {
    margin-top: 0
}

@font-face {
    font-family: swiper-icons;
    src: url(data:application/font-woff;charset=utf-8;base64,\ d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA);
    font-weight: 400;
    font-style: normal
}

:root {
    --swiper-theme-color: #007aff
}

:host {
    position: relative;
    display: block;
    margin-left: auto;
    margin-right: auto;
    z-index: 1
}

.swiper {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
    overflow: clip;
    list-style: none;
    padding: 0;
    z-index: 1;
    display: block
}

.swiper-vertical>.swiper-wrapper {
    flex-direction: column
}

.swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: flex;
    transition-property: transform;
    transition-timing-function: var(--swiper_wrapper-transition-timing-function, initial);
    box-sizing: content-box
}

.swiper-android .swiper-slide,
.swiper-ios .swiper-slide,
.swiper-wrapper {
    transform: translateZ(0)
}

.swiper-horizontal {
    touch-action: pan-y
}

.swiper-vertical {
    touch-action: pan-x
}

.swiper-slide {
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    position: relative;
    transition-property: transform;
    display: block
}

.swiper-slide-invisible-blank {
    visibility: hidden
}

.swiper-autoheight,
.swiper-autoheight .swiper-slide {
    height: auto
}

.swiper-autoheight .swiper-wrapper {
    align-items: flex-start;
    transition-property: transform, height
}

.swiper-backface-hidden .swiper-slide {
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.swiper-3d.swiper-css-mode .swiper-wrapper {
    perspective: 1200px
}

.swiper-3d .swiper-wrapper {
    transform-style: preserve-3d
}

.swiper-3d {
    perspective: 1200px
}

.swiper-3d .swiper-slide,
.swiper-3d .swiper-cube-shadow {
    transform-style: preserve-3d
}

.swiper-css-mode>.swiper-wrapper {
    overflow: auto;
    scrollbar-width: none;
    -ms-overflow-style: none
}

.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar {
    display: none
}

.swiper-css-mode>.swiper-wrapper>.swiper-slide {
    scroll-snap-align: start start
}

.swiper-css-mode.swiper-horizontal>.swiper-wrapper {
    -ms-scroll-snap-type: x mandatory;
        scroll-snap-type: x mandatory
}

.swiper-css-mode.swiper-vertical>.swiper-wrapper {
    -ms-scroll-snap-type: y mandatory;
        scroll-snap-type: y mandatory
}

.swiper-css-mode.swiper-free-mode>.swiper-wrapper {
    -ms-scroll-snap-type: none;
        scroll-snap-type: none
}

.swiper-css-mode.swiper-free-mode>.swiper-wrapper>.swiper-slide {
    scroll-snap-align: none
}

.swiper-css-mode.swiper-centered>.swiper-wrapper:before {
    content: "";
    flex-shrink: 0;
    order: 9999
}

.swiper-css-mode.swiper-centered>.swiper-wrapper>.swiper-slide {
    scroll-snap-align: center center;
    scroll-snap-stop: always
}

.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child {
    -webkit-margin-start: var(--swiper_centered-offset-before);
            margin-inline-start: var(--swiper_centered-offset-before)
}

.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper:before {
    height: 100%;
    min-height: 1px;
    width: var(--swiper_centered-offset-after)
}

.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child {
    -webkit-margin-before: var(--swiper_centered-offset-before);
            margin-block-start: var(--swiper_centered-offset-before)
}

.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper:before {
    width: 100%;
    min-width: 1px;
    height: var(--swiper_centered-offset-after)
}

.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-slide-shadow-bottom {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 10
}

.swiper-3d .swiper-slide-shadow {
    background: rgba(0, 0, 0, .15)
}

.swiper-3d .swiper-slide-shadow-left {
    background-image: linear-gradient(to left, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}

.swiper-3d .swiper-slide-shadow-right {
    background-image: linear-gradient(to right, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}

.swiper-3d .swiper-slide-shadow-top {
    background-image: linear-gradient(to top, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}

.swiper-3d .swiper-slide-shadow-bottom {
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}

.swiper-lazy-preloader {
    width: 42px;
    height: 42px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -21px;
    margin-top: -21px;
    z-index: 10;
    transform-origin: 50%;
    box-sizing: border-box;
    border: 4px solid var(--swiper-preloader_color, var(--swiper-theme-color));
    border-radius: 50%;
    border-top-color: transparent
}

.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader,
.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader {
    -webkit-animation: swiper-preloader_spin 1s infinite linear;
            animation: swiper-preloader_spin 1s infinite linear
}

.swiper-lazy-preloader-white {
    --swiper-preloader_color: #fff
}

.swiper-lazy-preloader-black {
    --swiper-preloader_color: #000
}

@-webkit-keyframes swiper-preloader_spin {
    0% {
        transform: rotate(0)
    }

    to {
        transform: rotate(360deg)
    }
}

@keyframes swiper-preloader_spin {
    0% {
        transform: rotate(0)
    }

    to {
        transform: rotate(360deg)
    }
}

.concealed {
    display: none;
}
