/* Semantic screen colors: L0 canvas → L1 surface → L2 muted groups →
   L3 interaction → L4 brand/actions. Raw palette archive: docs/design/ui-palette-library.md.
   Existing linear/art/ow consumers are aliases, never independent theme palettes.
   Layout, typography, spacing and printed paper colors are owned elsewhere. */

/* 海军蓝：只使用海军蓝、白色及同色系明度变化。 */
html:root[data-ui-theme='navy-champagne'] {
  --ui-canvas: #e9eef8;
  --ui-surface-muted: #f3f6fc;
  --ui-surface-hover: #e9eef8;
  --ui-sidebar: #112250;
  --ui-sidebar-active: #283b65;
  --ui-sidebar-hover: #20325c;
  --ui-sidebar-muted: #d6dff0;
  --ui-sidebar-indicator: #ffffff;
  --ui-primary: #112250;
  --ui-primary-hover: #203562;
  --ui-primary-active: #0b183b;
  --ui-selected-background: #e8edf8;
  --ui-selected-indicator: #112250;
  --ui-tab-active: #112250;
  --ui-focus-ring: #112250;
  --ui-accent: #112250;
  --ui-accent-soft: #e8edf8;
  --ui-accent-text: #112250;
  --ui-on-accent: #ffffff;
  --ui-brand-mark: #ffffff;
  --ui-brand-mark-text: #112250;
  --ui-text-primary: #112250;
  --ui-text-secondary: #465773;
  --ui-text-tertiary: #536580;
  --ui-border-subtle: #dce3ef;
  --ui-border-strong: #7989a5;
  --ui-secondary-border: #b4c2d9;
  --ui-toolbar-bg: var(--ui-surface);
  --ui-search-bg: var(--ui-surface);
  --ui-detail-header: var(--ui-surface);
  --ui-table-header: var(--ui-surface);
  --ui-footer-bg: #f3f6fc;
  --ui-directory-surface: var(--ui-surface);
  --ui-input-background: #ffffff;
  --ui-section-text: var(--ui-text-primary);
  --ui-meta-text: var(--ui-text-secondary);
  --ui-assist-bg: var(--ui-accent-soft);
  --ui-assist-text: var(--ui-accent-text);
}

/* 拥抱 */
html:root[data-ui-theme='embrace'] {
  --ui-canvas: #d5e6f2;
  --ui-surface-muted: #f2f5f7;
  --ui-surface-hover: #e1edf5;
  --ui-sidebar: #00427c;
  --ui-sidebar-active: #15578b;
  --ui-sidebar-hover: #0b4f86;
  --ui-sidebar-muted: #d1e5f3;
  --ui-sidebar-indicator: #80b7de;
  --ui-primary: #006da1;
  --ui-primary-hover: #005b88;
  --ui-primary-active: #004b72;
  --ui-selected-background: #dcebf6;
  --ui-selected-indicator: #006da1;
  --ui-tab-active: #00618e;
  --ui-focus-ring: #00618e;
  --ui-accent: #f08160;
  --ui-accent-soft: #fbefe5;
  --ui-accent-text: #89402c;
  --ui-text-primary: #233e50;
  --ui-text-secondary: #4c6070;
  --ui-text-tertiary: #50616e;
  --ui-border-subtle: #dfe7ec;
  --ui-border-strong: #788d9b;
  /* Deep sea-blue structure, lake-blue canvas, one shared white working surface. */
  --ui-toolbar-bg: var(--ui-surface);
  --ui-search-bg: var(--ui-directory-surface);
  --ui-detail-header: var(--ui-surface);
  --ui-table-header: var(--ui-surface);
  --ui-footer-bg: #f3f5f6;
  --ui-directory-surface: var(--ui-surface);
  --ui-input-background: #ffffff;
  --ui-secondary-border: #adc8da;
  --ui-section-text: var(--ui-text-primary);
  --ui-meta-text: var(--ui-text-secondary);
  --ui-assist-bg: #edd1b9;
  --ui-assist-text: #604734;
}

