:root {
    /* Brand Colors */
    --color-brand-primary: #026AA7;
    --color-brand-blue: #0079BF;
    --color-brand-blue-hover: #026AA7;
    --color-brand-blue-active: #055A8C;

    /* Neutral Palette */
    --color-gray-50: #FAFBFC;
    --color-gray-100: #F4F5F7;
    --color-gray-200: #EBECF0;
    --color-gray-300: #DFE1E6;
    --color-gray-400: #C1C7D0;
    --color-gray-500: #A5ADBA;
    --color-gray-600: #6B778C;
    --color-gray-700: #505F79;
    --color-gray-800: #344563;
    --color-gray-900: #172B4D;

    /* Board Background Colors */
    --board-bg-blue: #0079BF;
    --board-bg-orange: #D29034;
    --board-bg-green: #519839;
    --board-bg-red: #B04632;
    --board-bg-purple: #89609E;
    --board-bg-pink: #CD5A91;
    --board-bg-lime: #4BBF6B;
    --board-bg-sky: #00AECC;
    --board-bg-gray: #838C91;

    /* Label Colors */
    --label-green: #61BD4F;
    --label-green-light: #B7DEB0;
    --label-green-dark: #59AC44;
    --label-yellow: #F2D600;
    --label-yellow-light: #F6EA92;
    --label-yellow-dark: #E7C60B;
    --label-orange: #FF9F1A;
    --label-orange-light: #FBD19C;
    --label-orange-dark: #E79217;
    --label-red: #EB5A46;
    --label-red-light: #F0B3AB;
    --label-red-dark: #CF513D;
    --label-purple: #C377E0;
    --label-purple-light: #DFC0EB;
    --label-purple-dark: #A86CC1;
    --label-blue: #0079BF;
    --label-blue-light: #8CBED9;
    --label-blue-dark: #036AA7;
    --label-sky: #00C2E0;
    --label-sky-light: #90DFEB;
    --label-sky-dark: #03AECC;
    --label-lime: #51E898;
    --label-lime-light: #B3F1D0;
    --label-lime-dark: #4FD582;
    --label-pink: #FF78CB;
    --label-pink-light: #F8C2E4;
    --label-pink-dark: #E668AF;
    --label-black: #344563;
    --label-black-light: #506079;
    --label-black-dark: #081F42;

    /* Typography */
    --font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto',
                   'Noto Sans', 'Ubuntu', 'Droid Sans', 'Helvetica Neue', sans-serif;
    --font-size-xs: 12px;
    --font-size-sm: 14px;
    --font-size-md: 16px;
    --font-size-lg: 20px;
    --font-size-xl: 24px;
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-bold: 700;
    --line-height-tight: 1.2;
    --line-height-normal: 1.5;

    /* Spacing */
    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 20px;
    --space-6: 24px;
    --space-8: 32px;
    --space-10: 40px;
    --space-12: 48px;

    /* Borders & Radii */
    --radius-sm: 3px;
    --radius-md: 6px;
    --radius-lg: 8px;
    --radius-xl: 12px;
    --border-color: var(--color-gray-300);

    /* Shadows (Trello-accurate) */
    --shadow-card: 0 1px 0 rgba(9, 30, 66, 0.25);
    --shadow-card-hover: 0 4px 8px -2px rgba(9, 30, 66, 0.25),
                         0 0 0 1px rgba(9, 30, 66, 0.08);
    --shadow-list: 0 1px 1px rgba(9, 30, 66, 0.25);
    --shadow-modal: 0 8px 16px -4px rgba(9, 30, 66, 0.25),
                    0 0 0 1px rgba(9, 30, 66, 0.08);
    --shadow-popover: 0 8px 16px -4px rgba(9, 30, 66, 0.31),
                      0 0 0 1px rgba(9, 30, 66, 0.08);
    --shadow-header: 0 1px 0 rgba(0, 0, 0, 0.12);

    /* Transitions */
    --transition-fast: 85ms ease;
    --transition-normal: 200ms ease;
    --transition-slow: 350ms ease;

    /* Z-Index Scale */
    --z-card-drag: 1000;
    --z-sidebar: 2000;
    --z-modal-backdrop: 3000;
    --z-modal: 3001;
    --z-popover: 4000;
    --z-toast: 5000;

    /* Layout */
    --header-height: 44px;
    --sidebar-width: 260px;
    --list-width: 272px;
    --board-menu-width: 339px;
}