:root {

    --ax-white: #FFFFFFFF;
    --ax-black: #000000FF;
    --ax-red-50: #FDF1F1FF;
    --ax-red-100: #FCE6E6FF;
    --ax-red-200: #F9C9CAFF;
    --ax-red-300: #F7AEB0FF;
    --ax-red-400: #F59295FF;
    --ax-red-500: #F47377FF;
    --ax-red-600: #F3464EFF;
    --ax-red-700: #DE2C36FF;
    --ax-red-800: #BF252DFF;
    --ax-red-900: #9F1C24FF;
    --ax-red-950: #570B0FFF;
    --ax-red-1000: #E71414FF;
    --ax-orange-50: #FFF4F2FF;
    --ax-orange-100: #FFE9E4FF;
    --ax-orange-200: #FED3C8FF;
    --ax-orange-300: #FEBDA9FF;
    --ax-orange-400: #FEA586FF;
    --ax-orange-500: #FE8D5AFF;
    --ax-orange-600: #FC7713FF;
    --ax-orange-700: #E46B0EFF;
    --ax-orange-800: #CC5F0CFF;
    --ax-orange-900: #B45308FF;
    --ax-orange-950: #5D2702FF;
    --ax-green-50: #DEFFE4FF;
    --ax-green-100: #A7FEBCFF;
    --ax-green-200: #28FA7BFF;
    --ax-green-300: #25E370FF;
    --ax-green-400: #20CE64FF;
    --ax-green-500: #1BB859FF;
    --ax-green-600: #17A650FF;
    --ax-green-700: #129245FF;
    --ax-green-800: #0E7E3BFF;
    --ax-green-900: #0A6B31FF;
    --ax-green-950: #033917FF;
    --ax-yellow-25: #FEFCF6FF;
    --ax-yellow-50: #FFFCEEFF;
    --ax-yellow-100: #FDEDBEFF;
    --ax-yellow-200: #F8D94FFF;
    --ax-yellow-300: #E5C848FF;
    --ax-yellow-400: #CFB542FF;
    --ax-yellow-500: #BDA53AFF;
    --ax-yellow-600: #A99333FF;
    --ax-yellow-700: #7D6C23FF;
    --ax-yellow-800: #544815FF;
    --ax-yellow-900: #2C2507FF;
    --ax-yellow-950: #1C1703FF;
    --ax-blue-50: #EEF0FFFF;
    --ax-blue-100: #D9DEFFFF;
    --ax-blue-200: #B5C0FFFF;
    --ax-blue-300: #8CA0FFFF;
    --ax-blue-400: #5B80FFFF;
    --ax-blue-500: #004AC5FF;
    --ax-blue-600: #004AC5FF;
    --ax-blue-700: #00348FFF;
    --ax-blue-800: #002060FF;
    --ax-blue-900: #00123EFF;
    --ax-blue-950: #000B2EFF;
    --ax-neutral-00: #F9FAFBFF;
    --ax-neutral-25: #FFFEFAFF;
    --ax-neutral-50: #F8FAFCFF;
    --ax-neutral-100: #F1F5F9FF;
    --ax-neutral-150: #F6F6F6FF;
    --ax-neutral-200: #E2E8F0FF;
    --ax-neutral-300: #CBD5E1FF;
    --ax-neutral-400: #9FA6ADFF;
    --ax-neutral-450: #94A3B8FF;
    --ax-neutral-500: #64748BFF;
    --ax-neutral-550: #9C9E9FFF;
    --ax-neutral-575: #8D909BFF;
    --ax-neutral-600: #475569FF;
    --ax-neutral-700: #334155FF;
    --ax-neutral-800: #1E293BFF;
    --ax-neutral-900: #101827FF;
    --ax-neutral-950: #0C121FFF;
    --ax-neutral-975: #22282BFF;
    --ax-neutral-1000: #2C3E50FF;
    --ax-sky-blue-25: #E5E7EBFF;
    --ax-sky-blue-50: #E7EEFFFF;
    --ax-sky-blue-100: #9DCAFFFF;
    --ax-sky-blue-150: #F8FAFF;
    --ax-sky-blue-200: #F1F3F7;
    --ax-sky-blue-250: #70B1FF;
    --ax-sky-blue-275: #DBE2F0FF;
    --ax-sky-blue-300: #3A94FF;
    --ax-sky-blue-350: #8DC1FF;
    --ax-sky-blue-400: #C3DDFF;

    /* Brand */
    --ax-primary: var(--ax-yellow-600);
    --ax-secondary: var(--ax-blue-800);

    /* ========== Semantic States ========== */

    /* Success */
    --ax-success-fg: var(--ax-green-800);
    /* color/green/800 */
    --ax-success-bg: var(--ax-green-50);
    /* color/green/50  */
    --ax-success-border: var(--ax-green-100);
    /* color/green/100 */

    /* Warning */
    --ax-warning-fg: var(--ax-orange-900);
    /* color/orange/900 */
    --ax-warning-bg: var(--ax-orange-50);
    /* color/orange/50  */
    --ax-warning-border: var(--ax-orange-100);
    /* color/orange/100 */

    /* Error */
    --ax-error-fg: var(--ax-red-900);
    /* color/red/900 */
    --ax-error-bg: var(--ax-red-50);
    /* color/red/50  */
    --ax-error-border: var(--ax-red-100);
    /* color/red/100 */

    /* Info */
    --ax-info-fg: var(--ax-blue-700);
    /* color/blue/700 */
    --ax-info-bg: var(--ax-blue-50);
    /* color/blue/50  */
    --ax-info-border: var(--ax-blue-100);
    /* color/blue/100 */


    /* ========== Buttons ========== */

    /* Button / Primary */
    --ax-button-primary: var(--ax-yellow-600);
    /* Color   - color/yellow/600 */
    --ax-button-primary-hover: var(--ax-yellow-400);
    /* Hover   - color/yellow/400 */
    --ax-button-primary-toggle: var(--ax-yellow-700);
    /* Toggle  - color/yellow/700 */
    --ax-button-primary-focus: var(--ax-blue-800);
    /* Focused - color/blue/800   */

    /* Button / Secondary */
    --ax-button-secondary: var(--ax-white);
    /* Color   - color/white      */
    --ax-button-secondary-hover: var(--ax-blue-50);
    /* Hover   - color/blue/50    */
    --ax-button-secondary-toggle: var(--ax-blue-100);
    /* Toggle  - color/blue/100   */


    /* ========== Text ========== */

    --ax-text-primary: var(--ax-neutral-800);
    /* Primary   - color/neutral/800 */
    --ax-text-secondary: var(--ax-neutral-600);
    /* Secondary - color/neutral/600 */
    --ax-text-tertiary: var(--ax-neutral-500);
    /* Tertiary  - color/neutral/500 */
    --ax-text-muted: var(--ax-neutral-400);
    /* Muted     - color/neutral/400 */
    --ax-text-inverse: var(--ax-white);
    /* Inverse   - color/white       */

    --ax-text-success: var(--ax-green-800);
    /* Success   - color/green/800   */
    --ax-text-warning: var(--ax-orange-900);
    /* Warning   - color/orange/900  */
    --ax-text-error: var(--ax-red-900);
    /* Error     - color/red/900     */
    --ax-text-info: var(--ax-blue-700);
    /* Info      - color/blue/700    */


    /* ========== Input ========== */

    --ax-input-primary: var(--ax-yellow-600);
    /* Primary      - color/yellow/600 */
    --ax-input-border: var(--ax-neutral-300);
    /* Border       - color/neutral/300 */
    --ax-input-error: var(--ax-red-700);
    /* Error        - color/red/700 */
    --ax-input-active-text: var(--ax-neutral-700);
    /* Active-Text - color/neutral/700 */
    --ax-input-label-text: var(--ax-neutral-450);
    /* Label-Text  - color/neutral/400 */
    --ax-input-icon: var(--ax-neutral-400);
    /* icon        - color/neutral/400 */
    --ax-input-disabled-bg: var(--ax-neutral-200);
    /* Disabled-BG - color/neutral/200 */
    --ax-input-disabled-text: var(--ax-neutral-500);
    /* Disabled-Text - color/neutral/500 */

    --ax-primary-heading-h1: var(--ax-neutral-1000);
    /* ========== Backgrounds ========== */

    --ax-body-bg: var(--ax-neutral-50);
    /* Body-BG  - color/neutral/50 */
    --ax-full-bg: var(--ax-neutral-25);
    /* Full-BG  - FFF EFA (with alpha) */

    /* Base font */
    --ax-font-size-base: 16px;

    /* Font sizes */
    --ax-fs-10: 10px;
    --ax-fs-12: 12px;
    --ax-fs-14: 14px;
    --ax-fs-16: 16px;
    --ax-fs-18: 18px;
    --ax-fs-20: 20px;
    --ax-fs-22: 22px;
    --ax-fs-24: 24px;
    --ax-fs-26: 26px;
    --ax-fs-28: 28px;
    --ax-fs-30: 30px;
    --ax-fs-36: 36px;
    --ax-fs-40: 40px;
    --ax-fs-48: 48px;
    --ax-fs-56: 56px;
    --ax-fs-64: 64px;
    --ax-fs-72: 72px;

    /* Line-heights */
    --ax-lh-12: 12px;
    --ax-lh-14: 14px;
    --ax-lh-16: 16px;
    --ax-lh-18: 18px;
    --ax-lh-20: 20px;
    --ax-lh-21: 21px;
    --ax-lh-22: 22px;
    --ax-lh-23: 23px;
    --ax-lh-24: 24px;
    --ax-lh-28: 28px;
    --ax-lh-32: 32px;
    --ax-lh-36: 36px;
    --ax-lh-40: 40px;
    --ax-lh-48: 48px;
    --ax-lh-56: 56px;
    --ax-lh-64: 64px;
    --ax-lh-72: 72px;

    /* Font weights */
    --ax-fw-100: 100;
    --ax-fw-200: 200;
    --ax-fw-300: 300;
    --ax-fw-400: 400;
    --ax-fw-500: 500;
    --ax-fw-600: 600;
    --ax-fw-700: 700;
    --ax-fw-800: 800;
    --ax-fw-900: 900;

    /* Letter spacing */
    --ax-letter-n0_5: -0.5px;
    --ax-letter-0: 0px;
    --ax-letter-0_5: 0.5px;

    /* Spacing scale */
    --ax-space-4: 4px;
    --ax-space-6: 6px;
    --ax-space-8: 8px;
    --ax-space-10: 10px;
    --ax-space-12: 12px;
    --ax-space-16: 16px;
    --ax-space-20: 20px;
    --ax-space-24: 24px;
    --ax-space-32: 32px;
    --ax-space-40: 40px;
    --ax-space-48: 48px;
    --ax-space-64: 64px;

    /* Radii */
    --ax-radius-2: 2px;
    --ax-radius-4: 4px;
    --ax-radius-5: 5px;
    --ax-radius-6: 6px;
    --ax-radius-8: 8px;
    --ax-radius-10: 10px;
    --ax-radius-12: 12px;
    --ax-radius-16: 16px;
    --ax-radius-20: 20px;
    --ax-radius-40: 40px;
    --ax-radius-50: 50px;
    --ax-radius-100: 100px;
    --ax-radius-9999: 9999px;
    --ax-radius-pill: 9999px;

    /* Border widths */
    --ax-border-width-1: 1px;
    --ax-border-width-2: 2px;

    /* Shadows */
    --ax-shadow-1: 0 1px 2px rgba(11, 12, 13, 0.04);
    --ax-shadow-2: 0 4px 12px rgba(2, 20, 56, 0.06);
    --ax-shadow-3: 0px 4px 14px rgba(0, 0, 0, 0.05);
    --ax-shadow-4: 0 10px 30px rgba(2, 20, 56, 0.08);
    --ax-shadow-step-drop: 0px 2px 5px rgba(169, 147, 51, 0.25);
    --ax-shadow-step-inner-1: inset 0px -2px 2px rgba(169, 147, 51, 0.15);
    --ax-shadow-step-inner-2: inset 0px 1px 1px rgba(255, 255, 255, 0.10);
    --ax-shadow-step-inner-3: inset 0px 3px 4px rgba(255, 250, 229, 0.10);
    --ax-shadow-step-active:
        var(--ax-shadow-step-drop),
        var(--ax-shadow-step-inner-1),
        var(--ax-shadow-step-inner-2),
        var(--ax-shadow-step-inner-3);
    --ax-shadow-gold-soft: 0px 0px 5px 0px rgba(169, 147, 51, 0.40);
    --ax-shadow-custom: 0px 2px 14px rgba(0, 0, 0, 0.25);
    --ax-shadow-soft: 0px 1px 10px rgba(43, 35, 17, 0.08);

    /* Z-index */
    --ax-z-modal: 1000;
    --ax-z-dropdown: 900;
    --ax-z-header: 800;

    /* Transitions */
    --ax-transition-fast: 150ms;
    --ax-transition: 250ms cubic-bezier(.4, 0, .2, 1);
    --ax-transition-slow: 400ms;

    /* Modal backdrops */
    --ax-modal-backdrop: rgba(9, 10, 11, 0.48);
    --ax-overlay-border: var(--ax-blue-750-6);
    --ax-overlay-hint-bg: rgba(3, 19, 48, 0.5);


}