/* 蓝调思念（默认） */
html:root,
html:root[data-ui-theme='blue-hour'] {
  --ui-canvas: #e8e2ed;
  --ui-surface-muted: #f4f4f7;
  --ui-surface-hover: #e6ecf6;
  --ui-sidebar: #4856a2;
  --ui-sidebar-text: #ffffff;
  --ui-sidebar-active: #39488e;
  --ui-sidebar-hover: #3e4d95;
  --ui-sidebar-muted: #ebeffa;
  --ui-sidebar-indicator: #bfdffb;
  --ui-nav-selected-text: #ffffff;
  --ui-nav-focus: #bfdffb;
  --ui-brand-mark: #bfdffb;
  --ui-brand-mark-text: #303852;
  --ui-primary: #4856a2;
  --ui-primary-hover: #3d498d;
  --ui-primary-active: #323d78;
  --ui-selected-background: #e9eaf8;
  --ui-selected-indicator: #4856a2;
  --ui-tab-active: #4856a2;
  --ui-focus-ring: #4856a2;
  --ui-accent: #bfdffb;
  --ui-accent-soft: #eef6fd;
  --ui-accent-text: #355d80;
  --ui-text-primary: #303852;
  --ui-text-secondary: #555e75;
  --ui-text-tertiary: #5b6377;
  --ui-border-subtle: #e3e4ec;
  --ui-border-strong: #878b9f;
  /* Blue-violet structure, mist-violet canvas, one shared white working surface. */
  --ui-toolbar-bg: var(--ui-surface);
  --ui-search-bg: var(--ui-directory-surface);
  --ui-detail-header: var(--ui-surface);
  --ui-table-header: var(--ui-surface);
  --ui-footer-bg: #f5f3f4;
  --ui-directory-surface: var(--ui-surface);
  --ui-input-background: #ffffff;
  --ui-secondary-border: #b8c9e0;
  --ui-assist-bg: #f6f0ed;
  --ui-assist-text: #555e75;
  --ui-section-text: var(--ui-text-primary);
  --ui-meta-text: var(--ui-text-secondary);
}

