:root {
  --color-primary-50: #EAF0FA;
  --color-primary-100: #D6E1F4;
  --color-primary-200: #ADC3E9;
  --color-primary-300: #7FA0DA;
  --color-primary-400: #4D74C7;
  --color-primary-500: #1F55B5;
  --color-primary-600: #003C9D;
  --color-primary-700: #00307E;
  --color-primary-800: #00245F;
  --color-primary-900: #00183F;
  --color-neutral-50: #F7F9FC;
  --color-neutral-100: #EEF2F7;
  --color-neutral-200: #D9E0EA;
  --color-neutral-300: #B8C3D6;
  --color-neutral-400: #8A96B0;
  --color-neutral-500: #5E6A86;
  --color-neutral-600: #3F4A64;
  --color-neutral-700: #2A344D;
  --color-neutral-800: #1B2438;
  --color-neutral-900: #0F1626;
  --color-error-50: #FDEBEC;
  --color-error-100: #F9D2D5;
  --color-error-200: #F3A6AB;
  --color-error-300: #E56C74;
  --color-error-400: #D6434F;
  --color-error-500: #CC2A37;
  --color-error-600: #C71F2C;
  --color-error-700: #A91823;
  --color-error-800: #82121B;
  --color-error-900: #5C0C13;
  --color-warning-50: #FFF3E6;
  --color-warning-100: #FFE1BF;
  --color-warning-200: #FFC68A;
  --color-warning-300: #FF9F4D;
  --color-warning-400: #F07B1A;
  --color-warning-500: #E06605;
  --color-warning-600: #DB5C01;
  --color-warning-700: #B84C01;
  --color-warning-800: #8F3B00;
  --color-warning-900: #662900;
  --color-success-50: #E9F6F0;
  --color-success-100: #CFEBDD;
  --color-success-200: #9ED7BC;
  --color-success-300: #63BD93;
  --color-success-400: #3AA06F;
  --color-success-500: #2D8E5F;
  --color-success-600: #238443;
  --color-success-700: #1C6B36;
  --color-success-800: #155229;
  --color-success-900: #0E3A1D;
  --color-text-title: var(--color-neutral-900);
  --color-text-primary: var(--color-neutral-700);
  --color-text-secondary: var(--color-neutral-500);
  --color-text-muted: var(--color-neutral-400);
  --color-text-disabled: var(--color-neutral-400);
  --font-family-primary: Montserrat, system-ui, Arial, sans-serif;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --font-size-h1: 28px;
  --line-height-h1: 36px;
  --font-weight-h1: var(--font-weight-semibold);
  --font-size-h2: 22px;
  --line-height-h2: 30px;
  --font-weight-h2: var(--font-weight-semibold);
  --font-size-h3: 18px;
  --line-height-h3: 26px;
  --font-weight-h3: var(--font-weight-semibold);
  --font-size-h4: 16px;
  --line-height-h4: 24px;
  --font-weight-h4: var(--font-weight-medium);
  --font-size-body: 14px;
  --line-height-body: 22px;
  --font-weight-body: var(--font-weight-regular);
  --font-size-body-sm: 13px;
  --line-height-body-sm: 20px;
  --font-weight-body-sm: var(--font-weight-regular);
  --font-size-label: 13px;
  --line-height-label: 16px;
  --font-weight-label: var(--font-weight-medium);
  --font-size-caption: 12px;
  --line-height-caption: 16px;
  --font-weight-caption: var(--font-weight-regular);
  --spacing-xs: 4px;
  --spacing-sm: 8px;
  --spacing-md: 16px;
  --spacing-lg: 24px;
  --spacing-xl: 32px;
  --spacing-xxl: 48px;
  --grid-columns-desktop: 12;
  --grid-columns-tablet: 8;
  --grid-columns-mobile: 4;
  --grid-gutter-desktop: 24px;
  --grid-gutter-tablet: 24px;
  --grid-gutter-mobile: 16px;
  --grid-margin-desktop: 24px;
  --grid-margin-tablet: 16px;
  --grid-margin-mobile: 16px;
  --grid-max-width-desktop: 1280px;
  --breakpoint-mobile-max: 767px;
  --breakpoint-tablet-min: 768px;
  --breakpoint-tablet-max: 1023px;
  --breakpoint-desktop-min: 1024px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-full: 9999px;
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08), 0 1px 2px rgba(0, 0, 0, 0.04);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.12);
  --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.16);
  --transition-duration: 150ms;
  --transition-easing: ease;
  --transition: var(--transition-duration) var(--transition-easing);
  --disabled-opacity: 0.5;
  --disabled-text: var(--color-neutral-400);
  --disabled-icon: var(--color-neutral-300);
  --disabled-bg: var(--color-neutral-100);
  --disabled-border: var(--color-neutral-200);
  --disabled-cursor: not-allowed;
  --field-readonly-height: 48px;
  --field-readonly-radius: 8px;
  --field-readonly-padding-x: 12px;
  --field-readonly-bg: var(--color-neutral-50);
  --field-readonly-border-color: var(--color-neutral-200);
  --field-readonly-border-width: 1px;
  --field-readonly-text-color: var(--color-neutral-700);
  --field-readonly-placeholder-color: var(--color-neutral-400);
  --field-readonly-cursor: default;
  --field-readonly-user-select: text;
  --field-readonly-icon: var(--icon-lock);
  --field-readonly-icon-size: 20px;
  --field-readonly-icon-color: var(--color-neutral-400);
  --field-readonly-icon-position: right;
  --field-readonly-icon-gap: 8px;
}

:root {
  --btn-radius: 8px;
  --btn-font-size: var(--font-size-body);
  --btn-font-weight: var(--font-weight-medium);
  --btn-focus-ring-color: var(--color-primary-300);
  --btn-focus-ring-width: 2px;
  --btn-height-s: 32px;
  --btn-height-m: 40px;
  --btn-height-l: 48px;
  --btn-padding-x-s: 12px;
  --btn-padding-x-m: var(--spacing-md);
  --btn-padding-x-l: var(--spacing-lg);
  --btn-icon-size-s: 20px;
  --btn-icon-size-m: 20px;
  --btn-icon-size-l: 24px;
  --btn-icon-gap-s: 4px;
  --btn-icon-gap-m: 8px;
  --btn-icon-gap-l: 8px;
  --btn-primary-bg-default: var(--color-primary-600);
  --btn-primary-bg-hover: var(--color-primary-700);
  --btn-primary-bg-active: var(--color-primary-700);
  --btn-primary-bg-disabled: var(--color-primary-300);
  --btn-primary-text-default: var(--color-neutral-50);
  --btn-primary-text-disabled: var(--color-neutral-400);
  --btn-neutral-black-bg-default: var(--color-neutral-900);
  --btn-neutral-black-bg-hover: var(--color-neutral-800);
  --btn-neutral-black-bg-active: var(--color-neutral-800);
  --btn-neutral-black-bg-disabled: var(--color-neutral-200);
  --btn-neutral-black-text-default: var(--color-neutral-50);
  --btn-neutral-black-text-disabled: var(--color-neutral-400);
  --btn-neutral-grey-bg-default: transparent;
  --btn-neutral-grey-bg-hover: var(--color-neutral-100);
  --btn-neutral-grey-bg-active: var(--color-neutral-200);
  --btn-neutral-grey-bg-disabled: var(--color-neutral-200);
  --btn-neutral-grey-border-default: var(--color-neutral-300);
  --btn-neutral-grey-border-disabled: var(--color-neutral-200);
  --btn-neutral-grey-text-default: var(--color-neutral-700);
  --btn-neutral-grey-text-disabled: var(--color-neutral-400);
  --btn-destructive-bg-default: var(--color-error-600);
  --btn-destructive-bg-hover: var(--color-error-700);
  --btn-destructive-bg-active: var(--color-error-700);
  --btn-destructive-bg-disabled: var(--color-error-300);
  --btn-destructive-text-default: var(--color-neutral-50);
  --btn-destructive-text-disabled: var(--color-neutral-400);
  --checkbox-size: 18px;
  --checkbox-radius: 4px;
  --checkbox-hit-area: 48px;
  --checkbox-label-gap: var(--spacing-sm);
  --checkbox-border-default: var(--color-neutral-600);
  --checkbox-bg-default: transparent;
  --checkbox-icon-default: transparent;
  --checkbox-bg-checked: var(--color-neutral-600);
  --checkbox-border-checked: var(--color-neutral-600);
  --checkbox-icon-checked: var(--color-neutral-50);
  --checkbox-bg-hover: var(--color-neutral-100);
  --checkbox-border-hover: var(--color-neutral-600);
  --checkbox-bg-pressed: var(--color-neutral-200);
  --checkbox-border-pressed: var(--color-neutral-600);
  --checkbox-bg-disabled: transparent;
  --checkbox-border-disabled: var(--color-neutral-200);
  --checkbox-icon-disabled: var(--color-neutral-300);
  --checkbox-label-disabled: var(--color-neutral-400);
  --radio-size: 18px;
  --radio-hit-area: 48px;
  --radio-radius: 50%;
  --radio-border-default: var(--color-neutral-600);
  --radio-bg-checked: var(--color-neutral-600);
  --radio-dot-color: var(--color-neutral-50);
  --radio-bg-hover: var(--color-neutral-100);
  --radio-bg-pressed: var(--color-neutral-200);
  --radio-border-disabled: var(--color-neutral-200);
  --radio-dot-disabled: var(--color-neutral-300);
  --radio-label-disabled: var(--color-neutral-400);
  --toggle-width: 52px;
  --toggle-height: 32px;
  --toggle-radius: 16px;
  --toggle-thumb-size: 24px;
  --toggle-thumb-radius: 50%;
  --toggle-padding: 4px;
  --toggle-hit-area: 48px;
  --toggle-bg-off: var(--color-neutral-400);
  --toggle-thumb-off: var(--color-neutral-50);
  --toggle-bg-on: var(--color-success-600);
  --toggle-thumb-on: var(--color-neutral-50);
  --toggle-bg-disabled: var(--color-neutral-300);
  --toggle-thumb-disabled: var(--color-neutral-100);
  --toggle-transition-duration: 150ms;
  --toggle-transition-easing: ease-in-out;
  --field-radius: 8px;
  --field-border-width: 1px;
  --field-height-s: 32px;
  --field-height-m: 40px;
  --field-padding-x-s: 8px;
  --field-padding-x-m: 16px;
  --field-textarea-padding-x: 16px;
  --field-textarea-padding-y: 12px;
  --field-gap-label-to-input: var(--spacing-xs);
  --field-gap-input-to-helper: var(--spacing-xs);
  --form-gap-between-fields: var(--spacing-md);
  --form-gap-between-groups: var(--spacing-lg);
  --field-hit-area: 48px;
  --field-font-size: var(--font-size-body);
  --field-font-weight: var(--font-weight-regular);
  --field-label-font-size: var(--font-size-label);
  --field-label-font-weight: var(--font-weight-medium);
  --field-helper-font-size: var(--font-size-caption);
  --field-helper-font-weight: var(--font-weight-regular);
  --field-text-color: var(--color-neutral-800);
  --field-placeholder-color: var(--color-neutral-400);
  --field-label-color: var(--color-neutral-600);
  --field-helper-color: var(--color-neutral-500);
  --field-disabled-text-color: var(--color-neutral-400);
  --field-disabled-label-color: var(--color-neutral-400);
  --field-bg-default: var(--color-neutral-50);
  --field-bg-disabled: var(--color-neutral-100);
  --field-border-default: var(--color-neutral-300);
  --field-border-hover: var(--color-neutral-400);
  --field-border-focus: var(--color-primary-600);
  --field-border-error: var(--color-error-600);
  --field-focus-ring-error-color: var(--color-error-300);
  --field-error-text-color: var(--color-error-600);
  --field-icon-size: 20px;
  --field-icon-color: var(--color-neutral-500);
  --field-icon-color-disabled: var(--color-neutral-300);
  --field-icon-gap: 8px;
  --field-trailing-icon-hit-area: 32px;
  --field-suffix-font-size: var(--font-size-body);
  --field-suffix-color: var(--color-neutral-500);
  --field-suffix-gap: var(--spacing-xs);
  --select-chevron-size: 20px;
  --select-chevron-color: var(--color-neutral-500);
  --menu-radius: 8px;
  --menu-bg: var(--color-neutral-50);
  --menu-border: var(--color-neutral-200);
  --menu-shadow: var(--shadow-md);
  --menu-item-height: 40px;
  --menu-item-padding-x: 16px;
  --menu-item-text: var(--color-neutral-800);
  --menu-item-text-disabled: var(--color-neutral-400);
  --menu-item-bg-hover: var(--color-neutral-100);
  --menu-item-bg-pressed: var(--color-neutral-200);
  --menu-item-bg-selected: var(--color-primary-100);
  --menu-item-text-selected: var(--color-neutral-800);
  --date-picker-radius: 12px;
  --date-picker-bg: var(--color-neutral-50);
  --date-picker-border: var(--color-neutral-200);
  --date-picker-shadow: var(--shadow-md);
  --date-picker-padding: 16px;
  --date-picker-header-text: var(--color-neutral-800);
  --date-picker-subheader-text: var(--color-neutral-600);
  --date-picker-nav-icon-size: 20px;
  --date-picker-nav-icon-color: var(--color-neutral-600);
  --date-picker-nav-icon-bg-hover: var(--color-neutral-100);
  --date-picker-nav-icon-bg-pressed: var(--color-neutral-200);
  --date-picker-weekday-text: var(--color-neutral-500);
  --date-picker-day-size: 40px;
  --date-picker-day-radius: 999px;
  --date-picker-day-text: var(--color-neutral-800);
  --date-picker-day-text-disabled: var(--color-neutral-400);
  --date-picker-day-bg-hover: var(--color-neutral-100);
  --date-picker-day-bg-pressed: var(--color-neutral-200);
  --date-picker-day-bg-selected: var(--color-neutral-200);
  --date-picker-day-text-selected: var(--color-neutral-800);
  --date-picker-year-item-height: 40px;
  --date-picker-year-text: var(--color-neutral-800);
  --date-picker-year-text-disabled: var(--color-neutral-400);
  --date-picker-year-bg-hover: var(--color-neutral-100);
  --date-picker-year-bg-pressed: var(--color-neutral-200);
  --date-picker-year-bg-selected: var(--color-neutral-200);
  --date-input-icon-size: 20px;
  --date-input-icon-color: var(--color-neutral-500);
  --table-bg: var(--color-neutral-50);
  --table-border-width: 1px;
  --table-border-radius: 8px;
  --table-border-color: var(--color-neutral-200);
  --table-row-height: 48px;
  --table-cell-padding-x: 16px;
  --table-cell-padding-y: 12px;
  --table-header-text: var(--color-neutral-600);
  --table-body-text: var(--color-neutral-900);
  --table-secondary-text: var(--color-neutral-500);
  --table-row-bg-hover: var(--color-neutral-100);
  --table-row-bg-selected: var(--color-neutral-200);
  --table-row-bg-disabled: var(--color-neutral-100);
  --table-action-icon-size: 24px;
  --table-action-hit-area: 48px;
  --table-action-gap: 8px;
  --list-item-height: 56px;
  --list-item-padding-x: 8px;
  --list-item-text-max-height: 24px;
  --list-bg: var(--color-neutral-50);
  --list-item-bg-default: var(--color-neutral-50);
  --list-item-bg-hover: var(--color-neutral-100);
  --list-item-bg-selected: var(--color-neutral-200);
  --list-item-divider-color: var(--color-neutral-200);
  --list-item-divider-width: 1px;
  --card-radius: 8px;
  --card-border-width: 1px;
  --card-padding: 16px;
  --card-width: 288px;
  --card-height: 456px;
  --card-media-width: 288px;
  --card-media-height: 296px;
  --card-bg-default: var(--color-neutral-50);
  --card-bg-hover: var(--color-neutral-50);
  --card-bg-selected: var(--color-neutral-100);
  --card-border-color: var(--color-neutral-200);
  --card-shadow-default: var(--shadow-sm);
  --card-shadow-hover: var(--shadow-md);
  --card-action-icon-size: 20px;
  --card-action-hit-area: 48px;
  --card-action-gap: 8px;
  --card-attribute-radius: 999px;
  --card-attribute-padding-x: 8px;
  --card-attribute-padding-y: 4px;
  --card-attribute-bg: var(--color-neutral-100);
  --card-attribute-text: var(--color-neutral-700);
  --card-hover-overlay-bg: rgba(0, 0, 0, 0.04);
  --mini-card-height: 96px;
  --mini-card-padding: 8px;
  --mini-card-radius: 8px;
  --mini-card-bg: var(--color-neutral-50);
  --mini-card-bg-hover: var(--color-neutral-100);
  --mini-card-border-color: var(--color-neutral-200);
  --mini-card-border-width: 1px;
  --mini-card-gap: 8px;
  --mini-card-thumb-size: 80px;
  --mini-card-thumb-radius: 8px;
  --mini-card-thumb-bg: var(--color-neutral-100);
  --mini-card-title-color: var(--color-neutral-900);
  --mini-card-title-font-size: 14px;
  --mini-card-title-font-weight: 500;
  --mini-card-meta-color: var(--color-neutral-500);
  --mini-card-meta-font-size: 12px;
  --mini-card-status-gap: 8px;
  --status-height: 24px;
  --status-min-width: 160px;
  --status-padding-x: 8px;
  --status-padding-y: 2px;
  --status-radius: 8px;
  --status-hit-area: 40px;
  --status-chevron-position: right;
  --status-chevron-size: 20px;
  --status-chevron-color: var(--color-primary-500);
  --status-font-size: 13px;
  --status-line-height: 16px;
  --status-font-weight: 500;
  --status-bg-default: var(--color-neutral-50);
  --status-text-color: var(--color-neutral-500);
  --badge-height: 20px;
  --badge-padding-x: 10px;
  --badge-radius: 999px;
  --badge-font-size: 12px;
  --badge-line-height: 16px;
  --badge-font-weight: 500;
  --badge-bg-default: var(--color-neutral-50);
  --badge-text-color: var(--color-neutral-500);
  --tag-height: 22px;
  --tag-padding-x: 8px;
  --tag-padding-y: 0px;
  --tag-radius: 6px;
  --tag-font-size: 12px;
  --tag-line-height: 16px;
  --tag-font-weight: 400;
  --tag-bg-default: var(--color-neutral-100);
  --tag-text-default: var(--color-neutral-700);
  --tag-border-default: transparent;
}

