@layer theme {
  /* Brand */
  :root {
    /* Bet Box */
    /* color */
    --color-comp-banner-bg-default: rgb(38 38 38);
    --color-comp-banner-content-default: rgb(255 255 255);
    --color-comp-banner-content-highlight: var(--color-accent-default);
    --color-comp-card-ring: rgb(255 255 255 / 0);
    --color-comp-header-bg: rgb(0 0 0 / 0);
    --color-comp-header-overlay-bg: var(--color-neutral-surface-low);
    --color-comp-header-button-content: var(--color-neutral-content-secondary);
    --color-comp-header-cta-button-bg: var(--color-brand-default);
    --color-comp-header-cta-button-content: var(--color-neutral-surface-lowest);
    --color-comp-input-bg: var(--color-neutral-surface-lowest);
    --color-comp-nav-menu-bg: var(--color-neutral-surface-lowest);
    --color-comp-nav-menu-content: var(--color-neutral-content-primary);
    --color-comp-nav-menu-button-content: var(--color-neutral-content-secondary);
    --color-comp-nav-menu-tab-border-activated: var(--color-brand-default);
    --color-comp-nav-menu-tab-icon-activated: var(--color-brand-default);
    --color-comp-nav-menu-tab-icon-default: var(--color-neutral-content-secondary);
    --color-comp-nav-menu-tab-label-activated: var(--color-neutral-content-primary);
    --color-comp-nav-menu-tab-label-default: var(--color-neutral-content-secondary);
    --color-comp-navbar-bg: var(--color-neutral-surface-high);
    --color-comp-navbar-tab-border-activated: var(--color-brand-default);
    --color-comp-navbar-tab-icon-activated: var(--color-brand-default);
    --color-comp-navbar-tab-icon-default: var(--color-neutral-content-secondary);
    --color-comp-navbar-tab-label-activated: var(--color-neutral-content-primary);
    --color-comp-navbar-tab-label-default: var(--color-neutral-content-secondary);
    --color-comp-thumbnail-bg: var(--color-brand-surface);
    --color-comp-thumbnail-content: var(--color-brand-default);
    --color-accent-default: rgb(255 227 9);
    --color-brand-default: rgb(255 227 9);
    --color-brand-onDefault: rgb(41 34 2);
    --color-brand-ring: rgb(82 68 3);
    --color-brand-surface: rgb(41 34 2);
    --color-fade-default: rgb(28 30 38 / 0);
    --color-fade-high: rgb(38 41 51 / 0);
    --color-fade-low: rgb(18 20 26 / 0);
    --color-fade-lowest: rgb(0 0 0 / 0);
    --color-info-default: rgb(89 153 218);
    --color-info-onDefault: rgb(242 247 252);
    --color-info-ring: rgb(25 47 95);
    --color-info-surface: rgb(6 11 21);
    --color-negative-default: rgb(228 85 79);
    --color-negative-onDefault: rgb(253 246 246);
    --color-negative-outline: rgb(102 23 12);
    --color-negative-surface: rgb(16 4 2);
    --color-neutral-content-primary: rgb(255 255 255);
    --color-neutral-content-secondary: rgb(189 201 222);
    --color-neutral-content-tertiary: rgb(120 143 187);
    --color-neutral-ring-default: rgb(61 82 117);
    --color-neutral-ring-subtle: rgb(39 55 81);
    --color-neutral-surface-high: rgb(18 26 38);
    --color-neutral-surface-low: rgb(10 13 20);
    --color-neutral-surface-lowest: rgb(0 0 0);
    --color-positive-default: rgb(78 188 98);
    --color-positive-onDefault: rgb(239 250 239);
    --color-positive-outline: rgb(45 90 43);
    --color-positive-surface: rgb(15 29 16);
    --color-states-focus: var(--color-info-default);
    --color-states-loading-gradient-0: rgb(255 255 255 / 0);
    --color-states-loading-gradient-100: rgb(255 255 255 / 0);
    --color-states-loading-gradient-50: rgb(255 255 255 / 0.3);
    --color-warning-default: rgb(246 179 66);
    --color-warning-onDefault: rgb(255 251 245);
    --color-warning-outline: rgb(113 43 10);
    --color-warning-surface: rgb(27 10 2);
    /* number */
    --radius-comp-button-sm: var(--radius-sm);
    --radius-comp-button-xs: var(--radius-sm);
    --radius-comp-button-md: var(--radius-md);
    --radius-comp-button-sm-focus: var(--radius-md);
    --radius-comp-button-xs-focus: var(--radius-md);
    --radius-comp-button-lg: var(--radius-lg);
    --radius-comp-button-md-focus: var(--radius-lg);
    --radius-comp-button-lg-focus: var(--radius-xl);
    --radius-comp-card-default: var(--radius-xl);
    --radius-comp-input-default: var(--radius-md);
    --radius-comp-nav-menu-list-item-button: var(--radius-sm);
    --radius-comp-nav-menu-card: var(--radius-md);
    --radius-comp-nav-menu-list-item: var(--radius-md);
    --radius-comp-tab-bar: var(--radius-xl);
    --radius-comp-tab-default: var(--radius-md);
    --radius-comp-tab-focus: var(--radius-lg);
    --radius-xs: 4px;
    --radius-sm: 6px;
    --radius-md: 8px;
    --radius-lg: 10px;
    --radius-xl: 12px;
    --radius-2xl: 14px;
    --radius-3xl: 16px;
    --radius-4xl: 18px;
    --radius-5xl: 24px;
    --radius-full: 1000px;
    --typography-font-weight-default-regural: 400;
    --typography-font-weight-default-semi-bold: 600;
    --typography-font-weight-display: 600;
    --typography-letter-spacing-default: 0px;
    --typography-letter-spacing-display: 0px;
    /* string */
    --components-atoms-logo: bet-box;
    --components-molecules-game-tile: 1;
    --components-molecules-promo-banner: 1;
    --components-organisms-game-providers-section: 1;
    --components-organisms-games-section: 1;
    --components-organisms-hero-section: 1;
    --components-organisms-leaderboards-section: 1;
    --components-organisms-races-section: 1;
    --components-organisms-recent-big-wins-section: 1;
    --components-organisms-faq-section: 1;
    --components-organisms-themes-section: 1;
    --typography-font-family-default: var(--font-roboto);
    --typography-font-family-display: var(--font-roboto);
  }
}
