/* ===========================================================
   采购部门工作管理系统 - 响应式样式
   断点：>=1024 桌面 / 768-1023 平板 / <768 手机
   =========================================================== */
:root {
  --primary: #2563eb;
  --primary-dark: #1d4ed8;
  --primary-light: #eff6ff;
  --success: #16a34a;
  --warning: #d97706;
  --danger: #dc2626;
  --info: #0891b2;
  --text: #0f172a;
  --text-2: #475569;
  --text-3: #94a3b8;
  --border: #e2e8f0;
  --bg: #f5f7fb;
  --card: #ffffff;
  --radius: 12px;
  --shadow: 0 1px 3px rgba(15, 23, 42, .06), 0 1px 2px rgba(15, 23, 42, .04);
  --shadow-lg: 0 10px 30px rgba(15, 23, 42, .10);
  --sidebar-w: 232px;
  --header-h: 60px;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  font-size: 14px;
  color: var(--text);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  -webkit-text-size-adjust: 100%;
}

a { color: var(--primary); text-decoration: none; }
a:hover { color: var(--primary-dark); }
h1, h2, h3, h4 { margin: 0 0 12px; font-weight: 600; line-height: 1.35; }
h1 { font-size: 22px; }
h2 { font-size: 18px; }
h3 { font-size: 16px; }
p { line-height: 1.7; }
img { max-width: 100%; }

/* ---------------- 布局 ---------------- */
.layout { display: flex; min-height: 100vh; }

