/* Auto-generated — do not edit. Run: node scripts/generate-brand-css.js */
.brand-north-spin {
  --color-neutral-50: #b5d0de;
  --color-neutral-100: #8b86f7;
  --color-neutral-150: #6050bd;
  --color-neutral-200: #5346a3;
  --color-neutral-300: #433985;
  --color-neutral-400: #372e6b;
  --color-neutral-500: #2a2857;
  --color-neutral-600: #222245;
  --color-neutral-700: #1c1a3f;
  --color-neutral-800: #111433;
  --color-neutral-900: #0e1029;
  --color-neutral-1000: #070814;
  --color-neutral-100-50: #8b86f780;
  --color-neutral-400-0: #372e6b;
  --color-neutral-700-0: #1c1a3f;
  --color-neutral-1000-70: #070814b2;
  --color-red-400: #ff4040;
  --color-red-500: #c51b1b;
  --color-red-400-10: #ff40401a;
  --color-red-400-15: #ff404026;
  --color-red-400-30: #ff40404d;
  --color-pink-300: #f761ff;
  --color-pink-400: #ff0098;
  --color-yellow-300: #ffd480;
  --color-yellow-400: #fff310;
  --color-yellow-500: #fec33e;
  --color-yellow-700: #ff7a00;
  --color-yellow-300-30: #ffd4804d;
  --color-yellow-500-10: #fec33e1a;
  --color-yellow-500-30: #fec33e4d;
  --color-green-500: #43f58a;
  --color-green-600: #15d161;
  --color-green-700: #24a15e;
  --color-green-500-30: #43f58a4d;
  --color-green-600-10: #15d1611a;
  --color-green-600-30: #15d1614d;
  --color-blue-400: #2183f6;
  --color-blue-500: #4c4dff;
  --color-blue-400-10: #2183f61a;
  --color-blue-400-30: #2183f64d;
  --color-alpha-10: #ffffff1a;
  --color-alpha-15: #ffffff26;
  --color-alpha-25: #ffffff40;
  --color-alpha-40: #ffffff66;
  --color-alpha-50: #ffffff80;
  --color-alpha-60: #ffffff99;
  --color-alpha-contrast: #ffffff;
  --color-alpha-contrast-60: #ffffff99;
  --color-alpha-contrast-50: #ffffff80;
  --color-alpha-contrast-40: #ffffff66;
  --color-alpha-contrast-10: #ffffff1a;
  --color-alpha-default: #ffffff;
  --font-family-sans: Inter, sans-serif;
  --font-size-xs: 12px;
  --line-height-xs: 140%;
  --font-size-sm: 14px;
  --line-height-sm: 140%;
  --font-size-base: 16px;
  --line-height-base: 140%;
  --font-size-lg: 18px;
  --line-height-lg: 140%;
  --font-size-xl: 20px;
  --line-height-xl: 140%;
  --font-size-xxl: 22px;
  --line-height-xxl: 140%;
  --font-size-2xl: 24px;
  --line-height-2xl: 140%;
  --font-size-3xl: 28px;
  --line-height-3xl: 140%;
  --font-size-4xl: 32px;
  --line-height-4xl: 140%;
  --font-size-5xl: 36px;
  --line-height-5xl: 140%;
  --font-size-6xl: 38px;
  --line-height-6xl: 140%;
  --font-size-7xl: 48px;
  --line-height-7xl: 140%;
  --font-size-8xl: 56px;
  --line-height-8xl: 140%;
  --font-size-h1: 28px;
  --line-height-h1: 140%;
  --font-weight-h1: 600;
  --font-size-h2: 24px;
  --line-height-h2: 140%;
  --font-weight-h2: 600;
  --font-size-h3: 20px;
  --line-height-h3: 140%;
  --font-weight-h3: 600;
  --font-size-h4: 18px;
  --line-height-h4: 140%;
  --font-weight-h4: 600;
  --font-size-h5: 16px;
  --line-height-h5: 140%;
  --font-weight-h5: 600;
  --font-size-text: 14px;
  --line-height-text: 140%;
  --font-weight-text: 400;
  --font-size-list: 14px;
  --line-height-list: 140%;
  --font-weight-list: 400;
  --font-size-link: 14px;
  --line-height-link: 140%;
  --font-weight-link: 400;
  --border-radius-xs: 2px;
  --border-radius-sm: 4px;
  --border-radius-md: 6px;
  --border-radius-lg: 8px;
  --border-radius-xl: 12px;
  --border-radius-1-5xl: 14px;
  --border-radius-2xl: 16px;
  --border-radius-2-5xl: 20px;
  --border-radius-3xl: 24px;
  --border-radius-4xl: 28px;
  --border-radius-5xl: 32px;
  --border-radius-6xl: 36px;
  --border-radius-7xl: 40px;
  --border-radius-none: 0px;
  --border-radius-DEFAULT: 4px;
  --border-radius-full: 9999px;
  --bg-basic-1000: var(--color-neutral-1000);
  --bg-basic-1000-70: var(--color-neutral-1000-70);
  --bg-basic-900: var(--color-neutral-900);
  --bg-basic-800: var(--color-neutral-800);
  --bg-basic-700: var(--color-neutral-700);
  --bg-basic-600: var(--color-neutral-600);
  --bg-basic-500: var(--color-neutral-500);
  --bg-basic-400: var(--color-neutral-400);
  --bg-basic-300: var(--color-neutral-300);
  --bg-basic-200: var(--color-neutral-200);
  --bg-basic-150: var(--color-neutral-150);
  --bg-basic-100: var(--color-neutral-100);
  --bg-basic-50: var(--color-neutral-50);
  --bg-basic-000-10: var(--color-alpha-10);
  --bg-basic-000-60: var(--color-alpha-60);
  --bg-basic-000-contrast: var(--color-alpha-contrast);
  --hidden-bg: var(--color-neutral-700-0);
  --bg-accent-1: var(--color-blue-500);
  --bg-accent-2: var(--color-blue-400);
  --bg-accent-3: var(--color-yellow-700);
  --bg-accent-4: var(--color-yellow-400);
  --bg-accent-5: var(--color-yellow-300);
  --bg-accent-6: var(--color-yellow-300-30);
  --bg-accent-7: var(--color-pink-400);
  --bg-accent-8: var(--color-blue-400);
  --bg-accent-9: var(--color-green-500);
  --bg-accent-10: var(--color-green-500-30);
  --bg-accent-11: var(--color-red-500);
  --bg-accent-12: var(--color-neutral-800);
  --bg-accent-13: var(--color-neutral-500);
  --bg-semantic-error: var(--color-red-400);
  --bg-semantic-error-10: var(--color-red-400-10);
  --bg-semantic-warning: var(--color-yellow-500);
  --bg-semantic-warning-10: var(--color-yellow-500-10);
  --bg-semantic-success: var(--color-green-600);
  --bg-semantic-success-10: var(--color-green-600-10);
  --bg-semantic-extra: var(--color-blue-400);
  --bg-semantic-extra-10: var(--color-blue-400-10);
  --border-control-border-default: var(--color-alpha-40);
  --border-control-border-active: var(--color-yellow-300);
  --bg-control-bg-active: var(--color-yellow-300);
  --text-control-icon-default: var(--color-alpha-40);
  --text-control-icon-active: var(--color-neutral-1000);
  --bg-control-icon-default: var(--color-alpha-40);
  --bg-control-icon-active: var(--color-neutral-1000);
  --border-basic-500: var(--color-neutral-500);
  --border-basic-400: var(--color-neutral-400);
  --hidden-border: var(--color-neutral-400-0);
  --border-basic-200: var(--color-neutral-200);
  --border-basic-000-40: var(--color-alpha-40);
  --border-basic-000-10: var(--color-alpha-10);
  --border-accent-1: var(--color-blue-500);
  --border-accent-2: var(--color-blue-400);
  --border-accent-3: var(--color-yellow-700);
  --border-accent-4: var(--color-yellow-400);
  --border-accent-5: var(--color-yellow-300);
  --border-accent-6: var(--color-yellow-300-30);
  --border-accent-7: var(--color-pink-400);
  --border-accent-8: var(--color-blue-400);
  --border-accent-9: var(--color-green-500);
  --border-accent-10: var(--color-green-500-30);
  --border-accent-11: var(--color-red-500);
  --border-accent-12: var(--color-neutral-800);
  --border-accent-13: var(--color-neutral-500);
  --border-error: var(--color-red-400);
  --border-error-30: var(--color-red-400-30);
  --border-warning: var(--color-yellow-500);
  --border-warning-30: var(--color-yellow-500-30);
  --border-success: var(--color-green-600);
  --border-success-30: var(--color-green-600-30);
  --border-extra: var(--color-blue-400);
  --border-extra-30: var(--color-blue-400-30);
  --bg-di-bg-default: var(--color-neutral-500);
  --bg-di-bg-hover: var(--color-neutral-400);
  --bg-di-bg-active: var(--color-neutral-400);
  --border-di-border-default: var(--color-neutral-300);
  --border-di-border-active: var(--color-neutral-100);
  --border-di-border-focus: var(--color-neutral-100);
  --border-di-border-error: var(--color-red-400);
  --text-di-text-placeholder: var(--color-alpha-50);
  --text-di-text: var(--color-alpha-default);
  --text-di-icon-default: var(--color-alpha-50);
  --text-di-icon-active: var(--color-alpha-default);
  --button-primary-bg-default: linear-gradient(105deg, #ffa600 7.22%, #f59f00 94.19%);
  --button-primary-bg-hover: linear-gradient(280deg, #f59f00 0%, #ffa600 100%);
  --button-primary-border-default: var(--color-alpha-contrast-10);
  --button-primary-border-hover: var(--bg-gradient-5);
  --button-primary-text-default: var(--color-neutral-1000);
  --button-primary-text-active: var(--color-neutral-1000);
  --button-primary-icon-default: var(--color-neutral-1000);
  --button-primary-icon-active: var(--color-neutral-1000);
  --button-secondary-bg-default: var(--color-neutral-500);
  --button-secondary-bg-active: var(--color-neutral-300);
  --button-secondary-border-default: var(--color-neutral-300);
  --button-secondary-border-active: var(--color-alpha-10);
  --button-secondary-text-default: var(--color-alpha-default);
  --button-secondary-text-active: var(--color-alpha-contrast);
  --button-secondary-icon-default: var(--color-alpha-50);
  --button-secondary-icon-active: var(--color-alpha-contrast);
  --button-extra-bg-default: linear-gradient(96deg, #fea501 2.2%, #b93131 100%);
  --button-extra-bg-hover: linear-gradient(280deg, #fea501 0%, #b93131 100%);
  --button-extra-border-default: var(--color-alpha-contrast-10);
  --button-extra-border-hover: var(--color-alpha-contrast-20);
  --button-extra-text-default: var(--color-neutral-1000);
  --button-extra-text-active: var(--color-neutral-1000);
  --button-extra-icon-default: var(--color-neutral-1000);
  --button-extra-icon-active: var(--color-neutral-1000);
  --button-extra2-bg-default: var(--color-alpha-contrast-10);
  --button-extra2-bg-active: var(--color-alpha-contrast);
  --button-extra2-border-default: var(--color-alpha-contrast-40);
  --button-extra2-border-active: var(--color-alpha-contrast);
  --button-extra2-text-default: var(--color-alpha-contrast);
  --button-extra2-text-active: var(--color-neutral-1000);
  --button-extra2-icon-default: var(--color-alpha-contrast);
  --button-extra2-icon-active: var(--color-neutral-1000);
  --button-blurred-bg-default: var(--color-alpha-10);
  --button-blurred-bg-active: var(--color-alpha-default);
  --button-blurred-border-default: var(--color-alpha-10);
  --button-blurred-border-active: var(--color-alpha-contrast);
  --button-blurred-text-default: var(--color-alpha-contrast);
  --button-blurred-text-active: var(--color-neutral-900);
  --button-blurred-icon-default: var(--color-alpha-default);
  --button-blurred-icon-active: var(--color-neutral-900);
  --border-button-play-border-default: #f6a000;
  --bg-button-play-bg-hover: linear-gradient(139deg, #fea501 1.08%, #f6a000 96.23%);
  --text-primary: var(--color-alpha-default);
  --text-secondary: var(--color-alpha-50);
  --text-contrast: var(--color-alpha-contrast);
  --text-banner-contrast: var(--color-alpha-contrast);
  --text-accent-1: var(--color-blue-500);
  --text-accent-2: var(--color-blue-400);
  --text-accent-3: var(--color-yellow-700);
  --text-accent-4: var(--color-yellow-400);
  --text-accent-5: var(--color-yellow-300);
  --text-accent-6: var(--color-yellow-300-30);
  --text-accent-7: var(--color-pink-400);
  --text-accent-8: var(--color-blue-400);
  --text-accent-9: var(--color-green-500);
  --text-accent-10: var(--color-green-500-30);
  --text-accent-11: var(--color-red-500);
  --text-accent-12: var(--color-neutral-800);
  --text-accent-13: var(--color-neutral-500);
  --text-error: var(--color-red-400);
  --text-warning: var(--color-yellow-500);
  --text-success: var(--color-green-600);
  --text-extra: var(--color-blue-400);
  --icon-basic-contrast: var(--color-alpha-contrast);
  --icon-basic-white: var(--color-alpha-contrast);
  --icon-basic-white-50: var(--color-alpha-50);
  --icon-basic-white-25: var(--color-alpha-25);
  --icon-basic-100: var(--color-neutral-100);
  --icon-basic-100-50: var(--color-neutral-100-50);
  --icon-accent-1: var(--color-blue-500);
  --icon-accent-2: var(--color-blue-400);
  --icon-accent-3: var(--color-yellow-700);
  --icon-accent-4: var(--color-yellow-400);
  --icon-accent-5: var(--color-yellow-300);
  --icon-accent-6: var(--color-yellow-300-30);
  --icon-accent-7: var(--color-pink-400);
  --icon-accent-8: var(--color-blue-400);
  --icon-accent-9: var(--color-green-500);
  --icon-accent-10: var(--color-green-500-30);
  --icon-accent-11: var(--color-red-500);
  --icon-accent-12: var(--color-neutral-800);
  --icon-accent-13: var(--color-neutral-500);
  --icon-error: var(--color-red-400);
  --icon-warning: var(--color-yellow-500);
  --icon-success: var(--color-green-600);
  --icon-extra: var(--color-blue-400);
  --icon-default-sidebar: var(--color-neutral-100);
  --icon-active-sidebar: var(--color-neutral-100);
  --icon-default-category: var(--color-alpha-50);
  --icon-active-category: var(--color-alpha-default);
  --icon-idle-category: var(--color-neutral-100);
  --bg-step-back: var(--color-neutral-400);
  --bg-step-progress: var(--color-blue-400);
  --bg-game-hover: linear-gradient(180deg, rgba(14, 16, 41, 0.7) 0%, rgba(14, 16, 41, 0.2) 100%);
  --bg-label-top: linear-gradient(180deg, #ff7a00 0%, #ec3900 100%);
  --bg-label-new: linear-gradient(180deg, #1ea956 0%, #186e3a 100%);
  --bg-label-crypto: linear-gradient(180deg, #9a4cf8 0%, #7813ae 100%);
  --bg-gradient-vip-sign: linear-gradient(180deg, #f4e38b -24.36%, #f4dd62 23.01%, #b27f2a 100%);
  --bg-gradient-0-700: linear-gradient(270deg, #1c1a3f 0%, rgba(28, 26, 63, 0) 100%);
  --bg-gradient-0-800: linear-gradient(180deg, rgba(17, 20, 51, 0) 0%, #111433 100%);
  --bg-gradient-1: linear-gradient(188deg, #dcab20 -7.28%, #7b61ff 96.79%);
  --bg-gradient-2: linear-gradient(180deg, #f4e38b -24.36%, #f4dd62 23.01%, #b27f2a 100%);
  --bg-gradient-3: linear-gradient(153deg, #58cdff 4.38%, #2756fe 81.13%);
  --bg-gradient-4: linear-gradient(153deg, #199258 4.38%, #03c14f 81.13%);
  --bg-gradient-service-page: radial-gradient(
    67.63% 97.68% at 50% 0%,
    #222245 0%,
    #0d0d2b 64.25%,
    #06061f 87.18%,
    #090a15 100%
  );
  --bg-gradient-collection-card: linear-gradient(180deg, #3b3b78 -149.6%, #01120f 81.2%);
  --bg-gradient-loader: radial-gradient(
    104.17% 118.85% at 50% 0%,
    #222245 0%,
    #0d0d2b 50%,
    #000b0a 100%
  );
  --bg-gradient-bubble-menu: radial-gradient(
    35.44% 35.44% at 50% 64.56%,
    rgba(33, 27, 71, 0.9) 46%,
    rgba(17, 20, 51, 0.9) 100%
  );
  --bg-gradient-vip-card: radial-gradient(
    138.69% 41.85% at 50% 0%,
    #051413 0%,
    #051413 30%,
    #051413 100%
  );
}

.brand-north-spin.light {
  --color-neutral-50: #b5ded9;
  --color-neutral-100: #6f74b2;
  --color-neutral-150: #5d63a6;
  --color-neutral-200: #51579c;
  --color-neutral-300: #a199d1;
  --color-neutral-400: #d6dbe2;
  --color-neutral-500: #e9eef5;
  --color-neutral-600: #f9fbfc;
  --color-neutral-700: #ffffff;
  --color-neutral-800: #f5f7f9;
  --color-neutral-900: #eceff4;
  --color-neutral-1000: #070814;
  --color-neutral-100-50: #6f74b280;
  --color-neutral-1000-70: #070814b2;
  --color-red-400: #ff4040;
  --color-red-500: #c51b1b;
  --color-red-400-10: #ff40401a;
  --color-red-400-15: #ff404026;
  --color-red-400-35: #ff40404d;
  --color-pink-300: #f761ff;
  --color-pink-400: #ff0098;
  --color-yellow-300: #f9a200;
  --color-yellow-400: #fab83c;
  --color-yellow-500: #fac055;
  --color-yellow-700: #e09200;
  --color-yellow-300-30: #f9a2004d;
  --color-yellow-500-10: #fac0551a;
  --color-yellow-500-30: #fac0554d;
  --color-blue-400: #2183f6;
  --color-blue-500: #4c4dff;
  --color-blue-400-10: #2183f61a;
  --color-blue-400-30: #2183f64d;
  --color-green-500: #43f58a;
  --color-green-600: #15d161;
  --color-green-700: #24a15e;
  --color-green-500-30: #43f58a4d;
  --color-green-600-10: #15d1611a;
  --color-green-600-30: #15d1614d;
  --color-alpha-10: #27272a1a;
  --color-alpha-15: #27272a26;
  --color-alpha-25: #27272a40;
  --color-alpha-40: #27272a66;
  --color-alpha-50: #27272a80;
  --color-alpha-60: #27272a99;
  --color-alpha-contrast: #ffffff;
  --color-alpha-contrast-60: #ffffff99;
  --color-alpha-contrast-50: #ffffff80;
  --color-alpha-contrast-40: #ffffff66;
  --color-alpha-contrast-10: #ffffff1a;
  --color-alpha-default: #27272a;
  --color-error: #f87171;
  --color-warning: #fbbf24;
  --color-success: #4ade80;
  --color-extra: #60a5fa;
  --border-radius-xs: 2px;
  --border-radius-sm: 4px;
  --border-radius-md: 6px;
  --border-radius-lg: 8px;
  --border-radius-xl: 12px;
  --border-radius-1-5xl: 14px;
  --border-radius-2xl: 16px;
  --border-radius-2-5xl: 20px;
  --border-radius-3xl: 24px;
  --border-radius-4xl: 28px;
  --border-radius-5xl: 32px;
  --border-radius-6xl: 36px;
  --border-radius-7xl: 40px;
  --border-radius-none: 0px;
  --border-radius-DEFAULT: 4px;
  --border-radius-full: 9999px;
  --bg-basic-1000: var(--color-neutral-1000);
  --bg-basic-1000-70: var(--color-neutral-1000-70);
  --bg-basic-900: var(--color-neutral-900);
  --bg-basic-800: var(--color-neutral-800);
  --bg-basic-700: var(--color-neutral-700);
  --bg-basic-600: var(--color-neutral-600);
  --bg-basic-500: var(--color-neutral-500);
  --bg-basic-400: var(--color-neutral-400);
  --bg-basic-300: var(--color-neutral-300);
  --bg-basic-200: var(--color-neutral-200);
  --bg-basic-150: var(--color-neutral-150);
  --bg-basic-100: var(--color-neutral-100);
  --bg-basic-50: var(--color-neutral-50);
  --bg-basic-000-10: var(--color-alpha-10);
  --bg-basic-000-60: var(--color-alpha-60);
  --bg-basic-000-contrast: var(--color-alpha-contrast);
  --hidden-bg: var(--color-neutral-700-0);
  --bg-accent-1: var(--color-blue-500);
  --bg-accent-2: var(--color-blue-400);
  --bg-accent-3: var(--color-yellow-700);
  --bg-accent-4: var(--color-yellow-400);
  --bg-accent-5: var(--color-yellow-300);
  --bg-accent-6: var(--color-yellow-300-30);
  --bg-accent-7: var(--color-pink-400);
  --bg-accent-8: var(--color-blue-400);
  --bg-accent-9: var(--color-green-500);
  --bg-accent-10: var(--color-green-500-30);
  --bg-accent-11: var(--color-red-500);
  --bg-accent-12: var(--color-neutral-800);
  --bg-accent-13: var(--color-neutral-500);
  --bg-semantic-error: var(--color-red-400);
  --bg-semantic-error-10: var(--color-red-400-10);
  --bg-semantic-warning: var(--color-yellow-500);
  --bg-semantic-warning-10: var(--color-yellow-500-10);
  --bg-semantic-success: var(--color-green-600);
  --bg-semantic-success-10: var(--color-green-600-10);
  --bg-semantic-extra: var(--color-blue-400);
  --bg-semantic-extra-10: var(--color-blue-400-10);
  --border-control-border-default: var(--color-alpha-40);
  --border-control-border-active: var(--color-yellow-300);
  --bg-control-bg-active: var(--color-yellow-300);
  --text-control-icon-default: var(--color-alpha-40);
  --text-control-icon-active: var(--color-neutral-1000);
  --bg-control-icon-default: var(--color-alpha-40);
  --bg-control-icon-active: var(--color-neutral-1000);
  --border-basic-500: var(--color-neutral-500);
  --border-basic-400: var(--color-neutral-400);
  --hidden-border: var(--color-neutral-400-0);
  --border-basic-200: var(--color-neutral-200);
  --border-basic-000-40: var(--color-alpha-40);
  --border-basic-000-10: var(--color-alpha-10);
  --border-accent-1: var(--color-blue-500);
  --border-accent-2: var(--color-blue-400);
  --border-accent-3: var(--color-yellow-700);
  --border-accent-4: var(--color-yellow-400);
  --border-accent-5: var(--color-yellow-300);
  --border-accent-6: var(--color-yellow-300-30);
  --border-accent-7: var(--color-pink-400);
  --border-accent-8: var(--color-blue-400);
  --border-accent-9: var(--color-green-500);
  --border-accent-10: var(--color-green-500-30);
  --border-accent-11: var(--color-red-500);
  --border-accent-12: var(--color-neutral-800);
  --border-accent-13: var(--color-neutral-500);
  --border-error: var(--color-red-400);
  --border-error-30: var(--color-red-400-30);
  --border-warning: var(--color-yellow-500);
  --border-warning-30: var(--color-yellow-500-30);
  --border-success: var(--color-green-600);
  --border-success-30: var(--color-green-600-30);
  --border-extra: var(--color-blue-400);
  --border-extra-30: var(--color-blue-400-30);
  --bg-di-bg-default: var(--color-neutral-500);
  --bg-di-bg-hover: var(--color-neutral-400);
  --bg-di-bg-active: var(--color-neutral-400);
  --border-di-border-default: var(--color-neutral-300);
  --border-di-border-active: var(--color-neutral-100);
  --border-di-border-focus: var(--color-neutral-100);
  --border-di-border-error: var(--color-red-400);
  --text-di-text-placeholder: var(--color-alpha-50);
  --text-di-text: var(--color-alpha-default);
  --text-di-icon-default: var(--color-alpha-50);
  --text-di-icon-active: var(--color-alpha-default);
  --button-primary-bg-default: linear-gradient(105deg, #ffa600 7.22%, #f59f00 94.19%);
  --button-primary-bg-hover: linear-gradient(280deg, #f59f00 0%, #ffa600 100%);
  --button-primary-border-default: var(--color-alpha-contrast-10);
  --button-primary-border-hover: var(--bg-gradient-5);
  --button-primary-text-default: var(--color-neutral-1000);
  --button-primary-text-active: var(--color-neutral-1000);
  --button-primary-icon-default: var(--color-neutral-1000);
  --button-primary-icon-active: var(--color-neutral-1000);
  --button-secondary-bg-default: var(--color-neutral-500);
  --button-secondary-bg-active: var(--color-neutral-300);
  --button-secondary-border-default: var(--color-neutral-300);
  --button-secondary-border-active: var(--color-alpha-10);
  --button-secondary-text-default: var(--color-alpha-default);
  --button-secondary-text-active: var(--color-alpha-contrast);
  --button-secondary-icon-default: var(--color-alpha-50);
  --button-secondary-icon-active: var(--color-alpha-contrast);
  --button-extra-bg-default: linear-gradient(96deg, #fea501 2.2%, #b93131 100%);
  --button-extra-bg-hover: linear-gradient(280deg, #fea501 0%, #b93131 100%);
  --button-extra-border-default: var(--color-alpha-contrast-10);
  --button-extra-border-hover: var(--color-alpha-contrast-20);
  --button-extra-text-default: var(--color-neutral-1000);
  --button-extra-text-active: var(--color-neutral-1000);
  --button-extra-icon-default: var(--color-neutral-1000);
  --button-extra-icon-active: var(--color-neutral-1000);
  --button-extra2-bg-default: var(--color-alpha-contrast-10);
  --button-extra2-bg-active: var(--color-alpha-contrast);
  --button-extra2-border-default: var(--color-alpha-contrast-40);
  --button-extra2-border-active: var(--color-alpha-contrast);
  --button-extra2-text-default: var(--color-alpha-contrast);
  --button-extra2-text-active: var(--color-neutral-1000);
  --button-extra2-icon-default: var(--color-alpha-contrast);
  --button-extra2-icon-active: var(--color-neutral-1000);
  --button-blurred-bg-default: var(--color-alpha-10);
  --button-blurred-bg-active: var(--color-alpha-default);
  --button-blurred-border-default: var(--color-alpha-10);
  --button-blurred-border-active: var(--color-alpha-contrast);
  --button-blurred-text-default: var(--color-alpha-contrast);
  --button-blurred-text-active: var(--color-neutral-900);
  --button-blurred-icon-default: var(--color-alpha-default);
  --button-blurred-icon-active: var(--color-neutral-900);
  --border-button-play-border-default: #f6a000;
  --bg-button-play-bg-hover: linear-gradient(139deg, #fea501 1.08%, #f6a000 96.23%);
  --text-primary: var(--color-alpha-default);
  --text-secondary: var(--color-alpha-50);
  --text-contrast: var(--color-alpha-contrast);
  --text-banner-contrast: var(--color-alpha-contrast);
  --text-accent-1: var(--color-blue-500);
  --text-accent-2: var(--color-blue-400);
  --text-accent-3: var(--color-yellow-700);
  --text-accent-4: var(--color-yellow-400);
  --text-accent-5: var(--color-yellow-300);
  --text-accent-6: var(--color-yellow-300-30);
  --text-accent-7: var(--color-pink-400);
  --text-accent-8: var(--color-blue-400);
  --text-accent-9: var(--color-green-500);
  --text-accent-10: var(--color-green-500-30);
  --text-accent-11: var(--color-red-500);
  --text-accent-12: var(--color-neutral-800);
  --text-accent-13: var(--color-neutral-500);
  --text-error: var(--color-red-400);
  --text-warning: var(--color-yellow-500);
  --text-success: var(--color-green-600);
  --text-extra: var(--color-blue-400);
  --icon-basic-contrast: var(--color-alpha-contrast);
  --icon-basic-white: var(--color-alpha-contrast);
  --icon-basic-white-50: var(--color-alpha-50);
  --icon-basic-white-25: var(--color-alpha-25);
  --icon-basic-100: var(--color-neutral-100);
  --icon-basic-100-50: var(--color-neutral-100-50);
  --icon-accent-1: var(--color-blue-500);
  --icon-accent-2: var(--color-blue-400);
  --icon-accent-3: var(--color-yellow-700);
  --icon-accent-4: var(--color-yellow-400);
  --icon-accent-5: var(--color-yellow-300);
  --icon-accent-6: var(--color-yellow-300-30);
  --icon-accent-7: var(--color-pink-400);
  --icon-accent-8: var(--color-blue-400);
  --icon-accent-9: var(--color-green-500);
  --icon-accent-10: var(--color-green-500-30);
  --icon-accent-11: var(--color-red-500);
  --icon-accent-12: var(--color-neutral-800);
  --icon-accent-13: var(--color-neutral-500);
  --icon-error: var(--color-red-400);
  --icon-warning: var(--color-yellow-500);
  --icon-success: var(--color-green-600);
  --icon-extra: var(--color-blue-400);
  --icon-default-sidebar: var(--color-neutral-100);
  --icon-active-sidebar: var(--color-neutral-100);
  --icon-default-category: var(--color-alpha-50);
  --icon-active-category: var(--color-alpha-default);
  --icon-idle-category: var(--color-neutral-100);
  --bg-step-back: var(--color-neutral-400);
  --bg-step-progress: var(--color-blue-400);
  --bg-game-hover: linear-gradient(180deg, rgba(14, 16, 41, 0.7) 0%, rgba(14, 16, 41, 0.2) 100%);
  --bg-label-top: linear-gradient(180deg, #ff7a00 0%, #ec3900 100%);
  --bg-label-new: linear-gradient(180deg, #1ea956 0%, #186e3a 100%);
  --bg-label-crypto: linear-gradient(180deg, #9a4cf8 0%, #7813ae 100%);
  --bg-gradient-vip-sign: linear-gradient(180deg, #f4e38b -24.36%, #f4dd62 23.01%, #b27f2a 100%);
  --bg-gradient-0-700: linear-gradient(270deg, #1c1a3f 0%, rgba(28, 26, 63, 0) 100%);
  --bg-gradient-0-800: linear-gradient(180deg, rgba(17, 20, 51, 0) 0%, #111433 100%);
  --bg-gradient-1: linear-gradient(188deg, #dcab20 -7.28%, #7b61ff 96.79%);
  --bg-gradient-2: linear-gradient(180deg, #f4e38b -24.36%, #f4dd62 23.01%, #b27f2a 100%);
  --bg-gradient-3: linear-gradient(153deg, #58cdff 4.38%, #2756fe 81.13%);
  --bg-gradient-4: linear-gradient(153deg, #199258 4.38%, #03c14f 81.13%);
  --bg-gradient-service-page: radial-gradient(
    67.63% 97.68% at 50% 0%,
    #222245 0%,
    #0d0d2b 64.25%,
    #06061f 87.18%,
    #090a15 100%
  );
  --bg-gradient-collection-card: linear-gradient(180deg, #3b3b78 -149.6%, #01120f 81.2%);
  --bg-gradient-loader: radial-gradient(
    104.17% 118.85% at 50% 0%,
    #222245 0%,
    #0d0d2b 50%,
    #000b0a 100%
  );
  --bg-gradient-bubble-menu: radial-gradient(
    35.44% 35.44% at 50% 64.56%,
    rgba(33, 27, 71, 0.9) 46%,
    rgba(17, 20, 51, 0.9) 100%
  );
  --bg-gradient-vip-card: radial-gradient(
    138.69% 41.85% at 50% 0%,
    #051413 0%,
    #051413 30%,
    #051413 100%
  );
}