:root {
    /* Neutral Color Scale */
    --neutral-50: #fafafa;
    --neutral-100: #f5f5f5;
    --neutral-200: #e5e5e5;
    --neutral-300: #d4d4d4;
    --neutral-400: #a3a3a3;
    --neutral-500: #737373;
    --neutral-600: #525252;
    --neutral-700: #404040;
    --neutral-800: #262626;
    --neutral-900: #262626;

    /* Brand Color Categories */
    --primary-brand: #6A0DAD;
    --secondary-brand: #CCC2D6;
    --tertiary-brand: #E0E0E0;
    --accent-brand: #262626;
    --muted-brand: #6b7280;

    /* Semantic Color Mappings */
    /* Background Colors */
    --bg-primary: var(--neutral-50);
    --bg-secondary: var(--neutral-100);
    --bg-tertiary: var(--neutral-200);
    --bg-accent: var(--primary-brand);

    /* Text Colors */
    --text-heading: var(--neutral-900);
    --text-body: var(--neutral-700);
    --text-muted: var(--neutral-500);
    --text-accent: var(--primary-brand);
    --text-on-accent: var(--neutral-50);

    /* Border Colors */
    --border-primary: var(--secondary-brand);
    --border-secondary: var(--neutral-200);
    --border-accent: var(--primary-brand);

    /* Hover States */
    --hover-bg-primary: var(--secondary-brand);
    --hover-bg-secondary: var(--secondary-brand);
    --hover-border: var(--neutral-400);
    --hover-text: var(--primary-brand);

}

/*@media (prefers-color-scheme: dark) {*/
/*    :root {*/
/*        !* Dark Mode Neutral Color Overrides *!*/
/*        --neutral-50: #0a0a0a;*/
/*        --neutral-100: #262626;*/
/*        --neutral-200: #262626;*/
/*        --neutral-300: #404040;*/
/*        --neutral-400: #525252;*/
/*        --neutral-500: #737373;*/
/*        --neutral-600: #a3a3a3;*/
/*        --neutral-700: #d4d4d4;*/
/*        --neutral-800: #e5e5e5;*/
/*        --neutral-900: #f5f5f5;*/
/*    }*/
/*}*/