npm - @servicetitan/hammer-token - Versions diffs - 2.5.1 → 3.0.0 - Mend

@servicetitan/hammer-token 2.5.1 → 3.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (147) hide show

package/CHANGELOG.md +50 -0
package/README.md +332 -0
package/build/web/core/component-variables.scss +1088 -131
package/build/web/core/component.d.ts +558 -0
package/build/web/core/component.js +6685 -249
package/build/web/core/component.scss +557 -69
package/build/web/core/css-utils/a2-border.css +47 -45
package/build/web/core/css-utils/a2-color.css +443 -227
package/build/web/core/css-utils/a2-font.css +0 -2
package/build/web/core/css-utils/a2-spacing.css +476 -478
package/build/web/core/css-utils/a2-utils.css +992 -772
package/build/web/core/css-utils/border.css +47 -45
package/build/web/core/css-utils/color.css +443 -227
package/build/web/core/css-utils/font.css +0 -2
package/build/web/core/css-utils/spacing.css +476 -478
package/build/web/core/css-utils/utils.css +992 -772
package/build/web/core/index.d.ts +6 -0
package/build/web/core/index.js +1 -1
package/build/web/core/primitive-variables.scss +148 -65
package/build/web/core/primitive.d.ts +209 -0
package/build/web/core/primitive.js +779 -61
package/build/web/core/primitive.scss +207 -124
package/build/web/core/semantic-variables.scss +363 -245
package/build/web/core/semantic.d.ts +221 -0
package/build/web/core/semantic.js +1592 -347
package/build/web/core/semantic.scss +219 -140
package/build/web/index.d.ts +3 -4
package/build/web/index.js +0 -1
package/build/web/types.d.ts +17 -0
package/config.js +121 -497
package/eslint.config.mjs +11 -1
package/package.json +15 -5
package/src/global/primitive/breakpoint.tokens.json +54 -0
package/src/global/primitive/color.tokens.json +1092 -0
package/src/global/primitive/duration.tokens.json +44 -0
package/src/global/primitive/font.tokens.json +151 -0
package/src/global/primitive/radius.tokens.json +94 -0
package/src/global/primitive/size.tokens.json +174 -0
package/src/global/primitive/transition.tokens.json +32 -0
package/src/theme/core/background.tokens.json +1312 -0
package/src/theme/core/border.tokens.json +192 -0
package/src/theme/core/chart.tokens.json +982 -0
package/src/theme/core/component/ai-mark.tokens.json +20 -0
package/src/theme/core/component/alert.tokens.json +261 -0
package/src/theme/core/component/announcement.tokens.json +460 -0
package/src/theme/core/component/avatar.tokens.json +137 -0
package/src/theme/core/component/badge.tokens.json +42 -0
package/src/theme/core/component/breadcrumb.tokens.json +42 -0
package/src/theme/core/component/button-toggle.tokens.json +428 -0
package/src/theme/core/component/button.tokens.json +941 -0
package/src/theme/core/component/calendar.tokens.json +391 -0
package/src/theme/core/component/card.tokens.json +107 -0
package/src/theme/core/component/checkbox.tokens.json +631 -0
package/src/theme/core/component/chip.tokens.json +169 -0
package/src/theme/core/component/combobox.tokens.json +269 -0
package/src/theme/core/component/details.tokens.json +152 -0
package/src/theme/core/component/dialog.tokens.json +87 -0
package/src/theme/core/component/divider.tokens.json +23 -0
package/src/theme/core/component/dnd.tokens.json +208 -0
package/src/theme/core/component/drawer.tokens.json +61 -0
package/src/theme/core/component/drilldown.tokens.json +61 -0
package/src/theme/core/component/edit-card.tokens.json +381 -0
package/src/theme/core/component/field-label.tokens.json +42 -0
package/src/theme/core/component/field-message.tokens.json +74 -0
package/src/theme/core/component/icon.tokens.json +42 -0
package/src/theme/core/component/link.tokens.json +108 -0
package/src/theme/core/component/list-view.tokens.json +82 -0
package/src/theme/core/component/listbox.tokens.json +283 -0
package/src/theme/core/component/menu.tokens.json +230 -0
package/src/theme/core/component/overflow.tokens.json +84 -0
package/src/theme/core/component/page.tokens.json +377 -0
package/src/theme/core/component/pagination.tokens.json +63 -0
package/src/theme/core/component/popover.tokens.json +122 -0
package/src/theme/core/component/progress-bar.tokens.json +133 -0
package/src/theme/core/component/radio.tokens.json +631 -0
package/src/theme/core/component/segmented-control.tokens.json +175 -0
package/src/theme/core/component/select-card.tokens.json +943 -0
package/src/theme/core/component/side-nav.tokens.json +349 -0
package/src/theme/core/component/skeleton.tokens.json +42 -0
package/src/theme/core/component/spinner.tokens.json +96 -0
package/src/theme/core/component/status-icon.tokens.json +164 -0
package/src/theme/core/component/stepper.tokens.json +484 -0
package/src/theme/core/component/switch.tokens.json +285 -0
package/src/theme/core/component/tab.tokens.json +192 -0
package/src/theme/core/component/text-field.tokens.json +160 -0
package/src/theme/core/component/text.tokens.json +59 -0
package/src/theme/core/component/toast.tokens.json +343 -0
package/src/theme/core/component/toolbar.tokens.json +114 -0
package/src/theme/core/component/tooltip.tokens.json +61 -0
package/src/theme/core/focus.tokens.json +56 -0
package/src/theme/core/foreground.tokens.json +416 -0
package/src/theme/core/gradient.tokens.json +41 -0
package/src/theme/core/opacity.tokens.json +25 -0
package/src/theme/core/shadow.tokens.json +81 -0
package/src/theme/core/status.tokens.json +74 -0
package/src/theme/core/typography.tokens.json +163 -0
package/src/utils/__tests__/css-utils-format-utils.test.js +312 -0
package/src/utils/__tests__/sd-build-configs.test.js +306 -0
package/src/utils/__tests__/sd-formats.test.js +950 -0
package/src/utils/__tests__/sd-transforms.test.js +336 -0
package/src/utils/__tests__/token-helpers.test.js +1160 -0
package/src/utils/copy-css-utils-cli.js +13 -1
package/src/utils/css-utils-format-utils.js +105 -176
package/src/utils/figma/__tests__/sync-gradient.test.js +561 -0
package/src/utils/figma/__tests__/token-conversion.test.js +117 -0
package/src/utils/figma/__tests__/token-resolution.test.js +231 -0
package/src/utils/figma/auth.js +355 -0
package/src/utils/figma/constants.js +22 -0
package/src/utils/figma/errors.js +80 -0
package/src/utils/figma/figma-api.js +1069 -0
package/src/utils/figma/get-token.js +348 -0
package/src/utils/figma/sync-components.js +909 -0
package/src/utils/figma/sync-main.js +692 -0
package/src/utils/figma/sync-orchestration.js +683 -0
package/src/utils/figma/sync-primitives.js +230 -0
package/src/utils/figma/sync-semantic.js +1056 -0
package/src/utils/figma/token-conversion.js +340 -0
package/src/utils/figma/token-parsing.js +186 -0
package/src/utils/figma/token-resolution.js +569 -0
package/src/utils/figma/utils.js +199 -0
package/src/utils/sd-build-configs.js +305 -0
package/src/utils/sd-formats.js +965 -0
package/src/utils/sd-transforms.js +165 -0
package/src/utils/token-helpers.js +848 -0
package/tsconfig.json +18 -0
package/vitest.config.js +17 -0
package/.turbo/turbo-build.log +0 -37
package/build/web/core/raw.js +0 -234
package/src/global/primitive/breakpoint.js +0 -19
package/src/global/primitive/color.js +0 -231
package/src/global/primitive/duration.js +0 -16
package/src/global/primitive/font.js +0 -60
package/src/global/primitive/radius.js +0 -31
package/src/global/primitive/size.js +0 -55
package/src/global/primitive/transition.js +0 -16
package/src/theme/core/background.js +0 -170
package/src/theme/core/border.js +0 -103
package/src/theme/core/charts.js +0 -464
package/src/theme/core/component/button.js +0 -708
package/src/theme/core/component/checkbox.js +0 -405
package/src/theme/core/focus.js +0 -35
package/src/theme/core/foreground.js +0 -148
package/src/theme/core/overlay.js +0 -137
package/src/theme/core/shadow.js +0 -29
package/src/theme/core/status.js +0 -49
package/src/theme/core/typography.js +0 -82
package/type/types.ts +0 -344

package/build/web/core/component.scss CHANGED Viewed

