@layer variables {
  :root {
    --tk-tint-factor-1x: .2;
    --tk-tint-factor-2x: .38;
    --tk-tint-factor-3x: .55;
    --tk-tint-factor-4x: .72;
    --tk-tint-factor-5x: .88;
    --tk-shade-factor-1x: .8;
    --tk-shade-factor-2x: .62;
    --tk-shade-factor-3x: .45;
    --tk-shade-factor-4x: .3;
    --tk-shade-factor-5x: .15;
    --tk-tint-chroma-1x: .95;
    --tk-tint-chroma-2x: .85;
    --tk-tint-chroma-3x: .72;
    --tk-tint-chroma-4x: .55;
    --tk-tint-chroma-5x: .35;
    --tk-shade-chroma-1x: 1;
    --tk-shade-chroma-2x: .95;
    --tk-shade-chroma-3x: .85;
    --tk-shade-chroma-4x: .7;
    --tk-shade-chroma-5x: .5;
    --tk-alpha-1: 5%;
    --tk-alpha-2: 10%;
    --tk-alpha-3: 15%;
    --tk-alpha-4: 20%;
    --tk-alpha-5: 30%;
    --tk-alpha-6: 40%;
    --tk-alpha-7: 55%;
    --tk-alpha-8: 70%;
    --tk-alpha-9: 85%;
    --tk-alpha-10: 95%;
    --tk-l-tint-1x: calc(l + (1 - l) * var(--tk-tint-factor-1x));
    --tk-l-tint-2x: calc(l + (1 - l) * var(--tk-tint-factor-2x));
    --tk-l-tint-3x: calc(l + (1 - l) * var(--tk-tint-factor-3x));
    --tk-l-tint-4x: calc(l + (1 - l) * var(--tk-tint-factor-4x));
    --tk-l-tint-5x: calc(l + (1 - l) * var(--tk-tint-factor-5x));
    --tk-l-shade-1x: calc(l * var(--tk-shade-factor-1x));
    --tk-l-shade-2x: calc(l * var(--tk-shade-factor-2x));
    --tk-l-shade-3x: calc(l * var(--tk-shade-factor-3x));
    --tk-l-shade-4x: calc(l * var(--tk-shade-factor-4x));
    --tk-l-shade-5x: calc(l * var(--tk-shade-factor-5x));
    --tk-c-tint-1x: calc(c * var(--tk-tint-chroma-1x));
    --tk-c-tint-2x: calc(c * var(--tk-tint-chroma-2x));
    --tk-c-tint-3x: calc(c * var(--tk-tint-chroma-3x));
    --tk-c-tint-4x: calc(c * var(--tk-tint-chroma-4x));
    --tk-c-tint-5x: calc(c * var(--tk-tint-chroma-5x));
    --tk-c-shade-1x: calc(c * var(--tk-shade-chroma-1x));
    --tk-c-shade-2x: calc(c * var(--tk-shade-chroma-2x));
    --tk-c-shade-3x: calc(c * var(--tk-shade-chroma-3x));
    --tk-c-shade-4x: calc(c * var(--tk-shade-chroma-4x));
    --tk-c-shade-5x: calc(c * var(--tk-shade-chroma-5x));
    --tk-h-tint-1x: h;
    --tk-h-tint-2x: h;
    --tk-h-tint-3x: h;
    --tk-h-tint-4x: h;
    --tk-h-tint-5x: h;
    --tk-h-shade-1x: h;
    --tk-h-shade-2x: h;
    --tk-h-shade-3x: h;
    --tk-h-shade-4x: h;
    --tk-h-shade-5x: h;
    --tk-color-primary-5xlight: oklch(from var(--tk-color-primary) var(--tk-l-tint-5x) var(--tk-c-tint-5x) var(--tk-h-tint-5x));
    --tk-color-primary-4xlight: oklch(from var(--tk-color-primary) var(--tk-l-tint-4x) var(--tk-c-tint-4x) var(--tk-h-tint-4x));
    --tk-color-primary-3xlight: oklch(from var(--tk-color-primary) var(--tk-l-tint-3x) var(--tk-c-tint-3x) var(--tk-h-tint-3x));
    --tk-color-primary-2xlight: oklch(from var(--tk-color-primary) var(--tk-l-tint-2x) var(--tk-c-tint-2x) var(--tk-h-tint-2x));
    --tk-color-primary-1xlight: oklch(from var(--tk-color-primary) var(--tk-l-tint-1x) var(--tk-c-tint-1x) var(--tk-h-tint-1x));
    --tk-color-primary-1xdark: oklch(from var(--tk-color-primary) var(--tk-l-shade-1x) var(--tk-c-shade-1x) var(--tk-h-shade-1x));
    --tk-color-primary-2xdark: oklch(from var(--tk-color-primary) var(--tk-l-shade-2x) var(--tk-c-shade-2x) var(--tk-h-shade-2x));
    --tk-color-primary-3xdark: oklch(from var(--tk-color-primary) var(--tk-l-shade-3x) var(--tk-c-shade-3x) var(--tk-h-shade-3x));
    --tk-color-primary-4xdark: oklch(from var(--tk-color-primary) var(--tk-l-shade-4x) var(--tk-c-shade-4x) var(--tk-h-shade-4x));
    --tk-color-primary-5xdark: oklch(from var(--tk-color-primary) var(--tk-l-shade-5x) var(--tk-c-shade-5x) var(--tk-h-shade-5x));
    --tk-color-primary-1a: oklch(from var(--tk-color-primary) l c h / var(--tk-alpha-1));
    --tk-color-primary-2a: oklch(from var(--tk-color-primary) l c h / var(--tk-alpha-2));
    --tk-color-primary-3a: oklch(from var(--tk-color-primary) l c h / var(--tk-alpha-3));
    --tk-color-primary-4a: oklch(from var(--tk-color-primary) l c h / var(--tk-alpha-4));
    --tk-color-primary-5a: oklch(from var(--tk-color-primary) l c h / var(--tk-alpha-5));
    --tk-color-primary-6a: oklch(from var(--tk-color-primary) l c h / var(--tk-alpha-6));
    --tk-color-primary-7a: oklch(from var(--tk-color-primary) l c h / var(--tk-alpha-7));
    --tk-color-primary-8a: oklch(from var(--tk-color-primary) l c h / var(--tk-alpha-8));
    --tk-color-primary-9a: oklch(from var(--tk-color-primary) l c h / var(--tk-alpha-9));
    --tk-color-primary-10a: oklch(from var(--tk-color-primary) l c h / var(--tk-alpha-10));
    --tk-color-secondary-5xlight: oklch(from var(--tk-color-secondary) var(--tk-l-tint-5x) var(--tk-c-tint-5x) var(--tk-h-tint-5x));
    --tk-color-secondary-4xlight: oklch(from var(--tk-color-secondary) var(--tk-l-tint-4x) var(--tk-c-tint-4x) var(--tk-h-tint-4x));
    --tk-color-secondary-3xlight: oklch(from var(--tk-color-secondary) var(--tk-l-tint-3x) var(--tk-c-tint-3x) var(--tk-h-tint-3x));
    --tk-color-secondary-2xlight: oklch(from var(--tk-color-secondary) var(--tk-l-tint-2x) var(--tk-c-tint-2x) var(--tk-h-tint-2x));
    --tk-color-secondary-1xlight: oklch(from var(--tk-color-secondary) var(--tk-l-tint-1x) var(--tk-c-tint-1x) var(--tk-h-tint-1x));
    --tk-color-secondary-1xdark: oklch(from var(--tk-color-secondary) var(--tk-l-shade-1x) var(--tk-c-shade-1x) var(--tk-h-shade-1x));
    --tk-color-secondary-2xdark: oklch(from var(--tk-color-secondary) var(--tk-l-shade-2x) var(--tk-c-shade-2x) var(--tk-h-shade-2x));
    --tk-color-secondary-3xdark: oklch(from var(--tk-color-secondary) var(--tk-l-shade-3x) var(--tk-c-shade-3x) var(--tk-h-shade-3x));
    --tk-color-secondary-4xdark: oklch(from var(--tk-color-secondary) var(--tk-l-shade-4x) var(--tk-c-shade-4x) var(--tk-h-shade-4x));
    --tk-color-secondary-5xdark: oklch(from var(--tk-color-secondary) var(--tk-l-shade-5x) var(--tk-c-shade-5x) var(--tk-h-shade-5x));
    --tk-color-secondary-1a: oklch(from var(--tk-color-secondary) l c h / var(--tk-alpha-1));
    --tk-color-secondary-2a: oklch(from var(--tk-color-secondary) l c h / var(--tk-alpha-2));
    --tk-color-secondary-3a: oklch(from var(--tk-color-secondary) l c h / var(--tk-alpha-3));
    --tk-color-secondary-4a: oklch(from var(--tk-color-secondary) l c h / var(--tk-alpha-4));
    --tk-color-secondary-5a: oklch(from var(--tk-color-secondary) l c h / var(--tk-alpha-5));
    --tk-color-secondary-6a: oklch(from var(--tk-color-secondary) l c h / var(--tk-alpha-6));
    --tk-color-secondary-7a: oklch(from var(--tk-color-secondary) l c h / var(--tk-alpha-7));
    --tk-color-secondary-8a: oklch(from var(--tk-color-secondary) l c h / var(--tk-alpha-8));
    --tk-color-secondary-9a: oklch(from var(--tk-color-secondary) l c h / var(--tk-alpha-9));
    --tk-color-secondary-10a: oklch(from var(--tk-color-secondary) l c h / var(--tk-alpha-10));
    --tk-color-accent-5xlight: oklch(from var(--tk-color-accent) var(--tk-l-tint-5x) var(--tk-c-tint-5x) var(--tk-h-tint-5x));
    --tk-color-accent-4xlight: oklch(from var(--tk-color-accent) var(--tk-l-tint-4x) var(--tk-c-tint-4x) var(--tk-h-tint-4x));
    --tk-color-accent-3xlight: oklch(from var(--tk-color-accent) var(--tk-l-tint-3x) var(--tk-c-tint-3x) var(--tk-h-tint-3x));
    --tk-color-accent-2xlight: oklch(from var(--tk-color-accent) var(--tk-l-tint-2x) var(--tk-c-tint-2x) var(--tk-h-tint-2x));
    --tk-color-accent-1xlight: oklch(from var(--tk-color-accent) var(--tk-l-tint-1x) var(--tk-c-tint-1x) var(--tk-h-tint-1x));
    --tk-color-accent-1xdark: oklch(from var(--tk-color-accent) var(--tk-l-shade-1x) var(--tk-c-shade-1x) var(--tk-h-shade-1x));
    --tk-color-accent-2xdark: oklch(from var(--tk-color-accent) var(--tk-l-shade-2x) var(--tk-c-shade-2x) var(--tk-h-shade-2x));
    --tk-color-accent-3xdark: oklch(from var(--tk-color-accent) var(--tk-l-shade-3x) var(--tk-c-shade-3x) var(--tk-h-shade-3x));
    --tk-color-accent-4xdark: oklch(from var(--tk-color-accent) var(--tk-l-shade-4x) var(--tk-c-shade-4x) var(--tk-h-shade-4x));
    --tk-color-accent-5xdark: oklch(from var(--tk-color-accent) var(--tk-l-shade-5x) var(--tk-c-shade-5x) var(--tk-h-shade-5x));
    --tk-color-accent-1a: oklch(from var(--tk-color-accent) l c h / var(--tk-alpha-1));
    --tk-color-accent-2a: oklch(from var(--tk-color-accent) l c h / var(--tk-alpha-2));
    --tk-color-accent-3a: oklch(from var(--tk-color-accent) l c h / var(--tk-alpha-3));
    --tk-color-accent-4a: oklch(from var(--tk-color-accent) l c h / var(--tk-alpha-4));
    --tk-color-accent-5a: oklch(from var(--tk-color-accent) l c h / var(--tk-alpha-5));
    --tk-color-accent-6a: oklch(from var(--tk-color-accent) l c h / var(--tk-alpha-6));
    --tk-color-accent-7a: oklch(from var(--tk-color-accent) l c h / var(--tk-alpha-7));
    --tk-color-accent-8a: oklch(from var(--tk-color-accent) l c h / var(--tk-alpha-8));
    --tk-color-accent-9a: oklch(from var(--tk-color-accent) l c h / var(--tk-alpha-9));
    --tk-color-accent-10a: oklch(from var(--tk-color-accent) l c h / var(--tk-alpha-10));
    --tk-color-theme-5xlight: oklch(from var(--tk-color-theme) var(--tk-l-tint-5x) var(--tk-c-tint-5x) var(--tk-h-tint-5x));
    --tk-color-theme-4xlight: oklch(from var(--tk-color-theme) var(--tk-l-tint-4x) var(--tk-c-tint-4x) var(--tk-h-tint-4x));
    --tk-color-theme-3xlight: oklch(from var(--tk-color-theme) var(--tk-l-tint-3x) var(--tk-c-tint-3x) var(--tk-h-tint-3x));
    --tk-color-theme-2xlight: oklch(from var(--tk-color-theme) var(--tk-l-tint-2x) var(--tk-c-tint-2x) var(--tk-h-tint-2x));
    --tk-color-theme-1xlight: oklch(from var(--tk-color-theme) var(--tk-l-tint-1x) var(--tk-c-tint-1x) var(--tk-h-tint-1x));
    --tk-color-theme-1xdark: oklch(from var(--tk-color-theme) var(--tk-l-shade-1x) var(--tk-c-shade-1x) var(--tk-h-shade-1x));
    --tk-color-theme-2xdark: oklch(from var(--tk-color-theme) var(--tk-l-shade-2x) var(--tk-c-shade-2x) var(--tk-h-shade-2x));
    --tk-color-theme-3xdark: oklch(from var(--tk-color-theme) var(--tk-l-shade-3x) var(--tk-c-shade-3x) var(--tk-h-shade-3x));
    --tk-color-theme-4xdark: oklch(from var(--tk-color-theme) var(--tk-l-shade-4x) var(--tk-c-shade-4x) var(--tk-h-shade-4x));
    --tk-color-theme-5xdark: oklch(from var(--tk-color-theme) var(--tk-l-shade-5x) var(--tk-c-shade-5x) var(--tk-h-shade-5x));
    --tk-color-theme-1a: oklch(from var(--tk-color-theme) l c h / var(--tk-alpha-1));
    --tk-color-theme-2a: oklch(from var(--tk-color-theme) l c h / var(--tk-alpha-2));
    --tk-color-theme-3a: oklch(from var(--tk-color-theme) l c h / var(--tk-alpha-3));
    --tk-color-theme-4a: oklch(from var(--tk-color-theme) l c h / var(--tk-alpha-4));
    --tk-color-theme-5a: oklch(from var(--tk-color-theme) l c h / var(--tk-alpha-5));
    --tk-color-theme-6a: oklch(from var(--tk-color-theme) l c h / var(--tk-alpha-6));
    --tk-color-theme-7a: oklch(from var(--tk-color-theme) l c h / var(--tk-alpha-7));
    --tk-color-theme-8a: oklch(from var(--tk-color-theme) l c h / var(--tk-alpha-8));
    --tk-color-theme-9a: oklch(from var(--tk-color-theme) l c h / var(--tk-alpha-9));
    --tk-color-theme-10a: oklch(from var(--tk-color-theme) l c h / var(--tk-alpha-10));
    --tk-color-success: oklch(62% .2 145);
    --tk-color-success-5xlight: oklch(from var(--tk-color-success) var(--tk-l-tint-5x) var(--tk-c-tint-5x) var(--tk-h-tint-5x));
    --tk-color-success-4xlight: oklch(from var(--tk-color-success) var(--tk-l-tint-4x) var(--tk-c-tint-4x) var(--tk-h-tint-4x));
    --tk-color-success-3xlight: oklch(from var(--tk-color-success) var(--tk-l-tint-3x) var(--tk-c-tint-3x) var(--tk-h-tint-3x));
    --tk-color-success-2xlight: oklch(from var(--tk-color-success) var(--tk-l-tint-2x) var(--tk-c-tint-2x) var(--tk-h-tint-2x));
    --tk-color-success-1xlight: oklch(from var(--tk-color-success) var(--tk-l-tint-1x) var(--tk-c-tint-1x) var(--tk-h-tint-1x));
    --tk-color-success-1xdark: oklch(from var(--tk-color-success) var(--tk-l-shade-1x) var(--tk-c-shade-1x) var(--tk-h-shade-1x));
    --tk-color-success-2xdark: oklch(from var(--tk-color-success) var(--tk-l-shade-2x) var(--tk-c-shade-2x) var(--tk-h-shade-2x));
    --tk-color-success-3xdark: oklch(from var(--tk-color-success) var(--tk-l-shade-3x) var(--tk-c-shade-3x) var(--tk-h-shade-3x));
    --tk-color-success-4xdark: oklch(from var(--tk-color-success) var(--tk-l-shade-4x) var(--tk-c-shade-4x) var(--tk-h-shade-4x));
    --tk-color-success-5xdark: oklch(from var(--tk-color-success) var(--tk-l-shade-5x) var(--tk-c-shade-5x) var(--tk-h-shade-5x));
    --tk-color-success-1a: oklch(from var(--tk-color-success) l c h / var(--tk-alpha-1));
    --tk-color-success-2a: oklch(from var(--tk-color-success) l c h / var(--tk-alpha-2));
    --tk-color-success-3a: oklch(from var(--tk-color-success) l c h / var(--tk-alpha-3));
    --tk-color-success-4a: oklch(from var(--tk-color-success) l c h / var(--tk-alpha-4));
    --tk-color-success-5a: oklch(from var(--tk-color-success) l c h / var(--tk-alpha-5));
    --tk-color-success-6a: oklch(from var(--tk-color-success) l c h / var(--tk-alpha-6));
    --tk-color-success-7a: oklch(from var(--tk-color-success) l c h / var(--tk-alpha-7));
    --tk-color-success-8a: oklch(from var(--tk-color-success) l c h / var(--tk-alpha-8));
    --tk-color-success-9a: oklch(from var(--tk-color-success) l c h / var(--tk-alpha-9));
    --tk-color-success-10a: oklch(from var(--tk-color-success) l c h / var(--tk-alpha-10));
    --tk-color-warning: oklch(80% .16 70);
    --tk-color-warning-5xlight: oklch(from var(--tk-color-warning) var(--tk-l-tint-5x) var(--tk-c-tint-5x) var(--tk-h-tint-5x));
    --tk-color-warning-4xlight: oklch(from var(--tk-color-warning) var(--tk-l-tint-4x) var(--tk-c-tint-4x) var(--tk-h-tint-4x));
    --tk-color-warning-3xlight: oklch(from var(--tk-color-warning) var(--tk-l-tint-3x) var(--tk-c-tint-3x) var(--tk-h-tint-3x));
    --tk-color-warning-2xlight: oklch(from var(--tk-color-warning) var(--tk-l-tint-2x) var(--tk-c-tint-2x) var(--tk-h-tint-2x));
    --tk-color-warning-1xlight: oklch(from var(--tk-color-warning) var(--tk-l-tint-1x) var(--tk-c-tint-1x) var(--tk-h-tint-1x));
    --tk-color-warning-1xdark: oklch(from var(--tk-color-warning) var(--tk-l-shade-1x) var(--tk-c-shade-1x) var(--tk-h-shade-1x));
    --tk-color-warning-2xdark: oklch(from var(--tk-color-warning) var(--tk-l-shade-2x) var(--tk-c-shade-2x) var(--tk-h-shade-2x));
    --tk-color-warning-3xdark: oklch(from var(--tk-color-warning) var(--tk-l-shade-3x) var(--tk-c-shade-3x) var(--tk-h-shade-3x));
    --tk-color-warning-4xdark: oklch(from var(--tk-color-warning) var(--tk-l-shade-4x) var(--tk-c-shade-4x) var(--tk-h-shade-4x));
    --tk-color-warning-5xdark: oklch(from var(--tk-color-warning) var(--tk-l-shade-5x) var(--tk-c-shade-5x) var(--tk-h-shade-5x));
    --tk-color-warning-1a: oklch(from var(--tk-color-warning) l c h / var(--tk-alpha-1));
    --tk-color-warning-2a: oklch(from var(--tk-color-warning) l c h / var(--tk-alpha-2));
    --tk-color-warning-3a: oklch(from var(--tk-color-warning) l c h / var(--tk-alpha-3));
    --tk-color-warning-4a: oklch(from var(--tk-color-warning) l c h / var(--tk-alpha-4));
    --tk-color-warning-5a: oklch(from var(--tk-color-warning) l c h / var(--tk-alpha-5));
    --tk-color-warning-6a: oklch(from var(--tk-color-warning) l c h / var(--tk-alpha-6));
    --tk-color-warning-7a: oklch(from var(--tk-color-warning) l c h / var(--tk-alpha-7));
    --tk-color-warning-8a: oklch(from var(--tk-color-warning) l c h / var(--tk-alpha-8));
    --tk-color-warning-9a: oklch(from var(--tk-color-warning) l c h / var(--tk-alpha-9));
    --tk-color-warning-10a: oklch(from var(--tk-color-warning) l c h / var(--tk-alpha-10));
    --tk-color-error: oklch(58% .22 25);
    --tk-color-error-5xlight: oklch(from var(--tk-color-error) var(--tk-l-tint-5x) var(--tk-c-tint-5x) var(--tk-h-tint-5x));
    --tk-color-error-4xlight: oklch(from var(--tk-color-error) var(--tk-l-tint-4x) var(--tk-c-tint-4x) var(--tk-h-tint-4x));
    --tk-color-error-3xlight: oklch(from var(--tk-color-error) var(--tk-l-tint-3x) var(--tk-c-tint-3x) var(--tk-h-tint-3x));
    --tk-color-error-2xlight: oklch(from var(--tk-color-error) var(--tk-l-tint-2x) var(--tk-c-tint-2x) var(--tk-h-tint-2x));
    --tk-color-error-1xlight: oklch(from var(--tk-color-error) var(--tk-l-tint-1x) var(--tk-c-tint-1x) var(--tk-h-tint-1x));
    --tk-color-error-1xdark: oklch(from var(--tk-color-error) var(--tk-l-shade-1x) var(--tk-c-shade-1x) var(--tk-h-shade-1x));
    --tk-color-error-2xdark: oklch(from var(--tk-color-error) var(--tk-l-shade-2x) var(--tk-c-shade-2x) var(--tk-h-shade-2x));
    --tk-color-error-3xdark: oklch(from var(--tk-color-error) var(--tk-l-shade-3x) var(--tk-c-shade-3x) var(--tk-h-shade-3x));
    --tk-color-error-4xdark: oklch(from var(--tk-color-error) var(--tk-l-shade-4x) var(--tk-c-shade-4x) var(--tk-h-shade-4x));
    --tk-color-error-5xdark: oklch(from var(--tk-color-error) var(--tk-l-shade-5x) var(--tk-c-shade-5x) var(--tk-h-shade-5x));
    --tk-color-error-1a: oklch(from var(--tk-color-error) l c h / var(--tk-alpha-1));
    --tk-color-error-2a: oklch(from var(--tk-color-error) l c h / var(--tk-alpha-2));
    --tk-color-error-3a: oklch(from var(--tk-color-error) l c h / var(--tk-alpha-3));
    --tk-color-error-4a: oklch(from var(--tk-color-error) l c h / var(--tk-alpha-4));
    --tk-color-error-5a: oklch(from var(--tk-color-error) l c h / var(--tk-alpha-5));
    --tk-color-error-6a: oklch(from var(--tk-color-error) l c h / var(--tk-alpha-6));
    --tk-color-error-7a: oklch(from var(--tk-color-error) l c h / var(--tk-alpha-7));
    --tk-color-error-8a: oklch(from var(--tk-color-error) l c h / var(--tk-alpha-8));
    --tk-color-error-9a: oklch(from var(--tk-color-error) l c h / var(--tk-alpha-9));
    --tk-color-error-10a: oklch(from var(--tk-color-error) l c h / var(--tk-alpha-10));
    --tk-color-info: oklch(58% .18 245);
    --tk-color-info-5xlight: oklch(from var(--tk-color-info) var(--tk-l-tint-5x) var(--tk-c-tint-5x) var(--tk-h-tint-5x));
    --tk-color-info-4xlight: oklch(from var(--tk-color-info) var(--tk-l-tint-4x) var(--tk-c-tint-4x) var(--tk-h-tint-4x));
    --tk-color-info-3xlight: oklch(from var(--tk-color-info) var(--tk-l-tint-3x) var(--tk-c-tint-3x) var(--tk-h-tint-3x));
    --tk-color-info-2xlight: oklch(from var(--tk-color-info) var(--tk-l-tint-2x) var(--tk-c-tint-2x) var(--tk-h-tint-2x));
    --tk-color-info-1xlight: oklch(from var(--tk-color-info) var(--tk-l-tint-1x) var(--tk-c-tint-1x) var(--tk-h-tint-1x));
    --tk-color-info-1xdark: oklch(from var(--tk-color-info) var(--tk-l-shade-1x) var(--tk-c-shade-1x) var(--tk-h-shade-1x));
    --tk-color-info-2xdark: oklch(from var(--tk-color-info) var(--tk-l-shade-2x) var(--tk-c-shade-2x) var(--tk-h-shade-2x));
    --tk-color-info-3xdark: oklch(from var(--tk-color-info) var(--tk-l-shade-3x) var(--tk-c-shade-3x) var(--tk-h-shade-3x));
    --tk-color-info-4xdark: oklch(from var(--tk-color-info) var(--tk-l-shade-4x) var(--tk-c-shade-4x) var(--tk-h-shade-4x));
    --tk-color-info-5xdark: oklch(from var(--tk-color-info) var(--tk-l-shade-5x) var(--tk-c-shade-5x) var(--tk-h-shade-5x));
    --tk-color-info-1a: oklch(from var(--tk-color-info) l c h / var(--tk-alpha-1));
    --tk-color-info-2a: oklch(from var(--tk-color-info) l c h / var(--tk-alpha-2));
    --tk-color-info-3a: oklch(from var(--tk-color-info) l c h / var(--tk-alpha-3));
    --tk-color-info-4a: oklch(from var(--tk-color-info) l c h / var(--tk-alpha-4));
    --tk-color-info-5a: oklch(from var(--tk-color-info) l c h / var(--tk-alpha-5));
    --tk-color-info-6a: oklch(from var(--tk-color-info) l c h / var(--tk-alpha-6));
    --tk-color-info-7a: oklch(from var(--tk-color-info) l c h / var(--tk-alpha-7));
    --tk-color-info-8a: oklch(from var(--tk-color-info) l c h / var(--tk-alpha-8));
    --tk-color-info-9a: oklch(from var(--tk-color-info) l c h / var(--tk-alpha-9));
    --tk-color-info-10a: oklch(from var(--tk-color-info) l c h / var(--tk-alpha-10));
    --tk-color-shadow: oklch(20% .02 265);
    --tk-color-shadow-xs: 0 1px 2px 0 color-mix(in oklch, var(--tk-color-shadow) 5%, transparent);
    --tk-color-shadow-sm: 0 1px 3px 0 color-mix(in oklch, var(--tk-color-shadow) 10%, transparent), 0 1px 2px -1px color-mix(in oklch, var(--tk-color-shadow) 10%, transparent);
    --tk-color-shadow-md: 0 4px 6px -1px color-mix(in oklch, var(--tk-color-shadow) 10%, transparent), 0 2px 4px -2px color-mix(in oklch, var(--tk-color-shadow) 10%, transparent);
    --tk-color-shadow-lg: 0 10px 15px -3px color-mix(in oklch, var(--tk-color-shadow) 10%, transparent), 0 4px 6px -4px color-mix(in oklch, var(--tk-color-shadow) 10%, transparent);
    --tk-color-shadow-xl: 0 20px 25px -5px color-mix(in oklch, var(--tk-color-shadow) 10%, transparent), 0 8px 10px -6px color-mix(in oklch, var(--tk-color-shadow) 10%, transparent);
    --tk-color-shadow-2xl: 0 25px 50px -12px color-mix(in oklch, var(--tk-color-shadow) 25%, transparent);
    --tk-screen-sm: 480px;
    --tk-screen-md: 768px;
    --tk-screen-lg: 1024px;
    --tk-screen-xl: 1280px;
    --tk-screen-2xl: 1440px;
    --tk-value-auto: auto;
    --tk-value-none: none;
    --tk-value-normal: normal;
    --tk-value-inherit: inherit;
    --tk-value-initial: initial;
    --tk-value-unset: unset;
    --tk-value-currentcolor: currentColor;
    --tk-value-transparent: transparent;
    --tk-value-0: 0;
    --tk-value-fit-content: fit-content;
    --tk-value-min-content: min-content;
    --tk-value-max-content: max-content;
    --tk-cursor-auto: auto;
    --tk-cursor-default: default;
    --tk-cursor-pointer: pointer;
    --tk-cursor-wait: wait;
    --tk-cursor-text: text;
    --tk-cursor-move: move;
    --tk-cursor-not-allowed: not-allowed;
    --tk-cursor-grab: grab;
    --tk-cursor-grabbing: grabbing;
    --tk-cursor-help: help;
    --tk-size-unit: 4px;
    --tk-size-none: var(--tk-value-none);
    --tk-size-0: var(--tk-value-0);
    --tk-size-2xs: .5px;
    --tk-size-1: 1px;
    --tk-size-2: 2px;
    --tk-size-4: calc(var(--tk-size-unit) * 1);
    --tk-size-8: calc(var(--tk-size-unit) * 2);
    --tk-size-12: calc(var(--tk-size-unit) * 3);
    --tk-size-16: calc(var(--tk-size-unit) * 4);
    --tk-size-20: calc(var(--tk-size-unit) * 5);
    --tk-size-24: calc(var(--tk-size-unit) * 6);
    --tk-size-28: calc(var(--tk-size-unit) * 7);
    --tk-size-32: calc(var(--tk-size-unit) * 8);
    --tk-size-36: calc(var(--tk-size-unit) * 9);
    --tk-size-40: calc(var(--tk-size-unit) * 10);
    --tk-size-44: calc(var(--tk-size-unit) * 11);
    --tk-size-48: calc(var(--tk-size-unit) * 12);
    --tk-size-52: calc(var(--tk-size-unit) * 13);
    --tk-size-56: calc(var(--tk-size-unit) * 14);
    --tk-size-60: calc(var(--tk-size-unit) * 15);
    --tk-size-64: calc(var(--tk-size-unit) * 16);
    --tk-size-68: calc(var(--tk-size-unit) * 17);
    --tk-size-72: calc(var(--tk-size-unit) * 18);
    --tk-size-76: calc(var(--tk-size-unit) * 19);
    --tk-size-80: calc(var(--tk-size-unit) * 20);
    --tk-size-84: calc(var(--tk-size-unit) * 21);
    --tk-size-88: calc(var(--tk-size-unit) * 22);
    --tk-size-92: calc(var(--tk-size-unit) * 23);
    --tk-size-96: calc(var(--tk-size-unit) * 24);
    --tk-size-100: calc(var(--tk-size-unit) * 25);
    --tk-fit-content: fit-content;
    --tk-min-content: min-content;
    --tk-max-content: max-content;
    --tk-size-5p: 5%;
    --tk-size-10p: 10%;
    --tk-size-15p: 15%;
    --tk-size-20p: 20%;
    --tk-size-25p: 25%;
    --tk-size-30p: 30%;
    --tk-size-35p: 35%;
    --tk-size-40p: 40%;
    --tk-size-45p: 45%;
    --tk-size-50p: 50%;
    --tk-size-55p: 55%;
    --tk-size-60p: 60%;
    --tk-size-65p: 65%;
    --tk-size-70p: 70%;
    --tk-size-75p: 75%;
    --tk-size-80p: 80%;
    --tk-size-85p: 85%;
    --tk-size-90p: 90%;
    --tk-size-95p: 95%;
    --tk-size-100p: 100%;
    --tk-size-5vw: 5vw;
    --tk-size-10vw: 10vw;
    --tk-size-15vw: 15vw;
    --tk-size-20vw: 20vw;
    --tk-size-25vw: 25vw;
    --tk-size-30vw: 30vw;
    --tk-size-33vw: 33vw;
    --tk-size-35vw: 35vw;
    --tk-size-40vw: 40vw;
    --tk-size-45vw: 45vw;
    --tk-size-50vw: 50vw;
    --tk-size-60vw: 60vw;
    --tk-size-66vw: 66vw;
    --tk-size-70vw: 70vw;
    --tk-size-75vw: 75vw;
    --tk-size-80vw: 80vw;
    --tk-size-85vw: 85vw;
    --tk-size-90vw: 90vw;
    --tk-size-95vw: 95vw;
    --tk-size-100vw: 100vw;
    --tk-size-5vh: 5vh;
    --tk-size-10vh: 10vh;
    --tk-size-15vh: 15vh;
    --tk-size-20vh: 20vh;
    --tk-size-25vh: 25vh;
    --tk-size-30vh: 30vh;
    --tk-size-33vh: 33vh;
    --tk-size-35vh: 35vh;
    --tk-size-40vh: 40vh;
    --tk-size-45vh: 45vh;
    --tk-size-50vh: 50vh;
    --tk-size-60vh: 60vh;
    --tk-size-66vh: 66vh;
    --tk-size-70vh: 70vh;
    --tk-size-75vh: 75vh;
    --tk-size-80vh: 80vh;
    --tk-size-85vh: 85vh;
    --tk-size-90vh: 90vh;
    --tk-size-95vh: 95vh;
    --tk-size-100vh: 100vh;
    --tk-align-baseline: baseline;
    --tk-align-top: top;
    --tk-align-middle: middle;
    --tk-align-bottom: bottom;
    --tk-align-text-top: text-top;
    --tk-align-text-bottom: text-bottom;
    --tk-vertical-align-sub: sub;
    --tk-vertical-align-super: super;
    --tk-table-auto: auto;
    --tk-table-fixed: fixed;
    --tk-table-collapse: collapse;
    --tk-table-separate: separate;
    --tk-table-full: 1;
    --tk-fill-current: currentColor;
    --tk-stroke-current: currentColor;
    --tk-stroke-0: 0px;
    --tk-stroke-2x: 1px;
    --tk-stroke-xs: 2px;
    --tk-stroke-sm: 4px;
    --tk-stroke-md: 8px;
    --tk-stroke-lg: 12px;
    --tk-stroke-xl: 16px;
    --tk-stroke-2xl: 20px;
    --tk-stroke-3xl: 24px;
    --tk-appearance-none: none;
    --tk-appearance-auto: auto;
    --tk-pointer-events-none: none;
    --tk-pointer-events-auto: auto;
    --tk-will-change-auto: auto;
    --tk-will-change-transform: transform;
    --tk-will-change-opacity: opacity;
    --tk-will-change-scroll: scroll-position;
    --tk-position-static: static;
    --tk-position-relative: relative;
    --tk-position-absolute: absolute;
    --tk-position-fixed: fixed;
    --tk-position-sticky: sticky;
    --tk-display-block: block;
    --tk-display-inline: inline;
    --tk-display-inline-block: inline-block;
    --tk-display-flex: flex;
    --tk-display-inline-flex: inline-flex;
    --tk-display-grid: grid;
    --tk-display-none: none;
    --tk-display-table: table;
    --tk-display-table-row: table-row;
    --tk-display-table-cell: table-cell;
    --tk-display-table-column: table-column;
    --tk-display-table-column-group: table-column-group;
    --tk-display-table-header-group: table-header-group;
    --tk-display-table-footer-group: table-footer-group;
    --tk-display-table-row-group: table-row-group;
    --tk-display-flow-root: flow-root;
    --tk-display-contents: contents;
    --tk-display-list-item: list-item;
    --tk-display-ruby: ruby;
    --tk-display-ruby-base: ruby-base;
    --tk-display-ruby-text: ruby-text;
    --tk-display-ruby-base-container: ruby-base-container;
    --tk-box-sizing-border: border-box;
    --tk-box-sizing-content: content-box;
    --tk-box-decoration-slice: slice;
    --tk-box-decoration-clone: clone;
    --tk-overflow-auto: auto;
    --tk-overflow-hidden: hidden;
    --tk-overflow-visible: visible;
    --tk-overflow-scroll: scroll;
    --tk-overscroll-auto: auto;
    --tk-overscroll-contain: contain;
    --tk-overscroll-none: none;
    --tk-aspect-ratio-square: 1 / 1;
    --tk-aspect-ratio-video: 16 / 9;
    --tk-aspect-ratio-portrait: 3 / 4;
    --tk-aspect-ratio-landscape: 4 / 3;
    --tk-aspect-ratio-widescreen: 21 / 9;
    --tk-aspect-ratio-golden: 1.618 / 1;
    --tk-float-left: left;
    --tk-float-right: right;
    --tk-float-none: none;
    --tk-clear-left: left;
    --tk-clear-right: right;
    --tk-clear-both: both;
    --tk-object-fit-contain: contain;
    --tk-object-fit-cover: cover;
    --tk-object-fit-fill: fill;
    --tk-object-fit-scale-down: scale-down;
    --tk-object-position-center: center;
    --tk-visibility-visible: visible;
    --tk-visibility-hidden: hidden;
    --tk-visibility-collapse: collapse;
    --tk-isolation-isolate: isolate;
    --tk-isolation-auto: auto;
    --tk-inset-0: 0;
    --tk-inset-auto: auto;
    --tk-flex-direction-row: row;
    --tk-flex-direction-row-reverse: row-reverse;
    --tk-flex-direction-column: column;
    --tk-flex-direction-column-reverse: column-reverse;
    --tk-flex-wrap: wrap;
    --tk-flex-nowrap: nowrap;
    --tk-flex-wrap-reverse: wrap-reverse;
    --tk-justify-start: flex-start;
    --tk-justify-end: flex-end;
    --tk-justify-center: center;
    --tk-justify-between: space-between;
    --tk-justify-around: space-around;
    --tk-justify-evenly: space-evenly;
    --tk-align-start: flex-start;
    --tk-align-end: flex-end;
    --tk-align-center: center;
    --tk-align-stretch: stretch;
    --tk-layout-main-width: var(--tk-content-width, 80ch);
    --tk-layout-fill-width: var(--tk-content-fill-width, 90ch);
    --tk-layout-gutter-width: var(--tk-page-gutter, var(--tk-size-20));
    --tk-layout-breakout-size: calc((var(--tk-layout-fill-width) - var(--tk-layout-main-width)) / 2);
    --tk-layout-grid: [full-start] 1fr
                 [gutter-start] var(--tk-layout-gutter-width) [gutter-end fill-start]
                 minmax(0, var(--tk-layout-breakout-size)) [main-start]
                 min(100% - (var(--tk-layout-gutter-width) * 2), var(--tk-layout-main-width)) [main-end]
                 minmax(0, var(--tk-layout-breakout-size)) [fill-end gutter-start]
                 var(--tk-layout-gutter-width) [gutter-end]
                 1fr [full-end];
    --tk-place-items-start: start;
    --tk-place-items-end: end;
    --tk-place-items-center: center;
    --tk-place-items-stretch: stretch;
    --tk-place-content-start: start;
    --tk-place-content-end: end;
    --tk-place-content-center: center;
    --tk-place-content-stretch: stretch;
    --tk-place-content-around: space-around;
    --tk-place-content-between: space-between;
    --tk-place-content-evenly: space-evenly;
    --tk-align-self-start: start;
    --tk-align-self-end: end;
    --tk-align-self-center: center;
    --tk-align-self-stretch: stretch;
    --tk-justify-self-start: start;
    --tk-justify-self-end: end;
    --tk-justify-self-center: center;
    --tk-justify-self-stretch: stretch;
    --tk-grid-auto-fit: auto-fit;
    --tk-grid-auto-fill: auto-fill;
    --tk-radius-0: var(--tk-size-0);
    --tk-radius-2xs: 1px;
    --tk-radius-xs: 2px;
    --tk-radius-sm: 4px;
    --tk-radius-md: 8px;
    --tk-radius-lg: 12px;
    --tk-radius-xl: 16px;
    --tk-radius-2xl: 20px;
    --tk-radius-3xl: 24px;
    --tk-radius-full: 9999px;
    --tk-border-0: 0px;
    --tk-border-2xs: 1px;
    --tk-border-xs: 2px;
    --tk-border-sm: 4px;
    --tk-border-md: 8px;
    --tk-border-lg: 12px;
    --tk-border-xl: 16px;
    --tk-border-2xl: 20px;
    --tk-border-3xl: 24px;
    --tk-border-none: none;
    --tk-border-solid: solid;
    --tk-border-dashed: dashed;
    --tk-border-dotted: dotted;
    --tk-border-double: double;
    --tk-border-groove: groove;
    --tk-border-ridge: ridge;
    --tk-border-inset: inset;
    --tk-border-outset: outset;
    --tk-outline-none: none;
    --tk-outline-solid: solid;
    --tk-outline-dashed: dashed;
    --tk-outline-dotted: dotted;
    --tk-outline-double: double;
    --tk-outline-0: 0px;
    --tk-outline-2xs: 1px;
    --tk-outline-xs: 2px;
    --tk-outline-sm: 4px;
    --tk-outline-md: 8px;
    --tk-outline-lg: 12px;
    --tk-outline-xl: 16px;
    --tk-outline-2xl: 20px;
    --tk-outline-3xl: 24px;
    --tk-filter-blur-0: blur(0px);
    --tk-filter-blur-1x: blur(1px);
    --tk-filter-blur-2x: blur(2px);
    --tk-filter-blur-3x: blur(4px);
    --tk-filter-blur-4x: blur(8px);
    --tk-filter-blur-5x: blur(12px);
    --tk-filter-blur-6x: blur(16px);
    --tk-filter-blur-7x: blur(20px);
    --tk-filter-blur-8x: blur(24px);
    --tk-filter-blur-9x: blur(24px);
    --tk-filter-blur-full: blur(100px);
    --tk-filter-brightness-0: brightness(1);
    --tk-filter-brightness-1x: brightness(1.1);
    --tk-filter-brightness-2x: brightness(1.2);
    --tk-filter-brightness-3x: brightness(1.35);
    --tk-filter-brightness-4x: brightness(1.5);
    --tk-filter-brightness-5x: brightness(1.7);
    --tk-filter-brightness-6x: brightness(2);
    --tk-filter-brightness-7x: brightness(2.5);
    --tk-filter-brightness-8x: brightness(3);
    --tk-filter-brightness-9x: brightness(4);
    --tk-filter-brightness-full: brightness(5);
    --tk-filter-contrast-0: contrast(1);
    --tk-filter-contrast-1x: contrast(1.05);
    --tk-filter-contrast-2x: contrast(1.1);
    --tk-filter-contrast-3x: contrast(1.2);
    --tk-filter-contrast-4x: contrast(1.35);
    --tk-filter-contrast-5x: contrast(1.5);
    --tk-filter-contrast-6x: contrast(1.75);
    --tk-filter-contrast-7x: contrast(2);
    --tk-filter-contrast-8x: contrast(2.5);
    --tk-filter-contrast-9x: contrast(3);
    --tk-filter-contrast-full: contrast(4);
    --tk-filter-grayscale-0: grayscale(0%);
    --tk-filter-grayscale-1x: grayscale(10%);
    --tk-filter-grayscale-2x: grayscale(20%);
    --tk-filter-grayscale-3x: grayscale(30%);
    --tk-filter-grayscale-4x: grayscale(40%);
    --tk-filter-grayscale-5x: grayscale(50%);
    --tk-filter-grayscale-6x: grayscale(60%);
    --tk-filter-grayscale-7x: grayscale(70%);
    --tk-filter-grayscale-8x: grayscale(80%);
    --tk-filter-grayscale-9x: grayscale(90%);
    --tk-filter-grayscale-full: grayscale(100%);
    --tk-filter-hue-rotate-0: hue-rotate(0deg);
    --tk-filter-hue-rotate-1x: hue-rotate(15deg);
    --tk-filter-hue-rotate-2x: hue-rotate(30deg);
    --tk-filter-hue-rotate-3x: hue-rotate(45deg);
    --tk-filter-hue-rotate-4x: hue-rotate(60deg);
    --tk-filter-hue-rotate-5x: hue-rotate(90deg);
    --tk-filter-hue-rotate-6x: hue-rotate(120deg);
    --tk-filter-hue-rotate-7x: hue-rotate(180deg);
    --tk-filter-hue-rotate-8x: hue-rotate(240deg);
    --tk-filter-hue-rotate-9x: hue-rotate(300deg);
    --tk-filter-hue-rotate-full: hue-rotate(360deg);
    --tk-filter-invert-0: invert(0%);
    --tk-filter-invert-1x: invert(10%);
    --tk-filter-invert-2x: invert(20%);
    --tk-filter-invert-3x: invert(30%);
    --tk-filter-invert-4x: invert(40%);
    --tk-filter-invert-5x: invert(50%);
    --tk-filter-invert-6x: invert(60%);
    --tk-filter-invert-7x: invert(70%);
    --tk-filter-invert-8x: invert(80%);
    --tk-filter-invert-9x: invert(90%);
    --tk-filter-invert-full: invert(100%);
    --tk-filter-saturate-0: saturate(0);
    --tk-filter-saturate-1x: saturate(.25);
    --tk-filter-saturate-2x: saturate(.5);
    --tk-filter-saturate-3x: saturate(.75);
    --tk-filter-saturate-4x: saturate(1);
    --tk-filter-saturate-5x: saturate(1.5);
    --tk-filter-saturate-6x: saturate(2);
    --tk-filter-saturate-7x: saturate(3);
    --tk-filter-saturate-8x: saturate(4);
    --tk-filter-saturate-9x: saturate(6);
    --tk-filter-saturate-full: saturate(8);
    --tk-filter-sepia-0: sepia(0%);
    --tk-filter-sepia-1x: sepia(10%);
    --tk-filter-sepia-2x: sepia(20%);
    --tk-filter-sepia-3x: sepia(30%);
    --tk-filter-sepia-4x: sepia(40%);
    --tk-filter-sepia-5x: sepia(50%);
    --tk-filter-sepia-6x: sepia(60%);
    --tk-filter-sepia-7x: sepia(70%);
    --tk-filter-sepia-8x: sepia(80%);
    --tk-filter-sepia-9x: sepia(90%);
    --tk-filter-sepia-full: sepia(100%);
    --tk-opacity-1x: .1;
    --tk-opacity-2x: .2;
    --tk-opacity-3x: .3;
    --tk-opacity-4x: .4;
    --tk-opacity-5x: .5;
    --tk-opacity-6x: .6;
    --tk-opacity-7x: .7;
    --tk-opacity-8x: .8;
    --tk-opacity-9x: .9;
    --tk-opacity-full: 1;
    --fluid-min-vw: var(--tk-fluid-scale-start, 480);
    --fluid-max-vw: var(--tk-fluid-scale-end, 1440);
    --fluid-screen-range: calc(var(--fluid-max-vw) - var(--fluid-min-vw));
    --fluid-rem-factor: calc((100vw - var(--fluid-min-vw) * 1px) / var(--fluid-screen-range));
    --tk-text-xs: clamp(.75rem, calc(.75rem + (14 - 12) * var(--fluid-rem-factor)), .875rem);
    --tk-text-sm: clamp(.875rem, calc(.875rem + (16 - 14) * var(--fluid-rem-factor)), 1rem);
    --tk-text-md: clamp(1rem, calc(1rem + (18 - 16) * var(--fluid-rem-factor)), 1.125rem);
    --tk-text-lg: clamp(1.125rem, calc(1.125rem + (20 - 18) * var(--fluid-rem-factor)), 1.25rem);
    --tk-text-xl: clamp(1.25rem, calc(1.25rem + (24 - 20) * var(--fluid-rem-factor)), 1.5rem);
    --tk-text-2xl: clamp(1.5rem, calc(1.5rem + (32 - 24) * var(--fluid-rem-factor)), 2rem);
    --tk-text-3xl: clamp(1.875rem, calc(1.875rem + (40 - 30) * var(--fluid-rem-factor)), 2.5rem);
    --tk-text-4xl: clamp(2.25rem, calc(2.25rem + (48 - 36) * var(--fluid-rem-factor)), 3rem);
    --tk-text-5xl: clamp(3rem, calc(3rem + (64 - 48) * var(--fluid-rem-factor)), 4rem);
    --tk-text-6xl: clamp(3.75rem, calc(3.75rem + (80 - 60) * var(--fluid-rem-factor)), 5rem);
    --tk-text-7xl: clamp(4.5rem, calc(4.5rem + (96 - 72) * var(--fluid-rem-factor)), 6rem);
    --tk-text-8xl: clamp(6rem, calc(6rem + (128 - 96) * var(--fluid-rem-factor)), 8rem);
    --tk-text-9xl: clamp(8rem, calc(8rem + (160 - 128) * var(--fluid-rem-factor)), 10rem);
    --tk-font-weight-100: 100;
    --tk-font-weight-200: 200;
    --tk-font-weight-300: 300;
    --tk-font-weight-400: 400;
    --tk-font-weight-500: 500;
    --tk-font-weight-600: 600;
    --tk-font-weight-700: 700;
    --tk-font-weight-800: 800;
    --tk-font-weight-900: 900;
    --tk-font-stretch-ultra-condensed: ultra-condensed;
    --tk-font-stretch-extra-condensed: extra-condensed;
    --tk-font-stretch-condensed: condensed;
    --tk-font-stretch-semi-condensed: semi-condensed;
    --tk-font-stretch-normal: var(--tk-value-normal);
    --tk-font-stretch-semi-expanded: semi-expanded;
    --tk-font-stretch-expanded: expanded;
    --tk-font-stretch-extra-expanded: extra-expanded;
    --tk-font-stretch-ultra-expanded: ultra-expanded;
    --tk-font-style-normal: var(--tk-value-normal);
    --tk-font-style-italic: italic;
    --tk-font-variant-numeric-normal: var(--tk-value-normal);
    --tk-font-variant-numeric-ordinal: ordinal;
    --tk-font-variant-numeric-slashed-zero: slashed-zero;
    --tk-font-variant-numeric-lining-nums: lining-nums;
    --tk-font-variant-numeric-oldstyle-nums: oldstyle-nums;
    --tk-font-variant-numeric-proportional-nums: proportional-nums;
    --tk-font-variant-numeric-tabular-nums: tabular-nums;
    --tk-font-variant-numeric-diagonal-fractions: diagonal-fractions;
    --tk-font-variant-numeric-stacked-fractions: stacked-fractions;
    --tk-font-variant-ligatures-common: common-ligatures;
    --tk-font-variant-ligatures-no-common: no-common-ligatures;
    --tk-font-variant-ligatures-discretionary: discretionary-ligatures;
    --tk-font-variant-ligatures-no-discretionary: no-discretionary-ligatures;
    --tk-font-variant-ligatures-historical: historical-ligatures;
    --tk-font-variant-ligatures-no-historical: no-historical-ligatures;
    --tk-font-variant-ligatures-contextual: contextual;
    --tk-font-variant-ligatures-no-contextual: no-contextual;
    --tk-font-variant-caps-normal: var(--tk-value-normal);
    --tk-font-variant-caps-small-caps: small-caps;
    --tk-font-variant-caps-all-small-caps: all-small-caps;
    --tk-font-variant-caps-petite-caps: petite-caps;
    --tk-font-variant-caps-all-petite-caps: all-petite-caps;
    --tk-font-variant-caps-unicase: unicase;
    --tk-font-variant-caps-titling-caps: titling-caps;
    --tk-line-height-2xs: .55;
    --tk-line-height-xs: 1;
    --tk-line-height-sm: 1.25;
    --tk-line-height-md: 1.5;
    --tk-line-height-lg: 1.625;
    --tk-line-height-xl: 2;
    --tk-line-height-2xl: .75rem;
    --tk-line-height-3xl: 1rem;
    --tk-letter-spacing-2xs: -.05em;
    --tk-letter-spacing-xs: -.1em;
    --tk-letter-spacing-sm: -.025em;
    --tk-letter-spacing-md: 0em;
    --tk-letter-spacing-lg: .025em;
    --tk-letter-spacing-xl: .05em;
    --tk-letter-spacing-2xl: .1em;
    --tk-letter-spacing-3xl: .2em;
    --tk-text-underline-offset-auto: var(--tk-value-auto);
    --tk-text-underline-offset-0: var(--tk-value-0);
    --tk-text-underline-offset-2xs: .5px;
    --tk-text-underline-offset-xs: 1px;
    --tk-text-underline-offset-sm: 2px;
    --tk-text-underline-offset-md: .15em;
    --tk-text-underline-offset-lg: 8px;
    --tk-text-underline-offset-xl: 10px;
    --tk-text-underline-offset-2xl: 12px;
    --tk-text-underline-offset-3xl: 14px;
    --tk-text-underline-auto: var(--tk-value-auto);
    --tk-text-underline-from-font: from-font;
    --tk-text-underline-0: 0px;
    --tk-text-underline-2xs: 1px;
    --tk-text-underline-xs: 2px;
    --tk-text-underline-sm: 4px;
    --tk-text-underline-md: 6px;
    --tk-text-underline-lg: 8px;
    --tk-text-underline-xl: 10px;
    --tk-text-underline-2xl: 12px;
    --tk-text-underline-3xl: 14px;
    --tk-text-underline-style-none: none;
    --tk-text-underline-style-solid: solid;
    --tk-text-underline-style-double: double;
    --tk-text-underline-style-dotted: dotted;
    --tk-text-underline-style-dashed: dashed;
    --tk-text-underline-style-wavy: wavy;
    --tk-text-underline-position-auto: var(--tk-value-auto);
    --tk-text-underline-position-under: under;
    --tk-text-underline-position-left: left;
    --tk-text-underline-position-right: right;
    --tk-text-transform-uppercase: uppercase;
    --tk-text-transform-lowercase: lowercase;
    --tk-text-transform-capitalize: capitalize;
    --tk-text-transform-none: var(--tk-value-none);
    --tk-text-left: left;
    --tk-text-center: center;
    --tk-text-right: right;
    --tk-text-justify: justify;
    --tk-text-start: start;
    --tk-text-end: end;
    --tk-text-overflow-ellipsis: ellipsis;
    --tk-text-overflow-clip: clip;
    --tk-whitespace-normal: var(--tk-value-normal);
    --tk-whitespace-nowrap: nowrap;
    --tk-whitespace-pre: pre;
    --tk-whitespace-pre-line: pre-line;
    --tk-whitespace-pre-wrap: pre-wrap;
    --tk-whitespace-break-spaces: break-spaces;
    --tk-indent-0: var(--tk-value-0);
    --tk-indent-2xs: .0325rem;
    --tk-indent-xs: .0625rem;
    --tk-indent-sm: .25rem;
    --tk-indent-md: .5rem;
    --tk-indent-lg: 1rem;
    --tk-indent-xl: 2rem;
    --tk-indent-2xl: 2.5rem;
    --tk-indent-3xl: 3rem;
    --tk-text-shadow-none: var(--tk-value-none);
    --tk-text-shadow-2xs: .5px .5px 1px #00000014;
    --tk-text-shadow-xs: 1px 1px 2px #0000001a;
    --tk-text-shadow-sm: 2px 2px 4px #0000001a;
    --tk-text-shadow-md: 4px 4px 6px #0000001a;
    --tk-text-shadow-lg: 6px 6px 8px #00000026;
    --tk-text-shadow-xl: 8px 8px 10px #00000026;
    --tk-text-shadow-2xl: 10px 10px 12px #00000026;
    --tk-text-shadow-3xl: 12px 12px 14px #00000026;
    --tk-text-stroke-2xs: 1px;
    --tk-text-stroke-xs: 2px;
    --tk-text-stroke-sm: 4px;
    --tk-text-stroke-md: 8px;
    --tk-text-stroke-lg: 12px;
    --tk-text-stroke-xl: 16px;
    --tk-text-stroke-2xl: 20px;
    --tk-text-stroke-3xl: 24px;
    --tk-list-style-type-none: var(--tk-value-none);
    --tk-list-style-type-disc: disc;
    --tk-list-style-type-decimal: decimal;
    --tk-list-style-type-square: square;
    --tk-list-style-type-upper-roman: upper-roman;
    --tk-list-style-type-lower-roman: lower-roman;
    --tk-list-style-type-upper-alpha: upper-alpha;
    --tk-list-style-type-lower-alpha: lower-alpha;
    --tk-list-style-position-inside: inside;
    --tk-list-style-position-outside: outside;
    --tk-text-direction-ltr: ltr;
    --tk-text-direction-rtl: rtl;
    --tk-writing-mode-horizontal-tb: horizontal-tb;
    --tk-writing-mode-vertical-rl: vertical-rl;
    --tk-writing-mode-vertical-lr: vertical-lr;
    --tk-writing-mode-sideways-rl: sideways-rl;
    --tk-writing-mode-sideways-lr: sideways-lr;
    --tk-text-orientation-mixed: mixed;
    --tk-text-orientation-upright: upright;
    --tk-text-orientation-sideways: sideways;
    --tk-hyphens-none: var(--tk-value-none);
    --tk-hyphens-manual: manual;
    --tk-hyphens-auto: var(--tk-value-auto);
    --tk-text-align-last-auto: var(--tk-value-auto);
    --tk-text-align-last-start: start;
    --tk-text-align-last-end: end;
    --tk-text-align-last-left: left;
    --tk-text-align-last-right: right;
    --tk-text-align-last-center: center;
    --tk-text-align-last-justify: justify;
    --tk-text-justify-auto: var(--tk-value-auto);
    --tk-text-justify-inter-word: inter-word;
    --tk-text-justify-inter-character: inter-character;
    --tk-text-justify-none: var(--tk-value-none);
    --tk-user-select-none: var(--tk-value-none);
    --tk-user-select-text: text;
    --tk-user-select-all: all;
    --tk-user-select-auto: var(--tk-value-auto);
    --tk-word-break-normal: var(--tk-value-normal);
    --tk-word-break-break-all: break-all;
    --tk-word-break-keep-all: keep-all;
    --tk-overflow-wrap-normal: var(--tk-value-normal);
    --tk-overflow-wrap-break-word: break-word;
    --tk-text-wrap-balance: balance;
    --tk-text-wrap-pretty: pretty;
    --tk-text-wrap-stable: stable;
    --tk-bg-none: none;
    --tk-bg-repeat: repeat;
    --tk-bg-no-repeat: no-repeat;
    --tk-bg-repeat-x: repeat-x;
    --tk-bg-repeat-y: repeat-y;
    --tk-bg-fixed: fixed;
    --tk-bg-local: local;
    --tk-bg-scroll: scroll;
    --tk-bg-clip-border: border-box;
    --tk-bg-clip-padding: padding-box;
    --tk-bg-clip-content: content-box;
    --tk-bg-position-center: center;
    --tk-bg-position-top: top;
    --tk-bg-position-bottom: bottom;
    --tk-bg-position-left: left;
    --tk-bg-position-right: right;
    --tk-bg-size-cover: cover;
    --tk-bg-size-contain: contain;
    --tk-bg-origin-border: border-box;
    --tk-bg-origin-padding: padding-box;
    --tk-bg-origin-content: content-box;
    --tk-anim-default-easing: cubic-bezier(.25,
        .46,
        .45,
        .94);
    --tk-duration-2x: .1s;
    --tk-duration-xs: .2s;
    --tk-duration-sm: .5s;
    --tk-duration-md: .8s;
    --tk-duration-lg: 1.2s;
    --tk-duration-xl: 2s;
    --tk-duration-2xl: 4s;
    --tk-duration-3xl: 8s;
    --tk-delay-2x: 50ms;
    --tk-delay-xs: .1s;
    --tk-delay-sm: .2s;
    --tk-delay-md: .4s;
    --tk-delay-lg: .6s;
    --tk-delay-xl: .8s;
    --tk-delay-2xl: 1.2s;
    --tk-delay-3xl: 2s;
    --tk-anim-default-duration: var(--tk-duration-md);
    --tk-anim-default-timing: ease-out;
    --tk-anim-default-fill-mode: both;
    --tk-anim-default-iteration-count: 1;
    --tk-anim-default-direction: normal;
    --tk-anim-default-play-state: running;
    --tk-animation-none: none;
    --tk-animation-spin: spin 1s linear infinite;
    --tk-animation-ping: ping 1s cubic-bezier(0, 0, .2, 1) infinite;
    --tk-animation-pulse: pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;
    --tk-animation-bounce: bounce 1s infinite;
    --tk-animation-fade: fade 1s ease-in-out infinite;
    --tk-animation-slide: slide 1s ease-in-out infinite;
    --tk-animation-fade-slide: fade-slide 1s ease-in-out infinite;
    --tk-animation-fade-bounce: fade-bounce 1s ease-in-out infinite;
    --tk-ease: cubic-bezier(.25, .1, .25, 1);
    --tk-ease-in: cubic-bezier(.42, 0, 1, 1);
    --tk-ease-out: cubic-bezier(0, 0, .58, 1);
    --tk-ease-in-out: cubic-bezier(.42, 0, .58, 1);
    --tk-ease-elastic: cubic-bezier(.68,
        -.55,
        .265,
        1.55);
    --tk-ease-bounce: cubic-bezier(.175,
        .885,
        .32,
        1.275);
    --tk-ease-back: cubic-bezier(.6,
        -.28,
        .735,
        .045);
    --tk-ease-spring: cubic-bezier(.5, .1, .1, 1);
    --tk-ease-gravity: cubic-bezier(.42,
        0,
        1,
        1);
    --tk-ease-snappy: cubic-bezier(.1,
        .9,
        .2,
        1);
    --tk-transition-2x: .15s;
    --tk-transition-xs: .2s;
    --tk-transition-sm: .25s;
    --tk-transition-md: .3s;
    --tk-transition-lg: .35s;
    --tk-transition-xl: .4s;
    --tk-transition-2xl: .45s;
    --tk-transition-3xl: .5s;
    --tk-transition-all: all .4s var(--tk-ease);
    --tk-transition-all-2x: all .15s var(--tk-ease);
    --tk-transition-all-xs: all .2s var(--tk-ease);
    --tk-transition-all-sm: all .25s var(--tk-ease);
    --tk-transition-all-md: all .3s var(--tk-ease);
    --tk-transition-all-lg: all .35s var(--tk-ease);
    --tk-transition-all-xl: all .4s var(--tk-ease);
    --tk-transition-all-2xl: all .45s var(--tk-ease);
    --tk-transition-all-3xl: all .5s var(--tk-ease);
    --tk-transition-color: color .4s var(--tk-ease);
    --tk-transition-background: background .4s var(--tk-ease);
    --tk-transition-border: border .4s var(--tk-ease);
    --tk-transition-opacity: opacity .4s var(--tk-ease);
    --tk-transition-transform: transform .4s var(--tk-ease);
    --tk-transition-box-shadow: box-shadow .4s var(--tk-ease);
    color-scheme: light dark;
    --tk-bg-5x: light-dark(var(--tk-color-theme-5xlight), var(--tk-color-theme-5xdark));
    --tk-bg-4x: light-dark(var(--tk-color-theme-4xlight), var(--tk-color-theme-4xdark));
    --tk-bg-3x: light-dark(var(--tk-color-theme-3xlight), var(--tk-color-theme-3xdark));
    --tk-bg-2x: light-dark(var(--tk-color-theme-2xlight), var(--tk-color-theme-2xdark));
    --tk-bg-1x: light-dark(var(--tk-color-theme-1xlight), var(--tk-color-theme-1xdark));
    --tk-bg-success: light-dark(var(--tk-color-success-4xlight), var(--tk-color-success-4xdark));
    --tk-bg-warning: light-dark(var(--tk-color-warning-4xlight), var(--tk-color-warning-4xdark));
    --tk-bg-error: light-dark(var(--tk-color-error-4xlight), var(--tk-color-error-4xdark));
    --tk-bg-info: light-dark(var(--tk-color-info-4xlight), var(--tk-color-info-4xdark));
    --tk-fg-5x: light-dark(var(--tk-color-theme-5xdark), var(--tk-color-theme-5xlight));
    --tk-fg-4x: light-dark(var(--tk-color-theme-4xdark), var(--tk-color-theme-4xlight));
    --tk-fg-3x: light-dark(var(--tk-color-theme-3xdark), var(--tk-color-theme-3xlight));
    --tk-fg-2x: light-dark(var(--tk-color-theme-2xdark), var(--tk-color-theme-2xlight));
    --tk-fg-1x: light-dark(var(--tk-color-theme-1xdark), var(--tk-color-theme-1xlight));
    --tk-fg-success: light-dark(var(--tk-color-success-2xdark), var(--tk-color-success-2xlight));
    --tk-fg-info: light-dark(var(--tk-color-info-2xdark), var(--tk-color-info-2xlight));
    --tk-fg-warning: light-dark(var(--tk-color-warning-3xdark), var(--tk-color-warning-2xlight));
    --tk-fg-error: light-dark(var(--tk-color-error-2xdark), var(--tk-color-error-2xlight));
    --tk-focus-ring: var(--tk-color-primary);
    --tk-focus-ring-alt: var(--tk-bg-surface);
  }

  [data-theme="light"] {
    color-scheme: light;
  }

  [data-theme="dark"] {
    color-scheme: dark;
  }
}

