:root {
  --control-height-compact: var(--band-height-sm);
  --control-height-default: var(--band-height-md);
  --control-height-comfortable: var(--band-height-xl);
  --control-padding-x-compact: var(--space-2);
  --control-padding-x-default: var(--space-3);
  --control-padding-x-comfortable: var(--space-4);

  --control-bounded-width: min(15rem, 48vw);

  --control-height: calc(var(--control-height-default) * var(--scaling));

  --control-height-sm: calc(var(--control-height) - calc(0.25rem * var(--scaling)));
  --control-height-lg: calc(var(--control-height) + calc(0.25rem * var(--scaling)));
  --control-height-xs: calc(var(--control-height) - calc(0.5rem * var(--scaling)));
  --control-padding-x: var(--control-padding-x-default);
  --control-gap: var(--space-inline-sm);
  --control-gap-sm: var(--space-inline-xs);
  --control-radius: var(--radius);

  --button-radius: var(--radius-md);

  --control-font-size: var(--font-size-base);
  --control-border-width: var(--stroke-hairline);
  --control-shadow: var(--shadow-xs);
  --control-icon-size: calc(var(--icon-size-md) * var(--scaling));
  --control-icon-size-sm: calc(var(--icon-size-sm) * var(--scaling));

  --control-status-warning-border-color: var(--warning);
  --control-status-warning-glow-color: var(--warning);
  --control-status-warning-glow-alpha: var(--control-outline-error-alpha);

  --number-input-touch-height: var(--band-height-2xl);

  --control-variant-filled-background: var(--muted);
  --control-variant-filled-hover-background: initial;

  --control-count-font-size: var(--font-size-sm, var(--font-size-base));
  --control-count-color: var(--muted-foreground);

  --control-count-exceeded-color: initial;
  --control-count-space-inline: var(--space-1);
  --textarea-count-inset-block-end: var(--space-1);
  --textarea-count-inset-inline-end: var(--space-2);

  --input-addon-background: var(--muted);
  --input-addon-color: var(--muted-foreground);
  --input-addon-padding-inline: var(--control-padding-x);

  --switch-content-font-size: var(
    --font-size-xs,
    calc(var(--font-size-base) / var(--font-size-ratio))
  );
  --switch-content-space-inline: var(--space-1);
  --switch-spinner-size: calc(var(--switch-thumb-size) - var(--space-1));

  --slider-mark-font-size: var(
    --font-size-xs,
    calc(var(--font-size-base) / var(--font-size-ratio))
  );
  --slider-mark-color: var(--muted-foreground);
  --slider-mark-space-block-start: var(--space-2);
  --slider-dot-size: var(--slider-track-height);
  --slider-dot-background: var(--background);
  --slider-dot-border-color: var(--border);
  --slider-dot-active-border-color: initial;
  --slider-tooltip-background: var(--popover);
  --slider-tooltip-color: var(--popover-foreground);
  --slider-tooltip-font-size: var(
    --font-size-xs,
    calc(var(--font-size-base) / var(--font-size-ratio))
  );
  --slider-tooltip-radius: var(--radius-sm);
  --slider-tooltip-padding-inline: var(--space-2);
  --slider-tooltip-offset-block: var(--space-2);

  --choice-button-background: var(--background);
  --choice-button-color: var(--foreground);
  --choice-button-border-color: var(--input);

  --choice-button-selected-color: initial;
  --choice-button-selected-border-color: initial;
  --choice-button-solid-background: initial;
  --choice-button-solid-color: initial;

  --toggle-focus-ring-width: var(--stroke-lg);
  --toggle-focus-ring-alpha: 1;

  --control-focus-ring-width: var(--stroke-hairline);

  --rating-focus-ring-offset: 2px;

  --rating-star-filled-color: initial;
  --rating-star-empty-color: initial;
  --rating-star-empty-alpha: 0.45;

  --checkbox-border-width: var(--stroke-hairline);
  --checkbox-size: calc(1rem * var(--scaling));
  --checkbox-size-compact: 0.875rem;
  --checkbox-size-comfortable: 1.125rem;
  --choice-gap: var(--space-inline-sm);
  --choice-group-gap-x: var(--space-6);
  --choice-group-gap-y: var(--space-3);
  --choice-description-gap: 0.125rem;
  --choice-control-offset: 0.125rem;

  --switch-width: calc(2.25rem * var(--scaling));
  --switch-width-compact: 2rem;
  --switch-width-comfortable: 2.5rem;
  --switch-height: calc(1.25rem * var(--scaling));
  --switch-height-compact: 1.125rem;
  --switch-height-comfortable: 1.375rem;
  --switch-thumb-size: calc(1rem * var(--scaling));
  --switch-thumb-size-compact: 0.875rem;
  --switch-thumb-size-comfortable: 1.125rem;
  --switch-thumb-translate: calc(1rem * var(--scaling));
  --switch-thumb-translate-compact: 0.875rem;
  --switch-thumb-translate-comfortable: 1.125rem;

  --slider-track-height: 0.375rem;
  --slider-thumb-size: 1rem;

  --slider-vertical-min-block-size: 10rem;

  --otp-slot-size: initial;

  --otp-slot-inline-size: initial;
  --otp-slot-block-size: initial;

  --otp-container-align: flex-start;

  --checkbox-checked-background: initial;
  --switch-checked-background: initial;
  --toggle-on-background: initial;
  --slider-track-background: initial;
  --slider-range-background: initial;

  --switch-unchecked-background: initial;

  --switch-content-unchecked-foreground: initial;

  --color-picker-input-width: 6.5rem;

  --command-list-max-height: min(300px, 50vh);
  --command-input-padding-x: var(--space-3);
  --command-group-padding: var(--space-1);
  --command-item-padding-y: var(--space-2);
  --command-item-padding-x: var(--space-2);

  --command-item-gap: var(--control-gap);

  --command-list-split-padding: 0;
  --command-list-split-inset: 0px;
  --command-item-divider-width: var(--stroke-hairline);
  --command-item-divider-color: initial;
  --command-palette-width: 35rem;
  --command-palette-inset-top: calc(var(--space-6) * 4);
  --command-palette-viewport-inset: var(--space-3);
  --command-palette-hint-padding-y: var(--space-2);
  --command-palette-hint-padding-x: var(--space-4);
  --command-palette-hint-gap: var(--space-4);

  --search-input-edge-inset: var(--space-3);
  --search-input-start-padding: calc(
    var(--search-input-edge-inset) + var(--control-icon-size) + var(--control-gap)
  );
  --search-input-end-padding: calc(
    var(--search-input-edge-inset) + var(--control-icon-size) + var(--control-gap)
  );

  --choice-description-font-size: var(
    --font-size-xs,
    calc(var(--font-size-base) / var(--font-size-ratio))
  );
  --color-picker-hex-font-size: var(
    --font-size-xs,
    calc(var(--font-size-base) / var(--font-size-ratio))
  );
  --command-group-heading-font-size: var(
    --font-size-xs,
    calc(var(--font-size-base) / var(--font-size-ratio))
  );
  --search-input-label-font-size: var(
    --font-size-xs,
    calc(var(--font-size-base) / var(--font-size-ratio))
  );
  --tag-input-chip-font-size: var(
    --font-size-xs,
    calc(var(--font-size-base) / var(--font-size-ratio))
  );
  --toggle-sm-font-size: var(--font-size-xs, calc(var(--font-size-base) / var(--font-size-ratio)));
  --toggle-xs-font-size: var(--font-size-xs, calc(var(--font-size-base) / var(--font-size-ratio)));
  --button-sm-font-size: var(--font-size-xs, calc(var(--font-size-base) / var(--font-size-ratio)));
}

