/* FlatPack CSS Variables - Tailwind v4 Native Theming
 *
 * Token hierarchy:
 *   1. Brand primitives (--brand-hue, --brand-chroma, --brand-lightness) — change these to recolor primary
 *   2. Semantic tokens (--color-*, --surface-*, --radius-*, --shadow-*, --font-*, --text-*, --duration-*, --easing-*)
 *   3. Component tokens (--button-*, --sidebar-*, …) — defined once; prefer var(--semantic)
 *
 * @theme inline registers Tailwind utility names without emitting values (avoids duplicating :root
 *   and the circular `--x: var(--x)` trap when Tailwind also emits @theme onto :root).
 * :root is the single source of concrete values (browsers skip @theme when this file is a stylesheet).
 * [data-theme="…"] overrides only tokens that differ from :root.
 * [data-theme="rounded"] is a no-op alias of the default so hosts can keep the attribute.
 */

@theme inline {
  --brand-hue: var(--brand-hue);
  --brand-chroma: var(--brand-chroma);
  --brand-lightness: var(--brand-lightness);
  --color-primary: var(--color-primary);
  --color-primary-hover: var(--color-primary-hover);
  --color-primary-text: var(--color-primary-text);
  --color-default: var(--color-default);
  --color-default-hover: var(--color-default-hover);
  --color-default-text: var(--color-default-text);
  --color-default-border: var(--color-default-border);
  --color-secondary: var(--color-secondary);
  --color-secondary-hover: var(--color-secondary-hover);
  --color-secondary-text: var(--color-secondary-text);
  --color-ghost: var(--color-ghost);
  --color-ghost-hover: var(--color-ghost-hover);
  --color-ghost-text: var(--color-ghost-text);
  --color-success-background-color: var(--color-success-background-color);
  --color-success-hover-background-color: var(--color-success-hover-background-color);
  --color-success-text: var(--color-success-text);
  --color-success-border: var(--color-success-border);
  --color-warning-background-color: var(--color-warning-background-color);
  --color-warning-hover-background-color: var(--color-warning-hover-background-color);
  --color-warning-text: var(--color-warning-text);
  --color-warning-border: var(--color-warning-border);
  --color-warning: var(--color-warning);
  --color-danger-background-color: var(--color-danger-background-color);
  --color-danger-hover-background-color: var(--color-danger-hover-background-color);
  --color-danger-text-color: var(--color-danger-text-color);
  --color-danger-border-color: var(--color-danger-border-color);
  --color-error: var(--color-error);
  --color-error-border: var(--color-error-border);
  --color-info-border: var(--color-info-border);
  --surface-background-color: var(--surface-background-color);
  --surface-page-background-color: var(--surface-page-background-color);
  --surface-content-color: var(--surface-content-color);
  --surface-muted-background-color: var(--surface-muted-background-color);
  --surface-subtle-background-color: var(--surface-subtle-background-color);
  --surface-muted-content-color: var(--surface-muted-content-color);
  --surface-border-color: var(--surface-border-color);
  --surface-border-hover-color: var(--surface-border-hover-color);
  --checkbox-size: var(--checkbox-size);
  --checkbox-radius: var(--checkbox-radius);
  --checkbox-label-gap: var(--checkbox-label-gap);
  --collapse-background-color: var(--collapse-background-color);
  --collapse-border-color: var(--collapse-border-color);
  --collapse-border-radius: var(--collapse-border-radius);
  --collapse-trigger-background-color: var(--collapse-trigger-background-color);
  --collapse-trigger-hover-background-color: var(--collapse-trigger-hover-background-color);
  --collapse-trigger-text-color: var(--collapse-trigger-text-color);
  --collapse-trigger-padding: var(--collapse-trigger-padding);
  --collapse-content-background-color: var(--collapse-content-background-color);
  --collapse-content-padding: var(--collapse-content-padding);
  --collapse-focus-ring-color: var(--collapse-focus-ring-color);
  --collapse-transition-duration: var(--collapse-transition-duration);
  --collapse-icon-color: var(--collapse-icon-color);
  --bottom-nav-background-color: var(--bottom-nav-background-color);
  --bottom-nav-border-color: var(--bottom-nav-border-color);
  --bottom-nav-item-active-color: var(--bottom-nav-item-active-color);
  --bottom-nav-item-color: var(--bottom-nav-item-color);
  --bottom-nav-item-hover-color: var(--bottom-nav-item-hover-color);
  --bottom-nav-item-padding-x: var(--bottom-nav-item-padding-x);
  --bottom-nav-item-padding-y: var(--bottom-nav-item-padding-y);
  --quote-border-color: var(--quote-border-color);
  --quote-border-width: var(--quote-border-width);
  --quote-padding-left: var(--quote-padding-left);
  --quote-text-color: var(--quote-text-color);
  --quote-cite-color: var(--quote-cite-color);
  --quote-cite-margin-top: var(--quote-cite-margin-top);
  --timeline-marker-default-background-color: var(--timeline-marker-default-background-color);
  --timeline-marker-success-background-color: var(--timeline-marker-success-background-color);
  --timeline-marker-warning-background-color: var(--timeline-marker-warning-background-color);
  --timeline-marker-danger-background-color: var(--timeline-marker-danger-background-color);
  --timeline-marker-icon-color: var(--timeline-marker-icon-color);
  --timeline-line-color: var(--timeline-line-color);
  --timeline-title-color: var(--timeline-title-color);
  --timeline-timestamp-color: var(--timeline-timestamp-color);
  --timeline-content-color: var(--timeline-content-color);
  --timeline-item-padding-bottom: var(--timeline-item-padding-bottom);
  --timeline-content-padding-left: var(--timeline-content-padding-left);
  --timeline-line-min-height: var(--timeline-line-min-height);
  --accordion-background-color: var(--accordion-background-color);
  --accordion-border-color: var(--accordion-border-color);
  --accordion-border-radius: var(--accordion-border-radius);
  --accordion-item-border-color: var(--accordion-item-border-color);
  --accordion-trigger-text-color: var(--accordion-trigger-text-color);
  --accordion-trigger-hover-background-color: var(--accordion-trigger-hover-background-color);
  --accordion-trigger-padding: var(--accordion-trigger-padding);
  --accordion-content-background-color: var(--accordion-content-background-color);
  --accordion-content-padding: var(--accordion-content-padding);
  --accordion-focus-ring-color: var(--accordion-focus-ring-color);
  --accordion-transition-duration: var(--accordion-transition-duration);
  --breadcrumb-current-color: var(--breadcrumb-current-color);
  --breadcrumb-link-color: var(--breadcrumb-link-color);
  --breadcrumb-link-hover-color: var(--breadcrumb-link-hover-color);
  --breadcrumb-separator-color: var(--breadcrumb-separator-color);
  --breadcrumb-gap: var(--breadcrumb-gap);
  --breadcrumb-separator-gap: var(--breadcrumb-separator-gap);
  --switch-track-background-color: var(--switch-track-background-color);
  --switch-track-checked-background-color: var(--switch-track-checked-background-color);
  --switch-focus-ring-color: var(--switch-focus-ring-color);
  --switch-label-color: var(--switch-label-color);
  --switch-thumb-background-color: var(--switch-thumb-background-color);
  --switch-thumb-shadow: var(--switch-thumb-shadow);
  --switch-error-color: var(--switch-error-color);
  --skeleton-background-color: var(--skeleton-background-color);
  --skeleton-shimmer-highlight-color: var(--skeleton-shimmer-highlight-color);
  --skeleton-shimmer-duration: var(--skeleton-shimmer-duration);
  --code-block-background-color: var(--code-block-background-color);
  --code-block-border-color: var(--code-block-border-color);
  --code-block-title-color: var(--code-block-title-color);
  --code-block-code-color: var(--code-block-code-color);
  --code-block-tab-color: var(--code-block-tab-color);
  --code-block-tab-hover-color: var(--code-block-tab-hover-color);
  --code-block-tab-active-background-color: var(--code-block-tab-active-background-color);
  --code-block-tab-active-color: var(--code-block-tab-active-color);
  --tabs-pill-corner-radius: var(--tabs-pill-corner-radius);
  --tabs-pill-active-background-color: var(--tabs-pill-active-background-color);
  --tabs-pill-active-border-color: var(--tabs-pill-active-border-color);
  --tabs-pill-active-text-color: var(--tabs-pill-active-text-color);
  --tabs-stacked-pill-list-background-color: var(--tabs-stacked-pill-list-background-color);
  --tabs-pill-list-border-color: var(--tabs-pill-list-border-color);
  --tabs-pill-active-shadow: var(--tabs-pill-active-shadow);
  --tabs-pill-inactive-text-color: var(--tabs-pill-inactive-text-color);
  --tabs-pill-inactive-hover-background-color: var(--tabs-pill-inactive-hover-background-color);
  --tabs-pill-inactive-hover-text-color: var(--tabs-pill-inactive-hover-text-color);
  --card-background-color: var(--card-background-color);
  --card-background-muted-color: var(--card-background-muted-color);
  --card-border-color: var(--card-border-color);
  --card-padding-sm: var(--card-padding-sm);
  --card-padding-md: var(--card-padding-md);
  --card-padding-lg: var(--card-padding-lg);
  --card-hover-subtle-background-color: var(--card-hover-subtle-background-color);
  --card-hover-strong-border-color: var(--card-hover-strong-border-color);
  --card-hover-strong-shadow: var(--card-hover-strong-shadow);
  --card-hover-strong-shadow-dark: var(--card-hover-strong-shadow-dark);
  --hero-overlay-background-color: var(--hero-overlay-background-color);
  --hero-overlay-left-background: var(--hero-overlay-left-background);
  --hero-overlay-text-color: var(--hero-overlay-text-color);
  --hero-overlay-muted-text-color: var(--hero-overlay-muted-text-color);
  --hero-overlay-button-primary-background-color: var(--hero-overlay-button-primary-background-color);
  --hero-overlay-button-primary-hover-background-color: var(--hero-overlay-button-primary-hover-background-color);
  --hero-overlay-button-primary-text-color: var(--hero-overlay-button-primary-text-color);
  --hero-overlay-button-primary-border-color: var(--hero-overlay-button-primary-border-color);
  --hero-overlay-button-secondary-background-color: var(--hero-overlay-button-secondary-background-color);
  --hero-overlay-button-secondary-hover-background-color: var(--hero-overlay-button-secondary-hover-background-color);
  --hero-overlay-button-secondary-text-color: var(--hero-overlay-button-secondary-text-color);
  --hero-overlay-button-secondary-border-color: var(--hero-overlay-button-secondary-border-color);
  --hero-overlay-on-light-background-color: var(--hero-overlay-on-light-background-color);
  --hero-overlay-on-light-left-background: var(--hero-overlay-on-light-left-background);
  --hero-overlay-on-light-text-color: var(--hero-overlay-on-light-text-color);
  --hero-overlay-on-light-muted-text-color: var(--hero-overlay-on-light-muted-text-color);
  --hero-overlay-on-light-button-primary-background-color: var(--hero-overlay-on-light-button-primary-background-color);
  --hero-overlay-on-light-button-primary-hover-background-color: var(--hero-overlay-on-light-button-primary-hover-background-color);
  --hero-overlay-on-light-button-primary-text-color: var(--hero-overlay-on-light-button-primary-text-color);
  --hero-overlay-on-light-button-primary-border-color: var(--hero-overlay-on-light-button-primary-border-color);
  --hero-overlay-on-light-button-secondary-background-color: var(--hero-overlay-on-light-button-secondary-background-color);
  --hero-overlay-on-light-button-secondary-hover-background-color: var(--hero-overlay-on-light-button-secondary-hover-background-color);
  --hero-overlay-on-light-button-secondary-text-color: var(--hero-overlay-on-light-button-secondary-text-color);
  --hero-overlay-on-light-button-secondary-border-color: var(--hero-overlay-on-light-button-secondary-border-color);
  --hero-overlay-min-height: var(--hero-overlay-min-height);
  --hero-overlay-copy-padding-top: var(--hero-overlay-copy-padding-top);
  --carousel-viewport-background-color: var(--carousel-viewport-background-color);
  --carousel-viewport-border-color: var(--carousel-viewport-border-color);
  --carousel-chevron-background-color: var(--carousel-chevron-background-color);
  --carousel-control-background-color: var(--carousel-control-background-color);
  --carousel-control-hover-background-color: var(--carousel-control-hover-background-color);
  --carousel-control-text-color: var(--carousel-control-text-color);
  --carousel-counter-background-color: var(--carousel-counter-background-color);
  --carousel-counter-text-color: var(--carousel-counter-text-color);
  --carousel-indicator-track-background-color: var(--carousel-indicator-track-background-color);
  --carousel-indicator-background-color: var(--carousel-indicator-background-color);
  --carousel-indicator-active-background-color: var(--carousel-indicator-active-background-color);
  --carousel-thumb-border-color: var(--carousel-thumb-border-color);
  --carousel-thumb-placeholder-background-color: var(--carousel-thumb-placeholder-background-color);
  --carousel-thumb-placeholder-text-color: var(--carousel-thumb-placeholder-text-color);
  --carousel-caption-overlay-background-color: var(--carousel-caption-overlay-background-color);
  --carousel-caption-overlay-text-color: var(--carousel-caption-overlay-text-color);
  --carousel-caption-below-text-color: var(--carousel-caption-below-text-color);
  --carousel-media-background-color: var(--carousel-media-background-color);
  --carousel-lightbox-image-background-color: var(--carousel-lightbox-image-background-color);
  --modal-backdrop-color: var(--modal-backdrop-color);
  --modal-surface-color: var(--modal-surface-color);
  --modal-border-color: var(--modal-border-color);
  --modal-title-color: var(--modal-title-color);
  --modal-body-color: var(--modal-body-color);
  --modal-close-icon-color: var(--modal-close-icon-color);
  --modal-close-icon-hover-color: var(--modal-close-icon-hover-color);
  --drawer-backdrop-color: var(--drawer-backdrop-color);
  --drawer-surface-color: var(--drawer-surface-color);
  --drawer-border-color: var(--drawer-border-color);
  --drawer-title-color: var(--drawer-title-color);
  --drawer-body-color: var(--drawer-body-color);
  --drawer-close-icon-color: var(--drawer-close-icon-color);
  --drawer-close-icon-hover-color: var(--drawer-close-icon-hover-color);
  --kbd-background-color: var(--kbd-background-color);
  --kbd-border-color: var(--kbd-border-color);
  --kbd-text-color: var(--kbd-text-color);
  --kbd-muted-color: var(--kbd-muted-color);
  --skip-link-background-color: var(--skip-link-background-color);
  --skip-link-text-color: var(--skip-link-text-color);
  --stepper-current-color: var(--stepper-current-color);
  --stepper-complete-color: var(--stepper-complete-color);
  --stepper-upcoming-color: var(--stepper-upcoming-color);
  --stepper-label-color: var(--stepper-label-color);
  --stepper-muted-color: var(--stepper-muted-color);
  --stepper-complete-text-color: var(--stepper-complete-text-color);
  --progress-fill-color: var(--progress-fill-color);
  --progress-success-fill-color: var(--progress-success-fill-color);
  --progress-warning-fill-color: var(--progress-warning-fill-color);
  --progress-danger-fill-color: var(--progress-danger-fill-color);
  --range-track-color: var(--range-track-color);
  --range-fill-color: var(--range-fill-color);
  --range-thumb-color: var(--range-thumb-color);
  --range-thumb-border-color: var(--range-thumb-border-color);
  --range-thumb-shadow: var(--range-thumb-shadow);
  --range-thumb-size: var(--range-thumb-size);
  --range-track-height: var(--range-track-height);
  --popover-background-color: var(--popover-background-color);
  --popover-border-color: var(--popover-border-color);
  --popover-text-color: var(--popover-text-color);
  --popover-shadow: var(--popover-shadow);
  --popover-padding: var(--popover-padding);
  --popover-radius: var(--popover-radius);
  --tooltip-background-color: var(--tooltip-background-color);
  --tooltip-border-color: var(--tooltip-border-color);
  --tooltip-text-color: var(--tooltip-text-color);
  --tooltip-shadow: var(--tooltip-shadow);
  --tooltip-padding-x: var(--tooltip-padding-x);
  --tooltip-padding-y: var(--tooltip-padding-y);
  --tooltip-font-size: var(--tooltip-font-size);
  --tooltip-max-width: var(--tooltip-max-width);
  --tooltip-radius: var(--tooltip-radius);
  --sidebar-background-color: var(--sidebar-background-color);
  --sidebar-border-color: var(--sidebar-border-color);
  --sidebar-divider-color: var(--sidebar-divider-color);
  --sidebar-item-text-color: var(--sidebar-item-text-color);
  --sidebar-item-icon-color: var(--sidebar-item-icon-color);
  --sidebar-item-hover-background-color: var(--sidebar-item-hover-background-color);
  --list-item-hover-background-color: var(--list-item-hover-background-color);
  --list-item-active-background-color: var(--list-item-active-background-color);
  --list-marker-color: var(--list-marker-color);
  --list-marker-min-width: var(--list-marker-min-width);
  --list-marker-gap: var(--list-marker-gap);
  --sidebar-item-hover-text-color: var(--sidebar-item-hover-text-color);
  --sidebar-item-active-background-color: var(--sidebar-item-active-background-color);
  --sidebar-item-active-text-color: var(--sidebar-item-active-text-color);
  --sidebar-item-active-icon-color: var(--sidebar-item-active-icon-color);
  --sidebar-group-item-indent: var(--sidebar-group-item-indent);
  --sidebar-footer-text-color: var(--sidebar-footer-text-color);
  --sidebar-header-background-color: var(--sidebar-header-background-color);
  --sidebar-header-border-color: var(--sidebar-header-border-color);
  --sidebar-header-text-color: var(--sidebar-header-text-color);
  --sidebar-header-icon-color: var(--sidebar-header-icon-color);
  --sidebar-header-icon-hover-background-color: var(--sidebar-header-icon-hover-background-color);
  --sidebar-header-icon-hover-color: var(--sidebar-header-icon-hover-color);
  --badge-default-background-color: var(--badge-default-background-color);
  --badge-default-text-color: var(--badge-default-text-color);
  --badge-default-border-color: var(--badge-default-border-color);
  --badge-primary-background-color: var(--badge-primary-background-color);
  --badge-primary-text-color: var(--badge-primary-text-color);
  --badge-primary-border-color: var(--badge-primary-border-color);
  --badge-secondary-background-color: var(--badge-secondary-background-color);
  --badge-secondary-text-color: var(--badge-secondary-text-color);
  --badge-secondary-border-color: var(--badge-secondary-border-color);
  --badge-success-background-color: var(--badge-success-background-color);
  --badge-success-text-color: var(--badge-success-text-color);
  --badge-success-border-color: var(--badge-success-border-color);
  --badge-warning-background-color: var(--badge-warning-background-color);
  --badge-warning-text-color: var(--badge-warning-text-color);
  --badge-warning-border-color: var(--badge-warning-border-color);
  --badge-danger-background-color: var(--badge-danger-background-color);
  --badge-danger-text-color: var(--badge-danger-text-color);
  --badge-danger-border-color: var(--badge-danger-border-color);
  --badge-info-background-color: var(--badge-info-background-color);
  --badge-info-text-color: var(--badge-info-text-color);
  --badge-info-border-color: var(--badge-info-border-color);
  --badge-remove-hover-background-color: var(--badge-remove-hover-background-color);
  --sidebar-header-badge-background-color: var(--sidebar-header-badge-background-color);
  --sidebar-header-badge-text-color: var(--sidebar-header-badge-text-color);
  --chat-background-color: var(--chat-background-color);
  --chat-border-color: var(--chat-border-color);
  --chat-header-background-color: var(--chat-header-background-color);
  --chat-header-border-color: var(--chat-header-border-color);
  --chat-composer-background-color: var(--chat-composer-background-color);
  --chat-composer-border-color: var(--chat-composer-border-color);
  --chat-composer-radius: var(--chat-composer-radius);
  --chat-input-background-color: var(--chat-input-background-color);
  --chat-input-border-color: var(--chat-input-border-color);
  --chat-input-text-color: var(--chat-input-text-color);
  --chat-input-placeholder-color: var(--chat-input-placeholder-color);
  --chat-input-focus-ring-color: var(--chat-input-focus-ring-color);
  --chat-composer-control-height: var(--chat-composer-control-height);
  --chat-composer-control-padding-y: var(--chat-composer-control-padding-y);
  --chat-message-incoming-background-color: var(--chat-message-incoming-background-color);
  --chat-message-incoming-text-color: var(--chat-message-incoming-text-color);
  --chat-message-outgoing-background-color: var(--chat-message-outgoing-background-color);
  --chat-message-outgoing-text-color: var(--chat-message-outgoing-text-color);
  --chat-message-system-text-color: var(--chat-message-system-text-color);
  --chat-message-incoming-meta-color: var(--chat-message-incoming-meta-color);
  --chat-message-outgoing-meta-color: var(--chat-message-outgoing-meta-color);
  --chat-message-meta-color: var(--chat-message-meta-color);
  --chat-message-failed-color: var(--chat-message-failed-color);
  --chat-message-incoming-read-receipt-color: var(--chat-message-incoming-read-receipt-color);
  --chat-message-outgoing-read-receipt-color: var(--chat-message-outgoing-read-receipt-color);
  --chat-read-receipt-color: var(--chat-read-receipt-color);
  --chat-date-divider-line-color: var(--chat-date-divider-line-color);
  --chat-date-divider-text-color: var(--chat-date-divider-text-color);
  --chat-attachment-border-color: var(--chat-attachment-border-color);
  --chat-attachment-background-color: var(--chat-attachment-background-color);
  --chat-attachment-hover-background-color: var(--chat-attachment-hover-background-color);
  --chat-attachment-text-color: var(--chat-attachment-text-color);
  --chat-attachment-meta-color: var(--chat-attachment-meta-color);
  --chat-attachment-icon-color: var(--chat-attachment-icon-color);
  --chat-jump-button-background-color: var(--chat-jump-button-background-color);
  --chat-jump-button-border-color: var(--chat-jump-button-border-color);
  --chat-jump-button-text-color: var(--chat-jump-button-text-color);
  --chat-jump-button-hover-background-color: var(--chat-jump-button-hover-background-color);
  --chat-typing-background-color: var(--chat-typing-background-color);
  --chat-typing-dot-color: var(--chat-typing-dot-color);
  --chat-avatar-placeholder-background-color: var(--chat-avatar-placeholder-background-color);
  --chat-avatar-placeholder-text-color: var(--chat-avatar-placeholder-text-color);
  --chat-send-button-background-color: var(--chat-send-button-background-color);
  --chat-send-button-hover-background-color: var(--chat-send-button-hover-background-color);
  --chat-send-button-text-color: var(--chat-send-button-text-color);
  --chat-send-button-focus-ring-color: var(--chat-send-button-focus-ring-color);
  --comments-item-background-color: var(--comments-item-background-color);
  --comments-item-system-background-color: var(--comments-item-system-background-color);
  --comments-item-border-color: var(--comments-item-border-color);
  --comments-item-author-color: var(--comments-item-author-color);
  --comments-item-meta-color: var(--comments-item-meta-color);
  --comments-item-body-color: var(--comments-item-body-color);
  --comments-item-deleted-text-color: var(--comments-item-deleted-text-color);
  --comments-item-footer-border-color: var(--comments-item-footer-border-color);
  --comments-composer-background-color: var(--comments-composer-background-color);
  --comments-composer-border-color: var(--comments-composer-border-color);
  --comments-composer-focus-ring-color: var(--comments-composer-focus-ring-color);
  --comments-composer-focus-border-color: var(--comments-composer-focus-border-color);
  --comments-composer-text-color: var(--comments-composer-text-color);
  --comments-composer-placeholder-color: var(--comments-composer-placeholder-color);
  --comments-composer-actions-background-color: var(--comments-composer-actions-background-color);
  --comments-composer-slots-background-color: var(--comments-composer-slots-background-color);
  --comments-composer-cancel-text-color: var(--comments-composer-cancel-text-color);
  --comments-composer-cancel-hover-background-color: var(--comments-composer-cancel-hover-background-color);
  --comments-composer-submit-background-color: var(--comments-composer-submit-background-color);
  --comments-composer-submit-hover-background-color: var(--comments-composer-submit-hover-background-color);
  --comments-composer-submit-text-color: var(--comments-composer-submit-text-color);
  --comments-inline-input-radius: var(--comments-inline-input-radius);
  --comments-thread-header-border-color: var(--comments-thread-header-border-color);
  --comments-thread-title-color: var(--comments-thread-title-color);
  --comments-thread-count-color: var(--comments-thread-count-color);
  --comments-thread-locked-color: var(--comments-thread-locked-color);
  --comments-thread-empty-title-color: var(--comments-thread-empty-title-color);
  --comments-thread-empty-body-color: var(--comments-thread-empty-body-color);
  --comments-replies-border-color: var(--comments-replies-border-color);
  --comments-replies-toggle-color: var(--comments-replies-toggle-color);
  --comments-replies-toggle-hover-color: var(--comments-replies-toggle-hover-color);
  --button-default-background-color: var(--button-default-background-color);
  --button-default-hover-background-color: var(--button-default-hover-background-color);
  --button-default-text-color: var(--button-default-text-color);
  --button-default-border-color: var(--button-default-border-color);
  --button-primary-background-color: var(--button-primary-background-color);
  --button-primary-hover-background-color: var(--button-primary-hover-background-color);
  --button-primary-text-color: var(--button-primary-text-color);
  --button-primary-border-color: var(--button-primary-border-color);
  --button-secondary-background-color: var(--button-secondary-background-color);
  --button-secondary-hover-background-color: var(--button-secondary-hover-background-color);
  --button-secondary-text-color: var(--button-secondary-text-color);
  --button-secondary-border-color: var(--button-secondary-border-color);
  --button-ghost-background-color: var(--button-ghost-background-color);
  --button-ghost-hover-background-color: var(--button-ghost-hover-background-color);
  --button-ghost-text-color: var(--button-ghost-text-color);
  --button-ghost-border-color: var(--button-ghost-border-color);
  --button-success-background-color: var(--button-success-background-color);
  --button-success-hover-background-color: var(--button-success-hover-background-color);
  --button-success-text-color: var(--button-success-text-color);
  --button-success-border-color: var(--button-success-border-color);
  --button-warning-background-color: var(--button-warning-background-color);
  --button-warning-hover-background-color: var(--button-warning-hover-background-color);
  --button-warning-text-color: var(--button-warning-text-color);
  --button-warning-border-color: var(--button-warning-border-color);
  --button-danger-background-color: var(--button-danger-background-color);
  --button-danger-hover-background-color: var(--button-danger-hover-background-color);
  --button-danger-text-color: var(--button-danger-text-color);
  --button-danger-border-color: var(--button-danger-border-color);
  --fp-button-background: var(--fp-button-background);
  --fp-button-hover-background: var(--fp-button-hover-background);
  --fp-button-text: var(--fp-button-text);
  --fp-button-border: var(--fp-button-border);
  --button-border-radius: var(--button-border-radius);
  --button-focus-ring-color: var(--button-focus-ring-color);
  --button-focus-ring-offset-color: var(--button-focus-ring-offset-color);
  --button-disabled-opacity: var(--button-disabled-opacity);
  --button-shadow: var(--button-shadow);
  --button-shadow-hover: var(--button-shadow-hover);
  --button-shadow-active: var(--button-shadow-active);
  --hit-target-min: var(--hit-target-min);
  --hit-target-inline-min: var(--hit-target-inline-min);
  --button-padding-x-xs: var(--button-padding-x-xs);
  --button-padding-y-xs: var(--button-padding-y-xs);
  --button-padding-x-sm: var(--button-padding-x-sm);
  --button-padding-y-sm: var(--button-padding-y-sm);
  --button-padding-x-md: var(--button-padding-x-md);
  --button-padding-y-md: var(--button-padding-y-md);
  --button-padding-x-lg: var(--button-padding-x-lg);
  --button-padding-y-lg: var(--button-padding-y-lg);
  --button-icon-only-padding-sm: var(--button-icon-only-padding-sm);
  --button-icon-only-padding-md: var(--button-icon-only-padding-md);
  --button-icon-only-padding-lg: var(--button-icon-only-padding-lg);
  --alert-border-radius: var(--alert-border-radius);
  --alert-padding: var(--alert-padding);
  --alert-title-color: var(--alert-title-color);
  --alert-description-color: var(--alert-description-color);
  --alert-dismiss-button-radius: var(--alert-dismiss-button-radius);
  --alert-dismiss-button-text-color: var(--alert-dismiss-button-text-color);
  --alert-dismiss-button-hover-background-color: var(--alert-dismiss-button-hover-background-color);
  --alert-dismiss-button-focus-ring-color: var(--alert-dismiss-button-focus-ring-color);
  --alert-info-background-color: var(--alert-info-background-color);
  --alert-info-border-color: var(--alert-info-border-color);
  --alert-info-text-color: var(--alert-info-text-color);
  --alert-info-icon-color: var(--alert-info-icon-color);
  --alert-success-background-color: var(--alert-success-background-color);
  --alert-success-border-color: var(--alert-success-border-color);
  --alert-success-text-color: var(--alert-success-text-color);
  --alert-success-icon-color: var(--alert-success-icon-color);
  --alert-warning-background-color: var(--alert-warning-background-color);
  --alert-warning-border-color: var(--alert-warning-border-color);
  --alert-warning-text-color: var(--alert-warning-text-color);
  --alert-warning-icon-color: var(--alert-warning-icon-color);
  --alert-danger-background-color: var(--alert-danger-background-color);
  --alert-danger-border-color: var(--alert-danger-border-color);
  --alert-danger-text-color: var(--alert-danger-text-color);
  --alert-danger-icon-color: var(--alert-danger-icon-color);
  --toast-border-radius: var(--toast-border-radius);
  --toast-padding: var(--toast-padding);
  --toast-shadow: var(--toast-shadow);
  --toast-dismiss-text-color: var(--toast-dismiss-text-color);
  --toast-dismiss-hover-text-color: var(--toast-dismiss-hover-text-color);
  --toast-dismiss-hover-background-color: var(--toast-dismiss-hover-background-color);
  --toast-danger-dismiss-background-color: var(--toast-danger-dismiss-background-color);
  --toast-danger-dismiss-hover-background-color: var(--toast-danger-dismiss-hover-background-color);
  --toast-danger-dismiss-text-color: var(--toast-danger-dismiss-text-color);
  --toast-info-background-color: var(--toast-info-background-color);
  --toast-info-border-color: var(--toast-info-border-color);
  --toast-info-text-color: var(--toast-info-text-color);
  --toast-info-icon-color: var(--toast-info-icon-color);
  --toast-success-background-color: var(--toast-success-background-color);
  --toast-success-border-color: var(--toast-success-border-color);
  --toast-success-text-color: var(--toast-success-text-color);
  --toast-success-icon-color: var(--toast-success-icon-color);
  --toast-warning-background-color: var(--toast-warning-background-color);
  --toast-warning-border-color: var(--toast-warning-border-color);
  --toast-warning-text-color: var(--toast-warning-text-color);
  --toast-warning-icon-color: var(--toast-warning-icon-color);
  --toast-danger-background-color: var(--toast-danger-background-color);
  --toast-danger-border-color: var(--toast-danger-border-color);
  --toast-danger-text-color: var(--toast-danger-text-color);
  --toast-danger-icon-color: var(--toast-danger-icon-color);
  --avatar-background-color: var(--avatar-background-color);
  --avatar-text-color: var(--avatar-text-color);
  --avatar-link-hover-opacity: var(--avatar-link-hover-opacity);
  --avatar-radius-circle: var(--avatar-radius-circle);
  --avatar-radius-rounded: var(--avatar-radius-rounded);
  --avatar-radius-square: var(--avatar-radius-square);
  --avatar-status-ring-color: var(--avatar-status-ring-color);
  --avatar-status-online-color: var(--avatar-status-online-color);
  --avatar-status-offline-color: var(--avatar-status-offline-color);
  --avatar-status-busy-color: var(--avatar-status-busy-color);
  --avatar-status-away-color: var(--avatar-status-away-color);
  --avatar-group-overlap-sm: var(--avatar-group-overlap-sm);
  --avatar-group-overlap-md: var(--avatar-group-overlap-md);
  --avatar-group-overlap-lg: var(--avatar-group-overlap-lg);
  --avatar-group-ring-color: var(--avatar-group-ring-color);
  --color-swatch-radius: var(--color-swatch-radius);
  --color-swatch-border-color: var(--color-swatch-border-color);
  --color-swatch-selected-ring-color: var(--color-swatch-selected-ring-color);
  --color-swatch-ring-offset-color: var(--color-swatch-ring-offset-color);
  --color-swatch-shadow: var(--color-swatch-shadow);
  --font-swatch-radius: var(--font-swatch-radius);
  --font-swatch-border-color: var(--font-swatch-border-color);
  --font-swatch-selected-ring-color: var(--font-swatch-selected-ring-color);
  --font-swatch-ring-offset-color: var(--font-swatch-ring-offset-color);
  --font-swatch-shadow: var(--font-swatch-shadow);
  --font-swatch-background-color: var(--font-swatch-background-color);
  --font-swatch-text-color: var(--font-swatch-text-color);
  --overflow-row-gap: var(--overflow-row-gap);
  --overflow-row-fade-size: var(--overflow-row-fade-size);
  --top-nav-background-color: var(--top-nav-background-color);
  --top-nav-border-color: var(--top-nav-border-color);
  --top-nav-item-text-color: var(--top-nav-item-text-color);
  --top-nav-item-icon-color: var(--top-nav-item-icon-color);
  --top-nav-item-hover-background-color: var(--top-nav-item-hover-background-color);
  --top-nav-item-hover-text-color: var(--top-nav-item-hover-text-color);
  --top-nav-item-active-background-color: var(--top-nav-item-active-background-color);
  --top-nav-item-active-text-color: var(--top-nav-item-active-text-color);
  --top-nav-item-active-icon-color: var(--top-nav-item-active-icon-color);
  --top-nav-height: var(--top-nav-height);
  --top-nav-backdrop-blur: var(--top-nav-backdrop-blur);
  --search-icon-color: var(--search-icon-color);
  --search-input-background-color: var(--search-input-background-color);
  --search-input-border-color: var(--search-input-border-color);
  --search-input-text-color: var(--search-input-text-color);
  --search-input-placeholder-color: var(--search-input-placeholder-color);
  --search-input-focus-ring-color: var(--search-input-focus-ring-color);
  --search-padding-y-sm: var(--search-padding-y-sm);
  --search-padding-y-md: var(--search-padding-y-md);
  --search-padding-y-lg: var(--search-padding-y-lg);
  --search-padding-inline-sm: var(--search-padding-inline-sm);
  --search-padding-inline-md: var(--search-padding-inline-md);
  --search-padding-inline-lg: var(--search-padding-inline-lg);
  --search-dropdown-background-color: var(--search-dropdown-background-color);
  --search-dropdown-border-color: var(--search-dropdown-border-color);
  --search-dropdown-muted-text-color: var(--search-dropdown-muted-text-color);
  --search-result-title-color: var(--search-result-title-color);
  --search-result-description-color: var(--search-result-description-color);
  --search-result-hover-background-color: var(--search-result-hover-background-color);
  --search-result-divider-color: var(--search-result-divider-color);
  --color-ring: var(--color-ring);
  --icon-stroke-width: var(--icon-stroke-width);
  --radius-sm: var(--radius-sm);
  --radius-md: var(--radius-md);
  --radius-lg: var(--radius-lg);
  --radius-xl: var(--radius-xl);
  --stack-gap-sm: var(--stack-gap-sm);
  --stack-gap-md: var(--stack-gap-md);
  --stack-gap-lg: var(--stack-gap-lg);
  --form-control-padding: var(--form-control-padding);
  --table-padding: var(--table-padding);
  --table-background-color: var(--table-background-color);
  --table-border-color: var(--table-border-color);
  --table-header-background-color: var(--table-header-background-color);
  --table-header-border-color: var(--table-header-border-color);
  --table-header-text-color: var(--table-header-text-color);
  --table-row-divider-color: var(--table-row-divider-color);
  --table-row-hover-background-color: var(--table-row-hover-background-color);
  --table-cell-text-color: var(--table-cell-text-color);
  --table-cell-muted-text-color: var(--table-cell-muted-text-color);
  --table-empty-state-text-color: var(--table-empty-state-text-color);
  --table-sort-link-hover-color: var(--table-sort-link-hover-color);
  --chip-remove-hover-background-color: var(--chip-remove-hover-background-color);
  --chip-border-radius: var(--chip-border-radius);
  --chip-group-gap: var(--chip-group-gap);
  --chip-padding-x-sm: var(--chip-padding-x-sm);
  --chip-padding-y-sm: var(--chip-padding-y-sm);
  --chip-padding-x-md: var(--chip-padding-x-md);
  --chip-padding-y-md: var(--chip-padding-y-md);
  --chip-padding-x-lg: var(--chip-padding-x-lg);
  --chip-padding-y-lg: var(--chip-padding-y-lg);
  --picker-badge-background-color: var(--picker-badge-background-color);
  --picker-badge-text-color: var(--picker-badge-text-color);
  --picker-selection-idle-background-color: var(--picker-selection-idle-background-color);
  --picker-selection-idle-ring-color: var(--picker-selection-idle-ring-color);
  --picker-selection-indicator-border-color: var(--picker-selection-indicator-border-color);
  --picker-selection-indicator-fill-color: var(--picker-selection-indicator-fill-color);
  --font-sans: var(--font-sans);
  --font-mono: var(--font-mono);
  --text-xs: var(--text-xs);
  --text-sm: var(--text-sm);
  --text-base: var(--text-base);
  --text-lg: var(--text-lg);
  --text-xl: var(--text-xl);
  --text-2xl: var(--text-2xl);
  --text-3xl: var(--text-3xl);
  --text-4xl: var(--text-4xl);
  --text-5xl: var(--text-5xl);
  --leading-tight: var(--leading-tight);
  --leading-snug: var(--leading-snug);
  --leading-normal: var(--leading-normal);
  --page-title-h1-size: var(--page-title-h1-size);
  --page-title-h2-size: var(--page-title-h2-size);
  --page-title-h3-size: var(--page-title-h3-size);
  --page-title-h4-size: var(--page-title-h4-size);
  --page-title-h5-size: var(--page-title-h5-size);
  --page-title-h6-size: var(--page-title-h6-size);
  --content-kicker-size: var(--content-kicker-size);
  --content-p-size: var(--content-p-size);
  --content-lead-size: var(--content-lead-size);
  --content-h1-size: var(--content-h1-size);
  --content-h2-size: var(--content-h2-size);
  --content-h3-size: var(--content-h3-size);
  --content-h4-size: var(--content-h4-size);
  --content-h5-size: var(--content-h5-size);
  --content-h6-size: var(--content-h6-size);
  --hero-headline-size: var(--hero-headline-size);
  --hero-description-size: var(--hero-description-size);
  --shadow-sm: var(--shadow-sm);
  --shadow-md: var(--shadow-md);
  --shadow-lg: var(--shadow-lg);
  --shadow-button: var(--shadow-button);
  --shadow-button-active: var(--shadow-button-active);
  --kbd-shadow: var(--kbd-shadow);
  --modal-backdrop-blur: var(--modal-backdrop-blur);
  --drawer-backdrop-blur: var(--drawer-backdrop-blur);
  --duration-fast: var(--duration-fast);
  --duration-base: var(--duration-base);
  --duration-slow: var(--duration-slow);
  --easing-standard: var(--easing-standard);
  --easing-enter: var(--easing-enter);
  --easing-exit: var(--easing-exit);
  --easing-spring: var(--easing-spring);
  --easing-spring-snappy: var(--easing-spring-snappy);
  --transition-slow: var(--transition-slow);
  --transition-base: var(--transition-base);
  --transition-fast: var(--transition-fast);
}

