:root {
    --primary-accent-color: #F4A116;
    --primary-gradient: linear-gradient(180deg, var(--primary-accent-color) 0%, #F68A11 33%, #FA6809 66%, #FC5705 100%);
    --secondary-accent-color: #FFCA00;
    --secondary-gradient: linear-gradient(180deg, var(--secondary-accent-color) 0%, #F9B907 33%, #F2A20F 66%, #F2A20F 100%);
    --tertiary-accent-color: #44CC38;
    --tertiary-accent-color-2: #36AA2D;
    --tertiary-gradient: linear-gradient(180deg, var(--tertiary-accent-color) 0%, var(--tertiary-accent-color-2) 100%);
    --color-body-text: white;
    --primary-button-font-color: #FFFFFF;
    --secondary-button-font-color: #FFFFFF;
    --bg-tier-1: #160042;
    --bg-tier-1-gradient: linear-gradient(180deg, var(--bg-tier-1) 0%, var(--bg-tier-1) 100%);
    --bg-tier-2: #220065;
    --bg-tier-2-gradient: linear-gradient(180deg, var(--bg-tier-2) 0%, var(--bg-tier-2) 100%);
    --bg-tier-3: #5713BD;
    --bg-tier-3-gradient: linear-gradient(180deg, var(--bg-tier-3) 0%, #470EA4 33%, #31087F 66%, #220367 100%);
    --footer-text-color: var(--color-body-text);
    --footer-background-color: #000;
    --error-gradient: linear-gradient(180deg, #ED0A8C 0%, #F11A8C 33%, #F62E8C 66%, #F93C8C 100%);
    --link-color: #FFCA00;
    --button-border-width: 0px;
    --color-footer-nav-bg: var(--bg-tier-3-gradient);
    /* No real color codes (i.e. #FFFFFF) should be used beyond this point. Only refer to variables. */
    --checkbox-bg-color: transparent;
    --checked-checkbox-bg-color: var(--primary-gradient);
    --color-primary-button-bg: var(--tertiary-gradient);
    --color-secondary-button-bg: var(--secondary-gradient);
    --color-header-bg: var(--bg-tier-3-gradient);
    --color-landing-nopurchase-bg: var(--bg-tier-2-gradient);
    --color-login-block-bg: var(--bg-tier-3-gradient);
    --login-input-border-width: 2px;
    --color-login-input-border: var(--primary-accent-color);
    --color-login-input: var(--bg-tier-2-gradient);
    --color-login-bg: var(--bg-tier-1-gradient);
    --color-signup-input-border: var(--primary-accent-color);
    --color-signup-input-bg: var(--bg-tier-3-gradient);
    --signup-input-border-width: 2px;
    --color-current-loyalty-level-bg: var(--primary-accent-color);
    --color-profile-input-bg: var(--bg-tier-3-gradient);
    --color-app-header-bg: var(--bg-tier-3-gradient);
    --color-sidebar-bg: var(--bg-tier-2-gradient);
    --color-menu-body-bg: var(--bg-tier-2-gradient);
    --color-bg: var(--bg-tier-1-gradient);
    /*font*/
    --heading-font: "Luckiest Guy", sans-serif;
    --body-font: "Bricolage Grotesque", sans-serif;
    --font-numbers: var(--body-font);
    --color-category-font-weight: 600;
    --font-main-buttons-fw: 400;
    --font-primary: var(--heading-font);
    --font-secondary: var(--body-font);
    --font-numbers-font: inherit;
    --text-font-family: var(--body-font);
    --lending-page-text-ff: var(--body-font);
    --text-promotion-font-family: var(--body-font);
    --font-family-nexa: var(--font-primary);
    --mobile-nav-font-family: var(--font-primary);
    --subtitle-font: var(--heading-font);
    --mobile-nav-font-size: var(--text-xs);
    --text-font-family: var(--body-font);
    --subtitle-font: var(--body-font);
    --tracking-1: -1px;
    --color-level-progress-bg-start: var(--color-body-text);
    --color-level-progress-bg-end: var(--primary-accent-color);
    --color-footer-nav-balance-bg: #0D182F;
    --color-footer-nav-balance-text: #F8CB46;
    --footer-button-border-color: var(--color-body-text);
    --font-weight-black: 400;
    --redeem-holdings-bg-color: var(--primary-gradient);
    --header-background-webp: var(--color-sidebar-bg);
    --landing-feedback-background: var(--bg-tier-1-gradient);
    --landing-feedback-nested-background: var(--bg-tier-2-gradient);
    --category-link-text-color: var(--color-body-text);
    --color-category-border: var(--bg-tier-3);
    --category-link-border-style: solid;
    --color-header-items-bg: var(--bg-tier-1-gradient);
    --primary-badge-padding: 8px 6px !important;
    --modal-verification-input-bg-color: var(--bg-tier-1-gradient);
    --loyalty-level-1-gradient: linear-gradient(211.71deg, #ED0A8C 7.3%, #F93C8C 92.7%);
    --loyalty-level-2-gradient: linear-gradient(220.46deg, #73E39B 7.3%, #4CB871 96.61%);
    --loyalty-level-3-gradient: linear-gradient(220.92deg, #A3A6FF 7.3%, #6589FD 96.91%);
    --loyalty-level-4-gradient: linear-gradient(226.69deg, #DDE3CF 7.3%, #CBCED2 98.61%);
    --color-toggle-switch-bg: var(--bg-tier-3-gradient);
    --loyalty-bar-track-color: var(--color-body-text);
    --success-badge-text-shadow: var(--shadow-primary-bottom-md);
    --error-badge-background-color: var(--bg-tier-1);
    --error-badge-font-color: var(--primary-accent-color);
    --error-badge-border-style: solid;
    --error-badge-border-width: 2px;
    --error-badge-border-color: var(--primary-accent-color);
    --no-promotions-background-gradient: var(--bg-tier-2-gradient);
    --primary-badge-text-shadow: var(--shadow-primary-bottom-md);
    --bullet-point-display: none;
    --loyalty-button-font-color: var(--color-body-text);
    --loyalty-button-bg-color: var(--bg-tier-3-gradient);
    --loyalty-button-bg-color-hover: var(--secondary-gradient);
    --loyalty-button-outline-color: #9100CF;
    --loyalty-button-outline-style: solid;
    --loyalty-button-outline-width: 2px;
    --loyalty-button-outline-offset: -2px;
    --loyalty-button-outline-color-hover: transparent;
    --loyalty-button-outline-style-hover: none;
    --loyalty-button-outline-width-hover: 0px;
    --loyalty-button-outline-offset-hover: 0px;
    --side-menu-background-background: var(--bg-tier-2-gradient);
    --currency-toggle-backround-gradient: var(--bg-tier-3-gradient);
    --coin-store-sc-badge-bottom-margin: 2px;
    --section-title-color: var(--color-body-text);
}

.primary-button, .secondary-button, .shop-button {
    text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
}

.landing-games__star, .landing-hero__star-icon {
    display: none;
}

.landing-hero__title-line-2 .lh-4, .landing-usp__item-title {
    background: var(--secondary-gradient);
    background-clip: text;
    color: transparent !important;
    text-shadow: none;
}

.landing-hero__title, .landing-hero__title-line-2 {
    font-weight: 400 !important;
}

.landing-hero__subtitle {
    font-family: var(--heading-font);
    line-height: 1;
    font-size: var(--text-xl-plus);
}

    .landing-hero__subtitle.line-2 {
        background: var(--secondary-gradient);
        background-clip: text;
        color: transparent;
        text-shadow: none;
    }

.landing-hero__button > .landing-hero-button-subtitle {
    font-family: var(--body-font);
    font-size: 2.3rem !important;
    letter-spacing: -1px;
    font-weight: 600;
}

.landing-games__no-purchases {
    border-width: 2px;
}

.landing-provider, .landing-feedback, .lobby__main {
    background: var(--bg-tier-1-gradient);
}

.landing-usp, .landing-coins {
    background: var(--bg-tier-2-gradient);
}

.landing-top-pick {
    background: var(--bg-tier-3-gradient);
}

.sign-up__link {
    color: var(--link-color) !important;
}

.side-menu__nav-link:hover {
    color: var(--primary-accent-color) !important;
}

.loyalty__progress-bar {
    padding-top: 25px;
    padding-bottom: 15px;
}

.primary-button, .secondary-button, .shop-button {
    padding: 5px 18px !important;
}

.landing-top-pick__cta {
    font-size: 40px;
}

/*mobile*/
@media (max-width: 1024px) {
    .landing-top-pick__cta {
        font-size: 20px;
    }

    .landing-games__no-purchases-title {
        background: var(--secondary-gradient);
        background-clip: text;
    }
}

.refer-a-friend__copy-button {
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
}

.refer-a-friend__link-input {
    background: var(--bg-tier-1-gradient);
}

.side-menu__user-profile {
    background: var(--bg-tier-1-gradient);
}

.side-menu__user-info, .app-header__loyalty {
    display: flex;
}

.leading-game__loby {
    border: 2px solid var(--primary-accent-color);
}

.landing-top-pick__title.line-1 {
    background: linear-gradient(180deg, var(--color-body-text) 0%, var(--color-body-text) 100%);
    background-clip: text;
    font-size: var(--text-3xl);
}

.landing-top-pick__title.line-2 {
    background: var(--secondary-gradient);
    background-clip: text;
    font-size: var(--text-4xl);
}

.main-lobby__category-icon {
    color: var(--color-body-text);
}

.side-menu__user-profile {
    border-radius: 10px !important;
    padding-bottom: 0px;
}

.footer-nav__shop-button__label {
    color: var(--primary-button-font-color) !important;
}

.side-menu__nav-link {
    letter-spacing: 0;
}

.alt-login__section {
    background: var(--bg-tier-3-gradient);
}

.promotion-page__card-title {
    font-weight: 400;
}