@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Rubik:ital,wght@0,300..900;1,300..900&display=swap');

:root {
	--ui-colors-white: #fff;
	--ui-colors-white-80: rgba(255, 255, 255, 0.08);
	--ui-colors-text-2: #869cb9;
	--ui-colors-text-3: #233042;
	--ui-colors-black-1: #1b2738;
	--ui-colors-black: #101721;
	--main-colors-blue: #00a9f5;
	--main-colors-gold: #ffcd62;
	--main-colors-green: #02e3b6;
	--main-colors-red: #ff817b;
}

:root {
    --font-family: "Inter", sans-serif;
    --second-family: "Rubik", sans-serif;
}

/* Для браузеров на базе WebKit (Chrome, Safari, Opera) */
::-webkit-scrollbar {
    width: 2px; /* Ширина вертикального скроллбара */
    height: 2px; /* Высота горизонтального скроллбара */
}

::-webkit-scrollbar-track {
    background: #1C1C1E; /* Цвет трека скроллбара */
}

::-webkit-scrollbar-thumb {
    background: #1C1C1E; /* Цвет ползунка скроллбара */
    border-radius: 10px; /* Скругленные углы ползунка */
}

::-webkit-scrollbar-thumb:hover {
    background: #555; /* Цвет ползунка при наведении */
}
/* Для Firefox */
html {
    scrollbar-width: thin; /* Устанавливает тонкий скроллбар */
    scrollbar-color: #1C1C1E #1C1C1E; /* Цвет ползунка и трека */
    overscroll-behavior: none; /* Отключает скролл при взаимодействии */
    touch-action: manipulation; 
    scrollbar-width: none;
    -ms-overflow-style: none;
    overscroll-behavior: none;
}
a {
    outline: none; /* Убирает обводку */
}
.link_menu,.link_menu_active, a{
    -webkit-tap-highlight-color: transparent;
}
* {
  -webkit-tap-highlight-color: transparent;
}

a:focus,
select:focus,
select:active,
a:active {
    outline: none; /* Убирает обводку для активного и фокусного состояния */
    box-shadow: none; /* Если обводка создается тенями */
}


