body,
html {
    margin: 0;
    overflow-x: hidden !important;
    height: 100%;
}

.ticker-wrap {
    width: 100%;
    margin: 0 auto;
    overflow: hidden;
    white-space: nowrap;
    bottom: 0;
    height: 3.5rem;
    margin-top: 16px;
}

.ticker1 {
    display: inline-block;
    animation: marquee 80s linear infinite;
    -webkit-animation: marquee 80s linear infinite;
}

.ticker2 {
    display: inline-block;
    animation: marqueeReverse 80s linear infinite;
    -webkit-animation: marqueeReverse 80s linear infinite;
}

.ticker3 {
    display: inline-block;
    animation: marquee 80s linear infinite;
    -webkit-animation: marquee 80s linear infinite;
}

.item-collection-1 {
    position: relative;
    left: 0%;
    animation:
        marqueeReverse 20s linear infinite,
        swap 20s linear infinite;
    -webkit-animation:
        marqueeReverse 20s linear infinite,
        swap 20s linear infinite;
    margin-bottom: 16px;
}

.item-collection-3 {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    justify-content: flex-start;
    width: 100%;
    position: absolute;
    left: 0;
    top: 10px;
    transform: translateY(-50%);
    overflow-x: auto;
    padding: 10px;
    z-index: 1;
}

.item-collection-3::-webkit-scrollbar {
    display: none;
}

.item-collection-3 {
    scrollbar-width: none;
    padding: 0;
}

.item-collection-3 .item {
    display: flex;
    align-items: center;
    background-color: rgba(255, 255, 255, 0.1);
    padding: 0.5rem;
    border-radius: 32px;
    width: 210px !important;
    box-sizing: border-box;
    justify-content: center;
    height: 58px;
    opacity: 0;
    transition:
        transform 0.2ss,
        opacity 1s;
    flex-shrink: 0;
    margin-right: 8px;
    animation: fadeIn 0.3s linear;
}

@keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.right-close {
    position: relative;
}

.right-close::before {
    content: " ";
    width: 100px;
    position: absolute;
    height: 100%;
    z-index: 2;
    top: 0;
    right: 0;
    background: linear-gradient(90deg, rgba(73, 144, 239, 0) 0%, #4990ef 80.21%);
}

.right-close .item {
    background: rgba(32, 1, 94, 0.2) !important;
    border-radius: 16px;
}

.item.s {
    border-radius: 16px;
}

.item.hide {
    opacity: 0;
    transition:
        transform 0.3s ease-in-out,
        opacity 0.3s ease-in-out;
    -webkit-transition:
        transform 0.3s ease-in-out,
        opacity 0.3s ease-in-out;
    -moz-transition:
        transform 0.3s ease-in-out,
        opacity 0.3s ease-in-out;
    -ms-transition:
        transform 0.3s ease-in-out,
        opacity 0.3s ease-in-out;
    -o-transition:
        transform 0.3s ease-in-out,
        opacity 0.3s ease-in-out;
}

.item.show {
    transform: translateX(0);
    opacity: 1;
    transition:
        transform 0.2s ease-in-out,
        opacity 0.7s ease-in-out;
    -webkit-transition:
        transform 0.2s ease-in-out,
        opacity 0.7s ease-in-out;
    -moz-transition:
        transform 0.2s ease-in-out,
        opacity 0.7s ease-in-out;
    -ms-transition:
        transform 0.2s ease-in-out,
        opacity 0.7s ease-in-out;
    -o-transition:
        transform 0.2s ease-in-out,
        opacity 0.7s ease-in-out;
}

.item-collection-2 {
    position: relative;
    left: 0%;
    animation:
        marqueeReverse 600s linear infinite,
        swapReverse 180s linear infinite;
    -webkit-animation:
        marqueeReverse 600s linear infinite,
        swapReverse 180s linear infinite;
    -webkit-animation:
        marqueeReverse 80s linear infinite,
        swapReverse 80s linear infinite;
    animation-duration: 380s;
}

.item {
    display: inline-block;
    text-align: center;
    line-height: 52px;
}

.container {
    text-align: center;
}

.item {
    display: inline-block;
    text-align: center;
    background: var(--offer-bubble-fill,
    linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.06) 100%));
}

/* @keyframes marquee {
    0% {
        transform: translateX(0);
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
    }

    100% {
        transform: translateX(-100%);
        -webkit-transform: translateX(-100%);
        -moz-transform: translateX(-100%);
        -ms-transform: translateX(-100%);
        -o-transform: translateX(-100%);
    }
} */

.ticker-wrap {
    overflow: hidden;
    position: relative;
}

@keyframes marquee {
    0% {
        transform: translateX(0);
    }

    50% {
        transform: translateX(-50%);
    }

    100% {
        transform: translateX(-100%);
    }
}

@keyframes swap {

    0%,
    50% {
        left: 0%;
    }

    50.01%,
    100% {
        left: 100%;
    }
}

@keyframes swapReverse {

    0%,
    100% {
        left: -50%;
    }

    50% {
        left: 0%;
    }
}

@keyframes marqueeReverse {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(100%);
    }
}

.ticker1 {
    animation-duration: 40s;
    -webkit-animation-duration: 40s;
}

.ticker2 {
    animation-duration: 100s;
    -webkit-animation-duration: 1000s;
}

.item-collection-1 {
    animation-duration: 160s, 160s;
    -webkit-animation-duration: 160s, 160s;
}

.item-collection-2 {
    animation-duration: 80s, 360s;
    -webkit-animation-duration: 8990s, 490s;
}

.simpleParallax {
    overflow: unset !important;
}

.light-border-top::before {
    content: "";
    position: absolute;
    top: -40px;
    left: 0;
    opacity: 0.6;
    width: 100%;
    height: 220px;
    filter: blur(60px);
    box-shadow:
        inset 0px -20px 189px 176px #00ff2b,
        0px 0px 0px 0px;
    -webkit-filter: blur(60px);
}

.light-border-bottom::before {
    content: "";
    position: absolute;
    bottom: -40px;
    left: 0;
    opacity: 0.8;
    width: 100%;
    height: 100px;
    filter: blur(60px);
    box-shadow:
        inset 0px -20px 189px 176px #00ff2b,
        0px 0px 0px 0px;
    -webkit-filter: blur(60px);
}

.bg-light {
    bottom: 500px;
    width: 700px;
    height: 700px;
    position: absolute;
    background: #06ff77;
    opacity: 0.6;
    right: 0;
    filter: blur(120px);
    z-index: 0;
    -webkit-filter: blur(120px);
}

@media screen and (max-width: 700px) {
    .bg-light {
        height: 300px;
        width: 100%;
        left: calc(50% - 150px);
        bottom: 50%;
        filter: blur(100px);
    }
}

@media screen and (max-width: 650px) {
    .item.show {
        height: 48px;
        width: 180px;
        font-size: 12px;
    }
}



.social-link:hover {
    background-color: #fff;
}

.social-link {
    transition: 0.3s;
}

.social-link svg {
    fill: white;
}

.social-link:hover svg {
    fill: #20015e;
}

/* Sidebar */

.sidebar-nav a.active svg {
    fill: url(#paint-color);
}

.sidebar-nav a svg {
    fill: url(#paint-transparent);
    transition: 0.2s;
}

.dropdown-menu svg {
    fill: url(#paint-transparent);
    transition: 0.2s;
}

.dropdown-menu a:hover span,
.dropdown-menu a:hover svg {
    fill: #fff;
    color: #fff;
}

.sidebar-nav a.active div {
    font-weight: 600;
    color: #fff;
    transition: 0.2s;
    -webkit-transition: 0.2s;
    -moz-transition: 0.2s;
    -ms-transition: 0.2s;
    -o-transition: 0.2s;
}

.blurs {
    position: relative;
    z-index: 1;
}

.sidebar-nav a:not(.active):hover svg,
.sidebar-nav a:not(.active):hover div {
    fill: #fff;
    color: #fff;
}

.sidebar-nav a.active::before {
    height: 100%;
    content: " ";
    position: absolute;
    top: 0;
    left: 0;
    background: linear-gradient(116deg, #7bffe5 -20.47%, #00f1c1 93.43%);
    width: 4px;
    border-radius: 50px;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    -ms-border-radius: 50px;
    -o-border-radius: 50px;
}

@media screen and (max-width: 768px) {
    .sidebar-nav a.active::before {
        width: 100%;
        height: 4px;
        top: unset;
        bottom: 0;
        left: 0;
    }
}

.topbox::-webkit-scrollbar {
    width: 0;
}

.thumb::-webkit-scrollbar {
    width: 0;
}

/* Unsupported shadows */

.shadow-boost {
    background-blend-mode: overlay, normal;
    filter: drop-shadow(-10px 10px 32px 0px rgba(11, 14, 21, 0.3), -4px 4px 20px 0px rgba(11, 14, 21, 0.3));
    -webkit-filter: drop-shadow(-10px 10px 32px 0px rgba(11, 14, 21, 0.3), -4px 4px 20px 0px rgba(11, 14, 21, 0.3));
}

.cardq:hover {
    cursor: pointer;
    box-shadow: 0px 8px 32px 0px rgba(32, 1, 94, 0.4);
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
}

.dashboard-glow {
    opacity: 0.8;
    filter: blur(169.21119689941406px);
}




.bg-cashout-button {
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.06) 100%);
}

.bg-cashout-button-premium {
    border-radius: 16px 2px 2px 16px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.06) 100%);
    height: 51px;
    margin-right: 2px;
    box-sizing: border-box;
}

