:root {
    /* region Basic colors */
    --kt-ui-white: var(--c-ui-white, #ffffff);
    --kt-ui-white-hover: var(--c-ui-white-hover, #f4f4f4);
    --kt-ui-white-transparent: var(--c-ui-white-transparent, rgba(255, 255, 255, 0.8));

    --kt-ui-gray-10: var(--c-ui-gray-10, #f4f4f4);
    --kt-ui-gray-10-hover: var(--c-ui-gray-10-hover, #e8e8e8);
    --kt-ui-cool-gray-15: var(--c-ui-cool-gray-15, #e7e9ec);
    --kt-ui-cool-gray-20: var(--c-ui-cool-gray-20, #dde1e6);
    --kt-ui-warm-gray-15: var(--c-ui-warm-gray-15, #ede9e9);
    --kt-ui-warm-gray-20: var(--c-ui-warm-gray-20, #e5e0df);
    --kt-ui-gray-20: var(--c-ui-gray-20, #e0e0e0);
    --kt-ui-gray-20-hover: var(--c-ui-gray-20-hover, #e5e5e5);
    --kt-ui-gray-30: var(--c-ui-gray-30, #c6c6c6);
    --kt-ui-gray-30-hover: var(--c-ui-gray-30-hover, #b5b5b5);
    --kt-ui-gray-40: var(--c-ui-gray-40, #a8a8a8);
    --kt-ui-gray-50: var(--c-ui-gray-50, #8d8d8d);
    --kt-ui-gray-60: var(--c-ui-gray-60, #6f6f6f);
    --kt-ui-gray-70: var(--c-ui-gray-70, #525252);
    --kt-ui-gray-80: var(--c-ui-gray-80, #393939);
    --kt-ui-gray-80-hover: var(--c-ui-gray-80-hover, #4c4c4c);
    --kt-ui-gray-100: var(--c-ui-gray-100, #161616);

    --kt-ui-green-15: var(--c-ui-green-15, #dbf1e1);
    --kt-ui-green-20: var(--c-ui-green-20, #a7f0ba);
    --kt-ui-green-20-hover: var(--c-ui-green-20-hover, #74e792);
    --kt-ui-green-50: var(--c-ui-green-50, #24a148);
    --kt-ui-green-50-hover: var(--c-ui-green-50-hover, #208e3f);
    --kt-ui-green-60: var(--c-ui-green-60, #198038);

    --kt-ui-teal-15: var(--c-ui-teal-15, #d7efee);
    --kt-ui-teal-20: var(--c-ui-teal-20, #9ef0f0);
    --kt-ui-teal-20-hover: var(--c-ui-teal-20-hover, #57e5e5);
    --kt-ui-teal-50: var(--c-ui-teal-50, #009d9a);
    --kt-ui-teal-50-hover: var(--c-ui-teal-50-hover, #008a87);

    --kt-ui-cyan-15: var(--c-ui-cyan-15, #d6ecf9);
    --kt-ui-cyan-20: var(--c-ui-cyan-20, #bae6ff);
    --kt-ui-cyan-20-hover: var(--c-ui-cyan-20-hover, #99daff);
    --kt-ui-cyan-50: var(--c-ui-cyan-50, #1192e8);
    --kt-ui-cyan-50-hover: var(--c-ui-cyan-50-hover, #0f7ec8);

    --kt-ui-purple-15: var(--c-ui-purple-15, #ebe7f8);
    --kt-ui-purple-20: var(--c-ui-purple-20, #e4dbfd);
    --kt-ui-purple-20-hover: var(--c-ui-purple-20-hover, #dcc7ff);
    --kt-ui-purple-50: var(--c-ui-purple-50, #9a77f7);
    --kt-ui-purple-50-hover: var(--c-ui-purple-50-hover, #865bf5);
    --kt-ui-purple-60: var(--c-ui-purple-60, #7949f4);
    --kt-ui-purple-60-hover: var(--c-ui-purple-60-hover, #623bc6);
    --kt-ui-purple-80: var(--c-ui-purple-80, #402781);

    --kt-ui-blue-20: var(--c-ui-blue-20, #d0e2ff);
    --kt-ui-blue-20-hover: var(--c-ui-blue-20-hover, #b8d3ff);
    --kt-ui-blue-50: var(--c-ui-blue-50, #4589ff);
    --kt-ui-blue-50-hover: var(--c-ui-blue-50-hover, #1f70ff);
    --kt-ui-blue-60: var(--c-ui-blue-60, #0f62fe);
    --kt-ui-blue-70: var(--c-ui-blue-70, #164194);

    --kt-ui-magenta-15: var(--c-ui-magenta-15, #fce9f1);
    --kt-ui-magenta-20: var(--c-ui-magenta-20, #ffd6e8);
    --kt-ui-magenta-20-hover: var(--c-ui-magenta-20-hover, #ffbdda);
    --kt-ui-magenta-50: var(--c-ui-magenta-50, #ee5396);
    --kt-ui-magenta-50-hover: var(--c-ui-magenta-50-hover, #e3176f);

    --kt-ui-red-15: var(--c-ui-red-15, #f9e5e5);
    --kt-ui-red-20: var(--c-ui-red-20, #ffd7d9);
    --kt-ui-red-20-hover: var(--c-ui-red-20-hover, #ffc2c5);
    --kt-ui-red-50: var(--c-ui-red-50, #fa4d56);
    --kt-ui-red-50-hover: var(--c-ui-red-50-hover, #ee0713);

    --kt-ui-orange-15: var(--c-ui-orange-15, #ffecdf);
    --kt-ui-orange-20: var(--c-ui-orange-20, #ffd9be);
    --kt-ui-orange-20-hover: var(--c-ui-orange-20-hover, #ffc69e);
    --kt-ui-orange-50: var(--c-ui-orange-50, #eb6200);
    --kt-ui-orange-50-hover: var(--c-ui-orange-50-hover, #cc5500);

    --kt-ui-yellow-15: var(--c-ui-yellow-15, #fef1c3);
    --kt-ui-yellow-20: var(--c-ui-yellow-20, #fde9a1);
    --kt-ui-yellow-20-hover: var(--c-ui-yellow-20-hover, #fccd27);
    --kt-ui-yellow-50: var(--c-ui-yellow-50, #f1c21b);
    --kt-ui-yellow-50-hover: var(--c-ui-yellow-50-hover, #ebb909);
    /* endregion Basic colors */

    /* region Common Tokens*/
    --kt-ui-color-primary: var(--c-ui-color-primary, var(--kt-ui-purple-60));
    --kt-ui-color-primary-hover: var(--c-ui-color-primary-hover, var(--kt-ui-purple-60-hover));
    --kt-ui-color-primary-active: var(--c-ui-color-primary-active, var(--kt-ui-purple-80));

    --kt-ui-color-accented: var(--c-ui-color-accented, var(--kt-ui-purple-60));
    --kt-ui-color-accented-hover: var(--c-ui-color-accented-hover, var(--kt-ui-purple-60-hover));
    --kt-ui-color-accented-active: var(--c-ui-color-accented-active, var(--kt-ui-purple-80));

    --kt-ui-color-success: var(--c-ui-color-success, var(--kt-ui-green-50));
    --kt-ui-color-success-hover: var(--c-ui-color-success-hover, var(--kt-ui-green-50-hover));

    --kt-ui-color-danger: var(--c-ui-color-danger, var(--kt-ui-red-50));
    --kt-ui-color-danger-hover: var(--c-ui-color-danger-hover, var(--kt-ui-red-50-hover));

    --kt-ui-color-warning: var(--c-ui-color-warning, var(--kt-ui-yellow-50));
    --kt-ui-color-warning-hover: var(--c-ui-color-warning-hover, var(--kt-ui-yellow-50-hover));

    --kt-ui-color-info: var(--c-ui-color-info, var(--kt-ui-blue-60));
    /* endregion Common Tokens*/

    /* region Background Tokens */
    --kt-ui-background: var(--c-ui-background, var(--kt-ui-gray-10));
    --kt-ui-background-hover: var(--c-ui-background-hover, var(--kt-ui-gray-10-hover));
    --kt-ui-background-active: var(--c-ui-background-active, var(--kt-ui-gray-20-hover));
    /* endregion Background Tokens */

    /* region Layer Tokens */
    --kt-ui-layer-01: var(--c-ui-layer-01, var(--kt-ui-white));
    --kt-ui-layer-01-hover: var(--c-ui-layer-01-hover, var(--kt-ui-white-hover));
    --kt-ui-layer-01-active: var(--c-ui-layer-01-active, var(--kt-ui-gray-30));
    --kt-ui-layer-01-selected: var(--c-ui-layer-01-selected, var(--kt-ui-gray-10-hover));
    --kt-ui-layer-01-transparent: var(--c-ui-layer-01-transparent, var(--kt-ui-white-transparent));

    --kt-ui-layer-02: var(--c-ui-layer-02, var(--kt-ui-gray-10));
    --kt-ui-layer-02-hover: var(--c-ui-layer-02-hover, var(--kt-ui-gray-20-hover));
    --kt-ui-layer-02-active: var(--c-ui-layer-02-active, var(--kt-ui-gray-30));
    --kt-ui-layer-02-selected: var(--c-ui-layer-02-selected, var(--kt-ui-gray-10-hover));
    /* endregion Layer Tokens */

    /* region Layer Accent Tokens */
    /* region Low contrast layer accent */
    --kt-ui-layer-low-accent-cool-gray: var(--c-ui-layer-low-accent-cool-gray, var(--kt-ui-cool-gray-15));
    --kt-ui-layer-low-accent-warm-gray: var(--c-ui-layer-low-accent-warm-gray, var(--kt-ui-warm-gray-15));
    --kt-ui-layer-low-accent-gray: var(--c-ui-layer-low-accent-gray, var(--kt-ui-gray-20));
    --kt-ui-layer-low-accent-green: var(--c-ui-layer-low-accent-green, var(--kt-ui-green-15));
    --kt-ui-layer-low-accent-teal: var(--c-ui-layer-low-accent-teal, var(--kt-ui-teal-15));
    --kt-ui-layer-low-accent-cyan: var(--c-ui-layer-low-accent-cyan, var(--kt-ui-cyan-15));
    --kt-ui-layer-low-accent-purple: var(--c-ui-layer-low-accent-purple, var(--kt-ui-purple-15));
    --kt-ui-layer-low-accent-magenta: var(--c-ui-layer-low-accent-magenta, var(--kt-ui-magenta-15));
    --kt-ui-layer-low-accent-red: var(--c-ui-layer-low-accent-red, var(--kt-ui-red-15));
    --kt-ui-layer-low-accent-orange: var(--c-ui-layer-low-accent-orange, var(--kt-ui-orange-15));
    --kt-ui-layer-low-accent-yellow: var(--c-ui-layer-low-accent-yellow, var(--kt-ui-yellow-15));
    /* endregion Low contrast layer accent */

    /* region Middle contrast layer accent */
    --kt-ui-layer-middle-accent-cool-gray: var(--c-ui-layer-middle-accent-cool-gray, var(--kt-ui-cool-gray-20));
    --kt-ui-layer-middle-accent-warm-gray: var(--c-ui-layer-middle-accent-warm-gray, var(--kt-ui-warm-gray-20));
    --kt-ui-layer-middle-accent-gray: var(--c-ui-layer-middle-accent-gray, var(--kt-ui-gray-20));
    --kt-ui-layer-middle-accent-green: var(--c-ui-layer-middle-accent-green, var(--kt-ui-green-20));
    --kt-ui-layer-middle-accent-teal: var(--c-ui-layer-middle-accent-teal, var(--kt-ui-teal-20));
    --kt-ui-layer-middle-accent-cyan: var(--c-ui-layer-middle-accent-cyan, var(--kt-ui-cyan-20));
    --kt-ui-layer-middle-accent-purple: var(--c-ui-layer-middle-accent-purple, var(--kt-ui-purple-20));
    --kt-ui-layer-middle-accent-blue: var(--c-ui-layer-middle-accent-blue, var(--kt-ui-blue-20));
    --kt-ui-layer-middle-accent-magenta: var(--c-ui-layer-middle-accent-magenta, var(--kt-ui-magenta-20));
    --kt-ui-layer-middle-accent-red: var(--c-ui-layer-middle-accent-red, var(--kt-ui-red-20));
    --kt-ui-layer-middle-accent-orange: var(--c-ui-layer-middle-accent-orange, var(--kt-ui-orange-20));
    --kt-ui-layer-middle-accent-yellow: var(--c-ui-layer-middle-accent-yellow, var(--kt-ui-yellow-20));
    /* endregion Middle contrast layer accent */

    /* region High contrast layer accent */
    --kt-ui-layer-high-accent-green: var(--c-ui-layer-high-accent-green, var(--kt-ui-color-success));
    --kt-ui-layer-high-accent-teal: var(--c-ui-layer-high-accent-teal, var(--kt-ui-teal-50));
    --kt-ui-layer-high-accent-cyan: var(--c-ui-layer-high-accent-cyan, var(--kt-ui-cyan-50));
    --kt-ui-layer-high-accent-purple: var(--c-ui-layer-high-accent-purple, var(--kt-ui-color-accented));
    --kt-ui-layer-high-accent-blue: var(--c-ui-layer-high-accent-blue, var(--kt-ui-color-info));
    --kt-ui-layer-high-accent-magenta: var(--c-ui-layer-high-accent-magenta, var(--kt-ui-magenta-50));
    --kt-ui-layer-high-accent-red: var(--c-ui-layer-high-accent-red, var(--kt-ui-color-danger));
    --kt-ui-layer-high-accent-orange: var(--c-ui-layer-high-accent-orange, var(--kt-ui-orange-50));
    --kt-ui-layer-high-accent-yellow: var(--c-ui-layer-high-accent-yellow, var(--kt-ui-color-warning));
    /* endregion High contrast layer accent */
    /* endregion Layer Accent Tokens */

    /* region Field Tokens */
    /*Field Tokens*/
    --kt-ui-field-01: var(--c-ui-field-01, var(--kt-ui-white));
    --kt-ui-field-01-hover: var(--c-ui-field-01-hover, var(--kt-ui-gray-10-hover));

    --kt-ui-field-02: var(--c-ui-field-02, var(--kt-ui-gray-10));
    --kt-ui-field-02-hover: var(--c-ui-field-02-hover, var(--kt-ui-gray-10-hover));
    --kt-ui-field-02-active: var(--c-ui-field-02-active, var(--kt-ui-white));

    --kt-ui-field-03: var(--c-ui-field-03, var(--kt-ui-white));
    --kt-ui-field-03-hover: var(--c-ui-field-03-hover, var(--kt-ui-gray-10-hover));
    /* endregion Field Tokens */

    /* region Border Tokens */
    --kt-ui-border-subtle-00: var(--c-ui-border-subtle-00, var(--kt-ui-gray-30));
    --kt-ui-border-subtle-00-hover: var(--c-ui-border-subtle-00-hover, var(--kt-ui-gray-30-hover));
    --kt-ui-border-subtle-00-active: var(--c-ui-border-subtle-00-active, var(--kt-ui-gray-50));

    --kt-ui-border-subtle-01: var(--c-ui-border-subtle-01, var(--kt-ui-gray-20));
    --kt-ui-border-subtle-01-selected: var(--c-ui-border-subtle-01-selected, var(--kt-ui-gray-70));

    --kt-ui-border-accent: var(--c-ui-border-accent, var(--kt-ui-color-accented));
    --kt-ui-border-error: var(--c-ui-border-error, var(--kt-ui-color-danger));
    --kt-ui-border-disabled: var(--c-ui-border-disabled, var(--kt-ui-gray-20));
    /* endregion Border Tokens */

    /* region Text Tokens */
    --kt-ui-text-primary: var(--c-ui-text-primary, var(--kt-ui-gray-100));
    --kt-ui-text-secondary: var(--c-ui-text-secondary, var(--kt-ui-gray-60));
    --kt-ui-text-placeholder: var(--c-ui-text-placeholder, var(--kt-ui-gray-40));
    --kt-ui-text-on-color: var(--c-ui-text-on-color, var(--kt-ui-white));
    --kt-ui-text-accented: var(--c-ui-text-accented, var(--kt-ui-color-accented));
    --kt-ui-text-helper: var(--c-ui-text-helper, var(--kt-ui-gray-60));
    --kt-ui-text-error: var(--c-ui-text-error, var(--kt-ui-color-danger));
    --kt-ui-text-success: var(--c-ui-text-success, var(--kt-ui-green-60));
    --kt-ui-text-warning: var(--c-ui-text-warning, var(--kt-ui-color-warning));
    --kt-ui-text-disabled: var(--c-ui-text-disabled, var(--kt-ui-gray-30));
    --kt-ui-text-on-color-disabled: var(--c-ui-text-on-color-disabled, var(--kt-ui-gray-50));
    /* endregion Text Tokens */

    /* region Icon Tokens */
    --kt-ui-icon-primary: var(--c-ui-icon-primary, var(--kt-ui-gray-100));
    --kt-ui-icon-secondary: var(--c-ui-icon-secondary, var(--kt-ui-gray-70));
    --kt-ui-icon-on-color: var(--c-ui-icon-on-color, var(--kt-ui-white));
    --kt-ui-icon-accented: var(--c-ui-icon-accented, var(--kt-ui-color-accented));
    --kt-ui-icon-success: var(--c-ui-icon-success, var(--kt-ui-color-success));
    --kt-ui-icon-error: var(--c-ui-icon-error, var(--kt-ui-color-danger));
    --kt-ui-icon-warning: var(--c-ui-icon-warning, var(--kt-ui-color-warning));
    --kt-ui-icon-informational: var(--c-ui-icon-informational, var(--kt-ui-color-info));
    --kt-ui-icon-on-color-disabled: var(--c-ui-icon-on-color-disabled, var(--kt-ui-gray-50));
    --kt-ui-icon-disabled: var(--c-ui-icon-disabled, var(--kt-ui-gray-30));
    /* endregion Icon Tokens */

    /* region Focus Tokens */
    --kt-ui-focus: var(--c-ui-focus, var(--kt-ui-color-accented));
    /* endregion Focus Tokens */

    /* region Miscellaneous Tokens */
    --kt-ui-interactive: var(--c-ui-interactive, var(--kt-ui-color-accented));
    --kt-ui-interactive-hover: var(--c-ui-interactive-hover, var(--kt-ui-color-accented-hover));
    --kt-ui-interactive-active: var(--c-ui-interactive-active, var(--kt-ui-color-accented-active));
    --kt-ui-highlight: var(--c-ui-highlight, var(--kt-ui-blue-20));
    --kt-ui-overlay: rgb(from var(--c-ui-overlay, var(--kt-ui-gray-100)) r g b / 50%);
    --kt-ui-skeleton-background: var(--c-ui-skeleton-background, var(--kt-ui-gray-10-hover));
    --kt-ui-image-background: var(--c-ui-image-background, var(--kt-ui-gray-10));
    --kt-ui-skeleton-element: var(--c-ui-skeleton-element, var(--kt-ui-gray-30));
    --kt-ui-transparent-01: rgb(from var(--kt-ui-white) r g b / 0%);
    /* endregion Miscellaneous Tokens */

    /* region Tag Tokens */
    --kt-ui-tag-default: var(--c-ui-tag-default, var(--kt-ui-color-accented));
    --kt-ui-tag-default-hover: var(--c-ui-tag-default-hover, var(--kt-ui-color-accented-hover));

    --kt-ui-tag-blue-20: var(--c-ui-tag-blue-20, var(--kt-ui-blue-20));
    --kt-ui-tag-blue-20-hover: var(--c-ui-tag-blue-20-hover, var(--kt-ui-blue-20-hover));
    --kt-ui-tag-cyan-20: var(--c-ui-tag-cyan-20, var(--kt-ui-cyan-20));
    --kt-ui-tag-cyan-20-hover: var(--c-ui-tag-cyan-20-hover, var(--kt-ui-cyan-20-hover));
    --kt-ui-tag-green-20: var(--c-ui-tag-green-20, var(--kt-ui-green-20));
    --kt-ui-tag-green-20-hover: var(--c-ui-tag-green-20-hover, var(--kt-ui-green-20-hover));
    --kt-ui-tag-magenta-20: var(--c-ui-tag-magenta-20, var(--kt-ui-magenta-20));
    --kt-ui-tag-magenta-20-hover: var(--c-ui-tag-magenta-20-hover, var(--kt-ui-magenta-20-hover));
    --kt-ui-tag-purple-20: var(--c-ui-tag-purple-20, var(--kt-ui-purple-20));
    --kt-ui-tag-purple-20-hover: var(--c-ui-tag-purple-20-hover, var(--kt-ui-purple-20-hover));
    --kt-ui-tag-red-20: var(--c-ui-tag-red-20, var(--kt-ui-red-20));
    --kt-ui-tag-red-20-hover: var(--c-ui-tag-red-20-hover, var(--kt-ui-red-20-hover));
    --kt-ui-tag-teal-20: var(--c-ui-tag-teal-20, var(--kt-ui-teal-20));
    --kt-ui-tag-teal-20-hover: var(--c-ui-tag-teal-20-hover, var(--kt-ui-teal-20-hover));
    --kt-ui-tag-yellow-20: var(--c-ui-tag-yellow-20, var(--kt-ui-yellow-20));
    --kt-ui-tag-yellow-20-hover: var(--c-ui-tag-yellow-20-hover, var(--kt-ui-yellow-20-hover));
    --kt-ui-tag-orange-20: var(--c-ui-tag-orange-20, var(--kt-ui-orange-20));
    --kt-ui-tag-orange-20-hover: var(--c-ui-tag-orange-20-hover, var(--kt-ui-orange-20-hover));
    --kt-ui-tag-gray-30: var(--c-ui-tag-gray-30, var(--kt-ui-gray-30));
    --kt-ui-tag-gray-30-hover: var(--c-ui-tag-gray-30-hover, var(--kt-ui-gray-30-hover));

    --kt-ui-tag-blue-50: var(--c-ui-tag-blue-50, var(--kt-ui-blue-50));
    --kt-ui-tag-blue-60: #164194;
    --kt-ui-tag-blue-50-hover: var(--c-ui-tag-blue-50-hover, var(--kt-ui-blue-50-hover));
    --kt-ui-tag-cyan-50: var(--c-ui-tag-cyan-50, var(--kt-ui-cyan-50));
    --kt-ui-tag-cyan-50-hover: var(--c-ui-tag-cyan-50-hover, var(--kt-ui-cyan-50-hover));
    --kt-ui-tag-green-50: var(--c-ui-tag-green-50, var(--kt-ui-green-50));
    --kt-ui-tag-green-50-hover: var(--c-ui-tag-green-50-hover, var(--kt-ui-green-50-hover));
    --kt-ui-tag-magenta-50: var(--c-ui-tag-magenta-50, var(--kt-ui-magenta-50));
    --kt-ui-tag-magenta-50-hover: var(--c-ui-tag-magenta-50-hover, var(--kt-ui-magenta-50-hover));
    --kt-ui-tag-purple-50: var(--c-ui-tag-purple-50, var(--kt-ui-purple-50));
    --kt-ui-tag-purple-50-hover: var(--c-ui-tag-purple-50-hover, var(--kt-ui-purple-50-hover));
    --kt-ui-tag-red-50: var(--c-ui-tag-red-50, var(--kt-ui-red-50));
    --kt-ui-tag-red-50-hover: var(--c-ui-tag-red-50-hover, var(--kt-ui-red-50-hover));
    --kt-ui-tag-teal-50: var(--c-ui-tag-teal-50, var(--kt-ui-teal-50));
    --kt-ui-tag-teal-50-hover: var(--c-ui-tag-teal-50-hover, var(--kt-ui-teal-50-hover));
    --kt-ui-tag-yellow-50: var(--c-ui-tag-yellow-50, var(--kt-ui-yellow-50));
    --kt-ui-tag-yellow-50-hover: var(--c-ui-tag-yellow-50-hover, var(--kt-ui-yellow-50-hover));
    --kt-ui-tag-orange-50: var(--c-ui-tag-orange-50, var(--kt-ui-orange-50));
    --kt-ui-tag-orange-50-hover: var(--c-ui-tag-orange-50-hover, var(--kt-ui-orange-50-hover));
    --kt-ui-tag-gray-80: var(--c-ui-tag-gray-80, var(--kt-ui-gray-80));
    --kt-ui-tag-gray-80-hover: var(--c-ui-tag-gray-80-hover, var(--kt-ui-gray-80-hover));
    /* endregion Tag Tokens */

    /* region Icon Tokens */
    --kt-ui-close-icon: var(--c-ui-close-icon, url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'><path d='M10 0.875L9.125 0L5 4.125L0.875 0L0 0.875L4.125 5L0 9.125L0.875 10L5 5.875L9.125 10L10 9.125L5.875 5L10 0.875Z'/></svg>"));
    /* endregion Icon Tokens */

    /* region Border radius tokens */
    --kt-ui-border-radius-base: var(--c-ui-border-radius-base, 2px);
    --kt-ui-border-radius-xs: var(--c-ui-border-radius-xs, calc(var(--kt-ui-border-radius-base) * 1));
    --kt-ui-border-radius-sm: var(--c-ui-border-radius-sm, calc(var(--kt-ui-border-radius-base) * 2));
    --kt-ui-border-radius-md: var(--c-ui-border-radius-md, calc(var(--kt-ui-border-radius-base) * 4));
    --kt-ui-border-radius-lg: var(--c-ui-border-radius-lg, calc(var(--kt-ui-border-radius-base) * 8));
    --kt-ui-border-radius-xl: var(--c-ui-border-radius-xl, calc(var(--kt-ui-border-radius-base) * 12));
    /* endregion Border radius tokens */

    /* region Size Tokens */
    --kt-ui-size-base: var(--c-ui-size-base, 16px);
    --kt-ui-size-none: 0;
    --kt-ui-size-3xs: var(--c-ui-size-3xs, calc(var(--kt-ui-size-base) * 0.125));
    --kt-ui-size-2xs: var(--c-ui-size-2xs, calc(var(--kt-ui-size-base) * 0.25));
    --kt-ui-size-xs: var(--c-ui-size-xs, calc(var(--kt-ui-size-base) * 0.5));
    --kt-ui-size-sm: var(--c-ui-size-sm, calc(var(--kt-ui-size-base) * 0.75));
    --kt-ui-size-md: var(--c-ui-size-md, calc(var(--kt-ui-size-base) * 1));
    --kt-ui-size-md2: var(--c-ui-size-md2, calc(var(--kt-ui-size-base) * 1.25));
    --kt-ui-size-lg: var(--c-ui-size-lg, calc(var(--kt-ui-size-base) * 1.5));
    --kt-ui-size-xl: var(--c-ui-size-xl, calc(var(--kt-ui-size-base) * 2));
    --kt-ui-size-2xl: var(--c-ui-size-2xl, calc(var(--kt-ui-size-base) * 2.5));
    --kt-ui-size-3xl: var(--c-ui-size-3xl, calc(var(--kt-ui-size-base) * 3));
    --kt-ui-size-4xl: var(--c-ui-size-4xl, calc(var(--kt-ui-size-base) * 4));
    --kt-ui-size-5xl: var(--c-ui-size-5xl, calc(var(--kt-ui-size-base) * 5));
    --kt-ui-size-6xl: var(--c-ui-size-6xl, calc(var(--kt-ui-size-base) * 6));
    --kt-ui-size-7xl: var(--c-ui-size-7xl, calc(var(--kt-ui-size-base) * 10));
    /* endregion Size Tokens */

    /* region Offset Tokens */
    --kt-ui-offset-base: var(--c-ui-offset-base, 2px);
    --kt-ui-offset-xs: var(--c-ui-offset-xs, calc(var(--kt-ui-offset-base) * 1));
    --kt-ui-offset-sm: var(--c-ui-offset-sm, calc(var(--kt-ui-offset-base) * 2));
    --kt-ui-offset-md: var(--c-ui-offset-md, calc(var(--kt-ui-offset-base) * 4));
    --kt-ui-offset-lg: var(--c-ui-offset-lg, calc(var(--kt-ui-offset-base) * 8));
    --kt-ui-offset-xl: var(--c-ui-offset-xl, calc(var(--kt-ui-offset-base) * 12));
    --kt-ui-offset-2xl: var(--c-ui-offset-2xl, calc(var(--kt-ui-offset-base) * 16));
    /* endregion Offset Tokens */

    /* region Box shadow Tokens */
    --kt-ui-box-shadow-base: 0 4px 16px 0 rgba(0, 0, 0, 0.1);
    --kt-ui-box-shadow-focus: inset 0 0 0 2px var(--kt-ui-focus);
    /* endregion Box shadow Tokens */

    /*Icons*/

    --kt-ui-home-icon: url("./images/home-icon.svg")
}