@charset "UTF-8";
@import "libs/bootstrap-grid.min.css";

@keyframes modal-before {
    0% {
        transform: scale(2.4) rotate(0)
    }

    50% {
        transform: scale(2.2) rotate(180deg)
    }

    to {
        transform: scale(2.4) rotate(360deg)
    }
}

@keyframes preloader-item_transform {

    0%,
    50%,
    to {
        transform: scale(1);
        opacity: .3
    }

    25% {
        transform: scale(1.5);
        opacity: 1
    }
}

@keyframes badge_effect-rotate {

    0%,
    to {
        transform: rotate(4deg)
    }

    50% {
        transform: rotate(-4deg)
    }
}

@keyframes animated-background__column {
    0% {
        transform: translateY(0);
        opacity: 0
    }

    4% {
        transform: translateY(-4vh);
        opacity: 1
    }

    96% {
        transform: translateY(-115vh);
        opacity: 1
    }

    to {
        transform: translateY(-120vh);
        opacity: 0
    }
}

@keyframes animated-background__item {
    0% {
        transform: rotate(0)
    }

    to {
        transform: rotate(360deg)
    }
}

@keyframes animated-ellipsis {

    0%,
    to {
        content: ""
    }

    20% {
        content: "."
    }

    40% {
        content: ".."
    }

    60% {
        content: "..."
    }

    80% {
        content: "...."
    }
}

@keyframes snow-animation {
    0% {
        transform: translate(0, 0)
    }

    to {
        transform: translate(-200vw, 200vw)
    }
}

@keyframes banner-container__content-info__mark {

    0%,
    25%,
    85%,
    to {
        transform: rotate(-5deg)
    }

    35%,
    75% {
        transform: rotate(5deg)
    }
}

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

    to {
        transform: rotate(360deg)
    }
}

@keyframes nav__list-item__link_marked_opacity {

    0%,
    to {
        opacity: .2
    }

    45%,
    55% {
        opacity: .3
    }
}

@keyframes nav__list-item__link_marked__icon {

    0%,
    20%,
    40%,
    to {
        transform: rotate(45deg)
    }

    10%,
    30% {
        transform: rotate(-45deg)
    }

    50%,
    90% {
        transform: rotate(0)
    }
}