.cashout-btn:not(.premium) {
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.06) 100%);
    height: 51px;
    box-sizing: border-box;
}

.bg-cashout-button-gold {
    background-image: url("../images/golden-button-bg.svg");
    border-radius: 2px 16px 16px 2px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    box-sizing: border-box;
    width: 58px;
    height: 51px;
}

.bg-cashout-button-gold span {
    background: linear-gradient(350deg, #a3560a 7.21%, #a68d0f 94.5%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.disable button {
    opacity: 0.6;
}

.vip {
    /* border: 1px solid transparent;
    border-image: linear-gradient(to top, #FFE101, #FFAA00, #BB00FD99, #32158200) 1 / 5px;
    overflow: hidden; */
    border-radius: 16px;
    position: relative;
    background: #2c1b9a;
    z-index: 2;
}

.wrapper {
    position: relative;
}

.wrapper::before {
    content: "";
    background-image: linear-gradient(to bottom, #ffe101, #ffaa00, #bb00fd99, #32158200);
    top: -2px;
    left: -2px;
    bottom: -2px;
    right: -2px;
    position: absolute;
    z-index: 0;
    border-radius: 16px;
}

.disable .button-wrap {
    opacity: 0.6;
}

.button-wrap {
    position: relative;
    z-index: 2;
}

.button-wrap span {
    background: linear-gradient(180deg, #ffec00 0%, #ffa100 100%);
    border-radius: 2px 16px 16px 2px;
    height: 44px;
    width: 54px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.button-wrap.silver span {
    background: var(--card-silver-bg, linear-gradient(180deg, #CAD2DB 0%, #EBF4FF 0.01%, #7E8EA0 100%));
    border-radius: 2px 16px 16px 2px;
    height: 44px;
    width: 54px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.button-wrap.silver span>span {
    background: linear-gradient(349deg, #37404D 0.49%, #8C9199 104.82%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.button-wrap.silver::before {
    content: "";
    background-image: linear-gradient(180deg, #BFC1C4 0%, #4F5863 100%);
    top: -4px;
    left: -4px;
    border-radius: 2px 18px 18px 2px;
    bottom: -4px;
    right: -4px;
    position: absolute;
    z-index: -1;
}

.button-wrap span>span {
    background: linear-gradient(350deg, #a3560a 7.21%, #a68d0f 94.5%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.price-section.disabled {
    opacity: .6;
    pointer-events: none;
}

.button-wrap::before {
    content: "";
    background-image: linear-gradient(180deg, #ccc509 0%, #c25e09 100%);
    top: -4px;
    left: -4px;
    border-radius: 2px 18px 18px 2px;
    bottom: -4px;
    right: -4px;
    position: absolute;
    z-index: -1;
}

.fixed .button-wrap::before{
    top: 0;
    bottom: 0;
}

.banner-type-gold {
    border-radius: 0px 16px 0px 12px;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.2) 100%),
    linear-gradient(180deg, #ffec00 0%, #ffa100 100%);
    background-blend-mode: overlay, normal;
    box-shadow:
        -10px 10px 32px 0px rgba(11, 14, 21, 0.3),
        -4px 4px 20px 0px rgba(11, 14, 21, 0.3);
}

.banner-type-gold span {
    background: linear-gradient(350deg, #a3560a 7.21%, #a68d0f 94.5%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}



.scroll-disable {
    scrollbar-width: none;
    /* Firefox */
    -ms-overflow-style: none;
    /* Internet Explorer 10+ */
}

/* Dashboard */

.premium-border {
    position: relative;
    width: 160px;
}


.premium-border.custom {
    position: relative;
    width: unset;
}

.blue-plash {
    right: -2px;
    top: -2px;
    z-index: 21;
}

.premium-border::before {
    content: "";
    background: linear-gradient(202deg,
    #ffe101 0%,
    #fa0 31.5%,
    rgba(187, 0, 253, 0.6) 56.93%,
    rgba(50, 21, 130, 0) 87.38%);
    top: -2px;
    left: -2px;
    bottom: -2px;
    right: -2px;
    position: absolute;
    z-index: 0;
    border-radius: 16px;
}

.premium-border.blue-stroke::before {
    background: linear-gradient(202deg,
    #27FFD4 0%,
    #00D1FF 31.5%,
    #00D1FF 56.93%,
    rgba(50, 21, 130, 0) 87.38%);
}

.bg-content-container:hover {
    cursor: pointer;
    box-shadow: 0px 8px 32px 0px rgba(32, 1, 94, 0.4);
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
}

.bg-content-container::before {
    background: #4ca0ff;
    content: " ";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 14px;
    z-index: 0;
}

.bg-content-container {
    background: linear-gradient(180deg, #180147 16.5%, rgba(32, 1, 94, 0.2) 100%);
    position: relative;
    z-index: 20 !important;
    transition: .2s;
    border-radius: 14px;
}

.bg-premium {
    background: linear-gradient(180deg, #180147 16.5%, rgba(32, 1, 94, 0.4) 100%);
    border-radius: 14px;
    z-index: 1;
}

.premium-plash {
    border-radius: 0px 14px 0px 12px;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.2) 100%),
    linear-gradient(180deg, #ffec00 0%, #ffa100 100%);
    background-blend-mode: overlay, normal;
    box-shadow: -17px 11px 12px 0px rgba(11, 14, 21, 0.3), -4px 4px 20px 0px rgba(11, 14, 21, 0.3);

    padding: 6px 8px;
    z-index: 21;
}

.premium-plash span {
    line-height: 100%;
    background: linear-gradient(350deg, #A3560A 7.21%, #A68D0F 94.5%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}



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

.tab {
    padding: 12px 0;
}

/* Core styles/functionality */
.tab input {
    position: absolute;
    opacity: 0;
    z-index: -1;
}

.tab__content {
    max-height: 0;
    overflow: hidden;
    transition: all 0.35s;
}

.tab input:checked~.tab__content {
    max-height: 10rem;
    margin-top: 12px;
}

.tab input:checked~.tab__svg svg {
    transform: rotate(90deg) !important;
}

/* Visual styles */
.accordion {
    overflow: hidden;
}

.tab__label,
.tab__close {
    display: flex;
    color: white;
    background: var(--theme);
    cursor: pointer;
}

.tab__label {
    justify-content: space-between;
}

.tab input:checked+.tab__label::after {
    transform: rotate(270deg);
}

.tab__content p {
    margin: 0;
}

.tab__close {
    justify-content: flex-end;
    padding: 0.5rem 1rem;
    font-size: 0.75rem;
}

.accordion--radio {
    --theme: var(--secondary);
}

/* Arrow animation */
.tab input:not(:checked)+.tab__label:hover::after {
    animation: bounce .5s infinite;
}

@keyframes bounce {
    25% {
        transform: rotate(90deg) translate(.25rem);
    }

    75% {
        transform: rotate(90deg) translate(-.25rem);
    }
}


.light-gold-text {
    background: linear-gradient(180deg, #FFEC00 0%, #FFA100 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.dark-gold-text {
    background: linear-gradient(350deg, #A3560A 7.21%, #A68D0F 94.5%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}


/* Daily Page */
.daily-border {
    position: relative;
}

.daily-border.active {
    border: 0;
}

.daily-border.active::before {
    position: absolute;
    background: linear-gradient(to bottom, #CCC509 0%, #C25E09 100%);
    border-radius: 50%;
    right: -2px;
    left: -2px;
    top: -2px;
    content: " ";
    bottom: -2px;
    z-index: 0;
}

.daily-border.active::after {
    content: url("../images/Check.svg");
    width: 20px;
    height: 20px;
    position: absolute;
    left: calc(50% - 10px);
    top: calc(50% - 10px);
    z-index: 2;
}

.daily-border:not(.active)>div {
    border-radius: 125px;
}

.daily-border:not(.active)::before {
    content: " ";
    width: 0;
    height: 0;
    border: 2px solid rgba(255, 255, 255, 0.10);
    border-radius: 125px;
    position: absolute;
    width: 40px;
    height: 40px;
    padding: 2px;
}

.daily-border:not(.active)::after {
    content: url("../images/Profile.svg");
    position: absolute;
    left: calc(50% - 12px);
    top: calc(50% - 12px);
}

.daily-border.active>div {
    background: linear-gradient(180deg, #FFEC00 0%, #FFA100 100%);
    border-radius: 50%;
    z-index: 1;
}

.disable button {
    cursor: not-allowed;
}



/* Withdraw Popups */
.withdraw-popup,
.success-popup,
.error-popup {
    display: none;
    opacity: 0;
    transition: opacity .3s ease-in-out;
}

.withdraw-popup.active,
.success-popup.active,
.error-popup.active {
    display: flex;
    opacity: 1;
}


/* Popups goold border and ggradients */
.border-gold-gradient {
    position: relative !important;
    z-index: 1;
    border-radius: 32px;
}

.border-gold-gradient::before {
    position: absolute;
    z-index: 0;
    background: linear-gradient(202deg, #FFE101 0%, #FA0 31.5%, rgba(187, 0, 253, 0.60) 56.93%, rgba(50, 21, 130, 0.00) 87.38%);
}

.popup-gold-bg {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.20) 100%), linear-gradient(180deg, #FFEC00 0%, #FFA100 100%);
}

.bubble-bg {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.20) 0%, rgba(255, 255, 255, 0.06) 100%);
}

.task-container .task::before {
    content: attr(data-task-number);
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: 0;
    top: calc(50% - 14px);
    border: 2px solid rgba(255, 255, 255, .1);
    background: rgb(73 54 231);
    z-index: 1;
    color: #fff;
}

.task-container .item.completed::before {
    border: 0;
}

.task-container.silver .task.completed::before {
    content: url("../images/completed-silver.svg");
}

.task .task-price {
    color: #fff;
}

.popup-content > div >  div {
    overflow-y: scroll; /* Скроллим внутри этого элемента */
    -ms-overflow-style: none; /* Убираем полосу прокрутки в IE и Edge */
    scrollbar-width: none;
}

.popup-content > div > div::-webkit-scrollbar {
    display: none; /* Убираем полосу прокрутки в Chrome, Safari и Opera */
}

.task.completed .task-price {
    color: #00FFD1 !important;
}

.task-container.gold .task.completed::before {
    content: url("../images/completed.svg");
}

.task-container.gold .task.extra::before {
    content: url("../images/trophy.png");
}

.task-container .task:not(:last-child):not(.extra)::after {
    content: " ";
    width: 2px;
    height: 105%;
    position: absolute;
    top: 45px;
    background-color: rgba(255, 255, 255, .1);
    left: 15px;
    z-index: 0;
}

.task-container .task.active .task-description .timer-container {
    display: flex;
}

.task-container .task .task-description .timer-container {
    display: none;
}

.task-container .task.disabled > div::before {
    content: " ";
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: 0;
    top: calc(50% - 14px);
    border: 2px solid rgba(255, 255, 255, .1);
    background: rgb(73 54 231);
    z-index: 0;
}

.task-container .task.disabled::after {
    opacity: .4;
}

.task-container.gold .task.completed::before {
    margin-top: 5px;
    border: 0;
    background: unset;
}

.task-container .task.money::before {
    content: url("../images/popup-money.png");
    border: 0;
}

.task-container .task.fire::before {
    content: url("../images/fire.png");
    border: 0;
}

.task-container .task.bell::before {
    content: url("../images/bell.png");
    border: 0;
}

.task-container .task.locked::before {
    content: url("../images/locked_state.webp");
    border: 0;
}


.task-container .task.fire>div>div:first-child {
    border: 1px solid #FF8000;
    background: linear-gradient(102deg, rgba(255, 128, 0, 0.20) 7.85%, rgba(133, 72, 255, 0.20) 91.48%);
}

.task-container .task.extra>div>div {
    background: rgba(32, 1, 94, 0.60);
}

.task-container .task.extra.completed>div>div {
    background: linear-gradient(90deg, rgba(0, 255, 209, 0.36) 0%, rgba(32, 1, 94, 0.60) 100%)
}


.task-container .task.bell>div {
    height: 100%;
    display: flex;
    align-items: center;
    max-width: 420px;
    margin-left: auto;
    flex-shrink: 0;
    width: 100%;
}

/* .task-container.disabled {
    opacity: .6;
    pointer-events: none;
} */

/* .completed.disabled {
    opacity: .6;
    pointer-events: none;
} */

/* .task.locked.disabled {
    opacity: .6;
    pointer-events: none;
} */

.task.disabled > div div {
    opacity: .6;
    pointer-events: none;
}

.task.disabled::before {
    opacity: .6;
    pointer-events: none;
}

.task-container .task.bell>div>div:first-child {
    border: 1px solid #FF8000;
    margin-right: 4px;
    border-radius: 16px 2px 2px 16px !important;
    background: linear-gradient(102deg, rgba(255, 128, 0, 0.20) 7.85%, rgba(133, 72, 255, 0.20) 91.48%);

}

.task-container .task.bell>div .cf-button {
    height: 72px;
    border-radius: 2px 16px 16px 2px;
    z-index: 1;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}


@media screen and (max-width: 640px) {
    .task-container .task.bell>div .cf-button {
    }
}

.task-container .task.bell>div .cf-button>div {
    background: linear-gradient(180deg, #FFEC00 0%, #FFA100 100%);
    width: 40px;
    height: calc(100% - 4px);
    position: relative;
    z-index: 1;
    border-radius: 2px 16px 16px 2px;
}

.task-container .task.bell>div .cf-button>div span {
    background: linear-gradient(350deg, #A3560A 7.21%, #A68D0F 94.5%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.task-container .task.bell>div .cf-button::before {
    content: "";
    background-image: linear-gradient(180deg, #ccc509 0%, #c25e09 100%);
    top: -2px;
    left: -3px;
    border-radius: 2px 18px 18px 2px;
    bottom: -2px;
    right: -3px;
    position: absolute;
    z-index: 0;
}

.task-container .task .cf-button {
    display: none;
}

.task-container .task.money>div>div:first-child {
    border: 1px solid #00FFD1;
    background: linear-gradient(102deg, rgba(0, 255, 209, 0.20) 7.85%, rgba(72, 74, 255, 0.20) 91.48%);
}

.task-container.gold .task.completed::after {
    background: linear-gradient(180deg, #FFDB01 0%, rgba(255, 219, 0, 0.50) 49%, rgba(255, 246, 190, 0.10) 100%);
}

.task-container.gold .task.completed.prev::after {
    background: linear-gradient(180deg, #FFDB01 0%, rgba(255, 219, 0, 0.50) 100%, rgba(255, 246, 190, 0.10) 100%);
}

.task-container.silver .task.completed::after {
    background: linear-gradient(180deg, #FFF 0%, rgba(255, 255, 255, 0.50) 100%, rgba(255, 255, 255, 0.10) 100%) !important;
}

.task-container.silver .task.completed.prev::after {
    background: linear-gradient(180deg, #FFF 0%, rgba(255, 255, 255, 0.50) 49%, rgba(255, 255, 255, 0.10) 100%) !important;
}

/* .task-container .task:first-child:not(.completed):not(.active):not(.locked)::before {
    top: 0;
} */

.radial-bar {
    width: 120px;
    height: 120px;
    background: rgba(255, 255, 255, 0.10);
    border-radius: 50%;
    position: relative;
}

.radial-bar__mask {
    clip: rect(0px, 120px, 120px, 60px);
    -webkit-backface-visibility: hidden;
    transition: transform 1s;
    width: 120px;
    height: 120px;
    position: absolute;
    border-radius: 50%;
}

.radial-bar__fill {
    -webkit-backface-visibility: hidden;
    transition: transform 1s;
    border-radius: 50%;
    clip: rect(0px, 60px, 120px, 0px);
    background: linear-gradient(167deg, #00FFD1 12.38%, #484AFF 88.82%);
    width: 120px;
    height: 120px;
    position: absolute;
}

.radial-bar__inset {
    width: 105px;
    height: 105px;
    position: absolute;
    margin-left: 7.5px;
    margin-top: 7.5px;
    background-color: #fbfbfb;
    border-radius: 50%;
    display: table-cell;
    text-align: center;
    vertical-align: middle;
}

.radial-bar__percent {
    display: inline-block;
    color: #669900;
    font-size: 22px;
}

.nav-banner_wrap {
    position: relative;
}

.nav-banner_wrap::before {
    content: " ";
    position: absolute;
    background: linear-gradient(220deg, rgba(0, 255, 208, 0.371) 22.65%, #5429ffb0 77.35%);
    top: -1px;
    left: -1px;
    z-index: -2;
    right: -1px;
    bottom: -1px;
    border-radius: 16px;
}

.nav-banner_wrap .banner-bg {
    position: relative;
    z-index: 2;
    background: rgb(13 14 46);
    width: 100%;
    height: 100%;
    border-radius: 16px;
}


/* Progress states */


/* Regular progress */

.progress {
    background: linear-gradient(90deg, #ff6b00 0%, #ffd600 66.5%, #ebff00 98%),
    linear-gradient(95deg, #00d1ff 4.57%, #00ffd1 98.63%);
}

.progress:not(.completed)::after {
    content: url("data:image/svg+xml,%3Csvg width='17' height='16' viewBox='0 0 17 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4.33268 4.66659C4.33268 2.54949 6.04892 0.833252 8.16602 0.833252C10.2831 0.833252 11.9993 2.54949 11.9993 4.66659V5.40906C11.9993 5.4536 11.9935 5.49678 11.9826 5.53788C12.94 5.88967 13.6862 6.66204 14.0029 7.63653C14.166 8.13864 14.166 8.75906 14.166 9.99992C14.166 11.2408 14.166 11.8612 14.0029 12.3633C13.6731 13.3781 12.8775 14.1737 11.8627 14.5034C11.3606 14.6666 10.7402 14.6666 9.49935 14.6666H6.83267C5.59182 14.6666 4.9714 14.6666 4.46929 14.5034C3.4545 14.1737 2.65889 13.3781 2.32916 12.3633C2.16602 11.8612 2.16602 11.2408 2.16602 9.99992C2.16602 8.75906 2.16602 8.13864 2.32916 7.63653C2.64579 6.66204 3.39203 5.88967 4.34943 5.53788C4.33851 5.49678 4.33268 5.4536 4.33268 5.40906V4.66659ZM5.33268 5.35601C5.7125 5.33325 6.18916 5.33325 6.83268 5.33325H9.49935C10.1429 5.33325 10.6195 5.33325 10.9993 5.35601V4.66659C10.9993 3.10178 9.73082 1.83325 8.16602 1.83325C6.60121 1.83325 5.33268 3.10178 5.33268 4.66659V5.35601ZM8.16602 8.16659C8.44216 8.16659 8.66602 8.39044 8.66602 8.66659V11.3333C8.66602 11.6094 8.44216 11.8333 8.16602 11.8333C7.88987 11.8333 7.66602 11.6094 7.66602 11.3333V8.66659C7.66602 8.39044 7.88987 8.16659 8.16602 8.16659Z' fill='white'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4.33268 4.66659C4.33268 2.54949 6.04892 0.833252 8.16602 0.833252C10.2831 0.833252 11.9993 2.54949 11.9993 4.66659V5.40906C11.9993 5.4536 11.9935 5.49678 11.9826 5.53788C12.94 5.88967 13.6862 6.66204 14.0029 7.63653C14.166 8.13864 14.166 8.75906 14.166 9.99992C14.166 11.2408 14.166 11.8612 14.0029 12.3633C13.6731 13.3781 12.8775 14.1737 11.8627 14.5034C11.3606 14.6666 10.7402 14.6666 9.49935 14.6666H6.83267C5.59182 14.6666 4.9714 14.6666 4.46929 14.5034C3.4545 14.1737 2.65889 13.3781 2.32916 12.3633C2.16602 11.8612 2.16602 11.2408 2.16602 9.99992C2.16602 8.75906 2.16602 8.13864 2.32916 7.63653C2.64579 6.66204 3.39203 5.88967 4.34943 5.53788C4.33851 5.49678 4.33268 5.4536 4.33268 5.40906V4.66659ZM5.33268 5.35601C5.7125 5.33325 6.18916 5.33325 6.83268 5.33325H9.49935C10.1429 5.33325 10.6195 5.33325 10.9993 5.35601V4.66659C10.9993 3.10178 9.73082 1.83325 8.16602 1.83325C6.60121 1.83325 5.33268 3.10178 5.33268 4.66659V5.35601ZM8.16602 8.16659C8.44216 8.16659 8.66602 8.39044 8.66602 8.66659V11.3333C8.66602 11.6094 8.44216 11.8333 8.16602 11.8333C7.88987 11.8333 7.66602 11.6094 7.66602 11.3333V8.66659C7.66602 8.39044 7.88987 8.16659 8.16602 8.16659Z' fill='url(%23paint0_linear_2188_56007)'/%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear_2188_56007' x1='8.16602' y1='0.833252' x2='8.16602' y2='14.6666' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='white'/%3E%3Cstop offset='1' stop-color='%239997C2'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E%0A");
    position: absolute;
    top: calc(50% - 12px);
    right: 0px;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 2px;
    background: #4331A2;
    border-radius: 50%;
}

/* Progress competed */
.progress.completed {
    background: linear-gradient(95deg, #00d1ff 4.57%, #00ffd1 98.63%);
    position: relative;
}

.progress.completed::after {
    content: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_2188_55970)'%3E%3Cpath d='M2.5 9L6 12.5L14 4.5' stroke='%234936E7' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_2188_55970'%3E%3Crect width='16' height='16' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
    position: absolute;
    top: calc(50% - 12px);
    right: 0px;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 2px;
    background: #fff;
    border-radius: 50%;
}


/* Daily page */

/* Daily items from invite banner */


/* Non active */
.daily-item {
    content: url("data:image/svg+xml,%3Csvg width='15' height='20' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 2C9.37665 2 7.25 4.12665 7.25 6.75C7.25 9.37335 9.37665 11.5 12 11.5C14.6234 11.5 16.75 9.37335 16.75 6.75C16.75 4.12665 14.6234 2 12 2Z' fill='white' fill-opacity='0.1'/%3E%3Cpath d='M9 13C6.37665 13 4.25 15.1266 4.25 17.75C4.25 20.3734 6.37665 22.5 9 22.5H15C17.6234 22.5 19.75 20.3734 19.75 17.75C19.75 15.1266 17.6234 13 15 13H9Z' fill='white' fill-opacity='0.1'/%3E%3C/svg%3E%0A");
    width: 40px;
    padding: 6px;
    height: 40px;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, .1);
    margin-right: 8px;
}

/* Active */

.daily-item.active {
    position: relative;
    content: ' ';
    z-index: 2;
    padding: 0;
}

.daily-item.active::before {
    content: "";
    background-image: linear-gradient(180deg, #ccc509 0%, #c25e09 100%);
    top: -3px;
    left: -3px;
    border-radius: 50%;
    bottom: -3px;
    right: -3px;
    position: absolute;
    z-index: 0;
}


.daily-item.active span {
    background: linear-gradient(180deg, #ffec00 0%, #ffa100 100%);
    position: relative;
    z-index: 2;
    padding: 7px;
    content: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_2395_755)'%3E%3Cpath d='M3.125 11.25L7.5 15.625L17.5 5.625' stroke='url(%23paint0_linear_2395_755)' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/g%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear_2395_755' x1='10.3748' y1='15.6251' x2='9.18269' y2='5.55168' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23A3560A'/%3E%3Cstop offset='1' stop-color='%23A68D0F'/%3E%3C/linearGradient%3E%3CclipPath id='clip0_2395_755'%3E%3Crect width='20' height='20' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");;
    display: flex;
    width: 100%;
    height: 100%;
    border-radius: 50%;
}

/* Daily Banners */
.unlock-banner {
    justify-content: space-evenly;
    border-radius: 16px;
    background: linear-gradient(273deg, #8C4DDC -2.2%, #4936E7 90.06%);
}

/* Unlock banner */

.unlock-container .item {
    width: 48px;
    height: 48px;
    border: 2.5px solid rgba(255, 255, 255, 0.2);
    background: transparent;
    border-radius: 50%;
    margin-right: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 2;
}

.unlock-container .item::before {
    content: attr(data-count);
    color:  rgba(255, 255, 255, 0.60);
    font-size: 19.2px;
    font-weight: 600;
}

.unlock-container .item:not(:last-child):after {
    content: " ";
    width: 30%;
    height: 2px;
    background: rgba(255, 255, 255, 0.2);
    position: absolute;
    right: -35%;
    z-index: 0;
}

.unlock-container .item.completed.prev:after {
    background: linear-gradient(90deg, #FFDB01 0%, rgba(255, 219, 0, 0.50) 49%, rgba(255, 246, 190, 0.10) 100%);

}

.unlock-container .item.completed:not(.prev):after {
    background: linear-gradient(90deg, #FFEC00 0%, #FFA100 100%);

}

.unlock-container .item.completed {
    border: 0;
    position: relative;
    width: 40px;
    height: 40px;
    margin-bottom: -5px;
}

.unlock-container .item.completed span {
    background: linear-gradient(180deg, #ffec00 0%, #ffa100 100%);
    position: relative;
    z-index: 2;
    padding: 7px;
    content: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_2395_755)'%3E%3Cpath d='M3.125 11.25L7.5 15.625L17.5 5.625' stroke='url(%23paint0_linear_2395_755)' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/g%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear_2395_755' x1='10.3748' y1='15.6251' x2='9.18269' y2='5.55168' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23A3560A'/%3E%3Cstop offset='1' stop-color='%23A68D0F'/%3E%3C/linearGradient%3E%3CclipPath id='clip0_2395_755'%3E%3Crect width='20' height='20' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");;
    display: flex;
    width: 100%;
    height: 100%;
    border-radius: 50%;
}

.unlock-container .item.completed::before {
    content: "";
    background-image: linear-gradient(180deg, #ccc509 0%, #c25e09 100%);
    top: -2px;
    left: -2px;
    border-radius: 50%;
    bottom: -2px;
    right: -2px;
    position: absolute;
    z-index: 0;

}


.bubble-bg {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.20) 0%, rgba(255, 255, 255, 0.06) 100%)
}

.dropdown-menu {
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.5s ease, visibility 0.5s ease;
}

.dropdown-menu.visible {
    opacity: 1;
    visibility: visible;
}

.dropdown-menu::before {
    content: " ";
    width: 100%;
    height: 20px;
    position: absolute;
    top: -20px;
    left: 0;
}

.open-menu:hover + .dropdown-menu,
.dropdown-menu:hover {
    opacity: 1;
    visibility: visible;
}

/* Scrollable menu */
.scrollable {
    cursor: pointer;
    overflow: scroll;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none; /* Отключить выделение текста */
}

.scrollable img {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    -webkit-user-drag: none;
}

.scrollable:active {
    cursor: grabbing;
}
@media screen and (max-width: 768px) {
    .dashboard-animation {
        animation: none;
        width: 700px;
        height: 700px;
        top: 200px;
        right: -160px;
    }
}


/* Daily surprise */

#inviteBlock {
    visibility: visible;
    opacity: 1;
    transition: .3s;
}

.daily-surprise  .locked-items {
    display: none;
}

.daily-surprise.locked {
    overflow: hidden;
}
.daily-surprise.locked  .locked-items{
    display: flex;
    flex-direction: column;
    border-radius: 32px;
    background: linear-gradient(180deg, #180147 16.5%, rgba(32, 1, 94, 0.60) 100%);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);

}


/* Dashboard Frow */
.flow-popup {
    display: none;
}

.flow-popup.active {
    display: flex;
}

.balance.flow.active{
    box-shadow: 0px 16px 32px 0px #00FFD1;
}

.balance.flow.active > .tooltip {
    display: flex;
}

.balance.flow > .tooltip {
    display: none;
}




.cashout-link.active::after {
    border-radius: 100px;
    background: #00FFD1;
    filter: blur(16px);
    position: absolute;
    content:  " ";
    width: 50px;
    height: 50px;
    right: -20px;
    top: 0;
}


@media screen and (max-width: 768px) {
    .cashout-link::after {
        top: -40px;
        left: calc(50% - 25px);
    }

    .cashout-link.active::after  {
        top: -30px;
    }


}


.card-tool.active::after {
    border-radius: 16px;
    background: #00FFD1;
    filter: blur(32px);
    content:  " ";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
}

.cashout-link-tooltip {
    display: none;
}

.cashout-link-tooltip.active {
    display: flex;
    z-index: 52;
}

.card-tooltip {
    display: none;
}

.card-tooltip.active {
    display: flex;
}

.claim-popup {
    display: none;
}

.claim-popup.active {
    display: flex;
}


.general-black-bg {
    display: none;
}

.general-black-bg.active {
    display: flex;
}


.receive-popup {
    display: none;
}

.receive-popup.active {
    display: flex;
}


.increase-popup {
    display: none;
}

.increase-popup.active {
    display: flex;
}

#heroCardsContainer {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    grid-template-rows: repeat(3, auto);
    grid-template-areas: ". card1 card2 card3 ." "card4 card5 card6 card7 card8" ". card9 card10 card11 card12";
    gap: 6px;
    width: 772px;
    transform: rotate(-20deg);
    -webkit-transform: rotate(-20deg);
    -moz-transform: rotate(-20deg);
    -ms-transform: rotate(-20deg);
    -o-transform: rotate(-20deg);
}

.card.card13,
.card.card4 {
    transform: translateY(100px);
    -webkit-transform: translateY(100px);
    -moz-transform: translateY(100px);
    -ms-transform: translateY(100px);
    -o-transform: translateY(100px);
}

.card.card1,
.card.card5,
.card.card9 {
    transform: translateY(-70px);
    -webkit-transform: translateY(-70px);
    -moz-transform: translateY(-70px);
    -ms-transform: translateY(-70px);
    -o-transform: translateY(-70px);
}

.card.card3,
.card.card7,
.card.card11 {
    transform: translateY(100px);
    -webkit-transform: translateY(100px);
    -moz-transform: translateY(100px);
    -ms-transform: translateY(100px);
    -o-transform: translateY(100px);
}

.card.card12,
.card.card8 {
    transform: translateY(-140px);
    -webkit-transform: translateY(-140px);
    -moz-transform: translateY(-140px);
    -ms-transform: translateY(-140px);
    -o-transform: translateY(-140px);
}

.card {
    width: 125px;
    background: #20015E4D;
    border-radius: 0.75rem;
    padding: 0.5rem;
    height: 210px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.card.var {
    text-align: unset;
    align-items: flex-start;
}

.card.var .amount {
    font-weight: 700;
}

.card.boost-style {
    background-image: url("../images/card-bg.webp");
    background-position: center;
    background-size: cover;
}



@media screen and (max-width: 391px) {
    .fixed .button-wrap span {
        width: 42px;
    }
}

/* .card.boost-style::before {
    content: " ";
    width: 102%;
    height: 101%;
    position: absolute;
    top: -2px;
    right: -2px;
    background: linear-gradient(358deg, #321582 0%, #BB00FD 60%, #FFAA00 100%, #FFE101 100%);
    border-radius: 12px;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    -ms-border-radius: 12px;
    z-index: -2;
    -o-border-radius: 12px;
} */


/* .card.boost-style::after {
    content: " ";
    width: 100%;
    height: 100%;
    background: #4936E7;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 12px;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    -ms-border-radius: 12px;
    z-index: -1;
    -o-border-radius: 12px;
} */

.card.boost-style {
    border-radius: 12.5px;
    position: absolute;
    z-index: 2 !important;
}

.card1 {
    grid-area: card1;
}

.card2 {
    grid-area: card2;
}

.card3 {
    grid-area: card3;
}

.card4 {
    grid-area: card4;
}

.card5 {
    grid-area: card5;
}

.card6 {
    grid-area: card6;
}

.card7 {
    grid-area: card7;
}

.card8 {
    grid-area: card8;
}

.card9 {
    grid-area: card9;
}

.card10 {
    grid-area: card10;
}

.card11 {
    grid-area: card11;
}

.card12 {
    grid-area: card12;
}


/* Offers popup  */

#offerPopup {
    /* visibility: hidden; */
    /* opacity: 0; */
    transition: .3s;
}

#offerPopup.active {
    visibility: visible;
    opacity: 1;
}


.refresh {
    /* visibility: hidden; */
    opacity: 0;
    position: absolute;
    left: 2px;
    top: 2px;
    transition: opacity .2s;
}

.refresh-container img:hover, .refresh-container:hover {
    cursor: pointer;
}

.refresh-container img {
    transition: .2s;
}

/* Daily animation styles */
#gift, #coin {
    transition: all 0.5s ease;
}

@keyframes scaleDown {
    0% {
        transform: scale(1) translateY(0px);
        opacity: 1;
    }
    100% {
        transform: scale(0) translateY(600px); /* Adjust translateY as needed */
        opacity: 0;
    }
}

#gift {
    transition: transform 0.5s ease, opacity 0.5s ease;
    position: relative;
    z-index: 1;
}

#coin {
    /* visibility: hidden; */
    /* opacity: 0; */
    /* transform: scale(0); */
    z-index: 0;
    transform: scale(0.5) translateY(50px);
    transition: all 0.5s ease;
    opacity: 0;
}

.claim-btn {
    display: none;
    visibility: hidden;
    opacity: 0;
    transition: all 0.5s ease;
}



/* Daily actions */
#daily_claim_popup, #daily_success_popup {
    visibility:hidden;
    opacity: 0;
    transition: all .3s;
}

button.disabled-new.disabled {
    cursor: not-allowed !important;
}

.loader-user {
    width: 24px;
    height: 24px;
    border: 3px solid black;
    border-bottom-color: transparent;
    border-radius: 50%;
    display: inline-block;
    box-sizing: border-box;
    animation: rotation-loader-user 1s linear infinite;
}

.loader-history {
    width: 24px;
    height: 24px;
    border: 3px solid #fff;
    border-bottom-color: transparent;
    border-radius: 50%;
    display: inline-block;
    box-sizing: border-box;
    animation: rotation-loader-user 1s linear infinite;
}

.loader-history#claim-loading-icon {
    width: 24px;
    height: 24px;
    border: 3px solid black;
    border-bottom-color: transparent;
    border-radius: 50%;
    display: inline-block;
    box-sizing: border-box;
    animation: rotation-loader-user 1s linear infinite;
}

.remove-loader {
    display: none;
}

@keyframes rotation-loader-user {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

div.progress.green {
    background: linear-gradient(95deg, #00d1ff 4.57%, #00ffd1 98.63%);
}

.gbtn-modify {
    display: grid !important;
    margin: 0 !important;
    padding: 0 !important;
    color-scheme: light !important;
}

.purple-background {
    background-color: #1f025e !important;
}

.about-section-below {
    margin-top: 1.3rem;
}

.mt-4 {
    margin-top: 1rem;
}

a.disabled-link {
    pointer-events: none;
    cursor: pointer;
}

.offer-cf > div {
    position: relative;
    background: linear-gradient(180deg, #FFEC00 7.21%, #FFA100 94.5%);

    z-index: 2;
    border-radius: 0px 14px 0px 12px;
}

.offer-cf.gold span {
    line-height: 100%;
    background: linear-gradient(350deg, #A3560A 7.21%, #A68D0F 94.5%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}


.offer-cf.silver::before {
    content: "";
    background: linear-gradient(180deg, #BFC1C4 0%, #4F5863 100%);
    top: 0px;
    left: -5px;
    bottom: -5px;
    right: -2px;
    position: absolute;
    z-index: 0;
    border-radius: 0 16px;
}

.offer-cf.silver > div {
    position: relative;
    background: linear-gradient(180deg, #CAD2DB 7.21%, #EBF4FF 7.5%,  #7E8EA0 94.5%);

    z-index: 2;
    border-radius: 0px 14px 0px 12px;
}

.offer-cf.silver span {
    line-height: 100%;
    background: linear-gradient(180deg, #BFC1C4 0%, #4F5863 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.offer-cf.purple::before {
    content: "";
    background: linear-gradient(180deg, #B351C3 0%, #6224A1 100%);
    top: 0px;
    left: -5px;
    bottom: -5px;
    right: -2px;
    position: absolute;
    z-index: 0;
    border-radius: 0 16px;
}

.offer-cf.purple > div {
    position: relative;
    background: linear-gradient(180deg, #FAB0FF 0%, #B85EFF 100%);
    z-index: 2;
    border-radius: 0px 14px 0px 12px;
    display: flex;
    align-items: center;
}

.offer-cf.purple span {
    line-height: 100%;
    background: linear-gradient(180deg, #B351C3 0%, #6224A1 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.reward-coin::before {
    content: "";
    background: linear-gradient(180deg, #CCC509 0%, #C25E09 100%);
    top: -9px;
    left: -9px;
    bottom: -9px;
    right: -9px;
    position: absolute;
    z-index: 0;
    border-radius: 50%;
}

.reward-coin > div {
    position: relative;
    background: linear-gradient(180deg, #FFEC00 0%, #FFA100 100%);
    z-index: 2;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

.reward-coin > div > span {
    line-height: 100%;
    background: linear-gradient(180deg, #A3560A 0%, #A68D0F 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-align: center;
    font-size: 38.4px;
    font-weight: 700;
    line-height: 51.217px; /* 133.377% */
    letter-spacing: -1.92px;
    text-align: center;
}

@media (min-width: 200px) and (max-width: 767px) {
    img.mobile-image {
        max-width: none !important;
    }

    .mid-align {
        margin-right: 0.75rem;
    }
}

@media (min-width: 1023px){
    #hide-mobile-img {
        display: none;
    }
}

@media (min-width: 200px) and (max-width: 390px) {
    .refresh-container {
        padding-right: 1rem !important;
    }
}

@media (min-width: 485px) and (max-width: 767px) {
    #adjust-ipad-sizes {
        height: 33%;
        object-fit: cover;
    }
}

@-webkit-keyframes loading {
    from {
        -webkit-transform: rotate(0deg);
    }
    to {
        -webkit-transform: rotate(360deg);
    }
}
@-moz-keyframes loading {
    from {
        -moz-transform: rotate(0deg);
    }
    to {
        -moz-transform: rotate(360deg);
    }
}

.rotating-continuous {
    -webkit-animation: loading 1s linear infinite;
    -moz-animation: loading 1s linear infinite;
}

.w-\[325px\]{
    width: 325px;
}

.item.s {
    justify-content: space-around;
}

@media screen and (max-height: 720px) {
    .withdraw-popup > div {
        height: 100%;
        overflow: scroll;
    }
}

@-webkit-keyframes fadein {
    from {bottom: -100px; opacity: 0;}
    to {bottom: 0; opacity: 1;}
}

@-moz-keyframes fadein {
    from {bottom: -100px; opacity: 0;}
    to {bottom: 0; opacity: 1;}
}

@keyframes fadein {
    from {bottom: -100px; opacity: 0;}
    to {bottom: 0; opacity: 1;}
}

@-webkit-keyframes fadeout {
    from {bottom: 0; opacity: 1;}
    to {bottom: -100px; opacity: 0;}
}

@-moz-keyframes fadeout {
    from {bottom: 0; opacity: 1;}
    to {bottom: -100px; opacity: 0;}
}

@keyframes fadeout {
    from {bottom: 0; opacity: 1;}
    to {bottom: -100px; opacity: 0;}
}

#custom_popup_purple.show-popup {
    visibility: visible;
    opacity: 1;
    -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
    animation: fadein 0.5s, fadeout 0.5s 2.5s;
}

@media screen and (max-width: 767px) {
    #custom_popup_purple {
        width: 100%;
        justify-content: center;
        padding: 0;
        padding-bottom: 6rem !important;
        margin: 0;
    }
}

@media (min-width: 768px) {
    div.unlock-banner {
        width: 100% !important;
        height: max-content !important;
    }
}

.gap-4 {
    gap: 1rem;
}

.avg-time-tracker {
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    border-radius: 0.5rem;
    padding: 0.5rem 1rem;
    background-color: rgb(73 54 231);
    margin-top: 0.8rem;
    width: 100%;
}

.small-clock {
    margin-right: 0.6rem;
    height: 70%;
}

.flex-small-row {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}

.side-ways {
    display: flex;
    gap: 0.3rem;
}

.left-minus {
    margin-left: -1rem;
}

@media (min-width: 0px) and (max-width: 460px) {
    #email-login-box {
        width: 80%;
    }

    #login-password,
    #login-email,
    #login-name {
        width: 100%;
    }

    #login-pass-btn {
        width: 100%;
    }

    i.inside-icon {
        position: relative;
        top: 2rem;
        right: 40%;
    }

    p.warning-text {
        margin-top: 0.5rem;
    }
}

@media (min-width: 461px) and (max-width: 700px) {
    #email-login-box {
        width: 60%;
    }

    #login-password,
    #login-email,
    #login-name {
        width: 100%;
    }

    #login-pass-btn {
        width: 100%;
    }

    i.inside-icon {
        position: relative;
        top: 2rem;
        right: 42%;
    }

    p.warning-text {
        margin-top: 0.5rem;
    }
}

@media (min-width: 701px) and (max-width: 1023px) {
    #email-login-box {
        width: 45%;
    }

    #login-password,
    #login-email,
    #login-name {
        width: 100%;
    }

    #login-pass-btn {
        width: 100%;
    }

    i.inside-icon {
        position: relative;
        top: 2rem;
        right: 43%;
    }

    p.warning-text {
        margin-top: 0.5rem;
    }
}

@media (min-width: 1024px) and (max-width: 4000px) {
    #login-password,
    #login-email,
    #login-name {
        width: 140%;
    }

    #login-pass-btn {
        width: 140%;
    }

    i.inside-icon {
        position: relative;
        top: 2.1rem;
        left: 1rem;
    }

    p.warning-text {
        margin-top: 0.5rem;
    }
}

/* customizable snowflake styling */
.snowflake {
    color: #fff !important;
    font-size: 1em;
    text-shadow: 0 0 1px #000;
}

@-webkit-keyframes snowflakes-fall{0%{top:-10%}100%{top:100%}}@-webkit-keyframes snowflakes-shake{0%{-webkit-transform:translateX(0px);transform:translateX(0px)}50%{-webkit-transform:translateX(80px);transform:translateX(80px)}100%{-webkit-transform:translateX(0px);transform:translateX(0px)}}@keyframes snowflakes-fall{0%{top:-10%}100%{top:100%}}@keyframes snowflakes-shake{0%{transform:translateX(0px)}50%{transform:translateX(80px)}100%{transform:translateX(0px)}}.snowflake{position:fixed;top:-10%;z-index:9999;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:default;-webkit-animation-name:snowflakes-fall,snowflakes-shake;-webkit-animation-duration:10s,3s;-webkit-animation-timing-function:linear,ease-in-out;-webkit-animation-iteration-count:infinite,infinite;-webkit-animation-play-state:running,running;animation-name:snowflakes-fall,snowflakes-shake;animation-duration:10s,3s;animation-timing-function:linear,ease-in-out;animation-iteration-count:infinite,infinite;animation-play-state:running,running}.snowflake:nth-of-type(0){left:1%;-webkit-animation-delay:0s,0s;animation-delay:0s,0s}.snowflake:nth-of-type(1){left:10%;-webkit-animation-delay:1s,1s;animation-delay:1s,1s}.snowflake:nth-of-type(2){left:20%;-webkit-animation-delay:6s,.5s;animation-delay:6s,.5s}.snowflake:nth-of-type(3){left:30%;-webkit-animation-delay:4s,2s;animation-delay:4s,2s}.snowflake:nth-of-type(4){left:40%;-webkit-animation-delay:2s,2s;animation-delay:2s,2s}.snowflake:nth-of-type(5){left:50%;-webkit-animation-delay:8s,3s;animation-delay:8s,3s}.snowflake:nth-of-type(6){left:60%;-webkit-animation-delay:6s,2s;animation-delay:6s,2s}.snowflake:nth-of-type(7){left:70%;-webkit-animation-delay:2.5s,1s;animation-delay:2.5s,1s}.snowflake:nth-of-type(8){left:80%;-webkit-animation-delay:1s,0s;animation-delay:1s,0s}.snowflake:nth-of-type(9){left:90%;-webkit-animation-delay:3s,1.5s;animation-delay:3s,1.5s}
/* customizable snowflake styling */

.veriff-description {
    color: white !important;
}

.veriff-description a {
    color: #ffa100 !important;
    text-decoration: underline;
}

#veriff-submit-btn {
    background-color: white;
    border-radius: 5rem;
    color: black;
    font-weight: bold;
}

#veriff-given-name:-webkit-autofill,
#veriff-given-name:-webkit-autofill:hover,
#veriff-given-name:-webkit-autofill:focus,
#veriff-given-name:-webkit-autofill:active {
    background-color: black !important;
    color: white !important;
}

#veriff-last-name:-webkit-autofill,
#veriff-last-name:-webkit-autofill:hover,
#veriff-last-name:-webkit-autofill:focus,
#veriff-last-name:-webkit-autofill:active {
    background-color: black !important;
    color: white !important;
}

@media (min-width: 481px) and (max-width: 528px) {
    .verif-popup-warn {
        width: 400px;
        height: 500px;
        margin-bottom: -15rem;
        margin-left: 25%;
    }
}

@media (min-width: 382px) and (max-width: 480px) {
    .verif-popup-warn {
        width: 400px;
        height: 450px;
        margin-bottom: -14rem;
        margin-left: 25%;
    }
}

@media (min-width: 0px) and (max-width: 381px) {
    .verif-popup-warn {
        width: 400px;
        height: 500px;
        margin-bottom: -15rem;
        margin-left: 25%;
        margin-top: -35%;
    }
}

@media (min-width: 529px) and (max-width: 4000px) {
    .verif-popup-warn {
        margin-bottom: -15rem; margin-left: 7rem
    }
}

.banner-qrcode {
    justify-items: center;
    padding-right: 0;
    width: 100%;
    cursor: pointer;
}

@media (min-width: 0px) and (max-width: 767px) {
    .banner-qrcode {
        justify-items: center;
        padding-right: 0.25rem;
        padding-left: 0.25rem;
        width: 100%;
        padding-top: 0;
        cursor: pointer;
    }
}

div.unlock-banner-iapv.unlock-banner {
    justify-content: space-evenly;
    border-radius: 16px;
    background: rgb(32 1 94 / 0.1);
}

:root {
    --white-100: #fff;
    --bc-blue-100: #20015E;
}

.modal {
    background: rgba(0, 0, 0, 0.80);
    backdrop-filter: blur(6px);
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;

    z-index: 50;
}

.jackpot-modal, .earnMore-modal, .canPayout-modal {
    display: none;
}

.jackpot-modal__container,
.best-offer-modal__container {
    max-width: 390px;
    border-radius: 32px;
    background: var(--popup-bg, #4936E7);
    padding: 16px;
    position: relative;
    box-sizing: border-box;
    padding-top: 185px;
    overflow: hidden;
}


.jackpot-modal__container .jackpot-modal__title {
    color: var(--white-100, #FFF);
    font-family: "Golos Text";
    font-size: 20px;
    font-weight: 700;
    line-height: 32px;
    margin-bottom: 8px;
}

.jackpot-modal__container .jackpot-modal__text {
    color: var(--white-100, #FFF);
    opacity: .9;
    font-family: "Golos Text";
    font-size: 15px;
    line-height: 20px;
    margin-bottom: 24px;
}

.jackpot-modal__container .jackpot-modal__button {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 24px;
    gap: 8px;
    border-radius: 48px;
    background: var(--white-100, #FFF);
    color: var(--bc-blue-100, #20015E);
    text-align: center;
    font-family: "Golos Text";
    font-size: 18px;
    font-weight: 600;
    line-height: 24px;
    width: 100%;
}

.jackpot-modal__container .jackpot-modal__image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}

.jackpot-modal__close {
    border-radius: 100px;
    background: var(--white-10, rgba(255, 255, 255, 0.10));
    backdrop-filter: blur(16px);
    position: absolute;
    right: 16px;
    top: 16px;
    padding: 8px;
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.jackpot-modal__close:hover {
    cursor: pointer;
}

/* Best offers modal */
.best-offer-modal__container {
    padding: 24px 16px;
    width: 100%;
    max-height: 700px;
    overflow-y: scroll;
    scrollbar-width: none;
    -ms-overflow-style: none;
    position: relative;
}

.best-offer-modal__container::-webkit-scrollbar {
    display: none;
}

.best-offer-modal__container .bof-banner {
    padding: 0 16px 16px 16px;
    display: flex;
    flex-direction: column;
    border-radius: 24px;
    background: var(--bc-blue-100, #20015E);
    padding-top: 116px;
    background-position: top center;
    background-size: contain;
    background-repeat: no-repeat;
}

.best-offer-modal .best-offer-modal__container .bof-banner {
    background-image: url(./images/bof-banner-bg1.jpg);
}

.best-offer-modal.v2 .best-offer-modal__container .bof-banner,
.best-offer-modal.v3 .best-offer-modal__container .bof-banner {
    background-image: url(./images/bof-banner-bg2.png);
}

.best-offer-modal__container .title {
    color: var(--white-100, #FFF);
    text-align: center;
    font-family: "Golos Text";
    font-size: 16px;
    font-weight: 700;
    line-height: 20px;
    /* 125% */
    margin-bottom: 8px;
}

.best-offer-modal__container .timer-container {
    display: flex;
    align-items: center;
    gap: 12px;
    justify-content: center;
}

.best-offer-modal__container .timer-container span {
    color: rgba(255, 255, 255, 0.60);
    text-align: center;
    font-family: "Golos Text";
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    /* 142.857% */
}


.best-offer-modal__container .timer-container .timer-bof {
    display: flex;
    align-items: center;
    gap: 8px;
    border-radius: 12px;
    background: var(--white-10, rgba(255, 255, 255, 0.10));
    display: flex;
    padding: 8px 12px;
}

.best-offer-modal__container .timer-container .timer-bof div span {
    color: var(--white-100, #FFF);
    font-family: "Golos Text";
    font-size: 20px;
    font-weight: 400;
    line-height: 20px;
    /* 100% */
}


.best-offer-modal__container .recommended-offers {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 24px;
    border-radius: 100px;
    background: linear-gradient(91deg, #24006D -0.32%, rgba(32, 1, 94, 0.30) 100%);
    padding: 8px 8px 8px 16px;
}

.best-offer-modal__container .recommended-offers span {
    font-family: "Golos Text";
    font-size: 20px;
    font-weight: 700;
    line-height: 32px;
    background: var(--card-gold-bg, linear-gradient(180deg, #FFEC00 0%, #FFA100 100%));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.best-offer-modal .best-offer-modal__container .bof-offers__container {
    margin-top: 12px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 8px;
    row-gap: 12px;
}


.best-offer-modal__container .bof-offers__container>div {
    max-width: unset;
    width: 100%;

}

.best-offer-modal.v2 .best-offer-modal__container .bof-offers__container>div {
    gap: 16px;
    height: fit-content;
}

.best-offer-modal.v3 .best-offer-modal__container .bof-offers__container>div {
    gap: 16px;
    height: fit-content;
}


.best-offer-modal__container .bof-offers__container>div img {
    width: 100%;
}

.best-offer-modal .best-offer-modal__container .bof-offers__container>div .button-v2 {
    display: none;
}

.best-offer-modal.v2 .best-offer-modal__container .bof-offers__container>div .button-v2 {
    all: unset;
    display: flex;
    height: 56px !important;
    align-items: center;
}

.best-offer-modal.v2 .best-offer-modal__container .bof-offers__container {
    grid-template-columns: 1fr;
}

.best-offer-modal.v2 .best-offer-modal__container .bof-offers__container .offer-info {
    display: flex !important;
    align-items: center;
    gap: 16px;
}


.best-offer-modal.v2 .best-offer-modal__container .bof-offers__container div img {
    width: 145px;
    height: 145px;
}

.best-offer-modal.v2 .best-offer-modal__container .bof-offers__container div .button-wrap {
    height: 45px;
}

.best-offer-modal.v2 .best-offer-modal__container .bof-offers__container div .bubble-bg {
    width: 100%;
}

.best-offer-modal.v2 .best-offer-modal__container .bof-offers__container div .price,
.best-offer-modal.v2 .best-offer-modal__container .bof-offers__container div .offer-cf {
    display: none;
}

.best-offer-modal.v2 .best-offer-modal__container .bof-offers__container div .title {
    color: var(--white-90, rgba(255, 255, 255, 0.90));
    font-family: "Golos Text";
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 32px;
    margin-bottom: 8px;
    white-space: unset !important;
}

.best-offer-modal .best-offer-modal__container .bof-offers__container div .title {
    text-align: left;
}

.best-offer-modal.v2 .best-offer-modal__container .bof-offers__container div .text {
    margin-bottom: 0;
}

.best-offer-modal.v3 .best-offer-modal__container .bof-offers__container>div .button-v2 {
    display: none;
}

.best-offer-modal:not(.v3) .best-offer-modal__container .bof-offers__container>div .button-v3 {
    display: none;
}

.best-offer-modal.v3 .best-offer-modal__container .bof-offers__container>div .button-v3 {
    display: flex;
    align-items: center;
    gap: 8px;
    border-radius: 48px;
    background: var(--white-100, #FFF);
    display: flex;
    padding: 12px 24px;
    justify-content: center;
    align-items: center;
}

.best-offer-modal.v3 .best-offer-modal__container .bof-offers__container>div .button-v3 {
    color: var(--bc-blue-100, #20015E);
    text-align: center;
    font-family: "Golos Text";
    font-size: 18px;
    font-weight: 600;
    line-height: 24px;
    /* 133.333% */
}

.best-offer-modal.v3 .best-offer-modal__container .bof-offers__container {
    grid-template-columns: 1fr;
}

.best-offer-modal.v3 .best-offer-modal__container .bof-offers__container .offer-info {
    display: flex !important;
    align-items: center;
    gap: 16px;
}


.best-offer-modal.v3 .best-offer-modal__container .bof-offers__container div img {
    width: 145px;
    height: 145px;
}

.best-offer-modal.v3 .best-offer-modal__container .bof-offers__container div .button-wrap {
    height: 45px;
}

.best-offer-modal.v3 .best-offer-modal__container .bof-offers__container div .bubble-bg {
    width: 100%;
}

.best-offer-modal.v3 .best-offer-modal__container .bof-offers__container div .price,
.best-offer-modal.v3 .best-offer-modal__container .bof-offers__container div .offer-cf {
    /* display: none; */
    font-size: 18px;
}

.best-offer-modal.v3 .best-offer-modal__container .bof-offers__container div .offer-text,
.best-offer-modal.v3 .best-offer-modal__container .bof-offers__container div .offer-cf {
    display: none;
}

.best-offer-modal.v3 .best-offer-modal__container .bof-offers__container div .title {
    color: var(--white-90, rgba(255, 255, 255, 0.90));
    font-family: "Golos Text";
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 32px;
    margin-bottom: 8px;
    white-space: unset !important;
}

.best-offer-modal .best-offer-modal__container .bof-offers__container div .title {
    text-align: left;
}

.best-offer-modal.v2 .best-offer-modal__container .bof-offers__container div .text {
    margin-bottom: 0;
}

.offer-odds {
    border-radius: 32px;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.20) 100%), linear-gradient(180deg, #FFEC00 0%, #FFA100 100%);
    background-blend-mode: overlay, normal;
    display: flex;
    padding: 6px 12px;
    align-items: center;
    gap: 4px;
    max-width: 125px;
    display: none;
}

.best-offer-modal.v2 .best-offer-modal__container .bof-offers__container div .offer-odds {
    display: flex;
}

.best-offer-modal.v2 .best-offer-modal__container .bof-offers__container div .offer-odds img {
    width: 24px;
    height: 24px;
}

.best-offer-modal.v2 .best-offer-modal__container .bof-offers__container div .offer-odds span {
    background: var(--card-gold-text, linear-gradient(350deg, #A3560A 7.21%, #A68D0F 94.5%));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-family: "Golos Text";
    font-size: 14px;
    font-weight: 700;
    line-height: 20px;
    letter-spacing: 0.14px;
    margin-bottom: 4px;
}

.best-offer-modal.v3 .best-offer-modal__container .bof-offers__container div .text {
    margin-bottom: 0;
}


.best-offer-modal.v3 .best-offer-modal__container .bof-offers__container div .offer-odds {
    display: flex;
}

.best-offer-modal.v3 .best-offer-modal__container .bof-offers__container div .offer-odds img {
    width: 24px;
    height: 24px;
}

.best-offer-modal.v3 .best-offer-modal__container .bof-offers__container div .offer-odds span {
    background: var(--card-gold-text, linear-gradient(350deg, #A3560A 7.21%, #A68D0F 94.5%));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-family: "Golos Text";
    font-size: 14px;
    font-weight: 700;
    line-height: 20px;
    letter-spacing: 0.14px;
    margin-bottom: 4px;
}


.best-offer-modal.v3 .offer-btn {
    display: none;
}

.best-offer-modal {
    display: none;
}

/* Coins rewards */
.coins-reward-section {
    margin: 16px 40px;
    border-radius: 16px;
    background: var(--bc-blue-60, rgba(32, 1, 94, 0.60));
    padding: 0 12px;
    max-width: 350px;
    width: 100%;
}

.coins-reward-section:not(.v2) .banner-img {
    display: none;
}


.coins-reward-section.v2 {
    display: flex;
    align-items: center;
    padding-left: 100px;
    position: relative;
    padding-top: 12px;
    padding-bottom: 12px;
    overflow: hidden;
    max-height: 80px;
}

.coins-reward-section.v2 .banner-img {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    max-width: 90px;
}

.coins-reward-section .crs__container {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding: 6px 0;
    gap: 8px
}

.coins-reward-section .crs__container .title {
    display: flex;
    align-items: center;
    gap: 4px;
    color: var(--white-100, #FFF);
    font-family: "Golos Text";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}

.coins-reward-section .crs__container .title span.bold {
    font-weight: 700;
}

.coins-reward-section .crs__container .title img {
    width: 16px;
    height: 16px;
}

.progress-container {
    position: relative;
    width: 100%;
    height: 12px;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.10);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
    margin-bottom: 6px;
}

.progress-bar {
    height: 12px;
    border-radius: 16px;
    background: var(--card-progress-orange, linear-gradient(90deg, #FFD600 0%, #FF6B00 100%));
    width: 0;
    transition: width 0.4s ease;
}

.progress-bar.filled {
    background: var(--card-progress-green, linear-gradient(95deg, #00D1FF 4.57%, #00FFD1 98.63%));
}


.progress-container .coin {
    border-radius: 100px;
    border-radius: 13.998px;
    background: linear-gradient(180deg, #CCC509, #C25E09);
    width: 28px;
    height: 28px;
    padding: 3px;
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}

.progress-container .coin::before {
    content: " ";
    width: 24px;
    height: 24px;
    border-radius: 100%;
    background: var(--card-gold-bg, linear-gradient(180deg, #FFEC00 0%, #FFA100 100%));
    display: flex;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
}

.progress-container .coin span {
    position: relative;
    z-index: 5;
    background: var(--card-gold-text, linear-gradient(350deg, #A3560A 7.21%, #A68D0F 94.5%));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-family: "Golos Text";
    font-size: 16px;
    font-weight: 700;
    line-height: 100%; /* 75% */
}



/* Earn More modal */
.earnMore-modal .jackpot-modal__container{
    padding-top: 270px;
}



/* choose game modal */
.choose-modal .jackpot-modal__container{
    max-height: 700px;
    max-width: 500px;
    height: 100%;
    width: 100%;
    overflow: hidden;
    position: relative;
    padding-top: 150px;
}

.choose-modal.v2 .jackpot-modal__container {
    padding-top: 24px;
}


.choose-modal.v2 .jackpot-modal__container .jackpot-modal__image {
    display: none;
}



.choose-modal .jackpot-modal__title {
    font-size: 24px;
}

.choose-modal .cg-action {
    position: absolute;
    bottom: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 16px;
    border-radius: 0px 0px 32px 32px;
    background: var(--popup-bg, #4936E7);
}

.choose-modal .game-container {
    display: flex;
    flex-direction: column;
    gap: 4px;
    overflow-y: scroll;
    padding-bottom: 170px;
    height: -webkit-fill-available;
    scrollbar-width: none;
}

.choose-modal .game-container::-webkit-scrollbar {
    display: none;
}

.choose-modal .game-container .game-item {
    padding: 12px 16px;
    border-radius: 32px;
    background: rgba(255, 255, 255, 0.10);
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: var(--white-90, rgba(255, 255, 255, 0.90));
    font-family: "Golos Text";
    font-size: 16px;
    font-weight: 400;
    line-height: 20px; /* 125% */
    transition: .2s;
    border: 1px solid transparent;

}

.choose-modal .game-container .game-item.choosed {
    border-radius: 32px;
    border: 1px solid #00FFD1;
    background: rgba(0, 255, 209, 0.20);

}

.choose-modal .game-container .game-item img {
    transition: .3s;
}

.choose-modal .game-container .game-item:not(.choosed) img {
    opacity: 0;
    visibility: hidden;
}

/* Responsive */

@media screen and (max-width: 768px) {
    .coins-reward-section {
        margin-left: 12px;
    }
}


@media screen and (max-width: 540px) {
    .coins-reward-section{
        max-width: 94%;
    }

    .choose-modal .jackpot-modal__container {
        max-width: 100%;
        max-height: 100%;
    }
}

@media screen and (max-width: 430px) {
    .coins-reward-section{
        max-width: 94%;
    }

    .jackpot-modal__container, .best-offer-modal__container{
        max-width: 350px;
    }

    .earnMore-modal .jackpot-modal__container{
        padding-top: 230px;
    }
}

.bg-premium-blue-card {
    background-image: url("../assets/bc-card-bg.png")
}

.bg-cover {
    background-size: cover
}