@layer reset {
  *, :before, :after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
  }

  :root {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizelegibility;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    tab-size: 4;
  }

  html {
    scroll-behavior: smooth;
    hanging-punctuation: first last;
  }

  body {
    background-color: var(--tk-bg-5x);
    max-width: var(--tk-screen-2xl);
    margin-inline: var(--tk-value-auto);
    min-height: 100dvh;
    color: var(--tk-fg-4x);
    font-family: var(--tk-font-body);
    font-size: var(--tk-text-md);
    line-height: var(--tk-line-height-md);
  }

  body, main, section, article, aside, header, footer {
    position: relative;
  }

  h1, h2, h3, h4, h5, h6 {
    font-family: var(--tk-font-heading);
    letter-spacing: var(--tk-letter-spacing-lg);
    overflow-wrap: break-word;
    text-wrap: balance;
  }

  p, span {
    overflow-wrap: break-word;
    text-wrap: pretty;
  }

  img, picture, video, canvas, svg, i {
    object-fit: cover;
    background-repeat: no-repeat;
    background-size: cover;
    min-width: 16px;
    max-width: 100%;
    height: auto;
    font-style: italic;
    display: block;
  }

  [data-img-fit] {
    isolation: isolate;
    position: relative;
  }

  [data-img-fit] img:first-of-type {
    z-index: -1;
    width: 100%;
    height: 100%;
    position: absolute;
    inset: 0;
  }

  input, button, textarea, select, optgroup {
    font: inherit;
    color: inherit;
  }

  button {
    cursor: pointer;
    background: none;
    border: none;
  }

  a {
    color: inherit;
    text-decoration: inherit;
    cursor: pointer;
  }

  ol, ul, menu {
    gap: var(--tk-size-16);
    min-width: fit-content;
    display: inline-flex;
  }

  ol li, ul li, menu li {
    width: 100%;
  }

  table {
    border-collapse: collapse;
    border-spacing: 0;
  }

  textarea {
    resize: vertical;
  }

  :focus-visible {
    outline: 2px solid var(--tk-focus-ring, var(--tk-color-primary));
    outline-offset: 2px;
    border-radius: var(--tk-size-4);
  }

  :focus:not(:focus-visible) {
    outline: #0000;
  }

  ::selection {
    background-color: var(--tk-color-primary-5a);
    color: var(--tk-color-primary-5xlight);
  }

  ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
  }

  ::-webkit-scrollbar-track {
    background: none;
  }

  ::-webkit-scrollbar-thumb {
    background: var(--tk-color-theme-5a);
    border-radius: var(--tk-radius-full);
  }

  ::-webkit-scrollbar-thumb:hover {
    background: var(--tk-color-theme-5a);
  }

  * {
    scrollbar-width: thin;
    scrollbar-color: var(--tk-color-theme-5a) transparent;
  }

  [hidden] {
    display: none;
  }

  @media (prefers-reduced-motion: reduce) {
    html {
      scroll-behavior: auto;
    }

    *, :before, :after {
      scroll-behavior: auto;
      transition-duration: .01ms;
      animation-duration: .01ms;
      animation-iteration-count: 1;
    }
  }

  @media print {
    body {
      color: #000;
      background: #fff;
    }

    body > header, body > footer, nav, button, [role="button"], dialog {
      display: none;
    }

    a[href]:after {
      content: " (" attr(href) ")";
      opacity: .7;
      font-size: .8em;
    }

    * {
      box-shadow: none;
    }
  }
}

