:root {

    --color-bg-global: #000000;
    --color-bg-global-rgb: 0, 0, 0;
    --color-bg-tinted: #010d08;

    --color-surface-1: #040d08;
    --color-surface-2: #071a10;
    --color-surface-3: #0c2418;
    --color-surface-4: #122e20;

    --color-green-primary: #025328;
    --color-green-primary-rgb: 2, 83, 40;
    --color-green-hover: #037035;
    --color-green-hover-rgb: 3, 112, 53;
    --color-green-pressed: #013d1e;
    --color-green-deep: #012a14;
    --color-green-light: #10b461;
    --color-green-light-rgb: 16, 180, 97;
    --color-green-bright: #34d87a;
    --color-green-bright-rgb: 52, 216, 122;

    --color-sweep-accent: #34d87a;
    --color-sweep-accent-rgb: 52, 216, 122;
    --color-sweep-accent-soft: #10b461;

    --color-text-white: #ffffff;

    --color-login-bg: #0a1a12;
    --color-login-bg-hover: #0f2a1a;

    --header-footer-logo: url("https://vendor-provider.fra1.cdn.digitaloceanspaces.com/ebetlab/poWRPFOWPRFOdpfwRFPOWRPFOWORFP/statics/yulU1mnANXDeCBT12arPwONNBwEuCB8QnUYF1EUx.gif") !important;
    --homepage-entrance-bg-image: url("/assets/images/enterence-bg.png") !important;

    --brand-primary: var(--color-green-primary) !important;
    --brand-primary-rgb: var(--color-green-primary-rgb) !important;
    --brand-primary-contrast: var(--color-text-white) !important;
    --brand-secondary: var(--color-green-light) !important;
    --brand-secondary-rgb: var(--color-green-light-rgb) !important;

    --accent: var(--color-green-primary) !important;
    --accent-rgb: var(--color-green-primary-rgb) !important;
    --active: var(--color-green-hover) !important;

    --accent-soft: rgba(var(--accent-rgb), 0.14) !important;
    --accent-soft-2: rgba(var(--accent-rgb), 0.08) !important;
    --accent-soft-3: rgba(var(--accent-rgb), 0.2) !important;
    --accent-soft2: var(--accent-soft-2) !important;
    --accent-soft3: var(--accent-soft-3) !important;
    --accent-border: rgba(var(--accent-rgb), 0.34) !important;
    --accent-border-strong: rgba(var(--accent-rgb), 0.56) !important;
    --accent-glow: rgba(var(--accent-rgb), 0.38) !important;

    --surface-bg: var(--color-bg-global) !important;
    --surface-bg-rgb: var(--color-bg-global-rgb) !important;
    --surface-1: var(--color-surface-1) !important;
    --surface-2: var(--color-surface-2) !important;
    --surface-3: var(--color-surface-3) !important;
    --surface-4: var(--color-surface-4) !important;

    --surface-card: var(--color-surface-2) !important;
    --surface-modal: #050f0a !important;
    --surface-elevated: var(--color-surface-3) !important;

    --surface-border: rgba(255, 255, 255, 0.12) !important;
    --surface-border-soft: rgba(255, 255, 255, 0.08) !important;
    --surface-border-strong: rgba(255, 255, 255, 0.18) !important;

    --legacy-bg-1: var(--color-surface-1) !important;
    --legacy-bg-2: var(--color-surface-2) !important;
    --legacy-bg-3: var(--color-surface-3) !important;
    --legacy-text-muted: #8b9e94 !important;

    --text-primary: var(--color-text-white) !important;
    --text-secondary: rgba(255, 255, 255, 0.88) !important;
    --text-muted: rgba(255, 255, 255, 0.72) !important;
    --text-soft: rgba(255, 255, 255, 0.56) !important;
    --text-disabled: rgba(255, 255, 255, 0.38) !important;
    --text-on-accent: var(--color-text-white) !important;

    --success: #13e398;
    --success-rgb: 19, 227, 152;
    --warning: #efb025;
    --warning-rgb: 239, 176, 37;
    --danger: #ff5365;
    --danger-rgb: 255, 83, 101;
    --info: #44a7ff;
    --info-rgb: 68, 167, 255;

    --state-success-soft: rgba(var(--success-rgb), 0.16);
    --state-warning-soft: rgba(var(--warning-rgb), 0.18);
    --state-danger-soft: rgba(var(--danger-rgb), 0.15);
    --state-info-soft: rgba(var(--info-rgb), 0.16);

    --radius-2xs: 4px;
    --radius-xs: 6px;
    --radius-sm: 8px;
    --radius-md: 10px;
    --radius-lg: 12px;
    --radius-xl: 16px;
    --radius-2xl: 20px;
    --radius-3xl: 24px;
    --radius-pill: 999px;

    --border-thin: 1px;
    --border-medium: 2px;

    --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.2);
    --shadow-sm: 0 6px 14px rgba(0, 0, 0, 0.22);
    --shadow-md: 0 10px 24px rgba(0, 0, 0, 0.28);
    --shadow-lg: 0 14px 32px rgba(0, 0, 0, 0.34);
    --shadow-xl: 0 18px 44px rgba(0, 0, 0, 0.42);
    --shadow-accent-sm: 0 8px 18px rgba(var(--accent-rgb), 0.24);
    --shadow-accent-md: 0 12px 28px rgba(var(--accent-rgb), 0.36);
    --shadow-accent-lg: 0 16px 36px rgba(var(--accent-rgb), 0.42);

    --gradient-primary: linear-gradient(180deg, var(--color-green-hover), var(--color-green-primary)) !important;
    --gradient-primary-horizontal: linear-gradient(90deg, var(--color-green-hover), var(--color-green-primary)) !important;
    --gradient-overlay: linear-gradient(180deg, rgba(4, 13, 8, 0.9), rgba(0, 0, 0, 0.92)) !important;
    --gradient-surface: linear-gradient(180deg, var(--color-surface-3) 0%, var(--color-surface-1) 100%) !important;
    --gradient-chip: linear-gradient(180deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.03));
    --gradient-withdraw: linear-gradient(to right, var(--color-green-deep), var(--color-green-pressed), var(--color-green-primary), var(--color-green-hover), var(--color-green-light)) !important;

    --gradient-green-sweep: linear-gradient(to right, var(--color-green-deep) 0%, var(--color-green-primary) 40%, var(--color-green-hover) 72%, var(--color-green-light) 100%);
    --gradient-green-text: linear-gradient(var(--color-green-light), var(--color-green-bright));

    --panel-top: var(--color-surface-2) !important;
    --panel-bottom: #020804 !important;
    --panel-bg: var(--color-surface-2) !important;
    --panel-bg2: var(--color-surface-1) !important;
    --modalbg: linear-gradient(180deg, #081a10 0%, #030d07 100%) !important;
    --linearbg: linear-gradient(180deg, #091610 0%, #040d08 100%) !important;
    --linearbgreversed: linear-gradient(180deg, #040d08 0%, #091610 100%) !important;

    --progressbg: linear-gradient(
        90deg,
        var(--color-green-deep) 0%,
        var(--color-green-primary) 45%,
        var(--color-green-hover) 100%
    ) !important;

    --input-bg: var(--linearbg) !important;
    --input-bg-solid: var(--color-surface-3) !important;
    --input-border: rgba(255, 255, 255, 0.14) !important;
    --input-border-focus: rgba(var(--color-green-light-rgb), 0.75) !important;
    --input-placeholder: rgba(255, 255, 255, 0.45) !important;

    --btn-primary-bg: var(--color-green-primary) !important;
    --btn-primary-bg-hover: var(--color-green-hover) !important;
    --btn-primary-bg-active: var(--color-green-pressed) !important;
    --btn-primary-color: var(--color-text-white) !important;
    --btn-primary-radius: var(--radius-sm) !important;
    --btn-primary-shadow: var(--shadow-accent-sm) !important;
    --btn-primary-shadow-active: var(--shadow-accent-md) !important;
    --btn-primary-disabled-opacity: 0.55;

    --btn-secondary-bg: var(--color-login-bg) !important;
    --btn-secondary-bg-hover: var(--color-login-bg-hover) !important;
    --btn-secondary-color: var(--color-text-white) !important;
    --btn-secondary-border: var(--color-green-primary) !important;

    --btn-ghost-bg: rgba(255, 255, 255, 0.06);
    --btn-ghost-bg-hover: rgba(255, 255, 255, 0.12);
    --btn-ghost-color: var(--text-primary);

    --header-register-bg: var(--color-green-primary) !important;
    --header-register-color: var(--color-text-white) !important;
    --wallet-btn-bg-start: #071a10 !important;
    --wallet-btn-bg-end: var(--color-green-primary) !important;
    --wallet-btn-gradient: linear-gradient(90deg, var(--wallet-btn-bg-start) 0%, var(--wallet-btn-bg-end) 100%) !important;
    --wallet-btn-color: var(--color-text-white) !important;

    --tab-active-bg: var(--color-green-primary) !important;
    --tab-active-color: var(--color-text-white) !important;
    --tab-active-border: rgba(var(--color-green-light-rgb), 0.65) !important;
    --tab-inactive-bg: transparent !important;
    --tab-inactive-color: var(--text-muted) !important;
    --tab-inactive-border: var(--surface-border-soft) !important;

    --chip-bg: rgba(255, 255, 255, 0.06) !important;
    --chip-border: rgba(255, 255, 255, 0.12) !important;
    --chip-color: var(--text-muted) !important;
    --chip-active-bg: rgba(var(--color-green-primary-rgb), 0.35) !important;
    --chip-active-border: rgba(var(--color-green-light-rgb), 0.6) !important;
    --chip-active-color: var(--color-text-white) !important;

    --card-bg: var(--gradient-surface) !important;
    --card-border: var(--surface-border-soft) !important;
    --card-radius: var(--radius-lg);
    --card-shadow: var(--shadow-md);

    --modal-bg: var(--modalbg) !important;
    --modal-border: rgba(var(--color-green-primary-rgb), 0.75) !important;
    --modal-radius: var(--radius-lg);
    --modal-shadow: 0 30px 80px rgba(0, 0, 0, 0.7), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;

    --wallet-deposit-bg: var(--color-green-primary) !important;
    --wallet-withdraw-gradient: var(--gradient-withdraw);
    --wallet-footer-btn-bg: var(--color-surface-3) !important;
    --wallet-footer-btn-color: var(--text-primary) !important;

    --game-opener-border: rgba(var(--color-green-primary-rgb), 0.85) !important;
    --game-opener-overlay: linear-gradient(0deg, rgba(4, 13, 8, 0.84) 0%, rgba(4, 13, 8, 0.84) 100%) !important;
    --game-play-btn-bg: var(--color-green-primary) !important;
    --game-play-btn-color: var(--color-text-white) !important;
    --game-demo-btn-bg: rgba(255, 255, 255, 0.15) !important;
    --game-demo-btn-color: #ffffff !important;

    --slider-nav-bg: rgba(7, 26, 16, 0.8) !important;
    --slider-nav-bg-hover: rgba(var(--color-green-primary-rgb), 0.5) !important;
    --slider-nav-border: rgba(var(--color-green-light-rgb), 0.5) !important;
    --slider-nav-color: #ffffff !important;
    --slider-pagination-dot: rgba(255, 255, 255, 0.35) !important;
    --slider-pagination-dot-active: var(--color-green-hover) !important;

    --font-family-regular: "Rubik", sans-serif;
    --font-family-medium: "Rubik Medium", sans-serif;
    --font-family-semibold: "Rubik SemiBold", sans-serif;
    --font-family-bold: "Rubik Bold", sans-serif;

    --top-search-form-border: 1px solid rgba(255, 255, 255, 0.14) !important;
    --top-search-form-radius: 4px !important;
    --top-search-form-margin-top: 24px;
    --top-search-form-margin-bottom: 24px;
    --top-search-form-padding-x: 12px;
    --top-search-form-height: 48px;
    --top-search-form-line-height: 62px;
    --top-search-form-font-size: 0px;
    --top-search-form-bg: var(--linearbg) !important;
    --top-search-form-font-family: var(--font-family-medium);

    --top-search-icon-color: #8b9e94;
    --top-search-input-color: var(--text-primary);
    --top-search-input-placeholder: rgba(255, 255, 255, 0.55);
    --top-search-focus-radius: 16px;
    --top-search-focus-shadow: 0 22px 70px rgba(0, 0, 0, 0.55),
        0 0 0 1px rgba(var(--accent-rgb), 0.35) !important;

    --top-search-layer-radius: 18px;
    --top-search-layer-border: 1px solid rgba(255, 255, 255, 0.1);
    --top-search-layer-border-bottom: 10px solid rgba(255, 255, 255, 0.1);
    --top-search-layer-bg: rgba(5, 15, 10, 0.72) !important;
    --top-search-layer-shadow: 0 18px 55px rgba(0, 0, 0, 0.55);
    --top-search-layer-blur: 14px;
    --top-search-recent-wrap-radius: 10px;
    --top-search-recent-wrap-border: 1px solid rgba(var(--color-green-primary-rgb), 0.55) !important;
    --top-search-recent-wrap-bg: linear-gradient(180deg, rgba(7, 26, 16, 0.82), rgba(4, 13, 8, 0.84)) !important;
    --top-search-recent-wrap-shadow: 0 14px 26px rgba(0, 0, 0, 0.32);
    --top-search-recent-chip-radius: 999px;
    --top-search-recent-chip-border: 1px solid rgba(var(--color-green-light-rgb), 0.5) !important;
    --top-search-recent-chip-bg: linear-gradient(
        135deg,
        rgba(var(--color-green-primary-rgb), 0.5),
        rgba(var(--color-green-primary-rgb), 0.28)
    ) !important;
    --top-search-recent-chip-color: #ffffff !important;
    --top-search-recent-chip-font-family: var(--font-family-semibold);
    --top-search-recent-chip-shadow: 0 6px 14px rgba(var(--color-green-primary-rgb), 0.35),
        inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;

    --lb-bg: rgba(4, 13, 8, 0.72) !important;
    --lb-stroke: rgba(255, 255, 255, 0.1) !important;
    --lb-stroke-2: rgba(255, 255, 255, 0.06) !important;
    --lb-text: rgba(255, 255, 255, 0.86) !important;
    --lb-muted: rgba(255, 255, 255, 0.65) !important;
    --lb-active: var(--color-green-hover) !important;
    --lb-shadow: 0 18px 40px rgba(0, 0, 0, 0.5) !important;
    --lb-shadow-soft: 0 10px 26px rgba(0, 0, 0, 0.35) !important;
    --lb-search-bg: var(--color-surface-2) !important;
    --lb-radius: 22px !important;
    --lb-radius-sm: 20px !important;
    --lb-surface-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.02)) !important;
    --lb-wallet-ring-color: rgba(var(--color-green-hover-rgb), 0.7) !important;
    --lb-wallet-ring-size: 0.2rem !important;
    --lb-wallet-glow: radial-gradient(circle, rgba(var(--accent-rgb), 0.18), rgba(var(--accent-rgb), 0) 65%) !important;
    --lb-wallet-glow-radius: radial-gradient(circle, rgba(var(--accent-rgb), 0.22), rgba(var(--accent-rgb), 0) 62%) !important;
    --lb-chat-bg: linear-gradient(135deg, var(--color-green-hover), var(--color-green-deep)) !important;
    --lb-chat-border: rgba(var(--color-green-light-rgb), 0.45) !important;
    --lb-chat-color: #ffffff !important;
    --lb-chat-shadow: 0 12px 24px rgba(var(--accent-rgb), 0.26), 0 8px 20px rgba(0, 0, 0, 0.28) !important;
    --lb-chat-shadow-hover: 0 14px 28px rgba(var(--accent-rgb), 0.34), 0 10px 24px rgba(0, 0, 0, 0.32) !important;

    --sidebar-tab-casino-bg-image: linear-gradient(180deg, var(--color-green-hover) 0%, var(--color-green-deep) 100%) !important;
    --sidebar-tab-sportsbook-bg-image: linear-gradient(180deg, var(--color-green-hover) 0%, var(--color-green-deep) 100%) !important;

    --bonus-request-tab-bg: var(--tab-inactive-bg);
    --bonus-request-tab-border: var(--tab-inactive-border);
    --bonus-request-tab-text: var(--tab-inactive-color);
    --bonus-request-tab-active-bg: var(--tab-active-bg);
    --bonus-request-tab-active-border: var(--tab-active-border);
    --bonus-request-tab-active-text: var(--tab-active-color);
    --bonus-request-card-bg: var(--card-bg);
    --bonus-request-card-border: var(--card-border);
    --bonus-request-card-shadow: var(--card-shadow);
    --bonus-request-info-bg: rgba(var(--accent-rgb), 0.16);
    --bonus-request-info-border: rgba(var(--accent-rgb), 0.45);
    --bonus-request-info-color: var(--text-primary);
    --bonus-request-button-bg: var(--btn-primary-bg);
    --bonus-request-button-text: var(--btn-primary-color);
    --bonus-request-empty-bg: rgba(255, 255, 255, 0.02);
    --bonus-request-empty-border: var(--surface-border-soft);
    --bonus-request-empty-text: var(--text-muted);

    --vip-accent: var(--accent);
    --vip-accent-rgb: var(--accent-rgb);
    --vip-bg0: var(--surface-bg);
    --vip-bg1: var(--surface-2);
    --vip-card-bg: rgba(255, 255, 255, 0.05);
    --vip-card-border: rgba(255, 255, 255, 0.10);
    --vip-card-border-soft: rgba(255, 255, 255, 0.06);
    --vip-card-hover-bg: rgba(255, 255, 255, 0.06);
    --vip-text: var(--text-secondary);
    --vip-muted: var(--text-soft);
    --vip-chip-bg: rgba(255, 255, 255, 0.06);
    --vip-chip-border: rgba(255, 255, 255, 0.10);
    --vip-chip-active-bg: rgba(var(--vip-accent-rgb), 0.16);
    --vip-chip-active-border: rgba(var(--vip-accent-rgb), 0.30);
    --vip-tag-bg: rgba(0, 0, 0, 0.18);
    --vip-gift-tag-bg: rgba(var(--vip-accent-rgb), 0.10);
    --vip-gift-tag-border: rgba(var(--vip-accent-rgb), 0.18);
    --vip-button-border: rgba(var(--vip-accent-rgb), 0.28);
    --vip-button-bg: linear-gradient(180deg, rgba(var(--vip-accent-rgb), 0.22), rgba(var(--vip-accent-rgb), 0.10));
    --vip-button-border-hover: rgba(var(--vip-accent-rgb), 0.42);
    --vip-link: rgba(var(--vip-accent-rgb), 0.95);
    --vip-link-border: rgba(var(--vip-accent-rgb), 0.35);
    --vip-link-border-hover: rgba(var(--vip-accent-rgb), 0.65);

    --lineartooltipbg: linear-gradient(180deg, var(--color-surface-3) 0%, var(--color-surface-1) 100%) !important;

    --game-theater-overlay: rgba(0, 0, 0, 0.65);
    --game-overlay-soft: rgba(0, 0, 0, 0.55);
    --game-fs-close-bg: var(--color-surface-3);
    --game-switch-bg: var(--color-surface-3);
    --game-switch-knob: var(--color-surface-2);
    --game-switch-active-gradient: linear-gradient(to right, #00de99, #17de87, #2edd73, #41dc5d, #54db43);
    --game-bets-empty-bg: linear-gradient(145deg, rgba(var(--color-surface-3), 0.95), rgba(var(--color-bg-global-rgb), 0.92));
    --game-bets-empty-border: rgba(255, 255, 255, 0.10);
    --game-bets-empty-icon-bg: rgba(255, 255, 255, 0.05);
    --game-bets-empty-icon-border: rgba(255, 255, 255, 0.10);
    --game-bets-empty-icon-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
    --game-bets-empty-title: var(--text-primary);
    --game-bets-empty-text: var(--text-muted);
    --game-bets-empty-button-bg: rgba(var(--accent-rgb), 0.18);
    --game-bets-empty-button-border: rgba(var(--accent-rgb), 0.35);
    --game-bets-empty-button-hover-bg: rgba(var(--accent-rgb), 0.28);
    --game-bets-empty-button-hover-border: rgba(var(--accent-rgb), 0.50);

    --favorites-empty-bg: linear-gradient(140deg, rgba(12, 36, 24, 0.96), rgba(4, 13, 8, 0.96));
    --favorites-empty-border: rgba(255, 255, 255, 0.10);
    --favorites-empty-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 18px 42px rgba(0, 0, 0, 0.35);
    --favorites-empty-icon-bg: rgba(255, 255, 255, 0.05);
    --favorites-empty-icon-border: rgba(255, 255, 255, 0.10);
    --favorites-empty-icon-shadow: 0 8px 26px rgba(0, 0, 0, 0.32);
    --favorites-empty-title: var(--text-primary);
    --favorites-empty-text: var(--text-muted);
    --favorites-empty-btn-bg: linear-gradient(180deg, var(--color-green-hover) 0%, var(--color-green-pressed) 100%);
    --favorites-empty-btn-border: rgba(var(--color-green-light-rgb), 0.50);
    --favorites-empty-btn-shadow: 0 8px 20px rgba(var(--accent-rgb), 0.28);

    --event-trophy-bg: rgba(var(--color-green-primary-rgb), 0.12);
    --event-trophy-border: rgba(var(--color-green-light-rgb), 0.35);
    --event-card-border: rgba(255, 255, 255, 0.08);
    --event-divider: rgba(255, 255, 255, 0.10);
    --event-title: var(--text-primary);
    --event-label: var(--text-secondary);
    --event-muted: var(--text-muted);
    --event-stat-label: var(--text-soft);
    --event-cta-bg: var(--gradient-primary);
    --event-cta-color: var(--color-text-white);
    --event-progress-track: rgba(0, 0, 0, 0.28);

    --withdraw-progress-bg: rgba(4, 13, 8, 0.85);
    --withdraw-progress-border: rgba(255, 255, 255, 0.10);
    --withdraw-progress-track: rgba(0, 0, 0, 0.25);
    --withdraw-progress-fill: linear-gradient(90deg, #24c8ff 0%, #39de8e 100%);
    --withdraw-progress-stat-bg: rgba(255, 255, 255, 0.04);
    --withdraw-progress-label: #8b9e94;
    --withdraw-progress-value: var(--text-primary);
    --withdraw-progress-note: #8b9e94;

    --challenge-filter-bg: rgba(4, 13, 8, 0.65);
    --challenge-filter-border: rgba(255, 255, 255, 0.10);
    --challenge-filter-text: #8b9e94;
    --challenge-filter-text-hover: var(--text-primary);
    --challenge-filter-active-bg: var(--linearbg);
    --challenge-filter-active-text: var(--text-primary);
    --challenge-filter-active-ring: rgba(var(--accent-rgb), 0.36);

    --challenge-card-radius: var(--radius-sm);
    --challenge-card-bg: radial-gradient(120% 80% at 8% -10%, rgba(var(--accent-rgb), 0.25) 0%, rgba(var(--accent-rgb), 0) 58%),
        radial-gradient(90% 70% at 100% 100%, rgba(var(--accent-rgb), 0.2) 0%, rgba(var(--accent-rgb), 0) 64%),
        linear-gradient(160deg, var(--color-surface-3) 0%, var(--color-surface-3) 42%, var(--color-surface-2) 100%);
    --challenge-card-shadow: 0 10px 24px rgba(0, 0, 0, 0.32), inset 0 0 0 1px rgba(255, 255, 255, 0.05);
    --challenge-card-sheen: linear-gradient(135deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0) 38%),
        repeating-linear-gradient(-35deg, rgba(255, 255, 255, 0.02) 0 2px, rgba(255, 255, 255, 0) 2px 14px);
    --challenge-card-overlay-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06), inset 0 -42px 60px rgba(2, 6, 4, 0.45);
    --challenge-image-fallback: var(--color-surface-3);

    --challenge-title: var(--text-primary);
    --challenge-target: var(--text-secondary);
    --challenge-label: var(--text-muted);
    --challenge-value: var(--text-primary);
    --challenge-author: var(--text-primary);
    --challenge-claimed-divider: rgba(255, 255, 255, 0.10);

    --challenge-completed-ring: rgba(var(--success-rgb), 0.24);
    --challenge-completed-bg: linear-gradient(180deg, rgba(var(--success-rgb), 0.16) 0%, rgba(var(--success-rgb), 0.1) 100%);
    --challenge-control-label: var(--text-muted);
    --challenge-control-btn-bg: rgba(4, 13, 8, 0.92);
    --challenge-control-btn-border: rgba(255, 255, 255, 0.10);
    --challenge-control-btn-text: var(--text-primary);
    --challenge-control-btn-icon: var(--text-secondary);
    --challenge-control-badge-bg: rgba(var(--accent-rgb), 0.18);
    --challenge-control-badge-border: rgba(var(--accent-rgb), 0.35);
    --challenge-control-badge-text: color-mix(in srgb, var(--color-green-light) 70%, #fff 30%);
    --challenge-dropdown-bg: var(--color-surface-3);
    --challenge-dropdown-text: #f1f5f9;
    --challenge-dropdown-border: rgba(255, 255, 255, 0.10);
    --challenge-dropdown-divider: rgba(255, 255, 255, 0.08);
    --challenge-dropdown-item-hover: rgba(255, 255, 255, 0.06);
    --challenge-dropdown-shadow: 0 14px 40px rgba(0, 0, 0, 0.45);
    --challenge-dropdown-active: var(--color-green-light);
    --challenge-provider-pill-bg: linear-gradient(
        to right,
        color-mix(in srgb, var(--color-green-primary) 90%, #000 10%) 0%,
        var(--color-green-hover) 100%
    );
    --challenge-provider-pill-text: var(--color-text-white);

    --tournament-button-bg: linear-gradient(
        180deg,
        color-mix(in srgb, var(--color-green-primary) 86%, #ffffff 14%) 0%,
        color-mix(in srgb, var(--color-green-primary) 84%, #000000 16%) 100%
    );
    --tournament-button-border: rgba(var(--accent-rgb), 0.54);
    --tournament-button-color: var(--color-text-white);
    --tournament-button-radius: var(--radius-2xs);
    --tournament-button-shadow: 0 8px 22px rgba(var(--accent-rgb), 0.34);
    --tournament-button-hover-filter: brightness(1.05);

    --focus-ring: 0 0 0 3px rgba(var(--color-green-light-rgb), 0.25) !important;
    --divider: var(--surface-border-soft);
    --footer-bg: var(--color-bg-global) !important;

    --notif-badge-bg: var(--color-green-hover) !important;
    --notif-badge-border: rgba(255, 255, 255, 0.55) !important;
    --notif-panel-bg: var(--lineartooltipbg);
    --notif-panel-border: rgba(255, 255, 255, 0.08);
    --notif-panel-shadow: 0 16px 40px rgba(0, 0, 0, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.06);
    --notif-empty-bg: rgba(100, 116, 139, 0.16);
    --notif-empty-border: rgba(255, 255, 255, 0.08);
    --notif-item-bg: rgba(100, 116, 139, 0.14);
    --notif-item-bg-hover: rgba(100, 116, 139, 0.18);
    --notif-item-border: rgba(255, 255, 255, 0.08);
    --notif-item-border-hover: rgba(255, 255, 255, 0.14);
    --notif-track-thumb: rgba(255, 255, 255, 0.1);

    --wgs-text: rgba(255, 255, 255, 0.92);
    --wgs-muted: rgba(255, 255, 255, 0.55);
    --wgs-panel-bg: rgba(5, 15, 10, 0.75);
    --wgs-panel-border: rgba(255, 255, 255, 0.05);
    --wgs-block-bg: rgba(255, 255, 255, 0.03);
    --wgs-block-bg-hover: rgba(255, 255, 255, 0.04);
    --wgs-block-border: rgba(255, 255, 255, 0.06);
    --wgs-switch-on-bg: rgba(var(--accent-rgb), 0.14);
    --wgs-switch-on-border: rgba(var(--accent-rgb), 0.28);
    --wgs-switch-knob: rgba(255, 255, 255, 0.35);
    --wgs-switch-knob-on: rgba(var(--color-green-light-rgb), 0.9);
    --wgs-dot-bg: rgba(var(--accent-rgb), 0.1);
    --wgs-dot-border: rgba(var(--accent-rgb), 0.15);
    --wgs-dot-ring: rgba(var(--accent-rgb), 0.25);
    --wgs-save-border: rgba(var(--success-rgb), 0.22);
    --wgs-save-bg: linear-gradient(90deg, rgba(14, 58, 45, 0.92), rgba(var(--success-rgb), 0.45));

    --sb-surface-1: #040d08 !important;
    --sb-surface-2: var(--color-bg-global) !important;
    --sb-card-soft: rgba(255, 255, 255, 0.045) !important;
    --sb-btn-active-bg: linear-gradient(90deg, rgba(var(--color-green-primary-rgb), 0.5) 0%, rgba(255, 255, 255, 0.03) 100%) !important;
    --sb-btn-active-border: rgba(var(--color-green-hover-rgb), 0.75) !important;
    --sb-btn-active-shadow: 0 6px 20px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
    --sb-section-line: linear-gradient(90deg, transparent, rgba(var(--color-green-hover-rgb), 0.7), transparent) !important;
    --sb-accordion-bg: #0a1e14 !important;
    --sb-accordion-border: rgba(255, 255, 255, 0.07) !important;
    --sb-accordion-shadow: 0 4px 22px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
    --sb-collapsed-bg: radial-gradient(380px 220px at 0 0, rgba(var(--color-green-primary-rgb), 0.22), transparent 62%),
        linear-gradient(180deg, #040d08 0%, #020804 100%) !important;
    --sb-collapsed-border: 1px solid rgba(255, 255, 255, 0.08) !important;
    --sb-collapsed-shadow: 0 16px 40px rgba(0, 0, 0, 0.38), inset -1px 0 rgba(255, 255, 255, 0.035) !important;
    --sb-collapsed-btn-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.02)) !important;
    --sb-collapsed-btn-border: 1px solid rgba(255, 255, 255, 0.08) !important;

    --sidebar-width: 260px;
    --sidebar-rail-width: 78px;
    --sidebar-z: 2000;
    --sidebar-ease: cubic-bezier(.2, .9, .2, 1);

    --sidebar-bg-open: linear-gradient(180deg, #040d08 0%, #000000 100%) !important;
    --sidebar-bg-open-accent: rgba(var(--color-green-primary-rgb), .3) !important;
    --sidebar-bg-open-secondary: rgba(var(--color-green-hover-rgb), .14) !important;

    --sidebar-bg-collapsed: linear-gradient(180deg, #030a06 0%, #000000 100%) !important;
    --sidebar-bg-collapsed-accent: rgba(var(--color-green-primary-rgb), 0.32) !important;

    --sidebar-bg-active: linear-gradient(180deg, #0c1e14 0%, #040d08 100%) !important;
    --sidebar-bg-active-accent: rgba(var(--color-green-primary-rgb), 0.35) !important;
    --sidebar-bg-active-secondary: rgba(var(--color-green-hover-rgb), 0.16) !important;

    --sidebar-stroke: rgba(255, 255, 255, .06) !important;
    --sidebar-stroke-strong: rgba(255, 255, 255, .10) !important;
    --sidebar-stroke-accent: rgba(var(--color-green-hover-rgb), .7) !important;
    --sidebar-text: #fff !important;
    --sidebar-text-muted: #fff !important;
    --sidebar-text-soft: #bdc8c2 !important;

    --sidebar-chip: rgba(255, 255, 255, .05) !important;
    --sidebar-chip-2: rgba(255, 255, 255, .03) !important;
    --sidebar-chip-stroke: rgba(255, 255, 255, .08) !important;

    --sidebar-shadow: 0 30px 70px rgba(0, 0, 0, .55) !important;
    --sidebar-shadow-soft: 0 14px 30px rgba(0, 0, 0, .28) !important;
    --sidebar-active-glow: 0 0 0 1px rgba(var(--color-green-hover-rgb), .55) !important;

    --sidebar-overlay: rgba(0, 0, 0, .60) !important;

    --sidebar-search-bg: radial-gradient(420px 120px at 15% 0%, rgba(var(--color-green-primary-rgb), .18), transparent 60%),
        linear-gradient(180deg, rgba(255, 255, 255, .06), rgba(255, 255, 255, .02)) !important;
    --sidebar-search-text: var(--sidebar-text-muted) !important;

    --sidebar-promo-bg: rgba(255, 255, 255, .03) !important;
    --sidebar-promo-border: rgba(255, 255, 255, .07) !important;
    --sidebar-promo-item-bg: rgba(0, 0, 0, .14) !important;
    --sidebar-promo-item-bg-hover: rgba(0, 0, 0, .20) !important;
    --sidebar-promo-dot: var(--color-green-hover) !important;
    --sidebar-promo-dot-glow: rgba(var(--color-green-hover-rgb), .2) !important;
    --sidebar-hero-glow: linear-gradient(90deg, #071a10 0%, var(--color-green-primary) 100%) !important;

    --sidebar-top-btn-border: rgba(255, 255, 255, 0.07) !important;
    --sidebar-top-btn-bg: linear-gradient(95deg, rgba(var(--color-green-primary-rgb), 0.28) 0%, rgba(0, 0, 0, 0.5) 100%) !important;
    --sidebar-top-btn-shadow: 0 14px 26px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
    --sidebar-top-btn-title: rgba(255, 255, 255, 0.94) !important;
    --sidebar-top-btn-arrow: rgba(255, 255, 255, 0.7) !important;

    --sidebar-top-btn-hover-border: rgba(var(--color-green-hover-rgb), 0.6) !important;
    --sidebar-top-btn-hover-shadow: 0 18px 30px rgba(0, 0, 0, 0.36), 0 0 0 1px rgba(var(--color-green-hover-rgb), 0.3) !important;

    --sidebar-top-btn-active-border: rgba(var(--color-green-hover-rgb), 0.85) !important;
    --sidebar-top-btn-active-bg: linear-gradient(95deg, rgba(var(--color-green-primary-rgb), 0.6) 0%, rgba(var(--color-green-primary-rgb), 0.35) 100%) !important;
    --sidebar-top-btn-active-shadow: 0 18px 34px rgba(0, 0, 0, 0.4), 0 0 0 1px rgba(var(--color-green-hover-rgb), 0.4) !important;

    --general-tabs-text: #8b9e94 !important;
    --general-tabs-active-text: var(--color-text-white) !important;
    --general-tabs-active-font: "Rubik Bold";

    --page-header-radius: 4px;
    --page-header-bg: var(--linearbg);
    --page-header-shadow: 0 18px 60px rgba(0, 0, 0, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.08);
    --page-header-top-line: linear-gradient(90deg, rgba(var(--accent-rgb), 0), rgba(var(--accent-rgb), 0.55), rgba(var(--accent-rgb), 0));
    --page-header-title-color: rgba(255, 255, 255, 0.96);
    --page-header-subtitle-color: rgba(255, 255, 255, 0.65);
    --page-header-icon-color: #0e1017;

    --settings-sidebar-bg: rgba(4, 13, 8, 0.9);
    --settings-sidebar-border: rgba(var(--color-green-primary-rgb), 0.35);
    --settings-sidebar-shadow: 0 18px 36px rgba(0, 0, 0, 0.34);
    --settings-sidebar-radius: 12px;
    --settings-sidebar-select-bg: rgba(255, 255, 255, 0.03);
    --settings-sidebar-item-radius: 8px;
    --settings-sidebar-item-color: rgba(223, 248, 236, 0.84);
    --settings-sidebar-item-active-bg: linear-gradient(120deg, rgba(var(--accent-rgb), 0.24), rgba(var(--accent-rgb), 0.08));
    --settings-sidebar-active-color: #f4fff9;

    --settings-content-bg: rgba(3, 10, 6, 0.86);
    --settings-content-border: rgba(var(--color-green-primary-rgb), 0.3);
    --settings-content-shadow: 0 24px 48px rgba(0, 0, 0, 0.36);
    --settings-content-radius: 12px;

    --settings-block-bg: rgba(5, 15, 10, 0.82);
    --settings-block-border: rgba(var(--color-green-primary-rgb), 0.28);
    --settings-block-divider: rgba(var(--color-green-primary-rgb), 0.22);
    --settings-block-header-bg: transparent;
    --settings-block-radius: 10px;
    --settings-block-title-color: rgba(244, 255, 249, 0.96);
    --settings-block-desc-color: rgba(194, 230, 214, 0.78);

    --settings-field-title-color: rgba(227, 250, 240, 0.9);
    --settings-control-bg: rgba(3, 10, 6, 0.72);
    --settings-control-border: rgba(var(--color-green-primary-rgb), 0.35);
    --settings-control-color: rgba(241, 255, 248, 0.95);
    --settings-control-radius: 8px;

    --settings-check-title-color: rgba(240, 255, 248, 0.94);
    --settings-check-desc-color: rgba(187, 230, 209, 0.74);

    --blog-detail-shell-border: rgba(255, 255, 255, 0.08);
    --blog-detail-shell-radius: 12px;
    --blog-detail-shell-bg: linear-gradient(180deg, rgba(4, 13, 8, 0.94), rgba(4, 13, 8, 0.84));
    --blog-detail-shell-shadow: 0 24px 50px rgba(0, 0, 0, 0.36);
    --blog-detail-title-color: #fff;
    --blog-detail-content-color: rgba(255, 255, 255, 0.88);

    --policies-content-bg: rgba(4, 13, 8, 0.86);
    --policies-content-color: var(--text-secondary);
    --policies-link-color: var(--color-green-light);
    --policies-heading-color: #fff;

    --promotion-hover-panel-bg: linear-gradient(180deg, rgba(7, 20, 14, 0.94), rgba(4, 13, 8, 0.96));
    --promotion-hover-panel-pattern: radial-gradient(620px 240px at 80% 20%, rgba(255, 255, 255, 0.04), transparent 66%);
    --promotion-hover-title-color: rgba(255, 255, 255, 0.96);
    --promotion-hover-desc-color: rgba(184, 220, 204, 0.78);
    --promotion-bottom-icon-color: var(--text-primary);
    --promotion-bottom-info-color: var(--text-muted);

    --activeborder: 1px solid rgba(var(--color-green-hover-rgb), 0.4) !important;
    --activebordercolor: rgba(var(--color-green-hover-rgb), 0.4) !important;
    --activeshadow: 0 10px 28px rgba(var(--color-green-primary-rgb), 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
    --toastify-color-progress-info: var(--color-green-light) !important;
    --toastify-color-progress-dark: var(--color-green-light) !important;

    --header-logo-visual-height: 70px !important;
    --header-logo-shift-y: -4px !important;
    --header-logo-visual-max-width: 200px !important;

    --header-bg: var(--color-bg-tinted) !important;
    --header-bg-rgb: 1, 13, 8 !important;
    --sidebar-bg-solid: var(--color-surface-1) !important;

    --input-border-hover: rgba(255, 255, 255, 0.20) !important;

    --sidebar-nav-radius: 10px !important;
    --sidebar-nav-radius-sm: 8px !important;
    --sidebar-nav-gap: 4px !important;
    --sidebar-nav-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.01)) !important;
    --sidebar-nav-bg-hover: linear-gradient(180deg, rgba(var(--color-green-primary-rgb), 0.10), rgba(var(--color-green-primary-rgb), 0.03)) !important;
    --sidebar-nav-bg-active: linear-gradient(95deg, rgba(var(--color-green-primary-rgb), 0.22) 0%, rgba(255, 255, 255, 0.03) 55%, rgba(255, 255, 255, 0.01) 100%) !important;
    --sidebar-nav-border: rgba(255, 255, 255, 0.06) !important;
    --sidebar-nav-border-hover: rgba(var(--color-green-hover-rgb), 0.30) !important;
    --sidebar-nav-border-active: rgba(var(--color-green-light-rgb), 0.48) !important;
    --sidebar-nav-shadow: 0 2px 10px rgba(0, 0, 0, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
    --sidebar-nav-shadow-hover: 0 6px 18px rgba(0, 0, 0, 0.30), 0 0 0 1px rgba(var(--color-green-primary-rgb), 0.10) !important;
    --sidebar-nav-accent-bar: 3px !important;
    --sidebar-divider-height: 1px !important;
    --sidebar-divider-bg: linear-gradient(90deg, transparent 0%, rgba(var(--color-green-hover-rgb), 0.40) 50%, transparent 100%) !important;
    --sidebar-search-radius: 10px !important;
    --sidebar-search-border: rgba(var(--color-green-primary-rgb), 0.28) !important;
    --sidebar-search-shadow: 0 4px 16px rgba(0, 0, 0, 0.30), inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
    --sidebar-top-tabs-gap: 8px !important;
    --sidebar-top-tab-radius: 10px !important;

    --blog-detail-empty-border: rgba(255, 255, 255, 0.14) !important;
    --blog-detail-empty-color: rgba(255, 255, 255, 0.80) !important;
    --blog-detail-card-bg: rgba(255, 255, 255, 0.02) !important;
    --blog-detail-close-border: rgba(255, 255, 255, 0.12) !important;
    --blog-detail-close-bg: rgba(255, 255, 255, 0.04) !important;
    --blog-detail-close-color: rgba(255, 255, 255, 0.88) !important;
    --blog-detail-close-border-hover: rgba(255, 255, 255, 0.24) !important;
    --blog-detail-close-bg-hover: rgba(255, 255, 255, 0.08) !important;
    --blog-detail-image-border: rgba(255, 255, 255, 0.07) !important;
    --blog-detail-lead-color: rgba(255, 255, 255, 0.80) !important;
    --blog-detail-time-color: rgba(255, 255, 255, 0.50) !important;

    --bs-primary: var(--color-green-primary) !important;
    --bs-primary-rgb: var(--color-green-primary-rgb) !important;
    --bs-btn-bg: var(--color-green-primary) !important;
    --bs-btn-border-color: var(--color-green-primary) !important;
    --bs-btn-hover-bg: var(--color-green-hover) !important;
    --bs-btn-hover-border-color: var(--color-green-hover) !important;
    --bs-btn-active-bg: var(--color-green-pressed) !important;
    --bs-btn-color: #ffffff !important;
    --bs-btn-hover-color: #ffffff !important;
    --bs-btn-active-color: #ffffff !important;

    accent-color: var(--color-green-light);
}

html {
    background-color: #010d08 !important;
}

body {
    background: #010d08 !important;
}

body::before {
    content: "" !important;
    position: fixed !important;
    inset: 0 !important;
    z-index: -1 !important;
    pointer-events: none !important;
    background:
        radial-gradient(1200px 640px at 50% -12%, rgba(var(--color-green-primary-rgb), 0.16), transparent 62%),
        radial-gradient(900px 500px at 100% 108%, rgba(var(--color-green-primary-rgb), 0.07), transparent 55%),
        #010d08 !important;
}

.hero-area-slider {
    --hero-accent: var(--accent);
    --hero-accent-rgb: var(--accent-rgb);

    --hero-pagination-dot: var(--slider-pagination-dot);

}

::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: var(--color-surface-1) !important; border-radius: 999px; }
::-webkit-scrollbar-thumb { background: linear-gradient(180deg, var(--color-green-hover), var(--color-green-deep)) !important; border-radius: 999px !important; }
::-webkit-scrollbar-thumb:hover { background: var(--color-green-light) !important; }

::selection { background: rgba(var(--color-green-primary-rgb), 0.65) !important; color: #fff !important; }

a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible,
textarea:focus-visible, [role="button"]:focus-visible, [tabindex]:focus-visible,
.button:focus-visible, .category:focus-visible,
.cb-gamefinder__btn:focus-visible, .cb-gamefinder__retry:focus-visible,
.cb-gamefinder__thumb:focus-visible, .cb-quickaccess__card:focus-visible,
.cb-quickaccess__cta:focus-visible, .cb-quickaccess__socials a:focus-visible,
.cb-sbfooter__social:focus-visible,
#responsive-menu .sb-top-btn:focus-visible, #responsive-menu .cb-sbaction:focus-visible,
#responsive-menu .sl-acc__head:focus-visible, #responsive-menu .menu a:focus-visible,
#responsive-menu .to-search-modal:focus-visible, #responsive-menu .sidebar-lang-trigger:focus-visible {
    outline: 2px solid var(--color-green-light) !important;
    outline-offset: 3px !important;
}

a, button, .button, [role="button"], .menu-item, .category, .chip, .tab, .nav-link {
    transition: background-color 0.3s ease, border-color 0.3s ease,
        color 0.3s ease, box-shadow 0.3s ease, filter 0.3s ease;
}
@media (prefers-reduced-motion: reduce) {
    a, button, .button, [role="button"], .menu-item, .category, .chip, .tab, .nav-link { transition: none; }
}

@-webkit-keyframes cb-border-sweep { to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }
@keyframes cb-border-sweep { to { transform: rotate(360deg); } }

@-webkit-keyframes cb-shine-slide {
    0%, 60%, 100% { -webkit-transform: translateX(-120%) rotate(-25deg); transform: translateX(-120%) rotate(-25deg); }
    25%, 40%      { -webkit-transform: translateX(120%) rotate(-25deg); transform: translateX(120%) rotate(-25deg); }
}
@keyframes cb-shine-slide {
    0%, 60%, 100% { transform: translateX(-120%) rotate(-25deg); }
    25%, 40%      { transform: translateX(120%) rotate(-25deg); }
}

@-webkit-keyframes premiumShine {
    0%, 55%  { -webkit-transform: translateX(-200%) rotate(-20deg); transform: translateX(-200%) rotate(-20deg); opacity: 0; }
    65%      { opacity: 1; }
    90%      { -webkit-transform: translateX(200%) rotate(-20deg); transform: translateX(200%) rotate(-20deg); opacity: 0.15; }
    100%     { -webkit-transform: translateX(200%) rotate(-20deg); transform: translateX(200%) rotate(-20deg); opacity: 0; }
}
@keyframes premiumShine {
    0%, 55%  { transform: translateX(-200%) rotate(-20deg); opacity: 0; }
    65%      { opacity: 1; }
    90%      { transform: translateX(200%) rotate(-20deg); opacity: 0.15; }
    100%     { transform: translateX(200%) rotate(-20deg); opacity: 0; }
}

#responsive-menu .p2tabs .p2seg {
    border-radius: 10px !important;
    border: 2px solid rgba(var(--color-green-primary-rgb), 0.4) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25) !important;
    transition: border-color 0.35s ease, box-shadow 0.35s ease, background 0.35s ease, transform 0.25s ease !important;
}

#responsive-menu .p2tabs .p2seg.active,
#responsive-menu .p2tabs .p2seg[aria-selected="true"] {
    background: linear-gradient(180deg, var(--color-green-hover), var(--color-green-deep)) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.6) !important;
    box-shadow: 0 0 14px rgba(var(--color-green-light-rgb), 0.2), 0 6px 16px rgba(0, 0, 0, 0.3) !important;
}

#responsive-menu .p2tabs .p2seg.active:hover,
#responsive-menu .p2tabs .p2seg[aria-selected="true"]:hover {
    border-color: rgba(var(--color-green-light-rgb), 0.85) !important;
    box-shadow: 0 0 22px rgba(var(--color-green-light-rgb), 0.3), 0 8px 22px rgba(0, 0, 0, 0.35) !important;
    transform: translateY(-2px) !important;
}

#responsive-menu .p2tabs .p2seg.active,
#responsive-menu .p2tabs .p2seg[aria-selected="true"] {
    background: linear-gradient(180deg, var(--color-green-hover), var(--color-green-deep)) !important;
}

#responsive-menu .p2tabs .p2seg:not(.active):not([aria-selected="true"]) {
    background: var(--color-surface-2) !important;
}

#responsive-menu .p2tabs .p2seg:hover {
    border-color: rgba(var(--color-green-light-rgb), 0.7) !important;
    box-shadow: 0 0 18px rgba(var(--color-green-light-rgb), 0.25), 0 8px 20px rgba(0, 0, 0, 0.3) !important;
    transform: translateY(-2px) !important;
}

.p2seg.casino .p2bg,
.p2seg.sportsbook .p2bg {
    background-image: none !important;
    background: linear-gradient(90deg, rgba(2, 83, 40, .13), rgba(255, 255, 255, .025)) !important;
    border-color: rgba(3, 112, 53, .32) !important;
    box-shadow: 0 7px 20px rgba(0, 0, 0, .24), inset 0 1px 0 rgba(255, 255, 255, .035) !important;
}

.p2seg.casino:hover .p2bg,
.p2seg.sportsbook:hover .p2bg {
    background-image: none !important;
    border-color: rgba(16, 180, 97, .55) !important;
}

.p2seg.casino.active .p2content, .p2seg.sportsbook.active .p2content,
.p2seg.casino.selected .p2content, .p2seg.sportsbook.selected .p2content,
.p2seg.casino.is-active .p2content, .p2seg.sportsbook.is-active .p2content,
.p2seg.casino[aria-selected="true"] .p2content, .p2seg.sportsbook[aria-selected="true"] .p2content,
.p2seg.casino[aria-pressed="true"] .p2content, .p2seg.sportsbook[aria-pressed="true"] .p2content,
.p2seg.casino.active .p2bgIcon, .p2seg.sportsbook.active .p2bgIcon,
.p2seg.casino.selected .p2bgIcon, .p2seg.sportsbook.selected .p2bgIcon,
.p2seg.casino.is-active .p2bgIcon, .p2seg.sportsbook.is-active .p2bgIcon,
.p2seg.casino[aria-selected="true"] .p2bgIcon, .p2seg.sportsbook[aria-selected="true"] .p2bgIcon,
.p2seg.casino[aria-pressed="true"] .p2bgIcon, .p2seg.sportsbook[aria-pressed="true"] .p2bgIcon {
    color: #34d87a !important;
}

.p2seg.casino:focus-visible,
.p2seg.sportsbook:focus-visible {
    border-color: #10b461 !important;
    box-shadow: 0 0 0 3px rgba(2, 83, 40, 0.14), 0 0 14px rgba(16, 180, 97, 0.2) !important;
}

.button.register, .p2seg { position: relative !important; overflow: hidden !important; }

.button.register::after, .p2seg::after {
    content: "";
    position: absolute;
    top: -40%;
    left: 0;
    width: 45%;
    height: 220%;
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(255,255,255,.06) 30%,
        rgba(255,255,255,.4) 48%,
        rgba(255,255,255,.6) 50%,
        rgba(255,255,255,.4) 52%,
        rgba(255,255,255,.06) 70%,
        transparent 100%
    );
    pointer-events: none;
    will-change: transform, opacity;
    transform: translateX(-200%) rotate(-20deg);
    -webkit-animation: premiumShine 7s ease-in-out infinite;
    animation: premiumShine 7s ease-in-out infinite;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 2px !important;
    padding: 5px 5px !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    background: var(--color-green-deep) !important;
    isolation: isolate !important;
    transition: padding 0.35s ease, gap 0.35s ease !important;
}

    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a,
    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button.register {
        font-size: 11px !important;
        padding: 6px 10px !important;
        border-radius: 8px !important;
        height:35px !important;
    }

header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons::before {
    display: none !important;
    content: none !important;
    animation: none !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons::after {
    content: "" !important; position: absolute !important;
    inset: 2px !important; z-index: 0 !important;
    border-radius: 12px !important;
    background: #040c07 !important;
    pointer-events: none !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons > * {
    position: relative !important; z-index: 1 !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button:not(.register) {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0.03) 100%) !important;
    color: var(--color-text-white) !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-radius: 10px !important;
    font-weight: 700 !important;
    position: relative !important; overflow: hidden !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    transition: background 0.3s ease, border-color 0.3s ease !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button:not(.register)::after {
    display: none !important;
    content: none !important;
    animation: none !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button:not(.register):hover {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.14) 0%, rgba(255, 255, 255, 0.055) 100%) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.55) !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button.register {
    background: var(--color-green-primary) !important;
    color: var(--color-text-white) !important;
    border: 1px solid rgba(var(--color-green-light-rgb), 0.4) !important;
    border-radius: 10px !important;
    font-weight: 700 !important;
    transition: background 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button.register:hover {
    background: var(--color-green-hover) !important;
    border-color: var(--color-green-light) !important;
    box-shadow: 0 6px 18px rgba(var(--color-green-primary-rgb), 0.4) !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button.register {
    position: relative !important;
    overflow: hidden !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button.register::after {
    content: "";
    position: absolute;
    top: -50%;
    left: 0;
    width: 50%;
    height: 250%;
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(255,255,255,.05) 30%,
        rgba(255,255,255,.3) 48%,
        rgba(255,255,255,.45) 50%,
        rgba(255,255,255,.3) 52%,
        rgba(255,255,255,.05) 70%,
        transparent 100%
    );
    pointer-events: none;
    z-index: 2;
    will-change: transform, opacity;
    transform: translateX(-200%) rotate(-20deg);
    -webkit-animation: premiumShine 5s ease-in-out infinite;
    animation: premiumShine 5s ease-in-out infinite;
}

header#header, header#header .middle-header, header#header .middle-header-container {
    background: var(--color-bg-tinted) !important;
}

header#header {
    border-bottom: 1px solid rgba(var(--color-green-primary-rgb), 0.85) !important;
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.52) !important;
    position: relative !important;
    z-index: 99 !important;
}

header#header:before { background: linear-gradient(to left, #0000, #010d08 100%); }

header#header div.middle-header { min-height: 58px !important; height: 58px !important; position: relative !important; }

header#header div.middle-header div.middle-header-container {
    padding-top: 0 !important; padding-bottom: 0 !important;
    min-height: 58px !important; height: 58px !important;
    align-items: center !important; position: static !important;
}

@media screen and (max-width: 768px) {
    header#header { position: fixed; width: 100%; top: 0; left: 0; }
    main, [role="main"], body.sportsbook-page header#header + div {}
}

header#header .logo a { display: flex !important; justify-content: center; align-items: center; }
header#header .logo a img { position: unset !important; transform: unset !important; }

@media screen and (max-width: 1199px) {
    header#header div.middle-header div.middle-header-container div.logo { left: 0 !important; }
    header#header div.middle-header div.middle-header-container div.responsive-logo { top: 5px !important; left: 0 !important; transform: none !important; }

}

header#header div.middle-header div.middle-header-container div.categories a.category {
    border: 1px solid transparent !important; border-radius: 8px !important;
    transition: background 0.3s ease, border-color 0.3s ease !important;
}

header#header div.middle-header div.middle-header-container div.categories a.category:hover,
header#header div.middle-header div.middle-header-container div.categories a.category.active {
    background: rgba(var(--color-green-primary-rgb), 0.35) !important;
    border-color: rgba(var(--color-green-hover-rgb), 0.7) !important;
}

header#header div.middle-header div.middle-header-container div.categories a.category:hover span.text,
header#header div.middle-header div.middle-header-container div.categories a.category.active span.text {
    color: var(--color-text-white) !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.current-wallet a.wallet-button {
    color: var(--wallet-btn-color) !important;
    background: var(--wallet-btn-gradient) !important;
    border: 1px solid rgba(var(--color-green-primary-rgb), 0.8) !important;
    border-radius: var(--radius-sm) !important;
    transition: filter 0.3s ease, border-color 0.3s ease !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.current-wallet a.wallet-button:hover {
    filter: brightness(1.15) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.55) !important;
}

.button.register, .btn-primary, button[type="submit"], .register-button,
.common-form-button .button,
form.general-form div.form-buttons button,
.auth div.auth-box form.auth-form div.form-buttons button,
.auth-modal .modal-dialog .modal-content .modal-box form.auth-form div.form-buttons button {
    background: var(--color-green-primary) !important;
    color: var(--color-text-white) !important;
    border: 1px solid var(--color-green-primary) !important;
    border-radius: 9px !important; font-weight: 700 !important;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.35) !important;
    transition: background 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease !important;
}

.button.register:hover, .btn-primary:hover, button[type="submit"]:hover, .register-button:hover,
.common-form-button .button:hover, form.general-form div.form-buttons button:hover,
.auth div.auth-box form.auth-form div.form-buttons button:hover,
.auth-modal .modal-dialog .modal-content .modal-box form.auth-form div.form-buttons button:hover {
    background: var(--color-green-hover) !important;
    box-shadow: 0 10px 28px rgba(var(--color-green-primary-rgb), 0.4) !important;
}

.button.register:active, .btn-primary:active, button[type="submit"]:active,
.common-form-button .button:active, form.general-form div.form-buttons button:active,
.auth div.auth-box form.auth-form div.form-buttons button:active,
.auth-modal .modal-dialog .modal-content .modal-box form.auth-form div.form-buttons button:active {
    background: var(--color-green-pressed) !important;
}

header#header a.button.register:hover, .btn-primary:hover,
.common-form-button .button:hover, .game-item .game-opener .button:hover {
    color: #ffffff !important;
}

.btn-secondary, .button.secondary, .button.login {
    background: var(--color-login-bg) !important; color: var(--color-text-white) !important;
    border: 1px solid var(--color-green-primary) !important; border-radius: 9px !important;
    transition: background 0.3s ease, border-color 0.3s ease !important;
}

.btn-secondary:hover, .button.secondary:hover, .button.login:hover {
    background: var(--color-login-bg-hover) !important;
    border-color: var(--color-green-light) !important;
}

.auth-modal .modal-dialog .modal-content .modal-box form.auth-form div.form-group div.form-item input,
form.general-form div.form-group div.form-item input,
form.general-form div.form-group div.form-item select,
.main-search .search-form input, .phone-input, .phone-input input,
input, select, textarea, .search input, .search-box input {
    background: var(--input-bg) !important;
    border: 1px solid var(--input-border) !important;
    border-radius: var(--radius-xs) !important;
    color: var(--text-primary) !important;
    transition: border-color 0.3s ease, box-shadow 0.3s ease !important;
}

input::placeholder, select::placeholder, textarea::placeholder,
.main-search .search-form input::placeholder {
    color: var(--input-placeholder) !important;
}

input:focus, select:focus, textarea:focus {
    border-color: var(--input-border-focus) !important;
    box-shadow: 0 0 0 3px rgba(var(--color-green-light-rgb), 0.18) !important;
    outline: none !important;
}

.modal .modal-dialog .modal-content,
#betModal .modal-dialog .modal-content .modal-body div.wallet-box,
#walletModal .modal-dialog .modal-content .modal-body div.wallet-box,
.auth-modal .modal-dialog .modal-content .modal-body {
    background: var(--modal-bg) !important;
    border: 1px solid var(--modal-border) !important;
    border-radius: var(--modal-radius) !important;
    box-shadow: var(--modal-shadow) !important;
}

.auth-modal .modal-dialog .modal-content .modal-box { background: transparent !important; }

.auth-modal .modal-dialog .modal-content a,
.auth-modal .modal-dialog .modal-content .modal-box .form-links a {
    color: var(--color-green-light) !important; transition: color 0.3s ease !important;
}
.auth-modal .modal-dialog .modal-content a:hover { color: var(--color-green-bright) !important; }

.modal .close, .modal .modal-close, .auth-modal .close {
    color: var(--text-muted) !important; transition: color 0.3s ease !important;
}
.modal .close:hover, .modal .modal-close:hover, .auth-modal .close:hover {
    color: var(--color-text-white) !important;
}

#walletModal .modal-body .wallet-box .wallet-buttons span.button.deposit { background-color: var(--wallet-deposit-bg) !important; color: var(--color-text-white) !important; }
#walletModal .modal-body .wallet-box .wallet-buttons span.button.withdraw { background-image: var(--wallet-withdraw-gradient) !important; color: var(--color-text-white) !important; }
#walletModal .modal-body .wallet-footer a.button { background-color: var(--wallet-footer-btn-bg) !important; color: var(--wallet-footer-btn-color) !important; }

.simple-bets .nav.nav-pills .nav-link.active,
.simple-bets ul li button.active, .simple-bets ul li button[aria-selected="true"],
.faq__chip.is-active, .faq__item.is-active, .ato-btn.is-active {
    background: var(--color-green-primary) !important;
    color: var(--color-text-white) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.55) !important;
}

.faq__chip, .faq__item, .ato-btn {
    border-color: var(--chip-border); background: var(--chip-bg); color: var(--chip-color);
    border-radius: var(--radius-pill);
    transition: background 0.3s ease, border-color 0.3s ease, color 0.3s ease !important;
}

.faq__chip:hover, .faq__item:hover, .ato-btn:hover {
    background: rgba(var(--color-green-primary-rgb), 0.3) !important;
    border-color: rgba(var(--color-green-hover-rgb), 0.7) !important;
    color: var(--color-text-white) !important;
}

.ato-indicator {
    background: var(--color-green-primary) !important;
    border: 1px solid rgba(var(--color-green-light-rgb), 0.4) !important;
    border-radius: var(--radius-xs) !important;
    top:10px !important;
}

div.progress-bar span, .progress-fill, .race-progress .line, .simple-progress .fill,
.ato-indicator, .sidebar .menu .active-indicator, .accordion-menu .active-indicator, .lowbar .indicator {
    background: var(--progressbg) !important; border-radius: 999px !important;
}

.progress-circle .progress-svg circle.circle-bg { stroke: rgba(139, 158, 148, 0.2); }
.progress-circle .progress-svg circle.circle { stroke: var(--color-green-light); }

.game-item {
    position: relative !important;
    border-radius: 12px !important;
    overflow: visible;
    transition: border-color 0.3s ease, box-shadow 0.3s ease, transform 0.3s ease !important;
}
.game-carousel{
    overflow: hidden!important;
}

.game-item div.game-top figure.game-image {
    transition: box-shadow 0.28s ease !important;
}

@media (hover: hover) and (pointer: fine) {
    .game-item div.game-top:hover figure.game-image {
        box-shadow:
            0 0 0 2px rgba(var(--color-green-light-rgb), 0.55),
            0 0 26px rgba(var(--color-green-primary-rgb), 0.4),
            0 18px 40px rgba(0, 0, 0, 0.55) !important;
    }
}

.game-item div.game-top::after {
    content: "";
    position: absolute;
    left: 16%;
    right: 16%;
    bottom: -3px;
    height: 3px;
    border-radius: 999px;
    background: linear-gradient(90deg, transparent, var(--color-green-light), transparent);
    box-shadow: 0 0 12px rgba(var(--color-green-light-rgb), 0.55);
    opacity: 0;
    transform: scaleX(0.35);
    transition: opacity 0.28s ease, transform 0.32s cubic-bezier(.2, .9, .2, 1);
    pointer-events: none;
}

.game-item div.game-top:hover::after {
    opacity: 1;
    transform: scaleX(1);
}

@keyframes cbOpenerIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}

@keyframes cbOpenerBtnIn {
    from { opacity: 0; transform: translateY(10px) scale(0.94); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}

.game-item div.game-top div.game-opener {
    animation: cbOpenerIn 0.22s ease both;
}

.game-item div.game-top div.game-opener div.play-buttons span.button,
.game-item div.game-top div.game-opener div.play-buttons a.button {
    animation: cbOpenerBtnIn 0.3s cubic-bezier(.2, .9, .2, 1) both;
}

.game-item div.game-top div.game-opener div.play-buttons span.button:nth-child(2),
.game-item div.game-top div.game-opener div.play-buttons a.button:nth-child(2) {
    animation-delay: 0.06s;
}

.game-item div.game-top div.game-opener div.play-buttons span.button:hover,
.game-item div.game-top div.game-opener div.play-buttons a.button:hover {
    transform: translateY(-2px) scale(1.04) !important;
}

.game-item div.game-top div.game-opener div.play-buttons span.button:active,
.game-item div.game-top div.game-opener div.play-buttons a.button:active {
    transform: translateY(0) scale(0.97) !important;
}

@media (prefers-reduced-motion: reduce) {
    .game-item div.game-top figure.game-image img,
    .game-item div.game-top div.game-opener,
    .game-item div.game-top div.game-opener div.play-buttons span.button,
    .game-item div.game-top div.game-opener div.play-buttons a.button {
        animation: none !important;
        transition: none !important;
        transform: none !important;
    }
}

.game-item div.game-top .favorite { z-index: 50; top: 10px !important; }
.game-item div.game-top figure.game-image img {border-radius: 11px 11px 0 0 !important;}

.game-item div.game-top div.game-opener {
    border-color: rgba(var(--color-green-primary-rgb), 0.85) !important;
    background: var(--game-opener-overlay) !important;
    border-radius: var(--radius-md);
}

.game-item div.game-top div.game-opener div.play-buttons span.button,
.game-item div.game-top div.game-opener div.play-buttons a.button {
    background-color: var(--color-green-primary) !important; color: var(--color-text-white) !important;
    border: 1px solid var(--color-green-primary) !important; border-radius: var(--radius-sm) !important;
    font-weight: 700 !important;
    transition: background-color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease !important;
}

.game-item .game-opener .play-buttons span.button:hover,
.game-item .game-opener .play-buttons a.button:hover {
    background-color: var(--color-green-hover) !important;
    box-shadow: 0 6px 18px rgba(var(--color-green-primary-rgb), 0.4) !important;
}

.game-item .game-opener .play-buttons span.button:active,
.game-item .game-opener .play-buttons a.button:active { background-color: var(--color-green-pressed) !important; }

.game-item .game-opener .play-buttons span.button.demo,
.game-item .game-opener .play-buttons a.button.demo {
    background-color: var(--game-demo-btn-bg) !important; color: var(--game-demo-btn-color) !important; border-color: transparent !important;
}

.game-item .game-details .game-name { color: var(--text-secondary) !important; transition: color 0.3s ease !important; }
.game-item:hover .game-details .game-name { color: var(--color-text-white) !important; }
.game-item .slot2__online .slot2__count { color: var(--color-text-white) !important; }
.game-item .slot2__online .slot2__label { color: var(--text-soft) !important; }

.section-header .section-title .title { color: var(--color-text-white) !important; }

.section-header .section-title {
    position: relative !important;
}

.section-header .section-title .title::before {
    content: "" !important;
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: calc(100% + 48px) !important;
    max-width: 60vw !important;
    height: 46px !important;
    background: radial-gradient(closest-side, rgba(var(--color-green-light-rgb), 0.32), transparent 72%) !important;
    filter: blur(4px) !important;
    pointer-events: none !important;
    z-index: 0 !important;
}

.section-header .section-title .icon,
.section-header .section-title .title {
    position: relative !important;
    z-index: 1 !important;
}

.game-carousel .section-header .section-title .icon {
    display: none !important;
}

.game-carousel .section-header,
.section-carousel-header,
.latestWins .section-header,
div.section-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    flex-wrap: nowrap !important;
}
.game-carousel .section-header .section-title,
.latestWins .section-header .section-title,
div.section-header .section-title {
    min-width: 0 !important;
    flex: 1 1 auto !important;
}
.section-header .section-title .title,
.section-header .section-title .title.one-line-ellipsis {
    display: block !important;
    min-width: 0 !important;
    max-width: none !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    -webkit-line-clamp: none !important;
    line-clamp: none !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
}
.section-header .owl-nav--header {
    position: static !important;
    flex: 0 0 auto !important;
    white-space: nowrap !important;
}

.section-header .owl-nav--header .owl-view-all {
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 8px 16px !important;
    border-radius: 999px !important;
    background: linear-gradient(180deg, rgba(var(--color-green-primary-rgb), 0.28), rgba(var(--color-green-primary-rgb), 0.12)) !important;
    border: 1px solid rgba(var(--color-green-light-rgb), 0.35) !important;
    color: var(--color-green-light) !important;
    font-family: var(--font-family-semibold) !important;
    font-size: 13px !important;
    letter-spacing: 0.02em !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 6px 14px rgba(0, 0, 0, 0.25) !important;
    transition: background 0.25s ease, border-color 0.25s ease, color 0.25s ease, box-shadow 0.25s ease, transform 0.2s ease !important;
}

.section-header .owl-nav--header .owl-view-all:hover {
    background: linear-gradient(180deg, var(--color-green-hover), var(--color-green-primary)) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.75) !important;
    color: #ffffff !important;
    box-shadow: 0 8px 20px rgba(var(--color-green-primary-rgb), 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
    transform: translateY(-1px) !important;
}

.section-header .owl-nav--header .owl-view-all:active {
    transform: translateY(0) scale(0.97) !important;
}

.section-header .owl-nav--header .owl-prev,
.section-header .owl-nav--header .owl-next {
    width: 38px !important;
    height: 38px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 12px !important;
    background: linear-gradient(180deg, var(--color-surface-3), var(--color-surface-1)) !important;
    border: 1px solid rgba(var(--color-green-light-rgb), 0.3) !important;
    color: var(--color-text-white) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 6px 14px rgba(0, 0, 0, 0.3) !important;
    transition: background 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease, transform 0.2s ease !important;
}

.section-header .owl-nav--header .owl-prev:hover,
.section-header .owl-nav--header .owl-next:hover {
    background: linear-gradient(180deg, var(--color-green-hover), var(--color-green-deep)) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.8) !important;
    box-shadow: 0 0 16px rgba(var(--color-green-light-rgb), 0.3), 0 8px 18px rgba(0, 0, 0, 0.35) !important;
}

.section-header .owl-nav--header .owl-prev:hover { transform: translateX(-2px) !important; }
.section-header .owl-nav--header .owl-next:hover { transform: translateX(2px) !important; }

.section-header .owl-nav--header .owl-prev:active,
.section-header .owl-nav--header .owl-next:active { transform: scale(0.94) !important; }

.section-header .owl-nav--header .owl-prev img,
.section-header .owl-nav--header .owl-next img {
    transition: filter 0.25s ease !important;
}

.section-header .owl-nav--header .owl-prev:hover img,
.section-header .owl-nav--header .owl-next:hover img {
    filter: brightness(0) invert(1) !important;
}

.section-header .owl-nav--header .owl-prev::after,
.section-header .owl-nav--header .owl-prev::before,
.section-header .owl-nav--header .owl-next::after,
.section-header .owl-nav--header .owl-next::before {
    filter: brightness(0) invert(1) !important;
}

.section-header .owl-nav--header .owl-prev.disabled,
.section-header .owl-nav--header .owl-next.disabled {
    opacity: 0.35 !important;
    pointer-events: none !important;
    transform: none !important;
}

.game-item, .game-card, .category-item, .home-category-item,
.provider-item, .provider-card, .promotion-item, .bonus-card,
.wallet-box, .league-card, .card, .panel {

    overflow: visible;
    box-shadow: 0 12px 30px rgba(0,0,0,.34) !important;
    transition: transform .24s ease, border-color .24s ease, box-shadow .24s ease !important;
}

.game-item:hover, .game-card:hover, .category-item:hover, .home-category-item:hover,
.provider-item:hover, .provider-card:hover, .promotion-item:hover,
.bonus-card:hover, .league-card:hover {
    transform: translateY(-2px) !important;
    border-color: rgba(16, 180, 97, .56) !important;
    box-shadow: 0 18px 42px rgba(0,0,0,.52), 0 0 24px rgba(2, 83, 40, .08) !important;
}

.simple-category .item-title { color: var(--color-text-white) !important; }

.provider-box .provider-item, .provider-box a {
    background: var(--color-surface-2) !important; border: 1px solid var(--surface-border-soft) !important;
    border-radius: 12px !important; transition: border-color 0.3s ease, box-shadow 0.3s ease !important;
}
.provider-box .provider-item:hover, .provider-box a:hover {
    border-color: rgba(var(--color-green-hover-rgb), 0.75) !important;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.25) !important;
}

main.providers-page .provider-item,
main#main.providers-page .provider-item,
main.providers-page .provider-item__inner,
main#main.providers-page .provider-item__inner,
main.providers-page .provider-item a,
main#main.providers-page .provider-item a {
    background-color: transparent !important;
    background-image: none !important;
}

main.providers-page .provider-item__inner,
main#main.providers-page .provider-item__inner {
    background:
        linear-gradient(165deg, rgba(var(--color-green-primary-rgb), 0.14) 0%, transparent 55%),
        linear-gradient(180deg, var(--color-surface-2) 0%, var(--color-surface-1) 100%) !important;
    border: 1px solid var(--surface-border-soft) !important;
    border-radius: 12px !important;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3) !important;
    transition: border-color 0.28s ease, box-shadow 0.28s ease, transform 0.24s ease !important;
}

main.providers-page .provider-item:hover .provider-item__inner,
main#main.providers-page .provider-item:hover .provider-item__inner {
    border-color: rgba(var(--color-green-hover-rgb), 0.7) !important;
    box-shadow: 0 14px 30px rgba(0, 0, 0, 0.45), 0 0 22px rgba(var(--color-green-primary-rgb), 0.18) !important;
    transform: translateY(-3px) !important;
}

main.providers-page .row,
main#main.providers-page .row {
    margin-left: 0 !important;
    margin-right: 0 !important;
}
main.providers-page [class*="col-"],
main#main.providers-page [class*="col-"] {
    padding-left: 0 !important;
    padding-right: 0 !important;
}
main.providers-page,
main#main.providers-page {
    overflow-x: clip !important;
}

main.providers-page .provider-grid,
main#main.providers-page .provider-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)) !important;
    gap: 12px !important;
    column-gap: 12px !important;
    row-gap: 12px !important;
    width: 100% !important;
    margin: 0 !important;
    justify-content: stretch !important;
}

@media (max-width: 767px) {
    main.providers-page .provider-grid,
    main#main.providers-page .provider-grid {
        gap: 10px !important;
        column-gap: 10px !important;
        row-gap: 10px !important;
    }
    main.providers-page .provider-grid__item,
    main#main.providers-page .provider-grid__item {
        margin: 0 !important;
    }
}
main.providers-page .provider-listing,
main#main.providers-page .provider-listing {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}
main.providers-page .provider-grid__item,
main#main.providers-page .provider-grid__item {
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
}

main.providers-page .container,
main#main.providers-page .container {
    max-width: 100% !important;
}
main.providers-page .row,
main#main.providers-page .row {
    width: 100% !important;
}
main.providers-page .top-streamers,
main#main.providers-page .top-streamers,
main.providers-page .small-streamers,
main#main.providers-page .small-streamers,
main.providers-page .small-streamers > .row,
main#main.providers-page .small-streamers > .row {
    width: 100% !important;
    max-width: none !important;
    flex: 1 1 100% !important;
    min-width: 0 !important;
}
main.providers-page .row > [class*="col-"],
main#main.providers-page .row > [class*="col-"] {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
}

div.race-carousels div.slider-item .race-item div.head div.details div.buttons a.button {
    background-color: var(--color-green-primary) !important; color: var(--color-text-white) !important;
    border: 1px solid var(--color-green-primary) !important; border-radius: var(--radius-xs) !important;
    transition: background-color 0.3s ease !important;
}
div.race-carousels div.slider-item .race-item div.head div.details div.buttons a.button:hover {
    background-color: var(--color-green-hover) !important;
}

.sticky-menu {
    background: var(--color-bg-tinted) !important;
    border-top: 1px solid rgba(var(--color-green-primary-rgb), 0.75) !important;
    box-shadow: 0 -10px 26px rgba(0, 0, 0, 0.5) !important;
}

.sticky-menu .menu-items .menu-item {
    transition: background-color 0.3s ease !important;
}

.sticky-menu .menu-items .menu-item .text {
    color: var(--text-muted) !important;
    transition: color 0.3s ease !important;
}

.sticky-menu .menu-items .menu-item.active .text,
.sticky-menu .menu-items .menu-item:hover .text {
    color: var(--color-text-white) !important;
}

.sticky-menu .menu-items .menu-item.active {
    background: rgba(var(--color-green-primary-rgb), 0.4) !important;
    border-radius: 10px !important;
}

.guest-home-icon {
    background:
        radial-gradient(120% 120% at 25% 15%, rgba(255, 255, 255, 0.28), transparent 55%),
        linear-gradient(145deg, var(--color-green-bright) 0%, var(--color-green-hover) 45%, var(--color-green-primary) 100%) !important;
    box-shadow:
        0 10px 22px rgba(var(--color-green-primary-rgb), 0.5),
        0 0 0 1px rgba(var(--color-green-light-rgb), 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.25) !important;
}

.notifications .notification-item,
.notification-item {
    background: var(--gradient-surface) !important;
    border: var(--border-thin) solid var(--surface-border-soft);
    border-radius: var(--radius-sm) !important;
    transition: border-color 0.3s ease, background-color 0.3s ease !important;
}

.notifications .notification-item.unread,
.notification-item.unread {
    border-color: rgba(var(--color-green-hover-rgb), 0.7) !important;
}

.notif-badge,
[class*="notif-badge"],
[class*="notification-badge"] {
    background: var(--color-green-hover) !important;
    border: 2px solid rgba(255, 255, 255, 0.45) !important;
}

.faq__bg {
    filter: none !important;
    pointer-events: none;
    background:
        radial-gradient(700px 320px at 10% 0, rgba(var(--color-green-primary-rgb), 0.22), transparent 60%),
        radial-gradient(520px 260px at 100% 30%, rgba(255, 255, 255, 0.06), transparent 62%),
        radial-gradient(560px 300px at 20% 120%, rgba(var(--color-green-primary-rgb), 0.14), transparent 55%) !important;
}

.theme-bg-primary, .bg-primary, [data-theme="primary"] {
    background-color: var(--color-green-primary) !important;
    color: var(--color-text-white) !important;
}

.theme-surface, .bg-surface, [data-theme="surface"] {
    background-color: var(--color-surface-3) !important;
    color: var(--text-primary) !important;
}

.theme-muted, .text-muted, [data-theme="muted"] {
    color: var(--legacy-text-muted) !important;
}

.lowbar-fab__trigger {
    width: 70px !important;
    height: 70px !important;
}

.lowbar-fab__trigger-rings,
.lowbar-fab__trigger-caret {
    display: none !important;
}

.lowbar-fab__trigger-glyph--menu img {
    display: none !important;
}

.lowbar-fab__trigger-glyph--menu {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 70px !important;
    height: 70px !important;
    background: url("https://vendor-provider.fra1.cdn.digitaloceanspaces.com/ebetlab/poWRPFOWPRFOdpfwRFPOWRPFOWORFP/statics/aQp9YpojLTii6TP1qNeR23xxAh3899JKNmF66gKS.gif") center/contain no-repeat !important;
    filter: drop-shadow(0 10px 22px rgba(0, 0, 0, 0.5)) !important;
}

.menu a.active, .sidebar .menu a.active, .sidebar-menu a.active,
.lowbar .item.active, .general-tabs .active, .section-title span {
    color: #10b461 !important;
}

a:hover { color: #10b461 !important; }

.hero-area-slider .hero-slide-media img {
    object-fit: cover !important;
    object-position: center !important;
    transition: transform 0.5s cubic-bezier(.2, .9, .2, 1) !important;
}

.hero-area-slider.type-1 .hero-slide-media,
.hero-area-slider .hero-slide-media {
    aspect-ratio: 1920 / 624 !important;
}

.hero-area-slider.type-2 .hero-slide-media { aspect-ratio: 1392 / 621 !important; }

.hero-area-slider .swiper-slide,
.hero-area-slider .hero-slide-media {
    border-radius: 16px !important;
    overflow: hidden !important;
}

.hero-area-slider .hero-slide-media {
    position: relative !important;
}

.hero-area-slider .swiper-slide {
    position: relative !important;
    border: 1px solid rgba(var(--color-green-primary-rgb), 0.3) !important;
    box-shadow: 0 18px 44px rgba(0, 0, 0, 0.5) !important;
    transition: border-color 0.3s ease, box-shadow 0.3s ease, transform 0.3s ease !important;
}

.hero-area-slider .hero-slide-link, body a.hero-slide-link {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
}

.hero-area-slider .swiper-slide::before {
    content: "";
    position: absolute;
    top: 0; left: 8%; right: 8%;
    height: 2px;
    background: linear-gradient(90deg, transparent, rgba(var(--color-green-light-rgb), 0.85), transparent);
    z-index: 2;
    pointer-events: none;
}

@media (hover: hover) and (pointer: fine) {
    .hero-area-slider .swiper-slide:hover {
        border-color: rgba(var(--color-green-light-rgb), 0.75) !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .hero-area-slider .swiper-slide,
    .hero-area-slider .hero-slide-media img {
        transition: none !important;
    }
}

.hero-area-slider .hero-nav-btn, .hero-area-slider .swiper-button-prev, .hero-area-slider .swiper-button-next {
    background: rgba(20, 24, 22, .55) !important; color: #fff !important;
    border: 1px solid rgba(255,255,255,.14) !important; border-radius: 999px !important;
    box-shadow: 0 8px 20px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.06) !important;
    backdrop-filter: blur(10px) saturate(140%) !important; transition: color .22s ease, border-color .22s ease, background-color .22s ease, transform .22s ease !important;
}
.hero-area-slider .hero-nav-btn:hover, .hero-area-slider .swiper-button-prev:hover, .hero-area-slider .swiper-button-next:hover {
    background: rgba(255, 255, 255, .16) !important; color: #ffffff !important;
    border-color: rgba(var(--color-green-light-rgb), .55) !important;
}
@media (hover: hover) and (pointer: fine) {
    .hero-area-slider .hero-nav-btn:hover, .hero-area-slider .swiper-button-prev:hover, .hero-area-slider .swiper-button-next:hover {
        transform: scale(1.08) !important;
    }
}

.hero-area-slider .hero-slider-pagination .swiper-pagination-bullet {
    background: rgba(255,255,255,.33) !important; opacity: 1 !important;
    transition: width .22s ease, background-color .22s ease, box-shadow .22s ease !important;
}
.hero-area-slider .hero-slider-pagination .swiper-pagination-bullet-active {
    width: 22px !important; border-radius: 999px !important;
    background: linear-gradient(135deg, #34d87a 0%, #10b461 50%, #025328 100%) !important;
    box-shadow: 0 0 0 1px rgba(2, 83, 40, .35), 0 0 18px rgba(16, 180, 97, .45) !important;
}

@media (max-width: 991px) {
    .hero-area-slider .swiper-slide,
    .hero-area-slider .hero-slide-media {
        border-radius: 12px !important;
    }

}
@media (max-width: 575px) {
    .hero-area-slider .swiper-slide,
    .hero-area-slider .hero-slide-media {
        border-radius: 10px !important;
    }
}

.hp-hero-wrap .hero-box { background: linear-gradient(155deg, rgba(var(--color-green-primary-rgb), 0.15), transparent 65%) !important; border: 1px solid rgba(var(--color-green-primary-rgb), 0.5) !important; border-radius: 16px !important; }
.hp-hero-wrap .hero-box .box-title span { color: var(--color-text-white) !important; }
.hp-hero-wrap .hero-box .box-register a.register-button { background: var(--color-green-primary) !important; color: var(--color-text-white) !important; border-radius: 9px !important; transition: background 0.3s ease !important; }
.hp-hero-wrap .hero-box .box-register a.register-button:hover { background: var(--color-green-hover) !important; }
div.hero-box div.box-register a.register-button { background-color: #025328 !important; color: #fff !important; }

.hp-hero-wrap .hero-nav-card,
.hp-hero-wrap .hero-nav a {
    background: var(--color-surface-3) !important;
    border: 1px solid var(--surface-border-soft) !important;
    border-radius: 14px !important;
    transition: border-color 0.3s ease, box-shadow 0.3s ease !important;
}

.hp-hero-wrap .hero-nav-card:hover,
.hp-hero-wrap .hero-nav a:hover {
    border-color: rgba(var(--color-green-hover-rgb), 0.7) !important;
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.4) !important;
}

.hp-hero-wrap .hero-features .feature-item .icon { color: var(--color-green-light) !important; }
.hp-hero-wrap .hero-features .feature-item .title { color: var(--color-text-white) !important; }
.hp-hero-wrap .hero-features .feature-item .desc { color: var(--text-muted) !important; }

div.promotion-list a.listing-block div.listing-item div.item-top {
    height: auto !important;
    aspect-ratio: 800 / 460 !important;
    min-height: 0 !important;
    position: relative !important;
    overflow: hidden !important;
}
div.promotion-list a.listing-block div.listing-item div.item-top div.item-front,
div.promotion-list a.listing-block div.listing-item div.item-top div.item-back {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
}
div.promotion-list a.listing-block div.listing-item div.item-top div.item-back {
    background: linear-gradient(180deg, rgba(4, 13, 8, 0.86) 0%, rgba(3, 10, 6, 0.95) 100%) !important;
}
div.promotion-list a.listing-block div.listing-item div.item-top div.item-front figure.image {
    position: relative !important;
    width: 100% !important;
    height: 100% !important;
    aspect-ratio: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    line-height: 0 !important;
    font-size: 0 !important;
}
div.promotion-list a.listing-block div.listing-item div.item-top div.item-front figure.image img {
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
    transition: transform 0.3s ease !important;
}
div.promotion-list a.listing-block div.listing-item {
    border-radius: 16px !important;
    overflow: hidden !important;
    transition: transform 0.24s ease, box-shadow 0.24s ease !important;
}
@media (hover: hover) and (pointer: fine) {
    div.promotion-list a.listing-block:hover div.listing-item {
        transform: translateY(-4px) !important;
        box-shadow: 0 18px 40px rgba(0, 0, 0, 0.5), 0 0 24px rgba(var(--color-green-primary-rgb), 0.18) !important;
    }
    div.promotion-list a.listing-block:hover div.listing-item div.item-top div.item-front figure.image img {
        transform: scale(1.05) !important;
    }
}
@media (prefers-reduced-motion: reduce) {
    div.promotion-list a.listing-block div.listing-item,
    div.promotion-list a.listing-block div.listing-item div.item-top div.item-front figure.image img {
        transition: none !important;
    }
    div.promotion-list a.listing-block:hover div.listing-item,
    div.promotion-list a.listing-block:hover div.listing-item div.item-top div.item-front figure.image img {
        transform: none !important;
    }
}

footer, #footer, footer#footer, footer#footer > div,
footer#footer .footer-inner, footer#footer .footer-top, footer#footer .footer-bottom {
    background-color: var(--color-bg-global) !important; background-image: none !important;
}

footer, #footer { border-top: 1px solid rgba(var(--color-green-primary-rgb), 0.8) !important; box-shadow: 0 -14px 60px rgba(0,0,0,.7) !important; position: relative !important; }

footer::before, #footer::before {
    content: "" !important; position: absolute !important; top: 0 !important; left: 0 !important;
    width: 100% !important; height: 2px !important;
    background: linear-gradient(90deg, transparent 0%, rgba(var(--color-green-hover-rgb), 0.75) 30%, var(--color-green-light) 50%, rgba(var(--color-green-hover-rgb), 0.75) 70%, transparent 100%) !important;
    pointer-events: none !important;
}

:root body footer#footer .footer-bottom .emails a.mail {
    color: var(--color-green-light) !important;
}

footer a { transition: color 0.3s ease !important; }
footer a:hover { color: var(--color-green-light) !important; }
footer .footer-menus .footer-menu .title, footer .footer-menus .footer-menu .menu-title,
footer .footer-menus .footer-menu h3, footer .footer-menus .footer-menu h4 { color: var(--color-text-white) !important; }
footer .footer-menus .footer-menu ul li span, footer .footer-menus .footer-menu ul li a { color: rgba(255,255,255,.88) !important; }
footer .footer-menus .footer-menu ul li:hover, footer .footer-menus .footer-menu ul li:hover a { color: #10b461 !important; }

footer .footer-logo, footer .logo, footer [class*="logo"], footer div[class*="logo"] {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    position: absolute !important;
    top: 30px !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    z-index: 10 !important;

    padding: 0 8px 70px !important;
    background: none !important;
}
footer .footer-logo img, footer .logo img, footer [class*="logo"] img {
    display: inline-block !important; width: 120px !important; height: auto !important;
    filter: drop-shadow(0 0 8px rgba(var(--color-green-hover-rgb), 0.4)) !important;
}
@media (max-width: 767px) { footer .footer-logo img, footer .logo img, footer [class*="logo"] img { width: 100px !important; } }

.trust-band .stat-item .value, .stats-bar .stat-item .value { color: var(--color-green-light) !important; }
.trust-band .stat-item .icon, .stats-bar .stat-item .icon { color: var(--color-green-light) !important; }

.live-winners, .live-winner, .live-winners-wrapper, .live-winners-container,
.winners-slider, .winner-list, .last-winners, .live-casino-winners {
    background: linear-gradient(180deg, #0c2418 0%, #040d08 100%) !important;
    border: 1px solid rgba(255,255,255,.08) !important; border-radius: 11px !important;
}
.live-winners .amount, .live-winner .amount, .winner-list .amount,
.last-winners .amount, .live-casino-winners .amount { color: #10b461 !important; }

.jackpot-value, .game-jackpot, .jackpot-amount, .game-item .amount {
    background: linear-gradient(180deg, #d3261c 0%, #a80f09 100%) !important; color: #fff !important;
}

.cookie-banner, .cookies-banner, .cookie-consent {
    background: #040d08 !important; border-top: 1px solid rgba(255,255,255,.08) !important; color: rgba(255,255,255,.88) !important;
}
.cookie-banner button, .cookies-banner button, .cookie-consent button { background: #025328 !important; color: #fff !important; }

.toast-6q .Toastify__progress-bar-theme--dark, .toast-6q .Toastify__progress-bar--bg { background-color: #025328 !important; }
.Toastify__toast.toast-6q-toast:after { background: none !important; }

.no-content-svg { color: #10b461 !important; filter: drop-shadow(0 4px 14px rgba(0,0,0,.45)) !important; }
div.game-play div.game-before div.game-buttons span.button.real { background-color: #025328 !important; color: #fff !important; }
div.enterence-box a.simple-category figure.item-image { box-shadow: 0 4px 10px rgba(2, 83, 40, .18), inset 0 1px 0 rgba(255,255,255,.12) !important; }

.show-all, .hepsini-goster, .section-button, a.show-all, button.show-all,
.carousel-nav button, .slider-navigation button, .slider-nav button {
    background: #071a10 !important; color: rgba(255,255,255,.88) !important;
    border: 1px solid rgba(255,255,255,.13) !important; border-radius: 8px !important;
    transition: color .22s ease, background .22s ease, border-color .22s ease !important;
}
.show-all:hover, .hepsini-goster:hover, a.show-all:hover, button.show-all:hover,
.carousel-nav button:hover, .slider-navigation button:hover, .slider-nav button:hover {
    background: rgba(2, 83, 40, .1) !important; color: #10b461 !important; border-color: rgba(16, 180, 97, .52) !important;
}

div.main-search form.search-form, .search-box {
    background: linear-gradient(180deg, #0c2418 0%, #040d08 100%) !important;
    border: 1px solid rgba(255,255,255,.13) !important; border-radius: 9px !important;
    transition: border-color .22s ease, box-shadow .22s ease !important;
}
div.main-search form.search-form:focus-within, .search-box:focus-within {
    border-color: rgba(16, 180, 97, .62) !important;
    box-shadow: 0 0 0 3px rgba(2, 83, 40, .11), 0 10px 24px rgba(0,0,0,.25) !important;
}
div.main-search form.search-form input, .search-box input { background: transparent !important; border: 0 !important; color: #fff !important; }

div.general-header div.header-options ul.simple-nav li button.active span.icon img,
.flex-table .flex-row .flex-cell div.game:hover span.icon {
    filter: invert(42%) sepia(93%) saturate(1352%) hue-rotate(120deg) brightness(96%) contrast(97%) !important;
}

.vip6qCard__icon img { object-fit: cover !important; width: 100% !important; height: 100% !important; }

.page div.page-body div.page-content div.form-blocks div.form-block div.form-block-footer div.buttons button {
    background-color: #025328 !important; color: #fff !important;
}

.sidebar-section-title__line:after { background: radial-gradient(circle, #10b461, rgba(2, 83, 40, 0) 70%) !important; }
#responsive-menu.responsive-menu:after { background: #025328 !important; opacity: 0 !important; }

@media (max-width: 992px) {
    .game-item:hover, .game-card:hover { transform: none !important; }
    #responsive-menu.responsive-menu .menu a:not(.active):hover,
    #responsive-menu.responsive-menu .submenu a:not(.active):hover { transform: none !important; }
}

.game-search-bar, .search-filter-bar, [class*="game-search"] {
    background: var(--color-surface-2) !important;
    border: 1px solid var(--surface-border-soft) !important;
    border-radius: var(--radius-lg) !important;
    transition: border-color 0.3s ease !important;
}

.game-search-bar:focus-within, .search-filter-bar:focus-within, [class*="game-search"]:focus-within {
    border-color: rgba(var(--color-green-hover-rgb), 0.6) !important;
}

.game-search-bar input, .search-filter-bar input, [class*="game-search"] input {
    background: transparent !important; color: var(--text-primary) !important; border: none !important;
}

.game-search-bar .filter-btn, .search-filter-bar .filter-btn, [class*="game-search"] .filter-btn {
    background: var(--color-surface-3) !important;
    border: 1px solid var(--surface-border-soft) !important;
    color: var(--text-muted) !important; border-radius: var(--radius-sm) !important;
    transition: background 0.3s ease, border-color 0.3s ease, color 0.3s ease !important;
}

.game-search-bar .filter-btn:hover, .search-filter-bar .filter-btn:hover, [class*="game-search"] .filter-btn:hover {
    background: rgba(var(--color-green-primary-rgb), 0.2) !important;
    border-color: rgba(var(--color-green-hover-rgb), 0.6) !important;
    color: var(--color-text-white) !important;
}

.game-search-bar .view-all-btn, .search-filter-bar .view-all-btn {
    background: var(--color-green-primary) !important; color: var(--color-text-white) !important;
    border: 1px solid var(--color-green-primary) !important; border-radius: var(--radius-sm) !important;
    transition: background 0.3s ease !important;
}

.game-search-bar .view-all-btn:hover, .search-filter-bar .view-all-btn:hover {
    background: var(--color-green-hover) !important;
}

.trust-band, .stats-bar, .info-bar, [class*="stat-strip"], [class*="trust-strip"] {
    background: var(--color-surface-2) !important;
    border-top: 1px solid var(--surface-border-soft) !important;
    border-bottom: 1px solid var(--surface-border-soft) !important;
}

.theme-toggle, [class*="theme-switch"], [class*="dark-mode"] {
    transition: background 0.3s ease, border-color 0.3s ease !important;
}

.theme-toggle .toggle-track, [class*="theme-switch"] .track {
    background: rgba(var(--color-green-primary-rgb), 0.3) !important;
    border: 1px solid rgba(var(--color-green-hover-rgb), 0.5) !important;
}

.theme-toggle .toggle-knob, [class*="theme-switch"] .knob {
    background: var(--color-green-light) !important;
}

.notifications-box:hover { cursor: pointer; }
.notifications-box:hover svg { fill: var(--color-green-light) !important; transition: fill 0.3s ease !important; }
.notifications-box:hover svg path { fill: var(--color-green-light) !important; }

div.user-menu div.user-menus ul li:last-child > div span.icon span svg,
div.user-menu div.user-menus ul li:last-child > div span.icon span svg path,
div.user-menu div.user-menus ul li:last-child > div span.icon span svg rect,
div.user-menu div.user-menus ul li:last-child > div span.icon span svg circle {
    fill: var(--color-green-primary) !important;
    color: var(--color-green-primary) !important;
}

div.user-menu div.user-menus ul li:last-child>div span.text {

    background: linear-gradient(to right, var(--color-green-bright), var(--color-green-primary)) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
    color: transparent !important;
    font-weight: 800 !important;

}

.user-info .user-only-icon {
    border: 1px solid transparent !important; border-radius: 10px !important;
    background: transparent !important; color: #fff !important; padding: 8px !important;
    transition: background 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease !important;
}
.user-info .user-only-icon:hover { background: rgba(2, 83, 40, 0.18) !important; border-color: rgba(3, 112, 53, 0.5) !important; }
.user-info .user-only-icon[aria-expanded="true"] { background: rgba(2, 83, 40, 0.25) !important; border-color: rgba(16, 180, 97, 0.55) !important; box-shadow: 0 0 12px rgba(2, 83, 40, 0.2) !important; }
.user-info .user-only-icon:focus-visible { outline: 2px solid rgba(16, 180, 97, 0.75) !important; outline-offset: 2px !important; }
.user-info .user-only-icon svg { color: rgba(255,255,255,0.82) !important; transition: color 0.3s ease !important; }
.user-info .user-only-icon:hover svg, .user-info .user-only-icon[aria-expanded="true"] svg { color: #fff !important; }

.user-info ul, .user-info .dropdown-menu, .user-info .user-menu {
    background: #060f0a !important; border: 1px solid rgba(2, 83, 40, 0.5) !important;
    border-radius: 14px !important; padding: 8px 6px !important;
    box-shadow: 0 20px 50px rgba(0,0,0,0.5), inset 0 1px 0 rgba(255,255,255,0.035) !important;
    max-height: 80vh !important; overflow-y: auto !important;
    -webkit-backdrop-filter: blur(12px) !important;
    backdrop-filter: blur(12px) !important;
}

.user-info ul li a, .user-info ul li button,
.user-info .dropdown-menu li a, .user-info .dropdown-menu li button,
.user-info .user-menu li a, .user-info .user-menu li button {
    display: flex !important; align-items: center !important; gap: 12px !important;
    width: 100% !important; padding: 11px 14px !important;
    border: 1px solid transparent !important; border-radius: 10px !important;
    background: transparent !important; color: rgba(255,255,255,0.8) !important;
    font-size: 13.5px !important; font-weight: 500 !important; text-decoration: none !important;
    cursor: pointer !important;
    transition: background 0.25s ease, border-color 0.25s ease, color 0.25s ease, padding-left 0.25s ease, box-shadow 0.25s ease !important;
}

.user-info ul li a:hover, .user-info ul li button:hover,
.user-info .dropdown-menu li a:hover, .user-info .dropdown-menu li button:hover,
.user-info .user-menu li a:hover, .user-info .user-menu li button:hover {
    background: rgba(2, 83, 40, 0.22) !important; border-color: rgba(3, 112, 53, 0.38) !important;
    color: #ffffff !important; padding-left: 18px !important;
    box-shadow: inset 3px 0 0 rgba(16, 180, 97, 0.7) !important;
}

.user-info ul li a:active, .user-info ul li button:active,
.user-info .dropdown-menu li a:active, .user-info .dropdown-menu li button:active {
    background: rgba(2, 83, 40, 0.36) !important; box-shadow: inset 3px 0 0 rgba(16, 180, 97, 0.9) !important;
}

.user-info ul li svg, .user-info .dropdown-menu li svg, .user-info .user-menu li svg {
    flex-shrink: 0 !important; width: 20px !important; height: 20px !important;
    color: rgba(16, 180, 97, 0.6) !important; transition: color 0.25s ease !important;
}
.user-info ul li a:hover svg, .user-info ul li button:hover svg { color: #34d87a !important; }

.user-info ul li:last-child { border-top: 1px solid rgba(2, 83, 40, 0.25) !important; padding-top: 4px !important; margin-top: 4px !important; }
.user-info ul li:last-child a, .user-info ul li:last-child button { color: rgba(255, 83, 101, 0.85) !important; }
.user-info ul li:last-child a:hover, .user-info ul li:last-child button:hover {
    background: rgba(255, 83, 101, 0.1) !important; border-color: rgba(255, 83, 101, 0.25) !important;
    color: #ff7a8a !important; box-shadow: inset 3px 0 0 rgba(255, 83, 101, 0.7) !important;
}
.user-info ul li:last-child svg { color: rgba(255, 83, 101, 0.6) !important; }
.user-info ul li:last-child a:hover svg { color: #ff7a8a !important; }

.user-info ul::-webkit-scrollbar { width: 3px !important; }
.user-info ul::-webkit-scrollbar-track { background: transparent !important; }
.user-info ul::-webkit-scrollbar-thumb { background: rgba(2, 83, 40, 0.4) !important; border-radius: 999px !important; }

@media (prefers-reduced-motion: reduce) {
    .user-info .user-only-icon, .user-info ul li a, .user-info ul li button { transition: none !important; }
}

header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button {
    font-size: 12px !important;
    letter-spacing: 0.02em !important;
}
header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button.register {
    letter-spacing: 0.03em !important;
}
header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button:hover {
    background:var(--color-green-deep) !important;
    color: white !important;
}

.auth-modal .modal-dialog .modal-content .modal-box .modal-title,
.auth-modal .modal-dialog .modal-content .modal-header .title {
    color: var(--text-primary) !important;
    font-family: var(--font-family-semibold) !important;
}

#responsive-menu.responsive-menu .menu-head {
    padding: 8px 10px 6px;
    margin-bottom: 2px;
    border-bottom: 1px solid var(--surface-border-soft);
}
#responsive-menu.responsive-menu .menu-head .head-left {
    align-items: center;
    gap: 8px;
    width: 100%;
    min-width: 0;
    display: flex;
}
#responsive-menu.responsive-menu .menu-head .head-tabs { flex: 1 1 auto; min-width: 0; }
#responsive-menu.responsive-menu .menu-head .head-tabs .head-tabs--plain {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 5px;
    width: 100%;
}
#responsive-menu.responsive-menu .menu-head .head-tabs .head-tab-btn {
    cursor: pointer;
    border: none;
    border-radius: 4px;
    width: 100%;
    min-width: 0;
    height: 34px;
    padding: 0 8px;
    position: relative;
    overflow: hidden;
    background: var(--color-surface-2) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
    transition: box-shadow 0.3s ease, background 0.3s ease;
}
#responsive-menu.responsive-menu .menu-head .head-tabs .head-tab-btn:hover {
    box-shadow: 0 0 0 1px rgba(var(--color-green-hover-rgb), 0.6);
    background: rgba(var(--color-green-primary-rgb), 0.15) !important;
}
#responsive-menu.responsive-menu .menu-head .head-tabs .head-tab-btn.active {
    background: rgba(var(--color-green-primary-rgb), 0.55) !important;
    box-shadow: 0 0 0 1px rgba(var(--color-green-hover-rgb), 0.8);
}
#responsive-menu.responsive-menu .menu-head .head-tabs .head-tab-btn__label {
    color: var(--text-primary);
    font-family: var(--font-family-semibold);
    font-size: 13px;
    letter-spacing: 0.02em;
}

footer#footer .footer-contents-row {
    margin-top: 40px;
}
.footer-menu:nth-child(2n), .footer-menus .row>[class*=col-]:nth-child(2n) .footer-menu {
    text-align: start !important;
    justify-content: flex-start !important;
    align-items: flex-start !important;
}

footer .footer-logo, footer .logo,
footer [class*="logo"], footer div[class*="logo"] {
    max-width: none !important;
    justify-content: center !important;
    align-items: center !important;
    border-radius: 4px !important;
}
footer .footer-logo img, footer .footer-logo svg,
footer .logo img, footer .logo svg,
footer [class*="logo"] img, footer [class*="logo"] svg,
footer div[class*="logo"] img, footer div[class*="logo"] svg {
    display: inline-block !important;
    width: 120px !important;
    max-width: 120px !important;
    height: auto !important;
    object-fit: contain !important;
    margin: 0 auto !important;
    padding: 0 !important;
    transform: none !important;
    filter: drop-shadow(0 0 8px rgba(var(--color-green-hover-rgb), 0.4)) !important;
}

.trust-band .stat-item .value,
.stats-bar .stat-item .value,
[class*="stat-strip"] .value {
    font-family: var(--font-family-bold) !important;
}
.trust-band .stat-item .label,
.stats-bar .stat-item .label,
[class*="stat-strip"] .label {
    color: var(--text-muted) !important;
}
.trust-band .stat-item .icon,
.stats-bar .stat-item .icon {
    opacity: 0.8;
}

div.main-search form.search-form,
.search-box,
.search-form {
    margin-top: 0px !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025) !important;
}

.user-info ul li.divider,
.user-info ul li.separator,
.user-info ul hr,
.user-info .dropdown-menu li.divider,
.user-info .dropdown-menu hr,
.user-info .user-menu li.divider,
.user-info .user-menu hr {
    height: 1px !important;
    margin: 5px 12px !important;
    padding: 0 !important;
    border: none !important;
    background: rgba(2, 83, 40, 0.2) !important;
}
.user-info ul li span[role="presentation"],
.user-info .dropdown-menu li span[role="presentation"],
.user-info .user-menu li span[role="presentation"] {
    flex-shrink: 0 !important;
    width: 20px !important;
    height: 20px !important;
    color: rgba(16, 180, 97, 0.6) !important;
    transition: color 0.22s ease !important;
}
.user-info ul li a:hover span[role="presentation"],
.user-info ul li button:hover span[role="presentation"] {
    color: #34d87a !important;
}
.user-info ul li:last-child span[role="presentation"] {
    color: rgba(255, 83, 101, 0.6) !important;
}

.notifications-box:hover {
    cursor: pointer;
    color: black !important;
}
.notifications-box:hover svg {
    fill: black !important;
    transition: fill 0.3s ease, stroke 0.3s ease !important;
}
.notifications-box:hover svg path {
    fill: black !important;
}

.BetsKindTabs-module__l4JyhG__indicator {
    background: var(--color-green-primary);
}

.wallet-buttons .row div:hover {
    opacity:0.8;
}

div.main-search form.search-form,
.search-box,
.search-form {

    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025) !important;
    transition: border-color .22s ease, box-shadow .22s ease !important;
}

div.main-search form.search-form:focus-within,
.search-box:focus-within,
.search-form:focus-within {
    border-color: rgba(16, 180, 97, .62) !important;
    box-shadow: 0 0 0 3px rgba(2, 83, 40, .11), 0 10px 24px rgba(0, 0, 0, .25) !important;
}

div.main-search form.search-form input,
.search-box input,
.search-form input {
    background: transparent !important;
    border: 0 !important;
    color: #ffffff !important;
    box-shadow: none !important;
}

div.main-search form.search-form input::placeholder,
.search-box input::placeholder,
.search-form input::placeholder {
    color: rgba(255, 255, 255, .62) !important;
}

.modal-body {
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
}

div.news-area div.news-box div.box-bottom form.message-form div.form-footer > button {
    background-image:
        linear-gradient(
        to right,
        var(--color-green-primary) 0%,
        var(--color-green-deep) 100%
    ) !important;

}

div.news-area div.news-box div.box-bottom form.message-form div.form-footer > button:hover {
    cursor:pointer;
    opacity:0.8;
}

.chat-emoji-button {
background: linear-gradient(var(--color-surface-4), var(--color-surface-1)) !important;
}

.provider-carousel {
    margin: 40px 0px !important;
}

.provider-carousel .swiper,
.provider-carousel .swiper-initialized {
    overflow: hidden !important;
}

.provider-carousel .owl-nav--header {
    display:none;
}

.provider-carousel .swiper-wrapper {
    animation: sv-providers-auto-scroll 25s cubic-bezier(0.45, 0, 0.55, 1) infinite alternate !important;
    will-change: transform !important;
    transform: translate3d(0, 0, 0);
}

.provider-carousel:hover .swiper-wrapper,
.provider-carousel .swiper:hover .swiper-wrapper {
    animation-play-state: paused !important;
}

@keyframes sv-providers-auto-scroll {
    0%   { transform: translate3d(0, 0, 0); }
    100% { transform: translate3d(-55%, 0, 0); }
}

.provider-carousel .owl-carousel .owl-stage {
    animation: sv-providers-auto-scroll 20s cubic-bezier(0.45, 0, 0.55, 1) infinite alternate !important;
}

.provider-carousel .owl-carousel:hover .owl-stage {
    animation-play-state: paused !important;
}

@media (max-width: 991px) {
    .provider-carousel .swiper-wrapper {
        animation-duration: 15s !important;
    }
    .provider-carousel .owl-carousel .owl-stage {
        animation-duration: 12s !important;
    }
}

footer .footer-currencies,
footer#footer .footer-currencies {
    overflow: hidden !important;
    width: 100% !important;
    position: relative !important;
    padding: 12px 0 !important;
    margin-bottom: 29px;
}

footer .footer-currencies::before,
footer#footer .footer-currencies::before,
footer .footer-currencies::after,
footer#footer .footer-currencies::after {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    bottom: 0 !important;
    width: 80px !important;
    z-index: 2 !important;
    pointer-events: none !important;
}

footer .footer-currencies::before,
footer#footer .footer-currencies::before {
    left: 0 !important;
    background: linear-gradient(90deg, var(--color-bg-global) 0%, transparent 100%) !important;
}

footer .footer-currencies::after,
footer#footer .footer-currencies::after {
    right: 0 !important;
    background: linear-gradient(270deg, var(--color-bg-global) 0%, transparent 100%) !important;
}

footer .footer-currencies img,
footer .footer-currencies .listing-block img,
footer .footer-currencies .currency-listing img {
    filter: brightness(0) invert(1) !important;
    height: 24px !important;
    width: auto !important;
    max-width: none !important;
    opacity: 0.5 !important;
    transition: opacity 0.4s ease, transform 0.4s ease, filter 0.4s ease !important;
}

footer .footer-currencies .listing-block {
    flex: 0 0 auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 4px !important;
}

footer .footer-currencies .listing-block img {
    height: 24px !important;
    width: auto !important;
    max-width: none !important;
    display: block !important;
}

footer .footer-currencies img,
footer .footer-currencies .listing-block img,
footer .footer-currencies .currency-listing img {
    filter: brightness(0) invert(1) !important;
    opacity: 0.5 !important;
    transition: opacity 0.4s ease, filter 0.4s ease !important;
}

footer .footer-currencies img:hover,
footer .footer-currencies .listing-block img:hover {
    opacity: 1 !important;
    filter: brightness(0) invert(1) drop-shadow(0 0 8px rgba(var(--color-green-light-rgb), 0.4)) !important;
}

footer .footer-currencies .currency-listing,
footer#footer .footer-currencies .currency-listing {
    display: flex !important;
    flex-wrap: nowrap !important;
    white-space: nowrap !important;
    width: max-content !important;
    gap: 0 !important;
    align-items: center !important;
    animation: cb-marquee-scroll 42s linear infinite !important;
    will-change: transform !important;
    -webkit-backface-visibility: hidden !important;
    backface-visibility: hidden !important;
}

@media (hover: hover) and (pointer: fine) {
    footer .footer-currencies:hover .currency-listing,
    footer#footer .footer-currencies:hover .currency-listing {
        animation-play-state: paused !important;
    }
}

footer .footer-currencies .listing-block,
footer#footer .footer-currencies .listing-block {
    flex: 0 0 auto !important;
    display: flex !important;
    align-items: center !important;
    padding: 0 4px !important;
    margin-right: 50px !important;
}

@keyframes cb-marquee-scroll {
    from { transform: translate3d(0, 0, 0); }
    to   { transform: translate3d(calc(var(--cb-marq-shift, 50%) * -1), 0, 0); }
}

@media (max-width: 991px) {
    footer .footer-currencies::before,
    footer#footer .footer-currencies::before,
    footer .footer-currencies::after,
    footer#footer .footer-currencies::after {
        width: 40px !important;
    }

    footer .footer-currencies .currency-listing,
    footer#footer .footer-currencies .currency-listing {
        gap: 0 !important;
        animation-duration: 30s !important;
    }

    footer .footer-currencies img,
    footer .footer-currencies .listing-block img {
        height: 20px !important;
    }
}

@media (max-width: 991px) {
    footer .footer-currencies .currency-listing,
    footer#footer .footer-currencies .currency-listing {
        gap: 0 !important;
        animation-duration: 30s !important;
    }
    footer .footer-currencies .listing-block,
    footer#footer .footer-currencies .listing-block {
        padding: 0 2px !important;
        margin-right: 40px !important;
    }
}

footer div.footer-currencies div.currency-listing div.listing-block,
footer#footer div.footer-currencies div.currency-listing div.listing-block {
    width: auto !important;
    flex: 0 0 auto !important;
}

@media (max-width: 991px) {
    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a,
    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button.register {
        font-size: 11px !important;
        padding: 6px 10px !important;
        border-radius: 8px !important;
     height:30px !important;
    }

    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons {
        padding: 4px !important;
        gap: 2px !important;
        border-radius: 10px !important;
    }
}

.hero-area-slider .hero-slide-link,
body a.hero-slide-link {
  border: 1px solid rgb(28 198 0 / 22%) !important;
  border-radius: 12px !important;
  overflow: hidden !important;
}

.hero-area-slider .hero-nav-btn,
.hero-area-slider .swiper-button-prev,
.hero-area-slider .swiper-button-next {
  background: rgba(20, 24, 22, .55) !important;
  color: #fff !important;
  border: 1px solid rgba(255, 255, 255, .14) !important;
  border-radius: 999px !important;
  box-shadow: 0 8px 20px rgba(0, 0, 0, .34), inset 0 1px 0 rgba(255, 255, 255, .06) !important;
  backdrop-filter: blur(10px) saturate(140%);
  -webkit-backdrop-filter: blur(10px) saturate(140%);
  transition: color .22s ease, border-color .22s ease, transform .22s ease, background-color .22s ease !important;
}

.hero-area-slider .hero-nav-btn:hover,
.hero-area-slider .swiper-button-prev:hover,
.hero-area-slider .swiper-button-next:hover {
  background: rgba(255, 255, 255, .16) !important;
  color: #ffffff !important;
  border-color: rgba(var(--color-green-light-rgb), .55) !important;
  transform: scale(1.05);
}

.hero-area-slider .hero-slider-pagination .swiper-pagination-bullet {
  background: rgba(255, 255, 255, .33) !important;
  opacity: 1 !important;
  transition: width .22s ease, background-color .22s ease, box-shadow .22s ease !important;
}

.hero-area-slider .hero-slider-pagination .swiper-pagination-bullet-active {
  width: 22px !important;
  border-radius: 999px !important;
  background: var(--gradient-primary) !important;
  box-shadow: 0 0 0 1px rgba(229, 190, 73, .28), 0 0 16px rgba(229, 190, 73, .30) !important;
}

@media screen and (max-width: 991px) {

  header#header div.middle-header div.middle-header-container div.responsive-logo img,
  header#header div.middle-header div.middle-header-container div.responsive-logo svg {
    left: 0 !important;
    transform: none !important;
  }

  .hero-area-slider .hero-area-slider-boot-card, .hero-area-slider.type-1 .hero-area-slider-boot-card, .hero-area-slider.type-2 .hero-area-slider-boot-card, .hero-area-slider.type-3 .hero-area-slider-boot-card, .hero-area-slider .hero-slide-media, .hero-area-slider.type-1 .hero-slide-media, .hero-area-slider.type-2 .hero-slide-media, .hero-area-slider.type-3 .hero-slide-media{
    aspect-ratio: 800 / 460 !important;
  }
}

@media (max-width: 767px) {

    .provider-carousel .section-header {
        min-height: 38px;
        margin-bottom: 13px;
    }

    .provider-carousel .section-header .section-title {
        min-height: 36px;
        padding-right: 10px;
    }

    .provider-carousel .section-header .section-title .icon {
        width: 32px !important;
        min-width: 32px !important;
        height: 32px !important;
    }

    .provider-carousel .section-header .section-title .icon img {
        width: 17px !important;
        max-width: 17px !important;
        height: 17px !important;
        max-height: 17px !important;
    }

    .provider-carousel .section-header .section-title .title {
        padding-left: 8px !important;

        font-size: 13px !important;
    }

    .provider-carousel .section-header .section-title::after {
        left: 39px;
        width: 66px;
    }

    main#main.providers-page .main-search,
    main.providers-page .main-search {
        min-height: 44px;
        margin-bottom: 16px;
    }

    main#main.providers-page .provider-item__inner,
    main.providers-page .provider-item__inner {
        min-height: 70px !important;
        padding: 13px 14px !important;
    }

    main#main.providers-page .provider-item .image img,
    main.providers-page .provider-item .image img {
        max-height: 31px !important;
    }
}

@media (max-width: 420px) {
    main#main.providers-page .provider-item__inner,
    main.providers-page .provider-item__inner {
        min-height: 66px !important;
        padding: 11px 12px !important;

        border-radius: 8px !important;
    }

    main#main.providers-page .provider-item .image img,
    main.providers-page .provider-item .image img {
        max-height: 28px !important;
    }
}

div.provider-box a.provider-item figure.image {
    margin: 0px 0px !important;
 }

header#header div.middle-header div.middle-header-container div.logo img,
header#header div.middle-header div.middle-header-container div.logo svg {
  top: 60% !important;
}

@media screen and (max-width: 1199px) {

  header#header div.middle-header div.middle-header-container div.logo {
    left: 0 !important;
  }

}

@media screen and (max-width: 1199px) {

  header#header div.middle-header div.middle-header-container div.responsive-logo {
    top: 4px !important;
    left: 0 !important;
    transform: none !important;
  }

}

@media screen and (max-width: 991px) {

  header#header div.middle-header div.middle-header-container div.responsive-logo img,
  header#header div.middle-header div.middle-header-container div.responsive-logo svg {
    left: 0 !important;
    transform: none !important;
  }

  .hero-area-slider .hero-area-slider-boot-card, .hero-area-slider.type-1 .hero-area-slider-boot-card, .hero-area-slider.type-2 .hero-area-slider-boot-card, .hero-area-slider.type-3 .hero-area-slider-boot-card, .hero-area-slider .hero-slide-media, .hero-area-slider.type-1 .hero-slide-media, .hero-area-slider.type-2 .hero-slide-media, .hero-area-slider.type-3 .hero-slide-media{
    aspect-ratio: 800 / 460 !important;
  }

}

.hp-hero-bg {
    display:none !important;
}

@media screen and (max-width: 768px) {
  header#header {
    position: fixed;
    width: 100%;
    top: 0;
    left: 0;
  }
}

@media screen and (max-width: 991px) {
  header#header div.middle-header div.middle-header-container a.cb-header-logo,
  header#header div.middle-header div.middle-header-container div.categories {
    display: none !important;
  }
  header#header div.middle-header div.middle-header-container div.responsive-logo {
    width: 190px !important;
  }
  header#header div.middle-header div.middle-header-container div.responsive-logo a {
    justify-content: flex-start !important;
}
}

@media screen and (max-width: 575px) {
  header#header div.middle-header div.middle-header-container{
    justify-content: space-between !important;
  }
  header#header div.middle-header div.middle-header-container div.responsive-logo{
    width: 190px !important;
  }
  header#header div.middle-header div.middle-header-container div.header-buttons{
    width: unset !important;
  }
  header#header div.middle-header div.middle-header-container div.header-buttons{
    gap: 7px !important;
  }
  .header-minified-buttons{
    gap: 5px !important;
  }

}

div.simple-bets ul li button,
div.simple-bets div.description,
div.amount.down span.value,
div.section-header div.section-select select,
div.general-header div.header-options ul.simple-nav li button span.text,
div.general-header div.header-selects select,
div.general-tabs ul.general-nav li a span.text,
div.general-tabs ul.general-nav li button span.text,
.flex-table .header .flex-cell,
.flex-table.session-table .flex-row .flex-cell,
.flex-table .flex-row .flex-cell.time,
.flex-table .flex-row .flex-cell.multiplier,
.flex-table .flex-row .flex-cell div.order,
.flex-table .flex-row .flex-cell div.author.hidden span.text,
div.more-about-us .content-wrapper .content,
div.main-categories div.category-block .category-item div.excerpt {
    color: var(--legacy-text-muted) !important;
}

div.simple-bets  {
    display: none !important;
}
div.simple-bets div.filter-area {
    border-bottom: 2px solid var(--color-surface-3) !important;
}

div.simple-bets ul li button.active {
    background-color: rgba(var(--color-green-primary-rgb), 0.35) !important;
}

div.simple-bets-opt-header div.external-options label.checkbox div.checkbox div.icon {
    background-color: var(--color-surface-3) !important;
}

div.simple-bets-opt-header div.external-options label.checkbox div.checkbox div.icon:before {
    background-color: var(--color-surface-2) !important;
}

div.simple-bets-opt-header div.external-options label.checkbox input:checked ~ div.checkbox div.icon {
    background-color: var(--color-green-primary) !important;
}

div.progress-bar,
div.user-statu-box div.user-statu div.statu-progress {
    background-color: var(--color-surface-3) !important;
}

div.user-statu-box {
    border: 1px solid var(--input-border) !important;
}

div.user-statu-box div.user-statu div.statu-head div.percentage-box div.text {
    color: var(--legacy-text-muted) !important;
}

div.info-block {
    background-color: rgba(var(--color-green-primary-rgb), 0.16) !important;
}

div.more-about-us .content-wrapper {
    background-color: var(--color-surface-2) !important;
}

div.more-about-us .content-wrapper .read-more-btn {
    background-color: var(--color-surface-3) !important;
}

div.more-about-us .content-wrapper .read-more-btn:hover {
    background-color: var(--color-green-hover) !important;
}

div.main-categories div.category-block .category-item div.buttons div.button {
    background-color: var(--btn-primary-bg) !important;
}

div.hero-area:before {
    background-image: linear-gradient(to left, rgba(0, 0, 0, 0) 0%, var(--color-surface-2) 100%) !important;
}

div.hero-box div.box-register a.register-button {
    background-color: var(--header-register-bg) !important;
}

div.cat-carousel div.section-carousel div.owl-carousel a.simple-category div.item-title {
    background-color: var(--color-surface-2) !important;
}

div.enterence-box a.simple-category figure.item-image {
    box-shadow: 0 4px 10px rgba(var(--color-green-primary-rgb), 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
}

div.general-tabs ul.general-nav {
    background-color: var(--color-surface-2) !important;
    scrollbar-color: var(--color-surface-2) transparent !important;
}

div.general-tabs ul.general-nav li a.active,
div.general-tabs ul.general-nav li button.active,
div.general-tabs ul.general-nav.general-nav-3 li button.active {
    background-image: var(--gradient-green-sweep) !important;
}

div.general-tabs > div.tab-content.loader:before {
    border: 15px solid var(--color-surface-3) !important;
    border-top: 15px solid var(--color-green-primary) !important;
}

.slot-tabs-buttons.general-tabs-buttons {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
}

.slot-tabs-buttons.general-tabs-buttons a {
    display: inline-flex !important;
    align-items: center !important;
    height: 40px !important;
    padding: 0 18px !important;
    border-radius: 999px !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    background: rgba(255, 255, 255, 0.06) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
    text-decoration: none !important;
    transition: background 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease, transform 0.2s ease !important;
}

.slot-tabs-buttons.general-tabs-buttons a .icon {
    display: none !important;
}

.slot-tabs-buttons.general-tabs-buttons a .text {
    color: rgba(255, 255, 255, 0.72) !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 12.5px !important;
    letter-spacing: 0.02em !important;
    white-space: nowrap !important;
    transition: color 0.25s ease !important;
}

.slot-tabs-buttons.general-tabs-buttons a:hover {
    background: rgba(255, 255, 255, 0.13) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.4) !important;
    transform: translateY(-1px) !important;
}

.slot-tabs-buttons.general-tabs-buttons a:hover .text {
    color: #ffffff !important;
}

.slot-tabs-buttons.general-tabs-buttons a.active {
    background: linear-gradient(135deg, var(--color-green-hover) 0%, var(--color-green-primary) 100%) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.55) !important;
    box-shadow: 0 6px 18px rgba(var(--color-green-primary-rgb), 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
}

.slot-tabs-buttons.general-tabs-buttons a.active .text {
    color: #ffffff !important;
    font-weight: 700 !important;
}

.slot-tabs-buttons.general-tabs-buttons a:active {
    transform: translateY(0) scale(0.97) !important;
}

@media (max-width: 575px) {
    .slot-tabs-buttons.general-tabs-buttons {
        flex-wrap: nowrap !important;
        gap: 6px !important;
        overflow-x: auto !important;
        scrollbar-width: none !important;
    }
    .slot-tabs-buttons.general-tabs-buttons::-webkit-scrollbar {
        display: none !important;
    }
    .slot-tabs-buttons.general-tabs-buttons a {
        height: 36px !important;
        padding: 0 14px !important;
        flex: 0 0 auto !important;
    }
    .slot-tabs-buttons.general-tabs-buttons a .text {
        font-size: 11.5px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .slot-tabs-buttons.general-tabs-buttons a {
        transition: none !important;
    }
    .slot-tabs-buttons.general-tabs-buttons a:hover {
        transform: none !important;
    }
}

div.general-filters div.general-selecters a.button {
    background: rgba(var(--color-green-primary-rgb), 0.16) !important;
}

div.general-filters div.general-selecters a.button span.text,
div.general-filters div.general-menus ul li button span.text {
    color: var(--color-green-light) !important;
}

div.general-filters div.general-menus ul li button.active {
    background: rgba(var(--color-green-primary-rgb), 0.16) !important;
}

.nav-general-holder {
    background-color: var(--color-surface-1) !important;
}

.nav-general-holder ul li a.live span.text {
    background: linear-gradient(84deg, var(--danger), var(--danger)) !important;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

.nav-general-holder ul li a.tables span.text {
    background: var(--gradient-green-text) !important;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

.flex-table .flex-row .flex-cell.action span.button.cancel span {
    background: linear-gradient(var(--danger), var(--danger)) !important;
}

div.main-search form.search-form input,
div.main-search form.search-form input::placeholder {
    color: var(--legacy-text-muted) !important;
}

div.main-search form.search-form div.buttons a.button {
    background-color: rgba(var(--color-green-primary-rgb), 0.16) !important;
    color: var(--color-green-light) !important;
}

.toast-6q .Toastify__progress-bar-theme--dark,
.toast-6q .Toastify__progress-bar--bg {
    background: var(--color-green-primary) !important;
}

.bet-row--enter::before {
    background: radial-gradient(120% 80% at 15% 20%, rgba(var(--color-green-light-rgb), .22), transparent 58%),
        radial-gradient(110% 70% at 85% 65%, rgba(255, 255, 255, .08), transparent 60%) !important;
}

.bet-row--enter::after {
    background: linear-gradient(135deg,
        rgba(var(--color-green-light-rgb), .00) 0%,
        rgba(var(--color-green-light-rgb), .26) 22%,
        rgba(255, 255, 255, .10) 50%,
        rgba(var(--color-green-light-rgb), .18) 78%,
        rgba(var(--color-green-light-rgb), .00) 100%) !important;
}

.bet-row--enter .bet-row__shimmer {
    background: linear-gradient(115deg,
        transparent 0%,
        rgba(255, 255, 255, .06) 35%,
        rgba(var(--color-green-light-rgb), .16) 50%,
        rgba(255, 255, 255, .04) 65%,
        transparent 100%) !important;
}

header#header div.middle-header {
    background-image: linear-gradient(to left, rgba(0, 0, 0, 0), var(--color-surface-2) 100%) !important;
}

header#header div.middle-header div.middle-header-container div.categories a.category.active,
header#header div.middle-header div.middle-header-container div.categories a.category:hover {
    background: linear-gradient(0deg, rgba(var(--color-green-primary-rgb), 0.35) 0%, rgba(var(--color-green-primary-rgb), 0.35) 100%), var(--color-surface-3) !important;
}

header#header div.middle-header div.middle-header-container div.categories a.category.active span.text,
header#header div.middle-header div.middle-header-container div.categories a.category:hover span.text {
    color: var(--color-green-light) !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.opener-wallet {
    background-color: var(--color-surface-1) !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.opener-wallet:after {
    border-bottom-color: var(--color-surface-1) !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.opener-wallet a.setting-button {
    border-top: 1px solid rgba(255, 255, 255, 0.22) !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button.register {
    background-color: var(--header-register-bg) !important;
    box-shadow: 0 12px 24px rgba(var(--color-green-primary-rgb), 0.28), 0 6px 16px rgba(0, 0, 0, 0.22) !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.language-box div.options-language {
    background-color: var(--color-surface-1) !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.language-box div.options-language:before {
    border-bottom-color: var(--color-surface-1) !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.language-box div.options-language span.button:hover {
    background-color: rgba(var(--color-green-primary-rgb), 0.25) !important;
}

div.user-menu div.user-menus {
    background-color: var(--color-surface-1) !important;
}

div.user-menu div.user-menus:after {
    border-bottom-color: var(--color-surface-1) !important;
}

div.user-menu div.user-menus ul li div:hover {
    background-color: rgba(var(--color-green-primary-rgb), 0.25) !important;
}

div.user-menu div.user-menus ul li:last-child a span.text {
    background: linear-gradient(var(--danger), var(--danger)) !important;
}

.auth-modal .modal-dialog .modal-content .modal-box ul.nav li button {
    color: var(--legacy-text-muted) !important;
}

.auth-modal .modal-dialog .modal-content .modal-box ul.nav li button:before {
    background-color: var(--color-green-primary) !important;
}

.auth-modal .modal-dialog .modal-content .modal-box form.auth-form div.form-group div.title {
    color: var(--legacy-text-muted) !important;
}

.auth-modal .modal-dialog .modal-content .modal-box form.auth-form div.form-group div.title span.required {
    color: var(--danger) !important;
}

.auth-modal .modal-dialog .modal-content .modal-box form.auth-form div.form-group div.form-item label.error {
    background: linear-gradient(var(--danger), var(--danger)) !important;
}

.auth-modal .modal-dialog .modal-content .modal-box form.auth-form div.form-group div.form-item.form-item-text input,
.auth-modal .modal-dialog .modal-content .modal-box form.auth-form div.form-group div.form-item.form-item-password input,
.auth-modal .modal-dialog .modal-content .modal-box form.auth-form div.form-group div.form-item.form-item-phone .react-tel-input .auth-phone-input,
.auth-modal .modal-dialog .modal-content .modal-box form.auth-form div.form-group div.form-item.form-item-phone .react-tel-input .auth-phone-button {
    border: 1px solid var(--input-border) !important;
}

.auth-modal .modal-dialog .modal-content .modal-box form.auth-form div.form-group div.form-item.form-item-text input.valid,
.auth-modal .modal-dialog .modal-content .modal-box form.auth-form div.form-group div.form-item.form-item-password input.valid {
    border-color: var(--input-border-focus) !important;
}

.auth-modal .modal-dialog .modal-content .modal-box form.auth-form div.form-group div.form-item.form-item-text input.error,
.auth-modal .modal-dialog .modal-content .modal-box form.auth-form div.form-group div.form-item.form-item-password input.error {
    background: linear-gradient(var(--color-surface-3), var(--color-surface-3)) padding-box,
        linear-gradient(to right, var(--danger), var(--danger)) border-box !important;
}

.auth-modal .modal-dialog .modal-content .modal-box form.auth-form div.form-group div.form-item.form-item-checkbox label.checkbox div.checkbox div.icon {
    background-color: var(--legacy-text-muted) !important;
}

.auth-modal .modal-dialog .modal-content .modal-box form.auth-form div.form-group div.form-item.form-item-checkbox label.checkbox div.checkbox div.text,
.auth-modal .modal-dialog .modal-content .modal-box div.or-auth div.dont {
    color: var(--legacy-text-muted) !important;
}

#walletModal .modal-dialog .modal-content .modal-body div.wallet-box div.wallet-normal div.wallet-body div.balance-box div.box-header div.title,
#walletModal .modal-dialog .modal-content .modal-body div.wallet-box div.wallet-normal div.wallet-body div.balance-box div.box-current div.balance-head div.title,
#walletModal .modal-dialog .modal-content .modal-body div.wallet-box div.wallet-normal div.wallet-body div.balance-box div.box-current div.balance-current div.coin div.details div.title,
#walletModal .modal-dialog .modal-content .modal-body div.wallet-box div.wallet-normal div.wallet-body div.balance-box div.box-current div.balance-current div.values div.bottom,
#walletModal .modal-dialog .modal-content .modal-body div.wallet-box div.wallet-pages div.wallet-page div.page-header div.title,
#walletModal .modal-dialog .modal-content .modal-body div.wallet-box div.wallet-pages div.wallet-page ul.nav li button,
#walletModal .modal-dialog .modal-content .modal-body div.wallet-box div.wallet-pages div.wallet-page div.text,
#walletModal .modal-dialog .modal-content .modal-body div.wallet-box div.wallet-pages div.wallet-page div.note {
    color: var(--legacy-text-muted) !important;
}

#walletModal .modal-dialog .modal-content .modal-body div.wallet-box div.wallet-normal div.wallet-body div.balance-box div.box-current div.balance-head {
    border-bottom: 1px solid rgba(255, 255, 255, 0.22) !important;
}

#walletModal .modal-dialog .modal-content .modal-body div.wallet-box div.wallet-normal div.wallet-body div.wallet-buttons span.button {
    background-color: var(--color-surface-3) !important;
}

#walletModal .modal-dialog .modal-content .modal-body div.wallet-box div.wallet-normal div.wallet-body div.wallet-buttons span.button.deposit {
    background-color: var(--wallet-deposit-bg) !important;
}

#walletModal .modal-dialog .modal-content .modal-body div.wallet-box div.wallet-normal div.wallet-body div.wallet-buttons span.button.withdraw {
    background-image: var(--gradient-withdraw) !important;
}

#walletModal .modal-dialog .modal-content .modal-body div.wallet-box div.wallet-pages div.wallet-page ul.nav {
    background-color: var(--color-surface-3) !important;
}

#walletModal .modal-dialog .modal-content .modal-body div.wallet-box div.wallet-pages div.wallet-page ul.nav li button.active {
    background-color: rgba(var(--color-green-primary-rgb), 0.35) !important;
}

#walletModal .modal-dialog .modal-content .modal-body div.wallet-footer a.button {
    background-color: var(--wallet-footer-btn-bg) !important;
}

#walletModal .modal-dialog .modal-content .modal-body div.wallet-footer a.button:hover {
    background-color: var(--color-green-hover) !important;
}

.modal#tournamentModal .modal-dialog .modal-content .modal-body button.modal-close,
.modal#tournamentModal .modal-dialog .modal-content .modal-body div.tournament-details div.participants-head,
.modal#tournamentModal .modal-dialog .modal-content .modal-body div.tournament-details div.leader-list div.list-block {
    background-color: var(--color-surface-3) !important;
}

.modal#tournamentModal .modal-dialog .modal-content .modal-body div.tournament-details,
.modal#tournamentModal .modal-dialog .modal-content .modal-body div.tournament-details div.leader-list div.list-block div.icon,
.modal#tournamentModal .modal-dialog .modal-content .modal-body div.tournament-details div.leader-list div.list-block div.author.hidden div.name,
.modal#tournamentModal .modal-dialog .modal-content .modal-body div.tournament-details div.leader-list div.list-block div.details div.money div.text {
    color: var(--legacy-text-muted) !important;
}

.modal#tournamentModal .modal-dialog .modal-content .modal-body div.tournament-details div.tournament-content figure.tournament-image div.prize {
    background-color: var(--color-surface-2) !important;
}

.modal#tournamentModal .modal-dialog .modal-content .modal-body div.tournament-details span.more-button {
    background-color: rgba(var(--color-green-primary-rgb), 0.35) !important;
}

.modal.race-modal .modal-dialog .modal-content {
    background-color: var(--color-surface-2) !important;
}

.modal.race-modal .modal-dialog .modal-content .modal-body div.leader-area div.leader-list div.list-block div.icon,
.modal.race-modal .modal-dialog .modal-content .modal-body div.leader-area div.leader-list div.list-block div.author.hidden div.name,
.modal.race-modal .modal-dialog .modal-content .modal-body div.leader-area div.leader-list div.list-block div.details div.money div.text,
.modal.race-modal .modal-dialog .modal-content .modal-body div.tickets-area div.ticket-list div.list-block div.name,
.modal.race-modal .modal-dialog .modal-content .modal-body div.vip-area ul.nav li button,
.modal.race-modal .modal-dialog .modal-content .modal-body div.vip-area div.tab-content div.vip-list div.list-block div.details div.desc,
.modal.race-modal .modal-dialog .modal-content .modal-body div.vip-area div.tab-content div.vip-accordion div.card div.card-body,
.modal.race-modal .modal-dialog .modal-content .modal-body div.stats-area div.user-area div.details div.desc,
.modal.race-modal .modal-dialog .modal-content .modal-body div.stats-area div.user-statu div.statu-head div.percentage-box div.text,
.modal.race-modal .modal-dialog .modal-content .modal-body div.stats-area div.user-tabs ul li button,
.modal.race-modal .modal-dialog .modal-content .modal-body div.stats-area div.user-tabs div.tab-content div.stats-blocks div.title,
.modal.race-modal .modal-dialog .modal-content .modal-body div.stats-area div.user-tabs div.tab-content div.stats-blocks div.stat-block div.name,
.modal.race-modal .modal-dialog .modal-content .modal-body div.stats-area div.user-tabs div.tab-content div.simple-head div.select select,
.modal.race-modal .modal-dialog .modal-content .modal-body div.stats-area div.user-tabs div.tab-content div.trophy-table div.table-head div.item,
.modal.race-modal .modal-dialog .modal-content .modal-body div.stats-area div.user-tabs div.tab-content div.trophy-table div.table-body div.table-block div.item,
.modal.race-modal .modal-dialog .modal-content .modal-body div.stats-area div.user-tabs div.tab-content div.races-table div.table-head div.item,
.modal.race-modal .modal-dialog .modal-content .modal-body div.stats-area div.user-tabs div.tab-content div.races-table div.table-body div.table-block div.item,
.modal.race-modal .modal-dialog .modal-content .modal-body div.stats-area div.user-tabs div.tab-content div.races-table div.table-body div.table-block div.item.prize div.value,
.modal.race-modal .modal-dialog .modal-content .modal-body div.stats-area div.user-tabs div.tab-content div.wins-list div.list-block div.details div.value,
.modal.race-modal .modal-dialog .modal-content .modal-body div.stats-area div.user-tabs div.tab-content div.wins-list div.list-block div.info div.date,
.modal.race-modal .modal-dialog .modal-content .modal-body div.stats-area div.user-tabs div.tab-content div.raffle-table div.table-block div.table-item,
.modal.race-modal .modal-dialog .modal-content .modal-body div.stats-area div.user-tabs div.tab-content div.tab-pagination a.button {
    color: var(--legacy-text-muted) !important;
}

.modal.race-modal .modal-dialog .modal-content .modal-body div.vip-area ul.nav,
.modal.race-modal .modal-dialog .modal-content .modal-body div.vip-area div.tab-content div.vip-list div.list-block,
.modal.race-modal .modal-dialog .modal-content .modal-body div.vip-area div.tab-content div.vip-accordion div.card,
.modal.race-modal .modal-dialog .modal-content .modal-body div.vip-area div.tab-content div.vip-buttons a.button,
.modal.race-modal .modal-dialog .modal-content .modal-body div.stats-area div.user-statu div.statu-progress,
.modal.race-modal .modal-dialog .modal-content .modal-body div.stats-area div.user-tabs ul,
.modal.race-modal .modal-dialog .modal-content .modal-body div.stats-area div.user-tabs div.tab-content div.stats-blocks select,
.modal.race-modal .modal-dialog .modal-content .modal-body div.stats-area div.user-tabs div.tab-content div.stats-blocks div.stat-block,
.modal.race-modal .modal-dialog .modal-content .modal-body div.stats-area div.user-tabs div.tab-content div.stats-blocks a.download-button,
.modal.race-modal .modal-dialog .modal-content .modal-body div.stats-area div.user-tabs div.tab-content div.trophy-table div.table-body div.table-block,
.modal.race-modal .modal-dialog .modal-content .modal-body div.stats-area div.user-tabs div.tab-content div.races-table div.table-body div.table-block:nth-child(odd),
.modal.race-modal .modal-dialog .modal-content .modal-body div.stats-area div.user-tabs div.tab-content div.wins-list div.list-block,
.modal.race-modal .modal-dialog .modal-content .modal-body div.stats-area div.user-tabs div.tab-content div.raffle-table div.table-block:nth-child(even) {
    background-color: var(--color-surface-3) !important;
}

.modal.race-modal .modal-dialog .modal-content .modal-body div.vip-area ul.nav li button.active,
.modal.race-modal .modal-dialog .modal-content .modal-body div.stats-area div.user-tabs ul li button.active {
    background-color: rgba(var(--color-green-primary-rgb), 0.35) !important;
}

.modal.race-modal .modal-dialog .modal-content .modal-body div.leader-area div.leader-footer a.show-more,
.modal.race-modal .modal-dialog .modal-content .modal-body div.tickets-area div.tickets-footer a.show-more {
    background-color: rgba(var(--color-green-primary-rgb), 0.35) !important;
}

.modal.race-modal .modal-dialog .modal-content .modal-body div.leader-area div.leader-footer a.show-more:hover,
.modal.race-modal .modal-dialog .modal-content .modal-body div.tickets-area div.tickets-footer a.show-more:hover {
    background-color: rgba(var(--color-green-hover-rgb), 0.6) !important;
}

.modal.race-modal .modal-dialog .modal-content .modal-body div.vip-area div.tab-content div.vip-buttons a.button:hover,
.modal.race-modal .modal-dialog .modal-content .modal-body div.stats-area div.user-tabs div.tab-content div.stats-blocks a.download-button:hover {
    background-color: var(--color-green-hover) !important;
}

.modal.race-modal .modal-dialog .modal-content .modal-body div.vip-area div.tab-content div.vip-accordion div.card div.card-body {
    border-top: 1px solid var(--input-border) !important;
}

.modal-box div.game-head div.game-details a.game-provider {
    color: var(--color-green-light) !important;
}

.modal-box div.game-buttons span.button {
    background-color: var(--game-play-btn-bg) !important;
}

.modal-box div.game-buttons span.button.demo {
    background-color: var(--game-demo-btn-bg) !important;
    color: var(--game-demo-btn-color) !important;
}

.modal-box div.game-balance div.balance-box div.opener-wallet div.coins-list form.coin-search input,
.modal-box div.game-balance div.balance-box div.opener-wallet div.coins-list form.coin-search input::placeholder {
    color: var(--legacy-text-muted) !important;
}

.modal-box div.game-balance div.balance-box div.opener-wallet div.coins-list div.list span.coin span.balance,
.modal-box div.game-balance div.balance-box div.opener-wallet div.coins-list div.list span.coin span.details span.code,
.modal-box div.game-balance div.balance-box div.opener-wallet a.setting-button span.text {
    color: var(--color-surface-3) !important;
}

.modal-box div.game-balance div.balance-box div.opener-wallet a.setting-button {
    border-top: 1px solid rgba(255, 255, 255, 0.22) !important;
}

.modal-box div.game-fullscreen label.fullscreen div.fullscreen div.box {
    background-color: var(--color-surface-3) !important;
}

.modal-box div.game-fullscreen label.fullscreen div.fullscreen div.box:before {
    background-color: var(--color-surface-2) !important;
}

div.news-area div.news-box div.box-head span.close-button {
    background-color: var(--color-surface-3) !important;
}

div.news-area div.news-box div.box-listing div.message-blocks div.time-block div.messages div.message div.text span.user,
div.news-area div.news-box div.box-bottom div.user div.name,
div.news-area div.news-box div.box-bottom form.message-form input.message::placeholder,
div.news-area div.news-box div.box-bottom form.message-form div.message-info div.online,
div.news-area div.news-box div.box-bottom form.message-form div.message-info div.after {
    color: var(--legacy-text-muted) !important;
}

div.news-area div.news-box div.box-bottom form.message-form input.message {
    background-color: var(--color-surface-3) !important;
    color: var(--legacy-text-muted) !important;
    border: 1px solid var(--input-border) !important;
}

div.news-area div.news-box div.box-over::-webkit-scrollbar-track {
    background-color: var(--color-surface-3) !important;
}

div.news-area div.news-box div.box-over::-webkit-scrollbar-thumb {
    background: var(--color-green-primary) !important;
}

.chat div.message-list a.user-block.has-message div.details div.before div.name {
    color: var(--color-green-light) !important;
}

.chat div.message-list a.user-block div.details div.before div.message,
.chat div.message-list a.user-block div.details div.after div.time,
.chat div.message-blocks-user div.message-block div.user-messages div.info-message div.text {
    color: var(--legacy-text-muted) !important;
}

.chat div.message-list a.user-block div.details div.after div.statu {
    background-color: var(--color-green-primary) !important;
}

.chat div.message-blocks-user div.message-block div.user-head div.head-buttons .dropdown-menu {
    background-color: var(--color-surface-3) !important;
}

.chat div.message-blocks-user div.message-block div.user-head div.head-buttons .dropdown-menu a.link:hover {
    color: var(--color-green-hover) !important;
}

.chat div.message-blocks-user div.message-block div.user-messages div.info-message {
    border: 1px solid var(--color-surface-2) !important;
}

.chat div.message-blocks-user div.message-block div.user-messages div.block-message.owner div.block div.message {
    background-color: var(--color-surface-3) !important;
}

.chat div.message-blocks-user div.message-block div.user-messages div.block-message.answer div.block div.message {
    background-color: var(--color-green-primary) !important;
}

.chat div.message-blocks-user div.message-block div.user-messages div.block-message div.block div.time {
    color: var(--text-disabled) !important;
}

.chat div.message-blocks-user::-webkit-scrollbar-track {
    background-color: var(--color-surface-3) !important;
}

.chat div.message-blocks-user::-webkit-scrollbar-thumb {
    background: var(--color-green-primary) !important;
}

form.general-form div.form-group div.title,
form.general-form div.form-group div.form-item.form-item-text-icon input::placeholder,
form.general-form div.form-group div.form-item.form-item-select select,
form.general-form div.form-group div.form-item.form-item-select-2 select,
form.general-form div.form-group div.form-item.form-item-checkbox label.checkbox div.checkbox div.details div.d-title,
form.general-form div.form-group div.form-item.form-item-checkbox label.checkbox div.checkbox div.details div.desc,
form.general-form div.form-group div.form-item.form-item-radio label.radio div.radio div.text,
form.general-form div.form-group div.form-item.form-item-show-qr div.info,
form.general-form div.form-group div.copy-item div.text,
form.general-form div.coin-selecter div.current-coin div.details div.name,
form.general-form div.coin-selecter div.current-coin div.balance div.fiat,
form.general-form div.coin-selecter div.list-coin .coin-list div.details div.name,
form.general-form div.coin-selecter div.list-coin .coin-list div.balance div.fiat {
    color: var(--legacy-text-muted) !important;
}

form.general-form div.form-group div.title span.required {
    color: var(--danger) !important;
}

form.general-form div.form-group div.form-item label.error {
    background: linear-gradient(var(--danger), var(--danger)) !important;
}

form.general-form div.form-group div.form-item.form-item-text input,
form.general-form div.form-group div.form-item.form-item-coin input,
form.general-form div.form-group div.form-item.form-item-password input,
form.general-form div.form-group div.form-item.form-item-select select,
form.general-form div.form-group div.form-item.form-item-coin div.simple-coin-select div.selecter-coin,
form.general-form div.form-group div.form-item.form-item-info,
form.general-form div.form-group div.form-item.form-item-coins label.coin div.coin div.check,
form.general-form div.form-group div.form-item.form-item-checkbox label.checkbox div.checkbox div.box,
form.general-form div.form-group div.copy-item,
form.general-form button.add-item {
    background-color: var(--input-bg-solid) !important;
}

form.general-form div.form-group div.form-item.form-item-checkbox label.checkbox div.checkbox div.box:before {
    background-color: var(--color-surface-2) !important;
}

form.general-form div.form-group div.form-item.form-item-radio label.radio div.radio div.icon {
    border: 3px solid var(--color-surface-3) !important;
}

form.general-form div.form-group div.form-item.form-item-text input,
form.general-form div.form-group div.form-item.form-item-text-icon input,
form.general-form div.form-group div.form-item.form-item-coin input,
form.general-form div.form-group div.form-item.form-item-withdraw input,
form.general-form div.form-group div.form-item.form-item-password input,
form.general-form div.form-group div.form-item.form-item-select select,
form.general-form div.form-group div.form-item.form-item-select-2 select,
form.general-form div.form-group div.form-item.form-item-coin div.simple-coin-select div.selecter-coin,
form.general-form div.form-group div.form-item.form-item-copy,
form.general-form div.form-group div.form-item.form-item-image label.file div.file,
form.general-form div.form-group div.copy-item,
form.general-form div.coin-selecter div.current-coin,
form.general-form button.add-item {
    border: 1px solid var(--input-border) !important;
}

form.general-form div.form-group div.form-item.form-item-text input.valid,
form.general-form div.form-group div.form-item.form-item-text-icon input.valid,
form.general-form div.form-group div.form-item.form-item-coin input.valid,
form.general-form div.form-group div.form-item.form-item-withdraw input.valid,
form.general-form div.form-group div.form-item.form-item-password input.valid,
form.general-form div.form-group div.form-item.form-item-select select.valid,
form.general-form div.form-group div.form-item.form-item-select-2 select.valid {
    border-color: var(--input-border-focus) !important;
}

form.general-form div.form-group div.form-item.form-item-text input.error,
form.general-form div.form-group div.form-item.form-item-text-icon input.error,
form.general-form div.form-group div.form-item.form-item-coin input.error,
form.general-form div.form-group div.form-item.form-item-withdraw input.error,
form.general-form div.form-group div.form-item.form-item-password input.error,
form.general-form div.form-group div.form-item.form-item-select select.error,
form.general-form div.form-group div.form-item.form-item-select-2 select.error {
    background: linear-gradient(var(--color-surface-3), var(--color-surface-3)) padding-box,
        linear-gradient(to right, var(--danger), var(--danger)) border-box !important;
}

form.general-form div.form-buttons button {
    background-color: var(--btn-primary-bg) !important;
}

form.general-form div.form-buttons button.red {
    background-image: linear-gradient(to right, var(--danger), var(--danger)) !important;
}

.game-item div.game-top div.game-opener {
    border: 2px solid var(--game-opener-border) !important;
}

.game-item div.game-top div.game-opener div.play-buttons span.button,
.game-item div.game-top div.game-opener div.play-buttons a.button {
    background-color: var(--game-play-btn-bg) !important;
}

.game-item div.game-top div.game-opener div.play-buttons span.button.demo,
.game-item div.game-top div.game-opener div.play-buttons a.button.demo {
    background-color: var(--game-demo-btn-bg) !important;
    color: var(--game-demo-btn-color) !important;
}

.game-item div.game-details .game-provider,
.game-item div.game-details .game-name {
    color: var(--legacy-text-muted) !important;
}

div.game-play div.game-before div.game-balance div.balance-box div.opener-wallet div.coins-list form.coin-search input,
div.game-play div.game-before div.game-balance div.balance-box div.opener-wallet div.coins-list form.coin-search input::placeholder {
    color: var(--legacy-text-muted) !important;
}

div.game-play div.game-before div.game-balance div.balance-box div.opener-wallet div.coins-list div.list span.coin span.balance,
div.game-play div.game-before div.game-balance div.balance-box div.opener-wallet div.coins-list div.list span.coin span.details span.code,
div.game-play div.game-before div.game-balance div.balance-box div.opener-wallet a.setting-button span.text {
    color: var(--color-surface-3) !important;
}

div.game-play div.game-before div.game-balance div.balance-box div.opener-wallet a.setting-button {
    border-top: 1px solid rgba(255, 255, 255, 0.22) !important;
}

div.game-play div.game-before div.game-buttons span.button.real {
    background-color: var(--game-play-btn-bg) !important;
}

div.game-play div.game-before div.game-buttons span.button.demo {
    background-color: var(--game-demo-btn-bg) !important;
    color: var(--game-demo-btn-color) !important;
}

div.game-info a.game-provider,
div.game-info div.user div.m,
div.game-info div.user div.name {
    color: var(--legacy-text-muted) !important;
}

div.game-after {
    background-color: var(--color-surface-1) !important;
}

div.game-after a.page-go-back {
    background-color: var(--color-surface-3) !important;
}

div.game-after ul li button.active {
    border-bottom: 2px solid var(--color-green-primary) !important;
}

div.game-after div.tab-content div.tab-pane div.profile-area div.wallet-menu div.current-wallet a.wallet-button,
div.game-after div.tab-content div.tab-pane div.profile-area div.last-button a.button {
    background-color: var(--btn-primary-bg) !important;
}

div.game-after div.tab-content div.tab-pane div.profile-area div.wallet-menu div.opener-wallet div.coins-list form.coin-search input,
div.game-after div.tab-content div.tab-pane div.profile-area div.wallet-menu div.opener-wallet div.coins-list form.coin-search input::placeholder,
div.game-after div.tab-content div.tab-pane div.profile-area div.user-achivements div.user-status div.user-statu div.statu-head div.percentage-box div.text {
    color: var(--legacy-text-muted) !important;
}

div.game-after div.tab-content div.tab-pane div.profile-area div.wallet-menu div.opener-wallet div.coins-list div.list a.coin span.balance,
div.game-after div.tab-content div.tab-pane div.profile-area div.wallet-menu div.opener-wallet div.coins-list div.list a.coin span.details span.code,
div.game-after div.tab-content div.tab-pane div.profile-area div.wallet-menu div.opener-wallet a.setting-button span.text {
    color: var(--color-surface-3) !important;
}

div.game-after div.tab-content div.tab-pane div.profile-area div.wallet-menu div.opener-wallet a.setting-button {
    border-top: 1px solid rgba(255, 255, 255, 0.22) !important;
}

div.game-after div.tab-content div.tab-pane div.profile-area div.user-achivements div.user-status div.user-statu div.statu-progress {
    background-color: var(--color-surface-3) !important;
}

div.game-after div.tab-content div.tab-pane div.profile-area div.user-achivements::-webkit-scrollbar-track,
div.game-after div.tab-content div.tab-pane div.wallet-area div.coins-area::-webkit-scrollbar-track {
    background-color: var(--color-surface-3) !important;
}

div.game-after div.tab-content div.tab-pane div.profile-area div.user-achivements::-webkit-scrollbar-thumb,
div.game-after div.tab-content div.tab-pane div.wallet-area div.coins-area::-webkit-scrollbar-thumb {
    background: var(--color-green-primary) !important;
}

.tournament-item .tournament-item-big figure.item-image div.prize,
.tournament-item .tournament-item-big div.tournament-details {
    background-color: var(--color-surface-2) !important;
}

.tournament-item .tournament-item-big div.tournament-details div.sub,
.tournament-item .tournament-item-big div.tournament-details div.simple-tab ul.tab-menu li button,
.tournament-item .tournament-item-big div.tournament-details div.simple-tab div.tab-blocks div.tab-block div.game-table div.table-head div.id,
.tournament-item .tournament-item-big div.tournament-details div.simple-tab div.tab-blocks div.tab-block div.game-table div.table-head div.name,
.tournament-item .tournament-item-big div.tournament-details div.simple-tab div.tab-blocks div.tab-block div.game-table div.table-list div.list-block div.details div.provider,
.tournament-item .tournament-item-big div.tournament-details div.simple-tab div.tab-blocks div.tab-block div.lead-table div.table-head {
    color: var(--legacy-text-muted) !important;
}

.tournament-item .tournament-item-big div.tournament-details div.simple-tab ul.tab-menu,
.tournament-item .tournament-item-big div.tournament-details div.simple-tab div.tab-blocks div.tab-block div.game-table div.table-list div.list-block div.details,
.tournament-item .tournament-item-big div.tournament-details div.simple-tab div.tab-blocks div.tab-block div.lead-table div.table-list div.list-block,
.tournament-item .tournament-item-big div.tournament-details .countdown-block {
    background-color: var(--color-surface-3) !important;
}

.tournament-item .tournament-item-big div.tournament-details div.simple-tab ul.tab-menu li button.active {
    background-color: rgba(var(--color-green-primary-rgb), 0.35) !important;
}

.tournament-item.purple .tournament-up div.dates span,
.tournament-item.purple .tournament-item-big div.prize:before,
.tournament-item.purple .tournament-item-big div.tournament-details .countdown-block:before,
.tournament-item.purple .tournament-item-big div.tournament-details a.button,
.tournament-item-2.purple .tournament-up div.dates span,
.tournament-item-2.purple .tournament-item-small div.item-bottom:before,
.tournament-item-2.purple .tournament-item-small div.item-bottom div.button:before {
    background-image: var(--gradient-green-sweep) !important;
}

.tournament-item.purple .tournament-item-big div.prize span,
.tournament-item-2.purple .tournament-item-small figure.item-image div.countdown div.time div.block.colored div.name span,
.tournament-item-2.purple .tournament-item-small figure.item-image div.countdown div.time div.block.colored div.count span,
.tournament-item-2.purple .tournament-item-small div.item-bottom div.details div.title {
    background: var(--gradient-green-text) !important;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

.tournament-item.red .tournament-up div.dates span,
.tournament-item.red .tournament-item-big div.prize:before,
.tournament-item.red .tournament-item-big div.tournament-details .countdown-block:before,
.tournament-item.red .tournament-item-big div.tournament-details a.button,
.tournament-item-2.red .tournament-up div.dates span,
.tournament-item-2.red .tournament-item-small div.item-bottom:before,
.tournament-item-2.red .tournament-item-small div.item-bottom div.button:before {
    background-image: linear-gradient(to right, var(--danger), var(--danger)) !important;
}

.tournament-item.red .tournament-item-big div.prize span,
.tournament-item-2.red .tournament-item-small figure.item-image div.countdown div.time div.block.colored div.name span,
.tournament-item-2.red .tournament-item-small figure.item-image div.countdown div.time div.block.colored div.count span,
.tournament-item-2.red .tournament-item-small div.item-bottom div.details div.title {
    background: linear-gradient(var(--danger), var(--danger)) !important;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

.tournament-item-2 .tournament-item-small figure.item-image div.countdown {
    background-color: var(--color-surface-2) !important;
}

.tournament-item-2 .tournament-item-small figure.item-image div.countdown div.time div.block div.count,
.tournament-item-2 .tournament-item-small div.item-bottom {
    background-color: var(--color-surface-3) !important;
}

div.tournaments-jackpot,
div.tournaments-listing-new div.listing-block div.listing-item div.tournament-blocks div.tournament-block:last-child {
    background-color: var(--color-surface-1) !important;
}

div.tournaments-listing-new div.listing-block div.listing-item div.tournament-blocks div.tournament-block div.tournament-details a.button {
    background-color: var(--btn-primary-bg) !important;
}

.page div.tournement-steps {
    background-color: var(--color-surface-2) !important;
}

.page div.tournement-steps div.steps-list div.step-block div.button,
.page div.tournement-steps div.steps-list div.step-block.active ~ div.step-block div.count {
    background-color: var(--color-surface-3) !important;
}

.page div.tournement-steps div.steps-list div.step-block.active ~ div.step-block div.button span {
    color: var(--legacy-text-muted) !important;
}

.page div.tournament-details span.more-button {
    background-color: var(--btn-primary-bg) !important;
}

.page div.tournament-details div.tournament-content figure.tournament-image div.prize {
    background-color: var(--color-surface-2) !important;
}

.page div.tournament-details div.participants-head,
.page div.tournament-details div.leader-list div.list-block {
    background-color: var(--color-surface-1) !important;
}

.page div.tournament-games div.games-header div.header-first div.favs {
    border: 2px solid var(--color-surface-3) !important;
}

.page div.tournament-games div.games-header div.header-first div.favs div.count,
.page div.tournament-games div.games-header div.header-first div.games-tabs ul li button span.text,
.page div.tournament-games div.games-header div.header-second select {
    color: var(--legacy-text-muted) !important;
}

.page div.tournament-games div.games-header div.header-first div.games-tabs ul li button.active {
    background-color: var(--color-surface-3) !important;
}

.page div.tournament-games div.games-header div.header-second a.button {
    background-color: var(--btn-primary-bg) !important;
}

div.race-carousels div.slider-item .race-item div.head div.details div.desc {
    color: var(--legacy-text-muted) !important;
}

div.race-carousels div.slider-item .race-item div.head div.details div.buttons a.button {
    background-color: var(--btn-primary-bg) !important;
}

div.race-carousels div.slider-item .race-item div.bottom {
    border-top: 1px solid var(--color-surface-3) !important;
}

div.promotions-area > ul li button.active {
    background-image: var(--gradient-primary-horizontal) !important;
}

div.promotions-area > ul li button span.text,
div.promotion-list a.listing-block div.listing-item div.item-top div.item-back div.items div.sub,
div.promotion-list a.listing-block div.listing-item div.item-top div.item-back div.items div.desc,
div.promotion-list a.listing-block div.listing-item div.item-top div.item-back div.items div.blocks div.block div.name,
div.promotion-list a.listing-block div.listing-item div.item-top div.item-back div.items div.blocks div.block div.value {
    color: var(--legacy-text-muted) !important;
}

div.promotion-list a.listing-block div.listing-item div.item-top div.item-back div.items div.blocks div.block {
    background-color: rgba(12, 36, 24, 0.52) !important;
}

div.promotion-list a.listing-block div.listing-item div.item-bottom {
    background-color: var(--color-surface-3) !important;
}

div.promotion-list-2 div.listing-item {
    border: 1px solid var(--color-surface-1) !important;
}

div.promotion-list-2 div.listing-item div.item-top div.blocks div.block,
div.promotion-list-2 div.listing-item div.item-bottom,
div.promotion-list-2 div.promotion-item {
    background-color: var(--color-surface-1) !important;
}

div.promotion-list-2 div.listing-item div.item-bottom div.before-info div.back a.cancel {
    background: linear-gradient(84deg, var(--danger), var(--danger)) !important;
}

div.promotion-list-2 div.promotion-item div.item-buttons a.button,
div.promotion-list-2 div.promotion-item div.item-form button {
    background-color: var(--btn-primary-bg) !important;
}

.streamers div.top-streamers div.top-menu div.first-menu a.button,
.streamers div.top-streamers div.top-menu div.first-menu a.more {
    background-color: var(--color-surface-2) !important;
    color: var(--legacy-text-muted) !important;
    border: 1px solid var(--surface-border-soft) !important;
}

.streamers div.top-streamers div.top-menu div.first-menu a.button:hover,
.streamers div.top-streamers div.top-menu div.first-menu a.button.active,
.streamers div.top-streamers div.top-menu div.first-menu a.more:hover,
.streamers div.top-streamers div.top-menu div.first-menu a.more.active {
    color: var(--color-green-light) !important;
    background-color: rgba(var(--color-green-primary-rgb), 0.16) !important;
    border-color: rgba(var(--color-green-primary-rgb), 0.35) !important;
}

.streamers.active div.top-streamers div.top-menu div.first-menu a.more {
    background-color: rgba(var(--color-green-primary-rgb), 0.16) !important;
    border-color: rgba(var(--color-green-primary-rgb), 0.35) !important;
    color: var(--color-green-light) !important;
}

.streamers div.top-streamers div.top-menu div.opener-menu {
    background-color: var(--color-surface-1) !important;
}

.streamers div.top-streamers div.top-menu div.opener-menu ul li button,
.streamers div.top-streamers div.top-menu div.opener-menu div.country-list a.button {
    color: var(--legacy-text-muted) !important;
}

.streamers div.top-streamers div.top-menu div.opener-menu div.country-list a.button {
    border: 1px solid var(--surface-border-soft) !important;
}

.streamers div.top-streamers div.top-menu div.opener-menu ul li button.active {
    color: var(--color-green-light) !important;
}

.streamers div.top-streamers div.top-menu div.opener-menu div.country-list a.button:hover {
    color: var(--color-green-light) !important;
    border-color: var(--color-green-hover) !important;
}

.streamers div.top-streamers div.top-listing div.listing-block div.listing-item figure.item-image,
.streamers div.small-streamers div.small-listing div.listing-block div.listing-item figure.item-image {
    border: 4px solid var(--color-surface-2) !important;
}

.streamers div.top-streamers div.top-listing div.listing-block div.listing-item figure.item-image:before,
.streamers div.small-streamers div.small-listing div.listing-block div.listing-item figure.item-image:before {
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, var(--color-green-primary) 100%) !important;
}

.streamers div.top-streamers div.top-listing div.listing-block div.listing-item figure.item-image img.streamer-image {
    border: 12px solid var(--color-surface-1) !important;
}

.streamers div.top-streamers div.top-listing div.listing-block div.listing-item figure.item-image div.view {
    background-color: var(--color-green-primary) !important;
}

.streamers div.small-streamers div.small-listing div.listing-block div.listing-item figure.item-image div.view {
    background-color: var(--color-surface-2) !important;
}

.streamers div.top-streamers div.top-listing div.listing-block div.listing-item div.item-details,
.streamers div.small-streamers div.small-listing div.listing-block div.listing-item div.item-details {
    background-color: var(--color-surface-1) !important;
}

.streamers div.top-streamers div.top-listing div.listing-block div.listing-item div.item-details div.item-watch,
.streamers div.small-streamers div.small-listing div.listing-block div.listing-item div.item-details div.item-watch {
    background-color: var(--color-surface-2) !important;
}

.streamers div.top-streamers div.top-listing div.listing-block div.listing-item div.item-details div.item-first div.item-desc p span span:nth-child(2) {
    color: var(--legacy-text-muted) !important;
}

.streamers div.ranks-area div.ranks-head,
.streamers div.ranks-area div.ranks-list div.list-block {
    background-color: var(--color-surface-3) !important;
}

.streamers div.ranks-area div.ranks-list div.list-block div.icon,
.streamers div.ranks-area div.ranks-list div.list-block div.author.hidden div.name,
.streamers div.ranks-area div.ranks-list div.list-block div.details div.money div.text {
    color: var(--legacy-text-muted) !important;
}

.streamers div.ranks-area .more-button {
    background-color: var(--btn-primary-bg) !important;
}

.page div.page-header div.countdown div.time div.block div.count,
.page div.page-top a.page-go-back {
    background-color: var(--color-surface-3) !important;
}

.page div.page-body div.page-sidebar ul.sidebar-menu li a:hover,
.page div.page-body div.page-sidebar ul.sidebar-menu li a.active,
.page div.page-body div.page-sidebar ul.sidebar-menu li a:active {
    background-color: var(--color-surface-3) !important;
}

.page div.page-body div.page-sidebar div.page-selecter div.current {
    background-color: var(--color-surface-2) !important;
}

.page div.page-body div.page-content,
.page div.page-body div.page-content div.deposit-box div.box-title,
.page div.page-body div.page-content div.comission-blocks div.comission-block div.desc,
.page div.page-body div.page-content div.funds-area div.funds-header select,
.page div.page-body div.page-content div.stat-block div.count,
.page div.page-body div.page-content div.stat-block div.last,
.page div.page-body div.page-content div.campaign-list div.campaign-block div.campaign-header div.user,
.page div.page-body div.page-content div.campaign-list div.campaign-block div.campaign-header div.details div.commission,
.page div.page-body div.page-content div.campaign-list div.campaign-block div.campaign-body div.stat-link div.copy-box div.link div.title,
.page div.page-body div.page-content div.transactions-area ul li button,
.page div.page-body div.page-content div.transactions-area div.transactions-table div.table-listing div.listing-block div.item-first div.transaction-details div.details div.date,
.page div.page-body div.page-content div.table-footer div.table-pagination span.item,
.page div.page-body div.page-content div.form-blocks div.form-block div.form-block-header div.desc,
.page div.page-body div.page-content div.form-blocks div.form-block div.form-block-footer div.buttons a.button,
.page div.page-body div.page-content div.no-data div.text,
.page div.page-body div.page-content div.user-list div.table-head div.head-item,
.page div.page-body div.page-content div.user-list div.table-listing div.listing-item,
.page div.page-body div.page-content div.users-head div.block div.select select,
.page div.page-body div.page-content div.sessions-filter select {
    color: var(--legacy-text-muted) !important;
}

.page div.page-body div.page-content div.deposit-box div.box-blocks div.copy-box,
.page div.page-body div.page-content div.deposit-box div.box-blocks a.download-button,
.page div.page-body div.page-content div.comission-blocks div.comission-block div.value,
.page div.page-body div.page-content div.campaign-list div.campaign-block,
.page div.page-body div.page-content div.transactions-area ul,
.page div.page-body div.page-content div.transactions-area div.transactions-table div.table-listing div.listing-block:nth-child(even),
.page div.page-body div.page-content div.table-footer div.table-buttons a.download-button,
.page div.page-body div.page-content div.no-data,
.page div.page-body div.page-content div.other-table,
.page div.page-body div.page-content div.user-list div.table-listing div.listing-block:nth-child(odd) {
    background-color: var(--color-surface-2) !important;
}

.page div.page-body div.page-content div.other-table div.table-listing div.listing-block:nth-child(odd),
.page div.page-body div.page-content div.campaign-list div.campaign-block div.campaign-body div.stat-link div.copy-box {
    background-color: var(--color-surface-3) !important;
}

.page div.page-body div.page-content div.transactions-area ul li button.active {
    background-color: rgba(var(--color-green-primary-rgb), 0.35) !important;
}

.page div.page-body div.page-content div.campaign-list div.campaign-block div.campaign-body {
    border-top: 1px solid var(--input-border) !important;
}

.page div.page-body div.page-content div.form-blocks div.form-block div.form-block-header {
    border-bottom: 1px solid var(--input-border) !important;
}

.page div.page-body div.page-content div.form-blocks div.form-block div.form-block-footer {
    border-top: 1px solid var(--input-border) !important;
}

.page div.page-body div.page-content div.verify-blocks div.verify-block div.block-header {
    border-bottom: 1px solid var(--input-border) !important;
}

.page div.page-body div.page-content div.form-blocks div.form-block div.form-block-footer div.buttons button {
    background-color: var(--btn-primary-bg) !important;
}

.page div.page-body div.page-content div.user-list div.table-listing div.listing-item span {
    background: linear-gradient(var(--danger), var(--danger)) !important;
}

div.profile-box {
    background-color: var(--color-surface-1) !important;
}

div.profile-box nav.main-menu ul li a.active {
    border-bottom-color: var(--color-green-primary) !important;
}

div.main-box div.profile-block {
    background-color: var(--color-surface-1) !important;
}

div.main-box div.profile-block form.general-form div.form-group div.form-item.form-item-select select.valid {
    border-color: var(--input-border-focus) !important;
}

div.main-box div.profile-block div.block-header div.block-title {
    border-bottom: 2px solid var(--color-green-primary) !important;
}

div.main-box div.profile-block div.block-footer div.block-buttons button {
    background-color: var(--btn-primary-bg) !important;
}

div.main-box div.wallet-boxs ul.nav-boxs,
div.main-box div.wallet-boxs div.tab-contents {
    background-color: var(--color-surface-1) !important;
}

div.main-box div.wallet-boxs ul.nav-boxs li button.active {
    border-bottom-color: var(--color-green-primary) !important;
}

div.main-box div.wallet-boxs div.tab-contents div.tab-content div.wallet-buttons a.button.deposit {
    background-color: var(--wallet-deposit-bg) !important;
}

div.main-box div.wallet-boxs div.tab-contents div.tab-content div.wallet-buttons a.button.withdraw {
    background-image: var(--gradient-withdraw) !important;
}

div.main-box div.wallet-boxs div.tab-contents div.tab-content ul.nav li button,
div.main-box div.wallet-boxs div.tab-contents div.tab-content div.text,
div.main-box div.wallet-boxs div.tab-contents div.tab-content div.note,
div.main-box div.wallet-boxs div.tab-contents div.tab-content div.transactions-table div.table-listing div.listing-block div.item-first div.transaction-details div.details div.date {
    color: var(--legacy-text-muted) !important;
}

div.main-box div.wallet-boxs div.tab-contents div.tab-content ul.nav li button.active {
    background-color: var(--tab-active-bg) !important;
}

div.main-box div.wallet-boxs div.tab-contents div.footer-2fa a.button:hover {
    background-color: var(--color-green-hover) !important;
}

div.main-box div.status-box ul.nav-boxs,
div.main-box div.status-box div.tab-contents {
    background-color: var(--color-surface-1) !important;
}

div.main-box div.status-box ul.nav-boxs li button.active {
    border-bottom-color: var(--color-green-primary) !important;
}

div.main-box div.status-box div.tab-contents div.tab-content div.vip-list div.list-block div.details div.desc {
    color: var(--legacy-text-muted) !important;
}

div.main-box div.status-box div.tab-contents div.tab-content div.vip-accordion div.card div.card-body {
    border-top: 1px solid var(--input-border) !important;
}

div.main-box div.status-box div.tab-contents div.tab-content div.vip-buttons a.button:hover {
    background-color: var(--color-green-hover) !important;
}

.auth div.auth-box {
    background-color: var(--color-surface-1) !important;
}

.auth div.auth-box ul.nav li button,
.auth div.auth-box form.auth-form div.form-group div.title,
.auth div.auth-box div.or-auth div.dont {
    color: var(--legacy-text-muted) !important;
}

.auth div.auth-box ul.nav li button:before {
    background-color: var(--color-green-primary) !important;
}

.auth div.auth-box form.auth-form div.form-group div.title span.required {
    color: var(--danger) !important;
}

.auth div.auth-box form.auth-form div.form-group div.form-item label.error {
    background: linear-gradient(var(--danger), var(--danger)) !important;
}

.auth div.auth-box form.auth-form div.form-group div.form-item.form-item-text input,
.auth div.auth-box form.auth-form div.form-group div.form-item.form-item-password input,
.auth div.auth-box form.auth-form div.form-group div.form-item.form-item-select select,
.auth div.auth-box div.or-auth div.other-buttons a.button {
    background-color: var(--input-bg-solid) !important;
}

.auth div.auth-box form.auth-form div.form-group div.form-item.form-item-text input.valid,
.auth div.auth-box form.auth-form div.form-group div.form-item.form-item-password input.valid,
.auth div.auth-box form.auth-form div.form-group div.form-item.form-item-select select.valid {
    border-color: var(--input-border-focus) !important;
}

.auth div.auth-box form.auth-form div.form-group div.form-item.form-item-text input.error,
.auth div.auth-box form.auth-form div.form-group div.form-item.form-item-password input.error {
    background: linear-gradient(var(--color-surface-3), var(--color-surface-3)) padding-box,
        linear-gradient(to right, var(--danger), var(--danger)) border-box !important;
}

.auth div.auth-box form.auth-form div.form-buttons button {
    background-color: var(--btn-primary-bg) !important;
}

footer#footer {
    background-color: var(--footer-bg) !important;
    color: var(--legacy-text-muted) !important;
    margin-top: 110px !important;
    padding-bottom: 30px !important;
}

footer#footer div.footer-menus nav.footer-menu ul li,
footer#footer div.footer-bottom div.about,
footer#footer div.footer-bottom div.emails a.mail {
    color: var(--legacy-text-muted) !important;
}

footer#footer div.footer-menus nav.footer-menu ul li:hover {
    color: var(--color-green-light) !important;
}

footer#footer div.footer-currencies div.currency-title.active div.title {
    color: var(--color-green-light) !important;
}

footer#footer div.footer-licences {
    border-bottom: 1px solid var(--surface-border-soft) !important;
}

.modal .modal-content {
    background: var(--modalbg);
    border: 1px solid rgba(var(--color-green-primary-rgb), 0.45);
    border-radius: var(--modal-radius);
    box-shadow: var(--modal-shadow);
}

.modal ::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}

.modal ::-webkit-scrollbar-track {
    background: var(--color-surface-1);
    border-radius: 999px;
}

.modal ::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, var(--color-green-hover), var(--color-green-deep));
    border-radius: 999px;
}

.modal input:focus-visible,
.modal select:focus-visible,
.modal textarea:focus-visible {
    outline: none;
    box-shadow: var(--focus-ring);
}

.modal ::selection {
    background: rgba(var(--color-green-primary-rgb), 0.65);
    color: #fff;
}

@media (max-width: 991px) {
    body.chat .sticky-menu,
    body.game-open header#header,
    .search-menu form.search-form div.select {
        background-color: var(--color-surface-2) !important;
    }

    .search-menu form.search-form input,
    .search-menu form.search-form input::placeholder,
    .search-menu div.search-listing div.listing-block div.listing-item div.item-details div.provider,
    .search-menu div.search-listing div.listing-block div.listing-item div.item-details div.name {
        color: var(--legacy-text-muted) !important;
    }
}

.lowbar-fab__backdrop {
    background:
        radial-gradient(circle at 82% 88%, rgba(var(--color-green-light-rgb), 0.12), transparent 32%),
        linear-gradient(rgba(1, 13, 8, 0), rgba(1, 13, 8, 0.72) 24%, rgba(1, 13, 8, 0.92)) !important;
    -webkit-backdrop-filter: blur(3px) !important;
    backdrop-filter: blur(3px) !important;
}

.lowbar-fab__stack {
    gap: 10px !important;
}

.lowbar-fab__action,
.lowbar-fab__action.is-support,
.lowbar-fab__action.is-home,
.lowbar-fab__action.is-chat,
.lowbar-fab__action.is-deposit,
.lowbar-fab__action.is-bonus,
.lowbar-fab__action.is-wallet,
.lowbar-fab__action.is-login,
.lowbar-fab__action.is-register {
    background: linear-gradient(180deg, rgba(7, 26, 16, 0.97), rgba(4, 13, 8, 0.97)) !important;
    border: 1px solid rgba(var(--color-green-light-rgb), 0.26) !important;
    border-radius: 12px !important;
    box-shadow: 0 14px 30px rgba(0, 0, 0, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

.lowbar-fab__action:before {
    background: linear-gradient(rgba(255, 255, 255, 0.07), transparent 36%),
        radial-gradient(240px 80px at 0 0, rgba(var(--color-green-primary-rgb), 0.32), transparent 58%) !important;
}

.lowbar-fab__action:after {
    background: radial-gradient(circle, rgba(var(--color-green-light-rgb), 0.15), transparent 70%) !important;
}

.lowbar-fab__action .icon,
.lowbar-fab__action.is-support .icon,
.lowbar-fab__action.is-home .icon,
.lowbar-fab__action.is-chat .icon,
.lowbar-fab__action.is-deposit .icon,
.lowbar-fab__action.is-bonus .icon,
.lowbar-fab__action.is-wallet .icon,
.lowbar-fab__action.is-login .icon,
.lowbar-fab__action.is-register .icon {
    background: linear-gradient(180deg, rgba(var(--color-green-primary-rgb), 0.55), rgba(1, 42, 20, 0.45)) !important;
    border: 1px solid rgba(var(--color-green-light-rgb), 0.4) !important;
    border-radius: 9px !important;
    box-shadow: 0 6px 14px rgba(var(--color-green-primary-rgb), 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

.lowbar-fab__action .icon img {
    filter: brightness(0) invert(1) !important;
}

.lowbar-fab__action .label {
    color: #f2fff8 !important;
    font-family: var(--font-family-semibold) !important;
    letter-spacing: 0.01em !important;
}

.lowbar-fab__action:hover {
    border-color: rgba(var(--color-green-bright-rgb), 0.55) !important;
    filter: brightness(1.07) !important;
}

.lowbar-fab__trigger-glyph--close {
    position: absolute !important;
    inset: 0 !important;
    margin: auto !important;
    width: 46px !important;
    height: 46px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: rgba(4, 13, 8, 0.92) !important;
    border: 1px solid rgba(var(--color-green-light-rgb), 0.55) !important;
    border-radius: 999px !important;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.5), 0 0 14px rgba(var(--color-green-light-rgb), 0.18) !important;
}

.lowbar-fab__trigger-glyph--close img,
.lowbar-fab__trigger-glyph--close svg,
.lowbar-fab__trigger-glyph--close span {
    display: none !important;
}

.lowbar-fab__trigger-glyph--close::before,
.lowbar-fab__trigger-glyph--close::after {
    content: "" !important;
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    width: 18px !important;
    height: 2px !important;
    border-radius: 2px !important;
    background: #ffffff !important;
}

.lowbar-fab__trigger-glyph--close::before {
    transform: translate(-50%, -50%) rotate(45deg) !important;
}

.lowbar-fab__trigger-glyph--close::after {
    transform: translate(-50%, -50%) rotate(-45deg) !important;
}

.lowbar-fab.is-open .lowbar-fab__trigger-glyph--close {
    opacity: 1 !important;
    transform: scale(1) rotate(0deg) !important;
}

.lowbar-fab:not(.is-open) .lowbar-fab__trigger-glyph--close {
    opacity: 0 !important;
    transform: scale(0.7) !important;
    pointer-events: none !important;
}

.lowbar-fab.is-open .lowbar-fab__trigger-glyph--menu {
    opacity: 0 !important;
    transform: scale(0.8) !important;
}

@media (prefers-reduced-motion: reduce) {
    .lowbar-fab__action,
    .lowbar-fab__trigger-glyph--close,
    .lowbar-fab__trigger-glyph--menu {
        transition: none !important;
    }
}

.promotion-detail-page .ph6q {
    margin-bottom: 18px;
}

.promotion-detail-shell {
    max-width: 960px;
    margin: 0 auto;
    padding: 6px 0 48px;
}

@keyframes cbPromoCardIn {
    from { opacity: 0; transform: translateY(16px); }
    to   { opacity: 1; transform: translateY(0); }
}

.promotion-detail-card {
    position: relative;
    background:
        radial-gradient(720px 260px at 50% -8%, rgba(var(--color-green-primary-rgb), 0.2), transparent 62%),
        linear-gradient(180deg, rgba(7, 26, 16, 0.96), rgba(3, 10, 6, 0.98));
    border: 1px solid rgba(var(--color-green-primary-rgb), 0.45);
    border-radius: 16px;
    padding: 26px 26px 30px;
    box-shadow:
        0 24px 60px rgba(0, 0, 0, 0.5),
        0 0 24px rgba(var(--color-green-primary-rgb), 0.1),
        inset 0 1px 0 rgba(255, 255, 255, 0.05);
    animation: cbPromoCardIn 0.45s cubic-bezier(.2, .9, .2, 1) both;
}

.promotion-detail-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 8%;
    right: 8%;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, transparent, rgba(var(--color-green-light-rgb), 0.75), transparent);
    pointer-events: none;
}

.promotion-detail-close {
    position: absolute;
    top: 14px;
    right: 14px;
    z-index: 5;
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0;
    line-height: 0;
    color: rgba(255, 255, 255, 0.75);
    background: rgba(0, 0, 0, 0.5);
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 999px;
    cursor: pointer;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.15s ease;
}

.promotion-detail-close::before,
.promotion-detail-close::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 14px;
    height: 2px;
    border-radius: 2px;
    background: currentColor;
    pointer-events: none;
}

.promotion-detail-close::before { transform: translate(-50%, -50%) rotate(45deg); }
.promotion-detail-close::after  { transform: translate(-50%, -50%) rotate(-45deg); }

.promotion-detail-close:hover {
    color: #ffffff;
    background: rgba(var(--danger-rgb), 0.9);
    border-color: rgba(var(--danger-rgb), 0.95);
    transform: scale(1.08);
}

.promotion-detail-image {
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.08);
    margin-bottom: 20px;
    background: var(--color-surface-1);
    line-height: 0;
    font-size: 0;
}

.promotion-detail-image img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
}

.promotion-detail-card h1 {
    margin: 0 0 10px;
    padding-right: 44px;
    font-family: var(--font-family-bold), sans-serif;
    font-size: clamp(22px, 3.2vw, 30px);
    font-weight: 900;
    line-height: 1.15;
    color: #ffffff;
    text-shadow: 0 8px 24px rgba(0, 0, 0, 0.5);
}

.promotion-detail-lead {
    margin: 0 0 22px;
    padding: 10px 14px;
    font-size: 14px;
    line-height: 1.6;
    color: rgba(220, 244, 232, 0.85);
    background: rgba(var(--color-green-primary-rgb), 0.1);
    border-left: 3px solid var(--color-green-light);
    border-radius: 0 10px 10px 0;
}

.promotion-detail-content {
    color: var(--text-secondary);
    font-size: 14px;
    line-height: 1.65;
}

.promotion-detail-content img {
    max-width: 100%;
    height: auto;
    border-radius: 10px;
}

.promotion-detail-content a {
    color: var(--color-green-light);
}

.promotion-detail-content a:hover {
    color: var(--color-green-bright);
}

.promotion-detail-content table {
    width: 100%;
    border-collapse: collapse;
}

.promotion-detail-content hr {
    height: 1px;
    border: 0;
    margin: 22px 0;
    background: linear-gradient(90deg, transparent, rgba(var(--color-green-light-rgb), 0.5), transparent);
}

.promotion-detail-content blockquote {
    margin: 18px 0;
    padding: 12px 16px;
    border-left: 3px solid var(--color-green-light);
    border-radius: 0 10px 10px 0;
    background: rgba(var(--color-green-primary-rgb), 0.1);
    color: rgba(220, 244, 232, 0.9);
}

.promotion-detail-content strong,
.promotion-detail-content b {
    color: #ffffff;
}

.promotion-detail-shell {
    position: relative;
}

.promotion-detail-card {
    position: relative;
    z-index: 1;
}

.promotion-detail-lead {
    box-shadow: -1px 0 14px rgba(var(--color-green-light-rgb), 0.25);
}

@media (min-width: 992px) {
    .promotion-detail-shell::before,
    .promotion-detail-shell::after {
        content: "";
        position: absolute;
        width: 320px;
        height: 320px;
        border-radius: 50%;
        pointer-events: none;
        z-index: 0;
        filter: blur(72px);
        will-change: transform;
    }

    .promotion-detail-shell::before {
        top: -70px;
        left: -90px;
        background: radial-gradient(circle, rgba(var(--color-green-primary-rgb), 0.55), transparent 70%);
        animation: cbPromoOrbA 9s ease-in-out infinite alternate;
    }

    .promotion-detail-shell::after {
        bottom: 30px;
        right: -80px;
        background: radial-gradient(circle, rgba(var(--color-green-light-rgb), 0.3), transparent 70%);
        animation: cbPromoOrbB 12s ease-in-out infinite alternate;
    }

    .promotion-detail-card::before {
        background: linear-gradient(90deg,
            transparent,
            rgba(var(--color-green-light-rgb), 0.35) 30%,
            rgba(var(--color-green-bright-rgb), 0.95) 50%,
            rgba(var(--color-green-light-rgb), 0.35) 70%,
            transparent) !important;
        background-size: 220% 100% !important;
        animation: cbPromoLineFlow 4.5s linear infinite !important;
    }

    .promotion-detail-image {
        position: relative;
    }

    .promotion-detail-image::after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 60%;
        height: 100%;
        pointer-events: none;
        z-index: 2;
        background: linear-gradient(105deg, transparent 30%, rgba(255, 255, 255, 0.16) 48%, rgba(255, 255, 255, 0.28) 50%, rgba(255, 255, 255, 0.16) 52%, transparent 70%);
        transform: translateX(-160%) skewX(-12deg);
        animation: cbPromoImgShine 6s ease-in-out infinite;
    }
}

@keyframes cbPromoOrbA {
    from { transform: translate(0, 0); }
    to   { transform: translate(46px, 34px); }
}

@keyframes cbPromoOrbB {
    from { transform: translate(0, 0); }
    to   { transform: translate(-34px, -44px); }
}

@keyframes cbPromoLineFlow {
    from { background-position: 120% 0; }
    to   { background-position: -120% 0; }
}

@keyframes cbPromoImgShine {
    0%, 62%   { transform: translateX(-160%) skewX(-12deg); opacity: 0; }
    70%       { opacity: 1; }
    92%, 100% { transform: translateX(260%) skewX(-12deg); opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
    .promotion-detail-shell::before,
    .promotion-detail-shell::after,
    .promotion-detail-card::before {
        animation: none !important;
    }
    .promotion-detail-image::after {
        display: none !important;
    }
}

@media (max-width: 767px) {
    .promotion-detail-shell {
        padding-bottom: 96px;
    }

    .promotion-detail-card {
        padding: 18px 14px 22px;
        border-radius: 14px;
    }

    .promotion-detail-card h1 {
        padding-right: 40px;
        font-size: 20px;
    }

    .promotion-detail-lead {
        font-size: 13px;
    }

    .promotion-detail-close {
        top: 10px;
        right: 10px;
        width: 32px;
        height: 32px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .promotion-detail-card {
        animation: none;
    }

    .promotion-detail-close:hover {
        transform: none;
    }
}

.ph6q__img__icon {
    display: none !important;
}

.ph6q__icon {
    display:none !important;
}

.ph6q__inner {
    position: relative !important;
    overflow: hidden !important;
}

.cb-ph6q-bg {
    position: absolute !important;
    inset: 0 !important;
    z-index: 0 !important;
    pointer-events: none !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 10%, #000 90%, transparent 100%) !important;
    mask-image: linear-gradient(90deg, transparent 0%, #000 10%, #000 90%, transparent 100%) !important;
}

.ph6q__left,
.ph6q__right {
    position: relative !important;
    z-index: 1 !important;
}

div.news-area div.news-box {
    background:
        radial-gradient(420px 180px at 50% -6%, rgba(var(--color-green-primary-rgb), 0.18), transparent 60%),
        linear-gradient(180deg, rgba(7, 26, 16, 0.98), rgba(3, 10, 6, 0.99)) !important;
    border: 1px solid rgba(var(--color-green-primary-rgb), 0.5) !important;
    border-radius: 14px !important;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
    overflow: hidden !important;
}

div.news-area div.news-box div.box-head {
    position: relative;
    padding: 12px 14px !important;
    background: rgba(4, 13, 8, 0.6) !important;
    border-bottom: 1px solid rgba(var(--color-green-primary-rgb), 0.35) !important;
}

div.news-area div.news-box div.box-head::after {
    content: "";
    position: absolute;
    left: 10%;
    right: 10%;
    bottom: -1px;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(var(--color-green-light-rgb), 0.55), transparent);
    pointer-events: none;
}

div.news-area div.news-box div.box-head img.chat-header-logo {
    height: 22px !important;
    width: auto !important;
    display: block;
}

div.news-area div.news-box div.box-head span.close-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 32px !important;
    height: 32px !important;
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-radius: 999px !important;
    cursor: pointer !important;
    transition: background 0.25s ease, border-color 0.25s ease, transform 0.2s ease !important;
}

div.news-area div.news-box div.box-head span.close-button:hover {
    background: rgba(var(--danger-rgb), 0.18) !important;
    border-color: rgba(var(--danger-rgb), 0.5) !important;
    transform: rotate(90deg) !important;
}

div.news-area div.news-box div.box-listing {
    padding: 10px 12px !important;
}

div.news-area div.news-box div.box-listing div.message-blocks div.time-block div.messages div.message {
    display: flex !important;
    align-items: flex-start !important;
    gap: 8px !important;
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
    border-radius: 10px !important;
    padding: 8px 10px !important;
    margin-bottom: 6px !important;
    transition: background 0.2s ease, border-color 0.2s ease !important;
}

div.news-area div.news-box div.box-listing div.message-blocks div.time-block div.messages div.message:hover {
    background: rgba(var(--color-green-primary-rgb), 0.1) !important;
    border-color: rgba(var(--color-green-primary-rgb), 0.3) !important;
}

div.news-area div.news-box div.box-listing div.message-blocks div.time-block div.messages div.message div.crown {
    flex: 0 0 auto !important;
    margin-top: 2px !important;
}

div.news-area div.news-box div.box-listing div.message-blocks div.time-block div.messages div.message div.crown img {
    width: 16px !important;
    height: 16px !important;
    object-fit: contain !important;
    display: block !important;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.4));
}

div.news-area div.news-box div.box-listing div.message-blocks div.time-block div.messages div.message div.text {
    min-width: 0 !important;
    color: rgba(255, 255, 255, 0.88) !important;
    font-size: 12.5px !important;
    line-height: 1.5 !important;
    word-break: break-word !important;
}

div.news-area div.news-box button.chat-user-button {
    display: inline !important;
    margin-right: 6px !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
    cursor: pointer !important;
    color: var(--color-green-light) !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 12.5px !important;
    transition: color 0.2s ease !important;
}

div.news-area div.news-box button.chat-user-button:hover {
    color: var(--color-green-bright) !important;
    text-decoration: underline !important;
}

div.news-area div.news-box div.box-bottom {
    padding: 10px 12px 12px !important;
    background: rgba(4, 13, 8, 0.6) !important;
    border-top: 1px solid rgba(var(--color-green-primary-rgb), 0.35) !important;
}

div.news-area div.news-box div.box-bottom form.message-form input.message {
    border-radius: 10px !important;
    padding: 10px 12px !important;
    font-size: 13px !important;
    color: #ffffff !important;
}

div.news-area div.news-box div.box-bottom form.message-form input.message:focus {
    border-color: rgba(var(--color-green-light-rgb), 0.6) !important;
    box-shadow: 0 0 0 3px rgba(var(--color-green-light-rgb), 0.14) !important;
}

div.news-area div.news-box div.box-bottom form.message-form div.message-info div.after span.limit,
div.news-area div.news-box div.box-bottom form.message-form div.message-info div.after span.current {
    color: rgba(255, 255, 255, 0.4) !important;
    font-size: 11px !important;
}

div.news-area div.news-box div.box-bottom form.message-form div.form-footer {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    margin-top: 8px !important;
}

div.news-area div.news-box div.box-bottom .chat-footer-tools {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
}

div.news-area div.news-box .chat-emoji-button,
div.news-area div.news-box .chat-rules-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    width: auto !important;
    min-width: 34px !important;
    height: 34px !important;
    padding: 0 8px !important;
    background: linear-gradient(180deg, rgba(var(--color-green-primary-rgb), 0.3), rgba(var(--color-green-primary-rgb), 0.1)) !important;
    border: 1px solid rgba(var(--color-green-light-rgb), 0.28) !important;
    border-radius: 9px !important;
    cursor: pointer !important;
    transition: background 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease !important;
}

div.news-area div.news-box .chat-emoji-button:hover,
div.news-area div.news-box .chat-rules-button:hover {
    border-color: rgba(var(--color-green-light-rgb), 0.6) !important;
    box-shadow: 0 0 12px rgba(var(--color-green-light-rgb), 0.18) !important;
}

div.news-area div.news-box div.box-bottom form.message-form div.form-footer > button {
    min-height: 34px !important;
    padding: 0 18px !important;
    background-image: linear-gradient(90deg, var(--color-green-hover) 0%, var(--color-green-primary) 100%) !important;
    color: #ffffff !important;
    border: 1px solid rgba(var(--color-green-light-rgb), 0.35) !important;
    border-radius: 9px !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 13px !important;
    cursor: pointer !important;
    transition: filter 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease !important;
}

div.news-area div.news-box div.box-bottom form.message-form div.form-footer > button:hover:not(:disabled) {
    filter: brightness(1.12) !important;
    box-shadow: 0 8px 18px rgba(var(--color-green-primary-rgb), 0.4) !important;
    opacity: 1 !important;
}

div.news-area div.news-box div.box-bottom form.message-form div.form-footer > button:disabled {
    opacity: 0.45 !important;
    cursor: not-allowed !important;
    box-shadow: none !important;
}

@media (prefers-reduced-motion: reduce) {
    div.news-area div.news-box div.box-head span.close-button:hover {
        transform: none !important;
    }
}

#responsive-menu.responsive-menu {
    --sbm-radius: 12px;
    --sbm-radius-in: 9px;
    --sbm-pill: linear-gradient(180deg, rgba(255, 255, 255, 0.065), rgba(255, 255, 255, 0.035));
    --sbm-pill-border: transparent;
    --sbm-hover: rgba(255, 255, 255, 0.06);
    --sbm-active-fill: linear-gradient(135deg, rgba(3, 112, 53, 0.95) 0%, rgba(2, 83, 40, 0.95) 100%);
    --sbm-text: rgba(255, 255, 255, 0.75);
    --sbm-text-strong: #ffffff;
    --sbm-hairline: rgba(255, 255, 255, 0.06);
}

#responsive-menu.responsive-menu,
#responsive-menu.responsive-menu .sidebar-wrapper,
#responsive-menu.responsive-menu .menu-body {
    background:
        radial-gradient(480px 220px at 50% 0%, rgba(var(--color-green-primary-rgb), 0.12), transparent 60%),
        linear-gradient(180deg, #03110a 0%, #010502 100%) !important;
}

#responsive-menu.responsive-menu .menu-head {
    padding: 12px 14px !important;
    border-bottom: 1px solid var(--sbm-hairline) !important;
}

#responsive-menu .menu-head .title .text {
    color: var(--sbm-text-strong) !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 14px !important;
    letter-spacing: 0.04em !important;
}

#responsive-menu .menu-head .buttons .current-lang,
#responsive-menu .menu-head .buttons .news-button,
#responsive-menu .menu-head .buttons .chat-button,
#responsive-menu .menu-head .buttons .call-button,
#responsive-menu .menu-head .buttons .menu-close,
#responsive-menu .menu-head .buttons .toggle-theme {
    background: rgba(255, 255, 255, 0.045) !important;
    border: 1px solid rgba(255, 255, 255, 0.09) !important;
    border-radius: 10px !important;
    box-shadow: none !important;
    transition: background 0.22s ease, border-color 0.22s ease, transform 0.18s ease !important;
}

#responsive-menu .menu-head .buttons .current-lang:hover,
#responsive-menu .menu-head .buttons .news-button:hover,
#responsive-menu .menu-head .buttons .chat-button:hover,
#responsive-menu .menu-head .buttons .call-button:hover,
#responsive-menu .menu-head .buttons .menu-close:hover,
#responsive-menu .menu-head .buttons .toggle-theme:hover {
    background: rgba(var(--color-green-primary-rgb), 0.24) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.5) !important;
    transform: translateY(-1px) !important;
}

#responsive-menu.responsive-menu .menu-head .head-tabs .head-tab-btn {
    border-radius: 10px !important;
}

.cb-promo {
    position: relative;
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    margin: 6px 10px 10px;
    padding: 14px 10px 14px 14px;
    min-height: 118px;
    border-radius: 14px;
    overflow: hidden;
    text-decoration: none !important;
    background:
        radial-gradient(240px 150px at 88% 18%, rgba(var(--color-green-light-rgb), 0.28), transparent 62%),
        radial-gradient(180px 120px at 10% 110%, rgba(var(--color-green-light-rgb), 0.12), transparent 60%),
        linear-gradient(135deg, #0b4423 0%, #052613 55%, #031409 100%);
    border: 1px solid var(--color-green-hover);
    box-shadow: 0 14px 34px rgba(0, 0, 0, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.08);
    transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.2s ease;
}

.cb-promo:hover {
    border-color: rgba(var(--color-green-bright-rgb), 0.6);
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.48), 0 0 24px rgba(var(--color-green-primary-rgb), 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    transform: translateY(-1px);
}

.cb-promo__info {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    min-width: 0;
}

.cb-promo__chip {
    padding: 3px 9px;
    background: rgba(1, 13, 8, 0.6);
    border: 1px solid rgba(var(--color-green-bright-rgb), 0.5);
    border-radius: 7px;
    color: var(--color-green-bright);
    font-family: var(--font-family-bold), sans-serif;
    font-size: 9px;
    letter-spacing: 0.12em;
}

.cb-promo__title {
    color: #ffffff;
    font-family: var(--font-family-bold), sans-serif;
    font-size: 17px;
    font-weight: 900;
    line-height: 1.12;
    letter-spacing: 0.01em;
    text-shadow: 0 4px 14px rgba(0, 0, 0, 0.45);
}

.cb-promo__sub {
    color: rgba(255, 255, 255, 0.55);
    font-size: 10px;
    line-height: 1.3;
}

.cb-promo__btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-top: 2px;
    padding: 6px 14px;
    background: linear-gradient(180deg, var(--color-green-hover), var(--color-green-primary));
    border: 1px solid rgba(var(--color-green-light-rgb), 0.45);
    border-radius: 8px;
    color: #ffffff;
    font-family: var(--font-family-semibold), sans-serif;
    font-size: 11.5px;
    box-shadow: 0 6px 16px rgba(var(--color-green-primary-rgb), 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.12);
    transition: filter 0.2s ease;
}

.cb-promo:hover .cb-promo__btn { filter: brightness(1.15); }

.cb-promo__img {
    width: 96px;
    height: 96px;
    flex-shrink: 0;
    object-fit: contain;
    filter: drop-shadow(0 10px 20px rgba(0, 0, 0, 0.5));
}

#responsive-menu .menu-head .buttons .languages-box .other-langs {
    background: rgba(5, 14, 9, 0.98) !important;
    border: 1px solid rgba(var(--color-green-primary-rgb), 0.45) !important;
    border-radius: 14px !important;
    padding: 10px !important;
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.55) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    backdrop-filter: blur(10px) !important;
}

#responsive-menu .menu-head .buttons .languages-box .other-langs .lang {
    background: transparent !important;
    border: 1px solid transparent !important;
    border-radius: 9px !important;
    padding: 8px !important;
    cursor: pointer;
    transition: background 0.18s ease, border-color 0.18s ease;
}

#responsive-menu .menu-head .buttons .languages-box .other-langs .lang:hover {
    background: rgba(var(--color-green-primary-rgb), 0.2) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.35) !important;
}

#responsive-menu .menu-head .buttons .languages-box .other-langs .lang .text {
    font-size: 11px !important;
    color: rgba(255, 255, 255, 0.85) !important;
}

#responsive-menu .sidebar-lang-options {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    background: rgba(5, 14, 9, 0.98) !important;
    border: 1px solid rgba(var(--color-green-primary-rgb), 0.45) !important;
    border-radius: 14px !important;
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.6) !important;
}

#responsive-menu .sidebar-lang-options .lang-opt {
    background: transparent !important;
    border: 1px solid transparent !important;
    border-radius: 9px !important;
    transition: background 0.18s ease, border-color 0.18s ease;
}

#responsive-menu .sidebar-lang-options .lang-opt:hover {
    background: rgba(var(--color-green-primary-rgb), 0.2) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.35) !important;
}

#responsive-menu .sidebar-lang-options .lang-opt.is-active {
    background: rgba(var(--color-green-primary-rgb), 0.3) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.55) !important;
    color: #ffffff !important;
}

#responsive-menu .sidebar-lang-options::-webkit-scrollbar-thumb {
    background: rgba(var(--color-green-light-rgb), 0.35) !important;
    border-radius: 999px !important;
}

#responsive-menu .sidebar-lang-footer {
    margin: 8px 10px 14px !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
}

#responsive-menu .sidebar-lang-trigger {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    width: 100% !important;
    height: 46px !important;
    margin: 0 !important;
    padding: 0 14px !important;
    background: var(--sbm-pill) !important;
    border: none !important;
    border-radius: var(--sbm-radius) !important;
    cursor: pointer !important;
    transition: background 0.2s ease !important;
}

#responsive-menu .sidebar-lang-trigger:hover {
    background: rgba(var(--color-green-primary-rgb), 0.16) !important;
}

#responsive-menu .sidebar-lang-trigger .flag {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 22px !important;
    height: 22px !important;
    flex-shrink: 0 !important;
    border-radius: 50% !important;
    overflow: hidden !important;
}

#responsive-menu .sidebar-lang-trigger .flag img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

#responsive-menu .sidebar-lang-trigger .label {
    flex: 1 !important;
    text-align: left !important;
    color: #ffffff !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 14px !important;
}

#responsive-menu .sidebar-lang-trigger .caret {
    color: rgba(var(--color-green-light-rgb), 0.75) !important;
}

#responsive-menu .sidebar-lang-options .lang-opt .flag img {
    border-radius: 4px !important;
}

#responsive-menu .to-search-modal {
    margin: 8px 10px !important;
    background: var(--sbm-pill) !important;
    border: 1px solid var(--sbm-pill-border) !important;
    border-radius: var(--sbm-radius) !important;
    box-shadow: none !important;
    transition: background 0.22s ease, border-color 0.22s ease !important;
}

#responsive-menu .to-search-modal:hover {
    background: rgba(var(--color-green-primary-rgb), 0.14) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.4) !important;
}

#responsive-menu .to-search-modal .text {
    color: rgba(255, 255, 255, 0.45) !important;
}

#responsive-menu .p2tabs { gap: 8px !important; }

#responsive-menu.responsive-menu.active-menu .sb-top {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 4px 10px;
}

#responsive-menu.responsive-menu.active-menu .sb-top-btn {
    position: relative;
    height: 46px !important;
    min-height: 46px !important;
    padding: 0 14px !important;
    background: var(--sbm-pill) !important;
    border: 1px solid var(--sbm-pill-border) !important;
    border-radius: var(--sbm-radius) !important;
    box-shadow: none !important;
    transition: background 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

#responsive-menu.responsive-menu.active-menu .sb-top-btn:not(.active):hover {
    background: rgba(255, 255, 255, 0.07) !important;
    border-color: transparent !important;
}

#responsive-menu.responsive-menu.active-menu .sb-top-btn.active {
    background: var(--sbm-active-fill) !important;
    border-color: transparent !important;
    box-shadow: 0 8px 22px rgba(var(--color-green-primary-rgb), 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
}

#responsive-menu .sb-top-btn .sb-top-title {
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 14px !important;
    color: var(--sbm-text) !important;
    letter-spacing: 0.01em !important;
    transition: color 0.2s ease;
}

#responsive-menu .sb-top-btn:hover .sb-top-title,
#responsive-menu .sb-top-btn.active .sb-top-title {
    color: var(--sbm-text-strong) !important;
}

#responsive-menu .sb-top-arrow {
    opacity: 0;
    color: rgba(255, 255, 255, 0.85) !important;
    transition: opacity 0.2s ease, transform 0.2s ease;
}

#responsive-menu .sb-top-btn:hover .sb-top-arrow,
#responsive-menu .sb-top-btn.active .sb-top-arrow {
    opacity: 1;
    transform: translateX(2px);
}

#responsive-menu .sidebar-section-title,
.sidebar-section-title {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    width: auto !important;
    margin: 16px 14px 6px !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    color: rgba(255, 255, 255, 0.38) !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    letter-spacing: 0.16em !important;
    text-transform: uppercase !important;
}

#responsive-menu .sidebar-section-title__line,
.sidebar-section-title__line {
    flex: 1 !important;
    height: 1px !important;
    margin: 0 !important;
    background: var(--sbm-hairline) !important;
}

#responsive-menu .sl-acc__section {
    margin: 6px 10px !important;
    padding: 4px !important;
    background: var(--sbm-pill) !important;
    border: 1px solid var(--sbm-pill-border) !important;
    border-radius: var(--sbm-radius) !important;
    box-shadow: none !important;
    overflow: hidden !important;
    transition: border-color 0.25s ease !important;
}

#responsive-menu .sl-acc__section:hover {
    border-color: transparent !important;
}

#responsive-menu .sl-acc__head {
    padding: 10px 12px !important;
    border-radius: var(--sbm-radius-in) !important;
    transition: background 0.2s ease !important;
}

#responsive-menu .sl-acc__head:hover {
    background: rgba(255, 255, 255, 0.05) !important;
}

#responsive-menu .sl-acc__section.is-open {
    box-shadow: 0 10px 26px rgba(var(--color-green-primary-rgb), 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

#responsive-menu .sl-acc__section.is-open .sl-acc__head,
#responsive-menu .sl-acc__section.is-open .sl-acc__head:hover {
    background: transparent !important;
    box-shadow: none !important;
}

#responsive-menu .sl-acc__section.is-open .sl-acc__itemInner {
    color: rgba(255, 255, 255, 0.82) !important;
}

#responsive-menu .sl-acc__section.is-open .sl-acc__item:hover .sl-acc__itemInner {
    background: rgba(255, 255, 255, 0.12) !important;
    color: #ffffff !important;
}

#responsive-menu .sl-acc__section.is-open .sl-acc__item.active .sl-acc__itemInner {
    background: rgba(255, 255, 255, 0.16) !important;
    color: var(--color-green-bright) !important;
}

#responsive-menu .sl-acc__section.is-open .sl-acc__itemIcon img {
    opacity: 0.85 !important;
}

#responsive-menu .sl-acc__section.is-open .sl-acc__itemIcon svg {
    color: rgba(255, 255, 255, 0.85) !important;
}

#responsive-menu .sl-acc__headTitle,
.p2label {
    color: var(--sbm-text-strong) !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 14px !important;
}

#responsive-menu .sl-acc__itemInner,
#responsive-menu .menu a,
#responsive-menu .submenu a,
.sidebar-menu a {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 9px 10px 9px 14px !important;
    border: none !important;
    border-radius: var(--sbm-radius-in) !important;
    background: transparent !important;
    color: var(--sbm-text) !important;
    text-decoration: none !important;
    overflow: hidden !important;
    transition: background 0.2s ease, color 0.2s ease !important;
}

#responsive-menu .sl-acc__item:hover .sl-acc__itemInner,
#responsive-menu .menu a:hover,
#responsive-menu .submenu a:hover,
.sidebar-menu a:hover {
    background: var(--sbm-hover) !important;
    color: var(--sbm-text-strong) !important;
    transform: none !important;
}

#responsive-menu .sl-acc__item.active .sl-acc__itemInner,
#responsive-menu .menu a.active,
#responsive-menu .submenu a.active,
.sidebar-menu a.active {
    background: rgba(var(--color-green-primary-rgb), 0.14) !important;
    color: var(--color-green-bright) !important;
}

#responsive-menu .sl-acc__itemText {
    flex: 1 !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 13.5px !important;
    color: inherit !important;
}

#responsive-menu .sl-acc__itemIcon,
#responsive-menu .sl-acc__headIcon,
#responsive-menu .menu a .icon,
.sidebar-menu a .icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 22px !important;
    height: 22px !important;
    flex-shrink: 0 !important;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
}

#responsive-menu .sl-acc__itemIcon img,
#responsive-menu .sl-acc__headIcon img,
#responsive-menu .menu a .icon img,
.sidebar-menu a .icon img {
    width: 18px !important;
    height: 18px !important;
    filter: brightness(0) invert(1) !important;
    opacity: 0.6 !important;
    transition: opacity 0.2s ease, filter 0.2s ease !important;
}

#responsive-menu .sl-acc__section.is-open .sl-acc__headIcon img {
    opacity: 1 !important;
}

#responsive-menu .sl-acc__item:hover .sl-acc__itemIcon img,
#responsive-menu .menu a:hover .icon img,
.sidebar-menu a:hover .icon img {
    opacity: 0.95 !important;
}

#responsive-menu .sl-acc__item.active .sl-acc__itemIcon img,
#responsive-menu .menu a.active .icon img,
.sidebar-menu a.active .icon img {
    opacity: 1 !important;
    filter: brightness(0) invert(1) drop-shadow(0 0 6px rgba(var(--color-green-light-rgb), 0.9)) !important;
}

#responsive-menu .sl-acc__itemIcon svg,
#responsive-menu .sl-acc__headIcon svg {
    color: rgba(255, 255, 255, 0.6) !important;
    transition: color 0.2s ease !important;
}

#responsive-menu .sl-acc__section.is-open .sl-acc__headIcon svg,
#responsive-menu .sl-acc__item:hover .sl-acc__itemIcon svg {
    color: #ffffff !important;
}

#responsive-menu .sl-acc__item.active .sl-acc__itemIcon svg {
    color: var(--color-green-bright) !important;
}

#responsive-menu .sl-acc__itemBadge,
#responsive-menu .menu a .badge,
.sidebar-menu a .badge {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 20px !important;
    height: 18px !important;
    padding: 0 7px !important;
    background: rgba(255, 255, 255, 0.07) !important;
    border: none !important;
    border-radius: 999px !important;
    color: rgba(255, 255, 255, 0.6) !important;
    font-size: 10.5px !important;
    font-weight: 700 !important;
    flex-shrink: 0 !important;
}

#responsive-menu .sl-acc__item.active .sl-acc__itemBadge {
    background: rgba(var(--color-green-light-rgb), 0.2) !important;
    color: var(--color-green-bright) !important;
}

#responsive-menu .badge-new,
.sidebar-menu .badge-new {
    background: linear-gradient(135deg, var(--color-green-light), var(--color-green-primary)) !important;
    color: #ffffff !important;
    font-size: 9px !important;
    text-transform: uppercase !important;
}

#responsive-menu .badge-hot,
.sidebar-menu .badge-hot {
    background: linear-gradient(135deg, var(--danger), #ff1a40) !important;
    color: #ffffff !important;
    font-size: 9px !important;
    text-transform: uppercase !important;
}

#responsive-menu .sl-acc__chev,
#responsive-menu .sl-acc__itemRight svg {
    color: rgba(255, 255, 255, 0.3) !important;
    transition: color 0.2s ease, transform 0.25s ease !important;
}

#responsive-menu .sl-acc__section.is-open > .sl-acc__head .sl-acc__chev {
    color: #ffffff !important;
}

#responsive-menu .sl-acc__item:hover .sl-acc__chev,
#responsive-menu .sl-acc__item:hover .sl-acc__itemRight svg {
    color: var(--color-green-light) !important;
}

@media (min-width: 992px) {
    .responsive-menu.active-menu .menu-head .text,
    .responsive-menu.active-menu .sb-top-title,
    .responsive-menu.active-menu .sl-acc__headTitle,
    .responsive-menu.active-menu .languages-box .current-lang {
        color: #ffffff !important;
    }
}

.cb-sbfooter {
    margin: 12px 10px 8px;
    padding: 14px;
    border-radius: 14px;
    background: var(--sbm-pill, linear-gradient(180deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.03)));
    border: none;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.cb-sbfooter__socials {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.cb-sbfooter__socials a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.04);
    border: none;
    color: rgba(255, 255, 255, 0.6);
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.18s ease;
}

.cb-sbfooter__socials a:hover {
    background: rgba(var(--color-green-primary-rgb), 0.24);
    border-color: rgba(var(--color-green-light-rgb), 0.5);
    color: var(--color-green-bright) !important;
    transform: translateY(-2px);
}

.cb-sbfooter__socials svg {
    width: 17px;
    height: 17px;
}

.cb-sbfooter__divider {
    height: 1px;
    margin: 12px 6px;
    background: rgba(255, 255, 255, 0.07);
}

.cb-sbfooter__support {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 6px 4px 2px;
    background: none;
    border: none;
    cursor: pointer;
}

.cb-sbfooter__support-label {
    color: #ffffff;
    font-family: var(--font-family-semibold), sans-serif;
    font-size: 14px;
    transition: color 0.2s ease;
}

.cb-sbfooter__support:hover .cb-sbfooter__support-label {
    color: var(--color-green-bright);
}

.cb-sbfooter__badge {
    padding: 3px 12px;
    background: linear-gradient(135deg, var(--color-green-light), var(--color-green-primary));
    border-radius: 999px;
    color: #ffffff;
    font-family: var(--font-family-bold), sans-serif;
    font-size: 11px;
    box-shadow: 0 4px 12px rgba(var(--color-green-primary-rgb), 0.4);
}

#responsive-menu .bonus-request-btn,
#responsive-menu .sb-bonus-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    margin: 10px !important;
    padding: 12px 16px !important;
    background: linear-gradient(135deg, var(--color-green-hover), var(--color-green-deep)) !important;
    border: 1px solid rgba(var(--color-green-light-rgb), 0.35) !important;
    border-radius: var(--sbm-radius) !important;
    color: #ffffff !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 13.5px !important;
    cursor: pointer !important;
    box-shadow: 0 8px 22px rgba(var(--color-green-primary-rgb), 0.3) !important;
    transition: filter 0.2s ease, box-shadow 0.2s ease !important;
}

#responsive-menu .bonus-request-btn:hover,
#responsive-menu .sb-bonus-btn:hover {
    filter: brightness(1.12) !important;
    box-shadow: 0 10px 28px rgba(var(--color-green-primary-rgb), 0.42) !important;
}

#responsive-menu::-webkit-scrollbar,
#responsive-menu .menu-body::-webkit-scrollbar,
#responsive-menu .sidebar-content::-webkit-scrollbar {
    width: 4px !important;
}

#responsive-menu::-webkit-scrollbar-track,
#responsive-menu .menu-body::-webkit-scrollbar-track {
    background: transparent !important;
}

#responsive-menu::-webkit-scrollbar-thumb,
#responsive-menu .menu-body::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.12) !important;
    border-radius: 999px !important;
}

#responsive-menu::-webkit-scrollbar-thumb:hover,
#responsive-menu .menu-body::-webkit-scrollbar-thumb:hover {
    background: rgba(var(--color-green-light-rgb), 0.45) !important;
}

#responsive-menu.responsive-menu:not(.active-menu) {
    border-right: 1px solid var(--sbm-hairline) !important;
    box-shadow: 12px 0 34px rgba(0, 0, 0, 0.35) !important;
}

#responsive-menu.responsive-menu:not(.active-menu) .cb-promo,
#responsive-menu.responsive-menu:not(.active-menu) .cb-sbfooter {
    display: none !important;
}

#responsive-menu.responsive-menu:not(.active-menu) .sb-top-btn {
    background: var(--sbm-pill) !important;
    border: 1px solid var(--sbm-pill-border) !important;
    border-radius: var(--sbm-radius) !important;
}

#responsive-menu.responsive-menu:not(.active-menu) .sb-top-btn:hover {
    background: rgba(255, 255, 255, 0.07) !important;
}

#responsive-menu.responsive-menu:not(.active-menu) .sb-top-btn.active {
    background: var(--sbm-active-fill) !important;
    border-color: transparent !important;
}

#responsive-menu.responsive-menu:not(.active-menu) .sidebar-section-title {
    margin: 12px 10px 4px !important;
    font-size: 0 !important;
}

@media (max-width: 991px) {
    #responsive-menu.responsive-menu.active-menu {
        border-right: 1px solid rgba(var(--color-green-primary-rgb), 0.4) !important;
        box-shadow: 24px 0 60px rgba(0, 0, 0, 0.55) !important;
    }

    #responsive-menu.responsive-menu.active-menu .menu-body {
        padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px)) !important;
    }

    #responsive-menu .sidebar-lang-options {
        max-height: min(52dvh, 100dvh - 180px) !important;
    }

    .cb-promo { min-height: 108px; }
    .cb-promo__img { width: 84px; height: 84px; }
    .cb-promo__title { font-size: 16px; }
}

@keyframes cbSbItemIn {
    from { opacity: 0; transform: translateX(-12px); }
    to   { opacity: 1; transform: translateX(0); }
}

#responsive-menu.cb-sb.cb-anim.active-menu .cb-promo,
#responsive-menu.cb-sb.cb-anim.active-menu .sb-top-btn,
#responsive-menu.cb-sb.cb-anim.active-menu .p2seg,
#responsive-menu.cb-sb.cb-anim.active-menu .to-search-modal,
#responsive-menu.cb-sb.cb-anim.active-menu .sidebar-section-title,
#responsive-menu.cb-sb.cb-anim.active-menu .sl-acc__section,
#responsive-menu.cb-sb.cb-anim.active-menu .sidebar-lang-trigger,
#responsive-menu.cb-sb.cb-anim.active-menu .cb-sbfooter {
    animation: cbSbItemIn 0.34s cubic-bezier(0.2, 0.9, 0.2, 1) both;
    animation-delay: calc(var(--cb-i, 0) * 22ms);
}
.sidebar-section-title:nth-child(2) {
    animation: none !important;
}
.cb-ripple {
    position: absolute;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(var(--color-green-light-rgb), 0.3) 0%, rgba(var(--color-green-light-rgb), 0) 70%);
    transform: scale(0);
    animation: cbRipple 0.6s ease-out forwards;
    pointer-events: none;
    z-index: 1;
}

@keyframes cbRipple {
    to { transform: scale(1); opacity: 0; }
}

#responsive-menu.cb-sb .sb-top-btn,
#responsive-menu.cb-sb .p2seg,
#responsive-menu.cb-sb .to-search-modal,
#responsive-menu.cb-sb .sidebar-lang-trigger,
#responsive-menu.cb-sb .sl-acc__head,
#responsive-menu.cb-sb .menu a,
#responsive-menu.cb-sb .submenu a {
    position: relative !important;
    overflow: hidden !important;
}

@media (prefers-reduced-motion: reduce) {
    #responsive-menu.cb-sb.cb-anim.active-menu .cb-promo,
    #responsive-menu.cb-sb.cb-anim.active-menu .sb-top-btn,
    #responsive-menu.cb-sb.cb-anim.active-menu .p2seg,
    #responsive-menu.cb-sb.cb-anim.active-menu .to-search-modal,
    #responsive-menu.cb-sb.cb-anim.active-menu .sidebar-section-title,
    #responsive-menu.cb-sb.cb-anim.active-menu .sl-acc__section,
    #responsive-menu.cb-sb.cb-anim.active-menu .sidebar-lang-trigger,
    #responsive-menu.cb-sb.cb-anim.active-menu .cb-sbfooter {
        animation: none !important;
    }

    .cb-ripple { display: none !important; }

    #responsive-menu .sl-acc__itemInner,
    #responsive-menu .menu a,
    #responsive-menu .sb-top-btn,
    #responsive-menu .to-search-modal,
    .cb-promo,
    .cb-sbfooter__socials a {
        transition: none !important;
        transform: none !important;
    }
}

@media (min-width: 992px) {
    #responsive-menu.responsive-menu:not(.active-menu) {
        background: none !important;
    }
        .search-menu#search-menu {
            display: none !important;
        }
}

.wallet-normal.vault-modal .wallet-header .title {
    color: #ffffff !important;
    font-family: var(--font-family-semibold), sans-serif !important;
}

.wallet-normal.vault-modal .wallet-header .go-back,
.wallet-normal.vault-modal .close-modal button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 36px !important;
    height: 36px !important;
    background: rgba(255, 255, 255, 0.05) !important;
    border: none !important;
    border-radius: 999px !important;
    color: rgba(255, 255, 255, 0.75) !important;
    cursor: pointer !important;
    transition: background 0.2s ease, color 0.2s ease !important;
}

.wallet-normal.vault-modal .wallet-header .go-back:hover {
    background: rgba(var(--color-green-primary-rgb), 0.25) !important;
    color: #ffffff !important;
}

.wallet-normal.vault-modal .close-modal button:hover {
    background: rgba(var(--danger-rgb), 0.18) !important;
    color: #ff7a8a !important;
}

.wallet-normal.vault-modal .balance-box.vault-overview .box-header .title {
    color: rgba(255, 255, 255, 0.5) !important;
    font-size: 12px !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
}

.wallet-normal.vault-modal .balance-box.vault-overview .box-balance {
    color: #ffffff !important;
}

.wallet-normal.vault-modal .wallet-buttons.vault-actions {
    background: rgba(255, 255, 255, 0.045) !important;
    border: none !important;
    border-radius: 12px !important;
    padding: 4px !important;
}

.wallet-normal.vault-modal .wallet-buttons.vault-actions span.button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 44px !important;
    background: transparent !important;
    background-image: none !important;
    border: none !important;
    border-radius: 9px !important;
    color: rgba(255, 255, 255, 0.6) !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 14px !important;
    cursor: pointer !important;
    box-shadow: none !important;
    transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease !important;
}

.wallet-normal.vault-modal .wallet-buttons.vault-actions span.button:hover {
    background: rgba(255, 255, 255, 0.05) !important;
    color: #ffffff !important;
}

.wallet-normal.vault-modal .wallet-buttons.vault-actions span.button.active {
    background: linear-gradient(135deg, var(--color-green-hover) 0%, var(--color-green-primary) 100%) !important;
    background-image: linear-gradient(135deg, var(--color-green-hover) 0%, var(--color-green-primary) 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 6px 18px rgba(var(--color-green-primary-rgb), 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
}

.wallet-normal.vault-modal .coin-selecter .current-coin {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.025)) !important;
    border: none !important;
    border-radius: 12px !important;
    transition: background 0.2s ease !important;
}

.wallet-normal.vault-modal .coin-selecter .current-coin:hover {
    background: rgba(var(--color-green-primary-rgb), 0.14) !important;
}

.wallet-normal.vault-modal .coin-selecter .current-coin .details .code {
    color: #ffffff !important;
    font-family: var(--font-family-semibold), sans-serif !important;
}

.wallet-normal.vault-modal .coin-selecter .current-coin .details .name,
.wallet-normal.vault-modal .coin-selecter .current-coin .balance .fiat {
    color: rgba(255, 255, 255, 0.45) !important;
}

.wallet-normal.vault-modal .coin-selecter .current-coin .balance .amount {
    color: #ffffff !important;
    font-family: var(--font-family-semibold), sans-serif !important;
}

.vault-modal__balances .vault-balanceCard {
    background: rgba(255, 255, 255, 0.035) !important;
    border: none !important;
    border-radius: 12px !important;
    padding: 14px !important;
}

.vault-modal__balances .vault-balanceCard--accent {
    background:
        radial-gradient(140px 80px at 85% 15%, rgba(var(--color-green-light-rgb), 0.14), transparent 60%),
        linear-gradient(135deg, rgba(var(--color-green-primary-rgb), 0.3), rgba(var(--color-green-primary-rgb), 0.1)) !important;
}

.vault-balanceCard__label {
    color: rgba(255, 255, 255, 0.45) !important;
    font-size: 10.5px !important;
    font-weight: 700 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
}

.vault-balanceCard__value {
    color: #ffffff !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 16px !important;
}

.vault-balanceCard--accent .vault-balanceCard__value span[role="presentation"] {
    color: var(--color-green-light) !important;
}

.vault-modal__label {
    color: #ffffff !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 14px !important;
}

.vault-modal__max {
    background: rgba(var(--color-green-primary-rgb), 0.2) !important;
    border: none !important;
    border-radius: 7px !important;
    padding: 4px 12px !important;
    color: var(--color-green-light) !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 12px !important;
    cursor: pointer !important;
    transition: background 0.2s ease, color 0.2s ease !important;
}

.vault-modal__max:hover {
    background: rgba(var(--color-green-primary-rgb), 0.35) !important;
    color: var(--color-green-bright) !important;
}

.vault-modal__amountBox {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid transparent !important;
    border-radius: 12px !important;
    padding: 6px 14px !important;
    transition: background 0.2s ease, box-shadow 0.2s ease !important;
}

.vault-modal__amountBox:focus-within {
    background: rgba(var(--color-green-primary-rgb), 0.1) !important;
    box-shadow: 0 0 0 2px rgba(var(--color-green-light-rgb), 0.4) !important;
}

.vault-modal__amountBox input {
    flex: 1 !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-family: var(--font-family-semibold), sans-serif !important;
}

.vault-modal__amountBox input::placeholder {
    color: rgba(255, 255, 255, 0.35) !important;
}

.vault-modal__amountBox input:focus {
    border: none !important;
    box-shadow: none !important;
}

.vault-modal__amountCode {
    color: rgba(255, 255, 255, 0.5) !important;
    font-family: var(--font-family-bold), sans-serif !important;
    font-size: 12px !important;
    letter-spacing: 0.04em !important;
}

.vault-modal__note {
    background: rgba(var(--color-green-primary-rgb), 0.1) !important;
    border: none !important;
    border-left: 3px solid var(--color-green-light) !important;
    border-radius: 0 10px 10px 0 !important;
    padding: 10px 14px !important;
    color: rgba(220, 244, 232, 0.8) !important;
    font-size: 12.5px !important;
    line-height: 1.5 !important;
}

.wallet-normal.vault-modal .common-form-button .button {
    width: 100% !important;
    min-height: 48px !important;
    background: linear-gradient(135deg, var(--color-green-hover) 0%, var(--color-green-primary) 100%) !important;
    border: none !important;
    border-radius: 12px !important;
    color: #ffffff !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 15px !important;
    box-shadow: 0 8px 22px rgba(var(--color-green-primary-rgb), 0.35) !important;
    transition: filter 0.2s ease, box-shadow 0.2s ease !important;
}

.wallet-normal.vault-modal .common-form-button .button:hover:not(:disabled) {
    filter: brightness(1.12) !important;
    box-shadow: 0 10px 28px rgba(var(--color-green-primary-rgb), 0.45) !important;
}

.wallet-normal.vault-modal .common-form-button .button:disabled {
    background: rgba(255, 255, 255, 0.06) !important;
    color: rgba(255, 255, 255, 0.35) !important;
    box-shadow: none !important;
    cursor: not-allowed !important;
}

.cb-promo--banner {
    background-size: auto 140% !important;
    background-position: right center !important;
    background-repeat: no-repeat !important;
    min-height: 118px;
}

.cb-promo--banner .cb-promo__info {
    max-width: 72%;
    position: relative;
    z-index: 1;
}

.cb-promo--banner .cb-promo__img {
    display: none !important;
}

.cb-promo--banner {
    min-height: 112px !important;
    padding: 12px !important;
}

.cb-promo--banner .cb-promo__info {
    max-width: 62% !important;
    gap: 5px !important;
}

.cb-promo--banner .cb-promo__title {
    font-size: 16px !important;
}

.cb-promo--banner .cb-promo__sub {
    font-size: 10px !important;
    color: rgba(255, 255, 255, 0.7) !important;
    text-shadow: 0 1px 6px rgba(0, 0, 0, 0.85) !important;
}

.cb-promo--banner .cb-promo__btn {
    padding: 5px 12px !important;
    font-size: 11px !important;
}

#responsive-menu .p2tabs {
    margin: 6px 10px !important;
}

#responsive-menu .p2tabs .p2seg {
    min-height: 44px !important;
}

#responsive-menu .sidebar-section-title,
.sidebar-section-title {
    margin: 12px !important;
}

#responsive-menu .sidebar-section-title__line,
.sidebar-section-title__line {
    position: relative !important;
}

#responsive-menu .sidebar-section-title__line::after,
.sidebar-section-title__line::after {
    content: "" !important;
    position: absolute !important;
    top: 50% !important;
    left: 0;
    width: 38px !important;
    height: 5px !important;
    border-radius: 999px !important;
    background: radial-gradient(closest-side, rgba(52, 216, 122, 0.95), rgba(16, 180, 97, 0.35) 65%, transparent) !important;
    transform: translateY(-50%) !important;
    pointer-events: none !important;
}

#responsive-menu .sidebar-section-title ~ .sidebar-section-title,
.sidebar-section-title ~ .sidebar-section-title {
    display: none !important;
}

.cb-sbfooter {
    padding: 10px !important;
}

.cb-sbfooter__socials {
    gap: 14px !important;
}

.cb-sbfooter__socials a {
    flex: 0 0 auto !important;
    width: 44px !important;
    height: 44px !important;
    border-radius: 10px !important;
}

.cb-sbfooter__divider {
    margin: 10px 2px !important;
    background: rgba(255, 255, 255, 0.08) !important;
}

.cb-sbfooter__support {
    padding: 2px 6px 2px !important;
}

.auth-modal .auth-logo .logo {
    display: flex !important;
    justify-content: center !important;
    padding: 6px 0 2px !important;
}

.auth-modal .auth-logo .logo img {
    height: 38px !important;
    width: auto !important;
}

.auth-modal .close-modal button,
.modal-box .close-modal button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 36px !important;
    height: 36px !important;
    background: rgba(255, 255, 255, 0.05) !important;
    border: none !important;
    border-radius: 999px !important;
    color: rgba(255, 255, 255, 0.75) !important;
    cursor: pointer !important;
    transition: background 0.2s ease, color 0.2s ease !important;
}

.auth-modal .close-modal button:hover,
.modal-box .close-modal button:hover {
    background: rgba(var(--danger-rgb), 0.18) !important;
    color: #ff7a8a !important;
}

.auth-form .auth-type-toggle {
    display: flex !important;
    gap: 4px !important;
    background: rgba(255, 255, 255, 0.045) !important;
    border: none !important;
    border-radius: 12px !important;
    padding: 4px !important;
    margin-bottom: 14px !important;
}

.auth-form .auth-type-toggle button {
    flex: 1 1 0 !important;
    height: 40px !important;
    background: transparent !important;
    border: none !important;
    border-radius: 9px !important;
    color: rgba(255, 255, 255, 0.6) !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 13.5px !important;
    cursor: pointer !important;
    box-shadow: none !important;
    transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease !important;
}

.auth-form .auth-type-toggle button:hover {
    background: rgba(255, 255, 255, 0.05) !important;
    color: #ffffff !important;
}

.auth-form .auth-type-toggle button.active,
.auth-form .auth-type-toggle button[aria-pressed="true"] {
    background: linear-gradient(135deg, var(--color-green-hover) 0%, var(--color-green-primary) 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 6px 16px rgba(var(--color-green-primary-rgb), 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
}

.auth-form .form-item-select.d-flex {
    display: flex !important;
    gap: 8px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.auth-form .form-item-select.d-flex .col-4 {
    flex: 1 1 0 !important;
    max-width: none !important;
    width: auto !important;
    padding: 0 !important;
}

.auth-form .toggle-password {
    color: rgba(255, 255, 255, 0.45) !important;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    cursor: pointer !important;
    transition: color 0.2s ease !important;
}

.auth-form .toggle-password:hover {
    color: var(--color-green-light) !important;
}

.auth-phone-intl {
    display: flex !important;
    align-items: stretch !important;
    gap: 8px !important;
}

.react-international-phone-country-selector-button,
.auth-phone-intl-selector-btn {
    height: 100% !important;
    min-height: 44px !important;
    padding: 0 10px !important;
    background: var(--linearbg) !important;
    border: 1px solid var(--input-border) !important;
    border-radius: var(--radius-xs) !important;
    cursor: pointer !important;
    transition: border-color 0.2s ease, background 0.2s ease !important;
}

.react-international-phone-country-selector-button:hover,
.auth-phone-intl-selector-btn:hover {
    border-color: rgba(var(--color-green-light-rgb), 0.5) !important;
}

.react-international-phone-country-selector-button__dropdown-arrow {
    border-top-color: rgba(var(--color-green-light-rgb), 0.75) !important;
}

.react-international-phone-country-selector-dropdown {
    background: #060f0a !important;
    border: 1px solid rgba(var(--color-green-primary-rgb), 0.5) !important;
    border-radius: 12px !important;
    padding: 6px !important;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
    outline: none !important;
}

.react-international-phone-country-selector-dropdown__list-item {
    border-radius: 8px !important;
    padding: 8px 10px !important;
    transition: background 0.15s ease !important;
}

.react-international-phone-country-selector-dropdown__list-item:hover {
    background: rgba(var(--color-green-primary-rgb), 0.2) !important;
}

.react-international-phone-country-selector-dropdown__list-item--selected,
.react-international-phone-country-selector-dropdown__list-item--focused {
    background: rgba(var(--color-green-primary-rgb), 0.3) !important;
}

.react-international-phone-country-selector-dropdown__list-item-country-name {
    color: rgba(255, 255, 255, 0.88) !important;
    font-size: 13px !important;
}

.react-international-phone-country-selector-dropdown__list-item-dial-code {
    color: rgba(var(--color-green-light-rgb), 0.8) !important;
    font-size: 12px !important;
}

.react-international-phone-country-selector-dropdown__preferred-list-divider {
    border: none !important;
    height: 1px !important;
    margin: 6px 4px !important;
    background: rgba(255, 255, 255, 0.08) !important;
}

.react-international-phone-country-selector-dropdown::-webkit-scrollbar {
    width: 4px !important;
}

.react-international-phone-country-selector-dropdown::-webkit-scrollbar-thumb {
    background: rgba(var(--color-green-light-rgb), 0.35) !important;
    border-radius: 999px !important;
}

.react-international-phone-input-container .react-international-phone-input {
    flex: 1 !important;
    background: var(--linearbg) !important;
    border: 1px solid var(--input-border) !important;
    border-radius: var(--radius-xs) !important;
    color: #ffffff !important;
}

div.news-area {
    z-index: 1000 !important;
}

@media (min-width: 1200px) and (max-width: 1540px) {
    body.news-open {
        width: 100% !important;
    }
}

@media (min-width: 992px) {
    header#header div.middle-header div.middle-header-container div.logo,
    header#header div.middle-header div.middle-header-container div.responsive-logo {
        display: none !important;
    }
}

header#header div.middle-header div.middle-header-container div.categories {
    width: auto !important;
    flex: 1 1 0% !important;
    justify-content: flex-start !important;
    margin-left: 28px !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons {
    width: auto !important;
    flex: 0 0 auto !important;
}

#responsive-menu.responsive-menu .menu-head {
    display: flex !important;
    align-items: center !important;
}

.cb-sb-logo-row {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 18px 14px 14px !important;
    border-bottom: 1px solid var(--sbm-hairline, rgba(255, 255, 255, 0.06)) !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 6 !important;
    background: linear-gradient(180deg, #03110a 0%, #010502 100%) !important;
}

.cb-sb-logo-link {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    transition: opacity 0.2s ease !important;
}

.cb-sb-logo-link:hover {
    opacity: 0.85 !important;
}

.cb-sb-logo {
    height: 46px !important;
    width: auto !important;
    max-width: 100% !important;
    display: block !important;
}

#responsive-menu.responsive-menu:not(.active-menu) .cb-sb-logo-row {
    padding: 12px 6px 8px !important;
}

#responsive-menu.responsive-menu:not(.active-menu) .cb-sb-logo {
    height: 26px !important;
    max-width: 56px !important;
    object-fit: contain !important;
}

@media (max-width: 991px) {
    #responsive-menu.responsive-menu.active-menu {
        width: min(84vw, 340px) !important;
        max-width: min(84vw, 340px) !important;
    }
}

header#header div.middle-header div.middle-header-container div.categories a.category span.text {
    display: inline-block !important;
    white-space: nowrap !important;
}

header#header div.middle-header div.middle-header-container div.categories {
    gap: 8px !important;
}

header#header div.middle-header div.middle-header-container div.categories a.category {
    height: 40px !important;
    padding: 0 16px !important;
    border-radius: 999px !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    background: rgba(255, 255, 255, 0.03) !important;
    transition: background 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease, transform 0.2s ease !important;
}

header#header div.middle-header div.middle-header-container div.categories a.category span.icon {
    opacity: 0.75 !important;
    transition: opacity 0.25s ease !important;
}

header#header div.middle-header div.middle-header-container div.categories a.category span.text {
    color: rgba(255, 255, 255, 0.75) !important;
    font-size: 13px !important;
    letter-spacing: 0.01em !important;
}

header#header div.middle-header div.middle-header-container div.categories a.category:hover {
    background: rgba(255, 255, 255, 0.07) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.4) !important;
}

header#header div.middle-header div.middle-header-container div.categories a.category:hover span.icon {
    opacity: 1 !important;
}

header#header div.middle-header div.middle-header-container div.categories a.category:hover span.text {
    color: #ffffff !important;
}

header#header div.middle-header div.middle-header-container div.categories a.category.active {
    background: linear-gradient(135deg, var(--color-green-hover) 0%, var(--color-green-primary) 100%) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.55) !important;
    box-shadow: 0 6px 18px rgba(var(--color-green-primary-rgb), 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
}

header#header div.middle-header div.middle-header-container div.categories a.category.active span.icon {
    opacity: 1 !important;
}

header#header div.middle-header div.middle-header-container div.categories a.category.active span.text {
    color: #ffffff !important;
    font-weight: 700 !important;
}

@media screen and (min-width: 992px) and (max-width: 1199px) {
    header#header div.middle-header div.middle-header-container div.categories {
        margin-left: 12px !important;
        gap: 4px !important;
    }
    header#header div.middle-header div.middle-header-container div.categories a.category {
        height: 36px !important;
        padding: 0 10px !important;
    }
    header#header div.middle-header div.middle-header-container div.categories a.category span.text {
        font-size: 12px !important;
    }
    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons {
        gap: 6px !important;
    }

    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button {
        padding: 0 12px !important;
        font-size: 11.5px !important;
    }
}

header#header:before {
    background: none !important;
}

header#header div.middle-header,
header#header div.middle-header div.middle-header-container {
    background: none !important;
    background-image: none !important;
}

header#header {
    background:
        linear-gradient(90deg, #010502 0%, #010502 78px, rgba(var(--color-green-primary-rgb), 0.1) 260px, transparent 520px),
        radial-gradient(1100px 260px at 26% -70%, rgba(var(--color-green-primary-rgb), 0.16), transparent 62%),
        var(--color-bg-tinted) !important;
}

@media (max-width: 991px) {
    header#header {
        background:
            radial-gradient(1100px 260px at 26% -70%, rgba(var(--color-green-primary-rgb), 0.16), transparent 62%),
            var(--color-bg-tinted) !important;
    }
      header#header div.middle-header div.middle-header-container div.header-buttons {
                   flex: 1 auto !important;
    }
}

@media (min-width: 992px) {
    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons {
        padding: 6px !important;
        gap: 4px !important;
        border-radius: 16px !important;
    }

    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        box-sizing: border-box !important;
        height: 34px !important;
        width: 92px !important;
        min-width: 92px !important;
        max-width: 92px !important;
        padding: 0 !important;
        border-radius: 10px !important;
        font-size: 12px !important;
        flex: 0 0 92px !important;
    }

    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button:not(.register) {
        background: linear-gradient(180deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0.03) 100%) !important;
        border: 1px solid rgba(255, 255, 255, 0.12) !important;
        color: #ffffff !important;
        font-weight: 800 !important;
        letter-spacing: 0.02em !important;
        backdrop-filter: blur(10px) !important;
        -webkit-backdrop-filter: blur(10px) !important;
    }

    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button:not(.register):hover {
        background: linear-gradient(180deg, rgba(255, 255, 255, 0.13) 0%, rgba(255, 255, 255, 0.055) 100%) !important;
        border-color: rgba(var(--color-green-light-rgb), 0.55) !important;
        box-shadow: 0 6px 16px rgba(0, 0, 0, 0.3) !important;
    }

    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button.register {
        background: linear-gradient(160deg, var(--color-green-light) 0%, var(--color-green-hover) 48%, var(--color-green-primary) 100%) !important;
        border: 1px solid rgba(var(--color-green-bright-rgb), 0.55) !important;
        font-weight: 800 !important;
        letter-spacing: 0.02em !important;
        box-shadow: 0 8px 20px rgba(var(--color-green-primary-rgb), 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.18) !important;
        transition: filter 0.25s ease, box-shadow 0.25s ease, transform 0.2s ease !important;
    }

    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button.register:hover {
        filter: brightness(1.08) !important;
        box-shadow: 0 10px 26px rgba(var(--color-green-primary-rgb), 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.22) !important;
        transform: translateY(-1px) !important;
    }

    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button.register:active {
        transform: translateY(0) !important;
    }
}

@media (min-width: 992px) {
    header#header div.middle-header div.middle-header-container a.cb-header-logo {
        display: none;
        order: -1 !important;
        flex: 0 0 auto !important;
        width: 158px !important;
        height: 38px !important;
        margin-right: 18px !important;
        background: var(--header-footer-logo) left center / contain no-repeat !important;
        transition: filter 0.2s ease !important;
    }

    header#header div.middle-header div.middle-header-container a.cb-header-logo:hover {
        filter: brightness(1.15) !important;
    }

    body:has(#responsive-menu.responsive-menu:not(.active-menu)) header#header div.middle-header div.middle-header-container a.cb-header-logo {
        display: block !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button.register:hover {
        transform: none !important;
    }
}

.cb-sb-logo-row {
    height: 61px !important;
    padding: 0 16px !important;
}

.cb-sb-logo {
    height: 35px !important;
}

#responsive-menu.responsive-menu:not(.active-menu) .cb-sb-logo-row {
    display: none !important;
}

@media (min-width: 992px) {
    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons {
        background: none !important;
        padding: 0 !important;
        gap: 8px !important;
        overflow: visible !important;
        box-shadow: none !important;
    }

    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons::before,
    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons::after {
        display: none !important;
    }

    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button:not(.register):hover {
        background: linear-gradient(180deg, rgba(255, 255, 255, 0.13) 0%, rgba(255, 255, 255, 0.055) 100%) !important;
        color: #ffffff !important;
    }

    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button.register:hover {
        background: linear-gradient(160deg, var(--color-green-light) 0%, var(--color-green-hover) 48%, var(--color-green-primary) 100%) !important;
        color: #ffffff !important;
    }
}

#responsive-menu.responsive-menu.active-menu .sb-top-btn svg,
#responsive-menu.responsive-menu.active-menu .sb-top-btn img {
    width: 20px !important;
    height: 20px !important;
    max-width: 20px !important;
    max-height: 20px !important;
    flex-shrink: 0 !important;
    object-fit: contain !important;
}

#responsive-menu.responsive-menu.active-menu a.sb-top-btn.supportbtn {
    margin: 6px 10px !important;
    width: auto !important;
}

@media (min-width: 992px) {
    @keyframes cbRegisterGlow {
        0%, 100% {
            box-shadow: 0 8px 20px rgba(var(--color-green-primary-rgb), 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.18), 0 0 0 0 rgba(var(--color-green-bright-rgb), 0.5);
        }
        50% {
            box-shadow: 0 8px 20px rgba(var(--color-green-primary-rgb), 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.18), 0 0 9px 0 rgba(var(--color-green-bright-rgb), 0.4);
        }
    }

    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button.register {
        animation: cbRegisterGlow 2.4s ease-in-out infinite !important;
    }

    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button.register:hover {
        animation-play-state: paused !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button.register {
        animation: none !important;
    }
}

.game-item:hover {
    transform: none !important;
}

.game-item div.game-top div.game-opener {
    background: linear-gradient(160deg, rgba(2, 83, 40, 0.34) 0%, rgba(1, 42, 20, 0.5) 55%, rgba(1, 20, 9, 0.62) 100%) !important;
    backdrop-filter: blur(1.5px) !important;
    -webkit-backdrop-filter: blur(1.5px) !important;
}

@keyframes cbPlayPulseFinal {
    0%   { box-shadow: 0 0 0 0 rgba(var(--color-green-bright-rgb), 0.55); }
    70%  { box-shadow: 0 0 0 16px rgba(var(--color-green-bright-rgb), 0); }
    100% { box-shadow: 0 0 0 0 rgba(var(--color-green-bright-rgb), 0); }
}

.game-item div.game-top div.game-opener div.play-buttons span.button:not(.demo),
.game-item div.game-top div.game-opener div.play-buttons a.button:not(.demo) {
    position: relative !important;
    width: 56px !important;
    height: 56px !important;
    padding: 0 !important;
    min-width: 0 !important;
    border-radius: 50% !important;
    font-size: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: linear-gradient(180deg, var(--color-green-light) 0%, var(--color-green-primary) 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.25) !important;
    animation: cbPlayPulseFinal 1.8s ease-out infinite !important;
}

.game-item div.game-top div.game-opener div.play-buttons span.button:not(.demo)::before,
.game-item div.game-top div.game-opener div.play-buttons a.button:not(.demo)::before {
    content: "" !important;
    display: block !important;
    width: 0 !important;
    height: 0 !important;
    margin-left: 4px !important;
    border-top: 9px solid transparent !important;
    border-bottom: 9px solid transparent !important;
    border-left: 15px solid #ffffff !important;
}

.game-item div.game-top div.game-opener div.play-buttons span.button.demo,
.game-item div.game-top div.game-opener div.play-buttons a.button.demo {
    align-self: center !important;
}

@media (prefers-reduced-motion: reduce) {
    .game-item div.game-top div.game-opener div.play-buttons span.button:not(.demo),
    .game-item div.game-top div.game-opener div.play-buttons a.button:not(.demo) {
        animation: none !important;
    }
}

.game-item div.game-top div.game-opener div.play-buttons span.button:not(.demo):hover:not(#\9),
.game-item div.game-top div.game-opener div.play-buttons a.button:not(.demo):hover:not(#\9) {
    transform: none !important;
    transition: none !important;
}

.item:hover,
.item:hover .game-item,
.item .game-item:hover,
.item:hover div.game-top,
.item:hover div.game-opener,
.item:hover figure.game-image {
    transform: none !important;
}

header#header div.middle-header div.middle-header-container div.categories a.category.cb-cat-original span.icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 18px !important;
    height: 18px !important;
    color: #ffffff !important;
}

header#header div.middle-header div.middle-header-container div.categories a.category.cb-cat-original span.icon svg {
    width: 18px !important;
    height: 18px !important;
    display: block !important;
    flex-shrink: 0 !important;
}

header#header div.middle-header div.middle-header-container div.categories a.category.cb-cat-original:hover span.icon,
header#header div.middle-header div.middle-header-container div.categories a.category.cb-cat-original.active span.icon {
    color: #ffffff !important;
}

#responsive-menu .sl-acc__itemInner .sl-acc__headIcon {
    display: none !important;
}

#responsive-menu .sl-acc__itemRight {
    flex-shrink: 0 !important;
    margin-left: auto !important;
}

#responsive-menu .sl-acc__itemCount {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 26px !important;
    height: 20px !important;
    padding: 0 8px !important;
    background: rgba(255, 255, 255, 0.07) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 999px !important;
    color: rgba(255, 255, 255, 0.55) !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease !important;
}

#responsive-menu .sl-acc__item:hover .sl-acc__itemCount {
    background: rgba(var(--color-green-primary-rgb), 0.22) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.35) !important;
    color: #ffffff !important;
}

#responsive-menu .sl-acc__item.active .sl-acc__itemCount {
    background: rgba(var(--color-green-light-rgb), 0.22) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.5) !important;
    color: var(--color-green-bright) !important;
}

#responsive-menu .sl-acc__top {
    padding: 0 4px 6px !important;
}

#responsive-menu .sl-acc__topBtn {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    width: 100% !important;
    height: 40px !important;
    padding: 0 10px !important;
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 9px !important;
    cursor: pointer !important;
    transition: background 0.2s ease, border-color 0.2s ease !important;
}

#responsive-menu .sl-acc__topBtn:hover {
    background: rgba(var(--color-green-primary-rgb), 0.18) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.35) !important;
}

#responsive-menu .sl-acc__topText {
    color: rgba(255, 255, 255, 0.85) !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 13px !important;
}

#responsive-menu .sl-acc__itemGameMedia {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 28px !important;
    height: 28px !important;
    flex-shrink: 0 !important;
    border-radius: 7px !important;
    overflow: hidden !important;
    background: var(--color-surface-3) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

#responsive-menu .sl-acc__itemGameMedia img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}

#responsive-menu .sl-acc__item:hover .sl-acc__itemGameMedia {
    border-color: rgba(var(--color-green-light-rgb), 0.5) !important;
}

.game-carousel {
    margin-top: 40px !important;
    margin-bottom: 16px !important;
}

.game-carousel:not(:first-child) {
    position: relative !important;
}

.game-carousel:not(:first-child)::before {
    content: "" !important;
    position: absolute !important;
    top: -20px !important;
    left: 0 !important;
    right: 0 !important;
    height: 1px !important;
    background: linear-gradient(90deg, transparent, rgba(var(--color-green-light-rgb), 0.3), transparent) !important;
    pointer-events: none !important;
}

.game-item div.game-top,
.item div.game-top,
.game-item div.game-top figure.game-image,
.item div.game-top figure.game-image {
    position: relative !important;
}

@media (hover: hover) and (pointer: fine) {

    .game-item div.game-top::before,
    .item div.game-top::before {
        content: "" !important;
        position: absolute !important;
        inset: 0 !important;
        border-radius: 11px 11px 0 0 !important;
        background: linear-gradient(160deg, rgba(var(--color-green-light-rgb), 0.22) 0%, rgba(var(--color-green-primary-rgb), 0.3) 100%) !important;
        opacity: 0 !important;
        transition: opacity 0.28s ease !important;
        pointer-events: none !important;
        z-index: 3 !important;
    }

    .item:hover div.game-top::before,
    .game-item:hover div.game-top::before {
        opacity: 1 !important;
    }

    .item div.game-top figure.game-image::after,
    .game-item div.game-top figure.game-image::after {
        content: "" !important;
        position: absolute !important;
        top: 50% !important;
        left: 50% !important;
        transform: translate(-50%, -50%) scale(0.6) !important;
        width: 52px !important;
        height: 52px !important;
        border-radius: 50% !important;
        background: linear-gradient(180deg, var(--color-green-light) 0%, var(--color-green-primary) 100%) !important;
        border: 1px solid rgba(255, 255, 255, 0.28) !important;
        box-shadow: 0 8px 22px rgba(0, 0, 0, 0.45) !important;
        opacity: 0 !important;
        transition: opacity 0.25s ease, transform 0.25s cubic-bezier(.2, .9, .2, 1) !important;
        pointer-events: none !important;
        z-index: 5 !important;
    }

    .item div.game-top figure.game-image::before,
    .game-item div.game-top figure.game-image::before {
        content: "" !important;
        position: absolute !important;
        top: 50% !important;
        left: calc(50% + 2px) !important;
        transform: translate(-50%, -50%) scale(0.6) !important;
        width: 0 !important;
        height: 0 !important;
        border-top: 8px solid transparent !important;
        border-bottom: 8px solid transparent !important;
        border-left: 13px solid #ffffff !important;
        opacity: 0 !important;
        transition: opacity 0.25s ease, transform 0.25s cubic-bezier(.2, .9, .2, 1) !important;
        pointer-events: none !important;
        z-index: 6 !important;
    }

    .item:hover div.game-top figure.game-image::after,
    .game-item:hover div.game-top figure.game-image::after {
        opacity: 1 !important;
        transform: translate(-50%, -50%) scale(1) !important;
        animation: cbPlayPulseFinal 1.8s ease-out infinite !important;
    }

    .item:hover div.game-top figure.game-image::before,
    .game-item:hover div.game-top figure.game-image::before {
        opacity: 1 !important;
        transform: translate(-50%, -50%) scale(1) !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .game-item div.game-top::before,
    .item div.game-top::before,
    .item div.game-top figure.game-image::after,
    .game-item div.game-top figure.game-image::after,
    .item div.game-top figure.game-image::before,
    .game-item div.game-top figure.game-image::before {
        transition: none !important;
    }
    .item:hover div.game-top figure.game-image::after,
    .game-item:hover div.game-top figure.game-image::after {
        animation: none !important;
    }
}

.vip6q {
    padding: 32px 0 64px !important;
    background:
        radial-gradient(900px 420px at 50% -10%, rgba(var(--vip-accent-rgb), 0.14), transparent 62%),
        var(--vip-bg0) !important;
}

.vip6q__container {
    max-width: 1240px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
}

.vip6q__grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)) !important;
    gap: 22px !important;
}

.vip6qCard {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    background:
        linear-gradient(165deg, rgba(var(--vip-accent-rgb), 0.1) 0%, transparent 45%),
        linear-gradient(180deg, rgba(7, 26, 16, 0.92) 0%, rgba(3, 10, 6, 0.96) 100%) !important;
    border: 1px solid var(--vip-card-border) !important;
    border-radius: 18px !important;
    overflow: hidden !important;
    box-shadow: 0 20px 48px rgba(0, 0, 0, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
    transition: border-color 0.28s ease, box-shadow 0.28s ease, transform 0.24s ease !important;
}

.vip6qCard:hover,
.vip6qCard:focus-visible {
    border-color: rgba(var(--vip-accent-rgb), 0.55) !important;
    box-shadow: 0 26px 60px rgba(0, 0, 0, 0.5), 0 0 32px rgba(var(--vip-accent-rgb), 0.18) !important;
    transform: translateY(-3px) !important;
    outline: none !important;
}

.vip6qCard__glow {
    position: absolute !important;
    top: -60px !important;
    right: -40px !important;
    width: 220px !important;
    height: 220px !important;
    border-radius: 50% !important;
    background: radial-gradient(closest-side, rgba(var(--color-green-light-rgb), 0.3), transparent 72%) !important;
    filter: blur(6px) !important;
    pointer-events: none !important;
    z-index: 0 !important;
}

.vip6qCard__head {
    position: relative !important;
    z-index: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    padding: 18px 20px 14px !important;
}

.vip6qCard__tier {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    min-width: 0 !important;
}

.vip6qCard__icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 56px !important;
    height: 56px !important;
    padding: 0 !important;
    flex-shrink: 0 !important;
    border-radius: 0 !important;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    overflow: visible !important;
}

.vip6qCard__icon img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    filter: drop-shadow(0 6px 14px rgba(0, 0, 0, 0.5)) !important;
}

.vip6qCard__name {
    color: #ffffff !important;
    font-family: var(--font-family-bold), sans-serif !important;
    font-size: 17px !important;
    letter-spacing: 0.01em !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.vip6qCard__meta {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
}

.vip6qTag {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 7px 14px !important;
    background: rgba(255, 255, 255, 0.06) !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-radius: 999px !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 12px !important;
}

.vip6qTag__label {
    color: var(--vip-muted) !important;
}

.vip6qTag__value {
    color: #ffffff !important;
    font-family: var(--font-family-bold), sans-serif !important;
}

.vip6qTag--gift {
    background: var(--vip-gift-tag-bg) !important;
    border-color: var(--vip-gift-tag-border) !important;
}

.vip6qTag--gift .vip6qTag__value {
    color: var(--color-green-light) !important;
}

.vip6qTag--full {
    width: 100% !important;
    justify-content: space-between !important;
    padding: 10px 16px !important;
}

.vip6qCard__head,
.vip6qCard__head *,
.vip6qCard__body,
.vip6qCard__body > *,
.vip6qCard__html > *,
.vip6qCard__foot,
.vip6qCard__foot * {
    margin-top: 0 !important;
}

.vip6qCard__body {
    position: relative !important;
    z-index: 1 !important;
    padding: 16px 20px 4px !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}

.vip6qCard,
.vip6qCard__html {
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
}

.vip6qCard__html {
    display: block !important;
    overflow: visible !important;
    -webkit-line-clamp: none !important;
    line-clamp: none !important;
}

.vip6qCard__preview {
    display: none !important;
}

.vip6qCard__foot {
    position: relative !important;
    z-index: 1 !important;
    margin-top: auto !important;
    padding: 14px 20px 18px !important;
    border-top: 1px solid var(--vip-card-border-soft) !important;
}

.vip6qCard__note {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    color: var(--vip-muted) !important;
    font-family: var(--font-family-medium), sans-serif !important;
    font-size: 12.5px !important;
}

.vip6qCard__note::before {
    content: "\2713" !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 16px !important;
    height: 16px !important;
    flex-shrink: 0 !important;
    border-radius: 50% !important;
    background: rgba(var(--color-green-light-rgb), 0.18) !important;
    color: var(--color-green-light) !important;
    font-size: 10px !important;
}

@media (max-width: 767px) {
    .vip6q__grid {
        grid-template-columns: 1fr !important;
    }
}

.vip-perk-banner {
    background: linear-gradient(135deg, var(--color-green-light) 0%, var(--color-green-hover) 55%, var(--color-green-primary) 100%) !important;
    border: 1px solid rgba(var(--color-green-light-rgb), 0.45) !important;
    border-radius: 12px !important;
    padding: 16px 12px !important;
    margin: 0 0 16px !important;
    text-align: center !important;
    box-shadow: 0 0 20px rgba(var(--color-green-primary-rgb), 0.2) !important;
}

.vip-perk-banner span {
    color: #ffffff !important;
    font-family: "Rajdhani", sans-serif !important;
    font-size: 17px !important;
    font-weight: 800 !important;
    letter-spacing: 0.6px !important;
    text-transform: uppercase !important;
}

.vip-perk-level {
    font-family: "Rajdhani", sans-serif !important;
    font-weight: 800 !important;
    letter-spacing: 3px !important;
    text-transform: uppercase !important;
    color: rgba(255, 255, 255, 0.95) !important;
    text-align: center !important;
    margin: 0 0 12px !important;
    font-size: 17px !important;
}

.vip-perk-desc {
    margin: 0 0 18px !important;
    color: rgba(255, 255, 255, 0.82) !important;
    font-family: "Rajdhani", sans-serif !important;
    font-size: 15.5px !important;
    line-height: 1.55 !important;
    text-align: center !important;
    font-weight: 600 !important;
}

.vip-perk-label {
    color: #ffffff !important;
    font-family: "Rajdhani", sans-serif !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    margin: 0 0 10px !important;
}

.vip-perk-list {
    background: rgba(0, 14, 9, 0.75) !important;
    border: 1px solid rgba(var(--color-green-light-rgb), 0.2) !important;
    border-radius: 14px !important;
    overflow: hidden !important;
}

.vip-perk-item {
    display: flex !important;
    align-items: center !important;
    min-height: 52px !important;
    height: auto !important;
    max-height: none !important;
    padding: 12px 16px !important;
    color: rgba(255, 255, 255, 0.9) !important;
    font-family: "Rajdhani", sans-serif !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    -webkit-line-clamp: none !important;
    line-clamp: none !important;
    min-width: 0 !important;
    word-break: break-word !important;
    overflow-wrap: anywhere !important;
}

.vip-perk-item:last-child {
    border-bottom: none !important;
}

.vip-perk-item::before {
    content: "" !important;
    display: inline-block !important;
    width: 8px !important;
    height: 8px !important;
    margin-right: 12px !important;
    flex-shrink: 0 !important;
    border-radius: 50% !important;
    background: var(--color-green-light) !important;
    box-shadow: 0 0 0 5px rgba(var(--color-green-light-rgb), 0.14), 0 0 10px rgba(var(--color-green-light-rgb), 0.5) !important;
}

@media (prefers-reduced-motion: reduce) {
    .vip6qCard {
        transition: none !important;
    }
    .vip6qCard:hover {
        transform: none !important;
    }
}

.page div.page-body {
    display: flex !important;
    align-items: flex-start !important;
    gap: 22px !important;
}

.page div.page-body div.page-sidebar {
    flex: 0 0 264px !important;
    min-width: 0 !important;
    background:
        radial-gradient(260px 160px at 15% -10%, rgba(var(--color-green-primary-rgb), 0.14), transparent 62%),
        linear-gradient(180deg, rgba(7, 26, 16, 0.92) 0%, rgba(3, 10, 6, 0.96) 100%) !important;
    border: 1px solid var(--surface-border-soft) !important;
    border-radius: 14px !important;
    padding: 10px !important;
    position: sticky !important;
    top: 76px !important;
    box-shadow: 0 16px 36px rgba(0, 0, 0, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
}

.page div.page-body div.page-sidebar div.page-selecter div.current {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    height: 46px !important;
    padding: 0 14px !important;
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.09) !important;
    border-radius: 10px !important;
    cursor: pointer !important;
    transition: background 0.2s ease, border-color 0.2s ease !important;
}

.page div.page-body div.page-sidebar div.page-selecter div.current:hover {
    background: rgba(var(--color-green-primary-rgb), 0.16) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.35) !important;
}

.page div.page-body div.page-sidebar div.page-selecter div.current div.name {
    color: #ffffff !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 13.5px !important;
}

.page div.page-body div.page-sidebar div.page-selecter div.current div.down {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: transform 0.25s ease !important;
}

.page div.page-body div.page-sidebar[data-open="1"] div.page-selecter div.current div.down {
    transform: rotate(180deg) !important;
}

.page div.page-body div.page-sidebar ul.sidebar-menu {
    display: flex !important;
    flex-direction: column !important;
    gap: 3px !important;
    margin: 8px 0 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.page div.page-body div.page-sidebar ul.sidebar-menu li a {
    display: flex !important;
    align-items: center !important;
    padding: 10px 14px !important;
    border-radius: 9px !important;
    background: transparent !important;
    color: var(--text-muted) !important;
    font-size: 13.5px !important;
    line-height: 1.4 !important;
    text-decoration: none !important;
    transition: background 0.2s ease, color 0.2s ease, padding-left 0.2s ease, box-shadow 0.2s ease !important;
}

.page div.page-body div.page-sidebar ul.sidebar-menu li a:hover {
    background: rgba(255, 255, 255, 0.05) !important;
    color: #ffffff !important;
    padding-left: 18px !important;
    box-shadow: inset 3px 0 0 rgba(var(--color-green-light-rgb), 0.55) !important;
}

.page div.page-body div.page-sidebar ul.sidebar-menu li a.active,
.page div.page-body div.page-sidebar ul.sidebar-menu li a:active {
    background: rgba(var(--color-green-primary-rgb), 0.18) !important;
    color: var(--color-green-bright) !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    padding-left: 18px !important;
    box-shadow: inset 3px 0 0 var(--color-green-light) !important;
}

.page div.page-body div.page-content {
    flex: 1 1 0% !important;
    min-width: 0 !important;
}

.page div.page-body div.page-content div.form-blocks div.form-block {
    background:
        radial-gradient(720px 260px at 50% -12%, rgba(var(--color-green-primary-rgb), 0.12), transparent 60%),
        linear-gradient(180deg, rgba(7, 26, 16, 0.9) 0%, rgba(3, 10, 6, 0.95) 100%) !important;
    border: 1px solid var(--surface-border-soft) !important;
    border-radius: 14px !important;
    padding: 30px 32px !important;
    box-shadow: 0 20px 46px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
}

.policy-html {
    color: var(--policies-content-color) !important;
    font-size: 14.5px !important;
    line-height: 1.8 !important;
}

.policy-html > *:first-child {
    margin-top: 0 !important;
}

.policy-html p {
    margin: 0 0 16px !important;
}

.policy-html strong {
    color: var(--policies-heading-color) !important;
    font-family: var(--font-family-semibold), sans-serif !important;
}

.policy-html h1,
.policy-html h2,
.policy-html h3,
.policy-html h4 {
    color: var(--policies-heading-color) !important;
    font-family: var(--font-family-bold), sans-serif !important;
    margin: 28px 0 12px !important;
    line-height: 1.3 !important;
}

.policy-html h1 { font-size: 22px !important; }
.policy-html h2 { font-size: 19px !important; }
.policy-html h3, .policy-html h4 { font-size: 16px !important; }

.policy-html a {
    color: var(--policies-link-color) !important;
    text-decoration: underline !important;
    text-underline-offset: 2px !important;
    transition: color 0.2s ease !important;
}

.policy-html a:hover {
    color: var(--color-green-bright) !important;
}

.policy-html ul,
.policy-html ol {
    margin: 0 0 18px !important;
    padding-left: 0 !important;
    list-style: none !important;
}

.policy-html ul li {
    position: relative !important;
    padding: 4px 0 4px 22px !important;
    margin-bottom: 4px !important;
}

.policy-html ul li p {
    margin: 0 !important;
}

.policy-html ul li::before {
    content: "" !important;
    position: absolute !important;
    left: 4px !important;
    top: 14px !important;
    width: 6px !important;
    height: 6px !important;
    border-radius: 50% !important;
    background: var(--color-green-light) !important;
    box-shadow: 0 0 0 4px rgba(var(--color-green-light-rgb), 0.14) !important;
}

.policy-html ol {
    counter-reset: cb-policy-ol !important;
}

.policy-html ol li {
    position: relative !important;
    padding: 4px 0 4px 26px !important;
    margin-bottom: 4px !important;
    counter-increment: cb-policy-ol !important;
}

.policy-html ol li::before {
    content: counter(cb-policy-ol) "." !important;
    position: absolute !important;
    left: 0 !important;
    color: var(--color-green-light) !important;
    font-family: var(--font-family-semibold), sans-serif !important;
}

.policy-html table {
    width: 100% !important;
    border-collapse: collapse !important;
    margin: 0 0 18px !important;
}

.policy-html table th,
.policy-html table td {
    padding: 10px 12px !important;
    border: 1px solid var(--surface-border-soft) !important;
    text-align: left !important;
}

.policy-html table th {
    background: rgba(255, 255, 255, 0.04) !important;
    color: #ffffff !important;
}

@media (max-width: 991px) {
    .page div.page-body {
        flex-direction: column !important;
    }

    .page div.page-body div.page-sidebar {
        flex: 1 1 auto !important;
        width: 100% !important;
        position: static !important;
        top: auto !important;
    }

    .page div.page-body div.page-content div.form-blocks div.form-block {
        padding: 20px 18px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .page div.page-body div.page-sidebar ul.sidebar-menu li a,
    .page div.page-body div.page-sidebar div.page-selecter div.current div.down {
        transition: none !important;
    }
}

.auth-logo img, .auth-logo svg {
    opacity: 1 !important;
}

.auth-modal .auth-logo {
    position: relative !important;
}

.auth-modal .auth-logo::before {
    content: "" !important;
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 180px !important;
    height: 60px !important;
    background: radial-gradient(closest-side, rgba(var(--color-green-light-rgb), 0.28), transparent 72%) !important;
    filter: blur(6px) !important;
    pointer-events: none !important;
    z-index: 0 !important;
}

.auth-modal .auth-logo .logo {
    position: relative !important;
    z-index: 1 !important;
}

.ato-wrap {
    display: flex !important;
    justify-content: center !important;
    max-width: 100% !important;
}

.ato-rail {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 2px !important;
    height: 50px !important;
    padding: 4px !important;
    background: rgba(255, 255, 255, 0.045) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 999px !important;
    max-width: 100% !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
}

.ato-rail::-webkit-scrollbar {
    display: none !important;
}

.ato-btn {
    position: relative !important;
    z-index: 1 !important;
    flex: 0 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 26px !important;
    padding: 0 12px !important;
    border-radius: 999px !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 12px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    background: transparent !important;
    border: 1px solid transparent !important;
}

.ato-rail .ato-btn.is-active,
.ato-rail .ato-btn:hover {
    background: transparent !important;
    border-color: transparent !important;
    color: #ffffff !important;
}

.ato-btn.is-active {
    font-family: var(--font-family-bold), sans-serif !important;
}

.ato-rail .ato-indicator {
    top: 4px !important;
    bottom: 4px !important;
    height: auto !important;
    border-radius: 999px !important;
}

@media (max-width: 480px) {
    .ato-btn {
        height: 24px !important;
        padding: 0 10px !important;
        font-size: 11.5px !important;
    }
    .ato-rail {
        gap: 0 !important;
    }
}

.ato-indicator {
    z-index: 0 !important;
    box-shadow: 0 6px 16px rgba(var(--color-green-primary-rgb), 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
    transition: transform 0.32s cubic-bezier(.2, .9, .2, 1), width 0.32s cubic-bezier(.2, .9, .2, 1) !important;
}

.or-auth {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: wrap !important;
    gap: 8px 16px !important;
    margin-top: 18px !important;
    padding-top: 16px !important;
    border-top: 1px solid var(--surface-border-soft) !important;
}

.or-auth .forgot {
    color: var(--color-green-light) !important;
    font-size: 13px !important;
    font-family: var(--font-family-medium), sans-serif !important;
    cursor: pointer !important;
    transition: color 0.2s ease !important;
}

.or-auth .forgot:hover {
    color: var(--color-green-bright) !important;
    text-decoration: underline !important;
}

.or-auth .dont {
    font-size: 13px !important;
}

.or-auth .dont .register-tab,
.or-auth .dont .login-tab {
    background: none !important;
    border: none !important;
    padding: 0 !important;
    margin-left: 4px !important;
    color: var(--color-green-light) !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 13px !important;
    cursor: pointer !important;
    text-decoration: underline !important;
    text-underline-offset: 2px !important;
    transition: color 0.2s ease !important;
}

.or-auth .dont .register-tab:hover,
.or-auth .dont .login-tab:hover {
    color: var(--color-green-bright) !important;
}

.auth-form button[type="submit"]:disabled {
    opacity: var(--btn-primary-disabled-opacity) !important;
    cursor: not-allowed !important;
    box-shadow: none !important;
}

@media (max-width: 480px) {
    .or-auth {
        flex-direction: column !important;
        align-items: flex-start !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ato-indicator {
        transition: none !important;
    }
}

.cb-gamefinder {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    gap: 20px !important;
    height: 250px;
    margin: 90px 0 16px !important;
    padding: 0 32px !important;
    border-radius: 16px !important;
    overflow: visible !important;
    background-color: #010d08 !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    border: 1px solid rgb(2 83 40) !important;
    box-shadow: 0 20px 46px rgba(0, 0, 0, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
}

.cb-gamefinder {
    -webkit-transform: translateZ(0) !important;
    transform: translateZ(0) !important;
    background-clip: border-box !important;
    -webkit-background-clip: border-box !important;
}

.cb-gamefinder::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 0 !important;
    pointer-events: none !important;
    border-radius: inherit !important;
    background: linear-gradient(90deg, rgba(1, 13, 8, 0.96) 0%, rgba(1, 13, 8, 0.82) 26%, rgba(1, 13, 8, 0.42) 52%, rgba(1, 13, 8, 0.08) 76%, transparent 100%) !important;
}

.cb-gamefinder__loader {
    position: absolute !important;
    inset: 0 !important;
    z-index: 5 !important;
    display: none !important;
    align-items: center !important;
    justify-content: center !important;
    background: rgba(1, 13, 8, 0.6) !important;
    border-radius: inherit !important;
}

.cb-gamefinder.is-loading .cb-gamefinder__loader {
    display: flex !important;
}

.cb-gamefinder__loader-spin {
    width: 34px !important;
    height: 34px !important;
    border-radius: 50% !important;
    border: 3px solid rgba(var(--color-green-light-rgb), 0.25) !important;
    border-top-color: var(--color-green-light) !important;
    animation: cbFinderLoaderSpin 0.8s linear infinite !important;
}

@keyframes cbFinderLoaderSpin {
    to { transform: rotate(360deg); }
}

.cb-gamefinder__character,
.cb-gamefinder__content,
.cb-gamefinder__trail,
.cb-gamefinder__thumbs-viewport {
    transition: opacity 0.35s ease !important;
}

.cb-gamefinder.is-loading .cb-gamefinder__character,
.cb-gamefinder.is-loading .cb-gamefinder__content,
.cb-gamefinder.is-loading .cb-gamefinder__trail,
.cb-gamefinder.is-loading .cb-gamefinder__thumbs-viewport {
    opacity: 0 !important;
}

main#main > .cb-gamefinder {
    margin-top: 90px !important;
}

.cb-gamefinder__character {
    position: relative !important;
    z-index: 2 !important;
    flex: 0 0 auto !important;
    align-self: stretch !important;
    display: flex !important;
    align-items: flex-end !important;
    pointer-events: none !important;
}

.cb-gamefinder__character img {
    height: 287px !important;
    width: auto !important;
    display: block !important;
    filter: drop-shadow(0 14px 26px rgba(0, 0, 0, 0.55)) drop-shadow(0 0 34px rgba(var(--color-green-light-rgb), 0.45)) drop-shadow(0 0 60px rgba(var(--color-green-light-rgb), 0.22)) !important;
}

.cb-gamefinder__content {
    position: relative !important;
    z-index: 2 !important;
    flex: 0 0 auto !important;
    max-width: 300px !important;
}

.cb-gamefinder__title {
    color: #ffffff !important;
    font-family: var(--font-family-bold), sans-serif !important;
    font-size: 22px !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
    margin: 0 0 8px !important;
    text-shadow: 0 4px 14px rgba(0, 0, 0, 0.5) !important;
}

.cb-gamefinder__desc {
    color: rgba(255, 255, 255, 0.7) !important;
    font-size: 13.5px !important;
    line-height: 1.5 !important;
    margin: 0 0 16px !important;
}

.cb-gamefinder__actions {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

.cb-gamefinder__retry {
    display: none !important;
    align-items: center !important;
    justify-content: center !important;
    width: 44px !important;
    height: 44px !important;
    flex-shrink: 0 !important;
    padding: 0 !important;
    background: rgba(255, 255, 255, 0.06) !important;
    border: 1px solid rgba(var(--color-green-light-rgb), 0.35) !important;
    border-radius: 10px !important;
    color: #ffffff !important;
    cursor: pointer !important;
    -webkit-appearance: none !important;
    appearance: none !important;
    transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease !important;
}

.cb-gamefinder__retry.is-shown {
    display: inline-flex !important;
}

.cb-gamefinder__retry svg {
    width: 18px !important;
    height: 18px !important;
    display: block !important;
}

.cb-gamefinder__retry:hover {
    background: rgba(var(--color-green-primary-rgb), 0.22) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.6) !important;
}

.cb-gamefinder__retry:active {
    transform: scale(0.92) !important;
}

.cb-gamefinder__retry:disabled {
    opacity: 0.5 !important;
    cursor: not-allowed !important;
    pointer-events: none !important;
}

.cb-gamefinder__btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 12px 22px !important;
    background: linear-gradient(180deg, var(--color-green-hover) 0%, var(--color-green-primary) 100%) !important;
    border: 1px solid rgba(var(--color-green-light-rgb), 0.5) !important;
    border-radius: 10px !important;
    color: #ffffff !important;
    font-family: var(--font-family-bold), sans-serif !important;
    font-size: 13.5px !important;
    letter-spacing: 0.03em !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    box-shadow: 0 8px 20px rgba(var(--color-green-primary-rgb), 0.4) !important;
    transition: filter 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease !important;
}

.cb-gamefinder__btn:hover {
    filter: brightness(1.1) !important;
    box-shadow: 0 10px 26px rgba(var(--color-green-primary-rgb), 0.55) !important;
    transform: translateY(-1px) !important;
}

.cb-gamefinder__btn:active {
    transform: translateY(0) scale(0.97) !important;
}

.cb-gamefinder__btn-icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 16px !important;
    height: 16px !important;
    flex-shrink: 0 !important;
}

.cb-gamefinder__btn-icon svg {
    width: 100% !important;
    height: 100% !important;
    display: block !important;
}

@keyframes cbFinderRoll {
    to { transform: rotate(360deg); }
}

.cb-gamefinder__btn.is-rolling {
    pointer-events: none !important;
    opacity: 0.85 !important;
}

.cb-gamefinder__btn.is-rolling .cb-gamefinder__btn-icon {
    animation: cbFinderRoll 0.5s linear infinite !important;
}

.cb-gamefinder__trail {
    position: relative !important;
    z-index: 1 !important;
    flex: 1 1 auto !important;
    height: 12px !important;
    min-width: 40px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='12' viewBox='0 0 18 12'%3E%3Cpath d='M2 1 L11 6 L2 11' fill='none' stroke='%2310b461' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
    background-repeat: repeat-x !important;
    background-position: left center !important;
    background-size: 18px 12px !important;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent) !important;
    mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent) !important;
    filter: drop-shadow(0 0 5px rgba(var(--color-green-light-rgb), 0.65)) !important;

}

@keyframes cbTrailFlow {
    from { background-position: 0 center; }
    to   { background-position: 18px center; }
}

.cb-gamefinder.is-searching .cb-gamefinder__trail {
    animation: cbTrailFlow 0.3s linear infinite !important;
    filter: drop-shadow(0 0 9px rgba(var(--color-green-light-rgb), 0.9)) !important;
}

.cb-gamefinder__thumbs-viewport {
    position: relative !important;
    z-index: 2 !important;

    width: 380px !important;
    overflow: hidden !important;
    padding: 12px !important;
    border-radius: 14px !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.05) 0%, rgba(0, 0, 0, 0.22) 100%) !important;
    border: 1px solid rgba(var(--color-green-light-rgb), 0.22) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), inset 0 0 24px rgba(0, 0, 0, 0.35), 0 12px 28px rgba(0, 0, 0, 0.35) !important;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent) !important;
    mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent) !important;
}

.cb-gamefinder__thumbs {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    width: max-content !important;
    will-change: transform !important;
}

.cb-gamefinder__thumb {
    display: block !important;
    flex: 0 0 auto !important;
    width: 68px !important;
    height: 90px !important;
    padding: 0 !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    background: transparent !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.45) !important;
    cursor: pointer !important;
    -webkit-appearance: none !important;
    appearance: none !important;
    font: inherit !important;
    transition: transform 0.2s ease, border-color 0.2s ease !important;
}

.cb-gamefinder__thumb:hover {
    transform: translateY(-3px) scale(1.05) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.65) !important;
}

.cb-gamefinder__thumb.is-picked {
    transform: scale(1.14) !important;
    border-color: rgba(var(--color-green-bright-rgb), 0.9) !important;
    box-shadow: 0 0 0 3px rgba(var(--color-green-light-rgb), 0.35), 0 14px 30px rgba(0, 0, 0, 0.55) !important;
}

.cb-gamefinder__thumb.is-picked:hover {
    transform: translateY(-3px) scale(1.14) !important;
}

.cb-gamefinder__thumb img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}

@media (max-width: 991px) {
    .cb-gamefinder {
        height: auto !important;
        min-height: 170px !important;
        padding: 20px !important;
        gap: 16px !important;
    }
    .cb-gamefinder__character img { height: 190px !important; }
    .cb-gamefinder__content { max-width: 220px !important; }
    .cb-gamefinder__title { font-size: 18px !important; }
    .cb-gamefinder__thumbs-viewport { width: 280px !important; padding: 10px !important; }
    .cb-gamefinder__thumbs { gap: 6px !important; }
    .cb-gamefinder__thumb { width: 50px !important; height: 66px !important; }
}

@media (max-width: 767px) {

    .cb-gamefinder {
        flex-direction: column !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: flex-start !important;
        height: auto !important;
        min-height: 0 !important;
        padding: 22px 16px 18px !important;
        gap: 14px !important;
        margin: 40px 0 16px !important;
        text-align: center !important;
        border-radius: 18px !important;
        border-color: var(--color-green-primary) !important;
        box-shadow: 0 22px 48px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
    }
    main#main > .cb-gamefinder {
        margin-top: 40px !important;
    }

    .cb-gamefinder::before {
        background: linear-gradient(180deg, rgba(1, 13, 8, 0.72) 0%, rgba(1, 13, 8, 0.86) 55%, rgba(1, 13, 8, 0.95) 100%) !important;
    }
    .cb-gamefinder__character {
        display: flex !important;
        justify-content: center !important;
        align-self: center !important;
        margin-bottom: 4px !important;
    }
    .cb-gamefinder__character img {
        height: 150px !important;
    }
    .cb-gamefinder__content {
        max-width: none !important;
        flex: 0 0 auto !important;
        width: 100% !important;
        min-width: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
    }

    .cb-gamefinder__content::before {
        content: "" !important;
        width: 40px !important;
        height: 3px !important;
        margin: 0 auto 12px !important;
        border-radius: 999px !important;
        background: linear-gradient(90deg, var(--color-green-bright), var(--color-green-primary)) !important;
        box-shadow: 0 0 10px rgba(var(--color-green-light-rgb), 0.55) !important;
    }
    .cb-gamefinder__title { font-size: 18px !important; line-height: 1.25 !important; margin: 0 0 6px !important; }
    .cb-gamefinder__desc { font-size: 12.5px !important; margin: 0 0 14px !important; }

    .cb-gamefinder__actions {
        justify-content: center !important;
        width: 100% !important;
        max-width: 340px !important;
        gap: 10px !important;
    }
    .cb-gamefinder__btn {
        flex: 1 1 auto !important;
        justify-content: center !important;
        padding: 12px 18px !important;
        font-size: 12.5px !important;
        border-radius: 12px !important;
    }
    .cb-gamefinder__retry { flex: 0 0 auto !important; width: 46px !important; height: 46px !important; border-radius: 12px !important; }
    .cb-gamefinder__retry svg { width: 17px !important; height: 17px !important; }
    .cb-gamefinder__trail { display: none !important; }

    .cb-gamefinder__thumbs-viewport {
        flex: 0 0 auto !important;
        width: 100% !important;
        max-width: 420px !important;
        margin-top: 2px !important;
        padding: 12px !important;
        border-radius: 16px !important;
        border-color: var(--color-green-primary) !important;
    }
    .cb-gamefinder__thumbs { gap: 12px !important; }
    .cb-gamefinder__thumb { width: 88px !important; height: 116px !important; border-radius: 10px !important; }
}

@media (max-width: 420px) {
    .cb-gamefinder {
        padding: 16px !important;
        gap: 12px !important;
    }
    .cb-gamefinder__title { font-size: 16px !important; }
    .cb-gamefinder__desc { font-size: 11.5px !important; margin: 0 0 12px !important; }
    .cb-gamefinder__btn { padding: 11px 16px !important; font-size: 12px !important; }
    .cb-gamefinder__retry { width: 44px !important; height: 44px !important; }
    .cb-gamefinder__retry svg { width: 16px !important; height: 16px !important; }
    .cb-gamefinder__actions { max-width: 300px !important; }
    .cb-gamefinder__thumbs-viewport { max-width: 340px !important; padding: 10px !important; }
    .cb-gamefinder__thumbs { gap: 10px !important; }
    .cb-gamefinder__thumb { width: 78px !important; height: 103px !important; }
}

@media (prefers-reduced-motion: reduce) {
    .cb-gamefinder__trail { animation: none !important; }
    .cb-gamefinder__btn.is-rolling .cb-gamefinder__btn-icon { animation: none !important; }
    .cb-gamefinder__loader-spin { animation: none !important; }
    .cb-gamefinder__thumbs { transition: none !important; }
    .cb-gamefinder__btn:hover,
    .cb-gamefinder__retry:active,
    .cb-gamefinder__thumb:hover { transform: none !important; }
}

.cb-cat-dropdown {
    position: absolute !important;
    top: calc(100% + 8px) !important;
    left: 0;
    z-index: 120 !important;
    width: 248px !important;
    padding: 10px !important;
    border-radius: 12px !important;
    background: linear-gradient(180deg, rgba(7, 26, 16, 0.98), rgba(3, 10, 6, 0.99)) !important;
    border: 1px solid rgba(var(--color-green-primary-rgb), 0.5) !important;
    box-shadow: 0 20px 42px rgba(0, 0, 0, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transform: translateY(-6px) !important;
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s !important;
    pointer-events: none !important;
}

.cb-cat-dropdown.is-open {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) !important;
    pointer-events: auto !important;
}

.cb-cat-dropdown__grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 2px 6px !important;
    margin-bottom: 7px !important;
}

.cb-cat-dropdown__item {
    display: block !important;
    padding: 6px 8px !important;
    border-radius: 7px !important;
    color: rgba(255, 255, 255, 0.82) !important;
    font-family: var(--font-family-medium), sans-serif !important;
    font-size: 11.5px !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    transition: background 0.18s ease, color 0.18s ease !important;
}

.cb-cat-dropdown__item:hover {
    background: rgba(var(--color-green-primary-rgb), 0.22) !important;
    color: #ffffff !important;
}

.cb-cat-dropdown__all {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    height: 34px !important;
    border-radius: 8px !important;
    background: linear-gradient(180deg, var(--color-green-hover), var(--color-green-primary)) !important;
    color: #ffffff !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 12px !important;
    text-decoration: none !important;
    box-shadow: 0 6px 16px rgba(var(--color-green-primary-rgb), 0.35) !important;
    transition: filter 0.2s ease !important;
}

.cb-cat-dropdown__all:hover {
    filter: brightness(1.1) !important;
}

@media (prefers-reduced-motion: reduce) {
    .cb-cat-dropdown {
        transition: none !important;
    }
}

.cb-quickaccess {
    display: grid !important;
    grid-template-columns: 300px 1fr !important;
    gap: 32px !important;
    align-items: stretch !important;
    margin: 40px 0 !important;
    padding: 28px !important;
    border-radius: 20px !important;
    background:
        radial-gradient(1100px 420px at 18% -20%, rgba(var(--color-green-primary-rgb), 0.16), transparent 60%),
        var(--color-surface-1) !important;
    border: 1px solid var(--surface-border-soft) !important;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.4) !important;
}

.cb-quickaccess__lead {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: 16px !important;
}

.cb-quickaccess__kicker {
    color: var(--color-green-light) !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: 0.1em !important;
    text-transform: uppercase !important;
}

.cb-quickaccess__title {
    font-family: var(--font-family-bold), sans-serif !important;
    font-size: 26px !important;
    font-weight: 800 !important;
    line-height: 1.22 !important;
    margin: 0 !important;
    color: #ffffff !important;
    text-wrap: balance !important;
}

.cb-quickaccess__title em {
    color: var(--color-green-bright) !important;
    font-style: normal !important;
}

.cb-quickaccess__desc {
    margin: 0 !important;
    color: var(--text-muted) !important;
    font-size: 13.5px !important;
    line-height: 1.6 !important;
}

.cb-quickaccess__cta {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    align-self: flex-start !important;
    margin-top: 6px !important;
    padding: 11px 20px !important;
    border-radius: 9px !important;
    background: linear-gradient(180deg, var(--color-green-hover), var(--color-green-primary)) !important;
    border: 1px solid rgba(var(--color-green-light-rgb), 0.5) !important;
    color: #ffffff !important;
    font-family: var(--font-family-bold), sans-serif !important;
    font-size: 13px !important;
    letter-spacing: 0.02em !important;
    text-decoration: none !important;
    box-shadow: 0 8px 20px rgba(var(--color-green-primary-rgb), 0.4) !important;
    transition: filter 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease !important;
}

.cb-quickaccess__cta svg {
    width: 15px !important;
    height: 15px !important;
    transition: transform 0.2s ease !important;
}

.cb-quickaccess__cta:hover {
    filter: brightness(1.12) !important;
    box-shadow: 0 12px 28px rgba(var(--color-green-primary-rgb), 0.55) !important;
    transform: translateY(-1px) !important;
}

.cb-quickaccess__cta:hover svg {
    transform: translateX(2px) !important;
}

.cb-quickaccess__cta:active {
    transform: translateY(0) scale(0.97) !important;
}

.cb-quickaccess__socials {
    display: flex !important;
    gap: 8px !important;
    margin-top: 4px !important;
}

.cb-quickaccess__socials a {
    width: 34px !important;
    height: 34px !important;
    border-radius: 9px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid var(--surface-border-soft) !important;
    color: var(--text-muted) !important;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease !important;
}

.cb-quickaccess__socials a:hover {
    background: rgba(var(--color-green-light-rgb), 0.16) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.45) !important;
    color: var(--color-green-bright) !important;
    transform: translateY(-2px) !important;
}

.cb-quickaccess__socials svg {
    width: 15px !important;
    height: 15px !important;
}

.cb-quickaccess__grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    grid-template-rows: repeat(2, 1fr) !important;
    gap: 12px !important;
}

.cb-quickaccess__card {
    position: relative !important;
    border-radius: 14px !important;
    padding: 16px 14px 14px !important;
    background:
        linear-gradient(165deg, rgba(var(--color-green-light-rgb), 0.1) 0%, transparent 45%),
        linear-gradient(180deg, var(--color-surface-2) 0%, var(--color-surface-1) 100%) !important;
    border: 1px solid #33544a !important;
    box-shadow: 0 10px 26px rgba(0, 0, 0, 0.45) !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    min-height: 150px !important;
    text-decoration: none !important;
    cursor: pointer !important;
    transition: border-color 0.22s ease, transform 0.22s ease, box-shadow 0.22s ease !important;
}

.cb-quickaccess__card:hover {
    border-color: rgba(var(--color-green-light-rgb), 0.55) !important;
    transform: translateY(-4px) !important;
    box-shadow: 0 18px 36px rgba(0, 0, 0, 0.5), 0 0 26px rgba(var(--color-green-light-rgb), 0.16) !important;
}

.cb-quickaccess__card:active {
    transform: translateY(-1px) !important;
}

.cb-quickaccess__ribbon {
    position: absolute !important;
    top: 10px !important;
    right: -30px !important;
    transform: rotate(35deg) !important;
    background: linear-gradient(90deg, var(--color-green-bright), var(--color-green-light)) !important;
    color: #02170d !important;
    font-family: var(--font-family-bold), sans-serif !important;
    font-size: 9px !important;
    font-weight: 800 !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
    padding: 3px 34px !important;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.35) !important;
    transition: box-shadow 0.22s ease !important;
}

.cb-quickaccess__card:hover .cb-quickaccess__ribbon {
    box-shadow: 0 4px 16px rgba(var(--color-green-bright-rgb), 0.45) !important;
}

.cb-quickaccess__icon {
    width: 34px !important;
    height: 34px !important;
    border-radius: 9px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: rgba(var(--color-green-light-rgb), 0.14) !important;
    border: 1px solid rgba(var(--color-green-light-rgb), 0.3) !important;
    color: var(--color-green-bright) !important;
    margin-bottom: auto !important;
    position: relative !important;
    z-index: 1 !important;
    transition: background 0.22s ease, border-color 0.22s ease, transform 0.22s ease !important;
}

.cb-quickaccess__card:hover .cb-quickaccess__icon {
    background: rgba(var(--color-green-light-rgb), 0.26) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.6) !important;
    transform: scale(1.08) rotate(-4deg) !important;
}

.cb-quickaccess__icon svg {
    width: 18px !important;
    height: 18px !important;
}

.cb-quickaccess__name {
    font-family: var(--font-family-bold), sans-serif !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    margin: 10px 0 2px !important;
    color: #ffffff !important;
    position: relative !important;
    z-index: 1 !important;
    transition: color 0.22s ease !important;
}

.cb-quickaccess__card:hover .cb-quickaccess__name {
    color: var(--color-green-bright) !important;
}

.cb-quickaccess__sub {
    font-size: 11px !important;
    color: var(--text-soft) !important;
    margin: 0 0 10px !important;
    position: relative !important;
    z-index: 1 !important;
}

.cb-quickaccess__go {
    align-self: flex-start !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 11.5px !important;
    font-weight: 700 !important;
    color: var(--color-green-bright) !important;
    position: relative !important;
    z-index: 1 !important;
    transition: gap 0.22s ease, color 0.22s ease !important;
}

.cb-quickaccess__card:hover .cb-quickaccess__go {
    gap: 8px !important;
    color: #ffffff !important;
}

.cb-quickaccess__go svg {
    width: 12px !important;
    height: 12px !important;
    transition: transform 0.22s ease !important;
}

.cb-quickaccess__card:hover .cb-quickaccess__go svg {
    transform: translateX(2px) !important;
}

.cb-quickaccess__card--tall {
    grid-row: span 2 !important;
    align-items: center !important;
    text-align: center !important;
    justify-content: center !important;
    gap: 8px !important;
}

.cb-quickaccess__card--tall .cb-quickaccess__icon {
    width: 52px !important;
    height: 52px !important;
    margin: 0 0 4px !important;
}

.cb-quickaccess__card--tall .cb-quickaccess__icon svg {
    width: 26px !important;
    height: 26px !important;
}

.cb-quickaccess__card--tall .cb-quickaccess__name {
    font-size: 18px !important;
    margin: 0 !important;
}

.cb-quickaccess__card--tall .cb-quickaccess__sub {
    margin: 0 0 6px !important;
}

.cb-quickaccess__card--tall:hover {
    transform: translateY(-4px) scale(1.015) !important;
}

@media (max-width: 860px) {
    .cb-quickaccess {
        grid-template-columns: 1fr !important;
        padding: 20px !important;
        margin-top: 15px !important;
        margin-bottom: 15px !important;
    }
    .cb-quickaccess__grid {
        grid-template-columns: repeat(2, 1fr) !important;
        grid-template-rows: auto !important;
    }
    .cb-quickaccess__card--tall {
        grid-row: span 2 !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .cb-quickaccess__card,
    .cb-quickaccess__icon,
    .cb-quickaccess__name,
    .cb-quickaccess__go,
    .cb-quickaccess__go svg,
    .cb-quickaccess__ribbon,
    .cb-quickaccess__cta,
    .cb-quickaccess__cta svg,
    .cb-quickaccess__socials a {
        transition: none !important;
    }
    .cb-quickaccess__card:hover,
    .cb-quickaccess__card--tall:hover,
    .cb-quickaccess__card:hover .cb-quickaccess__icon,
    .cb-quickaccess__cta:hover,
    .cb-quickaccess__socials a:hover {
        transform: none !important;
    }
}

.faq {
    display: none !important;
}

.cb-mission-vision {
    margin-top: 40px;
}

.cb-mission-vision__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
}

.cb-mission-vision__card {
    position: relative;
    padding: 26px 28px;
    border-radius: 16px;
    overflow: hidden;
    background:
        radial-gradient(480px 220px at 15% -10%, rgba(var(--color-green-primary-rgb), 0.18), transparent 62%),
        linear-gradient(180deg, var(--color-surface-2) 0%, var(--color-surface-1) 100%);
    border: 1px solid var(--surface-border-soft);
    box-shadow: 0 20px 46px rgba(0, 0, 0, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.04);
    transition: border-color 0.28s ease, box-shadow 0.28s ease, transform 0.24s ease;
}

.cb-mission-vision__card:hover {
    border-color: rgba(var(--color-green-light-rgb), 0.5);
    box-shadow: 0 28px 60px rgba(0, 0, 0, 0.5), 0 0 30px rgba(var(--color-green-primary-rgb), 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.06);
    transform: translateY(-5px);
}

.cb-mission-vision__card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 8%;
    right: 8%;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--color-green-light), transparent);
    box-shadow: 0 0 12px rgba(var(--color-green-light-rgb), 0.55);
    pointer-events: none;
    transition: box-shadow 0.28s ease;
}

.cb-mission-vision__card:hover::before {
    box-shadow: 0 0 20px rgba(var(--color-green-light-rgb), 0.9);
}

.cb-mission-vision__title {
    margin: 0 0 14px;
    color: #ffffff;
    font-family: var(--font-family-bold), sans-serif;
    font-size: 18px;
    font-weight: 800;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    transition: color 0.28s ease;
}

.cb-mission-vision__card:hover .cb-mission-vision__title {
    color: var(--color-green-bright);
}

.cb-mission-vision__text {
    margin: 0;
    color: var(--text-muted);
    font-size: 13.5px;
    line-height: 1.75;
}

@media (max-width: 860px) {
    .cb-mission-vision__grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }
}

@media (max-width: 991px) {
    .cb-mission-vision {
        margin-top: 28px;
    }
    .cb-mission-vision__card {
        padding: 18px 18px;
        border-radius: 14px;
    }
    .cb-mission-vision__title {
        margin: 0 0 10px;
        font-size: 15px;
    }
    .cb-mission-vision__text {
        font-size: 12.5px;
        line-height: 1.6;
    }
}

@media (max-width: 480px) {
    .cb-mission-vision__card {
        padding: 15px 15px;
    }
    .cb-mission-vision__title {
        font-size: 14px;
    }
    .cb-mission-vision__text {
        font-size: 12px;
        line-height: 1.55;
    }
}
.enterence-box {
    padding: 40px 0px !important;
}

.latestWins {
    margin-top: 0px !important;
}

@media (max-width: 767px) {
    .hp-mobile-slider {
        margin-top: 10px !important;
        margin-bottom: 15px !important;
    }
    .latestWins {
        margin-top: 30px !important;
    }
}

.sticky-menu .menu-item.wallet .logo img {
    margin-bottom: 7px !important;
}

@media (prefers-reduced-motion: reduce) {
    .cb-mission-vision__card,
    .cb-mission-vision__card::before,
    .cb-mission-vision__title {
        transition: none !important;
    }
    .cb-mission-vision__card:hover {
        transform: none !important;
    }
}

.promotions-tabs a.promotions-tab[href$="/active"],
.promotions-tabs a.promotions-tab[href$="/expired"] {
    display: none !important;
}

.ps-sheet {
    background: linear-gradient(180deg, rgba(7, 26, 16, 0.97) 0%, rgba(3, 10, 6, 0.98) 100%) !important;
    border: 1px solid rgba(var(--color-green-primary-rgb), 0.45) !important;
    box-shadow: 0 -20px 60px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

.ps-sheet-handle {
    background: rgba(255, 255, 255, 0.16) !important;
}

.ps-sheet-header {
    border-bottom: 1px solid rgba(var(--color-green-primary-rgb), 0.3) !important;
}

.ps-sheet-title {
    color: #ffffff !important;
    font-family: var(--font-family-semibold), sans-serif !important;
}

.ps-sheet-close {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 999px !important;
    color: rgba(255, 255, 255, 0.75) !important;
    cursor: pointer !important;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease !important;
}

.ps-sheet-close:hover {
    background: rgba(var(--danger-rgb), 0.18) !important;
    border-color: rgba(var(--danger-rgb), 0.5) !important;
    color: #ff7a8a !important;
}

.ps-sheet .sidebar-menu {
    display: flex !important;
    flex-direction: column !important;
    gap: 3px !important;
}

.ps-sheet .sidebar-menu li a {
    display: flex !important;
    align-items: center !important;
    padding: 12px 14px !important;
    border-radius: 9px !important;
    background: transparent !important;
    color: var(--text-muted) !important;
    font-size: 14px !important;
    text-decoration: none !important;
    transition: background 0.2s ease, color 0.2s ease, padding-left 0.2s ease, box-shadow 0.2s ease !important;
}

.ps-sheet .sidebar-menu li a:hover {
    background: rgba(255, 255, 255, 0.05) !important;
    color: #ffffff !important;
    padding-left: 18px !important;
    box-shadow: inset 3px 0 0 rgba(var(--color-green-light-rgb), 0.55) !important;
}

.ps-sheet .sidebar-menu li a.active {
    background: rgba(var(--color-green-primary-rgb), 0.18) !important;
    color: var(--color-green-bright) !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    padding-left: 18px !important;
    box-shadow: inset 3px 0 0 var(--color-green-light) !important;
}

@media (prefers-reduced-motion: reduce) {
    .ps-sheet .sidebar-menu li a,
    .ps-sheet-close {
        transition: none !important;
    }
}

footer#footer div.footer-bottom div.copyright a img {
    max-width: 140px !important;
}

@media (min-width: 992px) {
    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button,
    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button.register {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        box-sizing: border-box !important;
        height: 38px !important;
        min-height: 38px !important;
        max-height: 38px !important;
        width: 108px !important;
        min-width: 108px !important;
        max-width: 108px !important;
        flex: 0 0 108px !important;
        line-height: 1 !important;
        padding: 0 !important;
        border-width: 1px !important;
        border-radius: 10px !important;
        font-size: 13px !important;
        align-self: center !important;
        vertical-align: middle !important;
    }
}

.ph6q__right:before{
    display: none !important;
}

.ph6q__right {
    background: none !important;
    background-color: transparent !important;
}

.ph6q__imgGlow {
    display: none !important;
}

html.cbload-run:not(.cbload-done), html.cbload-run:not(.cbload-done) body { overflow: hidden !important; height: 100%; }

html.cbload-run::before {
  content: ""; position: fixed; inset: 0; z-index: 99999; pointer-events: auto;
  background:
    radial-gradient(1100px 680px at 50% 26%, rgba(3,112,53,.18), transparent 58%),
    radial-gradient(700px 520px at 12% 100%, rgba(2,83,40,.14), transparent 60%),
    linear-gradient(180deg, #000 0%, #020c07 46%, #061a10 100%);
  transition: opacity .7s ease, visibility .7s ease;
}

html.cbload-run::after {
  content: ""; position: fixed; inset: 0; z-index: 100000; pointer-events: none;
  background: url("https://vendor-provider.fra1.cdn.digitaloceanspaces.com/ebetlab/poWRPFOWPRFOdpfwRFPOWRPFOWORFP/statics/yulU1mnANXDeCBT12arPwONNBwEuCB8QnUYF1EUx.gif") center 47% / min(300px,60vw) auto no-repeat;
  filter: drop-shadow(0 8px 26px rgba(0,0,0,.6)) drop-shadow(0 0 20px rgba(16,180,97,.25));
  animation: cbLogoIn .9s cubic-bezier(.2,.8,.2,1) both;
transition: opacity .35s ease, transform .35s ease, visibility .35s ease;
}

html.cbload-run:not(.cbload-done) body::before {
  content: ""; position: fixed; inset: 0; z-index: 100001; pointer-events: none;
  -webkit-mask: url("https://vendor-provider.fra1.cdn.digitaloceanspaces.com/ebetlab/poWRPFOWPRFOdpfwRFPOWRPFOWORFP/statics/yulU1mnANXDeCBT12arPwONNBwEuCB8QnUYF1EUx.gif") center 47% / min(300px,60vw) auto no-repeat;
          mask: url("https://vendor-provider.fra1.cdn.digitaloceanspaces.com/ebetlab/poWRPFOWPRFOdpfwRFPOWRPFOWORFP/statics/yulU1mnANXDeCBT12arPwONNBwEuCB8QnUYF1EUx.gif") center 47% / min(300px,60vw) auto no-repeat;
  background: linear-gradient(105deg, transparent 30%, rgba(255,255,255,.85) 48%, rgba(180,255,214,.95) 50%, rgba(255,255,255,.85) 52%, transparent 70%);
  background-size: 250% 100%;
  mix-blend-mode: screen; opacity: .9;
  animation: cbSweep 2.6s ease-in-out infinite;
}

html.cbload-run:not(.cbload-done) body::after {
  content: ""; position: fixed; left: 50%; top: 56%; transform: translateX(-50%);
  width: min(260px,60vw); height: 4px; border-radius: 999px; z-index: 100001; pointer-events: none;
  background:
    linear-gradient(90deg, transparent, #10b461, #34d87a, transparent) no-repeat,
    rgba(255,255,255,.07);
  background-size: 42% 100%, 100% 100%;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
  animation: cbBar 1.15s linear infinite;
}

html.cbload-run.cbload-done::before { opacity: 0; visibility: hidden; transition: opacity .5s ease, visibility .5s ease; }
html.cbload-run.cbload-done::after  { opacity: 0; visibility: hidden; transform: scale(.94) translateY(-6px); animation: none !important; }

@keyframes cbLogoIn { from { opacity: 0; transform: scale(.9); } to { opacity: 1; transform: scale(1); } }
@keyframes cbSweep  { 0% { background-position: 180% 0; } 55%,100% { background-position: -80% 0; } }
@keyframes cbBar    { 0% { background-position: -45% 0, 0 0; } 100% { background-position: 145% 0, 0 0; } }

@media (prefers-reduced-motion: reduce) {
  html.cbload-run::after, html.cbload-run:not(.cbload-done) body::before, html.cbload-run:not(.cbload-done) body::after { animation: none !important; }
  html.cbload-run::before, html.cbload-run::after { transition: none; }
}

@media (max-width: 767px) {
  html.cbload-run:not(.cbload-done) body::before { display: none !important; }
}

#responsive-menu .categories .sb-top {
    display: none !important;
}

#responsive-menu .sb-top-btn.supportbtn {
    display: none !important;
}

#responsive-menu .cb-sbsections {
    display: block !important;
}

#responsive-menu .cb-sbsec + .cb-sbsec {
    margin-top: 2px !important;
}

#responsive-menu .cb-sbsec-title {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin: 14px 20px 6px !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
}

#responsive-menu .cb-sbsec-title__line:first-child {
    display: none !important;
}

#responsive-menu .cb-sbsec-title__line {
    flex: 1 !important;
    height: 1px !important;
    background: linear-gradient(90deg, rgba(var(--color-green-light-rgb), 0.35), transparent) !important;
}

#responsive-menu .cb-sbsec-title__text {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 9px !important;
    color: rgba(255, 255, 255, 0.96) !important;
    font-family: var(--font-family-bold), sans-serif !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    text-shadow: 0 1px 8px rgba(0, 0, 0, 0.4) !important;
}

#responsive-menu .cb-sbsec-title__text::before {
    content: "" !important;
    width: 3px !important;
    height: 15px !important;
    flex: 0 0 3px !important;
    border-radius: 3px !important;
    background: linear-gradient(180deg, var(--color-green-bright), var(--color-green-primary)) !important;
    box-shadow: 0 0 8px rgba(var(--color-green-light-rgb), 0.65) !important;
}

#responsive-menu .cb-sbsec--accent .cb-sbsec-title__text {
    color: #ffffff !important;
}

#responsive-menu .cb-sbsec-list {
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
    padding: 0 10px !important;
}

#responsive-menu .cb-sbaction .icon,
#responsive-menu .cb-sbaction .icon span[role="presentation"] {
    color: var(--color-green-light) !important;
}

#responsive-menu .cb-sbaction:hover .icon,
#responsive-menu .cb-sbaction:hover .icon span[role="presentation"] {
    color: var(--color-green-bright) !important;
}

#responsive-menu .cb-sbsec--accent .cb-sbaction {
    background: linear-gradient(95deg, rgba(var(--color-green-primary-rgb), 0.22) 0%, rgba(255, 255, 255, 0.03) 100%) !important;
    border: 1px solid rgba(var(--color-green-light-rgb), 0.16) !important;
}

#responsive-menu .cb-sbsec--accent .cb-sbaction:hover {
    background: linear-gradient(95deg, rgba(var(--color-green-primary-rgb), 0.34) 0%, rgba(255, 255, 255, 0.05) 100%) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.4) !important;
}

#responsive-menu.responsive-menu:not(.active-menu) .cb-sbsec-title {
    margin: 12px 10px 4px !important;
}

#responsive-menu.responsive-menu:not(.active-menu) .cb-sbsec-title__text {
    display: none !important;
}

#responsive-menu.cb-sb.cb-anim.active-menu .cb-sbsec-title {
    animation: cbSbItemIn 0.34s cubic-bezier(0.2, 0.9, 0.2, 1) both;
    animation-delay: calc(var(--cb-i, 0) * 22ms);
}

@media (prefers-reduced-motion: reduce) {
    #responsive-menu.cb-sb.cb-anim.active-menu .cb-sbsec-title {
        animation: none !important;
    }
}

@media (max-width: 991px) {
    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons {
        display: inline-flex !important;
        align-items: center !important;
        gap: 8px !important;
        padding: 0 !important;
        border-radius: 0 !important;
        background: none !important;
        box-shadow: none !important;
        overflow: visible !important;
        isolation: auto !important;
        flex: 0 0 auto !important;
    }

    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons::before,
    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons::after {
        display: none !important;
        content: none !important;
    }

    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button,
    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button.register {
        box-sizing: border-box !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        height: 31px !important;
        min-height: 31px !important;
        max-height: 31px !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        flex: 0 0 auto !important;
        padding: 0 12px !important;
        border-width: 1px !important;
        border-radius: 9px !important;
        font-size: 11.5px !important;
        font-weight: 700 !important;
        line-height: 1 !important;
        letter-spacing: 0.01em !important;
        white-space: nowrap !important;
        text-align: center !important;
    }

    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button:not(.register) {
        background: rgba(255, 255, 255, 0.05) !important;
        border: 1px solid rgba(255, 255, 255, 0.16) !important;
        color: #ffffff !important;
        box-shadow: none !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }

    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button:not(.register):hover {
        background: rgba(255, 255, 255, 0.1) !important;
        border-color: rgba(var(--color-green-light-rgb), 0.5) !important;
    }

    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button.register {
        background: linear-gradient(160deg, var(--color-green-light) 0%, var(--color-green-hover) 50%, var(--color-green-primary) 100%) !important;
        border: 1px solid rgba(var(--color-green-bright-rgb), 0.55) !important;
        color: #ffffff !important;
        box-shadow: 0 6px 16px rgba(var(--color-green-primary-rgb), 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.2) !important;
    }
}

@media (max-width: 380px) {
    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons {
        gap: 6px !important;
    }

    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button,
    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button.register {
        height: 32px !important;
        min-height: 32px !important;
        max-height: 32px !important;
        padding: 0 11px !important;
        font-size: 11px !important;
        border-radius: 9px !important;
    }
}

#responsive-menu .sl-acc__head {
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
}

#responsive-menu .sl-acc__headLeft {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    min-width: 0 !important;
}

#responsive-menu .sl-acc__chev {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    transition: transform 0.28s cubic-bezier(.2, .9, .2, 1) !important;
}

#responsive-menu .sl-acc__chev img {
    width: 13px !important;
    height: 13px !important;
    opacity: 0.65 !important;
    transition: opacity 0.2s ease, filter 0.2s ease !important;
}

#responsive-menu .sl-acc__section.is-open > .sl-acc__head .sl-acc__chev {
    transform: rotate(180deg) !important;
}

#responsive-menu .sl-acc__section.is-open > .sl-acc__head .sl-acc__chev img {
    opacity: 1 !important;
    filter: brightness(0) invert(1) drop-shadow(0 0 5px rgba(var(--color-green-light-rgb), 0.7)) !important;
}

#responsive-menu .sl-acc__section.is-open > .sl-acc__head .sl-acc__headLeft .sl-acc__headIcon svg {
    color: var(--color-green-bright) !important;
}

#responsive-menu .sl-acc__bodyWrap {
    overflow: hidden !important;
    transition: max-height 0.32s cubic-bezier(.2, .9, .2, 1) !important;
}

#responsive-menu .sl-acc__list {
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
    margin: 4px 0 2px !important;
    padding: 0 !important;
    list-style: none !important;
}

#responsive-menu .sl-acc__item:hover .sl-acc__itemRight svg {
    transform: translateX(2px) !important;
}

#responsive-menu .sl-acc__list--originals {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 4px !important;
    margin: 6px 0 2px !important;
    padding: 0 !important;
    list-style: none !important;
}

#responsive-menu .sl-acc__list--originals .sl-acc__itemInner {
    padding: 6px 8px !important;
    gap: 8px !important;
}

#responsive-menu .sl-acc__itemGameMedia img {
    transition: transform 0.25s ease !important;
}

#responsive-menu .sl-acc__item:hover .sl-acc__itemGameMedia img {
    transform: scale(1.09) !important;
}

#responsive-menu .sl-acc__itemInner .sl-acc__headIcon img[src$="digitaloceanspaces.com/"] {
    display: none !important;
}

@media (prefers-reduced-motion: reduce) {
    #responsive-menu .sl-acc__chev,
    #responsive-menu .sl-acc__bodyWrap,
    #responsive-menu .sl-acc__itemGameMedia img {
        transition: none !important;
    }
}

#responsive-menu .sl-acc__section,
#responsive-menu .sl-acc__section.is-open,
#responsive-menu .sl-acc__section:hover {
    margin: 6px 10px !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    overflow: visible !important;
}

#responsive-menu .sl-acc__head {
    height: 46px !important;
    min-height: 46px !important;
    margin: 0 !important;
    padding: 0 14px !important;
    background: var(--sbm-pill) !important;
    border: 1px solid var(--sbm-pill-border) !important;
    border-radius: var(--sbm-radius) !important;
    box-shadow: none !important;
}

#responsive-menu .sl-acc__head:hover {
    background: rgba(255, 255, 255, 0.07) !important;
    border-color: transparent !important;
}

#responsive-menu .sl-acc__section.is-open > .sl-acc__head {
    background: var(--sbm-active-fill) !important;
    border-color: transparent !important;
    box-shadow: 0 8px 22px rgba(var(--color-green-primary-rgb), 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
}

#responsive-menu .sl-acc__section.is-open > .sl-acc__head .sl-acc__headTitle {
    color: #ffffff !important;
}

#responsive-menu .sl-acc__section.is-open > .sl-acc__head .sl-acc__headLeft .sl-acc__headIcon svg {
    color: #ffffff !important;
}

#responsive-menu .sl-acc__section.is-open > .sl-acc__head .sl-acc__chev img {
    filter: brightness(0) invert(1) !important;
}

#responsive-menu .sl-acc__body {
    padding: 6px 0 2px !important;
}

#responsive-menu.responsive-menu .sb-content-animate,
#responsive-menu.responsive-menu .sb-content-animate .menu-body,
#responsive-menu.responsive-menu .sb-content-animate .sidebar-wrapper {
    background: none !important;
    background-color: transparent !important;
    box-shadow: none !important;
}

#responsive-menu .sidebar-content .sidebar-wrapper .categories .sb-top {
    display: none !important;
}

#responsive-menu .cb-sbaction {
    background: linear-gradient(95deg, rgba(var(--color-green-primary-rgb), 0.28) 0%, rgba(255, 255, 255, 0.03) 100%) !important;
    border: 1px solid rgba(var(--color-green-light-rgb), 0.2) !important;
}

#responsive-menu .cb-sbaction:hover {
    background: linear-gradient(95deg, rgba(var(--color-green-primary-rgb), 0.42) 0%, rgba(255, 255, 255, 0.05) 100%) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.45) !important;
}

#responsive-menu .cb-sbaction.active {
    background: var(--sbm-active-fill) !important;
    border-color: transparent !important;
    box-shadow: 0 8px 22px rgba(var(--color-green-primary-rgb), 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
}

#responsive-menu .cb-sbaction .icon,
#responsive-menu .cb-sbaction .icon span[role="presentation"],
#responsive-menu .cb-sbaction:hover .icon,
#responsive-menu .cb-sbaction:hover .icon span[role="presentation"] {
    color: #ffffff !important;
}

#responsive-menu .cb-sbaction .sb-top-title {
    color: #ffffff !important;
}

#responsive-menu .cb-sbaction .sb-top-arrow {
    color: rgba(255, 255, 255, 0.85) !important;
}

#responsive-menu.responsive-menu .sl-acc__bodyWrap {
    border: 1px transparent solid !important;
}

.sidebar-section-title__line {
    display: none !important;
}

#responsive-menu .sidebar-content .sidebar-wrapper .sidebar-section-title {
    display: none !important;
}

#responsive-menu.responsive-menu:not(.active-menu) .sl-acc__head {
    justify-content: center !important;
    padding: 0 !important;
}

#responsive-menu.responsive-menu:not(.active-menu) .sl-acc__headLeft {
    justify-content: center !important;
    gap: 0 !important;
    width: auto !important;
}

#responsive-menu.responsive-menu:not(.active-menu) .sl-acc__headTitle,
#responsive-menu.responsive-menu:not(.active-menu) .sl-acc__chev {
    display: none !important;
}

#responsive-menu.responsive-menu:not(.active-menu) .sl-acc__headIcon {
    margin: 0 auto !important;
}

.cb-sbfooter__head {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin: 2px 2px 12px !important;
}

.cb-sbfooter__title {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 9px !important;
    color: #ffffff !important;
    font-family: var(--font-family-bold), sans-serif !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    text-shadow: 0 1px 8px rgba(0, 0, 0, 0.4) !important;
}

.cb-sbfooter__title::before {
    content: "" !important;
    width: 3px !important;
    height: 15px !important;
    flex: 0 0 3px !important;
    border-radius: 3px !important;
    background: linear-gradient(180deg, var(--color-green-bright), var(--color-green-primary)) !important;
    box-shadow: 0 0 8px rgba(var(--color-green-light-rgb), 0.65) !important;
}

.cb-sbfooter__title-line {
    flex: 1 !important;
    height: 1px !important;
    background: linear-gradient(90deg, rgba(var(--color-green-light-rgb), 0.35), transparent) !important;
}

.cb-sbfooter .cb-sbfooter__socials {
    display: flex !important;
    gap: 9px !important;
}

.cb-sbfooter__socials a.cb-sbfooter__social {
    flex: 1 1 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    width: auto !important;
    height: 50px !important;
    padding: 0 12px !important;
    border-radius: 13px !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.06) 0%, rgba(255, 255, 255, 0.022) 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
    color: rgba(255, 255, 255, 0.78) !important;
    text-decoration: none !important;
    transition: background 0.22s ease, border-color 0.22s ease, color 0.22s ease, transform 0.2s ease, box-shadow 0.22s ease !important;
}

.cb-sbfooter__social .cb-sbfooter__social-icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 30px !important;
    height: 30px !important;
    flex-shrink: 0 !important;
    border-radius: 9px !important;
    background: rgba(255, 255, 255, 0.06) !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
    color: rgba(255, 255, 255, 0.92) !important;
    transition: background 0.22s ease, border-color 0.22s ease, color 0.22s ease !important;
}

.cb-sbfooter__social .cb-sbfooter__social-icon svg {
    width: 16px !important;
    height: 16px !important;
    display: block !important;
}

.cb-sbfooter__social .cb-sbfooter__social-name {
    display: none !important;
}

.cb-sbfooter__socials a.cb-sbfooter__social {
    gap: 0 !important;
    padding: 0 !important;
    height: 46px !important;
}

.cb-sbfooter__socials a.cb-sbfooter__social:hover {
    transform: translateY(-2px) !important;
    color: #ffffff !important;
}

.cb-sbfooter__social--telegram:hover {
    background: linear-gradient(180deg, rgba(41, 171, 226, 0.22), rgba(41, 171, 226, 0.08)) !important;
    border-color: rgba(41, 171, 226, 0.5) !important;
    box-shadow: 0 10px 20px rgba(41, 171, 226, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

.cb-sbfooter__social--telegram:hover .cb-sbfooter__social-icon {
    background: linear-gradient(135deg, #29abe2, #1c8ac0) !important;
    border-color: rgba(255, 255, 255, 0.25) !important;
    color: #ffffff !important;
}

.cb-sbfooter__social--instagram:hover {
    background: linear-gradient(180deg, rgba(225, 48, 108, 0.2), rgba(253, 176, 71, 0.08)) !important;
    border-color: rgba(225, 48, 108, 0.45) !important;
    box-shadow: 0 10px 20px rgba(225, 48, 108, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

.cb-sbfooter__social--instagram:hover .cb-sbfooter__social-icon {
    background: linear-gradient(135deg, #feda75, #fa7e1e 30%, #d62976 60%, #962fbf 90%) !important;
    border-color: rgba(255, 255, 255, 0.25) !important;
    color: #ffffff !important;
}

#responsive-menu.responsive-menu:not(.active-menu) .cb-sbfooter__social {
    padding: 0 !important;
    justify-content: center !important;
    height: 46px !important;
}

#responsive-menu.responsive-menu:not(.active-menu) .cb-sbfooter__head {
    display: none !important;
}

#responsive-menu.responsive-menu:not(.active-menu) .cb-sbfooter__socials {
    flex-direction: column !important;
    gap: 8px !important;
}

#responsive-menu.responsive-menu:not(.active-menu) .cb-sbfooter__social .cb-sbfooter__social-name {
    display: none !important;
}

.wallet-box.call-me-modal {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.call-me-modal .wallet-normal {
    background: transparent !important;
}

.call-me-modal .wallet-header {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    gap: 12px !important;
    margin-bottom: 18px !important;
}

.call-me-modal .call-me-head {
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
    min-width: 0 !important;
}

.call-me-modal .call-me-titleRow {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    color: #ffffff !important;
    font-family: var(--font-family-bold), sans-serif !important;
    font-size: 20px !important;
    font-weight: 800 !important;
}

.call-me-modal .call-me-icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 42px !important;
    height: 42px !important;
    flex-shrink: 0 !important;
    border-radius: 12px !important;
    background: linear-gradient(135deg, var(--color-green-light) 0%, var(--color-green-hover) 50%, var(--color-green-primary) 100%) !important;
    border: 1px solid rgba(var(--color-green-bright-rgb), 0.5) !important;
    box-shadow: 0 8px 20px rgba(var(--color-green-primary-rgb), 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.2) !important;
}

.call-me-modal .call-me-emoji {
    font-size: 20px !important;
    line-height: 1 !important;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.4)) !important;
}

.call-me-modal .call-me-subtitle {
    color: rgba(255, 255, 255, 0.55) !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
}

.call-me-modal .close-modal button.close-modal {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 38px !important;
    height: 38px !important;
    flex-shrink: 0 !important;
    padding: 0 !important;
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 999px !important;
    cursor: pointer !important;
    transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease !important;
}

.call-me-modal .close-modal button.close-modal:hover {
    background: rgba(var(--danger-rgb), 0.18) !important;
    border-color: rgba(var(--danger-rgb), 0.5) !important;
    transform: rotate(90deg) !important;
}

.call-me-modal .close-modal button.close-modal img {
    width: 15px !important;
    height: 15px !important;
    filter: brightness(0) invert(1) !important;
    opacity: 0.8 !important;
}

.call-me-modal .call-me-grid {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
}

.call-me-modal .call-me-two {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 12px !important;
}

.call-me-modal .form__group {
    display: flex !important;
    flex-direction: column !important;
    gap: 7px !important;
    min-width: 0 !important;
}

.call-me-modal .form__label {
    color: rgba(255, 255, 255, 0.82) !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 12.5px !important;
    letter-spacing: 0.01em !important;
}

.call-me-modal .form__label b {
    color: var(--danger) !important;
    margin-left: 3px !important;
    font-weight: 700 !important;
}

.call-me-modal .call-me-input,
.call-me-modal .call-me-textarea,
.call-me-modal .phone-pro2 .react-tel-input .form-control {
    width: 100% !important;
    height: 46px !important;
    padding: 0 14px !important;
    background: rgba(255, 255, 255, 0.035) !important;
    border: 1px solid rgba(255, 255, 255, 0.09) !important;
    border-radius: 10px !important;
    color: #ffffff !important;
    font-size: 14px !important;
    font-family: var(--font-family-medium), sans-serif !important;
    transition: background 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease !important;
}

.call-me-modal .call-me-textarea {
    height: auto !important;
    min-height: 96px !important;
    padding: 12px 14px !important;
    line-height: 1.5 !important;
    resize: vertical !important;
}

.call-me-modal .call-me-input::placeholder,
.call-me-modal .call-me-textarea::placeholder,
.call-me-modal .phone-pro2 .react-tel-input .form-control::placeholder {
    color: rgba(255, 255, 255, 0.35) !important;
}

.call-me-modal .call-me-input:focus,
.call-me-modal .call-me-textarea:focus,
.call-me-modal .phone-pro2 .react-tel-input .form-control:focus {
    background: rgba(var(--color-green-primary-rgb), 0.1) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.55) !important;
    box-shadow: 0 0 0 3px rgba(var(--color-green-light-rgb), 0.14) !important;
    outline: none !important;
}

.call-me-modal .phone-pro2 .react-tel-input {
    position: relative !important;
    width: 100% !important;
}

.call-me-modal .phone-pro2 .react-tel-input .special-label {
    display: none !important;
}

.call-me-modal .phone-pro2 .react-tel-input .form-control {
    padding-left: 58px !important;
}

.call-me-modal .phone-pro2 .react-tel-input .flag-dropdown {
    position: absolute !important;
    top: 1px !important;
    left: 1px !important;
    bottom: 1px !important;
    background: transparent !important;
    border: none !important;
    border-right: 1px solid rgba(255, 255, 255, 0.09) !important;
    border-radius: 10px 0 0 10px !important;
}

.call-me-modal .phone-pro2 .react-tel-input .flag-dropdown.open,
.call-me-modal .phone-pro2 .react-tel-input .flag-dropdown .selected-flag:hover,
.call-me-modal .phone-pro2 .react-tel-input .flag-dropdown .selected-flag:focus {
    background: rgba(255, 255, 255, 0.05) !important;
    border-radius: 10px 0 0 10px !important;
}

.call-me-modal .phone-pro2 .react-tel-input .selected-flag {
    width: 50px !important;
    padding: 0 0 0 14px !important;
    border-radius: 10px 0 0 10px !important;
}

.call-me-modal .phone-pro2 .react-tel-input .selected-flag .arrow {
    border-top-color: rgba(var(--color-green-light-rgb), 0.8) !important;
}

.call-me-modal .phone-pro2 .react-tel-input .selected-flag .arrow.up {
    border-bottom-color: rgba(var(--color-green-light-rgb), 0.8) !important;
}

.call-me-modal .phone-pro2 .react-tel-input .country-list {
    background: #060f0a !important;
    border: 1px solid rgba(var(--color-green-primary-rgb), 0.5) !important;
    border-radius: 12px !important;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.6) !important;
    margin-top: 6px !important;
}

.call-me-modal .phone-pro2 .react-tel-input .country-list .country:hover,
.call-me-modal .phone-pro2 .react-tel-input .country-list .country.highlight {
    background: rgba(var(--color-green-primary-rgb), 0.28) !important;
}

.call-me-modal .phone-pro2 .react-tel-input .country-list .country .dial-code {
    color: rgba(var(--color-green-light-rgb), 0.85) !important;
}

.call-me-modal .phone-pro2 .react-tel-input .country-list {
    max-height: 260px !important;
    padding: 6px !important;
}

.call-me-modal .phone-pro2 .react-tel-input .country-list .country {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    border-radius: 8px !important;
    padding: 8px 10px !important;
}

.call-me-modal .phone-pro2 .react-tel-input .country-list .country .flag {
    position: static !important;
    top: auto !important;
    left: auto !important;
    margin: 0 !important;
    flex-shrink: 0 !important;
}

.call-me-modal .phone-pro2 .react-tel-input .country-list .country .country-name {
    margin: 0 !important;
    color: rgba(255, 255, 255, 0.88) !important;
}

.call-me-modal .phone-pro2 .react-tel-input .country-list .country .dial-code {
    margin-left: auto !important;
}

.call-me-modal .phone-pro2 .react-tel-input .country-list .divider {
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.call-me-modal .phone-pro2 .react-tel-input .country-list .search {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 4px 6px 8px !important;
    background: #060f0a !important;
}

.call-me-modal .phone-pro2 .react-tel-input .country-list .search-box {
    width: 100% !important;
    height: 40px !important;
    margin: 0 !important;
    padding: 0 12px !important;
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(255, 255, 255, 0.09) !important;
    border-radius: 9px !important;
    color: #ffffff !important;
    font-size: 13.5px !important;
}

.call-me-modal .phone-pro2 .react-tel-input .country-list .search-box:focus {
    border-color: rgba(var(--color-green-light-rgb), 0.55) !important;
    box-shadow: 0 0 0 3px rgba(var(--color-green-light-rgb), 0.14) !important;
    outline: none !important;
}

.call-me-modal .phone-pro2 .react-tel-input .country-list::-webkit-scrollbar {
    width: 4px !important;
}

.call-me-modal .phone-pro2 .react-tel-input .country-list::-webkit-scrollbar-thumb {
    background: rgba(var(--color-green-light-rgb), 0.35) !important;
    border-radius: 999px !important;
}

.call-me-modal .call-me-actions {
    margin-top: 20px !important;
}

.call-me-modal .call-me-actions .common-form-button .button {
    width: 100% !important;
    min-height: 50px !important;
    background: linear-gradient(135deg, var(--color-green-hover) 0%, var(--color-green-primary) 100%) !important;
    border: 1px solid rgba(var(--color-green-light-rgb), 0.45) !important;
    border-radius: 12px !important;
    color: #ffffff !important;
    font-family: var(--font-family-bold), sans-serif !important;
    font-size: 15px !important;
    box-shadow: 0 8px 22px rgba(var(--color-green-primary-rgb), 0.4) !important;
    transition: filter 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease !important;
}

.call-me-modal .call-me-actions .common-form-button .button:hover {
    filter: brightness(1.1) !important;
    box-shadow: 0 10px 28px rgba(var(--color-green-primary-rgb), 0.55) !important;
    transform: translateY(-1px) !important;
}

.call-me-modal .call-me-actions .common-form-button .button:active {
    transform: translateY(0) scale(0.98) !important;
}

@media (max-width: 767px) {

    body:has(.call-me-modal) .modal-body,
    .modal-body:has(.call-me-modal) {
        padding-top: 20px !important;
    }
}

@media (max-width: 480px) {
    .call-me-modal .call-me-two {
        grid-template-columns: 1fr !important;
    }
    .call-me-modal .call-me-titleRow {
        font-size: 18px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .call-me-modal .close-modal button.close-modal:hover,
    .call-me-modal .call-me-actions .common-form-button .button:hover {
        transform: none !important;
    }
}

.sticky-menu .menu-item.wallet.is-home-guest:before,
.sticky-menu .menu-item.wallet.is-home-guest:after {
    display: none !important;
}

.sticky-menu .menu-item.wallet.is-home-guest .logo .guest-home-icon {
    width: 56px !important;
    height: 56px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='7' height='7' rx='1.5'/%3E%3Crect x='14' y='3' width='7' height='7' rx='1.5'/%3E%3Crect x='3' y='14' width='7' height='7' rx='1.5'/%3E%3Crect x='14' y='14' width='7' height='7' rx='1.5'/%3E%3C/svg%3E") center / 26px 26px no-repeat,
        radial-gradient(circle at 30% 28%, rgba(var(--color-green-bright-rgb), 0.45), transparent 46%),
        linear-gradient(160deg, var(--color-green-light) 0%, var(--color-green-hover) 48%, var(--color-green-primary) 100%) !important;
    border: 3px solid var(--color-bg-tinted) !important;
    box-shadow:
        0 0 0 4px rgba(var(--color-green-hover-rgb), 0.5),
        0 10px 22px rgba(var(--color-green-primary-rgb), 0.5),
        inset 0 1px 0 rgba(255, 255, 255, 0.28) !important;
}

.sticky-menu .menu-item.wallet.is-home-guest .logo .guest-home-icon > span[role="presentation"],
.sticky-menu .menu-item.wallet.is-home-guest .logo .guest-home-icon svg {
    display: none !important;
}

.sticky-menu .menu-item.wallet.active .logo .guest-home-icon {
    box-shadow:
        0 0 0 4px rgba(var(--color-green-light-rgb), 0.75),
        0 12px 24px rgba(var(--color-green-primary-rgb), 0.55),
        inset 0 1px 0 rgba(255, 255, 255, 0.28) !important;
}

@media (max-width: 380px) {
    .sticky-menu .menu-item.wallet .logo .guest-home-icon {
        width: 52px !important;
        height: 52px !important;
        border-width: 3px !important;
    }
    .sticky-menu .menu-item.wallet .logo .guest-home-icon > span[role="presentation"],
    .sticky-menu .menu-item.wallet .logo .guest-home-icon svg {
        width: 24px !important;
        height: 24px !important;
    }
}

.sticky-menu .menu-item.wallet.is-wallet-user .logo {
    width: 56px !important;
    height: 56px !important;
    min-width: 56px !important;
    margin: 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    overflow: hidden !important;
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='7' height='7' rx='1.5'/%3E%3Crect x='14' y='3' width='7' height='7' rx='1.5'/%3E%3Crect x='3' y='14' width='7' height='7' rx='1.5'/%3E%3Crect x='14' y='14' width='7' height='7' rx='1.5'/%3E%3C/svg%3E") center / 26px 26px no-repeat,
        radial-gradient(circle at 30% 28%, rgba(var(--color-green-bright-rgb), 0.45), transparent 46%),
        linear-gradient(160deg, var(--color-green-light) 0%, var(--color-green-hover) 48%, var(--color-green-primary) 100%) !important;
    border: 3px solid var(--color-bg-tinted) !important;
    box-shadow:
        0 0 0 4px rgba(var(--color-green-hover-rgb), 0.5),
        0 10px 22px rgba(var(--color-green-primary-rgb), 0.5),
        inset 0 1px 0 rgba(255, 255, 255, 0.28) !important;
}

.sticky-menu .menu-item.wallet.is-wallet-user .logo img {
    display: none !important;
}

.sticky-menu .menu-item.wallet.is-wallet-user::before {
    display: none !important;
    content: none !important;
}

.sticky-menu .menu-item.wallet.is-wallet-user.active .logo {
    box-shadow:
        0 0 0 4px rgba(var(--color-green-light-rgb), 0.75),
        0 12px 24px rgba(var(--color-green-primary-rgb), 0.55),
        inset 0 1px 0 rgba(255, 255, 255, 0.28) !important;
}

@media (max-width: 380px) {
    .sticky-menu .menu-item.wallet.is-wallet-user .logo {
        width: 52px !important;
        height: 52px !important;
        border-width: 3px !important;
    }
    .sticky-menu .menu-item.wallet.is-wallet-user .logo img {
        width: 26px !important;
        height: 26px !important;
    }
}

.cb-mission-vision,
.cb-quickaccess,
.game-carousel {
    content-visibility: visible !important;
    contain-intrinsic-size: auto !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button::before {
    content: "" !important;
    width: 13px !important;
    height: 13px !important;
    flex: 0 0 13px !important;
    margin-right: 5px !important;
    background-color: currentColor !important;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 3h4a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-4'/%3E%3Cpolyline points='10 17 15 12 10 7'/%3E%3Cline x1='15' y1='12' x2='3' y2='12'/%3E%3C/svg%3E") center / contain no-repeat !important;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 3h4a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-4'/%3E%3Cpolyline points='10 17 15 12 10 7'/%3E%3Cline x1='15' y1='12' x2='3' y2='12'/%3E%3C/svg%3E") center / contain no-repeat !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button.register::before {
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cline x1='19' y1='8' x2='19' y2='14'/%3E%3Cline x1='22' y1='11' x2='16' y2='11'/%3E%3C/svg%3E") center / contain no-repeat !important;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cline x1='19' y1='8' x2='19' y2='14'/%3E%3Cline x1='22' y1='11' x2='16' y2='11'/%3E%3C/svg%3E") center / contain no-repeat !important;
}

@media (max-width: 991px) {
    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button::before {
        display: none !important;
        content: none !important;
    }
}

header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons::before {
    animation: none !important;
    content: none !important;
    display: none !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button:not(.register) {
    animation: none !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button:not(.register)::after {
    animation: none !important;
    content: none !important;
    display: none !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button.register::after {
    display: block !important;
    content: "" !important;
    -webkit-animation: premiumShine 5s ease-in-out infinite !important;
            animation: premiumShine 5s ease-in-out infinite !important;
}

@media (min-width: 992px) {
    #responsive-menu .sidebar-content .chat-button,
    .sidebar-content .chat-button {
        display: none !important;
    }
}

a, button, .button, [role="button"], .category, .chip, .tab, .nav-link,
.sb-top-btn, .cb-sbaction, .sl-acc__head, .p2seg,
.cb-gamefinder__btn, .cb-gamefinder__retry, .cb-gamefinder__thumb,
.cb-quickaccess__card, .cb-quickaccess__cta, .cb-quickaccess__socials a,
.cb-sbfooter__social, .sticky-menu .menu-item, .lowbar-fab__action,
input, select, textarea, label {
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
}

#responsive-menu, #responsive-menu .menu-body, #responsive-menu .sidebar-content,
#responsive-menu .sidebar-lang-options,
.user-info ul, .user-info .dropdown-menu, .user-info .user-menu,
div.news-area div.news-box div.box-over,
div.news-area div.news-box div.box-listing,
.chat div.message-blocks-user,
.ps-sheet, .modal .modal-body, .modal-body,
.react-international-phone-country-selector-dropdown,
.call-me-modal .phone-pro2 .react-tel-input .country-list {
    overscroll-behavior: contain;
}

html {
    color-scheme: dark !important;
}

@media (prefers-reduced-motion: reduce) {
    .button.register::after,
    .p2seg::after,
    header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button.register::after,
    .provider-carousel .swiper-wrapper,
    .provider-carousel .owl-carousel .owl-stage,
    footer .footer-currencies .currency-listing,
    footer#footer .footer-currencies .currency-listing {
        -webkit-animation: none !important;
        animation: none !important;
    }
}

.cb-gamefinder__title,
.cb-mission-vision__title,
.cb-promo__title,
.cb-promo__sub,
.promotion-detail-card h1,
.cb-quickaccess__desc {
    text-wrap: balance;
}

.cb-bubble-backdrop {
    position: fixed;
    inset: 0;
    z-index: 2147483600;
    background:
        radial-gradient(130% 100% at 50% 120%, rgba(var(--color-green-primary-rgb), 0.34), transparent 60%),
        rgba(0, 0, 0, 0.66);
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.28s ease, visibility 0.28s ease;
}

.cb-bubble-backdrop.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.cb-bubble {
    position: fixed;
    left: 50%;
    top: 50%;
    width: 0;
    height: 0;
    z-index: 2147483620;
    pointer-events: none;
}

.cb-bubble__item {
    position: absolute;
    left: 0;
    top: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    padding: 0;
    margin: 0;
    border: 0;
    background: none;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
    opacity: 0;
    transform: translate(-50%, -50%) scale(0.2);
    transition: transform 0.36s cubic-bezier(0.2, 0.9, 0.2, 1), opacity 0.24s ease;
    pointer-events: none;
}

.cb-bubble.is-open .cb-bubble__item {
    opacity: 1;
    transform: translate(calc(-50% + var(--tx, 0px)), calc(-50% + var(--ty, 0px))) scale(1);
    transition-delay: var(--d, 0ms);
    pointer-events: auto;
}

.cb-bubble__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    flex: 0 0 52px;
    border-radius: 50%;
    color: #ffffff;
    background: linear-gradient(160deg, var(--color-green-light) 0%, var(--color-green-hover) 48%, var(--color-green-primary) 100%);
    border: 1px solid rgba(var(--color-green-bright-rgb), 0.5);
    box-shadow:
        0 10px 22px rgba(var(--color-green-primary-rgb), 0.45),
        0 0 0 4px rgba(var(--color-green-hover-rgb), 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.22);
    transition: filter 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.cb-bubble__icon svg {
    width: 23px;
    height: 23px;
    display: block;
}

.cb-bubble__item:active .cb-bubble__icon {
    transform: scale(0.92);
    box-shadow:
        0 6px 14px rgba(var(--color-green-primary-rgb), 0.5),
        inset 0 1px 0 rgba(255, 255, 255, 0.22);
}

@media (hover: hover) and (pointer: fine) {
    .cb-bubble__item:hover .cb-bubble__icon {
        filter: brightness(1.1);
        box-shadow:
            0 12px 26px rgba(var(--color-green-primary-rgb), 0.55),
            0 0 0 5px rgba(var(--color-green-hover-rgb), 0.24),
            inset 0 1px 0 rgba(255, 255, 255, 0.24);
    }
}

.cb-bubble__item:focus-visible {
    outline: none;
}

.cb-bubble__item:focus-visible .cb-bubble__icon {
    box-shadow:
        0 0 0 3px var(--color-green-light),
        0 10px 22px rgba(var(--color-green-primary-rgb), 0.45);
}

.cb-bubble__label {
    position: absolute;
    top: calc(100% + 6px);
    left: 50%;
    transform: translateX(-50%);
    width: 86px;
    color: #ffffff;
    font-family: var(--font-family-semibold), sans-serif;
    font-size: 11px;
    line-height: 1.15;
    text-align: center;
    text-shadow: 0 2px 6px rgba(0, 0, 0, 0.8);
    white-space: normal;
    word-break: break-word;
    pointer-events: none;
}

body.cb-bubble-open .sticky-menu {
    z-index: 2147483610 !important;
}

.sticky-menu .menu-item.wallet .logo {
    position: relative;
}

body.cb-bubble-open .sticky-menu .menu-item.wallet .logo {
    width: 56px !important;
    height: 56px !important;
    min-width: 56px !important;
    margin: 0 auto !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: linear-gradient(160deg, var(--color-green-light) 0%, var(--color-green-hover) 48%, var(--color-green-primary) 100%) !important;
    border: 3px solid var(--color-bg-tinted) !important;
    box-shadow:
        0 0 0 4px rgba(var(--color-green-hover-rgb), 0.5),
        0 10px 22px rgba(var(--color-green-primary-rgb), 0.5),
        inset 0 1px 0 rgba(255, 255, 255, 0.28) !important;
}

@keyframes cbXCircleIn {
    from { transform: scale(0.55); }
    to   { transform: scale(1); }
}

.sticky-menu .menu-item.wallet .logo img,
.sticky-menu .menu-item.wallet .logo .guest-home-icon {
    transition: opacity 0.25s ease, transform 0.32s cubic-bezier(0.2, 0.9, 0.2, 1);
}

body.cb-bubble-open .sticky-menu .menu-item.wallet .logo img,
body.cb-bubble-open .sticky-menu .menu-item.wallet .logo .guest-home-icon {
    opacity: 0 !important;
    margin: 0 !important;
    transform: scale(0.4) rotate(-90deg) !important;
}

body.cb-bubble-open .sticky-menu .menu-item.wallet .logo::before,
body.cb-bubble-open .sticky-menu .menu-item.wallet .logo::after {
    content: "" !important;
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    width: 26px !important;
    height: 3px !important;
    border-radius: 3px !important;
    background: #ffffff !important;
    box-shadow: 0 0 10px rgba(var(--color-green-light-rgb), 0.85) !important;
    z-index: 6 !important;
    pointer-events: none !important;
}

body.cb-bubble-open .sticky-menu .menu-item.wallet .logo::before {
    transform: translate(-50%, -50%) rotate(45deg);
    animation: cbBubbleXIn 0.34s cubic-bezier(0.2, 0.9, 0.2, 1) both;
}

body.cb-bubble-open .sticky-menu .menu-item.wallet .logo::after {
    transform: translate(-50%, -50%) rotate(-45deg);
    animation: cbBubbleXIn 0.34s cubic-bezier(0.2, 0.9, 0.2, 1) both;
}

@keyframes cbBubbleXIn {
    0% {
        opacity: 0;
        transform: translate(-50%, -50%) scale(0.2) rotate(0deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .cb-bubble-backdrop,
    .cb-bubble__item,
    .cb-bubble__icon,
    .sticky-menu .menu-item.wallet .logo img,
    .sticky-menu .menu-item.wallet .logo .guest-home-icon {
        transition: none !important;
    }
    body.cb-bubble-open .sticky-menu .menu-item.wallet .logo,
    body.cb-bubble-open .sticky-menu .menu-item.wallet .logo::before,
    body.cb-bubble-open .sticky-menu .menu-item.wallet .logo::after {
        animation: none !important;
    }
}

body.cb-bubble-closing .sticky-menu .menu-item.wallet .logo {
    width: 56px !important;
    height: 56px !important;
    min-width: 56px !important;
    margin: 0 auto !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: linear-gradient(160deg, var(--color-green-light) 0%, var(--color-green-hover) 48%, var(--color-green-primary) 100%) !important;
    border: 3px solid var(--color-bg-tinted) !important;
    box-shadow:
        0 0 0 4px rgba(var(--color-green-hover-rgb), 0.5),
        0 10px 22px rgba(var(--color-green-primary-rgb), 0.5),
        inset 0 1px 0 rgba(255, 255, 255, 0.28) !important;
}

body.cb-bubble-closing .sticky-menu .menu-item.wallet.is-wallet-user .logo {
    background:
        radial-gradient(circle at 30% 28%, rgba(var(--color-green-bright-rgb), 0.45), transparent 46%),
        linear-gradient(160deg, var(--color-green-light) 0%, var(--color-green-hover) 48%, var(--color-green-primary) 100%) !important;
}

@keyframes cbBubbleIconReturn {
    from { opacity: 0; transform: scale(0.4) rotate(-90deg); }
    to   { opacity: 1; transform: none; }
}

body.cb-bubble-closing .sticky-menu .menu-item.wallet.is-wallet-user .logo {
    animation: none !important;
}

body.cb-bubble-closing .sticky-menu .menu-item.wallet.is-wallet-user .logo::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    width: 26px !important;
    height: 26px !important;
    border-radius: 0 !important;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='7' height='7' rx='1.5'/%3E%3Crect x='14' y='3' width='7' height='7' rx='1.5'/%3E%3Crect x='3' y='14' width='7' height='7' rx='1.5'/%3E%3Crect x='14' y='14' width='7' height='7' rx='1.5'/%3E%3C/svg%3E") center / contain no-repeat !important;
    box-shadow: none !important;
    z-index: 6 !important;
    pointer-events: none !important;
    animation: cbBubbleGridSpin 0.34s cubic-bezier(0.2, 0.9, 0.2, 1) both !important;
}

body.cb-bubble-closing .sticky-menu .menu-item.wallet.is-wallet-user .logo::after {
    display: none !important;
}

@keyframes cbBubbleGridSpin {
    from { opacity: 0; transform: translate(-50%, -50%) rotate(-90deg) scale(0.5); }
    to   { opacity: 1; transform: translate(-50%, -50%) rotate(0deg) scale(1); }
}

body.cb-bubble-closing .sticky-menu .menu-item.wallet .logo img,
body.cb-bubble-closing .sticky-menu .menu-item.wallet .logo .guest-home-icon {
    margin: 0 !important;
    animation: cbBubbleIconReturn 0.28s cubic-bezier(0.2, 0.9, 0.2, 1) both !important;
    animation-delay: 0.04s !important;
}

body.cb-bubble-closing .sticky-menu .menu-item.wallet .logo::before,
body.cb-bubble-closing .sticky-menu .menu-item.wallet .logo::after {
    content: "" !important;
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    width: 26px !important;
    height: 3px !important;
    border-radius: 3px !important;
    background: #ffffff !important;
    box-shadow: 0 0 10px rgba(var(--color-green-light-rgb), 0.85) !important;
    z-index: 6 !important;
    pointer-events: none !important;
}

body.cb-bubble-closing .sticky-menu .menu-item.wallet .logo::before {
    transform: translate(-50%, -50%) rotate(45deg);
    animation: cbBubbleXOutA 0.3s cubic-bezier(0.2, 0.9, 0.2, 1) both !important;
}

body.cb-bubble-closing .sticky-menu .menu-item.wallet .logo::after {
    transform: translate(-50%, -50%) rotate(-45deg);
    animation: cbBubbleXOutB 0.3s cubic-bezier(0.2, 0.9, 0.2, 1) both !important;
}

@keyframes cbBubbleXOutA {
    from { opacity: 1; transform: translate(-50%, -50%) scale(1) rotate(45deg); }
    to   { opacity: 0; transform: translate(-50%, -50%) scale(0.2) rotate(0deg); }
}

@keyframes cbBubbleXOutB {
    from { opacity: 1; transform: translate(-50%, -50%) scale(1) rotate(-45deg); }
    to   { opacity: 0; transform: translate(-50%, -50%) scale(0.2) rotate(0deg); }
}

@media (prefers-reduced-motion: reduce) {
    body.cb-bubble-closing .sticky-menu .menu-item.wallet .logo,
    body.cb-bubble-closing .sticky-menu .menu-item.wallet.is-wallet-user .logo,
    body.cb-bubble-closing .sticky-menu .menu-item.wallet.is-wallet-user .logo::before,
    body.cb-bubble-closing .sticky-menu .menu-item.wallet .logo img,
    body.cb-bubble-closing .sticky-menu .menu-item.wallet .logo .guest-home-icon,
    body.cb-bubble-closing .sticky-menu .menu-item.wallet .logo::before,
    body.cb-bubble-closing .sticky-menu .menu-item.wallet .logo::after {
        animation: none !important;
    }
}

@media (max-width: 380px) {
    body.cb-bubble-open .sticky-menu .menu-item.wallet .logo,
    body.cb-bubble-closing .sticky-menu .menu-item.wallet .logo {
        width: 52px !important;
        height: 52px !important;
        min-width: 52px !important;
    }
}

.app-mobile-sheet__container {
    background: linear-gradient(180deg, rgba(7, 26, 16, 0.98) 0%, rgba(3, 10, 6, 0.99) 100%) !important;
}

:root {
    --wheel-page-glow-a: rgba(var(--color-green-primary-rgb), 0.16) !important;
    --wheel-page-glow-b: rgba(255, 255, 255, 0.05) !important;

    --wheel-tabs-border: rgba(255, 255, 255, 0.08) !important;
    --wheel-tabs-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.03), rgba(255, 255, 255, 0.01)) !important;
    --wheel-tabs-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), 0 14px 24px rgba(0, 0, 0, 0.30) !important;
    --wheel-tab-border: rgba(255, 255, 255, 0.10) !important;
    --wheel-tab-bg: rgba(255, 255, 255, 0.03) !important;
    --wheel-tab-color: rgba(255, 255, 255, 0.88) !important;
    --wheel-tab-border-hover: rgba(var(--color-green-light-rgb), 0.40) !important;
    --wheel-tab-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
    --wheel-tab-shadow-hover: 0 10px 18px rgba(0, 0, 0, 0.30), inset 0 1px 0 rgba(255, 255, 255, 0.07) !important;

    --wheel-chip-color: #ffffff !important;
    --wheel-chip-bg: rgba(var(--color-green-primary-rgb), 0.20) !important;
    --wheel-chip-border: rgba(var(--color-green-light-rgb), 0.35) !important;

    --wheel-tab-active-border: rgba(var(--color-green-light-rgb), 0.45) !important;
    --wheel-tab-active-bg: linear-gradient(180deg, var(--color-green-hover), var(--color-green-primary)) !important;
    --wheel-tab-active-shadow: 0 10px 20px rgba(var(--color-green-primary-rgb), 0.35) !important;

    --wheel-card-border: rgba(var(--color-green-primary-rgb), 0.35) !important;
    --wheel-card-bg: linear-gradient(180deg, var(--color-surface-2), var(--color-surface-1)) !important;
    --wheel-card-shadow: 0 16px 32px rgba(0, 0, 0, 0.35) !important;

    --wheel-stage-ring: rgba(255, 255, 255, 0.08) !important;
    --wheel-stage-ring-outer: rgba(255, 255, 255, 0.03) !important;
    --wheel-stage-plate-border: rgba(255, 255, 255, 0.10) !important;
    --wheel-stage-plate-bg: radial-gradient(circle, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.02)) !important;
    --wheel-stage-center-bg: radial-gradient(circle at 50% 35%, rgba(7, 26, 16, 0.92), rgba(4, 13, 8, 0.98)) !important;
    --wheel-stage-center-border: rgba(255, 255, 255, 0.20) !important;
    --wheel-stage-center-ring: rgba(4, 13, 8, 0.62) !important;
    --wheel-stage-center-shadow: 0 10px 24px rgba(0, 0, 0, 0.46) !important;
    --wheel-stage-center-highlight: rgba(255, 255, 255, 0.10) !important;

    --wheel-halo-outer-border: rgba(var(--color-green-light-rgb), 0.32) !important;
    --wheel-halo-inner-border: rgba(var(--color-green-light-rgb), 0.18) !important;
    --wheel-halo-inner-shadow: inset 0 0 45px rgba(var(--color-green-primary-rgb), 0.14) !important;
    --wheel-arrow-shadow: drop-shadow(0 8px 16px rgba(0, 0, 0, 0.46)) !important;

    --wheel-spin-btn-border: rgba(var(--color-green-light-rgb), 0.20) !important;
    --wheel-spin-btn-bg: linear-gradient(180deg, rgba(7, 26, 16, 0.96), rgba(4, 13, 8, 0.98)) !important;
    --wheel-spin-btn-color: rgba(255, 255, 255, 0.92) !important;
    --wheel-spin-btn-shadow: 0 12px 24px rgba(0, 0, 0, 0.36), 0 0 0 1px rgba(var(--color-green-primary-rgb), 0.30), inset 0 1px 0 rgba(255, 255, 255, 0.10) !important;

    --wheel-side-summary-border: rgba(255, 255, 255, 0.07) !important;
    --wheel-side-summary-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.01)) !important;
    --wheel-muted-text: rgba(255, 255, 255, 0.55) !important;
    --wheel-strong-text: #ffffff !important;

    --wheel-status-border: rgba(255, 255, 255, 0.12) !important;
    --wheel-status-bg: rgba(255, 255, 255, 0.04) !important;
    --wheel-status-ready-color: var(--color-green-light) !important;
    --wheel-status-ready-border: rgba(var(--color-green-light-rgb), 0.32) !important;
    --wheel-status-ready-bg: rgba(var(--color-green-primary-rgb), 0.12) !important;
    --wheel-status-passive-color: rgba(255, 255, 255, 0.55) !important;

    --wheel-article-border: rgba(255, 255, 255, 0.07) !important;
    --wheel-article-bg: rgba(255, 255, 255, 0.01) !important;
    --wheel-article-color: rgba(255, 255, 255, 0.85) !important;

    --wheel-result-border: rgba(var(--color-green-light-rgb), 0.20) !important;
    --wheel-result-bg: rgba(var(--color-green-primary-rgb), 0.10) !important;

    --wheel-register-btn-border: rgba(var(--color-green-light-rgb), 0.48) !important;
    --wheel-register-btn-bg: linear-gradient(180deg, var(--color-green-hover), var(--color-green-primary)) !important;
    --wheel-register-btn-color: #ffffff !important;
    --wheel-register-btn-shadow: 0 12px 24px rgba(var(--color-green-primary-rgb), 0.35) !important;
}

.app-mobile-sheet__header {
    padding: 10px 0 6px !important;
}
.app-mobile-sheet__drag {
    width: 42px !important;
    height: 4px !important;
    margin: 0 auto !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, 0.22) !important;
}
.app-mobile-sheet .modal-content,
.app-mobile-sheet .modal-dialog {
    height: 100% !important;
    margin: 0 !important;
    max-width: none !important;
}
.app-mobile-sheet .modal-body {
    padding: 10px 16px 0 !important;
}

.app-mobile-sheet .modal-dialog,
.app-mobile-sheet .modal-content,
.app-mobile-sheet .modal-body,
.app-mobile-sheet .wallet-box,
.app-mobile-sheet .wallet-normal,
.app-mobile-sheet .wallet-body {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
}
.app-mobile-sheet .wallet-box,
.app-mobile-sheet .wallet-normal,
.app-mobile-sheet .wallet-body {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.react-modal-sheet-content-scroller {
    padding-bottom: calc(76px + env(safe-area-inset-bottom, 0px)) !important;
    touch-action: pan-y !important;
    overscroll-behavior: contain !important;
}

.app-mobile-sheet .wallet-normal .wallet-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    margin: 6px 0 14px !important;
}
.app-mobile-sheet .wallet-normal .wallet-header .title span {
    color: #ffffff !important;
    font-family: var(--font-family-bold), sans-serif !important;
    font-size: 20px !important;
    font-weight: 800 !important;
}
.app-mobile-sheet .wallet-header .close-modal button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 38px !important;
    height: 38px !important;
    flex-shrink: 0 !important;
    padding: 0 !important;
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 999px !important;
    cursor: pointer !important;
    transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease !important;
}
.app-mobile-sheet .wallet-header .close-modal button:hover {
    background: rgba(var(--danger-rgb), 0.18) !important;
    border-color: rgba(var(--danger-rgb), 0.5) !important;
    transform: rotate(90deg) !important;
}
.app-mobile-sheet .wallet-header .close-modal button img {
    width: 15px !important;
    height: 15px !important;
    filter: brightness(0) invert(1) !important;
    opacity: 0.8 !important;
}

.bonus-request-grid {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    margin-top: 16px !important;
}

@media (min-width: 768px) {
    .bonus-request-grid {
        display: grid !important;
        grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)) !important;
        align-items: start !important;
        gap: 14px !important;
    }
}

@media (min-width: 1200px) {
    .bonus-request-grid {
        grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)) !important;
        gap: 18px !important;
    }
    .bonus-request-actions {
        gap: 10px !important;
        padding: 14px 16px 16px !important;
    }
    .bonus-request-title {
        font-size: 15px !important;
    }
    .bonus-request-btn {
        height: 42px !important;
        font-size: 13.5px !important;
        border-radius: 10px !important;
    }
    .bonus-request-info {
        width: 28px !important;
        height: 28px !important;
        font-size: 13px !important;
    }
}

.bonus-request-card {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    background: linear-gradient(180deg, var(--color-surface-2) 0%, var(--color-surface-1) 100%) !important;
    border: 1px solid var(--surface-border-soft) !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.35) !important;
    transition: border-color 0.22s ease, transform 0.22s ease, box-shadow 0.22s ease !important;
}
.bonus-request-card:hover {
    border-color: rgba(var(--color-green-light-rgb), 0.5) !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 16px 32px rgba(0, 0, 0, 0.5), 0 0 24px rgba(var(--color-green-primary-rgb), 0.18) !important;
}
.bonus-request-preview {
    display: block !important;
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
    cursor: pointer !important;
    width: 100% !important;
    font-size: 0 !important;
    line-height: 0 !important;
}
.bonus-request-imageWrap {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    font-size: 0 !important;
    line-height: 0 !important;
    overflow: hidden !important;
    background: transparent !important;
}
.bonus-request-imageWrap img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    transition: transform 0.3s ease !important;
}
.bonus-request-card:hover .bonus-request-imageWrap img {
    transform: scale(1.05) !important;
}
.bonus-request-actions {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    padding: 10px 12px 12px !important;
}
.bonus-request-info {
    position: absolute !important;
    top: 8px !important;
    right: 8px !important;
    z-index: 2 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 24px !important;
    height: 24px !important;
    padding: 0 !important;
    background: rgba(1, 13, 8, 0.7) !important;
    border: 1px solid rgba(var(--color-green-light-rgb), 0.4) !important;
    border-radius: 999px !important;
    color: #ffffff !important;
    font-family: var(--font-family-bold), sans-serif !important;
    font-size: 12px !important;
    line-height: 1 !important;
    cursor: pointer !important;
    -webkit-backdrop-filter: blur(4px) !important;
    backdrop-filter: blur(4px) !important;
    transition: background 0.2s ease, border-color 0.2s ease !important;
}
.bonus-request-info:hover {
    background: rgba(var(--color-green-primary-rgb), 0.75) !important;
    border-color: var(--color-green-light) !important;
}
.bonus-request-title {
    margin: 0 !important;
    color: #ffffff !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
}
.bonus-request-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 36px !important;
    padding: 0 12px !important;
    background: linear-gradient(180deg, var(--color-green-hover), var(--color-green-primary)) !important;
    border: 1px solid rgba(var(--color-green-light-rgb), 0.45) !important;
    border-radius: 9px !important;
    color: #ffffff !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 12.5px !important;
    cursor: pointer !important;
    box-shadow: 0 6px 16px rgba(var(--color-green-primary-rgb), 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
    transition: filter 0.2s ease, box-shadow 0.2s ease !important;
}
.bonus-request-btn:hover {
    filter: brightness(1.1) !important;
    box-shadow: 0 8px 20px rgba(var(--color-green-primary-rgb), 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.14) !important;
}

.vip-welcome-tab__body {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    margin-top: 16px !important;
}
.vip-welcome-tab__card {
    background: linear-gradient(180deg, var(--color-surface-2) 0%, var(--color-surface-1) 100%) !important;
    border: 1px solid var(--surface-border-soft) !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3) !important;
    transition: border-color 0.2s ease !important;
}
.vip-welcome-tab__card:hover {
    border-color: rgba(var(--color-green-light-rgb), 0.35) !important;
}
.vip-welcome-tab__row-btn {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 12px 14px !important;
}
.vip-welcome-tab__icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 46px !important;
    flex-shrink: 0 !important;
}
.vip-welcome-tab__icon svg {
    width: 46px !important;
    height: auto !important;
    filter: hue-rotate(-85deg) saturate(1.05) !important;
}
.vip-welcome-tab__text {
    flex: 1 !important;
    min-width: 0 !important;
}
.vip-welcome-tab__title {
    color: #ffffff !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 14px !important;
    font-weight: 700 !important;
}
.vip-welcome-tab__sub {
    color: rgba(255, 255, 255, 0.55) !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
    margin-top: 2px !important;
}
.vip-welcome-tab__right svg path {
    stroke: rgba(var(--color-green-light-rgb), 0.85) !important;
}
.vip-welcome-tab__panel-text {
    color: rgba(255, 255, 255, 0.7) !important;
    font-size: 12.5px !important;
    line-height: 1.5 !important;
}

.benefits__accordion {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    margin-top: 16px !important;
}
.benefits__card {
    background: linear-gradient(180deg, var(--color-surface-2) 0%, var(--color-surface-1) 100%) !important;
    border: 1px solid var(--surface-border-soft) !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
}
.benefits__card:hover {
    border-color: rgba(var(--color-green-light-rgb), 0.4) !important;
}
.benefits__header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    width: 100% !important;
    padding: 12px 14px !important;
    background: transparent !important;
    border: 0 !important;
    cursor: pointer !important;
}
.benefits__left {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    min-width: 0 !important;
}
.benefits__iconBox {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 40px !important;
    height: 40px !important;
    flex-shrink: 0 !important;
    border-radius: 10px !important;
    background: rgba(var(--color-green-primary-rgb), 0.18) !important;
    border: 1px solid rgba(var(--color-green-light-rgb), 0.22) !important;
}
.benefits__iconImg {
    width: 26px !important;
    height: 26px !important;
    object-fit: contain !important;
}
.benefits__title {
    color: #ffffff !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 14px !important;
    font-weight: 700 !important;
}
.benefits__chev {
    flex-shrink: 0 !important;
    color: rgba(255, 255, 255, 0.5) !important;
    transition: transform 0.25s ease, color 0.2s ease !important;
}
.benefits__header[aria-expanded="true"] .benefits__chev {
    transform: rotate(180deg) !important;
    color: var(--color-green-light) !important;
}
.benefits__header[aria-expanded="true"] .benefits__iconBox {
    background: rgba(var(--color-green-primary-rgb), 0.35) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.5) !important;
}
.benefits__body {
    padding: 4px 14px 14px !important;
}
.benefits__cta {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 44px !important;
    margin-top: 12px !important;
    background: rgba(var(--color-green-primary-rgb), 0.18) !important;
    border: 1px solid rgba(var(--color-green-light-rgb), 0.35) !important;
    border-radius: 10px !important;
    color: var(--color-green-light) !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 13.5px !important;
    cursor: pointer !important;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease !important;
}
.benefits__cta:hover {
    background: linear-gradient(180deg, var(--color-green-hover), var(--color-green-primary)) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.6) !important;
    color: #ffffff !important;
}

.vip-code-tab {
    margin-top: 16px !important;
}
.vip-code-card {
    background: linear-gradient(180deg, var(--color-surface-2) 0%, var(--color-surface-1) 100%) !important;
    border: 1px solid var(--surface-border-soft) !important;
    border-radius: 14px !important;
    padding: 16px !important;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.32) !important;
}
.vip-code-card__desc {
    color: rgba(255, 255, 255, 0.7) !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
    margin-bottom: 12px !important;
}
.vip-code-card__field-wrap {
    display: flex !important;
}
.vip-code-card__input {
    width: 100% !important;
    height: 48px !important;
    padding: 0 14px !important;
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 10px !important;
    color: #ffffff !important;
    font-size: 14px !important;
    letter-spacing: 0.04em !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    transition: background 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease !important;
}
.vip-code-card__input::placeholder {
    color: rgba(255, 255, 255, 0.35) !important;
    letter-spacing: normal !important;
}
.vip-code-card__input:focus {
    background: rgba(var(--color-green-primary-rgb), 0.1) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.55) !important;
    box-shadow: 0 0 0 3px rgba(var(--color-green-light-rgb), 0.14) !important;
    outline: none !important;
}
.vip-code-tab .common-form-button {
    margin-top: 14px !important;
}
.vip-code-tab .common-form-button .button {
    width: 100% !important;
    min-height: 48px !important;
    border-radius: 12px !important;
}

main#main.providers-page .provider-follow-bar {
    background:
        radial-gradient(circle at 88% 12%, rgba(var(--color-green-primary-rgb), 0.30) 0%, rgba(var(--color-green-primary-rgb), 0.04) 30%, transparent 44%),
        radial-gradient(circle at 8% 100%, rgba(var(--color-green-light-rgb), 0.16) 0%, transparent 36%),
        linear-gradient(180deg, #0c2418 0%, #040d08 100%) !important;
    border: 1px solid rgba(var(--color-green-primary-rgb), 0.5) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), inset 0 -1px 0 rgba(var(--color-green-light-rgb), 0.1), 0 14px 34px rgba(0, 0, 0, 0.4) !important;
}

main#main.providers-page .provider-follow-bar::before {
    background:
        linear-gradient(120deg, rgba(255, 255, 255, 0.05) 0%, transparent 35%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.03) 0%, transparent 22%) !important;
}

main#main.providers-page .provider-follow-bar__badge {
    color: #eef7f0 !important;
    background: rgba(4, 13, 8, 0.7) !important;
    border: 1px solid rgba(var(--color-green-light-rgb), 0.32) !important;
}

main#main.providers-page .provider-follow-bar__signal {
    color: rgba(232, 244, 236, 0.92) !important;
    background: rgba(7, 26, 16, 0.62) !important;
    border: 1px solid rgba(255, 255, 255, 0.09) !important;
}

main#main.providers-page .provider-follow-bar__signal.is-active {
    background: rgba(14, 40, 29, 0.55) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.32) !important;
}

main#main.providers-page .provider-follow-bar__logoBox {
    background:
        radial-gradient(circle at 50% 20%, rgba(var(--color-green-light-rgb), 0.28) 0%, transparent 55%),
        linear-gradient(180deg, rgba(16, 180, 97, 0.16) 0%, rgba(2, 83, 40, 0.28) 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.09) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), inset 0 0 40px rgba(var(--color-green-primary-rgb), 0.1), 0 8px 16px rgba(0, 0, 0, 0.24) !important;
}

main#main.providers-page .provider-follow-bar__lead {
    color: rgba(219, 240, 228, 0.82) !important;
}

main#main.providers-page .provider-follow-bar__stat {
    background: linear-gradient(180deg, #0a1f14 0%, #040d08 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), inset 0 0 30px rgba(var(--color-green-primary-rgb), 0.08), 0 4px 12px rgba(0, 0, 0, 0.2) !important;
}

main#main.providers-page .provider-follow-bar__stat span {
    color: rgba(181, 205, 190, 0.9) !important;
}

main#main.providers-page .provider-follow-bar__benefit {
    color: rgba(238, 247, 240, 0.96) !important;
    background: rgba(4, 13, 8, 0.62) !important;
    border: 1px solid rgba(var(--color-green-primary-rgb), 0.5) !important;
}

main#main.providers-page .provider-follow-bar__cta {
    background: linear-gradient(180deg, rgba(7, 26, 16, 0.75) 0%, rgba(4, 13, 8, 0.85) 100%) !important;
    border: 1px solid rgba(var(--color-green-primary-rgb), 0.4) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 8px 16px rgba(0, 0, 0, 0.2) !important;
}

main#main.providers-page .provider-follow-bar__ctaText span {
    color: rgba(193, 219, 203, 0.9) !important;
}

main#main.providers-page .provider-follow-bar__button {
    background: linear-gradient(180deg, var(--color-green-hover) 0%, var(--color-green-primary) 100%) !important;
    border: 1px solid rgba(var(--color-green-light-rgb), 0.5) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 8px 18px rgba(var(--color-green-primary-rgb), 0.35) !important;
}

main#main.providers-page .provider-follow-bar__button:hover:not(:disabled) {
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18), 0 10px 22px rgba(var(--color-green-primary-rgb), 0.45) !important;
}

main#main.providers-page .provider-follow-bar__button.is-active {
    background: linear-gradient(180deg, var(--color-green-light) 0%, var(--color-green-hover) 100%) !important;
    border-color: rgba(var(--color-green-bright-rgb), 0.5) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 8px 18px rgba(var(--color-green-primary-rgb), 0.3) !important;
}

main#main.providers-page .provider-premium-showcase {
    background:
        radial-gradient(circle at 90% 0, rgba(var(--color-green-primary-rgb), 0.3) 0%, transparent 30%),
        linear-gradient(180deg, #0c2418 0%, #040d08 100%) !important;
    border: 1px solid rgba(var(--color-green-primary-rgb), 0.4) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 18px 40px rgba(0, 0, 0, 0.34) !important;
}

main#main.providers-page .provider-premium-showcase__eyebrow {
    color: rgba(212, 240, 224, 0.9) !important;
    background: rgba(7, 26, 16, 0.78) !important;
    border: 1px solid rgba(255, 255, 255, 0.09) !important;
}

main#main.providers-page .provider-premium-showcase__desc {
    color: rgba(201, 224, 210, 0.85) !important;
}

main#main.providers-page .provider-premium-showcase__chip {
    color: #edfff5 !important;
    background: rgba(4, 13, 8, 0.72) !important;
    border: 1px solid rgba(var(--color-green-light-rgb), 0.28) !important;
}

main#main.providers-page .provider-premium-card {
    background: linear-gradient(180deg, #0a1f14 0%, #040d08 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.09) !important;
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.4) !important;
}

main#main.providers-page .provider-premium-card__copy span {
    color: rgba(220, 233, 224, 0.88) !important;
}

main#main.providers-page .provider-premium-card__kicker {
    color: rgba(255, 255, 255, 0.92) !important;
    background: rgba(4, 13, 8, 0.68) !important;
    border: 1px solid rgba(var(--color-green-light-rgb), 0.24) !important;
}

main#main.providers-page .provider-premium-showcase__summaryCard {
    background: linear-gradient(180deg, #0a1f14 0%, #040d08 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

main#main.providers-page .provider-premium-showcase__summaryLabel {
    color: rgba(180, 205, 190, 0.85) !important;
}

main#main.providers-page .provider-premium-showcase__summaryText {
    color: rgba(204, 220, 210, 0.86) !important;
}

.provider-carousel .provider-box .provider-item,
.provider-carousel .provider-box a.provider-item {
    display: flex !important;
    align-items: stretch !important;
    justify-content: center !important;
    min-height: 104px !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}

.provider-carousel .provider-box .provider-item figure.image {
    width: 100% !important;
    height: auto !important;
    min-height: 104px !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.provider-carousel .provider-box .provider-item figure.image img {
    width: auto !important;
    height: auto !important;
    max-width: 62% !important;
    max-height: 56% !important;
    object-fit: contain !important;
}

@media (max-width: 767px) {
    .provider-carousel .provider-box .provider-item,
    .provider-carousel .provider-box a.provider-item {
        min-height: 88px !important;
    }
    .provider-carousel .provider-box .provider-item figure.image {
        min-height: 88px !important;
    }
}

header#header div.middle-header div.middle-header-container div.header-buttons {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.current-wallet {
    display: inline-flex !important;
    align-items: center !important;
    gap: 2px !important;
    height: 42px !important;
    min-width: 0 !important;
    width: auto !important;
    padding: 3px !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.07) 0%, rgba(255, 255, 255, 0.025) 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 11px !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 6px 16px rgba(0, 0, 0, 0.3) !important;
    box-sizing: border-box !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.current-wallet div.balance {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    height: 100% !important;
    padding: 0 8px 0 4px !important;
    border-radius: 10px !important;
    cursor: pointer !important;
    transition: background 0.2s ease !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.current-wallet div.balance:hover {
    /* background: rgba(255, 255, 255, 0.05) !important; */
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.current-wallet div.balance div.icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 24px !important;
    height: 24px !important;
    flex: 0 0 24px !important;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, 0.05) !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06) !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.current-wallet div.balance div.icon img {
    width: 16px !important;
    height: 16px !important;
    display: block !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.current-wallet div.balance div.money {
    color: #ffffff !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 12.5px !important;
    font-weight: 700 !important;
    letter-spacing: 0.01em !important;
    font-variant-numeric: tabular-nums !important;
    white-space: nowrap !important;
    line-height: 1 !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.current-wallet div.balance div.down {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 14px !important;
    height: 14px !important;
    flex: 0 0 14px !important;
    opacity: 0.6 !important;
    transition: opacity 0.2s ease, transform 0.25s ease !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.current-wallet div.balance div.down img {
    width: 10px !important;
    height: auto !important;
    display: block !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.current-wallet div.balance:hover div.down {
    opacity: 1 !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.current-wallet a.wallet-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    height: 100% !important;
    min-width: 0 !important;
    padding: 0 12px !important;
    border-radius: 9px !important;
    background: linear-gradient(160deg, var(--color-green-light) 0%, var(--color-green-hover) 48%, var(--color-green-primary) 100%) !important;
    border: 1px solid rgba(var(--color-green-bright-rgb), 0.5) !important;
    color: #ffffff !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: 0.01em !important;
    white-space: nowrap !important;
    text-decoration: none !important;
    box-shadow: 0 6px 16px rgba(var(--color-green-primary-rgb), 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.2) !important;
    transition: filter 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.current-wallet a.wallet-button::before {
    content: "" !important;
    width: 13px !important;
    height: 13px !important;
    flex: 0 0 13px !important;
    background-color: currentColor !important;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 7V5a2 2 0 0 0-2-2H5a2 2 0 0 0 0 4h14a2 2 0 0 1 2 2v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5'/%3E%3Cpath d='M18 12a1 1 0 0 0 0 2h3v-2h-3z'/%3E%3C/svg%3E") center / contain no-repeat !important;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 7V5a2 2 0 0 0-2-2H5a2 2 0 0 0 0 4h14a2 2 0 0 1 2 2v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5'/%3E%3Cpath d='M18 12a1 1 0 0 0 0 2h3v-2h-3z'/%3E%3C/svg%3E") center / contain no-repeat !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.current-wallet a.wallet-button:hover {
    filter: brightness(1.08) !important;
    box-shadow: 0 8px 20px rgba(var(--color-green-primary-rgb), 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.24) !important;
    transform: translateY(-1px) !important;
    color: #ffffff !important;
    border-color: rgba(var(--color-green-bright-rgb), 0.5) !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.current-wallet a.wallet-button:active {
    transform: translateY(0) scale(0.98) !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.user-menu div.user-info button.user-only-icon,
header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons button.header__chat,
header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.current-notifications {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 42px !important;
    height: 42px !important;
    padding: 0 !important;
    border-radius: 12px !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.07) 0%, rgba(255, 255, 255, 0.025) 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
    color: #ffffff !important;
    cursor: pointer !important;
    box-sizing: border-box !important;
    transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.user-menu div.user-info button.user-only-icon:hover,
header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons button.header__chat:hover,
header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.current-notifications:hover {
    background: rgba(var(--color-green-primary-rgb), 0.22) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.5) !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.07) !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.user-menu div.user-info button.user-only-icon[aria-expanded="true"],
header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.current-notifications[aria-expanded="true"] {
    background: rgba(var(--color-green-primary-rgb), 0.3) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.6) !important;
    box-shadow: 0 0 0 1px rgba(var(--color-green-light-rgb), 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons button.user-only-icon svg,
header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons button.header__chat svg,
header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.current-notifications svg {
    width: 20px !important;
    height: 20px !important;
    display: block !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.current-notifications span.icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 0 !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.current-notifications span.count {
    position: absolute !important;
    top: 6px !important;
    right: 6px !important;
    transform: translate(45%, -45%) !important;
    min-width: 16px !important;
    height: 16px !important;
    padding: 0 4px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: var(--color-green-hover) !important;
    border: 2px solid var(--color-bg-tinted) !important;
    border-radius: 999px !important;
    color: #ffffff !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4) !important;
    pointer-events: none !important;
}

@media (max-width: 767px) {
    header#header div.middle-header div.middle-header-container div.header-buttons {
        gap: 7px !important;
    }
    header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.current-wallet {
        height: 38px !important;
        gap: 2px !important;
        border-radius: 10px !important;
    }
    header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.current-wallet div.balance {
        gap: 5px !important;
        padding: 0 7px 0 4px !important;
    }
    header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.current-wallet div.balance div.icon {
        width: 22px !important;
        height: 22px !important;
        flex: 0 0 22px !important;
    }
    header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.current-wallet div.balance div.money {
        font-size: 12.5px !important;
    }
    header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.current-wallet a.wallet-button {
        padding: 0 10px !important;
        font-size: 11.5px !important;
    }
    header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons {
        gap: 6px !important;
    }
    header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.user-menu div.user-info button.user-only-icon,
    header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons button.header__chat,
    header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.current-notifications {
        width: 38px !important;
        height: 38px !important;
        border-radius: 10px !important;
    }
}

@media (max-width: 991px) {
    header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.current-wallet {
        height: 36px !important;
        gap: 2px !important;
    }
    header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.current-wallet div.balance {
        gap: 5px !important;
        padding: 0 6px 0 4px !important;
    }
    header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.current-wallet div.balance div.money {
        font-size: 12px !important;
    }
    header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.current-wallet a.wallet-button {
        font-size: 0 !important;
        gap: 0 !important;
        padding: 0 9px !important;
    }
    header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.current-wallet a.wallet-button::before {
        margin: 0 !important;
    }
}

@media (max-width: 480px) {
    header#header div.middle-header div.middle-header-container div.header-buttons {
        gap: 6px !important;
    }
    header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.current-wallet {
        height: 36px !important;
    }
    header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.current-wallet div.balance div.money {
        font-size: 12px !important;
        padding: 0 !important;
    }
    header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.current-wallet a.wallet-button {
        font-size: 0 !important;
        gap: 0 !important;
        padding: 0 10px !important;
    }
    header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.current-wallet a.wallet-button::before {
        margin: 0 !important;
    }
    header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.user-menu div.user-info button.user-only-icon,
    header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons button.header__chat,
    header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.current-notifications {
        width: 36px !important;
        height: 36px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.current-wallet a.wallet-button,
    header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.current-wallet div.balance,
    header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.user-menu div.user-info button.user-only-icon,
    header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons button.header__chat,
    header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.current-notifications {
        transition: none !important;
    }
    header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.current-wallet a.wallet-button:hover,
    header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons button.user-only-icon:hover,
    header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons button.header__chat:hover,
    header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.current-notifications:hover {
        transform: none !important;
    }
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.opener-wallet {
    padding: 10px !important;
    width: 264px !important;
    max-width: 84vw !important;
    background: linear-gradient(180deg, rgba(7, 26, 16, 0.98) 0%, rgba(3, 10, 6, 0.99) 100%) !important;
    border: 1px solid rgba(var(--color-green-primary-rgb), 0.5) !important;
    border-radius: 14px !important;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
    box-sizing: border-box !important;
    -webkit-backdrop-filter: blur(10px) !important;
    backdrop-filter: blur(10px) !important;
    z-index: 120 !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.opener-wallet div.coins-list form.coin-search {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    height: 42px !important;
    margin: 0 0 8px !important;
    padding: 0 12px !important;
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(255, 255, 255, 0.09) !important;
    border-radius: 10px !important;
    transition: border-color 0.18s ease, box-shadow 0.18s ease !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.opener-wallet div.coins-list form.coin-search:focus-within {
    border-color: rgba(var(--color-green-light-rgb), 0.55) !important;
    box-shadow: 0 0 0 3px rgba(var(--color-green-light-rgb), 0.14) !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.opener-wallet div.coins-list form.coin-search button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
    padding: 0 !important;
    background: none !important;
    border: 0 !important;
    box-shadow: none !important;
    cursor: pointer !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.opener-wallet div.coins-list form.coin-search button span[role="presentation"] {
    color: rgba(255, 255, 255, 0.45) !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.opener-wallet div.coins-list form.coin-search input {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    height: 100% !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    color: #ffffff !important;
    font-size: 13.5px !important;
    font-family: var(--font-family-medium), sans-serif !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.opener-wallet div.coins-list form.coin-search input::placeholder {
    color: rgba(255, 255, 255, 0.4) !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.opener-wallet div.coins-list div.list {
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
    max-height: 264px !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    padding-right: 2px !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.opener-wallet div.coins-list div.list::-webkit-scrollbar {
    width: 4px !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.opener-wallet div.coins-list div.list::-webkit-scrollbar-thumb {
    background: rgba(var(--color-green-light-rgb), 0.35) !important;
    border-radius: 999px !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.opener-wallet div.coins-list div.list span.coin {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    padding: 8px 10px !important;
    border-radius: 9px !important;
    cursor: pointer !important;
    transition: background 0.16s ease !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.opener-wallet div.coins-list div.list span.coin:hover {
    background: rgba(var(--color-green-primary-rgb), 0.2) !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.opener-wallet div.coins-list div.list span.coin span.details {
    display: inline-flex !important;
    align-items: center !important;
    flex-direction: row-reverse !important;
    gap: 9px !important;
    order: -1 !important;
    min-width: 0 !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.opener-wallet div.coins-list div.list span.coin span.details span.icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 26px !important;
    height: 26px !important;
    flex: 0 0 26px !important;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, 0.05) !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06) !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.opener-wallet div.coins-list div.list span.coin span.details span.icon img {
    width: 18px !important;
    height: 18px !important;
    display: block !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.opener-wallet div.coins-list div.list span.coin span.details span.code {
    color: #ffffff !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 13px !important;
    letter-spacing: 0.02em !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.opener-wallet div.coins-list div.list span.coin span.balance {
    color: rgba(255, 255, 255, 0.65) !important;
    font-size: 12.5px !important;
    font-variant-numeric: tabular-nums !important;
    white-space: nowrap !important;
    flex: 0 0 auto !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.opener-wallet div.coins-list div.list span.coin:hover span.balance {
    color: #ffffff !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.opener-wallet a.setting-button {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin-top: 8px !important;
    padding: 11px 12px !important;
    border: 0 !important;
    border-top: none !important;
    border-radius: 10px !important;
    background: rgba(255, 255, 255, 0.04) !important;
    color: rgba(255, 255, 255, 0.85) !important;
    text-decoration: none !important;
    transition: background 0.18s ease, color 0.18s ease !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.opener-wallet a.setting-button:hover {
    background: rgba(var(--color-green-primary-rgb), 0.24) !important;
    color: #ffffff !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.opener-wallet a.setting-button span.icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.opener-wallet a.setting-button span.icon img {
    width: 18px !important;
    height: 18px !important;
    display: block !important;
    filter: brightness(0) invert(1) !important;
    opacity: 0.8 !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.wallet-menu div.opener-wallet a.setting-button span.text {
    color: inherit !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 13px !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons button.cb-hbmore {
    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    width: 42px;
    height: 42px;
    padding: 0;
    border-radius: 12px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.07) 0%, rgba(255, 255, 255, 0.025) 100%);
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
    color: #ffffff;
    cursor: pointer;
    box-sizing: border-box;
    transition: background 0.2s ease, border-color 0.2s ease;
}

header#header div.middle-header div.middle-header-container div.header-buttons button.cb-hbmore span {
    display: block;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #ffffff;
}

header#header div.middle-header div.middle-header-container div.header-buttons.cb-more-open button.cb-hbmore {
    background: rgba(var(--color-green-primary-rgb), 0.3);
    border-color: rgba(var(--color-green-light-rgb), 0.6);
    box-shadow: 0 0 0 1px rgba(var(--color-green-light-rgb), 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

@media (max-width: 1200px) {
    header#header div.middle-header div.middle-header-container div.header-buttons {
        position: relative !important;
    }

    header#header div.middle-header div.middle-header-container div.header-buttons button.cb-hbmore {
        display: inline-flex !important;
        width: 38px !important;
        height: 38px !important;
        border-radius: 10px !important;
    }

    header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons {
        position: absolute !important;
        top: calc(100% + 10px) !important;
        right: 0 !important;
        flex-direction: column !important;
        gap: 8px !important;
        padding: 8px !important;
        border-radius: 14px !important;
        background: linear-gradient(180deg, rgba(7, 26, 16, 0.98) 0%, rgba(3, 10, 6, 0.99) 100%) !important;
        border: 1px solid rgba(var(--color-green-primary-rgb), 0.5) !important;
        box-shadow: 0 20px 50px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
        -webkit-backdrop-filter: blur(10px) !important;
        backdrop-filter: blur(10px) !important;
        opacity: 0 !important;
        visibility: hidden !important;
        transform: translateY(-6px) !important;
        transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s !important;
        z-index: 200 !important;
    }

    header#header div.middle-header div.middle-header-container div.header-buttons.cb-more-open div.header-minified-buttons {
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
    }
}

@media (max-width: 480px) {
    header#header div.middle-header div.middle-header-container div.header-buttons button.cb-hbmore {
        width: 36px !important;
        height: 36px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    header#header div.middle-header div.middle-header-container div.header-buttons button.cb-hbmore {
        transition: none !important;
    }
    header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons {
        transition: none !important;
    }
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.user-menu,
header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box {
    position: relative !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.user-menu div.user-menus {
    top: calc(100% + 12px) !important;
    right: 0 !important;
    left: auto !important;
    min-width: 250px !important;
    padding: 8px !important;
    background: linear-gradient(180deg, rgba(7, 26, 16, 0.98) 0%, rgba(3, 10, 6, 0.99) 100%) !important;
    border: 1px solid rgba(var(--color-green-primary-rgb), 0.5) !important;
    border-radius: 16px !important;
    box-shadow: 0 24px 54px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    backdrop-filter: blur(12px) !important;
    overflow: hidden !important;
    z-index: 210 !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.user-menu div.user-menus:before,
header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.user-menu div.user-menus:after {
    display: none !important;
    content: none !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.user-menu div.user-menus ul {
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
    padding-right: 2px !important;
    margin: 0 !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.user-menu div.user-menus ul li {
    margin-bottom: 0 !important;
    list-style: none !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.user-menu div.user-menus ul li > div {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 10px 12px !important;
    border-radius: 10px !important;
    color: rgba(255, 255, 255, 0.82) !important;
    font-family: var(--font-family-medium), sans-serif !important;
    font-size: 13.5px !important;
    cursor: pointer !important;
    transition: background 0.18s ease, color 0.18s ease, padding-left 0.18s ease, box-shadow 0.18s ease !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.user-menu div.user-menus ul li > div:hover {
    background: rgba(var(--color-green-primary-rgb), 0.22) !important;
    color: #ffffff !important;
    padding-left: 16px !important;
    box-shadow: inset 3px 0 0 rgba(var(--color-green-light-rgb), 0.7) !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.user-menu div.user-menus ul li > div span.icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 20px !important;
    height: 20px !important;
    flex: 0 0 20px !important;
    line-height: 0 !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.user-menu div.user-menus ul li > div span.icon svg {
    width: 18px !important;
    height: 18px !important;
    color: rgba(var(--color-green-light-rgb), 0.7) !important;
    transition: color 0.18s ease !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.user-menu div.user-menus ul li > div:hover span.icon {
    filter: none !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.user-menu div.user-menus ul li > div:hover span.icon svg {
    color: var(--color-green-bright) !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.user-menu div.user-menus ul li > div span.text {
    flex: 1 !important;
    color: inherit !important;
    font-family: var(--font-family-medium), sans-serif !important;
    -webkit-text-fill-color: currentColor !important;
    background: none !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.user-menu div.user-menus ul li:last-child {
    margin-top: 4px !important;
    padding-top: 4px !important;
    border-top: 1px solid rgba(var(--color-green-primary-rgb), 0.28) !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.user-menu div.user-menus ul li:last-child > div {
    color: rgba(255, 83, 101, 0.9) !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.user-menu div.user-menus ul li:last-child > div span.text {
    -webkit-text-fill-color: currentColor !important;
    background: none !important;
    color: inherit !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.user-menu div.user-menus ul li:last-child > div span.icon svg {
    color: rgba(255, 83, 101, 0.7) !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.user-menu div.user-menus ul li:last-child > div:hover {
    background: rgba(255, 83, 101, 0.12) !important;
    color: #ff7a8a !important;
    box-shadow: inset 3px 0 0 rgba(255, 83, 101, 0.7) !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.user-menu div.user-menus ul li:last-child > div:hover span.icon svg {
    color: #ff7a8a !important;
}

@keyframes cbHeaderDropIn {
    from { opacity: 0; transform: translateY(-8px); }
    to   { opacity: 1; transform: translateY(0); }
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.user-menu[data-open="1"] div.user-menus {
    animation: cbHeaderDropIn 0.22s cubic-bezier(.2, .9, .2, 1) both !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.list-notifications {
    top: calc(100% + 12px) !important;
    right: 0 !important;
    left: auto !important;
    min-width: 344px !important;
    max-width: min(92vw, 380px) !important;
    padding: 12px !important;
    max-height: 442px !important;
    background: linear-gradient(180deg, rgba(7, 26, 16, 0.98) 0%, rgba(3, 10, 6, 0.99) 100%) !important;
    border: 1px solid rgba(var(--color-green-primary-rgb), 0.5) !important;
    border-radius: 16px !important;
    box-shadow: 0 24px 54px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    backdrop-filter: blur(12px) !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    z-index: 210 !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.list-notifications div.list-header {
    margin-bottom: 10px !important;
    padding: 0 4px 10px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.07) !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.list-notifications div.list-header div.header-title {
    color: #ffffff !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 16px !important;
    line-height: 1.1 !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.list-notifications div.list-header button.mark-all-read {
    padding: 6px 12px !important;
    border-radius: 999px !important;
    background: rgba(var(--color-green-primary-rgb), 0.2) !important;
    border: 1px solid rgba(var(--color-green-light-rgb), 0.35) !important;
    color: var(--color-green-light) !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 12px !important;
    line-height: 1 !important;
    cursor: pointer !important;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.list-notifications div.list-header button.mark-all-read:hover:not(:disabled) {
    background: linear-gradient(180deg, var(--color-green-hover), var(--color-green-primary)) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.6) !important;
    color: #ffffff !important;
    transform: translateY(-1px) !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.list-notifications div.list-header button.mark-all-read:disabled {
    opacity: 0.5 !important;
    cursor: default !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.list-notifications div.list-listing {
    padding: 0 2px !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.list-notifications div.list-listing div.notification-block {
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
    border-radius: 12px !important;
    padding: 10px 12px !important;
    margin-bottom: 8px !important;
    transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.list-notifications div.list-listing div.notification-block:hover {
    background: rgba(var(--color-green-primary-rgb), 0.12) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.35) !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3), inset 3px 0 0 rgba(var(--color-green-light-rgb), 0.6) !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.list-notifications div.list-listing div.notification-block div.icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 34px !important;
    height: 34px !important;
    flex: 0 0 34px !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    vertical-align: middle !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.list-notifications div.list-listing div.notification-block div.icon:has(img) {
    background: rgba(var(--color-green-primary-rgb), 0.16) !important;
    border: 1px solid rgba(var(--color-green-light-rgb), 0.22) !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.list-notifications div.list-listing div.notification-block div.icon img {
    width: 18px !important;
    height: 18px !important;
    object-fit: contain !important;
    filter: brightness(0) invert(1) !important;
    opacity: 0.9 !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.list-notifications div.list-listing div.notification-block div.details {
    width: calc(100% - 34px) !important;
    padding-left: 12px !important;
    vertical-align: middle !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.list-notifications div.list-listing div.notification-block.notification-block--message div.icon {
    flex: 0 0 34px !important;
    margin-top: 2px !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.list-notifications div.list-listing div.notification-block.notification-block--message div.details {
    width: auto !important;
    padding-left: 0 !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.list-notifications div.list-listing div.notification-block div.details div.title {
    color: #ffffff !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 13.5px !important;
    margin-bottom: 3px !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.list-notifications div.list-listing div.notification-block div.details div.desc {
    color: rgba(255, 255, 255, 0.62) !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.list-notifications div.list-listing div.notification-block div.details div.desc.desc-html a {
    color: var(--color-green-light) !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.list-notifications div.list-listing div.notification-block div.details div.desc.desc-html p {
    margin: 0 !important;
    font-size: 0 !important;
    line-height: 0 !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.list-notifications div.list-listing div.notification-block.notification-block--message {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: flex-start !important;
    column-gap: 12px !important;
    row-gap: 0 !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.list-notifications div.list-listing div.notification-block.notification-block--message div.details {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    width: auto !important;
    padding-left: 0 !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.list-notifications div.list-listing div.notification-block.notification-block--message div.details div.title {
    min-height: 34px !important;
    display: flex !important;
    align-items: center !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.list-notifications div.list-listing div.notification-block.notification-block--message div.details div.desc.desc-html {
    overflow: visible !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.list-notifications div.list-listing div.notification-block div.details div.desc.desc-html img {
    display: block !important;
    width: calc(100% + 46px) !important;
    max-width: none !important;
    margin: 8px 0 2px -46px !important;
    aspect-ratio: 800 / 460 !important;
    height: auto !important;
    object-fit: cover !important;
    object-position: center !important;
    border-radius: 10px !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    background: var(--color-surface-1) !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.list-notifications div.list-listing div.notification-block.unread {
    background: rgba(var(--color-green-primary-rgb), 0.14) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.3) !important;
    box-shadow: inset 3px 0 0 rgba(var(--color-green-light-rgb), 0.7) !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.list-notifications div.list-no-data {
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px dashed rgba(255, 255, 255, 0.12) !important;
    border-radius: 12px !important;
    padding: 26px 16px !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.list-notifications div.list-no-data::before {
    content: "" !important;
    display: block !important;
    width: 34px !important;
    height: 34px !important;
    margin: 0 auto 10px !important;
    background-color: rgba(var(--color-green-light-rgb), 0.7) !important;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 8a6 6 0 0 0-12 0c0 7-3 9-3 9h18s-3-2-3-9'/%3E%3Cpath d='M13.73 21a2 2 0 0 1-3.46 0'/%3E%3C/svg%3E") center / contain no-repeat !important;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 8a6 6 0 0 0-12 0c0 7-3 9-3 9h18s-3-2-3-9'/%3E%3Cpath d='M13.73 21a2 2 0 0 1-3.46 0'/%3E%3C/svg%3E") center / contain no-repeat !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.list-notifications div.list-no-data div.title {
    color: rgba(255, 255, 255, 0.6) !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 14px !important;
    margin-top: 0 !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.list-notifications::-webkit-scrollbar {
    width: 4px !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.list-notifications::-webkit-scrollbar-thumb {
    background: rgba(var(--color-green-light-rgb), 0.35) !important;
    border-radius: 999px !important;
}

@media (max-width: 1200px) {
    header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.user-menu div.user-menus,
    header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.list-notifications {
        position: fixed !important;
        right: 8px !important;
        left: auto !important;
        width: min(360px, calc(100vw - 16px)) !important;
        min-width: 0 !important;
        max-width: none !important;
        max-height: min(70vh, 520px) !important;
        z-index: 300 !important;
    }
    header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.user-menu div.user-menus {
        top: 56px !important;
    }
    header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.list-notifications {
        top: 56px!important;
    }
}

@media (prefers-reduced-motion: reduce) {
    header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.user-menu[data-open="1"] div.user-menus {
        animation: none !important;
    }
    header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.user-menu div.user-menus ul li > div,
    header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.list-notifications div.list-listing div.notification-block,
    header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.list-notifications div.list-header button.mark-all-read {
        transition: none !important;
    }
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.user-menu div.user-menus {
    display: none !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.user-menu[data-open="1"] div.user-menus {
    display: block !important;
}

@media (min-width: 768px) {
    header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.user-menu div.user-menus::before {
        content: "" !important;
        display: block !important;
        position: absolute !important;
        left: 0 !important;
        right: 0 !important;
        top: -14px !important;
        height: 14px !important;
        background: transparent !important;
        pointer-events: auto !important;
    }
}

@media (max-width: 1200px) {
    header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons {
        flex-direction: row !important;
        gap: 8px !important;
        width: auto !important;
        max-width: calc(100vw - 16px) !important;
    }
}

@media (max-width: 991px) {
.search-menu#search-menu {
    display: flex !important;
    flex-direction: column !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    overflow: hidden !important;
    background:
        radial-gradient(1000px 520px at 50% -12%, rgba(var(--color-green-primary-rgb), 0.18), transparent 60%),
        radial-gradient(760px 460px at 100% 108%, rgba(var(--color-green-primary-rgb), 0.08), transparent 55%),
        rgba(1, 13, 8, 0.97) !important;
    -webkit-backdrop-filter: blur(14px) saturate(140%) !important;
    backdrop-filter: blur(14px) saturate(140%) !important;
}

@media (max-width: 991px) {
    .search-menu#search-menu {
        height: calc(100dvh - 66px) !important;
        max-height: calc(100dvh - 66px) !important;
    }
}

.search-menu#search-menu form.search-form {
    flex: 0 0 auto !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    width: 100% !important;
    max-width: 1120px !important;
    margin: 0 auto !important;
    padding: 18px 20px 14px !important;
    box-sizing: border-box !important;
    background: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    transition: none !important;
    position: relative !important;
}

.search-menu#search-menu form.search-form:focus-within {
    border: 0 !important;
    box-shadow: none !important;
}

.search-menu#search-menu form.search-form::after {
    content: "" !important;
    position: absolute !important;
    left: 12% !important;
    right: 12% !important;
    bottom: -14px !important;
    height: 1px !important;
    background: linear-gradient(90deg, transparent, rgba(var(--color-green-light-rgb), 0.55), transparent) !important;
    pointer-events: none !important;
}

.search-menu#search-menu form.search-form .search-form-container {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    height: 52px !important;
    padding: 0 16px !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.02) 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 13px !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease !important;
}

.search-menu#search-menu form.search-form .search-form-container:focus-within {
    background: rgba(var(--color-green-primary-rgb), 0.12) !important;
    box-shadow: 0 0 0 3px rgba(var(--color-green-light-rgb), 0.14) !important;
}

.search-menu#search-menu form.search-form .search-form-container button.icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
    width: 22px !important;
    height: 22px !important;
    padding: 0 !important;
    background: none !important;
    border: 0 !important;
    box-shadow: none !important;
    cursor: pointer !important;
}

.search-menu#search-menu form.search-form .search-form-container button.icon span[role="presentation"],
.search-menu#search-menu form.search-form .search-form-container button.icon svg {
    width: 19px !important;
    height: 19px !important;
    color: rgba(var(--color-green-light-rgb), 0.85) !important;
}

.search-menu#search-menu form.search-form .search-form-container:focus-within button.icon svg,
.search-menu#search-menu form.search-form .search-form-container:focus-within button.icon span[role="presentation"] {
    color: var(--color-green-bright) !important;
}

.search-menu#search-menu form.search-form .search-form-container input {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    height: 100% !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    outline: none !important;
    color: #ffffff !important;
    font-family: var(--font-family-medium), sans-serif !important;
    font-size: 15px !important;
    letter-spacing: 0.01em !important;
}

.search-menu#search-menu form.search-form .search-form-container input::placeholder {
    color: rgba(255, 255, 255, 0.45) !important;
}

.search-menu#search-menu form.search-form span.search-close {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
    width: 48px !important;
    height: 48px !important;
    margin: 0 !important;
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 999px !important;
    cursor: pointer !important;
    transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease !important;
}

.search-menu#search-menu form.search-form span.search-close:hover {
    background: rgba(var(--danger-rgb), 0.18) !important;
    border-color: rgba(var(--danger-rgb), 0.5) !important;
    transform: rotate(90deg) !important;
}

.search-menu#search-menu form.search-form span.search-close img {
    width: 15px !important;
    height: 15px !important;
    filter: brightness(0) invert(1) !important;
    opacity: 0.8 !important;
}

body:has(.search-menu.active) .sticky-menu {
    z-index: 2147483501 !important;
}

.search-menu#search-menu div.search-listing {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    width: 100% !important;
    max-width: 1120px !important;
    margin: 0 auto !important;
    padding: 16px 20px calc(90px + env(safe-area-inset-bottom, 0px)) !important;
    box-sizing: border-box !important;
    overflow-y: auto !important;
    margin-top: 20px !important;
    overscroll-behavior: contain !important;
}

.search-menu#search-menu div.search-listing::-webkit-scrollbar {
    width: 5px !important;
}

.search-menu#search-menu div.search-listing::-webkit-scrollbar-thumb {
    background: rgba(var(--color-green-light-rgb), 0.35) !important;
    border-radius: 999px !important;
}

.search-menu#search-menu div.slots-tabs-listing {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(128px, 1fr)) !important;
    align-items: start !important;
    gap: 14px !important;
    width: 100% !important;
    margin: 0 !important;
}

.search-menu#search-menu div.slots-tabs-listing div.item {
    min-width: 0 !important;
    margin: 0 !important;
}

.search-menu#search-menu div.slots-tabs-listing div.item div.game-item {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    background: linear-gradient(180deg, var(--color-surface-2) 0%, var(--color-surface-1) 100%) !important;
    border: 1px solid var(--surface-border-soft) !important;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.4) !important;
    transition: border-color 0.22s ease, box-shadow 0.22s ease, transform 0.22s ease !important;
}

.search-menu#search-menu div.slots-tabs-listing div.item:hover div.game-item {
    border-color: rgba(var(--color-green-light-rgb), 0.5) !important;
    box-shadow: 0 16px 34px rgba(0, 0, 0, 0.5), 0 0 22px rgba(var(--color-green-primary-rgb), 0.2) !important;
    transform: translateY(-3px) !important;
}

.search-menu#search-menu div.slots-tabs-listing div.item div.game-top {
    position: relative !important;
    width: 100% !important;
    height: auto !important;
}

.search-menu#search-menu div.slots-tabs-listing div.item div.game-top figure.game-image {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 256 / 359 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    background: linear-gradient(180deg, var(--color-surface-3) 0%, var(--color-surface-1) 100%) !important;
    border-radius: 12px 12px 0 0 !important;
}

.search-menu#search-menu div.slots-tabs-listing div.item div.game-top figure.game-image img {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    display: block !important;
    object-fit: cover !important;
    object-position: center !important;
    border-radius: 12px 12px 0 0 !important;
    transition: transform 0.3s ease !important;
}

.search-menu#search-menu div.slots-tabs-listing div.item:hover div.game-top figure.game-image img {
    transform: scale(1.06) !important;
}

.search-menu#search-menu div.slots-tabs-listing div.item div.game-top figure.game-image::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    background: linear-gradient(180deg, transparent 55%, rgba(1, 13, 8, 0.55) 100%) !important;
    pointer-events: none !important;
}

.search-menu#search-menu div.slots-tabs-listing div.item .slot2 {
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    background: linear-gradient(180deg, var(--color-surface-2) 0%, var(--color-surface-1) 100%) !important;
    border: 1px solid var(--surface-border-soft) !important;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.4) !important;
    transition: border-color 0.22s ease, box-shadow 0.22s ease, transform 0.22s ease !important;
}

.search-menu#search-menu div.slots-tabs-listing div.item:hover .slot2 {
    border-color: rgba(var(--color-green-light-rgb), 0.5) !important;
    box-shadow: 0 16px 34px rgba(0, 0, 0, 0.5), 0 0 22px rgba(var(--color-green-primary-rgb), 0.2) !important;
    transform: translateY(-3px) !important;
}

.search-menu#search-menu div.slots-tabs-listing div.item .slot2 .slot2__cover {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 256 / 359 !important;
    padding-bottom: 0 !important;
    margin: 0 !important;
    position: relative !important;
    overflow: hidden !important;
    border-radius: 12px 12px 0 0 !important;
    background: linear-gradient(180deg, var(--color-surface-3) 0%, var(--color-surface-1) 100%) !important;
}

.search-menu#search-menu div.slots-tabs-listing div.item .slot2 .slot2__cover img.slot2__img,
.search-menu#search-menu div.slots-tabs-listing div.item .slot2 .slot2__cover img {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    display: block !important;
    object-fit: cover !important;
    object-position: center !important;
    border-radius: 0 !important;
    transition: transform 0.3s ease !important;
}

.search-menu#search-menu div.slots-tabs-listing div.item:hover .slot2 .slot2__cover img {
    transform: scale(1.06) !important;
}

.search-menu#search-menu div.slots-tabs-listing div.item .slot2 .slot2__online {
    justify-content: center !important;
    gap: 6px !important;
    padding: 9px 8px 10px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.05) !important;
}

.search-menu#search-menu div.slots-tabs-listing div.item div.game-details {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    padding: 9px 8px 10px !important;
    background: transparent !important;
    border: 0 !important;
    border-top: 1px solid rgba(255, 255, 255, 0.05) !important;
}

.search-menu#search-menu div.slots-tabs-listing div.item div.game-details div.game-name {
    width: 100% !important;
    margin: 0 !important;
    color: var(--text-secondary) !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 12px !important;
    text-align: center !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.search-menu#search-menu div.slots-tabs-listing div.item div.slot2__online {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    width: 100% !important;
}

.search-menu#search-menu div.slots-tabs-listing div.item div.slot2__online span.slot2__dot {
    width: 7px !important;
    height: 7px !important;
    flex: 0 0 7px !important;
    border-radius: 50% !important;
    background: var(--color-green-bright) !important;
    box-shadow: 0 0 0 3px rgba(var(--color-green-light-rgb), 0.2), 0 0 8px rgba(var(--color-green-light-rgb), 0.7) !important;
    animation: cbSearchDotPulse 1.8s ease-in-out infinite !important;
}

.search-menu#search-menu div.slots-tabs-listing div.item div.slot2__online div.online__text__wrapper {
    display: inline-flex !important;
    align-items: baseline !important;
    gap: 4px !important;
    min-width: 0 !important;
}

.search-menu#search-menu div.slots-tabs-listing div.item div.slot2__online span.slot2__count {
    color: #ffffff !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 12.5px !important;
    font-variant-numeric: tabular-nums !important;
}

.search-menu#search-menu div.slots-tabs-listing div.item div.slot2__online span.slot2__label {
    color: var(--text-soft) !important;
    font-size: 11px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}
}

@keyframes cbSearchDotPulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.55; transform: scale(0.82); }
}

@media (max-width: 575px) {
    .search-menu#search-menu form.search-form {
        padding: 14px 14px 12px !important;
        gap: 10px !important;
    }
    .search-menu#search-menu form.search-form .search-form-container {
        height: 48px !important;
        border-radius: 11px !important;
    }
    .search-menu#search-menu form.search-form span.search-close {
        width: 44px !important;
        height: 44px !important;
    }
    .search-menu#search-menu div.search-listing {
        padding: 12px 14px calc(86px + env(safe-area-inset-bottom, 0px)) !important;
    }
    .search-menu#search-menu div.slots-tabs-listing {
        grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)) !important;
        gap: 10px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .search-menu#search-menu form.search-form span.search-close,
    .search-menu#search-menu form.search-form .search-form-container {
        transition: none !important;
    }
    .search-menu#search-menu form.search-form span.search-close:hover {
        transform: none !important;
    }
    .search-menu#search-menu div.slots-tabs-listing div.item div.slot2__online span.slot2__dot {
        animation: none !important;
    }
}

div.slots-tabs-listing.standart-tabs-listing {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(128px, 1fr)) !important;
    align-items: start !important;
    gap: 14px !important;
    width: 100% !important;
    margin: 0 !important;
}

div.slots-tabs-listing.standart-tabs-listing div.item {
    min-width: 0 !important;
    margin: 0 !important;
    width: auto !important;
}

div.slots-tabs-listing.standart-tabs-listing div.item div.game-item {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    background: linear-gradient(180deg, var(--color-surface-2) 0%, var(--color-surface-1) 100%) !important;
    border: 1px solid var(--surface-border-soft) !important;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.4) !important;
    transition: border-color 0.22s ease, box-shadow 0.22s ease, transform 0.22s ease !important;
}

div.slots-tabs-listing.standart-tabs-listing div.item:hover div.game-item {
    border-color: rgba(var(--color-green-light-rgb), 0.5) !important;
    box-shadow: 0 16px 34px rgba(0, 0, 0, 0.5), 0 0 22px rgba(var(--color-green-primary-rgb), 0.2) !important;
    transform: translateY(-3px) !important;
}

div.slots-tabs-listing.standart-tabs-listing div.item div.game-item div.game-top {
    position: relative !important;
    width: 100% !important;
    height: auto !important;
}

div.slots-tabs-listing.standart-tabs-listing div.item div.game-item div.game-top figure.game-image {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 256 / 359 !important;
    padding-bottom: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
    background: linear-gradient(180deg, var(--color-surface-3) 0%, var(--color-surface-1) 100%) !important;
    border-radius: 12px 12px 0 0 !important;
}

div.slots-tabs-listing.standart-tabs-listing div.item div.game-item div.game-top figure.game-image img {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    display: block !important;
    object-fit: cover !important;
    object-position: center !important;
    border-radius: 0 !important;
    transition: transform 0.3s ease !important;
}

div.slots-tabs-listing.standart-tabs-listing div.item:hover div.game-item div.game-top figure.game-image img {
    transform: scale(1.06) !important;
}

div.slots-tabs-listing.standart-tabs-listing div.item div.game-item div.game-top figure.game-image::before,
div.slots-tabs-listing.standart-tabs-listing div.item div.game-item div.game-top figure.game-image::after {
    content: none !important;
    display: none !important;
}

div.slots-tabs-listing.standart-tabs-listing div.item div.game-item div.game-top div.game-opener {
    position: absolute !important;
    inset: 0 !important;
    border: 0 !important;
    background: transparent !important;
    pointer-events: none !important;
}

div.slots-tabs-listing.standart-tabs-listing div.item div.game-item div.game-details {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    padding: 9px 8px 10px !important;
    background: transparent !important;
    border: 0 !important;
    border-top: 1px solid rgba(255, 255, 255, 0.05) !important;
}

div.slots-tabs-listing.standart-tabs-listing div.item div.game-item div.game-details div.game-name {
    width: 100% !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

div.slots-tabs-listing.standart-tabs-listing div.item div.game-item div.slot2__online {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    width: 100% !important;
}

div.slots-tabs-listing.standart-tabs-listing div.item div.game-item div.slot2__online span.slot2__dot {
    width: 7px !important;
    height: 7px !important;
    flex: 0 0 7px !important;
    border-radius: 50% !important;
    background: var(--color-green-bright) !important;
    box-shadow: 0 0 0 3px rgba(var(--color-green-light-rgb), 0.2), 0 0 8px rgba(var(--color-green-light-rgb), 0.7) !important;
    animation: cbSearchDotPulse 1.8s ease-in-out infinite !important;
}

div.slots-tabs-listing.standart-tabs-listing div.item div.game-item div.slot2__online div.online__text__wrapper {
    display: inline-flex !important;
    align-items: baseline !important;
    gap: 4px !important;
    min-width: 0 !important;
}

div.slots-tabs-listing.standart-tabs-listing div.item div.game-item div.slot2__online span.slot2__count {
    color: #ffffff !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 12.5px !important;
    font-variant-numeric: tabular-nums !important;
}

div.slots-tabs-listing.standart-tabs-listing div.item div.game-item div.slot2__online span.slot2__label {
    color: var(--text-soft) !important;
    font-size: 11px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

@media (max-width: 575px) {
    div.slots-tabs-listing.standart-tabs-listing {
        grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)) !important;
        gap: 10px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    div.slots-tabs-listing.standart-tabs-listing div.item div.game-item,
    div.slots-tabs-listing.standart-tabs-listing div.item div.game-item div.game-top figure.game-image img,
    div.slots-tabs-listing.standart-tabs-listing div.item div.game-item div.game-top span.favorite {
        transition: none !important;
    }
    div.slots-tabs-listing.standart-tabs-listing div.item:hover div.game-item,
    div.slots-tabs-listing.standart-tabs-listing div.item:hover div.game-item div.game-top figure.game-image img {
        transform: none !important;
    }
    div.slots-tabs-listing.standart-tabs-listing div.item div.game-item div.slot2__online span.slot2__dot {
        animation: none !important;
    }
}

.game-item div.game-top span.favorite,
.game-item div.game-top .favorite,
div.slots-tabs-listing div.item div.game-top span.favorite,
div.slots-tabs-listing div.item div.game-top .favorite,
div.slots-tabs-listing div.item .slot2 .slot2__cover .favorite,
.search-menu#search-menu div.slots-tabs-listing div.item div.game-top span.favorite {
    position: absolute !important;
    top: 8px !important;
    right: 8px !important;
    left: auto !important;
    bottom: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 30px !important;
    height: 30px !important;
    margin: 0 !important;
    padding: 0 !important;
    background: rgba(1, 13, 8, 0.5) !important;
    border: 1px solid rgba(255, 255, 255, 0.18) !important;
    border-radius: 999px !important;
    -webkit-backdrop-filter: blur(6px) !important;
    backdrop-filter: blur(6px) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35) !important;
    cursor: pointer !important;
    overflow: visible !important;
    z-index: 50 !important;
    transition: background 0.22s ease, border-color 0.22s ease, transform 0.22s ease, box-shadow 0.22s ease !important;
}

.game-item div.game-top span.favorite::before,
.game-item div.game-top .favorite::before,
div.slots-tabs-listing div.item div.game-top span.favorite::before,
div.slots-tabs-listing div.item div.game-top .favorite::before,
div.slots-tabs-listing div.item .slot2 .slot2__cover .favorite::before {
    content: "" !important;
    display: block !important;
    width: 15px !important;
    height: 15px !important;
    background-color: rgba(255, 255, 255, 0.85) !important;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z'/%3E%3C/svg%3E") center / contain no-repeat !important;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z'/%3E%3C/svg%3E") center / contain no-repeat !important;
    transition: background-color 0.22s ease, transform 0.22s ease !important;
}

.game-item div.game-top span.favorite svg,
.game-item div.game-top span.favorite img,
div.slots-tabs-listing div.item div.game-top span.favorite svg,
div.slots-tabs-listing div.item div.game-top span.favorite img,
div.slots-tabs-listing div.item .slot2 .slot2__cover .favorite svg,
div.slots-tabs-listing div.item .slot2 .slot2__cover .favorite img {
    display: none !important;
}

.game-item div.game-top span.favorite:hover,
.game-item div.game-top .favorite:hover,
div.slots-tabs-listing div.item div.game-top span.favorite:hover,
div.slots-tabs-listing div.item div.game-top .favorite:hover,
div.slots-tabs-listing div.item .slot2 .slot2__cover .favorite:hover {
    background: rgba(2, 83, 40, 0.55) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.5) !important;
    transform: scale(1.1) !important;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.4) !important;
}

.game-item div.game-top span.favorite:hover::before,
.game-item div.game-top .favorite:hover::before,
div.slots-tabs-listing div.item div.game-top span.favorite:hover::before,
div.slots-tabs-listing div.item div.game-top .favorite:hover::before,
div.slots-tabs-listing div.item .slot2 .slot2__cover .favorite:hover::before {
    background-color: #ffffff !important;
}

.game-item div.game-top span.favorite.active,
.game-item div.game-top .favorite.active,
div.slots-tabs-listing div.item div.game-top span.favorite.active,
div.slots-tabs-listing div.item div.game-top .favorite.active,
div.slots-tabs-listing div.item .slot2 .slot2__cover .favorite.active,
.search-menu#search-menu div.slots-tabs-listing div.item div.game-top span.favorite.active {
    background: linear-gradient(160deg, var(--color-green-light) 0%, var(--color-green-hover) 50%, var(--color-green-primary) 100%) !important;
    background-image: linear-gradient(160deg, var(--color-green-light) 0%, var(--color-green-hover) 50%, var(--color-green-primary) 100%) !important;
    border-color: rgba(var(--color-green-bright-rgb), 0.7) !important;
    box-shadow: 0 4px 14px rgba(var(--color-green-primary-rgb), 0.5), 0 0 0 3px rgba(var(--color-green-light-rgb), 0.16) !important;
}

.game-item div.game-top span.favorite.active::before,
.game-item div.game-top .favorite.active::before,
div.slots-tabs-listing div.item div.game-top span.favorite.active::before,
div.slots-tabs-listing div.item div.game-top .favorite.active::before,
div.slots-tabs-listing div.item .slot2 .slot2__cover .favorite.active::before {
    background-color: #ffffff !important;
    -webkit-animation: cbFavPop 0.32s cubic-bezier(.2, .9, .2, 1) !important;
            animation: cbFavPop 0.32s cubic-bezier(.2, .9, .2, 1) !important;
}

.game-item div.game-top span.favorite.active:hover,
.game-item div.game-top .favorite.active:hover,
div.slots-tabs-listing div.item div.game-top span.favorite.active:hover,
div.slots-tabs-listing div.item div.game-top .favorite.active:hover,
div.slots-tabs-listing div.item .slot2 .slot2__cover .favorite.active:hover {
    filter: brightness(1.1) !important;
    box-shadow: 0 6px 18px rgba(var(--color-green-primary-rgb), 0.6), 0 0 0 3px rgba(var(--color-green-light-rgb), 0.22) !important;
}

@keyframes cbFavPop {
    0% { transform: scale(0.5); }
    55% { transform: scale(1.28); }
    100% { transform: scale(1); }
}

@media (prefers-reduced-motion: reduce) {
    .game-item div.game-top span.favorite,
    div.slots-tabs-listing div.item div.game-top span.favorite,
    div.slots-tabs-listing div.item .slot2 .slot2__cover .favorite {
        transition: none !important;
    }
    .game-item div.game-top span.favorite.active::before,
    div.slots-tabs-listing div.item div.game-top span.favorite.active::before,
    div.slots-tabs-listing div.item .slot2 .slot2__cover .favorite.active::before {
        animation: none !important;
    }
    .game-item div.game-top span.favorite:hover,
    div.slots-tabs-listing div.item div.game-top span.favorite:hover {
        transform: none !important;
    }
}

div.main-search div.search-layer {
    position: relative !important;
    border-radius: 16px !important;
    border: 1px solid rgba(var(--color-green-primary-rgb), 0.5) !important;
    background: linear-gradient(180deg, rgba(7, 26, 16, 0.97) 0%, rgba(3, 10, 6, 0.98) 100%) !important;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
    -webkit-backdrop-filter: blur(14px) saturate(140%) !important;
    backdrop-filter: blur(14px) saturate(140%) !important;
    overflow: hidden !important;
}

div.main-search div.search-layer > div {
    max-height: min(70vh, 560px) !important;
    padding: 16px 18px calc(64px) !important;
    overscroll-behavior: contain !important;
    scrollbar-width: thin !important;
    scrollbar-color: rgba(var(--color-green-light-rgb), 0.35) transparent !important;
}

div.main-search div.search-layer > div::-webkit-scrollbar {
    width: 5px !important;
}

div.main-search div.search-layer > div::-webkit-scrollbar-thumb {
    background: rgba(var(--color-green-light-rgb), 0.35) !important;
    border-radius: 999px !important;
}

div.main-search div.search-layer > div > div.container {
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

div.main-search div.search-layer div.slots-tabs-listing.standart-tabs-listing {
    grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)) !important;
    gap: 12px !important;
    justify-content: start !important;
}

div.main-search div.search-layer > div.container {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    top: auto !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 12px 16px 14px !important;
    background: linear-gradient(0deg, rgba(3, 10, 6, 0.98) 30%, rgba(3, 10, 6, 0)) !important;
    -webkit-backdrop-filter: blur(6px) !important;
    backdrop-filter: blur(6px) !important;
    border-top: 1px solid rgba(var(--color-green-primary-rgb), 0.28) !important;
    z-index: 3 !important;
}

div.main-search div.search-layer > div.container > div {
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
    width: 100% !important;
    overflow-x: auto !important;
    scrollbar-width: none !important;
}

div.main-search div.search-layer > div.container > div::-webkit-scrollbar {
    display: none !important;
}

div.main-search div.search-layer > div.container button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
    min-height: 30px !important;
    padding: 0 14px !important;
    border: 1px solid rgba(var(--color-green-light-rgb), 0.4) !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, rgba(var(--color-green-primary-rgb), 0.5), rgba(var(--color-green-primary-rgb), 0.26)) !important;
    color: #edfffa !important;
    font-family: var(--font-family-semibold), sans-serif !important;
    font-size: 12px !important;
    white-space: nowrap !important;
    cursor: pointer !important;
    box-shadow: 0 6px 14px rgba(var(--color-green-primary-rgb), 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
    transition: filter 0.2s ease, border-color 0.2s ease, transform 0.2s ease !important;
}

div.main-search div.search-layer > div.container button:hover {
    filter: brightness(1.12) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.7) !important;
    transform: translateY(-1px) !important;
}

div.main-search[data-mode="embed"] form.search-form,
div.main-search[data-mode="inline"] form.search-form {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

div.main-search[data-mode="embed"] form.search-form input,
div.main-search[data-mode="inline"] form.search-form input {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.02) 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease !important;
}

div.main-search[data-mode="embed"] form.search-form input:focus,
div.main-search[data-mode="inline"] form.search-form input:focus {
    background: rgba(var(--color-green-primary-rgb), 0.12) !important;
    border-color: rgba(var(--color-green-light-rgb), 0.55) !important;
    box-shadow: 0 0 0 3px rgba(var(--color-green-light-rgb), 0.14) !important;
    outline: none !important;
}

@media (max-width: 575px) {
    div.main-search div.search-layer div.slots-tabs-listing.standart-tabs-listing {
        grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)) !important;
        gap: 10px !important;
    }
    div.main-search div.search-layer > div {
        padding: 12px 14px 62px !important;
    }
}

.react-modal-sheet-root:has(> .game-sheet),
.react-modal-sheet-root:has(.game-sheet) {
    top: 0 !important;
    bottom: auto !important;
    height: 100vh !important;
    height: 100dvh !important;
    max-height: 100vh !important;
    max-height: 100dvh !important;
}

div.react-modal-sheet-container.game-sheet {
    background: linear-gradient(180deg, rgba(7, 26, 16, 0.99) 0%, rgba(3, 10, 6, 0.99) 100%) !important;
    border-top-left-radius: 16px !important;
    border-top-right-radius: 16px !important;
    border-top: 1px solid rgba(var(--color-green-primary-rgb), 0.5) !important;
    box-shadow: 0 -12px 40px rgba(0, 0, 0, 0.6) !important;
    top: auto !important;
    bottom: 0 !important;
    max-height: 90vh !important;
    max-height: min(90dvh, calc(100dvh - env(safe-area-inset-top, 0px) - 10px)) !important;
    box-sizing: border-box !important;
}

div.react-modal-sheet-container.game-sheet .react-modal-sheet-content.game-sheet__content,
div.react-modal-sheet-container.game-sheet .game-sheet__content.modal-box {
    background: transparent !important;
    min-height: 0 !important;
    flex: 1 1 auto !important;
}

div.react-modal-sheet-container.game-sheet .react-modal-sheet-content-scroller {
    max-height: 100% !important;
    overflow-y: auto !important;
}

div.react-modal-sheet-container.game-sheet .react-modal-sheet-header-container.game-sheet__header,
div.react-modal-sheet-container.game-sheet div.game-sheet__header {
    flex: 0 0 auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 24px !important;
    padding: 12px 0 8px !important;
    background: transparent !important;
    border-top-left-radius: 16px !important;
    border-top-right-radius: 16px !important;
}

div.react-modal-sheet-container.game-sheet div.game-sheet__header div.game-sheet__drag,
div.react-modal-sheet-container.game-sheet div.game-sheet__drag {
    display: block !important;
    width: 46px !important;
    height: 5px !important;
    margin: 0 auto !important;
    border: 0 !important;
    border-radius: 999px !important;
    opacity: 1 !important;
    visibility: visible !important;
    background: rgba(255, 255, 255, 0.4) !important;
}

@media (min-width: 992px) and (max-width: 1366px) {
    header#header div.middle-header div.middle-header-container div.categories a.category {
        position: relative !important;
        width: 40px !important;
        min-width: 40px !important;
        padding: 0 !important;
        justify-content: center !important;
    }
    header#header div.middle-header div.middle-header-container div.categories a.category span.text {
        position: absolute !important;
        top: calc(100% + 8px) !important;
        left: 50% !important;
        transform: translateX(-50%) translateY(-4px) !important;
        display: inline-block !important;
        margin: 0 !important;
        padding: 6px 10px !important;
        white-space: nowrap !important;
        border-radius: 8px !important;
        background: linear-gradient(180deg, rgba(7, 26, 16, 0.98), rgba(3, 10, 6, 0.99)) !important;
        border: 1px solid rgba(var(--color-green-primary-rgb), 0.5) !important;
        box-shadow: 0 12px 26px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
        color: #ffffff !important;
        font-size: 12px !important;
        line-height: 1 !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
        z-index: 200 !important;
        transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s !important;
    }
    header#header div.middle-header div.middle-header-container div.categories a.category:not([data-cb-dd="1"]):hover span.text,
    header#header div.middle-header div.middle-header-container div.categories a.category:not([data-cb-dd="1"]):focus-visible span.text {
        opacity: 1 !important;
        visibility: visible !important;
        transform: translateX(-50%) translateY(0) !important;
    }
}

@media (min-width: 1367px) {
    body:has(#responsive-menu.responsive-menu:not(.active-menu)) header#header div.middle-header div.middle-header-container div.categories a.category {
        position: relative !important;
        width: 40px !important;
        min-width: 40px !important;
        padding: 0 !important;
        justify-content: center !important;
    }
    body:has(#responsive-menu.responsive-menu:not(.active-menu)) header#header div.middle-header div.middle-header-container div.categories a.category span.text {
        position: absolute !important;
        top: calc(100% + 8px) !important;
        left: 50% !important;
        transform: translateX(-50%) translateY(-4px) !important;
        display: inline-block !important;
        margin: 0 !important;
        padding: 6px 10px !important;
        white-space: nowrap !important;
        border-radius: 8px !important;
        background: linear-gradient(180deg, rgba(7, 26, 16, 0.98), rgba(3, 10, 6, 0.99)) !important;
        border: 1px solid rgba(var(--color-green-primary-rgb), 0.5) !important;
        box-shadow: 0 12px 26px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
        color: #ffffff !important;
        font-size: 12px !important;
        line-height: 1 !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
        z-index: 200 !important;
        transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s !important;
    }
    body:has(#responsive-menu.responsive-menu:not(.active-menu)) header#header div.middle-header div.middle-header-container div.categories a.category:not([data-cb-dd="1"]):hover span.text,
    body:has(#responsive-menu.responsive-menu:not(.active-menu)) header#header div.middle-header div.middle-header-container div.categories a.category:not([data-cb-dd="1"]):focus-visible span.text {
        opacity: 1 !important;
        visibility: visible !important;
        transform: translateX(-50%) translateY(0) !important;
    }
}

@media (max-width: 991px) {
    *,
    *::before,
    *::after {
        -webkit-backdrop-filter: none !important;
        backdrop-filter: none !important;
    }
}

.hero-area-slider .hero-nav-btn,
.hero-area-slider .swiper-button-prev,
.hero-area-slider .swiper-button-next {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    background: rgba(10, 14, 12, 0.72) !important;
}

header#header div.middle-header div.middle-header-container div.header-buttons div.login-buttons a.button.register {
    -webkit-animation: none !important;
    animation: none !important;
}

@media (max-width: 991px) {
    .section-header .section-title .title::before,
    .vip6qCard__glow,
    .auth-modal .auth-logo::before {
        display: none !important;
    }

    .cb-mission-vision__card,
    .cb-quickaccess__card,
    .bonus-request-card,
    .provider-item__inner,
    .game-item {
        transition: none !important;
    }
}

.react-modal-sheet-root[data-sheet-state="closed"] {
    content-visibility: hidden !important;
    pointer-events: none !important;
}

html.cb-sheet-open .provider-carousel .swiper-wrapper,
html.cb-sheet-open .provider-carousel .owl-carousel .owl-stage,
html.cb-sheet-open footer .footer-currencies .currency-listing,
html.cb-sheet-open footer#footer .footer-currencies .currency-listing {
    animation-play-state: paused !important;
}

html.cb-sheet-open .latestWins,
html.cb-sheet-open .live-winners,
html.cb-sheet-open .live-casino-winners,
html.cb-sheet-open .last-winners,
html.cb-sheet-open .winners-slider,
html.cb-sheet-open .flex-table,
html.cb-sheet-open .hero-area-slider {

    visibility: hidden !important;
}

div.react-modal-sheet-container.game-sheet {
    will-change: transform !important;
}

.react-modal-sheet-container.game-sheet .react-modal-sheet-content-scroller {
    contain: layout paint !important;
}

.react-modal-sheet-container .slot2__dot,
.react-modal-sheet-container .slot2__online span.slot2__dot,
div.slots-tabs-listing.standart-tabs-listing .react-modal-sheet-container span.slot2__dot {
    -webkit-animation: none !important;
    animation: none !important;
}

.react-modal-sheet-container .game-item {
    box-shadow: none !important;
    transition: none !important;
}

.react-modal-sheet-container .game-item div.game-top::before,
.react-modal-sheet-container .game-item div.game-top::after,
.react-modal-sheet-container .game-item div.game-top figure.game-image::before,
.react-modal-sheet-container .game-item div.game-top figure.game-image::after {
    display: none !important;
}

.react-modal-sheet-container .slots-tabs-listing.standart-tabs-listing div.item {
    content-visibility: auto !important;
    contain-intrinsic-size: auto 220px !important;
}

@media (max-width: 991px) {
    .game-item, .game-card, .category-item, .home-category-item,
    .provider-item, .provider-card, .promotion-item, .bonus-card,
    .wallet-box, .league-card, .card, .panel {
        box-shadow: 0 5px 14px rgba(0, 0, 0, 0.34) !important;
    }
    .hero-area-slider .swiper-slide {
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4) !important;
    }
    .game-item div.game-top figure.game-image {
        transition: none !important;
    }
}

@media (max-width: 991px) {
    .latestWins__img,
    .latestWins__img--mobile,
    .latestWins__img--fit,
    .latestWins__img--mobile.latestWins__img--fit {
        filter: none !important;
    }
    .latestWins__card--fresh,
    .latestWins__card--fresh .latestWins__imgWrap,
    .latestWins__dot {
        -webkit-animation: none !important;
        animation: none !important;
    }
    .latestWins__card {
        transition: none !important;
    }
}

@media (max-width: 991px) {
    html .game-item div.game-top span.favorite,
    html .game-item div.game-top .favorite,
    html div.slots-tabs-listing div.item div.game-top span.favorite,
    html div.slots-tabs-listing div.item div.game-top .favorite,
    html div.slots-tabs-listing div.item .slot2 .slot2__cover .favorite,
    html .search-menu#search-menu div.slots-tabs-listing div.item div.game-top span.favorite,
    html .search-menu#search-menu div.slots-tabs-listing div.item div.game-top .favorite,
    html .slot-tabs-buttons.general-tabs-buttons a,
    html .bonus-request-info,
    html .lowbar-fab__backdrop,
    html .user-info ul,
    html .user-info .dropdown-menu,
    html .user-info .user-menu,
    html #responsive-menu .menu-head .buttons .languages-box .other-langs,
    html .search-menu#search-menu,
    html div.main-search div.search-layer,
    html div.main-search div.search-layer > div.container,
    html header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.user-menu div.user-menus,
    html header#header div.middle-header div.middle-header-container div.header-buttons div.header-minified-buttons div.notifications-box div.list-notifications {
        -webkit-backdrop-filter: none !important;
        backdrop-filter: none !important;
    }
}

html div.slots-tabs-listing.standart-tabs-listing div.item div.game-item div.slot2__online span.slot2__dot,
html .search-menu#search-menu div.slots-tabs-listing div.item div.slot2__online span.slot2__dot,
html div.slots-tabs-listing div.item div.game-item div.slot2__online span.slot2__dot {
    -webkit-animation: none !important;
    animation: none !important;
}

@media (max-width: 991px) {
    .bonus-request-card,
    .bonus-request-card:hover {
        transform: none !important;
        border-color: var(--surface-border-soft) !important;
        box-shadow: 0 10px 24px rgba(0, 0, 0, 0.35) !important;
        transition: none !important;
    }
    .bonus-request-card:hover .bonus-request-imageWrap img,
    .bonus-request-card .bonus-request-imageWrap img {
        transform: none !important;
        transition: none !important;
    }
    .bonus-request-btn:hover {
        filter: none !important;
        box-shadow: 0 6px 16px rgba(var(--color-green-primary-rgb), 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
    }
    .bonus-request-info:hover {
        background: rgba(1, 13, 8, 0.7) !important;
        border-color: rgba(var(--color-green-light-rgb), 0.4) !important;
    }
}

@media (hover: none) and (max-width: 991px) {
    .react-modal-sheet-container *:hover,
    .app-mobile-sheet *:hover,
    .ps-sheet *:hover,
    .modal *:hover,
    .modal-body *:hover {
        transform: none !important;
    }
    .react-modal-sheet-container [class]:hover,
    .app-mobile-sheet [class]:hover,
    .ps-sheet [class]:hover,
    .modal [class]:hover,
    .modal-body [class]:hover {
        transition-property: background, background-color, border-color, color, box-shadow, filter, opacity !important;
    }
}

.sticky-menu .menu-item.wallet.is-wallet-user .logo,
.sticky-menu .menu-item.wallet.is-home-guest .logo .guest-home-icon,
body.cb-bubble-open .sticky-menu .menu-item.wallet .logo,
body.cb-bubble-closing .sticky-menu .menu-item.wallet .logo {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: 1 / 1 !important;
    box-sizing: border-box !important;
}

body:has(.search-menu.active).cb-bubble-open .sticky-menu {
    z-index: 2147483610 !important;
}

@media (max-width: 991px) {

    html.cb-sheet-animating .react-modal-sheet-container .react-modal-sheet-content-scroller,
    html.cb-sheet-animating .app-mobile-sheet .react-modal-sheet-content-scroller {
        content-visibility: hidden !important;
        contain-intrinsic-size: auto 100vh !important;
    }
    html.cb-sheet-animating .react-modal-sheet-container .react-modal-sheet-content {
        visibility: hidden !important;
    }
    html.cb-sheet-animating .react-modal-sheet-container.game-sheet {
        will-change: transform !important;
        contain: layout paint !important;
    }

    html.cb-sheet-animating .modal .modal-body,
    html.cb-sheet-animating .modal .modal-box {
        visibility: hidden !important;
    }
}

.cb-wheel-banner {
    display: block !important;
    margin: 0 10px 10px !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    line-height: 0 !important;
    font-size: 0 !important;
    border: 1px solid rgba(var(--color-green-primary-rgb), 0.5) !important;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.35) !important;
    transition: border-color 0.22s ease, box-shadow 0.22s ease, transform 0.2s ease !important;
}

.cb-wheel-banner img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 460 / 105 !important;
    object-fit: cover !important;
    border-radius: 12px !important;
}

.cb-wheel-banner:hover {
    border-color: rgba(var(--color-green-bright-rgb), 0.7) !important;
    box-shadow: 0 14px 30px rgba(0, 0, 0, 0.45), 0 0 20px rgba(var(--color-green-primary-rgb), 0.25) !important;
    transform: translateY(-1px) !important;
}

#responsive-menu.responsive-menu:not(.active-menu) .cb-wheel-banner {
    display: none !important;
}

@media (prefers-reduced-motion: reduce) {
    .cb-wheel-banner {
        transition: none !important;
    }
    .cb-wheel-banner:hover {
        transform: none !important;
    }
}

#responsive-menu .p2tabs,
#responsive-menu .p2tabs.p2tabs--sidebar {
    display: none !important;
}

@media (max-width: 991px) {
    #responsive-menu.responsive-menu {
        max-width: min(84vw, 340px) !important;
    }

    #responsive-menu.responsive-menu.active-menu {
        will-change: transform !important;
    }

    html.cb-sbmenu-open .provider-carousel .swiper-wrapper,
    html.cb-sbmenu-open .provider-carousel .owl-carousel .owl-stage,
    html.cb-sbmenu-open footer .footer-currencies .currency-listing,
    html.cb-sbmenu-open footer#footer .footer-currencies .currency-listing,
    html.cb-sbmenu-open .latestWins__card--fresh,
    html.cb-sbmenu-open .latestWins__card--fresh .latestWins__imgWrap,
    html.cb-sbmenu-open .latestWins__dot,
    html.cb-sbmenu-open .hero-area-slider .hero-slide-media img {
        -webkit-animation-play-state: paused !important;
        animation-play-state: paused !important;
    }
}

.copyright a[href*="hubgaming"] { display: none !important; }

.cb-matches {
    margin: 40px 0 40px;
    padding: 18px;
    border-radius: 16px;
    background:
        radial-gradient(720px 240px at 12% -20%, rgba(var(--color-green-primary-rgb), 0.16), transparent 60%),
        linear-gradient(180deg, var(--color-surface-2) 0%, var(--color-surface-1) 100%);
    border: 1px solid var(--surface-border-soft);
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.cbmt__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}

.cbmt__title {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.cbmt__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    border-radius: 9px;
    color: var(--color-green-bright);
    background: rgba(var(--color-green-primary-rgb), 0.18);
    border: 1px solid rgba(var(--color-green-light-rgb), 0.28);
}

.cbmt__icon svg {
    width: 17px;
    height: 17px;
    display: block;
}

.cbmt__ttl {
    color: #ffffff;
    font-family: var(--font-family-bold), sans-serif;
    font-size: 17px;
    font-weight: 800;
    letter-spacing: 0.01em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cbmt__ctrl {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
}

.cbmt__all {
    display: inline-flex;
    align-items: center;
    height: 34px;
    padding: 0 14px;
    border-radius: 999px;
    background: linear-gradient(180deg, rgba(var(--color-green-primary-rgb), 0.28), rgba(var(--color-green-primary-rgb), 0.12));
    border: 1px solid rgba(var(--color-green-light-rgb), 0.35);
    color: var(--color-green-light);
    font-family: var(--font-family-semibold), sans-serif;
    font-size: 12.5px;
    text-decoration: none;
    transition: background 0.22s ease, border-color 0.22s ease, color 0.22s ease;
}

.cbmt__all:hover {
    background: linear-gradient(180deg, var(--color-green-hover), var(--color-green-primary));
    border-color: rgba(var(--color-green-light-rgb), 0.7);
    color: #ffffff !important;
}

.cbmt__nav {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    padding: 0;
    border-radius: 10px;
    background: linear-gradient(180deg, var(--color-surface-3), var(--color-surface-1));
    border: 1px solid rgba(var(--color-green-light-rgb), 0.3);
    color: #ffffff;
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
    transition: background 0.22s ease, border-color 0.22s ease, transform 0.2s ease;
}

.cbmt__nav:hover {
    background: linear-gradient(180deg, var(--color-green-hover), var(--color-green-deep));
    border-color: rgba(var(--color-green-light-rgb), 0.7);
}

.cbmt__nav:active {
    transform: scale(0.94);
}

.cbmt__track {
    display: flex;
    align-items: stretch;
    gap: 12px;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    scroll-snap-type: x proximity;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
    padding: 14px 4px;
    margin: -14px -4px -12px;
}

.cbmt__track::-webkit-scrollbar {
    display: none;
}

.cbmt__card {
    position: relative;
    scroll-snap-align: start;
    flex: 0 0 264px;
    width: 264px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 14px 14px 12px;
    border-radius: 16px;
    overflow: hidden;
    background:
        radial-gradient(260px 130px at 50% -30%, rgba(var(--color-green-primary-rgb), 0.22), transparent 62%),
        linear-gradient(180deg, var(--color-surface-3) 0%, var(--color-surface-1) 100%);
    border: 1px solid var(--surface-border-soft);
    box-shadow: 0 12px 26px rgba(0, 0, 0, 0.36), inset 0 1px 0 rgba(255, 255, 255, 0.04);
    text-decoration: none;
    transition: border-color 0.22s ease, box-shadow 0.22s ease, transform 0.22s ease;
}

.cbmt__card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 12%;
    right: 12%;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, transparent, rgba(var(--color-green-light-rgb), 0.75), transparent);
    pointer-events: none;
}

.cbmt__card.is-live::before {
    background: linear-gradient(90deg, transparent, rgba(var(--danger-rgb), 0.85), transparent);
}

.cbmt__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.cbmt__league {
    min-width: 0;
    color: var(--text-soft);
    font-family: var(--font-family-semibold), sans-serif;
    font-size: 10.5px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cbmt__time {
    flex: 0 0 auto;
    padding: 3px 9px;
    border-radius: 999px;
    background: rgba(var(--color-green-primary-rgb), 0.18);
    border: 1px solid rgba(var(--color-green-light-rgb), 0.25);
    color: var(--color-green-light);
    font-family: var(--font-family-semibold), sans-serif;
    font-size: 11px;
    font-variant-numeric: tabular-nums;
}

.cbmt__live {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    flex: 0 0 auto;
    padding: 3px 9px 3px 8px;
    border-radius: 999px;
    background: rgba(var(--danger-rgb), 0.16);
    border: 1px solid rgba(var(--danger-rgb), 0.45);
    color: #ff8b97;
    font-family: var(--font-family-bold), sans-serif;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.cbmt__live i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--danger);
    box-shadow: 0 0 0 3px rgba(var(--danger-rgb), 0.22);
}

.cbmt__vs {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: start;
    gap: 8px;
    padding: 2px 0;
}

.cbmt__side {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    min-width: 0;
    text-align: center;
}

.cbmt__logo {
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
    object-fit: contain;
    border-radius: 12px;
    padding: 6px;
    background: radial-gradient(circle at 50% 32%, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.02));
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 6px 14px rgba(0, 0, 0, 0.3);
}

.cbmt__logo--ph {
    position: relative;
    display: inline-block;
}

.cbmt__logo--ph::after {
    content: "?";
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text-disabled);
    font-family: var(--font-family-bold), sans-serif;
    font-size: 18px;
}

.cbmt__name {
    width: 100%;
    color: #ffffff;
    font-family: var(--font-family-semibold), sans-serif;
    font-size: 12px;
    line-height: 1.25;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.cbmt__vsbadge {
    align-self: center;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    margin-top: 7px;
    border-radius: 50%;
    background: linear-gradient(160deg, var(--color-green-light) 0%, var(--color-green-primary) 100%);
    border: 1px solid rgba(var(--color-green-bright-rgb), 0.5);
    box-shadow: 0 6px 16px rgba(var(--color-green-primary-rgb), 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.25);
    color: #ffffff;
    font-family: var(--font-family-bold), sans-serif;
    font-size: 11px;
    font-weight: 800;
}

.cbmt__odds {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 7px;
    margin-top: auto;
}

.cbmt__odd {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    padding: 8px 4px;
    border-radius: 10px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.02));
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
    transition: background 0.2s ease, border-color 0.2s ease;
}

.cbmt__oddlbl {
    color: var(--text-soft);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.cbmt__oddval {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    font-family: var(--font-family-bold), sans-serif;
    font-size: 14px;
    font-variant-numeric: tabular-nums;
}

.cbmt__odd.is-locked {
    opacity: 0.7;
}

.cbmt__odd.is-locked .cbmt__oddval {
    color: var(--text-disabled);
}

.cbmt__odd.is-locked .cbmt__oddval svg {
    width: 12px;
    height: 12px;
    display: block;
}

.cb-matches.is-loading .cbmt__track {
    min-height: 190px;
}

@media (hover: hover) and (pointer: fine) {
    .cbmt__card:hover {
        border-color: rgba(var(--color-green-light-rgb), 0.5);
        box-shadow: 0 18px 36px rgba(0, 0, 0, 0.55), 0 0 26px rgba(var(--color-green-primary-rgb), 0.2);
        transform: translateY(-3px);
    }
    .cbmt__card:hover .cbmt__odd:not(.is-locked) {
        background: linear-gradient(180deg, var(--color-green-hover), var(--color-green-primary));
        border-color: rgba(var(--color-green-light-rgb), 0.5);
    }
    .cbmt__card:hover .cbmt__odd:not(.is-locked) .cbmt__oddlbl,
    .cbmt__card:hover .cbmt__odd:not(.is-locked) .cbmt__oddval {
        color: #ffffff;
    }
    .cbmt__nav:hover {
        transform: translateY(-1px);
    }
}

@media (min-width: 992px) {
    .cbmt__card.is-live .cbmt__live i {
        animation: cbmtLivePulse 1.6s ease-in-out infinite;
    }
}

@keyframes cbmtLivePulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.5; transform: scale(0.7); }
}

@media (max-width: 991px) {
    .cb-matches {
        padding: 14px;
        box-shadow: 0 6px 16px rgba(0, 0, 0, 0.34);
    }
    .cbmt__card {
        transition: none;
        box-shadow: 0 6px 14px rgba(0, 0, 0, 0.32);
    }
    .cbmt__track {
        scroll-behavior: auto;
    }
}

@media (max-width: 575px) {
    .cbmt__card {
        flex-basis: 240px;
        width: 240px;
    }
    .cbmt__logo {
        width: 42px;
        height: 42px;
        flex-basis: 42px;
    }
    .cbmt__ttl {
        font-size: 15px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .cbmt__card,
    .cbmt__nav,
    .cbmt__all,
    .cbmt__odd {
        transition: none !important;
    }
    .cbmt__card.is-live .cbmt__live i {
        animation: none !important;
    }
    .cbmt__track {
        scroll-behavior: auto !important;
    }
    .cbmt__card:hover,
    .cbmt__nav:hover {
        transform: none !important;
    }
}

.fiat-method__logo {
    object-fit: contain !important;
}

@media (max-width: 991px) {
    input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not([type="button"]):not([type="submit"]),
    select,
    textarea {
        font-size: 16px !important;
    }
}

.cb-fs-reenter {
    position: fixed !important;
    right: 12px !important;
    top: calc(66px + env(safe-area-inset-top, 0px)) !important;
    z-index: 2147483000 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 32px !important;
    height: 32px !important;
    padding: 0 !important;
    border-radius: 50% !important;
    background: linear-gradient(160deg, var(--color-green-light) 0%, var(--color-green-hover) 48%, var(--color-green-primary) 100%) !important;
    border: 1px solid rgba(var(--color-green-bright-rgb), 0.5) !important;
    box-shadow: 0 5px 14px rgba(var(--color-green-primary-rgb), 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.25) !important;
    color: #ffffff !important;
    line-height: 1 !important;
    cursor: pointer !important;
    -webkit-tap-highlight-color: transparent !important;
    touch-action: manipulation !important;
    opacity: 0.88 !important;
}

.cb-fs-reenter span {
    display: none !important;
}

.cb-fs-reenter svg {
    width: 15px !important;
    height: 15px !important;
    display: block !important;
    flex: 0 0 15px !important;
}

.cb-fs-reenter .cb-fs-ico--close {
    display: none !important;
}

body.game-fullscreen .cb-fs-reenter .cb-fs-ico--open,
body:has(#game-parent.is-fs) .cb-fs-reenter .cb-fs-ico--open {
    display: none !important;
}

body.game-fullscreen .cb-fs-reenter .cb-fs-ico--close,
body:has(#game-parent.is-fs) .cb-fs-reenter .cb-fs-ico--close {
    display: block !important;
}

body.game-fullscreen .cb-fs-reenter,
body:has(#game-parent.is-fs) .cb-fs-reenter {
    top: calc(10px + env(safe-area-inset-top, 0px)) !important;
    background: rgba(4, 13, 8, 0.72) !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.5) !important;
    opacity: 1 !important;
}

@media (min-width: 992px) {
    .cb-fs-reenter {
        display: none !important;
    }
}

@media (max-width: 991px) {
    .game-fs-close {
        display: none !important;
    }
}

.cb-quickpicks {
    margin: 40px 0 73px;
}

.cbqp__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
}

.cbqp__h {
    min-width: 0;
    color: #ffffff;
    font-family: var(--font-family-bold), sans-serif;
    font-size: 26px;
    font-weight: 800;
    letter-spacing: -0.01em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cbqp__ctrl {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
}

.cbqp__all {
    display: inline-flex;
    align-items: center;
    height: 36px;
    padding: 0 16px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.14);
    color: #ffffff;
    font-family: var(--font-family-semibold), sans-serif;
    font-size: 13px;
    text-decoration: none;
    transition: background 0.2s ease, border-color 0.2s ease;
}

.cbqp__all:hover {
    background: rgba(var(--color-green-primary-rgb), 0.35);
    border-color: rgba(var(--color-green-light-rgb), 0.5);
    color: #ffffff !important;
}

.cbqp__nav {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    padding: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.12);
    color: #ffffff;
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
    transition: background 0.2s ease, border-color 0.2s ease;
}

.cbqp__nav:hover {
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(var(--color-green-light-rgb), 0.5);
}

.cbmt__nav > span,
.cbqp__nav > span {
    display: none !important;
}

.cbmt__nav::before,
.cbqp__nav::before {
    content: "";
    width: 8px;
    height: 8px;
    border: solid currentColor;
    border-width: 0 2px 2px 0;
    border-radius: 1px;
}

.cbmt__prev::before,
.cbqp__prev::before {
    transform: translateX(2px) rotate(135deg);
}

.cbmt__next::before,
.cbqp__next::before {
    transform: translateX(-2px) rotate(-45deg);
}

.main-search.cb-hascats {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
}

.main-search.cb-hascats form.search-form,
.main-search.cb-hascats .search-form {
    flex: 1 1 60% !important;
    min-width: 0 !important;
    margin: 0 !important;
}

.cb-searchcats {
    position: relative;
    flex: 0 1 40%;
    min-width: 0;
    max-width: 40%;
    display: flex;
    align-items: center;
}

.main-search.cb-hascats:has(.search-layer) {
    display: block !important;
}

.main-search.cb-hascats:has(.search-layer) .cb-searchcats {
    display: none !important;
}

.cb-searchcats.at-start .cb-searchcats__prev,
.cb-searchcats.at-end .cb-searchcats__next {
    opacity: 0 !important;
    pointer-events: none !important;
}

.cb-searchcats__track {
    display: flex;
    align-items: center;
    gap: 8px;
    overflow-x: auto;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
    padding: 0 30px;
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 9%, #000 91%, transparent 100%);
    mask-image: linear-gradient(90deg, transparent 0, #000 9%, #000 91%, transparent 100%);
}

.cb-searchcats__track::-webkit-scrollbar {
    display: none;
}

.cb-searchcats__chip {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    height: 48px;
    padding: 0 16px 0 8px;
    border-radius: 12px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.02));
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: #ffffff;
    font-family: var(--font-family-semibold), sans-serif;
    font-size: 13.5px;
    text-decoration: none;
    white-space: nowrap;
    transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.cb-searchcats__chip:hover {
    background: linear-gradient(180deg, rgba(var(--color-green-primary-rgb), 0.42), rgba(var(--color-green-primary-rgb), 0.16));
    border-color: rgba(var(--color-green-light-rgb), 0.5);
}

.cb-searchcats__ico {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    border-radius: 9px;
    background: rgba(var(--color-green-primary-rgb), 0.35);
    border: 1px solid rgba(var(--color-green-light-rgb), 0.32);
    color: var(--color-green-bright);
}

.cb-searchcats__ico svg {
    width: 17px;
    height: 17px;
    display: block;
}

.cb-searchcats__lbl {
    color: #ffffff;
}

.cb-searchcats__nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 26px;
    height: 26px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: linear-gradient(160deg, var(--color-green-light), var(--color-green-primary));
    border: 1px solid rgba(var(--color-green-bright-rgb), 0.5);
    color: #ffffff;
    cursor: pointer;
    z-index: 2;
    box-shadow: 0 4px 12px rgba(var(--color-green-primary-rgb), 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.2);
    transition: filter 0.2s ease, opacity 0.2s ease;
}

.cb-searchcats__prev { left: 0; }
.cb-searchcats__next { right: 0; }

.cb-searchcats__nav:hover {
    filter: brightness(1.1);
}

.cb-searchcats__nav svg {
    width: 13px;
    height: 13px;
    display: block;
}

@media (max-width: 991px) {
    .main-search.cb-hascats {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 10px !important;
    }
    .cb-searchcats {
        max-width: 100%;
        flex-basis: auto;
    }
}

@media (max-width: 575px) {
    .cb-searchcats {
        display: none !important;
    }
    .main-search.cb-hascats {
        display: block !important;
        margin-top: 30px !important;
    }
}

@media (max-width: 991px) {
    .cb-matches,
    .cb-quickpicks,
    .cb-quickaccess,
    .cb-gamefinder,
    main#main > .cb-gamefinder {
        margin-top: 40px !important;
        margin-bottom: 14px !important;
    }
    .cb-mission-vision {
        margin-top: 40px !important;
    }
    .game-carousel {
        margin-top: 30px !important;
        margin-bottom: 14px !important;
    }
    .game-carousel:not(:first-child)::before {
        top: -15px !important;
    }
}

@media (max-width: 575px) {
    .cb-gamefinder__character {
        display: none !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .cb-searchcats__track {
        scroll-behavior: auto;
    }
    .cb-searchcats__chip,
    .cb-searchcats__next {
        transition: none;
    }
    .cb-searchcats__chip:hover {
        transform: none;
    }
}

.cbqp__grid {
    display: grid;
    grid-auto-flow: column;
    grid-template-rows: repeat(4, auto);
    grid-auto-columns: calc((100% + 44px) / 4.3 - 44px);
    gap: 10px 44px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
    padding-bottom: 2px;
}

.cbqp__grid::-webkit-scrollbar {
    display: none;
}

.cbqp__item {
    scroll-snap-align: start;
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    padding: 6px 8px;
    border-radius: 8px;
    text-decoration: none;
    transition: background 0.18s ease;
}

.cbqp__thumbWrap {
    position: relative;
    width: 64px;
    aspect-ratio: 180 / 236;
    flex: 0 0 64px;
    border-radius: 8px;
    overflow: hidden;
    background: var(--color-surface-3);
}

.cbqp__thumb {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.cbqp__play {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.5);
    opacity: 0;
    transition: opacity 0.18s ease;
}

.cbqp__play::before {
    content: "";
    width: 0;
    height: 0;
    margin-left: 2px;
    border-top: 7px solid transparent;
    border-bottom: 7px solid transparent;
    border-left: 12px solid #ffffff;
}

.cbqp__meta {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.cbqp__title {
    color: #ffffff;
    font-family: var(--font-family-semibold), sans-serif;
    font-size: 14px;
    line-height: 1.25;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.cbqp__sub {
    color: var(--text-soft);
    font-size: 12px;
    line-height: 1.3;
    overflow-wrap: anywhere;
}

.cb-quickpicks.is-loading .cbqp__grid {
    min-height: 360px;
}

.cbqp__item--sk {
    pointer-events: none;
    cursor: default;
}

.cbqp__sk {
    background: rgba(255, 255, 255, 0.06);
    border-radius: 6px;
}

.cbqp__skline {
    height: 12px;
    width: 70%;
    max-width: 140px;
    border-radius: 4px;
}

.cbqp__skline--sm {
    height: 10px;
    width: 45%;
    max-width: 80px;
}

@media (min-width: 992px) {
    .cbqp__sk {
        background: linear-gradient(90deg, rgba(255, 255, 255, 0.05) 25%, rgba(255, 255, 255, 0.11) 37%, rgba(255, 255, 255, 0.05) 63%);
        background-size: 400% 100%;
        animation: cbqpShimmer 1.4s ease infinite;
    }
}

@keyframes cbqpShimmer {
    0% { background-position: 100% 0; }
    100% { background-position: 0 0; }
}

@media (prefers-reduced-motion: reduce) {
    .cbqp__sk {
        animation: none !important;
    }
}

@media (hover: hover) and (pointer: fine) {
    .cbqp__item:hover {
        background: rgba(255, 255, 255, 0.06);
    }
    .cbqp__item:hover .cbqp__play {
        opacity: 1;
    }
}

@media (min-width: 1400px) {
    .cbqp__grid {
        grid-auto-columns: calc((100% + 44px) / 5.3 - 44px);
    }
}

@media (max-width: 991px) {
    .cbqp__h {
        font-size: 20px;
    }
    .cbqp__grid {
        grid-auto-columns: calc((100% + 30px) / 2.3 - 30px);
        gap: 8px 30px;
    }
}

@media (max-width: 575px) {
    .cbqp__grid {
        grid-auto-columns: calc((100% + 12px) / 1.15 - 12px);
        gap: 4px 12px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .cbqp__grid {
        scroll-behavior: auto !important;
    }
    .cbqp__item,
    .cbqp__play,
    .cbqp__nav,
    .cbqp__all {
        transition: none !important;
    }
}



.game-skel,
.game-skel__img,
.game-skel__img.skel {
    width: 100% !important;
    max-width: 100% !important;
}

.game-skel__img,
.game-skel__img.skel {
    aspect-ratio: 256 / 359 !important;
    height: auto !important;
    min-height: 0 !important;
    display: block !important;
    border-radius: 11px !important;
}

.modal-dialog:has(.global-modal__body),
.modal-content:has(.global-modal__body),
.modal-box:has(.global-modal__body) {
    width: auto !important;
    max-width: 480px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.modal-body:has(.global-modal__body) {
    width: 100% !important;
    max-width: 480px !important;
    margin: 0 auto !important;
    padding: 8px !important;
}

.global-modal__head {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 0 6px !important;
}

.global-modal__body {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
}

.global-modal__imageBtn {
    display: block !important;
    width: 100% !important;
    max-width: min(440px, 86vw) !important;
    margin: 0 auto !important;
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
    line-height: 0 !important;
    font-size: 0 !important;
    cursor: pointer !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5) !important;
    transition: transform 0.2s ease !important;
}

.global-modal__imageBtn:hover {
    transform: translateY(-2px) !important;
}

.global-modal__img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 1 / 1 !important;
    object-fit: cover !important;
    object-position: center !important;
    border-radius: 16px !important;
}

@media (prefers-reduced-motion: reduce) {
    .global-modal__imageBtn {
        transition: none !important;
    }
    .global-modal__imageBtn:hover {
        transform: none !important;
    }
}