@keyframes header__content-action__status-bar {
    0% {
        transform: scale(0);
        opacity: .3
    }

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

@keyframes header__hero-card {

    0%,
    20%,
    80%,
    to {
        transform: translateY(var(--start))
    }

    40%,
    60% {
        transform: translateY(var(--end))
    }
}

@keyframes header__hero-card__image {

    0%,
    20%,
    80%,
    to {
        opacity: var(--start)
    }

    40%,
    60% {
        opacity: var(--end)
    }
}

@keyframes header-scrolling__arrow {

    0%,
    to {
        transform: translateY(var(--g-20))
    }

    50% {
        transform: translateY(calc(var(--g-20)*-1))
    }
}

@keyframes pricing-list__card-icon {

    0%,
    to {
        transform: translateY(calc(var(--g-25)*-1))
    }

    50% {
        transform: translateY(var(--g-15))
    }
}

@keyframes cabinet-privileges__card-price__sale {

    0%,
    to {
        transform: rotate(-5deg)
    }

    50% {
        transform: rotate(5deg)
    }
}

@keyframes cabinet-privileges__card-circles {
    0% {
        transform: scale(0);
        opacity: .3
    }

    60%,
    to {
        transform: scale(10);
        opacity: 0
    }
}

@keyframes donate-header__cover {

    0%,
    to {
        transform: translateY(calc(var(--g-75)*-1))
    }

    50% {
        transform: translateY(calc(var(--g-10)*-1))
    }
}

@keyframes cabinet-header__content-privilege__icon {

    0%,
    to {
        transform: translateY(-50px)
    }

    50% {
        transform: translateY(0)
    }
}

@keyframes cabinet-manage__card-after {

    0%,
    to {
        opacity: 0
    }

    50% {
        opacity: 1
    }
}

@keyframes ban-icon__img_rotate {

    0%,
    to {
        transform: rotate(-20deg)
    }

    50% {
        transform: rotate(20deg)
    }
}

@keyframes ban-backdrop_translate {
    0% {
        transform: translate(0, 0)
    }

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

@keyframes teaser-row {
    0% {
        opacity: 0;
        transform: translateX(0)
    }

    2%,
    98% {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: translateX(-200vw)
    }
}

@keyframes launcher-download__card-icon {

    0%,
    to {
        opacity: 0
    }

    25%,
    75% {
        opacity: .7
    }
}

@keyframes launcher-download__card-heart {
    0% {
        opacity: 0;
        transform: translateX(0) translateY(0) scale(0)
    }

    35% {
        opacity: 1;
        transform: translateX(-80px) translateY(-80px) scale(1.5)
    }

    80% {
        opacity: .5;
        transform: translateX(75px) translateY(-240px) scale(3)
    }

    to {
        opacity: 0;
        transform: translateX(0) translateY(-300px) scale(4)
    }
}

@keyframes login-socials__preview-before {
    0% {
        transform: translateX(0);
        opacity: 0
    }

    4%,
    96% {
        opacity: 1
    }

    40% {
        transform: translateX(20%) rotateX(0)
    }

    50% {
        transform: translateX(25%) rotateX(90deg)
    }

    60% {
        transform: translateX(30%) rotateX(0)
    }

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

@keyframes create-character__preview-username-after {

    0%,
    49.9% {
        opacity: 0
    }

    50%,
    to {
        opacity: 1
    }
}

@keyframes donate-purchase-content__breadcrumbs-item {

    0%,
    to {
        background: var(--black_alpha-20)
    }

    50% {
        background: var(--black)
    }
}

@keyframes two-step-auth__header-extra {
    0% {
        transform: rotate(0)
    }

    to {
        transform: rotate(180deg)
    }
}

@keyframes longread-header__lights {

    0%,
    to {
        transform: scale(1.1) skew(0, 0)
    }

    20% {
        transform: scale(1.1) skew(-4deg, -3deg)
    }

    35% {
        transform: scale(1.1) skew(-4deg, 3deg)
    }

    65% {
        transform: scale(1.1) skew(4deg, -3deg)
    }

    85% {
        transform: scale(1.1) skew(4deg, 3deg)
    }
}

@keyframes longread-header__logo {

    0%,
    to {
        transform: scale(1) rotate(0)
    }

    10% {
        transform: scale(.95) rotate(3deg)
    }

    20% {
        transform: scale(1.05) rotate(-4deg)
    }

    30% {
        transform: scale(1) rotate(4deg)
    }

    40% {
        transform: scale(.9) rotate(-3deg)
    }

    50% {
        transform: scale(1.1) rotate(2deg)
    }

    60% {
        transform: scale(.95) rotate(-3deg)
    }

    70% {
        transform: scale(1.05) rotate(4deg)
    }

    80% {
        transform: scale(1.15) rotate(-2deg)
    }

    90% {
        transform: scale(.95) rotate(4deg)
    }
}

@keyframes longread-header__scroll-icon {

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

    50% {
        transform: translateY(var(--g-25))
    }
}

@keyframes longread-header__container-backdrop_rotate {
    0% {
        opacity: 0;
        transform: scale(2, 5) rotate(0deg)
    }

    3%,
    47% {
        opacity: 1
    }

    50%,
    to {
        opacity: 0;
        transform: scale(2, 5) rotate(180deg)
    }
}

@keyframes longread-nav__start {

    0%,
    2%,
    4%,
    6%,
    to {
        transform: scale(1)
    }

    1%,
    3%,
    5% {
        transform: scale(1.2)
    }
}

@keyframes longread-section__cover-img {

    0%,
    to {
        transform: scale(1.25) rotate(0)
    }

    10% {
        transform: scale(1.2) rotate(2deg)
    }

    20% {
        transform: scale(1.3) rotate(-3deg)
    }

    30% {
        transform: scale(1.25) rotate(3deg)
    }

    40%,
    60% {
        transform: scale(1.2) rotate(-2deg)
    }

    50% {
        transform: scale(1.4) rotate(1deg)
    }

    70% {
        transform: scale(1.3) rotate(3deg)
    }

    80% {
        transform: scale(1.4) rotate(-1deg)
    }

    90% {
        transform: scale(1.2) rotate(3deg)
    }
}

@keyframes longread-section__cover-gradient {

    0%,
    12%,
    to {
        opacity: 0
    }

    0% {
        transform: scale(1)
    }

    12% {
        transform: scale(1.5)
    }

    10%,
    2% {
        opacity: 1
    }
}

@keyframes longread-feature__img-2 {

    0%,
    55%,
    to {
        opacity: 0
    }

    10%,
    45% {
        opacity: 1
    }

    0% {
        transform: scale(1) rotate(0)
    }

    67% {
        transform: scale(1.1) rotate(3deg)
    }
}

@keyframes longread-feature__img-3 {

    0%,
    38%,
    to {
        opacity: 0
    }

    32%,
    4% {
        opacity: 1
    }

    0% {
        transform: scale(1) rotate(0)
    }

    40% {
        transform: scale(1.1) rotate(3deg)
    }
}

@keyframes longread-component__item {

    0%,
    to {
        filter: saturate(.8)
    }

    50% {
        filter: saturate(2)
    }
}

:root {
    --white: hsl(0, 0%, 100%);
    --white_alpha-5: hsla(0, 0%, 100%, .05);
    --white_alpha-10: hsla(0, 0%, 100%, .1);
    --white_alpha-15: hsla(0, 0%, 100%, .15);
    --white_alpha-20: hsla(0, 0%, 100%, .2);
    --white_alpha-30: hsla(0, 0%, 100%, .3);
    --white_alpha-40: hsla(0, 0%, 100%, .4);
    --white_alpha-50: hsla(0, 0%, 100%, .5);
    --white_alpha-60: hsla(0, 0%, 100%, .6);
    --white_alpha-70: hsla(0, 0%, 100%, .7);
    --white_alpha-80: hsla(0, 0%, 100%, .8);
    --white_alpha-90: hsla(0, 0%, 100%, .9);
    --black: hsl(0, 0%, 0%);
    --black_alpha-5: hsla(0, 0%, 0%, .05);
    --black_alpha-10: hsla(0, 0%, 0%, .1);
    --black_alpha-15: hsla(0, 0%, 0%, .15);
    --black_alpha-20: hsla(0, 0%, 0%, .2);
    --black_alpha-30: hsla(0, 0%, 0%, .3);
    --black_alpha-40: hsla(0, 0%, 0%, .4);
    --black_alpha-50: hsla(0, 0%, 0%, .5);
    --black_alpha-60: hsla(0, 0%, 0%, .6);
    --black_alpha-70: hsla(0, 0%, 0%, .7);
    --black_alpha-80: hsla(0, 0%, 0%, .8);
    --black_alpha-90: hsla(0, 0%, 0%, .9);
    --gray-50: hsl(0, 0%, 95%);
    --gray-50_alpha-50: hsla(0, 0%, 95%, .5);
    --gray-50_alpha-90: hsla(0, 0%, 95%, .9);
    --gray-100: hsl(0, 0%, 90%);
    --gray-100_alpha-40: hsla(0, 0%, 90%, .4);
    --gray-100_alpha-60: hsla(0, 0%, 90%, .6);
    --gray-150: hsl(0, 0%, 85%);
    --gray-200: hsl(0, 0%, 80%);
    --gray-300: hsl(0, 0%, 70%);
    --gray-400: hsl(0, 0%, 60%);
    --gray-400_alpha-10: hsla(0, 0%, 60%, .1);
    --gray-400_alpha-15: hsla(0, 0%, 60%, .15);
    --gray-400_alpha-60: hsla(0, 0%, 60%, .6);
    --gray-500: hsl(0, 0%, 50%);
    --gray-600: hsl(0, 0%, 40%);
    --gray-600_alpha-50: hsla(0, 0%, 40%, .5);
    --gray-600_alpha-70: hsla(0, 0%, 40%, .7);
    --gray-700: hsl(0, 0%, 30%);
    --gray-800: hsl(0, 0%, 20%);
    --gray-850: hsl(0, 0%, 15%);
    --gray-900: hsl(0, 0%, 10%);
    --steel-50: hsl(202, 19%, 95%);
    --steel-70: hsl(202, 19%, 93%);
    --steel-200: hsl(202, 19%, 80%);
    --steel-400: hsl(202, 19%, 60%);
    --steel-400_alpha-20: hsla(202, 19%, 60%, .2);
    --steel-400_alpha-40: hsla(202, 19%, 60%, .4);
    --steel-400_alpha-60: hsla(202, 19%, 60%, .6);
    --steel-850: hsla(202, 19%, 15%);
    --steel-900: hsla(202, 19%, 10%);
    --orange-400: hsl(34, 100%, 60%);
    --orange-400_alpha-5: hsla(34, 100%, 60%, .05);
    --orange-400_alpha-10: hsla(34, 100%, 60%, .1);
    --orange-400_alpha-20: hsla(34, 100%, 60%, .2);
    --orange-400_alpha-30: hsla(34, 100%, 60%, .3);
    --orange-400_alpha-40: hsla(34, 100%, 60%, .4);
    --orange-400_alpha-50: hsla(34, 100%, 60%, .5);
    --orange-400_alpha-70: hsla(34, 100%, 60%, .7);
    --yellow-100: hsl(55, 100%, 90%);
    --yellow-300: hsl(55, 100%, 70%);
    --yellow-300_alpha-5: hsla(55, 100%, 70%, .05);
    --yellow-300_alpha-10: hsla(55, 100%, 70%, .1);
    --yellow-300_alpha-40: hsla(55, 100%, 70%, .4);
    --aqua-300: hsl(180, 100%, 70%);
    --aqua-300_alpha-5: hsla(180, 100%, 70%, .05);
    --aqua-300_alpha-30: hsla(180, 100%, 70%, .3);
    --aqua-300_alpha-40: hsla(180, 100%, 70%, .4);
    --aqua-300_alpha-60: hsla(180, 100%, 70%, .6);
    --aqua-300_alpha-80: hsla(180, 100%, 70%, .8);
    --aqua-700: hsl(180, 100%, 30%);
    --aqua-700_alpha-30: hsla(180, 100%, 30%, .3);
    --aqua-700_alpha-50: hsla(180, 100%, 30%, .5);
    --blue-250: hsl(205, 100%, 75%);
    --blue-250_alpha-40: hsla(205, 100%, 75%, .4);
    --blue-450: hsl(201, 85%, 55%);
    --blue-450_alpha-5: hsla(201, 85%, 55%, .05);
    --blue-450_alpha-10: hsla(201, 85%, 55%, .1);
    --blue-450_alpha-20: hsla(201, 85%, 55%, .2);
    --blue-450_alpha-30: hsla(201, 85%, 55%, .3);
    --blue-450_alpha-40: hsla(201, 85%, 55%, .4);
    --blue-450_alpha-50: hsla(201, 85%, 55%, .5);
    --blue-450_alpha-60: hsla(201, 85%, 55%, .6);
    --blue-450_alpha-70: hsla(201, 85%, 55%, .7);
    --blue-450_alpha-80: hsla(201, 85%, 55%, .8);
    --blue-saturate-500: hsl(212, 100%, 50%);
    --blue-saturate-500_alpha-20: hsla(212, 100%, 50%, .2);
    --blue-saturate-500_alpha-30: hsla(212, 100%, 50%, .3);
    --blue-saturate-500_alpha-50: hsla(212, 100%, 50%, .5);
    --blue-saturate-500_alpha-60: hsla(212, 100%, 50%, .6);
    --blue-saturate-500_alpha-80: hsla(212, 100%, 50%, .8);
    --blue-saturate-970: hsl(212, 100%, 3%);
    --green-300: hsl(120, 100%, 70%);
    --green-300_alpha-5: hsla(120, 100%, 70%, .05);
    --green-300_alpha-10: hsla(120, 100%, 70%, .1);
    --green-300_alpha-20: hsla(120, 100%, 70%, .2);
    --green-300_alpha-30: hsla(120, 100%, 70%, .3);
    --green-300_alpha-50: hsla(120, 100%, 70%, .5);
    --green-550: hsl(151, 100%, 45%);
    --green-550_alpha-10: hsla(151, 100%, 45%, .1);
    --green-550_alpha-30: hsla(151, 100%, 45%, .3);
    --green-550_alpha-40: hsla(151, 100%, 45%, .4);
    --green-550_alpha-70: hsla(151, 100%, 45%, .7);
    --green-600: hsl(151, 100%, 40%);
    --green-650: hsl(151, 100%, 35%);
    --green-700: hsl(151, 100%, 30%);
    --green-700_alpha-50: hsla(151, 100%, 30%, .5);
    --violet-300: hsl(266, 100%, 70%);
    --violet-300_alpha-5: hsla(266, 100%, 70%, .05);
    --violet-300_alpha-10: hsla(266, 100%, 70%, .1);
    --violet-300_alpha-20: hsla(266, 100%, 70%, .2);
    --violet-300_alpha-30: hsla(266, 100%, 70%, .3);
    --violet-300_alpha-40: hsla(266, 100%, 70%, .4);
    --violet-300_alpha-70: hsla(266, 100%, 70%, .7);
    --pink-100: hsl(338, 100%, 90%);
    --pink-100_alpha-20: hsla(338, 100%, 90%, .2);
    --pink-100_alpha-50: hsla(338, 100%, 90%, .5);
    --pink-200: hsl(338, 100%, 80%);
    --pink-500: hsl(338, 100%, 50%);
    --pink-500_alpha-10: hsla(338, 100%, 50%, .1);
    --pink-500_alpha-20: hsla(338, 100%, 50%, .2);
    --pink-500_alpha-30: hsla(338, 100%, 50%, .3);
    --pink-500_alpha-40: hsla(338, 100%, 50%, .4);
    --pink-500_alpha-50: hsla(338, 100%, 50%, .5);
    --pink-500_alpha-60: hsla(338, 100%, 50%, .6);
    --pink-500_alpha-70: hsla(338, 100%, 50%, .7);
    --pink-500_alpha-80: hsla(338, 100%, 50%, .8);
    --purple-300: hsl(321, 100%, 70%);
    --purple-300_alpha-10: hsla(321, 100%, 70%, .1);
    --purple-300_alpha-30: hsla(321, 100%, 70%, .3);
    --purple-300_alpha-50: hsla(321, 100%, 70%, .5);
    --purple-600: hsl(321, 100%, 40%);
    --purple-700: hsl(300, 100%, 30%);
    --purple-700_alpha-10: hsla(300, 100%, 30%, .1);
    --purple-700_alpha-30: hsla(300, 100%, 30%, .3);
    --purple-700_alpha-60: hsla(300, 100%, 30%, .6);
    --purple-700_alpha-70: hsla(300, 100%, 30%, .7);
    --red: hsl(0, 100%, 50%);
    --red-100: hsl(0, 76%, 90%);
    --red-200: hsl(0, 76%, 80%);
    --red-400: hsl(0, 76%, 60%);
    --red-400_alpha-20: hsla(0, 76%, 60%, .2);
    --red-400_alpha-40: hsla(0, 76%, 60%, .4);
    --red-400_alpha-50: hsla(0, 76%, 60%, .5);
    --red-400_alpha-60: hsla(0, 76%, 60%, .6);
    --red-400_alpha-80: hsla(0, 76%, 60%, .8);
    --red-600: hsl(0, 76%, 40%);
    --red-600_alpha-10: hsla(0, 76%, 40%, .1);
    --red-600_alpha-20: hsla(0, 76%, 40%, .2);
    --red-600_alpha-30: hsla(0, 76%, 40%, .3);
    --red-600_alpha-40: hsla(0, 76%, 40%, .4);
    --red-600_alpha-50: hsla(0, 76%, 40%, .5);
    --red-600_alpha-70: hsla(0, 76%, 40%, .7);
    --red-600_alpha-80: hsla(0, 76%, 40%, .8);
    --red-750: hsl(352, 94%, 25%);
    --red-750_alpha-40: hsla(352, 94%, 25%, .4);
    --brand-vk: #0077FF;
    --brand-discord: #5865F2;
    --brand-youtube: #FF0000;
    --brand-telegram: #2AABEE;
    --ru-color-1: white;
    --ru-color-2: #0039A6;
    --ru-color-3: #D52B1E;
    --ua-color-1: #0057b8;
    --ua-color-2: #ffd700;
    --timing-function_default: cubic-bezier(0, .8, .26, .99);
    --timing-function_alt: cubic-bezier(.165, .84, .44, 1);
    --g-150: 150px;
    --g-100: 100px;
    --g-75: 75px;
    --g-60: 60px;
    --g-50: 50px;
    --g-45: 45px;
    --g-40: 40px;
    --g-35: 35px;
    --g-30: 30px;
    --g-25: 25px;
    --g-20: 20px;
    --g-15: 15px;
    --g-12: 12px;
    --g-10: 10px;
    --g-8: 8px;
    --g-5: 5px;
    --g-4: 4px;
    --size-96: 96px;
    --size-80: 80px;
    --size-72: 72px;
    --size-64: 64px;
    --size-48: 48px;
    --size-40: 40px;
    --size-36: 36px;
    --size-32: 32px;
    --size-24: 24px;
    --size-20: 20px;
    --size-18: 18px;
    --size-16: 16px;
    --size-14: 14px;
    --size-12: 12px;
    --size-11: 11px
}

@media (max-width:1600px) {
    :root {
        --g-150: 135px;
        --g-100: 90px;
        --g-75: 60px;
        --g-60: 50px;
        --g-50: 45px;
        --g-45: 40px;
        --g-40: 35px;
        --g-35: 30px;
        --g-30: 25px;
        --g-25: 20px;
        --g-20: 18px;
        --size-96: 72px;
        --size-80: 64px;
        --size-72: 56px;
        --size-64: 48px;
        --size-48: 40px;
        --size-40: 36px;
        --size-36: 32px;
        --size-32: 24px;
        --size-24: 20px;
        --size-20: 18px;
        --size-18: 16px;
        --size-16: 14px;
        --size-14: 12px;
        --size-12: 11px;
        --size-11: 10px
    }
}

@media (max-width:1200px) {
    :root {
        --g-150: 100px;
        --g-100: 75px;
        --g-75: 50px;
        --g-60: 45px;
        --g-50: 40px;
        --g-45: 35px;
        --g-40: 30px;
        --g-35: 25px;
        --g-30: 20px;
        --g-25: 18px;
        --g-20: 16px;
        --g-15: 14px
    }
}

@media (max-width:992px) {
    :root {
        --g-150: 75px;
        --g-100: 60px;
        --g-75: 45px;
        --g-60: 40px;
        --g-50: 35px;
        --g-45: 30px;
        --g-40: 25px;
        --g-35: 20px;
        --g-30: 18px;
        --g-25: 16px;
        --g-20: 14px;
        --g-15: 12px;
        --g-12: 10px;
        --g-10: 8px;
        --g-8: 6px;
        --size-96: 64px;
        --size-80: 56px;
        --size-72: 48px;
        --size-64: 40px;
        --size-48: 36px;
        --size-40: 32px;
        --size-36: 24px;
        --size-32: 20px;
        --size-24: 18px;
        --size-20: 16px;
        --size-18: 14px;
        --size-16: 13px
    }
}

@media (max-width:900px) {
    :root {
        --size-96: 56px;
        --size-80: 48px;
        --size-72: 40px;
        --size-64: 36px;
        --size-48: 32px;
        --size-40: 28px
    }
}

@media (max-width:768px) {
    :root {
        --g-150: 60px;
        --g-100: 45px;
        --g-75: 40px;
        --g-60: 35px;
        --g-50: 30px;
        --g-45: 25px;
        --g-40: 20px;
        --g-35: 18px;
        --g-30: 16px;
        --g-25: 14px;
        --g-20: 12px;
        --g-15: 10px;
        --g-12: 8px;
        --g-10: 6px;
        --g-8: 5px;
        --g-5: 4px;
        --g-4: 2px;
        --size-96: 64px;
        --size-80: 48px;
        --size-72: 40px;
        --size-64: 36px;
        --size-48: 32px;
        --size-40: 24px;
        --size-36: 20px;
        --size-32: 18px;
        --size-24: 16px;
        --size-20: 14px;
        --size-18: 13px;
        --size-16: 12px;
        --size-14: 11px;
        --size-12: 10px;
        --size-11: 9px
    }
}

@media (max-width:576px) {
    :root {
        --g-150: 50px;
        --g-100: 40px;
        --g-75: 35px;
        --g-60: 30px;
        --g-50: 25px;
        --g-45: 20px;
        --g-40: 18px;
        --g-35: 16px;
        --g-30: 14px;
        --g-25: 12px;
        --g-20: 10px;
        --g-15: 8px;
        --g-12: 6px;
        --g-10: 5px;
        --g-8: 4px;
        --g-5: 3px;
        --size-96: 48px;
        --size-80: 40px;
        --size-72: 36px;
        --size-64: 32px;
        --size-48: 24px;
        --size-40: 20px;
        --size-36: 18px;
        --size-32: 16px;
        --size-24: 14px;
        --size-20: 13px;
        --size-18: 12px;
        --size-16: 11px;
        --size-14: 10px;
        --size-12: 9px;
        --size-11: 8px
    }
}

@media (max-width:480px) {
    :root {
        --g-150: 35px;
        --g-100: 30px;
        --g-75: 26px;
        --g-60: 24px;
        --g-50: 22px;
        --size-96: 40px;
        --size-80: 36px;
        --size-72: 32px;
        --size-64: 28px
    }
}

@font-face {
    font-family: "NEXT ART";
    src: local("nextart-light"), local("nextart-light"), url(../font/nextart/nextart-light.woff)format("woff");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: "NEXT ART";
    src: local("nextart-regular"), local("nextart-regular"), url(../font/nextart/nextart-regular.woff)format("woff");
    font-weight: 500;
    font-style: normal
}

@font-face {
    font-family: "NEXT ART";
    src: local("nextart-semibold"), local("nextart-semibold"), url(../font/nextart/nextart-semibold.woff)format("woff");
    font-weight: 600;
    font-style: normal
}

@font-face {
    font-family: "NEXT ART";
    src: local("nextart-bold"), local("nextart-bold"), url(../font/nextart/nextart-bold.woff)format("woff");
    font-weight: 700;
    font-style: normal
}

@font-face {
    font-family: "NEXT ART";
    src: local("nextart-heavy"), local("nextart-heavy"), url(../font/nextart/nextart-heavy.woff)format("woff");
    font-weight: 900;
    font-style: normal
}

@font-face {
    font-family: "Montserrat";
    src: url(../font/montserrat/Montserrat-Regular.ttf);
    font-style: normal;
    font-weight: 400
}

@font-face {
    font-family: "Montserrat";
    src: url(../font/montserrat/Montserrat-Italic.ttf);
    font-style: italic;
    font-weight: 400
}

@font-face {
    font-family: "Montserrat";
    src: url(../font/montserrat/Montserrat-Medium.ttf);
    font-style: normal;
    font-weight: 500
}

@font-face {
    font-family: "Montserrat";
    src: url(../font/montserrat/Montserrat-MediumItalic.ttf);
    font-style: italic;
    font-weight: 500
}

@font-face {
    font-family: "Montserrat";
    src: url(../font/montserrat/Montserrat-SemiBold.ttf);
    font-style: normal;
    font-weight: 600
}

@font-face {
    font-family: "Montserrat";
    src: url(../font/montserrat/Montserrat-Bold.ttf);
    font-style: normal;
    font-weight: 700
}

@font-face {
    font-family: "Montserrat";
    src: url(../font/montserrat/Montserrat-ExtraBold.ttf);
    font-style: normal;
    font-weight: 800
}

@font-face {
    font-family: "Montserrat";
    src: url(../font/montserrat/Montserrat-Black.ttf);
    font-style: normal;
    font-weight: 900
}

@font-face {
    font-family: "Unbounded";
    src: url(../font/unbounded/Unbounded-Light.ttf);
    font-style: normal;
    font-weight: 200
}

@font-face {
    font-family: "Unbounded";
    src: url(../font/unbounded/Unbounded-Blond.ttf);
    font-style: normal;
    font-weight: 300
}

@font-face {
    font-family: "Unbounded";
    src: url(../font/unbounded/Unbounded-Regular.ttf);
    font-style: normal;
    font-weight: 400
}

@font-face {
    font-family: "Unbounded";
    src: url(../font/unbounded/Unbounded-Medium.ttf);
    font-style: normal;
    font-weight: 500
}

@font-face {
    font-family: "Unbounded";
    src: url(../font/unbounded/Unbounded-SemiBold.ttf);
    font-style: normal;
    font-weight: 600
}

@font-face {
    font-family: "Unbounded";
    src: url(../font/unbounded/Unbounded-Bold.ttf);
    font-style: normal;
    font-weight: 700
}

@font-face {
    font-family: "Unbounded";
    src: url(../font/unbounded/Unbounded-ExtraBold.ttf);
    font-style: normal;
    font-weight: 800
}

@font-face {
    font-family: "Unbounded";
    src: url(../font/unbounded/Unbounded-Black.ttf);
    font-style: normal;
    font-weight: 900
}

@font-face {
    font-family: Minecraft Five;
    font-style: normal;
    font-weight: 400;
    src: url(../font/minecraft/Minecraft-Five.woff)format("woff")
}

@font-face {
    font-family: Minecraft Seven;
    font-style: normal;
    font-weight: 400;
    src: url(../font/minecraft/Minecraft-Seven.woff)format("woff")
}

a {
    margin: 0;
    padding: 0;
    border: 0;
    vertical-align: baseline
}

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

*,
a,
div,
p {
    font-family: "Montserrat", sans-serif
}

a,
input {
    box-sizing: border-box
}

a,
a *,
button,
button * {
    color: inherit;
    cursor: pointer !important;
    text-decoration: none !important
}

body,
html {
    scroll-behavior: smooth
}

html {
    min-width: 420px
}

body {
    position: relative;
    overflow-x: clip;
    overflow-y: overlay
}

body::-webkit-scrollbar {
    width: 12px
}

body::-webkit-scrollbar-track {
    background: var(--gray-50)
}

body::-webkit-scrollbar-thumb {
    border-radius: 50px;
    border: 3px solid var(--gray-50);
    background: var(--gray-400)
}

body::-webkit-scrollbar-thumb:hover {
    background: var(--gray-800)
}

body.overflow-hidden {
    padding-right: var(--g-12);
    overflow: hidden
}

img {
    pointer-events: none;
    user-select: none
}

ol,
ul {
    list-style: none
}

li {
    display: inline-block
}

button {
    border: unset;
    background: unset;
    padding: unset;
    outline: unset
}

.input {
    --border-color: var(--gray-200);
    --color: var(--gray-400);
    --font-size: var(--size-20);
    --text-indent: 0;
    position: relative;
    display: block;
    background-color: transparent;
    border-radius: 999px;
    border: 2px solid var(--border-color);
    line-height: 1.3;
    font-weight: 400;
    font-size: var(--font-size);
    color: var(--color);
    padding: var(--g-12) var(--g-30);
    opacity: 1;
    width: 100%;
    white-space: nowrap;
    transition: .7s var(--timing-function_default);
    vertical-align: top;
    outline: 0
}

.input::placeholder {
    color: var(--black_alpha-30)
}

.input:hover {
    --border-color: var(--blue-450);
    --color: var(--blue-450);
    background-color: transparent
}

.input:active,
.input:focus {
    --border-color: transparent;
    --color: var(--blue-450);
    background-color: var(--blue-450_alpha-5)
}

.input_style-danger {
    --border-color: var(--pink-500);
    --color: var(--pink-500_alpha-80);
    --text-indent: var(--g-30);
    background: url(../img/icon/input/cross.svg)no-repeat var(--g-8)0;
    background-size: auto 100%;
    text-indent: var(--text-indent)
}

.input_style-danger:not(:hover)::placeholder {
    color: var(--pink-500_alpha-60)
}

.input_style-success {
    --border-color: transparent;
    --color: var(--green-600);
    --text-indent: var(--g-35);
    background: var(--green-300_alpha-10)url(../img/icon/input/check.svg)no-repeat 15px -1px;
    background-size: auto 100%;
    text-indent: var(--text-indent)
}

.input_style-success:not(:hover)::placeholder {
    color: var(--green-700_alpha-50)
}

.input_style-dark {
    --border-color: var(--white_alpha-10);
    --color: var(--white_alpha-60)
}

.input_style-dark::placeholder {
    color: var(--white_alpha-20)
}

.input_style-dark:hover {
    --border-color: var(--white_alpha-20);
    --color: var(--white_alpha-60)
}

.input_style-dark:active,
.input_style-dark:focus {
    --border-color: transparent;
    background: var(--white_alpha-5)
}

.input_style-disabled {
    border: 0;
    background: var(--gray-50);
    pointer-events: none
}

.input_size-sm {
    --font-size: var(--size-16);
    --text-indent: var(--g-30);
    padding: var(--g-10) var(--g-25)
}

.input_size-lg {
    --font-size: var(--size-20);
    border-width: 2.5px;
    padding: var(--g-15) var(--g-35)
}

.input_size-xl {
    --font-size: var(--size-24);
    --text-indent: var(--g-40);
    border-width: 3px;
    padding: var(--g-20) var(--g-45)
}

@media (max-width:768px) {
    .input {
        border-width: 1px
    }

    .input_size-lg {
        border-width: 1.5px
    }

    .input_size-xl {
        border-width: 2px
    }
}

.checkbox {
    position: relative;
    vertical-align: middle
}

.checkbox::after,
.checkbox::before {
    content: "";
    display: block;
    position: absolute
}

.checkbox,
.checkbox::before {
    width: var(--size-24);
    height: var(--size-24)
}

.checkbox::before {
    border-radius: var(--g-8);
    border: 2px solid var(--gray-200);
    background: var(--white);
    top: -2px;
    left: 0;
    box-shadow: 0 0 0 4px var(--white)
}

.checkbox::after {
    background: url(../img/icon/input/check.svg)no-repeat center;
    background-size: contain;
    width: var(--g-60);
    height: var(--g-60);
    top: -21px;
    left: -10px;
    opacity: 0;
    transition: .2s var(--timing-function_default);
    transform: scale(0);
    transform-origin: center bottom;
    will-change: transform, opacity;
    z-index: 1
}

.checkbox:checked::after {
    opacity: 1;
    transform: scale(1)
}

@media (max-width:1600px) {
    .checkbox::after {
        top: -17px;
        left: -8px
    }
}

@media (max-width:1200px) {
    .checkbox::after {
        top: -70%;
        left: -30%
    }
}

@media (max-width:480px) {
    .checkbox::after {
        top: -5px;
        left: -2px
    }
}

.btn {
    --hover-filter: brightness(1.2);
    --font-size: var(--size-18);
    --color: var(--white);
    position: relative;
    display: inline-block;
    border-radius: 200px;
    background: var(--black_alpha-70);
    line-height: 1.3;
    font-weight: 600;
    font-size: var(--font-size);
    color: var(--color);
    padding: var(--g-10) var(--g-25);
    opacity: 1;
    white-space: nowrap;
    vertical-align: top
}

.btn,
.btn-imitation {
    transition: .2s var(--timing-function_default);
    will-change: opacity, transform;
    -webkit-backdrop-filter: blur(25px);
    backdrop-filter: blur(25px)
}

.btn-imitation:hover,
.btn:hover {
    filter: var(--hover-filter);
    transform: scale(1.15);
    z-index: 1
}

.btn-imitation:active,
.btn:active {
    filter: brightness(.9);
    transform: scale(.9)
}

.btn_style-primary {
    --color: var(--black_alpha-60);
    background: linear-gradient(90deg, var(--aqua-300) -20%, var(--blue-450) 120%);
    box-shadow: -20px -10px 35px var(--aqua-300_alpha-30), 20px 10px 35px var(--blue-450_alpha-30)
}

.btn_style-primary::after,
.btn_style-success::after {
    filter: invert(1)
}

.btn_style-danger {
    background: linear-gradient(135deg, var(--pink-500), var(--purple-700));
    box-shadow: -20px -10px 35px var(--pink-500_alpha-30), 20px 10px 35px var(--violet-300_alpha-30)
}

.btn_style-warning {
    background: linear-gradient(135deg, var(--orange-400), var(--pink-500));
    box-shadow: -20px -10px 35px var(--orange-400_alpha-30), 20px 10px 35px var(--pink-500_alpha-30)
}

.btn_style-success {
    --color: var(--black_alpha-60);
    background: linear-gradient(135deg, var(--yellow-300), var(--green-550));
    box-shadow: -20px -10px 35px var(--yellow-300_alpha-40), 20px 10px 35px var(--green-550_alpha-40)
}

.btn_style-secondary {
    --hover-filter: brightness(1.3);
    --color: var(--gray-500);
    background: var(--gray-400_alpha-15)
}

.btn_style-light::after,
.btn_style-secondary::after,
.btn_style-steel::after {
    filter: invert(.5)
}

.btn_style-light {
    --color: var(--gray-400);
    background: var(--gray-50)
}

.btn_style-steel {
    --hover-filter: brightness(1);
    --color: var(--steel-400);
    background: var(--steel-50)
}

.btn_style-dark {
    --shadow-size: 35px;
    background: var(--black);
    box-shadow: var(--shadow-size)0 var(--shadow-size) var(--violet-300_alpha-30), calc(var(--shadow-size)*-1)0 var(--shadow-size) var(--pink-500_alpha-30)
}

.btn_style-outline {
    --color: var(--gray-400);
    background: unset;
    font-weight: 400;
    box-shadow: inset 0 0 0 2px var(--gray-100)
}

.btn_style-vk {
    background: var(--brand-vk)
}

.btn_status-disabled {
    pointer-events: none
}

.btn_status-flat {
    box-shadow: none
}

.btn_size-sm {
    --font-size: var(--size-16);
    padding: var(--g-10) var(--g-20)
}

.btn_size-lg {
    --font-size: var(--size-20);
    padding: var(--g-15) var(--g-35)
}

.btn_size-xl {
    --font-size: var(--size-24);
    padding: var(--g-15) var(--g-40)
}

.btn_arrowed {
    --width-multiplier: 1.3;
    --height-multiplier: 1.3;
    display: inline-grid;
    grid-auto-flow: column;
    justify-items: start;
    grid-gap: var(--g-10)
}

.btn_arrowed::after {
    content: "";
    display: inline-block;
    background: var(--icon-url) no-repeat center;
    background-size: contain;
    width: calc(var(--font-size)*var(--width-multiplier));
    height: calc(var(--font-size)*var(--height-multiplier));
    vertical-align: bottom;
    opacity: .7;
    margin-left: auto
}

.btn_arrowed-right {
    --width-multiplier: .6;
    --icon-url: url("../img/icon/arrow-right.svg")
}

.btn_arrowed-circle {
    --icon-url: url("../img/icon/arrow-circle.svg")
}

.btn-mark {
    background: linear-gradient(180deg, var(--yellow-300), var(--green-300));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 700
}

.link {
    display: inline-block;
    border-bottom: 2px solid var(--black_alpha-40);
    line-height: 1.2;
    color: var(--black_alpha-60);
    opacity: 1;
    transition: .3s var(--timing-function_default);
    text-align: center
}

.link:hover {
    border-color: var(--black_alpha-20);
    color: var(--black_alpha-40)
}

.link:active {
    opacity: .6
}

.link_style-light {
    border-color: var(--gray-500);
    color: var(--gray-200)
}

.link_style-light:hover {
    border-color: var(--gray-700);
    color: var(--gray-400)
}

.link_style-violet {
    border-color: var(--violet-300_alpha-70);
    color: var(--violet-300)
}

.link_style-violet:hover {
    border-color: var(--violet-300_alpha-40);
    color: var(--violet-300_alpha-70)
}

.link_style-blue {
    border-color: var(--blue-450_alpha-70);
    color: var(--blue-450)
}

.link_style-blue:hover {
    border-color: var(--blue-450_alpha-40);
    color: var(--blue-450_alpha-70)
}

.link_style-green {
    border-color: var(--green-550_alpha-70);
    color: var(--green-550)
}

.link_style-green:hover {
    border-color: var(--green-550_alpha-40);
    color: var(--green-550_alpha-70)
}

.link_style-red {
    border-color: var(--red-400_alpha-40);
    color: var(--red-400)
}

.link_style-red:hover {
    border-color: var(--red-400_alpha-20);
    color: var(--red-400_alpha-60)
}

@media (max-width:768px) {
    .link {
        border-width: 1px;
        line-height: 1.4
    }
}

.scroll::-webkit-scrollbar {
    width: 12px
}

.scroll::-webkit-scrollbar-track {
    background: var(--gray-50)
}

.scroll::-webkit-scrollbar-thumb {
    border-radius: 50px;
    border: 3px solid var(--gray-50);
    background: var(--gray-400)
}

.scroll::-webkit-scrollbar-thumb:hover {
    background: var(--gray-800)
}

.scroll_style-dark::-webkit-scrollbar {
    width: 12px
}

.scroll_style-dark::-webkit-scrollbar-track {
    background: var(--gray-900)
}

.scroll_style-dark::-webkit-scrollbar-thumb {
    border-radius: 50px;
    border: 3px solid var(--gray-900);
    background: var(--gray-700)
}

.scroll_style-dark::-webkit-scrollbar-thumb:hover {
    background: var(--gray-500)
}

.modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    z-index: 99
}

.modal::before {
    content: "";
    display: block;
    position: absolute;
    background: linear-gradient(135deg, var(--pink-500_alpha-60), var(--purple-700_alpha-60) 35%, var(--blue-450_alpha-60) 75%), var(--black_alpha-70);
    width: 100vw;
    height: 100vw;
    top: calc(50vw - 50vh);
    left: 0;
    animation: modal-before 45s linear infinite;
    transform-origin: center center;
    user-select: none;
    pointer-events: none;
    will-change: transform;
    z-index: 0
}

.modal-container {
    display: grid;
    justify-content: center;
    position: relative;
    padding: 5vh 0;
    width: 100vw;
    height: 100vh;
    overflow: hidden auto;
    z-index: 1
}

.modal-container::-webkit-scrollbar {
    width: 12px
}

.modal-container::-webkit-scrollbar-track {
    background: var(--gray-50)
}

.modal-container::-webkit-scrollbar-thumb {
    border-radius: 50px;
    border: 3px solid var(--gray-50);
    background: var(--gray-400)
}

.modal-container::-webkit-scrollbar-thumb:hover {
    background: var(--gray-800)
}

.modal-container__wrapper {
    display: grid;
    justify-content: center;
    justify-items: center;
    align-content: center;
    align-items: center;
    grid-gap: var(--g-45);
    max-width: 960px;
    width: 100%;
    padding: 0 15px
}

.modal-container__window {
    display: block;
    border-radius: var(--g-25);
    background: var(--white);
    padding: var(--g-45);
    width: 100%;
    text-align: center
}

.modal-container__window-heading {
    font-weight: 600;
    font-size: var(--size-48);
    color: var(--gray-800)
}

.modal-container__window-heading_size-lg {
    font-size: var(--size-40)
}

.modal-container__window-paragraph {
    font-weight: 500;
    font-size: var(--size-24);
    line-height: 1.5;
    color: var(--gray-400);
    max-width: 640px
}

.modal-container__window-paragraph_size-md {
    font-size: var(--size-20)
}

.modal-container__window-info {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-gap: var(--g-10);
    border-radius: var(--g-15);
    background: var(--gray-50_alpha-50);
    font-weight: 400;
    font-size: var(--size-14);
    color: var(--gray-400);
    padding: var(--g-15) var(--g-20);
    max-width: 510px;
    width: 100%;
    text-align: left
}

.modal-container__window-info__icon {
    width: var(--size-24)
}

.modal-container__window-info__content {
    margin-top: 2px
}

.modal-container__window-info__mark {
    font-weight: 700;
    background: linear-gradient(to left, var(--pink-500) -35%, var(--orange-400));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.modal-container__window-actions {
    display: grid;
    grid-auto-flow: column;
    justify-content: center;
    justify-items: center;
    align-items: center;
    grid-gap: var(--g-25);
    margin: var(--g-25)0 0
}

.modal-container__window-section {
    display: grid
}

.modal-container__window-section_gap-5 {
    grid-gap: 5px
}

.modal-container__window-section_gap-10 {
    grid-gap: var(--g-10)
}

.modal-container__window-section_gap-15 {
    grid-gap: var(--g-15)
}

.modal-container__window-section_gap-20 {
    grid-gap: var(--g-20)
}

.modal-container__window-section_justify-center {
    justify-content: center;
    justify-items: center
}

.modal-close {
    display: block;
    position: absolute;
    width: 90px;
    height: 90px;
    top: 75px;
    right: 110px;
    opacity: .3;
    transition: .5s var(--timing-function_default);
    z-index: 1
}

.modal-close:hover {
    opacity: 1
}

.modal-close__icon {
    display: block;
    width: 100%;
    height: 100%
}

@media (max-width:1600px) {
    .modal-close {
        width: 60px;
        height: 60px;
        top: 5vh;
        right: 35px
    }
}

@media (max-width:1400px) {

    .modal,
    .modal-container,
    .modal::before {
        width: 100%;
        height: 100%
    }

    .modal::before {
        top: 0;
        animation: unset
    }
}

@media (max-width:1100px) {
    .modal-container {
        padding-top: 70px
    }

    .modal-close {
        position: absolute;
        width: 40px;
        height: 40px;
        top: 15px;
        right: 25px;
        z-index: 0
    }
}

.form {
    display: grid;
    justify-items: center;
    grid-gap: var(--g-15);
    font-size: var(--size-20);
    color: var(--gray-400);
    text-align: left
}

.form-group {
    min-width: calc(var(--g-100)*4.8);
    width: 100%;
    user-select: none
}

.form-group_type-checkbox {
    display: grid;
    grid-template-columns: auto auto auto;
    justify-content: left;
    justify-items: left;
    align-items: center;
    grid-gap: 8px;
    opacity: 1;
    transition: .7s var(--timing-function_default)
}

.form-group_type-checkbox:hover {
    opacity: .7;
    cursor: pointer
}

.form-group_type-checkbox:hover * {
    cursor: pointer
}

.form-group__row {
    display: grid;
    grid-template-columns: 1fr minmax(50px, var(--g-75));
    grid-gap: var(--g-10)
}

.form-group__row-btn {
    display: grid;
    justify-items: center;
    align-items: center;
    height: 100%;
    padding: var(--g-10);
    width: var(--g-75);
    min-width: 50px
}

.form-group__icon {
    display: block;
    background: var(--icon-url) no-repeat center;
    background-size: contain;
    width: 100%;
    height: 100%
}

.form-group__icon_type-eye {
    --icon-url: url("../img/icon/form/eye.svg")
}

.form-group__icon_type-eye-strike {
    --icon-url: url("../img/icon/form/eye-strike.svg")
}

.form-group__icon_type-lightning {
    --icon-url: url("../img/icon/form/lightning.svg")
}

.form-group__info {
    display: block;
    font-style: italic;
    font-size: var(--size-14);
    color: var(--gray-400);
    margin-top: 5px
}

.form-group__info_style-success {
    color: var(--green-600)
}

.form-group__info_style-danger {
    color: var(--pink-500)
}

.form-actions {
    width: 100%;
    margin: var(--g-10)0 0;
    text-align: center
}

.form-actions__btn {
    width: 100%;
    text-align: left
}

.tooltip {
    --background: var(--black);
    --font-size: var(--size-16);
    --padding: var(--g-15) var(--g-25);
    --after-size: 20px;
    --width: 420px;
    position: relative
}

.tooltip_style-steel {
    --background: var(--steel)
}

.tooltip_style-dark-gray {
    --background: var(--gray-800)
}

.tooltip_size-lg {
    --font-size: var(--size-18);
    --padding: 18px var(--g-30);
    --after-size: var(--g-25);
    --width: 480px
}

.tooltip_size-sm {
    --font-size: var(--size-14);
    --padding: var(--g-12) var(--g-20);
    --after-size: var(--g-15)
}

.tooltip_size-xs {
    --font-size: var(--size-12);
    --padding: 8px var(--g-15);
    --after-size: var(--g-12)
}

.tooltip-wrapper:hover,
.tooltip:hover .tooltip-wrapper {
    opacity: 1;
    transform: translateY(-10px) scale(1)
}

.tooltip-wrapper {
    position: absolute;
    width: var(--width);
    left: calc((420px - 100%)/-2);
    bottom: 100%;
    opacity: 0;
    transition: .2s var(--timing-function_default);
    transform: translateY(0) scale(0);
    transform-origin: center bottom;
    will-change: transform, opacity;
    text-align: center;
    z-index: 10
}

.tooltip-wrapper__content {
    position: relative;
    display: inline-block;
    border-radius: var(--g-25);
    background: var(--background);
    font-weight: 500;
    font-size: var(--font-size);
    line-height: 1.4;
    color: var(--white_alpha-90);
    padding: var(--padding);
    box-shadow: 0 25px 35px -25px var(--black)
}

.tooltip-wrapper__content::after {
    content: "";
    display: block;
    position: absolute;
    border-radius: 0 0 4px 0;
    background: var(--background);
    width: var(--after-size);
    height: var(--after-size);
    margin: auto;
    top: calc(100% - var(--after-size)/2);
    left: 0;
    right: 0;
    transform: rotate(45deg);
    z-index: 1
}

.preloader {
    display: grid;
    justify-content: center;
    align-items: center;
    width: 100vw;
    height: 90vh;
    box-shadow: inset 0 0 0 150px #f5f5f5
}

.preloader-wrapper {
    display: grid;
    grid-template-columns: repeat(3, auto);
    grid-gap: var(--g-15);
    animation: 2100ms infinite linear;
    transform-origin: center;
    text-align: center
}

.preloader-item {
    --animation-duration: .8s;
    width: 110px;
    margin: 0 var(--g-15);
    opacity: .3;
    animation: preloader-item_transform var(--animation-duration) infinite ease-in-out;
    transform-origin: center;
    will-change: transform, opacity
}

.preloader-item_child-2 {
    animation-delay: calc(var(--animation-duration)/4)
}

.preloader-item_child-3 {
    animation-delay: calc(var(--animation-duration)/4*2)
}

.badge {
    display: inline-block;
    border-radius: 100px;
    background: var(--gray-400);
    line-height: 1.4;
    font-weight: 600;
    font-size: var(--size-16);
    color: var(--white);
    padding: var(--g-4) var(--g-15);
    vertical-align: middle;
    user-select: none
}

.badge_type-newbie {
    background: var(--black)
}

.badge_type-pro {
    background: var(--aqua-700)
}

.badge_type-vip {
    background: var(--green-550)
}

.badge_type-gold,
.badge_type-premium {
    background: var(--orange-400)
}

.badge_type-elite,
.badge_type-grand {
    background: var(--blue-450)
}

.badge_type-deluxe {
    background: var(--violet-300)
}

.badge_type-mod {
    background: var(--red-600)
}

.badge_type-truemod {
    background: var(--red)
}

.badge_type-newmoder {
    background: var(--green-600)
}

.badge_type-moder {
    background: var(--green-700)
}

.badge_type-grandmoder {
    background: var(--blue-450)
}

.badge_type-support {
    background: var(--purple-600)
}

.badge_type-admin {
    background: var(--red)
}

.badge_style-light {
    background: var(--white);
    color: var(--black_alpha-90)
}

.badge_style-secondary {
    background: var(--gray-50);
    color: var(--gray-400)
}

.badge_style-dark {
    background: var(--white_alpha-10);
    color: var(--gray-400)
}

.badge_style-primary {
    background: linear-gradient(to top, var(--blue-saturate-500), var(--blue-450));
    color: var(--white)
}

.badge_style-success {
    background: linear-gradient(to right, var(--yellow-300), var(--green-550));
    color: var(--black_alpha-70);
    box-shadow: -20px -10px 35px var(--yellow-300_alpha-40), 20px 10px 35px var(--green-550_alpha-40)
}

.badge_size-xs {
    padding: 2px var(--g-8);
    font-size: var(--size-11)
}

.badge_size-sm {
    padding: var(--g-5) var(--g-20);
    font-size: var(--size-20)
}

.badge_size-md {
    padding: var(--g-5) var(--g-25);
    font-size: var(--size-32)
}

.badge_size-lg {
    padding: var(--g-5) var(--g-30);
    font-size: var(--size-36)
}

.badge_size-xxl {
    padding: var(--g-10) var(--g-50);
    font-size: var(--size-64)
}

.badge_effect-rotate {
    animation: badge_effect-rotate 3s ease-out infinite;
    transform-origin: center;
    will-change: transform
}

.privilege {
    --bg-color-1: var(--white);
    --bg-color-2: var(--gray-400);
    background: var(--bg-color-1) linear-gradient(0, var(--bg-color-2), var(--bg-color-1) 135%)
}

.privilege_style-newbie {
    --bg-color-1: var(--white);
    --bg-color-2: var(--steel-400)
}

.privilege_style-pro {
    --bg-color-1: var(--blue-250);
    --bg-color-2: var(--aqua-700)
}

.privilege_style-vip {
    --bg-color-1: var(--yellow-300);
    --bg-color-2: var(--green-550)
}

.privilege_style-gold,
.privilege_style-premium {
    --bg-color-1: var(--yellow-300);
    --bg-color-2: var(--orange-400)
}

.privilege_style-elite,
.privilege_style-grand {
    --bg-color-1: var(--aqua-300);
    --bg-color-2: var(--blue-saturate-500)
}

.privilege_style-deluxe {
    --bg-color-1: var(--purple-300);
    --bg-color-2: var(--violet-300)
}

.privilege_style-mod {
    --bg-color-1: var(--purple-300);
    --bg-color-2: var(--pink-500)
}

.privilege_style-truemod {
    --bg-color-1: var(--orange-400);
    --bg-color-2: var(--pink-500)
}

.privilege_invert-true {
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.emoji {
    display: inline-block;
    width: calc(var(--size-24) + var(--g-20));
    height: calc(var(--size-24) + var(--g-20));
    vertical-align: bottom;
    user-select: none
}

.emoji_size-lg {
    width: calc(var(--size-24) + var(--g-30));
    height: calc(var(--size-24) + var(--g-30))
}

.currency {
    --size: var(--size-36);
    display: inline-block;
    background: url(/templates/ExcaliburCraft/lk_img/ex_coin_rub.png)no-repeat center;
    background-size: contain;
    width: var(--size);
    height: var(--size);
    margin: calc(var(--size)/-8) calc(var(--size)/-18)0;
    vertical-align: middle
}

.currency_offset {
    margin: -4px 0
}

.currency_size-18 {
    --size: var(--size-18)
}

.currency_size-20 {
    --size: var(--size-20)
}

.currency_size-24 {
    --size: var(--size-24)
}

.currency_size-32 {
    --size: var(--size-32)
}

.currency_size-40 {
    --size: var(--size-40)
}

.currency_size-48 {
    --size: var(--size-48)
}

.currency_size-64 {
    --size: var(--size-64)
}

.currency_size-80 {
    --size: var(--size-80)
}

.animated-background {
    position: absolute;
    width: 100vw;
    height: 100vh;
    top: 0;
    left: 0;
    overflow: hidden;
    z-index: -1
}

.animated-background::after {
    content: "";
    display: block;
    position: absolute;
    background: linear-gradient(transparent, var(--white) 80%);
    width: 100%;
    height: 20vh;
    left: 0;
    bottom: 0
}

.animated-background__column {
    display: grid;
    justify-items: center;
    grid-gap: 20vh;
    position: absolute;
    width: calc(var(--g-45)*10);
    height: 100%;
    top: 0;
    animation: animated-background__column 35s linear infinite;
    will-change: transform, opacity
}

.animated-background__column_position-left {
    left: -50px
}

.animated-background__column_position-right {
    right: -50px
}

.animated-background__column_direction_reverse {
    animation-direction: reverse
}

.animated-background__item {
    --animation-duration: 35s;
    width: 100%;
    opacity: .1;
    animation: animated-background__item var(--animation-duration) linear infinite;
    transform-origin: center;
    will-change: transform
}

.animated-background__item_duration-20 {
    --animation-duration: 20s
}

.animated-background__item_duration-25 {
    --animation-duration: 25s
}

.animated-background__item_duration-30 {
    --animation-duration: 30s
}

.animated-background__item_direction_reverse {
    animation-direction: reverse
}

.animated-background__item_size-450px {
    max-width: 450px
}

.animated-background__item_size-360px {
    max-width: 360px
}

.animated-background__item_size-320px {
    max-width: 320px
}

.animated-background__item_size-280px {
    max-width: 280px
}

@media (max-width:768px) {
    .animated-background__column {
        width: calc(var(--g-35)*10)
    }

    .animated-background__column_position-left {
        left: -15vw
    }

    .animated-background__column_position-right {
        right: -15vw
    }
}

@media (max-width:360px) {
    .animated-background {
        width: 100%
    }
}

.animated-ellipsis::before {
    content: "";
    animation: animated-ellipsis 1.2s linear infinite
}

.snow-animation {
    --duration-step: 30s;
    display: block;
    position: absolute;
    background: url(../img/update-december-2023/header/snow-1.png)left bottom;
    width: 400vw;
    height: 400vw;
    left: 0;
    bottom: 0;
    animation: snow-animation calc(var(--duration-step)*2) linear infinite;
    pointer-events: none;
    will-change: transform, opacity;
    z-index: 3
}

.snow-animation_alt-1 {
    background-image: url(../img/update-december-2023/header/snow-2.png);
    animation-duration: calc(var(--duration-step)*3)
}

.snow-animation_alt-2 {
    background-image: url(../img/update-december-2023/header/snow-3.png);
    animation-duration: calc(var(--duration-step)*4)
}

.snow-animation_duration-step-10 {
    --duration-step: 10s
}

@media (max-width:540px) {
    .snow-animation {
        --duration-step: 5s
    }
}

.background_style-black {
    background: var(--black)
}

.text-96 {
    font-size: var(--size-96) !important
}

.text-80 {
    font-size: var(--size-80) !important
}

.text-72 {
    font-size: var(--size-72) !important
}

.text-64 {
    font-size: var(--size-64) !important
}

.text-48 {
    font-size: var(--size-48) !important
}

.text-40 {
    font-size: var(--size-40) !important
}

.text-36 {
    font-size: var(--size-36) !important
}

.text-32 {
    font-size: var(--size-32) !important
}

.text-24 {
    font-size: var(--size-24) !important
}

.text-20 {
    font-size: var(--size-20) !important
}

.text-18 {
    font-size: var(--size-18) !important
}

.text-16 {
    font-size: var(--size-16) !important
}

.text-14 {
    font-size: var(--size-14) !important
}

.text-12 {
    font-size: var(--size-12) !important
}

.text-11 {
    font-size: var(--size-11) !important
}

.color-white {
    color: #fff
}

.color-white-90 {
    color: var(--white_alpha-90)
}

.color-white-80 {
    color: var(--white_alpha-80)
}

.color-white-70 {
    color: var(--white_alpha-70)
}

.color-white-60 {
    color: var(--white_alpha-60)
}

.color-white-50 {
    color: var(--white_alpha-50)
}

.color-white-40 {
    color: var(--white_alpha-40)
}

.color-white-30 {
    color: var(--white_alpha-30)
}

.color-white-20 {
    color: var(--white_alpha-20)
}

.color-white-10 {
    color: var(--white_alpha-10)
}

.color-white-05 {
    color: var(--white_alpha-5)
}

.color-black {
    color: #1d1d1f
}

.color-black-90 {
    color: var(--black_alpha-90)
}

.color-black-80 {
    color: var(--black_alpha-80)
}

.color-black-70 {
    color: var(--black_alpha-70)
}

.color-black-60 {
    color: var(--black_alpha-60)
}

.color-black-50 {
    color: var(--black_alpha-50)
}

.color-black-40 {
    color: var(--black_alpha-40)
}

.color-black-30 {
    color: var(--black_alpha-30)
}

.color-black-20 {
    color: var(--black_alpha-20)
}

.color-black-10 {
    color: var(--black_alpha-10)
}

.color-black-05 {
    color: var(--black_alpha-5)
}

.color-alpha-10 {
    opacity: .1
}

.color-alpha-15 {
    opacity: .15
}

.color-alpha-20 {
    opacity: .2
}

.color-alpha-25 {
    opacity: .25
}

.color-alpha-30 {
    opacity: .3
}

.color-alpha-40,
.inner-nav_style-pinned .inner-nav__card_checked-true .inner-nav__card-icon {
    opacity: .4
}

.color-alpha-50 {
    opacity: .5
}

.color-alpha-60 {
    opacity: .6
}

.color-alpha-70 {
    opacity: .7
}

.color-alpha-80 {
    opacity: .8
}

.color-alpha-90 {
    opacity: .9
}

.color-contrast-blue {
    color: #3d44c3
}

.color-contrast-red {
    color: #df2201
}

.color-contrast-orange {
    color: #ed5808
}

.color-contrast-green {
    color: #0c9d46
}

.color-contrast-aqua {
    color: #027fff
}

.color-contrast-pink {
    color: #d5308f
}

.color-contrast-purple {
    color: #a753d3
}

.color-contrast-violet {
    color: #7465d7
}

.color-gradient-green {
    background: linear-gradient(to right, #ff5, #5f5);
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent
}

.color-gradient-blue {
    background: linear-gradient(to right, #5ff, #07f)
}

.color-gradient-blue,
.color-gradient-pink,
.color-gradient-violet {
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent
}

.color-gradient-pink {
    background: linear-gradient(135deg, #faff00, #f5f, #d601e9)
}

.color-gradient-violet {
    background: linear-gradient(to right, #f5f, #6d2fc3)
}

.color-gradient-orange {
    background: linear-gradient(to right, #ffa42a, #ff3600)
}

.color-gradient-cyan,
.color-gradient-gold,
.color-gradient-orange {
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent
}

.color-gradient-gold {
    background: linear-gradient(to right, #faff00, #ffa42a)
}

.color-gradient-cyan {
    background: linear-gradient(to right, #54c7cb, #085f5f)
}

.middle {
    overflow: hidden
}

.wrapper {
    width: 100%;
    max-width: 1400px;
    margin: 0 auto
}

@media (max-width:1400px) {
    .wrapper {
        max-width: 1200px;
        padding: 0 15px
    }
}

.sided-display {
    position: relative
}

.sided-display__card {
    position: absolute;
    background: var(--purple-700) linear-gradient(135deg, var(--pink-500), var(--purple-700));
    height: 100%;
    width: calc((100vw - 100%)/2);
    top: 0;
    overflow: hidden
}

.sided-display__card-image {
    display: block;
    object-fit: cover;
    object-position: center;
    width: 100%;
    height: 100%
}

.sided-display__card_align-left {
    border-radius: 0 35px 35px 0;
    right: 100%
}

.sided-display__card_align-right {
    border-radius: 35px 0 0 35px;
    left: 100%
}

@media (max-width:460px) {
    .sided-display__card {
        display: none
    }
}

.inner {
    position: relative;
    border-radius: var(--g-75) var(--g-75)0 0;
    background: var(--black);
    padding: calc(var(--g-100)*1.8)0 calc(var(--g-100)*2.5)
}

.inner_style-blue {
    background: var(--black) radial-gradient(var(--blue-450_alpha-30), transparent 65%) no-repeat center -150vh;
    background-size: 100vw 300vh
}

.inner_style-gold {
    background: var(--black) radial-gradient(var(--orange-400_alpha-30), transparent 65%) no-repeat center -150vh;
    background-size: 100vw 300vh
}

.inner_background-blue {
    background: var(--black) linear-gradient(160deg, transparent 15%, var(--blue-450_alpha-20), transparent 65%) no-repeat
}

.inner_background-green {
    background: var(--black) linear-gradient(160deg, transparent 15%, var(--green-300_alpha-10), transparent 65%) no-repeat
}

.inner_cover-rules {
    background: var(--black)url(../img/rules/cover.jpg)no-repeat center top;
    background-size: 100%auto
}

.inner_shadow_style-1 {
    box-shadow: 0 0 150px 0 var(--white_alpha-20)
}

.inner_alt {
    margin-bottom: -75px
}

.inner_alt::after {
    display: none !important
}

.inner::after {
    content: "";
    display: block;
    position: absolute;
    border-radius: 70px 70px 0 0;
    background: var(--white);
    height: 70px;
    width: 100%;
    left: 0;
    bottom: 0
}

.inner p {
    font-weight: 500;
    line-height: 1.5
}

.inner-heading {
    font-weight: 600;
    font-size: var(--size-72);
    color: var(--white);
    text-align: center
}

.inner-paragraph {
    font-size: var(--size-32);
    color: var(--gray-400)
}

.inner-paragraph:not(:first-of-type) {
    margin-top: var(--g-35)
}

.inner-paragraph_align-center {
    text-align: center
}

.inner-nav {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    grid-gap: var(--g-10);
    margin-top: var(--g-15);
    transition: .3s ease-in-out
}

.inner-nav_style-pinned {
    position: fixed;
    background: var(--black_alpha-70);
    -webkit-backdrop-filter: blur(25px);
    backdrop-filter: blur(25px);
    margin: 0;
    padding: var(--g-15) calc((100vw - 1400px)/2);
    top: 0;
    left: 0;
    opacity: 0;
    transform: translateY(-100px);
    will-change: opacity, transforn;
    pointer-events: none;
    z-index: 10
}

.inner-nav_style-pinned .inner-nav__card {
    padding: var(--g-15) var(--g-20);
    font-size: var(--size-14);
    color: var(--gray-200);
    text-align: left
}

.inner-nav_style-pinned .inner-nav__card_checked-true {
    background: var(--blue-450);
    color: var(--white)
}

.inner-nav_style-pinned .inner-nav__card-icon {
    position: absolute;
    opacity: .2;
    right: 0;
    z-index: -1
}

.inner-nav_style-pinned_show-true {
    opacity: 1;
    transform: translateY(0);
    pointer-events: all
}

.inner-nav_style-wide {
    grid-template-columns: repeat(3, 1fr)
}

.inner-nav__item {
    display: block;
    height: 100%
}

.inner-nav__card {
    display: grid;
    align-items: center;
    justify-items: center;
    grid-gap: var(--g-5);
    position: relative;
    border-radius: var(--g-15);
    background: var(--white_alpha-10);
    -webkit-backdrop-filter: blur(25px);
    backdrop-filter: blur(25px);
    line-height: 1.4;
    font-size: var(--size-16);
    color: var(--white);
    padding: var(--g-20) var(--g-15);
    height: 100%;
    width: 100%;
    text-align: center;
    overflow: hidden
}

.inner-nav__card_style-wide {
    grid-auto-flow: column;
    justify-content: center;
    padding: var(--g-5) var(--g-15);
    text-align: left
}

.inner-nav__card_style-filler {
    background: var(--white_alpha-5)
}

.inner-nav__card_style-active {
    background: var(--white);
    pointer-events: none
}

.inner-nav__card-order {
    position: absolute;
    font-weight: 500;
    font-size: calc(var(--size-64)*2);
    line-height: .725;
    color: var(--white_alpha-20);
    left: 0;
    bottom: 0;
    z-index: -1
}

.inner-nav__card-icon {
    width: calc(var(--g-40)*2);
    height: calc(var(--g-40)*2)
}

.inner-nav__card-img {
    width: 100%;
    max-height: var(--g-50);
    object-fit: contain
}

.inner-section {
    border: calc(var(--g-30)/10) solid var(--white_alpha-20);
    border-radius: var(--g-50);
    margin-top: var(--g-50);
    padding: var(--g-50)
}

.inner-section__heading {
    font-weight: 600;
    font-size: var(--size-36);
    color: var(--white)
}

.inner-section__paragraph {
    max-width: 810px;
    font-size: var(--size-20);
    color: var(--gray-400);
    margin-top: var(--g-5)
}

.inner-section__list {
    margin-top: var(--g-20)
}

.inner-section__list-item {
    display: grid;
    grid-template-columns: var(--g-50) 1fr;
    align-items: start;
    grid-gap: var(--g-20);
    border-radius: var(--g-25);
    padding: var(--g-35)
}

.inner-section__list-item:nth-child(odd) {
    background: var(--white_alpha-5)
}

.inner-section__list-item:nth-child(n+10) {
    grid-template-columns: var(--g-60) 1fr
}

.inner-section__list-item__point {
    font-size: var(--size-32)
}

.inner-section__list-item__content {
    display: grid;
    align-items: center;
    grid-gap: var(--g-10);
    position: relative;
    height: 100%
}

.inner-section__list-item__content_style-danger {
    background: var(--red-600_alpha-20);
    box-shadow: 0 0 25px 25px var(--red-600_alpha-20);
    z-index: 0
}

.inner-section__list-item__content-list {
    --item-color: var(--gray-200);
    display: grid;
    grid-gap: var(--g-10)
}

.inner-section__list-item__content-list_style-secondary {
    --item-color: var(--gray-400)
}

.inner-section__list-item__content-list__item {
    display: grid;
    grid-gap: var(--g-5);
    position: relative;
    padding-left: var(--g-30)
}

.inner-section__list-item__content-list__item::before {
    content: "";
    display: block;
    position: absolute;
    background: var(--item-color);
    width: var(--g-20);
    height: 2px;
    left: 0;
    top: calc(var(--g-10)*1.1)
}

.inner-section__list-item__paragraph {
    position: relative;
    color: var(--gray-200);
    font-size: var(--size-16);
    z-index: 1
}

.inner-section__list-item__paragraph_style-secondary {
    color: var(--gray-400)
}

.inner-section__list-item__paragraph_style-danger {
    color: var(--red-200);
    text-shadow: 25px 0 35px var(--red-600), -25px 0 35px var(--red-600), 0 0 35px var(--red-600)
}

.inner-section__list-item__paragraph_style-danger::before {
    display: block;
    position: absolute;
    background: var(--red-600);
    height: calc(100% - 30px);
    width: 100%;
    top: 15px;
    left: 0;
    opacity: .2;
    box-shadow: 0 0 50px 25px var(--red-600), 0 0 25px 25px var(--red-600);
    z-index: 0
}

.inner__return-link {
    display: inline-grid;
    grid-template-columns: auto auto;
    justify-content: center;
    justify-items: center;
    align-items: center;
    grid-gap: var(--g-10);
    border: 3px solid var(--white_alpha-20);
    border-radius: 50px;
    font-size: var(--size-24);
    color: var(--gray-300);
    min-width: 100%;
    margin: var(--g-50) auto 0;
    padding: var(--g-25) var(--g-75);
    transition: .6s var(--timing-function_default);
    transform: scale(1);
    transform-origin: center;
    text-align: center
}

.inner__return-link:hover {
    border-color: var(--white_alpha-50);
    color: var(--white);
    min-width: 0;
    transform: scale(1.3)
}

.inner__return-link__icon {
    width: 32px
}

@media (max-width:992px) {

    .inner,
    .inner::after {
        border-radius: var(--g-75) var(--g-75)0 0
    }

    .inner::after {
        height: var(--g-75)
    }

    .inner-nav {
        grid-template-columns: repeat(4, 1fr)
    }

    .inner-nav_style-pinned {
        width: 100%;
        padding: var(--g-15)
    }

    .inner-nav_style-wide {
        grid-template-columns: repeat(2, 1fr)
    }

    .inner-nav__item:nth-child(3) .inner-nav__card_style-filler {
        display: none
    }
}

@media (max-width:576px) {
    .inner-section__list-item {
        grid-template-columns: auto !important;
        justify-content: start;
        justify-items: start
    }
}

.banner {
    --background-color: var(--blue-saturate-500);
    --mark-color: var(--blue-250);
    padding: var(--g-20) var(--g-35)
}

.banner_style-green {
    --background-color: var(--green-600);
    --mark-color: var(--green-300)
}

.banner_style-red {
    --background-color: var(--red-400);
    --mark-color: var(--red-200)
}

.banner_style-purple {
    --background-color: var(--purple-600);
    --mark-color: var(--pink-200)
}

.banner_style-pink {
    --background-color: var(--pink-500);
    --mark-color: var(--pink-200)
}

.banner-container {
    display: block;
    position: relative;
    border-radius: 255px;
    background: var(--background-color);
    max-width: 100%;
    padding: var(--g-15)0;
    margin: auto;
    box-shadow: 0 0 75px -15px var(--background-color);
    overflow: hidden
}

.banner-container:hover {
    max-width: 89%
}

.banner-container__content {
    display: grid;
    grid-auto-flow: column;
    justify-content: center;
    align-items: center;
    grid-gap: var(--g-25);
    position: relative;
    z-index: 1
}

.banner-container__content-info {
    font-weight: 700;
    font-size: var(--size-32);
    color: var(--white)
}

.banner-container__content-info__mark {
    display: inline-block;
    border-radius: 10px;
    background: var(--black);
    color: var(--mark-color);
    padding: var(--g-5) var(--g-15);
    transform: rotate(-5deg);
    animation: banner-container__content-info__mark 3s linear infinite;
    transform-origin: center;
    will-change: opacity, transform
}

.banner-container__rays {
    display: block;
    position: absolute;
    width: 100vw;
    height: 100vw;
    top: -45vw;
    left: calc(50% - 50vw);
    opacity: .2;
    animation: rays 35s linear infinite;
    transform-origin: center;
    will-change: opacity, transform
}

@media (max-width:576px) {
    .banner-container {
        border-radius: 8px
    }
}

.nav {
    display: grid;
    grid-auto-flow: column;
    justify-content: space-between;
    align-items: center;
    padding: var(--g-50) calc((100vw - 1400px)/2);
    margin: auto;
    width: 100%
}

.nav__logo {
    opacity: 1;
    transition: .3s var(--timing-function_default)
}

.nav__logo img {
    max-height: var(--g-75);
    max-width: calc(var(--g-60)*4);
    width: 100%
}

.nav__logo:hover {
    opacity: .6
}

.nav__logo:active {
    opacity: .4
}

.nav__list {
    display: grid;
    grid-auto-flow: column;
    justify-items: center;
    grid-gap: var(--g-50)
}

.nav__list_grid-socials {
    grid-gap: var(--g-15)
}

.nav__list-item__link {
    --social-opacity: 0;
    display: block;
    position: relative;
    font-weight: 500;
    font-size: var(--size-18);
    color: var(--gray-400);
    opacity: 1;
    transition: .3s var(--timing-function_default);
    cursor: pointer
}

.nav__list-item__link:hover {
    --social-opacity: 1
}

.nav__list-item__link:active {
    --social-opacity: .4
}

.nav__list-item__link_marked {
    font-weight: 800;
    color: var(--orange-400)
}

.nav__list-item__link_marked::before {
    content: "";
    display: block;
    position: absolute;
    background: radial-gradient(ellipse at 50%, var(--orange-400)0, transparent 65%);
    width: var(--g-150);
    height: 180px;
    top: calc((180px - 100%)/-2);
    left: calc((var(--g-150) - 100%)/-2);
    animation: nav__list-item__link_marked_opacity 1s ease-in-out infinite;
    will-change: opacity;
    opacity: .3;
    z-index: 0
}

.nav__list-item__link_marked__icon {
    display: block;
    position: absolute;
    width: var(--size-40);
    margin: auto;
    left: 0;
    right: 0;
    bottom: 150%;
    animation: nav__list-item__link_marked__icon 4s ease-in-out infinite;
    transform-origin: center bottom;
    will-change: transform
}

.nav__list-item__link_hovered:hover {
    opacity: .6
}

.nav__list-item__link_hovered:active {
    opacity: .4
}

.nav__list-item__link-social {
    height: var(--g-30);
    pointer-events: none
}

.nav__list-item__link-social_hovered {
    position: absolute;
    top: 0;
    left: 0;
    opacity: var(--social-opacity);
    transition: .3s var(--timing-function_default);
    will-change: opacity
}

.nav__panel {
    display: grid;
    grid-auto-flow: column;
    grid-gap: var(--g-25);
    align-items: center
}

.nav__panel-avatar {
    position: relative;
    width: calc(var(--g-100)*1.1);
    margin: 0 5px 0 0
}

.nav__panel-avatar::before {
    content: "";
    background: linear-gradient(to bottom, transparent 60%, var(--gray-50_alpha-50) 75%, var(--gray-50_alpha-90) 90%, var(--gray-50) 95%);
    height: 60px;
    z-index: 1
}

.nav__panel-avatar::before,
.nav__panel-avatar__image {
    position: absolute;
    display: block;
    width: 100%;
    left: 0;
    bottom: calc(var(--g-25)*-1)
}

.nav__panel-user {
    display: grid;
    grid-template-columns: repeat(3, auto);
    align-items: center;
    grid-gap: var(--g-10);
    line-height: var(--g-30);
    padding: var(--g-15) var(--g-25)
}

.nav__menu {
    display: none;
    position: fixed;
    right: 15px;
    top: 25px;
    z-index: 10
}

.nav__menu-icon {
    display: inline-block;
    object-fit: contain;
    width: calc(var(--font-size)*var(--width-multiplier));
    height: calc(var(--font-size)*var(--height-multiplier));
    vertical-align: bottom;
    margin-left: auto
}

@media (max-width:1600px) {

    .nav__list,
    .nav__panel {
        grid-gap: var(--g-20)
    }
}

@media (max-width:1400px) {
    .nav {
        padding: var(--g-50) 15px
    }
}

@media (max-width:900px) {
    .nav__list_grid-socials {
        display: none
    }
}

@media (max-width:700px) {
    .nav__logo img {
        height: 40px
    }

    .nav__list,
    .nav__panel {
        display: none
    }

    .nav__menu {
        display: block
    }
}

.header {
    min-height: calc(100vh - 170px)
}

.header-content {
    display: grid;
    grid-template-columns: 660px 1fr;
    align-items: center;
    grid-gap: var(--g-50)
}

.header-content__greeting-title {
    background: var(--pink-500) linear-gradient(90deg, var(--pink-500), var(--purple-600), var(--purple-700));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 600;
    font-size: var(--size-80);
    line-height: 1;
    padding: 0 0 var(--g-10)
}

.header-content__greeting-about {
    font-weight: 500;
    font-size: var(--size-24);
    line-height: 1.5;
    color: var(--gray-400);
    max-width: 450px;
    width: 100%;
    margin: var(--g-15)0 0
}

.header-content__greeting-action {
    display: grid;
    grid-auto-flow: column;
    grid-gap: var(--g-25);
    justify-content: start;
    align-items: center;
    margin: var(--g-35)0 0;
    text-align: left
}

.header-content__greeting-action__status {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-gap: var(--g-10);
    align-items: center
}

.header-content__greeting-action__status-bar {
    display: grid;
    justify-items: center;
    align-items: center;
    position: relative;
    border-radius: 50%;
    background: var(--green-300_alpha-10);
    width: 50px;
    height: 50px
}

.header-content__greeting-action__status-bar::after,
.header-content__greeting-action__status-bar::before {
    --color-start: var(--green-300);
    --color-end: var(--yellow-100);
    content: "";
    display: block;
    border-radius: 50%
}

.header-content__greeting-action__status-bar::before {
    position: absolute;
    background: var(--green-300);
    opacity: .3;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    animation: header__content-action__status-bar 1s ease-in-out infinite;
    z-index: 0
}

.header-content__greeting-action__status-bar::after {
    --color-start: var(--yellow-100);
    --color-end: var(--green-300);
    position: relative;
    background: var(--green-300) linear-gradient(0, var(--color-start), var(--color-end)) center center;
    background-size: 150% 150%;
    width: 20px;
    height: 20px;
    z-index: 1
}

.header-content__greeting-action__status-info {
    font-weight: 500;
    font-size: var(--size-16);
    color: var(--gray-400)
}

.header-content__hero {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    align-items: center;
    grid-gap: var(--g-20);
    position: relative;
    height: 630px
}

.header-content__hero-object {
    position: absolute;
    max-width: 100%;
    top: 0;
    right: 75px
}

.header-content__hero-card {
    --step: -60px;
    --start: 0;
    --end: var(--step);
    border-radius: var(--g-35);
    background: var(--purple-700) linear-gradient(135deg, var(--pink-500), var(--purple-700));
    height: calc(var(--size-48)*10);
    animation: header__hero-card 20s var(--timing-function_default) infinite;
    will-change: transform;
    overflow: hidden
}

.header-content__hero-card_centered {
    --start: var(--step);
    --end: 0;
    transform: translateY(var(--step))
}

.header-content__hero-card__image {
    --start: 1;
    --end: 0;
    display: block;
    position: absolute;
    object-fit: cover;
    object-position: center center;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    animation: header__hero-card__image 20s var(--timing-function_default) infinite
}

.header-content__hero-card__image_pos-left {
    object-position: left center
}

.header-content__hero-card__image_pos-right {
    object-position: right center
}

.header-content__hero-card__image_slide-1 {
    --start: 0;
    --end: 1;
    opacity: 0
}

.header-scrolling {
    display: grid;
    justify-content: center;
    align-items: start;
    position: relative;
    margin: var(--g-15)0 0
}

.header-scrolling__arrow {
    position: absolute;
    object-fit: contain;
    top: var(--g-75);
    left: 0;
    right: 0;
    width: var(--g-30);
    margin: auto;
    animation: header-scrolling__arrow 1s ease-in-out infinite;
    will-change: transform
}

@media (max-width:1400px) {
    .header {
        min-height: unset
    }

    .header-content {
        grid-template-columns: calc(var(--g-75)*10) 1fr;
        grid-gap: 25px
    }

    .header-content__hero {
        padding: var(--g-50)0;
        height: unset
    }

    .header-content__hero-card {
        height: calc(var(--size-36)*10)
    }

    .header-content__hero-object {
        max-height: 460px
    }
}

@media (max-width:992px) {
    .header-content {
        grid-template-columns: 1fr;
        justify-content: center;
        justify-items: center;
        grid-gap: 75px;
        text-align: center
    }

    .header-content__greeting-about {
        margin-right: auto;
        margin-left: auto
    }

    .header-content__greeting-action {
        justify-content: center;
        justify-items: center
    }

    .header-content__hero {
        max-width: calc(var(--size-96)*10);
        width: 100%
    }

    .header-content__hero-card {
        height: calc(var(--size-48)*10)
    }

    .header-scrolling {
        margin-top: var(--g-60)
    }

    .header-scrolling__arrow {
        top: var(--g-150)
    }
}

@media (max-width:576px) {
    .header-content__hero-object {
        top: unset;
        bottom: -10%;
        right: 0
    }
}

.pricing {
    padding: var(--g-50)0 var(--g-150)
}

.pricing-heading {
    font-weight: 600;
    font-size: var(--size-72);
    color: var(--gray-800);
    margin: 0 0 var(--g-25);
    text-align: center
}

.pricing-list {
    margin: 0
}

.pricing-list li {
    position: relative;
    padding: var(--g-5)
}

.pricing-list__card {
    --bg-color-1: transparent;
    --bg-color-2: transparent;
    --icon-size: calc(var(--g-100) * 2);
    --bg-sale: var(--pink-500_alpha-40);
    display: grid;
    justify-items: center;
    justify-content: center;
    grid-gap: var(--g-25);
    position: relative;
    border-radius: var(--g-20);
    background: var(--black) radial-gradient(var(--bg-color-1), var(--bg-color-2) 65%) center bottom;
    background-size: 200% 200%;
    font-size: var(--size-24);
    padding: var(--g-60) var(--g-25);
    height: 100%;
    width: 100%;
    transform: perspective(1000px) rotateX(0) scale(1);
    transition: .3s var(--timing-function_default);
    will-change: transform, opacity;
    overflow: hidden
}

.pricing-list__card:hover {
    transform: perspective(1000px) rotateX(4deg) scale(1.15);
    z-index: 1
}

.pricing-list__card:active {
    transform: perspective(1000px) rotateX(-4deg) scale(1)
}

.pricing-list__card_alt {
    --icon-size: calc(var(--g-100) * 3)
}

.pricing-list__card_style-pro {
    --bg-color-1: var(--aqua-700_alpha-30)
}

.pricing-list__card_style-vip {
    --bg-color-1: var(--green-300_alpha-20)
}

.pricing-list__card_style-gold {
    --bg-color-1: var(--orange-400_alpha-30)
}

.pricing-list__card_style-grand {
    --bg-color-1: var(--blue-450_alpha-30)
}

.pricing-list__card_style-deluxe {
    --bg-color-1: var(--purple-300_alpha-30)
}

.pricing-list__card_style-mod {
    --bg-color-1: var(--red-600_alpha-70)
}

.pricing-list__card_style-truemod {
    background: radial-gradient(var(--red-600_alpha-80), transparent 65%) left bottom, radial-gradient(var(--orange-400_alpha-70), transparent 65%) right bottom, var(--black);
    background-size: 200% 200%, 200% 200%;
    --bg-sale: var(--black)
}

.pricing-list__card-column {
    display: grid;
    justify-items: center;
    justify-content: center;
    grid-gap: var(--g-25);
    font-size: var(--size-32)
}

.pricing-list__card-icon {
    width: var(--icon-size)
}

.pricing-list__card-icon_animation-true {
    animation: pricing-list__card-icon 5s ease-in-out infinite
}

.pricing-list__card-heading {
    display: grid;
    justify-items: center;
    grid-gap: var(--g-15);
    font-weight: 600;
    color: var(--white)
}

.pricing-list__card-price {
    font-weight: 500;
    font-size: var(--size-32);
    line-height: 1.6;
    color: var(--white_alpha-40)
}

.pricing-list__card-price__mark {
    display: inline-block;
    font-size: var(--size-40);
    line-height: 1.3;
    color: var(--white_alpha-90);
    vertical-align: top
}

.pricing-list__card-price__strike {
    display: block;
    position: relative;
    opacity: .5
}

.pricing-list__card-price__strike::before {
    content: "";
    display: block;
    position: absolute;
    border-radius: 50px;
    background: var(--pink-500);
    width: 120%;
    height: var(--g-5);
    top: calc((100% - 5px)/2);
    left: -10%;
    transform: rotate(-5deg);
    transform-origin: center;
    z-index: 1
}

.pricing-list__card-price__sale {
    display: block;
    position: relative
}

.pricing-list__card-price__sale::before {
    content: "";
    border-radius: 5px;
    background: var(--bg-sale);
    width: 100%;
    height: 10%;
    top: 45%;
    left: 0;
    box-shadow: 0 0 var(--g-35) var(--g-35) var(--bg-sale);
    animation: cabinet-privileges__card-price__sale 3s linear infinite
}

.pricing-list__card .btn_style-dark {
    box-shadow: inset 0 0 0 2px var(--white_alpha-10)
}

.pricing-list__card-circles,
.pricing-list__card-price__sale::before,
.pricing-list__card-rays {
    display: block;
    position: absolute;
    transform-origin: center;
    will-change: opacity, transform;
    z-index: -1
}

.pricing-list__card-circles {
    border-radius: 50%;
    border: 10px solid var(--violet-300);
    width: 100px;
    height: 100px;
    left: calc(50% - 50px);
    top: calc(30% - 50px);
    animation: cabinet-privileges__card-circles 3s linear infinite;
    box-shadow: inset 0 0 25px 25px var(--violet-300)
}

.pricing-list__card-rays {
    width: 100vw;
    height: 100vw;
    left: calc(50% - 50vw);
    top: calc(30% - 50vw);
    opacity: .05;
    animation: rays 80s linear infinite
}

.pricing-list__card-rays_speed-x2 {
    animation-duration: 30s
}

.cabinet-manage__card::after,
.pricing-list__card-sale {
    display: block;
    position: absolute;
    width: 100%;
    left: 0;
    text-align: center
}

.pricing-list__card-sale {
    border-radius: var(--g-15);
    top: var(--g-20)
}

@media (max-width:1100px) {
    .pricing-list__card {
        align-content: space-between
    }
}

@media (max-width:992px) {
    .pricing-list {
        grid-template-columns: repeat(2, 1fr)
    }

    .pricing-list__card {
        align-content: center;
        align-items: center
    }

    .pricing-list__card_alt {
        --icon-size: 25vw;
        grid-template-columns: 1fr 1fr;
        grid-gap: 0
    }

    .pricing-list__card_alt .pricing-list__card-icon {
        min-width: 180px
    }
}

.donate-header {
    --heading-size: var(--size-48);
    display: grid;
    grid-template-columns: minmax(auto, calc(var(--size-80)*10)) auto;
    position: relative;
    border-radius: var(--g-20);
    transform: perspective(1000px) rotateX(0) scale(1);
    transition: .3s var(--timing-function_default);
    will-change: transform, opacity;
    user-select: none;
    overflow: hidden;
    text-align: left
}

.donate-header_border-radius-false {
    border-radius: 0
}

.donate-header_alt {
    --heading-size: var(--size-96);
    text-align: center
}

.donate-header_hovered-true:hover {
    transform: perspective(1000px) rotateX(5deg) scale(1.15);
    z-index: 1
}

.donate-header_hovered-true:hover .donate-header__arrow {
    opacity: 1;
    transform: translateX(0)
}

.donate-header_hovered-true:active {
    transform: perspective(1000px) rotateX(-5deg) scale(1)
}

.donate-header__heading {
    background: linear-gradient(45deg, var(--black_alpha-70) 15%, var(--black_alpha-20) 85%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    padding: var(--g-60) var(--g-60);
    font-weight: 700;
    font-size: var(--heading-size)
}

.donate-header__heading-small {
    display: block;
    font-weight: 500;
    font-size: 60%
}

.donate-header__cover {
    position: absolute;
    width: calc(var(--size-24)*20);
    right: calc(var(--g-35)*-1);
    top: 0;
    animation: donate-header__cover 5s ease-in-out infinite
}

.donate-header__arrow {
    display: grid;
    align-items: center;
    position: absolute;
    border-radius: 15px;
    background: var(--black);
    padding: var(--g-10) var(--g-25);
    height: 90%;
    right: 10px;
    top: 5%;
    transform: translateX(135px);
    transition: .3s var(--timing-function_default);
    will-change: opacity, transform;
    opacity: 0
}

@media (max-width:480px) {
    .donate-header__cover {
        top: 15%;
        width: calc(var(--size-20)*10)
    }
}

.cabinet-header {
    position: relative;
    border-radius: var(--g-75);
    background: var(--black);
    padding: var(--g-100) 15px;
    margin: 0 auto;
    max-width: 2300px;
    width: calc(100vw - var(--g-100));
    overflow: hidden
}

.cabinet-header__greeting {
    background: var(--white) linear-gradient(to bottom, var(--white), var(--gray-400));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 600;
    font-size: var(--size-72);
    color: var(--white);
    margin: 0 auto var(--g-50);
    text-align: center
}

.cabinet-header__content {
    display: grid;
    grid-template-columns: 900px;
    justify-content: end
}

.cabinet-header__content-privilege {
    display: grid;
    grid-template-columns: 1fr 1fr;
    position: relative;
    border-radius: var(--g-25);
    box-shadow: 50px 0 90px -45px var(--bg-color-2), -50px 0 90px -45px var(--bg-color-2);
    height: 320px;
    padding: var(--g-50);
    transform: perspective(1000px) rotateX(0) scale(1);
    transition: .3s var(--timing-function_default);
    will-change: transform, opacity;
    overflow: hidden;
    z-index: 2
}

.cabinet-header__content-privilege:hover {
    transform: perspective(1000px) rotateX(4deg) scale(1.15);
    z-index: 1
}

.cabinet-header__content-privilege:active {
    transform: perspective(1000px) rotateX(-4deg) scale(1)
}

.cabinet-header__content-privilege__column {
    display: grid;
    justify-items: center;
    justify-content: center;
    align-content: center
}

.cabinet-header__content-privilege__info {
    display: block;
    font-weight: 600;
    font-size: var(--size-32);
    color: var(--black_alpha-70)
}

.cabinet-header__content-privilege__heading {
    border-radius: var(--g-50);
    background: var(--black_alpha-70);
    padding: var(--g-5) var(--g-35);
    margin: var(--g-5)0 var(--g-20);
    text-align: center
}

.cabinet-header__content-privilege__heading-text {
    font-weight: 600;
    font-size: var(--size-72);
    background: var(--bg-color-1) linear-gradient(0, var(--bg-color-2), var(--bg-color-1) 135%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.cabinet-header__content-privilege__icon {
    display: block;
    position: absolute;
    width: calc(var(--g-50)*9.2);
    left: 52%;
    top: 0;
    animation: cabinet-header__content-privilege__icon 5s ease-in-out infinite
}

.cabinet-header__content-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: var(--g-15);
    position: relative;
    margin-top: var(--g-15);
    z-index: 0
}

.cabinet-header__content-card {
    display: grid;
    justify-items: center;
    justify-content: center;
    align-content: end;
    grid-gap: var(--g-45);
    border-radius: var(--g-25);
    border: var(--g-5) solid var(--white_alpha-20);
    background: var(--black);
    padding: var(--g-60) var(--g-15);
    height: 100%
}

.cabinet-header__content-card__heading {
    line-height: 1;
    font-weight: 600;
    font-size: var(--size-32);
    color: var(--white);
    text-align: center
}

.cabinet-header__content-card__heading-mark {
    display: block;
    font-size: var(--size-80);
    color: var(--green-300);
    background: var(--green-300) linear-gradient(to right, var(--yellow-300) 5%, var(--green-550));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    margin-bottom: var(--g-10)
}

.cabinet-header__content-card__skin {
    border-radius: 50%;
    width: calc(var(--g-100)*1.3);
    height: calc(var(--g-100)*1.3);
    background: var(--black_alpha-10);
    filter: drop-shadow(calc(var(--g-25)*-1)0 10px var(--violet-300)) drop-shadow(calc(var(--g-60)*-1)0 15px var(--blue-450)) drop-shadow(var(--g-25)0 10px var(--pink-500)) drop-shadow(var(--g-60)0 15px var(--orange-400));
    transform: scale(1.2);
    transform-origin: center;
    object-fit: cover;
    object-position: center top;
    pointer-events: none;
    -webkit-backdrop-filter: blur(25px);
    backdrop-filter: blur(25px);
    overflow: hidden
}

.cabinet-header__content-exit {
    border-radius: var(--g-25);
    border: var(--g-5) solid var(--white_alpha-20);
    color: var(--gray-400);
    margin-top: var(--g-15)
}

.cabinet-header__skin {
    --img-opacity: 1;
    --control-scale: 0;
    display: block;
    position: absolute;
    bottom: -420px;
    right: 60%;
    z-index: 0
}

.cabinet-header__skin:hover {
    --img-opacity: .5;
    --control-scale: 1
}

.cabinet-header__skin-image {
    opacity: var(--img-opacity);
    transition: opacity var(--timing-function);
    will-change: opacity
}

.cabinet-header__skin-control {
    position: absolute;
    top: 35%;
    left: 25%;
    transform: scale(var(--control-scale))
}

@media (max-width:1400px) {
    .cabinet-header__skin {
        right: 65%
    }
}

@media (max-width:1200px) {
    .cabinet-header {
        width: calc(100% - 30px)
    }

    .cabinet-header__content {
        justify-content: center
    }

    .cabinet-header__skin {
        display: none
    }
}

@media (max-width:992px) {
    .cabinet-header__content {
        grid-template-columns: 1fr
    }

    .cabinet-header__content-privilege {
        height: unset !important
    }
}

@media (max-width:576px) {
    .cabinet-header__content-privilege__column {
        position: relative;
        z-index: 1
    }

    .cabinet-header__content-row {
        grid-template-columns: 1fr
    }

    .cabinet-header__content-card {
        grid-gap: var(--g-25)
    }
}

.cabinet__tab {
    padding: var(--g-50)0;
    text-align: center
}

.cabinet__tab-list {
    display: inline-flex;
    grid-auto-flow: column;
    justify-content: center;
    flex-wrap: wrap;
    grid-gap: var(--g-10);
    border-radius: 150px;
    border: 2px solid var(--black_alpha-15);
    padding: var(--g-10)
}

.cabinet__tab-list__item {
    display: block;
    border-radius: 150px;
    background: var(--gray-50);
    font-weight: 500;
    font-size: var(--size-24);
    color: var(--gray-400);
    line-height: 1.5;
    padding: var(--g-20) var(--g-45);
    text-align: center
}

.cabinet__tab-list__item:hover {
    position: relative;
    background: var(--gray-100);
    color: var(--gray-500);
    opacity: 1;
    z-index: 2
}

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

.cabinet__tab-content {
    margin: var(--g-35)0
}

@media (max-width:576px) {
    .cabinet__tab-list {
        border-radius: var(--g-75)
    }
}

.cabinet-section {
    border-radius: var(--g-35);
    border: 2px solid var(--black_alpha-15);
    font-weight: 500;
    padding: var(--g-50)
}

.cabinet-section_type-helper {
    padding: var(--g-75) var(--g-50);
    margin: var(--g-50)0 0
}

.cabinet-section__heading {
    font-weight: 600;
    font-size: var(--size-36)
}

.cabinet-section__info {
    font-size: var(--size-20);
    line-height: 1.5;
    color: var(--gray-500);
    max-width: calc(var(--g-80)*10);
    margin: var(--g-5) auto 0
}

.cabinet-section__buttons {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    grid-gap: var(--g-10);
    max-width: calc(var(--g-96)*10);
    margin: var(--g-15) auto 0
}

.cabinet-appearance {
    display: grid;
    grid-template-columns: 1fr 1fr calc(var(--size-48)*10);
    grid-gap: var(--g-15);
    border-radius: var(--g-35);
    background: linear-gradient(90deg, var(--black) 50%, transparent 75%), url(../img/screen/cabinet-1.jpg)var(--black);
    background-size: auto, contain;
    padding: var(--g-45);
    overflow: hidden
}

.cabinet-appearance__card {
    --bg-color: var(--white_alpha-10);
    display: grid;
    justify-items: center;
    justify-content: center;
    align-content: start;
    grid-gap: var(--g-40);
    position: relative;
    border-radius: var(--g-25);
    border: var(--g-5) solid var(--gray-800);
    background: linear-gradient(to top, black 40%, transparent 70%), var(--bg-image) no-repeat center 50px, radial-gradient(89.8% 44.01%at 50% 33.13%, rgba(255, 255, 255, .11) 0%, rgba(153, 153, 153, 0) 100%), var(--black);
    padding: var(--g-50) var(--g-25);
    text-align: center;
    overflow: hidden
}

.cabinet-appearance__card-image {
    position: absolute;
    top: var(--g-50);
    z-index: 0
}

.cabinet-appearance__card-header {
    position: relative;
    padding-top: var(--g-150)
}

.cabinet-appearance__card-heading {
    position: relative;
    font-weight: 600;
    font-size: var(--size-48);
    color: var(--white);
    text-align: center
}

.cabinet-appearance__card-info {
    font-weight: 500;
    font-size: var(--size-24);
    color: var(--gray-400)
}

.cabinet-appearance__card-info_status-success {
    color: var(--green-550)
}

.cabinet-appearance__card-text {
    font-weight: 500;
    font-size: var(--size-16);
    color: var(--gray-400);
    line-height: 1.5;
    margin-top: var(--g-20)
}

.cabinet-appearance__card-text .link {
    margin: 0 6px 6px
}

.cabinet-appearance__skin {
    position: relative;
    background: url(../img/icon/cabinet/skin/manage.svg)no-repeat center bottom
}

.cabinet-appearance__skin-control {
    display: block;
    position: absolute;
    border-radius: 35px;
    background: var(--white_alpha-10)url(../img/icon/cabinet/skin/pause.svg)no-repeat center;
    background-size: 60%auto !important;
    width: calc(var(--g-20)*4.4);
    height: calc(var(--g-20)*3.4);
    top: 0;
    right: 0
}

.cabinet-appearance__skin-control_alt {
    background: var(--white)url(../img/icon/cabinet/skin/play.svg)no-repeat center
}

@media (max-width:1600px) {
    .cabinet-appearance__card {
        display: grid;
        grid-template-rows: auto minmax(130px, auto);
        align-content: end
    }

    .cabinet-appearance__card-header {
        padding-top: var(--g-150)
    }
}

@media (max-width:1200px) {
    .cabinet-appearance {
        grid-template-columns: 1fr 1fr calc(var(--size-40)*10)
    }
}

@media (max-width:1200px) and (min-width:960px) {
    .cabinet-appearance canvas {
        width: 100% !important;
        height: 100% !important
    }
}

@media (max-width:960px) {
    .cabinet-appearance {
        grid-template-columns: 1fr 1fr;
        grid-template-areas: "A B" "C C"
    }

    .cabinet-appearance__card-header {
        padding-top: calc(var(--g-150)*2)
    }

    .cabinet-appearance__skin {
        grid-area: C
    }
}

@media (max-width:576px) {
    .cabinet-appearance {
        grid-template-columns: 1fr;
        grid-template-areas: unset
    }

    .cabinet-appearance__card {
        grid-template-rows: unset
    }

    .cabinet-appearance__card-header {
        padding-top: 180px
    }

    .cabinet-appearance__skin {
        grid-area: unset
    }

    .cabinet-appearance canvas {
        max-width: 90%;
        width: 90vw !important;
        height: 100% !important
    }
}

.cabinet-settings {
    display: grid;
    grid-gap: var(--g-25)
}

.cabinet-integrations {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    grid-gap: var(--g-5);
    margin-top: var(--g-25)
}

.cabinet-integrations__card {
    --background-color: var(--black);
    display: grid;
    align-items: start;
    align-content: start;
    justify-items: center;
    justify-content: center;
    grid-gap: var(--g-5);
    border-radius: var(--g-15);
    background: var(--background-color);
    padding: var(--g-45) var(--g-25);
    width: 100%;
    height: 100%
}

.cabinet-integrations__card:active,
.cabinet-integrations__card:hover {
    --background-color: var(--black_alpha-80);
    position: relative;
    opacity: 1;
    z-index: 1
}

.cabinet-integrations__card_type-success {
    background: var(--black);
    box-shadow: 0-25px 45px -25px var(--green-550), 0 25px 45px -25px var(--green-550)
}

.cabinet-integrations__card-icon {
    width: var(--g-75);
    height: var(--g-75);
    margin: 0 0 var(--g-20);
    object-fit: contain
}

.cabinet-integrations__card-heading {
    font-weight: 600;
    font-size: var(--size-24);
    line-height: 1.3;
    color: var(--white)
}

.cabinet-integrations__card-info {
    display: block;
    font-weight: 500;
    font-size: var(--size-14);
    color: var(--gray-400);
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.cabinet-integrations__card-info_type-success {
    color: var(--green-550)
}

@media (max-width:1200px) {
    .cabinet-integrations {
        grid-template-columns: repeat(3, 1fr)
    }
}

.cabinet-manage {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: var(--g-20)
}

.cabinet-manage__card {
    display: grid;
    justify-items: center;
    align-content: center;
    align-items: center;
    grid-gap: var(--g-10);
    position: relative;
    border-radius: var(--g-35);
    background: var(--black);
    font-weight: 500;
    padding: var(--g-75) var(--g-50)
}

.cabinet-manage__card:hover {
    opacity: 1;
    background-color: var(--black_alpha-80)
}

.cabinet-manage__card::after {
    content: "Кликни для подробностей";
    font-size: var(--size-16);
    color: var(--gray-400);
    bottom: var(--g-35);
    animation: cabinet-manage__card-after 2s ease-in-out infinite;
    will-change: opacity
}

.cabinet-manage__card-icon {
    display: block;
    max-width: calc(var(--g-40)*4);
    max-height: calc(var(--g-40)*4);
    width: 100%;
    height: 100%;
    margin: 0 0 var(--g-15);
    object-fit: contain;
    object-position: center
}

.cabinet-manage__card-heading {
    font-weight: 600;
    font-size: var(--size-36);
    color: var(--white)
}

.cabinet-manage__card-info {
    font-size: var(--size-16);
    line-height: 1.5;
    color: var(--gray-400)
}

.cabinet-manage__card-data {
    display: block;
    padding: var(--g-15);
    text-align: center
}

.cabinet-manage__card-data__mark {
    display: block;
    font-weight: 600;
    font-size: var(--size-20);
    color: var(--blue-450);
    margin-top: 5px
}

@media (max-width:992px) {
    .cabinet-manage {
        grid-template-columns: 1fr;
        grid-gap: var(--g-10)
    }

    .cabinet-manage__card {
        padding-bottom: var(--g-150)
    }
}

.cabinet-sessions {
    display: grid;
    grid-gap: var(--g-10);
    margin: var(--g-25)0 0
}

.cabinet-sessions__item {
    display: grid;
    grid-template-columns: repeat(4, auto) 1fr;
    align-items: center;
    grid-gap: var(--g-10);
    border-radius: var(--g-50);
    background: var(--black);
    padding: var(--g-15) var(--g-35);
    width: 100%
}

.cabinet-sessions__item-icon {
    width: 42px;
    height: 42px
}

.cabinet-sessions__item-icon_filler {
    border-radius: 50%;
    background: var(--gray-800)
}

.cabinet-sessions__item-data {
    font-size: var(--size-18);
    line-height: 1.5;
    color: var(--gray-400)
}

.cabinet-sessions__item-data_type-windows {
    font-weight: 600;
    color: var(--blue-450)
}

.cabinet-sessions__item-data_type-apple {
    font-weight: 700;
    color: var(--white);
    background: linear-gradient(0, var(--gray-600), var(--white));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.cabinet-sessions__item-data_type-android {
    font-weight: 600;
    color: var(--green-550)
}

.cabinet-sessions__item-data_type-ip {
    color: var(--white)
}

.cabinet-sessions__item-data_type-time {
    color: var(--gray-600);
    margin-left: auto
}

@media (max-width:992px) {
    .cabinet-sessions__item {
        display: flex;
        grid-auto-flow: column;
        flex-wrap: wrap;
        grid-gap: 0 var(--g-10);
        position: relative;
        border-radius: var(--g-25);
        padding: var(--g-25) var(--g-35) var(--g-25) 60px;
        text-align: left
    }

    .cabinet-sessions__item-icon {
        position: absolute;
        width: var(--size-40);
        height: var(--size-40);
        top: calc((100% - var(--size-40))/2);
        left: var(--g-35)
    }

    .cabinet-sessions__item-data {
        margin: 0
    }
}

@media (max-width:768px) {
    .cabinet-sessions__item {
        padding-left: 55px
    }
}

@media (max-width:576px) {
    .cabinet-sessions__item {
        padding-left: 45px
    }
}

.ban,
.ban-icon {
    position: relative
}

.ban {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-gap: var(--g-50);
    align-items: center;
    border-radius: var(--g-25);
    background: var(--black);
    padding: var(--g-75) var(--g-100);
    margin: var(--g-25)0;
    overflow: hidden
}

.ban-icon {
    padding: var(--g-15);
    z-index: 1
}

.ban-icon__img {
    width: calc(var(--g-50)*3);
    animation: ban-icon__img_rotate 3s ease-in-out infinite;
    transform-origin: center;
    filter: drop-shadow(var(--g-5) var(--g-5)0#121212) drop-shadow(var(--g-10) var(--g-10)0#121212)
}

.ban-content {
    position: relative;
    z-index: 1
}

.ban-content__heading {
    font-family: "NEXT ART", sans-serif;
    font-size: var(--size-40);
    color: var(--white)
}

.ban-content__list {
    display: grid;
    grid-gap: var(--g-5);
    margin: var(--g-15)0 var(--g-25)
}

.ban-content__paragraph {
    font-family: "Montserrat", sans-serif;
    font-weight: 500;
    font-size: var(--size-24);
    color: var(--white_alpha-40)
}

.ban-content__paragraph-text_style-danger {
    color: var(--red-400)
}

.ban-backdrop {
    position: absolute;
    background: url(../img/icon/cabinet/crosshair.svg)left top;
    background-size: 52px;
    width: 200%;
    height: 200%;
    top: 0;
    left: 0;
    opacity: .05;
    animation: ban-backdrop_translate 25s linear infinite;
    z-index: 0
}

@media (max-width:576px) {
    .ban {
        grid-template-columns: 1fr;
        justify-content: center;
        justify-items: center;
        text-align: center
    }
}

.stats-content {
    position: relative;
    padding: var(--g-75)0
}

.stats-content__list {
    display: grid;
    grid-template-columns: repeat(3, auto);
    justify-content: center;
    grid-gap: var(--g-75);
    text-align: center
}

.stats-content__list-item__count {
    background: var(--pink-500) linear-gradient(0, var(--pink-500), var(--purple-700));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 700;
    font-size: var(--size-64)
}

.stats-content__list-item__about {
    font-weight: 500;
    font-size: var(--size-24);
    color: var(--gray-400)
}

.teaser {
    display: grid;
    justify-items: left;
    grid-gap: var(--g-15);
    padding: var(--g-150)0;
    max-width: 100%;
    overflow: hidden
}

.teaser-row {
    --image-height: calc(var(--g-40) * 4);
    display: grid;
    grid-auto-flow: column;
    grid-gap: var(--g-10);
    animation: teaser-row 42s linear infinite;
    will-change: transform, opacity
}

.teaser-row__link-image {
    display: block;
    height: var(--image-height);
    opacity: .5;
    filter: saturate(0);
    transition: .2s var(--timing-function_default);
    pointer-events: unset !important
}

.teaser-row__link-image:hover {
    opacity: 1;
    filter: saturate(1)
}

.teaser-row_animation-2 {
    --image-height: calc(var(--g-40) * 3);
    animation-duration: 36s
}

.teaser-row_animation-3 {
    --image-height: calc(var(--g-40) * 2);
    animation-duration: 30s
}

@media (max-width:576px) {
    .teaser-row {
        animation-duration: 21s
    }

    .teaser-row_animation-2 {
        animation-duration: 18s
    }

    .teaser-row_animation-3 {
        animation-duration: 15s
    }
}

.news {
    background: var(--blue-saturate-500) linear-gradient(45deg, var(--blue-saturate-500), var(--aqua-300_alpha-80))
}

.news-heading {
    background: linear-gradient(180deg, var(--white), var(--white_alpha-60) 75%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 600;
    font-size: var(--size-72);
    text-align: center
}

.news-content {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: var(--g-10);
    margin: var(--g-25)0 0
}

.news-content__card {
    display: grid;
    grid-template-rows: auto 1fr auto;
    align-items: start;
    grid-gap: var(--g-15);
    border-radius: var(--g-20);
    background: var(--black_alpha-80);
    padding: var(--g-25)
}

.news-content__card:hover {
    background: var(--black);
    opacity: 1
}

.news-content__card-header {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: var(--g-15)
}

.news-content__card-header__icon {
    width: var(--g-50);
    height: var(--g-50)
}

.news-content__card-header__heading {
    font-weight: 600;
    font-size: var(--size-16);
    line-height: var(--size-20);
    color: var(--white)
}

.news-content__card-post {
    font-weight: 300;
    font-size: var(--size-16);
    color: var(--white_alpha-60);
    line-height: 1.5
}

.news-content__card-stats {
    display: grid;
    grid-template-columns: auto auto;
    justify-content: space-between;
    margin: auto 0 0
}

.news-content__card-meta {
    display: grid;
    grid-template-columns: auto auto;
    align-content: center;
    align-items: center;
    grid-gap: 4px;
    font-weight: 500;
    font-size: var(--size-12);
    color: var(--white_alpha-40)
}

.news-content__card-meta__icon {
    height: 12px
}

.news-footer {
    display: flex;
    grid-auto-flow: column;
    justify-content: center;
    flex-wrap: wrap;
    grid-gap: var(--g-15);
    width: 100%;
    margin: var(--g-30)0 0
}

@media (max-width:992px) {
    .news-content {
        grid-template-columns: 1fr 1fr
    }
}

@media (max-width:768px) {
    .news-content {
        grid-template-columns: 1fr
    }
}

.servers {
    display: grid;
    grid-gap: var(--g-150);
    padding-right: 15px;
    padding-left: 15px
}

.servers-card {
    --shadow-color-1: var(--gray-800);
    --shadow-color-2: var(--gray-800);
    --feature-color: var(--yellow-300);
    position: relative;
    border-radius: var(--g-50);
    border: 5px solid var(--white_alpha-15);
    background: var(--black);
    width: 100%;
    max-width: 1700px;
    padding: calc(var(--g-100)*1.6) calc(var(--g-100)*.9) calc(var(--g-100)*.8);
    margin: auto
}

.servers-card__heading {
    display: grid;
    justify-items: center;
    position: absolute;
    width: 100%;
    margin: auto;
    top: -80px;
    left: 0;
    user-select: none;
    text-align: center
}

.servers-card__heading-logo {
    height: var(--g-150)
}

.servers-card__heading-online {
    display: inline-block;
    position: relative;
    font-family: Minecraft Five, sans-serif;
    font-size: var(--size-32);
    line-height: .8;
    color: var(--white);
    top: calc(var(--g-30)*-.25)
}

.servers-card__heading-online__count {
    background: unset;
    font-family: inherit;
    color: var(--green-300)
}

.servers-card__content {
    text-align: center
}

.servers-card__content-list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    justify-content: center;
    grid-gap: var(--g-10);
    margin: 0 0 var(--g-25)
}

.servers-card__content-list__feature {
    border-radius: var(--g-35);
    background: var(--white);
    font-weight: 400;
    font-size: var(--size-24);
    line-height: 1.4;
    height: 100%;
    padding: 0;
    white-space: normal;
    user-select: none
}

.servers-card__content-list__feature-img,
.two-step-auth__content-group__links-icon img {
    width: 100%
}

.servers-card__content-list__feature-info {
    display: flex;
    flex-direction: column;
    grid-gap: var(--g-15);
    align-items: center;
    align-self: stretch;
    padding: 0 var(--g-30) var(--g-45) var(--g-30)
}

.servers-card__content-list__feature-heading {
    line-height: 1;
    font-weight: 600;
    font-size: var(--size-32);
    color: var(--gray-800);
    letter-spacing: calc(var(--size-32)/-21)
}

.servers-card__content-list__feature-paragraph {
    line-height: 1.2 !important;
    font-size: var(--size-16);
    color: var(--black_alpha-40)
}

@media (max-width:1600px) {
    .servers-card {
        min-height: unset
    }
}

@media (max-width:1300px) {
    .servers-card_type-volcanoblock {
        background-size: cover
    }
}

@media (max-width:992px) {
    .servers-card {
        padding: calc(var(--g-100)*1.5) var(--g-75) var(--g-75)
    }

    .servers-card__heading {
        top: calc(var(--g-75)*-1)
    }

    .servers-card__content-list {
        grid-template-columns: repeat(2, 1fr)
    }
}

@media (max-width:768px) {
    .servers-card {
        margin-top: var(--g-75)
    }

    .servers-card__heading-online {
        padding-bottom: var(--g-5)
    }
}

@media (max-width:576px) {
    .servers-card__content-list {
        grid-template-columns: 1fr
    }
}

.start {
    padding: var(--g-100)0;
    margin: var(--g-100)0 0;
    text-align: center
}

.start-heading {
    font-weight: 600;
    font-size: var(--size-72)
}

.start-info {
    line-height: 1.5;
    font-weight: 500;
    font-size: var(--size-24);
    color: var(--gray-400)
}

.start-auth {
    display: grid;
    justify-items: center;
    grid-gap: var(--g-15);
    margin-top: var(--g-25)
}

.start-auth__log-in {
    display: inline-grid;
    grid-template-columns: repeat(3, auto);
    align-items: center;
    grid-gap: var(--g-15);
    padding: var(--g-20) var(--g-60)
}

.start-auth__separator {
    display: grid;
    grid-template-columns: 270px auto 270px;
    align-items: center;
    grid-gap: var(--g-15)
}

.start-auth__separator::after,
.start-auth__separator::before {
    content: "";
    display: block;
    border-top: 1px solid var(--gray-200);
    height: 1px
}

.start-auth__socials,
.start-auth__socials-card {
    display: grid;
    justify-items: center;
    align-items: center
}

.start-auth__socials {
    grid-template-columns: repeat(5, auto);
    grid-gap: var(--g-15)
}

.start-auth__socials-card {
    border-radius: var(--g-25);
    border: 1px solid var(--gray-200);
    background: var(--white);
    padding: var(--g-20) var(--g-25)
}

.start-auth__icon {
    width: var(--g-60);
    height: var(--g-60);
    object-fit: contain
}

@media (max-width:768px) {
    .start {
        margin-top: 0
    }

    .start-auth__separator {
        grid-template-columns: 1fr auto 1fr;
        width: 100%
    }
}

.launcher {
    border-radius: var(--g-45);
    background: var(--black);
    width: 100%;
    max-width: 1720px;
    padding: var(--g-150)0;
    margin: var(--g-100) auto 0;
    text-align: center
}

.launcher-heading {
    font-weight: 600;
    font-size: var(--size-72);
    color: var(--white)
}

.launcher-info {
    line-height: 1.5;
    font-weight: 500;
    font-size: var(--size-24);
    color: var(--gray-400);
    margin-top: var(--g-10)
}

.launcher-info__emoji {
    vertical-align: bottom
}

.launcher-download {
    display: grid;
    grid-template-areas: "windows macos" "windows linux";
    grid-gap: var(--g-25);
    margin-top: var(--g-50)
}

.launcher-download__card {
    display: grid;
    grid-template-columns: minmax(auto, 310px);
    grid-template-rows: 1fr auto;
    position: relative;
    border-radius: var(--g-35);
    background-size: calc(var(--g-40)*10), auto !important;
    font-weight: 600;
    font-size: var(--size-40);
    color: var(--white);
    padding: var(--g-35) var(--g-50);
    transform: perspective(1000px) rotateX(0) scale(1);
    transition: .3s var(--timing-function_default);
    will-change: transform, opacity;
    text-align: left
}

.launcher-download__card:hover {
    transform: perspective(1000px) rotateX(6deg) scale(1.15);
    z-index: 1
}

.launcher-download__card:active {
    transform: perspective(1000px) rotateX(-6deg) scale(1)
}

.launcher-download__card_type-windows {
    grid-area: windows;
    background: url(../img/icon/launcher/windows.svg)no-repeat right center, var(--blue-saturate-500) linear-gradient(45deg, var(--blue-saturate-500), var(--aqua-300_alpha-60) 75%);
    padding: var(--g-50)
}

.launcher-download__card_type-macos {
    grid-area: macos;
    border: 3px solid var(--white_alpha-20);
    background: var(--black)url(../img/icon/launcher/macos.svg)no-repeat right top
}

.launcher-download__card_type-linux {
    grid-area: linux;
    background: var(--gray-850)url(../img/icon/launcher/linux.svg)no-repeat right center
}

.launcher-download__card-icon {
    height: var(--g-60);
    object-fit: contain;
    opacity: .7;
    animation: launcher-download__card-icon 2s ease-in-out infinite
}

.launcher-download__card-icon_alt {
    animation-delay: 1s
}

.launcher-download__card-heart {
    display: block;
    position: absolute;
    right: 25%;
    bottom: 0;
    opacity: 0;
    animation: launcher-download__card-heart 1.8s linear infinite;
    transform: translateY(0) scale(0);
    will-change: transform, opacity
}

.launcher-download__card-heart_order-1 {
    animation-delay: .5s
}

.launcher-download__card-heart_order-2 {
    animation-delay: 1s
}

.launcher-download__card-heart_order-3 {
    animation-delay: 1.5s
}

@media (max-width:576px) {
    .launcher-download {
        grid-template-areas: "windows" "macos" "linux"
    }

    .launcher-download__card {
        grid-template-columns: minmax(auto, calc(var(--size-32)*10));
        background-size: calc(var(--g-60)*10), auto !important;
        background-position: right -20px, center
    }
}

.socials {
    padding: var(--g-150)0;
    text-align: center
}

.socials-heading {
    font-weight: 600;
    font-size: var(--size-72)
}

.socials-row,
.socials-row__card {
    display: grid;
    grid-gap: var(--g-35)
}

.socials-row {
    grid-template-columns: repeat(3, 1fr);
    margin-top: var(--g-35)
}

.socials-row__card {
    grid-template-rows: auto 1fr auto;
    justify-items: center;
    border-radius: var(--g-35);
    background: red;
    height: calc(var(--g-60)*12);
    padding: var(--g-75) var(--g-35);
    white-space: normal
}

.socials-row__card_brand-vk {
    background: var(--brand-vk)url(../img/social/card/vk.jpg)no-repeat center;
    background-size: cover
}

.socials-row__card_brand-discord {
    background: var(--brand-discord)url(../img/social/card/discord.jpg)no-repeat center;
    background-size: cover
}

.socials-row__card_brand-youtube {
    background: var(--brand-youtube)url(../img/social/card/youtube.jpg)no-repeat center;
    background-size: cover
}

.socials-row__card-icon {
    height: calc(var(--g-60)*2)
}

.socials-row__card-heading {
    font-weight: 600;
    font-size: var(--size-48);
    color: var(--black_alpha-70)
}

.socials-row__card-heading__mark {
    background: unset;
    color: var(--white)
}

.socials-row__card-heading__icon {
    display: block;
    margin: var(--g-15) auto 0;
    height: var(--g-40)
}

.socials-row__card-info {
    line-height: 1.5;
    font-weight: 600;
    font-size: var(--size-24);
    color: var(--black_alpha-70)
}

@media (max-width:1200px) {
    .socials-row {
        grid-gap: var(--g-20)
    }
}

@media (max-width:768px) {
    .socials-row {
        grid-template-columns: 1fr
    }

    .socials-row__card {
        grid-template-rows: 1fr;
        grid-auto-flow: column;
        justify-content: space-between;
        justify-items: center;
        align-items: center;
        height: unset;
        padding: var(--g-45) var(--g-75)
    }

    .socials-row__card-icon {
        height: unset;
        width: calc(var(--g-40)*4)
    }

    .socials-row__card-heading {
        text-align: left
    }

    .socials-row__card-heading__icon {
        margin-left: 0
    }

    .socials-row__card-info {
        text-align: right
    }
}

@media (max-width:576px) {
    .socials-row__card-heading {
        font-size: var(--size-40)
    }
}

.footer {
    display: grid;
    grid-gap: var(--g-50);
    border-radius: 70px 70px 0 0;
    background: var(--black);
    padding: var(--g-50)0;
    text-align: center
}

.footer__payment {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: var(--g-25)
}

.footer__payment-image {
    display: block;
    height: var(--g-30)
}

.footer__terms {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: var(--g-25);
    margin: var(--g-35)0 0
}

.footer__terms-item {
    font-size: var(--size-18);
    color: var(--white)
}

.footer__legal {
    display: grid;
    justify-items: center;
    grid-gap: var(--g-15);
    margin: var(--g-35)0 0
}

.footer__legal-item {
    line-height: 1.5;
    font-size: var(--size-14);
    font-weight: 500;
    color: var(--gray-400)
}

@media (max-width:1600px) {
    .footer {
        border-radius: var(--g-75) var(--g-75)0 0
    }
}

@media (max-width:700px) {
    .footer .nav {
        justify-content: center;
        padding: var(--g-20)0 var(--g-10)
    }
}

.template__paragraph {
    line-height: 1.5;
    font-weight: 500;
    font-size: var(--size-18);
    color: var(--gray-400)
}

.template__actions {
    display: grid;
    grid-auto-flow: column;
    justify-content: center;
    justify-items: center;
    grid-gap: var(--g-50);
    width: 100%
}

.template__form {
    display: grid;
    grid-gap: var(--g-25);
    width: 100%
}

.template__form-row {
    display: grid;
    grid-template-columns: 2fr 3fr;
    justify-content: space-between;
    align-content: center;
    align-items: center;
    grid-gap: var(--g-10);
    text-align: left
}

.template__skin {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-gap: var(--g-25);
    border-radius: 25px;
    background: var(--gray-50_alpha-50);
    padding: 0 var(--g-25)
}

.template__skin-manage {
    display: grid;
    align-content: start;
    justify-items: center;
    grid-gap: var(--g-15);
    padding: var(--g-25)
}

.menu {
    min-width: 960px
}

.menu-window {
    padding: var(--g-40) var(--g-30)
}

.menu-window__nav {
    border-radius: var(--g-20);
    border: 2px solid #d9d9d9;
    padding: var(--g-25) var(--g-75);
    margin: var(--g-20)0 0;
    text-align: center
}

.menu-window__nav-heading {
    font-weight: 600;
    font-size: var(--size-32);
    color: var(--black_alpha-70)
}

.menu-window__nav-list {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: var(--g-5);
    margin: var(--g-10)0 0
}

.menu-server {
    display: grid;
    justify-items: center;
    grid-gap: var(--g-5);
    position: relative;
    padding: var(--g-35) var(--g-25);
    margin: var(--g-12)0 0;
    transform: perspective(1000px) rotateX(0) scale(1);
    transition: .3s var(--timing-function_default);
    will-change: transform, opacity;
    overflow: hidden
}

.menu-server_status-closed {
    --filter-value: saturate(0) brightness(.5);
    pointer-events: none
}

.menu-server:hover {
    transform: perspective(1000px) rotateX(4deg) scale(1.1);
    z-index: 1
}

.menu-server:active {
    transform: perspective(1000px) rotateX(-4deg) scale(1)
}

.menu-server__cover {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    filter: var(--filter-value);
    z-index: 0
}

.menu-server__cover-image {
    width: 100%;
    height: 100%;
    object-position: center;
    object-fit: cover
}

.menu-server__logo {
    position: relative;
    height: var(--size-80);
    filter: var(--filter-value)
}

.menu-server__info {
    position: relative;
    display: inline-block;
    background: var(--black_alpha-80);
    font-family: Minecraft Five, sans-serif;
    font-size: var(--size-24);
    line-height: 1.5;
    color: var(--white);
    padding: 0 8px
}

.menu-server__info-mark {
    font-family: inherit;
    color: var(--green-300);
    background: linear-gradient(89.79deg, var(--green-300), var(--yellow-300));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

@media (max-width:1200px) {
    .menu {
        min-width: unset;
        max-width: calc(var(--size-96)*12);
        width: 100%
    }
}

.login-socials {
    display: grid;
    justify-items: center;
    grid-gap: var(--g-15);
    overflow: hidden
}

.login-socials__preview {
    position: relative;
    width: 100%
}

.login-socials__preview::before {
    content: "";
    display: block;
    position: absolute;
    background: url(../img/icon/play-arrow-right.svg);
    background-size: contain;
    height: var(--g-40);
    width: calc(200% + 200px);
    top: calc(50% - var(--g-40)/2);
    right: -50px;
    animation: login-socials__preview-before 15s linear infinite;
    will-change: transform
}

.login-socials__icon {
    display: block;
    position: relative;
    background-color: var(--white);
    width: var(--g-150);
    height: var(--g-150);
    margin: auto;
    box-shadow: 0 0 15px 15px var(--white);
    z-index: 1
}

.login-socials__icon_status-failed {
    opacity: .2
}

.login-socials__action {
    margin-top: var(--g-15)
}

.about-account {
    padding: var(--g-45) var(--g-15) var(--g-15)
}

.about-account__content {
    display: grid;
    grid-gap: var(--g-8);
    margin: var(--g-15)0 0
}

.about-account__card {
    border-radius: var(--g-20);
    background: var(--black);
    min-width: calc(var(--g-100)*3.4);
    padding: var(--g-35)0;
    line-height: 1.4;
    text-align: center
}

.about-account__card_alt {
    padding: var(--g-10)
}

.about-account__card-info {
    font-weight: 400;
    font-size: var(--size-16);
    color: var(--white_alpha-60)
}

.about-account__card-value {
    font-weight: 600;
    font-size: var(--size-32);
    color: var(--blue-450)
}

.about-account__card-online {
    display: grid;
    grid-template-columns: repeat(10, 1fr);
    border-radius: var(--g-15);
    background: var(--white_alpha-5);
    padding: var(--g-35) var(--g-45)
}

.about-account__card-online__column {
    display: grid;
    justify-content: center;
    justify-items: center;
    align-content: end;
    align-items: end;
    grid-gap: var(--g-10);
    min-height: calc(var(--g-100)*2.1);
    padding: var(--g-5)
}

.about-account__card-online__column-bar {
    position: relative;
    border-radius: var(--g-50);
    background: linear-gradient(180deg, var(--aqua-300) -45%, var(--blue-450) 45%, var(--blue-saturate-500)) no-repeat center bottom;
    background-size: 180px 180px;
    height: var(--g-150);
    width: var(--g-30)
}

.about-account__card-online__column-date {
    font-weight: 500;
    font-size: var(--size-16);
    color: var(--white_alpha-60)
}

.about-account__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 7px
}

.create-character {
    display: grid;
    grid-template-columns: 1fr 380px;
    width: 100%;
    padding: 0;
    overflow: hidden
}

.create-character__content {
    display: grid;
    grid-gap: var(--g-35);
    padding: var(--g-50)
}

.create-character__content-section {
    line-height: 1.4;
    font-size: var(--size-16);
    color: var(--gray-600)
}

.create-character__content-section__heading {
    font-weight: 600;
    font-size: var(--size-32);
    color: var(--gray-800);
    margin-bottom: var(--g-10)
}

.create-character__content-section__heading-step {
    color: var(--blue-450)
}

.create-character__content-section__uploader {
    display: grid;
    justify-items: center;
    grid-gap: var(--g-15);
    border-radius: 15px;
    border: 3px dashed var(--blue-450_alpha-30);
    padding: var(--g-25);
    margin-bottom: var(--g-10);
    transition: .5s var(--timing-function_default);
    user-select: none
}

.create-character__content-section__uploader:hover {
    border-color: var(--blue-450);
    cursor: pointer
}

.create-character__content-section__uploader:active,
.create-character__content-section__uploader:focus {
    border-color: var(--blue-450_alpha-40)
}

.create-character__preview {
    display: grid;
    justify-items: center;
    align-content: center;
    align-items: center;
    grid-gap: 0;
    background: var(--black);
    overflow: hidden
}

.create-character__preview-username {
    display: inline-block;
    position: relative;
    background: var(--white_alpha-10);
    font-family: "Minecraft Seven", sans-serif;
    font-weight: 400;
    font-size: var(--size-32);
    color: var(--gray-400);
    line-height: 1.4;
    padding: 0 8px;
    bottom: -30px
}

.change-username-preview__username_type-new::after,
.create-character__preview-username::after {
    content: "_";
    animation: create-character__preview-username-after 1s infinite
}

@media (max-width:992px) {
    .create-character {
        grid-template-columns: 1fr calc(var(--g-150)*4)
    }

    .create-character__preview {
        grid-gap: 10px
    }

    .create-character canvas {
        width: calc(var(--g-100)*3) !important;
        height: calc(var(--g-100)*5) !important
    }
}

@media (max-width:576px) {
    .create-character {
        grid-template-columns: 1fr
    }

    .create-character__preview {
        grid-gap: 25px
    }

    .create-character canvas {
        width: calc(var(--g-150)*4) !important;
        height: calc(var(--g-150)*6) !important
    }
}

.change-username {
    display: grid;
    grid-auto-flow: column;
    align-content: center;
    align-items: center;
    padding: 0;
    overflow: hidden
}

.change-username-preview {
    display: grid;
    justify-items: center;
    align-content: start;
    align-items: start;
    grid-gap: var(--g-10);
    position: relative;
    background: linear-gradient(180deg, var(--blue-250) -15%, var(--blue-450), var(--blue-saturate-500_alpha-60)), var(--black);
    width: 400px;
    height: 100%;
    padding: var(--g-35)0 0;
    overflow: hidden
}

.change-username-preview__username {
    position: relative;
    background: var(--black_alpha-60);
    font-family: "Minecraft Seven", sans-serif;
    font-weight: 400;
    font-size: var(--size-36);
    color: var(--white);
    line-height: 1.3;
    padding: 0 var(--g-8)
}

.change-username-preview__username_type-rejected {
    background: var(--black_alpha-40);
    font-size: var(--size-24);
    color: var(--white_alpha-60)
}

.change-username-preview__username_size-xs {
    font-size: var(--size-24)
}

.change-username-preview__username_size-sm {
    font-size: var(--size-32)
}

.change-username-preview__username-strike {
    position: absolute;
    background: var(--pink-500);
    width: 120%;
    height: 5px;
    opacity: .8;
    top: 50%;
    left: -10%;
    transform: rotate(4deg);
    transform-origin: center
}

.change-username-preview__skin {
    position: absolute;
    width: 120%;
    top: 10%;
    object-position: top;
    object-fit: cover
}

.change-username-content {
    display: grid;
    grid-gap: var(--g-15);
    padding: var(--g-45) var(--g-35)
}

.change-username-content__section {
    display: grid;
    justify-items: center;
    grid-gap: 0
}

@media (max-width:992px) {
    .change-username-preview {
        width: 300px
    }
}

@media (max-width:768px) {
    .change-username-preview {
        width: 250px
    }
}

@media (max-width:540px) {
    .change-username {
        grid-auto-flow: unset
    }

    .change-username-preview {
        width: 100%;
        min-height: 200px
    }

    .change-username-preview__skin {
        max-width: 200px;
        top: 35px
    }
}

.donate-purchase {
    min-width: 750px;
    padding: 0;
    overflow: hidden
}

.donate-purchase-content {
    padding: var(--g-35)
}

.donate-purchase-content__breadcrumbs {
    display: grid;
    grid-template-columns: repeat(3, auto);
    justify-content: center;
    justify-items: center;
    grid-gap: var(--g-10)
}

.donate-purchase-content__breadcrumbs-item {
    border-radius: 100px;
    background: var(--black_alpha-20);
    width: 90px;
    height: 8px;
    will-change: opacity
}

.donate-purchase-content__breadcrumbs-item_style-current {
    animation: donate-purchase-content__breadcrumbs-item 1.5s linear infinite
}

.donate-purchase-content__breadcrumbs-item_style-finished {
    background: var(--black)
}

.donate-purchase-content__section {
    border-radius: var(--g-25);
    background: var(--black);
    margin: var(--g-25)0;
    padding: var(--g-45) var(--g-35)
}

.donate-purchase-content__section-heading {
    font-weight: 600;
    font-size: var(--size-24);
    line-height: 1.4;
    color: var(--white)
}

.donate-purchase-content__section-list {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    grid-gap: var(--g-10);
    max-width: 720px;
    padding: 0 var(--g-35);
    margin: var(--g-10)0 0
}

.donate-purchase-content__section-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: var(--g-10);
    margin: var(--g-15)0 0
}

.donate-purchase-content__section-card {
    display: inline-block;
    border-radius: 255px;
    border: 3px solid var(--white_alpha-10);
    background: var(--black_alpha-70);
    font-weight: 500;
    font-size: var(--size-20);
    line-height: 1.4;
    color: var(--white_alpha-60);
    padding: var(--g-10) var(--g-35)
}

.donate-purchase-content__section-card_type-card {
    display: grid;
    justify-content: center;
    justify-items: center;
    grid-gap: var(--g-5);
    border-radius: var(--g-25);
    padding: var(--g-25) var(--g-35);
    margin: 0
}

.donate-purchase-content__section-card_checked-true {
    border-color: var(--white);
    pointer-events: none
}

.donate-purchase-content__section-card:hover {
    opacity: 1
}

.donate-purchase-content__section-card__logo {
    height: var(--g-25);
    vertical-align: top
}

.donate-purchase-content__section-card__price {
    font-weight: 700;
    font-size: var(--size-32);
    color: var(--white)
}

.donate-purchase-content__section-card__price_sale-true {
    background: linear-gradient(90deg, var(--yellow-300), var(--green-550));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

@media (max-width:768px) {
    .donate-purchase {
        min-width: unset
    }
}

.two-step-auth {
    --gradient-color: var(--white_alpha-20);
    --filter: saturate(0);
    --extra-display: none;
    padding: 0;
    overflow: hidden
}

.two-step-auth_status-active {
    --gradient-color: var(--blue-450_alpha-20);
    --filter: saturate(1);
    --extra-display: block
}

.two-step-auth__header {
    display: grid;
    justify-items: center;
    align-items: center;
    position: relative;
    border-radius: var(--g-25) var(--g-25)0 0;
    background: var(--black) radial-gradient(var(--gradient-color), transparent 70%);
    height: 210px;
    overflow: hidden
}

.two-step-auth__header-icon {
    width: 100px;
    filter: var(--filter)
}

.two-step-auth__header-extra {
    display: var(--extra-display);
    position: absolute;
    border-radius: 50%;
    border: 5px dashed var(--blue-450);
    width: 320px;
    height: 320px;
    left: calc(50% - 160px);
    top: calc(50% - 160px);
    animation: two-step-auth__header-extra 5s linear infinite;
    will-change: transform
}

.two-step-auth__header-extra_pos-left {
    left: calc(var(--g-150)*-1.6)
}

.two-step-auth__header-extra_pos-right {
    right: calc(var(--g-150)*-1.6);
    left: unset
}

.two-step-auth__content {
    display: grid;
    grid-gap: var(--g-15);
    padding: var(--g-45)
}

.two-step-auth__content-heading {
    display: grid;
    justify-items: center;
    grid-gap: 5px;
    margin-bottom: var(--g-10)
}

.two-step-auth__content-group {
    --heading-weight: 600;
    --heading-color: var(--gray-800);
    --paragraph-color: var(--gray-400);
    display: grid;
    justify-items: center;
    grid-gap: var(--g-10);
    border-radius: var(--g-15);
    border: 1px solid var(--gray-200);
    padding: var(--g-35)
}

.two-step-auth__content-group_style-primary {
    --heading-weight: 500;
    --heading-color: var(--white);
    --paragraph-color: var(--white_alpha-80);
    border: 0;
    background: url(../img/icon/modal/star.svg)no-repeat center, linear-gradient(105deg, var(--blue-450) 20%, var(--blue-saturate-500) 80%)
}

.two-step-auth__content-group_style-dark {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: var(--g-25);
    background: var(--black)
}

.two-step-auth__content-group__heading {
    font-weight: var(--heading-weight);
    font-size: var(--size-32);
    color: var(--heading-color);
    max-width: 580px
}

.two-step-auth__content-group__heading_alt {
    grid-column-start: 1;
    grid-column-end: 3
}

.two-step-auth__content-group__heading-mark {
    color: var(--blue-450)
}

.two-step-auth__content-group__paragraph {
    font-weight: 500;
    font-size: var(--size-20);
    line-height: 1.5;
    color: var(--paragraph-color, var(--gray-400));
    max-width: 640px;
    margin: 0 0 5px
}

.two-step-auth__content-group__links {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: var(--g-15);
    width: 100%
}

.two-step-auth__content-group__links-item {
    display: grid;
    grid-template-columns: 1fr auto auto;
    align-items: center;
    grid-gap: var(--g-5);
    border-radius: var(--g-50);
    background: var(--gray-50);
    padding: var(--g-15) var(--g-35);
    font-weight: 500;
    font-size: var(--size-20);
    color: var(--gray-400);
    text-align: left
}

.two-step-auth__content-group__links-icon {
    width: var(--size-36)
}

.two-step-auth__content-group__qr-code {
    border-radius: 4px;
    width: 100px;
    height: 100px;
    transition: .2s var(--timing-function_default);
    box-shadow: 0 35px 150px -30px transparent, 0 0 100px transparent;
    will-change: transform;
    pointer-events: all
}

.two-step-auth__content-group__qr-code:active,
.two-step-auth__content-group__qr-code:focus,
.two-step-auth__content-group__qr-code:hover {
    cursor: none;
    transform: scale(6);
    box-shadow: 0 35px 150px -30px var(--black), 0 0 100px var(--black_alpha-30)
}

.two-step-auth__content-group__form {
    display: grid;
    grid-gap: var(--g-10);
    max-width: 360px
}

@media (max-width:480px) {
    .two-step-auth__content-group__links {
        grid-template-columns: 1fr
    }
}

.donate__table {
    display: grid;
    overflow-x: auto
}

.donate__table-row {
    display: grid;
    grid-template-columns: minmax(200px, calc(var(--g-100)*2.4)) repeat(7, minmax(110px, 1fr));
    grid-gap: 4px
}

.donate__table-row:not(:last-child) {
    box-shadow: inset 0-1px var(--gray-900), 0 1px var(--gray-900)
}

.donate__table-data {
    --background-color: transparent;
    background-color: var(--background-color);
    line-height: 1.5;
    font-size: var(--size-12);
    color: var(--white_alpha-70);
    padding: var(--g-20)0;
    height: 100%
}

.donate__table-data:first-child {
    padding-right: var(--g-15)
}

.donate__table-data:not(:first-child) {
    text-align: center
}

.donate__table-data_style-pro {
    background: var(--aqua-300_alpha-5)
}

.donate__table-data_style-vip {
    background: var(--green-300_alpha-5)
}

.donate__table-data_style-gold {
    background: var(--orange-400_alpha-5)
}

.donate__table-data_style-grand {
    background: var(--blue-450_alpha-5)
}

.donate__table-data_style-deluxe {
    background: var(--violet-300_alpha-5)
}

.donate__table-data_style-mod {
    background: var(--pink-500_alpha-10)
}

.donate__table-data_style-truemod {
    border: solid var(--pink-500_alpha-70);
    border-width: 0 calc(var(--g-30)/10);
    background: var(--pink-500_alpha-20)
}

.donate__table-data_style-truemod img {
    filter: drop-shadow(0 0 20px var(--green-550)) drop-shadow(0 10px 10px var(--green-550)) drop-shadow(0-10px 10px var(--green-550))
}

.donate__table-data_type-head {
    border-radius: var(--g-15) var(--g-15)0 0;
    border-top-width: calc(var(--g-30)/10);
    padding: var(--g-35)0
}

.donate__table-data__icon {
    display: block;
    width: var(--g-100);
    margin: 0 auto var(--g-20);
    filter: unset !important
}

.donate__table-data__heading {
    font-weight: 600;
    font-size: var(--size-24);
    color: var(--white_alpha-90);
    line-height: 1.4
}

.donate__table-data__price {
    font-weight: 500;
    font-size: var(--size-20);
    color: var(--white_alpha-60);
    margin: 0 0 var(--g-15)
}

.donate__table-data__price-info {
    display: block;
    font-size: var(--size-14);
    color: var(--white_alpha-20);
    margin-top: -4px
}

.donate__table-data__image {
    max-height: 130px;
    width: calc(var(--g-100)*3);
    image-rendering: pixelated;
    object-fit: contain
}

.page-404 {
    position: relative
}

.page-404__card {
    content: "";
    display: block;
    position: absolute;
    border-radius: 0 calc(var(--g-100)*1.2);
    background: linear-gradient(90deg, var(--pink-500), var(--purple-700));
    width: calc(var(--g-100)*7.2);
    height: calc(var(--g-100)*7.2);
    top: 0;
    left: calc(var(--g-100)*-3.6);
    transform: rotate(45deg);
    transform-origin: center;
    overflow: hidden;
    z-index: -1
}

.page-404__card_alt {
    left: unset;
    right: calc(var(--g-100)*-3.6)
}

.page-404__card-image {
    display: block;
    position: absolute;
    top: -5%;
    left: -70%;
    width: 1080px;
    height: 1080px;
    object-fit: cover;
    transform: rotate(-45deg);
    transform-origin: center top
}

.page-404__content {
    display: grid;
    grid-gap: var(--g-50);
    align-content: center;
    justify-items: center;
    min-height: calc(90vh - 170px);
    text-align: center
}

.page-404__content-heading {
    background: linear-gradient(90deg, var(--pink-500), var(--purple-600), var(--purple-700));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    max-width: calc(var(--g-100)*8.8);
    font-weight: 600;
    font-size: var(--size-48);
    color: var(--purple-700)
}

.page-404__content-links {
    max-width: 630px;
    margin: auto
}

.page-404__content-links__item {
    margin: 5px
}

.page-404__content-footer__info {
    line-height: 1.5;
    font-weight: 500;
    font-size: var(--size-24);
    color: var(--gray-400);
    margin: 0 0 var(--g-20)
}

@media (max-width:1400px) {
    .page-404__card {
        left: calc(var(--g-100)*-5)
    }

    .page-404__card_alt {
        left: unset;
        right: calc(var(--g-100)*-5)
    }

    .page-404__content {
        min-height: unset;
        padding: var(--g-100)0
    }
}

@media (max-width:720px) {
    .page-404__card {
        display: none
    }
}

.register-success {
    background: url(../img/hero/register-success/hero.png)no-repeat 48vw 160px, linear-gradient(240deg, var(--purple-700_alpha-30), transparent 75%), var(--black);
    background-size: 932px auto, auto auto
}

.register-success__heading {
    max-width: 768px;
    margin-bottom: var(--g-75);
    text-align: left
}

.register-success__heading-mark {
    color: var(--green-300);
    text-shadow: 0 0 45px var(--green-300_alpha-50), 0 0 100px var(--green-300_alpha-50)
}

.register-success__content {
    max-width: 640px;
    margin-bottom: var(--g-75)
}

.register-success__content-subheading {
    font-weight: 600;
    font-size: var(--size-48);
    background: linear-gradient(150deg, var(--white), var(--white_alpha-40));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.register-success__content-feature {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-gap: var(--g-10);
    margin-top: var(--g-20)
}

.register-success__content-feature__info {
    font-size: var(--size-24);
    color: var(--gray-400)
}

.add-balance {
    background: linear-gradient(260.91deg, var(--blue-450_alpha-80) 30%, var(--blue-saturate-500_alpha-80) 90%), url(../img/server/oneblock/cover.png)no-repeat center top, var(--blue-450);
    background-size: 100%auto
}

.add-balance-info {
    color: var(--black_alpha-70);
    text-align: center
}

.add-balance-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: var(--g-25)
}

.add-balance-content__card {
    border-radius: var(--g-35);
    background: var(--white);
    margin: var(--g-25)0 0
}

.add-balance-content__card_style-dark {
    background: var(--black);
    overflow: hidden
}

.add-balance-content__card-container {
    padding: var(--g-50) var(--g-35)
}

.add-balance-content__card-heading {
    font-weight: 600;
    font-size: var(--size-32);
    color: var(--white);
    text-align: center
}

.add-balance-content__card-heading__mark {
    color: var(--blue-450)
}

.add-balance-content__card-heading_style-dark {
    color: var(--gray-800)
}

.add-balance-content__card-list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-content: start;
    gap: var(--g-10)
}

.add-balance-content__card-list__item {
    justify-items: center;
    text-align: center
}

.add-balance-content__card-list__item:active,
.add-balance-content__card-list__item:hover {
    opacity: 1
}

.add-balance-content__card-list__item_checked-true {
    border-color: var(--blue-saturate-500) !important;
    box-shadow: 0-35px 25px -25px var(--blue-saturate-500_alpha-20), 0 35px 25px -25px var(--blue-saturate-500_alpha-20), 0 0 25px var(--blue-saturate-500_alpha-30);
    pointer-events: none
}

.add-balance-content__card-group {
    display: grid;
    grid-gap: var(--g-15)
}

.add-balance-content__card-group:not(:first-of-type) {
    margin-top: var(--g-45)
}

.add-balance-content__card-group__label {
    display: grid;
    grid-gap: var(--g-10);
    position: relative
}

.add-balance-content__card-item {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    border-radius: var(--g-15);
    border: calc(var(--g-30)/10) solid var(--white_alpha-10);
    background: 0 0;
    font-weight: 500;
    font-size: var(--size-20);
    color: var(--white_alpha-60);
    padding: var(--g-20) var(--g-30);
    width: 100%;
    transition: .2s var(--timing-function_default);
    will-change: opacity;
    outline: 0
}

.add-balance-content__card-item_type-input {
    pointer-events: all
}

.add-balance-content__card-item_type-input:hover {
    border-color: var(--white_alpha-20)
}

.add-balance-content__card-item_type-input:active,
.add-balance-content__card-item_type-input:focus {
    border-color: transparent;
    background: var(--white_alpha-5)
}

.add-balance-content__card-item_type-input::placeholder {
    color: var(--white_alpha-20)
}

.add-balance-content__card-item_type-cost {
    align-items: start;
    border-color: transparent;
    background: var(--white_alpha-5);
    line-height: 36px
}

.add-balance-content__card-item__image {
    height: var(--g-40)
}

.add-balance-content__card-item__mark {
    font-weight: 600;
    color: var(--white)
}

.add-balance-content__card-item__mark_sale-true {
    background: linear-gradient(to right, var(--yellow-300), var(--green-550));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: var(--size-32);
    user-select: none
}

.add-balance-content__card-item__cost {
    display: grid;
    grid-template-columns: auto auto;
    align-items: center;
    justify-items: end;
    grid-gap: var(--g-10);
    text-align: right
}

.add-balance-content__card-dropdown {
    position: absolute;
    background: var(--black);
    border-radius: var(--g-15);
    border: calc(var(--g-30)/10) solid var(--white_alpha-10);
    width: 100%;
    left: 0;
    top: calc(var(--g-50)*1.075);
    box-shadow: 0 35px 115px -50px var(--white_alpha-30);
    text-align: center;
    z-index: 1
}

.add-balance-content__card-dropdown__heading {
    display: block;
    font-weight: 400;
    font-size: var(--size-16);
    color: var(--white_alpha-70);
    padding: var(--g-20) var(--g-15) var(--g-15)
}

.add-balance-content__card-dropdown__list {
    display: block;
    max-height: 240px;
    padding: 0 0 var(--g-20);
    overflow: hidden auto
}

.add-balance-content__card-dropdown__list-item {
    display: block;
    border-top: 1px solid var(--white_alpha-10);
    font-weight: 500;
    font-size: var(--size-20);
    color: var(--blue-450);
    padding: var(--g-10) var(--g-25);
    width: 100%;
    transition: .2s var(--timing-function_default)
}

.add-balance-content__card-dropdown__list-item:hover {
    background: var(--blue-450_alpha-10)
}

.add-balance-content__card-note {
    font-weight: 500;
    font-size: var(--size-14);
    color: var(--white_alpha-30);
    line-height: 1.4
}

.add-balance-content__card-payment {
    display: grid;
    grid-template-rows: auto 1fr auto;
    grid-gap: var(--g-15);
    padding: var(--g-50) var(--g-35);
    height: 100%
}

.add-balance-content__card-payment__option {
    display: grid;
    grid-template-rows: auto 1fr auto;
    border-radius: var(--g-15);
    border: calc(var(--g-30)/10) solid var(--gray-100);
    background-color: var(--white);
    padding: var(--g-25);
    min-height: calc(var(--g-10)*14);
    height: 100%;
    user-select: none;
    text-align: left
}

.add-balance-content__card-payment__option:active,
.add-balance-content__card-payment__option:hover,
.add-balance-legal:hover {
    opacity: 1
}

.add-balance-content__card-payment__option_type-ru {
    background: linear-gradient(85deg, var(--white) 70%, var(--white_alpha-80)), linear-gradient(180deg, var(--ru-color-1) 33%, var(--ru-color-2) 33.01%, var(--ru-color-2) 66%, var(--ru-color-3) 66.01%), var(--white)
}

.add-balance-content__card-payment__option_type-ua {
    background: linear-gradient(85deg, var(--white) 70%, var(--white_alpha-80)), linear-gradient(180deg, var(--ua-color-1) 50%, var(--ua-color-2) 50.01%), var(--white)
}

.add-balance-content__card-payment__option_type-fill {
    border-color: var(--gray-50)
}

.add-balance-content__card-payment__option_checked-true {
    border-color: var(--blue-saturate-500);
    box-shadow: 0-35px 25px -25px var(--blue-saturate-500_alpha-20), 0 35px 25px -25px var(--blue-saturate-500_alpha-20), 0 0 25px var(--blue-saturate-500_alpha-30);
    pointer-events: none
}

.add-balance-content__card-payment__option-heading {
    font-weight: 500;
    font-size: var(--size-18);
    line-height: 1.3;
    color: var(--gray-700);
    max-width: 200px
}

.add-balance-content__card-payment__option-info {
    font-weight: 500;
    font-size: var(--size-14);
    line-height: 1.3;
    color: var(--gray-400)
}

.add-balance-content__card-payment__option-icon {
    height: var(--g-30);
    margin-top: auto
}

.add-balance-content__card-payment__option-icon_alt {
    border-radius: 50%;
    background: var(--gray-100);
    font-size: var(--size-14);
    color: var(--gray-800);
    line-height: var(--g-30);
    width: var(--g-30);
    text-align: center
}

.add-balance-content__card-payment__option-list {
    display: grid;
    grid-auto-flow: column;
    justify-content: left;
    grid-gap: 4px
}

.add-balance-content__card-payment__btn {
    width: 100%;
    user-select: none;
    text-align: left
}

.add-balance-legal {
    line-height: 1.4;
    font-weight: 500;
    font-size: var(--size-20);
    max-width: 920px;
    margin: var(--g-25) auto 0;
    transition: .2s var(--timing-function_default);
    will-change: opacity;
    user-select: none;
    opacity: .4
}

.add-balance-legal__image {
    margin-top: var(--g-25);
    max-height: var(--g-40)
}

@media (max-width:1200px) {
    .add-balance-content {
        grid-template-columns: 1fr
    }

    .add-balance-content__card-list {
        grid-template-columns: 1fr 1fr 1fr
    }
}

@media (max-width:576px) {
    .add-balance-content__card-list {
        grid-template-columns: 1fr 1fr
    }
}

.about-donate {
    display: grid;
    grid-gap: var(--g-25);
    max-width: 1200px;
    width: 100%;
    margin: 0 auto
}

.about-donate__window {
    display: grid;
    grid-gap: var(--g-15);
    padding: var(--g-50) var(--g-45)
}

.about-donate__window-purchase {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: var(--g-15)
}

.about-donate__window-purchase__btn {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    border-radius: var(--g-20);
    padding: var(--g-30) var(--g-45);
    width: 100%;
    text-align: left
}

.about-donate__window-purchase__btn:hover {
    background: var(--black_alpha-90);
    opacity: 1
}

.about-donate__window-purchase__btn-info {
    font-weight: 500;
    font-size: var(--size-24);
    line-height: 1.4;
    color: var(--white_alpha-60)
}

.about-donate__window-purchase__btn-price {
    display: block;
    font-weight: 700;
    font-size: var(--size-36);
    color: var(--white)
}

.about-donate__window-purchase__btn-price_style-success {
    background: linear-gradient(135deg, var(--yellow-300), var(--green-550));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.about-donate__window-purchase__btn-sale {
    display: block;
    position: absolute;
    width: 100%;
    left: 0;
    bottom: calc(100% - var(--g-20));
    text-align: center
}

.about-donate__window-purchase__btn-icon {
    width: var(--g-50)
}

.about-donate__window-upgrade {
    display: block;
    border-radius: 20px;
    padding: var(--g-15) var(--g-35)
}

.about-donate__section {
    display: grid;
    grid-gap: var(--g-25);
    border-radius: 15px;
    border: 2px solid var(--gray-100);
    padding: var(--g-25) var(--g-35)
}

.about-donate__section-heading {
    font-weight: 600;
    font-size: var(--size-24);
    color: var(--gray-700)
}

.about-donate__section-heading__mark {
    color: var(--green-650)
}

.about-donate__list {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    align-items: start;
    grid-gap: var(--g-25) var(--g-15)
}

.about-donate__list_alt {
    grid-gap: var(--g-10)
}

.about-donate__list li {
    height: 100%
}

.about-donate__list-item {
    --heading-color: var(--green-650);
    --background-color: var(--green-300_alpha-10);
    --border-color: transparent;
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    grid-gap: var(--g-10);
    height: 100%;
    transition: .2s var(--timing-function_default);
    will-change: opacity, transform;
    text-align: left
}

.about-donate__list-item_type-miss {
    --heading-color: var(--gray-500);
    --background-color: transparent;
    --border-color: var(--gray-50);
    opacity: .6
}

.about-donate__list-item_type-miss:hover,
.about-donate__list-item_type-miss:hover .badge {
    opacity: 1
}

.about-donate__list-item_alt {
    grid-template-columns: auto;
    justify-items: center;
    align-content: start;
    border-radius: 15px;
    border: 2px solid var(--border-color);
    background: var(--background-color);
    padding: 25px;
    text-align: center
}

.about-donate__list-item__icon {
    width: var(--size-32);
    height: var(--size-32)
}

.about-donate__list-item__info {
    font-weight: 500;
    font-size: var(--size-12);
    color: var(--black_alpha-60)
}

.about-donate__list-item__heading {
    font-weight: 500;
    font-size: var(--size-16);
    color: var(--heading-color);
    margin-bottom: 2px
}

.about-donate__list-item__kit {
    max-width: 100%;
    image-rendering: pixelated
}

@media (max-width:1200px) {
    .about-donate {
        min-width: unset;
        max-width: calc(var(--size-96)*12);
        width: 100%
    }
}

@media (max-width:992px) {
    .about-donate__list {
        grid-template-columns: 1fr 1fr
    }
}

@media (max-width:700px) {
    .about-donate {
        min-width: calc(100vw - 30px)
    }

    .about-donate__list {
        grid-template-columns: 1fr
    }
}

@media (max-width:576px) {
    .about-donate__window-purchase {
        grid-template-columns: 1fr
    }
}

.longread {
    --border-radius: 20px;
    --background-color: var(--black);
    --card-background-color: #151515;
    --text-color-0: var(--white);
    --text-color-1: var(--white);
    --text-color-2: var(--white_alpha-50);
    --text-color-3: var(--white_alpha-30);
    --text-color-4: var(--white_alpha-20);
    background: var(--background-color);
    color: var(--text-color-1);
    padding-top: 0 !important;
    overflow: hidden
}

.longread .wrapper {
    position: relative;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto
}

@media (max-width:1200px) {
    .longread .wrapper {
        padding: 0 var(--g-15)
    }
}

.longread-animated {
    opacity: 0;
    transform: scale(.7);
    transition: .5s var(--timing-function_default);
    will-change: opacity, transform
}

.longread-animated_show-true {
    opacity: 1;
    transform: scale(1)
}

.longread-nolimit {
    max-height: unset !important;
    max-width: unset !important
}

.longread-header {
    position: relative;
    background: linear-gradient(180deg, transparent 35%, rgba(255, 255, 255, .05) 80%, transparent 100%);
    padding: var(--g-100)0;
    text-align: center;
    overflow: hidden
}

.longread-header_display-inner {
    padding: var(--g-100) var(--g-75)
}

.longread-header_display-wide {
    padding: 0
}

.longread-header__lights {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    animation: 4s longread-header__lights linear infinite;
    transform-origin: center;
    will-change: transform, opacity;
    pointer-events: none;
    z-index: 0
}

.longread-header__lights-item {
    position: absolute;
    top: 0;
    max-height: 100vh
}

.longread-header__lights-item:first-child {
    left: 0
}

.longread-header__lights-item:last-child {
    right: 0
}

@media (max-width:992px) {
    .longread-header__lights {
        opacity: .9
    }
}

@media (max-width:768px) {
    .longread-header__lights {
        opacity: .7;
        width: 110%;
        left: -5%;
        top: -20px
    }
}

.longread-header__logo {
    max-width: 100%;
    margin: 0 auto var(--g-50);
    transform-origin: center;
    will-change: transform
}

.longread-header__logo_animated-true {
    animation: longread-header__logo ease-in-out infinite 20s
}

.longread-header__heading {
    font-weight: 600;
    font-size: var(--size-96)
}

.longread-header__heading-mark {
    background: linear-gradient(89.89deg, #5ff 35%, #5f5 70%, #ff5);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.longread-header__paragraph {
    font-weight: 500;
    font-size: var(--size-32);
    line-height: 1.4;
    color: var(--white_alpha-60);
    max-width: 880px;
    margin: var(--g-20) auto 0
}

.longread-header__paragraph_alt {
    color: var(--black_alpha-60)
}

.longread-header__scroll {
    display: inline-block;
    font-weight: 700;
    font-size: var(--size-40);
    line-height: 1.4;
    color: var(--text-color-1);
    margin-top: var(--g-75);
    transition: .2s var(--timing-function_default);
    will-change: transform, opacity;
    transform-origin: center
}

.longread-header__scroll:hover {
    color: var(--text-color-1);
    opacity: .8;
    transform: scale(1.2)
}

.longread-header__scroll:active {
    opacity: .4;
    transform: scale(.8)
}

.longread-header__scroll-icon {
    height: var(--size-64);
    margin-top: var(--g-10);
    animation: longread-header__scroll-icon .8s ease-in-out infinite;
    will-change: transform
}

.longread-header__container {
    position: relative;
    border-radius: var(--g-50);
    padding: var(--g-100)0;
    overflow: hidden
}

.longread-header__container_alt {
    border-radius: var(--g-75) var(--g-75)0 0;
    padding: var(--g-150)0 calc(var(--g-150)*1.5)
}

.longread-header__container_alt::after {
    content: "";
    display: block;
    position: absolute;
    border-radius: var(--g-75) var(--g-75)0 0;
    background: var(--white);
    height: 70px;
    width: 100%;
    left: 0;
    bottom: 0
}

.longread-header__container-backdrop {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform-origin: center;
    z-index: 0
}

.longread-header__container-backdrop_style-spring-1,
.longread-header__container-backdrop_style-spring-2 {
    background-size: 200% 200% !important;
    transform: scale(2.25);
    animation: longread-header__container-backdrop_rotate 10s ease-in-out infinite;
    height: 200%;
    top: -50%
}

.longread-header__container-backdrop_style-spring-1 {
    background: radial-gradient(#e3f230 15%, rgba(18, 230, 113, .2) 75%) right bottom
}

.longread-header__container-backdrop_style-spring-2 {
    background: radial-gradient(#ff28fb 25%, rgba(0, 119, 255, .2) 75%) left top;
    animation-delay: 5s;
    opacity: 0
}

.longread-nav__checkbox {
    display: none
}

.longread-nav__checkbox:checked~.longread-nav__menu {
    transform: translateX(420px)
}

.longread-nav__checkbox:checked~.longread-nav__btn {
    --display-text-1: none;
    --display-text-2: grid
}

.longread-nav__btn {
    --display-text-1: grid;
    --display-text-2: none;
    --opacity: .8;
    position: fixed;
    border-radius: 100px;
    background: rgba(102, 102, 102, .5);
    padding: var(--g-10) var(--g-20);
    left: var(--g-25);
    bottom: var(--g-25);
    transition: .2s var(--timing-function_default);
    -webkit-backdrop-filter: blur(35px);
    backdrop-filter: blur(35px);
    user-select: none;
    z-index: 50;
    cursor: pointer
}

.longread-nav__btn * {
    cursor: pointer
}

.longread-nav__btn:hover {
    --opacity: 1;
    background: #333;
    transform: scale(1.15)
}

.longread-nav__btn:active {
    opacity: .7;
    transform: scale(.9)
}

.longread-nav__btn-icon,
.longread-nav__btn-text {
    opacity: var(--opacity);
    transition: .2s var(--timing-function_default)
}

.longread-nav__btn-icon {
    width: var(--size-24)
}

.longread-nav__btn-text {
    display: var(--display-text-1);
    grid-auto-flow: column;
    align-items: center;
    grid-gap: var(--g-10);
    font-family: "NEXT ART", sans-serif;
    font-weight: 600;
    font-size: var(--size-24);
    color: var(--text-color-1);
    line-height: 1.3
}

.longread-nav__btn-text_display-inverted {
    display: var(--display-text-2)
}

.longread-nav__start {
    position: fixed;
    right: var(--g-25);
    bottom: var(--g-25);
    z-index: 50;
    animation: longread-nav__start 40s ease-in-out infinite;
    will-change: transform
}

.longread-nav__menu {
    display: block;
    position: fixed;
    border-right: 3px solid var(--text-color-3);
    background: var(--black_alpha-70);
    width: 400px;
    height: 100%;
    top: 0;
    left: -420px;
    padding: var(--g-50) var(--g-25) 25%;
    transition: .2s var(--timing-function_default);
    -webkit-backdrop-filter: blur(35px);
    backdrop-filter: blur(35px);
    will-change: transform, opacity;
    overflow: hidden auto;
    z-index: 10
}

.longread-nav__menu-heading {
    font-family: "NEXT ART", sans-serif;
    font-weight: 700;
    font-size: var(--size-32);
    color: var(--text-color-1);
    line-height: 1.4;
    text-align: center
}

.longread-nav__menu-list {
    display: grid;
    grid-gap: 5px;
    margin-top: var(--g-10)
}

.longread-nav__menu-separator {
    font-weight: 300;
    font-size: var(--size-24);
    color: var(--white_alpha-10);
    line-height: var(--size-16);
    margin-top: var(--g-10);
    text-align: center
}

.longread-nav__menu-item {
    display: block;
    position: relative;
    border-radius: 100px;
    background: var(--white_alpha-5);
    padding: 5px var(--g-15);
    font-weight: 500;
    font-size: var(--size-14);
    color: var(--white_alpha-70);
    transition: .2s var(--timing-function_default);
    will-change: transform, opacity
}

.longread-nav__menu-item:hover {
    --display-img: block;
    background: var(--white_alpha-10);
    color: var(--text-color-1);
    transform: scale(1.1);
    z-index: 1
}

.longread-nav__menu-item:active {
    opacity: .7;
    transform: scale(.9)
}

.longread-nav__menu-item__img {
    display: var(--display-img, none);
    position: absolute;
    border-radius: 5px;
    background: var(--background-color);
    object-fit: cover;
    height: 350%;
    width: 100%;
    top: -250%;
    right: 0
}

.longread-nav__menu-item__img_alt {
    object-position: center top
}

.longread-section {
    padding: var(--g-100)0
}

.longread-section_type-standalone {
    border-radius: var(--g-75) var(--g-75)0 0;
    padding: calc(var(--g-100)*2)0;
    box-shadow: 0-50px 50px var(--black_alpha-10)
}

.longread-section__cover {
    position: relative;
    max-width: 2560px;
    width: 100%;
    margin-right: auto;
    margin-left: auto
}

.longread-section__cover::before {
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    pointer-events: none;
    box-shadow: inset 0 0 var(--g-15) var(--g-20) var(--background-color), inset 0 0 var(--g-75) var(--g-75) var(--background-color)
}

.longread-section__cover-img {
    object-fit: cover;
    width: 100%;
    max-height: 640px
}

.longread-section__cover-img_style-skills {
    background: linear-gradient(to top, var(--green-300), var(--yellow-300));
    image-rendering: pixelated
}

.longread-section__cover-img_animated-true {
    animation: longread-section__cover-img ease-in-out infinite 20s
}

.longread-section__cover_view-modern {
    border-radius: var(--g-45);
    background: var(--black);
    margin: 0 var(--g-25);
    overflow: hidden
}

.longread-section__cover_view-modern::before {
    display: none
}

.longread-section__cover-wallpaper {
    display: grid;
    align-content: center;
    position: relative;
    min-height: 85vh;
    padding: var(--g-100)0;
    z-index: 1
}

.longread-section__cover-gradient {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    animation: longread-section__cover-gradient linear 20s infinite both;
    opacity: 1;
    pointer-events: none;
    will-change: transform, opacity;
    z-index: 1
}

.longread-section__heading {
    font-weight: 600;
    font-size: var(--size-80);
    color: var(--text-color-1);
    margin-top: var(--g-25);
    text-align: center
}

.longread-section__paragraph {
    font-weight: 500;
    font-size: var(--size-24);
    color: var(--white_alpha-60);
    line-height: 1.4;
    max-width: 800px;
    margin: var(--g-10) auto 0;
    text-align: center
}

.longread-section__list {
    display: grid;
    grid-gap: var(--g-25);
    margin-top: var(--g-50)
}

.longread-section__group {
    padding: var(--g-50)0
}

.longread-section__cards {
    margin-top: var(--g-35)
}

.longread-section__cards-item {
    padding: var(--g-10)
}

.longread-feature {
    position: relative;
    border-radius: 15px;
    background-color: var(--card-background-color);
    width: 100%;
    max-width: 1600px;
    height: 100%;
    margin: auto;
    overflow: hidden
}

.longread-feature_alt {
    overflow: unset;
    z-index: 1
}

.longread-feature_alt .longread-feature__content {
    padding: var(--g-35);
    min-height: unset
}

.longread-feature_style-gold {
    background-color: var(--orange-400_alpha-30)
}

.longread-feature_style-green {
    background-color: var(--green-300_alpha-30)
}

.longread-feature_style-purple {
    background-color: var(--purple-300_alpha-30)
}

.longread-feature_style-white {
    background-color: var(--red-400_alpha-40)
}

.longread-feature_style-red {
    background-color: var(--red-600_alpha-30)
}

.longread-feature_style-blue {
    background-color: var(--blue-saturate-500_alpha-30)
}

.longread-feature_style-violet {
    background-color: var(--violet-300_alpha-10)
}

.longread-feature_style-blue .longread-feature__content,
.longread-feature_style-gold .longread-feature__content,
.longread-feature_style-green .longread-feature__content,
.longread-feature_style-purple .longread-feature__content,
.longread-feature_style-red .longread-feature__content,
.longread-feature_style-violet .longread-feature__content,
.longread-feature_style-white .longread-feature__content {
    background: unset
}

.longread-feature:nth-child(2n) {
    --dir: to right;
    --left-img: 0
}

.longread-feature:nth-child(2n) .row:first-child {
    justify-content: end
}

.longread-feature__cover {
    padding: var(--g-10)
}

.longread-feature__cover-img {
    display: block;
    border-radius: var(--g-10);
    object-fit: cover;
    width: 100%;
    max-height: calc(var(--size-48)*10)
}

.longread-feature__img {
    position: absolute;
    object-fit: cover;
    height: 100%;
    width: 45%;
    top: 0;
    left: var(--left-img, 55%);
    transform-origin: center;
    will-change: transform, opacity;
    perspective: 500px
}

.longread-feature__img_animate-2 {
    animation: longread-feature__img-2 6s linear infinite both
}

.longread-feature__img_animate-3 {
    animation: longread-feature__img-3 9s linear infinite both
}

.longread-feature__img_slide-2 {
    animation-delay: 3s
}

.longread-feature__img_slide-3 {
    animation-delay: 6s
}

.longread-feature__content {
    position: relative;
    background: linear-gradient(var(--dir, to left), transparent 15%, var(--card-background-color) 45%);
    padding: var(--g-75);
    min-height: calc(var(--size-36)*10)
}

.longread-feature__content_padding-35 {
    padding: var(--g-35) !important
}

.longread-feature__content-img {
    border-radius: var(--g-10);
    object-fit: cover;
    height: calc(var(--size-32)*10);
    width: 100%
}

.longread-feature__point {
    align-items: center;
    border-radius: 5px;
    background: var(--background-color);
    font-size: var(--size-12);
    color: var(--white_alpha-40);
    line-height: 1.4;
    padding: var(--g-15);
    margin: 0
}

.longread-feature__point:not(:first-child) {
    margin-top: var(--g-10)
}

.longread-feature__point [class*=col] {
    padding: 0
}

.longread-feature__point-heading {
    font-family: "NEXT ART", sans-serif;
    font-weight: 700;
    font-size: var(--size-16);
    color: var(--white_alpha-80)
}

.longread-feature__point-info {
    font-weight: 500;
    color: var(--text-color-2);
    text-align: right
}

.longread-feature__screen-area {
    display: grid;
    grid-template-rows: calc(var(--size-32)*5) auto;
    border-radius: var(--g-10);
    background: var(--white_alpha-10);
    padding: 0;
    text-align: center
}

.longread-feature__screen-area__img {
    position: relative;
    border-radius: var(--g-10);
    object-fit: cover;
    width: 100%;
    max-height: calc(var(--size-32)*5);
    pointer-events: all;
    transition: .2s var(--timing-function_default);
    will-change: transform;
    z-index: 10
}

.longread-feature__screen-area__img:hover {
    max-height: unset;
    transform: scale(1.2) translateY(-140px)
}

.longread-feature__screen-area__text {
    padding: var(--g-10);
    font-weight: 500;
    font-size: var(--size-14);
    color: var(--text-color-2)
}

@media (max-width:768px) {
    .longread-feature__img {
        height: 320px;
        width: 130%;
        top: -10%;
        left: -15%
    }

    .longread-feature__content:not(.longread-feature__content_alt) {
        padding-top: 200px;
        background: linear-gradient(to bottom, transparent 140px, var(--card-background-color) 240px 100%)
    }
}

.longread-card {
    border-radius: var(--g-30);
    background-color: var(--card-background-color);
    height: 100%;
    overflow: hidden
}

.longread-card_size-xxl {
    border-radius: var(--g-75);
    padding: var(--g-75)
}

.longread-card_grid-true {
    display: grid;
    align-content: space-between
}

.longread-card_view-overlay {
    display: grid;
    min-height: calc(var(--g-50)*16)
}

.longread-card_view-overlay .longread-card__img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    max-width: unset;
    object-fit: cover;
    z-index: 0
}

.longread-card_view-overlay .longread-card__content {
    position: relative;
    z-index: 1
}

.longread-card_alt-1 {
    border: 4px solid var(--white_alpha-10);
    background: 0 0
}

.longread-card__heading {
    font-weight: 600;
    font-size: var(--size-24);
    line-height: 1.1;
    color: var(--text-color-0)
}

.longread-card__heading_size-sm {
    font-size: var(--size-18)
}

.longread-card__heading_size-md {
    font-size: var(--size-36)
}

.longread-card__heading_size-lg {
    font-size: var(--size-48)
}

.longread-card__heading_size-xl {
    font-size: var(--size-64);
    font-weight: 700
}

.longread-card__heading_size-xxl {
    font-size: var(--size-96);
    font-weight: 700
}

.longread-card__heading-mark {
    font: inherit;
    background: unset;
    opacity: .3
}

.longread-card__paragraph {
    font-size: var(--size-24);
    line-height: 1;
    color: var(--black_alpha-80)
}

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

.longread-card__img_style-mini {
    max-width: 240px
}

.longread-card__img_type-wide {
    max-width: 920px
}

.longread-card__content {
    padding: var(--g-60) var(--g-50)
}

.longread-card__content_shadow-bottom {
    background: linear-gradient(to top, var(--black_alpha-90) 35%, transparent)
}

.longread-card__content_shadow-top {
    background: linear-gradient(to bottom, var(--black_alpha-90) 35%, transparent)
}

.longread-card__anchor {
    display: block;
    position: relative;
    padding: var(--g-15) var(--g-25);
    height: 100%;
    transform: scale(1);
    transition: .2s var(--timing-function_default)
}

.longread-card__anchor>* {
    position: relative;
    z-index: 1
}

.longread-card__anchor::before {
    content: "";
    display: block;
    position: absolute;
    border-radius: var(--g-15);
    background-color: var(--default);
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 0;
    transform: scale(0);
    transform-origin: center;
    transition: .2s ease-in;
    z-index: 0
}

.longread-card__anchor:hover {
    transform-origin: center;
    transform: scale(.9)
}

.longread-card__anchor:hover::before {
    opacity: 1;
    transform: scale(1.05);
    transition: .2s var(--timing-function_default)
}

.longread-boss {
    --gap: var(--g-50);
    margin: var(--gap)0 0
}

.longread-boss__row {
    gap: calc(var(--gap)*1.5);
    margin: calc(var(--gap)*1.5)0 0
}

.longread-boss__card {
    border-radius: 15px;
    border: 2px solid rgba(255, 255, 255, .1);
    padding: var(--g-10)
}

@media (min-width:769px) {
    .longread-boss__card+.longread-boss__card {
        position: relative;
        top: calc(var(--gap)*2)
    }
}

.longread-boss__card-image {
    display: block;
    border-radius: 10px;
    object-fit: cover;
    height: calc(var(--size-32)*10);
    width: 100%
}

.longread-boss__card-image_alt {
    height: calc(var(--size-32)*5)
}

.longread-boss__card-info {
    padding: var(--g-25) var(--g-15)
}

.longread-boss__card-heading {
    font-family: "NEXT ART", sans-serif;
    font-weight: 600;
    font-size: var(--size-32);
    color: var(--text-color-1)
}

.longread-boss__card-stats {
    margin-top: var(--g-15)
}

.longread-boss__card-stats li {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 8px;
    padding: var(--g-10)0
}

.longread-boss__card-stats li:not(:last-child) {
    border-bottom: 2px solid var(--white_alpha-15)
}

.longread-boss__card-stats__icon {
    object-fit: contain;
    height: var(--size-24);
    width: var(--size-24);
    image-rendering: pixelated
}

.longread-boss__card-stats__info {
    font-weight: 600;
    font-size: var(--size-18);
    color: #d1d5db
}

.longread-boss__card-stats__info-mark_style-green {
    color: var(--green-300)
}

.longread-boss__card-stats__info-mark_style-yellow {
    color: var(--yellow-300)
}

.longread-boss__card-stats__info-mark_style-gold {
    color: var(--orange-400)
}

.longread-boss__card-stats__info-mark_style-red {
    color: var(--red-400)
}

.longread-boss__card-stats__info-mark_style-white {
    color: var(--text-color-1)
}

.longread-boss__card-stats__info-small {
    display: block;
    font-weight: 500;
    font-size: var(--size-12);
    line-height: 1.5;
    color: #6f6f6f
}

.longread-boss__tooltip {
    text-align: left
}

.longread-boss__tooltip li {
    display: block !important;
    color: var(--white_alpha-60);
    font-size: 14px
}

.longread-boss__tooltip strong {
    display: block;
    color: var(--text-color-1)
}

@media (max-width:992px) {
    .longread-boss {
        --gap: var(--g-20)
    }
}

.longread-mobs {
    grid-gap: 5px var(--g-10);
    margin: 0
}

.longread-component__img {
    display: block;
    border-radius: 15px;
    width: 100%;
    max-height: calc(var(--size-48)*10)
}

.longread-component__heading {
    font-family: "NEXT ART", "Montserrat", sans-serif;
    font-weight: 600;
    font-size: var(--size-40);
    line-height: 1.4;
    color: var(--text-color-1)
}

.longread-component__heading-mark {
    display: inline;
    font: inherit;
    color: var(--green-300);
    text-shadow: 0 0 15px var(--green-300_alpha-50)
}

.longread-component__heading-mark_style-secondary {
    color: var(--text-color-4);
    text-shadow: unset
}

.longread-component__heading-mark_style-gold {
    color: var(--orange-400);
    text-shadow: 0 0 15px var(--orange-400_alpha-50)
}

.longread-component__heading-mark_style-yellow {
    color: var(--yellow-300);
    text-shadow: 0 0 15px var(--yellow-300_alpha-40)
}

.longread-component__heading-mark_style-red {
    color: var(--red-400);
    text-shadow: 0 0 15px var(--red-400_alpha-50)
}

.longread-component__heading-mark_style-purple {
    color: var(--purple-300);
    text-shadow: 0 0 15px var(--purple-300_alpha-50)
}

.longread-component__heading-mark_style-blue {
    color: var(--blue-saturate-500);
    text-shadow: 0 0 15px var(--blue-saturate-500_alpha-50)
}

.longread-component__heading-mark_style-aqua {
    color: var(--aqua-300);
    text-shadow: 0 0 15px var(--aqua-300_alpha-40)
}

.longread-component__text {
    font-weight: 500;
    font-size: var(--size-18);
    line-height: 1.4;
    color: var(--text-color-2)
}

.longread-component__text:first-of-type {
    margin-top: var(--g-20)
}

.longread-component__text:not(:first-of-type) {
    margin-top: var(--g-5)
}

.longread-component__text_view-li {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-gap: var(--g-10)
}

.longread-component__text_view-li::before {
    content: "—";
    font-weight: 700;
    font-size: inherit;
    color: var(--text-color-1)
}

.longread-component__text_size-sm {
    font-size: var(--size-16)
}

.longread-component__text_size-md {
    font-size: var(--size-20)
}

.longread-component__text_size-lg {
    font-size: var(--size-24)
}

.longread-component__text_size-xl {
    font-size: var(--size-32)
}

.longread-component__text-mark {
    color: var(--text-color-1)
}

.longread-component__text-darken {
    color: var(--text-color-3)
}

.longread-component__item {
    --drop-shadow-color-1: transparent;
    --drop-shadow-color-3: var(--text-color-3);
    border-radius: 15px;
    border: 2px solid var(--white_alpha-10);
    padding: var(--g-10);
    text-align: center;
    animation: 3s longread-component__item ease-in-out infinite
}

.longread-component__item_animation-false {
    animation: unset
}

.longread-component__item_style-none {
    --drop-shadow-color-1: transparent;
    --drop-shadow-color-3: transparent
}

.longread-component__item_style-light {
    --drop-shadow-color-1: var(--text-color-1)
}

.longread-component__item_style-red {
    --drop-shadow-color-1: #FFBDBD;
    --drop-shadow-color-3: #E90E0E
}

.longread-component__item_style-yellow {
    --drop-shadow-color-1: #F8FFE7;
    --drop-shadow-color-3: #FFFFAA
}

.longread-component__item_style-blue {
    --drop-shadow-color-1: #D4F2FB;
    --drop-shadow-color-3: #4DC2DC
}

.longread-component__item_style-green {
    --drop-shadow-color-1: #E3F5B2;
    --drop-shadow-color-3: #ADED5D
}

.longread-component__item_style-brown {
    --drop-shadow-color-1: #EFA13D;
    --drop-shadow-color-3: #B55A00
}

.longread-component__item_style-purple {
    --drop-shadow-color-1: #F9D6F0;
    --drop-shadow-color-3: #E565C4
}

.longread-component__item_style-gold {
    --drop-shadow-color-1: #FFFFCE;
    --drop-shadow-color-3: #FF8103
}

.longread-component__item_style-rainbow {
    --drop-shadow-color-1: rgba(230, 197, 221, 0.7)
}

.longread-component__item_style-rainbow .longread-component__item-icon {
    filter: drop-shadow(-3px -1px 0 var(--drop-shadow-color-1)) drop-shadow(5px 5px 0 rgba(0, 0, 0, .6)) drop-shadow(0-20px 25px #e90e0e) drop-shadow(0 20px 25px #ab09c3)
}

.longread-component__item_size-md {
    padding: var(--g-15)
}

.longread-component__item_size-md .longread-component__item-icon {
    width: var(--size-96)
}

.longread-component__item_size-lg {
    margin: var(--size-32)0
}

.longread-component__item_size-lg .longread-component__item-icon {
    width: unset;
    height: calc(var(--size-96)*2);
    margin: calc(var(--size-32)*-1)0
}

.longread-component__item_size-xl {
    margin: var(--size-48)0
}

.longread-component__item_size-xl .longread-component__item-icon {
    width: unset;
    height: calc(var(--size-96)*3);
    margin: calc(var(--size-48)*-1)0
}

.longread-component__item_shadow-lg {
    --shadow-size: 75px
}

.longread-component__item_shadow-disabled {
    --drop-shadow-color-1: transparent !important
}

.longread-component__item_view-modern {
    border-width: 3px;
    margin: 0
}

.longread-component__group_view-modern.longread-component__group_size-md .longread-component__item,
.longread-component__item_view-modern.longread-component__item_size-md {
    padding: var(--g-25)0
}

.longread-component__group_view-modern.longread-component__group_size-lg .longread-component__item,
.longread-component__item_view-modern.longread-component__item_size-lg {
    padding: var(--g-35)0
}

.longread-component__group_view-modern.longread-component__group_size-xl .longread-component__item,
.longread-component__item_view-modern.longread-component__item_size-xl {
    padding: var(--g-45)0
}

.longread-component__item_view-modern .longread-component__item-icon {
    margin: unset
}

.longread-component__item-icon {
    pointer-events: all;
    width: var(--size-64);
    image-rendering: pixelated;
    transition: .2s filter var(--timing-function_default);
    filter: blur(0) saturate(1) drop-shadow(-3px -1px 0 var(--drop-shadow-color-1)) drop-shadow(5px 5px 0 rgba(0, 0, 0, .6)) drop-shadow(0 5px var(--shadow-size, 25px) var(--drop-shadow-color-3))
}

.longread-component__item-icon:active,
.longread-component__item-icon:focus {
    filter: blur(100px) saturate(3)
}

.longread-component__group_type-block .longread-component__item-icon {
    image-rendering: unset
}

.longread-component__group_scale-20 .longread-component__item-icon {
    transform: scale(1.2)
}

.longread-component__group_scale-50 .longread-component__item-icon {
    transform: scale(1.5)
}

.longread-component__group_shadow-lg .longread-component__item {
    --shadow-size: var(--g-75)
}

.longread-component__group_shadow-disabled .longread-component__item {
    --drop-shadow-color-1: transparent !important
}

.longread-component__group_size-md .longread-component__item {
    padding: var(--g-15)
}

.longread-component__group_size-md .longread-component__item-icon {
    width: var(--size-96)
}

.longread-component__group_size-lg .longread-component__item {
    margin: var(--size-32)0
}

.longread-component__group_size-lg .longread-component__item-icon {
    width: unset;
    height: calc(var(--size-96)*2);
    margin: calc(var(--size-32)*-1)0
}

.longread-component__group_size-xl .longread-component__item {
    margin: var(--size-48)0
}

.longread-component__group_size-xl .longread-component__item-icon {
    width: unset;
    height: calc(var(--size-96)*3);
    margin: calc(var(--size-48)*-1)0
}

.longread-component__group_view-modern {
    border-width: 3px;
    margin: 0
}

.longread-component__group_view-modern .longread-component__item-icon {
    margin: unset
}

.longread-component__row {
    grid-gap: var(--g-25)0
}

.longread-component__row_gap-45 {
    grid-gap: var(--g-45)0
}

.longread-component__separator {
    text-align: center
}

.longread-component__separator::before {
    content: "***";
    font-size: var(--size-64);
    font-weight: 300;
    line-height: 0;
    color: var(--black_alpha-10);
    letter-spacing: var(--g-10);
    vertical-align: bottom
}

.longread-component__separator_alt::before {
    color: var(--white_alpha-20)
}

.longread-component__gallery {
    justify-content: center;
    grid-gap: var(--g-25);
    margin: var(--g-25) auto 0;
    padding: 0 var(--g-50);
    max-width: 2560px;
    width: 100%
}

.longread-component__gallery [class*=col] {
    padding: 0
}

@media (max-width:1200px) {
    .longread-component__gallery {
        padding: 0 15px
    }
}

@media (min-width:768px) {
    .longread-component__gallery-overview [class*=col]:nth-child(even) {
        top: var(--g-150)
    }
}

.longread-component__gallery-img {
    display: block;
    border-radius: var(--g-25);
    width: 100%
}

.longread-component__gallery img {
    max-height: calc(var(--size-48)*10);
    object-fit: cover
}

.longread-articles {
    --text-color-1: #fff;
    --text-color-2: #858c8e;
    --text-color-3: #565b5c;
    max-width: 1720px;
    width: 100%;
    margin: auto
}

.longread-articles__preview {
    border-radius: var(--g-10);
    height: calc(var(--size-32)*10);
    width: 100%;
    object-fit: cover
}

.longread-articles .longread-card {
    border-radius: var(--g-45);
    background: var(--black);
    padding: var(--g-150) var(--g-100)
}

.longread-articles .longread-card__heading {
    color: var(--white)
}

.longread-articles .longread-card__paragraph {
    color: #b3b7bc
}

.longread-articles .longread-card__anchor {
    padding: var(--g-35) var(--g-25)
}

.longread-articles .longread-card__anchor::before {
    background-color: var(--white_alpha-5)
}

.longread-footer {
    background: unset;
    padding: var(--g-150) var(--g-25);
    text-align: left
}

.longread-footer::after {
    content: "";
    display: block;
    position: absolute;
    background: linear-gradient(to bottom, #000 25%, transparent);
    top: -2px;
    left: 0;
    width: 100%;
    height: 50px;
    pointer-events: none;
    z-index: 0
}

.longread-footer__heading,
.longread-footer__subheading {
    font-family: "NEXT ART", sans-serif;
    font-weight: 500;
    line-height: 1.4
}

.longread-footer__heading {
    font-size: var(--size-64);
    margin: 0 auto var(--g-100);
    text-align: center
}

.longread-footer__subheading {
    font-size: var(--size-24);
    color: var(--white_alpha-60);
    margin-bottom: 4px
}

.longread-footer__item {
    font-size: var(--size-24)
}

.longread-footer__item_alt {
    color: var(--text-color-3)
}

.longread-footer__row {
    grid-gap: var(--g-50)0
}

.longread-footer__copyright {
    font-family: "NEXT ART", sans-serif;
    color: var(--text-color-3);
    margin-top: var(--g-50);
    text-align: center
}

.longread_view-light {
    --background-color: var(--white);
    --card-background-color: #f8f6f9;
    --text-color-0: var(--black);
    --text-color-1: var(--black_alpha-80);
    --text-color-2: var(--black_alpha-50);
    --text-color-3: var(--black_alpha-30);
    --text-color-4: var(--black_alpha-20)
}

.longread_view-light .longread-header__scroll {
    color: var(--white)
}

.longread_view-light .longread-nav__btn {
    background: var(--black)
}

.longread_view-light .longread-nav__btn-text {
    color: var(--white)
}

.longread_view-light .longread-nav__menu {
    border-right-color: var(--black_alpha-10);
    background: var(--white_alpha-70)
}

.longread_view-light .longread-nav__menu-separator {
    color: var(--black_alpha-10)
}

.longread_view-light .longread-nav__menu-item {
    background: var(--black_alpha-5);
    color: var(--black_alpha-70)
}

.longread_view-light .longread-nav__menu-item:hover {
    background: var(--black_alpha-10)
}

.longread_view-light .longread-nav__menu-item:active {
    opacity: .7;
    transform: scale(.9)
}

.longread_view-light .longread-component__item {
    border-color: var(--black_alpha-10)
}

.longread_view-without-angle {
    border-radius: 0
}

.longread_view-without-angle::after {
    display: none
}

.vacancy {
    background: var(--black)url(../img/misc/vacancy-header.svg)no-repeat center top;
    background-size: 100%;
    padding: calc(var(--g-100)*2.5)0
}

.vacancy-heading {
    font-family: "NEXT ART", sans-serif;
    font-weight: 600;
    font-size: var(--size-72);
    line-height: 1.3;
    color: var(--white)
}

.vacancy-heading__mark {
    display: block;
    background: linear-gradient(90deg, var(--blue-450) 20%, var(--aqua-300) 80%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-family: inherit;
    font-size: var(--size-96);
    text-shadow: 0 0 45px var(--blue-450_alpha-50), 0 0 100px var(--blue-450_alpha-50)
}

.vacancy-info {
    font-size: var(--size-32);
    line-height: 1.3;
    color: var(--white_alpha-50);
    margin: var(--g-35) auto 0
}

.vacancy-about {
    display: grid;
    grid-template-columns: minmax(45%, 1fr) 1fr;
    grid-gap: var(--g-100);
    margin-top: var(--g-100)
}

.vacancy-about__side-img {
    width: calc(var(--g-100)*9);
    max-height: calc(var(--g-100)*10);
    object-fit: contain
}

.vacancy-about__group:not(:first-child) {
    margin-top: var(--g-75)
}

.vacancy-about__group-heading {
    font-family: "NEXT ART", sans-serif;
    font-style: normal;
    font-weight: 600;
    font-size: var(--size-64);
    line-height: 1.3;
    color: var(--white)
}

.vacancy-about__group-list {
    margin-top: var(--g-25)
}

.vacancy-about__group-list__item {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-gap: var(--g-10);
    font-weight: 500;
    font-size: var(--size-24);
    line-height: 1.5;
    color: var(--white_alpha-50);
    margin-top: var(--g-10)
}

.vacancy-about__group-list__item::before {
    content: "—";
    font-weight: 700;
    font-size: inherit;
    color: var(--white)
}

.vacancy-action {
    display: block;
    font-family: "NEXT ART", sans-serif;
    font-size: var(--size-64);
    width: 100%;
    padding: var(--g-25);
    margin-top: var(--g-100);
    text-align: center
}

@media (max-width:1200px) {
    .vacancy-about {
        grid-template-columns: minmax(55%, 1fr) 1fr
    }
}

@media (max-width:768px) {
    .vacancy-about {
        grid-template-columns: 1fr;
        grid-gap: 0
    }

    .vacancy-about__side-img {
        display: none
    }
}

.ui-kit {
    padding: var(--g-100) var(--g-25);
    width: 100%;
    max-width: 1920px;
    min-width: 1720px;
    margin: auto
}

.ui-kit__quote {
    border-radius: 35px;
    border: 3px solid var(--gray-100);
    font-weight: 400;
    font-size: var(--size-32);
    color: var(--gray-400);
    max-width: 1400px;
    width: 100%;
    margin: auto;
    padding: var(--g-50) var(--g-75)
}

.ui-kit__separator::before {
    content: "* * *";
    display: block;
    font-size: var(--size-96);
    color: var(--gray-100);
    margin: var(--g-100)0;
    height: 80px;
    text-align: center
}

.ui-kit__grid,
.ui-kit__grid-group {
    display: grid;
    justify-content: center
}

.ui-kit__grid {
    grid-gap: var(--g-100);
    padding: 0 var(--g-50)
}

.ui-kit__grid-group {
    grid-gap: var(--g-25)
}

.ui-kit__grid-row {
    display: flex;
    grid-auto-flow: column;
    flex-wrap: wrap;
    justify-items: start;
    align-items: start;
    grid-gap: var(--g-35)
}

.ui-kit__grid-row .input {
    width: unset
}

.ui-kit__links {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    padding: 5px
}

.ui-kit__links-column {
    display: grid;
    align-content: start;
    justify-content: center;
    grid-gap: var(--g-15);
    border-radius: 30px;
    font-size: var(--size-24);
    padding: var(--g-50) var(--g-75);
    text-align: center
}

.ui-kit__links-column_alt {
    background: var(--black)
}

.ui-kit__inline,
.ui-kit__inline-row {
    justify-content: center;
    justify-items: center;
    grid-gap: var(--g-15)
}

.ui-kit__inline {
    display: grid
}

.ui-kit__inline-row {
    display: flex;
    flex-wrap: wrap;
    font-size: var(--size-24);
    color: var(--gray-600)
}

.ui-kit__privileges {
    display: grid;
    grid-template-columns: repeat(2, 800px);
    justify-content: center;
    grid-gap: var(--g-75);
    background: var(--black);
    padding: var(--g-150) var(--g-35)
}

.m-05 {
    margin: var(--g-5)
}

.m-10 {
    margin: var(--g-10)
}

.m-15 {
    margin: var(--g-15)
}

.m-20 {
    margin: var(--g-20)
}

.m-25 {
    margin: var(--g-25)
}

.m-30 {
    margin: var(--g-30)
}

.m-35 {
    margin: var(--g-35)
}

.m-40 {
    margin: var(--g-40)
}

.m-45 {
    margin: var(--g-45)
}

.m-50 {
    margin: var(--g-50)
}

.m-75 {
    margin: var(--g-75)
}

.m-100 {
    margin: var(--g-100)
}

.m-150 {
    margin: var(--g-150)
}

.mt-05 {
    margin-top: var(--g-5)
}

.mt-10 {
    margin-top: var(--g-10)
}

.mt-15 {
    margin-top: var(--g-15)
}

.mt-20 {
    margin-top: var(--g-20)
}

.mt-25 {
    margin-top: var(--g-25)
}

.mt-30 {
    margin-top: var(--g-30)
}

.mt-35 {
    margin-top: var(--g-35)
}

.mt-40 {
    margin-top: var(--g-40)
}

.mt-45 {
    margin-top: var(--g-45)
}

.mt-50 {
    margin-top: var(--g-50)
}

.mt-75 {
    margin-top: var(--g-75)
}

.mt-100 {
    margin-top: var(--g-100)
}

.mt-150 {
    margin-top: var(--g-150)
}

.mb-05 {
    margin-bottom: var(--g-5)
}

.mb-10 {
    margin-bottom: var(--g-10)
}

.mb-15 {
    margin-bottom: var(--g-15)
}

.mb-20 {
    margin-bottom: var(--g-20)
}

.mb-25 {
    margin-bottom: var(--g-25)
}

.mb-30 {
    margin-bottom: var(--g-30)
}

.mb-35 {
    margin-bottom: var(--g-35)
}

.mb-40 {
    margin-bottom: var(--g-40)
}

.mb-45 {
    margin-bottom: var(--g-45)
}

.mb-50 {
    margin-bottom: var(--g-50)
}

.mb-75 {
    margin-bottom: var(--g-75)
}

.mb-100 {
    margin-bottom: var(--g-100)
}

.mb-150 {
    margin-bottom: var(--g-150)
}

.mx-05 {
    margin-left: var(--g-5);
    margin-right: var(--g-5)
}

.mx-10 {
    margin-left: var(--g-10);
    margin-right: var(--g-10)
}

.mx-15 {
    margin-left: var(--g-15);
    margin-right: var(--g-15)
}

.mx-20 {
    margin-left: var(--g-20);
    margin-right: var(--g-20)
}

.mx-25 {
    margin-left: var(--g-25);
    margin-right: var(--g-25)
}

.mx-30 {
    margin-left: var(--g-30);
    margin-right: var(--g-30)
}

.mx-35 {
    margin-left: var(--g-35);
    margin-right: var(--g-35)
}

.mx-40 {
    margin-left: var(--g-40);
    margin-right: var(--g-40)
}

.mx-45 {
    margin-left: var(--g-45);
    margin-right: var(--g-45)
}

.mx-50 {
    margin-left: var(--g-50);
    margin-right: var(--g-50)
}

.mx-75 {
    margin-left: var(--g-75);
    margin-right: var(--g-75)
}

.mx-100 {
    margin-left: var(--g-100);
    margin-right: var(--g-100)
}

.mx-150 {
    margin-left: var(--g-150);
    margin-right: var(--g-150)
}

.p-05 {
    padding: var(--g-5)
}

.p-10 {
    padding: var(--g-10)
}

.p-15 {
    padding: var(--g-15)
}

.p-20 {
    padding: var(--g-20)
}

.p-25 {
    padding: var(--g-25)
}

.p-30 {
    padding: var(--g-30)
}

.p-35 {
    padding: var(--g-35)
}

.p-40 {
    padding: var(--g-40)
}

.p-45 {
    padding: var(--g-45)
}

.p-50 {
    padding: var(--g-50)
}

.p-75 {
    padding: var(--g-75)
}

.p-100 {
    padding: var(--g-100)
}

.p-150 {
    padding: var(--g-150)
}

.pt-05 {
    padding-top: var(--g-5)
}

.pt-10 {
    padding-top: var(--g-10)
}

.pt-15 {
    padding-top: var(--g-15)
}

.pt-20 {
    padding-top: var(--g-20)
}

.pt-25 {
    padding-top: var(--g-25)
}

.pt-30 {
    padding-top: var(--g-30)
}

.pt-35 {
    padding-top: var(--g-35)
}

.pt-40 {
    padding-top: var(--g-40)
}

.pt-45 {
    padding-top: var(--g-45)
}

.pt-50 {
    padding-top: var(--g-50)
}

.pt-75 {
    padding-top: var(--g-75)
}

.pt-100 {
    padding-top: var(--g-100)
}

.pt-150 {
    padding-top: var(--g-150)
}

.pb-05 {
    padding-bottom: var(--g-5)
}

.pb-10 {
    padding-bottom: var(--g-10)
}

.pb-15 {
    padding-bottom: var(--g-15)
}

.pb-20 {
    padding-bottom: var(--g-20)
}

.pb-25 {
    padding-bottom: var(--g-25)
}

.pb-30 {
    padding-bottom: var(--g-30)
}

.pb-35 {
    padding-bottom: var(--g-35)
}

.pb-40 {
    padding-bottom: var(--g-40)
}

.pb-45 {
    padding-bottom: var(--g-45)
}

.pb-50 {
    padding-bottom: var(--g-50)
}

.pb-75 {
    padding-bottom: var(--g-75)
}

.pb-100 {
    padding-bottom: var(--g-100)
}

.pb-150 {
    padding-bottom: var(--g-150)
}

.px-05 {
    padding-left: var(--g-5);
    padding-right: var(--g-5)
}

.px-10 {
    padding-left: var(--g-10);
    padding-right: var(--g-10)
}

.px-15 {
    padding-left: var(--g-15);
    padding-right: var(--g-15)
}

.px-20 {
    padding-left: var(--g-20);
    padding-right: var(--g-20)
}

.px-25 {
    padding-left: var(--g-25);
    padding-right: var(--g-25)
}

.px-30 {
    padding-left: var(--g-30);
    padding-right: var(--g-30)
}

.px-35 {
    padding-left: var(--g-35);
    padding-right: var(--g-35)
}

.px-40 {
    padding-left: var(--g-40);
    padding-right: var(--g-40)
}

.px-45 {
    padding-left: var(--g-45);
    padding-right: var(--g-45)
}

.px-50 {
    padding-left: var(--g-50);
    padding-right: var(--g-50)
}

.px-75 {
    padding-left: var(--g-75);
    padding-right: var(--g-75)
}

.px-100 {
    padding-left: var(--g-100);
    padding-right: var(--g-100)
}

.px-150 {
    padding-left: var(--g-150);
    padding-right: var(--g-150)
}

.py-05 {
    padding-top: var(--g-5);
    padding-bottom: var(--g-5)
}

.py-10 {
    padding-top: var(--g-10);
    padding-bottom: var(--g-10)
}

.py-15 {
    padding-top: var(--g-15);
    padding-bottom: var(--g-15)
}

.py-20 {
    padding-top: var(--g-20);
    padding-bottom: var(--g-20)
}

.py-25 {
    padding-top: var(--g-25);
    padding-bottom: var(--g-25)
}

.py-30 {
    padding-top: var(--g-30);
    padding-bottom: var(--g-30)
}

.py-35 {
    padding-top: var(--g-35);
    padding-bottom: var(--g-35)
}

.py-40 {
    padding-top: var(--g-40);
    padding-bottom: var(--g-40)
}

.py-45 {
    padding-top: var(--g-45);
    padding-bottom: var(--g-45)
}

.py-50 {
    padding-top: var(--g-50);
    padding-bottom: var(--g-50)
}

.py-75 {
    padding-top: var(--g-75);
    padding-bottom: var(--g-75)
}

.py-100 {
    padding-top: var(--g-100);
    padding-bottom: var(--g-100)
}

.py-150 {
    padding-top: var(--g-150);
    padding-bottom: var(--g-150)
}

.position-relative {
    position: relative
}

.line-height-130 {
    line-height: 130%
}

.line-height-100 {
    line-height: 100%
}