:root {
  --color-brand-50: #f3fbf8;
  --color-brand-100: #dbf4ec;
  --color-brand-200: #b7ead9;
  --color-brand-300: #87dcc0;
  --color-brand-400: #4bcaa0;
  --color-brand-500: #10b981;
  --color-brand-600: #0ea674;
  --color-brand-700: #0c8a60;
  --color-brand-800: #096f4d;
  --color-brand-900: #07533a;
  --color-brand-950: #043726;
  --color-secondary-50: #f5f8fe;
  --color-secondary-100: #e1ecfd;
  --color-secondary-200: #c4d9fc;
  --color-secondary-300: #9dc0fa;
  --color-secondary-400: #6ca1f8;
  --color-secondary-500: #3b82f6;
  --color-secondary-600: #3575dd;
  --color-secondary-700: #2c61b8;
  --color-secondary-800: #234e93;
  --color-secondary-900: #1a3a6e;
  --color-secondary-950: #112749;
  --color-accent-50: #fefaf2;
  --color-accent-100: #fdf0da;
  --color-accent-200: #fce1b5;
  --color-accent-300: #face85;
  --color-accent-400: #f7b648;
  --color-accent-500: #f59e0b;
  --color-accent-600: #dc8e09;
  --color-accent-700: #b77608;
  --color-accent-800: #935e06;
  --color-accent-900: #6e4704;
  --color-accent-950: #492f03;
  --color-primary: #10b981;
  --color-secondary: #3b82f6;
  --color-accent: #f59e0b;
  --color-background: #0f172a;
  --color-text: #f8fafc;
  --color-primary-rgb: 16 185 129;
  --color-surface-50: #f3f4f7;
  --color-surface-100: #e1e4ea;
  --color-surface-200: #c5c9d3;
  --color-surface-300: #9199ac;
  --color-surface-400: #606b85;
  --color-surface-500: #495369;
  --color-surface-600: #2d3443;
  --color-surface-700: #202737;
  --color-surface-750: #161d2c;
  --color-surface-800: #0f1524;
  --color-surface-850: #090e1a;
  --color-surface-900: #060a14;
  --color-surface-950: #000000;
  --color-fg: #ffffff;
  --logo-url: url("/logos/enginex/logo-invert.svg");
}

@media (prefers-color-scheme: light) {
  :root:not(.dark) {
    --color-surface-50: #222325;
    --color-surface-100: #36373a;
    --color-surface-200: #494b50;
    --color-surface-300: #67696f;
    --color-surface-400: #808389;
    --color-surface-500: #9a9da2;
    --color-surface-600: #dfe0e1;
    --color-surface-700: #eaeaeb;
    --color-surface-750: #f5f5f5;
    --color-surface-800: #fafafa;
    --color-surface-850: #f7f7f8;
    --color-surface-900: #f2f2f2;
    --color-surface-950: #ffffff;
    --color-fg: #222325;
    --logo-url: url("/logos/enginex/logo.svg");
  }
}

:root.light {
  --color-surface-50: #222325;
  --color-surface-100: #36373a;
  --color-surface-200: #494b50;
  --color-surface-300: #67696f;
  --color-surface-400: #808389;
  --color-surface-500: #9a9da2;
  --color-surface-600: #dfe0e1;
  --color-surface-700: #eaeaeb;
  --color-surface-750: #f5f5f5;
  --color-surface-800: #fafafa;
  --color-surface-850: #f7f7f8;
  --color-surface-900: #f2f2f2;
  --color-surface-950: #ffffff;
  --color-fg: #222325;
  --logo-url: url("/logos/enginex/logo.svg");
}

:root.dark {
  --color-surface-50: #f3f4f7;
  --color-surface-100: #e1e4ea;
  --color-surface-200: #c5c9d3;
  --color-surface-300: #9199ac;
  --color-surface-400: #606b85;
  --color-surface-500: #495369;
  --color-surface-600: #2d3443;
  --color-surface-700: #202737;
  --color-surface-750: #161d2c;
  --color-surface-800: #0f1524;
  --color-surface-850: #090e1a;
  --color-surface-900: #060a14;
  --color-surface-950: #000000;
  --color-fg: #ffffff;
  --logo-url: url("/logos/enginex/logo-invert.svg");
}