input.flat-pack-input[type="search"]::-webkit-search-cancel-button,
input.flat-pack-input[type="search"]::-webkit-search-decoration,
input.flat-pack-input[type="search"]::-webkit-search-results-button,
input.flat-pack-input[type="search"]::-webkit-search-results-decoration {
  -webkit-appearance: none;
  appearance: none;
  display: none;
}

input.flat-pack-input[type="search"]::-ms-clear,
input.flat-pack-input[type="search"]::-ms-reveal {
  display: none;
  width: 0;
  height: 0;
}

/* Default palette (rounded / charcoal) — full semantic + component wiring */
:root {
  color-scheme: light;
  font-family: var(--font-sans);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  --brand-hue: 0;
  --brand-chroma: 0;
  --brand-lightness: 0.3211;
  --color-primary: oklch(var(--brand-lightness) var(--brand-chroma) var(--brand-hue));
  --color-primary-hover: oklch(calc(var(--brand-lightness) - 0.10) var(--brand-chroma) var(--brand-hue));
  --color-primary-text: #fff;
  --color-default: var(--surface-background-color);
  --color-default-hover: var(--surface-muted-background-color);
  --color-default-text: var(--surface-content-color);
  --color-default-border: var(--surface-border-color);
  --color-secondary: #f5f5f5;
  --color-secondary-hover: #ebebeb;
  --color-secondary-text: #333;
  --color-ghost: transparent;
  --color-ghost-hover: #f2f2f2;
  --color-ghost-text: #333;
  --color-success-background-color: oklch(0.72 0.17 152);
  --color-success-hover-background-color: oklch(0.66 0.17 152);
  --color-success-text: #fff;
  --color-success-border: var(--color-success-background-color);
  --color-warning-background-color: oklch(0.80 0.15 83);
  --color-warning-hover-background-color: oklch(0.75 0.16 78);
  --color-warning-text: #1f1f1f;
  --color-warning-border: var(--color-warning-background-color);
  --color-warning: var(--color-warning-border);
  --color-danger-background-color: oklch(57.7% 0.245 27.325);
  --color-danger-hover-background-color: oklch(50.5% 0.213 27.518);
  --color-danger-text-color: oklch(1.0 0 0);
  --color-danger-border-color: var(--color-danger-background-color);
  --color-error: var(--color-danger-background-color);
  --color-error-border: var(--color-danger-border-color);
  --color-info-border: var(--surface-border-color);
  --surface-background-color: #f8f9fa;
  --surface-page-background-color: #f8f9fa;
  --surface-content-color: #333;
  --surface-muted-background-color: #e5e5e5;
  --surface-subtle-background-color: var(--surface-muted-background-color);
  --surface-muted-content-color: #666;
  --surface-border-color: #d1d5db;
  --surface-border-hover-color: #d1d5db;
  --checkbox-size: 1.25rem;
  --checkbox-radius: 0.125rem;
  --checkbox-label-gap: 0.75rem;
  --collapse-background-color: var(--surface-background-color);
  --collapse-border-color: var(--surface-border-color);
  --collapse-border-radius: var(--radius-md);
  --collapse-trigger-background-color: var(--surface-background-color);
  --collapse-trigger-hover-background-color: var(--surface-muted-background-color);
  --collapse-trigger-text-color: var(--surface-content-color);
  --collapse-trigger-padding: 1rem;
  --collapse-content-background-color: var(--surface-background-color);
  --collapse-content-padding: 1rem;
  --collapse-focus-ring-color: var(--color-ring);
  --collapse-transition-duration: var(--duration-slow);
  --collapse-icon-color: currentColor;
  --bottom-nav-background-color: #2f2f2f;
  --bottom-nav-border-color: #4b4b4b;
  --bottom-nav-item-active-color: #ffffff;
  --bottom-nav-item-color: #d1d5db;
  --bottom-nav-item-hover-color: #f9fafb;
  --bottom-nav-item-padding-x: 0.5rem;
  --bottom-nav-item-padding-y: 0.5rem;
  --quote-border-color: var(--surface-border-color);
  --quote-border-width: 4px;
  --quote-padding-left: 1rem;
  --quote-text-color: var(--surface-content-color);
  --quote-cite-color: var(--surface-muted-content-color);
  --quote-cite-margin-top: 0.5rem;
  --timeline-marker-default-background-color: var(--color-primary);
  --timeline-marker-success-background-color: var(--color-success-background-color);
  --timeline-marker-warning-background-color: var(--color-warning-background-color);
  --timeline-marker-danger-background-color: var(--color-danger-background-color);
  --timeline-marker-icon-color: var(--surface-background-color);
  --timeline-line-color: var(--surface-border-color);
  --timeline-title-color: var(--surface-content-color);
  --timeline-timestamp-color: var(--surface-muted-content-color);
  --timeline-content-color: var(--surface-content-color);
  --timeline-item-padding-bottom: 2rem;
  --timeline-content-padding-left: 1rem;
  --timeline-line-min-height: 2rem;
  --accordion-background-color: var(--surface-background-color);
  --accordion-border-color: var(--surface-border-color);
  --accordion-border-radius: var(--radius-md);
  --accordion-item-border-color: var(--surface-border-color);
  --accordion-trigger-text-color: var(--surface-content-color);
  --accordion-trigger-hover-background-color: var(--surface-muted-background-color);
  --accordion-trigger-padding: 1rem;
  --accordion-content-background-color: var(--surface-background-color);
  --accordion-content-padding: 1rem;
  --accordion-focus-ring-color: var(--color-ring);
  --accordion-transition-duration: var(--duration-slow);
  --breadcrumb-current-color: var(--surface-content-color);
  --breadcrumb-link-color: var(--surface-muted-content-color);
  --breadcrumb-link-hover-color: var(--surface-content-color);
  --breadcrumb-separator-color: var(--surface-muted-content-color);
  --breadcrumb-gap: 0.25rem;
  --breadcrumb-separator-gap: 0.5rem;
  --switch-track-background-color: color-mix(in oklab, var(--surface-muted-background-color) 92%, black);
  --switch-track-checked-background-color: var(--color-primary);
  --switch-focus-ring-color: var(--color-ring);
  --switch-label-color: var(--surface-content-color);
  --switch-thumb-background-color: var(--surface-background-color);
  --switch-thumb-shadow: var(--shadow-sm);
  --switch-error-color: var(--color-error);
  --skeleton-background-color: var(--surface-muted-background-color);
  --skeleton-shimmer-highlight-color: rgb(255 255 255 / 0.45);
  --skeleton-shimmer-duration: 1.35s;
  --code-block-background-color: var(--surface-muted-background-color);
  --code-block-border-color: var(--surface-border-color);
  --code-block-title-color: var(--surface-muted-content-color);
  --code-block-code-color: var(--surface-content-color);
  --code-block-tab-color: var(--surface-muted-content-color);
  --code-block-tab-hover-color: var(--surface-content-color);
  --code-block-tab-active-background-color: var(--surface-border-color);
  --code-block-tab-active-color: var(--surface-muted-content-color);
  --tabs-pill-corner-radius: 9999px;
  --tabs-pill-active-background-color: var(--color-primary);
  --tabs-pill-active-border-color: var(--color-primary);
  --tabs-pill-active-text-color: var(--color-primary-text);
  --tabs-stacked-pill-list-background-color: var(--surface-muted-background-color);
  --tabs-pill-list-border-color: var(--surface-border-color);
  --tabs-pill-active-shadow: var(--shadow-md);
  --tabs-pill-inactive-text-color: var(--surface-muted-content-color);
  --tabs-pill-inactive-hover-background-color: var(--surface-muted-background-color);
  --tabs-pill-inactive-hover-text-color: var(--surface-content-color);
  --card-background-color: var(--surface-background-color);
  --card-background-muted-color: var(--surface-muted-background-color);
  --card-border-color: var(--surface-border-color);
  --card-padding-sm: 0.75rem;
  --card-padding-md: 1rem;
  --card-padding-lg: 1.25rem;
  --card-hover-subtle-background-color: var(--surface-muted-background-color);
  --card-hover-strong-border-color: var(--color-primary);
  --card-hover-strong-shadow: var(--shadow-md);
  --card-hover-strong-shadow-dark: var(--shadow-lg);
  --hero-overlay-background-color: rgb(0 0 0 / 0.6);
  --hero-overlay-left-background: linear-gradient(to right, rgb(0 0 0 / 0.78) 0%, rgb(0 0 0 / 0.52) 38%, rgb(0 0 0 / 0.22) 68%, rgb(0 0 0 / 0.08) 100%);
  --hero-overlay-text-color: oklch(1.0 0 0);
  --hero-overlay-muted-text-color: rgb(255 255 255 / 0.8);
  --hero-overlay-button-primary-background-color: oklch(1 0 0);
  --hero-overlay-button-primary-hover-background-color: oklch(0.96 0 0);
  --hero-overlay-button-primary-text-color: oklch(0.22 0 0);
  --hero-overlay-button-primary-border-color: oklch(1 0 0);
  --hero-overlay-button-secondary-background-color: transparent;
  --hero-overlay-button-secondary-hover-background-color: rgb(255 255 255 / 0.12);
  --hero-overlay-button-secondary-text-color: oklch(1 0 0);
  --hero-overlay-button-secondary-border-color: rgb(255 255 255 / 0.55);
  --hero-overlay-on-light-background-color: rgb(255 255 255 / 0.62);
  --hero-overlay-on-light-left-background: linear-gradient(to right, rgb(255 255 255 / 0.88) 0%, rgb(255 255 255 / 0.62) 38%, rgb(255 255 255 / 0.28) 68%, rgb(255 255 255 / 0.08) 100%);
  --hero-overlay-on-light-text-color: oklch(0.22 0 0);
  --hero-overlay-on-light-muted-text-color: rgb(34 34 34 / 0.82);
  --hero-overlay-on-light-button-primary-background-color: oklch(0.22 0 0);
  --hero-overlay-on-light-button-primary-hover-background-color: oklch(0.28 0 0);
  --hero-overlay-on-light-button-primary-text-color: oklch(1 0 0);
  --hero-overlay-on-light-button-primary-border-color: oklch(0.22 0 0);
  --hero-overlay-on-light-button-secondary-background-color: transparent;
  --hero-overlay-on-light-button-secondary-hover-background-color: rgb(0 0 0 / 0.08);
  --hero-overlay-on-light-button-secondary-text-color: oklch(0.22 0 0);
  --hero-overlay-on-light-button-secondary-border-color: rgb(0 0 0 / 0.35);
  --hero-overlay-min-height: 560px;
  --hero-overlay-copy-padding-top: calc(var(--top-nav-height) + env(safe-area-inset-top, 0px) + 2rem);
  --carousel-chevron-background-color: rgb(31 41 55 / 0.68);
  --carousel-viewport-background-color: var(--surface-muted-background-color);
  --carousel-viewport-border-color: var(--surface-border-color);
  --carousel-control-background-color: rgb(0 0 0 / 0.6);
  --carousel-control-hover-background-color: rgb(0 0 0 / 0.8);
  --carousel-control-text-color: oklch(1.0 0 0);
  --carousel-counter-background-color: rgb(0 0 0 / 0.6);
  --carousel-counter-text-color: oklch(1.0 0 0);
  --carousel-indicator-track-background-color: rgb(0 0 0 / 0.5);
  --carousel-indicator-background-color: rgb(255 255 255 / 0.5);
  --carousel-indicator-active-background-color: rgb(255 255 255);
  --carousel-thumb-border-color: var(--surface-border-color);
  --carousel-thumb-placeholder-background-color: var(--surface-muted-background-color);
  --carousel-thumb-placeholder-text-color: var(--surface-muted-content-color);
  --carousel-caption-overlay-background-color: rgb(0 0 0 / 0.6);
  --carousel-caption-overlay-text-color: oklch(1.0 0 0);
  --carousel-caption-below-text-color: var(--surface-muted-content-color);
  --carousel-media-background-color: oklch(0 0 0);
  --carousel-lightbox-image-background-color: rgb(0 0 0 / 0.2);
  --modal-backdrop-color: rgb(0 0 0 / 0.5);
  --modal-surface-color: var(--surface-background-color);
  --modal-border-color: var(--surface-border-color);
  --modal-title-color: var(--surface-content-color);
  --modal-body-color: var(--surface-content-color);
  --modal-close-icon-color: var(--surface-muted-content-color);
  --modal-close-icon-hover-color: var(--surface-content-color);
  --drawer-backdrop-color: var(--modal-backdrop-color);
  --drawer-surface-color: var(--modal-surface-color);
  --drawer-border-color: var(--modal-border-color);
  --drawer-title-color: var(--modal-title-color);
  --drawer-body-color: var(--modal-body-color);
  --drawer-close-icon-color: var(--modal-close-icon-color);
  --drawer-close-icon-hover-color: var(--modal-close-icon-hover-color);
  --kbd-background-color: var(--surface-muted-background-color);
  --kbd-border-color: var(--surface-border-color);
  --kbd-text-color: var(--surface-content-color);
  --kbd-muted-color: var(--surface-muted-content-color);
  --skip-link-background-color: var(--surface-content-color);
  --skip-link-text-color: var(--surface-background-color);
  --stepper-current-color: var(--color-primary);
  --stepper-complete-color: var(--color-success-background-color);
  --stepper-upcoming-color: var(--surface-border-color);
  --stepper-label-color: var(--surface-content-color);
  --stepper-muted-color: var(--surface-muted-content-color);
  --stepper-complete-text-color: var(--color-success-text);
  --progress-fill-color: var(--color-primary);
  --progress-success-fill-color: var(--color-success-background-color);
  --progress-warning-fill-color: var(--color-warning-background-color);
  --progress-danger-fill-color: var(--color-danger-background-color);
  --range-track-color: var(--surface-muted-background-color);
  --range-fill-color: var(--color-primary);
  --range-thumb-color: var(--surface-background-color);
  --range-thumb-border-color: var(--surface-background-color);
  --range-thumb-shadow: var(--shadow-md);
  --range-thumb-size: 1.25rem;
  --range-track-height: 0.375rem;
  --popover-background-color: var(--surface-background-color);
  --popover-border-color: var(--surface-border-color);
  --popover-text-color: var(--surface-content-color);
  --popover-shadow: var(--shadow-lg);
  --popover-padding: 1rem;
  --popover-radius: var(--radius-md);
  --tooltip-background-color: var(--surface-content-color);
  --tooltip-border-color: var(--surface-border-color);
  --tooltip-text-color: var(--surface-background-color);
  --tooltip-shadow: var(--shadow-lg);
  --tooltip-padding-x: 0.75rem;
  --tooltip-padding-y: 0.5rem;
  --tooltip-radius: var(--radius-sm);
  --tooltip-font-size: 0.875rem;
  --tooltip-max-width: 20rem;
  --sidebar-background-color: var(--surface-page-background-color);
  --sidebar-border-color: var(--surface-border-color);
  --sidebar-divider-color: var(--surface-border-color);
  --sidebar-item-text-color: var(--surface-muted-content-color);
  --sidebar-item-icon-color: var(--surface-muted-content-color);
  --sidebar-item-hover-background-color: var(--surface-muted-background-color);
  --list-item-hover-background-color: var(--surface-muted-background-color);
  --list-item-active-background-color: var(--surface-muted-background-color);
  --list-marker-color: var(--surface-muted-content-color);
  --list-marker-min-width: 1.5rem;
  --list-marker-gap: 0.5rem;
  --sidebar-item-hover-text-color: var(--surface-content-color);
  --sidebar-item-active-background-color: #333;
  --sidebar-item-active-text-color: var(--color-primary-text);
  --sidebar-item-active-icon-color: var(--color-primary-text);
  --sidebar-group-item-indent: 1rem;
  --sidebar-footer-text-color: var(--surface-muted-content-color);
  --sidebar-header-background-color: var(--sidebar-background-color);
  --sidebar-header-border-color: var(--sidebar-border-color);
  --sidebar-header-text-color: var(--sidebar-item-text-color);
  --sidebar-header-icon-color: var(--sidebar-item-icon-color);
  --sidebar-header-icon-hover-background-color: var(--sidebar-item-hover-background-color);
  --sidebar-header-icon-hover-color: var(--sidebar-item-hover-text-color);
  --badge-default-background-color: var(--surface-muted-background-color);
  --badge-default-text-color: var(--surface-content-color);
  --badge-default-border-color: var(--surface-border-color);
  --badge-primary-background-color: var(--color-primary);
  --badge-primary-text-color: var(--color-primary-text);
  --badge-primary-border-color: var(--color-primary);
  --badge-secondary-background-color: var(--color-secondary);
  --badge-secondary-text-color: var(--color-secondary-text);
  --badge-secondary-border-color: var(--surface-border-color);
  --badge-success-background-color: var(--color-success-background-color);
  --badge-success-text-color: var(--color-success-text);
  --badge-success-border-color: var(--color-success-border);
  --badge-warning-background-color: var(--color-warning-background-color);
  --badge-warning-text-color: var(--color-warning-text);
  --badge-warning-border-color: var(--color-warning-border);
  --badge-danger-background-color: var(--color-danger-background-color);
  --badge-danger-text-color: var(--color-danger-text-color);
  --badge-danger-border-color: var(--color-danger-border-color);
  --badge-info-background-color: var(--surface-background-color);
  --badge-info-text-color: var(--surface-content-color);
  --badge-info-border-color: var(--color-info-border);
  --badge-remove-hover-background-color: var(--chip-remove-hover-background-color);
  --sidebar-header-badge-background-color: var(--badge-primary-background-color);
  --sidebar-header-badge-text-color: var(--badge-primary-text-color);
  --chat-background-color: var(--surface-background-color);
  --chat-border-color: var(--surface-border-color);
  --chat-header-background-color: var(--surface-background-color);
  --chat-header-border-color: var(--surface-border-color);
  --chat-composer-background-color: var(--surface-background-color);
  --chat-composer-border-color: var(--surface-border-color);
  --chat-composer-radius: var(--radius-md);
  --chat-input-background-color: var(--surface-background-color);
  --chat-input-border-color: var(--surface-border-color);
  --chat-input-text-color: var(--surface-content-color);
  --chat-input-placeholder-color: var(--surface-muted-content-color);
  --chat-input-focus-ring-color: var(--color-ring);
  --chat-composer-control-height: calc(1.25rem + (var(--chat-composer-control-padding-y) * 2) + 2px);
  --chat-composer-control-padding-y: var(--button-icon-only-padding-md);
  --chat-message-incoming-background-color: var(--surface-muted-background-color);
  --chat-message-incoming-text-color: var(--surface-content-color);
  --chat-message-outgoing-background-color: var(--color-primary);
  --chat-message-outgoing-text-color: var(--color-primary-text);
  --chat-message-system-text-color: var(--surface-muted-content-color);
  --chat-message-incoming-meta-color: var(--surface-muted-content-color);
  --chat-message-outgoing-meta-color: var(--surface-muted-content-color);
  --chat-message-meta-color: var(--chat-message-incoming-meta-color);
  --chat-message-failed-color: var(--color-danger-border-color);
  --chat-message-incoming-read-receipt-color: var(--chat-message-incoming-text-color);
  --chat-message-outgoing-read-receipt-color: var(--surface-muted-content-color);
  --chat-read-receipt-color: var(--chat-message-incoming-read-receipt-color);
  --chat-date-divider-line-color: var(--surface-border-color);
  --chat-date-divider-text-color: var(--surface-muted-content-color);
  --chat-attachment-border-color: var(--surface-border-color);
  --chat-attachment-background-color: var(--surface-background-color);
  --chat-attachment-hover-background-color: var(--surface-muted-background-color);
  --chat-attachment-text-color: var(--surface-content-color);
  --chat-attachment-meta-color: var(--surface-muted-content-color);
  --chat-attachment-icon-color: var(--surface-muted-content-color);
  --chat-jump-button-background-color: var(--surface-background-color);
  --chat-jump-button-border-color: var(--surface-border-color);
  --chat-jump-button-text-color: var(--surface-content-color);
  --chat-jump-button-hover-background-color: var(--surface-muted-background-color);
  --chat-typing-background-color: var(--surface-muted-background-color);
  --chat-typing-dot-color: var(--surface-content-color);
  --chat-avatar-placeholder-background-color: var(--surface-muted-background-color);
  --chat-avatar-placeholder-text-color: var(--surface-muted-content-color);
  --chat-send-button-background-color: var(--color-primary);
  --chat-send-button-hover-background-color: var(--color-primary-hover);
  --chat-send-button-text-color: var(--color-primary-text);
  --chat-send-button-focus-ring-color: var(--color-ring);
  --comments-item-background-color: var(--surface-background-color);
  --comments-item-system-background-color: var(--surface-muted-background-color);
  --comments-item-border-color: var(--surface-border-color);
  --comments-item-author-color: var(--surface-content-color);
  --comments-item-meta-color: var(--surface-muted-content-color);
  --comments-item-body-color: var(--surface-content-color);
  --comments-item-deleted-text-color: var(--surface-muted-content-color);
  --comments-item-footer-border-color: var(--surface-border-color);
  --comments-composer-background-color: var(--surface-background-color);
  --comments-composer-border-color: var(--surface-border-color);
  --comments-composer-focus-ring-color: var(--color-ring);
  --comments-composer-focus-border-color: var(--color-ring);
  --comments-composer-text-color: var(--surface-content-color);
  --comments-composer-placeholder-color: var(--surface-muted-content-color);
  --comments-composer-actions-background-color: color-mix(in oklab, var(--surface-muted-background-color) 30%, transparent);
  --comments-composer-slots-background-color: var(--comments-composer-actions-background-color);
  --comments-composer-cancel-text-color: var(--surface-content-color);
  --comments-composer-cancel-hover-background-color: var(--surface-muted-background-color);
  --comments-composer-submit-background-color: var(--color-primary);
  --comments-composer-submit-hover-background-color: color-mix(in oklab, var(--color-primary) 90%, black);
  --comments-composer-submit-text-color: var(--color-primary-text);
  --comments-inline-input-radius: 9999px;
  --comments-thread-header-border-color: var(--surface-border-color);
  --comments-thread-title-color: var(--surface-content-color);
  --comments-thread-count-color: var(--surface-muted-content-color);
  --comments-thread-locked-color: var(--surface-muted-content-color);
  --comments-thread-empty-title-color: var(--surface-content-color);
  --comments-thread-empty-body-color: var(--surface-muted-content-color);
  --comments-replies-border-color: var(--surface-border-color);
  --comments-replies-toggle-color: var(--color-primary);
  --comments-replies-toggle-hover-color: var(--color-primary-hover);
  --button-default-background-color: var(--color-default);
  --button-default-hover-background-color: var(--color-default-hover);
  --button-default-text-color: var(--color-default-text);
  --button-default-border-color: var(--color-default-border);
  --button-primary-background-color: var(--color-primary);
  --button-primary-hover-background-color: var(--color-primary-hover);
  --button-primary-text-color: var(--color-primary-text);
  --button-primary-border-color: var(--color-primary);
  --button-secondary-background-color: var(--color-secondary);
  --button-secondary-hover-background-color: var(--color-secondary-hover);
  --button-secondary-text-color: var(--color-secondary-text);
  --button-secondary-border-color: var(--surface-border-color);
  --button-ghost-background-color: var(--color-ghost);
  --button-ghost-hover-background-color: var(--color-ghost-hover);
  --button-ghost-text-color: var(--color-ghost-text);
  --button-ghost-border-color: transparent;
  --button-success-background-color: var(--color-success-background-color);
  --button-success-hover-background-color: var(--color-success-hover-background-color);
  --button-success-text-color: var(--color-success-text);
  --button-success-border-color: var(--color-success-border);
  --button-warning-background-color: var(--color-warning-background-color);
  --button-warning-hover-background-color: var(--color-warning-hover-background-color);
  --button-warning-text-color: var(--color-warning-text);
  --button-warning-border-color: var(--color-warning-border);
  --button-danger-background-color: var(--color-danger-background-color);
  --button-danger-hover-background-color: var(--color-danger-hover-background-color);
  --button-danger-text-color: var(--color-danger-text-color);
  --button-danger-border-color: var(--color-danger-border-color);
  --fp-button-background: var(--button-default-background-color);
  --fp-button-hover-background: var(--button-default-hover-background-color);
  --fp-button-text: var(--button-default-text-color);
  --fp-button-border: var(--button-default-border-color);
  --button-border-radius: var(--radius-md);
  --button-focus-ring-color: var(--color-ring);
  --button-focus-ring-offset-color: var(--surface-background-color);
  --button-disabled-opacity: 0.5;
  --button-shadow: var(--shadow-sm);
  --button-shadow-hover: var(--shadow-button);
  --button-shadow-active: var(--shadow-button-active);
  --hit-target-min: 2.75rem;
  --hit-target-inline-min: 1.5rem;
  --button-padding-x-xs: 0.5rem;
  --button-padding-y-xs: 0.25rem;
  --button-padding-x-sm: 0.75rem;
  --button-padding-y-sm: 0.375rem;
  --button-padding-x-md: 1rem;
  --button-padding-y-md: 0.5rem;
  --button-padding-x-lg: 1.5rem;
  --button-padding-y-lg: 0.75rem;
  --button-icon-only-padding-sm: 0.375rem;
  --button-icon-only-padding-md: 0.5rem;
  --button-icon-only-padding-lg: 0.75rem;
  --alert-border-radius: var(--radius-md);
  --alert-padding: 1rem;
  --alert-title-color: currentColor;
  --alert-description-color: currentColor;
  --alert-dismiss-button-radius: var(--radius-sm);
  --alert-dismiss-button-text-color: currentColor;
  --alert-dismiss-button-hover-background-color: color-mix(in oklab, currentColor 8%, transparent);
  --alert-dismiss-button-focus-ring-color: var(--color-ring);
  --alert-info-background-color: var(--surface-background-color);
  --alert-info-border-color: var(--color-info-border);
  --alert-info-text-color: var(--surface-content-color);
  --alert-info-icon-color: var(--surface-muted-content-color);
  /* Status messaging: wash the surface, keep chroma on icon and border. Buttons keep the filled semantics. */
  --alert-success-background-color: color-mix(in oklab, var(--color-success-background-color) 18%, var(--surface-background-color));
  --alert-success-border-color: color-mix(in oklab, var(--color-success-background-color) 42%, var(--surface-border-color));
  --alert-success-text-color: var(--surface-content-color);
  --alert-success-icon-color: color-mix(in oklab, var(--color-success-background-color) 78%, black);
  --alert-warning-background-color: color-mix(in oklab, var(--color-warning-background-color) 18%, var(--surface-background-color));
  --alert-warning-border-color: color-mix(in oklab, var(--color-warning-background-color) 42%, var(--surface-border-color));
  --alert-warning-text-color: var(--surface-content-color);
  --alert-warning-icon-color: color-mix(in oklab, var(--color-warning-background-color) 78%, black);
  --alert-danger-background-color: color-mix(in oklab, var(--color-danger-background-color) 18%, var(--surface-background-color));
  --alert-danger-border-color: color-mix(in oklab, var(--color-danger-background-color) 42%, var(--surface-border-color));
  --alert-danger-text-color: var(--surface-content-color);
  --alert-danger-icon-color: color-mix(in oklab, var(--color-danger-background-color) 78%, black);
  --toast-border-radius: var(--radius-md);
  --toast-padding: 1rem;
  --toast-shadow: var(--shadow-lg);
  --toast-dismiss-text-color: var(--surface-muted-content-color);
  --toast-dismiss-hover-text-color: var(--surface-content-color);
  --toast-dismiss-hover-background-color: color-mix(in oklab, currentColor 8%, transparent);
  --toast-danger-dismiss-background-color: transparent;
  --toast-danger-dismiss-hover-background-color: var(--toast-dismiss-hover-background-color);
  --toast-danger-dismiss-text-color: var(--toast-dismiss-text-color);
  --toast-info-background-color: var(--alert-info-background-color);
  --toast-info-border-color: var(--alert-info-border-color);
  --toast-info-text-color: var(--alert-info-text-color);
  --toast-info-icon-color: var(--alert-info-icon-color);
  --toast-success-background-color: var(--alert-success-background-color);
  --toast-success-border-color: var(--alert-success-border-color);
  --toast-success-text-color: var(--alert-success-text-color);
  --toast-success-icon-color: var(--alert-success-icon-color);
  --toast-warning-background-color: var(--alert-warning-background-color);
  --toast-warning-border-color: var(--alert-warning-border-color);
  --toast-warning-text-color: var(--alert-warning-text-color);
  --toast-warning-icon-color: var(--alert-warning-icon-color);
  --toast-danger-background-color: var(--alert-danger-background-color);
  --toast-danger-border-color: var(--alert-danger-border-color);
  --toast-danger-text-color: var(--alert-danger-text-color);
  --toast-danger-icon-color: var(--alert-danger-icon-color);
  --avatar-background-color: var(--surface-muted-background-color);
  --avatar-text-color: var(--surface-content-color);
  --avatar-link-hover-opacity: 0.8;
  --avatar-radius-circle: 9999px;
  --avatar-radius-rounded: var(--radius-xl);
  --avatar-radius-square: var(--radius-md);
  --avatar-status-ring-color: var(--surface-border-color);
  --avatar-status-online-color: oklch(0.73 0.19 150);
  --avatar-status-offline-color: var(--surface-muted-content-color);
  --avatar-status-busy-color: oklch(0.64 0.23 28);
  --avatar-status-away-color: oklch(0.77 0.16 80);
  --avatar-group-overlap-sm: -0.25rem;
  --avatar-group-overlap-md: -0.5rem;
  --avatar-group-overlap-lg: -0.75rem;
  --avatar-group-ring-color: var(--surface-background-color);
  --color-swatch-radius: 9999px;
  --color-swatch-border-color: var(--surface-border-color);
  --color-swatch-selected-ring-color: var(--color-ring);
  --color-swatch-ring-offset-color: var(--surface-background-color);
  --color-swatch-shadow: var(--shadow-sm);
  --font-swatch-radius: 9999px;
  --font-swatch-border-color: var(--surface-border-color);
  --font-swatch-selected-ring-color: var(--color-ring);
  --font-swatch-ring-offset-color: var(--surface-background-color);
  --font-swatch-shadow: var(--shadow-sm);
  --font-swatch-background-color: var(--surface-background-color);
  --font-swatch-text-color: var(--surface-content-color);
  --overflow-row-gap: var(--stack-gap-md);
  --overflow-row-fade-size: 2rem;
  --top-nav-background-color: transparent;
  --top-nav-border-color: transparent;
  --top-nav-item-text-color: var(--surface-muted-content-color);
  --top-nav-item-icon-color: var(--surface-muted-content-color);
  --top-nav-item-hover-background-color: var(--surface-muted-background-color);
  --top-nav-item-hover-text-color: var(--surface-content-color);
  --top-nav-item-active-background-color: #333;
  --top-nav-item-active-text-color: var(--color-primary-text);
  --top-nav-item-active-icon-color: var(--color-primary-text);
  --top-nav-height: 72px;
  --top-nav-backdrop-blur: 16px;
  --search-icon-color: var(--surface-muted-content-color);
  --search-input-background-color: var(--surface-background-color);
  --search-input-border-color: var(--surface-border-hover-color);
  --search-input-text-color: var(--surface-content-color);
  --search-input-placeholder-color: var(--surface-muted-content-color);
  --search-input-focus-ring-color: var(--color-primary);
  --search-padding-y-sm: 0.375rem;
  --search-padding-y-md: 0.5rem;
  --search-padding-y-lg: 0.75rem;
  --search-padding-inline-sm: 2rem;
  --search-padding-inline-md: 2.5rem;
  --search-padding-inline-lg: 3rem;
  --search-dropdown-background-color: var(--surface-background-color);
  --search-dropdown-border-color: var(--surface-border-color);
  --search-dropdown-muted-text-color: var(--surface-muted-content-color);
  --search-result-title-color: var(--surface-content-color);
  --search-result-description-color: var(--surface-muted-content-color);
  --search-result-hover-background-color: var(--surface-muted-background-color);
  --search-result-divider-color: var(--surface-border-color);
  --color-ring: #333;
  --stack-gap-sm: 0.5rem;
  --stack-gap-md: 1rem;
  --stack-gap-lg: 1.5rem;
  --form-control-padding: 0.875rem;
  --table-padding: 0.875rem;
  --table-background-color: var(--surface-background-color);
  --table-border-color: var(--surface-border-color);
  --table-header-background-color: var(--surface-background-color);
  --table-header-border-color: var(--surface-border-color);
  --table-header-text-color: var(--surface-muted-content-color);
  --table-row-divider-color: var(--surface-border-color);
  --table-row-hover-background-color: var(--surface-muted-background-color);
  --table-cell-text-color: var(--surface-content-color);
  --table-cell-muted-text-color: var(--surface-muted-content-color);
  --table-empty-state-text-color: var(--surface-muted-content-color);
  --table-sort-link-hover-color: var(--surface-content-color);
  --chip-remove-hover-background-color: rgb(0 0 0 / 0.1);
  --chip-border-radius: 0.5rem;
  --chip-group-gap: 0.5rem;
  --chip-padding-x-sm: 0.5rem;
  --chip-padding-y-sm: 0.125rem;
  --chip-padding-x-md: 0.75rem;
  --chip-padding-y-md: 0.25rem;
  --chip-padding-x-lg: 1rem;
  --chip-padding-y-lg: 0.375rem;
  --picker-badge-background-color: rgb(0 0 0 / 0.55);
  --picker-badge-text-color: oklch(1.0 0 0);
  --picker-selection-idle-background-color: rgb(0 0 0 / 0.3);
  --picker-selection-idle-ring-color: rgb(0 0 0 / 0.2);
  --picker-selection-indicator-border-color: var(--picker-badge-text-color);
  --picker-selection-indicator-fill-color: var(--picker-badge-text-color);
  --font-sans: system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
  --font-mono: ui-monospace, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.25rem;
  --text-2xl: 1.5rem;
  --text-3xl: 1.875rem;
  --text-4xl: 2.25rem;
  --text-5xl: 3rem;
  --leading-tight: 1.25;
  --leading-snug: 1.375;
  --leading-normal: 1.5;
  --page-title-h1-size: var(--text-4xl);
  --page-title-h2-size: var(--text-3xl);
  --page-title-h3-size: var(--text-2xl);
  --page-title-h4-size: var(--text-xl);
  --page-title-h5-size: var(--text-lg);
  --page-title-h6-size: var(--text-base);
  --content-kicker-size: var(--text-lg);
  --content-p-size: var(--text-lg);
  --content-lead-size: var(--text-2xl);
  --content-h1-size: var(--text-5xl);
  --content-h2-size: var(--text-3xl);
  --content-h3-size: var(--text-2xl);
  --content-h4-size: var(--text-xl);
  --content-h5-size: var(--text-lg);
  --content-h6-size: var(--text-lg);
  --hero-headline-size: var(--text-5xl);
  --hero-description-size: var(--text-xl);
  --shadow-sm: 0 2px 6px -2px rgb(0 0 0 / 0.08);
  --shadow-md: 0 8px 18px -6px rgb(0 0 0 / 0.14);
  --shadow-lg: 0 18px 30px -10px rgb(0 0 0 / 0.18);
  --shadow-button: 0 8px 18px -8px rgb(0 0 0 / 0.22);
  --shadow-button-active: 0 4px 10px -6px rgb(0 0 0 / 0.28);
  --kbd-shadow: 0 1px 0 var(--surface-border-color);
  --modal-backdrop-blur: 4px;
  --drawer-backdrop-blur: var(--modal-backdrop-blur);
  --icon-stroke-width: 1.5;
  --radius-sm: 0.75rem;
  --radius-md: 1rem;
  --radius-lg: 1.5rem;
  --radius-xl: 2rem;
  /* Concrete values live here. @theme inline only registers names for Tailwind. */
  --duration-fast: 150ms;
  --duration-base: 200ms;
  --duration-slow: 300ms;
  --easing-standard: cubic-bezier(0.2, 0, 0, 1);
  --easing-enter: cubic-bezier(0.05, 0.7, 0.1, 1);
  --easing-exit: cubic-bezier(0.3, 0, 1, 1);
  /* List / layout only — overlays stay on enter/exit with no bounce. */
  --easing-spring: cubic-bezier(0.34, 1.25, 0.64, 1);
  --easing-spring-snappy: cubic-bezier(0.22, 1.35, 0.36, 1);
  --transition-fast: var(--duration-fast);
  --transition-base: var(--duration-base);
  --transition-slow: var(--duration-slow);
}

