/* ============================================================================
 * ClickSplice — UI Consistency Layer  (2026-09-22)
 * ----------------------------------------------------------------------------
 * 纯 CSS 覆盖层，叠加在 apple-theme 之后加载。不触碰任何 TSX / 路由 / 接口 /
 * 业务逻辑，所以追踪器功能 100% 保留，回滚＝删掉一行 <link>。
 *
 * 本层做四件事：
 *   1) 按钮统一      —— 一套令牌统一圆角/高度/字号/间距/反馈，用颜色区分主次
 *   2) 页面平铺      —— 去掉左右留白与宽度上限，工作区贴到浏览器边沿
 *   3) 移除模糊遮罩  —— 弹窗背景不再 backdrop-filter 模糊
 *   4) 子弹窗层级    —— 修复 Create Lander / Create Offer 被父弹窗盖住
 *
 * ⚠️ 选择器安全原则（血泪教训，见 apple-theme 9.6）：
 *    绝不用 button[class*="outline"] 这种子串匹配 —— Tailwind 类名里必然含
 *    outline-none / text-primary / dark:border-input，会把所有按钮误伤成同一种。
 *    这里统一用 [class~="..."] 整词匹配、元素选择器、data-* 属性选择器。
 * ========================================================================== */

/* ==========================================================================
 * 0. 按钮令牌 —— 想整体换风格，只改这一块
 * ======================================================================== */
