/* ============================================================================
   助贷AI智能体平台 · 设计系统 (Design System)
   风格：扁平可视化 / 金融行业 / 无障碍优先 (WCAG AA)
   适用：企业端(enterprise) · 银行端(bank) · 运营端(ops)
   说明：基础 token 全端共享；三端通过 [data-theme] 切换专属强调色与密度。
   ============================================================================ */

/* ----------------------------- 设计变量 (Tokens) --------------------------- */
:root {
  /* 中性色 —— 金融级冷灰，营造"稳健、克制" */
  --ink-900: #0B1B33;   /* 标题 */
  --ink-700: #243B53;   /* 正文强调 */
  --ink-600: #334E68;   /* 正文 */
  --ink-500: #486581;   /* 次级文字 */
  --ink-400: #627D98;   /* 辅助文字 */
  --ink-300: #829AB1;   /* 占位/弱提示 */
  --line:    #E4E9F0;   /* 描边 */
  --line-2:  #D2DCE8;   /* 强描边 */
  --surface: #FFFFFF;   /* 卡片/页面底 */
  --surface-2:#F6F8FB;  /* 次级底 */
  --surface-3:#ECF1F7;  /* 悬浮/选中底 */

  /* 品牌主色（蓝，信任） */
  --brand-700:#0E40C9;
  --brand-600:#1657F0;
  --brand-500:#2F6BFF;
  --brand-100:#E7EEFF;
  --brand-50: #F3F7FF;

  /* 语义色 */
  --success:#0E9F6E; --success-bg:#E6F6EF; --success-ink:#0A7A54;
  --warning:#C2740B; --warning-bg:#FCF1E0; --warning-ink:#9A5B07;
  --danger: #D64545; --danger-bg :#FBEAEA; --danger-ink :#B23232;
  --info:   #1657F0; --info-bg   :#E7EEFF; --info-ink   :#0E40C9;

  /* 三端专属强调色（默认=企业端蓝） */
  --accent: var(--brand-600);
  --accent-700: var(--brand-700);
  --accent-100: var(--brand-100);
  --accent-50:  var(--brand-50);
  --accent-ink: var(--brand-700);
  /* 强调色投影：CSS 无法给 hex 变量加 alpha，故按主题单独声明 rgba */
  --accent-shadow:        rgba(22,87,240,.45);
  --accent-shadow-strong: rgba(22,87,240,.55);
  --accent-shadow-soft:   rgba(22,87,240,.35);
  /* 强调色亮版（深色底上用）：各端按主题覆盖 */
  --accent-bright:#60A5FA;

  /* 排版 */
  --font: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei",
          "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans SC", sans-serif;
  --mono: "SF Mono", ui-monospace, "Roboto Mono", Menlo, Consolas, monospace;

  /* 字号阶梯 */
  --fs-display: 30px; --lh-display: 38px;
  --fs-h1: 24px;     --lh-h1: 32px;
  --fs-h2: 20px;     --lh-h2: 28px;
  --fs-h3: 16px;     --lh-h3: 24px;
  --fs-body: 14px;   --lh-body: 22px;
  --fs-sm: 13px;     --lh-sm: 20px;
  --fs-xs: 12px;     --lh-xs: 18px;

  /* 间距阶梯 (4 基准) */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:20px;
  --sp-6:24px; --sp-8:32px; --sp-10:40px; --sp-12:48px; --sp-16:64px;

  /* 圆角（v3 统一视觉语言：更柔和的现代尺度） */
  --r-sm:6px; --r-md:12px; --r-lg:16px; --r-pill:999px;

  /* 阴影层次：常规容器用「发丝描边 + 柔和层叠阴影」，浮层用 pop */
  --sh-1: 0 1px 2px rgba(16,24,40,.06);
  --sh-2: 0 6px 20px rgba(16,24,40,.10);
  --sh-pop: 0 12px 40px rgba(16,24,40,.18);
  /* 卡片默认层次：近距离贴地投影 + 远距离柔和扩散，两段叠加出「浮起一点点」的精致感 */
  --sh-card: 0 1px 3px rgba(16,24,40,.06), 0 8px 24px rgba(16,24,40,.08);
  --sh-card-hover: 0 2px 6px rgba(16,24,40,.08), 0 16px 40px rgba(16,24,40,.12);

  /* 动效 token：全端统一缓动与时长，杜绝各组件各写各的 */
  --ease: cubic-bezier(.4,0,.2,1);
  --ease-out: cubic-bezier(.16,1,.3,1);
  --dur-1: 120ms;  /* 微反馈：hover / 描边 / 颜色 */
  --dur-2: 200ms;  /* 常规：位移 / 阴影 / 展开 */
  --dur-3: 320ms;  /* 大件：浮层 / 抽屉 / 高度 */

  /* 布局 */
  --sidebar-w: 232px;
  --topbar-h: 60px;
  --maxw: 1200px;
  --density: 1; /* 运营端会调高 */
}

