:root {
    /* Error (red) */
    --error-50: #FCE9E9;
    --error-100: #F9D2D2;
    --error-150: #F6BCBC;
    --error-200: #F3A5A5;
    --error-300: #EC7979;
    --error-400: #E64C4C;
    --error-500: #E01F1F;
    --error-600: #AF1818;
    --error-700: #7D1111;
    --error-750: #650E0E;
    --error-800: #4C0B0B;
    --error-850: #340707;
    --error-900: #1B0404;

    /* Warn (yellow) */
    --warn-50: #FFF4E5;
    --warn-100: #FFEACC;
    --warn-150: #FFDFB3;
    --warn-200: #FFD599;
    --warn-300: #FFBF66;
    --warn-400: #FFAA33;
    --warn-500: #FF9500;
    --warn-600: #C77400;
    --warn-700: #8F5300;
    --warn-750: #734300;
    --warn-800: #573300;
    --warn-850: #3B2200;
    --warn-900: #1F1200;

    /* Success (green) */
    --success-50: #D5FBE7;
    --success-100: #BDF9DA;
    --success-150: #A6F6CD;
    --success-200: #8FF4C0;
    --success-300: #61EFA6;
    --success-400: #32EB8C;
    --success-500: #15D572;
    --success-600: #10A257;
    --success-700: #0B6F3B;
    --success-750: #08552E;
    --success-800: #063C20;
    --success-850: #032212;
    --success-900: #010905;

    /* Background (gray) */
    --background-50: #FFFFFF;
    --background-100: #F9FAFB;
    --background-150: #E7EAEE;
    --background-200: #D6DBE1;
    --background-300: #B3BBC7;
    --background-400: #8F9CAD;
    --background-500: #6C7D93;
    --background-600: #505D6D;
    --background-700: #343C47;
    --background-750: #262C33;
    --background-800: #181B20;
    --background-850: #0A0B0D;
    --background-900: #000000;

    /* Brand (blue) */
    --brand-50: #DEEEFD;
    --brand-100: #C6E2FB;
    --brand-150: #AED6FA;
    --brand-200: #96CAF8;
    --brand-300: #66B2F5;
    --brand-400: #369BF2;
    --brand-500: #0F82E6;
    --brand-600: #0C64B1;
    --brand-700: #08467D;
    --brand-750: #063862;
    --brand-800: #052948;
    --brand-850: #031A2E;
    --brand-900: #010B13;

    --main-brand-blue: #124B80;
    --main-brand-green: #416F35;
    
    /* Chart colors */
    --chart-1: var(--error-400);
    --chart-2: var(--warn-300);
    --chart-3: var(--brand-600);
    --chart-4: var(--success-400);
    --chart-5: var(--background-500);
    --chart-6: var(--background-300);
    --chart-7: var(--brand-400);

    /* Text colors */
    --text-color: #152528;
    --heading-text-color: white;

    /* Panel color */
    --panel-color: white;
}