:root {
    /* Change these values in config.php -> global:
       theme_brand_primary, theme_brand_secondary, theme_brand_surface,
       theme_sidebar_surface, theme_site_background */
    --theme-brand-primary: #D2E500;
    --theme-brand-secondary: #869118;
    --theme-brand-surface: #1B2022;
    --theme-sidebar-surface: #363c3e;
    --theme-site-background: #101315;
    --theme-brand-primary-rgb: 210 229 0;
    --theme-brand-secondary-rgb: 134 145 24;
    --theme-brand-surface-rgb: 27 32 34;
    --theme-sidebar-surface-rgb: 54 60 62;
    --theme-site-background-rgb: 16 19 21;

    /* Bridge the original template classes to the brand palette */
    --brand: var(--theme-brand-primary-rgb);
    --brand_alt: var(--theme-brand-secondary-rgb);
    --brand_secondary: var(--theme-brand-primary-rgb);
    --success: var(--theme-brand-primary-rgb);
    --layer3: var(--theme-sidebar-surface-rgb);
    --layer5: var(--theme-brand-surface-rgb);
    --Sidebar-Unit_bg: rgb(var(--theme-sidebar-surface-rgb) / 1);
    --Sidebar-ModeSwitcher-bg: rgb(var(--theme-sidebar-surface-rgb) / 1);
    --Sidebar-bg_layer5: rgb(var(--theme-sidebar-surface-rgb) / 1);
    --Sidebar-ListArrow-bg: rgb(var(--theme-sidebar-surface-rgb) / 1);
    --footer-bg: rgb(var(--theme-brand-surface-rgb) / 1);
    --site_bg: var(--theme-site-background);
    --info_block_bg: #00000052;
    --info_block_title_size: 20px;
    --info_block_title_weight: 600;
    --info_block_title_color: #fff;
    --info_block_icon_size: 20px;
    --info_block_text_color: #b3b3b3;
}

html.dark {
    --brand: var(--theme-brand-primary-rgb);
    --brand_alt: var(--theme-brand-secondary-rgb);
    --brand_secondary: var(--theme-brand-primary-rgb);
    --success: var(--theme-brand-primary-rgb);
    --layer3: var(--theme-sidebar-surface-rgb);
    --layer5: var(--theme-brand-surface-rgb);
    --Sidebar-Unit_bg: rgb(var(--theme-sidebar-surface-rgb) / 1);
    --Sidebar-ModeSwitcher-bg: rgb(var(--theme-sidebar-surface-rgb) / 1);
    --Sidebar-bg_layer5: rgb(var(--theme-sidebar-surface-rgb) / 1);
    --Sidebar-ListArrow-bg: rgb(var(--theme-sidebar-surface-rgb) / 1);
    --footer-bg: rgb(var(--theme-brand-surface-rgb) / 1);
    --site_bg: var(--theme-site-background);
}

.button-brand {
    background-image: linear-gradient(90deg, var(--theme-brand-primary), var(--theme-brand-primary));
    color: #111315 !important;
}

button.gradient-button {
    background-image: linear-gradient(90deg, var(--theme-brand-primary) 22.99%, var(--theme-brand-secondary) 103.87%);
}

.refer-bg {
    background: linear-gradient(90deg, rgb(var(--theme-brand-primary-rgb) / .4), rgb(var(--theme-brand-primary-rgb) / 0)), var(--Sidebar-Unit_bg);
}

.nav-link-item-game.active,
.game-link-item-active,
.game-link-item-ingame,
.nav-link-item.nav-link-item-active {
    background: linear-gradient(90deg, rgb(var(--theme-brand-primary-rgb) / .2), rgb(var(--theme-brand-primary-rgb) / 0) 83.86%), var(--Sidebar-Cell_Expandbg) !important;
}

.nav-link-item-game.active .icon,
.game-link-item-active .icon,
.game-link-item-ingame .icon,
.nav-link-item.nav-link-item-active .icon,
.nav-link-item-game.active span,
.game-link-item-active span,
.game-link-item-ingame span,
.nav-link-item.nav-link-item-active span,
.text-brand {
    color: var(--theme-brand-primary) !important;
}

.badge,
.badge.text-brand,
.rounded-full.text-brand,
.text-brand.rounded-full,
.bg-black_alpha5 .text-brand {
    color: var(--theme-brand-primary) !important;
}