:root {
  --nav-item-text-color: var(--color-neutral-900);
  --nav-item-icon-size: 24px;
  --nav-item-icon-color: var(--color-neutral-900);
  --nav-bg: var(--color-neutral-50);
  --nav-border-color: var(--color-neutral-200);
  --nav-border-width: 1px;
  --nav-item-bg-hover: var(--color-neutral-100);
  --nav-item-bg-active: var(--color-neutral-200);
  --nav-rail-width-collapsed: 80px;
  --nav-rail-width-expanded: 274px;
  --nav-rail-padding-y: 16px;
  --nav-rail-item-gap: 8px;
  --nav-item-height: 48px;
  --nav-item-padding-x: 16px;
  --nav-item-radius: 8px;
  --submenu-width: 274px;
  --submenu-padding: 16px;
  --submenu-bg: var(--color-neutral-50);
  --submenu-border-color: var(--color-neutral-200);
  --submenu-radius: 8px;
  --submenu-shadow: var(--shadow-md);
  --submenu-item-height: 48px;
  --submenu-item-padding-x: 16px;
  --submenu-item-radius: 8px;
  --submenu-item-bg-hover: var(--color-neutral-100);
  --submenu-item-text: var(--color-neutral-900);
  --header-height: 72px;
  --header-padding-x: 24px;
  --header-bg: #ffffff;
  --header-border-color: var(--color-neutral-200);
  --user-menu-width: 240px;
  --user-menu-padding: 16px;
  --user-menu-bg: var(--color-neutral-50);
  --user-menu-radius: 8px;
  --user-menu-shadow: var(--shadow-md);
  --user-menu-item-height: 40px;
  --user-menu-item-padding-x: 8px;
  --tabs-gap: 5px;
  --tabs-padding-x: 8px;
  --tabs-padding-y: 8px;
  --tab-height: 40px;
  --tab-radius: 8px;
  --tab-text-size: var(--font-size-body);
  --tab-text-weight: var(--font-weight-medium);
  --tab-bg-default: var(--color-neutral-50);
  --tab-text-default: var(--color-neutral-700);
  --tab-bg-hover: var(--color-primary-50);
  --tab-text-hover: var(--color-neutral-900);
  --tab-bg-active: var(--color-primary-100);
  --tab-text-active: var(--color-neutral-900);
  --tab-bg-disabled: var(--color-neutral-100);
  --tab-text-disabled: var(--color-neutral-400);
  --tab-border-disabled: var(--color-neutral-200);
  --pagination-height: 32px;
  --pagination-gap: 8px;
  --pagination-align: center;
  --pagination-item-min-width: 32px;
  --pagination-item-height: 32px;
  --pagination-item-radius: 999px;
  --pagination-item-padding-x: 8px;
  --pagination-font-size: var(--font-size-body);
  --pagination-line-height: var(--line-height-body);
  --pagination-font-weight: var(--font-weight-medium);
  --pagination-text-default: var(--color-neutral-900);
  --pagination-text-muted: var(--color-neutral-500);
  --pagination-bg-hover: var(--color-primary-100);
  --pagination-bg-pressed: var(--color-primary-200);
  --pagination-bg-active: var(--color-primary-600);
  --pagination-text-active: var(--color-neutral-50);
  --pagination-icon-size: 24px;
  --pagination-icon-color: var(--color-primary-900);
  --pagination-icon-hit-area: 48px;
  --itemsperpage-label-text: var(--color-neutral-600);
  --itemsperpage-trigger-height: 40px;
  --itemsperpage-trigger-max-width: 100px;
  --itemsperpage-trigger-padding-x: 16px;
  --itemsperpage-trigger-radius: 8px;
  --itemsperpage-trigger-bg: var(--color-neutral-50);
  --itemsperpage-trigger-border: var(--color-neutral-200);
  --itemsperpage-trigger-border-width: 1px;
  --itemsperpage-trigger-text: var(--color-neutral-900);
  --itemsperpage-trigger-icon-size: 24px;
  --itemsperpage-trigger-icon-color: var(--color-neutral-600);
}

:root {
  --modal-form-width-min: 480px;
  --modal-form-width-default: 520px;
  --modal-form-width-max: 800px;
  --modal-form-padding: 24px;
  --modal-form-radius: 8px;
  --modal-form-bg: var(--color-neutral-50);
  --modal-form-border: var(--color-neutral-200);
  --modal-form-shadow: var(--shadow-lg);
  --modal-step-height: 4px;
  --modal-step-radius: 999px;
  --modal-step-bg-track: var(--color-neutral-200);
  --modal-step-bg-active: var(--color-primary-600);
  --modal-form-section-gap: 24px;
  --modal-form-field-gap: 16px;
  --modal-form-footer-gap: 12px;
  --modal-form-footer-justify: flex-end;
  --modal-width-default: 520px;
  --modal-width-max: 600px;
  --modal-radius: 8px;
  --modal-padding: 24px;
  --modal-bg: var(--color-neutral-50);
  --modal-border-color: var(--color-neutral-200);
  --modal-border-width: 1px;
  --modal-shadow: var(--shadow-md);
  --modal-title-color: var(--color-neutral-900);
  --modal-text-color: var(--color-neutral-500);
  --modal-text-align: center;
  --modal-content-gap: 16px;
  --modal-content-to-actions-gap: 24px;
  --modal-actions-justify: flex-end;
  --modal-actions-gap: 8px;
  --modal-icon-badge-size: 48px;
  --modal-icon-size: 24px;
  --modal-icon-warning: var(--icon-warning);
  --modal-icon-badge-bg-warning: var(--color-warning-50);
  --modal-icon-color-warning: var(--color-warning-600);
  --modal-icon-error: var(--icon-error);
  --modal-icon-badge-bg-error: var(--color-error-50);
  --modal-icon-color-error: var(--color-error-600);
  --modal-icon-info: var(--icon-info);
  --modal-icon-badge-bg-info: var(--color-primary-50);
  --modal-icon-color-info: var(--color-primary-600);
  --modal-icon-success: var(--icon-success);
  --modal-icon-badge-bg-success: var(--color-success-50);
  --modal-icon-color-success: var(--color-success-600);
  --modal-callout-radius: 8px;
  --modal-callout-padding: 16px;
  --modal-callout-bg: var(--color-primary-50);
  --modal-callout-border-color: var(--color-primary-100);
  --modal-callout-text: var(--color-primary-700);
  --modal-callout-icon-size: 16px;
  --selector-width: 520px;
  --selector-width-lg: 800px;
  --selector-max-height: 600px;
  --selector-padding: 24px;
  --selector-radius: 8px;
  --selector-bg: var(--color-neutral-50);
  --selector-border-color: var(--color-neutral-200);
  --selector-border-width: 1px;
  --selector-shadow: var(--shadow-md);
  --selector-header-gap: 16px;
  --selector-title-color: var(--color-neutral-900);
  --selector-subtitle-color: var(--color-neutral-500);
  --selector-close-size: 24px;
  --selector-close-hit-area: 48px;
  --selector-close-color: var(--color-neutral-900);
  --selector-search-height: 40px;
  --selector-search-padding-x: 12px;
  --selector-search-radius: 8px;
  --selector-search-bg: #ffffff;
  --selector-search-border: var(--color-neutral-200);
  --selector-search-text: var(--color-neutral-900);
  --selector-search-placeholder: var(--color-neutral-500);
  --selector-search-icon-size: 24px;
  --selector-search-icon-color: var(--color-neutral-500);
  --selector-table-header-height: 40px;
  --selector-table-header-text: var(--color-neutral-600);
  --selector-table-header-border: var(--color-neutral-200);
  --selector-row-height: 56px;
  --selector-row-bg-hover: var(--color-neutral-100);
  --selector-row-bg-selected: var(--color-neutral-200);
  --selector-row-text-primary: var(--color-neutral-900);
  --selector-row-text-secondary: var(--color-neutral-600);
  --selector-radio-size: 24px;
  --selector-radio-icon-unchecked: "circle";
  --selector-radio-icon-checked: "nest_heat_link_e";
  --selector-radio-color-unchecked: var(--color-neutral-400);
  --selector-radio-color-checked: var(--color-primary-600);
  --selector-footer-gap: 24px;
  --selector-footer-justify: flex-end;
  --import-modal-width: 795px;
  --import-modal-radius: 8px;
  --import-modal-padding: 24px;
  --import-modal-bg: var(--color-neutral-50);
  --import-modal-border-color: var(--color-neutral-200);
  --import-modal-border-width: 1px;
  --import-modal-content-gap: 24px;
  --import-modal-section-gap: 16px;
  --import-dropzone-padding: 24px;
  --import-dropzone-min-height: 160px;
  --import-dropzone-bg: var(--color-neutral-50);
  --import-dropzone-border: var(--color-neutral-200);
  --import-dropzone-bg-hover: var(--color-neutral-50);
  --import-dropzone-border-hover: var(--color-neutral-300);
  --import-dropzone-bg-dragover: var(--color-primary-50);
  --import-dropzone-border-dragover: var(--color-primary-200);
  --import-dropzone-title-color: var(--color-neutral-900);
  --import-dropzone-help-color: var(--color-neutral-500);
  --import-dropzone-icon-size: 24px;
  --import-dropzone-icon-color: var(--color-primary-600);
  --import-dropzone-icon-badge-size: 48px;
  --import-dropzone-icon-badge-color: var(--color-primary-50);
  --import-dropzone-bg-error: var(--color-error-50);
  --import-dropzone-border-error: var(--color-error-100);
  --import-dropzone-error-text: var(--color-error-600);
  --import-dropzone-error-icon-color: var(--color-error-600);
  --import-dropzone-error-icon-badge-color: var(--color-error-50);
  --import-file-row-height: 96px;
  --import-file-row-padding-x: 16px;
  --import-file-row-padding-y: 16px;
  --import-file-row-gap: 16px;
  --import-file-row-bg: var(--color-neutral-50);
  --import-file-row-border: var(--color-neutral-200);
  --import-file-row-radius: 8px;
  --import-file-row-bg-hover: var(--color-neutral-100);
  --import-file-icon-badge-size: 48px;
  --import-file-icon-size: 24px;
  --import-file-icon-badge-bg: var(--color-primary-50);
  --import-file-icon-color: var(--color-primary-600);
  --import-file-name-color: var(--color-neutral-900);
  --import-file-meta-color: var(--color-neutral-500);
  --import-file-name-max-lines: 1;
  --import-file-action-icon-size: 24px;
  --import-file-action-icon-color: var(--color-neutral-500);
  --import-file-action-icon-hover: var(--color-neutral-900);
  --import-file-row-bg-error: var(--color-error-50);
  --import-file-row-border-error: var(--color-error-100);
  --import-file-row-error-text: var(--color-error-600);
  --import-file-action-icon-error: var(--color-error-600);
  --import-icon-upload: var(--icon-upload);
  --import-icon-file: var(--icon-file);
  --import-icon-delete: var(--icon-delete);
  --import-icon-error: var(--icon-error);
  --import-actions-gap: 16px;
  --import-actions-justify: flex-end;
  --banner-height: 56px;
  --banner-radius: 8px;
  --banner-padding-x: 16px;
  --banner-gap: 12px;
  --banner-icon-size: 24px;
  --banner-close-size: 24px;
  --banner-close-hit-area: 48px;
  --banner-text: var(--color-neutral-900);
  --banner-border-width: 1px;
  --banner-bg-info: var(--color-primary-50);
  --banner-border-info: var(--color-primary-100);
  --banner-bg-warning: var(--color-warning-50);
  --banner-border-warning: var(--color-warning-100);
  --banner-bg-error: var(--color-error-50);
  --banner-border-error: var(--color-error-100);
  --banner-bg-success: var(--color-success-50);
  --banner-border-success: var(--color-success-100);
  --banner-action-gap: 8px;
  --toast-max-width: 420px;
  --toast-min-height: 56px;
  --toast-radius: 8px;
  --toast-padding-x: 16px;
  --toast-gap: 12px;
  --toast-bg: #ffffff;
  --toast-border-color: var(--color-neutral-200);
  --toast-border-width: 1px;
  --toast-shadow: var(--shadow-sm);
  --toast-icon-size: 24px;
  --toast-close-size: 24px;
  --toast-close-hit-area: 48px;
  --toast-text: var(--color-neutral-900);
  --toast-text-muted: var(--color-neutral-500);
  --empty-padding: 24px;
  --empty-gap: 16px;
  --empty-title-color: var(--color-neutral-900);
  --empty-text-color: var(--color-neutral-500);
  --empty-surface-bg: var(--color-neutral-50);
  --empty-surface-border: var(--color-neutral-200);
  --empty-surface-radius: 8px;
  --empty-icon-size: 24px;
  --empty-icon-color: var(--color-neutral-400);
  --loading-overlay-bg: rgba(255, 255, 255, 0.6);
  --skeleton-bg: var(--color-neutral-100);
  --skeleton-highlight: var(--color-neutral-50);
  --skeleton-radius: 8px;
  --skeleton-row-height: 16px;
  --skeleton-row-gap: 8px;
  --spinner-size-sm: 16px;
  --spinner-size-md: 24px;
  --spinner-size-lg: 32px;
  --spinner-color: var(--color-neutral-500);
}

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