@layer typography {
  h1 {
    font-size: var(--tk-text-5xl);
    font-weight: 800;
    line-height: var(--tk-line-height-xs);
    margin-block-end: var(--tk-size-24);
  }

  h2 {
    font-size: var(--tk-text-4xl);
    font-weight: 700;
    line-height: var(--tk-line-height-xs);
    margin-block-end: var(--tk-size-16);
  }

  h3 {
    font-size: var(--tk-text-3xl);
    font-weight: 700;
    line-height: var(--tk-line-height-sm);
    margin-block-end: var(--tk-size-12);
  }

  h4 {
    font-size: var(--tk-text-2xl);
    font-weight: 600;
    line-height: var(--tk-line-height-xs);
    margin-block-end: var(--tk-size-8);
  }

  h5 {
    font-size: var(--tk-text-xl);
    font-weight: 600;
    line-height: var(--tk-line-height-xs);
    margin-block-end: var(--tk-size-8);
  }

  h6 {
    font-size: var(--tk-text-lg);
    font-weight: 600;
    line-height: var(--tk-line-height-xs);
    margin-block-end: var(--tk-size-8);
  }

  p {
    font-size: var(--tk-text-md);
    color: var(--tk-fg-4x);
    margin-block-end: var(--tk-size-16);
  }

  h1 ~ p, h2 ~ p {
    font-size: var(--tk-text-lg);
  }

  strong, b {
    color: var(--tk-fg-5x);
    font-weight: 700;
  }

  em, i {
    font-style: italic;
  }

  small {
    font-size: var(--tk-text-sm);
    color: var(--tk-fg-2x);
  }

  :where(article, section, main) a:not([role="button"]) {
    color: var(--tk-color-primary);
    text-decoration: underline;
    text-decoration-color: var(--tk-color-primary-2a);
    text-underline-offset: .15em;
    transition: color var(--tk-duration-fast) var(--tk-easing), text-decoration-color var(--tk-duration-fast) var(--tk-easing);
    text-decoration-thickness: 1px;
  }

  :where(article, section, main) a:not([role="button"]):hover {
    color: var(--tk-color-primary-1xdark);
    text-decoration-color: var(--tk-color-primary);
    text-decoration-thickness: 2px;
  }

  mark {
    background-color: var(--tk-color-accent-4xlight);
    color: var(--tk-color-accent-5xdark);
    padding-inline: var(--tk-size-4);
    border-radius: var(--tk-size-4);
  }

  code, kbd, samp {
    font-family: var(--tk-font-mono);
    font-size: .875em;
  }

  :not(pre) > code {
    background-color: var(--tk-color-theme-2a);
    color: var(--tk-color-primary-1xdark);
    border-radius: var(--tk-size-4);
    padding: .125rem .375rem;
    font-weight: 500;
  }

  kbd {
    background-color: var(--tk-bg-4x);
    border: 1px solid var(--tk-bg-5x);
    border-radius: var(--tk-size-4);
    min-width: 1.5em;
    font-size: var(--tk-text-xs);
    color: var(--tk-fg-3x);
    box-shadow: var(--tk-color-shadow-sm);
    border-bottom-width: 2px;
    justify-content: center;
    align-items: center;
    padding: .125rem .375rem;
    font-weight: 600;
    display: inline-flex;
  }

  pre {
    font-family: var(--tk-font-mono);
    font-size: var(--tk-text-sm);
    line-height: var(--tk-line-height-sm);
    background-color: var(--tk-color-theme-4xlight);
    color: var(--tk-fg-5x);
    padding: var(--tk-size-24);
    border-radius: var(--tk-size-12);
    border: 1px solid var(--tk-bg-2x);
    tab-size: 2;
    margin-block-end: var(--tk-size-32);
    overflow-x: auto;
  }

  pre > code {
    color: inherit;
    font-size: inherit;
    background: none;
    padding: 0;
  }

  blockquote {
    border-inline-start: 3px solid var(--tk-color-primary-2xlight);
    padding-inline-start: var(--tk-size-24);
    padding-block: var(--tk-size-4);
    color: var(--tk-fg-2x);
    font-style: italic;
    font-size: var(--tk-text-lg);
    margin-block-end: var(--tk-size-32);
  }

  blockquote > p:last-child {
    margin-block-end: 0;
  }

  blockquote cite {
    font-size: var(--tk-text-sm);
    color: var(--tk-fg-4x);
    margin-block-start: var(--tk-size-2);
    font-style: normal;
    font-weight: 500;
    display: block;
  }

  blockquote cite:before {
    content: "— ";
  }

  :where(article, section, main) ul {
    margin-block-end: var(--tk-size-12);
    padding-inline-start: var(--tk-size-32);
    list-style: outside;
  }

  :where(article, section, main) ol {
    margin-block-end: var(--tk-size-12);
    padding-inline-start: var(--tk-size-32);
    list-style: decimal;
  }

  :where(article, section, main) li {
    line-height: var(--tk-line-height-sm);
    margin-block-end: var(--tk-size-4);
  }

  :where(article, section, main) li > ul, :where(article, section, main) li > ol {
    margin-block-start: var(--tk-size-4);
    margin-block-end: var(--tk-size-4);
  }

  hr {
    background: var(--tk-border-2xs);
    height: 1px;
    margin-block: var(--tk-size-48);
    border: none;
  }

  details {
    border: 1px solid var(--tk-border-2xs);
    border-radius: var(--tk-radius-sm);
    padding: var(--tk-size-12) var(--tk-size-24);
    margin-block-end: var(--tk-size-12);
  }

  summary {
    cursor: pointer;
    user-select: none;
    color: var(--tk-fg-4x);
    padding: var(--tk-size-4) 0;
    align-items: center;
    gap: var(--tk-size-12);
    font-weight: 600;
    list-style: none;
    display: flex;
  }

  summary:before {
    content: "▸";
    transition: transform var(--tk-duration-normal) var(--tk-easing);
    font-size: .8em;
    display: inline-block;
  }

  details[open] > summary:before {
    transform: rotate(90deg);
  }

  summary::-webkit-details-marker {
    display: none;
  }

  details > :not(summary) {
    margin-block: var(--tk-size-12);
  }

  figure {
    margin-block-end: var(--tk-size-32);
  }

  figcaption {
    font-size: var(--tk-text-sm);
    color: var(--tk-fg-4x);
    text-align: center;
    margin-block-start: var(--tk-size-2);
    font-style: italic;
  }
}

