@use './size';
@use './themes/theme-dark';
@use './themes/theme-refined-dark';
@use './themes/theme-graperoot-dark';
@use './themes/theme-bright';
@use './themes/theme-aurora';
@use './themes/theme-monokai';
@use './themes/theme-paper';
@use './themes/theme-nature-pure';
@use './themes/theme-dopamine';
@use './themes/theme-mermaidcore';
@use './themes/theme-cool-elegance';
@use './themes/theme-banana-yellow';
@use './themes/theme-clubroom-contrast';
@use './themes/theme-sun-washed-soft';
@use './themes/theme-vintage-neutral';
@use './themes/theme-dracula';
@use './themes/theme-nord';
@use './themes/theme-cvd-friendly-dark';
@use './themes/theme-cvd-friendly-bright';


:root,
body {
  --mobile-size: size.$mobile-breakpoint;
  --dashboard-mobile-size: size.$dashboard-mobile-breakpoint;
  --sidebar-width-expanded: 240px;
  --sidebar-width-collapsed: 36px;
  --max-view-width: size.$dashboard-mobile-breakpoint;
  --max-table-cell-width: 240px;
  --max-dialog-card-height: 300px;
  --media-size-mobile: 600px;
  --app-header-height: 56px;
  --scrollbar-width: 8px;
  --scrollbar-border-radius: 4px;
  --action-card-width: 380px;

  --gap-micro: 0.3rem;
  --gap-mini: 0.3rem;
  --gap-small: 0.3rem;
  --gap-default: 0.5rem;
  --gap-large: 1rem;
  --gap-larger: 1.5rem;

  --padding-micro: 0.2rem;
  --padding-mini: 0.5rem;
  --padding-small: 0.75rem;
  --padding-default: 1rem;
  --padding-large: 1.5rem;
  --padding-larger: 2rem;

  --margin-micro: 0.2rem;
  --margin-mini: 0.5rem;
  --margin-small: 0.75rem;
  --margin-default: 1rem;

  --font-size-xs: 0.7rem;
  --font-size-sm: 0.85rem;
  --font-size-base: 0.9rem;
  --font-size-norm: 1rem;
  --font-size-md: 1.1rem;
  --font-size-lg: 1.2rem;
  --font-size-xl: 1.5rem;

  --epg-row-height: 4rem;
  --epg-header-height: 2.5rem;
  --epg-channels-width: 300px;
  --border-radius: 8px;
  --border-radius-small: 6px;
  --tag-padding: 0.3rem 0.5rem;
  --tag-border-radius: 0.5rem;
  --icon-button-border-radius: 4px;

  --source-editor-sidebar-collapsed-width: 2rem;
  --source-editor-sidebar-expanded-width: 7.5rem;

  --dashboard-card-icon-width: 3rem;
}

@media (max-width: size.$mobile-breakpoint) {
  :root,
  body {
    --gap-mini: 0.1rem;
    --gap-small: 0.1rem;
    --gap-default: 0.17rem;
    --gap-large: 0.33rem;
    --gap-larger: 0.5rem;

    --padding-micro: 0.07rem;
    --padding-mini: 0.17rem;
    --padding-small: 0.25rem;
    --padding-default: 0.33rem;
    --padding-large: 0.5rem;
    --padding-larger: 0.67rem;

    --margin-micro: 0.07rem;
    --margin-mini: 0.17rem;
    --margin-small: 0.25rem;
    --margin-default: 0.33rem;

    --font-size-xs: 0.75rem;
    --font-size-sm: 0.8rem;
    --font-size-base: 0.85rem;
    --font-size-norm: 0.9rem;
    --font-size-md: 0.95rem;
    --font-size-lg: 1.05rem;
    --font-size-xl: 1.15rem;

    --epg-row-height: 3rem;
    --epg-header-height: 2.5rem;
    --epg-channels-width: 160px;
  }
}