html.prsd {
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

button.prsd,
input.prsd,
select.prsd,
textarea.prsd,
optgroup.prsd {
  font-family: inherit;
}

body.prsd {
  font-family: var(--font-family-primary);
  font-size: var(--font-size-body);
  font-weight: var(--font-weight-body);
  line-height: var(--line-height-body);
  color: var(--color-text-primary);
  background-color: var(--color-neutral-50);
}

h1 {
  font-family: var(--font-family-primary);
  font-size: var(--font-size-h1);
  line-height: var(--line-height-h1);
  font-weight: var(--font-weight-h1);
  color: var(--color-text-title);
}

.prsd h2 {
  font-family: var(--font-family-primary);
  font-size: var(--font-size-h2);
  line-height: var(--line-height-h2);
  font-weight: var(--font-weight-h2);
  color: var(--color-text-title);
}

h3 {
  font-family: var(--font-family-primary);
  font-size: var(--font-size-h3);
  line-height: var(--line-height-h3);
  font-weight: var(--font-weight-h3);
  color: var(--color-text-title);
}

h4 {
  font-family: var(--font-family-primary);
  font-size: var(--font-size-h4);
  line-height: var(--line-height-h4);
  font-weight: var(--font-weight-h4);
  color: var(--color-text-title);
}

.prsd-body-text, .prsd .body-text {
  font-size: var(--font-size-body);
  line-height: var(--line-height-body);
  font-weight: var(--font-weight-body);
  color: var(--color-text-primary);
}

.prsd-body-text-sm, .prsd .body-text-sm {
  font-size: var(--font-size-body-sm);
  line-height: var(--line-height-body-sm);
  font-weight: var(--font-weight-body-sm);
  color: var(--color-text-secondary);
}

.prsd-text-label, .prsd .text-label {
  font-size: var(--font-size-label);
  font-weight: var(--font-weight-label);
}

.prsd-text-caption, .prsd .text-caption {
  font-size: var(--font-size-caption);
  line-height: var(--line-height-caption);
  font-weight: var(--font-weight-caption);
  color: var(--color-text-muted);
}

.prsd-text-muted, .prsd .text-muted {
  color: var(--color-text-muted);
}

.prsd-text-secondary, .prsd .text-secondary {
  color: var(--color-text-secondary);
}

.prsd-text-primary, .prsd .text-primary {
  color: var(--color-text-primary);
}

.prsd-text-title, .prsd .text-title {
  color: var(--color-text-title);
}

.material-symbols-outlined {
  font-family: "Material Symbols Outlined";
  font-weight: 300;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-smoothing: antialiased;
}

.prsd-btn--s .material-symbols-outlined,
.btn--s .material-symbols-outlined {
  font-size: var(--btn-icon-size-s);
}

.prsd-btn--m .material-symbols-outlined,
.prsd-btn .material-symbols-outlined,
.btn--m .material-symbols-outlined,
.btn .material-symbols-outlined {
  font-size: var(--btn-icon-size-m);
}

.prsd-btn--l .material-symbols-outlined,
.btn--l .material-symbols-outlined {
  font-size: var(--btn-icon-size-l);
}

.prsd-btn,
.prsd .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--btn-icon-gap-m);
  font-family: var(--font-family-primary);
  font-size: var(--btn-font-size);
  font-weight: var(--btn-font-weight);
  line-height: 1;
  text-decoration: none;
  border: 1px solid transparent;
  border-radius: var(--btn-radius);
  cursor: pointer;
  transition: all var(--transition);
  height: var(--btn-height-m);
  padding: 0 var(--btn-padding-x-m);
  background-color: var(--btn-primary-bg-default);
  color: var(--btn-primary-text-default);
}
.prsd-btn:disabled, .prsd-btn--disabled,
.prsd .btn:disabled,
.prsd .btn--disabled {
  cursor: not-allowed;
  opacity: var(--disabled-opacity);
}
.prsd-btn--s,
.prsd .btn--s {
  height: var(--btn-height-s);
  padding: 0 var(--btn-padding-x-s);
  gap: var(--btn-icon-gap-s);
}
.prsd-btn--l,
.prsd .btn--l {
  height: var(--btn-height-l);
  padding: 0 var(--btn-padding-x-l);
  gap: var(--btn-icon-gap-l);
}
.prsd-btn--primary,
.prsd .btn--primary {
  background-color: var(--btn-primary-bg-default);
  color: var(--btn-primary-text-default);
}
.prsd-btn--primary:hover:not(:disabled),
.prsd .btn--primary:hover:not(:disabled) {
  background-color: var(--btn-primary-bg-hover);
}
.prsd-btn--primary:active:not(:disabled),
.prsd .btn--primary:active:not(:disabled) {
  background-color: var(--btn-primary-bg-active);
}
.prsd-btn--neutral,
.prsd .btn--neutral {
  background-color: var(--btn-neutral-black-bg-default);
  color: var(--btn-neutral-black-text-default);
}
.prsd-btn--neutral:hover:not(:disabled),
.prsd .btn--neutral:hover:not(:disabled) {
  background-color: var(--btn-neutral-black-bg-hover);
}
.prsd-btn--neutral:active:not(:disabled),
.prsd .btn--neutral:active:not(:disabled) {
  background-color: var(--btn-neutral-black-bg-active);
}
.prsd-btn--secondary,
.prsd .btn--secondary {
  background-color: var(--btn-neutral-grey-bg-default);
  color: var(--btn-neutral-grey-text-default);
  border-color: var(--btn-neutral-grey-border-default);
}
.prsd-btn--secondary:hover:not(:disabled),
.prsd .btn--secondary:hover:not(:disabled) {
  background-color: var(--btn-neutral-grey-bg-hover);
}
.prsd-btn--secondary:active:not(:disabled),
.prsd .btn--secondary:active:not(:disabled) {
  background-color: var(--btn-neutral-grey-bg-active);
}
.prsd-btn--destructive,
.prsd .btn--destructive {
  background-color: var(--btn-destructive-bg-default);
  color: var(--btn-destructive-text-default);
}
.prsd-btn--destructive:hover:not(:disabled),
.prsd .btn--destructive:hover:not(:disabled) {
  background-color: var(--btn-destructive-bg-hover);
}
.prsd-btn--destructive:active:not(:disabled),
.prsd .btn--destructive:active:not(:disabled) {
  background-color: var(--btn-destructive-bg-active);
}
.prsd-btn__icon,
.prsd .btn__icon {
  display: flex;
  align-items: center;
  justify-content: center;
}
.prsd-btn--s .prsd-btn__icon,
.prsd-btn--s .prsd .btn__icon,
.prsd .btn--s .prsd-btn__icon,
.prsd .btn--s .prsd .btn__icon {
  width: var(--btn-icon-size-s);
  height: var(--btn-icon-size-s);
}
.prsd-btn--m .prsd-btn__icon, .prsd-btn .prsd-btn__icon,
.prsd-btn--m .prsd .btn__icon,
.prsd-btn .prsd .btn__icon,
.prsd .btn--m .prsd-btn__icon,
.prsd .btn .prsd-btn__icon,
.prsd .btn--m .prsd .btn__icon,
.prsd .btn .prsd .btn__icon {
  width: var(--btn-icon-size-m);
  height: var(--btn-icon-size-m);
}
.prsd-btn--l .prsd-btn__icon,
.prsd-btn--l .prsd .btn__icon,
.prsd .btn--l .prsd-btn__icon,
.prsd .btn--l .prsd .btn__icon {
  width: var(--btn-icon-size-l);
  height: var(--btn-icon-size-l);
}
.prsd-btn--loading,
.prsd .btn--loading {
  position: relative;
  color: transparent !important;
  pointer-events: none;
}
.prsd-btn--loading::after,
.prsd .btn--loading::after {
  content: "";
  position: absolute;
  width: var(--spinner-size-sm);
  height: var(--spinner-size-sm);
  border: 2px solid currentColor;
  border-top-color: transparent;
  border-radius: 50%;
  animation: spinner-rotate 0.8s linear infinite;
}
.prsd-btn--loading.prsd-btn--primary::after, .prsd-btn--loading.prsd-btn--destructive::after, .prsd-btn--loading.prsd-btn--neutral::after, .prsd-btn--loading.btn--primary::after, .prsd-btn--loading.btn--destructive::after, .prsd-btn--loading.btn--neutral::after,
.prsd .btn--loading.prsd-btn--primary::after,
.prsd .btn--loading.prsd-btn--destructive::after,
.prsd .btn--loading.prsd-btn--neutral::after,
.prsd .btn--loading.btn--primary::after,
.prsd .btn--loading.btn--destructive::after,
.prsd .btn--loading.btn--neutral::after {
  border-color: rgba(255, 255, 255, 0.3);
  border-top-color: white;
}

.prsd-form-group,
.prsd .form-group {
  display: flex;
  flex-direction: column;
  gap: var(--field-gap-label-to-input);
}
.prsd-form-group + .prsd-form-group,
.prsd-form-group + .prsd .form-group,
.prsd .form-group + .prsd-form-group,
.prsd .form-group + .prsd .form-group {
  margin-top: var(--form-gap-between-fields);
}

.prsd-label,
.prsd .label {
  font-size: var(--field-label-font-size);
  font-weight: var(--field-label-font-weight);
  line-height: var(--line-height-label);
  color: var(--field-label-color);
}
.prsd-label--disabled,
.prsd .label--disabled {
  color: var(--field-disabled-label-color);
}

.prsd-input,
.prsd .input {
  display: block;
  width: 100%;
  height: var(--field-height-m);
  padding: 0 var(--field-padding-x-m);
  font-family: var(--font-family-primary);
  font-size: var(--field-font-size);
  font-weight: var(--field-font-weight);
  color: var(--field-text-color);
  background-color: var(--field-bg-default);
  border: var(--field-border-width) solid var(--field-border-default);
  border-radius: var(--field-radius);
  transition: border-color var(--transition), box-shadow var(--transition);
}
.prsd-input--s,
.prsd .input--s {
  height: var(--field-height-s);
  padding: 0 var(--field-padding-x-s);
}
.prsd-input:hover:not(:disabled):not(:focus),
.prsd .input:hover:not(:disabled):not(:focus) {
  border-color: var(--field-border-hover);
}
.prsd-input:focus,
.prsd .input:focus {
  outline: none;
  border-color: var(--field-border-focus);
}
.prsd-input::placeholder,
.prsd .input::placeholder {
  color: var(--field-placeholder-color);
}
.prsd-input:disabled,
.prsd .input:disabled {
  background-color: var(--field-bg-disabled);
  color: var(--field-disabled-text-color);
  cursor: not-allowed;
  opacity: var(--disabled-opacity);
}
.prsd-input:read-only, .prsd-input--readonly,
.prsd .input:read-only,
.prsd .input--readonly {
  background-color: var(--field-readonly-bg);
  border-color: var(--field-readonly-border-color);
  border-width: var(--field-readonly-border-width);
  color: var(--field-readonly-text-color);
  cursor: var(--field-readonly-cursor);
  user-select: var(--field-readonly-user-select);
}
.prsd-input:read-only:focus, .prsd-input--readonly:focus,
.prsd .input:read-only:focus,
.prsd .input--readonly:focus {
  border-color: var(--field-readonly-border-color);
  outline: none;
}
.prsd-input:read-only::placeholder, .prsd-input--readonly::placeholder,
.prsd .input:read-only::placeholder,
.prsd .input--readonly::placeholder {
  color: var(--field-readonly-placeholder-color);
}
.prsd-input--error,
.prsd .input--error {
  border-color: var(--field-border-error);
}
.prsd-input--error:focus,
.prsd .input--error:focus {
  border-color: var(--field-border-error);
}

.prsd-input-readonly-wrapper,
.prsd .input-readonly-wrapper {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
}
.prsd-input-readonly-wrapper .prsd-input, .prsd-input-readonly-wrapper .input,
.prsd .input-readonly-wrapper .prsd-input,
.prsd .input-readonly-wrapper .input {
  padding-right: calc(var(--field-readonly-padding-x) + var(--field-readonly-icon-size) + var(--field-readonly-icon-gap));
}
.prsd-input-readonly-wrapper .prsd-input-readonly-icon, .prsd-input-readonly-wrapper .input-readonly-icon,
.prsd .input-readonly-wrapper .prsd-input-readonly-icon,
.prsd .input-readonly-wrapper .input-readonly-icon {
  position: absolute;
  right: var(--field-readonly-padding-x);
  font-size: var(--field-readonly-icon-size);
  color: var(--field-readonly-icon-color);
  pointer-events: none;
}

.prsd-helper-text,
.prsd .helper-text {
  font-size: var(--field-helper-font-size);
  font-weight: var(--field-helper-font-weight);
  line-height: var(--line-height-caption);
  color: var(--field-helper-color);
  margin-top: var(--field-gap-input-to-helper);
}
.prsd-helper-text--error,
.prsd .helper-text--error {
  color: var(--field-error-text-color);
}