.badge {
    background-color: rgb(var(--theme-brand-primary-rgb) / .12) !important;
    border: 1px solid rgb(var(--theme-brand-primary-rgb) / .2) !important;
}

.promo-badge {
    background: rgb(var(--theme-brand-primary-rgb) / .12) !important;
    color: var(--theme-brand-primary) !important;
    border: 1px solid rgb(var(--theme-brand-primary-rgb) / .22);
}

.footer-bg,
html.dark .footer-bg {
    --footer-bg: rgb(var(--theme-brand-surface-rgb) / 1);
    background: var(--footer-bg);
}

.brand-login-button {
    background-color: #ECEFF3 !important;
    color: #161a1d !important;
    border-color: transparent !important;
    font-weight: 700 !important;
}

.brand-tile-primary {
    background-color: rgb(var(--theme-brand-primary-rgb) / 1);
}

.brand-tile-secondary {
    background-color: rgb(var(--theme-brand-secondary-rgb) / 1);
}

.brand-tile-surface {
    background-color: rgb(var(--theme-brand-surface-rgb) / 1);
}

.footer-trust-row,
.footer-provider-grid,
.footer-payment-row {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    gap: 1rem 2rem;
    flex-wrap: wrap;
}

.footer-trust-row {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 1px solid rgb(255 255 255 / 0.08);
}

.footer-provider-grid {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 1px solid rgb(255 255 255 / 0.08);
    justify-content: space-between;
}

.footer-provider-item,
.footer-payment-item {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 30px;
    opacity: 0.95;
}

.footer-provider-item img,
.footer-payment-item img,
.footer-trust-logo {
    display: block;
    max-width: 100%;
    height: auto;
    object-fit: contain;
}

.footer-payment-row {
    justify-content: space-around;
}

.footer-trust-logo {
    max-height: 42px;
}

.footer-trust-logo-cga {
    width: 62px;
}

.footer-trust-logo-wide {
    width: 150px;
}

.footer-trust-logo-age {
    width: 44px;
}

#info_block_spoiler{
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: 3px;
    margin: 10px;
    width: 100%;
}

#info_block_spoiler .info_block_head{
    color: var(--info_block_title_color);                            
    flex-direction: row-reverse;
    flex: none;
    display: flex;
    cursor: pointer;
}

#info_block_spoiler .info_block_title_right{
    background-color: var(--info_block_bg);
    font-size: var(--info_block_title_size);
    font-weight: var(--info_block_title_weight);
    line-height: 30px;
    padding: 10px 15px;
    flex: 1 1 auto;                            
    display: inline-block;
}

#info_block_spoiler .info_block_title_left{
    background-color: var(--info_block_bg);
    min-width: 50px;
    min-height: 50px;
    margin-right: 1px;
    display: inline-block;
}

#info_block_spoiler .info_block_icon{
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

#info_block_spoiler .info_block_icon svg{
    color: var(--info_block_title_color);
    width: var(--info_block_icon_size);
    fill: currentColor;                             
    display: inline-flex;
    align-items: center;
    justify-content: center;
    vertical-align: middle;
    transition: transform;
    transition-duration: .2s;
}

#info_block_spoiler .info_block_text{
    background-color: var(--info_block_bg);
    color: var(--info_block_text_color);
    margin-top: 1px;
    padding: 15px 20px;
}

#info_block_spoiler .review-intro {
    margin-bottom: 1.25rem;
}

#info_block_spoiler .review-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin: 1rem 0 1.5rem;
}

#info_block_spoiler .review-card {
    background: rgb(var(--theme-brand-surface-rgb) / .72);
    border: 1px solid rgb(255 255 255 / 0.08);
    border-radius: 12px;
    padding: 1rem;
}

#info_block_spoiler .review-card h3 {
    margin-bottom: .75rem;
}

#info_block_spoiler .review-card-light {
    background: rgb(var(--theme-brand-surface-rgb) / .92);
    color: #f2f4f5;
    border: 1px solid rgb(var(--theme-brand-primary-rgb) / 0.16);
}

#info_block_spoiler .review-card-light h3,
#info_block_spoiler .review-card-light p,
#info_block_spoiler .review-card-light li,
#info_block_spoiler .review-card-light th,
#info_block_spoiler .review-card-light td {
    color: #f2f4f5;
}

#info_block_spoiler .review-kpis {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .75rem;
    margin: 1rem 0 1.5rem;
}

