:root {
    /* colors */
    --nx-white: #FFF;
    --nx-gray: #e1e1e1;
    --nx-menu-item-background-active: #FFF;
    --nx-gray-25: #FAFAFA;
    --nx-gray-50: #F5F5F5;
    --nx-gray-100: #E5E5E5;
    --nx-gray-200: #D4D4D4;
    --nx-gray-300: #A3A3A3;
    --nx-gray-400: #737373;
    --nx-gray-500: #525252;
    --nx-gray-600: #404040;
    --nx-gray-700: #262626;
    --nx-gray-800: #171717;
    --nx-gray-900: #0A0A0A;
    --ct-menu-item: var(--nx-gray-800);
    --ct-bg-topbar-search: var(--nx-gray-50);
    --ct-input-placeholder-color: #A3A3A3;
    /* size */
    --nx-s2: 2px;
    --nx-s4: 4px;
    --nx-s6: 6px;
    --nx-s8: 8px;
    --nx-s10: 10px;
    --nx-s12: 12px;
    --nx-s14: 14px;
    --nx-s16: 16px;
    --nx-s18: 18px;
    --nx-s20: 20px;
    --nx-s24: 24px;
    --nx-s32: 32px;
    --nx-s40: 40px;
    --nx-s48: 48px;
    --nx-s64: 64px;
    --nx-s80: 80px;
    --nx-s96: 96px;
    --nx-s128: 128px;
    --nx-s160: 160px;
    --nx-s192: 192px;
    --nx-s224: 224px;
    --nx-s256: 256px;
}
body[data-leftbar-theme=dark] {
    --ct-bg-leftbar: var(--nx-gray-50);
    --ct-dark-menu-item: var(--ct-menu-item);
    --ct-dark-menu-item-hover: #5e6369;
    --ct-dark-menu-item-active: var(--ct-menu-item);
}