.prsd-textarea,
.prsd .textarea {
  min-height: 120px;
  padding: var(--field-textarea-padding-y) var(--field-textarea-padding-x);
  resize: vertical;
}

.prsd-select,
.prsd .select {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%235E6A86' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right var(--field-padding-x-m) center;
  padding-right: calc(var(--field-padding-x-m) + var(--select-chevron-size) + var(--spacing-sm));
}

.prsd-input-wrapper,
.prsd .input-wrapper {
  position: relative;
  display: flex;
  align-items: center;
}
.prsd-input-wrapper .prsd-input, .prsd-input-wrapper .input,
.prsd .input-wrapper .prsd-input,
.prsd .input-wrapper .input {
  padding-left: calc(var(--field-padding-x-m) + var(--field-icon-size) + var(--field-icon-gap));
}
.prsd-input-wrapper__icon,
.prsd .input-wrapper__icon {
  position: absolute;
  left: var(--field-padding-x-m);
  width: var(--field-icon-size);
  height: var(--field-icon-size);
  color: var(--field-icon-color);
  pointer-events: none;
}
.prsd-input-wrapper__icon--trailing,
.prsd .input-wrapper__icon--trailing {
  left: auto;
  right: var(--field-padding-x-m);
  pointer-events: auto;
  cursor: pointer;
}
.prsd-input-wrapper--trailing .prsd-input, .prsd-input-wrapper--trailing .input,
.prsd .input-wrapper--trailing .prsd-input,
.prsd .input-wrapper--trailing .input {
  padding-left: var(--field-padding-x-m);
  padding-right: calc(var(--field-padding-x-m) + var(--field-icon-size) + var(--field-icon-gap));
}

.prsd-checkbox,
.prsd .checkbox {
  display: flex;
  align-items: center;
  min-height: var(--checkbox-hit-area);
  gap: var(--checkbox-label-gap);
  cursor: pointer;
}
.prsd-checkbox__input,
.prsd .checkbox__input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}
.prsd-checkbox__box,
.prsd .checkbox__box {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--checkbox-size);
  height: var(--checkbox-size);
  border-radius: var(--checkbox-radius);
  border: 2px solid var(--checkbox-border-default);
  background-color: var(--checkbox-bg-default);
  transition: all var(--transition);
  flex-shrink: 0;
}
.prsd-checkbox__icon,
.prsd .checkbox__icon {
  width: 12px;
  height: 12px;
  color: var(--checkbox-icon-default);
  opacity: 0;
  transition: opacity var(--transition);
}
.prsd-checkbox__label,
.prsd .checkbox__label {
  font-size: var(--font-size-body);
  line-height: var(--line-height-body);
  color: var(--color-text-primary);
}

.prsd-checkbox:hover .prsd-checkbox__box,
.prsd .checkbox:hover .prsd-checkbox__box,
.prsd-checkbox:hover .checkbox__box,
.prsd .checkbox:hover .checkbox__box {
  background-color: var(--checkbox-bg-hover);
  border-color: var(--checkbox-border-hover);
}

.prsd-checkbox:active .prsd-checkbox__box,
.prsd .checkbox:active .prsd-checkbox__box,
.prsd-checkbox:active .checkbox__box,
.prsd .checkbox:active .checkbox__box {
  background-color: var(--checkbox-bg-pressed);
  border-color: var(--checkbox-border-pressed);
}

.prsd-checkbox__input:checked + .prsd-checkbox__box,
.prsd .checkbox__input:checked + .prsd-checkbox__box,
.prsd-checkbox__input:checked + .checkbox__box,
.prsd .checkbox__input:checked + .checkbox__box {
  background-color: var(--checkbox-bg-checked);
  border-color: var(--checkbox-border-checked);
}
.prsd-checkbox__input:checked + .prsd-checkbox__box .prsd-checkbox__icon, .prsd-checkbox__input:checked + .prsd-checkbox__box .checkbox__icon,
.prsd .checkbox__input:checked + .prsd-checkbox__box .prsd-checkbox__icon,
.prsd .checkbox__input:checked + .prsd-checkbox__box .checkbox__icon,
.prsd-checkbox__input:checked + .checkbox__box .prsd-checkbox__icon,
.prsd-checkbox__input:checked + .checkbox__box .checkbox__icon,
.prsd .checkbox__input:checked + .checkbox__box .prsd-checkbox__icon,
.prsd .checkbox__input:checked + .checkbox__box .checkbox__icon {
  color: var(--checkbox-icon-checked);
  opacity: 1;
}

.prsd-checkbox__input:disabled + .prsd-checkbox__box,
.prsd .checkbox__input:disabled + .prsd-checkbox__box,
.prsd-checkbox__input:disabled + .checkbox__box,
.prsd .checkbox__input:disabled + .checkbox__box {
  background-color: var(--checkbox-bg-disabled);
  border-color: var(--checkbox-border-disabled);
  cursor: not-allowed;
}
.prsd-checkbox__input:disabled + .prsd-checkbox__box .prsd-checkbox__icon, .prsd-checkbox__input:disabled + .prsd-checkbox__box .prsd .checkbox__icon,
.prsd .checkbox__input:disabled + .prsd-checkbox__box .prsd-checkbox__icon,
.prsd .checkbox__input:disabled + .prsd-checkbox__box .prsd .checkbox__icon,
.prsd-checkbox__input:disabled + .checkbox__box .prsd-checkbox__icon,
.prsd-checkbox__input:disabled + .checkbox__box .prsd .checkbox__icon,
.prsd .checkbox__input:disabled + .checkbox__box .prsd-checkbox__icon,
.prsd .checkbox__input:disabled + .checkbox__box .prsd .checkbox__icon {
  color: var(--checkbox-icon-disabled);
}

.prsd-checkbox__input:disabled ~ .prsd-checkbox__label,
.prsd .checkbox__input:disabled ~ .prsd-checkbox__label,
.prsd-checkbox__input:disabled ~ .checkbox__label,
.prsd .checkbox__input:disabled ~ .checkbox__label {
  color: var(--checkbox-label-disabled);
}

.prsd-checkbox:has(.prsd-checkbox__input:disabled),
.prsd-checkbox:has(.checkbox__input:disabled),
.prsd .checkbox:has(.prsd-checkbox__input:disabled),
.prsd .checkbox:has(.checkbox__input:disabled) {
  cursor: not-allowed;
}

.prsd-radio,
.prsd .radio {
  display: flex;
  align-items: center;
  min-height: var(--radio-hit-area);
  gap: var(--checkbox-label-gap);
  cursor: pointer;
}
.prsd-radio__input,
.prsd .radio__input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}
.prsd-radio__circle,
.prsd .radio__circle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--radio-size);
  height: var(--radio-size);
  border-radius: var(--radio-radius);
  border: 2px solid var(--radio-border-default);
  background-color: transparent;
  transition: all var(--transition);
  flex-shrink: 0;
}
.prsd-radio__dot,
.prsd .radio__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: var(--radio-dot-color);
  opacity: 0;
  transform: scale(0);
  transition: all var(--transition);
}
.prsd-radio__label,
.prsd .radio__label {
  font-size: var(--font-size-body);
  line-height: var(--line-height-body);
  color: var(--color-text-primary);
}

.prsd-radio:hover .prsd-radio__circle,
.prsd .radio:hover .prsd-radio__circle,
.prsd-radio:hover .radio__circle,
.prsd .radio:hover .radio__circle {
  background-color: var(--radio-bg-hover);
  border-color: var(--radio-border-hover);
}

.prsd-radio:active .prsd-radio__circle,
.prsd .radio:active .prsd-radio__circle,
.prsd-radio:active .radio__circle,
.prsd .radio:active .radio__circle {
  background-color: var(--radio-bg-checked);
  border-color: var(--radio-bg-checked);
}

.prsd-radio__input:checked + .prsd-radio__circle,
.prsd .radio__input:checked + .prsd-radio__circle,
.prsd-radio__input:checked + .radio__circle,
.prsd .radio__input:checked + .radio__circle {
  background-color: var(--radio-bg-checked);
  border-color: var(--radio-border-checked);
}
.prsd-radio__input:checked + .prsd-radio__circle .prsd-radio__dot, .prsd-radio__input:checked + .prsd-radio__circle .radio__dot,
.prsd .radio__input:checked + .prsd-radio__circle .prsd-radio__dot,
.prsd .radio__input:checked + .prsd-radio__circle .radio__dot,
.prsd-radio__input:checked + .radio__circle .prsd-radio__dot,
.prsd-radio__input:checked + .radio__circle .radio__dot,
.prsd .radio__input:checked + .radio__circle .prsd-radio__dot,
.prsd .radio__input:checked + .radio__circle .radio__dot {
  opacity: 1;
  transform: scale(1);
}

.prsd-radio__input:disabled + .prsd-radio__circle,
.prsd .radio__input:disabled + .prsd-radio__circle,
.prsd-radio__input:disabled + .radio__circle,
.prsd .radio__input:disabled + .radio__circle {
  background-color: var(--radio-bg-disabled);
  border-color: var(--radio-border-disabled);
  cursor: not-allowed;
}
.prsd-radio__input:disabled + .prsd-radio__circle .prsd-radio__dot, .prsd-radio__input:disabled + .prsd-radio__circle .radio__dot,
.prsd .radio__input:disabled + .prsd-radio__circle .prsd-radio__dot,
.prsd .radio__input:disabled + .prsd-radio__circle .radio__dot,
.prsd-radio__input:disabled + .radio__circle .prsd-radio__dot,
.prsd-radio__input:disabled + .radio__circle .radio__dot,
.prsd .radio__input:disabled + .radio__circle .prsd-radio__dot,
.prsd .radio__input:disabled + .radio__circle .radio__dot {
  color: var(--radio-dot-disabled);
}

.prsd-radio__input:disabled ~ .prsd-radio__label,
.prsd .radio__input:disabled ~ .prsd-radio__label,
.prsd-radio__input:disabled ~ .radio__label,
.prsd .radio__input:disabled ~ .radio__label {
  color: var(--radio-label-disabled);
}

.prsd-radio:has(.prsd-radio__input:disabled),
.prsd-radio:has(.radio__input:disabled),
.prsd .radio:has(.prsd-radio__input:disabled),
.prsd .radio:has(.radio__input:disabled) {
  cursor: not-allowed;
}

.prsd-toggle,
.prsd .toggle {
  display: inline-flex;
  align-items: center;
  min-height: var(--toggle-hit-area);
  cursor: pointer;
}
.prsd-toggle__input,
.prsd .toggle__input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}
.prsd-toggle__track,
.prsd .toggle__track {
  position: relative;
  width: var(--toggle-width);
  height: var(--toggle-height);
  border-radius: var(--toggle-radius);
  background-color: var(--toggle-bg-off);
  padding: var(--toggle-padding);
  transition: background-color var(--toggle-transition-duration) var(--toggle-transition-easing);
  display: flex;
  align-items: center;
}
.prsd-toggle__thumb,
.prsd .toggle__thumb {
  width: var(--toggle-thumb-size);
  height: var(--toggle-thumb-size);
  border-radius: var(--toggle-thumb-radius);
  background-color: var(--toggle-thumb-off);
  transition: transform var(--toggle-transition-duration) var(--toggle-transition-easing);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  flex-shrink: 0;
}

.prsd-toggle:hover .prsd-toggle__box,
.prsd .toggle:hover .prsd-toggle__box,
.prsd-toggle:hover .toggle__box,
.prsd .toggle:hover .toggle__box {
  background-color: var(--toggle-bg-hover);
  border-color: var(--toggle-border-hover);
}

.prsd-toggle:active .prsd-toggle__box,
.prsd .toggle:active .prsd-toggle__box,
.prsd-toggle:active .toggle__box,
.prsd .toggle:active .toggle__box {
  background-color: var(--toggle-bg-pressed);
  border-color: var(--toggle-border-pressed);
}

.prsd-toggle__input:checked + .prsd-toggle__track,
.prsd .toggle__input:checked + .prsd-toggle__track,
.prsd-toggle__input:checked + .toggle__track,
.prsd .toggle__input:checked + .toggle__track {
  background-color: var(--toggle-bg-on);
}
.prsd-toggle__input:checked + .prsd-toggle__track .prsd-toggle__thumb, .prsd-toggle__input:checked + .prsd-toggle__track .toggle__thumb,
.prsd .toggle__input:checked + .prsd-toggle__track .prsd-toggle__thumb,
.prsd .toggle__input:checked + .prsd-toggle__track .toggle__thumb,
.prsd-toggle__input:checked + .toggle__track .prsd-toggle__thumb,
.prsd-toggle__input:checked + .toggle__track .toggle__thumb,
.prsd .toggle__input:checked + .toggle__track .prsd-toggle__thumb,
.prsd .toggle__input:checked + .toggle__track .toggle__thumb {
  transform: translateX(calc(var(--toggle-width) - var(--toggle-thumb-size) - var(--toggle-padding) * 2));
  background-color: var(--toggle-thumb-on);
}

.prsd-toggle__input:disabled + .prsd-toggle__track,
.prsd .toggle__input:disabled + .prsd-toggle__track,
.prsd-toggle__input:disabled + .toggle__track,
.prsd .toggle__input:disabled + .toggle__track {
  background-color: var(--toggle-bg-disabled);
  border-color: var(--toggle-border-disabled);
  cursor: not-allowed;
}
.prsd-toggle__input:disabled + .prsd-toggle__track .prsd-toggle__thumb, .prsd-toggle__input:disabled + .prsd-toggle__track .prsd .toggle__thumb,
.prsd .toggle__input:disabled + .prsd-toggle__track .prsd-toggle__thumb,
.prsd .toggle__input:disabled + .prsd-toggle__track .prsd .toggle__thumb,
.prsd-toggle__input:disabled + .toggle__track .prsd-toggle__thumb,
.prsd-toggle__input:disabled + .toggle__track .prsd .toggle__thumb,
.prsd .toggle__input:disabled + .toggle__track .prsd-toggle__thumb,
.prsd .toggle__input:disabled + .toggle__track .prsd .toggle__thumb {
  color: var(--toggle-icon-disabled);
}

.prsd-toggle__input:disabled ~ .prsd-toggle__label,
.prsd .toggle__input:disabled ~ .prsd-toggle__label,
.prsd-toggle__input:disabled ~ .toggle__label,
.prsd .toggle__input:disabled ~ .toggle__label {
  color: var(--toggle-label-disabled);
}

.prsd-toggle:has(.prsd-toggle__input:disabled),
.prsd-toggle:has(.toggle__input:disabled),
.prsd .toggle:has(.prsd-toggle__input:disabled),
.prsd .toggle:has(.toggle__input:disabled) {
  cursor: not-allowed;
}