#info_block_spoiler .review-kpi {
    background: rgb(var(--theme-site-background-rgb) / .9);
    border: 1px solid rgb(255 255 255 / 0.06);
    border-radius: 12px;
    padding: .9rem 1rem;
}

#info_block_spoiler .review-kpi-label {
    display: block;
    font-size: .75rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: #9ea6ad;
    margin-bottom: .35rem;
}

#info_block_spoiler .review-kpi-value {
    display: block;
    font-size: 1.05rem;
    font-weight: 700;
    color: #fff;
    line-height: 1.35;
}

#info_block_spoiler .review-score-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin: 1rem 0 1.5rem;
}

#info_block_spoiler .review-score-card {
    background: rgb(var(--theme-brand-surface-rgb) / .92);
    border: 1px solid rgb(var(--theme-brand-primary-rgb) / 0.16);
    border-radius: 14px;
    padding: 1.25rem;
    min-height: 272px;
    display: flex;
    flex-direction: column;
}

#info_block_spoiler .review-score-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 92px;
    align-items: start;
    column-gap: 1rem;
    row-gap: .75rem;
    margin-bottom: 1.25rem;
}

#info_block_spoiler .review-score-head > div:first-child {
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .6rem;
}

#info_block_spoiler .review-score-title {
    font-size: 1.22rem;
    font-weight: 800;
    line-height: 1.12;
    color: #f4f5f6;
    max-width: 14ch;
}

#info_block_spoiler .review-score-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    width: fit-content;
    padding: .35rem .7rem;
    border-radius: 10px;
    font-size: .9rem;
    font-weight: 800;
    color: #fff;
    white-space: nowrap;
}

#info_block_spoiler .review-score-badge.good {
    background: var(--theme-brand-primary);
    color: #171b14;
}

#info_block_spoiler .review-score-badge.neutral {
    background: rgb(var(--theme-brand-primary-rgb) / 0.18);
    color: var(--theme-brand-primary);
    border: 1px solid rgb(var(--theme-brand-primary-rgb) / 0.24);
}

#info_block_spoiler .review-score-badge.dark {
    background: rgb(var(--theme-sidebar-surface-rgb) / 1);
    color: #f4f5f6;
}

#info_block_spoiler .review-score-badge.soft {
    background: var(--theme-brand-secondary);
    color: #f4f5f6;
}

#info_block_spoiler .review-gauge {
    --score: 75;
    width: 92px;
    height: 92px;
    border-radius: 50%;
    background:
        radial-gradient(circle at center, rgb(var(--theme-brand-surface-rgb) / 1) 56%, transparent 57%),
        conic-gradient(var(--theme-brand-primary) 0 calc(var(--score) * 1%), var(--theme-brand-secondary) calc(var(--score) * 1%) 85%, rgb(var(--theme-sidebar-surface-rgb) / 1) 100%);
    position: relative;
    flex: 0 0 auto;
}

#info_block_spoiler .review-gauge::after {
    content: attr(data-score) "/10";
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    font-weight: 800;
    color: #f4f5f6;
}

#info_block_spoiler .review-score-card p {
    margin-top: auto;
    max-width: 46ch;
    line-height: 1.48;
}

#info_block_spoiler .review-card-light table th,
#info_block_spoiler .review-card-light table td {
    border-color: rgb(var(--theme-brand-primary-rgb) / 0.14);
}

#info_block_spoiler .review-card-light table th {
    background: rgb(var(--theme-sidebar-surface-rgb) / .92);
}

#info_block_spoiler .review-card-light table td {
    background: rgb(var(--theme-brand-surface-rgb) / .66);
}

#info_block_spoiler .review-bar-list {
    display: grid;
    gap: .75rem;
    margin-top: .25rem;
}

#info_block_spoiler .review-bar-row {
    display: grid;
    grid-template-columns: 120px 1fr 48px;
    gap: .75rem;
    align-items: center;
}

#info_block_spoiler .review-bar-label,
#info_block_spoiler .review-bar-value {
    color: #f2f4f5;
    font-weight: 700;
    font-size: .94rem;
}

#info_block_spoiler .review-bar-track {
    height: 10px;
    background: rgb(255 255 255 / 0.08);
    border-radius: 999px;
    overflow: hidden;
}

#info_block_spoiler .review-bar-fill {
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--theme-brand-secondary), var(--theme-brand-primary));
}

