:root {
  --bg: #f4f6fb;
  --card: #ffffff;
  --primary: #4f6ef7;
  --primary-d: #3a55e0;
  --text: #1f2733;
  --muted: #8a93a6;
  --border: #eef0f5;
  --danger: #ef4444;
  --star: #f5b301;
  --shadow-sm: 0 1px 3px rgba(16, 24, 40, .06);
  --shadow: 0 12px 32px rgba(16, 24, 40, .10);
}
* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", "Segoe UI", sans-serif;
  background: var(--bg);
  color: var(--text);
  -webkit-font-smoothing: antialiased;
}
.hidden { display: none !important; }

/* ============ 登录 ============ */
/* 2026-09-21 ts135（老板拍板「登录页面和开机动画做的一样，把之前的去掉」）：
   旧骑手主题（login_bg.jpg 渲染图 + 橙色光轨 + 橙色按钮）整体退场，
   登录页换成开机动画同款深空科技视觉——#04060c 深空 + 青色网格 +
   青/靛双色呼吸光晕 + 粒子网络画布（#lg-net，index.html 内联脚本驱动）。
   注意：这里必须用 .login-wrap 自身做背景，不能改 body（主应用仍是浅色主题）。 */
.login-wrap {
  min-height: 100vh; display: flex; flex-direction: column;
  align-items: center; justify-content: center; padding: 4vh 16px;
  position: relative; overflow: hidden;
  background: #04060c;
}
/* 粒子网络画布（canvas 在 index.html，铺满登录页，网格之上、卡片之下） */
#lg-net { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; }
/* ① 底层：青色科技网格（与开机动画同款，缓慢漂移 + 径向渐隐） */
.login-wrap::after {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background-image:
    linear-gradient(rgba(56, 189, 248, .05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(56, 189, 248, .05) 1px, transparent 1px);
  background-size: 46px 46px;
  -webkit-mask-image: radial-gradient(ellipse 90% 75% at 50% 45%, #000 30%, transparent 100%);
  mask-image: radial-gradient(ellipse 90% 75% at 50% 45%, #000 30%, transparent 100%);
  animation: lgGridDrift 14s linear infinite;
}
@keyframes lgGridDrift { to { background-position: 46px 46px, 46px 46px; } }
/* ② 顶层装饰：青 / 靛双色呼吸光晕（与开机动画 glow-a/b 同款） */
.login-glow {
  position: absolute; pointer-events: none; z-index: 1; border-radius: 50%;
  filter: blur(90px); opacity: .16;
  animation: lgBreathe 6s ease-in-out infinite alternate;
}
.login-glow.l {
  left: -12vw; top: -14vh; width: 46vmax; height: 46vmax;
  background: radial-gradient(circle, #0ea5e9, transparent 65%);
}
.login-glow.r {
  right: -12vw; bottom: -14vh; width: 42vmax; height: 42vmax;
  background: radial-gradient(circle, #7c3aed, transparent 65%);
  animation-delay: -3s; animation-direction: alternate-reverse;
}
@keyframes lgBreathe { from { opacity: .10; } to { opacity: .22; } }
/* 页面顶部：完整骑手 LOGO + 品牌行（参考图布局：品牌在面板上方） */
.login-head {
  position: relative; z-index: 3; text-align: center; margin-bottom: 24px;
}
.login-logo {
  width: 288px; max-width: 76vw; height: auto; display: block; margin: 0 auto;
  filter: drop-shadow(0 10px 30px rgba(255, 122, 26, .45));
}
.login-brand {
  margin-top: 2px; color: #d5e4ff; font-size: 15px; font-weight: 600;
  letter-spacing: 6px; text-indent: 6px;
  text-shadow: 0 2px 12px rgba(120, 180, 255, .45);
}
.login-card {
  position: relative; z-index: 3;
  width: 400px; max-width: 92vw; border-radius: 18px;
  padding: 34px 38px 26px; text-align: center;
  background: rgba(10, 16, 30, .72);
  border: 1px solid rgba(56, 189, 248, .16);
  box-shadow:
    0 24px 70px rgba(0, 0, 0, .55),
    inset 0 1px 0 rgba(148, 197, 253, .08);
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
  animation: lgCardIn .7s cubic-bezier(.2, .7, .2, 1);
}
@keyframes lgCardIn { from { transform: translateY(16px); opacity: 0; } to { transform: none; opacity: 1; } }
/* 卡片顶边青色高光 */
.login-card::before {
  content: ""; position: absolute; left: 12%; right: 12%; top: 0; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(125, 211, 252, .85), transparent);
}
/* ts135 卡片头：IA 品牌字 + 系统名 + 署名（开机动画同款青靛渐变），
   旧「智能管理平台」面板头随 ts135 退场（.panel-title 样式已删） */
.lc-logo {
  font-size: 34px; font-weight: 900; letter-spacing: .04em; line-height: 1;
  background: linear-gradient(120deg, #22d3ee 15%, #818cf8 85%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: #22d3ee;
  filter: drop-shadow(0 0 14px rgba(34, 211, 238, .35));
}
.lc-title { margin-top: 7px; color: #eef4ff; font-size: 16.5px; font-weight: 700; letter-spacing: .12em; }
.lc-sub { margin: 5px 14px 0; color: rgba(148, 163, 184, .6); font-size: 11.5px; letter-spacing: .16em; }
#login-form { display: flex; flex-direction: column; gap: 13px; }
#login-form input {
  padding: 13px 15px; font-size: 15px; border-radius: 11px; transition: .18s;
  color: #cbd5e1; background: rgba(15, 23, 42, .6);
  border: 1px solid rgba(71, 85, 105, .45);
}
#login-form input::placeholder { color: rgba(100, 116, 139, .85); }
#login-form input:focus {
  outline: none; border-color: rgba(34, 211, 238, .85);
  box-shadow: 0 0 0 4px rgba(34, 211, 238, .14), 0 0 22px rgba(34, 211, 238, .18);
  background: rgba(12, 20, 36, .9);
}
/* 浏览器自动填充时不要变回白底（否则深色卡片里突兀） */
#login-form input:-webkit-autofill,
#login-form input:-webkit-autofill:focus {
  -webkit-text-fill-color: #e8f0ff;
  -webkit-box-shadow: 0 0 0 1000px #0a101e inset;
  transition: background-color 9999s ease-out 0s;
}
#login-form button {
  margin-top: 9px; padding: 13px; border: none; border-radius: 11px; cursor: pointer;
  font-size: 16px; font-weight: 700; letter-spacing: 3px; color: #fff;
  background: linear-gradient(120deg, #0891b2 0%, #6366f1 100%);
  box-shadow: 0 10px 26px rgba(34, 211, 238, .22), 0 0 0 1px rgba(125, 211, 252, .28) inset;
  transition: .18s;
}
#login-form button:hover {
  filter: brightness(1.08); transform: translateY(-1px);
  box-shadow: 0 14px 32px rgba(34, 211, 238, .32), 0 0 0 1px rgba(125, 211, 252, .42) inset;
}
#login-form button:active { transform: translateY(0); }
#login-form button:disabled { filter: grayscale(.5) brightness(.8); cursor: not-allowed; transform: none; }
.error { color: #ff8a8a; font-size: 13px; min-height: 16px; margin: 6px 0 0; }
/* 底部协议文案（参考图同款小字） */
.agreement { margin: 14px 0 0; font-size: 12px; color: #6b7f9e; letter-spacing: .5px; }
/* 深色卡片内的兼容提示同样走深色 */
.login-card .ie-warning { background: rgba(255, 180, 60, .10); border-color: rgba(255, 180, 60, .35); }
.login-card .ie-warning .ie-title { color: #ffc46b; }
.login-card .ie-warning .ie-desc, .login-card .ie-warning .ie-step { color: #c9d6ea; }
.login-card .ie-warning .ie-step b, .login-card .ie-warning .ie-desc b { color: #ffd79a; }

/* ============ 总体布局：侧边栏 + 内容区 ============ */
.app { display: flex; min-height: 100vh; }

.sidebar {
  width: 248px; flex: none; color: #aeb7cc;
  background: linear-gradient(180deg, #1f2940 0%, #141c2e 100%);
  display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh;
}
.side-brand {
  display: flex; align-items: center; gap: 11px; padding: 22px 22px 18px;
  font-weight: 800; font-size: 16.5px; color: #fff; letter-spacing: .3px;
}
.brand-ico { font-size: 24px; }
/* 2026-09-17：侧栏换骑手 LOGO（深色侧栏直接叠透明 PNG，高度对齐原 emoji） */
.brand-ico-img {
  height: 30px; width: auto; flex: none;
  filter: drop-shadow(0 2px 8px rgba(255, 122, 26, .32));
}
/* ===== 侧栏滚动 =====
   .sidebar 是 height:100vh 的 flex 列容器，.side-nav 撑不下时必须由它自己滚，
   否则 flex 子项默认 min-height:auto 不肯收缩，内容会溢出到 .sidebar 的渐变框
   外面去（看着就像"分组空了/样式坏了"）。min-height:0 是这儿的命门。 */
.side-nav {
  flex: 1; min-height: 0; overflow-y: auto; overflow-x: hidden;
  padding: 6px 14px 14px; display: flex; flex-direction: column; gap: 5px;
}
.side-nav::-webkit-scrollbar { width: 8px; }
.side-nav::-webkit-scrollbar-track { background: transparent; }
.side-nav::-webkit-scrollbar-thumb {
  background: rgba(255,255,255,.16); border-radius: 4px;
}
.side-nav::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,.3); }
/* 侧栏底部（用户信息 / 改密退出）固定不压缩，滚的只有中间的导航区 */
.side-user, .su-actions { flex: none; }
.side-nav .tab {
  display: flex; align-items: center; gap: 12px; width: 100%; padding: 12.5px 14px;
  border: none; background: transparent; color: #b6bdc9; font-size: 16px; font-weight: 600;
  border-radius: 11px; cursor: pointer; text-align: left; transition: .15s;
}
.side-nav .tab .ico { font-size: 18.5px; width: 24px; text-align: center; }
.side-nav .tab:hover { background: rgba(255, 255, 255, .07); color: #fff; }
.side-nav .tab.active {
  background: rgba(79, 110, 247, .20); color: #fff; box-shadow: inset 3px 0 0 var(--primary);
}
/* 业绩汇报区：外链入口，样式与普通菜单一致 */
/* 内嵌子页面（业绩汇报区 / 运营中心）：iframe 撑满内容区，高度随视口自适应。
   ask-26d：原先业绩区是 calc(100vh - 150px)、运营中心是 calc(100vh - 96px)，
   两个内嵌页一高一矮差 54px，切换 tab 时内容区会跳动、业绩区底部还留一截白。
   现在统一成同一个高度写在基类上 —— 以后新增内嵌页也自动一致。
   子页面在嵌入态已隐藏自己的侧栏和标题，所以贴边铺满即可，
   背景色与内容区一致，视觉上连成一片，不露出"系统里套系统"的接缝。 */
.pz-frame {
  width: 100%; height: 100%; min-height: calc(100vh - 96px);
  border: 0; display: block; background: #f3f5fb;
}
#tab-perfzone.tab-pane.active { display: flex; flex-direction: column; padding: 0; }
#tab-perfzone { padding: 0; }
#tab-ops.tab-pane.active { display: flex; flex-direction: column; padding: 0; }
#tab-ops { padding: 0; }
/* ts171：店铺价值速算器 iframe 页签，同 perfzone/ops 贴边铺满 */
#tab-shopcalc.tab-pane.active { display: flex; flex-direction: column; padding: 0; }
#tab-shopcalc { padding: 0; }
.side-user {
  margin-top: auto; padding: 14px 16px; border-top: 1px solid rgba(255, 255, 255, .08);
  display: flex; align-items: center; gap: 11px;
}
.su-avatar {
  width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, .12);
  display: flex; align-items: center; justify-content: center; font-size: 18px; flex: none;
}
.su-info { flex: 1; min-width: 0; }
.su-name { color: #fff; font-size: 13.5px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.role-badge { font-size: 11px; padding: 1px 8px; border-radius: 20px; background: rgba(255, 255, 255, .14); color: #dfe5f2; }
.role-badge.admin { background: rgba(245, 179, 1, .22); color: #ffd166; }
.su-actions { display: flex; gap: 8px; padding: 0 16px 16px; }
.su-actions .btn-ghost { flex: 1; text-align: center; }

.content { flex: 1; min-width: 0; height: 100vh; overflow: auto; background: var(--bg); }
.content-head {
  position: sticky; top: 0; z-index: 10; background: rgba(244, 246, 251, .96);
  padding: 20px 30px 14px;
  display: none; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--border);
}
.content-head h1 { margin: 0; font-size: 20px; font-weight: 800; letter-spacing: .2px; }
.page-sub { margin: 5px 0 0; color: var(--muted); font-size: 13px; }

.tab-pane { display: none; padding: 24px 30px; font-size: 15px; }
.tab-pane.active { display: block; }

/* 通用按钮 */
.btn-primary {
  background: var(--primary); color: #fff; border: none; padding: 10px 18px; border-radius: 10px;
  cursor: pointer; font-size: 14px; font-weight: 600; transition: .15s;
}
.btn-primary:hover { background: var(--primary-d); }
.btn-ghost {
  background: transparent; border: 1px solid var(--border); padding: 7px 14px; border-radius: 8px;
  cursor: pointer; color: var(--text); font-size: 13px; transition: .15s;
}
.btn-ghost:hover { border-color: var(--primary); color: var(--primary); }
.btn-sm { padding: 5px 11px; font-size: 12.5px; }
.su-actions .btn-ghost { border-color: rgba(255, 255, 255, .22); color: #aeb7cc; padding: 5px 10px; }
.su-actions .btn-ghost:hover { border-color: #fff; color: #fff; }
.mini-btn {
  border: 1px solid var(--border); background: #fff; color: var(--muted); border-radius: 8px;
  padding: 6px 12px; font-size: 12.5px; cursor: pointer; transition: .15s;
}
.mini-btn:hover { border-color: var(--primary); color: var(--primary); }
.copy-btn { color: #fff; border-color: var(--primary); background: var(--primary); font-weight: 600; }
.copy-btn:hover { background: var(--primary-d); border-color: var(--primary-d); color: #fff; }
.del-btn { color: var(--danger); border-color: #f3c6c8; }
.del-btn:hover { background: var(--danger); color: #fff; border-color: var(--danger); }

.toolbar { display: flex; gap: 12px; align-items: center; margin-bottom: 18px; flex-wrap: wrap; }
.toolbar select, .toolbar input[type=search] {
  padding: 10px 14px; border: 1px solid var(--border); border-radius: 10px; font-size: 14px; background: #fff; transition: .15s;
}
.toolbar select:focus, .toolbar input[type=search]:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 4px rgba(79, 110, 247, .12); }
.toolbar input[type=search] { min-width: 260px; }
.view-count-hint { color: var(--muted); font-size: 13px; margin-left: auto; }
.empty { text-align: center; color: var(--muted); padding: 48px 0; }

/* ============ 话术库（客服宝式） ============ */
.kb-layout { display: flex; gap: 22px; align-items: flex-start; }
.kb-side {
  width: 224px; flex: none; background: var(--card); border: 1px solid var(--border);
  border-radius: 16px; padding: 14px; position: sticky; top: 92px; max-height: calc(100vh - 116px); overflow: auto;
  box-shadow: var(--shadow-sm);
}
.kb-side-title { font-size: 12px; color: var(--muted); font-weight: 700; padding: 4px 8px 10px; letter-spacing: .5px; }
.kb-nav { list-style: none; margin: 0; padding: 0; }
.kb-nav-item {
  display: flex; align-items: center; gap: 9px; padding: 9px 11px; border-radius: 10px; cursor: pointer;
  font-size: 14px; color: var(--text); margin-bottom: 3px; transition: .15s;
}
.kb-nav-item:hover { background: #f3f6ff; }
.kb-nav-item.active { background: #eef2ff; color: var(--primary); font-weight: 600; }
.kb-nav-ico { width: 18px; text-align: center; }
.kb-nav-label { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kb-nav-count { font-size: 12px; color: var(--muted); background: #f0f2f7; border-radius: 20px; padding: 1px 8px; }
.kb-nav-item.active .kb-nav-count { background: #d6e2ff; color: var(--primary); }
.kb-nav-sep { font-size: 11px; color: var(--muted); padding: 12px 8px 6px; letter-spacing: 1px; }

.kb-main { flex: 1; min-width: 0; }
.kb-search { position: relative; margin-bottom: 14px; }
.kb-search-ico { position: absolute; left: 16px; top: 50%; transform: translateY(-50%); font-size: 16px; opacity: .55; }
.kb-search input {
  width: 100%; padding: 15px 16px 15px 46px; border: 1px solid var(--border); border-radius: 14px;
  font-size: 15px; background: #fff; box-shadow: var(--shadow-sm); transition: .15s;
}
.kb-search input:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 4px rgba(79, 110, 247, .12); }
.kb-toolbar { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.kb-toolbar .view-count-hint { margin-left: 0; }
.kb-toolbar .btn-primary { margin-left: auto; }

.kb-list { display: flex; flex-direction: column; gap: 14px; }
.kb-card {
  background: var(--card); border: 1px solid var(--border); border-radius: 16px; padding: 18px 20px;
  box-shadow: var(--shadow-sm); transition: .18s;
}
.kb-card:hover { box-shadow: var(--shadow); transform: translateY(-2px); border-color: #dde3f0; }
.kb-card.fav { border-color: #ffe1a3; }
.kb-card-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.kb-cat { font-size: 12px; color: var(--primary); background: #eef2ff; padding: 3px 10px; border-radius: 20px; font-weight: 600; }
.kb-star { font-size: 20px; cursor: pointer; color: #cbd2e0; line-height: 1; user-select: none; transition: .15s; }
.kb-star.on { color: var(--star); }
.kb-star:hover { transform: scale(1.2); }
.kb-q { display: flex; gap: 10px; align-items: flex-start; font-size: 15.5px; font-weight: 700; color: var(--text); cursor: pointer; line-height: 1.5; }
.q-mark {
  flex: none; background: var(--primary); color: #fff; font-size: 12px; font-weight: 700;
  width: 22px; height: 22px; border-radius: 7px; display: inline-flex; align-items: center; justify-content: center; margin-top: 1px;
}
.kb-a {
  color: #475066; font-size: 14.5px; line-height: 1.75; margin: 12px 0 0; padding: 12px 14px;
  background: #f7f9fc; border-radius: 12px; border-left: 3px solid #e3e8f3; cursor: pointer;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.kb-card.open .kb-a { -webkit-line-clamp: unset; }
.kb-card-foot {
  display: flex; align-items: center; gap: 12px; margin-top: 14px; font-size: 12.5px; color: var(--muted); flex-wrap: wrap;
}
.kb-views { flex: none; }
.kb-kw { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kb-actions { margin-left: auto; display: flex; gap: 8px; }
mark { background: #fff1a8; padding: 0 2px; border-radius: 3px; color: inherit; }

/* ============ 案例库（媒体） ============ */
.grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 18px; }
.card { background: var(--card); border: 1px solid var(--border); border-radius: 16px; overflow: hidden; box-shadow: var(--shadow-sm); transition: .18s; }
.card:hover { box-shadow: var(--shadow); transform: translateY(-2px); }
.media-box { position: relative; background: #000; aspect-ratio: 16/10; display: flex; align-items: center; justify-content: center; }
.media-box video, .media-box img { width: 100%; height: 100%; object-fit: cover; display: block; }
.kind-tag {
  position: absolute; top: 10px; right: 10px; background: rgba(0, 0, 0, .55); color: #fff; font-size: 11px;
  padding: 3px 9px; border-radius: 20px;
}
.card-body { padding: 14px 16px; }
.card-cat { font-size: 11px; color: var(--primary); background: #eef2ff; padding: 2px 9px; border-radius: 20px; font-weight: 600; }
.card-title { font-weight: 700; font-size: 14.5px; margin: 9px 0 5px; }
.card-desc { color: var(--muted); font-size: 13px; line-height: 1.65; }
.card-foot { display: flex; align-items: center; justify-content: space-between; margin-top: 12px; font-size: 12.5px; color: var(--muted); }

/* ============ 数据看板 ============ */
.stats-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 16px; margin-bottom: 22px; }
.stat-card { background: var(--card); border: 1px solid var(--border); border-radius: 16px; padding: 22px; text-align: center; box-shadow: var(--shadow-sm); }
.stat-card .num { font-size: 30px; font-weight: 800; color: var(--primary); }
.stat-card .lbl { color: var(--muted); font-size: 13px; margin-top: 6px; }
.stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 18px; }
.stats-col { background: var(--card); border: 1px solid var(--border); border-radius: 16px; padding: 18px; box-shadow: var(--shadow-sm); }
.stats-col h3 { margin: 0 0 12px; font-size: 14.5px; }
.rank-list { margin: 0; padding-left: 22px; }
.rank-list li { padding: 6px 0; font-size: 14px; border-bottom: 1px dashed var(--border); }
.rank-list li:last-child { border-bottom: none; }
.r-count { color: var(--muted); font-size: 12.5px; margin-left: 6px; }
/* ============ 设置：账号与权限 ============ */
.set-wrap { max-width: 1180px; }
.set-head { margin-bottom: 18px; }
.set-title { margin: 0 0 6px; font-size: 21px; font-weight: 800; color: var(--text); }
.set-desc { margin: 0; font-size: 14px; color: var(--muted); line-height: 1.7; }
.set-toolbar { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; flex-wrap: wrap; }
.set-count { font-size: 13.5px; color: var(--muted); margin-left: auto; }
.set-table-wrap { overflow-x: auto; }
.set-tip { margin-top: 16px; padding: 12px 16px; background: #f7f9fc; border: 1px solid var(--border);
           border-radius: 12px; font-size: 13.5px; color: #475066; line-height: 1.75; }

.user-table { width: 100%; table-layout: fixed; border-collapse: collapse; background: var(--card); border: 1px solid var(--border); border-radius: 14px; overflow: hidden; box-shadow: var(--shadow-sm); }
.user-table th, .user-table td { padding: 13px 14px; text-align: left; font-size: 14px; border-bottom: 1px solid var(--border); white-space: nowrap; }
.user-table th { background: #f7f9fc; color: var(--muted); font-weight: 600; }
.user-table tr:last-child td { border-bottom: none; }
.user-table tbody tr:hover { background: #f9fbff; }
.user-table .ops { display: flex; gap: 8px; align-items: center; }
/* 「可见板块」这一列内容最长（最多 9 个板块名），必须让它换行。
   这里有三个坑，缺一不可：
     ① 第 250 行 .user-table th, .user-table td 写了 white-space: nowrap。
        那条规则的特异度是 (0,1,1)（类+元素），比单个 .u-perms-cell (0,1,0) 高，
        所以光写 .u-perms-cell { white-space: normal } 根本盖不住。
        必须带上 td：.user-table td.u-perms-cell → (0,2,1)，才稳赢。
     ② table-layout: auto 下 max-width 对单元格基本无效 —— 浏览器宁可撑宽表格
        也不压缩内容，结果这列把右边「操作」列挤掉、按钮和文字叠在一起。
        所以表格改成 table-layout: fixed，再给列定宽，宽度才真正受控。
     ③ 定宽表下内容若仍超出会被裁掉，配 word-break 保证长串板块名能断开换行。 */
.user-table td.u-perms-cell { font-size: 13px; color: #475066; width: 280px; white-space: normal; line-height: 1.55; word-break: break-word; }
/* 定宽表：给其余各列明确宽度，把剩余空间留给「可见板块」 */
.user-table th:nth-child(1), .user-table td:nth-child(1) { width: 100px; }
.user-table th:nth-child(2), .user-table td:nth-child(2) { width: 110px; }
.user-table th:nth-child(3), .user-table td:nth-child(3) { width: 90px; }
.user-table th:nth-child(4), .user-table td:nth-child(4) { width: 90px; }
.user-table th:nth-child(5), .user-table td:nth-child(5) { width: 280px; }
.user-table th:nth-child(6), .user-table td:nth-child(6) { width: 150px; }
.user-table th:nth-child(7), .user-table td:nth-child(7) { width: 210px; }
.u-time { font-size: 13px; color: var(--muted); }
.u-self { font-size: 13px; color: var(--muted); }
.u-err { color: var(--danger); font-size: 13.5px; padding: 18px; }

.role-tag { display: inline-block; padding: 2px 9px; border-radius: 8px; font-size: 12.5px;
            font-weight: 600; background: #eef2ff; color: var(--primary); }
.role-tag.admin { background: #fff2e3; color: #d2540a; }
/* ask-30 账号使用记录：动作徽章（登录=绿，改权限/重置密码/免处罚=橙） */
.role-tag.ok { background: #e8f7ee; color: #1a7f4b; }
.role-tag.warn { background: #fff2e3; color: #d2540a; }

/* 编辑可见板块（新增账号弹窗 + 权限弹窗共用） */
.u-perms-block { margin-top: 12px; }
.u-perms-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap;
                position: sticky; top: 0; z-index: 2; background: #fff; padding-bottom: 4px; }
.u-perms-head label { font-size: 14.5px; font-weight: 700; color: #2b3552; }
.u-perms-presets { display: flex; gap: 6px; }
.u-perms-presets .mini-btn { font-size: 12.5px; padding: 4px 10px; }
/* 权限弹窗顶部的「角色」行。角色是自由文本、不影响权限，所以视觉上区别于勾选区：
   用一行紧凑的输入框，并标注清楚它只是展示用，免得以为改角色会影响权限。 */
.modal-box.wide-modal .perms-role-row { flex: none; }
.modal-box.wide-modal .perms-role-row input { max-width: 260px; }
.u-perms-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 10px; }
.u-perms-grid .chk { display: flex; align-items: center; gap: 6px; font-size: 14.5px; padding: 8px 12px; background: #f7f9fc; border-radius: 9px; cursor: pointer; }
.u-perms-grid .chk:hover { background: #eef2ff; }

/* ===== 分组版「可见板块」（四大板块 + 子项逐条勾选）=====
   结构：.perm-groups > .perm-group > (.pg-head + .pg-items)
   为什么不用 grid 两列平铺：父子和子项是包含关系，平铺后视觉上分不清
   哪些子项属于哪个板块，勾选时容易误判。改成一栏一栏的卡片式分组，
   父子关系一眼可见。 */
.perm-groups { display: flex; flex-direction: column; gap: 9px; margin-top: 10px; }
.perm-group { border: 1px solid #e3e9f4; border-radius: 11px; background: #fff; overflow: hidden;
              flex-shrink: 0; /* 2026-09-16 命门：overflow:hidden 的 flex 子项自动最小尺寸失效，
                  会被 .perm-groups 压扁、子项被裁光（业绩开单录入看不见的真相），禁止收缩 */ }
.perm-group.danger { border-color: #f5c9a8; background: #fffaf6; }
.perm-group.locked { opacity: .6; }

/* 组头：整组「全选」是一个 label，包着父级 checkbox + 板块名。
   ⚠️ 这条规则住在 .modal-body label 定义（L387，flex-direction: column）之前，
   但不必担心被它压掉 —— 特异度比对是逐位来的：
   .modal-body label  = (0,1,1)，.pg-head = (0,1,0)，后者更低；
   所以这里必须写成 .modal-body .pg-head = (0,2,0) 才能赢。
   早期版本只写了单类 .pg-head，结果组头里的复选框、板块名、备注
   被竖着堆成三行（复选框飘在最上面居中），整个分组区面目全非。 */
.modal-body .pg-head { display: flex; flex-direction: row; align-items: center; gap: 8px; padding: 9px 12px;
           background: #f5f8fe; border-bottom: 1px solid #e9eefa; cursor: pointer; user-select: none; }
.modal-body .perm-group.danger .pg-head { background: #fff3e8; border-bottom-color: #f7dfc8; }
.modal-body .perm-group.locked .pg-head { background: #f3f5f9; border-bottom-color: #e6eaf2; cursor: not-allowed; }
.modal-body .pg-head:hover { background: #eef3fe; }
.modal-body .perm-group.locked .pg-head:hover { background: #f3f5f9; }
.pg-name { font-size: 14.5px; font-weight: 700; color: #2b3552; }
.perm-group.danger .pg-name { color: #c2540a; }
.pg-note { font-size: 12.5px; color: #93a0b8; margin-left: auto; }

/* 子项区：小字、缩进，视觉上从属于组头 */
.pg-items { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 10px; padding: 8px 12px 10px; }
.pg-all { font-size: 13.5px; color: #5a6683; }

/* 子项勾选框。同样要跟 .modal-body label (0,1,1) 掰手腕：
   .modal-body .perm-groups .chk = (0,3,0)，稳赢。
   （.chk 自己那条 !important 其实已经兜住了 display/flex-direction，
    但显式写在这里，缩进和背景色才不会被 .u-perms-grid .chk 的平铺样式串味。） */
.modal-body .perm-groups .chk { display: flex; flex-direction: row; align-items: center; gap: 6px;
                    font-size: 14px; padding: 5px 8px; background: transparent;
                    border-radius: 7px; cursor: pointer; color: #3d4761; }
.modal-body .perm-groups .chk:hover { background: #eef2ff; }
.perm-groups .chk input { cursor: pointer; }
.perm-group.locked .pg-items { display: none; }

/* 空权限账号的回退提示（JS 里 perms 为空时 FALLBACK） */
.perm-warn { margin-top: 9px; font-size: 13px; color: #b26a00; background: #fff7e8;
             border: 1px solid #ffe0ad; border-radius: 9px; padding: 8px 11px; line-height: 1.6; }
.pg-warn { color: #d2540a; }

.form-2col { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
/* ===== 宽弹窗（新增账号 / 权限设置）=====
   两个坑，都踩过，写下来免得后人再犯：

   ① 必须写成 .modal-box.wide-modal（两个类），不能用单个 .wide-modal。
      两者特异度都是 (0,1,0)，纯靠源码顺序决胜，而 .modal-box（480px）
      定义在下面，于是 width 会被覆盖 —— 弹窗外表看着正常，实际还是 480px，
      属于很难发现的静默失效。双类把特异度提到 (0,2,0)，怎么排序都稳定。

   ② 高度必须自己管住，不能只靠 .modal-box 的 max-height: 90vh。
      权限区改成 6 个分组后内容高度实测 1077px，在 1366×768 / 1280×720
      这类最常见的笔记本屏上，弹窗会顶出视口，「创建」按钮被推到屏幕外
      （实测 footBottom 804 > 768），用户根本点不到保存。
      所以这里做弹性高度布局：标题栏和按钮栏固定，中间的 body 滚动，
      权限区再在 body 内部独立滚动。保证任何视口高度下按钮都在视野里。

   这里同时覆盖 .modal-box 的 overflow: auto —— 一页里出现两个滚动条
   会互相打架（滚到底外层的先把内容吸走），统一收敛成"只有权限区能滚"。 */
.modal-box.wide-modal {
  width: 720px; max-width: 92vw;
  max-height: 92vh;
  display: flex; flex-direction: column; overflow: hidden;
}
.modal-box.wide-modal .modal-head { flex: none; }
.modal-box.wide-modal .modal-body { flex: 1; min-height: 0; overflow: hidden; gap: 12px; }

/* ⚠️ 第三个坑（2026-09-14 补）：权限编辑弹窗（#perms-modal）里，
   .perm-groups 是 .modal-body 的直接 flex 子项 —— 它**没有** .u-perms-block
   这层包裹。我上面那套 .u-perms-block 规则在这个弹窗里一个都没生效，
   于是 .perm-groups 按内容撑到 673px，把「保存权限」按钮顶到 saveTop=972，
   而 .modal-box 是 overflow:hidden —— 按钮直接被裁掉，用户点不到、存不了。
   实测 1440x900 / 1366x768 / 1280x720 三档全部失败。

   所以这里直接对 .perm-groups 本体下手：
   给它 flex:1 + min-height:0 + overflow-y:auto，让它自己成为滚动区。
   min-height:0 依然是命门 —— 不写它，flex 子项不肯收缩，写了也白搭。 */
.modal-box.wide-modal .perm-groups {
  flex: 1; min-height: 0;
  overflow-y: auto; overflow-x: hidden;
  padding-right: 6px;
}
/* 模板按钮行和底部警告不能被压扁 */
.modal-box.wide-modal .u-perms-presets,
.modal-box.wide-modal .perm-warn { flex: none; }

/* ⚠️ 2026-09-16：用户反馈「弹窗太长了，要有下滑的按键」——
   滚动其实早就有了，但 Chromium 默认滚动条又细又淡，白底上几乎看不见，
   用户根本意识不到可以往下滚。这里把两个权限滚动区（编辑弹窗 .perm-groups /
   新建账号弹窗 .u-perms-block）的滚动条画粗画显眼：
   12px 宽、浅灰轨道、蓝紫渐变滑块、hover 加深，Firefox 用 scrollbar-color 同步。 */
.modal-box.wide-modal .perm-groups,
.modal-box.wide-modal .u-perms-block {
  scrollbar-width: auto;                       /* Firefox：别用 thin */
  scrollbar-color: #6d84f4 #eef1f8;            /* Firefox：滑块 / 轨道 */
}
.modal-box.wide-modal .perm-groups::-webkit-scrollbar,
.modal-box.wide-modal .u-perms-block::-webkit-scrollbar { width: 12px; }
.modal-box.wide-modal .perm-groups::-webkit-scrollbar-track,
.modal-box.wide-modal .u-perms-block::-webkit-scrollbar-track {
  background: #eef1f8; border-radius: 8px;
}
.modal-box.wide-modal .perm-groups::-webkit-scrollbar-thumb,
.modal-box.wide-modal .u-perms-block::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #9fb0ff, #6d84f4);
  border-radius: 8px;
  border: 2px solid #eef1f8;                   /* 让滑块看起来浮在轨道上 */
}
.modal-box.wide-modal .perm-groups::-webkit-scrollbar-thumb:hover,
.modal-box.wide-modal .u-perms-block::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #8095f5, #5a6fe0);
}

/* 权限区吃掉剩余空间，自己滚。顶部 required 字段（用户名/密码/角色）
   和底部按钮始终留在视野内。 */
.modal-box.wide-modal .u-perms-block {
  flex: 1; min-height: 0; overflow-y: auto; padding-right: 4px; margin-top: 4px;
}
/* 模板按钮行吸顶，滚到权限区深处也能一键套模板 */
.modal-box.wide-modal .u-perms-head {
  position: sticky; top: 0; z-index: 2; background: #fff; padding: 2px 0 8px;
  border-bottom: 1px solid #f0f2f7; margin-bottom: 9px;
}
.modal-box.wide-modal .modal-foot { flex: none; margin-top: 2px; }

/* ===== 分组版「可见板块」：小屏时子项改单列 =====
    放这里而不是紧挨着 .pg-items 定义：
    .pg-items 基础规则写的是 grid-template-columns: 1fr 1fr，
    @media 里的 1fr 若出现在它之前，同特异度下会被基础规则按源码顺序反压，
    媒体查询就静默失效了。媒体查询统一挪到基础规则之后。 */
@media (max-width: 640px) {
  .pg-items { grid-template-columns: 1fr; }
  .u-perms-grid { grid-template-columns: 1fr; }
  .form-2col { grid-template-columns: 1fr; }
}

/* ============ 弹窗 ============ */
/* 弹窗遮罩：原来的 backdrop-filter: blur(2px) 会让整个视口每帧做一次模糊采样，
   弹窗打开时显卡压力陡增。改成纯半透明遮罩，视觉效果几乎一样，但零成本。 */
.modal { position: fixed; inset: 0; background: rgba(20, 28, 46, .62); display: flex; align-items: center; justify-content: center; z-index: 50; }
.modal-box { width: 480px; max-width: 92vw; max-height: 90vh; overflow: auto; background: #fff; border-radius: 18px; box-shadow: 0 24px 60px rgba(16, 24, 40, .25); }
.modal-head { display: flex; justify-content: space-between; align-items: center; padding: 18px 22px; border-bottom: 1px solid var(--border); font-weight: 800; font-size: 16px; }
.modal-head .x { border: none; background: none; font-size: 24px; cursor: pointer; color: var(--muted); line-height: 1; }
.modal-body { padding: 20px 22px; display: flex; flex-direction: column; gap: 14px; }
.modal-body label { display: flex; flex-direction: column; gap: 6px; font-size: 13px; color: var(--muted); font-weight: 600; }
.modal-body input, .modal-body select, .modal-body textarea {
  padding: 11px 13px; border: 1px solid var(--border); border-radius: 10px; font-size: 14px; color: var(--text); font-family: inherit; font-weight: 400; transition: .15s;
}
.modal-body input:focus, .modal-body select:focus, .modal-body textarea:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 4px rgba(79, 110, 247, .12); }
.modal-body textarea { resize: vertical; }
.modal-foot { display: flex; justify-content: flex-end; gap: 10px; margin-top: 6px; }
.media-box-modal { width: 760px; }
.media-modal-body { text-align: center; }
.media-modal-body img, .media-modal-body video { max-width: 100%; border-radius: 12px; }
.mm-meta { color: var(--muted); font-size: 13px; margin: 12px 0 6px; }
.mm-desc { text-align: left; font-size: 14.5px; line-height: 1.75; color: var(--text); }

/* Toast */
.toast {
  position: fixed; left: 50%; bottom: 42px; transform: translateX(-50%);
  background: #1f2733; color: #fff; padding: 12px 22px; border-radius: 12px; font-size: 14px;
  z-index: 100; box-shadow: 0 12px 30px rgba(16, 24, 40, .25);
}

@media (max-width: 880px) {
  .app { flex-direction: column; }
  .sidebar { width: 100%; height: auto; position: static; flex-direction: column; }
  .side-nav { flex-direction: row; flex-wrap: wrap; padding: 8px 14px 0; }
  .side-nav .tab { width: auto; }
  .side-user { margin-top: 8px; border-top: 1px solid rgba(255, 255, 255, .08); }
  .content { height: auto; overflow: visible; }
  .kb-layout { flex-direction: column; }
  .kb-side { width: 100%; position: static; max-height: none; }
  .content-head { position: static; }
}

/* ============ 客户分析 ============ */
.analyze-wrap { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 22px; align-items: start; }
.card-soft { background: var(--card); border: 1px solid var(--border); border-radius: 16px; padding: 22px; box-shadow: var(--shadow-sm); }
.blk-title { margin: 0 0 6px; font-size: 17px; font-weight: 800; }
.analyze-input .hint { margin: 0 0 16px; }
.lbl-row { display: flex; flex-direction: column; gap: 6px; font-size: 13px; color: var(--muted); font-weight: 600; margin-bottom: 14px; }
.lbl-row input, .lbl-row textarea {
  padding: 11px 13px; border: 1px solid var(--border); border-radius: 10px; font-size: 14px; color: var(--text);
  font-family: inherit; font-weight: 400; transition: .15s; resize: vertical;
}
.lbl-row input:focus, .lbl-row textarea:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 4px rgba(79, 110, 247, .12); }
.an-upload { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.file-btn { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }
.file-btn input { display: none; }
.img-name { font-size: 12.5px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 180px; }
#an-run { margin-left: auto; }
#an-run:disabled { opacity: .6; cursor: default; }

/* 截图区（拖拽 / 点击 / 粘贴） */
.an-upload-row { display: flex; flex-direction: column; gap: 12px; margin: 4px 0 6px; }
.shot-zone { border: 2px dashed #c7d0e6; border-radius: 14px; padding: 22px; text-align: center; cursor: pointer; background: #fafbff; transition: .15s; outline: none; }
.shot-zone:hover, .shot-zone:focus, .shot-zone.drag { border-color: var(--primary); background: #eef2ff; }
.shot-inner { display: flex; flex-direction: column; align-items: center; gap: 6px; pointer-events: none; }
.shot-ico { font-size: 30px; }
.shot-title { font-size: 14.5px; font-weight: 700; color: var(--text); }
.shot-sub { font-size: 12.5px; color: var(--muted); }
.shot-sub kbd { background: #eef1f7; border: 1px solid #d6dcec; border-radius: 5px; padding: 1px 6px; font-size: 11px; font-family: inherit; }
.shot-previews { display: flex; gap: 10px; flex-wrap: wrap; }
.shot-thumb { position: relative; width: 92px; height: 92px; border-radius: 10px; overflow: hidden; border: 1px solid var(--border); flex: none; }
.shot-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.shot-x { position: absolute; top: 3px; right: 3px; width: 20px; height: 20px; border: none; border-radius: 50%; background: rgba(0, 0, 0, .6); color: #fff; font-size: 13px; line-height: 1; cursor: pointer; }
.an-upload-foot { display: flex; align-items: center; gap: 12px; }
.an-upload-foot #an-run { margin-left: auto; }
/* 折叠的「补充文字」区，让页面更清爽 */
.an-extra { margin: 12px 0 4px; border-top: 1px dashed var(--border); padding-top: 10px; }
.an-extra > summary { cursor: pointer; font-size: 14px; font-weight: 700; color: var(--primary); list-style: none; }
.an-extra > summary::-webkit-details-marker { display: none; }
.an-extra-body { margin-top: 12px; }

/* AI 配置预设按钮 */
.ai-presets { display: flex; gap: 10px; flex-wrap: wrap; margin: 10px 0 16px; }
.ai-preset {
  cursor: pointer; border: 1.5px solid var(--border); background: #fff; border-radius: 10px;
  padding: 9px 14px; font-size: 13.5px; font-weight: 700; color: var(--text); font-family: inherit; transition: .15s;
}
.ai-preset:hover { border-color: var(--primary); background: #f4f6ff; }
.ai-preset.active { border-color: var(--primary); background: #eef2ff; color: var(--primary); box-shadow: 0 0 0 3px rgba(79, 110, 247, .12); }

/* 大模型失败提示 */
.ai-warn {
  background: #fff8ec; border: 1px solid #f0d9a8; border-left: 4px solid #d98a00;
  border-radius: 10px; padding: 11px 14px; font-size: 14px; line-height: 1.7; color: #8a5a00; margin-bottom: 14px;
}

/* 挽留步骤里出现「未核实数据」时的行内提醒 */
.rc-datawarn {
  margin-top: 7px; font-size: 12.5px; line-height: 1.6; color: #b4451f;
  background: #fff3ef; border: 1px dashed #f0b49a; border-radius: 8px; padding: 7px 10px;
}

.analyze-result { background: var(--card); border: 1px solid var(--border); border-radius: 16px; padding: 22px; box-shadow: var(--shadow-sm); }
.res-head { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; }
.res-cat { font-size: 16px; font-weight: 800; color: #fff; background: var(--primary); padding: 5px 14px; border-radius: 20px; }
.res-engine { font-size: 12.5px; color: var(--muted); background: #f0f2f7; padding: 3px 10px; border-radius: 20px; }
.res-block { background: #f7f9fc; border-radius: 12px; padding: 14px 16px; margin-bottom: 14px; }
.res-label { font-size: 14.5px; font-weight: 700; color: var(--primary); margin-bottom: 8px; }
.res-summary { font-size: 15px; line-height: 1.7; color: var(--text); }
.res-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 14px; }
.res-col { background: #f7f9fc; border-radius: 12px; padding: 14px 16px; }
.res-ul { margin: 0; padding-left: 20px; }
.res-ul li { font-size: 15px; line-height: 1.7; color: #475066; }
.res-actions { display: flex; justify-content: flex-end; }

/* —— 客户分析：问题诊断 / 话术包优先 / AI 方案 —— */
.res-problem { background: linear-gradient(135deg, #eef2ff, #f7f9ff); border: 1px solid #d8e0ff; border-radius: 12px; padding: 14px 16px; margin-bottom: 16px; }
.res-problem-text { font-size: 17px; line-height: 1.7; font-weight: 700; color: #1f2a44; }

/* —— ① 我方复盘（我们的方式 & 发的案例对不对） —— */
.our-review { border: 1px solid #ffe0b8; background: linear-gradient(135deg, #fff8ec, #fffdf8); border-radius: 14px; padding: 16px 18px; margin-bottom: 16px; }
.or-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
.or-title { font-size: 16px; font-weight: 800; color: #8a5a00; }
.or-verdict { font-size: 13px; font-weight: 800; padding: 5px 13px; border-radius: 20px; color: #fff; }
.or-verdict.good { background: #1f9d55; }
.or-verdict.warn { background: #d98a00; }
.or-verdict.bad { background: #d64545; }
.or-points { list-style: none; margin: 0 0 12px; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.or-pt { display: flex; align-items: flex-start; gap: 9px; font-size: 15px; line-height: 1.7; color: #4a4335; background: #fff; border: 1px solid #f0e6d2; border-radius: 10px; padding: 10px 12px; }
.or-pt .or-mark { flex: none; width: 20px; height: 20px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 800; color: #fff; margin-top: 1px; }
.or-pt.ok .or-mark { background: #1f9d55; }
.or-pt.bad .or-mark { background: #d64545; }
.or-case { background: #fff; border: 1px dashed #e6d3b0; border-radius: 10px; padding: 12px 14px; }
.or-case-h { display: flex; align-items: center; gap: 10px; margin-bottom: 7px; flex-wrap: wrap; }
.or-case-label { font-size: 14px; font-weight: 700; color: #8a5a00; }
.or-case-verdict { font-size: 12px; font-weight: 700; padding: 3px 11px; border-radius: 20px; }
.or-case-verdict.good { background: #e6f6ec; color: #17794a; }
.or-case-verdict.warn { background: #fdf1dc; color: #a5710a; }
.or-case-verdict.bad { background: #fde8e8; color: #b32d2d; }
.or-case-a { font-size: 15px; line-height: 1.7; color: #475066; }

/* —— ② 一针见血 · 成交打法 —— */
.kill-key { display: flex; align-items: flex-start; gap: 10px; background: linear-gradient(135deg, #fff1f1, #fff8f8); border: 1px solid #ffd4d4; border-left: 4px solid #d64545; border-radius: 12px; padding: 14px 16px; margin-bottom: 14px; font-size: 16.5px; line-height: 1.7; font-weight: 800; color: #9b2c2c; }
.kill-key-ico { flex: none; font-size: 17px; }

.step-block { margin-bottom: 16px; }
.step-bar { display: flex; align-items: center; gap: 10px; font-size: 16px; font-weight: 800; color: var(--text); margin-bottom: 10px; }
.step-no { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 50%; background: var(--primary); color: #fff; font-size: 13px; flex: none; }
.step-tip { font-size: 12px; font-weight: 500; color: var(--muted); }
.ms-list { display: flex; flex-direction: column; gap: 10px; }
.ms-card { background: #f7f9fc; border: 1px solid var(--border); border-radius: 12px; padding: 13px 15px; }
.ms-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 7px; }
.ms-cat { font-size: 12px; font-weight: 700; color: #fff; background: #6b7bd6; padding: 3px 11px; border-radius: 20px; }
.ms-q { font-size: 15px; font-weight: 700; color: #2b3552; margin-bottom: 5px; }
.ms-a { font-size: 15px; line-height: 1.7; color: #475066; }
.ms-empty { background: #fbfcfe; border: 1px dashed var(--border); border-radius: 12px; padding: 13px 15px; font-size: 14px; color: var(--muted); }
.res-ol { margin: 0; padding-left: 22px; }
.res-ol li { font-size: 14px; line-height: 1.8; color: #475066; }
.sc-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 9px; }
.sc-li { display: flex; align-items: flex-start; gap: 10px; }
.sc-bubble { flex: 1; background: #eef7f0; border: 1px solid #d4ead9; border-radius: 12px; padding: 10px 13px; font-size: 15px; line-height: 1.7; color: #244b34; }
.sc-copy { flex: none; align-self: center; }

/* 复盘逐条：做错的点 + 正确回法 */
.or-pt-body { flex: 1; min-width: 0; }
.or-better { margin-top: 7px; padding: 8px 11px; background: #e6f6ec; border: 1px solid #bfe6cd; border-left: 3px solid #1f9d55; border-radius: 8px; font-size: 14.5px; line-height: 1.65; color: #17794a; }

/* 如何继续挽回客户：分步方案 */
.rc-list { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 10px; }
.rc-step { background: #f7f9fc; border: 1px solid var(--border); border-radius: 12px; padding: 12px 14px; }
.rc-act { display: flex; align-items: flex-start; gap: 9px; font-size: 15.5px; line-height: 1.7; color: #2b3a55; font-weight: 600; }
.rc-no { flex: none; width: 22px; height: 22px; border-radius: 50%; background: var(--primary); color: #fff; font-size: 12px; font-weight: 800; display: inline-flex; align-items: center; justify-content: center; margin-top: 1px; }
.rc-say { display: flex; align-items: flex-start; gap: 8px; margin-top: 9px; padding-left: 31px; }
.rc-bubble { flex: 1; background: #eef7f0; border: 1px solid #d4ead9; border-radius: 12px; padding: 10px 13px; font-size: 15px; line-height: 1.7; color: #244b34; }
.rc-copy { flex: none; align-self: center; }
.rc-tip { margin-top: 10px; background: #fff8ec; border: 1px dashed #e6c98a; border-radius: 10px; padding: 10px 13px; font-size: 14px; line-height: 1.7; color: #8a5a00; }

.res-detail { background: #fbfcfe; border: 1px dashed var(--border); border-radius: 12px; padding: 12px 16px; margin-bottom: 14px; }
.res-detail summary { cursor: pointer; font-size: 14.5px; font-weight: 700; color: var(--muted); padding: 4px 0; list-style: none; }
.res-detail summary::-webkit-details-marker { display: none; }
.res-sub { margin: 12px 0 14px; }
.res-detail[open] summary { color: var(--primary); }


.analyze-history { margin-top: 24px; }
.hist-head { display: flex; align-items: baseline; gap: 10px; margin-bottom: 12px; }
.hist-head h3 { margin: 0; font-size: 16px; }
.hist-list { display: flex; flex-direction: column; gap: 10px; }
.hist-item { display: flex; align-items: center; gap: 12px; background: var(--card); border: 1px solid var(--border); border-radius: 12px; padding: 13px 16px; box-shadow: var(--shadow-sm); }
.hist-main { display: flex; align-items: center; gap: 10px; flex: 1; min-width: 0; }
.hist-cat { font-size: 12px; color: var(--primary); background: #eef2ff; padding: 3px 10px; border-radius: 20px; font-weight: 600; flex: none; }
.hist-cust { font-weight: 700; font-size: 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hist-time { font-size: 12px; color: var(--muted); margin-left: auto; flex: none; }
.hist-ops { display: flex; gap: 8px; flex: none; }

/* 全员共享：标出这条分析是谁做的 */
.hist-who {
  font-size: 12px; font-weight: 600; flex: none; padding: 3px 9px; border-radius: 20px;
  color: #4b5563; background: #f1f3f6; border: 1px solid #e3e6ec;
}
.hist-who.me { color: #1d6b3f; background: #e8f7ee; border-color: #bfe6ce; }
.hist-toggle {
  display: flex; align-items: center; gap: 5px; font-size: 13px; color: var(--muted);
  cursor: pointer; user-select: none;
}
.hist-toggle input { cursor: pointer; }
.res-owner {
  font-size: 12.5px; font-weight: 600; color: #4b5563; background: #f1f3f6;
  border: 1px solid #e3e6ec; padding: 3px 10px; border-radius: 20px;
}

/* .chk 用 !important 是因为历史上被 .modal-body label 的 flex-direction: column 压过。
   分组后子项 .perm-groups .chk 也带这个类：
   ① 它自己的布局（flex 行）本来就和这里一致，不冲突；
   ② !important 只作用于列出的这几个属性，不会把我们新加的 padding / background / font-size
      覆盖掉（那些属性这里没出现），所以可以放心复用。
   ③ 缩进仍靠 .pg-items 的内边距实现，跟这条规则无关。 */
.chk { display: flex !important; flex-direction: row !important; align-items: center; gap: 8px !important; font-weight: 400 !important; color: var(--text) !important; }

/* ============ 继续追问（客户有新反应 → AI 教下一步发什么） ============ */
.fu-block { margin-top: 16px; background: linear-gradient(135deg, #f5f8ff, #f6f4ff); border: 1px solid #d9e2fb; border-radius: 14px; padding: 16px 18px; }
.fu-head { display: flex; flex-direction: column; gap: 4px; margin-bottom: 12px; }
.fu-title { font-size: 17px; font-weight: 800; color: #2b3552; }
.fu-sub { font-size: 13.5px; color: var(--muted); line-height: 1.6; }
.fu-quick { display: flex; flex-wrap: wrap; gap: 9px; margin-bottom: 12px; }
.fu-chip { font-size: 14.5px; font-weight: 600; padding: 9px 15px; border-radius: 22px; background: #fff; border: 1px solid #cfd9f5; color: #33417a; cursor: pointer; transition: all .15s; }
.fu-chip:hover { border-color: var(--primary); color: var(--primary); background: #f2f6ff; transform: translateY(-1px); }
.fu-input-row { display: flex; gap: 10px; align-items: stretch; }
.fu-input { flex: 1; min-width: 0; font-size: 15.5px; padding: 12px 15px; border: 1px solid #cfd9f5; border-radius: 12px; background: #fff; color: var(--text); }
.fu-input:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px rgba(59,102,241,.12); }
.fu-send { flex: none; padding: 0 22px; font-size: 15.5px; }
.fu-send:disabled { opacity: .6; cursor: default; }
.fu-list:not(:empty) { margin-top: 14px; display: flex; flex-direction: column; gap: 12px; }
.fu-item { background: #fff; border: 1px solid #e5e9f5; border-radius: 12px; padding: 14px 16px; box-shadow: var(--shadow-sm); }
.fu-q { font-size: 15.5px; font-weight: 700; color: #2b3552; display: flex; align-items: flex-start; gap: 8px; line-height: 1.6; }
.fu-q-tag { flex: none; font-size: 12px; font-weight: 700; color: #fff; background: #6b7bd6; padding: 3px 10px; border-radius: 20px; margin-top: 2px; }
.fu-a { margin-top: 11px; display: flex; flex-direction: column; gap: 9px; }
.fu-stage { font-size: 16px; font-weight: 800; color: #9b2c2c; background: linear-gradient(135deg, #fff1f1, #fff8f8); border: 1px solid #ffd4d4; border-left: 4px solid #d64545; border-radius: 10px; padding: 11px 14px; line-height: 1.65; }
.fu-why { font-size: 15px; line-height: 1.75; color: #475066; background: #f8fafd; border-radius: 10px; padding: 11px 14px; }
.fu-hold { font-size: 15.5px; font-weight: 700; line-height: 1.7; color: #1a5c3a; background: #eefaf2; border: 1px solid #c9ecd8; border-left: 4px solid #1f9d55; border-radius: 10px; padding: 11px 14px; }
.fu-sec { font-size: 14.5px; font-weight: 800; color: #2b3552; margin-top: 3px; }
.fu-acts { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 9px; }
.fu-act { background: #f7f9fc; border: 1px solid var(--border); border-radius: 11px; padding: 11px 13px; }
.fu-act-t { display: flex; align-items: flex-start; gap: 9px; font-size: 15.5px; line-height: 1.7; color: #2b3a55; font-weight: 600; }
.fu-no { flex: none; width: 22px; height: 22px; border-radius: 50%; background: var(--primary); color: #fff; font-size: 12px; font-weight: 800; display: inline-flex; align-items: center; justify-content: center; margin-top: 1px; }
.fu-say { display: flex; align-items: flex-start; gap: 8px; margin-top: 8px; padding-left: 31px; }
.fu-scs { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 9px; }
.fu-sc { display: flex; align-items: flex-start; gap: 10px; }
.fu-bubble { flex: 1; background: #eef7f0; border: 1px solid #d4ead9; border-radius: 12px; padding: 11px 14px; font-size: 15.5px; line-height: 1.75; color: #244b34; }
.fu-bubble.big { background: #eaf7ee; border-color: #bfe6cd; font-size: 16px; font-weight: 600; }
.fu-copy { flex: none; align-self: center; }
.fu-dont { font-size: 14.5px; line-height: 1.7; color: #a5410a; background: #fff8ec; border: 1px dashed #e6c98a; border-radius: 10px; padding: 10px 13px; }
.fu-warn { font-size: 14px; line-height: 1.7; color: #8a5a00; background: #fff8ec; border: 1px dashed #e6c98a; border-radius: 10px; padding: 10px 13px; }
.fu-thinking { font-size: 15px; color: var(--muted); }
.fu-err { font-size: 15px; color: #b32d2d; }
.fu-pending { border-style: dashed; }

/* ============ AI 配置弹窗（三步向导 + 测试连接） ============ */
#aicfg-modal .modal-body { font-size: 15px; }
.ai-status { font-size: 15px; font-weight: 700; line-height: 1.6; border-radius: 11px; padding: 11px 14px; margin: 2px 0 12px; border: 1px solid; }
.ai-status b { font-weight: 800; }
.ai-status-on { color: #1a6b3f; background: #eefaf2; border-color: #c4ead3; }
.ai-status-warn { color: #8a5a00; background: #fff8ec; border-color: #ecd9a8; }
.ai-status-off { color: #9b2c2c; background: #fff1f1; border-color: #ffd4d4; }
.ai-step-t { font-size: 15.5px; font-weight: 800; color: #2b3552; margin: 16px 0 8px; }
.ai-preset i { font-style: normal; font-weight: 600; font-size: 12.5px; color: var(--muted); margin-left: 3px; }
.ai-preset.active i { color: var(--primary); }
.ai-getkey { display: inline-block; margin: -6px 0 4px; font-size: 14.5px; font-weight: 700; color: var(--primary); text-decoration: none; }
.ai-getkey:hover { text-decoration: underline; }
.ai-key-hint { font-size: 13.5px; line-height: 1.6; color: var(--muted); margin: 7px 0 0; }
.ai-key-hint.on { color: #1a6b3f; font-weight: 600; }
.ai-test-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.ai-test-result { font-size: 14.5px; font-weight: 600; line-height: 1.6; }
.ai-test-result.ok { color: #1a6b3f; }
.ai-test-result.err { color: #b32d2d; }
.ai-adv { margin-top: 16px; border: 1px dashed var(--border); border-radius: 11px; padding: 4px 14px 12px; }
.ai-adv > summary { cursor: pointer; font-size: 14.5px; font-weight: 700; color: var(--muted); padding: 9px 0; }
.ai-adv label { display: block; font-size: 14px; margin-top: 10px; }
.ai-adv input[type="text"], .ai-adv input:not([type]) { width: 100%; }
.btn-ghost.danger { color: #b32d2d; border-color: #f0c9c9; }
.btn-ghost.danger:hover { background: #fff5f5; border-color: #d64545; color: #b32d2d; }
#aicfg-modal .modal-foot { display: flex; gap: 10px; align-items: center; }
#aicfg-modal .modal-foot .btn-ghost.danger { margin-right: auto; }

/* AI 配置：业务规则编辑框 */
#cfg-rules { width: 100%; min-height: 110px; font-size: 14.5px; line-height: 1.7; padding: 11px 14px;
  border: 1px solid var(--border); border-radius: 11px; background: #fffdf7; color: var(--text);
  font-family: inherit; resize: vertical; }
#cfg-rules:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px rgba(59,102,241,.12); }
.ai-step-t i { font-style: normal; font-weight: 500; font-size: 13px; color: var(--muted); }
/* 追问：输入区移到历史之后（聊天式：先看历史，再到底部接着打） */
.fu-input-zone { margin-top: 14px; padding-top: 14px; border-top: 1px dashed var(--border); }
.fu-input-zone .fu-quick { margin-bottom: 12px; }
.fu-list:empty { display: none; }

/* ============ 话术：多话术变体（编辑 + 列表） ============ */
.qa-answers-head { display: flex; align-items: center; justify-content: space-between; margin-top: 4px; }
.qa-answers-head label { font-size: 14.5px; font-weight: 700; color: #2b3552; }
.qa-a-row { display: flex; gap: 8px; align-items: flex-start; margin: 8px 0 10px; }
.qa-a-row textarea { flex: 1; font-size: 15px; padding: 10px 13px; border: 1px solid var(--border);
  border-radius: 10px; background: #fff; color: var(--text); font-family: inherit; resize: vertical; }
.qa-a-row textarea:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px rgba(59,102,241,.12); }
.qa-a-del { flex: none; width: 34px; height: 34px; border-radius: 50%; background: #fff5f5;
  border: 1px solid #f0c9c9; color: #b32d2d; cursor: pointer; font-size: 15px; font-weight: 700; }
.qa-a-del:hover { background: #ffe5e5; border-color: #d64545; }
#qa-add-a { font-size: 13.5px; padding: 6px 12px; }

/* 列表卡片：多话术展示 */
.kb-count { font-size: 12.5px; font-weight: 700; color: var(--muted); margin-left: 4px;
  background: #eef2ff; color: var(--primary); padding: 2px 9px; border-radius: 10px; }
.kb-a-more { margin-top: 8px; display: flex; flex-direction: column; gap: 8px; }
.kb-a-more[hidden] { display: none; }   /* 折叠时必须隐藏，不被 display:flex 覆盖 */
.kb-a-sub { background: #f7f9fc; border: 1px solid var(--border); border-radius: 10px;
  padding: 10px 13px; display: flex; flex-direction: column; gap: 6px; }
.kb-a-idx { align-self: flex-start; font-size: 12px; font-weight: 700; color: #fff;
  background: #6b7bd6; padding: 2px 10px; border-radius: 10px; }
.kb-a-text { font-size: 14.5px; line-height: 1.7; color: #2b3a55; white-space: pre-wrap; }
.kb-a-actions { display: flex; gap: 8px; margin-top: 4px; }
.kb-a-actions .mini-btn { font-size: 13px; padding: 5px 11px; }
.expand-btn { font-size: 13px; }

/* ============ 私人话术 ============ */
.pk-add-row { display: flex; gap: 8px; flex-wrap: wrap; }
.pk-add-row .btn-primary { font-size: 13.5px; padding: 7px 13px; }
.pk-card { border-left: 3px solid #6b7bd6; }
.pk-kind { background: #eef2ff !important; color: var(--primary) !important; }
.pk-content { white-space: pre-wrap; font-size: 14.5px; line-height: 1.7; color: #2b3a55; }
.pk-preview { margin: 6px 0; text-align: center; background: #f7f9fc; border-radius: 10px; overflow: hidden; }
.pk-preview video { max-width: 100%; max-height: 360px; display: block; }
.pk-preview img { max-width: 100%; max-height: 420px; cursor: zoom-in; display: block; margin: 0 auto; }
.pk-missing { display: block; padding: 24px; color: var(--muted); font-size: 14px; }

/* ============ 门户落地页 ============ */
.portal-wrap { flex-direction: column; padding: 40px 20px; gap: 28px; }
.portal-brand { text-align: center; }
.pb-ico { font-size: 46px; line-height: 1; }
.pb-name { font-size: 26px; font-weight: 800; color: #2b3552; margin-top: 8px; }
.pb-sub { font-size: 14.5px; color: var(--muted); margin-top: 4px; }
.portal-grid { display: flex; gap: 24px; align-items: stretch; justify-content: center; flex-wrap: wrap; width: 100%; max-width: 880px; }
.portal-card { flex: 1; min-width: 320px; max-width: 420px; background: #fff; border-radius: 18px;
  padding: 30px 28px; box-shadow: 0 10px 40px rgba(40, 60, 110, .12);
  display: flex; flex-direction: column; align-items: center; text-align: center; border: 1px solid #eef1f8; }
.pc-admin { border-top: 4px solid #7c5cbf; }
.pc-sales { border-top: 4px solid var(--primary); }
.pc-ico { font-size: 44px; line-height: 1; }
.pc-title { font-size: 22px; font-weight: 800; color: #2b3552; margin-top: 10px; }
.pc-desc { font-size: 14px; color: var(--muted); margin-top: 6px; line-height: 1.6; }
.pc-feats { list-style: none; margin: 16px 0; padding: 0; width: 100%;
  display: flex; flex-direction: column; gap: 8px; }
.pc-feats li { font-size: 14px; color: #475066; background: #f7f9fc; border-radius: 9px; padding: 8px 14px; text-align: left; }
.pc-enter { width: 100%; text-align: center; font-size: 16px; font-weight: 700; padding: 13px 0; text-decoration: none; margin-top: 6px; }
.pc-login { width: 100%; margin-top: 18px; display: flex; flex-direction: column; gap: 10px; }
.pc-login input { width: 100%; }
.pc-login button { margin-top: 4px; }
.pc-tip { font-size: 12.5px; color: var(--muted); margin-top: 14px; line-height: 1.6; }
.pc-tip b { color: #2b3552; }
@media (max-width: 700px) {
  .portal-grid { flex-direction: column; }
  .portal-card { max-width: 100%; }
}

/* ============ 侧边栏分组（行政区 / 销售话术库） ============ */
.nav-group { display: flex; flex-direction: column; gap: 4px; margin-top: 14px; }
.nav-group:first-child { margin-top: 4px; }
.nav-group-title { font-size: 16.5px; font-weight: 800; color: #c8d0e6; letter-spacing: .02em; padding: 8px 14px 8px; cursor: pointer; user-select: none; display: flex; align-items: center; justify-content: space-between; border-radius: 10px; transition: .15s; }
.nav-group-title:hover { background: rgba(255,255,255,.08); }

/* ===== 每个区一个专属颜色，扫一眼就知道自己在哪一块 =====
   颜色取自各自模块的主色调，彼此色相拉开，在深色侧栏上都够亮。
   分组标题、箭头、条目图标统一用该区主色；文字保持浅色保证可读性。 */
.nav-group.ng-admin  { --ng: #8aa4c8; }   /* 行政管理     · 石青 */
.nav-group.ng-sales  { --ng: #9b8ec4; }   /* 销售作战库   · 黛紫 */
.nav-group.ng-perf   { --ng: #c9a86a; }   /* 销售业绩追踪 · 暖褐金 */
.nav-group.ng-ops    { --ng: #6fa39b; }   /* 运营交付管理 · 青灰绿 */

.nav-group[class*="ng-"] .nav-group-title { color: var(--ng); }
.nav-group[class*="ng-"] .nav-group-title:hover { color: #fff; }
/* 该区下的条目：图标染色，文字保持中性灰白，避免整片花掉 */
.nav-group[class*="ng-"] .nav-group-items .tab .ico { color: var(--ng); opacity: .92; }
.ng-arrow { font-size: 13px; opacity: .6; transition: transform .2s; }
.nav-group[class*="ng-"] .ng-arrow { color: var(--ng); opacity: .65; }
.nav-group.collapsed .ng-arrow { transform: rotate(-90deg); }
.nav-group.collapsed .nav-group-items { display: none; }
/* 折叠后只剩一行标题，太容易被误当成"这组是空的"（之前就出过这个误会）。
   给折叠态加个左侧竖条 + 边框，视觉上明确它是"收起来的板子"而不是空壳。 */
.nav-group.collapsed > .nav-group-title {
  border-left: 3px solid var(--ng, rgba(255,255,255,.28));
  padding-left: 11px;   /* 补回竖条占掉的 3px，标题文字位置不跳 */
}
.nav-group.collapsed > .nav-group-title::after {
  content: "收起"; font-size: 11px; font-weight: 500; opacity: .5;
  margin-left: 8px; margin-right: auto; letter-spacing: .04em;
}
/* ng-arrow 现在被 margin-right:auto 推到右边，得把它拎到标题文字后面 */
.nav-group.collapsed > .nav-group-title { justify-content: flex-start; }
.nav-group.collapsed > .nav-group-title .ng-arrow { margin-left: 0; margin-right: 0; }
/* 2026-09-14 的「hover 展开」已随 ask-66（2026-09-16 用户要求全部手动折叠）
   一并删除：鼠标划过不再自动弹开，只认组头点击。hover-open 样式同步清理。 */
.nav-group-items { display: flex; flex-direction: column; gap: 4px; }
/* 行政人事子项（hr-*）：原二级侧栏提升为一级菜单的下拉树，缩进半级以体现层级 */
.nav-group .nav-group-items .tab.hr-sub { padding-left: 30px; }
.nav-group .nav-group-items .tab.hr-sub .lbl { font-size: 13.8px; font-weight: 600; }
.nav-group .nav-group-items .tab.hr-sub .ico { font-size: 15px; }
.nav-link { display: flex; align-items: center; gap: 12px; width: 100%; padding: 12px 14px;
  border: none; background: transparent; color: #aeb7cc; font-size: 14.5px; font-weight: 600;
  border-radius: 11px; cursor: pointer; text-align: left; transition: .15s; text-decoration: none; position: relative; }
.nav-link .ext { margin-left: auto; font-size: 13px; opacity: .6; }
.nav-link:hover { background: rgba(255, 255, 255, .07); color: #fff; }
.nav-link .ico { font-size: 17px; width: 22px; text-align: center; }
@media (max-width: 700px) {
  .nav-group { flex-direction: row; flex-wrap: wrap; align-items: center; }
  .nav-group-title { width: 100%; padding: 4px 4px 0; }
  .nav-link { width: auto; }
}

/* ============ 行政区 iframe 嵌入 ============ */
#tab-admin { padding: 0; }
.admin-frame { width: 100%; height: calc(100vh - 0px); min-height: 600px; border: none; display: block; }

/* ============ 首页动态欢迎（2026-09-15 柔美×智能改版：粉紫极光 + 玻璃卡 + AI 氛围） ============ */
#tab-home { padding: 0; }
/* 2026-09-17 老板定稿：首页背景换科技城市俯瞰图（用户提供的原图，已去 AI 水印）。
   原深夜紫底改为兜底色；极光层降透明度改为压暗遮罩，保证白字可读。 */
.home-hero { position: relative; min-height: calc(100vh - 0px); overflow: hidden;
  display: flex; align-items: center; justify-content: center;
  background: #07101f url("/static/home_bg.webp?v=20260918-ts9") center / cover no-repeat; }
/* 极光背景：城市图上叠半透明遮罩 + 四团光晕（原透明度约减半），缓慢呼吸 */
.home-aurora { position: absolute; inset: -20%; z-index: 0;
  background:
    linear-gradient(180deg, rgba(7, 14, 28, .52) 0%, rgba(7, 14, 28, .38) 45%, rgba(7, 14, 28, .55) 100%),
    radial-gradient(42% 55% at 18% 22%, rgba(240,166,202,.14) 0%, transparent 60%),
    radial-gradient(48% 60% at 82% 18%, rgba(179,157,219,.13) 0%, transparent 62%),
    radial-gradient(50% 62% at 70% 82%, rgba(144,202,249,.10) 0%, transparent 60%),
    radial-gradient(36% 46% at 26% 78%, rgba(255,214,236,.08) 0%, transparent 58%);
  /* 只动 opacity/transform（GPU 合成），不逐帧重刷大面积着色 */
  animation: aurora 16s ease-in-out infinite; }
@keyframes aurora { 0%,100% { opacity:.92; transform: scale(1); } 50% { opacity:1; transform: scale(1.04); } }
/* AI 感光弧：两道缓慢旋转的彩色圆环，点缀在角落，弱化存在感但有科技氛围 */
.home-ring { position: absolute; border-radius: 50%; border: 1px solid rgba(255,255,255,.08); z-index: 0; pointer-events: none; }
.home-ring::before { content:""; position:absolute; inset:-1px; border-radius:50%;
  border:1.5px solid transparent;
  border-top-color: rgba(240,166,202,.5);
  border-right-color: rgba(179,157,219,.3);
  animation: ringSpin 26s linear infinite; }
.home-ring1 { width: 720px; height: 720px; top: -280px; right: -200px; }
.home-ring2 { width: 520px; height: 520px; bottom: -220px; left: -160px; }
.home-ring2::before { border-top-color: rgba(144,202,249,.45);
  border-left-color: rgba(255,214,236,.28); animation-direction: reverse; animation-duration: 34s; }
@keyframes ringSpin { to { transform: rotate(360deg); } }

.home-particles { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.home-dot { position: absolute; bottom: -10px; width: var(--sz); height: var(--sz);
  border-radius: 50%; background: var(--c, rgba(255,255,255,.4));
  box-shadow: 0 0 8px 1px var(--c, transparent);
  animation: floatUp linear infinite; }
/* 粒子只动 transform/opacity（GPU 合成），不再触发重绘 */
@keyframes floatUp { 0% { transform: translate3d(0,0,0); opacity: 0; } 10% { opacity: 1; }
  90% { opacity: 1; } 100% { transform: translate3d(0,-100vh,0); opacity: 0; } }

.home-content { position: relative; z-index: 2; text-align: center; color: #fff; padding: 48px 24px; max-width: 1140px; width: 100%; }   /* ts131：900→1140 + width:100%（flex 子项原本按内容收缩），给 4 列卡片留开宽度 */
/* 「AI 智能工作台」发光徽章 */
.home-badge { display:inline-flex; align-items:center; gap:8px; padding:8px 20px; border-radius:999px;
  background: rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.16);
  font-size:13.5px; font-weight:700; letter-spacing:3px; color:#f2d9ff; margin-bottom: 4px;
  backdrop-filter: blur(6px); }
.hb-dot { width:8px; height:8px; border-radius:50%; background:#f0a6ca;
  box-shadow:0 0 10px 2px rgba(240,166,202,.85); animation: hbPulse 2.2s ease-in-out infinite; }
@keyframes hbPulse { 0%,100%{ transform:scale(1); opacity:1;} 50%{ transform:scale(1.4); opacity:.6;} }

.home-welcome { font-size: 44px; font-weight: 800; margin: 12px 0 6px;
  background: linear-gradient(90deg, #ffe3f2, #e6d5ff, #ffe0c9, #ffe3f2);
  background-size: 200% auto; -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; animation: shine 5s linear infinite; }
.home-name { font-size: inherit; font-weight: 900;
  background: linear-gradient(90deg, #ffc9e2, #d9c6ff, #ffe9c9, #ffc9e2);
  background-size: 200% auto; -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; animation: shine 5s linear infinite; }
@keyframes shine { to { background-position: 200% center; } }
.home-date { font-size: 15px; letter-spacing: 4px; opacity: .72; margin: 2px 0; }
/* 口号降为轻文案：不再 40px 大流光抢视觉，改为优雅小字 */
.home-motto { font-size: 18px; font-weight: 600; margin: 16px 0 42px; line-height: 1.6;
  color: rgba(238,228,248,.88); letter-spacing: 1.5px; }
.motto-end { color: #ffd9ec; font-weight: 800; }

/* 快捷入口：玻璃卡网格（图标渐变底座 + 名称 + 一句小描述）
   ts131（2026-09-20 老板：分散一些，卡一排放4个）：3 列 → 4 列，容器 780→1080、间距 16→18，
   宽屏一排 4 张更分散；≤720px 回退 3 列、≤640px 手机仍 2 列，防块行挤压 */
.home-shortcuts { display: grid; grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 18px; max-width: 1080px; margin: 0 auto; }
.home-card { position: relative; overflow: hidden; text-align: left;
  display: flex; flex-direction: column; align-items: flex-start; gap: 9px;
  min-height: 224px;   /* ts126：删描述后锁死卡片高度，与原带描述时一致（224px 实测） */
  background: linear-gradient(145deg, rgba(255,255,255,.10), rgba(255,255,255,.045));
  border: 1px solid rgba(255,255,255,.14); border-radius: 20px; padding: 22px 20px;
  cursor: pointer; color: #fff;
  transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease; }
/* hover 扫光 */
.home-card::after { content:""; position:absolute; top:0; left:-80%; width:55%; height:100%;
  background: linear-gradient(105deg, transparent, rgba(255,255,255,.15), transparent);
  transform: skewX(-18deg); transition: left .55s ease; pointer-events: none; }
.home-card:hover::after { left: 135%; }
.home-card:hover { transform: translateY(-6px); border-color: rgba(240,166,202,.45);
  box-shadow: 0 18px 40px rgba(10,6,24,.45), 0 0 26px rgba(240,166,202,.16); }
.hc-ico { font-size: 25px; width: 52px; height: 52px; display:flex; align-items:center; justify-content:center;
  border-radius: 15px; background: var(--hc-bg, linear-gradient(135deg,#f0a6ca,#b39ddb));
  box-shadow: 0 6px 16px rgba(20,10,40,.4); }
.home-card .hc-name { font-size: 16px; font-weight: 700; }
/* ts126：hc-desc（卡片底部小字描述）整体下线 —— DOM 已不再渲染，规则一并删除 */
/* ts126：新增卡片弹入动画（选择器添加 / 拖拽分组的 FLIP 新卡共用） */
@keyframes hc-born-in {
  0%   { opacity: 0; transform: scale(.55) translateY(16px); }
  62%  { opacity: 1; transform: scale(1.05) translateY(0); }
  100% { opacity: 1; transform: scale(1); }
}
.home-card.hc-born { animation: hc-born-in .5s cubic-bezier(.34,1.56,.64,1); }
/* AI 卡特殊描边 + 角标 */
.home-card.hc-ai { border-color: rgba(201,167,245,.42);
  background: linear-gradient(145deg, rgba(201,167,245,.17), rgba(142,197,245,.07)); }
.hc-tag { position:absolute; top:14px; right:14px; font-size:11px; font-weight:800;
  padding:3px 11px; border-radius:999px; letter-spacing:2px;
  background:rgba(201,167,245,.20); border:1px solid rgba(201,167,245,.5); color:#e9d6ff; }
/* ts131：中窄屏（641-720px，小平板/分屏）回退 3 列——4 列会挤到块行 */
@media (max-width: 720px) and (min-width: 641px) {
  .home-shortcuts { grid-template-columns: repeat(3, minmax(0,1fr)); gap: 14px; max-width: 780px; }
}
@media (max-width: 640px) {
  .home-welcome { font-size: 30px; }
  .home-shortcuts { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }
  .home-card { padding: 16px 14px; min-height: 196px; }   /* ts126：手机端同比例锁高 */
  .home-motto { font-size: 15px; margin: 12px 0 28px; }
}

/* ts89 工作台卡片二级分类：chips 行 + ＋ 按钮 + 选择器条目 */
/* ts96（老板：不要小的，要和图标大小一样）：二级分类改成与 hc-ico 同尺寸的
   渐变图标方块——块内 emoji、悬停放大、悬停右上角 × 移除；＋ 同尺寸虚线块 */
/* ts127（老板拍板）：块与块横排网格 —— 一排放 2 个、两排放满 4 个（2×2）；
   块支持拖动换位（JS 端互换顺序），＋号占最后一格 */
.hc-sub-row { display: grid; grid-template-columns: repeat(2, 52px); gap: 10px; width: auto; margin-top: 4px; }
.hc-sub { position: relative; width: 52px; height: 52px; border-radius: 15px;
  display: flex; align-items: center; justify-content: center; font-size: 24px;
  background: var(--hc-sub-bg, linear-gradient(135deg,#f0a6ca,#b39ddb));
  box-shadow: 0 6px 16px rgba(20,10,40,.4); cursor: pointer; user-select: none;
  transition: transform .2s ease, box-shadow .2s ease; }
.hc-sub:hover { transform: translateY(-3px) scale(1.06); box-shadow: 0 10px 24px rgba(20,10,40,.5); }
.hc-sub-x { position: absolute; top: -7px; right: -7px; width: 18px; height: 18px; border-radius: 50%;
  background: #e11d48; color: #fff; font-size: 12px; font-style: normal; font-weight: 800;
  line-height: 18px; text-align: center; opacity: 0; transition: opacity .15s ease;
  box-shadow: 0 2px 6px rgba(0,0,0,.35); }
.hc-sub:hover .hc-sub-x { opacity: 1; }
/* ts97：触摸设备没有悬停——× 常显，手机上也能移除二级分类（老板：话术库那个为啥不能移除） */
@media (hover: none) {
  .hc-sub-x { opacity: 1; }
  .hc-tools { opacity: 1; }
}
.hc-add-btn { display: flex; align-items: center; justify-content: center;
  width: 52px; height: 52px; border-radius: 15px; padding: 0; line-height: 1;
  border: 1.5px dashed rgba(255,255,255,.42); background: rgba(255,255,255,.05);
  color: rgba(255,255,255,.8); font-size: 24px; font-weight: 700; cursor: pointer;
  transition: all .2s ease; }
.hc-add-btn:hover { background: rgba(255,255,255,.16); border-color: rgba(255,255,255,.75); color: #fff; transform: translateY(-3px); }
@media (max-width: 640px) {
  .hc-sub-row { gap: 8px; grid-template-columns: repeat(2, 44px); }   /* ts127：手机端同 2×2 */
  .hc-sub, .hc-add-btn { width: 44px; height: 44px; border-radius: 13px; font-size: 20px; }
}
.hc-pick { display: flex; align-items: center; gap: 8px; padding: 10px 12px;
  border-radius: 10px; border: 1px solid #e2e8f0; background: #f8fafc;
  color: #0f172a; font-size: 13px; cursor: pointer; transition: all .15s ease; }
.hc-pick:hover { border-color: #93c5fd; background: #eff6ff; }
.hc-pick-on { border-color: #86efac; background: #f0fdf4; }
.hc-pick-on:hover { border-color: #4ade80; background: #dcfce7; }

/* ts91 拉功能到工作台：排序/移除工具条 + ➕ 添加卡 */
/* ts98：按书面需求恢复副标题（图标/标题/副标题完整展示）；ts95 的隐藏规则已移除 */
/* ts95：拖拽换位视觉——拖行半透明、目标卡高亮描边 */
.home-card.hc-dragging { opacity: .45; transform: scale(.97); }
.home-card.hc-drag-over { border-color: rgba(240,166,202,.85); box-shadow: 0 0 0 2px rgba(240,166,202,.35), 0 18px 40px rgba(10,6,24,.45); }
.hc-tools { position: absolute; top: 10px; right: 10px; display: flex; gap: 4px;
  opacity: 0; transition: opacity .15s ease; z-index: 5; }
/* ts129：被移除的原始静态卡 & 满 4 张时隐藏的「添加功能卡片」 */
.home-card.hc-del { display: none !important; }
.home-card:hover .hc-tools { opacity: 1; }
.hc-move { width: 22px; height: 22px; border-radius: 7px; background: rgba(15,23,42,.55);
  color: #fff; font-size: 11px; font-style: normal; display: flex; align-items: center;
  justify-content: center; cursor: pointer; border: 1px solid rgba(255,255,255,.25);
  transition: background .15s ease; }
.hc-move:hover { background: rgba(15,23,42,.85); }
.hc-del { background: rgba(225,29,72,.75); border-color: rgba(255,255,255,.35); }
.hc-del:hover { background: rgba(225,29,72,1); }
/* AI 卡角标在悬停工具条出现时让位淡出，避免重叠 */
.hc-tag { transition: opacity .15s ease; }
.home-card:hover .hc-tag { opacity: 0; }
.hc-add-card { border-style: dashed; border-color: rgba(255,255,255,.32);
  background: linear-gradient(145deg, rgba(255,255,255,.05), rgba(255,255,255,.02)); }
.hc-add-card:hover { border-color: rgba(240,166,202,.6); }
.hc-add-card .hc-ico { background: none; box-shadow: none; }

/* ============ 权限管理 ============ */

/* 首页大标题 */
.home-title { font-size: 56px; font-weight: 900; margin: 0 0 18px; letter-spacing: .05em;
  background: linear-gradient(90deg, #fff, #c4d4ff, #e8c4ff, #fff7c4, #fff);
  background-size: 300% auto; -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; animation: shine 4s linear infinite;
  filter: drop-shadow(0 0 20px rgba(255,255,255,.5)) drop-shadow(0 0 40px rgba(180,200,255,.4)); }
.home-sub { font-size: 18px; opacity: .75; margin: 0; }

/* IE 兼容模式警告 */
.ie-warning { background: #fff3cd; border: 1px solid #ffc107; border-radius: 10px; padding: 14px 16px; margin: 12px 0; }
.ie-warning .ie-title { font-size: 16px; font-weight: 800; color: #856404; margin: 0 0 8px; }
.ie-warning .ie-desc { font-size: 13.5px; color: #856404; margin: 4px 0; line-height: 1.6; }
.ie-warning .ie-step { font-size: 13.5px; color: #6c5314; margin: 3px 0 3px 12px; line-height: 1.6; }

/* AI 配置：双模型区块 */
.ai-model-block { background: #f7f9fc; border: 1px solid var(--border); border-radius: 13px; padding: 16px 18px; margin: 14px 0; }
.ai-model-title { font-size: 16px; font-weight: 800; color: #2b3552; margin-bottom: 10px; }
.ai-model-block .ai-adv { margin-top: 10px; }
.ai-model-block .ai-presets { margin-bottom: 10px; }

/* 双模型融合提示条 */
.dual-bar { background: linear-gradient(90deg, #eef3ff, #f6f0ff); border: 1px solid #d8e0f7; border-radius: 12px; padding: 11px 15px; margin: 10px 0 14px; font-size: 13.5px; color: #3a4670; line-height: 1.7; }
.dual-bar b { color: #2b3552; }
.dual-div { margin-top: 6px; padding-top: 6px; border-top: 1px dashed #d8e0f7; font-size: 13px; color: #8a6d1e; }

/* ==========================================================================
   首页动画性能兜底（2026-09-13）
   主系统首页原先只有 6 帧：根因是 7 处 backdrop-filter 柔光模糊 +
   motto 上 4 层 drop-shadow 动画。已改为实色/单层，帧率回到 60。
   下面几条是低端设备与节能场景的兜底，正常情况下不会生效。
   ========================================================================== */

/* 1) 页面被切走/隐藏时，停掉所有动画，别在后台白烧 CPU 和电 */
html.kb-idle *, html.kb-idle *::before, html.kb-idle *::after {
  animation-play-state: paused !important;
}

/* 2) 系统开了「减弱动态效果」（很多手机默认省电模式会开），关掉装饰性动画，
      但保留信息本身 —— 文字、卡片、导航全都照常可见 */
@media (prefers-reduced-motion: reduce) {
  .home-dot { display: none; }
  .aurora, .home-title, .home-emoji, .home-motto,
  .home-aurora, .home-ring::before, .hb-dot, .home-welcome, .home-name { animation: none !important; }
  .home-title, .home-motto { filter: none !important; }
}

/* 3) 自动探测到设备明显带不动（帧率低于 40）时，去掉最费的装饰 */
body.kb-lowfx .home-dot { display: none; }
body.kb-lowfx .home-title { filter: none !important; }
body.kb-lowfx .aurora { animation: none !important; }

/* ==================== 客户分析：说话人辨认（谁说的，一眼分清） ====================
   设计原则：左侧/蓝灰＝客户（对方），右侧/品牌蓝＝我方（自己）。
   跟微信气泡的左右习惯保持一致 —— 销售不用看标签，凭位置和颜色就能对上号。 */
:root {
  --spk-cus: #5b7ba6;        /* 客户 · 蓝灰（偏冷、退后） */
  --spk-cus-bg: #eef3fb;
  --spk-ours: #1f6feb;       /* 我方 · 品牌蓝（醒目、靠前） */
  --spk-ours-bg: #e8f1ff;
}

/* --- 说话人小圆片 --- */
.spk {
  display: inline-block;
  flex: none;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.5;
  padding: 1px 8px;
  border-radius: 20px;
  margin-right: 7px;
  vertical-align: 1px;
  white-space: nowrap;
}
.spk-ours { background: var(--spk-ours); color: #fff; }
.spk-cus  { background: var(--spk-cus);  color: #fff; }

/* --- 复盘条目：按说话人给左侧色条 --- */
.or-pt.spk-ours { border-left-color: var(--spk-ours); }
.or-pt.spk-cus  { border-left-color: var(--spk-cus); }

/* --- 列表行：按说话人缩进 + 变色，形成"两栏对望"的观感 --- */
.res-ul .spk-line { padding-left: 8px; border-left: 3px solid transparent; }
.res-ul .spk-line-ours { border-left-color: var(--spk-ours); background: var(--spk-ours-bg); }
.res-ul .spk-line-cus  { border-left-color: var(--spk-cus);  background: var(--spk-cus-bg); }

/* --- 原话对照：左右两栏 --- */
.spk-block {
  margin: 16px 0;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: #fff;
  overflow: hidden;
}
.spk-block-h {
  display: flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: wrap;
  padding: 11px 15px;
  background: #f7f9fe;
  border-bottom: 1px solid var(--border);
}
.spk-block-t { font-size: 15px; font-weight: 800; color: var(--text); }
.spk-block-s { font-size: 12.5px; color: var(--muted); }
.spk-cols {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
}
.spk-col { padding: 12px 15px; min-width: 0; }
.spk-col-cus  { border-right: 1px dashed var(--border); background: #fbfcff; }
.spk-col-ours { background: #fff; }
.spk-col-h {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 9px;
  padding-bottom: 8px;
  border-bottom: 1px solid #eef1f7;
}
.spk-col-n { margin-left: auto; font-size: 12px; color: var(--muted); }
.spk-col ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 7px; }
.spk-col li {
  font-size: 14.5px;
  line-height: 1.6;
  padding: 7px 11px;
  border-radius: 9px;
  word-break: break-word;
}
.spk-col-cus  li { background: var(--spk-cus-bg);  border-left: 3px solid var(--spk-cus); }
.spk-col-ours li { background: var(--spk-ours-bg); border-left: 3px solid var(--spk-ours); }
.spk-col li.spk-empty { background: transparent; border-left: 3px solid #e3e8f1; color: var(--muted); }
.spk-other {
  padding: 10px 15px;
  border-top: 1px dashed var(--border);
  font-size: 13px;
  color: var(--muted);
  background: #fcfcfd;
}

/* 窄屏：两栏改上下排列，手机上也能看清 */
@media (max-width: 760px) {
  .spk-cols { grid-template-columns: 1fr; }
  .spk-col-cus { border-right: none; border-bottom: 1px dashed var(--border); }
}

/* ============ 客户分析 · 黑金/深蓝科技风（2026-09-14）============
   大面积深蓝底 + 金色细节体现质感；去掉花哨彩块与堆砌光效，
   只保留一条金色流动线与激活态发光边框；分析结果/历史浅色卡片浮起。 */
#tab-analyze.an-dark {
  position: relative;
  /* ts47（2026-09-18 用户反馈「背景要亮一些 + 拉全页面」）：
     亮度整体提一档（深蓝底更透亮），光晕加强；
     min-height 从 100vh-170px 提到 100vh-48px，背景卡片铺满整个内容区（不再下露白）。 */
  background:
    radial-gradient(ellipse 62% 46% at 12% -8%, rgba(56,189,248,.30), transparent 64%),
    radial-gradient(ellipse 52% 42% at 88% -2%, rgba(167,139,250,.26), transparent 64%),
    radial-gradient(ellipse 88% 62% at 50% 118%, rgba(59,130,246,.32), transparent 68%),
    radial-gradient(ellipse 42% 32% at 72% 46%, rgba(34,211,238,.10), transparent 70%),
    linear-gradient(168deg, #0e1d42 0%, #142a60 46%, #0d1b40 100%);
  border: 1px solid rgba(125,211,252,.30);
  border-radius: 20px; padding: 24px;
  box-shadow: 0 14px 44px rgba(0,0,0,.35), inset 0 1px 0 rgba(147,197,253,.14);
  overflow: hidden;
  min-height: calc(100vh - 48px); /* 铺满内容区：只留 pane 上下 24px 呼吸边距，不再露白 */
}
/* ts46：科技网格层（垫底：负 z-index 画在容器背景之上、内容之下；顶部亮、往下渐隐） */
#tab-analyze.an-dark::after {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background:
    linear-gradient(rgba(125,211,252,.10) 1px, transparent 1px),
    linear-gradient(90deg, rgba(125,211,252,.10) 1px, transparent 1px);
  background-size: 44px 44px;
  -webkit-mask-image: radial-gradient(ellipse 110% 95% at 50% 0%, #000 40%, transparent 100%);
          mask-image: radial-gradient(ellipse 110% 95% at 50% 0%, #000 40%, transparent 100%);
}
/* 顶部金色流动线（全页唯一动效，克制） */
#tab-analyze.an-dark::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 2px; z-index: 2;
  background: linear-gradient(90deg, transparent, rgba(232,196,118,.9), transparent);
  background-size: 45% 100%; background-repeat: no-repeat;
  animation: anFlow 6s linear infinite;
}
@keyframes anFlow { 0% { background-position: -60% 0; } 100% { background-position: 160% 0; } }

/* 标题更硬：金色 + 特粗 + 字距 + 竖金条 */
#tab-analyze.an-dark .blk-title {
  color: #f0d9a8; font-weight: 900; letter-spacing: 1.5px;
  border-left: 4px solid #e8c476; padding-left: 12px;
}
#tab-analyze.an-dark .hint { color: #8fa0b8; }
#tab-analyze.an-dark .hint b { color: #e8c476; }

/* 页签：深蓝底金字，激活金色发光边框 */
#tab-analyze.an-dark .sub-tabs {
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(232,196,118,.14);
  box-shadow: none; padding: 12px; gap: 10px; border-radius: 16px;
  position: relative; flex-wrap: wrap;
}
#tab-analyze.an-dark .sub-tabs::after {
  content: ""; position: absolute; left: 24px; right: 24px; bottom: 0; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(232,196,118,.5), transparent);
}
/* ask-36（2026-09-17 用户要求）：页签字体加大加粗夸张 + 四页签四色区分 + 去「新」角标 */
#tab-analyze.an-dark .sub-tab {
  background: #101c30; color: #fff;
  border: 1px solid rgba(232,196,118,.24);
  font-size: 19px; font-weight: 900; padding: 14px 26px; border-radius: 14px;
  box-shadow: none; filter: none; letter-spacing: .5px;
  transition: filter .15s ease;
}
/* 四页签四色：蓝(会话洞察) / 绿(智能问答) / 橙(店铺诊断) / 紫(商品图) */
#tab-analyze.an-dark .sub-tab[data-sub="chat"]  { background: #1d4ed8; border-color: rgba(96,165,250,.6); }
#tab-analyze.an-dark .sub-tab[data-sub="ask"]   { background: #047857; border-color: rgba(52,211,153,.6); }
#tab-analyze.an-dark .sub-tab[data-sub="store"] { background: #c2660a; border-color: rgba(251,191,36,.6); }
#tab-analyze.an-dark .sub-tab[data-sub="art"]   { background: #6d28d9; border-color: rgba(196,181,253,.6); }
#tab-analyze.an-dark .sub-tab:hover {
  border-color: rgba(232,196,118,.65); color: #fff;
  transform: none; box-shadow: none; filter: brightness(1.18);
}
#tab-analyze.an-dark .sub-tab.active {
  color: #fff; border-color: #ffd98a;
  box-shadow: 0 0 18px rgba(232,196,118,.45), inset 0 0 14px rgba(232,196,118,.10);
  filter: brightness(1.3); transform: none;
}
/* 激活态背景提亮一档，四色依然可辨 + 统一金色发光边框 */
#tab-analyze.an-dark .sub-tab.active[data-sub="chat"]  { background: #2563eb; }
#tab-analyze.an-dark .sub-tab.active[data-sub="ask"]   { background: #059669; }
#tab-analyze.an-dark .sub-tab.active[data-sub="store"] { background: #ea7a0e; }
#tab-analyze.an-dark .sub-tab.active[data-sub="art"]   { background: #7c3aed; }

/* ask-38（2026-09-17）：AI 工具区四页签行右侧常驻「⚙ 配置 AI」。
   背景：黑金沉浸式改版把内容区页头 .content-head display:none 了，
   原页头里的配置入口随之失效 —— 在页签行右侧补一个，金边虚线黑金风，
   显隐由 app.js 控制：仅管理员/有客户分析权限的人可见。 */
#tab-analyze.an-dark .aicfg-dark {
  margin-left: auto;
  background: rgba(232,196,118,.10); color: #ffd98a;
  border: 1px dashed rgba(232,196,118,.45);
  font-size: 15px; font-weight: 800; padding: 12px 18px; border-radius: 14px;
  letter-spacing: .5px; transition: filter .15s ease, border-color .15s ease;
}
#tab-analyze.an-dark .aicfg-dark:hover {
  border-style: solid; border-color: #ffd98a; color: #fff; filter: brightness(1.25);
}

/* 卡片与表单深色化 —— 微信式「干净」：纯色底、无边框阴影堆叠 */
#tab-analyze.an-dark .card-soft {
  background: #0e1a2e; border-color: rgba(232,196,118,.10);
  box-shadow: none;
}
#tab-analyze.an-dark input[type=text], #tab-analyze.an-dark input[type=file],
#tab-analyze.an-dark textarea {
  background: #0b1424; border: 1px solid rgba(232,196,118,.22);
  color: #e8eef7; border-radius: 10px;
}
#tab-analyze.an-dark input::placeholder, #tab-analyze.an-dark textarea::placeholder { color: #5d6c82; }
#tab-analyze.an-dark input[type=file] { padding: 8px; }
#tab-analyze.an-dark .lbl-row { color: #aab6c8; }
#tab-analyze.an-dark .btn-primary {
  background: linear-gradient(135deg, #e8c476, #c9a14f);
  color: #1a1408; font-weight: 800; border: none;
}
#tab-analyze.an-dark .btn-primary:hover { filter: brightness(1.06); }
#tab-analyze.an-dark .btn-ghost {
  background: transparent; border: 1px solid rgba(232,196,118,.35); color: #d9c08a;
}
#tab-analyze.an-dark .error { color: #ff8f7d; }

/* 自动抓取条 */
#tab-analyze.an-dark .auto-title { color: #f0d9a8; }
#tab-analyze.an-dark .auto-desc { color: #8fa0b8; }
#tab-analyze.an-dark .auto-panel { background: #0d1930; border-color: rgba(232,196,118,.14); color: #c7d2e2; }
#tab-analyze.an-dark .auto-help p { color: #aab6c8; }
#tab-analyze.an-dark #auto-token { background: #0b1424; color: #e8c476; }
#tab-analyze.an-dark .auto-status { color: #aab6c8; }
#tab-analyze.an-dark .auto-switch-row { color: #c7d2e2; }

/* 截图上传区 */
#tab-analyze.an-dark .shot-zone { background: rgba(255,255,255,.02); border-color: rgba(232,196,118,.3); }
#tab-analyze.an-dark .shot-zone:hover, #tab-analyze.an-dark .shot-zone:focus,
#tab-analyze.an-dark .shot-zone.drag { border-color: #e8c476; background: rgba(232,196,118,.05); }
#tab-analyze.an-dark .shot-title { color: #e8eef7; }
#tab-analyze.an-dark .shot-sub { color: #8fa0b8; }
#tab-analyze.an-dark .an-extra { border-top-color: rgba(232,196,118,.18); }
#tab-analyze.an-dark .an-extra > summary { color: #e8c476; }

/* 对话问答深色 —— 微信式干净对话框：纯色聊天窗、气泡带小尖角、我方微信绿 */
#tab-analyze.an-dark .ask-msgs {
  background: #0c1424; border: none;
  border-radius: 10px; padding: 16px 14px;
}
#tab-analyze.an-dark .ask-empty { color: #5d6c82; }
#tab-analyze.an-dark .ask-ai .ask-bubble {
  background: #1c2a41; color: #e3ebf5; position: relative;
}
#tab-analyze.an-dark .ask-ai .ask-bubble::before {
  content: ""; position: absolute; left: -5px; top: 13px;
  border: 5px solid transparent; border-right-color: #1c2a41; border-left: 0;
}
#tab-analyze.an-dark .ask-ai .ask-bubble b { color: #ffd98a; }
#tab-analyze.an-dark .ask-me .ask-bubble {
  background: #3eb575; color: #fff; position: relative;
}
#tab-analyze.an-dark .ask-me .ask-bubble::before {
  content: ""; position: absolute; right: -5px; top: 13px;
  border: 5px solid transparent; border-left-color: #3eb575; border-right: 0;
}
#tab-analyze.an-dark .ask-me .ask-bubble b { color: #fff; }
#tab-analyze.an-dark .ask-input-row textarea { background: #0b1424; }
#tab-analyze.an-dark .ask-wait { color: #5d6c82; }
#tab-analyze.an-dark .ask-err { background: rgba(255,91,61,.12); color: #ff9f8f; }
/* 分析结果/体检结果：白卡去阴影，干净不压底 */
#tab-analyze.an-dark .analyze-result { box-shadow: none; border-color: var(--border); }

/* ============ 产品图片生成（AI 自动出图） ============ */
.art-grid { display: grid; grid-template-columns: minmax(0,1fr) 380px; gap: 20px; align-items: start; }
.art-preview { text-align: center; }
#art-result {
  width: 100%; max-width: 380px; border-radius: 12px;
  border: 1px solid rgba(232,196,118,.3);
  box-shadow: 0 8px 30px rgba(0,0,0,.4);
}
.art-loading {
  min-height: 320px; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 16px;
  border: 1px dashed rgba(232,196,118,.35); border-radius: 12px;
  color: #d9c08a; font-size: 14px; padding: 20px;
}
.art-loading p { margin: 0; }
.art-spin {
  width: 42px; height: 42px; border-radius: 50%;
  border: 3px solid rgba(232,196,118,.18); border-top-color: #e8c476;
  animation: artSpin 1s linear infinite;
}
@keyframes artSpin { to { transform: rotate(360deg); } }
#tab-analyze.an-dark .art-err { color: #ff9f8f; }

/* ============ ts49（2026-09-18 用户定版「不要白色，要科技版」）：AI 科技蓝主题（覆写层） ============
   演进：ts46 深空黑蓝（嫌暗）→ ts47 亮宝蓝（嫌暗+露白）→ ts48 浅蓝白（不要白色）→
   ts49 饱和科技蓝（本次定版）：比 ts46 明显亮、比 ts48 深，蓝得发光的 AI 霓虹风。
   深蓝渐变底 + 青紫霓虹光晕 + 网格 + 星点粒子 + 深蓝半透明卡片 + 白字 + 亮蓝按钮。 */
#tab-analyze.an-dark {
  background:
    radial-gradient(2px 2px at 18% 30%, rgba(255,255,255,.55), transparent 55%),
    radial-gradient(1.5px 1.5px at 64% 14%, rgba(125,211,252,.65), transparent 55%),
    radial-gradient(2px 2px at 84% 52%, rgba(255,255,255,.40), transparent 55%),
    radial-gradient(1.5px 1.5px at 38% 68%, rgba(167,139,250,.55), transparent 55%),
    radial-gradient(2px 2px at 52% 40%, rgba(125,211,252,.45), transparent 55%),
    radial-gradient(1.5px 1.5px at 8% 78%, rgba(255,255,255,.35), transparent 55%),
    radial-gradient(ellipse 62% 46% at 12% -8%, rgba(34,211,238,.30), transparent 62%),
    radial-gradient(ellipse 52% 42% at 88% -2%, rgba(167,139,250,.26), transparent 62%),
    radial-gradient(ellipse 88% 62% at 50% 118%, rgba(59,130,246,.34), transparent 68%),
    radial-gradient(ellipse 42% 32% at 72% 42%, rgba(34,211,238,.14), transparent 70%),
    linear-gradient(168deg, #17265e 0%, #1f3a8f 46%, #182a68 100%);
  border: 1px solid rgba(96,165,250,.35);
  box-shadow: 0 14px 44px rgba(0,0,0,.35), inset 0 1px 0 rgba(147,197,253,.15);
  min-height: 100vh; /* 铺满整个视口；配合 .content.content-dark 同色底，绝无露白 */
}
#tab-analyze.an-dark::after {
  background:
    linear-gradient(rgba(125,211,252,.10) 1px, transparent 1px),
    linear-gradient(90deg, rgba(125,211,252,.10) 1px, transparent 1px);
  background-size: 44px 44px;
  -webkit-mask-image: radial-gradient(ellipse 120% 100% at 50% 0%, #000 40%, transparent 100%);
          mask-image: radial-gradient(ellipse 120% 100% at 50% 0%, #000 40%, transparent 100%);
}
#tab-analyze.an-dark::before {
  background: linear-gradient(90deg, transparent, rgba(56,189,248,.9), transparent);
}
#tab-analyze.an-dark .blk-title { color: #cfe1ff; border-left-color: #3b82f6; }
#tab-analyze.an-dark .hint { color: #9db1d1; }
#tab-analyze.an-dark .hint b { color: #7dd3fc; }
#tab-analyze.an-dark .sub-tabs { background: rgba(255,255,255,.05); border-color: rgba(96,165,250,.25); }
#tab-analyze.an-dark .sub-tabs::after { background: linear-gradient(90deg, transparent, rgba(56,189,248,.5), transparent); }
#tab-analyze.an-dark .sub-tab { background: rgba(16,30,68,.9); color: #dbe7ff; border-color: rgba(96,165,250,.35); box-shadow: none; }
#tab-analyze.an-dark .sub-tab[data-sub="chat"]  { background: #2563eb; border-color: rgba(96,165,250,.6); color: #fff; }
#tab-analyze.an-dark .sub-tab[data-sub="ask"]   { background: #059669; border-color: rgba(52,211,153,.6); color: #fff; }
#tab-analyze.an-dark .sub-tab[data-sub="store"] { background: #d97706; border-color: rgba(251,191,36,.6); color: #fff; }
#tab-analyze.an-dark .sub-tab[data-sub="art"]   { background: #7c3aed; border-color: rgba(196,181,253,.6); color: #fff; }
#tab-analyze.an-dark .sub-tab:hover { border-color: #7dd3fc; color: #fff; filter: brightness(1.15); }
#tab-analyze.an-dark .sub-tab.active { color: #fff; border-color: #7dd3fc; box-shadow: 0 0 16px rgba(56,189,248,.45), inset 0 0 12px rgba(56,189,248,.12); filter: brightness(1.12); }
#tab-analyze.an-dark .sub-tab.active[data-sub="chat"]  { background: #1d4ed8; }
#tab-analyze.an-dark .sub-tab.active[data-sub="ask"]   { background: #047857; }
#tab-analyze.an-dark .sub-tab.active[data-sub="store"] { background: #c2660a; }
#tab-analyze.an-dark .sub-tab.active[data-sub="art"]   { background: #6d28d9; }
#tab-analyze.an-dark .aicfg-dark { background: rgba(56,189,248,.10); color: #7dd3fc; border-color: rgba(56,189,248,.45); }
#tab-analyze.an-dark .aicfg-dark:hover { border-color: #7dd3fc; color: #fff; }
#tab-analyze.an-dark .card-soft { background: rgba(13,25,58,.72); border-color: rgba(96,165,250,.22); box-shadow: 0 8px 26px rgba(0,0,0,.22); }
#tab-analyze.an-dark input[type=text], #tab-analyze.an-dark input[type=file],
#tab-analyze.an-dark textarea {
  background: rgba(9,18,42,.8); border: 1px solid rgba(96,165,250,.35); color: #e8eef7;
}
#tab-analyze.an-dark input::placeholder, #tab-analyze.an-dark textarea::placeholder { color: #64769a; }
#tab-analyze.an-dark .lbl-row { color: #aab9d6; }
#tab-analyze.an-dark .btn-primary { background: linear-gradient(135deg, #3b82f6, #1d4ed8); color: #fff; font-weight: 800; }
#tab-analyze.an-dark .btn-ghost { border-color: rgba(96,165,250,.5); color: #93c5fd; }
#tab-analyze.an-dark .shot-zone { background: rgba(255,255,255,.03); border-color: rgba(96,165,250,.4); }
#tab-analyze.an-dark .shot-zone:hover, #tab-analyze.an-dark .shot-zone:focus,
#tab-analyze.an-dark .shot-zone.drag { border-color: #38bdf8; background: rgba(56,189,248,.08); }
#tab-analyze.an-dark .shot-title { color: #e8eef7; }
#tab-analyze.an-dark .shot-sub { color: #9db1d1; }
#tab-analyze.an-dark .an-extra { border-top-color: rgba(96,165,250,.22); }
#tab-analyze.an-dark .an-extra > summary { color: #7dd3fc; }
#tab-analyze.an-dark .ask-msgs { background: rgba(9,18,42,.65); }
#tab-analyze.an-dark .ask-empty, #tab-analyze.an-dark .ask-wait { color: #64769a; }
#tab-analyze.an-dark .ask-ai .ask-bubble { background: #1e2f5c; color: #e3ebf5; }
#tab-analyze.an-dark .ask-ai .ask-bubble::before { border-right-color: #1e2f5c; }
#tab-analyze.an-dark .ask-ai .ask-bubble b { color: #7dd3fc; }
#tab-analyze.an-dark .ask-input-row textarea { background: rgba(9,18,42,.8); }
#tab-analyze.an-dark .art-err { color: #ff9f8f; }
/* 历史分析列表：白卡片同步染深蓝（ts49b），黑字换浅色，否则深蓝底上白色大块很突兀 */
#tab-analyze.an-dark .hist-item { background: rgba(13,25,58,.72); border-color: rgba(96,165,250,.25); box-shadow: 0 4px 14px rgba(0,0,0,.2); }
#tab-analyze.an-dark .hist-cust { color: #e8eef7; }
#tab-analyze.an-dark .hist-cat { color: #93c5fd; background: rgba(59,130,246,.16); }
#tab-analyze.an-dark .hist-time { color: #7e93b8; }
#tab-analyze.an-dark .hist-who { color: #9db1d1; background: rgba(255,255,255,.06); border-color: rgba(96,165,250,.3); }
/* ts166：店铺体检历史列表（hist-title/hist-meta）此前漏了深色覆盖 —— 深灰字配深蓝底，
   老板看不清（2026-09-21 照片反馈）。补齐文字与按钮对比度。 */
#tab-analyze.an-dark .hist-title { color: #f1f5f9; font-weight: 600; }
#tab-analyze.an-dark .hist-meta { color: #a8bcdb; }
#tab-analyze.an-dark .hist-item .btn-ghost { color: #bfdbfe; border-color: rgba(96,165,250,.45); }
#tab-analyze.an-dark .hist-item .btn-ghost:hover { background: rgba(96,165,250,.15); color: #fff; }
#tab-analyze.an-dark .hist-who.me { color: #6ee7a0; background: rgba(16,185,129,.14); border-color: rgba(52,211,153,.4); }
#tab-analyze.an-dark .mini-btn { background: rgba(9,18,42,.6); border-color: rgba(96,165,250,.45); color: #93c5fd; }
#tab-analyze.an-dark .mini-btn:hover { border-color: #7dd3fc; color: #fff; }
#tab-analyze.an-dark .del-btn { color: #ff9f8f; border-color: rgba(248,113,113,.45); }
#tab-analyze.an-dark .del-btn:hover { background: #dc2626; border-color: #dc2626; color: #fff; }
#tab-analyze.an-dark .empty { color: #7e93b8; }
.art-loading { border-color: rgba(96,165,250,.45); color: #93c5fd; }
.art-spin { border-color: rgba(96,165,250,.22); border-top-color: #38bdf8; }
#art-result { border-color: rgba(96,165,250,.4); box-shadow: 0 10px 30px rgba(0,0,0,.35); }
/* 内容区同步染色：切到「客户分析」时整个内容底色与主题一致（app.js 加/去 content-dark 类）
   —— 即使容器因极端机型高度计算偏差变矮，露出的也是同色底，永不露白。 */
.content.content-dark { background: linear-gradient(168deg, #17265e, #1f3a8f); }
.art-dl { display: inline-block; margin-top: 12px; text-decoration: none; padding: 10px 24px; border-radius: 10px; }
@media (max-width: 900px) {
  .art-grid { grid-template-columns: 1fr; }
  .art-preview { order: -1; }
}

@keyframes askNewPulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.22); }
}

/* ============ 对话问答 ============ */
.ask-wrap { max-width: 980px; }
.ask-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.ask-msgs {
  margin-top: 12px; height: calc(100vh - 290px); min-height: 300px; overflow-y: auto;
  display: flex; flex-direction: column; gap: 10px; padding: 4px 2px;
}
.ask-empty { text-align: center; color: var(--muted, #98a1b3); font-size: 13px; padding: 22px 0; }
.ask-msg { display: flex; }
.ask-me { justify-content: flex-end; }
.ask-bubble {
  max-width: 78%; padding: 10px 14px; border-radius: 14px; font-size: 14px; line-height: 1.65;
  white-space: normal; word-break: break-word;
}
.ask-bubble p { margin: 0 0 6px; }
.ask-bubble p:last-child, .ask-bubble ul:last-child { margin-bottom: 0; }
.ask-bubble ul { margin: 4px 0 6px; padding-left: 18px; }
.ask-me .ask-bubble { background: var(--primary); color: #fff; border-bottom-right-radius: 4px; }
.ask-ai .ask-bubble { background: #f4f6fa; color: var(--text, #26303e); border-bottom-left-radius: 4px; }
.ask-wait { color: var(--muted, #98a1b3); font-size: 13px; }
.ask-err { background: #fdecec; color: #c0392b; font-size: 13px; }
.ask-input-row { display: flex; gap: 10px; align-items: flex-end; margin-top: 12px; }
.ask-input-row textarea {
  flex: 1; resize: none; border: 1px solid var(--border); border-radius: 12px;
  padding: 10px 12px; font-size: 14px; font-family: inherit; line-height: 1.5; outline: none;
  background: #fff; transition: border-color .15s;
}
.ask-input-row textarea:focus { border-color: var(--primary); }
.ask-input-row .btn-primary { height: 42px; padding: 0 22px; flex-shrink: 0; }
.ask-input-row .btn-primary:disabled { opacity: .55; cursor: not-allowed; }

/* ============ 店铺体检 ============ */
.st-intro { margin-bottom: 16px; }
.st-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-bottom: 16px; }

.st-zone { background: #fff; border: 1px solid var(--border); border-radius: 12px; padding: 14px; }
.st-zone-head { display: flex; gap: 10px; align-items: flex-start; margin-bottom: 10px; }
.st-ico { font-size: 22px; line-height: 1.1; }
.st-zone-title { font-size: 14px; font-weight: 800; color: var(--text-1); }
.st-zone-sub { font-size: 12px; color: var(--text-2); margin-top: 2px; line-height: 1.4; }

.st-drop {
  border: 2px dashed var(--border); border-radius: 10px; min-height: 84px;
  display: flex; align-items: center; justify-content: center; cursor: pointer;
  transition: all .16s; background: #fafbfd;
}
.st-drop:hover, .st-drop.over { border-color: var(--primary); background: #eef4ff; }
.st-drop-inner { font-size: 13px; color: var(--text-2); }

.st-prev { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.st-prev .shot-thumb { position: relative; width: 62px; height: 62px; border-radius: 8px;
  overflow: hidden; border: 1px solid var(--border); }
.st-prev .shot-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.st-prev .shot-thumb .x {
  position: absolute; top: 0; right: 0; width: 18px; height: 18px; line-height: 16px;
  text-align: center; background: rgba(0,0,0,.6); color: #fff; font-size: 13px;
  cursor: pointer; border: 0; padding: 0; border-radius: 0 0 0 6px;
}

.st-run-row { display: flex; flex-wrap: wrap; gap: 14px; align-items: flex-end; }
.st-shop-input, .st-note-input { display: flex; flex-direction: column; font-size: 12.5px;
  color: var(--text-2); gap: 5px; flex: 1 1 220px; }
.st-shop-input input, .st-note-input input {
  padding: 10px 12px; border: 1px solid var(--border); border-radius: 9px;
  font-size: 14px; outline: none; transition: border-color .16s;
}
.st-shop-input input:focus, .st-note-input input:focus { border-color: var(--primary); }
.st-run-btns { display: flex; gap: 10px; }

.st-progress { font-size: 13px; color: var(--text-2); margin-top: 10px; }
.st-progress b { color: var(--primary); }

/* 结果区 */
.st-result { margin-top: 20px; }
.st-card { background: #fff; border: 1px solid var(--border); border-radius: 12px;
  padding: 16px 18px; margin-bottom: 14px; }
.st-card > h4 { margin: 0 0 12px; font-size: 15.5px; color: var(--text-1);
  display: flex; align-items: center; gap: 8px; }
.st-card > h4 .badge { font-size: 11px; font-weight: 700; padding: 2px 8px;
  border-radius: 20px; background: #eef4ff; color: var(--primary); }

.st-hero { background: linear-gradient(135deg, #0b2447, #1b3a63); color: #fff;
  border-radius: 12px; padding: 20px 22px; margin-bottom: 14px; }
.st-hero .name { font-size: 21px; font-weight: 800; margin-bottom: 6px; }
.st-hero .meta { font-size: 12.5px; opacity: .78; margin-bottom: 14px; }
.st-hero .head { font-size: 15px; font-weight: 700; line-height: 1.5;
  padding-left: 12px; border-left: 3px solid #d99a2b; margin-bottom: 10px; }
.st-hero .det { font-size: 13.5px; line-height: 1.7; opacity: .9; }
.st-hero .dl { display: flex; gap: 10px; margin-top: 16px; flex-wrap: wrap; }

.st-facts { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 10px; }
.st-fact { background: #f6f8fc; border-radius: 10px; padding: 11px 13px;
  border-left: 3px solid var(--primary); }
.st-fact .l { font-size: 11.5px; color: var(--text-2); margin-bottom: 4px; }
.st-fact .v { font-size: 17px; font-weight: 800; color: var(--text-1); word-break: break-all; }
.st-fact.warn { border-left-color: #d99a2b; background: #fffaf0; }
.st-fact.warn .v { font-size: 13.5px; color: #a87615; }
.st-fact.miss { border-left-color: #c0392b; background: #fdf3f1; }
.st-fact.miss .v { font-size: 13.5px; color: #c0392b; }
.st-fact .t { font-size: 10.5px; color: #a87615; margin-top: 4px; }
.st-fact.miss .t { color: #c0392b; }

.st-issue { padding: 12px 0 12px 14px; border-left: 3px solid #d99a2b;
  border-bottom: 1px dashed var(--border); }
.st-issue:last-child { border-bottom: 0; }
.st-issue.high { border-left-color: #c0392b; }
.st-issue.low { border-left-color: var(--primary); }
.st-issue .t { font-size: 14.5px; font-weight: 800; color: var(--text-1);
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.st-issue .d { font-size: 13px; color: var(--text-2); line-height: 1.65; margin-top: 6px; }
.st-issue .ev { font-size: 11.5px; color: var(--text-2); opacity: .8; margin-top: 5px; }

.st-voice { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.st-voice .q { background: #fdf3f1; border-left: 3px solid #c0392b; border-radius: 8px;
  padding: 11px 13px; font-size: 13px; color: #6b3a33; line-height: 1.6; }
.st-voice .a { background: #f6f8fc; border-radius: 8px; padding: 11px 13px; }
.st-voice .a .r { font-size: 13px; color: var(--text-2); line-height: 1.6; }
.st-voice .a .f { font-size: 12.5px; color: #1e8e5a; line-height: 1.6; margin-top: 6px; }
.st-voice .a .f b { color: #146b43; }
.st-voice .lab { font-size: 10.5px; font-weight: 800; margin-bottom: 5px; }

.st-rival { padding: 12px 0 12px 14px; border-left: 3px solid #1b3a63;
  border-bottom: 1px dashed var(--border); }
.st-rival:last-child { border-bottom: 0; }
.st-rival .n { font-size: 14.5px; font-weight: 800; color: var(--text-1); }
.st-rival .g { font-size: 13px; color: var(--text-2); line-height: 1.65; margin-top: 6px; }
.st-rival .l { font-size: 12.5px; color: #1e8e5a; line-height: 1.6; margin-top: 6px; }

.st-plan { counter-reset: stp; }
.st-step { display: flex; gap: 12px; padding: 11px 0; border-bottom: 1px dashed var(--border); }
.st-step:last-child { border-bottom: 0; }
.st-step .n { flex: 0 0 26px; height: 26px; border-radius: 50%; background: var(--primary);
  color: #fff; font-size: 13px; font-weight: 800; display: flex;
  align-items: center; justify-content: center; }
.st-step .b { flex: 1; }
.st-step .a { font-size: 14px; font-weight: 700; color: var(--text-1); }
.st-step .w { font-size: 12.5px; color: var(--text-2); line-height: 1.6; margin-top: 4px; }

.st-gain { display: inline-block; background: #eef7f2; color: #146b43; border-radius: 20px;
  padding: 6px 13px; font-size: 12.5px; margin: 0 8px 8px 0; }

.st-srcbar { display: flex; gap: 14px; flex-wrap: wrap; font-size: 12px;
  color: var(--text-2); align-items: center; }
.st-srcbar .pill { padding: 3px 10px; border-radius: 20px; font-weight: 700; }
.st-srcbar .ok { background: #eef7f2; color: #146b43; }
.st-srcbar .inf { background: #fffaf0; color: #a87615; }
.st-srcbar .miss { background: #fdf3f1; color: #c0392b; }

@media (max-width: 900px) {
  .st-grid { grid-template-columns: 1fr; }
  .st-voice { grid-template-columns: 1fr; }
}

/* ==================== 2026-09-19 ask-15/13/16：防闪现 splash + 强制改密 + 头像 ==================== */
/* 有 token 时先藏登录页、亮 splash，等 boot 验证完再切换 —— 纯 CSS，零 JS 依赖，杜绝闪现 */
html.kb-booting #login-view { display: none !important; }
html.kb-booting #app-view { display: none !important; }

#boot-splash { display: none; }
html.kb-booting #boot-splash {
  display: flex; position: fixed; inset: 0; z-index: 99999;
  background: linear-gradient(160deg, #eef4fb 0%, #f7f9fc 55%, #eaf3ee 100%);
  align-items: center; justify-content: center;
}
.boot-box { text-align: center; color: #4a5568; }
.boot-spin {
  width: 46px; height: 46px; margin: 0 auto 16px;
  border: 4px solid rgba(37, 99, 235, 0.15); border-top-color: var(--primary, #2563eb);
  border-radius: 50%; animation: kbBootSpin 0.9s linear infinite;
}
.boot-box p { font-size: 14px; font-weight: 600; letter-spacing: 1px; color: #64748b; }
@keyframes kbBootSpin { to { transform: rotate(360deg); } }

/* 强制改密：不可关闭提示条 */
#pwd-force-tip {
  background: #fff7ed; border: 1px solid #fdba74; color: #9a3412;
  border-radius: 10px; padding: 10px 14px; font-size: 13px; line-height: 1.7;
  margin-bottom: 14px; text-align: left; font-weight: 600;
}

/* 侧栏头像：点击上传/更换，右下角相机角标 */
.su-avatar {
  position: relative; width: 42px; height: 42px; border-radius: 50%;
  background: #e8eef7; border: 2px solid rgba(255, 255, 255, 0.85);
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.14);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; overflow: visible; flex: 0 0 42px; user-select: none;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.su-avatar:hover { transform: scale(1.08); box-shadow: 0 3px 12px rgba(15, 23, 42, 0.22); }
.su-avatar:active { transform: scale(0.96); }
.su-avatar #su-avatar-ico { font-size: 22px; line-height: 1; }
.su-avatar #su-avatar-img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  border-radius: 50%; object-fit: cover;
}
.su-avatar .su-avatar-edit {
  position: absolute; right: -3px; bottom: -3px; width: 18px; height: 18px;
  border-radius: 50%; background: var(--primary, #2563eb); color: #fff;
  font-size: 10px; line-height: 18px; text-align: center;
  border: 2px solid #fff; opacity: 0; transform: scale(0.6);
  transition: opacity 0.15s ease, transform 0.15s ease;
}
.su-avatar:hover .su-avatar-edit { opacity: 1; transform: scale(1); }

/* 用户列表「未改初始密码」徽章 */
.pwd-due {
  display: inline-block; margin-left: 6px; padding: 1px 7px;
  border-radius: 9px; background: #fee2e2; color: #b91c1c;
  font-size: 11px; font-weight: 700; white-space: nowrap;
  animation: pwdDuePulse 1.6s ease-in-out infinite;
}
@keyframes pwdDuePulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.55; }
}

/* ==================== 英雄每日战绩汇报（2026-09-15 新增） ====================
   2026-09-15 ask-19g：老板反馈「字体粗一些，大一些，都看不清楚」。
   本轮把战报页的字号/字重整体上调一档（约 +1~2px、字重普遍提到 800/900），
   重点是表单标签、输入框数字、勾选文字、标准说明这几处「要看清才能填对」的地方。
   调整时注意：改字号要同步看 verify_battle*.py 里的字号断言，别让验证脚本先红。 */
.bt-loading { padding: 48px 20px; text-align: center; color: var(--text-2); font-size: 15px; }
.bt-loading.bt-err { color: #c0392b; }

/* ---------- 外壳与背景 ---------- */
/* 2026-09-15 重构：老板反馈「布局和背景都不好看」。
   旧版是「白底 + 一坨大表单 + 右侧窄卡」，三种横向色带平铺，几乎没有层次。
   新版：顶部深色渐变头部（标题/标准/日期都收进去）→ 下方浅灰内容底，
   各功能区拆成独立白卡悬浮其上，形成「头重脚轻」的纵深。 */
.bt-shell { margin: -6px -4px 0; }
/* 内容区：浅灰底 + 圆角，向上「钻」到深色头部底下 26px，
   形成头部压在内容之上的层次感（头部有 z-index 兜着）。 */
.bt-body { background: #f1f4f9; border-radius: 16px; padding: 16px 16px 18px;
  margin-top: -26px; padding-top: 40px; position: relative; z-index: 0; }

/* ---------- 深色渐变头部 ---------- */
.bt-hero { display: flex; justify-content: space-between; align-items: flex-start;
  gap: 20px; flex-wrap: wrap;
  background: linear-gradient(120deg, #17203a 0%, #223056 45%, #2d3f6e 100%);
  border-radius: 16px; padding: 20px 24px 34px; position: relative; overflow: hidden;
  z-index: 1; box-shadow: 0 6px 20px rgba(23, 32, 58, .18); }
/* 右上角一团柔光，避免深色过于死板 */
.bt-hero::after { content: ""; position: absolute; right: -70px; top: -90px;
  width: 260px; height: 260px; border-radius: 50%;
  background: radial-gradient(circle, rgba(90, 140, 255, .38), transparent 68%); }
.bt-hero-l, .bt-hero-r { position: relative; z-index: 1; }
.bt-hero-title { font-size: 24px; font-weight: 900; color: #fff; margin: 0 0 6px;
  letter-spacing: .4px; }
.bt-hero-sub { font-size: 14.5px; font-weight: 600; color: #b7c4dd; margin: 0 0 14px; }
.bt-hero-chips { display: flex; gap: 8px; flex-wrap: wrap; }
.bt-hchip { font-size: 14px; font-weight: 600; color: #dbe4f6; background: rgba(255, 255, 255, .12);
  border: 1px solid rgba(255, 255, 255, .16); border-radius: 20px; padding: 6px 14px; }
.bt-hchip b { color: #fff; font-weight: 900; margin: 0 1px; font-size: 15.5px; }
/* 周六不考核的项目：压暗 + 划线，一眼看出「今天这项不算数」 */
.bt-hchip-off { color: #93a2bd; text-decoration: line-through;
  background: rgba(255, 255, 255, .05); border-style: dashed; }
.bt-hero-r { text-align: right; }
.bt-hero-day-l { font-size: 13px; color: #b7c4dd; }
.bt-hero-day-v { font-size: 29px; font-weight: 900; color: #fff; margin: 2px 0 4px;
  font-variant-numeric: tabular-nums; letter-spacing: .5px; }
.bt-hero-day-t { display: inline-block; font-size: 12.5px; font-weight: 700; color: #8ee0b4;
  background: rgba(40, 190, 120, .16); border-radius: 20px; padding: 3px 11px; }
.bt-hero-deadline { font-size: 13px; font-weight: 700; color: #ffcf8f; margin-top: 8px; }

/* ---------- 两栏 ----------
   断点定在 1240px：小于这个宽度时主栏被压到 400 多 px，四个输入框挤成一条，
   不如干脆变成单列上下排（右栏的罚款/明细卡本来在手机上也该完整铺开）。 */
.bt-cols { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 14px;
  align-items: start; }
@media (max-width: 1240px) { .bt-cols { grid-template-columns: 1fr; } }
/* padding-bottom 给粘住的提交条让位，否则它会盖住最后一张卡片 */
.bt-col-main { display: flex; flex-direction: column; gap: 12px; padding-bottom: 66px; }
.bt-col-side { display: flex; flex-direction: column; gap: 12px; position: sticky;
  top: 12px; }
/* 单列（窄屏）时右栏卡片铺满整宽会显得又矮又长，改成并排两列更好看 */
@media (max-width: 1240px) {
  .bt-col-side { position: static; display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
  .bt-admin-btn { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
  .bt-col-side { grid-template-columns: 1fr; }
}

/* ---------- 通用卡片 ---------- */
.bt-card { background: #fff; border: 1px solid #e3e9f2; border-radius: 14px;
  box-shadow: 0 1px 3px rgba(15, 23, 42, .05); overflow: hidden; }
.bt-card-hd { display: flex; align-items: baseline; justify-content: space-between;
  gap: 12px; flex-wrap: wrap; padding: 14px 18px; border-bottom: 1px solid #eef2f8;
  background: linear-gradient(180deg, #fbfcfe, #fff); }
.bt-card-hd-t { font-size: 16px; font-weight: 900; color: #0b1220; letter-spacing: .2px; }
.bt-card-hd-s { font-size: 13px; font-weight: 600; color: #8a97a8; }
.bt-card-bd { padding: 17px 18px; }

/* ---------- 数据填写：四宫格 ---------- */
/* 2×2 排布：三个必填项 + 姓名（只读）。姓名放右下角当「落款」，
   比单列四行省一半高度，也比 3+1 的孤行好看。 */
.bt-fgrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 20px; }
@media (max-width: 520px) { .bt-fgrid { grid-template-columns: 1fr; } }
.bt-f { display: flex; flex-direction: column; }
/* 表单标签：老板「看不清楚」的第一现场，字号 15.5 → 17.5，字重已经顶格 900 */
.bt-flb { font-size: 17.5px; font-weight: 900; color: #0b1220; margin-bottom: 7px;
  padding-left: 10px; border-left: 4px solid var(--primary); line-height: 1.25;
  letter-spacing: .2px; }
.bt-req { color: #dc2626; font-style: normal; font-size: 18px; font-weight: 900;
  vertical-align: middle; }
/* 输入框：员工要看清自己填的数字，44 → 48 高，17 → 19px 且用 800 字重压住 */
.bt-finp { height: 48px; border: 1.5px solid #d5dfec; border-radius: 10px;
  padding: 0 14px; font-size: 19px; font-weight: 800; color: #0b1220; background: #fff;
  font-variant-numeric: tabular-nums; width: 100%; box-sizing: border-box;
  transition: border-color .15s, box-shadow .15s; }
.bt-finp:focus { outline: none; border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .13); }
.bt-readonly { background: #f4f7fb; color: #55637a; font-weight: 800; }
/* 标准说明：这行看不清楚就会填错数，所以从 11.5px 一口气提到 13.5px 并加深颜色 */
.bt-ftip { font-size: 13.5px; color: #64748b; font-weight: 600; line-height: 1.5; margin-top: 6px; }
.bt-f-ro .bt-flb { border-left-color: #cbd5e1; color: #64748b; }

/* ---------- 凭证上传 ---------- */
.bt-drop-row { display: flex; align-items: center; gap: 12px; padding: 11px 0; }
.bt-drop-row + .bt-drop-row { border-top: 1px dashed #eef2f8; }
.bt-drop-lb { flex: 0 0 118px; font-size: 15px; font-weight: 900; color: #1f2937; }
.bt-shot { display: flex; align-items: center; gap: 9px; flex-wrap: wrap;
  flex: 1; min-height: 44px; border-radius: 10px; transition: background .15s; }
.bt-shot-none { font-size: 14px; color: #94a3b8; font-weight: 600; }
.bt-shot-has { font-size: 14px; color: #146b43; background: #eef7f2; border-radius: 20px;
  padding: 6px 14px; text-decoration: none; font-weight: 800; }
.bt-shot-has:hover { background: #e0f2e9; }
.bt-shot-hint { font-size: 13.5px; color: #94a3b8; }
.bt-up { height: 38px; padding: 0 16px; border: 1px dashed var(--primary);
  background: #f4f8ff; color: var(--primary); border-radius: 9px; font-size: 14px;
  font-weight: 800; cursor: pointer; transition: all .15s; }
.bt-up:hover { background: #e8f1ff; }

/* ---------- 8 点报备 ---------- */
.bt-c8 { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.bt-c8-tip { font-size: 13.5px; font-weight: 700; color: #a87615; margin-left: auto; }
/* 未到 07:00 的锁定提示：做成醒目的黄色小胶囊，跟「可以勾」的蓝胶囊区分开 */
.bt-c8-lock { font-size: 13.5px; font-weight: 900; color: #a06a00; background: #fff9ec;
  border: 1.5px solid #ffe0a8; border-radius: 20px; padding: 5px 13px; }
.bt-check { display: inline-flex; align-items: center; gap: 10px; padding: 10px 20px;
  border-radius: 24px; border: 1.5px solid #d7dfea; background: #f7f9fc;
  cursor: pointer; transition: all .15s ease; }
.bt-check:hover { border-color: var(--primary); background: #f0f5ff; }
.bt-check input { width: 23px; height: 23px; cursor: pointer; accent-color: var(--primary); }
/* 「朋友圈」/「群发」是员工每次都要认的两个词，原来 13.5px 灰字太淡，
   老板看不清 —— 放大到 18px、加重到 900、色值加深，跟「已按时发送」齐平。 */
.bt-check-txt { font-size: 17px; font-weight: 900; color: #1f2937; letter-spacing: .3px; }
.bt-c8-what { font-size: 18px; font-weight: 900; color: #334155; letter-spacing: .3px; }
/* 主选择器用 .bt-check-on（由 JS 同步），:has 仅作支持时的增强 —— 旧内核不认 :has */
.bt-check.bt-check-on { background: #e8f1ff; border-color: var(--primary);
  box-shadow: 0 1px 6px rgba(37, 99, 235, .16); }
.bt-check.bt-check-on .bt-check-txt { color: var(--primary); }
.bt-check.bt-check-on .bt-c8-what { color: var(--primary); }
.bt-check:has(input:checked) { background: #e8f1ff; border-color: var(--primary); }
/* ---------- 8 点未到点（07:00 前）的锁定态 ----------
   视觉上给「点不动」一个明确交代：灰底、虚线框、cursor 禁止。
   注意别只靠 opacity —— 那样看起来像「禁用但还能点」，员工会反复戳。 */
.bt-check-lock { background: #f4f6f9 !important; border-color: #dbe2ec !important;
  border-style: dashed !important; cursor: not-allowed !important;
  box-shadow: none !important; }
.bt-check-lock:hover { background: #f4f6f9 !important; border-color: #dbe2ec !important; }
.bt-check-lock .bt-check-txt { color: #98a4b5 !important; }
.bt-check-lock .bt-c8-what { color: #b3bcc9 !important; }
.bt-check-lock input { cursor: not-allowed !important; accent-color: #b3bcc9; }

/* ---------- 底部提交条 ----------
   放在主栏末尾。用 sticky 粘在视口底部：页面滚动时提交按钮始终可见，
   不用滚到底才能交 —— 员工填完随手就能点。 */
.bt-footbar { display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  padding: 13px 18px; background: #fff; border: 1px solid #e3e9f2;
  border-radius: 14px; box-shadow: 0 -2px 12px rgba(15, 23, 42, .07);
  position: sticky; bottom: 10px; z-index: 5; }
.bt-submit { height: 48px; padding: 0 32px; font-size: 16.5px; font-weight: 900;
  border-radius: 10px; cursor: pointer; letter-spacing: .3px; }
.bt-submit:disabled { opacity: .6; cursor: not-allowed; }
.bt-lock-tip { font-size: 13.5px; font-weight: 600; color: var(--text-2); }

/* ---------- 管理员全员汇总视图的头部 ----------
   注意：这几个类名被「全员战报汇总」页面复用（battleRender 之外的
   battleAdminView），重构主视图时不能连它们一起删，否则那个页面会散架。 */
.bt-head { display: flex; justify-content: space-between; align-items: flex-start;
  gap: 16px; flex-wrap: wrap; margin-bottom: 14px; }
.bt-title { font-size: 23px; font-weight: 900; color: var(--text-1); margin: 0 0 6px; }
.bt-sub { font-size: 14.5px; font-weight: 600; color: var(--text-2); margin: 0; line-height: 1.6; }
.bt-sub b { color: #c0392b; }
.bt-red { color: #c0392b; font-weight: 900; }
.bt-head-btns { display: flex; gap: 8px; flex-wrap: wrap; }

/* ---------- 旧类名兼容（拖动高亮等仍在用） ---------- */
.bt-shot-drag { background: #e8f1ff; outline: 2px dashed var(--primary);
  outline-offset: 2px; }

/* 右侧罚款卡 */
.bt-side { display: flex; flex-direction: column; gap: 12px; position: sticky; top: 12px; }
.bt-fine { background: #fff; border: 1px solid #e3e9f2; border-radius: 14px;
  overflow: hidden; box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05); }
.bt-fine-head { padding: 17px 18px; }
.bt-fine-good { background: linear-gradient(135deg, #eef7f2, #e3f4ea); }
.bt-fine-bad { background: linear-gradient(135deg, #fdf3f1, #fde8e4); }
.bt-fine-label { font-size: 14.5px; font-weight: 900; color: var(--text-1); }
.bt-fine-total { font-size: 36px; font-weight: 900; color: #c0392b; line-height: 1.15;
  font-variant-numeric: tabular-nums; margin-top: 4px; }
.bt-fine-total small { font-size: 15px; font-weight: 800; }
.bt-fine-good .bt-fine-total { color: #146b43; }
.bt-fine-body { padding: 6px 0; }
.bt-fine-row { display: flex; align-items: center; gap: 8px; padding: 10px 18px;
  border-bottom: 1px dashed var(--border); font-size: 14px; font-weight: 600; }
.bt-fine-row:last-child { border-bottom: 0; }
.bt-fine-n { flex: 0 0 80px; font-weight: 900; color: var(--text-1); }
.bt-fine-d { flex: 1; color: #55637a; }
.bt-fine-a { font-weight: 900; color: #c0392b; font-variant-numeric: tabular-nums; }
.bt-fine-none { padding: 18px; text-align: center; font-size: 14.5px; color: #146b43;
  font-weight: 800; }
.bt-fine-note { padding: 12px 18px; background: #f8fafc; font-size: 13px; font-weight: 600;
  color: #64748b; line-height: 1.7; border-top: 1px solid var(--border); }

/* 罚款出现时的抖动提醒：老板要的「系统自动提醒出来」 */
@keyframes btShake {
  0%, 100% { transform: translateX(0); }
  20% { transform: translateX(-5px); }
  40% { transform: translateX(5px); }
  60% { transform: translateX(-3px); }
  80% { transform: translateX(3px); }
}
.bt-fine.bt-flash { animation: btShake 0.5s ease-in-out; }

.bt-admin-btn { height: 40px; border: 1px solid var(--primary); background: #f4f8ff;
  color: var(--primary); border-radius: 10px; font-size: 13.5px; font-weight: 700;
  cursor: pointer; width: 100%; }
.bt-admin-btn:hover { background: #e8f1ff; }

.bt-h3 { font-size: 16.5px; font-weight: 900; color: var(--text-1); margin: 20px 0 10px; }
.bt-table-wrap { overflow-x: auto; background: #fff; border: 1px solid var(--border);
  border-radius: 12px; }
.bt-table { width: 100%; border-collapse: collapse; font-size: 14px; white-space: nowrap; }
.bt-table th { background: #f8fafc; padding: 12px 14px; text-align: left;
  font-weight: 900; color: var(--text-1); border-bottom: 1px solid var(--border);
  font-size: 13.5px; }
.bt-table td { padding: 12px 14px; border-bottom: 1px solid #f1f5f9; color: var(--text-1);
  font-weight: 600; }
.bt-table tr:last-child td { border-bottom: 0; }
.bt-table tbody tr:hover { background: #fbfcfe; }
.bt-sub2 { font-size: 12.5px; font-weight: 600; color: #8a97a8; margin-top: 2px; }
.bt-fine-cell { color: #c0392b; font-weight: 900; font-variant-numeric: tabular-nums; }
.bt-ok-cell { color: #146b43; font-weight: 800; }
.bt-empty { text-align: center; color: var(--text-2); padding: 26px 0; }

/* ==================== 战报：今日提交次数提示条（ask-19c） ====================
   老板要求「当日数据更新只有2次机会，禁止多次修改」，条子让员工随时看得见还剩几次。
   三态：正常（蓝）/ 已用一次（橙）/ 用完或已截止（灰红）。 */
.bt-quota { font-size: 14.5px; font-weight: 600; line-height: 1.6; border-radius: 12px;
  padding: 12px 16px; margin-bottom: 16px; border: 1px solid #cfe0ff;
  background: #f4f8ff; color: #1b4d9b; }
.bt-quota b { font-weight: 900; color: var(--primary); font-size: 15.5px; }
.bt-quota-warn { border-color: #ffe0a8; background: #fff9ec; color: #a06a00; }
.bt-quota-warn b { color: #b8791a; }
.bt-quota-off { border-color: #f5c6c6; background: #fff5f5; color: #b02a2a; font-weight: 800; }
/* ask-19j：管理员「不限次数」提示条 —— 蓝紫底，跟普通蓝色信息条区分 */
.bt-quota-admin { border-color: #d8d4ff; background: #f4f2ff; color: #4c3fd4; font-weight: 700; }
.bt-quota-admin b { color: #4c3fd4; }

/* ---------- ask-19j：整表锁定（18:00 未开门 / 次数用完 / 已截止） ----------
   跟 .bt-check-lock 同一思路：灰底 + 虚线 + not-allowed，不用 opacity ——
   「看起来变淡但还能点」的假禁用最坑人，员工会反复戳。 */
.bt-card-locked { border-style: dashed; border-color: #dbe2ec; background: #fafbfd; }
.bt-card-locked .bt-card-hd { border-bottom-color: #eef1f6; }
.bt-card-locked .bt-card-hd-t { color: #8a97a8; }
.bt-finp:disabled { background: #eef1f5; color: #9aa6b6; border-color: #e2e8f0;
  cursor: not-allowed; -webkit-text-fill-color: #9aa6b6; }
.bt-up:disabled { border-color: #dbe2ec; color: #9aa6b6; background: #f4f6f9;
  cursor: not-allowed; }
.bt-card-locked .bt-drop-lb { color: #9aa6b6; }
.bt-card-locked .bt-ftip { color: #a8b3c2; }
/* 周六躺平提示：跟在次数条尾巴上，绿底胶囊，跟警告色区分开 */
.bt-quota-sat { display: inline-block; margin-left: 8px; padding: 2px 11px;
  border-radius: 20px; background: #eef7f2; color: #146b43; font-size: 13px; font-weight: 900;
  border: 1px solid #cfeadd; }

/* ==================== 免处罚（ask-19g，2026-09-15） ====================
   老板：「节假日没有上报数据、被罚款了，由管理账号可以设置子账号免处罚」。
   三处视觉：① 顶部横幅告诉员工「今天不罚你」；② 右侧/汇总页的豁免按钮；
   ③ 汇总表里豁免行整行泛绿并标出原金额，免得管理员看漏「本来是罚了的」。 */
.bt-exempt-bar { font-size: 14.5px; font-weight: 600; line-height: 1.6; border-radius: 12px;
  padding: 12px 16px; margin-bottom: 16px; border: 1px solid #cfeadd;
  background: #eef7f2; color: #146b43; }
.bt-exempt-bar b { font-weight: 900; }
.bt-exempt-btn { margin-top: 0; border-color: #cfeadd; background: #f2fbf6; color: #146b43; }
.bt-exempt-btn:hover { background: #e6f6ed; }
.bt-exempt-btn:disabled { opacity: .55; cursor: not-allowed; }
.bt-exempt-btn.bt-exempt-on { background: #146b43; color: #fff; border-color: #146b43; }
.bt-exempt-txt { color: #146b43; }
.bt-exempt-tip { font-size: 13.5px; font-weight: 600; line-height: 1.7; color: #146b43;
  background: #eef7f2; border: 1px solid #cfeadd; border-radius: 12px;
  padding: 11px 15px; margin-bottom: 4px; }
.bt-exempt-cell { color: #146b43; font-weight: 900; white-space: nowrap; }
.bt-row-exempt td { background: #f6fbf8; }
.bt-ex-btn { border: 1px solid #cfeadd; background: #f2fbf6; color: #146b43;
  border-radius: 8px; font-size: 13.5px; font-weight: 800; padding: 6px 13px;
  cursor: pointer; white-space: nowrap; transition: all .15s; }
.bt-ex-btn:hover { background: #e6f6ed; }
.bt-ex-btn-off { background: #fff; border-color: #dbe2ec; color: #64748b; }
.bt-ex-btn-off:hover { background: #f4f6f9; }

/* 提交按钮禁用态：灰掉 + 不可点，明确「机会用完了」 */
.bt-submit:disabled { background: #c3cbd8 !important; border-color: #c3cbd8 !important;
  color: #fff !important; cursor: not-allowed !important; box-shadow: none !important; }

/* ==================== 战报：今日数据明细卡（ask-19c） ====================
   老板要求「显示详细数据，比如微信量、电话量等等」，右侧把每项摊开。
   绿=达标（含超额），红=未达标（写明缺多少、扣多少）。 */
.bt-detail { margin-top: 0; background: #fff; border: 1px solid #e3e9f2;
  border-radius: 14px; padding: 15px 16px; }
.bt-dt-head { font-size: 15.5px; font-weight: 900; color: #0b1220; margin-bottom: 10px; }
.bt-dt-table { width: 100%; border-collapse: collapse; }
.bt-dt-table td { padding: 9px 6px; border-bottom: 1px dashed #eef1f5; font-size: 14px;
  vertical-align: middle; }
.bt-dt-table tr:last-child td { border-bottom: none; }
.bt-dt-n { color: #55637a; font-weight: 700; white-space: nowrap; }
.bt-dt-v { color: var(--text-1); }
.bt-dt-v b { font-size: 17.5px; font-weight: 900; }
.bt-dt-base { font-size: 13px; color: #9aa5b4; margin-left: 2px; }
.bt-dt-s { text-align: right; white-space: nowrap; font-size: 13.5px; font-weight: 800; }
.bt-dt-ok .bt-dt-v b { color: #1a9c5b; }
.bt-dt-ok .bt-dt-s { color: #1a9c5b; }
.bt-dt-bad .bt-dt-v b { color: #e33b3b; }
.bt-dt-bad .bt-dt-s { color: #e33b3b; }
/* 周六不考核的项：灰掉，不做达标/扣款判定 */
.bt-dt-off .bt-dt-n { color: #98a4b5; }
.bt-dt-off .bt-dt-v b { color: #98a4b5; font-weight: 800; }
.bt-dt-off .bt-dt-s { color: #98a4b5; font-weight: 700; }
.bt-dt-foot { font-size: 13px; font-weight: 600; color: #8a97a8; margin-top: 10px;
  line-height: 1.6; border-top: 1px dashed #eef1f5; padding-top: 9px; }

/* 注：8 点「已按时发送」标签的样式已并入上方新版布局段（.bt-check 系列），
   这里不再重复定义，避免同一选择器两套值互相覆盖。 */

/* ==================== 累计汇总卡（ask-19e，2026-09-15） ====================
   老板要的「本月-本周 微信量/电话量/意向客户量 共计多少」。
   放在右侧栏，本月/本周可切换，数字做大做醒目，下面可按天展开明细。 */
.bt-totals { background: #fff; border: 1px solid #e3e9f2; border-radius: 14px;
  padding: 15px 16px 13px; box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05); }
.bt-tot-head { display: flex; align-items: center; justify-content: space-between;
  font-size: 15.5px; font-weight: 900; color: #0b1220; margin-bottom: 6px; }
.bt-tot-tabs { display: inline-flex; background: #f1f5f9; border-radius: 8px; padding: 2px; }
.bt-tot-tab { border: 0; background: transparent; font-size: 13.5px; font-weight: 800;
  color: #55637a; padding: 4px 13px; border-radius: 6px; cursor: pointer;
  transition: all 0.15s; }
.bt-tot-tab-on { background: #fff; color: var(--primary);
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.12); }
.bt-tot-range { font-size: 13px; font-weight: 600; color: #8a97a8; margin-bottom: 10px; }
.bt-tot-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.bt-tot-cell { background: #f7f9fc; border-radius: 10px; padding: 10px 6px; text-align: center; }
.bt-tot-lb { font-size: 13px; color: #55637a; font-weight: 800; margin-bottom: 4px;
  white-space: nowrap; }
.bt-tot-v { font-size: 23px; font-weight: 900; line-height: 1.1;
  font-variant-numeric: tabular-nums; }
.bt-tot-v i { font-size: 12.5px; font-style: normal; font-weight: 800; margin-left: 2px; }
.bt-tot-v-wx { color: #2563eb; }
.bt-tot-v-call { color: #7c3aed; }
.bt-tot-v-intent { color: #059669; }
.bt-tot-foot { display: flex; align-items: center; justify-content: space-between;
  margin-top: 10px; font-size: 13px; font-weight: 600; color: #55637a; }
.bt-tot-foot b { color: var(--primary); font-weight: 900; font-size: 14.5px; }

/* ==================== 我的历史战报卡（2026-09-19 三大改造·问题三） ==================== */
.bt-history { background: #fff; border: 1px solid #e3e9f2; border-radius: 14px;
  padding: 15px 16px 13px; box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05); }
.bt-his-month { font-size: 13.5px; font-weight: 900; color: #0b1220; padding: 0 6px; }
.bt-his-sub { font-size: 12.5px; color: #8a97a8; font-weight: 600; margin-bottom: 8px; }
.bt-his-sub b { color: var(--primary); font-weight: 900; }
.bt-his-ok { color: #146b43; font-weight: 800; font-size: 12.5px; }
.bt-his-fine { color: #dc2626; font-weight: 900; font-size: 12.5px; }
.bt-his-exempt { color: #7c3aed; font-weight: 800; font-size: 12.5px; }
.bt-his-leave { color: #0e7490; font-weight: 800; font-size: 12.5px; }
.bt-history .bt-tot-tab[disabled] { opacity: 0.35; cursor: not-allowed; }

/* ==================== 汇总页筛选条（2026-09-19 三大改造·问题三） ==================== */
.bt-filter { display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  background: #fff; border: 1px solid #e3e9f2; border-radius: 12px;
  padding: 10px 14px; margin-bottom: 12px; }
.bt-filter-tabs { display: inline-flex; background: #f1f5f9; border-radius: 8px; padding: 2px; }
.bt-filter-sel { border: 1px solid #cbd5e1; border-radius: 8px; padding: 6px 10px;
  font-size: 13.5px; font-weight: 700; color: #334155; background: #fff; }
.bt-filter-chk { display: flex; align-items: center; gap: 6px; font-size: 13.5px;
  font-weight: 700; color: #334155; cursor: pointer; }
.bt-filter-chk input { width: 16px; height: 16px; accent-color: var(--primary); }
.bt-tot-more { border: 0; background: transparent; color: var(--primary); font-size: 13px;
  font-weight: 800; cursor: pointer; padding: 2px 0; }
.bt-tot-more:hover { text-decoration: underline; }
.bt-tot-day { margin-top: 8px; border-top: 1px dashed var(--border); padding-top: 8px;
  max-height: 240px; overflow-y: auto; }
.bt-tot-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.bt-tot-table th { text-align: left; color: #8a97a8; font-weight: 800; padding: 4px 5px;
  border-bottom: 1px solid var(--border); white-space: nowrap; }
.bt-tot-table td { padding: 5px; border-bottom: 1px dashed #f1f5f9; color: var(--text-1);
  font-weight: 600; }
.bt-tot-d { color: #55637a; white-space: nowrap; }
.bt-tot-n { font-weight: 800; }
.bt-tot-r { text-align: right; font-variant-numeric: tabular-nums; font-weight: 800; }
.bt-tot-empty { text-align: center; color: #94a3b8; padding: 12px 0; }
.bt-tot-loading, .bt-tot-err { font-size: 13.5px; font-weight: 600; color: #55637a;
  padding: 8px 0; }
.bt-tot-err { color: #b91c1c; }

/* ==================== 截图拖拽上传 + 页内看图（ask-19e，2026-09-15） ====================
   老板要求：「可以拖进去」「图片查看不了」。
   拖拽：.bt-shot 接住 drop，拖动经过时整块高亮（高亮样式已并入新版布局段）。
   看图：原来是新标签打开（手机上常被拦），改为页内弹层。 */
.bt-shot-modal { position: fixed; inset: 0; z-index: 9999; display: flex;
  align-items: center; justify-content: center; }
.bt-shot-modal-mask { position: absolute; inset: 0; background: rgba(15, 23, 42, .62); }
.bt-shot-modal-box { position: relative; background: #fff; border-radius: 14px;
  max-width: 92vw; max-height: 90vh; display: flex; flex-direction: column;
  box-shadow: 0 18px 48px rgba(15, 23, 42, .3); overflow: hidden; }
.bt-shot-modal-hd { display: flex; align-items: center; justify-content: space-between;
  gap: 20px; padding: 12px 16px; border-bottom: 1px solid var(--border);
  font-size: 13.5px; font-weight: 800; color: var(--text-1); }
.bt-shot-modal-x { border: 0; background: transparent; font-size: 17px; cursor: pointer;
  color: var(--text-2); line-height: 1; padding: 2px 6px; border-radius: 6px; }
.bt-shot-modal-x:hover { background: #f1f5f9; color: #dc2626; }
.bt-shot-modal-bd { padding: 12px; overflow: auto; }
.bt-shot-modal-bd img { max-width: 86vw; max-height: 74vh; border-radius: 8px;
  display: block; margin: 0 auto; }
.bt-shot-fail { display: none; font-size: 13px; color: #b91c1c; padding: 24px 14px;
  text-align: center; }
.bt-shot-fail a { color: var(--primary); font-weight: 700; }
/* ===== 多图画廊（2026-09-15）：主图下方一排缩略图，点击/方向键切换 ===== */
.bt-shot-thumbs { display: flex; gap: 8px; overflow-x: auto; padding: 10px 4px 2px;
  margin-top: 10px; border-top: 1px solid #e6e9f0; }
.bt-shot-thumb { position: relative; flex: 0 0 auto; width: 76px; height: 62px;
  border: 2px solid transparent; border-radius: 8px; overflow: hidden; cursor: pointer;
  background: #f8fafc; transition: .15s; }
.bt-shot-thumb:hover { transform: translateY(-2px); }
.bt-shot-thumb.on { border-color: var(--primary); box-shadow: 0 0 0 2px #dbeafe; }
.bt-shot-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bt-shot-ti { position: absolute; left: 3px; bottom: 3px; background: rgba(15, 23, 42, .66);
  color: #fff; font-size: 10.5px; padding: 1px 5px; border-radius: 5px; }
/* 「已上传 N 张」按钮 + 上传区提示（多图说明） */
.bt-shot-hint { font-size: 12.5px; color: var(--text-3); }

/* ==================== 公司资料（ask-56 2026-09-16） ==================== */
/* PDF / 纯文字资料没有缩略图，用大图标占位卡（与图片卡同高，网格不塌） */
.co-docbox { width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center;
  justify-content: center; gap: 6px; background: linear-gradient(135deg, #eef2ff, #e0e7ff);
  color: #4338ca; font-size: 13px; font-weight: 600; }
.co-docbox .co-docico { font-size: 42px; line-height: 1; }
.co-textbox { background: linear-gradient(135deg, #fef3c7, #fde68a); color: #92400e; }
.co-content { max-height: 88px; overflow-y: auto; }

/* ==================== 公司资料（ask-58 2026-09-16） ==================== */
/* 营业执照标识超大醒目：老板要求「字体非常大，别人一看能看出来」——
   右上角标签 18px 红底白字、卡片标题 24px 特粗红字（普通卡 11px/14.5px） */
.kind-tag.co-license { font-size: 18px; padding: 6px 16px; font-weight: 800;
  background: #e11d48; color: #fff; border-radius: 10px;
  box-shadow: 0 2px 10px rgba(225, 29, 72, .45); letter-spacing: 2px; }
.card-title.co-license-title { font-size: 24px; font-weight: 900; color: #e11d48;
  letter-spacing: 2px; margin: 10px 0 6px; line-height: 1.25; }
/* Word/Excel 等文档占位卡（蓝调，区别于 PDF 靛蓝/文字琥珀） */
.co-docbox.co-wdbx { background: linear-gradient(135deg, #dbeafe, #bfdbfe); color: #1e40af; }
/* ask-60（2026-09-16）：资料名称整体大气一些——公司资料卡片标题 20px 特粗
   （基准 14.5px/700；:not 排除营业执照 24px 红字特档，也只作用于公司资料，
   话术库等共用 .card-title 的板块不受影响） */
#company-grid .card-title:not(.co-license-title) { font-size: 20px; font-weight: 800;
  line-height: 1.3; letter-spacing: .5px; margin: 12px 0 7px; }

/* ==================== 考勤状态条（2026-09-16 ask-att）====================
   首页今日考勤一句话：迟到 / 正常 / 未打卡 / 休息。
   用户拍板的极简口径——打开软件看一眼即可，不弹窗不轮询。 */
.home-attend { display: inline-flex; align-items: center; gap: 7px;
  margin-top: 14px; padding: 8px 18px; border-radius: 999px;
  font-size: 14px; font-weight: 600; backdrop-filter: blur(8px);
  border: 1px solid transparent; }
.home-attend.hidden { display: none; }
.ha-ok   { background: rgba(220,252,231,.88); color: #15803d; border-color: rgba(22,163,74,.28); }
.ha-late, .ha-warn { background: rgba(254,226,226,.92); color: #b91c1c; border-color: rgba(220,38,38,.32); }
.ha-todo { background: rgba(254,243,199,.88); color: #b45309; border-color: rgba(217,119,6,.26); }
.ha-info { background: rgba(224,242,254,.88); color: #0369a1; border-color: rgba(2,132,199,.26); }
.ha-rest { background: rgba(241,245,249,.88); color: #64748b; border-color: rgba(148,163,184,.32); }

/* ==================== 每日销售语音汇报（2026-09-18）====================
   工作台播报条：播报按钮 + 自动播报开关。下班后当天首次进工作台自动播。 */
.voice-bar { display: inline-flex; align-items: center; gap: 10px;
  margin-top: 14px; }
.voice-bar.hidden { display: none; }
.voice-btn { border: none; cursor: pointer; border-radius: 999px;
  padding: 9px 22px; font-size: 14px; font-weight: 700; font-family: inherit;
  color: #fff; background: linear-gradient(135deg, #f59e0b, #ef4444);
  box-shadow: 0 4px 16px rgba(239, 68, 68, .35);
  transition: transform .15s, box-shadow .15s; }
.voice-btn:hover { transform: translateY(-1px); box-shadow: 0 6px 20px rgba(239, 68, 68, .45); }
.voice-btn:active { transform: scale(.97); }
.voice-btn.playing { background: linear-gradient(135deg, #64748b, #334155);
  box-shadow: none; pointer-events: none; }
.voice-auto { font-size: 12.5px; color: #64748b; cursor: pointer;
  user-select: none; padding: 4px 10px; border-radius: 999px;
  border: 1px solid #e2e8f0; background: rgba(255,255,255,.7); }
.voice-auto.off { color: #94a3b8; text-decoration: line-through; }

/* ==================== 双登录方式 + 绑定手机号（2026-09-18；ts135 深色适配）==================== */
.login-tabs { display: flex; gap: 6px; margin-bottom: 14px;
  background: rgba(15, 23, 42, .65); padding: 4px; border-radius: 10px;
  border: 1px solid rgba(71, 85, 105, .35); }
.lg-tab { flex: 1; border: none; background: transparent; cursor: pointer;
  padding: 8px 0; font-size: 13.5px; font-weight: 600; color: #64748b;
  border-radius: 7px; font-family: inherit; transition: .15s; }
.lg-tab.on { background: linear-gradient(120deg, #0891b2, #6366f1); color: #fff;
  box-shadow: 0 2px 10px rgba(34, 211, 238, .28); }
.sms-code-row { display: flex; gap: 8px; width: 100%; }
.sms-code-row input { flex: 1; min-width: 0; }
.sms-code-row button { flex: none; border: 1px solid #2563eb; background: #eff6ff;
  color: #2563eb; border-radius: 8px; padding: 0 12px; font-size: 12.5px;
  font-weight: 600; cursor: pointer; font-family: inherit; white-space: nowrap;
  transition: .15s; }
.sms-code-row button:hover:not(:disabled) { background: #dbeafe; }
.sms-code-row button:disabled { opacity: .55; cursor: not-allowed; }
/* ts135：登录卡内的验证码按钮走深色青调（绑定手机号弹窗仍用上面的浅色样式） */
.login-card .sms-code-row button { border-color: rgba(34, 211, 238, .45);
  background: rgba(8, 47, 73, .55); color: #7dd3fc; }
.login-card .sms-code-row button:hover:not(:disabled) { background: rgba(14, 74, 110, .7); }
/* ts135：验证码登录表单此前无专属样式（浏览器默认白底），一并深色化，
   布局与密码表单对齐（flex 纵排 + 13px 间距） */
#login-form-sms { display: flex; flex-direction: column; gap: 13px; }
#login-form-sms input { padding: 13px 15px; font-size: 15px; border-radius: 11px;
  transition: .18s; color: #cbd5e1; background: rgba(15, 23, 42, .6);
  border: 1px solid rgba(71, 85, 105, .45); outline: none;
  font-family: inherit; width: 100%; }
#login-form-sms input::placeholder { color: rgba(100, 116, 139, .85); }
#login-form-sms input:focus { border-color: rgba(34, 211, 238, .85);
  box-shadow: 0 0 0 4px rgba(34, 211, 238, .14); background: rgba(12, 20, 36, .9); }
#login-form-sms button[type=submit] { margin-top: 9px; padding: 13px; border: none;
  border-radius: 11px; cursor: pointer; font-size: 16px; font-weight: 700;
  letter-spacing: 3px; color: #fff; font-family: inherit;
  background: linear-gradient(120deg, #0891b2 0%, #6366f1 100%);
  box-shadow: 0 10px 26px rgba(34, 211, 238, .22); transition: .18s; }
#login-form-sms button[type=submit]:hover:not(:disabled) { filter: brightness(1.08); }
#login-form-sms button[type=submit]:disabled { filter: grayscale(.5) brightness(.8);
  cursor: not-allowed; }
.sms-hint { font-size: 11.5px; color: #94a3b8; line-height: 1.6; margin-top: 8px;
  text-align: left; }
/* 绑定弹窗内嵌套的验证码行（label 内 span 布局） */
#phone-form .sms-code-row { margin-top: 4px; }
.phone-current { font-size: 12.5px; color: #64748b; margin-bottom: 10px;
  background: #f8fafc; border: 1px dashed #e2e8f0; border-radius: 8px;
  padding: 7px 10px; }

/* ts84（2026-09-19）：员工服务聚合页子切换（工作台卡片进入，页内请假/离职切换） */
.emp-serve-tabs { display: flex; gap: 10px; max-width: 760px; margin: 16px auto 0; padding: 0 16px; }
.emp-serve-pill { flex: 1; border: 1px solid #e2e8f0; background: #fff; color: #475569;
  border-radius: 10px; padding: 10px 8px; font-size: 14px; font-weight: 700; cursor: pointer;
  font-family: inherit; transition: .15s; }
.emp-serve-pill:hover { border-color: #93c5fd; color: #2563eb; }
.emp-serve-pill.active { background: #2563eb; border-color: #2563eb; color: #fff; }

/* ts98 分组收纳（参考手机 APP 桌面文件夹）：容器卡 + 成员缩略 + 收纳提示 + 面板 */
.home-card.hc-parked { display: none !important; }
.hc-gmini { display: grid; grid-template-columns: repeat(2, 40px); gap: 8px; }
.hc-gmini span { width: 40px; height: 40px; border-radius: 12px; display: flex; align-items: center;
  justify-content: center; font-size: 20px; background: var(--hc-sub-bg, linear-gradient(135deg,#f0a6ca,#b39ddb));
  box-shadow: 0 4px 12px rgba(20,10,40,.4); }
.hc-drop-group { border-color: rgba(134,239,172,.9) !important;
  box-shadow: 0 0 0 3px rgba(134,239,172,.35), 0 18px 40px rgba(10,6,24,.45) !important; }
.hc-drop-group::before { content: "📁 松手收纳"; position: absolute; inset: 0; display: flex;
  align-items: center; justify-content: center; background: rgba(15,23,42,.62); border-radius: 20px;
  font-size: 14px; font-weight: 800; color: #86efac; z-index: 4; letter-spacing: 1px; }
.hc-pcard { cursor: grab; }
.hc-pcard:active { cursor: grabbing; }
.hc-pcard-out { position: absolute; top: 12px; left: 12px; font-size: 11px; font-style: normal;
  background: rgba(15,23,42,.55); border: 1px solid rgba(255,255,255,.25); color: #fff;
  border-radius: 8px; padding: 3px 9px; cursor: pointer; z-index: 5; }
.hc-pcard-out:hover { background: rgba(225,29,72,.85); }

/* ---------- ts101：离职当天下午《工作交接表》闪烁提醒横幅 ---------- */
/* 固定在页面顶部中央（喜报横幅下方），红边白底 + 边框/阴影循环闪烁，直到提交交接表才消失 */
.handover-nag {
  position: fixed; top: 78px; left: 50%; transform: translateX(-50%);
  z-index: 9998; max-width: 92vw; box-sizing: border-box;
  display: flex; align-items: center; gap: 10px;
  background: #fff; border: 2px solid #dc2626; border-radius: 12px;
  padding: 10px 16px; box-shadow: 0 6px 24px rgba(220, 38, 38, .35);
  animation: handover-flash 1.1s ease-in-out infinite;
  cursor: default;
}
.handover-nag .hn-ico { font-size: 20px; flex: none; }
.handover-nag .hn-txt { font-size: 13px; color: #0f172a; line-height: 1.6; }
.handover-nag .hn-txt b { color: #dc2626; }
.handover-nag .hn-btn {
  flex: none; border: none; background: #dc2626; color: #fff;
  border-radius: 8px; padding: 8px 14px; font-size: 13px; font-weight: 800; cursor: pointer;
}
.handover-nag .hn-btn:active { transform: scale(.97); }
@keyframes handover-flash {
  0%, 100% { border-color: #dc2626; box-shadow: 0 6px 24px rgba(220, 38, 38, .45); }
  50% { border-color: #fecaca; box-shadow: 0 2px 8px rgba(220, 38, 38, .12); }
}
@media (max-width: 640px) {
  .handover-nag { top: 64px; flex-wrap: wrap; padding: 8px 12px; }
  .handover-nag .hn-txt { font-size: 12px; }
}

/* ---------- ts121：全天自动播报引导条（常驻播报机模式） ---------- */
#always-bar {
  position: fixed; top: 0; left: 0; right: 0; z-index: 99997;
  padding: 9px 14px; text-align: center;
  font-size: 14px; font-weight: 700; letter-spacing: .3px;
  color: #fff; cursor: pointer;
  background: linear-gradient(135deg, #ff512f, #dd2476);
  box-shadow: 0 4px 18px rgba(221, 36, 118, .45);
  animation: alwaysbar-pulse 1.6s ease-in-out infinite alternate;
}
#always-bar.on {
  background: linear-gradient(135deg, #059669, #10b981);
  box-shadow: 0 2px 10px rgba(16, 185, 129, .35);
  animation: none; cursor: default;
  font-weight: 600; font-size: 13px;
}
@keyframes alwaysbar-pulse {
  from { opacity: 1; } to { opacity: .82; }
}
@media (max-width: 640px) { #always-bar { font-size: 13px; padding: 8px 10px; } }

/* ==================== ts140（2026-09-21）：上传弹窗「已选文件」列表 ==================== */
/* 分次追加选择（手机一次只能选一个时可累计）、可单个移除；与 #up-file 同列宽 */
.up-file-list { margin-top: -8px; display: flex; flex-direction: column; gap: 4px; }
.up-file-item { display: flex; align-items: center; gap: 6px; font-size: 12.5px;
  color: #334155; background: #f1f5f9; border-radius: 6px; padding: 5px 8px; }
.up-file-item .up-file-name { flex: 1; min-width: 0; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; }
.up-file-item i { color: #94a3b8; font-style: normal; flex: none; }
.up-file-item .up-file-del { flex: none; border: none; background: #e2e8f0; color: #475569;
  width: 18px; height: 18px; border-radius: 50%; cursor: pointer;
  font-size: 11px; line-height: 1; padding: 0; }
.up-file-item .up-file-del:hover { background: #fecaca; color: #b91c1c; }
.up-file-empty { font-size: 12px; color: #94a3b8; padding: 2px 0; }

/* ==================== ts141（2026-09-21）：案例组——一个框里放多个图片 ==================== */
/* 卡片缩略网格：2 张两列、3 张三列、4 张两列、5-9 张三列（微信九宫格习惯），超出折 +N */
.media-box .mm-grid { display: grid; gap: 3px; height: 236px; padding: 3px; }
.media-box .mm-grid { grid-template-columns: repeat(3, 1fr); }
.media-box .mm-grid.n2 { grid-template-columns: 1fr 1fr; }
.media-box .mm-grid.n4 { grid-template-columns: 1fr 1fr; }
.mm-tile { position: relative; overflow: hidden; border-radius: 4px; background: #0b1220; min-height: 0; }
.mm-tile img, .mm-tile video { width: 100%; height: 100%; object-fit: cover; display: block; }
.mm-tile-play { position: absolute; right: 5px; bottom: 4px; background: rgba(15, 23, 42, .65);
  color: #fff; font-size: 10px; line-height: 1; padding: 3px 5px; border-radius: 4px; }
.mm-tile-more { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  background: rgba(2, 6, 23, .58); color: #fff; font-size: 20px; font-weight: 700; }
/* 详情弹窗轮播：左右翻页 + 触屏滑动，复制/下载作用于当前张 */
.mm-carousel { position: relative; overflow: hidden; border-radius: 10px; background: #0b1220; }
.mm-carousel .mm-track { display: flex; transition: transform .25s ease; }
.mm-carousel .mm-slide { flex: 0 0 100%; min-width: 100%; }
.mm-carousel .mm-slide img, .mm-carousel .mm-slide video { width: 100%; max-height: 60vh;
  object-fit: contain; display: block; margin: 0 auto; border-radius: 10px; }
.mm-nav { position: absolute; top: 50%; transform: translateY(-50%); width: 38px; height: 38px;
  border-radius: 50%; border: none; background: rgba(15, 23, 42, .55); color: #fff;
  font-size: 22px; cursor: pointer; z-index: 2; }
.mm-nav:hover { background: rgba(15, 23, 42, .8); }
.mm-prev { left: 10px; }
.mm-next { right: 10px; }
.mm-count { position: absolute; right: 12px; top: 10px; background: rgba(15, 23, 42, .65);
  color: #fff; font-size: 12px; padding: 2px 9px; border-radius: 10px; z-index: 2; }