:root {
  --btn-r: 8px;            /* 统一圆角（改成 980px 即全站胶囊） */
  --btn-r-sm: 6px;
  --btn-h: 30px;           /* 标准高度 */
  --btn-h-sm: 26px;        /* 紧凑（导航 / 行内动作） */
  --btn-px: 11px;          /* 左右内边距 */
  --btn-px-sm: 8px;
  --btn-gap: 6px;
  --btn-fs: 12.5px;
  --btn-fs-sm: 12px;
  --btn-fw: 500;

  /* 中性（次级） */
  --btn-face: #ffffff;
  --btn-face-hover: var(--a-gray6, #f2f2f7);
  --btn-face-active: var(--a-gray5, #e5e5ea);
  --btn-ink: var(--foreground, #1d1d1f);
  --btn-line: rgba(0, 0, 0, 0.1);

  /* 主色 */
  --btn-solid: var(--a-blue-web, #0071e3);
  --btn-solid-hover: var(--a-blue-hover, #0077ed);
  --btn-solid-active: #006edb;
  --btn-solid-ink: #ffffff;

  /* 危险 */
  --btn-danger: var(--a-red, #ff3b30);
  --btn-danger-soft: rgba(255, 59, 48, 0.1);
  --btn-danger-line: rgba(255, 59, 48, 0.32);

  /* 透明（弱操作） */
  --btn-quiet-hover: rgba(0, 0, 0, 0.05);
  --btn-quiet-active: rgba(0, 0, 0, 0.08);

  --btn-disabled-op: 0.42;
  --btn-ease: cubic-bezier(0.4, 0, 0.2, 1);
}
.dark {
  --btn-face: #1c1c1e;
  --btn-face-hover: #2c2c2e;
  --btn-face-active: #3a3a3c;
  --btn-ink: #f5f5f7;
  --btn-line: rgba(84, 84, 88, 0.6);

  --btn-solid: #0a84ff;
  --btn-solid-hover: #3d9bff;
  --btn-solid-active: #0a6ed4;

  --btn-danger: #ff453a;
  --btn-danger-soft: rgba(255, 69, 58, 0.16);
  --btn-danger-line: rgba(255, 69, 58, 0.45);

  --btn-quiet-hover: rgba(255, 255, 255, 0.08);
  --btn-quiet-active: rgba(255, 255, 255, 0.14);
}

/* ==========================================================================
 * 1. 按钮 —— 统一形态
 *    「统一」＝同一套圆角 / 高度 / 字号 / 内边距 / 反馈曲线，
 *    再靠颜色区分 primary / default / danger / quiet 四种角色。
 * ======================================================================== */

/* ---- 1.0 收尾：圆角只允许两种 —— 标准 8px / 紧凑 6px ----
 *    实测线上还残存 980px 胶囊、7px、4px、0px 四种，
 *    来自各页面自己写的 component class（.is-active / .is-danger /
 *    .maxconv-inline-edit / 设置页 tab / 语言切换 …）。
 *    这里统一收口，只保留两套：常规控件 8px，紧凑控件 6px。
 *
 *    ⚠️ 选择器为什么要写得这么丑 —— 特异性军备竞赛：
 *    apple-theme 里有两条同样带 !important 的胶囊规则：
 *      button[class~="bg-primary"] …                        (0,1,1)
 *      button[class~="border"][class~="bg-transparent"] …   (0,2,1)
 *    朴素的 `html button`（0,0,2）就算带了 !important 也压不住它们。
 *    所以这里用一个**永不命中的 id 反选** `:not(#__unused)` 把特异性顶到
 *    id 级 —— 作者样式表里再没有别的东西能赢它。
 *    紧凑档各自写成 (1,1,3)（与常规档同分），靠"排在后面"取胜。 */
html body button[class]:not(#__unused),
html body button:not([class]):not(#__unused),
html body input[type="button"]:not(#__unused),
html body input[type="submit"]:not(#__unused),
html body a[role="button"]:not(#__unused) {
  border-radius: var(--btn-r) !important;
}
html body button.maxconv-nav-item:not(#__unused),
html body button.maxconv-th-sort:not(#__unused),
html body button.maxconv-th-filter:not(#__unused),
html body button.maxconv-datetime-seg:not(#__unused),
html body button.icon-btn:not(#__unused),
html body button.link-action:not(#__unused) {
  border-radius: var(--btn-r-sm) !important;
}

/* ---- 1.1 通用骨架：尺寸、字体、反馈 ---- */
.maxconv-tool-btn,
.maxconv-create-btn,
[data-slot="button"],
button.geo-selector-trigger,
button.link-action,
button.icon-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: var(--btn-gap) !important;
  min-height: var(--btn-h) !important;
  padding: 0 var(--btn-px) !important;
  border-radius: var(--btn-r) !important;
  font-family: inherit !important;
  font-size: var(--btn-fs) !important;
  font-weight: var(--btn-fw) !important;
  line-height: 1 !important;
  letter-spacing: -0.01em;
  white-space: nowrap;
  text-decoration: none;
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
  transition:
    background-color 0.14s var(--btn-ease),
    border-color 0.14s var(--btn-ease),
    color 0.14s var(--btn-ease),
    box-shadow 0.14s var(--btn-ease),
    opacity 0.14s var(--btn-ease) !important;
}
.maxconv-tool-btn > svg,
.maxconv-create-btn > svg,
[data-slot="button"] > svg,
button.link-action > svg,
button.icon-btn > svg {
  flex: 0 0 auto;
  width: 14px;
  height: 14px;
}

/* 方形图标按钮：保持正方形，别被拉成胶囊 */
button.icon-btn {
  width: var(--btn-h-sm) !important;
  height: var(--btn-h-sm) !important;
  min-height: var(--btn-h-sm) !important;
  padding: 0 !important;
  border-radius: var(--btn-r-sm) !important;
}

/* ---- 1.2 default：白面 + 发丝描边（工具栏主力） ---- */
.maxconv-tool-btn,
button.geo-selector-trigger,
[data-slot="button"] {
  background: var(--btn-face) !important;
  color: var(--btn-ink) !important;
  border: 1px solid var(--btn-line) !important;
  box-shadow: var(--a-shadow-1, 0 1px 2px rgba(0, 0, 0, 0.04)) !important;
}
.maxconv-tool-btn:hover:not(:disabled),
button.geo-selector-trigger:hover:not(:disabled),
[data-slot="button"]:hover:not(:disabled) {
  background: var(--btn-face-hover) !important;
}
.maxconv-tool-btn:active:not(:disabled),
button.geo-selector-trigger:active:not(:disabled),
[data-slot="button"]:active:not(:disabled) {
  background: var(--btn-face-active) !important;
}

/* ---- 1.3 primary：实色 —— 整词匹配，避免误伤 outline-none ---- */
.maxconv-create-btn,
[data-slot="button"][class~="bg-primary"],
button[class~="bg-primary"] {
  background: var(--btn-solid) !important;
  color: var(--btn-solid-ink) !important;
  border: 1px solid transparent !important;
  box-shadow: 0 1px 2px rgba(0, 113, 227, 0.24) !important;
}
.maxconv-create-btn:hover:not(:disabled),
[data-slot="button"][class~="bg-primary"]:hover:not(:disabled),
button[class~="bg-primary"]:hover:not(:disabled) {
  background: var(--btn-solid-hover) !important;
}
.maxconv-create-btn:active:not(:disabled),
[data-slot="button"][class~="bg-primary"]:active:not(:disabled),
button[class~="bg-primary"]:active:not(:disabled) {
  background: var(--btn-solid-active) !important;
}

/* ---- 1.4 danger ---- */
.maxconv-tool-btn.is-danger,
[data-slot="button"][class~="bg-destructive"],
button[class~="bg-destructive"] {
  background: var(--btn-face) !important;
  color: var(--btn-danger) !important;
  border: 1px solid var(--btn-danger-line) !important;
}
.maxconv-tool-btn.is-danger:hover:not(:disabled) {
  background: var(--btn-danger-soft) !important;
}
[data-slot="button"][class~="bg-destructive"]:hover:not(:disabled),
button[class~="bg-destructive"]:hover:not(:disabled) {
  background: var(--btn-danger) !important;
  color: #fff !important;
}

/* ---- 1.5 quiet：透明底的弱操作（+ Create Lander / 行内链接式按钮） ---- */
button.link-action,
button.icon-btn {
  background: transparent !important;
  border: 1px solid transparent !important;
  box-shadow: none !important;
  color: var(--a-blue, #007aff) !important;
  min-height: var(--btn-h-sm) !important;
  padding: 0 var(--btn-px-sm) !important;
  font-size: var(--btn-fs-sm) !important;
  border-radius: var(--btn-r-sm) !important;
}
button.link-action:hover:not(:disabled),
button.icon-btn:hover:not(:disabled) {
  background: var(--btn-quiet-hover) !important;
}
button.link-action:active:not(:disabled),
button.icon-btn:active:not(:disabled) {
  background: var(--btn-quiet-active) !important;
}
button.icon-btn {
  color: var(--muted-foreground, #6e6e73) !important;
}
button.icon-btn.is-danger {
  color: var(--btn-danger) !important;
}
button.icon-btn.is-danger:hover:not(:disabled) {
  background: var(--btn-danger-soft) !important;
}

/* ---- 1.6 选中态统一成「主色淡染」，不再各自为政 ---- */
.maxconv-tool-btn.is-active,
.maxconv-nav-item.is-active,
.maxconv-th-sort.is-sorted,
[data-slot="button"][data-active="true"],
[data-slot="button"][data-state="active"],
button[data-active="true"],
button[data-state="active"] {
  background: var(--accent, rgba(0, 122, 255, 0.08)) !important;
  color: var(--accent-foreground, #007aff) !important;
  border-color: transparent !important;
  font-weight: 600 !important;
}

/* ---- 1.7 焦点环 / 禁用态 ---- */
.maxconv-tool-btn:focus-visible,
.maxconv-create-btn:focus-visible,
[data-slot="button"]:focus-visible,
button.link-action:focus-visible,
button.icon-btn:focus-visible,
button.geo-selector-trigger:focus-visible {
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(0, 122, 255, 0.28) !important;
}
.maxconv-tool-btn:disabled,
.maxconv-create-btn:disabled,
[data-slot="button"]:disabled,
button.link-action:disabled,
button.icon-btn:disabled,
.maxconv-tool-btn[disabled],
[data-slot="button"][disabled],
button[aria-disabled="true"] {
  opacity: var(--btn-disabled-op) !important;
  cursor: not-allowed !important;
  box-shadow: none !important;
}

/* ---- 1.8 顶部导航：同为按钮，也要进同一家族（只是更紧凑） ---- */
.maxconv-nav-item {
  min-height: 24px !important;
  padding: 0 9px !important;
  border-radius: var(--btn-r-sm) !important;
  font-size: var(--btn-fs-sm) !important;
  font-weight: 500 !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  transition:
    background-color 0.14s var(--btn-ease),
    color 0.14s var(--btn-ease) !important;
}
.maxconv-nav-item:hover {
  background: var(--btn-quiet-hover) !important;
}
/* 顶栏里的每一个可点元素都进同一套度量（品牌、导航、More、头像…） */
.maxconv-topnav button,
.maxconv-topnav a[role="button"] {
  font-size: var(--btn-fs-sm) !important;
  font-weight: 500 !important;
  border-radius: var(--btn-r-sm) !important;
  transition:
    background-color 0.14s var(--btn-ease),
    color 0.14s var(--btn-ease) !important;
}

/* ---- 1.9 表头排序 / 日期段：给一点呼吸感，但保持轻量 ---- */
.maxconv-th-sort,
.maxconv-th-filter,
.maxconv-datetime-seg {
  border-radius: var(--btn-r-sm) !important;
  transition:
    background-color 0.14s var(--btn-ease),
    color 0.14s var(--btn-ease) !important;
}
.maxconv-th-sort:hover,
.maxconv-th-filter:hover,
.maxconv-datetime-seg:hover {
  background: var(--btn-quiet-hover) !important;
}

/* ---- 1.10 弹窗里的 Save / Cancel 也统一 ---- */
[data-slot="dialog-footer"] button,
.editor-shell [data-slot="dialog-footer"] button {
  min-height: var(--btn-h) !important;
  border-radius: var(--btn-r) !important;
  font-size: var(--btn-fs) !important;
}

/* ==========================================================================
 * 2. 页面平铺 —— 左右贴到浏览器边沿
 *
 *    实测（CDP 拉的是真实命中规则，不是猜的）留白来自四条规则：
 *      a) main, .main-content, [role="main"]
 *           padding-left/right: clamp(12px, 1.5vw, 20px) !important
 *      b) .app-frame :is(.dense-workbench-page, .campaign-ops-workspace,
 *                        .manager-main, .traffic-source-main, .logs-main,
 *                        .dashboard-page)
 *           padding-inline: var(--page-padding) !important      ← 16px
 *      c) .dense-workbench-page  padding: 0 16px 16px !important
 *      d) .entity-workspace / .files-workspace 各自的 padding
 *    全是 !important，所以这里也只能 !important，并用 html 前缀抬特异性。
 *    顺便把 .app-frame 的 width:100vw 换成 100% —— 100vw 含滚动条，
 *    会让右边缘被裁掉约 15px。
 * ======================================================================== */
html,
html body {
  max-width: none !important;
  --page-padding: 0px !important;
}
html .app-frame {
  --page-padding: 0px !important;
  width: 100% !important;
  max-width: none !important;
}
html main,
html .main-content,
html [role="main"],
html .app-frame .dense-workbench-page,
html .app-frame .campaign-ops-workspace,
html .app-frame .manager-main,
html .app-frame .traffic-source-main,
html .app-frame .logs-main,
html .app-frame .dashboard-page,
html .app-frame .entity-workspace,
html .app-frame .files-workspace,
html .app-frame .settings-workspace,
html .app-frame :is(.dense-workbench-page, .campaign-ops-workspace, .manager-main, .traffic-source-main, .logs-main, .dashboard-page, .entity-workspace, .files-workspace, .settings-workspace) {
  padding-left: 0 !important;
  padding-right: 0 !important;
  padding-inline: 0 !important;
  max-width: none !important;
  width: 100% !important;
}

/* ==========================================================================
 * 3. 弹窗 —— 去掉背景模糊遮罩
 *    apple-theme 里给 body 直属的 overlay 加了 saturate(180%) blur(12px)。
 *    这里用更高特异性（多一个 html 祖先）把它覆盖掉，只保留一层轻暗。
 *    想要完全无遮罩：把下面 background 改成 transparent。
 * ======================================================================== */
html body > div[data-state="open"]:not([role]):not([data-radix-popper-content-wrapper]) {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  background: rgba(0, 0, 0, 0.18) !important;
}
html.dark body > div[data-state="open"]:not([role]):not([data-radix-popper-content-wrapper]) {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  background: rgba(0, 0, 0, 0.5) !important;
}
/* 面板自身也不许再毛玻璃 */
[role="dialog"],
[role="alertdialog"] {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* ==========================================================================
 * 4. 子弹窗层级 —— 修复 "+ Create Lander" / "+ Create Offer" 点了没反应
 *
 * 根因：Create Campaign 编辑器是 z-index 60 的全屏面板；
 *       它里面再弹出的 Create Lander / Create Offer 用的是 Radix 默认的
 *       z-50 —— 于是子弹窗被自己的父弹窗完全盖住，
 *       elementFromPoint 打下去命中的是父面板，看起来就是"点了没反应"。
 *
 * 修法：所有 portal 出来的层都是 body 的直接子元素，
 *       按 DOM 顺序给"第二层及以上"整体抬升：
 *         父面板 60  <  子遮罩 79  <  子弹窗 80
 *       这样既不改第一层弹窗的任何行为，又能无限层叠。
 * ======================================================================== */
html body > div[data-state="open"]:not([role]):not([data-radix-popper-content-wrapper])
  ~ div[data-state="open"]:not([role]):not([data-radix-popper-content-wrapper]) {
  z-index: 79 !important;
}
html body > [role="dialog"] ~ [role="dialog"],
html body > [role="dialog"] ~ [role="alertdialog"] {
  z-index: 80 !important;
}
/* 三层以上继续抬 */
html body > [role="dialog"] ~ [role="dialog"] ~ [role="dialog"] {
  z-index: 90 !important;
}
html body > div[data-state="open"]:not([role]):not([data-radix-popper-content-wrapper])
  ~ div[data-state="open"]:not([role]):not([data-radix-popper-content-wrapper])
  ~ div[data-state="open"]:not([role]):not([data-radix-popper-content-wrapper]) {
  z-index: 89 !important;
}

/* ==========================================================================
 * 5. 子弹窗外观对齐 —— 让它和 Landers/Offers 页面的「Create Lander / Create Offer」
 *    长得一样
 *
 *    实测两个弹窗的差异：
 *      · 独立版  宽 820  圆角 12px  padding 0    按钮 Cancel / Save
 *      · 嵌套版  宽 1024 圆角 18px  padding 14px 按钮 Cancel / Save / Close
 *    这里把嵌套版的外壳收敛到独立版的尺寸，并去掉多余的 Close
 *    （Cancel 已经能关，两个关闭按钮是重复的）。
 *
 *    ⚠️ 字段集（Tags、{click_id} 宏 chip、Offer 的 payout 区块）是组件级差异，
 *       CSS 加不出来，需要改源码才能完全一致。
 * ======================================================================== */
html body > [role="dialog"] ~ [role="dialog"] {
  width: 50rem !important;          /* = 800px，与独立版实测宽度一致 */
  max-width: calc(100vw - 2rem) !important;
  border-radius: 12px !important;
  padding: 0 !important;
}
/* 独立版没有右上角的 X（只有 Cancel / Save），嵌套版多一个 —— 对齐掉 */
html body > [role="dialog"] ~ [role="dialog"] > button[data-slot="dialog-close"] {
  display: none !important;
}

/* ==========================================================================
 * 6. 顶部导航收紧
 *    上一轮我把导航项内边距从 5px 提到 9px，结果整条顶栏变松了。
 *    这里收到 5px，并把导航容器自身的列间距归零。
 * ======================================================================== */
html .maxconv-topnav {
  column-gap: 0 !important;
  row-gap: 0 !important;
  padding-left: 6px !important;
  padding-right: 6px !important;
}
html body button.maxconv-nav-item:not(#__unused) {
  padding-left: 5px !important;
  padding-right: 5px !important;
  min-height: 22px !important;
}

/* ==========================================================================
 * 7. 右侧 30px 空白 —— "左边贴了，右边没贴"的真凶
 *
 *    html 和 body 各自写了
 *        overflow-y: scroll;  scrollbar-gutter: stable;
 *    两个都**常驻**预留滚动条槽，于是右边一共被吃掉 30px（实测像素：左 0 / 右 30）。
 *    去掉 body 那份 → 剩 15px；两份都去掉 → 0px。
 *
 *    为什么这里用"把滚动条宽度设成 0"而不是改 overflow：
 *      · 这两条属性在作者样式表里都带 !important 且选择器权重更高，
 *        内联非 important 都压不过，改了也白发；
 *      · 真把 overflow-y 改成 auto/important 又会顶掉弹窗的 scroll-lock，
 *        弹窗打开时背景能滚。
 *    所以只把 html / body 这两层滚动条的宽度归零（滚动照样能用），
 *    页面内部的滚动容器（表格等）不受影响，仍然有可见滚动条。
 * ======================================================================== */
html::-webkit-scrollbar,
html body::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
}
html,
html body {
  scrollbar-width: none !important;   /* Firefox */
}

/* ==========================================================================
 * 8. 日期范围弹层（Date Range / Timezone）—— 2026-09-22 第二轮补充
 *
 *    组件：client/src/components/tracker/DateTimeRangeControl.tsx
 *    两个毛病都是覆盖层自己"用力过猛"造成的，不是应用 bug：
 *
 *    8.1 顶部两个标签挤成一团
 *        apple-theme 8.6 用一条全局 [role="tablist"] 把**任何** tablist 都改造
 *        成 iOS 分段控件，且 display:inline-flex 没加 !important（靠加载顺序
 *        赢过组件的 display:flex）。这组件的 tablist 本该是整宽标签条，被这么
 *        一改就收缩到内容宽度 —— 实测 164.5px / 弹层 320px，两个标签各剩 79px，
 *        连 "Date Range" 都放不下，直接换行。
 *        → 只在这一个组件内还原成整宽标签条，其余页面 tablist 不受影响。
 *
 *    8.2 日历里看不出选了哪几天
 *        日期格是 shadcn 的 [data-slot="button"]，被 cs-ux 1.1 / 1.2 当成普通
 *        按钮刷成「白面 + 发丝描边 + 投影」；而 react-day-picker 的区间高亮走
 *        Tailwind 的 data-[range-start=true]:bg-primary（**没有** !important），
 *        正好被那几条 !important 压掉。结果整个日历是一格一格的白卡片，选中的
 *        区间完全不可见。
 *        → 先把日期格还原成无底色的 ghost 单元，再用 data-range-* 把
 *          「起点 / 区间 / 终点」画成一条连续色带。
 *
 *    ⚠️ 这里大量使用 :not(#__csdr) 这个永不命中的 id 反选，只为抬特异性。
 *       因为 cs-ux 自己的收尾规则
 *           html body button[class]:not(#__unused) { border-radius: … !important }
 *       权重是 (1,2,3)，比它低的规则哪怕写了 !important 也照样输。
 *       （同 apple-theme 9.6 的教训：特异性军备竞赛只能靠 id 反选破解。）
 * ======================================================================== */

/* ---- 8.1 标签页：撑满整宽 / 文字不换行 / 下划线式指示 ---- */

/* 标签条的底色要分主题：浅色用比弹层深一档的 --muted，
   暗色的 --muted 和弹层同色（都是 #2c2c2e），用了就分不出条与面板，
   所以暗色改成用 --card（#1c1c1e）压深一档，选中项用 --popover 提亮。 */
:root {
  --csdr-tabstrip-bg: var(--muted);
  --csdr-tab-active-bg: var(--card);
}
.dark {
  --csdr-tabstrip-bg: var(--card);
  --csdr-tab-active-bg: var(--popover);
}

/* 容器：apple-theme 的分段控件外壳（inline-flex + 2px padding + 灰圆角块）
   在这里换回"整宽标签条"。 */
.maxconv-datetime-popover .maxconv-datetime-tabs[role="tablist"] {
  display: flex !important;
  align-items: stretch !important;
  width: 100% !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--border) !important;
  border-radius: 0 !important;
  background: var(--csdr-tabstrip-bg) !important;
  box-shadow: none !important;
}

/* 两个标签等分整宽；图标与文字同排，禁止换行。 */
.maxconv-datetime-popover .maxconv-datetime-tabs button[role="tab"]:not(#__csdr) {
  flex: 1 1 0 !important;
  width: auto !important;
  min-width: 0 !important;
  height: 40px !important;
  min-height: 0 !important;
  padding: 0 10px !important;
  gap: 7px !important;
  justify-content: center !important;
  border: 0 !important;
  border-bottom: 2px solid transparent !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--muted-foreground) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  white-space: nowrap !important;
  transition:
    color 0.14s var(--btn-ease, ease),
    background-color 0.14s var(--btn-ease, ease) !important;
}

.maxconv-datetime-popover .maxconv-datetime-tabs button[role="tab"]:hover:not(.is-active):not(#__csdr) {
  background: color-mix(in srgb, var(--csdr-tab-active-bg) 60%, transparent) !important;
  color: var(--foreground) !important;
}

.maxconv-datetime-popover .maxconv-datetime-tabs button[role="tab"].is-active:not(#__csdr) {
  color: var(--foreground) !important;
  background: var(--csdr-tab-active-bg) !important;
  border-bottom-color: var(--primary) !important;
  box-shadow: none !important;
}

/* ---- 8.2 日历：日期格回到 ghost 形态 ---- */

.maxconv-datetime-popover .maxconv-datetime-calendar button[data-day]:not(#__csdr) {
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--foreground) !important;
  padding: 0 !important;
  gap: 0 !important;
  min-height: 0 !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
}

/* 星期表头 */
.maxconv-datetime-popover .maxconv-datetime-calendar .rdp-weekday {
  color: var(--muted-foreground) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
}

/* 暗色下有一条
       .dark tbody tr { background-color: var(--surface) !important }
   是给数据表做行底色的，可日历也是 <table> —— 于是"每周"都被刷成一条横带。
   浅色没有这条规则，所以只有暗色会花。这里让日历的行让位。 */
.dark .maxconv-datetime-popover .maxconv-datetime-calendar tbody tr:not(#__csdr) {
  background: transparent !important;
}

/* 非本月 / 不可选：用 opacity 弱化而不是 color-mix，
   因为暗色下 --muted-foreground 本身已经是 60% 透明，再乘一次就看不见了。 */
.maxconv-datetime-popover .maxconv-datetime-calendar .rdp-outside > button:not(#__csdr),
.maxconv-datetime-popover .maxconv-datetime-calendar .rdp-disabled > button:not(#__csdr) {
  color: var(--muted-foreground) !important;
  opacity: 0.45 !important;
}

/* hover 反馈只给"未选中"的日期，避免和区间色打架 */
.maxconv-datetime-popover .maxconv-datetime-calendar button[data-day]:hover:not(:disabled):not([data-range-start="true"]):not([data-range-end="true"]):not([data-range-middle="true"]):not(#__csdr) {
  background: var(--muted) !important;
  color: var(--foreground) !important;
}

/* 今天：一圈描边即可，不必整块灰底（否则和区间色抢视觉） */
.maxconv-datetime-popover .maxconv-datetime-calendar td.rdp-today {
  background: transparent !important;
}
.maxconv-datetime-popover .maxconv-datetime-calendar td.rdp-today > button[data-day]:not([data-range-start="true"]):not([data-range-end="true"]):not(#__csdr) {
  color: var(--primary) !important;
  font-weight: 600 !important;
  box-shadow: inset 0 0 0 1.5px color-mix(in srgb, var(--primary) 45%, transparent) !important;
}

/* ---- 8.3 选中区间：画成一条连续色带 ---- */

/* 色带中间段的底色 / 字色单独提成令牌，因为要过对比度：
   浅色下 #d6e8fb 底 + #0071e3 字只有 3.5:1，12.5px 小字不达标（AA 要 4.5:1）。 */
:root {
  --csdr-band-bg: color-mix(in srgb, var(--primary) 18%, var(--card));
  --csdr-band-ink: color-mix(in srgb, var(--primary) 72%, var(--foreground));
}
.dark {
  --csdr-band-bg: color-mix(in srgb, var(--primary) 30%, var(--card));
  --csdr-band-ink: color-mix(in srgb, var(--primary) 55%, #ffffff);
}

/* td 自带 bg-accent（calendar.tsx 给 range_start / range_end 的 classNames），
   方格底会从按钮的圆角外侧露出来，这里统一让位。 */
.maxconv-datetime-popover .maxconv-datetime-calendar td.rdp-range_start,
.maxconv-datetime-popover .maxconv-datetime-calendar td.rdp-range_middle,
.maxconv-datetime-popover .maxconv-datetime-calendar td.rdp-range_end {
  background: transparent !important;
}

/* 区间中间：主色淡染，且左右不圆角 —— 相邻格子接成一条带 */
.maxconv-datetime-popover .maxconv-datetime-calendar button[data-range-middle="true"]:not(#__csdr) {
  background: var(--csdr-band-bg) !important;
  color: var(--csdr-band-ink) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-weight: 600 !important;
}

/* 起点 / 终点：实心主色 */
.maxconv-datetime-popover .maxconv-datetime-calendar button[data-range-start="true"]:not(#__csdr),
.maxconv-datetime-popover .maxconv-datetime-calendar button[data-range-end="true"]:not(#__csdr) {
  background: var(--primary) !important;
  color: var(--primary-foreground) !important;
  box-shadow: none !important;
  font-weight: 600 !important;
}

/* 端点圆角：单日两侧都圆；跨天时只圆朝外那一侧 */
.maxconv-datetime-popover .maxconv-datetime-calendar button[data-range-start="true"][data-range-end="true"]:not(#__csdr) {
  border-radius: 8px !important;
}
.maxconv-datetime-popover .maxconv-datetime-calendar button[data-range-start="true"]:not([data-range-end="true"]):not(#__csdr) {
  border-radius: 8px 0 0 8px !important;
}
.maxconv-datetime-popover .maxconv-datetime-calendar button[data-range-end="true"]:not([data-range-start="true"]):not(#__csdr) {
  border-radius: 0 8px 8px 0 !important;
}

/* ---- 8.4 底部：补一个"N 天"读数（内容由 cs-ux.js 写到 data-csdr-days） ---- */
.maxconv-datetime-footer::before {
  content: attr(data-csdr-days);
  margin-right: auto;
  align-self: center;
  padding-left: 2px;
  color: var(--muted-foreground);
  font-size: 11px;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
}

/* ==========================================================================
 * 9. Dashboard 复查修正（2026-09-22 第三轮）
 *
 *    这一轮先做了体检，结论都来自实测而不是观感（视口 1088 与 1512 各测一遍）：
 *
 *    9.1 白底面板左右贴死视口，描边和圆角被裁
 *        应用自己给 main 写了 padding-inline: clamp(12px,1.5vw,20px)，
 *        本层第 2 节为了「页面平铺」把它归零了。对表格类页面（整行贴边）没问题，
 *        但 Dashboard 是一整页卡片：实测 .overview-panel / .dash-chart-card /
 *        .performer-list 的 box 都是 x=0 / right=视口宽，14px 圆角和 1px 描边
 *        正好压在视口边缘上，看起来像被裁掉。
 *        → 只把 Dashboard 的内边距要回来，表格类页面保持贴边不变。
 *
 *    9.2 指标卡的数值和标签不在同一条左边线上
 *        apple-theme 的注释写着「标签与数值共用一个起始边」，但数值上有应用留下的
 *        padding: 8px 9px 9px —— 实测字形 x：标签 41px、数值 35px，差了 6px。
 *        同一个 padding 还让卡片虚高：卡高 90.2px，内容只有约 58px，底部一片死白。
 *        把 padding 归零，两个毛病一起消掉（卡高回落到 ~71px）。
 *
 *    9.3 图表 tooltip 比图表本身还高 90px
 *        12 条序列 → 13 行 → wrapper 实测 h=344.1px，而 .dash-chart-wrap 只有
 *        260px，于是 tooltip 往下压住图例、再溢出到 Performers 区。
 *        改成两列网格（6 行，约 173px），回到图表内部；顺便把层级提到图例之上。
 *
 *    9.4 图例 12 个 chip 全被刷成蓝底蓝字
 *        12 条序列默认全部开启 → 12 个 .is-active → 12 个同一块蓝色，
 *        连成一条横带。真正带颜色语义的是每个 chip 里的色点，却被蓝底淹没。
 *        → 开启＝中性（白底 + 发丝描边 + 深字），关闭＝淡出。
 *          颜色只留给色点，和卡片、tooltip 里的色点也就能对上号了。
 * ======================================================================== */

/* ---- 9.1 给 Dashboard 要回左右内边距 ---- */
:root {
  --csdb-gutter: clamp(12px, 1.4vw, 18px);
}
html .app-frame main.traditional-dashboard-page {
  padding-left: var(--csdb-gutter) !important;
  padding-right: var(--csdb-gutter) !important;
}

/* ---- 9.2 指标卡：数值归位到「标签文字的左边线」 ----
   实测字形 x：标签 41px、数值 35px。归零 padding 只能让数值退到色点那条线（26px），
   仍然和标签文字差 15px。A/B 各渲染一张 3x 放大图对比后选了对齐标签文字 ——
   数字和「VISITS」的 V 共用一条竖线，视线不用往回跳。
   缩进不是写死的 15px，而是由色点尺寸 + 间距算出来：将来改色点大小，
   数值会跟着走，不会又错位。 */
:root {
  --csdb-dot: 8px;
  --csdb-dot-gap: 7px;
}
.traditional-dashboard-page .metric-card-label {
  gap: var(--csdb-dot-gap) !important;
}
.traditional-dashboard-page .metric-card-label::before {
  width: var(--csdb-dot) !important;
  height: var(--csdb-dot) !important;
}
.traditional-dashboard-page .metric-card-value {
  padding-top: 0 !important;
  padding-right: 0 !important;
  padding-bottom: 0 !important;
  padding-left: calc(var(--csdb-dot) + var(--csdb-dot-gap)) !important;
  margin-top: 3px !important;
  margin-bottom: 0 !important;
}

/* ---- 9.3 tooltip：收进图表内 + 抬到图例之上 ---- */
.recharts-tooltip-wrapper {
  z-index: 40 !important;
}
.recharts-default-tooltip {
  min-width: 280px !important;
  max-width: min(420px, 80vw) !important;
}
.recharts-tooltip-item-list {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  column-gap: 14px !important;
  margin: 0 !important;
  padding: 0 !important;
}
.recharts-tooltip-item {
  padding-top: 2px !important;
  padding-bottom: 2px !important;
  list-style: none !important;
}

/* ---- 9.4 图例：颜色只交给色点 ---- */
.dash-chart-legend button {
  background: var(--card) !important;
  color: var(--text-secondary) !important;
  box-shadow: inset 0 0 0 1px var(--border) !important;
}
.dark .dash-chart-legend button {
  background: var(--card) !important;
}
.dash-chart-legend button:hover {
  background: var(--muted) !important;
}
.dash-chart-legend button.is-active {
  background: var(--card) !important;
  color: var(--text-primary) !important;
  box-shadow: inset 0 0 0 1px var(--border) !important;
}
.dash-chart-legend button:not(.is-active) {
  opacity: 0.45;
}

/* ==========================================================================
 * 10. 表格面板撑满主内容区（2026-09-23）
 *
 *    体检发现：.maxconv-datatable 的基础样式里根本没有 flex（默认 0 1 auto，
 *    即不伸展），面板高度只由内容决定，主内容区剩下的部分全部留白。
 *    实测（视口 1512x950，主内容区 916px）：
 *      空状态     面板 357px → 底部空 503px（is-empty 钉了 --empty-table-shell-height）
 *      3 行数据   面板 159px → 底部空 701px
 *      20 行数据  面板 669px → 底部空 191px
 *    撑满后：面板 844px、底部空 16px，表格可见区 322px → 809px
 *    （有数据时一屏能看到的行数约为原来的 2.5 倍。）
 *
 *    三个约束缺一个都会回归，都是实测出来的：
 *      · .maxconv-datatable-scroll 也必须伸展 —— 否则多出来的高度留在 section
 *        内部、表格上下，看着还是"空一块"（实测只改 section 时 body 区仍是 322px）。
 *      · .maxconv-body-scroll 也要伸展且 min-height:0 —— 表格数据区才真正变高；
 *        min-height:0 是 flex 子项能被收缩的必要条件。
 *      · 报告表（.maxconv-datatable.is-sticky-identity）必须保持它自己的
 *        flex: 1 0 auto —— campaign-report.css 写明了理由：纯 flex:1 会被压到
 *        剩余高度，行数多时表格会溢出到 Totals 条下面。这里显式放回来，不覆盖。
 *
 *    选择器用 id 级反选 :not(#__csdr) 顶权重（本层惯用手法），
 *    免得将来哪层加一条 !important 就把这里顶掉。
 * ========================================================================== */
html body .app-frame .maxconv-datatable:not(#__csdr) {
  flex: 1 1 auto !important;
  min-height: 0 !important;
}
html body .app-frame .maxconv-datatable:not(#__csdr) .maxconv-datatable-scroll {
  flex: 1 1 auto !important;
  min-height: 0 !important;
}
html body .app-frame .maxconv-datatable:not(#__csdr) .maxconv-body-scroll {
  flex: 1 1 auto !important;
  min-height: 0 !important;
}

/* 空状态：原来给自己钉了固定高度，撑满后要放开，
   否则空表格的页面照旧在下面留 500px 空白。 */
html body .app-frame .maxconv-datatable.is-empty:not(#__csdr),
html body .app-frame .maxconv-datatable.is-empty:not(#__csdr) .maxconv-datatable-scroll {
  flex: 1 1 auto !important;
  min-height: 0 !important;
}
html body .app-frame .maxconv-datatable.is-empty:not(#__csdr) .maxconv-datatable-scroll {
  height: auto !important;
}
/* 空状态提示自身也钉了固定高度，要跟着面板一起放开，否则会贴在上半部分
   （面板 844px、提示块仍按 323px 算，视觉上重心偏上）。 */
html body .app-frame .maxconv-datatable.is-empty:not(#__csdr) .empty-table-state-overlay {
  height: auto !important;
  top: var(--table-header-height) !important;
  bottom: 0 !important;
}

/* 报告表例外：恢复 campaign-report.css 的 1 0 auto（Totals 条不被行压过） */
html body .app-frame .maxconv-datatable.is-sticky-identity:not(#__csdr) .maxconv-body-scroll {
  flex: 1 0 auto !important;
}

/* ---- 10.2 /logs-errors ----
 * 这一页的 main（main.manager-main.logs-main）是 display:block，不是 flex，
 * 所以给它子元素写 flex 完全没用（实测改成 1 1 auto 后卡片仍是 228px）。
 * 只能反过来给卡片一个撑满视口的最小高度，再把卡片内部变成 flex 列，
 * 让工具栏定高、空状态块吃掉剩余空间。
 *   58px = 顶栏 34 + main 上留白 12 + 底部留白 12（实测 card top=46，
 *   要让卡片底部停在视口下方 12px 处）。
 * 实测效果：底部空白 676px → 12px。有日志时表格容器同样受益
 * （用 [class*="table-wrap"] 兜住具体类名变化）。 */
html body .app-frame main.logs-main > .logs-card:not(#__csdr) {
  display: flex !important;
  flex-direction: column !important;
  min-height: calc(100vh - 58px) !important;
}
html body .app-frame main.logs-main > .logs-card:not(#__csdr) > .logs-toolbar {
  flex: 0 0 auto !important;
}
html body .app-frame main.logs-main > .logs-card:not(#__csdr) > .logs-empty,
html body .app-frame main.logs-main > .logs-card:not(#__csdr) > [class*="table-wrap"] {
  flex: 1 1 auto !important;
  min-height: 0 !important;
}

/* ---- 10.3 /bw-lists ----
 * 结构是「规则表卡片 + 全局恢复设置卡片」，两块都要留在页面上，所以让
 * 上面的表格容器伸展、设置卡片保持自然高度贴在底部。
 *   实测：底部空白 259px → 16px。
 * 注意网格里的卡片本身是 display:block，表格包裹层不会跟着长高，
 * 得把卡片也改成 flex 列，包裹层才能真正吃掉多出来的高度
 * （实测只改 grid 时，多出来的高度全留在卡片内部）。 */
html body .app-frame main.bw-lists-workspace > .bw-workspace-grid:not(#__csdr) {
  flex: 1 1 auto !important;
  min-height: 0 !important;
}
html body .app-frame main.bw-lists-workspace > .bw-workspace-grid:not(#__csdr) > .bw-rule-table-card {
  display: flex !important;
  flex-direction: column !important;
  min-height: 0 !important;
}
html body .app-frame main.bw-lists-workspace > .bw-workspace-grid:not(#__csdr) .entity-workspace-table-wrap {
  flex: 1 1 auto !important;
  min-height: 0 !important;
}

/* ==========================================================================
 * 11. Dashboard 整体优化（2026-09-24 第四轮）
 *
 *    11.1 指标数值字体 —— Overview 里最大的败笔
 *        typography-contract.css 用 body .app-frame :is(...,.metric-card-value,…)
 *        的 !important 把数值锁成 "Ubuntu Mono"。网页环境根本没有装这个字体，
 *        实际回落到 Menlo / 打字机体：圆滚滚的字形配 $0.00 的美元符尤其难看。
 *        改回系统字体（SF Pro）+ 等宽数字特性 —— Apple 风格的正确做法是
 *        「无衬线字形 + tabular-nums」，而不是整个换等宽字体。
 *        选择器带 :not(#__csdr) 把权重顶到 id 级，压过 typography-contract。
 *
 *    11.2 指标卡 hover 反馈 —— 卡片完全没有悬停响应，加了轻量抬升
 *
 *    11.3 图表 tooltip 重排 —— 第三轮把 12 行压成两列网格，但每行仍是
 *        recharts 默认的 "Name : Value" 内联流：冒号挤在中间、数值起点参差
 *        （"Profit:$0.00" 和 "ROI:0.00%" 挤成一坨）。改成每行 flex 布局：
 *        名称靠左（灰）、数值靠右（深色 + 等宽数字），冒号整个删掉，
 *        时间标签加底部分隔线，容器圆角/阴影对齐全站卡片。
 * ======================================================================== */

/* ---- 11.1 指标数值字体 ---- */
html body .app-frame .traditional-dashboard-page .metric-card-value:not(#__csdr) {
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text",
    "Helvetica Neue", "Segoe UI", Inter, "PingFang SC", "Microsoft YaHei", sans-serif !important;
  font-size: 21px !important;
  font-weight: 600 !important;
  letter-spacing: -0.022em !important;
  font-variant-numeric: tabular-nums !important;
  font-feature-settings: "kern" 1 !important;
}

/* ---- 11.2 指标卡 hover 反馈 ---- */
.traditional-dashboard-page .metric-card {
  transition: box-shadow 0.18s var(--btn-ease, ease-out), transform 0.18s var(--btn-ease, ease-out) !important;
}
.traditional-dashboard-page .metric-card:hover {
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08), 0 1px 3px rgba(0, 0, 0, 0.04) !important;
  transform: translateY(-1px);
}
.dark .traditional-dashboard-page .metric-card:hover {
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.5) !important;
}

/* ---- 11.3 tooltip 重排 ---- */
.recharts-tooltip-wrapper {
  z-index: 40 !important;
}
.recharts-default-tooltip {
  border-radius: 10px !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
  box-shadow: 0 10px 30px rgba(16, 24, 40, 0.12), 0 2px 6px rgba(16, 24, 40, 0.06) !important;
  padding: 10px 12px !important;
}
.dark .recharts-default-tooltip {
  border-color: rgba(255, 255, 255, 0.12) !important;
}
.recharts-tooltip-label {
  font-weight: 600 !important;
  color: var(--foreground) !important;
  font-size: 12px !important;
  margin-bottom: 5px !important;
  padding-bottom: 5px !important;
  border-bottom: 1px solid var(--border) !important;
}
.recharts-tooltip-item-list {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  column-gap: 18px !important;
  row-gap: 1px !important;
  margin: 0 !important;
  padding: 0 !important;
}
.recharts-tooltip-item {
  display: flex !important;
  align-items: baseline !important;
  gap: 10px !important;
  padding: 2px 0 !important;
  list-style: none !important;
}
.recharts-tooltip-item-name {
  flex: 0 1 auto !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  color: var(--muted-foreground) !important;
}
.recharts-tooltip-item-separator {
  display: none !important;
}
.recharts-tooltip-item-value {
  flex: 1 1 auto !important;
  text-align: right !important;
  font-weight: 600 !important;
  color: var(--foreground) !important;
  font-variant-numeric: tabular-nums !important;
}
.recharts-tooltip-item-unit {
  flex: 0 0 auto !important;
}


/* ==========================================================================
 * 12. 品牌标识：把通用 BarChart3 图标换成 ClickSplice logo（2026-09-24）
 *
 *    站点上 logo 原本只出现在浏览器标签（favicon），UI 里的品牌位是 lucide 的
 *    BarChart3 通用图表图标 —— 跟站点身份无关。现在三处统一换成新 logo：
 *
 *    12.1 追踪器顶栏 .maxconv-brand-mark —— 原本是 16px 浅蓝底方块 + 蓝色图表图标，
 *         改成 18px logo 方块（底色去掉，logo 自带圆角与渐变）
 *    12.2 登录 / 注册页 .login-brand —— 隐藏 BarChart3，用 ::before 插 22px logo
 *
 *    logo 以 data URI 内联在 CSS 里（876 B 的 SVG → 1168 B base64）：
 *    不新增请求、不新增资源文件、不依赖 /logo.svg 是否部署，和本层其它补丁一样
 *    「删掉一行 <link> 即回滚」。源文件：logo/clicksplice-logo.svg
 * ======================================================================== */

/* ---- 12.1 追踪器顶栏品牌位 ---- */
.maxconv-brand-mark:not(#__csdr) {
  width: 18px !important;
  height: 18px !important;
  background-color: transparent !important;
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDI0IDEwMjQiIHdpZHRoPSIxMDI0IiBoZWlnaHQ9IjEwMjQiIHJvbGU9ImltZyIgYXJpYS1sYWJlbD0iQ2xpY2tTcGxpY2UiPiA8ZGVmcz4gPGxpbmVhckdyYWRpZW50IGlkPSJjc1RpbGUiIHgxPSIwIiB5MT0iMCIgeDI9IjAiIHkyPSIxIj4gPHN0b3Agb2Zmc2V0PSIwIiBzdG9wLWNvbG9yPSIjNERBMkZGIi8+IDxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0iIzAwNzFFMyIvPiA8L2xpbmVhckdyYWRpZW50PiA8bWFzayBpZD0iY3NTcGxpdCIgbWFza1VuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeD0iMCIgeT0iMCIgd2lkdGg9IjEwMjQiIGhlaWdodD0iMTAyNCI+IDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDI0IiBoZWlnaHQ9IjEwMjQiIGZpbGw9IiNmZmYiLz4gPHBhdGggZD0iTTguNiA4LjQgTDExLjMgMTYuNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjEiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIvPiA8L21hc2s+IDwvZGVmcz4gPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEwMjQiIGhlaWdodD0iMTAyNCIgcng9IjIyNiIgcnk9IjIyNiIgZmlsbD0idXJsKCNjc1RpbGUpIi8+IDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDU3LjcgNjEuNykgc2NhbGUoMzguMTMpIj4gPHBhdGggZD0iTTQuMDM3IDQuNjg4YS40OTUuNDk1IDAgMCAxIC42NTEtLjY1MWwxNiA2LjVhLjUuNSAwIDAgMS0uMDYzLjk0N2wtNi4xMjQgMS41OGEyIDIgMCAwIDAtMS40MzggMS40MzVsLTEuNTc5IDYuMTI2YS41LjUgMCAwIDEtLjk0Ny4wNjN6IiBmaWxsPSIjZmZmZmZmIiBtYXNrPSJ1cmwoI2NzU3BsaXQpIi8+IDwvZz4gPC9zdmc+") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: contain !important;
  border-radius: 5px !important;
}
.maxconv-brand-mark > svg,
.maxconv-brand-mark > .lucide {
  display: none !important;
}

/* ---- 12.2 登录 / 注册页品牌位 ---- */
.login-brand > svg,
.login-brand > .lucide {
  display: none !important;
}
.login-brand::before {
  content: "" !important;
  flex: 0 0 auto !important;
  width: 22px !important;
  height: 22px !important;
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDI0IDEwMjQiIHdpZHRoPSIxMDI0IiBoZWlnaHQ9IjEwMjQiIHJvbGU9ImltZyIgYXJpYS1sYWJlbD0iQ2xpY2tTcGxpY2UiPiA8ZGVmcz4gPGxpbmVhckdyYWRpZW50IGlkPSJjc1RpbGUiIHgxPSIwIiB5MT0iMCIgeDI9IjAiIHkyPSIxIj4gPHN0b3Agb2Zmc2V0PSIwIiBzdG9wLWNvbG9yPSIjNERBMkZGIi8+IDxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0iIzAwNzFFMyIvPiA8L2xpbmVhckdyYWRpZW50PiA8bWFzayBpZD0iY3NTcGxpdCIgbWFza1VuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeD0iMCIgeT0iMCIgd2lkdGg9IjEwMjQiIGhlaWdodD0iMTAyNCI+IDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDI0IiBoZWlnaHQ9IjEwMjQiIGZpbGw9IiNmZmYiLz4gPHBhdGggZD0iTTguNiA4LjQgTDExLjMgMTYuNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjEiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIvPiA8L21hc2s+IDwvZGVmcz4gPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEwMjQiIGhlaWdodD0iMTAyNCIgcng9IjIyNiIgcnk9IjIyNiIgZmlsbD0idXJsKCNjc1RpbGUpIi8+IDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDU3LjcgNjEuNykgc2NhbGUoMzguMTMpIj4gPHBhdGggZD0iTTQuMDM3IDQuNjg4YS40OTUuNDk1IDAgMCAxIC42NTEtLjY1MWwxNiA2LjVhLjUuNSAwIDAgMS0uMDYzLjk0N2wtNi4xMjQgMS41OGEyIDIgMCAwIDAtMS40MzggMS40MzVsLTEuNTc5IDYuMTI2YS41LjUgMCAwIDEtLjk0Ny4wNjN6IiBmaWxsPSIjZmZmZmZmIiBtYXNrPSJ1cmwoI2NzU3BsaXQpIi8+IDwvZz4gPC9zdmc+") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: contain !important;
}


/* ==========================================================================
 * 13. Campaigns 页重新设计 · 数据台 Dense Pro（2026-09-24 第五轮）
 *
 *    Alex 从三个方向（V1 卡片化 / V2 数据台 / V3 宽裕）里选定 V2。
 *    保持贴边，做成专业数据台：
 *      · 表头浅灰条压住整张表，大写微标签
 *      · 行 34px，每 4 列一条淡竖线切节奏
 *      · 悬停冷蓝，选中行左侧 3px 蓝条
 *      · 数字等宽对齐，零值弱化，Profit/ROI 语义色加粗
 *    全部规则都收在 .campaign-workbench-page 下 —— Landers/Offers 等同骨架页面
 *    暂不套用，等 Alex 看过 Campaigns 效果再决定。
 *    （来源：uxfix/draft-campaigns-v2.css，预览图 uxfix/shots/campaigns-v2*.png）
 * ======================================================================== */
/* ============================================================================
 * V2 · 数据台（Dense Pro）— Campaigns 重新设计草稿
 *
 * 思路：保持贴边，但做成「专业数据台」——表头做成浅灰条压住整张表，
 *        行更密（34px）但用列分组竖线切出节奏，悬停是冷蓝而不是灰，
 *        选中的行左侧亮一条 3px 蓝条。适合一屏看更多行。
 * ======================================================================== */
:root {
  --cs2-head: #f4f5f7;
  --cs2-line: rgba(0, 0, 0, 0.09);
  --cs2-hair: rgba(0, 0, 0, 0.05);
  --cs2-hover: rgba(0, 122, 255, 0.055);
  --cs2-accent: #0071e3;
  --cs2-muted: #78787d;
  --cs2-zero: #b4b4b9;
}

/* ---- 表头：浅灰条 + 大写微标签 ---- */
.app-frame .campaign-workbench-page .maxconv-table .maxconv-th:not(#__csdr) {
  height: 34px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  font-size: 10px !important;
  font-weight: 650 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  color: var(--cs2-muted) !important;
  background: var(--cs2-head) !important;
  border-bottom: 1px solid var(--cs2-line) !important;
}

/* ---- 工具栏：压成一条 ---- */
.campaign-workbench-page .maxconv-filterbar {
  padding: 8px 12px !important;
  row-gap: 6px !important;
  background: #ffffff !important;
  border-bottom: 1px solid var(--cs2-line) !important;
}
.campaign-workbench-page .maxconv-filterbar-row { gap: 8px !important; }

/* ---- 行：34px + 列分组竖线（每 4 列一条淡竖线，切出节奏） ---- */
.campaign-workbench-page .maxconv-body-scroll .maxconv-table tbody .maxconv-tr {
  transition: background-color 0.1s ease !important;
}
.campaign-workbench-page .maxconv-body-scroll .maxconv-table tbody .maxconv-tr > .maxconv-td {
  height: 34px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  padding-left: 9px !important;
  padding-right: 9px !important;
  border-bottom: 1px solid var(--cs2-hair) !important;
}
.campaign-workbench-page .maxconv-body-scroll .maxconv-table tbody .maxconv-tr > .maxconv-td:nth-child(4n) {
  border-right: 1px solid var(--cs2-hair) !important;
}
.campaign-workbench-page .maxconv-body-scroll .maxconv-table tbody .maxconv-tr:not([data-row-state="selected"]):hover > .maxconv-td {
  background: var(--cs2-hover) !important;
}

/* ---- 选中行：左侧亮蓝条 ---- */
.campaign-workbench-page .maxconv-body-scroll .maxconv-table tbody .maxconv-tr[data-row-state="selected"] > .maxconv-td:first-child {
  box-shadow: inset 3px 0 0 var(--cs2-accent) !important;
}

/* ---- 数字 ---- */
.campaign-workbench-page .maxconv-body-scroll .maxconv-table tbody td.text-right {
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", "Segoe UI", sans-serif !important;
  font-size: 12px !important;
  font-variant-numeric: tabular-nums !important;
}
.campaign-workbench-page .maxconv-body-scroll .maxconv-table tbody td[data-zero="true"] {
  color: var(--cs2-zero) !important;
}
.campaign-workbench-page .maxconv-body-scroll .maxconv-table tbody td.maxconv-positive,
.campaign-workbench-page .maxconv-body-scroll .maxconv-table tbody td.maxconv-negative {
  font-weight: 650 !important;
}

/* ---- 名字列：动作图标 hover 才出现 ---- */
.campaign-workbench-page .maxconv-name-link { font-weight: 500 !important; }
.campaign-workbench-page .maxconv-identity-sep { opacity: 0.35 !important; }
.campaign-workbench-page .maxconv-row-actions { opacity: 0 !important; transition: opacity 0.1s ease !important; }
.campaign-workbench-page .maxconv-tr:hover .maxconv-row-actions,
.campaign-workbench-page .maxconv-tr:focus-within .maxconv-row-actions { opacity: 1 !important; }

/* ---- Suspicious 条 ---- */
.campaign-workbench-page .maxconv-suspicious-track {
  height: 3px !important;
  border-radius: 1.5px !important;
  background: rgba(0, 0, 0, 0.08) !important;
}

/* ---- Totals / 分页 ---- */
.campaign-workbench-page .maxconv-totals-scroll {
  background: var(--cs2-head) !important;
  border-top: 1px solid var(--cs2-line) !important;
}
.campaign-workbench-page .maxconv-pagination {
  min-height: 36px !important;
  padding: 0 12px !important;
  background: #ffffff !important;
  border-top: 1px solid var(--cs2-hair) !important;
  font-size: 12px !important;
  color: var(--cs2-muted) !important;
}

/* ---- 13.9 暗色模式适配（2026-09-24）----
 *  13 节初版把浅色值写死了（工具栏/分页白底、表头与 Totals 浅灰、黑色透明 hairline），
 *  html.dark 下整页发黑但这些区域仍是亮的 —— Alex 截图报的 bug。
 *  这里逐项给 .dark 换成应用自己的暗色变量（--card #1c1c1e / --table-header #242426），
 *  hairline / 悬停 / 轨道换成白色透明系，零值灰换成暗色侧的次级灰。 */
.dark .campaign-workbench-page .maxconv-filterbar {
  background: var(--card, #1c1c1e) !important;
  border-bottom-color: rgba(255, 255, 255, 0.09) !important;
}
.dark .app-frame .campaign-workbench-page .maxconv-table .maxconv-th:not(#__csdr) {
  background: var(--table-header, #242426) !important;
  color: #a1a1a6 !important;
  border-bottom-color: rgba(255, 255, 255, 0.1) !important;
}
.dark .campaign-workbench-page .maxconv-body-scroll .maxconv-table tbody .maxconv-tr > .maxconv-td {
  border-bottom-color: rgba(255, 255, 255, 0.07) !important;
}
.dark .campaign-workbench-page .maxconv-body-scroll .maxconv-table tbody .maxconv-tr:not([data-row-state="selected"]):hover > .maxconv-td {
  background: rgba(10, 132, 255, 0.16) !important;
}
.dark .campaign-workbench-page .maxconv-body-scroll .maxconv-table tbody td[data-zero="true"] {
  color: #5f5f64 !important;
}
.dark .campaign-workbench-page .maxconv-suspicious-track {
  background: rgba(255, 255, 255, 0.1) !important;
}
.dark .campaign-workbench-page .maxconv-totals-scroll {
  background: var(--table-header, #242426) !important;
  border-top-color: rgba(255, 255, 255, 0.1) !important;
}
.dark .campaign-workbench-page .maxconv-pagination {
  background: var(--card, #1c1c1e) !important;
  border-top-color: rgba(255, 255, 255, 0.07) !important;
}

/* ==========================================================================
 * 14. 表格数据颜色统一（2026-09-24）
 *
 *    Alex：白色主题表格数据统一为黑色，黑色主题统一为白色，所有页面表格都生效。
 *
 *    现状并非"全站不一致"，而是有一批局部例外在拖后腿 —— 主体本来就用
 *    --text-primary（#1d1d1f / #f5f5f7），但这些地方把它改灰了：
 *      · .files-numeric（Files 表数字）→ --text-secondary
 *      · .dense-report-card .numeric-cell.is-zero / .zero-conversion-row td → muted
 *      · .entity-name-cell small / .files-name-cell small 之类的副标题 → muted
 *      · 部分页面单元格靠继承拿到容器的次级灰
 *    所以做法不是"逐页改"，而是**一条全站规则 + 一个主题变量**：
 *    --cs-data-ink 在 :root 是黑、在 .dark 是白，规则本身只写一次，深/浅自动跟随。
 *
 *    刻意保留（不参与统一）的两类：
 *      · Profit / ROI 的红绿语义色（.maxconv-positive / .maxconv-negative）
 *      · 表头列名（thead）—— 列名是标签，不是数据，保持次级灰
 *
 *    2026-09-24（#10）取消零值/空占位的弱化：Alex 反馈"数据为 0 的表格像是有一层
 *    模糊蒙版"——根因是零值单元格（[data-zero="true"] / .is-zero）与"—"空占位
 *    （.maxconv-empty-cell）被染成次级灰，整片单元格发灰被误读成蒙版。现统一成
 *    正常数据色（浅色主题黑、深色主题白），无论有无数据都正常显示。
 * ======================================================================== */
:root {
  --cs-data-ink: #1d1d1f;
}
.dark {
  --cs-data-ink: #ffffff;
}

.app-frame table tbody td:not(#__csdr):not(.maxconv-positive):not(.maxconv-negative),
.app-frame table tbody td:not(#__csdr) .maxconv-empty-cell,
.app-frame table tbody td:not(#__csdr) .numeric-cell,
.app-frame table tbody td:not(#__csdr) .metric-signal,
.app-frame table tbody td:not(#__csdr) .entity-name-cell strong,
.app-frame table tbody td:not(#__csdr) .maxconv-name-link,
.app-frame .files-table tbody td:not(#__csdr),
.app-frame .files-numeric:not(#__csdr),
.app-frame .files-name-cell strong:not(#__csdr) {
  color: var(--cs-data-ink) !important;
}