#info_block_spoiler .review-bar-fill.green {
    background: linear-gradient(90deg, var(--theme-brand-secondary), var(--theme-brand-primary));
}

#info_block_spoiler .review-bar-fill.orange {
    background: linear-gradient(90deg, rgb(var(--theme-sidebar-surface-rgb) / 1), var(--theme-brand-primary));
}

#info_block_spoiler .review-bar-fill.dark {
    background: linear-gradient(90deg, rgb(var(--theme-sidebar-surface-rgb) / 1), var(--theme-brand-secondary));
}

#info_block_spoiler .review-split {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin: 1rem 0 1.5rem;
}

#info_block_spoiler .review-panel {
    border-radius: 14px;
    padding: 1rem 1.1rem;
    border: 1px solid;
}

#info_block_spoiler .review-panel.good {
    background: rgb(var(--theme-brand-primary-rgb) / 0.10);
    border-color: rgb(var(--theme-brand-primary-rgb) / 0.26);
}

#info_block_spoiler .review-panel.bad {
    background: rgb(var(--theme-sidebar-surface-rgb) / 0.44);
    border-color: rgb(var(--theme-sidebar-surface-rgb) / 0.78);
}

#info_block_spoiler .review-panel h3 {
    margin-bottom: .75rem;
}

#info_block_spoiler .review-panel.good h3 {
    color: var(--theme-brand-primary);
}

#info_block_spoiler .review-panel.bad h3 {
    color: #f2f4f5;
}

#info_block_spoiler .review-list {
    margin: 0;
}

#info_block_spoiler .review-list li {
    margin-bottom: .5rem;
}

#info_block_spoiler .review-table-compact td,
#info_block_spoiler .review-table-compact th {
    padding: .65rem .75rem;
    vertical-align: top;
}

@media (max-width: 767px) {
    #info_block_spoiler .review-grid,
    #info_block_spoiler .review-kpis,
    #info_block_spoiler .review-score-grid,
    #info_block_spoiler .review-split {
        grid-template-columns: 1fr;
    }

    #info_block_spoiler .review-bar-row {
        grid-template-columns: 1fr;
        gap: .35rem;
    }

    #info_block_spoiler .review-score-card {
        min-height: auto;
        padding: 1rem;
    }

    #info_block_spoiler .review-score-head {
        grid-template-columns: minmax(0, 1fr) 84px;
        column-gap: .85rem;
    }

    #info_block_spoiler .review-score-title {
        max-width: none;
        font-size: 1.08rem;
    }

    #info_block_spoiler .review-gauge {
        width: 84px;
        height: 84px;
    }
}

.header .flags_block{
    top: 43px!important;
    left: unset!important;
    right: 0px!important
}


@media (max-width: 767px) {
    .sidebar, .ml-3.rounded-lg.bg-layer5.text-secondary.center, .relative.mr-1.flex.cursor-pointer.select-none.items-center, .button.button-m.rounded-lg.bg-layer5.size-10.p-0, .button .button-m .flex-none .rounded-lg .bg-layer5 .size-10 .p-0, .relative .flex .h-10 .rounded-xl .w-52 .border-2, .relative.flex.h-10.rounded-xl.w-52.border-2, .relative.ml-3.flex.h-10.w-10.flex-none.rounded-lg.bg-layer5{
        display: none;
    }

    .header {
        height: auto;
        min-height: 5.5rem;
        padding: 0.5rem 0;
    }

    #root > .w-full.px-4.mx-auto.max-w-\[1248px\].pb-18.pt-18 {
        padding-top: 6.25rem;
    }

    .header > .relative.flex.h-full.flex-1.items-center {
        flex-wrap: wrap;
        align-items: flex-start;
        height: auto;
        min-height: 0;
        padding-left: 0.75rem;
        padding-right: 0.75rem;
    }

    .relative.z-10.flex.h-full.w-60.flex-none.items-center.px-4.w-60 {
        width: 100%;
        height: auto;
        justify-content: center;
        padding: 0 0 0.45rem;
    }

    .relative.h-full.w-full.px-4.mx-auto.max-w-\[1248px\] {
        width: 100%;
        height: auto;
        padding-left: 0;
        padding-right: 0;
    }

    .absolute.left-0.top-0.flex.size-full.items-center.px-3.justify-end {
        position: static;
        width: 100%;
        height: auto;
        justify-content: center;
        padding: 0;
    }

    .ml-3.flex.items-center {
        margin-left: 0;
        width: 100%;
        justify-content: center;
        gap: 0.5rem;
    }

    .ml-5.h-8.cursor-pointer.w-auto{
        margin-left: 0px;
        width: 132px;
        height: auto;
    }

    .flex.w-full.flex-wrap.gap-x-10.divide-x.divide-white_alpha5{
        overflow: hidden;
    }

    .flex.flex-col.max-w-\[500px\].flex-shrink-0.flex-grow.gap-y-3{
        width: 100%;
    }

    .button_auth{
        min-width: 88px;
        height: 38px !important;
        font-size: 12px;
        padding: 0 0.75rem !important;
        line-height: 1.1;
        white-space: nowrap;
    }

    .button.button_auth.button-brand.button-m.h-10.rounded-lg.px-4.text-base.ml-1.min-w-24 {
        min-width: 104px;
        margin-left: 0;
    }

    .brand-login-button {
        min-width: 92px;
    }

    .relative.ml-3.flex.h-10.flex-none.rounded-lg.bg-layer5.w-auto {
        margin-left: 0;
        height: 38px;
    }

    .lang-selector .current_lang {
        min-width: 94px;
        height: 38px;
        padding-left: 0.75rem;
        padding-right: 0.75rem;
        gap: 0.45rem;
    }

    .lang-selector .current_lang-code {
        font-size: 0.9rem;
    }

    .lang-selector .current_lang-flag {
        width: 18px;
        height: 12px;
    }

    .footer-provider-grid,
    .footer-payment-row {
        justify-content: center;
    }

}

