/* ==========================================================================
   发财经营管理系统 · 全局「明亮苹果 · 科技玻璃透感」主题
   2026-10-14 改版：由「深酒红 + 暖香槟」升级为「明亮苹果玻璃」

   设计意图（聪哥方向：明亮一点的颜色 + 苹果风科技玻璃透感）：
   1. 页面底色改成冷白，叠一层淡彩 mesh（天蓝 / 薄荷 / 蜜桃 / 淡紫），
      玻璃元素的模糊直接从这些浅色块采样，整体提亮、不脏。
   2. 侧栏由深酒红改成「浅色磨砂玻璃」，文字深墨色，选中项用明亮撞色胶囊。
   3. 主色沿用发财红，但提亮为明亮苹果红（#e0123f / 粉红过渡），
      科技辅色用苹果蓝（#0a7bff），成功/警告/危险各用独立色相，避免单一色调。
   4. 毛玻璃：backdrop-filter blur(16~30px) saturate(170~185%)。
   5. 1px 白描边 + 柔和外阴影 + 统一圆角，卡片统一 18px。

   性能约束（保持不变，必须遵守）：
   - 禁止对全屏大容器、长列表、高频重绘卡逐项加 blur。
   - 滚动区（表格 / 队列 / 时间线）用近实色底，不加 backdrop-filter。
   - 不碰 padding / font-size / height，保留表格信息密度。
   - 保留可见滚动条。
   - 禁止卡片套卡片：嵌套容器一律拍平成透明 + 发丝分隔线。
   ========================================================================== */

:root {
  /* —— 基础色 —— */
  --gl-bg: #e7ecf7;                    /* 画布：比承载面略深，玻璃才浮得起来 */
  --gl-ink: #0f1622;                   /* 主文字：近墨黑 */
  --gl-ink-2: #465366;                 /* 次文字 */
  --gl-muted: #8592a6;                 /* 弱文字 */

  /* —— 主色：明亮的发财红（替代深酒红） —— */
  --gl-wine: #e0123f;
  --gl-wine-deep: #b00d31;
  --gl-wine-light: #ff4d6d;
  --gl-wine-soft: rgba(224, 18, 63, .10);
  --gl-gold: #d99a2b;                  /* 辅色：金（只做点缀） */
  --gl-gold-soft: rgba(217, 154, 43, .16);

  /* —— 科技辅色：苹果蓝 —— */
  --gl-tech: #0a7bff;
  --gl-tech-soft: rgba(10, 123, 255, .12);

  /* —— 语义色：各自独立色相，避免单色调 —— */
  --gl-jade: #0aa06e;
  --gl-jade-soft: rgba(10, 160, 110, .12);
  --gl-danger: #d92b3f;
  --gl-danger-soft: rgba(217, 43, 63, .10);
  --gl-warn: #b7791f;
  --gl-warn-soft: rgba(217, 145, 20, .14);
  --gl-violet: #7a5cff;
  --gl-violet-soft: rgba(122, 92, 255, .12);

  /* —— 玻璃 token：三级高度（iOS 式层次） ——
     L1 承载面（面板 / 容器）：最透、最贴底
     L2 抬升面（页头 / KPI / 侧栏 / 主卡）：更实、更亮、投影更远
     L3 浮层面（弹窗 / 抽屉 / 下拉 / 提示）：最实、最亮、投影最深 */
  --gl-glass: rgba(255, 255, 255, .66);        /* 兼容旧引用 = L1 */
  --gl-glass-1: rgba(255, 255, 255, .6);
  --gl-glass-2: rgba(255, 255, 255, .78);
  --gl-glass-3: rgba(255, 255, 255, .9);
  --gl-glass-strong: rgba(255, 255, 255, .9);  /* 浮层（兼容旧引用） */
  --gl-glass-soft: rgba(255, 255, 255, .5);    /* 嵌套内衬 */
  --gl-glass-solid: rgba(255, 255, 255, .9);   /* 近实色（滚动区/表格） */
  --gl-stroke: rgba(255, 255, 255, .72);       /* 1px 白描边 */
  --gl-stroke-soft: rgba(15, 22, 34, .07);     /* 发丝分隔线 */
  --gl-stroke-dark: rgba(255, 255, 255, .55);

  /* —— 玻璃渐变：上亮下微沉，玻璃才有厚度感 —— */
  --gl-sheen-1: linear-gradient(180deg, rgba(255, 255, 255, .72), rgba(255, 255, 255, .5));
  --gl-sheen-2: linear-gradient(180deg, rgba(255, 255, 255, .86), rgba(255, 255, 255, .66));
  --gl-sheen-3: linear-gradient(180deg, rgba(255, 255, 255, .96), rgba(255, 255, 255, .84));

  /* —— 顶部高光 + 底部接地影：iOS 玻璃的“受光边”与“落地边” —— */
  --gl-bevel-1: inset 0 1px 0 rgba(255, 255, 255, .8), inset 0 -1px 0 rgba(15, 22, 34, .035);
  --gl-bevel-2: inset 0 1px 0 rgba(255, 255, 255, .92), inset 0 -1px 0 rgba(15, 22, 34, .05);
  --gl-bevel-3: inset 0 1px 0 rgba(255, 255, 255, .98), inset 0 -1px 0 rgba(15, 22, 34, .06);

  /* —— 模糊 token —— */
  --gl-blur: blur(20px) saturate(180%);
  --gl-blur-soft: blur(16px) saturate(170%);
  --gl-blur-strong: blur(30px) saturate(185%);

  /* —— 圆角 token（iOS 连续圆角观感） —— */
  --gl-radius-lg: 20px;
  --gl-radius-md: 13px;
  --gl-radius-sm: 9px;
  --gl-radius-pill: 999px;

  /* —— 阴影 token：近距接触影 + 远距环境影，双层才有纵深 —— */
  --gl-shadow: 0 1px 2px rgba(15, 22, 34, .05), 0 8px 20px rgba(15, 22, 34, .06);
  --gl-shadow-1: 0 1px 2px rgba(15, 22, 34, .05), 0 8px 20px rgba(15, 22, 34, .06);
  --gl-shadow-2: 0 1px 2px rgba(15, 22, 34, .06), 0 14px 32px rgba(15, 22, 34, .10);
  --gl-shadow-lift: 0 2px 6px rgba(15, 22, 34, .07), 0 20px 44px rgba(15, 22, 34, .13);
  --gl-shadow-3: 0 3px 8px rgba(15, 22, 34, .10), 0 30px 70px rgba(15, 22, 34, .20);
  --gl-shadow-dark: 0 18px 50px rgba(15, 22, 34, .22);

  --gl-font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "PingFang SC", "Microsoft YaHei UI", "Microsoft YaHei", system-ui, sans-serif;

  /* —— 覆写 extra.css 的旧酒红变量：全站同步提亮 —— */
  --wine: #e0123f;
  --wine-dark: #101725;                 /* 原深栗红 → 墨黑（文字用，保证浅底可读） */
  --wine-light: #ff4d6d;
  --bg: #e7ecf7;
  --line: #e3e8f0;
  --surface-soft: #f6f8fc;
}

