/* Alice 可选经典风格。取值来源：/opt/apps/alice/frontend/theme.css 与 app.css。
 * html 保留经典外观偏好；组件仅作用于非 AI body，AI 模式使用独立主题。 */
/* ---------------- 壁纸（只在毛玻璃下生效） ---------------- */
:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .backdrop {
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.4'/%3E%3C/svg%3E"),
    radial-gradient(70vw 70vw at -4% -16%, var(--mesh1), transparent 60%),
    radial-gradient(64vw 64vw at 105% -10%, var(--mesh2), transparent 62%),
    radial-gradient(76vw 76vw at 94% 108%, var(--mesh3), transparent 64%),
    radial-gradient(58vw 58vw at 20% 112%, var(--mesh4), transparent 62%),
    radial-gradient(120vw 86vh at 46% 44%, var(--haze), transparent 72%),
    radial-gradient(30vw 30vw at 16% 68%, var(--spot1), transparent 60%),
    radial-gradient(26vw 26vw at 74% 26%, var(--spot2), transparent 58%),
    var(--mesh-base);
  background-size: 180px 180px, auto, auto, auto, auto, auto, auto, auto, auto;
  background-blend-mode: soft-light, normal, normal, normal, normal, normal, normal, normal, normal;
}
:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .backdrop::before { width: 55vw; height: 55vw; left: -12vw; top: -18vw; opacity: var(--aur-o1);
  background: radial-gradient(circle, var(--aur1), transparent 65%); animation: drift1 28s ease-in-out infinite alternate; }
:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .backdrop::after { width: 48vw; height: 48vw; right: -14vw; top: 10vh; bottom: auto; opacity: var(--aur-o2);
  background: radial-gradient(circle, var(--aur2), transparent 65%); animation: drift-deep 34s ease-in-out infinite alternate; }
body:not(.ex-ai-mode) .backdrop b { display: none; }
:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .backdrop b { display: block; position: absolute; width: 40vw; height: 40vw; left: 30vw; bottom: -22vw;
  border-radius: 50%; filter: blur(90px); opacity: var(--aur-o3);
  background: radial-gradient(circle, var(--aur3), transparent 65%); animation: drift1 40s ease-in-out infinite alternate-reverse; }
@keyframes drift-deep { to { transform: translate(-6vw, 10vh) scale(.92); } }

/* ---------------- 材质 ---------------- */
/* 卡片是「块面」不是「一块窗」：顶亮底暗的薄高光叠在 glass-2 上，模糊比侧栏轻（Alice .card） */
:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .card,
:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .kpi {
  background: linear-gradient(160deg, rgba(var(--fg-rgb), .10), rgba(var(--fg-rgb), .02)), var(--glass-2);
  box-shadow: inset 0 1px 0 var(--glass-hi);
  backdrop-filter: blur(14px) saturate(1.7); -webkit-backdrop-filter: blur(14px) saturate(1.7);
}
:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .card .card { background: rgba(var(--fg-rgb), .03); }
:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .kpi.hero {
  background: linear-gradient(135deg, rgba(var(--pri-rgb), .16), rgba(var(--acc-rgb), .10)), var(--glass-2);
}
/* 亮色玻璃使用白色高光；深色前景渐变会在白底上形成灰膜。 */
:root:is([data-skin="glass"], [data-skin="alice"])[data-theme="light"] body:not(.ex-ai-mode) :is(.card, .kpi) {
  background: linear-gradient(160deg, rgba(255,255,255,.48), rgba(255,255,255,.16)), var(--glass-2);
}
:root:is([data-skin="glass"], [data-skin="alice"])[data-theme="light"] body:not(.ex-ai-mode) .kpi.hero {
  background: linear-gradient(135deg, rgba(var(--pri-rgb), .07), rgba(var(--acc-rgb), .04)),
    linear-gradient(160deg, rgba(255,255,255,.48), rgba(255,255,255,.16)), var(--glass-2);
}
/* 侧栏：图标默认弱化，当前页图标点亮成青色、底色是淡青（Alice .nav-item） */
:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .nav-item svg.i { color: var(--tx-3); opacity: 1; }
:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .nav-item:hover svg.i { color: var(--tx-2); }
:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .nav-item.active { background: rgba(var(--pri-rgb), .10); }
:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .nav-item.active svg.i { color: var(--pri); }
:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .brand-mark { box-shadow: 0 0 24px rgba(129,140,248,.45); }