:root,
body {
  --theme-palette-contrast-base: #000000;
  --theme-palette-contrast-inverse: #ffffff;

  --theme-palette-surface: var(--theme-palette-neutral-surface-940);
  --theme-palette-surface-soft: var(--theme-palette-neutral-surface-920);
  --theme-palette-surface-muted: var(--theme-palette-neutral-surface-900);
  --theme-palette-surface-strong: var(--theme-palette-neutral-surface-880);
  --theme-palette-surface-header: var(--theme-palette-neutral-surface-980);
  --theme-palette-surface-tooltip: var(--theme-palette-neutral-surface-960);
  --theme-palette-surface-menu: var(--theme-palette-neutral-surface-840);
  --theme-palette-surface-tabset: var(--theme-palette-neutral-surface-820);
  --theme-palette-surface-tab: var(--theme-palette-neutral-surface-620);
  --theme-palette-surface-breadcrumbs: var(--theme-palette-neutral-surface-600);
  --theme-palette-surface-breadcrumb: var(--theme-palette-neutral-surface-580);
  --theme-palette-surface-showcase: var(--theme-palette-neutral-surface-560);
  --theme-palette-surface-toolbar: var(--theme-palette-neutral-surface-540);
  --theme-palette-surface-toolbar-alt: var(--theme-palette-neutral-surface-520);
  --theme-palette-surface-table: var(--theme-palette-neutral-surface-550);
  --theme-palette-surface-card-gradient: var(--theme-palette-neutral-surface-700);
  --theme-palette-surface-input: var(--theme-palette-neutral-surface-700);
  --theme-palette-surface-option-active: var(--theme-palette-state-surface-option-active);
  --theme-palette-surface-dialog-backdrop: var(--theme-palette-neutral-surface-640);
  --theme-palette-surface-modal-backdrop: var(--theme-palette-neutral-surface-660);
  --theme-palette-surface-setup-hover: var(--theme-palette-neutral-surface-780);
  --theme-palette-surface-setup-active: var(--theme-palette-neutral-surface-800);
  --theme-palette-surface-code: var(--theme-palette-neutral-surface-code);
  --theme-palette-surface-code-solid: var(--theme-palette-neutral-surface-code-solid);
  --theme-palette-surface-code-compare: var(--theme-palette-neutral-surface-code-compare);
  --theme-palette-surface-glass: var(--theme-palette-neutral-surface-760);
  --theme-palette-surface-glass-gradient-1: var(--theme-palette-neutral-surface-700);
  --theme-palette-surface-glass-gradient-2: var(--theme-palette-neutral-surface-740);
  --theme-palette-surface-glass-input: var(--theme-palette-neutral-surface-680);

  --theme-palette-border: var(--theme-palette-accent-border-500);
  --theme-palette-border-strong: var(--theme-palette-accent-border-500);
  --theme-palette-border-hover: var(--theme-palette-accent-border-460);
  --theme-palette-border-focus: var(--theme-palette-accent-border-380);
  --theme-palette-border-popup: var(--theme-palette-accent-border-340);
  --theme-palette-border-soft: var(--theme-palette-neutral-border-460);
  --theme-palette-border-tabset: var(--theme-palette-neutral-border-560);
  --theme-palette-border-table: var(--theme-palette-neutral-border-520);
  --theme-palette-border-muted: var(--theme-palette-neutral-border-500);
  --theme-palette-border-input: var(--theme-palette-neutral-border-420);
  --theme-palette-border-selection: var(--theme-palette-neutral-border-380);

  --theme-palette-text: var(--theme-palette-neutral-text-900);
  --theme-palette-text-muted: var(--theme-palette-neutral-text-620);
  --theme-palette-text-soft: var(--theme-palette-neutral-text-580);
  --theme-palette-text-menu: var(--theme-palette-neutral-text-760);
  --theme-palette-text-inverse: var(--theme-palette-contrast-inverse);
  --theme-palette-text-title: var(--theme-palette-neutral-text-580);
  --theme-palette-text-card: var(--theme-palette-neutral-text-700);
  --theme-palette-text-rating: var(--theme-palette-contrast-inverse);
  --theme-palette-text-breadcrumb: var(--theme-palette-neutral-text-560);
  --theme-palette-text-disabled: var(--theme-palette-neutral-text-500);
  --theme-palette-text-disabled-border: var(--theme-palette-neutral-text-460);
  --theme-palette-text-disabled-surface: var(--theme-palette-neutral-text-420);

  --theme-brand-primary: var(--theme-palette-primary);
  --theme-brand-primary-soft: var(--theme-palette-primary-soft);
  --theme-brand-primary-hover-soft: var(--theme-palette-primary-hover-soft);
  --theme-brand-primary-active-soft: var(--theme-palette-primary-active-soft);
  --theme-brand-primary-hover: var(--theme-palette-primary-hover);
  --theme-brand-primary-hover-strong: var(--theme-palette-primary-hover-strong);
  --theme-brand-primary-border: var(--theme-palette-primary-border);
  --theme-brand-primary-menu-hover: var(--theme-palette-primary-menu-hover);
  --theme-brand-primary-tool-hover: var(--theme-palette-primary-tool-hover);
  --theme-brand-primary-tree-hover: var(--theme-palette-primary-tree-hover);
  --theme-brand-primary-tab-hover: var(--theme-palette-primary-tab-hover);
  --theme-brand-primary-tab-active: var(--theme-palette-primary-tab-active);
  --theme-brand-primary-tab-border: var(--theme-palette-primary-tab-border);
  --theme-brand-primary-spinner: var(--theme-palette-primary-spinner);

  --theme-brand-secondary: var(--theme-palette-secondary);
  --theme-brand-secondary-soft: var(--theme-palette-secondary-soft);
  --theme-brand-secondary-hover: var(--theme-palette-secondary-hover);
  --theme-brand-secondary-border: var(--theme-palette-secondary-border);

  --theme-brand-text: var(--theme-palette-text);
  --theme-brand-text-muted: var(--theme-palette-text-muted);
  --theme-brand-text-soft: var(--theme-palette-text-soft);
  --theme-brand-text-menu: var(--theme-palette-text-menu);
  --theme-brand-text-inverse: var(--theme-palette-text-inverse);
  --theme-brand-text-header: var(--theme-palette-text-header);
  --theme-brand-text-label: var(--theme-palette-text-label);
  --theme-brand-text-title: var(--theme-palette-text-title);
  --theme-brand-text-card: var(--theme-palette-text-card);
  --theme-brand-text-rating: var(--theme-palette-text-rating);
  --theme-brand-text-option-active: var(--theme-palette-text-option-active);
  --theme-brand-text-breadcrumb: var(--theme-palette-text-breadcrumb);
  --theme-brand-text-menu-warn: var(--theme-palette-text-menu-warn);
  --theme-brand-text-menu-warn-strong: var(--theme-palette-text-menu-warn-strong);
  --theme-brand-text-disabled: var(--theme-palette-text-disabled);
  --theme-brand-text-disabled-border: var(--theme-palette-text-disabled-border);
  --theme-brand-text-disabled-surface: var(--theme-palette-text-disabled-surface);

  --theme-brand-page: var(--theme-palette-page);
  --theme-brand-particle: var(--theme-palette-particle);
  --theme-brand-particle-alt: var(--theme-palette-particle-alt);
  --theme-brand-surface: var(--theme-palette-surface);
  --theme-brand-surface-soft: var(--theme-palette-surface-soft);
  --theme-brand-surface-muted: var(--theme-palette-surface-muted);
  --theme-brand-surface-strong: var(--theme-palette-surface-strong);
  --theme-brand-surface-header: var(--theme-palette-surface-header);
  --theme-brand-surface-tooltip: var(--theme-palette-surface-tooltip);
  --theme-brand-surface-menu: var(--theme-palette-surface-menu);
  --theme-brand-surface-tabset: var(--theme-palette-surface-tabset);
  --theme-brand-surface-tab: var(--theme-palette-surface-tab);
  --theme-brand-surface-breadcrumbs: var(--theme-palette-surface-breadcrumbs);
  --theme-brand-surface-breadcrumb: var(--theme-palette-surface-breadcrumb);
  --theme-brand-surface-showcase: var(--theme-palette-surface-showcase);
  --theme-brand-surface-toolbar: var(--theme-palette-surface-toolbar);
  --theme-brand-surface-table: var(--theme-palette-surface-table);
  --theme-brand-surface-toolbar-alt: var(--theme-palette-surface-toolbar-alt);
  --theme-brand-surface-card-gradient: var(--theme-palette-surface-card-gradient);
  --theme-brand-surface-input: var(--theme-palette-surface-input);
  --theme-brand-surface-option-active: var(--theme-palette-surface-option-active);
  --theme-brand-surface-dialog-backdrop: var(--theme-palette-surface-dialog-backdrop);
  --theme-brand-surface-modal-backdrop: var(--theme-palette-surface-modal-backdrop);
  --theme-brand-surface-setup-hover: var(--theme-palette-surface-setup-hover);
  --theme-brand-surface-setup-active: var(--theme-palette-surface-setup-active);
  --theme-brand-surface-code: var(--theme-palette-surface-code);
  --theme-brand-surface-code-solid: var(--theme-palette-surface-code-solid);
  --theme-brand-surface-code-compare: var(--theme-palette-surface-code-compare);
  --theme-brand-surface-glass: var(--theme-palette-surface-glass);
  --theme-brand-surface-glass-gradient-1: var(--theme-palette-surface-glass-gradient-1);
  --theme-brand-surface-glass-gradient-2: var(--theme-palette-surface-glass-gradient-2);
  --theme-brand-surface-glass-input: var(--theme-palette-surface-glass-input);

  --theme-brand-border: var(--theme-palette-border);
  --theme-brand-border-strong: var(--theme-palette-border-strong);
  --theme-brand-border-hover: var(--theme-palette-border-hover);
  --theme-brand-border-focus: var(--theme-palette-border-focus);
  --theme-brand-border-popup: var(--theme-palette-border-popup);
  --theme-brand-border-soft: var(--theme-palette-border-soft);
  --theme-brand-border-tabset: var(--theme-palette-border-tabset);
  --theme-brand-border-table: var(--theme-palette-border-table);
  --theme-brand-border-muted: var(--theme-palette-border-muted);
  --theme-brand-border-input: var(--theme-palette-border-input);
  --theme-brand-border-selection: var(--theme-palette-border-selection);

  --theme-brand-tertiary-surface: var(--theme-palette-accent-tone-soft-surface);
  --theme-brand-tertiary-border: var(--theme-palette-accent-tone-soft-border);
  --theme-brand-tertiary-text: var(--theme-palette-accent-tone-text);
  --theme-brand-tertiary-title: var(--theme-palette-accent-tone-text);
  --theme-brand-tertiary-hover: var(--theme-palette-accent-tone-soft-hover);
  --theme-brand-tertiary-hover-text: var(--theme-palette-accent-tone-text-soft);

  --theme-brand-positive: var(--theme-palette-success-tone-520);
  --theme-brand-positive-soft: var(--theme-palette-success-tone-soft-200);
  --theme-brand-positive-border: var(--theme-palette-success-tone-border);
  --theme-brand-positive-strong: var(--theme-palette-success-tone-strong);
  --theme-brand-positive-hover: var(--theme-palette-success-tone-hover);
  --theme-brand-positive-text: var(--theme-palette-success-tone-text);
  --theme-brand-positive-title: var(--theme-palette-success-tone-500);

  --theme-brand-warning: var(--theme-palette-warning-tone-420);
  --theme-brand-warning-background: var(--theme-palette-warning-tone-background);
  --theme-brand-warning-strong: var(--theme-palette-warning-tone-520);
  --theme-brand-warning-base: var(--theme-palette-warning-tone-500);
  --theme-brand-danger: var(--theme-palette-danger-tone-520);
  --theme-brand-danger-strong: var(--theme-palette-danger-tone-500);
  --theme-brand-danger-deep: var(--theme-palette-danger-tone-480);
  --theme-brand-active: var(--theme-palette-success-tone-540);
  --theme-brand-info: var(--theme-palette-info-tone-500);
  --theme-brand-info-strong: var(--theme-palette-info-tone-520);
  --theme-brand-info-surface: var(--theme-palette-info-tone-surface);
  --theme-brand-info-border: var(--theme-palette-info-tone-border);
  --theme-brand-success-alt: var(--theme-palette-success-tone-500);
  --theme-brand-success-soft-alt: var(--theme-palette-success-tone-380);
  --theme-brand-quaternary: var(--theme-palette-quaternary-tone-500);
  --theme-brand-emphasis: var(--theme-palette-emphasis-tone-500);
  --theme-brand-accent: var(--theme-palette-accent-tone-500);

  --theme-brand-log-console-background: var(--theme-palette-log-console-background);
  --theme-brand-log-console-text: var(--theme-palette-log-console-text);
  --theme-brand-log-console-muted: var(--theme-palette-log-console-muted);
  --theme-brand-log-console-trace: var(--theme-palette-log-console-trace);
  --theme-brand-log-console-debug: var(--theme-palette-log-console-debug);
  --theme-brand-log-console-info: var(--theme-palette-log-console-info);
  --theme-brand-log-console-warn: var(--theme-palette-log-console-warn);
  --theme-brand-log-console-error: var(--theme-palette-log-console-error);
  --theme-brand-log-console-success: var(--theme-palette-log-console-success);
  --theme-brand-log-console-target: var(--theme-palette-log-console-target);

  --theme-brand-tag-surface: var(--theme-palette-status-tag-surface);
  --theme-brand-tag-active-text: var(--theme-palette-status-tag-active-text);
  --theme-brand-tag-active-surface: var(--theme-palette-status-tag-active-surface);
  --theme-brand-tag-active-border: var(--theme-palette-status-tag-active-border);
  --theme-brand-tag-alt-text: var(--theme-palette-status-tag-alt-text);
  --theme-brand-tag-alt-surface: var(--theme-palette-status-tag-alt-surface);
  --theme-brand-tag-alt-border: var(--theme-palette-status-tag-alt-border);
  --theme-brand-tag-expired-text: var(--theme-palette-status-tag-expired-text);
  --theme-brand-tag-expired-surface: var(--theme-palette-status-tag-expired-surface);
  --theme-brand-tag-expired-border: var(--theme-palette-status-tag-expired-border);
  --theme-brand-tag-banned-text: var(--theme-palette-status-tag-banned-text);
  --theme-brand-tag-banned-surface: var(--theme-palette-status-tag-banned-surface);
  --theme-brand-tag-banned-border: var(--theme-palette-status-tag-banned-border);
  --theme-brand-live-surface: var(--theme-palette-status-live-surface);
  --theme-brand-video-surface: var(--theme-palette-status-video-surface);
  --theme-brand-series-surface: var(--theme-palette-status-series-surface);

  --theme-brand-popup-shadow: var(--theme-palette-shadow-popup);
  --theme-brand-card-shadow: var(--theme-palette-shadow-card);
  --theme-brand-scrollbar-track-shadow: var(--theme-palette-shadow-scrollbar-track);
  --theme-brand-scrollbar-handle: var(--theme-palette-scrollbar-handle);
  --theme-brand-tab-header-shadow: var(--theme-palette-shadow-tab-header);
  --theme-brand-field-code-shadow: var(--theme-palette-shadow-field-code);
  --theme-brand-toggle-shadow: var(--theme-palette-shadow-toggle);
  --theme-brand-toast-shadow: var(--theme-palette-shadow-toast);
  --theme-brand-source-block-shadow: var(--theme-palette-shadow-source-block);
  --theme-brand-glass-shadow: var(--theme-palette-shadow-glass);

  --theme-brand-menu-icon-update: var(--theme-palette-menu-icon-update);
  --theme-brand-menu-icon-user: var(--theme-palette-menu-icon-user);
  --theme-brand-menu-icon-api-server: var(--theme-palette-menu-icon-api-server);
  --theme-brand-menu-icon-main-config: var(--theme-palette-menu-icon-main-config);
  --theme-brand-menu-icon-status: var(--theme-palette-menu-icon-status);

  --theme-brand-code-identifier: var(--theme-palette-code-identifier);
  --theme-brand-code-var-access: var(--theme-palette-code-var-access);
  --theme-brand-code-field: var(--theme-palette-code-field);
  --theme-brand-code-property: var(--theme-palette-code-property);
  --theme-brand-code-literal: var(--theme-palette-code-literal);
  --theme-brand-code-num: var(--theme-palette-code-num);
  --theme-brand-code-builtin: var(--theme-palette-code-builtin);
  --theme-brand-code-reserved: var(--theme-palette-code-reserved);
  --theme-brand-code-regex: var(--theme-palette-code-regex);
  --theme-brand-code-enum: var(--theme-palette-code-enum);
  --theme-brand-code-range: var(--theme-palette-code-range);
  --theme-brand-code-op: var(--theme-palette-code-op);
  --theme-brand-code-compare-text: var(--theme-palette-code-compare-text);
  --theme-brand-code-bracket-1: var(--theme-palette-code-bracket-1);
  --theme-brand-code-bracket-2: var(--theme-palette-code-bracket-2);
  --theme-brand-code-bracket-3: var(--theme-palette-code-bracket-3);
  --theme-brand-code-any-match: var(--theme-palette-code-any-match);

  --theme-brand-epg-program-surface: var(--theme-palette-epg-program-surface);
  --theme-brand-epg-program-active-surface: var(--theme-palette-epg-program-active-surface);
  --theme-brand-epg-program-text: var(--theme-palette-epg-program-text);
  --theme-brand-epg-program-time: var(--theme-palette-epg-program-time);
  --theme-brand-epg-program-time-active: var(--theme-palette-epg-program-time-active);
  --theme-brand-epg-past-surface: var(--theme-palette-epg-past-surface);
  --theme-brand-epg-now-line: var(--theme-palette-epg-now-line);

  --theme-brand-particle-1: var(--theme-palette-particle-1);
  --theme-brand-particle-2: var(--theme-palette-particle-2);
  --theme-brand-particle-alpha-boost: var(--theme-palette-particle-alpha-boost);

  --theme-brand-chip-container-text: var(--theme-palette-chip-container-text);
  --theme-brand-chip-container-surface: var(--theme-palette-chip-container-surface);
  --theme-brand-chip-video-text: var(--theme-palette-chip-video-text);
  --theme-brand-chip-video-surface: var(--theme-palette-chip-video-surface);
  --theme-brand-chip-resolution-text: var(--theme-palette-chip-resolution-text);
  --theme-brand-chip-resolution-surface: var(--theme-palette-chip-resolution-surface);
  --theme-brand-chip-fps-text: var(--theme-palette-chip-fps-text);
  --theme-brand-chip-fps-surface: var(--theme-palette-chip-fps-surface);
  --theme-brand-chip-audio-text: var(--theme-palette-chip-audio-text);
  --theme-brand-chip-audio-surface: var(--theme-palette-chip-audio-surface);
  --theme-brand-chip-audio-channels-text: var(--theme-palette-chip-audio-channels-text);

  --theme-brand-brick-input-xtream: var(--theme-palette-graph-input-xtream);
  --theme-brand-brick-input-m3u: var(--theme-palette-graph-input-m3u);
  --theme-brand-brick-input-library: var(--theme-palette-graph-input-library);
  --theme-brand-brick-input-staged: var(--theme-palette-graph-input-staged);
  --theme-brand-brick-input-stalker: var(--theme-palette-graph-input-stalker);
  --theme-brand-brick-input-jellyfin: var(--theme-palette-graph-input-jellyfin);
  --theme-brand-brick-input-emby: var(--theme-palette-graph-input-emby);
  --theme-brand-brick-input-plex: var(--theme-palette-graph-input-plex);
  --theme-brand-brick-target: var(--theme-palette-graph-target);
  --theme-brand-brick-output: var(--theme-palette-graph-output);
  --theme-brand-brick-output-xtream: var(--theme-palette-graph-output-xtream);
  --theme-brand-brick-output-m3u: var(--theme-palette-graph-output-m3u);
  --theme-brand-brick-output-hdhomerun: var(--theme-palette-graph-output-hdhomerun);
  --theme-brand-brick-output-strm: var(--theme-palette-graph-output-strm);
  --theme-brand-brick-port: var(--theme-palette-graph-port);
  --theme-brand-brick-port-border: var(--theme-palette-graph-port-border);
  --theme-brand-brick-port-hover: var(--theme-palette-graph-port-hover);
  --theme-brand-graph-grid-1: var(--theme-palette-graph-grid-1);
  --theme-brand-graph-grid-2: var(--theme-palette-graph-grid-2);

  --theme-brand-login-logo: var(--theme-palette-login-logo);
  --theme-brand-series-title: var(--theme-palette-series-title);
  --theme-brand-series-backdrop-overlay: var(--theme-palette-series-backdrop-overlay);

  --primary-color: var(--theme-brand-primary);
  --secondary-color: var(--theme-brand-secondary);
  --theme-color: var(--theme-brand-primary);

  --background-color: var(--theme-brand-page);
  --particle-flow-background-color: var(--theme-brand-particle);
  --particle-flow-background-color-alt: var(--theme-brand-particle-alt);
  --particle-flow-background-accent-color-1: var(--theme-brand-particle-1);
  --particle-flow-background-accent-color-2: var(--theme-brand-particle-2);
  --particle-flow-background-alpha-boost: var(--theme-brand-particle-alpha-boost);

  --text-color: var(--theme-brand-text);
  --modest-text-color: var(--theme-brand-text-muted);
  --menu-text-color: var(--theme-brand-text-menu);
  --menu-icon-color: var(--theme-brand-text-muted);
  --menu-text-active-color: var(--theme-brand-primary);
  --card-color: var(--theme-brand-text-card);
  --action-item-color: var(--theme-brand-text-inverse);
  --menu-item-hover-color: var(--theme-brand-text);
  --icon-button-hover-color: var(--theme-brand-text);
  --toggle-switch-toggle-color: var(--theme-brand-text-inverse);
  --tool-button-color: var(--theme-brand-text-inverse);
  --tool-button-hover-color: var(--theme-brand-text-inverse);
  --toolbar-button-hover-color: var(--theme-brand-text-inverse);
  --tree-hover-color: var(--theme-brand-text-inverse);
  --tree-expander-hover-color: var(--theme-brand-text-inverse);
  --tooltip-color: var(--theme-brand-text);
  --popup-color: var(--theme-brand-text);
  --playlist-color: var(--theme-brand-text-card);
  --playlist-rating-color: var(--theme-brand-text-rating);
  --sidebar-toggle-color: var(--theme-brand-text);
  --sidebar-toggle-hover-color: var(--theme-brand-text-muted);
  --hint-color: var(--theme-brand-text-soft);
  --tree-count-color: var(--theme-brand-text-soft);
  --label-color: var(--theme-brand-text-label);
  --title-label-color: var(--theme-brand-text-title);
  --menu-button-color: var(--theme-brand-text-menu);
  --menu-button-hover-color: var(--theme-brand-text-header);
  --menu-button-warn-color: var(--theme-brand-text-menu-warn);
  --menu-button-warn-hover-color: var(--theme-brand-text-menu-warn-strong);
  --app-header-color: var(--theme-brand-text-header);
  --table-header-background-color: var(--theme-brand-surface-table);
  --table-card-background-color: var(--theme-brand-surface-muted);
  --table-alternate-background-color: var(--theme-brand-surface-toolbar);
  --table-border-color: var(--theme-brand-border-table);
  --playlist-rating-background-color: var(--theme-brand-surface-toolbar-alt);
  --scrollbar-track-color: var(--theme-brand-surface-toolbar-alt);
  --scrollbar-handle-color: var(--theme-brand-scrollbar-handle);
  --scrollbar-track-shadow: var(--theme-brand-scrollbar-track-shadow);

  --border-color: var(--theme-brand-border);
  --hover-border-color: var(--theme-brand-border-hover);
  --input-border-color: var(--theme-brand-border);
  --input-focus-border-color: var(--theme-brand-border-focus);
  --popup-border-color: var(--theme-brand-border-popup);
  --card-border-color: var(--theme-brand-border-strong);
  --tag-border-color: var(--theme-brand-border-soft);
  --tabset-border-color: var(--theme-brand-border-tabset);
  --icon-button-hover-border-color: var(--theme-brand-text-header);
  --text-button-border-color: var(--theme-brand-primary-soft);
  --text-button-primary-border-color: var(--theme-brand-primary-border);
  --text-button-secondary-border-color: var(--theme-brand-secondary-border);
  --text-button-disabled-border-color: var(--theme-brand-text-disabled-border);
  --checkbox-border-radius: 4px;

  --action-item-background-color: var(--theme-brand-primary-soft);
  --input-background-color: var(--theme-brand-surface-input);
  --button-background-color: var(--theme-brand-primary);
  --menu-item-hover-background-color: var(--theme-brand-primary-hover-soft);
  --menu-item-active-background-color: var(--theme-brand-primary-active-soft);
  --card-background-color: var(--theme-brand-surface);
  --sub-card-background-color: var(--theme-brand-surface-soft);
  --card-background-color-darker: var(--theme-brand-surface-strong);
  --popup-background-color: var(--theme-brand-surface);
  --tooltip-background-color: var(--theme-brand-surface-tooltip);
  --app-header-background-color: var(--theme-brand-surface-header);
  --menu-button-background-color: var(--theme-brand-surface-menu);
  --menu-button-hover-background-color: var(--theme-brand-primary-menu-hover);
  --menu-button-warn-hover-background-color: var(--theme-brand-tag-banned-surface);
  --icon-button-background-color: var(--button-background-color);
  --icon-button-color: var(--theme-brand-text);
  --icon-button-hover-background-color: var(--theme-brand-primary-tool-hover);
  --tool-button-background-color: var(--theme-brand-surface-toolbar);
  --tool-button-hover-background-color: var(--theme-brand-primary-tool-hover);
  --toolbar-background-color: var(--theme-brand-surface-toolbar);
  --toolbar-bg-color: var(--theme-brand-surface-toolbar-alt);
  --toolbar-button-hover-background-color: var(--theme-brand-primary-tool-hover);
  --tabset-background-color: var(--theme-brand-surface-tabset);
  --tab-background-color: var(--theme-brand-surface-tab);
  --tab-hover-background-color: var(--theme-brand-primary-tab-hover);
  --tab-active-background-color: var(--theme-brand-primary-tab-active);
  --tab-active-border-color: var(--theme-brand-primary-tab-border);
  --tab-hover-color: var(--theme-brand-text-inverse);
  --tab-active-color: var(--theme-brand-text-inverse);
  --checkbox-background-color: var(--theme-brand-surface-tab);
  --checkbox-hover-background-color: var(--theme-brand-primary-tool-hover);
  --checkbox-checked-background-color: var(--theme-brand-primary-tool-hover);
  --option-active-background-color: var(--theme-brand-surface-option-active);
  --option-active-color: var(--theme-brand-text-option-active);
  --showcase-card-background: var(--theme-brand-surface-showcase);
  --breadcrumbs-background-color: var(--theme-brand-surface-breadcrumbs);
  --breadcrumb-background-color: var(--theme-brand-surface-breadcrumb);
  --breadcrumb-active-background-color: var(--theme-brand-positive-soft);
  --breadcrumb-color: var(--theme-brand-text-breadcrumb);
  --breadcrumb-active-color: var(--theme-brand-text-option-active);
  --tree-hover-background-color: var(--theme-brand-primary-tree-hover);

  --tertiary-background-color: var(--theme-brand-tertiary-surface);
  --tertiary-border-color: var(--theme-brand-tertiary-border);
  --tertiary-text-color: var(--theme-brand-tertiary-text);
  --tertiary-title-text-color: var(--theme-brand-tertiary-title);
  --quaternary-background-color: var(--theme-brand-positive-soft);
  --quaternary-border-color: var(--theme-brand-positive-border);
  --quaternary-text-color: var(--theme-brand-positive-text);
  --quaternary-title-text-color: var(--theme-brand-positive-title);
  --quaternary-hover-background-color: var(--theme-brand-positive-hover);

  --text-button-background-color: var(--theme-brand-surface-menu);
  --text-button-color: var(--theme-brand-text-menu);
  --text-button-hover-color: var(--theme-brand-text);
  --text-button-hover-background-color: var(--theme-brand-primary-hover);
  --text-button-primary-background-color: var(--theme-brand-primary);
  --text-button-primary-color: var(--theme-brand-text-inverse);
  --text-button-primary-hover-background-color: var(--theme-brand-primary-hover-strong);
  --text-button-primary-hover-color: var(--theme-brand-text-inverse);
  --text-button-secondary-background-color: var(--theme-brand-secondary-soft);
  --text-button-secondary-color: color-mix(in srgb, var(--theme-brand-danger) 72%, var(--theme-brand-text-inverse));
  --text-button-secondary-hover-background-color: var(--theme-brand-secondary-hover);
  --text-button-secondary-hover-color: color-mix(in srgb, var(--theme-brand-danger-strong) 74%, var(--theme-brand-text-inverse));
  --text-button-tertiary-background-color: var(--theme-brand-tertiary-surface);
  --text-button-tertiary-color: var(--theme-brand-tertiary-title);
  --text-button-tertiary-hover-background-color: var(--theme-brand-tertiary-hover);
  --text-button-tertiary-hover-color: var(--theme-brand-tertiary-hover-text);
  --text-button-tertiary-border-color: var(--theme-brand-tertiary-border);
  --text-button-active-background-color: var(--theme-brand-positive-hover);
  --text-button-active-color: var(--theme-brand-positive-text);
  --text-button-active-hover-background-color: var(--theme-brand-positive-soft);
  --text-button-active-hover-color: var(--theme-brand-positive-title);
  --text-button-active-border-color: var(--theme-brand-positive-border);
  --text-button-disabled-background-color: var(--theme-brand-text-disabled-surface);
  --text-button-disabled-color: var(--theme-brand-text-disabled);

  --toggle-switch-on-background-color: var(--theme-brand-positive-strong);
  --toggle-switch-off-background-color: var(--theme-brand-border-soft);
  --toggle-switch-toggle-shadow: var(--theme-brand-toggle-shadow);

  --stream-tech-chip-container-color: var(--theme-brand-chip-container-text);
  --stream-tech-chip-container-background-color: var(--theme-brand-chip-container-surface);
  --stream-tech-chip-container-border-color: transparent;
  --stream-tech-chip-video-codec-color: var(--theme-brand-chip-video-text);
  --stream-tech-chip-video-codec-background-color: var(--theme-brand-chip-video-surface);
  --stream-tech-chip-video-codec-border-color: transparent;
  --stream-tech-chip-resolution-color: var(--theme-brand-chip-resolution-text);
  --stream-tech-chip-resolution-background-color: var(--theme-brand-chip-resolution-surface);
  --stream-tech-chip-resolution-border-color: transparent;
  --stream-tech-chip-fps-color: var(--theme-brand-chip-fps-text);
  --stream-tech-chip-fps-background-color: var(--theme-brand-chip-fps-surface);
  --stream-tech-chip-fps-border-color: transparent;
  --stream-tech-chip-audio-codec-color: var(--theme-brand-chip-audio-text);
  --stream-tech-chip-audio-codec-background-color: var(--theme-brand-chip-audio-surface);
  --stream-tech-chip-audio-codec-border-color: transparent;
  --stream-tech-chip-audio-channels-color: var(--theme-brand-chip-audio-channels-text);
  --stream-tech-chip-audio-channels-background-color: var(--theme-brand-chip-audio-surface);
  --stream-tech-chip-audio-channels-border-color: transparent;

  --discord-color: #5865f2;
  --documentation-color: var(--theme-brand-success-alt);
  --github-color: var(--theme-brand-text-inverse);
  --credits-color: var(--theme-brand-warning-strong);

  --pulse-color-1: var(--theme-brand-text-muted);
  --pulse-color-2: var(--theme-brand-surface-toolbar-alt);
  --tag-color: var(--theme-brand-text-card);
  --tag-background-color: var(--theme-brand-tag-surface);
  --tag-active-color: var(--theme-brand-tag-active-text);
  --tag-active-background-color: var(--theme-brand-tag-active-surface);
  --tag-active-border-color: var(--theme-brand-tag-active-border);
  --tag-inactive-color: var(--theme-brand-text-soft);
  --tag-inactive-background-color: var(--theme-brand-surface-breadcrumb);
  --tag-inactive-border-color: var(--theme-brand-border-muted);
  --tag-alt-active-color: var(--theme-brand-tag-alt-text);
  --tag-alt-active-background-color: var(--theme-brand-tag-alt-surface);
  --tag-alt-active-border-color: var(--theme-brand-tag-alt-border);
  --tag-status-expired-color: var(--theme-brand-tag-expired-text);
  --tag-status-expired-background-color: var(--theme-brand-tag-expired-surface);
  --tag-status-expired-border-color: var(--theme-brand-tag-expired-border);
  --tag-status-banned-color: var(--theme-brand-tag-banned-text);
  --tag-status-banned-background-color: var(--theme-brand-tag-banned-surface);
  --tag-status-banned-border-color: var(--theme-brand-tag-banned-border);
  --tag-status-trial-color: var(--theme-brand-info-strong);
  --tag-status-trial-background-color: var(--theme-brand-info-surface);
  --tag-status-trial-border-color: var(--theme-brand-info-border);
  --tag-status-pending-color: var(--theme-brand-info-strong);
  --tag-status-pending-background-color: var(--theme-brand-info-surface);
  --tag-status-pending-border-color: var(--theme-brand-info-border);

  --attention-color: var(--theme-brand-danger);
  --warn-color: var(--theme-brand-warning);
  --warn-background-color: var(--theme-brand-warning-background);
  --active-color: var(--theme-brand-active);
  --ok-color: var(--theme-brand-positive);
  --success-color: var(--theme-brand-positive-text);
  --success-background-color: var(--theme-brand-positive-soft);
  --error-color: var(--theme-brand-danger);
  --error-background-color: color-mix(in srgb, var(--theme-brand-danger-strong) 18%, transparent);
  --output-xtream-color: var(--theme-brand-info);
  --output-m3u-color: var(--theme-brand-success-alt);
  --output-hdhomerun-color: var(--theme-brand-quaternary);
  --output-strm-color: var(--theme-brand-emphasis);
  --tag-live-background-color: var(--theme-brand-live-surface);
  --tag-live-border-color: var(--theme-brand-success-alt);
  --tag-video-background-color: var(--theme-brand-video-surface);
  --tag-video-border-color: var(--theme-brand-info);
  --tag-series-background-color: var(--theme-brand-series-surface);
  --tag-series-border-color: var(--theme-brand-quaternary);

  --toastr-success-color: var(--theme-brand-text-inverse);
  --toastr-success-background-color: color-mix(in srgb, var(--theme-brand-positive) 70%, transparent);
  --toastr-error-color: var(--theme-brand-text-inverse);
  --toastr-error-background-color: color-mix(in srgb, var(--theme-brand-danger-strong) 70%, transparent);
  --toastr-info-color: var(--theme-brand-text-inverse);
  --toastr-info-background-color: color-mix(in srgb, var(--theme-brand-primary-border) 70%, transparent);
  --toastr-warning-color: var(--theme-brand-text-inverse);
  --toastr-warning-background-color: color-mix(in srgb, var(--theme-brand-warning-strong) 70%, transparent);
  --toastr-shadow: var(--theme-brand-toast-shadow);

  --spinner-color: color-mix(in srgb, var(--theme-brand-text-inverse) 40%, transparent);
  --spinner-highlight-color: var(--theme-brand-primary-spinner);
  --popup-shadow: var(--theme-brand-popup-shadow);
  --card-shadow: var(--theme-brand-card-shadow);

  --menu-icon-color-update: var(--theme-brand-menu-icon-update);
  --menu-icon-color-user: var(--theme-brand-menu-icon-user);
  --menu-icon-color-api_server: var(--theme-brand-menu-icon-api-server);
  --menu-icon-color-main_config: var(--theme-brand-menu-icon-main-config);
  --menu-icon-color-status: var(--theme-brand-menu-icon-status);

  --code-identifier-color: var(--theme-brand-code-identifier);
  --code-var-access-color: var(--theme-brand-code-var-access);
  --code-field-color: var(--theme-brand-code-field);
  --code-property-color: var(--theme-brand-code-property);
  --code-literal-color: var(--theme-brand-code-literal);
  --code-num-literal-color: var(--theme-brand-code-num);
  --code-built-in-function-color: var(--theme-brand-code-builtin);
  --code-reserved-color: var(--theme-brand-code-reserved);
  --code-regex-color: var(--theme-brand-code-regex);
  --code-enum-color: var(--theme-brand-code-enum);
  --code-range-color: var(--theme-brand-code-range);
  --code-op-color: var(--theme-brand-code-op);
  --code-comparison-background-color: var(--theme-brand-surface-code-compare);
  --code-comparison-color: var(--theme-brand-code-compare-text);
  --code-bracket-1-color: var(--theme-brand-code-bracket-1);
  --code-bracket-2-color: var(--theme-brand-code-bracket-2);
  --code-bracket-3-color: var(--theme-brand-code-bracket-3);
  --code-editor-background-color: var(--theme-brand-surface-code);
  --code-editor-color: var(--theme-brand-text);
  --code-any-match-color: var(--theme-brand-code-any-match);
  --code-null-literal-color: var(--theme-brand-code-any-match);

  --epg-program-background-color: var(--theme-brand-epg-program-surface);
  --epg-program-color: var(--theme-brand-epg-program-text);
  --epg-program-active-background-color: var(--theme-brand-epg-program-active-surface);
  --epg-program-active-color: var(--theme-brand-epg-program-text);
  --epg-program-time-color: var(--theme-brand-epg-program-time);
  --epg-program-active-time-color: var(--theme-brand-epg-program-time-active);
  --epg-past-background: var(--theme-brand-epg-past-surface);
  --epg-now-line-color: var(--theme-brand-epg-now-line);

  --glass-border-color: var(--theme-brand-border-input);
  --glass-background-color: var(--theme-brand-surface-glass);
  --glass-shadow-color: var(--theme-brand-glass-shadow);
  --glass-background-gradient-color-1: var(--theme-brand-surface-glass-gradient-1);
  --glass-background-gradient-color-2: var(--theme-brand-surface-glass-gradient-2);
  --glass-input-border-color: var(--theme-brand-border-input);
  --glass-input-background-color: var(--theme-brand-surface-glass-input);

  --graph-paper-line-color-1: var(--theme-brand-graph-grid-1);
  --graph-paper-line-color-2: var(--theme-brand-graph-grid-2);

  --brick-input-xtream-border-color: color-mix(in srgb, var(--theme-brand-brick-input-xtream) 80%, transparent);
  --brick-input-xtream-background-color: color-mix(in srgb, var(--theme-brand-brick-input-xtream) 53%, transparent);
  --brick-input-xtream-shadow-color: color-mix(in srgb, var(--theme-brand-brick-input-xtream) 50%, transparent);
  --brick-input-m3u-border-color: color-mix(in srgb, var(--theme-brand-brick-input-m3u) 80%, transparent);
  --brick-input-m3u-background-color: color-mix(in srgb, var(--theme-brand-brick-input-m3u) 53%, transparent);
  --brick-input-m3u-shadow-color: color-mix(in srgb, var(--theme-brand-brick-input-m3u) 50%, transparent);
  --brick-input-library-border-color: color-mix(in srgb, var(--theme-brand-brick-input-library) 80%, transparent);
  --brick-input-library-background-color: color-mix(in srgb, var(--theme-brand-brick-input-library) 53%, transparent);
  --brick-input-library-shadow-color: color-mix(in srgb, var(--theme-brand-brick-input-library) 50%, transparent);
  --brick-input-staged-border-color: color-mix(in srgb, var(--theme-brand-brick-input-staged) 80%, transparent);
  --brick-input-staged-background-color: color-mix(in srgb, var(--theme-brand-brick-input-staged) 53%, transparent);
  --brick-input-staged-shadow-color: color-mix(in srgb, var(--theme-brand-brick-input-staged) 50%, transparent);
  --brick-input-stalker-border-color: color-mix(in srgb, var(--theme-brand-brick-input-stalker) 80%, transparent);
  --brick-input-stalker-background-color: color-mix(in srgb, var(--theme-brand-brick-input-stalker) 53%, transparent);
  --brick-input-stalker-shadow-color: color-mix(in srgb, var(--theme-brand-brick-input-stalker) 50%, transparent);
  --brick-input-jellyfin-border-color: color-mix(in srgb, var(--theme-brand-brick-input-jellyfin) 80%, transparent);
  --brick-input-jellyfin-background-color: color-mix(in srgb, var(--theme-brand-brick-input-jellyfin) 53%, transparent);
  --brick-input-jellyfin-shadow-color: color-mix(in srgb, var(--theme-brand-brick-input-jellyfin) 50%, transparent);
  --brick-input-emby-border-color: color-mix(in srgb, var(--theme-brand-brick-input-emby) 80%, transparent);
  --brick-input-emby-background-color: color-mix(in srgb, var(--theme-brand-brick-input-emby) 53%, transparent);
  --brick-input-emby-shadow-color: color-mix(in srgb, var(--theme-brand-brick-input-emby) 50%, transparent);
  --brick-input-plex-border-color: color-mix(in srgb, var(--theme-brand-brick-input-plex) 80%, transparent);
  --brick-input-plex-background-color: color-mix(in srgb, var(--theme-brand-brick-input-plex) 53%, transparent);
  --brick-input-plex-shadow-color: color-mix(in srgb, var(--theme-brand-brick-input-plex) 50%, transparent);
  --brick-target-border-color: color-mix(in srgb, var(--theme-brand-brick-target) 80%, transparent);
  --brick-target-background-color: color-mix(in srgb, var(--theme-brand-brick-target) 53%, transparent);
  --brick-target-shadow-color: color-mix(in srgb, var(--theme-brand-brick-target) 50%, transparent);
  --brick-output-border-color: color-mix(in srgb, var(--theme-brand-brick-output) 80%, transparent);
  --brick-output-background-color: color-mix(in srgb, var(--theme-brand-brick-output) 53%, transparent);
  --brick-output-shadow-color: color-mix(in srgb, var(--theme-brand-brick-output) 50%, transparent);
  --brick-output-xtream-border-color: color-mix(in srgb, var(--theme-brand-brick-output-xtream) 80%, transparent);
  --brick-output-xtream-background-color: color-mix(in srgb, var(--theme-brand-brick-output-xtream) 53%, transparent);
  --brick-output-xtream-shadow-color: color-mix(in srgb, var(--theme-brand-brick-output-xtream) 50%, transparent);
  --brick-output-m3u-border-color: color-mix(in srgb, var(--theme-brand-brick-output-m3u) 80%, transparent);
  --brick-output-m3u-background-color: color-mix(in srgb, var(--theme-brand-brick-output-m3u) 53%, transparent);
  --brick-output-m3u-shadow-color: color-mix(in srgb, var(--theme-brand-brick-output-m3u) 50%, transparent);
  --brick-output-hdhomerun-border-color: color-mix(in srgb, var(--theme-brand-brick-output-hdhomerun) 80%, transparent);
  --brick-output-hdhomerun-background-color: color-mix(in srgb, var(--theme-brand-brick-output-hdhomerun) 53%, transparent);
  --brick-output-hdhomerun-shadow-color: color-mix(in srgb, var(--theme-brand-brick-output-hdhomerun) 50%, transparent);
  --brick-output-strm-border-color: color-mix(in srgb, var(--theme-brand-brick-output-strm) 80%, transparent);
  --brick-output-strm-background-color: color-mix(in srgb, var(--theme-brand-brick-output-strm) 53%, transparent);
  --brick-output-strm-shadow-color: color-mix(in srgb, var(--theme-brand-brick-output-strm) 50%, transparent);
  --brick-port-background-color: var(--theme-brand-brick-port);
  --brick-port-border-color: var(--theme-brand-brick-port-border);
  --brick-port-valid-background-color: var(--theme-brand-positive);
  --brick-port-invalid-background-color: var(--theme-brand-danger-deep);
  --brick-port-hover-color: var(--theme-brand-brick-port-hover);

  --source-editor-delete-color: var(--theme-brand-danger-strong);
  --source-editor-line-color: color-mix(in srgb, var(--theme-brand-text) 48%, var(--theme-brand-primary-border) 52%);
  --source-editor-active-line-color: color-mix(in srgb, var(--theme-brand-text) 18%, var(--theme-brand-positive) 82%);
  --source-editor-pending-line-color: color-mix(in srgb, var(--theme-brand-text) 20%, var(--theme-brand-warning-strong) 80%);
  --source-editor-block-shadow: var(--theme-brand-source-block-shadow);

  --log-console-background-color: var(--theme-brand-log-console-background);
  --log-console-text-color: var(--theme-brand-log-console-text);
  --log-console-muted-color: var(--theme-brand-log-console-muted);
  --log-console-trace-color: var(--theme-brand-log-console-trace);
  --log-console-debug-color: var(--theme-brand-log-console-debug);
  --log-console-info-color: var(--theme-brand-log-console-info);
  --log-console-warn-color: var(--theme-brand-log-console-warn);
  --log-console-error-color: var(--theme-brand-log-console-error);
  --log-console-success-color: var(--theme-brand-log-console-success);
  --log-console-target-color: var(--theme-brand-log-console-target);
  --log-console-row-border-color: color-mix(in srgb, var(--theme-brand-log-console-text) 3%, transparent);
  --log-console-row-hover-background-color: color-mix(in srgb, var(--theme-brand-log-console-text) 4%, transparent);
  --log-console-trace-background-color: color-mix(in srgb, var(--theme-brand-log-console-trace) 20%, transparent);
  --log-console-debug-background-color: color-mix(in srgb, var(--theme-brand-log-console-debug) 20%, transparent);
  --log-console-info-background-color: color-mix(in srgb, var(--theme-brand-log-console-info) 20%, transparent);
  --log-console-warn-background-color: color-mix(in srgb, var(--theme-brand-log-console-warn) 20%, transparent);
  --log-console-error-background-color: color-mix(in srgb, var(--theme-brand-log-console-error) 25%, transparent);

  --selection-area-border-color: var(--theme-brand-border-selection);
  --selection-area-background-color: color-mix(in srgb, var(--theme-brand-border-selection) 12%, transparent);

  --custom-dialog-backdrop-color: var(--theme-brand-surface-modal-backdrop);
  --dialog-backdrop-color: var(--theme-brand-surface-dialog-backdrop);
  /* Shared overlay stacking order: dialogs/loading < popovers < menus < toasts. */
  --z-index-overlay: 1000;
  --z-index-popover: 1100;
  --z-index-menu: 1200;
  --z-index-toast: 1300;
  --input-autofill-background-color: transparent;
  --tab-header-shadow: var(--theme-brand-tab-header-shadow);
  --setup-sidebar-item-hover-background-color: var(--theme-brand-surface-setup-hover);
  --setup-sidebar-item-active-background-color: var(--theme-brand-surface-setup-active);
  --field-explanation-code-background-color: var(--theme-brand-surface-code-solid);
  --field-explanation-code-color: var(--theme-brand-text);
  --field-explanation-code-border-color: var(--theme-brand-border-soft);
  --field-explanation-code-shadow: var(--theme-brand-field-code-shadow);
  --mapper-script-background-color: var(--theme-brand-surface-code-solid);
  --login-logo-color: var(--theme-brand-login-logo);
  --series-info-title-color: var(--theme-brand-series-title);
  --series-backdrop-overlay-gradient: var(--theme-brand-series-backdrop-overlay);
  --titled-card-title-background: linear-gradient(to bottom, var(--theme-brand-surface-card-gradient) 50%, var(--card-background-color) 50%);
}