.prsd-card,
.prsd .card {
  background-color: var(--card-bg-default);
  border: var(--card-border-width) solid var(--card-border-color);
  border-radius: var(--card-radius);
  box-shadow: var(--card-shadow-default);
  overflow: hidden;
  transition: box-shadow var(--transition);
}
.prsd-card:hover,
.prsd .card:hover {
  box-shadow: var(--card-shadow-hover);
}
.prsd-card__media,
.prsd .card__media {
  width: 100%;
  height: var(--card-media-height);
  object-fit: cover;
}
.prsd-card__body,
.prsd .card__body {
  padding: var(--card-padding);
}
.prsd-card__title,
.prsd .card__title {
  font-size: var(--font-size-h4);
  font-weight: var(--font-weight-h4);
  line-height: var(--line-height-h4);
  color: var(--color-text-title);
  margin-bottom: var(--spacing-xs);
}
.prsd-card__description,
.prsd .card__description {
  font-size: var(--font-size-body-sm);
  line-height: var(--line-height-body-sm);
  color: var(--color-text-secondary);
}
.prsd-card__footer,
.prsd .card__footer {
  padding: var(--card-padding);
  border-top: 1px solid var(--card-border-color);
  background-color: var(--color-neutral-100);
}
.prsd-card__attributes,
.prsd .card__attributes {
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-sm);
  margin-top: var(--spacing-sm);
}
.prsd-card__attribute,
.prsd .card__attribute {
  display: inline-flex;
  align-items: center;
  padding: var(--card-attribute-padding-y) var(--card-attribute-padding-x);
  background-color: var(--card-attribute-bg);
  color: var(--card-attribute-text);
  border-radius: var(--card-attribute-radius);
  font-size: var(--font-size-caption);
  font-weight: var(--font-weight-medium);
}
.prsd-card--product,
.prsd .card--product {
  width: var(--card-width);
  height: var(--card-height);
  display: flex;
  flex-direction: column;
}
.prsd-card--product .prsd-card__body, .prsd-card--product .card__body,
.prsd .card--product .prsd-card__body,
.prsd .card--product .card__body {
  flex: 1;
  display: flex;
  flex-direction: column;
}
.prsd-card--product:hover .prsd-card__media-overlay, .prsd-card--product:hover .card__media-overlay,
.prsd .card--product:hover .prsd-card__media-overlay,
.prsd .card--product:hover .card__media-overlay {
  opacity: 1;
}
.prsd-card--product:hover .prsd-card__media-overlay .prsd-btn, .prsd-card--product:hover .prsd-card__media-overlay .btn, .prsd-card--product:hover .card__media-overlay .prsd-btn, .prsd-card--product:hover .card__media-overlay .btn,
.prsd .card--product:hover .prsd-card__media-overlay .prsd-btn,
.prsd .card--product:hover .prsd-card__media-overlay .btn,
.prsd .card--product:hover .card__media-overlay .prsd-btn,
.prsd .card--product:hover .card__media-overlay .btn {
  transform: translateY(0);
  opacity: 1;
}
.prsd-card--product:hover .prsd-card__media-wrapper .prsd-card__media, .prsd-card--product:hover .card__media-wrapper .card__media,
.prsd .card--product:hover .prsd-card__media-wrapper .prsd-card__media,
.prsd .card--product:hover .card__media-wrapper .card__media {
  transform: scale(1.02);
}
.prsd-card__media-wrapper,
.prsd .card__media-wrapper {
  position: relative;
  width: var(--card-media-width);
  height: var(--card-media-height);
  overflow: hidden;
  flex-shrink: 0;
}
.prsd-card__media-wrapper .prsd-card__media, .prsd-card__media-wrapper .card__media,
.prsd .card__media-wrapper .prsd-card__media,
.prsd .card__media-wrapper .card__media {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--transition);
}
.prsd-card__media-overlay,
.prsd .card__media-overlay {
  position: absolute;
  inset: 0;
  background-color: var(--card-hover-overlay-bg);
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding: var(--spacing-md);
  opacity: 0;
  transition: opacity var(--transition);
}
.prsd-card__media-overlay .prsd-btn, .prsd-card__media-overlay .btn,
.prsd .card__media-overlay .prsd-btn,
.prsd .card__media-overlay .btn {
  transform: translateY(8px);
  transition: transform var(--transition), opacity var(--transition);
  opacity: 0;
}
.prsd-card--document,
.prsd .card--document {
  width: var(--card-width);
  height: var(--card-height);
  display: flex;
  flex-direction: column;
}
.prsd-card--document .prsd-card__media-wrapper, .prsd-card--document .card__media-wrapper,
.prsd .card--document .prsd-card__media-wrapper,
.prsd .card--document .card__media-wrapper {
  position: relative;
  width: var(--card-media-width);
  height: var(--card-media-height);
  background-color: var(--color-neutral-100);
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.prsd-card--document .prsd-card__header, .prsd-card--document .card__header,
.prsd .card--document .prsd-card__header,
.prsd .card--document .card__header {
  position: absolute;
  top: var(--spacing-sm);
  left: var(--spacing-sm);
  right: var(--spacing-sm);
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  z-index: 1;
}
.prsd-card--document .prsd-status, .prsd-card--document .status,
.prsd .card--document .prsd-status,
.prsd .card--document .status {
  min-width: auto;
}
.prsd-card--document .prsd-card__menu, .prsd-card--document .card__menu,
.prsd .card--document .prsd-card__menu,
.prsd .card--document .card__menu {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border: none;
  background-color: transparent;
  color: var(--color-neutral-600);
  cursor: pointer;
  border-radius: var(--radius-sm);
  transition: background-color var(--transition);
}
.prsd-card--document .prsd-card__menu:hover, .prsd-card--document .card__menu:hover,
.prsd .card--document .prsd-card__menu:hover,
.prsd .card--document .card__menu:hover {
  background-color: var(--color-neutral-200);
}
.prsd-card--document .prsd-card__thumbnail, .prsd-card--document .card__thumbnail,
.prsd .card--document .prsd-card__thumbnail,
.prsd .card--document .card__thumbnail {
  max-width: 70%;
  max-height: 70%;
  object-fit: contain;
  border-radius: var(--radius-sm);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}
.prsd-card--document .prsd-card__body, .prsd-card--document .card__body,
.prsd .card--document .prsd-card__body,
.prsd .card--document .card__body {
  padding: var(--card-padding);
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}
.prsd-card--document .prsd-card__title, .prsd-card--document .card__title,
.prsd .card--document .prsd-card__title,
.prsd .card--document .card__title {
  font-size: var(--font-size-h4);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-title);
  margin-bottom: var(--spacing-xs);
}
.prsd-card--document .prsd-card__subtitle, .prsd-card--document .card__subtitle,
.prsd .card--document .prsd-card__subtitle,
.prsd .card--document .card__subtitle {
  font-size: var(--font-size-body-sm);
  color: var(--color-text-secondary);
  margin-bottom: var(--spacing-xs);
}
.prsd-card--document .prsd-card__link, .prsd-card--document .card__link,
.prsd .card--document .prsd-card__link,
.prsd .card--document .card__link {
  font-size: var(--font-size-body-sm);
  color: var(--color-text-secondary);
  margin-bottom: var(--spacing-sm);
}
.prsd-card--document .prsd-card__link a, .prsd-card--document .card__link a,
.prsd .card--document .prsd-card__link a,
.prsd .card--document .card__link a {
  color: var(--color-primary-600);
  text-decoration: none;
}
.prsd-card--document .prsd-card__link a:hover, .prsd-card--document .card__link a:hover,
.prsd .card--document .prsd-card__link a:hover,
.prsd .card--document .card__link a:hover {
  text-decoration: underline;
}
.prsd-card--document .prsd-card__tags, .prsd-card--document .card__tags,
.prsd .card--document .prsd-card__tags,
.prsd .card--document .card__tags {
  display: flex;
  gap: var(--spacing-xs);
  margin-top: auto;
}
.prsd-card--document .prsd-card__tag, .prsd-card--document .card__tag,
.prsd .card--document .prsd-card__tag,
.prsd .card--document .card__tag {
  display: inline-flex;
  align-items: center;
  padding: 2px var(--spacing-sm);
  background-color: var(--color-neutral-100);
  color: var(--color-text-secondary);
  border-radius: var(--radius-full);
  font-size: var(--font-size-caption);
  font-weight: var(--font-weight-medium);
}

.prsd-mini-card,
.prsd .mini-card {
  display: flex;
  align-items: center;
  gap: var(--mini-card-gap);
  height: var(--mini-card-height);
  padding: var(--mini-card-padding);
  background-color: var(--mini-card-bg);
  border: var(--mini-card-border-width) solid var(--mini-card-border-color);
  border-radius: var(--mini-card-radius);
  transition: background-color var(--transition);
  cursor: pointer;
}
.prsd-mini-card:hover,
.prsd .mini-card:hover {
  background-color: var(--mini-card-bg-hover);
}
.prsd-mini-card__thumb,
.prsd .mini-card__thumb {
  flex-shrink: 0;
  width: var(--mini-card-thumb-size);
  height: var(--mini-card-thumb-size);
  border-radius: var(--mini-card-thumb-radius);
  background-color: var(--mini-card-thumb-bg);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.prsd-mini-card__thumb img,
.prsd .mini-card__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.prsd-mini-card__content,
.prsd .mini-card__content {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xxs, 2px);
}
.prsd-mini-card__title,
.prsd .mini-card__title {
  color: var(--mini-card-title-color);
  font-size: var(--mini-card-title-font-size);
  font-weight: var(--mini-card-title-font-weight);
  line-height: var(--line-height-body);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.prsd-mini-card__meta,
.prsd .mini-card__meta {
  color: var(--mini-card-meta-color);
  font-size: var(--mini-card-meta-font-size);
  line-height: var(--line-height-caption);
}
.prsd-mini-card__status,
.prsd .mini-card__status {
  margin-top: var(--mini-card-status-gap);
}

.prsd-table-container,
.prsd .table-container {
  width: 100%;
  overflow-x: auto;
}

.prsd-table,
.prsd .table {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--font-size-body);
  background-color: var(--table-bg);
}
.prsd-table th,
.prsd-table td,
.prsd .table th,
.prsd .table td {
  padding: var(--table-cell-padding-y) var(--table-cell-padding-x);
  text-align: left;
  border-bottom: var(--table-border-width) solid var(--table-border-color);
}
.prsd-table th,
.prsd .table th {
  font-weight: var(--font-weight-medium);
  color: var(--table-header-text);
  background-color: var(--color-neutral-100);
  white-space: nowrap;
}
.prsd-table td,
.prsd .table td {
  color: var(--table-body-text);
}
.prsd-table tbody tr,
.prsd .table tbody tr {
  transition: background-color var(--transition);
}
.prsd-table tbody tr:hover,
.prsd .table tbody tr:hover {
  background-color: var(--table-row-bg-hover);
}
.prsd-table tbody tr:last-child td,
.prsd .table tbody tr:last-child td {
  border-bottom: none;
}
.prsd-table--bordered,
.prsd .table--bordered {
  border: var(--table-border-width) solid var(--table-border-color);
  border-radius: var(--table-border-radius);
  overflow: hidden;
}
.prsd-table--bordered th,
.prsd-table--bordered td,
.prsd .table--bordered th,
.prsd .table--bordered td {
  border: var(--table-border-width) solid var(--table-border-color);
}
.prsd-table--striped tbody tr:nth-child(even),
.prsd .table--striped tbody tr:nth-child(even) {
  background-color: var(--color-neutral-100);
}
.prsd-table--striped tbody tr:nth-child(even):hover,
.prsd .table--striped tbody tr:nth-child(even):hover {
  background-color: var(--table-row-bg-hover);
}
.prsd-table--compact th,
.prsd-table--compact td,
.prsd .table--compact th,
.prsd .table--compact td {
  padding: var(--spacing-sm) var(--spacing-md);
}
.prsd-table .text-right,
.prsd .table .text-right {
  text-align: right;
}
.prsd-table .text-center,
.prsd .table .text-center {
  text-align: center;
}
.prsd-table .cell--success,
.prsd .table .cell--success {
  color: var(--color-success-600);
}
.prsd-table .cell--warning,
.prsd .table .cell--warning {
  color: var(--color-warning-600);
}
.prsd-table .cell--error,
.prsd .table .cell--error {
  color: var(--color-error-600);
}
.prsd-table th.sortable,
.prsd .table th.sortable {
  cursor: pointer;
  user-select: none;
}
.prsd-table th.sortable:hover,
.prsd .table th.sortable:hover {
  background-color: var(--color-neutral-200);
}
.prsd-table--selectable tbody tr,
.prsd .table--selectable tbody tr {
  cursor: pointer;
}
.prsd-table--selectable tbody tr.selected,
.prsd .table--selectable tbody tr.selected {
  background-color: var(--table-row-bg-selected);
}

.prsd-list,
.prsd .list {
  background-color: var(--list-bg);
}

.prsd-list-item,
.prsd .list-item {
  display: flex;
  align-items: center;
  min-height: var(--list-item-height);
  padding: 0 var(--list-item-padding-x);
  background-color: var(--list-item-bg-default);
  border-bottom: var(--list-item-divider-width) solid var(--list-item-divider-color);
  transition: background-color var(--transition);
}
.prsd-list-item:hover,
.prsd .list-item:hover {
  background-color: var(--list-item-bg-hover);
}
.prsd-list-item--selected,
.prsd .list-item--selected {
  background-color: var(--list-item-bg-selected);
}
.prsd-list-item:last-child,
.prsd .list-item:last-child {
  border-bottom: none;
}

.prsd-status,
.prsd .status {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-xs);
  height: var(--status-height);
  min-width: var(--status-min-width);
  padding: var(--status-padding-y) var(--status-padding-x);
  background-color: var(--status-bg-default);
  border-radius: var(--status-radius);
  font-size: var(--status-font-size);
  line-height: var(--status-line-height);
  font-weight: var(--status-font-weight);
  color: var(--status-text-color);
}
.prsd-status__chevron,
.prsd .status__chevron {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--status-chevron-size);
  height: var(--status-chevron-size);
  color: var(--status-chevron-color);
  flex-shrink: 0;
  margin-left: auto;
}
.prsd-status__chevron .material-symbols-outlined,
.prsd .status__chevron .material-symbols-outlined {
  font-size: var(--status-chevron-size);
}
.prsd-status--primary,
.prsd .status--primary {
  background-color: var(--color-primary-50);
  color: var(--color-primary-600);
}
.prsd-status--primary .prsd-status__chevron, .prsd-status--primary .status__chevron,
.prsd .status--primary .prsd-status__chevron,
.prsd .status--primary .status__chevron {
  color: var(--color-primary-500);
}
.prsd-status--success,
.prsd .status--success {
  background-color: var(--color-success-50);
  color: var(--color-success-600);
}
.prsd-status--success .prsd-status__chevron, .prsd-status--success .status__chevron,
.prsd .status--success .prsd-status__chevron,
.prsd .status--success .status__chevron {
  color: var(--color-success-500);
}
.prsd-status--warning,
.prsd .status--warning {
  background-color: var(--color-warning-50);
  color: var(--color-warning-600);
}
.prsd-status--warning .prsd-status__chevron, .prsd-status--warning .status__chevron,
.prsd .status--warning .prsd-status__chevron,
.prsd .status--warning .status__chevron {
  color: var(--color-warning-500);
}
.prsd-status--error,
.prsd .status--error {
  background-color: var(--color-error-50);
  color: var(--color-error-600);
}
.prsd-status--error .prsd-status__chevron, .prsd-status--error .status__chevron,
.prsd .status--error .prsd-status__chevron,
.prsd .status--error .status__chevron {
  color: var(--color-error-500);
}

