/* component */
:root {
    --button-common-radius: var(--radius-max);
    --button-common-padding-x: var(--spacing-component-padding-sm);
    --button-common-icon-size: var(--icon-size-medium);
    --button-common-gap: var(--spacing-component-gap-sm);
    --button-size-small-height: var(--scale-control-sm);
    --button-size-small-icon-size: var(--icon-size-small);
    --button-size-small-padding-x: var(--spacing-component-padding-sm);
    --button-size-small-gap: var(--spacing-component-gap-xs);
    --button-solid-primary-default-bg: var(--color-bg-primary-default);
    --button-solid-primary-hover-bg: var(--color-bg-primary-hover);
    --button-solid-primary-default-font: var(--font-color-onbrand-default);
    --button-solid-primary-hover-font: var(--font-color-onbrand-default);
    --button-solid-primary-default-icon: var(--icon-color-onbrand-default);
    --button-solid-primary-hover-icon: var(--icon-color-onbrand-hover);
    --button-common-padding-y: var(--spacing-component-padding-sm);
    --button-size-small-radius: var(--radius-max);
    --button-size-medium-height: var(--scale-control-md);
    --button-size-medium-icon-size: var(--icon-size-small);
    --button-size-medium-padding-x: var(--spacing-component-padding-md);
    --button-size-medium-gap: var(--spacing-component-gap-xs);
    --button-size-medium-radius: var(--radius-max);
    --button-size-large-height: var(--scale-control-lg);
    --button-size-large-icon-size: var(--icon-size-medium);
    --button-size-large-padding-x: var(--spacing-component-padding-lg);
    --button-size-large-gap: var(--spacing-component-gap-xs);
    --button-size-large-radius: var(--radius-max);
    --button-solid-primary-disabled-bg: var(--color-bg-disabled);
    --button-solid-primary-disabled-font: var(--font-color-disabled);
    --button-solid-primary-disabled-icon: var(--icon-color-disabled);
    --button-outline-default-border: var(--border-color-default);
    --button-outline-default-font: var(--font-color-primary-default);
    --button-outline-default-icon: var(--icon-color-primary-muted);
    --button-outline-hover-bg: var(--color-bg-surface-muted);
    --button-outline-hover-font: var(--font-color-primary-default);
    --button-outline-hover-icon: var(--icon-color-primary-muted);
    --button-outline-disabled-bg: var(--color-bg-surface-default);
    --button-outline-disabled-font: var(--font-color-disabled);
    --button-outline-disabled-icon: var(--icon-color-disabled);
    --button-outline-default-bg: var(--color-bg-surface-default);
    --button-outline-hover-border: var(--border-color-default);
    --button-outline-disabled-border: var(--color-state-neutral);
    --button-solid-secondary-default-bg: var(--color-bg-secondary-default);
    --button-solid-secondary-default-font: var(--font-color-primary-default);
    --button-solid-secondary-default-icon: var(--icon-color-primary-muted);
    --button-solid-secondary-hover-bg: var(--color-bg-secondary-hover);
    --button-solid-secondary-hover-font: var(--font-color-primary-default);
    --button-solid-secondary-hover-icon: var(--icon-color-primary-muted);
    --button-solid-secondary-disabled-bg: var(--color-bg-disabled);
    --button-solid-secondary-disabled-font: var(--font-color-disabled);
    --button-solid-secondary-disabled-icon: var(--icon-color-disabled);
    --button-ghost-default-font: var(--font-color-primary-default);
    --button-ghost-default-icon: var(--icon-color-primary-muted);
    --button-ghost-hover-bg: var(--color-bg-surface-muted);
    --button-ghost-hover-font: var(--font-color-primary-default);
    --button-ghost-hover-icon: var(--icon-color-primary-muted);
    --button-ghost-disabled-font: var(--font-color-disabled);
    --button-ghost-disabled-icon: var(--icon-color-disabled);
    --button-link-default-font: var(--font-color-link-default);
    --button-link-default-icon: var(--icon-color-link-default);
    --button-link-hover-bg: var(--color-bg-surface-muted);
    --button-link-hover-font: var(--font-color-link-hover);
    --button-link-hover-icon: var(--icon-color-link-hover);
    --button-link-disabled-font: var(--font-color-link-default);
    --button-link-disabled-icon: var(--icon-color-link-default);
    --button-size-small-opacity: var(--opacity-state-disabled);
    --button-common-opacity: var(--opacity-state-disabled);
    --button-size-medium-opacity: var(--opacity-state-disabled);
    --button-size-large-opacity: var(--opacity-state-disabled);
    --button-outline-border-width: var(--border-width-thin);
    --input-common-radius: var(--radius-medium);
    --input-common-padding-x: var(--spacing-component-padding-md);
    --input-common-padding-y: var(--spacing-component-padding-sm);
    --input-common-gap: var(--spacing-component-gap-sm);
    --input-common-icon-size-sm: var(--icon-size-small);
    --input-common-opacity: var(--opacity-state-disabled);
    --input-solid-default-bg: var(--color-bg-surface-muted);
    --input-solid-default-font: var(--font-color-primary-muted);
    --input-solid-default-icon: var(--icon-color-primary-muted);
    --input-common-height: var(--scale-lg);
    --input-solid-default-border: var(--border-color-default);
    --input-common-border-width: var(--border-width-thin);
    --input-solid-hover-bg: var(--color-bg-surface-alt);
    --input-solid-hover-border: var(--border-color-default);
    --input-solid-hover-font: var(--font-color-primary-muted);
    --input-solid-hover-icon: var(--icon-color-primary-muted);
    --input-solid-focus-bg: var(--color-bg-surface-muted);
    --input-solid-focus-border: var(--border-color-focus);
    --input-solid-focus-font: var(--font-color-primary-muted);
    --input-solid-focus-icon: var(--icon-color-primary-muted);
    --input-solid-filled-bg: var(--color-bg-surface-muted);
    --input-solid-filled-border: var(--border-color-default);
    --input-solid-filled-font: var(--font-color-primary-default);
    --input-solid-filled-icon: var(--icon-color-primary-muted);
    --input-solid-fail-bg: var(--color-state-error-subtle);
    --input-solid-fail-border: var(--color-state-error-default);
    --input-solid-fail-font: var(--font-color-primary-default);
    --input-solid-fail-icon: var(--color-state-error-default);
    --input-solid-success-bg: var(--color-state-success-subtle);
    --input-solid-success-border: var(--color-state-success-default);
    --input-solid-success-font: var(--font-color-primary-default);
    --input-solid-success-icon: var(--color-state-success-default);
    --input-outline-default-bg: var(--color-bg-surface-default);
    --input-outline-default-border: var(--border-color-default);
    --input-outline-default-font: var(--font-color-primary-muted);
    --input-outline-default-icon: var(--icon-color-onbrand-default);
    --input-outline-hover-bg: var(--color-bg-surface-default);
    --input-outline-hover-border: var(--border-color-default);
    --input-outline-hover-font: var(--font-color-primary-muted);
    --input-outline-hover-icon: var(--icon-color-onbrand-default);
    --input-outline-focus-bg: var(--color-bg-surface-default);
    --input-outline-focus-border: var(--border-color-focus);
    --input-outline-focus-font: var(--font-color-primary-muted);
    --input-outline-focus-icon: var(--icon-color-onbrand-default);
    --input-outline-filled-bg: var(--color-bg-surface-default);
    --input-outline-filled-border: var(--border-color-default);
    --input-outline-filled-font: var(--font-color-primary-default);
    --input-outline-filled-icon: var(--icon-color-onbrand-default);
    --input-outline-fail-bg: var(--color-bg-surface-default);
    --input-outline-fail-border: var(--color-state-error-default);
    --input-outline-fail-font: var(--font-color-primary-default);
    --input-outline-fail-icon: var(--color-state-error-default);
    --input-outline-success-bg: var(--color-bg-surface-default);
    --input-outline-success-border: var(--color-state-success-default);
    --input-outline-success-font: var(--font-color-primary-default);
    --input-outline-success-icon: var(--color-state-success-default);
    --checkbox-common-radius: var(--radius-small);
    --checkbox-common-scale: var(--scale-control-sm);
    --checkbox-common-icon-size: var(--icon-size-small);
    --checkbox-common-opacity: var(--opacity-state-disabled);
    --checkbox-solid-default-bg: var(--color-bg-surface-muted);
    --checkbox-solid-hover-bg: var(--color-bg-surface-accent);
    --checkbox-outline-border-width: var(--border-width-thin);
    --checkbox-solid-checked-bg: var(--color-bg-primary-default);
    --checkbox-solid-checked-icon: var(--icon-color-onbrand-default);
    --checkbox-outline-default-border: var(--border-color-primary-default);
    --checkbox-outline-hover-border: var(--border-color-primary-hover);
    --checkbox-outline-checked-bg: var(--color-bg-primary-default);
    --checkbox-outline-checked-border: var(--border-color-primary-default);
    --checkbox-outline-checked-icon: var(--icon-color-onbrand-default);
    --checkbox-outline-hover-bg: var(--color-bg-surface-muted);
    --checkbox-outline-default-bg: var(--color-bg-surface-default);
    --card-common-radius: var(--radius-large);
    --card-common-padding-x: var(--spacing-component-padding-xl);
    --card-common-padding-y: var(--spacing-component-padding-xl);
    --card-common-gap: var(--spacing-component-gap-2xl);
    --card-container-header-gap: var(--spacing-component-gap-sm);
    --card-container-header-title: var(--font-color-primary-default);
    --card-container-header-description: var(--font-color-primary-muted);
    --card-container-content-gap: var(--spacing-component-gap-lg);
    --card-container-content-title: var(--font-color-primary-default);
    --card-container-content-description: var(--font-color-primary-muted);
    --card-container-footer-gap: var(--spacing-component-gap-sm);
    --card-common-bg: var(--color-bg-surface-default);
    --card-common-border: var(--border-color-default);
    --input-common-helpertext: var(--font-color-negative);
    --input-common-group-gap: var(--spacing-component-gap-sm);
    --dropdown-item-common-radius: var(--radius-medium);
    --dropdown-item-common-padding-x: var(--spacing-component-padding-sm);
    --dropdown-item-common-height: var(--scale-control-md);
    --dropdown-item-icon-gap: var(--spacing-component-gap-sm);
    --dropdown-item-common-border-width: var(--border-width-thin);
    --dropdown-item-simple-default-font: var(--font-color-primary-default);
    --dropdown-item-icon-default-font: var(--font-color-primary-default);
    --dropdown-item-icon-default-icon: var(--icon-color-primary-muted);
    --dropdown-item-icon-disabled-font: var(--font-color-disabled);
    --dropdown-item-icon-disabled-icon: var(--icon-color-disabled);
    --dropdown-item-common-bg: var(--color-bg-surface-default);
    --dropdown-item-simple-hover-font: var(--font-color-primary-default);
    --dropdown-item-simple-disabled-font: var(--font-color-disabled);
    --label-font-default: var(--font-color-primary-default);
    --dropdown-item-icon-padding-x: var(--spacing-component-padding-sm);
    --dropdown-item-simple-hover-bg: var(--color-bg-surface-muted);
    --dropdown-item-common-border: var(--border-color-divider);
    --dropdown-item-icon-icon-size: var(--icon-size-medium);
    --dropdown-item-scroll-icon: var(--icon-color-onbrand-default);
    --dropdown-item-scroll-icon-size: var(--icon-size-small);
    --input-common-resizer: var(--icon-color-primary-muted);
    --label-gap: var(--spacing-component-gap-xs);
    --label-font-disabled: var(--font-color-disabled);
    --dropdown-item-header-font: var(--font-color-primary-default);
    --dropdown-item-common-padding-y: var(--spacing-component-padding-xs);
    --select-base-common-radius: var(--radius-medium);
    --select-base-common-padding-x: var(--spacing-component-padding-md);
    --select-base-common-height: var(--scale-control-lg);
    --select-base-common-border-width: var(--border-width-thin);
    --select-base-default-bg: var(--color-bg-surface-default);
    --select-base-default-border: var(--border-color-default);
    --select-base-common-gap: var(--spacing-component-padding-xs);
    --select-base-default-font: var(--font-color-primary-default);
    --select-base-default-icon: var(--icon-color-primary-muted);
    --select-base-hover-bg: var(--color-bg-surface-default);
    --select-base-hover-border: var(--border-color-primary-default);
    --select-base-hover-font: var(--font-color-primary-default);
    --select-base-hover-icon: var(--icon-color-primary-muted);
    --select-base-disabled-bg: var(--color-bg-surface-muted);
    --select-base-disabled-border: var(--border-color-default);
    --select-base-disabled-font: var(--icon-color-disabled);
    --select-base-disabled-icon: var(--icon-color-disabled);
    --select-dropdown-radius: var(--radius-medium);
    --select-dropdown-gap: var(--spacing-component-gap-xs);
    --select-dropdown-padding-x: var(--spacing-component-padding-xs);
    --select-dropdown-padding-y: var(--spacing-component-padding-xs);
    --select-dropdown-bg: var(--color-bg-surface-default);
    --select-base-common-icon-size: var(--icon-size-small);
    --select-dropdown-border: var(--border-color-default);
    --badge-common-radius: var(--radius-max);
    --badge-common-padding-x: var(--spacing-component-padding-sm);
    --badge-common-padding-y: var(--spacing-component-padding-xs);
    --badge-common-gap: var(--spacing-component-gap-xs);
    --badge-common-icon-size: var(--icon-size-micro);
    --badge-solid-bg: var(--color-bg-primary-muted);
    --badge-solid-font: var(--font-color-secondary-default);
    --badge-solid-icon: var(--icon-color-primary-default);
    --badge-outline-bg: var(--color-bg-surface-default);
    --badge-outline-font: var(--font-color-primary-default);
    --badge-outline-icon: var(--icon-color-primary-default);
    --badge-outline-border: var(--border-color-primary-default);
    --badge-outline-border-width: var(--borderwidth-default);
    --toggle-common-radius: var(--radius-max);
    --toggle-common-padding-x: var(--spacing-component-padding-sm);
    --toggle-common-padding-y: var(--spacing-component-padding-xs);
    --toggle-common-gap: var(--spacing-component-gap-xs);
    --toggle-common-icon-size: var(--icon-size-small);
    --toggle-solid-default-bg: var(--color-bg-surface-muted);
    --toggle-solid-default-font: var(--font-color-primary-default);
    --toggle-solid-default-icon: var(--icon-color-inverse-default);
    --toggle-solid-hover-bg: var(--color-bg-surface-accent);
    --toggle-solid-hover-font: var(--font-color-primary-default);
    --toggle-solid-hover-icon: var(--icon-color-onbrand-default);
    --toggle-solid-active-bg: var(--color-bg-primary-default);
    --toggle-solid-active-font: var(--font-color-primary-default);
    --toggle-solid-active-icon: var(--icon-color-onbrand-default);
    --toggle-common-opacity: var(--opacity-state-disabled);
    --toggle-outline-default-bg: var(--color-bg-surface-default);
    --toggle-outline-default-font: var(--font-color-primary-default);
    --toggle-outline-default-icon: var(--icon-color-onbrand-default);
    --toggle-outline-hover-bg: var(--color-bg-secondary-muted);
    --toggle-outline-active-bg: var(--color-bg-secondary-default);
    --toggle-outline-active-font: var(--font-color-primary-default);
    --toggle-outline-active-icon: var(--icon-color-onbrand-default);
    --toggle-outline-hover-font: var(--font-color-primary-default);
    --toggle-outline-hover-icon: var(--icon-color-onbrand-default);
    --toggle-outline-default-border: var(--border-color-secondary-default);
    --toggle-outline-border-width: var(--borderwidth-default);
    --toggle-outline-hover-border: var(--border-color-secondary-hover);
    --toggle-outline-active-border: var(--border-color-secondary-default);
    --toggle-common-gap-group: var(--spacing-component-gap-sm);
    --accordion-common-radius: var(--radius-small);
    --accordion-common-padding-x: var(--spacing-component-padding-lg);
    --accordion-common-padding-y: var(--spacing-component-padding-lg);
    --accordion-common-gap: var(--spacing-component-gap-lg);
    --accordion-default-icon-size: var(--icon-size-small);
    --accordion-default-closed-title: var(--font-color-primary-default);
    --accordion-default-closed-icon: var(--icon-color-primary-muted);
    --accordion-default-open-title: var(--font-color-primary-default);
    --accordion-default-open-icon: var(--icon-color-primary-muted);
    --accordion-default-hover-title: var(--font-color-primary-default);
    --accordion-default-hover-icon: var(--icon-color-primary-muted);
    --accordion-common-bg: var(--color-bg-surface-default);
    --accordion-default-border-width: var(--border-width-thin);
    --accordion-default-open-description: var(--font-color-primary-muted);
    --accordion-default-gap: var(--spacing-component-gap-sm);
    --accordion-default-open-gap: var(--spacing-component-gap-xs);
    --accordion-default-border: var(--border-color-default);
    --accordion-default-padding-y: var(--spacing-component-gap-lg);
    --accordion-custom-closed-title: var(--font-color-primary-default);
    --accordion-custom-closed-icon: var(--icon-color-primary-muted);
    --accordion-custom-gap: var(--spacing-component-gap-sm);
    --accordion-custom-padding-y: var(--spacing-component-gap-xl);
    --accordion-custom-border-width: var(--border-width-thin);
    --accordion-custom-icon-size: var(--icon-size-small);
    --accordion-custom-closed-border: var(--border-color-default);
    --accordion-custom-hover-title: var(--font-color-primary-default);
    --accordion-custom-hover-icon: var(--icon-color-secondary-default);
    --accordion-custom-open-title: var(--font-color-primary-default);
    --accordion-custom-open-description: var(--font-color-primary-muted);
    --accordion-custom-open-icon: var(--icon-color-primary-muted);
    --accordion-custom-open-gap: var(--spacing-component-gap-sm);
    --accordion-custom-closed-bg: var(--color-bg-surface-default);
    --accordion-custom-padding-x: var(--spacing-component-gap-xl);
    --accordion-custom-hover-bg: var(--color-bg-surface-muted);
    --accordion-custom-hover-border: var(--border-color-default);
    --accordion-custom-open-bg: var(--color-bg-surface-default);
    --accordion-custom-open-border: var(--border-color-default);
    --accordion-custom-radius: var(--radius-large);
    --accordion-custom-hover-gap: var(--spacing-component-gap-sm);
    --accordion-custom-closed-gap: var(--spacing-component-gap-sm);
    --dialog-common-radius: var(--radius-large);
    --dialog-common-padding-x: var(--spacing-component-padding-xl);
    --dialog-common-padding-y: var(--spacing-component-padding-xl);
    --dialog-common-gap: var(--spacing-component-gap-2xl);
    --dialog-common-bg: var(--color-bg-surface-default);
    --dialog-common-border: var(--border-color-default);
    --dialog-container-header-gap: var(--spacing-component-gap-sm);
    --dialog-container-header-title: var(--font-color-primary-default);
    --dialog-container-header-description: var(--font-color-primary-muted);
    --dialog-container-footer-gap: var(--spacing-component-gap-sm);
    --card-common-border-width: var(--border-width-thin);
    --dialog-common-border-width: var(--border-width-thin);
    --dropdown-container-radius: var(--radius-medium);
    --dropdown-container-gap: var(--spacing-component-gap-none);
    --dropdown-container-padding-x: var(--spacing-component-padding-xs);
    --dropdown-container-padding-y: var(--spacing-component-padding-xs);
    --dropdown-container-bg: var(--color-bg-surface-default);
    --dropdown-container-border: var(--border-color-default);
    --dropdown-container-border-width: var(--border-width-thin);
    --popover-common-radius: var(--radius-large);
    --popover-common-padding-x: var(--spacing-component-padding-lg);
    --popover-common-padding-y: var(--spacing-component-padding-lg);
    --popover-common-gap: var(--spacing-component-gap-xl);
    --popover-solid-bg: var(--color-bg-surface-default);
    --popover-solid-header-gap: var(--spacing-component-gap-sm);
    --popover-solid-header-title: var(--font-color-primary-default);
    --popover-solid-header-description: var(--font-color-primary-muted);
    --popover-solid-content-gap: var(--spacing-component-gap-lg);
    --popover-solid-footer-gap: var(--spacing-component-gap-sm);
    --popover-outline-header-gap: var(--spacing-component-gap-sm);
    --popover-outline-header-title: var(--font-color-primary-default);
    --popover-outline-header-description: var(--font-color-primary-muted);
    --popover-outline-content-gap: var(--spacing-component-gap-lg);
    --popover-outline-footer-gap: var(--spacing-component-gap-sm);
    --dropdown-item-simple-active-font: var(--font-color-primary-default);
    --dropdown-item-simple-active-icon: var(--icon-color-primary-default);
    --popover-outline-bg: var(--color-bg-surface-default);
    --popover-outline-border: var(--border-color-default);
    --popover-outline-border-width: var(--border-width-regular);
    --input-common-icon-size-md: var(--icon-size-medium);
    --tabs-item-common-radius: var(--radius-medium);
    --tabs-item-common-padding-x: var(--spacing-component-padding-sm);
    --tabs-item-common-padding-y: var(--spacing-component-padding-sm);
    --tabs-item-common-gap: var(--spacing-component-gap-xs);
    --tabs-item-common-icon-size: var(--icon-size-small);
    --tabs-item-solid-on-bg: var(--color-bg-primary-default);
    --tabs-item-solid-on-font: var(--font-color-onbrand-default);
    --tabs-item-solid-on-icon: var(--icon-color-onbrand-default);
    --tabs-item-solid-off-bg: var(--color-bg-surface-alt);
    --tabs-item-solid-off-font: var(--font-color-primary-muted);
    --tabs-item-solid-off-icon: var(--icon-color-primary-muted);
    --tabs-item-solid-line-on-bg: var(--color-bg-primary-default);
    --tabs-item-solid-line-on-font: var(--font-color-onbrand-default);
    --tabs-item-solid-line-on-icon: var(--icon-color-onbrand-default);
    --tabs-item-solid-line-off-bg: var(--color-bg-surface-default);
    --tabs-item-solid-line-off-font: var(--font-color-secondary-default);
    --tabs-item-solid-line-off-icon: var(--icon-color-primary-default);
    --tabs-item-solid-ghost-on-bg: var(--color-bg-primary-default);
    --tabs-item-solid-ghost-on-font: var(--font-color-onbrand-default);
    --tabs-item-solid-ghost-on-icon: var(--icon-color-onbrand-default);
    --tabs-item-solid-ghost-off-font: var(--font-color-primary-muted);
    --tabs-item-solid-ghost-off-icon: var(--icon-color-primary-muted);
    --tabs-item-bottom-border-on-font: var(--font-color-primary-default);
    --tabs-item-bottom-border-on-icon: var(--icon-color-primary-default);
    --tabs-item-bottom-border-off-font: var(--font-color-primary-muted);
    --tabs-item-bottom-border-off-icon: var(--icon-color-primary-muted);
    --tabs-container-radius: var(--radius-medium);
    --tabs-container-gap: var(--spacing-component-gap-xl);
    --tabs-container-padding-x: var(--spacing-component-padding-xs);
    --tabs-container-padding-y: var(--spacing-component-padding-xs);
    --tabs-container-bg: var(--color-bg-surface-muted);
    --tabs-item-solid-line-off-border: var(--border-color-primary-default);
    --tabs-item-solid-line-off-border-width: var(--border-width-thin);
    --tabs-item-bottom-border-on-border: var(--border-color-primary-default);
    --tabs-item-bottom-border-on-border-width: var(--border-width-thick);
    --tabs-item-solid-hover-bg: var(--color-bg-surface-accent);
    --tabs-item-solid-hover-font: var(--font-color-primary-muted);
    --tabs-item-solid-hover-icon: var(--icon-color-primary-muted);
    --tabs-item-solid-line-hover-bg: var(--color-bg-primary-muted);
    --tabs-item-solid-line-hover-font: var(--font-color-secondary-default);
    --tabs-item-solid-line-hover-icon: var(--icon-color-primary-default);
    --tabs-item-solid-line-hover-border: var(--border-color-primary-hover);
    --tabs-item-solid-line-hover-border-width: var(--border-width-thin);
    --tabs-item-solid-ghost-hover-font: var(--font-color-primary-muted);
    --tabs-item-solid-ghost-hover-icon: var(--icon-color-primary-muted);
    --tabs-item-solid-ghost-hover-bg: var(--color-bg-surface-muted);
    --tabs-item-bottom-border-hover-font: var(--font-color-primary-default);
    --tabs-item-bottom-border-hover-icon: var(--icon-color-primary-default);
    --table-item-common-gap: var(--spacing-component-gap-sm);
    --table-item-common-padding-x: var(--spacing-component-padding-lg);
    --table-item-common-padding-y: var(--spacing-component-padding-lg);
    --table-item-cell-bg: var(--color-bg-surface-default);
    --table-item-cell-font: var(--font-color-primary-default);
    --table-item-cell-icon: var(--icon-color-primary-muted);
    --table-container-radius: var(--radius-large);
    --table-container-bg: var(--color-bg-surface-default);
    --table-container-border: var(--border-color-default);
    --table-container-border-width: var(--border-width-thin);
    --table-item-cell-border: var(--border-color-default);
    --table-item-cell-boder-width: var(--border-width-thin);
    --table-item-cell-last-bg: var(--color-bg-surface-default);
    --table-item-cell-last-font: var(--font-color-primary-default);
    --table-item-cell-last-icon: var(--icon-color-primary-muted);
    --table-item-header-font: var(--font-color-primary-default);
    --table-item-header-icon: var(--icon-color-primary-muted);
    --table-item-header-border: var(--border-color-default);
    --table-item-header-boder-width: var(--border-width-thin);
    --table-item-footer-cell-bg: var(--color-bg-surface-accent);
    --table-item-footer-cell-font: var(--font-color-primary-default);
    --table-item-footer-cell-icon: var(--icon-color-primary-muted);
    --table-item-footer-cell-border: var(--border-color-default);
    --table-item-footer-cell-boder-width: var(--border-width-thin);
    --table-item-header-bg: var(--color-bg-surface-default);
    --table-item-common-icon-size: var(--icon-size-small);
    --table-item-common-radius: var(--radius-large);
    --badge-common-icon: true;
    --table-item-common-left-icon: false;
    --table-item-common-right-icon: false;
    --dialog-common-bg-overlay: var(--color-bg-overlay-default);
    --button-common-left-icon: true;
    --button-common-right-icon: true;
    --tabs-item-common-left-icon: false;
    --toggle-common-left-icon: true;
    --card-common-bg-hover: var(--color-bg-surface-muted);
    --card-common-border-hover: var(--border-color-default);
    --box-solid-radius: var(--radius-large);
    --box-solid-bg: var(--color-bg-surface-default);
    --box-solid-gap: var(--spacing-component-gap-lg);
    --box-solid-padding-x: var(--spacing-component-padding-xl);
    --box-solid-padding-y: var(--spacing-component-padding-xl);
    --box-outline-radius: var(--radius-large);
    --box-outline-gap: var(--spacing-component-gap-sm);
    --box-outline-padding-x: var(--spacing-component-padding-xl);
    --box-outline-padding-y: var(--spacing-component-padding-xl);
    --box-outline-border-width: var(--border-width-thin);
    --box-outline-bg: var(--color-bg-surface-default);
    --box-outline-border: var(--border-color-default);
    --code-block-solid-radius: var(--radius-medium);
    --code-block-solid-padding-x: var(--spacing-component-padding-lg);
    --code-block-solid-padding-y: var(--spacing-component-padding-lg);
    --code-block-solid-bg: var(--color-bg-surface-muted);
    --code-block-outline-radius: var(--radius-medium);
    --code-block-outline-padding-x: var(--spacing-component-padding-xl);
    --code-block-outline-padding-y: var(--spacing-component-padding-xl);
    --code-block-outline-border-width: var(--border-width-thin);
    --code-block-outline-bg: var(--color-bg-surface-muted);
    --code-block-outline-border: var(--border-color-default);
    --code-block-solid-font: var(--font-color-primary-default);
    --code-block-outline-font: var(--font-color-secondary-default);
    --progress-radius: var(--radius-max);
    --progress-solid-track: var(--color-progress-track);
    --progress-solid-fill: var(--color-progress-fill);
    --progress-height: var(--scale-control-xs);
    --skeleton-fill: var(--color-bg-disabled);
    --skeleton-radius: var(--radius-medium);
    --skeleton-radius-full: var(--radius-max);
    --scrollbar-fill: var(--color-bg-surface-accent);
    --scrollbar-radius: var(--radius-max);
    --scrollbar-horizontal-height: var(--scale-control-xs);
    --scrollbar-vertical-width: var(--scale-control-xs);
    --spinner-fill-base: var(--icon-color-primary-default);
    --spinner-fill-sub: var(--icon-color-primary-muted);
    --tooltip-radius: var(--radius-medium);
    --tooltip-gap: var(--spacing-component-gap-xs);
    --tooltip-padding-x: var(--spacing-component-padding-sm);
    --tooltip-padding-y: var(--spacing-component-padding-sm);
    --tooltip-solid-bg: var(--color-bg-surface-default);
    --tooltip-outline-border-width: var(--border-width-thin);
    --tooltip-outline-bg: var(--color-bg-surface-default);
    --tooltip-outline-border: var(--border-color-default);
    --tooltip-font: var(--font-color-primary-default);
    --tooltip-font-sub: var(--font-color-primary-muted);
    --table-item-cell-state-bg: var(--color-bg-surface-default);
    --table-item-cell-state-border: var(--border-color-default);
    --table-item-cell-state-boder-width: var(--border-width-thin);
    --table-item-cell-state-last-bg: var(--color-bg-surface-default);
    --separator-border: var(--border-color-default);
    --pagination-common-radius: var(--radius-medium);
    --pagination-common-padding-sm: var(--spacing-component-padding-sm);
    --pagination-common-gap: var(--spacing-component-gap-xs);
    --pagination-common-item-size: var(--scale-control-lg);
    --pagination-link-default-font: var(--font-color-primary-default);
    --pagination-link-default-icon: var(--icon-color-primary-muted);
    --pagination-link-hover-bg: var(--color-bg-surface-alt);
    --pagination-link-hover-font: var(--font-color-primary-default);
    --pagination-link-hover-icon: var(--icon-color-primary-muted);
    --pagination-item-default-font: var(--font-color-primary-default);
    --pagination-item-hover-bg: var(--color-bg-surface-alt);
    --pagination-item-hover-font: var(--font-color-primary-default);
    --pagination-item-active-font: var(--font-color-onbrand-default);
    --pagination-common-padding-md: var(--spacing-component-padding-md);
    --pagination-common-icon-size: var(--icon-size-small);
    --pagination-item-active-bg: var(--color-bg-primary-default);
    --pagination-item-active-border: var(--border-color-default);
    --pagination-item-active-border-width: var(--border-width-thin);
    --pagination-item-active-hover-bg: var(--color-bg-primary-default);
    --pagination-item-active-hover-font: var(--font-color-onbrand-default);
    --pagination-item-active-hover-border: var(--border-color-default);
    --pagination-item-active-hover-border-width: var(--border-width-thin);
    --pagination-item-ellipsis-font: var(--font-color-primary-default);
    --table-container-gap: var(--spacing-section-xs);
    --toast-common-radius: var(--radius-medium);
    --toast-common-padding-x: var(--spacing-component-padding-lg);
    --toast-common-padding-y: var(--spacing-component-padding-lg);
    --toast-common-gap: var(--spacing-component-gap-xs);
    --toast-common-icon-size: var(--icon-size-medium);
    --toast-default-title: var(--font-color-onbrand-default);
    --toast-default-icon: var(--icon-color-onbrand-default);
    --toast-common-border-width: var(--border-width-thin);
    --toast-common-border: var(--border-color-default);
    --toast-common-bg: var(--color-bg-surface-default);
    --toast-default-description: var(--font-color-secondary-default);
    --toast-success-title: var(--color-state-success-default);
    --toast-success-description: var(--font-color-secondary-default);
    --toast-success-icon: var(--color-state-success-default);
    --toast-success-bg: var(--color-state-success-subtle);
    --toast-success-border: var(--color-state-success-default);
    --toast-info-bg: var(--color-state-info-subtle);
    --toast-info-border: var(--color-state-info-default);
    --toast-info-title: var(--color-state-info-default);
    --toast-info-description: var(--font-color-secondary-default);
    --toast-info-icon: var(--color-state-info-default);
    --toast-warning-bg: var(--color-state-warning-subtle);
    --toast-warning-border: var(--color-state-warning-default);
    --toast-warning-title: var(--color-state-warning-default);
    --toast-warning-description: var(--font-color-secondary-default);
    --toast-warning-icon: var(--color-state-warning-default);
    --toast-error-bg: var(--color-state-error-subtle);
    --toast-error-border: var(--color-state-error-default);
    --toast-error-title: var(--color-state-error-default);
    --toast-error-description: var(--font-color-secondary-default);
    --toast-error-icon: var(--color-state-error-default);
    --toast-common-action: true;
    --calendar-date-picker-radius: var(--radius-medium);
    --calendar-days-week-font: var(--font-color-onbrand-default);
    --calendar-date-picker-padding-x: var(--spacing-component-padding-md);
    --calendar-date-picker-padding-y: var(--spacing-component-padding-md);
    --calendar-date-picker-icon-size: var(--icon-size-medium);
    --calendar-date-picker-border-width: var(--border-width-thin);
    --calendar-date-picker-border: var(--border-color-default);
    --calendar-date-picker-bg: var(--color-bg-surface-default);
    --calendar-date-picker-font: var(--font-color-primary-muted);
    --calendar-date-picker-icon: var(--icon-color-onbrand-default);
    --calendar-days-disabled-font: var(--font-color-disabled);
    --calendar-days-default-font: var(--font-color-primary-default);
    --calendar-days-radius: var(--radius-small);
    --calendar-days-hover-font: var(--font-color-primary-default);
    --calendar-days-hover-bg: var(--color-bg-surface-muted);
    --calendar-days-selected-font: var(--font-color-primary-default);
    --calendar-days-selected-bg: var(--color-bg-surface-muted);
    --calendar-days-current-font: var(--font-color-inverse-default);
    --calendar-days-current-bg: var(--color-bg-primary-default);
    --calendar-container-radius: var(--radius-medium);
    --calendar-container-padding-x: var(--spacing-component-padding-sm);
    --calendar-container-padding-y: var(--spacing-component-padding-sm);
    --calendar-container-icon-size: var(--icon-size-small);
    --calendar-container-border-width: var(--border-width-thin);
    --calendar-container-bg: var(--color-bg-surface-default);
    --calendar-container-font: var(--font-color-primary-default);
    --calendar-container-icon: var(--icon-color-onbrand-default);
    --calendar-container-gap: var(--spacing-component-padding-md);
    --calendar-container-border: var(--border-color-default);
    --navigation-button-common-radius: var(--radius-medium);
    --navigation-button-common-padding-x: var(--spacing-component-padding-md);
    --navigation-button-common-padding-y: var(--spacing-component-padding-sm);
    --navigation-button-common-gap: var(--spacing-component-gap-xs);
    --navigation-button-common-icon-size: var(--icon-size-small);
    --navigation-button-solid-ghost-default-font: var(--font-color-primary-default);
    --navigation-button-solid-ghost-default-icon: var(--icon-color-inverse-default);
    --navigation-button-solid-ghost-active-font: var(--font-color-secondary-default);
    --navigation-button-solid-ghost-active-icon: var(--icon-color-primary-default);
    --navigation-button-solid-ghost-active-bg: var(--color-bg-surface-default);
    --navigation-button-bottom-border-default-font: var(--font-color-primary-default);
    --navigation-button-bottom-border-default-icon: var(--icon-color-inverse-default);
    --navigation-button-bottom-border-hover-font: var(--font-color-primary-muted);
    --navigation-button-bottom-border-hover-icon: var(--icon-color-primary-muted);
    --navigation-button-solid-ghost-disabled-font: var(--font-color-disabled);
    --navigation-button-solid-ghost-disabled-icon: var(--icon-color-disabled);
    --navigation-button-bottom-border-active-font: var(--font-color-primary-default);
    --navigation-button-bottom-border-active-icon: var(--icon-color-inverse-default);
    --navigation-button-bottom-border-active-border: var(--icon-color-primary-default);
    --navigation-button-bottom-border-disabled-font: var(--font-color-disabled);
    --navigation-button-bottom-border-disabled-icon: var(--icon-color-disabled);
    --navigation-button-bottom-border-active-border-width: var(--border-width-thick);
    --navigation-item-common-radius: var(--radius-medium);
    --navigation-item-common-padding-x: var(--spacing-component-padding-sm);
    --navigation-item-common-padding-y: var(--spacing-component-padding-sm);
    --navigation-item-common-gap: var(--spacing-component-padding-sm);
    --navigation-item-common-icon-size: var(--icon-size-small);
    --navigation-item-default-font: var(--font-color-primary-default);
    --navigation-item-default-icon: var(--icon-color-onbrand-default);
    --navigation-item-hover-bg: var(--color-bg-surface-muted);
    --navigation-item-hover-font: var(--font-color-primary-default);
    --navigation-item-hover-icon: var(--icon-color-onbrand-default);
    --navigation-item-content-common-radius: var(--radius-medium);
    --navigation-item-content-common-padding-x: var(--spacing-component-padding-md);
    --navigation-item-content-common-padding-y: var(--spacing-component-padding-md);
    --navigation-item-content-common-gap: var(--spacing-component-padding-xs);
    --navigation-item-content-common-icon-size: var(--icon-size-small);
    --navigation-item-content-default-title: var(--font-color-primary-default);
    --navigation-item-content-default-icon: var(--icon-color-onbrand-default);
    --navigation-item-content-hover-bg: var(--color-bg-primary-muted);
    --navigation-item-content-hover-title: var(--font-color-primary-default);
    --navigation-item-content-hover-icon: var(--icon-color-onbrand-default);
    --navigation-item-content-hover-description: var(--font-color-primary-muted);
    --navigation-item-content-default-description: var(--font-color-primary-muted);
    --navigation-button-container-radius: var(--radius-small);
    --navigation-button-container-padding-x: var(--spacing-component-padding-xs);
    --navigation-button-container-padding-y: var(--spacing-component-padding-md);
    --navigation-button-container-gap: var(--spacing-component-gap-sm);
    --navigation-button-container-border-width: var(--border-width-thin);
    --navigation-button-container-border: var(--border-color-default);
    --navigation-button-container-bg: var(--color-bg-surface-default);
    --navigation-item-container-radius: var(--radius-medium);
    --navigation-item-container-padding-x: var(--spacing-component-padding-md);
    --navigation-item-container-padding-y: var(--spacing-component-padding-md);
    --navigation-item-container-gap: var(--spacing-component-gap-sm);
    --navigation-item-container-border-width: var(--border-width-thin);
    --navigation-item-container-border: var(--border-color-default);
    --navigation-item-container-bg: var(--color-bg-surface-default);
    --button-gradient-default-font: var(--font-color-onbrand-default);
    --button-gradient-default-icon: var(--icon-color-onbrand-default);
    --button-gradient-hover-font: var(--font-color-onbrand-default);
    --button-gradient-hover-icon: var(--icon-color-onbrand-default);
    --button-gradient-disabled-font: var(--font-color-onbrand-default);
    --button-gradient-disabled-icon: var(--icon-color-onbrand-default);
    --tabs-item-gradient-on-font: var(--font-color-onbrand-default);
    --tabs-item-gradient-on-icon: var(--icon-color-onbrand-default);
    --tabs-item-gradient-off-bg: var(--color-bg-surface-muted);
    --tabs-item-gradient-off-font: var(--font-color-primary-muted);
    --tabs-item-gradient-off-icon: var(--icon-color-primary-muted);
    --tabs-item-gradient-hover-bg: var(--color-bg-surface-accent);
    --tabs-item-gradient-hover-font: var(--font-color-primary-muted);
    --tabs-item-gradient-hover-icon: var(--icon-color-primary-muted);
    --badge-gradient-font: var(--font-color-inverse-default);
    --badge-gradient-icon: var(--icon-color-inverse-default);
    --navigation-button-gradient-default-font: var(--font-color-primary-default);
    --navigation-button-gradient-default-icon: var(--icon-color-onbrand-default);
    --navigation-button-gradient-active-font: var(--font-color-onbrand-default);
    --navigation-button-gradient-active-icon: var(--icon-color-onbrand-default);
    --navigation-button-gradient-disabled-font: var(--font-color-disabled);
    --navigation-button-gradient-disabled-icon: var(--icon-color-disabled);
    --progress-gradient-track: var(--color-progress-track);
    --empty-common-padding-x: var(--spacing-component-padding-2xl);
    --empty-common-padding-y: var(--spacing-component-padding-2xl);
    --empty-common-gap: var(--spacing-component-gap-2xl);
    --empty-container-content-gap: var(--spacing-component-gap-md);
    --empty-container-footer-gap: var(--spacing-component-gap-md);
    --empty-container-content-title: var(--font-color-primary-default);
    --empty-container-content-description: var(--font-color-primary-muted);
    --empty-container-content-icon: var(--icon-color-onbrand-default);
    --empty-container-content-icon-bg: var(--color-bg-surface-muted);
    --empty-common-radius: var(--radius-medium);
    --dropzone-common-radius: var(--radius-medium);
    --dropzone-common-padding-x: var(--spacing-component-padding-2xl);
    --dropzone-common-padding-y: var(--spacing-component-padding-2xl);
    --dropzone-common-gap: var(--spacing-component-gap-md);
    --dropzone-container-icon-color: var(--icon-color-primary-default);
    --dropzone-container-icon-bg: var(--color-bg-primary-muted);
    --dropzone-container-content-gap: var(--spacing-component-gap-sm);
    --dropzone-container-content-title: var(--font-color-primary-default);
    --dropzone-container-content-description: var(--font-color-primary-muted);
    --dropzone-common-border: var(--border-color-surface);
    --dropzone-common-bg: var(--color-bg-surface-default);
    --dropzone-common-border-width: var(--border-width-thin);
    --dropzone-container-icon-radius: var(--radius-small);
    --switch-common-radius: var(--radius-max);
    --switch-common-padding-x: var(--spacing-component-padding-xxs);
    --switch-common-padding-y: var(--spacing-component-padding-xxs);
    --switch-off-bg: var(--color-bg-disabled);
    --switch-off-thumb: var(--color-bg-surface-default);
    --switch-on-thumb: var(--color-bg-surface-default);
    --switch-on-bg: var(--color-bg-primary-default);
    --switch-common-gap: var(--spacing-component-gap-md);
    --switch-common-font: var(--font-color-primary-default);
    --drawer-common-radius: var(--radius-large);
    --drawer-common-bg: var(--color-bg-surface-default);
    --drawer-common-border: var(--border-color-default);
    --drawer-common-border-width: var(--border-width-thin);
    --drawer-container-header-gap: var(--spacing-component-gap-sm);
    --drawer-container-header-title: var(--font-color-primary-default);
    --drawer-container-header-description: var(--font-color-primary-muted);
    --drawer-container-content-gap: var(--spacing-component-gap-lg);
    --drawer-container-footer-gap: var(--spacing-component-gap-sm);
    --drawer-container-content-title: var(--font-color-primary-default);
    --drawer-container-content-description: var(--font-color-primary-muted);
    --drawer-common-padding-x: var(--spacing-component-padding-lg);
    --drawer-common-padding-y: var(--spacing-component-padding-lg);
    --drawer-common-gap: var(--spacing-component-gap-lg);
    --chart-wrapper-radius: var(--radius-medium);
    --chart-wrapper-gap: var(--spacing-component-padding-sm);
    --chart-wrapper-padding-x: var(--spacing-component-padding-md);
    --chart-wrapper-padding-y: var(--spacing-component-padding-sm);
    --chart-shape-line-color-1: var(--color-chart-data-vis-brand-1);
    --chart-shape-line-color-2: var(--color-chart-data-vis-brand-2);
    --chart-shape-line-color-3: var(--color-chart-data-vis-brand-3);
    --chart-shape-area-color-1: var(--color-chart-data-vis-brand-1);
    --chart-shape-area-opacity: var(--opacity-state-muted);
    --chart-shape-bar-color-1: var(--color-chart-data-vis-brand-1);
    --chart-shape-pie-color-1: var(--color-chart-data-vis-brand-1);
    --chart-wrapper-bg: var(--color-chart-bg-container);
    --chart-wrapper-grid-color: var(--color-chart-border-grid);
    --chart-wrapper-axis-color: var(--color-chart-border-axis);
    --chart-wrapper-label: var(--color-chart-text-axis-label);
    --chart-data-label-gap: var(--spacing-component-gap-md);
    --chart-data-label-font: var(--color-chart-text-data-value);
    --chart-range-slider-track-bg: var(--color-chart-control-range-track);
    --chart-range-slider-track-border: var(--color-chart-control-border);
    --chart-range-slider-track-chart-border: var(--color-chart-control-border);
    --chart-range-slider-track-chart-bg: var(--color-chart-control-range-fill);
    --chart-data-label-font-sub: var(--color-chart-text-data-value-sub);
    --chart-shape-bar-color-2: var(--color-chart-data-vis-brand-2);
    --chart-shape-area-color-2: var(--color-chart-data-vis-brand-2);
    --chart-shape-area-color-3: var(--color-chart-data-vis-brand-3);
    --chart-shape-bar-color-3: var(--color-chart-data-vis-brand-3);
    --chart-shape-pie-color-2: var(--color-chart-data-vis-brand-2);
    --chart-shape-pie-color-3: var(--color-chart-data-vis-brand-3);
    --chart-range-slider-thumb-bg: var(--color-chart-control-thumb);
    --chart-range-slider-thumb-bar-default: var(--color-chart-control-thumb-subtle);
    --chart-range-slider-thumb-handle: var(--color-chart-control-handle);
    --chart-range-slider-thumb-handle-border: var(--color-chart-control-border);
    --chart-range-slider-thumb-opacity-default: var(--opacity-state-muted);
    --chart-shape-line-dot: var(--color-chart-foreground);
    --chart-range-slider-thumb-bar: var(--color-chart-control-thumb);
    --select-base-common-left-icon: true;
    --table-item-cell-value-bg: var(--color-bg-surface-default);
    --table-item-cell-value-font-default: var(--font-color-primary-default);
    --table-item-cell-value-border: var(--border-color-default);
    --table-item-cell-value-boder-width: var(--border-width-thin);
    --table-item-cell-valut-last-bg: var(--color-bg-surface-default);
    --table-item-cell-valut-last-font-default: var(--font-color-primary-default);
    --table-item-cell-value-font-brand: var(--font-color-secondary-default);
    --table-item-cell-valut-last-font-muted: var(--font-color-primary-muted);
    --card-common-padding-x-mobile: var(--spacing-component-padding-xl);
    --card-common-padding-y-mobile: var(--spacing-component-padding-xl);
    --card-common-gap-mobile: var(--spacing-component-gap-2xl);
    --box-solid-gap-mobile: var(--spacing-component-gap-lg);
    --box-solid-padding-x-mobile: var(--spacing-component-padding-xl);
    --box-solid-padding-y-mobile: var(--spacing-component-padding-xl);
    --box-outline-gap-mobile: var(--spacing-component-gap-sm);
    --box-outline-padding-x-mobile: var(--spacing-component-padding-xl);
    --box-outline-padding-y-mobile: var(--spacing-component-padding-xl);
    --table-item-cell-value-font-muted: var(--font-color-primary-muted);
    --table-item-cell-valut-last-font-brand: var(--font-color-secondary-default);
    --select-small-common-radius: var(--radius-medium);
    --select-small-common-gap: var(--spacing-component-padding-xs);
    --select-small-common-padding-x: var(--spacing-component-padding-sm);
    --select-small-common-height: var(--scale-control-sm);
    --select-small-common-border-width: var(--border-width-thin);
    --select-small-default-bg: var(--color-bg-surface-default);
    --select-small-default-border: var(--border-color-default);
    --select-small-default-font: var(--font-color-primary-default);
    --select-small-default-icon: var(--icon-color-primary-muted);
    --select-small-hover-bg: var(--color-bg-surface-muted);
    --select-small-hover-border: var(--border-color-default);
    --select-small-hover-font: var(--font-color-primary-default);
    --select-small-hover-icon: var(--icon-color-primary-muted);
    --select-small-disabled-bg: var(--color-bg-surface-muted);
    --select-small-disabled-border: var(--border-color-default);
    --select-small-disabled-font: var(--icon-color-disabled);
    --select-small-disabled-icon: var(--icon-color-disabled);
    --tabs-container-group-gap: var(--spacing-component-gap-sm);
}