/* HCI primitive palette. Reference these only from tokens.css, never from
   component CSS. */
:root {
    --hci-white-10: #FFFFFF1A;
    --hci-white-20: #FFFFFF33;
    --hci-white-30: #FFFFFF4D;
    --hci-white-40: #FFFFFF66;
    --hci-white-50: #FFFFFF80;
    --hci-white-60: #FFFFFF99;
    --hci-white-70: #FFFFFFB2;
    --hci-white-80: #FFFFFFCC;
    --hci-white-90: #FFFFFFE5;
    --hci-white-100: #FFFFFF;

    --hci-black-6: #0000000F;
    --hci-black-10: #0000001A;
    --hci-black-20: #00000033;
    --hci-black-30: #0000004D;
    --hci-black-40: #00000066;
    --hci-black-50: #00000080;
    --hci-black-60: #00000099;
    --hci-black-70: #000000B2;
    --hci-black-80: #000000CC;
    --hci-black-90: #000000E5;
    --hci-black-100: #000000;

    /* 800 and 900 leave the teal hue and turn slate. */
    --hci-brand-overlay: #3FF7FF12;
    --hci-brand-10: #E6FEFF;
    --hci-brand-100: #CCFDFF;
    --hci-brand-200: #A0FAFF;
    --hci-brand-300: #46D4DA;
    --hci-brand-400: #0DB5BC;
    --hci-brand-450: #25AFB5;
    --hci-brand-500: #00A4AE;
    --hci-brand-600: #1E969B;
    --hci-brand-700: #1E8387;
    --hci-brand-750: #186E72;
    --hci-brand-800: #2D464A;
    --hci-brand-900: #122E32;

    --hci-purple-100: #EDE2F2;
    --hci-purple-200: #DBC4E5;
    --hci-purple-300: #C9A7D9;
    --hci-purple-400: #B789CC;
    --hci-purple-500: #A56CBF;
    --hci-purple-600: #845699;
    --hci-purple-700: #634173;
    --hci-purple-800: #422B4C;
    --hci-purple-900: #211626;

    /* Not the brand teal; see --hci-brand-*. */
    --hci-teal-100: #CEF4F0;
    --hci-teal-200: #9DEAE0;
    --hci-teal-300: #6BDFD1;
    --hci-teal-400: #3AD5C1;
    --hci-teal-500: #09CAB2;
    --hci-teal-600: #07A28E;
    --hci-teal-700: #05796B;
    --hci-teal-800: #045147;
    --hci-teal-900: #022824;

    --hci-gray-100: #FBFBFB;
    --hci-gray-200: #F7F7F7;
    --hci-gray-300: #F2F2F2;
    --hci-gray-400: #EEEEEE;
    --hci-gray-500: #EAEAEA;
    --hci-gray-600: #BBBBBB;
    --hci-gray-700: #8C8C8C;
    --hci-gray-800: #5E5E5E;
    --hci-gray-900: #2F2F2F;

    --hci-red-100: #FFD8D6;
    --hci-red-200: #FFB1AC;
    --hci-red-300: #FF8983;
    --hci-red-400: #FF6259;
    --hci-red-500: #FF3B30;
    --hci-red-600: #CC2F26;
    --hci-red-700: #99231D;
    --hci-red-800: #661813;
    --hci-red-900: #330C0A;

    --hci-amber-100: #FDEBD4;
    --hci-amber-200: #FBD8A9;
    --hci-amber-300: #F8C47E;
    --hci-amber-400: #F6B153;
    --hci-amber-500: #F49D28;
    --hci-amber-600: #C37E20;
    --hci-amber-700: #925E18;
    --hci-amber-800: #623F10;
    --hci-amber-900: #311F08;

    --hci-pink-100: #FBDFEC;
    --hci-pink-200: #F7C0D9;
    --hci-pink-300: #F4A0C5;
    --hci-pink-400: #F081B2;
    --hci-pink-500: #EC619F;
    --hci-pink-600: #BD4E7F;
    --hci-pink-700: #8E3A5F;
    --hci-pink-800: #5E2740;
    --hci-pink-900: #2F1320;

    --hci-green-100: #CCE8CC;
    --hci-green-200: #99D099;
    --hci-green-300: #66B966;
    --hci-green-400: #33A133;
    --hci-green-500: #008A00;
    --hci-green-600: #006E00;
    --hci-green-700: #005300;
    --hci-green-800: #003700;
    --hci-green-900: #001C00;

    --hci-pearl-100: #FEFBF7;
    --hci-pearl-200: #FDF7EF;
    --hci-pearl-300: #FCF3E6;
    --hci-pearl-400: #FBEFDE;
    --hci-pearl-500: #FAEBD6;
    --hci-pearl-600: #C8BCAB;
    --hci-pearl-700: #968D80;
    --hci-pearl-800: #645E56;
    --hci-pearl-900: #322F2B;

    /* Navy 500 and GrayBlue 800 are the same value. */
    --hci-navy-100: #D2D4DB;
    --hci-navy-200: #A5A9B6;
    --hci-navy-300: #777D92;
    --hci-navy-400: #4A526D;
    --hci-navy-500: #1D2749;
    --hci-navy-600: #171F3A;
    --hci-navy-700: #11172C;
    --hci-navy-800: #0C101D;
    --hci-navy-900: #06080F;

    --hci-aqua-100: #E4F3F8;
    --hci-aqua-200: #C8E7F2;
    --hci-aqua-300: #ADDBEB;
    --hci-aqua-400: #91CFE5;
    --hci-aqua-500: #76C3DE;
    --hci-aqua-600: #5E9CB2;
    --hci-aqua-700: #477585;
    --hci-aqua-800: #2F4E59;
    --hci-aqua-900: #18272C;

    --hci-sky-100: #CDE5F2;
    --hci-sky-200: #9CCAE4;
    --hci-sky-300: #6AB0D7;
    --hci-sky-400: #3995C9;
    --hci-sky-500: #077BBC;
    --hci-sky-600: #066296;
    --hci-sky-700: #044A71;
    --hci-sky-800: #03314B;
    --hci-sky-900: #011926;

    --hci-grayblue-10: #FCFCFC;
    --hci-grayblue-50: #F2F4FD;
    --hci-grayblue-100: #EFF0F6;
    --hci-grayblue-200: #D9DBE9;
    --hci-grayblue-300: #C4C7DD;
    --hci-grayblue-400: #A0A3BD;
    --hci-grayblue-500: #6E7191;
    --hci-grayblue-600: #2C3962;
    --hci-grayblue-700: #232E4E;
    --hci-grayblue-800: #1D2749;
    --hci-grayblue-900: #111932;
    --hci-grayblue-1000: #090B14;

    --hci-coolgray-100: #FAFCFE;
    --hci-coolgray-200: #F5FAFD;
    --hci-coolgray-300: #EFF7FB;
    --hci-coolgray-400: #EAF5FA;
    --hci-coolgray-500: #E5F2F9;
    --hci-coolgray-600: #B7C2C7;
    --hci-coolgray-700: #899195;
    --hci-coolgray-800: #5C6164;
    --hci-coolgray-900: #2E3032;

    --hci-magenta-100: #F6D6E4;
    --hci-magenta-200: #EDADC9;
    --hci-magenta-300: #E484AF;
    --hci-magenta-400: #DB5B94;
    --hci-magenta-500: #D23279;
    --hci-magenta-600: #A82861;
    --hci-magenta-700: #7E1E49;
    --hci-magenta-800: #541430;
    --hci-magenta-900: #2A0A18;

    --hci-yellow-100: #FFF5CC;
    --hci-yellow-200: #FFEB99;
    --hci-yellow-300: #FFE066;
    --hci-yellow-400: #FFD633;
    --hci-yellow-500: #FFCC00;
    --hci-yellow-600: #CCA300;
    --hci-yellow-700: #997A00;
    --hci-yellow-800: #665200;
    --hci-yellow-900: #332900;

    /* Navy range, not a bright blue; see --hci-sky-* for that. */
    --hci-blue-100: #D2D8E4;
    --hci-blue-200: #A4B1C8;
    --hci-blue-300: #778AAD;
    --hci-blue-400: #496391;
    --hci-blue-500: #1C3C76;
    --hci-blue-600: #16305E;
    --hci-blue-700: #112447;
    --hci-blue-800: #0B182F;
    --hci-blue-900: #060C18;
}