@layer forms {
  label {
    font-size: var(--tk-text-sm);
    color: var(--tk-fg-5x);
    margin-block-end: .375rem;
    font-weight: 600;
    display: block;
  }

  input:where([type="text"], [type="email"], [type="password"], [type="url"], [type="tel"], [type="number"], [type="search"], [type="date"], [type="datetime-local"], [type="month"], [type="week"], [type="time"]), textarea, select {
    width: 100%;
    padding: .625rem var(--tk-size-12);
    font-size: var(--tk-text-md);
    line-height: var(--tk-line-height-sm);
    color: var(--tk-fg-5x);
    background-color: var(--tk-bg-4x);
    border: 1px solid var(--tk-bg-4x);
    border-radius: var(--tk-size-8);
    transition: border-color var(--tk-duration-fast) var(--tk-easing), box-shadow var(--tk-duration-fast) var(--tk-easing);
    outline: none;
    display: block;
  }

  input:where([type="text"], [type="email"], [type="password"], [type="url"], [type="tel"], [type="number"], [type="search"], [type="date"], [type="datetime-local"], [type="month"], [type="week"], [type="time"]):hover, textarea:hover, select:hover {
    border-color: var(--tk-border-2xs);
  }

  input:where([type="text"], [type="email"], [type="password"], [type="url"], [type="tel"], [type="number"], [type="search"], [type="date"], [type="datetime-local"], [type="month"], [type="week"], [type="time"]):focus, textarea:focus, select:focus {
    border-color: var(--tk-color-primary-1xlight);
    box-shadow: 0 0 0 3px var(--tk-color-primary-2a);
  }

  ::placeholder {
    color: var(--tk-fg-3x);
    opacity: 1;
  }

  input:disabled, textarea:disabled, select:disabled {
    opacity: .5;
    cursor: not-allowed;
    background-color: var(--tk-color-theme-2xlight);
  }

  textarea {
    resize: vertical;
    min-height: 5rem;
  }

  select {
    appearance: none;
    cursor: pointer;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right var(--tk-size-4) center;
    padding-inline-end: 2.5rem;
  }

  input[type="checkbox"], input[type="radio"] {
    appearance: none;
    border: 2px solid var(--tk-bg-2x);
    background-color: var(--tk-bg-4x);
    vertical-align: middle;
    cursor: pointer;
    width: 1.125rem;
    height: 1.125rem;
    transition: background-color var(--tk-duration-fast) var(--tk-easing), border-color var(--tk-duration-fast) var(--tk-easing);
    flex-shrink: 0;
    position: relative;
  }

  input[type="checkbox"] {
    border-radius: var(--tk-size-4);
  }

  input[type="radio"] {
    border-radius: var(--tk-radius-full);
  }

  input[type="checkbox"]:hover, input[type="radio"]:hover {
    border-color: var(--tk-color-primary);
    background-color: var(--tk-color-primary-4xlight);
  }

  input[type="checkbox"]:checked, input[type="radio"]:checked {
    background-color: var(--tk-color-primary);
    border-color: var(--tk-color-primary);
  }

  input[type="checkbox"]:checked:after {
    content: "";
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='white'%3E%3Cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3E%3C/svg%3E");
    background-size: contain;
    position: absolute;
    inset: 0;
  }

  input[type="radio"]:checked:after {
    content: "";
    border-radius: var(--tk-radius-full);
    background-color: #fff;
    position: absolute;
    inset: 3px;
  }

  label:has(input[type="checkbox"]), label:has(input[type="radio"]) {
    align-items: center;
    gap: var(--tk-size-2);
    cursor: pointer;
    user-select: none;
    font-weight: 400;
    display: flex;
  }

  input[type="range"] {
    appearance: none;
    background: var(--tk-color-theme-3xlight);
    border-radius: var(--tk-radius-full);
    cursor: pointer;
    outline: none;
    width: 100%;
    height: 6px;
  }

  input[type="range"]::-webkit-slider-thumb {
    appearance: none;
    background: var(--tk-color-primary);
    border-radius: var(--tk-radius-full);
    border: 3px solid var(--tk-bg-4x);
    width: 1.25rem;
    height: 1.25rem;
    box-shadow: var(--tk-color-shadow-sm);
    cursor: grab;
    transition: transform var(--tk-duration-fast) var(--tk-easing);
  }

  input[type="range"]::-webkit-slider-thumb:hover {
    transform: scale(1.15);
  }

  input[type="color"] {
    appearance: none;
    border: 2px solid var(--tk-border-2xs);
    border-radius: var(--tk-size-8);
    width: 3rem;
    height: 2.5rem;
    padding: var(--tk-size-4);
    cursor: pointer;
    background: var(--tk-bg-4x);
  }

  input[type="color"]::-webkit-color-swatch-wrapper {
    padding: 0;
  }

  input[type="color"]::-webkit-color-swatch {
    border-radius: var(--tk-size-4);
    border: none;
  }

  input[type="file"] {
    font-size: var(--tk-text-sm);
    color: var(--tk-fg-2x);
  }

  input[type="file"]::file-selector-button {
    font: inherit;
    font-weight: 600;
    font-size: var(--tk-text-sm);
    padding: var(--tk-size-2) var(--tk-size-12);
    background-color: var(--tk-color-primary);
    color: #fff;
    border-radius: var(--tk-size-8);
    cursor: pointer;
    transition: background-color var(--tk-duration-fast) var(--tk-easing);
    border: none;
    margin-inline-end: var(--tk-size-4);
  }

  input[type="file"]::file-selector-button:hover {
    background-color: var(--tk-color-primary-1xdark);
  }

  progress {
    appearance: none;
    border-radius: var(--tk-radius-full);
    border: none;
    width: 100%;
    height: 8px;
    overflow: hidden;
  }

  progress::-webkit-progress-bar {
    background-color: var(--tk-color-theme-4xlight);
    border-radius: var(--tk-radius-full);
  }

  progress::-webkit-progress-value {
    background-color: var(--tk-color-primary);
    border-radius: var(--tk-radius-full);
  }

  progress::-moz-progress-bar {
    background-color: var(--tk-color-primary);
    border-radius: var(--tk-radius-full);
  }

  fieldset {
    border: 1px solid var(--tk-bg-4x);
    border-radius: var(--tk-size-12);
    padding: var(--tk-size-24);
    margin-block-end: var(--tk-size-24);
  }

  legend {
    font-weight: 700;
    font-size: var(--tk-text-sm);
    color: var(--tk-fg-5x);
    padding-inline: var(--tk-size-2);
    text-transform: uppercase;
    letter-spacing: .05em;
  }

  label:has( + input:required):after, label:has( + textarea:required):after, label:has( + select:required):after {
    content: " *";
    color: var(--tk-fg-4x);
  }
}