/* 三端主题 */
[data-theme="enterprise"] { --accent:var(--brand-600); --accent-700:var(--brand-700);
  --accent-100:var(--brand-100); --accent-50:var(--brand-50); --accent-ink:var(--brand-700);
  --accent-shadow:rgba(22,87,240,.45); --accent-shadow-strong:rgba(22,87,240,.55); --accent-shadow-soft:rgba(22,87,240,.35);
  --accent-bright:#60A5FA; }
[data-theme="bank"] { --accent:#1B3A8C; --accent-700:#14306E; --accent-100:#E6ECF8;
  --accent-50:#F1F4FB; --accent-ink:#14306E;
  --accent-shadow:rgba(27,58,140,.45); --accent-shadow-strong:rgba(27,58,140,.55); --accent-shadow-soft:rgba(27,58,140,.35);
  --accent-bright:#8FB0FF; }
[data-theme="ops"]  { --accent:#0E7490; --accent-700:#0A5A70; --accent-100:#DDF1F5;
  --accent-50:#F0F8FA; --accent-ink:#0A5A70;
  --accent-shadow:rgba(14,116,144,.45); --accent-shadow-strong:rgba(14,116,144,.55); --accent-shadow-soft:rgba(14,116,144,.35);
  --accent-bright:#06B6D4; }

/* ----------------------------- 显示密度 (Density) -------------------------
   由「个人中心 → 外观偏好」写入 <html data-density="compact">，
   或 DS.setDensity('compact') 即时切换。仅压缩间距阶梯与容器内边距，
   不改字号，保证可读性与 WCAG AA 对比度不受影响。
   -------------------------------------------------------------------------- */
[data-density="compact"] {
  --sp-3:10px; --sp-4:12px; --sp-5:14px; --sp-6:16px;
  --sp-8:22px; --sp-10:28px; --sp-12:32px; --sp-16:44px;
  --topbar-h: 52px;
}
[data-density="compact"] .card--pad,
[data-density="compact"] .card__body   { padding: var(--sp-4); }
[data-density="compact"] .card__head   { padding: var(--sp-3) var(--sp-4); }
[data-density="compact"] .table thead th { padding: 8px var(--sp-3); }
[data-density="compact"] .table tbody td { padding: 9px var(--sp-3); }
[data-density="compact"] .kpi          { padding: var(--sp-4); }
[data-density="compact"] .kpi__value   { font-size:24px; line-height:30px; }
[data-density="compact"] .nav__item    { padding: 7px var(--sp-3); }
[data-density="compact"] .msg          { padding: var(--sp-3) var(--sp-4); }
[data-density="compact"] .client-row   { padding: var(--sp-3) var(--sp-4); }
[data-density="compact"] .ag-kpi       { padding: var(--sp-3) var(--sp-4); }
[data-density="compact"] .btn          { padding: 8px 14px; }
[data-density="compact"] .btn--sm      { padding: 6px 10px; }

/* ----------------------------- 侧栏收起 (Sidebar) -------------------------
   <html data-sidebar="collapsed">：侧栏收窄为图标条。
   文本用 font-size:0 折叠（导航项文本是裸文本节点，无法用选择器单独隐藏）。
   -------------------------------------------------------------------------- */
[data-sidebar="collapsed"] { --sidebar-w: 68px; }
[data-sidebar="collapsed"] .sidebar__brand { padding:0; justify-content:center; }
[data-sidebar="collapsed"] .sidebar__brand .brand-tx { display:none; }
[data-sidebar="collapsed"] .nav { padding: var(--sp-2); gap:4px; display:flex; flex-direction:column; }
[data-sidebar="collapsed"] .nav__group { display:none; }
[data-sidebar="collapsed"] .nav__item { flex-direction:column; font-size:0; gap:0; justify-content:center; align-items:center; padding:10px 0; }
[data-sidebar="collapsed"] .nav__item .ic { margin:0 auto; }
[data-sidebar="collapsed"] .nav__badge { position:absolute; top:5px; right:12px; min-width:8px; height:8px;
  padding:0; font-size:0; line-height:0; border-radius:50%; }
[data-sidebar="collapsed"] .sidebar__user--inline { flex-direction:column; gap:var(--sp-2); padding:var(--sp-2) 0; }
[data-sidebar="collapsed"] .sidebar__user-text,
[data-sidebar="collapsed"] .sidebar__foot:not([data-user-zone]) { display:none; }
[data-sidebar="collapsed"] .sidebar__user-info { flex:none; }
/* 代理商端紫色侧栏同步收起 */
[data-sidebar="collapsed"] .ag-sidebar { width:68px; flex:0 0 68px; }
[data-sidebar="collapsed"] .ag-brand { padding:20px 0; justify-content:center; }
[data-sidebar="collapsed"] .ag-brand .brand-tx { display:none; }
[data-sidebar="collapsed"] .ag-group, [data-sidebar="collapsed"] .ag-user { display:none; }
[data-sidebar="collapsed"] .ag-nav { font-size:0; gap:0; justify-content:center; padding:10px 0; }

/* ----------------------------- 基础重置 ----------------------------------- */
*,*::before,*::after { box-sizing:border-box; }
html,body { margin:0; padding:0; }
body {
  font-family: var(--font);
  font-size: var(--fs-body); line-height: var(--lh-body);
  color: var(--ink-600); background: var(--surface-2);
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
}
h1,h2,h3,h4,p { margin:0; }
a { color: var(--accent); text-decoration:none; }
a:hover { text-decoration: underline; }
.num { font-variant-numeric: tabular-nums; font-feature-settings:"tnum"; }
.tnum { font-variant-numeric: tabular-nums; }

/* 无障碍：键盘焦点 */
:focus-visible { outline: 3px solid color-mix(in srgb, var(--accent) 45%, transparent);
  outline-offset: 2px; border-radius: var(--r-sm); }
/* 尊重减少动效偏好：关掉所有动画/过渡，并把「旋转 spinner」降级为静态环 */
@media (prefers-reduced-motion: reduce) {
  * { animation-duration:.001ms!important; transition-duration:.001ms!important; }
  .spinner { animation:none!important; border-color:var(--accent-100)!important;
    border-top-color:var(--accent)!important; opacity:.75; }
  .card--interactive:hover, .card--hover:hover { transform:none!important; }
  .btn:active { transform:none!important; }
}

/* ----------------------------- 排版工具 ----------------------------------- */
.t-display { font-size:var(--fs-display); line-height:var(--lh-display); font-weight:700; color:var(--ink-900); letter-spacing:-.2px; }
.t-h1 { font-size:var(--fs-h1); line-height:var(--lh-h1); font-weight:700; color:var(--ink-900); }
.t-h2 { font-size:var(--fs-h2); line-height:var(--lh-h2); font-weight:600; color:var(--ink-900); }
.t-h3 { font-size:var(--fs-h3); line-height:var(--lh-h3); font-weight:600; color:var(--ink-700); }
.t-sub { color:var(--ink-400); font-size:var(--fs-sm); }
.t-muted { color:var(--ink-400); }
.t-strong { color:var(--ink-900); font-weight:600; }
.t-sm { font-size:var(--fs-sm); line-height:var(--lh-sm); }
.t-xs { font-size:var(--fs-xs); line-height:var(--lh-xs); }
.t-link { color:var(--accent); cursor:pointer; }
.t-mono { font-family:var(--mono); }

/* 彩色背景上的文字：确保 WCAG AA 对比度（蓝/青/深蓝背景上使用纯白或近白） */
.text-on-dark { color:#fff; }
.text-on-dark-soft { color:rgba(255,255,255,.92); }
.text-on-dark-muted { color:rgba(255,255,255,.78); }
.text-on-dark-sub { color:rgba(255,255,255,.65); }

/* ----------------------------- 布局 --------------------------------------- */
.page { min-height:100vh; }
.layout { display:flex; min-height:100vh; }
.sidebar {
  width: var(--sidebar-w); flex: 0 0 var(--sidebar-w);
  background: var(--surface); border-right:1px solid var(--line);
  display:flex; flex-direction:column; position:sticky; top:0; height:100vh;
}
.sidebar__brand { height:var(--topbar-h); display:flex; align-items:center; gap:10px;
  padding:0 var(--sp-5); border-bottom:1px solid var(--line); font-weight:700; color:var(--ink-900); }
.sidebar__brand .logo { width:30px; height:30px; border-radius:8px; background:
  linear-gradient(135deg, var(--accent), color-mix(in srgb,var(--accent) 60%, #6DD0FF));
  display:flex; align-items:center; justify-content:center; color:#fff; font-weight:800; font-size:15px; }

/* ── 品牌标识：企融通 QiFinLink 图形标（icons.svg#q-mark-mono） ─────────────
   .logo--q 覆盖 .logo 的底色 / 圆角 / 字号，只保留尺寸与占位；
   图形用 currentColor 上色，因此在浅底取品牌蓝、在深底/彩底直接反白。
   ------------------------------------------------------------------------ */
.logo--q { width:30px; height:30px; flex:none; display:block; overflow:visible;
  background:none !important; border-radius:0 !important; color:var(--accent) !important; }
.sidebar__brand .logo--q,
.topnav__brand  .logo--q { color:var(--accent); }
/* 深色 / 彩色底（代理商紫色侧边栏、登录页 hero 等）使用亮版强调色 */
.ag-brand .logo--q,
.sidebar--dark .logo--q,
.on-dark .logo--q { color:var(--accent-bright) !important; }
/* 品牌文字：中文加粗为主标识，英文与功能后缀弱化一档 */
.brand-tx { font-weight:500; font-size:var(--fs-sm, 13px); color:var(--ink-500);
  white-space:nowrap; letter-spacing:.2px; line-height:1.2; }
.brand-tx b { font-weight:800; font-size:15px; color:var(--ink-900); letter-spacing:.5px; margin-right:3px; }
.ag-brand .brand-tx, .on-dark .brand-tx { color:rgba(255,255,255,.78); }
.ag-brand .brand-tx b, .on-dark .brand-tx b { color:#fff; }

.nav { padding: var(--sp-3); overflow-y:auto; flex:1; }
.nav__group { font-size:var(--fs-xs); color:var(--ink-300); text-transform:uppercase;
  letter-spacing:.6px; padding: var(--sp-4) var(--sp-3) var(--sp-2); }
.nav__item { position:relative; display:flex; align-items:center; gap:10px; padding:9px var(--sp-3);
  border-radius:var(--r-md); color:var(--ink-500); cursor:pointer; font-weight:500; margin-bottom:2px;
  transition: background-color var(--dur-1) var(--ease), color var(--dur-1) var(--ease); }
.nav__item:hover { background:var(--surface-3); color:var(--ink-700); text-decoration:none; }
/* 激活项：淡强调底 + 左侧 3px 竖条，扫一眼就知道「我在哪」 */
.nav__item.is-active { background:var(--accent-100); color:var(--accent-ink); font-weight:600; }
.nav__item.is-active::before { content:""; position:absolute; left:0; top:6px; bottom:6px; width:3px;
  border-radius:0 3px 3px 0; background:var(--accent); }
.nav__item.is-active .ic { opacity:1; }
.nav__item .ic { width:18px; height:18px; flex:0 0 18px; opacity:.85; }
.nav__badge { margin-left:auto; background:var(--danger); color:#fff; font-size:11px;
  border-radius:var(--r-pill); padding:1px 7px; font-weight:700; }
.sidebar__foot { padding:var(--sp-4); border-top:1px solid var(--line); font-size:var(--fs-xs); color:var(--ink-300); }

/* 侧边栏底部用户区（运营端）：头像 + 姓名/角色 + 退出登录
   标记 .sidebar__foot[data-user-zone] 时由 app.js DS.paintUserZone() 填充 */
.sidebar__foot[data-user-zone] { padding:0; font-size:var(--fs-sm); color:var(--ink-500); }
.sidebar__user { padding:var(--sp-3); display:flex; flex-direction:column; gap:var(--sp-3); }
/* ops 一行排开：头像 + 姓名/角色 + 仅图标退出 */
.sidebar__user--inline { flex-direction:row; align-items:center; gap:var(--sp-3); padding:var(--sp-3) var(--sp-3); }
.sidebar__user--inline .sidebar__user-info { flex:1; min-width:0; }
.sidebar__user--inline .sidebar__user-avatar { width:28px; height:28px; font-size:12px; flex:none; }
.sidebar__user--inline .sidebar__user-text { flex-direction:column; line-height:1.15; }
.sidebar__user--inline .sidebar__user-logout { width:32px; height:32px; border-radius:8px; display:inline-flex; align-items:center; justify-content:center; color:var(--ink-500); border:1px solid transparent; background:transparent; flex:none; cursor:pointer; }
.sidebar__user--inline .sidebar__user-logout:hover { background:#FEE2E2; color:#DC2626; }

.sidebar__user-top { display:flex; align-items:center; gap:10px; min-width:0; }
.sidebar__user-avatar { width:32px; height:32px; border-radius:50%; background:var(--accent); color:#fff;
  font-weight:700; font-size:14px; display:flex; align-items:center; justify-content:center; flex:0 0 32px; }
.sidebar__user-info { flex:1; min-width:0; display:flex; flex-direction:column; line-height:1.25; }
.sidebar__user-info b { color:var(--ink-900); font-size:13px; font-weight:600; white-space:nowrap;
  overflow:hidden; text-overflow:ellipsis; }
.sidebar__user-role { font-size:11px; color:var(--ink-400); }
.sidebar__user-logout { display:flex; align-items:center; gap:8px; padding:7px var(--sp-3); border-radius:var(--r-md);
  color:var(--ink-500); font-size:var(--fs-sm); font-weight:500; text-decoration:none;
  transition:background-color var(--dur-1) var(--ease), color var(--dur-1) var(--ease); }
.sidebar__user-logout .i { width:15px; height:15px; flex:none; }
.sidebar__user-logout:hover { background:var(--danger-bg); color:var(--danger); text-decoration:none; }
.sidebar__user-logout:hover .i { color:var(--danger); }

/* 消息列表（企业端 / 运营端共用） */
.msg { display:flex; align-items:flex-start; gap:14px; padding:16px 20px; border-bottom:1px solid var(--line); }
.msg:last-child { border-bottom:none; }
.msg .c { flex:1; min-width:0; }
.msg .c > .t-strong { display:flex; align-items:center; flex-wrap:wrap; }
.msg.unread { background:var(--brand-50); }
.msg.unread .c > .t-strong::after { content:""; display:inline-block; width:7px; height:7px;
  border-radius:50%; background:var(--danger); margin-left:8px; vertical-align:1px; }
.msg__act { flex:0 0 auto; display:flex; align-items:center; gap:10px; padding-left:12px; }
.msg__time { font-size:12px; color:var(--ink-400); white-space:nowrap; }
.msg .st { flex:0 0 auto; }

.main { flex:1; min-width:0; display:flex; flex-direction:column; }
.topbar { height:var(--topbar-h); flex:0 0 var(--topbar-h); background:var(--surface);
  border-bottom:1px solid var(--line); display:flex; align-items:center; gap:var(--sp-4);
  padding:0 var(--sp-6); position:sticky; top:0; z-index:20; }
.topbar__title { font-weight:600; color:var(--ink-900); font-size:var(--fs-h3); }
.topbar__spacer { flex:1; }
.container { max-width:var(--maxw); margin:0 auto; padding:var(--sp-6); width:100%; }
.container--wide { max-width:1320px; }

/* ----------------------------- 按钮 --------------------------------------- */
.btn { font-family:inherit; font-size:var(--fs-body); font-weight:600; line-height:1;
  padding:10px 16px; border-radius:var(--r-md); border:1px solid transparent; cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  transition: background-color var(--dur-1) var(--ease), border-color var(--dur-1) var(--ease),
              color var(--dur-1) var(--ease), box-shadow var(--dur-2) var(--ease),
              transform var(--dur-1) var(--ease); }
/* 按压回弹：轻微内缩，松手回弹，给出「点到了」的物理反馈 */
.btn:active { transform: scale(.98); }
.btn--primary { background:var(--accent); color:#fff; box-shadow:0 1px 2px rgba(16,24,40,.10); }
.btn--primary:hover { background:var(--accent-700); box-shadow:0 4px 12px -2px var(--accent-shadow-soft); }
.btn--secondary { background:var(--surface); color:var(--ink-700); border-color:var(--line-2); }
.btn--secondary:hover { background:var(--surface-2); border-color:var(--ink-300); color:var(--ink-900); }
.btn--ghost { background:transparent; color:var(--accent-ink); }
.btn--ghost:hover { background:var(--accent-50); }
/* soft：填充淡强调色，介于 primary 与 ghost 之间的第三档 */
.btn--soft { background:var(--accent-100); color:var(--accent-ink); }
.btn--soft:hover { background:var(--accent-50); border-color:var(--accent); }
.btn--danger { background:var(--danger); color:#fff; box-shadow:0 1px 2px rgba(16,24,40,.10); }
.btn--danger:hover { background:var(--danger-ink); box-shadow:0 4px 12px -2px rgba(214,69,69,.35); }
.btn--success { background:var(--success); color:#fff; box-shadow:0 1px 2px rgba(16,24,40,.10); }
.btn--success:hover { background:var(--success-ink); box-shadow:0 4px 12px -2px rgba(14,159,110,.32); }
.btn--sm { padding:7px 12px; font-size:var(--fs-sm); }
.btn--lg { padding:13px 22px; font-size:var(--fs-h3); }
.btn--block { width:100%; }
/* 禁用态：明确不可点（去饱和 + 去阴影 + not-allowed），且不再响应 hover/active */
.btn:disabled, .btn[disabled], .btn[aria-disabled="true"], .btn.is-disabled {
  opacity:.45; cursor:not-allowed; box-shadow:none; filter:grayscale(.25); }
.btn:disabled:hover, .btn[disabled]:hover, .btn[aria-disabled="true"]:hover, .btn.is-disabled:hover { box-shadow:none; }
.btn:disabled:active, .btn[disabled]:active, .btn[aria-disabled="true"]:active { transform:none; }
.btn__ic { width:16px; height:16px; }

/* 图标按钮 */
.icon-btn { width:36px; height:36px; border-radius:var(--r-md); border:1px solid transparent;
  background:transparent; color:var(--ink-500); cursor:pointer; display:inline-flex;
  align-items:center; justify-content:center;
  transition: background-color var(--dur-1) var(--ease), color var(--dur-1) var(--ease); }
.icon-btn:hover { background:var(--surface-3); color:var(--ink-700); }
.icon-btn:active { transform:scale(.94); }

/* ----------------------------- 表单 --------------------------------------- */
.field { margin-bottom:var(--sp-4); }
.field__label { display:block; font-size:var(--fs-sm); font-weight:600; color:var(--ink-700); margin-bottom:6px; }
.field__label .req { color:var(--danger); margin-left:2px; }
.req { color:var(--danger); margin-left:2px; font-weight:700; }
.input, .select, .textarea {
  width:100%; font-family:inherit; font-size:var(--fs-body); color:var(--ink-700);
  background:var(--surface); border:1px solid var(--line-2); border-radius:var(--r-md);
  padding:10px 12px; line-height:1.4;
  transition:border-color var(--dur-1) var(--ease), box-shadow var(--dur-1) var(--ease), background-color var(--dur-1) var(--ease); }
.input::placeholder, .textarea::placeholder { color:var(--ink-300); }
.input:focus, .select:focus, .textarea:focus { outline:none; border-color:var(--accent);
  box-shadow:0 0 0 3px var(--accent-50); }
.textarea { resize:vertical; min-height:88px; }
.help { font-size:var(--fs-xs); color:var(--ink-400); margin-top:6px; }

/* 列表搜索框（通用，自动注入到列表表格上方） */
.search { position:relative; display:inline-flex; align-items:center; }
.search .i { position:absolute; left:11px; top:50%; transform:translateY(-50%); width:16px; height:16px; color:var(--ink-400); pointer-events:none; }
.search__input { padding-left:34px; width:240px; }
.search__input::-webkit-search-cancel-button { -webkit-appearance:none; }
.search__input::-ms-clear { display:none; }
@media (max-width:760px){ .search__input { width:150px; } }

/* 复选 / 单选 / 开关 */
.check { display:flex; align-items:center; gap:8px; cursor:pointer; font-size:var(--fs-sm); color:var(--ink-600); }
.check input { width:16px; height:16px; accent-color:var(--accent); }
.switch { position:relative; width:42px; height:24px; flex:0 0 42px; }
.switch input { opacity:0; width:0; height:0; }
.switch span { position:absolute; inset:0; background:var(--line-2); border-radius:var(--r-pill);
  transition:background-color var(--dur-2) var(--ease); }
.switch span::before { content:""; position:absolute; width:18px; height:18px; left:3px; top:3px;
  background:#fff; border-radius:50%; transition:transform var(--dur-2) var(--ease); box-shadow:var(--sh-1); }
.switch input:checked + span { background:var(--accent); }
.switch input:checked + span::before { transform:translateX(18px); }

/* ----------------------------- 卡片 --------------------------------------- */
/* 卡片：发丝描边 + 两段柔和阴影，比纯平多一层「浮起」的精致感 */
.card { background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); min-width:0;
  box-shadow:var(--sh-card);
  transition: box-shadow var(--dur-2) var(--ease), border-color var(--dur-2) var(--ease),
              transform var(--dur-2) var(--ease); }
.card--pad { padding:var(--sp-5); }
.card__head { display:flex; align-items:center; gap:var(--sp-3); padding:var(--sp-4) var(--sp-5);
  border-bottom:1px solid var(--line); flex-wrap:wrap; }
/* 头部右侧操作区（搜索框、按钮等统一归位到这里，整体推到最右，不独占一行） */
.card__tools { margin-left:auto; display:flex; align-items:center; gap:var(--sp-2); flex-shrink:0; flex-wrap:wrap; justify-content:flex-end; }
.ag-card__h { display:flex; align-items:center; gap:var(--sp-3); flex-wrap:wrap; }
.card__title { font-weight:600; color:var(--ink-900); font-size:var(--fs-h3); }
.card__body { padding:var(--sp-5); }
.card--hover:hover { border-color:var(--line-2); box-shadow:var(--sh-card-hover); }
/* 可点击卡片：hover 上浮 2px + 阴影加深，明确「这是个入口」 */
.card--interactive { cursor:pointer; }
.card--interactive:hover,
.card--interactive:focus-within { transform:translateY(-2px); box-shadow:var(--sh-card-hover);
  border-color:var(--line-2); }
.card--interactive:active { transform:translateY(0); box-shadow:var(--sh-card); }
/* 扁平卡片：需要与背景齐平时显式去阴影 */
.card--flat { box-shadow:none; }

/* 网格 */
.grid { display:grid; gap:var(--sp-5); }
.grid--2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
.grid--3 { grid-template-columns:repeat(3,minmax(0,1fr)); }
.grid--4 { grid-template-columns:repeat(4,minmax(0,1fr)); }
.row { display:flex; gap:var(--sp-4); }
.row--wrap { flex-wrap:wrap; }
.between { justify-content:space-between; }
.center { align-items:center; }
.mt-2{margin-top:var(--sp-2)} .mt-3{margin-top:var(--sp-3)} .mt-4{margin-top:var(--sp-4)}
.mt-5{margin-top:var(--sp-5)} .mt-6{margin-top:var(--sp-6)} .mb-3{margin-bottom:var(--sp-3)}
.mb-4{margin-bottom:var(--sp-4)} .mb-5{margin-bottom:var(--sp-5)} .mb-6{margin-bottom:var(--sp-6)}

/* ----------------------------- KPI 指标块 -------------------------------- */
.kpi { background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); padding:var(--sp-5);
  position:relative; overflow:hidden; min-width:0; box-shadow:var(--sh-card);
  transition: box-shadow var(--dur-2) var(--ease), transform var(--dur-2) var(--ease); }
.kpi::before { content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background:transparent; }
.kpi__head { display:flex; align-items:flex-start; justify-content:space-between; }
.kpi__label { font-size:var(--fs-sm); color:var(--ink-400); display:flex; align-items:center; gap:6px; }
.kpi__value { font-size:28px; line-height:34px; font-weight:700; color:var(--ink-900); margin-top:6px; }
.kpi__delta { font-size:var(--fs-xs); margin-top:6px; display:inline-flex; align-items:center; gap:3px; }
.kpi__delta.up { color:var(--success-ink); }
.kpi__delta.down { color:var(--danger-ink); }
.kpi__ic { width:34px; height:34px; border-radius:10px; background:var(--accent-50); color:var(--accent-ink);
  display:flex; align-items:center; justify-content:center; }

/* KPI 横向排列（默认 4 列，响应式折叠） */
.kpi-row { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; }
.kpi-row .kpi { max-width:100%; min-width:0; overflow:hidden; }
.kpi-row .kpi__value { font-size:28px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
@media (max-width:1200px){ .kpi-row{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:760px){ .kpi-row{grid-template-columns:minmax(0,1fr)} }

/* KPI 状态色 —— 左侧色条 + 右上角图标底 */
.kpi--wait::before { background:var(--st-wait-dot); }
.kpi--wait .kpi__ic { background:var(--st-wait-bg); color:var(--st-wait-ink); }
.kpi--needdoc::before { background:var(--st-needdoc-dot); }
.kpi--needdoc .kpi__ic { background:var(--st-needdoc-bg); color:var(--st-needdoc-ink); }
.kpi--run::before { background:var(--st-run-dot); }
.kpi--run .kpi__ic { background:var(--st-run-bg); color:var(--st-run-ink); }
.kpi--done::before { background:var(--st-done-dot); }
.kpi--done .kpi__ic { background:var(--st-done-bg); color:var(--st-done-ink); }
.kpi--fail::before { background:var(--st-fail-dot); }
.kpi--fail .kpi__ic { background:var(--st-fail-bg); color:var(--st-fail-ink); }
.kpi--review::before { background:var(--st-review-dot); }
.kpi--review .kpi__ic { background:var(--st-review-bg); color:var(--st-review-ink); }
.kpi--diligence::before { background:var(--st-dilig-dot); }
.kpi--diligence .kpi__ic { background:var(--st-dilig-bg); color:var(--st-dilig-ink); }
.kpi--sign::before { background:var(--st-sign-dot); }
.kpi--sign .kpi__ic { background:var(--st-sign-bg); color:var(--st-sign-ink); }
.kpi--transfer::before { background:var(--st-trans-dot); }
.kpi--transfer .kpi__ic { background:var(--st-trans-bg); color:var(--st-trans-ink); }

/* ----------------------------- 标签 / 徽章 ------------------------------- */
.tag { display:inline-flex; align-items:center; gap:4px; font-size:var(--fs-xs); font-weight:600;
  padding:3px 9px; border-radius:var(--r-pill); line-height:16px; }
.tag--neutral { background:var(--surface-3); color:var(--ink-500); }
.tag--accent { background:var(--accent-50); color:var(--accent-ink); }
.tag--success { background:var(--success-bg); color:var(--success-ink); }
.tag--warning { background:var(--warning-bg); color:var(--warning-ink); }
.tag--danger  { background:var(--danger-bg);  color:var(--danger-ink); }
.tag--info    { background:var(--info-bg);    color:var(--info-ink); }
.tag--dot::before { content:""; width:6px; height:6px; border-radius:50%; background:currentColor; }
/* 可复制标记（登录账号等辅助信息）：任意元素加 data-copy="…" 即可，由 app.js 全局委托 */
[data-copy] { cursor:pointer; }
.tag[data-copy]:hover { background:var(--accent-100); color:var(--accent-ink); }

/* ----------------------------- 表格 --------------------------------------- */
.table-wrap { border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden;
  background:var(--surface); box-shadow:var(--sh-card); }
/* overflow:clip 同样能裁切圆角，但不会创建滚动容器 —— 这样内部 sticky 表头才能相对页面生效 */
@supports (overflow: clip) { .table-wrap { overflow: clip; } }
.table { width:100%; border-collapse:collapse; font-size:var(--fs-sm); }
/* 表头：白底 + 底描边，长表滚动时吸附在顶栏下方 */
.table thead th { text-align:left; font-weight:600; color:var(--ink-500); background:var(--surface);
  padding:12px var(--sp-4); border-bottom:1px solid var(--line-2); white-space:nowrap; }
.table-wrap .table thead th { position:sticky; top:var(--table-sticky-top, var(--topbar-h)); z-index:3; }
.table tbody td { padding:14px var(--sp-4); border-bottom:1px solid var(--line); color:var(--ink-600); vertical-align:middle; }
.table tbody tr:last-child td { border-bottom:none; }
/* 斑马纹：只比白底深一丝，用来引导横向读行，不喧宾夺主 */
.table tbody tr:nth-child(even) { background:color-mix(in srgb, var(--surface-2) 50%, var(--surface)); }
/* hover：极淡强调底，比斑马纹更显眼，指示「当前这一行」 */
.table tbody tr:hover,
.table tbody tr:nth-child(even):hover { background:color-mix(in srgb, var(--accent-100) 45%, var(--surface));
  transition: background-color var(--dur-1) var(--ease); }
.table .num { text-align:right; font-variant-numeric:tabular-nums; }
.table__title { font-weight:600; color:var(--ink-900); }
.table__sub { color:var(--ink-300); font-size:var(--fs-xs); }

/* ----------------------------- 进度时间轴 -------------------------------- */
.steps { display:flex; align-items:flex-start; }
.steps__item { flex:1; position:relative; text-align:center; }
.steps__dot { width:30px; height:30px; border-radius:50%; margin:0 auto 8px; display:flex;
  align-items:center; justify-content:center; font-size:var(--fs-xs); font-weight:700;
  background:var(--surface-3); color:var(--ink-400); border:2px solid var(--line); position:relative; z-index:2; }
.steps__item::before { content:""; position:absolute; top:15px; left:-50%; width:100%; height:2px;
  background:var(--line); z-index:1; }
.steps__item:first-child::before { display:none; }
.steps__item.done .steps__dot { background:var(--success); border-color:var(--success); color:#fff; }
.steps__item.done::before { background:var(--success); }
.steps__item.active .steps__dot { background:var(--accent); border-color:var(--accent); color:#fff;
  box-shadow:0 0 0 4px var(--accent-50); }
.steps__item.active::before { background:var(--accent); }
.steps__label { font-size:var(--fs-xs); color:var(--ink-500); }
.steps__item.active .steps__label { color:var(--accent-ink); font-weight:600; }

/* 竖向时间轴（详情） */
.timeline { position:relative; padding-left:22px; }
.timeline::before { content:""; position:absolute; left:6px; top:4px; bottom:4px; width:2px; background:var(--line); }
.tl-item { position:relative; padding-bottom:var(--sp-5); }
.tl-item:last-child { padding-bottom:0; }
.tl-item::before { content:""; position:absolute; left:-19px; top:4px; width:10px; height:10px;
  border-radius:50%; background:var(--surface); border:2px solid var(--line-2); }
.tl-item.done::before { background:var(--success); border-color:var(--success); }
.tl-item.active::before { background:var(--accent); border-color:var(--accent); box-shadow:0 0 0 4px var(--accent-50); }
.tl-item__t { font-weight:600; color:var(--ink-900); font-size:var(--fs-sm); }
.tl-item__d { font-size:var(--fs-xs); color:var(--ink-400); }

/* ----------------------------- 环形仪表 ----------------------------------- */
.gauge { position:relative; width:160px; height:160px; }
.gauge svg { transform:rotate(-90deg); }
.gauge__txt { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.gauge__val { font-size:34px; font-weight:700; color:var(--ink-900); line-height:1; }
.gauge__lab { font-size:var(--fs-xs); color:var(--ink-400); margin-top:4px; }

/* ----------------------------- 条形 / 迷你图 ------------------------------ */
.bar { height:8px; border-radius:var(--r-pill); background:var(--surface-3); overflow:hidden; }
.bar__fill { height:100%; border-radius:var(--r-pill); background:var(--accent); }
.spark { width:100%; height:40px; display:block; }

/* ----------------------------- 产品匹配卡 -------------------------------- */
.prod-card { background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg);
  padding:var(--sp-5); position:relative; box-shadow:var(--sh-card);
  transition:border-color var(--dur-2) var(--ease), box-shadow var(--dur-2) var(--ease), transform var(--dur-2) var(--ease); }
.prod-card:hover { border-color:var(--line-2); box-shadow:var(--sh-card-hover); transform:translateY(-2px); }
.prod-card--top { border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-50); }
.prod-card__bank { display:flex; align-items:center; gap:10px; margin-bottom:var(--sp-3); }
.bank-logo { width:38px; height:38px; border-radius:10px; display:flex; align-items:center; justify-content:center;
  font-weight:800; color:#fff; font-size:15px; flex:0 0 38px; }
.prod-card__amt { font-size:26px; font-weight:700; color:var(--ink-900); }
.prod-card__rate { color:var(--success-ink); font-weight:700; }
.prod-card__days { color:var(--ink-500); }
.kv { display:flex; justify-content:space-between; padding:7px 0; border-bottom:1px dashed var(--line); font-size:var(--fs-sm); }
.kv:last-child { border-bottom:none; }
.kv__k { color:var(--ink-400); }
.kv__v { color:var(--ink-700); font-weight:600; }

/* ----------------------------- 弹窗 / 抽屉 / Toast ----------------------- */
.modal-mask { position:fixed; inset:0; background:rgba(11,27,51,.45); display:flex;
  align-items:center; justify-content:center; z-index:100; padding:var(--sp-5); }
.modal { background:var(--surface); border-radius:var(--r-lg); box-shadow:var(--sh-pop);
  width:100%; max-width:520px; max-height:90vh; overflow:auto; }
/* DS.modal 内容卡片：覆盖各页面内联 .modal(遮罩) 规则（更高优先级），避免被 display:none 隐藏 */
.modal-mask .modal { display:block; position:static; width:auto; height:auto; background:var(--surface);
  border-radius:var(--r-lg); box-shadow:var(--sh-pop); max-width:520px; max-height:90vh; overflow:auto; }
.modal__head { padding:var(--sp-5); border-bottom:1px solid var(--line); display:flex; align-items:center; }
.modal__title { font-weight:700; color:var(--ink-900); font-size:var(--fs-h3); }
.modal__body { padding:var(--sp-5); }
.modal__foot { padding:var(--sp-4) var(--sp-5); border-top:1px solid var(--line); display:flex; gap:var(--sp-3); justify-content:flex-end; }

.drawer-mask { position:fixed; inset:0; background:rgba(11,27,51,.40); z-index:90; }
.drawer { position:fixed; top:0; right:0; height:100vh; width:480px; max-width:92vw; background:var(--surface);
  box-shadow:var(--sh-pop); z-index:91; display:flex; flex-direction:column; }
.drawer__head { padding:var(--sp-5); border-bottom:1px solid var(--line); display:flex; align-items:center; }
.drawer__body { padding:var(--sp-5); overflow:auto; flex:1; }

.toast-wrap { position:fixed; right:var(--sp-6); bottom:var(--sp-6); display:flex; flex-direction:column; gap:var(--sp-3); z-index:200; }
.toast { background:var(--ink-900); color:#fff; padding:12px 16px; border-radius:var(--r-md);
  box-shadow:var(--sh-2); display:flex; align-items:center; gap:10px; font-size:var(--fs-sm); min-width:260px; }
.toast .dot { width:8px; height:8px; border-radius:50%; background:var(--success); flex:0 0 8px; }

/* ============================================================================
   状态组件：空态 / 加载态 / 错误态（全端复用，浅色底上均满足 WCAG AA）
   由 DS.emptyState() / DS.loading() / DS.errorState() 渲染，也可手写。
   ============================================================================ */

/* ---------- 空态 ---------- */
.empty { text-align:center; padding:var(--sp-12) var(--sp-6); color:var(--ink-500); }
/* .empty__ic 为历史类名，.empty__icon 为新命名，二者等价 */
.empty__ic, .empty__icon { width:56px; height:56px; margin:0 auto var(--sp-4); border-radius:50%;
  background:var(--accent-50); border:1px solid var(--accent-100);
  display:flex; align-items:center; justify-content:center; color:var(--accent-ink); }
.empty__ic .i, .empty__icon .i { width:28px; height:28px; stroke-width:1.6; }
.empty__t { font-weight:600; font-size:var(--fs-h3); color:var(--ink-900); margin-bottom:6px; }
.empty__d { font-size:var(--fs-sm); line-height:var(--lh-sm); color:var(--ink-500);
  max-width:38em; margin:0 auto; }
.empty__act { margin-top:var(--sp-5); display:flex; gap:var(--sp-3); justify-content:center; flex-wrap:wrap; }

/* ---------- 加载态 ---------- */
.loading { display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:var(--sp-3); padding:var(--sp-10) var(--sp-6); color:var(--ink-500); }
.loading--inline { flex-direction:row; padding:var(--sp-3) 0; gap:var(--sp-2); justify-content:flex-start; }
.loading__t { font-size:var(--fs-sm); line-height:var(--lh-sm); color:var(--ink-500); }
.spinner { width:26px; height:26px; flex:none; border-radius:50%;
  border:2.5px solid var(--accent-100); border-top-color:var(--accent);
  animation:spin .8s linear infinite; }
.spinner--sm { width:16px; height:16px; border-width:2px; }
.spinner--lg { width:36px; height:36px; border-width:3px; }
/* @keyframes spin 见「交互态」段，全文件共用一份 */

/* ---------- 错误态 ---------- */
.error-state { text-align:center; padding:var(--sp-10) var(--sp-6); }
.error-state__icon { width:56px; height:56px; margin:0 auto var(--sp-4); border-radius:50%;
  background:var(--danger-bg); border:1px solid rgba(214,69,69,.22);
  display:flex; align-items:center; justify-content:center; color:var(--danger-ink); }
.error-state__icon .i { width:26px; height:26px; }
.error-state__t { font-weight:600; font-size:var(--fs-h3); color:var(--ink-900); margin-bottom:6px; }
.error-state__d { font-size:var(--fs-sm); line-height:var(--lh-sm); color:var(--ink-500);
  max-width:38em; margin:0 auto; word-break:break-word; }
.error-state__act { margin-top:var(--sp-5); display:flex; gap:var(--sp-3); justify-content:center; flex-wrap:wrap; }

/* ----------------------------- 头像 / 标识 -------------------------------- */
.avatar { width:36px; height:36px; border-radius:50%; background:var(--accent-50); color:var(--accent-ink);
  display:flex; align-items:center; justify-content:center; font-weight:700; font-size:var(--fs-sm); flex:0 0 36px; }
.logo-pill { display:inline-flex; align-items:center; gap:8px; font-weight:700; color:var(--ink-900); }

/* ----------------------------- 分段控件 / 标签页 -------------------------- */
.seg { display:inline-flex; background:var(--surface-3); border-radius:var(--r-md); padding:3px; gap:2px; }
.seg button { border:none; background:transparent; font-family:inherit; font-size:var(--fs-sm); font-weight:600;
  color:var(--ink-500); padding:6px 14px; border-radius:8px; cursor:pointer;
  transition:background-color var(--dur-1) var(--ease), color var(--dur-1) var(--ease), box-shadow var(--dur-1) var(--ease); }
.seg button.is-active { background:var(--surface); color:var(--accent-ink); box-shadow:var(--sh-1); }

.tabs { display:flex; gap:var(--sp-5); border-bottom:1px solid var(--line); }
.tabs button { border:none; background:none; font-family:inherit; font-size:var(--fs-body); font-weight:600;
  color:var(--ink-400); padding:0 0 12px; cursor:pointer; position:relative;
  transition:color var(--dur-1) var(--ease); }
.tabs button.is-active { color:var(--ink-900); }
.tabs button.is-active::after { content:""; position:absolute; left:0; right:0; bottom:-1px; height:2px; background:var(--accent); }

/* ----------------------------- 工具类 ------------------------------------- */
.flex { display:flex; }
.items-center { align-items:center; }
.gap-2{gap:var(--sp-2)} .gap-3{gap:var(--sp-3)} .gap-4{gap:var(--sp-4)}
.divider { height:1px; background:var(--line); margin:var(--sp-4) 0; }
.text-right { text-align:right; }
.nowrap { white-space:nowrap; }
.truncate { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.w-full { width:100%; }

/* ----------------------------- 响应式 ------------------------------------- */
@media (max-width: 1024px) {
  .grid--4 { grid-template-columns:repeat(2,1fr); }
  .grid--3 { grid-template-columns:repeat(2,1fr); }
}
@media (max-width: 760px) {
  .sidebar { display:none; }
  .grid--2, .grid--3, .grid--4 { grid-template-columns:1fr; }
  .topbar { padding:0 var(--sp-4); }
  .container { padding:var(--sp-4); }
}

/* 打印优化（金融报表习惯） */
@media print {
  .sidebar, .topbar, .fab, .toast-wrap { display:none!important; }
  body { background:#fff; }
  .card, .kpi, .table-wrap { box-shadow:none; border-color:#ccc; }
}

/* ===== 扁平图标系统（内联 SVG symbol，统一 1.8 描边、currentColor 自带主题色） ===== */
.isprite { position:absolute; width:0; height:0; overflow:hidden; }
.i { width:18px; height:18px; flex:none; fill:none; stroke:currentColor;
     stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
/* 空态 / 大号图标：32px（置于 .empty__ic 内时被 .empty__ic .i 收窄至 28px） */
.i-32 { width:32px; height:32px; }
.ic { display:inline-flex; align-items:center; gap:0; margin-right:0; }
.nav__item .ic { display:inline-flex; align-items:center; justify-content:center; }
.nav__item .ic .i { width:18px; height:18px; }
.tag .i { width:14px; height:14px; margin-right:4px; vertical-align:-2px; stroke-width:1.8; }
.btn .i { width:16px; height:16px; margin-right:6px; vertical-align:-3px; stroke-width:1.8; }
.steps__dot .i { width:16px; height:16px; stroke-width:2.4; }
.empty__ic .i { width:28px; height:28px; stroke-width:1.6; }
.agent-ic .i { width:24px; height:24px; }
.fab .i { width:24px; height:24px; stroke-width:1.8; }
.icon-btn .i { width:18px; height:18px; }
.chat__head .i { width:18px; height:18px; }
.t-strong .i { width:18px; height:18px; margin-right:6px; vertical-align:-3px; }
.note .i { width:16px; height:16px; margin-right:6px; vertical-align:-3px; stroke-width:1.8; }
@media (prefers-reduced-motion: reduce) { .i { animation:none!important; } }

/* ============================================================================
   业务状态色系统 (Status Color System) —— v2
   规则：一种业务语义一种色相，全端统一；文字/背景均满足 WCAG AA。
   状态徽章统一用 .st + 修饰类，含前置圆点；进行中态圆点带脉冲动效。
   ============================================================================ */
:root {
  /* 等待受理（橙）：待接单 / 认证中 / 排队中 / 待处理 */
  --st-wait-ink:#9A4D00;  --st-wait-bg:#FDEED8;  --st-wait-dot:#E07800;
  /* 进行中（蓝）：进行中 / AI初审 / 解析中 / 执行中 */
  --st-run-ink:#0E40C9;   --st-run-bg:#E7EEFF;   --st-run-dot:#2F6BFF;
  /* 已受理/已接单（靛）：银行已接单 / 已接单 */
  --st-accept-ink:#4338CA; --st-accept-bg:#EBEAFD; --st-accept-dot:#6366F1;
  /* 尽调中（青）*/
  --st-dilig-ink:#0E7490; --st-dilig-bg:#DDF3F8;  --st-dilig-dot:#0891B2;
  /* 风控审批（紫）*/
  --st-review-ink:#6D28D9; --st-review-bg:#F0EAFB; --st-review-dot:#8B5CF6;
  /* 待签约（金）*/
  --st-sign-ink:#7A5E00;  --st-sign-bg:#FBF3CE;   --st-sign-dot:#D4A800;
  /* 完成/正常（绿）：已签约 / 已认证 / 已放款 / 成功 / 运行中 / 在售 */
  --st-done-ink:#0A7A54;  --st-done-bg:#E6F6EF;   --st-done-dot:#0E9F6E;
  /* 终止/异常（红）：已拒单 / 失败 / 异常 / 已超时释放 */
  --st-fail-ink:#B23232;  --st-fail-bg:#FBEAEA;   --st-fail-dot:#D64545;
  /* 已转推荐（湖绿）*/
  --st-trans-ink:#0F766E; --st-trans-bg:#DDF4F1;  --st-trans-dot:#14B8A6;
  /* 待补件（琥珀，需用户/机构补充材料 —— 与"等待受理"同族但带描边区分）*/
  --st-needdoc-ink:#92400E; --st-needdoc-bg:#FEF3C7; --st-needdoc-dot:#F59E0B;
  --st-needdoc-ring:#F0C36B;
  /* 未开始/停用（灰）：未认证 / 待上传 / 已下架 / 已回滚 / 草稿 */
  --st-idle-ink:#486581;  --st-idle-bg:#ECF1F7;   --st-idle-dot:#829AB1;
}
/* 状态徽章基类：规范名 .st；.status 为历史兼容别名，二者恒等 */
.st, .status { display:inline-flex; align-items:center; gap:6px; font-size:var(--fs-xs); font-weight:600;
  padding:3px 10px 3px 8px; border-radius:var(--r-pill); line-height:16px; white-space:nowrap; }
.st::before, .status::before { content:""; width:6px; height:6px; border-radius:50%; background:var(--st-dot,currentColor); flex:none; }
/* 语义色：规范名 .st--*；.status--* 为兼容别名，同一选择器分组保证单一真源、视觉恒等 */
.st--wait, .status--pending    { background:var(--st-wait-bg);   color:var(--st-wait-ink);   --st-dot:var(--st-wait-dot); }
.st--run, .status--processing  { background:var(--st-run-bg);    color:var(--st-run-ink);    --st-dot:var(--st-run-dot); }
.st--accept, .status--accept   { background:var(--st-accept-bg); color:var(--st-accept-ink); --st-dot:var(--st-accept-dot); }
.st--diligence, .status--diligence { background:var(--st-dilig-bg); color:var(--st-dilig-ink); --st-dot:var(--st-dilig-dot); }
.st--review, .status--review   { background:var(--st-review-bg); color:var(--st-review-ink); --st-dot:var(--st-review-dot); }
.st--sign, .status--signing    { background:var(--st-sign-bg);   color:var(--st-sign-ink);   --st-dot:var(--st-sign-dot); }
.st--done, .status--approved, .status--done { background:var(--st-done-bg); color:var(--st-done-ink); --st-dot:var(--st-done-dot); }
.st--fail, .status--rejected   { background:var(--st-fail-bg);   color:var(--st-fail-ink);   --st-dot:var(--st-fail-dot); }
.st--transfer, .status--transfer { background:var(--st-trans-bg); color:var(--st-trans-ink); --st-dot:var(--st-trans-dot); }
.st--needdoc, .status--needdoc { background:var(--st-needdoc-bg); color:var(--st-needdoc-ink); --st-dot:var(--st-needdoc-dot);
  box-shadow:inset 0 0 0 1px var(--st-needdoc-ring); }
.st--idle, .status--closed     { background:var(--st-idle-bg);   color:var(--st-idle-ink);   --st-dot:var(--st-idle-dot); }
/* 线索状态（官网「预约演示」→ 运营线索池）：new / following / converted / invalid / assigned */
.st--lead-new       { background:var(--st-wait-bg);   color:var(--st-wait-ink);   --st-dot:var(--st-wait-dot); }
.st--lead-following { background:var(--st-run-bg);    color:var(--st-run-ink);    --st-dot:var(--st-run-dot); }
.st--lead-converted { background:var(--st-done-bg);   color:var(--st-done-ink);   --st-dot:var(--st-done-dot); }
.st--lead-invalid   { background:var(--st-fail-bg);   color:var(--st-fail-ink);   --st-dot:var(--st-fail-dot); }
.st--lead-assigned  { background:var(--st-review-bg); color:var(--st-review-ink); --st-dot:var(--st-review-dot); }

/* ═══════════ 状态色单一真源说明 ═════════════════════════════════════════════
   所有状态色已统一到上方 `.st--*` 选择器分组（单一真源），`.status--*` 为兼容别名，
   与对应 `.st--*` 共用同一分组，视觉恒等、维护零重复。
   JS 映射见 app.js DS.STATUS_COLOR / DS.statusClass()；旧类名由 DS.normalizeStatusTags()
   运行时自动归一。 */

/* 进行中类状态：圆点脉冲（可感知"活着"）*/
.st--run::before, .status--processing::before, .st--diligence::before, .status--diligence::before,
.st--review::before, .status--review::before { animation:st-pulse 1.6s ease-in-out infinite; }
@keyframes st-pulse { 0%,100%{opacity:1; transform:scale(1)} 50%{opacity:.45; transform:scale(.8)} }
@media (prefers-reduced-motion: reduce){ .st::before{ animation:none!important; } }

/* 风险等级药丸（全端统一，取代各页内联定义） */
.risk-pill { display:inline-flex; align-items:center; gap:5px; font-size:var(--fs-xs); font-weight:700;
  padding:2px 9px; border-radius:var(--r-pill); line-height:16px; }
.risk-pill::before { content:""; width:6px; height:6px; border-radius:50%; background:currentColor; }
.risk-low  { background:var(--st-done-bg); color:var(--st-done-ink); }
.risk-mid  { background:var(--st-wait-bg); color:var(--st-wait-ink); }
.risk-high { background:var(--st-fail-bg); color:var(--st-fail-ink); }

/* ============================================================================
   企业端横向顶部导航 (Top Navigation) —— 功能少的端采用横向一级导航
   ============================================================================ */
.topnav { position:sticky; top:0; z-index:50; background:var(--surface); border-bottom:1px solid var(--line); }
.topnav__inner { max-width:var(--maxw); margin:0 auto; height:var(--topbar-h); padding:0 var(--sp-6);
  display:flex; align-items:center; gap:var(--sp-6); }
.topnav__brand { display:flex; align-items:center; gap:10px; font-weight:700; color:var(--ink-900); white-space:nowrap; }
.topnav__brand .logo { width:30px; height:30px; border-radius:8px; background:
  linear-gradient(135deg, var(--accent), color-mix(in srgb,var(--accent) 60%, #6DD0FF));
  display:flex; align-items:center; justify-content:center; color:#fff; font-weight:800; font-size:15px; }
.topnav__nav { display:flex; align-items:center; gap:var(--sp-2); flex:1; min-width:0; overflow-x:auto; }
.topnav__link { position:relative; display:inline-flex; align-items:center; gap:7px; padding:0 var(--sp-4);
  height:var(--topbar-h); color:var(--ink-500); font-weight:500; white-space:nowrap; }
.topnav__link { transition: color var(--dur-1) var(--ease), background-color var(--dur-1) var(--ease); }
.topnav__link:hover { color:var(--ink-900); text-decoration:none; background:var(--surface-2); }
/* 与侧栏 .nav__item.is-active 同一套语言：淡强调底 + 3px 强调条（顶栏放在底边） */
.topnav__link.is-active { color:var(--accent-ink); font-weight:600;
  background:color-mix(in srgb, var(--accent-100) 55%, transparent); }
.topnav__link.is-active::after { content:""; position:absolute; left:var(--sp-3); right:var(--sp-3);
  bottom:0; height:3px; border-radius:3px 3px 0 0; background:var(--accent); }
.topnav__link .i { width:17px; height:17px; }
.topnav__badge { background:var(--danger); color:#fff; font-size:10px; border-radius:var(--r-pill);
  padding:1px 6px; font-weight:700; line-height:14px; }
.topnav__right { display:flex; align-items:center; gap:var(--sp-3); white-space:nowrap; }
@media (max-width:760px){
  .topnav__inner { padding:0 var(--sp-4); gap:var(--sp-3); }
  .topnav__link { padding:0 var(--sp-3); }
  .topnav__right .btn { display:none; }
}

/* ------------------------- 移动端汉堡抽屉（< 768px） ----------------------
   桌面端完全不渲染（.topnav__toggle 默认 display:none）；窄屏时顶栏导航从
   「横向滚动 / 溢出换行」改为左侧滑出抽屉。交互见 app.js DS.initTopnavDrawer。 */
.topnav__toggle {
  display:none; align-items:center; justify-content:center; flex:none;
  width:38px; height:38px; padding:0; border:1px solid var(--line); border-radius:var(--r-md);
  background:var(--surface); color:var(--ink-700); cursor:pointer;
  transition: background-color var(--dur-1) var(--ease), color var(--dur-1) var(--ease);
}
.topnav__toggle:hover { background:var(--surface-2); color:var(--ink-900); }
.topnav__toggle .i { width:20px; height:20px; }
.topnav__toggle .i--close { display:none; }
.topnav__toggle[aria-expanded="true"] .i--menu  { display:none; }
.topnav__toggle[aria-expanded="true"] .i--close { display:block; }
.topnav__scrim {
  position:fixed; inset:0; z-index:59; background:rgba(15,23,42,.44);
  opacity:0; visibility:hidden;
  transition:opacity var(--dur-2) var(--ease), visibility var(--dur-2) var(--ease);
}

@media (max-width:767px){
  .topnav__toggle { display:inline-flex; order:-1; }
  .topnav__inner  { gap:var(--sp-3); }
  .topnav__brand  { flex:1; min-width:0; overflow:hidden; }
  .topnav__brand .brand-tx { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

  .topnav__nav {
    position:fixed; top:0; left:0; bottom:0; z-index:60;
    width:min(80vw, 300px);
    display:flex; flex-direction:column; align-items:stretch; justify-content:flex-start;
    flex:none; gap:2px;
    padding:calc(var(--topbar-h) + var(--sp-4)) var(--sp-3) var(--sp-6);
    background:var(--surface); border-right:1px solid var(--line); box-shadow:var(--sh-pop);
    overflow-y:auto; overflow-x:hidden; -webkit-overflow-scrolling:touch;
    transform:translateX(-100%); visibility:hidden;
    transition:transform var(--dur-2) var(--ease), visibility var(--dur-2) var(--ease);
  }
  .topnav__nav.is-open   { transform:translateX(0); visibility:visible; }
  .topnav__scrim.is-open { opacity:1; visibility:visible; }

  .topnav__link { width:100%; height:46px; padding:0 var(--sp-4); border-radius:var(--r-md); }
  /* 抽屉内活动项的强调条移到左侧，避免底边条与下一项重叠 */
  .topnav__link.is-active::after {
    left:0; right:auto; top:9px; bottom:9px; width:3px; height:auto; border-radius:0 3px 3px 0;
  }
  .topnav__badge { margin-left:auto; }

  /* —— 层叠修正 ——
     .topnav 自身是 position:sticky + z-index:50 的层叠上下文，而 .topnav__scrim
     由 JS 挂在 <body> 上（z-index:59）。二者同处根层叠上下文，59 > 50，
     遮罩会整体盖住 .topnav 子树 —— 抽屉（内部 z-index:60 仅在 .topnav 上下文内生效）
     因此被自己的遮罩压住、变暗且无法点击。抽屉展开时把顶栏整体提到遮罩之上。 */
  body.is-navdrawer-open .topnav { z-index:61; }
  /* 汉堡按钮需高于抽屉面板，否则展开后的「✕ 关闭」被面板盖住无法点击 */
  .topnav__toggle { position:relative; z-index:62; }
}
/* 抽屉打开时锁定页面滚动 */
body.is-navdrawer-open { overflow:hidden; }
@media (prefers-reduced-motion:reduce){
  .topnav__nav, .topnav__scrim { transition:none; }
}

/* ----------------- 代理商端提前抽屉断点（768~899px，仅 agent） -------------
   R11：代理商顶栏 8 项导航在 768~899px 已开始拥挤（横向滚动），把汉堡抽屉
   断点提前到 900px；ent / bank / pos 仍按 <768px 生效，完全不受影响。 */
@media (min-width:768px) and (max-width:899px){
  html[data-theme="agent"] .topnav__toggle { display:inline-flex; order:-1; }
  html[data-theme="agent"] .topnav__inner  { gap:var(--sp-3); }
  html[data-theme="agent"] .topnav__brand  { flex:1; min-width:0; overflow:hidden; }
  html[data-theme="agent"] .topnav__brand .brand-tx { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

  html[data-theme="agent"] .topnav__nav {
    position:fixed; top:0; left:0; bottom:0; z-index:60;
    width:min(80vw, 300px);
    display:flex; flex-direction:column; align-items:stretch; justify-content:flex-start;
    flex:none; gap:2px;
    padding:calc(var(--topbar-h) + var(--sp-4)) var(--sp-3) var(--sp-6);
    background:var(--surface); border-right:1px solid var(--line); box-shadow:var(--sh-pop);
    overflow-y:auto; overflow-x:hidden; -webkit-overflow-scrolling:touch;
    transform:translateX(-100%); visibility:hidden;
    transition:transform var(--dur-2) var(--ease), visibility var(--dur-2) var(--ease);
  }
  html[data-theme="agent"] .topnav__nav.is-open   { transform:translateX(0); visibility:visible; }
  html[data-theme="agent"] .topnav__scrim.is-open { opacity:1; visibility:visible; }

  html[data-theme="agent"] .topnav__link { width:100%; height:46px; padding:0 var(--sp-4); border-radius:var(--r-md); }
  /* 抽屉内活动项的强调条移到左侧，避免底边条与下一项重叠 */
  html[data-theme="agent"] .topnav__link.is-active::after {
    left:0; right:auto; top:9px; bottom:9px; width:3px; height:auto; border-radius:0 3px 3px 0;
  }
  html[data-theme="agent"] .topnav__badge { margin-left:auto; }
  html[data-theme="agent"] .topnav__toggle { position:relative; z-index:62; }
  body.is-navdrawer-open .topnav { z-index:61; }
}

/* ----------------------------- 顶栏用户区（各端通用） --------------------- */
.tb-user { display:inline-flex; align-items:center; gap:8px; }
.tb-user .avatar { width:30px; height:30px; border-radius:50%; background:var(--accent); color:#fff; font-weight:700;
  display:inline-flex; align-items:center; justify-content:center; font-size:13px; flex:none; }
.tb-user__me { display:inline-flex; align-items:center; gap:8px; color:inherit; text-decoration:none; }
.tb-user__me:hover { text-decoration:none; }
.tb-user__me:hover .tb-user__name { color:var(--accent-ink); }
.tb-user__name { font-weight:600; font-size:13px; color:var(--ink-700); }
.tb-user__role { font-size:11px; color:var(--ink-400); margin-left:2px; }
.tb-user .icon-btn { width:32px; height:32px; border-radius:8px; display:inline-flex; align-items:center;
  justify-content:center; color:var(--ink-500); border:1px solid transparent; cursor:pointer; }
.tb-user .icon-btn:hover { background:var(--accent-50); color:var(--accent-ink); }
.tb-user .icon-btn--danger:hover { background:#FEE2E2; color:#DC2626; }

/* ----------------------------- 图表组件 ----------------------------------- */
.chart-flex { display:flex; gap:24px; align-items:center; justify-content:center; flex-wrap:wrap; min-width:0; }
.chart-flex .pie { flex:0 0 160px; width:160px; height:160px; border-radius:50%; }
.pie-legend { display:flex; flex-direction:column; gap:8px; font-size:13px; min-width:120px; }
.pie-legend span { display:inline-flex; align-items:center; gap:8px; color:var(--ink-600); }
.pie-legend i { width:11px; height:11px; border-radius:3px; }

.funnel-row { display:flex; align-items:center; gap:12px; margin-bottom:10px; }
.funnel-row .fl { width:84px; color:var(--ink-500); font-size:13px; flex:0 0 84px; }
/* track：占据 .fl 标签与 .fp 百分比之间的剩余空间；min-width:0 防止被 flex 内容撑破导致溢出 */
.funnel-track { flex:1 1 auto; min-width:0; }
.funnel-row .fbar { flex:0 0 auto; width:100%; height:26px; border-radius:6px; background:var(--accent); color:#fff;
  display:flex; align-items:center; padding-left:10px; font-size:12px; font-weight:600; min-width:60px; }
.funnel-row .fp { width:42px; text-align:right; color:var(--ink-400); font-size:12px; flex:0 0 42px; }

/* ============================================================================
   银行端共享组件
   ============================================================================ */

/* 工作台欢迎区 */
.workbench { background:linear-gradient(135deg,#1B3A8C,#2C5BD0); color:#fff;
  border-radius:var(--r-lg); padding:28px 32px; }
.workbench h1 { color:#fff; font-size:22px; line-height:30px; }
.workbench p { color:rgba(255,255,255,.85); font-size:13px; line-height:20px; margin-top:4px; }
.countdown { background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.28);
  border-radius:8px; padding:6px 12px; font-size:12px; display:inline-flex;
  gap:6px; align-items:center; margin-top:12px; }

/* 客户列表行（修复 bank-due 字段错乱） */
.client-row { display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr auto; gap:16px;
  align-items:center; padding:16px 20px; border-bottom:1px solid var(--line); }
.client-row:hover { background:color-mix(in srgb, var(--accent-100) 40%, var(--surface));
  transition:background-color var(--dur-1) var(--ease); }
.client-row:last-child { border-bottom:none; }
.client-name { font-weight:600; color:var(--ink-900); display:flex; align-items:center; gap:10px; }

/* 尽调抽屉内指标卡片 */
.due-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.due-card { background:var(--surface-2); border:1px solid var(--line);
  border-radius:10px; padding:12px; }
.due-card .k { font-size:12px; color:var(--ink-400); }
.due-card .v { font-size:18px; font-weight:700; color:var(--ink-900); margin-top:2px; }
.drawer__body h4 { color:var(--ink-900); margin:18px 0 8px; font-size:14px; }

/* 抽屉底部操作栏 */
.action-bar { position:sticky; bottom:0; background:var(--surface);
  border-top:1px solid var(--line); padding:14px 20px; display:flex; gap:10px; }

/* 通用显隐 */
.is-hidden { display:none !important; }

/* == DS-COMPONENTS-V3 == */
/* ============================================================================
   交互运行时组件 (app.js / actions.js 依赖) —— v3
   说明：本段仅承载"全交互闭环"所需的新增组件与状态类；
        色彩一律取自设计令牌，禁止硬编码；对比度满足 WCAG AA。
   ============================================================================ */

/* ---------- 间距补齐（阶梯与既有一致） ---------- */
.mt-1{margin-top:var(--sp-1)} .mb-1{margin-bottom:var(--sp-1)}
.mb-2{margin-bottom:var(--sp-2)} .ml-2{margin-left:var(--sp-2)}
.ml-3{margin-left:var(--sp-3)} .mr-2{margin-right:var(--sp-2)}
.t-center{text-align:center}

/* ---------- Toast 语义变体 ---------- */
.toast { border-left:3px solid transparent; animation:toast-in .22s cubic-bezier(.2,.8,.3,1); }
.toast--success .dot { background:var(--success); }
.toast--success  { border-left-color:var(--success); }
.toast--error   .dot { background:var(--danger); }
.toast--error    { border-left-color:var(--danger); }
.toast--warning .dot { background:var(--warning); }
.toast--warning  { border-left-color:var(--warning); }
.toast--info    .dot { background:var(--brand-500); }
.toast--info     { border-left-color:var(--brand-500); }
.toast.is-out { animation:toast-out .18s ease-in forwards; }
@keyframes toast-in  { from{opacity:0; transform:translateY(10px) scale(.98)} to{opacity:1; transform:none} }
@keyframes toast-out { to{opacity:0; transform:translateY(6px) scale(.98)} }
@media (prefers-reduced-motion: reduce){ .toast,.toast.is-out{animation:none!important} }

/* ---------- 表单校验反馈 ---------- */
.field__err { display:block; margin-top:5px; font-size:var(--fs-xs); line-height:var(--lh-xs); color:var(--danger-ink); }
.field__err::before { content:"！"; margin-right:3px; font-weight:700; }
.input.is-invalid, .select.is-invalid, .textarea.is-invalid {
  border-color:var(--danger); box-shadow:0 0 0 3px var(--danger-bg); }
.field.is-invalid .field__label { color:var(--danger-ink); }

/* ---------- 交互态：加载 / 禁用 / 高亮 / 淡出 ---------- */
.btn.is-loading, .btn.is-disabled, .btn[disabled] { pointer-events:none; opacity:.62; }
.btn.is-loading { position:relative; color:transparent !important; }
.btn.is-loading::after { content:""; position:absolute; left:50%; top:50%; width:14px; height:14px;
  margin:-7px 0 0 -7px; border-radius:50%; border:2px solid currentColor; border-top-color:transparent;
  color:var(--surface); animation:spin .7s linear infinite; }
.btn--ghost.is-loading::after, .btn--secondary.is-loading::after { color:var(--accent); }
@keyframes spin { to{transform:rotate(360deg)} }
.is-disabled { opacity:.55; pointer-events:none; }
.is-dimmed { opacity:.45; filter:grayscale(.35); }
.is-flash { animation:row-flash 1.1s ease-out 1; }
@keyframes row-flash { 0%{background:var(--accent-100)} 100%{background:transparent} }
.is-claimed { background:var(--surface-2); }
.is-claimed .client-name { color:var(--ink-400); }
.is-warn { color:var(--warning-ink); }
@media (prefers-reduced-motion: reduce){ .is-flash,.btn.is-loading::after{animation:none!important} }

/* ---------- 上传区（拖拽 + 点击） ---------- */
.upload-zone { border:1.5px dashed var(--line-2); border-radius:var(--r-md); background:var(--surface-2);
  padding:var(--sp-6); text-align:center; color:var(--ink-400); cursor:pointer;
  transition:border-color var(--dur-1) var(--ease), background-color var(--dur-1) var(--ease), color var(--dur-1) var(--ease); }
.upload-zone:hover { border-color:var(--accent); color:var(--accent-ink); background:var(--accent-50); }
.upload-zone.is-over { border-color:var(--accent); border-style:solid; background:var(--accent-100); color:var(--accent-ink); }
.upload-zone .i { width:26px; height:26px; margin-bottom:6px; }
.up-item { display:flex; align-items:center; gap:10px; padding:9px 12px; border:1px solid var(--line);
  border-radius:var(--r-sm); background:var(--surface); margin-top:var(--sp-2); font-size:var(--fs-sm); }
.up-item .nm { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--ink-700); }
.up-item .i { width:16px; height:16px; flex:none; color:var(--ink-400); }

/* ---------- 快捷问题 Chip / 会话补充 ---------- */
.chip { display:inline-flex; align-items:center; gap:5px; padding:5px 12px; border-radius:var(--r-pill);
  border:1px solid var(--line-2); background:var(--surface); color:var(--ink-600);
  font-size:var(--fs-xs); line-height:16px; cursor:pointer; font-family:inherit;
  transition:border-color var(--dur-1) var(--ease), color var(--dur-1) var(--ease), background-color var(--dur-1) var(--ease); }
.chip:hover { border-color:var(--accent); color:var(--accent-ink); background:var(--accent-50); }
.chip.is-active { border-color:var(--accent); background:var(--accent-100); color:var(--accent-ink); font-weight:600; }
.chat__chips { display:flex; flex-wrap:wrap; gap:6px; padding:0 var(--sp-4) var(--sp-3); }
.is-typing { display:inline-flex; gap:3px; align-items:center; }
.is-typing i { width:5px; height:5px; border-radius:50%; background:var(--ink-300);
  animation:typing 1s infinite ease-in-out; }
.is-typing i:nth-child(2){ animation-delay:.15s } .is-typing i:nth-child(3){ animation-delay:.3s }
@keyframes typing { 0%,60%,100%{opacity:.3; transform:translateY(0)} 30%{opacity:1; transform:translateY(-3px)} }

/* ---------- 折叠面板（FAQ / 帮助中心） ---------- */
.acc { border:1px solid var(--line); border-radius:var(--r-md); overflow:hidden; background:var(--surface); }
.acc__item { border-bottom:1px solid var(--line); }
.acc__item:last-child { border-bottom:none; }
.acc__q { width:100%; text-align:left; font-family:inherit; font-size:var(--fs-body); font-weight:600;
  color:var(--ink-700); background:none; border:none; padding:14px var(--sp-5); cursor:pointer;
  display:flex; align-items:center; justify-content:space-between; gap:12px; }
.acc__q:hover { background:var(--surface-2); }
.acc__q::after { content:""; width:8px; height:8px; flex:none; border-right:2px solid var(--ink-300);
  border-bottom:2px solid var(--ink-300); transform:rotate(45deg) translateY(-2px);
  transition:transform var(--dur-2) var(--ease); }
.acc__item.is-open .acc__q { color:var(--accent-ink); }
.acc__item.is-open .acc__q::after { transform:rotate(-135deg) translateY(-2px); }
.acc__a { padding:0 var(--sp-5) var(--sp-4); color:var(--ink-500); font-size:var(--fs-sm); line-height:22px; }

/* ---------- 选择卡（模板 / 场景 / 方案 单选） ---------- */
.pick-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(160px,1fr)); gap:var(--sp-3); }
.pick-card { border:1.5px solid var(--line); border-radius:var(--r-md); background:var(--surface);
  padding:var(--sp-4); cursor:pointer; text-align:left; font-family:inherit;
  transition:border-color var(--dur-1) var(--ease), background-color var(--dur-1) var(--ease), box-shadow var(--dur-2) var(--ease); }
.pick-card:hover { border-color:var(--line-2); background:var(--surface-2); }
.pick-card.is-active { border-color:var(--accent); background:var(--accent-50); }
.pick-card .t { font-weight:600; color:var(--ink-900); font-size:var(--fs-sm); }
.pick-card .d { color:var(--ink-400); font-size:var(--fs-xs); margin-top:3px; line-height:17px; }
.pick-card .i { width:20px; height:20px; color:var(--accent); margin-bottom:6px; }

/* ---------- 支付 / 充值 ---------- */
.pay-tabs { display:inline-flex; gap:var(--sp-2); margin-bottom:var(--sp-4); }
.qr-box { display:flex; flex-direction:column; align-items:center; gap:10px; padding:var(--sp-5);
  border:1px solid var(--line); border-radius:var(--r-md); background:var(--surface-2); }
.qr-fake { width:168px; height:168px; border-radius:var(--r-sm); background:var(--surface);
  border:1px solid var(--line-2); display:grid; grid-template-columns:repeat(11,1fr);
  grid-template-rows:repeat(11,1fr); gap:2px; padding:10px; }
.qr-fake span { background:var(--ink-900); border-radius:1px; }
.qr-fake span.ex { background:transparent; }

/* ---------- 进度条扩展：双色（完成 / 失败） ---------- */
.bar--split { display:flex; }
.bar--split .bar__fill { background:var(--success); }
.bar__fail { height:100%; background:var(--danger); }

/* ---------- 复选组 / 权限矩阵 ---------- */
.chk-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(150px,1fr)); gap:var(--sp-2) var(--sp-4); }
.chk-grid label { display:flex; align-items:center; gap:7px; font-size:var(--fs-sm); color:var(--ink-600); cursor:pointer; }

/* ---------- 文档预览（合同 / 影像件） ---------- */
.doc-preview { background:var(--surface-3); border-radius:var(--r-md); padding:var(--sp-4);
  max-height:420px; overflow:auto; }
.doc-preview__page { background:var(--surface); border:1px solid var(--line); border-radius:var(--r-sm);
  padding:var(--sp-6) var(--sp-5); font-size:var(--fs-sm); line-height:24px; color:var(--ink-600);
  position:relative; }
.doc-preview__page + .doc-preview__page { margin-top:var(--sp-3); }
.doc-preview__page h5 { text-align:center; color:var(--ink-900); font-size:var(--fs-h3); margin:0 0 var(--sp-4); }
.watermark { position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  pointer-events:none; font-size:34px; font-weight:800; color:var(--ink-900); opacity:.05;
  transform:rotate(-22deg); letter-spacing:6px; }

/* ---------- AI 诊断结论框 ---------- */
.diag-box { border:1px solid var(--accent-100); background:var(--accent-50); border-radius:var(--r-md);
  padding:var(--sp-4); color:var(--ink-600); font-size:var(--fs-sm); line-height:22px; }
.diag-box h5 { color:var(--accent-ink); font-size:var(--fs-sm); margin:0 0 6px; display:flex; align-items:center; gap:6px; }
.diag-box .i { width:16px; height:16px; }

/* ---------- 规则 / 权重编辑行 ---------- */
.rule-row, .weight-row { display:flex; align-items:center; gap:var(--sp-3); padding:10px 0;
  border-bottom:1px dashed var(--line); }
.rule-row:last-child, .weight-row:last-child { border-bottom:none; }
.rule-row .l, .weight-row .l { flex:0 0 108px; font-size:var(--fs-sm); color:var(--ink-600); }
.weight-row .v { flex:0 0 46px; text-align:right; font-weight:700; color:var(--ink-900);
  font-variant-numeric:tabular-nums; font-size:var(--fs-sm); }
.range { flex:1; -webkit-appearance:none; appearance:none; height:4px; border-radius:var(--r-pill);
  background:var(--surface-3); outline:none; }
.range::-webkit-slider-thumb { -webkit-appearance:none; width:16px; height:16px; border-radius:50%;
  background:var(--accent); border:2px solid var(--surface); box-shadow:var(--sh-1); cursor:pointer; }
.range::-moz-range-thumb { width:14px; height:14px; border-radius:50%; background:var(--accent);
  border:2px solid var(--surface); cursor:pointer; }
.range:focus-visible { box-shadow:0 0 0 3px var(--accent-100); }

/* ---------- 轻量柱状图（趋势 / 分布） ---------- */
.chart-bars { display:flex; align-items:flex-end; gap:var(--sp-2); height:132px; padding-top:var(--sp-2); }
.chart-bars__col { flex:1; display:flex; flex-direction:column; align-items:center; gap:6px; min-width:0; }
.chart-bars__bar { width:100%; max-width:34px; border-radius:5px 5px 0 0; background:var(--accent);
  transition:height var(--dur-3) var(--ease); }
.chart-bars__col .l { font-size:var(--fs-xs); color:var(--ink-400); white-space:nowrap; }

/* ---------- 分页器 ---------- */
.pager { display:flex; align-items:center; gap:6px; justify-content:flex-end; padding:var(--sp-4) var(--sp-5); }
.pager button { min-width:32px; height:32px; padding:0 9px; border:1px solid var(--line-2);
  background:var(--surface); border-radius:var(--r-sm); font-family:inherit; font-size:var(--fs-sm);
  color:var(--ink-600); cursor:pointer;
  transition:border-color var(--dur-1) var(--ease), color var(--dur-1) var(--ease), background-color var(--dur-1) var(--ease); }
.pager button:hover { border-color:var(--accent); color:var(--accent-ink); background:var(--accent-50); }
.pager button.is-active { background:var(--accent); border-color:var(--accent); color:#fff; font-weight:600; }
.pager button[disabled] { opacity:.45; pointer-events:none; }
.pager .info { margin-right:auto; font-size:var(--fs-sm); color:var(--ink-400); }

/* ============================================================================
   代理商端（紫色主题 #7C3AED）—— 左侧 256px 紫色侧栏 + 白底主区（V2.2）
   ============================================================================ */
[data-theme="agent"] { --accent:#7C3AED; --accent-700:#6D28D9; --accent-100:#F3E8FF;
  --accent-50:#F8F4FF; --accent-ink:#6D28D9;
  --accent-shadow:rgba(124,58,237,.45); --accent-shadow-strong:rgba(124,58,237,.55); --accent-shadow-soft:rgba(124,58,237,.35);
  --accent-bright:#A78BFA; }
.ag-layout { display:flex; min-height:100vh; }
.ag-sidebar { width:256px; flex:0 0 256px; background:#7C3AED; color:#fff;
  display:flex; flex-direction:column; position:sticky; top:0; height:100vh; overflow-y:auto; z-index:50; }
.ag-brand { display:flex; align-items:center; gap:10px; padding:20px; font-size:18px; font-weight:700;
  color:#fff; border-bottom:1px solid rgba(255,255,255,.14); }
.ag-brand .logo { width:34px; height:34px; border-radius:10px; background:#fff; color:#7C3AED;
  display:flex; align-items:center; justify-content:center; font-weight:800; font-size:16px; flex:none; }
.ag-group { padding:16px 20px 6px; font-size:11px; text-transform:uppercase; letter-spacing:1px; color:rgba(255,255,255,.5); }
.ag-nav { position:relative; display:flex; align-items:center; gap:10px; padding:10px 20px; color:rgba(255,255,255,.82);
  text-decoration:none; font-size:14px; cursor:pointer;
  transition:background-color var(--dur-1) var(--ease), color var(--dur-1) var(--ease); }
.ag-nav:hover { background:rgba(255,255,255,.12); color:#fff; text-decoration:none; }
.ag-nav.is-active { background:#6D28D9; color:#fff; font-weight:600; border-left:3px solid #fff; }
.ag-nav .i { width:18px; height:18px; flex:none; }
.ag-nav .badge { margin-left:auto; background:#F59E0B; color:#fff; font-size:11px; border-radius:999px;
  padding:1px 7px; font-weight:700; }
.ag-spacer { flex:1; min-height:12px; }
.ag-user { padding:10px 20px; font-size:12px; color:rgba(255,255,255,.72); border-top:1px solid rgba(255,255,255,.12); }
.ag-main { flex:1; min-width:0; padding:24px; background:var(--surface-2); }
.ag-kpi-row { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin-bottom:20px; }
.ag-kpi { background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); padding:18px 20px;
  position:relative; overflow:hidden; min-width:0; box-shadow:var(--sh-card); }
.ag-kpi::before { content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background:#7C3AED; }
.ag-kpi__num { font-size:28px; font-weight:700; color:var(--ink-900); white-space:nowrap; }
.ag-kpi__label { font-size:13px; color:var(--ink-500); margin-top:4px; }
.btn--purple { background:#7C3AED; color:#fff; }
.btn--purple:hover { background:#6D28D9; }
.ag-table table { width:100%; border-collapse:collapse; font-size:14px; }
.ag-table th { text-align:left; padding:10px 12px; border-bottom:2px solid var(--line);
  color:var(--ink-500); font-weight:600; font-size:12px; }
.ag-table td { padding:10px 12px; border-bottom:1px solid var(--line); vertical-align:middle; }
.ag-table tr:hover td { background:color-mix(in srgb, var(--accent-100) 45%, var(--surface));
  transition:background-color var(--dur-1) var(--ease); }
@media (max-width:1024px){ .ag-kpi-row{grid-template-columns:repeat(2,1fr)} }
@media (max-width:760px){ .ag-sidebar{display:none} .ag-main{padding:16px} .ag-kpi-row{grid-template-columns:1fr} }

/* ============================================================================
   企业贷前调查报告 / 贷款评测（运营端企业详情 drawer）
   —— 复用 .kv / .card / .st / .risk-pill，仅补充排版所需的极小样式
   ============================================================================ */
/* 说明条：此前仅定义了 .note .i，补齐基础样式（全端通用） */
.note { background:var(--surface-2); border:1px solid var(--line); border-radius:var(--r-md);
  padding:var(--sp-3) var(--sp-4); font-size:var(--fs-sm); line-height:var(--lh-sm); color:var(--ink-600); }

/* 报告分组小标题 */
.doc-sec { display:flex; align-items:center; gap:6px; margin:var(--sp-5) 0 var(--sp-2);
  font-size:var(--fs-sm); font-weight:700; color:var(--ink-900); }
.doc-sec:first-child { margin-top:0; }
.doc-sec .i { width:16px; height:16px; stroke-width:1.8; color:var(--ink-400); }

/* 报告正文：要点列表 + 段落 */
.doc-list { margin:var(--sp-2) 0 0; padding-left:18px; }
.doc-list li { font-size:var(--fs-sm); line-height:20px; color:var(--ink-600); margin-bottom:4px; }
.doc-list li::marker { color:var(--accent); }
.doc-para { margin:var(--sp-2) 0 0; font-size:var(--fs-sm); line-height:21px; color:var(--ink-600);
  white-space:pre-line; }

/* 匹配产品条目 */
.match-item { border:1px solid var(--line); border-radius:var(--r-md); background:var(--surface);
  padding:var(--sp-3) var(--sp-4); margin-bottom:var(--sp-3); }
.match-item:last-child { margin-bottom:0; }
.match-item__head { display:flex; align-items:center; gap:var(--sp-2); flex-wrap:wrap; }
.match-item__name { font-weight:600; color:var(--ink-900); font-size:var(--fs-sm); }
.match-item__bank { font-size:var(--fs-xs); color:var(--ink-400); }
.match-item__head .st, .match-item__head .tag { margin-left:auto; }
.match-item__meta { display:flex; gap:var(--sp-4); flex-wrap:wrap; margin-top:6px;
  font-size:var(--fs-xs); line-height:var(--lh-xs); color:var(--ink-500); }
.match-item__meta b { color:var(--ink-900); font-weight:700; }
.match-item__reason { margin-top:6px; font-size:var(--fs-xs); line-height:18px; color:var(--ink-500); }

/* 报告面板顶部操作行 */
.doc-bar { display:flex; align-items:center; gap:var(--sp-2); flex-wrap:wrap; margin-bottom:var(--sp-3); }
.doc-bar__spacer { margin-left:auto; }

/* drawer 内多标签（5 个）横向可滚动，避免 480px 宽度下换行错位 */
.drawer__body .tabs { gap:var(--sp-4); overflow-x:auto; scrollbar-width:none; }
.drawer__body .tabs::-webkit-scrollbar { display:none; }
.drawer__body .tabs button { flex:none; white-space:nowrap; }

@media (max-width:520px){
  .match-item__head .st, .match-item__head .tag { margin-left:0; }
  .match-item__meta { gap:var(--sp-3); }
}

/* ============================================================================
   v3 收尾：粘性表头作用域约束 + 浮层内卡片降噪
   —— 抽屉 / 弹窗内部自带滚动容器，表头再 sticky 会错位，这里显式关掉。
   ============================================================================ */
.drawer__body .table-wrap .table thead th,
.modal__body  .table-wrap .table thead th { position:static; }
/* 浮层内部的卡片不再叠加外阴影，避免「阴影套阴影」显脏 */
.modal .card, .drawer .card, .modal .kpi, .drawer .kpi { box-shadow:none; }
/* 无表头吸附需求的表格：加 .table-wrap--plain 关闭 sticky */
.table-wrap--plain .table thead th { position:static; }

/* 焦点可见性：强调色描边在任何底色上都有 3:1 以上对比，键盘用户不迷路 */
:focus-visible { transition:none; }
.btn:focus-visible, .icon-btn:focus-visible, .nav__item:focus-visible, .topnav__link:focus-visible {
  outline:3px solid color-mix(in srgb, var(--accent) 55%, transparent); outline-offset:2px; }
