@rojaostudio/ds 1.0.2 → 2.0.0-next.1

package/styles/rds/components.css

@@ -0,0 +1,993 @@
+/* GENERATED by scripts/build-rds-tokens.ts from tokens/figma/*.txt. Do not edit. */
+@layer rds.tokens {
+:root, .ds-scope, .dark, .ds-plate {
+  /* actions */
+  --actionbar-background: var(--colors-primary-default);
+  --actionbar-divider: var(--colors-primary-light);
+  --actionbar-text: var(--text-on-primary);
+  --button-focus-ring: var(--focus-ring);
+  --button-action-fill-background-default: var(--colors-secondary-default);
+  --button-action-fill-label: var(--text-on-secondary);
+  --button-action-fill-icon: var(--text-on-secondary);
+  --button-action-fill-background-hover: var(--colors-secondary-hover);
+  --button-action-fill-background-active: var(--colors-secondary-active);
+  --button-disabled-fill-background: var(--surface-disabled);
+  --button-disabled-fill-label: var(--text-disabled);
+  --button-disabled-fill-icon: var(--text-disabled);
+  --button-action-outline-border: var(--text-action);
+  --button-action-outline-label: var(--text-action);
+  --button-action-outline-icon: var(--text-action);
+  --button-action-outline-background-hover: var(--surface-action-default);
+  --button-action-outline-background-active: var(--surface-action-strong);
+  --button-disabled-outline-border: var(--text-disabled);
+  --button-disabled-outline-label: var(--text-disabled);
+  --button-disabled-outline-icon: var(--text-disabled);
+  --button-action-ghost-label: var(--text-action);
+  --button-action-ghost-icon: var(--text-action);
+  --button-action-ghost-background-hover: var(--surface-action-default);
+  --button-action-ghost-background-active: var(--surface-action-strong);
+  --button-disabled-ghost-label: var(--text-disabled);
+  --button-disabled-ghost-icon: var(--text-disabled);
+  --button-neutral-fill-background-default: var(--colors-primary-default);
+  --button-neutral-fill-label: var(--text-on-primary-strong);
+  --button-neutral-fill-icon: var(--text-on-primary-strong);
+  --button-neutral-fill-background-hover: var(--colors-primary-dark);
+  --button-neutral-fill-background-active: var(--colors-primary-active);
+  --button-neutral-outline-border: var(--text-heading);
+  --button-neutral-outline-label: var(--text-heading);
+  --button-neutral-outline-icon: var(--text-heading);
+  --button-neutral-outline-background-hover: var(--surface-muted);
+  --button-neutral-outline-background-active: var(--surface-muted-strong);
+  --button-neutral-ghost-label: var(--text-heading);
+  --button-neutral-ghost-icon: var(--text-heading);
+  --button-neutral-ghost-background-hover: var(--surface-muted);
+  --button-neutral-ghost-background-active: var(--surface-muted-strong);
+  --button-danger-fill-background-default: var(--colors-state-error);
+  --button-danger-fill-label: var(--text-on-error);
+  --button-danger-fill-icon: var(--text-on-error);
+  --button-danger-fill-background-hover: var(--colors-state-error-strong);
+  --button-danger-fill-background-active: var(--colors-state-error-active);
+  --button-danger-outline-border: var(--text-error);
+  --button-danger-outline-label: var(--text-error);
+  --button-danger-outline-icon: var(--text-error);
+  --button-danger-outline-background-hover: var(--surface-error);
+  --button-danger-outline-background-active: var(--surface-error-strong);
+  --button-danger-ghost-label: var(--text-error);
+  --button-danger-ghost-icon: var(--text-error);
+  --button-danger-ghost-background-hover: var(--surface-error);
+  --button-danger-ghost-background-active: var(--surface-error-strong);
+  --button-inverse-fill-background-default: var(--surface-card);
+  --button-inverse-fill-background-hover: var(--surface-muted);
+  --button-inverse-fill-background-active: var(--surface-muted-strong);
+  --button-inverse-fill-label: var(--colors-primary-default);
+  --button-inverse-fill-icon: var(--colors-primary-default);
+  --button-inverse-outline-border: var(--text-on-primary-strong);
+  --button-inverse-outline-label: var(--text-on-primary-strong);
+  --button-inverse-outline-icon: var(--text-on-primary-strong);
+  --button-inverse-outline-background-hover: var(--colors-primary-light);
+  --button-inverse-outline-background-active: var(--colors-primary-active);
+  --button-inverse-ghost-label: var(--text-on-primary-strong);
+  --button-inverse-ghost-icon: var(--text-on-primary-strong);
+  --button-inverse-ghost-background-hover: var(--colors-primary-light);
+  --button-inverse-ghost-background-active: var(--colors-primary-active);
+  --button-inverse-focus-ring: var(--text-on-primary-strong);
+  --button-inverse-disabled-fill-background: var(--colors-primary-light);
+  --button-inverse-disabled-label: var(--text-disabled-invert);
+  --savingbar-background: var(--colors-primary-default);
+  --toggle-label: var(--text-body);
+  --toggle-border: var(--border-strong);
+  --toggle-background-hover: var(--surface-muted);
+  --toggle-background-pressed: var(--surface-tint-subtle);
+  --toggle-background-pressed-hover: var(--surface-tint-default);
+  --toggle-label-pressed: var(--colors-primary-default);
+  --toggle-label-disabled: var(--text-disabled);
+  --toggle-border-pressed: var(--colors-primary-default);
+  --toggle-border-disabled: var(--border-default);
+  --savingbar-text: var(--text-on-primary);
+  --fab-cta-background-default: var(--colors-primary-default);
+  --fab-cta-background-hover: var(--colors-primary-active);
+  --fab-cta-text: var(--text-on-primary);
+  --chip-background: var(--surface-card);
+  --chip-background-hover: var(--surface-tint-default);
+  --chip-border: var(--border-default);
+  --chip-label: var(--text-body);
+  --chip-icon: var(--text-muted);
+  --chip-label-disabled: var(--text-disabled);
+  --form-actions-background: var(--surface-card);
+  --form-actions-border: var(--border-default);
+  --form-actions-text: var(--text-subtle);
+  --button-size-sm-height: 36px;
+  --button-size-sm-padding-x: var(--space-16);
+  --button-size-sm-padding-y: var(--space-8);
+  --button-size-sm-gap: var(--space-8);
+  --button-size-sm-icon: var(--size-16);
+  --button-size-sm-icon-only: var(--size-16);
+  --button-size-sm-text-size: var(--type-button-size);
+  --button-size-sm-text-line: var(--type-button-line);
+  --button-size-md-height: 44px;
+  --button-size-md-padding-x: var(--space-24);
+  --button-size-md-padding-y: var(--space-12);
+  --button-size-md-gap: var(--space-8);
+  --button-size-md-icon: var(--size-16);
+  --button-size-md-icon-only: var(--size-20);
+  --button-size-md-text-size: var(--type-button-size);
+  --button-size-md-text-line: var(--type-button-line);
+  --button-size-lg-height: 52px;
+  --button-size-lg-padding-x: var(--space-32);
+  --button-size-lg-padding-y: var(--space-12);
+  --button-size-lg-gap: var(--space-8);
+  --button-size-lg-icon: var(--size-20);
+  --button-size-lg-icon-only: var(--size-24);
+  --button-size-lg-text-size: var(--type-body-size);
+  --button-size-lg-text-line: var(--type-body-line);
+
+  /* blocks */
+  --topnav-background: var(--surface-card);
+  --topnav-border: var(--border-default);
+  --footer-background: var(--surface-card);
+  --footer-divider: var(--border-default);
+  --footer-legal: var(--text-muted);
+  --footer-link: var(--text-body);
+  --footer-tagline: var(--text-muted);
+  --footer-title: var(--text-muted);
+  --newsletter-background: var(--surface-card);
+  --newsletter-note: var(--text-muted);
+  --newsletter-text: var(--text-muted);
+  --newsletter-title: var(--text-heading);
+  --faq-background: var(--surface-card);
+  --faq-eyebrow: var(--text-muted);
+  --faq-text: var(--text-muted);
+  --faq-title: var(--text-heading);
+  --contact-background: var(--surface-card);
+  --contact-eyebrow: var(--text-muted);
+  --contact-text: var(--text-muted);
+  --contact-title: var(--text-heading);
+  --banner-background: var(--surface-muted);
+  --banner-highlight: var(--text-heading);
+  --banner-text: var(--text-body);
+  --benefits-background: var(--surface-card);
+  --benefits-eyebrow: var(--text-muted);
+  --benefits-text: var(--text-muted);
+  --benefits-title: var(--text-heading);
+  --benefits-item-background: var(--surface-card);
+  --benefits-item-border: var(--border-default);
+  --benefits-item-icon-background: var(--surface-muted);
+  --benefits-item-text: var(--text-muted);
+  --benefits-item-title: var(--text-heading);
+  --testimonial-background: var(--surface-card);
+  --testimonial-eyebrow: var(--text-muted);
+  --testimonial-text: var(--text-muted);
+  --testimonial-title: var(--text-heading);
+  --testimonial-item-background: var(--surface-card);
+  --testimonial-item-border: var(--border-default);
+  --testimonial-item-name: var(--text-heading);
+  --testimonial-item-quote: var(--text-body);
+  --testimonial-item-role: var(--text-muted);
+  --pricing-background: var(--surface-card);
+  --pricing-eyebrow: var(--text-muted);
+  --pricing-title: var(--text-heading);
+  --pricing-text: var(--text-muted);
+  --pricing-plan-background: var(--surface-card);
+  --pricing-plan-border: var(--border-default);
+  --pricing-plan-name: var(--text-muted);
+  --pricing-plan-price: var(--text-body);
+  --pricing-plan-period: var(--text-muted);
+  --pricing-plan-description: var(--text-muted);
+  --pricing-plan-feature: var(--text-body);
+  --pricing-plan-check: var(--text-action);
+  --pricing-plan-recommended-background: var(--colors-primary-default);
+  --pricing-plan-recommended-border: var(--colors-primary-default);
+  --pricing-plan-recommended-text: var(--text-on-primary);
+  --pricing-plan-recommended-check: var(--text-on-primary);
+
+  /* chat */
+  --attachment-background: var(--surface-card);
+  --attachment-border: var(--border-default);
+  --attachment-border-error: var(--colors-state-error);
+  --attachment-description: var(--text-muted);
+  --attachment-error: var(--text-error);
+  --attachment-media: var(--surface-muted);
+  --attachment-media-icon: var(--text-muted);
+  --attachment-title: var(--text-heading);
+  --bubble-error-background: var(--surface-error);
+  --bubble-error-text: var(--text-error);
+  --bubble-fill-background: var(--colors-primary-default);
+  --bubble-fill-text: var(--text-on-primary);
+  --bubble-ghost-text: var(--text-body);
+  --bubble-muted-background: var(--surface-muted);
+  --bubble-muted-text: var(--text-body);
+  --bubble-outline-background: var(--surface-card);
+  --bubble-outline-border: var(--border-default);
+  --bubble-outline-text: var(--text-body);
+  --bubble-reactions-background: var(--surface-card);
+  --bubble-reactions-border: var(--border-default);
+  --bubble-reactions-text: var(--text-muted);
+  --bubble-tinted-background: var(--surface-tint-default);
+  --bubble-tinted-text: var(--text-body);
+  --marker-border: var(--border-default);
+  --marker-icon: var(--text-muted);
+  --marker-line: var(--border-default);
+  --marker-text: var(--text-muted);
+  --message-name: var(--text-heading);
+  --message-time: var(--text-muted);
+  --questionnaire-background: var(--surface-card);
+  --questionnaire-border: var(--border-default);
+  --questionnaire-description: var(--text-muted);
+  --questionnaire-error: var(--text-error);
+  --questionnaire-title: var(--text-heading);
+  --scroller-background: var(--surface-card);
+  --attachment-done-icon: var(--colors-state-success-strong);
+  --bubble-typing-background: var(--surface-muted);
+  --bubble-typing-dot: var(--text-muted);
+
+  /* content */
+  --avatar-fallback-background: var(--surface-muted);
+  --avatar-fallback-label: var(--text-subtle);
+  --avatar-icon-background: var(--surface-muted);
+  --avatar-icon-icon: var(--text-body);
+  --avatar-presence-background: var(--colors-state-success);
+  --avatar-presence-border: var(--surface-card);
+  --avatar-group-border: var(--surface-card);
+  --separator-line: var(--border-default);
+  --tile-action-fill-background: var(--colors-secondary-default);
+  --tile-action-fill-icon: var(--text-on-secondary);
+  --tile-action-soft-background: var(--surface-tint-default);
+  --tile-action-soft-icon: var(--colors-primary-default);
+  --tile-neutral-fill-background: var(--colors-state-neutral);
+  --tile-neutral-fill-icon: var(--text-on-neutral);
+  --tile-neutral-soft-background: var(--surface-neutral);
+  --tile-neutral-soft-icon: var(--text-neutral);
+  --tile-info-fill-background: var(--colors-state-info);
+  --tile-info-fill-icon: var(--text-on-info);
+  --tile-info-soft-background: var(--surface-info);
+  --tile-info-soft-icon: var(--text-info);
+  --tile-success-fill-background: var(--colors-state-success);
+  --tile-success-fill-icon: var(--text-on-success);
+  --tile-success-soft-background: var(--surface-success);
+  --tile-success-soft-icon: var(--text-success);
+  --tile-warning-fill-background: var(--colors-state-warning);
+  --tile-warning-fill-icon: var(--text-on-warning);
+  --tile-warning-soft-background: var(--surface-warning);
+  --tile-warning-soft-icon: var(--text-warning);
+  --tile-danger-fill-background: var(--colors-state-error);
+  --tile-danger-fill-icon: var(--text-on-error);
+  --tile-danger-soft-background: var(--surface-error);
+  --tile-danger-soft-icon: var(--text-error);
+  --card-background: var(--surface-card);
+  --card-border: var(--border-default);
+  --card-footer-background: var(--surface-panel);
+  --card-title: var(--text-heading);
+  --card-description: var(--text-muted);
+  --card-tint-background: var(--surface-tint-default);
+  --card-tint-footer-background: var(--surface-tint-strong);
+  --kbd-background: var(--surface-muted);
+  --kbd-border: var(--border-default);
+  --kbd-label: var(--text-body);
+  --skeleton-background: var(--surface-muted);
+  --empty-title: var(--text-heading);
+  --empty-description: var(--text-muted);
+  --item-title: var(--text-heading);
+  --item-description: var(--text-muted);
+  --item-border: var(--border-default);
+  --item-muted-background: var(--surface-panel);
+  --table-background: var(--surface-card);
+  --table-header-background: var(--surface-panel);
+  --table-header-label: var(--text-muted);
+  --table-cell-label: var(--text-body);
+  --table-border: var(--border-default);
+  --accordion-title: var(--text-heading);
+  --accordion-content: var(--text-body);
+  --accordion-icon: var(--text-muted);
+  --accordion-border: var(--border-default);
+  --accordion-focus-ring: var(--focus-ring);
+  --avatar-brand-background: var(--colors-accent-mark);
+  --avatar-brand-label: var(--text-on-accent-mark);
+  --sparkline-line: var(--chart-series-1);
+  --sparkline-previous: var(--border-strong);
+  --sparkline-dot: var(--chart-series-1);
+  --chart-grid: var(--border-default);
+  --chart-axis: var(--text-subtle);
+  --chart-crosshair: var(--border-strong);
+  --chart-tooltip-background: var(--surface-card);
+  --chart-tooltip-border: var(--border-default);
+  --chart-label: var(--text-body);
+  --chart-tooltip-title: var(--text-heading);
+  --carousel-slide-background: var(--surface-muted);
+  --carousel-dot: var(--border-strong);
+  --carousel-dot-active: var(--colors-primary-default);
+  --carousel-placeholder: var(--text-subtle);
+  --choice-card-container-background-default: var(--surface-card);
+  --choice-card-container-background-selected: var(--colors-primary-default);
+  --choice-card-container-border-default: var(--border-default);
+  --choice-card-container-border-hover: var(--border-strong);
+  --choice-card-container-border-selected: var(--colors-primary-default);
+  --choice-card-label-color-default: var(--text-body);
+  --choice-card-label-color-selected: var(--text-on-primary);
+  --choice-card-description-color-default: var(--text-muted);
+  --choice-card-description-color-selected: var(--text-on-primary);
+  --choice-card-icon-background-default: var(--surface-muted);
+  --choice-card-icon-background-selected: var(--text-on-primary);
+  --choice-card-icon-color-default: var(--text-body);
+  --choice-card-icon-color-selected: var(--text-on-primary);
+  --choice-card-radio-border-default: var(--border-strong);
+  --choice-card-radio-border-selected: var(--text-on-primary);
+  --choice-card-radio-dot: var(--text-on-primary);
+  --insight-card-alert-border: var(--colors-state-warning);
+  --insight-card-alert-background: var(--surface-warning);
+  --insight-card-alert-badge-background: var(--surface-warning);
+  --insight-card-alert-badge-text: var(--text-warning);
+  --insight-card-opportunity-border: var(--colors-state-success);
+  --insight-card-opportunity-background: var(--surface-success);
+  --insight-card-opportunity-badge-background: var(--surface-success);
+  --insight-card-opportunity-badge-text: var(--text-success);
+  --insight-card-tip-border: var(--colors-state-info);
+  --insight-card-tip-background: var(--surface-info);
+  --insight-card-tip-badge-background: var(--surface-info);
+  --insight-card-tip-badge-text: var(--text-info);
+  --insight-card-title: var(--text-body);
+  --insight-card-description: var(--text-body);
+  --insight-card-potential: var(--text-muted);
+  --insight-card-action-background: var(--surface-card);
+  --insight-card-action-border: var(--border-default);
+  --insight-card-action-text: var(--text-body);
+  --section-card-container-border-default: var(--border-default);
+  --section-card-container-border-open: var(--colors-primary-default);
+  --section-card-header-background-open: var(--colors-primary-default);
+  --section-card-header-background-hover: var(--surface-muted);
+  --section-card-label-default: var(--text-body);
+  --section-card-label-open: var(--text-on-primary);
+  --section-card-badge-default: var(--text-muted);
+  --section-card-badge-open: var(--text-on-primary);
+  --section-card-chevron: var(--text-muted);
+  --section-card-divider: var(--border-default);
+  --section-card-body-background: var(--surface-card);
+  --chart-series-color-1: var(--chart-series-1);
+  --chart-series-color-2: var(--chart-series-2);
+  --chart-series-color-3: var(--chart-series-3);
+  --chart-series-color-4: var(--chart-series-4);
+  --chart-series-color-5: var(--chart-series-5);
+  --stat-background: var(--surface-card);
+  --stat-border: var(--border-default);
+  --stat-label: var(--text-muted);
+  --stat-caption: var(--text-muted);
+  --stat-value-default: var(--text-body);
+  --stat-value-positive: var(--text-success);
+  --stat-value-negative: var(--text-error);
+  --stat-value-warning: var(--text-warning);
+  --stat-value-muted: var(--text-muted);
+  --summary-bar-background: var(--surface-card);
+  --summary-bar-border: var(--border-default);
+  --summary-bar-divider: var(--border-default);
+  --media-tile-background: var(--surface-card);
+  --media-tile-border-default: var(--border-default);
+  --media-tile-border-hover: var(--focus-ring);
+  --media-tile-media: var(--surface-muted);
+  --media-tile-fallback: var(--text-subtle);
+  --media-tile-label: var(--text-body);
+  --choice-card-check-background-tile: var(--text-on-primary);
+  --choice-card-check-icon-tile: var(--colors-primary-default);
+  --choice-card-check-background-preview: var(--colors-primary-default);
+  --choice-card-check-icon-preview: var(--text-on-primary);
+  --choice-card-preview-background: var(--surface-muted);
+  --choice-card-preview-border: var(--border-default);
+  --choice-card-preview-icon: var(--text-subtle);
+
+  /* external */
+  --google-button-light-background: #ffffff;
+  --google-button-light-border: #747775;
+  --google-button-light-label: #1f1f1f;
+  --google-button-dark-background: #131314;
+  --google-button-dark-border: #8e918f;
+  --google-button-dark-label: #e3e3e3;
+  --google-button-neutral-background: #f2f2f2;
+  --google-button-neutral-label: #1f1f1f;
+  --google-m3-page: #f0f4f9;
+  --google-m3-card: #ffffff;
+  --google-m3-text: #1f1f1f;
+  --google-m3-text-variant: #444746;
+  --google-m3-primary: #0b57d0;
+  --google-m3-on-primary: #ffffff;
+  --google-m3-outline: #747775;
+  --google-m3-outline-variant: #c4c7c5;
+  --google-oauth-page: #ffffff;
+  --google-oauth-border: #dadce0;
+  --google-oauth-text: #202124;
+  --google-oauth-text-variant: #5f6368;
+  --google-oauth-primary: #1a73e8;
+  --google-oauth-on-primary: #ffffff;
+  --whatsapp-android-chat-background: #f5f1eb;
+  --whatsapp-android-bubble-in: #ffffff;
+  --whatsapp-android-bubble-out: #d9fdd3;
+  --whatsapp-android-text: #111b21;
+  --whatsapp-android-meta: #657781;
+  --whatsapp-android-meta-out: #657781;
+  --whatsapp-android-tick-read: #007bfc;
+  --whatsapp-android-button-label: #027eb5;
+  --whatsapp-android-divider: #e9edef;
+  --whatsapp-android-header: #ffffff;
+  --whatsapp-android-accent: #1daa61;
+  --whatsapp-android-banner: #d5fded;
+  --whatsapp-android-input: #ffffff;
+  --whatsapp-ios-chat-background: #f4f1ec;
+  --whatsapp-ios-bubble-in: #ffffff;
+  --whatsapp-ios-bubble-out: #d9fdd3;
+  --whatsapp-ios-text: #0a0a0a;
+  --whatsapp-ios-meta: #7f7f7f;
+  --whatsapp-ios-meta-out: #6c7d69;
+  --whatsapp-ios-tick-read: #3579f4;
+  --whatsapp-ios-button-label: #51a868;
+  --whatsapp-ios-button-used: #bdbdbd;
+  --whatsapp-ios-divider: #cccccc;
+  --whatsapp-ios-header: #f3f0ec;
+  --whatsapp-ios-accent: #1daa61;
+  --whatsapp-ios-input: #ffffff;
+  --phone-frame: #1c1c1e;
+  --phone-notch: #000000;
+  --phone-status-bar-background: var(--surface-card);
+  --phone-status-bar-content: var(--text-body);
+  --phone-screen: var(--surface-page);
+  --phone-browser-bar-background: var(--surface-panel);
+  --phone-browser-bar-icon: var(--text-muted);
+  --phone-address-background: var(--surface-muted);
+  --phone-address-text: var(--text-body);
+  --phone-system-bar-background: var(--surface-card);
+  --phone-home-indicator: var(--text-body);
+  --browser-frame-background: var(--surface-card);
+  --browser-frame-border: var(--border-default);
+  --browser-shadow: var(--shadow-key);
+  --browser-toolbar-background: var(--surface-panel);
+  --browser-toolbar-border: var(--border-default);
+  --browser-window-close: #ff5f57;
+  --browser-window-minimize: #febc2e;
+  --browser-window-zoom: #28c840;
+  --browser-window-border: var(--border-default);
+  --browser-navigation-default: var(--text-muted);
+  --browser-navigation-disabled: var(--text-disabled);
+  --browser-address-background: var(--surface-muted);
+  --browser-address-text: var(--text-body);
+  --browser-address-icon: var(--text-muted);
+  --browser-action: var(--text-muted);
+  --browser-screen: var(--surface-page);
+  --whatsapp-notification-card-background: var(--surface-card);
+  --whatsapp-notification-card-title: var(--text-body);
+  --whatsapp-notification-card-text: var(--text-body);
+  --whatsapp-notification-card-meta: var(--text-muted);
+  --whatsapp-notification-avatar-background: var(--surface-card);
+  --whatsapp-notification-avatar-border: var(--border-default);
+  --whatsapp-notification-wallpaper-start: #29334d;
+  --whatsapp-notification-wallpaper-end: #5c476b;
+  --whatsapp-notification-clock: #ffffff;
+
+  /* feedback */
+  --alert-text: var(--text-body);
+  --alert-neutral-background: var(--surface-neutral);
+  --alert-neutral-foreground: var(--text-neutral);
+  --alert-info-background: var(--surface-info);
+  --alert-info-foreground: var(--text-info);
+  --alert-success-background: var(--surface-success);
+  --alert-success-foreground: var(--text-success);
+  --alert-warning-background: var(--surface-warning);
+  --alert-warning-foreground: var(--text-warning);
+  --alert-danger-background: var(--surface-error);
+  --alert-danger-foreground: var(--text-error);
+  --alertdialog-background: var(--surface-card);
+  --alertdialog-border: var(--border-default);
+  --alertdialog-title: var(--text-heading);
+  --alertdialog-text: var(--text-body);
+  --alertdialog-scrim: var(--surface-scrim);
+  --toast-neutral-icon: var(--colors-state-neutral-strong);
+  --toast-info-icon: var(--colors-state-info-strong);
+  --toast-success-icon: var(--colors-state-success-strong);
+  --toast-warning-icon: var(--colors-state-warning-strong);
+  --toast-danger-icon: var(--colors-state-error);
+  --hovercard-background: var(--surface-card);
+  --hovercard-border: var(--border-default);
+  --hovercard-title: var(--text-heading);
+  --hovercard-text: var(--text-body);
+  --hovercard-meta: var(--text-muted);
+  --popover-background: var(--surface-card);
+  --popover-border: var(--border-default);
+  --popover-title: var(--text-heading);
+  --popover-text: var(--text-body);
+  --toast-background: var(--surface-card);
+  --toast-border: var(--border-default);
+  --toast-title: var(--text-heading);
+  --toast-text: var(--text-muted);
+  --tooltip-background: var(--colors-primary-default);
+  --tooltip-text: var(--text-on-primary-strong);
+  --toast-neutral-soft-background: var(--surface-neutral);
+  --toast-neutral-soft-text: var(--text-neutral);
+  --toast-neutral-fill-background: var(--colors-state-neutral);
+  --toast-neutral-fill-text: var(--text-on-neutral);
+  --toast-info-soft-background: var(--surface-info);
+  --toast-info-soft-text: var(--text-info);
+  --toast-info-fill-background: var(--colors-state-info);
+  --toast-info-fill-text: var(--text-on-info);
+  --toast-success-soft-background: var(--surface-success);
+  --toast-success-soft-text: var(--text-success);
+  --toast-success-fill-background: var(--colors-state-success);
+  --toast-success-fill-text: var(--text-on-success);
+  --toast-warning-soft-background: var(--surface-warning);
+  --toast-warning-soft-text: var(--text-warning);
+  --toast-warning-fill-background: var(--colors-state-warning);
+  --toast-warning-fill-text: var(--text-on-warning);
+  --toast-danger-soft-background: var(--surface-error);
+  --toast-danger-soft-text: var(--text-error);
+  --toast-danger-fill-background: var(--colors-state-error);
+  --toast-danger-fill-text: var(--text-on-error);
+
+  /* forms */
+  --listbox-background: var(--surface-card);
+  --listbox-border: var(--border-default);
+  --listbox-option-background-hover: var(--surface-muted);
+  --listbox-option-background-selected: var(--surface-tint-default);
+  --listbox-option-text-default: var(--text-body);
+  --listbox-option-text-disabled: var(--text-disabled);
+  --listbox-option-icon-default: var(--text-muted);
+  --listbox-option-icon-disabled: var(--text-disabled);
+  --listbox-option-check: var(--colors-primary-default);
+  --listbox-option-text-size: var(--type-label-size);
+  --listbox-option-text-line: var(--type-label-line);
+  --input-background-default: var(--surface-card);
+  --input-background-disabled: var(--surface-disabled);
+  --input-border-default: var(--border-strong);
+  --input-border-hover: var(--border-strong-hover);
+  --input-border-focus: var(--focus-ring);
+  --input-border-error: var(--colors-state-error);
+  --input-border-disabled: var(--border-default);
+  --input-value-default: var(--text-body);
+  --input-value-disabled: var(--text-disabled);
+  --input-placeholder-default: var(--text-subtle);
+  --input-placeholder-disabled: var(--text-disabled);
+  --input-text-size: var(--type-label-size);
+  --input-text-line: var(--type-label-line);
+  --input-icon-default: var(--text-muted);
+  --input-icon-disabled: var(--text-disabled);
+  --input-affix-default: var(--text-muted);
+  --input-affix-disabled: var(--text-disabled);
+  --input-action-background-hover: var(--surface-muted);
+  --input-float-size: var(--type-caption-size);
+  --input-float-line: var(--type-caption-line);
+  --input-float-default: var(--text-muted);
+  --input-float-error: var(--text-error);
+  --input-float-disabled: var(--text-disabled);
+  --input-label-color: var(--text-heading);
+  --input-required-color: var(--text-error);
+  --input-hint-color: var(--text-muted);
+  --input-error-message-color: var(--text-error);
+  --input-support-size: var(--type-small-size);
+  --input-support-line: var(--type-small-line);
+  --textarea-background-default: var(--surface-card);
+  --textarea-background-disabled: var(--surface-disabled);
+  --textarea-border-default: var(--border-strong);
+  --textarea-border-hover: var(--border-strong-hover);
+  --textarea-border-focus: var(--focus-ring);
+  --textarea-border-error: var(--colors-state-error);
+  --textarea-border-disabled: var(--border-default);
+  --textarea-value-default: var(--text-body);
+  --textarea-value-disabled: var(--text-disabled);
+  --textarea-placeholder-default: var(--text-subtle);
+  --textarea-placeholder-disabled: var(--text-disabled);
+  --textarea-icon-default: var(--text-subtle);
+  --textarea-icon-disabled: var(--text-disabled);
+  --textarea-text-size: var(--type-label-size);
+  --textarea-text-line: var(--type-label-line);
+  --textarea-label-color: var(--text-heading);
+  --textarea-required-color: var(--text-error);
+  --textarea-hint-color: var(--text-muted);
+  --textarea-error-message-color: var(--text-error);
+  --textarea-support-size: var(--type-small-size);
+  --textarea-support-line: var(--type-small-line);
+  --select-background-default: var(--surface-card);
+  --select-background-disabled: var(--surface-disabled);
+  --select-border-default: var(--border-strong);
+  --select-border-hover: var(--border-strong-hover);
+  --select-border-focus: var(--focus-ring);
+  --select-border-error: var(--colors-state-error);
+  --select-border-disabled: var(--border-default);
+  --select-value-default: var(--text-body);
+  --select-value-disabled: var(--text-disabled);
+  --select-placeholder-default: var(--text-subtle);
+  --select-placeholder-disabled: var(--text-disabled);
+  --select-text-size: var(--type-label-size);
+  --select-text-line: var(--type-label-line);
+  --select-icon-default: var(--text-muted);
+  --select-icon-disabled: var(--text-disabled);
+  --select-float-size: var(--type-caption-size);
+  --select-float-line: var(--type-caption-line);
+  --select-float-default: var(--text-muted);
+  --select-float-error: var(--text-error);
+  --select-float-disabled: var(--text-disabled);
+  --select-label-color: var(--text-heading);
+  --select-required-color: var(--text-error);
+  --select-hint-color: var(--text-muted);
+  --select-error-message-color: var(--text-error);
+  --select-support-size: var(--type-small-size);
+  --select-support-line: var(--type-small-line);
+  --checkbox-control-background-default: var(--surface-card);
+  --checkbox-control-background-checked: var(--colors-secondary-default);
+  --checkbox-control-background-checked-hover: var(--colors-secondary-hover);
+  --checkbox-control-background-disabled: var(--surface-disabled);
+  --checkbox-control-background-checked-disabled: var(--text-disabled);
+  --checkbox-control-border-default: var(--border-strong);
+  --checkbox-control-border-hover: var(--border-strong-hover);
+  --checkbox-control-border-error: var(--colors-state-error);
+  --checkbox-control-border-disabled: var(--border-default);
+  --checkbox-control-mark: var(--text-on-secondary);
+  --checkbox-control-mark-disabled: var(--surface-card);
+  --checkbox-label-color: var(--text-body);
+  --checkbox-label-disabled: var(--text-disabled);
+  --checkbox-required-color: var(--text-error);
+  --checkbox-hint-color: var(--text-muted);
+  --checkbox-error-message-color: var(--text-error);
+  --checkbox-text-size: var(--type-label-size);
+  --checkbox-text-line: var(--type-label-line);
+  --checkbox-support-size: var(--type-small-size);
+  --checkbox-support-line: var(--type-small-line);
+  --checkbox-focus-ring: var(--focus-ring);
+  --radio-control-background-default: var(--surface-card);
+  --radio-control-background-checked: var(--colors-secondary-default);
+  --radio-control-background-checked-hover: var(--colors-secondary-hover);
+  --radio-control-background-disabled: var(--surface-disabled);
+  --radio-control-background-checked-disabled: var(--text-disabled);
+  --radio-control-border-default: var(--border-strong);
+  --radio-control-border-hover: var(--border-strong-hover);
+  --radio-control-border-error: var(--colors-state-error);
+  --radio-control-border-disabled: var(--border-default);
+  --radio-control-dot: var(--text-on-secondary);
+  --radio-control-dot-disabled: var(--surface-card);
+  --radio-label-color: var(--text-body);
+  --radio-label-disabled: var(--text-disabled);
+  --radio-hint-color: var(--text-muted);
+  --radio-text-size: var(--type-label-size);
+  --radio-text-line: var(--type-label-line);
+  --radio-support-size: var(--type-small-size);
+  --radio-support-line: var(--type-small-line);
+  --radio-focus-ring: var(--focus-ring);
+  --switch-track-off: var(--border-strong);
+  --switch-track-off-hover: var(--border-strong-hover);
+  --switch-track-on: var(--colors-secondary-default);
+  --switch-track-on-hover: var(--colors-secondary-hover);
+  --switch-track-disabled: var(--surface-disabled);
+  --switch-track-on-disabled: var(--text-disabled);
+  --switch-thumb-default: var(--surface-card);
+  --switch-label-color: var(--text-body);
+  --switch-label-disabled: var(--text-disabled);
+  --switch-hint-color: var(--text-muted);
+  --switch-text-size: var(--type-label-size);
+  --switch-text-line: var(--type-label-line);
+  --switch-support-size: var(--type-small-size);
+  --switch-support-line: var(--type-small-line);
+  --switch-focus-ring: var(--focus-ring);
+  --checkboxgroup-legend-color: var(--text-heading);
+  --checkboxgroup-required-color: var(--text-error);
+  --checkboxgroup-hint-color: var(--text-muted);
+  --checkboxgroup-error-message-color: var(--text-error);
+  --checkboxgroup-legend-size: var(--type-label-size);
+  --checkboxgroup-legend-line: var(--type-label-line);
+  --checkboxgroup-support-size: var(--type-small-size);
+  --checkboxgroup-support-line: var(--type-small-line);
+  --radiogroup-legend-color: var(--text-heading);
+  --radiogroup-required-color: var(--text-error);
+  --radiogroup-hint-color: var(--text-muted);
+  --radiogroup-error-message-color: var(--text-error);
+  --radiogroup-legend-size: var(--type-label-size);
+  --radiogroup-legend-line: var(--type-label-line);
+  --radiogroup-support-size: var(--type-small-size);
+  --radiogroup-support-line: var(--type-small-line);
+  --slider-track: var(--border-strong);
+  --slider-range: var(--colors-primary-default);
+  --slider-thumb-background: var(--surface-card);
+  --slider-thumb-border: var(--colors-primary-default);
+  --slider-track-disabled: var(--border-default);
+  --slider-range-disabled: var(--text-disabled);
+  --slider-thumb-border-disabled: var(--text-disabled);
+  --slider-label: var(--text-body);
+  --slider-value: var(--text-muted);
+  --slider-label-disabled: var(--text-disabled);
+  --slider-focus-ring: var(--focus-ring);
+  --otp-caret: var(--text-body);
+  --otp-digit-default: var(--text-body);
+  --otp-digit-disabled: var(--text-disabled);
+  --otp-digit-line: var(--type-value-line);
+  --otp-digit-size: var(--type-value-size);
+  --otp-error-message: var(--text-error);
+  --otp-hint: var(--text-muted);
+  --otp-label: var(--text-heading);
+  --otp-separator: var(--text-subtle);
+  --otp-slot-background-default: var(--surface-card);
+  --otp-slot-background-disabled: var(--surface-disabled);
+  --otp-slot-border-default: var(--border-strong);
+  --otp-slot-border-active: var(--focus-ring);
+  --otp-slot-border-error: var(--colors-state-error);
+  --otp-slot-border-disabled: var(--border-default);
+  --combobox-empty: var(--text-muted);
+  --calendar-background: var(--surface-card);
+  --calendar-border: var(--border-default);
+  --calendar-day-background-hover: var(--surface-muted);
+  --calendar-day-background-selected: var(--colors-primary-default);
+  --calendar-day-border-today: var(--colors-primary-default);
+  --calendar-day-label-default: var(--text-body);
+  --calendar-day-label-selected: var(--text-on-primary-strong);
+  --calendar-day-label-outside: var(--text-subtle);
+  --calendar-day-label-disabled: var(--text-disabled);
+  --calendar-title: var(--text-heading);
+  --calendar-weekday: var(--text-muted);
+  --filter-chip-surface-inactive: var(--surface-card);
+  --filter-chip-surface-active: var(--colors-primary-default);
+  --filter-chip-surface-hover: var(--surface-muted);
+  --filter-chip-surface-disabled: var(--surface-card);
+  --filter-chip-stroke-inactive: var(--border-default);
+  --filter-chip-stroke-active: var(--colors-primary-default);
+  --filter-chip-stroke-hover: var(--border-strong);
+  --filter-chip-stroke-disabled: var(--border-default);
+  --filter-chip-text-inactive: var(--text-muted);
+  --filter-chip-text-active: var(--colors-primary-default);
+  --filter-chip-text-hover: var(--text-body);
+  --filter-chip-text-disabled: var(--text-disabled);
+  --file-input-area-background-default: var(--surface-card);
+  --file-input-area-background-hover: var(--surface-tint-subtle);
+  --file-input-area-background-disabled: var(--surface-disabled);
+  --file-input-area-border-default: var(--border-strong);
+  --file-input-area-border-hover: var(--focus-ring);
+  --file-input-area-border-focus: var(--focus-ring);
+  --file-input-area-border-error: var(--colors-state-error);
+  --file-input-area-border-disabled: var(--border-default);
+  --file-input-area-icon-default: var(--colors-primary-default);
+  --file-input-area-icon-disabled: var(--text-disabled);
+  --file-input-area-icon-background-default: var(--surface-tint-default);
+  --file-input-area-icon-background-disabled: var(--surface-muted);
+  --file-input-area-title-default: var(--text-body);
+  --file-input-area-title-disabled: var(--text-disabled);
+  --file-input-area-caption-default: var(--text-muted);
+  --file-input-area-caption-disabled: var(--text-disabled);
+  --file-input-area-title-size: var(--type-label-size);
+  --file-input-area-title-line: var(--type-label-line);
+  --file-input-area-caption-size: var(--type-small-size);
+  --file-input-area-caption-line: var(--type-small-line);
+  --file-input-file-background: var(--surface-muted);
+  --file-input-tile-preview-background: var(--surface-muted);
+  --file-input-tile-action-background: var(--surface-card);
+  --file-input-tile-action-border: var(--border-default);
+  --chip-input-background-default: var(--surface-card);
+  --chip-input-background-disabled: var(--surface-disabled);
+  --chip-input-border-default: var(--border-strong);
+  --chip-input-border-hover: var(--border-strong-hover);
+  --chip-input-border-focus: var(--focus-ring);
+  --chip-input-border-error: var(--colors-state-error);
+  --chip-input-border-disabled: var(--border-default);
+  --chip-input-value-default: var(--text-body);
+  --chip-input-value-disabled: var(--text-disabled);
+  --chip-input-placeholder-default: var(--text-subtle);
+  --chip-input-placeholder-disabled: var(--text-disabled);
+  --chip-input-text-size: var(--type-label-size);
+  --chip-input-text-line: var(--type-label-line);
+  --chip-input-label-color: var(--text-heading);
+  --chip-input-required-color: var(--text-error);
+  --chip-input-hint-color: var(--text-muted);
+  --chip-input-error-message-color: var(--text-error);
+  --chip-input-support-size: var(--type-small-size);
+  --chip-input-support-line: var(--type-small-line);
+  --number-input-background-default: var(--surface-card);
+  --number-input-background-disabled: var(--surface-disabled);
+  --number-input-border-default: var(--border-strong);
+  --number-input-border-hover: var(--border-strong-hover);
+  --number-input-border-focus: var(--focus-ring);
+  --number-input-border-error: var(--colors-state-error);
+  --number-input-border-disabled: var(--border-default);
+  --number-input-value-default: var(--text-body);
+  --number-input-value-disabled: var(--text-disabled);
+  --number-input-placeholder-default: var(--text-subtle);
+  --number-input-placeholder-disabled: var(--text-disabled);
+  --number-input-text-size: var(--type-label-size);
+  --number-input-text-line: var(--type-label-line);
+  --number-input-label-color: var(--text-heading);
+  --number-input-required-color: var(--text-error);
+  --number-input-hint-color: var(--text-muted);
+  --number-input-error-message-color: var(--text-error);
+  --number-input-support-size: var(--type-small-size);
+  --number-input-support-line: var(--type-small-line);
+  --number-input-step-icon-default: var(--text-body);
+  --number-input-step-icon-disabled: var(--text-disabled);
+  --color-input-background-default: var(--surface-card);
+  --color-input-background-disabled: var(--surface-disabled);
+  --color-input-border-default: var(--border-strong);
+  --color-input-border-hover: var(--border-strong-hover);
+  --color-input-border-focus: var(--focus-ring);
+  --color-input-border-error: var(--colors-state-error);
+  --color-input-border-disabled: var(--border-default);
+  --color-input-value-default: var(--text-body);
+  --color-input-value-disabled: var(--text-disabled);
+  --color-input-placeholder-default: var(--text-subtle);
+  --color-input-placeholder-disabled: var(--text-disabled);
+  --color-input-text-size: var(--type-label-size);
+  --color-input-text-line: var(--type-label-line);
+  --color-input-label-color: var(--text-heading);
+  --color-input-required-color: var(--text-error);
+  --color-input-hint-color: var(--text-muted);
+  --color-input-error-message-color: var(--text-error);
+  --color-input-support-size: var(--type-small-size);
+  --color-input-support-line: var(--type-small-line);
+  --color-input-swatch-border: var(--border-default);
+  --color-input-swatch-selected: var(--focus-ring);
+  --color-input-palette-title: var(--text-heading);
+  --color-input-palette-caption: var(--text-muted);
+  --number-input-divider: var(--border-default);
+  --number-input-unit-default: var(--text-muted);
+  --number-input-unit-disabled: var(--text-disabled);
+
+  /* indicators */
+  --badge-neutral-fill-background: var(--colors-primary-default);
+  --badge-neutral-fill-label: var(--text-on-primary-strong);
+  --badge-neutral-soft-background: var(--surface-muted);
+  --badge-neutral-soft-label: var(--text-body);
+  --badge-action-fill-background: var(--colors-secondary-default);
+  --badge-action-fill-label: var(--text-on-secondary);
+  --badge-action-soft-background: var(--surface-action-default);
+  --badge-action-soft-label: var(--text-action);
+  --badge-accent-fill-background: var(--colors-accent-default);
+  --badge-accent-fill-label: var(--text-on-accent);
+  --badge-accent-highlight-background: var(--colors-accent-highlight);
+  --badge-accent-highlight-label: var(--text-heading);
+  --status-neutral-outline-background: var(--surface-card);
+  --status-neutral-outline-border: var(--border-default);
+  --status-neutral-outline-label: var(--text-body);
+  --status-neutral-outline-dot: var(--colors-state-neutral);
+  --status-neutral-fill-background: var(--colors-state-neutral);
+  --status-neutral-fill-label: var(--text-on-neutral);
+  --status-neutral-fill-dot: var(--text-on-neutral);
+  --status-info-outline-background: var(--surface-card);
+  --status-info-outline-border: var(--border-default);
+  --status-info-outline-label: var(--text-body);
+  --status-info-outline-dot: var(--colors-state-info);
+  --status-info-fill-background: var(--colors-state-info);
+  --status-info-fill-label: var(--text-on-info);
+  --status-info-fill-dot: var(--text-on-info);
+  --status-success-outline-background: var(--surface-card);
+  --status-success-outline-border: var(--border-default);
+  --status-success-outline-label: var(--text-body);
+  --status-success-outline-dot: var(--colors-state-success);
+  --status-success-fill-background: var(--colors-state-success);
+  --status-success-fill-label: var(--text-on-success);
+  --status-success-fill-dot: var(--text-on-success);
+  --status-warning-outline-background: var(--surface-card);
+  --status-warning-outline-border: var(--border-default);
+  --status-warning-outline-label: var(--text-body);
+  --status-warning-outline-dot: var(--colors-state-warning);
+  --status-warning-fill-background: var(--colors-state-warning);
+  --status-warning-fill-label: var(--text-on-warning);
+  --status-warning-fill-dot: var(--text-on-warning);
+  --status-danger-outline-background: var(--surface-card);
+  --status-danger-outline-border: var(--border-default);
+  --status-danger-outline-label: var(--text-body);
+  --status-danger-outline-dot: var(--colors-state-error);
+  --status-danger-fill-background: var(--colors-state-error);
+  --status-danger-fill-label: var(--text-on-error);
+  --status-danger-fill-dot: var(--text-on-error);
+  --status-neutral-soft-background: var(--surface-neutral);
+  --status-neutral-soft-label: var(--text-neutral);
+  --status-neutral-soft-dot: var(--colors-state-neutral);
+  --status-info-soft-background: var(--surface-info);
+  --status-info-soft-label: var(--text-info);
+  --status-info-soft-dot: var(--colors-state-info);
+  --status-success-soft-background: var(--surface-success);
+  --status-success-soft-label: var(--text-success);
+  --status-success-soft-dot: var(--colors-state-success);
+  --status-warning-soft-background: var(--surface-warning);
+  --status-warning-soft-label: var(--text-warning);
+  --status-warning-soft-dot: var(--colors-state-warning);
+  --status-danger-soft-background: var(--surface-error);
+  --status-danger-soft-label: var(--text-error);
+  --status-danger-soft-dot: var(--colors-state-error);
+  --delta-neutral: var(--text-body);
+  --delta-success: var(--text-success);
+  --delta-danger: var(--text-error);
+  --badge-inverse-fill-background: var(--surface-card);
+  --badge-inverse-fill-label: var(--colors-primary-default);
+  --progress-track: var(--surface-tint-strong);
+  --progress-fill: var(--chart-series-1);
+  --progress-label: var(--text-body);
+  --progress-value: var(--text-muted);
+  --spinner-indicator: var(--colors-primary-default);
+  --spinner-track: var(--surface-tint-strong);
+  --spinner-label: var(--text-muted);
+  --spinner-inverse-indicator: var(--text-on-primary-strong);
+  --spinner-inverse-label: var(--text-on-primary-strong);
+  --rating-empty: var(--border-strong);
+  --rating-label: var(--text-muted);
+  --rating-star: var(--colors-state-warning);
+  --spinner-inverse-track: var(--text-on-primary-subtle);
+  --step-progress-track: var(--border-default);
+  --step-progress-fill: var(--colors-primary-default);
+
+  /* navigation */
+  --tabs-border: var(--border-default);
+  --tabs-focus-ring: var(--focus-ring);
+  --tabs-indicator: var(--colors-primary-default);
+  --tabs-label-default: var(--text-muted);
+  --tabs-label-hover: var(--text-body);
+  --tabs-label-selected: var(--text-heading);
+  --tabs-label-disabled: var(--text-disabled);
+  --tabs-count-default: var(--text-muted);
+  --tabs-count-disabled: var(--text-disabled);
+  --breadcrumb-focus-ring: var(--focus-ring);
+  --breadcrumb-label-default: var(--text-muted);
+  --breadcrumb-label-hover: var(--text-body);
+  --breadcrumb-label-current: var(--text-heading);
+  --breadcrumb-separator: var(--text-subtle);
+  --sidebar-background: var(--surface-panel);
+  --sidebar-border: var(--border-default);
+  --sidebar-focus-ring: var(--focus-ring);
+  --sidebar-item-background-hover: var(--surface-muted);
+  --sidebar-item-background-active: var(--surface-tint-default);
+  --sidebar-item-label-default: var(--text-muted);
+  --sidebar-item-label-hover: var(--text-body);
+  --sidebar-item-label-active: var(--colors-primary-default);
+  --sidebar-module: var(--text-heading);
+  --sidebar-user: var(--text-muted);
+  --pagination-focus-ring: var(--focus-ring);
+  --pagination-item-background-hover: var(--surface-muted);
+  --pagination-item-background-current: var(--surface-tint-default);
+  --pagination-item-label-default: var(--text-body);
+  --pagination-item-label-current: var(--colors-primary-default);
+  --pagination-item-label-disabled: var(--text-disabled);
+  --pagination-summary: var(--text-muted);
+  --sidebar-item-count: var(--text-muted);
+  --sidebar-dark-background: var(--colors-primary-default);
+  --sidebar-dark-item-background-hover: var(--colors-primary-light);
+  --sidebar-dark-item-label-default: var(--text-on-primary);
+  --sidebar-dark-item-label-hover: var(--text-on-primary-strong);
+  --sidebar-dark-module: var(--text-on-primary-strong);
+  --sidebar-dark-user: var(--text-on-primary);
+  --breadcrumb-inverse-label-default: var(--text-on-primary);
+  --breadcrumb-inverse-label-hover: var(--text-on-primary-strong);
+  --breadcrumb-inverse-label-current: var(--text-on-primary-strong);
+  --breadcrumb-inverse-separator: var(--text-on-primary);
+  --pageheader-description: var(--text-muted);
+  --pageheader-title: var(--text-heading);
+  --navmenu-focus-ring: var(--focus-ring);
+  --navmenu-link-background-hover: var(--surface-muted);
+  --navmenu-link-description: var(--text-muted);
+  --navmenu-link-title: var(--text-heading);
+  --navmenu-panel-background: var(--surface-card);
+  --navmenu-panel-border: var(--border-default);
+  --navmenu-trigger-background-hover: var(--surface-muted);
+  --navmenu-trigger-background-open: var(--surface-muted);
+  --navmenu-trigger-label: var(--text-body);
+  --tabs-soon-background: var(--surface-muted);
+  --tabs-soon-text: var(--text-disabled);
+  --tabs-dot-background: var(--colors-state-success);
+  --tabs-dot-indicator: var(--colors-state-success);
+  --sidebar-section-label: var(--text-subtle);
+  --sidebar-dark-section-label: var(--text-on-primary);
+
+  /* overlays */
+  --menu-background: var(--surface-card);
+  --menu-border: var(--border-default);
+  --menu-item-label: var(--text-body);
+  --menu-item-icon: var(--text-muted);
+  --menu-item-background-hover: var(--surface-muted);
+  --menu-item-danger: var(--text-error);
+  --menu-item-disabled: var(--text-disabled);
+  --command-background: var(--surface-card);
+  --command-border: var(--border-default);
+  --command-group-label: var(--text-muted);
+  --command-icon: var(--text-muted);
+  --command-placeholder: var(--text-subtle);
+  --dialog-background: var(--surface-card);
+  --dialog-border: var(--border-default);
+  --dialog-text: var(--text-body);
+  --dialog-title: var(--text-heading);
+  --drawer-background: var(--surface-card);
+  --drawer-handle: var(--border-strong);
+  --drawer-scrim: var(--surface-scrim);
+  --drawer-text: var(--text-body);
+  --drawer-title: var(--text-heading);
+  --sheet-background: var(--surface-card);
+  --sheet-border: var(--border-default);
+  --sheet-scrim: var(--surface-scrim);
+  --sheet-text: var(--text-body);
+  --sheet-title: var(--text-heading);
+  --dialog-scrim: var(--surface-scrim);
+}
+}