/* ApexCharts tooltips can be rendered outside chart containers and keep
 * a built-in .apexcharts-theme-light style. Force them to use app surface tokens.
 */
.apexcharts-tooltip.apexcharts-theme-light.apexcharts-theme-light,
.apexcharts-xaxistooltip.apexcharts-theme-light.apexcharts-theme-light,
.apexcharts-yaxistooltip.apexcharts-theme-light.apexcharts-theme-light {
  background: var(--surface-page-background-color) !important;
  border: 1px solid var(--surface-border-color) !important;
  color: var(--surface-content-color) !important;
}

.apexcharts-tooltip.apexcharts-theme-light.apexcharts-theme-light .apexcharts-tooltip-title,
.apexcharts-xaxistooltip.apexcharts-theme-light.apexcharts-theme-light,
.apexcharts-yaxistooltip.apexcharts-theme-light.apexcharts-theme-light {
  background: var(--surface-page-background-color) !important;
  border-color: var(--surface-border-color) !important;
  color: var(--surface-content-color) !important;
}

/* Dark theme — overrides only (inherits component aliases from :root) */
[data-theme="dark"] {
  color-scheme: dark;
  --color-primary: oklch(0.62 0.22 250);
  --color-primary-hover: oklch(0.72 0.15 250);
  --color-primary-text: oklch(0.15 0.01 250);
  --color-secondary: oklch(0.20 0.02 250);
  --color-secondary-hover: oklch(0.25 0.03 250);
  --color-secondary-text: oklch(0.90 0.01 250);
  --color-ghost-hover: oklch(0.22 0.02 250);
  --color-ghost-text: oklch(0.85 0.01 250);
  --color-success-background-color: oklch(67% .194 149.214);
  --color-success-hover-background-color: oklch(72% .194 149.214);
  --color-success-text: oklch(0.15 0.01 250);
  --color-warning-background-color: oklch(75% 0.183 55.934);
  --color-warning-hover-background-color: oklch(70.5% 0.213 47.604);
  --color-warning-text: oklch(0.15 0.01 250);
  --surface-background-color: oklch(0.15 0.01 250);
  --surface-page-background-color: oklch(0.15 0.01 250);
  --surface-content-color: oklch(0.95 0.01 250);
  --surface-muted-background-color: oklch(0.22 0.02 250);
  --surface-muted-content-color: oklch(0.65 0.01 250);
  --surface-border-color: oklch(0.30 0.02 250);
  --surface-border-hover-color: oklch(0.40 0.03 250);
  --carousel-chevron-background-color: rgb(15 20 36 / 0.72);
  --bottom-nav-background-color: oklch(0.11 0.01 250);
  --bottom-nav-border-color: oklch(0.29 0.02 250);
  --bottom-nav-item-active-color: var(--color-primary-hover);
  --bottom-nav-item-color: oklch(0.76 0.01 250);
  --bottom-nav-item-hover-color: oklch(0.96 0.01 250);
  --switch-track-background-color: color-mix(in oklab, oklch(0.38 0.05 249.96) 92%, black);
  --comments-inline-input-radius: 9999px;
  --modal-backdrop-color: rgb(0 0 0 / 0.65);
  --list-item-hover-background-color: oklch(0.26 0.02 250);
  --list-item-active-background-color: oklch(0.30 0.03 250);
  --color-ring: oklch(0.62 0.22 250);
  --chip-remove-hover-background-color: rgb(255 255 255 / 0.16);
  --shadow-sm: 0 1px 2px rgb(0 0 0 / 0.55), 0 0 0 1px rgb(255 255 255 / 0.06);
  --shadow-md: 0 10px 24px -8px rgb(0 0 0 / 0.65), 0 0 0 1px rgb(255 255 255 / 0.08);
  --shadow-lg: 0 22px 40px -12px rgb(0 0 0 / 0.72), 0 0 0 1px rgb(255 255 255 / 0.1);
  --shadow-button: 0 0 15px 0px rgba(142, 142, 142, 0.15);
  --shadow-button-active: 0 0 8px 4px rgba(142, 142, 142, 0.15);
  --modal-backdrop-blur: 3px;
  --sidebar-background-color: oklch(0.17 0.01 250);
  --top-nav-background-color: oklch(0.18 0.01 250);
}