@@ -1,69 +1,557 @@
-$button-primary-foreground-color: var(--button-primary-foreground-color, #ffffff);
-$button-primary-foreground-color-hover: var(--button-primary-foreground-color-hover, #ffffff);
-$button-primary-foreground-color-active: var(--button-primary-foreground-color-active, #ffffff);
-$button-primary-background-color: var(--button-primary-background-color, #0265DC);
-$button-primary-background-color-hover: var(--button-primary-background-color-hover, #0655b4ff);
-$button-primary-background-color-active: var(--button-primary-background-color-active, #09458cff);
-$button-primary-border-color: var(--button-primary-border-color, transparent);
-$button-primary-border-radius: 0.375rem;
-$button-primary-focus-ring-color: var(--button-primary-focus-ring-color, #0265DC);
-$button-secondary-foreground-color: var(--button-secondary-foreground-color, #141414);
-$button-secondary-foreground-color-hover: var(--button-secondary-foreground-color-hover, #141414);
-$button-secondary-foreground-color-active: var(--button-secondary-foreground-color-active, #141414);
-$button-secondary-background-color: var(--button-secondary-background-color, #0404040f);
-$button-secondary-background-color-hover: var(--button-secondary-background-color-hover, #05050522);
-$button-secondary-background-color-active: var(--button-secondary-background-color-active, #07070735);
-$button-secondary-border-color: var(--button-secondary-border-color, transparent);
-$button-secondary-border-radius: 0.375rem;
-$button-secondary-focus-ring-color: var(--button-secondary-focus-ring-color, #0265DC);
-$button-ghost-foreground-color: var(--button-ghost-foreground-color, #141414);
-$button-ghost-foreground-color-hover: var(--button-ghost-foreground-color-hover, #141414);
-$button-ghost-foreground-color-active: var(--button-ghost-foreground-color-active, #141414);
-$button-ghost-background-color: var(--button-ghost-background-color, transparent);
-$button-ghost-background-color-hover: var(--button-ghost-background-color-hover, #14141414);
-$button-ghost-background-color-active: var(--button-ghost-background-color-active, #14141429);
-$button-ghost-border-color: var(--button-ghost-border-color, transparent);
-$button-ghost-border-radius: 0.375rem;
-$button-ghost-focus-ring-color: var(--button-ghost-focus-ring-color, #0265DC);
-$button-danger-primary-foreground-color: var(--button-danger-primary-foreground-color, #ffffff);
-$button-danger-primary-foreground-color-hover: var(--button-danger-primary-foreground-color-hover, #ffffff);
-$button-danger-primary-foreground-color-active: var(--button-danger-primary-foreground-color-active, #ffffff);
-$button-danger-primary-background-color: var(--button-danger-primary-background-color, #e13212);
-$button-danger-primary-background-color-hover: var(--button-danger-primary-background-color-hover, #b82c12ff);
-$button-danger-primary-background-color-active: var(--button-danger-primary-background-color-active, #8f2613ff);
-$button-danger-primary-border-color: var(--button-danger-primary-border-color, transparent);
-$button-danger-primary-border-radius: 0.375rem;
-$button-danger-primary-focus-ring-color: var(--button-danger-primary-focus-ring-color, #e13212);
-$button-danger-secondary-foreground-color: var(--button-danger-secondary-foreground-color, #bf2a00);
-$button-danger-secondary-foreground-color-hover: var(--button-danger-secondary-foreground-color-hover, #bf2a00);
-$button-danger-secondary-foreground-color-active: var(--button-danger-secondary-foreground-color-active, #bf2a00);
-$button-danger-secondary-background-color: var(--button-danger-secondary-background-color, #ffece9);
-$button-danger-secondary-background-color-hover: var(--button-danger-secondary-background-color-hover, #fcd9d4ff);
-$button-danger-secondary-background-color-active: var(--button-danger-secondary-background-color-active, #f6b4a9ff);
-$button-danger-secondary-border-color: var(--button-danger-secondary-border-color, transparent);
-$button-danger-secondary-border-radius: 0.375rem;
-$button-danger-secondary-focus-ring-color: var(--button-danger-secondary-focus-ring-color, #e13212);
-$checkbox-unchecked-fill-color-default: var(--checkbox-unchecked-fill-color-default, #141414);
-$checkbox-unchecked-fill-color-hover: var(--checkbox-unchecked-fill-color-hover, #141414);
-$checkbox-unchecked-fill-color-active: var(--checkbox-unchecked-fill-color-active, #141414);
-$checkbox-unchecked-background-color-default: var(--checkbox-unchecked-background-color-default, transparent);
-$checkbox-unchecked-background-color-hover: var(--checkbox-unchecked-background-color-hover, #14141414);
-$checkbox-unchecked-background-color-active: var(--checkbox-unchecked-background-color-active, #14141429);
-$checkbox-checked-fill-color-default: var(--checkbox-checked-fill-color-default, #0265DC);
-$checkbox-checked-fill-color-hover: var(--checkbox-checked-fill-color-hover, #004ba0d1);
-$checkbox-checked-fill-color-active: var(--checkbox-checked-fill-color-active, #0151afb8);
-$checkbox-checked-background-color-default: var(--checkbox-checked-background-color-default, transparent);
-$checkbox-checked-background-color-hover: var(--checkbox-checked-background-color-hover, #0265dc14);
-$checkbox-checked-background-color-active: var(--checkbox-checked-background-color-active, #0265dc29);
-$checkbox-unchecked-error-fill-color-default: var(--checkbox-unchecked-error-fill-color-default, #e13212);
-$checkbox-unchecked-error-fill-color-hover: var(--checkbox-unchecked-error-fill-color-hover, #bf2a00);
-$checkbox-unchecked-error-fill-color-active: var(--checkbox-unchecked-error-fill-color-active, #bf2a00);
-$checkbox-unchecked-error-background-color-default: var(--checkbox-unchecked-error-background-color-default, transparent);
-$checkbox-unchecked-error-background-color-hover: var(--checkbox-unchecked-error-background-color-hover, #e132120f);
-$checkbox-unchecked-error-background-color-active: var(--checkbox-unchecked-error-background-color-active, #e132122e);
-$checkbox-checked-error-fill-color-default: var(--checkbox-checked-error-fill-color-default, #e13212);
-$checkbox-checked-error-fill-color-hover: var(--checkbox-checked-error-fill-color-hover, #bf2a00);
-$checkbox-checked-error-fill-color-active: var(--checkbox-checked-error-fill-color-active, #bf2a00);
-$checkbox-checked-error-background-color-default: var(--checkbox-checked-error-background-color-default, transparent);
-$checkbox-checked-error-background-color-hover: var(--checkbox-checked-error-background-color-hover, #e132120f);
-$checkbox-checked-error-background-color-active: var(--checkbox-checked-error-background-color-active, #e132122e);
+// Background gradient for the primary AI mark component.
+$ai-mark-primary-background-gradient: var(--a2-ai-mark-primary-background-gradient, light-dark(linear-gradient(90deg, var(--a2-color-blue-600, #0265dc) 0%, var(--a2-color-cyan-300, #45d8f2) 100%), linear-gradient(90deg, var(--a2-color-cyan-300, #45d8f2) 0%, var(--a2-color-cyan-50, #daf7fc) 100%)));
+$alert-info-foreground-color: var(--a2-alert-info-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$alert-info-background-color: var(--a2-alert-info-background-color, var(--a2-background-color-primary-faint, light-dark(var(--a2-color-blue-10, #fafcff), var(--a2-color-blue-950, #000b19))));
+$alert-info-border-color: var(--a2-alert-info-border-color, var(--a2-border-color-primary, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-200, #9ecaff))));
+$alert-success-foreground-color: var(--a2-alert-success-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$alert-success-background-color: var(--a2-alert-success-background-color, var(--a2-background-color-success-faint, light-dark(var(--a2-color-green-10, #f5fefb), var(--a2-color-green-950, #010f0a))));
+$alert-success-border-color: var(--a2-alert-success-border-color, var(--a2-border-color-success, light-dark(var(--a2-color-green-600, #077e50), var(--a2-color-green-200, #70ebbc))));
+$alert-warning-foreground-color: var(--a2-alert-warning-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$alert-warning-background-color: var(--a2-alert-warning-background-color, var(--a2-background-color-warning-faint, light-dark(var(--a2-color-yellow-10, #fffef8), var(--a2-color-yellow-950, #191100))));
+$alert-warning-border-color: var(--a2-alert-warning-border-color, var(--a2-border-color-warning, light-dark(var(--a2-color-yellow-700, #c98600), var(--a2-color-yellow-200, #fff0b1))));
+$alert-danger-foreground-color: var(--a2-alert-danger-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$alert-danger-background-color: var(--a2-alert-danger-background-color, var(--a2-background-color-danger-faint, light-dark(var(--a2-color-red-10, #fffbfa), var(--a2-color-red-950, #0a0200))));
+$alert-danger-border-color: var(--a2-alert-danger-border-color, var(--a2-border-color-danger, light-dark(var(--a2-color-red-600, #d62100), var(--a2-color-red-200, #ffac9e))));
+$alert-close-button-foreground-color: var(--a2-alert-close-button-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$announcement-info-background-color: var(--a2-announcement-info-background-color, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff))));
+$announcement-info-foreground-color: var(--a2-announcement-info-foreground-color, var(--a2-foreground-color-on-primary, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$announcement-info-action-button-background-color: var(--a2-announcement-info-action-button-background-color, var(--a2-background-color-secondary-strong, light-dark(#04040426, #ffffff8C)));
+$announcement-info-action-button-background-color-hover: var(--a2-announcement-info-action-button-background-color-hover, var(--a2-background-color-secondary-strong-hover, light-dark(#04040440, #ffffffA6)));
+$announcement-info-action-button-background-color-active: var(--a2-announcement-info-action-button-background-color-active, var(--a2-background-color-secondary-strong-active, light-dark(#0404044D, #ffffffBF)));
+$announcement-info-action-button-focus-ring-color: var(--a2-announcement-info-action-button-focus-ring-color, var(--a2-foreground-color-on-primary, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$announcement-success-background-color: var(--a2-announcement-success-background-color, var(--a2-status-color-success, light-dark(var(--a2-color-green-600, #077e50), var(--a2-color-green-400, #0bd085))));
+$announcement-success-foreground-color: var(--a2-announcement-success-foreground-color, var(--a2-foreground-color-on-success, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$announcement-success-action-button-background-color: var(--a2-announcement-success-action-button-background-color, var(--a2-background-color-secondary-strong, light-dark(#04040426, #ffffff8C)));
+$announcement-success-action-button-background-color-hover: var(--a2-announcement-success-action-button-background-color-hover, var(--a2-background-color-secondary-strong-hover, light-dark(#04040440, #ffffffA6)));
+$announcement-success-action-button-background-color-active: var(--a2-announcement-success-action-button-background-color-active, var(--a2-background-color-secondary-strong-active, light-dark(#0404044D, #ffffffBF)));
+$announcement-success-action-button-focus-ring-color: var(--a2-announcement-success-action-button-focus-ring-color, var(--a2-foreground-color-on-success, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$announcement-warning-background-color: var(--a2-announcement-warning-background-color, var(--a2-status-color-warning, light-dark(var(--a2-color-yellow-500, #ffbe00), var(--a2-color-yellow-300, #ffe278))));
+$announcement-warning-foreground-color: var(--a2-announcement-warning-foreground-color, var(--a2-foreground-color-on-warning, var(--a2-color-neutral-900, #1a1a1a)));
+$announcement-warning-action-button-background-color: var(--a2-announcement-warning-action-button-background-color, var(--a2-background-color-secondary-strong, light-dark(#04040426, #ffffff8C)));
+$announcement-warning-action-button-background-color-hover: var(--a2-announcement-warning-action-button-background-color-hover, var(--a2-background-color-secondary-strong-hover, light-dark(#04040440, #ffffffA6)));
+$announcement-warning-action-button-background-color-active: var(--a2-announcement-warning-action-button-background-color-active, var(--a2-background-color-secondary-strong-active, light-dark(#0404044D, #ffffffBF)));
+$announcement-warning-action-button-focus-ring-color: var(--a2-announcement-warning-action-button-focus-ring-color, var(--a2-foreground-color-on-warning, var(--a2-color-neutral-900, #1a1a1a)));
+$announcement-danger-background-color: var(--a2-announcement-danger-background-color, var(--a2-status-color-danger, light-dark(var(--a2-color-red-600, #d62100), var(--a2-color-red-400, #ff5b3d))));
+$announcement-danger-foreground-color: var(--a2-announcement-danger-foreground-color, var(--a2-foreground-color-on-danger, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$announcement-danger-action-button-background-color: var(--a2-announcement-danger-action-button-background-color, var(--a2-background-color-secondary-strong, light-dark(#04040426, #ffffff8C)));
+$announcement-danger-action-button-background-color-hover: var(--a2-announcement-danger-action-button-background-color-hover, var(--a2-background-color-secondary-strong-hover, light-dark(#04040440, #ffffffA6)));
+$announcement-danger-action-button-background-color-active: var(--a2-announcement-danger-action-button-background-color-active, var(--a2-background-color-secondary-strong-active, light-dark(#0404044D, #ffffffBF)));
+$announcement-danger-action-button-focus-ring-color: var(--a2-announcement-danger-action-button-focus-ring-color, var(--a2-foreground-color-on-danger, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$avatar-background-color: var(--a2-avatar-background-color, var(--a2-background-color-stronger, light-dark(var(--a2-color-neutral-50, #eeeeee), var(--a2-color-neutral-700, #404040))));
+$avatar-foreground-color: var(--a2-avatar-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$avatar-border-color: var(--a2-avatar-border-color, var(--a2-background-color-default, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$avatar-indicator-background-color-default: var(--a2-avatar-indicator-background-color-default, var(--a2-background-color-default, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$avatar-indicator-background-color-online: var(--a2-avatar-indicator-background-color-online, var(--a2-status-color-success, light-dark(var(--a2-color-green-600, #077e50), var(--a2-color-green-400, #0bd085))));
+$avatar-indicator-background-color-offline: var(--a2-avatar-indicator-background-color-offline, var(--a2-background-color-disabled, light-dark(var(--a2-color-neutral-600, #545454), var(--a2-color-neutral-500, #707070))));
+$avatar-indicator-border-color: var(--a2-avatar-indicator-border-color, var(--a2-border-color-default, light-dark(var(--a2-color-neutral-400, #8b8b8b), var(--a2-color-neutral-600, #545454))));
+$badge-background-color: var(--a2-badge-background-color, var(--a2-background-color-danger, var(--a2-status-color-danger, light-dark(var(--a2-color-red-600, #d62100), var(--a2-color-red-400, #ff5b3d)))));
+$badge-foreground-color: var(--a2-badge-foreground-color, var(--a2-foreground-color-on-danger, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$breadcrumb-link-foreground-color: var(--a2-breadcrumb-link-foreground-color, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
+$breadcrumb-link-foreground-color-hover: var(--a2-breadcrumb-link-foreground-color-hover, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$button-toggle-unpressed-background-color: var(--a2-button-toggle-unpressed-background-color, var(--a2-background-color-transparent-default, rgba(0, 0, 0, 0)));
+$button-toggle-unpressed-background-color-hover: var(--a2-button-toggle-unpressed-background-color-hover, var(--a2-background-color-transparent-default-hover, light-dark(#8b8b8b14, #ffffff14)));
+$button-toggle-unpressed-background-color-active: var(--a2-button-toggle-unpressed-background-color-active, var(--a2-background-color-transparent-default-active, light-dark(#8b8b8b29, #ffffff29)));
+$button-toggle-unpressed-background-color-disabled: var(--a2-button-toggle-unpressed-background-color-disabled, var(--a2-background-color-strong, light-dark(var(--a2-color-neutral-20, #f9f9f9), var(--a2-color-neutral-800, #292929))));
+$button-toggle-unpressed-foreground-color: var(--a2-button-toggle-unpressed-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$button-toggle-unpressed-foreground-color-hover: var(--a2-button-toggle-unpressed-foreground-color-hover, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$button-toggle-unpressed-foreground-color-active: var(--a2-button-toggle-unpressed-foreground-color-active, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$button-toggle-unpressed-foreground-color-disabled: var(--a2-button-toggle-unpressed-foreground-color-disabled, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
+$button-toggle-unpressed-border-color: var(--a2-button-toggle-unpressed-border-color, var(--a2-border-color-default, light-dark(var(--a2-color-neutral-400, #8b8b8b), var(--a2-color-neutral-600, #545454))));
+$button-toggle-unpressed-border-color-hover: var(--a2-button-toggle-unpressed-border-color-hover, var(--a2-border-color-default, light-dark(var(--a2-color-neutral-400, #8b8b8b), var(--a2-color-neutral-600, #545454))));
+$button-toggle-unpressed-border-color-active: var(--a2-button-toggle-unpressed-border-color-active, var(--a2-border-color-default, light-dark(var(--a2-color-neutral-400, #8b8b8b), var(--a2-color-neutral-600, #545454))));
+$button-toggle-unpressed-border-color-disabled: var(--a2-button-toggle-unpressed-border-color-disabled, rgba(0, 0, 0, 0));
+$button-toggle-pressed-background-color: var(--a2-button-toggle-pressed-background-color, var(--a2-background-color-primary-subdued, light-dark(var(--a2-color-blue-50, #e6f1ff), #70b1ff33)));
+$button-toggle-pressed-background-color-hover: var(--a2-button-toggle-pressed-background-color-hover, var(--a2-background-color-primary-subdued-hover, light-dark(var(--a2-color-blue-100, #cce3ff), #70b1ff4D)));
+$button-toggle-pressed-background-color-active: var(--a2-button-toggle-pressed-background-color-active, var(--a2-background-color-primary-subdued-active, light-dark(var(--a2-color-blue-200, #9ecaff), #70b1ff66)));
+$button-toggle-pressed-background-color-disabled: var(--a2-button-toggle-pressed-background-color-disabled, var(--a2-background-color-strong, light-dark(var(--a2-color-neutral-20, #f9f9f9), var(--a2-color-neutral-800, #292929))));
+$button-toggle-pressed-foreground-color: var(--a2-button-toggle-pressed-foreground-color, var(--a2-foreground-color-primary, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff))));
+$button-toggle-pressed-foreground-color-hover: var(--a2-button-toggle-pressed-foreground-color-hover, var(--a2-foreground-color-primary-hover, light-dark(var(--a2-color-blue-700, #1d4ca3), var(--a2-color-blue-200, #9ecaff))));
+$button-toggle-pressed-foreground-color-active: var(--a2-button-toggle-pressed-foreground-color-active, var(--a2-foreground-color-primary-active, light-dark(var(--a2-color-blue-800, #003472), var(--a2-color-blue-200, #9ecaff))));
+$button-toggle-pressed-foreground-color-disabled: var(--a2-button-toggle-pressed-foreground-color-disabled, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
+$button-toggle-pressed-border-color: var(--a2-button-toggle-pressed-border-color, var(--a2-foreground-color-primary, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff))));
+$button-toggle-pressed-border-color-hover: var(--a2-button-toggle-pressed-border-color-hover, var(--a2-foreground-color-primary-hover, light-dark(var(--a2-color-blue-700, #1d4ca3), var(--a2-color-blue-200, #9ecaff))));
+$button-toggle-pressed-border-color-active: var(--a2-button-toggle-pressed-border-color-active, var(--a2-foreground-color-primary-active, light-dark(var(--a2-color-blue-800, #003472), var(--a2-color-blue-200, #9ecaff))));
+$button-toggle-pressed-border-color-disabled: var(--a2-button-toggle-pressed-border-color-disabled, rgba(0, 0, 0, 0));
+$button-primary-foreground-color: var(--a2-button-primary-foreground-color, var(--a2-foreground-color-on-primary, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$button-primary-foreground-color-hover: var(--a2-button-primary-foreground-color-hover, var(--a2-foreground-color-on-primary, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$button-primary-foreground-color-active: var(--a2-button-primary-foreground-color-active, var(--a2-foreground-color-on-primary, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$button-primary-foreground-color-disabled: var(--a2-button-primary-foreground-color-disabled, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
+$button-primary-background-color: var(--a2-button-primary-background-color, var(--a2-background-color-primary, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff)))));
+$button-primary-background-color-hover: var(--a2-button-primary-background-color-hover, var(--a2-background-color-primary-hover, light-dark(var(--a2-color-blue-700, #1d4ca3), var(--a2-color-blue-200, #9ecaff))));
+$button-primary-background-color-active: var(--a2-button-primary-background-color-active, var(--a2-background-color-primary-active, light-dark(var(--a2-color-blue-800, #003472), var(--a2-color-blue-100, #cce3ff))));
+$button-primary-background-color-disabled: var(--a2-button-primary-background-color-disabled, var(--a2-background-color-strong, light-dark(var(--a2-color-neutral-20, #f9f9f9), var(--a2-color-neutral-800, #292929))));
+$button-primary-border-color: var(--a2-button-primary-border-color, rgba(0, 0, 0, 0));
+$button-primary-border-radius: var(--a2-button-primary-border-radius, var(--a2-border-radius-medium, var(--a2-radius-2, 0.375rem)));
+$button-primary-focus-ring-color: var(--a2-button-primary-focus-ring-color, var(--a2-focus-ring-color-default, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff)))));
+$button-secondary-foreground-color: var(--a2-button-secondary-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$button-secondary-foreground-color-hover: var(--a2-button-secondary-foreground-color-hover, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$button-secondary-foreground-color-active: var(--a2-button-secondary-foreground-color-active, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$button-secondary-foreground-color-disabled: var(--a2-button-secondary-foreground-color-disabled, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
+$button-secondary-background-color: var(--a2-button-secondary-background-color, var(--a2-background-color-secondary, light-dark(#0404040F, #ffffff14)));
+$button-secondary-background-color-hover: var(--a2-button-secondary-background-color-hover, var(--a2-background-color-secondary-hover, light-dark(#04040414, #ffffff1F)));
+$button-secondary-background-color-active: var(--a2-button-secondary-background-color-active, var(--a2-background-color-secondary-active, light-dark(#04040429, #ffffff29)));
+$button-secondary-background-color-disabled: var(--a2-button-secondary-background-color-disabled, var(--a2-background-color-strong, light-dark(var(--a2-color-neutral-20, #f9f9f9), var(--a2-color-neutral-800, #292929))));
+$button-secondary-border-color: var(--a2-button-secondary-border-color, rgba(0, 0, 0, 0));
+$button-secondary-border-radius: var(--a2-button-secondary-border-radius, var(--a2-border-radius-medium, var(--a2-radius-2, 0.375rem)));
+$button-secondary-focus-ring-color: var(--a2-button-secondary-focus-ring-color, var(--a2-focus-ring-color-default, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff)))));
+$button-ghost-foreground-color: var(--a2-button-ghost-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$button-ghost-foreground-color-hover: var(--a2-button-ghost-foreground-color-hover, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$button-ghost-foreground-color-active: var(--a2-button-ghost-foreground-color-active, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$button-ghost-foreground-color-disabled: var(--a2-button-ghost-foreground-color-disabled, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
+$button-ghost-background-color: var(--a2-button-ghost-background-color, rgba(0, 0, 0, 0));
+$button-ghost-background-color-hover: var(--a2-button-ghost-background-color-hover, var(--a2-background-color-transparent-default-hover, light-dark(#8b8b8b14, #ffffff14)));
+$button-ghost-background-color-active: var(--a2-button-ghost-background-color-active, var(--a2-background-color-transparent-default-active, light-dark(#8b8b8b29, #ffffff29)));
+$button-ghost-background-color-disabled: var(--a2-button-ghost-background-color-disabled, var(--a2-background-color-strong, light-dark(var(--a2-color-neutral-20, #f9f9f9), var(--a2-color-neutral-800, #292929))));
+$button-ghost-border-color: var(--a2-button-ghost-border-color, rgba(0, 0, 0, 0));
+$button-ghost-border-radius: var(--a2-button-ghost-border-radius, var(--a2-border-radius-medium, var(--a2-radius-2, 0.375rem)));
+$button-ghost-focus-ring-color: var(--a2-button-ghost-focus-ring-color, var(--a2-focus-ring-color-default, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff)))));
+$button-danger-primary-foreground-color: var(--a2-button-danger-primary-foreground-color, var(--a2-foreground-color-on-danger, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$button-danger-primary-foreground-color-hover: var(--a2-button-danger-primary-foreground-color-hover, var(--a2-foreground-color-on-danger, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$button-danger-primary-foreground-color-active: var(--a2-button-danger-primary-foreground-color-active, var(--a2-foreground-color-on-danger, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$button-danger-primary-foreground-color-disabled: var(--a2-button-danger-primary-foreground-color-disabled, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
+$button-danger-primary-background-color: var(--a2-button-danger-primary-background-color, var(--a2-background-color-danger, var(--a2-status-color-danger, light-dark(var(--a2-color-red-600, #d62100), var(--a2-color-red-400, #ff5b3d)))));
+$button-danger-primary-background-color-hover: var(--a2-button-danger-primary-background-color-hover, var(--a2-background-color-danger-hover, light-dark(var(--a2-color-red-700, #a31900), var(--a2-color-red-300, #ff8670))));
+$button-danger-primary-background-color-active: var(--a2-button-danger-primary-background-color-active, var(--a2-background-color-danger-active, light-dark(var(--a2-color-red-800, #731100), var(--a2-color-red-200, #ffac9e))));
+$button-danger-primary-background-color-disabled: var(--a2-button-danger-primary-background-color-disabled, var(--a2-background-color-strong, light-dark(var(--a2-color-neutral-20, #f9f9f9), var(--a2-color-neutral-800, #292929))));
+$button-danger-primary-border-color: var(--a2-button-danger-primary-border-color, rgba(0, 0, 0, 0));
+$button-danger-primary-border-radius: var(--a2-button-danger-primary-border-radius, var(--a2-border-radius-medium, var(--a2-radius-2, 0.375rem)));
+$button-danger-primary-focus-ring-color: var(--a2-button-danger-primary-focus-ring-color, var(--a2-focus-ring-color-danger, var(--a2-status-color-danger, light-dark(var(--a2-color-red-600, #d62100), var(--a2-color-red-400, #ff5b3d)))));
+$button-danger-secondary-foreground-color: var(--a2-button-danger-secondary-foreground-color, var(--a2-foreground-color-on-danger-subdued, light-dark(var(--a2-color-red-700, #a31900), var(--a2-color-neutral-0, #ffffff))));
+$button-danger-secondary-foreground-color-hover: var(--a2-button-danger-secondary-foreground-color-hover, var(--a2-foreground-color-on-danger-subdued-hover, light-dark(var(--a2-color-red-800, #731100), var(--a2-color-neutral-0, #ffffff))));
+$button-danger-secondary-foreground-color-active: var(--a2-button-danger-secondary-foreground-color-active, var(--a2-foreground-color-on-danger-subdued-active, light-dark(var(--a2-color-red-900, #470b00), var(--a2-color-neutral-0, #ffffff))));
+$button-danger-secondary-foreground-color-disabled: var(--a2-button-danger-secondary-foreground-color-disabled, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
+$button-danger-secondary-background-color: var(--a2-button-danger-secondary-background-color, var(--a2-background-color-danger-subdued, light-dark(var(--a2-color-red-50, #ffe9e5), #ff867033)));
+$button-danger-secondary-background-color-hover: var(--a2-button-danger-secondary-background-color-hover, var(--a2-background-color-danger-subdued-hover, light-dark(var(--a2-color-red-100, #ffd4cc), #ff86704D)));
+$button-danger-secondary-background-color-active: var(--a2-button-danger-secondary-background-color-active, var(--a2-background-color-danger-subdued-active, light-dark(var(--a2-color-red-200, #ffac9e), #ff867066)));
+$button-danger-secondary-background-color-disabled: var(--a2-button-danger-secondary-background-color-disabled, var(--a2-background-color-strong, light-dark(var(--a2-color-neutral-20, #f9f9f9), var(--a2-color-neutral-800, #292929))));
+$button-danger-secondary-border-color: var(--a2-button-danger-secondary-border-color, rgba(0, 0, 0, 0));
+$button-danger-secondary-border-radius: var(--a2-button-danger-secondary-border-radius, var(--a2-border-radius-medium, var(--a2-radius-2, 0.375rem)));
+$button-danger-secondary-focus-ring-color: var(--a2-button-danger-secondary-focus-ring-color, var(--a2-focus-ring-color-danger, var(--a2-status-color-danger, light-dark(var(--a2-color-red-600, #d62100), var(--a2-color-red-400, #ff5b3d)))));
+$calendar-cell-default-background-color: var(--a2-calendar-cell-default-background-color, rgba(0, 0, 0, 0));
+$calendar-cell-default-background-color-hover: var(--a2-calendar-cell-default-background-color-hover, var(--a2-background-color-transparent-default-hover, light-dark(#8b8b8b14, #ffffff14)));
+$calendar-cell-default-background-color-active: var(--a2-calendar-cell-default-background-color-active, var(--a2-background-color-transparent-default-active, light-dark(#8b8b8b29, #ffffff29)));
+$calendar-cell-default-foreground-color: var(--a2-calendar-cell-default-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$calendar-cell-default-foreground-color-hover: var(--a2-calendar-cell-default-foreground-color-hover, var(--a2-foreground-color-default-hover, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$calendar-cell-default-foreground-color-active: var(--a2-calendar-cell-default-foreground-color-active, var(--a2-foreground-color-default-active, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$calendar-cell-selected-background-color: var(--a2-calendar-cell-selected-background-color, var(--a2-background-color-primary, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff)))));
+$calendar-cell-selected-background-color-hover: var(--a2-calendar-cell-selected-background-color-hover, var(--a2-background-color-primary-hover, light-dark(var(--a2-color-blue-700, #1d4ca3), var(--a2-color-blue-200, #9ecaff))));
+$calendar-cell-selected-background-color-active: var(--a2-calendar-cell-selected-background-color-active, var(--a2-background-color-primary-active, light-dark(var(--a2-color-blue-800, #003472), var(--a2-color-blue-100, #cce3ff))));
+$calendar-cell-selected-foreground-color: var(--a2-calendar-cell-selected-foreground-color, var(--a2-foreground-color-on-primary, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$calendar-cell-selected-foreground-color-hover: var(--a2-calendar-cell-selected-foreground-color-hover, var(--a2-foreground-color-on-primary-hover, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$calendar-cell-selected-foreground-color-active: var(--a2-calendar-cell-selected-foreground-color-active, var(--a2-foreground-color-on-primary-active, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$calendar-cell-weekday-foreground-color: var(--a2-calendar-cell-weekday-foreground-color, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
+$calendar-cell-range-background-color: var(--a2-calendar-cell-range-background-color, var(--a2-background-color-transparent-primary, rgba(0, 0, 0, 0)));
+$calendar-cell-range-background-color-hover: var(--a2-calendar-cell-range-background-color-hover, var(--a2-background-color-transparent-primary-hover, light-dark(#1a82ff1A, #70b1ff1A)));
+$calendar-cell-range-background-color-active: var(--a2-calendar-cell-range-background-color-active, var(--a2-background-color-transparent-primary-active, light-dark(#1a82ff4D, #70b1ff40)));
+$calendar-cell-range-foreground-color: var(--a2-calendar-cell-range-foreground-color, var(--a2-foreground-color-primary, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff))));
+$calendar-cell-range-foreground-color-hover: var(--a2-calendar-cell-range-foreground-color-hover, var(--a2-foreground-color-primary-hover, light-dark(var(--a2-color-blue-700, #1d4ca3), var(--a2-color-blue-200, #9ecaff))));
+$calendar-cell-range-foreground-color-active: var(--a2-calendar-cell-range-foreground-color-active, var(--a2-foreground-color-primary-active, light-dark(var(--a2-color-blue-800, #003472), var(--a2-color-blue-200, #9ecaff))));
+$calendar-cell-focus-ring-color: var(--a2-calendar-cell-focus-ring-color, var(--a2-focus-ring-color-default, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff)))));
+$calendar-range-fill-background-color: var(--a2-calendar-range-fill-background-color, var(--a2-background-color-primary-subdued, light-dark(var(--a2-color-blue-50, #e6f1ff), #70b1ff33)));
+$card-border-color: var(--a2-card-border-color, var(--a2-border-color-subdued, light-dark(var(--a2-color-neutral-80, #e6e6e6), var(--a2-color-neutral-700, #404040))));
+$card-default-background-color: var(--a2-card-default-background-color, var(--a2-background-color-default, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$card-strong-background-color: var(--a2-card-strong-background-color, var(--a2-background-color-strong, light-dark(var(--a2-color-neutral-20, #f9f9f9), var(--a2-color-neutral-800, #292929))));
+$card-stronger-background-color: var(--a2-card-stronger-background-color, var(--a2-background-color-stronger, light-dark(var(--a2-color-neutral-50, #eeeeee), var(--a2-color-neutral-700, #404040))));
+$card-strongest-background-color: var(--a2-card-strongest-background-color, var(--a2-background-color-strongest, light-dark(var(--a2-color-neutral-200, #c4c4c4), var(--a2-color-neutral-500, #707070))));
+$checkbox-default-checked-foreground-color: var(--a2-checkbox-default-checked-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$checkbox-default-checked-icon-background-color: var(--a2-checkbox-default-checked-icon-background-color, var(--a2-background-color-transparent-primary, rgba(0, 0, 0, 0)));
+$checkbox-default-checked-icon-background-color-hover: var(--a2-checkbox-default-checked-icon-background-color-hover, var(--a2-background-color-transparent-primary-hover, light-dark(#1a82ff1A, #70b1ff1A)));
+$checkbox-default-checked-icon-background-color-active: var(--a2-checkbox-default-checked-icon-background-color-active, var(--a2-background-color-transparent-primary-active, light-dark(#1a82ff4D, #70b1ff40)));
+$checkbox-default-checked-icon-color: var(--a2-checkbox-default-checked-icon-color, var(--a2-foreground-color-primary, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff))));
+$checkbox-default-checked-icon-color-hover: var(--a2-checkbox-default-checked-icon-color-hover, var(--a2-foreground-color-primary-hover, light-dark(var(--a2-color-blue-700, #1d4ca3), var(--a2-color-blue-200, #9ecaff))));
+$checkbox-default-checked-icon-color-active: var(--a2-checkbox-default-checked-icon-color-active, var(--a2-foreground-color-primary-active, light-dark(var(--a2-color-blue-800, #003472), var(--a2-color-blue-200, #9ecaff))));
+$checkbox-default-checked-icon-color-disabled: var(--a2-checkbox-default-checked-icon-color-disabled, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
+$checkbox-default-unchecked-foreground-color: var(--a2-checkbox-default-unchecked-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$checkbox-default-unchecked-icon-background-color: var(--a2-checkbox-default-unchecked-icon-background-color, var(--a2-background-color-transparent-default, rgba(0, 0, 0, 0)));
+$checkbox-default-unchecked-icon-background-color-hover: var(--a2-checkbox-default-unchecked-icon-background-color-hover, var(--a2-background-color-transparent-default-hover, light-dark(#8b8b8b14, #ffffff14)));
+$checkbox-default-unchecked-icon-background-color-active: var(--a2-checkbox-default-unchecked-icon-background-color-active, var(--a2-background-color-transparent-default-active, light-dark(#8b8b8b29, #ffffff29)));
+$checkbox-default-unchecked-icon-color: var(--a2-checkbox-default-unchecked-icon-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$checkbox-default-unchecked-icon-color-hover: var(--a2-checkbox-default-unchecked-icon-color-hover, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$checkbox-default-unchecked-icon-color-active: var(--a2-checkbox-default-unchecked-icon-color-active, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$checkbox-default-unchecked-icon-color-disabled: var(--a2-checkbox-default-unchecked-icon-color-disabled, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
+$checkbox-default-focus-ring-color: var(--a2-checkbox-default-focus-ring-color, var(--a2-focus-ring-color-default, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff)))));
+$checkbox-error-checked-foreground-color: var(--a2-checkbox-error-checked-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$checkbox-error-checked-icon-background-color: var(--a2-checkbox-error-checked-icon-background-color, var(--a2-background-color-transparent-danger, rgba(0, 0, 0, 0)));
+$checkbox-error-checked-icon-background-color-hover: var(--a2-checkbox-error-checked-icon-background-color-hover, var(--a2-background-color-transparent-danger-hover, light-dark(#ff39141A, #ff86701A)));
+$checkbox-error-checked-icon-background-color-active: var(--a2-checkbox-error-checked-icon-background-color-active, var(--a2-background-color-transparent-danger-active, light-dark(#ff39144D, #ff867040)));
+$checkbox-error-checked-icon-color: var(--a2-checkbox-error-checked-icon-color, var(--a2-foreground-color-danger, light-dark(var(--a2-color-red-600, #d62100), var(--a2-color-red-400, #ff5b3d))));
+$checkbox-error-checked-icon-color-hover: var(--a2-checkbox-error-checked-icon-color-hover, var(--a2-foreground-color-danger-hover, light-dark(var(--a2-color-red-700, #a31900), var(--a2-color-red-300, #ff8670))));
+$checkbox-error-checked-icon-color-active: var(--a2-checkbox-error-checked-icon-color-active, var(--a2-foreground-color-danger-active, light-dark(var(--a2-color-red-800, #731100), var(--a2-color-red-200, #ffac9e))));
+$checkbox-error-checked-icon-color-disabled: var(--a2-checkbox-error-checked-icon-color-disabled, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
+$checkbox-error-unchecked-foreground-color: var(--a2-checkbox-error-unchecked-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$checkbox-error-unchecked-icon-background-color: var(--a2-checkbox-error-unchecked-icon-background-color, var(--a2-background-color-transparent-danger, rgba(0, 0, 0, 0)));
+$checkbox-error-unchecked-icon-background-color-hover: var(--a2-checkbox-error-unchecked-icon-background-color-hover, var(--a2-background-color-transparent-danger-hover, light-dark(#ff39141A, #ff86701A)));
+$checkbox-error-unchecked-icon-background-color-active: var(--a2-checkbox-error-unchecked-icon-background-color-active, var(--a2-background-color-transparent-danger-active, light-dark(#ff39144D, #ff867040)));
+$checkbox-error-unchecked-icon-color: var(--a2-checkbox-error-unchecked-icon-color, var(--a2-foreground-color-danger, light-dark(var(--a2-color-red-600, #d62100), var(--a2-color-red-400, #ff5b3d))));
+$checkbox-error-unchecked-icon-color-hover: var(--a2-checkbox-error-unchecked-icon-color-hover, var(--a2-foreground-color-danger-hover, light-dark(var(--a2-color-red-700, #a31900), var(--a2-color-red-300, #ff8670))));
+$checkbox-error-unchecked-icon-color-active: var(--a2-checkbox-error-unchecked-icon-color-active, var(--a2-foreground-color-danger-active, light-dark(var(--a2-color-red-800, #731100), var(--a2-color-red-200, #ffac9e))));
+$checkbox-error-unchecked-icon-color-disabled: var(--a2-checkbox-error-unchecked-icon-color-disabled, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
+$checkbox-error-focus-ring-color: var(--a2-checkbox-error-focus-ring-color, var(--a2-focus-ring-color-danger, var(--a2-status-color-danger, light-dark(var(--a2-color-red-600, #d62100), var(--a2-color-red-400, #ff5b3d)))));
+$checkbox-border-radius: var(--a2-checkbox-border-radius, var(--a2-border-radius-small, var(--a2-radius-1, 0.1875rem)));
+$chip-background-color: var(--a2-chip-background-color, var(--a2-background-color-stronger, light-dark(var(--a2-color-neutral-50, #eeeeee), var(--a2-color-neutral-700, #404040))));
+$chip-background-color-hover: var(--a2-chip-background-color-hover, var(--a2-background-color-stronger-hover, light-dark(var(--a2-color-neutral-90, #e5e5e5), var(--a2-color-neutral-600, #545454))));
+$chip-background-color-active: var(--a2-chip-background-color-active, var(--a2-background-color-stronger-active, light-dark(var(--a2-color-neutral-100, #dfdfdf), var(--a2-color-neutral-500, #707070))));
+$chip-border-color: var(--a2-chip-border-color, var(--a2-border-color-subdued, light-dark(var(--a2-color-neutral-80, #e6e6e6), var(--a2-color-neutral-700, #404040))));
+$chip-foreground-color: var(--a2-chip-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$chip-focus-ring-color: var(--a2-chip-focus-ring-color, var(--a2-focus-ring-color-default, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff)))));
+$chip-close-background-color: var(--a2-chip-close-background-color, rgba(0, 0, 0, 0));
+$chip-close-background-color-hover: var(--a2-chip-close-background-color-hover, var(--a2-background-color-strongest-hover, light-dark(var(--a2-color-neutral-300, #a8a8a8), var(--a2-color-neutral-400, #8b8b8b))));
+$chip-close-background-color-active: var(--a2-chip-close-background-color-active, var(--a2-background-color-strongest-active, light-dark(var(--a2-color-neutral-400, #8b8b8b), var(--a2-color-neutral-300, #a8a8a8))));
+$combobox-item-default-background-color: var(--a2-combobox-item-default-background-color, var(--a2-background-color-transparent-default, rgba(0, 0, 0, 0)));
+$combobox-item-default-background-color-hover: var(--a2-combobox-item-default-background-color-hover, var(--a2-background-color-transparent-default-hover, light-dark(#8b8b8b14, #ffffff14)));
+$combobox-item-default-background-color-active: var(--a2-combobox-item-default-background-color-active, var(--a2-background-color-transparent-default-active, light-dark(#8b8b8b29, #ffffff29)));
+$combobox-item-default-foreground-color: var(--a2-combobox-item-default-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$combobox-item-default-foreground-color-hover: var(--a2-combobox-item-default-foreground-color-hover, var(--a2-foreground-color-default-hover, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$combobox-item-default-foreground-color-active: var(--a2-combobox-item-default-foreground-color-active, var(--a2-foreground-color-default-active, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$combobox-item-selected-background-color: var(--a2-combobox-item-selected-background-color, var(--a2-background-color-primary-subdued, light-dark(var(--a2-color-blue-50, #e6f1ff), #70b1ff33)));
+$combobox-item-selected-background-color-hover: var(--a2-combobox-item-selected-background-color-hover, var(--a2-background-color-primary-subdued-hover, light-dark(var(--a2-color-blue-100, #cce3ff), #70b1ff4D)));
+$combobox-item-selected-background-color-active: var(--a2-combobox-item-selected-background-color-active, var(--a2-background-color-primary-subdued-active, light-dark(var(--a2-color-blue-200, #9ecaff), #70b1ff66)));
+$combobox-item-selected-foreground-color: var(--a2-combobox-item-selected-foreground-color, var(--a2-foreground-color-primary, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff))));
+$combobox-item-selected-foreground-color-hover: var(--a2-combobox-item-selected-foreground-color-hover, var(--a2-foreground-color-primary-hover, light-dark(var(--a2-color-blue-700, #1d4ca3), var(--a2-color-blue-200, #9ecaff))));
+$combobox-item-selected-foreground-color-active: var(--a2-combobox-item-selected-foreground-color-active, var(--a2-foreground-color-primary-active, light-dark(var(--a2-color-blue-800, #003472), var(--a2-color-blue-200, #9ecaff))));
+$combobox-item-disabled-foreground-color: var(--a2-combobox-item-disabled-foreground-color, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
+$combobox-item-disabled-icon-color: var(--a2-combobox-item-disabled-icon-color, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
+$combobox-item-disabled-opacity: var(--a2-combobox-item-disabled-opacity, var(--a2-opacity-disabled, 0.6));
+$details-summary-foreground-color: var(--a2-details-summary-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$details-summary-foreground-color-hover: var(--a2-details-summary-foreground-color-hover, var(--a2-foreground-color-default-hover, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$details-summary-foreground-color-active: var(--a2-details-summary-foreground-color-active, var(--a2-foreground-color-default-active, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$details-summary-background-color: var(--a2-details-summary-background-color, var(--a2-background-color-transparent-default, rgba(0, 0, 0, 0)));
+$details-summary-background-color-hover: var(--a2-details-summary-background-color-hover, var(--a2-background-color-transparent-default-hover, light-dark(#8b8b8b14, #ffffff14)));
+$details-summary-background-color-active: var(--a2-details-summary-background-color-active, var(--a2-background-color-transparent-default-active, light-dark(#8b8b8b29, #ffffff29)));
+$details-summary-focus-ring-color: var(--a2-details-summary-focus-ring-color, var(--a2-focus-ring-color-default, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff)))));
+$details-content-foreground-color: var(--a2-details-content-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$dialog-background-color: var(--a2-dialog-background-color, var(--a2-background-color-default, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$dialog-border-color: var(--a2-dialog-border-color, var(--a2-border-color-subdued, light-dark(var(--a2-color-neutral-80, #e6e6e6), var(--a2-color-neutral-700, #404040))));
+$dialog-backdrop-color: var(--a2-dialog-backdrop-color, var(--a2-color-neutral-900, #1a1a1a));
+$dialog-backdrop-opacity: var(--a2-dialog-backdrop-opacity, 0.6);
+$dialog-backdrop-fullscreen-color: var(--a2-dialog-backdrop-fullscreen-color, var(--a2-color-neutral-0, #ffffff));
+$divider-border-color: var(--a2-divider-border-color, var(--a2-border-color-subdued, light-dark(var(--a2-color-neutral-80, #e6e6e6), var(--a2-color-neutral-700, #404040))));
+$dnd-drop-line-background-color: var(--a2-dnd-drop-line-background-color, var(--a2-background-color-success, var(--a2-status-color-success, light-dark(var(--a2-color-green-600, #077e50), var(--a2-color-green-400, #0bd085)))));
+$dnd-drop-line-indicator-background-color: var(--a2-dnd-drop-line-indicator-background-color, var(--a2-background-color-default, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$dnd-drop-line-indicator-border-color: var(--a2-dnd-drop-line-indicator-border-color, var(--a2-border-color-success, light-dark(var(--a2-color-green-600, #077e50), var(--a2-color-green-200, #70ebbc))));
+$dnd-drop-zone-active-not-over-background-color: var(--a2-dnd-drop-zone-active-not-over-background-color, var(--a2-background-color-primary-subdued, light-dark(var(--a2-color-blue-50, #e6f1ff), #70b1ff33)));
+$dnd-drop-zone-active-not-over-border-color: var(--a2-dnd-drop-zone-active-not-over-border-color, var(--a2-border-color-primary, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-200, #9ecaff))));
+$dnd-drop-zone-over-valid-background-color: var(--a2-dnd-drop-zone-over-valid-background-color, var(--a2-background-color-success-subdued, light-dark(var(--a2-color-green-50, #d3fded), #3be3a233)));
+$dnd-drop-zone-over-valid-border-color: var(--a2-dnd-drop-zone-over-valid-border-color, var(--a2-border-color-success, light-dark(var(--a2-color-green-600, #077e50), var(--a2-color-green-200, #70ebbc))));
+$dnd-drop-zone-over-invalid-background-color: var(--a2-dnd-drop-zone-over-invalid-background-color, var(--a2-background-color-danger-subdued, light-dark(var(--a2-color-red-50, #ffe9e5), #ff867033)));
+$dnd-drop-zone-over-invalid-border-color: var(--a2-dnd-drop-zone-over-invalid-border-color, var(--a2-border-color-danger, light-dark(var(--a2-color-red-600, #d62100), var(--a2-color-red-200, #ffac9e))));
+$dnd-drag-preview-shadow-color: var(--a2-dnd-drag-preview-shadow-color, var(--a2-shadow-color-default, light-dark(#1a1a1a14, #ffffff14)));
+$drawer-background-color: var(--a2-drawer-background-color, var(--a2-background-color-default, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$drawer-border-color: var(--a2-drawer-border-color, var(--a2-border-color-subdued, light-dark(var(--a2-color-neutral-80, #e6e6e6), var(--a2-color-neutral-700, #404040))));
+$drawer-backdrop-color: var(--a2-drawer-backdrop-color, var(--a2-color-neutral-900, #1a1a1a));
+$drilldown-background-color: var(--a2-drilldown-background-color, var(--a2-background-color-default, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$drilldown-border-color: var(--a2-drilldown-border-color, var(--a2-border-color-subdued, light-dark(var(--a2-color-neutral-80, #e6e6e6), var(--a2-color-neutral-700, #404040))));
+$drilldown-backdrop-color: var(--a2-drilldown-backdrop-color, var(--a2-color-neutral-500, #707070));
+$edit-card-indicator-border-style: var(--a2-edit-card-indicator-border-style, solid);
+$edit-card-indicator-border-width: var(--a2-edit-card-indicator-border-width, var(--a2-size-quarter, 0.0625rem));
+$edit-card-indicator-size: var(--a2-edit-card-indicator-size, var(--a2-size-4, 1rem));
+$edit-card-default-border-inline-start-color: var(--a2-edit-card-default-border-inline-start-color, var(--a2-border-color-subdued, light-dark(var(--a2-color-neutral-80, #e6e6e6), var(--a2-color-neutral-700, #404040))));
+$edit-card-default-border-inline-start-width: var(--a2-edit-card-default-border-inline-start-width, var(--a2-size-quarter, 0.0625rem));
+$edit-card-default-indicator-background-color: var(--a2-edit-card-default-indicator-background-color, var(--a2-background-color-default, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$edit-card-default-indicator-border-color: var(--a2-edit-card-default-indicator-border-color, var(--a2-background-color-strongest, light-dark(var(--a2-color-neutral-200, #c4c4c4), var(--a2-color-neutral-500, #707070))));
+$edit-card-default-indicator-border-style: var(--a2-edit-card-default-indicator-border-style, dashed);
+$edit-card-default-indicator-icon-color: var(--a2-edit-card-default-indicator-icon-color, rgba(0, 0, 0, 0));
+$edit-card-in-progress-border-inline-start-color: var(--a2-edit-card-in-progress-border-inline-start-color, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff))));
+$edit-card-in-progress-border-inline-start-width: var(--a2-edit-card-in-progress-border-inline-start-width, 0.375rem);
+$edit-card-in-progress-indicator-border-color: var(--a2-edit-card-in-progress-indicator-border-color, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff))));
+$edit-card-in-progress-indicator-icon-color: var(--a2-edit-card-in-progress-indicator-icon-color, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff))));
+$edit-card-complete-border-inline-start-color: var(--a2-edit-card-complete-border-inline-start-color, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff))));
+$edit-card-complete-border-inline-start-width: var(--a2-edit-card-complete-border-inline-start-width, 0.375rem);
+$edit-card-complete-indicator-background-color: var(--a2-edit-card-complete-indicator-background-color, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff))));
+$edit-card-complete-indicator-border-color: var(--a2-edit-card-complete-indicator-border-color, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff))));
+$edit-card-complete-indicator-icon-color: var(--a2-edit-card-complete-indicator-icon-color, var(--a2-foreground-color-on-primary, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$edit-card-error-border-inline-start-color: var(--a2-edit-card-error-border-inline-start-color, var(--a2-status-color-danger, light-dark(var(--a2-color-red-600, #d62100), var(--a2-color-red-400, #ff5b3d))));
+$edit-card-error-border-inline-start-width: var(--a2-edit-card-error-border-inline-start-width, 0.375rem);
+$edit-card-error-indicator-background-color: var(--a2-edit-card-error-indicator-background-color, var(--a2-status-color-danger, light-dark(var(--a2-color-red-600, #d62100), var(--a2-color-red-400, #ff5b3d))));
+$edit-card-error-indicator-border-color: var(--a2-edit-card-error-indicator-border-color, var(--a2-status-color-danger, light-dark(var(--a2-color-red-600, #d62100), var(--a2-color-red-400, #ff5b3d))));
+$edit-card-error-indicator-icon-color: var(--a2-edit-card-error-indicator-icon-color, var(--a2-foreground-color-on-danger, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$field-label-foreground-color: var(--a2-field-label-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$field-label-required-color: var(--a2-field-label-required-color, var(--a2-foreground-color-danger, light-dark(var(--a2-color-red-600, #d62100), var(--a2-color-red-400, #ff5b3d))));
+$field-message-foreground-color: var(--a2-field-message-foreground-color, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
+$field-message-error-foreground-color: var(--a2-field-message-error-foreground-color, var(--a2-foreground-color-danger, light-dark(var(--a2-color-red-600, #d62100), var(--a2-color-red-400, #ff5b3d))));
+$field-message-warning-foreground-color: var(--a2-field-message-warning-foreground-color, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
+$icon-foreground-color: var(--a2-icon-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$icon-focus-ring-color: var(--a2-icon-focus-ring-color, var(--a2-focus-ring-color-default, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff)))));
+$link-primary-foreground-color: var(--a2-link-primary-foreground-color, var(--a2-foreground-color-primary, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff))));
+$link-primary-foreground-color-hover: var(--a2-link-primary-foreground-color-hover, var(--a2-foreground-color-primary-hover, light-dark(var(--a2-color-blue-700, #1d4ca3), var(--a2-color-blue-200, #9ecaff))));
+$link-secondary-foreground-color: var(--a2-link-secondary-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$link-secondary-foreground-color-hover: var(--a2-link-secondary-foreground-color-hover, light-dark(color-mix(in srgb, var(--a2-foreground-color-default, #040404) 80%, transparent), color-mix(in srgb, var(--a2-foreground-color-default, #ffffff) 80%, transparent)));
+$link-focus-ring-color: var(--a2-link-focus-ring-color, var(--a2-focus-ring-color-default, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff)))));
+$list-view-foreground-color: var(--a2-list-view-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$list-view-background-color: var(--a2-list-view-background-color, var(--a2-background-color-transparent-default, rgba(0, 0, 0, 0)));
+$list-view-background-color-hover: var(--a2-list-view-background-color-hover, var(--a2-background-color-transparent-default-hover, light-dark(#8b8b8b14, #ffffff14)));
+$list-view-group-label-foreground-color: var(--a2-list-view-group-label-foreground-color, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
+$listbox-option-default-foreground-color: var(--a2-listbox-option-default-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$listbox-option-default-foreground-color-hover: var(--a2-listbox-option-default-foreground-color-hover, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$listbox-option-default-foreground-color-active: var(--a2-listbox-option-default-foreground-color-active, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$listbox-option-default-background-color: var(--a2-listbox-option-default-background-color, rgba(0, 0, 0, 0));
+$listbox-option-default-background-color-hover: var(--a2-listbox-option-default-background-color-hover, var(--a2-background-color-transparent-default-hover, light-dark(#8b8b8b14, #ffffff14)));
+$listbox-option-default-background-color-active: var(--a2-listbox-option-default-background-color-active, var(--a2-background-color-transparent-default-active, light-dark(#8b8b8b29, #ffffff29)));
+$listbox-option-default-focus-ring-color: var(--a2-listbox-option-default-focus-ring-color, var(--a2-focus-ring-color-default, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff)))));
+$listbox-option-selected-foreground-color: var(--a2-listbox-option-selected-foreground-color, var(--a2-foreground-color-primary, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff))));
+$listbox-option-selected-foreground-color-hover: var(--a2-listbox-option-selected-foreground-color-hover, var(--a2-foreground-color-primary-hover, light-dark(var(--a2-color-blue-700, #1d4ca3), var(--a2-color-blue-200, #9ecaff))));
+$listbox-option-selected-foreground-color-active: var(--a2-listbox-option-selected-foreground-color-active, var(--a2-foreground-color-primary-active, light-dark(var(--a2-color-blue-800, #003472), var(--a2-color-blue-200, #9ecaff))));
+$listbox-option-selected-background-color: var(--a2-listbox-option-selected-background-color, var(--a2-background-color-primary-subdued, light-dark(var(--a2-color-blue-50, #e6f1ff), #70b1ff33)));
+$listbox-option-selected-background-color-hover: var(--a2-listbox-option-selected-background-color-hover, var(--a2-background-color-primary-subdued-hover, light-dark(var(--a2-color-blue-100, #cce3ff), #70b1ff4D)));
+$listbox-option-selected-background-color-active: var(--a2-listbox-option-selected-background-color-active, var(--a2-background-color-primary-subdued-active, light-dark(var(--a2-color-blue-200, #9ecaff), #70b1ff66)));
+$listbox-group-label-foreground-color: var(--a2-listbox-group-label-foreground-color, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
+$listbox-group-border-color: var(--a2-listbox-group-border-color, var(--a2-border-color-subdued, light-dark(var(--a2-color-neutral-80, #e6e6e6), var(--a2-color-neutral-700, #404040))));
+$menu-content-foreground-color: var(--a2-menu-content-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$menu-content-background-color: var(--a2-menu-content-background-color, var(--a2-background-color-strong, light-dark(var(--a2-color-neutral-20, #f9f9f9), var(--a2-color-neutral-800, #292929))));
+$menu-content-border-color: var(--a2-menu-content-border-color, var(--a2-border-color-subdued, light-dark(var(--a2-color-neutral-80, #e6e6e6), var(--a2-color-neutral-700, #404040))));
+$menu-content-shadow-color: var(--a2-menu-content-shadow-color, var(--a2-shadow-color-default, light-dark(#1a1a1a14, #ffffff14)));
+$menu-item-foreground-color: var(--a2-menu-item-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$menu-item-foreground-color-hover: var(--a2-menu-item-foreground-color-hover, var(--a2-foreground-color-default-hover, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$menu-item-foreground-color-active: var(--a2-menu-item-foreground-color-active, var(--a2-foreground-color-default-active, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$menu-item-background-color: var(--a2-menu-item-background-color, rgba(0, 0, 0, 0));
+$menu-item-background-color-hover: var(--a2-menu-item-background-color-hover, var(--a2-background-color-transparent-default-hover, light-dark(#8b8b8b14, #ffffff14)));
+$menu-item-background-color-active: var(--a2-menu-item-background-color-active, var(--a2-background-color-transparent-default-active, light-dark(#8b8b8b29, #ffffff29)));
+$menu-arrow-foreground-color: var(--a2-menu-arrow-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$menu-arrow-background-color: var(--a2-menu-arrow-background-color, var(--a2-background-color-strong, light-dark(var(--a2-color-neutral-20, #f9f9f9), var(--a2-color-neutral-800, #292929))));
+$overflow-content-focus-ring-color: var(--a2-overflow-content-focus-ring-color, var(--a2-focus-ring-color-default, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff)))));
+$overflow-shadow-color: var(--a2-overflow-shadow-color, var(--a2-shadow-color-default, light-dark(#1a1a1a14, #ffffff14)));
+$overflow-expand-button-foreground-color: var(--a2-overflow-expand-button-foreground-color, var(--a2-foreground-color-primary, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff))));
+$overflow-expand-button-focus-ring-color: var(--a2-overflow-expand-button-focus-ring-color, var(--a2-focus-ring-color-default, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff)))));
+$page-container-foreground-color: var(--a2-page-container-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$page-container-background-color: var(--a2-page-container-background-color, var(--a2-background-color-default, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$page-content-footer-background-color: var(--a2-page-content-footer-background-color, var(--a2-background-color-default, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$page-content-footer-border-color: var(--a2-page-content-footer-border-color, var(--a2-border-color-subdued, light-dark(var(--a2-color-neutral-80, #e6e6e6), var(--a2-color-neutral-700, #404040))));
+$page-content-footer-shadow-color: var(--a2-page-content-footer-shadow-color, var(--a2-shadow-color-default, light-dark(#1a1a1a14, #ffffff14)));
+$page-sidebar-background-color: var(--a2-page-sidebar-background-color, var(--a2-background-color-default, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$page-sidebar-border-color: var(--a2-page-sidebar-border-color, var(--a2-border-color-subdued, light-dark(var(--a2-color-neutral-80, #e6e6e6), var(--a2-color-neutral-700, #404040))));
+$page-sidebar-shadow-color: var(--a2-page-sidebar-shadow-color, var(--a2-shadow-color-default, light-dark(#1a1a1a14, #ffffff14)));
+$page-sidebar-header-background-color: var(--a2-page-sidebar-header-background-color, var(--a2-background-color-default, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$page-sidebar-adaptive-trigger-container-background-color: var(--a2-page-sidebar-adaptive-trigger-container-background-color, var(--a2-background-color-default, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$page-sidebar-adaptive-trigger-container-shadow-color: var(--a2-page-sidebar-adaptive-trigger-container-shadow-color, var(--a2-shadow-color-default, light-dark(#1a1a1a14, #ffffff14)));
+$page-sidebar-adaptive-trigger-foreground-color: var(--a2-page-sidebar-adaptive-trigger-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$page-sidebar-adaptive-trigger-background-color: var(--a2-page-sidebar-adaptive-trigger-background-color, var(--a2-background-color-stronger, light-dark(var(--a2-color-neutral-50, #eeeeee), var(--a2-color-neutral-700, #404040))));
+$page-toggle-button-background-color: var(--a2-page-toggle-button-background-color, var(--a2-background-color-default, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$page-toggle-button-background-color-hover: var(--a2-page-toggle-button-background-color-hover, var(--a2-background-color-default-hover, light-dark(var(--a2-color-neutral-20, #f9f9f9), var(--a2-color-neutral-800, #292929))));
+$page-toggle-button-background-color-active: var(--a2-page-toggle-button-background-color-active, var(--a2-background-color-default-active, light-dark(var(--a2-color-neutral-40, #f1f1f1), var(--a2-color-neutral-700, #404040))));
+$page-toggle-button-border-color: var(--a2-page-toggle-button-border-color, var(--a2-border-color-subdued, light-dark(var(--a2-color-neutral-80, #e6e6e6), var(--a2-color-neutral-700, #404040))));
+$page-panel-background-color: var(--a2-page-panel-background-color, var(--a2-background-color-default, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$page-panel-border-color: var(--a2-page-panel-border-color, var(--a2-border-color-subdued, light-dark(var(--a2-color-neutral-80, #e6e6e6), var(--a2-color-neutral-700, #404040))));
+$pagination-foreground-color: var(--a2-pagination-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$pagination-items-per-page-button-background-color: var(--a2-pagination-items-per-page-button-background-color, var(--a2-background-color-default, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$pagination-items-per-page-button-border-color: var(--a2-pagination-items-per-page-button-border-color, var(--a2-border-color-default, light-dark(var(--a2-color-neutral-400, #8b8b8b), var(--a2-color-neutral-600, #545454))));
+$popover-content-foreground-color: var(--a2-popover-content-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$popover-content-background-color: var(--a2-popover-content-background-color, var(--a2-background-color-strong, light-dark(var(--a2-color-neutral-20, #f9f9f9), var(--a2-color-neutral-800, #292929))));
+$popover-content-border-color: var(--a2-popover-content-border-color, var(--a2-border-color-subdued, light-dark(var(--a2-color-neutral-80, #e6e6e6), var(--a2-color-neutral-700, #404040))));
+$popover-content-shadow-color: var(--a2-popover-content-shadow-color, var(--a2-shadow-color-default, light-dark(#1a1a1a14, #ffffff14)));
+$popover-arrow-fill-color: var(--a2-popover-arrow-fill-color, var(--a2-background-color-strong, light-dark(var(--a2-color-neutral-20, #f9f9f9), var(--a2-color-neutral-800, #292929))));
+$popover-arrow-stroke-color: var(--a2-popover-arrow-stroke-color, var(--a2-border-color-subdued, light-dark(var(--a2-color-neutral-80, #e6e6e6), var(--a2-color-neutral-700, #404040))));
+$progress-bar-track-background-color: var(--a2-progress-bar-track-background-color, var(--a2-background-color-stronger, light-dark(var(--a2-color-neutral-50, #eeeeee), var(--a2-color-neutral-700, #404040))));
+$progress-bar-fill-background-color-info: var(--a2-progress-bar-fill-background-color-info, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff))));
+$progress-bar-fill-background-color-success: var(--a2-progress-bar-fill-background-color-success, var(--a2-status-color-success, light-dark(var(--a2-color-green-600, #077e50), var(--a2-color-green-400, #0bd085))));
+$progress-bar-fill-background-color-error: var(--a2-progress-bar-fill-background-color-error, var(--a2-status-color-danger, light-dark(var(--a2-color-red-600, #d62100), var(--a2-color-red-400, #ff5b3d))));
+$progress-bar-border-radius: var(--a2-progress-bar-border-radius, var(--a2-border-radius-medium, var(--a2-radius-2, 0.375rem)));
+$progress-bar-check-icon-foreground-color: var(--a2-progress-bar-check-icon-foreground-color, var(--a2-status-color-success, light-dark(var(--a2-color-green-600, #077e50), var(--a2-color-green-400, #0bd085))));
+$progress-bar-error-icon-foreground-color: var(--a2-progress-bar-error-icon-foreground-color, var(--a2-status-color-danger, light-dark(var(--a2-color-red-600, #d62100), var(--a2-color-red-400, #ff5b3d))));
+$radio-default-checked-foreground-color: var(--a2-radio-default-checked-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$radio-default-checked-icon-background-color: var(--a2-radio-default-checked-icon-background-color, var(--a2-background-color-transparent-primary, rgba(0, 0, 0, 0)));
+$radio-default-checked-icon-background-color-hover: var(--a2-radio-default-checked-icon-background-color-hover, var(--a2-background-color-transparent-primary-hover, light-dark(#1a82ff1A, #70b1ff1A)));
+$radio-default-checked-icon-background-color-active: var(--a2-radio-default-checked-icon-background-color-active, var(--a2-background-color-transparent-primary-active, light-dark(#1a82ff4D, #70b1ff40)));
+$radio-default-checked-icon-color: var(--a2-radio-default-checked-icon-color, var(--a2-foreground-color-primary, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff))));
+$radio-default-checked-icon-color-hover: var(--a2-radio-default-checked-icon-color-hover, var(--a2-foreground-color-primary-hover, light-dark(var(--a2-color-blue-700, #1d4ca3), var(--a2-color-blue-200, #9ecaff))));
+$radio-default-checked-icon-color-active: var(--a2-radio-default-checked-icon-color-active, var(--a2-foreground-color-primary-active, light-dark(var(--a2-color-blue-800, #003472), var(--a2-color-blue-200, #9ecaff))));
+$radio-default-checked-icon-color-disabled: var(--a2-radio-default-checked-icon-color-disabled, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
+$radio-default-unchecked-foreground-color: var(--a2-radio-default-unchecked-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$radio-default-unchecked-icon-background-color: var(--a2-radio-default-unchecked-icon-background-color, var(--a2-background-color-transparent-default, rgba(0, 0, 0, 0)));
+$radio-default-unchecked-icon-background-color-hover: var(--a2-radio-default-unchecked-icon-background-color-hover, var(--a2-background-color-transparent-default-hover, light-dark(#8b8b8b14, #ffffff14)));
+$radio-default-unchecked-icon-background-color-active: var(--a2-radio-default-unchecked-icon-background-color-active, var(--a2-background-color-transparent-default-active, light-dark(#8b8b8b29, #ffffff29)));
+$radio-default-unchecked-icon-color: var(--a2-radio-default-unchecked-icon-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$radio-default-unchecked-icon-color-hover: var(--a2-radio-default-unchecked-icon-color-hover, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$radio-default-unchecked-icon-color-active: var(--a2-radio-default-unchecked-icon-color-active, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$radio-default-unchecked-icon-color-disabled: var(--a2-radio-default-unchecked-icon-color-disabled, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
+$radio-default-focus-ring-color: var(--a2-radio-default-focus-ring-color, var(--a2-focus-ring-color-default, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff)))));
+$radio-error-checked-foreground-color: var(--a2-radio-error-checked-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$radio-error-checked-icon-background-color: var(--a2-radio-error-checked-icon-background-color, var(--a2-background-color-transparent-danger, rgba(0, 0, 0, 0)));
+$radio-error-checked-icon-background-color-hover: var(--a2-radio-error-checked-icon-background-color-hover, var(--a2-background-color-transparent-danger-hover, light-dark(#ff39141A, #ff86701A)));
+$radio-error-checked-icon-background-color-active: var(--a2-radio-error-checked-icon-background-color-active, var(--a2-background-color-transparent-danger-active, light-dark(#ff39144D, #ff867040)));
+$radio-error-checked-icon-color: var(--a2-radio-error-checked-icon-color, var(--a2-foreground-color-danger, light-dark(var(--a2-color-red-600, #d62100), var(--a2-color-red-400, #ff5b3d))));
+$radio-error-checked-icon-color-hover: var(--a2-radio-error-checked-icon-color-hover, var(--a2-foreground-color-danger-hover, light-dark(var(--a2-color-red-700, #a31900), var(--a2-color-red-300, #ff8670))));
+$radio-error-checked-icon-color-active: var(--a2-radio-error-checked-icon-color-active, var(--a2-foreground-color-danger-active, light-dark(var(--a2-color-red-800, #731100), var(--a2-color-red-200, #ffac9e))));
+$radio-error-checked-icon-color-disabled: var(--a2-radio-error-checked-icon-color-disabled, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
+$radio-error-unchecked-foreground-color: var(--a2-radio-error-unchecked-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$radio-error-unchecked-icon-background-color: var(--a2-radio-error-unchecked-icon-background-color, var(--a2-background-color-transparent-danger, rgba(0, 0, 0, 0)));
+$radio-error-unchecked-icon-background-color-hover: var(--a2-radio-error-unchecked-icon-background-color-hover, var(--a2-background-color-transparent-danger-hover, light-dark(#ff39141A, #ff86701A)));
+$radio-error-unchecked-icon-background-color-active: var(--a2-radio-error-unchecked-icon-background-color-active, var(--a2-background-color-transparent-danger-active, light-dark(#ff39144D, #ff867040)));
+$radio-error-unchecked-icon-color: var(--a2-radio-error-unchecked-icon-color, var(--a2-foreground-color-danger, light-dark(var(--a2-color-red-600, #d62100), var(--a2-color-red-400, #ff5b3d))));
+$radio-error-unchecked-icon-color-hover: var(--a2-radio-error-unchecked-icon-color-hover, var(--a2-foreground-color-danger-hover, light-dark(var(--a2-color-red-700, #a31900), var(--a2-color-red-300, #ff8670))));
+$radio-error-unchecked-icon-color-active: var(--a2-radio-error-unchecked-icon-color-active, var(--a2-foreground-color-danger-active, light-dark(var(--a2-color-red-800, #731100), var(--a2-color-red-200, #ffac9e))));
+$radio-error-unchecked-icon-color-disabled: var(--a2-radio-error-unchecked-icon-color-disabled, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
+$radio-error-focus-ring-color: var(--a2-radio-error-focus-ring-color, var(--a2-focus-ring-color-danger, var(--a2-status-color-danger, light-dark(var(--a2-color-red-600, #d62100), var(--a2-color-red-400, #ff5b3d)))));
+$radio-border-radius: var(--a2-radio-border-radius, var(--a2-border-radius-circular, 100%));
+$segmented-control-background-color: var(--a2-segmented-control-background-color, var(--a2-background-color-stronger, light-dark(var(--a2-color-neutral-50, #eeeeee), var(--a2-color-neutral-700, #404040))));
+$segmented-control-segment-background-color: var(--a2-segmented-control-segment-background-color, rgba(0, 0, 0, 0));
+$segmented-control-segment-background-color-hover: var(--a2-segmented-control-segment-background-color-hover, var(--a2-background-color-transparent-default-hover, light-dark(#8b8b8b14, #ffffff14)));
+$segmented-control-segment-background-color-active: var(--a2-segmented-control-segment-background-color-active, var(--a2-background-color-transparent-default-active, light-dark(#8b8b8b29, #ffffff29)));
+$segmented-control-button-foreground-color: var(--a2-segmented-control-button-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$segmented-control-button-background-color: var(--a2-segmented-control-button-background-color, var(--a2-background-color-default, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$segmented-control-border-color: var(--a2-segmented-control-border-color, var(--a2-border-color-subdued, light-dark(var(--a2-color-neutral-80, #e6e6e6), var(--a2-color-neutral-700, #404040))));
+$segmented-control-shadow-color: var(--a2-segmented-control-shadow-color, var(--a2-shadow-color-default, light-dark(#1a1a1a14, #ffffff14)));
+$segmented-control-focus-ring-color: var(--a2-segmented-control-focus-ring-color, var(--a2-focus-ring-color-default, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff)))));
+$select-card-unchecked-foreground-color: var(--a2-select-card-unchecked-foreground-color, var(--a2-foreground-color-primary, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff))));
+$select-card-unchecked-foreground-color-hover: var(--a2-select-card-unchecked-foreground-color-hover, var(--a2-foreground-color-primary-hover, light-dark(var(--a2-color-blue-700, #1d4ca3), var(--a2-color-blue-200, #9ecaff))));
+$select-card-unchecked-foreground-color-active: var(--a2-select-card-unchecked-foreground-color-active, var(--a2-foreground-color-primary-active, light-dark(var(--a2-color-blue-800, #003472), var(--a2-color-blue-200, #9ecaff))));
+$select-card-unchecked-default-background-color: var(--a2-select-card-unchecked-default-background-color, var(--a2-background-color-default, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$select-card-unchecked-default-background-color-hover: var(--a2-select-card-unchecked-default-background-color-hover, var(--a2-background-color-default-hover, light-dark(var(--a2-color-neutral-20, #f9f9f9), var(--a2-color-neutral-800, #292929))));
+$select-card-unchecked-default-background-color-active: var(--a2-select-card-unchecked-default-background-color-active, var(--a2-background-color-default-active, light-dark(var(--a2-color-neutral-40, #f1f1f1), var(--a2-color-neutral-700, #404040))));
+$select-card-unchecked-strong-background-color: var(--a2-select-card-unchecked-strong-background-color, var(--a2-background-color-strong, light-dark(var(--a2-color-neutral-20, #f9f9f9), var(--a2-color-neutral-800, #292929))));
+$select-card-unchecked-strong-background-color-hover: var(--a2-select-card-unchecked-strong-background-color-hover, var(--a2-background-color-strong-hover, light-dark(var(--a2-color-neutral-50, #eeeeee), var(--a2-color-neutral-700, #404040))));
+$select-card-unchecked-strong-background-color-active: var(--a2-select-card-unchecked-strong-background-color-active, var(--a2-background-color-strong-active, light-dark(var(--a2-color-neutral-70, #e8e8e8), var(--a2-color-neutral-600, #545454))));
+$select-card-unchecked-stronger-background-color: var(--a2-select-card-unchecked-stronger-background-color, var(--a2-background-color-stronger, light-dark(var(--a2-color-neutral-50, #eeeeee), var(--a2-color-neutral-700, #404040))));
+$select-card-unchecked-stronger-background-color-hover: var(--a2-select-card-unchecked-stronger-background-color-hover, var(--a2-background-color-stronger-hover, light-dark(var(--a2-color-neutral-90, #e5e5e5), var(--a2-color-neutral-600, #545454))));
+$select-card-unchecked-stronger-background-color-active: var(--a2-select-card-unchecked-stronger-background-color-active, var(--a2-background-color-stronger-active, light-dark(var(--a2-color-neutral-100, #dfdfdf), var(--a2-color-neutral-500, #707070))));
+$select-card-unchecked-icon-color: var(--a2-select-card-unchecked-icon-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$select-card-unchecked-icon-color-disabled: var(--a2-select-card-unchecked-icon-color-disabled, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
+$select-card-unchecked-border-color: var(--a2-select-card-unchecked-border-color, var(--a2-border-color-subdued, light-dark(var(--a2-color-neutral-80, #e6e6e6), var(--a2-color-neutral-700, #404040))));
+$select-card-unchecked-focus-ring-color: var(--a2-select-card-unchecked-focus-ring-color, var(--a2-focus-ring-color-default, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff)))));
+$select-card-unchecked-shadow-color: var(--a2-select-card-unchecked-shadow-color, var(--a2-shadow-color-default, light-dark(#1a1a1a14, #ffffff14)));
+$select-card-checked-foreground-color: var(--a2-select-card-checked-foreground-color, var(--a2-foreground-color-primary, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff))));
+$select-card-checked-foreground-color-hover: var(--a2-select-card-checked-foreground-color-hover, var(--a2-foreground-color-primary-hover, light-dark(var(--a2-color-blue-700, #1d4ca3), var(--a2-color-blue-200, #9ecaff))));
+$select-card-checked-foreground-color-active: var(--a2-select-card-checked-foreground-color-active, var(--a2-foreground-color-primary-active, light-dark(var(--a2-color-blue-800, #003472), var(--a2-color-blue-200, #9ecaff))));
+$select-card-checked-default-background-color: var(--a2-select-card-checked-default-background-color, var(--a2-background-color-default, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$select-card-checked-default-background-color-hover: var(--a2-select-card-checked-default-background-color-hover, var(--a2-background-color-default-hover, light-dark(var(--a2-color-neutral-20, #f9f9f9), var(--a2-color-neutral-800, #292929))));
+$select-card-checked-default-background-color-active: var(--a2-select-card-checked-default-background-color-active, var(--a2-background-color-default-active, light-dark(var(--a2-color-neutral-40, #f1f1f1), var(--a2-color-neutral-700, #404040))));
+$select-card-checked-strong-background-color: var(--a2-select-card-checked-strong-background-color, var(--a2-background-color-strong, light-dark(var(--a2-color-neutral-20, #f9f9f9), var(--a2-color-neutral-800, #292929))));
+$select-card-checked-strong-background-color-hover: var(--a2-select-card-checked-strong-background-color-hover, var(--a2-background-color-strong-hover, light-dark(var(--a2-color-neutral-50, #eeeeee), var(--a2-color-neutral-700, #404040))));
+$select-card-checked-strong-background-color-active: var(--a2-select-card-checked-strong-background-color-active, var(--a2-background-color-strong-active, light-dark(var(--a2-color-neutral-70, #e8e8e8), var(--a2-color-neutral-600, #545454))));
+$select-card-checked-stronger-background-color: var(--a2-select-card-checked-stronger-background-color, var(--a2-background-color-stronger, light-dark(var(--a2-color-neutral-50, #eeeeee), var(--a2-color-neutral-700, #404040))));
+$select-card-checked-stronger-background-color-hover: var(--a2-select-card-checked-stronger-background-color-hover, var(--a2-background-color-stronger-hover, light-dark(var(--a2-color-neutral-90, #e5e5e5), var(--a2-color-neutral-600, #545454))));
+$select-card-checked-stronger-background-color-active: var(--a2-select-card-checked-stronger-background-color-active, var(--a2-background-color-stronger-active, light-dark(var(--a2-color-neutral-100, #dfdfdf), var(--a2-color-neutral-500, #707070))));
+$select-card-checked-icon-color: var(--a2-select-card-checked-icon-color, var(--a2-foreground-color-primary, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff))));
+$select-card-checked-icon-color-disabled: var(--a2-select-card-checked-icon-color-disabled, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
+$select-card-checked-border-color: var(--a2-select-card-checked-border-color, var(--a2-border-color-strong, light-dark(var(--a2-color-neutral-700, #404040), var(--a2-color-neutral-80, #e6e6e6))));
+$select-card-checked-focus-ring-color: var(--a2-select-card-checked-focus-ring-color, var(--a2-focus-ring-color-default, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff)))));
+$select-card-checked-shadow-color: var(--a2-select-card-checked-shadow-color, var(--a2-shadow-color-default, light-dark(#1a1a1a14, #ffffff14)));
+$select-card-checked-error-foreground-color: var(--a2-select-card-checked-error-foreground-color, var(--a2-foreground-color-primary, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff))));
+$select-card-checked-error-foreground-color-hover: var(--a2-select-card-checked-error-foreground-color-hover, var(--a2-foreground-color-primary-hover, light-dark(var(--a2-color-blue-700, #1d4ca3), var(--a2-color-blue-200, #9ecaff))));
+$select-card-checked-error-foreground-color-active: var(--a2-select-card-checked-error-foreground-color-active, var(--a2-foreground-color-primary-active, light-dark(var(--a2-color-blue-800, #003472), var(--a2-color-blue-200, #9ecaff))));
+$select-card-checked-error-default-background-color: var(--a2-select-card-checked-error-default-background-color, var(--a2-background-color-default, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$select-card-checked-error-default-background-color-hover: var(--a2-select-card-checked-error-default-background-color-hover, var(--a2-background-color-default-hover, light-dark(var(--a2-color-neutral-20, #f9f9f9), var(--a2-color-neutral-800, #292929))));
+$select-card-checked-error-default-background-color-active: var(--a2-select-card-checked-error-default-background-color-active, var(--a2-background-color-default-active, light-dark(var(--a2-color-neutral-40, #f1f1f1), var(--a2-color-neutral-700, #404040))));
+$select-card-checked-error-strong-background-color: var(--a2-select-card-checked-error-strong-background-color, var(--a2-background-color-strong, light-dark(var(--a2-color-neutral-20, #f9f9f9), var(--a2-color-neutral-800, #292929))));
+$select-card-checked-error-strong-background-color-hover: var(--a2-select-card-checked-error-strong-background-color-hover, var(--a2-background-color-strong-hover, light-dark(var(--a2-color-neutral-50, #eeeeee), var(--a2-color-neutral-700, #404040))));
+$select-card-checked-error-strong-background-color-active: var(--a2-select-card-checked-error-strong-background-color-active, var(--a2-background-color-strong-active, light-dark(var(--a2-color-neutral-70, #e8e8e8), var(--a2-color-neutral-600, #545454))));
+$select-card-checked-error-stronger-background-color: var(--a2-select-card-checked-error-stronger-background-color, var(--a2-background-color-stronger, light-dark(var(--a2-color-neutral-50, #eeeeee), var(--a2-color-neutral-700, #404040))));
+$select-card-checked-error-stronger-background-color-hover: var(--a2-select-card-checked-error-stronger-background-color-hover, var(--a2-background-color-stronger-hover, light-dark(var(--a2-color-neutral-90, #e5e5e5), var(--a2-color-neutral-600, #545454))));
+$select-card-checked-error-stronger-background-color-active: var(--a2-select-card-checked-error-stronger-background-color-active, var(--a2-background-color-stronger-active, light-dark(var(--a2-color-neutral-100, #dfdfdf), var(--a2-color-neutral-500, #707070))));
+$select-card-checked-error-icon-color: var(--a2-select-card-checked-error-icon-color, var(--a2-foreground-color-danger, light-dark(var(--a2-color-red-600, #d62100), var(--a2-color-red-400, #ff5b3d))));
+$select-card-checked-error-icon-color-disabled: var(--a2-select-card-checked-error-icon-color-disabled, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
+$select-card-checked-error-border-color: var(--a2-select-card-checked-error-border-color, var(--a2-border-color-danger, light-dark(var(--a2-color-red-600, #d62100), var(--a2-color-red-200, #ffac9e))));
+$select-card-checked-error-focus-ring-color: var(--a2-select-card-checked-error-focus-ring-color, var(--a2-focus-ring-color-danger, var(--a2-status-color-danger, light-dark(var(--a2-color-red-600, #d62100), var(--a2-color-red-400, #ff5b3d)))));
+$select-card-checked-error-shadow-color: var(--a2-select-card-checked-error-shadow-color, var(--a2-shadow-color-default, light-dark(#1a1a1a14, #ffffff14)));
+$side-nav-link-default-foreground-color: var(--a2-side-nav-link-default-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$side-nav-link-default-foreground-color-hover: var(--a2-side-nav-link-default-foreground-color-hover, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$side-nav-link-default-foreground-color-active: var(--a2-side-nav-link-default-foreground-color-active, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$side-nav-link-default-foreground-color-disabled: var(--a2-side-nav-link-default-foreground-color-disabled, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
+$side-nav-link-default-background-color: var(--a2-side-nav-link-default-background-color, rgba(0, 0, 0, 0));
+$side-nav-link-default-background-color-hover: var(--a2-side-nav-link-default-background-color-hover, var(--a2-background-color-transparent-default-hover, light-dark(#8b8b8b14, #ffffff14)));
+$side-nav-link-default-background-color-active: var(--a2-side-nav-link-default-background-color-active, var(--a2-background-color-transparent-default-active, light-dark(#8b8b8b29, #ffffff29)));
+$side-nav-link-default-background-color-disabled: var(--a2-side-nav-link-default-background-color-disabled, var(--a2-background-color-transparent-default, rgba(0, 0, 0, 0)));
+$side-nav-link-default-focus-ring-color: var(--a2-side-nav-link-default-focus-ring-color, var(--a2-focus-ring-color-default, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff)))));
+$side-nav-link-active-foreground-color: var(--a2-side-nav-link-active-foreground-color, var(--a2-foreground-color-primary, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff))));
+$side-nav-link-active-foreground-color-hover: var(--a2-side-nav-link-active-foreground-color-hover, var(--a2-foreground-color-primary-hover, light-dark(var(--a2-color-blue-700, #1d4ca3), var(--a2-color-blue-200, #9ecaff))));
+$side-nav-link-active-foreground-color-active: var(--a2-side-nav-link-active-foreground-color-active, var(--a2-foreground-color-primary-active, light-dark(var(--a2-color-blue-800, #003472), var(--a2-color-blue-200, #9ecaff))));
+$side-nav-link-active-foreground-color-disabled: var(--a2-side-nav-link-active-foreground-color-disabled, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
+$side-nav-link-active-background-color: var(--a2-side-nav-link-active-background-color, var(--a2-background-color-primary-subdued, light-dark(var(--a2-color-blue-50, #e6f1ff), #70b1ff33)));
+$side-nav-link-active-background-color-hover: var(--a2-side-nav-link-active-background-color-hover, var(--a2-background-color-primary-subdued-hover, light-dark(var(--a2-color-blue-100, #cce3ff), #70b1ff4D)));
+$side-nav-link-active-background-color-active: var(--a2-side-nav-link-active-background-color-active, var(--a2-background-color-primary-subdued-active, light-dark(var(--a2-color-blue-200, #9ecaff), #70b1ff66)));
+$side-nav-link-active-background-color-disabled: var(--a2-side-nav-link-active-background-color-disabled, var(--a2-background-color-transparent-default, rgba(0, 0, 0, 0)));
+$side-nav-link-active-focus-ring-color: var(--a2-side-nav-link-active-focus-ring-color, var(--a2-focus-ring-color-default, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff)))));
+$side-nav-group-foreground-color: var(--a2-side-nav-group-foreground-color, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
+$skeleton-background-color: var(--a2-skeleton-background-color, var(--a2-background-color-stronger, light-dark(var(--a2-color-neutral-50, #eeeeee), var(--a2-color-neutral-700, #404040))));
+$skeleton-pulse-color: var(--a2-skeleton-pulse-color, var(--a2-background-color-transparent-default-hover, light-dark(#8b8b8b14, #ffffff14)));
+$spinner-foreground-color-primary: var(--a2-spinner-foreground-color-primary, var(--a2-background-color-primary, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff)))));
+$spinner-foreground-color-current: var(--a2-spinner-foreground-color-current, currentColor);
+$spinner-track-foreground-color: var(--a2-spinner-track-foreground-color, var(--a2-background-color-secondary, light-dark(#0404040F, #ffffff14)));
+$spinner-arc-foreground-color: var(--a2-spinner-arc-foreground-color, currentColor);
+$status-icon-info-fill-color: var(--a2-status-icon-info-fill-color, light-dark(var(--a2-color-blue-500, #1a82ff), var(--a2-color-blue-400, #3d95ff)));
+$status-icon-info-stroke-color: var(--a2-status-icon-info-stroke-color, light-dark(var(--a2-color-blue-700, #1d4ca3), var(--a2-color-blue-400, #3d95ff)));
+$status-icon-success-fill-color: var(--a2-status-icon-success-fill-color, light-dark(var(--a2-color-green-600, #077e50), var(--a2-color-green-400, #0bd085)));
+$status-icon-success-stroke-color: var(--a2-status-icon-success-stroke-color, light-dark(var(--a2-color-green-800, #04482e), var(--a2-color-green-400, #0bd085)));
+$status-icon-warning-fill-color: var(--a2-status-icon-warning-fill-color, light-dark(var(--a2-color-orange-400, #e37700), var(--a2-color-yellow-400, #ffc902)));
+$status-icon-warning-stroke-color: var(--a2-status-icon-warning-stroke-color, light-dark(var(--a2-color-orange-600, #964f00), var(--a2-color-yellow-400, #ffc902)));
+$status-icon-danger-fill-color: var(--a2-status-icon-danger-fill-color, light-dark(var(--a2-color-red-600, #d62100), var(--a2-color-red-400, #ff5b3d)));
+$status-icon-danger-stroke-color: var(--a2-status-icon-danger-stroke-color, light-dark(var(--a2-color-red-700, #a31900), var(--a2-color-red-400, #ff5b3d)));
+$stepper-focus-ring-color: var(--a2-stepper-focus-ring-color, var(--a2-focus-ring-color-default, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff)))));
+$stepper-step-default-label-foreground-color: var(--a2-stepper-step-default-label-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$stepper-step-default-link-foreground-color: var(--a2-stepper-step-default-link-foreground-color, var(--a2-foreground-color-primary, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff))));
+$stepper-step-default-background-color: var(--a2-stepper-step-default-background-color, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff))));
+$stepper-step-default-foreground-color: var(--a2-stepper-step-default-foreground-color, var(--a2-foreground-color-on-primary, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$stepper-step-default-track-color: var(--a2-stepper-step-default-track-color, var(--a2-background-color-stronger, light-dark(var(--a2-color-neutral-50, #eeeeee), var(--a2-color-neutral-700, #404040))));
+$stepper-step-default-circle-background-color: var(--a2-stepper-step-default-circle-background-color, var(--a2-background-color-default, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$stepper-step-default-circle-border-color: var(--a2-stepper-step-default-circle-border-color, var(--a2-border-color-default, light-dark(var(--a2-color-neutral-400, #8b8b8b), var(--a2-color-neutral-600, #545454))));
+$stepper-step-default-circle-icon-color: var(--a2-stepper-step-default-circle-icon-color, var(--a2-foreground-color-on-primary, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$stepper-step-current-label-foreground-color: var(--a2-stepper-step-current-label-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$stepper-step-current-background-color: var(--a2-stepper-step-current-background-color, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff))));
+$stepper-step-current-foreground-color: var(--a2-stepper-step-current-foreground-color, var(--a2-foreground-color-on-primary, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$stepper-step-current-track-color: var(--a2-stepper-step-current-track-color, var(--a2-background-color-stronger, light-dark(var(--a2-color-neutral-50, #eeeeee), var(--a2-color-neutral-700, #404040))));
+$stepper-step-current-circle-background-color: var(--a2-stepper-step-current-circle-background-color, var(--a2-background-color-default, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$stepper-step-current-circle-border-color: var(--a2-stepper-step-current-circle-border-color, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff))));
+$stepper-step-current-circle-icon-color: var(--a2-stepper-step-current-circle-icon-color, var(--a2-foreground-color-on-primary, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$stepper-step-complete-label-foreground-color: var(--a2-stepper-step-complete-label-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$stepper-step-complete-link-foreground-color: var(--a2-stepper-step-complete-link-foreground-color, var(--a2-foreground-color-primary, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff))));
+$stepper-step-complete-background-color: var(--a2-stepper-step-complete-background-color, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff))));
+$stepper-step-complete-foreground-color: var(--a2-stepper-step-complete-foreground-color, var(--a2-foreground-color-on-primary, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$stepper-step-complete-track-color: var(--a2-stepper-step-complete-track-color, var(--a2-background-color-stronger, light-dark(var(--a2-color-neutral-50, #eeeeee), var(--a2-color-neutral-700, #404040))));
+$stepper-step-complete-circle-background-color: var(--a2-stepper-step-complete-circle-background-color, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff))));
+$stepper-step-complete-circle-border-color: var(--a2-stepper-step-complete-circle-border-color, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff))));
+$stepper-step-complete-circle-icon-color: var(--a2-stepper-step-complete-circle-icon-color, var(--a2-foreground-color-on-primary, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$switch-unchecked-background-color: var(--a2-switch-unchecked-background-color, var(--a2-background-color-strongest, light-dark(var(--a2-color-neutral-200, #c4c4c4), var(--a2-color-neutral-500, #707070))));
+$switch-unchecked-background-color-hover: var(--a2-switch-unchecked-background-color-hover, var(--a2-background-color-strongest-hover, light-dark(var(--a2-color-neutral-300, #a8a8a8), var(--a2-color-neutral-400, #8b8b8b))));
+$switch-unchecked-background-color-active: var(--a2-switch-unchecked-background-color-active, var(--a2-background-color-strongest-active, light-dark(var(--a2-color-neutral-400, #8b8b8b), var(--a2-color-neutral-300, #a8a8a8))));
+$switch-unchecked-background-color-disabled: var(--a2-switch-unchecked-background-color-disabled, var(--a2-background-color-strongest, light-dark(var(--a2-color-neutral-200, #c4c4c4), var(--a2-color-neutral-500, #707070))));
+$switch-unchecked-thumb-background-color: var(--a2-switch-unchecked-thumb-background-color, var(--a2-background-color-default, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$switch-unchecked-thumb-shadow-color: var(--a2-switch-unchecked-thumb-shadow-color, var(--a2-shadow-color-strong, light-dark(#0404043D, #ffffff3D)));
+$switch-checked-background-color: var(--a2-switch-checked-background-color, var(--a2-background-color-primary, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff)))));
+$switch-checked-background-color-hover: var(--a2-switch-checked-background-color-hover, var(--a2-background-color-primary-hover, light-dark(var(--a2-color-blue-700, #1d4ca3), var(--a2-color-blue-200, #9ecaff))));
+$switch-checked-background-color-active: var(--a2-switch-checked-background-color-active, var(--a2-background-color-primary-active, light-dark(var(--a2-color-blue-800, #003472), var(--a2-color-blue-100, #cce3ff))));
+$switch-checked-background-color-disabled: var(--a2-switch-checked-background-color-disabled, var(--a2-background-color-strongest, light-dark(var(--a2-color-neutral-200, #c4c4c4), var(--a2-color-neutral-500, #707070))));
+$switch-checked-thumb-check-color: var(--a2-switch-checked-thumb-check-color, var(--a2-foreground-color-primary, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff))));
+$switch-checked-thumb-check-color-hover: var(--a2-switch-checked-thumb-check-color-hover, var(--a2-foreground-color-primary-hover, light-dark(var(--a2-color-blue-700, #1d4ca3), var(--a2-color-blue-200, #9ecaff))));
+$switch-checked-thumb-check-color-active: var(--a2-switch-checked-thumb-check-color-active, var(--a2-foreground-color-primary-active, light-dark(var(--a2-color-blue-800, #003472), var(--a2-color-blue-200, #9ecaff))));
+$switch-checked-thumb-check-color-disabled: var(--a2-switch-checked-thumb-check-color-disabled, var(--a2-background-color-strongest, light-dark(var(--a2-color-neutral-200, #c4c4c4), var(--a2-color-neutral-500, #707070))));
+$switch-checked-thumb-background-color: var(--a2-switch-checked-thumb-background-color, var(--a2-background-color-default, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$switch-checked-thumb-shadow-color: var(--a2-switch-checked-thumb-shadow-color, var(--a2-shadow-color-strong, light-dark(#0404043D, #ffffff3D)));
+$switch-focus-ring-color: var(--a2-switch-focus-ring-color, var(--a2-focus-ring-color-default, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff)))));
+$tab-border-color: var(--a2-tab-border-color, var(--a2-border-color-subdued, light-dark(var(--a2-color-neutral-80, #e6e6e6), var(--a2-color-neutral-700, #404040))));
+$tab-overflow-button-background-color: var(--a2-tab-overflow-button-background-color, var(--a2-background-color-strong, light-dark(var(--a2-color-neutral-20, #f9f9f9), var(--a2-color-neutral-800, #292929))));
+$tab-button-foreground-color: var(--a2-tab-button-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$tab-button-foreground-color-hover: var(--a2-tab-button-foreground-color-hover, var(--a2-foreground-color-default-hover, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$tab-button-foreground-color-active: var(--a2-tab-button-foreground-color-active, var(--a2-foreground-color-default-active, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$tab-button-background-color: var(--a2-tab-button-background-color, rgba(0, 0, 0, 0));
+$tab-button-background-color-hover: var(--a2-tab-button-background-color-hover, var(--a2-background-color-transparent-default-hover, light-dark(#8b8b8b14, #ffffff14)));
+$tab-button-background-color-active: var(--a2-tab-button-background-color-active, var(--a2-background-color-transparent-default-active, light-dark(#8b8b8b29, #ffffff29)));
+$tab-button-selected-indicator-background-color: var(--a2-tab-button-selected-indicator-background-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$tab-button-focus-ring-color: var(--a2-tab-button-focus-ring-color, var(--a2-focus-ring-color-default, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff)))));
+$text-field-input-foreground-color: var(--a2-text-field-input-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$text-field-input-placeholder-foreground-color: var(--a2-text-field-input-placeholder-foreground-color, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
+$text-field-input-wrapper-background-color: var(--a2-text-field-input-wrapper-background-color, var(--a2-background-color-default, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$text-field-input-wrapper-background-color-disabled: var(--a2-text-field-input-wrapper-background-color-disabled, var(--a2-background-color-strong, light-dark(var(--a2-color-neutral-20, #f9f9f9), var(--a2-color-neutral-800, #292929))));
+$text-field-input-wrapper-border-color-default: var(--a2-text-field-input-wrapper-border-color-default, var(--a2-border-color-default, light-dark(var(--a2-color-neutral-400, #8b8b8b), var(--a2-color-neutral-600, #545454))));
+$text-field-input-wrapper-border-color-danger: var(--a2-text-field-input-wrapper-border-color-danger, var(--a2-border-color-danger, light-dark(var(--a2-color-red-600, #d62100), var(--a2-color-red-200, #ffac9e))));
+$text-field-focus-ring-color-default: var(--a2-text-field-focus-ring-color-default, var(--a2-focus-ring-color-default, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff)))));
+$text-field-focus-ring-color-danger: var(--a2-text-field-focus-ring-color-danger, var(--a2-focus-ring-color-danger, var(--a2-status-color-danger, light-dark(var(--a2-color-red-600, #d62100), var(--a2-color-red-400, #ff5b3d)))));
+$text-foreground-color: var(--a2-text-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
+$text-foreground-color-subdued: var(--a2-text-foreground-color-subdued, var(--a2-foreground-color-subdued, light-dark(var(--a2-color-neutral-500, #707070), var(--a2-color-neutral-200, #c4c4c4))));
+$text-focus-ring-color: var(--a2-text-focus-ring-color, var(--a2-focus-ring-color-default, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff)))));
+$toast-stack-gradient-top-background: var(--a2-toast-stack-gradient-top-background, light-dark(linear-gradient(180deg, var(--a2-background-color-default, var(--a2-color-neutral-0, #ffffff)) 0%, var(--a2-background-color-transparent-default, rgba(0, 0, 0, 0)) 100%), linear-gradient(180deg, var(--a2-background-color-default, var(--a2-color-neutral-0, #ffffff)) 0%, var(--a2-background-color-transparent-default, rgba(0, 0, 0, 0)) 100%)));
+$toast-stack-gradient-bottom-background: var(--a2-toast-stack-gradient-bottom-background, light-dark(linear-gradient(180deg, var(--a2-background-color-transparent-default, rgba(0, 0, 0, 0)) 0%, var(--a2-background-color-default, var(--a2-color-neutral-0, #ffffff)) 100%), linear-gradient(180deg, var(--a2-background-color-transparent-default, rgba(0, 0, 0, 0)) 0%, var(--a2-background-color-default, var(--a2-color-neutral-0, #ffffff)) 100%)));
+$toast-stack-gradient-bottom-mask: var(--a2-toast-stack-gradient-bottom-mask, light-dark(linear-gradient(90deg, var(--a2-background-color-transparent-default, rgba(0, 0, 0, 0)) 0%, var(--a2-background-color-inverted-strong, var(--a2-color-neutral-900, #1a1a1a)) var(--a2-size-4, 1rem), var(--a2-background-color-inverted-strong, var(--a2-color-neutral-900, #1a1a1a)) calc(100% - var(--a2-size-4, 1rem)), var(--a2-background-color-transparent-default, rgba(0, 0, 0, 0)) 100%), linear-gradient(90deg, var(--a2-background-color-transparent-default, rgba(0, 0, 0, 0)) 0%, var(--a2-background-color-inverted-strong, var(--a2-color-neutral-900, #1a1a1a)) var(--a2-size-4, 1rem), var(--a2-background-color-inverted-strong, var(--a2-color-neutral-900, #1a1a1a)) calc(100% - var(--a2-size-4, 1rem)), var(--a2-background-color-transparent-default, rgba(0, 0, 0, 0)) 100%)));
+$toast-collapse-button-background-color: var(--a2-toast-collapse-button-background-color, var(--a2-background-color-inverted, light-dark(var(--a2-color-neutral-800, #292929), var(--a2-color-neutral-20, #f9f9f9))));
+$toast-collapse-button-background-color-hover: var(--a2-toast-collapse-button-background-color-hover, var(--a2-background-color-inverted-strong, light-dark(var(--a2-color-neutral-900, #1a1a1a), var(--a2-color-neutral-0, #ffffff))));
+$toast-collapse-button-foreground-color: var(--a2-toast-collapse-button-foreground-color, var(--a2-foreground-color-inverted, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$toast-collapse-button-foreground-color-hover: var(--a2-toast-collapse-button-foreground-color-hover, var(--a2-foreground-color-inverted, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$toast-shadow-color: var(--a2-toast-shadow-color, var(--a2-shadow-color-default, light-dark(#1a1a1a14, #ffffff14)));
+$toast-focus-ring-color: var(--a2-toast-focus-ring-color, var(--a2-focus-ring-color-default, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff)))));
+$toolbar-background-color: var(--a2-toolbar-background-color, var(--a2-background-color-transparent-default, rgba(0, 0, 0, 0)));
+$toolbar-background-color-hover: var(--a2-toolbar-background-color-hover, var(--a2-background-color-transparent-default-hover, light-dark(#8b8b8b14, #ffffff14)));
+$toolbar-toggle-border-color-primary: var(--a2-toolbar-toggle-border-color-primary, var(--a2-foreground-color-on-primary, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$toolbar-toggle-border-color-subdued: var(--a2-toolbar-toggle-border-color-subdued, var(--a2-background-color-primary-subdued, light-dark(var(--a2-color-blue-50, #e6f1ff), #70b1ff33)));
+$toolbar-toggle-border-color-subdued-active: var(--a2-toolbar-toggle-border-color-subdued-active, var(--a2-background-color-primary-subdued-active, light-dark(var(--a2-color-blue-200, #9ecaff), #70b1ff66)));
+$toolbar-toggle-border-color-subdued-hover: var(--a2-toolbar-toggle-border-color-subdued-hover, var(--a2-background-color-primary-subdued-hover, light-dark(var(--a2-color-blue-100, #cce3ff), #70b1ff4D)));
+$tooltip-foreground-color: var(--a2-tooltip-foreground-color, var(--a2-foreground-color-inverted, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+$tooltip-background-color: var(--a2-tooltip-background-color, var(--a2-background-color-inverted-strong, light-dark(var(--a2-color-neutral-900, #1a1a1a), var(--a2-color-neutral-0, #ffffff))));
+$tooltip-shadow-color: var(--a2-tooltip-shadow-color, var(--a2-shadow-color-default, light-dark(#1a1a1a14, #ffffff14)));