@layer components {
  button, input[type="submit"], input[type="button"], input[type="reset"], [role="button"] {
    justify-content: center;
    align-items: center;
    gap: var(--tk-size-2);
    padding: .625rem var(--tk-size-24);
    font-size: var(--tk-text-sm);
    white-space: nowrap;
    border-radius: var(--tk-size-8);
    cursor: pointer;
    user-select: var(--tk-user-select-none);
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
    transition: background-color var(--tk-duration-slow) var(--tk-easing),
    color var(--tk-duration-slow) var(--tk-easing),
    border-color var(--tk-duration-slow) var(--tk-easing),
    box-shadow var(--tk-duration-slow) var(--tk-easing),
    transform var(--tk-duration-slow) var(--tk-easing);
    border: 1px solid #0000;
    font-weight: 600;
    line-height: 1.4;
    display: inline-flex;
  }

  :where(form, fieldset, [role="group"]) button:active, input[type="submit"]:active, [role="button"]:active {
    transform: scale(.97);
  }

  button:disabled, input[type="submit"]:disabled, input[type="button"]:disabled, [role="button"][aria-disabled="true"] {
    opacity: .5;
    cursor: not-allowed;
    transform: none;
  }

  table {
    width: 100%;
    font-size: var(--tk-text-sm);
    text-align: left;
    margin-block-end: var(--tk-size-32);
  }

  thead {
    background-color: var(--tk-color-theme-4xlight);
    border-bottom: 2px solid var(--tk-border-2xs);
  }

  th {
    padding: var(--tk-size-4) var(--tk-size-12);
    font-weight: 700;
    font-size: var(--tk-text-xs);
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--tk-fg-2x);
  }

  td {
    padding: var(--tk-size-4) var(--tk-size-12);
    color: var(--tk-fg-5x);
    border-bottom: 1px solid var(--tk-bg-2x);
  }

  tbody tr {
    transition: background-color var(--tk-duration-sm) var(--tk-easing);
  }

  tbody tr:hover {
    background-color: var(--tk-color-theme-2a);
  }

  tbody tr:last-child td {
    border-bottom: none;
  }

  caption {
    padding: var(--tk-size-4) var(--tk-size-12);
    font-size: var(--tk-text-sm);
    color: var(--tk-fg-4x);
    text-align: left;
    caption-side: bottom;
  }

  dialog {
    border-radius: var(--tk-radius-4);
    padding: var(--tk-size-48);
    background-color: var(--tk-bg-4x);
    color: var(--tk-fg-4x);
    box-shadow: var(--tk-color-shadow-lg);
    border: none;
    width: 100%;
    max-width: min(90vw, 32rem);
    margin: auto;
    position: fixed;
    inset: 0;
  }

  dialog::backdrop {
    background: var(--tk-color-theme-7a);
    backdrop-filter: blur(4px);
  }

  dialog[open] {
    animation: toky-dialog-in var(--tk-duration-normal) var(--tk-easing);
  }

  @keyframes toky-dialog-in {
    from {
      opacity: 0;
      transform: scale(.95)translateY(8px);
    }

    to {
      opacity: 1;
      transform: scale(1)translateY(0);
    }
  }

  nav ul {
    align-items: center;
    gap: var(--tk-size-4);
    display: flex;
  }

  nav a {
    align-items: center;
    gap: var(--tk-size-4);
    padding: var(--tk-size-2) var(--tk-size-4);
    font-size: var(--tk-text-sm);
    color: var(--tk-fg-2x);
    border-radius: var(--tk-size-8);
    transition: color var(--tk-duration-fast) var(--tk-easing),
    background-color var(--tk-duration-fast) var(--tk-easing);
    font-weight: 500;
    text-decoration: none;
    display: flex;
  }

  nav a:hover {
    color: var(--tk-fg-5x);
    background-color: var(--tk-color-theme-3a);
  }

  nav a[aria-current="page"], nav a[aria-current="true"] {
    color: var(--tk-color-primary-1xdark);
    background-color: var(--tk-color-primary-2a);
    font-weight: 600;
  }
}