:root {

  --control-affix-inset-inline-end: var(--space-2);
  --control-affix-action-size: 1.5rem;
  --control-affix-action-radius: var(--radius-sm);
  --control-affix-icon-size: var(--icon-size-md);

  --control-affix-rest-alpha: 0.5;

  --control-trigger-space-inline-end: 2.25rem;

  --control-inline-affix-size: 1.25rem;
  --control-inline-affix-icon-size: var(--control-affix-icon-size);
  --control-inline-affix-space-gap: var(--space-1);
  --control-inline-affix-inset-inline: var(--space-2);
  --control-inline-affix-rest-alpha: 0.7;

  --control-inline-affix-space-inline-end: 2.25rem;

  --textarea-clear-inset-block-start: var(--space-2);

  --control-multiline-padding-block: var(--space-2);

  --textarea-autogrow-line-height: initial;

  --textarea-autogrow-min-height-rows: 1;

  --textarea-autogrow-max-height-rows: 8;

  --textarea-autogrow-box-inset: calc(
    (var(--control-multiline-padding-block) + var(--control-border-width)) * 2
  );

  --control-composite-field-space-gap: var(--space-2);

  --input-file-button-height: var(--band-height-sm);
  --input-file-button-font-size: var(--font-size-sm, var(--font-size-base));

  --search-select-panel-max-width: 32rem;

  --search-select-panel-inline-size: auto;
  --search-select-panel-viewport-inset: var(--space-6);
  --search-select-list-space-inset: var(--space-1);

  --search-select-list-max-height: none;
  --search-select-footer-space-inset: var(--space-1);
  --search-select-option-space-gap: var(--space-2);
  --search-select-option-font-size: var(--font-size-sm, var(--font-size-base));
  --search-select-option-sublabel-font-size: var(
    --font-size-xs,
    calc(var(--font-size-base) / var(--font-size-ratio))
  );
  --search-select-status-space-inline: var(--space-2);
  --search-select-status-space-block: var(--space-3);

  --search-select-placeholder-space-block: var(--space-6);
  --search-select-status-font-size: var(--font-size-sm, var(--font-size-base));
  --search-select-spinner-size: 1rem;

  --cascader-column-min-width: 9rem;
  --cascader-columns-max-height: min(280px, 50vh);
  --cascader-list-max-height: min(300px, 50vh);
  --cascader-panel-space-inset: var(--space-1);
  --cascader-option-space-inline: var(--space-3);
  --cascader-option-space-block: var(--space-2);
  --cascader-option-space-gap: var(--space-1);
  --cascader-option-font-size: var(--font-size-sm, var(--font-size-base));
  --cascader-option-icon-size: var(--icon-size-md);

  --cascader-result-space-inline: var(--space-2);
  --cascader-result-space-block: 0.375rem;
  --cascader-result-radius: var(--radius-sm);
  --cascader-result-icon-space-inline-end: var(--space-2);
  --cascader-empty-space-block: var(--space-6);

  --select-content-max-height: 24rem;

  --select-content-inline-size: auto;

  --select-empty-space-block: var(--search-select-placeholder-space-block);
  --select-scroll-button-space-block: var(--space-1);

  --select-item-space-inline: 0.625rem;

  --time-picker-column-height: 13rem;
  --time-picker-panel-width: 9rem;

  --time-picker-panel-width-12h: 13rem;
  --time-picker-heading-space-inline: var(--space-1);
  --time-picker-heading-space-block: 0.375rem;
  --time-picker-heading-font-size: var(
    --font-size-xs,
    calc(var(--font-size-base) / var(--font-size-ratio))
  );
  --time-picker-column-space-inset: var(--space-1);
  --time-picker-option-space-block: 0.375rem;
  --time-picker-option-radius: var(--radius-md);
  --time-picker-option-font-size: var(--font-size-sm, var(--font-size-base));
  --time-picker-footer-space-inset: var(--space-2);
  --time-picker-footer-space-gap: var(--space-2);

  --time-picker-affix-space-gap: var(--control-inline-affix-space-gap);

  --tree-select-list-max-height: min(300px, 50vh);
  --tree-select-row-space-block: 0.375rem;
  --tree-select-row-space-inline-end: var(--space-2);
  --tree-select-row-radius: var(--radius-sm);
  --tree-select-row-font-size: var(--font-size-sm, var(--font-size-base));

  --tree-select-depth-space-base: var(--space-2);
  --tree-select-depth-space-step: 1.25rem;
  --tree-select-toggle-size: 1.25rem;
  --tree-select-toggle-space-inline-end: var(--space-1);
  --tree-select-label-space-gap: var(--space-2);
  --tree-select-empty-space-block: var(--space-6);

  --calendar-space-inset: var(--space-3);

  --calendar-month-space-gap: var(--space-4);
  --calendar-caption-space-inline: var(--space-8);
  --calendar-caption-font-size: var(--font-size-sm, var(--font-size-base));
  --calendar-nav-space-block-start: var(--space-3);

  --calendar-nav-space-inline: var(--calendar-space-inset);

  --calendar-nav-rest-alpha: 0.7;

  --calendar-grid-space-block-start: var(--space-3);
  --calendar-week-space-block-start: var(--space-2);
  --calendar-weekday-font-size: var(
    --font-size-xs,
    calc(var(--font-size-base) / var(--font-size-ratio))
  );
  --calendar-weekday-radius: var(--radius-md);
  --calendar-day-font-size: var(--font-size-sm, var(--font-size-base));
  --calendar-day-radius: var(--radius-md);
  --calendar-chevron-size: var(--icon-size-md);
  --calendar-footer-space-gap: var(--space-2);
  --calendar-footer-space-block-start: var(--space-2);
  --calendar-footer-border-width: var(--stroke-hairline);

  --calendar-bordered-weekday-padding-block: var(--space-1);

  --calendar-grid-border-color: initial;

  --transfer-pane-min-height: 14rem;
  --transfer-pane-radius: var(--radius-md);
  --transfer-panes-space-gap: var(--space-3);
  --transfer-header-space-inline: var(--space-3);
  --transfer-header-space-block: var(--space-2);
  --transfer-header-font-size: var(--font-size-sm, var(--font-size-base));
  --transfer-header-space-gap: var(--space-2);
  --transfer-search-space-inset: var(--space-2);
  --transfer-list-space-inset: var(--space-1);
  --transfer-row-space-inline: var(--space-2);
  --transfer-row-space-block: var(--space-2);
  --transfer-row-space-gap: var(--space-2);
  --transfer-row-radius: var(--radius-sm);
  --transfer-row-font-size: var(--font-size-sm, var(--font-size-base));

  --transfer-row-check-space-block-start: 0.125rem;
  --transfer-row-description-font-size: var(
    --font-size-xs,
    calc(var(--font-size-base) / var(--font-size-ratio))
  );
  --transfer-empty-space-block: var(--space-8);
  --transfer-actions-space-gap: var(--space-2);
  --transfer-action-icon-size: var(--icon-size-md);

  --month-picker-panel-space-inset: var(--space-3);
  --month-picker-grid-space-block-start: var(--space-3);
  --month-picker-grid-space-gap: var(--space-1);
  --month-picker-cell-space-inline: var(--space-4);
  --month-picker-nav-font-size: var(--font-size-sm, var(--font-size-base));

  --month-picker-nav-rest-alpha: var(--calendar-nav-rest-alpha);
  --month-picker-icon-size: var(--icon-size-md);
  --month-picker-separator-icon-size: var(--icon-size-sm);

  --button-xs-height: initial;

  --button-bare-target-size: initial;
  --button-xs-space-inline: var(--space-2);
  --button-xs-space-gap: var(--space-1);
  --button-xs-font-size: var(--font-size-xs, calc(var(--font-size-base) / var(--font-size-ratio)));
  --button-xs-icon-size: var(--icon-size-xs);

  --button-icon-space-inline-md: var(--space-3);
  --button-icon-space-inline-sm: 0.625rem;
  --button-icon-space-inline-lg: var(--space-4);
  --button-icon-space-inline-xs: 0.375rem;
  --button-space-block: var(--space-2);

  --otp-caret-block-size: 1rem;
  --otp-caret-inline-size: var(--stroke-hairline);
  --otp-separator-icon-size: var(--icon-size-md);

  --button-count-min-width: var(--space-4);
  --button-count-space-inline: var(--space-1);
  --button-count-font-size: var(
    --font-size-xs,
    calc(var(--font-size-base) / var(--font-size-ratio))
  );

  --button-count-background: initial;
  --button-count-color: initial;
  --button-count-default-background: initial;
  --button-count-default-color: initial;
  --button-count-destructive-background: initial;
  --button-count-destructive-color: initial;
  --button-count-secondary-background: initial;
  --button-count-secondary-color: initial;

  --control-label-font-size: var(--font-size-sm, var(--font-size-base));

  --control-label-line-height: var(--line-height-normal);

  --control-label-space-gap: 0.5rem;

  --control-label-disabled-alpha: 0.7;

  --control-surface-border-color: initial;
  --control-surface-background: initial;

  --control-filled-border-color: transparent;
  --control-filled-background: initial;
  --control-filled-shadow: none;

  --control-borderless-border-color: transparent;
  --control-borderless-background: transparent;
  --control-borderless-shadow: none;

  --control-status-error-border-color: hsl(var(--destructive));
  --control-status-warning-border-color: initial;

  --control-status-warning-outline-color: initial;
}

@media (pointer: coarse) {
  :root {
    --control-height-compact: var(--band-height-xl);
    --control-height-default: var(--band-height-xl);
  }
}

:root {
  --textarea-padding-block-start: initial;
  --textarea-padding-block-end: initial;
  --textarea-padding-inline-start: initial;
  --textarea-padding-inline-end: initial;
}