.tui-theme-variables() {
    // Fonts
    --tui-typography-family-text: 'Manrope', system-ui, sans-serif;
    --tui-typography-family-display: 'Manrope', system-ui, sans-serif;
    --tui-font-offset: calc(var(--t-font-offset, 0) * 1px);
    --tui-font-scale: calc((22 + var(--t-font-offset, 0)) / 22);
    // Heading
    --tui-typography-heading-h1: bold calc(var(--tui-font-offset) + 3.125rem) / calc(56 / 50) var(--tui-typography-family-display);
    --tui-typography-heading-h2: bold calc(var(--tui-font-offset) + 2.75rem) / calc(48 / 44) var(--tui-typography-family-display);
    --tui-typography-heading-h3: bold calc(var(--tui-font-offset) + 2.25rem) / calc(40 / 36) var(--tui-typography-family-display);
    --tui-typography-heading-h4: bold calc(var(--tui-font-offset) + 1.75rem) / calc(32 / 28) var(--tui-typography-family-display);
    --tui-typography-heading-h5: bold calc(var(--tui-font-offset) + 1.5rem) / calc(28 / 24) var(--tui-typography-family-display);
    --tui-typography-heading-h6: bold calc(var(--tui-font-offset) + 1.25rem) / calc(24 / 20) var(--tui-typography-family-display);
    // Body
    --tui-typography-body-l: normal calc(var(--tui-font-offset) + 1.0625rem) / calc(28 / 17) var(--tui-typography-family-text);
    --tui-typography-body-m: normal calc(var(--tui-font-offset) + 1rem) / calc(24 / 16) var(--tui-typography-family-text);
    --tui-typography-body-s: normal calc(var(--tui-font-offset) + 0.875rem) / calc(20 / 14) var(--tui-typography-family-text);
    --tui-typography-body-xs: normal calc(var(--tui-font-offset) + 0.75rem) / calc(16 / 12) var(--tui-typography-family-text);
    // Reduced
    --tui-typography-ui-l: normal calc(var(--tui-font-offset) + 1.0625rem) / calc(24 / 17) var(--tui-typography-family-text);
    --tui-typography-ui-m: normal calc(var(--tui-font-offset) + 1rem) / calc(20 / 16) var(--tui-typography-family-text);
    --tui-typography-ui-s: normal calc(var(--tui-font-offset) + 0.875rem) / calc(16 / 14) var(--tui-typography-family-text);
    --tui-typography-ui-xs: normal calc(var(--tui-font-offset) + 0.75rem) / calc(15 / 12) var(--tui-typography-family-text);
    --tui-typography-ui-2xs: normal calc(var(--tui-font-offset) + 0.6875rem) / calc(12 / 11) var(--tui-typography-family-text);
    // Radii
    --tui-radius-xs: 0.25rem;
    --tui-radius-s: 0.5rem;
    --tui-radius-m: 0.625rem;
    --tui-radius-l: 0.75rem;
    --tui-radius-xl: 1.5rem;
    // Sizes
    --tui-height-xs: 1.5rem;
    --tui-height-s: 2rem;
    --tui-height-m: 2.75rem;
    --tui-height-l: 3.5rem;
    // Input padding
    --tui-padding-s: 0.625rem;
    --tui-padding-m: 0.75rem;
    --tui-padding-l: 1rem;
    // Misc
    --tui-stroke-width: 0.125rem;
    --tui-duration: 0.3s;
    --tui-disabled-opacity: 0.56;
    --tui-lh: 1.4em;
    // logical
    --tui-inline-start: left;
    --tui-inline-end: right;
    --tui-inline: 1;

    @supports (font-size: 1lh) {
        --tui-lh: 1lh;
    }

    // TODO: drop in v6
    --tui-duration-slowest: calc(var(--tui-duration) / 0.429);
    --tui-duration-slow: calc(var(--tui-duration) / 0.6);
    --tui-duration-fast: calc(var(--tui-duration) / 2);
    --tui-duration-fastest: calc(var(--tui-duration) / 4);
}

.tui-theme-rtl() {
    --tui-inline-start: right;
    --tui-inline-end: left;
    --tui-inline: -1;
}