/* Shared neutral surfaces and business semantics do not follow decoration. */
html:root {
  color-scheme: light;
  --ui-surface: #ffffff;
  --ui-on-primary: #ffffff;
  --ui-on-accent: #203039;
  --ui-sidebar-text: #ffffff;
  --ui-border: var(--ui-border-subtle);
  --ui-success: #216647;
  --ui-success-hover: #1a563a;
  --ui-success-active: #12432c;
  --ui-success-soft: #eaf4ee;
  --ui-warning: #875314;
  --ui-warning-hover: #73450e;
  --ui-warning-active: #5e370a;
  --ui-warning-soft: #fff3db;
  --ui-danger: #b42318;
  --ui-danger-hover: #9c1d14;
  --ui-danger-active: #81180f;
  --ui-danger-soft: #fff0ed;
  --ui-disabled: #e8ebeb;
  --ui-disabled-bg: var(--ui-disabled);
  --ui-disabled-text: #5e686c;
  --ui-disabled-border: #c6cdce;
  --ui-on-status: #ffffff;

  /* Legacy surface consumers. The right tools rail remains neutral. */
  --linear-shell: var(--ui-canvas);
  --linear-sidebar: var(--ui-surface-muted);
  --linear-canvas: var(--ui-canvas);
  --linear-panel: var(--ui-surface);
  --linear-panel-subtle: var(--ui-surface-muted);
  --linear-panel-tinted: var(--ui-surface-muted);
  --linear-panel-selected: var(--ui-selected-background);
  --linear-input: var(--ui-input-background);
  --linear-border: var(--ui-border);
  --linear-border-subtle: var(--ui-border-subtle);
  --linear-border-strong: var(--ui-border-strong);
  --linear-border-accent: var(--ui-selected-indicator);
  --linear-text: var(--ui-text-primary);
  --linear-text-secondary: var(--ui-text-secondary);
  --linear-text-tertiary: var(--ui-text-tertiary);
  --linear-text-disabled: var(--ui-disabled-text);
  --linear-accent: var(--ui-tab-active);
  --linear-accent-hover: var(--ui-primary-hover);
  --linear-accent-soft: var(--ui-selected-background);
  --linear-accent-softer: var(--ui-surface-hover);
  --linear-accent-border: var(--ui-focus-ring);
  --linear-accent-text: var(--ui-tab-active);
  --linear-on-accent: var(--ui-on-primary);
  --linear-neutral: var(--ui-text-secondary);
  --linear-neutral-soft: var(--ui-surface-muted);
  --linear-glass: var(--ui-surface);
  --linear-success: var(--ui-success);
  --linear-success-text: var(--ui-success);
  --linear-success-soft: var(--ui-success-soft);
  --linear-warning: var(--ui-warning);
  --linear-warning-text: var(--ui-warning);
  --linear-warning-soft: var(--ui-warning-soft);
  --linear-danger: var(--ui-danger);
  --linear-danger-text: var(--ui-danger);
  --linear-danger-soft: var(--ui-danger-soft);

  /* Component roles: these aliases carry the same hierarchy across pages. */
  --ui-nav: var(--ui-sidebar);
  --ui-nav-text: var(--ui-sidebar-text);
  --ui-nav-muted: var(--ui-sidebar-muted);
  --ui-nav-selected: var(--ui-sidebar-active);
  --ui-nav-selected-text: var(--ui-sidebar-text);
  --ui-nav-hover: var(--ui-sidebar-hover);
  --ui-nav-indicator: var(--ui-sidebar-indicator);
  --ui-nav-focus: var(--ui-sidebar-indicator);
  --ui-brand-mark: var(--ui-accent);
  --ui-brand-mark-text: var(--ui-on-accent);
  --ui-selection-text: var(--ui-tab-active);
  --ui-selection-indicator: var(--ui-selected-indicator);
  --ui-selection-border: var(--ui-border-subtle);
  --ui-tab-text: var(--ui-tab-active);
  --ui-tab-indicator: var(--ui-selected-indicator);
  --ui-assist-bg: var(--ui-accent-soft);
  --ui-assist-text: var(--ui-accent-text);
  --ui-focus: var(--ui-focus-ring);
  --ui-edge: transparent;
  --ui-panel-shadow: none;
  --ui-selection-shadow: none;
  --ui-shadow-rgb: 24 40 49;
  /* Matte controls and three elevation levels. Only the dark navigation emits light. */
  --ui-control-face: linear-gradient(180deg, transparent, rgb(var(--ui-shadow-rgb) / 1.5%));
  --ui-control-selected-face: linear-gradient(180deg, transparent, rgb(var(--ui-shadow-rgb) / 1%));
  --ui-control-shadow: inset 0 1px 2px rgb(var(--ui-shadow-rgb) / 2.5%), 0 1px 1px rgb(var(--ui-shadow-rgb) / 1.5%);
  --ui-control-selected-shadow: inset 0 0 0 1px rgb(var(--ui-shadow-rgb) / 2.5%), 0 1px 2px rgb(var(--ui-shadow-rgb) / 4%);
  --ui-surface-shadow: 0 1px 2px rgb(var(--ui-shadow-rgb) / 4%), 0 5px 16px -7px rgb(var(--ui-shadow-rgb) / 14%);
  --ui-primary-face: none;
  --ui-primary-shadow: inset 0 -1px 1px rgb(var(--ui-shadow-rgb) / 12%), 0 1px 2px rgb(var(--ui-shadow-rgb) / 7%);
  --ui-nav-material-base: color-mix(in srgb, var(--ui-sidebar) 94%, var(--ui-sidebar-text));
  --ui-nav-material: linear-gradient(180deg, transparent, rgb(var(--ui-shadow-rgb) / 3.5%));
  --ui-nav-material-border: color-mix(in srgb, var(--ui-nav-muted) 14%, transparent);
  --ui-nav-material-shadow: inset 0 1px 2px rgb(var(--ui-shadow-rgb) / 9%), 0 1px 2px rgb(var(--ui-shadow-rgb) / 8%);
  --ui-nav-light-wash: color-mix(in srgb, var(--ui-sidebar-indicator) 14%, transparent);
  --ui-nav-light-fade: color-mix(in srgb, var(--ui-sidebar-indicator) 2.5%, transparent);
  --linear-shadow-shell: none;
  --linear-shadow-popover: 0 8px 24px rgb(var(--ui-shadow-rgb) / 12%);
  --linear-glass-blur: none;
  --art-sheet-mask: rgb(23 32 38 / 35%);
}
html:root {
  --el-color-primary: var(--linear-accent);
  --el-color-primary-dark-2: var(--linear-accent-hover);
  --el-color-primary-light-3: color-mix(in srgb, var(--linear-accent) 70%, var(--linear-panel));
  --el-color-primary-light-5: color-mix(in srgb, var(--linear-accent) 50%, var(--linear-panel));
  --el-color-primary-light-7: color-mix(in srgb, var(--linear-accent) 30%, var(--linear-panel));
  --el-color-primary-light-8: var(--linear-accent-border);
  --el-color-primary-light-9: var(--linear-accent-soft);
  --el-text-color-primary: var(--linear-text);
  --el-text-color-regular: var(--linear-text);
  --el-text-color-secondary: var(--linear-text-secondary);
  --el-text-color-placeholder: var(--linear-text-tertiary);
  --el-text-color-disabled: var(--linear-text-disabled);
  --el-bg-color: var(--linear-panel);
  --el-bg-color-page: var(--linear-canvas);
  --el-bg-color-overlay: var(--linear-panel);
  --el-fill-color: var(--linear-panel-subtle);
  --el-fill-color-blank: var(--linear-panel);
  --el-fill-color-light: var(--linear-panel-subtle);
  --el-fill-color-lighter: var(--linear-panel-tinted);
  --el-fill-color-extra-light: var(--linear-panel-subtle);
  --el-fill-color-dark: var(--linear-input);
  --el-fill-color-darker: var(--linear-panel-selected);
  --el-border-color: var(--linear-border-strong);
  --el-border-color-light: var(--linear-border);
  --el-border-color-lighter: var(--linear-border-subtle);
  --el-border-color-extra-light: var(--linear-border-subtle);
  --el-disabled-bg-color: var(--linear-panel-subtle);
  --el-disabled-text-color: var(--linear-text-disabled);
  --el-disabled-border-color: var(--linear-border);
  --el-mask-color: var(--art-sheet-mask);
  --el-mask-color-extra-light: var(--linear-glass);
  --el-overlay-color-light: var(--art-sheet-mask);
  --el-box-shadow-light: var(--linear-shadow-popover);
  --el-color-success: var(--linear-success-text);
  --el-color-success-light-3: var(--ui-success-hover);
  --el-color-success-dark-2: var(--ui-success-active);
  --el-color-success-light-9: var(--linear-success-soft);
  --el-color-success-light-8: var(--linear-success-soft);
  --el-color-warning: var(--linear-warning-text);
  --el-color-warning-light-3: var(--ui-warning-hover);
  --el-color-warning-dark-2: var(--ui-warning-active);
  --el-color-warning-light-9: var(--linear-warning-soft);
  --el-color-warning-light-8: var(--linear-warning-soft);
  --el-color-danger: var(--linear-danger-text);
  --el-color-danger-light-3: var(--ui-danger-hover);
  --el-color-danger-dark-2: var(--ui-danger-active);
  --el-color-danger-light-9: var(--linear-danger-soft);
  --el-color-danger-light-8: var(--linear-danger-soft);
  --el-color-error: var(--linear-danger-text);
  --el-color-error-light-9: var(--linear-danger-soft);
  --el-color-info: var(--linear-text-secondary);
  --el-color-info-light-9: var(--linear-neutral-soft);
}