:root {
  --color-brand-50: #f2f4f5;
  --color-brand-100: #d8e0e2;
  --color-brand-200: #b2c2c5;
  --color-brand-300: #809a9f;
  --color-brand-400: #40676f;
  --color-brand-500: #013540;
  --color-brand-600: #002f39;
  --color-brand-700: #002730;
  --color-brand-800: #001f26;
  --color-brand-900: #00171c;
  --color-brand-950: #000f13;
  --color-secondary-50: #f2f4f5;
  --color-secondary-100: #d8e0e2;
  --color-secondary-200: #b2c2c5;
  --color-secondary-300: #809a9f;
  --color-secondary-400: #40676f;
  --color-secondary-500: #013540;
  --color-secondary-600: #002f39;
  --color-secondary-700: #002730;
  --color-secondary-800: #001f26;
  --color-secondary-900: #00171c;
  --color-secondary-950: #000f13;
  --color-accent-50: #f2f4f5;
  --color-accent-100: #d8e0e2;
  --color-accent-200: #b2c2c5;
  --color-accent-300: #809a9f;
  --color-accent-400: #40676f;
  --color-accent-500: #013540;
  --color-accent-600: #002f39;
  --color-accent-700: #002730;
  --color-accent-800: #001f26;
  --color-accent-900: #00171c;
  --color-accent-950: #000f13;
  --color-primary: #013540;
  --color-secondary: #013540;
  --color-accent: #013540;
  --color-background: #0f172a;
  --color-text: #f8fafc;
  --color-primary-rgb: 1 53 64;
  --color-surface-50: #f7f7f8;
  --color-surface-100: #eaeaeb;
  --color-surface-200: #ced0d4;
  --color-surface-300: #989ca4;
  --color-surface-400: #6a6f7c;
  --color-surface-500: #505662;
  --color-surface-600: #303540;
  --color-surface-700: #242932;
  --color-surface-750: #1b1e28;
  --color-surface-800: #14171f;
  --color-surface-850: #0d1016;
  --color-surface-900: #090b11;
  --color-surface-950: #000000;
  --color-fg: #ffffff;
  --logo-url: url("/logos/predis/logo-invert.svg");
}

@media (prefers-color-scheme: light) {
  :root:not(.dark) {
    --color-surface-50: #141924;
    --color-surface-100: #222939;
    --color-surface-200: #353d50;
    --color-surface-300: #606776;
    --color-surface-400: #8b909c;
    --color-surface-500: #a9abb2;
    --color-surface-600: #cfd0d3;
    --color-surface-700: #eaeaeb;
    --color-surface-750: #eff0f0;
    --color-surface-800: #f4f5f5;
    --color-surface-850: #f7f7f8;
    --color-surface-900: #fafafa;
    --color-surface-950: #ffffff;
    --color-fg: #0E242A;
    --logo-url: url("/logos/predis/logo.svg");
  }
}

:root.light {
  --color-surface-50: #141924;
  --color-surface-100: #222939;
  --color-surface-200: #353d50;
  --color-surface-300: #606776;
  --color-surface-400: #8b909c;
  --color-surface-500: #a9abb2;
  --color-surface-600: #cfd0d3;
  --color-surface-700: #eaeaeb;
  --color-surface-750: #eff0f0;
  --color-surface-800: #f4f5f5;
  --color-surface-850: #f7f7f8;
  --color-surface-900: #fafafa;
  --color-surface-950: #ffffff;
  --color-fg: #0E242A;
  --logo-url: url("/logos/predis/logo.svg");
}

:root.dark {
  --color-surface-50: #f7f7f8;
  --color-surface-100: #eaeaeb;
  --color-surface-200: #ced0d4;
  --color-surface-300: #989ca4;
  --color-surface-400: #6a6f7c;
  --color-surface-500: #505662;
  --color-surface-600: #303540;
  --color-surface-700: #242932;
  --color-surface-750: #1b1e28;
  --color-surface-800: #14171f;
  --color-surface-850: #0d1016;
  --color-surface-900: #090b11;
  --color-surface-950: #000000;
  --color-fg: #ffffff;
  --logo-url: url("/logos/predis/logo-invert.svg");
}