body{
    margin: 0 auto;
    padding: 0;
    min-height: 100vh;
    background: var(--ui-colors-black);
    -ms-overflow-style: -ms-autohiding-scrollbar; /* Автоматически скрывающийся скроллбар */
    height: 100%;
    overscroll-behavior: none; /* Отключает скролл при взаимодействии */
    touch-action: manipulation; 
    scrollbar-width: none;
    -ms-overflow-style: none;
    overscroll-behavior: none;
    overflow: auto;
}
a{
    text-decoration: none;
}
button:active, button:focus {
	outline: none;
}
button::-moz-focus-inner {
	border: 0;
}
a:active, a:focus {
	outline: none;
}
a::-moz-focus-inner {
	border: 0;
}
input, textarea {border:0;outline:0;}
input:focus,textarea:focus {outline:none!important;}
.page{
    display: flex;
    margin-bottom: 80px;
    flex-direction: column;
    margin-top: 60px;
    position: sticky;
    top: 0;
}
.line_{
    display: none;
}
.header{
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: fixed;
    z-index: 6;
    background: var(--ui-colors-black);
    width: calc(100% - 32px);
    padding: 4px 16px;
    top: 0;
    border-bottom: 1px solid var(--ui-colors-black-1);
}
.logo_img{
    width: 52px;
    height: 52px;
}
.logo{
    width: 100%;
}
.avatar_user{
    border-radius: 100px;
    width: 32px;
    height: 32px;
}
.btn_connect_ton{
    border: 1px solid #2cbdff;
    border-radius: 12px;
    padding: 13px 16px;
    box-shadow: inset 0 2px 8px 0 rgba(255, 255, 255, 0.2);
    background: var(--main-colors-blue);
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    text-align: center;
    color: var(--ui-colors-white);
    cursor: pointer;
    display: none;
}
.header_right_cont{
    display: flex;
    align-items: center;
    gap: 12px;
}
.line_{
    background: var(--ui-colors-black-1);
    height: 1px;
    width: 100%;
}
.top_banners{
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.middle_banners{
    display: flex;
    gap: 8px;
}
.banner_riffles{
    border-radius: 12px;
    background: linear-gradient(90deg, #00ac4d 0%, #facf23 100%);
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    position: relative;
    overflow: hidden;
}
.t_title_b{
    font-family: var(--second-family);
    font-weight: 900;
    font-size: 16px;
    line-height: 94%;
    text-transform: uppercase;
    background: linear-gradient(180deg, #fff 72.39%, #b8e5ff 100%);
      background-clip: border-box;
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.descr_title_b{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    color: var(--ui-colors-white);
}
.main_profile_data{
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: center;
    margin-top: 16px;
}
.avatar_big{
    border-radius: 100px;
    width: 100px;
    height: 100px;
}
.main_profile_data_data{
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: center;
}
#nickMain{
    font-family: var(--second-family);
    font-weight: 900;
    font-size: 16px;
    line-height: 94%;
    text-transform: uppercase;
    text-align: center;
    color: var(--ui-colors-white);
}
.controll_profile{
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 16px;
}
.pr_balance_bl_left{
    display: flex;
    align-items: center;
    gap: 8px;
}
.ton_pr{
    width: 40px;
    height: 40px;
}
.pr_balance_bl_left_data{
    display: flex;
    flex-direction: column;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    color: var(--ui-colors-text-2);
    justify-content: space-between;
    gap: 6px;
}
.pr_connect_wallet{
    box-shadow: inset 0 2px 8px 0 rgba(255, 255, 255, 0.2);
    background: var(--main-colors-blue);
    border: 1px solid #2cbdff;
    border-radius: 12px;
    padding: 13px 16px;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    text-align: center;
    color: var(--ui-colors-white);
    display: none;
}
.connected_wallet_pr{
    background: rgba(0, 169, 245, 0.1);
    border-radius: 12px;
    padding: 13px 7px 13px 12px;
    display: flex;
    align-items: center;
    gap: 8px;
    position: relative;
    display: none;
}
.btn_disconnect_wallet{
    border-radius: 8px;
    padding: 11px 8px;
    background: rgba(255, 129, 123, 0.12);
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    color: var(--main-colors-red);
    position: absolute;
    right: 7px;
    cursor: pointer;
}
#cntdWall{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    color: var(--main-colors-blue);
}
.open_ref_prog{
    border-radius: 12px;
    padding: 13px 16px;
    background: var(--ui-colors-white);
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    text-align: center;
    color: var(--ui-colors-black);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    cursor: pointer;
}
.open_support{
    background: var(--ui-colors-black-1);
    border-radius: 12px;
    padding: 11px 16px;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    text-align: center;
    color: var(--ui-colors-text-2);
}
.pr_balance_bl_left_data>span{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    text-align: right;
    color: var(--ui-colors-white);
    display: flex;
    align-items: center;
    gap: 4px;
}
.pr_inv_cont_header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    color: var(--ui-colors-text-2);
}
.btn_controll_ivn{
    border-radius: 12px;
    padding: 2px;
    background: var(--ui-colors-black-1);
    display: flex;
    gap: 2px;
    align-items: center;
    cursor: pointer;
}
.btn_controll_ivn>div.select{
    background: var(--ui-colors-black) !important;
    border-radius: 10px !important;
    font-family: var(--font-family) !important;
    font-weight: 700 !important;
    font-size: 12px !important;
    line-height: 108% !important;
    text-align: center !important;
    color: var(--ui-colors-white) !important;
    padding: 10px 30px !important;
}
.list_inv_gifts{
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.user_refferals{
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin: 16px;
    margin-top: 12px;
}
.list_user_refferals{
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.user_ref_left_data{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    color: var(--ui-colors-white);
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.pr_f_r{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    color: var(--ui-colors-text-2);
    display: flex;
    align-items: center;
    gap: 4px;
}
.deposites_from_ref{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    text-align: right;
    color: var(--ui-colors-white);
    display: flex;
    gap: 4px;
    align-items: center;
}
.pr_f_r>span{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    color: var(--ui-colors-white);
}
.ref_pic{
    border-radius: 100px;
    width: 40px;
    height: 40px;
}
.user_ref_left{
    display: flex;
    gap: 8px;
    align-items: center;
}
.user_ref{
    background: var(--ui-colors-black-1);
    padding: 14px 12px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.user_refferals_header{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    color: var(--ui-colors-text-2);
}
.block_inv{
    position: relative;
    border-radius: 12px;
    padding: 20px;
    background: var(--ui-colors-black-1);
    width: calc(33% - 45px);
    opacity: 0.4;
    cursor: pointer;
}
.price_inv_gift{
    border-radius: 10px;
    padding: 4px;
    background: var(--ui-colors-white-80);
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    color: var(--ui-colors-white);
    display: flex;
    align-items: center;
    gap: 2px;
    width: fit-content;
    position: absolute;
    right: 2px;
    top: 2px;
}
.block_inv[data-status='new']{
    opacity: 1 !important;
}
.block_inv[data-status='process'] > #loader_gift_buy{
    display: flex !important;
}
.block_inv[data-status='sold']{
    background: linear-gradient(130deg, var(--ui-colors-black-1) 50%, #8d1c1c 130%) !important;
}
.block_inv[data-status='get']{
    background: linear-gradient(130deg, var(--ui-colors-black-1) 50%, #1c8d23e3 150%) !important;
}
.inv_gift{
    width: 100%;
}
.btn_sell_full_gifts{
    border-radius: 10px;
    padding: 10px;
    background: var(--ui-colors-black-1);
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    color: var(--ui-colors-text-2);
    cursor: pointer;
    display: none;
}
.btn_go_open{
    border: 1px solid #2cbdff;
    border-radius: 12px;
    padding: 11px 16px;
    box-shadow: inset 0 2px 8px 0 rgba(255, 255, 255, 0.2);
    background: var(--main-colors-blue);
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    text-align: center;
    color: var(--ui-colors-white);
    width: 130px;
}
.empty_inv{
    display: none;
    flex-direction: column;
    gap: 16px;
    align-items: center;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    text-align: center;
    color: var(--ui-colors-text-2);
}
.btn_show_act, .btn_show_all{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    color: var(--ui-colors-text-2);
    padding: 10px 12px;
    transition: 0.2s linear;
}
.loader {
    width: 48px;
    height: 48px;
    border: 5px dotted #FFF;
    border-radius: 50%;
    display: inline-block;
    position: relative;
    box-sizing: border-box;
    animation: rotation 3.5s linear infinite;
}
.ref_cont{
    margin: 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.ref_cont_head_btns{
    display: flex;
    align-items: center;
    gap: 8px;
}
.btn_invite_friends{
    box-shadow: inset 0 2px 8px 0 rgba(255, 255, 255, 0.2);
    background: var(--main-colors-blue);
    border: 1px solid #2cbdff;
    border-radius: 12px;
    padding: 13px 16px;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    text-align: center;
    color: var(--ui-colors-white);
    cursor: pointer;
    width: 100%;
}
.copu_ref_link{
    box-shadow: inset 0 2px 8px 0 rgba(255, 255, 255, 0.2);
    background: var(--main-colors-blue);
    border: 1px solid #2cbdff;
    border-radius: 12px;
    padding: 13px 16px;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    text-align: center;
    color: var(--ui-colors-white);
    cursor: pointer;
    width: 55%;
    transition: 0.2s linear all;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}
.copu_ref_link:active{
    background: #038ac8;
}
.ref_balace_block_left_data{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    text-align: right;
    color: var(--ui-colors-white);
    display: flex;
    align-items: center;
    gap: 4px;
}
.ref_balace_block_left{
    display: flex;
    flex-direction: column;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    gap: 8px;
    line-height: 108%;
    color: var(--ui-colors-text-2);
}
.ref_stats_raw_block>span{
    font-family: var(--second-family);
    font-weight: 900;
    font-size: 14px;
    line-height: 107%;
    text-transform: uppercase;
    text-align: right;
    color: var(--ui-colors-white);
    display: flex;
    align-items: center;
    gap: 4px;
}
.ref_stats_raw_block{
    border-radius: 12px;
    padding: 14px;
    background: var(--ui-colors-black-1);
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 10px;
    line-height: 120%;
    color: var(--ui-colors-text-2);
    width: 100%;
    display: flex;
    align-items: center;
    flex-direction: column;
    gap: 8px;
}
.ref_stats_raw {
    display: flex;
    align-items: center;
    gap: 8px;
}
.ref_stats{
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.withdraw_btn_ref_bal{
    border-radius: 12px;
    padding: 11px 16px;
    background: var(--ui-colors-white);
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    text-align: center;
    color: var(--ui-colors-black);
    cursor: pointer;
}
.ref_balace_block{
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 12px;
    padding: 16px;
    background: rgba(0, 169, 245, 0.1);
}
.bg_ring{
    width: 225px;
    position: absolute;
    right: 0;
    z-index: -1;
    top: 0;
    transform: translate(16px,-32px);
}
#percYour{
    font-family: var(--second-family);
    font-weight: 900;
    font-size: 16px;
    line-height: 94%;
    text-transform: uppercase;
    color: var(--ui-colors-white);
}
.ref_cont_head_txts{
    display: flex;
    flex-direction: column;
    gap: 8px;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    color: var(--ui-colors-text-2);
}
.ref_cont_head{
    position: relative;
    display: flex;
    margin-top: 16px;
    flex-direction: column;
    gap: 16px;
}
#loader_gift_buy{
    position: absolute;
    display: none;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    backdrop-filter: blur(5px);
}
@keyframes rotation {
0% {
    transform: rotate(0deg);
}
100% {
    transform: rotate(360deg);
}
} 
.pr_inv_cont{
    margin: 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 0px;
}
.deposite_btn_pr{
    border: 1px solid #2cbdff;
    border-radius: 12px;
    padding: 11px 16px;
    box-shadow: inset 0 2px 8px 0 rgba(255, 255, 255, 0.2);
    background: var(--main-colors-blue);
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    text-align: center;
    color: var(--ui-colors-white);
    cursor: pointer;
}
.pr_balance_bl{
    background: var(--ui-colors-black-1);
    padding: 12px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
#idMain{
    border-radius: 8px;
    padding: 11px 16px;
    background: var(--ui-colors-black-1);
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    color: var(--ui-colors-text-2);
}
.banner_image{
    position: absolute;
    height: 70px;
    top: 0;
    right: 0;
}
.banner_telegram{
    border-radius: 12px;
    background: linear-gradient(90deg, #077deb 0%, #25a3e1 100%);
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    position: relative;
    overflow: hidden;
}
.main_banners{
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 16px;
}
.online_tab{
    backdrop-filter: blur(6px);
    background: rgba(16, 23, 33, 0.2);
    border-radius: 8px;
    padding: 4px;
    display: flex;
    gap: 4px;
    align-items: center;
    justify-content: center;
    width: fit-content;
}
.on-round{
    width: 10px;
    height: 10px;
    background: rgba(2, 227, 182, 0.6);
    border-radius: 357px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.m_s_banner {
    width: 100%;
    border-radius: 12px;
    padding: 16px;
  
    background-image: url('/assets/cases.png'), linear-gradient(180deg, #00a3f5 0%, #0055b7 100%);
    background-size: cover, cover;
    background-position: center, center;
    background-repeat: no-repeat, no-repeat;
    gap: 125px;
    display: flex;
    flex-direction: column;
}
.bottom_m_s_banner{
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.t_low_m_s{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    color: var(--ui-colors-white);
    opacity: 0.8;
}
#cases.t_big_m_s{
    font-family: var(--second-family);
    font-weight: 900;
    font-size: 24px;
    line-height: 83%;
    text-transform: uppercase;
    background: linear-gradient(180deg, #fff 59.6%, #43b0ff 100%);
      background-clip: border-box;
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-shadow: 0 1px 0 0 rgba(4, 103, 173, 0.6), inset 0 -1px 1px 0 var(--ui-colors-white);
}
#upgrade.t_big_m_s{
    font-family: var(--second-family);
    font-weight: 900;
    font-size: 24px;
    line-height: 83%;
    text-transform: uppercase;
    background: linear-gradient(180deg, #fff 59.6%, #8a79f4 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-shadow: 0 1px 0 0 rgba(63, 47, 164, 0.6), inset 0 -1px 1px 0 var(--ui-colors-white);   
}
#upgrade.m_s_banner{
    background-image: url('/assets/upgrade.png'), linear-gradient(180deg, #7762ff 0%, #3b2f89 100%);
}
.wheel_banner{
    border-radius: 12px;
    padding: 16px;
    display: flex;
    background-image: url('/assets/wheel.png');
    background-color: #380b2b;
    background-size: cover, cover;
    background-position: center, center;
    background-repeat: no-repeat, no-repeat;
    position: relative;
    aspect-ratio: 16 / 9;
}
.wheel_banner_timer_cont{
    display: flex;
    gap: 6px;
    align-items: center;
}
.cell_wheel>span{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 10px;
    line-height: 120%;
    text-align: center;
    color: var(--ui-colors-white);
    opacity: 0.5;
}
.cell_wheel {
    border-radius: 12px;
    padding: 8px 12px;
    backdrop-filter: blur(6px);
    background: rgba(16, 23, 33, 0.2);
    display: flex;
    flex-direction: column;
    font-family: var(--second-family);
    font-weight: 900;
    font-size: 16px;
    line-height: 94%;
    text-transform: uppercase;
    text-align: center;
    color: var(--ui-colors-white);
    max-width: 48px;
    max-height: 44px;
}
.t_com_sn{
    text-shadow: 0 1px 0 0 rgba(151, 22, 127, 0.6), inset 0 -1px 1px 0 var(--ui-colors-white);
    font-family: var(--second-family);
    font-weight: 900;
    font-size: 24px;
    line-height: 83%;
    text-transform: uppercase;
    background: linear-gradient(180deg, #fff 59.6%, #fb70e1 100%);
      background-clip: border-box;
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.wheel_banner_bottom{
    display: flex;
    flex-direction: column;
    gap: 12px;
    position: absolute;
    bottom: 16px;
}
.in-round{
    border-radius: 357px;
    width: 5px;
    height: 5px;
    background: var(--main-colors-green);
}
.count_online{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 10px;
    line-height: 120%;
    color: var(--ui-colors-white);
}
.main_stats{
    display: flex;
    align-items: center;
    gap: 24px;
    margin: 0px 16px;
    justify-content: space-between;
}
.confirm_ajax_use_promo_fs{
    position: absolute;
    right: 2px;
    border-radius: 10px;
    padding: 2px;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    width: 60px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    background: var(--ui-colors-white);
    opacity: 0.5;
    color: var(--ui-colors-black);
    transition: 0.2s linear all;
}
.promo_spins_inp{
    border-radius: 12px;
    padding: 12px 2px 12px 12px;
    background: #1b2738;
    width: 100%;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    color: var(--ui-colors-text-2);
}
.cont_inp_promo_spins{
    display: flex;
    align-items: center;
    position: relative;
}
.inputs_deposite>.inp_d_cont>.max_amount_d{
    display: none !important;
}
.sk_prizes-list{
    justify-content: start !important;
    gap: 8px !important;
}
.sk_prizes-list>li{
    width: calc(33% - 5px) !important;
    margin-bottom: 0px !important;
}
.bl_stat{
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 16px;
    width: 100%;
    justify-content: center;
}
.bl_stat_data{
    display: flex;
    flex-direction: column;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 10px;
    line-height: 120%;
    color: var(--ui-colors-text-2);
}
.bottom_menu{
    position: fixed;
    z-index: 20;
    bottom: 0;
    display: flex;
    justify-content: space-between;
    width: calc(100% - 32px);
    padding: 0px 16px;
    background: var(--ui-colors-black);
    align-items: end;
    padding-bottom: 24px;
    border-top: 1px solid var(--ui-colors-black-1);
}
.location_block{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    color: var(--ui-colors-text-2);
    position: relative;
    padding-top: 5px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    width: 100%;
}
.deposite_button{
    border-radius: 12px;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    color: var(--main-colors-green);
    display: flex;
    flex-direction: column;
    width: 100%;
    align-items: center;
    gap: 6px;
    position: relative;
    cursor: pointer;
}
.deposite_button>svg{
    opacity: 0;
}
.deposite_button_round_cont{
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}
#depSVG{
    opacity: 1;
    position: absolute;
    top: -33px;
}
.deposite_button_round_cont>svg{
    position: absolute;
    box-shadow: inset 0 0 4px 0 #35ffa1, 0 0 12px 0 rgba(254, 210, 130, 0.24);
    background: radial-gradient(63.58% 63.58% at 65.98% 26.64%, #02e3b6 0%, #00bd7b 100%), radial-gradient(27.85% 27.85% at 69.72% 18.89%, #fff 0%, rgba(255, 255, 255, 0) 100%);
    border-radius: 50px;
    width: 40px;
    height: 40px;
    color: #00c68a;
}
.location_block.active > .active_line{
    border-radius: 12px;
    width: 40px;
    height: 3px;
    background: var(--main-colors-blue);
    position: absolute;
    top: -7px;
}
.location_block.active > svg > path{
    fill: var(--main-colors-blue) !important;
}
.bl_stat_data>span{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    color: var(--ui-colors-white);
}
.block_user_balance{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    text-align: right;
    color: var(--ui-colors-white);
    display: flex;
    align-items: center;
    gap: 8px;
}
.header_data{
    display: flex;
}
/* full-screen overlay, hidden by default */
.modal_deposit, .modal_gift, .modal_w, .modal_last_gw {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    display: flex;
    align-items: flex-end;           /* content at bottom */
    justify-content: center;
    background: rgba(0,0,0,0.4);     /* semi-opaque */
    backdrop-filter: blur(6px);       /* blur the background */
    visibility: hidden;
    opacity: 0;
    transition: opacity 0.3s ease, visibility 0.3s;
    z-index: 1000;
  }
  
  /* when active, show it */
  .modal_deposit.active, .modal_gift.active, .modal_w.active, .modal_last_gw.active {
    visibility: visible;
    opacity: 1;
  }
  
  /* content panel slides up */
  .modal_deposit_content, .modal_w_content, .modal_last_gw_content {
    background: var(--ui-colors-black);
    width: 100%;
    max-width: 480px;
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
    transform: translateY(100%);
    transition: transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1);
    padding: 24px 16px 16px 16px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: center;
    position: relative;
  }
  
  /* when active, reset transform */
  .modal_deposit.active .modal_deposit_content, .modal_gift.active .modal_gift_content, .modal_w.active .modal_w_content, .modal_last_gw.active .modal_last_gw_content {
    transform: translateY(0);
  }
  .cont_btns_mp_WEf{
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 8px;
    z-index: 2;
  }
  .keep_gift{
    border: 1px solid #2cbdff;
    border-radius: 12px;
    padding: 13px 16px;
    box-shadow: inset 0 2px 8px 0 rgba(255, 255, 255, 0.2);
    background: var(--main-colors-blue);
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    text-align: center;
    color: var(--ui-colors-white);
    cursor: pointer;
  }
  .cont_mp_gift{
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: center;
    width: 100%;
  }
  .price_mp_gift_{
    border-radius: 12px;
    padding: 8px 12px;
    background: var(--ui-colors-white-80);
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    text-align: center;
    color: var(--ui-colors-white);
    display: flex;
    align-items: center;
    gap: 2px;
    z-index: 2;
  }
  .date_gift{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 10px;
    line-height: 120%;
    color: var(--ui-colors-text-2);
    position: absolute;
    left: 0;
    z-index: 2;
  }
  .img_mp_{
    width: 130px;
    z-index: 2;
    height: 130px;
  }
  .sell_gift{
    border-radius: 12px;
    padding: 13px 16px;
    background: var(--ui-colors-white);
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    text-align: center;
    color: var(--ui-colors-black);
    cursor: pointer;
  }
  
  /* drag-handle stripe */
  .line_for_hide, .line_for_hide_gift, .line_for_hide_w, .line_for_hide_last_gw {
    cursor: grab;
    border-radius: 16px;
    width: 90px;
    height: 4px;
    background: var(--ui-colors-text-3);
    position: absolute;
    top: 6px;
  }
  
  /* close button */
  .close_modal_btn, .close_modal_btn_lgw {
    position: absolute;
    top: 16px;
    right: 16px;
    cursor: pointer;
    z-index: 2;
  }


.block_cnt_w{
    border-radius: 12px;
    padding: 16px;
    background: var(--ui-colors-black-1);
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: calc(100% - 32px);
}
.go_real_w{
    box-shadow: inset 0 2px 8px 0 rgba(255, 255, 255, 0.2);
    background: var(--main-colors-blue);
    border: 1px solid #2cbdff;
    border-radius: 12px;
    padding: 13px 0px;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    text-align: center;
    color: var(--ui-colors-white);
    width: 100%;
    cursor: pointer;
}
.big_w_ton{
    width: 40px;
    height: 40px;
}
.block_cnt_w_h{
    display: flex;
    align-items: center;
    gap: 8px;
}
.live_cases_{
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 16px;
    overflow: hidden;
    max-width: 100%;
    position: relative;
    height: 74px;
}
#new_tag{
    border-radius: 8px;
    padding: 8px 10px;
    z-index: 1;
    background: linear-gradient(270deg, #09d48d 0%, #00b576 100%);
    transform: rotate(5deg);
    font-family: var(--second-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 117%;
    text-transform: uppercase;
    text-align: center;
    color: var(--ui-colors-white);
    position: absolute;
    right: -3px;
    top: -3px;
}
.case_image, .cont_img_bgds4q {
    width: 100%;
    aspect-ratio: 1 / 1;
    z-index: 1;
}
.btn_open_fc{
    box-shadow: inset 0 2px 8px 0 rgba(255, 255, 255, 0.2);
    background: var(--main-colors-gold);
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    text-align: center;
    color: #613f00;
    border: 1px solid #ffea63;
    border-radius: 12px;
    padding: 11px 16px;
    cursor: pointer;
    position: absolute;
    bottom: 16px;
}
.free_case{
    background-image: url('/assets/freeSpeens.png?v=2'), radial-gradient(62.79% 74.15% at 49.7% 38.21%, #00a9f5 0%, #0060ce 100%);
    border-radius: 12px;
    padding: 12px;
    width: calc(50% - 28px);
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: center;
    position: relative;
    background-size: cover, cover;
    background-position: center, center;
    background-repeat: no-repeat, no-repeat;
    justify-content: center;
    height: unset;
    min-height: 200px;
}
.light_case{
    border-radius: 100%;
    filter: blur(25px);
    width: 150px;
    height: 150px;
    position: absolute;
    opacity: 0.35;
    top: 35px;
}
.prizes-part{
    -ms-overflow-style: none;
    scrollbar-width: none;
}
.price_case{
    border-radius: 12px;
    padding: 8px 12px;
    background: var(--ui-colors-white-80);
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    text-align: center;
    color: var(--ui-colors-white);
    display: flex;
    align-items: center;
    gap: 4px;  
    z-index: 1; 
}
.name_case{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    margin-bottom: 3px;
    text-align: center;
    z-index: 1;
    color: var(--ui-colors-text-2);
}
#hot_tag{
    border-radius: 8px;
    padding: 8px 10px;
    transform: rotate(5deg);
    font-family: var(--second-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 117%;
    text-transform: uppercase;
    text-align: center;
    color: var(--ui-colors-white);
    position: absolute;
    right: -3px;
    top: -3px;
    z-index: 1;
    background: linear-gradient(270deg, #ff6b2c 0%, #ea2a2a 100%);
}
.case_cont {
    border-radius: 12px;
    background: var(--ui-colors-black-1);
    padding: 12px;
    width: calc(50% - 28px);
    display: flex;
    flex-direction: column;
    gap: 4px;
    align-items: center;
    position: relative;
    overflow: hidden;
}
.list_cases{
    display: flex;
    margin: 16px;
      margin-top: 16px;
    margin-top: 0;
    flex-wrap: wrap;
    gap: 8px;
}
.prize-pic>img{
    width: 148px;
}
.live_case_bl_price{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    color: var(--ui-colors-white);
    display: flex;
    align-items: center;
    gap: 2px;
}
.live_case_bl{
    border-radius: 8px;
    background: var(--ui-colors-black-1);
    padding: 10px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: center;
    position: relative;
    transition: 0.2s linear all;
}

/* оверлей справа */
.live_cases_::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 80px;             /* ширина зоны градиента */
    height: 100%;
    pointer-events: none;    /* чтобы скролл «не затирался» */
    background: linear-gradient( to right, rgba(0, 0, 0, 0) 0%, var(--ui-colors-black) 100% );
}
.user_case_bl_live{
    position: absolute;
    border: 2px solid var(--ui-colors-black);
    border-radius: 100px;
    width: 16px;
    height: 16px;
    top: -2px;
    right: -2px;
}
.live_case_bl_img{
    width: 32px;
  height: 32px;
}
.insert_ton_w, .max_amount_w{
    position: absolute;
    right: 2px;
    border-radius: 10px;
    background: var(--ui-colors-black-1);
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    color: var(--ui-colors-text-2);
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding: 0px 8px;
}
.amount_address_w, .amount_w{
    border-radius: 12px;
    padding: 12px 2px 12px 12px;
    background: var(--ui-colors-black);
    width: 100%;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    color: var(--ui-colors-text-2);
}
.block_cnt_w_h_data>span{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    text-align: right;
    color: var(--ui-colors-white);
    display: flex;
    align-items: center;
    gap: 4px;
}
.block_cnt_w_h_data{
    display: flex;
    flex-direction: column;
    gap: 8px;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    color: var(--ui-colors-text-2);
}
.header_modal_deposit, .header_w_deposit, .header_modal_gw{
    font-family: var(--second-family);
    font-weight: 900;
    font-size: 16px;
    line-height: 94%;
    text-transform: uppercase;
    text-align: center;
    color: var(--ui-colors-white);
    
}
.deposite_button_end{
    box-shadow: inset 0 2px 8px 0 rgba(255, 255, 255, 0.2);
    background: var(--main-colors-blue);
    border: 1px solid #2cbdff;
    border-radius: 12px;
    padding: 13px 16px;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    text-align: center;
    color: var(--ui-colors-white);
    width: calc(100% - 32px);
    cursor: pointer;
}
.cont_dep_met{
    display: flex;
    gap: 2px;
    width: 100%;
    background: var(--ui-colors-black-1);
    border-radius: 12px;
    padding: 2px;
}
.m_img{
    border-radius: 382px;
    width: 36px;
    height: 36px;
    z-index: 1;
}
.dep_met{
    display: flex;
    width: 100%;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    color: var(--ui-colors-text-2);
    padding: 16px;
    border-radius: 12px;
    position: relative;
    overflow: hidden;
}
.connected_wallet{
    display: flex;
}
.inputs_deposite{
    border-radius: 12px;
    padding: 16px;
    background: var(--ui-colors-black-1);
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: calc(100% - 32px);
}
.inp_d_cont{
    display: flex;
    align-items: center;
    position: relative;
}
.amount_d{
    border-radius: 12px;
    padding: 12px 2px 12px 12px;
    background: var(--ui-colors-black);
    width: 100%;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    color: var(--ui-colors-text-2);
}
.dep_met.active{
    background: var(--ui-colors-black);
    color: var(--ui-colors-white);
}
.hiden_act_dep{
    display: none;
}
.dep_met.active>.hiden_act_dep{
    border-radius: 100%;
    background: var(--main-colors-blue);
    filter: blur(20px);
    width: 45px;
    height: 45px;
    position: absolute;
    top: 25px;
    display: inline;
}
.dep_met>span{
    z-index: 1;
}
.max_amount_d{
    position: absolute;
    right: 2px;
    border-radius: 10px;
    padding: 2px;
    background: var(--ui-colors-black-1);
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    color: var(--ui-colors-text-2);
    width: 40px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}
.inp_d_cont{
    display: flex;
    align-items: center;
    position: relative;
}
.promo_d{
    border-radius: 12px;
    padding: 12px 2px 12px 12px;
    background: var(--ui-colors-black);
    width: 100%;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    color: var(--ui-colors-text-2);
}
/* новые строки: */
.modal_deposit_content.no-transition, .modal_gift_content.no-transition, .modal_w_content.no-transition, .modal_last_gw_content.no-transition {
    transition: none !important;
  }
  .line_for_hide, .line_for_hide_w, .line_for_hide_last_gw {
    touch-action: none;  /* блокируем скролл/пинч на мобильных */
  }

  .modal_deposit_content,.modal_gift_content,.modal_w_content,.line_for_hide_w,.modal_last_gw_content,.line_for_hide_last_gw,
  .line_for_hide {
    touch-action: none;    /* pointer-события ловятся без проблем на мобилках */
    user-select: none;     /* чтобы пальцем не выделялось ничего лишнего */
  }
  .modal_deposit_content.no-transition, .line_for_hide_last_gw.no-transition {
    transition: none !important;
  }
  
.btn_promo_confirm{
    position: absolute;
    right: 2px;
    border-radius: 10px;
    padding: 2px;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    width: 60px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    background: var(--ui-colors-white);
    opacity: 0.5;
    color: var(--ui-colors-black);
    transition: 0.2s linear all;
}
.modal_gift_content{
    background: var(--ui-colors-black);
    width: 100%;
    max-width: 480px;
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
    transform: translateY(100%);
    transition: transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1);
    padding: 24px 16px 16px 16px;
    display: flex;
    z-index: 1;
    flex-direction: column;
    gap: 16px;
    align-items: center;
    position: relative;
    overflow: hidden;
}
.bluur_asfjksdsf_4{
    border-radius: 100%;
    background: var(--main-colors-blue);
    filter: blur(50px);
    width: 150px;
    height: 150px;
    position: absolute;
    top: 10px;
    display: inline;
}
.c_mt_dsfo23eresf{
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: center;
}
.c_mt_dsfo23eresf>span{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    color: var(--ui-colors-text-2);
}
.connected_wallet{
    display: flex;
    border: 1px solid var(--ui-colors-text-3);
    border-radius: 12px;
    padding: 12px 8px;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    color: var(--ui-colors-text-2);
}
.loadModal{
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    font-family: var(--second-family);
    font-weight: 900;
    font-size: 16px;
    line-height: 94%;
    text-transform: uppercase;
    text-align: center;
    color: var(--ui-colors-white);
    align-items: center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    justify-content: center;
    background: linear-gradient(180deg, #273143 0%, #0b0f16 50%);
    width: 100%;
}
.loadModal>img{
    width: 125px;
    height: 125px;
}
.dep_gift_block{
    display: none;
    flex-direction: column;
    gap: 16px;
}
.list_prices_gift{
    max-height: calc(100vh - 450px);
    overflow: auto;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    transform: translateY(16px);
    margin-top: -16px;
    -ms-overflow-style: none;
    scrollbar-width: none;
}
.sell-btn{
    display: none;
}
.block_price>img{
    width: 100%;
}
.block_price {
    border-radius: 12px;
    background: var(--ui-colors-black-1);
    padding: 20px;
    position: relative;
    width: calc(33% - 45px);
    aspect-ratio: 1 / 1;
}
.block_price>div{
    background: var(--ui-colors-white-80);
    border-radius: 10px;
    padding: 4px;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    color: var(--ui-colors-white);
    width: fit-content;
    position: absolute;
    right: 2px;
    top: 2px;
    display: flex;
    align-items: center;
    gap: 3px;
}
.dep_gift_block_low_t{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    color: var(--ui-colors-text-2);
}
.open_bot_button{
    border-radius: 12px;
    padding: 13px 16px;
    background: var(--ui-colors-white);
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    text-align: center;
    color: var(--ui-colors-black);
}
.claimed_promo{
    background: rgba(2, 227, 182, 0.4);
    border: 1px dashed var(--main-colors-green);
    border-radius: 12px;
    padding: 12px;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    color: var(--main-colors-green);
    display: flex;
    align-items: center;
    justify-content: space-between;
    display: none;
}
.right_pro_dsa{
    display: flex;
    gap: 8px;
    align-items: center;
}
#notify-container {
    position: fixed;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    width: 300px;
    z-index: 1001;
}
#promoClm{
    text-transform: uppercase;
}
  /* Базовый стиль уведомления */
.notify {
    display: flex;
    align-items: center;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
    padding: 16px;
    margin-bottom: 10px;
    opacity: 0;
    transform: translateY(-20px);
    transition: opacity 0.3s ease, transform 0.3s ease;
}
.notify.show {
    opacity: 1;
    transform: translateY(0);
}
.notify svg {
    width: 20px;
    height: 20px;
    margin-right: 10px;
    flex-shrink: 0;
}
  /* Типы уведомлений */
  .notify.true {
    border-left: 4px solid var(--main-colors-green);
    background: rgba(2, 227, 182, 0.2);
    backdrop-filter: blur(10px);
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    color: var(--main-colors-green) !important;
  }
.notify.false   { border-left: 4px solid #e30202;
    background: rgba(227, 2, 2, 0.2);
    backdrop-filter: blur(10px);
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    color: #e30202 !important;}
.notify .message {
    flex: 1;
}
.inventory-list, .prizes-list{
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 16px;
}
.inv_el_for_up, .el_for_prize{
    background: var(--ui-colors-black-1);
    padding: 20px;
    border-radius: 12px;
    position: relative;
    cursor: pointer;
    width: calc(33% - 5px);
    border: 1px solid transparent;
}
.price_el_for_up, .price_el_for_prize{
    position: absolute;
    border-radius: 10px;
    padding: 4px;
    right: 2px;
    top: 2px;
    background: var(--ui-colors-white-80);
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    color: var(--ui-colors-white);
    display: flex;
    align-items: center;
    gap: 2px;
}
.inv_el_for_up.selected{
    border: 1px solid var(--main-colors-blue) !important;
}
.el_for_prize.selected{
    border: 1px solid var(--main-colors-blue) !important;
}
.inv_el_for_up>svg, .el_for_prize>svg{
    display: none;
}
.inv_el_for_up.selected>svg,.el_for_prize.selected>svg{
    display: inline !important;
    position: absolute;
    right: 8px;
    bottom: 8px;
}
.select_inv{
    border-radius: 12px;
    padding: 2px;
    background: var(--ui-colors-black-1);
    display: flex;
    align-items: center;
    gap: 2px;
    margin-bottom: 12px;
}
.inv_type{
    border-radius: 10px;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    color: var(--ui-colors-text-2);
    width: 100%;
    cursor: pointer;
    padding: 10px;
    transition: 0.2s linear all;
}
.inv_type.selected {
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    color: var(--ui-colors-white);
    background: var(--ui-colors-black);
    padding: 10px;
}
.upgrade_shower{
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
}
.shower_collect{
    border: 1px dashed var(--ui-colors-text-3);
    border-radius: 12px;
    padding: 17px 16px;
    background: var(--ui-colors-black-1);
    font-family: var(--second-family);
    font-weight: 900;
    font-size: 12px;
    line-height: 125%;
    text-transform: uppercase;
    text-align: center;
    color: #869cb97a;
    max-width: 120px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.image_shower{
    display: none;
}
.price_select_gift_{
    display: none;
}
.shower_collect.selected{
    border: 1px dashed var(--ui-colors-text-2);
    gap: 22px;
    max-width: none;
    min-width: 175px;
}
.shower_collect.selected>div{
    display: none !important;
}
.shower_collect.selected>.image_shower{
    display: flex !important;
    width: 40px;
    height: 40px;
}
.koefs_auto_cont{
    display: flex;
    border-radius: 12px;
    padding: 2px;
    background: var(--ui-colors-black-1);
    gap: 2px;
    margin-bottom: 12px;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    color: var(--ui-colors-text-2);
}
.koef_val {
    width: 100%;
    cursor: pointer;
    padding: 10px;
    border-radius: 10px;
    transition: 0.2s linear all;
}
.koef_val.selected{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    color: var(--ui-colors-white);
    background: var(--ui-colors-black);
}
.shower_collect.selected>.price_select_gift_{
    display: flex !important;
    align-items: center;
    border-radius: 10px;
    padding: 4px;
    background: var(--ui-colors-white-80);
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    color: var(--ui-colors-white);
    gap: 2px;
}
.prizes-list{
    display: none;
}
.bottom_menu.hidden {
    display: none;
}
.ton-bet-cont{
    display: none;
    padding: 16px;
    margin-bottom: 16px;
    border-radius: 12px;
    background: var(--ui-colors-black-1);
    flex-direction: column;
    margin-bottom: 60px;
}
.bet_inp{
    border-radius: 12px;
    padding: 12px 2px 12px 12px;
    background: var(--ui-colors-black);
    width: 100%;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    color: var(--ui-colors-text-2);
}
#minBetBtn, #maxBetBtn{
    border-radius: 10px;
    padding: 2px;
    background: var(--ui-colors-black-1);
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    color: var(--ui-colors-text-2);
    width: 40px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}
.live_line_upgrade{
    display: flex;
    align-items: center;
    gap: 6px;
    overflow: hidden;
    max-width: 100%;
    position: relative;
    min-height: 48px;
    margin-bottom: 16px;
}
.top-part {
    .game-box.gameStarted + .spin-actions-wrapper {
      opacity: 0.4;
      pointer-events: none; 
      transition: opacity 0.3s ease;
    }
}
  
.cont_Up_line_left_data, .cont_Up_line_right_data{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    color: var(--ui-colors-white);
    display: flex;
    align-items: center;
    gap: 2px;
}
.live_line_upgrade::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 80px;
    height: 100%;
    pointer-events: none;
    background: linear-gradient( to right, rgba(0, 0, 0, 0) 0%, var(--ui-colors-black) 100% );
}
.cont_Up_line_right_img,.cont_Up_line_left_img{
    width: 32px;
    height: 32px;
}
.cont_Up_line_left, .cont_Up_line_right{
    display: flex;
    align-items: center;
    gap: 2px;
}
.user_upgrade_image{
    border: 2px solid var(--ui-colors-black);
    border-radius: 100px;
    width: 16px;
    height: 16px;
    position: absolute;
    top: -2px;
    right: -2px;
}
.freeSpinsCont{
    width: calc(50% - 4px);
    position: relative;
    display: flex;
  justify-content: center;
}
.image_free_spee{
    width: 100%;

}
.btn_open_fc_{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    text-align: center;
    color: #613f00;
    position: absolute;
    bottom: 16px;
    border: 1px solid #ffea63;
    border-radius: 12px;
    padding: 13px 16px;
    box-shadow: inset 0 2px 8px 0 rgba(255, 255, 255, 0.2);
    background: var(--main-colors-gold);
}
.cont_Up_line{
    border-radius: 8px;
    padding: 8px;
    display: flex;
    align-items: center;
    gap: 4px;
    background: var(--ui-colors-black-1);
    position: relative;
    justify-content: space-between;
    min-width: fit-content;
}
.btns_bet{
    position: absolute;
    right: 4px;
    display: flex;
    gap: 2px;
}
.switch_type_bet{
    background: var(--ui-colors-black-1);
    border-radius: 12px;
    padding: 2px;
    display: flex;
    align-items: center;
    gap: 2px;
    width: fit-content;
    margin: 0 auto;
      margin-bottom: 0px;
    margin-bottom: 16px;
}
.switch_type_bet>div{
    border-radius: 10px;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    color: var(--ui-colors-text-2);
    padding: 10px 40px;
    cursor: pointer;
}
.switch_type_bet>div.selected{
    background: var(--ui-colors-black);
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    color: var(--ui-colors-white);    
}
.riffles_header{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    color: var(--ui-colors-text-2);
    margin: 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.riffles_header>span{
    font-family: var(--second-family);
    font-weight: 900;
    font-size: 16px;
    line-height: 94%;
    text-transform: uppercase;
    text-align: center;
    color: var(--ui-colors-white);
}
.select_duration_giveaway{
    border-radius: 12px;
    padding: 2px;
    background: var(--ui-colors-black-1);
    width: fit-content;
    margin: 0 auto;
    display: flex;
}
.type_giveaway {
    border-radius: 10px;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    color: var(--ui-colors-text-2);
    padding: 10px 14px;
    width: 55px;
    cursor: pointer;
    transition: 0.2s linear all;
}
.type_giveaway.active{
    background: var(--ui-colors-black) !important;
}
.btn_hist{
    position: absolute;
    opacity: 0.5;
    cursor: pointer;
}
.bg_giveaway{
    padding: 16px;
    margin: 16px;
    background: linear-gradient(270deg, #a249ec 0%, #0a47cc 100%);
    border-radius: 12px;
    position: relative;
    display: flex;
    gap: 16px;
}
.bg_giveaway_info{
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: center;
}
.bg_giveaway_info_img{
    width: 102px;
    height: 102px;
}
.bg_giveaway_info_price{
    border-radius: 12px;
    padding: 8px 12px;
    background: var(--ui-colors-white-80);
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    text-align: center;
    color: var(--ui-colors-white);
    display: flex;
    align-items: center;
    gap: 4px;
}
.btn_take_part{
    box-shadow: inset 0 2px 8px 0 rgba(255, 255, 255, 0.2);
    background: var(--main-colors-gold);
    border: 1px solid #ffea63;
    border-radius: 12px;
    padding: 13px 16px;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    text-align: center;
    color: #613f00;
    cursor: pointer;
}
.from_price_giveaway{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    color: #ffffff73;
    display: flex;
    gap: 4px;
}
.from_price_giveaway>span{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    color: var(--ui-colors-white);
    display: flex;
    align-items: center;
    gap: 2px;
}
.bg_giveaway_info_timing_timer{
    display: flex;
    align-items: center;
    gap: 6px;
    justify-content: space-between;
}
.bg_giveaway_info_timing_timer_block{
    border-radius: 12px;
    padding: 8px 12px;
    background: rgba(255, 255, 255, 0.2);
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 10px;
    line-height: 120%;
    text-align: center;
    color: #ffffff70;
    display: flex;
    flex-direction: column;
    width: 100%;
}
.list_particles{
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 0px 16px;
}
.list_particles_left{
    display: flex;
    align-items: center;
    gap: 8px;
}
.list_particles_left_data{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    color: var(--ui-colors-white);
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.list_particles_right{
    display: flex;
    align-items: center;
    gap: 12px;
}
.list_particles_right_id{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    color: var(--ui-colors-white);
    background: var(--ui-colors-white-80);
    border-radius: 10px;
    padding: 4px 6px;
}
.list_particles_right_dep{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    text-align: right;
    color: var(--ui-colors-white);
    display: flex;
    gap: 4px;
    align-items: center;
}
.list_particles_left_data>span{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    color: var(--ui-colors-white);
    display: flex;
    align-items: center;
    gap: 2px;
}
.list_particles_left_img{
    border-radius: 100px;
    width: 40px;
    height: 40px;
}
.particl{
    background: var(--ui-colors-text-3);
    border-radius: 12px;
    padding: 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.bg_giveaway_info_timing_timer_block>span{
    font-family: var(--second-family);
    font-weight: 900;
    font-size: 16px;
    line-height: 94%;
    text-transform: uppercase;
    text-align: center;
    color: var(--ui-colors-white);
}
.count_users_giveaway_c{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    color: var(--ui-colors-white);
    display: flex;
    gap: 6px;
    align-items: center;
}
.count_users_giveaway{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    color: #ffffff73;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.bg_giveaway_info_timing{
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.fast-option-col_new {
    position: relative;
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    user-select: none;
    color: #869CB9;              /* исходный цвет текста */
    transition: color 0.3s ease;
  }
  
  /* Прячем сам чекбокс */
  .fast-option-col_new input {
    opacity: 0;
    visibility: hidden;
    position: absolute;
  }
  
  /* Сама “ползунковая” кнопка */
  .fast-option-col_new .ch-btn {
    position: relative;
    width: 42px;
    height: 28px;
    border-radius: 10px;
    background: #232932;
    margin-right: 8px;
    transition: all 0.3s ease;
    flex-shrink: 0;
  }
  
  /* Псевдоэлемент-ползунок */
  .fast-option-col_new .ch-btn::before {
    content: "";
    position: absolute;
    top: 2px;
    left: 2px;
    width: 24px;
    height: calc(100% - 4px);
    background: #869CB9;
    border-radius: 8px;
    transition: all 0.3s ease;
  }

  .fast-option-col_new>.checkbox-holder{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    color: var(--ui-colors-text-2);
  }
  .jsOpenCaseDemoBtn{
    color: black !important;
    cursor: pointer;
  }
  .blue-btn{
    cursor: pointer;
  }
  /* Когда отмечено — меняем фон кнопки */
  .fast-option-col_new input:checked + .ch-btn {
    border-color: #333;
    background: #00A9F5;
  }
  
  /* И передвигаем ползунок */
  .fast-option-col_new input:checked + .ch-btn::before {
    background: #fff;
    transform: translateX(14px);
  }
  
  /* Цвет текста “Fast” тоже меняем, если чекбокс отмечен */
  .fast-option-col_new:has(input:checked) {
    color: #fff;
  }
  
.case-name{
    font-family: var(--second-family) !important;
    font-weight: 900 !important;
    font-size: 16px !important;
    line-height: 94% !important;
    text-transform: uppercase !important;
    text-align: center !important;
    color: var(--ui-colors-white) !important;   
}
.case-pricing>b, .prize-cost{
    font-family: var(--font-family) !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    line-height: 100% !important;
    text-align: center !important;
    color: var(--ui-colors-white) !important;
}
#null_tag{
    display: none;
}
.case-pricing>i{
    padding: 0 !important;
}
.btn_take_part>svg{
    display: none;
}
.btn_take_part.active>svg{
    display: flex !important;
}
.btn_take_part.active{
    background: rgba(2, 227, 182, 0.4);
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    text-align: center;
    color: var(--main-colors-green);
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border: none;
}
.rule_last_gw{
    background: var(--ui-colors-black-1);
    border-radius: 12px;
    padding: 2px;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    color: var(--ui-colors-text-2);
    display: flex;
    gap: 2px;
}
.last_gw{
    padding: 10px 30px;
    cursor: pointer;
    transition: 0.2s linear all;
}
.last_gw.active{
    background: var(--ui-colors-black) !important;
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    color: var(--ui-colors-white) !important;
    border-radius: 10px;    
}
.list_last_gw{
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-height: calc(100vh - 250px);
    width: 100%;
}
.last_gw_cont{
    border-radius: 12px;
    padding: 12px;
    background: var(--ui-colors-black-1);
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.last_gw_cont_left_img{
    width: 64px;
  height: 64px;
}
.last_gw_cont_left{
    display: flex;
    align-items: center;
    gap: 8px;
}
.last_gw_cont_left_data{
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.last_gw_cont_left_data_price{
    border-radius: 12px;
    padding: 8px 12px;
    background: var(--ui-colors-white-80);
    display: flex;
    gap: 4px;
    align-items: center;
    font-family: var(--font-family);
    font-weight: 700;
    width: fit-content;
    font-size: 14px;
    line-height: 100%;
    text-align: center;
    color: var(--ui-colors-white);
}
.last_gw_cont_right{
    border-radius: 12px;
    padding: 12px;
    background: var(--ui-colors-text-3);
    display: flex;
    align-items: center;
    gap: 8px;
}
.last_gw_cont_left_data_date{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 10px;
    line-height: 120%;
    color: var(--ui-colors-text-2);
}
.last_gw_cont_right_left_img{
    border-radius: 100px;
    width: 40px;
    height: 40px;
}
.last_gw_cont_right_left_right{
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.last_gw_cont_right_left_right_name{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    color: var(--ui-colors-white);
}
.last_gw_cont_right_left_right_reward{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    color: var(--ui-colors-text-2);
    display: flex;
    align-items: center;
    gap: 4px;
}
.last_gw_cont_right_left_right_reward>span{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 12px;
    line-height: 108%;
    text-align: center;
    color: var(--ui-colors-white);
    display: flex;
    align-items: center;
    gap: 2px;
}