/* Generated by Frontic. The CLI overwrites this file; do not edit it. */
/* Generated from the Design System's brand.json — do not edit.
 * Change the tokens and this file is rebuilt on the next build. */
:root {
  box-sizing: border-box;

  /* color */
  --fui-background: #ffffff;
  --fui-foreground: #09090b;
  --fui-foreground-hover: #3f3f46;
  --fui-popover: #ffffff;
  --fui-popover-foreground: #09090b;
  --fui-card: #ffffff;
  --fui-card-foreground: #09090b;
  --fui-primary: #7008e7;
  --fui-primary-foreground: #f5f3ff;
  --fui-primary-hover: #5e07c2;
  --fui-secondary: #f4f4f5;
  --fui-secondary-foreground: #18181b;
  --fui-active: #7008e7;
  --fui-active-foreground: #f5f3ff;
  --fui-muted: #f4f4f5;
  --fui-muted-foreground: #66666f;
  --fui-accent: #f4f4f5;
  --fui-accent-foreground: #18181b;
  --fui-border: #e4e4e7;
  --fui-input: #a1a1aa;
  --fui-ring: #71717a;
  --fui-destructive: #c70009;
  --fui-destructive-foreground: #ffffff;
  --fui-destructive-hover: #a50007;
  --fui-info: #2563eb;
  --fui-info-foreground: #ffffff;
  --fui-positive: #12883e;
  --fui-positive-foreground: #ffffff;
  --fui-warning: #d97706;
  --fui-warning-foreground: #09090b;
  --fui-buy: #7008e7;
  --fui-buy-foreground: #f5f3ff;
  --fui-buy-hover: #5e07c2;
  --fui-checkout: #7008e7;
  --fui-checkout-foreground: #f5f3ff;
  --fui-checkout-hover: #5e07c2;
  --fui-promo: #e7000b;
  --fui-promo-foreground: #ffffff;
  --fui-discount: #e7000b;
  --fui-discount-foreground: #ffffff;
  --fui-new: #2563eb;
  --fui-new-foreground: #ffffff;
  --fui-price: #09090b;
  --fui-price-foreground: #ffffff;
  --fui-rating: #c27c00;
  --fui-rating-foreground: #09090b;

  /* type */
  --fui-font-sans: 'Inter Variable', Inter, sans-serif;
  --fui-font-heading: 'Inter Variable', Inter, sans-serif;
  --fui-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  --fui-font-body: var(--fui-font-sans);
  --fui-font-display: var(--fui-font-heading);
  --fui-text-xs: 0.75rem;
  --fui-text-sm: 0.875rem;
  --fui-text-base: 1rem;
  --fui-text-lg: 1.125rem;
  --fui-text-xl: 1.25rem;
  --fui-text-2xl: 1.5rem;
  --fui-text-3xl: 1.875rem;
  --fui-text-4xl: 2.25rem;
  --fui-text-5xl: 3rem;
  --fui-text-6xl: 3.75rem;
  --fui-font-weight-normal: 400;
  --fui-font-weight-medium: 500;
  --fui-font-weight-semibold: 600;
  --fui-text-heading-family: 'Inter Variable', Inter, sans-serif;
  --fui-text-heading-size: 1.5rem;
  --fui-text-heading-line-height: 1.25;
  --fui-text-heading-weight: 600;
  --fui-text-heading-tracking: normal;
  --fui-text-heading-feature: normal;
  --fui-text-heading-variation: normal;
  --fui-text-body-family: 'Inter Variable', Inter, sans-serif;
  --fui-text-body-size: 1rem;
  --fui-text-body-line-height: 1.5;
  --fui-text-body-weight: 400;
  --fui-text-body-tracking: normal;
  --fui-text-body-feature: normal;
  --fui-text-body-variation: normal;
  --fui-text-ui-family: 'Inter Variable', Inter, sans-serif;
  --fui-text-ui-size: 0.875rem;
  --fui-text-ui-line-height: 1.43;
  --fui-text-ui-weight: 500;
  --fui-text-ui-tracking: normal;
  --fui-text-ui-feature: normal;
  --fui-text-ui-variation: normal;
  --fui-text-small-family: 'Inter Variable', Inter, sans-serif;
  --fui-text-small-size: 0.875rem;
  --fui-text-small-line-height: 1.43;
  --fui-text-small-weight: 400;
  --fui-text-small-tracking: normal;
  --fui-text-small-feature: normal;
  --fui-text-small-variation: normal;
  --fui-text-caption-family: 'Inter Variable', Inter, sans-serif;
  --fui-text-caption-size: 0.75rem;
  --fui-text-caption-line-height: 1.33;
  --fui-text-caption-weight: 500;
  --fui-text-caption-tracking: normal;
  --fui-text-caption-feature: normal;
  --fui-text-caption-variation: normal;
  --fui-text-control-family: 'Inter Variable', Inter, sans-serif;
  --fui-text-control-size: 1rem;
  --fui-text-control-line-height: 1.5;
  --fui-text-control-weight: 400;
  --fui-text-control-tracking: normal;
  --fui-text-control-feature: normal;
  --fui-text-control-variation: normal;
  --fui-text-display-family: 'Inter Variable', Inter, sans-serif;
  --fui-text-display-size: 2.25rem;
  --fui-text-display-line-height: 2.5rem;
  --fui-text-display-weight: 400;
  --fui-text-display-tracking: normal;
  --fui-text-display-feature: normal;
  --fui-text-display-variation: normal;
  --fui-text-headline-family: 'Inter Variable', Inter, sans-serif;
  --fui-text-headline-size: 1.5rem;
  --fui-text-headline-line-height: 2rem;
  --fui-text-headline-weight: 400;
  --fui-text-headline-tracking: normal;
  --fui-text-headline-feature: normal;
  --fui-text-headline-variation: normal;
  --fui-text-page-title-family: 'Inter Variable', Inter, sans-serif;
  --fui-text-page-title-size: 1.5rem;
  --fui-text-page-title-line-height: 2rem;
  --fui-text-page-title-weight: 600;
  --fui-text-page-title-tracking: normal;
  --fui-text-page-title-feature: normal;
  --fui-text-page-title-variation: normal;
  --fui-text-title-family: 'Inter Variable', Inter, sans-serif;
  --fui-text-title-size: 1.25rem;
  --fui-text-title-line-height: 1.75rem;
  --fui-text-title-weight: 600;
  --fui-text-title-tracking: normal;
  --fui-text-title-feature: normal;
  --fui-text-title-variation: normal;
  --fui-text-subheading-family: 'Inter Variable', Inter, sans-serif;
  --fui-text-subheading-size: 1.125rem;
  --fui-text-subheading-line-height: 1.75rem;
  --fui-text-subheading-weight: 600;
  --fui-text-subheading-tracking: normal;
  --fui-text-subheading-feature: normal;
  --fui-text-subheading-variation: normal;
  --fui-text-lead-family: 'Inter Variable', Inter, sans-serif;
  --fui-text-lead-size: 1.125rem;
  --fui-text-lead-line-height: calc(1.75 / 1.125);
  --fui-text-lead-weight: 400;
  --fui-text-lead-tracking: normal;
  --fui-text-lead-feature: normal;
  --fui-text-lead-variation: normal;
  --fui-text-copy-family: 'Inter Variable', Inter, sans-serif;
  --fui-text-copy-size: 0.875rem;
  --fui-text-copy-line-height: 1.5rem;
  --fui-text-copy-weight: 400;
  --fui-text-copy-tracking: normal;
  --fui-text-copy-feature: normal;
  --fui-text-copy-variation: normal;
  --fui-text-note-family: 'Inter Variable', Inter, sans-serif;
  --fui-text-note-size: 0.8125rem;
  --fui-text-note-line-height: 1.43;
  --fui-text-note-weight: 400;
  --fui-text-note-tracking: normal;
  --fui-text-note-feature: normal;
  --fui-text-note-variation: normal;
  --fui-text-description-family: 'Inter Variable', Inter, sans-serif;
  --fui-text-description-size: 0.875rem;
  --fui-text-description-line-height: 1.625;
  --fui-text-description-weight: 400;
  --fui-text-description-tracking: normal;
  --fui-text-description-feature: normal;
  --fui-text-description-variation: normal;
  --fui-text-micro-family: 'Inter Variable', Inter, sans-serif;
  --fui-text-micro-size: 0.625rem;
  --fui-text-micro-line-height: 1.33;
  --fui-text-micro-weight: 500;
  --fui-text-micro-tracking: normal;
  --fui-text-micro-feature: normal;
  --fui-text-micro-variation: normal;

  /* shape */
  --fui-radius: 0.5rem;
  --fui-radius-none: 0px;
  --fui-radius-sm: 0.3rem;
  --fui-radius-md: 0.4rem;
  --fui-radius-lg: 0.5rem;
  --fui-radius-xl: 0.7rem;
  --fui-radius-full: 9999px;
  --fui-border-default: 1px solid var(--fui-border);
  --fui-border-strong: 1px solid var(--fui-foreground);
  --fui-border-focus: 2px solid var(--fui-ring);
  --fui-border-frame: 4px solid var(--fui-background);
  --fui-border-frame-thin: 2px solid var(--fui-background);
  --fui-ring-hairline: 1px solid var(--fui-border);
  --fui-ring-hairline-offset: 0px;
  --fui-ring-focus: 2px solid var(--fui-ring);
  --fui-ring-focus-offset: 0px;
  --fui-ring-wide: 3px solid var(--fui-ring);
  --fui-ring-wide-offset: 0px;
  --fui-ring-outset: 2px solid var(--fui-ring);
  --fui-ring-outset-offset: 2px;
  --fui-ring-frame: 2px solid var(--fui-background);
  --fui-ring-frame-offset: 0px;
  --fui-ring-none: 0px solid transparent;
  --fui-ring-none-offset: 0px;
  --fui-opacity-0: 0;
  --fui-opacity-5: 0.05;
  --fui-opacity-10: 0.1;
  --fui-opacity-15: 0.15;
  --fui-opacity-20: 0.2;
  --fui-opacity-25: 0.25;
  --fui-opacity-30: 0.3;
  --fui-opacity-40: 0.4;
  --fui-opacity-50: 0.5;
  --fui-opacity-60: 0.6;
  --fui-opacity-70: 0.7;
  --fui-opacity-75: 0.75;
  --fui-opacity-80: 0.8;
  --fui-opacity-90: 0.9;
  --fui-opacity-95: 0.95;
  --fui-opacity-100: 1;
  --fui-shadow-xs: 0px 1px 2px 0px rgb(0 0 0 / 0.05);
  --fui-shadow-sm: 0px 1px 3px 0px rgb(0 0 0 / 0.1), 0px 1px 2px -1px rgb(0 0 0 / 0.1);
  --fui-shadow-md: 0px 4px 6px -1px rgb(0 0 0 / 0.1), 0px 2px 4px -2px rgb(0 0 0 / 0.1);
  --fui-shadow-lg: 0px 10px 15px -3px rgb(0 0 0 / 0.1), 0px 4px 6px -4px rgb(0 0 0 / 0.1);

  /* layout */
  --fui-spacing: 0.25rem;

  /* recipes */
  --fui-focus-ring-outline: var(--fui-ring-focus);
  --fui-focus-ring-outline-offset: var(--fui-ring-focus-offset);
  --fui-focus-ring-border-color: var(--fui-ring);
  --fui-focus-ring-outline-color: var(--fui-ring);
  --fui-disabled-opacity: var(--fui-opacity-50);
  --fui-invalid-outline: var(--fui-ring-focus);
  --fui-invalid-outline-offset: var(--fui-ring-focus-offset);
  --fui-invalid-border-color: var(--fui-destructive);
  --fui-invalid-outline-color: color-mix(in oklab, var(--fui-destructive) 20%, transparent);
  --fui-control-background-color: transparent;
  --fui-control-border: var(--fui-border-default);
  --fui-control-border-color: transparent;
  --fui-control-border-bottom-color: var(--fui-input);
  --fui-control-rounded: var(--fui-radius-none);
  --fui-control-font-family: var(--fui-text-control-family);
  --fui-control-font-size: var(--fui-text-control-size);
  --fui-control-line-height: var(--fui-text-control-line-height);
  --fui-control-font-weight: var(--fui-text-control-weight);
  --fui-control-letter-spacing: var(--fui-text-control-tracking);
  --fui-control-font-feature-settings: var(--fui-text-control-feature);
  --fui-control-font-variation-settings: var(--fui-text-control-variation);
  --fui-control-placeholder-color: var(--fui-muted-foreground);
  --fui-control-focus-border-bottom: var(--fui-border-focus);
  --fui-control-invalid-border-bottom-color: var(--fui-destructive);
  --fui-control-box-border: var(--fui-border-default);
  --fui-control-box-border-color: var(--fui-input);
  --fui-control-box-shadow: var(--fui-shadow-xs);
  --fui-control-box-rounded: var(--fui-radius-md);
  --fui-control-box-font-family: var(--fui-text-small-family);
  --fui-control-box-font-size: var(--fui-text-small-size);
  --fui-control-box-line-height: var(--fui-text-small-line-height);
  --fui-control-box-font-weight: var(--fui-text-small-weight);
  --fui-control-box-letter-spacing: var(--fui-text-small-tracking);
  --fui-control-box-font-feature-settings: var(--fui-text-small-feature);
  --fui-control-box-font-variation-settings: var(--fui-text-small-variation);
  --fui-control-line-file-background-color: transparent;
  --fui-control-line-file-border: none;
  --fui-control-line-file-text-color: var(--fui-foreground);
  --fui-control-line-file-font-family: var(--fui-text-ui-family);
  --fui-control-line-file-font-size: var(--fui-text-ui-size);
  --fui-control-line-file-line-height: var(--fui-text-ui-line-height);
  --fui-control-line-file-font-weight: var(--fui-text-ui-weight);
  --fui-control-line-file-letter-spacing: var(--fui-text-ui-tracking);
  --fui-control-line-file-font-feature-settings: var(--fui-text-ui-feature);
  --fui-control-line-file-font-variation-settings: var(--fui-text-ui-variation);
  --fui-choice-background-color: transparent;
  --fui-choice-border: var(--fui-border-default);
  --fui-choice-border-color: var(--fui-input);
  --fui-choice-box-rounded: var(--fui-radius-none);
  --fui-choice-box-checked-background-color: var(--fui-primary);
  --fui-choice-box-checked-text-color: var(--fui-primary-foreground);
  --fui-choice-box-checked-border-color: var(--fui-primary);
  --fui-choice-dot-rounded: var(--fui-radius-full);
  --fui-choice-dot-checked-border-color: var(--fui-foreground);
  --fui-choice-dot-checked-icon-color: var(--fui-foreground);
  --fui-tag-background-color: transparent;
  --fui-tag-border: var(--fui-border-default);
  --fui-tag-border-color: var(--fui-input);
  --fui-tag-rounded: var(--fui-radius-none);
  --fui-tag-font-family: var(--fui-text-small-family);
  --fui-tag-font-size: var(--fui-text-small-size);
  --fui-tag-line-height: var(--fui-text-small-line-height);
  --fui-tag-font-weight: var(--fui-text-small-weight);
  --fui-tag-letter-spacing: var(--fui-text-small-tracking);
  --fui-tag-font-feature-settings: var(--fui-text-small-feature);
  --fui-tag-font-variation-settings: var(--fui-text-small-variation);
  --fui-tag-hover-background-color: var(--fui-muted);
  --fui-menu-item-rounded: var(--fui-radius-none);
  --fui-menu-item-font-family: var(--fui-text-small-family);
  --fui-menu-item-font-size: var(--fui-text-small-size);
  --fui-menu-item-line-height: var(--fui-text-small-line-height);
  --fui-menu-item-font-weight: var(--fui-text-small-weight);
  --fui-menu-item-letter-spacing: var(--fui-text-small-tracking);
  --fui-menu-item-font-feature-settings: var(--fui-text-small-feature);
  --fui-menu-item-font-variation-settings: var(--fui-text-small-variation);
  --fui-menu-item-focus-background-color: var(--fui-accent);
  --fui-menu-item-focus-text-color: var(--fui-accent-foreground);
  --fui-menu-item-destructive-text-color: var(--fui-destructive);
  --fui-menu-item-destructive-icon-color: var(--fui-destructive);
  --fui-menu-item-destructive-focus-background-color: color-mix(in oklab, var(--fui-destructive) 10%, transparent);
  --fui-menu-item-destructive-focus-text-color: var(--fui-destructive);
  --fui-menu-label-text-color: var(--fui-muted-foreground);
  --fui-menu-label-font-family: var(--fui-text-caption-family);
  --fui-menu-label-font-size: var(--fui-text-caption-size);
  --fui-menu-label-line-height: var(--fui-text-caption-line-height);
  --fui-menu-label-font-weight: 600;
  --fui-menu-label-letter-spacing: 0.05em;
  --fui-menu-label-font-feature-settings: var(--fui-text-caption-feature);
  --fui-menu-label-font-variation-settings: var(--fui-text-caption-variation);
  --fui-menu-label-text-transform: uppercase;
  --fui-menu-shortcut-text-color: var(--fui-muted-foreground);
  --fui-menu-shortcut-font-family: var(--fui-text-caption-family);
  --fui-menu-shortcut-font-size: var(--fui-text-caption-size);
  --fui-menu-shortcut-line-height: var(--fui-text-caption-line-height);
  --fui-menu-shortcut-font-weight: 400;
  --fui-menu-shortcut-letter-spacing: 0.1em;
  --fui-menu-shortcut-font-feature-settings: var(--fui-text-caption-feature);
  --fui-menu-shortcut-font-variation-settings: var(--fui-text-caption-variation);
  --fui-option-item-rounded: var(--fui-radius-none);
  --fui-option-item-font-family: var(--fui-text-small-family);
  --fui-option-item-font-size: var(--fui-text-small-size);
  --fui-option-item-line-height: var(--fui-text-small-line-height);
  --fui-option-item-font-weight: var(--fui-text-small-weight);
  --fui-option-item-letter-spacing: var(--fui-text-small-tracking);
  --fui-option-item-font-feature-settings: var(--fui-text-small-feature);
  --fui-option-item-font-variation-settings: var(--fui-text-small-variation);
  --fui-option-item-highlighted-background-color: var(--fui-accent);
  --fui-option-item-highlighted-text-color: var(--fui-accent-foreground);
  --fui-overlay-outline: var(--fui-ring-hairline);
  --fui-overlay-outline-offset: var(--fui-ring-hairline-offset);
  --fui-overlay-background-color: var(--fui-background);
  --fui-overlay-text-color: var(--fui-foreground);
  --fui-overlay-outline-color: color-mix(in oklab, var(--fui-foreground) 20%, transparent);
  --fui-overlay-rounded: var(--fui-radius-none);
  --fui-overlay-shadow: var(--fui-shadow-md);
  --fui-overlay-modal-outline: var(--fui-ring-hairline);
  --fui-overlay-modal-outline-offset: var(--fui-ring-hairline-offset);
  --fui-overlay-modal-background-color: var(--fui-background);
  --fui-overlay-modal-outline-color: color-mix(in oklab, var(--fui-foreground) 10%, transparent);
  --fui-overlay-modal-rounded: var(--fui-radius-none);
  --fui-overlay-modal-shadow: var(--fui-shadow-md);
  --fui-overlay-modal-font-family: var(--fui-text-small-family);
  --fui-overlay-modal-font-size: var(--fui-text-small-size);
  --fui-overlay-modal-line-height: var(--fui-text-small-line-height);
  --fui-overlay-modal-font-weight: var(--fui-text-small-weight);
  --fui-overlay-modal-letter-spacing: var(--fui-text-small-tracking);
  --fui-overlay-modal-font-feature-settings: var(--fui-text-small-feature);
  --fui-overlay-modal-font-variation-settings: var(--fui-text-small-variation);
  --fui-overlay-sheet-background-color: var(--fui-background);
  --fui-overlay-sheet-shadow: var(--fui-shadow-md);
  --fui-overlay-sheet-font-family: var(--fui-text-small-family);
  --fui-overlay-sheet-font-size: var(--fui-text-small-size);
  --fui-overlay-sheet-line-height: var(--fui-text-small-line-height);
  --fui-overlay-sheet-font-weight: var(--fui-text-small-weight);
  --fui-overlay-sheet-letter-spacing: var(--fui-text-small-tracking);
  --fui-overlay-sheet-font-feature-settings: var(--fui-text-small-feature);
  --fui-overlay-sheet-font-variation-settings: var(--fui-text-small-variation);
  --fui-overlay-backdrop-background-color: color-mix(in oklab, var(--fui-foreground) 20%, transparent);
  --fui-panel-outline: var(--fui-ring-hairline);
  --fui-panel-outline-offset: var(--fui-ring-hairline-offset);
  --fui-panel-background-color: var(--fui-card);
  --fui-panel-text-color: var(--fui-card-foreground);
  --fui-panel-outline-color: color-mix(in oklab, var(--fui-foreground) 5%, transparent);
  --fui-panel-rounded: var(--fui-radius-none);
  --fui-panel-shadow: var(--fui-shadow-sm);
  --fui-panel-font-family: var(--fui-text-small-family);
  --fui-panel-font-size: var(--fui-text-small-size);
  --fui-panel-line-height: var(--fui-text-small-line-height);
  --fui-panel-font-weight: var(--fui-text-small-weight);
  --fui-panel-letter-spacing: var(--fui-text-small-tracking);
  --fui-panel-font-feature-settings: var(--fui-text-small-feature);
  --fui-panel-font-variation-settings: var(--fui-text-small-variation);
  --fui-surface-inset-padding-y: calc(var(--fui-spacing) * 6);
  --fui-surface-inset-md-padding-y: calc(var(--fui-spacing) * 8);
  --fui-indent-padding-start: calc(var(--fui-spacing) * 0);
  --fui-indent-md-padding-start: calc(var(--fui-spacing) * 10);
  --fui-part-title-font-family: var(--fui-text-lead-family);
  --fui-part-title-font-size: var(--fui-text-lead-size);
  --fui-part-title-line-height: var(--fui-text-lead-line-height);
  --fui-part-title-font-weight: 600;
  --fui-part-title-letter-spacing: 0.05em;
  --fui-part-title-font-feature-settings: var(--fui-text-lead-feature);
  --fui-part-title-font-variation-settings: var(--fui-text-lead-variation);
  --fui-part-title-text-transform: uppercase;
  --fui-part-title-lg-font-family: var(--fui-text-lead-family);
  --fui-part-title-lg-font-size: var(--fui-text-lead-size);
  --fui-part-title-lg-line-height: var(--fui-text-lead-line-height);
  --fui-part-title-lg-font-weight: 600;
  --fui-part-title-lg-letter-spacing: 0.05em;
  --fui-part-title-lg-font-feature-settings: var(--fui-text-lead-feature);
  --fui-part-title-lg-font-variation-settings: var(--fui-text-lead-variation);
  --fui-part-title-lg-text-transform: uppercase;
  --fui-part-description-text-color: var(--fui-muted-foreground);
  --fui-part-description-font-family: var(--fui-text-description-family);
  --fui-part-description-font-size: var(--fui-text-description-size);
  --fui-part-description-line-height: var(--fui-text-description-line-height);
  --fui-part-description-font-weight: var(--fui-text-description-weight);
  --fui-part-description-letter-spacing: var(--fui-text-description-tracking);
  --fui-part-description-font-feature-settings: var(--fui-text-description-feature);
  --fui-part-description-font-variation-settings: var(--fui-text-description-variation);
  --fui-link-foreground-link-text-decoration-line: underline;
  --fui-link-foreground-link-hover-text-color: var(--fui-foreground);
  --fui-link-primary-link-text-decoration-line: underline;
  --fui-link-primary-link-hover-text-color: var(--fui-primary);
  --fui-notice-info-border-color: var(--fui-info);
  --fui-notice-info-icon-color: var(--fui-info);
  --fui-notice-positive-border-color: var(--fui-positive);
  --fui-notice-positive-icon-color: var(--fui-positive);
  --fui-notice-warning-border-color: var(--fui-warning);
  --fui-notice-warning-icon-color: var(--fui-warning);
  --fui-notice-destructive-background-color: var(--fui-card);
  --fui-notice-destructive-text-color: var(--fui-destructive);
  --fui-label-font-family: var(--fui-text-caption-family);
  --fui-label-font-size: var(--fui-text-caption-size);
  --fui-label-line-height: var(--fui-text-caption-line-height);
  --fui-label-font-weight: 600;
  --fui-label-letter-spacing: 0.025em;
  --fui-label-font-feature-settings: var(--fui-text-caption-feature);
  --fui-label-font-variation-settings: var(--fui-text-caption-variation);
  --fui-label-text-transform: uppercase;
  --fui-hint-text-color: var(--fui-muted-foreground);
  --fui-hint-font-family: var(--fui-text-small-family);
  --fui-hint-font-size: var(--fui-text-small-size);
  --fui-hint-line-height: var(--fui-text-small-line-height);
  --fui-hint-font-weight: var(--fui-text-small-weight);
  --fui-hint-letter-spacing: var(--fui-text-small-tracking);
  --fui-hint-font-feature-settings: var(--fui-text-small-feature);
  --fui-hint-font-variation-settings: var(--fui-text-small-variation);
  --fui-error-text-color: var(--fui-destructive);
  --fui-error-font-family: var(--fui-text-small-family);
  --fui-error-font-size: var(--fui-text-small-size);
  --fui-error-line-height: var(--fui-text-small-line-height);
  --fui-error-font-weight: var(--fui-text-small-weight);
  --fui-error-letter-spacing: var(--fui-text-small-tracking);
  --fui-error-font-feature-settings: var(--fui-text-small-feature);
  --fui-error-font-variation-settings: var(--fui-text-small-variation);
  --fui-divider-background-color: var(--fui-border);
  --fui-track-background-color: var(--fui-muted);
  --fui-track-rounded: var(--fui-radius-none);
  --fui-track-fill-background-color: var(--fui-primary);
  --fui-track-thumb-background-color: var(--fui-primary);
  --fui-track-thumb-rounded: var(--fui-radius-none);
  --fui-track-thumb-hover-outline: var(--fui-ring-focus);
  --fui-track-thumb-hover-outline-offset: var(--fui-ring-focus-offset);
  --fui-track-thumb-hover-outline-color: var(--fui-ring);
  --fui-track-thumb-focus-outline: var(--fui-ring-focus);
  --fui-track-thumb-focus-outline-offset: var(--fui-ring-focus-offset);
  --fui-track-thumb-focus-outline-color: var(--fui-ring);
  --fui-calendar-day-hover-background-color: var(--fui-muted);
  --fui-calendar-day-hover-text-color: var(--fui-foreground);
  --fui-calendar-day-open-background-color: var(--fui-muted);
  --fui-calendar-day-open-text-color: var(--fui-foreground);
  --fui-calendar-day-today-background-color: var(--fui-accent);
  --fui-calendar-day-today-text-color: var(--fui-accent-foreground);
  --fui-calendar-day-outside-text-color: var(--fui-muted-foreground);
  --fui-calendar-day-fill-background-color: var(--fui-primary);
  --fui-calendar-day-fill-text-color: var(--fui-primary-foreground);
  --fui-calendar-day-fill-hover-background-color: var(--fui-primary);
  --fui-calendar-day-fill-hover-text-color: var(--fui-primary-foreground);
  --fui-calendar-day-fill-focus-background-color: var(--fui-primary);
  --fui-calendar-day-fill-focus-text-color: var(--fui-primary-foreground);
  --fui-calendar-nav-button-background-color: transparent;
  --fui-calendar-nav-button-border-color: var(--fui-border);
  --fui-calendar-nav-button-opacity: var(--fui-opacity-50);
  --fui-calendar-nav-button-hover-background-color: var(--fui-muted);
  --fui-calendar-nav-button-hover-text-color: var(--fui-foreground);
  --fui-calendar-nav-button-hover-opacity: var(--fui-opacity-100);
  --fui-calendar-nav-button-open-background-color: var(--fui-muted);
  --fui-calendar-nav-button-open-text-color: var(--fui-foreground);
  --fui-calendar-weekday-text-color: var(--fui-muted-foreground);
  --fui-calendar-weekday-font-family: var(--fui-text-caption-family);
  --fui-calendar-weekday-font-size: var(--fui-text-caption-size);
  --fui-calendar-weekday-line-height: var(--fui-text-caption-line-height);
  --fui-calendar-weekday-font-weight: 400;
  --fui-calendar-weekday-letter-spacing: var(--fui-text-caption-tracking);
  --fui-calendar-weekday-font-feature-settings: var(--fui-text-caption-feature);
  --fui-calendar-weekday-font-variation-settings: var(--fui-text-caption-variation);
  --fui-calendar-month-font-family: var(--fui-text-ui-family);
  --fui-calendar-month-font-size: var(--fui-text-ui-size);
  --fui-calendar-month-line-height: var(--fui-text-ui-line-height);
  --fui-calendar-month-font-weight: var(--fui-text-ui-weight);
  --fui-calendar-month-letter-spacing: var(--fui-text-ui-tracking);
  --fui-calendar-month-font-feature-settings: var(--fui-text-ui-feature);
  --fui-calendar-month-font-variation-settings: var(--fui-text-ui-variation);
  --fui-heading-font-family: var(--fui-text-heading-family);
  --fui-heading-font-size: var(--fui-text-heading-size);
  --fui-heading-line-height: var(--fui-text-heading-line-height);
  --fui-heading-font-weight: var(--fui-text-heading-weight);
  --fui-heading-letter-spacing: var(--fui-text-heading-tracking);
  --fui-heading-font-feature-settings: var(--fui-text-heading-feature);
  --fui-heading-font-variation-settings: var(--fui-text-heading-variation);
  --fui-title-font-family: var(--fui-text-title-family);
  --fui-title-font-size: var(--fui-text-title-size);
  --fui-title-line-height: var(--fui-text-title-line-height);
  --fui-title-font-weight: var(--fui-text-title-weight);
  --fui-title-letter-spacing: var(--fui-text-title-tracking);
  --fui-title-font-feature-settings: var(--fui-text-title-feature);
  --fui-title-font-variation-settings: var(--fui-text-title-variation);
  --fui-logo-font-family: var(--fui-text-title-family);
  --fui-logo-font-size: var(--fui-text-title-size);
  --fui-logo-line-height: var(--fui-text-title-line-height);
  --fui-logo-font-weight: 700;
  --fui-logo-letter-spacing: -0.025em;
  --fui-logo-font-feature-settings: var(--fui-text-title-feature);
  --fui-logo-font-variation-settings: var(--fui-text-title-variation);
  --fui-meta-text-color: var(--fui-muted-foreground);
  --fui-meta-font-family: var(--fui-text-caption-family);
  --fui-meta-font-size: var(--fui-text-caption-size);
  --fui-meta-line-height: var(--fui-text-caption-line-height);
  --fui-meta-font-weight: 400;
  --fui-meta-letter-spacing: var(--fui-text-caption-tracking);
  --fui-meta-font-feature-settings: var(--fui-text-caption-feature);
  --fui-meta-font-variation-settings: var(--fui-text-caption-variation);
  --fui-link-text-color: var(--fui-muted-foreground);
  --fui-link-font-family: var(--fui-text-small-family);
  --fui-link-font-size: var(--fui-text-small-size);
  --fui-link-line-height: var(--fui-text-small-line-height);
  --fui-link-font-weight: var(--fui-text-small-weight);
  --fui-link-letter-spacing: var(--fui-text-small-tracking);
  --fui-link-font-feature-settings: var(--fui-text-small-feature);
  --fui-link-font-variation-settings: var(--fui-text-small-variation);
  --fui-link-hover-text-color: var(--fui-foreground);
  --fui-total-font-family: var(--fui-text-body-family);
  --fui-total-font-size: var(--fui-text-body-size);
  --fui-total-line-height: var(--fui-text-body-line-height);
  --fui-total-font-weight: 600;
  --fui-total-letter-spacing: var(--fui-text-body-tracking);
  --fui-total-font-feature-settings: var(--fui-text-body-feature);
  --fui-total-font-variation-settings: var(--fui-text-body-variation);
  --fui-note-positive-text-color: var(--fui-positive);
  --fui-nav-trigger-background-color: transparent;
  --fui-nav-trigger-rounded: var(--fui-radius-md);
  --fui-nav-trigger-hover-background-color: var(--fui-accent);
  --fui-nav-trigger-hover-text-color: var(--fui-accent-foreground);
  --fui-nav-trigger-open-background-color: color-mix(in oklab, var(--fui-accent) 50%, transparent);
  --fui-dismiss-rounded: var(--fui-radius-full);
  --fui-dismiss-hover-background-color: color-mix(in oklab, var(--fui-muted-foreground) 20%, transparent);
  --fui-copy-muted-text-color: var(--fui-muted-foreground);
  --fui-copy-muted-font-family: var(--fui-text-copy-family);
  --fui-copy-muted-font-size: var(--fui-text-copy-size);
  --fui-copy-muted-line-height: var(--fui-text-copy-line-height);
  --fui-copy-muted-font-weight: var(--fui-text-copy-weight);
  --fui-copy-muted-letter-spacing: var(--fui-text-copy-tracking);
  --fui-copy-muted-font-feature-settings: var(--fui-text-copy-feature);
  --fui-copy-muted-font-variation-settings: var(--fui-text-copy-variation);
  --fui-line-title-font-family: var(--fui-text-ui-family);
  --fui-line-title-font-size: var(--fui-text-ui-size);
  --fui-line-title-line-height: 1.25;
  --fui-line-title-font-weight: var(--fui-text-ui-weight);
  --fui-line-title-letter-spacing: var(--fui-text-ui-tracking);
  --fui-line-title-font-feature-settings: var(--fui-text-ui-feature);
  --fui-line-title-font-variation-settings: var(--fui-text-ui-variation);
  --fui-thumbnail-border: var(--fui-border-default);
  --fui-thumbnail-border-color: var(--fui-border);
  --fui-thumbnail-rounded: var(--fui-radius-md);
  --fui-page-title-font-family: var(--fui-text-page-title-family);
  --fui-page-title-font-size: var(--fui-text-page-title-size);
  --fui-page-title-line-height: var(--fui-text-page-title-line-height);
  --fui-page-title-font-weight: var(--fui-text-page-title-weight);
  --fui-page-title-letter-spacing: var(--fui-text-page-title-tracking);
  --fui-page-title-font-feature-settings: var(--fui-text-page-title-feature);
  --fui-page-title-font-variation-settings: var(--fui-text-page-title-variation);
  --fui-quiet-action-text-color: var(--fui-muted-foreground);
  --fui-clear-link-text-color: var(--fui-muted-foreground);
  --fui-clear-link-font-family: var(--fui-text-caption-family);
  --fui-clear-link-font-size: var(--fui-text-caption-size);
  --fui-clear-link-line-height: var(--fui-text-caption-line-height);
  --fui-clear-link-font-weight: 400;
  --fui-clear-link-letter-spacing: var(--fui-text-caption-tracking);
  --fui-clear-link-font-feature-settings: var(--fui-text-caption-feature);
  --fui-clear-link-font-variation-settings: var(--fui-text-caption-variation);
  --fui-clear-link-hover-text-color: var(--fui-foreground);
  --fui-clear-link-hover-text-decoration-line: underline;
  --fui-section-title-font-family: var(--fui-text-ui-family);
  --fui-section-title-font-size: var(--fui-text-ui-size);
  --fui-section-title-line-height: var(--fui-text-ui-line-height);
  --fui-section-title-font-weight: 600;
  --fui-section-title-letter-spacing: var(--fui-text-ui-tracking);
  --fui-section-title-font-feature-settings: var(--fui-text-ui-feature);
  --fui-section-title-font-variation-settings: var(--fui-text-ui-variation);
  --fui-action-border: var(--fui-border-default);
  --fui-action-border-color: transparent;
  --fui-action-rounded: var(--fui-radius-none);
  --fui-action-font-family: var(--fui-text-caption-family);
  --fui-action-font-size: var(--fui-text-caption-size);
  --fui-action-line-height: var(--fui-text-caption-line-height);
  --fui-action-font-weight: 600;
  --fui-action-letter-spacing: 0.1em;
  --fui-action-font-feature-settings: var(--fui-text-caption-feature);
  --fui-action-font-variation-settings: var(--fui-text-caption-variation);
  --fui-action-text-transform: uppercase;
  --fui-action-pressed-translate: 0 1px;
  --fui-button-border: var(--fui-border-default);
  --fui-button-border-color: transparent;
  --fui-button-rounded: var(--fui-radius-none);
  --fui-button-font-family: var(--fui-text-caption-family);
  --fui-button-font-size: var(--fui-text-caption-size);
  --fui-button-line-height: var(--fui-text-caption-line-height);
  --fui-button-font-weight: 600;
  --fui-button-letter-spacing: 0.1em;
  --fui-button-font-feature-settings: var(--fui-text-caption-feature);
  --fui-button-font-variation-settings: var(--fui-text-caption-variation);
  --fui-button-text-transform: uppercase;
  --fui-button-display: inline-flex;
  --fui-button-flex-shrink: 0;
  --fui-button-align-items: center;
  --fui-button-justify-content: center;
  --fui-button-pressed-translate: 0 1px;
  --fui-button-outline-background-color: transparent;
  --fui-button-link-text-decoration-line: underline;
  --fui-button-destructive-ring-color: var(--fui-destructive);
  --fui-button-destructive-ring-border-color: color-mix(in oklab, var(--fui-destructive) 40%, transparent);
  --fui-button-xs-height: calc(var(--fui-spacing) * 7);
  --fui-button-xs-padding-x: calc(var(--fui-spacing) * 3);
  --fui-button-xs-gap: calc(var(--fui-spacing) * 1);
  --fui-button-xs-icon-size: calc(var(--fui-spacing) * 3);
  --fui-button-xs-icon-start-padding-start: calc(var(--fui-spacing) * 2);
  --fui-button-xs-icon-end-padding-end: calc(var(--fui-spacing) * 2);
  --fui-button-sm-height: calc(var(--fui-spacing) * 9);
  --fui-button-sm-padding-x: calc(var(--fui-spacing) * 4);
  --fui-button-sm-gap: calc(var(--fui-spacing) * 1);
  --fui-button-sm-icon-size: calc(var(--fui-spacing) * 3.5);
  --fui-button-sm-icon-start-padding-start: calc(var(--fui-spacing) * 3);
  --fui-button-sm-icon-end-padding-end: calc(var(--fui-spacing) * 3);
  --fui-button-md-height: calc(var(--fui-spacing) * 10);
  --fui-button-md-padding-x: calc(var(--fui-spacing) * 6);
  --fui-button-md-gap: calc(var(--fui-spacing) * 1.5);
  --fui-button-md-icon-size: calc(var(--fui-spacing) * 3.5);
  --fui-button-md-icon-start-padding-start: calc(var(--fui-spacing) * 4);
  --fui-button-md-icon-end-padding-end: calc(var(--fui-spacing) * 4);
  --fui-button-lg-height: calc(var(--fui-spacing) * 11);
  --fui-button-lg-padding-x: calc(var(--fui-spacing) * 8);
  --fui-button-lg-gap: calc(var(--fui-spacing) * 1.5);
  --fui-button-lg-icon-size: calc(var(--fui-spacing) * 3.5);
  --fui-button-lg-icon-start-padding-start: calc(var(--fui-spacing) * 5);
  --fui-button-lg-icon-end-padding-end: calc(var(--fui-spacing) * 5);
  --fui-button-icon-xs-size: calc(var(--fui-spacing) * 7);
  --fui-button-icon-xs-icon-size: calc(var(--fui-spacing) * 3);
  --fui-button-icon-sm-size: calc(var(--fui-spacing) * 9);
  --fui-button-icon-sm-icon-size: calc(var(--fui-spacing) * 3.5);
  --fui-button-icon-md-size: calc(var(--fui-spacing) * 10);
  --fui-button-icon-md-icon-size: calc(var(--fui-spacing) * 3.5);
  --fui-button-icon-lg-size: calc(var(--fui-spacing) * 11);
  --fui-button-icon-lg-icon-size: calc(var(--fui-spacing) * 3.5);
  --fui-button-solid-primary-background-color: var(--fui-primary);
  --fui-button-solid-primary-text-color: var(--fui-primary-foreground);
  --fui-button-solid-primary-hover-background-color: var(--fui-primary-hover);
  --fui-button-solid-neutral-background-color: var(--fui-foreground);
  --fui-button-solid-neutral-text-color: var(--fui-background);
  --fui-button-solid-neutral-hover-background-color: var(--fui-foreground-hover);
  --fui-button-solid-destructive-background-color: var(--fui-destructive);
  --fui-button-solid-destructive-text-color: var(--fui-destructive-foreground);
  --fui-button-solid-destructive-hover-background-color: var(--fui-destructive-hover);
  --fui-button-solid-buy-background-color: var(--fui-buy);
  --fui-button-solid-buy-text-color: var(--fui-buy-foreground);
  --fui-button-solid-buy-hover-background-color: var(--fui-buy-hover);
  --fui-button-solid-checkout-background-color: var(--fui-checkout);
  --fui-button-solid-checkout-text-color: var(--fui-checkout-foreground);
  --fui-button-solid-checkout-hover-background-color: var(--fui-checkout-hover);
  --fui-button-solid-inverse-background-color: var(--fui-background);
  --fui-button-solid-inverse-text-color: var(--fui-foreground);
  --fui-button-solid-inverse-hover-background-color: var(--fui-muted);
  --fui-button-outline-primary-border-color: var(--fui-primary);
  --fui-button-outline-primary-text-color: var(--fui-primary);
  --fui-button-outline-primary-hover-background-color: color-mix(in oklab, var(--fui-primary) 10%, transparent);
  --fui-button-outline-primary-open-background-color: color-mix(in oklab, var(--fui-primary) 10%, transparent);
  --fui-button-outline-neutral-border-color: var(--fui-border);
  --fui-button-outline-neutral-hover-background-color: var(--fui-muted);
  --fui-button-outline-neutral-hover-text-color: var(--fui-foreground);
  --fui-button-outline-neutral-open-background-color: var(--fui-muted);
  --fui-button-outline-neutral-open-text-color: var(--fui-foreground);
  --fui-button-outline-destructive-border-color: var(--fui-destructive);
  --fui-button-outline-destructive-text-color: var(--fui-destructive);
  --fui-button-outline-destructive-hover-background-color: color-mix(in oklab, var(--fui-destructive) 10%, transparent);
  --fui-button-outline-destructive-open-background-color: color-mix(in oklab, var(--fui-destructive) 10%, transparent);
  --fui-button-outline-buy-border-color: var(--fui-buy);
  --fui-button-outline-buy-text-color: var(--fui-buy);
  --fui-button-outline-buy-hover-background-color: color-mix(in oklab, var(--fui-buy) 10%, transparent);
  --fui-button-outline-buy-open-background-color: color-mix(in oklab, var(--fui-buy) 10%, transparent);
  --fui-button-outline-checkout-border-color: var(--fui-checkout);
  --fui-button-outline-checkout-text-color: var(--fui-checkout);
  --fui-button-outline-checkout-hover-background-color: color-mix(in oklab, var(--fui-checkout) 10%, transparent);
  --fui-button-outline-checkout-open-background-color: color-mix(in oklab, var(--fui-checkout) 10%, transparent);
  --fui-button-outline-inverse-border-color: var(--fui-background);
  --fui-button-outline-inverse-text-color: var(--fui-background);
  --fui-button-outline-inverse-hover-background-color: color-mix(in oklab, var(--fui-background) 10%, transparent);
  --fui-button-outline-inverse-open-background-color: color-mix(in oklab, var(--fui-background) 10%, transparent);
  --fui-button-soft-primary-background-color: color-mix(in oklab, var(--fui-primary) 10%, transparent);
  --fui-button-soft-primary-text-color: var(--fui-primary);
  --fui-button-soft-primary-hover-background-color: var(--fui-primary);
  --fui-button-soft-primary-hover-text-color: var(--fui-primary-foreground);
  --fui-button-soft-neutral-background-color: var(--fui-secondary);
  --fui-button-soft-neutral-text-color: var(--fui-secondary-foreground);
  --fui-button-soft-neutral-hover-background-color: var(--fui-border);
  --fui-button-soft-neutral-open-background-color: var(--fui-secondary);
  --fui-button-soft-neutral-open-text-color: var(--fui-secondary-foreground);
  --fui-button-soft-destructive-background-color: color-mix(in oklab, var(--fui-destructive) 10%, transparent);
  --fui-button-soft-destructive-text-color: var(--fui-destructive);
  --fui-button-soft-destructive-hover-background-color: var(--fui-destructive);
  --fui-button-soft-destructive-hover-text-color: var(--fui-destructive-foreground);
  --fui-button-soft-buy-background-color: color-mix(in oklab, var(--fui-buy) 10%, transparent);
  --fui-button-soft-buy-text-color: var(--fui-buy);
  --fui-button-soft-buy-hover-background-color: var(--fui-buy);
  --fui-button-soft-buy-hover-text-color: var(--fui-buy-foreground);
  --fui-button-soft-checkout-background-color: color-mix(in oklab, var(--fui-checkout) 10%, transparent);
  --fui-button-soft-checkout-text-color: var(--fui-checkout);
  --fui-button-soft-checkout-hover-background-color: var(--fui-checkout);
  --fui-button-soft-checkout-hover-text-color: var(--fui-checkout-foreground);
  --fui-button-soft-inverse-background-color: color-mix(in oklab, var(--fui-background) 10%, transparent);
  --fui-button-soft-inverse-text-color: var(--fui-background);
  --fui-button-soft-inverse-hover-background-color: var(--fui-background);
  --fui-button-soft-inverse-hover-text-color: var(--fui-foreground);
  --fui-button-ghost-primary-text-color: var(--fui-primary);
  --fui-button-ghost-primary-hover-background-color: color-mix(in oklab, var(--fui-primary) 10%, transparent);
  --fui-button-ghost-primary-open-background-color: color-mix(in oklab, var(--fui-primary) 10%, transparent);
  --fui-button-ghost-neutral-hover-background-color: var(--fui-muted);
  --fui-button-ghost-neutral-hover-text-color: var(--fui-foreground);
  --fui-button-ghost-neutral-open-background-color: var(--fui-muted);
  --fui-button-ghost-neutral-open-text-color: var(--fui-foreground);
  --fui-button-ghost-destructive-text-color: var(--fui-destructive);
  --fui-button-ghost-destructive-hover-background-color: color-mix(in oklab, var(--fui-destructive) 10%, transparent);
  --fui-button-ghost-destructive-open-background-color: color-mix(in oklab, var(--fui-destructive) 10%, transparent);
  --fui-button-ghost-buy-text-color: var(--fui-buy);
  --fui-button-ghost-buy-hover-background-color: color-mix(in oklab, var(--fui-buy) 10%, transparent);
  --fui-button-ghost-buy-open-background-color: color-mix(in oklab, var(--fui-buy) 10%, transparent);
  --fui-button-ghost-checkout-text-color: var(--fui-checkout);
  --fui-button-ghost-checkout-hover-background-color: color-mix(in oklab, var(--fui-checkout) 10%, transparent);
  --fui-button-ghost-checkout-open-background-color: color-mix(in oklab, var(--fui-checkout) 10%, transparent);
  --fui-button-ghost-inverse-text-color: var(--fui-background);
  --fui-button-ghost-inverse-hover-background-color: color-mix(in oklab, var(--fui-background) 10%, transparent);
  --fui-button-ghost-inverse-open-background-color: color-mix(in oklab, var(--fui-background) 10%, transparent);
  --fui-button-link-primary-text-color: var(--fui-primary);
  --fui-button-link-destructive-text-color: var(--fui-destructive);
  --fui-button-link-buy-text-color: var(--fui-buy);
  --fui-button-link-checkout-text-color: var(--fui-checkout);
  --fui-button-link-inverse-text-color: var(--fui-background);
  --fui-badge-rounded: var(--fui-radius-none);
  --fui-badge-text-color: var(--fui-foreground);
  --fui-badge-font-family: var(--fui-text-micro-family);
  --fui-badge-font-size: var(--fui-text-micro-size);
  --fui-badge-line-height: var(--fui-text-micro-line-height);
  --fui-badge-font-weight: 600;
  --fui-badge-letter-spacing: 0.1em;
  --fui-badge-font-feature-settings: var(--fui-text-micro-feature);
  --fui-badge-font-variation-settings: var(--fui-text-micro-variation);
  --fui-badge-text-transform: uppercase;
  --fui-badge-gap: calc(var(--fui-spacing) * 1.5);
  --fui-badge-display: inline-flex;
  --fui-badge-width: fit-content;
  --fui-badge-flex-shrink: 0;
  --fui-badge-align-items: center;
  --fui-badge-justify-content: center;
  --fui-badge-focus-outline: var(--fui-ring-wide);
  --fui-badge-focus-outline-offset: var(--fui-ring-wide-offset);
  --fui-badge-focus-border-color: var(--fui-ring);
  --fui-badge-focus-outline-color: var(--fui-ring);
  --fui-badge-icon-size: calc(var(--fui-spacing) * 3);
  --fui-badge-neutral-text-color: var(--fui-foreground);
  --fui-badge-neutral-hover-text-color: color-mix(in oklab, var(--fui-foreground) 70%, transparent);
  --fui-badge-primary-background-color: var(--fui-primary);
  --fui-badge-primary-text-color: var(--fui-primary-foreground);
  --fui-badge-info-background-color: var(--fui-info);
  --fui-badge-info-text-color: var(--fui-info-foreground);
  --fui-badge-success-background-color: var(--fui-positive);
  --fui-badge-success-text-color: var(--fui-positive-foreground);
  --fui-badge-warning-background-color: var(--fui-warning);
  --fui-badge-warning-text-color: var(--fui-warning-foreground);
  --fui-badge-error-background-color: var(--fui-destructive);
  --fui-badge-error-text-color: var(--fui-destructive-foreground);
  --fui-badge-error-focus-outline-color: var(--fui-destructive);
  --fui-badge-promo-background-color: var(--fui-promo);
  --fui-badge-promo-text-color: var(--fui-promo-foreground);
  --fui-badge-discount-background-color: var(--fui-discount);
  --fui-badge-discount-text-color: var(--fui-discount-foreground);
  --fui-badge-new-background-color: var(--fui-new);
  --fui-badge-new-text-color: var(--fui-new-foreground);
  --fui-badge-price-background-color: var(--fui-price);
  --fui-badge-price-text-color: var(--fui-price-foreground);
  --fui-badge-sm-padding-x: calc(var(--fui-spacing) * 2);
  --fui-badge-sm-padding-y: calc(var(--fui-spacing) * 0.5);
  --fui-badge-md-padding-x: calc(var(--fui-spacing) * 2.5);
  --fui-badge-md-padding-y: calc(var(--fui-spacing) * 1);
  --fui-badge-md-font-family: var(--fui-text-caption-family);
  --fui-badge-md-font-size: var(--fui-text-caption-size);
  --fui-badge-md-line-height: var(--fui-text-caption-line-height);
  --fui-badge-md-font-weight: 600;
  --fui-badge-md-letter-spacing: 0.1em;
  --fui-badge-md-font-feature-settings: var(--fui-text-caption-feature);
  --fui-badge-md-font-variation-settings: var(--fui-text-caption-variation);
  --fui-badge-lg-padding-x: calc(var(--fui-spacing) * 3);
  --fui-badge-lg-padding-y: calc(var(--fui-spacing) * 1.5);
  --fui-badge-lg-font-family: var(--fui-text-caption-family);
  --fui-badge-lg-font-size: var(--fui-text-caption-size);
  --fui-badge-lg-line-height: var(--fui-text-caption-line-height);
  --fui-badge-lg-font-weight: 600;
  --fui-badge-lg-letter-spacing: 0.1em;
  --fui-badge-lg-font-feature-settings: var(--fui-text-caption-feature);
  --fui-badge-lg-font-variation-settings: var(--fui-text-caption-variation);
  --fui-badge-neutral-sm-padding: calc(var(--fui-spacing) * 0);
  --fui-badge-neutral-md-padding: calc(var(--fui-spacing) * 0);
  --fui-badge-neutral-lg-padding: calc(var(--fui-spacing) * 0);
  --fui-input-background-color: transparent;
  --fui-input-border: var(--fui-border-default);
  --fui-input-border-color: transparent;
  --fui-input-border-bottom-color: var(--fui-input);
  --fui-input-rounded: var(--fui-radius-none);
  --fui-input-font-family: var(--fui-text-control-family);
  --fui-input-font-size: var(--fui-text-control-size);
  --fui-input-line-height: var(--fui-text-control-line-height);
  --fui-input-font-weight: var(--fui-text-control-weight);
  --fui-input-letter-spacing: var(--fui-text-control-tracking);
  --fui-input-font-feature-settings: var(--fui-text-control-feature);
  --fui-input-font-variation-settings: var(--fui-text-control-variation);
  --fui-input-placeholder-color: var(--fui-muted-foreground);
  --fui-input-height: calc(var(--fui-spacing) * 10);
  --fui-input-padding-x: calc(var(--fui-spacing) * 0);
  --fui-input-padding-y: calc(var(--fui-spacing) * 1);
  --fui-input-width: 100%;
  --fui-input-min-width: calc(var(--fui-spacing) * 0);
  --fui-input-focus-border-bottom: var(--fui-border-focus);
  --fui-input-invalid-border-bottom-color: var(--fui-destructive);
  --fui-input-file-background-color: transparent;
  --fui-input-file-border: none;
  --fui-input-file-text-color: var(--fui-foreground);
  --fui-input-file-font-family: var(--fui-text-ui-family);
  --fui-input-file-font-size: var(--fui-text-ui-size);
  --fui-input-file-line-height: var(--fui-text-ui-line-height);
  --fui-input-file-font-weight: var(--fui-text-ui-weight);
  --fui-input-file-letter-spacing: var(--fui-text-ui-tracking);
  --fui-input-file-font-feature-settings: var(--fui-text-ui-feature);
  --fui-input-file-font-variation-settings: var(--fui-text-ui-variation);
  --fui-input-file-display: inline-flex;
  --fui-input-sm-height: calc(var(--fui-spacing) * 9);
  --fui-textarea-background-color: transparent;
  --fui-textarea-border: var(--fui-border-default);
  --fui-textarea-border-color: transparent;
  --fui-textarea-border-bottom-color: var(--fui-input);
  --fui-textarea-rounded: var(--fui-radius-none);
  --fui-textarea-font-family: var(--fui-text-control-family);
  --fui-textarea-font-size: var(--fui-text-control-size);
  --fui-textarea-line-height: var(--fui-text-control-line-height);
  --fui-textarea-font-weight: var(--fui-text-control-weight);
  --fui-textarea-letter-spacing: var(--fui-text-control-tracking);
  --fui-textarea-font-feature-settings: var(--fui-text-control-feature);
  --fui-textarea-font-variation-settings: var(--fui-text-control-variation);
  --fui-textarea-placeholder-color: var(--fui-muted-foreground);
  --fui-textarea-min-height: calc(var(--fui-spacing) * 16);
  --fui-textarea-padding-x: calc(var(--fui-spacing) * 0);
  --fui-textarea-padding-y: calc(var(--fui-spacing) * 3);
  --fui-textarea-display: flex;
  --fui-textarea-width: 100%;
  --fui-textarea-focus-border-bottom: var(--fui-border-focus);
  --fui-textarea-invalid-border-bottom-color: var(--fui-destructive);
  --fui-label-root-font-family: var(--fui-text-caption-family);
  --fui-label-root-font-size: var(--fui-text-caption-size);
  --fui-label-root-line-height: var(--fui-text-caption-line-height);
  --fui-label-root-font-weight: 600;
  --fui-label-root-letter-spacing: 0.025em;
  --fui-label-root-font-feature-settings: var(--fui-text-caption-feature);
  --fui-label-root-font-variation-settings: var(--fui-text-caption-variation);
  --fui-label-root-text-transform: uppercase;
  --fui-label-root-gap: calc(var(--fui-spacing) * 2);
  --fui-label-root-display: flex;
  --fui-label-root-align-items: center;
  --fui-kbd-background-color: var(--fui-muted);
  --fui-kbd-text-color: var(--fui-muted-foreground);
  --fui-kbd-rounded: var(--fui-radius-none);
  --fui-kbd-font-family: var(--fui-text-caption-family);
  --fui-kbd-font-size: var(--fui-text-caption-size);
  --fui-kbd-line-height: var(--fui-text-caption-line-height);
  --fui-kbd-font-weight: var(--fui-text-caption-weight);
  --fui-kbd-letter-spacing: var(--fui-text-caption-tracking);
  --fui-kbd-font-feature-settings: var(--fui-text-caption-feature);
  --fui-kbd-font-variation-settings: var(--fui-text-caption-variation);
  --fui-kbd-height: calc(var(--fui-spacing) * 5.5);
  --fui-kbd-min-width: calc(var(--fui-spacing) * 5.5);
  --fui-kbd-padding-x: calc(var(--fui-spacing) * 1.5);
  --fui-kbd-gap: calc(var(--fui-spacing) * 1);
  --fui-kbd-display: inline-flex;
  --fui-kbd-width: fit-content;
  --fui-kbd-align-items: center;
  --fui-kbd-justify-content: center;
  --fui-kbd-icon-size: calc(var(--fui-spacing) * 3);
  --fui-kbd-group-display: inline-flex;
  --fui-kbd-group-align-items: center;
  --fui-kbd-group-gap: calc(var(--fui-spacing) * 1);
  --fui-checkbox-background-color: transparent;
  --fui-checkbox-border: var(--fui-border-default);
  --fui-checkbox-border-color: var(--fui-input);
  --fui-checkbox-rounded: var(--fui-radius-none);
  --fui-checkbox-size: calc(var(--fui-spacing) * 4.5);
  --fui-checkbox-display: flex;
  --fui-checkbox-flex-shrink: 0;
  --fui-checkbox-align-items: center;
  --fui-checkbox-justify-content: center;
  --fui-checkbox-checked-background-color: var(--fui-primary);
  --fui-checkbox-checked-text-color: var(--fui-primary-foreground);
  --fui-checkbox-checked-border-color: var(--fui-primary);
  --fui-checkbox-icon-size: calc(var(--fui-spacing) * 3.5);
  --fui-radio-group-gap: calc(var(--fui-spacing) * 3);
  --fui-radio-group-display: grid;
  --fui-radio-group-width: 100%;
  --fui-radio-group-item-background-color: transparent;
  --fui-radio-group-item-border: var(--fui-border-default);
  --fui-radio-group-item-border-color: var(--fui-input);
  --fui-radio-group-item-rounded: var(--fui-radius-full);
  --fui-radio-group-item-size: calc(var(--fui-spacing) * 4.5);
  --fui-radio-group-item-display: flex;
  --fui-radio-group-item-flex-shrink: 0;
  --fui-radio-group-item-checked-border-color: var(--fui-foreground);
  --fui-radio-group-item-checked-icon-color: var(--fui-foreground);
  --fui-radio-group-item-icon-size: calc(var(--fui-spacing) * 2);
  --fui-radio-accordion-display: flex;
  --fui-radio-accordion-width: 100%;
  --fui-radio-accordion-flex-direction: column;
  --fui-radio-accordion-outline-gap: calc(var(--fui-spacing) * 3);
  --fui-radio-accordion-item-gap: calc(var(--fui-spacing) * 0);
  --fui-radio-accordion-item-display: flex;
  --fui-radio-accordion-item-width: 100%;
  --fui-radio-accordion-item-flex-direction: column;
  --fui-radio-accordion-item-plain-border-bottom: var(--fui-border-default);
  --fui-radio-accordion-item-outline-border: var(--fui-border-default);
  --fui-radio-accordion-item-outline-border-color: var(--fui-border);
  --fui-radio-accordion-item-outline-rounded: var(--fui-radius-md);
  --fui-radio-accordion-item-outline-padding-x: calc(var(--fui-spacing) * 4);
  --fui-radio-accordion-item-outline-checked-border-color: var(--fui-active);
  --fui-radio-accordion-trigger-font-family: var(--fui-text-ui-family);
  --fui-radio-accordion-trigger-font-size: var(--fui-text-ui-size);
  --fui-radio-accordion-trigger-line-height: var(--fui-text-ui-line-height);
  --fui-radio-accordion-trigger-font-weight: 600;
  --fui-radio-accordion-trigger-letter-spacing: var(--fui-text-ui-tracking);
  --fui-radio-accordion-trigger-font-feature-settings: var(--fui-text-ui-feature);
  --fui-radio-accordion-trigger-font-variation-settings: var(--fui-text-ui-variation);
  --fui-radio-accordion-trigger-gap: calc(var(--fui-spacing) * 4);
  --fui-radio-accordion-trigger-padding-y: calc(var(--fui-spacing) * 4);
  --fui-radio-accordion-trigger-display: flex;
  --fui-radio-accordion-trigger-width: 100%;
  --fui-radio-accordion-trigger-align-items: center;
  --fui-radio-accordion-trigger-text-align: start;
  --fui-radio-accordion-content-padding-start: calc(var(--fui-spacing) * 0);
  --fui-radio-accordion-content-font-family: var(--fui-text-small-family);
  --fui-radio-accordion-content-font-size: var(--fui-text-small-size);
  --fui-radio-accordion-content-line-height: var(--fui-text-small-line-height);
  --fui-radio-accordion-content-font-weight: var(--fui-text-small-weight);
  --fui-radio-accordion-content-letter-spacing: var(--fui-text-small-tracking);
  --fui-radio-accordion-content-font-feature-settings: var(--fui-text-small-feature);
  --fui-radio-accordion-content-font-variation-settings: var(--fui-text-small-variation);
  --fui-radio-accordion-content-padding-bottom: calc(var(--fui-spacing) * 4);
  --fui-radio-accordion-content-md-padding-start: calc(var(--fui-spacing) * 10);
  --fui-radio-accordion-indicator-background-color: transparent;
  --fui-radio-accordion-indicator-border: var(--fui-border-default);
  --fui-radio-accordion-indicator-border-color: var(--fui-input);
  --fui-radio-accordion-indicator-rounded: var(--fui-radius-full);
  --fui-radio-accordion-indicator-size: calc(var(--fui-spacing) * 6);
  --fui-radio-accordion-indicator-display: flex;
  --fui-radio-accordion-indicator-flex-shrink: 0;
  --fui-radio-accordion-indicator-align-items: center;
  --fui-radio-accordion-indicator-justify-content: center;
  --fui-radio-accordion-indicator-checked-border-color: var(--fui-foreground);
  --fui-radio-accordion-indicator-checked-icon-color: var(--fui-foreground);
  --fui-radio-accordion-indicator-icon-size: calc(var(--fui-spacing) * 3.5);
  --fui-switch-background-color: var(--fui-input);
  --fui-switch-border: var(--fui-border-default);
  --fui-switch-border-color: color-mix(in oklab, var(--fui-input) 50%, transparent);
  --fui-switch-rounded: var(--fui-radius-none);
  --fui-switch-display: inline-flex;
  --fui-switch-flex-shrink: 0;
  --fui-switch-align-items: center;
  --fui-switch-checked-background-color: var(--fui-primary);
  --fui-switch-checked-border-color: var(--fui-primary);
  --fui-switch-md-height: calc(var(--fui-spacing) * 4.5);
  --fui-switch-md-width: calc(var(--fui-spacing) * 8.25);
  --fui-switch-sm-height: calc(var(--fui-spacing) * 3.5);
  --fui-switch-sm-width: calc(var(--fui-spacing) * 6.25);
  --fui-switch-thumb-background-color: var(--fui-background);
  --fui-switch-thumb-rounded: var(--fui-radius-none);
  --fui-switch-thumb-margin-start: calc(var(--fui-spacing) * 0.5);
  --fui-switch-thumb-translate: calc(-1 * 1px);
  --fui-switch-thumb-checked-translate: 100%;
  --fui-switch-thumb-md-size: calc(var(--fui-spacing) * 3.5);
  --fui-switch-thumb-sm-size: calc(var(--fui-spacing) * 2.5);
  --fui-slider-control-display: flex;
  --fui-slider-control-width: 100%;
  --fui-slider-control-align-items: center;
  --fui-slider-track-rounded: var(--fui-radius-none);
  --fui-slider-track-background-color: color-mix(in oklab, var(--fui-input) 50%, transparent);
  --fui-slider-track-size: calc(var(--fui-spacing) * 0.5);
  --fui-slider-thumb-background-color: var(--fui-primary);
  --fui-slider-thumb-rounded: var(--fui-radius-none);
  --fui-slider-thumb-size: calc(var(--fui-spacing) * 3);
  --fui-slider-thumb-hover-outline: var(--fui-ring-focus);
  --fui-slider-thumb-hover-outline-offset: var(--fui-ring-focus-offset);
  --fui-slider-thumb-hover-outline-color: var(--fui-ring);
  --fui-slider-thumb-focus-outline: var(--fui-ring-focus);
  --fui-slider-thumb-focus-outline-offset: var(--fui-ring-focus-offset);
  --fui-slider-thumb-focus-outline-color: var(--fui-ring);
  --fui-slider-legend-margin-top: calc(var(--fui-spacing) * 2);
  --fui-slider-legend-text-color: var(--fui-muted-foreground);
  --fui-slider-legend-font-family: var(--fui-text-caption-family);
  --fui-slider-legend-font-size: var(--fui-text-caption-size);
  --fui-slider-legend-line-height: var(--fui-text-caption-line-height);
  --fui-slider-legend-font-weight: var(--fui-text-caption-weight);
  --fui-slider-legend-letter-spacing: 0.025em;
  --fui-slider-legend-font-feature-settings: var(--fui-text-caption-feature);
  --fui-slider-legend-font-variation-settings: var(--fui-text-caption-variation);
  --fui-slider-range-background-color: var(--fui-primary);
  --fui-toggle-rounded: var(--fui-radius-none);
  --fui-toggle-font-family: var(--fui-text-caption-family);
  --fui-toggle-font-size: var(--fui-text-caption-size);
  --fui-toggle-line-height: var(--fui-text-caption-line-height);
  --fui-toggle-font-weight: 600;
  --fui-toggle-letter-spacing: 0.1em;
  --fui-toggle-font-feature-settings: var(--fui-text-caption-feature);
  --fui-toggle-font-variation-settings: var(--fui-text-caption-variation);
  --fui-toggle-text-transform: uppercase;
  --fui-toggle-gap: calc(var(--fui-spacing) * 1.5);
  --fui-toggle-border: var(--fui-border-default);
  --fui-toggle-border-color: transparent;
  --fui-toggle-display: inline-flex;
  --fui-toggle-align-items: center;
  --fui-toggle-justify-content: center;
  --fui-toggle-hover-border-color: var(--fui-input);
  --fui-toggle-checked-background-color: var(--fui-muted);
  --fui-toggle-checked-border-color: var(--fui-foreground);
  --fui-toggle-invalid-border-color: var(--fui-destructive);
  --fui-toggle-invalid-outline-color: color-mix(in oklab, var(--fui-destructive) 20%, transparent);
  --fui-toggle-icon-size: calc(var(--fui-spacing) * 3.5);
  --fui-toggle-default-background-color: transparent;
  --fui-toggle-outline-background-color: transparent;
  --fui-toggle-outline-border: var(--fui-border-default);
  --fui-toggle-outline-border-color: var(--fui-input);
  --fui-toggle-outline-hover-border-color: var(--fui-muted-foreground);
  --fui-toggle-outline-checked-border-color: var(--fui-foreground);
  --fui-toggle-md-height: calc(var(--fui-spacing) * 10);
  --fui-toggle-md-min-width: calc(var(--fui-spacing) * 10);
  --fui-toggle-md-padding-x: calc(var(--fui-spacing) * 6);
  --fui-toggle-md-icon-start-padding-start: calc(var(--fui-spacing) * 4);
  --fui-toggle-md-icon-end-padding-end: calc(var(--fui-spacing) * 4);
  --fui-toggle-sm-height: calc(var(--fui-spacing) * 9);
  --fui-toggle-sm-min-width: calc(var(--fui-spacing) * 9);
  --fui-toggle-sm-padding-x: calc(var(--fui-spacing) * 4);
  --fui-toggle-sm-icon-start-padding-start: calc(var(--fui-spacing) * 3);
  --fui-toggle-sm-icon-end-padding-end: calc(var(--fui-spacing) * 3);
  --fui-toggle-lg-height: calc(var(--fui-spacing) * 11);
  --fui-toggle-lg-min-width: calc(var(--fui-spacing) * 11);
  --fui-toggle-lg-padding-x: calc(var(--fui-spacing) * 8);
  --fui-toggle-lg-icon-start-padding-start: calc(var(--fui-spacing) * 5);
  --fui-toggle-lg-icon-end-padding-end: calc(var(--fui-spacing) * 5);
  --fui-toggle-icon-sm-size: calc(var(--fui-spacing) * 9);
  --fui-toggle-icon-md-size: calc(var(--fui-spacing) * 10);
  --fui-toggle-icon-lg-size: calc(var(--fui-spacing) * 11);
  --fui-toggle-group-display: flex;
  --fui-toggle-group-width: fit-content;
  --fui-toggle-group-flex-direction: row;
  --fui-toggle-group-align-items: center;
  --fui-toggle-group-none-gap: calc(var(--fui-spacing) * 0);
  --fui-toggle-group-xs-gap: calc(var(--fui-spacing) * 1);
  --fui-toggle-group-sm-gap: calc(var(--fui-spacing) * 2);
  --fui-toggle-group-md-gap: calc(var(--fui-spacing) * 3);
  --fui-toggle-group-lg-gap: calc(var(--fui-spacing) * 4);
  --fui-toggle-group-item-flex-shrink: 0;
  --fui-button-group-text-background-color: transparent;
  --fui-button-group-text-border: var(--fui-border-default);
  --fui-button-group-text-border-color: transparent;
  --fui-button-group-text-border-bottom-color: var(--fui-input);
  --fui-button-group-text-font-family: var(--fui-text-caption-family);
  --fui-button-group-text-font-size: var(--fui-text-caption-size);
  --fui-button-group-text-line-height: var(--fui-text-caption-line-height);
  --fui-button-group-text-font-weight: 600;
  --fui-button-group-text-letter-spacing: var(--fui-text-caption-tracking);
  --fui-button-group-text-font-feature-settings: var(--fui-text-caption-feature);
  --fui-button-group-text-font-variation-settings: var(--fui-text-caption-variation);
  --fui-button-group-text-text-transform: uppercase;
  --fui-button-group-text-gap: calc(var(--fui-spacing) * 2);
  --fui-button-group-text-padding-x: calc(var(--fui-spacing) * 2.5);
  --fui-button-group-text-display: flex;
  --fui-button-group-text-align-items: center;
  --fui-button-group-text-icon-size: calc(var(--fui-spacing) * 3.5);
  --fui-button-group-separator-background-color: var(--fui-input);
  --fui-button-group-separator-size: 1px;
  --fui-button-group-separator-flex-shrink: 0;
  --fui-button-group-separator-align-self: stretch;
  --fui-button-group-separator-vertical-margin-y: 1px;
  --fui-button-group-separator-vertical-height: auto;
  --fui-button-group-separator-horizontal-margin-x: 1px;
  --fui-button-group-separator-horizontal-width: auto;
  --fui-button-group-display: flex;
  --fui-button-group-width: fit-content;
  --fui-button-group-align-items: stretch;
  --fui-field-label-font-family: var(--fui-text-caption-family);
  --fui-field-label-font-size: var(--fui-text-caption-size);
  --fui-field-label-line-height: 1.375;
  --fui-field-label-font-weight: 600;
  --fui-field-label-letter-spacing: 0.025em;
  --fui-field-label-font-feature-settings: var(--fui-text-caption-feature);
  --fui-field-label-font-variation-settings: var(--fui-text-caption-variation);
  --fui-field-label-text-transform: uppercase;
  --fui-field-label-gap: calc(var(--fui-spacing) * 2);
  --fui-field-label-display: flex;
  --fui-field-label-width: fit-content;
  --fui-field-label-invalid-text-color: var(--fui-destructive);
  --fui-field-label-card-width: 100%;
  --fui-field-label-card-flex-direction: column;
  --fui-field-label-card-border: var(--fui-border-default);
  --fui-field-label-card-rounded: var(--fui-radius-none);
  --fui-field-label-card-checked-within-background-color: color-mix(in oklab, var(--fui-primary) 5%, transparent);
  --fui-field-label-card-checked-within-border-color: color-mix(in oklab, var(--fui-primary) 30%, transparent);
  --fui-field-label-beside-font-family: var(--fui-text-small-family);
  --fui-field-label-beside-font-size: var(--fui-text-small-size);
  --fui-field-label-beside-line-height: var(--fui-text-small-line-height);
  --fui-field-label-beside-font-weight: 400;
  --fui-field-label-beside-letter-spacing: 0em;
  --fui-field-label-beside-font-feature-settings: var(--fui-text-small-feature);
  --fui-field-label-beside-font-variation-settings: var(--fui-text-small-variation);
  --fui-field-label-beside-text-transform: none;
  --fui-field-description-text-color: var(--fui-muted-foreground);
  --fui-field-description-font-family: var(--fui-text-small-family);
  --fui-field-description-font-size: var(--fui-text-small-size);
  --fui-field-description-line-height: 1.5;
  --fui-field-description-font-weight: var(--fui-text-small-weight);
  --fui-field-description-letter-spacing: 0em;
  --fui-field-description-font-feature-settings: var(--fui-text-small-feature);
  --fui-field-description-font-variation-settings: var(--fui-text-small-variation);
  --fui-field-description-text-align: start;
  --fui-field-description-text-transform: none;
  --fui-field-description-link-text-decoration-line: underline;
  --fui-field-description-link-hover-text-color: var(--fui-primary);
  --fui-field-error-text-color: var(--fui-destructive);
  --fui-field-error-font-family: var(--fui-text-small-family);
  --fui-field-error-font-size: var(--fui-text-small-size);
  --fui-field-error-line-height: var(--fui-text-small-line-height);
  --fui-field-error-font-weight: var(--fui-text-small-weight);
  --fui-field-error-letter-spacing: var(--fui-text-small-tracking);
  --fui-field-error-font-feature-settings: var(--fui-text-small-feature);
  --fui-field-error-font-variation-settings: var(--fui-text-small-variation);
  --fui-field-legend-margin-bottom: calc(var(--fui-spacing) * 3);
  --fui-field-legend-legend-font-family: var(--fui-text-body-family);
  --fui-field-legend-legend-font-size: var(--fui-text-body-size);
  --fui-field-legend-legend-line-height: var(--fui-text-body-line-height);
  --fui-field-legend-legend-font-weight: 500;
  --fui-field-legend-legend-letter-spacing: var(--fui-text-body-tracking);
  --fui-field-legend-legend-font-feature-settings: var(--fui-text-body-feature);
  --fui-field-legend-legend-font-variation-settings: var(--fui-text-body-variation);
  --fui-field-legend-label-font-family: var(--fui-text-caption-family);
  --fui-field-legend-label-font-size: var(--fui-text-caption-size);
  --fui-field-legend-label-line-height: var(--fui-text-caption-line-height);
  --fui-field-legend-label-font-weight: 600;
  --fui-field-legend-label-letter-spacing: var(--fui-text-caption-tracking);
  --fui-field-legend-label-font-feature-settings: var(--fui-text-caption-feature);
  --fui-field-legend-label-font-variation-settings: var(--fui-text-caption-variation);
  --fui-field-legend-label-text-transform: uppercase;
  --fui-field-separator-bleed-y: calc(-1 * calc(var(--fui-spacing) * 2));
  --fui-field-separator-font-family: var(--fui-text-small-family);
  --fui-field-separator-font-size: var(--fui-text-small-size);
  --fui-field-separator-line-height: var(--fui-text-small-line-height);
  --fui-field-separator-font-weight: var(--fui-text-small-weight);
  --fui-field-separator-letter-spacing: var(--fui-text-small-tracking);
  --fui-field-separator-font-feature-settings: var(--fui-text-small-feature);
  --fui-field-separator-font-variation-settings: var(--fui-text-small-variation);
  --fui-field-separator-height: calc(var(--fui-spacing) * 5);
  --fui-field-separator-content-background-color: var(--fui-background);
  --fui-field-separator-content-text-color: var(--fui-muted-foreground);
  --fui-field-separator-content-padding-x: calc(var(--fui-spacing) * 2);
  --fui-field-display: flex;
  --fui-field-width: 100%;
  --fui-field-gap: calc(var(--fui-spacing) * 3);
  --fui-field-content-display: flex;
  --fui-field-content-flex: 1;
  --fui-field-content-flex-direction: column;
  --fui-field-content-gap: calc(var(--fui-spacing) * 1);
  --fui-field-group-display: flex;
  --fui-field-group-width: 100%;
  --fui-field-group-flex-direction: column;
  --fui-field-group-gap: calc(var(--fui-spacing) * 10);
  --fui-field-group-checkboxes-gap: calc(var(--fui-spacing) * 3);
  --fui-field-set-display: flex;
  --fui-field-set-flex-direction: column;
  --fui-field-set-gap: calc(var(--fui-spacing) * 6);
  --fui-form-gap: calc(var(--fui-spacing) * 6);
  --fui-form-display: flex;
  --fui-form-width: 100%;
  --fui-form-flex-direction: column;
  --fui-native-select-background-color: transparent;
  --fui-native-select-border: var(--fui-border-default);
  --fui-native-select-border-color: transparent;
  --fui-native-select-border-bottom-color: var(--fui-input);
  --fui-native-select-rounded: var(--fui-radius-none);
  --fui-native-select-placeholder-color: var(--fui-muted-foreground);
  --fui-native-select-font-family: var(--fui-text-small-family);
  --fui-native-select-font-size: var(--fui-text-small-size);
  --fui-native-select-line-height: var(--fui-text-small-line-height);
  --fui-native-select-font-weight: var(--fui-text-small-weight);
  --fui-native-select-letter-spacing: var(--fui-text-small-tracking);
  --fui-native-select-font-feature-settings: var(--fui-text-small-feature);
  --fui-native-select-font-variation-settings: var(--fui-text-small-variation);
  --fui-native-select-padding-y: calc(var(--fui-spacing) * 2);
  --fui-native-select-padding-start: calc(var(--fui-spacing) * 0);
  --fui-native-select-padding-end: calc(var(--fui-spacing) * 8);
  --fui-native-select-focus-border-bottom: var(--fui-border-focus);
  --fui-native-select-placeholder-shown-text-color: var(--fui-muted-foreground);
  --fui-native-select-invalid-border-bottom-color: var(--fui-destructive);
  --fui-native-select-file-background-color: transparent;
  --fui-native-select-file-border: none;
  --fui-native-select-file-text-color: var(--fui-foreground);
  --fui-native-select-file-font-family: var(--fui-text-ui-family);
  --fui-native-select-file-font-size: var(--fui-text-ui-size);
  --fui-native-select-file-line-height: var(--fui-text-ui-line-height);
  --fui-native-select-file-font-weight: var(--fui-text-ui-weight);
  --fui-native-select-file-letter-spacing: var(--fui-text-ui-tracking);
  --fui-native-select-file-font-feature-settings: var(--fui-text-ui-feature);
  --fui-native-select-file-font-variation-settings: var(--fui-text-ui-variation);
  --fui-native-select-md-height: calc(var(--fui-spacing) * 10);
  --fui-native-select-sm-height: calc(var(--fui-spacing) * 9);
  --fui-native-select-option-text-color: var(--fui-foreground);
  --fui-native-select-chevron-text-color: var(--fui-muted-foreground);
  --fui-native-select-chevron-size: calc(var(--fui-spacing) * 3.5);
  --fui-native-select-root-width: fit-content;
  --fui-select-trigger-background-color: transparent;
  --fui-select-trigger-border: var(--fui-border-default);
  --fui-select-trigger-border-color: transparent;
  --fui-select-trigger-border-bottom-color: var(--fui-input);
  --fui-select-trigger-rounded: var(--fui-radius-none);
  --fui-select-trigger-placeholder-color: var(--fui-muted-foreground);
  --fui-select-trigger-font-family: var(--fui-text-small-family);
  --fui-select-trigger-font-size: var(--fui-text-small-size);
  --fui-select-trigger-line-height: var(--fui-text-small-line-height);
  --fui-select-trigger-font-weight: var(--fui-text-small-weight);
  --fui-select-trigger-letter-spacing: var(--fui-text-small-tracking);
  --fui-select-trigger-font-feature-settings: var(--fui-text-small-feature);
  --fui-select-trigger-font-variation-settings: var(--fui-text-small-variation);
  --fui-select-trigger-gap: calc(var(--fui-spacing) * 1.5);
  --fui-select-trigger-padding-x: calc(var(--fui-spacing) * 0);
  --fui-select-trigger-padding-y: calc(var(--fui-spacing) * 2);
  --fui-select-trigger-display: flex;
  --fui-select-trigger-width: fit-content;
  --fui-select-trigger-align-items: center;
  --fui-select-trigger-justify-content: space-between;
  --fui-select-trigger-focus-border-bottom: var(--fui-border-focus);
  --fui-select-trigger-invalid-border-bottom-color: var(--fui-destructive);
  --fui-select-trigger-file-background-color: transparent;
  --fui-select-trigger-file-border: none;
  --fui-select-trigger-file-text-color: var(--fui-foreground);
  --fui-select-trigger-file-font-family: var(--fui-text-ui-family);
  --fui-select-trigger-file-font-size: var(--fui-text-ui-size);
  --fui-select-trigger-file-line-height: var(--fui-text-ui-line-height);
  --fui-select-trigger-file-font-weight: var(--fui-text-ui-weight);
  --fui-select-trigger-file-letter-spacing: var(--fui-text-ui-tracking);
  --fui-select-trigger-file-font-feature-settings: var(--fui-text-ui-feature);
  --fui-select-trigger-file-font-variation-settings: var(--fui-text-ui-variation);
  --fui-select-trigger-icon-size: calc(var(--fui-spacing) * 3.5);
  --fui-select-trigger-md-height: calc(var(--fui-spacing) * 10);
  --fui-select-trigger-sm-height: calc(var(--fui-spacing) * 9);
  --fui-select-value-align-items: center;
  --fui-select-value-gap: calc(var(--fui-spacing) * 1.5);
  --fui-select-value-placeholder-text-color: var(--fui-muted-foreground);
  --fui-select-chevron-text-color: var(--fui-muted-foreground);
  --fui-select-chevron-size: calc(var(--fui-spacing) * 3.5);
  --fui-select-content-outline: var(--fui-ring-hairline);
  --fui-select-content-outline-offset: var(--fui-ring-hairline-offset);
  --fui-select-content-background-color: var(--fui-background);
  --fui-select-content-text-color: var(--fui-foreground);
  --fui-select-content-outline-color: color-mix(in oklab, var(--fui-foreground) 20%, transparent);
  --fui-select-content-rounded: var(--fui-radius-none);
  --fui-select-content-shadow: var(--fui-shadow-md);
  --fui-select-content-min-width: calc(var(--fui-spacing) * 36);
  --fui-select-item-rounded: var(--fui-radius-none);
  --fui-select-item-font-family: var(--fui-text-small-family);
  --fui-select-item-font-size: var(--fui-text-small-size);
  --fui-select-item-line-height: var(--fui-text-small-line-height);
  --fui-select-item-font-weight: var(--fui-text-small-weight);
  --fui-select-item-letter-spacing: var(--fui-text-small-tracking);
  --fui-select-item-font-feature-settings: var(--fui-text-small-feature);
  --fui-select-item-font-variation-settings: var(--fui-text-small-variation);
  --fui-select-item-gap: calc(var(--fui-spacing) * 2.5);
  --fui-select-item-padding-y: calc(var(--fui-spacing) * 2);
  --fui-select-item-padding-start: calc(var(--fui-spacing) * 3);
  --fui-select-item-padding-end: calc(var(--fui-spacing) * 8);
  --fui-select-item-display: flex;
  --fui-select-item-width: 100%;
  --fui-select-item-align-items: center;
  --fui-select-item-highlighted-background-color: var(--fui-accent);
  --fui-select-item-highlighted-text-color: var(--fui-accent-foreground);
  --fui-select-item-icon-size: calc(var(--fui-spacing) * 3.5);
  --fui-select-item-indicator-size: calc(var(--fui-spacing) * 4);
  --fui-select-label-text-color: var(--fui-muted-foreground);
  --fui-select-label-font-family: var(--fui-text-caption-family);
  --fui-select-label-font-size: var(--fui-text-caption-size);
  --fui-select-label-line-height: var(--fui-text-caption-line-height);
  --fui-select-label-font-weight: 600;
  --fui-select-label-letter-spacing: 0.05em;
  --fui-select-label-font-feature-settings: var(--fui-text-caption-feature);
  --fui-select-label-font-variation-settings: var(--fui-text-caption-variation);
  --fui-select-label-text-transform: uppercase;
  --fui-select-label-padding-x: calc(var(--fui-spacing) * 3);
  --fui-select-label-padding-y: calc(var(--fui-spacing) * 2);
  --fui-select-separator-bleed-x: calc(-1 * calc(var(--fui-spacing) * 1.5));
  --fui-select-separator-margin-y: calc(var(--fui-spacing) * 1.5);
  --fui-select-separator-background-color: color-mix(in oklab, var(--fui-border) 50%, transparent);
  --fui-select-separator-height: 1px;
  --fui-select-scroll-button-background-color: var(--fui-background);
  --fui-select-scroll-button-padding-y: calc(var(--fui-spacing) * 1);
  --fui-select-scroll-button-display: flex;
  --fui-select-scroll-button-align-items: center;
  --fui-select-scroll-button-justify-content: center;
  --fui-select-scroll-button-icon-size: calc(var(--fui-spacing) * 3.5);
  --fui-select-group-padding: calc(var(--fui-spacing) * 1.5);
  --fui-combobox-search-margin-x: calc(var(--fui-spacing) * 1.5);
  --fui-combobox-search-margin-top: calc(var(--fui-spacing) * 1.5);
  --fui-combobox-search-font-family: var(--fui-text-small-family);
  --fui-combobox-search-font-size: var(--fui-text-small-size);
  --fui-combobox-search-line-height: var(--fui-text-small-line-height);
  --fui-combobox-search-font-weight: var(--fui-text-small-weight);
  --fui-combobox-search-letter-spacing: var(--fui-text-small-tracking);
  --fui-combobox-search-font-feature-settings: var(--fui-text-small-feature);
  --fui-combobox-search-font-variation-settings: var(--fui-text-small-variation);
  --fui-combobox-search-height: calc(var(--fui-spacing) * 8);
  --fui-combobox-search-padding-x: calc(var(--fui-spacing) * 2.5);
  --fui-combobox-search-gap: calc(var(--fui-spacing) * 2);
  --fui-combobox-search-icon-size: calc(var(--fui-spacing) * 3.5);
  --fui-combobox-trigger-background-color: transparent;
  --fui-combobox-trigger-border: var(--fui-border-default);
  --fui-combobox-trigger-border-color: transparent;
  --fui-combobox-trigger-border-bottom-color: var(--fui-input);
  --fui-combobox-trigger-rounded: var(--fui-radius-none);
  --fui-combobox-trigger-placeholder-color: var(--fui-muted-foreground);
  --fui-combobox-trigger-font-family: var(--fui-text-small-family);
  --fui-combobox-trigger-font-size: var(--fui-text-small-size);
  --fui-combobox-trigger-line-height: var(--fui-text-small-line-height);
  --fui-combobox-trigger-font-weight: var(--fui-text-small-weight);
  --fui-combobox-trigger-letter-spacing: var(--fui-text-small-tracking);
  --fui-combobox-trigger-font-feature-settings: var(--fui-text-small-feature);
  --fui-combobox-trigger-font-variation-settings: var(--fui-text-small-variation);
  --fui-combobox-trigger-gap: calc(var(--fui-spacing) * 1.5);
  --fui-combobox-trigger-padding-x: calc(var(--fui-spacing) * 0);
  --fui-combobox-trigger-padding-y: calc(var(--fui-spacing) * 2);
  --fui-combobox-trigger-height: calc(var(--fui-spacing) * 10);
  --fui-combobox-trigger-display: flex;
  --fui-combobox-trigger-width: fit-content;
  --fui-combobox-trigger-align-items: center;
  --fui-combobox-trigger-justify-content: space-between;
  --fui-combobox-trigger-focus-border-bottom: var(--fui-border-focus);
  --fui-combobox-trigger-invalid-border-bottom-color: var(--fui-destructive);
  --fui-combobox-trigger-file-background-color: transparent;
  --fui-combobox-trigger-file-border: none;
  --fui-combobox-trigger-file-text-color: var(--fui-foreground);
  --fui-combobox-trigger-file-font-family: var(--fui-text-ui-family);
  --fui-combobox-trigger-file-font-size: var(--fui-text-ui-size);
  --fui-combobox-trigger-file-line-height: var(--fui-text-ui-line-height);
  --fui-combobox-trigger-file-font-weight: var(--fui-text-ui-weight);
  --fui-combobox-trigger-file-letter-spacing: var(--fui-text-ui-tracking);
  --fui-combobox-trigger-file-font-feature-settings: var(--fui-text-ui-feature);
  --fui-combobox-trigger-file-font-variation-settings: var(--fui-text-ui-variation);
  --fui-combobox-trigger-icon-size: calc(var(--fui-spacing) * 3.5);
  --fui-combobox-chevron-text-color: var(--fui-muted-foreground);
  --fui-combobox-chevron-size: calc(var(--fui-spacing) * 3.5);
  --fui-combobox-viewport-scrollbar: none;
  --fui-combobox-viewport-min-height: calc(var(--fui-spacing) * 0);
  --fui-combobox-viewport-padding: calc(var(--fui-spacing) * 1.5);
  --fui-combobox-content-outline: var(--fui-ring-hairline);
  --fui-combobox-content-outline-offset: var(--fui-ring-hairline-offset);
  --fui-combobox-content-background-color: var(--fui-background);
  --fui-combobox-content-text-color: var(--fui-foreground);
  --fui-combobox-content-outline-color: color-mix(in oklab, var(--fui-foreground) 20%, transparent);
  --fui-combobox-content-rounded: var(--fui-radius-none);
  --fui-combobox-content-shadow: var(--fui-shadow-md);
  --fui-combobox-content-min-width: calc(var(--fui-spacing) * 36);
  --fui-combobox-content-display: flex;
  --fui-combobox-content-flex-direction: column;
  --fui-combobox-item-rounded: var(--fui-radius-none);
  --fui-combobox-item-font-family: var(--fui-text-small-family);
  --fui-combobox-item-font-size: var(--fui-text-small-size);
  --fui-combobox-item-line-height: var(--fui-text-small-line-height);
  --fui-combobox-item-font-weight: var(--fui-text-small-weight);
  --fui-combobox-item-letter-spacing: var(--fui-text-small-tracking);
  --fui-combobox-item-font-feature-settings: var(--fui-text-small-feature);
  --fui-combobox-item-font-variation-settings: var(--fui-text-small-variation);
  --fui-combobox-item-gap: calc(var(--fui-spacing) * 2.5);
  --fui-combobox-item-padding-y: calc(var(--fui-spacing) * 2);
  --fui-combobox-item-padding-start: calc(var(--fui-spacing) * 3);
  --fui-combobox-item-padding-end: calc(var(--fui-spacing) * 8);
  --fui-combobox-item-display: flex;
  --fui-combobox-item-width: 100%;
  --fui-combobox-item-align-items: center;
  --fui-combobox-item-highlighted-background-color: var(--fui-accent);
  --fui-combobox-item-highlighted-text-color: var(--fui-accent-foreground);
  --fui-combobox-item-icon-size: calc(var(--fui-spacing) * 3.5);
  --fui-combobox-item-indicator-size: calc(var(--fui-spacing) * 4);
  --fui-combobox-item-indicator-display: flex;
  --fui-combobox-item-indicator-align-items: center;
  --fui-combobox-item-indicator-justify-content: center;
  --fui-combobox-label-text-color: var(--fui-muted-foreground);
  --fui-combobox-label-font-family: var(--fui-text-caption-family);
  --fui-combobox-label-font-size: var(--fui-text-caption-size);
  --fui-combobox-label-line-height: var(--fui-text-caption-line-height);
  --fui-combobox-label-font-weight: 600;
  --fui-combobox-label-letter-spacing: 0.05em;
  --fui-combobox-label-font-feature-settings: var(--fui-text-caption-feature);
  --fui-combobox-label-font-variation-settings: var(--fui-text-caption-variation);
  --fui-combobox-label-text-transform: uppercase;
  --fui-combobox-label-padding-x: calc(var(--fui-spacing) * 3);
  --fui-combobox-label-padding-y: calc(var(--fui-spacing) * 2);
  --fui-combobox-empty-font-family: var(--fui-text-small-family);
  --fui-combobox-empty-font-size: var(--fui-text-small-size);
  --fui-combobox-empty-line-height: var(--fui-text-small-line-height);
  --fui-combobox-empty-font-weight: var(--fui-text-small-weight);
  --fui-combobox-empty-letter-spacing: var(--fui-text-small-tracking);
  --fui-combobox-empty-font-feature-settings: var(--fui-text-small-feature);
  --fui-combobox-empty-font-variation-settings: var(--fui-text-small-variation);
  --fui-combobox-empty-text-color: var(--fui-muted-foreground);
  --fui-combobox-empty-padding-y: calc(var(--fui-spacing) * 2);
  --fui-combobox-empty-text-align: center;
  --fui-combobox-separator-bleed-x: calc(-1 * calc(var(--fui-spacing) * 1.5));
  --fui-combobox-separator-margin-y: calc(var(--fui-spacing) * 1.5);
  --fui-combobox-separator-background-color: color-mix(in oklab, var(--fui-border) 50%, transparent);
  --fui-combobox-separator-height: 1px;
  --fui-combobox-anchor-display: inline-flex;
  --fui-combobox-anchor-width: fit-content;
  --fui-combobox-input-flex: 1;
  --fui-autocomplete-input-background-color: transparent;
  --fui-autocomplete-input-border: var(--fui-border-default);
  --fui-autocomplete-input-border-color: transparent;
  --fui-autocomplete-input-border-bottom-color: var(--fui-input);
  --fui-autocomplete-input-rounded: var(--fui-radius-none);
  --fui-autocomplete-input-font-family: var(--fui-text-control-family);
  --fui-autocomplete-input-font-size: var(--fui-text-control-size);
  --fui-autocomplete-input-line-height: var(--fui-text-control-line-height);
  --fui-autocomplete-input-font-weight: var(--fui-text-control-weight);
  --fui-autocomplete-input-letter-spacing: var(--fui-text-control-tracking);
  --fui-autocomplete-input-font-feature-settings: var(--fui-text-control-feature);
  --fui-autocomplete-input-font-variation-settings: var(--fui-text-control-variation);
  --fui-autocomplete-input-placeholder-color: var(--fui-muted-foreground);
  --fui-autocomplete-input-height: calc(var(--fui-spacing) * 10);
  --fui-autocomplete-input-padding-x: calc(var(--fui-spacing) * 0);
  --fui-autocomplete-input-padding-y: calc(var(--fui-spacing) * 1);
  --fui-autocomplete-input-width: 100%;
  --fui-autocomplete-input-min-width: calc(var(--fui-spacing) * 0);
  --fui-autocomplete-input-flex: 1;
  --fui-autocomplete-input-focus-border-bottom: var(--fui-border-focus);
  --fui-autocomplete-input-invalid-border-bottom-color: var(--fui-destructive);
  --fui-autocomplete-input-file-background-color: transparent;
  --fui-autocomplete-input-file-border: none;
  --fui-autocomplete-input-file-text-color: var(--fui-foreground);
  --fui-autocomplete-input-file-font-family: var(--fui-text-ui-family);
  --fui-autocomplete-input-file-font-size: var(--fui-text-ui-size);
  --fui-autocomplete-input-file-line-height: var(--fui-text-ui-line-height);
  --fui-autocomplete-input-file-font-weight: var(--fui-text-ui-weight);
  --fui-autocomplete-input-file-letter-spacing: var(--fui-text-ui-tracking);
  --fui-autocomplete-input-file-font-feature-settings: var(--fui-text-ui-feature);
  --fui-autocomplete-input-file-font-variation-settings: var(--fui-text-ui-variation);
  --fui-autocomplete-viewport-scrollbar: none;
  --fui-autocomplete-viewport-min-height: calc(var(--fui-spacing) * 0);
  --fui-autocomplete-viewport-padding: calc(var(--fui-spacing) * 1.5);
  --fui-autocomplete-content-outline: var(--fui-ring-hairline);
  --fui-autocomplete-content-outline-offset: var(--fui-ring-hairline-offset);
  --fui-autocomplete-content-background-color: var(--fui-background);
  --fui-autocomplete-content-text-color: var(--fui-foreground);
  --fui-autocomplete-content-outline-color: color-mix(in oklab, var(--fui-foreground) 20%, transparent);
  --fui-autocomplete-content-rounded: var(--fui-radius-none);
  --fui-autocomplete-content-shadow: var(--fui-shadow-md);
  --fui-autocomplete-content-min-width: calc(var(--fui-spacing) * 36);
  --fui-autocomplete-content-display: flex;
  --fui-autocomplete-content-flex-direction: column;
  --fui-autocomplete-item-rounded: var(--fui-radius-none);
  --fui-autocomplete-item-font-family: var(--fui-text-small-family);
  --fui-autocomplete-item-font-size: var(--fui-text-small-size);
  --fui-autocomplete-item-line-height: var(--fui-text-small-line-height);
  --fui-autocomplete-item-font-weight: var(--fui-text-small-weight);
  --fui-autocomplete-item-letter-spacing: var(--fui-text-small-tracking);
  --fui-autocomplete-item-font-feature-settings: var(--fui-text-small-feature);
  --fui-autocomplete-item-font-variation-settings: var(--fui-text-small-variation);
  --fui-autocomplete-item-gap: calc(var(--fui-spacing) * 2.5);
  --fui-autocomplete-item-padding-y: calc(var(--fui-spacing) * 2);
  --fui-autocomplete-item-padding-start: calc(var(--fui-spacing) * 3);
  --fui-autocomplete-item-padding-end: calc(var(--fui-spacing) * 3);
  --fui-autocomplete-item-display: flex;
  --fui-autocomplete-item-width: 100%;
  --fui-autocomplete-item-align-items: center;
  --fui-autocomplete-item-highlighted-background-color: var(--fui-accent);
  --fui-autocomplete-item-highlighted-text-color: var(--fui-accent-foreground);
  --fui-autocomplete-item-icon-size: calc(var(--fui-spacing) * 3.5);
  --fui-autocomplete-label-text-color: var(--fui-muted-foreground);
  --fui-autocomplete-label-font-family: var(--fui-text-caption-family);
  --fui-autocomplete-label-font-size: var(--fui-text-caption-size);
  --fui-autocomplete-label-line-height: var(--fui-text-caption-line-height);
  --fui-autocomplete-label-font-weight: 600;
  --fui-autocomplete-label-letter-spacing: 0.05em;
  --fui-autocomplete-label-font-feature-settings: var(--fui-text-caption-feature);
  --fui-autocomplete-label-font-variation-settings: var(--fui-text-caption-variation);
  --fui-autocomplete-label-text-transform: uppercase;
  --fui-autocomplete-label-padding-x: calc(var(--fui-spacing) * 3);
  --fui-autocomplete-label-padding-y: calc(var(--fui-spacing) * 2);
  --fui-autocomplete-empty-font-family: var(--fui-text-small-family);
  --fui-autocomplete-empty-font-size: var(--fui-text-small-size);
  --fui-autocomplete-empty-line-height: var(--fui-text-small-line-height);
  --fui-autocomplete-empty-font-weight: var(--fui-text-small-weight);
  --fui-autocomplete-empty-letter-spacing: var(--fui-text-small-tracking);
  --fui-autocomplete-empty-font-feature-settings: var(--fui-text-small-feature);
  --fui-autocomplete-empty-font-variation-settings: var(--fui-text-small-variation);
  --fui-autocomplete-empty-text-color: var(--fui-muted-foreground);
  --fui-autocomplete-empty-padding-y: calc(var(--fui-spacing) * 2);
  --fui-autocomplete-empty-text-align: center;
  --fui-autocomplete-separator-bleed-x: calc(-1 * calc(var(--fui-spacing) * 1.5));
  --fui-autocomplete-separator-margin-y: calc(var(--fui-spacing) * 1.5);
  --fui-autocomplete-separator-background-color: color-mix(in oklab, var(--fui-border) 50%, transparent);
  --fui-autocomplete-separator-height: 1px;
  --fui-number-field-input-background-color: transparent;
  --fui-number-field-input-border: var(--fui-border-default);
  --fui-number-field-input-border-color: transparent;
  --fui-number-field-input-border-bottom-color: var(--fui-input);
  --fui-number-field-input-rounded: var(--fui-radius-none);
  --fui-number-field-input-font-family: var(--fui-text-control-family);
  --fui-number-field-input-font-size: var(--fui-text-control-size);
  --fui-number-field-input-line-height: var(--fui-text-control-line-height);
  --fui-number-field-input-font-weight: var(--fui-text-control-weight);
  --fui-number-field-input-letter-spacing: var(--fui-text-control-tracking);
  --fui-number-field-input-font-feature-settings: var(--fui-text-control-feature);
  --fui-number-field-input-font-variation-settings: var(--fui-text-control-variation);
  --fui-number-field-input-placeholder-color: var(--fui-muted-foreground);
  --fui-number-field-input-height: calc(var(--fui-spacing) * 10);
  --fui-number-field-input-padding-x: calc(var(--fui-spacing) * 10);
  --fui-number-field-input-padding-y: calc(var(--fui-spacing) * 1);
  --fui-number-field-input-width: 100%;
  --fui-number-field-input-min-width: calc(var(--fui-spacing) * 0);
  --fui-number-field-input-text-align: center;
  --fui-number-field-input-focus-border-bottom: var(--fui-border-focus);
  --fui-number-field-input-invalid-border-bottom-color: var(--fui-destructive);
  --fui-number-field-input-file-background-color: transparent;
  --fui-number-field-input-file-border: none;
  --fui-number-field-input-file-text-color: var(--fui-foreground);
  --fui-number-field-input-file-font-family: var(--fui-text-ui-family);
  --fui-number-field-input-file-font-size: var(--fui-text-ui-size);
  --fui-number-field-input-file-line-height: var(--fui-text-ui-line-height);
  --fui-number-field-input-file-font-weight: var(--fui-text-ui-weight);
  --fui-number-field-input-file-letter-spacing: var(--fui-text-ui-tracking);
  --fui-number-field-input-file-font-feature-settings: var(--fui-text-ui-feature);
  --fui-number-field-input-file-font-variation-settings: var(--fui-text-ui-variation);
  --fui-number-field-step-padding: calc(var(--fui-spacing) * 3);
  --fui-number-field-step-display: inline-flex;
  --fui-number-field-step-align-items: center;
  --fui-number-field-step-justify-content: center;
  --fui-number-field-step-icon-size: calc(var(--fui-spacing) * 4);
  --fui-number-field-display: grid;
  --fui-number-field-gap: calc(var(--fui-spacing) * 1.5);
  --fui-number-field-content-min-width: calc(var(--fui-spacing) * 28);
  --fui-input-otp-display: flex;
  --fui-input-otp-align-items: center;
  --fui-input-otp-gap: calc(var(--fui-spacing) * 2);
  --fui-input-otp-slot-background-color: transparent;
  --fui-input-otp-slot-border: var(--fui-border-default);
  --fui-input-otp-slot-border-color: transparent;
  --fui-input-otp-slot-border-bottom-color: var(--fui-input);
  --fui-input-otp-slot-rounded: var(--fui-radius-none);
  --fui-input-otp-slot-placeholder-color: var(--fui-muted-foreground);
  --fui-input-otp-slot-size: calc(var(--fui-spacing) * 10);
  --fui-input-otp-slot-font-family: var(--fui-text-small-family);
  --fui-input-otp-slot-font-size: var(--fui-text-small-size);
  --fui-input-otp-slot-line-height: var(--fui-text-small-line-height);
  --fui-input-otp-slot-font-weight: var(--fui-text-small-weight);
  --fui-input-otp-slot-letter-spacing: var(--fui-text-small-tracking);
  --fui-input-otp-slot-font-feature-settings: var(--fui-text-small-feature);
  --fui-input-otp-slot-font-variation-settings: var(--fui-text-small-variation);
  --fui-input-otp-slot-display: flex;
  --fui-input-otp-slot-align-items: center;
  --fui-input-otp-slot-justify-content: center;
  --fui-input-otp-slot-focus-border-bottom: var(--fui-border-default);
  --fui-input-otp-slot-focus-border-bottom-color: var(--fui-input);
  --fui-input-otp-slot-invalid-border-bottom-color: var(--fui-destructive);
  --fui-input-otp-slot-current-border-bottom: var(--fui-border-focus);
  --fui-input-otp-slot-file-background-color: transparent;
  --fui-input-otp-slot-file-border: none;
  --fui-input-otp-slot-file-text-color: var(--fui-foreground);
  --fui-input-otp-slot-file-font-family: var(--fui-text-ui-family);
  --fui-input-otp-slot-file-font-size: var(--fui-text-ui-size);
  --fui-input-otp-slot-file-line-height: var(--fui-text-ui-line-height);
  --fui-input-otp-slot-file-font-weight: var(--fui-text-ui-weight);
  --fui-input-otp-slot-file-letter-spacing: var(--fui-text-ui-tracking);
  --fui-input-otp-slot-file-font-feature-settings: var(--fui-text-ui-feature);
  --fui-input-otp-slot-file-font-variation-settings: var(--fui-text-ui-variation);
  --fui-input-otp-caret-background-color: var(--fui-foreground);
  --fui-input-otp-caret-height: calc(var(--fui-spacing) * 4);
  --fui-input-otp-caret-width: 1px;
  --fui-input-otp-group-display: flex;
  --fui-input-otp-group-align-items: center;
  --fui-input-otp-group-gap: calc(var(--fui-spacing) * 1);
  --fui-input-otp-separator-display: flex;
  --fui-input-otp-separator-align-items: center;
  --fui-input-otp-separator-icon-size: calc(var(--fui-spacing) * 3.5);
  --fui-tags-input-background-color: transparent;
  --fui-tags-input-border: var(--fui-border-default);
  --fui-tags-input-border-color: transparent;
  --fui-tags-input-border-bottom-color: var(--fui-input);
  --fui-tags-input-rounded: var(--fui-radius-none);
  --fui-tags-input-font-family: var(--fui-text-control-family);
  --fui-tags-input-font-size: var(--fui-text-control-size);
  --fui-tags-input-line-height: var(--fui-text-control-line-height);
  --fui-tags-input-font-weight: var(--fui-text-control-weight);
  --fui-tags-input-letter-spacing: var(--fui-text-control-tracking);
  --fui-tags-input-font-feature-settings: var(--fui-text-control-feature);
  --fui-tags-input-font-variation-settings: var(--fui-text-control-variation);
  --fui-tags-input-placeholder-color: var(--fui-muted-foreground);
  --fui-tags-input-gap: calc(var(--fui-spacing) * 2);
  --fui-tags-input-min-height: calc(var(--fui-spacing) * 10);
  --fui-tags-input-padding-x: calc(var(--fui-spacing) * 0);
  --fui-tags-input-padding-y: calc(var(--fui-spacing) * 1);
  --fui-tags-input-display: flex;
  --fui-tags-input-flex-wrap: wrap;
  --fui-tags-input-align-items: center;
  --fui-tags-input-focus-border-bottom: var(--fui-border-focus);
  --fui-tags-input-focus-within-border-bottom: var(--fui-border-focus);
  --fui-tags-input-invalid-border-bottom-color: var(--fui-destructive);
  --fui-tags-input-file-background-color: transparent;
  --fui-tags-input-file-border: none;
  --fui-tags-input-file-text-color: var(--fui-foreground);
  --fui-tags-input-file-font-family: var(--fui-text-ui-family);
  --fui-tags-input-file-font-size: var(--fui-text-ui-size);
  --fui-tags-input-file-line-height: var(--fui-text-ui-line-height);
  --fui-tags-input-file-font-weight: var(--fui-text-ui-weight);
  --fui-tags-input-file-letter-spacing: var(--fui-text-ui-tracking);
  --fui-tags-input-file-font-feature-settings: var(--fui-text-ui-feature);
  --fui-tags-input-file-font-variation-settings: var(--fui-text-ui-variation);
  --fui-tags-input-input-font-family: var(--fui-text-control-family);
  --fui-tags-input-input-font-size: var(--fui-text-control-size);
  --fui-tags-input-input-line-height: var(--fui-text-control-line-height);
  --fui-tags-input-input-font-weight: var(--fui-text-control-weight);
  --fui-tags-input-input-letter-spacing: var(--fui-text-control-tracking);
  --fui-tags-input-input-font-feature-settings: var(--fui-text-control-feature);
  --fui-tags-input-input-font-variation-settings: var(--fui-text-control-variation);
  --fui-tags-input-input-placeholder-color: var(--fui-muted-foreground);
  --fui-tags-input-input-min-height: calc(var(--fui-spacing) * 5);
  --fui-tags-input-input-padding-x: calc(var(--fui-spacing) * 0);
  --fui-tags-input-input-flex: 1;
  --fui-tags-input-item-background-color: var(--fui-secondary);
  --fui-tags-input-item-rounded: var(--fui-radius-none);
  --fui-tags-input-item-height: calc(var(--fui-spacing) * 5);
  --fui-tags-input-item-display: flex;
  --fui-tags-input-item-align-items: center;
  --fui-tags-input-item-selected-outline: var(--fui-ring-outset);
  --fui-tags-input-item-selected-outline-offset: var(--fui-ring-outset-offset);
  --fui-tags-input-item-selected-outline-color: var(--fui-ring);
  --fui-tags-input-item-text-font-family: var(--fui-text-small-family);
  --fui-tags-input-item-text-font-size: var(--fui-text-small-size);
  --fui-tags-input-item-text-line-height: var(--fui-text-small-line-height);
  --fui-tags-input-item-text-font-weight: var(--fui-text-small-weight);
  --fui-tags-input-item-text-letter-spacing: var(--fui-text-small-tracking);
  --fui-tags-input-item-text-font-feature-settings: var(--fui-text-small-feature);
  --fui-tags-input-item-text-font-variation-settings: var(--fui-text-small-variation);
  --fui-tags-input-item-text-rounded: var(--fui-radius-none);
  --fui-tags-input-item-text-padding-x: calc(var(--fui-spacing) * 2);
  --fui-tags-input-item-text-padding-y: calc(var(--fui-spacing) * 0.5);
  --fui-tags-input-item-delete-margin-end: calc(var(--fui-spacing) * 1);
  --fui-tags-input-item-delete-rounded: var(--fui-radius-none);
  --fui-tags-input-item-delete-display: flex;
  --fui-tags-input-item-delete-icon-size: calc(var(--fui-spacing) * 2.5);
  --fui-tag-group-gap: calc(var(--fui-spacing) * 2);
  --fui-tag-group-display: flex;
  --fui-tag-group-flex-wrap: wrap;
  --fui-tag-group-align-items: center;
  --fui-tag-group-item-background-color: transparent;
  --fui-tag-group-item-border: var(--fui-border-default);
  --fui-tag-group-item-border-color: var(--fui-input);
  --fui-tag-group-item-rounded: var(--fui-radius-none);
  --fui-tag-group-item-font-family: var(--fui-text-small-family);
  --fui-tag-group-item-font-size: var(--fui-text-small-size);
  --fui-tag-group-item-line-height: var(--fui-text-small-line-height);
  --fui-tag-group-item-font-weight: var(--fui-text-small-weight);
  --fui-tag-group-item-letter-spacing: var(--fui-text-small-tracking);
  --fui-tag-group-item-font-feature-settings: var(--fui-text-small-feature);
  --fui-tag-group-item-font-variation-settings: var(--fui-text-small-variation);
  --fui-tag-group-item-height: calc(var(--fui-spacing) * 8);
  --fui-tag-group-item-padding-x: calc(var(--fui-spacing) * 3);
  --fui-tag-group-item-gap: calc(var(--fui-spacing) * 1.5);
  --fui-tag-group-item-display: inline-flex;
  --fui-tag-group-item-flex-shrink: 0;
  --fui-tag-group-item-align-items: center;
  --fui-tag-group-item-hover-background-color: var(--fui-muted);
  --fui-tag-group-item-checked-background-color: var(--fui-primary);
  --fui-tag-group-item-checked-text-color: var(--fui-primary-foreground);
  --fui-tag-group-item-checked-border-color: var(--fui-primary);
  --fui-tag-group-item-delete-bleed-end: calc(-1 * calc(var(--fui-spacing) * 1));
  --fui-tag-group-item-delete-opacity: var(--fui-opacity-60);
  --fui-tag-group-item-delete-size: calc(var(--fui-spacing) * 5);
  --fui-tag-group-item-delete-display: flex;
  --fui-tag-group-item-delete-flex-shrink: 0;
  --fui-tag-group-item-delete-align-items: center;
  --fui-tag-group-item-delete-justify-content: center;
  --fui-tag-group-item-delete-hover-opacity: var(--fui-opacity-100);
  --fui-search-input-border: var(--fui-border-default);
  --fui-search-input-border-color: var(--fui-input);
  --fui-search-input-shadow: var(--fui-shadow-xs);
  --fui-search-input-rounded: var(--fui-radius-md);
  --fui-search-input-font-family: var(--fui-text-small-family);
  --fui-search-input-font-size: var(--fui-text-small-size);
  --fui-search-input-line-height: var(--fui-text-small-line-height);
  --fui-search-input-font-weight: var(--fui-text-small-weight);
  --fui-search-input-letter-spacing: var(--fui-text-small-tracking);
  --fui-search-input-font-feature-settings: var(--fui-text-small-feature);
  --fui-search-input-font-variation-settings: var(--fui-text-small-variation);
  --fui-search-input-background-color: var(--fui-background);
  --fui-search-input-height: calc(var(--fui-spacing) * 10);
  --fui-search-input-padding-x: calc(var(--fui-spacing) * 3);
  --fui-search-input-gap: calc(var(--fui-spacing) * 2);
  --fui-search-input-display: flex;
  --fui-search-input-min-width: calc(var(--fui-spacing) * 0);
  --fui-search-input-flex: 1;
  --fui-search-input-align-items: center;
  --fui-search-input-focus-within-outline: var(--fui-ring-wide);
  --fui-search-input-focus-within-outline-offset: var(--fui-ring-wide-offset);
  --fui-search-input-focus-within-border-color: var(--fui-ring);
  --fui-search-input-focus-within-outline-color: var(--fui-ring);
  --fui-search-input-icon-size: calc(var(--fui-spacing) * 4);
  --fui-search-input-clear-opacity: var(--fui-opacity-60);
  --fui-search-input-clear-size: calc(var(--fui-spacing) * 5);
  --fui-search-input-clear-hover-opacity: var(--fui-opacity-100);
  --fui-search-cancel-font-family: var(--fui-text-small-family);
  --fui-search-cancel-font-size: var(--fui-text-small-size);
  --fui-search-cancel-line-height: var(--fui-text-small-line-height);
  --fui-search-cancel-font-weight: var(--fui-text-small-weight);
  --fui-search-cancel-letter-spacing: var(--fui-text-small-tracking);
  --fui-search-cancel-font-feature-settings: var(--fui-text-small-feature);
  --fui-search-cancel-font-variation-settings: var(--fui-text-small-variation);
  --fui-search-results-display: flex;
  --fui-search-results-flex-direction: column;
  --fui-search-results-popper-outline: var(--fui-ring-hairline);
  --fui-search-results-popper-outline-offset: var(--fui-ring-hairline-offset);
  --fui-search-results-popper-background-color: var(--fui-background);
  --fui-search-results-popper-text-color: var(--fui-foreground);
  --fui-search-results-popper-outline-color: color-mix(in oklab, var(--fui-foreground) 20%, transparent);
  --fui-search-results-popper-rounded: var(--fui-radius-none);
  --fui-search-results-popper-shadow: var(--fui-shadow-md);
  --fui-search-results-viewport-scrollbar: none;
  --fui-search-results-viewport-padding-y: calc(var(--fui-spacing) * 1.5);
  --fui-search-group-padding-y: calc(var(--fui-spacing) * 1);
  --fui-search-group-display: flex;
  --fui-search-group-flex-direction: column;
  --fui-search-group-heading-text-color: var(--fui-muted-foreground);
  --fui-search-group-heading-font-family: var(--fui-text-caption-family);
  --fui-search-group-heading-font-size: var(--fui-text-caption-size);
  --fui-search-group-heading-line-height: var(--fui-text-caption-line-height);
  --fui-search-group-heading-font-weight: 600;
  --fui-search-group-heading-letter-spacing: 0.05em;
  --fui-search-group-heading-font-feature-settings: var(--fui-text-caption-feature);
  --fui-search-group-heading-font-variation-settings: var(--fui-text-caption-variation);
  --fui-search-group-heading-text-transform: uppercase;
  --fui-search-group-heading-padding-x: calc(var(--fui-spacing) * 3);
  --fui-search-group-heading-padding-y: calc(var(--fui-spacing) * 2);
  --fui-search-item-rounded: var(--fui-radius-none);
  --fui-search-item-font-family: var(--fui-text-small-family);
  --fui-search-item-font-size: var(--fui-text-small-size);
  --fui-search-item-line-height: var(--fui-text-small-line-height);
  --fui-search-item-font-weight: var(--fui-text-small-weight);
  --fui-search-item-letter-spacing: var(--fui-text-small-tracking);
  --fui-search-item-font-feature-settings: var(--fui-text-small-feature);
  --fui-search-item-font-variation-settings: var(--fui-text-small-variation);
  --fui-search-item-gap: calc(var(--fui-spacing) * 3);
  --fui-search-item-padding-x: calc(var(--fui-spacing) * 3);
  --fui-search-item-padding-y: calc(var(--fui-spacing) * 2);
  --fui-search-item-display: flex;
  --fui-search-item-align-items: center;
  --fui-search-item-highlighted-background-color: var(--fui-accent);
  --fui-search-item-highlighted-text-color: var(--fui-accent-foreground);
  --fui-search-item-icon-size: calc(var(--fui-spacing) * 4);
  --fui-search-tag-background-color: transparent;
  --fui-search-tag-border: var(--fui-border-default);
  --fui-search-tag-border-color: var(--fui-input);
  --fui-search-tag-rounded: var(--fui-radius-none);
  --fui-search-tag-font-family: var(--fui-text-small-family);
  --fui-search-tag-font-size: var(--fui-text-small-size);
  --fui-search-tag-line-height: var(--fui-text-small-line-height);
  --fui-search-tag-font-weight: var(--fui-text-small-weight);
  --fui-search-tag-letter-spacing: var(--fui-text-small-tracking);
  --fui-search-tag-font-feature-settings: var(--fui-text-small-feature);
  --fui-search-tag-font-variation-settings: var(--fui-text-small-variation);
  --fui-search-tag-height: calc(var(--fui-spacing) * 8);
  --fui-search-tag-padding-x: calc(var(--fui-spacing) * 3);
  --fui-search-tag-display: inline-flex;
  --fui-search-tag-flex-shrink: 0;
  --fui-search-tag-align-items: center;
  --fui-search-tag-hover-background-color: var(--fui-muted);
  --fui-search-tag-highlighted-background-color: var(--fui-muted);
  --fui-search-tag-highlighted-border-color: var(--fui-foreground);
  --fui-search-query-rounded: var(--fui-radius-none);
  --fui-search-query-font-family: var(--fui-text-small-family);
  --fui-search-query-font-size: var(--fui-text-small-size);
  --fui-search-query-line-height: var(--fui-text-small-line-height);
  --fui-search-query-font-weight: var(--fui-text-small-weight);
  --fui-search-query-letter-spacing: var(--fui-text-small-tracking);
  --fui-search-query-font-feature-settings: var(--fui-text-small-feature);
  --fui-search-query-font-variation-settings: var(--fui-text-small-variation);
  --fui-search-query-gap: calc(var(--fui-spacing) * 2);
  --fui-search-query-padding-x: calc(var(--fui-spacing) * 3);
  --fui-search-query-padding-y: calc(var(--fui-spacing) * 2.5);
  --fui-search-query-display: flex;
  --fui-search-query-align-items: center;
  --fui-search-query-highlighted-background-color: var(--fui-accent);
  --fui-search-query-highlighted-text-color: var(--fui-accent-foreground);
  --fui-search-query-icon-size: calc(var(--fui-spacing) * 4);
  --fui-search-query-term-font-weight: 600;
  --fui-search-empty-font-family: var(--fui-text-small-family);
  --fui-search-empty-font-size: var(--fui-text-small-size);
  --fui-search-empty-line-height: var(--fui-text-small-line-height);
  --fui-search-empty-font-weight: var(--fui-text-small-weight);
  --fui-search-empty-letter-spacing: var(--fui-text-small-tracking);
  --fui-search-empty-font-feature-settings: var(--fui-text-small-feature);
  --fui-search-empty-font-variation-settings: var(--fui-text-small-variation);
  --fui-search-empty-text-color: var(--fui-muted-foreground);
  --fui-search-empty-padding-x: calc(var(--fui-spacing) * 3);
  --fui-search-empty-padding-y: calc(var(--fui-spacing) * 3);
  --fui-search-loading-gap: calc(var(--fui-spacing) * 3);
  --fui-search-loading-padding-x: calc(var(--fui-spacing) * 3);
  --fui-search-loading-padding-y: calc(var(--fui-spacing) * 2);
  --fui-search-loading-display: flex;
  --fui-search-loading-flex-direction: column;
  --fui-search-loading-row-gap: calc(var(--fui-spacing) * 3);
  --fui-search-loading-label-font-family: var(--fui-text-small-family);
  --fui-search-loading-label-font-size: var(--fui-text-small-size);
  --fui-search-loading-label-line-height: var(--fui-text-small-line-height);
  --fui-search-loading-label-font-weight: var(--fui-text-small-weight);
  --fui-search-loading-label-letter-spacing: var(--fui-text-small-tracking);
  --fui-search-loading-label-font-feature-settings: var(--fui-text-small-feature);
  --fui-search-loading-label-font-variation-settings: var(--fui-text-small-variation);
  --fui-search-loading-label-text-color: var(--fui-muted-foreground);
  --fui-search-highlight-background-color: transparent;
  --fui-search-highlight-font-weight: 600;
  --fui-search-overlay-outline: var(--fui-ring-hairline);
  --fui-search-overlay-outline-offset: var(--fui-ring-hairline-offset);
  --fui-search-overlay-background-color: var(--fui-background);
  --fui-search-overlay-outline-color: color-mix(in oklab, var(--fui-foreground) 10%, transparent);
  --fui-search-overlay-rounded: var(--fui-radius-none);
  --fui-search-overlay-shadow: var(--fui-shadow-md);
  --fui-search-overlay-font-family: var(--fui-text-small-family);
  --fui-search-overlay-font-size: var(--fui-text-small-size);
  --fui-search-overlay-line-height: var(--fui-text-small-line-height);
  --fui-search-overlay-font-weight: var(--fui-text-small-weight);
  --fui-search-overlay-letter-spacing: var(--fui-text-small-tracking);
  --fui-search-overlay-font-feature-settings: var(--fui-text-small-feature);
  --fui-search-overlay-font-variation-settings: var(--fui-text-small-variation);
  --fui-search-overlay-gap: calc(var(--fui-spacing) * 2);
  --fui-search-overlay-padding: calc(var(--fui-spacing) * 4);
  --fui-search-overlay-display: flex;
  --fui-search-overlay-flex-direction: column;
  --fui-search-overlay-backdrop-background-color: color-mix(in oklab, var(--fui-foreground) 20%, transparent);
  --fui-date-field-background-color: transparent;
  --fui-date-field-border: var(--fui-border-default);
  --fui-date-field-border-color: transparent;
  --fui-date-field-border-bottom-color: var(--fui-input);
  --fui-date-field-rounded: var(--fui-radius-none);
  --fui-date-field-font-family: var(--fui-text-control-family);
  --fui-date-field-font-size: var(--fui-text-control-size);
  --fui-date-field-line-height: var(--fui-text-control-line-height);
  --fui-date-field-font-weight: var(--fui-text-control-weight);
  --fui-date-field-letter-spacing: var(--fui-text-control-tracking);
  --fui-date-field-font-feature-settings: var(--fui-text-control-feature);
  --fui-date-field-font-variation-settings: var(--fui-text-control-variation);
  --fui-date-field-placeholder-color: var(--fui-muted-foreground);
  --fui-date-field-height: calc(var(--fui-spacing) * 10);
  --fui-date-field-display: flex;
  --fui-date-field-width: 100%;
  --fui-date-field-min-width: calc(var(--fui-spacing) * 0);
  --fui-date-field-align-items: center;
  --fui-date-field-focus-border-bottom: var(--fui-border-focus);
  --fui-date-field-focus-within-border-bottom-color: var(--fui-ring);
  --fui-date-field-invalid-border-bottom-color: var(--fui-destructive);
  --fui-date-field-segment-rounded: var(--fui-radius-sm);
  --fui-date-field-segment-padding-x: calc(var(--fui-spacing) * 0.5);
  --fui-date-field-segment-focus-background-color: var(--fui-accent);
  --fui-date-field-segment-focus-text-color: var(--fui-accent-foreground);
  --fui-date-field-segment-placeholder-shown-text-color: var(--fui-muted-foreground);
  --fui-date-field-literal-text-color: var(--fui-muted-foreground);
  --fui-date-picker-content-padding: calc(var(--fui-spacing) * 0);
  --fui-date-picker-content-width: auto;
  --fui-date-picker-trigger-bleed-end: calc(-1 * calc(var(--fui-spacing) * 2));
  --fui-date-picker-trigger-text-color: var(--fui-muted-foreground);
  --fui-date-picker-trigger-rounded: var(--fui-radius-sm);
  --fui-date-picker-trigger-padding: calc(var(--fui-spacing) * 2);
  --fui-date-picker-trigger-margin-start: auto;
  --fui-date-picker-trigger-display: inline-flex;
  --fui-date-picker-trigger-flex-shrink: 0;
  --fui-date-picker-trigger-align-items: center;
  --fui-date-picker-trigger-justify-content: center;
  --fui-date-picker-trigger-hover-text-color: var(--fui-foreground);
  --fui-date-picker-trigger-icon-size: calc(var(--fui-spacing) * 4);
  --fui-date-range-picker-separator-text-color: var(--fui-muted-foreground);
  --fui-date-range-picker-separator-padding-x: calc(var(--fui-spacing) * 1);
  --fui-payment-card-brands-gap: calc(var(--fui-spacing) * 1);
  --fui-payment-card-brands-display: flex;
  --fui-payment-card-brands-align-items: center;
  --fui-payment-card-brand-height: calc(var(--fui-spacing) * 5);
  --fui-payment-card-brand-border: var(--fui-border-default);
  --fui-payment-card-brand-border-color: var(--fui-border);
  --fui-payment-card-brand-rounded: var(--fui-radius-sm);
  --fui-input-group-background-color: transparent;
  --fui-input-group-border: var(--fui-border-default);
  --fui-input-group-border-color: transparent;
  --fui-input-group-border-bottom-color: var(--fui-input);
  --fui-input-group-rounded: var(--fui-radius-none);
  --fui-input-group-font-family: var(--fui-text-control-family);
  --fui-input-group-font-size: var(--fui-text-control-size);
  --fui-input-group-line-height: var(--fui-text-control-line-height);
  --fui-input-group-font-weight: var(--fui-text-control-weight);
  --fui-input-group-letter-spacing: var(--fui-text-control-tracking);
  --fui-input-group-font-feature-settings: var(--fui-text-control-feature);
  --fui-input-group-font-variation-settings: var(--fui-text-control-variation);
  --fui-input-group-placeholder-color: var(--fui-muted-foreground);
  --fui-input-group-height: calc(var(--fui-spacing) * 10);
  --fui-input-group-display: flex;
  --fui-input-group-width: 100%;
  --fui-input-group-min-width: calc(var(--fui-spacing) * 0);
  --fui-input-group-align-items: center;
  --fui-input-group-focus-border-bottom: var(--fui-border-focus);
  --fui-input-group-focus-within-border-bottom: var(--fui-border-focus);
  --fui-input-group-invalid-within-border-bottom-color: var(--fui-destructive);
  --fui-input-group-invalid-border-bottom-color: var(--fui-destructive);
  --fui-input-group-sm-height: calc(var(--fui-spacing) * 9);
  --fui-input-group-addon-text-color: var(--fui-muted-foreground);
  --fui-input-group-addon-font-family: var(--fui-text-ui-family);
  --fui-input-group-addon-font-size: var(--fui-text-ui-size);
  --fui-input-group-addon-line-height: var(--fui-text-ui-line-height);
  --fui-input-group-addon-font-weight: var(--fui-text-ui-weight);
  --fui-input-group-addon-letter-spacing: var(--fui-text-ui-tracking);
  --fui-input-group-addon-font-feature-settings: var(--fui-text-ui-feature);
  --fui-input-group-addon-font-variation-settings: var(--fui-text-ui-variation);
  --fui-input-group-addon-gap: calc(var(--fui-spacing) * 2);
  --fui-input-group-addon-padding-y: calc(var(--fui-spacing) * 2);
  --fui-input-group-addon-display: flex;
  --fui-input-group-addon-height: auto;
  --fui-input-group-addon-align-items: center;
  --fui-input-group-addon-justify-content: center;
  --fui-input-group-addon-icon-size: calc(var(--fui-spacing) * 3.5);
  --fui-input-group-addon-block-start-padding-top: calc(var(--fui-spacing) * 3);
  --fui-input-group-addon-block-end-padding-bottom: calc(var(--fui-spacing) * 3);
  --fui-input-group-text-text-color: var(--fui-muted-foreground);
  --fui-input-group-text-font-family: var(--fui-text-small-family);
  --fui-input-group-text-font-size: var(--fui-text-small-size);
  --fui-input-group-text-line-height: var(--fui-text-small-line-height);
  --fui-input-group-text-font-weight: var(--fui-text-small-weight);
  --fui-input-group-text-letter-spacing: var(--fui-text-small-tracking);
  --fui-input-group-text-font-feature-settings: var(--fui-text-small-feature);
  --fui-input-group-text-font-variation-settings: var(--fui-text-small-variation);
  --fui-input-group-text-gap: calc(var(--fui-spacing) * 2);
  --fui-input-group-text-display: flex;
  --fui-input-group-text-align-items: center;
  --fui-input-group-text-icon-size: calc(var(--fui-spacing) * 3.5);
  --fui-input-group-button-gap: calc(var(--fui-spacing) * 2);
  --fui-input-group-button-font-family: var(--fui-text-small-family);
  --fui-input-group-button-font-size: var(--fui-text-small-size);
  --fui-input-group-button-line-height: var(--fui-text-small-line-height);
  --fui-input-group-button-font-weight: var(--fui-text-small-weight);
  --fui-input-group-button-letter-spacing: var(--fui-text-small-tracking);
  --fui-input-group-button-font-feature-settings: var(--fui-text-small-feature);
  --fui-input-group-button-font-variation-settings: var(--fui-text-small-variation);
  --fui-input-group-button-display: flex;
  --fui-input-group-button-align-items: center;
  --fui-input-group-button-icon-size: calc(var(--fui-spacing) * 3.5);
  --fui-input-group-button-icon-start-padding-start: calc(var(--fui-spacing) * 4);
  --fui-input-group-button-icon-end-padding-end: calc(var(--fui-spacing) * 4);
  --fui-input-group-button-xs-height: calc(var(--fui-spacing) * 6);
  --fui-input-group-button-xs-gap: calc(var(--fui-spacing) * 1);
  --fui-input-group-button-xs-padding-x: calc(var(--fui-spacing) * 1.5);
  --fui-input-group-button-xs-font-family: var(--fui-text-caption-family);
  --fui-input-group-button-xs-font-size: var(--fui-text-caption-size);
  --fui-input-group-button-xs-line-height: var(--fui-text-caption-line-height);
  --fui-input-group-button-xs-font-weight: 400;
  --fui-input-group-button-xs-letter-spacing: var(--fui-text-caption-tracking);
  --fui-input-group-button-xs-font-feature-settings: var(--fui-text-caption-feature);
  --fui-input-group-button-xs-font-variation-settings: var(--fui-text-caption-variation);
  --fui-input-group-button-sm-height: calc(var(--fui-spacing) * 10);
  --fui-input-group-button-sm-padding-x: calc(var(--fui-spacing) * 6);
  --fui-input-group-button-icon-xs-size: calc(var(--fui-spacing) * 6);
  --fui-input-group-button-icon-xs-padding: calc(var(--fui-spacing) * 0);
  --fui-input-group-button-icon-xs-font-family: var(--fui-text-caption-family);
  --fui-input-group-button-icon-xs-font-size: var(--fui-text-caption-size);
  --fui-input-group-button-icon-xs-line-height: var(--fui-text-caption-line-height);
  --fui-input-group-button-icon-xs-font-weight: 400;
  --fui-input-group-button-icon-xs-letter-spacing: var(--fui-text-caption-tracking);
  --fui-input-group-button-icon-xs-font-feature-settings: var(--fui-text-caption-feature);
  --fui-input-group-button-icon-xs-font-variation-settings: var(--fui-text-caption-variation);
  --fui-input-group-button-icon-xs-icon-start-padding-start: calc(var(--fui-spacing) * 0);
  --fui-input-group-button-icon-xs-icon-end-padding-end: calc(var(--fui-spacing) * 0);
  --fui-input-group-button-icon-sm-size: calc(var(--fui-spacing) * 8);
  --fui-input-group-button-icon-sm-padding: calc(var(--fui-spacing) * 0);
  --fui-input-group-button-icon-sm-icon-start-padding-start: calc(var(--fui-spacing) * 0);
  --fui-input-group-button-icon-sm-icon-end-padding-end: calc(var(--fui-spacing) * 0);
  --fui-input-group-input-flex: 1;
  --fui-input-group-textarea-flex: 1;
  --fui-input-group-textarea-padding-y: calc(var(--fui-spacing) * 2.5);
  --fui-dialog-content-outline: var(--fui-ring-hairline);
  --fui-dialog-content-outline-offset: var(--fui-ring-hairline-offset);
  --fui-dialog-content-background-color: var(--fui-background);
  --fui-dialog-content-outline-color: color-mix(in oklab, var(--fui-foreground) 10%, transparent);
  --fui-dialog-content-rounded: var(--fui-radius-none);
  --fui-dialog-content-shadow: var(--fui-shadow-md);
  --fui-dialog-content-font-family: var(--fui-text-small-family);
  --fui-dialog-content-font-size: var(--fui-text-small-size);
  --fui-dialog-content-line-height: var(--fui-text-small-line-height);
  --fui-dialog-content-font-weight: var(--fui-text-small-weight);
  --fui-dialog-content-letter-spacing: var(--fui-text-small-tracking);
  --fui-dialog-content-font-feature-settings: var(--fui-text-small-feature);
  --fui-dialog-content-font-variation-settings: var(--fui-text-small-variation);
  --fui-dialog-content-padding-y: calc(var(--fui-spacing) * 6);
  --fui-dialog-content-gap: calc(var(--fui-spacing) * 6);
  --fui-dialog-content-padding-x: calc(var(--fui-spacing) * 6);
  --fui-dialog-content-width: 100%;
  --fui-dialog-content-md-padding-y: calc(var(--fui-spacing) * 8);
  --fui-dialog-content-md-padding-x: calc(var(--fui-spacing) * 8);
  --fui-dialog-content-fill-display: flex;
  --fui-dialog-content-fill-flex-direction: column;
  --fui-dialog-content-scroll-display: grid;
  --fui-dialog-content-scroll-max-width: var(--container-lg);
  --fui-dialog-body-min-height: calc(var(--fui-spacing) * 0);
  --fui-dialog-body-bleed-x: calc(-1 * calc(var(--fui-spacing) * 6));
  --fui-dialog-body-padding-x: calc(var(--fui-spacing) * 6);
  --fui-dialog-body-bleed-y: calc(-1 * calc(var(--fui-spacing) * 2));
  --fui-dialog-body-padding-y: calc(var(--fui-spacing) * 2);
  --fui-dialog-body-md-bleed-x: calc(-1 * calc(var(--fui-spacing) * 8));
  --fui-dialog-body-md-padding-x: calc(var(--fui-spacing) * 8);
  --fui-dialog-title-font-family: var(--fui-text-lead-family);
  --fui-dialog-title-font-size: var(--fui-text-lead-size);
  --fui-dialog-title-line-height: 1;
  --fui-dialog-title-font-weight: 600;
  --fui-dialog-title-letter-spacing: 0.05em;
  --fui-dialog-title-font-feature-settings: var(--fui-text-lead-feature);
  --fui-dialog-title-font-variation-settings: var(--fui-text-lead-variation);
  --fui-dialog-title-text-transform: uppercase;
  --fui-dialog-overlay-background-color: color-mix(in oklab, var(--fui-foreground) 20%, transparent);
  --fui-dialog-description-text-color: var(--fui-muted-foreground);
  --fui-dialog-description-font-family: var(--fui-text-description-family);
  --fui-dialog-description-font-size: var(--fui-text-description-size);
  --fui-dialog-description-line-height: var(--fui-text-description-line-height);
  --fui-dialog-description-font-weight: var(--fui-text-description-weight);
  --fui-dialog-description-letter-spacing: var(--fui-text-description-tracking);
  --fui-dialog-description-font-feature-settings: var(--fui-text-description-feature);
  --fui-dialog-description-font-variation-settings: var(--fui-text-description-variation);
  --fui-dialog-description-margin-top: calc(var(--fui-spacing) * 0.5);
  --fui-dialog-description-link-text-decoration-line: underline;
  --fui-dialog-description-link-hover-text-color: var(--fui-foreground);
  --fui-dialog-footer-display: flex;
  --fui-dialog-footer-flex-direction: column-reverse;
  --fui-dialog-footer-gap: calc(var(--fui-spacing) * 2);
  --fui-dialog-footer-sm-flex-direction: row;
  --fui-dialog-footer-sm-justify-content: flex-end;
  --fui-dialog-header-display: flex;
  --fui-dialog-header-flex-direction: column;
  --fui-dialog-header-gap: calc(var(--fui-spacing) * 2);
  --fui-alert-dialog-content-outline: var(--fui-ring-hairline);
  --fui-alert-dialog-content-outline-offset: var(--fui-ring-hairline-offset);
  --fui-alert-dialog-content-background-color: var(--fui-background);
  --fui-alert-dialog-content-outline-color: color-mix(in oklab, var(--fui-foreground) 10%, transparent);
  --fui-alert-dialog-content-rounded: var(--fui-radius-none);
  --fui-alert-dialog-content-shadow: var(--fui-shadow-md);
  --fui-alert-dialog-content-font-family: var(--fui-text-small-family);
  --fui-alert-dialog-content-font-size: var(--fui-text-small-size);
  --fui-alert-dialog-content-line-height: var(--fui-text-small-line-height);
  --fui-alert-dialog-content-font-weight: var(--fui-text-small-weight);
  --fui-alert-dialog-content-letter-spacing: var(--fui-text-small-tracking);
  --fui-alert-dialog-content-font-feature-settings: var(--fui-text-small-feature);
  --fui-alert-dialog-content-font-variation-settings: var(--fui-text-small-variation);
  --fui-alert-dialog-content-padding-y: calc(var(--fui-spacing) * 6);
  --fui-alert-dialog-content-gap: calc(var(--fui-spacing) * 6);
  --fui-alert-dialog-content-padding-x: calc(var(--fui-spacing) * 6);
  --fui-alert-dialog-content-margin-x: auto;
  --fui-alert-dialog-content-display: grid;
  --fui-alert-dialog-content-md-padding-y: calc(var(--fui-spacing) * 8);
  --fui-alert-dialog-content-md-padding-x: calc(var(--fui-spacing) * 8);
  --fui-alert-dialog-content-md-max-width: var(--container-xs);
  --fui-alert-dialog-content-md-md-max-width: var(--container-md);
  --fui-alert-dialog-content-sm-max-width: var(--container-xs);
  --fui-alert-dialog-header-gap: calc(var(--fui-spacing) * 2);
  --fui-alert-dialog-header-display: grid;
  --fui-alert-dialog-header-place-items: center;
  --fui-alert-dialog-header-text-align: center;
  --fui-alert-dialog-header-sm-place-items: start;
  --fui-alert-dialog-header-sm-text-align: start;
  --fui-alert-dialog-footer-gap: calc(var(--fui-spacing) * 2);
  --fui-alert-dialog-footer-display: flex;
  --fui-alert-dialog-footer-flex-direction: column-reverse;
  --fui-alert-dialog-footer-sm-flex-direction: row;
  --fui-alert-dialog-footer-sm-justify-content: flex-end;
  --fui-alert-dialog-media-margin-bottom: calc(var(--fui-spacing) * 2);
  --fui-alert-dialog-media-background-color: var(--fui-muted);
  --fui-alert-dialog-media-rounded: var(--fui-radius-none);
  --fui-alert-dialog-media-size: calc(var(--fui-spacing) * 16);
  --fui-alert-dialog-media-display: inline-flex;
  --fui-alert-dialog-media-align-items: center;
  --fui-alert-dialog-media-justify-content: center;
  --fui-alert-dialog-media-icon-size: calc(var(--fui-spacing) * 8);
  --fui-alert-dialog-media-sm-grid-row: span 2 / span 2;
  --fui-alert-dialog-overlay-background-color: color-mix(in oklab, var(--fui-foreground) 20%, transparent);
  --fui-alert-dialog-title-font-family: var(--fui-text-lead-family);
  --fui-alert-dialog-title-font-size: var(--fui-text-lead-size);
  --fui-alert-dialog-title-line-height: var(--fui-text-lead-line-height);
  --fui-alert-dialog-title-font-weight: 600;
  --fui-alert-dialog-title-letter-spacing: 0.05em;
  --fui-alert-dialog-title-font-feature-settings: var(--fui-text-lead-feature);
  --fui-alert-dialog-title-font-variation-settings: var(--fui-text-lead-variation);
  --fui-alert-dialog-title-text-transform: uppercase;
  --fui-alert-dialog-description-text-color: var(--fui-muted-foreground);
  --fui-alert-dialog-description-font-family: var(--fui-text-description-family);
  --fui-alert-dialog-description-font-size: var(--fui-text-description-size);
  --fui-alert-dialog-description-line-height: var(--fui-text-description-line-height);
  --fui-alert-dialog-description-font-weight: var(--fui-text-description-weight);
  --fui-alert-dialog-description-letter-spacing: var(--fui-text-description-tracking);
  --fui-alert-dialog-description-font-feature-settings: var(--fui-text-description-feature);
  --fui-alert-dialog-description-font-variation-settings: var(--fui-text-description-variation);
  --fui-alert-dialog-description-margin-top: calc(var(--fui-spacing) * 0.5);
  --fui-alert-dialog-description-link-text-decoration-line: underline;
  --fui-alert-dialog-description-link-hover-text-color: var(--fui-foreground);
  --fui-sheet-content-background-color: var(--fui-background);
  --fui-sheet-content-shadow: var(--fui-shadow-md);
  --fui-sheet-content-font-family: var(--fui-text-small-family);
  --fui-sheet-content-font-size: var(--fui-text-small-size);
  --fui-sheet-content-line-height: var(--fui-text-small-line-height);
  --fui-sheet-content-font-weight: var(--fui-text-small-weight);
  --fui-sheet-content-letter-spacing: var(--fui-text-small-tracking);
  --fui-sheet-content-font-feature-settings: var(--fui-text-small-feature);
  --fui-sheet-content-font-variation-settings: var(--fui-text-small-variation);
  --fui-sheet-content-display: flex;
  --fui-sheet-content-flex-direction: column;
  --fui-sheet-content-top-border-bottom: var(--fui-border-default);
  --fui-sheet-content-right-border-left: var(--fui-border-default);
  --fui-sheet-content-right-width: calc(var(--fui-spacing) * 96);
  --fui-sheet-content-bottom-border-top: var(--fui-border-default);
  --fui-sheet-content-left-border-right: var(--fui-border-default);
  --fui-sheet-content-left-width: calc(var(--fui-spacing) * 96);
  --fui-sheet-body-min-height: calc(var(--fui-spacing) * 0);
  --fui-sheet-body-padding-x: calc(var(--fui-spacing) * 8);
  --fui-sheet-overlay-background-color: color-mix(in oklab, var(--fui-foreground) 20%, transparent);
  --fui-sheet-title-font-family: var(--fui-text-lead-family);
  --fui-sheet-title-font-size: var(--fui-text-lead-size);
  --fui-sheet-title-line-height: var(--fui-text-lead-line-height);
  --fui-sheet-title-font-weight: 600;
  --fui-sheet-title-letter-spacing: 0.05em;
  --fui-sheet-title-font-feature-settings: var(--fui-text-lead-feature);
  --fui-sheet-title-font-variation-settings: var(--fui-text-lead-variation);
  --fui-sheet-title-text-transform: uppercase;
  --fui-sheet-description-text-color: var(--fui-muted-foreground);
  --fui-sheet-description-font-family: var(--fui-text-description-family);
  --fui-sheet-description-font-size: var(--fui-text-description-size);
  --fui-sheet-description-line-height: var(--fui-text-description-line-height);
  --fui-sheet-description-font-weight: var(--fui-text-description-weight);
  --fui-sheet-description-letter-spacing: var(--fui-text-description-tracking);
  --fui-sheet-description-font-feature-settings: var(--fui-text-description-feature);
  --fui-sheet-description-font-variation-settings: var(--fui-text-description-variation);
  --fui-sheet-description-margin-top: calc(var(--fui-spacing) * 0.5);
  --fui-sheet-footer-margin-top: auto;
  --fui-sheet-footer-display: flex;
  --fui-sheet-footer-flex-direction: column;
  --fui-sheet-footer-gap: calc(var(--fui-spacing) * 2);
  --fui-sheet-footer-padding: calc(var(--fui-spacing) * 8);
  --fui-sheet-header-display: flex;
  --fui-sheet-header-flex-direction: column;
  --fui-sheet-header-gap: calc(var(--fui-spacing) * 1.5);
  --fui-sheet-header-padding: calc(var(--fui-spacing) * 8);
  --fui-drawer-content-background-color: var(--fui-background);
  --fui-drawer-content-font-family: var(--fui-text-small-family);
  --fui-drawer-content-font-size: var(--fui-text-small-size);
  --fui-drawer-content-line-height: var(--fui-text-small-line-height);
  --fui-drawer-content-font-weight: var(--fui-text-small-weight);
  --fui-drawer-content-letter-spacing: var(--fui-text-small-tracking);
  --fui-drawer-content-font-feature-settings: var(--fui-text-small-feature);
  --fui-drawer-content-font-variation-settings: var(--fui-text-small-variation);
  --fui-drawer-content-shadow: none;
  --fui-drawer-content-display: flex;
  --fui-drawer-content-height: auto;
  --fui-drawer-content-flex-direction: column;
  --fui-drawer-content-down-border-top: var(--fui-border-default);
  --fui-drawer-content-up-border-bottom: var(--fui-border-default);
  --fui-drawer-content-left-border-right: var(--fui-border-default);
  --fui-drawer-content-left-width: calc(var(--fui-spacing) * 96);
  --fui-drawer-content-right-border-left: var(--fui-border-default);
  --fui-drawer-content-right-width: calc(var(--fui-spacing) * 96);
  --fui-drawer-body-min-height: calc(var(--fui-spacing) * 0);
  --fui-drawer-body-padding-x: calc(var(--fui-spacing) * 4);
  --fui-drawer-handle-margin-top: calc(var(--fui-spacing) * 4);
  --fui-drawer-handle-background-color: var(--fui-muted);
  --fui-drawer-handle-rounded: var(--fui-radius-none);
  --fui-drawer-handle-height: calc(var(--fui-spacing) * 1.5);
  --fui-drawer-handle-width: calc(var(--fui-spacing) * 25);
  --fui-drawer-overlay-background-color: color-mix(in oklab, var(--fui-foreground) 20%, transparent);
  --fui-drawer-title-font-family: var(--fui-text-lead-family);
  --fui-drawer-title-font-size: var(--fui-text-lead-size);
  --fui-drawer-title-line-height: var(--fui-text-lead-line-height);
  --fui-drawer-title-font-weight: 600;
  --fui-drawer-title-letter-spacing: 0.05em;
  --fui-drawer-title-font-feature-settings: var(--fui-text-lead-feature);
  --fui-drawer-title-font-variation-settings: var(--fui-text-lead-variation);
  --fui-drawer-title-text-transform: uppercase;
  --fui-drawer-description-text-color: var(--fui-muted-foreground);
  --fui-drawer-description-font-family: var(--fui-text-description-family);
  --fui-drawer-description-font-size: var(--fui-text-description-size);
  --fui-drawer-description-line-height: var(--fui-text-description-line-height);
  --fui-drawer-description-font-weight: var(--fui-text-description-weight);
  --fui-drawer-description-letter-spacing: var(--fui-text-description-tracking);
  --fui-drawer-description-font-feature-settings: var(--fui-text-description-feature);
  --fui-drawer-description-font-variation-settings: var(--fui-text-description-variation);
  --fui-drawer-description-margin-top: calc(var(--fui-spacing) * 0.5);
  --fui-drawer-footer-margin-top: auto;
  --fui-drawer-footer-display: flex;
  --fui-drawer-footer-flex-direction: column;
  --fui-drawer-footer-gap: calc(var(--fui-spacing) * 2);
  --fui-drawer-footer-padding: calc(var(--fui-spacing) * 4);
  --fui-drawer-header-display: flex;
  --fui-drawer-header-flex-direction: column;
  --fui-drawer-header-gap: calc(var(--fui-spacing) * 1);
  --fui-drawer-header-padding: calc(var(--fui-spacing) * 4);
  --fui-drawer-header-md-gap: calc(var(--fui-spacing) * 2);
  --fui-drawer-header-md-text-align: start;
  --fui-drawer-header-vertical-text-align: center;
  --fui-drawer-header-vertical-md-text-align: start;
  --fui-popover-content-outline: var(--fui-ring-hairline);
  --fui-popover-content-outline-offset: var(--fui-ring-hairline-offset);
  --fui-popover-content-background-color: var(--fui-background);
  --fui-popover-content-text-color: var(--fui-foreground);
  --fui-popover-content-outline-color: color-mix(in oklab, var(--fui-foreground) 20%, transparent);
  --fui-popover-content-rounded: var(--fui-radius-none);
  --fui-popover-content-shadow: var(--fui-shadow-md);
  --fui-popover-content-font-family: var(--fui-text-small-family);
  --fui-popover-content-font-size: var(--fui-text-small-size);
  --fui-popover-content-line-height: var(--fui-text-small-line-height);
  --fui-popover-content-font-weight: var(--fui-text-small-weight);
  --fui-popover-content-letter-spacing: var(--fui-text-small-tracking);
  --fui-popover-content-font-feature-settings: var(--fui-text-small-feature);
  --fui-popover-content-font-variation-settings: var(--fui-text-small-variation);
  --fui-popover-content-width: calc(var(--fui-spacing) * 72);
  --fui-popover-content-padding-x: calc(var(--fui-spacing) * 4);
  --fui-popover-content-padding-y: calc(var(--fui-spacing) * 4);
  --fui-popover-content-gap: calc(var(--fui-spacing) * 4);
  --fui-popover-content-display: flex;
  --fui-popover-content-flex-direction: column;
  --fui-popover-header-font-family: var(--fui-text-small-family);
  --fui-popover-header-font-size: var(--fui-text-small-size);
  --fui-popover-header-line-height: var(--fui-text-small-line-height);
  --fui-popover-header-font-weight: var(--fui-text-small-weight);
  --fui-popover-header-letter-spacing: var(--fui-text-small-tracking);
  --fui-popover-header-font-feature-settings: var(--fui-text-small-feature);
  --fui-popover-header-font-variation-settings: var(--fui-text-small-variation);
  --fui-popover-header-gap: calc(var(--fui-spacing) * 1.5);
  --fui-popover-header-display: flex;
  --fui-popover-header-flex-direction: column;
  --fui-popover-title-font-family: var(--fui-text-caption-family);
  --fui-popover-title-font-size: var(--fui-text-caption-size);
  --fui-popover-title-line-height: var(--fui-text-caption-line-height);
  --fui-popover-title-font-weight: 600;
  --fui-popover-title-letter-spacing: var(--fui-text-caption-tracking);
  --fui-popover-title-font-feature-settings: var(--fui-text-caption-feature);
  --fui-popover-title-font-variation-settings: var(--fui-text-caption-variation);
  --fui-popover-title-text-transform: uppercase;
  --fui-popover-description-text-color: var(--fui-muted-foreground);
  --fui-popover-description-font-family: var(--fui-text-description-family);
  --fui-popover-description-font-size: var(--fui-text-description-size);
  --fui-popover-description-line-height: var(--fui-text-description-line-height);
  --fui-popover-description-font-weight: var(--fui-text-description-weight);
  --fui-popover-description-letter-spacing: var(--fui-text-description-tracking);
  --fui-popover-description-font-feature-settings: var(--fui-text-description-feature);
  --fui-popover-description-font-variation-settings: var(--fui-text-description-variation);
  --fui-hover-card-content-outline: var(--fui-ring-hairline);
  --fui-hover-card-content-outline-offset: var(--fui-ring-hairline-offset);
  --fui-hover-card-content-background-color: var(--fui-background);
  --fui-hover-card-content-text-color: var(--fui-foreground);
  --fui-hover-card-content-outline-color: color-mix(in oklab, var(--fui-foreground) 20%, transparent);
  --fui-hover-card-content-rounded: var(--fui-radius-none);
  --fui-hover-card-content-shadow: var(--fui-shadow-md);
  --fui-hover-card-content-font-family: var(--fui-text-small-family);
  --fui-hover-card-content-font-size: var(--fui-text-small-size);
  --fui-hover-card-content-line-height: var(--fui-text-small-line-height);
  --fui-hover-card-content-font-weight: var(--fui-text-small-weight);
  --fui-hover-card-content-letter-spacing: var(--fui-text-small-tracking);
  --fui-hover-card-content-font-feature-settings: var(--fui-text-small-feature);
  --fui-hover-card-content-font-variation-settings: var(--fui-text-small-variation);
  --fui-hover-card-content-width: calc(var(--fui-spacing) * 72);
  --fui-hover-card-content-padding-x: calc(var(--fui-spacing) * 4);
  --fui-hover-card-content-padding-y: calc(var(--fui-spacing) * 4);
  --fui-tooltip-content-background-color: var(--fui-foreground);
  --fui-tooltip-content-text-color: var(--fui-background);
  --fui-tooltip-content-rounded: var(--fui-radius-none);
  --fui-tooltip-content-font-family: var(--fui-text-caption-family);
  --fui-tooltip-content-font-size: var(--fui-text-caption-size);
  --fui-tooltip-content-line-height: var(--fui-text-caption-line-height);
  --fui-tooltip-content-font-weight: 400;
  --fui-tooltip-content-letter-spacing: var(--fui-text-caption-tracking);
  --fui-tooltip-content-font-feature-settings: var(--fui-text-caption-feature);
  --fui-tooltip-content-font-variation-settings: var(--fui-text-caption-variation);
  --fui-tooltip-content-gap: calc(var(--fui-spacing) * 1.5);
  --fui-tooltip-content-padding-x: calc(var(--fui-spacing) * 3);
  --fui-tooltip-content-padding-y: calc(var(--fui-spacing) * 1.5);
  --fui-tooltip-content-display: inline-flex;
  --fui-tooltip-content-align-items: center;
  --fui-tooltip-content-width: fit-content;
  --fui-tooltip-content-max-width: var(--container-xs);
  --fui-tooltip-arrow-background-color: var(--fui-foreground);
  --fui-tooltip-arrow-fill: var(--fui-foreground);
  --fui-tooltip-arrow-rounded: var(--fui-radius-none);
  --fui-tooltip-arrow-size: calc(var(--fui-spacing) * 2.5);
  --fui-dropdown-menu-content-outline: var(--fui-ring-hairline);
  --fui-dropdown-menu-content-outline-offset: var(--fui-ring-hairline-offset);
  --fui-dropdown-menu-content-background-color: var(--fui-background);
  --fui-dropdown-menu-content-text-color: var(--fui-foreground);
  --fui-dropdown-menu-content-outline-color: color-mix(in oklab, var(--fui-foreground) 20%, transparent);
  --fui-dropdown-menu-content-rounded: var(--fui-radius-none);
  --fui-dropdown-menu-content-shadow: var(--fui-shadow-md);
  --fui-dropdown-menu-content-min-width: calc(var(--fui-spacing) * 48);
  --fui-dropdown-menu-content-padding: calc(var(--fui-spacing) * 1.5);
  --fui-dropdown-menu-sub-content-outline: var(--fui-ring-hairline);
  --fui-dropdown-menu-sub-content-outline-offset: var(--fui-ring-hairline-offset);
  --fui-dropdown-menu-sub-content-background-color: var(--fui-background);
  --fui-dropdown-menu-sub-content-text-color: var(--fui-foreground);
  --fui-dropdown-menu-sub-content-outline-color: color-mix(in oklab, var(--fui-foreground) 20%, transparent);
  --fui-dropdown-menu-sub-content-rounded: var(--fui-radius-none);
  --fui-dropdown-menu-sub-content-shadow: var(--fui-shadow-md);
  --fui-dropdown-menu-sub-content-min-width: calc(var(--fui-spacing) * 36);
  --fui-dropdown-menu-sub-content-padding: calc(var(--fui-spacing) * 1.5);
  --fui-dropdown-menu-item-rounded: var(--fui-radius-none);
  --fui-dropdown-menu-item-font-family: var(--fui-text-small-family);
  --fui-dropdown-menu-item-font-size: var(--fui-text-small-size);
  --fui-dropdown-menu-item-line-height: var(--fui-text-small-line-height);
  --fui-dropdown-menu-item-font-weight: var(--fui-text-small-weight);
  --fui-dropdown-menu-item-letter-spacing: var(--fui-text-small-tracking);
  --fui-dropdown-menu-item-font-feature-settings: var(--fui-text-small-feature);
  --fui-dropdown-menu-item-font-variation-settings: var(--fui-text-small-variation);
  --fui-dropdown-menu-item-gap: calc(var(--fui-spacing) * 2.5);
  --fui-dropdown-menu-item-padding-y: calc(var(--fui-spacing) * 2);
  --fui-dropdown-menu-item-display: flex;
  --fui-dropdown-menu-item-align-items: center;
  --fui-dropdown-menu-item-focus-background-color: var(--fui-accent);
  --fui-dropdown-menu-item-focus-text-color: var(--fui-accent-foreground);
  --fui-dropdown-menu-item-icon-size: calc(var(--fui-spacing) * 3.5);
  --fui-dropdown-menu-item-destructive-text-color: var(--fui-destructive);
  --fui-dropdown-menu-item-destructive-icon-color: var(--fui-destructive);
  --fui-dropdown-menu-item-destructive-focus-background-color: color-mix(in oklab, var(--fui-destructive) 10%, transparent);
  --fui-dropdown-menu-item-destructive-focus-text-color: var(--fui-destructive);
  --fui-dropdown-menu-item-default-padding-x: calc(var(--fui-spacing) * 3);
  --fui-dropdown-menu-item-inset-padding-start: calc(var(--fui-spacing) * 9.5);
  --fui-dropdown-menu-item-inset-padding-end: calc(var(--fui-spacing) * 3);
  --fui-dropdown-menu-item-indicator-padding-start: calc(var(--fui-spacing) * 3);
  --fui-dropdown-menu-item-indicator-padding-end: calc(var(--fui-spacing) * 8);
  --fui-dropdown-menu-sub-trigger-rounded: var(--fui-radius-none);
  --fui-dropdown-menu-sub-trigger-font-family: var(--fui-text-small-family);
  --fui-dropdown-menu-sub-trigger-font-size: var(--fui-text-small-size);
  --fui-dropdown-menu-sub-trigger-line-height: var(--fui-text-small-line-height);
  --fui-dropdown-menu-sub-trigger-font-weight: var(--fui-text-small-weight);
  --fui-dropdown-menu-sub-trigger-letter-spacing: var(--fui-text-small-tracking);
  --fui-dropdown-menu-sub-trigger-font-feature-settings: var(--fui-text-small-feature);
  --fui-dropdown-menu-sub-trigger-font-variation-settings: var(--fui-text-small-variation);
  --fui-dropdown-menu-sub-trigger-gap: calc(var(--fui-spacing) * 2.5);
  --fui-dropdown-menu-sub-trigger-padding-y: calc(var(--fui-spacing) * 2);
  --fui-dropdown-menu-sub-trigger-display: flex;
  --fui-dropdown-menu-sub-trigger-align-items: center;
  --fui-dropdown-menu-sub-trigger-focus-background-color: var(--fui-accent);
  --fui-dropdown-menu-sub-trigger-focus-text-color: var(--fui-accent-foreground);
  --fui-dropdown-menu-sub-trigger-open-background-color: var(--fui-accent);
  --fui-dropdown-menu-sub-trigger-open-text-color: var(--fui-accent-foreground);
  --fui-dropdown-menu-sub-trigger-icon-size: calc(var(--fui-spacing) * 3.5);
  --fui-dropdown-menu-sub-trigger-default-padding-x: calc(var(--fui-spacing) * 3);
  --fui-dropdown-menu-sub-trigger-inset-padding-start: calc(var(--fui-spacing) * 9.5);
  --fui-dropdown-menu-sub-trigger-inset-padding-end: calc(var(--fui-spacing) * 3);
  --fui-dropdown-menu-label-text-color: var(--fui-muted-foreground);
  --fui-dropdown-menu-label-font-family: var(--fui-text-caption-family);
  --fui-dropdown-menu-label-font-size: var(--fui-text-caption-size);
  --fui-dropdown-menu-label-line-height: var(--fui-text-caption-line-height);
  --fui-dropdown-menu-label-font-weight: 600;
  --fui-dropdown-menu-label-letter-spacing: 0.05em;
  --fui-dropdown-menu-label-font-feature-settings: var(--fui-text-caption-feature);
  --fui-dropdown-menu-label-font-variation-settings: var(--fui-text-caption-variation);
  --fui-dropdown-menu-label-text-transform: uppercase;
  --fui-dropdown-menu-label-padding-y: calc(var(--fui-spacing) * 2);
  --fui-dropdown-menu-label-default-padding-x: calc(var(--fui-spacing) * 3);
  --fui-dropdown-menu-label-inset-padding-start: calc(var(--fui-spacing) * 9.5);
  --fui-dropdown-menu-label-inset-padding-end: calc(var(--fui-spacing) * 3);
  --fui-dropdown-menu-separator-bleed-x: calc(-1 * calc(var(--fui-spacing) * 1.5));
  --fui-dropdown-menu-separator-margin-y: calc(var(--fui-spacing) * 1.5);
  --fui-dropdown-menu-separator-background-color: color-mix(in oklab, var(--fui-border) 50%, transparent);
  --fui-dropdown-menu-separator-height: 1px;
  --fui-dropdown-menu-shortcut-text-color: var(--fui-muted-foreground);
  --fui-dropdown-menu-shortcut-font-family: var(--fui-text-caption-family);
  --fui-dropdown-menu-shortcut-font-size: var(--fui-text-caption-size);
  --fui-dropdown-menu-shortcut-line-height: var(--fui-text-caption-line-height);
  --fui-dropdown-menu-shortcut-font-weight: 400;
  --fui-dropdown-menu-shortcut-letter-spacing: 0.1em;
  --fui-dropdown-menu-shortcut-font-feature-settings: var(--fui-text-caption-feature);
  --fui-dropdown-menu-shortcut-font-variation-settings: var(--fui-text-caption-variation);
  --fui-dropdown-menu-shortcut-margin-start: auto;
  --fui-context-menu-content-outline: var(--fui-ring-hairline);
  --fui-context-menu-content-outline-offset: var(--fui-ring-hairline-offset);
  --fui-context-menu-content-background-color: var(--fui-background);
  --fui-context-menu-content-text-color: var(--fui-foreground);
  --fui-context-menu-content-outline-color: color-mix(in oklab, var(--fui-foreground) 20%, transparent);
  --fui-context-menu-content-rounded: var(--fui-radius-none);
  --fui-context-menu-content-shadow: var(--fui-shadow-md);
  --fui-context-menu-content-min-width: calc(var(--fui-spacing) * 48);
  --fui-context-menu-content-padding: calc(var(--fui-spacing) * 1.5);
  --fui-context-menu-sub-content-outline: var(--fui-ring-hairline);
  --fui-context-menu-sub-content-outline-offset: var(--fui-ring-hairline-offset);
  --fui-context-menu-sub-content-background-color: var(--fui-background);
  --fui-context-menu-sub-content-text-color: var(--fui-foreground);
  --fui-context-menu-sub-content-outline-color: color-mix(in oklab, var(--fui-foreground) 20%, transparent);
  --fui-context-menu-sub-content-rounded: var(--fui-radius-none);
  --fui-context-menu-sub-content-shadow: var(--fui-shadow-md);
  --fui-context-menu-sub-content-min-width: calc(var(--fui-spacing) * 32);
  --fui-context-menu-sub-content-padding: calc(var(--fui-spacing) * 1.5);
  --fui-context-menu-item-rounded: var(--fui-radius-none);
  --fui-context-menu-item-font-family: var(--fui-text-small-family);
  --fui-context-menu-item-font-size: var(--fui-text-small-size);
  --fui-context-menu-item-line-height: var(--fui-text-small-line-height);
  --fui-context-menu-item-font-weight: var(--fui-text-small-weight);
  --fui-context-menu-item-letter-spacing: var(--fui-text-small-tracking);
  --fui-context-menu-item-font-feature-settings: var(--fui-text-small-feature);
  --fui-context-menu-item-font-variation-settings: var(--fui-text-small-variation);
  --fui-context-menu-item-gap: calc(var(--fui-spacing) * 2.5);
  --fui-context-menu-item-padding-y: calc(var(--fui-spacing) * 2);
  --fui-context-menu-item-display: flex;
  --fui-context-menu-item-align-items: center;
  --fui-context-menu-item-focus-background-color: var(--fui-accent);
  --fui-context-menu-item-focus-text-color: var(--fui-accent-foreground);
  --fui-context-menu-item-icon-size: calc(var(--fui-spacing) * 3.5);
  --fui-context-menu-item-destructive-text-color: var(--fui-destructive);
  --fui-context-menu-item-destructive-icon-color: var(--fui-destructive);
  --fui-context-menu-item-destructive-focus-background-color: color-mix(in oklab, var(--fui-destructive) 10%, transparent);
  --fui-context-menu-item-destructive-focus-text-color: var(--fui-destructive);
  --fui-context-menu-item-default-padding-x: calc(var(--fui-spacing) * 3);
  --fui-context-menu-item-inset-padding-start: calc(var(--fui-spacing) * 9.5);
  --fui-context-menu-item-inset-padding-end: calc(var(--fui-spacing) * 3);
  --fui-context-menu-item-indicator-padding-start: calc(var(--fui-spacing) * 3);
  --fui-context-menu-item-indicator-padding-end: calc(var(--fui-spacing) * 8);
  --fui-context-menu-sub-trigger-rounded: var(--fui-radius-none);
  --fui-context-menu-sub-trigger-font-family: var(--fui-text-small-family);
  --fui-context-menu-sub-trigger-font-size: var(--fui-text-small-size);
  --fui-context-menu-sub-trigger-line-height: var(--fui-text-small-line-height);
  --fui-context-menu-sub-trigger-font-weight: var(--fui-text-small-weight);
  --fui-context-menu-sub-trigger-letter-spacing: var(--fui-text-small-tracking);
  --fui-context-menu-sub-trigger-font-feature-settings: var(--fui-text-small-feature);
  --fui-context-menu-sub-trigger-font-variation-settings: var(--fui-text-small-variation);
  --fui-context-menu-sub-trigger-gap: calc(var(--fui-spacing) * 2.5);
  --fui-context-menu-sub-trigger-padding-y: calc(var(--fui-spacing) * 2);
  --fui-context-menu-sub-trigger-display: flex;
  --fui-context-menu-sub-trigger-align-items: center;
  --fui-context-menu-sub-trigger-focus-background-color: var(--fui-accent);
  --fui-context-menu-sub-trigger-focus-text-color: var(--fui-accent-foreground);
  --fui-context-menu-sub-trigger-open-background-color: var(--fui-accent);
  --fui-context-menu-sub-trigger-open-text-color: var(--fui-accent-foreground);
  --fui-context-menu-sub-trigger-icon-size: calc(var(--fui-spacing) * 3.5);
  --fui-context-menu-sub-trigger-default-padding-x: calc(var(--fui-spacing) * 3);
  --fui-context-menu-sub-trigger-inset-padding-start: calc(var(--fui-spacing) * 9.5);
  --fui-context-menu-sub-trigger-inset-padding-end: calc(var(--fui-spacing) * 3);
  --fui-context-menu-label-text-color: var(--fui-muted-foreground);
  --fui-context-menu-label-font-family: var(--fui-text-caption-family);
  --fui-context-menu-label-font-size: var(--fui-text-caption-size);
  --fui-context-menu-label-line-height: var(--fui-text-caption-line-height);
  --fui-context-menu-label-font-weight: 600;
  --fui-context-menu-label-letter-spacing: 0.05em;
  --fui-context-menu-label-font-feature-settings: var(--fui-text-caption-feature);
  --fui-context-menu-label-font-variation-settings: var(--fui-text-caption-variation);
  --fui-context-menu-label-text-transform: uppercase;
  --fui-context-menu-label-padding-y: calc(var(--fui-spacing) * 2);
  --fui-context-menu-label-default-padding-x: calc(var(--fui-spacing) * 3);
  --fui-context-menu-label-inset-padding-start: calc(var(--fui-spacing) * 9.5);
  --fui-context-menu-label-inset-padding-end: calc(var(--fui-spacing) * 3);
  --fui-context-menu-separator-bleed-x: calc(-1 * calc(var(--fui-spacing) * 1.5));
  --fui-context-menu-separator-margin-y: calc(var(--fui-spacing) * 1.5);
  --fui-context-menu-separator-background-color: color-mix(in oklab, var(--fui-border) 50%, transparent);
  --fui-context-menu-separator-height: 1px;
  --fui-context-menu-shortcut-text-color: var(--fui-muted-foreground);
  --fui-context-menu-shortcut-font-family: var(--fui-text-caption-family);
  --fui-context-menu-shortcut-font-size: var(--fui-text-caption-size);
  --fui-context-menu-shortcut-line-height: var(--fui-text-caption-line-height);
  --fui-context-menu-shortcut-font-weight: 400;
  --fui-context-menu-shortcut-letter-spacing: 0.1em;
  --fui-context-menu-shortcut-font-feature-settings: var(--fui-text-caption-feature);
  --fui-context-menu-shortcut-font-variation-settings: var(--fui-text-caption-variation);
  --fui-context-menu-shortcut-margin-start: auto;
  --fui-navigation-menu-trigger-rounded: var(--fui-radius-none);
  --fui-navigation-menu-trigger-font-family: var(--fui-text-ui-family);
  --fui-navigation-menu-trigger-font-size: var(--fui-text-ui-size);
  --fui-navigation-menu-trigger-line-height: var(--fui-text-ui-line-height);
  --fui-navigation-menu-trigger-font-weight: var(--fui-text-ui-weight);
  --fui-navigation-menu-trigger-letter-spacing: var(--fui-text-ui-tracking);
  --fui-navigation-menu-trigger-font-feature-settings: var(--fui-text-ui-feature);
  --fui-navigation-menu-trigger-font-variation-settings: var(--fui-text-ui-variation);
  --fui-navigation-menu-trigger-height: calc(var(--fui-spacing) * 9);
  --fui-navigation-menu-trigger-padding-x: calc(var(--fui-spacing) * 4.5);
  --fui-navigation-menu-trigger-padding-y: calc(var(--fui-spacing) * 2.5);
  --fui-navigation-menu-trigger-display: inline-flex;
  --fui-navigation-menu-trigger-width: max-content;
  --fui-navigation-menu-trigger-align-items: center;
  --fui-navigation-menu-trigger-justify-content: center;
  --fui-navigation-menu-trigger-hover-background-color: var(--fui-muted);
  --fui-navigation-menu-trigger-focus-background-color: var(--fui-muted);
  --fui-navigation-menu-trigger-open-background-color: color-mix(in oklab, var(--fui-muted) 50%, transparent);
  --fui-navigation-menu-trigger-icon-size: calc(var(--fui-spacing) * 3);
  --fui-navigation-menu-content-padding-y: calc(var(--fui-spacing) * 2.5);
  --fui-navigation-menu-content-padding-start: calc(var(--fui-spacing) * 2.5);
  --fui-navigation-menu-content-padding-end: calc(var(--fui-spacing) * 3);
  --fui-navigation-menu-content-width: max-content;
  --fui-navigation-menu-content-own-outline: var(--fui-ring-hairline);
  --fui-navigation-menu-content-own-outline-offset: var(--fui-ring-hairline-offset);
  --fui-navigation-menu-content-own-background-color: var(--fui-background);
  --fui-navigation-menu-content-own-text-color: var(--fui-foreground);
  --fui-navigation-menu-content-own-outline-color: color-mix(in oklab, var(--fui-foreground) 20%, transparent);
  --fui-navigation-menu-content-own-rounded: var(--fui-radius-none);
  --fui-navigation-menu-content-own-shadow: var(--fui-shadow-md);
  --fui-navigation-menu-content-own-margin-top: calc(var(--fui-spacing) * 1.5);
  --fui-navigation-menu-link-rounded: var(--fui-radius-none);
  --fui-navigation-menu-link-font-family: var(--fui-text-small-family);
  --fui-navigation-menu-link-font-size: var(--fui-text-small-size);
  --fui-navigation-menu-link-line-height: var(--fui-text-small-line-height);
  --fui-navigation-menu-link-font-weight: var(--fui-text-small-weight);
  --fui-navigation-menu-link-letter-spacing: var(--fui-text-small-tracking);
  --fui-navigation-menu-link-font-feature-settings: var(--fui-text-small-feature);
  --fui-navigation-menu-link-font-variation-settings: var(--fui-text-small-variation);
  --fui-navigation-menu-link-gap: calc(var(--fui-spacing) * 1.5);
  --fui-navigation-menu-link-padding: calc(var(--fui-spacing) * 3);
  --fui-navigation-menu-link-display: flex;
  --fui-navigation-menu-link-align-items: center;
  --fui-navigation-menu-link-hover-background-color: var(--fui-muted);
  --fui-navigation-menu-link-focus-background-color: var(--fui-muted);
  --fui-navigation-menu-link-current-background-color: color-mix(in oklab, var(--fui-muted) 50%, transparent);
  --fui-navigation-menu-link-icon-size: calc(var(--fui-spacing) * 3.5);
  --fui-navigation-menu-link-bar-font-family: var(--fui-text-ui-family);
  --fui-navigation-menu-link-bar-font-size: var(--fui-text-ui-size);
  --fui-navigation-menu-link-bar-line-height: var(--fui-text-ui-line-height);
  --fui-navigation-menu-link-bar-font-weight: var(--fui-text-ui-weight);
  --fui-navigation-menu-link-bar-letter-spacing: var(--fui-text-ui-tracking);
  --fui-navigation-menu-link-bar-font-feature-settings: var(--fui-text-ui-feature);
  --fui-navigation-menu-link-bar-font-variation-settings: var(--fui-text-ui-variation);
  --fui-navigation-menu-link-bar-height: calc(var(--fui-spacing) * 9);
  --fui-navigation-menu-link-bar-padding-x: calc(var(--fui-spacing) * 4.5);
  --fui-navigation-menu-link-bar-padding-y: calc(var(--fui-spacing) * 2.5);
  --fui-navigation-menu-viewport-outline: var(--fui-ring-hairline);
  --fui-navigation-menu-viewport-outline-offset: var(--fui-ring-hairline-offset);
  --fui-navigation-menu-viewport-background-color: var(--fui-background);
  --fui-navigation-menu-viewport-text-color: var(--fui-foreground);
  --fui-navigation-menu-viewport-outline-color: color-mix(in oklab, var(--fui-foreground) 20%, transparent);
  --fui-navigation-menu-viewport-rounded: var(--fui-radius-none);
  --fui-navigation-menu-viewport-shadow: var(--fui-shadow-md);
  --fui-navigation-menu-viewport-margin-top: calc(var(--fui-spacing) * 1.5);
  --fui-navigation-menu-indicator-arrow-background-color: var(--fui-border);
  --fui-navigation-menu-indicator-arrow-shadow: var(--fui-shadow-md);
  --fui-navigation-menu-indicator-arrow-size: calc(var(--fui-spacing) * 2);
  --fui-navigation-menu-display: flex;
  --fui-navigation-menu-max-width: max-content;
  --fui-navigation-menu-flex: 1;
  --fui-navigation-menu-align-items: center;
  --fui-navigation-menu-justify-content: center;
  --fui-navigation-menu-indicator-display: flex;
  --fui-navigation-menu-indicator-height: calc(var(--fui-spacing) * 1.5);
  --fui-navigation-menu-indicator-align-items: flex-end;
  --fui-navigation-menu-indicator-justify-content: center;
  --fui-navigation-menu-list-display: flex;
  --fui-navigation-menu-list-flex: 1;
  --fui-navigation-menu-list-gap: calc(var(--fui-spacing) * 0);
  --fui-navigation-menu-list-align-items: center;
  --fui-navigation-menu-list-justify-content: center;
  --fui-mega-menu-trigger-font-family: var(--fui-text-ui-family);
  --fui-mega-menu-trigger-font-size: var(--fui-text-ui-size);
  --fui-mega-menu-trigger-line-height: var(--fui-text-ui-line-height);
  --fui-mega-menu-trigger-font-weight: var(--fui-text-ui-weight);
  --fui-mega-menu-trigger-letter-spacing: var(--fui-text-ui-tracking);
  --fui-mega-menu-trigger-font-feature-settings: var(--fui-text-ui-feature);
  --fui-mega-menu-trigger-font-variation-settings: var(--fui-text-ui-variation);
  --fui-mega-menu-trigger-display: inline-flex;
  --fui-mega-menu-trigger-align-items: center;
  --fui-mega-menu-trigger-justify-content: center;
  --fui-mega-menu-trigger-icon-size: calc(var(--fui-spacing) * 3);
  --fui-mega-menu-content-background-color: var(--fui-background);
  --fui-mega-menu-content-border-top: var(--fui-border-default);
  --fui-mega-menu-content-border-color: var(--fui-border);
  --fui-mega-menu-content-width: 100%;
  --fui-mega-menu-viewport-shadow: var(--fui-shadow-lg);
  --fui-mega-menu-width: 100%;
  --fui-mega-menu-item-display: flex;
  --fui-mega-menu-list-display: flex;
  --fui-mega-menu-list-height: 100%;
  --fui-mega-menu-list-align-items: center;
  --fui-mega-menu-list-gap: calc(var(--fui-spacing) * 1);
  --fui-toast-background-color: var(--fui-background);
  --fui-toast-text-color: var(--fui-foreground);
  --fui-toast-border: var(--fui-border-default);
  --fui-toast-rounded: var(--fui-radius-none);
  --fui-toast-shadow: var(--fui-shadow-md);
  --fui-toast-font-family: var(--fui-text-note-family);
  --fui-toast-font-size: var(--fui-text-note-size);
  --fui-toast-line-height: var(--fui-text-note-line-height);
  --fui-toast-font-weight: var(--fui-text-note-weight);
  --fui-toast-letter-spacing: var(--fui-text-note-tracking);
  --fui-toast-font-feature-settings: var(--fui-text-note-feature);
  --fui-toast-font-variation-settings: var(--fui-text-note-variation);
  --fui-toast-width: calc(var(--fui-spacing) * 89);
  --fui-toast-padding-x: calc(var(--fui-spacing) * 4);
  --fui-toast-padding-y: calc(var(--fui-spacing) * 4);
  --fui-toast-gap: calc(var(--fui-spacing) * 1.5);
  --fui-toast-icon-size: calc(var(--fui-spacing) * 4);
  --fui-toast-info-border-color: var(--fui-info);
  --fui-toast-info-icon-color: var(--fui-info);
  --fui-toast-positive-border-color: var(--fui-positive);
  --fui-toast-positive-icon-color: var(--fui-positive);
  --fui-toast-warning-border-color: var(--fui-warning);
  --fui-toast-warning-icon-color: var(--fui-warning);
  --fui-toast-destructive-background-color: var(--fui-card);
  --fui-toast-destructive-text-color: var(--fui-destructive);
  --fui-toast-content-gap: calc(var(--fui-spacing) * 0.5);
  --fui-toast-action-border: var(--fui-border-default);
  --fui-toast-action-border-color: transparent;
  --fui-toast-action-rounded: var(--fui-radius-none);
  --fui-toast-action-font-family: var(--fui-text-caption-family);
  --fui-toast-action-font-size: var(--fui-text-caption-size);
  --fui-toast-action-line-height: var(--fui-text-caption-line-height);
  --fui-toast-action-font-weight: 600;
  --fui-toast-action-letter-spacing: 0.1em;
  --fui-toast-action-font-feature-settings: var(--fui-text-caption-feature);
  --fui-toast-action-font-variation-settings: var(--fui-text-caption-variation);
  --fui-toast-action-text-transform: uppercase;
  --fui-toast-action-background-color: var(--fui-foreground);
  --fui-toast-action-text-color: var(--fui-background);
  --fui-toast-action-height: calc(var(--fui-spacing) * 6);
  --fui-toast-action-padding-x: calc(var(--fui-spacing) * 2);
  --fui-toast-action-pressed-translate: 0 1px;
  --fui-toast-cancel-border: var(--fui-border-default);
  --fui-toast-cancel-border-color: transparent;
  --fui-toast-cancel-rounded: var(--fui-radius-none);
  --fui-toast-cancel-font-family: var(--fui-text-caption-family);
  --fui-toast-cancel-font-size: var(--fui-text-caption-size);
  --fui-toast-cancel-line-height: var(--fui-text-caption-line-height);
  --fui-toast-cancel-font-weight: 600;
  --fui-toast-cancel-letter-spacing: 0.1em;
  --fui-toast-cancel-font-feature-settings: var(--fui-text-caption-feature);
  --fui-toast-cancel-font-variation-settings: var(--fui-text-caption-variation);
  --fui-toast-cancel-text-transform: uppercase;
  --fui-toast-cancel-background-color: color-mix(in oklab, var(--fui-foreground) 8%, transparent);
  --fui-toast-cancel-text-color: var(--fui-foreground);
  --fui-toast-cancel-height: calc(var(--fui-spacing) * 6);
  --fui-toast-cancel-padding-x: calc(var(--fui-spacing) * 2);
  --fui-toast-cancel-pressed-translate: 0 1px;
  --fui-toast-title-font-family: var(--fui-text-lead-family);
  --fui-toast-title-font-size: var(--fui-text-lead-size);
  --fui-toast-title-line-height: var(--fui-text-lead-line-height);
  --fui-toast-title-font-weight: 600;
  --fui-toast-title-letter-spacing: 0.05em;
  --fui-toast-title-font-feature-settings: var(--fui-text-lead-feature);
  --fui-toast-title-font-variation-settings: var(--fui-text-lead-variation);
  --fui-toast-title-text-transform: uppercase;
  --fui-toast-description-text-color: var(--fui-muted-foreground);
  --fui-toast-description-font-family: var(--fui-text-description-family);
  --fui-toast-description-font-size: var(--fui-text-description-size);
  --fui-toast-description-line-height: var(--fui-text-description-line-height);
  --fui-toast-description-font-weight: var(--fui-text-description-weight);
  --fui-toast-description-letter-spacing: var(--fui-text-description-tracking);
  --fui-toast-description-font-feature-settings: var(--fui-text-description-feature);
  --fui-toast-description-font-variation-settings: var(--fui-text-description-variation);
  --fui-separator-background-color: var(--fui-border);
  --fui-separator-flex-shrink: 0;
  --fui-separator-horizontal-height: 1px;
  --fui-separator-horizontal-width: 100%;
  --fui-separator-vertical-width: 1px;
  --fui-separator-vertical-align-self: stretch;
  --fui-card-outline: var(--fui-ring-hairline);
  --fui-card-outline-offset: var(--fui-ring-hairline-offset);
  --fui-card-background-color: var(--fui-card);
  --fui-card-text-color: var(--fui-card-foreground);
  --fui-card-outline-color: color-mix(in oklab, var(--fui-foreground) 5%, transparent);
  --fui-card-rounded: var(--fui-radius-none);
  --fui-card-shadow: var(--fui-shadow-sm);
  --fui-card-font-family: var(--fui-text-small-family);
  --fui-card-font-size: var(--fui-text-small-size);
  --fui-card-line-height: var(--fui-text-small-line-height);
  --fui-card-font-weight: var(--fui-text-small-weight);
  --fui-card-letter-spacing: var(--fui-text-small-tracking);
  --fui-card-font-feature-settings: var(--fui-text-small-feature);
  --fui-card-font-variation-settings: var(--fui-text-small-variation);
  --fui-card-padding-y: calc(var(--fui-spacing) * 6);
  --fui-card-contain: inline-size;
  --fui-card-gap: calc(var(--fui-spacing) * 6);
  --fui-card-display: flex;
  --fui-card-flex-direction: column;
  --fui-card-md-padding-y: calc(var(--fui-spacing) * 8);
  --fui-card-md-gap: calc(var(--fui-spacing) * 8);
  --fui-card-bare-outline: var(--fui-ring-none);
  --fui-card-bare-outline-offset: var(--fui-ring-none-offset);
  --fui-card-bare-shadow: none;
  --fui-card-bare-padding-y: calc(var(--fui-spacing) * 0);
  --fui-card-bare-card-header-padding-x: calc(var(--fui-spacing) * 0);
  --fui-card-bare-card-content-padding-x: calc(var(--fui-spacing) * 0);
  --fui-card-bare-card-footer-padding-x: calc(var(--fui-spacing) * 0);
  --fui-card-header-gap: calc(var(--fui-spacing) * 1.5);
  --fui-card-header-padding-x: calc(var(--fui-spacing) * 8);
  --fui-card-header-display: grid;
  --fui-card-header-grid-columns: repeat(1, minmax(0, 1fr));
  --fui-card-header-align-items: flex-start;
  --fui-card-content-padding-x: calc(var(--fui-spacing) * 8);
  --fui-card-footer-padding-x: calc(var(--fui-spacing) * 8);
  --fui-card-footer-display: flex;
  --fui-card-footer-align-items: center;
  --fui-card-title-font-family: var(--fui-text-lead-family);
  --fui-card-title-font-size: var(--fui-text-lead-size);
  --fui-card-title-line-height: var(--fui-text-lead-line-height);
  --fui-card-title-font-weight: 600;
  --fui-card-title-letter-spacing: 0.05em;
  --fui-card-title-font-feature-settings: var(--fui-text-lead-feature);
  --fui-card-title-font-variation-settings: var(--fui-text-lead-variation);
  --fui-card-title-text-transform: uppercase;
  --fui-card-description-text-color: var(--fui-muted-foreground);
  --fui-card-description-font-family: var(--fui-text-description-family);
  --fui-card-description-font-size: var(--fui-text-description-size);
  --fui-card-description-line-height: var(--fui-text-description-line-height);
  --fui-card-description-font-weight: var(--fui-text-description-weight);
  --fui-card-description-letter-spacing: var(--fui-text-description-tracking);
  --fui-card-description-font-feature-settings: var(--fui-text-description-feature);
  --fui-card-description-font-variation-settings: var(--fui-text-description-variation);
  --fui-card-action-align-self: flex-start;
  --fui-card-action-justify-self: flex-start;
  --fui-alert-background-color: var(--fui-card);
  --fui-alert-text-color: var(--fui-card-foreground);
  --fui-alert-border: var(--fui-border-default);
  --fui-alert-border-color: var(--fui-border);
  --fui-alert-rounded: var(--fui-radius-none);
  --fui-alert-font-family: var(--fui-text-small-family);
  --fui-alert-font-size: var(--fui-text-small-size);
  --fui-alert-line-height: var(--fui-text-small-line-height);
  --fui-alert-font-weight: var(--fui-text-small-weight);
  --fui-alert-letter-spacing: var(--fui-text-small-tracking);
  --fui-alert-font-feature-settings: var(--fui-text-small-feature);
  --fui-alert-font-variation-settings: var(--fui-text-small-variation);
  --fui-alert-gap: calc(var(--fui-spacing) * 1);
  --fui-alert-padding-x: calc(var(--fui-spacing) * 4);
  --fui-alert-padding-y: calc(var(--fui-spacing) * 3);
  --fui-alert-display: grid;
  --fui-alert-width: 100%;
  --fui-alert-justify-content: flex-start;
  --fui-alert-text-align: start;
  --fui-alert-after-border-start: var(--fui-border-focus);
  --fui-alert-after-border-color: var(--fui-foreground);
  --fui-alert-icon-size: calc(var(--fui-spacing) * 4);
  --fui-alert-info-border-color: var(--fui-info);
  --fui-alert-info-icon-color: var(--fui-info);
  --fui-alert-info-after-border-color: var(--fui-info);
  --fui-alert-success-border-color: var(--fui-positive);
  --fui-alert-success-icon-color: var(--fui-positive);
  --fui-alert-success-after-border-color: var(--fui-positive);
  --fui-alert-warning-border-color: var(--fui-warning);
  --fui-alert-warning-icon-color: var(--fui-warning);
  --fui-alert-warning-after-border-color: var(--fui-warning);
  --fui-alert-error-background-color: var(--fui-card);
  --fui-alert-error-text-color: var(--fui-destructive);
  --fui-alert-error-after-border-color: var(--fui-destructive);
  --fui-alert-title-font-family: var(--fui-text-ui-family);
  --fui-alert-title-font-size: var(--fui-text-ui-size);
  --fui-alert-title-line-height: var(--fui-text-ui-line-height);
  --fui-alert-title-font-weight: 600;
  --fui-alert-title-letter-spacing: var(--fui-text-ui-tracking);
  --fui-alert-title-font-feature-settings: var(--fui-text-ui-feature);
  --fui-alert-title-font-variation-settings: var(--fui-text-ui-variation);
  --fui-alert-title-link-text-decoration-line: underline;
  --fui-alert-title-link-hover-text-color: var(--fui-foreground);
  --fui-alert-description-text-color: var(--fui-muted-foreground);
  --fui-alert-description-font-family: var(--fui-text-small-family);
  --fui-alert-description-font-size: var(--fui-text-small-size);
  --fui-alert-description-line-height: var(--fui-text-small-line-height);
  --fui-alert-description-font-weight: var(--fui-text-small-weight);
  --fui-alert-description-letter-spacing: var(--fui-text-small-tracking);
  --fui-alert-description-font-feature-settings: var(--fui-text-small-feature);
  --fui-alert-description-font-variation-settings: var(--fui-text-small-variation);
  --fui-alert-description-link-text-decoration-line: underline;
  --fui-alert-description-link-hover-text-color: var(--fui-foreground);
  --fui-alert-description-neutral-text-color: var(--fui-muted-foreground);
  --fui-alert-description-error-text-color: color-mix(in oklab, var(--fui-destructive) 90%, transparent);
  --fui-empty-rounded: var(--fui-radius-none);
  --fui-empty-gap: calc(var(--fui-spacing) * 4);
  --fui-empty-padding: calc(var(--fui-spacing) * 6);
  --fui-empty-display: flex;
  --fui-empty-width: 100%;
  --fui-empty-min-width: calc(var(--fui-spacing) * 0);
  --fui-empty-flex: 1;
  --fui-empty-flex-direction: column;
  --fui-empty-align-items: center;
  --fui-empty-justify-content: center;
  --fui-empty-text-align: center;
  --fui-empty-md-padding: calc(var(--fui-spacing) * 12);
  --fui-empty-content-font-family: var(--fui-text-small-family);
  --fui-empty-content-font-size: var(--fui-text-small-size);
  --fui-empty-content-line-height: var(--fui-text-small-line-height);
  --fui-empty-content-font-weight: var(--fui-text-small-weight);
  --fui-empty-content-letter-spacing: var(--fui-text-small-tracking);
  --fui-empty-content-font-feature-settings: var(--fui-text-small-feature);
  --fui-empty-content-font-variation-settings: var(--fui-text-small-variation);
  --fui-empty-content-gap: calc(var(--fui-spacing) * 4);
  --fui-empty-content-display: flex;
  --fui-empty-content-width: 100%;
  --fui-empty-content-max-width: var(--container-sm);
  --fui-empty-content-min-width: calc(var(--fui-spacing) * 0);
  --fui-empty-content-flex-direction: column;
  --fui-empty-content-align-items: center;
  --fui-empty-title-font-family: var(--fui-text-lead-family);
  --fui-empty-title-font-size: var(--fui-text-lead-size);
  --fui-empty-title-line-height: var(--fui-text-lead-line-height);
  --fui-empty-title-font-weight: 600;
  --fui-empty-title-letter-spacing: 0.05em;
  --fui-empty-title-font-feature-settings: var(--fui-text-lead-feature);
  --fui-empty-title-font-variation-settings: var(--fui-text-lead-variation);
  --fui-empty-title-text-transform: uppercase;
  --fui-empty-description-text-color: var(--fui-muted-foreground);
  --fui-empty-description-font-family: var(--fui-text-description-family);
  --fui-empty-description-font-size: var(--fui-text-description-size);
  --fui-empty-description-line-height: 1.625;
  --fui-empty-description-font-weight: var(--fui-text-description-weight);
  --fui-empty-description-letter-spacing: var(--fui-text-description-tracking);
  --fui-empty-description-font-feature-settings: var(--fui-text-description-feature);
  --fui-empty-description-font-variation-settings: var(--fui-text-description-variation);
  --fui-empty-description-margin-top: calc(var(--fui-spacing) * 0.5);
  --fui-empty-description-link-text-decoration-line: underline;
  --fui-empty-description-link-hover-text-color: var(--fui-primary);
  --fui-empty-media-rounded: var(--fui-radius-none);
  --fui-empty-media-margin-bottom: calc(var(--fui-spacing) * 2);
  --fui-empty-media-display: flex;
  --fui-empty-media-flex-shrink: 0;
  --fui-empty-media-align-items: center;
  --fui-empty-media-justify-content: center;
  --fui-empty-media-default-background-color: transparent;
  --fui-empty-media-icon-background-color: var(--fui-muted);
  --fui-empty-media-icon-text-color: var(--fui-foreground);
  --fui-empty-media-icon-size: calc(var(--fui-spacing) * 10);
  --fui-empty-media-icon-icon-size: calc(var(--fui-spacing) * 5);
  --fui-empty-header-display: flex;
  --fui-empty-header-max-width: var(--container-sm);
  --fui-empty-header-flex-direction: column;
  --fui-empty-header-align-items: center;
  --fui-empty-header-gap: calc(var(--fui-spacing) * 2);
  --fui-item-border: var(--fui-border-default);
  --fui-item-rounded: var(--fui-radius-none);
  --fui-item-font-family: var(--fui-text-small-family);
  --fui-item-font-size: var(--fui-text-small-size);
  --fui-item-line-height: var(--fui-text-small-line-height);
  --fui-item-font-weight: var(--fui-text-small-weight);
  --fui-item-letter-spacing: var(--fui-text-small-tracking);
  --fui-item-font-feature-settings: var(--fui-text-small-feature);
  --fui-item-font-variation-settings: var(--fui-text-small-variation);
  --fui-item-display: flex;
  --fui-item-width: 100%;
  --fui-item-flex-wrap: wrap;
  --fui-item-align-items: center;
  --fui-item-focus-outline: var(--fui-ring-wide);
  --fui-item-focus-outline-offset: var(--fui-ring-wide-offset);
  --fui-item-focus-border-color: var(--fui-ring);
  --fui-item-focus-outline-color: var(--fui-ring);
  --fui-item-default-border-color: transparent;
  --fui-item-outline-border-color: var(--fui-border);
  --fui-item-muted-background-color: color-mix(in oklab, var(--fui-muted) 50%, transparent);
  --fui-item-muted-border-color: transparent;
  --fui-item-md-gap: calc(var(--fui-spacing) * 3.5);
  --fui-item-md-padding-x: calc(var(--fui-spacing) * 4);
  --fui-item-md-padding-y: calc(var(--fui-spacing) * 3.5);
  --fui-item-sm-gap: calc(var(--fui-spacing) * 3.5);
  --fui-item-sm-padding-x: calc(var(--fui-spacing) * 3.5);
  --fui-item-sm-padding-y: calc(var(--fui-spacing) * 3);
  --fui-item-xs-gap: calc(var(--fui-spacing) * 2.5);
  --fui-item-xs-padding-x: calc(var(--fui-spacing) * 3);
  --fui-item-xs-padding-y: calc(var(--fui-spacing) * 2.5);
  --fui-item-link-hover-background-color: var(--fui-muted);
  --fui-item-media-gap: calc(var(--fui-spacing) * 2);
  --fui-item-media-display: flex;
  --fui-item-media-flex-shrink: 0;
  --fui-item-media-align-items: center;
  --fui-item-media-justify-content: center;
  --fui-item-media-default-background-color: transparent;
  --fui-item-media-icon-icon-size: calc(var(--fui-spacing) * 4);
  --fui-item-media-image-rounded: var(--fui-radius-none);
  --fui-item-media-image-size: calc(var(--fui-spacing) * 10);
  --fui-item-title-text-transform: uppercase;
  --fui-item-title-font-family: var(--fui-text-caption-family);
  --fui-item-title-font-size: var(--fui-text-caption-size);
  --fui-item-title-line-height: 1.375;
  --fui-item-title-font-weight: 600;
  --fui-item-title-letter-spacing: 0em;
  --fui-item-title-font-feature-settings: var(--fui-text-caption-feature);
  --fui-item-title-font-variation-settings: var(--fui-text-caption-variation);
  --fui-item-title-gap: calc(var(--fui-spacing) * 2);
  --fui-item-title-width: fit-content;
  --fui-item-title-align-items: center;
  --fui-item-description-text-color: var(--fui-muted-foreground);
  --fui-item-description-font-family: var(--fui-text-description-family);
  --fui-item-description-font-size: var(--fui-text-description-size);
  --fui-item-description-line-height: var(--fui-text-description-line-height);
  --fui-item-description-font-weight: var(--fui-text-description-weight);
  --fui-item-description-letter-spacing: var(--fui-text-description-tracking);
  --fui-item-description-font-feature-settings: var(--fui-text-description-feature);
  --fui-item-description-font-variation-settings: var(--fui-text-description-variation);
  --fui-item-description-text-align: start;
  --fui-item-description-link-text-decoration-line: underline;
  --fui-item-description-link-hover-text-color: var(--fui-primary);
  --fui-item-actions-display: flex;
  --fui-item-actions-align-items: center;
  --fui-item-actions-gap: calc(var(--fui-spacing) * 2);
  --fui-item-content-display: flex;
  --fui-item-content-flex: 1;
  --fui-item-content-flex-direction: column;
  --fui-item-content-gap: calc(var(--fui-spacing) * 1);
  --fui-item-footer-display: flex;
  --fui-item-footer-align-items: center;
  --fui-item-footer-justify-content: space-between;
  --fui-item-footer-gap: calc(var(--fui-spacing) * 2);
  --fui-item-group-display: flex;
  --fui-item-group-width: 100%;
  --fui-item-group-flex-direction: column;
  --fui-item-group-gap: calc(var(--fui-spacing) * 4);
  --fui-item-header-display: flex;
  --fui-item-header-align-items: center;
  --fui-item-header-justify-content: space-between;
  --fui-item-header-gap: calc(var(--fui-spacing) * 2);
  --fui-item-separator-margin-y: calc(var(--fui-spacing) * 2);
  --fui-avatar-rounded: var(--fui-radius-full);
  --fui-avatar-display: flex;
  --fui-avatar-flex-shrink: 0;
  --fui-avatar-after-border: var(--fui-border-default);
  --fui-avatar-after-rounded: var(--fui-radius-full);
  --fui-avatar-sm-size: calc(var(--fui-spacing) * 6);
  --fui-avatar-md-size: calc(var(--fui-spacing) * 8);
  --fui-avatar-lg-size: calc(var(--fui-spacing) * 10);
  --fui-avatar-ring-outline: var(--fui-ring-frame);
  --fui-avatar-ring-outline-offset: var(--fui-ring-frame-offset);
  --fui-avatar-ring-outline-color: var(--fui-background);
  --fui-avatar-image-rounded: var(--fui-radius-full);
  --fui-avatar-image-size: 100%;
  --fui-avatar-fallback-background-color: var(--fui-muted);
  --fui-avatar-fallback-text-color: var(--fui-muted-foreground);
  --fui-avatar-fallback-rounded: var(--fui-radius-full);
  --fui-avatar-fallback-display: flex;
  --fui-avatar-fallback-size: 100%;
  --fui-avatar-fallback-align-items: center;
  --fui-avatar-fallback-justify-content: center;
  --fui-avatar-fallback-sm-font-family: var(--fui-text-caption-family);
  --fui-avatar-fallback-sm-font-size: var(--fui-text-caption-size);
  --fui-avatar-fallback-sm-line-height: var(--fui-text-caption-line-height);
  --fui-avatar-fallback-sm-font-weight: 400;
  --fui-avatar-fallback-sm-letter-spacing: var(--fui-text-caption-tracking);
  --fui-avatar-fallback-sm-font-feature-settings: var(--fui-text-caption-feature);
  --fui-avatar-fallback-sm-font-variation-settings: var(--fui-text-caption-variation);
  --fui-avatar-fallback-md-font-family: var(--fui-text-small-family);
  --fui-avatar-fallback-md-font-size: var(--fui-text-small-size);
  --fui-avatar-fallback-md-line-height: var(--fui-text-small-line-height);
  --fui-avatar-fallback-md-font-weight: var(--fui-text-small-weight);
  --fui-avatar-fallback-md-letter-spacing: var(--fui-text-small-tracking);
  --fui-avatar-fallback-md-font-feature-settings: var(--fui-text-small-feature);
  --fui-avatar-fallback-md-font-variation-settings: var(--fui-text-small-variation);
  --fui-avatar-fallback-lg-font-family: var(--fui-text-small-family);
  --fui-avatar-fallback-lg-font-size: var(--fui-text-small-size);
  --fui-avatar-fallback-lg-line-height: var(--fui-text-small-line-height);
  --fui-avatar-fallback-lg-font-weight: var(--fui-text-small-weight);
  --fui-avatar-fallback-lg-letter-spacing: var(--fui-text-small-tracking);
  --fui-avatar-fallback-lg-font-feature-settings: var(--fui-text-small-feature);
  --fui-avatar-fallback-lg-font-variation-settings: var(--fui-text-small-variation);
  --fui-avatar-badge-outline: var(--fui-ring-frame);
  --fui-avatar-badge-outline-offset: var(--fui-ring-frame-offset);
  --fui-avatar-badge-background-color: var(--fui-primary);
  --fui-avatar-badge-text-color: var(--fui-primary-foreground);
  --fui-avatar-badge-rounded: var(--fui-radius-full);
  --fui-avatar-badge-outline-color: var(--fui-background);
  --fui-avatar-badge-display: inline-flex;
  --fui-avatar-badge-align-items: center;
  --fui-avatar-badge-justify-content: center;
  --fui-avatar-badge-sm-size: calc(var(--fui-spacing) * 2);
  --fui-avatar-badge-md-size: calc(var(--fui-spacing) * 2.5);
  --fui-avatar-badge-md-icon-size: calc(var(--fui-spacing) * 2);
  --fui-avatar-badge-lg-size: calc(var(--fui-spacing) * 3);
  --fui-avatar-badge-lg-icon-size: calc(var(--fui-spacing) * 2);
  --fui-avatar-group-count-outline: var(--fui-ring-frame);
  --fui-avatar-group-count-outline-offset: var(--fui-ring-frame-offset);
  --fui-avatar-group-count-background-color: var(--fui-muted);
  --fui-avatar-group-count-text-color: var(--fui-muted-foreground);
  --fui-avatar-group-count-rounded: var(--fui-radius-full);
  --fui-avatar-group-count-outline-color: var(--fui-background);
  --fui-avatar-group-count-display: flex;
  --fui-avatar-group-count-flex-shrink: 0;
  --fui-avatar-group-count-align-items: center;
  --fui-avatar-group-count-justify-content: center;
  --fui-avatar-group-count-sm-size: calc(var(--fui-spacing) * 6);
  --fui-avatar-group-count-sm-font-family: var(--fui-text-caption-family);
  --fui-avatar-group-count-sm-font-size: var(--fui-text-caption-size);
  --fui-avatar-group-count-sm-line-height: var(--fui-text-caption-line-height);
  --fui-avatar-group-count-sm-font-weight: 400;
  --fui-avatar-group-count-sm-letter-spacing: var(--fui-text-caption-tracking);
  --fui-avatar-group-count-sm-font-feature-settings: var(--fui-text-caption-feature);
  --fui-avatar-group-count-sm-font-variation-settings: var(--fui-text-caption-variation);
  --fui-avatar-group-count-sm-icon-size: calc(var(--fui-spacing) * 3);
  --fui-avatar-group-count-md-size: calc(var(--fui-spacing) * 8);
  --fui-avatar-group-count-md-font-family: var(--fui-text-small-family);
  --fui-avatar-group-count-md-font-size: var(--fui-text-small-size);
  --fui-avatar-group-count-md-line-height: var(--fui-text-small-line-height);
  --fui-avatar-group-count-md-font-weight: var(--fui-text-small-weight);
  --fui-avatar-group-count-md-letter-spacing: var(--fui-text-small-tracking);
  --fui-avatar-group-count-md-font-feature-settings: var(--fui-text-small-feature);
  --fui-avatar-group-count-md-font-variation-settings: var(--fui-text-small-variation);
  --fui-avatar-group-count-md-icon-size: calc(var(--fui-spacing) * 4);
  --fui-avatar-group-count-lg-size: calc(var(--fui-spacing) * 10);
  --fui-avatar-group-count-lg-font-family: var(--fui-text-small-family);
  --fui-avatar-group-count-lg-font-size: var(--fui-text-small-size);
  --fui-avatar-group-count-lg-line-height: var(--fui-text-small-line-height);
  --fui-avatar-group-count-lg-font-weight: var(--fui-text-small-weight);
  --fui-avatar-group-count-lg-letter-spacing: var(--fui-text-small-tracking);
  --fui-avatar-group-count-lg-font-feature-settings: var(--fui-text-small-feature);
  --fui-avatar-group-count-lg-font-variation-settings: var(--fui-text-small-variation);
  --fui-avatar-group-count-lg-icon-size: calc(var(--fui-spacing) * 5);
  --fui-avatar-group-display: flex;
  --fui-aspect-ratio-rounded: var(--fui-radius-none);
  --fui-collapsible-content-rounded: var(--fui-radius-none);
  --fui-skeleton-background-color: var(--fui-muted);
  --fui-skeleton-rounded: var(--fui-radius-none);
  --fui-spinner-size: calc(var(--fui-spacing) * 4);
  --fui-progress-background-color: var(--fui-muted);
  --fui-progress-rounded: var(--fui-radius-none);
  --fui-progress-height: calc(var(--fui-spacing) * 0.5);
  --fui-progress-display: flex;
  --fui-progress-width: 100%;
  --fui-progress-align-items: center;
  --fui-progress-indicator-background-color: var(--fui-primary);
  --fui-image-rounded: var(--fui-radius-none);
  --fui-image-display: inline-flex;
  --fui-image-loading-skeleton-background-color: var(--fui-muted);
  --fui-image-loading-blur-background-color: color-mix(in oklab, var(--fui-muted) 50%, transparent);
  --fui-image-fallback-background-color: var(--fui-muted);
  --fui-image-fallback-display: flex;
  --fui-image-fallback-size: 100%;
  --fui-image-fallback-align-items: center;
  --fui-image-fallback-justify-content: center;
  --fui-scroll-area-viewport-focus-outline: var(--fui-ring-wide);
  --fui-scroll-area-viewport-focus-outline-offset: var(--fui-ring-wide-offset);
  --fui-scroll-area-viewport-focus-outline-color: var(--fui-ring);
  --fui-scroll-area-scrollbar-display: flex;
  --fui-scroll-area-scrollbar-vertical-width: calc(var(--fui-spacing) * 2.5);
  --fui-scroll-area-scrollbar-vertical-padding-y: 1px;
  --fui-scroll-area-scrollbar-vertical-padding-end: 1px;
  --fui-scroll-area-scrollbar-vertical-padding-start: calc(var(--fui-spacing) * 0.5);
  --fui-scroll-area-scrollbar-vertical-height: 100%;
  --fui-scroll-area-scrollbar-horizontal-height: calc(var(--fui-spacing) * 2.5);
  --fui-scroll-area-scrollbar-horizontal-padding-x: 1px;
  --fui-scroll-area-scrollbar-horizontal-padding-bottom: 1px;
  --fui-scroll-area-scrollbar-horizontal-padding-top: calc(var(--fui-spacing) * 0.5);
  --fui-scroll-area-scrollbar-horizontal-flex-direction: column;
  --fui-scroll-area-thumb-background-color: var(--fui-border);
  --fui-scroll-area-thumb-rounded: var(--fui-radius-none);
  --fui-table-font-family: var(--fui-text-small-family);
  --fui-table-font-size: var(--fui-text-small-size);
  --fui-table-line-height: var(--fui-text-small-line-height);
  --fui-table-font-weight: var(--fui-text-small-weight);
  --fui-table-letter-spacing: var(--fui-text-small-tracking);
  --fui-table-font-feature-settings: var(--fui-text-small-feature);
  --fui-table-font-variation-settings: var(--fui-text-small-variation);
  --fui-table-width: 100%;
  --fui-table-row-border-bottom: var(--fui-border-default);
  --fui-table-row-hover-background-color: color-mix(in oklab, var(--fui-muted) 50%, transparent);
  --fui-table-row-selected-background-color: var(--fui-muted);
  --fui-table-head-font-family: var(--fui-text-caption-family);
  --fui-table-head-font-size: var(--fui-text-caption-size);
  --fui-table-head-line-height: var(--fui-text-caption-line-height);
  --fui-table-head-font-weight: 500;
  --fui-table-head-letter-spacing: 0.05em;
  --fui-table-head-font-feature-settings: var(--fui-text-caption-feature);
  --fui-table-head-font-variation-settings: var(--fui-text-caption-variation);
  --fui-table-head-text-transform: uppercase;
  --fui-table-head-text-color: var(--fui-muted-foreground);
  --fui-table-head-height: calc(var(--fui-spacing) * 12);
  --fui-table-head-padding-x: calc(var(--fui-spacing) * 3);
  --fui-table-head-text-align: start;
  --fui-table-cell-padding: calc(var(--fui-spacing) * 3);
  --fui-table-empty-text-color: var(--fui-muted-foreground);
  --fui-table-empty-font-family: var(--fui-text-small-family);
  --fui-table-empty-font-size: var(--fui-text-small-size);
  --fui-table-empty-line-height: var(--fui-text-small-line-height);
  --fui-table-empty-font-weight: var(--fui-text-small-weight);
  --fui-table-empty-letter-spacing: var(--fui-text-small-tracking);
  --fui-table-empty-font-feature-settings: var(--fui-text-small-feature);
  --fui-table-empty-font-variation-settings: var(--fui-text-small-variation);
  --fui-table-empty-padding-x: calc(var(--fui-spacing) * 4);
  --fui-table-empty-padding-y: calc(var(--fui-spacing) * 14);
  --fui-table-footer-background-color: color-mix(in oklab, var(--fui-muted) 50%, transparent);
  --fui-table-footer-border-top: var(--fui-border-default);
  --fui-table-footer-font-weight: 500;
  --fui-table-caption-text-color: var(--fui-muted-foreground);
  --fui-table-caption-font-family: var(--fui-text-small-family);
  --fui-table-caption-font-size: var(--fui-text-small-size);
  --fui-table-caption-line-height: var(--fui-text-small-line-height);
  --fui-table-caption-font-weight: var(--fui-text-small-weight);
  --fui-table-caption-letter-spacing: var(--fui-text-small-tracking);
  --fui-table-caption-font-feature-settings: var(--fui-text-small-feature);
  --fui-table-caption-font-variation-settings: var(--fui-text-small-variation);
  --fui-table-caption-margin-top: calc(var(--fui-spacing) * 4);
  --fui-accordion-item-border-bottom: var(--fui-border-default);
  --fui-accordion-trigger-border: var(--fui-border-default);
  --fui-accordion-trigger-border-color: transparent;
  --fui-accordion-trigger-rounded: var(--fui-radius-none);
  --fui-accordion-trigger-font-family: var(--fui-text-ui-family);
  --fui-accordion-trigger-font-size: var(--fui-text-ui-size);
  --fui-accordion-trigger-line-height: var(--fui-text-ui-line-height);
  --fui-accordion-trigger-font-weight: 600;
  --fui-accordion-trigger-letter-spacing: var(--fui-text-ui-tracking);
  --fui-accordion-trigger-font-feature-settings: var(--fui-text-ui-feature);
  --fui-accordion-trigger-font-variation-settings: var(--fui-text-ui-variation);
  --fui-accordion-trigger-icon-color: var(--fui-muted-foreground);
  --fui-accordion-trigger-gap: calc(var(--fui-spacing) * 6);
  --fui-accordion-trigger-padding-y: calc(var(--fui-spacing) * 4);
  --fui-accordion-trigger-display: flex;
  --fui-accordion-trigger-flex: 1;
  --fui-accordion-trigger-align-items: flex-start;
  --fui-accordion-trigger-justify-content: space-between;
  --fui-accordion-trigger-text-align: start;
  --fui-accordion-trigger-hover-text-decoration-line: underline;
  --fui-accordion-trigger-icon-size: calc(var(--fui-spacing) * 3.5);
  --fui-accordion-body-font-family: var(--fui-text-small-family);
  --fui-accordion-body-font-size: var(--fui-text-small-size);
  --fui-accordion-body-line-height: var(--fui-text-small-line-height);
  --fui-accordion-body-font-weight: var(--fui-text-small-weight);
  --fui-accordion-body-letter-spacing: var(--fui-text-small-tracking);
  --fui-accordion-body-font-feature-settings: var(--fui-text-small-feature);
  --fui-accordion-body-font-variation-settings: var(--fui-text-small-variation);
  --fui-accordion-body-padding-bottom: calc(var(--fui-spacing) * 4);
  --fui-accordion-body-link-text-decoration-line: underline;
  --fui-accordion-body-link-hover-text-color: var(--fui-foreground);
  --fui-accordion-display: flex;
  --fui-accordion-width: 100%;
  --fui-accordion-flex-direction: column;
  --fui-breadcrumb-list-text-color: var(--fui-muted-foreground);
  --fui-breadcrumb-list-font-family: var(--fui-text-caption-family);
  --fui-breadcrumb-list-font-size: var(--fui-text-caption-size);
  --fui-breadcrumb-list-line-height: var(--fui-text-caption-line-height);
  --fui-breadcrumb-list-font-weight: 400;
  --fui-breadcrumb-list-letter-spacing: 0.025em;
  --fui-breadcrumb-list-font-feature-settings: var(--fui-text-caption-feature);
  --fui-breadcrumb-list-font-variation-settings: var(--fui-text-caption-variation);
  --fui-breadcrumb-list-text-transform: uppercase;
  --fui-breadcrumb-list-gap: calc(var(--fui-spacing) * 1.5);
  --fui-breadcrumb-list-display: flex;
  --fui-breadcrumb-list-flex-wrap: wrap;
  --fui-breadcrumb-list-align-items: center;
  --fui-breadcrumb-list-md-gap: calc(var(--fui-spacing) * 2.5);
  --fui-breadcrumb-item-gap: calc(var(--fui-spacing) * 1.5);
  --fui-breadcrumb-item-display: inline-flex;
  --fui-breadcrumb-item-align-items: center;
  --fui-breadcrumb-link-hover-text-color: var(--fui-foreground);
  --fui-breadcrumb-page-text-color: var(--fui-foreground);
  --fui-breadcrumb-page-font-weight: 400;
  --fui-breadcrumb-separator-icon-size: calc(var(--fui-spacing) * 3.5);
  --fui-breadcrumb-ellipsis-size: calc(var(--fui-spacing) * 5);
  --fui-breadcrumb-ellipsis-display: flex;
  --fui-breadcrumb-ellipsis-align-items: center;
  --fui-breadcrumb-ellipsis-justify-content: center;
  --fui-breadcrumb-ellipsis-icon-size: calc(var(--fui-spacing) * 4);
  --fui-pagination-ellipsis-size: calc(var(--fui-spacing) * 9);
  --fui-pagination-ellipsis-display: flex;
  --fui-pagination-ellipsis-align-items: center;
  --fui-pagination-ellipsis-justify-content: center;
  --fui-pagination-ellipsis-icon-size: calc(var(--fui-spacing) * 4);
  --fui-pagination-margin-x: auto;
  --fui-pagination-display: flex;
  --fui-pagination-width: 100%;
  --fui-pagination-justify-content: center;
  --fui-pagination-content-display: flex;
  --fui-pagination-content-align-items: center;
  --fui-pagination-content-gap: calc(var(--fui-spacing) * 1);
  --fui-pagination-next-padding-end: calc(var(--fui-spacing) * 2);
  --fui-pagination-previous-padding-start: calc(var(--fui-spacing) * 2);
  --fui-carousel-dot-background-color: var(--fui-muted-foreground);
  --fui-carousel-dot-rounded: var(--fui-radius-none);
  --fui-carousel-dot-height: calc(var(--fui-spacing) * 0.5);
  --fui-carousel-dot-width: calc(var(--fui-spacing) * 6);
  --fui-carousel-dot-selected-background-color: var(--fui-foreground);
  --fui-carousel-progress-margin-top: calc(var(--fui-spacing) * 3);
  --fui-carousel-progress-background-color: color-mix(in oklab, var(--fui-muted) 30%, transparent);
  --fui-carousel-progress-rounded: var(--fui-radius-sm);
  --fui-carousel-progress-height: calc(var(--fui-spacing) * 1);
  --fui-carousel-progress-width: 100%;
  --fui-carousel-progress-indicator-background-color: var(--fui-foreground);
  --fui-carousel-content-display: flex;
  --fui-carousel-content-vertical-flex-direction: column;
  --fui-carousel-content-vertical-bleed-top: calc(-1 * calc(var(--fui-spacing) * 4));
  --fui-carousel-dots-display: flex;
  --fui-carousel-item-min-width: calc(var(--fui-spacing) * 0);
  --fui-carousel-item-flex-shrink: 0;
  --fui-carousel-item-flex-grow: 0;
  --fui-carousel-item-vertical-padding-top: calc(var(--fui-spacing) * 4);
  --fui-tabs-list-text-color: var(--fui-muted-foreground);
  --fui-tabs-list-rounded: var(--fui-radius-none);
  --fui-tabs-list-height: calc(var(--fui-spacing) * 10);
  --fui-tabs-list-padding: calc(var(--fui-spacing) * 1);
  --fui-tabs-list-display: inline-flex;
  --fui-tabs-list-width: fit-content;
  --fui-tabs-list-align-items: center;
  --fui-tabs-list-justify-content: center;
  --fui-tabs-list-default-background-color: var(--fui-muted);
  --fui-tabs-list-line-background-color: transparent;
  --fui-tabs-list-line-gap: calc(var(--fui-spacing) * 1);
  --fui-tabs-trigger-text-color: color-mix(in oklab, var(--fui-foreground) 60%, transparent);
  --fui-tabs-trigger-border: var(--fui-border-default);
  --fui-tabs-trigger-border-color: transparent;
  --fui-tabs-trigger-rounded: var(--fui-radius-none);
  --fui-tabs-trigger-font-family: var(--fui-text-caption-family);
  --fui-tabs-trigger-font-size: var(--fui-text-caption-size);
  --fui-tabs-trigger-line-height: var(--fui-text-caption-line-height);
  --fui-tabs-trigger-font-weight: 600;
  --fui-tabs-trigger-letter-spacing: 0.05em;
  --fui-tabs-trigger-font-feature-settings: var(--fui-text-caption-feature);
  --fui-tabs-trigger-font-variation-settings: var(--fui-text-caption-variation);
  --fui-tabs-trigger-text-transform: uppercase;
  --fui-tabs-trigger-gap: calc(var(--fui-spacing) * 2);
  --fui-tabs-trigger-padding-x: calc(var(--fui-spacing) * 4);
  --fui-tabs-trigger-padding-y: calc(var(--fui-spacing) * 1.5);
  --fui-tabs-trigger-display: inline-flex;
  --fui-tabs-trigger-height: 100%;
  --fui-tabs-trigger-flex: 1;
  --fui-tabs-trigger-align-items: center;
  --fui-tabs-trigger-justify-content: center;
  --fui-tabs-trigger-hover-text-color: var(--fui-foreground);
  --fui-tabs-trigger-focus-outline: var(--fui-ring-hairline);
  --fui-tabs-trigger-focus-outline-offset: var(--fui-ring-hairline-offset);
  --fui-tabs-trigger-focus-border-color: var(--fui-ring);
  --fui-tabs-trigger-focus-outline-color: var(--fui-ring);
  --fui-tabs-trigger-selected-background-color: var(--fui-background);
  --fui-tabs-trigger-selected-text-color: var(--fui-foreground);
  --fui-tabs-trigger-icon-size: calc(var(--fui-spacing) * 3.5);
  --fui-tabs-trigger-icon-start-padding-start: calc(var(--fui-spacing) * 2.5);
  --fui-tabs-trigger-icon-end-padding-end: calc(var(--fui-spacing) * 2.5);
  --fui-tabs-trigger-line-selected-background-color: transparent;
  --fui-tabs-trigger-indicator-background-color: var(--fui-foreground);
  --fui-tabs-content-font-family: var(--fui-text-small-family);
  --fui-tabs-content-font-size: var(--fui-text-small-size);
  --fui-tabs-content-line-height: var(--fui-text-small-line-height);
  --fui-tabs-content-font-weight: var(--fui-text-small-weight);
  --fui-tabs-content-letter-spacing: var(--fui-text-small-tracking);
  --fui-tabs-content-font-feature-settings: var(--fui-text-small-feature);
  --fui-tabs-content-font-variation-settings: var(--fui-text-small-variation);
  --fui-tabs-content-flex: 1;
  --fui-tabs-display: flex;
  --fui-tabs-gap: calc(var(--fui-spacing) * 2);
  --fui-stepper-trigger-rounded: var(--fui-radius-none);
  --fui-stepper-trigger-gap: calc(var(--fui-spacing) * 2);
  --fui-stepper-trigger-padding: calc(var(--fui-spacing) * 1);
  --fui-stepper-trigger-display: flex;
  --fui-stepper-trigger-flex-direction: column;
  --fui-stepper-trigger-align-items: center;
  --fui-stepper-trigger-text-align: center;
  --fui-stepper-indicator-rounded: var(--fui-radius-full);
  --fui-stepper-indicator-size: calc(var(--fui-spacing) * 8);
  --fui-stepper-indicator-display: inline-flex;
  --fui-stepper-indicator-align-items: center;
  --fui-stepper-indicator-justify-content: center;
  --fui-stepper-indicator-icon-size: calc(var(--fui-spacing) * 4);
  --fui-stepper-indicator-inactive-background-color: var(--fui-background);
  --fui-stepper-indicator-inactive-text-color: var(--fui-muted-foreground);
  --fui-stepper-indicator-inactive-border: var(--fui-border-default);
  --fui-stepper-indicator-inactive-border-color: var(--fui-input);
  --fui-stepper-indicator-active-background-color: var(--fui-primary);
  --fui-stepper-indicator-active-text-color: var(--fui-primary-foreground);
  --fui-stepper-indicator-completed-background-color: var(--fui-foreground);
  --fui-stepper-indicator-completed-text-color: var(--fui-background);
  --fui-stepper-separator-background-color: var(--fui-border);
  --fui-stepper-separator-fill-background-color: var(--fui-foreground);
  --fui-stepper-title-font-family: var(--fui-text-ui-family);
  --fui-stepper-title-font-size: var(--fui-text-ui-size);
  --fui-stepper-title-line-height: var(--fui-text-ui-line-height);
  --fui-stepper-title-font-weight: 500;
  --fui-stepper-title-letter-spacing: var(--fui-text-ui-tracking);
  --fui-stepper-title-font-feature-settings: var(--fui-text-ui-feature);
  --fui-stepper-title-font-variation-settings: var(--fui-text-ui-variation);
  --fui-stepper-title-inactive-text-color: var(--fui-muted-foreground);
  --fui-stepper-title-active-font-weight: 600;
  --fui-stepper-description-text-color: var(--fui-muted-foreground);
  --fui-stepper-description-font-family: var(--fui-text-caption-family);
  --fui-stepper-description-font-size: var(--fui-text-caption-size);
  --fui-stepper-description-line-height: var(--fui-text-caption-line-height);
  --fui-stepper-description-font-weight: 400;
  --fui-stepper-description-letter-spacing: var(--fui-text-caption-tracking);
  --fui-stepper-description-font-feature-settings: var(--fui-text-caption-feature);
  --fui-stepper-description-font-variation-settings: var(--fui-text-caption-variation);
  --fui-stepper-status-text-color: var(--fui-muted-foreground);
  --fui-stepper-status-font-family: var(--fui-text-caption-family);
  --fui-stepper-status-font-size: var(--fui-text-caption-size);
  --fui-stepper-status-line-height: var(--fui-text-caption-line-height);
  --fui-stepper-status-font-weight: var(--fui-text-caption-weight);
  --fui-stepper-status-letter-spacing: var(--fui-text-caption-tracking);
  --fui-stepper-status-font-feature-settings: var(--fui-text-caption-feature);
  --fui-stepper-status-font-variation-settings: var(--fui-text-caption-variation);
  --fui-stepper-display: flex;
  --fui-stepper-flex-wrap: wrap;
  --fui-stepper-item-display: flex;
  --fui-stepper-item-align-items: center;
  --fui-stepper-separator-root-margin-x: calc(var(--fui-spacing) * 1);
  --fui-stepper-separator-root-height: 1px;
  --fui-stepper-separator-root-flex: 1;
  --fui-sidebar-background-color: var(--fui-card);
  --fui-sidebar-text-color: var(--fui-card-foreground);
  --fui-sidebar-display: flex;
  --fui-sidebar-flex-direction: column;
  --fui-sidebar-sidebar-rounded: var(--fui-radius-none);
  --fui-sidebar-variant-inset-rounded: var(--fui-radius-none);
  --fui-sidebar-floating-border: var(--fui-border-default);
  --fui-sidebar-floating-border-color: var(--fui-border);
  --fui-sidebar-floating-rounded: var(--fui-radius-none);
  --fui-sidebar-floating-shadow: var(--fui-shadow-sm);
  --fui-sidebar-size-width: calc(var(--fui-spacing) * 64);
  --fui-sidebar-size-icon-width: calc(var(--fui-spacing) * 12);
  --fui-sidebar-size-icon-padded-width: calc(var(--fui-spacing) * 16);
  --fui-sidebar-size-offcanvas-width: calc(var(--fui-spacing) * 0);
  --fui-sidebar-size-mobile-width: calc(var(--fui-spacing) * 72);
  --fui-sidebar-size-mobile-padding: calc(var(--fui-spacing) * 0);
  --fui-sidebar-container-display: flex;
  --fui-sidebar-container-height: 100svh;
  --fui-sidebar-container-start-border-end: var(--fui-border-default);
  --fui-sidebar-container-end-border-start: var(--fui-border-default);
  --fui-sidebar-container-padded-padding: calc(var(--fui-spacing) * 2);
  --fui-sidebar-container-icon-width: calc(var(--fui-spacing) * 12);
  --fui-sidebar-container-icon-padded-width: calc(var(--fui-spacing) * 16.5);
  --fui-sidebar-wrapper-display: flex;
  --fui-sidebar-wrapper-min-height: 100svh;
  --fui-sidebar-wrapper-width: 100%;
  --fui-sidebar-wrapper-default-background-color: transparent;
  --fui-sidebar-wrapper-inset-background-color: var(--fui-card);
  --fui-sidebar-inset-background-color: var(--fui-background);
  --fui-sidebar-inset-display: flex;
  --fui-sidebar-inset-width: 100%;
  --fui-sidebar-inset-flex: 1;
  --fui-sidebar-inset-flex-direction: column;
  --fui-sidebar-inset-flat-rounded: var(--fui-radius-none);
  --fui-sidebar-inset-raised-rounded: var(--fui-radius-none);
  --fui-sidebar-inset-raised-shadow: var(--fui-shadow-sm);
  --fui-sidebar-inset-raised-margin: calc(var(--fui-spacing) * 2);
  --fui-sidebar-inset-raised-margin-start: calc(var(--fui-spacing) * 0);
  --fui-sidebar-header-gap: calc(var(--fui-spacing) * 2);
  --fui-sidebar-header-padding: calc(var(--fui-spacing) * 2);
  --fui-sidebar-header-display: flex;
  --fui-sidebar-header-flex-direction: column;
  --fui-sidebar-footer-gap: calc(var(--fui-spacing) * 2);
  --fui-sidebar-footer-padding: calc(var(--fui-spacing) * 2);
  --fui-sidebar-footer-display: flex;
  --fui-sidebar-footer-flex-direction: column;
  --fui-sidebar-group-padding: calc(var(--fui-spacing) * 2);
  --fui-sidebar-group-display: flex;
  --fui-sidebar-group-width: 100%;
  --fui-sidebar-group-min-width: calc(var(--fui-spacing) * 0);
  --fui-sidebar-group-flex-direction: column;
  --fui-sidebar-menu-gap: calc(var(--fui-spacing) * 0.5);
  --fui-sidebar-menu-display: flex;
  --fui-sidebar-menu-width: 100%;
  --fui-sidebar-menu-min-width: calc(var(--fui-spacing) * 0);
  --fui-sidebar-menu-flex-direction: column;
  --fui-sidebar-separator-margin-x: calc(var(--fui-spacing) * 2);
  --fui-sidebar-separator-width: auto;
  --fui-sidebar-content-scrollbar: none;
  --fui-sidebar-content-min-height: calc(var(--fui-spacing) * 0);
  --fui-sidebar-content-gap: calc(var(--fui-spacing) * 2);
  --fui-sidebar-content-display: flex;
  --fui-sidebar-content-flex: 1;
  --fui-sidebar-content-flex-direction: column;
  --fui-sidebar-group-label-text-color: color-mix(in oklab, var(--fui-card-foreground) 70%, transparent);
  --fui-sidebar-group-label-rounded: var(--fui-radius-none);
  --fui-sidebar-group-label-font-family: var(--fui-text-caption-family);
  --fui-sidebar-group-label-font-size: var(--fui-text-caption-size);
  --fui-sidebar-group-label-line-height: var(--fui-text-caption-line-height);
  --fui-sidebar-group-label-font-weight: 600;
  --fui-sidebar-group-label-letter-spacing: 0.05em;
  --fui-sidebar-group-label-font-feature-settings: var(--fui-text-caption-feature);
  --fui-sidebar-group-label-font-variation-settings: var(--fui-text-caption-variation);
  --fui-sidebar-group-label-text-transform: uppercase;
  --fui-sidebar-group-label-height: calc(var(--fui-spacing) * 8);
  --fui-sidebar-group-label-padding-x: calc(var(--fui-spacing) * 3);
  --fui-sidebar-group-label-display: flex;
  --fui-sidebar-group-label-flex-shrink: 0;
  --fui-sidebar-group-label-align-items: center;
  --fui-sidebar-group-label-icon-size: calc(var(--fui-spacing) * 3.5);
  --fui-sidebar-group-content-font-family: var(--fui-text-small-family);
  --fui-sidebar-group-content-font-size: var(--fui-text-small-size);
  --fui-sidebar-group-content-line-height: var(--fui-text-small-line-height);
  --fui-sidebar-group-content-font-weight: var(--fui-text-small-weight);
  --fui-sidebar-group-content-letter-spacing: var(--fui-text-small-tracking);
  --fui-sidebar-group-content-font-feature-settings: var(--fui-text-small-feature);
  --fui-sidebar-group-content-font-variation-settings: var(--fui-text-small-variation);
  --fui-sidebar-group-content-width: 100%;
  --fui-sidebar-input-background-color: transparent;
  --fui-sidebar-input-shadow: none;
  --fui-sidebar-input-height: calc(var(--fui-spacing) * 8);
  --fui-sidebar-input-width: 100%;
  --fui-sidebar-action-text-color: var(--fui-card-foreground);
  --fui-sidebar-action-rounded: var(--fui-radius-none);
  --fui-sidebar-action-width: calc(var(--fui-spacing) * 5);
  --fui-sidebar-action-padding: calc(var(--fui-spacing) * 0);
  --fui-sidebar-action-display: flex;
  --fui-sidebar-action-align-items: center;
  --fui-sidebar-action-justify-content: center;
  --fui-sidebar-action-hover-background-color: var(--fui-accent);
  --fui-sidebar-action-hover-text-color: var(--fui-accent-foreground);
  --fui-sidebar-action-icon-size: calc(var(--fui-spacing) * 3.5);
  --fui-sidebar-menu-badge-text-color: var(--fui-card-foreground);
  --fui-sidebar-menu-badge-rounded: var(--fui-radius-none);
  --fui-sidebar-menu-badge-font-family: var(--fui-text-caption-family);
  --fui-sidebar-menu-badge-font-size: var(--fui-text-caption-size);
  --fui-sidebar-menu-badge-line-height: var(--fui-text-caption-line-height);
  --fui-sidebar-menu-badge-font-weight: 500;
  --fui-sidebar-menu-badge-letter-spacing: var(--fui-text-caption-tracking);
  --fui-sidebar-menu-badge-font-feature-settings: var(--fui-text-caption-feature);
  --fui-sidebar-menu-badge-font-variation-settings: var(--fui-text-caption-variation);
  --fui-sidebar-menu-badge-height: calc(var(--fui-spacing) * 5);
  --fui-sidebar-menu-badge-min-width: calc(var(--fui-spacing) * 5);
  --fui-sidebar-menu-badge-padding-x: calc(var(--fui-spacing) * 1);
  --fui-sidebar-menu-badge-display: flex;
  --fui-sidebar-menu-badge-align-items: center;
  --fui-sidebar-menu-badge-justify-content: center;
  --fui-sidebar-menu-button-rounded: var(--fui-radius-none);
  --fui-sidebar-menu-button-padding-x: calc(var(--fui-spacing) * 3);
  --fui-sidebar-menu-button-padding-y: calc(var(--fui-spacing) * 2);
  --fui-sidebar-menu-button-display: flex;
  --fui-sidebar-menu-button-width: 100%;
  --fui-sidebar-menu-button-align-items: center;
  --fui-sidebar-menu-button-text-align: start;
  --fui-sidebar-menu-button-hover-background-color: var(--fui-accent);
  --fui-sidebar-menu-button-hover-text-color: var(--fui-accent-foreground);
  --fui-sidebar-menu-button-active-background-color: var(--fui-accent);
  --fui-sidebar-menu-button-active-text-color: var(--fui-accent-foreground);
  --fui-sidebar-menu-button-current-background-color: var(--fui-accent);
  --fui-sidebar-menu-button-current-text-color: var(--fui-accent-foreground);
  --fui-sidebar-menu-button-current-font-weight: 500;
  --fui-sidebar-menu-button-icon-size: calc(var(--fui-spacing) * 4);
  --fui-sidebar-menu-button-default-background-color: transparent;
  --fui-sidebar-menu-button-outline-outline: var(--fui-ring-hairline);
  --fui-sidebar-menu-button-outline-outline-offset: var(--fui-ring-hairline-offset);
  --fui-sidebar-menu-button-outline-background-color: var(--fui-background);
  --fui-sidebar-menu-button-outline-outline-color: var(--fui-border);
  --fui-sidebar-menu-button-outline-hover-outline-color: var(--fui-accent);
  --fui-sidebar-menu-button-md-font-family: var(--fui-text-small-family);
  --fui-sidebar-menu-button-md-font-size: var(--fui-text-small-size);
  --fui-sidebar-menu-button-md-line-height: var(--fui-text-small-line-height);
  --fui-sidebar-menu-button-md-font-weight: var(--fui-text-small-weight);
  --fui-sidebar-menu-button-md-letter-spacing: var(--fui-text-small-tracking);
  --fui-sidebar-menu-button-md-font-feature-settings: var(--fui-text-small-feature);
  --fui-sidebar-menu-button-md-font-variation-settings: var(--fui-text-small-variation);
  --fui-sidebar-menu-button-md-height: calc(var(--fui-spacing) * 9);
  --fui-sidebar-menu-button-sm-font-family: var(--fui-text-caption-family);
  --fui-sidebar-menu-button-sm-font-size: var(--fui-text-caption-size);
  --fui-sidebar-menu-button-sm-line-height: var(--fui-text-caption-line-height);
  --fui-sidebar-menu-button-sm-font-weight: 400;
  --fui-sidebar-menu-button-sm-letter-spacing: var(--fui-text-caption-tracking);
  --fui-sidebar-menu-button-sm-font-feature-settings: var(--fui-text-caption-feature);
  --fui-sidebar-menu-button-sm-font-variation-settings: var(--fui-text-caption-variation);
  --fui-sidebar-menu-button-sm-height: calc(var(--fui-spacing) * 8);
  --fui-sidebar-menu-button-lg-font-family: var(--fui-text-small-family);
  --fui-sidebar-menu-button-lg-font-size: var(--fui-text-small-size);
  --fui-sidebar-menu-button-lg-line-height: var(--fui-text-small-line-height);
  --fui-sidebar-menu-button-lg-font-weight: var(--fui-text-small-weight);
  --fui-sidebar-menu-button-lg-letter-spacing: var(--fui-text-small-tracking);
  --fui-sidebar-menu-button-lg-font-feature-settings: var(--fui-text-small-feature);
  --fui-sidebar-menu-button-lg-font-variation-settings: var(--fui-text-small-variation);
  --fui-sidebar-menu-button-lg-height: calc(var(--fui-spacing) * 14);
  --fui-sidebar-menu-button-expanded-gap: calc(var(--fui-spacing) * 2);
  --fui-sidebar-menu-button-collapsed-gap: calc(var(--fui-spacing) * 2);
  --fui-sidebar-menu-button-collapsed-height: calc(var(--fui-spacing) * 8);
  --fui-sidebar-menu-button-collapsed-width: 100%;
  --fui-sidebar-menu-button-collapsed-padding: calc(var(--fui-spacing) * 2);
  --fui-sidebar-menu-button-md-collapsed-height: calc(var(--fui-spacing) * 8);
  --fui-sidebar-menu-button-sm-collapsed-height: calc(var(--fui-spacing) * 8);
  --fui-sidebar-menu-button-lg-collapsed-height: calc(var(--fui-spacing) * 8);
  --fui-sidebar-menu-button-lg-collapsed-padding: calc(var(--fui-spacing) * 0);
  --fui-sidebar-menu-sub-margin-x: calc(var(--fui-spacing) * 3.5);
  --fui-sidebar-menu-sub-border-start: var(--fui-border-default);
  --fui-sidebar-menu-sub-gap: calc(var(--fui-spacing) * 1);
  --fui-sidebar-menu-sub-padding-x: calc(var(--fui-spacing) * 2.5);
  --fui-sidebar-menu-sub-padding-y: calc(var(--fui-spacing) * 0.5);
  --fui-sidebar-menu-sub-display: flex;
  --fui-sidebar-menu-sub-min-width: calc(var(--fui-spacing) * 0);
  --fui-sidebar-menu-sub-flex-direction: column;
  --fui-sidebar-menu-sub-button-text-color: var(--fui-card-foreground);
  --fui-sidebar-menu-sub-button-icon-color: var(--fui-accent-foreground);
  --fui-sidebar-menu-sub-button-rounded: var(--fui-radius-none);
  --fui-sidebar-menu-sub-button-height: calc(var(--fui-spacing) * 7);
  --fui-sidebar-menu-sub-button-gap: calc(var(--fui-spacing) * 2);
  --fui-sidebar-menu-sub-button-padding-x: calc(var(--fui-spacing) * 3);
  --fui-sidebar-menu-sub-button-display: flex;
  --fui-sidebar-menu-sub-button-min-width: calc(var(--fui-spacing) * 0);
  --fui-sidebar-menu-sub-button-align-items: center;
  --fui-sidebar-menu-sub-button-hover-background-color: var(--fui-accent);
  --fui-sidebar-menu-sub-button-hover-text-color: var(--fui-accent-foreground);
  --fui-sidebar-menu-sub-button-active-background-color: var(--fui-accent);
  --fui-sidebar-menu-sub-button-active-text-color: var(--fui-accent-foreground);
  --fui-sidebar-menu-sub-button-current-background-color: var(--fui-accent);
  --fui-sidebar-menu-sub-button-current-text-color: var(--fui-accent-foreground);
  --fui-sidebar-menu-sub-button-icon-size: calc(var(--fui-spacing) * 3.5);
  --fui-sidebar-menu-sub-button-sm-font-family: var(--fui-text-caption-family);
  --fui-sidebar-menu-sub-button-sm-font-size: var(--fui-text-caption-size);
  --fui-sidebar-menu-sub-button-sm-line-height: var(--fui-text-caption-line-height);
  --fui-sidebar-menu-sub-button-sm-font-weight: 400;
  --fui-sidebar-menu-sub-button-sm-letter-spacing: var(--fui-text-caption-tracking);
  --fui-sidebar-menu-sub-button-sm-font-feature-settings: var(--fui-text-caption-feature);
  --fui-sidebar-menu-sub-button-sm-font-variation-settings: var(--fui-text-caption-variation);
  --fui-sidebar-menu-sub-button-md-font-family: var(--fui-text-small-family);
  --fui-sidebar-menu-sub-button-md-font-size: var(--fui-text-small-size);
  --fui-sidebar-menu-sub-button-md-line-height: var(--fui-text-small-line-height);
  --fui-sidebar-menu-sub-button-md-font-weight: var(--fui-text-small-weight);
  --fui-sidebar-menu-sub-button-md-letter-spacing: var(--fui-text-small-tracking);
  --fui-sidebar-menu-sub-button-md-font-feature-settings: var(--fui-text-small-feature);
  --fui-sidebar-menu-sub-button-md-font-variation-settings: var(--fui-text-small-variation);
  --fui-sidebar-menu-skeleton-rounded: var(--fui-radius-none);
  --fui-sidebar-menu-skeleton-height: calc(var(--fui-spacing) * 8);
  --fui-sidebar-menu-skeleton-gap: calc(var(--fui-spacing) * 2);
  --fui-sidebar-menu-skeleton-padding-x: calc(var(--fui-spacing) * 2);
  --fui-sidebar-menu-skeleton-display: flex;
  --fui-sidebar-menu-skeleton-align-items: center;
  --fui-sidebar-rail-width: calc(var(--fui-spacing) * 4);
  --fui-sidebar-rail-display: flex;
  --fui-sidebar-rail-offcanvas-hover-background-color: var(--fui-card);
  --fui-sidebar-rail-line-background-color: var(--fui-border);
  --fui-sidebar-rail-line-width: calc(var(--fui-spacing) * 0.5);
  --fui-calendar-cell-trigger-border: var(--fui-border-default);
  --fui-calendar-cell-trigger-border-color: transparent;
  --fui-calendar-cell-trigger-rounded: var(--fui-radius-none);
  --fui-calendar-cell-trigger-font-family: var(--fui-text-caption-family);
  --fui-calendar-cell-trigger-font-size: var(--fui-text-caption-size);
  --fui-calendar-cell-trigger-line-height: var(--fui-text-caption-line-height);
  --fui-calendar-cell-trigger-font-weight: 400;
  --fui-calendar-cell-trigger-letter-spacing: 0.1em;
  --fui-calendar-cell-trigger-font-feature-settings: var(--fui-text-caption-feature);
  --fui-calendar-cell-trigger-font-variation-settings: var(--fui-text-caption-variation);
  --fui-calendar-cell-trigger-text-transform: uppercase;
  --fui-calendar-cell-trigger-size: calc(var(--fui-spacing) * 8);
  --fui-calendar-cell-trigger-padding: calc(var(--fui-spacing) * 0);
  --fui-calendar-cell-trigger-gap: calc(var(--fui-spacing) * 1.5);
  --fui-calendar-cell-trigger-display: inline-flex;
  --fui-calendar-cell-trigger-flex-shrink: 0;
  --fui-calendar-cell-trigger-align-items: center;
  --fui-calendar-cell-trigger-justify-content: center;
  --fui-calendar-cell-trigger-hover-background-color: var(--fui-muted);
  --fui-calendar-cell-trigger-hover-text-color: var(--fui-foreground);
  --fui-calendar-cell-trigger-pressed-translate: 0 1px;
  --fui-calendar-cell-trigger-open-background-color: var(--fui-muted);
  --fui-calendar-cell-trigger-open-text-color: var(--fui-foreground);
  --fui-calendar-cell-trigger-selected-background-color: var(--fui-primary);
  --fui-calendar-cell-trigger-selected-text-color: var(--fui-primary-foreground);
  --fui-calendar-cell-trigger-icon-size: calc(var(--fui-spacing) * 3.5);
  --fui-calendar-cell-trigger-icon-start-padding-start: calc(var(--fui-spacing) * 4);
  --fui-calendar-cell-trigger-icon-end-padding-end: calc(var(--fui-spacing) * 4);
  --fui-calendar-cell-trigger-current-text-color: var(--fui-foreground);
  --fui-calendar-cell-trigger-today-background-color: var(--fui-accent);
  --fui-calendar-cell-trigger-today-text-color: var(--fui-accent-foreground);
  --fui-calendar-cell-trigger-outside-text-color: var(--fui-muted-foreground);
  --fui-calendar-nav-border: var(--fui-border-default);
  --fui-calendar-nav-rounded: var(--fui-radius-none);
  --fui-calendar-nav-font-family: var(--fui-text-caption-family);
  --fui-calendar-nav-font-size: var(--fui-text-caption-size);
  --fui-calendar-nav-line-height: var(--fui-text-caption-line-height);
  --fui-calendar-nav-font-weight: 600;
  --fui-calendar-nav-letter-spacing: 0.1em;
  --fui-calendar-nav-font-feature-settings: var(--fui-text-caption-feature);
  --fui-calendar-nav-font-variation-settings: var(--fui-text-caption-variation);
  --fui-calendar-nav-text-transform: uppercase;
  --fui-calendar-nav-background-color: transparent;
  --fui-calendar-nav-border-color: var(--fui-border);
  --fui-calendar-nav-opacity: var(--fui-opacity-50);
  --fui-calendar-nav-size: calc(var(--fui-spacing) * 7);
  --fui-calendar-nav-padding: calc(var(--fui-spacing) * 0);
  --fui-calendar-nav-display: inline-flex;
  --fui-calendar-nav-flex-shrink: 0;
  --fui-calendar-nav-align-items: center;
  --fui-calendar-nav-justify-content: center;
  --fui-calendar-nav-hover-background-color: var(--fui-muted);
  --fui-calendar-nav-hover-text-color: var(--fui-foreground);
  --fui-calendar-nav-hover-opacity: var(--fui-opacity-100);
  --fui-calendar-nav-pressed-translate: 0 1px;
  --fui-calendar-nav-open-background-color: var(--fui-muted);
  --fui-calendar-nav-open-text-color: var(--fui-foreground);
  --fui-calendar-nav-icon-size: calc(var(--fui-spacing) * 4);
  --fui-calendar-cell-font-family: var(--fui-text-small-family);
  --fui-calendar-cell-font-size: var(--fui-text-small-size);
  --fui-calendar-cell-line-height: var(--fui-text-small-line-height);
  --fui-calendar-cell-font-weight: var(--fui-text-small-weight);
  --fui-calendar-cell-letter-spacing: var(--fui-text-small-tracking);
  --fui-calendar-cell-font-feature-settings: var(--fui-text-small-feature);
  --fui-calendar-cell-font-variation-settings: var(--fui-text-small-variation);
  --fui-calendar-cell-padding: calc(var(--fui-spacing) * 0);
  --fui-calendar-cell-flex: 1;
  --fui-calendar-cell-text-align: center;
  --fui-calendar-cell-selected-background-color: var(--fui-accent);
  --fui-calendar-cell-selected-rounded: var(--fui-radius-md);
  --fui-calendar-padding: calc(var(--fui-spacing) * 3);
  --fui-calendar-header-padding-x: calc(var(--fui-spacing) * 8);
  --fui-calendar-header-display: flex;
  --fui-calendar-header-justify-content: center;
  --fui-calendar-header-align-items: center;
  --fui-calendar-header-width: 100%;
  --fui-calendar-head-cell-text-color: var(--fui-muted-foreground);
  --fui-calendar-head-cell-font-family: var(--fui-text-caption-family);
  --fui-calendar-head-cell-font-size: var(--fui-text-caption-size);
  --fui-calendar-head-cell-line-height: var(--fui-text-caption-line-height);
  --fui-calendar-head-cell-font-weight: 400;
  --fui-calendar-head-cell-letter-spacing: var(--fui-text-caption-tracking);
  --fui-calendar-head-cell-font-feature-settings: var(--fui-text-caption-feature);
  --fui-calendar-head-cell-font-variation-settings: var(--fui-text-caption-variation);
  --fui-calendar-head-cell-flex: 1;
  --fui-calendar-heading-font-family: var(--fui-text-ui-family);
  --fui-calendar-heading-font-size: var(--fui-text-ui-size);
  --fui-calendar-heading-line-height: var(--fui-text-ui-line-height);
  --fui-calendar-heading-font-weight: var(--fui-text-ui-weight);
  --fui-calendar-heading-letter-spacing: var(--fui-text-ui-tracking);
  --fui-calendar-heading-font-feature-settings: var(--fui-text-ui-feature);
  --fui-calendar-heading-font-variation-settings: var(--fui-text-ui-variation);
  --fui-range-calendar-cell-trigger-border: var(--fui-border-default);
  --fui-range-calendar-cell-trigger-border-color: transparent;
  --fui-range-calendar-cell-trigger-rounded: var(--fui-radius-none);
  --fui-range-calendar-cell-trigger-font-family: var(--fui-text-caption-family);
  --fui-range-calendar-cell-trigger-font-size: var(--fui-text-caption-size);
  --fui-range-calendar-cell-trigger-line-height: var(--fui-text-caption-line-height);
  --fui-range-calendar-cell-trigger-font-weight: 400;
  --fui-range-calendar-cell-trigger-letter-spacing: 0.1em;
  --fui-range-calendar-cell-trigger-font-feature-settings: var(--fui-text-caption-feature);
  --fui-range-calendar-cell-trigger-font-variation-settings: var(--fui-text-caption-variation);
  --fui-range-calendar-cell-trigger-text-transform: uppercase;
  --fui-range-calendar-cell-trigger-size: calc(var(--fui-spacing) * 8);
  --fui-range-calendar-cell-trigger-padding: calc(var(--fui-spacing) * 0);
  --fui-range-calendar-cell-trigger-gap: calc(var(--fui-spacing) * 1.5);
  --fui-range-calendar-cell-trigger-display: inline-flex;
  --fui-range-calendar-cell-trigger-flex-shrink: 0;
  --fui-range-calendar-cell-trigger-align-items: center;
  --fui-range-calendar-cell-trigger-justify-content: center;
  --fui-range-calendar-cell-trigger-hover-background-color: var(--fui-muted);
  --fui-range-calendar-cell-trigger-hover-text-color: var(--fui-foreground);
  --fui-range-calendar-cell-trigger-pressed-translate: 0 1px;
  --fui-range-calendar-cell-trigger-open-background-color: var(--fui-muted);
  --fui-range-calendar-cell-trigger-open-text-color: var(--fui-foreground);
  --fui-range-calendar-cell-trigger-icon-size: calc(var(--fui-spacing) * 3.5);
  --fui-range-calendar-cell-trigger-icon-start-padding-start: calc(var(--fui-spacing) * 4);
  --fui-range-calendar-cell-trigger-icon-end-padding-end: calc(var(--fui-spacing) * 4);
  --fui-range-calendar-cell-trigger-current-text-color: var(--fui-foreground);
  --fui-range-calendar-cell-trigger-today-background-color: var(--fui-accent);
  --fui-range-calendar-cell-trigger-today-text-color: var(--fui-accent-foreground);
  --fui-range-calendar-cell-trigger-outside-text-color: var(--fui-muted-foreground);
  --fui-range-calendar-cell-trigger-edge-current-background-color: var(--fui-primary);
  --fui-range-calendar-cell-trigger-edge-current-text-color: var(--fui-primary-foreground);
  --fui-range-calendar-cell-trigger-edge-current-hover-background-color: var(--fui-primary);
  --fui-range-calendar-cell-trigger-edge-current-hover-text-color: var(--fui-primary-foreground);
  --fui-range-calendar-cell-trigger-edge-current-focus-background-color: var(--fui-primary);
  --fui-range-calendar-cell-trigger-edge-current-focus-text-color: var(--fui-primary-foreground);
  --fui-range-calendar-cell-trigger-edge-today-background-color: var(--fui-primary);
  --fui-range-calendar-cell-trigger-edge-today-text-color: var(--fui-primary-foreground);
  --fui-range-calendar-cell-trigger-edge-today-hover-background-color: var(--fui-primary);
  --fui-range-calendar-cell-trigger-edge-today-hover-text-color: var(--fui-primary-foreground);
  --fui-range-calendar-cell-trigger-edge-today-focus-background-color: var(--fui-primary);
  --fui-range-calendar-cell-trigger-edge-today-focus-text-color: var(--fui-primary-foreground);
  --fui-range-calendar-cell-trigger-edge-outside-background-color: var(--fui-primary);
  --fui-range-calendar-cell-trigger-edge-outside-text-color: var(--fui-primary-foreground);
  --fui-range-calendar-cell-trigger-edge-outside-hover-background-color: var(--fui-primary);
  --fui-range-calendar-cell-trigger-edge-outside-hover-text-color: var(--fui-primary-foreground);
  --fui-range-calendar-cell-trigger-edge-outside-focus-background-color: var(--fui-primary);
  --fui-range-calendar-cell-trigger-edge-outside-focus-text-color: var(--fui-primary-foreground);
  --fui-range-calendar-cell-font-family: var(--fui-text-small-family);
  --fui-range-calendar-cell-font-size: var(--fui-text-small-size);
  --fui-range-calendar-cell-line-height: var(--fui-text-small-line-height);
  --fui-range-calendar-cell-font-weight: var(--fui-text-small-weight);
  --fui-range-calendar-cell-letter-spacing: var(--fui-text-small-tracking);
  --fui-range-calendar-cell-font-feature-settings: var(--fui-text-small-feature);
  --fui-range-calendar-cell-font-variation-settings: var(--fui-text-small-variation);
  --fui-range-calendar-cell-padding: calc(var(--fui-spacing) * 0);
  --fui-range-calendar-cell-text-align: center;
  --fui-range-calendar-cell-selected-background-color: var(--fui-accent);
  --fui-range-calendar-cell-start-selected-border-top-left-radius: var(--fui-radius-md);
  --fui-range-calendar-cell-start-selected-border-bottom-left-radius: var(--fui-radius-md);
  --fui-range-calendar-cell-end-selected-border-top-right-radius: var(--fui-radius-md);
  --fui-range-calendar-cell-end-selected-border-bottom-right-radius: var(--fui-radius-md);
  --fui-range-calendar-cell-both-selected-rounded: var(--fui-radius-md);
  --fui-range-calendar-nav-border: var(--fui-border-default);
  --fui-range-calendar-nav-rounded: var(--fui-radius-none);
  --fui-range-calendar-nav-font-family: var(--fui-text-caption-family);
  --fui-range-calendar-nav-font-size: var(--fui-text-caption-size);
  --fui-range-calendar-nav-line-height: var(--fui-text-caption-line-height);
  --fui-range-calendar-nav-font-weight: 600;
  --fui-range-calendar-nav-letter-spacing: 0.1em;
  --fui-range-calendar-nav-font-feature-settings: var(--fui-text-caption-feature);
  --fui-range-calendar-nav-font-variation-settings: var(--fui-text-caption-variation);
  --fui-range-calendar-nav-text-transform: uppercase;
  --fui-range-calendar-nav-background-color: transparent;
  --fui-range-calendar-nav-border-color: var(--fui-border);
  --fui-range-calendar-nav-opacity: var(--fui-opacity-50);
  --fui-range-calendar-nav-size: calc(var(--fui-spacing) * 7);
  --fui-range-calendar-nav-padding: calc(var(--fui-spacing) * 0);
  --fui-range-calendar-nav-display: inline-flex;
  --fui-range-calendar-nav-flex-shrink: 0;
  --fui-range-calendar-nav-align-items: center;
  --fui-range-calendar-nav-justify-content: center;
  --fui-range-calendar-nav-hover-background-color: var(--fui-muted);
  --fui-range-calendar-nav-hover-text-color: var(--fui-foreground);
  --fui-range-calendar-nav-hover-opacity: var(--fui-opacity-100);
  --fui-range-calendar-nav-pressed-translate: 0 1px;
  --fui-range-calendar-nav-open-background-color: var(--fui-muted);
  --fui-range-calendar-nav-open-text-color: var(--fui-foreground);
  --fui-range-calendar-nav-icon-size: calc(var(--fui-spacing) * 4);
  --fui-range-calendar-head-cell-text-color: var(--fui-muted-foreground);
  --fui-range-calendar-head-cell-font-family: var(--fui-text-caption-family);
  --fui-range-calendar-head-cell-font-size: var(--fui-text-caption-size);
  --fui-range-calendar-head-cell-line-height: var(--fui-text-caption-line-height);
  --fui-range-calendar-head-cell-font-weight: 400;
  --fui-range-calendar-head-cell-letter-spacing: var(--fui-text-caption-tracking);
  --fui-range-calendar-head-cell-font-feature-settings: var(--fui-text-caption-feature);
  --fui-range-calendar-head-cell-font-variation-settings: var(--fui-text-caption-variation);
  --fui-range-calendar-head-cell-width: calc(var(--fui-spacing) * 8);
  --fui-range-calendar-head-cell-rounded: var(--fui-radius-md);
  --fui-range-calendar-padding: calc(var(--fui-spacing) * 3);
  --fui-range-calendar-header-padding-top: calc(var(--fui-spacing) * 1);
  --fui-range-calendar-header-display: flex;
  --fui-range-calendar-header-justify-content: center;
  --fui-range-calendar-header-align-items: center;
  --fui-range-calendar-header-width: 100%;
  --fui-range-calendar-heading-font-family: var(--fui-text-ui-family);
  --fui-range-calendar-heading-font-size: var(--fui-text-ui-size);
  --fui-range-calendar-heading-line-height: var(--fui-text-ui-line-height);
  --fui-range-calendar-heading-font-weight: var(--fui-text-ui-weight);
  --fui-range-calendar-heading-letter-spacing: var(--fui-text-ui-tracking);
  --fui-range-calendar-heading-font-feature-settings: var(--fui-text-ui-feature);
  --fui-range-calendar-heading-font-variation-settings: var(--fui-text-ui-variation);
  --fui-range-calendar-grid-row-display: flex;
  --fui-calendar-select-label-font-family: var(--fui-text-small-family);
  --fui-calendar-select-label-font-size: var(--fui-text-small-size);
  --fui-calendar-select-label-line-height: var(--fui-text-small-line-height);
  --fui-calendar-select-label-font-weight: var(--fui-text-small-weight);
  --fui-calendar-select-label-letter-spacing: var(--fui-text-small-tracking);
  --fui-calendar-select-label-font-feature-settings: var(--fui-text-small-feature);
  --fui-calendar-select-label-font-variation-settings: var(--fui-text-small-variation);
  --fui-calendar-select-label-padding-start: calc(var(--fui-spacing) * 2);
  --fui-calendar-grid-row-display: flex;
  --fui-price-text-color: var(--fui-price);
  --fui-price-gap: calc(var(--fui-spacing) * 1);
  --fui-price-display: inline-flex;
  --fui-price-flex-direction: column;
  --fui-price-sm-font-family: var(--fui-text-small-family);
  --fui-price-sm-font-size: var(--fui-text-small-size);
  --fui-price-sm-line-height: var(--fui-text-small-line-height);
  --fui-price-sm-font-weight: 600;
  --fui-price-sm-letter-spacing: var(--fui-text-small-tracking);
  --fui-price-sm-font-feature-settings: var(--fui-text-small-feature);
  --fui-price-sm-font-variation-settings: var(--fui-text-small-variation);
  --fui-price-md-font-family: var(--fui-text-body-family);
  --fui-price-md-font-size: var(--fui-text-body-size);
  --fui-price-md-line-height: var(--fui-text-body-line-height);
  --fui-price-md-font-weight: 600;
  --fui-price-md-letter-spacing: var(--fui-text-body-tracking);
  --fui-price-md-font-feature-settings: var(--fui-text-body-feature);
  --fui-price-md-font-variation-settings: var(--fui-text-body-variation);
  --fui-price-lg-font-family: var(--fui-text-headline-family);
  --fui-price-lg-font-size: var(--fui-text-headline-size);
  --fui-price-lg-line-height: var(--fui-text-headline-line-height);
  --fui-price-lg-font-weight: 600;
  --fui-price-lg-letter-spacing: var(--fui-text-headline-tracking);
  --fui-price-lg-font-feature-settings: var(--fui-text-headline-feature);
  --fui-price-lg-font-variation-settings: var(--fui-text-headline-variation);
  --fui-price-start-text-align: start;
  --fui-price-start-align-items: flex-start;
  --fui-price-end-text-align: end;
  --fui-price-end-align-items: flex-end;
  --fui-price-row-gap: calc(var(--fui-spacing) * 1.5);
  --fui-price-hint-text-color: var(--fui-muted-foreground);
  --fui-price-hint-font-family: var(--fui-text-caption-family);
  --fui-price-hint-font-size: var(--fui-text-caption-size);
  --fui-price-hint-line-height: var(--fui-text-caption-line-height);
  --fui-price-hint-font-weight: 400;
  --fui-price-hint-letter-spacing: var(--fui-text-caption-tracking);
  --fui-price-hint-font-feature-settings: var(--fui-text-caption-feature);
  --fui-price-hint-font-variation-settings: var(--fui-text-caption-variation);
  --fui-price-hint-link-text-decoration-line: underline;
  --fui-price-hint-link-hover-text-color: var(--fui-foreground);
  --fui-price-strike-text-color: var(--fui-muted-foreground);
  --fui-price-strike-font-weight: 400;
  --fui-price-strike-text-decoration-line: line-through;
  --fui-price-strike-sm-font-family: var(--fui-text-caption-family);
  --fui-price-strike-sm-font-size: var(--fui-text-caption-size);
  --fui-price-strike-sm-line-height: var(--fui-text-caption-line-height);
  --fui-price-strike-sm-font-weight: 400;
  --fui-price-strike-sm-letter-spacing: var(--fui-text-caption-tracking);
  --fui-price-strike-sm-font-feature-settings: var(--fui-text-caption-feature);
  --fui-price-strike-sm-font-variation-settings: var(--fui-text-caption-variation);
  --fui-price-strike-md-font-family: var(--fui-text-small-family);
  --fui-price-strike-md-font-size: var(--fui-text-small-size);
  --fui-price-strike-md-line-height: var(--fui-text-small-line-height);
  --fui-price-strike-md-font-weight: 400;
  --fui-price-strike-md-letter-spacing: var(--fui-text-small-tracking);
  --fui-price-strike-md-font-feature-settings: var(--fui-text-small-feature);
  --fui-price-strike-md-font-variation-settings: var(--fui-text-small-variation);
  --fui-price-strike-lg-font-family: var(--fui-text-body-family);
  --fui-price-strike-lg-font-size: var(--fui-text-body-size);
  --fui-price-strike-lg-line-height: var(--fui-text-body-line-height);
  --fui-price-strike-lg-font-weight: 400;
  --fui-price-strike-lg-letter-spacing: var(--fui-text-body-tracking);
  --fui-price-strike-lg-font-feature-settings: var(--fui-text-body-feature);
  --fui-price-strike-lg-font-variation-settings: var(--fui-text-body-variation);
  --fui-price-discount-text-color: var(--fui-discount);
  --fui-price-discount-font-weight: 500;
  --fui-rating-icon-stroke: currentColor;
  --fui-rating-icon-flex-shrink: 0;
  --fui-rating-icon-full-text-color: var(--fui-rating);
  --fui-rating-icon-full-fill: currentColor;
  --fui-rating-icon-empty-text-color: var(--fui-muted-foreground);
  --fui-rating-icon-empty-fill: transparent;
  --fui-rating-icon-sm-size: calc(var(--fui-spacing) * 4);
  --fui-rating-icon-md-size: calc(var(--fui-spacing) * 5);
  --fui-rating-icon-lg-size: calc(var(--fui-spacing) * 6);
  --fui-rating-dot-rounded: var(--fui-radius-full);
  --fui-rating-dot-border: var(--fui-border-default);
  --fui-rating-dot-border-color: currentColor;
  --fui-rating-dot-background-color: currentColor;
  --fui-rating-dot-display: inline-block;
  --fui-rating-dot-flex-shrink: 0;
  --fui-rating-dot-full-text-color: var(--fui-rating);
  --fui-rating-dot-empty-text-color: var(--fui-muted-foreground);
  --fui-rating-dot-empty-background-color: transparent;
  --fui-rating-dot-sm-size: calc(var(--fui-spacing) * 3);
  --fui-rating-dot-md-size: calc(var(--fui-spacing) * 4);
  --fui-rating-dot-lg-size: calc(var(--fui-spacing) * 5);
  --fui-rating-gap: calc(var(--fui-spacing) * 0.5);
  --fui-rating-display: flex;
  --fui-rating-align-items: center;
  --fui-rating-stars-dot-gap: calc(var(--fui-spacing) * 1);
  --fui-rating-stars-star-gap: calc(var(--fui-spacing) * 0.5);
  --fui-rating-meta-margin-start: calc(var(--fui-spacing) * 2);
  --fui-rating-meta-gap: calc(var(--fui-spacing) * 1);
  --fui-rating-meta-display: flex;
  --fui-rating-meta-align-items: baseline;
  --fui-rating-value-text-color: var(--fui-foreground);
  --fui-rating-value-font-family: var(--fui-text-small-family);
  --fui-rating-value-font-size: var(--fui-text-small-size);
  --fui-rating-value-line-height: var(--fui-text-small-line-height);
  --fui-rating-value-font-weight: var(--fui-text-small-weight);
  --fui-rating-value-letter-spacing: var(--fui-text-small-tracking);
  --fui-rating-value-font-feature-settings: var(--fui-text-small-feature);
  --fui-rating-value-font-variation-settings: var(--fui-text-small-variation);
  --fui-rating-count-text-color: var(--fui-muted-foreground);
  --fui-rating-count-font-family: var(--fui-text-caption-family);
  --fui-rating-count-font-size: var(--fui-text-caption-size);
  --fui-rating-count-line-height: var(--fui-text-caption-line-height);
  --fui-rating-count-font-weight: 400;
  --fui-rating-count-letter-spacing: var(--fui-text-caption-tracking);
  --fui-rating-count-font-feature-settings: var(--fui-text-caption-feature);
  --fui-rating-count-font-variation-settings: var(--fui-text-caption-variation);
  --fui-rating-input-item-rounded: var(--fui-radius-sm);
  --fui-rating-input-item-dot-padding: calc(var(--fui-spacing) * 1);
  --fui-rating-input-item-star-padding: calc(var(--fui-spacing) * 0.5);
  --fui-rating-input-display: flex;
  --fui-rating-input-width: fit-content;
  --fui-rating-input-align-items: center;
  --fui-swatch-border: var(--fui-border-default);
  --fui-swatch-border-color: var(--fui-border);
  --fui-swatch-display: inline-flex;
  --fui-swatch-align-items: center;
  --fui-swatch-justify-content: center;
  --fui-swatch-hover-border-color: var(--fui-muted-foreground);
  --fui-swatch-hover-text-color: var(--fui-foreground);
  --fui-swatch-checked-border-color: var(--fui-foreground);
  --fui-swatch-xs-size: calc(var(--fui-spacing) * 6);
  --fui-swatch-xs-font-family: var(--fui-text-ui-family);
  --fui-swatch-xs-font-size: var(--fui-text-ui-size);
  --fui-swatch-xs-line-height: var(--fui-text-ui-line-height);
  --fui-swatch-xs-font-weight: var(--fui-text-ui-weight);
  --fui-swatch-xs-letter-spacing: var(--fui-text-ui-tracking);
  --fui-swatch-xs-font-feature-settings: var(--fui-text-ui-feature);
  --fui-swatch-xs-font-variation-settings: var(--fui-text-ui-variation);
  --fui-swatch-sm-size: calc(var(--fui-spacing) * 12);
  --fui-swatch-sm-font-family: var(--fui-text-ui-family);
  --fui-swatch-sm-font-size: var(--fui-text-ui-size);
  --fui-swatch-sm-line-height: var(--fui-text-ui-line-height);
  --fui-swatch-sm-font-weight: var(--fui-text-ui-weight);
  --fui-swatch-sm-letter-spacing: var(--fui-text-ui-tracking);
  --fui-swatch-sm-font-feature-settings: var(--fui-text-ui-feature);
  --fui-swatch-sm-font-variation-settings: var(--fui-text-ui-variation);
  --fui-swatch-sm-md-size: calc(var(--fui-spacing) * 9);
  --fui-swatch-md-size: calc(var(--fui-spacing) * 14);
  --fui-swatch-md-font-family: var(--fui-text-ui-family);
  --fui-swatch-md-font-size: var(--fui-text-ui-size);
  --fui-swatch-md-line-height: var(--fui-text-ui-line-height);
  --fui-swatch-md-font-weight: var(--fui-text-ui-weight);
  --fui-swatch-md-letter-spacing: var(--fui-text-ui-tracking);
  --fui-swatch-md-font-feature-settings: var(--fui-text-ui-feature);
  --fui-swatch-md-font-variation-settings: var(--fui-text-ui-variation);
  --fui-swatch-md-md-size: calc(var(--fui-spacing) * 12);
  --fui-swatch-lg-size: calc(var(--fui-spacing) * 16);
  --fui-swatch-lg-font-family: var(--fui-text-lead-family);
  --fui-swatch-lg-font-size: var(--fui-text-lead-size);
  --fui-swatch-lg-line-height: var(--fui-text-lead-line-height);
  --fui-swatch-lg-font-weight: 500;
  --fui-swatch-lg-letter-spacing: var(--fui-text-lead-tracking);
  --fui-swatch-lg-font-feature-settings: var(--fui-text-lead-feature);
  --fui-swatch-lg-font-variation-settings: var(--fui-text-lead-variation);
  --fui-swatch-default-rounded: var(--fui-radius-md);
  --fui-swatch-pill-rounded: var(--fui-radius-full);
  --fui-swatch-strike-text-color: var(--fui-foreground);
  --fui-swatch-strike-halo-text-color: var(--fui-background);
  --fui-swatch-fallback-border: var(--fui-border-frame);
  --fui-swatch-fallback-border-color: var(--fui-background);
  --fui-swatch-fallback-default-rounded: var(--fui-radius-md);
  --fui-swatch-fallback-pill-rounded: var(--fui-radius-full);
  --fui-swatch-fallback-xs-border: var(--fui-border-frame-thin);
  --fui-swatch-image-border: var(--fui-border-frame);
  --fui-swatch-image-border-color: var(--fui-background);
  --fui-swatch-image-width: 100%;
  --fui-swatch-image-height: 100%;
  --fui-swatch-image-default-rounded: var(--fui-radius-md);
  --fui-swatch-image-pill-rounded: var(--fui-radius-full);
  --fui-swatch-image-xs-border: var(--fui-border-frame-thin);
  --fui-swatch-label-text-color: var(--fui-muted-foreground);
  --fui-swatch-label-font-family: var(--fui-text-micro-family);
  --fui-swatch-label-font-size: var(--fui-text-micro-size);
  --fui-swatch-label-line-height: 1.25;
  --fui-swatch-label-font-weight: 400;
  --fui-swatch-label-letter-spacing: var(--fui-text-micro-tracking);
  --fui-swatch-label-font-feature-settings: var(--fui-text-micro-feature);
  --fui-swatch-label-font-variation-settings: var(--fui-text-micro-variation);
  --fui-swatch-group-gap: calc(var(--fui-spacing) * 3);
  --fui-swatch-group-display: flex;
  --fui-swatch-group-md-gap: calc(var(--fui-spacing) * 2);
  --fui-swatch-group-horizontal-flex-wrap: wrap;
  --fui-swatch-group-vertical-flex-direction: column;
  --fui-swatch-group-vertical-flex-wrap: nowrap;
  --fui-filter-trigger-icon-color: var(--fui-muted-foreground);
  --fui-filter-trigger-width: 100%;
  --fui-filter-trigger-count-margin-end: calc(var(--fui-spacing) * 2);
  --fui-filter-trigger-count-background-color: var(--fui-primary);
  --fui-filter-trigger-count-text-color: var(--fui-primary-foreground);
  --fui-filter-trigger-count-rounded: var(--fui-radius-full);
  --fui-filter-trigger-count-font-family: var(--fui-text-micro-family);
  --fui-filter-trigger-count-font-size: var(--fui-text-micro-size);
  --fui-filter-trigger-count-line-height: var(--fui-text-micro-line-height);
  --fui-filter-trigger-count-font-weight: var(--fui-text-micro-weight);
  --fui-filter-trigger-count-letter-spacing: var(--fui-text-micro-tracking);
  --fui-filter-trigger-count-font-feature-settings: var(--fui-text-micro-feature);
  --fui-filter-trigger-count-font-variation-settings: var(--fui-text-micro-variation);
  --fui-filter-trigger-count-size: calc(var(--fui-spacing) * 5);
  --fui-filter-reset-margin-top: calc(var(--fui-spacing) * 1);
  --fui-filter-reset-rounded: var(--fui-radius-full);
  --fui-filter-group-content-width: calc(var(--fui-spacing) * 64);
  --fui-filter-group-content-padding: calc(var(--fui-spacing) * 3);
  --fui-filter-list-scrollbar: none;
  --fui-filter-list-height: calc(var(--fui-spacing) * 70);
  --fui-filter-list-padding-y: calc(var(--fui-spacing) * 1);
  --fui-filter-list-search-border: var(--fui-border-default);
  --fui-filter-list-search-border-bottom-color: var(--fui-input);
  --fui-filter-list-search-rounded: var(--fui-radius-none);
  --fui-filter-list-search-placeholder-color: var(--fui-muted-foreground);
  --fui-filter-list-search-margin-bottom: calc(var(--fui-spacing) * 1);
  --fui-filter-list-search-background-color: var(--fui-muted);
  --fui-filter-list-search-border-color: var(--fui-input);
  --fui-filter-list-search-shadow: none;
  --fui-filter-list-search-font-family: var(--fui-text-small-family);
  --fui-filter-list-search-font-size: var(--fui-text-small-size);
  --fui-filter-list-search-line-height: var(--fui-text-small-line-height);
  --fui-filter-list-search-font-weight: var(--fui-text-small-weight);
  --fui-filter-list-search-letter-spacing: var(--fui-text-small-tracking);
  --fui-filter-list-search-font-feature-settings: var(--fui-text-small-feature);
  --fui-filter-list-search-font-variation-settings: var(--fui-text-small-variation);
  --fui-filter-list-search-height: calc(var(--fui-spacing) * 9);
  --fui-filter-list-search-padding-x: calc(var(--fui-spacing) * 3);
  --fui-filter-list-search-focus-border-bottom: var(--fui-border-focus);
  --fui-filter-list-search-invalid-border-bottom-color: var(--fui-destructive);
  --fui-filter-list-search-file-background-color: transparent;
  --fui-filter-list-search-file-border: none;
  --fui-filter-list-search-file-text-color: var(--fui-foreground);
  --fui-filter-list-search-file-font-family: var(--fui-text-ui-family);
  --fui-filter-list-search-file-font-size: var(--fui-text-ui-size);
  --fui-filter-list-search-file-line-height: var(--fui-text-ui-line-height);
  --fui-filter-list-search-file-font-weight: var(--fui-text-ui-weight);
  --fui-filter-list-search-file-letter-spacing: var(--fui-text-ui-tracking);
  --fui-filter-list-search-file-font-feature-settings: var(--fui-text-ui-feature);
  --fui-filter-list-search-file-font-variation-settings: var(--fui-text-ui-variation);
  --fui-filter-list-item-rounded: var(--fui-radius-none);
  --fui-filter-list-item-font-family: var(--fui-text-small-family);
  --fui-filter-list-item-font-size: var(--fui-text-small-size);
  --fui-filter-list-item-line-height: var(--fui-text-small-line-height);
  --fui-filter-list-item-font-weight: var(--fui-text-small-weight);
  --fui-filter-list-item-letter-spacing: var(--fui-text-small-tracking);
  --fui-filter-list-item-font-feature-settings: var(--fui-text-small-feature);
  --fui-filter-list-item-font-variation-settings: var(--fui-text-small-variation);
  --fui-filter-list-item-gap: calc(var(--fui-spacing) * 2);
  --fui-filter-list-item-padding-x: calc(var(--fui-spacing) * 2);
  --fui-filter-list-item-padding-y: calc(var(--fui-spacing) * 2);
  --fui-filter-list-item-focus-background-color: var(--fui-accent);
  --fui-filter-list-item-focus-text-color: var(--fui-accent-foreground);
  --fui-filter-list-check-background-color: transparent;
  --fui-filter-list-check-border: var(--fui-border-default);
  --fui-filter-list-check-border-color: var(--fui-input);
  --fui-filter-list-check-rounded: var(--fui-radius-none);
  --fui-filter-list-check-size: calc(var(--fui-spacing) * 4.5);
  --fui-filter-list-check-checked-background-color: var(--fui-primary);
  --fui-filter-list-check-checked-text-color: var(--fui-primary-foreground);
  --fui-filter-list-check-checked-border-color: var(--fui-primary);
  --fui-filter-meta-text-color: var(--fui-muted-foreground);
  --fui-filter-meta-font-family: var(--fui-text-caption-family);
  --fui-filter-meta-font-size: var(--fui-text-caption-size);
  --fui-filter-meta-line-height: var(--fui-text-caption-line-height);
  --fui-filter-meta-font-weight: 400;
  --fui-filter-meta-letter-spacing: var(--fui-text-caption-tracking);
  --fui-filter-meta-font-feature-settings: var(--fui-text-caption-feature);
  --fui-filter-meta-font-variation-settings: var(--fui-text-caption-variation);
  --fui-filter-swatch-vertical-bleed-x: calc(-1 * calc(var(--fui-spacing) * 0.5));
  --fui-filter-swatch-vertical-bleed-y: calc(-1 * calc(var(--fui-spacing) * 0.5));
  --fui-filter-swatch-vertical-padding: calc(var(--fui-spacing) * 0.5);
  --fui-filter-swatch-text-font-family: var(--fui-text-small-family);
  --fui-filter-swatch-text-font-size: var(--fui-text-small-size);
  --fui-filter-swatch-text-line-height: var(--fui-text-small-line-height);
  --fui-filter-swatch-text-font-weight: var(--fui-text-small-weight);
  --fui-filter-swatch-text-letter-spacing: var(--fui-text-small-tracking);
  --fui-filter-swatch-text-font-feature-settings: var(--fui-text-small-feature);
  --fui-filter-swatch-text-font-variation-settings: var(--fui-text-small-variation);
  --fui-filter-rating-star-rounded: var(--fui-radius-sm);
  --fui-filter-rating-star-padding: calc(var(--fui-spacing) * 1.5);
  --fui-filter-field-label-font-family: var(--fui-text-small-family);
  --fui-filter-field-label-font-size: var(--fui-text-small-size);
  --fui-filter-field-label-line-height: var(--fui-text-small-line-height);
  --fui-filter-field-label-font-weight: 400;
  --fui-filter-field-label-letter-spacing: 0em;
  --fui-filter-field-label-font-feature-settings: var(--fui-text-small-feature);
  --fui-filter-field-label-font-variation-settings: var(--fui-text-small-variation);
  --fui-filter-field-label-text-transform: none;
  --fui-filter-field-title-font-family: var(--fui-text-caption-family);
  --fui-filter-field-title-font-size: var(--fui-text-caption-size);
  --fui-filter-field-title-line-height: var(--fui-text-caption-line-height);
  --fui-filter-field-title-font-weight: 600;
  --fui-filter-field-title-letter-spacing: 0.025em;
  --fui-filter-field-title-font-feature-settings: var(--fui-text-caption-feature);
  --fui-filter-field-title-font-variation-settings: var(--fui-text-caption-variation);
  --fui-filter-field-title-text-transform: uppercase;
  --fui-filter-field-description-text-color: var(--fui-muted-foreground);
  --fui-filter-field-description-font-family: var(--fui-text-small-family);
  --fui-filter-field-description-font-size: var(--fui-text-small-size);
  --fui-filter-field-description-line-height: var(--fui-text-small-line-height);
  --fui-filter-field-description-font-weight: var(--fui-text-small-weight);
  --fui-filter-field-description-letter-spacing: var(--fui-text-small-tracking);
  --fui-filter-field-description-font-feature-settings: var(--fui-text-small-feature);
  --fui-filter-field-description-font-variation-settings: var(--fui-text-small-variation);
  --fui-filter-range-separator-text-color: var(--fui-muted-foreground);
  --fui-filter-range-separator-font-family: var(--fui-text-small-family);
  --fui-filter-range-separator-font-size: var(--fui-text-small-size);
  --fui-filter-range-separator-line-height: var(--fui-text-small-line-height);
  --fui-filter-range-separator-font-weight: var(--fui-text-small-weight);
  --fui-filter-range-separator-letter-spacing: var(--fui-text-small-tracking);
  --fui-filter-range-separator-font-feature-settings: var(--fui-text-small-feature);
  --fui-filter-range-separator-font-variation-settings: var(--fui-text-small-variation);
  --fui-filter-field-display: flex;
  --fui-filter-field-width: 100%;
  --fui-filter-field-gap: calc(var(--fui-spacing) * 3);
  --fui-filter-field-content-display: flex;
  --fui-filter-field-content-flex: 1;
  --fui-filter-field-content-flex-direction: column;
  --fui-filter-field-content-gap: calc(var(--fui-spacing) * 1);
  --fui-filter-list-root-display: flex;
  --fui-filter-list-root-flex-direction: column;
  --fui-filter-range-flex-direction: column;
  --fui-filter-range-padding-x: calc(var(--fui-spacing) * 3);
  --fui-filter-range-padding-y: calc(var(--fui-spacing) * 2.5);
  --fui-filter-rating-padding-x: calc(var(--fui-spacing) * 3);
  --fui-filter-rating-padding-y: calc(var(--fui-spacing) * 2.5);
  --fui-filter-reset-root-margin-top: calc(var(--fui-spacing) * 2);
  --fui-filter-reset-root-display: flex;
  --fui-filter-reset-root-align-items: center;
  --fui-filter-reset-root-justify-content: center;
  --fui-filter-slider-flex-direction: column;
  --fui-filter-slider-padding-x: calc(var(--fui-spacing) * 3);
  --fui-filter-slider-padding-y: calc(var(--fui-spacing) * 2.5);
  --fui-filter-switch-padding-x: calc(var(--fui-spacing) * 3);
  --fui-filter-switch-padding-y: calc(var(--fui-spacing) * 2.5);
  --fui-product-card-basic-image-rounded: var(--fui-radius-none);
  --fui-product-card-basic-width: 100%;
  --fui-product-card-hover-image-rounded: var(--fui-radius-none);
  --fui-product-card-horizontal-image-rounded: var(--fui-radius-none);
  --fui-product-card-horizontal-padding-y: calc(var(--fui-spacing) * 0);
  --fui-product-card-gallery-image-rounded: var(--fui-radius-none);
  --fui-product-card-gallery-badge-text-transform: uppercase;
  --fui-product-card-gallery-title-font-family: var(--fui-text-ui-family);
  --fui-product-card-gallery-title-font-size: var(--fui-text-ui-size);
  --fui-product-card-gallery-title-line-height: var(--fui-text-ui-line-height);
  --fui-product-card-gallery-title-font-weight: 600;
  --fui-product-card-gallery-title-letter-spacing: var(--fui-text-ui-tracking);
  --fui-product-card-gallery-title-font-feature-settings: var(--fui-text-ui-feature);
  --fui-product-card-gallery-title-font-variation-settings: var(--fui-text-ui-variation);
  --fui-product-card-minimal-image-rounded: var(--fui-radius-none);
  --fui-product-card-featured-image-rounded: var(--fui-radius-none);
  --fui-product-card-featured-description-text-color: var(--fui-muted-foreground);
  --fui-product-card-featured-description-font-family: var(--fui-text-small-family);
  --fui-product-card-featured-description-font-size: var(--fui-text-small-size);
  --fui-product-card-featured-description-line-height: var(--fui-text-small-line-height);
  --fui-product-card-featured-description-font-weight: 500;
  --fui-product-card-featured-description-letter-spacing: var(--fui-text-small-tracking);
  --fui-product-card-featured-description-font-feature-settings: var(--fui-text-small-feature);
  --fui-product-card-featured-description-font-variation-settings: var(--fui-text-small-variation);
  --fui-navigation-shop-trigger-beside-background-color: transparent;
  --fui-navigation-shop-trigger-beside-rounded: var(--fui-radius-md);
  --fui-navigation-shop-trigger-beside-height: calc(var(--fui-spacing) * 9);
  --fui-navigation-shop-trigger-beside-padding-x: calc(var(--fui-spacing) * 4);
  --fui-navigation-shop-trigger-beside-padding-y: calc(var(--fui-spacing) * 2);
  --fui-navigation-shop-trigger-beside-hover-background-color: var(--fui-accent);
  --fui-navigation-shop-trigger-beside-hover-text-color: var(--fui-accent-foreground);
  --fui-navigation-shop-trigger-beside-open-background-color: color-mix(in oklab, var(--fui-accent) 50%, transparent);
  --fui-navigation-shop-trigger-above-background-color: transparent;
  --fui-navigation-shop-trigger-above-rounded: var(--fui-radius-md);
  --fui-navigation-shop-trigger-above-height: calc(var(--fui-spacing) * 9);
  --fui-navigation-shop-trigger-above-padding-x: calc(var(--fui-spacing) * 4);
  --fui-navigation-shop-trigger-above-padding-y: calc(var(--fui-spacing) * 2);
  --fui-navigation-shop-trigger-above-hover-background-color: var(--fui-accent);
  --fui-navigation-shop-trigger-above-hover-text-color: var(--fui-accent-foreground);
  --fui-navigation-shop-trigger-above-open-background-color: color-mix(in oklab, var(--fui-accent) 50%, transparent);
  --fui-navigation-shop-trigger-captioned-text-color: color-mix(in oklab, var(--fui-foreground) 70%, transparent);
  --fui-navigation-shop-trigger-captioned-border-bottom: var(--fui-border-strong);
  --fui-navigation-shop-trigger-captioned-border-color: transparent;
  --fui-navigation-shop-trigger-captioned-hover-text-color: color-mix(in oklab, var(--fui-foreground) 80%, transparent);
  --fui-navigation-shop-trigger-captioned-open-text-color: var(--fui-foreground);
  --fui-navigation-shop-trigger-captioned-open-border-color: var(--fui-primary);
  --fui-navigation-shop-page-font-family: var(--fui-text-ui-family);
  --fui-navigation-shop-page-font-size: var(--fui-text-ui-size);
  --fui-navigation-shop-page-line-height: var(--fui-text-ui-line-height);
  --fui-navigation-shop-page-font-weight: var(--fui-text-ui-weight);
  --fui-navigation-shop-page-letter-spacing: var(--fui-text-ui-tracking);
  --fui-navigation-shop-page-font-feature-settings: var(--fui-text-ui-feature);
  --fui-navigation-shop-page-font-variation-settings: var(--fui-text-ui-variation);
  --fui-navigation-shop-page-beside-background-color: transparent;
  --fui-navigation-shop-page-beside-rounded: var(--fui-radius-md);
  --fui-navigation-shop-page-beside-height: calc(var(--fui-spacing) * 9);
  --fui-navigation-shop-page-beside-padding-x: calc(var(--fui-spacing) * 4);
  --fui-navigation-shop-page-beside-padding-y: calc(var(--fui-spacing) * 2);
  --fui-navigation-shop-page-beside-hover-background-color: var(--fui-accent);
  --fui-navigation-shop-page-beside-hover-text-color: var(--fui-accent-foreground);
  --fui-navigation-shop-page-beside-open-background-color: color-mix(in oklab, var(--fui-accent) 50%, transparent);
  --fui-navigation-shop-page-above-background-color: transparent;
  --fui-navigation-shop-page-above-rounded: var(--fui-radius-md);
  --fui-navigation-shop-page-above-height: calc(var(--fui-spacing) * 9);
  --fui-navigation-shop-page-above-padding-x: calc(var(--fui-spacing) * 4);
  --fui-navigation-shop-page-above-padding-y: calc(var(--fui-spacing) * 2);
  --fui-navigation-shop-page-above-hover-background-color: var(--fui-accent);
  --fui-navigation-shop-page-above-hover-text-color: var(--fui-accent-foreground);
  --fui-navigation-shop-page-above-open-background-color: color-mix(in oklab, var(--fui-accent) 50%, transparent);
  --fui-navigation-shop-page-captioned-text-color: color-mix(in oklab, var(--fui-foreground) 70%, transparent);
  --fui-navigation-shop-page-captioned-hover-text-color: color-mix(in oklab, var(--fui-foreground) 80%, transparent);
  --fui-navigation-shop-page-highlight-text-color: var(--fui-destructive);
  --fui-navigation-shop-content-captioned-border-top: none;
  --fui-navigation-shop-content-captioned-font-family: var(--fui-text-small-family);
  --fui-navigation-shop-content-captioned-font-size: var(--fui-text-small-size);
  --fui-navigation-shop-content-captioned-line-height: var(--fui-text-small-line-height);
  --fui-navigation-shop-content-captioned-font-weight: var(--fui-text-small-weight);
  --fui-navigation-shop-content-captioned-letter-spacing: var(--fui-text-small-tracking);
  --fui-navigation-shop-content-captioned-font-feature-settings: var(--fui-text-small-feature);
  --fui-navigation-shop-content-captioned-font-variation-settings: var(--fui-text-small-variation);
  --fui-navigation-shop-viewport-above-shadow: none;
  --fui-navigation-shop-viewport-captioned-shadow: var(--fui-shadow-sm);
  --fui-navigation-shop-featured-image-background-color: var(--fui-muted);
  --fui-navigation-shop-featured-image-beside-rounded: var(--fui-radius-lg);
  --fui-navigation-shop-featured-image-above-rounded: var(--fui-radius-lg);
  --fui-navigation-shop-featured-image-captioned-rounded: var(--fui-radius-md);
  --fui-navigation-shop-caption-background-color: color-mix(in oklab, var(--fui-background) 90%, transparent);
  --fui-navigation-shop-caption-font-family: var(--fui-text-small-family);
  --fui-navigation-shop-caption-font-size: var(--fui-text-small-size);
  --fui-navigation-shop-caption-line-height: var(--fui-text-small-line-height);
  --fui-navigation-shop-caption-font-weight: var(--fui-text-small-weight);
  --fui-navigation-shop-caption-letter-spacing: var(--fui-text-small-tracking);
  --fui-navigation-shop-caption-font-feature-settings: var(--fui-text-small-feature);
  --fui-navigation-shop-caption-font-variation-settings: var(--fui-text-small-variation);
  --fui-navigation-shop-caption-padding-x: calc(var(--fui-spacing) * 4);
  --fui-navigation-shop-caption-padding-y: calc(var(--fui-spacing) * 3);
  --fui-navigation-shop-columns-font-family: var(--fui-text-small-family);
  --fui-navigation-shop-columns-font-size: var(--fui-text-small-size);
  --fui-navigation-shop-columns-line-height: var(--fui-text-small-line-height);
  --fui-navigation-shop-columns-font-weight: var(--fui-text-small-weight);
  --fui-navigation-shop-columns-letter-spacing: var(--fui-text-small-tracking);
  --fui-navigation-shop-columns-font-feature-settings: var(--fui-text-small-feature);
  --fui-navigation-shop-columns-font-variation-settings: var(--fui-text-small-variation);
  --fui-navigation-shop-root-display: flex;
  --fui-navigation-shop-root-align-items: center;
  --fui-header-shop-announcement-background-color: var(--fui-foreground);
  --fui-header-shop-announcement-text-color: var(--fui-background);
  --fui-header-shop-announcement-font-family: var(--fui-text-caption-family);
  --fui-header-shop-announcement-font-size: var(--fui-text-caption-size);
  --fui-header-shop-announcement-line-height: var(--fui-text-caption-line-height);
  --fui-header-shop-announcement-font-weight: 400;
  --fui-header-shop-announcement-letter-spacing: 0.025em;
  --fui-header-shop-announcement-font-feature-settings: var(--fui-text-caption-feature);
  --fui-header-shop-announcement-font-variation-settings: var(--fui-text-caption-variation);
  --fui-header-shop-bar-background-color: var(--fui-background);
  --fui-header-shop-bar-border-bottom: var(--fui-border-default);
  --fui-header-shop-bar-border-color: var(--fui-border);
  --fui-header-shop-width: 100%;
  --fui-header-centered-background-color: var(--fui-background);
  --fui-header-centered-border-bottom: var(--fui-border-default);
  --fui-header-centered-border-color: var(--fui-border);
  --fui-header-centered-width: 100%;
  --fui-header-centered-logo-font-family: var(--fui-text-headline-family);
  --fui-header-centered-logo-font-size: var(--fui-text-headline-size);
  --fui-header-centered-logo-line-height: var(--fui-text-headline-line-height);
  --fui-header-centered-logo-font-weight: 700;
  --fui-header-centered-logo-letter-spacing: -0.025em;
  --fui-header-centered-logo-font-feature-settings: var(--fui-text-headline-feature);
  --fui-header-centered-logo-font-variation-settings: var(--fui-text-headline-variation);
  --fui-header-centered-nav-border-top: var(--fui-border-default);
  --fui-header-centered-nav-border-color: var(--fui-border);
  --fui-header-checkout-background-color: var(--fui-background);
  --fui-header-checkout-border-bottom: var(--fui-border-default);
  --fui-header-checkout-border-color: var(--fui-border);
  --fui-header-checkout-width: 100%;
  --fui-footer-rich-newsletter-background-color: var(--fui-muted);
  --fui-footer-rich-heading-font-family: var(--fui-text-subheading-family);
  --fui-footer-rich-heading-font-size: var(--fui-text-subheading-size);
  --fui-footer-rich-heading-line-height: var(--fui-text-subheading-line-height);
  --fui-footer-rich-heading-font-weight: var(--fui-text-subheading-weight);
  --fui-footer-rich-heading-letter-spacing: var(--fui-text-subheading-tracking);
  --fui-footer-rich-heading-font-feature-settings: var(--fui-text-subheading-feature);
  --fui-footer-rich-heading-font-variation-settings: var(--fui-text-subheading-variation);
  --fui-footer-rich-legal-background-color: var(--fui-foreground);
  --fui-footer-rich-legal-text-color: var(--fui-background);
  --fui-footer-rich-legal-font-family: var(--fui-text-small-family);
  --fui-footer-rich-legal-font-size: var(--fui-text-small-size);
  --fui-footer-rich-legal-line-height: var(--fui-text-small-line-height);
  --fui-footer-rich-legal-font-weight: var(--fui-text-small-weight);
  --fui-footer-rich-legal-letter-spacing: var(--fui-text-small-tracking);
  --fui-footer-rich-legal-font-feature-settings: var(--fui-text-small-feature);
  --fui-footer-rich-legal-font-variation-settings: var(--fui-text-small-variation);
  --fui-footer-rich-legal-link-text-color: color-mix(in oklab, var(--fui-background) 70%, transparent);
  --fui-footer-rich-legal-link-hover-text-color: var(--fui-background);
  --fui-footer-rich-legal-logo-font-family: var(--fui-text-small-family);
  --fui-footer-rich-legal-logo-font-size: var(--fui-text-small-size);
  --fui-footer-rich-legal-logo-line-height: var(--fui-text-small-line-height);
  --fui-footer-rich-legal-logo-font-weight: 700;
  --fui-footer-rich-legal-logo-letter-spacing: 0em;
  --fui-footer-rich-legal-logo-font-feature-settings: var(--fui-text-small-feature);
  --fui-footer-rich-legal-logo-font-variation-settings: var(--fui-text-small-variation);
  --fui-footer-rich-legal-note-text-color: color-mix(in oklab, var(--fui-background) 70%, transparent);
  --fui-footer-rich-title-font-family: var(--fui-text-ui-family);
  --fui-footer-rich-title-font-size: var(--fui-text-ui-size);
  --fui-footer-rich-title-line-height: var(--fui-text-ui-line-height);
  --fui-footer-rich-title-font-weight: 600;
  --fui-footer-rich-title-letter-spacing: var(--fui-text-ui-tracking);
  --fui-footer-rich-title-font-feature-settings: var(--fui-text-ui-feature);
  --fui-footer-rich-title-font-variation-settings: var(--fui-text-ui-variation);
  --fui-footer-rich-width: 100%;
  --fui-footer-brand-title-font-family: var(--fui-text-ui-family);
  --fui-footer-brand-title-font-size: var(--fui-text-ui-size);
  --fui-footer-brand-title-line-height: var(--fui-text-ui-line-height);
  --fui-footer-brand-title-font-weight: 600;
  --fui-footer-brand-title-letter-spacing: var(--fui-text-ui-tracking);
  --fui-footer-brand-title-font-feature-settings: var(--fui-text-ui-feature);
  --fui-footer-brand-title-font-variation-settings: var(--fui-text-ui-variation);
  --fui-footer-minimal-logo-font-family: var(--fui-text-lead-family);
  --fui-footer-minimal-logo-font-size: var(--fui-text-lead-size);
  --fui-footer-minimal-logo-line-height: var(--fui-text-lead-line-height);
  --fui-footer-minimal-logo-font-weight: 700;
  --fui-footer-minimal-logo-letter-spacing: -0.025em;
  --fui-footer-minimal-logo-font-feature-settings: var(--fui-text-lead-feature);
  --fui-footer-minimal-logo-font-variation-settings: var(--fui-text-lead-variation);
  --fui-footer-minimal-width: 100%;
  --fui-footer-trust-icon-background-color: var(--fui-muted);
  --fui-footer-trust-icon-rounded: var(--fui-radius-full);
  --fui-footer-trust-icon-size: calc(var(--fui-spacing) * 10);
  --fui-footer-trust-icon-icon-size: calc(var(--fui-spacing) * 5);
  --fui-footer-trust-width: 100%;
  --fui-footer-brand-background-color: color-mix(in oklab, var(--fui-muted) 50%, transparent);
  --fui-footer-brand-width: 100%;
  --fui-review-cards-heading-font-family: var(--fui-text-headline-family);
  --fui-review-cards-heading-font-size: var(--fui-text-headline-size);
  --fui-review-cards-heading-line-height: var(--fui-text-headline-line-height);
  --fui-review-cards-heading-font-weight: 700;
  --fui-review-cards-heading-letter-spacing: -0.025em;
  --fui-review-cards-heading-font-feature-settings: var(--fui-text-headline-feature);
  --fui-review-cards-heading-font-variation-settings: var(--fui-text-headline-variation);
  --fui-review-cards-average-font-family: var(--fui-text-display-family);
  --fui-review-cards-average-font-size: var(--fui-text-display-size);
  --fui-review-cards-average-line-height: var(--fui-text-display-line-height);
  --fui-review-cards-average-font-weight: var(--fui-text-display-weight);
  --fui-review-cards-average-letter-spacing: var(--fui-text-display-tracking);
  --fui-review-cards-average-font-feature-settings: var(--fui-text-display-feature);
  --fui-review-cards-average-font-variation-settings: var(--fui-text-display-variation);
  --fui-review-cards-summary-font-family: var(--fui-text-small-family);
  --fui-review-cards-summary-font-size: var(--fui-text-small-size);
  --fui-review-cards-summary-line-height: var(--fui-text-small-line-height);
  --fui-review-cards-summary-font-weight: var(--fui-text-small-weight);
  --fui-review-cards-summary-letter-spacing: var(--fui-text-small-tracking);
  --fui-review-cards-summary-font-feature-settings: var(--fui-text-small-feature);
  --fui-review-cards-summary-font-variation-settings: var(--fui-text-small-variation);
  --fui-review-cards-star-font-family: var(--fui-text-small-family);
  --fui-review-cards-star-font-size: var(--fui-text-small-size);
  --fui-review-cards-star-line-height: var(--fui-text-small-line-height);
  --fui-review-cards-star-font-weight: 500;
  --fui-review-cards-star-letter-spacing: var(--fui-text-small-tracking);
  --fui-review-cards-star-font-feature-settings: var(--fui-text-small-feature);
  --fui-review-cards-star-font-variation-settings: var(--fui-text-small-variation);
  --fui-review-cards-star-width: calc(var(--fui-spacing) * 3);
  --fui-review-cards-percent-font-family: var(--fui-text-small-family);
  --fui-review-cards-percent-font-size: var(--fui-text-small-size);
  --fui-review-cards-percent-line-height: var(--fui-text-small-line-height);
  --fui-review-cards-percent-font-weight: var(--fui-text-small-weight);
  --fui-review-cards-percent-letter-spacing: var(--fui-text-small-tracking);
  --fui-review-cards-percent-font-feature-settings: var(--fui-text-small-feature);
  --fui-review-cards-percent-font-variation-settings: var(--fui-text-small-variation);
  --fui-review-cards-percent-width: calc(var(--fui-spacing) * 10);
  --fui-review-cards-content-text-color: var(--fui-muted-foreground);
  --fui-review-cards-content-font-family: var(--fui-text-copy-family);
  --fui-review-cards-content-font-size: var(--fui-text-copy-size);
  --fui-review-cards-content-line-height: var(--fui-text-copy-line-height);
  --fui-review-cards-content-font-weight: var(--fui-text-copy-weight);
  --fui-review-cards-content-letter-spacing: var(--fui-text-copy-tracking);
  --fui-review-cards-content-font-feature-settings: var(--fui-text-copy-feature);
  --fui-review-cards-content-font-variation-settings: var(--fui-text-copy-variation);
  --fui-review-cards-content-margin-top: calc(var(--fui-spacing) * 4);
  --fui-review-cards-author-font-family: var(--fui-text-ui-family);
  --fui-review-cards-author-font-size: var(--fui-text-ui-size);
  --fui-review-cards-author-line-height: var(--fui-text-ui-line-height);
  --fui-review-cards-author-font-weight: 700;
  --fui-review-cards-author-letter-spacing: var(--fui-text-ui-tracking);
  --fui-review-cards-author-font-feature-settings: var(--fui-text-ui-feature);
  --fui-review-cards-author-font-variation-settings: var(--fui-text-ui-variation);
  --fui-review-cards-width: 100%;
  --fui-filter-toolbar-bar-background-color: var(--fui-card);
  --fui-filter-toolbar-bar-border: var(--fui-border-default);
  --fui-filter-toolbar-bar-border-color: var(--fui-border);
  --fui-filter-toolbar-bar-rounded: var(--fui-radius-lg);
  --fui-filter-toolbar-bar-padding: calc(var(--fui-spacing) * 3);
  --fui-filter-toolbar-bar-gap: calc(var(--fui-spacing) * 3);
  --fui-filter-toolbar-width: 100%;
  --fui-category-filter-heading-font-family: var(--fui-text-display-family);
  --fui-category-filter-heading-font-size: var(--fui-text-display-size);
  --fui-category-filter-heading-line-height: var(--fui-text-display-line-height);
  --fui-category-filter-heading-font-weight: 700;
  --fui-category-filter-heading-letter-spacing: -0.025em;
  --fui-category-filter-heading-font-feature-settings: var(--fui-text-display-feature);
  --fui-category-filter-heading-font-variation-settings: var(--fui-text-display-variation);
  --fui-category-filter-description-margin-top: calc(var(--fui-spacing) * 4);
  --fui-category-filter-description-text-color: var(--fui-muted-foreground);
  --fui-category-filter-description-font-family: var(--fui-text-body-family);
  --fui-category-filter-description-font-size: var(--fui-text-body-size);
  --fui-category-filter-description-line-height: var(--fui-text-body-line-height);
  --fui-category-filter-description-font-weight: var(--fui-text-body-weight);
  --fui-category-filter-description-letter-spacing: var(--fui-text-body-tracking);
  --fui-category-filter-description-font-feature-settings: var(--fui-text-body-feature);
  --fui-category-filter-description-font-variation-settings: var(--fui-text-body-variation);
  --fui-category-filter-width: 100%;
  --fui-category-grid-heading-font-family: var(--fui-text-display-family);
  --fui-category-grid-heading-font-size: var(--fui-text-display-size);
  --fui-category-grid-heading-line-height: var(--fui-text-display-line-height);
  --fui-category-grid-heading-font-weight: 600;
  --fui-category-grid-heading-letter-spacing: var(--fui-text-display-tracking);
  --fui-category-grid-heading-font-feature-settings: var(--fui-text-display-feature);
  --fui-category-grid-heading-font-variation-settings: var(--fui-text-display-variation);
  --fui-category-grid-description-text-color: var(--fui-muted-foreground);
  --fui-category-grid-description-font-family: var(--fui-text-body-family);
  --fui-category-grid-description-font-size: var(--fui-text-body-size);
  --fui-category-grid-description-line-height: var(--fui-text-body-line-height);
  --fui-category-grid-description-font-weight: var(--fui-text-body-weight);
  --fui-category-grid-description-letter-spacing: var(--fui-text-body-tracking);
  --fui-category-grid-description-font-feature-settings: var(--fui-text-body-feature);
  --fui-category-grid-description-font-variation-settings: var(--fui-text-body-variation);
  --fui-category-grid-dismiss-rounded: var(--fui-radius-full);
  --fui-category-grid-dismiss-bleed-end: calc(-1 * calc(var(--fui-spacing) * 1));
  --fui-category-grid-dismiss-margin-start: calc(var(--fui-spacing) * 0.5);
  --fui-category-grid-dismiss-size: calc(var(--fui-spacing) * 4);
  --fui-category-grid-dismiss-hover-background-color: color-mix(in oklab, var(--fui-muted-foreground) 20%, transparent);
  --fui-category-grid-width: 100%;
  --fui-cart-item-detailed-line-gap: calc(var(--fui-spacing) * 4);
  --fui-cart-item-detailed-image-border: var(--fui-border-default);
  --fui-cart-item-detailed-image-border-color: var(--fui-border);
  --fui-cart-item-detailed-image-rounded: var(--fui-radius-md);
  --fui-cart-item-detailed-image-size: calc(var(--fui-spacing) * 24);
  --fui-cart-item-detailed-quantity-font-family: var(--fui-text-small-family);
  --fui-cart-item-detailed-quantity-font-size: var(--fui-text-small-size);
  --fui-cart-item-detailed-quantity-line-height: var(--fui-text-small-line-height);
  --fui-cart-item-detailed-quantity-font-weight: 500;
  --fui-cart-item-detailed-quantity-letter-spacing: var(--fui-text-small-tracking);
  --fui-cart-item-detailed-quantity-font-feature-settings: var(--fui-text-small-feature);
  --fui-cart-item-detailed-quantity-font-variation-settings: var(--fui-text-small-variation);
  --fui-cart-item-detailed-quantity-width: calc(var(--fui-spacing) * 8);
  --fui-cart-item-detailed-display: flex;
  --fui-cart-item-detailed-flex-direction: column;
  --fui-cart-item-detailed-gap: calc(var(--fui-spacing) * 5);
  --fui-cart-item-compact-image-border: var(--fui-border-default);
  --fui-cart-item-compact-image-border-color: var(--fui-border);
  --fui-cart-item-compact-image-rounded: var(--fui-radius-md);
  --fui-cart-item-compact-image-size: calc(var(--fui-spacing) * 18);
  --fui-cart-item-compact-display: flex;
  --fui-cart-item-compact-flex-direction: column;
  --fui-cart-item-compact-gap: calc(var(--fui-spacing) * 5);
  --fui-cart-item-minimal-image-border: var(--fui-border-default);
  --fui-cart-item-minimal-image-border-color: var(--fui-border);
  --fui-cart-item-minimal-image-rounded: var(--fui-radius-md);
  --fui-cart-item-minimal-image-size: calc(var(--fui-spacing) * 12);
  --fui-cart-item-minimal-display: flex;
  --fui-cart-item-minimal-flex-direction: column;
  --fui-cart-item-minimal-gap: calc(var(--fui-spacing) * 3);
  --fui-cart-minimal-title-font-family: var(--fui-text-ui-family);
  --fui-cart-minimal-title-font-size: var(--fui-text-ui-size);
  --fui-cart-minimal-title-line-height: var(--fui-text-ui-line-height);
  --fui-cart-minimal-title-font-weight: 600;
  --fui-cart-minimal-title-letter-spacing: var(--fui-text-ui-tracking);
  --fui-cart-minimal-title-font-feature-settings: var(--fui-text-ui-feature);
  --fui-cart-minimal-title-font-variation-settings: var(--fui-text-ui-variation);
  --fui-search-suggestions-image-border: var(--fui-border-default);
  --fui-search-suggestions-image-border-color: var(--fui-border);
  --fui-search-suggestions-image-rounded: var(--fui-radius-md);
  --fui-search-suggestions-image-size: calc(var(--fui-spacing) * 12);
  --fui-search-suggestions-pick-gap: calc(var(--fui-spacing) * 2);
  --fui-search-suggestions-pick-padding: calc(var(--fui-spacing) * 2);
  --fui-order-summary-image-border: var(--fui-border-default);
  --fui-order-summary-image-border-color: var(--fui-border);
  --fui-order-summary-image-rounded: var(--fui-radius-md);
  --fui-order-summary-image-size: calc(var(--fui-spacing) * 14);
  --fui-order-tracking-eta-font-family: var(--fui-text-title-family);
  --fui-order-tracking-eta-font-size: var(--fui-text-title-size);
  --fui-order-tracking-eta-line-height: var(--fui-text-title-line-height);
  --fui-order-tracking-eta-font-weight: var(--fui-text-title-weight);
  --fui-order-tracking-eta-letter-spacing: var(--fui-text-title-tracking);
  --fui-order-tracking-eta-font-feature-settings: var(--fui-text-title-feature);
  --fui-order-tracking-eta-font-variation-settings: var(--fui-text-title-variation);
  --fui-order-tracking-parcel-background-color: var(--fui-muted);
  --fui-order-tracking-parcel-rounded: var(--fui-radius-md);
  --fui-order-tracking-parcel-padding-x: calc(var(--fui-spacing) * 4);
  --fui-order-tracking-parcel-padding-y: calc(var(--fui-spacing) * 3);
  --fui-order-tracking-parcel-gap: calc(var(--fui-spacing) * 3);
  --fui-account-access-delete-title-text-color: var(--fui-destructive);
  --fui-product-options-image-background-color: var(--fui-muted);
  --fui-product-options-image-rounded: var(--fui-radius-md);
  --fui-filters-range-to-text-color: var(--fui-muted-foreground);
  --fui-filters-range-to-font-family: var(--fui-text-ui-family);
  --fui-filters-range-to-font-size: var(--fui-text-ui-size);
  --fui-filters-range-to-line-height: var(--fui-text-ui-line-height);
  --fui-filters-range-to-font-weight: var(--fui-text-ui-weight);
  --fui-filters-range-to-letter-spacing: var(--fui-text-ui-tracking);
  --fui-filters-range-to-font-feature-settings: var(--fui-text-ui-feature);
  --fui-filters-range-to-font-variation-settings: var(--fui-text-ui-variation);
  --fui-reviews-stars-text-color: var(--fui-muted-foreground);
  --fui-reviews-stars-font-family: var(--fui-text-caption-family);
  --fui-reviews-stars-font-size: var(--fui-text-caption-size);
  --fui-reviews-stars-line-height: var(--fui-text-caption-line-height);
  --fui-reviews-stars-font-weight: 400;
  --fui-reviews-stars-letter-spacing: var(--fui-text-caption-tracking);
  --fui-reviews-stars-font-feature-settings: var(--fui-text-caption-feature);
  --fui-reviews-stars-font-variation-settings: var(--fui-text-caption-variation);
  --fui-reviews-stars-width: calc(var(--fui-spacing) * 3);
  --fui-reviews-count-text-color: var(--fui-muted-foreground);
  --fui-reviews-count-font-family: var(--fui-text-caption-family);
  --fui-reviews-count-font-size: var(--fui-text-caption-size);
  --fui-reviews-count-line-height: var(--fui-text-caption-line-height);
  --fui-reviews-count-font-weight: 400;
  --fui-reviews-count-letter-spacing: var(--fui-text-caption-tracking);
  --fui-reviews-count-font-feature-settings: var(--fui-text-caption-feature);
  --fui-reviews-count-font-variation-settings: var(--fui-text-caption-variation);
  --fui-reviews-count-width: calc(var(--fui-spacing) * 7);
  --fui-reviews-count-text-align: end;
  --fui-reviews-verified-text-color: var(--fui-positive);
  --fui-reviews-verified-font-family: var(--fui-text-caption-family);
  --fui-reviews-verified-font-size: var(--fui-text-caption-size);
  --fui-reviews-verified-line-height: var(--fui-text-caption-line-height);
  --fui-reviews-verified-font-weight: var(--fui-text-caption-weight);
  --fui-reviews-verified-letter-spacing: var(--fui-text-caption-tracking);
  --fui-reviews-verified-font-feature-settings: var(--fui-text-caption-feature);
  --fui-reviews-verified-font-variation-settings: var(--fui-text-caption-variation);
  --fui-reviews-verified-gap: calc(var(--fui-spacing) * 1);
  --fui-reviews-verified-icon-size: calc(var(--fui-spacing) * 3.5);
  --fui-return-request-option-font-weight: 400;
  --fui-delivery-slot-price-text-color: var(--fui-positive);
  --fui-delivery-slot-price-font-family: var(--fui-text-ui-family);
  --fui-delivery-slot-price-font-size: var(--fui-text-ui-size);
  --fui-delivery-slot-price-line-height: var(--fui-text-ui-line-height);
  --fui-delivery-slot-price-font-weight: var(--fui-text-ui-weight);
  --fui-delivery-slot-price-letter-spacing: var(--fui-text-ui-tracking);
  --fui-delivery-slot-price-font-feature-settings: var(--fui-text-ui-feature);
  --fui-delivery-slot-price-font-variation-settings: var(--fui-text-ui-variation);
  --fui-checkout-page-root-background-color: var(--fui-background);
  --fui-checkout-page-root-text-color: var(--fui-foreground);
  --fui-checkout-page-summary-background-color: var(--fui-primary);
  --fui-checkout-page-summary-text-color: var(--fui-primary-foreground);
  --fui-checkout-page-summary-toggle-font-family: var(--fui-text-ui-family);
  --fui-checkout-page-summary-toggle-font-size: var(--fui-text-ui-size);
  --fui-checkout-page-summary-toggle-line-height: var(--fui-text-ui-line-height);
  --fui-checkout-page-summary-toggle-font-weight: 600;
  --fui-checkout-page-summary-toggle-letter-spacing: var(--fui-text-ui-tracking);
  --fui-checkout-page-summary-toggle-font-feature-settings: var(--fui-text-ui-feature);
  --fui-checkout-page-summary-toggle-font-variation-settings: var(--fui-text-ui-variation);
  --fui-checkout-page-summary-toggle-gap: calc(var(--fui-spacing) * 1);
  --fui-checkout-page-total-image-border: var(--fui-border-default);
  --fui-checkout-page-total-image-border-color: var(--fui-border);
  --fui-checkout-page-total-image-rounded: var(--fui-radius-md);
  --fui-checkout-page-total-image-size: calc(var(--fui-spacing) * 12);
  --fui-review-list-width: 100%;
  --fui-cart-full-display: flex;
  --fui-cart-full-flex-direction: column;
  --fui-cart-full-gap: calc(var(--fui-spacing) * 6);
  --fui-filter-sheet-width: 100%;
  --fui-filter-sidebar-width: 100%;
}

@media (width >= 768px) {
  :root {
    --fui-text-control-size: 0.875rem;
    --fui-text-control-line-height: 1.43;
  }
}

@theme inline {
  /* color */
  --color-background: var(--fui-background);
  --color-foreground: var(--fui-foreground);
  --color-foreground-hover: var(--fui-foreground-hover);
  --color-popover: var(--fui-popover);
  --color-popover-foreground: var(--fui-popover-foreground);
  --color-card: var(--fui-card);
  --color-card-foreground: var(--fui-card-foreground);
  --color-primary: var(--fui-primary);
  --color-primary-foreground: var(--fui-primary-foreground);
  --color-primary-hover: var(--fui-primary-hover);
  --color-secondary: var(--fui-secondary);
  --color-secondary-foreground: var(--fui-secondary-foreground);
  --color-active: var(--fui-active);
  --color-active-foreground: var(--fui-active-foreground);
  --color-muted: var(--fui-muted);
  --color-muted-foreground: var(--fui-muted-foreground);
  --color-accent: var(--fui-accent);
  --color-accent-foreground: var(--fui-accent-foreground);
  --color-border: var(--fui-border);
  --color-input: var(--fui-input);
  --color-ring: var(--fui-ring);
  --color-destructive: var(--fui-destructive);
  --color-destructive-foreground: var(--fui-destructive-foreground);
  --color-destructive-hover: var(--fui-destructive-hover);
  --color-info: var(--fui-info);
  --color-info-foreground: var(--fui-info-foreground);
  --color-positive: var(--fui-positive);
  --color-positive-foreground: var(--fui-positive-foreground);
  --color-warning: var(--fui-warning);
  --color-warning-foreground: var(--fui-warning-foreground);
  --color-buy: var(--fui-buy);
  --color-buy-foreground: var(--fui-buy-foreground);
  --color-buy-hover: var(--fui-buy-hover);
  --color-checkout: var(--fui-checkout);
  --color-checkout-foreground: var(--fui-checkout-foreground);
  --color-checkout-hover: var(--fui-checkout-hover);
  --color-promo: var(--fui-promo);
  --color-promo-foreground: var(--fui-promo-foreground);
  --color-discount: var(--fui-discount);
  --color-discount-foreground: var(--fui-discount-foreground);
  --color-new: var(--fui-new);
  --color-new-foreground: var(--fui-new-foreground);
  --color-price: var(--fui-price);
  --color-price-foreground: var(--fui-price-foreground);
  --color-rating: var(--fui-rating);
  --color-rating-foreground: var(--fui-rating-foreground);

  /* type */
  --default-font-family: var(--fui-font-sans);
  --font-sans: var(--fui-font-sans);
  --font-heading: var(--fui-font-heading);
  --font-mono: var(--fui-font-mono);
  --text-xs: var(--fui-text-xs);
  --text-sm: var(--fui-text-sm);
  --text-base: var(--fui-text-base);
  --text-lg: var(--fui-text-lg);
  --text-xl: var(--fui-text-xl);
  --text-2xl: var(--fui-text-2xl);
  --text-3xl: var(--fui-text-3xl);
  --text-4xl: var(--fui-text-4xl);
  --text-5xl: var(--fui-text-5xl);
  --text-6xl: var(--fui-text-6xl);
  --text-heading: var(--fui-text-heading-size);
  --text-heading--line-height: var(--fui-text-heading-line-height);
  --text-heading--font-weight: var(--fui-text-heading-weight);
  --text-heading--letter-spacing: var(--fui-text-heading-tracking);
  --text-body: var(--fui-text-body-size);
  --text-body--line-height: var(--fui-text-body-line-height);
  --text-body--font-weight: var(--fui-text-body-weight);
  --text-body--letter-spacing: var(--fui-text-body-tracking);
  --font-body: var(--fui-text-body-family);
  --text-ui: var(--fui-text-ui-size);
  --text-ui--line-height: var(--fui-text-ui-line-height);
  --text-ui--font-weight: var(--fui-text-ui-weight);
  --text-ui--letter-spacing: var(--fui-text-ui-tracking);
  --font-ui: var(--fui-text-ui-family);
  --text-small: var(--fui-text-small-size);
  --text-small--line-height: var(--fui-text-small-line-height);
  --text-small--font-weight: var(--fui-text-small-weight);
  --text-small--letter-spacing: var(--fui-text-small-tracking);
  --font-small: var(--fui-text-small-family);
  --text-caption: var(--fui-text-caption-size);
  --text-caption--line-height: var(--fui-text-caption-line-height);
  --text-caption--font-weight: var(--fui-text-caption-weight);
  --text-caption--letter-spacing: var(--fui-text-caption-tracking);
  --font-caption: var(--fui-text-caption-family);
  --text-control: var(--fui-text-control-size);
  --text-control--line-height: var(--fui-text-control-line-height);
  --text-control--font-weight: var(--fui-text-control-weight);
  --text-control--letter-spacing: var(--fui-text-control-tracking);
  --font-control: var(--fui-text-control-family);
  --text-display: var(--fui-text-display-size);
  --text-display--line-height: var(--fui-text-display-line-height);
  --text-display--font-weight: var(--fui-text-display-weight);
  --text-display--letter-spacing: var(--fui-text-display-tracking);
  --font-display: var(--fui-text-display-family);
  --text-headline: var(--fui-text-headline-size);
  --text-headline--line-height: var(--fui-text-headline-line-height);
  --text-headline--font-weight: var(--fui-text-headline-weight);
  --text-headline--letter-spacing: var(--fui-text-headline-tracking);
  --font-headline: var(--fui-text-headline-family);
  --text-page-title: var(--fui-text-page-title-size);
  --text-page-title--line-height: var(--fui-text-page-title-line-height);
  --text-page-title--font-weight: var(--fui-text-page-title-weight);
  --text-page-title--letter-spacing: var(--fui-text-page-title-tracking);
  --font-page-title: var(--fui-text-page-title-family);
  --text-title: var(--fui-text-title-size);
  --text-title--line-height: var(--fui-text-title-line-height);
  --text-title--font-weight: var(--fui-text-title-weight);
  --text-title--letter-spacing: var(--fui-text-title-tracking);
  --font-title: var(--fui-text-title-family);
  --text-subheading: var(--fui-text-subheading-size);
  --text-subheading--line-height: var(--fui-text-subheading-line-height);
  --text-subheading--font-weight: var(--fui-text-subheading-weight);
  --text-subheading--letter-spacing: var(--fui-text-subheading-tracking);
  --font-subheading: var(--fui-text-subheading-family);
  --text-lead: var(--fui-text-lead-size);
  --text-lead--line-height: var(--fui-text-lead-line-height);
  --text-lead--font-weight: var(--fui-text-lead-weight);
  --text-lead--letter-spacing: var(--fui-text-lead-tracking);
  --font-lead: var(--fui-text-lead-family);
  --text-copy: var(--fui-text-copy-size);
  --text-copy--line-height: var(--fui-text-copy-line-height);
  --text-copy--font-weight: var(--fui-text-copy-weight);
  --text-copy--letter-spacing: var(--fui-text-copy-tracking);
  --font-copy: var(--fui-text-copy-family);
  --text-note: var(--fui-text-note-size);
  --text-note--line-height: var(--fui-text-note-line-height);
  --text-note--font-weight: var(--fui-text-note-weight);
  --text-note--letter-spacing: var(--fui-text-note-tracking);
  --font-note: var(--fui-text-note-family);
  --text-description: var(--fui-text-description-size);
  --text-description--line-height: var(--fui-text-description-line-height);
  --text-description--font-weight: var(--fui-text-description-weight);
  --text-description--letter-spacing: var(--fui-text-description-tracking);
  --font-description: var(--fui-text-description-family);
  --text-micro: var(--fui-text-micro-size);
  --text-micro--line-height: var(--fui-text-micro-line-height);
  --text-micro--font-weight: var(--fui-text-micro-weight);
  --text-micro--letter-spacing: var(--fui-text-micro-tracking);
  --font-micro: var(--fui-text-micro-family);
  --font-weight-normal: var(--fui-font-weight-normal);
  --font-weight-medium: var(--fui-font-weight-medium);
  --font-weight-semibold: var(--fui-font-weight-semibold);

  /* shape */
  --radius: var(--fui-radius);
  --radius-none: var(--fui-radius-none);
  --radius-sm: var(--fui-radius-sm);
  --radius-md: var(--fui-radius-md);
  --radius-lg: var(--fui-radius-lg);
  --radius-xl: var(--fui-radius-xl);
  --radius-full: var(--fui-radius-full);
  --shadow-xs: 0px 1px 2px 0px rgb(0 0 0 / 0.05);
  --shadow-sm: 0px 1px 3px 0px rgb(0 0 0 / 0.1), 0px 1px 2px -1px rgb(0 0 0 / 0.1);
  --shadow-md: 0px 4px 6px -1px rgb(0 0 0 / 0.1), 0px 2px 4px -2px rgb(0 0 0 / 0.1);
  --shadow-lg: 0px 10px 15px -3px rgb(0 0 0 / 0.1), 0px 4px 6px -4px rgb(0 0 0 / 0.1);
  --inset-shadow-xs: inset 0px 1px 2px 0px rgb(0 0 0 / 0.05);
  --drop-shadow-xs: 0px 1px 1px rgb(0 0 0 / 0.05);
  --inset-shadow-sm: inset 0px 1px 3px 0px rgb(0 0 0 / 0.1), inset 0px 1px 2px -1px rgb(0 0 0 / 0.1);
  --drop-shadow-sm: 0px 1px 1.5px rgb(0 0 0 / 0.1), 0px 1px 1px rgb(0 0 0 / 0.1);
  --inset-shadow-md: inset 0px 4px 6px -1px rgb(0 0 0 / 0.1), inset 0px 2px 4px -2px rgb(0 0 0 / 0.1);
  --drop-shadow-md: 0px 4px 3px rgb(0 0 0 / 0.1), 0px 2px 2px rgb(0 0 0 / 0.1);
  --inset-shadow-lg: inset 0px 10px 15px -3px rgb(0 0 0 / 0.1), inset 0px 4px 6px -4px rgb(0 0 0 / 0.1);
  --drop-shadow-lg: 0px 10px 7.5px rgb(0 0 0 / 0.1), 0px 4px 3px rgb(0 0 0 / 0.1);

  /* layout */
  --spacing: var(--fui-spacing);
  --breakpoint-sm: 640px;
  --breakpoint-md: 768px;
  --breakpoint-lg: 1024px;
  --breakpoint-xl: 1280px;
  --breakpoint-2xl: 1536px;
  --container-3xs: 16rem;
  --container-2xs: 18rem;
  --container-xs: 20rem;
  --container-sm: 24rem;
  --container-md: 28rem;
  --container-lg: 32rem;
  --container-xl: 36rem;
  --container-2xl: 42rem;
  --container-3xl: 48rem;
  --container-4xl: 56rem;
  --container-5xl: 64rem;
  --container-6xl: 72rem;
  --container-7xl: 80rem;

  /* motion */
  --animate-progress-indeterminate: progress-indeterminate 1.5s ease-in-out infinite;
  @keyframes progress-indeterminate {
    from {
      transform: translateX(-66.667%) scaleX(0.333);
    }
    to {
      transform: translateX(66.667%) scaleX(0.333);
    }
  }
}

body {
  container-type: inline-size;
}

@custom-variant data-open {
  &:where([data-state="open"]) {
    @slot;
  }
  &:where([data-open]:not([data-open="false"])) {
    @slot;
  }
}

@custom-variant data-closed {
  &:where([data-state="closed"]) {
    @slot;
  }
  &:where([data-closed]:not([data-closed="false"])) {
    @slot;
  }
}

@custom-variant data-state-delayed-open {
  &:where([data-state="delayed-open"]) {
    @slot;
  }
}

@custom-variant data-state-visible {
  &:where([data-state="visible"]) {
    @slot;
  }
}

@custom-variant data-state-hidden {
  &:where([data-state="hidden"]) {
    @slot;
  }
}

@custom-variant data-state-indeterminate {
  &:where([data-state="indeterminate"]) {
    @slot;
  }
}

@custom-variant data-side-top {
  &:where([data-side="top"]) {
    @slot;
  }
}

@custom-variant data-side-right {
  &:where([data-side="right"]) {
    @slot;
  }
}

@custom-variant data-side-bottom {
  &:where([data-side="bottom"]) {
    @slot;
  }
}

@custom-variant data-side-left {
  &:where([data-side="left"]) {
    @slot;
  }
}

@custom-variant data-motion-from {
  &:where([data-motion^="from-"]) {
    @slot;
  }
}

@custom-variant data-motion-to {
  &:where([data-motion^="to-"]) {
    @slot;
  }
}

@custom-variant data-motion-from-start {
  &:where([data-motion="from-start"]) {
    @slot;
  }
}

@custom-variant data-motion-from-end {
  &:where([data-motion="from-end"]) {
    @slot;
  }
}

@custom-variant data-motion-to-start {
  &:where([data-motion="to-start"]) {
    @slot;
  }
}

@custom-variant data-motion-to-end {
  &:where([data-motion="to-end"]) {
    @slot;
  }
}

@utility fui-focus-ring {
  --tw-sort: container-type;
  outline: var(--fui-focus-ring-outline);
  outline-offset: var(--fui-focus-ring-outline-offset);
  border-color: var(--fui-ring-border-color, var(--fui-focus-ring-border-color));
  outline-color: var(--fui-ring-color, var(--fui-focus-ring-outline-color));
}

@utility fui-disabled {
  --tw-sort: container-type;
  opacity: var(--fui-disabled-opacity);
}

@utility fui-invalid {
  --tw-sort: container-type;
  outline: var(--fui-invalid-outline);
  outline-offset: var(--fui-invalid-outline-offset);
  border-color: var(--fui-invalid-border-color);
  outline-color: var(--fui-invalid-outline-color);
}

@utility fui-control {
  --tw-sort: container-type;
  background-color: var(--fui-control-background-color);
  border: var(--fui-control-border);
  border-color: var(--fui-control-border-color);
  border-bottom-color: var(--fui-control-border-bottom-color);
  border-radius: var(--fui-control-rounded);
  font-family: var(--fui-control-font-family);
  font-size: var(--fui-control-font-size);
  line-height: var(--fui-control-line-height);
  font-weight: var(--fui-control-font-weight);
  letter-spacing: var(--fui-control-letter-spacing);
  font-feature-settings: var(--fui-control-font-feature-settings);
  font-variation-settings: var(--fui-control-font-variation-settings);
  &::placeholder {
    color: var(--fui-control-placeholder-color);
  }
  &:focus-visible {
    border-bottom: var(--fui-control-focus-border-bottom);
  }
  &:is([aria-invalid=true],[data-invalid]) {
    border-bottom-color: var(--fui-control-invalid-border-bottom-color);
  }
}

@utility fui-control-box {
  --tw-sort: container-type;
  border: var(--fui-control-box-border);
  border-color: var(--fui-control-box-border-color);
  box-shadow: var(--fui-control-box-shadow);
  border-radius: var(--fui-control-box-rounded);
  font-family: var(--fui-control-box-font-family);
  font-size: var(--fui-control-box-font-size);
  line-height: var(--fui-control-box-line-height);
  font-weight: var(--fui-control-box-font-weight);
  letter-spacing: var(--fui-control-box-letter-spacing);
  font-feature-settings: var(--fui-control-box-font-feature-settings);
  font-variation-settings: var(--fui-control-box-font-variation-settings);
}

@utility fui-control-line {
  --tw-sort: container-type;
  &::file-selector-button {
    background-color: var(--fui-control-line-file-background-color);
    border: var(--fui-control-line-file-border);
    color: var(--fui-control-line-file-text-color);
    font-family: var(--fui-control-line-file-font-family);
    font-size: var(--fui-control-line-file-font-size);
    line-height: var(--fui-control-line-file-line-height);
    font-weight: var(--fui-control-line-file-font-weight);
    letter-spacing: var(--fui-control-line-file-letter-spacing);
    font-feature-settings: var(--fui-control-line-file-font-feature-settings);
    font-variation-settings: var(--fui-control-line-file-font-variation-settings);
  }
}

@utility fui-choice {
  --tw-sort: container-type;
  background-color: var(--fui-choice-background-color);
  border: var(--fui-choice-border);
  border-color: var(--fui-choice-border-color);
}

@utility fui-choice-box {
  --tw-sort: container-type;
  border-radius: var(--fui-choice-box-rounded);
  &:is([data-state=checked],[data-state=indeterminate],[data-state=on],[aria-checked=true],[aria-checked=mixed],[aria-pressed=true]) {
    background-color: var(--fui-choice-box-checked-background-color);
    color: var(--fui-choice-box-checked-text-color);
    border-color: var(--fui-choice-box-checked-border-color);
  }
}

@utility fui-choice-dot {
  --tw-sort: container-type;
  border-radius: var(--fui-choice-dot-rounded);
  &:is([data-state=checked],[data-state=indeterminate],[data-state=on],[aria-checked=true],[aria-checked=mixed],[aria-pressed=true]) {
    border-color: var(--fui-choice-dot-checked-border-color);
  }
  &:is([data-state=checked],[data-state=indeterminate],[data-state=on],[aria-checked=true],[aria-checked=mixed],[aria-pressed=true]) svg {
    color: var(--fui-choice-dot-checked-icon-color);
  }
}

@utility fui-tag {
  --tw-sort: container-type;
  background-color: var(--fui-tag-background-color);
  border: var(--fui-tag-border);
  border-color: var(--fui-tag-border-color);
  border-radius: var(--fui-tag-rounded);
  font-family: var(--fui-tag-font-family);
  font-size: var(--fui-tag-font-size);
  line-height: var(--fui-tag-line-height);
  font-weight: var(--fui-tag-font-weight);
  letter-spacing: var(--fui-tag-letter-spacing);
  font-feature-settings: var(--fui-tag-font-feature-settings);
  font-variation-settings: var(--fui-tag-font-variation-settings);
  &:hover {
    background-color: var(--fui-tag-hover-background-color);
  }
}

@utility fui-menu-item {
  --tw-sort: container-type;
  border-radius: var(--fui-menu-item-rounded);
  font-family: var(--fui-menu-item-font-family);
  font-size: var(--fui-menu-item-font-size);
  line-height: var(--fui-menu-item-line-height);
  font-weight: var(--fui-menu-item-font-weight);
  letter-spacing: var(--fui-menu-item-letter-spacing);
  font-feature-settings: var(--fui-menu-item-font-feature-settings);
  font-variation-settings: var(--fui-menu-item-font-variation-settings);
  &:focus-visible {
    background-color: var(--fui-menu-item-focus-background-color);
    color: var(--fui-menu-item-focus-text-color);
  }
}

@utility fui-menu-item-destructive {
  --tw-sort: container-type;
  color: var(--fui-menu-item-destructive-text-color);
  & svg {
    color: var(--fui-menu-item-destructive-icon-color);
  }
  &:focus-visible {
    background-color: var(--fui-menu-item-destructive-focus-background-color);
    color: var(--fui-menu-item-destructive-focus-text-color);
  }
}

@utility fui-menu-label {
  --tw-sort: container-type;
  color: var(--fui-menu-label-text-color);
  font-family: var(--fui-menu-label-font-family);
  font-size: var(--fui-menu-label-font-size);
  line-height: var(--fui-menu-label-line-height);
  font-weight: var(--fui-menu-label-font-weight);
  letter-spacing: var(--fui-menu-label-letter-spacing);
  font-feature-settings: var(--fui-menu-label-font-feature-settings);
  font-variation-settings: var(--fui-menu-label-font-variation-settings);
  text-transform: var(--fui-menu-label-text-transform);
}

@utility fui-menu-shortcut {
  --tw-sort: container-type;
  color: var(--fui-menu-shortcut-text-color);
  font-family: var(--fui-menu-shortcut-font-family);
  font-size: var(--fui-menu-shortcut-font-size);
  line-height: var(--fui-menu-shortcut-line-height);
  font-weight: var(--fui-menu-shortcut-font-weight);
  letter-spacing: var(--fui-menu-shortcut-letter-spacing);
  font-feature-settings: var(--fui-menu-shortcut-font-feature-settings);
  font-variation-settings: var(--fui-menu-shortcut-font-variation-settings);
}

@utility fui-option-item {
  --tw-sort: container-type;
  border-radius: var(--fui-option-item-rounded);
  font-family: var(--fui-option-item-font-family);
  font-size: var(--fui-option-item-font-size);
  line-height: var(--fui-option-item-line-height);
  font-weight: var(--fui-option-item-font-weight);
  letter-spacing: var(--fui-option-item-letter-spacing);
  font-feature-settings: var(--fui-option-item-font-feature-settings);
  font-variation-settings: var(--fui-option-item-font-variation-settings);
  &[data-highlighted] {
    background-color: var(--fui-option-item-highlighted-background-color);
    color: var(--fui-option-item-highlighted-text-color);
  }
}

@utility fui-overlay {
  --tw-sort: container-type;
  outline: var(--fui-overlay-outline);
  outline-offset: var(--fui-overlay-outline-offset);
  background-color: var(--fui-overlay-background-color);
  color: var(--fui-overlay-text-color);
  outline-color: var(--fui-overlay-outline-color);
  border-radius: var(--fui-overlay-rounded);
  box-shadow: var(--fui-overlay-shadow);
}

@utility fui-overlay-modal {
  --tw-sort: container-type;
  outline: var(--fui-overlay-modal-outline);
  outline-offset: var(--fui-overlay-modal-outline-offset);
  background-color: var(--fui-overlay-modal-background-color);
  outline-color: var(--fui-overlay-modal-outline-color);
  border-radius: var(--fui-overlay-modal-rounded);
  box-shadow: var(--fui-overlay-modal-shadow);
  font-family: var(--fui-overlay-modal-font-family);
  font-size: var(--fui-overlay-modal-font-size);
  line-height: var(--fui-overlay-modal-line-height);
  font-weight: var(--fui-overlay-modal-font-weight);
  letter-spacing: var(--fui-overlay-modal-letter-spacing);
  font-feature-settings: var(--fui-overlay-modal-font-feature-settings);
  font-variation-settings: var(--fui-overlay-modal-font-variation-settings);
}

@utility fui-overlay-sheet {
  --tw-sort: container-type;
  background-color: var(--fui-overlay-sheet-background-color);
  box-shadow: var(--fui-overlay-sheet-shadow);
  font-family: var(--fui-overlay-sheet-font-family);
  font-size: var(--fui-overlay-sheet-font-size);
  line-height: var(--fui-overlay-sheet-line-height);
  font-weight: var(--fui-overlay-sheet-font-weight);
  letter-spacing: var(--fui-overlay-sheet-letter-spacing);
  font-feature-settings: var(--fui-overlay-sheet-font-feature-settings);
  font-variation-settings: var(--fui-overlay-sheet-font-variation-settings);
}

@utility fui-overlay-backdrop {
  --tw-sort: container-type;
  background-color: var(--fui-overlay-backdrop-background-color);
}

@utility fui-panel {
  --tw-sort: container-type;
  outline: var(--fui-panel-outline);
  outline-offset: var(--fui-panel-outline-offset);
  background-color: var(--fui-panel-background-color);
  color: var(--fui-panel-text-color);
  outline-color: var(--fui-panel-outline-color);
  border-radius: var(--fui-panel-rounded);
  box-shadow: var(--fui-panel-shadow);
  font-family: var(--fui-panel-font-family);
  font-size: var(--fui-panel-font-size);
  line-height: var(--fui-panel-line-height);
  font-weight: var(--fui-panel-font-weight);
  letter-spacing: var(--fui-panel-letter-spacing);
  font-feature-settings: var(--fui-panel-font-feature-settings);
  font-variation-settings: var(--fui-panel-font-variation-settings);
}

@utility fui-surface-inset {
  --tw-sort: container-type;
  padding-block: var(--fui-surface-inset-padding-y);
  @container (width >= 28rem) {
    padding-block: var(--fui-surface-inset-md-padding-y);
  }
}

@utility fui-indent {
  --tw-sort: container-type;
  padding-inline-start: var(--fui-indent-padding-start);
  @container (width >= 28rem) {
    padding-inline-start: var(--fui-indent-md-padding-start);
  }
}

@utility fui-part-title {
  --tw-sort: container-type;
  font-family: var(--fui-part-title-font-family);
  font-size: var(--fui-part-title-font-size);
  line-height: var(--fui-part-title-line-height);
  font-weight: var(--fui-part-title-font-weight);
  letter-spacing: var(--fui-part-title-letter-spacing);
  font-feature-settings: var(--fui-part-title-font-feature-settings);
  font-variation-settings: var(--fui-part-title-font-variation-settings);
  text-transform: var(--fui-part-title-text-transform);
}

@utility fui-part-title-lg {
  --tw-sort: container-type;
  font-family: var(--fui-part-title-lg-font-family);
  font-size: var(--fui-part-title-lg-font-size);
  line-height: var(--fui-part-title-lg-line-height);
  font-weight: var(--fui-part-title-lg-font-weight);
  letter-spacing: var(--fui-part-title-lg-letter-spacing);
  font-feature-settings: var(--fui-part-title-lg-font-feature-settings);
  font-variation-settings: var(--fui-part-title-lg-font-variation-settings);
  text-transform: var(--fui-part-title-lg-text-transform);
}

@utility fui-part-description {
  --tw-sort: container-type;
  color: var(--fui-part-description-text-color);
  font-family: var(--fui-part-description-font-family);
  font-size: var(--fui-part-description-font-size);
  line-height: var(--fui-part-description-line-height);
  font-weight: var(--fui-part-description-font-weight);
  letter-spacing: var(--fui-part-description-letter-spacing);
  font-feature-settings: var(--fui-part-description-font-feature-settings);
  font-variation-settings: var(--fui-part-description-font-variation-settings);
}

@utility fui-link-foreground {
  --tw-sort: container-type;
  & :where(a) {
    text-decoration-line: var(--fui-link-foreground-link-text-decoration-line);
  }
  & :where(a:hover) {
    color: var(--fui-link-foreground-link-hover-text-color);
  }
}

@utility fui-link-primary {
  --tw-sort: container-type;
  & :where(a) {
    text-decoration-line: var(--fui-link-primary-link-text-decoration-line);
  }
  & :where(a:hover) {
    color: var(--fui-link-primary-link-hover-text-color);
  }
}

@utility fui-notice-info {
  --tw-sort: container-type;
  border-color: var(--fui-notice-info-border-color);
  & svg {
    color: var(--fui-notice-info-icon-color);
  }
}

@utility fui-notice-positive {
  --tw-sort: container-type;
  border-color: var(--fui-notice-positive-border-color);
  & svg {
    color: var(--fui-notice-positive-icon-color);
  }
}

@utility fui-notice-warning {
  --tw-sort: container-type;
  border-color: var(--fui-notice-warning-border-color);
  & svg {
    color: var(--fui-notice-warning-icon-color);
  }
}

@utility fui-notice-destructive {
  --tw-sort: container-type;
  background-color: var(--fui-notice-destructive-background-color);
  color: var(--fui-notice-destructive-text-color);
}

@utility fui-label {
  --tw-sort: container-type;
  font-family: var(--fui-label-font-family);
  font-size: var(--fui-label-font-size);
  line-height: var(--fui-label-line-height);
  font-weight: var(--fui-label-font-weight);
  letter-spacing: var(--fui-label-letter-spacing);
  font-feature-settings: var(--fui-label-font-feature-settings);
  font-variation-settings: var(--fui-label-font-variation-settings);
  text-transform: var(--fui-label-text-transform);
}

@utility fui-hint {
  --tw-sort: container-type;
  color: var(--fui-hint-text-color);
  font-family: var(--fui-hint-font-family);
  font-size: var(--fui-hint-font-size);
  line-height: var(--fui-hint-line-height);
  font-weight: var(--fui-hint-font-weight);
  letter-spacing: var(--fui-hint-letter-spacing);
  font-feature-settings: var(--fui-hint-font-feature-settings);
  font-variation-settings: var(--fui-hint-font-variation-settings);
}

@utility fui-error {
  --tw-sort: container-type;
  color: var(--fui-error-text-color);
  font-family: var(--fui-error-font-family);
  font-size: var(--fui-error-font-size);
  line-height: var(--fui-error-line-height);
  font-weight: var(--fui-error-font-weight);
  letter-spacing: var(--fui-error-letter-spacing);
  font-feature-settings: var(--fui-error-font-feature-settings);
  font-variation-settings: var(--fui-error-font-variation-settings);
}

@utility fui-divider {
  --tw-sort: container-type;
  background-color: var(--fui-divider-background-color);
}

@utility fui-track {
  --tw-sort: container-type;
  background-color: var(--fui-track-background-color);
  border-radius: var(--fui-track-rounded);
}

@utility fui-track-fill {
  --tw-sort: container-type;
  background-color: var(--fui-track-fill-background-color);
}

@utility fui-track-thumb {
  --tw-sort: container-type;
  background-color: var(--fui-track-thumb-background-color);
  border-radius: var(--fui-track-thumb-rounded);
  &:hover {
    outline: var(--fui-track-thumb-hover-outline);
    outline-offset: var(--fui-track-thumb-hover-outline-offset);
    outline-color: var(--fui-track-thumb-hover-outline-color);
  }
  &:focus-visible {
    outline: var(--fui-track-thumb-focus-outline);
    outline-offset: var(--fui-track-thumb-focus-outline-offset);
    outline-color: var(--fui-track-thumb-focus-outline-color);
  }
}

@utility fui-calendar-day {
  --tw-sort: container-type;
  &:hover {
    background-color: var(--fui-calendar-day-hover-background-color);
    color: var(--fui-calendar-day-hover-text-color);
  }
  &:is([data-state=open],[aria-expanded=true]) {
    background-color: var(--fui-calendar-day-open-background-color);
    color: var(--fui-calendar-day-open-text-color);
  }
}

@utility fui-calendar-day-today {
  --tw-sort: container-type;
  background-color: var(--fui-calendar-day-today-background-color);
  color: var(--fui-calendar-day-today-text-color);
}

@utility fui-calendar-day-outside {
  --tw-sort: container-type;
  color: var(--fui-calendar-day-outside-text-color);
}

@utility fui-calendar-day-fill {
  --tw-sort: container-type;
  background-color: var(--fui-calendar-day-fill-background-color);
  color: var(--fui-calendar-day-fill-text-color);
  &:hover {
    background-color: var(--fui-calendar-day-fill-hover-background-color);
    color: var(--fui-calendar-day-fill-hover-text-color);
  }
  &:focus-visible {
    background-color: var(--fui-calendar-day-fill-focus-background-color);
    color: var(--fui-calendar-day-fill-focus-text-color);
  }
}

@utility fui-calendar-nav-button {
  --tw-sort: container-type;
  background-color: var(--fui-calendar-nav-button-background-color);
  border-color: var(--fui-calendar-nav-button-border-color);
  opacity: var(--fui-calendar-nav-button-opacity);
  &:hover {
    background-color: var(--fui-calendar-nav-button-hover-background-color);
    color: var(--fui-calendar-nav-button-hover-text-color);
    opacity: var(--fui-calendar-nav-button-hover-opacity);
  }
  &:is([data-state=open],[aria-expanded=true]) {
    background-color: var(--fui-calendar-nav-button-open-background-color);
    color: var(--fui-calendar-nav-button-open-text-color);
  }
}

@utility fui-calendar-weekday {
  --tw-sort: container-type;
  color: var(--fui-calendar-weekday-text-color);
  font-family: var(--fui-calendar-weekday-font-family);
  font-size: var(--fui-calendar-weekday-font-size);
  line-height: var(--fui-calendar-weekday-line-height);
  font-weight: var(--fui-calendar-weekday-font-weight);
  letter-spacing: var(--fui-calendar-weekday-letter-spacing);
  font-feature-settings: var(--fui-calendar-weekday-font-feature-settings);
  font-variation-settings: var(--fui-calendar-weekday-font-variation-settings);
}

@utility fui-calendar-month {
  --tw-sort: container-type;
  font-family: var(--fui-calendar-month-font-family);
  font-size: var(--fui-calendar-month-font-size);
  line-height: var(--fui-calendar-month-line-height);
  font-weight: var(--fui-calendar-month-font-weight);
  letter-spacing: var(--fui-calendar-month-letter-spacing);
  font-feature-settings: var(--fui-calendar-month-font-feature-settings);
  font-variation-settings: var(--fui-calendar-month-font-variation-settings);
}

@utility fui-heading {
  --tw-sort: container-type;
  font-family: var(--fui-heading-font-family);
  font-size: var(--fui-heading-font-size);
  line-height: var(--fui-heading-line-height);
  font-weight: var(--fui-heading-font-weight);
  letter-spacing: var(--fui-heading-letter-spacing);
  font-feature-settings: var(--fui-heading-font-feature-settings);
  font-variation-settings: var(--fui-heading-font-variation-settings);
}

@utility fui-title {
  --tw-sort: container-type;
  font-family: var(--fui-title-font-family);
  font-size: var(--fui-title-font-size);
  line-height: var(--fui-title-line-height);
  font-weight: var(--fui-title-font-weight);
  letter-spacing: var(--fui-title-letter-spacing);
  font-feature-settings: var(--fui-title-font-feature-settings);
  font-variation-settings: var(--fui-title-font-variation-settings);
}

@utility fui-logo {
  --tw-sort: container-type;
  font-family: var(--fui-logo-font-family);
  font-size: var(--fui-logo-font-size);
  line-height: var(--fui-logo-line-height);
  font-weight: var(--fui-logo-font-weight);
  letter-spacing: var(--fui-logo-letter-spacing);
  font-feature-settings: var(--fui-logo-font-feature-settings);
  font-variation-settings: var(--fui-logo-font-variation-settings);
}

@utility fui-meta {
  --tw-sort: container-type;
  color: var(--fui-meta-text-color);
  font-family: var(--fui-meta-font-family);
  font-size: var(--fui-meta-font-size);
  line-height: var(--fui-meta-line-height);
  font-weight: var(--fui-meta-font-weight);
  letter-spacing: var(--fui-meta-letter-spacing);
  font-feature-settings: var(--fui-meta-font-feature-settings);
  font-variation-settings: var(--fui-meta-font-variation-settings);
}

@utility fui-link {
  --tw-sort: container-type;
  color: var(--fui-link-text-color);
  font-family: var(--fui-link-font-family);
  font-size: var(--fui-link-font-size);
  line-height: var(--fui-link-line-height);
  font-weight: var(--fui-link-font-weight);
  letter-spacing: var(--fui-link-letter-spacing);
  font-feature-settings: var(--fui-link-font-feature-settings);
  font-variation-settings: var(--fui-link-font-variation-settings);
  &:hover {
    color: var(--fui-link-hover-text-color);
  }
}

@utility fui-total {
  --tw-sort: container-type;
  font-family: var(--fui-total-font-family);
  font-size: var(--fui-total-font-size);
  line-height: var(--fui-total-line-height);
  font-weight: var(--fui-total-font-weight);
  letter-spacing: var(--fui-total-letter-spacing);
  font-feature-settings: var(--fui-total-font-feature-settings);
  font-variation-settings: var(--fui-total-font-variation-settings);
}

@utility fui-note-positive {
  --tw-sort: container-type;
  color: var(--fui-note-positive-text-color);
}

@utility fui-nav-trigger {
  --tw-sort: container-type;
  background-color: var(--fui-nav-trigger-background-color);
  border-radius: var(--fui-nav-trigger-rounded);
  &:hover {
    background-color: var(--fui-nav-trigger-hover-background-color);
    color: var(--fui-nav-trigger-hover-text-color);
  }
  &:is([data-state=open],[aria-expanded=true]) {
    background-color: var(--fui-nav-trigger-open-background-color);
  }
}

@utility fui-dismiss {
  --tw-sort: container-type;
  border-radius: var(--fui-dismiss-rounded);
  &:hover {
    background-color: var(--fui-dismiss-hover-background-color);
  }
}

@utility fui-copy-muted {
  --tw-sort: container-type;
  color: var(--fui-copy-muted-text-color);
  font-family: var(--fui-copy-muted-font-family);
  font-size: var(--fui-copy-muted-font-size);
  line-height: var(--fui-copy-muted-line-height);
  font-weight: var(--fui-copy-muted-font-weight);
  letter-spacing: var(--fui-copy-muted-letter-spacing);
  font-feature-settings: var(--fui-copy-muted-font-feature-settings);
  font-variation-settings: var(--fui-copy-muted-font-variation-settings);
}

@utility fui-line-title {
  --tw-sort: container-type;
  font-family: var(--fui-line-title-font-family);
  font-size: var(--fui-line-title-font-size);
  line-height: var(--fui-line-title-line-height);
  font-weight: var(--fui-line-title-font-weight);
  letter-spacing: var(--fui-line-title-letter-spacing);
  font-feature-settings: var(--fui-line-title-font-feature-settings);
  font-variation-settings: var(--fui-line-title-font-variation-settings);
}

@utility fui-thumbnail {
  --tw-sort: container-type;
  border: var(--fui-thumbnail-border);
  border-color: var(--fui-thumbnail-border-color);
  border-radius: var(--fui-thumbnail-rounded);
}

@utility fui-page-title {
  --tw-sort: container-type;
  font-family: var(--fui-page-title-font-family);
  font-size: var(--fui-page-title-font-size);
  line-height: var(--fui-page-title-line-height);
  font-weight: var(--fui-page-title-font-weight);
  letter-spacing: var(--fui-page-title-letter-spacing);
  font-feature-settings: var(--fui-page-title-font-feature-settings);
  font-variation-settings: var(--fui-page-title-font-variation-settings);
}

@utility fui-quiet-action {
  --tw-sort: container-type;
  color: var(--fui-quiet-action-text-color);
}

@utility fui-clear-link {
  --tw-sort: container-type;
  color: var(--fui-clear-link-text-color);
  font-family: var(--fui-clear-link-font-family);
  font-size: var(--fui-clear-link-font-size);
  line-height: var(--fui-clear-link-line-height);
  font-weight: var(--fui-clear-link-font-weight);
  letter-spacing: var(--fui-clear-link-letter-spacing);
  font-feature-settings: var(--fui-clear-link-font-feature-settings);
  font-variation-settings: var(--fui-clear-link-font-variation-settings);
  &:hover {
    color: var(--fui-clear-link-hover-text-color);
    text-decoration-line: var(--fui-clear-link-hover-text-decoration-line);
  }
}

@utility fui-section-title {
  --tw-sort: container-type;
  font-family: var(--fui-section-title-font-family);
  font-size: var(--fui-section-title-font-size);
  line-height: var(--fui-section-title-line-height);
  font-weight: var(--fui-section-title-font-weight);
  letter-spacing: var(--fui-section-title-letter-spacing);
  font-feature-settings: var(--fui-section-title-font-feature-settings);
  font-variation-settings: var(--fui-section-title-font-variation-settings);
}

@utility fui-action {
  --tw-sort: container-type;
  border: var(--fui-action-border);
  border-color: var(--fui-action-border-color);
  border-radius: var(--fui-action-rounded);
  font-family: var(--fui-action-font-family);
  font-size: var(--fui-action-font-size);
  line-height: var(--fui-action-line-height);
  font-weight: var(--fui-action-font-weight);
  letter-spacing: var(--fui-action-letter-spacing);
  font-feature-settings: var(--fui-action-font-feature-settings);
  font-variation-settings: var(--fui-action-font-variation-settings);
  text-transform: var(--fui-action-text-transform);
  &:active:not([aria-haspopup]) {
    translate: var(--fui-action-pressed-translate);
  }
}

@utility fui-button {
  --tw-sort: container-type;
  border: var(--fui-button-border);
  border-color: var(--fui-button-border-color);
  border-radius: var(--fui-button-rounded);
  font-family: var(--fui-button-font-family);
  font-size: var(--fui-button-font-size);
  line-height: var(--fui-button-line-height);
  font-weight: var(--fui-button-font-weight);
  letter-spacing: var(--fui-button-letter-spacing);
  font-feature-settings: var(--fui-button-font-feature-settings);
  font-variation-settings: var(--fui-button-font-variation-settings);
  text-transform: var(--fui-button-text-transform);
  display: var(--fui-button-display);
  flex-shrink: var(--fui-button-flex-shrink);
  align-items: var(--fui-button-align-items);
  justify-content: var(--fui-button-justify-content);
  &:active:not([aria-haspopup]) {
    translate: var(--fui-button-pressed-translate);
  }
}

@utility fui-button-solid {
  --tw-sort: pointer-events;
  &:where(.fui-button-primary) {
    background-color: var(--fui-button-solid-primary-background-color);
    color: var(--fui-button-solid-primary-text-color);
    &:hover {
      background-color: var(--fui-button-solid-primary-hover-background-color);
    }
  }
  &:where(.fui-button-neutral) {
    background-color: var(--fui-button-solid-neutral-background-color);
    color: var(--fui-button-solid-neutral-text-color);
    &:hover {
      background-color: var(--fui-button-solid-neutral-hover-background-color);
    }
  }
  &:where(.fui-button-destructive) {
    background-color: var(--fui-button-solid-destructive-background-color);
    color: var(--fui-button-solid-destructive-text-color);
    &:hover {
      background-color: var(--fui-button-solid-destructive-hover-background-color);
    }
  }
  &:where(.fui-button-buy) {
    background-color: var(--fui-button-solid-buy-background-color);
    color: var(--fui-button-solid-buy-text-color);
    &:hover {
      background-color: var(--fui-button-solid-buy-hover-background-color);
    }
  }
  &:where(.fui-button-checkout) {
    background-color: var(--fui-button-solid-checkout-background-color);
    color: var(--fui-button-solid-checkout-text-color);
    &:hover {
      background-color: var(--fui-button-solid-checkout-hover-background-color);
    }
  }
  &:where(.fui-button-inverse) {
    background-color: var(--fui-button-solid-inverse-background-color);
    color: var(--fui-button-solid-inverse-text-color);
    &:hover {
      background-color: var(--fui-button-solid-inverse-hover-background-color);
    }
  }
}

@utility fui-button-outline {
  --tw-sort: pointer-events;
  background-color: var(--fui-button-outline-background-color);
  &:where(.fui-button-primary) {
    border-color: var(--fui-button-outline-primary-border-color);
    color: var(--fui-button-outline-primary-text-color);
    &:hover {
      background-color: var(--fui-button-outline-primary-hover-background-color);
    }
    &:is([data-state=open],[aria-expanded=true]) {
      background-color: var(--fui-button-outline-primary-open-background-color);
    }
  }
  &:where(.fui-button-neutral) {
    border-color: var(--fui-button-outline-neutral-border-color);
    &:hover {
      background-color: var(--fui-button-outline-neutral-hover-background-color);
      color: var(--fui-button-outline-neutral-hover-text-color);
    }
    &:is([data-state=open],[aria-expanded=true]) {
      background-color: var(--fui-button-outline-neutral-open-background-color);
      color: var(--fui-button-outline-neutral-open-text-color);
    }
  }
  &:where(.fui-button-destructive) {
    border-color: var(--fui-button-outline-destructive-border-color);
    color: var(--fui-button-outline-destructive-text-color);
    &:hover {
      background-color: var(--fui-button-outline-destructive-hover-background-color);
    }
    &:is([data-state=open],[aria-expanded=true]) {
      background-color: var(--fui-button-outline-destructive-open-background-color);
    }
  }
  &:where(.fui-button-buy) {
    border-color: var(--fui-button-outline-buy-border-color);
    color: var(--fui-button-outline-buy-text-color);
    &:hover {
      background-color: var(--fui-button-outline-buy-hover-background-color);
    }
    &:is([data-state=open],[aria-expanded=true]) {
      background-color: var(--fui-button-outline-buy-open-background-color);
    }
  }
  &:where(.fui-button-checkout) {
    border-color: var(--fui-button-outline-checkout-border-color);
    color: var(--fui-button-outline-checkout-text-color);
    &:hover {
      background-color: var(--fui-button-outline-checkout-hover-background-color);
    }
    &:is([data-state=open],[aria-expanded=true]) {
      background-color: var(--fui-button-outline-checkout-open-background-color);
    }
  }
  &:where(.fui-button-inverse) {
    border-color: var(--fui-button-outline-inverse-border-color);
    color: var(--fui-button-outline-inverse-text-color);
    &:hover {
      background-color: var(--fui-button-outline-inverse-hover-background-color);
    }
    &:is([data-state=open],[aria-expanded=true]) {
      background-color: var(--fui-button-outline-inverse-open-background-color);
    }
  }
}

@utility fui-button-soft {
  --tw-sort: pointer-events;
  &:where(.fui-button-primary) {
    background-color: var(--fui-button-soft-primary-background-color);
    color: var(--fui-button-soft-primary-text-color);
    &:hover {
      background-color: var(--fui-button-soft-primary-hover-background-color);
      color: var(--fui-button-soft-primary-hover-text-color);
    }
  }
  &:where(.fui-button-neutral) {
    background-color: var(--fui-button-soft-neutral-background-color);
    color: var(--fui-button-soft-neutral-text-color);
    &:hover {
      background-color: var(--fui-button-soft-neutral-hover-background-color);
    }
    &:is([data-state=open],[aria-expanded=true]) {
      background-color: var(--fui-button-soft-neutral-open-background-color);
      color: var(--fui-button-soft-neutral-open-text-color);
    }
  }
  &:where(.fui-button-destructive) {
    background-color: var(--fui-button-soft-destructive-background-color);
    color: var(--fui-button-soft-destructive-text-color);
    &:hover {
      background-color: var(--fui-button-soft-destructive-hover-background-color);
      color: var(--fui-button-soft-destructive-hover-text-color);
    }
  }
  &:where(.fui-button-buy) {
    background-color: var(--fui-button-soft-buy-background-color);
    color: var(--fui-button-soft-buy-text-color);
    &:hover {
      background-color: var(--fui-button-soft-buy-hover-background-color);
      color: var(--fui-button-soft-buy-hover-text-color);
    }
  }
  &:where(.fui-button-checkout) {
    background-color: var(--fui-button-soft-checkout-background-color);
    color: var(--fui-button-soft-checkout-text-color);
    &:hover {
      background-color: var(--fui-button-soft-checkout-hover-background-color);
      color: var(--fui-button-soft-checkout-hover-text-color);
    }
  }
  &:where(.fui-button-inverse) {
    background-color: var(--fui-button-soft-inverse-background-color);
    color: var(--fui-button-soft-inverse-text-color);
    &:hover {
      background-color: var(--fui-button-soft-inverse-hover-background-color);
      color: var(--fui-button-soft-inverse-hover-text-color);
    }
  }
}

@utility fui-button-ghost {
  --tw-sort: pointer-events;
  &:where(.fui-button-primary) {
    color: var(--fui-button-ghost-primary-text-color);
    &:hover {
      background-color: var(--fui-button-ghost-primary-hover-background-color);
    }
    &:is([data-state=open],[aria-expanded=true]) {
      background-color: var(--fui-button-ghost-primary-open-background-color);
    }
  }
  &:where(.fui-button-neutral) {
    &:hover {
      background-color: var(--fui-button-ghost-neutral-hover-background-color);
      color: var(--fui-button-ghost-neutral-hover-text-color);
    }
    &:is([data-state=open],[aria-expanded=true]) {
      background-color: var(--fui-button-ghost-neutral-open-background-color);
      color: var(--fui-button-ghost-neutral-open-text-color);
    }
  }
  &:where(.fui-button-destructive) {
    color: var(--fui-button-ghost-destructive-text-color);
    &:hover {
      background-color: var(--fui-button-ghost-destructive-hover-background-color);
    }
    &:is([data-state=open],[aria-expanded=true]) {
      background-color: var(--fui-button-ghost-destructive-open-background-color);
    }
  }
  &:where(.fui-button-buy) {
    color: var(--fui-button-ghost-buy-text-color);
    &:hover {
      background-color: var(--fui-button-ghost-buy-hover-background-color);
    }
    &:is([data-state=open],[aria-expanded=true]) {
      background-color: var(--fui-button-ghost-buy-open-background-color);
    }
  }
  &:where(.fui-button-checkout) {
    color: var(--fui-button-ghost-checkout-text-color);
    &:hover {
      background-color: var(--fui-button-ghost-checkout-hover-background-color);
    }
    &:is([data-state=open],[aria-expanded=true]) {
      background-color: var(--fui-button-ghost-checkout-open-background-color);
    }
  }
  &:where(.fui-button-inverse) {
    color: var(--fui-button-ghost-inverse-text-color);
    &:hover {
      background-color: var(--fui-button-ghost-inverse-hover-background-color);
    }
    &:is([data-state=open],[aria-expanded=true]) {
      background-color: var(--fui-button-ghost-inverse-open-background-color);
    }
  }
}

@utility fui-button-link {
  --tw-sort: pointer-events;
  text-decoration-line: var(--fui-button-link-text-decoration-line);
  &:where(.fui-button-primary) {
    color: var(--fui-button-link-primary-text-color);
  }
  &:where(.fui-button-destructive) {
    color: var(--fui-button-link-destructive-text-color);
  }
  &:where(.fui-button-buy) {
    color: var(--fui-button-link-buy-text-color);
  }
  &:where(.fui-button-checkout) {
    color: var(--fui-button-link-checkout-text-color);
  }
  &:where(.fui-button-inverse) {
    color: var(--fui-button-link-inverse-text-color);
  }
}

@utility fui-button-primary {
  --tw-sort: pointer-events;
  &:where(.fui-button-solid) {
    background-color: var(--fui-button-solid-primary-background-color);
    color: var(--fui-button-solid-primary-text-color);
    &:hover {
      background-color: var(--fui-button-solid-primary-hover-background-color);
    }
  }
  &:where(.fui-button-outline) {
    border-color: var(--fui-button-outline-primary-border-color);
    color: var(--fui-button-outline-primary-text-color);
    &:hover {
      background-color: var(--fui-button-outline-primary-hover-background-color);
    }
    &:is([data-state=open],[aria-expanded=true]) {
      background-color: var(--fui-button-outline-primary-open-background-color);
    }
  }
  &:where(.fui-button-soft) {
    background-color: var(--fui-button-soft-primary-background-color);
    color: var(--fui-button-soft-primary-text-color);
    &:hover {
      background-color: var(--fui-button-soft-primary-hover-background-color);
      color: var(--fui-button-soft-primary-hover-text-color);
    }
  }
  &:where(.fui-button-ghost) {
    color: var(--fui-button-ghost-primary-text-color);
    &:hover {
      background-color: var(--fui-button-ghost-primary-hover-background-color);
    }
    &:is([data-state=open],[aria-expanded=true]) {
      background-color: var(--fui-button-ghost-primary-open-background-color);
    }
  }
  &:where(.fui-button-link) {
    color: var(--fui-button-link-primary-text-color);
  }
}

@utility fui-button-neutral {
  --tw-sort: pointer-events;
  &:where(.fui-button-solid) {
    background-color: var(--fui-button-solid-neutral-background-color);
    color: var(--fui-button-solid-neutral-text-color);
    &:hover {
      background-color: var(--fui-button-solid-neutral-hover-background-color);
    }
  }
  &:where(.fui-button-outline) {
    border-color: var(--fui-button-outline-neutral-border-color);
    &:hover {
      background-color: var(--fui-button-outline-neutral-hover-background-color);
      color: var(--fui-button-outline-neutral-hover-text-color);
    }
    &:is([data-state=open],[aria-expanded=true]) {
      background-color: var(--fui-button-outline-neutral-open-background-color);
      color: var(--fui-button-outline-neutral-open-text-color);
    }
  }
  &:where(.fui-button-soft) {
    background-color: var(--fui-button-soft-neutral-background-color);
    color: var(--fui-button-soft-neutral-text-color);
    &:hover {
      background-color: var(--fui-button-soft-neutral-hover-background-color);
    }
    &:is([data-state=open],[aria-expanded=true]) {
      background-color: var(--fui-button-soft-neutral-open-background-color);
      color: var(--fui-button-soft-neutral-open-text-color);
    }
  }
  &:where(.fui-button-ghost) {
    &:hover {
      background-color: var(--fui-button-ghost-neutral-hover-background-color);
      color: var(--fui-button-ghost-neutral-hover-text-color);
    }
    &:is([data-state=open],[aria-expanded=true]) {
      background-color: var(--fui-button-ghost-neutral-open-background-color);
      color: var(--fui-button-ghost-neutral-open-text-color);
    }
  }
}

@utility fui-button-destructive {
  --tw-sort: pointer-events;
  --fui-ring-color: var(--fui-button-destructive-ring-color);
  --fui-ring-border-color: var(--fui-button-destructive-ring-border-color);
  &:where(.fui-button-solid) {
    background-color: var(--fui-button-solid-destructive-background-color);
    color: var(--fui-button-solid-destructive-text-color);
    &:hover {
      background-color: var(--fui-button-solid-destructive-hover-background-color);
    }
  }
  &:where(.fui-button-outline) {
    border-color: var(--fui-button-outline-destructive-border-color);
    color: var(--fui-button-outline-destructive-text-color);
    &:hover {
      background-color: var(--fui-button-outline-destructive-hover-background-color);
    }
    &:is([data-state=open],[aria-expanded=true]) {
      background-color: var(--fui-button-outline-destructive-open-background-color);
    }
  }
  &:where(.fui-button-soft) {
    background-color: var(--fui-button-soft-destructive-background-color);
    color: var(--fui-button-soft-destructive-text-color);
    &:hover {
      background-color: var(--fui-button-soft-destructive-hover-background-color);
      color: var(--fui-button-soft-destructive-hover-text-color);
    }
  }
  &:where(.fui-button-ghost) {
    color: var(--fui-button-ghost-destructive-text-color);
    &:hover {
      background-color: var(--fui-button-ghost-destructive-hover-background-color);
    }
    &:is([data-state=open],[aria-expanded=true]) {
      background-color: var(--fui-button-ghost-destructive-open-background-color);
    }
  }
  &:where(.fui-button-link) {
    color: var(--fui-button-link-destructive-text-color);
  }
}

@utility fui-button-buy {
  --tw-sort: pointer-events;
  &:where(.fui-button-solid) {
    background-color: var(--fui-button-solid-buy-background-color);
    color: var(--fui-button-solid-buy-text-color);
    &:hover {
      background-color: var(--fui-button-solid-buy-hover-background-color);
    }
  }
  &:where(.fui-button-outline) {
    border-color: var(--fui-button-outline-buy-border-color);
    color: var(--fui-button-outline-buy-text-color);
    &:hover {
      background-color: var(--fui-button-outline-buy-hover-background-color);
    }
    &:is([data-state=open],[aria-expanded=true]) {
      background-color: var(--fui-button-outline-buy-open-background-color);
    }
  }
  &:where(.fui-button-soft) {
    background-color: var(--fui-button-soft-buy-background-color);
    color: var(--fui-button-soft-buy-text-color);
    &:hover {
      background-color: var(--fui-button-soft-buy-hover-background-color);
      color: var(--fui-button-soft-buy-hover-text-color);
    }
  }
  &:where(.fui-button-ghost) {
    color: var(--fui-button-ghost-buy-text-color);
    &:hover {
      background-color: var(--fui-button-ghost-buy-hover-background-color);
    }
    &:is([data-state=open],[aria-expanded=true]) {
      background-color: var(--fui-button-ghost-buy-open-background-color);
    }
  }
  &:where(.fui-button-link) {
    color: var(--fui-button-link-buy-text-color);
  }
}

@utility fui-button-checkout {
  --tw-sort: pointer-events;
  &:where(.fui-button-solid) {
    background-color: var(--fui-button-solid-checkout-background-color);
    color: var(--fui-button-solid-checkout-text-color);
    &:hover {
      background-color: var(--fui-button-solid-checkout-hover-background-color);
    }
  }
  &:where(.fui-button-outline) {
    border-color: var(--fui-button-outline-checkout-border-color);
    color: var(--fui-button-outline-checkout-text-color);
    &:hover {
      background-color: var(--fui-button-outline-checkout-hover-background-color);
    }
    &:is([data-state=open],[aria-expanded=true]) {
      background-color: var(--fui-button-outline-checkout-open-background-color);
    }
  }
  &:where(.fui-button-soft) {
    background-color: var(--fui-button-soft-checkout-background-color);
    color: var(--fui-button-soft-checkout-text-color);
    &:hover {
      background-color: var(--fui-button-soft-checkout-hover-background-color);
      color: var(--fui-button-soft-checkout-hover-text-color);
    }
  }
  &:where(.fui-button-ghost) {
    color: var(--fui-button-ghost-checkout-text-color);
    &:hover {
      background-color: var(--fui-button-ghost-checkout-hover-background-color);
    }
    &:is([data-state=open],[aria-expanded=true]) {
      background-color: var(--fui-button-ghost-checkout-open-background-color);
    }
  }
  &:where(.fui-button-link) {
    color: var(--fui-button-link-checkout-text-color);
  }
}

@utility fui-button-inverse {
  --tw-sort: pointer-events;
  &:where(.fui-button-solid) {
    background-color: var(--fui-button-solid-inverse-background-color);
    color: var(--fui-button-solid-inverse-text-color);
    &:hover {
      background-color: var(--fui-button-solid-inverse-hover-background-color);
    }
  }
  &:where(.fui-button-outline) {
    border-color: var(--fui-button-outline-inverse-border-color);
    color: var(--fui-button-outline-inverse-text-color);
    &:hover {
      background-color: var(--fui-button-outline-inverse-hover-background-color);
    }
    &:is([data-state=open],[aria-expanded=true]) {
      background-color: var(--fui-button-outline-inverse-open-background-color);
    }
  }
  &:where(.fui-button-soft) {
    background-color: var(--fui-button-soft-inverse-background-color);
    color: var(--fui-button-soft-inverse-text-color);
    &:hover {
      background-color: var(--fui-button-soft-inverse-hover-background-color);
      color: var(--fui-button-soft-inverse-hover-text-color);
    }
  }
  &:where(.fui-button-ghost) {
    color: var(--fui-button-ghost-inverse-text-color);
    &:hover {
      background-color: var(--fui-button-ghost-inverse-hover-background-color);
    }
    &:is([data-state=open],[aria-expanded=true]) {
      background-color: var(--fui-button-ghost-inverse-open-background-color);
    }
  }
  &:where(.fui-button-link) {
    color: var(--fui-button-link-inverse-text-color);
  }
}

@utility fui-button-xs {
  --tw-sort: pointer-events;
  height: var(--fui-button-xs-height);
  padding-inline: var(--fui-button-xs-padding-x);
  gap: var(--fui-button-xs-gap);
  & :where([data-icon]) {
    width: var(--fui-button-xs-icon-size);
    height: var(--fui-button-xs-icon-size);
  }
  &:has([data-icon=inline-start]) {
    padding-inline-start: var(--fui-button-xs-icon-start-padding-start);
  }
  &:has([data-icon=inline-end]) {
    padding-inline-end: var(--fui-button-xs-icon-end-padding-end);
  }
}

@utility fui-button-sm {
  --tw-sort: pointer-events;
  height: var(--fui-button-sm-height);
  padding-inline: var(--fui-button-sm-padding-x);
  gap: var(--fui-button-sm-gap);
  & :where([data-icon]) {
    width: var(--fui-button-sm-icon-size);
    height: var(--fui-button-sm-icon-size);
  }
  &:has([data-icon=inline-start]) {
    padding-inline-start: var(--fui-button-sm-icon-start-padding-start);
  }
  &:has([data-icon=inline-end]) {
    padding-inline-end: var(--fui-button-sm-icon-end-padding-end);
  }
}

@utility fui-button-md {
  --tw-sort: pointer-events;
  height: var(--fui-button-md-height);
  padding-inline: var(--fui-button-md-padding-x);
  gap: var(--fui-button-md-gap);
  & :where([data-icon]) {
    width: var(--fui-button-md-icon-size);
    height: var(--fui-button-md-icon-size);
  }
  &:has([data-icon=inline-start]) {
    padding-inline-start: var(--fui-button-md-icon-start-padding-start);
  }
  &:has([data-icon=inline-end]) {
    padding-inline-end: var(--fui-button-md-icon-end-padding-end);
  }
}

@utility fui-button-lg {
  --tw-sort: pointer-events;
  height: var(--fui-button-lg-height);
  padding-inline: var(--fui-button-lg-padding-x);
  gap: var(--fui-button-lg-gap);
  & :where([data-icon]) {
    width: var(--fui-button-lg-icon-size);
    height: var(--fui-button-lg-icon-size);
  }
  &:has([data-icon=inline-start]) {
    padding-inline-start: var(--fui-button-lg-icon-start-padding-start);
  }
  &:has([data-icon=inline-end]) {
    padding-inline-end: var(--fui-button-lg-icon-end-padding-end);
  }
}

@utility fui-button-icon-xs {
  --tw-sort: pointer-events;
  width: var(--fui-button-icon-xs-size);
  height: var(--fui-button-icon-xs-size);
  & :where([data-icon]) {
    width: var(--fui-button-icon-xs-icon-size);
    height: var(--fui-button-icon-xs-icon-size);
  }
}

@utility fui-button-icon-sm {
  --tw-sort: pointer-events;
  width: var(--fui-button-icon-sm-size);
  height: var(--fui-button-icon-sm-size);
  & :where([data-icon]) {
    width: var(--fui-button-icon-sm-icon-size);
    height: var(--fui-button-icon-sm-icon-size);
  }
}

@utility fui-button-icon-md {
  --tw-sort: pointer-events;
  width: var(--fui-button-icon-md-size);
  height: var(--fui-button-icon-md-size);
  & :where([data-icon]) {
    width: var(--fui-button-icon-md-icon-size);
    height: var(--fui-button-icon-md-icon-size);
  }
}

@utility fui-button-icon-lg {
  --tw-sort: pointer-events;
  width: var(--fui-button-icon-lg-size);
  height: var(--fui-button-icon-lg-size);
  & :where([data-icon]) {
    width: var(--fui-button-icon-lg-icon-size);
    height: var(--fui-button-icon-lg-icon-size);
  }
}

@utility fui-badge {
  --tw-sort: container-type;
  border-radius: var(--fui-badge-rounded);
  color: var(--fui-badge-text-color);
  font-family: var(--fui-badge-font-family);
  font-size: var(--fui-badge-font-size);
  line-height: var(--fui-badge-line-height);
  font-weight: var(--fui-badge-font-weight);
  letter-spacing: var(--fui-badge-letter-spacing);
  font-feature-settings: var(--fui-badge-font-feature-settings);
  font-variation-settings: var(--fui-badge-font-variation-settings);
  text-transform: var(--fui-badge-text-transform);
  gap: var(--fui-badge-gap);
  display: var(--fui-badge-display);
  width: var(--fui-badge-width);
  flex-shrink: var(--fui-badge-flex-shrink);
  align-items: var(--fui-badge-align-items);
  justify-content: var(--fui-badge-justify-content);
  &:focus-visible {
    outline: var(--fui-badge-focus-outline);
    outline-offset: var(--fui-badge-focus-outline-offset);
    border-color: var(--fui-badge-focus-border-color);
    outline-color: var(--fui-badge-focus-outline-color);
  }
  & :where([data-icon]) {
    width: var(--fui-badge-icon-size);
    height: var(--fui-badge-icon-size);
  }
}

@utility fui-badge-neutral {
  --tw-sort: pointer-events;
  color: var(--fui-badge-neutral-text-color);
  &:hover {
    color: var(--fui-badge-neutral-hover-text-color);
  }
  &:where(.fui-badge-sm) {
    padding: var(--fui-badge-neutral-sm-padding);
  }
  &:where(.fui-badge-md) {
    padding: var(--fui-badge-neutral-md-padding);
  }
  &:where(.fui-badge-lg) {
    padding: var(--fui-badge-neutral-lg-padding);
  }
}

@utility fui-badge-primary {
  --tw-sort: pointer-events;
  background-color: var(--fui-badge-primary-background-color);
  color: var(--fui-badge-primary-text-color);
}

@utility fui-badge-info {
  --tw-sort: pointer-events;
  background-color: var(--fui-badge-info-background-color);
  color: var(--fui-badge-info-text-color);
}

@utility fui-badge-success {
  --tw-sort: pointer-events;
  background-color: var(--fui-badge-success-background-color);
  color: var(--fui-badge-success-text-color);
}

@utility fui-badge-warning {
  --tw-sort: pointer-events;
  background-color: var(--fui-badge-warning-background-color);
  color: var(--fui-badge-warning-text-color);
}

@utility fui-badge-error {
  --tw-sort: pointer-events;
  background-color: var(--fui-badge-error-background-color);
  color: var(--fui-badge-error-text-color);
  &:focus-visible {
    outline-color: var(--fui-badge-error-focus-outline-color);
  }
}

@utility fui-badge-promo {
  --tw-sort: pointer-events;
  background-color: var(--fui-badge-promo-background-color);
  color: var(--fui-badge-promo-text-color);
}

@utility fui-badge-discount {
  --tw-sort: pointer-events;
  background-color: var(--fui-badge-discount-background-color);
  color: var(--fui-badge-discount-text-color);
}

@utility fui-badge-new {
  --tw-sort: pointer-events;
  background-color: var(--fui-badge-new-background-color);
  color: var(--fui-badge-new-text-color);
}

@utility fui-badge-price {
  --tw-sort: pointer-events;
  background-color: var(--fui-badge-price-background-color);
  color: var(--fui-badge-price-text-color);
}

@utility fui-badge-sm {
  --tw-sort: pointer-events;
  padding-inline: var(--fui-badge-sm-padding-x);
  padding-block: var(--fui-badge-sm-padding-y);
  &:where(.fui-badge-neutral) {
    padding: var(--fui-badge-neutral-sm-padding);
  }
}

@utility fui-badge-md {
  --tw-sort: pointer-events;
  padding-inline: var(--fui-badge-md-padding-x);
  padding-block: var(--fui-badge-md-padding-y);
  font-family: var(--fui-badge-md-font-family);
  font-size: var(--fui-badge-md-font-size);
  line-height: var(--fui-badge-md-line-height);
  font-weight: var(--fui-badge-md-font-weight);
  letter-spacing: var(--fui-badge-md-letter-spacing);
  font-feature-settings: var(--fui-badge-md-font-feature-settings);
  font-variation-settings: var(--fui-badge-md-font-variation-settings);
  &:where(.fui-badge-neutral) {
    padding: var(--fui-badge-neutral-md-padding);
  }
}

@utility fui-badge-lg {
  --tw-sort: pointer-events;
  padding-inline: var(--fui-badge-lg-padding-x);
  padding-block: var(--fui-badge-lg-padding-y);
  font-family: var(--fui-badge-lg-font-family);
  font-size: var(--fui-badge-lg-font-size);
  line-height: var(--fui-badge-lg-line-height);
  font-weight: var(--fui-badge-lg-font-weight);
  letter-spacing: var(--fui-badge-lg-letter-spacing);
  font-feature-settings: var(--fui-badge-lg-font-feature-settings);
  font-variation-settings: var(--fui-badge-lg-font-variation-settings);
  &:where(.fui-badge-neutral) {
    padding: var(--fui-badge-neutral-lg-padding);
  }
}

@utility fui-input {
  --tw-sort: container-type;
  background-color: var(--fui-input-background-color);
  border: var(--fui-input-border);
  border-color: var(--fui-input-border-color);
  border-bottom-color: var(--fui-input-border-bottom-color);
  border-radius: var(--fui-input-rounded);
  font-family: var(--fui-input-font-family);
  font-size: var(--fui-input-font-size);
  line-height: var(--fui-input-line-height);
  font-weight: var(--fui-input-font-weight);
  letter-spacing: var(--fui-input-letter-spacing);
  font-feature-settings: var(--fui-input-font-feature-settings);
  font-variation-settings: var(--fui-input-font-variation-settings);
  height: var(--fui-input-height);
  padding-inline: var(--fui-input-padding-x);
  padding-block: var(--fui-input-padding-y);
  width: var(--fui-input-width);
  min-width: var(--fui-input-min-width);
  &::placeholder {
    color: var(--fui-input-placeholder-color);
  }
  &:focus-visible {
    border-bottom: var(--fui-input-focus-border-bottom);
  }
  &:is([aria-invalid=true],[data-invalid]) {
    border-bottom-color: var(--fui-input-invalid-border-bottom-color);
  }
  &::file-selector-button {
    background-color: var(--fui-input-file-background-color);
    border: var(--fui-input-file-border);
    color: var(--fui-input-file-text-color);
    font-family: var(--fui-input-file-font-family);
    font-size: var(--fui-input-file-font-size);
    line-height: var(--fui-input-file-line-height);
    font-weight: var(--fui-input-file-font-weight);
    letter-spacing: var(--fui-input-file-letter-spacing);
    font-feature-settings: var(--fui-input-file-font-feature-settings);
    font-variation-settings: var(--fui-input-file-font-variation-settings);
    display: var(--fui-input-file-display);
  }
}

@utility fui-input-md {
  --tw-sort: pointer-events;
  --fui_empty: initial;
}

@utility fui-input-sm {
  --tw-sort: pointer-events;
  height: var(--fui-input-sm-height);
}

@utility fui-textarea {
  --tw-sort: container-type;
  background-color: var(--fui-textarea-background-color);
  border: var(--fui-textarea-border);
  border-color: var(--fui-textarea-border-color);
  border-bottom-color: var(--fui-textarea-border-bottom-color);
  border-radius: var(--fui-textarea-rounded);
  font-family: var(--fui-textarea-font-family);
  font-size: var(--fui-textarea-font-size);
  line-height: var(--fui-textarea-line-height);
  font-weight: var(--fui-textarea-font-weight);
  letter-spacing: var(--fui-textarea-letter-spacing);
  font-feature-settings: var(--fui-textarea-font-feature-settings);
  font-variation-settings: var(--fui-textarea-font-variation-settings);
  min-height: var(--fui-textarea-min-height);
  padding-inline: var(--fui-textarea-padding-x);
  padding-block: var(--fui-textarea-padding-y);
  display: var(--fui-textarea-display);
  width: var(--fui-textarea-width);
  &::placeholder {
    color: var(--fui-textarea-placeholder-color);
  }
  &:focus-visible {
    border-bottom: var(--fui-textarea-focus-border-bottom);
  }
  &:is([aria-invalid=true],[data-invalid]) {
    border-bottom-color: var(--fui-textarea-invalid-border-bottom-color);
  }
}

@utility fui-label-root {
  --tw-sort: container-type;
  font-family: var(--fui-label-root-font-family);
  font-size: var(--fui-label-root-font-size);
  line-height: var(--fui-label-root-line-height);
  font-weight: var(--fui-label-root-font-weight);
  letter-spacing: var(--fui-label-root-letter-spacing);
  font-feature-settings: var(--fui-label-root-font-feature-settings);
  font-variation-settings: var(--fui-label-root-font-variation-settings);
  text-transform: var(--fui-label-root-text-transform);
  gap: var(--fui-label-root-gap);
  display: var(--fui-label-root-display);
  align-items: var(--fui-label-root-align-items);
}

@utility fui-kbd {
  --tw-sort: container-type;
  background-color: var(--fui-kbd-background-color);
  color: var(--fui-kbd-text-color);
  border-radius: var(--fui-kbd-rounded);
  font-family: var(--fui-kbd-font-family);
  font-size: var(--fui-kbd-font-size);
  line-height: var(--fui-kbd-line-height);
  font-weight: var(--fui-kbd-font-weight);
  letter-spacing: var(--fui-kbd-letter-spacing);
  font-feature-settings: var(--fui-kbd-font-feature-settings);
  font-variation-settings: var(--fui-kbd-font-variation-settings);
  height: var(--fui-kbd-height);
  min-width: var(--fui-kbd-min-width);
  padding-inline: var(--fui-kbd-padding-x);
  gap: var(--fui-kbd-gap);
  display: var(--fui-kbd-display);
  width: var(--fui-kbd-width);
  align-items: var(--fui-kbd-align-items);
  justify-content: var(--fui-kbd-justify-content);
  & :where([data-icon]) {
    width: var(--fui-kbd-icon-size);
    height: var(--fui-kbd-icon-size);
  }
}

@utility fui-kbd-group {
  --tw-sort: container-type;
  display: var(--fui-kbd-group-display);
  align-items: var(--fui-kbd-group-align-items);
  gap: var(--fui-kbd-group-gap);
}

@utility fui-checkbox {
  --tw-sort: container-type;
  background-color: var(--fui-checkbox-background-color);
  border: var(--fui-checkbox-border);
  border-color: var(--fui-checkbox-border-color);
  border-radius: var(--fui-checkbox-rounded);
  width: var(--fui-checkbox-size);
  height: var(--fui-checkbox-size);
  display: var(--fui-checkbox-display);
  flex-shrink: var(--fui-checkbox-flex-shrink);
  align-items: var(--fui-checkbox-align-items);
  justify-content: var(--fui-checkbox-justify-content);
  &:is([data-state=checked],[data-state=indeterminate],[data-state=on],[aria-checked=true],[aria-checked=mixed],[aria-pressed=true]) {
    background-color: var(--fui-checkbox-checked-background-color);
    color: var(--fui-checkbox-checked-text-color);
    border-color: var(--fui-checkbox-checked-border-color);
  }
  & :where([data-icon]) {
    width: var(--fui-checkbox-icon-size);
    height: var(--fui-checkbox-icon-size);
  }
}

@utility fui-radio-group {
  --tw-sort: container-type;
  gap: var(--fui-radio-group-gap);
  display: var(--fui-radio-group-display);
  width: var(--fui-radio-group-width);
}

@utility fui-radio-group-item {
  --tw-sort: container-type;
  background-color: var(--fui-radio-group-item-background-color);
  border: var(--fui-radio-group-item-border);
  border-color: var(--fui-radio-group-item-border-color);
  border-radius: var(--fui-radio-group-item-rounded);
  width: var(--fui-radio-group-item-size);
  height: var(--fui-radio-group-item-size);
  display: var(--fui-radio-group-item-display);
  flex-shrink: var(--fui-radio-group-item-flex-shrink);
  &:is([data-state=checked],[data-state=indeterminate],[data-state=on],[aria-checked=true],[aria-checked=mixed],[aria-pressed=true]) {
    border-color: var(--fui-radio-group-item-checked-border-color);
  }
  &:is([data-state=checked],[data-state=indeterminate],[data-state=on],[aria-checked=true],[aria-checked=mixed],[aria-pressed=true]) svg {
    color: var(--fui-radio-group-item-checked-icon-color);
  }
  & :where([data-icon]) {
    width: var(--fui-radio-group-item-icon-size);
    height: var(--fui-radio-group-item-icon-size);
  }
}

@utility fui-radio-accordion {
  --tw-sort: container-type;
  display: var(--fui-radio-accordion-display);
  width: var(--fui-radio-accordion-width);
  flex-direction: var(--fui-radio-accordion-flex-direction);
}

@utility fui-radio-accordion-plain {
  --tw-sort: pointer-events;
  --fui_empty: initial;
}

@utility fui-radio-accordion-outline {
  --tw-sort: pointer-events;
  gap: var(--fui-radio-accordion-outline-gap);
}

@utility fui-radio-accordion-item {
  --tw-sort: container-type;
  gap: var(--fui-radio-accordion-item-gap);
  display: var(--fui-radio-accordion-item-display);
  width: var(--fui-radio-accordion-item-width);
  flex-direction: var(--fui-radio-accordion-item-flex-direction);
}

@utility fui-radio-accordion-item-plain {
  --tw-sort: pointer-events;
  border-bottom: var(--fui-radio-accordion-item-plain-border-bottom);
}

@utility fui-radio-accordion-item-outline {
  --tw-sort: pointer-events;
  border: var(--fui-radio-accordion-item-outline-border);
  border-color: var(--fui-radio-accordion-item-outline-border-color);
  border-radius: var(--fui-radio-accordion-item-outline-rounded);
  padding-inline: var(--fui-radio-accordion-item-outline-padding-x);
  &:is([data-state=checked],[data-state=indeterminate],[data-state=on],[aria-checked=true],[aria-checked=mixed],[aria-pressed=true]) {
    border-color: var(--fui-radio-accordion-item-outline-checked-border-color);
  }
}

@utility fui-radio-accordion-trigger {
  --tw-sort: container-type;
  font-family: var(--fui-radio-accordion-trigger-font-family);
  font-size: var(--fui-radio-accordion-trigger-font-size);
  line-height: var(--fui-radio-accordion-trigger-line-height);
  font-weight: var(--fui-radio-accordion-trigger-font-weight);
  letter-spacing: var(--fui-radio-accordion-trigger-letter-spacing);
  font-feature-settings: var(--fui-radio-accordion-trigger-font-feature-settings);
  font-variation-settings: var(--fui-radio-accordion-trigger-font-variation-settings);
  gap: var(--fui-radio-accordion-trigger-gap);
  padding-block: var(--fui-radio-accordion-trigger-padding-y);
  display: var(--fui-radio-accordion-trigger-display);
  width: var(--fui-radio-accordion-trigger-width);
  align-items: var(--fui-radio-accordion-trigger-align-items);
  text-align: var(--fui-radio-accordion-trigger-text-align);
}

@utility fui-radio-accordion-content {
  --tw-sort: container-type;
  padding-inline-start: var(--fui-radio-accordion-content-padding-start);
  font-family: var(--fui-radio-accordion-content-font-family);
  font-size: var(--fui-radio-accordion-content-font-size);
  line-height: var(--fui-radio-accordion-content-line-height);
  font-weight: var(--fui-radio-accordion-content-font-weight);
  letter-spacing: var(--fui-radio-accordion-content-letter-spacing);
  font-feature-settings: var(--fui-radio-accordion-content-font-feature-settings);
  font-variation-settings: var(--fui-radio-accordion-content-font-variation-settings);
  padding-bottom: var(--fui-radio-accordion-content-padding-bottom);
  @container (width >= 28rem) {
    padding-inline-start: var(--fui-radio-accordion-content-md-padding-start);
  }
}

@utility fui-radio-accordion-indicator {
  --tw-sort: container-type;
  background-color: var(--fui-radio-accordion-indicator-background-color);
  border: var(--fui-radio-accordion-indicator-border);
  border-color: var(--fui-radio-accordion-indicator-border-color);
  border-radius: var(--fui-radio-accordion-indicator-rounded);
  width: var(--fui-radio-accordion-indicator-size);
  height: var(--fui-radio-accordion-indicator-size);
  display: var(--fui-radio-accordion-indicator-display);
  flex-shrink: var(--fui-radio-accordion-indicator-flex-shrink);
  align-items: var(--fui-radio-accordion-indicator-align-items);
  justify-content: var(--fui-radio-accordion-indicator-justify-content);
  &:is([data-state=checked],[data-state=indeterminate],[data-state=on],[aria-checked=true],[aria-checked=mixed],[aria-pressed=true]) {
    border-color: var(--fui-radio-accordion-indicator-checked-border-color);
  }
  &:is([data-state=checked],[data-state=indeterminate],[data-state=on],[aria-checked=true],[aria-checked=mixed],[aria-pressed=true]) svg {
    color: var(--fui-radio-accordion-indicator-checked-icon-color);
  }
  & :where([data-icon]) {
    width: var(--fui-radio-accordion-indicator-icon-size);
    height: var(--fui-radio-accordion-indicator-icon-size);
  }
}

@utility fui-switch {
  --tw-sort: container-type;
  background-color: var(--fui-switch-background-color);
  border: var(--fui-switch-border);
  border-color: var(--fui-switch-border-color);
  border-radius: var(--fui-switch-rounded);
  display: var(--fui-switch-display);
  flex-shrink: var(--fui-switch-flex-shrink);
  align-items: var(--fui-switch-align-items);
  &:is([data-state=checked],[data-state=indeterminate],[data-state=on],[aria-checked=true],[aria-checked=mixed],[aria-pressed=true]) {
    background-color: var(--fui-switch-checked-background-color);
    border-color: var(--fui-switch-checked-border-color);
  }
}

@utility fui-switch-md {
  --tw-sort: pointer-events;
  height: var(--fui-switch-md-height);
  width: var(--fui-switch-md-width);
}

@utility fui-switch-sm {
  --tw-sort: pointer-events;
  height: var(--fui-switch-sm-height);
  width: var(--fui-switch-sm-width);
}

@utility fui-switch-thumb {
  --tw-sort: container-type;
  background-color: var(--fui-switch-thumb-background-color);
  border-radius: var(--fui-switch-thumb-rounded);
  margin-inline-start: var(--fui-switch-thumb-margin-start);
  translate: var(--fui-switch-thumb-translate);
  &:is([data-state=checked],[data-state=indeterminate],[data-state=on],[aria-checked=true],[aria-checked=mixed],[aria-pressed=true]) {
    translate: var(--fui-switch-thumb-checked-translate);
  }
}

@utility fui-switch-thumb-md {
  --tw-sort: pointer-events;
  width: var(--fui-switch-thumb-md-size);
  height: var(--fui-switch-thumb-md-size);
}

@utility fui-switch-thumb-sm {
  --tw-sort: pointer-events;
  width: var(--fui-switch-thumb-sm-size);
  height: var(--fui-switch-thumb-sm-size);
}

@utility fui-slider-control {
  --tw-sort: container-type;
  display: var(--fui-slider-control-display);
  width: var(--fui-slider-control-width);
  align-items: var(--fui-slider-control-align-items);
}

@utility fui-slider-track {
  --tw-sort: container-type;
  border-radius: var(--fui-slider-track-rounded);
  background-color: var(--fui-slider-track-background-color);
  width: var(--fui-slider-track-size);
  height: var(--fui-slider-track-size);
}

@utility fui-slider-thumb {
  --tw-sort: container-type;
  background-color: var(--fui-slider-thumb-background-color);
  border-radius: var(--fui-slider-thumb-rounded);
  width: var(--fui-slider-thumb-size);
  height: var(--fui-slider-thumb-size);
  &:hover {
    outline: var(--fui-slider-thumb-hover-outline);
    outline-offset: var(--fui-slider-thumb-hover-outline-offset);
    outline-color: var(--fui-slider-thumb-hover-outline-color);
  }
  &:focus-visible {
    outline: var(--fui-slider-thumb-focus-outline);
    outline-offset: var(--fui-slider-thumb-focus-outline-offset);
    outline-color: var(--fui-slider-thumb-focus-outline-color);
  }
}

@utility fui-slider-legend {
  --tw-sort: container-type;
  margin-top: var(--fui-slider-legend-margin-top);
  color: var(--fui-slider-legend-text-color);
  font-family: var(--fui-slider-legend-font-family);
  font-size: var(--fui-slider-legend-font-size);
  line-height: var(--fui-slider-legend-line-height);
  font-weight: var(--fui-slider-legend-font-weight);
  letter-spacing: var(--fui-slider-legend-letter-spacing);
  font-feature-settings: var(--fui-slider-legend-font-feature-settings);
  font-variation-settings: var(--fui-slider-legend-font-variation-settings);
}

@utility fui-slider-range {
  --tw-sort: container-type;
  background-color: var(--fui-slider-range-background-color);
}

@utility fui-toggle {
  --tw-sort: container-type;
  border-radius: var(--fui-toggle-rounded);
  font-family: var(--fui-toggle-font-family);
  font-size: var(--fui-toggle-font-size);
  line-height: var(--fui-toggle-line-height);
  font-weight: var(--fui-toggle-font-weight);
  letter-spacing: var(--fui-toggle-letter-spacing);
  font-feature-settings: var(--fui-toggle-font-feature-settings);
  font-variation-settings: var(--fui-toggle-font-variation-settings);
  text-transform: var(--fui-toggle-text-transform);
  gap: var(--fui-toggle-gap);
  border: var(--fui-toggle-border);
  border-color: var(--fui-toggle-border-color);
  display: var(--fui-toggle-display);
  align-items: var(--fui-toggle-align-items);
  justify-content: var(--fui-toggle-justify-content);
  &:hover {
    border-color: var(--fui-toggle-hover-border-color);
  }
  &:is([data-state=checked],[data-state=indeterminate],[data-state=on],[aria-checked=true],[aria-checked=mixed],[aria-pressed=true]) {
    background-color: var(--fui-toggle-checked-background-color);
    border-color: var(--fui-toggle-checked-border-color);
  }
  &:is([aria-invalid=true],[data-invalid]) {
    border-color: var(--fui-toggle-invalid-border-color);
    outline-color: var(--fui-toggle-invalid-outline-color);
  }
  & :where([data-icon]) {
    width: var(--fui-toggle-icon-size);
    height: var(--fui-toggle-icon-size);
  }
}

@utility fui-toggle-default {
  --tw-sort: pointer-events;
  background-color: var(--fui-toggle-default-background-color);
}

@utility fui-toggle-outline {
  --tw-sort: pointer-events;
  background-color: var(--fui-toggle-outline-background-color);
  border: var(--fui-toggle-outline-border);
  border-color: var(--fui-toggle-outline-border-color);
  &:hover {
    border-color: var(--fui-toggle-outline-hover-border-color);
  }
  &:is([data-state=checked],[data-state=indeterminate],[data-state=on],[aria-checked=true],[aria-checked=mixed],[aria-pressed=true]) {
    border-color: var(--fui-toggle-outline-checked-border-color);
  }
}

@utility fui-toggle-md {
  --tw-sort: pointer-events;
  height: var(--fui-toggle-md-height);
  min-width: var(--fui-toggle-md-min-width);
  padding-inline: var(--fui-toggle-md-padding-x);
  &:has([data-icon=inline-start]) {
    padding-inline-start: var(--fui-toggle-md-icon-start-padding-start);
  }
  &:has([data-icon=inline-end]) {
    padding-inline-end: var(--fui-toggle-md-icon-end-padding-end);
  }
}

@utility fui-toggle-sm {
  --tw-sort: pointer-events;
  height: var(--fui-toggle-sm-height);
  min-width: var(--fui-toggle-sm-min-width);
  padding-inline: var(--fui-toggle-sm-padding-x);
  &:has([data-icon=inline-start]) {
    padding-inline-start: var(--fui-toggle-sm-icon-start-padding-start);
  }
  &:has([data-icon=inline-end]) {
    padding-inline-end: var(--fui-toggle-sm-icon-end-padding-end);
  }
}

@utility fui-toggle-lg {
  --tw-sort: pointer-events;
  height: var(--fui-toggle-lg-height);
  min-width: var(--fui-toggle-lg-min-width);
  padding-inline: var(--fui-toggle-lg-padding-x);
  &:has([data-icon=inline-start]) {
    padding-inline-start: var(--fui-toggle-lg-icon-start-padding-start);
  }
  &:has([data-icon=inline-end]) {
    padding-inline-end: var(--fui-toggle-lg-icon-end-padding-end);
  }
}

@utility fui-toggle-icon-sm {
  --tw-sort: pointer-events;
  width: var(--fui-toggle-icon-sm-size);
  height: var(--fui-toggle-icon-sm-size);
}

@utility fui-toggle-icon-md {
  --tw-sort: pointer-events;
  width: var(--fui-toggle-icon-md-size);
  height: var(--fui-toggle-icon-md-size);
}

@utility fui-toggle-icon-lg {
  --tw-sort: pointer-events;
  width: var(--fui-toggle-icon-lg-size);
  height: var(--fui-toggle-icon-lg-size);
}

@utility fui-toggle-group {
  --tw-sort: container-type;
  display: var(--fui-toggle-group-display);
  width: var(--fui-toggle-group-width);
  flex-direction: var(--fui-toggle-group-flex-direction);
  align-items: var(--fui-toggle-group-align-items);
}

@utility fui-toggle-group-none {
  --tw-sort: pointer-events;
  gap: var(--fui-toggle-group-none-gap);
}

@utility fui-toggle-group-xs {
  --tw-sort: pointer-events;
  gap: var(--fui-toggle-group-xs-gap);
}

@utility fui-toggle-group-sm {
  --tw-sort: pointer-events;
  gap: var(--fui-toggle-group-sm-gap);
}

@utility fui-toggle-group-md {
  --tw-sort: pointer-events;
  gap: var(--fui-toggle-group-md-gap);
}

@utility fui-toggle-group-lg {
  --tw-sort: pointer-events;
  gap: var(--fui-toggle-group-lg-gap);
}

@utility fui-toggle-group-item {
  --tw-sort: container-type;
  flex-shrink: var(--fui-toggle-group-item-flex-shrink);
}

@utility fui-button-group-text {
  --tw-sort: container-type;
  background-color: var(--fui-button-group-text-background-color);
  border: var(--fui-button-group-text-border);
  border-color: var(--fui-button-group-text-border-color);
  border-bottom-color: var(--fui-button-group-text-border-bottom-color);
  font-family: var(--fui-button-group-text-font-family);
  font-size: var(--fui-button-group-text-font-size);
  line-height: var(--fui-button-group-text-line-height);
  font-weight: var(--fui-button-group-text-font-weight);
  letter-spacing: var(--fui-button-group-text-letter-spacing);
  font-feature-settings: var(--fui-button-group-text-font-feature-settings);
  font-variation-settings: var(--fui-button-group-text-font-variation-settings);
  text-transform: var(--fui-button-group-text-text-transform);
  gap: var(--fui-button-group-text-gap);
  padding-inline: var(--fui-button-group-text-padding-x);
  display: var(--fui-button-group-text-display);
  align-items: var(--fui-button-group-text-align-items);
  & :where([data-icon]) {
    width: var(--fui-button-group-text-icon-size);
    height: var(--fui-button-group-text-icon-size);
  }
}

@utility fui-button-group-separator {
  --tw-sort: container-type;
  background-color: var(--fui-button-group-separator-background-color);
  width: var(--fui-button-group-separator-size);
  height: var(--fui-button-group-separator-size);
  flex-shrink: var(--fui-button-group-separator-flex-shrink);
  align-self: var(--fui-button-group-separator-align-self);
}

@utility fui-button-group-separator-vertical {
  --tw-sort: pointer-events;
  margin-block: var(--fui-button-group-separator-vertical-margin-y);
  height: var(--fui-button-group-separator-vertical-height);
}

@utility fui-button-group-separator-horizontal {
  --tw-sort: pointer-events;
  margin-inline: var(--fui-button-group-separator-horizontal-margin-x);
  width: var(--fui-button-group-separator-horizontal-width);
}

@utility fui-button-group {
  --tw-sort: container-type;
  display: var(--fui-button-group-display);
  width: var(--fui-button-group-width);
  align-items: var(--fui-button-group-align-items);
}

@utility fui-field-label {
  --tw-sort: container-type;
  font-family: var(--fui-field-label-font-family);
  font-size: var(--fui-field-label-font-size);
  line-height: var(--fui-field-label-line-height);
  font-weight: var(--fui-field-label-font-weight);
  letter-spacing: var(--fui-field-label-letter-spacing);
  font-feature-settings: var(--fui-field-label-font-feature-settings);
  font-variation-settings: var(--fui-field-label-font-variation-settings);
  text-transform: var(--fui-field-label-text-transform);
  gap: var(--fui-field-label-gap);
  display: var(--fui-field-label-display);
  width: var(--fui-field-label-width);
  &:is([aria-invalid=true],[data-invalid]) {
    color: var(--fui-field-label-invalid-text-color);
  }
}

@utility fui-field-label-default {
  --tw-sort: pointer-events;
  --fui_empty: initial;
}

@utility fui-field-label-card {
  --tw-sort: pointer-events;
  width: var(--fui-field-label-card-width);
  flex-direction: var(--fui-field-label-card-flex-direction);
  border: var(--fui-field-label-card-border);
  border-radius: var(--fui-field-label-card-rounded);
  &:has([data-state=checked]) {
    background-color: var(--fui-field-label-card-checked-within-background-color);
    border-color: var(--fui-field-label-card-checked-within-border-color);
  }
}

@utility fui-field-label-beside {
  --tw-sort: pointer-events;
  font-family: var(--fui-field-label-beside-font-family);
  font-size: var(--fui-field-label-beside-font-size);
  line-height: var(--fui-field-label-beside-line-height);
  font-weight: var(--fui-field-label-beside-font-weight);
  letter-spacing: var(--fui-field-label-beside-letter-spacing);
  font-feature-settings: var(--fui-field-label-beside-font-feature-settings);
  font-variation-settings: var(--fui-field-label-beside-font-variation-settings);
  text-transform: var(--fui-field-label-beside-text-transform);
}

@utility fui-field-description {
  --tw-sort: container-type;
  color: var(--fui-field-description-text-color);
  font-family: var(--fui-field-description-font-family);
  font-size: var(--fui-field-description-font-size);
  line-height: var(--fui-field-description-line-height);
  font-weight: var(--fui-field-description-font-weight);
  letter-spacing: var(--fui-field-description-letter-spacing);
  font-feature-settings: var(--fui-field-description-font-feature-settings);
  font-variation-settings: var(--fui-field-description-font-variation-settings);
  text-align: var(--fui-field-description-text-align);
  text-transform: var(--fui-field-description-text-transform);
  & :where(a) {
    text-decoration-line: var(--fui-field-description-link-text-decoration-line);
  }
  & :where(a:hover) {
    color: var(--fui-field-description-link-hover-text-color);
  }
}

@utility fui-field-error {
  --tw-sort: container-type;
  color: var(--fui-field-error-text-color);
  font-family: var(--fui-field-error-font-family);
  font-size: var(--fui-field-error-font-size);
  line-height: var(--fui-field-error-line-height);
  font-weight: var(--fui-field-error-font-weight);
  letter-spacing: var(--fui-field-error-letter-spacing);
  font-feature-settings: var(--fui-field-error-font-feature-settings);
  font-variation-settings: var(--fui-field-error-font-variation-settings);
}

@utility fui-field-legend {
  --tw-sort: container-type;
  margin-bottom: var(--fui-field-legend-margin-bottom);
}

@utility fui-field-legend-legend {
  --tw-sort: pointer-events;
  font-family: var(--fui-field-legend-legend-font-family);
  font-size: var(--fui-field-legend-legend-font-size);
  line-height: var(--fui-field-legend-legend-line-height);
  font-weight: var(--fui-field-legend-legend-font-weight);
  letter-spacing: var(--fui-field-legend-legend-letter-spacing);
  font-feature-settings: var(--fui-field-legend-legend-font-feature-settings);
  font-variation-settings: var(--fui-field-legend-legend-font-variation-settings);
}

@utility fui-field-legend-label {
  --tw-sort: pointer-events;
  font-family: var(--fui-field-legend-label-font-family);
  font-size: var(--fui-field-legend-label-font-size);
  line-height: var(--fui-field-legend-label-line-height);
  font-weight: var(--fui-field-legend-label-font-weight);
  letter-spacing: var(--fui-field-legend-label-letter-spacing);
  font-feature-settings: var(--fui-field-legend-label-font-feature-settings);
  font-variation-settings: var(--fui-field-legend-label-font-variation-settings);
  text-transform: var(--fui-field-legend-label-text-transform);
}

@utility fui-field-separator {
  --tw-sort: container-type;
  margin-block: var(--fui-field-separator-bleed-y);
  font-family: var(--fui-field-separator-font-family);
  font-size: var(--fui-field-separator-font-size);
  line-height: var(--fui-field-separator-line-height);
  font-weight: var(--fui-field-separator-font-weight);
  letter-spacing: var(--fui-field-separator-letter-spacing);
  font-feature-settings: var(--fui-field-separator-font-feature-settings);
  font-variation-settings: var(--fui-field-separator-font-variation-settings);
  height: var(--fui-field-separator-height);
}

@utility fui-field-separator-content {
  --tw-sort: container-type;
  background-color: var(--fui-field-separator-content-background-color);
  color: var(--fui-field-separator-content-text-color);
  padding-inline: var(--fui-field-separator-content-padding-x);
}

@utility fui-field {
  --tw-sort: container-type;
  display: var(--fui-field-display);
  width: var(--fui-field-width);
  gap: var(--fui-field-gap);
}

@utility fui-field-content {
  --tw-sort: container-type;
  display: var(--fui-field-content-display);
  flex: var(--fui-field-content-flex);
  flex-direction: var(--fui-field-content-flex-direction);
  gap: var(--fui-field-content-gap);
}

@utility fui-field-group {
  --tw-sort: container-type;
  display: var(--fui-field-group-display);
  width: var(--fui-field-group-width);
  flex-direction: var(--fui-field-group-flex-direction);
  gap: var(--fui-field-group-gap);
}

@utility fui-field-group-fields {
  --tw-sort: pointer-events;
  --fui_empty: initial;
}

@utility fui-field-group-checkboxes {
  --tw-sort: pointer-events;
  gap: var(--fui-field-group-checkboxes-gap);
}

@utility fui-field-set {
  --tw-sort: container-type;
  display: var(--fui-field-set-display);
  flex-direction: var(--fui-field-set-flex-direction);
  gap: var(--fui-field-set-gap);
}

@utility fui-form {
  --tw-sort: container-type;
  gap: var(--fui-form-gap);
  display: var(--fui-form-display);
  width: var(--fui-form-width);
  flex-direction: var(--fui-form-flex-direction);
}

@utility fui-native-select {
  --tw-sort: container-type;
  background-color: var(--fui-native-select-background-color);
  border: var(--fui-native-select-border);
  border-color: var(--fui-native-select-border-color);
  border-bottom-color: var(--fui-native-select-border-bottom-color);
  border-radius: var(--fui-native-select-rounded);
  font-family: var(--fui-native-select-font-family);
  font-size: var(--fui-native-select-font-size);
  line-height: var(--fui-native-select-line-height);
  font-weight: var(--fui-native-select-font-weight);
  letter-spacing: var(--fui-native-select-letter-spacing);
  font-feature-settings: var(--fui-native-select-font-feature-settings);
  font-variation-settings: var(--fui-native-select-font-variation-settings);
  padding-block: var(--fui-native-select-padding-y);
  padding-inline-start: var(--fui-native-select-padding-start);
  padding-inline-end: var(--fui-native-select-padding-end);
  &::placeholder {
    color: var(--fui-native-select-placeholder-color);
  }
  &:focus-visible {
    border-bottom: var(--fui-native-select-focus-border-bottom);
  }
  &[data-placeholder] {
    color: var(--fui-native-select-placeholder-shown-text-color);
  }
  &:is([aria-invalid=true],[data-invalid]) {
    border-bottom-color: var(--fui-native-select-invalid-border-bottom-color);
  }
  &::file-selector-button {
    background-color: var(--fui-native-select-file-background-color);
    border: var(--fui-native-select-file-border);
    color: var(--fui-native-select-file-text-color);
    font-family: var(--fui-native-select-file-font-family);
    font-size: var(--fui-native-select-file-font-size);
    line-height: var(--fui-native-select-file-line-height);
    font-weight: var(--fui-native-select-file-font-weight);
    letter-spacing: var(--fui-native-select-file-letter-spacing);
    font-feature-settings: var(--fui-native-select-file-font-feature-settings);
    font-variation-settings: var(--fui-native-select-file-font-variation-settings);
  }
}

@utility fui-native-select-md {
  --tw-sort: pointer-events;
  height: var(--fui-native-select-md-height);
}

@utility fui-native-select-sm {
  --tw-sort: pointer-events;
  height: var(--fui-native-select-sm-height);
}

@utility fui-native-select-option {
  --tw-sort: container-type;
  color: var(--fui-native-select-option-text-color);
}

@utility fui-native-select-chevron {
  --tw-sort: container-type;
  color: var(--fui-native-select-chevron-text-color);
  width: var(--fui-native-select-chevron-size);
  height: var(--fui-native-select-chevron-size);
}

@utility fui-native-select-root {
  --tw-sort: container-type;
  width: var(--fui-native-select-root-width);
}

@utility fui-select-trigger {
  --tw-sort: container-type;
  background-color: var(--fui-select-trigger-background-color);
  border: var(--fui-select-trigger-border);
  border-color: var(--fui-select-trigger-border-color);
  border-bottom-color: var(--fui-select-trigger-border-bottom-color);
  border-radius: var(--fui-select-trigger-rounded);
  font-family: var(--fui-select-trigger-font-family);
  font-size: var(--fui-select-trigger-font-size);
  line-height: var(--fui-select-trigger-line-height);
  font-weight: var(--fui-select-trigger-font-weight);
  letter-spacing: var(--fui-select-trigger-letter-spacing);
  font-feature-settings: var(--fui-select-trigger-font-feature-settings);
  font-variation-settings: var(--fui-select-trigger-font-variation-settings);
  gap: var(--fui-select-trigger-gap);
  padding-inline: var(--fui-select-trigger-padding-x);
  padding-block: var(--fui-select-trigger-padding-y);
  display: var(--fui-select-trigger-display);
  width: var(--fui-select-trigger-width);
  align-items: var(--fui-select-trigger-align-items);
  justify-content: var(--fui-select-trigger-justify-content);
  &::placeholder {
    color: var(--fui-select-trigger-placeholder-color);
  }
  &:focus-visible {
    border-bottom: var(--fui-select-trigger-focus-border-bottom);
  }
  &:is([aria-invalid=true],[data-invalid]) {
    border-bottom-color: var(--fui-select-trigger-invalid-border-bottom-color);
  }
  &::file-selector-button {
    background-color: var(--fui-select-trigger-file-background-color);
    border: var(--fui-select-trigger-file-border);
    color: var(--fui-select-trigger-file-text-color);
    font-family: var(--fui-select-trigger-file-font-family);
    font-size: var(--fui-select-trigger-file-font-size);
    line-height: var(--fui-select-trigger-file-line-height);
    font-weight: var(--fui-select-trigger-file-font-weight);
    letter-spacing: var(--fui-select-trigger-file-letter-spacing);
    font-feature-settings: var(--fui-select-trigger-file-font-feature-settings);
    font-variation-settings: var(--fui-select-trigger-file-font-variation-settings);
  }
  & :where([data-icon]) {
    width: var(--fui-select-trigger-icon-size);
    height: var(--fui-select-trigger-icon-size);
  }
}

@utility fui-select-trigger-md {
  --tw-sort: pointer-events;
  height: var(--fui-select-trigger-md-height);
}

@utility fui-select-trigger-sm {
  --tw-sort: pointer-events;
  height: var(--fui-select-trigger-sm-height);
}

@utility fui-select-value {
  --tw-sort: container-type;
  align-items: var(--fui-select-value-align-items);
  gap: var(--fui-select-value-gap);
}

@utility fui-select-value-placeholder {
  --tw-sort: container-type;
  color: var(--fui-select-value-placeholder-text-color);
}

@utility fui-select-chevron {
  --tw-sort: container-type;
  color: var(--fui-select-chevron-text-color);
  width: var(--fui-select-chevron-size);
  height: var(--fui-select-chevron-size);
}

@utility fui-select-content {
  --tw-sort: container-type;
  outline: var(--fui-select-content-outline);
  outline-offset: var(--fui-select-content-outline-offset);
  background-color: var(--fui-select-content-background-color);
  color: var(--fui-select-content-text-color);
  outline-color: var(--fui-select-content-outline-color);
  border-radius: var(--fui-select-content-rounded);
  box-shadow: var(--fui-select-content-shadow);
  min-width: var(--fui-select-content-min-width);
}

@utility fui-select-content-popper {
  --tw-sort: pointer-events;
  width: var(--reka-select-trigger-width);
}

@utility fui-select-content-item-aligned {
  --tw-sort: pointer-events;
  --fui_empty: initial;
}

@utility fui-select-item {
  --tw-sort: container-type;
  border-radius: var(--fui-select-item-rounded);
  font-family: var(--fui-select-item-font-family);
  font-size: var(--fui-select-item-font-size);
  line-height: var(--fui-select-item-line-height);
  font-weight: var(--fui-select-item-font-weight);
  letter-spacing: var(--fui-select-item-letter-spacing);
  font-feature-settings: var(--fui-select-item-font-feature-settings);
  font-variation-settings: var(--fui-select-item-font-variation-settings);
  gap: var(--fui-select-item-gap);
  padding-block: var(--fui-select-item-padding-y);
  padding-inline-start: var(--fui-select-item-padding-start);
  padding-inline-end: var(--fui-select-item-padding-end);
  display: var(--fui-select-item-display);
  width: var(--fui-select-item-width);
  align-items: var(--fui-select-item-align-items);
  &[data-highlighted] {
    background-color: var(--fui-select-item-highlighted-background-color);
    color: var(--fui-select-item-highlighted-text-color);
  }
  & :where([data-icon]) {
    width: var(--fui-select-item-icon-size);
    height: var(--fui-select-item-icon-size);
  }
}

@utility fui-select-item-indicator {
  --tw-sort: container-type;
  width: var(--fui-select-item-indicator-size);
  height: var(--fui-select-item-indicator-size);
}

@utility fui-select-label {
  --tw-sort: container-type;
  color: var(--fui-select-label-text-color);
  font-family: var(--fui-select-label-font-family);
  font-size: var(--fui-select-label-font-size);
  line-height: var(--fui-select-label-line-height);
  font-weight: var(--fui-select-label-font-weight);
  letter-spacing: var(--fui-select-label-letter-spacing);
  font-feature-settings: var(--fui-select-label-font-feature-settings);
  font-variation-settings: var(--fui-select-label-font-variation-settings);
  text-transform: var(--fui-select-label-text-transform);
  padding-inline: var(--fui-select-label-padding-x);
  padding-block: var(--fui-select-label-padding-y);
}

@utility fui-select-separator {
  --tw-sort: container-type;
  margin-inline: var(--fui-select-separator-bleed-x);
  margin-block: var(--fui-select-separator-margin-y);
  background-color: var(--fui-select-separator-background-color);
  height: var(--fui-select-separator-height);
}

@utility fui-select-scroll-button {
  --tw-sort: container-type;
  background-color: var(--fui-select-scroll-button-background-color);
  padding-block: var(--fui-select-scroll-button-padding-y);
  display: var(--fui-select-scroll-button-display);
  align-items: var(--fui-select-scroll-button-align-items);
  justify-content: var(--fui-select-scroll-button-justify-content);
  & :where([data-icon]) {
    width: var(--fui-select-scroll-button-icon-size);
    height: var(--fui-select-scroll-button-icon-size);
  }
}

@utility fui-select-group {
  --tw-sort: container-type;
  padding: var(--fui-select-group-padding);
}

@utility fui-combobox-search {
  --tw-sort: container-type;
  margin-inline: var(--fui-combobox-search-margin-x);
  margin-top: var(--fui-combobox-search-margin-top);
  font-family: var(--fui-combobox-search-font-family);
  font-size: var(--fui-combobox-search-font-size);
  line-height: var(--fui-combobox-search-line-height);
  font-weight: var(--fui-combobox-search-font-weight);
  letter-spacing: var(--fui-combobox-search-letter-spacing);
  font-feature-settings: var(--fui-combobox-search-font-feature-settings);
  font-variation-settings: var(--fui-combobox-search-font-variation-settings);
  height: var(--fui-combobox-search-height);
  padding-inline: var(--fui-combobox-search-padding-x);
  gap: var(--fui-combobox-search-gap);
  & :where([data-icon]) {
    width: var(--fui-combobox-search-icon-size);
    height: var(--fui-combobox-search-icon-size);
  }
}

@utility fui-combobox-trigger {
  --tw-sort: container-type;
  background-color: var(--fui-combobox-trigger-background-color);
  border: var(--fui-combobox-trigger-border);
  border-color: var(--fui-combobox-trigger-border-color);
  border-bottom-color: var(--fui-combobox-trigger-border-bottom-color);
  border-radius: var(--fui-combobox-trigger-rounded);
  font-family: var(--fui-combobox-trigger-font-family);
  font-size: var(--fui-combobox-trigger-font-size);
  line-height: var(--fui-combobox-trigger-line-height);
  font-weight: var(--fui-combobox-trigger-font-weight);
  letter-spacing: var(--fui-combobox-trigger-letter-spacing);
  font-feature-settings: var(--fui-combobox-trigger-font-feature-settings);
  font-variation-settings: var(--fui-combobox-trigger-font-variation-settings);
  gap: var(--fui-combobox-trigger-gap);
  padding-inline: var(--fui-combobox-trigger-padding-x);
  padding-block: var(--fui-combobox-trigger-padding-y);
  height: var(--fui-combobox-trigger-height);
  display: var(--fui-combobox-trigger-display);
  width: var(--fui-combobox-trigger-width);
  align-items: var(--fui-combobox-trigger-align-items);
  justify-content: var(--fui-combobox-trigger-justify-content);
  &::placeholder {
    color: var(--fui-combobox-trigger-placeholder-color);
  }
  &:focus-visible {
    border-bottom: var(--fui-combobox-trigger-focus-border-bottom);
  }
  &:is([aria-invalid=true],[data-invalid]) {
    border-bottom-color: var(--fui-combobox-trigger-invalid-border-bottom-color);
  }
  &::file-selector-button {
    background-color: var(--fui-combobox-trigger-file-background-color);
    border: var(--fui-combobox-trigger-file-border);
    color: var(--fui-combobox-trigger-file-text-color);
    font-family: var(--fui-combobox-trigger-file-font-family);
    font-size: var(--fui-combobox-trigger-file-font-size);
    line-height: var(--fui-combobox-trigger-file-line-height);
    font-weight: var(--fui-combobox-trigger-file-font-weight);
    letter-spacing: var(--fui-combobox-trigger-file-letter-spacing);
    font-feature-settings: var(--fui-combobox-trigger-file-font-feature-settings);
    font-variation-settings: var(--fui-combobox-trigger-file-font-variation-settings);
  }
  & :where([data-icon]) {
    width: var(--fui-combobox-trigger-icon-size);
    height: var(--fui-combobox-trigger-icon-size);
  }
}

@utility fui-combobox-chevron {
  --tw-sort: container-type;
  color: var(--fui-combobox-chevron-text-color);
  width: var(--fui-combobox-chevron-size);
  height: var(--fui-combobox-chevron-size);
}

@utility fui-combobox-viewport {
  --tw-sort: container-type;
  scrollbar-width: var(--fui-combobox-viewport-scrollbar);
  min-height: var(--fui-combobox-viewport-min-height);
  padding: var(--fui-combobox-viewport-padding);
  &::-webkit-scrollbar {
    display: var(--fui-combobox-viewport-scrollbar);
  }
}

@utility fui-combobox-content {
  --tw-sort: container-type;
  outline: var(--fui-combobox-content-outline);
  outline-offset: var(--fui-combobox-content-outline-offset);
  background-color: var(--fui-combobox-content-background-color);
  color: var(--fui-combobox-content-text-color);
  outline-color: var(--fui-combobox-content-outline-color);
  border-radius: var(--fui-combobox-content-rounded);
  box-shadow: var(--fui-combobox-content-shadow);
  min-width: var(--fui-combobox-content-min-width);
  display: var(--fui-combobox-content-display);
  flex-direction: var(--fui-combobox-content-flex-direction);
  width: var(--reka-combobox-trigger-width);
}

@utility fui-combobox-item {
  --tw-sort: container-type;
  border-radius: var(--fui-combobox-item-rounded);
  font-family: var(--fui-combobox-item-font-family);
  font-size: var(--fui-combobox-item-font-size);
  line-height: var(--fui-combobox-item-line-height);
  font-weight: var(--fui-combobox-item-font-weight);
  letter-spacing: var(--fui-combobox-item-letter-spacing);
  font-feature-settings: var(--fui-combobox-item-font-feature-settings);
  font-variation-settings: var(--fui-combobox-item-font-variation-settings);
  gap: var(--fui-combobox-item-gap);
  padding-block: var(--fui-combobox-item-padding-y);
  padding-inline-start: var(--fui-combobox-item-padding-start);
  padding-inline-end: var(--fui-combobox-item-padding-end);
  display: var(--fui-combobox-item-display);
  width: var(--fui-combobox-item-width);
  align-items: var(--fui-combobox-item-align-items);
  &[data-highlighted] {
    background-color: var(--fui-combobox-item-highlighted-background-color);
    color: var(--fui-combobox-item-highlighted-text-color);
  }
  & :where([data-icon]) {
    width: var(--fui-combobox-item-icon-size);
    height: var(--fui-combobox-item-icon-size);
  }
}

@utility fui-combobox-item-indicator {
  --tw-sort: container-type;
  width: var(--fui-combobox-item-indicator-size);
  height: var(--fui-combobox-item-indicator-size);
  display: var(--fui-combobox-item-indicator-display);
  align-items: var(--fui-combobox-item-indicator-align-items);
  justify-content: var(--fui-combobox-item-indicator-justify-content);
}

@utility fui-combobox-label {
  --tw-sort: container-type;
  color: var(--fui-combobox-label-text-color);
  font-family: var(--fui-combobox-label-font-family);
  font-size: var(--fui-combobox-label-font-size);
  line-height: var(--fui-combobox-label-line-height);
  font-weight: var(--fui-combobox-label-font-weight);
  letter-spacing: var(--fui-combobox-label-letter-spacing);
  font-feature-settings: var(--fui-combobox-label-font-feature-settings);
  font-variation-settings: var(--fui-combobox-label-font-variation-settings);
  text-transform: var(--fui-combobox-label-text-transform);
  padding-inline: var(--fui-combobox-label-padding-x);
  padding-block: var(--fui-combobox-label-padding-y);
}

@utility fui-combobox-empty {
  --tw-sort: container-type;
  font-family: var(--fui-combobox-empty-font-family);
  font-size: var(--fui-combobox-empty-font-size);
  line-height: var(--fui-combobox-empty-line-height);
  font-weight: var(--fui-combobox-empty-font-weight);
  letter-spacing: var(--fui-combobox-empty-letter-spacing);
  font-feature-settings: var(--fui-combobox-empty-font-feature-settings);
  font-variation-settings: var(--fui-combobox-empty-font-variation-settings);
  color: var(--fui-combobox-empty-text-color);
  padding-block: var(--fui-combobox-empty-padding-y);
  text-align: var(--fui-combobox-empty-text-align);
}

@utility fui-combobox-separator {
  --tw-sort: container-type;
  margin-inline: var(--fui-combobox-separator-bleed-x);
  margin-block: var(--fui-combobox-separator-margin-y);
  background-color: var(--fui-combobox-separator-background-color);
  height: var(--fui-combobox-separator-height);
}

@utility fui-combobox-anchor {
  --tw-sort: container-type;
  display: var(--fui-combobox-anchor-display);
  width: var(--fui-combobox-anchor-width);
}

@utility fui-combobox-input {
  --tw-sort: container-type;
  flex: var(--fui-combobox-input-flex);
}

@utility fui-autocomplete-input {
  --tw-sort: container-type;
  background-color: var(--fui-autocomplete-input-background-color);
  border: var(--fui-autocomplete-input-border);
  border-color: var(--fui-autocomplete-input-border-color);
  border-bottom-color: var(--fui-autocomplete-input-border-bottom-color);
  border-radius: var(--fui-autocomplete-input-rounded);
  font-family: var(--fui-autocomplete-input-font-family);
  font-size: var(--fui-autocomplete-input-font-size);
  line-height: var(--fui-autocomplete-input-line-height);
  font-weight: var(--fui-autocomplete-input-font-weight);
  letter-spacing: var(--fui-autocomplete-input-letter-spacing);
  font-feature-settings: var(--fui-autocomplete-input-font-feature-settings);
  font-variation-settings: var(--fui-autocomplete-input-font-variation-settings);
  height: var(--fui-autocomplete-input-height);
  padding-inline: var(--fui-autocomplete-input-padding-x);
  padding-block: var(--fui-autocomplete-input-padding-y);
  width: var(--fui-autocomplete-input-width);
  min-width: var(--fui-autocomplete-input-min-width);
  flex: var(--fui-autocomplete-input-flex);
  &::placeholder {
    color: var(--fui-autocomplete-input-placeholder-color);
  }
  &:focus-visible {
    border-bottom: var(--fui-autocomplete-input-focus-border-bottom);
  }
  &:is([aria-invalid=true],[data-invalid]) {
    border-bottom-color: var(--fui-autocomplete-input-invalid-border-bottom-color);
  }
  &::file-selector-button {
    background-color: var(--fui-autocomplete-input-file-background-color);
    border: var(--fui-autocomplete-input-file-border);
    color: var(--fui-autocomplete-input-file-text-color);
    font-family: var(--fui-autocomplete-input-file-font-family);
    font-size: var(--fui-autocomplete-input-file-font-size);
    line-height: var(--fui-autocomplete-input-file-line-height);
    font-weight: var(--fui-autocomplete-input-file-font-weight);
    letter-spacing: var(--fui-autocomplete-input-file-letter-spacing);
    font-feature-settings: var(--fui-autocomplete-input-file-font-feature-settings);
    font-variation-settings: var(--fui-autocomplete-input-file-font-variation-settings);
  }
}

@utility fui-autocomplete-viewport {
  --tw-sort: container-type;
  scrollbar-width: var(--fui-autocomplete-viewport-scrollbar);
  min-height: var(--fui-autocomplete-viewport-min-height);
  padding: var(--fui-autocomplete-viewport-padding);
  &::-webkit-scrollbar {
    display: var(--fui-autocomplete-viewport-scrollbar);
  }
}

@utility fui-autocomplete-content {
  --tw-sort: container-type;
  outline: var(--fui-autocomplete-content-outline);
  outline-offset: var(--fui-autocomplete-content-outline-offset);
  background-color: var(--fui-autocomplete-content-background-color);
  color: var(--fui-autocomplete-content-text-color);
  outline-color: var(--fui-autocomplete-content-outline-color);
  border-radius: var(--fui-autocomplete-content-rounded);
  box-shadow: var(--fui-autocomplete-content-shadow);
  min-width: var(--fui-autocomplete-content-min-width);
  display: var(--fui-autocomplete-content-display);
  flex-direction: var(--fui-autocomplete-content-flex-direction);
  width: var(--reka-combobox-trigger-width);
}

@utility fui-autocomplete-item {
  --tw-sort: container-type;
  border-radius: var(--fui-autocomplete-item-rounded);
  font-family: var(--fui-autocomplete-item-font-family);
  font-size: var(--fui-autocomplete-item-font-size);
  line-height: var(--fui-autocomplete-item-line-height);
  font-weight: var(--fui-autocomplete-item-font-weight);
  letter-spacing: var(--fui-autocomplete-item-letter-spacing);
  font-feature-settings: var(--fui-autocomplete-item-font-feature-settings);
  font-variation-settings: var(--fui-autocomplete-item-font-variation-settings);
  gap: var(--fui-autocomplete-item-gap);
  padding-block: var(--fui-autocomplete-item-padding-y);
  padding-inline-start: var(--fui-autocomplete-item-padding-start);
  padding-inline-end: var(--fui-autocomplete-item-padding-end);
  display: var(--fui-autocomplete-item-display);
  width: var(--fui-autocomplete-item-width);
  align-items: var(--fui-autocomplete-item-align-items);
  &[data-highlighted] {
    background-color: var(--fui-autocomplete-item-highlighted-background-color);
    color: var(--fui-autocomplete-item-highlighted-text-color);
  }
  & :where([data-icon]) {
    width: var(--fui-autocomplete-item-icon-size);
    height: var(--fui-autocomplete-item-icon-size);
  }
}

@utility fui-autocomplete-label {
  --tw-sort: container-type;
  color: var(--fui-autocomplete-label-text-color);
  font-family: var(--fui-autocomplete-label-font-family);
  font-size: var(--fui-autocomplete-label-font-size);
  line-height: var(--fui-autocomplete-label-line-height);
  font-weight: var(--fui-autocomplete-label-font-weight);
  letter-spacing: var(--fui-autocomplete-label-letter-spacing);
  font-feature-settings: var(--fui-autocomplete-label-font-feature-settings);
  font-variation-settings: var(--fui-autocomplete-label-font-variation-settings);
  text-transform: var(--fui-autocomplete-label-text-transform);
  padding-inline: var(--fui-autocomplete-label-padding-x);
  padding-block: var(--fui-autocomplete-label-padding-y);
}

@utility fui-autocomplete-empty {
  --tw-sort: container-type;
  font-family: var(--fui-autocomplete-empty-font-family);
  font-size: var(--fui-autocomplete-empty-font-size);
  line-height: var(--fui-autocomplete-empty-line-height);
  font-weight: var(--fui-autocomplete-empty-font-weight);
  letter-spacing: var(--fui-autocomplete-empty-letter-spacing);
  font-feature-settings: var(--fui-autocomplete-empty-font-feature-settings);
  font-variation-settings: var(--fui-autocomplete-empty-font-variation-settings);
  color: var(--fui-autocomplete-empty-text-color);
  padding-block: var(--fui-autocomplete-empty-padding-y);
  text-align: var(--fui-autocomplete-empty-text-align);
}

@utility fui-autocomplete-separator {
  --tw-sort: container-type;
  margin-inline: var(--fui-autocomplete-separator-bleed-x);
  margin-block: var(--fui-autocomplete-separator-margin-y);
  background-color: var(--fui-autocomplete-separator-background-color);
  height: var(--fui-autocomplete-separator-height);
}

@utility fui-number-field-input {
  --tw-sort: container-type;
  background-color: var(--fui-number-field-input-background-color);
  border: var(--fui-number-field-input-border);
  border-color: var(--fui-number-field-input-border-color);
  border-bottom-color: var(--fui-number-field-input-border-bottom-color);
  border-radius: var(--fui-number-field-input-rounded);
  font-family: var(--fui-number-field-input-font-family);
  font-size: var(--fui-number-field-input-font-size);
  line-height: var(--fui-number-field-input-line-height);
  font-weight: var(--fui-number-field-input-font-weight);
  letter-spacing: var(--fui-number-field-input-letter-spacing);
  font-feature-settings: var(--fui-number-field-input-font-feature-settings);
  font-variation-settings: var(--fui-number-field-input-font-variation-settings);
  height: var(--fui-number-field-input-height);
  padding-inline: var(--fui-number-field-input-padding-x);
  padding-block: var(--fui-number-field-input-padding-y);
  width: var(--fui-number-field-input-width);
  min-width: var(--fui-number-field-input-min-width);
  text-align: var(--fui-number-field-input-text-align);
  &::placeholder {
    color: var(--fui-number-field-input-placeholder-color);
  }
  &:focus-visible {
    border-bottom: var(--fui-number-field-input-focus-border-bottom);
  }
  &:is([aria-invalid=true],[data-invalid]) {
    border-bottom-color: var(--fui-number-field-input-invalid-border-bottom-color);
  }
  &::file-selector-button {
    background-color: var(--fui-number-field-input-file-background-color);
    border: var(--fui-number-field-input-file-border);
    color: var(--fui-number-field-input-file-text-color);
    font-family: var(--fui-number-field-input-file-font-family);
    font-size: var(--fui-number-field-input-file-font-size);
    line-height: var(--fui-number-field-input-file-line-height);
    font-weight: var(--fui-number-field-input-file-font-weight);
    letter-spacing: var(--fui-number-field-input-file-letter-spacing);
    font-feature-settings: var(--fui-number-field-input-file-font-feature-settings);
    font-variation-settings: var(--fui-number-field-input-file-font-variation-settings);
  }
}

@utility fui-number-field-step {
  --tw-sort: container-type;
  padding: var(--fui-number-field-step-padding);
  display: var(--fui-number-field-step-display);
  align-items: var(--fui-number-field-step-align-items);
  justify-content: var(--fui-number-field-step-justify-content);
  & :where([data-icon]) {
    width: var(--fui-number-field-step-icon-size);
    height: var(--fui-number-field-step-icon-size);
  }
}

@utility fui-number-field {
  --tw-sort: container-type;
  display: var(--fui-number-field-display);
  gap: var(--fui-number-field-gap);
}

@utility fui-number-field-content {
  --tw-sort: container-type;
  min-width: var(--fui-number-field-content-min-width);
}

@utility fui-input-otp {
  --tw-sort: container-type;
  display: var(--fui-input-otp-display);
  align-items: var(--fui-input-otp-align-items);
  gap: var(--fui-input-otp-gap);
}

@utility fui-input-otp-slot {
  --tw-sort: container-type;
  background-color: var(--fui-input-otp-slot-background-color);
  border: var(--fui-input-otp-slot-border);
  border-color: var(--fui-input-otp-slot-border-color);
  border-bottom-color: var(--fui-input-otp-slot-border-bottom-color);
  border-radius: var(--fui-input-otp-slot-rounded);
  width: var(--fui-input-otp-slot-size);
  height: var(--fui-input-otp-slot-size);
  font-family: var(--fui-input-otp-slot-font-family);
  font-size: var(--fui-input-otp-slot-font-size);
  line-height: var(--fui-input-otp-slot-line-height);
  font-weight: var(--fui-input-otp-slot-font-weight);
  letter-spacing: var(--fui-input-otp-slot-letter-spacing);
  font-feature-settings: var(--fui-input-otp-slot-font-feature-settings);
  font-variation-settings: var(--fui-input-otp-slot-font-variation-settings);
  display: var(--fui-input-otp-slot-display);
  align-items: var(--fui-input-otp-slot-align-items);
  justify-content: var(--fui-input-otp-slot-justify-content);
  &::placeholder {
    color: var(--fui-input-otp-slot-placeholder-color);
  }
  &:focus-visible {
    border-bottom: var(--fui-input-otp-slot-focus-border-bottom);
    border-bottom-color: var(--fui-input-otp-slot-focus-border-bottom-color);
  }
  &:is([aria-invalid=true],[data-invalid]) {
    border-bottom-color: var(--fui-input-otp-slot-invalid-border-bottom-color);
  }
  &[data-active]:not([data-active=false]) {
    border-bottom: var(--fui-input-otp-slot-current-border-bottom);
  }
  &::file-selector-button {
    background-color: var(--fui-input-otp-slot-file-background-color);
    border: var(--fui-input-otp-slot-file-border);
    color: var(--fui-input-otp-slot-file-text-color);
    font-family: var(--fui-input-otp-slot-file-font-family);
    font-size: var(--fui-input-otp-slot-file-font-size);
    line-height: var(--fui-input-otp-slot-file-line-height);
    font-weight: var(--fui-input-otp-slot-file-font-weight);
    letter-spacing: var(--fui-input-otp-slot-file-letter-spacing);
    font-feature-settings: var(--fui-input-otp-slot-file-font-feature-settings);
    font-variation-settings: var(--fui-input-otp-slot-file-font-variation-settings);
  }
}

@utility fui-input-otp-caret {
  --tw-sort: container-type;
  background-color: var(--fui-input-otp-caret-background-color);
  height: var(--fui-input-otp-caret-height);
  width: var(--fui-input-otp-caret-width);
}

@utility fui-input-otp-group {
  --tw-sort: container-type;
  display: var(--fui-input-otp-group-display);
  align-items: var(--fui-input-otp-group-align-items);
  gap: var(--fui-input-otp-group-gap);
}

@utility fui-input-otp-separator {
  --tw-sort: container-type;
  display: var(--fui-input-otp-separator-display);
  align-items: var(--fui-input-otp-separator-align-items);
  & :where([data-icon]) {
    width: var(--fui-input-otp-separator-icon-size);
    height: var(--fui-input-otp-separator-icon-size);
  }
}

@utility fui-tags-input {
  --tw-sort: container-type;
  background-color: var(--fui-tags-input-background-color);
  border: var(--fui-tags-input-border);
  border-color: var(--fui-tags-input-border-color);
  border-bottom-color: var(--fui-tags-input-border-bottom-color);
  border-radius: var(--fui-tags-input-rounded);
  font-family: var(--fui-tags-input-font-family);
  font-size: var(--fui-tags-input-font-size);
  line-height: var(--fui-tags-input-line-height);
  font-weight: var(--fui-tags-input-font-weight);
  letter-spacing: var(--fui-tags-input-letter-spacing);
  font-feature-settings: var(--fui-tags-input-font-feature-settings);
  font-variation-settings: var(--fui-tags-input-font-variation-settings);
  gap: var(--fui-tags-input-gap);
  min-height: var(--fui-tags-input-min-height);
  padding-inline: var(--fui-tags-input-padding-x);
  padding-block: var(--fui-tags-input-padding-y);
  display: var(--fui-tags-input-display);
  flex-wrap: var(--fui-tags-input-flex-wrap);
  align-items: var(--fui-tags-input-align-items);
  &::placeholder {
    color: var(--fui-tags-input-placeholder-color);
  }
  &:focus-visible {
    border-bottom: var(--fui-tags-input-focus-border-bottom);
  }
  &:has(:focus-visible) {
    border-bottom: var(--fui-tags-input-focus-within-border-bottom);
  }
  &:is([aria-invalid=true],[data-invalid]) {
    border-bottom-color: var(--fui-tags-input-invalid-border-bottom-color);
  }
  &::file-selector-button {
    background-color: var(--fui-tags-input-file-background-color);
    border: var(--fui-tags-input-file-border);
    color: var(--fui-tags-input-file-text-color);
    font-family: var(--fui-tags-input-file-font-family);
    font-size: var(--fui-tags-input-file-font-size);
    line-height: var(--fui-tags-input-file-line-height);
    font-weight: var(--fui-tags-input-file-font-weight);
    letter-spacing: var(--fui-tags-input-file-letter-spacing);
    font-feature-settings: var(--fui-tags-input-file-font-feature-settings);
    font-variation-settings: var(--fui-tags-input-file-font-variation-settings);
  }
}

@utility fui-tags-input-input {
  --tw-sort: container-type;
  font-family: var(--fui-tags-input-input-font-family);
  font-size: var(--fui-tags-input-input-font-size);
  line-height: var(--fui-tags-input-input-line-height);
  font-weight: var(--fui-tags-input-input-font-weight);
  letter-spacing: var(--fui-tags-input-input-letter-spacing);
  font-feature-settings: var(--fui-tags-input-input-font-feature-settings);
  font-variation-settings: var(--fui-tags-input-input-font-variation-settings);
  min-height: var(--fui-tags-input-input-min-height);
  padding-inline: var(--fui-tags-input-input-padding-x);
  flex: var(--fui-tags-input-input-flex);
  &::placeholder {
    color: var(--fui-tags-input-input-placeholder-color);
  }
}

@utility fui-tags-input-item {
  --tw-sort: container-type;
  background-color: var(--fui-tags-input-item-background-color);
  border-radius: var(--fui-tags-input-item-rounded);
  height: var(--fui-tags-input-item-height);
  display: var(--fui-tags-input-item-display);
  align-items: var(--fui-tags-input-item-align-items);
  &:is([data-selected=true],[aria-selected=true],[data-state=active]) {
    outline: var(--fui-tags-input-item-selected-outline);
    outline-offset: var(--fui-tags-input-item-selected-outline-offset);
    outline-color: var(--fui-tags-input-item-selected-outline-color);
  }
}

@utility fui-tags-input-item-text {
  --tw-sort: container-type;
  font-family: var(--fui-tags-input-item-text-font-family);
  font-size: var(--fui-tags-input-item-text-font-size);
  line-height: var(--fui-tags-input-item-text-line-height);
  font-weight: var(--fui-tags-input-item-text-font-weight);
  letter-spacing: var(--fui-tags-input-item-text-letter-spacing);
  font-feature-settings: var(--fui-tags-input-item-text-font-feature-settings);
  font-variation-settings: var(--fui-tags-input-item-text-font-variation-settings);
  border-radius: var(--fui-tags-input-item-text-rounded);
  padding-inline: var(--fui-tags-input-item-text-padding-x);
  padding-block: var(--fui-tags-input-item-text-padding-y);
}

@utility fui-tags-input-item-delete {
  --tw-sort: container-type;
  margin-inline-end: var(--fui-tags-input-item-delete-margin-end);
  border-radius: var(--fui-tags-input-item-delete-rounded);
  display: var(--fui-tags-input-item-delete-display);
  & :where([data-icon]) {
    width: var(--fui-tags-input-item-delete-icon-size);
    height: var(--fui-tags-input-item-delete-icon-size);
  }
}

@utility fui-tag-group {
  --tw-sort: container-type;
  gap: var(--fui-tag-group-gap);
  display: var(--fui-tag-group-display);
  flex-wrap: var(--fui-tag-group-flex-wrap);
  align-items: var(--fui-tag-group-align-items);
}

@utility fui-tag-group-item {
  --tw-sort: container-type;
  background-color: var(--fui-tag-group-item-background-color);
  border: var(--fui-tag-group-item-border);
  border-color: var(--fui-tag-group-item-border-color);
  border-radius: var(--fui-tag-group-item-rounded);
  font-family: var(--fui-tag-group-item-font-family);
  font-size: var(--fui-tag-group-item-font-size);
  line-height: var(--fui-tag-group-item-line-height);
  font-weight: var(--fui-tag-group-item-font-weight);
  letter-spacing: var(--fui-tag-group-item-letter-spacing);
  font-feature-settings: var(--fui-tag-group-item-font-feature-settings);
  font-variation-settings: var(--fui-tag-group-item-font-variation-settings);
  height: var(--fui-tag-group-item-height);
  padding-inline: var(--fui-tag-group-item-padding-x);
  gap: var(--fui-tag-group-item-gap);
  display: var(--fui-tag-group-item-display);
  flex-shrink: var(--fui-tag-group-item-flex-shrink);
  align-items: var(--fui-tag-group-item-align-items);
  &:hover {
    background-color: var(--fui-tag-group-item-hover-background-color);
  }
  &:is([data-state=checked],[data-state=indeterminate],[data-state=on],[aria-checked=true],[aria-checked=mixed],[aria-pressed=true]) {
    background-color: var(--fui-tag-group-item-checked-background-color);
    color: var(--fui-tag-group-item-checked-text-color);
    border-color: var(--fui-tag-group-item-checked-border-color);
  }
}

@utility fui-tag-group-item-delete {
  --tw-sort: container-type;
  margin-inline-end: var(--fui-tag-group-item-delete-bleed-end);
  opacity: var(--fui-tag-group-item-delete-opacity);
  width: var(--fui-tag-group-item-delete-size);
  height: var(--fui-tag-group-item-delete-size);
  display: var(--fui-tag-group-item-delete-display);
  flex-shrink: var(--fui-tag-group-item-delete-flex-shrink);
  align-items: var(--fui-tag-group-item-delete-align-items);
  justify-content: var(--fui-tag-group-item-delete-justify-content);
  &:hover {
    opacity: var(--fui-tag-group-item-delete-hover-opacity);
  }
}

@utility fui-search-input {
  --tw-sort: container-type;
  border: var(--fui-search-input-border);
  border-color: var(--fui-search-input-border-color);
  box-shadow: var(--fui-search-input-shadow);
  border-radius: var(--fui-search-input-rounded);
  font-family: var(--fui-search-input-font-family);
  font-size: var(--fui-search-input-font-size);
  line-height: var(--fui-search-input-line-height);
  font-weight: var(--fui-search-input-font-weight);
  letter-spacing: var(--fui-search-input-letter-spacing);
  font-feature-settings: var(--fui-search-input-font-feature-settings);
  font-variation-settings: var(--fui-search-input-font-variation-settings);
  background-color: var(--fui-search-input-background-color);
  height: var(--fui-search-input-height);
  padding-inline: var(--fui-search-input-padding-x);
  gap: var(--fui-search-input-gap);
  display: var(--fui-search-input-display);
  min-width: var(--fui-search-input-min-width);
  flex: var(--fui-search-input-flex);
  align-items: var(--fui-search-input-align-items);
  &:has(:focus-visible) {
    outline: var(--fui-search-input-focus-within-outline);
    outline-offset: var(--fui-search-input-focus-within-outline-offset);
    border-color: var(--fui-search-input-focus-within-border-color);
    outline-color: var(--fui-search-input-focus-within-outline-color);
  }
  & :where([data-icon]) {
    width: var(--fui-search-input-icon-size);
    height: var(--fui-search-input-icon-size);
  }
}

@utility fui-search-input-clear {
  --tw-sort: container-type;
  opacity: var(--fui-search-input-clear-opacity);
  width: var(--fui-search-input-clear-size);
  height: var(--fui-search-input-clear-size);
  &:hover {
    opacity: var(--fui-search-input-clear-hover-opacity);
  }
}

@utility fui-search-cancel {
  --tw-sort: container-type;
  font-family: var(--fui-search-cancel-font-family);
  font-size: var(--fui-search-cancel-font-size);
  line-height: var(--fui-search-cancel-line-height);
  font-weight: var(--fui-search-cancel-font-weight);
  letter-spacing: var(--fui-search-cancel-letter-spacing);
  font-feature-settings: var(--fui-search-cancel-font-feature-settings);
  font-variation-settings: var(--fui-search-cancel-font-variation-settings);
}

@utility fui-search-results {
  --tw-sort: container-type;
  display: var(--fui-search-results-display);
  flex-direction: var(--fui-search-results-flex-direction);
}

@utility fui-search-results-popper {
  --tw-sort: pointer-events;
  outline: var(--fui-search-results-popper-outline);
  outline-offset: var(--fui-search-results-popper-outline-offset);
  background-color: var(--fui-search-results-popper-background-color);
  color: var(--fui-search-results-popper-text-color);
  outline-color: var(--fui-search-results-popper-outline-color);
  border-radius: var(--fui-search-results-popper-rounded);
  box-shadow: var(--fui-search-results-popper-shadow);
}

@utility fui-search-results-inline {
  --tw-sort: pointer-events;
  --fui_empty: initial;
}

@utility fui-search-results-viewport {
  --tw-sort: container-type;
  scrollbar-width: var(--fui-search-results-viewport-scrollbar);
  padding-block: var(--fui-search-results-viewport-padding-y);
  &::-webkit-scrollbar {
    display: var(--fui-search-results-viewport-scrollbar);
  }
}

@utility fui-search-group {
  --tw-sort: container-type;
  padding-block: var(--fui-search-group-padding-y);
  display: var(--fui-search-group-display);
  flex-direction: var(--fui-search-group-flex-direction);
}

@utility fui-search-group-heading {
  --tw-sort: container-type;
  color: var(--fui-search-group-heading-text-color);
  font-family: var(--fui-search-group-heading-font-family);
  font-size: var(--fui-search-group-heading-font-size);
  line-height: var(--fui-search-group-heading-line-height);
  font-weight: var(--fui-search-group-heading-font-weight);
  letter-spacing: var(--fui-search-group-heading-letter-spacing);
  font-feature-settings: var(--fui-search-group-heading-font-feature-settings);
  font-variation-settings: var(--fui-search-group-heading-font-variation-settings);
  text-transform: var(--fui-search-group-heading-text-transform);
  padding-inline: var(--fui-search-group-heading-padding-x);
  padding-block: var(--fui-search-group-heading-padding-y);
}

@utility fui-search-item {
  --tw-sort: container-type;
  border-radius: var(--fui-search-item-rounded);
  font-family: var(--fui-search-item-font-family);
  font-size: var(--fui-search-item-font-size);
  line-height: var(--fui-search-item-line-height);
  font-weight: var(--fui-search-item-font-weight);
  letter-spacing: var(--fui-search-item-letter-spacing);
  font-feature-settings: var(--fui-search-item-font-feature-settings);
  font-variation-settings: var(--fui-search-item-font-variation-settings);
  gap: var(--fui-search-item-gap);
  padding-inline: var(--fui-search-item-padding-x);
  padding-block: var(--fui-search-item-padding-y);
  display: var(--fui-search-item-display);
  align-items: var(--fui-search-item-align-items);
  &[data-highlighted] {
    background-color: var(--fui-search-item-highlighted-background-color);
    color: var(--fui-search-item-highlighted-text-color);
  }
  & :where([data-icon]) {
    width: var(--fui-search-item-icon-size);
    height: var(--fui-search-item-icon-size);
  }
}

@utility fui-search-tag {
  --tw-sort: container-type;
  background-color: var(--fui-search-tag-background-color);
  border: var(--fui-search-tag-border);
  border-color: var(--fui-search-tag-border-color);
  border-radius: var(--fui-search-tag-rounded);
  font-family: var(--fui-search-tag-font-family);
  font-size: var(--fui-search-tag-font-size);
  line-height: var(--fui-search-tag-line-height);
  font-weight: var(--fui-search-tag-font-weight);
  letter-spacing: var(--fui-search-tag-letter-spacing);
  font-feature-settings: var(--fui-search-tag-font-feature-settings);
  font-variation-settings: var(--fui-search-tag-font-variation-settings);
  height: var(--fui-search-tag-height);
  padding-inline: var(--fui-search-tag-padding-x);
  display: var(--fui-search-tag-display);
  flex-shrink: var(--fui-search-tag-flex-shrink);
  align-items: var(--fui-search-tag-align-items);
  &:hover {
    background-color: var(--fui-search-tag-hover-background-color);
  }
  &[data-highlighted] {
    background-color: var(--fui-search-tag-highlighted-background-color);
    border-color: var(--fui-search-tag-highlighted-border-color);
  }
}

@utility fui-search-query {
  --tw-sort: container-type;
  border-radius: var(--fui-search-query-rounded);
  font-family: var(--fui-search-query-font-family);
  font-size: var(--fui-search-query-font-size);
  line-height: var(--fui-search-query-line-height);
  font-weight: var(--fui-search-query-font-weight);
  letter-spacing: var(--fui-search-query-letter-spacing);
  font-feature-settings: var(--fui-search-query-font-feature-settings);
  font-variation-settings: var(--fui-search-query-font-variation-settings);
  gap: var(--fui-search-query-gap);
  padding-inline: var(--fui-search-query-padding-x);
  padding-block: var(--fui-search-query-padding-y);
  display: var(--fui-search-query-display);
  align-items: var(--fui-search-query-align-items);
  &[data-highlighted] {
    background-color: var(--fui-search-query-highlighted-background-color);
    color: var(--fui-search-query-highlighted-text-color);
  }
  & :where([data-icon]) {
    width: var(--fui-search-query-icon-size);
    height: var(--fui-search-query-icon-size);
  }
}

@utility fui-search-query-term {
  --tw-sort: container-type;
  font-weight: var(--fui-search-query-term-font-weight);
}

@utility fui-search-empty {
  --tw-sort: container-type;
  font-family: var(--fui-search-empty-font-family);
  font-size: var(--fui-search-empty-font-size);
  line-height: var(--fui-search-empty-line-height);
  font-weight: var(--fui-search-empty-font-weight);
  letter-spacing: var(--fui-search-empty-letter-spacing);
  font-feature-settings: var(--fui-search-empty-font-feature-settings);
  font-variation-settings: var(--fui-search-empty-font-variation-settings);
  color: var(--fui-search-empty-text-color);
  padding-inline: var(--fui-search-empty-padding-x);
  padding-block: var(--fui-search-empty-padding-y);
}

@utility fui-search-loading {
  --tw-sort: container-type;
  gap: var(--fui-search-loading-gap);
  padding-inline: var(--fui-search-loading-padding-x);
  padding-block: var(--fui-search-loading-padding-y);
  display: var(--fui-search-loading-display);
  flex-direction: var(--fui-search-loading-flex-direction);
}

@utility fui-search-loading-row {
  --tw-sort: container-type;
  gap: var(--fui-search-loading-row-gap);
}

@utility fui-search-loading-label {
  --tw-sort: container-type;
  font-family: var(--fui-search-loading-label-font-family);
  font-size: var(--fui-search-loading-label-font-size);
  line-height: var(--fui-search-loading-label-line-height);
  font-weight: var(--fui-search-loading-label-font-weight);
  letter-spacing: var(--fui-search-loading-label-letter-spacing);
  font-feature-settings: var(--fui-search-loading-label-font-feature-settings);
  font-variation-settings: var(--fui-search-loading-label-font-variation-settings);
  color: var(--fui-search-loading-label-text-color);
}

@utility fui-search-highlight {
  --tw-sort: container-type;
  background-color: var(--fui-search-highlight-background-color);
  font-weight: var(--fui-search-highlight-font-weight);
}

@utility fui-search-overlay {
  --tw-sort: container-type;
  outline: var(--fui-search-overlay-outline);
  outline-offset: var(--fui-search-overlay-outline-offset);
  background-color: var(--fui-search-overlay-background-color);
  outline-color: var(--fui-search-overlay-outline-color);
  border-radius: var(--fui-search-overlay-rounded);
  box-shadow: var(--fui-search-overlay-shadow);
  font-family: var(--fui-search-overlay-font-family);
  font-size: var(--fui-search-overlay-font-size);
  line-height: var(--fui-search-overlay-line-height);
  font-weight: var(--fui-search-overlay-font-weight);
  letter-spacing: var(--fui-search-overlay-letter-spacing);
  font-feature-settings: var(--fui-search-overlay-font-feature-settings);
  font-variation-settings: var(--fui-search-overlay-font-variation-settings);
  gap: var(--fui-search-overlay-gap);
  padding: var(--fui-search-overlay-padding);
  display: var(--fui-search-overlay-display);
  flex-direction: var(--fui-search-overlay-flex-direction);
}

@utility fui-search-overlay-backdrop {
  --tw-sort: container-type;
  background-color: var(--fui-search-overlay-backdrop-background-color);
}

@utility fui-date-field {
  --tw-sort: container-type;
  background-color: var(--fui-date-field-background-color);
  border: var(--fui-date-field-border);
  border-color: var(--fui-date-field-border-color);
  border-bottom-color: var(--fui-date-field-border-bottom-color);
  border-radius: var(--fui-date-field-rounded);
  font-family: var(--fui-date-field-font-family);
  font-size: var(--fui-date-field-font-size);
  line-height: var(--fui-date-field-line-height);
  font-weight: var(--fui-date-field-font-weight);
  letter-spacing: var(--fui-date-field-letter-spacing);
  font-feature-settings: var(--fui-date-field-font-feature-settings);
  font-variation-settings: var(--fui-date-field-font-variation-settings);
  height: var(--fui-date-field-height);
  display: var(--fui-date-field-display);
  width: var(--fui-date-field-width);
  min-width: var(--fui-date-field-min-width);
  align-items: var(--fui-date-field-align-items);
  &::placeholder {
    color: var(--fui-date-field-placeholder-color);
  }
  &:focus-visible {
    border-bottom: var(--fui-date-field-focus-border-bottom);
  }
  &:has(:focus-visible) {
    border-bottom-color: var(--fui-date-field-focus-within-border-bottom-color);
  }
  &:is([aria-invalid=true],[data-invalid]) {
    border-bottom-color: var(--fui-date-field-invalid-border-bottom-color);
  }
}

@utility fui-date-field-segment {
  --tw-sort: container-type;
  border-radius: var(--fui-date-field-segment-rounded);
  padding-inline: var(--fui-date-field-segment-padding-x);
  &:focus-visible {
    background-color: var(--fui-date-field-segment-focus-background-color);
    color: var(--fui-date-field-segment-focus-text-color);
  }
  &[data-placeholder] {
    color: var(--fui-date-field-segment-placeholder-shown-text-color);
  }
}

@utility fui-date-field-literal {
  --tw-sort: container-type;
  color: var(--fui-date-field-literal-text-color);
}

@utility fui-date-picker-content {
  --tw-sort: container-type;
  padding: var(--fui-date-picker-content-padding);
  width: var(--fui-date-picker-content-width);
}

@utility fui-date-picker-trigger {
  --tw-sort: container-type;
  margin-inline-end: var(--fui-date-picker-trigger-bleed-end);
  color: var(--fui-date-picker-trigger-text-color);
  border-radius: var(--fui-date-picker-trigger-rounded);
  padding: var(--fui-date-picker-trigger-padding);
  margin-inline-start: var(--fui-date-picker-trigger-margin-start);
  display: var(--fui-date-picker-trigger-display);
  flex-shrink: var(--fui-date-picker-trigger-flex-shrink);
  align-items: var(--fui-date-picker-trigger-align-items);
  justify-content: var(--fui-date-picker-trigger-justify-content);
  &:hover {
    color: var(--fui-date-picker-trigger-hover-text-color);
  }
  & :where([data-icon]) {
    width: var(--fui-date-picker-trigger-icon-size);
    height: var(--fui-date-picker-trigger-icon-size);
  }
}

@utility fui-date-range-picker-separator {
  --tw-sort: container-type;
  color: var(--fui-date-range-picker-separator-text-color);
  padding-inline: var(--fui-date-range-picker-separator-padding-x);
}

@utility fui-payment-card-brands {
  --tw-sort: container-type;
  gap: var(--fui-payment-card-brands-gap);
  display: var(--fui-payment-card-brands-display);
  align-items: var(--fui-payment-card-brands-align-items);
}

@utility fui-payment-card-brand {
  --tw-sort: container-type;
  height: var(--fui-payment-card-brand-height);
  border: var(--fui-payment-card-brand-border);
  border-color: var(--fui-payment-card-brand-border-color);
  border-radius: var(--fui-payment-card-brand-rounded);
}

@utility fui-input-group {
  --tw-sort: container-type;
  background-color: var(--fui-input-group-background-color);
  border: var(--fui-input-group-border);
  border-color: var(--fui-input-group-border-color);
  border-bottom-color: var(--fui-input-group-border-bottom-color);
  border-radius: var(--fui-input-group-rounded);
  font-family: var(--fui-input-group-font-family);
  font-size: var(--fui-input-group-font-size);
  line-height: var(--fui-input-group-line-height);
  font-weight: var(--fui-input-group-font-weight);
  letter-spacing: var(--fui-input-group-letter-spacing);
  font-feature-settings: var(--fui-input-group-font-feature-settings);
  font-variation-settings: var(--fui-input-group-font-variation-settings);
  height: var(--fui-input-group-height);
  display: var(--fui-input-group-display);
  width: var(--fui-input-group-width);
  min-width: var(--fui-input-group-min-width);
  align-items: var(--fui-input-group-align-items);
  &::placeholder {
    color: var(--fui-input-group-placeholder-color);
  }
  &:focus-visible {
    border-bottom: var(--fui-input-group-focus-border-bottom);
  }
  &:has(:focus-visible) {
    border-bottom: var(--fui-input-group-focus-within-border-bottom);
  }
  &:has([aria-invalid=true]) {
    border-bottom-color: var(--fui-input-group-invalid-within-border-bottom-color);
  }
  &:is([aria-invalid=true],[data-invalid]) {
    border-bottom-color: var(--fui-input-group-invalid-border-bottom-color);
  }
}

@utility fui-input-group-md {
  --tw-sort: pointer-events;
  --fui_empty: initial;
}

@utility fui-input-group-sm {
  --tw-sort: pointer-events;
  height: var(--fui-input-group-sm-height);
}

@utility fui-input-group-addon {
  --tw-sort: container-type;
  color: var(--fui-input-group-addon-text-color);
  font-family: var(--fui-input-group-addon-font-family);
  font-size: var(--fui-input-group-addon-font-size);
  line-height: var(--fui-input-group-addon-line-height);
  font-weight: var(--fui-input-group-addon-font-weight);
  letter-spacing: var(--fui-input-group-addon-letter-spacing);
  font-feature-settings: var(--fui-input-group-addon-font-feature-settings);
  font-variation-settings: var(--fui-input-group-addon-font-variation-settings);
  gap: var(--fui-input-group-addon-gap);
  padding-block: var(--fui-input-group-addon-padding-y);
  display: var(--fui-input-group-addon-display);
  height: var(--fui-input-group-addon-height);
  align-items: var(--fui-input-group-addon-align-items);
  justify-content: var(--fui-input-group-addon-justify-content);
  & :where([data-icon]) {
    width: var(--fui-input-group-addon-icon-size);
    height: var(--fui-input-group-addon-icon-size);
  }
}

@utility fui-input-group-addon-inline-start {
  --tw-sort: pointer-events;
  --fui_empty: initial;
}

@utility fui-input-group-addon-inline-end {
  --tw-sort: pointer-events;
  --fui_empty: initial;
}

@utility fui-input-group-addon-block-start {
  --tw-sort: pointer-events;
  padding-top: var(--fui-input-group-addon-block-start-padding-top);
}

@utility fui-input-group-addon-block-end {
  --tw-sort: pointer-events;
  padding-bottom: var(--fui-input-group-addon-block-end-padding-bottom);
}

@utility fui-input-group-text {
  --tw-sort: container-type;
  color: var(--fui-input-group-text-text-color);
  font-family: var(--fui-input-group-text-font-family);
  font-size: var(--fui-input-group-text-font-size);
  line-height: var(--fui-input-group-text-line-height);
  font-weight: var(--fui-input-group-text-font-weight);
  letter-spacing: var(--fui-input-group-text-letter-spacing);
  font-feature-settings: var(--fui-input-group-text-font-feature-settings);
  font-variation-settings: var(--fui-input-group-text-font-variation-settings);
  gap: var(--fui-input-group-text-gap);
  display: var(--fui-input-group-text-display);
  align-items: var(--fui-input-group-text-align-items);
  & :where([data-icon]) {
    width: var(--fui-input-group-text-icon-size);
    height: var(--fui-input-group-text-icon-size);
  }
}

@utility fui-input-group-button {
  --tw-sort: container-type;
  gap: var(--fui-input-group-button-gap);
  font-family: var(--fui-input-group-button-font-family);
  font-size: var(--fui-input-group-button-font-size);
  line-height: var(--fui-input-group-button-line-height);
  font-weight: var(--fui-input-group-button-font-weight);
  letter-spacing: var(--fui-input-group-button-letter-spacing);
  font-feature-settings: var(--fui-input-group-button-font-feature-settings);
  font-variation-settings: var(--fui-input-group-button-font-variation-settings);
  display: var(--fui-input-group-button-display);
  align-items: var(--fui-input-group-button-align-items);
  & :where([data-icon]) {
    width: var(--fui-input-group-button-icon-size);
    height: var(--fui-input-group-button-icon-size);
  }
  &:has([data-icon=inline-start]) {
    padding-inline-start: var(--fui-input-group-button-icon-start-padding-start);
  }
  &:has([data-icon=inline-end]) {
    padding-inline-end: var(--fui-input-group-button-icon-end-padding-end);
  }
}

@utility fui-input-group-button-xs {
  --tw-sort: pointer-events;
  height: var(--fui-input-group-button-xs-height);
  gap: var(--fui-input-group-button-xs-gap);
  padding-inline: var(--fui-input-group-button-xs-padding-x);
  font-family: var(--fui-input-group-button-xs-font-family);
  font-size: var(--fui-input-group-button-xs-font-size);
  line-height: var(--fui-input-group-button-xs-line-height);
  font-weight: var(--fui-input-group-button-xs-font-weight);
  letter-spacing: var(--fui-input-group-button-xs-letter-spacing);
  font-feature-settings: var(--fui-input-group-button-xs-font-feature-settings);
  font-variation-settings: var(--fui-input-group-button-xs-font-variation-settings);
}

@utility fui-input-group-button-sm {
  --tw-sort: pointer-events;
  height: var(--fui-input-group-button-sm-height);
  padding-inline: var(--fui-input-group-button-sm-padding-x);
}

@utility fui-input-group-button-icon-xs {
  --tw-sort: pointer-events;
  width: var(--fui-input-group-button-icon-xs-size);
  height: var(--fui-input-group-button-icon-xs-size);
  padding: var(--fui-input-group-button-icon-xs-padding);
  font-family: var(--fui-input-group-button-icon-xs-font-family);
  font-size: var(--fui-input-group-button-icon-xs-font-size);
  line-height: var(--fui-input-group-button-icon-xs-line-height);
  font-weight: var(--fui-input-group-button-icon-xs-font-weight);
  letter-spacing: var(--fui-input-group-button-icon-xs-letter-spacing);
  font-feature-settings: var(--fui-input-group-button-icon-xs-font-feature-settings);
  font-variation-settings: var(--fui-input-group-button-icon-xs-font-variation-settings);
  &:has([data-icon=inline-start]) {
    padding-inline-start: var(--fui-input-group-button-icon-xs-icon-start-padding-start);
  }
  &:has([data-icon=inline-end]) {
    padding-inline-end: var(--fui-input-group-button-icon-xs-icon-end-padding-end);
  }
}

@utility fui-input-group-button-icon-sm {
  --tw-sort: pointer-events;
  width: var(--fui-input-group-button-icon-sm-size);
  height: var(--fui-input-group-button-icon-sm-size);
  padding: var(--fui-input-group-button-icon-sm-padding);
  &:has([data-icon=inline-start]) {
    padding-inline-start: var(--fui-input-group-button-icon-sm-icon-start-padding-start);
  }
  &:has([data-icon=inline-end]) {
    padding-inline-end: var(--fui-input-group-button-icon-sm-icon-end-padding-end);
  }
}

@utility fui-input-group-input {
  --tw-sort: container-type;
  flex: var(--fui-input-group-input-flex);
}

@utility fui-input-group-textarea {
  --tw-sort: container-type;
  flex: var(--fui-input-group-textarea-flex);
  padding-block: var(--fui-input-group-textarea-padding-y);
}

@utility fui-dialog-content {
  --tw-sort: container-type;
  outline: var(--fui-dialog-content-outline);
  outline-offset: var(--fui-dialog-content-outline-offset);
  background-color: var(--fui-dialog-content-background-color);
  outline-color: var(--fui-dialog-content-outline-color);
  border-radius: var(--fui-dialog-content-rounded);
  box-shadow: var(--fui-dialog-content-shadow);
  font-family: var(--fui-dialog-content-font-family);
  font-size: var(--fui-dialog-content-font-size);
  line-height: var(--fui-dialog-content-line-height);
  font-weight: var(--fui-dialog-content-font-weight);
  letter-spacing: var(--fui-dialog-content-letter-spacing);
  font-feature-settings: var(--fui-dialog-content-font-feature-settings);
  font-variation-settings: var(--fui-dialog-content-font-variation-settings);
  padding-block: var(--fui-dialog-content-padding-y);
  gap: var(--fui-dialog-content-gap);
  padding-inline: var(--fui-dialog-content-padding-x);
  width: var(--fui-dialog-content-width);
  @container (width >= 28rem) {
    padding-block: var(--fui-dialog-content-md-padding-y);
    padding-inline: var(--fui-dialog-content-md-padding-x);
  }
}

@utility fui-dialog-content-fill {
  --tw-sort: pointer-events;
  display: var(--fui-dialog-content-fill-display);
  flex-direction: var(--fui-dialog-content-fill-flex-direction);
}

@utility fui-dialog-content-scroll {
  --tw-sort: pointer-events;
  display: var(--fui-dialog-content-scroll-display);
  max-width: var(--fui-dialog-content-scroll-max-width);
}

@utility fui-dialog-body {
  --tw-sort: container-type;
  min-height: var(--fui-dialog-body-min-height);
  margin-inline: var(--fui-dialog-body-bleed-x);
  padding-inline: var(--fui-dialog-body-padding-x);
  margin-block: var(--fui-dialog-body-bleed-y);
  padding-block: var(--fui-dialog-body-padding-y);
  @container (width >= 28rem) {
    margin-inline: var(--fui-dialog-body-md-bleed-x);
    padding-inline: var(--fui-dialog-body-md-padding-x);
  }
}

@utility fui-dialog-title {
  --tw-sort: container-type;
  font-family: var(--fui-dialog-title-font-family);
  font-size: var(--fui-dialog-title-font-size);
  line-height: var(--fui-dialog-title-line-height);
  font-weight: var(--fui-dialog-title-font-weight);
  letter-spacing: var(--fui-dialog-title-letter-spacing);
  font-feature-settings: var(--fui-dialog-title-font-feature-settings);
  font-variation-settings: var(--fui-dialog-title-font-variation-settings);
  text-transform: var(--fui-dialog-title-text-transform);
}

@utility fui-dialog-overlay {
  --tw-sort: container-type;
  background-color: var(--fui-dialog-overlay-background-color);
}

@utility fui-dialog-description {
  --tw-sort: container-type;
  color: var(--fui-dialog-description-text-color);
  font-family: var(--fui-dialog-description-font-family);
  font-size: var(--fui-dialog-description-font-size);
  line-height: var(--fui-dialog-description-line-height);
  font-weight: var(--fui-dialog-description-font-weight);
  letter-spacing: var(--fui-dialog-description-letter-spacing);
  font-feature-settings: var(--fui-dialog-description-font-feature-settings);
  font-variation-settings: var(--fui-dialog-description-font-variation-settings);
  margin-top: var(--fui-dialog-description-margin-top);
  & :where(a) {
    text-decoration-line: var(--fui-dialog-description-link-text-decoration-line);
  }
  & :where(a:hover) {
    color: var(--fui-dialog-description-link-hover-text-color);
  }
}

@utility fui-dialog-footer {
  --tw-sort: container-type;
  display: var(--fui-dialog-footer-display);
  flex-direction: var(--fui-dialog-footer-flex-direction);
  gap: var(--fui-dialog-footer-gap);
  @container (width >= 24rem) {
    flex-direction: var(--fui-dialog-footer-sm-flex-direction);
    justify-content: var(--fui-dialog-footer-sm-justify-content);
  }
}

@utility fui-dialog-header {
  --tw-sort: container-type;
  display: var(--fui-dialog-header-display);
  flex-direction: var(--fui-dialog-header-flex-direction);
  gap: var(--fui-dialog-header-gap);
}

@utility fui-alert-dialog-content {
  --tw-sort: container-type;
  outline: var(--fui-alert-dialog-content-outline);
  outline-offset: var(--fui-alert-dialog-content-outline-offset);
  background-color: var(--fui-alert-dialog-content-background-color);
  outline-color: var(--fui-alert-dialog-content-outline-color);
  border-radius: var(--fui-alert-dialog-content-rounded);
  box-shadow: var(--fui-alert-dialog-content-shadow);
  font-family: var(--fui-alert-dialog-content-font-family);
  font-size: var(--fui-alert-dialog-content-font-size);
  line-height: var(--fui-alert-dialog-content-line-height);
  font-weight: var(--fui-alert-dialog-content-font-weight);
  letter-spacing: var(--fui-alert-dialog-content-letter-spacing);
  font-feature-settings: var(--fui-alert-dialog-content-font-feature-settings);
  font-variation-settings: var(--fui-alert-dialog-content-font-variation-settings);
  padding-block: var(--fui-alert-dialog-content-padding-y);
  gap: var(--fui-alert-dialog-content-gap);
  padding-inline: var(--fui-alert-dialog-content-padding-x);
  margin-inline: var(--fui-alert-dialog-content-margin-x);
  display: var(--fui-alert-dialog-content-display);
  @container (width >= 28rem) {
    padding-block: var(--fui-alert-dialog-content-md-padding-y);
    padding-inline: var(--fui-alert-dialog-content-md-padding-x);
  }
}

@utility fui-alert-dialog-content-md {
  --tw-sort: pointer-events;
  max-width: var(--fui-alert-dialog-content-md-max-width);
  @container (width >= 28rem) {
    max-width: var(--fui-alert-dialog-content-md-md-max-width);
  }
}

@utility fui-alert-dialog-content-sm {
  --tw-sort: pointer-events;
  max-width: var(--fui-alert-dialog-content-sm-max-width);
}

@utility fui-alert-dialog-header {
  --tw-sort: container-type;
  gap: var(--fui-alert-dialog-header-gap);
  display: var(--fui-alert-dialog-header-display);
  place-items: var(--fui-alert-dialog-header-place-items);
  text-align: var(--fui-alert-dialog-header-text-align);
  @container (width >= 24rem) {
    place-items: var(--fui-alert-dialog-header-sm-place-items);
    text-align: var(--fui-alert-dialog-header-sm-text-align);
  }
}

@utility fui-alert-dialog-footer {
  --tw-sort: container-type;
  gap: var(--fui-alert-dialog-footer-gap);
  display: var(--fui-alert-dialog-footer-display);
  flex-direction: var(--fui-alert-dialog-footer-flex-direction);
  @container (width >= 24rem) {
    flex-direction: var(--fui-alert-dialog-footer-sm-flex-direction);
    justify-content: var(--fui-alert-dialog-footer-sm-justify-content);
  }
}

@utility fui-alert-dialog-media {
  --tw-sort: container-type;
  margin-bottom: var(--fui-alert-dialog-media-margin-bottom);
  background-color: var(--fui-alert-dialog-media-background-color);
  border-radius: var(--fui-alert-dialog-media-rounded);
  width: var(--fui-alert-dialog-media-size);
  height: var(--fui-alert-dialog-media-size);
  display: var(--fui-alert-dialog-media-display);
  align-items: var(--fui-alert-dialog-media-align-items);
  justify-content: var(--fui-alert-dialog-media-justify-content);
  & :where([data-icon]) {
    width: var(--fui-alert-dialog-media-icon-size);
    height: var(--fui-alert-dialog-media-icon-size);
  }
  @container (width >= 24rem) {
    grid-row: var(--fui-alert-dialog-media-sm-grid-row);
  }
}

@utility fui-alert-dialog-overlay {
  --tw-sort: container-type;
  background-color: var(--fui-alert-dialog-overlay-background-color);
}

@utility fui-alert-dialog-title {
  --tw-sort: container-type;
  font-family: var(--fui-alert-dialog-title-font-family);
  font-size: var(--fui-alert-dialog-title-font-size);
  line-height: var(--fui-alert-dialog-title-line-height);
  font-weight: var(--fui-alert-dialog-title-font-weight);
  letter-spacing: var(--fui-alert-dialog-title-letter-spacing);
  font-feature-settings: var(--fui-alert-dialog-title-font-feature-settings);
  font-variation-settings: var(--fui-alert-dialog-title-font-variation-settings);
  text-transform: var(--fui-alert-dialog-title-text-transform);
}

@utility fui-alert-dialog-description {
  --tw-sort: container-type;
  color: var(--fui-alert-dialog-description-text-color);
  font-family: var(--fui-alert-dialog-description-font-family);
  font-size: var(--fui-alert-dialog-description-font-size);
  line-height: var(--fui-alert-dialog-description-line-height);
  font-weight: var(--fui-alert-dialog-description-font-weight);
  letter-spacing: var(--fui-alert-dialog-description-letter-spacing);
  font-feature-settings: var(--fui-alert-dialog-description-font-feature-settings);
  font-variation-settings: var(--fui-alert-dialog-description-font-variation-settings);
  margin-top: var(--fui-alert-dialog-description-margin-top);
  & :where(a) {
    text-decoration-line: var(--fui-alert-dialog-description-link-text-decoration-line);
  }
  & :where(a:hover) {
    color: var(--fui-alert-dialog-description-link-hover-text-color);
  }
}

@utility fui-sheet-content {
  --tw-sort: container-type;
  background-color: var(--fui-sheet-content-background-color);
  box-shadow: var(--fui-sheet-content-shadow);
  font-family: var(--fui-sheet-content-font-family);
  font-size: var(--fui-sheet-content-font-size);
  line-height: var(--fui-sheet-content-line-height);
  font-weight: var(--fui-sheet-content-font-weight);
  letter-spacing: var(--fui-sheet-content-letter-spacing);
  font-feature-settings: var(--fui-sheet-content-font-feature-settings);
  font-variation-settings: var(--fui-sheet-content-font-variation-settings);
  display: var(--fui-sheet-content-display);
  flex-direction: var(--fui-sheet-content-flex-direction);
}

@utility fui-sheet-content-top {
  --tw-sort: pointer-events;
  border-bottom: var(--fui-sheet-content-top-border-bottom);
}

@utility fui-sheet-content-right {
  --tw-sort: pointer-events;
  border-left: var(--fui-sheet-content-right-border-left);
  width: var(--fui-sheet-content-right-width);
}

@utility fui-sheet-content-bottom {
  --tw-sort: pointer-events;
  border-top: var(--fui-sheet-content-bottom-border-top);
}

@utility fui-sheet-content-left {
  --tw-sort: pointer-events;
  border-right: var(--fui-sheet-content-left-border-right);
  width: var(--fui-sheet-content-left-width);
}

@utility fui-sheet-body {
  --tw-sort: container-type;
  min-height: var(--fui-sheet-body-min-height);
  padding-inline: var(--fui-sheet-body-padding-x);
}

@utility fui-sheet-overlay {
  --tw-sort: container-type;
  background-color: var(--fui-sheet-overlay-background-color);
}

@utility fui-sheet-title {
  --tw-sort: container-type;
  font-family: var(--fui-sheet-title-font-family);
  font-size: var(--fui-sheet-title-font-size);
  line-height: var(--fui-sheet-title-line-height);
  font-weight: var(--fui-sheet-title-font-weight);
  letter-spacing: var(--fui-sheet-title-letter-spacing);
  font-feature-settings: var(--fui-sheet-title-font-feature-settings);
  font-variation-settings: var(--fui-sheet-title-font-variation-settings);
  text-transform: var(--fui-sheet-title-text-transform);
}

@utility fui-sheet-description {
  --tw-sort: container-type;
  color: var(--fui-sheet-description-text-color);
  font-family: var(--fui-sheet-description-font-family);
  font-size: var(--fui-sheet-description-font-size);
  line-height: var(--fui-sheet-description-line-height);
  font-weight: var(--fui-sheet-description-font-weight);
  letter-spacing: var(--fui-sheet-description-letter-spacing);
  font-feature-settings: var(--fui-sheet-description-font-feature-settings);
  font-variation-settings: var(--fui-sheet-description-font-variation-settings);
  margin-top: var(--fui-sheet-description-margin-top);
}

@utility fui-sheet-footer {
  --tw-sort: container-type;
  margin-top: var(--fui-sheet-footer-margin-top);
  display: var(--fui-sheet-footer-display);
  flex-direction: var(--fui-sheet-footer-flex-direction);
  gap: var(--fui-sheet-footer-gap);
  padding: var(--fui-sheet-footer-padding);
}

@utility fui-sheet-header {
  --tw-sort: container-type;
  display: var(--fui-sheet-header-display);
  flex-direction: var(--fui-sheet-header-flex-direction);
  gap: var(--fui-sheet-header-gap);
  padding: var(--fui-sheet-header-padding);
}

@utility fui-drawer-content {
  --tw-sort: container-type;
  background-color: var(--fui-drawer-content-background-color);
  font-family: var(--fui-drawer-content-font-family);
  font-size: var(--fui-drawer-content-font-size);
  line-height: var(--fui-drawer-content-line-height);
  font-weight: var(--fui-drawer-content-font-weight);
  letter-spacing: var(--fui-drawer-content-letter-spacing);
  font-feature-settings: var(--fui-drawer-content-font-feature-settings);
  font-variation-settings: var(--fui-drawer-content-font-variation-settings);
  box-shadow: var(--fui-drawer-content-shadow);
  display: var(--fui-drawer-content-display);
  height: var(--fui-drawer-content-height);
  flex-direction: var(--fui-drawer-content-flex-direction);
}

@utility fui-drawer-content-down {
  --tw-sort: pointer-events;
  border-top: var(--fui-drawer-content-down-border-top);
}

@utility fui-drawer-content-up {
  --tw-sort: pointer-events;
  border-bottom: var(--fui-drawer-content-up-border-bottom);
}

@utility fui-drawer-content-left {
  --tw-sort: pointer-events;
  border-right: var(--fui-drawer-content-left-border-right);
  width: var(--fui-drawer-content-left-width);
}

@utility fui-drawer-content-right {
  --tw-sort: pointer-events;
  border-left: var(--fui-drawer-content-right-border-left);
  width: var(--fui-drawer-content-right-width);
}

@utility fui-drawer-body {
  --tw-sort: container-type;
  min-height: var(--fui-drawer-body-min-height);
  padding-inline: var(--fui-drawer-body-padding-x);
}

@utility fui-drawer-handle {
  --tw-sort: container-type;
  margin-top: var(--fui-drawer-handle-margin-top);
  background-color: var(--fui-drawer-handle-background-color);
  border-radius: var(--fui-drawer-handle-rounded);
  height: var(--fui-drawer-handle-height);
  width: var(--fui-drawer-handle-width);
}

@utility fui-drawer-overlay {
  --tw-sort: container-type;
  background-color: var(--fui-drawer-overlay-background-color);
}

@utility fui-drawer-title {
  --tw-sort: container-type;
  font-family: var(--fui-drawer-title-font-family);
  font-size: var(--fui-drawer-title-font-size);
  line-height: var(--fui-drawer-title-line-height);
  font-weight: var(--fui-drawer-title-font-weight);
  letter-spacing: var(--fui-drawer-title-letter-spacing);
  font-feature-settings: var(--fui-drawer-title-font-feature-settings);
  font-variation-settings: var(--fui-drawer-title-font-variation-settings);
  text-transform: var(--fui-drawer-title-text-transform);
}

@utility fui-drawer-description {
  --tw-sort: container-type;
  color: var(--fui-drawer-description-text-color);
  font-family: var(--fui-drawer-description-font-family);
  font-size: var(--fui-drawer-description-font-size);
  line-height: var(--fui-drawer-description-line-height);
  font-weight: var(--fui-drawer-description-font-weight);
  letter-spacing: var(--fui-drawer-description-letter-spacing);
  font-feature-settings: var(--fui-drawer-description-font-feature-settings);
  font-variation-settings: var(--fui-drawer-description-font-variation-settings);
  margin-top: var(--fui-drawer-description-margin-top);
}

@utility fui-drawer-footer {
  --tw-sort: container-type;
  margin-top: var(--fui-drawer-footer-margin-top);
  display: var(--fui-drawer-footer-display);
  flex-direction: var(--fui-drawer-footer-flex-direction);
  gap: var(--fui-drawer-footer-gap);
  padding: var(--fui-drawer-footer-padding);
}

@utility fui-drawer-header {
  --tw-sort: container-type;
  display: var(--fui-drawer-header-display);
  flex-direction: var(--fui-drawer-header-flex-direction);
  gap: var(--fui-drawer-header-gap);
  padding: var(--fui-drawer-header-padding);
  @container (width >= 28rem) {
    gap: var(--fui-drawer-header-md-gap);
    text-align: var(--fui-drawer-header-md-text-align);
  }
}

@utility fui-drawer-header-vertical {
  --tw-sort: pointer-events;
  text-align: var(--fui-drawer-header-vertical-text-align);
  @container (width >= 28rem) {
    text-align: var(--fui-drawer-header-vertical-md-text-align);
  }
}

@utility fui-drawer-header-horizontal {
  --tw-sort: pointer-events;
  --fui_empty: initial;
}

@utility fui-popover-content {
  --tw-sort: container-type;
  outline: var(--fui-popover-content-outline);
  outline-offset: var(--fui-popover-content-outline-offset);
  background-color: var(--fui-popover-content-background-color);
  color: var(--fui-popover-content-text-color);
  outline-color: var(--fui-popover-content-outline-color);
  border-radius: var(--fui-popover-content-rounded);
  box-shadow: var(--fui-popover-content-shadow);
  font-family: var(--fui-popover-content-font-family);
  font-size: var(--fui-popover-content-font-size);
  line-height: var(--fui-popover-content-line-height);
  font-weight: var(--fui-popover-content-font-weight);
  letter-spacing: var(--fui-popover-content-letter-spacing);
  font-feature-settings: var(--fui-popover-content-font-feature-settings);
  font-variation-settings: var(--fui-popover-content-font-variation-settings);
  width: var(--fui-popover-content-width);
  padding-inline: var(--fui-popover-content-padding-x);
  padding-block: var(--fui-popover-content-padding-y);
  gap: var(--fui-popover-content-gap);
  max-width: var(--reka-popover-content-available-width);
  display: var(--fui-popover-content-display);
  flex-direction: var(--fui-popover-content-flex-direction);
}

@utility fui-popover-header {
  --tw-sort: container-type;
  font-family: var(--fui-popover-header-font-family);
  font-size: var(--fui-popover-header-font-size);
  line-height: var(--fui-popover-header-line-height);
  font-weight: var(--fui-popover-header-font-weight);
  letter-spacing: var(--fui-popover-header-letter-spacing);
  font-feature-settings: var(--fui-popover-header-font-feature-settings);
  font-variation-settings: var(--fui-popover-header-font-variation-settings);
  gap: var(--fui-popover-header-gap);
  display: var(--fui-popover-header-display);
  flex-direction: var(--fui-popover-header-flex-direction);
}

@utility fui-popover-title {
  --tw-sort: container-type;
  font-family: var(--fui-popover-title-font-family);
  font-size: var(--fui-popover-title-font-size);
  line-height: var(--fui-popover-title-line-height);
  font-weight: var(--fui-popover-title-font-weight);
  letter-spacing: var(--fui-popover-title-letter-spacing);
  font-feature-settings: var(--fui-popover-title-font-feature-settings);
  font-variation-settings: var(--fui-popover-title-font-variation-settings);
  text-transform: var(--fui-popover-title-text-transform);
}

@utility fui-popover-description {
  --tw-sort: container-type;
  color: var(--fui-popover-description-text-color);
  font-family: var(--fui-popover-description-font-family);
  font-size: var(--fui-popover-description-font-size);
  line-height: var(--fui-popover-description-line-height);
  font-weight: var(--fui-popover-description-font-weight);
  letter-spacing: var(--fui-popover-description-letter-spacing);
  font-feature-settings: var(--fui-popover-description-font-feature-settings);
  font-variation-settings: var(--fui-popover-description-font-variation-settings);
}

@utility fui-hover-card-content {
  --tw-sort: container-type;
  outline: var(--fui-hover-card-content-outline);
  outline-offset: var(--fui-hover-card-content-outline-offset);
  background-color: var(--fui-hover-card-content-background-color);
  color: var(--fui-hover-card-content-text-color);
  outline-color: var(--fui-hover-card-content-outline-color);
  border-radius: var(--fui-hover-card-content-rounded);
  box-shadow: var(--fui-hover-card-content-shadow);
  font-family: var(--fui-hover-card-content-font-family);
  font-size: var(--fui-hover-card-content-font-size);
  line-height: var(--fui-hover-card-content-line-height);
  font-weight: var(--fui-hover-card-content-font-weight);
  letter-spacing: var(--fui-hover-card-content-letter-spacing);
  font-feature-settings: var(--fui-hover-card-content-font-feature-settings);
  font-variation-settings: var(--fui-hover-card-content-font-variation-settings);
  width: var(--fui-hover-card-content-width);
  padding-inline: var(--fui-hover-card-content-padding-x);
  padding-block: var(--fui-hover-card-content-padding-y);
}

@utility fui-tooltip-content {
  --tw-sort: container-type;
  background-color: var(--fui-tooltip-content-background-color);
  color: var(--fui-tooltip-content-text-color);
  border-radius: var(--fui-tooltip-content-rounded);
  font-family: var(--fui-tooltip-content-font-family);
  font-size: var(--fui-tooltip-content-font-size);
  line-height: var(--fui-tooltip-content-line-height);
  font-weight: var(--fui-tooltip-content-font-weight);
  letter-spacing: var(--fui-tooltip-content-letter-spacing);
  font-feature-settings: var(--fui-tooltip-content-font-feature-settings);
  font-variation-settings: var(--fui-tooltip-content-font-variation-settings);
  gap: var(--fui-tooltip-content-gap);
  padding-inline: var(--fui-tooltip-content-padding-x);
  padding-block: var(--fui-tooltip-content-padding-y);
  display: var(--fui-tooltip-content-display);
  align-items: var(--fui-tooltip-content-align-items);
  width: var(--fui-tooltip-content-width);
  max-width: var(--fui-tooltip-content-max-width);
}

@utility fui-tooltip-arrow {
  --tw-sort: container-type;
  background-color: var(--fui-tooltip-arrow-background-color);
  fill: var(--fui-tooltip-arrow-fill);
  border-radius: var(--fui-tooltip-arrow-rounded);
  width: var(--fui-tooltip-arrow-size);
  height: var(--fui-tooltip-arrow-size);
}

@utility fui-dropdown-menu-content {
  --tw-sort: container-type;
  outline: var(--fui-dropdown-menu-content-outline);
  outline-offset: var(--fui-dropdown-menu-content-outline-offset);
  background-color: var(--fui-dropdown-menu-content-background-color);
  color: var(--fui-dropdown-menu-content-text-color);
  outline-color: var(--fui-dropdown-menu-content-outline-color);
  border-radius: var(--fui-dropdown-menu-content-rounded);
  box-shadow: var(--fui-dropdown-menu-content-shadow);
  min-width: var(--fui-dropdown-menu-content-min-width);
  padding: var(--fui-dropdown-menu-content-padding);
  width: var(--reka-dropdown-menu-trigger-width);
}

@utility fui-dropdown-menu-sub-content {
  --tw-sort: container-type;
  outline: var(--fui-dropdown-menu-sub-content-outline);
  outline-offset: var(--fui-dropdown-menu-sub-content-outline-offset);
  background-color: var(--fui-dropdown-menu-sub-content-background-color);
  color: var(--fui-dropdown-menu-sub-content-text-color);
  outline-color: var(--fui-dropdown-menu-sub-content-outline-color);
  border-radius: var(--fui-dropdown-menu-sub-content-rounded);
  box-shadow: var(--fui-dropdown-menu-sub-content-shadow);
  min-width: var(--fui-dropdown-menu-sub-content-min-width);
  padding: var(--fui-dropdown-menu-sub-content-padding);
  max-width: var(--reka-dropdown-menu-content-available-width);
}

@utility fui-dropdown-menu-item {
  --tw-sort: container-type;
  border-radius: var(--fui-dropdown-menu-item-rounded);
  font-family: var(--fui-dropdown-menu-item-font-family);
  font-size: var(--fui-dropdown-menu-item-font-size);
  line-height: var(--fui-dropdown-menu-item-line-height);
  font-weight: var(--fui-dropdown-menu-item-font-weight);
  letter-spacing: var(--fui-dropdown-menu-item-letter-spacing);
  font-feature-settings: var(--fui-dropdown-menu-item-font-feature-settings);
  font-variation-settings: var(--fui-dropdown-menu-item-font-variation-settings);
  gap: var(--fui-dropdown-menu-item-gap);
  padding-block: var(--fui-dropdown-menu-item-padding-y);
  display: var(--fui-dropdown-menu-item-display);
  align-items: var(--fui-dropdown-menu-item-align-items);
  &:focus-visible {
    background-color: var(--fui-dropdown-menu-item-focus-background-color);
    color: var(--fui-dropdown-menu-item-focus-text-color);
  }
  & :where([data-icon]) {
    width: var(--fui-dropdown-menu-item-icon-size);
    height: var(--fui-dropdown-menu-item-icon-size);
  }
}

@utility fui-dropdown-menu-item-destructive {
  --tw-sort: pointer-events;
  color: var(--fui-dropdown-menu-item-destructive-text-color);
  & svg {
    color: var(--fui-dropdown-menu-item-destructive-icon-color);
  }
  &:focus-visible {
    background-color: var(--fui-dropdown-menu-item-destructive-focus-background-color);
    color: var(--fui-dropdown-menu-item-destructive-focus-text-color);
  }
}

@utility fui-dropdown-menu-item-default {
  --tw-sort: pointer-events;
  padding-inline: var(--fui-dropdown-menu-item-default-padding-x);
}

@utility fui-dropdown-menu-item-inset {
  --tw-sort: pointer-events;
  padding-inline-start: var(--fui-dropdown-menu-item-inset-padding-start);
  padding-inline-end: var(--fui-dropdown-menu-item-inset-padding-end);
}

@utility fui-dropdown-menu-item-indicator {
  --tw-sort: pointer-events;
  padding-inline-start: var(--fui-dropdown-menu-item-indicator-padding-start);
  padding-inline-end: var(--fui-dropdown-menu-item-indicator-padding-end);
}

@utility fui-dropdown-menu-sub-trigger {
  --tw-sort: container-type;
  border-radius: var(--fui-dropdown-menu-sub-trigger-rounded);
  font-family: var(--fui-dropdown-menu-sub-trigger-font-family);
  font-size: var(--fui-dropdown-menu-sub-trigger-font-size);
  line-height: var(--fui-dropdown-menu-sub-trigger-line-height);
  font-weight: var(--fui-dropdown-menu-sub-trigger-font-weight);
  letter-spacing: var(--fui-dropdown-menu-sub-trigger-letter-spacing);
  font-feature-settings: var(--fui-dropdown-menu-sub-trigger-font-feature-settings);
  font-variation-settings: var(--fui-dropdown-menu-sub-trigger-font-variation-settings);
  gap: var(--fui-dropdown-menu-sub-trigger-gap);
  padding-block: var(--fui-dropdown-menu-sub-trigger-padding-y);
  display: var(--fui-dropdown-menu-sub-trigger-display);
  align-items: var(--fui-dropdown-menu-sub-trigger-align-items);
  &:focus-visible {
    background-color: var(--fui-dropdown-menu-sub-trigger-focus-background-color);
    color: var(--fui-dropdown-menu-sub-trigger-focus-text-color);
  }
  &:is([data-state=open],[aria-expanded=true]) {
    background-color: var(--fui-dropdown-menu-sub-trigger-open-background-color);
    color: var(--fui-dropdown-menu-sub-trigger-open-text-color);
  }
  & :where([data-icon]) {
    width: var(--fui-dropdown-menu-sub-trigger-icon-size);
    height: var(--fui-dropdown-menu-sub-trigger-icon-size);
  }
}

@utility fui-dropdown-menu-sub-trigger-default {
  --tw-sort: pointer-events;
  padding-inline: var(--fui-dropdown-menu-sub-trigger-default-padding-x);
}

@utility fui-dropdown-menu-sub-trigger-inset {
  --tw-sort: pointer-events;
  padding-inline-start: var(--fui-dropdown-menu-sub-trigger-inset-padding-start);
  padding-inline-end: var(--fui-dropdown-menu-sub-trigger-inset-padding-end);
}

@utility fui-dropdown-menu-label {
  --tw-sort: container-type;
  color: var(--fui-dropdown-menu-label-text-color);
  font-family: var(--fui-dropdown-menu-label-font-family);
  font-size: var(--fui-dropdown-menu-label-font-size);
  line-height: var(--fui-dropdown-menu-label-line-height);
  font-weight: var(--fui-dropdown-menu-label-font-weight);
  letter-spacing: var(--fui-dropdown-menu-label-letter-spacing);
  font-feature-settings: var(--fui-dropdown-menu-label-font-feature-settings);
  font-variation-settings: var(--fui-dropdown-menu-label-font-variation-settings);
  text-transform: var(--fui-dropdown-menu-label-text-transform);
  padding-block: var(--fui-dropdown-menu-label-padding-y);
}

@utility fui-dropdown-menu-label-default {
  --tw-sort: pointer-events;
  padding-inline: var(--fui-dropdown-menu-label-default-padding-x);
}

@utility fui-dropdown-menu-label-inset {
  --tw-sort: pointer-events;
  padding-inline-start: var(--fui-dropdown-menu-label-inset-padding-start);
  padding-inline-end: var(--fui-dropdown-menu-label-inset-padding-end);
}

@utility fui-dropdown-menu-separator {
  --tw-sort: container-type;
  margin-inline: var(--fui-dropdown-menu-separator-bleed-x);
  margin-block: var(--fui-dropdown-menu-separator-margin-y);
  background-color: var(--fui-dropdown-menu-separator-background-color);
  height: var(--fui-dropdown-menu-separator-height);
}

@utility fui-dropdown-menu-shortcut {
  --tw-sort: container-type;
  color: var(--fui-dropdown-menu-shortcut-text-color);
  font-family: var(--fui-dropdown-menu-shortcut-font-family);
  font-size: var(--fui-dropdown-menu-shortcut-font-size);
  line-height: var(--fui-dropdown-menu-shortcut-line-height);
  font-weight: var(--fui-dropdown-menu-shortcut-font-weight);
  letter-spacing: var(--fui-dropdown-menu-shortcut-letter-spacing);
  font-feature-settings: var(--fui-dropdown-menu-shortcut-font-feature-settings);
  font-variation-settings: var(--fui-dropdown-menu-shortcut-font-variation-settings);
  margin-inline-start: var(--fui-dropdown-menu-shortcut-margin-start);
}

@utility fui-context-menu-content {
  --tw-sort: container-type;
  outline: var(--fui-context-menu-content-outline);
  outline-offset: var(--fui-context-menu-content-outline-offset);
  background-color: var(--fui-context-menu-content-background-color);
  color: var(--fui-context-menu-content-text-color);
  outline-color: var(--fui-context-menu-content-outline-color);
  border-radius: var(--fui-context-menu-content-rounded);
  box-shadow: var(--fui-context-menu-content-shadow);
  min-width: var(--fui-context-menu-content-min-width);
  padding: var(--fui-context-menu-content-padding);
}

@utility fui-context-menu-sub-content {
  --tw-sort: container-type;
  outline: var(--fui-context-menu-sub-content-outline);
  outline-offset: var(--fui-context-menu-sub-content-outline-offset);
  background-color: var(--fui-context-menu-sub-content-background-color);
  color: var(--fui-context-menu-sub-content-text-color);
  outline-color: var(--fui-context-menu-sub-content-outline-color);
  border-radius: var(--fui-context-menu-sub-content-rounded);
  box-shadow: var(--fui-context-menu-sub-content-shadow);
  min-width: var(--fui-context-menu-sub-content-min-width);
  padding: var(--fui-context-menu-sub-content-padding);
}

@utility fui-context-menu-item {
  --tw-sort: container-type;
  border-radius: var(--fui-context-menu-item-rounded);
  font-family: var(--fui-context-menu-item-font-family);
  font-size: var(--fui-context-menu-item-font-size);
  line-height: var(--fui-context-menu-item-line-height);
  font-weight: var(--fui-context-menu-item-font-weight);
  letter-spacing: var(--fui-context-menu-item-letter-spacing);
  font-feature-settings: var(--fui-context-menu-item-font-feature-settings);
  font-variation-settings: var(--fui-context-menu-item-font-variation-settings);
  gap: var(--fui-context-menu-item-gap);
  padding-block: var(--fui-context-menu-item-padding-y);
  display: var(--fui-context-menu-item-display);
  align-items: var(--fui-context-menu-item-align-items);
  &:focus-visible {
    background-color: var(--fui-context-menu-item-focus-background-color);
    color: var(--fui-context-menu-item-focus-text-color);
  }
  & :where([data-icon]) {
    width: var(--fui-context-menu-item-icon-size);
    height: var(--fui-context-menu-item-icon-size);
  }
}

@utility fui-context-menu-item-destructive {
  --tw-sort: pointer-events;
  color: var(--fui-context-menu-item-destructive-text-color);
  & svg {
    color: var(--fui-context-menu-item-destructive-icon-color);
  }
  &:focus-visible {
    background-color: var(--fui-context-menu-item-destructive-focus-background-color);
    color: var(--fui-context-menu-item-destructive-focus-text-color);
  }
}

@utility fui-context-menu-item-default {
  --tw-sort: pointer-events;
  padding-inline: var(--fui-context-menu-item-default-padding-x);
}

@utility fui-context-menu-item-inset {
  --tw-sort: pointer-events;
  padding-inline-start: var(--fui-context-menu-item-inset-padding-start);
  padding-inline-end: var(--fui-context-menu-item-inset-padding-end);
}

@utility fui-context-menu-item-indicator {
  --tw-sort: pointer-events;
  padding-inline-start: var(--fui-context-menu-item-indicator-padding-start);
  padding-inline-end: var(--fui-context-menu-item-indicator-padding-end);
}

@utility fui-context-menu-sub-trigger {
  --tw-sort: container-type;
  border-radius: var(--fui-context-menu-sub-trigger-rounded);
  font-family: var(--fui-context-menu-sub-trigger-font-family);
  font-size: var(--fui-context-menu-sub-trigger-font-size);
  line-height: var(--fui-context-menu-sub-trigger-line-height);
  font-weight: var(--fui-context-menu-sub-trigger-font-weight);
  letter-spacing: var(--fui-context-menu-sub-trigger-letter-spacing);
  font-feature-settings: var(--fui-context-menu-sub-trigger-font-feature-settings);
  font-variation-settings: var(--fui-context-menu-sub-trigger-font-variation-settings);
  gap: var(--fui-context-menu-sub-trigger-gap);
  padding-block: var(--fui-context-menu-sub-trigger-padding-y);
  display: var(--fui-context-menu-sub-trigger-display);
  align-items: var(--fui-context-menu-sub-trigger-align-items);
  &:focus-visible {
    background-color: var(--fui-context-menu-sub-trigger-focus-background-color);
    color: var(--fui-context-menu-sub-trigger-focus-text-color);
  }
  &:is([data-state=open],[aria-expanded=true]) {
    background-color: var(--fui-context-menu-sub-trigger-open-background-color);
    color: var(--fui-context-menu-sub-trigger-open-text-color);
  }
  & :where([data-icon]) {
    width: var(--fui-context-menu-sub-trigger-icon-size);
    height: var(--fui-context-menu-sub-trigger-icon-size);
  }
}

@utility fui-context-menu-sub-trigger-default {
  --tw-sort: pointer-events;
  padding-inline: var(--fui-context-menu-sub-trigger-default-padding-x);
}

@utility fui-context-menu-sub-trigger-inset {
  --tw-sort: pointer-events;
  padding-inline-start: var(--fui-context-menu-sub-trigger-inset-padding-start);
  padding-inline-end: var(--fui-context-menu-sub-trigger-inset-padding-end);
}

@utility fui-context-menu-label {
  --tw-sort: container-type;
  color: var(--fui-context-menu-label-text-color);
  font-family: var(--fui-context-menu-label-font-family);
  font-size: var(--fui-context-menu-label-font-size);
  line-height: var(--fui-context-menu-label-line-height);
  font-weight: var(--fui-context-menu-label-font-weight);
  letter-spacing: var(--fui-context-menu-label-letter-spacing);
  font-feature-settings: var(--fui-context-menu-label-font-feature-settings);
  font-variation-settings: var(--fui-context-menu-label-font-variation-settings);
  text-transform: var(--fui-context-menu-label-text-transform);
  padding-block: var(--fui-context-menu-label-padding-y);
}

@utility fui-context-menu-label-default {
  --tw-sort: pointer-events;
  padding-inline: var(--fui-context-menu-label-default-padding-x);
}

@utility fui-context-menu-label-inset {
  --tw-sort: pointer-events;
  padding-inline-start: var(--fui-context-menu-label-inset-padding-start);
  padding-inline-end: var(--fui-context-menu-label-inset-padding-end);
}

@utility fui-context-menu-separator {
  --tw-sort: container-type;
  margin-inline: var(--fui-context-menu-separator-bleed-x);
  margin-block: var(--fui-context-menu-separator-margin-y);
  background-color: var(--fui-context-menu-separator-background-color);
  height: var(--fui-context-menu-separator-height);
}

@utility fui-context-menu-shortcut {
  --tw-sort: container-type;
  color: var(--fui-context-menu-shortcut-text-color);
  font-family: var(--fui-context-menu-shortcut-font-family);
  font-size: var(--fui-context-menu-shortcut-font-size);
  line-height: var(--fui-context-menu-shortcut-line-height);
  font-weight: var(--fui-context-menu-shortcut-font-weight);
  letter-spacing: var(--fui-context-menu-shortcut-letter-spacing);
  font-feature-settings: var(--fui-context-menu-shortcut-font-feature-settings);
  font-variation-settings: var(--fui-context-menu-shortcut-font-variation-settings);
  margin-inline-start: var(--fui-context-menu-shortcut-margin-start);
}

@utility fui-navigation-menu-trigger {
  --tw-sort: container-type;
  border-radius: var(--fui-navigation-menu-trigger-rounded);
  font-family: var(--fui-navigation-menu-trigger-font-family);
  font-size: var(--fui-navigation-menu-trigger-font-size);
  line-height: var(--fui-navigation-menu-trigger-line-height);
  font-weight: var(--fui-navigation-menu-trigger-font-weight);
  letter-spacing: var(--fui-navigation-menu-trigger-letter-spacing);
  font-feature-settings: var(--fui-navigation-menu-trigger-font-feature-settings);
  font-variation-settings: var(--fui-navigation-menu-trigger-font-variation-settings);
  height: var(--fui-navigation-menu-trigger-height);
  padding-inline: var(--fui-navigation-menu-trigger-padding-x);
  padding-block: var(--fui-navigation-menu-trigger-padding-y);
  display: var(--fui-navigation-menu-trigger-display);
  width: var(--fui-navigation-menu-trigger-width);
  align-items: var(--fui-navigation-menu-trigger-align-items);
  justify-content: var(--fui-navigation-menu-trigger-justify-content);
  &:hover {
    background-color: var(--fui-navigation-menu-trigger-hover-background-color);
  }
  &:focus-visible {
    background-color: var(--fui-navigation-menu-trigger-focus-background-color);
  }
  &:is([data-state=open],[aria-expanded=true]) {
    background-color: var(--fui-navigation-menu-trigger-open-background-color);
  }
  & :where([data-icon]) {
    width: var(--fui-navigation-menu-trigger-icon-size);
    height: var(--fui-navigation-menu-trigger-icon-size);
  }
}

@utility fui-navigation-menu-content {
  --tw-sort: container-type;
  padding-block: var(--fui-navigation-menu-content-padding-y);
  padding-inline-start: var(--fui-navigation-menu-content-padding-start);
  padding-inline-end: var(--fui-navigation-menu-content-padding-end);
  width: var(--fui-navigation-menu-content-width);
}

@utility fui-navigation-menu-content-shared {
  --tw-sort: pointer-events;
  --fui_empty: initial;
}

@utility fui-navigation-menu-content-own {
  --tw-sort: pointer-events;
  outline: var(--fui-navigation-menu-content-own-outline);
  outline-offset: var(--fui-navigation-menu-content-own-outline-offset);
  background-color: var(--fui-navigation-menu-content-own-background-color);
  color: var(--fui-navigation-menu-content-own-text-color);
  outline-color: var(--fui-navigation-menu-content-own-outline-color);
  border-radius: var(--fui-navigation-menu-content-own-rounded);
  box-shadow: var(--fui-navigation-menu-content-own-shadow);
  margin-top: var(--fui-navigation-menu-content-own-margin-top);
}

@utility fui-navigation-menu-link {
  --tw-sort: container-type;
  border-radius: var(--fui-navigation-menu-link-rounded);
  font-family: var(--fui-navigation-menu-link-font-family);
  font-size: var(--fui-navigation-menu-link-font-size);
  line-height: var(--fui-navigation-menu-link-line-height);
  font-weight: var(--fui-navigation-menu-link-font-weight);
  letter-spacing: var(--fui-navigation-menu-link-letter-spacing);
  font-feature-settings: var(--fui-navigation-menu-link-font-feature-settings);
  font-variation-settings: var(--fui-navigation-menu-link-font-variation-settings);
  gap: var(--fui-navigation-menu-link-gap);
  padding: var(--fui-navigation-menu-link-padding);
  display: var(--fui-navigation-menu-link-display);
  align-items: var(--fui-navigation-menu-link-align-items);
  &:hover {
    background-color: var(--fui-navigation-menu-link-hover-background-color);
  }
  &:focus-visible {
    background-color: var(--fui-navigation-menu-link-focus-background-color);
  }
  &[data-active]:not([data-active=false]) {
    background-color: var(--fui-navigation-menu-link-current-background-color);
  }
  & :where([data-icon]) {
    width: var(--fui-navigation-menu-link-icon-size);
    height: var(--fui-navigation-menu-link-icon-size);
  }
}

@utility fui-navigation-menu-link-panel {
  --tw-sort: pointer-events;
  --fui_empty: initial;
}

@utility fui-navigation-menu-link-bar {
  --tw-sort: pointer-events;
  font-family: var(--fui-navigation-menu-link-bar-font-family);
  font-size: var(--fui-navigation-menu-link-bar-font-size);
  line-height: var(--fui-navigation-menu-link-bar-line-height);
  font-weight: var(--fui-navigation-menu-link-bar-font-weight);
  letter-spacing: var(--fui-navigation-menu-link-bar-letter-spacing);
  font-feature-settings: var(--fui-navigation-menu-link-bar-font-feature-settings);
  font-variation-settings: var(--fui-navigation-menu-link-bar-font-variation-settings);
  height: var(--fui-navigation-menu-link-bar-height);
  padding-inline: var(--fui-navigation-menu-link-bar-padding-x);
  padding-block: var(--fui-navigation-menu-link-bar-padding-y);
}

@utility fui-navigation-menu-viewport {
  --tw-sort: container-type;
  outline: var(--fui-navigation-menu-viewport-outline);
  outline-offset: var(--fui-navigation-menu-viewport-outline-offset);
  background-color: var(--fui-navigation-menu-viewport-background-color);
  color: var(--fui-navigation-menu-viewport-text-color);
  outline-color: var(--fui-navigation-menu-viewport-outline-color);
  border-radius: var(--fui-navigation-menu-viewport-rounded);
  box-shadow: var(--fui-navigation-menu-viewport-shadow);
  margin-top: var(--fui-navigation-menu-viewport-margin-top);
  height: var(--reka-navigation-menu-viewport-height);
  width: var(--reka-navigation-menu-viewport-width);
}

@utility fui-navigation-menu-indicator-arrow {
  --tw-sort: container-type;
  background-color: var(--fui-navigation-menu-indicator-arrow-background-color);
  box-shadow: var(--fui-navigation-menu-indicator-arrow-shadow);
  width: var(--fui-navigation-menu-indicator-arrow-size);
  height: var(--fui-navigation-menu-indicator-arrow-size);
}

@utility fui-navigation-menu {
  --tw-sort: container-type;
  display: var(--fui-navigation-menu-display);
  max-width: var(--fui-navigation-menu-max-width);
  flex: var(--fui-navigation-menu-flex);
  align-items: var(--fui-navigation-menu-align-items);
  justify-content: var(--fui-navigation-menu-justify-content);
}

@utility fui-navigation-menu-indicator {
  --tw-sort: container-type;
  display: var(--fui-navigation-menu-indicator-display);
  height: var(--fui-navigation-menu-indicator-height);
  align-items: var(--fui-navigation-menu-indicator-align-items);
  justify-content: var(--fui-navigation-menu-indicator-justify-content);
}

@utility fui-navigation-menu-list {
  --tw-sort: container-type;
  display: var(--fui-navigation-menu-list-display);
  flex: var(--fui-navigation-menu-list-flex);
  gap: var(--fui-navigation-menu-list-gap);
  align-items: var(--fui-navigation-menu-list-align-items);
  justify-content: var(--fui-navigation-menu-list-justify-content);
}

@utility fui-mega-menu-trigger {
  --tw-sort: container-type;
  font-family: var(--fui-mega-menu-trigger-font-family);
  font-size: var(--fui-mega-menu-trigger-font-size);
  line-height: var(--fui-mega-menu-trigger-line-height);
  font-weight: var(--fui-mega-menu-trigger-font-weight);
  letter-spacing: var(--fui-mega-menu-trigger-letter-spacing);
  font-feature-settings: var(--fui-mega-menu-trigger-font-feature-settings);
  font-variation-settings: var(--fui-mega-menu-trigger-font-variation-settings);
  display: var(--fui-mega-menu-trigger-display);
  align-items: var(--fui-mega-menu-trigger-align-items);
  justify-content: var(--fui-mega-menu-trigger-justify-content);
  & :where([data-icon]) {
    width: var(--fui-mega-menu-trigger-icon-size);
    height: var(--fui-mega-menu-trigger-icon-size);
  }
}

@utility fui-mega-menu-content {
  --tw-sort: container-type;
  background-color: var(--fui-mega-menu-content-background-color);
  border-top: var(--fui-mega-menu-content-border-top);
  border-color: var(--fui-mega-menu-content-border-color);
  width: var(--fui-mega-menu-content-width);
}

@utility fui-mega-menu-viewport {
  --tw-sort: container-type;
  box-shadow: var(--fui-mega-menu-viewport-shadow);
  height: var(--reka-navigation-menu-viewport-height);
}

@utility fui-mega-menu {
  --tw-sort: container-type;
  width: var(--fui-mega-menu-width);
}

@utility fui-mega-menu-item {
  --tw-sort: container-type;
  display: var(--fui-mega-menu-item-display);
}

@utility fui-mega-menu-list {
  --tw-sort: container-type;
  display: var(--fui-mega-menu-list-display);
  height: var(--fui-mega-menu-list-height);
  align-items: var(--fui-mega-menu-list-align-items);
  gap: var(--fui-mega-menu-list-gap);
}

@utility fui-toast {
  --tw-sort: container-type;
  background-color: var(--fui-toast-background-color);
  color: var(--fui-toast-text-color);
  border: var(--fui-toast-border);
  border-radius: var(--fui-toast-rounded);
  box-shadow: var(--fui-toast-shadow);
  font-family: var(--fui-toast-font-family);
  font-size: var(--fui-toast-font-size);
  line-height: var(--fui-toast-line-height);
  font-weight: var(--fui-toast-font-weight);
  letter-spacing: var(--fui-toast-letter-spacing);
  font-feature-settings: var(--fui-toast-font-feature-settings);
  font-variation-settings: var(--fui-toast-font-variation-settings);
  width: var(--fui-toast-width);
  padding-inline: var(--fui-toast-padding-x);
  padding-block: var(--fui-toast-padding-y);
  gap: var(--fui-toast-gap);
  & :where([data-icon]) {
    width: var(--fui-toast-icon-size);
    height: var(--fui-toast-icon-size);
  }
}

@utility fui-toast-info {
  --tw-sort: pointer-events;
  border-color: var(--fui-toast-info-border-color);
  & svg {
    color: var(--fui-toast-info-icon-color);
  }
}

@utility fui-toast-positive {
  --tw-sort: pointer-events;
  border-color: var(--fui-toast-positive-border-color);
  & svg {
    color: var(--fui-toast-positive-icon-color);
  }
}

@utility fui-toast-warning {
  --tw-sort: pointer-events;
  border-color: var(--fui-toast-warning-border-color);
  & svg {
    color: var(--fui-toast-warning-icon-color);
  }
}

@utility fui-toast-destructive {
  --tw-sort: pointer-events;
  background-color: var(--fui-toast-destructive-background-color);
  color: var(--fui-toast-destructive-text-color);
}

@utility fui-toast-content {
  --tw-sort: container-type;
  gap: var(--fui-toast-content-gap);
}

@utility fui-toast-action {
  --tw-sort: container-type;
  border: var(--fui-toast-action-border);
  border-color: var(--fui-toast-action-border-color);
  border-radius: var(--fui-toast-action-rounded);
  font-family: var(--fui-toast-action-font-family);
  font-size: var(--fui-toast-action-font-size);
  line-height: var(--fui-toast-action-line-height);
  font-weight: var(--fui-toast-action-font-weight);
  letter-spacing: var(--fui-toast-action-letter-spacing);
  font-feature-settings: var(--fui-toast-action-font-feature-settings);
  font-variation-settings: var(--fui-toast-action-font-variation-settings);
  text-transform: var(--fui-toast-action-text-transform);
  background-color: var(--fui-toast-action-background-color);
  color: var(--fui-toast-action-text-color);
  height: var(--fui-toast-action-height);
  padding-inline: var(--fui-toast-action-padding-x);
  &:active:not([aria-haspopup]) {
    translate: var(--fui-toast-action-pressed-translate);
  }
}

@utility fui-toast-cancel {
  --tw-sort: container-type;
  border: var(--fui-toast-cancel-border);
  border-color: var(--fui-toast-cancel-border-color);
  border-radius: var(--fui-toast-cancel-rounded);
  font-family: var(--fui-toast-cancel-font-family);
  font-size: var(--fui-toast-cancel-font-size);
  line-height: var(--fui-toast-cancel-line-height);
  font-weight: var(--fui-toast-cancel-font-weight);
  letter-spacing: var(--fui-toast-cancel-letter-spacing);
  font-feature-settings: var(--fui-toast-cancel-font-feature-settings);
  font-variation-settings: var(--fui-toast-cancel-font-variation-settings);
  text-transform: var(--fui-toast-cancel-text-transform);
  background-color: var(--fui-toast-cancel-background-color);
  color: var(--fui-toast-cancel-text-color);
  height: var(--fui-toast-cancel-height);
  padding-inline: var(--fui-toast-cancel-padding-x);
  &:active:not([aria-haspopup]) {
    translate: var(--fui-toast-cancel-pressed-translate);
  }
}

@utility fui-toast-title {
  --tw-sort: container-type;
  font-family: var(--fui-toast-title-font-family);
  font-size: var(--fui-toast-title-font-size);
  line-height: var(--fui-toast-title-line-height);
  font-weight: var(--fui-toast-title-font-weight);
  letter-spacing: var(--fui-toast-title-letter-spacing);
  font-feature-settings: var(--fui-toast-title-font-feature-settings);
  font-variation-settings: var(--fui-toast-title-font-variation-settings);
  text-transform: var(--fui-toast-title-text-transform);
}

@utility fui-toast-description {
  --tw-sort: container-type;
  color: var(--fui-toast-description-text-color);
  font-family: var(--fui-toast-description-font-family);
  font-size: var(--fui-toast-description-font-size);
  line-height: var(--fui-toast-description-line-height);
  font-weight: var(--fui-toast-description-font-weight);
  letter-spacing: var(--fui-toast-description-letter-spacing);
  font-feature-settings: var(--fui-toast-description-font-feature-settings);
  font-variation-settings: var(--fui-toast-description-font-variation-settings);
}

@utility fui-separator {
  --tw-sort: container-type;
  background-color: var(--fui-separator-background-color);
  flex-shrink: var(--fui-separator-flex-shrink);
}

@utility fui-separator-horizontal {
  --tw-sort: pointer-events;
  height: var(--fui-separator-horizontal-height);
  width: var(--fui-separator-horizontal-width);
}

@utility fui-separator-vertical {
  --tw-sort: pointer-events;
  width: var(--fui-separator-vertical-width);
  align-self: var(--fui-separator-vertical-align-self);
}

@utility fui-card {
  --tw-sort: container-type;
  outline: var(--fui-card-outline);
  outline-offset: var(--fui-card-outline-offset);
  background-color: var(--fui-card-background-color);
  color: var(--fui-card-text-color);
  outline-color: var(--fui-card-outline-color);
  border-radius: var(--fui-card-rounded);
  box-shadow: var(--fui-card-shadow);
  font-family: var(--fui-card-font-family);
  font-size: var(--fui-card-font-size);
  line-height: var(--fui-card-line-height);
  font-weight: var(--fui-card-font-weight);
  letter-spacing: var(--fui-card-letter-spacing);
  font-feature-settings: var(--fui-card-font-feature-settings);
  font-variation-settings: var(--fui-card-font-variation-settings);
  padding-block: var(--fui-card-padding-y);
  container-type: var(--fui-card-contain);
  gap: var(--fui-card-gap);
  display: var(--fui-card-display);
  flex-direction: var(--fui-card-flex-direction);
  --fui-card-header-padding-x: calc(var(--fui-spacing) * 8);
  --fui-card-content-padding-x: calc(var(--fui-spacing) * 8);
  --fui-card-footer-padding-x: calc(var(--fui-spacing) * 8);
  @container (width >= 28rem) {
    padding-block: var(--fui-card-md-padding-y);
    gap: var(--fui-card-md-gap);
  }
}

@utility fui-card-raised {
  --tw-sort: pointer-events;
  --fui_empty: initial;
}

@utility fui-card-bare {
  --tw-sort: pointer-events;
  outline: var(--fui-card-bare-outline);
  outline-offset: var(--fui-card-bare-outline-offset);
  box-shadow: var(--fui-card-bare-shadow);
  padding-block: var(--fui-card-bare-padding-y);
  --fui-card-header-padding-x: var(--fui-card-bare-card-header-padding-x);
  --fui-card-content-padding-x: var(--fui-card-bare-card-content-padding-x);
  --fui-card-footer-padding-x: var(--fui-card-bare-card-footer-padding-x);
}

@utility fui-card-header {
  --tw-sort: container-type;
  gap: var(--fui-card-header-gap);
  padding-inline: var(--fui-card-header-padding-x);
  display: var(--fui-card-header-display);
  grid-template-columns: var(--fui-card-header-grid-columns);
  align-items: var(--fui-card-header-align-items);
}

@utility fui-card-content {
  --tw-sort: container-type;
  padding-inline: var(--fui-card-content-padding-x);
}

@utility fui-card-footer {
  --tw-sort: container-type;
  padding-inline: var(--fui-card-footer-padding-x);
  display: var(--fui-card-footer-display);
  align-items: var(--fui-card-footer-align-items);
}

@utility fui-card-title {
  --tw-sort: container-type;
  font-family: var(--fui-card-title-font-family);
  font-size: var(--fui-card-title-font-size);
  line-height: var(--fui-card-title-line-height);
  font-weight: var(--fui-card-title-font-weight);
  letter-spacing: var(--fui-card-title-letter-spacing);
  font-feature-settings: var(--fui-card-title-font-feature-settings);
  font-variation-settings: var(--fui-card-title-font-variation-settings);
  text-transform: var(--fui-card-title-text-transform);
}

@utility fui-card-description {
  --tw-sort: container-type;
  color: var(--fui-card-description-text-color);
  font-family: var(--fui-card-description-font-family);
  font-size: var(--fui-card-description-font-size);
  line-height: var(--fui-card-description-line-height);
  font-weight: var(--fui-card-description-font-weight);
  letter-spacing: var(--fui-card-description-letter-spacing);
  font-feature-settings: var(--fui-card-description-font-feature-settings);
  font-variation-settings: var(--fui-card-description-font-variation-settings);
}

@utility fui-card-action {
  --tw-sort: container-type;
  align-self: var(--fui-card-action-align-self);
  justify-self: var(--fui-card-action-justify-self);
}

@utility fui-alert {
  --tw-sort: container-type;
  background-color: var(--fui-alert-background-color);
  color: var(--fui-alert-text-color);
  border: var(--fui-alert-border);
  border-color: var(--fui-alert-border-color);
  border-radius: var(--fui-alert-rounded);
  font-family: var(--fui-alert-font-family);
  font-size: var(--fui-alert-font-size);
  line-height: var(--fui-alert-line-height);
  font-weight: var(--fui-alert-font-weight);
  letter-spacing: var(--fui-alert-letter-spacing);
  font-feature-settings: var(--fui-alert-font-feature-settings);
  font-variation-settings: var(--fui-alert-font-variation-settings);
  gap: var(--fui-alert-gap);
  padding-inline: var(--fui-alert-padding-x);
  padding-block: var(--fui-alert-padding-y);
  display: var(--fui-alert-display);
  width: var(--fui-alert-width);
  justify-content: var(--fui-alert-justify-content);
  text-align: var(--fui-alert-text-align);
  &::after {
    content: var(--tw-content, '');
    border-inline-start: var(--fui-alert-after-border-start);
    border-color: var(--fui-alert-after-border-color);
  }
  & :where([data-icon]) {
    width: var(--fui-alert-icon-size);
    height: var(--fui-alert-icon-size);
  }
}

@utility fui-alert-neutral {
  --tw-sort: pointer-events;
  --fui_empty: initial;
}

@utility fui-alert-info {
  --tw-sort: pointer-events;
  border-color: var(--fui-alert-info-border-color);
  & svg {
    color: var(--fui-alert-info-icon-color);
  }
  &::after {
    content: var(--tw-content, '');
    border-color: var(--fui-alert-info-after-border-color);
  }
}

@utility fui-alert-success {
  --tw-sort: pointer-events;
  border-color: var(--fui-alert-success-border-color);
  & svg {
    color: var(--fui-alert-success-icon-color);
  }
  &::after {
    content: var(--tw-content, '');
    border-color: var(--fui-alert-success-after-border-color);
  }
}

@utility fui-alert-warning {
  --tw-sort: pointer-events;
  border-color: var(--fui-alert-warning-border-color);
  & svg {
    color: var(--fui-alert-warning-icon-color);
  }
  &::after {
    content: var(--tw-content, '');
    border-color: var(--fui-alert-warning-after-border-color);
  }
}

@utility fui-alert-error {
  --tw-sort: pointer-events;
  background-color: var(--fui-alert-error-background-color);
  color: var(--fui-alert-error-text-color);
  &::after {
    content: var(--tw-content, '');
    border-color: var(--fui-alert-error-after-border-color);
  }
}

@utility fui-alert-title {
  --tw-sort: container-type;
  font-family: var(--fui-alert-title-font-family);
  font-size: var(--fui-alert-title-font-size);
  line-height: var(--fui-alert-title-line-height);
  font-weight: var(--fui-alert-title-font-weight);
  letter-spacing: var(--fui-alert-title-letter-spacing);
  font-feature-settings: var(--fui-alert-title-font-feature-settings);
  font-variation-settings: var(--fui-alert-title-font-variation-settings);
  & :where(a) {
    text-decoration-line: var(--fui-alert-title-link-text-decoration-line);
  }
  & :where(a:hover) {
    color: var(--fui-alert-title-link-hover-text-color);
  }
}

@utility fui-alert-description {
  --tw-sort: container-type;
  color: var(--fui-alert-description-text-color);
  font-family: var(--fui-alert-description-font-family);
  font-size: var(--fui-alert-description-font-size);
  line-height: var(--fui-alert-description-line-height);
  font-weight: var(--fui-alert-description-font-weight);
  letter-spacing: var(--fui-alert-description-letter-spacing);
  font-feature-settings: var(--fui-alert-description-font-feature-settings);
  font-variation-settings: var(--fui-alert-description-font-variation-settings);
  & :where(a) {
    text-decoration-line: var(--fui-alert-description-link-text-decoration-line);
  }
  & :where(a:hover) {
    color: var(--fui-alert-description-link-hover-text-color);
  }
}

@utility fui-alert-description-neutral {
  --tw-sort: pointer-events;
  color: var(--fui-alert-description-neutral-text-color);
}

@utility fui-alert-description-error {
  --tw-sort: pointer-events;
  color: var(--fui-alert-description-error-text-color);
}

@utility fui-empty {
  --tw-sort: container-type;
  border-radius: var(--fui-empty-rounded);
  gap: var(--fui-empty-gap);
  padding: var(--fui-empty-padding);
  display: var(--fui-empty-display);
  width: var(--fui-empty-width);
  min-width: var(--fui-empty-min-width);
  flex: var(--fui-empty-flex);
  flex-direction: var(--fui-empty-flex-direction);
  align-items: var(--fui-empty-align-items);
  justify-content: var(--fui-empty-justify-content);
  text-align: var(--fui-empty-text-align);
  @container (width >= 28rem) {
    padding: var(--fui-empty-md-padding);
  }
}

@utility fui-empty-content {
  --tw-sort: container-type;
  font-family: var(--fui-empty-content-font-family);
  font-size: var(--fui-empty-content-font-size);
  line-height: var(--fui-empty-content-line-height);
  font-weight: var(--fui-empty-content-font-weight);
  letter-spacing: var(--fui-empty-content-letter-spacing);
  font-feature-settings: var(--fui-empty-content-font-feature-settings);
  font-variation-settings: var(--fui-empty-content-font-variation-settings);
  gap: var(--fui-empty-content-gap);
  display: var(--fui-empty-content-display);
  width: var(--fui-empty-content-width);
  max-width: var(--fui-empty-content-max-width);
  min-width: var(--fui-empty-content-min-width);
  flex-direction: var(--fui-empty-content-flex-direction);
  align-items: var(--fui-empty-content-align-items);
}

@utility fui-empty-title {
  --tw-sort: container-type;
  font-family: var(--fui-empty-title-font-family);
  font-size: var(--fui-empty-title-font-size);
  line-height: var(--fui-empty-title-line-height);
  font-weight: var(--fui-empty-title-font-weight);
  letter-spacing: var(--fui-empty-title-letter-spacing);
  font-feature-settings: var(--fui-empty-title-font-feature-settings);
  font-variation-settings: var(--fui-empty-title-font-variation-settings);
  text-transform: var(--fui-empty-title-text-transform);
}

@utility fui-empty-description {
  --tw-sort: container-type;
  color: var(--fui-empty-description-text-color);
  font-family: var(--fui-empty-description-font-family);
  font-size: var(--fui-empty-description-font-size);
  line-height: var(--fui-empty-description-line-height);
  font-weight: var(--fui-empty-description-font-weight);
  letter-spacing: var(--fui-empty-description-letter-spacing);
  font-feature-settings: var(--fui-empty-description-font-feature-settings);
  font-variation-settings: var(--fui-empty-description-font-variation-settings);
  margin-top: var(--fui-empty-description-margin-top);
  & :where(a) {
    text-decoration-line: var(--fui-empty-description-link-text-decoration-line);
  }
  & :where(a:hover) {
    color: var(--fui-empty-description-link-hover-text-color);
  }
}

@utility fui-empty-media {
  --tw-sort: container-type;
  border-radius: var(--fui-empty-media-rounded);
  margin-bottom: var(--fui-empty-media-margin-bottom);
  display: var(--fui-empty-media-display);
  flex-shrink: var(--fui-empty-media-flex-shrink);
  align-items: var(--fui-empty-media-align-items);
  justify-content: var(--fui-empty-media-justify-content);
}

@utility fui-empty-media-default {
  --tw-sort: pointer-events;
  background-color: var(--fui-empty-media-default-background-color);
}

@utility fui-empty-media-icon {
  --tw-sort: pointer-events;
  background-color: var(--fui-empty-media-icon-background-color);
  color: var(--fui-empty-media-icon-text-color);
  width: var(--fui-empty-media-icon-size);
  height: var(--fui-empty-media-icon-size);
  & :where([data-icon]) {
    width: var(--fui-empty-media-icon-icon-size);
    height: var(--fui-empty-media-icon-icon-size);
  }
}

@utility fui-empty-header {
  --tw-sort: container-type;
  display: var(--fui-empty-header-display);
  max-width: var(--fui-empty-header-max-width);
  flex-direction: var(--fui-empty-header-flex-direction);
  align-items: var(--fui-empty-header-align-items);
  gap: var(--fui-empty-header-gap);
}

@utility fui-item {
  --tw-sort: container-type;
  border: var(--fui-item-border);
  border-radius: var(--fui-item-rounded);
  font-family: var(--fui-item-font-family);
  font-size: var(--fui-item-font-size);
  line-height: var(--fui-item-line-height);
  font-weight: var(--fui-item-font-weight);
  letter-spacing: var(--fui-item-letter-spacing);
  font-feature-settings: var(--fui-item-font-feature-settings);
  font-variation-settings: var(--fui-item-font-variation-settings);
  display: var(--fui-item-display);
  width: var(--fui-item-width);
  flex-wrap: var(--fui-item-flex-wrap);
  align-items: var(--fui-item-align-items);
  &:focus-visible {
    outline: var(--fui-item-focus-outline);
    outline-offset: var(--fui-item-focus-outline-offset);
    border-color: var(--fui-item-focus-border-color);
    outline-color: var(--fui-item-focus-outline-color);
  }
}

@utility fui-item-default {
  --tw-sort: pointer-events;
  border-color: var(--fui-item-default-border-color);
}

@utility fui-item-outline {
  --tw-sort: pointer-events;
  border-color: var(--fui-item-outline-border-color);
}

@utility fui-item-muted {
  --tw-sort: pointer-events;
  background-color: var(--fui-item-muted-background-color);
  border-color: var(--fui-item-muted-border-color);
}

@utility fui-item-md {
  --tw-sort: pointer-events;
  gap: var(--fui-item-md-gap);
  padding-inline: var(--fui-item-md-padding-x);
  padding-block: var(--fui-item-md-padding-y);
}

@utility fui-item-sm {
  --tw-sort: pointer-events;
  gap: var(--fui-item-sm-gap);
  padding-inline: var(--fui-item-sm-padding-x);
  padding-block: var(--fui-item-sm-padding-y);
}

@utility fui-item-xs {
  --tw-sort: pointer-events;
  gap: var(--fui-item-xs-gap);
  padding-inline: var(--fui-item-xs-padding-x);
  padding-block: var(--fui-item-xs-padding-y);
}

@utility fui-item-link {
  --tw-sort: container-type;
  &:hover {
    background-color: var(--fui-item-link-hover-background-color);
  }
}

@utility fui-item-media {
  --tw-sort: container-type;
  gap: var(--fui-item-media-gap);
  display: var(--fui-item-media-display);
  flex-shrink: var(--fui-item-media-flex-shrink);
  align-items: var(--fui-item-media-align-items);
  justify-content: var(--fui-item-media-justify-content);
}

@utility fui-item-media-default {
  --tw-sort: pointer-events;
  background-color: var(--fui-item-media-default-background-color);
}

@utility fui-item-media-icon {
  --tw-sort: pointer-events;
  & :where([data-icon]) {
    width: var(--fui-item-media-icon-icon-size);
    height: var(--fui-item-media-icon-icon-size);
  }
}

@utility fui-item-media-image {
  --tw-sort: pointer-events;
  border-radius: var(--fui-item-media-image-rounded);
  width: var(--fui-item-media-image-size);
  height: var(--fui-item-media-image-size);
}

@utility fui-item-title {
  --tw-sort: container-type;
  text-transform: var(--fui-item-title-text-transform);
  font-family: var(--fui-item-title-font-family);
  font-size: var(--fui-item-title-font-size);
  line-height: var(--fui-item-title-line-height);
  font-weight: var(--fui-item-title-font-weight);
  letter-spacing: var(--fui-item-title-letter-spacing);
  font-feature-settings: var(--fui-item-title-font-feature-settings);
  font-variation-settings: var(--fui-item-title-font-variation-settings);
  gap: var(--fui-item-title-gap);
  width: var(--fui-item-title-width);
  align-items: var(--fui-item-title-align-items);
}

@utility fui-item-description {
  --tw-sort: container-type;
  color: var(--fui-item-description-text-color);
  font-family: var(--fui-item-description-font-family);
  font-size: var(--fui-item-description-font-size);
  line-height: var(--fui-item-description-line-height);
  font-weight: var(--fui-item-description-font-weight);
  letter-spacing: var(--fui-item-description-letter-spacing);
  font-feature-settings: var(--fui-item-description-font-feature-settings);
  font-variation-settings: var(--fui-item-description-font-variation-settings);
  text-align: var(--fui-item-description-text-align);
  & :where(a) {
    text-decoration-line: var(--fui-item-description-link-text-decoration-line);
  }
  & :where(a:hover) {
    color: var(--fui-item-description-link-hover-text-color);
  }
}

@utility fui-item-actions {
  --tw-sort: container-type;
  display: var(--fui-item-actions-display);
  align-items: var(--fui-item-actions-align-items);
  gap: var(--fui-item-actions-gap);
}

@utility fui-item-content {
  --tw-sort: container-type;
  display: var(--fui-item-content-display);
  flex: var(--fui-item-content-flex);
  flex-direction: var(--fui-item-content-flex-direction);
  gap: var(--fui-item-content-gap);
}

@utility fui-item-footer {
  --tw-sort: container-type;
  display: var(--fui-item-footer-display);
  align-items: var(--fui-item-footer-align-items);
  justify-content: var(--fui-item-footer-justify-content);
  gap: var(--fui-item-footer-gap);
}

@utility fui-item-group {
  --tw-sort: container-type;
  display: var(--fui-item-group-display);
  width: var(--fui-item-group-width);
  flex-direction: var(--fui-item-group-flex-direction);
  gap: var(--fui-item-group-gap);
}

@utility fui-item-header {
  --tw-sort: container-type;
  display: var(--fui-item-header-display);
  align-items: var(--fui-item-header-align-items);
  justify-content: var(--fui-item-header-justify-content);
  gap: var(--fui-item-header-gap);
}

@utility fui-item-separator {
  --tw-sort: container-type;
  margin-block: var(--fui-item-separator-margin-y);
}

@utility fui-avatar {
  --tw-sort: container-type;
  border-radius: var(--fui-avatar-rounded);
  display: var(--fui-avatar-display);
  flex-shrink: var(--fui-avatar-flex-shrink);
  &::after {
    content: var(--tw-content, '');
    border: var(--fui-avatar-after-border);
    border-radius: var(--fui-avatar-after-rounded);
  }
}

@utility fui-avatar-sm {
  --tw-sort: pointer-events;
  width: var(--fui-avatar-sm-size);
  height: var(--fui-avatar-sm-size);
}

@utility fui-avatar-md {
  --tw-sort: pointer-events;
  width: var(--fui-avatar-md-size);
  height: var(--fui-avatar-md-size);
}

@utility fui-avatar-lg {
  --tw-sort: pointer-events;
  width: var(--fui-avatar-lg-size);
  height: var(--fui-avatar-lg-size);
}

@utility fui-avatar-ring {
  --tw-sort: container-type;
  outline: var(--fui-avatar-ring-outline);
  outline-offset: var(--fui-avatar-ring-outline-offset);
  outline-color: var(--fui-avatar-ring-outline-color);
}

@utility fui-avatar-image {
  --tw-sort: container-type;
  border-radius: var(--fui-avatar-image-rounded);
  width: var(--fui-avatar-image-size);
  height: var(--fui-avatar-image-size);
}

@utility fui-avatar-fallback {
  --tw-sort: container-type;
  background-color: var(--fui-avatar-fallback-background-color);
  color: var(--fui-avatar-fallback-text-color);
  border-radius: var(--fui-avatar-fallback-rounded);
  display: var(--fui-avatar-fallback-display);
  width: var(--fui-avatar-fallback-size);
  height: var(--fui-avatar-fallback-size);
  align-items: var(--fui-avatar-fallback-align-items);
  justify-content: var(--fui-avatar-fallback-justify-content);
}

@utility fui-avatar-fallback-sm {
  --tw-sort: pointer-events;
  font-family: var(--fui-avatar-fallback-sm-font-family);
  font-size: var(--fui-avatar-fallback-sm-font-size);
  line-height: var(--fui-avatar-fallback-sm-line-height);
  font-weight: var(--fui-avatar-fallback-sm-font-weight);
  letter-spacing: var(--fui-avatar-fallback-sm-letter-spacing);
  font-feature-settings: var(--fui-avatar-fallback-sm-font-feature-settings);
  font-variation-settings: var(--fui-avatar-fallback-sm-font-variation-settings);
}

@utility fui-avatar-fallback-md {
  --tw-sort: pointer-events;
  font-family: var(--fui-avatar-fallback-md-font-family);
  font-size: var(--fui-avatar-fallback-md-font-size);
  line-height: var(--fui-avatar-fallback-md-line-height);
  font-weight: var(--fui-avatar-fallback-md-font-weight);
  letter-spacing: var(--fui-avatar-fallback-md-letter-spacing);
  font-feature-settings: var(--fui-avatar-fallback-md-font-feature-settings);
  font-variation-settings: var(--fui-avatar-fallback-md-font-variation-settings);
}

@utility fui-avatar-fallback-lg {
  --tw-sort: pointer-events;
  font-family: var(--fui-avatar-fallback-lg-font-family);
  font-size: var(--fui-avatar-fallback-lg-font-size);
  line-height: var(--fui-avatar-fallback-lg-line-height);
  font-weight: var(--fui-avatar-fallback-lg-font-weight);
  letter-spacing: var(--fui-avatar-fallback-lg-letter-spacing);
  font-feature-settings: var(--fui-avatar-fallback-lg-font-feature-settings);
  font-variation-settings: var(--fui-avatar-fallback-lg-font-variation-settings);
}

@utility fui-avatar-badge {
  --tw-sort: container-type;
  outline: var(--fui-avatar-badge-outline);
  outline-offset: var(--fui-avatar-badge-outline-offset);
  background-color: var(--fui-avatar-badge-background-color);
  color: var(--fui-avatar-badge-text-color);
  border-radius: var(--fui-avatar-badge-rounded);
  outline-color: var(--fui-avatar-badge-outline-color);
  display: var(--fui-avatar-badge-display);
  align-items: var(--fui-avatar-badge-align-items);
  justify-content: var(--fui-avatar-badge-justify-content);
}

@utility fui-avatar-badge-sm {
  --tw-sort: pointer-events;
  width: var(--fui-avatar-badge-sm-size);
  height: var(--fui-avatar-badge-sm-size);
}

@utility fui-avatar-badge-md {
  --tw-sort: pointer-events;
  width: var(--fui-avatar-badge-md-size);
  height: var(--fui-avatar-badge-md-size);
  & :where([data-icon]) {
    width: var(--fui-avatar-badge-md-icon-size);
    height: var(--fui-avatar-badge-md-icon-size);
  }
}

@utility fui-avatar-badge-lg {
  --tw-sort: pointer-events;
  width: var(--fui-avatar-badge-lg-size);
  height: var(--fui-avatar-badge-lg-size);
  & :where([data-icon]) {
    width: var(--fui-avatar-badge-lg-icon-size);
    height: var(--fui-avatar-badge-lg-icon-size);
  }
}

@utility fui-avatar-group-count {
  --tw-sort: container-type;
  outline: var(--fui-avatar-group-count-outline);
  outline-offset: var(--fui-avatar-group-count-outline-offset);
  background-color: var(--fui-avatar-group-count-background-color);
  color: var(--fui-avatar-group-count-text-color);
  border-radius: var(--fui-avatar-group-count-rounded);
  outline-color: var(--fui-avatar-group-count-outline-color);
  display: var(--fui-avatar-group-count-display);
  flex-shrink: var(--fui-avatar-group-count-flex-shrink);
  align-items: var(--fui-avatar-group-count-align-items);
  justify-content: var(--fui-avatar-group-count-justify-content);
}

@utility fui-avatar-group-count-sm {
  --tw-sort: pointer-events;
  width: var(--fui-avatar-group-count-sm-size);
  height: var(--fui-avatar-group-count-sm-size);
  font-family: var(--fui-avatar-group-count-sm-font-family);
  font-size: var(--fui-avatar-group-count-sm-font-size);
  line-height: var(--fui-avatar-group-count-sm-line-height);
  font-weight: var(--fui-avatar-group-count-sm-font-weight);
  letter-spacing: var(--fui-avatar-group-count-sm-letter-spacing);
  font-feature-settings: var(--fui-avatar-group-count-sm-font-feature-settings);
  font-variation-settings: var(--fui-avatar-group-count-sm-font-variation-settings);
  & :where([data-icon]) {
    width: var(--fui-avatar-group-count-sm-icon-size);
    height: var(--fui-avatar-group-count-sm-icon-size);
  }
}

@utility fui-avatar-group-count-md {
  --tw-sort: pointer-events;
  width: var(--fui-avatar-group-count-md-size);
  height: var(--fui-avatar-group-count-md-size);
  font-family: var(--fui-avatar-group-count-md-font-family);
  font-size: var(--fui-avatar-group-count-md-font-size);
  line-height: var(--fui-avatar-group-count-md-line-height);
  font-weight: var(--fui-avatar-group-count-md-font-weight);
  letter-spacing: var(--fui-avatar-group-count-md-letter-spacing);
  font-feature-settings: var(--fui-avatar-group-count-md-font-feature-settings);
  font-variation-settings: var(--fui-avatar-group-count-md-font-variation-settings);
  & :where([data-icon]) {
    width: var(--fui-avatar-group-count-md-icon-size);
    height: var(--fui-avatar-group-count-md-icon-size);
  }
}

@utility fui-avatar-group-count-lg {
  --tw-sort: pointer-events;
  width: var(--fui-avatar-group-count-lg-size);
  height: var(--fui-avatar-group-count-lg-size);
  font-family: var(--fui-avatar-group-count-lg-font-family);
  font-size: var(--fui-avatar-group-count-lg-font-size);
  line-height: var(--fui-avatar-group-count-lg-line-height);
  font-weight: var(--fui-avatar-group-count-lg-font-weight);
  letter-spacing: var(--fui-avatar-group-count-lg-letter-spacing);
  font-feature-settings: var(--fui-avatar-group-count-lg-font-feature-settings);
  font-variation-settings: var(--fui-avatar-group-count-lg-font-variation-settings);
  & :where([data-icon]) {
    width: var(--fui-avatar-group-count-lg-icon-size);
    height: var(--fui-avatar-group-count-lg-icon-size);
  }
}

@utility fui-avatar-group {
  --tw-sort: container-type;
  display: var(--fui-avatar-group-display);
}

@utility fui-aspect-ratio {
  --tw-sort: container-type;
  border-radius: var(--fui-aspect-ratio-rounded);
}

@utility fui-collapsible-content {
  --tw-sort: container-type;
  border-radius: var(--fui-collapsible-content-rounded);
}

@utility fui-skeleton {
  --tw-sort: container-type;
  background-color: var(--fui-skeleton-background-color);
  border-radius: var(--fui-skeleton-rounded);
}

@utility fui-spinner {
  --tw-sort: container-type;
  width: var(--fui-spinner-size);
  height: var(--fui-spinner-size);
}

@utility fui-progress {
  --tw-sort: container-type;
  background-color: var(--fui-progress-background-color);
  border-radius: var(--fui-progress-rounded);
  height: var(--fui-progress-height);
  display: var(--fui-progress-display);
  width: var(--fui-progress-width);
  align-items: var(--fui-progress-align-items);
}

@utility fui-progress-indicator {
  --tw-sort: container-type;
  background-color: var(--fui-progress-indicator-background-color);
}

@utility fui-image {
  --tw-sort: container-type;
  border-radius: var(--fui-image-rounded);
  display: var(--fui-image-display);
}

@utility fui-image-loading {
  --tw-sort: container-type;
  --fui_empty: initial;
}

@utility fui-image-loading-skeleton {
  --tw-sort: pointer-events;
  background-color: var(--fui-image-loading-skeleton-background-color);
}

@utility fui-image-loading-blur {
  --tw-sort: pointer-events;
  background-color: var(--fui-image-loading-blur-background-color);
}

@utility fui-image-fallback {
  --tw-sort: container-type;
  background-color: var(--fui-image-fallback-background-color);
  display: var(--fui-image-fallback-display);
  width: var(--fui-image-fallback-size);
  height: var(--fui-image-fallback-size);
  align-items: var(--fui-image-fallback-align-items);
  justify-content: var(--fui-image-fallback-justify-content);
}

@utility fui-scroll-area-viewport {
  --tw-sort: container-type;
  &:focus-visible {
    outline: var(--fui-scroll-area-viewport-focus-outline);
    outline-offset: var(--fui-scroll-area-viewport-focus-outline-offset);
    outline-color: var(--fui-scroll-area-viewport-focus-outline-color);
  }
}

@utility fui-scroll-area-scrollbar {
  --tw-sort: container-type;
  display: var(--fui-scroll-area-scrollbar-display);
}

@utility fui-scroll-area-scrollbar-vertical {
  --tw-sort: pointer-events;
  width: var(--fui-scroll-area-scrollbar-vertical-width);
  padding-block: var(--fui-scroll-area-scrollbar-vertical-padding-y);
  padding-inline-end: var(--fui-scroll-area-scrollbar-vertical-padding-end);
  padding-inline-start: var(--fui-scroll-area-scrollbar-vertical-padding-start);
  height: var(--fui-scroll-area-scrollbar-vertical-height);
}

@utility fui-scroll-area-scrollbar-horizontal {
  --tw-sort: pointer-events;
  height: var(--fui-scroll-area-scrollbar-horizontal-height);
  padding-inline: var(--fui-scroll-area-scrollbar-horizontal-padding-x);
  padding-bottom: var(--fui-scroll-area-scrollbar-horizontal-padding-bottom);
  padding-top: var(--fui-scroll-area-scrollbar-horizontal-padding-top);
  flex-direction: var(--fui-scroll-area-scrollbar-horizontal-flex-direction);
}

@utility fui-scroll-area-thumb {
  --tw-sort: container-type;
  background-color: var(--fui-scroll-area-thumb-background-color);
  border-radius: var(--fui-scroll-area-thumb-rounded);
}

@utility fui-table {
  --tw-sort: container-type;
  font-family: var(--fui-table-font-family);
  font-size: var(--fui-table-font-size);
  line-height: var(--fui-table-line-height);
  font-weight: var(--fui-table-font-weight);
  letter-spacing: var(--fui-table-letter-spacing);
  font-feature-settings: var(--fui-table-font-feature-settings);
  font-variation-settings: var(--fui-table-font-variation-settings);
  width: var(--fui-table-width);
}

@utility fui-table-row {
  --tw-sort: container-type;
  border-bottom: var(--fui-table-row-border-bottom);
  &:hover {
    background-color: var(--fui-table-row-hover-background-color);
  }
  &:is([data-selected=true],[aria-selected=true],[data-state=active]) {
    background-color: var(--fui-table-row-selected-background-color);
  }
}

@utility fui-table-head {
  --tw-sort: container-type;
  font-family: var(--fui-table-head-font-family);
  font-size: var(--fui-table-head-font-size);
  line-height: var(--fui-table-head-line-height);
  font-weight: var(--fui-table-head-font-weight);
  letter-spacing: var(--fui-table-head-letter-spacing);
  font-feature-settings: var(--fui-table-head-font-feature-settings);
  font-variation-settings: var(--fui-table-head-font-variation-settings);
  text-transform: var(--fui-table-head-text-transform);
  color: var(--fui-table-head-text-color);
  height: var(--fui-table-head-height);
  padding-inline: var(--fui-table-head-padding-x);
  text-align: var(--fui-table-head-text-align);
}

@utility fui-table-cell {
  --tw-sort: container-type;
  padding: var(--fui-table-cell-padding);
}

@utility fui-table-empty {
  --tw-sort: container-type;
  color: var(--fui-table-empty-text-color);
  font-family: var(--fui-table-empty-font-family);
  font-size: var(--fui-table-empty-font-size);
  line-height: var(--fui-table-empty-line-height);
  font-weight: var(--fui-table-empty-font-weight);
  letter-spacing: var(--fui-table-empty-letter-spacing);
  font-feature-settings: var(--fui-table-empty-font-feature-settings);
  font-variation-settings: var(--fui-table-empty-font-variation-settings);
  padding-inline: var(--fui-table-empty-padding-x);
  padding-block: var(--fui-table-empty-padding-y);
}

@utility fui-table-footer {
  --tw-sort: container-type;
  background-color: var(--fui-table-footer-background-color);
  border-top: var(--fui-table-footer-border-top);
  font-weight: var(--fui-table-footer-font-weight);
}

@utility fui-table-caption {
  --tw-sort: container-type;
  color: var(--fui-table-caption-text-color);
  font-family: var(--fui-table-caption-font-family);
  font-size: var(--fui-table-caption-font-size);
  line-height: var(--fui-table-caption-line-height);
  font-weight: var(--fui-table-caption-font-weight);
  letter-spacing: var(--fui-table-caption-letter-spacing);
  font-feature-settings: var(--fui-table-caption-font-feature-settings);
  font-variation-settings: var(--fui-table-caption-font-variation-settings);
  margin-top: var(--fui-table-caption-margin-top);
}

@utility fui-accordion-item {
  --tw-sort: container-type;
  border-bottom: var(--fui-accordion-item-border-bottom);
}

@utility fui-accordion-trigger {
  --tw-sort: container-type;
  border: var(--fui-accordion-trigger-border);
  border-color: var(--fui-accordion-trigger-border-color);
  border-radius: var(--fui-accordion-trigger-rounded);
  font-family: var(--fui-accordion-trigger-font-family);
  font-size: var(--fui-accordion-trigger-font-size);
  line-height: var(--fui-accordion-trigger-line-height);
  font-weight: var(--fui-accordion-trigger-font-weight);
  letter-spacing: var(--fui-accordion-trigger-letter-spacing);
  font-feature-settings: var(--fui-accordion-trigger-font-feature-settings);
  font-variation-settings: var(--fui-accordion-trigger-font-variation-settings);
  gap: var(--fui-accordion-trigger-gap);
  padding-block: var(--fui-accordion-trigger-padding-y);
  display: var(--fui-accordion-trigger-display);
  flex: var(--fui-accordion-trigger-flex);
  align-items: var(--fui-accordion-trigger-align-items);
  justify-content: var(--fui-accordion-trigger-justify-content);
  text-align: var(--fui-accordion-trigger-text-align);
  & svg {
    color: var(--fui-accordion-trigger-icon-color);
  }
  &:hover {
    text-decoration-line: var(--fui-accordion-trigger-hover-text-decoration-line);
  }
  & :where([data-icon]) {
    width: var(--fui-accordion-trigger-icon-size);
    height: var(--fui-accordion-trigger-icon-size);
  }
}

@utility fui-accordion-body {
  --tw-sort: container-type;
  font-family: var(--fui-accordion-body-font-family);
  font-size: var(--fui-accordion-body-font-size);
  line-height: var(--fui-accordion-body-line-height);
  font-weight: var(--fui-accordion-body-font-weight);
  letter-spacing: var(--fui-accordion-body-letter-spacing);
  font-feature-settings: var(--fui-accordion-body-font-feature-settings);
  font-variation-settings: var(--fui-accordion-body-font-variation-settings);
  padding-bottom: var(--fui-accordion-body-padding-bottom);
  & :where(a) {
    text-decoration-line: var(--fui-accordion-body-link-text-decoration-line);
  }
  & :where(a:hover) {
    color: var(--fui-accordion-body-link-hover-text-color);
  }
}

@utility fui-accordion {
  --tw-sort: container-type;
  display: var(--fui-accordion-display);
  width: var(--fui-accordion-width);
  flex-direction: var(--fui-accordion-flex-direction);
}

@utility fui-breadcrumb-list {
  --tw-sort: container-type;
  color: var(--fui-breadcrumb-list-text-color);
  font-family: var(--fui-breadcrumb-list-font-family);
  font-size: var(--fui-breadcrumb-list-font-size);
  line-height: var(--fui-breadcrumb-list-line-height);
  font-weight: var(--fui-breadcrumb-list-font-weight);
  letter-spacing: var(--fui-breadcrumb-list-letter-spacing);
  font-feature-settings: var(--fui-breadcrumb-list-font-feature-settings);
  font-variation-settings: var(--fui-breadcrumb-list-font-variation-settings);
  text-transform: var(--fui-breadcrumb-list-text-transform);
  gap: var(--fui-breadcrumb-list-gap);
  display: var(--fui-breadcrumb-list-display);
  flex-wrap: var(--fui-breadcrumb-list-flex-wrap);
  align-items: var(--fui-breadcrumb-list-align-items);
  @container (width >= 28rem) {
    gap: var(--fui-breadcrumb-list-md-gap);
  }
}

@utility fui-breadcrumb-item {
  --tw-sort: container-type;
  gap: var(--fui-breadcrumb-item-gap);
  display: var(--fui-breadcrumb-item-display);
  align-items: var(--fui-breadcrumb-item-align-items);
}

@utility fui-breadcrumb-link {
  --tw-sort: container-type;
  &:hover {
    color: var(--fui-breadcrumb-link-hover-text-color);
  }
}

@utility fui-breadcrumb-page {
  --tw-sort: container-type;
  color: var(--fui-breadcrumb-page-text-color);
  font-weight: var(--fui-breadcrumb-page-font-weight);
}

@utility fui-breadcrumb-separator {
  --tw-sort: container-type;
  & :where([data-icon]) {
    width: var(--fui-breadcrumb-separator-icon-size);
    height: var(--fui-breadcrumb-separator-icon-size);
  }
}

@utility fui-breadcrumb-ellipsis {
  --tw-sort: container-type;
  width: var(--fui-breadcrumb-ellipsis-size);
  height: var(--fui-breadcrumb-ellipsis-size);
  display: var(--fui-breadcrumb-ellipsis-display);
  align-items: var(--fui-breadcrumb-ellipsis-align-items);
  justify-content: var(--fui-breadcrumb-ellipsis-justify-content);
  & :where([data-icon]) {
    width: var(--fui-breadcrumb-ellipsis-icon-size);
    height: var(--fui-breadcrumb-ellipsis-icon-size);
  }
}

@utility fui-pagination-ellipsis {
  --tw-sort: container-type;
  width: var(--fui-pagination-ellipsis-size);
  height: var(--fui-pagination-ellipsis-size);
  display: var(--fui-pagination-ellipsis-display);
  align-items: var(--fui-pagination-ellipsis-align-items);
  justify-content: var(--fui-pagination-ellipsis-justify-content);
  & :where([data-icon]) {
    width: var(--fui-pagination-ellipsis-icon-size);
    height: var(--fui-pagination-ellipsis-icon-size);
  }
}

@utility fui-pagination {
  --tw-sort: container-type;
  margin-inline: var(--fui-pagination-margin-x);
  display: var(--fui-pagination-display);
  width: var(--fui-pagination-width);
  justify-content: var(--fui-pagination-justify-content);
}

@utility fui-pagination-content {
  --tw-sort: container-type;
  display: var(--fui-pagination-content-display);
  align-items: var(--fui-pagination-content-align-items);
  gap: var(--fui-pagination-content-gap);
}

@utility fui-pagination-next {
  --tw-sort: container-type;
  padding-inline-end: var(--fui-pagination-next-padding-end);
}

@utility fui-pagination-previous {
  --tw-sort: container-type;
  padding-inline-start: var(--fui-pagination-previous-padding-start);
}

@utility fui-carousel-dot {
  --tw-sort: container-type;
  background-color: var(--fui-carousel-dot-background-color);
  border-radius: var(--fui-carousel-dot-rounded);
  height: var(--fui-carousel-dot-height);
  width: var(--fui-carousel-dot-width);
  &:is([data-selected=true],[aria-selected=true],[data-state=active]) {
    background-color: var(--fui-carousel-dot-selected-background-color);
  }
}

@utility fui-carousel-progress {
  --tw-sort: container-type;
  margin-top: var(--fui-carousel-progress-margin-top);
  background-color: var(--fui-carousel-progress-background-color);
  border-radius: var(--fui-carousel-progress-rounded);
  height: var(--fui-carousel-progress-height);
  width: var(--fui-carousel-progress-width);
}

@utility fui-carousel-progress-indicator {
  --tw-sort: container-type;
  background-color: var(--fui-carousel-progress-indicator-background-color);
}

@utility fui-carousel-content {
  --tw-sort: container-type;
  display: var(--fui-carousel-content-display);
}

@utility fui-carousel-content-horizontal {
  --tw-sort: pointer-events;
  --fui_empty: initial;
}

@utility fui-carousel-content-vertical {
  --tw-sort: pointer-events;
  flex-direction: var(--fui-carousel-content-vertical-flex-direction);
  margin-top: var(--fui-carousel-content-vertical-bleed-top);
}

@utility fui-carousel-dots {
  --tw-sort: container-type;
  display: var(--fui-carousel-dots-display);
}

@utility fui-carousel-item {
  --tw-sort: container-type;
  min-width: var(--fui-carousel-item-min-width);
  flex-shrink: var(--fui-carousel-item-flex-shrink);
  flex-grow: var(--fui-carousel-item-flex-grow);
}

@utility fui-carousel-item-horizontal {
  --tw-sort: pointer-events;
  --fui_empty: initial;
}

@utility fui-carousel-item-vertical {
  --tw-sort: pointer-events;
  padding-top: var(--fui-carousel-item-vertical-padding-top);
}

@utility fui-tabs-list {
  --tw-sort: container-type;
  color: var(--fui-tabs-list-text-color);
  border-radius: var(--fui-tabs-list-rounded);
  height: var(--fui-tabs-list-height);
  padding: var(--fui-tabs-list-padding);
  display: var(--fui-tabs-list-display);
  width: var(--fui-tabs-list-width);
  align-items: var(--fui-tabs-list-align-items);
  justify-content: var(--fui-tabs-list-justify-content);
}

@utility fui-tabs-list-default {
  --tw-sort: pointer-events;
  background-color: var(--fui-tabs-list-default-background-color);
}

@utility fui-tabs-list-line {
  --tw-sort: pointer-events;
  background-color: var(--fui-tabs-list-line-background-color);
  gap: var(--fui-tabs-list-line-gap);
}

@utility fui-tabs-trigger {
  --tw-sort: container-type;
  color: var(--fui-tabs-trigger-text-color);
  border: var(--fui-tabs-trigger-border);
  border-color: var(--fui-tabs-trigger-border-color);
  border-radius: var(--fui-tabs-trigger-rounded);
  font-family: var(--fui-tabs-trigger-font-family);
  font-size: var(--fui-tabs-trigger-font-size);
  line-height: var(--fui-tabs-trigger-line-height);
  font-weight: var(--fui-tabs-trigger-font-weight);
  letter-spacing: var(--fui-tabs-trigger-letter-spacing);
  font-feature-settings: var(--fui-tabs-trigger-font-feature-settings);
  font-variation-settings: var(--fui-tabs-trigger-font-variation-settings);
  text-transform: var(--fui-tabs-trigger-text-transform);
  gap: var(--fui-tabs-trigger-gap);
  padding-inline: var(--fui-tabs-trigger-padding-x);
  padding-block: var(--fui-tabs-trigger-padding-y);
  display: var(--fui-tabs-trigger-display);
  height: var(--fui-tabs-trigger-height);
  flex: var(--fui-tabs-trigger-flex);
  align-items: var(--fui-tabs-trigger-align-items);
  justify-content: var(--fui-tabs-trigger-justify-content);
  &:hover {
    color: var(--fui-tabs-trigger-hover-text-color);
  }
  &:focus-visible {
    outline: var(--fui-tabs-trigger-focus-outline);
    outline-offset: var(--fui-tabs-trigger-focus-outline-offset);
    border-color: var(--fui-tabs-trigger-focus-border-color);
    outline-color: var(--fui-tabs-trigger-focus-outline-color);
  }
  &:is([data-selected=true],[aria-selected=true],[data-state=active]) {
    background-color: var(--fui-tabs-trigger-selected-background-color);
    color: var(--fui-tabs-trigger-selected-text-color);
  }
  & :where([data-icon]) {
    width: var(--fui-tabs-trigger-icon-size);
    height: var(--fui-tabs-trigger-icon-size);
  }
  &:has([data-icon=inline-start]) {
    padding-inline-start: var(--fui-tabs-trigger-icon-start-padding-start);
  }
  &:has([data-icon=inline-end]) {
    padding-inline-end: var(--fui-tabs-trigger-icon-end-padding-end);
  }
}

@utility fui-tabs-trigger-default {
  --tw-sort: pointer-events;
  --fui_empty: initial;
}

@utility fui-tabs-trigger-line {
  --tw-sort: pointer-events;
  &:is([data-selected=true],[aria-selected=true],[data-state=active]) {
    background-color: var(--fui-tabs-trigger-line-selected-background-color);
  }
}

@utility fui-tabs-trigger-indicator {
  --tw-sort: container-type;
  background-color: var(--fui-tabs-trigger-indicator-background-color);
}

@utility fui-tabs-content {
  --tw-sort: container-type;
  font-family: var(--fui-tabs-content-font-family);
  font-size: var(--fui-tabs-content-font-size);
  line-height: var(--fui-tabs-content-line-height);
  font-weight: var(--fui-tabs-content-font-weight);
  letter-spacing: var(--fui-tabs-content-letter-spacing);
  font-feature-settings: var(--fui-tabs-content-font-feature-settings);
  font-variation-settings: var(--fui-tabs-content-font-variation-settings);
  flex: var(--fui-tabs-content-flex);
}

@utility fui-tabs {
  --tw-sort: container-type;
  display: var(--fui-tabs-display);
  gap: var(--fui-tabs-gap);
}

@utility fui-stepper-trigger {
  --tw-sort: container-type;
  border-radius: var(--fui-stepper-trigger-rounded);
  gap: var(--fui-stepper-trigger-gap);
  padding: var(--fui-stepper-trigger-padding);
  display: var(--fui-stepper-trigger-display);
  flex-direction: var(--fui-stepper-trigger-flex-direction);
  align-items: var(--fui-stepper-trigger-align-items);
  text-align: var(--fui-stepper-trigger-text-align);
}

@utility fui-stepper-indicator {
  --tw-sort: container-type;
  border-radius: var(--fui-stepper-indicator-rounded);
  width: var(--fui-stepper-indicator-size);
  height: var(--fui-stepper-indicator-size);
  display: var(--fui-stepper-indicator-display);
  align-items: var(--fui-stepper-indicator-align-items);
  justify-content: var(--fui-stepper-indicator-justify-content);
  & :where([data-icon]) {
    width: var(--fui-stepper-indicator-icon-size);
    height: var(--fui-stepper-indicator-icon-size);
  }
}

@utility fui-stepper-indicator-inactive {
  --tw-sort: pointer-events;
  background-color: var(--fui-stepper-indicator-inactive-background-color);
  color: var(--fui-stepper-indicator-inactive-text-color);
  border: var(--fui-stepper-indicator-inactive-border);
  border-color: var(--fui-stepper-indicator-inactive-border-color);
}

@utility fui-stepper-indicator-active {
  --tw-sort: pointer-events;
  background-color: var(--fui-stepper-indicator-active-background-color);
  color: var(--fui-stepper-indicator-active-text-color);
}

@utility fui-stepper-indicator-completed {
  --tw-sort: pointer-events;
  background-color: var(--fui-stepper-indicator-completed-background-color);
  color: var(--fui-stepper-indicator-completed-text-color);
}

@utility fui-stepper-separator {
  --tw-sort: container-type;
  background-color: var(--fui-stepper-separator-background-color);
}

@utility fui-stepper-separator-fill {
  --tw-sort: container-type;
  background-color: var(--fui-stepper-separator-fill-background-color);
}

@utility fui-stepper-title {
  --tw-sort: container-type;
  font-family: var(--fui-stepper-title-font-family);
  font-size: var(--fui-stepper-title-font-size);
  line-height: var(--fui-stepper-title-line-height);
  font-weight: var(--fui-stepper-title-font-weight);
  letter-spacing: var(--fui-stepper-title-letter-spacing);
  font-feature-settings: var(--fui-stepper-title-font-feature-settings);
  font-variation-settings: var(--fui-stepper-title-font-variation-settings);
}

@utility fui-stepper-title-inactive {
  --tw-sort: pointer-events;
  color: var(--fui-stepper-title-inactive-text-color);
}

@utility fui-stepper-title-active {
  --tw-sort: pointer-events;
  font-weight: var(--fui-stepper-title-active-font-weight);
}

@utility fui-stepper-title-completed {
  --tw-sort: pointer-events;
  --fui_empty: initial;
}

@utility fui-stepper-description {
  --tw-sort: container-type;
  color: var(--fui-stepper-description-text-color);
  font-family: var(--fui-stepper-description-font-family);
  font-size: var(--fui-stepper-description-font-size);
  line-height: var(--fui-stepper-description-line-height);
  font-weight: var(--fui-stepper-description-font-weight);
  letter-spacing: var(--fui-stepper-description-letter-spacing);
  font-feature-settings: var(--fui-stepper-description-font-feature-settings);
  font-variation-settings: var(--fui-stepper-description-font-variation-settings);
}

@utility fui-stepper-status {
  --tw-sort: container-type;
  color: var(--fui-stepper-status-text-color);
  font-family: var(--fui-stepper-status-font-family);
  font-size: var(--fui-stepper-status-font-size);
  line-height: var(--fui-stepper-status-line-height);
  font-weight: var(--fui-stepper-status-font-weight);
  letter-spacing: var(--fui-stepper-status-letter-spacing);
  font-feature-settings: var(--fui-stepper-status-font-feature-settings);
  font-variation-settings: var(--fui-stepper-status-font-variation-settings);
}

@utility fui-stepper {
  --tw-sort: container-type;
  display: var(--fui-stepper-display);
  flex-wrap: var(--fui-stepper-flex-wrap);
}

@utility fui-stepper-item {
  --tw-sort: container-type;
  display: var(--fui-stepper-item-display);
  align-items: var(--fui-stepper-item-align-items);
}

@utility fui-stepper-separator-root {
  --tw-sort: container-type;
  margin-inline: var(--fui-stepper-separator-root-margin-x);
  height: var(--fui-stepper-separator-root-height);
  flex: var(--fui-stepper-separator-root-flex);
}

@utility fui-sidebar {
  --tw-sort: container-type;
  background-color: var(--fui-sidebar-background-color);
  color: var(--fui-sidebar-text-color);
  display: var(--fui-sidebar-display);
  flex-direction: var(--fui-sidebar-flex-direction);
}

@utility fui-sidebar-sidebar {
  --tw-sort: pointer-events;
  border-radius: var(--fui-sidebar-sidebar-rounded);
}

@utility fui-sidebar-variant-inset {
  --tw-sort: pointer-events;
  border-radius: var(--fui-sidebar-variant-inset-rounded);
}

@utility fui-sidebar-floating {
  --tw-sort: pointer-events;
  border: var(--fui-sidebar-floating-border);
  border-color: var(--fui-sidebar-floating-border-color);
  border-radius: var(--fui-sidebar-floating-rounded);
  box-shadow: var(--fui-sidebar-floating-shadow);
}

@utility fui-sidebar-size {
  --tw-sort: container-type;
  width: var(--fui-sidebar-size-width);
}

@utility fui-sidebar-size-icon {
  --tw-sort: pointer-events;
  width: var(--fui-sidebar-size-icon-width);
}

@utility fui-sidebar-size-icon-padded {
  --tw-sort: pointer-events;
  width: var(--fui-sidebar-size-icon-padded-width);
}

@utility fui-sidebar-size-offcanvas {
  --tw-sort: pointer-events;
  width: var(--fui-sidebar-size-offcanvas-width);
}

@utility fui-sidebar-size-mobile {
  --tw-sort: pointer-events;
  width: var(--fui-sidebar-size-mobile-width);
  padding: var(--fui-sidebar-size-mobile-padding);
}

@utility fui-sidebar-container {
  --tw-sort: container-type;
  display: var(--fui-sidebar-container-display);
  height: var(--fui-sidebar-container-height);
}

@utility fui-sidebar-container-start {
  --tw-sort: pointer-events;
  border-inline-end: var(--fui-sidebar-container-start-border-end);
}

@utility fui-sidebar-container-end {
  --tw-sort: pointer-events;
  border-inline-start: var(--fui-sidebar-container-end-border-start);
}

@utility fui-sidebar-container-padded {
  --tw-sort: pointer-events;
  padding: var(--fui-sidebar-container-padded-padding);
}

@utility fui-sidebar-container-icon {
  --tw-sort: pointer-events;
  width: var(--fui-sidebar-container-icon-width);
}

@utility fui-sidebar-container-icon-padded {
  --tw-sort: pointer-events;
  width: var(--fui-sidebar-container-icon-padded-width);
}

@utility fui-sidebar-wrapper {
  --tw-sort: container-type;
  display: var(--fui-sidebar-wrapper-display);
  min-height: var(--fui-sidebar-wrapper-min-height);
  width: var(--fui-sidebar-wrapper-width);
}

@utility fui-sidebar-wrapper-default {
  --tw-sort: pointer-events;
  background-color: var(--fui-sidebar-wrapper-default-background-color);
}

@utility fui-sidebar-wrapper-inset {
  --tw-sort: pointer-events;
  background-color: var(--fui-sidebar-wrapper-inset-background-color);
}

@utility fui-sidebar-inset {
  --tw-sort: container-type;
  background-color: var(--fui-sidebar-inset-background-color);
  display: var(--fui-sidebar-inset-display);
  width: var(--fui-sidebar-inset-width);
  flex: var(--fui-sidebar-inset-flex);
  flex-direction: var(--fui-sidebar-inset-flex-direction);
}

@utility fui-sidebar-inset-flat {
  --tw-sort: pointer-events;
  border-radius: var(--fui-sidebar-inset-flat-rounded);
}

@utility fui-sidebar-inset-raised {
  --tw-sort: pointer-events;
  border-radius: var(--fui-sidebar-inset-raised-rounded);
  box-shadow: var(--fui-sidebar-inset-raised-shadow);
  margin: var(--fui-sidebar-inset-raised-margin);
  margin-inline-start: var(--fui-sidebar-inset-raised-margin-start);
}

@utility fui-sidebar-header {
  --tw-sort: container-type;
  gap: var(--fui-sidebar-header-gap);
  padding: var(--fui-sidebar-header-padding);
  display: var(--fui-sidebar-header-display);
  flex-direction: var(--fui-sidebar-header-flex-direction);
}

@utility fui-sidebar-footer {
  --tw-sort: container-type;
  gap: var(--fui-sidebar-footer-gap);
  padding: var(--fui-sidebar-footer-padding);
  display: var(--fui-sidebar-footer-display);
  flex-direction: var(--fui-sidebar-footer-flex-direction);
}

@utility fui-sidebar-group {
  --tw-sort: container-type;
  padding: var(--fui-sidebar-group-padding);
  display: var(--fui-sidebar-group-display);
  width: var(--fui-sidebar-group-width);
  min-width: var(--fui-sidebar-group-min-width);
  flex-direction: var(--fui-sidebar-group-flex-direction);
}

@utility fui-sidebar-menu {
  --tw-sort: container-type;
  gap: var(--fui-sidebar-menu-gap);
  display: var(--fui-sidebar-menu-display);
  width: var(--fui-sidebar-menu-width);
  min-width: var(--fui-sidebar-menu-min-width);
  flex-direction: var(--fui-sidebar-menu-flex-direction);
}

@utility fui-sidebar-separator {
  --tw-sort: container-type;
  margin-inline: var(--fui-sidebar-separator-margin-x);
  width: var(--fui-sidebar-separator-width);
}

@utility fui-sidebar-content {
  --tw-sort: container-type;
  scrollbar-width: var(--fui-sidebar-content-scrollbar);
  min-height: var(--fui-sidebar-content-min-height);
  gap: var(--fui-sidebar-content-gap);
  display: var(--fui-sidebar-content-display);
  flex: var(--fui-sidebar-content-flex);
  flex-direction: var(--fui-sidebar-content-flex-direction);
  &::-webkit-scrollbar {
    display: var(--fui-sidebar-content-scrollbar);
  }
}

@utility fui-sidebar-group-label {
  --tw-sort: container-type;
  color: var(--fui-sidebar-group-label-text-color);
  border-radius: var(--fui-sidebar-group-label-rounded);
  font-family: var(--fui-sidebar-group-label-font-family);
  font-size: var(--fui-sidebar-group-label-font-size);
  line-height: var(--fui-sidebar-group-label-line-height);
  font-weight: var(--fui-sidebar-group-label-font-weight);
  letter-spacing: var(--fui-sidebar-group-label-letter-spacing);
  font-feature-settings: var(--fui-sidebar-group-label-font-feature-settings);
  font-variation-settings: var(--fui-sidebar-group-label-font-variation-settings);
  text-transform: var(--fui-sidebar-group-label-text-transform);
  height: var(--fui-sidebar-group-label-height);
  padding-inline: var(--fui-sidebar-group-label-padding-x);
  display: var(--fui-sidebar-group-label-display);
  flex-shrink: var(--fui-sidebar-group-label-flex-shrink);
  align-items: var(--fui-sidebar-group-label-align-items);
  & :where([data-icon]) {
    width: var(--fui-sidebar-group-label-icon-size);
    height: var(--fui-sidebar-group-label-icon-size);
  }
}

@utility fui-sidebar-group-content {
  --tw-sort: container-type;
  font-family: var(--fui-sidebar-group-content-font-family);
  font-size: var(--fui-sidebar-group-content-font-size);
  line-height: var(--fui-sidebar-group-content-line-height);
  font-weight: var(--fui-sidebar-group-content-font-weight);
  letter-spacing: var(--fui-sidebar-group-content-letter-spacing);
  font-feature-settings: var(--fui-sidebar-group-content-font-feature-settings);
  font-variation-settings: var(--fui-sidebar-group-content-font-variation-settings);
  width: var(--fui-sidebar-group-content-width);
}

@utility fui-sidebar-input {
  --tw-sort: container-type;
  background-color: var(--fui-sidebar-input-background-color);
  box-shadow: var(--fui-sidebar-input-shadow);
  height: var(--fui-sidebar-input-height);
  width: var(--fui-sidebar-input-width);
}

@utility fui-sidebar-action {
  --tw-sort: container-type;
  color: var(--fui-sidebar-action-text-color);
  border-radius: var(--fui-sidebar-action-rounded);
  width: var(--fui-sidebar-action-width);
  padding: var(--fui-sidebar-action-padding);
  display: var(--fui-sidebar-action-display);
  align-items: var(--fui-sidebar-action-align-items);
  justify-content: var(--fui-sidebar-action-justify-content);
  &:hover {
    background-color: var(--fui-sidebar-action-hover-background-color);
    color: var(--fui-sidebar-action-hover-text-color);
  }
  & :where([data-icon]) {
    width: var(--fui-sidebar-action-icon-size);
    height: var(--fui-sidebar-action-icon-size);
  }
}

@utility fui-sidebar-menu-badge {
  --tw-sort: container-type;
  color: var(--fui-sidebar-menu-badge-text-color);
  border-radius: var(--fui-sidebar-menu-badge-rounded);
  font-family: var(--fui-sidebar-menu-badge-font-family);
  font-size: var(--fui-sidebar-menu-badge-font-size);
  line-height: var(--fui-sidebar-menu-badge-line-height);
  font-weight: var(--fui-sidebar-menu-badge-font-weight);
  letter-spacing: var(--fui-sidebar-menu-badge-letter-spacing);
  font-feature-settings: var(--fui-sidebar-menu-badge-font-feature-settings);
  font-variation-settings: var(--fui-sidebar-menu-badge-font-variation-settings);
  height: var(--fui-sidebar-menu-badge-height);
  min-width: var(--fui-sidebar-menu-badge-min-width);
  padding-inline: var(--fui-sidebar-menu-badge-padding-x);
  display: var(--fui-sidebar-menu-badge-display);
  align-items: var(--fui-sidebar-menu-badge-align-items);
  justify-content: var(--fui-sidebar-menu-badge-justify-content);
}

@utility fui-sidebar-menu-button {
  --tw-sort: container-type;
  border-radius: var(--fui-sidebar-menu-button-rounded);
  padding-inline: var(--fui-sidebar-menu-button-padding-x);
  padding-block: var(--fui-sidebar-menu-button-padding-y);
  display: var(--fui-sidebar-menu-button-display);
  width: var(--fui-sidebar-menu-button-width);
  align-items: var(--fui-sidebar-menu-button-align-items);
  text-align: var(--fui-sidebar-menu-button-text-align);
  &:hover {
    background-color: var(--fui-sidebar-menu-button-hover-background-color);
    color: var(--fui-sidebar-menu-button-hover-text-color);
  }
  &:active {
    background-color: var(--fui-sidebar-menu-button-active-background-color);
    color: var(--fui-sidebar-menu-button-active-text-color);
  }
  &[data-active]:not([data-active=false]) {
    background-color: var(--fui-sidebar-menu-button-current-background-color);
    color: var(--fui-sidebar-menu-button-current-text-color);
    font-weight: var(--fui-sidebar-menu-button-current-font-weight);
  }
  & :where([data-icon]) {
    width: var(--fui-sidebar-menu-button-icon-size);
    height: var(--fui-sidebar-menu-button-icon-size);
  }
}

@utility fui-sidebar-menu-button-default {
  --tw-sort: pointer-events;
  background-color: var(--fui-sidebar-menu-button-default-background-color);
}

@utility fui-sidebar-menu-button-outline {
  --tw-sort: pointer-events;
  outline: var(--fui-sidebar-menu-button-outline-outline);
  outline-offset: var(--fui-sidebar-menu-button-outline-outline-offset);
  background-color: var(--fui-sidebar-menu-button-outline-background-color);
  outline-color: var(--fui-sidebar-menu-button-outline-outline-color);
  &:hover {
    outline-color: var(--fui-sidebar-menu-button-outline-hover-outline-color);
  }
}

@utility fui-sidebar-menu-button-md {
  --tw-sort: pointer-events;
  font-family: var(--fui-sidebar-menu-button-md-font-family);
  font-size: var(--fui-sidebar-menu-button-md-font-size);
  line-height: var(--fui-sidebar-menu-button-md-line-height);
  font-weight: var(--fui-sidebar-menu-button-md-font-weight);
  letter-spacing: var(--fui-sidebar-menu-button-md-letter-spacing);
  font-feature-settings: var(--fui-sidebar-menu-button-md-font-feature-settings);
  font-variation-settings: var(--fui-sidebar-menu-button-md-font-variation-settings);
  height: var(--fui-sidebar-menu-button-md-height);
  &:where(.fui-sidebar-menu-button-collapsed) {
    height: var(--fui-sidebar-menu-button-md-collapsed-height);
  }
}

@utility fui-sidebar-menu-button-sm {
  --tw-sort: pointer-events;
  font-family: var(--fui-sidebar-menu-button-sm-font-family);
  font-size: var(--fui-sidebar-menu-button-sm-font-size);
  line-height: var(--fui-sidebar-menu-button-sm-line-height);
  font-weight: var(--fui-sidebar-menu-button-sm-font-weight);
  letter-spacing: var(--fui-sidebar-menu-button-sm-letter-spacing);
  font-feature-settings: var(--fui-sidebar-menu-button-sm-font-feature-settings);
  font-variation-settings: var(--fui-sidebar-menu-button-sm-font-variation-settings);
  height: var(--fui-sidebar-menu-button-sm-height);
  &:where(.fui-sidebar-menu-button-collapsed) {
    height: var(--fui-sidebar-menu-button-sm-collapsed-height);
  }
}

@utility fui-sidebar-menu-button-lg {
  --tw-sort: pointer-events;
  font-family: var(--fui-sidebar-menu-button-lg-font-family);
  font-size: var(--fui-sidebar-menu-button-lg-font-size);
  line-height: var(--fui-sidebar-menu-button-lg-line-height);
  font-weight: var(--fui-sidebar-menu-button-lg-font-weight);
  letter-spacing: var(--fui-sidebar-menu-button-lg-letter-spacing);
  font-feature-settings: var(--fui-sidebar-menu-button-lg-font-feature-settings);
  font-variation-settings: var(--fui-sidebar-menu-button-lg-font-variation-settings);
  height: var(--fui-sidebar-menu-button-lg-height);
  &:where(.fui-sidebar-menu-button-collapsed) {
    height: var(--fui-sidebar-menu-button-lg-collapsed-height);
    padding: var(--fui-sidebar-menu-button-lg-collapsed-padding);
  }
}

@utility fui-sidebar-menu-button-expanded {
  --tw-sort: pointer-events;
  gap: var(--fui-sidebar-menu-button-expanded-gap);
}

@utility fui-sidebar-menu-button-collapsed {
  --tw-sort: pointer-events;
  gap: var(--fui-sidebar-menu-button-collapsed-gap);
  height: var(--fui-sidebar-menu-button-collapsed-height);
  width: var(--fui-sidebar-menu-button-collapsed-width);
  padding: var(--fui-sidebar-menu-button-collapsed-padding);
  &:where(.fui-sidebar-menu-button-md) {
    height: var(--fui-sidebar-menu-button-md-collapsed-height);
  }
  &:where(.fui-sidebar-menu-button-sm) {
    height: var(--fui-sidebar-menu-button-sm-collapsed-height);
  }
  &:where(.fui-sidebar-menu-button-lg) {
    height: var(--fui-sidebar-menu-button-lg-collapsed-height);
    padding: var(--fui-sidebar-menu-button-lg-collapsed-padding);
  }
}

@utility fui-sidebar-menu-sub {
  --tw-sort: container-type;
  margin-inline: var(--fui-sidebar-menu-sub-margin-x);
  border-inline-start: var(--fui-sidebar-menu-sub-border-start);
  gap: var(--fui-sidebar-menu-sub-gap);
  padding-inline: var(--fui-sidebar-menu-sub-padding-x);
  padding-block: var(--fui-sidebar-menu-sub-padding-y);
  display: var(--fui-sidebar-menu-sub-display);
  min-width: var(--fui-sidebar-menu-sub-min-width);
  flex-direction: var(--fui-sidebar-menu-sub-flex-direction);
}

@utility fui-sidebar-menu-sub-button {
  --tw-sort: container-type;
  color: var(--fui-sidebar-menu-sub-button-text-color);
  border-radius: var(--fui-sidebar-menu-sub-button-rounded);
  height: var(--fui-sidebar-menu-sub-button-height);
  gap: var(--fui-sidebar-menu-sub-button-gap);
  padding-inline: var(--fui-sidebar-menu-sub-button-padding-x);
  display: var(--fui-sidebar-menu-sub-button-display);
  min-width: var(--fui-sidebar-menu-sub-button-min-width);
  align-items: var(--fui-sidebar-menu-sub-button-align-items);
  & svg {
    color: var(--fui-sidebar-menu-sub-button-icon-color);
  }
  &:hover {
    background-color: var(--fui-sidebar-menu-sub-button-hover-background-color);
    color: var(--fui-sidebar-menu-sub-button-hover-text-color);
  }
  &:active {
    background-color: var(--fui-sidebar-menu-sub-button-active-background-color);
    color: var(--fui-sidebar-menu-sub-button-active-text-color);
  }
  &[data-active]:not([data-active=false]) {
    background-color: var(--fui-sidebar-menu-sub-button-current-background-color);
    color: var(--fui-sidebar-menu-sub-button-current-text-color);
  }
  & :where([data-icon]) {
    width: var(--fui-sidebar-menu-sub-button-icon-size);
    height: var(--fui-sidebar-menu-sub-button-icon-size);
  }
}

@utility fui-sidebar-menu-sub-button-sm {
  --tw-sort: pointer-events;
  font-family: var(--fui-sidebar-menu-sub-button-sm-font-family);
  font-size: var(--fui-sidebar-menu-sub-button-sm-font-size);
  line-height: var(--fui-sidebar-menu-sub-button-sm-line-height);
  font-weight: var(--fui-sidebar-menu-sub-button-sm-font-weight);
  letter-spacing: var(--fui-sidebar-menu-sub-button-sm-letter-spacing);
  font-feature-settings: var(--fui-sidebar-menu-sub-button-sm-font-feature-settings);
  font-variation-settings: var(--fui-sidebar-menu-sub-button-sm-font-variation-settings);
}

@utility fui-sidebar-menu-sub-button-md {
  --tw-sort: pointer-events;
  font-family: var(--fui-sidebar-menu-sub-button-md-font-family);
  font-size: var(--fui-sidebar-menu-sub-button-md-font-size);
  line-height: var(--fui-sidebar-menu-sub-button-md-line-height);
  font-weight: var(--fui-sidebar-menu-sub-button-md-font-weight);
  letter-spacing: var(--fui-sidebar-menu-sub-button-md-letter-spacing);
  font-feature-settings: var(--fui-sidebar-menu-sub-button-md-font-feature-settings);
  font-variation-settings: var(--fui-sidebar-menu-sub-button-md-font-variation-settings);
}

@utility fui-sidebar-menu-skeleton {
  --tw-sort: container-type;
  border-radius: var(--fui-sidebar-menu-skeleton-rounded);
  height: var(--fui-sidebar-menu-skeleton-height);
  gap: var(--fui-sidebar-menu-skeleton-gap);
  padding-inline: var(--fui-sidebar-menu-skeleton-padding-x);
  display: var(--fui-sidebar-menu-skeleton-display);
  align-items: var(--fui-sidebar-menu-skeleton-align-items);
}

@utility fui-sidebar-rail {
  --tw-sort: container-type;
  width: var(--fui-sidebar-rail-width);
  display: var(--fui-sidebar-rail-display);
}

@utility fui-sidebar-rail-default {
  --tw-sort: pointer-events;
  --fui_empty: initial;
}

@utility fui-sidebar-rail-offcanvas {
  --tw-sort: pointer-events;
  &:hover {
    background-color: var(--fui-sidebar-rail-offcanvas-hover-background-color);
  }
}

@utility fui-sidebar-rail-line {
  --tw-sort: container-type;
  background-color: var(--fui-sidebar-rail-line-background-color);
  width: var(--fui-sidebar-rail-line-width);
}

@utility fui-calendar-cell-trigger {
  --tw-sort: container-type;
  border: var(--fui-calendar-cell-trigger-border);
  border-color: var(--fui-calendar-cell-trigger-border-color);
  border-radius: var(--fui-calendar-cell-trigger-rounded);
  font-family: var(--fui-calendar-cell-trigger-font-family);
  font-size: var(--fui-calendar-cell-trigger-font-size);
  line-height: var(--fui-calendar-cell-trigger-line-height);
  font-weight: var(--fui-calendar-cell-trigger-font-weight);
  letter-spacing: var(--fui-calendar-cell-trigger-letter-spacing);
  font-feature-settings: var(--fui-calendar-cell-trigger-font-feature-settings);
  font-variation-settings: var(--fui-calendar-cell-trigger-font-variation-settings);
  text-transform: var(--fui-calendar-cell-trigger-text-transform);
  width: var(--fui-calendar-cell-trigger-size);
  height: var(--fui-calendar-cell-trigger-size);
  padding: var(--fui-calendar-cell-trigger-padding);
  gap: var(--fui-calendar-cell-trigger-gap);
  display: var(--fui-calendar-cell-trigger-display);
  flex-shrink: var(--fui-calendar-cell-trigger-flex-shrink);
  align-items: var(--fui-calendar-cell-trigger-align-items);
  justify-content: var(--fui-calendar-cell-trigger-justify-content);
  &:hover {
    background-color: var(--fui-calendar-cell-trigger-hover-background-color);
    color: var(--fui-calendar-cell-trigger-hover-text-color);
  }
  &:active:not([aria-haspopup]) {
    translate: var(--fui-calendar-cell-trigger-pressed-translate);
  }
  &:is([data-state=open],[aria-expanded=true]) {
    background-color: var(--fui-calendar-cell-trigger-open-background-color);
    color: var(--fui-calendar-cell-trigger-open-text-color);
  }
  &:is([data-selected=true],[aria-selected=true],[data-state=active]) {
    background-color: var(--fui-calendar-cell-trigger-selected-background-color);
    color: var(--fui-calendar-cell-trigger-selected-text-color);
  }
  & :where([data-icon]) {
    width: var(--fui-calendar-cell-trigger-icon-size);
    height: var(--fui-calendar-cell-trigger-icon-size);
  }
  &:has([data-icon=inline-start]) {
    padding-inline-start: var(--fui-calendar-cell-trigger-icon-start-padding-start);
  }
  &:has([data-icon=inline-end]) {
    padding-inline-end: var(--fui-calendar-cell-trigger-icon-end-padding-end);
  }
}

@utility fui-calendar-cell-trigger-current {
  --tw-sort: pointer-events;
  color: var(--fui-calendar-cell-trigger-current-text-color);
}

@utility fui-calendar-cell-trigger-today {
  --tw-sort: pointer-events;
  background-color: var(--fui-calendar-cell-trigger-today-background-color);
  color: var(--fui-calendar-cell-trigger-today-text-color);
}

@utility fui-calendar-cell-trigger-outside {
  --tw-sort: pointer-events;
  color: var(--fui-calendar-cell-trigger-outside-text-color);
}

@utility fui-calendar-nav {
  --tw-sort: container-type;
  border: var(--fui-calendar-nav-border);
  border-radius: var(--fui-calendar-nav-rounded);
  font-family: var(--fui-calendar-nav-font-family);
  font-size: var(--fui-calendar-nav-font-size);
  line-height: var(--fui-calendar-nav-line-height);
  font-weight: var(--fui-calendar-nav-font-weight);
  letter-spacing: var(--fui-calendar-nav-letter-spacing);
  font-feature-settings: var(--fui-calendar-nav-font-feature-settings);
  font-variation-settings: var(--fui-calendar-nav-font-variation-settings);
  text-transform: var(--fui-calendar-nav-text-transform);
  background-color: var(--fui-calendar-nav-background-color);
  border-color: var(--fui-calendar-nav-border-color);
  opacity: var(--fui-calendar-nav-opacity);
  width: var(--fui-calendar-nav-size);
  height: var(--fui-calendar-nav-size);
  padding: var(--fui-calendar-nav-padding);
  display: var(--fui-calendar-nav-display);
  flex-shrink: var(--fui-calendar-nav-flex-shrink);
  align-items: var(--fui-calendar-nav-align-items);
  justify-content: var(--fui-calendar-nav-justify-content);
  &:hover {
    background-color: var(--fui-calendar-nav-hover-background-color);
    color: var(--fui-calendar-nav-hover-text-color);
    opacity: var(--fui-calendar-nav-hover-opacity);
  }
  &:active:not([aria-haspopup]) {
    translate: var(--fui-calendar-nav-pressed-translate);
  }
  &:is([data-state=open],[aria-expanded=true]) {
    background-color: var(--fui-calendar-nav-open-background-color);
    color: var(--fui-calendar-nav-open-text-color);
  }
  & :where([data-icon]) {
    width: var(--fui-calendar-nav-icon-size);
    height: var(--fui-calendar-nav-icon-size);
  }
}

@utility fui-calendar-cell {
  --tw-sort: container-type;
  font-family: var(--fui-calendar-cell-font-family);
  font-size: var(--fui-calendar-cell-font-size);
  line-height: var(--fui-calendar-cell-line-height);
  font-weight: var(--fui-calendar-cell-font-weight);
  letter-spacing: var(--fui-calendar-cell-letter-spacing);
  font-feature-settings: var(--fui-calendar-cell-font-feature-settings);
  font-variation-settings: var(--fui-calendar-cell-font-variation-settings);
  padding: var(--fui-calendar-cell-padding);
  flex: var(--fui-calendar-cell-flex);
  text-align: var(--fui-calendar-cell-text-align);
  &:is([data-selected=true],[aria-selected=true],[data-state=active]) {
    background-color: var(--fui-calendar-cell-selected-background-color);
    border-radius: var(--fui-calendar-cell-selected-rounded);
  }
}

@utility fui-calendar {
  --tw-sort: container-type;
  padding: var(--fui-calendar-padding);
}

@utility fui-calendar-header {
  --tw-sort: container-type;
  padding-inline: var(--fui-calendar-header-padding-x);
  display: var(--fui-calendar-header-display);
  justify-content: var(--fui-calendar-header-justify-content);
  align-items: var(--fui-calendar-header-align-items);
  width: var(--fui-calendar-header-width);
}

@utility fui-calendar-head-cell {
  --tw-sort: container-type;
  color: var(--fui-calendar-head-cell-text-color);
  font-family: var(--fui-calendar-head-cell-font-family);
  font-size: var(--fui-calendar-head-cell-font-size);
  line-height: var(--fui-calendar-head-cell-line-height);
  font-weight: var(--fui-calendar-head-cell-font-weight);
  letter-spacing: var(--fui-calendar-head-cell-letter-spacing);
  font-feature-settings: var(--fui-calendar-head-cell-font-feature-settings);
  font-variation-settings: var(--fui-calendar-head-cell-font-variation-settings);
  flex: var(--fui-calendar-head-cell-flex);
}

@utility fui-calendar-heading {
  --tw-sort: container-type;
  font-family: var(--fui-calendar-heading-font-family);
  font-size: var(--fui-calendar-heading-font-size);
  line-height: var(--fui-calendar-heading-line-height);
  font-weight: var(--fui-calendar-heading-font-weight);
  letter-spacing: var(--fui-calendar-heading-letter-spacing);
  font-feature-settings: var(--fui-calendar-heading-font-feature-settings);
  font-variation-settings: var(--fui-calendar-heading-font-variation-settings);
}

@utility fui-range-calendar-cell-trigger {
  --tw-sort: container-type;
  border: var(--fui-range-calendar-cell-trigger-border);
  border-color: var(--fui-range-calendar-cell-trigger-border-color);
  border-radius: var(--fui-range-calendar-cell-trigger-rounded);
  font-family: var(--fui-range-calendar-cell-trigger-font-family);
  font-size: var(--fui-range-calendar-cell-trigger-font-size);
  line-height: var(--fui-range-calendar-cell-trigger-line-height);
  font-weight: var(--fui-range-calendar-cell-trigger-font-weight);
  letter-spacing: var(--fui-range-calendar-cell-trigger-letter-spacing);
  font-feature-settings: var(--fui-range-calendar-cell-trigger-font-feature-settings);
  font-variation-settings: var(--fui-range-calendar-cell-trigger-font-variation-settings);
  text-transform: var(--fui-range-calendar-cell-trigger-text-transform);
  width: var(--fui-range-calendar-cell-trigger-size);
  height: var(--fui-range-calendar-cell-trigger-size);
  padding: var(--fui-range-calendar-cell-trigger-padding);
  gap: var(--fui-range-calendar-cell-trigger-gap);
  display: var(--fui-range-calendar-cell-trigger-display);
  flex-shrink: var(--fui-range-calendar-cell-trigger-flex-shrink);
  align-items: var(--fui-range-calendar-cell-trigger-align-items);
  justify-content: var(--fui-range-calendar-cell-trigger-justify-content);
  &:hover {
    background-color: var(--fui-range-calendar-cell-trigger-hover-background-color);
    color: var(--fui-range-calendar-cell-trigger-hover-text-color);
  }
  &:active:not([aria-haspopup]) {
    translate: var(--fui-range-calendar-cell-trigger-pressed-translate);
  }
  &:is([data-state=open],[aria-expanded=true]) {
    background-color: var(--fui-range-calendar-cell-trigger-open-background-color);
    color: var(--fui-range-calendar-cell-trigger-open-text-color);
  }
  & :where([data-icon]) {
    width: var(--fui-range-calendar-cell-trigger-icon-size);
    height: var(--fui-range-calendar-cell-trigger-icon-size);
  }
  &:has([data-icon=inline-start]) {
    padding-inline-start: var(--fui-range-calendar-cell-trigger-icon-start-padding-start);
  }
  &:has([data-icon=inline-end]) {
    padding-inline-end: var(--fui-range-calendar-cell-trigger-icon-end-padding-end);
  }
}

@utility fui-range-calendar-cell-trigger-middle {
  --tw-sort: pointer-events;
  --fui_empty: initial;
}

@utility fui-range-calendar-cell-trigger-edge {
  --tw-sort: pointer-events;
  &:where(.fui-range-calendar-cell-trigger-current) {
    background-color: var(--fui-range-calendar-cell-trigger-edge-current-background-color);
    color: var(--fui-range-calendar-cell-trigger-edge-current-text-color);
    &:hover {
      background-color: var(--fui-range-calendar-cell-trigger-edge-current-hover-background-color);
      color: var(--fui-range-calendar-cell-trigger-edge-current-hover-text-color);
    }
    &:focus-visible {
      background-color: var(--fui-range-calendar-cell-trigger-edge-current-focus-background-color);
      color: var(--fui-range-calendar-cell-trigger-edge-current-focus-text-color);
    }
  }
  &:where(.fui-range-calendar-cell-trigger-today) {
    background-color: var(--fui-range-calendar-cell-trigger-edge-today-background-color);
    color: var(--fui-range-calendar-cell-trigger-edge-today-text-color);
    &:hover {
      background-color: var(--fui-range-calendar-cell-trigger-edge-today-hover-background-color);
      color: var(--fui-range-calendar-cell-trigger-edge-today-hover-text-color);
    }
    &:focus-visible {
      background-color: var(--fui-range-calendar-cell-trigger-edge-today-focus-background-color);
      color: var(--fui-range-calendar-cell-trigger-edge-today-focus-text-color);
    }
  }
  &:where(.fui-range-calendar-cell-trigger-outside) {
    background-color: var(--fui-range-calendar-cell-trigger-edge-outside-background-color);
    color: var(--fui-range-calendar-cell-trigger-edge-outside-text-color);
    &:hover {
      background-color: var(--fui-range-calendar-cell-trigger-edge-outside-hover-background-color);
      color: var(--fui-range-calendar-cell-trigger-edge-outside-hover-text-color);
    }
    &:focus-visible {
      background-color: var(--fui-range-calendar-cell-trigger-edge-outside-focus-background-color);
      color: var(--fui-range-calendar-cell-trigger-edge-outside-focus-text-color);
    }
  }
}

@utility fui-range-calendar-cell-trigger-current {
  --tw-sort: pointer-events;
  color: var(--fui-range-calendar-cell-trigger-current-text-color);
  &:where(.fui-range-calendar-cell-trigger-edge) {
    background-color: var(--fui-range-calendar-cell-trigger-edge-current-background-color);
    color: var(--fui-range-calendar-cell-trigger-edge-current-text-color);
    &:hover {
      background-color: var(--fui-range-calendar-cell-trigger-edge-current-hover-background-color);
      color: var(--fui-range-calendar-cell-trigger-edge-current-hover-text-color);
    }
    &:focus-visible {
      background-color: var(--fui-range-calendar-cell-trigger-edge-current-focus-background-color);
      color: var(--fui-range-calendar-cell-trigger-edge-current-focus-text-color);
    }
  }
}

@utility fui-range-calendar-cell-trigger-today {
  --tw-sort: pointer-events;
  background-color: var(--fui-range-calendar-cell-trigger-today-background-color);
  color: var(--fui-range-calendar-cell-trigger-today-text-color);
  &:where(.fui-range-calendar-cell-trigger-edge) {
    background-color: var(--fui-range-calendar-cell-trigger-edge-today-background-color);
    color: var(--fui-range-calendar-cell-trigger-edge-today-text-color);
    &:hover {
      background-color: var(--fui-range-calendar-cell-trigger-edge-today-hover-background-color);
      color: var(--fui-range-calendar-cell-trigger-edge-today-hover-text-color);
    }
    &:focus-visible {
      background-color: var(--fui-range-calendar-cell-trigger-edge-today-focus-background-color);
      color: var(--fui-range-calendar-cell-trigger-edge-today-focus-text-color);
    }
  }
}

@utility fui-range-calendar-cell-trigger-outside {
  --tw-sort: pointer-events;
  color: var(--fui-range-calendar-cell-trigger-outside-text-color);
  &:where(.fui-range-calendar-cell-trigger-edge) {
    background-color: var(--fui-range-calendar-cell-trigger-edge-outside-background-color);
    color: var(--fui-range-calendar-cell-trigger-edge-outside-text-color);
    &:hover {
      background-color: var(--fui-range-calendar-cell-trigger-edge-outside-hover-background-color);
      color: var(--fui-range-calendar-cell-trigger-edge-outside-hover-text-color);
    }
    &:focus-visible {
      background-color: var(--fui-range-calendar-cell-trigger-edge-outside-focus-background-color);
      color: var(--fui-range-calendar-cell-trigger-edge-outside-focus-text-color);
    }
  }
}

@utility fui-range-calendar-cell {
  --tw-sort: container-type;
  font-family: var(--fui-range-calendar-cell-font-family);
  font-size: var(--fui-range-calendar-cell-font-size);
  line-height: var(--fui-range-calendar-cell-line-height);
  font-weight: var(--fui-range-calendar-cell-font-weight);
  letter-spacing: var(--fui-range-calendar-cell-letter-spacing);
  font-feature-settings: var(--fui-range-calendar-cell-font-feature-settings);
  font-variation-settings: var(--fui-range-calendar-cell-font-variation-settings);
  padding: var(--fui-range-calendar-cell-padding);
  text-align: var(--fui-range-calendar-cell-text-align);
  &:is([data-selected=true],[aria-selected=true],[data-state=active]) {
    background-color: var(--fui-range-calendar-cell-selected-background-color);
  }
}

@utility fui-range-calendar-cell-none {
  --tw-sort: pointer-events;
  --fui_empty: initial;
}

@utility fui-range-calendar-cell-start {
  --tw-sort: pointer-events;
  &:is([data-selected=true],[aria-selected=true],[data-state=active]) {
    border-top-left-radius: var(--fui-range-calendar-cell-start-selected-border-top-left-radius);
    border-bottom-left-radius: var(--fui-range-calendar-cell-start-selected-border-bottom-left-radius);
  }
}

@utility fui-range-calendar-cell-end {
  --tw-sort: pointer-events;
  &:is([data-selected=true],[aria-selected=true],[data-state=active]) {
    border-top-right-radius: var(--fui-range-calendar-cell-end-selected-border-top-right-radius);
    border-bottom-right-radius: var(--fui-range-calendar-cell-end-selected-border-bottom-right-radius);
  }
}

@utility fui-range-calendar-cell-both {
  --tw-sort: pointer-events;
  &:is([data-selected=true],[aria-selected=true],[data-state=active]) {
    border-radius: var(--fui-range-calendar-cell-both-selected-rounded);
  }
}

@utility fui-range-calendar-nav {
  --tw-sort: container-type;
  border: var(--fui-range-calendar-nav-border);
  border-radius: var(--fui-range-calendar-nav-rounded);
  font-family: var(--fui-range-calendar-nav-font-family);
  font-size: var(--fui-range-calendar-nav-font-size);
  line-height: var(--fui-range-calendar-nav-line-height);
  font-weight: var(--fui-range-calendar-nav-font-weight);
  letter-spacing: var(--fui-range-calendar-nav-letter-spacing);
  font-feature-settings: var(--fui-range-calendar-nav-font-feature-settings);
  font-variation-settings: var(--fui-range-calendar-nav-font-variation-settings);
  text-transform: var(--fui-range-calendar-nav-text-transform);
  background-color: var(--fui-range-calendar-nav-background-color);
  border-color: var(--fui-range-calendar-nav-border-color);
  opacity: var(--fui-range-calendar-nav-opacity);
  width: var(--fui-range-calendar-nav-size);
  height: var(--fui-range-calendar-nav-size);
  padding: var(--fui-range-calendar-nav-padding);
  display: var(--fui-range-calendar-nav-display);
  flex-shrink: var(--fui-range-calendar-nav-flex-shrink);
  align-items: var(--fui-range-calendar-nav-align-items);
  justify-content: var(--fui-range-calendar-nav-justify-content);
  &:hover {
    background-color: var(--fui-range-calendar-nav-hover-background-color);
    color: var(--fui-range-calendar-nav-hover-text-color);
    opacity: var(--fui-range-calendar-nav-hover-opacity);
  }
  &:active:not([aria-haspopup]) {
    translate: var(--fui-range-calendar-nav-pressed-translate);
  }
  &:is([data-state=open],[aria-expanded=true]) {
    background-color: var(--fui-range-calendar-nav-open-background-color);
    color: var(--fui-range-calendar-nav-open-text-color);
  }
  & :where([data-icon]) {
    width: var(--fui-range-calendar-nav-icon-size);
    height: var(--fui-range-calendar-nav-icon-size);
  }
}

@utility fui-range-calendar-head-cell {
  --tw-sort: container-type;
  color: var(--fui-range-calendar-head-cell-text-color);
  font-family: var(--fui-range-calendar-head-cell-font-family);
  font-size: var(--fui-range-calendar-head-cell-font-size);
  line-height: var(--fui-range-calendar-head-cell-line-height);
  font-weight: var(--fui-range-calendar-head-cell-font-weight);
  letter-spacing: var(--fui-range-calendar-head-cell-letter-spacing);
  font-feature-settings: var(--fui-range-calendar-head-cell-font-feature-settings);
  font-variation-settings: var(--fui-range-calendar-head-cell-font-variation-settings);
  width: var(--fui-range-calendar-head-cell-width);
  border-radius: var(--fui-range-calendar-head-cell-rounded);
}

@utility fui-range-calendar {
  --tw-sort: container-type;
  padding: var(--fui-range-calendar-padding);
}

@utility fui-range-calendar-header {
  --tw-sort: container-type;
  padding-top: var(--fui-range-calendar-header-padding-top);
  display: var(--fui-range-calendar-header-display);
  justify-content: var(--fui-range-calendar-header-justify-content);
  align-items: var(--fui-range-calendar-header-align-items);
  width: var(--fui-range-calendar-header-width);
}

@utility fui-range-calendar-heading {
  --tw-sort: container-type;
  font-family: var(--fui-range-calendar-heading-font-family);
  font-size: var(--fui-range-calendar-heading-font-size);
  line-height: var(--fui-range-calendar-heading-line-height);
  font-weight: var(--fui-range-calendar-heading-font-weight);
  letter-spacing: var(--fui-range-calendar-heading-letter-spacing);
  font-feature-settings: var(--fui-range-calendar-heading-font-feature-settings);
  font-variation-settings: var(--fui-range-calendar-heading-font-variation-settings);
}

@utility fui-range-calendar-grid-row {
  --tw-sort: container-type;
  display: var(--fui-range-calendar-grid-row-display);
}

@utility fui-calendar-select-label {
  --tw-sort: container-type;
  font-family: var(--fui-calendar-select-label-font-family);
  font-size: var(--fui-calendar-select-label-font-size);
  line-height: var(--fui-calendar-select-label-line-height);
  font-weight: var(--fui-calendar-select-label-font-weight);
  letter-spacing: var(--fui-calendar-select-label-letter-spacing);
  font-feature-settings: var(--fui-calendar-select-label-font-feature-settings);
  font-variation-settings: var(--fui-calendar-select-label-font-variation-settings);
  padding-inline-start: var(--fui-calendar-select-label-padding-start);
}

@utility fui-calendar-grid-row {
  --tw-sort: container-type;
  display: var(--fui-calendar-grid-row-display);
}

@utility fui-price {
  --tw-sort: container-type;
  color: var(--fui-price-text-color);
  gap: var(--fui-price-gap);
  display: var(--fui-price-display);
  flex-direction: var(--fui-price-flex-direction);
}

@utility fui-price-sm {
  --tw-sort: pointer-events;
  font-family: var(--fui-price-sm-font-family);
  font-size: var(--fui-price-sm-font-size);
  line-height: var(--fui-price-sm-line-height);
  font-weight: var(--fui-price-sm-font-weight);
  letter-spacing: var(--fui-price-sm-letter-spacing);
  font-feature-settings: var(--fui-price-sm-font-feature-settings);
  font-variation-settings: var(--fui-price-sm-font-variation-settings);
}

@utility fui-price-md {
  --tw-sort: pointer-events;
  font-family: var(--fui-price-md-font-family);
  font-size: var(--fui-price-md-font-size);
  line-height: var(--fui-price-md-line-height);
  font-weight: var(--fui-price-md-font-weight);
  letter-spacing: var(--fui-price-md-letter-spacing);
  font-feature-settings: var(--fui-price-md-font-feature-settings);
  font-variation-settings: var(--fui-price-md-font-variation-settings);
}

@utility fui-price-lg {
  --tw-sort: pointer-events;
  font-family: var(--fui-price-lg-font-family);
  font-size: var(--fui-price-lg-font-size);
  line-height: var(--fui-price-lg-line-height);
  font-weight: var(--fui-price-lg-font-weight);
  letter-spacing: var(--fui-price-lg-letter-spacing);
  font-feature-settings: var(--fui-price-lg-font-feature-settings);
  font-variation-settings: var(--fui-price-lg-font-variation-settings);
}

@utility fui-price-start {
  --tw-sort: pointer-events;
  text-align: var(--fui-price-start-text-align);
  align-items: var(--fui-price-start-align-items);
}

@utility fui-price-end {
  --tw-sort: pointer-events;
  text-align: var(--fui-price-end-text-align);
  align-items: var(--fui-price-end-align-items);
}

@utility fui-price-row {
  --tw-sort: container-type;
  gap: var(--fui-price-row-gap);
}

@utility fui-price-hint {
  --tw-sort: container-type;
  color: var(--fui-price-hint-text-color);
  font-family: var(--fui-price-hint-font-family);
  font-size: var(--fui-price-hint-font-size);
  line-height: var(--fui-price-hint-line-height);
  font-weight: var(--fui-price-hint-font-weight);
  letter-spacing: var(--fui-price-hint-letter-spacing);
  font-feature-settings: var(--fui-price-hint-font-feature-settings);
  font-variation-settings: var(--fui-price-hint-font-variation-settings);
  & :where(a) {
    text-decoration-line: var(--fui-price-hint-link-text-decoration-line);
  }
  & :where(a:hover) {
    color: var(--fui-price-hint-link-hover-text-color);
  }
}

@utility fui-price-strike {
  --tw-sort: container-type;
  color: var(--fui-price-strike-text-color);
  font-weight: var(--fui-price-strike-font-weight);
  text-decoration-line: var(--fui-price-strike-text-decoration-line);
}

@utility fui-price-strike-sm {
  --tw-sort: pointer-events;
  font-family: var(--fui-price-strike-sm-font-family);
  font-size: var(--fui-price-strike-sm-font-size);
  line-height: var(--fui-price-strike-sm-line-height);
  font-weight: var(--fui-price-strike-sm-font-weight);
  letter-spacing: var(--fui-price-strike-sm-letter-spacing);
  font-feature-settings: var(--fui-price-strike-sm-font-feature-settings);
  font-variation-settings: var(--fui-price-strike-sm-font-variation-settings);
}

@utility fui-price-strike-md {
  --tw-sort: pointer-events;
  font-family: var(--fui-price-strike-md-font-family);
  font-size: var(--fui-price-strike-md-font-size);
  line-height: var(--fui-price-strike-md-line-height);
  font-weight: var(--fui-price-strike-md-font-weight);
  letter-spacing: var(--fui-price-strike-md-letter-spacing);
  font-feature-settings: var(--fui-price-strike-md-font-feature-settings);
  font-variation-settings: var(--fui-price-strike-md-font-variation-settings);
}

@utility fui-price-strike-lg {
  --tw-sort: pointer-events;
  font-family: var(--fui-price-strike-lg-font-family);
  font-size: var(--fui-price-strike-lg-font-size);
  line-height: var(--fui-price-strike-lg-line-height);
  font-weight: var(--fui-price-strike-lg-font-weight);
  letter-spacing: var(--fui-price-strike-lg-letter-spacing);
  font-feature-settings: var(--fui-price-strike-lg-font-feature-settings);
  font-variation-settings: var(--fui-price-strike-lg-font-variation-settings);
}

@utility fui-price-discount {
  --tw-sort: container-type;
  color: var(--fui-price-discount-text-color);
  font-weight: var(--fui-price-discount-font-weight);
}

@utility fui-rating-icon {
  --tw-sort: container-type;
  stroke: var(--fui-rating-icon-stroke);
  flex-shrink: var(--fui-rating-icon-flex-shrink);
}

@utility fui-rating-icon-full {
  --tw-sort: pointer-events;
  color: var(--fui-rating-icon-full-text-color);
  fill: var(--fui-rating-icon-full-fill);
}

@utility fui-rating-icon-empty {
  --tw-sort: pointer-events;
  color: var(--fui-rating-icon-empty-text-color);
  fill: var(--fui-rating-icon-empty-fill);
}

@utility fui-rating-icon-sm {
  --tw-sort: pointer-events;
  width: var(--fui-rating-icon-sm-size);
  height: var(--fui-rating-icon-sm-size);
}

@utility fui-rating-icon-md {
  --tw-sort: pointer-events;
  width: var(--fui-rating-icon-md-size);
  height: var(--fui-rating-icon-md-size);
}

@utility fui-rating-icon-lg {
  --tw-sort: pointer-events;
  width: var(--fui-rating-icon-lg-size);
  height: var(--fui-rating-icon-lg-size);
}

@utility fui-rating-dot {
  --tw-sort: container-type;
  border-radius: var(--fui-rating-dot-rounded);
  border: var(--fui-rating-dot-border);
  border-color: var(--fui-rating-dot-border-color);
  background-color: var(--fui-rating-dot-background-color);
  display: var(--fui-rating-dot-display);
  flex-shrink: var(--fui-rating-dot-flex-shrink);
}

@utility fui-rating-dot-full {
  --tw-sort: pointer-events;
  color: var(--fui-rating-dot-full-text-color);
}

@utility fui-rating-dot-empty {
  --tw-sort: pointer-events;
  color: var(--fui-rating-dot-empty-text-color);
  background-color: var(--fui-rating-dot-empty-background-color);
}

@utility fui-rating-dot-sm {
  --tw-sort: pointer-events;
  width: var(--fui-rating-dot-sm-size);
  height: var(--fui-rating-dot-sm-size);
}

@utility fui-rating-dot-md {
  --tw-sort: pointer-events;
  width: var(--fui-rating-dot-md-size);
  height: var(--fui-rating-dot-md-size);
}

@utility fui-rating-dot-lg {
  --tw-sort: pointer-events;
  width: var(--fui-rating-dot-lg-size);
  height: var(--fui-rating-dot-lg-size);
}

@utility fui-rating {
  --tw-sort: container-type;
  gap: var(--fui-rating-gap);
  display: var(--fui-rating-display);
  align-items: var(--fui-rating-align-items);
}

@utility fui-rating-stars {
  --tw-sort: container-type;
  --fui_empty: initial;
}

@utility fui-rating-stars-dot {
  --tw-sort: pointer-events;
  gap: var(--fui-rating-stars-dot-gap);
}

@utility fui-rating-stars-star {
  --tw-sort: pointer-events;
  gap: var(--fui-rating-stars-star-gap);
}

@utility fui-rating-meta {
  --tw-sort: container-type;
  margin-inline-start: var(--fui-rating-meta-margin-start);
  gap: var(--fui-rating-meta-gap);
  display: var(--fui-rating-meta-display);
  align-items: var(--fui-rating-meta-align-items);
}

@utility fui-rating-value {
  --tw-sort: container-type;
  color: var(--fui-rating-value-text-color);
  font-family: var(--fui-rating-value-font-family);
  font-size: var(--fui-rating-value-font-size);
  line-height: var(--fui-rating-value-line-height);
  font-weight: var(--fui-rating-value-font-weight);
  letter-spacing: var(--fui-rating-value-letter-spacing);
  font-feature-settings: var(--fui-rating-value-font-feature-settings);
  font-variation-settings: var(--fui-rating-value-font-variation-settings);
}

@utility fui-rating-count {
  --tw-sort: container-type;
  color: var(--fui-rating-count-text-color);
  font-family: var(--fui-rating-count-font-family);
  font-size: var(--fui-rating-count-font-size);
  line-height: var(--fui-rating-count-line-height);
  font-weight: var(--fui-rating-count-font-weight);
  letter-spacing: var(--fui-rating-count-letter-spacing);
  font-feature-settings: var(--fui-rating-count-font-feature-settings);
  font-variation-settings: var(--fui-rating-count-font-variation-settings);
}

@utility fui-rating-input-item {
  --tw-sort: container-type;
  border-radius: var(--fui-rating-input-item-rounded);
}

@utility fui-rating-input-item-dot {
  --tw-sort: pointer-events;
  padding: var(--fui-rating-input-item-dot-padding);
}

@utility fui-rating-input-item-star {
  --tw-sort: pointer-events;
  padding: var(--fui-rating-input-item-star-padding);
}

@utility fui-rating-input {
  --tw-sort: container-type;
  display: var(--fui-rating-input-display);
  width: var(--fui-rating-input-width);
  align-items: var(--fui-rating-input-align-items);
}

@utility fui-swatch {
  --tw-sort: container-type;
  border: var(--fui-swatch-border);
  border-color: var(--fui-swatch-border-color);
  display: var(--fui-swatch-display);
  align-items: var(--fui-swatch-align-items);
  justify-content: var(--fui-swatch-justify-content);
  &:hover {
    border-color: var(--fui-swatch-hover-border-color);
    color: var(--fui-swatch-hover-text-color);
  }
  &:is([data-state=checked],[data-state=indeterminate],[data-state=on],[aria-checked=true],[aria-checked=mixed],[aria-pressed=true]) {
    border-color: var(--fui-swatch-checked-border-color);
  }
}

@utility fui-swatch-xs {
  --tw-sort: pointer-events;
  width: var(--fui-swatch-xs-size);
  height: var(--fui-swatch-xs-size);
  font-family: var(--fui-swatch-xs-font-family);
  font-size: var(--fui-swatch-xs-font-size);
  line-height: var(--fui-swatch-xs-line-height);
  font-weight: var(--fui-swatch-xs-font-weight);
  letter-spacing: var(--fui-swatch-xs-letter-spacing);
  font-feature-settings: var(--fui-swatch-xs-font-feature-settings);
  font-variation-settings: var(--fui-swatch-xs-font-variation-settings);
}

@utility fui-swatch-sm {
  --tw-sort: pointer-events;
  width: var(--fui-swatch-sm-size);
  height: var(--fui-swatch-sm-size);
  font-family: var(--fui-swatch-sm-font-family);
  font-size: var(--fui-swatch-sm-font-size);
  line-height: var(--fui-swatch-sm-line-height);
  font-weight: var(--fui-swatch-sm-font-weight);
  letter-spacing: var(--fui-swatch-sm-letter-spacing);
  font-feature-settings: var(--fui-swatch-sm-font-feature-settings);
  font-variation-settings: var(--fui-swatch-sm-font-variation-settings);
  @container (width >= 28rem) {
    width: var(--fui-swatch-sm-md-size);
    height: var(--fui-swatch-sm-md-size);
  }
}

@utility fui-swatch-md {
  --tw-sort: pointer-events;
  width: var(--fui-swatch-md-size);
  height: var(--fui-swatch-md-size);
  font-family: var(--fui-swatch-md-font-family);
  font-size: var(--fui-swatch-md-font-size);
  line-height: var(--fui-swatch-md-line-height);
  font-weight: var(--fui-swatch-md-font-weight);
  letter-spacing: var(--fui-swatch-md-letter-spacing);
  font-feature-settings: var(--fui-swatch-md-font-feature-settings);
  font-variation-settings: var(--fui-swatch-md-font-variation-settings);
  @container (width >= 28rem) {
    width: var(--fui-swatch-md-md-size);
    height: var(--fui-swatch-md-md-size);
  }
}

@utility fui-swatch-lg {
  --tw-sort: pointer-events;
  width: var(--fui-swatch-lg-size);
  height: var(--fui-swatch-lg-size);
  font-family: var(--fui-swatch-lg-font-family);
  font-size: var(--fui-swatch-lg-font-size);
  line-height: var(--fui-swatch-lg-line-height);
  font-weight: var(--fui-swatch-lg-font-weight);
  letter-spacing: var(--fui-swatch-lg-letter-spacing);
  font-feature-settings: var(--fui-swatch-lg-font-feature-settings);
  font-variation-settings: var(--fui-swatch-lg-font-variation-settings);
}

@utility fui-swatch-default {
  --tw-sort: pointer-events;
  border-radius: var(--fui-swatch-default-rounded);
}

@utility fui-swatch-pill {
  --tw-sort: pointer-events;
  border-radius: var(--fui-swatch-pill-rounded);
}

@utility fui-swatch-strike {
  --tw-sort: container-type;
  color: var(--fui-swatch-strike-text-color);
}

@utility fui-swatch-strike-halo {
  --tw-sort: container-type;
  color: var(--fui-swatch-strike-halo-text-color);
}

@utility fui-swatch-fallback {
  --tw-sort: container-type;
  border: var(--fui-swatch-fallback-border);
  border-color: var(--fui-swatch-fallback-border-color);
}

@utility fui-swatch-fallback-default {
  --tw-sort: pointer-events;
  border-radius: var(--fui-swatch-fallback-default-rounded);
}

@utility fui-swatch-fallback-pill {
  --tw-sort: pointer-events;
  border-radius: var(--fui-swatch-fallback-pill-rounded);
}

@utility fui-swatch-fallback-xs {
  --tw-sort: pointer-events;
  border: var(--fui-swatch-fallback-xs-border);
}

@utility fui-swatch-fallback-sm {
  --tw-sort: pointer-events;
  --fui_empty: initial;
}

@utility fui-swatch-fallback-md {
  --tw-sort: pointer-events;
  --fui_empty: initial;
}

@utility fui-swatch-fallback-lg {
  --tw-sort: pointer-events;
  --fui_empty: initial;
}

@utility fui-swatch-image {
  --tw-sort: container-type;
  border: var(--fui-swatch-image-border);
  border-color: var(--fui-swatch-image-border-color);
  width: var(--fui-swatch-image-width);
  height: var(--fui-swatch-image-height);
}

@utility fui-swatch-image-default {
  --tw-sort: pointer-events;
  border-radius: var(--fui-swatch-image-default-rounded);
}

@utility fui-swatch-image-pill {
  --tw-sort: pointer-events;
  border-radius: var(--fui-swatch-image-pill-rounded);
}

@utility fui-swatch-image-xs {
  --tw-sort: pointer-events;
  border: var(--fui-swatch-image-xs-border);
}

@utility fui-swatch-image-sm {
  --tw-sort: pointer-events;
  --fui_empty: initial;
}

@utility fui-swatch-image-md {
  --tw-sort: pointer-events;
  --fui_empty: initial;
}

@utility fui-swatch-image-lg {
  --tw-sort: pointer-events;
  --fui_empty: initial;
}

@utility fui-swatch-label {
  --tw-sort: container-type;
  color: var(--fui-swatch-label-text-color);
  font-family: var(--fui-swatch-label-font-family);
  font-size: var(--fui-swatch-label-font-size);
  line-height: var(--fui-swatch-label-line-height);
  font-weight: var(--fui-swatch-label-font-weight);
  letter-spacing: var(--fui-swatch-label-letter-spacing);
  font-feature-settings: var(--fui-swatch-label-font-feature-settings);
  font-variation-settings: var(--fui-swatch-label-font-variation-settings);
}

@utility fui-swatch-group {
  --tw-sort: container-type;
  gap: var(--fui-swatch-group-gap);
  display: var(--fui-swatch-group-display);
  @container (width >= 28rem) {
    gap: var(--fui-swatch-group-md-gap);
  }
}

@utility fui-swatch-group-horizontal {
  --tw-sort: pointer-events;
  flex-wrap: var(--fui-swatch-group-horizontal-flex-wrap);
}

@utility fui-swatch-group-vertical {
  --tw-sort: pointer-events;
  flex-direction: var(--fui-swatch-group-vertical-flex-direction);
  flex-wrap: var(--fui-swatch-group-vertical-flex-wrap);
}

@utility fui-filter-trigger {
  --tw-sort: container-type;
  width: var(--fui-filter-trigger-width);
  & svg {
    color: var(--fui-filter-trigger-icon-color);
  }
}

@utility fui-filter-trigger-count {
  --tw-sort: container-type;
  margin-inline-end: var(--fui-filter-trigger-count-margin-end);
  background-color: var(--fui-filter-trigger-count-background-color);
  color: var(--fui-filter-trigger-count-text-color);
  border-radius: var(--fui-filter-trigger-count-rounded);
  font-family: var(--fui-filter-trigger-count-font-family);
  font-size: var(--fui-filter-trigger-count-font-size);
  line-height: var(--fui-filter-trigger-count-line-height);
  font-weight: var(--fui-filter-trigger-count-font-weight);
  letter-spacing: var(--fui-filter-trigger-count-letter-spacing);
  font-feature-settings: var(--fui-filter-trigger-count-font-feature-settings);
  font-variation-settings: var(--fui-filter-trigger-count-font-variation-settings);
  width: var(--fui-filter-trigger-count-size);
  height: var(--fui-filter-trigger-count-size);
}

@utility fui-filter-reset {
  --tw-sort: container-type;
  margin-top: var(--fui-filter-reset-margin-top);
  border-radius: var(--fui-filter-reset-rounded);
}

@utility fui-filter-group-content {
  --tw-sort: container-type;
  width: var(--fui-filter-group-content-width);
  padding: var(--fui-filter-group-content-padding);
}

@utility fui-filter-list {
  --tw-sort: container-type;
  scrollbar-width: var(--fui-filter-list-scrollbar);
  height: var(--fui-filter-list-height);
  padding-block: var(--fui-filter-list-padding-y);
  &::-webkit-scrollbar {
    display: var(--fui-filter-list-scrollbar);
  }
}

@utility fui-filter-list-search {
  --tw-sort: container-type;
  border: var(--fui-filter-list-search-border);
  border-bottom-color: var(--fui-filter-list-search-border-bottom-color);
  border-radius: var(--fui-filter-list-search-rounded);
  margin-bottom: var(--fui-filter-list-search-margin-bottom);
  background-color: var(--fui-filter-list-search-background-color);
  border-color: var(--fui-filter-list-search-border-color);
  box-shadow: var(--fui-filter-list-search-shadow);
  font-family: var(--fui-filter-list-search-font-family);
  font-size: var(--fui-filter-list-search-font-size);
  line-height: var(--fui-filter-list-search-line-height);
  font-weight: var(--fui-filter-list-search-font-weight);
  letter-spacing: var(--fui-filter-list-search-letter-spacing);
  font-feature-settings: var(--fui-filter-list-search-font-feature-settings);
  font-variation-settings: var(--fui-filter-list-search-font-variation-settings);
  height: var(--fui-filter-list-search-height);
  padding-inline: var(--fui-filter-list-search-padding-x);
  &::placeholder {
    color: var(--fui-filter-list-search-placeholder-color);
  }
  &:focus-visible {
    border-bottom: var(--fui-filter-list-search-focus-border-bottom);
  }
  &:is([aria-invalid=true],[data-invalid]) {
    border-bottom-color: var(--fui-filter-list-search-invalid-border-bottom-color);
  }
  &::file-selector-button {
    background-color: var(--fui-filter-list-search-file-background-color);
    border: var(--fui-filter-list-search-file-border);
    color: var(--fui-filter-list-search-file-text-color);
    font-family: var(--fui-filter-list-search-file-font-family);
    font-size: var(--fui-filter-list-search-file-font-size);
    line-height: var(--fui-filter-list-search-file-line-height);
    font-weight: var(--fui-filter-list-search-file-font-weight);
    letter-spacing: var(--fui-filter-list-search-file-letter-spacing);
    font-feature-settings: var(--fui-filter-list-search-file-font-feature-settings);
    font-variation-settings: var(--fui-filter-list-search-file-font-variation-settings);
  }
}

@utility fui-filter-list-item {
  --tw-sort: container-type;
  border-radius: var(--fui-filter-list-item-rounded);
  font-family: var(--fui-filter-list-item-font-family);
  font-size: var(--fui-filter-list-item-font-size);
  line-height: var(--fui-filter-list-item-line-height);
  font-weight: var(--fui-filter-list-item-font-weight);
  letter-spacing: var(--fui-filter-list-item-letter-spacing);
  font-feature-settings: var(--fui-filter-list-item-font-feature-settings);
  font-variation-settings: var(--fui-filter-list-item-font-variation-settings);
  gap: var(--fui-filter-list-item-gap);
  padding-inline: var(--fui-filter-list-item-padding-x);
  padding-block: var(--fui-filter-list-item-padding-y);
  &:focus-visible {
    background-color: var(--fui-filter-list-item-focus-background-color);
    color: var(--fui-filter-list-item-focus-text-color);
  }
}

@utility fui-filter-list-check {
  --tw-sort: container-type;
  background-color: var(--fui-filter-list-check-background-color);
  border: var(--fui-filter-list-check-border);
  border-color: var(--fui-filter-list-check-border-color);
  border-radius: var(--fui-filter-list-check-rounded);
  width: var(--fui-filter-list-check-size);
  height: var(--fui-filter-list-check-size);
  &:is([data-state=checked],[data-state=indeterminate],[data-state=on],[aria-checked=true],[aria-checked=mixed],[aria-pressed=true]) {
    background-color: var(--fui-filter-list-check-checked-background-color);
    color: var(--fui-filter-list-check-checked-text-color);
    border-color: var(--fui-filter-list-check-checked-border-color);
  }
}

@utility fui-filter-meta {
  --tw-sort: container-type;
  color: var(--fui-filter-meta-text-color);
  font-family: var(--fui-filter-meta-font-family);
  font-size: var(--fui-filter-meta-font-size);
  line-height: var(--fui-filter-meta-line-height);
  font-weight: var(--fui-filter-meta-font-weight);
  letter-spacing: var(--fui-filter-meta-letter-spacing);
  font-feature-settings: var(--fui-filter-meta-font-feature-settings);
  font-variation-settings: var(--fui-filter-meta-font-variation-settings);
}

@utility fui-filter-swatch {
  --tw-sort: container-type;
  --fui_empty: initial;
}

@utility fui-filter-swatch-horizontal {
  --tw-sort: pointer-events;
  --fui_empty: initial;
}

@utility fui-filter-swatch-vertical {
  --tw-sort: pointer-events;
  margin-inline: var(--fui-filter-swatch-vertical-bleed-x);
  margin-block: var(--fui-filter-swatch-vertical-bleed-y);
  padding: var(--fui-filter-swatch-vertical-padding);
}

@utility fui-filter-swatch-text {
  --tw-sort: container-type;
  font-family: var(--fui-filter-swatch-text-font-family);
  font-size: var(--fui-filter-swatch-text-font-size);
  line-height: var(--fui-filter-swatch-text-line-height);
  font-weight: var(--fui-filter-swatch-text-font-weight);
  letter-spacing: var(--fui-filter-swatch-text-letter-spacing);
  font-feature-settings: var(--fui-filter-swatch-text-font-feature-settings);
  font-variation-settings: var(--fui-filter-swatch-text-font-variation-settings);
}

@utility fui-filter-rating-star {
  --tw-sort: container-type;
  border-radius: var(--fui-filter-rating-star-rounded);
  padding: var(--fui-filter-rating-star-padding);
}

@utility fui-filter-field-label {
  --tw-sort: container-type;
  font-family: var(--fui-filter-field-label-font-family);
  font-size: var(--fui-filter-field-label-font-size);
  line-height: var(--fui-filter-field-label-line-height);
  font-weight: var(--fui-filter-field-label-font-weight);
  letter-spacing: var(--fui-filter-field-label-letter-spacing);
  font-feature-settings: var(--fui-filter-field-label-font-feature-settings);
  font-variation-settings: var(--fui-filter-field-label-font-variation-settings);
  text-transform: var(--fui-filter-field-label-text-transform);
}

@utility fui-filter-field-title {
  --tw-sort: container-type;
  font-family: var(--fui-filter-field-title-font-family);
  font-size: var(--fui-filter-field-title-font-size);
  line-height: var(--fui-filter-field-title-line-height);
  font-weight: var(--fui-filter-field-title-font-weight);
  letter-spacing: var(--fui-filter-field-title-letter-spacing);
  font-feature-settings: var(--fui-filter-field-title-font-feature-settings);
  font-variation-settings: var(--fui-filter-field-title-font-variation-settings);
  text-transform: var(--fui-filter-field-title-text-transform);
}

@utility fui-filter-field-description {
  --tw-sort: container-type;
  color: var(--fui-filter-field-description-text-color);
  font-family: var(--fui-filter-field-description-font-family);
  font-size: var(--fui-filter-field-description-font-size);
  line-height: var(--fui-filter-field-description-line-height);
  font-weight: var(--fui-filter-field-description-font-weight);
  letter-spacing: var(--fui-filter-field-description-letter-spacing);
  font-feature-settings: var(--fui-filter-field-description-font-feature-settings);
  font-variation-settings: var(--fui-filter-field-description-font-variation-settings);
}

@utility fui-filter-range-separator {
  --tw-sort: container-type;
  color: var(--fui-filter-range-separator-text-color);
  font-family: var(--fui-filter-range-separator-font-family);
  font-size: var(--fui-filter-range-separator-font-size);
  line-height: var(--fui-filter-range-separator-line-height);
  font-weight: var(--fui-filter-range-separator-font-weight);
  letter-spacing: var(--fui-filter-range-separator-letter-spacing);
  font-feature-settings: var(--fui-filter-range-separator-font-feature-settings);
  font-variation-settings: var(--fui-filter-range-separator-font-variation-settings);
}

@utility fui-filter-field {
  --tw-sort: container-type;
  display: var(--fui-filter-field-display);
  width: var(--fui-filter-field-width);
  gap: var(--fui-filter-field-gap);
}

@utility fui-filter-field-content {
  --tw-sort: container-type;
  display: var(--fui-filter-field-content-display);
  flex: var(--fui-filter-field-content-flex);
  flex-direction: var(--fui-filter-field-content-flex-direction);
  gap: var(--fui-filter-field-content-gap);
}

@utility fui-filter-list-root {
  --tw-sort: container-type;
  display: var(--fui-filter-list-root-display);
  flex-direction: var(--fui-filter-list-root-flex-direction);
}

@utility fui-filter-range {
  --tw-sort: container-type;
  flex-direction: var(--fui-filter-range-flex-direction);
  padding-inline: var(--fui-filter-range-padding-x);
  padding-block: var(--fui-filter-range-padding-y);
}

@utility fui-filter-rating {
  --tw-sort: container-type;
  padding-inline: var(--fui-filter-rating-padding-x);
  padding-block: var(--fui-filter-rating-padding-y);
}

@utility fui-filter-reset-root {
  --tw-sort: container-type;
  margin-top: var(--fui-filter-reset-root-margin-top);
  display: var(--fui-filter-reset-root-display);
  align-items: var(--fui-filter-reset-root-align-items);
  justify-content: var(--fui-filter-reset-root-justify-content);
}

@utility fui-filter-slider {
  --tw-sort: container-type;
  flex-direction: var(--fui-filter-slider-flex-direction);
  padding-inline: var(--fui-filter-slider-padding-x);
  padding-block: var(--fui-filter-slider-padding-y);
}

@utility fui-filter-switch {
  --tw-sort: container-type;
  padding-inline: var(--fui-filter-switch-padding-x);
  padding-block: var(--fui-filter-switch-padding-y);
}

@utility fui-product-card-basic-image {
  --tw-sort: container-type;
  border-radius: var(--fui-product-card-basic-image-rounded);
}

@utility fui-product-card-basic {
  --tw-sort: container-type;
  width: var(--fui-product-card-basic-width);
}

@utility fui-product-card-hover-image {
  --tw-sort: container-type;
  border-radius: var(--fui-product-card-hover-image-rounded);
}

@utility fui-product-card-horizontal-image {
  --tw-sort: container-type;
  border-radius: var(--fui-product-card-horizontal-image-rounded);
}

@utility fui-product-card-horizontal {
  --tw-sort: container-type;
  padding-block: var(--fui-product-card-horizontal-padding-y);
}

@utility fui-product-card-gallery-image {
  --tw-sort: container-type;
  border-radius: var(--fui-product-card-gallery-image-rounded);
}

@utility fui-product-card-gallery-badge {
  --tw-sort: container-type;
  text-transform: var(--fui-product-card-gallery-badge-text-transform);
}

@utility fui-product-card-gallery-title {
  --tw-sort: container-type;
  font-family: var(--fui-product-card-gallery-title-font-family);
  font-size: var(--fui-product-card-gallery-title-font-size);
  line-height: var(--fui-product-card-gallery-title-line-height);
  font-weight: var(--fui-product-card-gallery-title-font-weight);
  letter-spacing: var(--fui-product-card-gallery-title-letter-spacing);
  font-feature-settings: var(--fui-product-card-gallery-title-font-feature-settings);
  font-variation-settings: var(--fui-product-card-gallery-title-font-variation-settings);
}

@utility fui-product-card-minimal-image {
  --tw-sort: container-type;
  border-radius: var(--fui-product-card-minimal-image-rounded);
}

@utility fui-product-card-featured-image {
  --tw-sort: container-type;
  border-radius: var(--fui-product-card-featured-image-rounded);
}

@utility fui-product-card-featured-description {
  --tw-sort: container-type;
  color: var(--fui-product-card-featured-description-text-color);
  font-family: var(--fui-product-card-featured-description-font-family);
  font-size: var(--fui-product-card-featured-description-font-size);
  line-height: var(--fui-product-card-featured-description-line-height);
  font-weight: var(--fui-product-card-featured-description-font-weight);
  letter-spacing: var(--fui-product-card-featured-description-letter-spacing);
  font-feature-settings: var(--fui-product-card-featured-description-font-feature-settings);
  font-variation-settings: var(--fui-product-card-featured-description-font-variation-settings);
}

@utility fui-navigation-shop-trigger {
  --tw-sort: container-type;
  --fui_empty: initial;
}

@utility fui-navigation-shop-trigger-beside {
  --tw-sort: pointer-events;
  background-color: var(--fui-navigation-shop-trigger-beside-background-color);
  border-radius: var(--fui-navigation-shop-trigger-beside-rounded);
  height: var(--fui-navigation-shop-trigger-beside-height);
  padding-inline: var(--fui-navigation-shop-trigger-beside-padding-x);
  padding-block: var(--fui-navigation-shop-trigger-beside-padding-y);
  &:hover {
    background-color: var(--fui-navigation-shop-trigger-beside-hover-background-color);
    color: var(--fui-navigation-shop-trigger-beside-hover-text-color);
  }
  &:is([data-state=open],[aria-expanded=true]) {
    background-color: var(--fui-navigation-shop-trigger-beside-open-background-color);
  }
}

@utility fui-navigation-shop-trigger-above {
  --tw-sort: pointer-events;
  background-color: var(--fui-navigation-shop-trigger-above-background-color);
  border-radius: var(--fui-navigation-shop-trigger-above-rounded);
  height: var(--fui-navigation-shop-trigger-above-height);
  padding-inline: var(--fui-navigation-shop-trigger-above-padding-x);
  padding-block: var(--fui-navigation-shop-trigger-above-padding-y);
  &:hover {
    background-color: var(--fui-navigation-shop-trigger-above-hover-background-color);
    color: var(--fui-navigation-shop-trigger-above-hover-text-color);
  }
  &:is([data-state=open],[aria-expanded=true]) {
    background-color: var(--fui-navigation-shop-trigger-above-open-background-color);
  }
}

@utility fui-navigation-shop-trigger-captioned {
  --tw-sort: pointer-events;
  color: var(--fui-navigation-shop-trigger-captioned-text-color);
  border-bottom: var(--fui-navigation-shop-trigger-captioned-border-bottom);
  border-color: var(--fui-navigation-shop-trigger-captioned-border-color);
  &:hover {
    color: var(--fui-navigation-shop-trigger-captioned-hover-text-color);
  }
  &:is([data-state=open],[aria-expanded=true]) {
    color: var(--fui-navigation-shop-trigger-captioned-open-text-color);
    border-color: var(--fui-navigation-shop-trigger-captioned-open-border-color);
  }
}

@utility fui-navigation-shop-page {
  --tw-sort: container-type;
  font-family: var(--fui-navigation-shop-page-font-family);
  font-size: var(--fui-navigation-shop-page-font-size);
  line-height: var(--fui-navigation-shop-page-line-height);
  font-weight: var(--fui-navigation-shop-page-font-weight);
  letter-spacing: var(--fui-navigation-shop-page-letter-spacing);
  font-feature-settings: var(--fui-navigation-shop-page-font-feature-settings);
  font-variation-settings: var(--fui-navigation-shop-page-font-variation-settings);
}

@utility fui-navigation-shop-page-beside {
  --tw-sort: pointer-events;
  background-color: var(--fui-navigation-shop-page-beside-background-color);
  border-radius: var(--fui-navigation-shop-page-beside-rounded);
  height: var(--fui-navigation-shop-page-beside-height);
  padding-inline: var(--fui-navigation-shop-page-beside-padding-x);
  padding-block: var(--fui-navigation-shop-page-beside-padding-y);
  &:hover {
    background-color: var(--fui-navigation-shop-page-beside-hover-background-color);
    color: var(--fui-navigation-shop-page-beside-hover-text-color);
  }
  &:is([data-state=open],[aria-expanded=true]) {
    background-color: var(--fui-navigation-shop-page-beside-open-background-color);
  }
}

@utility fui-navigation-shop-page-above {
  --tw-sort: pointer-events;
  background-color: var(--fui-navigation-shop-page-above-background-color);
  border-radius: var(--fui-navigation-shop-page-above-rounded);
  height: var(--fui-navigation-shop-page-above-height);
  padding-inline: var(--fui-navigation-shop-page-above-padding-x);
  padding-block: var(--fui-navigation-shop-page-above-padding-y);
  &:hover {
    background-color: var(--fui-navigation-shop-page-above-hover-background-color);
    color: var(--fui-navigation-shop-page-above-hover-text-color);
  }
  &:is([data-state=open],[aria-expanded=true]) {
    background-color: var(--fui-navigation-shop-page-above-open-background-color);
  }
}

@utility fui-navigation-shop-page-captioned {
  --tw-sort: pointer-events;
  color: var(--fui-navigation-shop-page-captioned-text-color);
  &:hover {
    color: var(--fui-navigation-shop-page-captioned-hover-text-color);
  }
}

@utility fui-navigation-shop-page-highlight {
  --tw-sort: pointer-events;
  color: var(--fui-navigation-shop-page-highlight-text-color);
}

@utility fui-navigation-shop-content {
  --tw-sort: container-type;
  --fui_empty: initial;
}

@utility fui-navigation-shop-content-beside {
  --tw-sort: pointer-events;
  --fui_empty: initial;
}

@utility fui-navigation-shop-content-above {
  --tw-sort: pointer-events;
  --fui_empty: initial;
}

@utility fui-navigation-shop-content-captioned {
  --tw-sort: pointer-events;
  border-top: var(--fui-navigation-shop-content-captioned-border-top);
  font-family: var(--fui-navigation-shop-content-captioned-font-family);
  font-size: var(--fui-navigation-shop-content-captioned-font-size);
  line-height: var(--fui-navigation-shop-content-captioned-line-height);
  font-weight: var(--fui-navigation-shop-content-captioned-font-weight);
  letter-spacing: var(--fui-navigation-shop-content-captioned-letter-spacing);
  font-feature-settings: var(--fui-navigation-shop-content-captioned-font-feature-settings);
  font-variation-settings: var(--fui-navigation-shop-content-captioned-font-variation-settings);
}

@utility fui-navigation-shop-viewport {
  --tw-sort: container-type;
  --fui_empty: initial;
}

@utility fui-navigation-shop-viewport-beside {
  --tw-sort: pointer-events;
  --fui_empty: initial;
}

@utility fui-navigation-shop-viewport-above {
  --tw-sort: pointer-events;
  box-shadow: var(--fui-navigation-shop-viewport-above-shadow);
}

@utility fui-navigation-shop-viewport-captioned {
  --tw-sort: pointer-events;
  box-shadow: var(--fui-navigation-shop-viewport-captioned-shadow);
}

@utility fui-navigation-shop-featured-image {
  --tw-sort: container-type;
  background-color: var(--fui-navigation-shop-featured-image-background-color);
}

@utility fui-navigation-shop-featured-image-beside {
  --tw-sort: pointer-events;
  border-radius: var(--fui-navigation-shop-featured-image-beside-rounded);
}

@utility fui-navigation-shop-featured-image-above {
  --tw-sort: pointer-events;
  border-radius: var(--fui-navigation-shop-featured-image-above-rounded);
}

@utility fui-navigation-shop-featured-image-captioned {
  --tw-sort: pointer-events;
  border-radius: var(--fui-navigation-shop-featured-image-captioned-rounded);
}

@utility fui-navigation-shop-caption {
  --tw-sort: container-type;
  background-color: var(--fui-navigation-shop-caption-background-color);
  font-family: var(--fui-navigation-shop-caption-font-family);
  font-size: var(--fui-navigation-shop-caption-font-size);
  line-height: var(--fui-navigation-shop-caption-line-height);
  font-weight: var(--fui-navigation-shop-caption-font-weight);
  letter-spacing: var(--fui-navigation-shop-caption-letter-spacing);
  font-feature-settings: var(--fui-navigation-shop-caption-font-feature-settings);
  font-variation-settings: var(--fui-navigation-shop-caption-font-variation-settings);
  padding-inline: var(--fui-navigation-shop-caption-padding-x);
  padding-block: var(--fui-navigation-shop-caption-padding-y);
}

@utility fui-navigation-shop-columns {
  --tw-sort: container-type;
  font-family: var(--fui-navigation-shop-columns-font-family);
  font-size: var(--fui-navigation-shop-columns-font-size);
  line-height: var(--fui-navigation-shop-columns-line-height);
  font-weight: var(--fui-navigation-shop-columns-font-weight);
  letter-spacing: var(--fui-navigation-shop-columns-letter-spacing);
  font-feature-settings: var(--fui-navigation-shop-columns-font-feature-settings);
  font-variation-settings: var(--fui-navigation-shop-columns-font-variation-settings);
}

@utility fui-navigation-shop-root {
  --tw-sort: container-type;
  display: var(--fui-navigation-shop-root-display);
  align-items: var(--fui-navigation-shop-root-align-items);
}

@utility fui-header-shop-announcement {
  --tw-sort: container-type;
  background-color: var(--fui-header-shop-announcement-background-color);
  color: var(--fui-header-shop-announcement-text-color);
  font-family: var(--fui-header-shop-announcement-font-family);
  font-size: var(--fui-header-shop-announcement-font-size);
  line-height: var(--fui-header-shop-announcement-line-height);
  font-weight: var(--fui-header-shop-announcement-font-weight);
  letter-spacing: var(--fui-header-shop-announcement-letter-spacing);
  font-feature-settings: var(--fui-header-shop-announcement-font-feature-settings);
  font-variation-settings: var(--fui-header-shop-announcement-font-variation-settings);
}

@utility fui-header-shop-bar {
  --tw-sort: container-type;
  background-color: var(--fui-header-shop-bar-background-color);
  border-bottom: var(--fui-header-shop-bar-border-bottom);
  border-color: var(--fui-header-shop-bar-border-color);
}

@utility fui-header-shop {
  --tw-sort: container-type;
  width: var(--fui-header-shop-width);
}

@utility fui-header-centered {
  --tw-sort: container-type;
  background-color: var(--fui-header-centered-background-color);
  border-bottom: var(--fui-header-centered-border-bottom);
  border-color: var(--fui-header-centered-border-color);
  width: var(--fui-header-centered-width);
}

@utility fui-header-centered-logo {
  --tw-sort: container-type;
  font-family: var(--fui-header-centered-logo-font-family);
  font-size: var(--fui-header-centered-logo-font-size);
  line-height: var(--fui-header-centered-logo-line-height);
  font-weight: var(--fui-header-centered-logo-font-weight);
  letter-spacing: var(--fui-header-centered-logo-letter-spacing);
  font-feature-settings: var(--fui-header-centered-logo-font-feature-settings);
  font-variation-settings: var(--fui-header-centered-logo-font-variation-settings);
}

@utility fui-header-centered-nav {
  --tw-sort: container-type;
  border-top: var(--fui-header-centered-nav-border-top);
  border-color: var(--fui-header-centered-nav-border-color);
}

@utility fui-header-checkout {
  --tw-sort: container-type;
  background-color: var(--fui-header-checkout-background-color);
  border-bottom: var(--fui-header-checkout-border-bottom);
  border-color: var(--fui-header-checkout-border-color);
  width: var(--fui-header-checkout-width);
}

@utility fui-footer-rich-newsletter {
  --tw-sort: container-type;
  background-color: var(--fui-footer-rich-newsletter-background-color);
}

@utility fui-footer-rich-heading {
  --tw-sort: container-type;
  font-family: var(--fui-footer-rich-heading-font-family);
  font-size: var(--fui-footer-rich-heading-font-size);
  line-height: var(--fui-footer-rich-heading-line-height);
  font-weight: var(--fui-footer-rich-heading-font-weight);
  letter-spacing: var(--fui-footer-rich-heading-letter-spacing);
  font-feature-settings: var(--fui-footer-rich-heading-font-feature-settings);
  font-variation-settings: var(--fui-footer-rich-heading-font-variation-settings);
}

@utility fui-footer-rich-legal {
  --tw-sort: container-type;
  background-color: var(--fui-footer-rich-legal-background-color);
  color: var(--fui-footer-rich-legal-text-color);
  font-family: var(--fui-footer-rich-legal-font-family);
  font-size: var(--fui-footer-rich-legal-font-size);
  line-height: var(--fui-footer-rich-legal-line-height);
  font-weight: var(--fui-footer-rich-legal-font-weight);
  letter-spacing: var(--fui-footer-rich-legal-letter-spacing);
  font-feature-settings: var(--fui-footer-rich-legal-font-feature-settings);
  font-variation-settings: var(--fui-footer-rich-legal-font-variation-settings);
}

@utility fui-footer-rich-legal-link {
  --tw-sort: container-type;
  color: var(--fui-footer-rich-legal-link-text-color);
  &:hover {
    color: var(--fui-footer-rich-legal-link-hover-text-color);
  }
}

@utility fui-footer-rich-legal-logo {
  --tw-sort: container-type;
  font-family: var(--fui-footer-rich-legal-logo-font-family);
  font-size: var(--fui-footer-rich-legal-logo-font-size);
  line-height: var(--fui-footer-rich-legal-logo-line-height);
  font-weight: var(--fui-footer-rich-legal-logo-font-weight);
  letter-spacing: var(--fui-footer-rich-legal-logo-letter-spacing);
  font-feature-settings: var(--fui-footer-rich-legal-logo-font-feature-settings);
  font-variation-settings: var(--fui-footer-rich-legal-logo-font-variation-settings);
}

@utility fui-footer-rich-legal-note {
  --tw-sort: container-type;
  color: var(--fui-footer-rich-legal-note-text-color);
}

@utility fui-footer-rich-title {
  --tw-sort: container-type;
  font-family: var(--fui-footer-rich-title-font-family);
  font-size: var(--fui-footer-rich-title-font-size);
  line-height: var(--fui-footer-rich-title-line-height);
  font-weight: var(--fui-footer-rich-title-font-weight);
  letter-spacing: var(--fui-footer-rich-title-letter-spacing);
  font-feature-settings: var(--fui-footer-rich-title-font-feature-settings);
  font-variation-settings: var(--fui-footer-rich-title-font-variation-settings);
}

@utility fui-footer-rich {
  --tw-sort: container-type;
  width: var(--fui-footer-rich-width);
}

@utility fui-footer-brand-title {
  --tw-sort: container-type;
  font-family: var(--fui-footer-brand-title-font-family);
  font-size: var(--fui-footer-brand-title-font-size);
  line-height: var(--fui-footer-brand-title-line-height);
  font-weight: var(--fui-footer-brand-title-font-weight);
  letter-spacing: var(--fui-footer-brand-title-letter-spacing);
  font-feature-settings: var(--fui-footer-brand-title-font-feature-settings);
  font-variation-settings: var(--fui-footer-brand-title-font-variation-settings);
}

@utility fui-footer-minimal-logo {
  --tw-sort: container-type;
  font-family: var(--fui-footer-minimal-logo-font-family);
  font-size: var(--fui-footer-minimal-logo-font-size);
  line-height: var(--fui-footer-minimal-logo-line-height);
  font-weight: var(--fui-footer-minimal-logo-font-weight);
  letter-spacing: var(--fui-footer-minimal-logo-letter-spacing);
  font-feature-settings: var(--fui-footer-minimal-logo-font-feature-settings);
  font-variation-settings: var(--fui-footer-minimal-logo-font-variation-settings);
}

@utility fui-footer-minimal {
  --tw-sort: container-type;
  width: var(--fui-footer-minimal-width);
}

@utility fui-footer-trust-icon {
  --tw-sort: container-type;
  background-color: var(--fui-footer-trust-icon-background-color);
  border-radius: var(--fui-footer-trust-icon-rounded);
  width: var(--fui-footer-trust-icon-size);
  height: var(--fui-footer-trust-icon-size);
  & :where([data-icon]) {
    width: var(--fui-footer-trust-icon-icon-size);
    height: var(--fui-footer-trust-icon-icon-size);
  }
}

@utility fui-footer-trust {
  --tw-sort: container-type;
  width: var(--fui-footer-trust-width);
}

@utility fui-footer-brand {
  --tw-sort: container-type;
  background-color: var(--fui-footer-brand-background-color);
  width: var(--fui-footer-brand-width);
}

@utility fui-review-cards-heading {
  --tw-sort: container-type;
  font-family: var(--fui-review-cards-heading-font-family);
  font-size: var(--fui-review-cards-heading-font-size);
  line-height: var(--fui-review-cards-heading-line-height);
  font-weight: var(--fui-review-cards-heading-font-weight);
  letter-spacing: var(--fui-review-cards-heading-letter-spacing);
  font-feature-settings: var(--fui-review-cards-heading-font-feature-settings);
  font-variation-settings: var(--fui-review-cards-heading-font-variation-settings);
}

@utility fui-review-cards-average {
  --tw-sort: container-type;
  font-family: var(--fui-review-cards-average-font-family);
  font-size: var(--fui-review-cards-average-font-size);
  line-height: var(--fui-review-cards-average-line-height);
  font-weight: var(--fui-review-cards-average-font-weight);
  letter-spacing: var(--fui-review-cards-average-letter-spacing);
  font-feature-settings: var(--fui-review-cards-average-font-feature-settings);
  font-variation-settings: var(--fui-review-cards-average-font-variation-settings);
}

@utility fui-review-cards-summary {
  --tw-sort: container-type;
  font-family: var(--fui-review-cards-summary-font-family);
  font-size: var(--fui-review-cards-summary-font-size);
  line-height: var(--fui-review-cards-summary-line-height);
  font-weight: var(--fui-review-cards-summary-font-weight);
  letter-spacing: var(--fui-review-cards-summary-letter-spacing);
  font-feature-settings: var(--fui-review-cards-summary-font-feature-settings);
  font-variation-settings: var(--fui-review-cards-summary-font-variation-settings);
}

@utility fui-review-cards-star {
  --tw-sort: container-type;
  font-family: var(--fui-review-cards-star-font-family);
  font-size: var(--fui-review-cards-star-font-size);
  line-height: var(--fui-review-cards-star-line-height);
  font-weight: var(--fui-review-cards-star-font-weight);
  letter-spacing: var(--fui-review-cards-star-letter-spacing);
  font-feature-settings: var(--fui-review-cards-star-font-feature-settings);
  font-variation-settings: var(--fui-review-cards-star-font-variation-settings);
  width: var(--fui-review-cards-star-width);
}

@utility fui-review-cards-percent {
  --tw-sort: container-type;
  font-family: var(--fui-review-cards-percent-font-family);
  font-size: var(--fui-review-cards-percent-font-size);
  line-height: var(--fui-review-cards-percent-line-height);
  font-weight: var(--fui-review-cards-percent-font-weight);
  letter-spacing: var(--fui-review-cards-percent-letter-spacing);
  font-feature-settings: var(--fui-review-cards-percent-font-feature-settings);
  font-variation-settings: var(--fui-review-cards-percent-font-variation-settings);
  width: var(--fui-review-cards-percent-width);
}

@utility fui-review-cards-content {
  --tw-sort: container-type;
  color: var(--fui-review-cards-content-text-color);
  font-family: var(--fui-review-cards-content-font-family);
  font-size: var(--fui-review-cards-content-font-size);
  line-height: var(--fui-review-cards-content-line-height);
  font-weight: var(--fui-review-cards-content-font-weight);
  letter-spacing: var(--fui-review-cards-content-letter-spacing);
  font-feature-settings: var(--fui-review-cards-content-font-feature-settings);
  font-variation-settings: var(--fui-review-cards-content-font-variation-settings);
  margin-top: var(--fui-review-cards-content-margin-top);
}

@utility fui-review-cards-author {
  --tw-sort: container-type;
  font-family: var(--fui-review-cards-author-font-family);
  font-size: var(--fui-review-cards-author-font-size);
  line-height: var(--fui-review-cards-author-line-height);
  font-weight: var(--fui-review-cards-author-font-weight);
  letter-spacing: var(--fui-review-cards-author-letter-spacing);
  font-feature-settings: var(--fui-review-cards-author-font-feature-settings);
  font-variation-settings: var(--fui-review-cards-author-font-variation-settings);
}

@utility fui-review-cards {
  --tw-sort: container-type;
  width: var(--fui-review-cards-width);
}

@utility fui-filter-toolbar-bar {
  --tw-sort: container-type;
  background-color: var(--fui-filter-toolbar-bar-background-color);
  border: var(--fui-filter-toolbar-bar-border);
  border-color: var(--fui-filter-toolbar-bar-border-color);
  border-radius: var(--fui-filter-toolbar-bar-rounded);
  padding: var(--fui-filter-toolbar-bar-padding);
  gap: var(--fui-filter-toolbar-bar-gap);
}

@utility fui-filter-toolbar {
  --tw-sort: container-type;
  width: var(--fui-filter-toolbar-width);
}

@utility fui-category-filter-heading {
  --tw-sort: container-type;
  font-family: var(--fui-category-filter-heading-font-family);
  font-size: var(--fui-category-filter-heading-font-size);
  line-height: var(--fui-category-filter-heading-line-height);
  font-weight: var(--fui-category-filter-heading-font-weight);
  letter-spacing: var(--fui-category-filter-heading-letter-spacing);
  font-feature-settings: var(--fui-category-filter-heading-font-feature-settings);
  font-variation-settings: var(--fui-category-filter-heading-font-variation-settings);
}

@utility fui-category-filter-description {
  --tw-sort: container-type;
  margin-top: var(--fui-category-filter-description-margin-top);
  color: var(--fui-category-filter-description-text-color);
  font-family: var(--fui-category-filter-description-font-family);
  font-size: var(--fui-category-filter-description-font-size);
  line-height: var(--fui-category-filter-description-line-height);
  font-weight: var(--fui-category-filter-description-font-weight);
  letter-spacing: var(--fui-category-filter-description-letter-spacing);
  font-feature-settings: var(--fui-category-filter-description-font-feature-settings);
  font-variation-settings: var(--fui-category-filter-description-font-variation-settings);
}

@utility fui-category-filter {
  --tw-sort: container-type;
  width: var(--fui-category-filter-width);
}

@utility fui-category-grid-heading {
  --tw-sort: container-type;
  font-family: var(--fui-category-grid-heading-font-family);
  font-size: var(--fui-category-grid-heading-font-size);
  line-height: var(--fui-category-grid-heading-line-height);
  font-weight: var(--fui-category-grid-heading-font-weight);
  letter-spacing: var(--fui-category-grid-heading-letter-spacing);
  font-feature-settings: var(--fui-category-grid-heading-font-feature-settings);
  font-variation-settings: var(--fui-category-grid-heading-font-variation-settings);
}

@utility fui-category-grid-description {
  --tw-sort: container-type;
  color: var(--fui-category-grid-description-text-color);
  font-family: var(--fui-category-grid-description-font-family);
  font-size: var(--fui-category-grid-description-font-size);
  line-height: var(--fui-category-grid-description-line-height);
  font-weight: var(--fui-category-grid-description-font-weight);
  letter-spacing: var(--fui-category-grid-description-letter-spacing);
  font-feature-settings: var(--fui-category-grid-description-font-feature-settings);
  font-variation-settings: var(--fui-category-grid-description-font-variation-settings);
}

@utility fui-category-grid-dismiss {
  --tw-sort: container-type;
  border-radius: var(--fui-category-grid-dismiss-rounded);
  margin-inline-end: var(--fui-category-grid-dismiss-bleed-end);
  margin-inline-start: var(--fui-category-grid-dismiss-margin-start);
  width: var(--fui-category-grid-dismiss-size);
  height: var(--fui-category-grid-dismiss-size);
  &:hover {
    background-color: var(--fui-category-grid-dismiss-hover-background-color);
  }
}

@utility fui-category-grid {
  --tw-sort: container-type;
  width: var(--fui-category-grid-width);
}

@utility fui-cart-item-detailed-line {
  --tw-sort: container-type;
  gap: var(--fui-cart-item-detailed-line-gap);
}

@utility fui-cart-item-detailed-image {
  --tw-sort: container-type;
  border: var(--fui-cart-item-detailed-image-border);
  border-color: var(--fui-cart-item-detailed-image-border-color);
  border-radius: var(--fui-cart-item-detailed-image-rounded);
  width: var(--fui-cart-item-detailed-image-size);
  height: var(--fui-cart-item-detailed-image-size);
}

@utility fui-cart-item-detailed-quantity {
  --tw-sort: container-type;
  font-family: var(--fui-cart-item-detailed-quantity-font-family);
  font-size: var(--fui-cart-item-detailed-quantity-font-size);
  line-height: var(--fui-cart-item-detailed-quantity-line-height);
  font-weight: var(--fui-cart-item-detailed-quantity-font-weight);
  letter-spacing: var(--fui-cart-item-detailed-quantity-letter-spacing);
  font-feature-settings: var(--fui-cart-item-detailed-quantity-font-feature-settings);
  font-variation-settings: var(--fui-cart-item-detailed-quantity-font-variation-settings);
  width: var(--fui-cart-item-detailed-quantity-width);
}

@utility fui-cart-item-detailed {
  --tw-sort: container-type;
  display: var(--fui-cart-item-detailed-display);
  flex-direction: var(--fui-cart-item-detailed-flex-direction);
  gap: var(--fui-cart-item-detailed-gap);
}

@utility fui-cart-item-compact-image {
  --tw-sort: container-type;
  border: var(--fui-cart-item-compact-image-border);
  border-color: var(--fui-cart-item-compact-image-border-color);
  border-radius: var(--fui-cart-item-compact-image-rounded);
  width: var(--fui-cart-item-compact-image-size);
  height: var(--fui-cart-item-compact-image-size);
}

@utility fui-cart-item-compact {
  --tw-sort: container-type;
  display: var(--fui-cart-item-compact-display);
  flex-direction: var(--fui-cart-item-compact-flex-direction);
  gap: var(--fui-cart-item-compact-gap);
}

@utility fui-cart-item-minimal-image {
  --tw-sort: container-type;
  border: var(--fui-cart-item-minimal-image-border);
  border-color: var(--fui-cart-item-minimal-image-border-color);
  border-radius: var(--fui-cart-item-minimal-image-rounded);
  width: var(--fui-cart-item-minimal-image-size);
  height: var(--fui-cart-item-minimal-image-size);
}

@utility fui-cart-item-minimal {
  --tw-sort: container-type;
  display: var(--fui-cart-item-minimal-display);
  flex-direction: var(--fui-cart-item-minimal-flex-direction);
  gap: var(--fui-cart-item-minimal-gap);
}

@utility fui-cart-minimal-title {
  --tw-sort: container-type;
  font-family: var(--fui-cart-minimal-title-font-family);
  font-size: var(--fui-cart-minimal-title-font-size);
  line-height: var(--fui-cart-minimal-title-line-height);
  font-weight: var(--fui-cart-minimal-title-font-weight);
  letter-spacing: var(--fui-cart-minimal-title-letter-spacing);
  font-feature-settings: var(--fui-cart-minimal-title-font-feature-settings);
  font-variation-settings: var(--fui-cart-minimal-title-font-variation-settings);
}

@utility fui-search-suggestions-image {
  --tw-sort: container-type;
  border: var(--fui-search-suggestions-image-border);
  border-color: var(--fui-search-suggestions-image-border-color);
  border-radius: var(--fui-search-suggestions-image-rounded);
  width: var(--fui-search-suggestions-image-size);
  height: var(--fui-search-suggestions-image-size);
}

@utility fui-search-suggestions-pick {
  --tw-sort: container-type;
  gap: var(--fui-search-suggestions-pick-gap);
  padding: var(--fui-search-suggestions-pick-padding);
}

@utility fui-order-summary-image {
  --tw-sort: container-type;
  border: var(--fui-order-summary-image-border);
  border-color: var(--fui-order-summary-image-border-color);
  border-radius: var(--fui-order-summary-image-rounded);
  width: var(--fui-order-summary-image-size);
  height: var(--fui-order-summary-image-size);
}

@utility fui-order-tracking-eta {
  --tw-sort: container-type;
  font-family: var(--fui-order-tracking-eta-font-family);
  font-size: var(--fui-order-tracking-eta-font-size);
  line-height: var(--fui-order-tracking-eta-line-height);
  font-weight: var(--fui-order-tracking-eta-font-weight);
  letter-spacing: var(--fui-order-tracking-eta-letter-spacing);
  font-feature-settings: var(--fui-order-tracking-eta-font-feature-settings);
  font-variation-settings: var(--fui-order-tracking-eta-font-variation-settings);
}

@utility fui-order-tracking-parcel {
  --tw-sort: container-type;
  background-color: var(--fui-order-tracking-parcel-background-color);
  border-radius: var(--fui-order-tracking-parcel-rounded);
  padding-inline: var(--fui-order-tracking-parcel-padding-x);
  padding-block: var(--fui-order-tracking-parcel-padding-y);
  gap: var(--fui-order-tracking-parcel-gap);
}

@utility fui-account-access-delete-title {
  --tw-sort: container-type;
  color: var(--fui-account-access-delete-title-text-color);
}

@utility fui-product-options-image {
  --tw-sort: container-type;
  background-color: var(--fui-product-options-image-background-color);
  border-radius: var(--fui-product-options-image-rounded);
}

@utility fui-filters-range-to {
  --tw-sort: container-type;
  color: var(--fui-filters-range-to-text-color);
  font-family: var(--fui-filters-range-to-font-family);
  font-size: var(--fui-filters-range-to-font-size);
  line-height: var(--fui-filters-range-to-line-height);
  font-weight: var(--fui-filters-range-to-font-weight);
  letter-spacing: var(--fui-filters-range-to-letter-spacing);
  font-feature-settings: var(--fui-filters-range-to-font-feature-settings);
  font-variation-settings: var(--fui-filters-range-to-font-variation-settings);
}

@utility fui-reviews-stars {
  --tw-sort: container-type;
  color: var(--fui-reviews-stars-text-color);
  font-family: var(--fui-reviews-stars-font-family);
  font-size: var(--fui-reviews-stars-font-size);
  line-height: var(--fui-reviews-stars-line-height);
  font-weight: var(--fui-reviews-stars-font-weight);
  letter-spacing: var(--fui-reviews-stars-letter-spacing);
  font-feature-settings: var(--fui-reviews-stars-font-feature-settings);
  font-variation-settings: var(--fui-reviews-stars-font-variation-settings);
  width: var(--fui-reviews-stars-width);
}

@utility fui-reviews-count {
  --tw-sort: container-type;
  color: var(--fui-reviews-count-text-color);
  font-family: var(--fui-reviews-count-font-family);
  font-size: var(--fui-reviews-count-font-size);
  line-height: var(--fui-reviews-count-line-height);
  font-weight: var(--fui-reviews-count-font-weight);
  letter-spacing: var(--fui-reviews-count-letter-spacing);
  font-feature-settings: var(--fui-reviews-count-font-feature-settings);
  font-variation-settings: var(--fui-reviews-count-font-variation-settings);
  width: var(--fui-reviews-count-width);
  text-align: var(--fui-reviews-count-text-align);
}

@utility fui-reviews-verified {
  --tw-sort: container-type;
  color: var(--fui-reviews-verified-text-color);
  font-family: var(--fui-reviews-verified-font-family);
  font-size: var(--fui-reviews-verified-font-size);
  line-height: var(--fui-reviews-verified-line-height);
  font-weight: var(--fui-reviews-verified-font-weight);
  letter-spacing: var(--fui-reviews-verified-letter-spacing);
  font-feature-settings: var(--fui-reviews-verified-font-feature-settings);
  font-variation-settings: var(--fui-reviews-verified-font-variation-settings);
  gap: var(--fui-reviews-verified-gap);
  & :where([data-icon]) {
    width: var(--fui-reviews-verified-icon-size);
    height: var(--fui-reviews-verified-icon-size);
  }
}

@utility fui-return-request-option {
  --tw-sort: container-type;
  font-weight: var(--fui-return-request-option-font-weight);
}

@utility fui-delivery-slot-price {
  --tw-sort: container-type;
  color: var(--fui-delivery-slot-price-text-color);
  font-family: var(--fui-delivery-slot-price-font-family);
  font-size: var(--fui-delivery-slot-price-font-size);
  line-height: var(--fui-delivery-slot-price-line-height);
  font-weight: var(--fui-delivery-slot-price-font-weight);
  letter-spacing: var(--fui-delivery-slot-price-letter-spacing);
  font-feature-settings: var(--fui-delivery-slot-price-font-feature-settings);
  font-variation-settings: var(--fui-delivery-slot-price-font-variation-settings);
}

@utility fui-checkout-page-root {
  --tw-sort: container-type;
  background-color: var(--fui-checkout-page-root-background-color);
  color: var(--fui-checkout-page-root-text-color);
}

@utility fui-checkout-page-summary {
  --tw-sort: container-type;
  background-color: var(--fui-checkout-page-summary-background-color);
  color: var(--fui-checkout-page-summary-text-color);
}

@utility fui-checkout-page-summary-toggle {
  --tw-sort: container-type;
  font-family: var(--fui-checkout-page-summary-toggle-font-family);
  font-size: var(--fui-checkout-page-summary-toggle-font-size);
  line-height: var(--fui-checkout-page-summary-toggle-line-height);
  font-weight: var(--fui-checkout-page-summary-toggle-font-weight);
  letter-spacing: var(--fui-checkout-page-summary-toggle-letter-spacing);
  font-feature-settings: var(--fui-checkout-page-summary-toggle-font-feature-settings);
  font-variation-settings: var(--fui-checkout-page-summary-toggle-font-variation-settings);
  gap: var(--fui-checkout-page-summary-toggle-gap);
}

@utility fui-checkout-page-total-image {
  --tw-sort: container-type;
  border: var(--fui-checkout-page-total-image-border);
  border-color: var(--fui-checkout-page-total-image-border-color);
  border-radius: var(--fui-checkout-page-total-image-rounded);
  width: var(--fui-checkout-page-total-image-size);
  height: var(--fui-checkout-page-total-image-size);
}

@utility fui-review-list {
  --tw-sort: container-type;
  width: var(--fui-review-list-width);
}

@utility fui-cart-full {
  --tw-sort: container-type;
  display: var(--fui-cart-full-display);
  flex-direction: var(--fui-cart-full-flex-direction);
  gap: var(--fui-cart-full-gap);
}

@utility fui-filter-sheet {
  --tw-sort: container-type;
  width: var(--fui-filter-sheet-width);
}

@utility fui-filter-sidebar {
  --tw-sort: container-type;
  width: var(--fui-filter-sidebar-width);
}

@property --fui-ring-color {
  syntax: '*';
  inherits: false;
}

@property --fui-ring-border-color {
  syntax: '*';
  inherits: false;
}

@layer base {
  :where([class*='fui-focus-ring']) {
    outline: 0 solid var(--fui-ring-color, var(--fui-focus-ring-outline-color));
  }
}