/* 外观材质与品牌层分开：不改布局、字号、业务语义色。Alice 原样保留，入口由 look-boot 控制。 */
body:not(.ex-ai-mode) .skin-pick { grid-template-columns: repeat(auto-fit, minmax(80px, 1fr)); }

/* ocean 沿用原 tokens/alice 材质；主题只调整壁纸色，不再覆盖玻璃透明度。 */
:root[data-theme="dark"][data-skin] body:not(.ex-ai-mode) .tbl th {
  background: color-mix(in srgb, var(--solid-surface) 80%, #64748b);
  backdrop-filter: none;
}

/* AI 简洁：纯色工作区、实色卡片、细边框，不保留背景柔光或浮起阴影。 */
body.ex-ai-mode[data-ai-skin="classic"][data-ai-theme] {
  --x-bg: #f5f6f8; --brand-bg: var(--x-bg);
  --ai-shell-blur: none; --cx-blur: none;
  --ai-surface-shadow: none; --cx-glass-shadow: none; --ai-control-shadow: none;
  --ai-violet-wash: transparent; --ai-cyan-wash: transparent; --ai-agent-wash: transparent;
  --ai-stepper: transparent; --ai-highlight: transparent; --ai-ring: transparent;
  background: var(--x-bg);
}
body.ex-ai-mode[data-ai-skin="classic"][data-ai-theme="dark"] { --x-bg: #0d172b; }
body.ex-ai-mode[data-ai-skin="classic"] :is(.sidebar, .topbar, .cd-card, .cd-card:hover, .cd-kpi, .cx-panel, .cx-revenue, .co-metric, .co-stepper, .fa-banner) {
  box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none;
}
body.ex-ai-mode[data-ai-skin="classic"] .fa-banner { background: var(--x-panel); }

/* 语义绿原值不变，只减暗标签底；返回入口用已有正文次色，避免淡到不可读。 */
body.ex-ai-mode[data-ai-theme="dark"] [data-ai-source="actual"] { --source-bg: #06140c; }
body.ex-ai-mode .sidebar .ai-return-classic { color: var(--x-sub); opacity: 1; }
body.ex-ai-mode :is(.cx-btn.primary, .ex-mode-switch button[data-mode="ai"].on, .co-stage[data-state="done"] .co-node) { color: var(--brand-on); }

/* 经典预览沿用 app.css。AI 玻璃预览独立于当前风格的纯色工作区。 */
body.ex-ai-mode .ai-look-menu .pv-glass {
  background: radial-gradient(circle at 10% 10%, rgba(var(--brand-rgb),.3), transparent 70%),
    radial-gradient(circle at 90% 90%, rgba(var(--brand-peer-rgb),.24), transparent 70%), #edf3fd;
}
body.ex-ai-mode .ai-look-menu .pv-glass::before,
body.ex-ai-mode .ai-look-menu .pv-glass::after {
  background: rgba(255,255,255,.22); border-color: rgba(255,255,255,.55);
}
body.ex-ai-mode[data-ai-theme="dark"] .ai-look-menu .pv-glass {
  background: radial-gradient(circle at 10% 10%, rgba(var(--brand-rgb),.5), transparent 70%),
    radial-gradient(circle at 90% 90%, rgba(var(--brand-peer-rgb),.3), transparent 70%), #0d172b;
}
body.ex-ai-mode[data-ai-theme="dark"] .ai-look-menu .pv-glass::before,
body.ex-ai-mode[data-ai-theme="dark"] .ai-look-menu .pv-glass::after {
  background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.18);
}

/* 工作台材质：色相来自生成的品牌变量，明暗决定结构表面。智能舱独立。 */
:root:is([data-skin="classic"],[data-skin="glass"])[data-theme][data-palette] {
  --sb-active: var(--brand-ink);
  --look-panel: #fff;
  --look-side: var(--brand-sidebar);
  --look-selected: var(--brand-ink);
}
:root:is([data-skin="classic"],[data-skin="glass"])[data-theme="dark"][data-palette] {
  --look-panel: var(--surface-soft);
  --look-side: color-mix(in srgb,var(--brand-bg) 94%,black);
  --panel: var(--look-panel); --solid-surface: var(--look-panel);
  --panel-2: color-mix(in srgb,var(--look-panel) 94%,white);
  --panel-3: color-mix(in srgb,var(--look-panel) 90%,white); --hover: var(--panel-3);
  --px-bg: var(--brand-bg); --px-panel: var(--look-panel); --px-panel-2: var(--panel-2);
  --top-bg: var(--look-panel); --admin-surface: var(--look-panel);
}
:root[data-skin="glass"][data-theme="light"][data-palette] {
  --look-side: rgba(255,255,255,.64);
  --sb-tx: var(--ink-secondary); --sb-tx-hi: var(--ink-main); --sb-group: var(--ink-secondary);
}
:root[data-skin="classic"][data-theme="light"][data-palette] {
  --look-selected: color-mix(in srgb,var(--brand-ink) 45%,white);
}
:root:is([data-skin="classic"],[data-skin="glass"])[data-theme][data-palette] body:not(.ex-ai-mode) {
  background: var(--brand-bg);
}
:root:is([data-skin="classic"],[data-skin="glass"])[data-theme][data-palette] body:not(.ex-ai-mode) .sidebar {
  background: var(--look-side); color: var(--sb-tx); border-right: 1px solid var(--line);
  backdrop-filter: var(--blur); -webkit-backdrop-filter: var(--blur);
}
:root:is([data-skin="classic"],[data-skin="glass"])[data-theme][data-palette] body:not(.ex-ai-mode) :is(.topbar,.card,.kpi,.kpi.hero,.admin-view,.menu,.modal,.drawer) {
  background: var(--look-panel); border-color: var(--line);
}
:root:is([data-skin="classic"],[data-skin="glass"])[data-theme][data-palette] body:not(.ex-ai-mode) .sidebar :is(.nav-item.active,.nav-sec.has-active>.nav-item) {
  background: color-mix(in srgb,var(--look-selected) 16%,transparent); color: var(--look-selected); box-shadow: none;
}
:root:is([data-skin="classic"],[data-skin="glass"])[data-theme][data-palette] body:not(.ex-ai-mode) .sidebar .nav-item.active :is(svg.i,.nav-line-icon) { color: var(--look-selected); }
:root:is([data-skin="classic"],[data-skin="glass"])[data-theme][data-palette] body:not(.ex-ai-mode) .sidebar :is(.nav-item.active,.nav-sec.has-active>.nav-item)::before {
  content: ""; position: absolute; left: -3px; top: 8px; bottom: 8px; width: 3px; border-radius: 3px; background: var(--look-selected);
}
:root[data-skin="glass"][data-theme][data-palette] body:not(.ex-ai-mode) .backdrop {
  background: radial-gradient(ellipse 55% 48% at 0% 0%,var(--surface-mist),transparent 75%),radial-gradient(ellipse 38% 40% at 100% 100%,var(--surface-mist-peer),transparent 75%),var(--brand-bg);
}
:root[data-skin="glass"][data-theme][data-palette] body:not(.ex-ai-mode) .backdrop::before,
:root[data-skin="glass"][data-theme][data-palette] body:not(.ex-ai-mode) .backdrop::after,
:root[data-skin="glass"][data-theme][data-palette] body:not(.ex-ai-mode) .backdrop :is(i,b) { display: none; }
:root:is([data-skin="classic"],[data-skin="glass"])[data-theme][data-palette] body:not(.ex-ai-mode) :is(.seg button.on,#home-time .seg button.on,.module-window .seg button.on,.btn.primary,.ex-mode-switch button.on,.avatar) {
  background: var(--brand-fill); color: var(--brand-on); border-color: transparent; box-shadow: none;
}
:root[data-skin="glass"][data-theme="light"][data-palette] body:not(.ex-ai-mode) .sidebar .brand-color { display: block; }
:root[data-skin="glass"][data-theme="light"][data-palette] body:not(.ex-ai-mode) .sidebar .brand-white { display: none; }
.cabin-appearance button:disabled { opacity: .42; cursor: not-allowed; }
:root:is([data-skin="classic"],[data-skin="glass"])[data-theme][data-palette] {
  --sticky-surface: var(--look-panel); --sticky-highlight: none;
}
:root[data-skin="glass"][data-theme][data-palette] { --look-panel: color-mix(in srgb,var(--surface-soft) 94%,transparent); }
:root[data-skin="glass"][data-theme="light"][data-palette] { --look-panel: rgba(255,255,255,.88); }

/* 暗色玻璃独立材质：局部低饱和柔光透过表面，经典暗色保持实色。 */
:root[data-skin="glass"][data-theme="dark"][data-palette] {
  --look-panel: color-mix(in srgb, color-mix(in srgb, var(--surface-soft) 72%, black) 68%, transparent);
  --look-side: color-mix(in srgb, var(--brand-bg) 72%, transparent);
  --blur: blur(24px);
  --sticky-surface: color-mix(in srgb, var(--surface-soft) 94%, transparent);
}
:root[data-skin="glass"][data-theme="dark"][data-palette] body:not(.ex-ai-mode) .backdrop {
  opacity: 1;
  background:
    radial-gradient(ellipse 60% 80% at 0% 5%, color-mix(in srgb, color-mix(in srgb, var(--surface-glow) 55%, #71808b) 44%, transparent), transparent 85%),
    radial-gradient(ellipse 58% 75% at 100% 95%, color-mix(in srgb, color-mix(in srgb, var(--surface-peer) 60%, #71808b) 40%, transparent), transparent 85%),
    radial-gradient(ellipse 28% 35% at 70% 0%, color-mix(in srgb, var(--surface-glow) 10%, transparent), transparent 90%),
    var(--brand-bg);
}
:root[data-skin="glass"][data-theme="dark"][data-palette] body:not(.ex-ai-mode) :is(.topbar,.card,.kpi,.kpi.hero,.admin-view,.menu,.modal,.drawer) {
  backdrop-filter: var(--blur); -webkit-backdrop-filter: var(--blur);
  box-shadow: inset 0 1px 0 rgba(226,242,250,.13), 0 8px 28px rgba(0,0,0,.12);
}
:root[data-skin="glass"][data-theme="dark"][data-palette] body:not(.ex-ai-mode) {
  --blur: blur(24px);
  --sticky-blur: blur(24px);
  --sticky-surface: var(--look-panel);
}
:root[data-skin="glass"][data-theme="dark"][data-palette] body:not(.ex-ai-mode) .sidebar {
  backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px);
}
