@layer base {
  :root {
    /* Blue Color Family */
    --blue-950: #0b003f; /* Dark Navy */
    --blue-700: #0073be; /* DCI Dark Blue */
    --blue-500: #14afe7; /* DCI Light Blue */
    --blue-50: rgba(20, 175, 231, 0.05); /* Light blue background overlay */

    /* Neutral/Gray Color Family */
    --black: #000000;
    --gray-900: #1a1a1a;
    --gray-600: #3d3d3d;
    --gray-400: #5d5d5d;
    --gray-300: #626262;
    --gray-200: #7b7b7b;
    --gray-150: #d1d1d1;
    --gray-100: #e0e0e0;
    --gray-50: #f7f7f7;
    --white: #ffffff;

    /* Special/Overlay Colors */
    --dark-overlay: #030814;
    --color-shadow-100: rgba(0, 0, 0, 0.1);
    --color-shadow-200: rgba(0, 0, 0, 0.2);
    --color-shadow-300: rgba(0, 0, 0, 0.3);
    --color-shadow-450: rgba(0, 0, 0, 0.45);

    /* UI Colors */
    --color-ui-success: #f1fff1;
    --color-ui-success-dark: #1ea01e;
    --color-ui-info: #fffaea;
    --color-ui-info-dark: #e4c252;
    --color-ui-error: #ffe9e9;
    --color-ui-error-dark: #ec5454;

    /* Semantic Color Aliases */
    --color-primary: var(--blue-700);
    --color-secondary: var(--blue-500);
    --color-accent: var(--blue-950);

    --color-text-primary: var(--black);
    --color-text-secondary: var(--gray-200);
    --color-text-tertiary: var(--gray-300);

    --color-background-light: var(--gray-50);
    --color-background-subtle: var(--gray-100);
    --color-background-white: var(--white);
    --color-background-accent: var(--blue-50);

    --color-border-light: var(--gray-150);

    background: linear-gradient(
      to bottom,
      var(--color-background-white) 0%,
      var(--color-background-white) 50%,
      var(--color-background-light) 50%,
      var(--color-background-light) 100%
    );
    color: var(--color-text-primary);



    --color-base-purple: #37226B;
    --color-base-green: #626262;
    --color-base-blue: #7616DB;
    --color-primary: var(--color-base-purple);

    --color-header-bg: #F5F5F5;

    --color-links: #37226B;
  }

  body {
    background-color: var(--color-background-white);
  }
}