.prsd-badge,
.prsd .badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: var(--badge-height);
  padding: 0 var(--badge-padding-x);
  background-color: var(--badge-bg-default);
  border-radius: var(--badge-radius);
  font-size: var(--badge-font-size);
  line-height: var(--badge-line-height);
  font-weight: var(--badge-font-weight);
  color: var(--badge-text-color);
}
.prsd-badge--primary,
.prsd .badge--primary {
  background-color: var(--color-primary-100);
  color: var(--color-primary-700);
}
.prsd-badge--success,
.prsd .badge--success {
  background-color: var(--color-success-100);
  color: var(--color-success-700);
}
.prsd-badge--warning,
.prsd .badge--warning {
  background-color: var(--color-warning-100);
  color: var(--color-warning-700);
}
.prsd-badge--error,
.prsd .badge--error {
  background-color: var(--color-error-100);
  color: var(--color-error-700);
}
.prsd-badge--neutral,
.prsd .badge--neutral {
  background-color: var(--color-neutral-200);
  color: var(--color-neutral-700);
}

.prsd-tag,
.prsd .tag {
  display: inline-flex;
  align-items: center;
  height: var(--tag-height);
  padding: var(--tag-padding-y) var(--tag-padding-x);
  background-color: var(--tag-bg-default);
  border: 1px solid var(--tag-border-default);
  border-radius: var(--tag-radius);
  font-size: var(--tag-font-size);
  line-height: var(--tag-line-height);
  font-weight: var(--tag-font-weight);
  color: var(--tag-text-default);
}
.prsd-tag--primary,
.prsd .tag--primary {
  background-color: var(--color-primary-100);
  color: var(--color-primary-700);
}
.prsd-tag--success,
.prsd .tag--success {
  background-color: var(--color-success-100);
  color: var(--color-success-700);
}
.prsd-tag--warning,
.prsd .tag--warning {
  background-color: var(--color-warning-100);
  color: var(--color-warning-700);
}
.prsd-tag--error,
.prsd .tag--error {
  background-color: var(--color-error-100);
  color: var(--color-error-700);
}

.prsd-alert,
.prsd .alert {
  display: flex;
  gap: var(--spacing-sm);
  padding: var(--spacing-md);
  border-radius: var(--radius-md);
  font-size: var(--font-size-body);
  line-height: var(--line-height-body);
}
.prsd-alert--info,
.prsd .alert--info {
  background-color: var(--color-primary-50);
  border: 1px solid var(--color-primary-200);
  color: var(--color-primary-800);
}
.prsd-alert--success,
.prsd .alert--success {
  background-color: var(--color-success-50);
  border: 1px solid var(--color-success-200);
  color: var(--color-success-800);
}
.prsd-alert--warning,
.prsd .alert--warning {
  background-color: var(--color-warning-50);
  border: 1px solid var(--color-warning-200);
  color: var(--color-warning-800);
}
.prsd-alert--error,
.prsd .alert--error {
  background-color: var(--color-error-50);
  border: 1px solid var(--color-error-200);
  color: var(--color-error-800);
}

.prsd-avatar,
.prsd .avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-full);
  background-color: var(--color-primary-100);
  color: var(--color-primary-700);
  font-weight: var(--font-weight-semibold);
  overflow: hidden;
}
.prsd-avatar--sm,
.prsd .avatar--sm {
  width: 32px;
  height: 32px;
  font-size: var(--font-size-caption);
}
.prsd-avatar--md,
.prsd .avatar--md {
  width: 40px;
  height: 40px;
  font-size: var(--font-size-body);
}
.prsd-avatar--lg,
.prsd .avatar--lg {
  width: 56px;
  height: 56px;
  font-size: var(--font-size-h4);
}
.prsd-avatar img,
.prsd .avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.prsd-tabs,
.prsd .tabs {
  gap: var(--tabs-gap);
  padding: 0;
  background-color: var(--color-neutral-50);
  border-radius: var(--radius-md);
  overflow-x: auto;
  position: sticky;
  top: 0;
  z-index: 100;
}
.prsd-tabs a.prsd-tab,
.prsd .tabs a.prsd-tab {
  text-decoration: none;
}

.prsd-tab,
.prsd .tab {
  display: inline-flex;
  flex-grow: 1;
  align-items: center;
  justify-content: center;
  height: var(--tab-height);
  padding: 0 var(--spacing-md);
  background-color: var(--tab-bg-default);
  color: var(--tab-text-default);
  font-family: var(--font-family-primary);
  font-size: var(--tab-text-size);
  font-weight: var(--tab-text-weight);
  border-radius: var(--tab-radius);
  border: none;
  cursor: pointer;
  transition: all var(--transition);
}
.prsd-tab:hover:not(:disabled):not(.prsd-tab--active,
.prsd .tab--active), .prsd-tab:active,
.prsd .tab:hover:not(:disabled):not(.prsd-tab--active,
.prsd .tab--active),
.prsd .tab:active {
  background-color: var(--tab-bg-hover);
  color: var(--tab-text-hover);
}
.prsd-tab--active,
.prsd .tab--active {
  background-color: var(--tab-bg-active);
  color: var(--tab-text-active);
}
.prsd-tab:disabled,
.prsd .tab:disabled {
  background-color: var(--tab-bg-disabled);
  color: var(--tab-text-disabled);
  cursor: not-allowed;
}

a.prsd-tab:active,
.prsd a.tab:active {
  background: red;
}

.prsd-pagination,
.prsd .pagination {
  display: flex;
  align-items: center;
  justify-content: var(--pagination-align);
  gap: var(--pagination-gap);
  height: var(--pagination-height);
}
.prsd-pagination__item,
.prsd .pagination__item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: var(--pagination-item-min-width);
  height: var(--pagination-item-height);
  padding: 0 var(--pagination-item-padding-x);
  border-radius: var(--pagination-item-radius);
  font-family: var(--font-family-primary);
  font-size: var(--pagination-font-size);
  font-weight: var(--pagination-font-weight);
  color: var(--pagination-text-default);
  background-color: transparent;
  border: none;
  cursor: pointer;
  transition: all var(--transition);
}
.prsd-pagination__item:hover:not(.prsd-pagination__item--active,
.prsd .pagination__item--active):not(:disabled),
.prsd .pagination__item:hover:not(.prsd-pagination__item--active,
.prsd .pagination__item--active):not(:disabled) {
  background-color: var(--pagination-bg-hover);
}
.prsd-pagination__item:active:not(.prsd-pagination__item--active,
.prsd .pagination__item--active):not(:disabled),
.prsd .pagination__item:active:not(.prsd-pagination__item--active,
.prsd .pagination__item--active):not(:disabled) {
  background-color: var(--pagination-bg-pressed);
}
.prsd-pagination__item--active,
.prsd .pagination__item--active {
  background-color: var(--pagination-bg-active);
  color: var(--pagination-text-active);
}
.prsd-pagination__item--muted,
.prsd .pagination__item--muted {
  color: var(--pagination-text-muted);
}
.prsd-pagination__nav,
.prsd .pagination__nav {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--pagination-icon-hit-area);
  height: var(--pagination-icon-hit-area);
  border: none;
  background: transparent;
  cursor: pointer;
  color: var(--pagination-icon-color);
  border-radius: var(--radius-full);
  transition: background-color var(--transition);
}
.prsd-pagination__nav:hover:not(:disabled),
.prsd .pagination__nav:hover:not(:disabled) {
  background-color: var(--pagination-bg-hover);
}
.prsd-pagination__nav:disabled,
.prsd .pagination__nav:disabled {
  opacity: var(--disabled-opacity);
  cursor: not-allowed;
}
.prsd-pagination__nav .material-symbols-outlined,
.prsd .pagination__nav .material-symbols-outlined {
  font-size: var(--pagination-icon-size);
}

.prsd-items-per-page,
.prsd .items-per-page {
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
}
.prsd-items-per-page__label,
.prsd .items-per-page__label {
  color: var(--itemsperpage-label-text);
  font-size: var(--font-size-body);
}
.prsd-items-per-page__trigger,
.prsd .items-per-page__trigger {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  height: var(--itemsperpage-trigger-height);
  max-width: var(--itemsperpage-trigger-max-width);
  padding: 0 var(--itemsperpage-trigger-padding-x);
  background-color: var(--itemsperpage-trigger-bg);
  border: var(--itemsperpage-trigger-border-width) solid var(--itemsperpage-trigger-border);
  border-radius: var(--itemsperpage-trigger-radius);
  color: var(--itemsperpage-trigger-text);
  font-size: var(--font-size-body);
  cursor: pointer;
}
.prsd-items-per-page__trigger .material-symbols-outlined,
.prsd .items-per-page__trigger .material-symbols-outlined {
  font-size: var(--itemsperpage-trigger-icon-size);
  color: var(--itemsperpage-trigger-icon-color);
}

.prsd-menu,
.prsd .menu {
  background-color: var(--menu-bg);
  border: 1px solid var(--menu-border);
  border-radius: var(--menu-radius);
  box-shadow: var(--menu-shadow);
  overflow: hidden;
  min-width: 200px;
}
.prsd-menu__item,
.prsd .menu__item {
  display: flex;
  align-items: center;
  height: var(--menu-item-height);
  padding: 0 var(--menu-item-padding-x);
  color: var(--menu-item-text);
  font-size: var(--font-size-body);
  cursor: pointer;
  transition: background-color var(--transition);
}
.prsd-menu__item:hover,
.prsd .menu__item:hover {
  background-color: var(--menu-item-bg-hover);
}
.prsd-menu__item:active,
.prsd .menu__item:active {
  background-color: var(--menu-item-bg-pressed);
}
.prsd-menu__item--selected,
.prsd .menu__item--selected {
  background-color: var(--menu-item-bg-selected);
  color: var(--menu-item-text-selected);
}
.prsd-menu__item--disabled,
.prsd .menu__item--disabled {
  color: var(--menu-item-text-disabled);
  cursor: not-allowed;
}
.prsd-menu__item--disabled:hover,
.prsd .menu__item--disabled:hover {
  background-color: transparent;
}
.prsd-menu__divider,
.prsd .menu__divider {
  height: 1px;
  background-color: var(--menu-border);
  margin: var(--spacing-xs) 0;
}

.prsd-modal-overlay,
.prsd .modal-overlay {
  position: fixed;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
}

.prsd-modal,
.prsd .modal {
  width: var(--modal-width-default);
  max-width: var(--modal-width-max);
  background-color: var(--modal-bg);
  border: var(--modal-border-width) solid var(--modal-border-color);
  border-radius: var(--modal-radius);
  box-shadow: var(--modal-shadow);
  padding: var(--modal-padding);
}
.prsd-modal--alert,
.prsd .modal--alert {
  text-align: var(--modal-text-align);
}
.prsd-modal--alert .prsd-modal__icon-badge, .prsd-modal--alert .modal__icon-badge,
.prsd .modal--alert .prsd-modal__icon-badge,
.prsd .modal--alert .modal__icon-badge {
  margin: 0 auto var(--modal-content-gap);
}
.prsd-modal--alert .prsd-modal__title, .prsd-modal--alert .modal__title,
.prsd .modal--alert .prsd-modal__title,
.prsd .modal--alert .modal__title {
  margin-bottom: var(--spacing-sm);
}
.prsd-modal--alert .prsd-modal__description, .prsd-modal--alert .modal__description,
.prsd .modal--alert .prsd-modal__description,
.prsd .modal--alert .modal__description {
  margin-bottom: var(--modal-content-to-actions-gap);
}
.prsd-modal--alert .prsd-modal__actions, .prsd-modal--alert .modal__actions,
.prsd .modal--alert .prsd-modal__actions,
.prsd .modal--alert .modal__actions {
  justify-content: center;
}
.prsd-modal__header,
.prsd .modal__header {
  display: flex;
  align-items: flex-start;
  gap: var(--spacing-md);
  margin-bottom: var(--modal-content-gap);
}
.prsd-modal__icon-badge,
.prsd .modal__icon-badge {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--modal-icon-badge-size);
  height: var(--modal-icon-badge-size);
  border-radius: var(--radius-full);
  flex-shrink: 0;
}
.prsd-modal__icon-badge--warning,
.prsd .modal__icon-badge--warning {
  background-color: var(--modal-icon-badge-bg-warning);
  color: var(--modal-icon-color-warning);
}
.prsd-modal__icon-badge--error,
.prsd .modal__icon-badge--error {
  background-color: var(--modal-icon-badge-bg-error);
  color: var(--modal-icon-color-error);
}
.prsd-modal__icon-badge--info,
.prsd .modal__icon-badge--info {
  background-color: var(--modal-icon-badge-bg-info);
  color: var(--modal-icon-color-info);
}
.prsd-modal__icon-badge--success,
.prsd .modal__icon-badge--success {
  background-color: var(--modal-icon-badge-bg-success);
  color: var(--modal-icon-color-success);
}
.prsd-modal__icon-badge .material-symbols-outlined,
.prsd .modal__icon-badge .material-symbols-outlined {
  font-size: var(--modal-icon-size);
}
.prsd-modal__title,
.prsd .modal__title {
  font-size: var(--font-size-h4);
  font-weight: var(--font-weight-semibold);
  color: var(--modal-title-color);
  margin-bottom: var(--spacing-xs);
}
.prsd-modal__description,
.prsd .modal__description {
  font-size: var(--font-size-body);
  color: var(--modal-text-color);
  line-height: var(--line-height-body);
}
.prsd-modal__body,
.prsd .modal__body {
  margin-bottom: var(--modal-content-gap);
}
.prsd-modal__actions,
.prsd .modal__actions {
  display: flex;
  justify-content: var(--modal-actions-justify);
  gap: var(--modal-actions-gap);
}
.prsd-modal__footer,
.prsd .modal__footer {
  display: flex;
  justify-content: var(--modal-actions-justify);
  gap: var(--modal-actions-gap);
  margin-top: var(--modal-content-to-actions-gap);
}
.prsd-modal__close,
.prsd .modal__close {
  position: absolute;
  top: var(--spacing-md);
  right: var(--spacing-md);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border: none;
  background: transparent;
  cursor: pointer;
  color: var(--color-neutral-500);
  border-radius: var(--radius-sm);
  transition: background-color var(--transition);
}
.prsd-modal__close:hover,
.prsd .modal__close:hover {
  background-color: var(--color-neutral-100);
}
.prsd-modal--form,
.prsd .modal--form {
  width: var(--modal-form-width-default);
  min-width: var(--modal-form-width-min);
  max-width: var(--modal-form-width-max);
  padding: var(--modal-form-padding);
}
.prsd-modal__progress,
.prsd .modal__progress {
  display: flex;
  gap: var(--spacing-xs);
  margin-bottom: var(--spacing-lg);
}
.prsd-modal__progress-step,
.prsd .modal__progress-step {
  flex: 1;
  height: var(--modal-step-height);
  background-color: var(--modal-step-bg-track);
  border-radius: var(--modal-step-radius);
}
.prsd-modal__progress-step--active,
.prsd .modal__progress-step--active {
  background-color: var(--modal-step-bg-active);
}