@layer layout {
  header {
    padding: var(--tk-size-20) var(--tk-size-20);
    border-bottom: 1px solid var(--tk-border-xs);
    background-color: var(--tk-bg-4x);
    justify-content: space-between;
    align-items: center;
    display: flex;
  }

  header > * {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    display: flex;
  }

  header > * nav ul {
    flex-direction: row;
    gap: 1rem;
    display: flex;
  }

  header > * nav ul li a {
    font-size: var(--tk-font-size-xs);
    text-decoration: none;
  }

  main {
    padding: var(--tk-size-48) var(--tk-size-20);
    margin-inline: auto;
  }

  header + main > section:first-child {
    padding-block-start: var(--tk-size-80);
  }

  section {
    padding-block: var(--tk-size-64);
  }

  body > footer {
    padding: var(--tk-size-48) var(--tk-size-20);
    border-top: 1px solid var(--tk-bg-2x);
    color: var(--tk-fg-4x);
    font-size: var(--tk-text-sm);
    text-align: center;
  }

  aside {
    padding: var(--tk-size-24);
    background-color: var(--tk-bg-3x);
    border-radius: var(--tk-size-4);
    border: 1px solid var(--tk-bg-2x);
    font-size: var(--tk-text-sm);
    color: var(--tk-fg-2x);
    margin-block-end: var(--tk-size-32);
  }

  .layout-grid {
    grid-template-columns: var(--tk-layout-grid);
    display: grid;
  }

  .layout-grid > *, .layout--grid > .layout--main, .layout--full > .layout--main {
    grid-column: main;
  }

  .layout--grid > .layout--fill {
    grid-column: fill;
  }

  .layout--grid > .layout--full {
    grid-column: full;
    display: grid;
  }

  .layout--main-start-fill-end {
    grid-column: main-start / fill-end;
  }

  .layout--main-start-full-end {
    grid-column: main-start / full-end;
  }

  .layout--fill-start-main-end {
    grid-column: fill-start / main-end;
  }

  .layout--full-start-main-end {
    grid-column: full-start / main-end;
  }

  .layout--full-start-fill-end {
    grid-column: full-start / fill-end;
  }

  .layout--fill-start-full-end {
    grid-column: fill-start / full-end;
  }
}

