:root {
    --color-dark-50: 248, 250, 252;
    --color-dark-100: 248, 250, 252;
    --color-dark-200: 232, 233, 237;
    --color-dark-300: 216, 216, 223;
    --color-dark-400: 200, 198, 208;
    --color-dark-500: 128, 127, 136;
    --color-dark-600: 92, 91, 99;
    --color-dark-700: 56, 56, 63;
    --color-dark-800: 20, 20, 27;
    --color-dark-850: 16, 16, 22;
    --color-dark-900: 14, 14, 19;
    --color-dark-950: 11, 11, 16;

    --color-accent-50: 248, 247, 255;
    --color-accent-100: 241, 238, 255;
    --color-accent-200: 226, 219, 254;
    --color-accent-300: 207, 194, 253;
    --color-accent-400: 191, 173, 252;
    --color-accent-500: 183, 161, 250;
    --color-accent-600: 155, 122, 245;
    --color-accent-700: 130, 89, 235;
    --color-accent-800: 106, 66, 209;
    --color-accent-900: 87, 55, 170;
    --color-accent-950: 42, 27, 80;

    --color-success-50: 244, 251, 247;
    --color-success-100: 233, 247, 239;
    --color-success-200: 196, 242, 218;
    --color-success-300: 155, 233, 191;
    --color-success-400: 104, 222, 159;
    --color-success-500: 46, 209, 122;
    --color-success-600: 39, 176, 103;
    --color-success-700: 31, 142, 83;
    --color-success-800: 24, 109, 63;
    --color-success-900: 22, 69, 44;
    --color-success-950: 12, 39, 25;

    --color-warning-50: 252, 249, 243;
    --color-warning-100: 249, 242, 231;
    --color-warning-200: 250, 227, 189;
    --color-warning-300: 246, 208, 142;
    --color-warning-400: 241, 184, 85;
    --color-warning-500: 236, 156, 19;
    --color-warning-600: 198, 131, 16;
    --color-warning-700: 160, 106, 13;
    --color-warning-800: 123, 81, 10;
    --color-warning-900: 77, 54, 15;
    --color-warning-950: 43, 30, 8;

    --color-error-50: 253, 242, 243;
    --color-error-100: 250, 229, 231;
    --color-error-200: 255, 184, 191;
    --color-error-300: 255, 133, 145;
    --color-error-400: 255, 71, 90;
    --color-error-500: 255, 0, 25;
    --color-error-600: 214, 0, 21;
    --color-error-700: 173, 0, 17;
    --color-error-800: 133, 0, 13;
    --color-error-900: 83, 9, 17;
    --color-error-950: 46, 5, 9;

    --color-on-accent: 23, 18, 31;
    --color-on-success: 15, 23, 42;
    --color-on-warning: 15, 23, 42;
    --color-on-error: 15, 23, 42;
    --color-dark-bg: #0b0b10;
    --color-dark-surface: #14141b;
    --color-dark-text: #f8fafc;
    --color-dark-text-secondary: #c8c6d0;
    --color-light-bg: #f5f4f8;
    --color-light-surface: #ffffff;
    --color-light-text: #1b1920;
    --color-light-text-secondary: #5f5a68;
}

html,
body {
    background-color: var(--color-dark-bg);
    color: var(--color-dark-text);
}

button[class*="bg-[#54a9eb]"] {
    background: rgb(var(--color-accent-500)) !important;
    color: #17131f !important;
    box-shadow: 0 8px 24px rgba(183, 161, 250, .18) !important;
}

button[class*="bg-[#54a9eb]"]:hover {
    background: rgb(var(--color-accent-400)) !important;
}

a.text-telegram-blue {
    color: rgb(var(--color-accent-300)) !important;
}