.lang-selector .flags_block {
    display: none !important;
}

.lang-selector.open .flags_block {
    display: block !important;
}

.lang-selector .current_lang {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    min-width: 112px;
    border: 1px solid rgb(255 255 255 / 0.10);
    background: rgb(var(--theme-brand-surface-rgb) / 0.9);
}

.lang-selector .current_lang-code {
    color: #f4f5f6;
    font-size: 1rem;
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0.03em;
}

.lang-selector .current_lang-divider {
    color: rgb(255 255 255 / 0.5);
    font-weight: 700;
    line-height: 1;
}

.lang-selector .current_lang-flag {
    display: inline-block;
    width: 20px;
    height: 14px;
    border-radius: 999px;
    box-shadow: 0 0 0 1px rgb(255 255 255 / 0.08);
    background-repeat: no-repeat;
}

.btn_footnote {
    font-size: 9px;
    margin-top: 7px;
    color: #b3b3b3;
}

@media (min-width: 768px) {
    .main-block {
        --hero-shell-radius: 18px;
        --hero-shell-gap: 1rem;
        min-height: 260px;
        display: flex;
        align-items: stretch;
        justify-content: center;
        gap: var(--hero-shell-gap);
        background-color: rgb(var(--theme-brand-surface-rgb) / 1);
        position: relative;
        padding: var(--hero-shell-gap) !important;
        border-radius: calc(var(--hero-shell-radius) + var(--hero-shell-gap)) !important;
    }

    .hero-art {
        display: block !important;
        position: relative !important;
        inset: auto !important;
        order: 2;
        width: min(29%, 340px) !important;
        height: auto !important;
        aspect-ratio: 1 / 1;
        object-fit: cover !important;
        object-position: center !important;
        align-self: stretch;
        flex: 0 0 auto;
        z-index: 1 !important;
        border-radius: var(--hero-shell-radius) !important;
    }

    .hero-image-fade {
        display: none !important;
    }

    .hero-copy-shell {
        position: relative !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;
        order: 1;
        width: auto;
        flex: 0 1 auto;
        height: auto !important;
        justify-content: stretch !important;
        align-items: flex-start !important;
        padding: 0 !important;
        z-index: 2 !important;
    }

    .hero-copy-card {
        min-width: 0 !important;
        width: clamp(520px, 56vw, 820px);
        margin-left: 0;
        height: 100%;
        padding: 1.5rem 1.75rem !important;
        background-color: rgb(var(--theme-site-background-rgb) / 1) !important;
        border: 1px solid rgb(255 255 255 / 0.05);
        box-shadow: 0 18px 40px rgb(0 0 0 / 0.22);
        justify-content: center;
        border-radius: var(--hero-shell-radius) !important;
    }
}