@layer utilities {
  .btn--sm {
    font-size: var(--tk-text-xs);
    padding: .375rem .75rem;
  }

  .btn--md {
    font-size: var(--tk-text-md);
    padding: .75rem 1.5rem;
  }

  .btn--lg {
    font-size: var(--tk-text-lg);
    padding: 1rem 2rem;
  }

  [aria-busy="true"] {
    cursor: progress;
    opacity: .7;
  }

  [aria-disabled="true"] {
    cursor: not-allowed;
    opacity: .5;
    pointer-events: none;
  }

  [data-status="success"] {
    background-color: var(--tk-color-success-3xlight);
    color: var(--tk-color-success-5xdark);
    border: 1px solid var(--tk-color-success-3a);
  }

  [data-status="warning"] {
    background-color: var(--tk-color-warning-3xlight);
    color: var(--tk-color-warning-5xdark);
    border: 1px solid var(--tk-color-warning-3a);
  }

  [data-status="danger"], [data-status="error"] {
    background-color: var(--tk-color-error-3xlight);
    color: var(--tk-color-error-5xdark);
    border: 1px solid var(--tk-color-error-3a);
  }

  [data-status="info"] {
    background-color: var(--tk-color-info-3xlight);
    color: var(--tk-color-info-5xdark);
    border: 1px solid var(--tk-color-info-3a);
  }

  [data-sr-only] {
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    position: absolute;
    overflow: hidden;
  }
}