/* Ocean theme — overrides only */
[data-theme="ocean"] {
  --color-primary: oklch(0.52 0.15 220);
  --color-primary-hover: oklch(0.42 0.18 220);
  --color-secondary: oklch(0.92 0.02 220);
  --color-secondary-hover: oklch(0.87 0.03 220);
  --color-secondary-text: oklch(0.25 0.02 220);
  --color-ghost-hover: oklch(0.94 0.02 220);
  --color-ghost-text: oklch(0.35 0.02 220);
  --surface-background-color: oklch(0.98 0.01 220);
  --surface-page-background-color: oklch(0.98 0.01 220);
  --surface-content-color: oklch(0.20 0.02 220);
  --surface-muted-background-color: oklch(0.94 0.02 220);
  --surface-muted-content-color: oklch(0.45 0.02 220);
  --surface-border-color: oklch(0.87 0.02 220);
  --surface-border-hover-color: oklch(0.80 0.03 220);
  --carousel-chevron-background-color: rgb(14 79 128 / 0.72);
  --bottom-nav-background-color: oklch(0.30 0.07 235);
  --bottom-nav-border-color: oklch(0.43 0.08 230);
  --bottom-nav-item-active-color: oklch(0.95 0.03 220);
  --bottom-nav-item-color: oklch(0.81 0.04 220);
  --bottom-nav-item-hover-color: oklch(0.99 0.01 220);
  --modal-backdrop-color: rgb(3 24 47 / 0.45);
  --list-item-hover-background-color: oklch(0.92 0.03 220);
  --list-item-active-background-color: oklch(0.88 0.04 220);
  --sidebar-group-item-indent: 0.875rem;
  --avatar-status-ring-color: var(--surface-background-color);
  --color-ring: oklch(0.52 0.15 220);
  --modal-backdrop-blur: 5px;
  --sidebar-background-color: oklch(0.96 0.02 220);
  --top-nav-background-color: oklch(0.97 0.01 220);
}

/* Rounded theme — no-op alias of :root. Hosts may keep data-theme="rounded". */
[data-theme="rounded"] {
}

@media (prefers-reduced-motion: reduce) {
  :root,
  html {
    --duration-fast: 0ms;
    --duration-base: 0ms;
    --duration-slow: 0ms;
    --skeleton-shimmer-duration: 0ms;
  }
}