.sidebar {
  width: var(--sidebar-w);
  background: #0f172a;
  color: #cbd5e1;
  position: fixed;
  top: 0; left: 0; bottom: 0;
  display: flex;
  flex-direction: column;
  z-index: 60;
  overflow-y: auto;
  transition: transform .25s ease;
}
.sidebar-brand {
  height: var(--header-h);
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 18px;
  border-bottom: 1px solid rgba(255, 255, 255, .08);
  color: #fff;
  font-weight: 700;
  font-size: 15px;
  flex-shrink: 0;
}
.sidebar-brand .logo {
  width: 28px; height: 28px;
  border-radius: 8px;
  background: linear-gradient(135deg, #3b82f6, #06b6d4);
  display: grid; place-items: center;
  font-size: 13px; font-weight: 800;
  flex-shrink: 0;
}
.sidebar-nav { padding: 12px 10px 24px; flex: 1; }
.nav-group { margin-bottom: 6px; }
.nav-group-title {
  font-size: 11px;
  color: #64748b;
  padding: 12px 10px 6px;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.nav-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 8px;
  color: #cbd5e1;
  font-size: 13.5px;
  margin-bottom: 2px;
  transition: background .15s, color .15s;
}
.nav-item:hover { background: rgba(255, 255, 255, .07); color: #fff; }
.nav-item.active { background: var(--primary); color: #fff; font-weight: 500; }
.nav-item .ico { width: 18px; text-align: center; font-size: 15px; flex-shrink: 0; }
.nav-item .count {
  margin-left: auto;
  background: rgba(255, 255, 255, .16);
  border-radius: 10px;
  padding: 1px 7px;
  font-size: 11px;
}

.main { flex: 1; margin-left: var(--sidebar-w); display: flex; flex-direction: column; min-width: 0; }

.topbar {
  height: var(--header-h);
  background: var(--card);
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0 20px;
  position: sticky;
  top: 0;
  z-index: 50;
}
.topbar .page-title { font-size: 16px; font-weight: 600; }
.topbar .spacer { flex: 1; }
.menu-toggle {
  display: none;
  border: 1px solid var(--border);
  background: #fff;
  border-radius: 8px;
  width: 36px; height: 36px;
  font-size: 17px;
  cursor: pointer;
  color: var(--text-2);
}
.user-menu { position: relative; }
.user-chip {
  display: flex; align-items: center; gap: 8px;
  padding: 5px 10px 5px 5px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: #fff;
  font-family: inherit;
  font-size: 13px;
  color: var(--text-2);
  cursor: pointer;
  transition: border-color .15s, box-shadow .15s, background .15s;
}
.user-chip:hover { border-color: #cbd5e1; background: #f8fafc; }
.user-chip:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
.user-menu.open .user-chip { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(37, 99, 235, .12); }
.user-chip .caret { font-size: 10px; color: var(--text-3); transition: transform .18s; }
.user-menu.open .user-chip .caret { transform: rotate(180deg); }

.user-panel {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  width: 268px;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-lg);
  z-index: 60;
  overflow: hidden;
  animation: userPanelIn .14s ease-out;
}
@keyframes userPanelIn {
  from { opacity: 0; transform: translateY(-6px); }
  to { opacity: 1; transform: translateY(0); }
}
.user-panel-head {
  display: flex; align-items: center; gap: 10px;
  padding: 14px;
  background: linear-gradient(135deg, #eff6ff, #f8fafc);
  border-bottom: 1px solid var(--border);
}
.avatar-lg { width: 40px; height: 40px; font-size: 15px; }
.user-panel-id { min-width: 0; }
.user-panel-name { font-size: 14px; font-weight: 600; color: var(--text); }
.user-panel-sub {
  font-size: 12px; color: var(--text-3); margin-top: 2px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.user-panel-info { padding: 10px 14px; border-bottom: 1px solid var(--border); }
.user-panel-row {
  display: flex; justify-content: space-between; gap: 12px;
  font-size: 12.5px; padding: 3px 0;
}
.user-panel-row .k { color: var(--text-3); flex-shrink: 0; }
.user-panel-row .v {
  color: var(--text-2); text-align: right;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.user-panel-actions { padding: 6px; }
.user-panel-item {
  display: flex; align-items: center; gap: 9px;
  padding: 9px 10px;
  border-radius: 8px;
  font-size: 13px;
  color: var(--text-2);
}
.user-panel-item:hover { background: var(--primary-light); color: var(--primary-dark); }
.user-panel-item.danger { color: var(--danger); }
.user-panel-item.danger:hover { background: #fef2f2; color: var(--danger); }
.user-panel-item .ico { width: 16px; text-align: center; font-size: 13px; }
.avatar {
  width: 28px; height: 28px;
  border-radius: 50%;
  background: linear-gradient(135deg, #60a5fa, #2563eb);
  color: #fff;
  display: grid; place-items: center;
  font-size: 12px; font-weight: 600;
  flex-shrink: 0;
}
.content { padding: 20px; flex: 1; }
.content-inner { max-width: 1400px; margin: 0 auto; }

.overlay {
  display: none;
  position: fixed; inset: 0;
  background: rgba(15, 23, 42, .45);
  z-index: 55;
}
.overlay.show { display: block; }

/* ---------------- 卡片 / 网格 ---------------- */
.card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  margin-bottom: 16px;
  overflow: hidden;
}
.card-head {
  padding: 14px 18px;
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.card-head h3 { margin: 0; font-size: 15px; }
.card-head .spacer { flex: 1; }
.card-body { padding: 18px; }
.card-body.tight { padding: 0; }

.grid { display: grid; gap: 16px; }
.grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.stat {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 16px 18px;
  box-shadow: var(--shadow);
  display: flex;
  align-items: center;
  gap: 14px;
}
.stat .icon {
  width: 42px; height: 42px;
  border-radius: 10px;
  display: grid; place-items: center;
  font-size: 19px;
  background: var(--primary-light);
  color: var(--primary);
  flex-shrink: 0;
}
.stat .num { font-size: 22px; font-weight: 700; line-height: 1.2; }
.stat .label { font-size: 12.5px; color: var(--text-3); margin-top: 2px; }
.stat.green .icon { background: #ecfdf5; color: var(--success); }
.stat.orange .icon { background: #fffbeb; color: var(--warning); }
.stat.cyan .icon { background: #ecfeff; color: var(--info); }

/* ---------------- 表格 ---------------- */
.table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.table th, .table td { padding: 11px 14px; text-align: left; border-bottom: 1px solid var(--border); vertical-align: middle; }
.table th { background: #f8fafc; font-weight: 600; color: var(--text-2); font-size: 12.5px; white-space: nowrap; }
.table tbody tr:hover { background: #f8fafc; }
.table tbody tr:last-child td { border-bottom: none; }
.table .num { text-align: right; font-variant-numeric: tabular-nums; }
.table .actions { white-space: nowrap; }
.table .actions a, .table .actions button { margin-right: 6px; }
.table .actions a:last-child, .table .actions button:last-child { margin-right: 0; }

/* 表格内多按钮操作组 */
.row-actions { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.row-actions .btn { margin-right: 0; }
.inline-form { display: inline-flex; margin: 0; }

/* ---------------- 表单 ---------------- */
.form-row { display: grid; gap: 14px; margin-bottom: 14px; }
.form-row.cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.form-row.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.form-row.cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

/* 报价明细小节标题：与「供应商 *」同样的字段标签样式 */
.quote-head { margin: 16px 0 4px; }

/* 报价明细行：项目 / 规格型号 / 单价 / 数量 一行四列（带标签）+ 右侧方形按钮 */
.quote-item { margin-bottom: 12px; }
.qi-row { display: flex; align-items: flex-end; gap: 14px; }
.qi-row .field { flex: 1 1 0; min-width: 0; margin: 0; }
.qi-row .field label { display: block; margin-bottom: 6px; }
.qi-row .field input { height: 46px; }
.qi-row .field.qi-act { flex: 0 0 46px; }
.qi-row .qi-btn {
  width: 46px;
  height: 46px;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: #fff;
  color: var(--text-2);
  font-size: 18px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.qi-row .qi-btn:hover { background: #f8fafc; color: var(--text); }
@media (max-width: 767px) {
  .qi-row { flex-wrap: wrap; gap: 10px; }
  .qi-row .field { flex: 1 1 calc(50% - 5px); }
  .qi-row .field.qi-act { flex: 0 0 46px; }
}

/* 已选附件：名称填写框 */
.file-item .file-title {
  flex: 0 0 200px;
  height: 32px;
  padding: 0 8px;
  border: 1px solid var(--border);
  border-radius: 6px;
  font-size: 12.5px;
  color: var(--text);
}
.file-item .file-title:focus { outline: none; border-color: var(--primary); }
@media (max-width: 767px) {
  .file-item { flex-wrap: wrap; }
  .file-item .file-title { flex: 1 1 100%; order: 3; }
}

/* 供应商联系人：一行一位（联系人 / 电话 / 邮箱），样式同报价明细 */
.contact-item { margin-bottom: 12px; }
.ct-row { display: flex; align-items: flex-end; gap: 14px; }
.ct-row .field { flex: 1 1 0; min-width: 0; margin: 0; }
.ct-row .field input { height: 46px; }
.ct-row .field.ct-act { flex: 0 0 46px; }
.ct-row .ct-btn {
  width: 46px;
  height: 46px;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: #fff;
  color: var(--text-2);
  font-size: 18px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.ct-row .ct-btn:hover { background: #f8fafc; color: var(--text); }
@media (max-width: 767px) {
  .ct-row { flex-wrap: wrap; gap: 10px; }
  .ct-row .field { flex: 1 1 calc(50% - 5px); }
  .ct-row .field.ct-act { flex: 0 0 46px; }
}
.field label { display: block; font-size: 12.5px; color: var(--text-2); margin-bottom: 6px; font-weight: 500; }
.field label .req { color: var(--danger); }
input[type=text], input[type=password], input[type=number], input[type=date], input[type=email],
input[type=tel], input[type=file], select, textarea {
  width: 100%;
  padding: 9px 12px;
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 13.5px;
  font-family: inherit;
  color: var(--text);
  background: #fff;
  transition: border-color .15s, box-shadow .15s;
}
input:focus, select:focus, textarea:focus {
  outline: none;
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .12);
}
/* Edge / IE 自带的密码显隐按钮：与页面自绘的眼睛重复，统一隐藏 */
input::-ms-reveal,
input::-ms-clear { display: none; }
textarea { resize: vertical; min-height: 90px; line-height: 1.6; }
.hint { font-size: 12px; color: var(--text-3); margin-top: 5px; }
/* 报价明细合计提示：与上方明细、下方字段之间留出间距 */
.hint.quote-total { margin: 10px 0 20px; }

/* ===========================================================
修改密码页（front/password.php、admin/password.php 共用）
居中单列：账号条 → 状态提示 → ① 身份 → ② 新密码 → 操作区 → 跳过
间距按 4/8/12/16/24 栅格；小字统一用 --text-2 保证对比度
=========================================================== */
.pwd-card { max-width: 640px; margin: 8px auto 24px; }
.pwd-card .card-head h1 { margin: 0; font-size: 17px; font-weight: 600; }
.pwd-account { font-size: 12.5px; color: var(--text-2); min-width: 0; overflow-wrap: anywhere; }
.pwd-card .card-body { padding: 24px; }
.pwd-card .card-body > .alert { margin-bottom: 20px; }

.pwd-group + .pwd-group {
  margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--border);
}
.pwd-group-title {
  display: flex; align-items: center; gap: 8px;
  margin-bottom: 12px; font-size: 12.5px; font-weight: 600; color: var(--text-2);
}
.pwd-step {
  flex: none; width: 18px; height: 18px; border-radius: 50%;
  background: var(--primary-light); color: var(--primary-dark);
  font-size: 11px; font-weight: 700; line-height: 18px; text-align: center;
  font-variant-numeric: tabular-nums;
}
.pwd-field + .pwd-field { margin-top: 16px; }
.pwd-input-wrap { position: relative; }
/* 输入框：参照设计稿——10px 圆角、44px 高、聚焦时亮蓝描边 + 外圈浅蓝光晕 */
.pwd-field input {
  min-height: 44px; padding-top: 10px; padding-bottom: 10px;
  border-radius: 10px; font-size: 14px;
}
.pwd-field input:focus {
  border-color: #3b82f6;
  box-shadow: 0 0 0 4px rgba(59, 130, 246, .16);
}
.pwd-input-wrap input { padding-right: 46px; }
/* 框内只留这一个眼睛按钮，宽度与内边距按图标居中留足 */
.pwd-eye {
  position: absolute; right: 5px; top: 50%; transform: translateY(-50%);
  width: 36px; height: 36px; display: flex; align-items: center; justify-content: center;
  border: 0; border-radius: 8px; background: transparent; color: var(--text-2); cursor: pointer;
}
.pwd-eye:hover { background: #f1f5f9; color: var(--text); }
.pwd-eye.on { color: var(--primary); }
.pwd-eye:focus-visible,
.pwd-card .btn:focus-visible,
.pwd-card .btn-link:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }

/* 强度：档位只由 data-level 决定，宽度与颜色走局部变量 */
.pwd-strength {
  --pwd-color: #94a3b8; --pwd-pct: 0%;
  display: flex; align-items: center; gap: 8px; margin-top: 8px;
}
.pwd-strength[data-level="0"] { display: none; }
.pwd-strength[data-level="1"] { --pwd-color: var(--danger); --pwd-pct: 25%; }
.pwd-strength[data-level="2"] { --pwd-color: var(--warning); --pwd-pct: 50%; }
.pwd-strength[data-level="3"] { --pwd-color: var(--success); --pwd-pct: 75%; }
.pwd-strength[data-level="4"] { --pwd-color: #15803d; --pwd-pct: 100%; }
.pwd-strength-label { flex: none; font-size: 12px; color: var(--text-2); }
.pwd-strength-label b { font-weight: 600; color: var(--pwd-color); }
.pwd-strength-bar {
  position: relative; flex: 1; max-width: 140px; height: 4px;
  border-radius: 2px; background: var(--border); overflow: hidden;
}
.pwd-strength-bar i {
  display: block; width: var(--pwd-pct); height: 100%;
  border-radius: 2px; background: var(--pwd-color);
  transition: width .2s, background .2s;
}

/* 规则清单：三态（未满足 ○ / 满足 ✓ / 待判定 ·），图标占固定列 */
.pwd-rules {
  display: flex; flex-wrap: wrap; gap: 4px 16px; margin-top: 8px;
  font-size: 12px; color: var(--text-2);
}
.pwd-rules span { display: inline-flex; align-items: center; gap: 5px; transition: color .15s; }
.pwd-rules span::before {
  content: "○"; display: inline-block; width: 14px; text-align: center;
  font-size: 11px; line-height: 1;
}
.pwd-rules span.ok { color: var(--success); }
.pwd-rules span.ok::before { content: "✓"; font-weight: 700; }
.pwd-rules span.wait::before { content: "·"; font-weight: 700; }

.pwd-err {
  display: flex; align-items: flex-start; gap: 6px; margin-top: 8px;
  font-size: 12px; color: var(--danger);
}
.pwd-err::before {
  content: "!"; flex: none; width: 14px; height: 14px; margin-top: 1px;
  border-radius: 50%; background: var(--danger); color: #fff;
  font-size: 10px; font-weight: 700; line-height: 14px; text-align: center;
}
.field.pwd-field input[aria-invalid="true"] {
  border-color: var(--danger);
  box-shadow: 0 0 0 3px rgba(220, 38, 38, .10);
}
.pwd-match { margin-top: 8px; font-size: 12px; color: var(--success); }
.pwd-match:empty { display: none; }
.pwd-match.bad { color: var(--danger); }

/* 操作区：说明占左侧剩余宽度，按钮靠右；主按钮最后、始终实心 */
.pwd-actions { display: flex; align-items: center; gap: 10px; margin-top: 24px; }
.pwd-cancel-note { flex: 1; min-width: 0; font-size: 12px; color: var(--text-2); }
.pwd-actions > .btn:first-of-type { margin-left: auto; }
.pwd-actions > .btn[disabled] { pointer-events: none; }

.pwd-skip {
  margin-top: 20px; padding-top: 16px;
  border-top: 1px dashed var(--border); text-align: center;
}
.pwd-skip .btn-link {
  border: 0; background: none; padding: 2px 6px; cursor: pointer;
  font-size: 12.5px; color: var(--text-2);
  text-decoration: underline; text-underline-offset: 2px;
}
.pwd-skip .btn-link:hover { color: var(--text); }
.pwd-skip-note { display: block; margin-top: 4px; font-size: 12px; color: var(--text-2); }

@media (max-width: 640px) {
  .pwd-card { max-width: none; margin: 0 0 16px; }
  .pwd-card .card-body { padding: 16px; }
  .pwd-card .card-head { align-items: flex-start; }
  .pwd-account { width: 100%; }
  .pwd-actions { flex-direction: column; align-items: stretch; gap: 8px; margin-top: 20px; }
  .pwd-actions > .btn { width: 100%; }
  .pwd-actions > .btn:first-of-type { margin-left: 0; }
  .pwd-input-wrap input { font-size: 16px; min-height: 44px; }
  .pwd-eye { width: 40px; height: 40px; }
  .pwd-rules { gap: 6px 12px; }
  .pwd-strength-bar { max-width: none; }
}
@media (max-width: 380px) {
  .pwd-rules { flex-direction: column; gap: 4px; }
}

/* 选择器弹窗（供应商选择等）：触发框 + 弹窗列表 */
.pk-native { display: none; }
.pk-trigger {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  width: 100%; height: 38px; padding: 0 12px; text-align: left;
  background: #fff; border: 1px solid var(--border); border-radius: 8px;
  font-size: 14px; font-family: inherit; color: var(--text); cursor: pointer;
}
.pk-trigger:hover { border-color: var(--primary); }
.pk-trigger:focus-visible { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px rgba(37, 99, 235, .12); }
.pk-trigger.pk-error { border-color: var(--danger); box-shadow: 0 0 0 3px rgba(220, 38, 38, .12); }
.pk-trigger-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pk-trigger-text.is-empty { color: var(--text-3); }
.pk-trigger-ico { display: inline-flex; color: var(--text-3); flex-shrink: 0; }

.pk-list { flex: 1; min-height: 0; overflow-y: auto; margin: 0 -4px; padding: 0 4px; }
.pk-item {
  display: flex; align-items: center; gap: 10px; width: 100%;
  padding: 9px 10px; margin-bottom: 2px; border: 1px solid transparent; border-radius: 8px;
  background: none; font-family: inherit; font-size: 14px; color: var(--text);
  text-align: left; cursor: pointer;
}
.pk-item:hover { background: #f2f3f5; }
.pk-item.is-on { background: rgba(22, 119, 255, .06); border-color: rgba(22, 119, 255, .35); }
.pk-ico {
  display: inline-flex; align-items: center; justify-content: center;
  width: 28px; height: 28px; border-radius: 7px; flex-shrink: 0;
  background: #eef5ff; color: #1677ff;
}
.pk-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pk-mark { display: none; color: #1677ff; flex-shrink: 0; }
.pk-item.is-on .pk-mark { display: inline-flex; }
.pk-empty { flex: 1; display: flex; align-items: center; justify-content: center; font-size: 13px; color: var(--text-3); }
.pk-empty[hidden] { display: none; }
body.pk-open { overflow: hidden; }

/* 附件链接 */
.file-link { display: inline-flex; align-items: center; gap: 4px; max-width: 220px; font-size: 13px; color: var(--primary); text-decoration: none; }
.file-link:hover { text-decoration: underline; }

/* 报价附件库（表内展示，沿用设备参考资料 .pf-* 样式并收紧） */
.qf-cell { min-width: 250px; }
.qf-cell .pf-rows { gap: 6px; }
.qf-cell .pf-row {
  align-items: center; gap: 10px; padding: 8px 10px;
  border: 1px solid var(--border); border-radius: 8px; background: #fff;
}
.qf-cell .pf-row:last-child { border-bottom: 1px solid var(--border); }
.qf-cell .pf-row:hover { border-color: rgba(37, 99, 235, .35); background: #f8fbff; }
.qf-cell .pf-thumb { width: 34px; height: 34px; border-radius: 6px; }
.qf-cell .pf-ico { font-size: 17px; }
.qf-cell .pf-name { font-size: 13px; }
.qf-cell .pf-meta { font-size: 11.5px; gap: 4px; margin-top: 2px; }
.qf-cell .pf-tag { font-size: 10px; padding: 0 4px; }
.qf-cell .pf-acts { gap: 2px; }
.qf-cell .pf-acts .btn { height: 24px; padding: 0 7px; font-size: 12px; }
.qf-cell .qf-del { display: inline-flex; }
.qf-empty { font-size: 12px; color: var(--text-3); }
@media (max-width: 900px) {
  .qf-cell { min-width: 0; }
  .qf-cell .pf-row { flex-wrap: wrap; }
  .qf-cell .pf-acts { width: 100%; justify-content: flex-start; padding-left: 44px; }
}
input[type="file"] { font-size: 13px; color: var(--text-2); }

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 9px 16px;
  border-radius: 8px;
  border: 1px solid transparent;
  background: var(--primary);
  color: #fff;
  font-size: 13.5px;
  font-family: inherit;
  cursor: pointer;
  transition: background .15s, transform .05s;
  white-space: nowrap;
}
.btn:hover { background: var(--primary-dark); color: #fff; }
.btn:active { transform: translateY(1px); }
.btn-ghost { background: #fff; border-color: var(--border); color: var(--text-2); }
.btn-ghost:hover { background: #f8fafc; color: var(--text); }
.btn-danger { background: var(--danger); }
.btn-danger:hover { background: #b91c1c; }
.btn-success { background: var(--success); }
.btn-success:hover { background: #15803d; }
.btn-sm { padding: 5px 11px; font-size: 12.5px; border-radius: 6px; }
.btn-block { width: 100%; }
.btn:disabled { opacity: .55; cursor: not-allowed; }

/* ---------------- 徽章 / 标签 ---------------- */
.badge {
  display: inline-block;
  padding: 2px 9px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.6;
  white-space: nowrap;
}
.badge-ok { background: #ecfdf5; color: #15803d; }
.badge-warn { background: #fffbeb; color: #b45309; }
.badge-danger { background: #fef2f2; color: #b91c1c; }
.badge-info { background: #eff6ff; color: #1d4ed8; }
.badge-muted { background: #f1f5f9; color: #64748b; }
.badge-cyan { background: #ecfeff; color: #0e7490; }

.tag {
  display: inline-block;
  padding: 2px 8px;
  background: #f1f5f9;
  color: var(--text-2);
  border-radius: 6px;
  font-size: 12px;
  margin: 0 4px 4px 0;
}
.tag-admin { background: #e6f4ff; color: #1677ff; }
tr.row-admin { background: #fafcff; }

/* ---------------- 提示 ---------------- */
.alert {
  padding: 11px 15px;
  border-radius: 8px;
  margin-bottom: 16px;
  font-size: 13.5px;
  border: 1px solid transparent;
}
.alert-success { background: #ecfdf5; color: #15803d; border-color: #bbf7d0; }
.alert-danger { background: #fef2f2; color: #b91c1c; border-color: #fecaca; }
.alert-warning { background: #fffbeb; color: #b45309; border-color: #fde68a; }
.alert-warn { background: #fffbeb; color: #b45309; border-color: #fde68a; }
.alert-info { background: #eff6ff; color: #1d4ed8; border-color: #bfdbfe; }
.muted { color: var(--text-3); font-size: 12.5px; }
.warn-text { color: var(--warning); }
.empty { text-align: center; padding: 44px 20px; color: var(--text-3); }
.empty .big { font-size: 34px; margin-bottom: 10px; opacity: .5; }

/* ---------------- 派发参考资料（权限受限引导） ---------------- */
.ref-gate { padding: 16px 18px; }
.ref-gate-head { display: flex; align-items: center; gap: 8px; font-size: 14px; }
.ref-gate-ico { font-size: 15px; }
.ref-gate-desc { margin: 8px 0 12px; font-size: 13px; line-height: 1.7; color: var(--text-2); }
.ref-steps { display: flex; flex-direction: column; gap: 6px; margin-bottom: 12px; }
.ref-step {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 10px;
  border-radius: 7px;
  font-size: 13px;
  background: #fff;
  border: 1px solid var(--border);
}
.ref-step-ico { width: 16px; text-align: center; font-weight: 700; }
.ref-step.ok .ref-step-ico { color: #15803d; }
.ref-step.bad { border-color: #fde68a; background: #fffdf5; }
.ref-step.bad .ref-step-ico { color: #b91c1c; }
.ref-step-d { margin-left: auto; color: var(--text-3); font-size: 12.5px; text-align: right; }
.ref-guide {
  border-radius: 8px;
  background: #fff;
  border: 1px dashed var(--border);
  padding: 12px 14px;
  font-size: 13px;
}
.ref-guide-t { font-weight: 600; margin-bottom: 6px; }
.ref-guide ol { margin: 0; padding-left: 18px; line-height: 1.8; }
.ref-guide-admins {
  margin-top: 8px;
  font-size: 12.5px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.ref-admin { padding: 2px 8px; border-radius: 999px; background: #f1f5f9; }
.ref-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.ref-rules { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.ref-rule { border: 1px solid var(--border); border-radius: 8px; padding: 12px 14px; background: #fff; }
.ref-rule-t { font-weight: 600; font-size: 13.5px; margin-bottom: 6px; }
.ref-rule-d { font-size: 13px; line-height: 1.75; color: var(--text-2); }
@media (max-width: 640px) {
  .ref-rules { grid-template-columns: 1fr; }
}

/* ---------------- 分页 ---------------- */
.pager { display: flex; align-items: center; gap: 6px; padding: 14px 18px; flex-wrap: wrap; }
.pager-info { color: var(--text-3); font-size: 12.5px; margin-right: auto; }
.pager a {
  min-width: 32px; height: 32px;
  display: inline-grid; place-items: center;
  padding: 0 9px;
  border: 1px solid var(--border);
  border-radius: 7px;
  color: var(--text-2);
  font-size: 13px;
  background: #fff;
}
.pager a:hover { border-color: var(--primary); color: var(--primary); }
.pager a.active { background: var(--primary); border-color: var(--primary); color: #fff; }

/* ---------------- 进度 / 图表 ---------------- */
.progress { height: 7px; background: #eef2f7; border-radius: 999px; overflow: hidden; }
.progress > span { display: block; height: 100%; background: linear-gradient(90deg, #3b82f6, #06b6d4); border-radius: 999px; transition: width .4s; }
/* 进度颜色分级：≥100% 已完成（绿）/ ≥60% 正常（蓝）/ ≥30% 偏慢（橙）/ <30% 滞后（红） */
.progress.progress-lg { height: 12px; }
.progress.level-done > span { background: linear-gradient(90deg, #16a34a, #4ade80); }
.progress.level-high > span { background: linear-gradient(90deg, #3b82f6, #06b6d4); }
.progress.level-mid > span { background: linear-gradient(90deg, #f59e0b, #fbbf24); }
.progress.level-low > span { background: linear-gradient(90deg, #ef4444, #fb7185); }
.progress-meta { display: flex; align-items: baseline; gap: 10px; margin-top: 8px; }
.progress-meta .pct { font-size: 20px; font-weight: 700; line-height: 1; font-variant-numeric: tabular-nums; }
.pct.level-done { color: #16a34a; }
.pct.level-high { color: #2563eb; }
.pct.level-mid { color: #d97706; }
.pct.level-low { color: #dc2626; }
.progress-legend { display: flex; gap: 14px; flex-wrap: wrap; font-size: 12px; color: var(--text-2); margin-top: 10px; }
.progress-legend i { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 4px; vertical-align: middle; }

.bar-chart { display: flex; flex-direction: column; gap: 12px; }
.bar-row { display: grid; grid-template-columns: 110px 1fr 56px; align-items: center; gap: 10px; font-size: 13px; }
.bar-row .bar { height: 20px; background: #eef2f7; border-radius: 5px; overflow: hidden; }
.bar-row .bar > i { display: block; height: 100%; background: linear-gradient(90deg, #60a5fa, #2563eb); border-radius: 5px; }
.bar-row .val { text-align: right; color: var(--text-2); font-variant-numeric: tabular-nums; }
/* 兼容 .bar-label / .bar-val 写法 */
.bar-row .bar-label { color: var(--text-2); font-size: 13px; }
.bar-row .bar-val {
  text-align: right; color: var(--text-2); font-size: 13px;
  font-variant-numeric: tabular-nums; font-weight: 600;
}
.bar-row > span:first-child { color: var(--text-2); }
.bar-chart + .bar-chart { margin-top: 12px; }

.donut-legend { display: flex; flex-wrap: wrap; gap: 10px 18px; margin-top: 12px; font-size: 13px; color: var(--text-2); }
.donut-legend i { display: inline-block; width: 9px; height: 9px; border-radius: 3px; margin-right: 6px; }

/* ---------------- 键值信息网格 ---------------- */
.kv-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  gap: 14px 22px;
}
.kv-grid > div { min-width: 0; }
.kv-grid > div > .muted {
  display: block;
  margin-bottom: 3px;
  font-size: 12px;
}
.kv-grid > div > div {
  font-size: 13.5px;
  color: var(--text);
  line-height: 1.6;
  word-break: break-word;
}
/* 详情信息分组：基本信息 / 商务条款 / 联系方式 */
.kv-section + .kv-section {
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px dashed var(--border);
}
.kv-title {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.4px;
  color: var(--text-3);
  margin-bottom: 10px;
}
.kv-grid > .span-all { grid-column: 1 / -1; }

/* ---------------- 标签页 ---------------- */
.tabs {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-wrap: wrap;
}
.tabs .tab {
  padding: 6px 13px;
  border-radius: 8px;
  font-size: 13px;
  color: var(--text-2);
  white-space: nowrap;
  transition: background .15s, color .15s;
}
.tabs .tab:hover { background: #f1f5f9; color: var(--text); }
.tabs .tab.active { background: var(--primary-light); color: var(--primary); font-weight: 600; }
/* 页签上的待办数量 */
.tab-num {
  display: inline-block;
  min-width: 18px;
  padding: 0 5px;
  margin-left: 2px;
  border-radius: 9px;
  background: var(--primary);
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  line-height: 18px;
  text-align: center;
  vertical-align: 1px;
}
.tabs .tab.active .tab-num { background: var(--primary); }

/* 页面级页签：标题下方、内容上方（参考「系统设置」页签样式） */
.page-tabs {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  padding: 2px 0 14px;
  margin-bottom: 4px;
}

/* ---------------- 询价目标设备卡片 ---------------- */
.quote-target {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  padding: 12px 14px;
  margin-bottom: 16px;
  border: 1px solid var(--primary-light);
  border-radius: 10px;
  background: #f8fbff;
}
.quote-target-main { flex: 1; min-width: 0; }
.quote-target-name {
  font-size: 15px;
  font-weight: 600;
  color: var(--text);
  margin: 3px 0 2px;
}

/* ---------------- 任务说明分组 ---------------- */
.task-desc {
  padding: 12px 14px;
  margin-bottom: 4px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: #fafbfc;
}
.task-desc .grid { gap: 10px 20px; }
.task-desc .muted { font-size: 12px; margin-bottom: 2px; }
.task-desc-note {
  padding-top: 10px;
  border-top: 1px dashed var(--border);
  color: var(--text-2);
  line-height: 1.7;
}
input.readonly,
input[readonly] {
  background: #f1f5f9;
  color: var(--text-2);
  cursor: not-allowed;
}

/* ---------------- 设备技术支持：工单列表 ---------------- */
/* 技术支持 tab 内容区 */
.ts-section-head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 14px;
  border-bottom: 1px solid #f1f5f9;
}
.ts-section-body { padding: 14px; }

.tt-list { display: flex; flex-direction: column; gap: 8px; }
.tt-row {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: #fff;
  text-decoration: none;
  color: inherit;
  transition: border-color .15s, box-shadow .15s, background .15s;
}
.tt-row:hover {
  border-color: #93c5fd;
  background: #f8fbff;
  box-shadow: 0 2px 8px rgba(37, 99, 235, .08);
}
.tt-row.tt-open { border-left: 3px solid #f59e0b; }
.tt-ico {
  width: 34px;
  height: 34px;
  flex-shrink: 0;
  border-radius: 8px;
  background: #f1f5f9;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  line-height: 1;
}
.tt-main { flex: 1; min-width: 0; }
.tt-title {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--text);
  line-height: 1.45;
  word-break: break-all;
}
.tt-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  margin-top: 4px;
  font-size: 11.5px;
  color: var(--text-3);
}
.tt-code { font-family: ui-monospace, Menlo, Consolas, monospace; color: var(--text-2); }
.tt-dot { color: #cbd5e1; }
.tt-reply-num { color: #2563eb; font-weight: 500; }
.tt-snippet {
  margin-top: 6px;
  padding: 6px 10px;
  border-radius: 6px;
  background: #f8fafc;
  border-left: 2px solid #cbd5e1;
  font-size: 12px;
  color: var(--text-2);
  line-height: 1.5;
  word-break: break-all;
}
.tt-snippet-who { color: var(--text-3); }
.tt-side {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
  padding-top: 2px;
}
.tt-arrow { color: #cbd5e1; font-size: 18px; line-height: 1; }
.tt-row:hover .tt-arrow { color: var(--primary); }

/* ---------------- 工单沟通记录 ---------------- */
.tt-thread { display: flex; flex-direction: column; gap: 12px; }
.tt-msg {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 12px 14px;
  background: #fff;
}
.tt-msg-user { background: #f8fafc; }
.tt-msg-tech { border-left: 3px solid #2563eb; background: #f8fbff; }
.tt-msg-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
}
.tt-msg-who { font-size: 13px; font-weight: 600; color: var(--text); }
.tt-msg-tag {
  padding: 1px 7px;
  border-radius: 4px;
  background: #e2e8f0;
  color: #475569;
  font-size: 10.5px;
  font-weight: 600;
}
.tt-msg-tag.tt-tag-tech { background: #dbeafe; color: #1d4ed8; }
.tt-msg-role { font-size: 11.5px; color: var(--text-3); }
.tt-msg-time { margin-left: auto; font-size: 11.5px; color: var(--text-3); }
.tt-msg-body { font-size: 13px; color: var(--text); line-height: 1.65; word-break: break-word; }
.tt-msg-empty {
  padding: 18px;
  text-align: center;
  font-size: 12.5px;
  color: var(--text-3);
  border: 1px dashed var(--border);
  border-radius: 10px;
}
/* 流转进度 */
.tt-steps {
  display: flex;
  align-items: flex-start;
  gap: 0;
}
.tt-step {
  flex: 1;
  position: relative;
  text-align: center;
  padding: 0 8px;
}
.tt-step + .tt-step::before {
  content: '';
  position: absolute;
  top: 14px;
  left: -50%;
  width: 100%;
  height: 2px;
  background: #e2e8f0;
}
.tt-step-dot {
  position: relative;
  z-index: 1;
  width: 28px;
  height: 28px;
  margin: 0 auto 8px;
  border-radius: 50%;
  background: #e2e8f0;
  color: #94a3b8;
  font-size: 12.5px;
  font-weight: 600;
  line-height: 28px;
}
.tt-step-name { font-size: 13px; font-weight: 600; color: var(--text-3); }
.tt-step-desc { margin-top: 3px; font-size: 11.5px; color: var(--text-3); line-height: 1.45; }
.tt-step-done .tt-step-dot { background: #dcfce7; color: #15803d; }
.tt-step-done .tt-step-name { color: #15803d; }
.tt-step-done + .tt-step-done::before,
.tt-step-active::before { background: #86efac; }
.tt-step-active .tt-step-dot { background: var(--primary); color: #fff; box-shadow: 0 0 0 4px rgba(37, 99, 235, .12); }
.tt-step-active .tt-step-name { color: var(--primary); }
.tt-step-closed .tt-step-dot { background: #fee2e2; color: #b91c1c; }
.tt-step-closed .tt-step-name { color: #b91c1c; }

/* 评分 */
.tt-rating { color: #f59e0b; letter-spacing: 1px; }
.tt-rating-box {
  margin-top: 14px;
  border: 1px solid #fde68a;
  border-radius: 10px;
  overflow: hidden;
}
.tt-rating-head {
  padding: 8px 14px;
  background: #fffbeb;
  color: #b45309;
  font-size: 12.5px;
  font-weight: 600;
}
.tt-rating-body {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 14px 6px;
  font-size: 13px;
}
.tt-rating-stars { color: #f59e0b; font-size: 16px; letter-spacing: 2px; }
.tt-rating-score { font-weight: 600; color: #b45309; }
.tt-rating-comment { padding: 0 14px 12px; font-size: 13px; line-height: 1.6; color: var(--text); }
.tt-rate { display: flex; flex-wrap: wrap; gap: 8px; }
.tt-rate input { position: absolute; opacity: 0; width: 0; height: 0; }
.tt-rate label {
  padding: 5px 12px;
  border: 1px solid var(--border);
  border-radius: 6px;
  font-size: 12.5px;
  color: var(--text-2);
  cursor: pointer;
  transition: all .15s;
}
.tt-rate label:hover { border-color: #fbbf24; color: #b45309; }
.tt-rate input:checked + label {
  border-color: #f59e0b;
  background: #fffbeb;
  color: #b45309;
  font-weight: 600;
}

/* 关闭 */
.tt-closed-box {
  margin-top: 14px;
  border: 1px solid #fecaca;
  border-radius: 10px;
  overflow: hidden;
}
.tt-closed-head {
  padding: 8px 14px;
  background: #fef2f2;
  color: #b91c1c;
  font-size: 12.5px;
  font-weight: 600;
}
.tt-closed-body { padding: 12px 14px; font-size: 13px; line-height: 1.6; }

.tt-solution {
  margin-top: 14px;
  border: 1px solid #bbf7d0;
  border-radius: 10px;
  overflow: hidden;
}
.tt-solution-head {
  padding: 8px 14px;
  background: #ecfdf5;
  color: #15803d;
  font-size: 12.5px;
  font-weight: 600;
}
.tt-solution-body { padding: 12px 14px; font-size: 13px; line-height: 1.65; }

@media (max-width: 640px) {
  .tt-row { flex-wrap: wrap; }
  .tt-side { width: 100%; justify-content: flex-start; padding-left: 46px; }
  .tt-msg-time { margin-left: 0; width: 100%; }
}

/* ---------------- 设备技术支持 ---------------- */
.ts-wrap { display: flex; flex-direction: column; gap: 14px; }
.ts-block {
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
}
.ts-block-title {
  padding: 9px 14px;
  background: #f8fafc;
  border-bottom: 1px solid var(--border);
  font-size: 12.5px;
  font-weight: 600;
  color: var(--text-2);
  letter-spacing: .3px;
}
.ts-contact { padding: 14px; display: flex; flex-direction: column; gap: 12px; }
.ts-provider {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14.5px;
  font-weight: 600;
  color: var(--text);
}
.ts-ico { font-size: 16px; line-height: 1; }
.ts-lines {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 8px 20px;
}
.ts-line { display: flex; align-items: baseline; gap: 8px; font-size: 13px; color: var(--text); }
.ts-label {
  flex-shrink: 0;
  min-width: 68px;
  font-size: 12px;
  color: var(--text-3);
}
.ts-link { color: var(--primary); text-decoration: none; }
.ts-link:hover { text-decoration: underline; }
.ts-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 12px 20px;
  padding: 14px;
}
.ts-item { display: flex; flex-direction: column; gap: 3px; }
.ts-item-full { grid-column: 1 / -1; }
.ts-value { font-size: 13px; color: var(--text); line-height: 1.5; }
.ts-text { font-size: 13px; color: var(--text); line-height: 1.6; }
.ts-compact .ts-contact,
.ts-compact .ts-grid { padding: 12px; }

@media (max-width: 640px) {
  .ts-lines { grid-template-columns: 1fr; }
  .ts-grid { grid-template-columns: 1fr; }
  .ts-label { min-width: 60px; }
}

/* ---------------- 价格走势图 ---------------- */
.trend-chart {
  display: flex;
  align-items: flex-end;
  gap: 10px;
  padding: 18px 14px 6px;
  min-height: 220px;
  overflow-x: auto;
}
.trend-col {
  flex: 1 0 62px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  height: 180px;
}
.trend-val { font-size: 11.5px; color: var(--text-2); margin-bottom: 5px; white-space: nowrap; }
.trend-bar {
  width: 100%;
  max-width: 46px;
  min-height: 4px;
  border-radius: 6px 6px 0 0;
  background: linear-gradient(180deg, var(--primary), #93c5fd);
  transition: opacity .15s;
}
.trend-col:hover .trend-bar { opacity: .8; }
.trend-x { font-size: 11.5px; color: var(--muted); margin-top: 6px; white-space: nowrap; }

/* ---------------- 供应商公司资料：按类型分组上传 ---------------- */
.sf-groups { display: flex; flex-direction: column; gap: 12px; }
.sf-group {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 12px 14px;
  background: #fff;
}
.sf-group-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}
.sf-group-name { font-size: 13.5px; font-weight: 600; color: var(--text); }
.sf-group .upload-box { padding: 10px 12px; background: #fbfdff; }
.sf-group .upload-ico { font-size: 20px; }
.sf-group .upload-title { font-size: 13px; }
.sf-group .file-list { margin-top: 8px; }
@media (max-width: 640px) {
  .sf-group .upload-inner { flex-wrap: wrap; }
  .sf-group .upload-inner .btn { width: 100%; }
}

/* ---------------- 设备参考资料 ---------------- */
.upload-box {
  border: 1.5px dashed var(--border);
  border-radius: 10px;
  padding: 14px;
  background: #fbfdff;
  transition: border-color .15s, background .15s;
}
.upload-box:hover { border-color: var(--primary); background: var(--primary-light); }
.upload-box.dragging { border-color: var(--primary); background: var(--primary-light); }
.upload-box input[type=file] { background: #fff; cursor: pointer; }
.upload-box .hint { margin-top: 8px; line-height: 1.6; }
.upload-box { position: relative; cursor: pointer; }
.upload-inner { display: flex; align-items: center; gap: 12px; }
.upload-ico { font-size: 26px; line-height: 1; flex-shrink: 0; }
.upload-txt { flex: 1; min-width: 0; }
.upload-title { font-size: 13.5px; font-weight: 500; color: var(--text); }
.upload-inner .hint { margin-top: 4px; }
.upload-inner .btn { flex-shrink: 0; }

.file-list { margin-top: 10px; display: flex; flex-direction: column; gap: 6px; }
.file-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 7px 11px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #fff;
  font-size: 13px;
}
.file-item .file-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text); }
.file-item .file-meta { color: var(--text-3); font-size: 12px; flex-shrink: 0; }
.file-item.file-bad { border-color: #fecaca; background: #fef2f2; }
.file-item.file-bad .file-meta { color: var(--danger); }

/* 已上传附件列表 */
.file-grid { display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.file-card {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: #fff;
  transition: border-color .15s, box-shadow .15s;
}
.file-card:hover { border-color: var(--primary); box-shadow: 0 2px 10px rgba(37, 99, 235, .08); }
.file-card .ico { font-size: 20px; flex-shrink: 0; }
.file-card .meta { flex: 1; min-width: 0; }
.file-card .fname {
  font-size: 13px;
  font-weight: 500;
  color: var(--text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.file-card .fsub { font-size: 11.5px; color: var(--text-3); margin-top: 2px; }
.file-card .acts { display: flex; gap: 6px; flex-shrink: 0; }
.file-thumb {
  width: 46px; height: 46px;
  border-radius: 8px;
  object-fit: cover;
  border: 1px solid var(--border);
  flex-shrink: 0;
  background: #f8fafc;
}

/* ---------------- 设备参考资料：列表式排版（设备信息管理详情） ---------------- */
.pf-list { display: flex; flex-direction: column; gap: 16px; }
.pf-group { border: 1px solid var(--border); border-radius: 10px; overflow: hidden; background: #fff; }
.pf-group-head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 14px;
  background: #f8fafc;
  border-bottom: 1px solid var(--border);
}
.pf-group-name { font-size: 13px; font-weight: 600; color: var(--text); }
.pf-group-count {
  min-width: 18px;
  padding: 0 6px;
  border-radius: 9px;
  background: #e2e8f0;
  color: var(--text-2);
  font-size: 11px;
  font-weight: 600;
  line-height: 18px;
  text-align: center;
}
.pf-rows { display: flex; flex-direction: column; }
.pf-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 14px;
  border-bottom: 1px solid #f1f5f9;
  transition: background .15s;
}
.pf-row:last-child { border-bottom: 0; }
.pf-row:hover { background: #f8fbff; }
.pf-thumb {
  width: 44px;
  height: 44px;
  flex-shrink: 0;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: #f8fafc;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.pf-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pf-ico { font-size: 20px; line-height: 1; }
.pf-info { flex: 1; min-width: 0; }
.pf-name {
  font-size: 13.5px;
  font-weight: 500;
  color: var(--text);
  line-height: 1.4;
  word-break: break-all;
}
.pf-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  margin-top: 4px;
  font-size: 11.5px;
  color: var(--text-3);
}
.pf-tag {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 4px;
  background: #eef2ff;
  color: #4f46e5;
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: .3px;
}
.pf-dot { color: #cbd5e1; }
.pf-acts { display: flex; gap: 6px; flex-shrink: 0; flex-wrap: wrap; justify-content: flex-end; }

@media (max-width: 640px) {
  .pf-row { flex-wrap: wrap; align-items: flex-start; }
  .pf-info { flex: 1 1 calc(100% - 60px); }
  .pf-acts { width: 100%; justify-content: flex-start; padding-left: 56px; }
}

/* 文档预览：参照钉钉文档（白顶栏 + 工具条 + 阅读进度 + 纸面画布 + 目录）
   全部规则限定在 #pvMask 之下，避免与选人弹层的 .pv-* 同名样式互相污染 */
#pvMask { display: none; position: fixed; inset: 0; z-index: 900; background: #f2f3f5; }
#pvMask.open { display: flex; }
#pvMask [hidden] { display: none !important; }
#pvMask .pv-box { display: flex; flex-direction: column; width: 100%; height: 100%; background: #f2f3f5; }

/* 顶栏 */
#pvMask .pv-head { flex: none; display: flex; align-items: center; gap: 16px; height: 56px;
  padding: 0 16px 0 18px; background: #fff; border-bottom: 1px solid #e5e6eb; }
#pvMask .pv-head-l { flex: 1 1 auto; display: flex; align-items: center; gap: 10px; min-width: 0; }
#pvMask .pv-ico { flex: none; width: 28px; height: 28px; border-radius: 6px; display: inline-flex;
  align-items: center; justify-content: center; background: #eef4ff; color: var(--primary); }
#pvMask .pv-ico svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.6;
  stroke-linecap: round; stroke-linejoin: round; }
#pvMask .pv-ico--pdf { background: #ffece8; color: #f54a45; }
#pvMask .pv-ico--image { background: #e8f7ee; color: #23a55a; }
#pvMask .pv-ico--none { background: #f2f3f5; color: #8f959e; }
#pvMask .pv-title { min-width: 0; font-size: 15px; font-weight: 600; color: #1f2329; letter-spacing: .01em;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#pvMask .pv-chip { flex: none; height: 20px; padding: 0 7px; border-radius: 4px; background: #f2f3f5;
  color: #646a73; font-size: 11px; line-height: 20px; }
/* 仅预览：图片/PDF 等预览型附件的只读标识 */
#pvMask .pv-lock { flex: none; display: inline-flex; align-items: center; gap: 4px; height: 20px;
  padding: 0 8px; border-radius: 4px; background: #f2f3f5; color: #646a73; font-size: 11px;
  line-height: 20px; white-space: nowrap; }
#pvMask .pv-lock svg { flex: none; width: 11px; height: 11px; fill: none; stroke: currentColor;
  stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
#pvMask .pv-head-r { flex: none; display: flex; align-items: center; gap: 8px; }

/* 顶栏按钮 */
#pvMask .pv-act { height: 32px; padding: 0 13px; border-radius: 6px; border: 1px solid #dee0e3; background: #fff;
  color: #1f2329; font-size: 13px; display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer; text-decoration: none;
  transition: background .15s, border-color .15s, color .15s; }
#pvMask .pv-act:hover { background: #f5f6f7; border-color: #c9cdd4; color: #1f2329; }
#pvMask .pv-act--main { background: var(--primary); border-color: var(--primary); color: #fff; }
#pvMask .pv-act--main:hover { background: #1d4ed8; border-color: #1d4ed8; color: #fff; }
#pvMask .pv-act--icon { width: 32px; padding: 0; border-color: transparent; color: #646a73; font-size: 15px; }
#pvMask .pv-act--icon:hover { background: #f2f3f5; border-color: transparent; }

/* 工具条 */
#pvMask .pv-tools { flex: none; display: flex; align-items: center; gap: 8px; height: 44px;
  padding: 0 14px; background: #fff; border-bottom: 1px solid #e5e6eb; }
#pvMask .pv-tools-l { flex: 1 1 auto; display: flex; align-items: center; gap: 4px; min-width: 0; overflow-x: auto; }
#pvMask .pv-tools-l::-webkit-scrollbar { height: 0; }
#pvMask .pv-tools-r { flex: none; display: flex; align-items: center; }
#pvMask .pv-tool { height: 28px; min-width: 28px; padding: 0 9px; border: 0; border-radius: 5px;
  background: transparent; color: #1f2329; font-size: 13px; cursor: pointer; white-space: nowrap;
  display: inline-flex; align-items: center; justify-content: center;
  transition: background .15s, color .15s; }
#pvMask .pv-tool:hover { background: #f2f3f5; }
#pvMask .pv-tool.is-on { background: #eef4ff; color: var(--primary); }
#pvMask .pv-tool--val { min-width: 54px; color: #646a73; font-variant-numeric: tabular-nums; }
#pvMask .pv-sep { flex: none; width: 1px; height: 16px; background: #e5e6eb; margin: 0 6px; }
#pvMask .pv-progress-txt { padding-right: 2px; font-size: 12px; color: #8f959e; font-variant-numeric: tabular-nums; }

/* 阅读进度条 */
#pvMask .pv-progress-bar { flex: none; height: 2px; background: #f2f3f5; }
#pvMask .pv-progress-bar > i { display: block; height: 100%; width: 0; background: var(--primary);
  transition: width .12s linear; }

/* 主体：目录 + 画布 */
#pvMask .pv-main { flex: 1 1 auto; display: flex; min-height: 0; position: relative; }
/* 只读浮条：常驻在内容区底部，明确「预览型附件不可编辑」 */
#pvMask .pv-ro-bar { position: absolute; left: 50%; bottom: 18px; transform: translateX(-50%); z-index: 6;
  display: flex; align-items: center; gap: 8px; max-width: calc(100% - 48px); padding: 8px 14px;
  border-radius: 18px; background: rgba(31, 35, 41, .82); color: #fff; font-size: 12.5px; line-height: 1.5;
  box-shadow: 0 6px 18px rgba(31, 35, 41, .18); pointer-events: none; }
#pvMask .pv-ro-bar-ico { flex: none; display: inline-flex; }
#pvMask .pv-ro-bar-ico svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.8;
  stroke-linecap: round; stroke-linejoin: round; }
#pvMask .pv-ro-bar-t { min-width: 0; }
#pvMask .pv-outline { flex: none; width: 216px; min-height: 0; display: flex; flex-direction: column;
  background: #fff; border-right: 1px solid #e5e6eb; }
#pvMask .pv-outline-hd { flex: none; padding: 14px 16px 8px; font-size: 12px; font-weight: 600; color: #8f959e; }
#pvMask .pv-outline-list { flex: 1 1 auto; overflow: auto; padding: 0 8px 16px; }
#pvMask .pv-outline-item { display: block; width: 100%; margin-bottom: 1px; padding: 6px 9px; border: 0;
  border-radius: 5px; background: none; color: #4e5969; font-size: 13px; line-height: 1.5; text-align: left;
  cursor: pointer; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#pvMask .pv-outline-item:hover { background: #f2f3f5; }
#pvMask .pv-outline-item.is-on { background: #eef4ff; color: var(--primary); font-weight: 500; }
#pvMask .pv-outline-item[data-lv="2"] { padding-left: 22px; font-size: 12.5px; }
#pvMask .pv-outline-item[data-lv="3"] { padding-left: 34px; font-size: 12.5px; color: #86909c; }

#pvMask .pv-body { flex: 1 1 auto; min-width: 0; overflow: auto; background: #f2f3f5;
  -webkit-overflow-scrolling: touch; overscroll-behavior: contain; }
/* PDF 现用 PDF.js canvas 分页渲染，页面纵向堆叠在 #pvBody 里，必须可滚动；
   之前 iframe 内嵌时代的 overflow:hidden 会让 PDF 无法上下滑动 */
#pvMask .pv-body--pdf { position: relative; overflow: auto; background: #fff; }
/* 窄屏（iOS Safari / 微信内置浏览器）内嵌 PDF 可能白屏，给一条可点的兜底提示 */
#pvMask .pv-pdf-tip { display: none; }
@media (max-width: 900px) {
  #pvMask .pv-pdf-tip { display: block; position: absolute; top: 8px; left: 50%; transform: translateX(-50%);
    z-index: 2; max-width: 92%; padding: 6px 14px; border-radius: 999px; background: rgba(29, 33, 41, .78);
    color: #fff; font-size: 12px; line-height: 1.5; text-decoration: none; white-space: nowrap; }
}
#pvMask .pv-body--page { padding: 24px 24px 64px; }
#pvMask .pv-body--img { display: flex; align-items: flex-start; justify-content: center; padding: 24px; }
#pvMask .pv-img-wrap { flex: none; }
#pvMask .pv-body--img img { display: block; max-width: none; height: auto; border-radius: 6px; background: #fff;
  box-shadow: 0 2px 6px rgba(31, 35, 41, .08), 0 12px 28px rgba(31, 35, 41, .08); }
#pvMask .pv-body--empty, #pvMask .pv-body--loading { display: flex; align-items: center; justify-content: center; }

/* 纸面 */
#pvMask .pv-page { width: 794px; max-width: 100%; margin: 0 auto; padding: 56px 64px 72px; background: #fff;
  border-radius: 8px; box-shadow: 0 2px 6px rgba(31, 35, 41, .06), 0 10px 30px rgba(31, 35, 41, .07); }
#pvMask .pv-page .kb-content { margin-top: 0; font-size: 15px; line-height: 1.9; color: #1f2329; }
#pvMask .pv-page .kb-content h1 { font-size: 20px; }
#pvMask .pv-page .kb-content h2 { font-size: 17px; }
#pvMask .pv-page .kb-content h3 { font-size: 15.5px; }
#pvMask .pv-page .kb-content h1,
#pvMask .pv-page .kb-content h2,
#pvMask .pv-page .kb-content h3 { scroll-margin-top: 16px; }
#pvMask .pv-page .pv-doc-head { padding-bottom: 20px; margin-bottom: 26px; border-bottom: 1px solid #eff0f1; }
#pvMask .pv-page .pv-doc-title { font-size: 26px; font-weight: 600; line-height: 1.38; color: #1f2329;
  letter-spacing: -.01em; }
#pvMask .pv-page .pv-doc-meta { margin-top: 12px; font-size: 12.5px; color: #8f959e; }
#pvMask .pv-page .pv-doc-summary { margin: 18px 0 0; padding: 12px 16px; border-radius: 6px; background: #f7f8fa;
  border-left: 3px solid var(--primary); color: #4e5969; font-size: 13.5px; line-height: 1.75; }

/* 骨架屏 */
#pvMask .pv-page--skel .pv-skel { display: block; height: 12px; border-radius: 4px; background: #eff0f2;
  margin-bottom: 14px; animation: kbv-pulse 1.2s ease-in-out infinite; }
#pvMask .pv-page--skel .pv-skel--title { height: 22px; width: 60%; margin-bottom: 28px; }
#pvMask .pv-page--skel .pv-skel--sm { width: 44%; }

/* 纯文本 / 源码：等宽字体按原样排版，长行横向滚动而不折行 */
#pvMask .pv-page--text { padding: 28px 32px 48px; }
#pvMask .pv-text { margin: 0; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Courier New", monospace;
  font-size: 13px; line-height: 1.75; color: #1f2329; white-space: pre; tab-size: 4;
  overflow-x: auto; }
#pvMask .pv-note { margin: 14px 0 0; padding: 8px 12px; border-radius: 6px; background: #f7f8fa;
  color: #8f959e; font-size: 12.5px; line-height: 1.6; }

/* 表格（CSV / Excel）：宽页面 + 冻结表头 */
#pvMask .pv-page--wide { width: 100%; max-width: 1180px; padding: 24px 28px 48px; }
#pvMask .pv-sheet { width: 100%; border-collapse: collapse; font-size: 13px; line-height: 1.6; }
#pvMask .pv-sheet th,
#pvMask .pv-sheet td { padding: 7px 10px; border: 1px solid #e5e6eb; text-align: left;
  vertical-align: top; white-space: nowrap; max-width: 360px; overflow: hidden; text-overflow: ellipsis; }
#pvMask .pv-sheet th { position: sticky; top: 0; z-index: 1; background: #f7f8fa; color: #4e5969;
  font-weight: 600; }
#pvMask .pv-sheet tbody tr:nth-child(even) td { background: #fbfbfc; }
/* Excel 转出来的表头是 td（SheetJS 不标 th）：提成 thead 后按表头样式处理，
   斑马纹从 thead 之后重新计数，表头本身也要粘住 */
#pvMask .pv-sheet thead td { position: sticky; top: 0; z-index: 1; background: #f7f8fa;
  color: #4e5969; font-weight: 600; }
#pvMask .pv-sheet:not(.pv-sheet--head) tbody tr:first-child td { background: #f7f8fa;
  color: #4e5969; font-weight: 600; }

/* 压缩包清单 */
#pvMask .pv-arch-head { margin-bottom: 12px; color: #4e5969; font-size: 13px; }
#pvMask .pv-arch-table { width: 100%; border-collapse: collapse; font-size: 13px; }
#pvMask .pv-arch-table td { padding: 7px 4px; border-bottom: 1px solid #f0f1f3; }
#pvMask .pv-arch-name { color: #1f2329; word-break: break-all; }
#pvMask .pv-arch-size { width: 96px; color: #8f959e; text-align: right; white-space: nowrap; }

/* Word（mammoth 解析结果）：按正文阅读样式排版 */
#pvMask .pv-docx { font-size: 15px; line-height: 1.9; color: #1f2329; word-wrap: break-word; }
#pvMask .pv-docx h1 { margin: 28px 0 14px; font-size: 22px; line-height: 1.4; }
#pvMask .pv-docx h2 { margin: 24px 0 12px; font-size: 18px; line-height: 1.45; }
#pvMask .pv-docx h3,
#pvMask .pv-docx h4 { margin: 20px 0 10px; font-size: 16px; line-height: 1.5; }
#pvMask .pv-docx p { margin: 0 0 12px; }
#pvMask .pv-docx ul,
#pvMask .pv-docx ol { margin: 0 0 12px; padding-left: 24px; }
#pvMask .pv-docx li { margin-bottom: 4px; }
#pvMask .pv-docx img { max-width: 100%; height: auto; }
#pvMask .pv-docx table { border-collapse: collapse; margin: 14px 0; font-size: 13.5px; }
#pvMask .pv-docx th,
#pvMask .pv-docx td { padding: 6px 10px; border: 1px solid #dcdfe6; }
#pvMask .pv-docx th { background: #f7f8fa; }
#pvMask .pv-docx blockquote { margin: 14px 0; padding: 8px 14px; border-left: 3px solid #e5e6eb;
  color: #4e5969; }

/* 解析中 */
#pvMask .pv-parsing { padding: 40px 0; text-align: center; color: #8f959e; font-size: 13.5px;
  animation: kbv-pulse 1.2s ease-in-out infinite; }

/* 空态 */
#pvMask .pv-empty { max-width: 360px; padding: 24px; text-align: center; }
#pvMask .pv-empty-ico { display: inline-flex; align-items: center; justify-content: center; width: 52px;
  height: 52px; margin-bottom: 14px; border-radius: 12px; background: #e9ebef; color: #8f959e; }
#pvMask .pv-empty-ico svg { width: 26px; height: 26px; fill: none; stroke: currentColor; stroke-width: 1.5;
  stroke-linecap: round; stroke-linejoin: round; }
#pvMask .pv-empty-t { margin-bottom: 16px; color: #646a73; font-size: 13.5px; line-height: 1.7; }
/* Office 转换中：转圈 + 一句预期时间，替代空白或无限骨架屏 */
#pvMask .pv-gen { display: flex; flex-direction: column; align-items: center; }
#pvMask .pv-gen .pv-empty-t { margin: 14px 0 0; }
#pvMask .pv-gen-spin { width: 28px; height: 28px; border-radius: 50%;
  border: 2px solid #e3e6ea; border-top-color: var(--primary); animation: pvspin .8s linear infinite; }
@keyframes pvspin { to { transform: rotate(360deg); } }

/* 窄屏：压缩头部间距，但保留「新窗口」——移动端内嵌 PDF / Office 白屏时它才是出口 */
@media (max-width: 700px) {
  #pvMask .pv-head-r { gap: 6px; }
  #pvMask .pv-act { padding: 0 8px; font-size: 12.5px; }
}

@media (max-width: 900px) {
  #pvMask .pv-head { height: 52px; padding: 0 12px; gap: 10px; }
  #pvMask .pv-tools { height: 40px; padding: 0 10px; }
  #pvMask .pv-page { padding: 30px 20px 40px; }
  #pvMask .pv-act { padding: 0 10px; }
  /* 目录变成抽屉，避免在窄屏上挤压正文 */
  #pvMask .pv-main { position: relative; }
  #pvMask .pv-outline { position: absolute; left: 0; top: 0; bottom: 0; z-index: 2;
    width: 78%; max-width: 280px; box-shadow: 0 0 24px rgba(31, 35, 41, .14); }
}

/* ---------------- 审批时间轴 ---------------- */
.timeline { position: relative; padding-left: 6px; }
.tl-item { position: relative; display: flex; gap: 12px; padding: 0 0 18px 0; }
.tl-item:last-child { padding-bottom: 0; }
.tl-item::before {
  content: ''; position: absolute; left: 5px; top: 16px; bottom: 0; width: 2px; background: #e2e8f0;
}
.tl-item:last-child::before { display: none; }
.tl-dot {
  flex: 0 0 auto; width: 12px; height: 12px; border-radius: 50%; margin-top: 4px;
  background: #cbd5e1; box-shadow: 0 0 0 3px #f1f5f9; z-index: 1;
}
.tl-body { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 13.5px; }
.tl-body .tag {
  font-size: 11.5px; padding: 1px 8px; border-radius: 999px;
  background: #f1f5f9; color: var(--text-2);
}
.tl-item.done .tl-dot { background: #16a34a; box-shadow: 0 0 0 3px #dcfce7; }
.tl-item.done .tl-body .tag { background: #dcfce7; color: #15803d; }
.tl-item.current .tl-dot { background: #f59e0b; box-shadow: 0 0 0 3px #fef3c7; }
.tl-item.current .tl-body .tag { background: #fef3c7; color: #b45309; }
.tl-item.reject .tl-dot { background: #dc2626; box-shadow: 0 0 0 3px #fee2e2; }
.tl-item.reject .tl-body .tag { background: #fee2e2; color: #b91c1c; }

/* 搜索框 */
.search { display: flex; gap: 8px; align-items: center; }
.search input[type="text"] {
  padding: 7px 11px; border: 1px solid var(--border); border-radius: 8px;
  font-size: 13px; min-width: 180px; outline: none;
}
.search input[type="text"]:focus { border-color: var(--primary); }

/* ---------------- 登录页（统一入口） ---------------- */
.login-wrap {
  min-height: 100vh;
  min-height: 100dvh;
  display: grid;
  place-items: center;
  padding: 32px 20px;
  background: radial-gradient(1200px 600px at 10% 0%, #1e3a8a 0%, #0f172a 55%, #020617 100%);
}
.login-shell {
  display: flex;
  width: 100%;
  max-width: 780px;
  border-radius: 18px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 28px 70px rgba(2, 6, 23, .5);
}

/* 左栏：只放品牌标识，垂直居中；深蓝与页面背景同族，靠右侧白色表单拉开层次 */
.login-aside {
  flex: 0 0 280px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 34px 28px;
  background: linear-gradient(160deg, #1d3a8a 0%, #172554 55%, #0b1120 100%);
  color: #e2e8f0;
}
.login-brand { display: flex; align-items: center; gap: 12px; }
.login-brand .logo {
  flex: none; width: 44px; height: 44px; border-radius: 12px;
  display: grid; place-items: center;
  background: linear-gradient(135deg, #3b82f6, #06b6d4);
  color: #fff; font-size: 18px; font-weight: 800;
}
.login-brand-text { min-width: 0; }
.login-brand-text strong { display: block; font-size: 14.5px; color: #fff; }
.login-brand-text small {
  display: block; margin-top: 2px;
  font-size: 11.5px; color: #93a8c8; overflow-wrap: anywhere;
}
/* 品牌下方的一句话定位与能力要点，让左栏不至于空成一块色板 */
.login-aside-desc { margin: 20px 0 0; font-size: 12.5px; line-height: 1.85; color: #a9bcd8; }
.login-feat { margin: 18px 0 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.login-feat li { display: flex; align-items: flex-start; gap: 8px;
  font-size: 12.5px; line-height: 1.6; color: #cbd9ee; }
.login-feat svg { flex: none; width: 15px; height: 15px; margin-top: 2px; fill: none;
  stroke: #7ea6f0; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

/* 右栏：表单 */
.login-main { flex: 1 1 auto; min-width: 0; padding: 36px 34px 30px; }
.login-head h1 { margin: 0 0 6px; font-size: 22px; }
.login-head p { margin: 0 0 22px; font-size: 12.5px; color: var(--text-2); }
.login-status { margin-bottom: 16px; }
.login-status .alert:last-child { margin-bottom: 0; }
.login-form .field + .field { margin-top: 14px; }
.login-hint { margin: 6px 0 0; font-size: 12px; color: var(--text-2); }
.login-err { margin: 6px 0 0; font-size: 12px; color: var(--danger); }
.login-caps { color: var(--warning); }
.login-submit {
  min-height: 44px; margin-top: 20px;
  font-size: 14px; letter-spacing: .04em;
}

/* 密码显隐：输入框右侧 40px 触控区 */
.login-pw { position: relative; }
.login-pw input { padding-right: 46px; }
.login-eye {
  position: absolute; right: 2px; top: 50%; transform: translateY(-50%);
  width: 40px; height: 40px; padding: 0;
  display: flex; align-items: center; justify-content: center;
  border: 0; border-radius: 8px; background: transparent;
  color: var(--text-2); cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.login-eye:hover { color: var(--text); background: #f1f5f9; }
/* 显示状态（明文）时图标转为强调色，用颜色而非仅靠图标暗示当前状态 */
.login-eye.on { color: var(--primary); }
.login-eye svg { width: 18px; height: 18px; pointer-events: none; }

/* 账号使用说明：浅蓝底 + 左侧色条，与表单同色系但不抢焦点 */
.login-notice {
  margin-top: 18px;
  padding: 12px 14px;
  border-radius: 10px;
  border: 1px solid #dbe8ff;
  border-left: 3px solid #3b82f6;
  background: #f2f7ff;
  font-size: 12.5px;
  line-height: 1.7;
  color: #41506b;
  text-align: left;
}
.login-notice-item { display: flex; align-items: flex-start; gap: 8px; }
.login-notice-item + .login-notice-item { margin-top: 9px; padding-top: 9px; border-top: 1px dashed #dbe8ff; }
.login-notice-item svg { flex: none; margin-top: 2.5px; color: #2f6fed; }
/* text-wrap: pretty 让中文断行避开「单字落行」，不支持的浏览器自动忽略 */
.login-notice-item p { margin: 0; text-wrap: pretty; }
.login-notice-item strong { color: #1e40af; font-weight: 600; }

@media (max-width: 860px) {
  /* 移动端改成顶部对齐：键盘弹起时表单不会被居中推到视野外；
     显式给一列 minmax(0,100%)，否则自动列会按内容撑到 460px 上限，窄屏横向溢出 */
  .login-wrap { padding: 20px 16px; place-items: start center; grid-template-columns: minmax(0, 100%); }
  .login-shell { flex-direction: column; width: 100%; max-width: 460px; }
  .login-aside { flex: none; padding: 18px 20px; }
  /* 单栏时左栏退化成品牌条：说明与要点全展开会把表单推到首屏之外 */
  .login-aside-desc, .login-feat { display: none; }
  .login-main { padding: 24px 20px 22px; }
  .login-head h1 { font-size: 20px; }
  .login-head p { margin-bottom: 18px; }
}
@media (max-width: 380px) {
  .login-wrap { padding: 12px; }
  .login-main { padding: 20px 16px 18px; }
  .login-brand-text small { display: none; }
}

/* ---------------- AI 报告 ---------------- */
.ai-report h3 { margin-top: 22px; padding-left: 10px; border-left: 3px solid var(--primary); }
.ai-report table { margin: 10px 0 16px; }
.ai-conclusion { padding-left: 18px; line-height: 1.9; }
.ai-answer { background: #f8fafc; border-radius: 8px; padding: 14px 16px; }
.ai-answer p { margin: 0 0 8px; }
.ai-answer p:last-child { margin-bottom: 0; }
/* 大模型纯文本按「标题 / 列表 / 粗体」渲染后的排版（ai_text_html） */
.ai-answer ul, .ai-answer ol { margin: 0 0 10px; padding-left: 20px; }
.ai-answer li { margin-bottom: 5px; }
.ai-answer li:last-child { margin-bottom: 0; }
.ai-answer strong, .ai-answer b { font-weight: 650; }
.ai-answer .ai-md-h { margin: 14px 0 8px; font-size: 13.5px; font-weight: 650; color: var(--text); }
.ai-answer .ai-md-h:first-child { margin-top: 0; }
.ai-answer code { padding: 1px 5px; border-radius: 4px; background: #eef2f7; font-size: 12.5px; }
/* 报告里的表格来自大模型，给个下限宽度，窄屏走 .table-wrap 横向滚动而不是挤成竖排 */
.ai-answer .table { min-width: 560px; }
.ai-answer hr { margin: 18px 0; border: 0; border-top: 1px dashed var(--border); }
.qa-bubble { background: var(--primary-light); border-radius: 10px; padding: 12px 14px; margin-bottom: 12px; }
.qa-bubble.answer { background: #f8fafc; }

/* ---------------- 移动端底部导航 ---------------- */
.tabbar {
  display: none;
  position: fixed;
  bottom: 0; left: 0; right: 0;
  background: #fff;
  border-top: 1px solid var(--border);
  z-index: 58;
  padding-bottom: env(safe-area-inset-bottom);
}
.tabbar a {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  padding: 8px 0 6px;
  font-size: 10.5px;
  color: var(--text-3);
}
.tabbar a .ico { font-size: 18px; line-height: 1; }
.tabbar a.active { color: var(--primary); }

/* ===========================================================
  成员信息编辑：右侧抽屉（钉钉风格）
   =========================================================== */
body.ue-lock { overflow: hidden; }

.ue-mask {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, .45);
  z-index: 900;
}
.ue-drawer {
  position: fixed;
  top: 0; right: 0; bottom: 0;
  width: 520px;
  max-width: 100%;
  background: #fff;
  z-index: 901;
  display: flex;
  flex-direction: column;
  box-shadow: -4px 0 24px rgba(0, 0, 0, .12);
  animation: ue-slide .2s ease;
}
@keyframes ue-slide {
  from { transform: translateX(24px); opacity: .6; }
  to { transform: none; opacity: 1; }
}

/* 头部 */
.ue-head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 16px 20px 14px;
  border-bottom: 1px solid #eef0f3;
  flex-shrink: 0;
}
.ue-head-avatar {
  width: 38px; height: 38px;
  border-radius: 50%;
  background: linear-gradient(135deg, #60a5fa, #2563eb);
  color: #fff;
  display: grid; place-items: center;
  font-size: 15px; font-weight: 600;
  flex-shrink: 0;
}
.ue-head-main { flex: 1; min-width: 0; }
.ue-head-name {
  font-size: 15px; font-weight: 600; color: #1f2329;
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
  line-height: 1.4;
}
.ue-head-sub {
  font-size: 12px; color: #8a9099; margin-top: 2px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.ue-close {
  width: 28px; height: 28px;
  display: grid; place-items: center;
  border-radius: 6px;
  color: #8a9099;
  font-size: 20px;
  line-height: 1;
  text-decoration: none;
  flex-shrink: 0;
}
.ue-close:hover { background: #f2f3f5; color: #1f2329; }

.ue-tag {
  font-size: 11px; font-weight: 500;
  padding: 1px 7px;
  border-radius: 4px;
  line-height: 1.7;
}
.ue-tag.blue { background: #e6f4ff; color: #1677ff; }
.ue-tag.gray { background: #f2f3f5; color: #8a9099; }

/* 标签页 */
.ue-tabs {
  display: flex;
  align-items: center;
  gap: 26px;
  padding: 0 20px;
  border-bottom: 1px solid #eef0f3;
  flex-shrink: 0;
}
.ue-tab {
  appearance: none;
  border: none;
  background: none;
  padding: 12px 0 11px;
  font-size: 14px;
  color: #646a73;
  cursor: pointer;
  position: relative;
  font-family: inherit;
}
.ue-tab:hover { color: #1f2329; }
.ue-tab.active { color: #1f2329; font-weight: 600; }
.ue-tab.active::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -1px;
  height: 2px;
  background: #1f2329;
  border-radius: 2px 2px 0 0;
}

/* 表单 */
.ue-form {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
}
.ue-body {
  flex: 1;
  overflow-y: auto;
  padding: 0 20px 20px;
}
.ue-pane { display: none; }
.ue-pane.active { display: block; }

.ue-note {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 0 -20px 4px;
  padding: 9px 20px;
  background: #f7f8fa;
  font-size: 12.5px;
  color: #8a9099;
}
.ue-note a { color: #1677ff; text-decoration: none; }
.ue-note a:hover { text-decoration: underline; }

.ue-field { padding: 12px 0 2px; }
.ue-label {
  display: block;
  font-size: 14px;
  color: #1f2329;
  margin-bottom: 8px;
  line-height: 1.4;
}
.ue-label.req::before {
  content: "*";
  color: #f5483b;
  margin-right: 3px;
  font-family: inherit;
}
.ue-input {
  width: 100%;
  box-sizing: border-box;
  height: 40px;
  padding: 0 12px;
  border: 1px solid #dee0e3;
  border-radius: 6px;
  font-size: 14px;
  color: #1f2329;
  background: #fff;
  outline: none;
  font-family: inherit;
  transition: border-color .15s, box-shadow .15s;
}
.ue-input::placeholder { color: #bbbfc4; }
.ue-input:focus {
  border-color: #1677ff;
  box-shadow: 0 0 0 3px rgba(22, 119, 255, .1);
}
.ue-input:disabled,
.ue-input[disabled] {
  background: #f5f6f7;
  color: #8a9099;
  cursor: not-allowed;
}
.ue-select { position: relative; width: 100%; }
.ue-select .ue-input {
  appearance: none;
  -webkit-appearance: none;
  padding-right: 34px;
  min-height: 40px;
  line-height: 1.4;
  cursor: pointer;
  text-overflow: ellipsis;
}
.ue-select::after {
  content: "";
  position: absolute;
  right: 13px;
  top: 50%;
  width: 7px; height: 7px;
  border-right: 1.5px solid #8a9099;
  border-bottom: 1.5px solid #8a9099;
  transform: translateY(-70%) rotate(45deg);
  pointer-events: none;
}
.ue-hint {
  font-size: 12px;
  color: #8a9099;
  line-height: 1.6;
  margin-top: 6px;
}
.ue-static {
  display: flex;
  align-items: center;
  min-height: 40px;
  padding: 0 12px;
  border: 1px solid #eef0f3;
  border-radius: 6px;
  background: #f7f8fa;
  font-size: 14px;
  color: #646a73;
  box-sizing: border-box;
}

/* 部门管理树形列表 */
.dept-tree-name {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.dept-tree-guide {
  color: #c3c7cc;
  white-space: pre;
  flex-shrink: 0;
  font-size: 13px;
}
.dept-tree-note {
  font-size: 12px;
  color: #8a9099;
  font-weight: 400;
}

/* 角色权限分组 */
.perm-groups { display: grid; gap: 12px; }
.perm-group {
  border: 1px solid #eef0f3;
  border-radius: 8px;
  padding: 12px 14px;
  background: #fcfcfd;
}
.perm-group-head {
  display: flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}
.perm-group-name { font-size: 14px; font-weight: 600; color: #1f2329; }
.perm-group-hint { font-size: 12px; color: #8a9099; }
.perm-group-items { display: flex; gap: 8px 20px; flex-wrap: wrap; }
.perm-item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13.5px;
  color: #1f2329;
  cursor: pointer;
}
.perm-item-code { font-size: 11.5px; color: #bbbfc4; }
.perm-item-desc { flex-basis: 100%; font-size: 11.5px; color: #9aa1a9; margin: -1px 0 2px 22px; }
.perm-group-count {
  font-size: 12px;
  color: #6b7280;
  background: #f1f3f6;
  border-radius: 999px;
  padding: 1px 9px;
}
.perm-item { align-items: flex-start; flex-wrap: wrap; }
.perm-item > input { margin-top: 2px; }
.perm-item-label { line-height: 1.45; }
.perm-group-name { display: inline-flex; align-items: center; gap: 4px; }

.ue-divider {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 18px 0 2px;
  font-size: 12.5px;
  color: #8a9099;
}
.ue-divider span { flex-shrink: 0; }
.ue-divider::after {
  content: "";
  flex: 1;
  height: 1px;
  background: #eef0f3;
}

/* 底部操作栏 */
.ue-foot {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  padding: 12px 20px;
  border-top: 1px solid #eef0f3;
  background: #fff;
  flex-shrink: 0;
}
.ue-foot .btn { min-width: 72px; justify-content: center; }
.ue-btn-danger { background: #f5483b; color: #fff; }
.ue-btn-danger:hover { background: #d93a2e; color: #fff; }
.ue-btn-danger:disabled,
.ue-btn-danger[disabled] { background: #f7b0aa; color: #fff; }

/* 选择器触发框（直属主管） */
.ue-picker {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  text-align: left;
  cursor: pointer;
  font-family: inherit;
}
.ue-picker-text {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #1f2329;
}
.ue-picker-text.is-empty { color: #bbbfc4; }
.ue-picker-ico { color: #8a9099; display: inline-flex; flex-shrink: 0; }
.ue-picker:hover { border-color: #1677ff; }

/* 直属主管选择弹窗 */
.ue-modal {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}
.ue-modal[hidden] { display: none; }
.ue-modal-mask {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, .45);
}
.ue-modal-card {
  position: relative;
  width: 900px;
  max-width: 100%;
  height: 620px;
  max-height: 100%;
  background: #fff;
  border-radius: 10px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  box-shadow: 0 12px 40px rgba(0, 0, 0, .18);
  animation: ue-pop .16s ease;
}
@keyframes ue-pop {
  from { transform: scale(.985); opacity: .7; }
  to { transform: none; opacity: 1; }
}
.ue-modal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px 14px;
  border-bottom: 1px solid #eef0f3;
  font-size: 16px;
  font-weight: 600;
  color: #1f2329;
  flex-shrink: 0;
}
.ue-modal-x {
  appearance: none;
  border: none;
  background: none;
  font-size: 22px;
  line-height: 1;
  color: #8a9099;
  cursor: pointer;
  padding: 2px 6px;
  border-radius: 6px;
}
.ue-modal-x:hover { background: #f2f3f5; color: #1f2329; }

.ue-modal-body {
  flex: 1;
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 260px;
}
.ue-modal-left {
  display: flex;
  flex-direction: column;
  min-height: 0;
  padding: 14px 16px 8px;
  border-right: 1px solid #eef0f3;
}
.ue-modal-search {
  position: relative;
  display: flex;
  align-items: center;
  flex-shrink: 0;
}
.ue-modal-search svg {
  position: absolute;
  left: 13px;
  color: #8a9099;
  pointer-events: none;
}
.ue-modal-search input {
  width: 100%;
  height: 40px;
  padding: 0 12px 0 36px;
  border: 1px solid #1677ff;
  border-radius: 8px;
  font-size: 14px;
  outline: none;
  font-family: inherit;
  color: #1f2329;
}
.ue-modal-search input::placeholder { color: #bbbfc4; }
.ue-modal-search input:focus { box-shadow: 0 0 0 3px rgba(22, 119, 255, .12); }

.ue-modal-crumb {
  padding: 12px 2px 6px;
  font-size: 12.5px;
  color: #8a9099;
  flex-shrink: 0;
}
.ue-modal-crumb span { margin: 0 4px; color: #c3c7cc; }

.ue-org {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  margin: 0 -4px;
  padding: 0 4px;
}
.ue-org-item { border-radius: 8px; }
.ue-org-item + .ue-org-item { margin-top: 2px; }
.ue-org-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 8px;
  border-radius: 8px;
}
.ue-org-row:hover { background: #f7f8fa; }
.ue-org-ico {
  width: 34px; height: 34px;
  border-radius: 8px;
  background: #eaf2ff;
  color: #1677ff;
  display: grid; place-items: center;
  flex-shrink: 0;
}
.ue-org-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.ue-org-name {
  font-size: 14px; color: #1f2329;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.ue-org-count { font-size: 12px; color: #8a9099; }
.ue-org-sub {
  appearance: none;
  border: none;
  background: none;
  color: #1677ff;
  font-size: 13px;
  cursor: pointer;
  padding: 4px 8px;
  border-radius: 6px;
  font-family: inherit;
  flex-shrink: 0;
}
.ue-org-sub:hover { background: #eaf2ff; }
.ue-org-none { font-size: 12px; color: #c3c7cc; padding: 0 8px; flex-shrink: 0; }

.ue-org-members { padding: 2px 0 6px 46px; }
.ue-org-members[hidden] { display: none; }
.ue-mem {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 7px 8px;
  border-radius: 6px;
  cursor: pointer;
}
.ue-mem:hover { background: #f7f8fa; }
.ue-mem[hidden] { display: none; }
.ue-mem-check {
  appearance: none;
  -webkit-appearance: none;
  width: 16px; height: 16px;
  border: 1px solid #d0d3d8;
  border-radius: 4px;
  background: #fff;
  cursor: pointer;
  flex-shrink: 0;
  position: relative;
  transition: background .12s, border-color .12s;
}
.ue-mem-check:hover { border-color: #1677ff; }
.ue-mem-check:checked { background: #1677ff; border-color: #1677ff; }
.ue-mem-check:checked::after {
  content: "";
  position: absolute;
  left: 4.5px; top: 1.5px;
  width: 4px; height: 8px;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(45deg);
}
.ue-mem-main { min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.ue-mem-name {
  font-size: 13.5px; color: #1f2329;
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
}
.ue-mem-sub {
  font-size: 12px; color: #8a9099;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.ue-mem-tag {
  font-size: 11px;
  padding: 0 6px;
  border-radius: 4px;
  line-height: 1.7;
}
.ue-mem-tag.blue { background: #e6f4ff; color: #1677ff; }
.ue-mem-tag.gray { background: #f2f3f5; color: #8a9099; }

.ue-org-empty { padding: 20px; text-align: center; font-size: 13px; color: #8a9099; }
.ue-org-empty[hidden] { display: none; }

.ue-modal-right {
  display: flex;
  flex-direction: column;
  min-height: 0;
  padding: 14px 16px;
  background: #fbfbfc;
}
.ue-sel-title {
  font-size: 14px;
  color: #646a73;
  flex-shrink: 0;
  margin-bottom: 10px;
}
.ue-sel-list { flex: 1; min-height: 0; overflow-y: auto; }
/* 多选时已选卡片间距（单选只有一张，不受影响） */
.ue-sel-list .ue-sel-item + .ue-sel-item { margin-top: 8px; }
.ue-sel-empty { font-size: 12.5px; color: #bbbfc4; padding: 8px 2px; }
.ue-sel-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  background: #fff;
  border: 1px solid #eef0f3;
  border-radius: 6px;
  padding: 8px 10px;
  font-size: 13.5px;
  color: #1f2329;
}
.ue-sel-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ue-sel-del {
  appearance: none;
  border: none;
  background: none;
  color: #8a9099;
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
  padding: 0 2px;
  flex-shrink: 0;
}
.ue-sel-del:hover { color: #f5483b; }

.ue-modal-foot {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  padding: 14px 20px;
  border-top: 1px solid #eef0f3;
  flex-shrink: 0;
}
.ue-pill {
  appearance: none;
  border: 1px solid transparent;
  background: #f2f3f5;
  color: #1f2329;
  font-size: 14px;
  font-family: inherit;
  padding: 9px 22px;
  border-radius: 999px;
  cursor: pointer;
}
.ue-pill:hover { background: #e8eaed; }
.ue-pill.primary { background: #1677ff; color: #fff; }
.ue-pill.primary:hover { background: #0e63d6; }

@media (max-width: 767px) {
  .ue-drawer { width: 100%; }
  .ue-tabs { gap: 18px; }
  .ue-modal { padding: 12px; }
  .ue-modal-card { height: 100%; border-radius: 8px; }
  .ue-modal-body { grid-template-columns: 1fr; }
  .ue-modal-right {
    border-top: 1px solid #eef0f3;
    max-height: 140px;
  }
  .ue-org-members { padding-left: 24px; }
}

/* ===========================================================
  技术支持工单详情
   =========================================================== */
.tv-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}
.tv-col { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.tv-col > .card { margin-bottom: 0; }

/* 流转进度 */
.flow {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  padding: 4px 0 2px;
}
.flow-step {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1;
  min-width: 120px;
  font-size: 12.5px;
  color: var(--text-3);
}
.flow-step .dot {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #eef1f5;
  color: var(--text-3);
  font-size: 12px;
  flex-shrink: 0;
}
.flow-step:not(:last-child)::after {
  content: '';
  flex: 1;
  height: 2px;
  min-width: 14px;
  background: #eef1f5;
  border-radius: 2px;
}
.flow-step.done .dot { background: #dcfce7; color: #15803d; }
.flow-step.done { color: var(--text-2); }
.flow-step.current .dot { background: var(--primary); color: #fff; }
.flow-step.current .txt { color: var(--primary); font-weight: 600; }

.tv-closed {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 10px 14px;
  border-radius: 8px;
  background: #f8fafc;
  border-left: 3px solid var(--text-3);
  font-size: 13px;
  color: var(--text-2);
}

/* 沟通记录 */
.chat { display: flex; flex-direction: column; gap: 14px; }
.chat-item { max-width: 88%; }
.chat-item.tech { align-self: flex-end; }
.chat-item .chat-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 5px;
  font-size: 12px;
  color: var(--text-3);
}
.chat-item .chat-head .who { font-size: 12.5px; font-weight: 600; color: var(--text-2); }
.chat-item .chat-body {
  padding: 10px 13px;
  border-radius: 10px;
  font-size: 13px;
  line-height: 1.7;
  color: var(--text);
  background: #f4f6f9;
  border-bottom-left-radius: 3px;
  word-break: break-word;
}
.chat-item.tech .chat-body {
  background: var(--primary-light);
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 3px;
}
.chat-item.tech .chat-head { justify-content: flex-end; }

.tv-form {
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px dashed var(--border);
}
.tv-form-label {
  display: block;
  margin-bottom: 6px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--text-2);
}
.tv-form .tv-form-foot {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 10px;
}
.tv-form .tv-form-foot .muted { font-size: 12px; margin-right: auto; }

.tv-hint {
  padding: 10px 14px;
  border-radius: 8px;
  background: #fffbeb;
  border-left: 3px solid #f59e0b;
  font-size: 12.5px;
  color: #92400e;
}

/* 工单信息（整行卡片，宽屏分栏排布） */
.tv-info { display: flex; flex-direction: column; gap: 0; }
.tv-grid-single { grid-template-columns: 1fr; }

.tv-info-card .tv-info {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 32px;
}
.tv-info-card .tv-info > div,
.tv-info-card .tv-info > div:last-child { padding: 8px 0; border-bottom: 1px dashed var(--border); }
.tv-info-card .tv-info > div:nth-last-child(-n+2) { border-bottom: none; }
.tv-info-card .tv-rate-show {
  margin-top: 10px;
  flex-direction: row;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.tv-info-card .tv-rate-show .stars { font-size: 14px; }

@media (max-width: 1023px) {
  .tv-info-card .tv-info { grid-template-columns: 1fr; }
  .tv-info-card .tv-info > div:nth-last-child(-n+2) { border-bottom: 1px dashed var(--border); }
  .tv-info-card .tv-info > div:last-child { border-bottom: none; }
}

@media (max-width: 767px) {
  .tv-info-card .tv-rate-show { flex-direction: column; align-items: flex-start; gap: 4px; }
}
.tv-info > div {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 7px 0;
  border-bottom: 1px dashed var(--border);
  font-size: 12.5px;
  line-height: 1.5;
}
.tv-info > div:last-child { border-bottom: none; }
.tv-info .muted { flex: 0 0 84px; }
.tv-info b { font-weight: 600; color: var(--text); word-break: break-word; }

.tv-rate-show {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px dashed var(--border);
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 12.5px;
}
.tv-rate-show .stars { color: #f59e0b; font-size: 15px; letter-spacing: 1px; }

/* 沟通附件 */
.tf-files { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.tf-file {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 100%;
  padding: 5px 9px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #fff;
  font-size: 12px;
  color: var(--text-2);
  text-decoration: none;
}
.tf-file:hover { border-color: var(--primary); color: var(--primary); background: var(--primary-light); }
.tf-file-ico { flex-shrink: 0; }
.tf-file-name {
  max-width: 190px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 500;
  color: inherit;
  text-decoration: none;
  cursor: pointer;
}
.tf-file-name:hover { color: var(--primary); text-decoration: underline; }
.tf-file-size { color: var(--text-3); flex-shrink: 0; }
.tf-file-act {
  flex-shrink: 0;
  padding-left: 7px;
  border-left: 1px solid var(--border);
  color: var(--primary);
  font-size: 12px;
  text-decoration: none;
  cursor: pointer;
}
.tf-file-act:hover { text-decoration: underline; }

.tf-upload {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 8px;
}
.tf-upload .hint { margin: 0; }
.tf-upload-btn { cursor: pointer; margin: 0; }
.tf-upload-list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  list-style: none;
  margin: 0;
  padding: 0;
  width: 100%;
}
.tf-upload-list:empty { display: none; }
.tf-upload-list li {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 100%;
  padding: 4px 8px;
  border-radius: 6px;
  background: #f2f4f7;
  font-size: 12px;
  color: var(--text-2);
}
.tf-upload-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 240px; }
.tf-upload-clear {
  border: 0;
  background: none;
  padding: 1px 3px;
  font-size: 12px;
  color: var(--primary);
  cursor: pointer;
}
.tf-upload-clear:hover { text-decoration: underline; }

/* 五星评价 */
.rate-chips { display: flex; flex-direction: column; gap: 6px; margin-bottom: 10px; }
.rate-chip {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 11px;
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 12.5px;
  color: var(--text-2);
  cursor: pointer;
}
.rate-chip input { accent-color: var(--primary); }
.rate-chip:has(input:checked) {
  border-color: var(--primary);
  background: var(--primary-light);
  color: var(--primary);
}
.rate-chip span { letter-spacing: 1px; }

@media (max-width: 1023px) {
  .tv-grid { grid-template-columns: 1fr; }
}

@media (max-width: 767px) {
  .chat-item { max-width: 100%; }
  .flow-step { min-width: 0; flex: 1 1 45%; font-size: 12px; }
  .flow-step:not(:last-child)::after { display: none; }
}

/* ===========================================================
  工作台
   =========================================================== */
.wb-hero {
  display: flex;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
  padding: 22px 24px;
  margin-bottom: 16px;
  border-radius: var(--radius);
  background: linear-gradient(135deg, #1e3a8a 0%, #2563eb 58%, #3b82f6 100%);
  color: #fff;
  box-shadow: var(--shadow);
}
.wb-hero .wb-hello { min-width: 0; flex: 1; }
.wb-hero h2 { margin: 0 0 6px; font-size: 20px; color: #fff; }
.wb-hero .wb-sub { font-size: 12.5px; color: rgba(255, 255, 255, .78); }
.wb-hero .wb-focus {
  margin-top: 10px;
  font-size: 13px;
  line-height: 1.6;
  color: rgba(255, 255, 255, .92);
  background: rgba(255, 255, 255, .12);
  border-left: 3px solid rgba(255, 255, 255, .55);
  border-radius: 0 8px 8px 0;
  padding: 6px 12px;
  display: inline-block;
}
.wb-hero .wb-kpis { display: flex; gap: 10px; flex-wrap: wrap; margin-left: auto; }
.wb-kpi {
  min-width: 84px;
  padding: 8px 14px;
  text-align: center;
  border-radius: 10px;
  background: rgba(255, 255, 255, .14);
  border: 1px solid rgba(255, 255, 255, .18);
}
.wb-kpi b { display: block; font-size: 20px; font-weight: 700; line-height: 1.25; }
.wb-kpi span { font-size: 11.5px; color: rgba(255, 255, 255, .8); }
.wb-kpi.alert { background: rgba(254, 226, 226, .22); border-color: rgba(254, 202, 202, .45); }
.wb-kpi.alert b { color: #ffe4e6; }

.wb-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}
.wb-col { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.wb-col > .card { margin-bottom: 0; }

.wb-list { display: flex; flex-direction: column; }
.wb-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 18px;
  border-bottom: 1px solid var(--border);
  color: var(--text);
  text-decoration: none;
}
.wb-item:last-child { border-bottom: none; }
.wb-item:hover { background: #f8fafc; color: var(--text); }
.wb-item .bar-strip {
  width: 3px;
  align-self: stretch;
  border-radius: 3px;
  background: var(--border);
  flex-shrink: 0;
}
.wb-item.p-high .bar-strip { background: var(--warning); }
.wb-item.p-overdue .bar-strip { background: var(--danger); }
.wb-item.p-approval .bar-strip { background: var(--info); }
.wb-item .wb-main { flex: 1; min-width: 0; }
.wb-item .t {
  display: block;
  font-weight: 600;
  font-size: 13.5px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.wb-item .meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
  margin-top: 4px;
  font-size: 12px;
  color: var(--text-3);
}
.wb-item .wb-side { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.wb-days {
  font-size: 11.5px;
  color: #b91c1c;
  background: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: 999px;
  padding: 1px 8px;
  white-space: nowrap;
}
.wb-more { padding: 10px 18px 12px; font-size: 12.5px; border-top: 1px solid var(--border); }

.wb-quick { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.wb-quick a {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 13px 6px;
  border: 1px solid var(--border);
  border-radius: 10px;
  color: var(--text-2);
  font-size: 12.5px;
  text-align: center;
}
.wb-quick a:hover { border-color: var(--primary); color: var(--primary); background: var(--primary-light); }
.wb-quick .i { font-size: 18px; line-height: 1; }
.wb-quick .n {
  position: absolute;
  top: 6px;
  right: 6px;
  min-width: 17px;
  height: 17px;
  padding: 0 4px;
  border-radius: 999px;
  background: var(--danger);
  color: #fff;
  font-size: 10.5px;
  line-height: 17px;
  text-align: center;
}

@media (max-width: 1023px) {
  .wb-grid { grid-template-columns: 1fr; }
  .wb-hero { padding: 18px; }
  .wb-hero .wb-kpis { margin-left: 0; width: 100%; }
}

@media (max-width: 767px) {
  .wb-hero h2 { font-size: 17px; }
  .wb-hero .wb-kpis { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wb-kpi { min-width: 0; padding: 7px 10px; }
  .wb-item { padding: 11px 14px; gap: 9px; flex-wrap: wrap; }
  .wb-item .t { white-space: normal; }
  .wb-item .wb-side { margin-left: 15px; }
  .wb-quick { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* ===========================================================
  响应式：平板
   =========================================================== */
@media (max-width: 1023px) {
  :root { --sidebar-w: 200px; }
  .grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .grid-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .content { padding: 16px; }
  .form-row.cols-3, .form-row.cols-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .table th, .table td { padding: 10px 11px; }
}

/* ===========================================================
   响应式：手机
   =========================================================== */
@media (max-width: 767px) {
  body { font-size: 13.5px; }
  .sidebar { transform: translateX(-100%); width: 250px; box-shadow: var(--shadow-lg); }
  .sidebar.open { transform: translateX(0); }
  .main { margin-left: 0; padding-bottom: 62px; }
  .menu-toggle { display: grid; place-items: center; }
  .topbar { padding: 0 12px; gap: 8px; }
  .topbar .page-title { font-size: 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .user-chip .uname { display: none; }
  .user-chip { padding: 4px 8px 4px 4px; gap: 4px; }
  .user-panel { width: min(280px, calc(100vw - 24px)); }
  .content { padding: 12px; }
  .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; }
  .form-row.cols-2, .form-row.cols-3, .form-row.cols-4 { grid-template-columns: 1fr; }
  .card-body { padding: 14px; }
  .card-head { padding: 12px 14px; }
  .stat { padding: 13px 14px; }
  .stat .num { font-size: 19px; }
  .tabbar { display: flex; }
  h1 { font-size: 19px; }

  /* 表格转卡片 */
  .table-mobile thead { display: none; }
  .table-mobile tbody tr {
    display: block;
    border: 1px solid var(--border);
    border-radius: 10px;
    margin-bottom: 10px;
    padding: 6px 0;
    background: #fff;
  }
  .table-mobile tbody td {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    border: none;
    padding: 6px 14px;
    text-align: right;
  }
  .table-mobile tbody td::before {
    content: attr(data-label);
    color: var(--text-3);
    font-size: 12.5px;
    text-align: left;
    flex-shrink: 0;
  }
  /* 操作列：标签左、按钮右 */
  .table-mobile tbody td.actions {
    align-items: center;
    flex-wrap: wrap;
    padding-top: 8px;
  }
  .table-mobile tbody td.actions .row-actions {
    justify-content: flex-end;
    flex-wrap: wrap;
  }
  .table-mobile tbody td.actions a,
  .table-mobile tbody td.actions button { margin-right: 0; }
  .bar-row { grid-template-columns: 84px 1fr 46px; font-size: 12px; }
  .pager { padding: 12px; }
  .search { width: 100%; }
  .search input[type="text"] { flex: 1; min-width: 0; }
  .card-head .tabs { width: 100%; overflow-x: auto; flex-wrap: nowrap; }
  .card-head .tabs .tab { white-space: nowrap; }
  .tl-body { font-size: 12.5px; }
  .pager-info { width: 100%; margin-bottom: 6px; }
  .btn { padding: 10px 14px; }
}

/* 数据分析 */
.chart-cols { display: flex; gap: 8px; align-items: flex-end; height: 190px; padding: 6px 2px 0; }
.chart-cols .col { flex: 1; min-width: 0; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; gap: 6px; }
.chart-cols .bars { display: flex; gap: 3px; align-items: flex-end; justify-content: center; width: 100%; height: 100%; }
.chart-cols .bars > i { display: block; width: 7px; min-height: 2px; border-radius: 3px 3px 0 0; background: #2563eb; }
.chart-cols .bars > i.q { background: #0891b2; }
.chart-cols .bars > i.a { background: #16a34a; }
.chart-cols .lbl { font-size: 11px; color: var(--text-3); white-space: nowrap; }
.chart-legend { display: flex; gap: 14px; flex-wrap: wrap; font-size: 12px; color: var(--text-2); }
.chart-legend i { display: inline-block; width: 9px; height: 9px; border-radius: 2px; margin-right: 5px; vertical-align: middle; }
.funnel { display: flex; flex-direction: column; gap: 12px; }
.funnel .row { display: grid; grid-template-columns: 78px 1fr 96px; gap: 10px; align-items: center; font-size: 13px; }
.funnel .row > span:first-child { color: var(--text-2); }
.funnel .track { height: 26px; background: #eef2f7; border-radius: 6px; overflow: hidden; }
.funnel .track > i { display: block; height: 100%; border-radius: 6px; background: linear-gradient(90deg, #60a5fa, #2563eb); }
.funnel .num { text-align: right; font-variant-numeric: tabular-nums; color: var(--text-2); }
.kpi-sub { display: block; margin-top: 3px; font-size: 12px; color: var(--text-3); }
.kpi-sub.up { color: var(--success); }
.kpi-sub.down { color: #b91c1c; }

/* 数据分析分组标题 */
.an-sec { display: flex; align-items: baseline; gap: 10px; margin: 22px 0 10px; }
.an-sec::before { content: ''; width: 3px; height: 15px; border-radius: 2px; background: var(--primary); align-self: center; }
.an-sec h4 { margin: 0; font-size: 15px; font-weight: 600; color: var(--text-1, #0f172a); }
.an-sec span { font-size: 12px; color: var(--text-3); }
.an-sec:first-of-type { margin-top: 16px; }

/* ============================================================
   通用小件（知识库等模块复用）
   ============================================================ */
.inline { display: inline; }
.inline-check { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: #475569; cursor: pointer; }
.form-actions { display: flex; gap: 8px; margin-top: 16px; }
.tag-success { background: #dcfce7; color: #15803d; }
.tag-warning { background: #fef3c7; color: #b45309; }
.tag-ghost { background: #f1f5f9; color: #64748b; }
.link-x { border: 0; background: transparent; color: #94a3b8; cursor: pointer; font-size: 14px; line-height: 1; padding: 0 2px; }
.link-x:hover { color: var(--danger); }
.file-ext { display: inline-block; min-width: 38px; padding: 1px 5px; margin-right: 6px; border-radius: 4px; background: #f1f5f9; color: #64748b; font-size: 11px; text-align: center; }
/* 附件行的「预览」按钮：与文件名同行、比正文轻一档，避免和「下载」抢视线 */
.file-pv { margin-left: 8px; padding: 0; border: 0; background: none; color: var(--primary);
  font-size: 12px; line-height: 1.4; cursor: pointer; }
.file-pv:hover { text-decoration: underline; }

/* ============================================================
   知识库 · 列表
   ============================================================ */
.kb-layout { display: grid; grid-template-columns: 236px minmax(0, 1fr); gap: 16px; align-items: start; }
.kb-side { position: sticky; top: calc(var(--header-h) + 16px); }
.kb-cats { display: flex; flex-direction: column; gap: 2px; padding: 8px; }
.kb-cat { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 10px; border-radius: 8px; color: var(--text); font-size: 14px; text-decoration: none; }
.kb-cat:hover { background: #f1f5f9; }
.kb-cat.active { background: var(--primary-light); color: var(--primary); font-weight: 600; }
.kb-cat-num { font-size: 12px; color: #94a3b8; }
.kb-cat.active .kb-cat-num { color: var(--primary); }
.kb-search { display: flex; gap: 6px; align-items: center; }
.kb-search input[type=search] { width: 220px; }
.kb-list { display: flex; flex-direction: column; }
.kb-item { display: block; padding: 14px 4px; border-bottom: 1px solid var(--border); text-decoration: none; color: inherit; }
.kb-item:last-child { border-bottom: none; }
.kb-item:hover .kb-item-title { color: var(--primary); }
.kb-item-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.kb-item-title { font-size: 15px; font-weight: 600; color: var(--text); }
.kb-item-sum { margin: 6px 0; color: #64748b; font-size: 13px; line-height: 1.65;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.kb-item-meta { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; font-size: 12px; color: #94a3b8; }

/* ============================================================
   知识库 · 详情
   ============================================================ */
.kb-crumb { display: flex; align-items: center; gap: 8px; font-size: 13px; color: #64748b; margin-bottom: 12px; }
.kb-crumb a { color: var(--primary); text-decoration: none; }
.kb-crumb .sep { color: #cbd5e1; }
.kb-doc-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.kb-doc-title { margin: 0 0 8px; font-size: 22px; font-weight: 600; }
.kb-meta { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; font-size: 12px; color: #94a3b8; }
.kb-doc-actions { display: flex; gap: 8px; align-items: center; }
/* 预览型附件（图片/PDF）：只读标识与内嵌预览 */
.kb-ro-tag { background: #f2f3f5; color: #86909c; }
.kb-ro-act { display: inline-flex; align-items: center; height: 28px; padding: 0 12px; border-radius: 6px;
  background: #f2f3f5; color: #86909c; font-size: 12.5px; cursor: default; }
.kb-ro-note { display: flex; align-items: center; gap: 8px; margin-top: 18px; padding: 10px 14px;
  border: 1px solid #e9ebef; border-radius: 8px; background: #f7f8fa; color: #646a73; font-size: 13px; }
.kb-ro-note-ico { flex: none; width: 15px; height: 15px; fill: none; stroke: #86909c; stroke-width: 1.8;
  stroke-linecap: round; stroke-linejoin: round; }
.kb-ro-note-t { flex: 1 1 auto; min-width: 0; }
.kb-ro-embed { margin-top: 16px; border: 1px solid var(--border); border-radius: 10px; overflow: hidden;
  background: #f7f8fa; }
.kb-ro-embed--pdf { height: 78vh; min-height: 420px; }
.kb-ro-embed--pdf iframe { display: block; width: 100%; height: 100%; border: 0; background: #fff; }
.kb-ro-embed--img { display: flex; align-items: center; justify-content: center; padding: 16px; }
.kb-ro-embed--img img { display: block; max-width: 100%; height: auto; border-radius: 6px; background: #fff; }
.kb-content { margin-top: 18px; font-size: 14.5px; line-height: 1.85; color: #1e293b; word-break: break-word; }
.kb-sub { margin: 0 0 8px; font-size: 13px; font-weight: 600; color: #475569; }
.kb-files { margin-top: 20px; padding-top: 14px; border-top: 1px solid var(--border); }
.kb-collab { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--border); }
.kb-members { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.kb-members .tag { display: inline-flex; align-items: center; gap: 4px; }
.kb-share-form { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 12px; }
.kb-share-form input[type=text] { width: 180px; }
.kb-share-url { display: flex; gap: 8px; align-items: center; margin-top: 8px; }
.kb-share-url input { flex: 1 1 auto; }

/* 正文排版：详情展示与编辑器共用 */
.kb-content h1, .kb-editor h1 { font-size: 22px; margin: 20px 0 10px; }
.kb-content h2, .kb-editor h2 { font-size: 18px; margin: 18px 0 8px; }
.kb-content h3, .kb-editor h3 { font-size: 16px; margin: 16px 0 8px; }
.kb-content p, .kb-editor p { margin: 0 0 10px; }
.kb-content ul, .kb-editor ul, .kb-content ol, .kb-editor ol { margin: 0 0 12px; padding-left: 22px; }
.kb-content li, .kb-editor li { margin: 4px 0; }
.kb-content blockquote, .kb-editor blockquote { margin: 12px 0; padding: 8px 14px; border-left: 3px solid var(--primary); background: #f8fafc; color: #475569; }
.kb-content pre, .kb-editor pre { margin: 12px 0; padding: 12px 14px; background: #0f172a; color: #e2e8f0; border-radius: 8px; overflow-x: auto; font-size: 13px; line-height: 1.6; }
.kb-content code, .kb-editor code { font-family: ui-monospace, Consolas, monospace; font-size: .92em; }
.kb-content img, .kb-editor img { max-width: 100%; height: auto; border-radius: 8px; margin: 8px 0; }
.kb-content a, .kb-editor a { color: var(--primary); }
.kb-content table, .kb-editor table { border-collapse: collapse; margin: 12px 0; width: 100%; }
.kb-content th, .kb-editor th, .kb-content td, .kb-editor td { border: 1px solid var(--border); padding: 6px 10px; text-align: left; }
.kb-content th, .kb-editor th { background: #f8fafc; font-weight: 600; }
.kb-content hr, .kb-editor hr { border: 0; border-top: 1px solid var(--border); margin: 18px 0; }

/* ============================================================
   知识库 · 编辑
   ============================================================ */
.kb-edit-bar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 14px; }
.kb-title-input { flex: 1 1 320px; min-width: 180px; padding: 8px 12px; font-size: 18px; font-weight: 600;
  border: 1px solid transparent; border-radius: 8px; background: transparent; color: var(--text); }
.kb-title-input:hover { border-color: var(--border); }
.kb-title-input:focus { outline: none; border-color: var(--primary); background: var(--card); }
.kb-save-hint { font-size: 12px; color: #94a3b8; }
.kb-edit-grid { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 16px; align-items: start; }
.kb-editor-card { overflow: hidden; }
.kb-toolbar { display: flex; flex-wrap: wrap; gap: 2px; padding: 8px 10px; border-bottom: 1px solid var(--border); }
.kb-toolbar button { border: 0; background: transparent; border-radius: 6px; padding: 5px 8px;
  font-size: 13px; color: #475569; cursor: pointer; line-height: 1.2; }
.kb-toolbar button:hover { background: #f1f5f9; color: var(--text); }
.kb-tb-sep { width: 1px; background: var(--border); margin: 4px 6px; }
.kb-editor { min-height: 460px; padding: 20px 24px; outline: none; font-size: 14.5px; line-height: 1.85; color: #1e293b; }
.kb-editor:empty::before { content: attr(data-placeholder); color: #cbd5e1; }
.kb-attr .card-body { display: flex; flex-direction: column; gap: 14px; }
.kb-attr-tip { padding-top: 10px; border-top: 1px dashed var(--border); font-size: 12px; }
.kb-attr-tip p { margin: 0 0 4px; }
.kb-attach { margin-top: 16px; }

/* 知识库 · 文档编辑页（钉钉文档式：固定顶栏 + 工具条 + 目录 + 纸面画布 + 侧边设置） */
.kbe-shell { display: flex; flex-direction: column; height: calc(100vh - var(--header-h));
  background: #f2f3f5; color: #1f2329; overflow: hidden; }
@supports (height: 100dvh) {
  .kbe-shell { height: calc(100dvh - var(--header-h)); }
}
.kbe-shell [hidden] { display: none !important; }

/* ---------------- 顶栏 ---------------- */
.kbe-top { flex: none; display: flex; align-items: center; gap: 12px; height: 52px;
  padding: 0 14px; background: #fff; border-bottom: 1px solid #e5e6eb; }
.kbe-icon { flex: none; width: 28px; height: 28px; border-radius: 6px; display: inline-flex;
  align-items: center; justify-content: center; color: #4e5969; font-size: 17px;
  text-decoration: none; transition: background .15s, color .15s; }
.kbe-icon:hover { background: #f2f3f5; color: #1f2329; }
.kbe-top-title { flex: 1 1 auto; display: flex; align-items: center; gap: 8px; min-width: 0; }
.kbe-crumb { flex: none; font-size: 13px; color: #8f959e; }
.kbe-crumb-sep { flex: none; color: #c9cdd4; }
.kbe-docname { min-width: 0; font-size: 14px; font-weight: 600; color: #1f2329;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kbe-badge { flex: none; height: 20px; padding: 0 7px; border-radius: 4px; font-size: 11px;
  line-height: 20px; background: #e8f7ee; color: #23a55a; }
.kbe-badge[data-status="draft"] { background: #fff4e5; color: #d97706; }
.kbe-top-actions { flex: none; display: flex; align-items: center; gap: 8px; }

.kbe-savestate { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 8px;
  border-radius: 4px; font-size: 12px; color: #8f959e; white-space: nowrap;
  font-variant-numeric: tabular-nums; }
.kbe-savestate-dot { width: 6px; height: 6px; border-radius: 50%; background: #23a55a; }
.kbe-savestate[data-state="pending"] { color: #d97706; }
.kbe-savestate[data-state="pending"] .kbe-savestate-dot { background: #f5a524; }
.kbe-savestate[data-state="saving"] { color: var(--primary); }
.kbe-savestate[data-state="saving"] .kbe-savestate-dot { background: var(--primary);
  animation: kbe-pulse 1s ease-in-out infinite; }
.kbe-savestate[data-state="error"] { color: #f54a45; cursor: pointer; }
.kbe-savestate[data-state="error"] .kbe-savestate-dot { background: #f54a45; }
@keyframes kbe-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .25; } }

.kbe-btn { flex: none; height: 32px; padding: 0 14px; border-radius: 6px; border: 1px solid #dee0e3;
  background: #fff; color: #1f2329; font-size: 13px; line-height: 30px; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  transition: background .15s, border-color .15s, color .15s; }
.kbe-btn:hover { background: #f5f6f7; border-color: #c9cdd4; }
.kbe-btn-ghost.is-on { background: #eef4ff; border-color: #bcd0ff; color: var(--primary); }
.kbe-btn-primary { background: var(--primary); border-color: var(--primary); color: #fff; }
.kbe-btn-primary:hover { background: #1d4ed8; border-color: #1d4ed8; color: #fff; }

/* ---------------- 工具条 ---------------- */
.kbe-toolbar { flex: none; display: flex; align-items: center; gap: 8px; height: 44px;
  padding: 0 12px; background: #fff; border-bottom: 1px solid #e5e6eb; }
.kbe-toolbar-scroll { flex: 1 1 auto; display: flex; align-items: center; gap: 2px;
  min-width: 0; overflow-x: auto; scrollbar-width: none; }
.kbe-toolbar-scroll::-webkit-scrollbar { height: 0; }
.kbe-tool { flex: none; height: 28px; min-width: 28px; padding: 0 9px; border: 0; border-radius: 5px;
  background: transparent; color: #1f2329; font-size: 13px; cursor: pointer; white-space: nowrap;
  display: inline-flex; align-items: center; justify-content: center;
  transition: background .15s, color .15s; }
.kbe-tool:hover { background: #f2f3f5; }
.kbe-tool.is-on { background: #eef4ff; color: var(--primary); }
.kbe-sep { flex: none; width: 1px; height: 16px; margin: 0 5px; background: #e5e6eb; }
.kbe-block-select { flex: none; width: auto; min-width: 88px; height: 28px; padding: 0 6px;
  border: 1px solid #e5e6eb; border-radius: 5px; background: #fff; color: #1f2329;
  font-size: 13px; cursor: pointer; }
.kbe-toolbar-end { flex: none; font-size: 12px; color: #8f959e; font-variant-numeric: tabular-nums; }

/* ---------------- 提示条 ---------------- */
.kbe-alert { flex: none; padding: 9px 18px; background: #fff4e5; border-bottom: 1px solid #ffe0b2;
  color: #a05a00; font-size: 13px; }

/* ---------------- 主体 ---------------- */
.kbe-main { flex: 1 1 auto; display: flex; min-height: 0; }

.kbe-outline { flex: none; width: 224px; display: none; flex-direction: column;
  background: #fff; border-right: 1px solid #e5e6eb; }
.kbe-outline.is-open { display: flex; }
.kbe-outline-hd { flex: none; display: flex; align-items: center; justify-content: space-between;
  padding: 12px 12px 6px 16px; font-size: 12px; font-weight: 600; color: #8f959e; }
.kbe-outline-close { border: 0; background: none; color: #8f959e; font-size: 15px;
  cursor: pointer; padding: 2px 6px; border-radius: 4px; }
.kbe-outline-close:hover { background: #f2f3f5; color: #1f2329; }
.kbe-outline-list { flex: 1 1 auto; overflow: auto; padding: 0 8px 14px; }
.kbe-outline-item { display: block; width: 100%; margin-bottom: 1px; padding: 6px 9px;
  border: 0; border-radius: 5px; background: none; color: #4e5969; font-size: 13px;
  line-height: 1.5; text-align: left; cursor: pointer;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kbe-outline-item:hover { background: #f2f3f5; }
.kbe-outline-item.is-on { background: #eef4ff; color: var(--primary); font-weight: 500; }
.kbe-outline-item[data-lv="2"] { padding-left: 22px; font-size: 12.5px; }
.kbe-outline-item[data-lv="3"] { padding-left: 34px; font-size: 12.5px; color: #86909c; }
.kbe-outline-empty { padding: 6px 16px 18px; font-size: 12px; line-height: 1.7; color: #b0b5bd; }

.kbe-canvas { flex: 1 1 auto; min-width: 0; overflow: auto; padding: 20px 20px 18px; }
.kbe-paper { width: 100%; max-width: 880px; margin: 0 auto; padding: 44px 56px 56px;
  background: #fff; border-radius: 8px; box-shadow: 0 1px 3px rgba(31, 35, 41, .06),
  0 8px 24px rgba(31, 35, 41, .06); }

.kbe-title { display: block; width: 100%; padding: 0; border: 0; outline: 0; resize: none;
  min-height: 0; background: transparent; color: #1f2329; font-size: 26px; font-weight: 600;
  line-height: 1.38; letter-spacing: -.01em; font-family: inherit; overflow: hidden; }
.kbe-title::placeholder { color: #c9cdd4; }
/* 标题是文档标题而非表单输入框：去掉全局 focus 光晕，只留光标 */
.kbe-title:focus { box-shadow: none; border-radius: 0; }
.kbe-meta { margin-top: 10px; font-size: 12.5px; color: #8f959e; }
.kbe-meta-dot { margin: 0 6px; color: #c9cdd4; }

.kbe-doc { margin-top: 22px; min-height: 46vh; outline: 0; font-size: 15px; line-height: 1.85;
  color: #1f2329; word-wrap: break-word; caret-color: var(--primary); }
.kbe-doc.is-blank::before { content: attr(data-placeholder); color: #c9cdd4; pointer-events: none; }

/* 正文排版：层级清晰，但只作用于编辑器内 */
.kbe-doc p { margin: 0 0 14px; }
.kbe-doc h1, .kbe-doc h2, .kbe-doc h3, .kbe-doc h4 { margin: 26px 0 12px; font-weight: 600;
  line-height: 1.45; color: #1f2329; scroll-margin-top: 16px; }
.kbe-doc h1 { font-size: 23px; }
.kbe-doc h2 { font-size: 19px; padding-bottom: 6px; border-bottom: 1px solid #eff0f1; }
.kbe-doc h3 { font-size: 16.5px; }
.kbe-doc ul, .kbe-doc ol { margin: 0 0 14px; padding-left: 24px; }
.kbe-doc li { margin: 5px 0; }
.kbe-doc blockquote { margin: 0 0 14px; padding: 10px 16px; border-left: 3px solid var(--primary);
  background: #f7f8fa; border-radius: 0 6px 6px 0; color: #4e5969; }
.kbe-doc pre { margin: 0 0 14px; padding: 14px 16px; border-radius: 8px; background: #f6f7f9;
  border: 1px solid #eceef1; color: #1f2329; font-size: 13px; line-height: 1.7; overflow: auto;
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace; white-space: pre-wrap; }
.kbe-doc code { padding: 1px 5px; border-radius: 4px; background: #f2f3f5; font-size: 13px;
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace; }
.kbe-doc pre code { padding: 0; background: none; }
.kbe-doc a { color: var(--primary); text-decoration: underline; text-underline-offset: 2px; }
.kbe-doc img { max-width: 100%; height: auto; border-radius: 6px; margin: 6px 0; }
.kbe-doc table { width: 100%; margin: 0 0 16px; border-collapse: collapse; font-size: 14px; }
.kbe-doc th, .kbe-doc td { border: 1px solid #dfe2e6; padding: 8px 10px; text-align: left;
  vertical-align: top; }
.kbe-doc th { background: #f7f8fa; font-weight: 600; }
.kbe-doc hr { border: 0; border-top: 1px solid #e5e6eb; margin: 24px 0; }

.kbe-foot { max-width: 880px; margin: 0 auto; padding: 10px 4px 14px; display: flex;
  align-items: center; justify-content: space-between; gap: 12px; font-size: 12px; color: #8f959e; }
.kbe-foot-hint { color: #b0b5bd; }

/* ---------------- 设置抽屉 ---------------- */
.kbe-scrim { position: fixed; inset: 0; z-index: 880; background: rgba(31, 35, 41, .32); }
.kbe-panel { position: fixed; top: 0; right: 0; bottom: 0; z-index: 890; width: 340px;
  max-width: 90vw; display: flex; flex-direction: column; background: #fff;
  box-shadow: -4px 0 24px rgba(31, 35, 41, .12); transform: translateX(102%);
  transition: transform .22s ease; }
.kbe-panel.is-open { transform: translateX(0); }
.kbe-panel-hd { flex: none; display: flex; align-items: center; justify-content: space-between;
  height: 52px; padding: 0 12px 0 18px; border-bottom: 1px solid #e5e6eb;
  font-size: 14px; font-weight: 600; color: #1f2329; }
.kbe-panel-close { border: 0; background: none; color: #8f959e; font-size: 17px; cursor: pointer;
  padding: 4px 8px; border-radius: 5px; }
.kbe-panel-close:hover { background: #f2f3f5; color: #1f2329; }
.kbe-panel-bd { flex: 1 1 auto; overflow: auto; padding: 16px 18px 28px; }
.kbe-field { display: block; margin-bottom: 16px; }
.kbe-field-label { display: block; margin-bottom: 6px; font-size: 13px; color: #4e5969; }
.kbe-field-label em { display: block; margin-top: 3px; font-size: 11.5px; font-style: normal; color: #a8aeb8; }
.kbe-field textarea { width: 100%; padding: 8px 10px; border: 1px solid #dee0e3;
  border-radius: 6px; background: #fff; color: #1f2329; font-size: 13px; font-family: inherit;
  line-height: 1.6; outline: 0; transition: border-color .15s, box-shadow .15s; }
.kbe-field textarea:focus { border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .12); }
.kbe-field textarea { resize: vertical; }
.kbe-check { display: flex; align-items: center; gap: 7px; margin-bottom: 18px;
  font-size: 13px; color: #4e5969; cursor: pointer; }
.kbe-panel-sec { padding-top: 14px; margin-bottom: 14px; border-top: 1px solid #eff0f1; }
.kbe-panel-sec > span { display: block; margin-bottom: 8px; font-size: 12px; font-weight: 600;
  color: #8f959e; }
.kbe-panel-info { margin: 0; padding: 0; list-style: none; }
.kbe-panel-info li { margin-bottom: 5px; font-size: 12.5px; line-height: 1.7; color: #8f959e; }

/* ---------------- 浮动层 ---------------- */
.kbe-pop { position: fixed; z-index: 890; display: flex; align-items: center; gap: 6px;
  width: 360px; max-width: calc(100vw - 24px); padding: 8px; border-radius: 8px;
  background: #fff; box-shadow: 0 4px 6px rgba(31, 35, 41, .06), 0 12px 28px rgba(31, 35, 41, .14); }
.kbe-pop input { flex: 1 1 auto; min-width: 0; height: 30px; padding: 0 9px; border: 1px solid #dee0e3;
  border-radius: 5px; font-size: 13px; color: #1f2329; outline: 0; }
.kbe-pop input:focus { border-color: var(--primary); }
.kbe-pop button { flex: none; height: 30px; padding: 0 11px; border-radius: 5px; border: 1px solid #dee0e3;
  background: #fff; color: #4e5969; font-size: 12.5px; cursor: pointer; }
.kbe-pop button[data-ok] { background: var(--primary); border-color: var(--primary); color: #fff; }

.kbe-slash { position: fixed; z-index: 890; width: 244px; max-height: 300px; overflow: auto;
  padding: 5px; border-radius: 8px; background: #fff;
  box-shadow: 0 4px 6px rgba(31, 35, 41, .06), 0 12px 28px rgba(31, 35, 41, .16); }
.kbe-slash-item { display: flex; align-items: center; justify-content: space-between; gap: 10px;
  width: 100%; padding: 7px 9px; border: 0; border-radius: 5px; background: none;
  color: #1f2329; font-size: 13px; text-align: left; cursor: pointer; }
.kbe-slash-item:hover, .kbe-slash-item.is-on { background: #eef4ff; color: var(--primary); }
.kbe-slash-hint { flex: none; font-size: 11.5px; color: #a8aeb8; }
.kbe-slash-empty { margin: 0; padding: 10px; font-size: 12.5px; color: #a8aeb8; text-align: center; }

.kbe-toast { position: fixed; left: 50%; bottom: 40px; z-index: 950; transform: translate(-50%, 12px);
  padding: 9px 18px; border-radius: 18px; background: rgba(31, 35, 41, .92); color: #fff;
  font-size: 13px; opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s; }
.kbe-toast.is-show { opacity: 1; transform: translate(-50%, 0); }
.kbe-toast.is-ok { background: rgba(35, 165, 90, .95); }
.kbe-toast.is-warn { background: rgba(217, 119, 6, .95); }
body.kbe-noscroll { overflow: hidden; }

/* ---------------- 窄屏 ---------------- */
@media (max-width: 1080px) {
  .kbe-canvas { padding: 12px 12px 0; }
  .kbe-paper { padding: 32px 30px 40px; }
}
@media (max-width: 900px) {
  .kbe-top { height: 50px; gap: 8px; padding: 0 10px; }
  .kbe-hide-sm { display: none; }
  .kbe-crumb, .kbe-crumb-sep { display: none; }
  .kbe-savestate { padding: 0 4px; }
  .kbe-toolbar { height: 42px; padding: 0 8px; }
  .kbe-toolbar-end { display: none; }
  .kbe-main { position: relative; }
  .kbe-outline { position: absolute; top: 0; bottom: 0; left: 0; z-index: 3; width: 78%;
    max-width: 280px; box-shadow: 0 0 24px rgba(31, 35, 41, .16); }
  .kbe-canvas { padding: 10px 10px 0; }
  .kbe-paper { padding: 26px 20px 34px; border-radius: 6px; }
  .kbe-title { font-size: 22px; }
  .kbe-doc { font-size: 15px; line-height: 1.8; }
  .kbe-foot { padding: 8px 4px 12px; }
  .kbe-foot-hint { display: none; }
  .kbe-btn { padding: 0 10px; }
  .kbe-badge { display: none; }
}
@media (max-width: 560px) {
  .kbe-top-actions .kbe-btn-ghost:not(.is-on) { padding: 0 8px; font-size: 12.5px; }
  .kbe-draft-btn { display: none; }
  .kbe-savestate span { display: none; }
  .kbe-doc table { display: block; overflow-x: auto; }
}

/* 知识库列表（参考钉钉文档：左侧操作区 + 右侧标签/筛选/列表） */
.kbv { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 16px; align-items: start; }

.kbv-side { background: var(--card); border: 1px solid var(--border); border-radius: 12px; padding: 14px 12px; }
.kbv-actions { display: flex; flex-direction: column; gap: 10px; margin-bottom: 18px; }

/* 顶栏工具条：新建 / 上传紧邻视图切换图标左侧，同一行、与其它控件等距（8px） */
.kbv-actions--inline { flex-direction: row; align-items: center; gap: 8px; margin: 0; }
.kbv-actions--inline[hidden] { display: none; }
.kbv-actions--inline .kbv-new,
.kbv-actions--inline .kbv-up-toggle { width: auto; height: 30px; padding: 0 12px; font-size: 13px;
  border-radius: 8px; gap: 5px; }
.kbv-actions--inline .kbv-new { box-shadow: 0 2px 6px rgba(37, 99, 235, .18); }
/* 上传任务卡是视口级浮层（固定在右下角），不参与顶栏这一行的排版 */
.kbv-actions--inline .kbv-up { position: relative; }

/* 主操作：实心蓝「新建」+ 下拉菜单（文档 / 文件夹） */
.kbv-newwrap { position: relative; }
.kbv-new { display: flex; align-items: center; justify-content: center; gap: 6px; width: 100%; height: 44px;
  border: 0; border-radius: 10px; background: var(--primary); color: #fff; font-size: 15px; font-weight: 600;
  font-family: inherit; line-height: 1; cursor: pointer;
  transition: background .15s, box-shadow .15s; }
.kbv-new:hover { background: #1d4ed8; box-shadow: 0 5px 14px rgba(37, 99, 235, .24); }
.kbv-new[aria-expanded="true"] { background: #1d4ed8; }
.kbv-dd.kbv-newmenu { width: 240px; }   /* 新建菜单只剩两项，不用和正文同宽 */
.kbv-dd-ico--doc { background: #2f6bff; }
.kbv-dd-ico--folder { background: #6aa8f7; }

/* 上传区：紧贴「新建」下方——一个描边按钮，点开浮层（文件 / 文件夹两项），进度与结果留在按钮下方 */
.kbv-up { position: relative; }
.kbv-up-toggle { display: flex; align-items: center; justify-content: center; gap: 6px; width: 100%; height: 44px;
  padding: 0 12px; border: 1px solid #dfe5ee; border-radius: 10px; background: #fff; color: #2f3641;
  font: inherit; font-size: 15px; font-weight: 500; line-height: 1; cursor: pointer;
  transition: border-color .15s, color .15s, background .15s, box-shadow .15s; }
.kbv-up-toggle:hover:not(:disabled),
.kbv-up-toggle.is-open { border-color: var(--primary); color: var(--primary); background: #f7faff; }
.kbv-up-toggle:disabled { opacity: .55; cursor: not-allowed; }
.kbv-up-cloud { width: 19px; height: 19px; flex: none; fill: none; stroke: currentColor;
  stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }

/* 浮层：由 JS 定位到按钮下方（坐标写内联 left/top），用 fixed 挂在视口上，
   这样 .kbv-main 的 overflow:hidden 不会把它裁掉；高度超视口时自己滚动 */
.kbv-up-menu { position: fixed; left: 0; top: 0; z-index: 60; width: 300px; max-width: calc(100vw - 16px);
  max-height: calc(100vh - 16px); overflow-y: auto; overscroll-behavior: contain;
  padding: 8px; background: var(--card); border: 1px solid #e8ebf0; border-radius: 14px;
  box-shadow: 0 16px 38px rgba(15, 23, 42, .16), 0 2px 8px rgba(15, 23, 42, .06); }
.kbv-up-opt { display: flex; align-items: center; gap: 12px; width: 100%; padding: 9px 10px;
  border: 0; border-radius: 10px; background: none; color: #2f3641;
  font: inherit; font-size: 15px; line-height: 1.2; text-align: left; cursor: pointer;
  transition: background .12s; }
.kbv-up-opt:hover:not(:disabled) { background: #f2f5fa; }
.kbv-up-opt:disabled { opacity: .55; cursor: not-allowed; }
.kbv-up-opt-ico { width: 30px; height: 30px; flex: none; display: inline-flex; align-items: center;
  justify-content: center; border-radius: 8px; color: #fff;
  background: linear-gradient(180deg, #5b9dff, #2f6bff); }
.kbv-up-opt-ico svg { width: 19px; height: 19px; fill: none; stroke: currentColor;
  stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.kbv-up-opt-label { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kbv-up-tip { margin: 9px 6px 2px; padding-top: 8px; border-top: 1px solid #eef1f6;
  font-size: 10.5px; line-height: 1.6; color: #a0a8b5; }
/* ---------------------------------------------------------------------------
   上传任务卡（参考钉钉文档的上传浮窗）
   桌面端：固定在视口右下角，380px 卡片，圆角 14px + 柔和投影；
   移动端：贴底通栏（左右各留 10px、避开 iPhone 安全区），列表自身滚动，
   高度不超过 58vh，保证不遮挡正文核心区域。
   --------------------------------------------------------------------------- */
.kbv-task { position: fixed; right: 20px; bottom: 20px; z-index: 70;
  display: flex; flex-direction: column; width: 380px; max-width: calc(100vw - 32px);
  max-height: calc(100vh - 40px); background: #fff; border-radius: 14px;
  box-shadow: 0 12px 32px rgba(15, 23, 42, .16), 0 2px 8px rgba(15, 23, 42, .07);
  overflow: hidden; animation: kbv-task-in .18s ease-out; }
.kbv-task[hidden] { display: none; }
@keyframes kbv-task-in { from { opacity: 0; transform: translateY(12px) scale(.98); }
  to { opacity: 1; transform: none; } }

.kbv-task-head { display: flex; align-items: center; gap: 10px; padding: 14px 12px 12px 16px; }
.kbv-task-state { position: relative; width: 18px; height: 18px; flex: none;
  display: inline-flex; align-items: center; justify-content: center; }
.kbv-task-spin { width: 18px; height: 18px; border-radius: 50%;
  border: 2px solid #dbe6ff; border-top-color: #2f6bff; animation: kbv-task-rot .8s linear infinite; }
@keyframes kbv-task-rot { to { transform: rotate(360deg); } }
.kbv-task-glyph { display: none; width: 18px; height: 18px; border-radius: 50%;
  align-items: center; justify-content: center; font-size: 11px; font-weight: 700; color: #fff; }
/* 运行中显示转圈，结束后换成结果图标（对勾 / 感叹号） */
.kbv-task[data-state="run"] .kbv-task-glyph { display: none; }
.kbv-task[data-state="run"] .kbv-task-spin { display: block; }
.kbv-task:not([data-state="run"]) .kbv-task-spin { display: none; }
.kbv-task:not([data-state="run"]) .kbv-task-glyph { display: inline-flex; }
.kbv-task[data-state="ok"] .kbv-task-glyph { background: #22c55e; }
.kbv-task[data-state="bad"] .kbv-task-glyph { background: #f59e0b; }

.kbv-task-title { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis;
  white-space: nowrap; font-size: 15.5px; font-weight: 600; color: #1f2329; letter-spacing: .2px; }
.kbv-task-acts { flex: none; display: inline-flex; gap: 2px; }
.kbv-task-btn { width: 28px; height: 28px; padding: 0; border: 0; border-radius: 8px;
  display: inline-flex; align-items: center; justify-content: center;
  background: none; color: #9aa1ac; cursor: pointer; transition: background .12s, color .12s; }
.kbv-task-btn:hover { background: #f2f4f8; color: #1f2329; }
.kbv-task-btn:focus-visible { outline: 2px solid rgba(47, 107, 255, .45); outline-offset: 1px; }
.kbv-task-btn svg { width: 16px; height: 16px; fill: none; stroke: currentColor;
  stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform .16s; }
/* 收起后箭头翻上来，与「展开」语义对应 */
.kbv-task[data-fold="1"] [data-kbv-task-fold] svg { transform: rotate(180deg); }

.kbv-task-body { min-height: 0; border-top: 1px solid #f0f2f5; }
.kbv-task[data-fold="1"] .kbv-task-body { display: none; }
.kbv-task-sum { margin: 0; padding: 11px 16px 8px; font-size: 13px; line-height: 1.5; color: #8a919f; }
.kbv-task-list { margin: 0; padding: 0 6px; list-style: none; max-height: 216px;
  overflow-y: auto; overscroll-behavior: contain; }
.kbv-task-row { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 9px; }
.kbv-task-row:hover { background: #f7f9fc; }
.kbv-task-ico { width: 26px; height: 26px; flex: none; border-radius: 6px;
  display: inline-flex; align-items: center; justify-content: center;
  color: #fff; font-size: 9.5px; font-weight: 700; letter-spacing: .2px;
  background: #94a3b8; }
.kbv-task-ico.is-pdf { background: #e5484d; }
.kbv-task-ico.is-word { background: #2b6cf6; }
.kbv-task-ico.is-excel { background: #12a150; }
.kbv-task-ico.is-ppt { background: #ec6a17; }
.kbv-task-ico.is-txt { background: #7c8cf8; }
.kbv-task-ico.is-img { background: #0ea5a4; }
.kbv-task-ico.is-zip { background: #a855f7; }
.kbv-task-name { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis;
  white-space: nowrap; font-size: 14px; line-height: 1.4; color: #1f2329; }
.kbv-task-meta { flex: none; max-width: 46%; overflow: hidden; text-overflow: ellipsis;
  white-space: nowrap; font-size: 12.5px; color: #a2a8b3; font-variant-numeric: tabular-nums; }
.kbv-task-row.is-bad .kbv-task-meta { color: #d9480f; }
.kbv-task-check { width: 15px; height: 15px; flex: none; fill: none; stroke: #22c55e;
  stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.kbv-task-mini-spin { width: 14px; height: 14px; flex: none; border-radius: 50%;
  border: 1.6px solid #e3e8f0; border-top-color: #2f6bff; animation: kbv-task-rot .8s linear infinite; }
.kbv-task-relink { flex: none; padding: 0; border: 0; background: none; color: var(--primary);
  font: inherit; font-size: 12.5px; line-height: 1.4; cursor: pointer; }
.kbv-task-relink:hover { text-decoration: underline; }
.kbv-task-foot { padding: 2px 16px 6px; }
.kbv-task-foot:empty { display: none; }
.kbv-task-retry { padding: 4px 0; border: 0; background: none; color: var(--primary);
  font: inherit; font-size: 13px; line-height: 1.4; cursor: pointer; }
.kbv-task-retry:hover { text-decoration: underline; }
.kbv-task-retry[hidden] { display: none; }

/* 窄屏：贴底通栏，别在手机右小角挤成一小块；高度受限后列表自己滚 */
@media (max-width: 640px) {
  .kbv-task { left: 10px; right: 10px; bottom: calc(10px + env(safe-area-inset-bottom, 0px));
    width: auto; max-width: none; max-height: 58vh; }
  .kbv-task-head { padding: 12px 10px 10px 14px; }
  .kbv-task-sum { padding: 9px 14px 6px; }
  .kbv-task-list { max-height: 34vh; }
  .kbv-task-name { font-size: 13.5px; }
}

.kbv-ico { width: 17px; height: 17px; flex: none; fill: none; stroke: currentColor;
  stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }

/* 展开/收起过渡：默认透明下沉，加 .is-open 才可见；hidden 仍由 [hidden] 兜底 */
.kbv-dd, .kbv-up-menu {
  opacity: 0; transform: translateY(-4px) scale(.985);
  transition: opacity .14s ease, transform .14s ease;
  pointer-events: none;
}
.kbv-dd.is-open, .kbv-up-menu.is-open {
  opacity: 1; transform: none;
  pointer-events: auto;
}
@media (prefers-reduced-motion: reduce) {
  .kbv-dd, .kbv-up-menu { transition: none; }
}
.kbv-up-menu[hidden] { display: none; }

/* 同上：JS 定位 + fixed，避免被外层 overflow:hidden 裁切，也不越出视口 */
.kbv-dd { position: fixed; left: 0; top: 0; z-index: 60; width: 330px; max-width: calc(100vw - 16px);
  max-height: calc(100vh - 16px); overflow-y: auto; overscroll-behavior: contain;
  padding: 8px; background: var(--card); border: 1px solid #e8ebf0; border-radius: 12px;
  box-shadow: 0 14px 34px rgba(15, 23, 42, .14), 0 2px 8px rgba(15, 23, 42, .06); }
.kbv-dd[hidden] { display: none; }
.kbv-dd-item { display: flex; align-items: center; gap: 10px; width: 100%; height: 44px; padding: 0 8px;
  border: 0; background: none; text-align: left; font: inherit; cursor: pointer;
  border-radius: 9px; color: #2f3641; font-size: 15px; transition: background .15s, color .15s; }
.kbv-dd-item:hover { background: #f4f6fa; color: var(--primary); }
.kbv-dd-item:focus-visible { outline: 2px solid #b9cdfd; outline-offset: 1px; }
.kbv-dd-ico { width: 30px; height: 30px; flex: none; border-radius: 8px; color: #fff;
  display: inline-flex; align-items: center; justify-content: center; }
.kbv-dd-ico svg { width: 17px; height: 17px; fill: none; stroke: currentColor;
  stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

/* 侧栏导航：按参考图统一成浅灰胶囊——#f4f6f9 底、10px 圆角、主色图标 + 深色半粗名称 */
.kbv-nav { display: flex; flex-direction: column; gap: 6px; }
.kbv-nav-item { display: flex; align-items: center; gap: 9px; height: 44px; padding: 0 14px;
  border-radius: 10px; background: #f4f6f9; color: #23282f;
  font-size: 15px; font-weight: 600; transition: background .15s, color .15s; }
.kbv-nav-item:hover { background: #eceff5; }
.kbv-nav-item.is-active { background: #e6efff; color: var(--primary); }
.kbv-nav-ico { width: 17px; height: 17px; flex: none; fill: none; stroke: currentColor;
  stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; color: var(--primary); }
.kbv-nav-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kbv-nav-tip { margin: 10px 8px 0; font-size: 12px; line-height: 1.6; color: #94a3b8; }

/* 侧栏顶级目录（分类文件夹）：与参考图一致——17px 主色实心文件夹 + 名称，不再用 30px 色块 */
.kbv-nav-item--dir { padding: 0 14px; gap: 9px; }
.kbv-nav-folder { width: 17px; height: 17px; flex: none;
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--primary); transition: color .15s; }
.kbv-nav-folder svg { width: 17px; height: 17px; fill: currentColor; stroke: none; }
/* 回收站用的是线性图标，不能按实心填充渲染（与参考图同为描边垃圾桶） */
.kbv-nav-item--trash .kbv-nav-folder svg { fill: none; stroke: currentColor;
  stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }

.kbv-main { background: var(--card); border: 1px solid var(--border); border-radius: 10px; overflow: hidden; }

/* 资料库各页与回收站页统一：主卡内再嵌一张内卡，四周留 20/24/40 白边，形成同一套「外圈」 */
.kbv-page { padding: 20px 24px 40px; }
.kbv-page-card { background: var(--card, #fff); border: 1px solid var(--border, #e5eaf1);
  border-radius: 12px; overflow: hidden; }

/* 标签与搜索/排序优先共用一行，宽度不足时工具条整体换行靠右 */
.kbv-topbar { display: flex; align-items: center; gap: 12px; padding: 12px 16px;
  border-bottom: 1px solid #f0f2f5; flex-wrap: wrap; }
.kbv-tabs { display: flex; gap: 6px; flex: 1 1 auto; min-width: 0;
  overflow-x: auto; scrollbar-width: none; }
.kbv-tabs[hidden] { display: none; }
.kbv-tabs::-webkit-scrollbar { height: 0; }
.kbv-tab { flex: none; display: inline-flex; align-items: center; height: 34px; padding: 0 12px;
  border-radius: 8px; font-size: 14px; color: #5b6472; white-space: nowrap;
  transition: background .15s, color .15s; }
.kbv-tab:hover { background: #f5f7fa; color: #333a45; }
.kbv-tab.is-active { background: #eaf1ff; color: var(--primary); font-weight: 600; }

/* 分类页标题：占住原来「最近」的位置（首页隐藏，改由标签栏占位）。
   尺寸/内边距/图标规格与回收站页的标题胶囊完全相同，两页视觉一致 */
.kbv-curdir { flex: 0 1 auto; display: inline-flex; align-items: center; gap: 9px;
  max-width: 320px; height: 44px; padding: 0 16px; border-radius: 10px;
  background: #f4f6f9; color: #23282f; font-size: 16px; font-weight: 600; }
.kbv-curdir[hidden] { display: none; }
.kbv-curdir-ico { flex: none; color: var(--primary); }
.kbv-curdir-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.kbv-filters { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; margin-left: auto; }
.kbv-select { width: auto; min-width: 84px; height: 30px; border: 1px solid transparent; background: transparent;
  color: #5b6472; font-size: 13px; padding: 0 6px; border-radius: 6px; cursor: pointer; }
.kbv-select:hover, .kbv-select:focus { background: #f4f6f9; border-color: transparent; outline: none; }
.kbv-search input { height: 30px; width: 190px; border: 1px solid transparent; background: #f4f6f9;
  border-radius: 6px; padding: 0 10px; font-size: 13px; transition: background .15s, border-color .15s; }
.kbv-search input:focus { background: var(--card); border-color: var(--primary); outline: none; }

/* 视图切换：列表 / 缩略图（紧贴搜索框左侧） */
.kbv-viewsw { display: inline-flex; align-items: center; gap: 2px; padding: 2px; border-radius: 7px; background: #f4f6f9; }
.kbv-vsw { width: 28px; height: 26px; display: inline-flex; align-items: center; justify-content: center;
  border: 0; border-radius: 5px; background: transparent; color: #98a1ad; cursor: pointer;
  transition: background .15s, color .15s, box-shadow .15s; }
.kbv-vsw:hover { color: #4e5969; }
.kbv-vsw.is-active { background: var(--card); color: var(--primary); box-shadow: 0 1px 2px rgba(16, 24, 40, .1); }
.kbv-vsw:focus-visible { outline: 2px solid var(--primary); outline-offset: 1px; }

.kbv-row { display: grid; grid-template-columns: minmax(0, 1fr) 128px 120px 36px;
  align-items: center; gap: 14px; padding: 0 20px; min-height: 56px;
  border-bottom: 1px solid #f2f4f7; position: relative; }
.kbv-row:last-child { border-bottom: 0; }
.kbv-row:hover { background: #fafbfc; }
.kbv-row--head { min-height: 38px; font-size: 12px; color: #94a3b8; border-bottom-color: #f2f4f7; }
.kbv-row--head:hover { background: transparent; }
.kbv-row-main { display: flex; align-items: center; gap: 12px; min-width: 0; color: var(--text); }
.kbv-doc-thumb { width: 32px; height: 32px; border-radius: 8px; color: #fff; flex: none;
  display: flex; align-items: center; justify-content: center; background: #2f6fed; }
.kbv-doc-thumb--pdf { background: #f2620f; }
/* Office 三件套图标自带渐变磁贴（圆角底板 + 白内板），外层底板留空即可，
   否则彩块套彩块，边框和白色内板会糊成一片 */
.kbv-doc-thumb--doc,
.kbv-doc-thumb--xls,
.kbv-doc-thumb--ppt { background: transparent; }
/* 新建空白文档：青绿底 + 虚线页「+」，与 Word 的蓝底实线页区分 */
.kbv-doc-thumb--newdoc { background: #0f9d8a; }
.kbv-doc-thumb--img { background: #7a5af8; }
.kbv-doc-thumb--video { background: #0e94a6; }
.kbv-doc-thumb--audio { background: #d6336c; }
.kbv-doc-thumb--zip { background: #c48a00; }
.kbv-doc-thumb--code { background: #475569; }
.kbv-doc-thumb--txt { background: #64748b; }
.kbv-row-title { min-width: 0; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kbv-row:hover .kbv-row-title { color: var(--primary); }
.kbv-col-name { display: flex; align-items: center; gap: 6px; min-width: 0; overflow: hidden; }
.kbv-col-owner, .kbv-col-del, .kbv-col-time { font-size: 13px; color: #8a919f; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; }
.kbv-badge { flex: none; font-size: 11px; line-height: 18px; padding: 0 6px; border-radius: 4px;
  background: #f1f5f9; color: #64748b; }
.kbv-badge--top { background: #fff7e6; color: #d48806; }
.kbv-badge--shared { background: #eef4ff; color: #2f6bff; }
/* 预览型附件：图片/PDF 等只读 */
.kbv-badge--pv { background: #f2f3f5; color: #86909c; }
/* 文档分类：与后台「知识库分类」同一份数据 */
.kbv-badge--cat { background: #eef7f0; color: #1f8a4c; }
.kbv-card-badge--cat { background: #eef7f0; color: #1f8a4c; }

/* 列表里的文件夹行：与文档行同结构，只是图标底色更浅 */
.kbv-row--folder { color: inherit; cursor: pointer; }
.kbv-doc-thumb--folder { background: #6aa8f7; }

/* ---------------- 缩略图（网格）视图 ---------------- */
.kbv-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(172px, 1fr));
  gap: 16px; padding: 18px 20px 26px; }
.kbv-grid--msg { display: block; }
.kbv-card { position: relative; display: flex; flex-direction: column; min-width: 0;
  border: 1px solid #eef0f4; border-radius: 10px; background: var(--card);
  transition: border-color .15s, box-shadow .15s; }
.kbv-card:hover { border-color: #dbe6f7; box-shadow: 0 6px 18px rgba(16, 24, 40, .07); }
.kbv-card.is-drop { animation: kbv-drop-pulse 1.6s ease-out; }
.kbv-card-link { display: flex; flex-direction: column; min-width: 0; color: var(--text); }
/* 缩略图区：图片给真图，其余按类型给「纸面 + 大图标」，宽度固定高度一致，栅格才不歪 */
.kbv-card-thumb { position: relative; display: flex; flex-direction: column; align-items: center;
  justify-content: center; gap: 6px; height: 112px; border-radius: 9px 9px 0 0;
  background: #f6f8fb; color: #64748b; overflow: hidden; }
.kbv-card-thumb svg { width: 34px; height: 34px; }
.kbv-card-thumb--pdf { background: #fff4ec; color: #f2620f; }
.kbv-card-thumb--doc { background: #eef4ff; color: #2f6fed; }
.kbv-card-thumb--newdoc { background: #e9f7f4; color: #0f9d8a; }
.kbv-card-thumb--xls { background: #eaf7ef; color: #1a9e4b; }
.kbv-card-thumb--ppt { background: #fdecea; color: #c1351f; }
.kbv-card-thumb--img { background: #f3f0ff; color: #7a5af8; }
.kbv-card-thumb--video { background: #e8f7f9; color: #0e94a6; }
.kbv-card-thumb--audio { background: #fdeef4; color: #d6336c; }
.kbv-card-thumb--zip { background: #fdf6e5; color: #c48a00; }
.kbv-card-thumb--code { background: #f1f5f9; color: #475569; }
.kbv-card-thumb--txt { background: #f2f5f8; color: #64748b; }
.kbv-card-thumb--folder { background: #eef6ff; color: #4f8ef7; }
/* 窄屏下图标略收小，与 12.5px 的标题同高，列表行与网格都不被撑歪 */
@media (max-width: 640px) {
  .kbv-doc-thumb { width: 30px; height: 30px; border-radius: 7px; }
  .kbv-doc-thumb svg { width: 15px; height: 15px; }
  .kbv-card-thumb svg { width: 30px; height: 30px; }
}
/* Office 磁贴是「满版」图形：图标本体就是色块，铺满整个缩略方块，
   与 PDF/图片等类型 32px 的彩色底块视觉尺寸一致；窄屏随方块一起收到 30px */
.kbv-doc-thumb--doc svg,
.kbv-doc-thumb--xls svg,
.kbv-doc-thumb--ppt svg { width: 32px; height: 32px; }
@media (max-width: 640px) {
  .kbv-doc-thumb--doc svg,
  .kbv-doc-thumb--xls svg,
  .kbv-doc-thumb--ppt svg { width: 30px; height: 30px; }
}
.kbv-card-img { display: block; width: 100%; height: 100%; object-fit: cover; }
.kbv-card-ext { font-size: 11px; font-weight: 600; letter-spacing: .04em; color: currentColor;
  opacity: .85; text-transform: uppercase; }
.kbv-card-name { padding: 9px 12px 0; font-size: 13px; line-height: 1.5; color: var(--text);
  overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  min-height: 2.6em; word-break: break-all; }
.kbv-card:hover .kbv-card-name { color: var(--primary); }
.kbv-card-meta { display: flex; align-items: center; gap: 8px; padding: 4px 12px 12px;
  font-size: 12px; color: #98a1ad; }
.kbv-card-owner { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kbv-card-time { flex: none; margin-left: auto; }
.kbv-card-badges { display: flex; flex-wrap: wrap; gap: 4px; padding: 0 12px 10px; }
.kbv-card-badges:empty { display: none; }
.kbv-card-badge { font-size: 11px; line-height: 18px; padding: 0 6px; border-radius: 4px;
  background: #f1f5f9; color: #64748b; }
.kbv-card-badge:first-child:not(:only-child) { background: #fff7e6; color: #d48806; }
/* 卡片上的「更多」：默认藏在右上角，hover / 聚焦时浮出 */
.kbv-card-actions { position: absolute; top: 6px; right: 6px; display: flex; justify-content: flex-end;
  opacity: 0; transition: opacity .15s; }
.kbv-card:hover .kbv-card-actions, .kbv-card-actions:focus-within { opacity: 1; }
.kbv-card-actions .kbv-more { background: rgba(255, 255, 255, .92); color: #6b7280;
  box-shadow: 0 1px 3px rgba(16, 24, 40, .12); }
/* 卡片骨架 */
.kbv-card--skel { padding: 0 0 12px; }
.kbv-skel-thumb { display: block; height: 112px; border-radius: 9px 9px 0 0; background: #eef1f5;
  animation: kbv-pulse 1.2s ease-in-out infinite; }
.kbv-card--skel .kbv-skel-line { margin: 10px 12px 0; height: 10px; border-radius: 4px;
  background: #eef1f5; animation: kbv-pulse 1.2s ease-in-out infinite; }
/* 触屏没有 hover：卡片上的「更多」常驻，否则点不到 */
@media (hover: none) { .kbv-card-actions { opacity: 1; } }
@media (max-width: 640px) {
  .kbv-grid { grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)); gap: 12px; padding: 14px; }
  .kbv-card-thumb { height: 92px; }
  .kbv-card-name { font-size: 12.5px; padding: 8px 10px 0; }
  .kbv-card-meta { padding: 4px 10px 10px; }
  .kbv-card-badges { padding: 0 10px 8px; }
  .kbv-card-actions { opacity: 1; }
}
/* 徽章较多时也不让名称被挤没，至少留出可读宽度 */
.kbv-row--folder .kbv-row-title { min-width: 5em; }

/* 第二行：当前位置的完整路径（首段就是顶级分类，不再有「全部目录」返回入口） */
.kbv-crumb { display: flex; align-items: center; gap: 10px; padding: 9px 20px; font-size: 13px;
  color: #6b7280; background: #fbfcfe; border-bottom: 1px solid #f2f4f7; }
/* 路径段整体可横向滚动：层级再深也不会换行撑破布局；右侧篇数 / 操作按钮固定不动 */
.kbv-crumb-path { display: flex; align-items: center; gap: 6px; flex: 1 1 auto; min-width: 0;
  overflow-x: auto; overflow-y: hidden; white-space: nowrap; scrollbar-width: none; line-height: 20px; }
.kbv-crumb-path::-webkit-scrollbar { width: 0; height: 0; }
.kbv-crumb-path > * { flex: none; }
/* 空间不够时先压中间层级、保住当前层：当前层是「我在哪」，不该被挤掉 */
.kbv-crumb-path > .kbv-crumb-link { flex: 0 1 auto; min-width: 3em; }
.kbv-crumb-path > .kbv-crumb-cur { flex: 0 0 auto; }
/* 中间层级：静默时就是普通文字，悬停才浮出浅底，避免整行花成一片标签 */
.kbv-crumb-link { color: #667085; max-width: 160px; padding: 1px 4px; border-radius: 5px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  transition: color .15s ease, background-color .15s ease; }
.kbv-crumb-link:hover { color: var(--primary); background: #eef2f9; text-decoration: none; }
.kbv-crumb-sep { color: #c7d0dd; font-size: 12px; line-height: 1; flex: none; }
/* 当前层：名字超长时收在自己的省略号里，不会被滚动视口切掉半个字；
   宽度由上面的 .kbv-crumb-path 规则固定为不收缩，空间不够时优先压中间层级 */
.kbv-crumb-cur { display: inline-flex; align-items: center; gap: 5px; min-width: 0; max-width: 260px;
  color: #1f2937; font-weight: 600; }
.kbv-crumb-cur svg { flex: none; color: #64748b; }
.kbv-crumb-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kbv-crumb-count { margin-left: auto; font-size: 12px; color: #9aa3b0; flex: none; }
.kbv-crumb-actions { display: flex; align-items: center; flex: none; }
.kbv-crumb > .kbv-badge { flex: none; }

.kbv-col-actions { position: relative; display: flex; justify-content: flex-end; }
.kbv-more { width: 28px; height: 28px; border: 0; border-radius: 6px; background: transparent;
  color: #9aa3b0; display: flex; align-items: center; justify-content: center; cursor: pointer;
  transition: background .15s, color .15s; }
.kbv-more:hover, .kbv-more[aria-expanded="true"] { background: #eef1f5; color: var(--text); }
/* 列表卡片 overflow:hidden 会裁掉绝对定位的子菜单，这里改用视口定位（坐标由 JS 计算） */
.kbv-menu { position: fixed; z-index: 1100; min-width: 196px;
  max-width: min(280px, calc(100vw - 16px)); max-height: calc(100vh - 24px); overflow-y: auto;
  background: var(--card); border: 1px solid var(--border); border-radius: 10px; padding: 6px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .12); }
.kbv-menu[hidden] { display: none; }
/* 图标 + 文案两段式：图标定宽 20px，所有行的文字起点严格对齐 */
/* font: inherit 让 <button> 与 <a> 用同一套字体，否则按钮走系统 UI 字体，两者并排会错位 */
.kbv-menu-item { display: flex; align-items: center; gap: 12px; width: 100%; height: 42px; padding: 0 8px;
  border: 0; border-radius: 7px; background: transparent; color: var(--text);
  font: inherit; font-size: 14px; text-align: left; cursor: pointer; white-space: nowrap; text-decoration: none; }
.kbv-menu-item:hover { background: #f4f6f9; }
.kbv-menu-item > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.kbv-mi-ico { flex: none; width: 20px; height: 20px; color: #5c6675; transition: color .15s; }
.kbv-menu-item:hover .kbv-mi-ico { color: var(--text); }
/* 收藏：未收藏为空心描边，已收藏填充金色，图标与文案同步切换 */
.kbv-star-ico { display: flex; }
.kbv-star-ico .kbv-mi-ico { color: #98a1ae; }
.kbv-star.is-on .kbv-star-ico .kbv-mi-ico { color: #f2b01e; }
.kbv-star.is-on .kbv-star-ico .kbv-mi-ico path { fill: #f2b01e; }
/* 分组分隔线通栏到菜单边缘，与参考图的分组感一致 */
.kbv-menu-sep { height: 1px; margin: 6px -6px; background: #eef1f5; }
.kbv-menu-item--danger { color: var(--danger); }
.kbv-menu-item--danger .kbv-mi-ico { color: currentColor; }
.kbv-menu-item--danger:hover { background: #fef2f2; }
/* 禁用态（无权限）：置灰 + 不可点 + hover 不高亮。
   菜单项数量 / 顺序 / 分组对任何角色都保持一致，权限差异只在这里体现，
   用户既能看清「有哪些操作」，也能一眼看出「哪些自己做不了」 */
.kbv-menu-item.is-disabled,
.kbv-menu-item:disabled { color: #aeb6c2; cursor: not-allowed; }
.kbv-menu-item.is-disabled:hover,
.kbv-menu-item:disabled:hover { background: transparent; }
.kbv-menu-item.is-disabled .kbv-mi-ico,
.kbv-menu-item:disabled .kbv-mi-ico { color: #c6cdd6; }
.kbv-menu-item--danger.is-disabled,
.kbv-menu-item--danger:disabled { color: #e0b0b0; }
.kbv-menu-item--danger.is-disabled .kbv-mi-ico,
.kbv-menu-item--danger:disabled .kbv-mi-ico { color: #e0b0b0; }

/* 行内菜单操作弹窗 */
.kbv-dlg-mask { position: fixed; inset: 0; z-index: 1200; display: flex; align-items: center;
  justify-content: center; padding: 20px; background: rgba(15, 23, 42, .38); }
.kbv-dlg-mask[hidden] { display: none; }
.kbv-dlg { width: 100%; max-width: 420px; max-height: calc(100vh - 40px); display: flex;
  flex-direction: column; background: var(--card); border-radius: 12px;
  box-shadow: 0 18px 48px rgba(15, 23, 42, .22); }
.kbv-dlg-head { display: flex; align-items: center; gap: 12px; padding: 15px 18px;
  border-bottom: 1px solid #f0f2f5; }
.kbv-dlg-title { flex: 1 1 auto; margin: 0; font-size: 15px; font-weight: 600; color: var(--text); }
.kbv-dlg-x { flex: none; width: 28px; height: 28px; border: 0; border-radius: 6px;
  background: transparent; color: var(--text-2); font-size: 18px; line-height: 1; cursor: pointer; }
.kbv-dlg-x:hover { background: #f4f6f9; color: var(--text); }
.kbv-dlg-body { flex: 1 1 auto; overflow-y: auto; padding: 16px 18px; }
.kbv-dlg-foot { display: flex; justify-content: flex-end; gap: 8px; padding: 12px 18px;
  border-top: 1px solid #f0f2f5; }
.kbv-dlg-tip { margin: 0 0 12px; font-size: 12.5px; line-height: 1.6; color: var(--text-2); }
.kbv-dlg-body .field + .field { margin-top: 12px; }
/* 重命名：输入框只装主体，扩展名作为只读尾巴贴在右侧 */
.kbv-name-edit { display: flex; align-items: stretch; }
/* 通用规则把 input 设成 width:100%，这里必须让位给右侧扩展名尾巴 */
.kbv-name-edit input { flex: 1 1 0; width: auto; min-width: 0; border-top-right-radius: 0; border-bottom-right-radius: 0; }
.kbv-name-edit input:focus { position: relative; z-index: 1; }
.kbv-name-ext {
  display: inline-flex; align-items: center; padding: 0 12px; max-width: 46%;
  border: 1px solid var(--border); border-left: 0; border-radius: 0 8px 8px 0;
  background: #f1f5f9; color: var(--text-2); font-size: 13.5px; line-height: 1;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  user-select: none; cursor: not-allowed;
}
.kbv-dlg-tip.is-warn { color: #b45309; }
/* ---------------------------------------------------------------- 权限管理弹窗 */
.kbv-dlg--perm { max-width: 560px; }
.kbv-dlg-foot:empty { display: none; }
.kbv-perm { display: flex; flex-direction: column; gap: 16px; }
.kbv-perm [hidden] { display: none !important; }
.kbv-perm-block { position: relative; display: flex; flex-direction: column; gap: 8px; }
.kbv-perm-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.kbv-perm-label { display: inline-flex; align-items: center; gap: 5px; font-size: 12.5px; color: var(--text-2); }
.kbv-perm-link { display: inline-flex; align-items: center; gap: 5px; padding: 2px 0; border: 0;
  background: none; color: var(--primary); font-size: 12.5px; cursor: pointer; }
.kbv-perm-link:hover { text-decoration: underline; }
.kbv-perm-list { border: 1px solid var(--border, #e6e9ef); border-radius: 6px; overflow: hidden; }
.kbv-perm-listhead { display: flex; align-items: center; gap: 8px; padding: 6px 10px;
  background: #fafbfd; border-bottom: 1px solid #eef1f6; }
.kbv-perm-checkall { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px;
  color: var(--text-2); cursor: pointer; }
.kbv-perm-checkall input, .kbv-perm-ck input { width: 14px; height: 14px; margin: 0; cursor: pointer; }
.kbv-perm-bulk { border: 0; background: none; padding: 0 2px; color: var(--danger);
  font-size: 12.5px; cursor: pointer; }
.kbv-perm-ico { margin-left: auto; display: inline-flex; align-items: center; justify-content: center;
  width: 24px; height: 24px; border: 0; border-radius: 5px; background: none; color: #8b95a5; cursor: pointer; }
.kbv-perm-ico:hover { background: #eef2f8; color: var(--text); }
.kbv-perm-filter { padding: 6px 10px; border-bottom: 1px solid #eef1f6; background: #fff; }
.kbv-perm-filter input { width: 100%; }
.kbv-perm-rows { max-height: 272px; overflow-y: auto; }
.kbv-perm-group { padding: 7px 12px; background: #fcfdff; font-size: 12px; color: var(--text-2); }
.kbv-perm-row { position: relative; display: flex; align-items: center; gap: 9px; padding: 8px 12px; }
.kbv-perm-row[hidden] { display: none !important; }
.kbv-perm-row + .kbv-perm-row { border-top: 1px solid #f2f4f8; }
.kbv-perm-row--open { background: #f7f9fc; }
.kbv-perm-ck { flex: none; display: inline-flex; align-items: center; }
.kbv-perm-ck--none { width: 14px; height: 14px; }
.kbv-perm-ava { flex: none; width: 30px; height: 30px; border-radius: 6px; display: inline-flex;
  align-items: center; justify-content: center; color: #fff; font-size: 13px; font-weight: 600; }
.kbv-perm-who { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.kbv-perm-name { display: flex; align-items: center; gap: 6px; min-width: 0; font-size: 13px;
  color: var(--text); }
.kbv-perm-nm { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kbv-perm-tag { flex: none; padding: 0 5px; border: 1px solid var(--primary); border-radius: 3px;
  color: var(--primary); font-size: 11px; font-style: normal; line-height: 15px; }
/* 上级所有者：与「本层所有者」区分开，弱化配色 */
.kbv-perm-tag--anc { color: #6b7686; border-color: #ccd5e1; background: #f5f7fb; }
.kbv-perm-row--anc { background: #fbfcfe; }
.kbv-perm-link--danger { color: var(--danger); }
.kbv-perm-link--danger:hover { background: #fdecec; }
.kbv-perm-owneract { flex: none; display: inline-flex; align-items: center; gap: 12px;
  margin-left: auto; }
.kbv-perm-sub { font-size: 11.5px; color: #9aa4b2; overflow: hidden; text-overflow: ellipsis;
  white-space: nowrap; }
.kbv-perm-role { flex: none; display: inline-flex; align-items: center; gap: 3px; padding: 4px 6px;
  border: 0; border-radius: 5px; background: none; color: var(--text-2); font-size: 12.5px; cursor: pointer; }
.kbv-perm-role:hover { background: #eef2f8; color: var(--text); }
.kbv-perm-role--fixed { color: #9aa4b2; cursor: default; }
.kbv-perm-role--fixed:hover { background: none; color: #9aa4b2; }
.kbv-perm-menu { position: absolute; right: 10px; top: calc(100% - 4px); z-index: 6; min-width: 268px;
  padding: 5px; border: 1px solid #e6e9ef; border-radius: 8px; background: #fff;
  box-shadow: 0 12px 28px rgba(15, 23, 42, .14); }
.kbv-perm-menu--fixed { position: fixed; right: auto; bottom: auto; z-index: 1200;
  max-width: calc(100vw - 20px); }
.kbv-perm-mi { display: flex; align-items: center; gap: 9px; width: 100%; padding: 8px 10px;
  border: 0; border-radius: 6px; background: none; color: var(--text); text-align: left; cursor: pointer; }
.kbv-perm-mi:hover { background: #f5f7fb; }
.kbv-perm-mi.is-on { color: var(--primary); }
.kbv-perm-mi-ico { flex: none; display: inline-flex; align-items: center; justify-content: center;
  width: 16px; height: 16px; color: #7f8998; }
.kbv-perm-mi.is-on .kbv-perm-mi-ico { color: var(--primary); }
.kbv-perm-mi--danger .kbv-perm-mi-ico { color: var(--danger); }
.kbv-perm-mi-body { flex: 1 1 auto; display: flex; flex-direction: column; gap: 1px; }
.kbv-perm-mi-t { font-size: 12.8px; }
.kbv-perm-mi-d { font-size: 11px; line-height: 1.45; color: #98a2b3; white-space: nowrap; }
.kbv-perm-menu--owner { position: fixed; z-index: 1200; width: 216px; max-height: 240px;
  overflow-y: auto; }
.kbv-perm-mi-t--head { display: block; padding: 4px 9px 6px; color: #9aa4b2; font-size: 11.5px; }
.kbv-perm-mi--danger { color: var(--danger); }
.kbv-perm-mi--danger:hover { background: #fef2f2; }
.kbv-perm-mi-sep { height: 1px; margin: 4px 6px; background: #f0f2f6; }
.kbv-perm-addrow { display: flex; gap: 8px; }
.kbv-perm-addrow input { flex: 1 1 auto; min-width: 0; }
.kbv-perm-addrow select { flex: 0 0 118px; }
.kbv-perm-addrow .btn { flex: none; }
.kbv-perm-foot { border-top: 1px solid #f0f2f6; padding-top: 10px; }
.kbv-perm-cfg { display: inline-flex; align-items: center; gap: 5px; border: 0; background: none;
  padding: 0; color: var(--text-2); font-size: 12.5px; cursor: pointer; }
.kbv-perm-cfg:hover { color: var(--text); }
.kbv-perm-cfg-caret { display: inline-flex; transition: transform .15s ease; }
.kbv-perm-cfg.is-open { color: var(--text); }
.kbv-perm-cfg.is-open .kbv-perm-cfg-caret { transform: rotate(180deg); }
.kbv-perm-cfgbox { margin-top: 9px; padding: 12px; border-radius: 7px; background: #f8fafc;
  border: 1px solid #eef1f6; }
.kbv-perm-cfgbox[hidden] { display: none !important; }
.kbv-perm-cfgrow { position: relative; display: flex; align-items: center; gap: 10px; }
.kbv-perm-cfgrow-t { font-size: 12.8px; color: var(--text); }
.kbv-perm-select { margin-left: auto; display: inline-flex; align-items: center; gap: 4px;
  max-width: 62%; padding: 5px 9px; border: 1px solid #e2e7ef; border-radius: 6px; background: #fff;
  color: var(--text-2); font-size: 12.4px; cursor: pointer; }
.kbv-perm-select:hover { border-color: var(--primary); color: var(--text); }
.kbv-perm-select span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kbv-perm-cfghelp { margin-top: 10px; padding-top: 10px; border-top: 1px dashed #e6ebf2;
  font-size: 11.8px; line-height: 1.7; color: #98a2b3; }
.kbv-perm-menu--cfg { right: 4px; top: auto; bottom: calc(100% + 4px); min-width: 250px; }
.kbv-perm-help { margin-top: 8px; padding: 9px 11px; border-radius: 6px; background: #f7f9fc;
  font-size: 12px; line-height: 1.65; color: var(--text-2); }
.kbv-perm-empty { padding: 16px 12px; text-align: center; font-size: 12.5px; color: var(--text-2); }
/* 无管理权限时的只读提示：列表头一行说明 + 权限配置下方的补充说明 */
.kbv-perm-listtip { flex: 1 1 auto; min-width: 0; font-size: 11.8px; color: #98a2b3; }
.kbv-perm-note { margin-top: 8px; font-size: 11.8px; line-height: 1.6; color: #98a2b3; }
.kbv-perm-note b { color: var(--text-2); font-weight: 500; }
/* 只读行：不参与选中，视觉上略淡 */
.kbv-perm-row--ro .kbv-perm-nm { color: var(--text-2); }

/* 窄屏：所有者行的「转交」操作换到第二行，避免姓名被压成一个字 */
@media (max-width: 480px) {
  .kbv-perm-row--owner { flex-wrap: wrap; row-gap: 4px; }
  .kbv-perm-row--owner .kbv-perm-who { flex: 1 1 60px; }
  .kbv-perm-owneract { width: 100%; margin-left: 0; justify-content: flex-end; }
}

/* ---------------------------------------------------------------- 添加协作者：选人弹窗 */
.kbv-pk { position: fixed; inset: 0; z-index: 1400; display: flex; align-items: center; justify-content: center; }
.kbv-pk[hidden] { display: none !important; }
.kbv-pk-mask { position: absolute; inset: 0; background: rgba(15, 23, 42, .4); }
.kbv-pk-panel { position: relative; display: flex; width: 920px; max-width: calc(100vw - 48px);
  height: 600px; max-height: calc(100vh - 72px); border-radius: 10px; background: #fff;
  box-shadow: 0 24px 64px rgba(15, 23, 42, .22); overflow: hidden;
  animation: kbv-pk-in .18s ease-out; }
.kbv-pk.is-closing .kbv-pk-panel { animation: kbv-pk-out .14s ease-in forwards; }
.kbv-pk-panel.is-shake { animation: kbv-pk-shake .4s ease; }
@keyframes kbv-pk-in { from { opacity: 0; transform: translateY(8px) scale(.985); }
  to { opacity: 1; transform: none; } }
@keyframes kbv-pk-out { to { opacity: 0; transform: translateY(6px) scale(.99); } }
@keyframes kbv-pk-shake { 10%, 90% { transform: translateX(-4px); } 20%, 80% { transform: translateX(4px); }
  30%, 50%, 70% { transform: translateX(-6px); } 40%, 60% { transform: translateX(6px); } }

.kbv-pk-left { flex: 0 0 320px; min-width: 0; max-width: 340px; display: flex; flex-direction: column;
  background: #fff; }
.kbv-pk-right { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column;
  background: #fafbfc; border-left: 1px solid #f0f1f4; }

.kbv-pk-search { flex: none; position: relative; margin: 14px 16px 4px; color: #b6bcc7; }
.kbv-pk-search-ico { position: absolute; left: 13px; top: 50%; transform: translateY(-50%);
  display: inline-flex; pointer-events: none; }
.kbv-pk-search input { width: 100%; height: 40px; padding: 0 14px 0 38px; border: 1px solid #e6e8eb;
  border-radius: 8px; background: #fff; font-size: 14px; color: var(--text); outline: none;
  transition: border-color .16s, box-shadow .16s; }
.kbv-pk-search input::placeholder { color: #b6bcc7; }
.kbv-pk-search input:focus { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(47, 107, 255, .1); }

.kbv-pk-modes { flex: none; display: flex; gap: 6px; padding: 14px 10px 6px; }
.kbv-pk-mode { flex: 0 0 auto; width: 104px; min-width: 0; display: flex; flex-direction: column; align-items: center;
  gap: 8px; padding: 6px 2px; border: 0; border-radius: 10px; background: none; cursor: pointer; }
.kbv-pk-mode-ico { display: inline-flex; align-items: center; justify-content: center; width: 56px;
  height: 56px; border-radius: 14px; background: #f3f4f7; color: #43474e;
  transition: background .16s, color .16s; }
.kbv-pk-mode-t { font-size: 12px; color: #5b6069; white-space: nowrap; }
.kbv-pk-mode:hover .kbv-pk-mode-ico { background: #e8f0ff; color: var(--primary); }
.kbv-pk-mode.is-on .kbv-pk-mode-ico { background: #e8f0ff; color: var(--primary); }
.kbv-pk-mode.is-on .kbv-pk-mode-t { color: var(--primary); font-weight: 600; }

.kbv-pk-sec { flex: none; display: flex; align-items: center; gap: 4px; padding: 8px 16px 6px;
  min-width: 0; font-size: 12.5px; color: #9196a1; }
.kbv-pk-sec-t { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kbv-pk-sec-h { margin-left: auto; flex: none; color: #b0b5bf; }
.kbv-pk-back { flex: none; display: inline-flex; align-items: center; justify-content: center;
  width: 20px; height: 20px; margin-left: -4px; border: 0; border-radius: 5px; background: none;
  color: #7a808b; cursor: pointer; padding: 0; }
.kbv-pk-back:hover { background: #f1f3f7; color: var(--text); }

.kbv-pk-list { flex: 1 1 auto; min-height: 0; overflow-y: auto; overflow-x: hidden; padding: 0 8px 12px; }
.kbv-pk-row { display: flex; align-items: center; gap: 10px; padding: 8px; border-radius: 8px;
  min-width: 0; overflow: hidden; cursor: pointer; }
.kbv-pk-row:hover { background: #f7f8fa; }
.kbv-pk-row.is-dis { cursor: default; opacity: .55; }
.kbv-pk-row.is-dis:hover { background: none; }
.kbv-pk-check { flex: none; display: inline-flex; align-items: center; justify-content: center;
  width: 18px; height: 18px; border: 1.5px solid #d5d9e0; border-radius: 4px; background: #fff;
  color: #fff; transition: background .12s, border-color .12s; }
.kbv-pk-check.is-on { border-color: var(--primary); background: var(--primary); }
.kbv-pk-ava { flex: none; width: 38px; height: 38px; border-radius: 50%; display: inline-flex;
  align-items: center; justify-content: center; color: #fff; font-size: 14px; font-weight: 600; }
.kbv-pk-ava--sm { width: 26px; height: 26px; font-size: 12px; }
.kbv-pk-who { flex: 1 1 auto; min-width: 0; overflow: hidden; display: flex;
  flex-direction: column; gap: 2px; }
.kbv-pk-name { display: flex; align-items: center; gap: 6px; min-width: 0; font-size: 14px;
  color: var(--text); }
.kbv-pk-nm { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kbv-pk-tag { flex: none; padding: 1px 6px; border-radius: 3px; background: #f1f4f9; color: #97a1b1;
  font-size: 11px; font-style: normal; font-weight: 400; }
.kbv-pk-sub { min-width: 0; font-size: 12px; color: #9aa0aa; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; }
.kbv-pk-dir { display: flex; align-items: center; gap: 10px; padding: 8px; border-radius: 8px;
  min-width: 0; overflow: hidden; cursor: pointer; }
.kbv-pk-dir:hover { background: #f7f8fa; }
.kbv-pk-dir-ico { flex: none; display: inline-flex; align-items: center; justify-content: center;
  width: 38px; height: 38px; border-radius: 10px; background: #f3f4f7; color: #6b7280; }
.kbv-pk-dir-t { flex: 1 1 auto; min-width: 0; font-size: 14px; color: var(--text); overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; }
.kbv-pk-dir-n { flex: none; font-size: 12px; color: #9aa0aa; }
.kbv-pk-dir-c { flex: none; display: inline-flex; color: #c3c8d1; }
.kbv-pk-empty { padding: 40px 16px; text-align: center; font-size: 12.8px; line-height: 1.9;
  color: #9aa0aa; }

.kbv-pk-selhead { flex: none; padding: 18px 20px 12px; font-size: 14px; color: var(--text); }
.kbv-pk-sel { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 0 20px 12px; display: flex;
  flex-wrap: wrap; align-content: flex-start; gap: 10px; }
.kbv-pk-chip { display: inline-flex; align-items: center; gap: 6px; max-width: 100%;
  padding: 4px 7px 4px 4px; border-radius: 6px; background: #eff0f3; }
.kbv-pk-chip-t { max-width: 120px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-size: 13px; color: #33363c; }
.kbv-pk-chip-x { display: inline-flex; align-items: center; justify-content: center; width: 15px;
  height: 15px; padding: 0; border: 0; border-radius: 50%; background: #d8dae0; color: #6b7078;
  cursor: pointer; }
.kbv-pk-chip-x:hover { background: #cfd2d9; color: #40444b; }
.kbv-pk-sel-tip { padding: 24px 4px; font-size: 12.5px; line-height: 1.9; color: #b0b5bf; }

.kbv-pk-ft { flex: none; display: flex; align-items: center; justify-content: flex-end; gap: 10px;
  padding: 12px 20px 18px; }
.kbv-pk-btn { margin-left: auto; min-width: 78px; height: 36px; padding: 0 18px; border: 0;
  border-radius: 18px; background: #f2f3f5; color: #33363c; font-size: 13.5px; cursor: pointer;
  transition: background .16s; }
.kbv-pk-btn:hover { background: #e8e9ec; }
.kbv-pk-btn--pri { margin-left: 0; background: var(--primary); color: #fff; }
.kbv-pk-btn--pri:hover { background: #2f6fe0; }
.kbv-pk-btn--pri:disabled { opacity: .5; cursor: not-allowed; }
body.kbv-pk-open { overflow: hidden; }
.kbv-toast { z-index: 1300; }
.kbv-toast.is-bad { background: rgba(185, 28, 28, .95); }

/* ---------------------------------------------------------------- 「移动到」目录浏览器 */
.kbv-dlg--lg { max-width: 760px; }
.kbv-dlg--lg .kbv-dlg-body { padding: 0; overflow: hidden; }
.kbv-dlg-mask:not([hidden]) .kbv-dlg { animation: kbv-dlg-in .2s ease-out; }
.kbv-dlg-foot--split { justify-content: flex-end; }
.kbv-pick-newbtn { margin-right: auto; display: inline-flex; align-items: center; gap: 6px;
  border: 0; background: none; padding: 0 2px; color: var(--primary); font-size: 13px; cursor: pointer; }
.kbv-pick-newbtn:hover { text-decoration: underline; }

.kbv-mvpick { display: flex; flex-direction: column; height: 452px; }
.kbv-pick-top { display: flex; align-items: center; gap: 10px; padding: 14px 18px 8px; }
.kbv-pick-crumb { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: 6px;
  height: 40px; padding: 0 12px; border: 1px solid #e6eaf1; border-radius: 8px;
  background: #fbfcfe; font-size: 13px; color: #3d4653; overflow: hidden; white-space: nowrap; }
.kbv-pick-org { color: #98a2b3; }
.kbv-pick-link { flex: 0 1 auto; max-width: 160px; border: 0; background: none; padding: 0;
  font-size: 13px; color: #3d4653; cursor: pointer; overflow: hidden; text-overflow: ellipsis;
  white-space: nowrap; transition: color .16s; }
.kbv-pick-link:hover { color: var(--primary); }
.kbv-pick-cur { flex: 0 1 auto; max-width: 50%; color: #1f2733; font-weight: 600;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kbv-pick-sep { flex: none; color: #ccd3de; }
.kbv-pick-search { flex: 0 0 180px; display: flex; align-items: center; gap: 6px;
  height: 40px; padding: 0 10px; border: 1px solid #e6eaf1; border-radius: 8px;
  background: #fbfcfe; color: #98a2b3; transition: border-color .16s, box-shadow .16s; }
.kbv-pick-search:focus-within { border-color: #b9d3ff; box-shadow: 0 0 0 3px rgba(47, 107, 255, .08); }
.kbv-pick-search input { flex: 1 1 auto; min-width: 0; height: 100%; border: 0; outline: none;
  background: none; font-size: 13px; color: var(--text); }

.kbv-pick-recent { display: flex; align-items: center; gap: 8px; padding: 2px 18px 10px;
  font-size: 13px; color: #6b7280; }
.kbv-pick-recent[hidden] { display: none; }
.kbv-pick-recent-label { flex: none; }
.kbv-pick-chip { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 11px;
  border: 0; border-radius: 6px; background: #f2f5fa; color: #2b3441; font-size: 13px; cursor: pointer;
  max-width: 160px; transition: background .18s, transform .18s; }
.kbv-pick-chip span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kbv-pick-chip svg { flex: none; color: #5b9bff; }
.kbv-pick-chip:hover { background: #e7eefb; }
.kbv-pick-chip:active { transform: scale(.97); }

.kbv-pick-main { flex: 1 1 auto; display: flex; gap: 10px; min-height: 0; padding: 0 18px 14px; }
.kbv-pick-side { flex: 0 0 176px; display: flex; flex-direction: column; gap: 2px; padding: 6px;
  background: #fbfcfe; border: 1px solid #f0f3f8; border-radius: 10px; overflow-y: auto; }
.kbv-pick-nav { display: flex; align-items: center; gap: 8px; height: 38px; padding: 0 10px;
  border: 0; border-radius: 8px; background: transparent; color: #3d4653; font-size: 13.5px;
  text-align: left; cursor: pointer; transition: background .2s, color .2s; }
.kbv-pick-nav svg { flex: none; color: #93a0b1; transition: color .2s; }
.kbv-pick-nav span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kbv-pick-nav:hover { background: #f2f6fc; }
.kbv-pick-nav.is-on { background: #e8f0ff; color: #2f6bff; font-weight: 600; }
.kbv-pick-nav.is-on svg { color: #2f6bff; }

.kbv-pick-list { flex: 1 1 auto; min-width: 0; overflow-y: auto; padding: 6px; background: #fff;
  border: 1px solid #f0f3f8; border-radius: 10px; transition: opacity .16s; }
.kbv-pick-list.is-loading { opacity: .5; pointer-events: none; }
.kbv-pick-list.is-in { animation: kbv-pick-in .22s ease-out; }
.kbv-pick-here { display: flex; align-items: center; gap: 8px; height: 38px; padding: 0 10px;
  margin-bottom: 4px; border-radius: 8px; background: #eaf1ff; color: #2f6bff; font-size: 13px; }
.kbv-pick-here-name { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis;
  white-space: nowrap; font-weight: 600; }
.kbv-pick-here-tag { flex: none; font-size: 12px; color: #7fa5e8; }
.kbv-pick-row { display: flex; align-items: center; gap: 10px; height: 44px; padding: 0 10px;
  border-radius: 8px; cursor: pointer; transition: background .16s; }
.kbv-pick-row:hover { background: #f4f7fd; }
.kbv-pick-row.is-muted { cursor: default; opacity: .6; }
.kbv-pick-row.is-muted:hover { background: transparent; }
.kbv-pick-ico { flex: none; display: inline-flex; align-items: center; justify-content: center;
  width: 28px; height: 28px; border-radius: 7px; }
.kbv-pick-ico--folder { background: #eaf2ff; color: #4c8ff5; }
.kbv-pick-ico--doc { background: #f1f3f7; color: #9aa4b2; }
.kbv-pick-name { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis;
  white-space: nowrap; font-size: 13.5px; color: #232a35; }
.kbv-pick-meta { flex: none; font-size: 12px; color: #a3adbb; }
.kbv-pick-enter { flex: none; color: #c8cfda; font-size: 16px; line-height: 1; }
.kbv-pick-empty { padding: 40px 10px; text-align: center; font-size: 13px; color: #9aa4b2; }
/* 移动目标：一级分类与文件夹用同一种行，只多一个「分类」小标 */
.kbv-pick-tag { margin-left: 6px; padding: 0 6px; border-radius: 4px; font-size: 11px;
  line-height: 17px; background: #eef7f0; color: #1f8a4c; }
.kbv-pick-row--cat .kbv-pick-meta { color: #a3adbb; }
.kbv-pick-row--cat:hover { background: #f4f9f5; }
/* 新建的文件夹直接插在父级目录下方，就地重命名 */
.kbv-pick-row.is-sel { background: #eef4ff; }
.kbv-pick-row.is-sel:hover { background: #e8f0ff; }
.kbv-pick-row.is-new { animation: kbv-pick-in .18s ease-out; }
.kbv-pick-row.is-editing { cursor: default; background: #eef4ff; }
.kbv-pick-row.is-editing:hover { background: #eef4ff; }
.kbv-pick-rename { flex: 1 1 auto; min-width: 0; height: 30px; padding: 0 8px;
  border: 1px solid #2f6bff; border-radius: 6px; background: #fff; font-size: 13.5px;
  color: #232a35; outline: none; box-shadow: 0 0 0 2px rgba(47, 107, 255, .12); }
.kbv-pick-act { flex: none; display: inline-flex; align-items: center; justify-content: center;
  width: 26px; height: 26px; padding: 0; border: 0; border-radius: 6px; background: none;
  color: #4b5666; cursor: pointer; transition: background .16s, color .16s; }
.kbv-pick-act:hover { background: #dde8ff; color: #2f6bff; }
.kbv-pick-act.is-cancel { color: #7a8494; }
.kbv-pick-act.is-cancel:hover { background: #eef1f6; color: #3d4653; }

/* 移动完成的收尾动画：元素飞向目标文件夹后淡出；目标行轻微高亮 */
.kbv-row.is-moving-out { position: relative; z-index: 3; pointer-events: none;
  animation: kbv-row-out .3s cubic-bezier(.4, 0, .2, 1) forwards; }
.kbv-row.is-moving-out.is-moving-to { animation-name: kbv-row-to; }
.kbv-row--folder.is-drop { animation: kbv-drop-pulse 1.2s ease-out; }
/* 新建文档后列表里定位到新条目（文件夹与文档行共用同一套脉冲反馈） */
.kbv-row.is-drop { animation: kbv-drop-pulse 1.6s ease-out; }
@keyframes kbv-dlg-in { from { opacity: 0; transform: translateY(10px) scale(.985); } to { opacity: 1; transform: none; } }
@keyframes kbv-pick-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes kbv-row-out { to { opacity: 0; transform: translateX(18px) scale(.98); } }
@keyframes kbv-row-to {
  to { opacity: 0; transform: translate(var(--mv-x, 18px), var(--mv-y, 0)) scale(.7); }
}
@keyframes kbv-drop-pulse { 0% { background: #e8f0ff; } 100% { background: transparent; } }

@media (max-width: 640px) {
  .kbv-dlg { max-width: none; }
  .kbv-perm-addrow { flex-wrap: wrap; }
  .kbv-perm-addrow input { flex: 1 1 100%; }
  .kbv-perm-addrow select { flex: 0 0 96px; }
  .kbv-perm-addrow .btn { flex: 1 1 auto; }
  .kbv-dlg--perm { max-width: none; }
  .kbv-dlg--lg { max-width: none; }
  .kbv-perm-cfgrow { flex-wrap: wrap; }
  .kbv-perm-select { margin-left: 0; max-width: 100%; }
  .kbv-perm-menu--cfg { left: 4px; right: 4px; min-width: 0; }
  .kbv-pk-panel { flex-direction: column; width: calc(100vw - 20px); height: calc(100vh - 24px);
    max-height: none; }
  .kbv-pk-left { flex: 1 1 auto; min-height: 0; max-width: none; }
  .kbv-pk-right { flex: 0 0 44%; min-height: 0; border-left: 0; border-top: 1px solid #f0f1f4; }
  .kbv-pk-search { margin: 12px 12px 2px; }
  .kbv-pk-modes { padding: 10px 6px 4px; }
  .kbv-pk-mode-ico { width: 46px; height: 46px; border-radius: 12px; }
  .kbv-pk-mode-t { font-size: 11.5px; }
  .kbv-pk-sec { padding: 6px 14px 4px; }
  .kbv-pk-list { padding: 0 6px 10px; }
  .kbv-pk-selhead { padding: 12px 14px 8px; font-size: 13px; }
  .kbv-pk-sel { padding: 0 14px 8px; gap: 8px; }
  .kbv-pk-ft { padding: 8px 14px 12px; }
  .kbv-pk-btn { height: 34px; min-width: 70px; padding: 0 14px; }
  .kbv-mvpick { height: auto; }
  .kbv-pick-top { flex-wrap: wrap; }
  .kbv-pick-search { flex: 1 1 100%; }
  .kbv-pick-main { flex-direction: column; }
  .kbv-pick-side { flex: none; flex-direction: row; overflow-x: auto; }
  .kbv-pick-nav { flex: none; }
  .kbv-pick-list { max-height: 320px; min-height: 220px; }
}

.kbv-skel { display: flex; align-items: center; gap: 12px; padding: 0 20px; min-height: 56px;
  border-bottom: 1px solid #f2f4f7; }
.kbv-skel-ico { width: 32px; height: 32px; border-radius: 8px; background: #eef1f5; flex: none;
  animation: kbv-pulse 1.2s ease-in-out infinite; }
.kbv-skel-line { height: 10px; border-radius: 4px; background: #eef1f5;
  animation: kbv-pulse 1.2s ease-in-out infinite; }
.kbv-skel-line--sm { width: 76px; margin-left: auto; }

@keyframes kbv-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: .45; }
}

/* 目录不存在 / 无权限等提示条（列表顶部，随 AJAX 一起刷新） */
.kbv-notice { display: flex; align-items: center; gap: 8px; margin: 0 0 2px; padding: 10px 16px;
  font-size: 13px; color: #8a5a00; background: #fff8e6; border-bottom: 1px solid #f6e3b4; }
.kbv-notice-ico { flex: none; width: 18px; height: 18px; line-height: 18px; text-align: center;
  border-radius: 50%; background: #f0b429; color: #fff; font-size: 12px; font-weight: 700; }

/* 空态：首页 / 分类 / 任意下级文件夹共用同一套样式 */
.kbv-empty { padding: 48px 20px 56px; text-align: center; }
.kbv-empty-art { width: 104px; height: 80px; margin: 0 auto 2px; opacity: .96; }
.kbv-empty-art svg { display: block; width: 100%; height: 100%; }
.kbv-empty-art-folder { fill: #eaf1fb; stroke: #c3d5ee; stroke-width: 1.6; stroke-linejoin: round; }
.kbv-empty-art-paper  { fill: #fff; stroke: #cbd8e8; stroke-width: 1.6; stroke-linejoin: round; }
.kbv-empty-art-fold   { fill: none; stroke: #cbd8e8; stroke-width: 1.6; stroke-linejoin: round; }
.kbv-empty-art-line   { fill: none; stroke: #d9e3f0; stroke-width: 1.8; stroke-linecap: round; }
.kbv-empty-art-plus   { fill: none; stroke: #9dbde6; stroke-width: 1.8; stroke-linecap: round; }
.kbv-empty-title { margin: 8px 0 6px; font-size: 15px; font-weight: 600; color: var(--text); }
.kbv-empty-sub { margin: 0 auto; max-width: 320px; font-size: 13px; line-height: 1.7; color: #94a3b8; }
.kbv-empty-actions { margin-top: 18px; display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; }
.kbv-error { padding: 46px 20px; text-align: center; color: #b45309; font-size: 13px; }
.kbv-error p { margin-bottom: 12px; }
.kbv-pager { padding: 14px 18px; }

/* 知识库页面内的按钮与卡片圆角跟侧栏保持一致的观感 */
.kbv .btn, .kb-upload-wrap .btn, .kbe .btn { border-radius: 9px; }
.kbv .btn-sm, .kb-upload-wrap .btn-sm, .kbe .btn-sm { border-radius: 8px; }

/* 上传文档 */
.kb-upload-wrap { max-width: 880px; margin: 0 auto; }
.kb-upload-drop { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px;
  padding: 34px 20px; border: 2px dashed var(--border); border-radius: 10px; background: #fafbfc;
  cursor: pointer; text-align: center; transition: border-color .15s, background .15s; }
.kb-upload-drop:hover, .kb-upload-drop.dragging { border-color: var(--primary); background: #f5f8ff; }
.kb-upload-drop.has-file { border-style: solid; border-color: var(--primary); }
.kb-upload-drop input[type="file"] { display: none; }
.kb-upload-icon { font-size: 26px; line-height: 1; color: var(--primary); }
.kb-upload-title { font-size: 14px; color: var(--text); }
.kb-upload-sub { font-size: 12px; color: #94a3b8; max-width: 520px; line-height: 1.6; }
.kb-upload-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 18px; }
.kb-upload-foot { display: flex; gap: 8px; padding: 12px 16px; border-top: 1px solid var(--border); }
.kb-upload-drop.has-warn { border-color: #f0b429; background: #fffdf5; }
.kb-upload-sub.is-warn { color: #b45309; }

.kb-up-rules { margin: 16px 0 0; padding: 12px 14px 12px 30px; border-radius: 8px; background: #f8fafc;
  border: 1px solid #eef0f4; font-size: 12px; line-height: 1.9; color: #64748b; }
.kb-up-rules li { margin: 0; }
.kb-up-rules b { color: #475569; font-weight: 600; }

@media (max-width: 640px) {
  .kb-upload-fields { grid-template-columns: minmax(0, 1fr); }
}

/* 知识库列表响应式 */
@media (max-width: 1080px) {
  .kbv { grid-template-columns: 178px minmax(0, 1fr); }
  .kbv-row { grid-template-columns: minmax(0, 1fr) 110px 104px 36px; gap: 10px; padding: 0 16px; }
}

@media (max-width: 900px) {
  .kbv { display: block; }
  .kbv-side { display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
    padding: 12px; margin-bottom: 12px; }
  .kbv-actions { flex-direction: row; gap: 8px; margin-bottom: 0; flex: 1 1 100%; }
  .kbv-new { height: 40px; font-size: 14px; }
  .kbv-newwrap { flex: 1 1 0; }
  .kbv-menu { left: auto; right: 0; min-width: 200px; max-width: min(280px, calc(100vw - 24px)); }
  .kbv-nav { flex-direction: row; overflow-x: auto; flex: 1 1 100%; padding-bottom: 2px; gap: 6px; }
  .kbv-nav-item { height: 40px; padding: 0 14px; white-space: nowrap; font-size: 14px; flex: none; }
  .kbv-nav-ico { width: 16px; height: 16px; }
  .kbv-nav-item--dir { padding: 0 14px; }
  /* 横向胶囊排列时分隔线没有意义，靠间距分组即可 */
  .kbv-nav-item--trash { margin-top: 0; }
  .kbv-nav-item--trash::before { display: none; }
  .kbv-nav-folder { width: 16px; height: 16px; }
  .kbv-nav-folder svg { width: 16px; height: 16px; }
  .kbv-topbar { padding: 10px 14px; gap: 10px; }
  .kbv-tabs { gap: 14px; flex: 0 1 auto; }
  .kbv-filters { flex: 1 1 auto; justify-content: flex-end; }
  .kbv-search { flex: 0 1 150px; min-width: 0; }
  .kbv-row { padding: 0 14px; }
  .kbv-search input { width: 100%; }
}

@media (max-width: 640px) {
  .kbv-row { grid-template-columns: minmax(0, 1fr) 76px 32px; column-gap: 8px; padding: 0 12px; }
  .kbv-col-owner, .kbv-row--head .kbv-col-owner { display: none; }
  .kbv-row--head { font-size: 11px; }
  .kbv-topbar { gap: 6px; padding: 10px 12px; flex-wrap: wrap; }
  .kbv-tabs { gap: 14px; flex: 1 1 100%; }
  /* 与回收站标题胶囊的窄屏规格一致：40px 高、15px 字、左右 14px */
  .kbv-curdir { max-width: 100%; height: 40px; font-size: 15px; padding: 0 14px; }
  .kbv-filters { gap: 6px; flex: 1 1 100%; }
  .kbv-select { min-width: 0; }
  .kbv-search { flex: 1 1 auto; min-width: 0; }
  .kbv-search input { width: 100%; }
  .kbv-empty { padding: 40px 16px; }
}

@media (max-width: 1080px) {
  .kb-edit-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 860px) {
  .kb-layout { grid-template-columns: minmax(0, 1fr); }
  .kb-side { position: static; }
  .kb-cats { flex-direction: row; overflow-x: auto; }
  .kb-cat { flex: 0 0 auto; }
  .kb-editor { padding: 16px; min-height: 380px; }
  .kb-search input[type=search] { width: 140px; }
  .kb-share-form input[type=text] { width: 100%; }
}

/* 知识库 · 历史版本（修订） */
.kbv-rev-list { display: flex; flex-direction: column; gap: 8px; max-height: 52vh; overflow: auto; padding-right: 2px; }
.kbv-rev-item { border: 1px solid #eceef1; border-radius: 8px; padding: 10px 12px; background: #fff; }
.kbv-rev-item--cur { background: #f6f9ff; border-color: #cfe0ff; }
.kbv-rev-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.kbv-rev-v { font-weight: 600; color: #1f2329; }
.kbv-rev-badge { font-style: normal; font-size: 11px; padding: 1px 6px; border-radius: 4px; background: #f2f3f5; color: #646a73; }
.kbv-rev-badge--cur { background: #e8f0ff; color: #2b6cff; }
.kbv-rev-badge--major { background: #fff3e0; color: #d46b08; }
.kbv-rev-meta { margin-left: auto; font-size: 12px; color: #8a9099; }
.kbv-rev-note { margin-top: 6px; font-size: 12px; color: #4e5969; }
.kbv-rev-acts { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 8px; }
.kbv-rev-empty { padding: 20px 0; text-align: center; }
.kbv-rev-doc { max-height: 52vh; overflow: auto; border: 1px solid #eceef1; border-radius: 8px; padding: 14px 16px; }
.kbv-rev-doc img { max-width: 100%; height: auto; }
.kbv-rev-diff { max-height: 52vh; overflow: auto; font: 12px/1.65 ui-monospace, Consolas, monospace; border: 1px solid #eceef1; border-radius: 8px; padding: 8px; }
.kbv-diff-line { white-space: pre-wrap; word-break: break-word; padding: 0 4px; }
.kbv-diff-add { background: #e9f7ee; color: #1a7f37; }
.kbv-diff-del { background: #fdeced; color: #b42318; text-decoration: line-through; }
.kbv-rev-files { margin-top: 10px; font-size: 12px; color: #4e5969; display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.kbv-rev-file { background: #f2f3f5; border-radius: 4px; padding: 2px 8px; }
.kbv-rev-trash { margin-top: 12px; border-top: 1px dashed #e5e6eb; padding-top: 10px; }
.kbv-rev-trash-row { display: flex; align-items: center; gap: 10px; font-size: 12px; color: #4e5969; padding: 4px 0; }
.kbv-rev-trash-meta { color: #8a9099; }
.kbv-perm-link--danger { color: #d92d20; }

/* 详情页历史版本列表 */
.kb-revs { margin-top: 18px; }
.kb-rev-hint { font-size: 12px; color: #8a9099; margin: -4px 0 8px; }
.kb-rev-note-inline { font-size: 12px; color: #4e5969; background: #f6f7f9; border-radius: 4px; padding: 1px 6px; }
.kb-rev-acts-inline { margin-left: auto; display: inline-flex; align-items: center; gap: 10px; white-space: nowrap; }

/* 打印 */
/* 侧边栏「回收站」计数徽标 */
.kbv-nav-badge { flex: none; margin-left: auto; min-width: 18px; padding: 0 5px; height: 18px; line-height: 18px;
  border-radius: 9px; background: #fee2e2; color: #b91c1c; font-size: 11px; font-style: normal; text-align: center; }
/* 回收站与分类分一组：胶囊本身有底色，分隔线改画在胶囊之外，避免裁切圆角 */
.kbv-nav-item--trash { margin-top: 12px; position: relative; }
.kbv-nav-item--trash::before { content: ""; position: absolute; left: 2px; right: 2px; top: -7px;
  border-top: 1px dashed var(--border, #e5eaf1); }

/* 回收站页面：与文档列表同一套行式版式（磁贴 + 文件名 + 徽章 + 所有者 + 时间 + 更多） */
.kbv-trash { padding: 20px 24px 40px; }
/* ---- 顶部卡头：两行结构。第一行 标题胶囊 + 动作/筛选/搜索/排序，第二行 面包屑 + 统计 ---- */
.kbv-trash-head { background: #fff; border: 1px solid var(--border, #e2e8f0); border-radius: 12px 12px 0 0; }
/* 卡头与下面的列表 / 空态拼成一张卡，接缝处只画一条线 */
.kbv-trash-head + .kbv-trash-list,
.kbv-trash-head + .kbv-trash-empty { border-top: 0; border-radius: 0 0 12px 12px; }
.kbv-trash-bar { display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  row-gap: 10px; padding: 10px 16px; }
/* 标题胶囊：浅灰底 + 蓝色图标 + 深色加粗，形状与第一张设计图一致（不含条目数，统计在第二行） */
.kbv-trash-pill { display: inline-flex; align-items: center; gap: 9px; margin: 0;
  height: 44px; padding: 0 16px; border-radius: 10px; background: #f4f6f9;
  font-size: 16px; font-weight: 600; color: #23282f; white-space: nowrap;
  flex: 0 1 auto; min-width: 0; max-width: 46%; }
.kbv-trash-pill-ico { display: inline-flex; align-items: center; color: var(--primary); flex: none; }
.kbv-trash-pill-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
/* 动作组靠右；窄屏时仍与标题同行，只把筛选组挤到下一行 */
.kbv-trash-acts { display: flex; align-items: center; gap: 10px; margin-left: auto; flex: none; }
/* 筛选组不可拆：空间不够时整组下沉，不出现「排序孤零零占一行」 */
.kbv-trash-filters { display: flex; align-items: center; gap: 10px; min-width: 0; flex-wrap: wrap; }
/* 动作按钮统一 38px 高：主操作走 .btn 的实心蓝，次操作走 .btn-ghost 的白底描边 */
.kbv-trash-act { height: 38px; padding: 0 16px; font-size: 14px; border-radius: 8px; gap: 7px; }
.kbv-trash-act svg { flex: none; }
.kbv-trash-act--danger { color: var(--danger, #dc2626); border-color: #f0d5d5; }
.kbv-trash-act--danger:hover { background: #fef2f2; color: var(--danger, #dc2626); border-color: #f3c9c9; }
/* 分段筛选：白底描边容器 + 竖直分隔线，选中项浅蓝底（与参考图的视图切换同款） */
.kbv-seg { display: inline-flex; align-items: stretch; height: 38px; padding: 0;
  border: 1px solid #e4e8ee; border-radius: 8px; background: #fff; overflow: hidden; flex: none; }
.kbv-seg-btn { display: inline-flex; align-items: center; height: 36px; padding: 0 14px;
  border-radius: 0; font-size: 13.5px; color: #5c6675; text-decoration: none;
  transition: background .15s, color .15s; white-space: nowrap; }
.kbv-seg-btn + .kbv-seg-btn { border-left: 1px solid #eef1f5; }
.kbv-seg-btn:hover { background: #f7f9fc; color: var(--text); text-decoration: none; }
.kbv-seg-btn.is-on { background: #eef4ff; color: var(--primary); font-weight: 600; }
.kbv-seg-btn.is-on:hover { background: #e7efff; }
/* 按下 / 键盘聚焦：与 .btn:active 的「下沉 1px」保持一致 */
.kbv-seg-btn:active, .kbv-trash-sortbtn:active { transform: translateY(1px); }
.kbv-seg-btn:focus-visible, .kbv-trash-sortbtn:focus-visible,
.kbv-trash-search-x:focus-visible { outline: 2px solid var(--primary); outline-offset: 1px; }
/* 搜索：灰底无边框，聚焦时白底 + 主色描边 + 柔光 */
.kbv-trash-search { position: relative; display: inline-flex; align-items: center;
  width: 216px; height: 38px; padding: 0 28px 0 34px; border-radius: 8px;
  background: #f3f5f9; border: 1px solid transparent;
  flex: 0 1 216px; min-width: 120px;
  transition: border-color .15s, background .15s, box-shadow .15s; }
.kbv-trash-search:hover { background: #eef1f6; }
.kbv-trash-search:focus-within { background: #fff; border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .12); }
.kbv-trash-search > svg { position: absolute; left: 11px; color: #98a2b3; pointer-events: none; }
.kbv-trash-search input { width: 100%; height: 100%; border: 0; background: transparent;
  font: inherit; font-size: 13.5px; color: var(--text); outline: none; }
.kbv-trash-search input::placeholder { color: #98a2b3; }
.kbv-trash-search input::-webkit-search-cancel-button { display: none; }
.kbv-trash-search-x { position: absolute; right: 6px; width: 16px; height: 16px; line-height: 15px;
  border-radius: 50%; background: #dfe4ea; color: #6b7280; font-size: 12px; text-align: center;
  text-decoration: none; }
.kbv-trash-search-x:hover { background: #cbd2da; color: #1f2937; }
/* 排序：无底色的文字按钮 + 下拉箭头，展开时箭头翻转并给一层灰底 */
.kbv-trash-sort { position: relative; flex: none; }
.kbv-trash-sortbtn { display: inline-flex; align-items: center; gap: 4px; height: 38px; padding: 0 10px;
  border: 0; border-radius: 8px; background: transparent; cursor: pointer;
  font: inherit; font-size: 14px; color: #3f4a5a; transition: background .15s, color .15s; }
.kbv-trash-sortbtn:hover, .kbv-trash-sortbtn[aria-expanded="true"] { background: #f2f4f7; color: var(--text); }
.kbv-trash-sortbtn > svg { transition: transform .15s ease; }
.kbv-trash-sortbtn[aria-expanded="true"] > svg { transform: rotate(180deg); }
.kbv-trash-sort .kbv-menu { min-width: 150px; }
.kbv-menu-item.is-on { color: var(--primary); font-weight: 600; }
/* 第二行：面包屑 + 右侧统计信息。整行浅底（同资料库面包屑），与第一行用一条通栏细线分隔 */
.kbv-trash-sub { display: flex; align-items: center; gap: 12px; min-height: 44px;
  padding: 0 16px; background: #fbfcfe; border-top: 1px solid #eef1f5; }
.kbv-trash-meta { flex: none; margin-left: auto; font-size: 12.5px; color: #8a919f; white-space: nowrap; }
.kbv-trash-keep { flex: none; margin-left: 14px; font-size: 12.5px; color: #98a2b3; white-space: nowrap; }
.kbv-trash-empty { padding: 70px 20px; text-align: center; color: var(--text-2); background: #fff;
  border: 1px solid var(--border, #e5eaf1); border-radius: 12px; }
.kbv-trash-empty p { margin: 0 0 6px; font-size: 14px; }
.kbv-trash-empty-sub { font-size: 12.5px; color: var(--text-3, #94a3b8); }

/* 列表：白底卡片；行内布局全部沿用资料库的 .kbv-row 体系（56px 行高、32px 磁贴、14px 标题、悬停变主色） */
.kbv-trash-list { background: #fff; border: 1px solid var(--border, #e5eaf1); border-radius: 12px;
  overflow: hidden; }
/* 名称 1fr | 删除人 110 | 创建人 110 | 删除时间 112 | 更多 36；
   左内边距 16px 与上方卡头的标题胶囊对齐 */
.kbv-trash-row { grid-template-columns: minmax(0, 1fr) 110px 110px 112px 36px;
  gap: 14px; padding: 0 10px 0 16px; }
/* 表头与资料库同款：无底色、38px 高、12px 灰字 */
.kbv-trash-row--head { background: transparent; }
/* 文档行整行是预览按钮：清掉按钮默认样式，外观与资料库的 <a> 行完全一致 */
.kbv-row-main--btn { width: 100%; padding: 0; border: 0; background: none;
  font: inherit; text-align: left; cursor: pointer; }
/* 第二行里的面包屑：内边距与描边交给 .kbv-trash-sub，这里只负责占满左侧余量 */
.kbv-trash-crumb { display: flex; align-items: center; flex: 1 1 auto; min-width: 0;
  padding: 0; border: 0; border-radius: 0; font-size: 13px; }

/* 多出一列「删除人」后，1366 及以下先收窄各定宽列，并收起次要的「剩余 N 天」，
   保证标题不被徽章挤成省略号（保留期由卡头的「保留 N 天」统一说明） */
@media (max-width: 1366px) and (min-width: 768px) {
  .kbv-trash-row { grid-template-columns: minmax(0, 1fr) 96px 104px 100px 36px; gap: 12px; }
  .kbv-trash-row .kbv-badge--days { display: none; }
}

@media (max-width: 767px) {
  .kbv-trash { padding: 14px 12px 28px; }
  /* 内卡留白与回收站页保持同一档 */
  .kbv-page { padding: 14px 12px 28px; }
  /* 窄屏收起三列元信息，只留文件名与更多操作；表头同步收敛 */
  .kbv-trash-row--head { display: none; }
  .kbv-trash-row { grid-template-columns: minmax(0, 1fr) 40px; gap: 8px; padding: 0 6px 0 12px; }
  .kbv-trash-row .kbv-col-owner, .kbv-trash-row .kbv-col-del,
  .kbv-trash-row .kbv-col-time { display: none; }
  /* 窄屏：胶囊独占一行，工具区整体换行，筛选组靠左不散开 */
  .kbv-trash-bar { padding: 12px; row-gap: 10px; }
  .kbv-trash-pill { max-width: 100%; height: 40px; font-size: 15px; padding: 0 14px; }
  .kbv-trash-acts { margin-left: auto; }
  .kbv-trash-filters { width: 100%; justify-content: flex-start; }
  /* 搜索框可压缩：空间不够时先收窄搜索，排序始终留在同行，不会单独掉一行 */
  .kbv-trash-search { width: auto; flex: 1 1 160px; min-width: 120px; }
  .kbv-trash-act { flex: none; }
  /* 第二行：面包屑可横向滚动，统计信息靠右；保留期说明收起，避免挤掉路径 */
  .kbv-trash-sub { padding: 0 12px; min-height: 42px; gap: 10px; }
  .kbv-trash-keep { display: none; }
  .kbv-trash-crumb { overflow-x: auto; }
}
@media (max-width: 1080px) {
  /* 中等宽度先把排序文案收成箭头，省出 60px 让整条工具线不掉行 */
  .kbv-trash-sortbtn span { display: none; }
  .kbv-trash-sortbtn { padding: 0 10px; }
}
@media (max-width: 480px) {
  /* 更窄：动作按钮独占一行并各占一半，筛选组内换行，搜索框独占一行 */
  .kbv-trash-acts { flex: 1 1 100%; margin-left: 0; flex-wrap: wrap; }
  .kbv-trash-act { flex: 1 1 auto; justify-content: center; }
  .kbv-trash-filters { flex-wrap: wrap; }
  .kbv-seg { flex: 1 1 auto; }
  .kbv-seg-btn { flex: 1 1 0; justify-content: center; padding: 0 10px; }
  .kbv-trash-search { order: 3; flex: 1 1 100%; width: auto; }
  .kbv-trash-sort { margin-left: auto; }
  .kbv-trash-meta { margin-left: auto; }
}

@media print {
  .sidebar, .topbar, .tabbar, .btn, .pager { display: none !important; }
  .main { margin-left: 0; }
  .card { box-shadow: none; border: none; }
  .content { padding: 0; }
}