/*
 * Codecademy (codecademy@1.0.0)
 * Palette: codecademy@1.0.0
 * Fonts:   heading=inter@1.0.0, body=inter@1.0.0, mono=geist-mono@1.0.0
 * Generated by brand-atoms converter — do not edit by hand.
 */

:root {
  /* Swatches (source-of-truth color values) */
  --color-swatch-navy: #10162F;
  --color-swatch-navy-900: #0A0D1C;
  --color-swatch-hyper: #3A10E5;
  --color-swatch-hyper-light: #5533FF;
  --color-swatch-blue: #1557FF;
  --color-swatch-blue-light: #3388FF;
  --color-swatch-blue-300: #66C4FF;
  --color-swatch-blue-pale: #D3F2FF;
  --color-swatch-blue-0: #F5FCFF;
  --color-swatch-green: #008A27;
  --color-swatch-green-light: #AEE938;
  --color-swatch-green-pale: #EAFDC6;
  --color-swatch-green-0: #F5FFE3;
  --color-swatch-yellow: #FFD300;
  --color-swatch-yellow-dark: #CCA900;
  --color-swatch-yellow-0: #FFFAE5;
  --color-swatch-red: #E91C11;
  --color-swatch-red-dark: #BE1809;
  --color-swatch-red-soft: #DC5879;
  --color-swatch-red-0: #FBF1F0;
  --color-swatch-pink: #F966FF;
  --color-swatch-orange: #FF8C00;
  --color-swatch-beige: #FFF0E5;
  --color-swatch-white: #FFFFFF;
  --color-swatch-gray-100: #F5F5F5;
  --color-swatch-gray-200: #EEEEEE;
  --color-swatch-gray-300: #E0E0E0;
  --color-swatch-gray-600: #9E9E9E;
  --color-swatch-gray-800: #616161;
  --color-swatch-gray-900: #424242;

  /* Light-mode semantic roles */
  --color-background: #FFFFFF;
  --color-surface: #F5F5F5;
  --color-surface-elevated: #FFFFFF;
  --color-text-primary: #10162F;
  --color-text-secondary: #616161;
  --color-text-tertiary: #9E9E9E;
  --color-primary: #3A10E5;
  --color-primary-hover: #5533FF;
  --color-accent: #5533FF;
  --color-accent-hover: #3A10E5;
  --color-warning: #FFD300;
  --color-warning-hover: #CCA900;
  --color-error: #E91C11;
  --color-success: #008A27;
  --color-border: #E0E0E0;

  /* Brand-level role overrides */
  --brand-color-identity: #10162F;
  --brand-color-on-identity: #FFFFFF;
  --brand-color-primary: #3A10E5;
  --brand-color-primary-hover: #5533FF;
  --brand-color-accent: #AEE938;
  --brand-color-accent-hover: #008A27;
  --brand-color-mark: #3A10E5;
  --brand-color-success: #008A27;
  --brand-color-warning: #FFD300;
  --brand-color-error: #E91C11;
  --brand-color-text-primary-light: #10162F;
  --brand-color-text-primary-dark: #FFFFFF;
  --brand-color-background-light: #FFFFFF;
  --brand-color-background-dark: #10162F;
  --brand-color-surface-light: #F5F5F5;
  --brand-color-surface-dark: #0A0D1C;
  --brand-color-text-secondary-light: #616161;
  --brand-color-text-tertiary-light: #9E9E9E;
  --brand-color-border-light: #E0E0E0;
  --brand-color-border-dark: #424242;

  /* Typography */
  --font-heading: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --font-body: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --font-mono: 'Geist Mono', SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
}

@media (prefers-color-scheme: dark) {
  :root {
    /* Dark-mode semantic roles override light-mode values */
    --color-background: #10162F;
    --color-surface: #0A0D1C;
    --color-surface-elevated: #10162F;
    --color-text-primary: #FFFFFF;
    --color-text-secondary: #E0E0E0;
    --color-text-tertiary: #9E9E9E;
    --color-primary: #5533FF;
    --color-primary-hover: #3A10E5;
    --color-accent: #AEE938;
    --color-accent-hover: #008A27;
    --color-warning: #FFD300;
    --color-warning-hover: #CCA900;
    --color-error: #DC5879;
    --color-success: #AEE938;
    --color-border: #424242;
  }
}