.prsd-selector,
.prsd .selector {
  width: var(--selector-width);
  max-height: var(--selector-max-height);
  padding: var(--selector-padding);
  background-color: var(--selector-bg);
  border: var(--selector-border-width) solid var(--selector-border-color);
  border-radius: var(--selector-radius);
  box-shadow: var(--selector-shadow);
  display: flex;
  flex-direction: column;
}
.prsd-selector--lg,
.prsd .selector--lg {
  width: var(--selector-width-lg);
}
.prsd-selector__header,
.prsd .selector__header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: var(--selector-header-gap);
}
.prsd-selector__title,
.prsd .selector__title {
  color: var(--selector-title-color);
  font-size: var(--font-size-h3);
  font-weight: var(--font-weight-semibold);
  margin: 0;
}
.prsd-selector__subtitle,
.prsd .selector__subtitle {
  color: var(--selector-subtitle-color);
  font-size: var(--font-size-body-sm);
  margin-top: var(--spacing-xs);
}
.prsd-selector__close,
.prsd .selector__close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--selector-close-hit-area);
  height: var(--selector-close-hit-area);
  margin: calc(-1 * var(--spacing-sm));
  border: none;
  background: transparent;
  cursor: pointer;
  color: var(--selector-close-color);
  border-radius: var(--radius-sm);
  transition: background-color var(--transition);
}
.prsd-selector__close:hover,
.prsd .selector__close:hover {
  background-color: var(--color-neutral-100);
}
.prsd-selector__close .material-symbols-outlined,
.prsd .selector__close .material-symbols-outlined {
  font-size: var(--selector-close-size);
}
.prsd-selector__search,
.prsd .selector__search {
  position: relative;
  margin-bottom: var(--spacing-md);
}
.prsd-selector__search-input,
.prsd .selector__search-input {
  width: 100%;
  height: var(--selector-search-height);
  padding: 0 var(--selector-search-padding-x);
  padding-left: calc(var(--selector-search-padding-x) + var(--selector-search-icon-size) + var(--spacing-sm));
  font-family: var(--font-family-primary);
  font-size: var(--font-size-body);
  color: var(--selector-search-text);
  background-color: var(--selector-search-bg);
  border: 1px solid var(--selector-search-border);
  border-radius: var(--selector-search-radius);
  outline: none;
  transition: border-color var(--transition);
}
.prsd-selector__search-input::placeholder,
.prsd .selector__search-input::placeholder {
  color: var(--selector-search-placeholder);
}
.prsd-selector__search-input:focus,
.prsd .selector__search-input:focus {
  border-color: var(--color-primary-500);
}
.prsd-selector__search-icon,
.prsd .selector__search-icon {
  position: absolute;
  left: var(--selector-search-padding-x);
  top: 50%;
  transform: translateY(-50%);
  font-size: var(--selector-search-icon-size);
  color: var(--selector-search-icon-color);
  pointer-events: none;
}
.prsd-selector__table,
.prsd .selector__table {
  flex: 1;
  overflow-y: auto;
  border: 1px solid var(--selector-border-color);
  border-radius: var(--radius-md);
}
.prsd-selector__table-header,
.prsd .selector__table-header {
  display: flex;
  align-items: center;
  height: var(--selector-table-header-height);
  padding: 0 var(--spacing-md);
  background-color: var(--selector-bg);
  border-bottom: 1px solid var(--selector-table-header-border);
  font-size: var(--font-size-body-sm);
  font-weight: var(--font-weight-medium);
  color: var(--selector-table-header-text);
}
.prsd-selector__table-header-cell--radio,
.prsd .selector__table-header-cell--radio {
  flex: 0 0 48px;
}
.prsd-selector__table-header-content,
.prsd .selector__table-header-content {
  flex: 1;
  display: flex;
  align-items: center;
  gap: var(--spacing-md);
}
.prsd-selector__table-header-cell,
.prsd .selector__table-header-cell {
  flex: 1;
}
.prsd-selector__row,
.prsd .selector__row {
  display: flex;
  align-items: center;
  min-height: var(--selector-row-height);
  padding: var(--spacing-sm) var(--spacing-md);
  border-bottom: 1px solid var(--selector-border-color);
  cursor: pointer;
  transition: background-color var(--transition);
}
.prsd-selector__row:last-child,
.prsd .selector__row:last-child {
  border-bottom: none;
}
.prsd-selector__row:hover,
.prsd .selector__row:hover {
  background-color: var(--selector-row-bg-hover);
}
.prsd-selector__row--selected,
.prsd .selector__row--selected {
  background-color: var(--selector-row-bg-selected);
}
.prsd-selector__row-radio,
.prsd .selector__row-radio {
  flex: 0 0 48px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.prsd-selector__row-content,
.prsd .selector__row-content {
  flex: 1;
  display: flex;
  align-items: center;
  gap: var(--spacing-md);
}
.prsd-selector__row-cell,
.prsd .selector__row-cell {
  flex: 1;
}
.prsd-selector__row-primary,
.prsd .selector__row-primary {
  color: var(--selector-row-text-primary);
  font-size: var(--font-size-body);
  font-weight: var(--font-weight-medium);
}
.prsd-selector__row-secondary,
.prsd .selector__row-secondary {
  color: var(--selector-row-text-secondary);
  font-size: var(--font-size-body-sm);
}
.prsd-selector__radio,
.prsd .selector__radio {
  font-size: var(--selector-radio-size);
  color: var(--selector-radio-color-unchecked);
}
.prsd-selector__row--selected .prsd-selector__radio,
.prsd-selector__row--selected .prsd .selector__radio,
.prsd .selector__row--selected .prsd-selector__radio,
.prsd .selector__row--selected .prsd .selector__radio {
  color: var(--selector-radio-color-checked);
}
.prsd-selector__footer,
.prsd .selector__footer {
  display: flex;
  justify-content: var(--selector-footer-justify);
  gap: var(--selector-footer-gap);
  margin-top: var(--spacing-lg);
}

.prsd-dropzone,
.prsd .dropzone {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: var(--import-dropzone-min-height);
  padding: var(--import-dropzone-padding);
  background-color: var(--import-dropzone-bg);
  border: 2px dashed var(--import-dropzone-border);
  border-radius: var(--radius-md);
  text-align: center;
  cursor: pointer;
  transition: all var(--transition);
}
.prsd-dropzone:hover,
.prsd .dropzone:hover {
  background-color: var(--import-dropzone-bg-hover);
  border-color: var(--import-dropzone-border-hover);
}
.prsd-dropzone--dragover,
.prsd .dropzone--dragover {
  background-color: var(--import-dropzone-bg-dragover);
  border-color: var(--import-dropzone-border-dragover);
}
.prsd-dropzone__icon-badge,
.prsd .dropzone__icon-badge {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--import-dropzone-icon-badge-size);
  height: var(--import-dropzone-icon-badge-size);
  background-color: var(--import-dropzone-icon-badge-color);
  border-radius: var(--radius-full);
  margin-bottom: var(--spacing-md);
}
.prsd-dropzone__icon-badge .material-symbols-outlined,
.prsd .dropzone__icon-badge .material-symbols-outlined {
  font-size: var(--import-dropzone-icon-size);
  color: var(--import-dropzone-icon-color);
}
.prsd-dropzone__title,
.prsd .dropzone__title {
  font-size: var(--font-size-body);
  font-weight: var(--font-weight-medium);
  color: var(--import-dropzone-title-color);
  margin-bottom: var(--spacing-xs);
}
.prsd-dropzone__help,
.prsd .dropzone__help {
  font-size: var(--font-size-caption);
  color: var(--import-dropzone-help-color);
}
.prsd-dropzone__separator,
.prsd .dropzone__separator {
  font-size: var(--font-size-caption);
  color: var(--import-dropzone-help-color);
  margin: var(--spacing-sm) 0;
}
.prsd-dropzone--error,
.prsd .dropzone--error {
  background-color: var(--import-dropzone-bg-error);
  border-color: var(--import-dropzone-border-error);
}
.prsd-dropzone--error .prsd-dropzone__icon-badge, .prsd-dropzone--error .dropzone__icon-badge,
.prsd .dropzone--error .prsd-dropzone__icon-badge,
.prsd .dropzone--error .dropzone__icon-badge {
  background-color: var(--import-dropzone-error-icon-badge-color);
}
.prsd-dropzone--error .prsd-dropzone__icon-badge .material-symbols-outlined, .prsd-dropzone--error .dropzone__icon-badge .material-symbols-outlined,
.prsd .dropzone--error .prsd-dropzone__icon-badge .material-symbols-outlined,
.prsd .dropzone--error .dropzone__icon-badge .material-symbols-outlined {
  color: var(--import-dropzone-error-icon-color);
}
.prsd-dropzone__error-text,
.prsd .dropzone__error-text {
  font-size: var(--font-size-caption);
  color: var(--import-dropzone-error-text);
  margin-top: var(--spacing-sm);
}

.prsd-file-row,
.prsd .file-row {
  display: flex;
  align-items: center;
  gap: var(--import-file-row-gap);
  min-height: var(--import-file-row-height);
  padding: var(--import-file-row-padding-y) var(--import-file-row-padding-x);
  background-color: var(--import-file-row-bg);
  border: 1px solid var(--import-file-row-border);
  border-radius: var(--import-file-row-radius);
  transition: background-color var(--transition);
}
.prsd-file-row:hover,
.prsd .file-row:hover {
  background-color: var(--import-file-row-bg-hover);
}
.prsd-file-row__icon-badge,
.prsd .file-row__icon-badge {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--import-file-icon-badge-size);
  height: var(--import-file-icon-badge-size);
  background-color: var(--import-file-icon-badge-bg);
  border-radius: var(--radius-full);
  flex-shrink: 0;
}
.prsd-file-row__icon-badge .material-symbols-outlined,
.prsd .file-row__icon-badge .material-symbols-outlined {
  font-size: var(--import-file-icon-size);
  color: var(--import-file-icon-color);
}
.prsd-file-row__content,
.prsd .file-row__content {
  flex: 1;
  min-width: 0;
}
.prsd-file-row__name,
.prsd .file-row__name {
  font-size: var(--font-size-body);
  font-weight: var(--font-weight-medium);
  color: var(--import-file-name-color);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.prsd-file-row__meta,
.prsd .file-row__meta {
  font-size: var(--font-size-caption);
  color: var(--import-file-meta-color);
  margin-top: var(--spacing-xs);
}
.prsd-file-row__action,
.prsd .file-row__action {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border: none;
  background: transparent;
  cursor: pointer;
  border-radius: var(--radius-sm);
  transition: background-color var(--transition);
}
.prsd-file-row__action .material-symbols-outlined,
.prsd .file-row__action .material-symbols-outlined {
  font-size: var(--import-file-action-icon-size);
  color: var(--import-file-action-icon-color);
}
.prsd-file-row__action:hover,
.prsd .file-row__action:hover {
  background-color: var(--color-neutral-100);
}
.prsd-file-row__action:hover .material-symbols-outlined,
.prsd .file-row__action:hover .material-symbols-outlined {
  color: var(--import-file-action-icon-hover);
}
.prsd-file-row--error,
.prsd .file-row--error {
  background-color: var(--import-file-row-bg-error);
  border-color: var(--import-file-row-border-error);
}
.prsd-file-row--error .prsd-file-row__icon-badge, .prsd-file-row--error .file-row__icon-badge,
.prsd .file-row--error .prsd-file-row__icon-badge,
.prsd .file-row--error .file-row__icon-badge {
  background-color: var(--import-dropzone-error-icon-badge-color);
}
.prsd-file-row--error .prsd-file-row__icon-badge .material-symbols-outlined, .prsd-file-row--error .file-row__icon-badge .material-symbols-outlined,
.prsd .file-row--error .prsd-file-row__icon-badge .material-symbols-outlined,
.prsd .file-row--error .file-row__icon-badge .material-symbols-outlined {
  color: var(--import-file-action-icon-error);
}
.prsd-file-row--error .prsd-file-row__action .material-symbols-outlined,
.prsd-file-row--error .file-row__action .material-symbols-outlined,
.prsd .file-row--error .prsd-file-row__action .material-symbols-outlined,
.prsd .file-row--error .file-row__action .material-symbols-outlined {
  color: var(--import-file-action-icon-error);
}
.prsd-file-row__error-text,
.prsd .file-row__error-text {
  font-size: var(--font-size-caption);
  color: var(--import-file-row-error-text);
  margin-top: var(--spacing-xs);
}

.prsd-banner,
.prsd .banner {
  display: flex;
  align-items: center;
  gap: var(--banner-gap);
  min-height: var(--banner-height);
  padding: var(--spacing-md) var(--banner-padding-x);
  border-radius: var(--banner-radius);
  border-width: var(--banner-border-width);
  border-style: solid;
  color: var(--banner-text);
}
.prsd-banner--info,
.prsd .banner--info {
  background-color: var(--banner-bg-info);
  border-color: var(--banner-border-info);
}
.prsd-banner--info .prsd-banner__icon, .prsd-banner--info .banner__icon,
.prsd .banner--info .prsd-banner__icon,
.prsd .banner--info .banner__icon {
  color: var(--color-primary-600);
}
.prsd-banner--warning,
.prsd .banner--warning {
  background-color: var(--banner-bg-warning);
  border-color: var(--banner-border-warning);
}
.prsd-banner--warning .prsd-banner__icon, .prsd-banner--warning .banner__icon,
.prsd .banner--warning .prsd-banner__icon,
.prsd .banner--warning .banner__icon {
  color: var(--color-warning-600);
}
.prsd-banner--error,
.prsd .banner--error {
  background-color: var(--banner-bg-error);
  border-color: var(--banner-border-error);
}
.prsd-banner--error .prsd-banner__icon, .prsd-banner--error .banner__icon,
.prsd .banner--error .prsd-banner__icon,
.prsd .banner--error .banner__icon {
  color: var(--color-error-600);
}
.prsd-banner--success,
.prsd .banner--success {
  background-color: var(--banner-bg-success);
  border-color: var(--banner-border-success);
}
.prsd-banner--success .prsd-banner__icon, .prsd-banner--success .banner__icon,
.prsd .banner--success .prsd-banner__icon,
.prsd .banner--success .banner__icon {
  color: var(--color-success-600);
}
.prsd-banner__icon,
.prsd .banner__icon {
  flex-shrink: 0;
}
.prsd-banner__icon .material-symbols-outlined,
.prsd .banner__icon .material-symbols-outlined {
  font-size: var(--banner-icon-size);
}
.prsd-banner__content,
.prsd .banner__content {
  flex: 1;
  font-size: var(--font-size-body);
  line-height: var(--line-height-body);
}
.prsd-banner__close,
.prsd .banner__close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--banner-close-hit-area);
  height: var(--banner-close-hit-area);
  border: none;
  background: transparent;
  cursor: pointer;
  color: var(--color-neutral-600);
  border-radius: var(--radius-sm);
  transition: background-color var(--transition);
  flex-shrink: 0;
  margin: calc(-1 * var(--spacing-sm)) calc(-1 * var(--spacing-sm)) calc(-1 * var(--spacing-sm)) 0;
}
.prsd-banner__close:hover,
.prsd .banner__close:hover {
  background-color: rgba(0, 0, 0, 0.05);
}
.prsd-banner__close .material-symbols-outlined,
.prsd .banner__close .material-symbols-outlined {
  font-size: var(--banner-close-size);
}
.prsd-banner__action,
.prsd .banner__action {
  margin-left: var(--banner-action-gap);
}