/* ==========================================================================
   1. 页面背景：冷白底 + 淡彩 mesh。
      玻璃的模糊就采样自这些浅色块；避免“整页单一紫蓝渐变”。
   ========================================================================== */
html { background: #e7ecf7; }
/* 注意：body 会长期挂着 customer-console-page 类（客户总控/AI 工作台残留），
   所以主体样式不再用 :not(.customer-console-page) 做守卫，直接作用于 body，
   客户总控自己的 .customer-console-page xxx 规则优先级更高，不受影响。
   用 html[data-skin] 前缀提高优先级，压过 premium-ui.css 的
   body:not(.customer-console-page) 底色。 */
html[data-skin] body {
  background:
    radial-gradient(860px 580px at 2% -12%, rgba(112, 186, 255, .50), transparent 62%),
    radial-gradient(760px 520px at 100% -8%, rgba(142, 202, 255, .40), transparent 60%),
    radial-gradient(940px 700px at 90% 116%, rgba(154, 142, 255, .28), transparent 62%),
    radial-gradient(800px 580px at 8% 116%, rgba(96, 228, 196, .28), transparent 60%),
    radial-gradient(680px 460px at 58% 2%, rgba(255, 200, 182, .34), transparent 66%),
    linear-gradient(180deg, #eaeff9 0%, #e7ecf7 46%, #e9edf8 100%),
    var(--gl-bg);
  color: var(--gl-ink);
  font-family: var(--gl-font);
  background-attachment: fixed;
}

/* ==========================================================================
   2. 可见滚动条：细灰、圆角、不消失
   ========================================================================== */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: rgba(15, 22, 34, .2);
  border-radius: 8px;
  border: 2px solid transparent;
  background-clip: content-box;
}
::-webkit-scrollbar-thumb:hover { background: rgba(15, 22, 34, .34); background-clip: content-box; }
::-webkit-scrollbar-corner { background: transparent; }

/* ==========================================================================
   3. 侧栏：浅色磨砂玻璃（明亮主体，替代原深酒红）
   ========================================================================== */
.sidebar {
  background: var(--gl-sheen-2);
  backdrop-filter: var(--gl-blur-strong);
  -webkit-backdrop-filter: var(--gl-blur-strong);
  border-right: 1px solid rgba(255, 255, 255, .8);
  box-shadow: var(--gl-shadow-2), var(--gl-bevel-2);
  color: var(--gl-ink-2);
}
.brand { border-bottom: 1px solid var(--gl-stroke-soft); }
.brand img { filter: drop-shadow(0 6px 12px rgba(224, 18, 63, .18)); }
.brand div span, .brand div strong { color: var(--gl-ink); }
.brand small { color: var(--gl-muted); }

/* 分组标题 */
.nav-group {
  color: var(--gl-muted);
  border-top: 1px solid var(--gl-stroke-soft);
}
.nav-group:first-child { border-top: 0; }
.nav-group:before { background: linear-gradient(180deg, #ff6b86, var(--gl-wine)); }
.nav-group:after { color: var(--gl-muted); }
.nav-group:hover { background: rgba(15, 22, 34, .045); color: var(--gl-ink); }

/* 一级 / 二级导航按钮：两列用同一套外观，避免一边大一边小。
   几何（宽高、内边距、圆角）在 styles.css 的「侧栏两列统一」里，这里只管颜色。 */
.sidebar .sidebar-nav .nav-primary button,
.sidebar .sidebar-nav .nav-secondary button {
  background: rgba(255, 255, 255, .55);
  border-color: rgba(15, 22, 34, .07);
  color: var(--gl-ink-2);
}
.sidebar .sidebar-nav .nav-primary button:hover,
.sidebar .sidebar-nav .nav-secondary button:hover {
  background: #fff;
  border-color: rgba(15, 22, 34, .1);
  color: var(--gl-ink);
}
.sidebar .sidebar-nav .nav-primary button.selected,
.sidebar .sidebar-nav .nav-secondary button.active {
  background: linear-gradient(135deg, #ff4167, var(--gl-wine) 60%, #c20f36);
  border-color: rgba(255, 255, 255, .5);
  color: #fff;
  box-shadow: inset 3px 0 0 rgba(255, 255, 255, .8), inset 0 1px 0 rgba(255, 255, 255, .38), 0 6px 14px rgba(224, 18, 63, .24);
}
/* 左列箭头 / 右列圆点：默认用中性灰，选中才转白（extra.css 原色是浅金，白底看不见） */
.sidebar .sidebar-nav .nav-primary button::after { color: var(--gl-muted); }
.sidebar .sidebar-nav .nav-secondary button::before { background: rgba(15, 22, 34, .24); }
.sidebar .sidebar-nav .nav-primary button.selected::after { color: #fff; }
.sidebar .sidebar-nav .nav-secondary button.active::before { background: #fff; }

/* 左下角底部区（皮肤条 + 身份卡）：浅底深字，全部按可读对比度取值。
   注意 extra.css 里这几位原本是浅金 / 浅棕（为深色侧栏写的），
   在明亮皮肤的白底上会看不清，所以这里逐个显式覆盖。 */
.skin-switch {
  border-color: rgba(15, 22, 34, .1);
  background: rgba(255, 255, 255, .55);
  color: var(--gl-ink-2);
}
.sidebar-foot {
  border: 1px solid var(--gl-stroke-soft);
  background: rgba(255, 255, 255, .55);
  color: var(--gl-ink-2);
}
.sidebar-user-avatar {
  border: 1px solid rgba(224, 18, 63, .24);
  background: linear-gradient(145deg, #ffe4ea, #ffd2dd);
  color: #b3123a;
}
.sidebar-user-meta b { color: var(--gl-ink); }
.sidebar-user-meta small { color: var(--gl-ink-2); }
#sidebar-role-preview { color: var(--gl-ink-2); }
#sidebar-role-preview > span { color: var(--gl-ink-2); }
#sidebar-role-preview select {
  border: 1px solid rgba(15, 22, 34, .14);
  background: rgba(255, 255, 255, .92);
  color: var(--gl-ink);
}

/* ==========================================================================
   4. 页头：明亮玻璃横条
   ========================================================================== */
/* 页头：同时用裸选择器和 body:not(...) 变体，保证压过 premium-ui.css 里
   同名的吸顶页头样式（body:not(.customer-console-page) main>header）。 */
main > header,
body:not(.customer-console-page) main > header,
main > .page-title-bar,
body:not(.customer-console-page) main > .page-title-bar {
  margin: 0 0 12px;
  padding: 0 20px;
  background: var(--gl-sheen-2);
  backdrop-filter: var(--gl-blur);
  -webkit-backdrop-filter: var(--gl-blur);
  border: 1px solid rgba(255, 255, 255, .8);
  border-bottom: 1px solid rgba(255, 255, 255, .8);
  border-radius: var(--gl-radius-lg);
  box-shadow: var(--gl-shadow-2), var(--gl-bevel-2);
}
h1, header h1, .page-title-bar { color: var(--gl-ink); }
header p { color: var(--gl-ink-2); }

/* main 原本是一整块深酒红大底（extra.css: main{background:var(--wine)}），
   改成透明，让页面背景透出来；客户总控自带 .cc-shell-standalone 底色，不受影响。 */
main {
  background: transparent !important;
}

/* ==========================================================================
   5. 卡片 / 面板 / 表格：统一玻璃面 + 白描边 + 柔和外阴影 + 统一圆角
      注意：不碰 padding / font-size / height，表格信息密度原样保留。
   ========================================================================== */
.card, .panel, .modal-card, .logic-flow > div, .tier-section {
  background: var(--gl-sheen-1) !important;
  backdrop-filter: var(--gl-blur);
  -webkit-backdrop-filter: var(--gl-blur);
  border: 1px solid rgba(255, 255, 255, .8);
  border-radius: var(--gl-radius-lg);
  box-shadow: var(--gl-shadow-1), var(--gl-bevel-1);
}
.card, .panel { transition: box-shadow .2s ease, transform .2s ease; }
.card:hover, .panel:hover { box-shadow: var(--gl-shadow-2), var(--gl-bevel-2); }
.panel h2, .section-head h2, .tier-section h2 { color: var(--gl-ink); }
.card strong { color: var(--gl-ink); }
.card .label { color: var(--gl-ink-2); }

/* summary-strip 拍平：外框是唯一玻璃卡，内部格子透明 + 发丝分隔 */
.summary-strip {
  background: var(--gl-sheen-2) !important;
  backdrop-filter: var(--gl-blur);
  -webkit-backdrop-filter: var(--gl-blur);
  border: 1px solid rgba(255, 255, 255, .82);
  border-radius: var(--gl-radius-lg);
  box-shadow: var(--gl-shadow-2), var(--gl-bevel-2);
  overflow: hidden;
}
.summary-strip div { background: transparent !important; border-radius: 0 !important; box-shadow: none !important; }
.summary-strip div + div { border-left: 1px solid var(--gl-stroke-soft); }

/* 表格容器是滚动区：半透明近实色底 + 白描边，不加 blur（性能约束） */
.table-wrap {
  background: var(--gl-glass-solid) !important;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  border: 1px solid rgba(255, 255, 255, .82);
  border-radius: var(--gl-radius-lg);
  box-shadow: var(--gl-shadow-1), var(--gl-bevel-1);
}
th { background: rgba(244, 246, 251, .94); color: var(--gl-ink-2); }
td { border-top: 1px solid rgba(15, 22, 34, .06); color: #2b3644; }
tbody tr:hover td { background: rgba(255, 255, 255, .74); }

/* 明细表彩色表头：extra.css 里写死了 9 组深色底 + 白字，
   这里保留"每列一个色相"的编码习惯，但全部改成明亮柔和底 + 深色字。 */
main .table-wrap thead th:nth-child(9n+1), main .excel-grid thead th:nth-child(9n+1),
main .settings-grid-table thead th:nth-child(9n+1), main .panel table thead th:nth-child(9n+1),
.performance-sheet thead th:nth-child(9n+1), .expense-sheet thead th[data-col="actions"] {
  background: #ffdfe7 !important; color: #a3123a !important;
}
main .table-wrap thead th:nth-child(9n+2), main .excel-grid thead th:nth-child(9n+2),
main .settings-grid-table thead th:nth-child(9n+2), main .panel table thead th:nth-child(9n+2),
.performance-sheet thead th:nth-child(9n+2), .expense-sheet thead th[data-col="date"] {
  background: #ffe8d8 !important; color: #9c4a13 !important;
}
main .table-wrap thead th:nth-child(9n+3), main .excel-grid thead th:nth-child(9n+3),
main .settings-grid-table thead th:nth-child(9n+3), main .panel table thead th:nth-child(9n+3),
.performance-sheet thead th:nth-child(9n+3), .expense-sheet thead th[data-col="category"] {
  background: #ddf4e6 !important; color: #126f49 !important;
}
main .table-wrap thead th:nth-child(9n+4), main .excel-grid thead th:nth-child(9n+4),
main .settings-grid-table thead th:nth-child(9n+4), main .panel table thead th:nth-child(9n+4),
.performance-sheet thead th:nth-child(9n+4), .expense-sheet thead th[data-col="account"] {
  background: #dfecff !important; color: #1d4f8f !important;
}
main .table-wrap thead th:nth-child(9n+5), main .excel-grid thead th:nth-child(9n+5),
main .settings-grid-table thead th:nth-child(9n+5), main .panel table thead th:nth-child(9n+5),
.performance-sheet thead th:nth-child(9n+5), .expense-sheet thead th[data-col="summary"] {
  background: #eee3fb !important; color: #673aa6 !important;
}
main .table-wrap thead th:nth-child(9n+6), main .excel-grid thead th:nth-child(9n+6),
main .settings-grid-table thead th:nth-child(9n+6), main .panel table thead th:nth-child(9n+6),
.performance-sheet thead th:nth-child(9n+6), .expense-sheet thead th[data-col="amount"] {
  background: #fff1d4 !important; color: #8a5a10 !important;
}
main .table-wrap thead th:nth-child(9n+7), main .excel-grid thead th:nth-child(9n+7),
main .settings-grid-table thead th:nth-child(9n+7), main .panel table thead th:nth-child(9n+7),
.performance-sheet thead th:nth-child(9n+7), .expense-sheet thead th[data-col="voucherImage"] {
  background: #e6ecf6 !important; color: #3c4a5e !important;
}
main .table-wrap thead th:nth-child(9n+8), main .excel-grid thead th:nth-child(9n+8),
main .settings-grid-table thead th:nth-child(9n+8), main .panel table thead th:nth-child(9n+8),
.performance-sheet thead th:nth-child(9n+8), .expense-sheet thead th[data-col="project"] {
  background: #ffe1dd !important; color: #a8352a !important;
}
main .table-wrap thead th:nth-child(9n+9), main .excel-grid thead th:nth-child(9n+9),
main .settings-grid-table thead th:nth-child(9n+9), main .panel table thead th:nth-child(9n+9),
.performance-sheet thead th:nth-child(9n+9), .expense-sheet thead th[data-col="owner"] {
  background: #f0e6ff !important; color: #5b3a9e !important;
}
/* 财务/业绩明细表的表头文字原本写死白字，改成深色以适配亮底 */
.expense-sheet thead th, .expense-sheet thead th *,
.performance-sheet thead th, .performance-sheet thead th * {
  color: var(--gl-ink) !important;
}
.expense-sheet thead .raw-header-filter,
.performance-sheet thead .raw-header-filter {
  border-color: rgba(15, 22, 34, .2) !important;
  background: rgba(255, 255, 255, .7) !important;
  color: var(--gl-ink-2) !important;
}
.expense-sheet thead .raw-header-filter.is-active,
.performance-sheet thead .raw-header-filter.is-active {
  background: var(--gl-wine) !important; border-color: var(--gl-wine) !important; color: #fff !important;
}
/* 财务/业绩页的汇总卡片与趋势条原本是深色渐变，改明亮玻璃 */
body.performance-page-title .summary-strip > div {
  background: var(--gl-glass) !important;
  border: 1px solid var(--gl-stroke) !important;
  color: var(--gl-ink) !important;
}
body.performance-page-title .summary-strip span { color: var(--gl-muted) !important; }
body.performance-page-title .summary-strip b { color: var(--gl-ink) !important; }

/* 概览 KPI 卡（.cards .card）：extra.css 写死了 9 组深色渐变，改成明亮柔和玻璃 */
.cards .card, .cards .card:nth-child(9n+1) { background: rgba(255, 232, 238, .78) !important; }
.cards .card:nth-child(9n+2) { background: rgba(255, 240, 228, .78) !important; }
.cards .card:nth-child(9n+3) { background: rgba(226, 247, 235, .78) !important; }
.cards .card:nth-child(9n+4) { background: rgba(226, 240, 255, .78) !important; }
.cards .card:nth-child(9n+5) { background: rgba(240, 232, 253, .78) !important; }
.cards .card:nth-child(9n+6) { background: rgba(255, 246, 224, .78) !important; }
.cards .card:nth-child(9n+7) { background: rgba(233, 238, 247, .78) !important; }
.cards .card:nth-child(9n+8) { background: rgba(255, 232, 229, .78) !important; }
.cards .card:nth-child(9n+9) { background: rgba(244, 236, 255, .78) !important; }
.cards .card {
  border: 1px solid var(--gl-stroke) !important;
  border-radius: var(--gl-radius-lg);
  box-shadow: var(--gl-shadow) !important;
  color: var(--gl-ink) !important;
}
.cards .card .label, .cards .card span { color: var(--gl-ink-2) !important; }
.cards .card strong, .cards .card b { color: var(--gl-ink) !important; }

/* ==========================================================================
   6. 控件：按钮 / 输入 / 标签
   ========================================================================== */
input, select, textarea {
  border: 1px solid rgba(15, 22, 34, .14);
  border-radius: var(--gl-radius-md);
  background: rgba(255, 255, 255, .86);
  color: var(--gl-ink);
}
input:focus, select:focus, textarea:focus {
  border-color: rgba(224, 18, 63, .5);
  box-shadow: 0 0 0 3px rgba(224, 18, 63, .12);
  outline: none;
}
.toolbar button, .section-head button, .header-actions button {
  border: 1px solid rgba(15, 22, 34, .12);
  border-radius: var(--gl-radius-md);
  background: rgba(255, 255, 255, .78);
  color: var(--gl-ink-2);
  box-shadow: 0 1px 2px rgba(15, 22, 34, .04);
}
.toolbar button:hover, .section-head button:hover, .header-actions button:hover {
  border-color: rgba(224, 18, 63, .32);
  background: #fff;
  color: var(--gl-wine);
}
.primary {
  border: 1px solid rgba(176, 13, 49, .3);
  border-radius: var(--gl-radius-md);
  background: linear-gradient(135deg, #ff4167, var(--gl-wine) 58%, #c20f36);
  box-shadow: 0 8px 18px rgba(224, 18, 63, .24), inset 0 1px rgba(255, 255, 255, .28);
  color: #fff;
}
.primary:hover { background: linear-gradient(135deg, #ff5c7c, #e0123f 58%, #cf1140); }
.badge { border-radius: var(--gl-radius-pill); font-weight: 800; }

/* ==========================================================================
   7. 模态框 / 登录卡 / toast
   ========================================================================== */
/* 遮罩：轻微降饱和压暗底层，把浮层“推”到前面（不加 blur，性能约束） */
.modal { background: rgba(15, 22, 34, .3); }
/* L3 浮层：弹窗、抽屉、下拉、提示统一用最实最亮的玻璃 + 最深投影 */
.modal-card {
  background: var(--gl-sheen-3) !important;
  backdrop-filter: var(--gl-blur-strong);
  -webkit-backdrop-filter: var(--gl-blur-strong);
  border: 1px solid rgba(255, 255, 255, .9);
  border-radius: var(--gl-radius-lg);
  box-shadow: var(--gl-shadow-3), var(--gl-bevel-3);
}
.login-screen {
  background:
    radial-gradient(760px 560px at 12% 8%, rgba(120, 190, 255, .45), transparent 60%),
    radial-gradient(720px 520px at 92% 12%, rgba(255, 150, 140, .40), transparent 58%),
    radial-gradient(900px 680px at 60% 116%, rgba(150, 135, 255, .34), transparent 62%),
    linear-gradient(160deg, #eef3fc, #e7ecf8 52%, #eef1f8);
}
.login-card {
  background: var(--gl-sheen-3);
  backdrop-filter: var(--gl-blur-strong);
  -webkit-backdrop-filter: var(--gl-blur-strong);
  border: 1px solid rgba(255, 255, 255, .9);
  border-top: 2px solid var(--gl-wine);
  border-radius: 22px;
  box-shadow: var(--gl-shadow-3), var(--gl-bevel-3);
}
.login-card h1 { color: var(--gl-ink); }
.login-card p { color: var(--gl-ink-2); }
.login-card input { background: rgba(255, 255, 255, .9); border: 1px solid rgba(15, 22, 34, .14); }
.system-toast, .ops-toast {
  background: var(--gl-sheen-3) !important;
  backdrop-filter: var(--gl-blur-strong);
  -webkit-backdrop-filter: var(--gl-blur-strong);
  border: 1px solid rgba(255, 255, 255, .9);
  border-radius: var(--gl-radius-md);
  box-shadow: var(--gl-shadow-3), var(--gl-bevel-3);
  color: var(--gl-ink);
}
.system-toast.success, .ops-toast.success { background: rgba(233, 250, 243, .94) !important; color: #0a6b4a; }
.system-toast.error, .ops-toast.error { background: rgba(253, 236, 238, .95) !important; color: #a5162b; }

/* ==========================================================================
   8. 运营工作台（账号矩阵 / 客户工作台 / 实况看板…）
   ========================================================================== */
/* 品牌色对齐：运营台原先的蓝色主色统一改成明亮发财红，一处生效全局。 */
body.ops-workspace-active {
  --ops-primary: var(--gl-wine);
  --ops-primary-soft: var(--gl-wine-soft);
}
/* 运营态主区透明，让页面玻璃层次透出来 */
body.ops-workspace-active main,
body.ops-workspace-active #app { background: transparent; }
/* 客户工作台中栏本身就是 <main>，需要恢复玻璃乳白底 */
body.ops-workspace-active main.ops-customer-thread { background: var(--gl-glass); }
.douyin-ops-shell { background: transparent; border-radius: var(--gl-radius-lg); }
.douyin-account-rail, .douyin-side-panel, .douyin-panel,
.social-hero, .social-panel, .social-card, .ops-live-card,
.social-studio-shell, .social-live-shell,
.ops-customer-queue, .ops-customer-thread, .ops-automation-panel {
  background: var(--gl-glass);
  backdrop-filter: var(--gl-blur);
  -webkit-backdrop-filter: var(--gl-blur);
  border: 1px solid var(--gl-stroke);
  border-radius: var(--gl-radius-lg);
  box-shadow: var(--gl-shadow);
  color: var(--gl-ink);
}
/* 侧栏轨道内部分区：拍平为透明 + 发丝分隔（禁止卡片套卡片） */
.douyin-side-panel > section { background: transparent !important; border-color: var(--gl-stroke-soft) !important; }
.douyin-side-head b { color: var(--gl-ink); }
.douyin-side-head > span { color: var(--gl-muted); }
.ops-rail-metrics article {
  background: transparent !important;
  border: 1px solid var(--gl-stroke-soft) !important;
  border-radius: var(--gl-radius-sm);
}
.ops-rail-metrics b { color: var(--gl-ink); }
.ops-rail-metrics span { color: var(--gl-muted); }
.ops-rail-empty { border: 1px dashed rgba(15, 22, 34, .16); color: var(--gl-muted); }
/* 账号列条目：扁平化，不加 blur（长列表） */
.douyin-account-item { background: transparent !important; border-color: transparent !important; border-radius: var(--gl-radius-sm); }
.douyin-account-item:hover { background: rgba(15, 22, 34, .04) !important; }
.douyin-account-item.active {
  background: var(--gl-wine-soft) !important;
  border-color: rgba(224, 18, 63, .22) !important;
  box-shadow: inset 3px 0 0 var(--gl-wine) !important;
}
.douyin-account-item b { color: var(--gl-ink); }
.douyin-account-item small { color: var(--gl-muted); }
.douyin-account-avatar {
  background: linear-gradient(145deg, #ffe3ea, #ffd0dc);
  color: #b3123a;
  box-shadow: inset 0 0 0 1px rgba(224, 18, 63, .14);
}
/* 标签行 / 工具条 */
.douyin-tabs, .douyin-workbench-tabs, .social-tabs, .ops-workspace-tabs,
.ops-customer-tabs,
.douyin-brand-row, .douyin-panel-head, .douyin-browser-toolbar-main {
  border-color: var(--gl-stroke-soft);
  background: rgba(255, 255, 255, .74);
  backdrop-filter: var(--gl-blur-soft);
  -webkit-backdrop-filter: var(--gl-blur-soft);
}
.douyin-brand-row b, .douyin-panel-head h2, .douyin-side-head b { color: var(--gl-ink); }
.douyin-brand-row span, .douyin-panel-head p { color: var(--gl-muted); }
.douyin-tabs button.active, .douyin-workbench-tabs > button.active, .social-tabs button.active,
.ops-customer-tabs button.active {
  color: #fff;
  border-color: var(--gl-wine);
  background: var(--gl-wine);
}
.douyin-tabs button, .douyin-workbench-tabs > button, .social-tabs button,
.ops-customer-tabs button { border-radius: var(--gl-radius-pill); }
/* 内嵌浏览器工作区：内衬井（非卡片），透明底不加 blur */
.douyin-workbench, .douyin-inline-browser-mount, .social-workspace {
  background: rgba(240, 243, 249, .6);
  border: 0;
  border-radius: var(--gl-radius-md);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
/* 客户工作台 */
.ops-customer-kpis article {
  border-radius: var(--gl-radius-md) !important;
  box-shadow: none !important;
  background: rgba(255, 255, 255, .74);
  -webkit-backdrop-filter: var(--gl-blur-soft);
  backdrop-filter: var(--gl-blur-soft);
  border-color: var(--gl-stroke-soft);
}
.ops-customer-queue, .ops-customer-thread, .ops-automation-panel { border-radius: var(--gl-radius-lg) !important; box-shadow: none !important; }
body.ops-workspace-active .ops-customer-source,
body.ops-workspace-active .ops-chat-timeline,
body.ops-workspace-active .ops-customer-compose { background: transparent; }
.ops-customer-source { border-bottom-color: var(--gl-stroke-soft); }
.ops-customer-compose { border-top-color: var(--gl-stroke-soft); }
.ops-customer-compose textarea { background: rgba(255, 255, 255, .94); }
.ops-customer-next { background: var(--gl-wine-soft); color: var(--gl-wine); }
.ops-customer-queue > button.ops-customer-row { border-radius: var(--gl-radius-sm) !important; }
.ops-customer-queue > button.ops-customer-row:hover { background: rgba(15, 22, 34, .04) !important; }
.ops-customer-queue > button.ops-customer-row.active {
  border-color: rgba(224, 18, 63, .25) !important;
  background: var(--gl-wine-soft) !important;
  box-shadow: inset 3px 0 var(--gl-wine) !important;
}
.ops-chat-timeline article { border-radius: var(--gl-radius-md) !important; }
/* 客服气泡：我方气泡用明亮红柔光 */
.ops-chat-timeline article.agent {
  background: var(--gl-wine-soft);
  border-color: rgba(224, 18, 63, .18);
}
.ops-chat-timeline .customer { background: rgba(15, 22, 34, .05); }
.ops-lane.outreach { background: var(--gl-wine-soft); color: var(--gl-wine); }
.ops-automation-panel > section { border-color: var(--gl-stroke-soft); }
.douyin-confirm {
  background: linear-gradient(135deg, #ff4167, var(--gl-wine) 60%, #c20f36);
  border-radius: var(--gl-radius-md);
  box-shadow: 0 8px 18px rgba(224, 18, 63, .24);
}
/* 任务/事件列表条目：扁平，不加 blur（长列表） */
.douyin-task-list > article, .social-output-stack > section, .ops-event-row {
  background: rgba(255, 255, 255, .56);
  border: 1px solid var(--gl-stroke-soft);
  border-radius: var(--gl-radius-md);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.douyin-status.good, .tag.green { color: var(--gl-jade); background: var(--gl-jade-soft); }
.douyin-status.warn, .tag.amber { color: var(--gl-warn); background: var(--gl-warn-soft); }
.douyin-status.danger, .tag.red { color: var(--gl-danger); background: var(--gl-danger-soft); }
/* 实况视频卡：高频重绘，明确不加 blur（性能） */
.ops-live-card { backdrop-filter: none; -webkit-backdrop-filter: none; background: rgba(255, 255, 255, .94); }
.ops-live-overlay { backdrop-filter: none; -webkit-backdrop-filter: none; background: rgba(15, 22, 34, .8); }
/* 右侧轨道重开按钮 */
.douyin-rail-reopen {
  background: rgba(255, 255, 255, .86);
  backdrop-filter: var(--gl-blur-soft);
  -webkit-backdrop-filter: var(--gl-blur-soft);
  border: 1px solid var(--gl-stroke);
  border-radius: var(--gl-radius-md);
  box-shadow: var(--gl-shadow);
  color: var(--gl-ink-2);
}
.douyin-rail-reopen b { color: var(--gl-wine); }
/* 账号抽屉 */
.douyin-account-drawer { background: rgba(15, 22, 34, .3); backdrop-filter: blur(3px); }
.douyin-account-drawer > section {
  background: var(--gl-sheen-3);
  backdrop-filter: var(--gl-blur-strong);
  -webkit-backdrop-filter: var(--gl-blur-strong);
  border-left: 1px solid rgba(255, 255, 255, .9);
  box-shadow: var(--gl-shadow-3), var(--gl-bevel-3);
  color: var(--gl-ink);
}
.douyin-account-drawer header b { color: var(--gl-ink); }
.douyin-account-drawer header span { color: var(--gl-muted); }
.douyin-account-drawer header button {
  border: 1px solid rgba(15, 22, 34, .12);
  border-radius: var(--gl-radius-sm);
  background: rgba(255, 255, 255, .78);
  color: var(--gl-ink-2);
}
.douyin-account-drawer .douyin-account-form { border-color: var(--gl-stroke-soft); background: rgba(255, 255, 255, .55); }
.douyin-account-drawer .douyin-account-form input {
  background: rgba(255, 255, 255, .88);
  border: 1px solid rgba(15, 22, 34, .14);
  color: var(--gl-ink);
}

/* ==========================================================================
   9. 经营总览（company-live-dashboard）：KPI 瓦片玻璃、面板玻璃、列表拍平
   ========================================================================== */
.company-pulse-grid article {
  background: var(--gl-sheen-2);
  backdrop-filter: var(--gl-blur-soft);
  -webkit-backdrop-filter: var(--gl-blur-soft);
  border: 1px solid rgba(255, 255, 255, .82);
  border-radius: var(--gl-radius-md);
  box-shadow: var(--gl-shadow-2), var(--gl-bevel-2);
}
.company-pulse-grid article.primary {
  background: linear-gradient(145deg, #ff4d6d, #d1113c 60%, #a90e30);
  border-color: rgba(255, 255, 255, .32);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.company-pulse-grid article.primary b,
.company-pulse-grid article.primary span,
.company-pulse-grid article.primary small { color: #fff; }
.company-pulse-grid b { color: var(--gl-ink); }
.company-pulse-grid span { color: var(--gl-muted); }
.company-pulse-grid small { color: var(--gl-muted); }
.company-live-panel {
  background: var(--gl-sheen-1);
  backdrop-filter: var(--gl-blur);
  -webkit-backdrop-filter: var(--gl-blur);
  border: 1px solid rgba(255, 255, 255, .8);
  border-radius: var(--gl-radius-lg);
  box-shadow: var(--gl-shadow-1), var(--gl-bevel-1);
}
.company-live-panel-head { background: rgba(255, 255, 255, .5); border-bottom: 1px solid var(--gl-stroke-soft); }
.company-live-panel-head h2 { color: var(--gl-ink); }
.company-live-panel-head p { color: var(--gl-muted); }
.company-live-panel-head > b { color: var(--gl-wine); }
.company-live-panel-head > span { background: var(--gl-jade-soft); color: var(--gl-jade); }
.company-live-panel-head > span.danger { background: var(--gl-danger-soft); color: var(--gl-danger); }
.company-trend-day i { background: linear-gradient(180deg, #ff6b86, #d1113c); }
/* 告警 / 健康度 / 行动列表：条目拍平 */
.company-alert-list article, .company-health-list article, .company-action-list article {
  background: transparent !important;
  border: 1px solid var(--gl-stroke-soft) !important;
  border-radius: var(--gl-radius-sm);
}
.company-alert-list b, .company-health-list b { color: var(--gl-ink); }
.company-alert-list span, .company-health-list span { color: var(--gl-muted); }
.company-target-panel { background: var(--gl-glass); border: 1px solid var(--gl-stroke); border-radius: var(--gl-radius-lg); }

/* ==========================================================================
   10. 遗留深色块收口：AI 工作台标题条 / 能力面板 / 财务摘要卡
       这些原本是深酒红大块，统一改成明亮玻璃，避免出现“暗色孤岛”。
   ========================================================================== */
.ai-workbench-title {
  background: linear-gradient(135deg, #ff4167, var(--gl-wine) 60%, #c20f36);
  color: #fff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .28);
}
.ai-workbench-title h1 { color: #fff; }
.ai-capability-panel {
  background: rgba(255, 255, 255, .72);
  backdrop-filter: var(--gl-blur-soft);
  -webkit-backdrop-filter: var(--gl-blur-soft);
  border-right: 1px solid var(--gl-stroke-soft);
}
.ai-capability-item { background: rgba(255, 255, 255, .6); border-color: var(--gl-stroke-soft); color: var(--gl-ink-2); }
.ai-capability-item b { color: var(--gl-ink); }
.ai-capability-item small { color: var(--gl-muted); }
.ai-capability-item em { color: var(--gl-wine); }
.ai-capability-item.active {
  background: linear-gradient(135deg, #ff4167, var(--gl-wine) 60%, #c20f36);
  border-color: rgba(255, 255, 255, .4);
  color: #fff;
}
.ai-capability-item.active b, .ai-capability-item.active small, .ai-capability-item.active em { color: #fff; }
.ai-capability-group-title { color: var(--gl-wine); }
.expense-summary-cell.main { background: linear-gradient(150deg, #ff4d6d, #b00d31) !important; }
.ai-employee-icon { background: linear-gradient(135deg, #ff4167, #d1113c); color: #fff; }

/* ==========================================================================
   11. 外壳零碎：导航收起按钮 / 空态 / 分区标题
        统一到同一套玻璃语言，避免外壳上还留深色小零件。
   ========================================================================== */
#nav-collapse-toggle {
  border: 1px solid rgba(255, 255, 255, .8);
  background: var(--gl-sheen-2);
  backdrop-filter: var(--gl-blur-soft);
  -webkit-backdrop-filter: var(--gl-blur-soft);
  color: var(--gl-wine);
  box-shadow: var(--gl-shadow-2), var(--gl-bevel-2);
}
#nav-collapse-toggle:hover { background: #fff; color: var(--gl-wine-deep); }
.empty { color: var(--gl-muted); }
.section-head h2, .panel h2 { letter-spacing: .2px; }
/* 表格里的工具条按钮也补一点“可点”的层次 */
.toolbar button:active, .section-head button:active, .header-actions button:active { transform: translateY(1px); box-shadow: none; }

/* ==========================================================================
   12. 客户总控外壳对齐：原本是深酒红顶栏 + 暖米底，改成明亮玻璃，
        让这个最高频的页面和全站同一套层次语言。
   ========================================================================== */
.customer-console-page .cc-shell-standalone {
  background: transparent !important;
}
.customer-console-page .cc-topbar {
  background: var(--gl-sheen-2) !important;
  border: 1px solid rgba(255, 255, 255, .85) !important;
  border-left: 2px solid var(--gl-wine) !important;
  /* 客户总控顶栏跟客户总控自己的 10px 圆角对齐（原来借用了全局大圆角 20px，和其它面板不一致）。 */
  border-radius: 10px !important;
  box-shadow: var(--gl-shadow-2), var(--gl-bevel-2) !important;
}
.customer-console-page .cc-title h2 { color: var(--gl-ink) !important; text-shadow: none !important; }
.customer-console-page .cc-title span { color: var(--gl-muted) !important; }
.customer-console-page .cc-top-actions button {
  color: var(--gl-ink-2) !important;
  border-color: rgba(15, 22, 34, .12) !important;
  background: rgba(255, 255, 255, .74) !important;
  box-shadow: 0 1px 2px rgba(15, 22, 34, .04) !important;
}
.customer-console-page .cc-top-actions button:hover {
  border-color: rgba(224, 18, 63, .32) !important;
  background: #fff !important;
  color: var(--gl-wine) !important;
}
.customer-console-page .cc-top-actions button.primary {
  border-color: transparent !important;
  background: linear-gradient(135deg, #ff4167, var(--gl-wine) 60%, #c20f36) !important;
  color: #fff !important;
  box-shadow: 0 8px 18px rgba(224, 18, 63, .26) !important;
}
.customer-console-page .cc-command-bar {
  background: var(--gl-sheen-1) !important;
  border: 1px solid rgba(255, 255, 255, .8) !important;
  border-radius: var(--gl-radius-lg) !important;
  box-shadow: var(--gl-shadow-1), var(--gl-bevel-1) !important;
}

/* 2026-10-18 performance sheet compact headers, loaded after extra.css theme. */
main .performance-sheet thead th{height:28px!important;min-height:0!important;padding:2px 3px!important;border-width:1px!important;border-radius:5px!important;font-size:0!important;line-height:1!important;white-space:nowrap!important;overflow:visible!important}
main .performance-sheet thead th .raw-filterable-header{justify-content:center!important;gap:2px!important;white-space:nowrap!important}
main .performance-sheet thead th .raw-filterable-header>span:first-child,
main .performance-sheet thead th .excel-date-filter summary>b,
main .performance-sheet thead th .excel-date-filter summary>span{position:absolute;left:3px;top:calc(100% + 2px);z-index:60;display:none;max-width:220px;padding:4px 7px;border:1px solid #decfba;border-radius:6px;background:#fffdf8;color:#432d23!important;box-shadow:0 6px 18px rgba(62,34,24,.22);font-size:11px!important;line-height:1.35;white-space:nowrap}
main .performance-sheet thead th:hover .raw-filterable-header>span:first-child,
main .performance-sheet thead th:focus-within .raw-filterable-header>span:first-child,
main .performance-sheet thead th:hover .excel-date-filter summary>b,
main .performance-sheet thead th:focus-within .excel-date-filter summary>b,
main .performance-sheet thead th:hover .excel-date-filter summary>span,
main .performance-sheet thead th:focus-within .excel-date-filter summary>span{display:block}
main .performance-sheet thead .raw-header-filter{flex:0 0 18px!important;width:18px!important;height:18px!important;min-width:18px!important;padding:0!important;font-size:10px!important;opacity:1!important}
main .performance-sheet thead .excel-date-filter summary{min-height:20px;display:flex;align-items:center;justify-content:center;cursor:pointer}