@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap";
html {
    font-size: 16px;
    scroll-behavior: smooth;
}
body {
    font-size: 16px;
    line-height: 150%;
    color: #959595;
    font-family: Inter, sans-serif;
    background: var(--Surface-BG, #131313);
    margin: 0;
}
a {
    text-decoration: underline;
    color: #959595;
    transition: 0.5s;
}
button {
    background: none;
}
a:hover {
    text-decoration: none;
}
.clear {
    clear: both;
}
p,
img {
    margin: 0;
    padding: 0;
    border: 0px;
}
p {
    margin: 0 0 8px;
}
p:last-child {
    margin: 0 !important;
}
h1,
h2,
h3,
h4,
h5,
.h1,
.h2,
.h3,
.h4,
.h5 {
    line-height: normal;
    font-weight: 400;
    position: relative;
    font-family: Inter, sans-serif;
    padding: 0;
    margin: 0px 0 1.5rem;
    font-weight: 500;
}
* {
    box-sizing: border-box;
}
table {
    border-spacing: 0px;
}
header,
nav,
section,
article,
aside,
footer {
    display: block;
}
input,
button,
textarea,
select {
    font-size: 1rem;
    outline: none;
    font-family: Inter, sans-serif;
}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0;
}
input[type="number"] {
    -moz-appearance: textfield;
}
button {
    margin: 0;
    padding: 0;
    border: 0px;
    cursor: pointer;
}
img {
    max-width: 100%;
    height: auto !important;
}
iframe {
    max-width: 100% !important;
    max-height: 100% !important;
}
.header .login-panel .open svg {
    display: none;
}
.header .login-panel .open.active {
    transform: rotate(0);
}
.header .login-panel {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 5px 8px;
    border-radius: 8px;
    border: 1px solid var(--Border-Primary-Default, rgba(237, 238, 238, 0.04));
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
    position: relative;
}
.header .login-panel .icon {
    font-size: 0px;
    line-height: 0px;
    width: 26px;
}
.header .login-panel .icon svg {
    width: 28px;
}
.header .login-panel .balance {
    color: var(--Text-Primary, #edeeee);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}
.header .login-panel .refresh {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    text-decoration: none;
    cursor: pointer;
    margin: 0 8px 0 0;
    border-radius: 6px;
    border: 1px solid var(--Border-Accent-Secondary, rgba(36, 255, 111, 0.24));
    background: var(--Surface-Accent-Hover, rgba(36, 255, 111, 0.04));
}
.header .login-panel .photo {
    font-size: 0px;
    line-height: 0px;
    overflow: hidden;
    border-radius: 555px;
    width: 34px;
}
.header .login-panel .open {
    cursor: pointer;
    border-radius: 6px;
    border: 1px solid var(--Border-Accent-Secondary, rgba(36, 255, 111, 0.24));
    background: var(--Surface-Accent-Hover, rgba(36, 255, 111, 0.04));
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    position: relative;
    z-index: 9;
    transition: 0.5s;
}
.header .login-panel .open:hover {
    background: var(--Button-Accent-Hover, #01db4b);
}
.header .login-panel .open path {
    transition: 0.5s;
}
.header .login-panel .open:hover path {
    stroke: #131313;
}
.header .login-panel .open.active {
    transform: rotate(180deg);
}
.header .login-panel .panel-block {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 8;
    border-radius: 8px;
    border: 1px solid var(--Border-Primary-Default, rgba(237, 238, 238, 0.04));
    background: linear-gradient(0deg, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 0%, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 100%), var(--Surface-BG, #131313);
    box-shadow: 0 15px 30px #0000004d;
    padding: 28px 16px 12px;
    width: 240px;
    display: none;
}
.header .login-panel .panel-block .photo {
    width: 64px;
    height: 64px;
    margin: 0 auto 8px;
}
.header .login-panel .panel-block .name {
    color: var(--Text-Primary, #edeeee);
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}
.header .login-panel .panel-block .id {
    color: var(--Text-Secondary, rgba(237, 238, 238, 0.48));
    text-align: center;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    margin: 0 0 8px;
}
.header .login-panel .panel-block .panel-balance {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 8px;
    border-radius: 8px;
    border: 1px solid var(--Border-Primary-Default, rgba(237, 238, 238, 0.04));
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
    margin: 0 0 8px;
}
.header .login-panel .panel-block .panel-balance .price {
    flex: 1;
    color: var(--Text-Primary, #edeeee);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}
.header .login-panel .panel-block .panel-balance .refresh {
    margin: 0;
    transition: all 0.3s ease;
}
.refresh {
    transition: all 0.3s ease;
    background-color: #000;
    cursor: pointer;
}
.header .login-panel .refresh:hover img {
    animation: spin 0.5s linear;
}
@keyframes spin {
    0% {
        transform: rotate(0);
    }
    to {
        transform: rotate(360deg);
    }
}
.header .login-panel .panel-block .panel-balance svg {
    width: 18px;
    height: 18px;
}
.header .login-panel .panel-block .panel-balance img {
    width: 26px;
}
.header .login-panel .menulogin ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.header .login-panel .menulogin a {
    display: flex;
    align-items: center;
    text-decoration: none;
    gap: 7px;
    color: var(--Text-Primary, #edeeee);
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    padding: 6px;
    border-radius: 4px;
    border: 1px transparent solid;
}
.header .login-panel .menulogin svg {
    flex-shrink: 0;
}
.header .login-panel .menulogin path {
    stroke: #edeeee;
    opacity: 0.48;
    transition: 0.5s;
}
.header .login-panel .menulogin a:hover {
    background: var(--Surface-Prymary-Hover, rgba(237, 238, 238, 0.08));
}
.header .login-panel .menulogin .active a {
    border: 1px solid var(--Border-Accent-Secondary, rgba(36, 255, 111, 0.24));
    background: var(--Surface-Accent-Hover, rgba(36, 255, 111, 0.04));
    color: var(--Text-Accent, #24ff6f);
}
.error-referrals-empty {
    text-align: center;
    padding: 50px;
}
.promo-code {
    display: flex;
    align-items: center;
    flex: 1;
}
.promo-code .input {
    display: flex;
    align-items: center;
    padding: 8px 6px 8px 16px;
    border-radius: 8px;
    border: 1px solid var(--Border-Primary-Default, rgba(255, 255, 255, 0.04));
    background: var(--Surface-Primary-Default, rgba(255, 255, 255, 0.04));
    width: 100%;
    transition: 0.5s;
}
.promo-code input {
    width: 45%;
    flex: 1;
    border: 0;
    background: none;
    color: var(--Text-Primary, #fff);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
}
.promo-code .copy {
    display: block;
    text-decoration: none;
    cursor: pointer;
    padding: 2px 8px;
    border-radius: 6px;
    border: 1px solid var(--Border-Primary-Default, rgba(255, 255, 255, 0.04));
    background: var(--Surface-Primary-Default, rgba(255, 255, 255, 0.04));
    color: var(--Text-Primary, #fff);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    transition: 0.5s;
    margin: 0 0 0 5px;
}
.promo-code .copy:hover {
    background: var(--Surface-Primary-Hover, rgba(255, 255, 255, 0.08));
}
.promo-item {
    background: var(--Surface-Primary-Default, rgba(255, 255, 255, 0.04));
    border-radius: 8px;
    padding: 16px;
    display: flex;
    gap: 24px;
    align-items: center;
    margin-bottom: 8px;
}
.promo-details {
    display: flex;
    gap: 24px;
    align-items: center;
    width: 55%;
}
.promo-value {
    color: var(--Text-Primary, #fff);
    font-weight: 500;
    min-width: 80px;
}
.error-message-mobile,
.success-message-mobile {
    display: none;
}
.promo-status {
    color: var(--Text-Secondary, rgba(255, 255, 255, 0.48));
    font-size: 14px;
    min-width: 90px;
}
.promo-date {
    color: var(--Text-Secondary, rgba(255, 255, 255, 0.48));
    font-size: 14px;
}
body.light .promo-code .input {
    border-radius: 8px;
    border: 1px solid var(--Border-Primary-Default, rgba(19, 19, 19, 0.06));
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
    transition: 0.5s;
}
body.light .promo-details .promo-value {
    color: #1313137a;
}
body.light .promo-code .promo-value {
    color: #1313137a;
}
body.light .copy {
    color: var(--Text-Primary, #131313);
    border-color: var(--Border-Primary-Default, rgba(19, 19, 19, 0.04));
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.04));
}
body.light .copy:hover {
    background: var(--Surface-Primary-Hover, rgba(19, 19, 19, 0.08));
}
body.light .promo-code input {
    color: var(--Text-Tetriary, rgba(19, 19, 19, 0.4));
}
@media (max-width: 768px) {
    .promo-item {
        flex-direction: column;
        align-items: stretch;
    }
}
.promo-list {
    margin: 10px 0;
}
.promo-code {
    font-size: 16px;
    font-weight: 500;
    color: #24ff6f;
}
.promo-value {
    font-weight: 500;
}
.promo-status,
.promo-date {
    color: #edeeee7a;
    font-size: 14px;
}
.loading {
    text-align: center;
    padding: 24px;
    color: #edeeee7a;
}
body.light .promo-item {
    background: #1313130a;
}
body.light .promo-status,
body.light .promo-date {
    color: #1313137a;
}
@media (max-width: 768px) {
    .promo-details {
        flex-direction: row;
    }
}
.section-promo-two .tabs__contents {
    display: none;
    margin: 0 0 16px;
    color: var(--Text-Secondary, rgba(237, 238, 238, 0.48));
    text-align: center;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
}
.section-promo-two .tabs__contents.active {
    display: block;
}
@media screen and (max-width: 780px) {
    .section-profile .question .text {
        width: 0px;
    }
}
.promo-item {
    background: #edeeee0a;
    border-radius: 8px;
    padding: 16px;
    margin-bottom: 12px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.promo-code {
    flex: 1;
}
.promo-code .input {
    display: flex;
    align-items: center;
    gap: 8px;
}
.promo-details {
    display: flex;
    gap: 24px;
    align-items: center;
}
@media (max-width: 768px) {
    .promo-item {
        flex-direction: column;
        gap: 16px;
    }
    .promo-details {
        width: 100%;
        justify-content: stretch;
    }
}
.rotating {
    animation: rotate 1s linear infinite;
}
.btn.disabled {
    opacity: 0.7;
    cursor: not-allowed;
}
.error-message {
    color: #ff3b30;
    font-size: 14px;
    margin-top: 8px;
}
.success-message {
    color: #24ff6f;
    font-size: 14px;
    margin-top: 8px;
}
.error-message-soc {
    color: #ff3b30;
    font-size: 14px;
    margin-top: 8px;
}
.success-message-soc {
    color: #24ff6f;
    font-size: 14px;
    margin-top: 8px;
}
.disabled {
    opacity: 0.7;
    cursor: not-allowed;
}
.header .login-panel .panel-block .panel-balance .refreshs {
    display: none;
    margin: 0;
    transition: all 0.3s ease;
}
.header .login-panel .refreshs {
    display: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    text-decoration: none;
    cursor: pointer;
    margin: 0 8px 0 0;
    border-radius: 6px;
    border: 1px solid var(--Border-Accent-Secondary, rgba(36, 255, 111, 0.24));
    background: var(--Surface-Accent-Hover, rgba(36, 255, 111, 0.04));
}
.btn.refresh {
    position: relative;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
}
.btn.refresh .refresh-icon {
    transition: transform 0.3s ease;
}
.btn.refresh.refreshing .refresh-icon {
    animation: rotate 1s linear infinite;
}
@keyframes rotate {
    0% {
        transform: rotate(0);
    }
    to {
        transform: rotate(360deg);
    }
}
.copy {
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
}
.copy.copied {
    color: #24ff6f;
}
.copy img {
    transition: opacity 0.3s ease;
}
.copy.copied img {
    opacity: 0.7;
}
@keyframes fadeInOut {
    0% {
        opacity: 0;
        transform: translateY(5px);
    }
    10% {
        opacity: 1;
        transform: translateY(0);
    }
    90% {
        opacity: 1;
        transform: translateY(0);
    }
    to {
        opacity: 0;
        transform: translateY(-5px);
    }
}
.fade-enter-active,
.fade-leave-active {
    transition: opacity 0.3s ease;
}
.fade-enter-from,
.fade-leave-to {
    opacity: 0;
}
.error-state,
.empty-orders {
    padding: 40px;
    text-align: center;
}
.skeleton-img {
    opacity: 0.2;
    filter: grayscale(100%) brightness(95%) contrast(90%);
}
.section-promo-one {
    border-radius: 16px;
    border: 1px solid var(--Border-Primary-Default, rgba(237, 238, 238, 0.04));
    background: linear-gradient(0deg, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 0%, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 100%), var(--Surface-BG, #131313);
    padding: 20px 32px;
    margin: 0 0 8px;
    color: var(--Text-Secondary, rgba(237, 238, 238, 0.48));
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
}
.section-promo-one .title {
    color: var(--Text-Primary, #edeeee);
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    margin: 0 0 16px;
}
.section-promo-one a {
    color: var(--Text-Accent, #24ff6f);
    text-decoration: none;
}
.section-promo-one a:hover {
    text-decoration: underline;
}
.section-promo-three {
    border-radius: 16px;
    border: 1px solid var(--Border-Primary-Default, rgba(237, 238, 238, 0.04));
    background: url(../img/sectionpromothree_3x.webp) no-repeat 0 center;
    background-size: cover !important;
    overflow: hidden;
    padding: 20px 32px;
    margin: 0 0 8px;
}
.section-promo-three .title {
    color: var(--Text-Primary, #edeeee);
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    margin: 0 0 16px;
}
.section-promo-three ul {
    list-style: none;
    margin: 0 0 16px;
    padding: 0;
    display: flex;
    flex-direction: column;
}
.section-promo-three ul li {
    padding: 12px 0;
    color: var(--Text-Primary, #edeeee);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}
.section-promo-three ul li span {
    color: var(--Text-Accent, #24ff6f);
    margin: 0 7px 0 0;
}
.section-promo-three .btn {
    display: block;
    text-decoration: none;
    cursor: pointer;
    width: 100%;
    padding: 8px;
    border-radius: 8px;
    background: var(--Button-Accent, #24ff6f);
    color: var(--Text-Primary-Inverse, #131313);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
    text-align: center;
    transition: 0.5s;
}
#generator-popup .btns {
    border-radius: 8px;
    border: 1px solid var(--Surface-Accent, #24ff6f);
    background: var(--Surface-Accent-Hover, rgba(36, 255, 111, 0.04));
    padding: 16px;
    color: var(--Text-Accent, #24ff6f);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
    transition: 0.5s;
}
.section-promo-two {
    border-radius: 16px;
    border: 1px solid var(--Border-Primary-Default, rgba(237, 238, 238, 0.04));
    background: linear-gradient(0deg, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 0%, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 100%), var(--Surface-BG, #131313);
    padding: 20px 32px;
    margin: 0 0 8px;
}
.section-promo-two .tabs__caption {
    list-style: none;
    margin: 0 0 16px;
    display: inline-flex;
    gap: 4px;
    padding: 2px;
    border-radius: 10px;
    background: var(--Surface-BG, #131313);
}
.section-promo-two .tabs__caption li {
    cursor: pointer;
    border-radius: 8px;
    padding: 8px 32px;
    color: var(--Text-Secondary, rgba(237, 238, 238, 0.48));
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    transition: 0.5s;
}
.section-promo-two .tabs__caption li:hover {
    background: var(--Surface-Accent-Hover, rgba(36, 255, 111, 0.04));
    color: var(--Text-Accent, #24ff6f);
}
.section-promo-two .tabs__caption .active {
    cursor: default;
    background: linear-gradient(0deg, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 0%, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 100%), var(--Surface-BG, #131313);
    color: var(--Text-Primary, #edeeee);
}
.section-promo-two .tabs__content {
    display: none;
    padding: 48px 109px;
    margin: 0 0 16px;
    color: var(--Text-Secondary, rgba(237, 238, 238, 0.48));
    text-align: center;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
}
.section-promo-two .tabs__content.active {
    display: block;
}
.section-promo-two .name {
    color: var(--Text-Primary, #edeeee);
    text-align: center;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    margin: 0 0 8px;
}
.section-promo-two .item {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 12px;
    border-radius: 8px;
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
    margin: 0 0 8px;
}
.section-promo-two .item:last-child {
    margin: 0;
}
.section-promo-two .item .col {
    flex: 1;
    color: #ffd703;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}
.section-promo-two .item .price {
    display: flex;
    align-items: center;
    gap: 4px;
    color: #ffd703;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}
.section-promo-two .item .price img {
    width: 20px;
}
.section-promo-two .item .price svg {
    width: 20px;
}
.section-promo-two .item.minus .col,
.section-promo-two .item.minus .price {
    color: #ff5e5e;
}
.tab-transactions-mobile {
    display: none;
}
.tab-transactions {
    display: block;
    border-radius: 8px;
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
    padding: 12px;
    margin: 0 0 8px;
}
.tab-transactions:last-child {
    margin: 0;
}
.tab-transactions .transactions-name {
    color: var(--Text-Primary, #edeeee);
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    margin: 0 0 8px;
}
.tab-transactions .transactions-bottom {
    display: grid;
    grid-template-columns: 1fr 150px auto;
    align-items: center;
    gap: 16px;
    width: 100%;
}
.tab-transactions .transactions-date {
    color: var(--Text-Primary, #edeeee);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    text-align: center;
    width: 150px;
    flex-shrink: 0;
}
.tab-transactions .transactions-price {
    display: flex;
    align-items: center;
    gap: 4px;
    color: #ffd703;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    min-width: 90px;
    justify-content: flex-end;
}
.tab-transactions .transactions-price img {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}
.tab-transactions .transactions-price.negative {
    color: #ff5e5e;
}
.tab-transactions .left {
    display: flex;
    align-items: center;
}
.tab-transactions .number {
    border-radius: 4px;
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
    padding: 2px 6px;
    color: var(--Text-Primary, #edeeee);
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}
@media (max-width: 768px) {
    .tab-transactions .transactions-bottom {
        grid-template-columns: 1fr auto;
    }
    .tab-transactions .transactions-date {
        text-align: right;
        width: auto;
    }
}
.tab-transactions-mobile {
    border-radius: 8px;
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
    padding: 12px;
    margin: 0 0 8px;
}
.tab-transactions-mobile .transactions-name {
    color: var(--Text-Primary, #edeeee);
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    margin: 0 0 8px;
}
body.light .tab-transactions-mobile .transactions-name {
    color: var(--Text-Primary, #131313);
}
body.light .tab-transactions-mobile .number {
    color: var(--Text-Primary, #131313);
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
}
.tab-transactions-mobile .transactions-date {
    color: var(--Text-Primary, #edeeee);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    text-align: center;
    width: 150px;
    flex-shrink: 0;
}
.tab-transactions-mobile .number {
    border-radius: 4px;
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
    padding: 2px 6px;
    color: var(--Text-Primary, #edeeee);
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}
.tab-transactions-mobile .left {
    display: flex;
    align-items: center;
}
.tab-transactions-mobile .transactions-price {
    display: flex;
    align-items: center;
    gap: 4px;
    color: #ffd703;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    min-width: 90px;
    justify-content: flex-end;
}
body.light .tab-transactions-mobile .transactions-price {
    color: #f9af11;
}
body.light .tab-transactions {
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.04));
}
body.light .tab-transactions .transactions-name,
body.light .tab-transactions .transactions-date,
body.light .tab-transactions .number {
    color: var(--Text-Primary, #131313);
}
.section-lk {
    margin: 0 0 48px;
}
.section-lk .title-section {
    color: var(--Text-Primary, #edeeee);
    font-size: 36px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    margin: 0 0 32px;
}
.section-lk .flex-main {
    display: flex;
    gap: 105px;
}
.section-lk .sidebar {
    width: 220px;
}
.section-lk .container {
    flex: 1;
    padding: 0 299px 0 0;
}
.section-lk .sidebar ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.section-lk .sidebar a {
    display: flex;
    align-items: center;
    text-decoration: none;
    gap: 7px;
    color: var(--Text-Primary, #edeeee);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    padding: 6px 12px;
    border-radius: 4px;
    border: 1px transparent solid;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
}
.section-lk .sidebar path {
    stroke: #edeeee;
    opacity: 0.48;
    transition: 0.5s;
}
.section-lk .sidebar a:hover {
    background: var(--Surface-Prymary-Hover, rgb(237 238 238 / 8%));
}
.section-lk .sidebar .active a {
    border: 1px solid var(--Border-Accent-Secondary, rgb(36 255 111 / 24%));
    background: var(--Surface-Accent-Hover, rgb(36 255 111 / 4%));
    color: var(--Text-Accent, #24ff6f);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.section-lk .sidebar a:hover path {
    stroke: #fff;
    opacity: 1;
}
.section-lk .sidebar .active a path {
    stroke: #24ff6f;
    opacity: 1;
}
.section-profile .item-block {
    padding: 20px 32px;
    margin: 0 0 8px;
    border-radius: 16px;
    border: 1px solid var(--Border-Primary-Default, rgb(237 238 238 / 4%));
    background: linear-gradient(0deg, var(--Surface-Primary-Default, rgb(237 238 238 / 4%)) 0%, var(--Surface-Primary-Default, rgb(237 238 238 / 4%)) 100%), var(--Surface-BG, #131313);
}
.section-profile .section-profile-one {
    display: flex;
    align-items: center;
    gap: 16px;
}
.section-profile .section-profile-one .photo {
    font-size: 0;
    line-height: 0px;
    border-radius: 555px;
    overflow: hidden;
    width: 70px;
    height: 70px;
}
.section-profile .section-profile-one .info {
    display: flex;
    flex-direction: column;
    gap: 7px;
    flex: 1;
}
.section-profile .section-profile-one .user {
    color: var(--Text-Primary, #edeeee);
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
}
.section-profile .section-profile-one .id {
    color: var(--Text-Accent, #24ff6f);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    display: flex;
    align-items: center;
    gap: 5px;
}
.section-profile .section-profile-one .id input {
    color: var(--Text-Secondary, rgb(237 238 238 / 48%));
    background: none;
    border: 0;
    width: 93px;
    padding: 0;
}
.section-profile .section-profile-one .copy {
    margin: 0 0 0 3px;
    width: 28px;
    height: 28px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    border-radius: 6px;
    border: 1px solid var(--Border-Accent-Secondary, rgb(36 255 111 / 24%));
    background: var(--Surface-Accent-Hover, rgb(36 255 111 / 4%));
    transition: 0.5s;
}
body.light .tab-transactions {
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
}
body.light .tab-transactions .transactions-name,
body.light .tab-transactions .number {
    color: var(--Text-Primary, #131313);
}
body.light .tab-transactions .number,
body.light .tab-transactions .vk,
body.light .tab-transactions .promo,
body.light .tab-transactions .id {
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
}
body.light .tab-transactions .transactions-date {
    color: var(--Text-Primary, #131313);
}
body.light .tab-transactions .transactions-price {
    color: #f9af11;
}
body.light .img-pagination {
    filter: brightness(0);
}
body.light .section-promo-two .desc {
    color: var(--Text-Primary, #131313);
}
body.light .section-profile .section-profile-one .copy {
    background: var(--Surface-Accent-Hover, rgb(0 190 58 / 12%));
}
body.light .section-profile .section-profile-one .copy:hover {
    background: var(--Button-Accent-Hover, #01db4b);
}
body.light .header .login-panel .refresh {
    background: #00be3a1f;
}
.section-profile .section-profile-one .copy:hover {
    background: var(--Button-Accent-Hover, #01db4b);
}
.section-profile .section-profile-one .total {
    display: flex;
    align-items: center;
    gap: 8px;
}
.section-profile .section-profile-one .logo {
    width: 36px;
    height: 36px;
    font-size: 0;
    line-height: 0px;
    border-radius: 555px;
    overflow: hidden;
}
.section-profile .section-profile-one .summ {
    color: var(--Text-Primary, #edeeee);
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}
.section-profile .section-profile-one .btn {
    display: flex;
    align-items: center;
    gap: 4px;
    text-decoration: none;
    cursor: pointer;
    padding: 8px 12px;
    border-radius: 8px;
    border: 1px solid var(--Surface-Accent, #24ff6f);
    background: var(--Surface-Accent-Hover, rgb(36 255 111 / 4%));
    color: var(--Text-Accent, #24ff6f);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    margin: 0 0 0 8px;
    transition: 0.5s;
}
.section-profile .item-block .title {
    color: var(--Text-Primary, #edeeee);
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    margin: 0 0 16px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.section-profile .question {
    position: relative;
}
.section-profile .question .icon {
    cursor: pointer;
    width: 20px;
    height: 20px;
    background: url(../img/question.svg) no-repeat;
    transition: 0.5s;
}
.section-profile .question .icon:hover {
    background: url(../img/question-hover.svg) no-repeat;
}
.section-profile .question .text {
    position: absolute;
    bottom: calc(100% + 0px);
    left: 0;
    z-index: 9;
    padding: 12px;
    border-radius: 8px;
    background: var(--Text-Primary-Inverse, #131313);
    color: var(--Text-Primary, #edeeee);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    width: 266px;
    display: none;
    transition: 0.5s;
}
.section-profile .question:hover > .text {
    display: block;
}
.section-profile-two .items-connect {
    display: flex;
    gap: 8px;
}
.section-profile-two .items-connect .connect {
    width: calc(50% - 4px);
    padding: 12px 16px;
    border-radius: 8px;
    border: 1px solid var(--Border-Primary-Default, rgb(237 238 238 / 4%));
    display: flex;
    gap: 12px;
    transition: 0.5s;
    cursor: pointer;
}
.section-profile-two .items-connect .connect:hover {
    background: var(--Surface-Prymary-Hover, rgb(237 238 238 / 8%));
}
.section-profile-two .items-connect .icon {
    font-size: 0;
    line-height: 0px;
    width: 28px;
}
.section-profile-two .items-connect .right {
    flex: 1;
}
.section-profile-two .items-connect .name {
    color: var(--Text-Primary, #edeeee);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    margin: 0 0 8px;
}
.section-profile-two .items-connect .btn {
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    padding: 6px 12px;
    border-radius: 8px;
    border: 1px solid var(--Border-Accent-Secondary, rgb(36 255 111 / 24%));
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12));
    color: #24ff6f;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    gap: 4px;
    transition: 0.5s;
}
.section-profile-two .items-connect .connect:hover .btn {
    border: 1px solid var(--Surface-Accent, #24ff6f);
}
body.light .section-profile-two .items-connect .connect:hover .btn {
    border: 1px solid #0db740;
}
.section-profile-two .items-connect .btn span {
    margin: 0 0 0 4px;
    color: #ffd703;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}
body.light .section-profile-two .items-connect .btn span {
    color: #f9af11;
}
.panel-block {
    display: none;
}
.panel-block.active {
    display: block;
}
.section-profile-two .items-connect .btn svg {
    width: 20px;
    height: 20px;
}
.section-profile-two .items-connect .btn img {
    width: 20px;
    height: 20px;
}
.section-profile-two .items-connect .succes .btn {
    gap: 8px;
}
.section-profile-two .items-connect .connect.succes {
    background: none !important;
    pointer-events: none;
}
.section-profile-two .items-connect .connect.succes .icon img,
.section-profile-two .items-connect .connect.succes .btn {
    filter: grayscale(100%);
}
.section-profile-three .desc {
    color: var(--Text-Secondary, rgb(237 238 238 / 48%));
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    margin: -8px 0 16px;
}
.section-profile-three .promo-form {
    display: flex;
    gap: 4px;
}
.section-profile-three .promo-form button {
    cursor: pointer;
    padding: 12px;
    border-radius: 8px;
    border: 1px solid var(--Border-Accent-Secondary, rgb(36 255 111 / 24%));
    background: var(--Surface-Accent-Hover, rgb(36 255 111 / 4%));
    color: var(--Text-Accent, #24ff6f);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    transition: 0.5s;
}
.section-profile-three .promo-form .input {
    display: flex;
    align-items: center;
    padding: 8px 6px 8px 16px;
    border-radius: 8px;
    border: 1px solid var(--Border-Primary-Default, rgb(255 255 255 / 4%));
    background: var(--Surface-Primary-Default, rgb(255 255 255 / 4%));
    width: 100%;
    transition: 0.5s;
}
.section-profile-three .promo-form .input:hover {
    background: var(--Surface-Prymary-Hover, rgb(255 255 255 / 8%));
}
.section-profile-three .promo-form .input:focus-within {
    border: 1px solid var(--Border-Accent, #24ff6f);
}
.section-profile-three .promo-form input {
    width: 100%;
    flex: 1;
    border: 0;
    background: none;
    color: var(--Text-Primary, #fff);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
}
.section-profile-three .promo-form ::placeholder {
    color: var(--Text-Tetriary, rgb(255 255 255 / 18%));
}
.section-profile-share {
    padding: 30px 17px 17px;
    border-radius: 16px;
    border: 1px solid var(--Border-Primary-Default, rgb(237 238 238 / 4%));
    background: url(../img/sectionprofileshareblack_3x.webp) no-repeat 0 center;
    background-size: cover !important;
    overflow: hidden;
}
body.light .section-profile-share {
    background: url(../img/section-profile-share-light.webp) no-repeat 0 center;
    background-size: cover !important;
    overflow: hidden;
}
.section-profile-share .title {
    color: var(--Text-Primary, #edeeee);
    text-align: center;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    margin: 0 0 8px;
}
.section-profile-share .desc {
    color: var(--Text-Secondary, rgb(237 238 238 / 48%));
    text-align: center;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    margin: 0 0 17px;
}
.section-profile-share .add {
    display: table;
    margin: 0 auto;
    cursor: pointer;
    text-decoration: none;
    padding: 12px;
    border-radius: 8px;
    border: 1px solid var(--Border-Accent-Secondary, rgb(36 255 111 / 24%));
    background: var(--Surface-Accent-Hover, rgb(36 255 111 / 4%));
    text-align: center;
    color: var(--Text-Accent, #24ff6f);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    transition: 0.5s;
}
.section-referals-one {
    border-radius: 16px;
    border: 1px solid var(--Border-Primary-Default, rgb(237 238 238 / 4%));
    margin: 0 0 8px;
    padding: 30px 32px;
    background: url(../img/referralImagesFirstBlack_2x.webp) no-repeat 0 center;
    background-size: cover !important;
    overflow: hidden;
}
body.light .section-referals-one {
    background: url(../img/referral-Images-First-Light.webp) no-repeat 0 center;
    background-size: cover;
    overflow: hidden;
}
.section-referals-one .title {
    color: var(--Text-Primary, #edeeee);
    text-align: center;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    margin: 0 0 8px;
}
.section-referals-one .desc {
    color: var(--Text-Secondary, rgb(237 238 238 / 48%));
    text-align: center;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
}
.section-referals-one .people {
    font-size: 0;
    line-height: 0px;
    text-align: center;
    margin: 0 -32px 25px;
    height: 107px;
}
.section-referals-one .flex {
    display: flex;
    gap: 8px;
    margin: 21px 0 0;
}
.section-referals-one .item {
    display: flex;
    flex-direction: column;
    gap: 12px;
    flex: 1;
    padding: 16px 20px;
    border-radius: 8px;
    border: 1px solid var(--Border-Primary-Default, rgb(237 238 238 / 4%));
    background: var(--Surface-Primary-Default, rgb(237 238 238 / 4%));
    color: var(--Text-Primary, #edeeee);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
}
.section-referals-one .number {
    color: var(--Text-Accent, #24ff6f);
    font-size: 28px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
}
.section-referals-two {
    margin: 0 0 8px;
    padding: 16px 32px;
    color: var(--Text-Secondary, rgb(237 238 238 / 48%));
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
}
.section-referals-two .title {
    color: var(--Text-Primary, #edeeee);
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    margin: 0 0 8px;
}
.section-referals-three {
    margin: 0 0 8px;
    padding: 20px 32px 20px 200px;
    background: url(../img/section-referals-three-bg1.webp) no-repeat 0 center;
    background-size: cover !important;
    border-radius: 16px;
    overflow: hidden;
}
body.light .section-referals-three {
    background: url(../img/section-referals-three-bg1-light.webp) no-repeat 0 center;
    background-size: cover !important;
}
.section-referals-three.bg2 {
    background: url(../img/section-referals-three-bg2.webp) no-repeat 0 center;
}
.section-referals-three .title {
    color: var(--Text-Primary, #edeeee);
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    margin: 0 0 8px;
}
.section-referals-three .desc {
    margin: 0 0 16px;
    color: var(--Text-Secondary, rgb(237 238 238 / 48%));
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
}
.section-referals-three .desc span {
    color: #ffd703;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}
.section-referals-three .desc img {
    width: 20px;
    height: 20px;
    margin: 0 4px 0 2px;
    position: relative;
    top: 5px;
}
.section-referals-three .label {
    margin: 0 0 16px;
    position: relative;
    flex: 1;
}
.section-referals-three .label:last-child {
    margin: 0;
}
.section-referals-three .error-info {
    position: relative;
    top: 0;
    left: 0;
    padding: 4px 0;
    color: #f45454;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 14px;
    border-radius: 8px;
    z-index: 9;
    transition: 0.5s;
}
.section-referals-three .error-info a {
    text-decoration: none;
    color: var(--Text-Accent, #24ff6f);
}
.section-referals-three .error-info a:hover {
    text-decoration: underline;
}
.section-referals-three .label label {
    display: block;
    color: var(--Text-Secondary, rgb(255 255 255 / 48%));
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    margin: 0 0 2px;
}
.section-referals-three .label .input {
    display: flex;
    align-items: center;
    padding: 8px 6px 8px 16px;
    border-radius: 8px;
    border: 1px solid var(--Border-Primary-Default, rgb(255 255 255 / 4%));
    background: var(--Surface-Primary-Default, rgb(255 255 255 / 4%));
    width: 100%;
    transition: 0.5s;
}
.section-referals-three .label .input:hover {
    background: var(--Surface-Prymary-Hover, rgb(255 255 255 / 8%));
}
.section-referals-three .label .input:focus-within {
    border: 1px solid var(--Border-Accent, #24ff6f);
}
.section-referals-three .label.error .input {
    border: 1px solid rgb(255 16 16 / 33%);
    background: #ff00000a;
}
.section-referals-three .label input {
    width: 100%;
    flex: 1;
    border: 0;
    background: none;
    color: var(--Text-Primary, #fff);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
}
.section-referals-three .label ::placeholder {
    color: var(--Text-Tetriary, rgb(255 255 255 / 18%));
}
.section-referals-three .label .copy {
    display: block;
    text-decoration: none;
    cursor: pointer;
    padding: 2px 8px;
    border-radius: 6px;
    border: 1px solid var(--Border-Primary-Default, rgb(255 255 255 / 4%));
    background: var(--Surface-Primary-Default, rgb(255 255 255 / 4%));
    color: var(--Text-Primary, #fff);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    transition: 0.5s;
}
.section-referals-three .label .copy:hover {
    border: 1px solid var(--Border-Accent-Secondary, rgb(36 255 111 / 24%));
    background: var(--Surface-Accent-Hover, rgb(36 255 111 / 4%));
    color: var(--Text-Accent, #24ff6f);
}
.section-referals-four {
    border-radius: 16px;
    border: 1px solid var(--Border-Primary-Default, rgb(237 238 238 / 4%));
    background: linear-gradient(0deg, var(--Surface-Primary-Default, rgb(237 238 238 / 4%)) 0%, var(--Surface-Primary-Default, rgb(237 238 238 / 4%)) 100%), var(--Surface-BG, #131313);
    margin: 0 0 8px;
    padding: 20px 32px;
}
.section-referals-four .flex {
    display: flex;
    gap: 4px;
    margin: 0 0 16px;
}
.section-referals-four .flex .item {
    display: flex;
    flex-direction: column;
    gap: 8px;
    border-radius: 8px;
    background: #ffd7030f;
    color: var(--Text-Primary, #edeeee);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    flex: 1;
    padding: 12px 16px;
}
.section-referals-four .flex .number {
    display: flex;
    align-items: center;
    gap: 4px;
    color: #ffd703;
    font-size: 28px;
    font-style: normal;
    font-weight: 600;
    line-height: 28px;
}
.section-referals-four .flex .item:first-child .number {
    color: var(--Text-Primary, #edeeee);
}
.section-referals-four .flex .number svg {
    width: 24px;
}
.section-referals-four .flex .number img {
    width: 24px;
}
.section-referals-four .title {
    color: var(--Text-Primary, #edeeee);
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    margin: 0 0 8px;
}
.section-referals-four .desc {
    color: var(--Text-Secondary, rgb(237 238 238 / 48%));
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    margin: 0 0 16px;
}
.section-referals-four .table {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    padding: 8px 16px;
    margin: 0 0 4px;
    border-radius: 8px;
    background: var(--Surface-Primary-Default, rgb(237 238 238 / 4%));
    color: var(--Text-Primary, #edeeee);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
    transition: 0.5s;
}
.section-referals-four .table:hover {
    background: var(--Surface-Prymary-Hover, rgb(237 238 238 / 8%));
}
.section-referals-four .table label {
    display: block;
    color: var(--Text-Secondary, rgb(237 238 238 / 48%));
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}
.section-referals-four .table .last {
    align-items: center;
    gap: 4px;
    color: #ffd703;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}
body.light .section-referals-four .table .last {
    color: #f9af11;
}
.section-referals-four .table .last div:last-child {
    display: flex;
    align-items: center;
    gap: 4px;
}
.section-referals-four .table .last img {
    width: 20px;
}
.section-referals-four .table .td:first-child .text {
    overflow: hidden;
    color: var(--Text-Primary, #edeeee);
    text-overflow: ellipsis;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
    width: 81px;
}
.section-referals-five {
    padding: 28px 32px;
    border-radius: 16px;
    background: linear-gradient(0deg, var(--Surface-Primary-Default, rgb(237 238 238 / 4%)) 0%, var(--Surface-Primary-Default, rgb(237 238 238 / 4%)) 100%), var(--Surface-BG, #131313);
    margin: 0 0 8px;
}
.section-referals-five .title {
    color: var(--Text-Primary, #edeeee);
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    margin: 0 0 16px;
}
body.light .coin-minus {
    background: url(../img/stm-coin-rad.svg) no-repeat center;
}
.section-referals-six {
    border-radius: 16px;
    border: 1px solid var(--Border-Primary-Default, rgb(237 238 238 / 4%));
    padding: 45px 51px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin: 0 0 8px;
}
.section-referals-six {
    background: url(../img/referralImagesFourBlack.webp) no-repeat 0 center;
    background-size: cover !important;
    overflow: hidden;
}
body.light .section-referals-six {
    background: url(../img/referralImagesFourLight_3x.webp) no-repeat 0 center;
    background-size: cover !important;
    overflow: hidden;
}
.section-referals-six .course {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 4px 12px;
    border-radius: 32px;
    background: var(--White-200, rgb(237 238 238 / 8%));
    color: var(--Text-Primary, #edeeee);
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    margin: 0 64px 0 0;
}
.section-referals-six .course img,
.transactions-coin {
    width: 20px;
}
.section-referals-six .total {
    display: flex;
    align-items: center;
    gap: 4px;
    color: #ffd703;
    font-size: 28px;
    font-style: normal;
    font-weight: 600;
    line-height: 28px;
    margin: 0 16px 0 0;
}
.section-referals-six .total img {
    width: 24px;
}
.section-referals-six .button {
    display: flex;
    align-items: center;
    gap: 4px;
    cursor: pointer;
    padding: 8px 12px;
    color: var(--Text-Accent, #24ff6f);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    border-radius: 8px;
    border: 1px solid var(--Surface-Accent, #24ff6f);
    background: var(--Surface-Accent-Hover, rgb(36 255 111 / 4%));
    transition: 0.5s;
}
.section-history {
    padding: 20px 32px;
    border-radius: 16px;
    border: 1px solid var(--Border-Primary-Default, rgb(237 238 238 / 4%));
    background: linear-gradient(0deg, var(--Surface-Primary-Default, rgb(237 238 238 / 4%)) 0%, var(--Surface-Primary-Default, rgb(237 238 238 / 4%)) 100%), var(--Surface-BG, #131313);
}
.section-history .head .title {
    color: var(--Text-Primary, #edeeee);
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.section-history .head .question {
    position: relative;
}
.section-history .head .question .icon {
    cursor: pointer;
    width: 20px;
    height: 20px;
    background: url(../img/question.svg) no-repeat;
    transition: 0.5s;
}
.section-history .head .question .icon:hover {
    background: url(../img/question-hover.svg) no-repeat;
}
.section-history .head .question .text {
    position: absolute;
    bottom: calc(100% + 0px);
    left: 0;
    z-index: 9;
    padding: 12px;
    border-radius: 8px;
    background: var(--Text-Primary-Inverse, #131313);
    color: var(--Text-Primary, #edeeee);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    width: 266px;
    display: none;
    transition: 0.5s;
}
.section-history .head .question:hover > .text {
    display: block;
}
.section-history .head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin: 0 0 18px;
}
.section-history .head ul {
    list-style: none;
    margin: 0;
    display: flex;
    border-radius: 10px;
    background: var(--Surface-BG, #131313);
    gap: 2px;
    padding: 2px;
}
.section-history .head ul li {
    cursor: pointer;
    color: var(--Text-Secondary, rgb(237 238 238 / 48%));
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    padding: 8px 32px;
    transition: 0.5s;
    border-radius: 8px;
}
.section-history .head ul li:hover {
    background: var(--Surface-Accent-Hover, rgb(36 255 111 / 4%));
    color: var(--Text-Accent, #24ff6f);
}
.section-history .head ul li.active {
    cursor: default;
    color: var(--Text-Primary, #edeeee);
    background: linear-gradient(0deg, var(--Surface-Primary-Default, rgb(237 238 238 / 4%)) 0%, var(--Surface-Primary-Default, rgb(237 238 238 / 4%)) 100%), var(--Surface-BG, #131313);
}
.section-history .tabs__content.active {
    display: block;
}
.section-history .date-input {
    padding: 4px 8px 4px 16px;
    border-radius: 8px;
    background: var(--Surface-Primary-Default, rgb(237 238 238 / 4%));
    display: flex;
    align-items: center;
}
.section-history .date-input input {
    background: none;
    border: 0;
    color: var(--Text-Primary, #edeeee);
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
}
.section-history .date-input input::-webkit-calendar-picker-indicator {
    transition: 0.5s;
    width: 28px;
    height: 28px;
    background: url(../img/webkit-calendar-picker-indicator.svg) no-repeat right center;
}
.section-history .links-tabs li.active a {
    border: 1px solid var(--Border-Accent-Secondary, rgb(36 255 111 / 24%));
    background: var(--Surface-Accent-Hover, rgb(36 255 111 / 4%));
    color: var(--Text-Accent, #24ff6f);
}
.section-history .services-block {
    border-radius: 8px;
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
    margin: 0 0 8px;
    padding: 12px;
    cursor: pointer;
}
.section-profile .section-profile-one .copy:hover path,
.section-referals-six .button:hover path,
.section-order-one .head .btn:hover path,
.section-history .services-block .copy:hover path {
    stroke: #131313;
}
.section-order-one .head .btn:nth-child(3):hover path {
    fill: #131313;
    stroke: none;
}
.section-profile .section-profile-one .btn:hover {
    background: var(--Button-Accent-Hover, #01db4b);
    color: var(--Text-Primary-Inverse, #131313);
}
.section-profile-three .promo-form .input:hover {
    background: var(--Surface-Prymary-Hover, rgba(255, 255, 255, 0.08));
}
.section-profile-three .promo-form button:hover,
.section-profile-share .add:hover,
.section-referals-six .button:hover,
.section-order-one .head .btn:hover,
.section-order-two .add:hover {
    background: #01db4b;
    color: #131313;
}
.refresh:hover svg {
    transform: rotate(180deg);
}
.section-profile .section-profile-one img:hover {
    stroke: #131313;
}
.section-promo-three .btn:hover,
.section-order-one .pay-btn:hover,
.section-order-two .send:hover,
.section-order-three .buttons .copy:hover,
.section-history .services-block .copy:hover,
.section-history .services-block .pay:hover {
    background: var(--Button-Accent-Hover, #01db4b);
}
.section-referals-six .button:hover path,
.section-order-one .head .btn:hover path,
.section-history .services-block .copy:hover path {
    stroke: #131313;
}
path,
.section-order-one .pay-btn,
.section-order-two .send,
.section-order-two .add,
.section-order-three .buttons .copy,
.section-history .services-block .copy {
    transition: 0.5s;
}
.refresh svg,
.refresh path {
    transition: 0.5s;
}
.section-history .services-block .pay {
    display: block;
    text-decoration: none;
    cursor: pointer;
    padding: 8px;
    text-align: center;
    border-radius: 8px;
    background: #ffffff0a;
    color: var(--Text-Primary-Inverse, #131313);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
    width: 100%;
    transition: 0.5s;
}
.question-all .icon {
    cursor: pointer;
    width: 20px;
    height: 20px;
    background: url(../img/question.svg) no-repeat;
    transition: 0.5s;
}
.site-width {
    width: 100%;
    max-width: 1312px;
    margin: 0 auto;
    padding: 0 16px;
}
.header {
    padding: 20px 0;
    border-bottom: 1px solid var(--Border-Primary-Default, rgba(255, 255, 255, 0.04));
    margin: 0 0 37px;
}
.header .site-width {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
.header .logo a {
    display: block;
    text-decoration: none;
    width: var(--logo-width);
    height: 42px;
    background: var(--logo-url) no-repeat center;
}
.header .info {
    display: flex;
    gap: 24px;
}
.header .item {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--Text-Secondary, rgba(255, 255, 255, 0.48));
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    text-decoration: none;
}
.header .item > div {
    flex: 1;
}
.header .item span {
    display: block;
    color: var(--Text-Primary, #fff);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
}
.header .menu ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 20px;
}
.header .menu a {
    text-decoration: none;
    color: var(--Text-Secondary, rgba(255, 255, 255, 0.48));
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
.header .menu a:hover {
    color: var(--Text-Primary, #fff);
}
.header .setting {
    display: block;
    text-decoration: none;
    cursor: pointer;
    width: 43px;
    height: 42px;
    background: url(../img/setting.svg) no-repeat;
    transition: 0.5s;
}
.header .setting:hover {
    background: url(../img/setting-hover.svg) no-repeat;
}
.header .setting.dark {
    display: none;
}
.header .social {
    display: flex;
    gap: 12px;
}
.header .tl {
    display: block;
    text-decoration: none;
    width: 33px;
    height: 32px;
    background: url(../img/tl.svg) no-repeat;
    background-size: contain !important;
}
.header .vk {
    display: block;
    text-decoration: none;
    width: 33px;
    height: 32px;
    background: url(../img/vk.svg) no-repeat;
    background-size: contain !important;
}
.header .tl:hover {
    background: url(../img/tl-hover.svg) no-repeat !important;
    background-size: contain !important;
}
.header .vk:hover {
    background: url(../img/vk-hover.svg) no-repeat !important;
    background-size: contain !important;
}
.setting.light,
.setting.dark {
    transition: opacity 0.3s ease;
}
.setting.hidden,
body.light .setting.light {
    display: none;
}
body.light .setting.dark {
    display: block;
}
.header .enter {
    display: flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    padding: 12px 20px;
    border-radius: 6px;
    border: 1px solid var(--Border-Accent-Secondary, rgba(36, 255, 111, 0.24));
    background: var(--Surface-Accent-Hover, rgba(36, 255, 111, 0.04));
    color: var(--Text-Accent, #24ff6f);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    cursor: pointer;
}
.header .enter:before {
    content: "";
    width: 18px;
    height: 18px;
    background: url(../img/header-enter.svg) no-repeat;
}
.header .enter:hover {
    background: var(--Button-Accent-Hover, #01db4b);
    color: var(--Text-Primary-Inverse, #131313);
}
.header .enter:hover:before {
    background: url(../img/header-enter-hover.svg) no-repeat;
}
.section-main {
    padding: 0 0 145px;
    background: url(../img/section-main-bg.png) no-repeat center bottom;
}
.section-main .site-width {
    display: flex;
    justify-content: center;
    gap: 74px;
}
.section-main .container {
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: 936px;
    flex: 1;
}
.section-main .sidebar {
    width: 376px;
    padding: 26px 0 0;
}
.section-main .fire {
    display: flex;
    align-items: center;
    margin: 0 0 62px;
    padding: 8px 16px;
    border-radius: 16px;
    background: var(--Surface-Accent-Hover, rgba(36, 255, 111, 0.04));
    gap: 12px;
    color: var(--Text-Accent, #24ff6f);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
.section-main .fire .question {
    display: block;
    text-decoration: none;
    cursor: pointer;
    width: 20px;
    height: 20px;
    background: url(../img/fire-question.svg) no-repeat;
    flex-shrink: 0;
    background-size: contain !important;
    transition: 0.5s;
}
.section-main .fire .question:hover {
    background: url(../img/question-hover.svg) no-repeat;
}
.section-main .fire:before {
    content: "";
    width: 28px;
    height: 28px;
    background: url(../img/fire.svg) no-repeat;
    flex-shrink: 0;
}
.section-main .sidebar .tabs {
    border-radius: 16px;
    background: linear-gradient(0deg, var(--Surface-Primary-Default, rgba(255, 255, 255, 0.04)) 0%, var(--Surface-Primary-Default, rgba(255, 255, 255, 0.04)) 100%), var(--Black-500, #131313);
    padding: 28px 32px 32px;
}
.section-main .sidebar .name {
    color: var(--Text-Primary, #fff);
    font-family: Inter;
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    margin: 0 0 16px;
}
.section-main .sidebar .tabs .tabs__caption {
    list-style: none;
    margin: 0 0 24px;
    display: flex;
    border-radius: 10px;
    background: var(--Surface-BG, #131313);
    padding: 2px;
}
.section-main .sidebar .tabs .tabs__caption li {
    cursor: pointer;
    border-radius: 8px;
    flex: 1;
    padding: 8px;
    text-align: center;
    color: var(--Text-Secondary, rgba(255, 255, 255, 0.48));
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}
.section-main .sidebar .tabs .tabs__caption li.active {
    cursor: default;
    background: linear-gradient(0deg, var(--Surface-Primary-Default, rgba(255, 255, 255, 0.04)) 0%, var(--Surface-Primary-Default, rgba(255, 255, 255, 0.04)) 100%), var(--Surface-BG, #131313);
    color: var(--Text-Primary, #fff);
}
.section-main .sidebar .tabs__content {
    display: none;
}
.section-main .sidebar .tabs__content.active {
    display: block;
}
.section-main .sidebar ol {
    margin: 0;
    padding: 0;
    list-style-type: none;
    counter-reset: item;
}
.section-main .sidebar ol li {
    position: relative;
    padding: 12px 0 12px 20px;
    color: var(--Text-Primary, #fff);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}
.section-main .sidebar ol li:before {
    content: counter(item) "";
    counter-increment: item;
    color: var(--Text-Accent, #24ff6f);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    position: absolute;
    top: 12px;
    left: 0;
}
.section-main .sidebar ol a {
    padding: 4px 7px;
    text-decoration: none;
    border-radius: 6px;
    border: 1px solid var(--Border-Primary-Default, rgba(255, 255, 255, 0.04));
    background: var(--Surface-Primary-Default, rgba(255, 255, 255, 0.04));
    color: var(--Text-Primary, #fff);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    margin: 0 0 0 7px;
}
.section-main .sidebar ol a:hover,
.section-main .label .where:hover {
    border: 1px solid var(--Border-Accent-Secondary, rgba(36, 255, 111, 0.24));
    background: var(--Surface-Accent-Hover, rgba(36, 255, 111, 0.04));
    color: var(--Text-Accent, #24ff6f);
}
.section-main .title {
    color: var(--Text-Primary, #fff);
    font-size: 36px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    margin: 0 0 8px;
}
.section-main .description {
    color: var(--Text-Secondary, rgba(255, 255, 255, 0.48));
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin: 0 0 42px;
}
.section-main .description h2 {
    color: var(--Text-Secondary, rgba(255, 255, 255, 0.48));
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin: 0 0 8px;
}
.section-main .description h3 {
    color: var(--Text-Secondary, rgba(255, 255, 255, 0.48));
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin: 0;
}
.select-games {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin: 0 0 32px;
}
.select-games label {
    display: block;
}
.select-games label,
.select-games .show {
    width: calc(12.5% - 4px);
    min-height: 54px;
    transition: 0.5s;
}
.select-games .show:hover {
    background: var(--Surface-Prymary-Hover, rgba(237, 238, 238, 0.08));
}
.select-games label input {
    display: none;
}
.select-games span {
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    text-align: center;
    font-size: 0px;
    line-height: 0px;
    cursor: pointer;
    border-radius: 8px;
    border: 1px solid var(--Border-Primary-Default, rgba(255, 255, 255, 0.04));
    background: var(--Surface-Primary-Default, rgba(255, 255, 255, 0.04));
    padding: 16px;
    filter: grayscale(100%);
    height: 100%;
    transition: 0.5s;
}
.select-games span img {
    transform: scale(0.8);
    transition: 0.5s;
}
.select-games span:hover img {
    transform: scale(1);
}
.select-games span:hover {
    background: var(--Surface-Prymary-Hover, rgba(237, 238, 238, 0.08));
}
.select-games .show {
    color: var(--Text-Accent, #24ff6f);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    text-align: center;
    border-radius: 8px;
    border: 1px solid var(--Border-Primary-Default, rgba(255, 255, 255, 0.04));
    background: var(--Surface-Primary-Default, rgba(255, 255, 255, 0.04));
    padding: 10px 16px;
    cursor: pointer;
}
.select-games label:nth-of-type(n + 8) {
    display: none;
}
.select-games label.active {
    display: block;
}
.select-games label input:checked + span {
    filter: grayscale(0%);
    border: 1px solid var(--Border-Accent-Secondary, rgba(36, 255, 111, 0.24));
    background: var(--Surface-Accent-Hover, rgba(36, 255, 111, 0.04));
}
.select-name {
    color: var(--Text-Primary, #fff);
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    margin: 0 0 14px;
}
.section-main .container .tabs__caption {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 2px;
}
.section-main .container .tabs__caption li {
    cursor: pointer;
    padding: 12px 21px;
    border-radius: 8px 8px 0 0;
    display: flex;
    align-items: center;
    gap: 12px;
    color: var(--Text-Secondary, rgba(255, 255, 255, 0.48));
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    transition: 0.5s;
}
.section-main .container .tabs__caption li.active {
    cursor: default;
    background: linear-gradient(0deg, var(--Surface-Primary-Default, rgba(255, 255, 255, 0.04)) 0%, var(--Surface-Primary-Default, rgba(255, 255, 255, 0.04)) 100%), var(--Surface-BG, #131313) !important;
    color: var(--Text-Secondary, rgba(255, 255, 255, 0.48)) !important;
}
.section-main .container .tabs__caption li:hover {
    color: var(--Text-Accent, #24ff6f);
    background: var(--Surface-Accent-Hover, rgba(36, 255, 111, 0.04));
}
.pubg-icon {
    width: 24px;
    filter: invert(1) blur(0px);
}
body.light .pubg-icon {
    width: 24px;
    filter: none;
}
.section-main .container .tabs__content {
    display: none;
    border-radius: 0 0 16px 16px;
    background: linear-gradient(0deg, var(--Surface-Primary-Default, rgba(255, 255, 255, 0.04)) 0%, var(--Surface-Primary-Default, rgba(255, 255, 255, 0.04)) 100%), var(--Black-500, #131313);
    padding: 28px 32px;
}
.section-main .container .tabs__content.active {
    display: flex;
    gap: 48px;
}
.section-main .tab-left {
    flex: 1;
}
.section-main .tab-right {
    width: 281px;
}
.section-main .pay-name {
    color: var(--Text-Secondary, rgba(255, 255, 255, 0.48));
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    margin: 0 0 2px;
}
.section-main .select-pay {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin: 0 0 20px;
}
.section-main .select-pay label {
    display: block;
    width: calc(50% - 6px);
}
.section-main .select-pay input {
    display: none;
}
.section-main .select-pay .block {
    cursor: pointer;
    border-radius: 8px;
    background: var(--Surface-Primary-Default, rgba(255, 255, 255, 0.04));
    padding: 20px 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0px;
    line-height: 0px;
    position: relative;
    filter: grayscale(100%);
    border: 1px transparent solid;
    transition: 0.5s;
    height: 100%;
}
.section-main .select-pay .block img {
    transition: 0.5s;
}
.section-main .select-pay .block:hover img {
    transform: scale(1.1) !important;
}
.section-main .select-pay .block img:nth-child(2) {
    display: none;
}
.section-main .select-pay .discount {
    position: absolute;
    bottom: 0;
    right: 0;
    border-radius: 4px 8px 8px;
    background: var(--Green-500, #24ff6f);
    padding: 1px 3px 0 2px;
    color: var(--Text-Primary-Inverse, #131313);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
}
.section-main .select-pay input:checked + .block {
    border: 1px solid var(--Border-Accent-Secondary, rgba(36, 255, 111, 0.24));
    background: var(--Surface-Accent-Hover, rgba(36, 255, 111, 0.04));
    filter: grayscale(0%);
}
.section-main .select-pay .block:hover img,
.section-main .select-pay input:checked + .block img {
    transform: scale(1);
}
.section-main .select-pay .block:hover {
    border: 1px solid var(--Border-Accent-Secondary, rgba(36, 255, 111, 0.24));
    background: var(--Surface-Accent-Hover, rgba(36, 255, 111, 0.04));
    filter: grayscale(0%);
}
.section-main .select-pay input:checked + .block:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1;
    width: 28px;
    height: 29px;
    background: url(../img/succes.svg) no-repeat;
}
.section-main .info-total {
    display: flex;
    flex-direction: column;
    margin: 0 0 20px;
    gap: 4px;
}
.section-main .info-total .line {
    display: flex;
    justify-content: space-between;
    gap: 4px;
    position: relative;
}
.section-main .info-total .line:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1;
    border-bottom: 1px rgba(255, 255, 255, 0.08) dashed;
}
.section-main .question {
    position: relative;
}
.section-main .question .icon {
    cursor: pointer;
    width: 20px;
    height: 20px;
    background: url(../img/question.svg) no-repeat;
    transition: 0.5s;
}
.section-main .question .icon:hover {
    background: url(../img/question-hover.svg) no-repeat;
}
.section-main .info-total .name {
    display: flex;
    align-items: center;
    gap: 2px;
    color: var(--Text-Tetriary, rgba(255, 255, 255, 0.25));
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    background: linear-gradient(0deg, var(--Surface-Primary-Default, rgba(255, 255, 255, 0.04)) 0%, var(--Surface-Primary-Default, rgba(255, 255, 255, 0.04)) 100%), var(--Black-500, #131313);
    position: relative;
    z-index: 3;
    padding: 0 4px 0 0;
}
.section-main .info-total .sum {
    color: var(--Text-Primary, #fff);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    background: linear-gradient(0deg, var(--Surface-Primary-Default, rgba(255, 255, 255, 0.04)) 0%, var(--Surface-Primary-Default, rgba(255, 255, 255, 0.04)) 100%), var(--Black-500, #131313);
    position: relative;
    z-index: 3;
    padding: 0 0 0 4px;
}
.section-main .info-total .sum.sale {
    color: var(--Text-Accent, #24ff6f);
}
.section-main .enter-buy {
    text-decoration: none;
    cursor: pointer;
    border: 0px;
    padding: 8px;
    border-radius: 8px;
    border: 1px solid var(--Border-Gold, rgba(251, 208, 97, 0.2));
    background: var(--Button-Secondary, rgba(251, 208, 97, 0.1));
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 3px;
    color: var(--Text-Gold, #e2ba53);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    width: 100%;
    transition: 0.5s;
}
.section-main .enter-buy:hover {
    border: 1px solid rgba(226, 186, 83, 0.21);
    background: var(--Border-Gold, rgba(251, 208, 97, 0.2));
}
.section-main .enter-buy span {
    color: var(--Text-Gold, #e2ba53);
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.section-main .enter-buy span:after {
    content: "";
    width: 16px;
    height: 17px;
    background: url(../img/cashback.svg) no-repeat;
}
.section-main .label {
    margin: 0 0 24px;
    position: relative;
    flex: 1;
}
.section-main .error-info {
    position: relative;
    top: 0;
    left: 0;
    padding: 4px 0;
    color: #f45454;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 14px;
    border-radius: 8px;
    z-index: 8;
    transition: 0.5s;
}
.section-main .error-info a {
    text-decoration: none;
    color: var(--Text-Accent, #24ff6f);
}
.section-main .error-info a:hover {
    text-decoration: underline;
}
.section-main .label label {
    display: block;
    color: var(--Text-Secondary, rgba(255, 255, 255, 0.48));
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    margin: 0 0 2px;
}
.section-main .label .input {
    display: flex;
    align-items: center;
    padding: 8px 6px 8px 16px;
    border-radius: 8px;
    border: 1px solid var(--Border-Primary-Default, rgba(255, 255, 255, 0.04));
    background: var(--Surface-Primary-Default, rgba(255, 255, 255, 0.04));
    width: 100%;
    transition: 0.5s;
}
.section-main .label .input:hover {
    background: var(--Surface-Prymary-Hover, rgba(255, 255, 255, 0.08));
}
.section-main .label .input:focus-within {
    border: 1px solid var(--Border-Accent, #24ff6f);
}
.section-main .label.error .input {
    border: 1px solid rgba(255, 16, 16, 0.33);
    background: #ff00000a;
}
.section-main .label input {
    width: 100%;
    flex: 1;
    border: 0px;
    background: none;
    color: var(--Text-Primary, #fff);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
}
.section-main .label ::placeholder {
    color: var(--Text-Tetriary, rgba(255, 255, 255, 0.25));
}
.section-main .label .where {
    display: block;
    text-decoration: none;
    cursor: pointer;
    padding: 2px 8px;
    border-radius: 6px;
    border: 1px solid var(--Border-Primary-Default, rgba(255, 255, 255, 0.04));
    background: var(--Surface-Primary-Default, rgba(255, 255, 255, 0.04));
    color: var(--Text-Primary, #fff);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}
.section-main .flex-label {
    display: flex;
    gap: 12px;
}
.section-main .checkbox {
    display: block;
    margin: 0 0 24px;
}
.section-main .checkbox input {
    display: none;
}
.section-main .checkbox span {
    display: block;
    color: var(--Text-Tetriary, rgba(255, 255, 255, 0.25));
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    padding: 0 0 0 32px;
    position: relative;
    transition: 0.5s;
    cursor: pointer;
}
.section-main .checkbox span:hover {
    color: var(--Text-Tetriary, rgba(255, 255, 255, 0.38));
}
.section-main .checkbox a {
    color: var(--Text-Tetriary, rgba(255, 255, 255, 0.25));
    cursor: pointer;
}
#login-popup .vk-login:before {
    content: "";
    width: 28px;
    height: 28px;
    background: url(../img/popup-login-vk.svg) no-repeat;
}
#login-popup .vk-login:hover:before,
#ordersucces-popup .vk-login:hover:before {
    background: url(../img/vk-hover.svg) no-repeat;
}
#login-popup .tg:before {
    content: "";
    width: 28px;
    height: 28px;
    background: url(../img/popup-login-tl.svg) no-repeat;
}
#login-popup .tg:hover:before,
#ordersucces-popup .tg:hover:before {
    background: url(../img/tl-hover.svg) no-repeat;
}
#ordersucces-popup .vk-login {
    display: flex;
    align-items: center;
    text-decoration: none;
    cursor: pointer;
    padding: 12px 16px;
    border-radius: 8px;
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
    gap: 12px;
    color: var(--Text-Primary, #edeeee);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    margin: 0 0 8px;
    justify-content: center;
}
#ordersucces-popup .vk-login:before {
    content: "";
    width: 28px;
    height: 28px;
    background: url(../img/popup-login-vk.svg) no-repeat;
}
#ordersucces-popup .tg {
    display: flex;
    align-items: center;
    text-decoration: none;
    cursor: pointer;
    padding: 12px 16px;
    border-radius: 8px;
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
    gap: 12px;
    color: var(--Text-Primary, #edeeee);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    justify-content: center;
    margin: 0 0 20px;
}
#ordersucces-popup .tg:before {
    content: "";
    width: 28px;
    height: 28px;
    background: url(../img/popup-login-tl.svg) no-repeat;
}
#ordersucces-popup .vk-login:hover,
#ordersucces-popup .tg:hover {
    background: var(--Surface-Prymary-Hover, rgba(237, 238, 238, 0.08));
}
.section-main .checkbox span.active:before {
    background: url(../img/checkbox-active.svg) no-repeat;
}

.section-main .order {
    cursor: pointer;
    text-decoration: none;
    display: block;
    padding: 16px;
    border-radius: 8px;
    background: var(--Button-Accent, #24ff6f);
    color: var(--Text-Primary-Inverse, #131313);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
    width: 100%;
    text-align: center;
    transition: 0.5s;
}
.section-main .order:hover {
    background: var(--Button-Accent-Hover, #00c042);
}
.section-main .order.disabled {
    color: var(--Text-Secondary, rgba(255, 255, 255, 0.48));
    background: var(--Surface-Primary-Default, rgba(255, 255, 255, 0.04));
    pointer-events: none;
    cursor: not-allowed;
}
.section-main .flex-discount {
    margin: 0 0 24px;
    border-radius: 8px;
    border: 1px solid var(--Border-Primary-Default, rgba(255, 255, 255, 0.04));
    background: var(--Surface-Primary-Default, rgba(255, 255, 255, 0.04));
    display: flex;
}
.section-main .flex-discount .col-discount {
    display: flex;
    flex-direction: column;
    padding: 6px 16px;
    color: var(--Text-Secondary, rgba(255, 255, 255, 0.48));
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    flex: 1;
    gap: 8px;
    position: relative;
    cursor: pointer;
    transition: 0.5s;
}
.section-main .flex-discount .col-discount.active {
    background: var(--Surface-Accent-Hover, rgba(36, 255, 111, 0.04));
    color: var(--Text-Accent, #24ff6f);
}
.section-main .flex-discount .col-discount:hover {
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
}
.section-main .flex-discount .line {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    height: 2px;
    background: #131313;
    margin: -1px 0 0;
}
.section-main .flex-discount .col-discount:first-child .line {
    left: 16px;
}
.section-main .flex-discount .line:before {
    content: "";
    position: absolute;
    top: 50%;
    left: -4px;
    z-index: 1;
    width: 8px;
    height: 8px;
    background: #131313;
    border-radius: 555px;
    margin: -4px 0 0;
}
.section-main .flex-discount .col-discount.active .line:before {
    background: #24ff6f;
}
.section-main .flex-discount .col-discount.step .line:before {
    background: #24ff6f;
}
.section-main .flex-discount .col-discount:first-child .line:before {
    left: 0;
}
.section-main .flex-discount .line span {
    position: absolute;
    top: 0;
    left: 0;
    height: 2px;
    background: #24ff6f;
    z-index: 3;
}
.app-wrapper {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}
.main-content {
    flex: 1;
}
.footer {
    width: 100%;
    padding: 32px 0;
    border-top: 1px solid var(--Border-Primary-Default, rgba(255, 255, 255, 0.04));
}
.question-name:after {
    content: "";
    position: absolute;
    right: 16px;
    top: 50%;
    width: 24px;
    height: 24px;
    background: url(../img/question-arrow-hover.svg) no-repeat center;
    transform: translateY(-50%);
    transition: transform 0.3s ease;
}
.item-question:hover .question-name:after {
    background: url(../img/question-arrow-hover.svg) no-repeat center;
}
.answer {
    display: none;
    padding: 0 16px 16px;
    color: #edeeee7a;
    line-height: 1.5;
}
.footer .site-width {
    display: flex;
    justify-content: space-between;
    gap: 20px;
}
.footer .links {
    display: flex;
    gap: 16px;
    margin: 0 0 8px;
}
.footer a {
    color: var(--Text-Secondary, rgba(255, 255, 255, 0.48));
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    text-decoration: none;
    cursor: pointer;
}
.footer a:hover {
    color: #fff;
}
.footer .social {
    display: flex;
    gap: 12px;
}
.footer .tl {
    display: block;
    text-decoration: none;
    width: 29px;
    height: 28px;
    background: url(../img/tl.svg) no-repeat;
    background-size: contain !important;
}
.footer .vk {
    display: block;
    text-decoration: none;
    width: 29px;
    height: 28px;
    background: url(../img/vk.svg) no-repeat;
    background-size: contain !important;
}
.footer .tl:hover {
    background: url(../img/tl-hover.svg) no-repeat !important;
    background-size: contain !important;
}
.footer .vk:hover {
    background: url(../img/vk-hover.svg) no-repeat !important;
    background-size: contain !important;
}
.footer .menu {
    display: flex;
    gap: 76px;
}
.footer .menu ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.footer .pay {
    display: flex;
    flex-wrap: wrap;
    font-size: 0px;
    line-height: 0px;
    gap: 6px;
    max-width: 193px;
}
.footer .pay > div {
    width: 56px;
    height: 28px;
    padding: 7.226px 2.961px 6.72px 3.434px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    opacity: 0.32;
}
.item-question {
    border-radius: 8px;
    border-bottom: 1px solid var(--Border-Primary-Default, rgba(255, 255, 255, 0.04));
    padding: 12px;
    transition: 0.5s;
    margin: 0 0 12px;
}
.item-question:hover,
.item-question.active {
    background: var(--Surface-Prymary-Hover, rgba(255, 255, 255, 0.08));
}
.item-question .question-name {
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: space-between;
    cursor: pointer;
    color: var(--Text-Secondary, rgba(255, 255, 255, 0.48));
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}
.item-question:hover .question-name,
.item-question.active .question-name {
    color: var(--Text-Primary, #fff);
}
:deep(.promo-note-block) {
    background: #edeeee0a;
    border-radius: 8px;
    padding: 16px;
    margin: 12px 0;
}
:deep(.promo-note-title) {
    color: var(--Text-Primary, #edeeee);
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 8px;
}
:deep(.promo-note-content) {
    color: #edeeee7a;
    font-size: 12px;
    line-height: 16px;
    font-style: italic;
}
body.light :deep(.promo-note-block) {
    background: #1313130a;
}
body.light :deep(.promo-note-title) {
    color: var(--Text-Primary, #131313);
}
body.light :deep(.promo-note-content) {
    color: #1313137a;
}
:deep(.promo-note-block) .answer {
    padding: 0;
    color: inherit;
    font-size: inherit;
    line-height: inherit;
}
.item-question .answer {
    padding: 12px 0 0;
    color: var(--Text-Primary, #fff);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    display: none;
}
.item-question .answer span {
    font-size: 12px;
}
.item-question .question-name:after {
    content: "";
    transition: 0.5s;
    width: 20px;
    height: 20px;
    background: url(../img/question-arrow.svg) no-repeat;
}
.item-question:hover .question-name:after {
    background: url(../img/question-arrow-hover.svg) no-repeat;
}
.item-question.active .question-name:after {
    background: url(../img/question-arrow-hover.svg) no-repeat;
    transform: rotate(180deg);
}
.select-other-pay {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin: 0 0 24px;
}
.select-other-pay label {
    display: block;
    width: calc(50% - 6px);
}
.select-other-pay input {
    display: none;
}
.select-other-pay .block {
    display: flex;
    cursor: pointer;
    gap: 9px;
    padding: 12px 16px;
    border-radius: 8px;
    background: var(--Surface-Primary-Default, rgba(255, 255, 255, 0.04));
    transition: 0.5s;
    position: relative;
    border: 1px transparent solid;
}
.select-other-pay .icon {
    font-size: 0px;
    line-height: 0px;
    width: 32px;
}
.select-other-pay .other-info {
    flex: 1;
}
.select-other-pay .other-name {
    color: var(--Text-Secondary, rgba(255, 255, 255, 0.48));
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    margin: 0 0 4px;
}
.select-other-pay .price {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 5px;
    color: var(--Text-Primary, #fff);
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
}
.select-other-pay .price span:first-child {
    border-radius: 7px;
    background: var(--Surface-Accent, #24ff6f);
    padding: 0 6px;
    color: var(--Text-Primary-Inverse, #131313);
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
}
.select-other-pay input:checked + .block {
    border: 1px solid var(--Border-Accent-Secondary, rgba(36, 255, 111, 0.24));
    background: var(--Surface-Accent-Hover, rgba(36, 255, 111, 0.04));
    filter: grayscale(0%);
}
.select-other-pay input:checked + .block:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1;
    width: 28px;
    height: 29px;
    background: url(../img/succes.svg) no-repeat;
}
.topline {
    background: url(../img/top-bg-lk.png) no-repeat center center;
    background-size: cover;
    padding: 8px 0;
}
.topline.lk {
    color: #fff;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
}
.topline.close {
    background: url(../img/top-bg-close.png) no-repeat center center;
    background-size: cover;
    padding: 8px 0;
    color: #ffffffc9;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
}
.topline.close b {
    display: block;
    color: #ff3a3a;
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 16px;
}
.topline .site-width {
    display: flex;
    align-items: center;
    justify-content: center;
}
.topline .flex {
    display: flex;
    align-items: center;
    gap: 12px;
}
.topline.lk a {
    display: block;
    text-decoration: none;
    padding: 8px 16px;
    border-radius: 8px;
    background: var(--Button-Accent, #24ff6f);
    color: var(--Text-Primary-Inverse, #131313);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}
.topline .tg {
    display: flex;
    align-items: center;
    text-decoration: none;
    padding: 4px 8px;
    border-radius: 8px;
    background: #0b76f3;
    gap: 12px;
    color: var(--Text-Primary, #edeeee);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}
.topline .tg:before {
    content: "";
    width: 29px;
    height: 28px;
    background: url(../img/top-bg-close.svg) no-repeat;
    flex-shrink: 0;
}
.speed-enter {
    display: flex;
    gap: 6px;
}
.speed-enter span {
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 6px;
    border: 1px solid var(--Border-Primary-Default, rgba(237, 238, 238, 0.04));
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
    color: var(--Text-Primary, #edeeee);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    transition: 0.5s;
}
.speed-enter span:hover {
    background: #131313;
}
.section-message {
    border-radius: 16px;
    padding: 16px 16px 16px 56px;
    margin: 0 0 20px;
    color: var(--Text-Primary, #edeeee);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
}
.section-message .message-name {
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 16px;
    margin: 0 0 10px;
}
.section-message.succes {
    background: url(../img/section-message.svg) no-repeat 16px 16px, #24ff6f3d;
}
.section-message.succes .message-name {
    color: var(--Text-Accent, #24ff6f);
}
.section-message.error {
    background: url(../img/Stop_Sign.svg) no-repeat 16px 16px, #ff4b243d;
}
.section-message.error .message-name {
    color: #ff2424;
}
.section-message.warning {
    background: url(../img/Wavy_Warning.svg) no-repeat 16px 16px, #ffa7243d;
}
.section-message.warning .message-name {
    color: #ffb524;
}
.section-message .link {
    display: table;
    text-decoration: none;
    cursor: pointer;
    padding: 4px 12px;
    color: var(--Text-Primary-Inverse, #131313);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    border-radius: 8px;
    background: #fff;
}
.section-message .link:hover {
    background: #131313;
    color: #fff;
}
.section-message p {
    margin: 0 0 10px;
}
.title-section {
    color: var(--Text-Secondary, rgba(237, 238, 238, 0.48));
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    margin: 0 0 56px 160px;
    max-width: 465px;
}
.title-section h2 {
    display: block;
    color: var(--Text-Primary, #edeeee);
    font-size: 36px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    margin: 0 0 12px;
}
.section-advantages {
    margin: 0 0 120px;
}
.section-advantages p {
    margin: 0 0 12px;
}
.section-advantages .flex {
    display: flex;
    align-items: normal;
    gap: 12px;
    margin: 0 0 56px;
}
.section-advantages .item {
    flex: 1;
    color: var(--Text-Secondary, rgba(237, 238, 238, 0.48));
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    border-radius: 16px;
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
    padding: 20px 16px 20px 80px;
    position: relative;
}
.section-advantages a {
    text-decoration: none;
    color: var(--Text-Accent, #24ff6f);
}
.section-advantages a:hover {
    text-decoration: underline;
}
.section-advantages .name {
    color: var(--Text-Primary, #edeeee);
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    margin: 0 0 16px;
    max-width: 170px;
}
.section-advantages .icon {
    position: absolute;
    top: 20px;
    left: 16px;
    z-index: 1;
    font-size: 0px;
    line-height: 0px;
}
.section-advantages .btn {
    display: table;
    text-decoration: none !important;
    cursor: pointer;
    padding: 16px;
    border-radius: 8px;
    border: 1px solid var(--Surface-Accent, #24ff6f);
    background: var(--Surface-Accent-Hover, rgba(36, 255, 111, 0.04));
    width: 100%;
    max-width: 958px;
    margin: 0 auto;
    color: var(--Text-Accent, #24ff6f);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
    text-align: center;
}
.section-advantages .btn:hover {
    background: #24ff6f;
    color: #131313;
}
#top {
    position: fixed;
    bottom: 80px;
    right: 23px;
    z-index: 9;
    cursor: pointer;
    width: 56px;
    height: 56px;
    background: url(../img/top.svg) no-repeat;
}
.section-3 {
    margin: 0 0 120px;
}
.section-3 .site-width {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}
.section-3 .col-left {
    flex: 1;
    padding: 28px 32px 32px;
    border-radius: 16px;
    background: linear-gradient(0deg, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 0%, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 100%), var(--Surface-BG, #131313);
}
.section-3 .col-right {
    width: 477px;
    padding: 28px 32px 32px;
    border-radius: 16px;
    background: linear-gradient(0deg, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 0%, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 100%), var(--Surface-BG, #131313);
    max-width: 50%;
}
.section-3 .name {
    color: var(--Text-Primary, #fff);
    font-family: Inter;
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    margin: 0 0 24px;
}
.section-3 .col-right ol {
    margin: 0;
    padding: 0;
    list-style-type: none;
    counter-reset: item;
}
.section-3 .col-right ol li {
    position: relative;
    padding: 12px 0 12px 20px;
    color: var(--Text-Primary, #fff);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}
.section-3 .col-right ol li:before {
    content: counter(item) "";
    counter-increment: item;
    color: var(--Text-Accent, #24ff6f);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    position: absolute;
    top: 12px;
    left: 0;
}
.section-3 .col-right ol a {
    padding: 4px 7px;
    text-decoration: none;
    border-radius: 6px;
    border: 1px solid var(--Border-Primary-Default, rgba(255, 255, 255, 0.04));
    background: var(--Surface-Primary-Default, rgba(255, 255, 255, 0.04));
    color: var(--Text-Primary, #fff);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    margin: 0 0 0 7px;
}
.section-3 .col-right ol a:hover,
.section-3 .col-right .where:hover {
    border: 1px solid var(--Border-Accent-Secondary, rgba(36, 255, 111, 0.24));
    background: var(--Surface-Accent-Hover, rgba(36, 255, 111, 0.04));
    color: var(--Text-Accent, #24ff6f);
}
.section-3 .desc {
    margin: 0 0 24px;
    color: var(--Text-Secondary, rgba(237, 238, 238, 0.48));
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}
.section-4 {
    margin: 0 0 104px;
}
.section-4 .flex {
    display: flex;
    gap: 12px;
    margin: 0 0 56px;
}
.section-4 .item {
    flex: 1;
    padding: 16px;
    border-radius: 16px;
    border: 1px solid var(--Border-Primary-Default, rgba(237, 238, 238, 0.04));
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
    position: relative;
    color: var(--Text-Secondary, rgba(237, 238, 238, 0.48));
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    text-align: center;
}
.section-4 .photo {
    display: table;
    margin: 0 auto 15px;
    border-radius: 555px;
    overflow: hidden;
    width: 102px;
    height: 102px;
}
.section-4 .rating {
    display: inline-flex;
    position: absolute;
    top: 10px;
    right: 21px;
}
.section-4 .rating img {
    position: relative;
    margin: 0 -10px 0 0;
}
.section-4 .name {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 0 15px;
    gap: 8px;
    color: var(--Text-Primary, #edeeee);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
}
.section-4 .vk {
    display: block;
    text-decoration: none;
    width: 25px;
    height: 24px;
    background: url(../img/section4-vk.svg) no-repeat;
}
.section-4 .all {
    display: table;
    text-decoration: none !important;
    cursor: pointer;
    padding: 16px;
    border-radius: 8px;
    border: 1px solid var(--Surface-Accent, #24ff6f);
    background: var(--Surface-Accent-Hover, rgba(36, 255, 111, 0.04));
    width: 100%;
    max-width: 958px;
    margin: 0 auto 10px;
    color: var(--Text-Accent, #24ff6f);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
    text-align: center;
}
.section-4 .all:hover {
    background: #24ff6f;
    color: #131313;
}
.section-4 .order {
    display: table;
    text-decoration: none !important;
    cursor: pointer;
    padding: 16px;
    border-radius: 8px;
    background: var(--Button-Accent, #24ff6f);
    width: 100%;
    max-width: 958px;
    margin: 0 auto;
    color: var(--Text-Primary-Inverse, #131313);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
    text-align: center;
    border: 1px transparent solid;
}
.section-4 .order:hover {
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
    border: 1px solid var(--Surface-Accent, #24ff6f);
    color: #24ff6f;
}
.popup-block {
    display: none;
}
.popup-block .popup-bg {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: #2b2b2bbf;
    z-index: 99999999999999;
    overflow: auto;
    width: 100%;
    height: 100%;
}
.popup-block .close {
    width: 24px;
    height: 24px;
    background: url(../img/popup-close.svg) no-repeat;
    cursor: pointer;
    position: absolute;
    top: 20px;
    right: 20px;
    transition: 0.5s;
}
.popup-block .title {
    color: var(--Text-Primary, #edeeee);
    text-align: center;
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    margin: 0 0 20px;
}
#promo-popup .vk {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    padding: 12px 16px;
    border-radius: 8px;
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
    gap: 12px;
    color: var(--Text-Primary, #edeeee);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}
#promo-popup .vk:hover {
    background: var(--Surface-Prymary-Hover, rgba(237, 238, 238, 0.08));
}
#promo-popup {
    text-align: center;
}
#promo-popup .vk:before {
    content: "";
    width: 28px;
    height: 28px;
    background: url(../img/popup-promo-vk.svg) no-repeat;
}
#promo-popup .vk:after {
    content: "";
    width: 24px;
    height: 24px;
    background: url(../img/popup-promo-link.svg) no-repeat;
}
#succes-popup .vk {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    padding: 12px 16px;
    border-radius: 8px;
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
    gap: 12px;
    color: var(--Text-Primary, #edeeee);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}
.section-history .head ul li {
    cursor: pointer;
    color: var(--Text-Secondary, rgba(237, 238, 238, 0.48));
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    padding: 8px 32px;
    transition: 0.5s;
    border-radius: 8px;
}
.section-history .head ul li:hover {
    background: var(--Surface-Accent-Hover, rgba(36, 255, 111, 0.04));
    color: var(--Text-Accent, #24ff6f);
}
.section-history .head ul li.active {
    cursor: default;
    color: var(--Text-Primary, #edeeee);
    background: linear-gradient(0deg, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 0%, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 100%), var(--Surface-BG, #131313);
}
.section-history .tabs__content {
    display: none;
}
.section-history .top-selects {
    display: flex;
    margin: 0 0 16px;
    gap: 4px;
}
.section-history .date-input {
    padding: 4px 8px 4px 16px;
    border-radius: 8px;
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
    display: flex;
    align-items: center;
}
.section-history .date-input input {
    background: none;
    border: 0px;
    color: var(--Text-Primary, #edeeee);
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
}
.section-history .date-input input::-webkit-calendar-picker-indicator {
    transition: 0.5s;
    width: 28px;
    height: 28px;
    background: url(../img/webkit-calendar-picker-indicator.svg) no-repeat right center;
}
.section-history .links-tabs {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 4px;
}
.section-history .links-tabs a {
    display: flex;
    align-items: center;
    gap: 5px;
    text-decoration: none;
    color: var(--Text-Primary, #edeeee);
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    padding: 8px;
    border-radius: 8px;
    border: 1px solid var(--Border-Primary-Default, rgba(237, 238, 238, 0.04));
}
.section-history .links-tabs a:hover {
    border: 1px solid var(--Border-Primary-Hover, rgba(237, 238, 238, 0.08));
    background: var(--Surface-Prymary-Hover, rgba(237, 238, 238, 0.08));
}
.section-history .links-tabs li.active a {
    border: 1px solid var(--Border-Accent-Secondary, rgba(36, 255, 111, 0.24));
    background: var(--Surface-Accent-Hover, rgba(36, 255, 111, 0.04));
    color: var(--Text-Accent, #24ff6f);
}
.section-history .services-block {
    border-radius: 8px;
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
    margin: 0 0 8px;
    padding: 12px;
}
.section-history .services-block .head-title {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
    margin: 0 0 16px;
}
.section-history .services-block .head-title .title {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 8px;
    overflow: hidden;
    color: var(--Text-Primary, #edeeee);
    text-overflow: ellipsis;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
}
.section-history .services-block .date {
    color: var(--Text-Secondary, rgba(237, 238, 238, 0.48));
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}
.section-history .services-block .id {
    margin: 0 0 16px;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 2px 6px;
    border-radius: 4px;
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
}
.section-history .services-block .id input {
    flex: 1;
    width: 100%;
    background: none;
    border: 0px;
    overflow: hidden;
    color: var(--Text-Primary, #edeeee);
    text-overflow: ellipsis;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}
.section-history .services-block .copy {
    cursor: pointer;
    border-radius: 6px;
    border: 1px solid var(--Border-Accent-Secondary, rgba(36, 255, 111, 0.24));
    background: var(--Surface-Accent-Hover, rgba(36, 255, 111, 0.04));
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0px;
    line-height: 0px;
    width: 28px;
    height: 28px;
}
.section-history .services-block .pay-skeleton-animation {
    display: block;
    text-decoration: none;
    cursor: pointer;
    padding: 8px;
    text-align: center;
    border-radius: 8px;
    background: #ffffff0a;
    color: var(--Text-Primary-Inverse, #131313);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
    width: 100%;
    transition: 0.5s;
}
.section-history .services-block .pay {
    display: block;
    text-decoration: none;
    cursor: pointer;
    padding: 8px;
    text-align: center;
    border-radius: 8px;
    background: var(--Button-Accent-Hover, #01db4b);
    color: var(--Text-Primary-Inverse, #131313);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
    width: 100%;
    transition: 0.5s;
}
.section-history .services-block .succes {
    border-radius: 8px;
    background: var(--Surface-Accent-Hover, rgba(36, 255, 111, 0.04)) !important;
    color: var(--Text-Accent, #24ff6f) !important;
    font-weight: 400;
    cursor: default;
}
.section-history .services-block .info-flex {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    margin: 0 0 16px;
}
.section-history .services-block .info-flex .name {
    color: var(--Text-Secondary, rgba(237, 238, 238, 0.48));
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}
.section-history .services-block .info-flex .info {
    color: var(--Text-Primary, #edeeee);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.question-all {
    position: relative;
}
.question-all .icon {
    cursor: pointer;
    width: 20px;
    height: 20px;
    background: url(../img/question.svg) no-repeat;
    transition: 0.5s;
}
.question-all .icon:hover {
    background: url(../img/question-hover.svg) no-repeat;
}
.question-all .text {
    position: absolute;
    bottom: calc(100% + 0px);
    left: 0;
    z-index: 9;
    padding: 12px;
    border-radius: 8px;
    background: var(--Text-Primary-Inverse, #131313);
    color: var(--Text-Primary, #edeeee);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    width: 266px;
    display: none;
    transition: 0.5s;
}
.question-all:hover > .text {
    display: block;
}
.section-history .services-block .info-flex .new {
    display: flex;
    align-items: center;
    gap: 2px;
    color: var(--Text-Tetriary, rgba(237, 238, 238, 0.18));
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
.section-history .services-block .info-flex .last {
    display: flex;
    align-items: center;
    gap: 4px;
    color: #ffd703;
    font-size: 23px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}
.section-history .services-block .info-flex .last .name {
    display: none;
}
.section-history .services-block .info-flex .last div:nth-child(2) {
    display: flex;
    align-items: center;
    gap: 4px;
}
.section-history .services-block .info-flex .last svg {
    width: 20px;
}
.section-history .services-block .info-flex .last img {
    width: 20px;
}
.section-history .services-block .info-flex .col.mobile {
    display: none;
}
.pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    margin: 16px 0 0;
    padding: 8px 0;
    height: 48px;
    width: 100%;
}
.pagination span {
    padding: 4px;
    border-radius: 8px;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--Text-Secondary, rgba(237, 238, 238, 0.48));
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}
.pagination a {
    padding: 4px;
    border-radius: 8px;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--Text-Secondary, rgba(237, 238, 238, 0.48));
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    text-decoration: none;
    border: 1px transparent solid;
}
.pagination .prev {
    position: absolute;
    top: 50%;
    left: 0;
    z-index: 1;
    margin: -16px 0 0;
}
.pagination .next {
    position: absolute;
    top: 50%;
    right: 0;
    z-index: 1;
    transform: rotate(180deg);
    margin: -16px 0 0;
}
.pagination a:hover {
    border-radius: 8px;
    border: 1px solid var(--Border-Primary-Hover, rgba(237, 238, 238, 0.08));
    background: var(--Surface-Prymary-Hover, rgba(237, 238, 238, 0.08));
}
.section-order-one {
    padding: 20px 32px;
    border-radius: 16px;
    border: 1px solid var(--Border-Primary-Default, rgba(237, 238, 238, 0.04));
    background: linear-gradient(0deg, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 0%, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 100%), var(--Surface-BG, #131313);
    margin: 0 0 8px;
}
.section-order-one .head {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 16px;
}
.section-order-one .head .title {
    flex: 1;
    color: var(--Text-Primary, #edeeee);
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
}
.section-order-one .head .btn {
    display: flex;
    align-items: center;
    gap: 4px;
    text-decoration: none;
    cursor: pointer;
    padding: 8px 12px;
    border-radius: 8px;
    border: 1px solid var(--Surface-Accent, #24ff6f);
    background: var(--Surface-Accent-Hover, rgba(36, 255, 111, 0.04));
    color: var(--Text-Accent, #24ff6f);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}
.section-order-one .check-payment {
    border-radius: 8px;
    border: 1px solid rgba(255, 214, 0, 0.1);
    background: #ffd6000f;
    padding: 20px 12px;
    margin: 0 0 16px;
}
.section-order-one .check-payment .title {
    color: #ffd703;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
    margin: 0 0 16px;
    text-align: center;
}
.section-order-one .pay {
    display: flex;
    align-items: center;
    gap: 16px;
    margin: 0 0 16px;
    border-radius: 8px;
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
    padding: 12px 16px;
}
.section-order-one .check-payment.succes {
    border-radius: 8px;
    border: 1px solid rgba(51, 255, 0, 0.1);
    background: #33ff000f;
}
.section-order-one .check-payment.succes .title {
    color: var(--Green-500, #24ff6f);
}
body.light .section-history .services-block .id {
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
}
body.light .section-history .links-tabs a {
    border: 1px solid var(--Border-Primary-Default, rgba(19, 19, 19, 0.06));
    color: var(--Text-Primary, #131313);
}
body.light .section-history .links-tabs a img {
    filter: brightness(0) saturate(100%) invert(0%);
}
.section-order-one .check-payment.error,
.section-order-one .check-payment.canceled {
    border-radius: 8px;
    border: 1px solid rgba(255, 34, 0, 0.1);
    background: #ff22000f;
}
.section-order-one .check-payment.error .title,
.section-order-one .check-payment.canceled .title {
    color: #f20;
}
.section-order-three {
    padding: 30px 32px 30px 200px;
    background: url(../img/sectionorderthreebg_1x.webp) no-repeat;
    background-size: cover;
    border-radius: 16px;
    border: 1px solid var(--Border-Primary-Default, rgba(237, 238, 238, 0.04));
    overflow: hidden;
}
body.light .section-order-three {
    background: url(../img/sectionorderthreebglight_1x.webp) no-repeat 0 center;
    background-size: cover;
}
.section-order-three .title {
    color: var(--Text-Primary, #edeeee);
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    margin: 0 0 8px;
}
.section-order-three .desc {
    margin: 0 0 20px;
    color: var(--Text-Secondary, rgba(237, 238, 238, 0.48));
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
}
.section-order-three .desc span {
    color: #ffd703;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}
.section-order-three .desc img {
    width: 20px;
    height: 20px;
    margin: 0 6px 0 2px;
    position: relative;
    top: 5px;
}
.section-order-three .label {
    margin: 0 0 20px;
    position: relative;
    flex: 1;
}
.section-order-three .label label {
    display: block;
    color: var(--Text-Secondary, rgba(255, 255, 255, 0.48));
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    margin: 0 0 2px;
}
.section-order-three .label .input {
    display: flex;
    align-items: center;
    padding: 8px 6px 8px 16px;
    border-radius: 8px;
    border: 1px solid var(--Border-Primary-Default, rgba(255, 255, 255, 0.04));
    background: var(--Surface-Primary-Default, rgba(255, 255, 255, 0.04));
    width: 100%;
    transition: 0.5s;
}
.section-order-three .label input {
    width: 100%;
    flex: 1;
    border: 0px;
    background: none;
    color: var(--Text-Primary, #fff);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
}
.section-order-three .label .copy {
    display: block;
    text-decoration: none;
    cursor: pointer;
    padding: 2px 8px;
    border-radius: 6px;
    border: 1px solid var(--Border-Primary-Default, rgba(255, 255, 255, 0.04));
    background: var(--Surface-Primary-Default, rgba(255, 255, 255, 0.04));
    color: var(--Text-Primary, #fff);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    transition: 0.5s;
}
.section-order-three .buttons {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 20px;
}
.section-order-three .buttons .copy {
    border-radius: 8px;
    background: var(--Button-Accent, #24ff6f);
    padding: 8px 12px;
    color: var(--Text-Primary-Inverse, #131313);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
    cursor: pointer;
}
section-order-three .buttons .full {
    color: var(--Text-Accent, #24ff6f);
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    text-decoration: none;
}
.section-order-three .buttons .full {
    color: var(--Text-Accent, #24ff6f);
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    text-decoration: none;
}
.section-order-one .pay .icon {
    font-size: 0px;
    line-height: 0px;
    width: 32px;
}
.section-order-one .pay .icon img {
    width: 32px;
    height: 32px;
}
body.light .section-order-one .pay .icon.profile-steam img {
    filter: brightness(0) saturate(100%) invert(0%);
}
body.light .section-history .services-block .head-title svg,
.section-history .services-block .head-title img {
    filter: brightness(0) saturate(100%) invert(0%);
}
.popup-block .block {
    border-radius: 16px;
    background: linear-gradient(0deg, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 0%, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 100%), var(--Surface-BG, #131313);
    width: 100%;
    max-width: 447px;
    padding: 40px 32px;
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 99999999999;
    transform: translate(-50%, -50%);
    color: var(--Text-Secondary, rgba(237, 238, 238, 0.48));
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}
.popup-block .close {
    width: 24px;
    height: 24px;
    background: url(../img/popup-close.svg) no-repeat;
    cursor: pointer;
    position: absolute;
    top: 20px;
    right: 20px;
    transition: 0.5s;
}
.popup-block .close:hover {
    opacity: 0.8;
}
.popup-block .title {
    color: var(--Text-Primary, #edeeee);
    text-align: center;
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    margin: 0 0 20px;
}
.popup-block .desc {
    color: var(--Text-Secondary, rgba(237, 238, 238, 0.48));
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    margin: 0 0 20px;
}
#promo-popup .vk {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    padding: 12px 16px;
    border-radius: 8px;
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
    gap: 12px;
    color: var(--Text-Primary, #edeeee);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}
.section-order-one .pay .name {
    flex: 1;
    color: var(--Text-Primary, #edeeee);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}
.section-order-one .pay .price {
    border-radius: 7px;
    border: 1px solid var(--Border-Accent-Secondary, rgba(36, 255, 111, 0.24));
    background: var(--Surface-Accent-Hover, rgba(36, 255, 111, 0.04));
    padding: 0 6px;
    color: var(--Text-Accent, #24ff6f);
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
}
.section-order-one .info {
    color: var(--Text-Secondary, rgba(237, 238, 238, 0.48));
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    text-align: center;
}
.section-order-one .info-block {
    border-radius: 8px;
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
    padding: 12px;
    margin: 0 0 16px;
}
.section-order-one .info-block .title {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 12px 0;
    color: #ffd703;
    font-size: 23px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}
.section-order-one .info-block .title svg {
    width: 20px;
}
.section-order-one .info-block .id {
    margin: 0 0 16px;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 2px 6px;
    border-radius: 4px;
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
}
.section-order-one .info-block .id input {
    flex: 1;
    width: 100%;
    background: none;
    border: 0px;
    overflow: hidden;
    color: var(--Text-Primary, #edeeee);
    text-overflow: ellipsis;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}
.section-order-one .info-block .copy {
    cursor: pointer;
    border-radius: 6px;
    border: 1px solid var(--Border-Accent-Secondary, rgba(36, 255, 111, 0.24));
    background: var(--Surface-Accent-Hover, rgba(36, 255, 111, 0.04));
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0px;
    line-height: 0px;
    width: 28px;
    height: 28px;
    transition: 0.5s;
}
.section-order-one .info-block .copy:hover {
    background: var(--Button-Accent-Hover, #01db4b);
}
.section-order-one .info-block .copy:hover path {
    stroke: #131313;
}
.section-order-one .info-block .fields {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.section-order-one .info-block .fields .line {
    display: flex;
    gap: 10px;
    justify-content: space-between;
    position: relative;
    color: var(--Text-Primary, #edeeee);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}
.section-order-one .info-block .fields .line:before {
    content: "";
    position: absolute;
    bottom: 5px;
    left: 0;
    right: 0;
    z-index: 1;
    height: 1px;
    border-bottom: 1px rgba(237, 238, 238, 0.08) dashed;
}
body.light .section-order-one .info-block .fields .line:before {
    border-bottom: 1px rgba(0, 0, 0, 0.08) dashed;
}
.section-order-one .info-block .fields .name {
    display: flex;
    align-items: center;
    gap: 2px;
    position: relative;
    z-index: 3;
    padding: 0 4px 0 0;
}
.section-order-one .info-block .fields .desc {
    position: relative;
    z-index: 3;
    padding: 0 0 0 4px;
}
.section-order-one .pay-btn {
    display: block;
    width: 100%;
    text-align: center;
    cursor: pointer;
    padding: 8px;
    border-radius: 8px;
    background: var(--Button-Accent, #24ff6f);
    color: var(--Text-Primary-Inverse, #131313);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
    margin-top: 20px;
}
.section-order-two {
    border-radius: 16px;
    border: 1px solid var(--Border-Primary-Default, rgba(237, 238, 238, 0.04));
    background: linear-gradient(0deg, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 0%, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 100%), var(--Surface-BG, #131313);
    padding: 20px 32px;
    margin: 0 0 8px;
}
.section-order-two .head {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 28px;
    margin: 0 0 16px;
    color: var(--Text-Primary, #edeeee);
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
}
.section-order-two .stars {
    display: flex;
    font-size: 0px;
    line-height: 0px;
}
.section-order-two .stars .star {
    position: relative;
    margin: 0 0 0 -12px;
    width: 30px;
    height: 27px;
    background: url(../img/star-empty.svg) no-repeat;
}
.section-order-two .stars.active .star {
    background: url(../img/star-hover.svg) no-repeat;
}
.section-order-two .stars:hover .star {
    background: url(../img/star-hover.svg) no-repeat;
}
.section-order-two .stars .star.active {
    background: url(../img/star-hover.svg) no-repeat !important;
}
.section-order-two .stars .star.active ~ .star {
    background: url(../img/star-empty.svg) no-repeat;
}
.section-order-two .stars .star:hover ~ .star {
    background: url(../img/star-empty.svg) no-repeat;
}
.section-order-two .stars .star:hover {
    background: url(../img/star-hover.svg) no-repeat !important;
}
#succes-popup {
    text-align: center;
}
#succes-popup .vk:before {
    content: "";
    width: 28px;
    height: 28px;
    background: url(../img/popup-promo-vk.svg) no-repeat;
}
#succes-popup .vk:after {
    content: "";
    width: 24px;
    height: 24px;
    background: url(../img/popup-promo-link.svg) no-repeat;
}
.popup-block .name {
    color: var(--Text-Accent, #24ff6f);
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    margin: 0 0 20px;
}
#login-popup ul {
    margin: 0 0 20px;
    padding: 0 0 0 30px;
    color: var(--Text-Accent, #24ff6f);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.tg-profile {
    content: "";
    width: 28px;
    height: 28px;
    background: url(../img/popup-login-vk.svg) no-repeat;
}
#login-popup .vk-login {
    display: flex;
    align-items: center;
    text-decoration: none;
    cursor: pointer;
    padding: 12px 16px;
    border-radius: 8px;
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
    gap: 12px;
    color: var(--Text-Primary, #edeeee);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    margin: 0 0 8px;
    justify-content: center;
}
#login-popup .vk-login:before {
    content: "";
    width: 28px;
    height: 28px;
    background: url(../img/popup-login-vk.svg) no-repeat;
}
#login-popup .vk-login:hover:before,
#ordersucces-popup .vk-login:hover:before {
    background: url(../img/vk-hover.svg) no-repeat;
}
#login-popup .tg {
    display: flex;
    align-items: center;
    text-decoration: none;
    cursor: pointer;
    padding: 12px 16px;
    border-radius: 8px;
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
    gap: 12px;
    color: var(--Text-Primary, #edeeee);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    justify-content: center;
}
#login-popup .tg:before {
    content: "";
    width: 28px;
    height: 28px;
    background: url(../img/popup-login-tl.svg) no-repeat;
}
#login-popup .tg:hover:before,
#ordersucces-popup .tg:hover:before {
    background: url(../img/tl-hover.svg) no-repeat;
}
#login-popup .vk-login:hover,
#login-popup .tg:hover {
    background: var(--Surface-Prymary-Hover, rgba(237, 238, 238, 0.08));
}
#ordersucces-popup .vk {
    display: flex;
    align-items: center;
    text-decoration: none;
    cursor: pointer;
    padding: 12px 16px;
    border-radius: 8px;
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
    gap: 12px;
    color: var(--Text-Primary, #edeeee);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    margin: 0 0 8px;
    justify-content: center;
}
#ordersucces-popup .vk:before {
    content: "";
    width: 28px;
    height: 28px;
    background: url(../img/popup-login-vk.svg) no-repeat;
}
#ordersucces-popup .tl {
    display: flex;
    align-items: center;
    text-decoration: none;
    cursor: pointer;
    padding: 12px 16px;
    border-radius: 8px;
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
    gap: 12px;
    color: var(--Text-Primary, #edeeee);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    justify-content: center;
    margin: 0 0 20px;
}
#ordersucces-popup .tl:before {
    content: "";
    width: 28px;
    height: 28px;
    background: url(../img/popup-login-tl.svg) no-repeat;
}
#ordersucces-popup .vk:hover,
#ordersucces-popup .tl:hover {
    background: var(--Surface-Prymary-Hover, rgba(237, 238, 238, 0.08));
}
#ordersucces-popup .block {
    max-width: 596px;
}
#ordersucces-popup a {
    color: var(--Text-Accent, #24ff6f);
    text-decoration: none;
}
#ordersucces-popup ul {
    margin: 0 0 20px;
    padding: 0 0 0 30px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.code-pay {
    border-radius: 12px;
    background: var(--Surface-Accent-Hover, rgba(36, 255, 111, 0.04));
    padding: 16px;
    margin: 0 0 20px;
}
.code-pay .code-name {
    color: var(--Text-Secondary, rgba(237, 238, 238, 0.48));
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    margin: 0 0 2px;
}
.code-pay .code-flex {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 6px;
    border-radius: 8px;
    border: 1px solid var(--Border-Primary-Default, rgba(237, 238, 238, 0.04));
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
}
.code-pay .code-input {
    flex: 1;
    width: 100%;
    border: 0px;
    background: none;
    color: var(--Text-Primary, #edeeee);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
}
.code-pay .copy {
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 6px;
    border: 1px solid var(--Border-Primary-Default, rgba(237, 238, 238, 0.04));
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
    color: var(--Text-Primary, #edeeee);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    transition: 0.5s;
}
.code-pay .copy:hover {
    background: #edeeee;
    color: #111;
}
.mobile-menu,
.mobile-bottom {
    display: none;
}
.footer .menu ul:nth-child(2) li:last-child {
    display: none;
}
.header .menu .enter,
.section-5,
.section-main .label.mobile,
.select-mobile-country .select,
.select-name-mobile,
.select-mobile-games {
    display: none;
}
.skeleton-img {
    filter: grayscale(100%) brightness(95%) contrast(90%);
    opacity: 0;
}
.skeleton-animation {
    position: relative;
    overflow: hidden;
    border-radius: 8px;
}
.skeleton-animation:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    transform: translate(-100%);
    border-radius: 8px;
    background: linear-gradient(90deg, transparent 0, rgba(var(--skeleton-color, 255, 255, 255), 0.1) 20%, rgba(var(--skeleton-color, 255, 255, 255), 0.2) 60%, transparent);
    animation: shimmer 2s infinite;
}
@keyframes shimmer {
    to {
        border-radius: 8px;
        transform: translate(100%);
    }
}
body.light :root {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
:root[data-theme="dark"] {
    --skeleton-color: 255, 255, 255;
}
:root[data-theme="light"] {
    --skeleton-color: 0, 0, 0;
}
body.light .pagination .pay:hover:not(:disabled) {
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12));
}
.section-contacts {
    padding: 40px 0;
    color: #fff;
    min-height: calc(100vh - 200px);
}
.topline .exit {
    cursor: pointer;
    width: 20px;
    height: 20px;
    background: url(../img/topline-close.svg) no-repeat;
    flex-shrink: 0;
}
body.light h1 {
    color: var(--Text-Primary, #131313);
}
.service-mode {
    color: gray;
    font-size: 18px;
    margin-bottom: 40px;
}
.company-info {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.company-name {
    font-size: 16px;
    color: #fff;
}
body.light .section-order-one,
body.light .section-order-two {
    background: #fff;
}
body.light .section-order-one .head .title {
    color: var(--Text-Primary, #131313);
}
body.light .section-order-one .head .btn {
    border-radius: 6px;
    border: 1px solid var(--Border-Accent-Secondary, rgba(0, 190, 58, 0.24));
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12));
    color: var(--Text-Accent, #0db740);
}
body.light .section-order-one .head .btn:hover {
    background: var(--Button-Accent-Hover, #00be3a);
    color: var(--Text-Primary-Inverse, #fff);
}
body.light .section-order-one .head .btn path {
    stroke: #0db740;
}
body.light .section-order-one .head .btn:hover path {
    stroke: #fff;
}
body.light .section-order-one .check-payment {
    border-radius: 8px;
    border: 1px solid rgba(255, 170, 0, 0);
    background: #ffaa0026;
}
body.light .section-order-one .check-payment .title {
    color: #d99800;
}
body.light .section-order-one .pay {
    border-radius: 8px;
    background: #ffaa0026;
}
body.light .section-order-one .pay .name {
    color: var(--Text-Primary, #131313);
}
body.light .section-order-one .pay .price {
    border-radius: 7px;
    border: 1px solid var(--Border-Accent-Secondary, rgba(0, 190, 58, 0.24));
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12));
    color: var(--Text-Accent, #0db740);
}
body.light .section-order-one .check-payment.succes {
    border-radius: 8px;
    border: 1px solid rgba(51, 255, 0, 0.1);
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12));
}
body.light .section-order-one .check-payment.succes .title {
    color: var(--Text-Accent, #0db740);
}
body.light .section-order-one .check-payment.succes .pay {
    border-radius: 8px;
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12));
}
body.light .section-order-one .check-payment.error,
body.light .section-order-one .check-payment.canceled {
    border-radius: 8px;
    border: 1px solid rgba(255, 34, 0, 0.1);
    background: #ff22001a;
}
body.light .section-order-one .pay {
    border-radius: 8px;
    background: #ff22000f;
}
body.light .section-lk {
    background: url(../img/section-main-bg-black.png) no-repeat center bottom;
}
body.light .section-order-one .info-block .id {
    border-radius: 8px;
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
}
body.light .section-order-one .info-block .id input {
    color: var(--Text-Primary, #131313);
}
body.light .section-order-one .info-block .copy {
    border-radius: 6px;
    border: 1px solid var(--Border-Accent-Secondary, rgba(0, 190, 58, 0.24));
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12));
}
body.light .section-order-one .info-block .copy path {
    stroke: #0db740;
}
body.light .section-order-one .info-block .copy:hover {
    background: var(--Button-Accent-Hover, #01db4b);
}
body.light .section-order-one .info-block .copy:hover path {
    stroke: #fff;
}
body.light .section-order-one .info-block .fields .line {
    color: var(--Text-Tetriary, rgba(19, 19, 19, 0.4));
}
body.light .section-order-one .info-block .fields .name {
    background: #fff;
}
body.light .section-order-one .info-block .fields .desc {
    background: #fff;
    color: var(--Text-Primary, #131313);
}
body.light .section-order-one .pay-btn {
    background: var(--Button-Accent, #0db740);
    color: var(--Text-Primary-Inverse, #fff);
}
body.light .section-order-one .pay-btn:hover {
    background: var(--Button-Accent-Hover, #00be3a);
}
body.light .section-order-two .head,
body.light .section-order-two .name {
    color: var(--Text-Primary, #131313);
}
body.light .section-order-two .question a {
    border: 1px solid var(--Border-Primary-Default, rgba(19, 19, 19, 0.06));
    color: var(--Text-Primary, #131313);
}
body.light .section-order-two .question a:hover {
    border: 1px solid var(--Button-Accent-Hover, #00be3a);
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12));
    color: var(--Text-Accent, #0db740);
}
body.light .section-order-two .send {
    background: var(--Button-Accent, #0db740);
    color: var(--Text-Primary-Inverse, #fff);
}
body.light .section-order-two .add {
    border: 1px solid var(--Surface-Accent, #0db740);
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12));
    color: var(--Text-Accent, #0db740);
}
body.light .section-order-two .send:hover,
body.light .section-order-two .add:hover {
    background: var(--Button-Accent-Hover, #00be3a);
    color: var(--Text-Primary-Inverse, #fff);
}
body.light .section-order-two .stars {
    display: none;
}
body.light .section-order-two .stars.light {
    display: flex;
}
.success-message-soc,
.error-message-soc {
    display: none;
}
.error-message-mobile {
    display: block;
    color: #ff3b30;
    font-size: 14px;
    margin-top: 8px;
}
.success-message-mobile {
    display: block;
    color: #24ff6f;
    font-size: 14px;
    margin-top: 8px;
}
body.light .section-order-one .info {
    color: var(--Text-Primary, #131313);
}
body.light .company-name {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light .section-main .checkbox a {
    color: var(--Text-Tetriary, rgba(19, 19, 19, 0.4));
}
body.light .support-chat,
body.light .vk-support {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
.registration-info {
    color: gray;
    font-size: 16px;
}
.registration-info p {
    margin-bottom: 8px;
}
.address {
    color: gray;
    font-size: 16px;
    max-width: 600px;
    line-height: 1.5;
}
.email {
    color: gray;
    font-size: 16px;
}
.support-links {
    margin-top: 20px;
    display: flex;
    gap: 8px;
    align-items: center;
    font-size: 16px;
}
.support-links a {
    color: #fff;
    text-decoration: underline;
    transition: opacity 0.2s;
}
.support-links a:hover {
    opacity: 0.8;
}
.support-links span {
    color: gray;
}
@media (max-width: 768px) {
    .section-contacts {
        padding: 20px 0;
    }
    h1 {
        font-size: 32px;
    }
    .service-mode {
        font-size: 16px;
        margin-bottom: 30px;
    }
    .support-links {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }
    .support-links span {
        display: none;
    }
}
html {
    scroll-behavior: smooth;
}
@media (max-width: 991px) {
    .error-block {
        margin: 10px 0;
        position: relative;
        z-index: 1;
    }
}
.return-class {
    text-decoration: underline;
    color: #959595;
    transition: 0.5s;
}
body.light .skeleton-animation:after {
    background: linear-gradient(90deg, transparent 0, rgba(0, 190, 58, 0.08) 20%, rgba(0, 190, 58, 0.12) 60%, transparent);
}
body.light {
    background: #fbfbfb;
}
body.light .header .logo a {
    background: url(../img/logo-light.svg) no-repeat;
}
body.light .header .item {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light .header .item span {
    color: var(--Text-Primary, #131313);
}
body.light .header .menu a {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light .header .enter {
    border-radius: 6px;
    border: 1px solid var(--Border-Accent-Secondary, rgba(0, 190, 58, 0.24));
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12));
    color: var(--Text-Accent, #0db740);
}
body.light .header .enter:before {
    background: url(../img/header-enter-black.svg) no-repeat;
}
body.light .header .setting {
    background: url(../img/setting-black.svg) no-repeat;
}
body.light .header .tl {
    background: url(../img/tl-black.svg) no-repeat;
}
body.light .header .vk {
    background: url(../img/vk-black.svg) no-repeat;
}
body.light .section-main .title {
    color: var(--Text-Primary, #131313);
}
body.light .section-main .description h3,
body.light .section-main .description h2 {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light .section-main .fire {
    border-radius: 16px;
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12));
    color: var(--Text-Accent, #0db740);
}
body.light .section-main .fire:before {
    background: url(../img/fire-black.svg) no-repeat;
}
body.light .section-main .fire .question {
    background: url(../img/fire-question-black.svg) no-repeat;
}
body.light .section-message.succes .message-name {
    color: var(--Text-Accent, #0db740);
}
body.light .section-message,
body.light .select-name {
    color: var(--Text-Primary, #131313);
}
body.light .select-games span {
    border-radius: 8px;
    border: 1px solid var(--Border-Primary-Default, rgba(19, 19, 19, 0.06));
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
}
body.light .select-games .show {
    border-radius: 8px;
    border: 1px solid var(--Border-Primary-Default, rgba(19, 19, 19, 0.06));
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
    color: var(--Text-Accent, #0db740);
}
body.light .section-main {
    background: url(../img/section-main-bg-black.png) no-repeat center bottom;
}
body.light .section-main .container .tabs__content {
    background: var(--White-600, #fff);
}
body.light .section-main .container .tabs__caption li.active {
    background: var(--White-600, #fff) !important;
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72)) !important;
}
body.light .section-main .container .tabs__caption li {
    background: none;
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light .section-main .label label {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light .section-main .label .input {
    border-radius: 8px;
    border: 1px solid var(--Border-Primary-Default, rgba(19, 19, 19, 0.06));
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
    transition: 0.5s;
}
body.light .section-main .label input {
    color: var(--Text-Tetriary, rgba(19, 19, 19, 0.4));
}
body.light .section-main .label .input:hover {
    background: var(--Surface-Prymary-Hover, rgba(19, 19, 19, 0.08));
}
body.light .section-main .label .input:focus-within {
    border: 1px solid var(--Border-Accent, #0db740);
}
body.light .section-main .label .where {
    border-radius: 6px;
    border: 1px solid var(--Border-Primary-Default, rgba(19, 19, 19, 0.06));
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
    color: var(--Text-Primary, #131313);
}
body.light .section-main .label ::placeholder {
    color: var(--Text-Tetriary, rgba(19, 19, 19, 0.4));
}
body.light .speed-enter span {
    border-radius: 6px;
    border: 1px solid var(--Border-Primary-Default, rgba(19, 19, 19, 0.06));
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
    color: var(--Text-Primary, #131313);
}
body.light .section-main .flex-discount {
    border-radius: 8px;
    border: 1px solid var(--Border-Primary-Default, rgba(19, 19, 19, 0.06));
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
}
body.light .section-main .flex-discount .col-discount {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light .section-main .flex-discount .col-discount.active {
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12));
}
body.light .section-main .flex-discount .line,
.section-main .flex-discount .line:before {
    background: #bfbfbf;
}
body.light .section-main .flex-discount .col-discount.active {
    color: var(--Text-Accent, #0db740);
}
body.light .section-main .flex-discount .line span,
body.light .section-main .flex-discount .col-discount.step .line:before {
    background: var(--Green-400, rgba(0, 190, 58, 0.65));
}
body.light .section-main .checkbox span {
    color: var(--Text-Tetriary, rgba(19, 19, 19, 0.4));
}
body.light .section-main .checkbox span:before {
    background: url(../img/checkbox-black.svg) no-repeat;
}
body.light .section-main .checkbox input:checked + span:before {
    background: url(../img/checkbox-active-black.svg) no-repeat;
}
body.light .section-main .checkbox span:hover {
    color: var(--Text-Tetriary, rgba(19, 19, 19, 0.4));
}
body.light .section-profile-two .items-connect .btn,
body.light .section-profile-three .promo-form button {
    border: 1px solid var(--Border-Accent-Secondary, rgba(0, 190, 58, 0.24));
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12));
    color: var(--Text-Accent, #0db740);
}
body.light .section-main .order {
    border-radius: 8px;
    background: var(--Button-Accent, #0db740);
    color: var(--Text-Primary-Inverse, #fff);
}
body.light .section-main .pay-name {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light .section-main .select-pay .block {
    border-radius: 8px;
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
}
body.light .section-main .select-pay input:checked + .block {
    border-radius: 8px;
    border: 1px solid var(--Border-Accent-Secondary, rgba(0, 190, 58, 0.24));
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12));
}
body.light .section-main .select-pay input:checked + .block:before {
    background: url(../img/succes-black.svg) no-repeat;
}
body.light .section-main .info-total .name {
    background: #fff;
    color: var(--Text-Tetriary, rgba(19, 19, 19, 0.4));
}
body.light .section-main .info-total .line:before {
    border-bottom: 1px rgba(19, 19, 19, 0.08) dashed;
}
body.light .section-main .info-total .sum {
    background: #fff;
    color: var(--Text-Primary, #131313);
}
body.light .section-main .info-total .sum.sale {
    color: var(--Text-Accent, #0db740);
}
body.light .section-main .enter-buy {
    border-radius: 8px;
    border: 1px solid var(--Border-Gold, rgba(192, 142, 12, 0.28));
    background: var(--Button-Secondary, rgba(192, 142, 12, 0.12));
    color: var(--Text-Gold, #c08e0c);
}
body.light .section-main .sidebar .tabs {
    background: var(--White-600, #fff);
}
body.light .section-main .sidebar .tabs .tabs__caption li.active {
    background: var(--White-600, #fff);
    color: var(--Text-Primary, #131313);
}
body.light .section-main .sidebar .tabs .tabs__caption {
    background: var(--Surface-Prymary-Hover, rgba(19, 19, 19, 0.08));
}
body.light .section-main .sidebar .tabs .tabs__caption li {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light .section-main .sidebar .name,
body.light .section-main .sidebar ol li {
    color: var(--Text-Primary, #131313);
}
body.light .section-main .sidebar ol li:before {
    color: var(--Text-Accent, #0db740);
}
body.light .section-main .sidebar ol a {
    border-radius: 6px;
    border: 1px solid var(--Border-Primary-Default, rgba(19, 19, 19, 0.06));
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
    color: var(--Text-Primary, #131313);
}
body.light .section-history .services-block .info-flex .last {
    color: #f9af11;
}
body.light .header .login-panel .menulogin a:hover {
    background: var(--Surface-Prymary-Hover, rgba(19, 19, 19, 0.08));
}
.header .login-panel .menulogin img.active {
    filter: brightness(0) saturate(100%) invert(100%) sepia(98%) saturate(6728%) hue-rotate(62deg) brightness(99%) contrast(106%);
}
body.light .header .login-panel .menulogin img.active {
    filter: invert(50%) sepia(24%) saturate(4800%) hue-rotate(106deg) brightness(98%) contrast(101%);
}
body.light .sidebar ul li svg {
    filter: brightness(0.4) sepia(100%) hue-rotate(120deg) saturate(500%);
    transition: filter 0.2s ease;
}
body.light .sidebar ul li.active svg,
body.light .sidebar ul li router-link.active + svg {
    filter: invert(50%) sepia(24%) saturate(4800%) hue-rotate(106deg) brightness(98%) contrast(101%);
}
body.light .section-history .links-tabs li.active a {
    border-radius: 8px;
    border: 1px solid var(--Button-Accent-Hover, #00be3a);
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12));
    color: var(--Text-Accent, #0db740);
}
body.light .section-history .links-tabs a:hover {
    border: 1px solid var(--Button-Accent-Hover, #00be3a);
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12));
    color: var(--Text-Accent, #0db740);
}
.icon-support {
    content: url(../img/advantages-icon4.svg);
}
body.light .icon-support {
    content: url(../img/advantages-icon4-light.svg);
}
.icon-happy {
    content: url(../img/advantages-icon3.svg);
}
body.light .icon-happy {
    content: url(../img/advantages-icon3-light.svg);
}
.icon-commission {
    content: url(../img/comision.svg);
}
body.light .icon-commission {
    content: url(../img/advantages-icon2-light.svg);
}
.icon-fast {
    content: url(../img/advantages-icon1.svg);
}
body.light .icon-fast {
    content: url(../img/advantages-icon1-light.svg);
}
body.light .theme-icon {
    content: url(../img/stm-coin-orange.svg);
}
.arrow-img-accept {
    content: url(../img/arrow.svg);
}
body.light .arrow-img-accept {
    content: url(../img/arrow-light.svg);
}
.copy-img {
    content: url(../img/copy.svg);
}
body.light .copy-img {
    content: url(../img/copy-img-light.svg);
}
.support-img {
    content: url(../img/support.svg);
}
body.light .support-img {
    content: url(../img/support-light.svg);
}
.arrow-img {
    content: url(../img/open-arrow.svg);
}
body.light .arrow-img {
    content: url(../img/open-arrow-light.svg);
}
.refresh-img {
    content: url(../img/refresh.svg);
}
body.light .refresh-img {
    content: url(../img/refresh-light.svg);
}
body.light .item-question .question-name:after {
    background: url(../img/question-arrow-black.svg) no-repeat;
}
body.light .item-question:hover .question-name:after {
    background: url(../img/question-arrow-hover-black.svg) no-repeat;
}
body.light .item-question.active .question-name:after {
    background: url(../img/question-arrow-hover-black.svg) no-repeat;
    transform: rotate(180deg);
}
body.light .title-section {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light .title-section h2 {
    color: var(--Text-Primary, #131313);
}
body.light .section-advantages .item {
    background: var(--White-600, #fff);
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light .section-advantages .name {
    color: var(--Text-Primary, #131313);
}
body.light .section-advantages a {
    color: var(--Text-Accent, #0db740);
}
body.light .section-advantages .btn {
    border-radius: 8px;
    border: 1px solid var(--Surface-Accent, #0db740);
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12));
    color: var(--Text-Accent, #0db740);
}
body.light .section-3 .col-left {
    background: var(--White-600, #fff);
}
body.light .section-3 .name {
    color: var(--Text-Primary, #131313);
}
body.light .section-3 .desc {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light .section-3 .col-right {
    background: var(--White-600, #fff);
}
body.light .section-3 .col-right ol li {
    color: var(--Text-Primary, #131313);
}
body.light .section-3 .col-right ol li:before {
    color: var(--Text-Accent, #0db740);
}
body.light .section-3 .col-right ol a {
    border-radius: 6px;
    border: 1px solid var(--Border-Primary-Default, rgba(19, 19, 19, 0.06));
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
    color: var(--Text-Primary, #131313);
}
body.light .section-4 .item {
    border-radius: 16px;
    border: 1px solid var(--Border-Primary-Default, rgba(19, 19, 19, 0.06));
    background: var(--White-600, #fff);
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light .section-4 .name {
    color: var(--Text-Primary, #131313);
}
body.light .section-4 .all {
    border-radius: 8px;
    border: 1px solid var(--Surface-Accent, #0db740);
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12));
    color: var(--Text-Accent, #0db740);
}
body.light .section-4 .order {
    border-radius: 8px;
    background: var(--Button-Accent, #0db740);
    color: var(--Text-Primary-Inverse, #fff);
}
body.light .footer {
    border-top: 1px solid var(--Border-Primary-Default, rgba(19, 19, 19, 0.06));
}
body.light .footer a {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light .footer .tl {
    background: url(../img/tl-black.svg) no-repeat;
}
body.light .footer .vk {
    background: url(../img/vk-black.svg) no-repeat;
}
body.light #top {
    background: url(../img/top-black.svg) no-repeat;
}
.header .menu .dark {
    display: none;
}
.section-main .question .text {
    position: absolute;
    bottom: calc(100% + 0px);
    left: 0;
    z-index: 9;
    padding: 12px;
    border-radius: 8px;
    background: var(--Text-Primary-Inverse, #131313);
    color: var(--Text-Primary, #edeeee);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    width: 266px;
    display: none;
    transition: 0.5s;
}
.align_right {
    left: auto !important;
    right: 0;
}
.section-main .question:hover > .text {
    display: block;
}
.noicon .question {
    display: none;
}
#selectgames-popup .block {
    max-width: 874px;
    padding: 40px 32px;
    max-height: 100vh;
}
#selectgames-popup .search {
    padding: 8px 6px 8px 16px;
    border-radius: 8px;
    border: 1px solid var(--Border-Primary-Default, rgba(237, 238, 238, 0.04));
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
    display: flex;
    align-items: center;
    gap: 20px;
    margin: 0 0 20px;
}
#selectgames-popup .search input {
    flex: 1;
    width: 100%;
    border: 0px;
    background: none;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    color: #fff;
}
#selectgames-popup .search button {
    cursor: pointer;
    width: 24px;
    height: 24px;
    background: url(../img/popup-search.svg) no-repeat;
}
#selectgames-popup .btn {
    display: block;
    text-decoration: none;
    cursor: pointer;
    border-radius: 8px;
    border: 1px solid var(--Surface-Accent, #24ff6f);
    background: var(--Surface-Accent-Hover, rgba(36, 255, 111, 0.04));
    padding: 16px;
    text-align: center;
    color: var(--Text-Accent, #24ff6f);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
    transition: 0.5s;
    width: 100%;
}
#selectgames-popup .btn:hover {
    background: #24ff6f;
    color: #131313;
}
#selectgames-popup .name-razdel {
    padding: 0 16px 12px;
    color: var(--Text-Primary, #edeeee);
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
#selectgames-popup .block-scroll {
    max-height: 608px;
    overflow-y: auto;
    margin: 0 0 20px;
    padding: 0 32px 0 0;
}
#selectgames-popup .select-razdel {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 20px;
}
#selectgames-popup .select-razdel input {
    display: none;
}
#selectgames-popup .select-razdel label {
    display: block;
    width: calc(25% - 6px);
}
#selectgames-popup .select-razdel .radio {
    border-radius: 8px;
    border: 1px solid var(--Border-Primary-Default, rgba(237, 238, 238, 0.04));
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
    cursor: pointer;
    filter: grayscale(100%);
    transition: 0.5s;
    height: 100%;
    position: relative;
}
#selectgames-popup .select-razdel label:hover .radio {
    border-radius: 8px;
    border: 1px solid var(--Border-Primary-Default, rgba(237, 238, 238, 0.04));
    background: var(--Surface-Prymary-Hover, rgba(237, 238, 238, 0.08));
}
#selectgames-popup .select-razdel input:checked + .radio {
    border-radius: 8px;
    border: 1px solid var(--Border-Accent-Secondary, rgba(36, 255, 111, 0.24));
    background: var(--Surface-Accent-Hover, rgba(36, 255, 111, 0.04));
    filter: grayscale(0%);
}
#selectgames-popup .select-razdel input:checked + .radio:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1;
    width: 28px;
    height: 29px;
    background: url(../img/succes.svg) no-repeat;
}
#selectgames-popup .select-razdel .images {
    font-size: 0px;
    line-height: 0px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-bottom: 1px solid var(--Border-Primary-Default, rgba(237, 238, 238, 0.04));
    padding: 19px 23px 20px 24px;
    height: 90px;
}
#selectgames-popup .select-razdel .name {
    margin: 0;
    padding: 6px 16px;
    overflow: hidden;
    color: var(--Text-Primary, #edeeee);
    text-align: center;
    text-overflow: ellipsis;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
}
#selectgames-popup ::-webkit-scrollbar {
    width: 4px;
}
#selectgames-popup ::-webkit-scrollbar-track {
    width: 4px;
    border-radius: 2px;
    background: var(--Text-Primary-Inverse, #131313);
}
#selectgames-popup ::-webkit-scrollbar-thumb {
    border-radius: 14px;
    background: var(--Surface-Accent, #24ff6f);
    width: 8px;
}
.section-5 .item {
    display: block;
    text-decoration: none;
}
body.light .section-main .question .icon {
    background: url(../img/question-black.svg) no-repeat;
}
body.light .select-other-pay .block {
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
}
body.light .select-other-pay .other-name {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light .select-other-pay .price {
    color: var(--Text-Primary, #131313);
}
body.light .section-main .question .text {
    background: var(--Text-Primary-Inverse, #fff);
    color: var(--Text-Primary, #131313);
}
body.light .select-other-pay .price span:first-child {
    border-radius: 7px;
    border: 1px solid var(--Border-Accent-Secondary, rgba(0, 190, 58, 0.24));
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12));
    color: var(--Text-Accent, #0db740);
}
body.light .select-other-pay input:checked + .block {
    border-radius: 8px;
    border: 1px solid var(--Border-Accent-Secondary, rgba(0, 190, 58, 0.24));
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12));
}
body.light .select-other-pay input:checked + .block .price span:first-child {
    background: var(--Surface-Accent, #0db740);
    color: var(--Text-Primary-Inverse, #fff);
}
body.light .section-main .select-pay .block img:nth-child(1) {
    display: none;
}
body.light .section-main .select-pay .block img:nth-child(2) {
    display: block;
}
body.light .select-games span:hover {
    background: var(--Surface-Prymary-Hover, rgba(19, 19, 19, 0.08));
}
.select-turkiye {
    display: flex;
    border-radius: 10px;
    background: var(--Surface-BG, #131313);
    margin: 0 0 24px;
    gap: 2px;
    padding: 2px;
}
.select-turkiye input {
    display: none;
}
.select-turkiye label {
    display: block;
    flex: 1;
}
.select-turkiye .turkiye-item {
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    gap: 8px;
    color: var(--Text-Secondary, rgba(237, 238, 238, 0.48));
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    padding: 8px;
    border-radius: 8px;
}
.select-turkiye input:checked + .turkiye-item {
    color: var(--Text-Primary, #edeeee);
    background: linear-gradient(0deg, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 0%, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 100%), var(--Surface-BG, #131313);
}
body.light .select-turkiye {
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
}
body.light .select-turkiye .turkiye-item {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light .select-turkiye input:checked + .turkiye-item {
    color: var(--Text-Primary, #131313);
    background: var(--White-600, #fff);
}
body.light .popup-block .block {
    background: var(--White-600, #fff);
}
body.light .popup-block .title {
    color: var(--Text-Primary, #131313);
}
body.light .popup-block .desc {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light #login-popup ul {
    color: var(--Text-Accent, #0db740);
}
body.light #login-popup .vk,
body.light #ordersucces-popup .vk {
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
    color: var(--Text-Primary, #131313);
}
body.light .popup-block .close {
    background: url(../img/popup-close-back.svg) no-repeat;
}
body.light #login-popup .tl,
body.light #ordersucces-popup .tl,
body.light #login-popup .vk-login,
body.light #ordersucces-popup .vk-login,
body.light #login-popup .tg,
body.light #ordersucces-popup .tg {
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
    color: var(--Text-Primary, #131313);
}
body.light #login-popup .vk-login:before,
body.light #ordersucces-popup .vk-login:before {
    background: url(../img/popup-login-vk-black.svg) no-repeat;
}
body.light #login-popup .tg:before,
body.light #ordersucces-popup .tg:before {
    background: url(../img/popup-login-tl-black.svg) no-repeat;
}
body.light #promo-popup .vk-login,
body.light #succes-popup .vk-login {
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
    color: var(--Text-Primary, #131313);
}
body.light #promo-popup .vk-login:after,
body.light #succes-popup .vk-login:after {
    background: url(../img/popup-promo-link-black.svg) no-repeat;
}
body.light #login-popup .tg:hover:before,
body.light #ordersucces-popup .tg:hover:before {
    background: url(../img/tl-hover.svg) no-repeat;
}
body.light #login-popup .vk-login:hover:before {
    background: url(../img/vk-hover.svg) no-repeat;
}
body.light #login-popup .vk:before,
body.light #ordersucces-popup .vk:before {
    background: url(../img/popup-login-vk-black.svg) no-repeat;
}
body.light #login-popup .tl:before,
body.light #ordersucces-popup .tl:before {
    background: url(../img/popup-login-tl-black.svg) no-repeat;
}
body.light #promo-popup .vk,
body.light #succes-popup .vk {
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
    color: var(--Text-Primary, #131313);
}
body.light #promo-popup .vk:after,
body.light #succes-popup .vk:after {
    background: url(../img/popup-promo-link-black.svg) no-repeat;
}
body.light .popup-block .name {
    color: var(--Text-Accent, #0db740);
}
body.light .code-pay {
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12));
}
body.light .code-pay .code-name {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light .code-pay .copy {
    border-radius: 6px;
    border: 1px solid var(--Border-Primary-Default, rgba(19, 19, 19, 0.06));
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
    color: var(--Text-Primary, #131313);
}
body.light .code-pay .code-input {
    color: var(--Text-Primary, #131313);
}
body.light .popup-block .block {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light #ordersucces-popup a {
    color: var(--Text-Accent, #0db740);
}
body.light #selectgames-popup .search {
    border-radius: 8px;
    border: 1px solid var(--Border-Primary-Default, rgba(19, 19, 19, 0.06));
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
}
body.light #selectgames-popup .search button {
    background: url(../img/popup-search-black.svg) no-repeat;
}
body.light #selectgames-popup .name-razdel {
    color: var(--Text-Primary, #131313);
}
body.light #selectgames-popup .btn {
    border-radius: 8px;
    border: 1px solid var(--Surface-Accent, #0db740);
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12));
    color: var(--Text-Accent, #0db740);
}
body.light #selectgames-popup .select-razdel .radio {
    border-radius: 8px;
    border: 1px solid var(--Border-Primary-Default, rgba(19, 19, 19, 0.06));
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
}
body.light #selectgames-popup .select-razdel .images {
    border-bottom: 1px solid var(--Border-Primary-Default, rgba(19, 19, 19, 0.06));
}
body.light #selectgames-popup .select-razdel .name {
    color: var(--Text-Primary, #131313);
}
body.light #selectgames-popup ::-webkit-scrollbar-track {
    background: var(--Text-Primary-Inverse, #fff);
}
body.light #selectgames-popup ::-webkit-scrollbar-thumb {
    background: var(--Surface-Accent, #0db740);
}
body.light .section-main .enter-buy:hover {
    border-radius: 8px;
    border: 1px solid var(--Border-Gold, rgba(192, 142, 12, 0.28));
    background: var(--Button-Secondary-Hover, rgba(192, 142, 12, 0.28));
    color: var(--Text-Gold-Hover, #c08e0c);
}
body.light .section-main .order:hover {
    border-radius: 8px;
    background: var(--Button-Accent-Hover, #00be3a);
}
body.light .section-4 .order:hover {
    border-radius: 8px;
    border: 1px solid var(--Surface-Accent, #0db740);
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12));
    color: var(--Text-Accent, #0db740);
}
body.light .section-advantages .btn:hover,
body.light .section-4 .all:hover {
    border-radius: 8px;
    background: var(--Button-Accent-Hover, #00be3a);
    color: var(--Text-Primary-Inverse, #fff);
}
body.light .code-pay .code-flex {
    border-radius: 8px;
    border: 1px solid var(--Border-Primary-Default, rgba(19, 19, 19, 0.06));
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
}
body.light .code-pay .copy:hover,
body.light .section-main .label .where:hover,
body.light .speed-enter span:hover,
body.light .section-main .sidebar ol a:hover {
    background: #131313;
    color: #fff;
}
.section-4 .rating img:last-child {
    display: none;
}
body.light .section-4 .rating img:first-child {
    display: none;
}
body.light .section-4 .rating img:last-child {
    display: block;
}
body.light #promo-popup .vk:hover,
body.light #succes-popup .vk:hover,
body.light #login-popup .vk:hover,
body.light #ordersucces-popup .vk:hover {
    background: var(--Surface-Prymary-Hover, rgba(19, 19, 19, 0.08));
}
body.light #selectgames-popup .btn:hover {
    border-radius: 8px;
    background: var(--Button-Accent-Hover, #00be3a);
    color: #fff;
}
body.light #selectgames-popup .select-razdel .radio:hover {
    border-radius: 8px;
    border: 1px solid var(--Border-Primary-Default, rgba(19, 19, 19, 0.06));
    background: var(--Surface-Prymary-Hover, rgba(19, 19, 19, 0.08));
}
body.light #selectgames-popup .select-razdel input:checked + .radio {
    border-radius: 8px;
    border: 1px solid var(--Border-Accent-Secondary, rgba(0, 190, 58, 0.24));
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12));
}
.section-main .order:focus {
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
    color: var(--Text-Secondary, rgba(237, 238, 238, 0.48));
}
body.light .section-main .order:focus {
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light .header .enter:hover {
    border-radius: 6px;
    background: var(--Button-Accent-Hover, #00be3a);
    color: #fff;
}
body.light .header .enter:hover:before {
    background: url(../img/header-enter-hover-black.svg) no-repeat;
}
body.light .header .setting:hover {
    background: url(../img/setting-black-hover.svg) no-repeat;
}
body.light .header .menu a:hover {
    color: var(--Text-Primary, #131313);
}
body.light .header .login-panel .panel-block {
    border-radius: 8px;
    border: 1px solid var(--Border-Primary-Default, rgba(237, 238, 238, 0.04));
    background: var(--White-500, #f7f7f7);
    box-shadow: 0 15px 30px #0000004d;
}
body.light .header .login-panel .panel-block .name {
    color: var(--Text-Primary, #131313);
}
body.light .header .login-panel .panel-block .id {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light .header .login-panel .panel-block .panel-balance {
    border-radius: 8px;
    border: 1px solid var(--Border-Primary-Default, rgba(19, 19, 19, 0.06));
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
}
body.light .header .login-panel .menulogin .active a {
    border-radius: 4px;
    border: 1px solid var(--Green-200, rgba(0, 190, 58, 0.3));
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12));
    color: var(--Green-600, #00be3a);
}
body.light .header .login-panel .menulogin a,
body.light .header .login-panel .menulogin img {
    color: var(--Black-500, #131313);
}
body.light .header .login-panel .menulogin img {
    filter: invert(0%) sepia(0%) saturate(0%) hue-rotate(93deg) brightness(10%) contrast(102%);
    transition: filter 0.2s ease;
}
body.light .section-profile .section-profile-one .user {
    color: var(--Text-Primary, #131313);
}
body.light .section-profile .section-profile-one .id {
    color: var(--Text-Accent, #0db740);
}
body.light .section-profile .section-profile-one .btn {
    border-radius: 6px;
    border: 1px solid var(--Border-Accent-Secondary, rgba(0, 190, 58, 0.24));
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12));
    color: var(--Text-Accent, #0db740);
}
body.light .section-profile .item-block {
    border-radius: 16px;
    border: 1px solid var(--Border-Primary-Default, rgba(237, 238, 238, 0.04));
    background: var(--White-600, #fff);
}
body.light .section-profile .section-profile-one .id input {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light .section-profile .section-profile-one .copy {
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12));
}
body.light .section-profile .item-block .title,
body.light .section-profile .section-profile-one .summ {
    color: var(--Text-Primary, #131313);
}
body.light .section-profile .question .icon {
    background: url(../img/question-black.svg) no-repeat !important;
}
body.light .section-profile-two .items-connect .connect.succes {
    border: 1px solid var(--Border-Primary-Default, rgba(19, 19, 19, 0.06));
}
body.light .section-profile-two .items-connect .connect {
    border-radius: 8px;
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
}
body.light .section-profile-two .items-connect .name {
    color: var(--Text-Primary, #131313);
}
body.light .section-profile-three .desc {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light .section-profile-three .promo-form .input {
    border: 1px solid var(--Border-Primary-Default, rgba(19, 19, 19, 0.06));
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
}
body.light .section-profile-three .promo-form input {
    color: #111;
}
body.light .section-lk .sidebar .active a {
    border-radius: 4px;
    border: 1px solid var(--Green-200, rgba(0, 190, 58, 0.3));
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12));
    color: var(--Green-600, #00be3a);
}
body.light .section-lk .sidebar a {
    color: var(--Black-500, #131313);
}
body.light .section-lk .sidebar svg {
    filter: invert(0%) sepia(0%) saturate(0%) hue-rotate(93deg) brightness(10%) contrast(102%);
    transition: filter 0.2s ease;
}
body.light .header .login-panel {
    border-radius: 4px;
    border: 1px solid var(--Border-Accent-Secondary, rgba(0, 190, 58, 0.24));
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12));
}
body.light .header .login-panel .balance {
    color: var(--Black-500, #131313);
}
body.light .section-lk .title-section {
    color: var(--Text-Primary, #131313);
}
body.light .section-referals-two {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light .section-referals-two .title {
    color: var(--Text-Primary, #131313);
}
body.light .section-referals-three .desc span,
body.light .section-order-one .info-block .title,
body.light .section-order-three .desc span,
body.light .section-referals-six .total {
    color: #f9af11;
}
body.light .section-referals-three.bg2 .title {
    color: var(--Text-Primary, #131313);
}
body.light .section-referals-three.bg2 {
    background: url(../img/section-referals-three-bg2-light.jpg) no-repeat 0 center;
}
body.light .section-referals-three.bg2 .desc {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light .section-referals-three.bg2 {
    background: url(../img/section-referals-three-bg2-light.webp) no-repeat 0 center;
}
body.light .section-referals-four {
    border-radius: 16px;
    border: 1px solid var(--Border-Primary-Default, rgba(237, 238, 238, 0.04));
    background: var(--White-600, #fff);
}
body.light .section-referals-four .flex .item:first-child .number {
    color: var(--Text-Primary, #131313);
}
body.light .section-referals-four .flex .item {
    border-radius: 8px;
    background: #ffd70333;
    color: var(--Text-Primary, #131313);
}
body.light .section-referals-four .title {
    color: var(--Text-Primary, #131313);
}
body.light .section-referals-four .desc {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light .section-referals-four .table {
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
    color: var(--Text-Primary, #131313);
}
body.light .section-referals-four .table label {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light .section-referals-four .table .td:first-child .text {
    color: var(--Text-Primary, #131313);
}
body.light .section-referals-five {
    background: var(--White-600, #fff);
}
body.light .section-referals-five .title {
    color: var(--Text-Primary, #131313);
}
body.light .item-question {
    border-bottom: 1px solid var(--Border-Primary-Default, rgba(19, 19, 19, 0.06));
}
body.light .item-question .question-name {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light .item-question:hover {
    border-radius: 8px;
    background: var(--Surface-Prymary-Hover, rgba(19, 19, 19, 0.08));
    color: var(--Text-Primary, #131313);
}
body.light .item-question:hover .question-name {
    color: var(--Text-Primary, #131313);
}
body.light .item-question .question-name:after {
    background: url(../img/question-arrow-black.svg) no-repeat;
}
body.light .item-question:hover .question-name:after {
    background: url(../img/question-arrow-hover-black.svg) no-repeat;
}
body.light .item-question.active .question-name:after {
    background: url(../img/question-arrow-hover-black.svg) no-repeat;
    transform: rotate(180deg);
}
body.light .section-promo-three {
    background: url(../img/sectionpromothreelight_4x.webp) no-repeat 0 center;
    background-size: cover !important;
    overflow: hidden;
}
body.light .item-question .answer {
    color: var(--Text-Primary, #131313);
}
body.light .section-history .services-block .info-flex .name {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light .section-history {
    border-radius: 16px;
    border: 1px solid var(--Border-Primary-Default, rgba(237, 238, 238, 0.04));
    background: var(--White-600, #fff);
}
body.light .section-history .head .title {
    color: var(--Text-Primary, #131313);
}
body.light .section-history .head ul li.active {
    background: var(--White-600, #fff);
    color: var(--Text-Primary, #131313);
}
body.light .section-history .head ul {
    background: var(--Surface-Prymary-Hover, rgba(19, 19, 19, 0.08));
}
body.light .section-history .date-input {
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
}
body.light .section-history .date-input input {
    color: var(--Text-Primary, #131313);
}
body.light .section-history .services-block {
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
}
body.light .section-history .services-block .head-title .title {
    color: var(--Text-Primary, #131313);
}
.section-history .services-block .head-title svg,
.section-history .services-block .head-title img {
    width: 32px;
    height: 32px;
}
body.light .section-history .services-block .date {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light .section-history .services-block .id input,
body.light .section-history .services-block .info-flex .info {
    color: var(--Text-Primary, #131313);
}
body.light .section-history .services-block .succes {
    border-radius: 8px;
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12)) !important;
    color: #0db740 !important;
    border: 1px solid var(--Surface-Accent, #0db740);
}
body.light .section-history .services-block .pay {
    background: var(--Button-Accent, #0db740);
    color: #fff;
    font-weight: 400;
}
body.light .section-history .head ul li {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light .section-history .services-block .head-title .title path {
    fill: #131313;
    fill-opacity: 0.7;
}
body.light .section-promo-three ul li,
body.light .section-promo-three .title {
    color: var(--Text-Primary, #131313);
}
body.light .section-promo-three .btn {
    background: var(--Button-Accent, #0db740);
    color: var(--Text-Primary-Inverse, #fff);
}
body.light .section-promo-one .title {
    color: var(--Text-Primary, #131313);
}
body.light .section-promo-one a {
    color: var(--Text-Accent, #0db740);
}
body.light .section-promo-one,
body.light .section-promo-two {
    border: 1px solid var(--Border-Primary-Default, rgba(19, 19, 19, 0.06));
    background: var(--White-600, #fff);
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light .section-promo-two .tabs__caption {
    background: var(--Surface-Prymary-Hover, rgba(19, 19, 19, 0.08));
}
body.light .section-promo-two .tabs__caption .active {
    background: var(--White-600, #fff);
    color: var(--Text-Primary, #131313);
}
body.light .section-promo-two .tabs__caption li,
body.light .section-promo-two .tabs__content {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light .section-promo-two .name {
    color: var(--Text-Primary, #131313);
}
body.light .section-promo-two .tabs__content {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light .section-referals-four .flex .number,
body.light .section-promo-two .item .col,
body.light .section-promo-two .item .price {
    color: #f9af11;
}
body.light .header .login-panel .panel-block .panel-balance .price {
    color: var(--Text-Primary, #131313);
}
body.light .section-promo-two .item {
    border-radius: 8px;
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
}
body.light .section-promo-two .item.minus .col,
body.light .section-promo-two .item.minus .price {
    color: #ff1414;
}
body.light .section-referals-three.bg2 .label label {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light .section-referals-three.bg2 .label .input {
    border-radius: 8px;
    border: 1px solid var(--Border-Primary-Default, rgba(19, 19, 19, 0.06));
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
}
body.light .section-referals-three.bg2 .label input {
    color: var(--Text-Primary, #131313);
}
body.light .section-referals-three.bg2 .label .copy {
    border: 1px solid var(--Border-Primary-Default, rgba(19, 19, 19, 0.06));
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
    color: var(--Text-Primary, #131313);
}
body.light .topline.lk a {
    background: #0db740;
    color: #fff;
}
.topline.lk a:hover,
.topline .tg:hover {
    opacity: 0.8;
}
body.light .select-other-pay input:checked + .block:before {
    background: url(../img/succes-black.svg) no-repeat;
}
body.light .section-main .select-pay .discount {
    background: var(--Green-500, #0db740);
    color: var(--Text-Primary-Inverse, #fff);
}
#paysbp-popup .block {
    max-width: 727px;
}
#paysbp-popup .flex {
    display: flex;
    align-items: center;
    gap: 32px;
}
#paysbp-popup .col-left {
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: #ffffff0f;
    width: 282px;
    padding: 16px;
}
#paysbp-popup .col-right {
    flex: 1;
}
#paysbp-popup .qr {
    font-size: 0px;
    line-height: 0px;
    margin: 0 0 16px;
}
#paysbp-popup .problem {
    cursor: pointer;
    text-align: center;
    color: var(--Text-Secondary, rgba(237, 238, 238, 0.48));
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    transition: 0.5s;
}
#paysbp-popup .text {
    color: var(--Text-Secondary, rgba(237, 238, 238, 0.48));
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    margin: 0 0 20px;
}
#paysbp-popup .pay {
    border-radius: 8px;
    border: 1px solid var(--Surface-Accent, #24ff6f);
    background: var(--Surface-Accent-Hover, rgba(36, 255, 111, 0.04));
    padding: 16px;
    text-decoration: none;
    display: block;
    cursor: pointer;
    color: var(--Text-Accent, #24ff6f);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
    text-align: center;
}
#paysbp-popup .pay:hover {
    background: var(--Button-Accent-Hover, #01db4b);
    color: var(--Text-Primary-Inverse, #131313);
}
#paysbp-popup .replenishment {
    margin: 0 0 20px;
    display: flex;
    border-radius: 8px;
    background: #333;
    padding: 16px;
    gap: 12px;
}
#paysbp-popup .icon {
    font-size: 0px;
    line-height: 0px;
    width: 60px;
}
#paysbp-popup .info {
    flex: 1;
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    gap: 6px;
}
#paysbp-popup .info .name {
    color: var(--Text-Primary, #edeeee);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    margin: 0;
    text-align: left;
}
#paysbp-popup .info .mail {
    color: var(--Text-Accent, #24ff6f);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    text-decoration: none;
}
#paysbp-popup .price {
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--Text-Primary, #edeeee);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
}
#paysbp-popup .price span {
    padding: 4px 8px;
    border-radius: 7px;
    border: 1px solid var(--Border-Accent-Secondary, rgba(36, 255, 111, 0.24));
    background: var(--Surface-Accent-Hover, rgba(36, 255, 111, 0.04));
    color: var(--Text-Accent, #24ff6f);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
}
body.light #paysbp-popup .col-left {
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: #ffffff0f;
}
body.light #paysbp-popup .problem {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light #paysbp-popup .problem:hover {
    color: var(--Text-Primary, #131313);
}
#paysbp-popup .qr img:last-child {
    display: none;
}
body.light #paysbp-popup .qr img:first-child {
    display: none;
}
body.light #paysbp-popup .qr img:last-child {
    display: block;
}
body.light #paysbp-popup .replenishment {
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
}
#paysbp-popup .icon img:last-child {
    display: none;
}
body.light #paysbp-popup .icon img:first-child {
    display: none;
}
body.light #paysbp-popup .icon img:last-child {
    display: block;
}
body.light #paysbp-popup .info .name {
    color: var(--Text-Primary, #131313);
}
body.light #paysbp-popup .info .mail {
    color: var(--Text-Accent, #0db740);
}
body.light #paysbp-popup .price {
    color: var(--Text-Primary, #131313);
}
body.light #paysbp-popup .price span {
    border: 1px solid var(--Border-Accent-Secondary, rgba(0, 190, 58, 0.24));
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12));
    color: var(--Text-Accent, #0db740);
}
body.light #paysbp-popup .text {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
body.light #paysbp-popup .pay {
    border: 1px solid var(--Surface-Accent, #0db740);
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12));
    color: var(--Text-Accent, #0db740);
}
body.light #paysbp-popup .pay:hover {
    background: var(--Button-Accent-Hover, #00be3a);
    color: var(--Text-Primary-Inverse, #fff);
}
#paysbp-popup .problem:hover {
    color: var(--Text-Primary, #fff);
}
body.light #selectgames-popup .select-razdel input:checked + .radio:before {
    background: url(../img/succes-black.svg) no-repeat;
}
body.light #login-popup .vk:hover:before {
    background: url(../img/vk-hover.svg) no-repeat;
}
body.light #ordersucces-popup .vk:hover:before {
    background: url(../img/vk-hover.svg) no-repeat;
}
body.light #login-popup .tl:hover:before,
body.light #ordersucces-popup .tl:hover:before {
    background: url(../img/tl-hover.svg) no-repeat;
}
.footer .pay.black,
body.light .footer .pay {
    display: none;
}
body.light .footer .pay.black {
    display: flex;
}
body.light .section-main .error-info a {
    color: var(--Text-Accent, #0db740);
}
.section-main .flex-discount .line span {
    display: none;
}
.section-main .flex-discount {
    position: relative;
}
.section-main .flex-discount .line-green {
    position: absolute;
    top: 50%;
    left: 0;
    height: 2px;
    background: #24ff6f;
    z-index: 3;
    margin: -1px 0 0;
}
body.light .section-main .flex-discount .line-green {
    background: var(--Green-400, rgba(0, 190, 58, 0.65));
}
body.light .section-main .flex-discount .col-discount:hover {
    background: var(--Surface-Prymary-Hover, rgba(19, 19, 19, 0.08));
}
body.light .section-main .flex-discount .col-discount.active .line:before {
    background: var(--Green-400, rgba(0, 190, 58, 0.65));
}
@media screen and (max-width: 1240px) {
    .header .info {
        gap: 10px;
    }
}
@media screen and (max-width: 1200px) {
    .header .info {
        display: none;
    }
    .section-main .site-width {
        gap: 20px;
    }
}
@media screen and (max-width: 1240px) {
    .header .info {
        gap: 10px;
    }
}
@media screen and (max-width: 1000px) {
    .section-lk .container {
        padding: 0;
    }
    .header .enter {
        font-size: 0px;
        line-height: 0px;
        width: 32px;
        height: 32px;
        background: url(../img/mobile-login.svg) no-repeat;
        border: 0px;
        padding: 0;
    }
    .header .enter:before {
        display: none;
    }
    .section-main .site-width {
        flex-direction: column;
    }
    .section-main .sidebar {
        padding: 0;
        width: 100%;
    }
    .section-advantages .flex {
        flex-wrap: wrap;
        align-items: inherit;
    }
    .section-advantages .item {
        flex: none;
        width: calc(50% - 6px);
    }
    .footer .site-width {
        flex-wrap: wrap;
    }
    .section-3 {
        margin: 0 0 100px;
    }
    .section-4 .flex {
        gap: 4px;
        flex-wrap: wrap;
    }
    .section-4 .item {
        flex: none;
        width: calc(50% - 2px);
    }
    .section-4 {
        margin: 0 0 100px;
    }
    .section-lk .flex-main {
        gap: 20px;
    }
    .section-order-three {
        padding: 30px;
    }
}
@media screen and (max-width: 780px) {
    body.light .section-referals-six {
        background: url(../img/referralImagesFourBlackMobile_4x.webp) no-repeat 0 center;
    }
    body.light .section-referals-one {
        background: url(../img/referralImagesLight-mobile_2.webp) no-repeat 0 center;
        overflow: hidden;
    }
    .tab-transactions {
        display: none;
    }
    .tab-transactions-mobile {
        display: block;
    }
    .section-referals-one {
        padding: 30px 16px 16px;
    }
    .section-referals-three {
        padding: 36px 16px 20px;
        background: #251a13 url(../img/section-referals-three-bg1-mobile-mobile.svg) no-repeat 0 0;
        background-size: auto !important;
        overflow: hidden;
    }
    body.light .section-referals-three {
        background: #613117 url(../img/section-referals-three-bg1-mobile-mobile.svg) none;
    }
    body.light .section-referals-three.bg2 {
        background: url(../img/section-referals-three-bg2-mobile-light.svg) no-repeat 0 0;
        background-size: cover !important;
    }
    .section-profile-share {
        padding: 30px 27px 110px;
        background: url(../img/section-profile-share-mobile-dark-2.5x.webp) no-repeat center center;
        background-size: cover;
    }
    .section-referals-three .title {
        padding: 0 0 0 129px;
    }
    .section-referals-three .desc {
        margin: 0 0 54px;
        padding: 0 0 0 129px;
    }
    .section-referals-three.bg2 {
        background: url(../img/section-referals-three-bg2-mobile.svg) no-repeat 0 0;
        background-size: cover !important;
    }
    .section-referals-four {
        padding: 20px 16px;
    }
    .section-referals-four .flex {
        text-align: center;
    }
    .section-referals-four .flex .number {
        justify-content: center;
        font-size: 18px;
    }
    .section-referals-four .table {
        flex-direction: column;
        padding: 12px;
        gap: 4px;
    }
    .section-referals-four .table .td {
        display: flex;
        justify-content: space-between;
        position: relative;
    }
    .section-referals-four .table label {
        padding: 0 4px 0 0;
        position: relative;
        z-index: 3;
    }
    .section-referals-four .table .td:first-child .text {
        padding: 0 0 0 4px;
        position: relative;
        z-index: 3;
    }
    .section-referals-four .table .last label {
        display: block;
    }
    .section-referals-four .table .td:before {
        content: "";
        position: absolute;
        bottom: 5px;
        left: 0;
        right: 0;
        z-index: 1;
        height: 1px;
        border-bottom: 1px rgba(237, 238, 238, 0.08) dashed;
    }
    body.light .section-promo-three {
        border: 1px solid var(--Border-Primary-Default, rgba(19, 19, 19, 0.06));
        background: url(../img/section-promo-three-mobile.svg) no-repeat 0 0, #fff;
    }
    body.light .section-profile-share {
        padding: 30px 27px 110px;
        background: url(../img/section-profile-share-mobile.svg) no-repeat center center;
        background-size: cover;
    }
    .header .login-panel .panel-block .photo {
        display: table;
    }
    .header .login-panel .panel-block {
        position: fixed;
        top: 0;
        bottom: 0;
        right: 0;
        max-height: 100vh;
        overflow-y: auto;
        z-index: 999;
        width: 290px;
        padding: 71px 32px 32px;
        border-radius: 0;
    }
    .header .login-panel {
        padding: 0;
        background: none;
        border: 0px;
    }
    .header .login-panel .top {
        display: flex;
        align-items: center;
        gap: 10px;
        justify-content: space-between;
        margin: 0 0 36px;
    }
    .header .login-panel .light {
        display: block;
        text-decoration: none;
        cursor: pointer;
        width: 32px;
        height: 32px;
        background: url(../img/setting.svg) no-repeat;
        background-size: contain !important;
    }
    .header .login-panel .close {
        cursor: pointer;
        width: 32px;
        height: 32px;
        background: url(../img/mobile-close.svg) no-repeat;
    }
    .header .login-panel .open {
        font-size: 0px;
        line-height: 0px;
        width: 32px;
        height: 32px;
        background: url(../img/mobile-login.svg) no-repeat !important;
        border: 0px;
        padding: 0;
    }
    .header .login-panel .open img,
    .header .login-panel .icon,
    .header .login-panel .balance,
    .header .login-panel .refresh,
    .header .login-panel .photo {
        display: none;
    }
    .select-mobile-country .select {
        display: block;
        padding: 8px 6px;
        border-radius: 8px;
        border: 1px solid var(--Border-Primary-Default, rgba(237, 238, 238, 0.04));
        background: url(../img/mobile-select.svg) no-repeat right 6px center, #edeeee0a;
        display: flex;
        align-items: center;
        color: var(--Text-Primary, #edeeee);
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 24px;
        gap: 12px;
    }
    .section-main .container .tabs__content {
        border-radius: 0 0 0 16px;
    }
    .select-name-mobile {
        display: block;
        color: var(--Text-Secondary, rgba(237, 238, 238, 0.48));
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 20px;
        margin: 0 -16px;
        padding: 0 16px 2px;
        background: linear-gradient(0deg, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 0%, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 100%), var(--Surface-BG, #131313);
    }
    .section-referals-one {
        background: url(../img/referralImagesFirstBlack-mobile_1.webp) no-repeat 0 center;
    }
    .select-mobile-games .open {
        display: flex;
        align-items: center;
        border-radius: 8px;
        border: 1px solid var(--Border-Primary-Default, rgba(237, 238, 238, 0.04));
        background: url(../img/mobile-select.svg) no-repeat right 6px center, #edeeee0a;
        padding: 8px 50px 8px 16px;
        color: var(--Text-Primary, #edeeee);
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 24px;
        gap: 12px;
        cursor: pointer;
    }
    .topline.lk a {
        padding: 8px;
        white-space: nowrap;
    }
    .topline .tg {
        gap: 5px;
        padding: 8px;
        white-space: nowrap;
    }
    .topline .exit {
        cursor: pointer;
        width: 20px;
        height: 20px;
        background: url(../img/topline-close.svg) no-repeat;
        flex-shrink: 0;
    }
    .header .menu {
        display: none;
    }
    .header .setting {
        display: none !important;
    }
    .mobile-menu {
        display: block;
        cursor: pointer;
        width: 32px;
        height: 32px;
        background: url(../img/mobile-menu.svg) no-repeat;
        position: relative;
    }
    .mobile-menu.active {
        background: url(../img/mobile-close.svg) no-repeat;
    }
    .header .social {
        flex: 1;
        justify-content: center;
    }
    .header .site-width {
        gap: 12px;
    }
    .header .logo a {
        width: 85px;
        height: 34px;
        background-size: contain !important;
    }
    .header .menu {
        position: fixed;
        top: 0;
        bottom: 0;
        right: 0;
        z-index: 999;
        padding: 139px 32px 32px;
        background: linear-gradient(0deg, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 0%, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 100%), var(--Black-500, #131313);
        width: 100%;
        max-width: 278px;
        flex-direction: column;
        gap: 10px;
        max-height: 100vh;
        overflow-y: auto;
    }
    .section-referals-six {
        background: url(../img/referralImagesFourBlackMobile_4x.webp) no-repeat 0 center;
    }
    .header .menu.active {
        display: flex;
    }
    .header .menu ul {
        gap: 16px;
    }
    .header {
        position: relative;
        padding: 16px 0;
        margin: 0 0 20px;
    }
    .header .menu ul {
        flex-direction: column;
        flex: 1;
    }
    .section-main .title {
        font-size: 22px;
    }
    .section-main .description {
        font-size: 13px;
        margin: 0 0 20px;
    }
    .select-name,
    .select-games {
        display: none;
    }
    .section-main .container .tabs__content.active {
        flex-direction: column;
        gap: 28px;
    }
    .section-main .container .tabs__content {
        border-radius: 16px;
        padding: 16px;
        margin: 0 -16px;
    }
    .section-main .label,
    .section-main .flex-discount {
        margin: 0 0 16px;
    }
    .section-main .flex-label {
        flex-direction: column;
        gap: 0px;
    }
    .section-main .tab-right {
        width: 100%;
    }
    .section-main .fire {
        margin: 20px 0;
    }
    .mobile-bottom {
        display: block;
    }
    .section-main .checkbox,
    .section-main .order {
        display: none;
    }
    .section-main .mobile-bottom .checkbox,
    .section-main .mobile-bottom .order {
        display: block;
    }
    .section-main .label:last-child {
        margin: 0;
    }
    .section-main .sidebar .tabs {
        padding: 16px;
        margin: 0 -16px;
    }
    .section-main .sidebar .name {
        font-size: 22px;
    }
    .section-main,
    .section-lk .container {
        padding: 0;
    }
    .section-lk .sidebar {
        width: 200px;
        display: none;
    }
    .section-lk .title-section {
        font-size: 22px;
        margin: 0 0 20px;
    }
    .section-referals-six {
        margin: 0 0 20px;
        padding: 13px 14px 12px 95px;
        flex-wrap: wrap;
        justify-content: flex-start;
    }
    .section-referals-six .mobile {
        width: 100%;
        margin: 0 0 12px;
    }
    .section-referals-six .course {
        display: inline-flex;
        margin: 0;
    }
    .section-promo-one,
    .section-promo-two,
    .section-promo-three,
    .section-referals-five {
        padding: 20px 16px;
    }
    .section-promo-two .tabs__content {
        padding: 48px 0;
    }
    .section-promo-three {
        background: url(../img/section-promo-three-mobile-dark.webp) no-repeat 0 0, linear-gradient(0deg, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 0%, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 100%),
            var(--Surface-BG, #131313);
    }
    .section-promo-three .title {
        margin: 0 0 12px 145px;
    }
    .section-promo-two .tabs__caption li {
        padding: 8px 16px;
    }
    .section-order-one,
    .section-order-two,
    .section-order-three {
        padding: 20px 16px;
        margin: 0 0 20px;
    }
    .section-order-three {
        background: url(../img/referralImagesFirstBlack-mobile_1.webp) no-repeat center center;
        background-size: cover;
    }
    .section-order-three .desc {
        margin: 0;
        color: var(--Text-Primary, #edeeee);
        text-align: center;
    }
    .section-order-three .title {
        text-align: center;
    }
    .section-profile .question .text {
        position: absolute;
        left: 0;
        z-index: 9;
        padding: 12px;
        border-radius: 8px;
        background: var(--Text-Primary-Inverse, #131313);
        color: var(--Text-Primary, #edeeee);
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 20px;
        width: 200px;
        display: none;
        transition: 0.5s;
    }
    .section-referals-one .flex {
        display: flex;
        gap: 8px;
        margin: 21px 0 0;
    }
    .section-referals-one .item {
        padding: 16px 10px;
    }
    .section-order-three .label label {
        color: #edeeee;
    }
    .section-order-three .people {
        background: url(../img/section-order-three-bg-mobile-people.png) no-repeat center center;
        height: 146px;
        margin: 0 -16px 12px;
    }
    .section-order-three .label input {
        overflow: hidden;
        color: var(--Text-Primary, #edeeee);
        text-overflow: ellipsis;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 24px;
        padding: 0 5px 0 0;
    }
    .section-order-three .buttons {
        flex-direction: column;
        gap: 16px;
    }
    .section-order-three .label {
        margin: 0 0 16px;
    }
    .section-order-three .buttons .copy,
    .section-order-three .buttons .full {
        width: 100%;
        text-align: center;
    }
    .section-order-three .buttons .full br {
        display: none;
    }
    .section-lk {
        margin: 0 0 20px;
    }
    .section-history {
        padding: 20px 16px;
    }
    .section-history .head {
        flex-direction: column;
        gap: 16px;
        align-items: flex-start;
    }
    .section-history .head ul li {
        padding: 8px 16px;
    }
    .section-history .links-tabs {
        display: none;
    }
    .section-history .date-input,
    .section-history .date-input input {
        width: 100%;
    }
    .select-mobile-games .open img {
        filter: grayscale(100%);
    }
    .section-history .services-block .date {
        display: none;
    }
    .section-history .services-block .info-flex {
        flex-direction: column;
        gap: 4px;
    }
    .section-history .services-block .info-flex .col {
        display: flex;
        justify-content: space-between;
        position: relative;
    }
    .section-history .services-block .info-flex .col:before {
        content: "";
        position: absolute;
        bottom: 5px;
        left: 0;
        right: 0;
        z-index: 1;
        height: 1px;
        border-bottom: 1px rgba(237, 238, 238, 0.08) dashed;
    }
    .section-history .services-block .info-flex .name {
        position: relative;
        z-index: 3;
        padding: 0 4px 0 0;
    }
    .section-history .services-block .info-flex .info {
        position: relative;
        z-index: 3;
        padding: 0 0 0 4px;
    }
    .section-history .services-block .info-flex .col.mobile {
        display: flex;
    }
    .section-history .services-block .info-flex .last .name {
        display: block;
    }
    .section-profile .section-profile-one,
    .section-profile .section-profile-two,
    .section-profile .section-profile-three {
        padding: 20px 16px;
    }
    .section-profile .section-profile-one {
        flex-wrap: wrap;
    }
    .section-profile .section-profile-one .total {
        width: 100%;
    }
    .section-profile-two .items-connect {
        flex-direction: column;
    }
    .section-profile-two .items-connect .connect {
        width: 100%;
    }
    .section-profile-three .promo-form {
        flex-direction: column;
        gap: 16px;
    }
    #top {
        display: none !important;
    }
    .footer .site-width {
        flex-direction: column;
        gap: 32px;
    }
    .footer .col-left {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
    }
    .footer .links {
        margin: 0;
    }
    .footer .menu {
        gap: 32px;
    }
    .footer .menu ul:last-child {
        display: none;
    }
    .footer .pay {
        gap: 12px;
        max-width: none;
    }
    .footer .menu ul:nth-child(2) li:last-child {
        display: block;
    }
    .header .menu .enter {
        display: block;
        text-align: center;
        padding: 12px;
        border-radius: 6px;
        border: 1px solid var(--Border-Accent-Secondary, rgba(36, 255, 111, 0.24));
        background: var(--Surface-Accent-Hover, rgba(36, 255, 111, 0.04));
        color: var(--Text-Accent, #24ff6f);
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 20px;
        width: 100%;
        height: auto;
        cursor: pointer;
    }
    .header .menu .light {
        display: block;
        text-decoration: none;
        cursor: pointer;
        width: 32px;
        height: 32px;
        background: url(../img/setting.svg) no-repeat;
        background-size: contain !important;
    }
    .section-5 {
        display: block;
        margin: 40px 0;
    }
    .section-5 .site-width {
        display: flex;
        justify-content: space-between;
        gap: 10px;
    }
    .section-5 .icon {
        font-size: 0px;
        line-height: 0px;
    }
    .section-5 .name {
        color: var(--Text-Secondary, rgba(237, 238, 238, 0.48));
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 16px;
    }
    .section-5 .name span {
        display: block;
        color: var(--Text-Primary, #edeeee);
        font-size: 14px;
        font-style: normal;
        font-weight: 600;
        line-height: 20px;
    }
    .section-main .label.mobile {
        display: block;
    }
    .select-mobile-country {
        position: relative;
        margin: 0 -16px;
        padding: 0 16px;
        background: linear-gradient(0deg, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 0%, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 100%), var(--Surface-BG, #131313);
    }
    .section-main .container .tabs__caption {
        flex-direction: column;
        position: absolute;
        top: 100%;
        left: 16px;
        right: 16px;
        background: #242424;
        z-index: 9;
        border: 1px solid var(--Border-Primary-Default, rgba(237, 238, 238, 0.04));
        border-radius: 8px;
        display: none;
    }
    .section-main .container .tabs__caption.active {
        display: flex;
    }
    .select-mobile-country .select {
        display: block;
        padding: 8px 6px;
        border-radius: 8px;
        border: 1px solid var(--Border-Primary-Default, rgba(237, 238, 238, 0.04));
        background: url(../img/mobile-select.svg) no-repeat right 6px center, #edeeee0a;
        display: flex;
        align-items: center;
        color: var(--Text-Primary, #edeeee);
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 24px;
        gap: 12px;
    }
    .section-main .container .tabs__content {
        border-radius: 0 0 16px 16px;
    }
    .section-main .container .tabs__caption li.active {
        background: none !important;
    }
    .section-main .container .tabs__caption li {
        font-size: 14px;
        gap: 12px;
        padding: 12px;
    }
    .select-other-pay {
        gap: 4px;
        margin: 0;
    }
    .select-other-pay label {
        width: 100%;
    }
    .select-name-mobile {
        display: block;
        color: var(--Text-Secondary, rgba(237, 238, 238, 0.48));
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 20px;
        margin: 0 -16px;
        padding: 10px 16px 5px;
        background: linear-gradient(0deg, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 0%, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 100%), var(--Surface-BG, #131313);
        border-radius: 16px 16px 0 0;
    }
    .select-mobile-games {
        display: block;
        margin: 0 -16px;
        padding: 16px;
        background: linear-gradient(0deg, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 0%, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 100%), var(--Surface-BG, #131313);
        border-radius: 16px 16px 0 0;
    }
    .select-mobile-games .open {
        display: flex;
        align-items: center;
        border-radius: 8px;
        border: 1px solid var(--Border-Primary-Default, rgba(237, 238, 238, 0.04));
        background: url(../img/mobile-select.svg) no-repeat right 6px center, #edeeee0a;
        padding: 8px 50px 8px 16px;
        color: var(--Text-Primary, #edeeee);
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 24px;
        gap: 12px;
        cursor: pointer;
    }
    body.light .section-5 .name {
        color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
    }
    body.light .section-5 .name span {
        color: var(--Text-Primary, #131313);
    }
    body.light .select-mobile-games,
    body.light .select-name-mobile,
    body.light .select-mobile-country {
        background: #fff;
    }
    body.light .select-name-mobile {
        color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
    }
    body.light .select-mobile-games .open,
    body.light .select-mobile-country .select {
        border: 1px solid var(--Border-Primary-Default, rgba(19, 19, 19, 0.06));
        background: url(../img/mobile-select-black.svg) no-repeat right 6px center, #1313130f;
        color: var(--Text-Primary, #131313);
    }
    body.light .section-main .container .tabs__caption {
        border: 1px solid var(--Border-Primary-Default, rgba(19, 19, 19, 0.06));
        background: #fff;
        color: var(--Text-Primary, #131313);
    }
    body.light .header .enter {
        background: url(../img/mobile-login-black.svg) no-repeat !important;
        border: 0px !important;
    }
    body.light .header .login-panel {
        border-radius: 8px;
        border: none;
        background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12));
    }
    body.light .header .login-panel .panel-block {
        border-radius: 8px;
        border: 1px solid var(--Border-Primary-Default, rgba(237, 238, 238, 0.04));
        background: var(--White-500, #f7f7f7);
        box-shadow: 0 15px 30px #0000004d;
    }
    body.light .section-order-three {
        background: url(../img/referralImagesFirstBlack-mobile_1.webp) no-repeat 0 center;
        background-size: cover;
    }
    body.light .header .login-panel .dark {
        display: block;
        text-decoration: none;
        cursor: pointer;
        width: 32px;
        height: 32px;
        background: url(../img/setting-black.svg) no-repeat;
        background-size: contain !important;
    }
    .header .login-panel .menulogin a {
        font-size: 18px;
        align-items: flex-start;
        white-space: break-spaces;
    }
    body.light .header .setting {
        display: none !important;
    }
    body.light .section-referals-three {
        background: url(../img/section-referals-three-bg1-mobile-mobile.svg) no-repeat 0 0;
    }
    body.light .mobile-menu {
        background: url(../img/mobile-menu-black.svg) no-repeat;
    }
    body.light .mobile-menu.active {
        background: url(../img/mobile-close-black.svg) no-repeat;
    }
    body.light .header .menu {
        background: var(--White-600, #fff);
    }
    body.light .header .menu .enter {
        display: block;
        text-align: center;
        padding: 12px;
        border-radius: 6px;
        border: 1px solid var(--Border-Accent-Secondary, rgba(0, 190, 58, 0.24));
        background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12)) !important;
        color: var(--Text-Accent, #0db740);
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 20px;
        width: 100%;
        height: auto;
        cursor: pointer;
    }
    body.light .header .menu .dark {
        display: block;
        text-decoration: none;
        cursor: pointer;
        width: 32px;
        height: 32px;
        background: url(../img/setting-black.svg) no-repeat;
        background-size: contain !important;
    }
    .section-main .description h2,
    .section-main .description h3 {
        font-size: 13px;
    }
    #paysbp-popup .flex {
        flex-direction: column;
        gap: 24px;
    }
    #paysbp-popup .col-left {
        width: 100%;
        text-align: center;
    }
    .header .login-panel .panel-block .panel-balance .refreshs {
        display: block;
        margin: 0;
        transition: all 0.3s ease;
    }
    .popup-block .block {
        padding: 32px 20px;
        max-height: 90vh;
        overflow-y: auto;
        top: 5%;
        left: 5%;
        right: 5%;
        width: 90%;
        transform: translate(0);
    }
    .section-advantages {
        margin: 32px 0;
    }
    .title-section {
        margin: 0 0 24px;
        font-size: 13px;
    }
    .title-section h2 {
        font-size: 22px;
        margin: 0 0 8px;
    }
    .section-advantages .flex {
        gap: 4px;
        margin: 0 0 24px;
    }
    .section-advantages .item {
        width: 100%;
        padding: 16px 16px 16px 80px;
    }
    .section-advantages .icon {
        top: 16px;
    }
    .section-3 .site-width {
        gap: 20px;
        flex-direction: column-reverse;
    }
    .section-3 .col-right {
        width: 100%;
        max-width: none;
        padding: 20px 16px 28px;
    }
    .section-3 .col-left {
        padding: 20px 16px 28px;
    }
    .section-3 .name {
        font-size: 22px;
        margin: 0 0 16px;
    }
    .section-3 {
        margin: 0 0 32px;
    }
    .section-4 .item {
        width: 100%;
    }
    .section-4 .flex {
        margin: 0 0 24px;
    }
    .section-4 {
        margin: 0 0 32px;
    }
    .header .menu .top {
        display: flex;
        align-items: center;
        gap: 10px;
        justify-content: space-between;
        margin: 0 0 36px;
    }
    .header .menu .close {
        cursor: pointer;
        width: 32px;
        height: 32px;
        background: url(../img/mobile-close.svg) no-repeat;
    }
    body.light .header .menu .close {
        background: url(../img/mobile-close-black.svg) no-repeat;
    }
}
.topline.close {
    background: url(..../img/top-bg-close.png) no-repeat center center;
    background-size: cover;
    padding: 8px 0;
    color: #ffffffc9;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
}
.modal-overlay[data-v-7982c2fd] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #00000080;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    padding: 20px;
}
.bonus-promo-code[data-v-7982c2fd] {
    border-radius: 16px;
    background-color: #131313;
    position: relative;
    display: flex;
    max-width: 508px;
    width: 100%;
    max-height: calc(100vh - 40px);
    overflow-y: auto;
    flex-direction: column;
    font-family: Inter, sans-serif;
    padding: 40px 32px;
}
body.light .bonus-promo-code[data-v-7982c2fd] {
    background-color: #fff;
}
.section-title[data-v-7982c2fd] {
    color: #edeeee;
    font-size: 24px;
    font-weight: 500;
    line-height: 1;
    margin: 0 0 20px;
}
body.light .section-title[data-v-7982c2fd] {
    color: #131313;
}
.close-button[data-v-7982c2fd] {
    position: absolute;
    right: 16px;
    top: 16px;
    background: none;
    border: none;
    cursor: pointer;
    width: 24px;
    height: 24px;
    padding: 0;
}
.close-button-icon[data-v-7982c2fd] {
    width: 24px;
    height: 24px;
    -webkit-mask-size: cover;
    mask-size: cover;
    background-color: #fff;
}
.close-button svg[data-v-7982c2fd] {
    color: #fff;
}
body.light .close-button svg[data-v-7982c2fd] {
    color: #131313;
}
body.light .close-button-icon[data-v-7982c2fd] {
    background-color: #131313;
}
.bonus-promo-code[data-v-7982c2fd]::-webkit-scrollbar {
    width: 6px;
}
.bonus-promo-code[data-v-7982c2fd]::-webkit-scrollbar-track {
    background: #ffffff1a;
    border-radius: 3px;
}
.bonus-promo-code[data-v-7982c2fd]::-webkit-scrollbar-thumb {
    background: #fff3;
    border-radius: 3px;
}
body.light .bonus-promo-code[data-v-7982c2fd]::-webkit-scrollbar-track {
    background: #0000001a;
}
body.light .bonus-promo-code[data-v-7982c2fd]::-webkit-scrollbar-thumb {
    background: #0003;
}
[data-v-7982c2fd] .content-wrapper {
    display: flex;
    width: 100%;
    align-items: center;
    gap: 32px;
}
[data-v-7982c2fd] .info-message {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    background-color: #00be3a1f;
    border-radius: 16px;
    padding: 16px;
    margin-bottom: 20px;
}
[data-v-7982c2fd] .info-message.warning {
    background-color: #f9af111f;
}
[data-v-7982c2fd] .info-message.error {
    background-color: #ff4c4c1f;
}
[data-v-7982c2fd] .info-icon {
    width: 28px;
    height: 28px;
    flex-shrink: 0;
}
[data-v-7982c2fd] .info-text {
    flex: 1;
    font-size: 12px;
    color: #131313;
    line-height: 16px;
    margin: 0;
}
[data-v-7982c2fd] .action-button {
    background-color: #0db740;
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 600;
    padding: 16px;
    cursor: pointer;
    width: 100%;
}
[data-v-7982c2fd] .action-button:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}
@media (max-width: 991px) {
    .bonus-promo-code[data-v-7982c2fd] {
        padding: 20px;
    }
    .modal-overlay[data-v-7982c2fd] {
        padding: 10px;
    }
    .bonus-promo-code[data-v-7982c2fd] {
        padding: 20px;
        max-height: calc(100vh - 20px);
    }
    [data-v-7982c2fd] .content-wrapper {
        flex-direction: column;
    }
}
@media (min-height: 800px) {
    .bonus-promo-code[data-v-7982c2fd] {
        min-height: 200px;
    }
}
@media (max-height: 600px) {
    .bonus-promo-code[data-v-7982c2fd] {
        max-height: calc(100vh - 20px);
        padding: 20px;
    }
}
.loading-indicator[data-v-d5359957] {
    animation: spin-d5359957 2s linear infinite;
    margin-right: 8px;
}
@keyframes spin-d5359957 {
    0% {
        transform: rotate(0);
    }
    to {
        transform: rotate(360deg);
    }
}
.btn[data-v-e7968fbc] {
    margin: 0 0 0 4px;
    color: #ffd703;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}
.sum-text[data-v-e7968fbc] {
    margin: 0 0 0 4px;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    color: #ffd703;
}
body.light .sum-text[data-v-e7968fbc],
body.light .sum-plus[data-v-e7968fbc] {
    color: #f9af11;
}
body.light .btn[data-v-e7968fbc] {
    color: #0db740;
    background: #00be3a1f;
    border: 1px solid rgba(0, 190, 58, 0.24);
}
.title[data-v-e7968fbc] {
    color: var(--Text-Primary, #edeeee);
    text-align: center;
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    margin-bottom: 20px;
}
.desc[data-v-e7968fbc] {
    text-align: center;
    padding-bottom: 5%;
    padding-top: 5%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    flex-wrap: wrap;
}
.desc span[data-v-e7968fbc] {
    display: inline-flex;
    align-items: center;
}
.bonus-icon[data-v-e7968fbc] {
    width: 24px;
    height: 24px;
    vertical-align: middle;
    display: inline-block;
}
.title[data-v-e7968fbc] {
    color: var(--Text-Primary, #edeeee);
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    text-align: center;
}
.desc[data-v-e7968fbc] {
    text-align: center;
    padding-bottom: 10%;
    padding-top: 5%;
}
.welcomesubscribe[data-v-e7968fbc] {
    justify-content: center;
}
.wlcm-connect[data-v-e7968fbc] {
    width: calc(60% - 4px);
    padding: 12px 16px;
    border-radius: 8px;
    border: 1px solid var(--Border-Primary-Default, rgb(237 238 238 / 4%));
    display: flex;
    gap: 12px;
    transition: 0.5s;
    cursor: pointer;
}
.bonus-icon[data-v-e7968fbc] {
    width: 24px;
    height: 24px;
    vertical-align: middle;
    display: inline-block;
    content: url(../img/stm-monets.svg);
}
body.light .bonus-icon[data-v-e7968fbc] {
    content: url(../img/stm-coin-orange.svg);
}
.wlcm-connect button img[data-v-e7968fbc] {
    width: 24px;
    height: 24px;
    vertical-align: middle;
    content: url(../img/stm-monets.svg);
}
body.light .wlcm-connect button img[data-v-e7968fbc] {
    content: url(../img/stm-coin-orange.svg);
}
body.light .wlcm-connect[data-v-e7968fbc] {
    border: 1px solid var(--Border-Primary-Default, rgb(237 238 238 / 4%));
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
}
body.light .title[data-v-e7968fbc] {
    color: var(--Text-Primary, #131313);
}
.success-message-mobile[data-v-e7968fbc],
.error-message-mobile[data-v-e7968fbc] {
    margin-top: 8px;
    font-size: 12px;
}
.success-message-mobile[data-v-e7968fbc] {
    color: #24ff6f;
}
.error-message-mobile[data-v-e7968fbc] {
    color: #ff3b30;
}
.connect button[data-v-e7968fbc]:disabled {
    opacity: 0.7;
    cursor: not-allowed;
}
@media screen and (max-width: 780px) {
    .wlcm-connect[data-v-e7968fbc] {
        width: calc(70% - 4px);
    }
    .section-profile-two .items-connect[data-v-e7968fbc] {
        flex-direction: inherit;
        justify-content: center;
    }
    .desc[data-v-e7968fbc] {
        display: block;
    }
}
#generator-popup .desc[data-v-a6ee89c3] {
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    margin: 20px 0;
    text-align: left;
}
.popup-block .block[data-v-a6ee89c3] {
    border-radius: 16px;
    background: linear-gradient(0deg, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 0%, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 100%), var(--Surface-BG, #131313);
    width: 100%;
    max-width: 447px;
    padding: 40px 32px;
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 99999999999;
    transform: translate(-50%, -50%);
    color: var(--Text-Secondary, rgba(237, 238, 238, 0.48));
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}
.popup-block .close[data-v-a6ee89c3] {
    width: 24px;
    height: 24px;
    background: url(..../img/popup-close.svg) no-repeat;
    cursor: pointer;
    position: absolute;
    top: 20px;
    right: 20px;
    transition: 0.5s;
}
#generator-popup .title[data-v-a6ee89c3] {
    text-align: left;
}
.popup-block .title[data-v-a6ee89c3] {
    color: var(--Text-Primary, #edeeee);
    text-align: center;
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    margin: 0 0 20px;
}
#generator-popup .balance .number[data-v-a6ee89c3] {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #ffd703;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}
#generator-popup .select[data-v-a6ee89c3] {
    margin: 0 0 20px;
    display: inline-flex;
    padding: 2px;
    border-radius: 10px;
    background: var(--Surface-BG, #131313);
    width: 100%;
    justify-content: space-between;
    gap: 2px;
}
#generator-popup .error[data-v-a6ee89c3] {
    border-radius: 16px;
    padding: 16px 16px 16px 56px;
    color: var(--Text-Primary, #edeeee);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    margin: 0 0 20px;
}
#generator-popup .error.green[data-v-a6ee89c3] {
    background: url(..../img/generator-popup-icon1.svg) no-repeat 16px, #24ff6f3d;
}
#generator-popup .error.red[data-v-a6ee89c3] {
    background: url(..../img/generator-popup-icon2.svg) no-repeat 16px, #ff4b243d;
}
body.light #generator-popup .error[data-v-a6ee89c3] {
    color: var(--Text-Primary, #131313);
}
#generator-popup .balance .names[data-v-a6ee89c3] {
    margin: 0 0 8px;
}
#generator-popup .select input[data-v-a6ee89c3] {
    display: none;
}
#generator-popup .btns[data-v-a6ee89c3]:hover {
    background: var(--Button-Accent-Hover, #01db4b);
    color: var(--Text-Primary-Inverse, #131313);
}
input[data-v-a6ee89c3],
button[data-v-a6ee89c3],
textarea[data-v-a6ee89c3],
select[data-v-a6ee89c3] {
    font-size: 1rem;
    outline: none;
    font-family: Inter, sans-serif;
}
#generator-popup .select input:checked + span[data-v-a6ee89c3] {
    background: linear-gradient(0deg, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 0%, var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04)) 100%), var(--Surface-BG, #131313);
    color: var(--Text-Primary, #edeeee);
}
#generator-popup .select span[data-v-a6ee89c3] {
    display: block;
    cursor: pointer;
    border-radius: 8px;
    transition: 0.5s;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    white-space: nowrap;
    text-align: center;
}
#generator-popup .select label[data-v-a6ee89c3] {
    flex: 1;
    min-width: min-content;
    margin: 0 1px;
}
#generator-popup .label .input[data-v-a6ee89c3] {
    display: flex;
    align-items: center;
    padding: 8px 6px 8px 16px;
    border-radius: 8px;
    border: 1px solid var(--Border-Primary-Default, rgba(255, 255, 255, 0.04));
    background: var(--Surface-Primary-Default, rgba(255, 255, 255, 0.04));
    width: 100%;
    transition: 0.5s;
}
#generator-popup .label .input[data-v-a6ee89c3]:hover {
    background: var(--Surface-Prymary-Hover, rgba(255, 255, 255, 0.08));
}
#generator-popup .label .input[data-v-a6ee89c3]:focus-within {
    border: 1px solid var(--Border-Accent, #24ff6f);
}
#generator-popup .label.error .input[data-v-a6ee89c3] {
    border: 1px solid rgba(255, 16, 16, 0.33);
    background: #ff00000a;
}
#generator-popup .label input[data-v-a6ee89c3] {
    width: 100%;
    flex: 1;
    border: 0px;
    background: none;
    color: var(--Text-Primary, #fff);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
}
#generator-popup .label[data-v-a6ee89c3] ::placeholder {
    color: var(--Text-Tetriary, rgba(255, 255, 255, 0.18));
}
#generator-popup .label .copy[data-v-a6ee89c3] {
    display: block;
    text-decoration: none;
    cursor: pointer;
    padding: 2px 8px;
    border-radius: 6px;
    border: 1px solid var(--Border-Primary-Default, rgba(255, 255, 255, 0.04));
    background: var(--Surface-Primary-Default, rgba(255, 255, 255, 0.04));
    color: var(--Text-Primary, #fff);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    transition: 0.5s;
    margin: 0 0 0 5px;
}
#generator-popup .label .copy[data-v-a6ee89c3]:hover {
    border: 1px solid var(--Border-Accent-Secondary, rgba(36, 255, 111, 0.24));
    background: var(--Surface-Accent-Hover, rgba(36, 255, 111, 0.04));
    color: var(--Text-Accent, #24ff6f);
}
#generator-popup .label[data-v-a6ee89c3] {
    margin: 0 0 10px;
    position: relative;
    flex: 1;
}
body.light #generator-popup .select[data-v-a6ee89c3] {
    background: var(--Surface-Prymary-Hover, rgba(19, 19, 19, 0.08));
    color: var(--Text-Primary, #131313);
}
body.light #generator-popup .select input:checked + span[data-v-a6ee89c3] {
    background: var(--White-600, #fff);
    color: var(--Text-Primary, #131313);
}
body.light #generator-popup .label .input[data-v-a6ee89c3] {
    border: 1px solid var(--Border-Primary-Default, rgba(19, 19, 19, 0.06));
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
}
body.light #generator-popup .label input[data-v-a6ee89c3] {
    color: var(--Text-Primary, #131313);
}
body.light #generator-popup .label .copy[data-v-a6ee89c3] {
    border: 1px solid var(--Border-Primary-Default, rgba(19, 19, 19, 0.06));
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
    color: var(--Text-Primary, #131313);
}
body.light #generator-popup .btns[data-v-a6ee89c3] {
    background: var(--Button-Accent, #0db740);
    color: var(--Text-Primary-Inverse, #fff);
    border: 0px;
}
body.light #generator-popup .promo-block[data-v-a6ee89c3] {
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12));
}
#generator-popup .promo-block[data-v-a6ee89c3] {
    border-radius: 12px;
    background: var(--Surface-Accent-Hover, rgba(36, 255, 111, 0.04));
    padding: 16px;
    margin: 0 0 20px;
}
#generator-popup .select[data-v-a6ee89c3] {
    margin: 0 0 20px;
    display: inline-flex;
    gap: 2px;
    padding: 2px;
    border-radius: 10px;
    background: var(--Surface-BG, #131313);
}
.popup-block[data-v-a6ee89c3] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
}
.popup-bg[data-v-a6ee89c3] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #00000080;
}
.block[data-v-a6ee89c3] {
    position: relative;
    background: #1a1a1a;
    border-radius: 12px;
    padding: 24px;
    max-width: 480px;
    width: 90%;
    margin: 20px;
}
.close[data-v-a6ee89c3] {
    position: absolute;
    top: 16px;
    right: 16px;
    width: 24px;
    height: 24px;
    cursor: pointer;
    background: url(../img/close.svg) no-repeat center;
}
.coin-icon[data-v-a6ee89c3] {
    width: 24px;
    height: 24px;
    margin-right: 8px;
}
.skeleton-animation[data-v-a6ee89c3] {
    position: relative;
    overflow: hidden;
    border-radius: 8px;
    background: #ffffff0a;
}
.skeleton-animation[data-v-a6ee89c3]:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    transform: translate(-100%);
    background: linear-gradient(90deg, transparent 0, rgba(255, 255, 255, 0.1) 20%, rgba(255, 255, 255, 0.2) 60%, transparent);
    animation: shimmer-a6ee89c3 2s infinite;
}
body.light .skeleton-animation[data-v-a6ee89c3] {
    background: #1313130a;
}
body.light .skeleton-animation[data-v-a6ee89c3]:after {
    background: linear-gradient(90deg, transparent 0, rgba(19, 19, 19, 0.08) 20%, rgba(19, 19, 19, 0.12) 60%, transparent);
}
@keyframes shimmer-a6ee89c3 {
    to {
        transform: translate(100%);
    }
}
@media (max-width: 768px) {
    .popup-block .block[data-v-a6ee89c3] {
        width: calc(100% - 32px);
        padding: 32px 20px;
        margin: auto;
        max-height: 90vh;
        overflow-y: auto;
    }
    #generator-popup .title[data-v-a6ee89c3] {
        font-size: 20px;
        margin-bottom: 16px;
    }
    #generator-popup .balance .number[data-v-a6ee89c3] {
        font-size: 18px;
    }
    #generator-popup .select[data-v-a6ee89c3] {
        gap: 1px;
        padding: 1px;
    }
    #generator-popup .select span[data-v-a6ee89c3] {
        font-size: 13px;
        padding-top: 8px;
        padding-bottom: 8px;
    }
    #generator-popup .label .input[data-v-a6ee89c3] {
        padding: 6px 8px;
    }
    #generator-popup .label input[data-v-a6ee89c3] {
        font-size: 13px;
    }
    #generator-popup .label .copy[data-v-a6ee89c3] {
        font-size: 11px;
        padding: 2px 6px;
    }
    #generator-popup .promo-block[data-v-a6ee89c3] {
        padding: 12px;
    }
    #generator-popup .select label[data-v-a6ee89c3] {
        flex: 1;
        min-width: auto;
    }
}
@media (max-width: 375px) {
    .popup-block .block[data-v-a6ee89c3] {
        padding: 24px 16px;
    }
    #generator-popup .select span[data-v-a6ee89c3] {
        font-size: 12px;
        padding-top: 6px;
        padding-bottom: 6px;
    }
    #generator-popup .balance .number[data-v-a6ee89c3] {
        font-size: 16px;
    }
    #generator-popup .select[data-v-a6ee89c3] {
        gap: 1px;
    }
    #generator-popup .select label[data-v-a6ee89c3] {
        min-width: 0;
    }
}
@media (max-width: 768px) {
    .popup-block .block[data-v-a6ee89c3] {
        -webkit-overflow-scrolling: touch;
    }
    #generator-popup .select[data-v-a6ee89c3]::-webkit-scrollbar {
        width: 4px;
        height: 4px;
    }
    #generator-popup .select[data-v-a6ee89c3]::-webkit-scrollbar-thumb {
        background: #ffffff1a;
        border-radius: 2px;
    }
    body.light #generator-popup .select[data-v-a6ee89c3]::-webkit-scrollbar-thumb {
        background: #0000001a;
    }
}
@supports (padding-bottom: env(safe-area-inset-bottom)) {
    @media (max-width: 768px) {
        .popup-block .block[data-v-a6ee89c3] {
            padding-bottom: calc(20px + env(safe-area-inset-bottom));
        }
    }
}
@media (max-width: 768px) {
    @supports (-webkit-touch-callout: none) {
        .popup-block[data-v-a6ee89c3] {
            position: fixed;
            height: -webkit-fill-available;
        }
    }
}
@media (max-width: 375px) {
    #generator-popup .select span[data-v-a6ee89c3] {
        font-size: 12px;
    }
}
.enter {
    cursor: pointer;
}
.enter.disabled {
    opacity: 0.7;
    cursor: not-allowed;
}
.menulogin ul li a {
    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    border-radius: 8px;
    transition: background-color 0.3s ease;
}
.refresh-img,
.header .login-panel .panel-block .panel-balance .refresh .refresh-img {
    width: 18px;
}
.error-info[data-v-80d4867f] {
    color: var(--Text, #ff3b30);
}
body.light .first-time-message[data-v-80d4867f] {
    color: var(--Text-Tetriary, rgba(19, 19, 19, 0.4));
}
.first-time-message[data-v-80d4867f] {
    color: var(--Text-Secondary, rgba(255, 255, 255, 0.48));
}
.first-time-message .faq-link[data-v-80d4867f] {
    text-decoration: underline;
    cursor: pointer;
}
.warning-message[data-v-80d4867f] {
    color: var(--Text-Secondary, rgba(255, 255, 255, 0.48));
}
body.light .warning-message[data-v-80d4867f] {
    color: var(--Text-Tetriary, rgba(19, 19, 19, 0.4));
}
.loading-state[data-v-111adf25] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px 0;
    gap: 16px;
}
.loading-text[data-v-111adf25] {
    color: #edeeee7a;
    font: 400 14px/20px Inter, sans-serif;
    text-align: center;
}
.error-state[data-v-111adf25] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 40px 16px;
    gap: 16px;
}
.error-text[data-v-111adf25] {
    color: #ff3b30;
    font: 400 14px/20px Inter, sans-serif;
    text-align: center;
}
.retry-button[data-v-111adf25] {
    background: #edeeee0a;
    border: 1px solid rgba(237, 238, 238, 0.04);
    border-radius: 8px;
    padding: 8px 16px;
    color: #edeeee;
    font: 500 14px Inter, sans-serif;
    cursor: pointer;
    transition: background-color 0.2s ease;
}
.bank-selection-overlay[data-v-111adf25] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #0006;
    z-index: 9999;
    display: flex;
    align-items: flex-end;
    animation: fadeIn-111adf25 0.3s ease-out;
}
.modal-window[data-v-111adf25] {
    width: 100%;
    background: #131313;
    border-radius: 20px 20px 0 0;
    max-height: 97vh;
    overflow-y: auto;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    transform: translateY(-0%);
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), height 0.3s ease;
    will-change: transform;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    touch-action: none;
}
.drag-area[data-v-111adf25] {
    position: relative;
    background: inherit;
    border-radius: 20px 20px 0 0;
    z-index: 10;
    padding: 12px 0;
    cursor: grab;
    touch-action: none;
    -webkit-user-select: none;
    user-select: none;
}
.drag-handle[data-v-111adf25] {
    width: 36px;
    height: 4px;
    background: #edeeee33;
    border-radius: 2px;
    margin: 0 auto;
}
.headers[data-v-111adf25] {
    display: flex;
    align-items: center;
    padding: 8px 16px 0;
}
.back-button[data-v-111adf25] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: #edeeee0a;
    border: none;
    cursor: pointer;
}
.back-text[data-v-111adf25] {
    color: #edeeee;
    font: 400 14px/24px Inter, sans-serif;
    margin-left: 8px;
}
.sticky-header[data-v-111adf25] {
    position: sticky;
    top: 0;
    background: inherit;
    padding-top: 16px;
    z-index: 2;
}
.content[data-v-111adf25] {
    padding: 0 16px 32px;
    overflow-y: auto;
    min-height: 200px;
}
.content.search-active[data-v-111adf25] {
    padding-bottom: 80vh;
}
.selection-title[data-v-111adf25] {
    color: #edeeee7a;
    font: 400 14px/24px Inter, sans-serif;
    margin-bottom: 16px;
}
.initial-title[data-v-111adf25] {
    color: #edeeee7a;
    font: 400 14px/20px Inter, sans-serif;
    text-align: center;
    padding: 0 20px;
    margin: 12px 0 20px;
}
.search-form[data-v-111adf25] {
    position: relative;
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    background: #edeeee0a;
    border: 1px solid rgba(237, 238, 238, 0.04);
    border-radius: 8px;
    padding: 8px 16px;
}
.search-input[data-v-111adf25] {
    flex: 1;
    background: transparent;
    border: none;
    color: #edeeee;
    font: 400 14px/24px Inter, sans-serif;
}
.search-input[data-v-111adf25]::placeholder {
    color: #edeeee2e;
}
.search-icon[data-v-111adf25] {
    color: #edeeee2e;
}
.bank-list[data-v-111adf25] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.bank-item[data-v-111adf25] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    border-radius: 16px;
    background: #edeeee0a;
    cursor: pointer;
    transition: background-color 0.2s ease;
    -webkit-tap-highlight-color: transparent;
}
.bank-item[data-v-111adf25]:active {
    background: #edeeee14;
}
.bank-info[data-v-111adf25] {
    display: flex;
    align-items: center;
    gap: 16px;
}
.bank-logo[data-v-111adf25] {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    background: #fff;
    object-fit: contain;
}
.bank-name[data-v-111adf25] {
    color: #edeeee;
    font: 500 16px Inter, sans-serif;
}
.show-more[data-v-111adf25] {
    background: transparent;
}
.more-text[data-v-111adf25] {
    color: #edeeee7a;
    font: 500 16px Inter, sans-serif;
}
@keyframes fadeIn-111adf25 {
    0% {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
body.light .modal-window[data-v-111adf25] {
    background: #fff;
}
body.light .drag-handle[data-v-111adf25] {
    background: #0003;
}
body.light .back-button[data-v-111adf25] {
    background: #0000000a;
}
body.light .back-text[data-v-111adf25],
body.light .bank-name[data-v-111adf25] {
    color: #131313;
}
body.light .selection-title[data-v-111adf25],
body.light .initial-title[data-v-111adf25] {
    color: #1313137a;
}
body.light .search-form[data-v-111adf25] {
    background: #0000000a;
    border-color: #0000000a;
}
body.light .search-input[data-v-111adf25] {
    color: #131313;
}
body.light .search-input[data-v-111adf25]::placeholder {
    color: #1313137a;
}
body.light .bank-item[data-v-111adf25] {
    background: #0000000a;
}
body.light .bank-item[data-v-111adf25]:active {
    background: #00000014;
}
body.light .more-text[data-v-111adf25],
body.light .loading-text[data-v-111adf25] {
    color: #1313137a;
}
body.light .retry-button[data-v-111adf25] {
    background: #1313130a;
    border-color: #1313130a;
    color: #131313;
}
body.light .retry-button[data-v-111adf25]:hover {
    background: #13131314;
}
@media (max-width: 991px) {
    .modal-window[data-v-111adf25] {
        max-height: 97vh;
    }
    .bank-item[data-v-111adf25] {
        padding: 10px 12px;
    }
    .bank-logo[data-v-111adf25] {
        width: 36px;
        height: 36px;
    }
    .content.search-active[data-v-111adf25] {
        padding-bottom: 40vh;
    }
}
@media (max-width: 375px) {
    .content[data-v-111adf25] {
        padding: 0 12px 24px;
    }
    .bank-logo[data-v-111adf25] {
        width: 32px;
        height: 32px;
    }
    .bank-name[data-v-111adf25],
    .search-input[data-v-111adf25] {
        font-size: 14px;
    }
}
@supports (padding-bottom: env(safe-area-inset-bottom)) {
    .modal-window[data-v-111adf25] {
        padding-bottom: env(safe-area-inset-bottom);
    }
}
.modal-window[data-v-111adf25]::-webkit-scrollbar {
    width: 4px;
}
.modal-window[data-v-111adf25]::-webkit-scrollbar-track {
    background: #edeeee0a;
}
.modal-window[data-v-111adf25]::-webkit-scrollbar-thumb {
    background: #edeeee1a;
    border-radius: 2px;
}
body.light .modal-window[data-v-111adf25]::-webkit-scrollbar-track {
    background: #1313130a;
}
body.light .modal-window[data-v-111adf25]::-webkit-scrollbar-thumb {
    background: #1313131a;
}
@media (hover: none) and (pointer: coarse) {
    .bank-item[data-v-111adf25]:active {
        background: #edeeee14;
    }
    body.light .bank-item[data-v-111adf25]:active {
        background: #00000014;
    }
}
@supports (-webkit-touch-callout: none) {
    .content.search-active[data-v-111adf25] {
        padding-bottom: 50vh;
    }
    .bank-selection-overlay[data-v-111adf25] {
        position: fixed;
        height: 100%;
        height: -webkit-fill-available;
    }
    .modal-window[data-v-111adf25] {
        height: auto;
        max-height: calc(100% - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    }
}
.modal-overlay[data-v-22e208f8] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #2b2b2bbf;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}
.payment-spb[data-v-22e208f8] {
    border-radius: 16px;
    background-color: #131313;
    position: relative;
    display: flex;
    max-width: 727px;
    width: 100%;
    flex-direction: column;
    font-family: Inter, sans-serif;
    padding: 40px 32px;
    margin: 20px;
}
.payment-title[data-v-22e208f8] {
    color: #edeeee;
    font-size: 24px;
    font-weight: 500;
    line-height: 1;
    text-align: center;
    margin-bottom: 20px;
}
.close-button[data-v-22e208f8] {
    position: absolute;
    right: 16px;
    top: 16px;
    background: none;
    border: none;
    cursor: pointer;
    width: 24px;
    height: 24px;
    padding: 0;
}
.close-button svg[data-v-22e208f8] {
    color: #fff;
}
.payment-content[data-v-22e208f8] {
    display: flex;
    width: 100%;
    align-items: flex-start;
    gap: 32px;
}
.qr-code-container[data-v-22e208f8] {
    border-radius: 16px;
    background-color: #ffffff0f;
    display: flex;
    width: 282px;
    flex-direction: column;
    align-items: center;
    padding: 19px 15px;
    border: 1px solid rgba(255, 255, 255, 0.1);
}
.qr-wrapper[data-v-22e208f8] {
    background-color: #fff;
    width: 252px;
    height: 252px;
}
.qr-wrapper rect[data-v-22e208f8] {
    fill: #fff;
}
.qr-wrapper[data-v-22e208f8] svg {
    width: 100%;
    height: 100%;
}
.qr-code-help[data-v-22e208f8] {
    padding-top: 13px;
    font-size: 14px;
    line-height: 1;
    color: #edeeee7a;
}
.qr-code-help a[data-v-22e208f8] {
    color: inherit;
    text-decoration: none;
}
.payment-details[data-v-22e208f8] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.order-summary[data-v-22e208f8] {
    border-radius: 8px;
    background-color: #333;
    display: flex;
    gap: 12px;
    padding: 16px;
}
.order-icon[data-v-22e208f8] {
    width: 60px;
    height: 60px;
    background: url("data:image/svg+xml,%3csvg%20width='32'%20height='32'%20viewBox='0%200%2032%2032'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M15.9723%200C7.55254%200%200.655038%206.47565%200%2014.7044L8.59046%2018.2472C9.31815%2017.7502%2010.1981%2017.4606%2011.1437%2017.4606C11.2291%2017.4606%2011.3132%2017.4629%2011.3963%2017.4675L15.217%2011.9436V11.8661C15.217%208.54224%2017.9282%205.83731%2021.2611%205.83731C24.5939%205.83731%2027.3052%208.54224%2027.3052%2011.8661C27.3052%2015.19%2024.5939%2017.8961%2021.2611%2017.8961C21.2149%2017.8961%2021.17%2017.8949%2021.1238%2017.8938L15.6748%2021.7705C15.6782%2021.8423%2015.6806%2021.9142%2015.6806%2021.9848C15.6806%2024.4812%2013.6451%2026.5113%2011.1437%2026.5113C8.94796%2026.5113%207.11085%2024.9474%206.69569%2022.8773L0.551247%2020.3434C2.45409%2027.0539%208.63543%2031.9736%2015.9723%2031.9736C24.8246%2031.9736%2032%2024.8151%2032%2015.9868C32%207.15729%2024.8246%200%2015.9723%200ZM10.044%2024.2573L8.07542%2023.4457C8.4237%2024.1707%209.028%2024.7771%209.82949%2025.1099C11.5617%2025.8303%2013.5591%2025.0107%2014.281%2023.2815C14.6304%2022.4449%2014.6327%2021.5216%2014.2868%2020.6826C13.9408%2019.8437%2013.2869%2019.1894%2012.4485%2018.8406C11.6147%2018.4952%2010.7221%2018.5077%209.9379%2018.803L11.9722%2019.6419C13.25%2020.1731%2013.8543%2021.6367%2013.3215%2022.9111C12.7899%2024.1855%2011.3218%2024.7885%2010.044%2024.2573ZM25.2886%2011.8662C25.2886%209.65146%2023.4815%207.84817%2021.2615%207.84817C19.0404%207.84817%2017.2333%209.65146%2017.2333%2011.8662C17.2333%2014.081%2019.0404%2015.8832%2021.2615%2015.8832C23.4815%2015.8832%2025.2886%2014.081%2025.2886%2011.8662ZM18.2424%2011.8594C18.2424%2010.1929%2019.5974%208.84215%2021.2673%208.84215C22.9383%208.84215%2024.2934%2010.1929%2024.2934%2011.8594C24.2934%2013.5259%2022.9383%2014.8767%2021.2673%2014.8767C19.5974%2014.8767%2018.2424%2013.5259%2018.2424%2011.8594Z'%20fill='%23717171'/%3e%3c/svg%3e")
        no-repeat center;
    background-size: contain;
    opacity: 0.7;
}
.order-info[data-v-22e208f8] {
    flex: 1;
}
.order-title[data-v-22e208f8] {
    color: #edeeee;
    font-size: 16px;
    font-weight: 400;
    margin-bottom: 6px;
}
.order-email[data-v-22e208f8] {
    color: #24ff6f;
    font-size: 16px;
    margin-bottom: 6px;
}
.order-amount[data-v-22e208f8] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-weight: 600;
}
.amount-usd[data-v-22e208f8] {
    border-radius: 7px;
    background-color: #24ff6f0a;
    color: #24ff6f;
    padding: 4px 8px;
    border: 1px solid rgba(36, 255, 111, 0.24);
}
.amount-rub[data-v-22e208f8] {
    color: #edeeee;
}
.payment-instructions[data-v-22e208f8] {
    color: #edeeee7a;
    font-size: 12px;
    line-height: 16px;
}
.payment-button[data-v-22e208f8] {
    border-radius: 8px;
    background-color: #24ff6f0a;
    color: #24ff6f;
    font-weight: 600;
    padding: 16px;
    border: 1px solid #24ff6f;
    text-decoration: none;
    text-align: center;
    transition: background-color 0.2s;
    width: 100%;
    cursor: pointer;
}
.payment-button[data-v-22e208f8]:hover {
    background-color: #24ff6f14;
}
body.light .payment-spb[data-v-22e208f8] {
    background-color: #fff;
}
body.light .close-button svg[data-v-22e208f8] {
    color: #131313;
}
body.light .payment-title[data-v-22e208f8],
body.light .qr-code-help[data-v-22e208f8],
body.light .payment-instructions[data-v-22e208f8] {
    color: #131313b8;
}
body.light .order-summary[data-v-22e208f8] {
    background-color: #1313130f;
}
body.light .order-title[data-v-22e208f8],
body.light .amount-rub[data-v-22e208f8] {
    color: #131313;
}
body.light .payment-button[data-v-22e208f8] {
    background-color: #00be3a1f;
    color: #0db740;
    border: 1px solid #0db740;
}
body.light .amount-usd[data-v-22e208f8] {
    color: #0db740;
    border: 1px solid #0db740;
}
@media (max-width: 991px) {
    .payment-spb[data-v-22e208f8] {
        padding: 20px;
        margin-bottom: 300px;
    }
    .payment-content[data-v-22e208f8] {
        flex-direction: column;
        align-items: center;
    }
    .qr-wrapper[data-v-22e208f8] {
        width: 180px;
        height: 180px;
    }
    .qr-code-container[data-v-22e208f8] {
        display: none;
    }
}
@media (max-width: 375px) {
    .payment-spb[data-v-22e208f8] {
        margin: 12px 12px 300px;
        padding: 16px;
    }
    .qr-wrapper[data-v-22e208f8] {
        width: 180px;
        height: 180px;
    }
    .order-summary[data-v-22e208f8] {
        padding: 12px;
    }
    .order-icon[data-v-22e208f8] {
        width: 48px;
        height: 48px;
    }
}
.skeleton-animation[data-v-fc849f72] {
    position: relative;
    overflow: hidden;
}
.skeleton-animation[data-v-fc849f72]:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    transform: translate(-100%);
    background: linear-gradient(90deg, transparent 0, rgba(255, 255, 255, 0.1) 20%, rgba(255, 255, 255, 0.2) 60%, transparent);
    animation: shimmer-fc849f72 2s infinite;
}
body.light .skeleton-animation[data-v-fc849f72]:after {
    background: linear-gradient(90deg, transparent 0, rgba(0, 190, 58, 0.08) 20%, rgba(0, 190, 58, 0.12) 60%, transparent);
}
@keyframes shimmer-fc849f72 {
    to {
        transform: translate(100%);
    }
}
.skeleton-img[data-v-fc849f72] {
    filter: grayscale(100%) brightness(95%) contrast(90%);
    opacity: 0.2;
}
.error[data-v-fc849f72] {
    color: red;
    padding: 1rem;
    text-align: center;
}
.modal-overlay[data-v-acdc7805] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #2b2b2bbf;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}
.success-payment[data-v-acdc7805] {
    border-radius: 16px;
    background-color: #131313;
    position: relative;
    display: flex;
    max-width: 596px;
    width: 100%;
    flex-direction: column;
    font-family: Inter, sans-serif;
    font-weight: 400;
    justify-content: start;
    padding: 40px 32px;
    margin: 20px;
}
.body.dark .success-payment[data-v-acdc7805] {
    background-color: #131313;
}
.payment-title[data-v-acdc7805] {
    color: #edeeee;
    font-size: 24px;
    font-weight: 500;
    line-height: 1;
    text-align: center;
    margin: 0 0 20px;
}
.close-button[data-v-acdc7805] {
    position: absolute;
    right: 16px;
    top: 16px;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    width: 24px;
    height: 24px;
    -webkit-mask-size: cover;
    mask-size: cover;
}
.close-button svg[data-v-acdc7805] {
    color: #fff;
}
body.light .close-button svg[data-v-acdc7805] {
    color: #131313;
}
.close-button img[data-v-acdc7805] {
    width: 100%;
    height: 100%;
    top: 16px;
}
.payment-description[data-v-acdc7805] {
    color: var(--Text-Secondary, rgba(237, 238, 238, 0.48));
    font-size: 14px;
    line-height: 20px;
    text-align: center;
    z-index: 0;
    margin-top: 20px;
}
.payment-code-container[data-v-acdc7805] {
    border-radius: 12px;
    background-color: #24ff6f0a;
    width: 100%;
    padding: 16px;
    margin-bottom: 20px;
}
.payment-code-wrapper[data-v-acdc7805] {
    display: flex;
    flex-direction: column;
}
.payment-code-label[data-v-acdc7805] {
    color: #edeeee7a;
    font-size: 12px;
    line-height: 2;
    margin-bottom: 4px;
}
.payment-code-display[data-v-acdc7805] {
    border-radius: 8px;
    background-color: #edeeee0a;
    display: flex;
    min-height: 40px;
    align-items: center;
    color: #edeeee;
    justify-content: space-between;
    padding: 6px 6px 6px 16px;
    border: 1px solid rgba(237, 238, 238, 0.04);
}
.payment-code-text[data-v-acdc7805] {
    font-size: 14px;
    line-height: 24px;
    flex: 1;
}
.copy-button[data-v-acdc7805] {
    border-radius: 6px;
    background-color: #edeeee0a;
    font-size: 12px;
    line-height: 2;
    padding: 4px 8px;
    border: 1px solid rgba(237, 238, 238, 0.04);
    color: #edeeee;
    cursor: pointer;
}
.copy-button[data-v-acdc7805]:hover {
    background-color: #1313131a;
}
.payment-instructions[data-v-acdc7805] {
    color: var(--Text-Secondary, rgba(237, 238, 238, 0.48));
    font-size: 14px;
    line-height: 20px;
    margin: 20px 0 0;
}
.payment-instructions ul[data-v-acdc7805] {
    padding: 0;
    margin: 0;
}
.payment-instructions li[data-v-acdc7805] {
    margin-bottom: 16px;
}
.payment-instructions li[data-v-acdc7805]:last-child {
    margin-bottom: 0;
}
.highlight-text[data-v-acdc7805] {
    color: #0db740;
    text-decoration: none;
}
.highlight-text[data-v-acdc7805]:hover {
    text-decoration: underline;
}
.auth-buttons[data-v-acdc7805] {
    margin: 20px 0 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.auth-button[data-v-acdc7805] {
    border-radius: 8px;
    background-color: #1313130f;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 12px 16px;
    border: none;
    cursor: pointer;
    font-size: 16px;
    color: #131313;
    transition: all 0.2s;
}
.auth-button[data-v-acdc7805]:hover {
    background-color: #1313131a;
}
.auth-icon[data-v-acdc7805] {
    width: 28px;
    height: 28px;
}
.auth-benefits[data-v-acdc7805] {
    color: #0db740;
    font-size: 14px;
    line-height: 24px;
    text-align: center;
    margin: 20px 0 0;
}
body.light .success-payment[data-v-acdc7805] {
    background-color: #fff;
}
body.light .payment-title[data-v-acdc7805] {
    color: #131313;
}
body.light .payment-description[data-v-acdc7805] {
    color: #131313b8;
}
body.light .payment-code-container[data-v-acdc7805] {
    background-color: #00be3a1f;
}
body.light .payment-code-label[data-v-acdc7805] {
    color: #1313137a;
}
body.light .payment-code-display[data-v-acdc7805] {
    background-color: #1313130f;
    border: 1px solid rgba(19, 19, 19, 0.06);
}
body.light .payment-code-text[data-v-acdc7805] {
    color: #131313;
}
body.light .copy-button[data-v-acdc7805] {
    background-color: #1313130f;
    border: 1px solid rgba(19, 19, 19, 0.06);
    color: #131313;
}
body.light .payment-instructions[data-v-acdc7805] {
    color: #131313b8;
}
body.light .highlight-text[data-v-acdc7805] {
    color: #0db740;
}
@media (max-width: 640px) {
    .success-payment[data-v-acdc7805] {
        padding: 32px 20px;
        margin: 16px;
    }
    .payment-title[data-v-acdc7805] {
        font-size: 20px;
    }
    .payment-code-display[data-v-acdc7805] {
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
    }
    .payment-code-text[data-v-acdc7805] {
        word-break: break-all;
    }
    .auth-button[data-v-acdc7805] {
        font-size: 14px;
    }
}
.modal-overlay[data-v-b571d6a4] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #2b2b2bbf;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}
.payment-success[data-v-b571d6a4] {
    border-radius: 16px;
    background-color: #131313;
    max-width: 596px;
    width: 100%;
    color: #edeeee;
    padding: 40px 32px;
    font: 400 14px Inter, sans-serif;
    margin: 20px;
}
.payment-success__header[data-v-b571d6a4] {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    margin-bottom: 20px;
}
.payment-success__title[data-v-b571d6a4] {
    color: #edeeee;
    font-size: 24px;
    font-weight: 500;
    line-height: 1;
    text-align: center;
    margin: 0;
}
.payment-success__close[data-v-b571d6a4] {
    position: absolute;
    right: -16px;
    top: -16px;
    background: none;
    border: none;
    cursor: pointer;
    width: 24px;
    height: 24px;
    padding: 0;
}
.payment-success__close-icon[data-v-b571d6a4] {
    width: 24px;
    height: 24px;
    -webkit-mask-size: cover;
    mask-size: cover;
}
.payment-success__close-icon svg[data-v-b571d6a4] {
    color: #fff;
}
body.light .payment-success__close-icon svg[data-v-b571d6a4] {
    color: #131313;
}
.payment-success__message[data-v-b571d6a4] {
    color: #edeeee7a;
    line-height: 20px;
    text-align: center;
    margin: 0 0 20px;
}
.payment-code-container[data-v-b571d6a4] {
    border-radius: 12px;
    background-color: #24ff6f0a;
    width: 100%;
    padding: 16px;
    margin-bottom: 20px;
}
.payment-code-wrapper[data-v-b571d6a4] {
    display: flex;
    flex-direction: column;
}
.payment-code-label[data-v-b571d6a4] {
    color: #edeeee7a;
    font-size: 12px;
    line-height: 2;
    margin-bottom: 4px;
}
.payment-code-display[data-v-b571d6a4] {
    border-radius: 8px;
    background-color: #edeeee0a;
    display: flex;
    min-height: 40px;
    align-items: center;
    color: #edeeee;
    justify-content: space-between;
    padding: 6px 6px 6px 16px;
    border: 1px solid rgba(237, 238, 238, 0.04);
}
.payment-code-text[data-v-b571d6a4] {
    font-size: 14px;
    line-height: 24px;
    flex: 1;
}
.copy-button[data-v-b571d6a4] {
    border-radius: 6px;
    background-color: #edeeee0a;
    font-size: 12px;
    line-height: 2;
    padding: 4px 8px;
    border: 1px solid rgba(237, 238, 238, 0.04);
    color: #edeeee;
    cursor: pointer;
}
.copy-button[data-v-b571d6a4]:hover {
    background-color: #edeeee14;
}
.payment-success__join-group[data-v-b571d6a4] {
    color: #24ff6f;
    line-height: 24px;
    text-align: center;
    margin-top: 20px;
}
.payment-success__group-link[data-v-b571d6a4] {
    border-radius: 8px;
    background-color: #edeeee0a;
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 16px;
    line-height: 1;
    padding: 12px 16px;
    margin: 20px auto 0;
    text-decoration: none;
    color: inherit;
    width: 235px;
}
.payment-success__group-link[data-v-b571d6a4]:hover {
    background-color: #edeeee14;
}
.payment-success__group-icon[data-v-b571d6a4] {
    width: 28px;
    height: 28px;
    object-fit: contain;
}
.payment-success__group-text[data-v-b571d6a4] {
    color: inherit;
}
.payment-success__arrow-icon[data-v-b571d6a4] {
    width: 24px;
    height: 24px;
    margin-left: auto;
}
body.light .payment-success[data-v-b571d6a4] {
    background-color: #fff;
    color: #131313;
}
body.light .payment-success__title[data-v-b571d6a4] {
    color: #131313;
}
body.light .payment-success__message[data-v-b571d6a4] {
    color: #131313b8;
}
body.light .payment-code-container[data-v-b571d6a4] {
    background-color: #00be3a1f;
}
body.light .payment-code-label[data-v-b571d6a4] {
    color: #131313b8;
}
body.light .payment-code-display[data-v-b571d6a4],
body.light .copy-button[data-v-b571d6a4] {
    background-color: #1313130f;
    border-color: #1313130f;
    color: #131313;
}
body.light .payment-success__join-group[data-v-b571d6a4] {
    color: #0db740;
}
body.light .payment-success__group-link[data-v-b571d6a4] {
    background-color: #1313130f;
    color: #131313;
}
body.light .payment-success__arrow-icon[data-v-b571d6a4] {
    filter: invert(0%) sepia(0%) saturate(0%) hue-rotate(93deg) brightness(0%) contrast(100%);
}
@media (max-width: 991px) {
    .payment-success__close[data-v-b571d6a4] {
        position: absolute;
        right: -12px;
        top: -12px;
    }
    .payment-success[data-v-b571d6a4] {
        padding: 20px;
        margin: 16px;
    }
    .payment-success__message[data-v-b571d6a4],
    .payment-code-container[data-v-b571d6a4] {
        max-width: 100%;
    }
    .payment-code-display[data-v-b571d6a4] {
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
    }
    .payment-code-text[data-v-b571d6a4] {
        word-break: break-all;
    }
}
.select-other-pay .price[data-v-f036743a] {
    display: grid;
}
.pubg-cards-container[data-v-f036743a] {
    margin-bottom: 20px;
}
.loading-state[data-v-f036743a],
.error-state[data-v-f036743a] {
    padding: 20px;
    text-align: center;
}
.cards-grid[data-v-f036743a] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 16px;
}
.card-item[data-v-f036743a] {
    border-radius: 8px;
    background: #edeeee0a;
    padding: 16px;
    cursor: pointer;
    transition: all 0.2s ease;
}
.card-item[data-v-f036743a]:hover {
    background: #edeeee14;
}
.card-item.selected[data-v-f036743a] {
    background: #24ff6f14;
    border: 1px solid rgba(36, 255, 111, 0.24);
}
.card-content[data-v-f036743a] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.card-title[data-v-f036743a] {
    font-weight: 500;
    color: #fff;
}
.card-price-container[data-v-f036743a] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.card-price[data-v-f036743a] {
    font-weight: 600;
    color: #24ff6f;
}
.card-store-price[data-v-f036743a] {
    color: #edeeee7a;
    font-size: 0.9em;
}
.name[data-v-f036743a] {
    display: none;
}
.refresh-btn[data-v-f036743a] {
    background: #24ff6f1a;
    color: #24ff6f;
    border: 1px solid rgba(36, 255, 111, 0.3);
    padding: 8px 16px;
    border-radius: 4px;
    margin-top: 16px;
    cursor: pointer;
}
body.light .card-item[data-v-f036743a] {
    background: #1313130a;
}
body.light .card-item[data-v-f036743a]:hover {
    background: #13131314;
}
body.light .card-item.selected[data-v-f036743a] {
    background: #00be3a14;
    border: 1px solid rgba(0, 190, 58, 0.24);
}
body.light .card-title[data-v-f036743a] {
    color: #131313;
}
body.light .card-price[data-v-f036743a] {
    color: #0db740;
}
body.light .card-store-price[data-v-f036743a] {
    color: #1313137a;
}
.skeleton-animation[data-v-f036743a] {
    position: relative;
    overflow: hidden;
    border-radius: 8px;
    background: #ffffff0a;
}
.skeleton-animation[data-v-f036743a]:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    transform: translate(-100%);
    background: linear-gradient(90deg, transparent 0, rgba(255, 255, 255, 0.1) 20%, rgba(255, 255, 255, 0.2) 60%, transparent);
    animation: shimmer-f036743a 2s infinite;
}
body.light .skeleton-animation[data-v-f036743a] {
    background: #1313130a;
}
body.light .skeleton-animation[data-v-f036743a]:after {
    background: linear-gradient(90deg, transparent 0, rgba(19, 19, 19, 0.08) 20%, rgba(19, 19, 19, 0.12) 60%, transparent);
}
@media screen and (max-width: 768px) {
    .select-other-pay .price[data-v-f036743a] {
        display: flex;
    }
    body.light .name[data-v-f036743a] {
        color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
    }
    .name[data-v-f036743a] {
        color: var(--Text-Secondary, rgba(255, 255, 255, 0.48));
        display: block;
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: 20px;
        margin: 0 0 4px;
    }
}
@keyframes shimmer-f036743a {
    to {
        transform: translate(100%);
    }
}
.skeleton-img[data-v-f036743a] {
    filter: grayscale(100%) brightness(95%) contrast(90%);
    opacity: 0.2;
}
.error[data-v-f036743a] {
    color: red;
    padding: 1rem;
    text-align: center;
}
.ponters {
    cursor: pointer;
}
.pr-6 {
    padding-right: 5px;
}
.scroll-to-top[data-v-db2acc34]:hover {
    opacity: 0.8;
}
.scroll-to-top[style*="display: block"][data-v-db2acc34] {
    opacity: 1;
    pointer-events: auto;
}
.section-contacts[data-v-4d79858b] {
    padding: 40px 0;
    color: #fff;
    min-height: calc(100vh - 200px);
}
body.light h1[data-v-4d79858b] {
    color: var(--Text-Primary, #131313);
}
h1[data-v-4d79858b] {
    font-size: 48px;
    margin-bottom: 40px;
}
.cont[data-v-4d79858b] {
    font-size: 16px;
    color: gray;
    margin-bottom: 40px;
    line-height: 1.5;
}
.cont[data-v-4d79858b]:before {
    content: "Режим оказания услуг: Круглосуточно, в автоматическом режиме \a\a"var(--COMPANY_NAME) " \a\aОГРНИП "var(--COMPANY_OGRN) " \aИНН "var(--COMPANY_INN) " \a\a"var(--COMPANY_ADDRESS);
    white-space: pre;
    display: block;
}
.email[data-v-4d79858b] {
    color: gray;
    font-size: 16px;
    margin-bottom: 0;
}
.support-links[data-v-4d79858b] {
    margin-top: 20px;
    display: flex;
    gap: 8px;
    align-items: center;
    font-size: 16px;
}
.support-links a[data-v-4d79858b] {
    color: #fff;
    text-decoration: underline;
    transition: opacity 0.2s;
}
.support-links a[data-v-4d79858b]:hover {
    opacity: 0.8;
}
.support-links span[data-v-4d79858b] {
    color: gray;
}
body.light .support-chat[data-v-4d79858b],
body.light .vk-support[data-v-4d79858b] {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.72));
}
@media (max-width: 768px) {
    .section-contacts[data-v-4d79858b] {
        padding: 20px;
        min-height: calc(100vh - 160px);
    }
    .site-width[data-v-4d79858b] {
        padding: 0;
    }
    h1[data-v-4d79858b] {
        font-size: 32px;
        margin-bottom: 24px;
    }
    .cont[data-v-4d79858b] {
        font-size: 14px;
        margin-bottom: 24px;
    }
    .cont[data-v-4d79858b]:before {
        content: "Режим оказания услуг: \aКруглосуточно, \aв автоматическом режиме \a\aИП ШАЙДУЛЛИН ИЛЬЯ РАДИКОВИЧ \a\aОГРНИП 323547600067847 \aИНН 540200606493 \a\a 630029, Российская Федерация, \aНовосибирская область, \aгород Новосибирск, \aулица 2-ая Ракитная, дом 67А";
        white-space: pre;
        line-height: 1.4;
    }
    .email[data-v-4d79858b] {
        font-size: 14px;
    }
    .support-links[data-v-4d79858b] {
        margin-top: 16px;
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
        font-size: 14px;
    }
    .support-links span[data-v-4d79858b] {
        display: none;
    }
    .support-links a[data-v-4d79858b] {
        width: 100%;
        text-align: left;
    }
}
@media (max-width: 480px) {
    .section-contacts[data-v-4d79858b] {
        padding: 16px;
    }
    h1[data-v-4d79858b] {
        font-size: 28px;
        margin-bottom: 20px;
    }
}
.not-found[data-v-b0152a9d] {
    min-height: calc(100vh - 200px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding-bottom: 100px;
}
.order[data-v-b0152a9d]:hover {
    background-color: #0056b3;
}
.fade-enter-from[data-v-6bffb28b],
.fade-leave-to[data-v-6bffb28b] {
    opacity: 0;
}
.fade-enter-active[data-v-6bffb28b],
.fade-leave-active[data-v-6bffb28b] {
    transition: opacity 0.3s ease;
}
.fade-enter[data-v-6bffb28b],
.fade-leave-to[data-v-6bffb28b] {
    opacity: 0;
}
.silent-auth[data-v-6ed81caa] {
    display: none;
}
.silent-auth.show-error[data-v-6ed81caa] {
    display: flex;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #00000080;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}
.error-popup[data-v-6ed81caa] {
    background: #fff;
    border-radius: 12px;
    padding: 24px;
    max-width: 400px;
    width: 90%;
    box-shadow: 0 4px 20px #00000026;
}
.error-content[data-v-6ed81caa] {
    text-align: center;
}
.error-message[data-v-6ed81caa] {
    color: #ff3b30;
    margin-bottom: 16px;
    font-size: 14px;
    line-height: 1.5;
}
.error-button[data-v-6ed81caa] {
    background: #ff3b30;
    color: #fff;
    border: none;
    padding: 8px 16px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 14px;
    transition: opacity 0.2s;
}
.error-button[data-v-6ed81caa]:hover {
    opacity: 0.9;
}
body.dark {
    background: #1a1a1a;
}
body.dark {
    color: #ff3b30;
}
@media (prefers-reduced-motion: reduce) {
    .silent-auth[data-v-6ed81caa] {
        transition: none;
    }
}
@media (max-width: 480px) {
    .error-popup[data-v-6ed81caa] {
        margin: 20px;
        padding: 20px;
    }
}
.btn[data-v-84001c52] {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
}
.refresh-icon[data-v-84001c52] {
    transition: all 0.3s ease;
    content: url(../img/refresh.svg);
}
.refresh-icon.light-icon[data-v-84001c52] {
    content: url(../img/refresh-light.svg);
}
.btn[data-v-84001c52]:hover {
    color: #131313;
}
.btn:hover .refresh-icon[data-v-84001c52] {
    transform: rotate(180deg);
}
.btn.disabled[data-v-84001c52] {
    opacity: 0.7;
    cursor: not-allowed;
}
.rotating[data-v-84001c52] {
    animation: rotate-84001c52 1s linear infinite;
}
@keyframes rotate-84001c52 {
    0% {
        transform: rotate(0);
    }
    to {
        transform: rotate(360deg);
    }
}
.theme-icon {
    filter: invert(0);
}
body.light .theme-icon {
    content: url(../img/stm-coin-orange.svg);
}
.skeleton-animation {
    position: relative;
    overflow: hidden;
    border-radius: 8px;
    background: #ffffff0a;
}
.section-referals-four .td {
    flex: 1;
}
.section-referals-four .td label {
    color: var(--Text-Secondary, rgba(237, 238, 238, 0.48));
    font-size: 12px;
    display: block;
    margin-bottom: 4px;
    text-overflow: ellipsis;
}
.section-referals-four .td .text {
    display: flex;
    align-items: center;
    gap: 4px;
}
.section-referals-four .td .text img {
    width: 16px;
    height: 16px;
}
.date-picker[data-v-fb5c5ef2] {
    position: relative;
    width: fit-content;
}
.date-input[data-v-fb5c5ef2] {
    padding: 8px 12px;
    border: 1px solid rgba(237, 238, 238, 0.1);
    border-radius: 8px;
    background: #edeeee0a;
    color: #edeeee;
    cursor: pointer;
    width: 200px;
}
.calendar[data-v-fb5c5ef2] {
    border-radius: 8px;
    background: #131313;
    box-shadow: 0 8px 16px #0000001c;
    max-width: 261px;
    padding: 0 8px 8px;
    border: 1px solid rgba(23, 32, 60, 0.08);
    position: absolute;
    z-index: 99;
}
.calendar-header[data-v-fb5c5ef2] {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 8px 0;
}
.month-selector[data-v-fb5c5ef2],
.year-selector[data-v-fb5c5ef2] {
    border-radius: 4px;
    background: #edeeee0a;
    display: flex;
    align-items: center;
    gap: 4px;
}
.nav-button[data-v-fb5c5ef2] {
    border-radius: 4px;
    width: 34px;
    padding: 8px;
    background: none;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}
.nav-icon[data-v-fb5c5ef2] {
    width: 18px;
    height: 18px;
}
.month-text[data-v-fb5c5ef2],
.year-text[data-v-fb5c5ef2] {
    color: #edeeee;
    font: 600 12px/1 Inter, sans-serif;
    text-align: center;
}
.weekdays-header[data-v-fb5c5ef2] {
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid rgba(23, 32, 60, 0.08);
}
.weekday[data-v-fb5c5ef2] {
    flex: 1;
    color: #edeeee7a;
    text-align: center;
    font: 400 12px/1 Inter, sans-serif;
    padding: 0 4px;
    min-height: 24px;
    border-radius: 4px;
}
.calendar-row[data-v-fb5c5ef2] {
    display: flex;
    justify-content: space-between;
    gap: 3px;
}
.calendar-day[data-v-fb5c5ef2] {
    flex: 1;
    min-height: 32px;
    padding: 8px 4px;
    border-radius: 4px;
    color: #edeeee;
    text-align: center;
    font: 400 12px/1 Inter, sans-serif;
    cursor: pointer;
}
.calendar-day.inactive[data-v-fb5c5ef2] {
    color: #edeeee2e;
}
.visually-hidden[data-v-fb5c5ef2] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}
body.light .calendar[data-v-fb5c5ef2] {
    background: #fff;
}
body.light .calendar-day[data-v-fb5c5ef2] {
    color: var(--Text-Primary, #131313);
}
body.light .weekday[data-v-fb5c5ef2] {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.48));
}
body.light .month-text[data-v-fb5c5ef2],
body.light .year-text[data-v-fb5c5ef2] {
    color: var(--Text-Primary, #131313);
}
body.light .calendar-day.inactive[data-v-fb5c5ef2] {
    color: var(--Text-Secondary, rgba(19, 19, 19, 0.48));
}
body.light .nav-icon[data-v-fb5c5ef2] {
    filter: invert(7%) sepia(8%) saturate(11%) hue-rotate(314deg) brightness(101%) contrast(93%);
}
.nav-icon[data-v-fb5c5ef2] {
    filter: invert(0%) sepia(0%) saturate(7500%) hue-rotate(346deg) brightness(94%) contrast(108%);
}
body.light .section-history .date-input value[data-v-fb5c5ef2] {
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
}
.select-trigger {
    display: none;
}
@media (max-width: 768px) {
    .select-options {
        max-height: 300px;
        overflow-y: auto;
    }
    .mobile-select-container {
        position: relative;
        width: 100%;
        margin-bottom: 16px;
    }
    .select-name-mobile {
        color: var(--Text-Secondary, rgba(237, 238, 238, 0.48));
        font-size: 14px;
    }
    .select-trigger {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 12px 16px;
        background: #fff;
        border-radius: 8px;
        cursor: pointer;
        transition: background 0.2s ease;
        background: var(--Surface-Primary-Hover, rgba(237, 238, 238, 0.08));
    }
    .current-selection {
        display: flex;
        align-items: center;
        gap: 12px;
    }
    .current-selection img {
        width: 24px;
        height: 24px;
    }
    .select-arrow {
        transition: transform 0.2s ease;
    }
    .select-arrow.rotated {
        transform: rotate(180deg);
    }
    .select-options {
        list-style: none;
        padding: 0;
        margin: 0;
        position: absolute;
        top: calc(100% + 4px);
        left: 0;
        right: 0;
        background: #242424;
        border-radius: 8px;
        overflow: hidden;
        z-index: 10;
    }
    .option-item {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 12px 16px;
        cursor: pointer;
        transition: background 0.2s ease;
    }
    .option-item img {
        width: 24px;
        height: 24px;
    }
    .option-item:hover,
    .option-item.active {
        background: var(--Surface-Primary-Hover, rgba(237, 238, 238, 0.08));
    }
    .fade-enter-active,
    .fade-leave-active {
        transition: opacity 0.2s ease, transform 0.2s ease;
    }
    .fade-enter-from,
    .fade-leave-to {
        opacity: 0;
        transform: translateY(-10px);
    }
    body.light .select-trigger {
        background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
    }
    body.light .select-options {
        background: var(--Surface, #ffffff);
        box-shadow: 0 8px 16px #0000001a;
    }
    body.light .option-item:hover,
    body.light .option-item.active {
        background: var(--Surface-Primary-Hover, rgba(19, 19, 19, 0.08));
    }
}
.transactions-loading {
    opacity: 0.7;
    pointer-events: none;
}
.transactions-price.negative,
body.light .transactions-price.negative {
    color: #ff5e5e;
}
.pagination {
    margin-top: 20px;
    display: flex;
    justify-content: center;
}
.pagination .pay {
    font-weight: 400;
    width: 100%;
    height: 48px;
    border-radius: 8px;
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
    border: none;
    color: var(--Text-Primary, #edeeee);
    font-size: 14px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}
.pagination .pay:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}
.pagination .pay:hover:not(:disabled) {
    background: var(--Surface-Primary-Hover, rgba(237, 238, 238, 0.08));
}
body.light .pagination .pay {
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
    color: var(--Text-Primary, #131313);
}
body.light .pagination .pay:hover:not(:disabled) {
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12)) !important;
}
.select-mobile-dropdown {
    position: relative;
    width: 100%;
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
    border-radius: 8px;
    margin-top: 4px;
    z-index: 100;
}
.select-mobile-option {
    padding: 12px 16px;
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}
.select-mobile-option img {
    width: 20px;
    height: 20px;
}
body.light .select-mobile-dropdown {
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
}
body.light .select-mobile-option.active {
    background: var(--Surface-Primary-Hover, rgba(19, 19, 19, 0.08));
}
.pay.clickable {
    cursor: pointer !important;
    opacity: 1 !important;
}
.pay.clickable:hover {
    background: var(--Surface-Primary-Hover, rgba(237, 238, 238, 0.08));
}
body.light .pay.clickable:hover {
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12));
}
.links-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}
.skeleton-animation {
    position: relative;
    overflow: hidden;
    background: #ffffff0a;
    border-radius: 8px;
}
@media (max-width: 768px) {
    .top-selects {
        gap: 12px;
    }
    .links-tabs {
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-bottom: 8px;
        -webkit-overflow-scrolling: touch;
    }
}
:deep(.important-note) {
    display: block !important;
    margin: 16px 0 !important;
    padding: 16px !important;
    background: #edeeee0a !important;
    border-radius: 8px !important;
}
:deep(.note-content) {
    display: block !important;
    font-size: 12px !important;
    line-height: 16px !important;
    color: #edeeee7a !important;
    font-style: italic !important;
}
body.light :deep(.important-note) {
    background: #1313130a !important;
}
body.light :deep(.note-content) {
    color: #1313137a !important;
}
.pagination-bottom {
    width: 100%;
    padding: 12px;
    margin-bottom: 20px;
    border-radius: 8px;
    background: var(--Surface-Primary-Default, rgba(237, 238, 238, 0.04));
    color: var(--Text-Primary, #edeeee);
    border: none;
    cursor: pointer;
    font-size: 14px;
    transition: all 0.3s ease;
}
.pagination-bottom:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}
body.light .pagination-bottom {
    background: var(--Surface-Primary-Default, rgba(19, 19, 19, 0.06));
    color: var(--Text-Primary, #131313);
}
body.light .pagination-bottom:hover:not(:disabled) {
    background: var(--Surface-Accent-Hover, rgba(0, 190, 58, 0.12)) !important;
}
.pagination-bottom:hover:not(:disabled) {
    background: var(--Surface-Primary-Hover, rgba(237, 238, 238, 0.08));
}
.item-question:hover .question-name:after {
    background: url(..../img/question-arrow-hover.svg) no-repeat;
}
.item-question.active .question-name:after {
    background: url(..../img/question-arrow-hover.svg) no-repeat;
    transform: rotate(180deg);
}
.question-name {
    cursor: pointer;
    position: relative;
}
.question-name:after {
    content: "";
    position: absolute;
    right: 16px;
    top: 50%;
    width: 24px;
    height: 24px;
    background: url(../img/question-arrow-hover.svg) no-repeat center;
    transform: translateY(-50%);
    transition: transform 0.3s ease;
}
.item-question:hover .question-name:after {
    background: url(../img/question-arrow-hover.svg) no-repeat center;
}
.item-question.active .question-name:after {
    transform: translateY(-50%) rotate(180deg);
}
.answer {
    display: none;
    padding: 0 16px 16px;
    color: #edeeee7a;
}
.item-question.active .answer {
    display: block;
}
body.light .answer {
    color: #1313137a;
}
.price {
    display: flex;
    align-items: center;
    gap: 8px;
}
.coin-plus,
.coin-minus {
    width: 23px;
    height: 23px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}
.coin-plus {
    background-image: url(../img/stm-coin.svg);
}
.coin-minus {
    background-image: url(../img/stm-coin-pink.svg);
}
body.light .coin-plus {
    background-image: url(../img/stm-coin-orange.svg);
}
body.light .coin-minus {
    background-image: url(../img/stm-coin-rad.svg);
}
:deep(.router-link) {
    color: #24ff6f;
    text-decoration: none;
}
:deep(.router-link:hover) {
    text-decoration: underline;
}
.success-message-inline,
.success-message {
    margin-top: 8px;
    color: #24ff6f;
    font-size: 14px;
    line-height: 1.4;
    display: flex;
    align-items: center;
    gap: 4px;
}
.success-message-inline img.theme-icon,
.success-message img.theme-icon {
    width: 16px;
    height: 16px;
    display: inline-flex;
    vertical-align: middle;
    margin: 0;
}
body.light .success-message-inline,
body.light .success-message {
    color: #0db740;
}
@media (max-width: 768px) {
    .success-message-inline,
    .success-message {
        font-size: 12px;
    }
    .success-message-inline img.theme-icon,
    .success-message img.theme-icon {
        width: 14px;
        height: 14px;
    }
}
.success-message-inline {
    margin-top: 8px;
    color: #24ff6f;
    font-size: 14px;
    line-height: 1.4;
}
.success-message-inline img.theme-icon {
    width: 16px;
    height: 16px;
    vertical-align: middle;
    margin: -3px 2px 0;
    display: inline-block;
}
body.light .success-message-inline {
    color: #0db740;
}
@media (max-width: 768px) {
    .success-message-inline {
        font-size: 12px;
    }
    .success-message-inline img.theme-icon {
        width: 14px;
        height: 14px;
    }
}
.items-connect {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.connect {
    width: calc(50% - 4px);
    transition: all 0.3s ease;
}
.connect button:disabled {
    opacity: 0.7;
    cursor: not-allowed;
}
.connect.succes {
    opacity: 0.7;
}
@media (max-width: 768px) {
    .connect {
        width: 100%;
    }
}
.success-message-mobile,
.error-message-mobile {
    margin-top: 8px;
    font-size: 12px;
}
.success-message-mobile {
    color: #24ff6f;
}
.error-message-mobile {
    color: #ff3b30;
}
.connect-error {
    width: calc(50% - 4px);
    padding: 12px 16px;
    border-radius: 8px;
    display: flex;
    gap: 12px;
    transition: 0.5s;
    cursor: pointer;
}
.skeleton-animation {
    position: relative;
    overflow: hidden;
    border-radius: 4px;
    background: #ffffff0a;
    vertical-align: middle;
}
.skeleton-animation:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    transform: translate(-100%);
    background: linear-gradient(90deg, transparent 0, rgba(255, 255, 255, 0.1) 20%, rgba(255, 255, 255, 0.2) 60%, transparent);
    animation: shimmer 2s infinite;
}
body.light .skeleton-animation {
    background: #1313130a;
}
body.light .skeleton-animation:after {
    background: linear-gradient(90deg, transparent 0, rgba(19, 19, 19, 0.08) 20%, rgba(19, 19, 19, 0.12) 60%, transparent);
}
@keyframes shimmer {
    to {
        transform: translate(100%);
    }
}