.prsd-toast,
.prsd .toast {
  display: flex;
  align-items: center;
  gap: var(--toast-gap);
  max-width: var(--toast-max-width);
  min-height: var(--toast-min-height);
  padding: var(--spacing-md) var(--toast-padding-x);
  background-color: var(--toast-bg);
  border: var(--toast-border-width) solid var(--toast-border-color);
  border-radius: var(--toast-radius);
  box-shadow: var(--toast-shadow);
  color: var(--toast-text);
}
.prsd-toast__icon,
.prsd .toast__icon {
  flex-shrink: 0;
}
.prsd-toast__icon .material-symbols-outlined,
.prsd .toast__icon .material-symbols-outlined {
  font-size: var(--toast-icon-size);
}
.prsd-toast--info .prsd-toast__icon, .prsd-toast--info .toast__icon,
.prsd .toast--info .prsd-toast__icon,
.prsd .toast--info .toast__icon {
  color: var(--color-primary-600);
}
.prsd-toast--warning .prsd-toast__icon, .prsd-toast--warning .toast__icon,
.prsd .toast--warning .prsd-toast__icon,
.prsd .toast--warning .toast__icon {
  color: var(--color-warning-600);
}
.prsd-toast--error .prsd-toast__icon, .prsd-toast--error .toast__icon,
.prsd .toast--error .prsd-toast__icon,
.prsd .toast--error .toast__icon {
  color: var(--color-error-600);
}
.prsd-toast--success .prsd-toast__icon, .prsd-toast--success .toast__icon,
.prsd .toast--success .prsd-toast__icon,
.prsd .toast--success .toast__icon {
  color: var(--color-success-600);
}
.prsd-toast__content,
.prsd .toast__content {
  flex: 1;
  font-size: var(--font-size-body);
  line-height: var(--line-height-body);
}
.prsd-toast__close,
.prsd .toast__close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--toast-close-hit-area);
  height: var(--toast-close-hit-area);
  border: none;
  background: transparent;
  cursor: pointer;
  color: var(--color-neutral-500);
  border-radius: var(--radius-sm);
  transition: background-color var(--transition);
  flex-shrink: 0;
  margin: calc(-1 * var(--spacing-sm)) calc(-1 * var(--spacing-sm)) calc(-1 * var(--spacing-sm)) 0;
}
.prsd-toast__close:hover,
.prsd .toast__close:hover {
  background-color: var(--color-neutral-100);
}
.prsd-toast__close .material-symbols-outlined,
.prsd .toast__close .material-symbols-outlined {
  font-size: var(--toast-close-size);
}
.prsd-toast__action,
.prsd .toast__action {
  padding: var(--spacing-xs) var(--spacing-sm);
  background-color: transparent;
  border: none;
  font-family: var(--font-family-primary);
  font-size: var(--font-size-body-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-primary-600);
  cursor: pointer;
  border-radius: var(--radius-sm);
  transition: background-color var(--transition);
}
.prsd-toast__action:hover,
.prsd .toast__action:hover {
  background-color: var(--color-neutral-100);
}
.prsd-toast__message,
.prsd .toast__message {
  flex: 1;
  font-size: var(--font-size-body);
  line-height: var(--line-height-body);
}

.prsd-empty-state,
.prsd .empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: var(--empty-padding);
  gap: var(--empty-gap);
  background-color: var(--empty-surface-bg);
  border: 1px solid var(--empty-surface-border);
  border-radius: var(--empty-surface-radius);
}
.prsd-empty-state__icon,
.prsd .empty-state__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--empty-icon-color);
}
.prsd-empty-state__icon .material-symbols-outlined,
.prsd .empty-state__icon .material-symbols-outlined {
  font-size: 48px;
}
.prsd-empty-state__title,
.prsd .empty-state__title {
  font-size: var(--font-size-body);
  font-weight: var(--font-weight-semibold);
  color: var(--empty-title-color);
  margin: 0;
}
.prsd-empty-state__text,
.prsd .empty-state__text {
  font-size: var(--font-size-body-sm);
  color: var(--empty-text-color);
  margin: 0;
  max-width: 320px;
}
.prsd-empty-state__action,
.prsd .empty-state__action {
  margin-top: var(--spacing-sm);
}
.prsd-empty-state--inline,
.prsd .empty-state--inline {
  background-color: transparent;
  border: none;
  padding: var(--spacing-xl) var(--empty-padding);
}

.prsd-loading-overlay,
.prsd .loading-overlay {
  position: absolute;
  inset: 0;
  background-color: var(--loading-overlay-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10;
}

.prsd-skeleton,
.prsd .skeleton {
  background: linear-gradient(90deg, var(--skeleton-bg) 0%, var(--skeleton-highlight) 50%, var(--skeleton-bg) 100%);
  background-size: 200% 100%;
  animation: skeleton-shimmer 1.5s ease-in-out infinite;
  border-radius: var(--skeleton-radius);
}

@keyframes skeleton-shimmer {
  0% {
    background-position: 200% 0;
  }
  100% {
    background-position: -200% 0;
  }
}
.prsd-skeleton-text,
.prsd .skeleton-text {
  height: var(--skeleton-row-height);
  border-radius: var(--radius-sm);
}
.prsd-skeleton-text--sm,
.prsd .skeleton-text--sm {
  width: 40%;
}
.prsd-skeleton-text--md,
.prsd .skeleton-text--md {
  width: 60%;
}
.prsd-skeleton-text--lg,
.prsd .skeleton-text--lg {
  width: 80%;
}
.prsd-skeleton-text--full,
.prsd .skeleton-text--full {
  width: 100%;
}

.prsd-skeleton-avatar,
.prsd .skeleton-avatar {
  width: 40px;
  height: 40px;
  border-radius: var(--radius-full);
  flex-shrink: 0;
}
.prsd-skeleton-avatar--sm,
.prsd .skeleton-avatar--sm {
  width: 32px;
  height: 32px;
}
.prsd-skeleton-avatar--lg,
.prsd .skeleton-avatar--lg {
  width: 48px;
  height: 48px;
}

.prsd-skeleton-button,
.prsd .skeleton-button {
  height: 40px;
  width: 100px;
  border-radius: var(--radius-md);
}

.prsd-skeleton-row,
.prsd .skeleton-row {
  display: flex;
  align-items: center;
  gap: var(--spacing-md);
  padding: var(--spacing-md);
  border-bottom: 1px solid var(--color-neutral-200);
}
.prsd-skeleton-row:last-child,
.prsd .skeleton-row:last-child {
  border-bottom: none;
}
.prsd-skeleton-row__content,
.prsd .skeleton-row__content {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: var(--skeleton-row-gap);
}

.prsd-skeleton-card,
.prsd .skeleton-card {
  padding: var(--spacing-lg);
  background-color: var(--color-neutral-50);
  border: 1px solid var(--color-neutral-200);
  border-radius: var(--radius-md);
}
.prsd-skeleton-card__media,
.prsd .skeleton-card__media {
  height: 120px;
  margin-bottom: var(--spacing-md);
  border-radius: var(--radius-sm);
}

.prsd-spinner,
.prsd .spinner {
  width: var(--spinner-size-md);
  height: var(--spinner-size-md);
  border: 2px solid var(--color-neutral-200);
  border-top-color: var(--spinner-color);
  border-radius: 50%;
  animation: spinner-rotate 0.8s linear infinite;
}
.prsd-spinner--sm,
.prsd .spinner--sm {
  width: var(--spinner-size-sm);
  height: var(--spinner-size-sm);
}
.prsd-spinner--lg,
.prsd .spinner--lg {
  width: var(--spinner-size-lg);
  height: var(--spinner-size-lg);
}
.prsd-spinner--primary,
.prsd .spinner--primary {
  border-top-color: var(--color-primary-600);
}
.prsd-spinner--white,
.prsd .spinner--white {
  border-color: rgba(255, 255, 255, 0.3);
  border-top-color: white;
}

@keyframes spinner-rotate {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.prsd-loading-text,
.prsd .loading-text {
  font-size: var(--font-size-body-sm);
  color: var(--color-neutral-500);
  margin-top: var(--spacing-sm);
}

.prsd-container,
.prsd .container {
  width: 100%;
  max-width: var(--grid-max-width-desktop);
  margin: 0 auto;
  padding: 0 var(--grid-margin-desktop);
}
@media (max-width: 1023px) {
  .prsd-container,
  .prsd .container {
    padding: 0 var(--grid-margin-tablet);
  }
}
@media (max-width: 767px) {
  .prsd-container,
  .prsd .container {
    padding: 0 var(--grid-margin-mobile);
  }
}

.prsd-grid,
.prsd .grid {
  display: grid;
  gap: var(--grid-gutter-desktop);
}
@media (max-width: 1023px) {
  .prsd-grid,
  .prsd .grid {
    gap: var(--grid-gutter-tablet);
  }
}
@media (max-width: 767px) {
  .prsd-grid,
  .prsd .grid {
    gap: var(--grid-gutter-mobile);
  }
}

.prsd-grid-cols-2, .prsd .grid-cols-2 {
  grid-template-columns: repeat(2, 1fr);
}

.prsd-grid-cols-3, .prsd .grid-cols-3 {
  grid-template-columns: repeat(3, 1fr);
}

.prsd-grid-cols-4, .prsd .grid-cols-4 {
  grid-template-columns: repeat(4, 1fr);
}

.prsd-grid-cols-12, .prsd .grid-cols-12 {
  grid-template-columns: repeat(12, 1fr);
}

@media (max-width: 1023px) {
  .prsd-grid-cols-4,
  .prsd .grid-cols-4 {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 767px) {
  .prsd-grid-cols-2,
  .prsd .grid-cols-2,
  .prsd-grid-cols-3,
  .prsd .grid-cols-3,
  .prsd-grid-cols-4,
  .prsd .grid-cols-4 {
    grid-template-columns: 1fr;
  }
}
.prsd-section,
.prsd .section {
  background-color: white;
  border: 1px solid var(--color-neutral-200);
  border-radius: var(--radius-md);
  padding: var(--spacing-lg);
  margin-bottom: var(--spacing-lg);
  scroll-margin-top: 80px;
}
.prsd-section h3,
.prsd .section h3 {
  color: var(--color-text-title);
  font-size: var(--font-size-h3);
  font-weight: var(--font-weight-semibold);
}

.prsd-flex, .prsd .flex {
  display: flex;
}

.prsd-inline-flex, .prsd .inline-flex {
  display: inline-flex;
}

.prsd-block, .prsd .block {
  display: block;
}

.prsd-inline-block, .prsd .inline-block {
  display: inline-block;
}

.prsd-hidden, .prsd .hidden {
  display: none;
}

.prsd-flex-col, .prsd .flex-col {
  flex-direction: column;
}

.prsd-flex-row, .prsd .flex-row {
  flex-direction: row;
}

.prsd-items-start, .prsd .items-start {
  align-items: flex-start;
}

.prsd-items-center, .prsd .items-center {
  align-items: center;
}

.prsd-items-end, .prsd .items-end {
  align-items: flex-end;
}

.prsd-justify-start, .prsd .justify-start {
  justify-content: flex-start;
}

.prsd-justify-center, .prsd .justify-center {
  justify-content: center;
}

.prsd-justify-end, .prsd .justify-end {
  justify-content: flex-end;
}

.prsd-justify-between, .prsd .justify-between {
  justify-content: space-between;
}

.prsd-flex-wrap, .prsd .flex-wrap {
  flex-wrap: wrap;
}

.prsd-gap-xs, .prsd .gap-xs {
  gap: var(--spacing-xs);
}

.prsd-gap-sm, .prsd .gap-sm {
  gap: var(--spacing-sm);
}

.prsd-gap-md, .prsd .gap-md {
  gap: var(--spacing-md);
}

.prsd-gap-lg, .prsd .gap-lg {
  gap: var(--spacing-lg);
}

.prsd-gap-xl, .prsd .gap-xl {
  gap: var(--spacing-xl);
}

.prsd-mt-xs, .prsd .mt-xs {
  margin-top: var(--spacing-xs);
}

.prsd-mt-sm, .prsd .mt-sm {
  margin-top: var(--spacing-sm);
}

.prsd-mt-md, .prsd .mt-md {
  margin-top: var(--spacing-md);
}

.prsd-mt-lg, .prsd .mt-lg {
  margin-top: var(--spacing-lg);
}

.prsd-mt-xl, .prsd .mt-xl {
  margin-top: var(--spacing-xl);
}

.prsd-mb-xs, .prsd .mb-xs {
  margin-bottom: var(--spacing-xs);
}

.prsd-mb-sm, .prsd .mb-sm {
  margin-bottom: var(--spacing-sm);
}

.prsd-mb-md, .prsd .mb-md {
  margin-bottom: var(--spacing-md);
}

.prsd-mb-lg, .prsd .mb-lg {
  margin-bottom: var(--spacing-lg);
}

.prsd-mb-xl, .prsd .mb-xl {
  margin-bottom: var(--spacing-xl);
}

.prsd-p-xs, .prsd .p-xs {
  padding: var(--spacing-xs);
}

.prsd-p-sm, .prsd .p-sm {
  padding: var(--spacing-sm);
}

.prsd-p-md, .prsd .p-md {
  padding: var(--spacing-md);
}

.prsd-p-lg, .prsd .p-lg {
  padding: var(--spacing-lg);
}

.prsd-p-xl, .prsd .p-xl {
  padding: var(--spacing-xl);
}

.prsd-w-full, .prsd .w-full {
  width: 100%;
}