/* Alice 的结构面不受 PowerX 实色 chrome 覆盖；保留业务组件结构与布局。 */
:root:is([data-skin="glass"], [data-skin="alice"]) {
  --alice-structure: var(--panel); --alice-line: var(--line); --alice-line-2: var(--line-2);
  --alice-text: var(--tx); --alice-muted: var(--tx-2); --alice-dim: var(--tx-3);
  --alice-primary: var(--pri); --alice-primary-text: var(--pri-tx); --alice-primary-soft: var(--pri-soft);
  --px-bg: var(--bg); --px-line: var(--line); --px-line-2: var(--line-2);
  --px-text: var(--tx); --px-muted: var(--tx-2); --px-brand: var(--pri); --px-brand-rgb: var(--pri-rgb); --px-brand-soft: var(--pri-soft);
  --alice-overlay: rgba(13,19,38,.94); --px-panel: rgba(13,19,38,.94); --px-panel-2: rgba(255,255,255,.04);
}
:root:is([data-skin="glass"], [data-skin="alice"])[data-theme="light"] {
  --alice-overlay: rgba(255,255,255,.96); --px-panel: rgba(255,255,255,.96); --px-panel-2: rgba(15,23,42,.035);
}
:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .backdrop { display: block; opacity: 1; }
:root:is([data-skin="glass"], [data-skin="alice"]) body.admin-mode:not(.ex-ai-mode) { background: var(--bg); }
:root:is([data-skin="glass"], [data-skin="alice"]) body.admin-mode:not(.ex-ai-mode) .backdrop { display: block; }
:root:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .sidebar {
  top: var(--seam); left: var(--seam); bottom: var(--seam); width: calc(var(--sb-w) - var(--seam));
  border: 1px solid var(--alice-line); border-radius: 14px 8px 14px 14px;
  background: var(--alice-structure); backdrop-filter: blur(22px) saturate(1.7); -webkit-backdrop-filter: blur(22px) saturate(1.7);
  box-shadow: inset 0 1px 0 var(--glass-hi), 0 18px 44px -28px rgba(0,0,0,.7);
  --sb-tx: var(--alice-muted); --sb-tx-hi: var(--alice-text); --sb-group: var(--alice-dim);
  --sb-line: var(--alice-line); --sb-hover: rgba(var(--fg-rgb), .06); --sb-active: var(--alice-primary);
}
@media (max-width: 900px) {
  :root:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .sidebar { bottom: calc(var(--tabbar-h) + var(--seam)); }
}
:root:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .topbar {
  top: var(--seam); margin: var(--seam) var(--seam) 0; border: 1px solid var(--alice-line); border-radius: 8px 14px 14px 8px;
  background: var(--alice-structure); backdrop-filter: blur(22px) saturate(1.7); -webkit-backdrop-filter: blur(22px) saturate(1.7);
  box-shadow: inset 0 1px 0 var(--glass-hi);
}
:root:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) :is(.topbar, .sidebar, .menu, .modal, .toast, .du-progress) {
  --tx: var(--alice-text); --tx-2: var(--alice-muted); --tx-3: var(--alice-dim);
  --line: var(--alice-line); --line-2: var(--alice-line-2); --panel: var(--alice-overlay);
  --pri: var(--alice-primary); --pri-tx: var(--alice-primary-text); --pri-soft: var(--alice-primary-soft);
}
:root:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .view { padding: var(--space-12) var(--seam) var(--seam); }
:root:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .sidebar .nav-item { color: var(--alice-muted); }
:root:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .sidebar .nav-item:hover { color: var(--alice-text); background: rgba(var(--fg-rgb), .06); }
:root:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .sidebar .nav-sec.has-active > .nav-item { color: var(--alice-text); background: transparent; }
:root:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .sidebar .nav-item.active { color: var(--alice-text); background: var(--alice-primary-soft); }
:root:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .sidebar .nav-item.active::before { content: ""; position: absolute; left: -4px; top: 9px; bottom: 9px; width: 3px; background: var(--alice-primary); border-radius: 3px; }
:root:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .sidebar .nav-sub .nav-item.active::before { content: none; }
:root:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .sidebar .nav-sub { border-left-color: var(--alice-line); }
body:not(.ex-ai-mode) .nav-line-icon { display: none; }
:root:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .sidebar .nav-item > .nav-ico { display: none !important; }
:root:is([data-skin="glass"], [data-skin="alice"])[data-nav="mini"] body:not(.ex-ai-mode) .sidebar .nav-item > .nav-ico { display: none !important; }
:root:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .sidebar .nav-line-icon { display: block; width: 17px; height: 17px; color: var(--alice-dim); }
:root:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .sidebar .nav-item.active .nav-line-icon,
:root:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .sidebar .nav-sec.has-active > .nav-item .nav-line-icon { color: var(--alice-primary); }
:root:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .brand .t1 { letter-spacing: 1px; color: var(--alice-text); }
:root:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .brand-mark { box-shadow: 0 0 24px rgba(129,140,248,.4); }
:root:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .topbar :is(.sb-toggle, #look-btn, #data-refresh, .user-chip, .st-chip) { background: rgba(var(--fg-rgb), .035); }
:root:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) :is(#home-time, .market-view .module-window) { top: calc(var(--top-h) + var(--seam)); background: var(--alice-overlay); border-radius: 8px; padding-inline: var(--space-8); }
:root:is([data-skin="glass"], [data-skin="alice"])[data-theme] body:not(.ex-ai-mode) .admin-view,
:root:is([data-skin="glass"], [data-skin="alice"])[data-theme] body.admin-mode:not(.ex-ai-mode) :is(.modal, .du-progress) {
  --admin-surface: var(--alice-structure); --panel: var(--alice-structure); --panel-2: rgba(var(--fg-rgb), .035); --panel-3: rgba(var(--fg-rgb), .06);
  --line: var(--alice-line); --line-2: var(--alice-line-2); --tx: var(--alice-text); --tx-2: var(--alice-muted); --tx-3: var(--alice-dim);
  --pri: var(--alice-primary); --pri-tx: var(--alice-primary-text); --pri-soft: var(--alice-primary-soft);
}
:root:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .view.admin-view { margin: var(--seam); width: calc(100% - 2 * var(--seam)); padding: var(--space-20); border: 1px solid var(--alice-line); backdrop-filter: blur(22px) saturate(1.7); }
:root:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) :is(.menu, .mask .modal, .toast) { background: var(--alice-overlay); backdrop-filter: blur(22px) saturate(1.7); }
:root:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .input, :root:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .select { background: rgba(var(--fg-rgb), .035); }
:root:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .select option { background: var(--bg); color: var(--alice-text); }
:root:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .btn.primary { background: var(--alice-primary); border-color: transparent; color: var(--brand-on); }
:root:is([data-skin="glass"], [data-skin="alice"])[data-theme="light"] body:not(.ex-ai-mode) .btn.primary { color: var(--brand-on); }
:root:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .tbl th { background: var(--alice-overlay); backdrop-filter: blur(14px); }
:root:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .drawer { background: var(--alice-overlay); backdrop-filter: blur(22px) saturate(1.7); }
body:not(.ex-ai-mode) .skin-pick { grid-template-columns: repeat(3, minmax(0, 1fr)); }
body:not(.ex-ai-mode) .skin-opt { min-width: 0; background: transparent; font: inherit; font-size: var(--text-caption); }
body:not(.ex-ai-mode) .pv-alice { background: radial-gradient(ellipse at 12% 0%, #1e3a8a, transparent 70%), radial-gradient(ellipse at 95% 100%, #6d28d9, transparent 75%), #070b18; }
body:not(.ex-ai-mode) .pv-alice::before { content: ""; width: 25%; margin: var(--space-4); border: 1px solid rgba(148,163,184,.3); border-radius: 4px; background: rgba(34,211,238,.12); }
body:not(.ex-ai-mode) .pv-alice::after { content: ""; flex: 1; margin: var(--space-4) var(--space-4) var(--space-4) 0; border: 1px solid rgba(148,163,184,.2); border-radius: 4px; background: rgba(129,140,248,.15); }
@media (max-width: 900px) { :root:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) :is(#home-time, .market-view .module-window) { position: static; } }
@media (max-width: 560px) { :root:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .view.admin-view { width: calc(100% - 2 * var(--seam)); margin: var(--seam); padding: var(--space-16); } }
@media (prefers-reduced-motion: reduce) { :is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .backdrop::before, :is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .backdrop::after, :is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .backdrop b { animation: none; } }

:root:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) :is(#home-time, .market-view .module-window) .seg button.on { color: var(--brand-on); }
:root:is([data-skin="glass"], [data-skin="alice"])[data-theme="light"] body:not(.ex-ai-mode) :is(#home-time, .market-view .module-window) .seg button.on { color: var(--brand-on); }

/* 吸顶区比内容卡片更实：保留冷色玻璃高光，模糊并遮住滚动文字。 */
:root { --sticky-surface: var(--px-panel); --sticky-blur: none; --sticky-highlight: none; }
:root:is([data-skin="glass"], [data-skin="alice"]) {
  --sticky-surface: rgba(29, 40, 65, .98);
  --sticky-highlight: linear-gradient(160deg, rgba(255,255,255,.055), rgba(255,255,255,.015));
  --sticky-blur: blur(24px) saturate(1.5);
}
:root:is([data-skin="glass"], [data-skin="alice"])[data-theme="light"] {
  --sticky-surface: rgba(248, 250, 255, .98);
  --sticky-highlight: linear-gradient(160deg, rgba(255,255,255,.48), rgba(255,255,255,.16));
}
:root[data-skin] body:not(.ex-ai-mode) :is(.topbar, #home-time, #monthly-time, .module-window, .mlt-filters, .page-head:has(.module-time), .rangebar:has(> #rbhost > .module-time)) {
  background: var(--sticky-highlight), var(--sticky-surface);
  backdrop-filter: var(--sticky-blur); -webkit-backdrop-filter: var(--sticky-blur);
}
/* 顶栏上沿的 6px 接缝也遮住滚动内容，避免卡片边线从上方漏出。 */
:root:is([data-skin="glass"], [data-skin="alice"]) body:not(.ex-ai-mode) .topbar::before {
  content: ""; position: absolute; top: calc(-1 * var(--seam)); left: 0; right: 0; height: var(--seam);
  background: var(--solid-surface); pointer-events: none;
}
:root body.ex-ai-mode small.k-unit { color: var(--ai-ink-secondary); }
:root body.ex-ai-mode .cx-scene-stats small.k-unit { color: var(--x-sub); }

/* Ask Flux 里自己说的话：智能舱暗色主题色很亮（如 #3fd2ff），实心底 + 白字对比只有约 1.8:1，看不清（2026-11-13 用户指出）。
 * 改为主题色染过的深色玻璃，白字对比 ≥ 7:1；全屏 Flux（sf-stage）另有更具体的同类规则。 */
:root[data-skin="alice"]:not([data-theme="light"]) body .ai-msg.user .bubble {
  background: color-mix(in srgb, var(--pri) 32%, #0b1626);
  color: #fff;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--pri) 55%, transparent), inset 0 1px 0 rgba(255,255,255,.10);
}