:root {
  --bg: #f3f5f9;
  --panel: #ffffff;
  --ink: #1f2937;
  --muted: #6b7280;
  --line: #e5e7eb;
  --hover: #eef2f7;
  --brand: #0B5CAD;
  --brand-ink: #ffffff;
  --brand-soft: #EAF1FB;
  --accent: #f97316;
  --danger: #ef4444;
  --ok: #22c55e;
  --shadow: 0 4px 24px rgba(31, 41, 55, 0.08);
  --radius: 18px;
  --radius-sm: 14px;
  --gap: 10px;
  --section-color: #0B5CAD;
  --sidebar: 248px;
  --sidebar-collapsed: 72px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
    "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
}

* { box-sizing: border-box; }

html, body { height: 100%; margin: 0; }
body {
  background: var(--bg);
  color: var(--ink);
  line-height: 1.55;
  overflow: hidden;
}

a { color: var(--brand); text-decoration: none; }

/* ===== 登录页 ===== */
.login-page {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  position: relative;
  background:
    radial-gradient(circle at 20% 30%, rgba(26, 86, 219, 0.12) 0%, transparent 40%),
    radial-gradient(circle at 80% 70%, rgba(249, 115, 22, 0.10) 0%, transparent 40%),
    var(--panel);
}

/* 登录页 3D 背景画布 + 暗/白主题 */
#loginBg { position: absolute; inset: 0; z-index: 0; display: block; width: 100%; height: 100%; }
.login-card { position: relative; z-index: 1; }
/* 用 #loginView 前缀提升特异性，避免被全局 [data-theme="dark"] .card/.input 等规则覆盖 */
#loginView.login-theme-dark .login-page { background: #04060d; }
#loginView.login-theme-white .login-page { background: linear-gradient(160deg, #eef3fb 0%, #f8fbff 55%, #e7eefb 100%); }
#loginView.login-theme-dark .login-card {
  background: rgba(13, 18, 32, 0.72); backdrop-filter: blur(22px) saturate(160%);
  -webkit-backdrop-filter: blur(22px) saturate(160%);
  border: 1px solid rgba(255, 255, 255, 0.06); color: #f0f5ff;
  box-shadow:
    0 24px 70px rgba(0, 0, 0, 0.55),
    inset 0 1px 0 rgba(255, 255, 255, 0.06),
    0 0 0 1px rgba(0, 0, 0, 0.35);
  color-scheme: dark;
}
#loginView.login-theme-dark .login-card .logo-mark { filter: brightness(0) invert(1) drop-shadow(0 1px 2px rgba(0,0,0,0.25)); }
#loginView.login-theme-dark .login-card .login-brand-text { color: #ffffff; text-shadow: 0 1px 2px rgba(0,0,0,0.25); }
#loginView.login-theme-dark .login-card h2 { color: #ffffff; text-shadow: 0 1px 2px rgba(0,0,0,0.25); }
#loginView.login-theme-dark .login-card .hint { color: #a3b8e0; }
#loginView.login-theme-dark .login-card .field label { color: #c8d6f5; }
#loginView.login-theme-dark .login-card .input {
  background: rgba(255, 255, 255, 0.055);
  color: #ffffff;
  border-color: rgba(130, 165, 230, 0.18);
  caret-color: #5fd0ff;
}
/* 禁止浏览器自动填充把输入框强行改成系统默认浅色 */
#loginView.login-theme-dark .login-card .input:-webkit-autofill,
#loginView.login-theme-dark .login-card .input:-webkit-autofill:hover,
#loginView.login-theme-dark .login-card .input:-webkit-autofill:focus {
  -webkit-text-fill-color: #ffffff !important;
  -webkit-box-shadow: 0 0 0px 1000px rgba(15, 20, 32, 0.95) inset !important;
  transition: background-color 5000s ease-in-out 0s;
}
#loginView.login-theme-dark .login-card .input::placeholder { color: #7f95c7; opacity: 0.85; }
#loginView.login-theme-dark .login-card .input:focus { border-color: #5fd0ff; box-shadow: 0 0 0 3px rgba(95, 208, 255, 0.18); }
#loginView.login-theme-dark .login-card .btn.primary {
  background: linear-gradient(135deg, #1a56db, #3b82f6);
  box-shadow: 0 4px 14px rgba(26, 86, 219, 0.35);
}
#loginView.login-theme-dark .login-card .btn.primary:hover {
  background: linear-gradient(135deg, #1e64f2, #4b8fff);
  box-shadow: 0 6px 18px rgba(26, 86, 219, 0.45);
}
#loginView.login-theme-white .login-card {
  background: rgba(255, 255, 255, 0.72); backdrop-filter: blur(18px) saturate(140%);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
  border: 1px solid rgba(255, 255, 255, 0.85); color: #1f2937;
  box-shadow: 0 20px 60px rgba(31, 41, 55, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.9);
  color-scheme: light;
}
#loginView.login-theme-white .login-card h2 { color: #111827; }
#loginView.login-theme-white .login-card .login-brand-text { color: #111827; }
#loginView.login-theme-white .login-card .hint { color: #4b5563; }
#loginView.login-theme-white .login-card .field label { color: #374151; }
#loginView.login-theme-white .login-card .input { background: rgba(255, 255, 255, 0.85); color: #1f2937; border-color: rgba(209, 213, 219, 0.8); }
#loginView.login-theme-white .login-card .input:focus { border-color: #1a56db; box-shadow: 0 0 0 3px rgba(26, 86, 219, 0.12); }
/* 登录页下拉（语言选择等）：去掉原生控件外观，用自定义箭头，保证亮/暗主题下颜色与箭头都正确 */
#loginView .login-card select.input {
  -webkit-appearance: none; -moz-appearance: none; appearance: none;
  padding-right: 38px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%239fb2d6' d='M1 1.5L6 6.5L11 1.5'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 14px center;
}
#loginView .login-card select.input option { color: #1f2937; background: #ffffff; }
#loginView.login-theme-dark .login-card select.input {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%239fb2d6' d='M1 1.5L6 6.5L11 1.5'/%3E%3C/svg%3E");
}
#loginView.login-theme-dark .login-card select.input option { color: #eaf1ff; background: #11161f; }
#loginView.login-theme-white .login-card select.input {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%236b7280' d='M1 1.5L6 6.5L11 1.5'/%3E%3C/svg%3E");
}

/* 登录主题设置预览 */
.login-preview-wrap {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  max-height: 560px;
  border-radius: 12px;
  overflow: hidden;
  margin-top: 10px;
  background: #04060d;
}
#loginPreview {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
}
@media (max-width: 768px) {
  .login-preview-wrap { max-height: 320px; }
}

/* 分段控件（登录主题设置） */
.seg { display: inline-flex; border: 1px solid rgba(120, 170, 255, 0.3); border-radius: 10px; overflow: hidden; }
.seg-btn { padding: 8px 18px; border: none; background: transparent; color: var(--muted); cursor: pointer; font-size: 14px; transition: all .15s; }
.seg-btn:hover { color: var(--ink); }
.seg-btn.active { background: linear-gradient(135deg, #1a56db, #3b82f6); color: #fff; }
.login-card {
  width: 420px;
  max-width: 100%;
  padding: 40px;
  text-align: center;
  border-radius: var(--radius);
}
.login-card .logo-mark { height: 38px; width: auto; max-width: 220px; margin: 0 auto 18px; display: block; object-fit: contain; }
.login-card .login-brand { display: flex; align-items: center; justify-content: center; gap: 12px; margin: 0 auto 14px; }
.login-card .login-mark { height: 34px; width: auto; max-width: 220px; flex-shrink: 0; display: block; object-fit: contain; }
.login-card .login-brand-text { font-size: 24px; font-weight: 700; color: var(--ink); letter-spacing: -0.3px; }
.login-card .login-brand-go { color: inherit; }
.login-card .login-brand-tw { color: #3B82F6; }
.login-card h2 { margin: 0 0 8px; font-size: 24px; }
.login-card .hint { color: var(--muted); font-size: 14px; margin: 0 0 24px; }

/* ===== 登录页图形验证码 ===== */
.captcha-field.hidden { display: none !important; }
.captcha-row { display: flex; gap: 10px; align-items: stretch; }
.captcha-row .input { flex: 1; min-width: 0; letter-spacing: 2px; text-transform: uppercase; }
.captcha-img {
  flex: 0 0 auto;
  width: 124px;
  height: 46px;
  border-radius: 12px;
  border: 1px solid rgba(120, 170, 255, 0.22);
  cursor: pointer;
  background: #0f172a;
  user-select: none;
  transition: transform 0.18s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.18s ease;
}
.captcha-img:hover { transform: translateY(-1px); box-shadow: 0 4px 14px rgba(95, 208, 255, 0.22); }
.captcha-img:active { transform: scale(0.97); }

/* ===== 管理后台布局 ===== */
.app-layout {
  display: flex;
  height: 100vh;
  overflow: hidden;
  padding: var(--gap);
  gap: var(--gap);
}
.sidebar {
  position: relative;
  width: var(--sidebar);
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  display: flex;
  flex-direction: column;
  transition: width 0.25s ease;
  flex-shrink: 0;
  overflow: visible;
}
.sidebar.collapsed { width: var(--sidebar-collapsed); }
.sidebar-scroll {
  flex: 1;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

/* Brand */
.sidebar .brand {
  padding: 16px 24px;
  border-bottom: 1px solid var(--line);
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 64px;
}
.sidebar-toggle {
  width: 32px; height: 32px;
  border: 1px solid var(--line); background: transparent;
  border-radius: 8px; cursor: pointer; padding: 6px 5px;
  display: flex; flex-direction: column; justify-content: center; gap: 5px;
  flex-shrink: 0;
}
.sidebar-toggle .bar {
  display: block; height: 2px; background: var(--ink); border-radius: 2px;
  transition: 0.2s;
}
.sidebar-toggle:hover { border-color: var(--brand); }
.brand-mark { width: 34px; height: 34px; flex-shrink: 0; display: block; border-radius: 10px; box-shadow: 0 2px 6px rgba(11,92,173,.22); }
.brand-text {
  font-weight: 700; font-size: 15px; color: var(--ink);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  transition: opacity 0.2s;
}
.brand-text-go { color: var(--ink); }
.brand-text-tw { color: #3B82F6; letter-spacing: -0.2px; }
.sidebar.collapsed .brand-text { opacity: 0; width: 0; overflow: hidden; }
.sidebar.collapsed .brand { padding: 16px 10px; justify-content: center; gap: 0; }
.sidebar.collapsed .brand-mark { width: 36px; height: 36px; }
.sidebar.collapsed .sidebar-bottom-btn.user-btn .user-name { display: none; }

/* Nav */
.sidebar .nav {
  flex: 1 1 0;
  min-height: 0;
  overflow-y: auto;
  padding: 8px 6px 8px;
  scrollbar-gutter: stable;
}
.sidebar .nav::-webkit-scrollbar { width: 6px; }
.sidebar .nav::-webkit-scrollbar-thumb { background: rgba(11,92,173,.18); border-radius: 3px; }
.sidebar .nav::-webkit-scrollbar-thumb:hover { background: rgba(11,92,173,.32); }
.sidebar .nav-item {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 9px;
  border-radius: 9px;
  cursor: pointer;
  color: var(--ink);
  transition: background .15s, color .15s;
  font-size: 13px;
  transition: 0.15s;
  margin-bottom: 1px;
  white-space: nowrap;
}
/* 导航统一科技蓝，去七彩渐变 */
.sidebar .nav-item { --nav-color: #0B5CAD; --nav-soft: color-mix(in srgb, var(--nav-color) 14%, transparent); }
#navHome, #navFiles, #navTrash, #navUrlCases, #navUsers, #navSettings,
#navLoginTheme, #navNotes, #navAgents, #navWorkflows, #navForms, #navGraph, #navDevices { --nav-color: #0B5CAD; }
/* 极简线性图标：浅蓝圆角底盘（squircle tile）+ 品牌蓝图标，激活态实心蓝白图标 */
.sidebar .nav-item .nav-icon {
  width: 28px; height: 28px; flex-shrink: 0;
  display: block; color: var(--nav-color, var(--brand));
  background: var(--brand-soft); border-radius: 8px; padding: 5px;
  box-sizing: border-box;
  transition: transform .2s cubic-bezier(.34,1.4,.64,1), background .15s, color .15s;
}
.sidebar .nav-item:hover { background: var(--nav-soft); }
.sidebar .nav-item:hover .nav-icon { transform: scale(1.06); }
.sidebar .nav-item.active { background: var(--nav-soft); color: var(--nav-color); font-weight: 600; }
.sidebar .nav-item.active .nav-icon { background: var(--nav-color, var(--brand)); color: #fff; box-shadow: 0 4px 10px rgba(11,92,173,.28); }
.sidebar .nav-item .nav-label { transition: opacity 0.2s; }
/* 分组小标题 */
.sidebar .nav-group-label {
  font-size: 10px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase;
  color: var(--muted); padding: 8px 12px 3px;
}
.sidebar .nav-group-label:first-of-type { padding-top: 4px; }
.sidebar.collapsed .nav-item { align-items: center; justify-content: center; gap: 0; width: 40px; height: 40px; padding: 0; margin: 0 auto 6px; }
.sidebar.collapsed .nav-item .nav-label { display: none; }
.sidebar.collapsed .nav-item .nav-icon { width: 34px; height: 34px; padding: 6px; }
.sidebar.collapsed .nav-group-label { display: none; }

/* 侧边栏分组（资源管理 + 子项 文件/回收站） */
#navFilesGroup { --nav-color: #0B5CAD; }
#navTrash { --nav-color: #0B5CAD; }
.sidebar .nav-group { display: block; margin-bottom: 4px; }
.sidebar .nav-group-head {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 12px; border-radius: 10px; cursor: pointer;
  color: var(--ink); font-size: 14px; white-space: nowrap; transition: 0.15s;
}
.sidebar .nav-group-head .nav-icon {
  width: 34px; height: 34px; flex-shrink: 0; display: block; color: var(--nav-color, var(--brand));
  transition: transform .2s cubic-bezier(.34,1.4,.64,1);
}
.sidebar .nav-group-head:hover { background: rgba(120,130,150,0.10); }
.sidebar .nav-group.open > .nav-group-head { font-weight: 600; }
.sidebar .nav-group.active > .nav-group-head { color: var(--nav-color); }
.sidebar .nav-group.active > .nav-group-head .nav-icon { transform: scale(1.04); color: var(--nav-color); }
.sidebar .nav-caret { width: 14px; height: 14px; margin-left: auto; color: var(--muted); transition: transform .2s; flex-shrink: 0; }
.sidebar .nav-group.open > .nav-group-head .nav-caret { transform: rotate(180deg); }
.sidebar .nav-sub { display: none; padding: 2px 0 2px 30px; }
.sidebar .nav-group.open > .nav-sub { display: block; }
.sidebar .nav-sub .nav-item { padding: 8px 12px; font-size: 13px; }
.sidebar .nav-sub .nav-item:hover { background: rgba(120,130,150,0.10); }
.sidebar .nav-sub .nav-item.active { background: var(--nav-soft, rgba(99,102,241,0.12)); }
.sidebar .nav-sub-dot { width: 7px; height: 7px; border-radius: 50%; background: currentColor; opacity: .5; flex-shrink: 0; }
.sidebar .nav-sub .nav-item.active .nav-sub-dot { opacity: 1; }
/* 收起态 */
.sidebar.collapsed .nav-group-head .nav-caret { display: none; }
.sidebar.collapsed .nav-group-head .nav-label { display: none; }
.sidebar.collapsed .nav-sub { padding-left: 0; }
.sidebar.collapsed .nav-sub .nav-item { width: 40px; height: 40px; padding: 0; justify-content: center; margin: 0 auto 6px; }
.sidebar.collapsed .nav-sub .nav-label { display: none; }

/* 侧边栏 collapsed 态：悬停 nav-item 浮出菜单名 tooltip（白底灰字+发丝边框+极简左箭头，与科技蓝主色更协调） */
.sidebar.collapsed .nav-item[data-tooltip] { position: relative; }
.sidebar.collapsed .nav-item[data-tooltip]:hover::after {
  content: attr(data-tooltip);
  position: absolute;
  left: calc(100% + 8px);
  top: 50%;
  transform: translateY(-50%);
  background: #ffffff;
  color: #1f2937;
  font-size: 12px;
  font-weight: 500;
  padding: 5px 10px;
  border: 1px solid #E5E7EB;
  border-radius: 6px;
  white-space: nowrap;
  z-index: 1000;
  pointer-events: none;
  box-shadow: none;
  letter-spacing: 0;
}
.sidebar.collapsed .nav-item[data-tooltip]:hover::before {
  content: "";
  position: absolute;
  left: 100%;
  top: 50%;
  transform: translateY(-50%);
  border: 4px solid transparent;
  border-right-color: #ffffff;
  z-index: 1001;
  pointer-events: none;
}

.nav-divider { height: 1px; background: var(--line); margin: 8px 16px; flex-shrink: 0; }

/* 侧边栏存储用量分栏 */
.usage-block {
  margin: 10px 14px 4px;
  padding: 12px 14px;
  background: var(--brand-soft, rgba(99,102,241,0.08));
  border: 1px solid var(--line, #e5e7eb);
  border-radius: 12px;
}
.usage-head {
  display: flex; justify-content: space-between; align-items: baseline;
  margin-bottom: 8px;
}
.usage-label { font-size: 12px; color: var(--muted); font-weight: 600; }
.usage-value { font-size: 13px; font-weight: 700; color: var(--text-primary); }
.usage-bar {
  height: 6px; border-radius: 999px;
  background: var(--line, #e5e7eb);
  overflow: hidden;
}
.usage-fill {
  height: 100%; width: 0%;
  background: linear-gradient(90deg, var(--brand, #6366f1), #22d3ee);
  border-radius: 999px;
  transition: width 0.5s ease;
}
.usage-fill.full { background: linear-gradient(90deg, #ef4444, #f97316); }
.usage-sub { margin-top: 6px; font-size: 11px; color: var(--muted); }
[data-theme="dark"] .usage-block { background: rgba(99,102,241,0.12); border-color: var(--line, #374151); }
[data-theme="dark"] .usage-bar { background: #374151; }
.sidebar.collapsed .usage-block { display: none; }

/* Workspace */
.workspace {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-width: 0;
  background: var(--bg);
  gap: var(--gap);
}

/* Sidebar collapse button (floating at mid-height of sidebar) */
.sidebar-collapse {
  position: absolute; top: 50%; right: -13px;
  width: 26px; height: 26px; margin-top: -13px;
  border: 1px solid var(--line); background: var(--panel);
  border-radius: 50%; cursor: pointer; padding: 0;
  display: flex; align-items: center; justify-content: center;
  color: var(--muted); font-size: 15px; line-height: 1;
  transition: border-color .15s, color .15s, transform .15s, box-shadow .15s;
  box-shadow: 0 2px 6px rgba(0,0,0,0.06);
  z-index: 20;
}
.sidebar-collapse::before {
  content: '\2039'; /* ‹ 向左 */
  display: block; font-size: 15px; margin-top: -1px;
}
.sidebar-collapse:hover { border-color: var(--brand); color: var(--brand); transform: translateY(-1px); box-shadow: 0 4px 10px rgba(26,86,219,0.14); }
.sidebar.collapsed .sidebar-collapse::before { content: '\203A'; /* › 向右 */ }

/* Mobile menu trigger (floating hamburger) */
.mobile-menu-trigger {
  display: none;
}
@media (max-width: 768px) {
  .mobile-menu-trigger {
    display: flex; align-items: center; justify-content: center;
    position: fixed; top: 14px; left: 14px; z-index: 30;
    width: 38px; height: 38px;
    border: 1px solid var(--line); background: var(--panel);
    border-radius: 50%; cursor: pointer; padding: 0;
    color: var(--ink); font-size: 18px; line-height: 1;
    box-shadow: var(--shadow);
  }
  .mobile-menu-trigger:hover { border-color: var(--brand); color: var(--brand); }
}

/* Sidebar bottom actions: settings + user */
.sidebar-bottom {
  padding: 12px; margin-top: auto;
  flex-shrink: 0; display: flex; flex-direction: column; gap: 6px;
}
/* 版本号标签：部署验证用，一眼看出浏览器加载的代码版本 */
.app-version {
  font-size: 10.5px; color: color-mix(in srgb, var(--muted) 75%, transparent);
  text-align: center; padding: 2px 0 0; user-select: none; letter-spacing: .3px;
}
.sidebar-bottom-btn {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 12px; border-radius: 10px; border: none; background: transparent;
  color: var(--ink); font: inherit; font-size: 14px; cursor: pointer;
  text-align: left; transition: background .15s, color .15s;
}
.sidebar-bottom-btn:hover { background: var(--brand-soft); }
.sidebar-bottom-btn .nav-icon { width: 20px; height: 20px; text-align: center; flex-shrink: 0; color: var(--muted); }
.sidebar-bottom-btn .nav-icon svg.ico { width: 20px; height: 20px; }
.sidebar-bottom-btn .nav-label { transition: opacity .2s; }
.sidebar.collapsed .sidebar-bottom-btn { justify-content: center; padding: 10px; }
.sidebar.collapsed .sidebar-bottom-btn .nav-label { display: none; }
/* 通知按钮：展开/折叠均居中，徽标与 icon 并排（不再右上角悬浮角标） */
.sidebar-bottom-btn.notify-btn { justify-content: center; padding: 10px; }
.sidebar-bottom-btn.notify-btn .notify-badge { position: static; min-width: 16px; height: 16px; padding: 0 5px; border-radius: 8px; background: #ef4444; color: #fff; font-size: 10px; line-height: 16px; text-align: center; font-weight: 700; }

.sidebar-bottom-btn.user-btn {
  border: none; background: transparent;
  padding: 6px 12px 6px 12px; gap: 10px;
}
.sidebar-bottom-btn.user-btn:hover { background: var(--brand-soft); }
.sidebar-bottom-btn.user-btn .avatar { width: 36px; height: 36px; box-shadow: 0 2px 8px rgba(11,92,173,.22); }
.sidebar-bottom-btn.user-btn .user-name {
  flex: 1; min-width: 0; font-size: 13px; font-weight: 600;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* Avatar */
.avatar {
  width: 30px; height: 30px; border-radius: 50%;
  background: var(--brand); color: #fff; font-weight: 700;
  display: flex; align-items: center; justify-content: center; font-size: 13px;
  overflow: hidden; object-fit: cover; object-position: center; flex-shrink: 0;
}

/* Main */
.main {
  flex: 1;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}
.main .content {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 16px;
  width: 100%;
  scroll-behavior: smooth;
}
/* 激活的 tab 充满主区域成为纵向 flex 列，使内容区可滚动而非被裁切 */
.main > .tab {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.panel {
  /* 与外层 .main 功能面板融合，不再做嵌套子卡片，减少留白与边框层级 */
  background: transparent;
  border: none;
  border-radius: 0;
  box-shadow: none;
  padding: 0;
  min-height: auto;
}

/* Toolbar */
.toolbar {
  display: flex; align-items: center; gap: 10px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}
/* 作为面板头部时（账号/URL 案例等 tab）加底边分隔，与 .page-head 统一 */
.panel > .toolbar {
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}
.panel > .toolbar h3 { margin: 0; font-size: 18px; font-weight: 700; color: var(--ink); display: flex; align-items: center; gap: 8px; }
.spacer { flex: 1; }

/* ===== 主题配置：色卡选择 ===== */
.theme-swatches { display: flex; flex-wrap: wrap; gap: 12px; padding: 4px 0 8px; }
.theme-swatch {
  width: 56px; height: 56px; border-radius: 14px; cursor: pointer; position: relative;
  border: 2px solid transparent; outline: none; padding: 0;
  box-shadow: 0 2px 8px rgba(15, 23, 42, .08), inset 0 0 0 3px rgba(255, 255, 255, .18);
  transition: transform .18s cubic-bezier(.34, 1.4, .64, 1), box-shadow .18s, border-color .18s;
}
.theme-swatch:hover { transform: translateY(-2px) scale(1.05); box-shadow: 0 6px 16px rgba(15, 23, 42, .14), inset 0 0 0 3px rgba(255, 255, 255, .25); }
.theme-swatch.active { border-color: var(--brand, #0B5CAD); box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand, #0B5CAD) 18%, transparent), 0 4px 12px rgba(15, 23, 42, .15); }
.theme-swatch .check { position: absolute; inset: 0; display: grid; place-items: center; color: #fff; opacity: 0; transition: opacity .15s; }
.theme-swatch.active .check { opacity: 1; }
.theme-swatch .check svg { width: 22px; height: 22px; filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .35)); }

/* 自定义颜色输入 */
.theme-custom-picker { width: 40px; height: 36px; padding: 2px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel); cursor: pointer; }
.theme-custom-picker::-webkit-color-swatch-wrapper { padding: 0; }
.theme-custom-picker::-webkit-color-swatch { border: none; border-radius: 6px; }
.theme-custom-hex { width: 140px; padding: 7px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel); color: var(--ink); font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 13px; outline: none; transition: border-color .15s, box-shadow .15s; }
.theme-custom-hex:focus { border-color: var(--brand, #0B5CAD); box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand, #0B5CAD) 14%, transparent); }
.theme-custom-hex.invalid { border-color: #ef4444; box-shadow: 0 0 0 3px rgba(239, 68, 68, .14); }

/* 工具栏按钮随当前板块配色：浅底彩字，主操作用实色，统一风格 */
.toolbar .btn:not(.primary):not(.danger) {
  background: color-mix(in srgb, var(--section-color, var(--brand)) 9%, var(--panel));
  color: var(--section-color, var(--brand));
  border-color: color-mix(in srgb, var(--section-color, var(--brand)) 20%, transparent);
  box-shadow: none;
}
.toolbar .btn:not(.primary):not(.danger):hover {
  color: var(--section-color, var(--brand));
  border-color: var(--section-color, var(--brand));
  background: color-mix(in srgb, var(--section-color, var(--brand)) 15%, var(--panel));
  box-shadow: 0 6px 16px -8px color-mix(in srgb, var(--section-color, var(--brand)) 55%, transparent);
}
.toolbar .btn.primary { background: var(--section-color, var(--brand)); border-color: var(--section-color, var(--brand)); box-shadow: 0 4px 12px -6px color-mix(in srgb, var(--section-color, var(--brand)) 60%, transparent); }
.toolbar .btn.primary:hover { filter: brightness(1.06); color: #fff; box-shadow: 0 10px 22px -8px color-mix(in srgb, var(--section-color, var(--brand)) 60%, transparent); }
/* 视图切换 / 分页也跟随板块色 */
.type-btn:hover { border-color: var(--section-color, var(--brand)); color: var(--section-color, var(--brand)); box-shadow: 0 6px 14px -8px color-mix(in srgb, var(--section-color, var(--brand)) 50%, transparent); }
.type-btn.active { background: var(--section-color, var(--brand)); border-color: var(--section-color, var(--brand)); }
[data-theme="dark"] .type-btn.active { background: var(--section-color, var(--brand)); color: #fff; }

/* 统一页面标题区（与资源管理 .explorer-head 风格一致）：标题 + 描述 + 右侧操作，底边轻线分隔 */
.page-head { display: flex; align-items: center; gap: 14px; margin-bottom: 16px; padding-bottom: 12px; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.page-head .ph-title { margin: 0; font-size: 18px; font-weight: 700; color: var(--ink); display: flex; align-items: center; gap: 8px; }
.page-head .ph-desc { color: var(--muted); font-size: 13px; }
.page-head .spacer { flex: 1; }

.local-search {
  position: relative; width: 240px;
}
.local-search .icon {
  position: absolute; left: 10px; top: 50%; transform: translateY(-50%);
  color: var(--muted); font-size: 13px;
}
.local-search input {
  width: 100%; padding: 8px 12px 8px 32px;
  border: 1px solid var(--line); border-radius: 10px;
  font-size: 14px; outline: none; background: var(--panel); color: var(--ink);
}

/* 智能体管理·列表工具栏：左操作 / 中间弹性空间 / 右搜索+视图切换，避免按钮过多挤一行 */
.agent-list-toolbar { flex-wrap: wrap; row-gap: 8px; }
.agent-list-toolbar-left { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.agent-list-toolbar .local-search { width: 220px; }
@media (max-width: 720px) {
  .agent-list-toolbar-left { flex: 1 1 100%; }
  .agent-list-toolbar .local-search { width: 100%; }
}
.local-search input:focus { border-color: var(--brand); }

.type-filter-wrap { display: inline-flex; align-items: center; gap: 6px; position: relative; }
.type-filter { display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.type-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border: 1px solid var(--line);
  background: var(--bg);
  border-radius: 11px;
  cursor: pointer;
  color: var(--ink);
  box-shadow: 0 1px 2px rgba(15,23,42,.05);
  transition: transform .18s cubic-bezier(.4,0,.2,1), background .18s, color .18s, border-color .18s, box-shadow .18s;
}
.type-btn svg.ico { width: 18px; height: 18px; transition: transform .2s cubic-bezier(.34,1.4,.64,1); }
.type-btn:hover { border-color: var(--brand); color: var(--brand); transform: translateY(-1px); box-shadow: 0 6px 14px -8px rgba(79,70,229,.5); }
.type-btn:hover svg.ico { transform: scale(1.18) translateY(-1px); }
.type-btn:active { transform: translateY(0); }
.type-btn:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
.type-btn.active { background: var(--brand); color: #fff; border-color: var(--brand); box-shadow: 0 6px 16px -8px rgba(79,70,229,.7); }
.type-btn.all { width: auto; padding: 0 12px; font-size: 13px; font-weight: 500; gap: 6px; }
.type-btn.trash { width: auto; padding: 0 12px; font-size: 13px; font-weight: 500; gap: 6px; }
.type-btn.trash.active { background: var(--brand, #0B5CAD); border-color: var(--brand, #0B5CAD); }
[data-theme="dark"] .type-btn { background: var(--bg); }
[data-theme="dark"] .type-btn.active { background: var(--brand); color: #fff; }

/* 筛选按钮显示/隐藏设置 */
.type-filter-gear {
  width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid transparent; border-radius: 11px; background: transparent; color: var(--muted);
  cursor: pointer; transition: background .15s, color .15s, border-color .15s;
}
.type-filter-gear:hover { color: var(--brand); background: var(--brand-soft); border-color: var(--brand); }
.type-filter-gear svg.ico { width: 18px; height: 18px; }
.type-filter-menu {
  position: absolute; top: calc(100% + 6px); right: 0; z-index: 100;
  min-width: 160px; padding: 8px 0; background: var(--panel); border: 1px solid var(--line);
  border-radius: 12px; box-shadow: 0 12px 32px -10px rgba(0,0,0,.2);
  display: flex; flex-direction: column; gap: 2px;
}
.type-filter-menu .tfm-head { padding: 8px 14px; font-size: 12px; font-weight: 600; color: var(--muted); }
.type-filter-menu label {
  display: flex; align-items: center; gap: 10px; padding: 8px 14px; cursor: pointer;
  font-size: 14px; color: var(--ink); transition: background .15s;
}
.type-filter-menu label:hover { background: var(--brand-soft); }
.type-filter-menu input[type="checkbox"] { width: 16px; height: 16px; accent-color: var(--brand); }
[data-theme="dark"] .type-filter-menu { background: var(--panel); border-color: var(--line); }

/* Breadcrumb */
.breadcrumb {
  display: flex; align-items: center; flex-wrap: wrap; gap: 4px 8px;
  font-size: 14px; color: var(--muted);
  margin-bottom: 18px;
  padding: 8px 12px;
  background: var(--bg);
  border-radius: 10px;
  border: 1px solid var(--line);
}
.breadcrumb .crumb {
  color: var(--ink); padding: 2px 6px; border-radius: 6px; transition: 0.15s; cursor: pointer;
}
.breadcrumb .crumb:hover { color: var(--brand); background: var(--brand-soft); }
.breadcrumb .crumb:last-of-type { color: var(--ink); font-weight: 600; }
.breadcrumb .crumb:last-of-type:hover { background: transparent; }
.breadcrumb .sep { color: var(--line); font-size: 12px; }

/* 资源管理头部：与功能区主面板融合为同一平面，只做标题/工具区与文件区的分隔线 */
.explorer-head {
  position: static;
  z-index: 20;
  flex-shrink: 0;
  background: transparent;
  border: none;
  border-radius: 0;
  border-bottom: 1px solid var(--line);
  padding: 0 0 12px;
  margin-bottom: 16px;
  transition: box-shadow .2s ease;
}
.explorer-head .toolbar { margin-bottom: 12px; }
.explorer-head .breadcrumb { margin-bottom: 0; border: none; background: transparent; padding: 0; }
/* 文件区滚动后在头部底边加微阴影，提示内容在下方滚动，但头部本身不浮起 */
.explorer-head.scrolled { box-shadow: 0 12px 24px -16px rgba(15, 23, 42, 0.18); }
[data-theme="dark"] .explorer-head.scrolled { box-shadow: 0 12px 24px -16px rgba(0, 0, 0, 0.45); }

/* 资源管理：工具栏固定，仅文件区（.explorer-body）滚动，避免 sticky 触顶抖动 */
#tabFiles .content { display: flex; flex-direction: column; overflow: visible; }
#tabFiles .panel { flex: 1; min-height: 0; display: flex; flex-direction: column; overflow: hidden; }
#tabFiles .explorer-body { flex: 1; min-height: 0; overflow-y: auto; padding-right: 2px; scroll-behavior: smooth; }
/* 其他管理卡片型模块（urlCases / SOP / agents / workflows / forms），与资源模块一致的"顶部置顶 + 文件区滚动"，
   编辑器视图通过 :not(.xxx-editor) 排除（编辑器布局由各自后续样式单独管理） */
#tabUrlCases > .content,
#tabSop > .content,
#tabAgents > .content,
#tabWorkflows > .content,
#tabForms > .content { display: flex; flex-direction: column; overflow: visible; }
#tabUrlCases > .content > .panel,
#tabSop > .content > .panel:not(.sop-editor),
#tabAgents > .content > .panel:not(.agent-editor),
#tabWorkflows > .content > .panel:not(.wf-editor),
#tabForms > .content > .panel { flex: 1; min-height: 0; display: flex; flex-direction: column; overflow: hidden; }
/* 笔记列表视图的 .content/.panel 已由下方块（#tabNotes）单独设置；这里与其他 5 个模块一起统一 .explorer-body 行为 */
#tabUrlCases > .content .explorer-body,
#tabSop > .content .explorer-body,
#tabAgents > .content .explorer-body,
#tabWorkflows > .content .explorer-body,
#tabNotes > .content .explorer-body,
#tabForms > .content .explorer-body { flex: 1; min-height: 0; overflow-y: auto; padding-right: 2px; scroll-behavior: smooth; }
/* 笔记：编辑区需要确定高度的 flex 上下文，目录与编辑区左右并列（.note-editor 自身是 row） */
#tabNotes .content { display: flex; flex-direction: column; overflow: hidden; }
#tabNotes .panel { flex: 1; min-height: 0; overflow: hidden; }
#tabNotes .panel:not(.note-editor) { display: flex; flex-direction: column; }
#tabNotes .note-editor { flex: 1; min-height: 0; display: flex; flex-direction: column; }
/* 标准作业 SOP：编辑区铺满主区，减少上下/左右留白（padding 与 .main .content 默认 16px 一致，避免内容偏移左上角） */
#tabSop .content { display: flex; flex-direction: column; overflow: hidden; padding: 16px; }
/* 工作流编辑视图：让 .panel 重新成为 flex 列，画布才能铺满区域 */
#tabWorkflows .content.workflows-editor-mode { display: flex; flex-direction: column; overflow: hidden; padding: 0; }
#tabWorkflows .content.workflows-editor-mode .panel.wf-editor { display: flex; flex-direction: column; flex: 1; min-height: 0; padding: 0; gap: 0; }
#tabWorkflows .content.workflows-editor-mode .panel.wf-editor > .explorer-head { flex-shrink: 0; padding: 10px 14px; margin-bottom: 0; background: var(--panel); border-bottom: 1px solid var(--line); }
#tabWorkflows .content.workflows-editor-mode .panel.wf-editor > .wf-editor-body { flex: 1; min-height: 0; display: flex; flex-direction: column; }
#tabWorkflows .content.workflows-editor-mode .panel.wf-editor > .wf-editor-body > .wf-canvas-wrap { flex: 1; min-height: 0; }
#paginationBar {
  background: var(--bg);
  border-top: 1px solid var(--line);
  flex-shrink: 0;
}

/* Buttons */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px;
  border: 1px solid var(--line);
  background: var(--panel);
  color: var(--ink);
  padding: 9px 15px;
  border-radius: 10px;
  cursor: pointer;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.2;
  transition: transform .18s cubic-bezier(.4,0,.2,1), background .18s, color .18s, border-color .18s, box-shadow .18s;
  white-space: nowrap;
  user-select: none;
}
.btn svg.ico { width: 17px; height: 17px; transition: transform .2s cubic-bezier(.34,1.4,.64,1); }
.btn:hover svg.ico { transform: scale(1.08); }
.btn:hover { border-color: var(--brand); color: var(--brand); transform: translateY(-1px); box-shadow: 0 6px 16px -8px rgba(79,70,229,.5); }
.btn:active { transform: translateY(0); box-shadow: none; }
.btn:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
.btn.primary { background: var(--brand); color: #fff; border-color: var(--brand); box-shadow: 0 4px 12px -6px rgba(79,70,229,.6); }
.btn.primary:hover { filter: brightness(1.06); color: #fff; transform: translateY(-1px); box-shadow: 0 10px 22px -8px rgba(79,70,229,.7); }
.btn.accent { background: var(--brand, #0B5CAD); color: #fff; border-color: var(--brand, #0B5CAD); }
.btn.danger { color: var(--danger); border-color: #fecaca; }
.btn.danger:hover { background: #fef2f2; border-color: var(--danger); color: var(--danger); transform: translateY(-1px); }
.logout-btn {
  background: linear-gradient(135deg, #ef4444 0%, #f87171 100%);
  color: #fff; border: none;
  padding: 12px 28px; border-radius: 12px;
  font-size: 15px; font-weight: 600;
  box-shadow: 0 6px 18px -6px rgba(239,68,68,.55);
  transition: transform .2s cubic-bezier(.4,0,.2,1), box-shadow .2s, filter .2s;
}
.logout-btn:hover { transform: translateY(-2px); filter: brightness(1.05); box-shadow: 0 10px 24px -6px rgba(239,68,68,.65); }
.logout-btn:active { transform: translateY(0); box-shadow: 0 4px 12px -4px rgba(239,68,68,.45); }
.logout-btn .logout-icon {
  width: 18px; height: 18px; display: inline-flex; color: #fff; stroke: #fff;
}
.btn.ghost { background: transparent; border-color: transparent; }
.btn.ghost:hover { background: var(--brand-soft); border-color: transparent; box-shadow: none; }
.btn.soft { background: var(--brand-soft); color: var(--brand); border-color: transparent; }
.btn.soft:hover { background: var(--brand-soft); border-color: var(--brand); color: var(--brand); transform: translateY(-1px); }
.btn.sm { padding: 6px 11px; font-size: 13px; border-radius: 8px; }
.btn.sm svg.ico { width: 15px; height: 15px; }
.btn:disabled, .btn[disabled] { opacity: .55; cursor: not-allowed; transform: none; box-shadow: none; }
.btn:disabled:hover { color: var(--ink); border-color: var(--line); box-shadow: none; }

/* 统一 SVG 图标尺寸 */
.ico { display: inline-block; width: 18px; height: 18px; flex-shrink: 0; vertical-align: -0.125em; pointer-events: none; transition: transform .2s cubic-bezier(.34,1.4,.64,1); }
/* 文件夹图标：双色填充，盖板浅、主体深，带立体层次 */
.ico.filled { transition: transform .3s cubic-bezier(.34,1.4,.64,1); }
.ico.filled .fd-front { fill: currentColor; }
.ico.filled .fd-back { fill: currentColor; opacity: .5; transition: transform .3s ease; transform-box: fill-box; transform-origin: 50% 100%; }
.ico.filled .fd-plus { fill: #fff; }
/* 卡片缩略图文件夹：悬停时整体轻放大、盖板微抬起，像被轻轻翻开 */
.folder-card:hover .thumb svg.ico.filled { transform: scale(1.08); }
.folder-card:hover .thumb svg.ico.filled .fd-back { transform: translateY(-2px); }
.sidebar .nav-item:hover .nav-icon { transform: scale(1.06); }
.sidebar .nav-item.active .nav-icon { transform: none; box-shadow: none; filter: none; }
.local-search .icon svg.ico { width: 16px; height: 16px; }
.file-card .thumb svg.ico { width: 48px; height: 48px; }
.folder-card .thumb svg.ico { width: 52px; height: 52px; color: var(--brand); }
/* 渐变类型图标：软质圆角 tile 承载，更有质感 */
.ico.filled-type { transition: transform .3s cubic-bezier(.34,1.4,.64,1); }
.file-card:not(.folder-card) .thumb .icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 70px; height: 70px; border-radius: 18px;
  background: var(--brand-soft);
}
.file-card:not(.folder-card):hover .thumb svg.ico.filled-type { transform: scale(1.09); }
/* 卡片缩略图用暖黄文件夹，找回熟悉的温度感 */
.folder-card .thumb svg.ico.filled .fd-front { fill: #f5a623; }
.folder-card .thumb svg.ico.filled .fd-back { fill: #f5a623; opacity: .5; }
.file-list .thumb-small svg.ico { width: 20px; height: 20px; }
.badge svg.ico { width: 11px; height: 11px; vertical-align: -1px; }
.actions .btn.icon svg.ico { width: 16px; height: 16px; }

/* Cards */
.card {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  overflow: hidden;
}

/* 设置页分组 */
.settings-section {
  margin-bottom: 24px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--line);
}
.settings-section:last-of-type { border-bottom: none; padding-bottom: 0; margin-bottom: 0; }
/* AI 配置区紧凑化：双列网格 + 减小字段间距，让整页一屏内可见 */
.ai-config-section .ai-enable-row { margin-bottom: 10px; }
.ai-config-section .ai-fields-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 8px 14px;
}
.ai-config-section .field { margin-bottom: 0; }
.ai-config-section .field label { margin-bottom: 4px; font-size: 12.5px; }
.ai-config-section .field.full-row { grid-column: 1 / -1; }
.ai-config-section .rag-inline-block { grid-column: 1 / -1; }
.ai-config-section .ai-prompt-ta { min-height: 52px; resize: vertical; font-size: 13px; line-height: 1.5; }
/* 多模型路由（按任务分配模型） */
.mroute-block > label { display: flex; align-items: center; gap: 10px; }
.mroute-toggle { margin-left: auto; }
.mroute-body {
  border: 1px solid var(--line); border-radius: 10px;
  background: var(--bg); padding: 8px;
}
.mroute-list { display: flex; flex-direction: column; gap: 6px; }
.mroute-row {
  display: grid; grid-template-columns: minmax(150px, 1.1fr) minmax(160px, 1.4fr) 56px;
  align-items: center; gap: 10px;
  padding: 6px 8px; border-radius: 8px;
}
.mroute-row:hover { background: var(--brand-soft); }
.mroute-meta { display: flex; flex-direction: column; line-height: 1.35; min-width: 0; }
.mroute-meta b { font-size: 13px; color: var(--ink); }
.mroute-meta .small { font-size: 11.5px; }
.mroute-input { height: 30px; font-size: 12.5px; }
.mroute-eff {
  font-size: 11px; text-align: center; padding: 2px 6px; border-radius: 999px;
  color: var(--muted); background: var(--line);
}
.mroute-eff.on { color: #fff; background: var(--brand); }
.mroute-actions { display: flex; align-items: center; gap: 8px; margin-top: 8px; padding-top: 8px; border-top: 1px dashed var(--line); }
@media (max-width: 720px) {
  .mroute-row { grid-template-columns: 1fr; gap: 4px; }
  .mroute-eff { justify-self: start; }
}
/* 绑定文件夹树形勾选 */
.ai-bind-toolbar { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.ai-bind-selected { font-size: 12px; color: var(--brand); font-weight: 600; flex: 1; }
.ai-bind-folders {
  max-height: 220px; overflow-y: auto;
  border: 1px solid var(--line); border-radius: 10px;
  background: var(--bg); padding: 6px;
}
.ai-bind-hint { font-size: 12px; color: var(--muted); padding: 4px 6px; display: block; }
.ai-bind-node { margin: 1px 0; }
.ai-bind-node.checked > .ai-bind-row { background: var(--brand-soft); color: var(--brand); }
.ai-bind-row {
  display: flex; align-items: center; gap: 6px;
  padding: 4px 8px; border-radius: 7px; cursor: pointer;
  font-size: 13px; color: var(--ink); transition: background .12s;
}
.ai-bind-row:hover { background: color-mix(in srgb, var(--brand) 8%, var(--bg)); }
.ai-bind-cb { width: 15px; height: 15px; accent-color: var(--brand); cursor: pointer; flex: none; }
.ai-bind-ico { font-size: 13px; flex: none; }
.ai-bind-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ai-bind-cnt { font-size: 10.5px; color: var(--muted); flex: none; }
.ai-bind-tw {
  width: 18px; height: 18px; border: none; background: none; cursor: pointer;
  color: var(--muted); font-size: 11px; padding: 0; flex: none; line-height: 1;
}
.ai-bind-tw.leaf { visibility: hidden; }
.ai-bind-children { display: none; margin-left: 20px; border-left: 1px dashed var(--line); padding-left: 6px; }
/* RAG 索引状态：紧凑嵌入到第二列中（与最大上下文并列下方） */
.rag-inline-block {
  grid-column: 1 / -1;
  background: var(--hover);
  border-radius: 10px;
  padding: 10px 14px;
  margin-top: 4px;
  border: 1px solid var(--border);
}
.rag-inline-block > label { display: block; margin-bottom: 6px; font-size: 12.5px; }
.rag-inline-row {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
}
.rag-inline-status { font-size: 12px; color: var(--muted); flex: 1; min-width: 0; }
.ai-config-section .ai-footer { margin-top: 12px; justify-content: flex-start; }
.ai-config-section .ai-cfg-msg { margin-top: 10px; min-height: 18px; }
.settings-title {
  font-size: 15px; font-weight: 700; color: var(--ink);
  margin: 0 0 14px; display: flex; align-items: center; gap: 8px;
}
.settings-section .usage-block {
  margin: 0; padding: 16px 18px;
  background: var(--brand-soft);
  border: 1px solid var(--line);
  border-radius: 14px;
  max-width: 100%;
}

/* 个人中心卡片 */
.profile-card {
  display: flex; flex-direction: column; align-items: center;
  padding: 16px 20px; margin-bottom: 16px;
  background: var(--brand-soft);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
}
.profile-card .avatar-preview {
  width: 80px; height: 80px; border-radius: 50%;
  background: var(--brand); color: #fff; font-size: 28px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 14px;
}
.profile-name { font-size: 18px; font-weight: 700; color: var(--ink); }
.profile-role { font-size: 13px; color: var(--muted); margin-top: 4px; }
.profile-info { margin: 6px 0 4px; border-top: 1px solid var(--line); padding-top: 12px; }
.info-row { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--line); }
.info-row:last-child { border-bottom: none; }
.info-label { font-size: 13px; color: var(--muted); flex-shrink: 0; }
.info-value { font-size: 14px; color: var(--ink); font-weight: 600; text-align: right; word-break: break-all; }

/* 个人中心（紧凑排版：仅显示 + 更换头像 + 修改密码） */
.pc-card {
  display: flex; align-items: center; gap: 16px;
  padding: 18px 20px; margin-bottom: 16px;
  background: var(--brand-soft, rgba(37,99,235,.08));
  border: 1px solid var(--line, #e5e7eb); border-radius: var(--radius-sm, 12px);
}
.pc-avatar {
  width: 64px; height: 64px; border-radius: 50%; flex: 0 0 auto;
  background: var(--brand, #2563eb); color: #fff; font-size: 24px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
  background-size: cover; background-position: center;
}
.pc-id { flex: 1 1 auto; min-width: 0; }
.pc-nickname { font-size: 18px; font-weight: 700; color: var(--ink, #1f2937); line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pc-username { font-size: 13px; color: var(--muted, #6b7280); margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pc-role { display: inline-block; font-size: 12px; color: var(--brand, #2563eb); background: var(--brand-soft, rgba(37,99,235,.12)); padding: 1px 8px; border-radius: 999px; margin-top: 6px; }
.pc-card .btn.sm { flex: 0 0 auto; }
.pc-info { margin: 0 0 4px; border-top: 1px solid var(--line, #e5e7eb); padding-top: 6px; }
.pc-row { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 10px 2px; border-bottom: 1px solid var(--line, #e5e7eb); }
.pc-row:last-child { border-bottom: none; }
.pc-label { font-size: 13px; color: var(--muted, #6b7280); flex-shrink: 0; }
.pc-val { font-size: 14px; color: var(--ink, #1f2937); font-weight: 600; text-align: right; word-break: break-all; }
.pc-divider { height: 1px; background: var(--line, #e5e7eb); margin: 18px 0; }
.pc-row .input { flex: 1 1 auto; min-width: 0; text-align: right; }
.profile-pwd { padding: 4px 0 0; }
.pc-pwd-title { font-size: 14px; font-weight: 700; color: var(--ink, #1f2937); margin-bottom: 10px; }
.profile-pwd .field { margin-bottom: 12px; }
/* ===== 个人中心（紧凑三段：一页内可见） ===== */
.pc-panel { display: flex; flex-direction: column; gap: 14px; padding: 16px 18px; }
.pc-header {
  display: flex; align-items: center; gap: 16px;
  padding: 14px 18px;
  background: var(--brand-soft, rgba(37,99,235,.08));
  border: 1px solid var(--line, #e5e7eb); border-radius: var(--radius-sm, 12px);
}
.pc-header .pc-avatar { width: 60px; height: 60px; flex: 0 0 auto; font-size: 22px; }
.pc-header .pc-id { flex: 1 1 auto; min-width: 0; }
.pc-header .pc-nickname { font-size: 17px; font-weight: 700; color: var(--ink, #1f2937); line-height: 1.3; }
.pc-header .pc-username { font-size: 12.5px; color: var(--muted, #6b7280); margin-top: 2px; }
.pc-header .pc-role { display: inline-block; font-size: 11px; color: var(--brand, #2563eb); background: var(--panel, #fff); padding: 1px 8px; border-radius: 999px; margin-top: 4px; }
.pc-header-actions { flex: 0 0 auto; display: flex; align-items: center; }

.pc-body {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.pc-section-title {
  font-size: 13px; font-weight: 700; color: var(--muted, #6b7280);
  letter-spacing: .3px; text-transform: uppercase;
  margin-bottom: 10px;
}
.pc-info, .pc-pwd {
  padding: 14px 16px;
  background: var(--panel, #fff);
  border: 1px solid var(--line, #e5e7eb); border-radius: var(--radius-sm, 12px);
}
.pc-fields { display: flex; flex-direction: column; gap: 8px; }
.pc-field { display: flex; align-items: center; gap: 10px; padding: 6px 0; }
.pc-field .pc-label { flex: 0 0 80px; font-size: 13px; color: var(--muted, #6b7280); }
.pc-field .input { flex: 1 1 auto; min-width: 0; padding: 7px 10px; font-size: 13.5px; }
.pc-field .pc-val { flex: 1 1 auto; font-size: 13.5px; color: var(--ink, #1f2937); font-weight: 600; }
.pc-info-actions { display: flex; align-items: center; gap: 10px; margin-top: 10px; }

@media (max-width: 720px) {
  .pc-body { grid-template-columns: 1fr; }
  .pc-header { flex-wrap: wrap; }
  .pc-header-actions { width: 100%; justify-content: flex-end; }
}
/* 账号管理（从侧边栏迁入设置面板，位于登录安全上方）：复用主界面 toolbar / 列表样式 */
.sp-section[data-spanel="users"] .explorer-head { margin-top: 4px; }
.sp-section[data-spanel="users"] .explorer-body { padding-top: 4px; }

.file-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 12px;
}
.pagination-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  padding: 12px 0;
}
.pagination-controls {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.pagination-controls .btn:disabled { opacity: 0.45; cursor: not-allowed; border-color: transparent; }
.pagination-controls input[type="number"] { -moz-appearance: textfield; }
.pagination-controls input[type="number"]::-webkit-outer-spin-button,
.pagination-controls input[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.file-card {
  position: relative;
  padding: 12px;
  cursor: pointer;
  transition: 0.15s;
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
}
.file-card:hover { border-color: var(--brand); transform: translateY(-2px); box-shadow: var(--shadow); }
.file-card.selected { border-color: var(--brand); background: var(--brand-soft); }
.file-card .thumb {
  height: 120px;
  /* 通用缩略图（资源管理 + SFV 资源卡共用）：保持资源管理原始浅灰底，不跟随板块色 */
  background: #f3f4f6;
  border: none;
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  overflow: hidden;
  margin-bottom: 12px;
}
.file-card .thumb img { width: 100%; height: 100%; object-fit: cover; }
.file-card .thumb .icon { line-height: 1; color: var(--muted); }
/* 角标也跟随板块色 */
.file-card .badges .badge {
  background: color-mix(in srgb, var(--section-color, var(--brand)) 12%, var(--panel));
  color: var(--section-color, var(--brand));
}

/* 卡片 / 列表加载错落淡入入场动画 */
@keyframes cardReveal { from { opacity: 0; transform: translateY(12px) scale(.98); } to { opacity: 1; transform: none; } }
#fileGrid.reveal-in .file-card,
#fileList.reveal-in tbody tr { animation: cardReveal .5s cubic-bezier(.2,.7,.2,1) both; }
#fileGrid.reveal-in .file-card:nth-child(2){animation-delay:.05s}
#fileGrid.reveal-in .file-card:nth-child(3){animation-delay:.1s}
#fileGrid.reveal-in .file-card:nth-child(4){animation-delay:.15s}
#fileGrid.reveal-in .file-card:nth-child(5){animation-delay:.2s}
#fileGrid.reveal-in .file-card:nth-child(6){animation-delay:.25s}
#fileGrid.reveal-in .file-card:nth-child(7){animation-delay:.3s}
#fileGrid.reveal-in .file-card:nth-child(8){animation-delay:.35s}
#fileGrid.reveal-in .file-card:nth-child(n+9){animation-delay:.4s}
#fileList.reveal-in tbody tr:nth-child(2){animation-delay:.05s}
#fileList.reveal-in tbody tr:nth-child(3){animation-delay:.1s}
#fileList.reveal-in tbody tr:nth-child(4){animation-delay:.15s}
#fileList.reveal-in tbody tr:nth-child(5){animation-delay:.2s}
#fileList.reveal-in tbody tr:nth-child(6){animation-delay:.25s}
#fileList.reveal-in tbody tr:nth-child(7){animation-delay:.3s}
#fileList.reveal-in tbody tr:nth-child(8){animation-delay:.35s}
#fileList.reveal-in tbody tr:nth-child(n+9){animation-delay:.4s}
@media (prefers-reduced-motion: reduce) {
  #fileGrid.reveal-in .file-card,
  #fileList.reveal-in tbody tr { animation: none; }
}
.file-card .title {
  font-size: 14px; font-weight: 500; margin: 0 0 4px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.file-card .meta { font-size: 12px; color: var(--muted); }
.file-card .tags { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 6px; }
.file-card .tags .note-tag-chip { font-size: 11px; padding: 2px 7px; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.file-card .snippet { font-size: 12px; color: var(--muted); line-height: 1.5; margin-top: 6px; max-height: 3.2em; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
/* SFV 实体卡片 description 显示：单行省略（hover title 完整） */
.file-card .desc { font-size: 12px; color: var(--muted); line-height: 1.5; margin: 0 0 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.file-card .badges {
  position: absolute; top: 10px; right: 10px;
  display: flex; gap: 4px;
}
.file-card .badge {
  font-size: 10px; padding: 2px 6px; border-radius: 999px;
  background: rgba(0,0,0,0.55); color: #fff;
}
.file-card .badge-3d {
  background: linear-gradient(90deg, #4f9dff, #8b5cf6); color: #fff; font-weight: 600;
}
.file-card .actions {
  position: absolute; bottom: 10px; right: 10px;
  display: none; gap: 3px;
  background: color-mix(in srgb, var(--panel) 88%, transparent);
  backdrop-filter: blur(6px);
  padding: 3px 4px; border-radius: 8px;
  border: 1px solid var(--line);
  box-shadow: 0 4px 12px -4px rgba(0,0,0,.25);
}
.file-card:hover .actions { display: flex; }
.file-card .actions .btn { padding: 4px 6px; font-size: 12px; border-radius: 5px; min-width: 24px; }

/* 卡片多选 checkbox（左上角悬浮） */
.file-card .card-checkbox {
  position: absolute; top: 8px; left: 8px; z-index: 2;
  opacity: 0; transition: opacity 0.15s;
}
.file-card:hover .card-checkbox,
.file-card.selected .card-checkbox { opacity: 1; }
.card-checkbox input[type="checkbox"] {
  width: 18px; height: 18px; cursor: pointer; accent-color: var(--brand);
  border-radius: 4px;
}
/* 列表视图 checkbox 列 */
.file-list .sel-td { width: 36px; text-align: center; }
.file-list .sel-td input[type="checkbox"] {
  width: 16px; height: 16px; cursor: pointer; accent-color: var(--brand);
}

/* 批量操作条 */
.batch-bar {
  display: flex; align-items: center; gap: 12px;
  padding: 8px 14px; margin-top: 6px;
  background: var(--brand-soft); border-radius: var(--radius-sm);
  border: 1px solid var(--brand); border-color: color-mix(in srgb, var(--brand) 30%, transparent);
}
.batch-bar .batch-select-all {
  display: flex; align-items: center; gap: 6px;
  font-size: 13px; color: var(--ink); cursor: pointer; user-select: none;
}
.batch-bar .batch-select-all input[type="checkbox"] {
  width: 16px; height: 16px; accent-color: var(--brand);
}
.batch-bar .batch-count {
  font-size: 13px; color: var(--muted); margin-right: auto;
}
.batch-bar .btn { border-radius: 8px; padding: 5px 14px; font-size: 13px; }

/* 批量分享结果列表 */
.share-list { display: flex; flex-direction: column; gap: 8px; max-height: 320px; overflow: auto; margin: 6px 0; }
.share-row { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border: 1px solid var(--border, #ececec); border-radius: 10px; background: var(--hover, #fafafa); }
.share-row.failed { opacity: .55; }
.share-row .sr-title { flex: 0 0 150px; min-width: 0; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.share-row .sr-url { flex: 1; min-width: 0; font-size: 12px; color: var(--muted, #666); word-break: break-all; line-height: 1.4; }
.share-row .btn { flex: 0 0 auto; }
[data-theme="dark"] .share-row { background: rgba(255,255,255,.04); }

/* 管理类卡片（URL 案例 / 账号 / SOP）：操作按钮常驻可见，置于卡片底部
   —— 三个按钮等宽（flex:1 1 0 + min-width:0），不因文案/标签长短而大小不一 */
.mgmt-card .actions,
.file-card.mgmt-card:hover .actions {
  position: static;
  display: flex;
  justify-content: stretch;
  gap: 6px;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
}
.mgmt-card .actions .btn {
  flex: 1 1 0;
  min-width: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
  padding: 6px 4px;
  font-size: 12px;
  white-space: nowrap;
  overflow: hidden;
}
.mgmt-card .actions .btn svg { flex: none; }
.mgmt-card .desc {
  font-size: 12px;
  color: var(--muted);
  margin-top: 4px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 32px;
  line-height: 1.4;
}
/* 管理卡片统一为纵向 flex：操作栏始终贴底，保证不同账号卡片底部对齐、布局一致 */
.mgmt-card { display: flex; flex-direction: column; }
.mgmt-card .actions { margin-top: auto; }
/* 所有管理类卡片（最佳实践 / SOP / 智能体 / 工作流 / 笔记 / 表单 / 账号）操作栏
   统一常驻可见（沿用上方 .mgmt-card .actions{display:flex} 默认规则），
   不再依赖 hover 显示——避免“按钮默认隐藏、点了没反应”的可用性陷阱。
   如需 hover 高亮反馈，仅做底色/阴影变化，不改变显隐。 */
/* 标签行：弹性换行 + 间距，避免角色/层级标签长短不一导致错位 */
.file-card .meta { display: flex; flex-wrap: wrap; gap: 5px; align-items: center; }
/* 禁用按钮（如超管不可停用）统一为“锁定”观感，不破坏操作栏布局 */
.mgmt-card .actions .btn:disabled { opacity: .5; cursor: not-allowed; }
/* 统一卡片操作栏（分享 + 更多）：图标按钮不参与等宽拉伸，紧凑右对齐成工具条 */
.mgmt-card .actions { justify-content: flex-end; }
.mgmt-card .actions .btn.icon {
  flex: 0 0 auto;
  min-width: 30px;
  padding: 6px 9px;
}
.mgmt-card .actions .btn.icon svg.ico { width: 15px; height: 15px; }
/* URL 案例缩略图：链接图标跟随板块配色 */
.mgmt-card .thumb .icon { color: var(--section-color, var(--brand)); }
/* 账号头像兜底（首字母圆标） */
.avatar-fallback {
  width: 48px; height: 48px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 20px; font-weight: 700; color: #fff;
  background: linear-gradient(135deg, #1a56db, #3b82f6);
}
/* 状态标签（账号启用 / 禁用） */
.tag-status { font-size: 12px; padding: 2px 8px; border-radius: 999px; white-space: nowrap; }
.tag-status.on { background: #dcfce7; color: #15803d; }
.tag-status.off { background: #fee2e2; color: #b91c1c; }
/* URL 案例 / 账号 网格·列表入场动画（与资源管理一致） */
#urlCaseGrid.reveal-in .file-card,
#userGrid.reveal-in .file-card,
#urlCaseList.reveal-in tbody tr,
#userList.reveal-in tbody tr { animation: cardReveal .5s cubic-bezier(.2,.7,.2,1) both; }

.folder-actions { align-items: center; gap: 6px; }
.actions .btn.icon {
  padding: 4px 6px;
  font-weight: 700;
  line-height: 1;
  font-size: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
#dropdownPortal {
  position: fixed;
  top: 0; left: 0;
  min-width: 110px;
  background: var(--bg-card, #fff);
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.12);
  padding: 4px;
  z-index: 3000;
  visibility: hidden;
  opacity: 0;
  transform: translateY(-4px);
  transition: opacity .12s, transform .12s, visibility .12s;
}
#dropdownPortal.show { visibility: visible; opacity: 1; transform: translateY(0); }
.dropdown-item {
  display: block;
  width: 100%;
  text-align: left;
  padding: 6px 10px;
  border: none;
  background: transparent;
  color: var(--text-primary, #111);
  font-size: 12px;
  border-radius: 6px;
  cursor: pointer;
}
.dropdown-item:hover { background: var(--bg-hover, #f3f4f6); }
.dropdown-item.danger { color: #ef4444; }
.dropdown-item.danger:hover { background: #fee2e2; }
[data-theme="dark"] #dropdownPortal {
  background: var(--bg-card, #1f2937);
  border-color: var(--border, #374151);
  box-shadow: 0 8px 24px rgba(0,0,0,0.35);
}
[data-theme="dark"] .dropdown-item { color: var(--text-primary, #f3f4f6); }
[data-theme="dark"] .dropdown-item:hover { background: var(--bg-hover, #374151); }
[data-theme="dark"] .dropdown-item.danger:hover { background: #451a1a; }
.folder-card .thumb { background: color-mix(in srgb, var(--brand, #0B5CAD) 8%, var(--panel)); }
.folder-card .thumb .icon { line-height: 1; }
[data-theme="dark"] .folder-card .thumb { background: #2a2520; }
.folder-card .meta { font-weight: 500; }

.file-list {
  width: 100%;
  border-collapse: collapse;
  border-radius: var(--radius-sm);
  overflow: hidden;
}
.file-list th, .file-list td {
  text-align: left;
  padding: 12px 14px;
  border-bottom: 1px solid var(--line);
  font-size: 14px;
}
.file-list th { color: var(--muted); font-weight: 500; background: #f9fafb; }
.file-list tr:hover td { background: #f9fafb; }
.file-list .thumb-small {
  width: 36px; height: 36px;
  background: #f3f4f6;
  border-radius: 6px;
  display: inline-flex; align-items: center; justify-content: center;
  margin-right: 10px;
  font-size: 20px;
  overflow: hidden;
  vertical-align: middle;
}
.file-list .thumb-small img { width: 100%; height: 100%; object-fit: cover; }
.file-list .title-cell { display: flex; align-items: center; }
/* 列表模式：文件行可点击打开预览，给出可点击反馈 */
.file-list tbody tr[data-id] { cursor: pointer; transition: background .12s; }
.file-list tbody tr[data-id]:hover td { background: rgba(99,102,241,0.06); }
.file-list tbody tr[data-id]:hover .title-cell { color: var(--brand); }
.file-list tbody tr.selected td,
.file-list tbody tr[data-folder].selected td { background: var(--brand-soft); }

/* Forms */
.input, .textarea, select {
  width: 100%; padding: 10px 12px;
  border: 1px solid var(--line); border-radius: 10px;
  font-size: 14px; font-family: inherit;
  background: #fff; color: var(--ink); outline: none;
}
.input:focus, .textarea:focus { border-color: var(--brand); }
/* 白标未开通时的只读态（付费门禁）：降低对比度 + 禁用光标，明确「不可编辑」 */
.input:disabled, .textarea:disabled, select:disabled {
  opacity: .6; cursor: not-allowed; background: var(--hover, #f4f6f9); color: var(--muted, #8a94a6);
}
/* 设置面板：语言选择器收窄，不再占满整行 */
#settingsLang { max-width: 260px; }
.textarea { min-height: 80px; resize: vertical; }
.field { margin-bottom: 14px; }
.field label { display: block; font-size: 13px; color: var(--muted); margin-bottom: 6px; }
.row { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }

/* Modals */
.modal-mask {
  position: fixed; inset: 0; background: rgba(17, 24, 39, 0.55);
  display: none; align-items: center; justify-content: center; z-index: 40; padding: 20px;
}
.modal-mask.show { display: flex; }
/* §14 UX：确认弹窗（删除/移除/退出等）必须盖在所有其他 modal 之上，避免被添加成员/编辑等子弹窗遮挡 */
.confirm-mask { z-index: 99999; } /* 高于 projMemberMask(1200)、planUpgradeMask(1300)、modal-mask(40) */
.modal { width: 460px; max-width: 100%; padding: 24px; border-radius: var(--radius); max-height: 90vh; overflow-y: auto; }
/* 分享弹窗：加宽、根据内容自适应高度，避免滚动条破坏圆角 */
#shareMask .modal {
  width: 560px;
  max-width: calc(100vw - 40px);
  max-height: none;
  overflow-y: visible;
}
#shareMask .modal h3,
#shareMask .modal .footer { position: relative; top: auto; bottom: auto; background: transparent; border-top: none; padding: 0; }
#shareMask .modal .footer { margin-top: 18px; }
/* 通用 modal-box：与 .modal 视觉一致，供 projMember/planUpgrade/planOrders/ssoQr 等使用 */
.modal-box {
  width: 460px; max-width: 100%; max-height: 90vh; overflow-y: auto;
  padding: 24px; border-radius: var(--radius);
  background: var(--panel); border: 1px solid var(--line); box-shadow: var(--shadow);
  position: relative;
}
.modal-box > .icon-btn {
  position: absolute; top: 14px; right: 16px;
  width: 32px; height: 32px; border: none; border-radius: 8px;
  background: transparent; color: var(--muted); cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 18px; line-height: 1;
  transition: background .15s, color .15s;
}
.modal-box > .icon-btn:hover { background: var(--hover); color: var(--ink); }
[data-theme="dark"] .modal-box { background: var(--panel); border-color: var(--line); box-shadow: 0 30px 80px rgba(0,0,0,.40); }
.modal h3 { margin: 0 0 18px; position: sticky; top: -24px; background: var(--panel); padding-top: 2px; z-index: 1; }
.modal .footer { display: flex; justify-content: flex-end; gap: 10px; margin-top: 20px; position: sticky; bottom: -24px; background: var(--panel); padding: 12px 0 2px; border-top: 1px solid var(--line); z-index: 1; }

/* 用户弹窗：固定头 + 可滚动主体 + 固定底，比例稳定不抖动 */
#userMask .modal {
  width: 540px;
  max-width: calc(100vw - 40px);
  padding: 0;
  max-height: 88vh;
  display: flex;
  flex-direction: column;
}
#userMask .modal-head { padding: 20px 24px 12px; flex: 0 0 auto; }
/* 抵消通用 .modal h3 的 sticky 设定，避免在 flex 弹窗里错位、漏出背景 */
#userMask .modal-head h3 { margin: 0; position: static; top: auto; background: transparent; padding-top: 0; }
#userMask .modal-body { padding: 0 24px 4px; overflow-y: auto; flex: 1 1 auto; }
#userMask .modal-body .avatar-preview { margin-bottom: 8px; }
#userMask .modal-foot {
  padding: 14px 24px;
  flex: 0 0 auto;
  display: flex; justify-content: flex-end; gap: 10px;
  border-top: 1px solid var(--line);
}
.form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: start;
  gap: 12px 16px;
  margin-bottom: 10px;
}
.form-grid .field { margin-bottom: 0; }
.form-grid .field label { margin-bottom: 4px; }
.form-grid .field-hint {
  font-size: 11px;
  color: var(--muted);
  margin-top: 4px;
  line-height: 1.3;
}
.readonly-plain {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  font-size: 14px;
  background: var(--bg-soft, rgba(99,102,241,0.05));
  color: var(--ink);
  user-select: none;
}
[data-theme="dark"] .readonly-plain {
  background: rgba(255,255,255,0.06);
  border-color: var(--line, #374151);
}

/* 系统设置页：存储用量块只占半区域，进度条在块内占满 */
.settings-section .usage-bar { max-width: 100%; }

/* 存储管理：服务器硬盘信息 */
.disk-info { font-size: 12px; color: var(--muted); }
.disk-row { display: flex; justify-content: space-between; gap: 12px; padding: 6px 0; border-bottom: 1px dashed var(--line); }
.disk-row:last-child { border-bottom: none; }
.disk-row span:last-child { color: var(--text-primary); font-weight: 600; text-align: right; }
/* 分享二维码中央 eagar logo 叠加层 */
#qr, .share-qr { position: relative; display: inline-block; line-height: 0; }
#qr img, #qr canvas, .share-qr img, .share-qr canvas { display: block; }
.share-qr-wrap {
  display: inline-block; text-align: center;
  background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 12px;
}
.share-qr-wrap .hint { color: var(--muted); margin: 6px 0 0; }
.qr-logo {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
  width: 58px; height: 22px; padding: 4px 6px; background: #fff; border-radius: 11px;
  box-shadow: 0 0 0 3px #fff; z-index: 2;
}
.qr-logo img { display: block; width: 100%; height: 100%; object-fit: contain; }
/* 暗色主题：二维码反色为黑底白码（始终清晰可见），白 logo 保持原图不做反色 */
[data-theme="dark"] .share-qr-wrap { background: #fff; border-color: var(--line); }
[data-theme="dark"] .share-qr > img,
[data-theme="dark"] .share-qr > canvas,
[data-theme="dark"] #qr > img,
[data-theme="dark"] #qr > canvas { filter: invert(1) hue-rotate(180deg); }
[data-theme="dark"] .qr-logo { background: #1f2937; box-shadow: 0 0 0 3px #1f2937; }

/* 通用确认弹窗(替代原生 confirm,无浏览器标题栏且居中) */
.confirm-mask { align-items: center !important; justify-content: center; }
.confirm-dialog { width: 360px; max-width: 100%; text-align: center; }
.confirm-msg { margin: 8px 0 24px; font-size: 15px; line-height: 1.6; }
.confirm-dialog .footer { justify-content: center; margin-top: 4px; }

/* User table */
.user-table { width: 100%; border-collapse: collapse; table-layout: auto; min-width: 880px; }
.user-table th, .user-table td { padding: 12px 14px; border-bottom: 1px solid var(--line); text-align: left; font-size: 14px; white-space: nowrap; vertical-align: middle; }
.user-table th { color: var(--muted); font-weight: 500; background: #f9fafb; }
.user-table td { background: var(--panel); }
.user-table tr:hover td { background: var(--bg); }
.user-table th:first-child, .user-table td:first-child { width: 100%; }
.user-table th:nth-child(2), .user-table td:nth-child(2),
.user-table th:nth-child(3), .user-table td:nth-child(3),
.user-table th:nth-child(4), .user-table td:nth-child(4) { white-space: nowrap; }
.user-table th:last-child, .user-table td:last-child { width: 1%; white-space: nowrap; }
.url-case-table td { vertical-align: top; }
.url-case-table td a { color: var(--brand); word-break: break-all; }

/* ACL 弹窗内共享范围表格：宽度已统一为 780px（见下方分享弹窗统一规则），此处仅调整表格列 */
#aclMask .user-table { display: table; min-width: 0; }
#aclMask .user-table th:first-child,
#aclMask .user-table td:first-child { width: auto; white-space: normal; word-break: break-word; }
#aclMask .user-table th:nth-child(2),
#aclMask .user-table td:nth-child(2) { width: 1%; white-space: nowrap; }
#aclMask .user-table th:last-child,
#aclMask .user-table td:last-child { width: 1%; white-space: nowrap; }
.url-case-table td a:hover { text-decoration: underline; }
.url-case-table td.muted { max-width: 320px; }
.tag-role { font-size: 12px; padding: 2px 8px; border-radius: 999px; background: var(--brand-soft); color: var(--brand); }
.tag-role.admin { background: #ffedd5; color: var(--accent); }
[data-theme="dark"] .tag-role { background: rgba(59,130,246,.18); color: #93bbfd; }
[data-theme="dark"] .tag-role.admin { background: rgba(251,146,60,.18); color: #fdba74; }
.tag-level { font-size: 12px; padding: 2px 8px; border-radius: 999px; background: #e0e7ff; color: #4338ca; }
.tag-level.lvl-0 { background: #fef3c7; color: #b45309; }
.tag-level.lvl-1 { background: #e0e7ff; color: #4338ca; }
.tag-level.lvl-2 { background: #f1f5f9; color: #475569; }
.tag-cap { font-size: 12px; padding: 2px 8px; border-radius: 999px; white-space: nowrap; }
.tag-cap.on { background: #dcfce7; color: #15803d; }
.tag-cap.off { background: #f1f5f9; color: #64748b; }
.tag-cap.danger { background: #fee2e2; color: #b91c1c; }

/* Folder select tree */
.folder-select-tree { max-height: 320px; overflow-y: auto; border: 1px solid var(--line); border-radius: 10px; padding: 8px; }
.folder-select-row {
  display: flex; align-items: center; gap: 8px;
  padding: 8px 10px; border-radius: 6px; cursor: pointer;
}
.folder-select-row:hover { background: #f3f4f6; }
.folder-select-row.selected { background: var(--brand-soft); color: var(--brand); }
.tree-toggle {
  display: inline-flex; align-items: center; justify-content: center;
  width: 20px; height: 20px; border-radius: 5px;
  color: var(--muted); cursor: pointer;
  flex-shrink: 0; pointer-events: auto;
  transition: background .15s, color .15s;
}
.tree-toggle:hover {
  background: var(--line); color: var(--ink);
}
.folder-select-row.selected .tree-toggle:hover {
  background: rgba(79, 70, 229, 0.18);
}
.tree-toggle svg.ico { width: 16px; height: 16px; }
.tree-toggle-spacer {
  display: inline-flex; width: 20px; height: 20px; flex-shrink: 0;
}
.tree-children { padding-left: 18px; }
[data-theme="dark"] .folder-select-row:hover { background: #1f2937; }
[data-theme="dark"] .tree-toggle:hover { background: #374151; color: var(--ink); }
[data-theme="dark"] .folder-select-row.selected .tree-toggle:hover { background: rgba(99, 102, 241, 0.25); }
.move-new-folder {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 12px;
  min-height: 36px;
}
.move-new-folder .btn { flex-shrink: 0; }
.move-new-folder-form {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1;
}
.move-new-folder-form .input { flex: 1; min-width: 0; }

/* Toast */
.toast {
  position: fixed; left: 50%; bottom: 28px; transform: translateX(-50%);
  background: #1f2937; color: #fff; padding: 10px 18px; border-radius: 10px;
  font-size: 14px; opacity: 0; transition: 0.2s; pointer-events: none; z-index: 10000;
}
.toast.show { opacity: 1; }

.empty { text-align: center; color: var(--muted); padding: 60px 20px; }

.check { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--ink); cursor: pointer; }
.check input { width: 16px; height: 16px; }

/* Preview page */
.topbar-public {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 24px; background: var(--panel);
  border: 1px solid var(--line); border-radius: var(--radius);
  margin: var(--gap);
  box-shadow: var(--shadow);
}
.topbar-public .brand { display: flex; align-items: center; gap: 10px; font-weight: 700; }
.topbar-public .brand img { height: 28px; }
.topbar-public .brand .brand-name { display: inline-flex; align-items: baseline; gap: 2px; }
.topbar-public .brand .brand-gs { color: var(--ink); font-weight: 800; letter-spacing: -0.3px; }
.topbar-public .brand .brand-tw { color: var(--brand); font-weight: 800; letter-spacing: -0.3px; }
body > .content { margin: 0 auto var(--gap); }
.preview-wrap { max-width: 960px; margin: 0 auto; padding: 24px; }
.preview-head { display: flex; align-items: flex-start; gap: 16px; margin-bottom: 18px; }
.preview-head h1 { margin: 0 0 6px; font-size: 22px; }
.preview-head .desc { color: var(--muted); }
.player-box {
  position: relative;
  background: #000; border-radius: var(--radius); overflow: hidden;
  display: flex; align-items: center; justify-content: center;
  width: 100%; height: min(72vh, 820px); min-height: 320px;
}
.player-box video, .player-box img { max-width: 100%; max-height: 100%; object-fit: contain; display: block; transition: opacity .3s ease; }
.player-box img.zoomable {
  transform-origin: center center; will-change: transform;
  transition: transform .14s ease-out, opacity .3s ease;
  cursor: grab; -webkit-user-drag: none; user-select: none; touch-action: none;
}
.player-box.grabbing img.zoomable { transition: none; cursor: grabbing; }
.player-box.grabbing { cursor: grabbing; }
/* 图片缩放工具栏（放大 / 缩小 / 比例 / 复位） */
.img-zoom-bar {
  position: absolute; left: 50%; bottom: 14px; transform: translateX(-50%);
  z-index: 8; display: flex; align-items: center; gap: 6px;
  padding: 6px 8px; border-radius: 999px;
  background: rgba(15, 18, 28, 0.55); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  border: 1px solid rgba(255,255,255,0.12); box-shadow: 0 6px 20px rgba(0,0,0,0.35);
}
.img-zoom-btn {
  width: 32px; height: 32px; border: none; border-radius: 50%;
  background: rgba(255,255,255,0.1); color: #fff; font-size: 18px; line-height: 1;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: background .2s ease, transform .15s ease;
}
.img-zoom-btn:hover { background: var(--brand); transform: scale(1.08); }
.img-zoom-btn:active { transform: scale(.92); }
.img-zoom-label {
  min-width: 52px; text-align: center; font-size: 13px; font-weight: 600; color: #fff;
  font-variant-numeric: tabular-nums;
}
.fs-btn {
  position: absolute; top: 10px; right: 10px; z-index: 7;
  width: 38px; height: 38px; border: none; border-radius: 8px;
  background: rgba(0,0,0,0.45); color: #fff; font-size: 18px; line-height: 1;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
}
.fs-btn:hover { background: rgba(0,0,0,0.65); }
.player-box:fullscreen { background: #000; display: flex; align-items: center; justify-content: center; }
.player-box:fullscreen video, .player-box:fullscreen img { max-width: 100%; max-height: 100%; width: 100%; height: 100%; object-fit: contain; }
.player-box:fullscreen .fs-btn { z-index: 10; }
/* PDF 预览：顶部固定工具栏 + 下方独立滚动区，所有页可逐页滚动浏览（不再依赖整页滚动） */
.pdf-container { width: 100%; height: calc(100vh - 170px); min-height: 420px; display: flex; flex-direction: column; background: var(--panel); border-radius: var(--radius); border: 1px solid var(--line); overflow: hidden; }
.pdf-scroller { flex: 1; overflow-y: auto; overflow-x: hidden; width: 100%; display: flex; flex-direction: column; align-items: center; gap: 16px; padding: 16px 0; scroll-behavior: smooth; }
.pdf-page-wrap { width: 100%; min-height: 200px; height: auto; display: flex; justify-content: center; align-items: flex-start; flex: 0 0 auto; }
.pdf-page-wrap .pdf-placeholder { color: var(--muted); padding: 40px; text-align: center; }
.pdf-canvas { border-radius: 8px; margin: 0 auto; box-shadow: var(--shadow); background: #fff; display: block; max-width: 100%; height: auto; }
.pdf-loading { text-align: center; color: var(--muted); padding: 40px; }
.pdf-tools {
  display: flex; align-items: center; justify-content: center; gap: 12px;
  padding: 10px 16px; background: var(--bg); border-bottom: 1px solid var(--line);
  font-size: 14px; color: var(--muted); flex-shrink: 0;
}
.pdf-tool-btn {
  width: 32px; height: 32px; border: none; border-radius: 6px;
  background: var(--panel); color: var(--text); font-size: 18px; line-height: 1;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: background .2s ease, color .2s ease;
}
.pdf-tool-btn:hover { background: var(--brand); color: #fff; }
.pdf-tool-btn:disabled { opacity: .4; cursor: not-allowed; }
.pdf-tool-sep { width: 1px; height: 20px; background: var(--line); margin: 0 4px; }
#pdfPageInfo, #pdfZoomInfo { min-width: 56px; text-align: center; font-variant-numeric: tabular-nums; }

.office-preview-box { width: 100%; height: calc(100vh - 220px); min-height: 420px; background: var(--panel); border-radius: var(--radius); overflow: hidden; border: 1px solid var(--line); display: flex; flex-direction: column; }
.office-mode-bar { padding: 10px 16px; background: var(--bg); border-bottom: 1px solid var(--line); display: flex; justify-content: center; flex-shrink: 0; }
.office-mode-switch { display: inline-flex; gap: 8px; border: 1px solid var(--line); border-radius: 8px; padding: 4px; background: var(--panel); }
.office-mode-btn { border: none; border-radius: 6px; padding: 6px 14px; background: transparent; color: var(--text); cursor: pointer; font-size: 14px; transition: background .2s ease, color .2s ease; }
.office-mode-btn:hover { background: var(--bg); }
.office-mode-btn.active { background: var(--brand); color: #fff; }
.office-container { flex: 1; width: 100%; overflow-y: auto; overflow-x: hidden; min-height: 0; }
.office-html-pane { padding: 24px; background: #fff; min-height: 100%; }
.office-html-body { font-family: "PingFang SC", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif; font-size: 15px; line-height: 1.8; color: #222; max-width: 900px; margin: 0 auto; }
.office-html-body p { margin: 0 0 12px; }
.office-html-body h1, .office-html-body h2, .office-html-body h3 { margin: 18px 0 10px; color: #111; }
.office-html-body h1.title { font-size: 24px; border-bottom: 1px solid #eee; padding-bottom: 8px; }
.office-html-body table { border-collapse: collapse; width: 100%; margin: 12px 0; table-layout: auto; max-width: 100%; }
.office-html-body td, .office-html-body th { border: 1px solid #ddd; padding: 6px 8px; }
.office-html-body img { max-width: 100%; height: auto; display: block; margin: 12px 0; }
.office-html-body ul, .office-html-body ol { margin: 12px 0; padding-left: 24px; }
.office-html-body li { margin-bottom: 6px; }
.office-sheet-title { font-size: 16px; margin: 16px 0 8px; color: var(--text); }
.xlsx-table { width: 100%; border-collapse: collapse; font-size: 14px; background: #fff; color: #222; }
.xlsx-table th, .xlsx-table td { border: 1px solid #ddd; padding: 6px 8px; text-align: left; }
.xlsx-table th { background: #f5f5f5; font-weight: 600; }
.office-frame { width: 100%; height: 78vh; border: 0; border-radius: var(--radius); }

.share-panel {
  display: flex; gap: 20px; flex-wrap: wrap; align-items: center;
  padding: 18px; margin-top: 18px;
}
/* .qr-box 已弃用：分享二维码统一改用 .share-qr-wrap / .share-qr 结构（与最佳实践一致，logo 居中且暗色不变黑） */
.share-link { flex: 1; min-width: 240px; }
.share-link .input { font-family: monospace; }

.watermarked { position: relative; }
.wm-layer {
  position: absolute; inset: 0; z-index: 6; pointer-events: none; overflow: hidden;
  display: flex; flex-wrap: wrap; align-content: center; justify-content: center;
  gap: 38px 64px; transform: rotate(-18deg); opacity: 0.55;
}
.wm-layer span {
  font-size: 13px; font-weight: 600; white-space: nowrap;
  color: rgba(255,255,255,0.42); text-shadow: 0 0 2px rgba(0,0,0,0.45);
}
.wm-layer.on-light span { color: rgba(40,40,40,0.30); text-shadow: 0 0 1px rgba(255,255,255,0.7); }

/* 图片预览翻页控件 */
/* 图片翻页控件：覆盖在图片组件框内部（左右翻页箭头 + 居中计数） */
.gallery-nav {
  position: absolute; inset: 0; z-index: 6; pointer-events: none; user-select: none;
}
.gallery-nav .gallery-btn {
  position: absolute; top: 50%; transform: translateY(-50%); pointer-events: auto;
  width: 46px; height: 46px; border: none; border-radius: 50%;
  background: rgba(15, 18, 28, 0.55); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  border: 1px solid rgba(255,255,255,0.12); box-shadow: 0 6px 20px rgba(0,0,0,0.35);
  color: #fff; font-size: 26px; line-height: 1;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: background .2s ease, transform .15s ease;
}
.gallery-nav .gallery-btn:hover:not(:disabled) { background: var(--brand); transform: translateY(-50%) scale(1.08); }
.gallery-nav .gallery-btn:disabled { opacity: 0.3; cursor: default; }
.gallery-nav .gallery-btn:active:not(:disabled) { transform: translateY(-50%) scale(.95); }
.gallery-nav #galleryPrev { left: 12px; }
.gallery-nav #galleryNext { right: 12px; }
.gallery-counter {
  position: absolute; top: 14px; left: 50%; transform: translateX(-50%); pointer-events: auto;
  font-size: 13px; font-weight: 600; color: #fff; min-width: 60px; text-align: center;
  padding: 4px 12px; border-radius: 999px;
  background: rgba(15, 18, 28, 0.55); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  border: 1px solid rgba(255,255,255,0.12);
}

/* 视频网格缩略图占位（客户端帧捕获） */
.video-thumb-placeholder {
  width: 100%; height: 100%; min-height: 120px;
  background: #0f131a; display: flex; align-items: center; justify-content: center;
  transition: background-image .3s ease;
  background-size: cover; background-position: center;
}
.video-thumb-placeholder .play-icon {
  font-size: 32px; color: rgba(255,255,255,0.8);
  text-shadow: 0 1px 6px rgba(0,0,0,0.6);
  pointer-events: none; transition: transform .2s;
}
.video-thumb-small {
  display: inline-flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; border-radius: 6px;
  background: #0f131a; vertical-align: middle;
  background-size: cover; background-position: center;
}
.video-thumb-small .play-icon-sm {
  font-size: 16px; color: rgba(255,255,255,0.7);
  text-shadow: 0 1px 3px rgba(0,0,0,0.5);
  pointer-events: none;
}
.home-result-thumb .video-thumb-placeholder {
  width: 80px; height: 56px; min-height: 0; border-radius: 6px;
}
.home-result-thumb .video-thumb-placeholder .play-icon {
  font-size: 20px;
}

/* AI */
.chat { max-height: 320px; overflow-y: auto; padding: 12px; background: #f7f9fc; border: 1px solid var(--line); border-radius: 10px; margin-bottom: 4px; }
.msg { margin-bottom: 12px; display: flex; flex-direction: column; }
.msg.user { align-items: flex-end; }
.msg .bubble { max-width: 85%; padding: 10px 12px; border-radius: 12px; line-height: 1.5; white-space: pre-wrap; word-break: break-word; }
.msg.user .bubble { background: var(--brand); color: #fff; }
.msg.bot .bubble { background: #fff; border: 1px solid var(--line); }
.msg .src { font-size: 11px; color: var(--muted); margin-top: 3px; }
.sum-body { white-space: pre-wrap; line-height: 1.7; max-height: 50vh; overflow-y: auto; }

/* ===== AI 悬浮助手 ===== */
.ai-fab {
  position: fixed; right: 24px; bottom: 24px; z-index: 90;
  width: 48px; height: 48px; border-radius: 50%;
  border: none; padding: 0; cursor: grab;
  background: transparent; box-shadow: 0 8px 24px rgba(99, 102, 241, 0.35);
  transition: transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .25s, right .3s ease;
  touch-action: none;
}
.ai-fab.dragging { cursor: grabbing; transition: none; box-shadow: 0 14px 40px rgba(99,102,241,.5); }
.ai-fab:hover { transform: scale(1.08) translateY(-2px); box-shadow: 0 12px 32px rgba(99, 102, 241, 0.45); }
.ai-fab:active { transform: scale(1); }
/* 吸附折叠到右侧：半圆露出，hover 滑出 */
.ai-fab.snapped {
  right: 0; left: auto; transform: translateX(50%);
  cursor: pointer;
}
.ai-fab.snapped:hover { transform: translateX(0); }
.ai-fab-avatar { width: 48px; height: 48px; border-radius: 50%; overflow: hidden; display: block; pointer-events: none; background: var(--panel); }
.ai-fab-avatar svg { width: 100%; height: 100%; display: block; }
.ai-fab-avatar-img { width: 100%; height: 100%; object-fit: cover; object-position: center 25%; display: block; border-radius: 50%; }
#fabHeadAvatar { width: 40px; height: 40px; border-radius: 50%; overflow: hidden; flex-shrink: 0; }
#fabHeadAvatar .gsc-avatar-label { display: none; }
.fab-icon-btn.muted { opacity: .55; }
.ai-fab-window {
  position: fixed; right: 24px; bottom: 80px; z-index: 91;
  width: 420px; max-width: calc(100vw - 32px); max-height: calc(100vh - 120px);
  display: none; flex-direction: column;
  background: var(--panel); border: 1px solid var(--line);
  border-radius: 18px; box-shadow: 0 20px 60px rgba(0,0,0,0.18);
  overflow: hidden;
  transform-origin: bottom right;
  animation: fabPop .25s cubic-bezier(.2,.7,.2,1);
}
.ai-fab-window.open { display: flex; }
@keyframes fabPop { from { opacity: 0; transform: scale(.92) translateY(10px); } to { opacity: 1; transform: none; } }
.ai-fab-head {
  display: flex; align-items: center; gap: 12px;
  padding: 14px 16px; border-bottom: 1px solid var(--line);
  background: color-mix(in srgb, #8b5cf6 8%, var(--panel));
}
.ai-fab-head .ai-fab-avatar.sm { width: 40px; height: 40px; border-radius: 50%; flex-shrink: 0; }
.ai-fab-info { flex: 1; min-width: 0; }
.ai-fab-title { font-size: 15px; font-weight: 700; color: var(--ink); }
.ai-fab-status { font-size: 12px; color: var(--muted); margin-top: 1px; }
.ai-fab-close {
  width: 32px; height: 32px; border-radius: 50%; border: 1px solid transparent;
  background: transparent; color: var(--muted); cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  transition: background .15s, color .15s;
}
.ai-fab-close:hover { background: var(--bg); color: var(--ink); }
.ai-fab-body {
  flex: 1; min-height: 400px; max-height: calc(100vh - 240px); overflow-y: auto;
  padding: 14px; background: color-mix(in srgb, var(--bg) 60%, var(--panel));
}
.ai-fab-body .msg { margin-bottom: 14px; }
.ai-fab-body .msg .bubble { max-width: 88%; }
.ai-fab-body .msg.bot .bubble { background: var(--panel); border: 1px solid var(--line); color: var(--ink); }
.ai-fab-body .msg.user .bubble { background: var(--brand); color: #fff; }
.ai-fab-body .msg .bubble .fab-msg-imgs { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 6px; }
.ai-fab-body .msg .bubble .fab-msg-imgs img { width: 72px; height: 72px; object-fit: cover; border-radius: 8px; border: 1px solid rgba(255,255,255,.3); }
/* 附件条（已选图片预览） */
.ai-fab-attach {
  display: flex; flex-wrap: wrap; gap: 8px;
  padding: 8px 14px 0; background: var(--panel);
}
.ai-fab-attach .fab-img-chip {
  position: relative; width: 64px; height: 64px; border-radius: 10px; overflow: hidden;
  border: 1px solid var(--line);
}
.ai-fab-attach .fab-img-chip img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ai-fab-attach .fab-img-chip button {
  position: absolute; top: 2px; right: 2px; width: 18px; height: 18px;
  border: none; border-radius: 50%; background: rgba(0,0,0,.6); color: #fff;
  font-size: 11px; line-height: 1; cursor: pointer; display: grid; place-items: center;
}
/* AI 助手检索模式分段控件（知识库快速 / 知识库深度 / 互联网） */
.fab-mode-row { padding: 8px 12px 0; }
.fab-mode-seg {
  display: flex; gap: 2px; padding: 2px; border-radius: 9px;
  background: var(--bg); border: 1px solid var(--line);
}
.fab-mode-btn {
  flex: 1; min-width: 0; padding: 4px 6px; border: none; border-radius: 7px;
  background: transparent; color: var(--muted); font-size: 11.5px; cursor: pointer;
  white-space: nowrap; transition: background .15s, color .15s;
}
.fab-mode-btn:hover { color: var(--ink); }
.fab-mode-btn.on { background: var(--brand); color: #fff; font-weight: 600; }
.fab-mode-btn.on:hover { color: #fff; }
.msg .src.web-note { color: #b45309; margin-top: 4px; font-size: 11px; }
[data-theme="dark"] .msg .src.web-note { color: #f59e0b; }

/* ===== 引用定位到段落（#812）===== */
.msg .src.rag-refs { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; margin-top: 5px; }
.rag-refs-label { color: var(--muted); font-size: 11px; }
a.rag-ref {
  display: inline-flex; align-items: center; gap: 4px; max-width: 100%;
  padding: 2px 8px 2px 3px; border: 1px solid var(--border); border-radius: 999px;
  background: var(--panel-2, var(--panel)); color: var(--text); font-size: 11px;
  text-decoration: none; line-height: 1.6; transition: border-color .15s, background .15s;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
a.rag-ref:hover { border-color: var(--primary); background: var(--hover, rgba(0,0,0,.04)); }
.rag-ref-n {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 15px; height: 15px; border-radius: 50%; flex: 0 0 auto;
  background: var(--primary); color: #fff; font-size: 10px; font-weight: 600;
}
.rag-ref-seg { color: var(--muted); font-size: 10px; margin-left: 2px; }
mark.rag-anchor {
  background: #fde68a; color: inherit; border-radius: 3px; padding: 1px 0;
  box-shadow: 0 0 0 3px #fde68a; transition: background .8s, box-shadow .8s;
}
mark.rag-anchor.rag-anchor-fade { background: #fef3c7; box-shadow: 0 0 0 3px #fef3c7; }
[data-theme="dark"] mark.rag-anchor { background: #78350f; color: #fde68a; box-shadow: 0 0 0 3px #78350f; }
[data-theme="dark"] mark.rag-anchor.rag-anchor-fade { background: #451a03; box-shadow: 0 0 0 3px #451a03; }
.ai-fab-foot {
  display: flex; align-items: center; gap: 8px;
  padding: 12px 14px; border-top: 1px solid var(--line); background: var(--panel);
}
.ai-fab-foot .input { flex: 1; min-width: 0; border-radius: 10px; }
.ai-fab-foot .btn { flex-shrink: 0; border-radius: 10px; }
.fab-icon-btn {
  flex: none; width: 34px; height: 34px; border-radius: 50%;
  border: 1px solid var(--line); background: var(--bg); color: var(--muted);
  font-size: 15px; cursor: pointer; display: grid; place-items: center;
  transition: background .15s, color .15s, transform .12s, opacity .15s;
}
.fab-icon-btn:hover { background: var(--brand-soft); color: var(--brand); transform: translateY(-1px); }
.agent-debug-tts { padding: 0 10px; }
.agent-debug-tts.muted { opacity: .55; }
.fab-icon-btn.active { background: #fee2e2; color: #ef4444; border-color: #fca5a5; animation: micPulse 1.2s infinite; }
@keyframes micPulse { 0%,100% { box-shadow: 0 0 0 0 rgba(239,68,68,.3); } 50% { box-shadow: 0 0 0 6px rgba(239,68,68,.12); } }
[data-theme="dark"] .ai-fab-window { background: var(--panel); border-color: var(--line); box-shadow: 0 20px 60px rgba(0,0,0,0.45); }
[data-theme="dark"] .ai-fab-head { background: color-mix(in srgb, #8b5cf6 10%, var(--panel)); border-color: var(--line); }
[data-theme="dark"] .ai-fab-body { background: color-mix(in srgb, #0f1420 70%, var(--panel)); }
[data-theme="dark"] .ai-fab-body .msg.bot .bubble { background: var(--panel); border-color: var(--line); color: var(--ink); }
[data-theme="dark"] .ai-fab-close:hover { background: #1d2433; }
@media (max-width: 768px) {
  .ai-fab { right: 16px; bottom: 16px; width: 44px; height: 44px; }
  .ai-fab-avatar { width: 44px; height: 44px; }
  .ai-fab-window { right: 12px; left: 12px; bottom: 68px; width: auto; max-height: 70vh; }
}

/* ===== 主页 / AI 搜索（ima 风格中央大输入框） ===== */
.home-content .panel { display: flex; flex-direction: column; }
.home-hero {
  display: flex; flex-direction: column; align-items: center;
  padding: 56px 0 28px; text-align: center;
}
.home-brand { display: flex; align-items: center; gap: 12px; }
.home-logo svg.ico { width: 40px; height: 40px; color: var(--brand); }
.home-title { margin: 0; font-size: 30px; font-weight: 800; background: linear-gradient(135deg, var(--brand), #3b82f6); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.home-subtitle { color: var(--muted); font-size: 15px; margin: 10px 0 0; }

.home-search-wrap { max-width: 760px; width: 100%; margin: 0 auto 16px; position: relative; }
.home-search-box {
  background: var(--panel);
  border: 1.5px solid var(--line);
  border-radius: 22px;
  box-shadow: var(--shadow);
  transition: border-color .2s, box-shadow .2s;
  overflow: visible;
  position: relative;
}
.home-search-box:focus-within { border-color: var(--brand); box-shadow: 0 10px 32px -10px rgba(99,102,241,.28); }

/* 顶部工具条（模型 + 附件 + 思考模式） */
.home-search-toolbar {
  display: flex; align-items: center; gap: 8px;
  padding: 10px 12px 0;
}
.home-model-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 5px 10px 5px 8px;
  background: var(--hover); border: 1px solid var(--line);
  border-radius: 999px; cursor: pointer;
  font-size: 13px; font-weight: 600; color: var(--ink);
  transition: background .15s, border-color .15s, color .15s;
}
.home-model-btn:hover { background: var(--primary-soft, var(--brand-soft)); border-color: var(--brand); color: var(--brand); }
.home-model-btn.on { background: var(--brand-soft, rgba(99,102,241,.1)); border-color: var(--brand); color: var(--brand); }
.home-model-icon svg.ico { width: 14px; height: 14px; }
.home-model-label { white-space: nowrap; }
.home-model-caret { font-size: 10px; opacity: .7; }

.home-attach-btn {
  width: 30px; height: 30px; border-radius: 50%;
  display: grid; place-items: center; cursor: pointer;
  background: var(--hover); border: 1px solid var(--line); color: var(--muted);
  transition: background .15s, color .15s, border-color .15s;
}
.home-attach-btn:hover { background: var(--brand-soft, rgba(99,102,241,.1)); border-color: var(--brand); color: var(--brand); }
.home-attach-btn.on { background: var(--brand); border-color: var(--brand); color: #fff; }
.home-attach-btn svg.ico { width: 16px; height: 16px; }

.home-mode-pill {
  margin-left: auto;
  padding: 4px 10px; border-radius: 999px;
  font-size: 11.5px; font-weight: 700; letter-spacing: .3px;
  background: rgba(16,185,129,.1); color: #059669;
  border: 1px solid rgba(16,185,129,.25);
  cursor: default;
}
.home-mode-pill[data-mode="deep"] {
  background: rgba(124,58,237,.1); color: #7c3aed; border-color: rgba(124,58,237,.25);
}

/* 中央输入区 */
.home-input-wrap { padding: 8px 18px 4px; }
.home-input-wrap textarea {
  width: 100%; resize: none; overflow: hidden;
  border: none; background: transparent; color: var(--ink);
  font-size: 16px; line-height: 1.55; outline: none;
  max-height: 200px; padding: 0;
}

/* 附件预览（图片 chip） */
.home-attach-preview {
  display: flex; flex-wrap: wrap; gap: 8px;
  padding: 4px 18px 8px; border-top: 1px dashed var(--line);
}
.home-attach-preview:empty { display: none; }
.home-attach-chip {
  position: relative; width: 64px; height: 64px; border-radius: 10px; overflow: hidden;
  border: 1px solid var(--line); background: var(--bg);
  display: grid; place-items: center;
}
.home-attach-chip img { width: 100%; height: 100%; object-fit: cover; }
.home-attach-chip .home-attach-name {
  font-size: 11px; color: var(--muted); padding: 0 6px; text-align: center;
  word-break: break-all; line-height: 1.2;
  max-height: 100%; overflow: hidden;
}
.home-attach-chip .home-attach-remove {
  position: absolute; top: 2px; right: 2px;
  width: 18px; height: 18px; border-radius: 50%;
  background: rgba(0,0,0,.65); color: #fff; border: none;
  font-size: 11px; line-height: 1; cursor: pointer;
  display: grid; place-items: center;
}

/* 底部操作栏 */
.home-search-foot {
  display: flex; align-items: center;
  padding: 8px 12px 10px;
  border-top: 1px solid transparent;
  transition: border-color .2s;
}
.home-search-box:focus-within .home-search-foot { border-top-color: var(--line); }
.home-foot-tip { flex: 1; min-width: 0; font-size: 12.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.home-foot-actions { display: flex; align-items: center; gap: 8px; }
.home-ico-btn {
  width: 34px; height: 34px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center; cursor: pointer;
  background: var(--hover); border: 1px solid var(--line); color: var(--muted);
  transition: background .15s, color .15s, border-color .15s, transform .12s;
  line-height: 1; padding: 0;
}
.home-ico-btn:hover { color: var(--brand); border-color: var(--brand); transform: translateY(-1px); }
.home-ico-btn.recording { color: #fff; background: #ef4444; border-color: #ef4444; animation: pulse 1s infinite; }
@keyframes pulse { 0%,100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(239,68,68,.6); } 50% { transform: scale(1.08); box-shadow: 0 0 0 8px rgba(239,68,68,0); } }
.home-ico-btn span[data-icon] { display: inline-flex; align-items: center; justify-content: center; line-height: 1; }
.home-ico-btn svg.ico { width: 16px; height: 16px; display: block; margin: 0; vertical-align: middle; }
.home-ico-btn.primary { background: linear-gradient(135deg,#8b5cf6,#6366f1); border-color: transparent; color: #fff; box-shadow: 0 4px 12px rgba(99,102,241,.35); }
.home-ico-btn.primary:hover { color: #fff; transform: translateY(-1px); box-shadow: 0 6px 16px rgba(99,102,241,.5); }
.home-ico-btn.primary:disabled { opacity: .5; cursor: not-allowed; transform: none; }

/* 模型下拉面板 */
.home-model-panel {
  position: absolute; top: 56px; left: 16px;
  width: 320px; max-width: calc(100vw - 32px);
  background: var(--panel); border: 1px solid var(--line);
  border-radius: 14px; box-shadow: 0 12px 40px rgba(0,0,0,.18);
  padding: 12px; z-index: 20;
  animation: panelPop .2s cubic-bezier(.2,.7,.2,1);
}
@keyframes panelPop { from { opacity: 0; transform: translateY(-6px) scale(.96); } to { opacity: 1; transform: none; } }
.home-model-row {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 8px; border-radius: 8px;
}
.home-model-row:hover { background: var(--hover); }
.home-model-row-label { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 600; color: var(--ink); }
.home-model-row-label svg.ico { width: 16px; height: 16px; opacity: .8; }

/* 开关 */
.home-switch { position: relative; display: inline-block; width: 36px; height: 20px; cursor: pointer; }
.home-switch input { opacity: 0; width: 0; height: 0; }
.home-switch-slider {
  position: absolute; inset: 0;
  background: #d1d5db; border-radius: 999px;
  transition: background .2s;
}
.home-switch-slider::before {
  content: ""; position: absolute; left: 2px; top: 2px;
  width: 16px; height: 16px; border-radius: 50%;
  background: #fff; transition: transform .2s;
  box-shadow: 0 1px 3px rgba(0,0,0,.2);
}
.home-switch input:checked + .home-switch-slider { background: var(--brand); }
.home-switch input:checked + .home-switch-slider::before { transform: translateX(16px); }

/* 快速/深度 分段 */
.home-seg { display: inline-flex; background: var(--hover); border-radius: 999px; padding: 2px; }
.home-seg-btn {
  padding: 4px 12px; border-radius: 999px; font-size: 12.5px; font-weight: 600;
  background: transparent; border: none; cursor: pointer; color: var(--muted);
  transition: background .15s, color .15s;
}
.home-seg-btn.on { background: var(--panel); color: var(--ink); box-shadow: 0 1px 4px rgba(0,0,0,.08); }

/* 模型列表 */
.home-model-section { font-size: 11.5px; font-weight: 700; color: var(--muted); text-transform: uppercase; letter-spacing: .5px; margin: 10px 4px 6px; }
.home-model-list { display: flex; flex-direction: column; }
.home-model-item {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 8px; border-radius: 10px; cursor: pointer;
  font-size: 14px; color: var(--ink);
  transition: background .15s;
}
.home-model-item:hover { background: var(--hover); }
.home-model-item.current { background: var(--brand-soft, rgba(99,102,241,.08)); color: var(--brand); }
.home-model-item-ico {
  width: 24px; height: 24px; border-radius: 6px; display: grid; place-items: center;
  font-size: 14px; background: var(--hover); flex: none;
}
.home-model-item.current .home-model-item-ico { background: var(--brand); color: #fff; }
.home-model-item-name { flex: 1; }
.home-model-item-new { font-size: 10.5px; padding: 1px 6px; border-radius: 4px; background: rgba(16,185,129,.15); color: #059669; font-weight: 700; }
.home-model-item-check { color: var(--brand); }
.home-model-foot {
  margin-top: 8px; padding: 10px 8px;
  border-top: 1px solid var(--line);
  font-size: 13px; color: var(--muted); cursor: pointer;
  display: flex; align-items: center; gap: 6px;
  transition: color .15s, background .15s; border-radius: 8px;
}
.home-model-foot:hover { color: var(--brand); background: var(--hover); }

/* 已废弃 */
.home-search-icon, .home-search-tips .tip { display: none; }
.home-search-tips { padding: 0 6px; margin-top: 10px; font-size: 13px; color: var(--muted); display: flex; align-items: center; justify-content: space-between; }
.home-ai-check { cursor: pointer; }
.home-ai-check input { width: 16px; height: 16px; accent-color: var(--brand); }
.home-tip-text { font-size: 12.5px; color: var(--muted); }

.home-modes {
  display: flex; align-items: center; justify-content: center;
  gap: 10px; flex-wrap: wrap; margin-bottom: 24px;
}
.home-modes-sep { width: 1px; height: 18px; background: var(--line); margin: 0 4px; }
/* 类型筛选按钮：与主按钮 .btn 同族（相同圆角/内边距/字重/悬停动效），仅激活态填品牌色 */
.mode-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px;
  padding: 9px 15px;
  border: 1px solid var(--line);
  background: var(--panel);
  color: var(--ink);
  border-radius: 10px;
  font-size: 14px; font-weight: 500; line-height: 1.2;
  cursor: pointer;
  transition: transform .18s cubic-bezier(.4,0,.2,1), background .18s, color .18s, border-color .18s, box-shadow .18s;
  user-select: none;
}
.mode-btn:hover { border-color: var(--brand); color: var(--brand); transform: translateY(-1px); box-shadow: 0 6px 16px -8px rgba(26,86,219,.5); }
.mode-btn:active { transform: translateY(0); box-shadow: none; }
.mode-btn.active { background: var(--brand); border-color: var(--brand); color: #fff; box-shadow: 0 4px 12px -6px rgba(26,86,219,.6); }
/* 实体类按钮（笔记/智能体/工作流/SOP/最佳实践）：用品牌色弱化版，区分文件类型按钮 */
.mode-btn-entity { background: color-mix(in srgb, var(--brand) 6%, var(--panel)); border-color: color-mix(in srgb, var(--brand) 22%, var(--line)); color: color-mix(in srgb, var(--brand) 80%, var(--ink)); }
.mode-btn-entity:hover { background: color-mix(in srgb, var(--brand) 12%, var(--panel)); border-color: var(--brand); color: var(--brand); }
.mode-btn-entity.active { background: var(--brand); color: #fff; }

.home-results-head {
  display: flex; align-items: center; gap: 12px; margin-bottom: 14px; padding-bottom: 10px; border-bottom: 1px solid var(--line);
}
.home-results-title { margin: 0; font-size: 17px; font-weight: 700; }
.home-results-count { color: var(--muted); font-size: 13px; }

.home-ai-answer {
  background: color-mix(in srgb, var(--brand) 6%, var(--panel));
  border: 1px solid color-mix(in srgb, var(--brand) 18%, var(--line));
  border-radius: var(--radius-sm); padding: 16px; margin-bottom: 20px;
}
.home-ai-title { display: flex; align-items: center; gap: 8px; font-weight: 700; color: var(--brand); margin-bottom: 8px; }
.home-ai-title svg.ico { width: 18px; height: 18px; }
.home-ai-body { line-height: 1.7; white-space: pre-wrap; word-break: break-word; }
.home-ai-sources { margin-top: 10px; font-size: 13px; color: var(--muted); }
.home-ai-sources .src-label { font-weight: 600; color: var(--ink); }

.home-results { display: flex; flex-direction: column; gap: 12px; }
.home-result { padding: 14px 16px; display: flex; gap: 16px; align-items: flex-start; justify-content: space-between; transition: transform .15s, border-color .15s; }
.home-result:hover { border-color: var(--brand); transform: translateY(-1px); }
.home-result-main { display: flex; gap: 14px; flex: 1; min-width: 0; }
.home-result-thumb {
  width: 56px; height: 56px; flex-shrink: 0;
  background: #f3f4f6; border-radius: 12px;
  display: flex; align-items: center; justify-content: center; overflow: hidden; cursor: pointer;
}
.home-result-thumb img { width: 100%; height: 100%; object-fit: cover; }
.home-result-thumb svg.ico { width: 30px; height: 30px; }
.home-result-body { flex: 1; min-width: 0; }
.home-result-title { font-size: 15px; font-weight: 600; color: var(--ink); cursor: pointer; margin-bottom: 4px; }
.home-result-title:hover { color: var(--brand); }
.home-result-meta { display: flex; align-items: center; gap: 10px; font-size: 12px; color: var(--muted); flex-wrap: wrap; }
.home-result-type { padding: 2px 8px; border-radius: 999px; background: var(--brand-soft); color: var(--brand); font-weight: 500; }
.home-result-tags { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 6px; }
.home-tag { font-size: 11px; padding: 2px 8px; border-radius: 999px; background: #f3f4f6; color: var(--muted); }
/* 首页搜索结果标签筛选条（#872） */
.home-tag-filter { display: none; align-items: center; flex-wrap: wrap; gap: 8px; margin: 10px 0 4px; padding: 0; }
.home-tag-filter:empty { display: none; }
.home-tag-chip {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 12px; line-height: 1; padding: 5px 12px; border-radius: 999px;
  border: 1px solid var(--border, #ececec); background: #fff; color: var(--muted, #6b7280);
  cursor: pointer; transition: all .15s ease; white-space: nowrap;
}
.home-tag-chip:hover { border-color: var(--brand, #0B5CAD); color: var(--brand, #0B5CAD); }
.home-tag-chip.on { background: var(--brand, #0B5CAD); border-color: var(--brand, #0B5CAD); color: #fff; }
.home-tag-chip .cnt { font-size: 10px; opacity: .7; padding-left: 4px; border-left: 1px solid currentColor; }
.home-tag-chip.on .cnt { opacity: .85; }
.home-result-snippet { margin-top: 8px; font-size: 13px; color: var(--muted); line-height: 1.6; }
.home-snippet-label { color: var(--brand); font-weight: 500; }
.home-result-actions { display: flex; gap: 6px; flex-wrap: wrap; align-items: flex-start; }
/* 检索命中高亮（首页结果标题/摘要） */
mark.hl {
  background: linear-gradient(180deg, rgba(250,204,21,.55), rgba(250,204,21,.35));
  color: inherit; border-radius: 3px; padding: 0 2px;
}
[data-theme="dark"] mark.hl {
  background: linear-gradient(180deg, rgba(250,204,21,.35), rgba(250,204,21,.22));
  color: #fde68a;
}
/* 命中次数徽标 */
.home-hit-badge {
  font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 999px;
  background: var(--brand-soft); color: var(--brand);
}
[data-theme="dark"] .home-hit-badge { background: rgba(99,102,241,.18); color: #a5b4fc; }
/* AI 配置：模型下拉 + 刷新按钮 */
.ai-model-select-row { display: flex; align-items: center; gap: 8px; }
.ai-model-select { flex: 1 1 auto; min-width: 0; }
.ai-model-refresh { flex: 0 0 auto; white-space: nowrap; }

/* 智能体：提示词 + AI 优化 */
.agent-prompt-row { display: flex; gap: 8px; align-items: flex-start; }
.agent-prompt-row textarea.ai-prompt-ta { flex: 1 1 auto; min-width: 0; min-height: 96px; }
.agent-ai-optimize { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px; align-self: stretch; }
.agent-ai-optimize svg.ico { width: 14px; height: 14px; }

/* RAG 向量命中来源标签 */
.home-match-badge {
  font-size: 10.5px; font-weight: 700; padding: 2px 8px; border-radius: 999px;
  letter-spacing: .2px;
}
.home-match-badge.vector { background: #e6f6f0; color: #059669; }
.home-match-badge.hybrid { background: #e0f0ff; color: #2563eb; }
.home-match-badge.keyword { background: #f3f4f6; color: #64748b; }
[data-theme="dark"] .home-match-badge.vector { background: #132a22; color: #34d399; }
[data-theme="dark"] .home-match-badge.hybrid { background: #172554; color: #93bbfd; }
[data-theme="dark"] .home-match-badge.keyword { background: #1b2430; color: #93a1b5; }
/* 多实体检索：SOP / 最佳实践 缩略图占位 + URL 显示 */
.home-etype-ico {
  display: grid; place-items: center; width: 100%; height: 100%;
  font-size: 26px; color: #fff; border-radius: 10px;
}
.home-etype-ico.sop { background: linear-gradient(135deg, #0B5CAD, #3B82F6); }
.home-etype-ico.url { background: linear-gradient(135deg, #0B5CAD, #3B82F6); }
.home-etype-ico.note { background: linear-gradient(135deg, #0B5CAD, #3B82F6); }
.home-etype-ico.agent { background: linear-gradient(135deg, #0B5CAD, #3B82F6); }
.home-etype-ico.workflow { background: linear-gradient(135deg, #0B5CAD, #3B82F6); }
.home-result-url {
  max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  color: var(--brand); font-size: 12px; background: var(--brand-soft);
  padding: 1px 7px; border-radius: 6px;
}

@media (max-width: 768px) {
  .home-hero { padding: 28px 0 18px; }
  .home-title { font-size: 22px; }
  .home-subtitle { font-size: 13px; }
  .home-search-box { border-radius: 14px; padding: 8px 10px; }
  .home-search-tips { flex-direction: column; align-items: flex-start; gap: 6px; }
  .home-result { flex-direction: column; gap: 10px; }
  .home-result-actions { width: 100%; justify-content: flex-end; }
}

.muted { color: var(--muted); }
.small { font-size: 12px; }

/* ===== 智能体 / 工作流模块 ===== */
.agent-badge {
  display: inline-block; font-size: 10.5px; font-weight: 700;
  padding: 2px 8px; border-radius: 999px;
  background: #f3f4f6; color: #64748b; white-space: nowrap;
}
.agent-badge.pub { background: #e6f6f0; color: #059669; }
[data-theme="dark"] .agent-badge { background: #1b2430; color: #93a1b5; }
[data-theme="dark"] .agent-badge.pub { background: #132a22; color: #34d399; }
.agent-card-meta {
  display: flex; align-items: center; gap: 8px;
  font-size: 12px; color: var(--muted);
}
.agent-card-meta .home-model-item-ico { font-size: 14px; }
.wf-trigger-chip {
  padding: 2px 8px; border-radius: 999px;
  background: var(--brand-soft); color: var(--brand); font-weight: 600;
}
.agent-editor, .wf-editor, .agent-publish, .wf-logs, .wf-publish { display: flex; flex-direction: column; }
.wf-editor-body, .agent-publish-body {
  display: flex; flex-direction: column; gap: 14px; padding: 16px;
  flex: 1; min-height: 0;
}
/* 智能体编辑器：填满主区域，与 SOP/文件/笔记等板块保持一致的 16px 内边距，避免内容贴边偏左上 */
#tabAgents .content { display: flex; flex-direction: column; overflow: hidden; padding: 16px; }
#tabAgents .content > .panel.agent-editor { flex: 1; min-height: 0; display: flex; flex-direction: column; }
/* 智能体编辑器头部：居中标题，避免左右按钮对角空旷 */
.agent-editor-head-toolbar { position: relative; }
.agent-editor-title {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  font-size: 15px;
  font-weight: 600;
  color: var(--ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 40%;
  pointer-events: none;
}
/* 智能体编辑器：三栏（人设 / 设定 / 调试） */
.agent-editor-body {
  display: flex; flex-direction: row; gap: 0; padding: 0;
  flex: 1; min-height: 0;
  align-items: stretch;
}
.agent-persona-pane,
.agent-settings-pane {
  min-width: 0; overflow-y: auto; padding: 16px;
  display: flex; flex-direction: column; gap: 14px;
}
.agent-persona-pane { flex: 0 1 26%; border-right: 1px solid var(--line); background: var(--panel); }
.agent-settings-pane { flex: 1 1 44%; }
.agent-persona-block { display: flex; flex-direction: column; gap: 8px; flex: 1 1 auto; min-height: 0; }
.agent-persona-head {
  display: flex; align-items: center; gap: 8px;
  padding-bottom: 6px; border-bottom: 1px solid var(--line);
}
.agent-persona-title { font-weight: 700; color: var(--ink); font-size: 13.5px; flex: 1 1 auto; }
.agent-persona-optimize {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 10px; border-radius: 999px;
  background: color-mix(in srgb, var(--brand) 10%, transparent); color: var(--brand);
  border: 1px solid color-mix(in srgb, var(--brand) 25%, transparent);
}
.agent-persona-optimize svg.ico { width: 14px; height: 14px; }
.agent-persona-ta { flex: 1 1 auto; min-height: 260px; resize: vertical; font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, monospace); font-size: 13px; line-height: 1.65; }
.agent-persona-ta::placeholder { color: var(--muted); }
/* 开场白预设问题列表 */
.agent-opening-q-list { display: flex; flex-direction: column; gap: 6px; }
.agent-opening-q-row {
  display: flex; gap: 6px; align-items: center;
  padding: 4px 6px 4px 10px; border: 1px solid var(--line); border-radius: 8px;
  background: var(--panel);
}
.agent-opening-q-row .ai-bind-tw {
  flex: 0 0 auto; cursor: grab; color: var(--muted); user-select: none;
  width: 18px; text-align: center;
}
.agent-opening-q-input {
  flex: 1 1 auto; min-width: 0; border: none; outline: none; background: transparent;
  font: inherit; color: var(--ink); padding: 4px 0;
}
.agent-opening-q-del {
  flex: 0 0 auto; background: transparent; border: 0; cursor: pointer; color: var(--muted);
  padding: 2px 6px; border-radius: 6px; font-size: 14px; line-height: 1;
}
.agent-opening-q-del:hover { background: color-mix(in srgb, #ef4444 12%, transparent); color: #ef4444; }
.agent-opening-q-empty { font-size: 12px; color: var(--muted); padding: 6px 0; }
/* 高级配置 details */
.agent-advanced { border: 1px solid var(--line); border-radius: 8px; padding: 8px 12px; background: var(--panel); }
.agent-advanced summary { cursor: pointer; font-weight: 600; color: var(--ink); font-size: 13px; list-style: none; }
.agent-advanced summary::-webkit-details-marker { display: none; }
.agent-advanced[open] summary { margin-bottom: 8px; }
.agent-advanced-body { padding-top: 4px; }
/* 右栏：调试与预览 */
.agent-debug-pane {
  flex: 0 1 30%; min-width: 300px; border-left: 1px solid var(--line);
  display: flex; flex-direction: column; min-height: 0;
  background: color-mix(in srgb, var(--brand) 4%, var(--panel));
  padding-bottom: 14px;
}
.agent-debug-head {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 14px; border-bottom: 1px solid var(--line);
  flex-shrink: 0;
}
.agent-debug-head-text {
  display: flex; flex-direction: column; gap: 2px;
  flex: 1 1 auto; min-width: 0;
}
.agent-debug-title { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; color: var(--ink); font-size: 13.5px; }
.agent-debug-title svg.ico { width: 15px; height: 15px; color: var(--brand); }
.agent-debug-sub { color: var(--muted); font-size: 12px; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.agent-debug-clear { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px; }
.agent-debug-clear svg.ico { width: 13px; height: 13px; }
.agent-debug-avatar {
  display: flex; justify-content: center; align-items: center;
  padding: 0; flex-shrink: 0;
}
.agent-debug-avatar canvas, .agent-debug-avatar svg, .agent-debug-avatar img {
  max-height: 44px; width: auto;
}
.agent-debug-log {
  flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 12px 14px 8px;
  display: flex; flex-direction: column; gap: 12px;
}
.agent-debug-welcome {
  text-align: center; color: var(--muted); font-size: 13px;
  margin: 8px 0 0; display: flex; flex-direction: column; align-items: center; gap: 12px;
}
.agent-debug-welcome-ico {
  width: 54px; height: 54px; border-radius: 50%; display: grid; place-items: center;
  background: color-mix(in srgb, var(--brand) 12%, transparent); color: var(--brand);
}
.agent-debug-welcome-ico svg.ico { width: 26px; height: 26px; }
.agent-debug-welcome p { max-width: 360px; line-height: 1.7; margin: 0; }
/* 开场白 + 预设问题 chips */
.agent-greeting-bubble {
  background: var(--panel); border: 1px solid var(--line); color: var(--ink);
  padding: 10px 12px; border-radius: 12px; font-size: 13.5px; line-height: 1.7;
  white-space: pre-wrap; word-break: break-word; max-width: 92%;
}
.agent-greeting-meta { font-size: 11px; color: var(--muted); margin-bottom: 4px; letter-spacing: .3px; }
.agent-q-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 2px; }
.agent-q-chip {
  background: color-mix(in srgb, var(--brand) 10%, var(--panel));
  border: 1px solid color-mix(in srgb, var(--brand) 25%, var(--line));
  color: var(--brand); padding: 6px 10px; border-radius: 999px;
  font-size: 12.5px; cursor: pointer; transition: all .15s ease;
  text-align: left; max-width: 100%; line-height: 1.4;
}
.agent-q-chip:hover { background: color-mix(in srgb, var(--brand) 18%, var(--panel)); transform: translateY(-1px); }
.agent-msg { display: flex; gap: 10px; align-items: flex-start; }
.agent-msg.user { flex-direction: row-reverse; }
.agent-msg-avatar {
  flex: 0 0 auto; width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; font-size: 15px;
}
.agent-msg.user .agent-msg-avatar { background: var(--brand); }
.agent-msg.bot .agent-msg-avatar { background: linear-gradient(135deg, #38bdf8, #0284c7); }
.agent-msg-bubble {
  flex: 1 1 auto; min-width: 0; max-width: 82%; padding: 10px 12px; border-radius: 12px;
  font-size: 13.5px; line-height: 1.7; word-break: break-word; white-space: pre-wrap;
}
.agent-msg.user .agent-msg-bubble {
  background: var(--brand); color: #fff; border-bottom-right-radius: 4px;
}
.agent-msg.bot .agent-msg-bubble {
  background: var(--panel); border: 1px solid var(--line); color: var(--ink); border-bottom-left-radius: 4px;
}
.agent-msg-src { margin-top: 8px; color: var(--muted); font-size: 12px; }
.agent-debug-loading { opacity: .7; }
.agent-debug-input {
  flex: 0 0 auto; display: flex; flex-direction: column; gap: 8px;
  padding: 12px 14px; border-top: 1px solid var(--line); background: var(--panel);
}
.agent-debug-tools-row {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.agent-debug-msg-row {
  display: flex; align-items: flex-end; gap: 8px;
}
.agent-debug-input textarea#agentDebugInput {
  flex: 1 1 auto; min-width: 0; resize: none; max-height: 140px; line-height: 1.5; padding: 8px 10px;
}
.agent-debug-send {
  flex: 0 0 auto; align-self: stretch; display: inline-flex; align-items: center; gap: 6px; padding: 0 14px;
}
.agent-debug-send svg.ico { width: 16px; height: 16px; }
/* 响应式：≤1200px 隐藏人设/设定，调试为主 + 抽屉；≤780px 三栏全部堆叠 */
@media (max-width: 1200px) {
  .agent-editor-body { flex-direction: column; }
  .agent-persona-pane, .agent-settings-pane, .agent-debug-pane {
    flex: 0 1 auto; border-left: none; border-right: none; min-width: 0;
  }
  .agent-persona-pane { border-bottom: 1px solid var(--line); max-height: 40vh; }
  .agent-debug-pane { border-top: 1px solid var(--line); min-height: 420px; }
}
@media (max-width: 780px) {
  .agent-persona-pane { max-height: none; }
  .agent-persona-pane, .agent-settings-pane, .agent-debug-pane { padding: 12px; }
  .agent-persona-ta { min-height: 160px; }
}

/* 发布面板 */
.publish-block { padding: 4px 0 12px; }
.publish-block h4 { margin: 0 0 6px; font-size: 14px; color: var(--ink); }
.publish-row { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.publish-row .input { flex: 1 1 auto; min-width: 0; font-size: 12.5px; }
.pub-token-list { display: flex; flex-direction: column; gap: 8px; margin-top: 8px; }
.pub-token-item {
  padding: 10px 12px; border: 1px solid var(--line); border-radius: 8px;
  background: var(--panel);
  display: flex; flex-direction: column; gap: 6px;
}
.pub-token-item.revoked { opacity: .75; background: var(--hover); }
.pub-token-item.active { border-color: color-mix(in srgb, var(--brand) 30%, var(--line)); }
.pub-token-meta { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.pub-token-label { font-weight: 700; font-size: 13px; color: var(--ink); }
.pub-token-status { font-size: 11px; padding: 2px 8px; border-radius: 999px; font-weight: 600; }
.pub-token-status.on { background: #e6f6f0; color: #059669; }
.pub-token-status.off { background: #f3f4f6; color: #64748b; }
.pub-token-row { display: flex; align-items: center; gap: 6px; }
.pub-token-key { font-family: ui-monospace, Consolas, monospace; font-size: 12px; padding: 6px 8px; }
.pub-token-time { padding: 0 4px; }
.pub-token-meta-sub { font-size: 11.5px; }
.pub-token-item .btn.danger-ghost {
  background: transparent; border-color: color-mix(in srgb, #ef4444 35%, var(--line));
  color: #ef4444;
}
.pub-token-item .btn.danger-ghost:hover { background: #fef2f2; border-color: #ef4444; }
.pub-code {
  background: #0f172a; color: #e2e8f0; border-radius: 10px;
  padding: 14px; font-size: 12.5px; line-height: 1.6;
  overflow-x: auto; white-space: pre-wrap; word-break: break-all;
}
[data-theme="dark"] .pub-code { background: #020617; }

/* 发布弹窗（modal-mask） */
#agentPublishMask .modal,
#wfPublishMask .modal { width: 780px; max-width: calc(100vw - 40px); padding: 0; position: relative; }
/* 所有分享/发布弹窗关闭按钮统一置于内容之上，避免被 head 等内容压住 */
#shareMask .modal-close,
#batchShareMask .modal-close,
#urlCaseShareMask .modal-close,
#noteShareMask .modal-close,
#sopShareMask .modal-close,
#formShareMask .modal-close,
#agentPublishMask .modal-close,
#wfPublishMask .modal-close { z-index: 10; }
.modal-close {
  position: absolute; top: 12px; right: 12px;
  width: 30px; height: 30px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--bg); border: 1px solid var(--line); border-radius: 6px;
  color: var(--muted); cursor: pointer; padding: 0;
  -webkit-tap-highlight-color: transparent;
  line-height: 1;
}
.modal-close:hover { background: var(--brand-soft); color: var(--brand); border-color: color-mix(in srgb, var(--brand) 35%, var(--line)); }
.modal-close span[data-icon] { display: inline-flex; align-items: center; justify-content: center; line-height: 1; }
.modal-close svg.ico { width: 16px; height: 16px; pointer-events: none; display: block; margin: 0; vertical-align: middle; }
/* 内联变体（弹窗 head 内作为 flex 项，与其他按钮并排） */
.modal-close.modal-close--inline { position: static; }
/* 所有分享/发布弹窗统一尺寸与比例，对齐 AI 智能体发布弹窗（780px→880px，留出协作者三联控件宽度避免换行） */
#shareMask .modal,
#batchShareMask .modal,
#urlCaseShareMask .modal,
#noteShareMask .modal,
#sopShareMask .modal,
#formShareMask .modal,
#aclMask .modal {
  width: 880px;
  max-width: calc(100vw - 40px);
  position: relative;
}
.agent-publish-modal-head {
  display: flex; align-items: center; gap: 14px;
  padding: 18px 110px 14px 20px;
  border-bottom: 1px solid var(--line);
  position: relative;
}
.agent-publish-modal-ico {
  width: 44px; height: 44px; border-radius: 12px;
  display: grid; place-items: center;
  background: color-mix(in srgb, var(--brand) 12%, var(--panel));
  color: var(--brand); font-size: 20px;
}
.agent-publish-modal-ico svg.ico { width: 22px; height: 22px; }
.agent-publish-modal-title { margin: 0; font-size: 17px; font-weight: 700; }
.agent-publish-toggle { flex: 0 0 auto; margin-left: auto; max-width: 140px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.agent-publish-modal-body { padding: 16px 20px; max-height: 60vh; overflow-y: auto; }
.modal-foot {
  padding: 14px 20px; flex: 0 0 auto;
  display: flex; justify-content: flex-end; gap: 10px;
  border-top: 1px solid var(--line);
}
/* 新建智能体·模板选择弹窗（卡片网格） */
.agent-preset-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding: 4px 2px;
}
.agent-preset-card {
  display: flex; flex-direction: column; gap: 6px;
  padding: 14px 16px;
  background: #fff;
  border: 1px solid var(--line, #ECECEC);
  border-radius: 12px;
  cursor: pointer;
  transition: border-color .15s ease, background .15s ease, transform .05s ease;
  text-align: left;
}
.agent-preset-card:hover {
  border-color: #0B5CAD;
  background: #F4F8FD;
}
.agent-preset-card:active { transform: translateY(1px); }
.agent-preset-card .apc-name {
  font-size: 14px; font-weight: 600; color: var(--text, #1F2937);
  display: flex; align-items: center; gap: 8px;
}
.agent-preset-card .apc-name .apc-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px;
  background: rgba(11,92,173,.08);
  color: #0B5CAD;
  border-radius: 6px;
  font-size: 13px;
}
.agent-preset-card .apc-meta { font-size: 12px; color: var(--muted, #6B7280); }
.agent-preset-card .apc-desc { font-size: 12.5px; color: var(--text, #374151); line-height: 1.5; }
.agent-preset-card .apc-tags { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 2px; }
.agent-preset-card .apc-tag {
  font-size: 11px; padding: 2px 8px;
  background: #F1F5F9; color: #475569;
  border-radius: 999px;
}
.agent-preset-card.is-blank {
  grid-column: 1 / -1;
  background: #FAFBFC;
  display: flex; flex-direction: row; align-items: center; gap: 12px;
}
.agent-preset-card.is-blank .apc-name { font-weight: 500; }
.agent-preset-card.is-blank .apc-icon {
  background: transparent; color: #94A3B8;
}
.agent-preset-section-title {
  grid-column: 1 / -1;
  font-size: 12px; color: var(--muted, #6B7280);
  font-weight: 500; letter-spacing: .02em;
  margin: 6px 0 -2px 2px;
}
@media (max-width: 540px) {
  .agent-preset-grid { grid-template-columns: 1fr; }
}

.form-ai-preview {
  margin-top: 12px; padding: 12px 14px;
  background: var(--hover, rgba(0,0,0,.04));
  border: 1px solid var(--line); border-radius: 12px;
}
.form-ai-preview h4 { margin: 0 0 4px; font-size: 14px; }
.form-ai-preview .faip-desc { margin: 0 0 10px; color: var(--muted); font-size: 12.5px; }
.form-ai-preview ul { margin: 0; padding-left: 18px; }
.form-ai-preview li { font-size: 13px; padding: 2px 0; }
.form-ai-preview li .faip-type {
  display: inline-block; margin-left: 6px; padding: 1px 6px; border-radius: 6px;
  font-size: 11px; color: var(--brand); background: color-mix(in srgb, var(--brand) 12%, var(--panel));
}
.form-ai-preview li .faip-req { color: #e5484d; font-size: 11px; margin-left: 4px; }
.form-ai-ok { color: #16a34a !important; }
.form-ai-err { color: #e5484d !important; }
.apm-grid { display: grid; grid-template-columns: 220px 1fr; gap: 20px; }
.apm-left { order: 2; }
.apm-block { margin-bottom: 14px; }
.apm-label {
  font-size: 12px; font-weight: 700; color: var(--muted);
  letter-spacing: .3px; text-transform: uppercase;
  margin-bottom: 6px;
}
.apm-row { display: flex; align-items: center; gap: 6px; }
.apm-row .input { flex: 1 1 auto; min-width: 0; font-size: 12.5px; }
.apm-token-row { margin-bottom: 8px; }
.apm-right { order: 1; display: flex; flex-direction: column; gap: 12px; align-items: center; padding-right: 14px; border-right: 1px dashed var(--line); }
.apm-meta { text-align: left; align-self: stretch; }
.apm-qr-wrap { background: var(--hover); }
@media (max-width: 720px) {
  .apm-grid { grid-template-columns: 1fr; }
  .apm-left { order: 2; }
  .apm-right { order: 1; border-right: none; border-top: 1px dashed var(--line); padding-right: 0; padding-top: 12px; }
}

/* 工作流编辑器：对齐 SOP 画布视觉（--wf 主题色 token） */
.wf-editor { --wf: var(--section-color, var(--brand, #0B5CAD)); }
.wf-toolbar { gap: 6px; flex-wrap: wrap; }
.wf-title-input { flex: 0 1 200px; min-width: 120px; }
.wf-desc-input { flex: 1 1 220px; min-width: 140px; }
.wf-trigger-row { display: flex; align-items: center; gap: 8px; white-space: nowrap; }
.wf-trigger-label { font-size: 12px; font-weight: 600; color: var(--muted); }
.wf-editor-body {
  display: flex; flex-direction: column; padding: 0; gap: 0;
  flex: 1; min-height: 0;
}
/* 画布容器与 SOP 同构：wrap 自身作为网格背景铺满 flex 剩余空间（position:relative + flex:1），
   加 calc 兜底高度：即使 flex 链路某环 collapse，画布也至少有视口高度，不再只剩一小块 */
.wf-canvas-wrap {
  position: relative; flex: 1 1 auto; min-width: 0; min-height: 0; overflow: hidden;
  height: calc(100vh - 230px);
  min-height: 420px;
  background-color: var(--bg);
  background-image: radial-gradient(circle, color-mix(in srgb, var(--ink) 12%, transparent) 1px, transparent 1px);
  background-size: 22px 22px;
  border: 1px solid var(--line); border-radius: var(--radius);
  cursor: grab;
  touch-action: none;   /* 交给 pointer 事件处理平移/拖拽，禁用浏览器手势 */
}
/* 画布 = pan/zoom 层，与 SOP 同构 */
.wf-canvas {
  position: relative; transform-origin: 0 0; will-change: transform;
  min-height: 100%; min-width: 100%;
}
.wf-canvas-wrap.panning { cursor: grabbing; }
.wf-canvas.panning { cursor: grabbing; }
.wf-edges { position: absolute; top: 0; left: 0; overflow: visible; pointer-events: none; color: var(--wf); z-index: 1; }
.wf-nodes { position: absolute; top: 0; left: 0; z-index: 2; }
.wf-canvas-hint {
  position: absolute; inset: 0; display: grid; place-items: center;
  color: var(--muted); font-size: 14px; pointer-events: none; z-index: 1; text-align: center; padding: 20px;
}
.wf-canvas-hint .wf-empty-card {
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  padding: 22px 28px; border-radius: 16px;
  background: color-mix(in srgb, var(--panel) 86%, transparent);
  border: 1px dashed color-mix(in srgb, var(--muted) 35%, transparent);
  color: var(--muted); pointer-events: none;
  box-shadow: 0 6px 24px -16px rgba(15,23,42,.18);
}
.wf-canvas-hint .wf-empty-ico {
  width: 44px; height: 44px; border-radius: 12px;
  display: grid; place-items: center;
  background: color-mix(in srgb, var(--wf) 14%, var(--panel));
  color: var(--wf); font-size: 22px;
}
.wf-canvas-hint .wf-empty-title { font-size: 15px; font-weight: 700; color: var(--ink); }
.wf-canvas-hint .wf-empty-desc { font-size: 13px; line-height: 1.7; max-width: 360px; }
.wf-edge { fill: none; stroke: var(--wf); stroke-width: 2.5; opacity: .5; pointer-events: none; transition: opacity .15s ease, stroke-width .15s ease; }
.wf-edge.selected { opacity: 1; stroke: var(--danger, #d9483b); stroke-width: 3.5; }
.wf-edge.draft { stroke-dasharray: 7 6; opacity: .85; pointer-events: none; }
.wf-edge-hit { fill: none; stroke: transparent; stroke-width: 18; pointer-events: stroke; cursor: pointer; }
.wf-edge-hit:hover { stroke: color-mix(in srgb, var(--wf) 35%, transparent); }
.wf-edge-hit.selected { stroke: color-mix(in srgb, var(--danger, #d9483b) 35%, transparent); }
/* 节点卡（SOP 三段式：编号 + 类型 pill + 标题 / 正文） */
.wf-node {
  position: absolute; z-index: 2;
  width: 248px; height: 76px;
  background: var(--panel); border: 1.5px solid var(--line);
  border-radius: 12px; overflow: hidden;
  box-shadow: var(--shadow);
  cursor: move; user-select: none;
  touch-action: none;   /* pointer 拖拽必需：禁用触屏滚动手势抢占 */
  transition: border-color .15s, box-shadow .15s;
}
.wf-node:hover { border-color: var(--wf); }
.wf-node.selected { border-color: var(--wf); box-shadow: 0 0 0 3px color-mix(in srgb, var(--wf) 22%, transparent); }
.wf-node.dragging { cursor: grabbing; box-shadow: 0 14px 30px -10px rgba(0,0,0,.4); transform: scale(1.02); z-index: 50; }
.wf-node-head {
  display: flex; align-items: center; gap: 8px;
  padding: 9px 12px; border-bottom: 1px solid var(--line);
  color: var(--ink); cursor: grab;
}
.wf-node-idx {
  flex: 0 0 auto; width: 22px; height: 22px; border-radius: 50%;
  background: color-mix(in srgb, var(--wf) 15%, var(--panel)); color: var(--wf);
  font-size: 12px; font-weight: 800; display: grid; place-items: center;
}
.wf-node-kind {
  flex: 0 0 auto; font-size: 12px; font-weight: 700; color: var(--wf);
  background: color-mix(in srgb, var(--wf) 12%, var(--panel)); padding: 2px 7px; border-radius: 999px; line-height: 1;
}
.wf-node-title { flex: 1 1 auto; min-width: 0; font-size: 13px; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wf-node-del {
  border: none; background: transparent; color: var(--muted);
  cursor: pointer; font-size: 15px; line-height: 1; padding: 0 2px; flex: 0 0 auto;
}
.wf-node-del:hover { color: #ef4444; }
.wf-node-body {
  padding: 8px 12px; font-size: 12px; color: var(--muted);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-height: 52px;
}
/* 节点端口（连线起点/终点） */
/* 节点端口（连线起点/终点）：参考 SOP sop-port 样式，圆形 + box-shadow，定位在卡片外 */
.wf-port {
  position: absolute; top: 50%; margin-top: -8px;
  width: 16px; height: 16px; border-radius: 50%;
  background: var(--wf); border: 2px solid var(--panel); cursor: crosshair; z-index: 3;
  box-shadow: 0 2px 6px rgba(0,0,0,.2);
  transition: transform .12s ease, box-shadow .12s ease;
}
.wf-port.in { left: -9px; }
.wf-port.out { right: -9px; }
.wf-port:hover { transform: scale(1.2); box-shadow: 0 0 0 4px color-mix(in srgb, var(--wf) 25%, transparent); }
/* 节点类型色调（保留区分，局部变量 --wf-type-color） */
.wf-node[data-type="ai"] { --wf-type-color: #7c3aed; }
.wf-node[data-type="http"] { --wf-type-color: #2563eb; }
.wf-node[data-type="condition"] { --wf-type-color: #d97706; }
.wf-node[data-type="text"] { --wf-type-color: #0d9488; }
.wf-node[data-type="output"] { --wf-type-color: #64748b; }
.wf-node[data-type="ai"] .wf-node-idx, .wf-node[data-type="ai"] .wf-node-kind { color: #7c3aed; background: color-mix(in srgb, #7c3aed 12%, var(--panel)); }
.wf-node[data-type="http"] .wf-node-idx, .wf-node[data-type="http"] .wf-node-kind { color: #2563eb; background: color-mix(in srgb, #2563eb 12%, var(--panel)); }
.wf-node[data-type="condition"] .wf-node-idx, .wf-node[data-type="condition"] .wf-node-kind { color: #d97706; background: color-mix(in srgb, #d97706 12%, var(--panel)); }
.wf-node[data-type="text"] .wf-node-idx, .wf-node[data-type="text"] .wf-node-kind { color: #0d9488; background: color-mix(in srgb, #0d9488 12%, var(--panel)); }
.wf-node[data-type="output"] .wf-node-idx, .wf-node[data-type="output"] .wf-node-kind { color: #64748b; background: color-mix(in srgb, #64748b 12%, var(--panel)); }
/* 左下角 FAB + 节点模板面板（与空态提示文案「从左下角『⊞ 添加节点』」一致）
   放左下而非左上：节点默认落点在 (60,60) 起的左上区域，浮层压在那里会导致
   节点头部按不住、无法拖拽（原「左侧/顶部被限制死」的表层原因之一）。 */
.wf-fab-btn {
  position: absolute; left: 18px; bottom: 18px; z-index: 8;
  display: inline-flex; align-items: center; gap: 8px;
  padding: 8px 16px; border-radius: 999px;
  background: var(--panel); border: 1px solid var(--line);
  box-shadow: 0 6px 20px -8px rgba(0,0,0,.35); color: var(--ink); font-size: 13px; font-weight: 600;
  cursor: pointer; transition: all .15s ease;
}
.wf-fab-btn:hover { color: var(--wf); border-color: var(--wf); }
.wf-fab-ico { font-size: 15px; line-height: 1; }
.wf-template-panel {
  position: absolute; left: 18px; bottom: 64px; z-index: 9;
  width: 320px; max-width: 92vw; max-height: calc(100% - 100px);
  display: flex; flex-direction: column;
  background: var(--panel); border: 1px solid var(--line); border-radius: 14px;
  box-shadow: 0 16px 44px -16px rgba(0,0,0,.28);
  padding: 12px;
}
.wf-tpl-head { display: flex; align-items: center; justify-content: space-between; padding: 2px 2px 8px; font-size: 13.5px; color: var(--ink); }
.wf-tpl-close { border: none; background: transparent; font-size: 20px; line-height: 1; cursor: pointer; color: var(--muted); padding: 0 4px; }
.wf-tpl-close:hover { color: var(--wf); }
.wf-tpl-search {
  display: flex; align-items: center; gap: 6px;
  padding: 6px 10px; border: 1px solid var(--line); border-radius: 10px;
  background: var(--bg); margin-bottom: 10px;
}
.wf-tpl-search:focus-within { border-color: var(--wf); }
.wf-tpl-search .ico { color: var(--muted); font-size: 13px; }
.wf-tpl-search input { flex: 1; border: none; background: transparent; outline: none; font: inherit; color: var(--ink); min-width: 0; }
.wf-tpl-tabs { display: flex; gap: 3px; margin: 0 0 10px; padding: 3px 3px 8px; border-radius: 10px; background: color-mix(in srgb, var(--ink) 5%, var(--panel)); overflow-x: auto; overflow-y: hidden; scrollbar-width: thin; }
/* 滚动条美化（深色下不再突兀）：半透明细圆角胶囊 + 主题色 hover；加 !important 防止容器 padding/background 覆盖 */
.wf-tpl-tabs::-webkit-scrollbar { height: 8px !important; -webkit-appearance: none; appearance: none; }
.wf-tpl-tabs::-webkit-scrollbar-thumb { background: color-mix(in srgb, var(--ink) 30%, transparent) !important; border-radius: 999px !important; -webkit-appearance: none; }
.wf-tpl-tabs::-webkit-scrollbar-thumb:hover { background: var(--wf) !important; }
.wf-tpl-tabs::-webkit-scrollbar-track { background: transparent !important; }
.wf-tpl-tab {
  flex: 0 0 auto; padding: 5px 10px; border: none; background: transparent; border-radius: 8px;
  font-size: 12px; font-weight: 600; color: var(--muted); cursor: pointer; transition: all .12s ease; white-space: nowrap;
}
.wf-tpl-tab:hover { color: var(--wf); }
.wf-tpl-tab.active { background: var(--panel); color: var(--wf); box-shadow: 0 1px 3px rgba(0,0,0,.12); }
.wf-tpl-list { display: flex; flex-direction: column; gap: 6px; overflow-y: auto; overflow-x: hidden; flex: 1 1 auto; min-height: 0; scrollbar-width: thin; padding-right: 4px; }
.wf-tpl-list::-webkit-scrollbar { width: 8px !important; -webkit-appearance: none; appearance: none; }
.wf-tpl-list::-webkit-scrollbar-thumb { background: color-mix(in srgb, var(--ink) 30%, transparent) !important; border-radius: 999px !important; -webkit-appearance: none; }
.wf-tpl-list::-webkit-scrollbar-thumb:hover { background: var(--wf) !important; }
.wf-tpl-list::-webkit-scrollbar-track { background: transparent !important; margin: 4px 0; }
.wf-tpl-item {
  display: flex; align-items: center; gap: 10px; padding: 9px 10px;
  border: 1px solid var(--line); border-radius: 10px; cursor: pointer;
  background: var(--panel); transition: border-color .15s, transform .15s, box-shadow .15s;
}
.wf-tpl-item:hover { border-color: var(--wf); transform: translateX(2px); box-shadow: var(--shadow); }
.wf-tpl-ico { flex: 0 0 auto; width: 32px; height: 32px; border-radius: 10px; display: grid; place-items: center; font-size: 17px; background: color-mix(in srgb, var(--wf) 12%, var(--panel)); }
.wf-tpl-meta { min-width: 0; }
.wf-tpl-title { font-size: 13px; font-weight: 700; }
.wf-tpl-desc { font-size: 11px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* 右下角缩放控件 */
.wf-zoom-bar {
  position: absolute; right: 20px; bottom: 18px; z-index: 8;
  display: flex; align-items: center; gap: 2px;
  background: var(--panel); border: 1px solid var(--line); border-radius: 10px;
  padding: 3px; box-shadow: 0 6px 20px -8px rgba(0,0,0,.35);
}
.wf-zoom-btn {
  border: none; background: transparent; color: var(--muted); cursor: pointer;
  width: 26px; height: 26px; border-radius: 7px; font-size: 15px; line-height: 1; display: grid; place-items: center;
}
.wf-zoom-btn:hover { background: color-mix(in srgb, var(--ink) 8%, transparent); color: var(--ink); }
.wf-zoom-val { font-size: 11.5px; color: var(--muted); min-width: 42px; text-align: center; font-variant-numeric: tabular-nums; }
/* 右侧浮动属性面板（参考 SOP 检查器） */
.wf-inspector {
  position: absolute; right: 0; top: 0; bottom: 0; z-index: 6;
  width: 300px; max-width: 80%;
  border: 1px solid var(--line); border-left: 1px solid var(--line);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  background: var(--panel);
  box-shadow: -8px 0 24px -12px rgba(0,0,0,.18);
  overflow-y: auto;
  /* 与 SOP 同构：折叠时右滑出画布 + 透明度淡出 */
  transition: transform .28s cubic-bezier(.16,1,.3,1), opacity .2s ease;
}
.wf-canvas-wrap.inspector-collapsed .wf-inspector { transform: translateX(calc(100% + 28px)); opacity: 0; pointer-events: none; }

/* 折叠按钮：继承 .sop-inspector-toggle 样式（默认 right: 318px，折叠后 right: 14px），
   只覆盖 display: none → grid（让按钮常显）+ 移除原有 right: 6px（避免与 sop 的 318px 冲突） */
.wf-inspector-toggle {
  position: absolute; right: 318px; top: 14px; z-index: 7;
  width: 30px; height: 48px; display: grid; place-items: center;
  border: 1px solid var(--line); background: var(--panel); border-radius: 12px;
  cursor: pointer; color: var(--ink); font-size: 16px; box-shadow: 0 8px 20px -10px rgba(0,0,0,.3);
  transform: none;
  transition: right .28s cubic-bezier(.16,1,.3,1), color .15s ease, border-color .15s ease;
}
.wf-inspector-toggle:hover { color: var(--wf); border-color: var(--wf); }
.wf-canvas-wrap.inspector-collapsed .wf-inspector-toggle { right: 14px; }
.wf-node-config-head {
  display: flex; align-items: center; justify-content: space-between;
  font-weight: 700; font-size: 13.5px; color: var(--ink);
  margin-bottom: 10px;
}
/* 折叠分组（参考 SOP 的字段分组） */
.wf-cfg-section {
  border: 1px solid var(--line); border-radius: 8px;
  background: var(--panel); margin-bottom: 8px;
}
.wf-cfg-section > summary {
  display: flex; align-items: center; gap: 6px;
  padding: 8px 12px; cursor: pointer; font-size: 12.5px; font-weight: 700;
  color: var(--ink); list-style: none;
}
.wf-cfg-section > summary::-webkit-details-marker { display: none; }
.wf-cfg-section > summary::before {
  content: "▸"; color: var(--muted); font-size: 10px; transition: transform .15s ease;
  display: inline-block;
}
.wf-cfg-section[open] > summary::before { transform: rotate(90deg); }
.wf-cfg-section > summary .wf-cfg-summary { margin-left: auto; font-weight: 500; color: var(--muted); font-size: 11.5px; }
.wf-cfg-section > .wf-cfg-body { padding: 0 12px 12px; display: flex; flex-direction: column; gap: 10px; }
.wf-cfg-section > .wf-cfg-body .field { margin: 0; }
.wf-cfg-unsupported {
  font-size: 11.5px; color: var(--muted); padding: 6px 8px;
  background: var(--bg); border-radius: 6px;
}
/* 字段级帮助 / 节点级使用说明 / 状态徽标（节点组件重构新增） */
.wf-field-help {
  font-size: 11.5px; color: var(--muted); line-height: 1.5;
  margin-top: 4px; padding: 6px 8px; background: var(--bg);
  border-radius: 6px; border: 1px dashed var(--line);
}
.wf-field-help code, .wf-node-help-body code {
  background: rgba(127,127,127,.15); padding: 1px 5px; border-radius: 4px;
  font-size: 11px;
}
.wf-node-help {
  border: 1px solid var(--line); border-radius: 8px; background: var(--panel);
  margin-bottom: 10px; overflow: hidden;
}
.wf-node-help > summary {
  display: flex; align-items: center; gap: 8px; cursor: pointer;
  padding: 8px 12px; font-size: 12.5px; font-weight: 700; color: var(--ink);
  list-style: none;
}
.wf-node-help > summary::-webkit-details-marker { display: none; }
.wf-node-help > summary::before {
  content: "▸"; color: var(--muted); font-size: 10px; transition: transform .15s ease; display: inline-block;
}
.wf-node-help[open] > summary::before { transform: rotate(90deg); }
.wf-node-help-body {
  padding: 0 12px 10px; font-size: 12px; line-height: 1.6; color: var(--ink);
}
.wf-badge {
  font-size: 10.5px; font-weight: 700; padding: 2px 7px; border-radius: 999px; white-space: nowrap;
}
.wf-badge-ok { background: #e6f6f0; color: #059669; border: 1px solid #059669; }
.wf-badge-warn { background: #fff7ed; color: #c2410c; border: 1px solid #fb923c; }
.wf-run-result {
  margin-top: 10px; padding: 12px; border-radius: var(--radius-sm);
  background: #e6f6f0; border: 1px solid #059669;
}
.wf-run-result-head { font-weight: 700; margin-bottom: 6px; }
.wf-run-result pre, .wf-log-output {
  background: #0f172a; color: #e2e8f0; border-radius: 8px;
  padding: 10px; font-size: 12px; overflow-x: auto; white-space: pre-wrap; word-break: break-all;
}
.wf-log-item {
  border: 1px solid var(--line); border-radius: var(--radius-sm);
  padding: 10px 12px; margin-bottom: 8px;
}
.wf-log-item.ok { border-left: 3px solid #059669; }
.wf-log-item.err { border-left: 3px solid #ef4444; }
.wf-log-head { display: flex; justify-content: space-between; align-items: center; font-size: 12.5px; }
.wf-log-status { font-weight: 700; }
.wf-log-item.ok .wf-log-status { color: #059669; }
.wf-log-item.err .wf-log-status { color: #ef4444; }
.wf-log-error { margin-top: 6px; color: #ef4444; font-size: 12.5px; }
.wf-logs-title { font-weight: 700; color: var(--ink); }
.mail-log-row { display: flex; gap: 12px; font-size: 12px; padding: 5px 6px; border-bottom: 1px solid #eee; align-items: center; }
.mail-log-row:last-child { border-bottom: none; }
.mail-log-time { color: var(--muted); width: 132px; flex-shrink: 0; }
.mail-log-scene { width: 86px; flex-shrink: 0; color: var(--ink); }
.mail-log-to { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ink); }
.mail-log-status { width: 40px; text-align: right; flex-shrink: 0; font-weight: 600; }
.mail-log-status.ok { color: #16a34a; }
.mail-log-status.err { color: #ef4444; }
@media (max-width: 720px) {
  .mail-log-row { flex-wrap: wrap; gap: 4px 10px; }
  .mail-log-time, .mail-log-scene { width: auto; }
}
/* #818 工作流单步调试：节点轨迹回放 */
.wf-debug-tip { font-size: 12px; color: var(--muted); padding: 8px 12px; background: var(--brand-soft, #eef4fb); border-radius: 8px; margin-bottom: 10px; }
.wf-log-item { cursor: pointer; }
.wf-log-item .wf-log-output { cursor: text; }
.wf-steps { margin-top: 8px; border-top: 1px dashed var(--line); padding-top: 8px; }
.wf-step { border: 1px solid var(--line); border-radius: 8px; margin: 6px 0; overflow: hidden; background: var(--panel); }
.wf-step-head { display: flex; align-items: center; gap: 8px; padding: 7px 10px; font-size: 12.5px; }
.wf-step.ok .wf-step-dot { background: #059669; }
.wf-step.err .wf-step-dot { background: #ef4444; }
.wf-step-dot { width: 9px; height: 9px; border-radius: 50%; flex: 0 0 auto; }
.wf-step-idx { flex: 0 0 auto; font-weight: 700; color: var(--muted); min-width: 16px; text-align: center; }
.wf-step-label { flex: 1 1 auto; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wf-step-status { flex: 0 0 auto; font-size: 11.5px; color: var(--muted); }
.wf-step.ok .wf-step-status { color: #059669; }
.wf-step.err .wf-step-status { color: #ef4444; }
.wf-step-time { flex: 0 0 auto; font-size: 11.5px; color: var(--muted); }
.wf-step-error { margin: 0 10px 8px; color: #ef4444; font-size: 12px; background: color-mix(in srgb, #ef4444 6%, transparent); border-radius: 6px; padding: 6px 8px; }
.wf-step-output { margin: 0 10px 10px; font-size: 11.5px; max-height: 180px; overflow: auto; }
.wf-status-ok { color: #059669; font-weight: 700; }
.wf-status-err { color: #ef4444; font-weight: 700; }

/* ===== 笔记模块 ===== */
.notes-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 16px;
}
.note-card {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  cursor: pointer;
  transition: transform .15s, box-shadow .15s, border-color .15s;
}
.note-card:hover { transform: translateY(-2px); box-shadow: var(--shadow); border-color: var(--brand); }
.note-card-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.note-card-title { font-size: 15px; font-weight: 700; color: var(--ink); line-height: 1.35; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.note-card-time { font-size: 11px; color: var(--muted); white-space: nowrap; }
.note-card-summary { font-size: 13px; color: var(--muted); line-height: 1.55; flex: 1; min-height: 40px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.note-card-actions { display: flex; justify-content: flex-end; gap: 6px; margin-top: 4px; }
.note-card-action, .note-row-action {
  width: 30px; height: 30px; border-radius: 8px;
  display: grid; place-items: center;
  background: var(--hover); border: 1px solid var(--line); color: var(--muted);
  cursor: pointer; transition: background .15s, color .15s, border-color .15s;
}
.note-card-action:hover, .note-row-action:hover { background: var(--brand-soft); border-color: var(--brand); color: var(--brand); }
.note-card-action.danger:hover, .note-row-action.danger:hover { background: #fef2f2; border-color: #ef4444; color: #ef4444; }
.note-card-action svg.ico, .note-row-action svg.ico { width: 15px; height: 15px; }

/* JS 切列表视图时统一用 display:block（笔记/智能体/工作流/表单共用），
   因此行间距用 margin 而非 flex gap，避免 block 化后行贴在一起 */
.notes-list { display: block; }
.notes-list-head {
  display: grid; grid-template-columns: 1fr 150px 130px;
  padding: 10px 14px; font-size: 12px; font-weight: 600; color: var(--muted);
  border-bottom: 1px solid var(--line);
  margin-bottom: 8px;
}
.note-list-row + .note-list-row { margin-top: 8px; }
.note-list-row {
  display: grid; grid-template-columns: 1fr 150px 130px;
  align-items: center;
  padding: 12px 14px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: border-color .15s, box-shadow .15s;
}
.note-list-row:hover { border-color: var(--brand); box-shadow: var(--shadow); }
.note-list-main { min-width: 0; }
.note-list-title { font-size: 14px; font-weight: 600; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.note-list-summary { font-size: 12px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-top: 2px; }
.note-list-time { font-size: 12px; color: var(--muted); }
.note-list-actions { display: flex; justify-content: flex-end; gap: 6px; }

.note-editor { display: flex; flex-direction: column; flex-wrap: nowrap; gap: 0; padding: 0; height: 100%; min-height: 0; overflow: hidden; position: relative; box-sizing: border-box; }
.note-editor-head { flex: 0 0 auto; padding: 10px 14px; margin-bottom: 0; background: var(--panel); }
.note-editor-head .toolbar { margin-bottom: 0; }
.note-editor-workspace { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: row; overflow: hidden; position: relative; box-sizing: border-box; }
.note-editor-main { flex: 1 1 auto; min-width: 0; width: 0; display: flex; flex-direction: column; min-height: 0; box-sizing: border-box; }
.note-editor-body {
  display: flex; flex-direction: column; gap: 10px; flex: 1; min-height: 0;
  padding: 0 16px 16px;
}
.note-edit-title {
  font-size: 22px; font-weight: 800; color: var(--ink);
  padding: 6px 4px 12px;
  border: none; border-radius: 0;
  border-bottom: 1px solid var(--line);
  background: transparent;
  outline: none;
}
.note-edit-title:focus { border-bottom-color: var(--brand); }
.note-edit-title::placeholder { color: var(--muted); font-weight: 600; }
.note-edit-tags { display: flex; align-items: center; gap: 10px; padding: 4px 4px 10px; }
.note-edit-tags-label { display: inline-flex; align-items: center; gap: 4px; font-size: 13px; color: var(--muted); font-weight: 600; white-space: nowrap; }
.note-edit-tags-label svg.ico { width: 15px; height: 15px; }
.note-edit-tags .input { flex: 1; border: none; border-bottom: 1px solid var(--line); border-radius: 0; background: transparent; padding: 4px 2px; font-size: 14px; outline: none; }
.note-edit-tags .input:focus { border-bottom-color: var(--brand); }
.tag-filter { max-width: 220px; }

/* 笔记卡片 / 列表中的标签胶囊 */
.note-tags { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 2px; }
.note-tag-chip { display: inline-flex; align-items: center; gap: 3px; font-size: 11px; line-height: 1; padding: 3px 7px; border-radius: 999px; background: var(--brand-soft, #eef4fb); color: var(--brand, #0B5CAD); border: 1px solid var(--brand-line, #d6e4f2); font-weight: 600; }
.note-tag-chip svg.ico { width: 11px; height: 11px; opacity: .8; }
.note-tag-chip.clickable { cursor: pointer; transition: background .15s, color .15s, border-color .15s; }
.note-tag-chip.clickable:hover { background: var(--brand, #0B5CAD); color: #fff; border-color: var(--brand, #0B5CAD); }
.note-list-tags { margin-top: 4px; }
.note-tb-btn {
  min-width: 26px; height: 26px; padding: 0 5px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--panel); border: 1px solid var(--line); border-radius: 6px;
  color: var(--ink); font-size: 12px; cursor: pointer;
  flex: 0 0 auto;
  transition: background .12s, border-color .12s, color .12s;
}
.note-tb-btn:hover { background: var(--brand-soft); border-color: var(--brand); color: var(--brand); }
.note-tb-btn.on { background: var(--brand); border-color: var(--brand); color: #fff; }
.note-tb-btn svg.ico { width: 13px; height: 13px; }
.note-tb-sep { width: 1px; height: 14px; background: var(--line); margin: 0 2px; flex: 0 0 auto; }
.note-tb-select {
  height: 26px; padding: 0 4px;
  width: 72px; min-width: 64px; max-width: 80px;
  background: var(--panel); border: 1px solid var(--line); border-radius: 6px;
  color: var(--ink); font-size: 11.5px; outline: none;
  flex: 0 0 auto;
}
.note-rich-toolbar {
  display: flex; align-items: center; flex-wrap: wrap; gap: 2px; row-gap: 4px;
  padding: 6px 8px;
  background: var(--hover); border: 1px solid var(--line); border-radius: 10px 10px 0 0;
  position: sticky; top: 0; z-index: 2;
  overflow-x: visible;
  scrollbar-width: thin;
}
/* 插入类按钮：与格式按钮区分，主色描边强调「会往正文塞内容」 */
.note-tb-btn.note-tb-ins { color: var(--brand); }
.note-tb-btn.note-tb-ins:hover { background: var(--brand); border-color: var(--brand); color: #fff; }
/* 字体/字号/段落下拉：紧凑宽度 */
.note-tb-select.note-tb-font { max-width: 96px; }
.note-tb-select.note-tb-size { max-width: 64px; }
.note-tb-select.note-tb-format { max-width: 84px; }
.note-tb-select { font-size: 12px; padding: 4px 4px; border-radius: 6px; border: 1px solid var(--line); background: var(--panel); color: var(--ink); }
/* 文字颜色 / 高亮颜色：色块 + 隐藏 input */
.note-tb-color { display: inline-flex; align-items: center; position: relative; width: 26px; height: 26px; border-radius: 6px; border: 1px solid var(--line); background: var(--panel); color: var(--muted); cursor: pointer; overflow: hidden; }
.note-tb-color:hover { border-color: var(--brand); }
.note-tb-color svg.ico { width: 15px; height: 15px; margin: auto; }
.note-tb-color input[type="color"] { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.note-tb-color.note-tb-highlight svg.ico { color: #f5c518; }
.note-rich-toolbar::-webkit-scrollbar { height: 4px; }
.note-rich-toolbar::-webkit-scrollbar-thumb { background: color-mix(in srgb, var(--muted) 40%, transparent); border-radius: 999px; }
.note-rich-content {
  flex: 1; min-height: 0;
  font-size: 14.5px; line-height: 1.85; color: var(--ink);
  padding: 16px 20px;
  background: var(--panel); border: 1px solid var(--line); border-radius: 0 0 10px 10px;
  border-top: none;
  outline: none; overflow-y: auto;
}
.note-rich-content:focus { border-color: var(--brand); box-shadow: 0 6px 20px -10px color-mix(in srgb, var(--brand) 30%, transparent); }
.note-rich-content:empty::before {
  content: attr(data-placeholder);
  color: var(--muted); pointer-events: none;
}
.note-rich-content h1 { font-size: 22px; font-weight: 700; margin: 14px 0 8px; }
.note-rich-content h2 { font-size: 18px; font-weight: 700; margin: 12px 0 6px; }
.note-rich-content h3 { font-size: 16px; font-weight: 700; margin: 10px 0 4px; }
.note-rich-content p { margin: 6px 0; }
.note-rich-content blockquote {
  margin: 8px 0; padding: 6px 12px;
  border-left: 3px solid var(--brand); color: var(--muted);
  background: var(--hover); border-radius: 0 6px 6px 0;
}
.note-rich-content ul, .note-rich-content ol { padding-left: 22px; margin: 6px 0; }
.note-rich-content li { margin: 2px 0; }
.note-rich-content a { color: var(--brand); text-decoration: underline; }
.note-rich-content img { max-width: 100%; border-radius: 6px; }
[data-theme="dark"] .note-rich-content blockquote { background: rgba(255,255,255,.04); }
.note-ai-preview {
  background: color-mix(in srgb, var(--brand) 5%, var(--panel));
  border: 1px solid color-mix(in srgb, var(--brand) 20%, var(--line));
  border-radius: var(--radius-sm);
  overflow: hidden;
}
.note-ai-preview-head {
  display: flex; justify-content: space-between; align-items: center;
  padding: 10px 12px;
  background: color-mix(in srgb, var(--brand) 8%, var(--panel));
  font-size: 13px; font-weight: 700; color: var(--brand);
}
.note-ai-preview-actions { display: flex; gap: 8px; }
.note-ai-preview-body {
  padding: 12px; font-size: 14px; line-height: 1.7;
  max-height: 220px; overflow-y: auto; white-space: pre-wrap;
}

/* ===== 选中文本浮动 AI 工具条（续写 / 摘要 / 润色 / 翻译）===== */
.note-sel-ai-bar {
  position: fixed; z-index: 1200; display: none; align-items: center; gap: 4px;
  padding: 5px 6px; border-radius: 10px;
  background: color-mix(in srgb, var(--brand) 10%, var(--panel));
  border: 1px solid color-mix(in srgb, var(--brand) 28%, var(--line));
  box-shadow: 0 8px 24px rgba(0,0,0,.18);
  backdrop-filter: saturate(160%) blur(8px);
  font-size: 13px; user-select: none;
  animation: selBarIn .12s ease-out;
}
@keyframes selBarIn { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
.note-sel-ai-btn {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 5px 9px; border: none; border-radius: 7px; cursor: pointer;
  background: transparent; color: var(--text); font-size: 13px; line-height: 1;
  transition: background .15s ease, color .15s ease, transform .15s ease;
}
.note-sel-ai-btn:hover { background: color-mix(in srgb, var(--brand) 16%, transparent); color: var(--brand); }
.note-sel-ai-btn:active { transform: scale(.96); }
.note-sel-ai-btn.busy { opacity: .5; pointer-events: none; }
.note-sel-ai-btn [data-icon] { font-size: 14px; }
.note-sel-ai-sep { width: 1px; height: 18px; background: var(--line); margin: 0 2px; }
.note-sel-ai-lang-btn {
  display: inline-flex; align-items: center; gap: 2px;
  height: 28px; padding: 0 8px; border: 1px solid var(--line); border-radius: 7px;
  background: var(--bg); color: var(--text); font-size: 12px; cursor: pointer;
  transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.note-sel-ai-lang-btn:hover { border-color: color-mix(in srgb, var(--brand) 45%, var(--line)); color: var(--brand); }
.note-sel-ai-lang-btn.busy { opacity: .5; pointer-events: none; }
.note-sel-ai-lang-current { font-weight: 600; }
.note-sel-ai-caret { width: 0; height: 0; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 5px solid currentColor; margin-left: 2px; opacity: .7; }
.note-sel-ai-lang-menu {
  position: absolute; top: calc(100% + 6px); left: 50%; transform: translateX(-50%);
  display: none; flex-direction: column; gap: 2px; padding: 4px; z-index: 1201;
  border-radius: 8px; background: var(--panel); border: 1px solid var(--line);
  box-shadow: 0 8px 24px rgba(0,0,0,.18); min-width: 64px;
}
.note-sel-ai-lang-menu button {
  display: block; width: 100%; text-align: center; padding: 5px 10px; border: none;
  background: transparent; color: var(--text); font-size: 13px; border-radius: 6px; cursor: pointer;
}
.note-sel-ai-lang-menu button:hover { background: color-mix(in srgb, var(--brand) 16%, transparent); color: var(--brand); }
.note-sel-ai-spinner { display: inline-flex; align-items: center; padding: 0 6px; }
.nb-spinner {
  width: 14px; height: 14px; border-radius: 50%;
  border: 2px solid color-mix(in srgb, var(--brand) 35%, transparent);
  border-top-color: var(--brand); animation: nbSpin .7s linear infinite;
}
@keyframes nbSpin { to { transform: rotate(360deg); } }

/* ===== 笔记编辑器增强：左侧目录 / 插入菜单 / 查找替换 ===== */
.note-toc {
  width: 240px; flex: 0 0 240px;
  display: flex; flex-direction: column; min-height: 0;
  background: var(--bg);
  border-right: 1px solid var(--line);
  transition: flex-basis .2s ease, width .2s ease;
  box-sizing: border-box; align-self: stretch;
}
.note-toc.collapsed { flex-basis: 0; width: 0; border-right: none; overflow: hidden; }
.note-toc-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 14px; border-bottom: 1px solid var(--line);
  font-size: 13px; font-weight: 700; color: var(--ink);
}
.note-toc-title { display: flex; align-items: center; gap: 6px; }
.note-toc-title svg.ico { width: 15px; height: 15px; }
.note-toc-toggle {
  width: 24px; height: 24px; border: none; background: transparent;
  color: var(--muted); cursor: pointer; border-radius: 6px;
  display: inline-flex; align-items: center; justify-content: center;
}
.note-toc-toggle:hover { background: var(--hover); color: var(--brand); }
.note-toc-list { flex: 1; min-height: 0; overflow-y: auto; padding: 8px 6px 16px; scroll-behavior: smooth; }
.note-toc-empty { padding: 18px 14px; color: var(--muted); font-size: 12px; text-align: center; line-height: 1.6; }
.note-toc-item {
  display: flex; align-items: center; gap: 4px; width: 100%;
  padding: 5px 8px; border: none; background: transparent; border-radius: 6px;
  color: var(--ink); font-size: 13px; cursor: pointer; line-height: 1.4;
  text-align: left; transition: background .12s, color .12s;
}
.note-toc-item:hover { background: var(--hover); color: var(--brand); }
.note-toc-item.active { background: var(--brand-soft); color: var(--brand); font-weight: 600; }
.note-toc-caret {
  width: 16px; height: 16px; flex: 0 0 16px;
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--muted); transition: transform .15s ease;
}
.note-toc-caret svg.ico { width: 12px; height: 12px; }
.note-toc-caret.collapsed { transform: rotate(-90deg); }
.note-toc-caret.leaf { visibility: hidden; }
.note-toc-children.collapsed { display: none; }
/* 目录展开按钮已迁移到编辑区顶部工具栏（插入按钮旁），避免被左侧返回按钮遮挡 */
.note-toc-reopen { display: none !important; }

/* 预览弹窗 / 公开页 左侧目录抽屉（复用 .note-toc-item / .note-toc-caret / .note-toc-children） */
.note-toc-side {
  flex: 0 0 220px;
  border-right: 1px solid var(--line);
  background: var(--panel);
  display: flex; flex-direction: column;
  min-height: 0;
}
.note-toc-side.hidden { display: none; }
.note-toc-side-head {
  flex: 0 0 auto;
  padding: 12px 14px;
  font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
  color: var(--muted);
  border-bottom: 1px solid var(--line);
  display: flex; align-items: center; gap: 6px;
}
.note-toc-side-head svg.ico, .note-toc-side-head .ico { width: 14px; height: 14px; }
.note-toc-side-list {
  flex: 1; min-height: 0; overflow-y: auto; padding: 8px 6px 16px; scroll-behavior: smooth;
}
.note-preview-scroll { padding: 22px 28px; }
/* 公开页：目录 + 正文 两栏 */
.note-pub-row { flex: 1 1 auto; display: flex; min-height: 0; }
.note-pub-main { flex: 1 1 auto; display: flex; flex-direction: column; min-height: 0; }

/* 移动端：目录抽屉自动隐藏，避免挤压正文 */
@media (max-width: 760px) {
  .note-toc-side { display: none !important; }
  .note-preview-scroll { padding: 16px; }
  .note-pub-body { padding: 16px 18px 20px; }
}

/* 笔记模板库 */
.note-tpl-section { display: flex; flex-direction: column; gap: 10px; }
.note-tpl-section-head { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 700; color: var(--text); letter-spacing: .02em; }
.note-tpl-section-head .ico, .note-tpl-section-head svg.ico { width: 16px; height: 16px; opacity: .8; }
.note-tpl-section-head .note-tpl-add { margin-left: auto; }
.note-tpl-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px; }
.note-tpl-card { position: relative; display: flex; flex-direction: column; gap: 8px; padding: 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--panel); cursor: pointer; transition: border-color .15s, box-shadow .15s, transform .15s; }
.note-tpl-card:hover { border-color: var(--accent, #0B5CAD); box-shadow: 0 4px 16px rgba(11, 90, 173, .12); transform: translateY(-1px); }
.note-tpl-card-ico { width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; border-radius: 8px; background: rgba(11, 90, 173, .1); color: var(--accent, #0B5CAD); }
.note-tpl-card-ico .ico, .note-tpl-card-ico svg.ico { width: 16px; height: 16px; }
.note-tpl-card-name { font-size: 14px; font-weight: 600; color: var(--text); line-height: 1.4; }
.note-tpl-card-acts { display: flex; gap: 6px; margin-top: 2px; }
.note-tpl-empty { font-size: 13px; color: var(--muted); padding: 8px 2px; }

/* 插入菜单 */
.note-insert-wrap { position: relative; }
.note-insert-menu {
  position: absolute; top: calc(100% + 6px); left: 0; z-index: 50;
  min-width: 170px; background: var(--panel); border: 1px solid var(--line);
  border-radius: 10px; box-shadow: var(--shadow); padding: 6px;
  display: none; flex-direction: column; gap: 2px;
}
.note-insert-menu.open { display: flex; }
.note-insert-item {
  display: flex; align-items: center; gap: 9px; padding: 7px 10px;
  border: none; background: transparent; border-radius: 7px;
  color: var(--ink); font-size: 13px; cursor: pointer; text-align: left;
}
.note-insert-item:hover { background: var(--brand-soft); color: var(--brand); }
.note-insert-item svg.ico { width: 15px; height: 15px; flex: 0 0 auto; }

/* 查找替换弹窗 */
.note-fr-pop {
  position: fixed; top: 76px; right: 24px; z-index: 1200; width: 320px;
  background: var(--panel); border: 1px solid var(--line); border-radius: 12px;
  box-shadow: var(--shadow); overflow: hidden;
}
.note-fr-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 14px; border-bottom: 1px solid var(--line);
  font-weight: 700; font-size: 13px; color: var(--ink);
}
.note-fr-close {
  border: none; background: transparent; color: var(--muted);
  font-size: 18px; line-height: 1; cursor: pointer; border-radius: 6px;
  width: 24px; height: 24px;
}
.note-fr-close:hover { background: var(--hover); color: var(--ink); }
.note-fr-body { padding: 12px 14px; display: flex; flex-direction: column; gap: 10px; }
.note-fr-row { display: flex; align-items: center; gap: 8px; }
.note-fr-row .input { flex: 1; height: 34px; }
.note-fr-count { font-size: 12px; color: var(--muted); white-space: nowrap; }
.note-fr-opt { font-size: 12.5px; color: var(--muted); display: flex; align-items: center; gap: 6px; cursor: pointer; }
.note-fr-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.note-fr-actions .btn { flex: 1; }

/* 查找高亮 */
.note-rich-content mark.note-find-hit {
  background: color-mix(in srgb, #ffd54a 75%, transparent);
  color: inherit; border-radius: 2px; padding: 0 1px;
}
.note-rich-content mark.note-find-hit.current { background: var(--brand); color: #fff; }
[data-theme="dark"] .note-rich-content mark.note-find-hit { background: rgba(255, 213, 74, .45); }
[data-theme="dark"] .note-rich-content mark.note-find-hit.current { background: var(--brand); color: #fff; }

/* 图片/表格尺寸调整弹窗 */
.note-size-pop {
  position: fixed;
  z-index: 1200;
  min-width: 260px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: var(--shadow);
  padding: 12px 14px;
  display: none;
}
.note-size-pop-head {
  font-size: 13px;
  font-weight: 700;
  color: var(--ink);
  margin-bottom: 10px;
}
.note-size-pop-row {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}
.note-size-pop-row label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: var(--muted);
  white-space: nowrap;
}
.note-size-pop-row input {
  width: 72px;
  padding: 6px 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  font-size: 13px;
  background: var(--bg);
  color: var(--ink);
}
.note-size-pop-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

/* 搜索命中高亮（列表卡片摘要 / 标题） */
mark { background: color-mix(in srgb, var(--brand) 30%, transparent); color: inherit; border-radius: 3px; padding: 0 1px; }
.note-snip { font-size: 12.5px; color: var(--muted); margin: -4px 0 2px; line-height: 1.5; max-height: 3.2em; overflow: hidden; }
.note-snip mark { background: color-mix(in srgb, var(--brand) 40%, transparent); }

/* 笔记全文检索：结果统计条 */
.notes-search-summary {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 8px 14px; margin-bottom: 12px;
  border: 1px solid var(--line); border-radius: 10px;
  background: color-mix(in srgb, var(--brand) 6%, var(--panel));
  font-size: 13px; color: var(--ink);
}
.notes-search-summary .nss-text b { color: var(--brand); font-weight: 700; }
.notes-search-summary .nss-clear {
  flex: 0 0 auto; border: 1px solid var(--line); background: var(--panel); color: var(--muted);
  border-radius: 8px; padding: 4px 12px; font-size: 12px; cursor: pointer;
  transition: color .18s ease, border-color .18s ease;
}
.notes-search-summary .nss-clear:hover { color: var(--brand); border-color: var(--brand); }

/* 命中次数徽标 */
.note-hit-badge {
  display: inline-block; margin-left: 8px; padding: 1px 7px;
  border-radius: 999px; font-size: 11px; font-weight: 600; line-height: 1.6;
  background: color-mix(in srgb, var(--brand) 16%, transparent); color: var(--brand);
  vertical-align: middle; white-space: nowrap;
}
.note-card-meta { display: flex; align-items: center; justify-content: space-between; gap: 6px; }
.note-card-meta .note-hit-badge { margin-left: 0; }

/* 列表视图命中片段 */
.note-list-snip {
  font-size: 12px; color: var(--muted); line-height: 1.5; margin-top: 3px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.note-list-snip mark { background: color-mix(in srgb, var(--brand) 40%, transparent); }

/* 历史版本列表 */
.note-ver-row {
  display: flex; align-items: center; gap: 12px;
  padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; margin-bottom: 8px; background: var(--panel);
}
.note-ver-main { flex: 1; min-width: 0; }
.note-ver-title { font-weight: 600; font-size: 13.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.note-ver-badge { font-size: 10.5px; font-weight: 600; color: #fff; background: var(--brand); border-radius: 6px; padding: 1px 6px; margin-left: 6px; vertical-align: middle; }
.note-ver-meta { font-size: 12px; color: var(--muted); margin-top: 2px; }
.note-ver-actions { flex: 0 0 auto; }

/* 插入内容块样式 */
.note-rich-content img.note-inline-img { max-width: 100%; border-radius: 6px; }
.note-rich-content table.note-table { border-collapse: collapse; width: 100% !important; max-width: 100%; margin: 8px 0; table-layout: fixed !important; }
.note-rich-content table.note-table th,
.note-rich-content table.note-table td { border: 1px solid var(--line); padding: 6px 10px; font-size: 13.5px; word-break: break-word; overflow-wrap: break-word; min-width: 0 !important; }
.note-rich-content table.note-table th { background: var(--hover); font-weight: 600; }
/* 表格样式预设（右键菜单）：条纹 / 表头着色 / 清晰边框 */
.note-rich-content table.note-table.note-table-striped tbody tr:nth-child(even) { background: color-mix(in srgb, var(--hover) 55%, transparent); }
.note-rich-content table.note-table.note-table-brand thead th { background: #0b5cad; color: #fff; border-color: #0b5cad; }
.note-rich-content table.note-table.note-table-brand thead th:first-child { border-radius: 6px 0 0 0; }
.note-rich-content table.note-table.note-table-brand thead th:last-child { border-radius: 0 6px 0 0; }
.note-rich-content table.note-table.note-table-bordered { border: 2px solid color-mix(in srgb, var(--accent) 55%, var(--line)); }
.note-rich-content table.note-table.note-table-bordered th,
.note-rich-content table.note-table.note-table-bordered td { border: 1.5px solid color-mix(in srgb, var(--accent) 40%, var(--line)); }
.note-rich-content pre.note-code {
  background: var(--hover); border: 1px solid var(--line); border-radius: 8px;
  padding: 12px 14px; margin: 8px 0; overflow-x: auto;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 13px; line-height: 1.6; color: var(--ink); white-space: pre-wrap;
}
.note-rich-content pre.note-code code { background: transparent; padding: 0; }
.note-rich-content hr.note-hr { border: none; border-top: 1px solid var(--line); margin: 14px 0; }
.note-rich-content .note-math-block {
  background: var(--hover); border: 1px dashed color-mix(in srgb, var(--brand) 40%, var(--line));
  border-radius: 8px; padding: 10px 14px; margin: 8px 0;
  font-family: ui-monospace, monospace; font-size: 13.5px; color: var(--brand);
}
.note-rich-content .note-attach {
  display: inline-flex; align-items: center; gap: 8px; padding: 6px 10px;
  background: var(--hover); border: 1px solid var(--line); border-radius: 8px;
  margin: 4px 0; font-size: 13px; color: var(--ink); max-width: 100%;
  text-decoration: none; cursor: pointer; transition: border-color .15s, background .15s;
}
.note-rich-content .note-attach:hover { border-color: var(--brand); background: color-mix(in srgb, var(--brand) 8%, var(--hover)); }
.note-rich-content .note-attach .na-icon { color: var(--brand); flex: 0 0 auto; display: inline-flex; }
.note-rich-content .note-attach .na-icon svg.ico { width: 14px; height: 14px; }
.note-rich-content .note-attach .na-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.note-rich-content .note-attach .na-size { color: var(--muted); font-size: 11px; flex: 0 0 auto; }
/* C1 三角引用：笔记内设备引用标记（点击跳设备台账） */
.note-rich-content .note-device-ref {
  display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px; margin: 0 2px;
  background: color-mix(in srgb, var(--brand) 8%, var(--hover));
  border: 1px solid color-mix(in srgb, var(--brand) 35%, var(--line));
  border-radius: 999px; font-size: 12.5px; color: var(--brand);
  cursor: pointer; user-select: none; transition: background .15s, border-color .15s;
}
.note-rich-content .note-device-ref:hover { background: color-mix(in srgb, var(--brand) 14%, var(--hover)); border-color: var(--brand); }
.note-rich-content .note-device-ref .na-icon { display: inline-flex; }
.note-rich-content .note-device-ref svg.ico { width: 13px; height: 13px; }

/* 表格单元格右键菜单：删除行/列 */
.note-ctx-menu {
  position: absolute; z-index: 9999; display: none;
  background: var(--panel); border: 1px solid var(--line); border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0,0,0,.18); padding: 4px; min-width: 120px;
}
.note-ctx-menu .note-ctx-item {
  display: block; width: 100%; text-align: left; border: none; background: transparent;
  padding: 7px 10px; border-radius: 6px; font-size: 13px; color: var(--ink); cursor: pointer;
}
.note-ctx-menu .note-ctx-item:hover { background: var(--hover); }
.note-ctx-menu .note-ctx-item.disabled { opacity: .4; cursor: not-allowed; }
.note-ctx-menu .note-ctx-sec { padding: 3px 0; border-top: 1px solid var(--line); }
.note-ctx-menu .note-ctx-sec:first-child { border-top: none; }
.note-ctx-menu .note-ctx-label { font-size: 11px; color: var(--muted); padding: 4px 10px 2px; user-select: none; }
.note-ctx-color-row { display: flex; flex-wrap: wrap; gap: 6px; padding: 4px 10px 6px; align-items: center; }
.note-ctx-swatch { width: 22px; height: 22px; border-radius: 5px; border: 1px solid var(--line); padding: 0; cursor: pointer; box-shadow: none; }
.note-ctx-swatch:hover { outline: 2px solid var(--brand); outline-offset: 1px; }
.note-ctx-color-pick { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; color: var(--ink); padding: 2px 8px; border: 1px solid var(--line); border-radius: 5px; cursor: pointer; }
.note-ctx-color-pick input[type=color] { width: 22px; height: 20px; border: none; background: transparent; padding: 0; cursor: pointer; }

/* 笔记导出格式菜单（复用 note-ctx-menu 外观，条目改为图标 + 文案） */
.note-export-menu { min-width: 196px; }
.note-export-menu .note-ctx-item {
  display: flex; align-items: center; gap: 9px; padding: 8px 10px; white-space: nowrap;
}
.note-export-menu .note-ctx-item [data-icon] { color: var(--muted); display: inline-flex; flex: 0 0 auto; }
.note-export-menu .note-ctx-item [data-icon] svg.ico { width: 15px; height: 15px; }
.note-export-menu .note-ctx-item:hover [data-icon] { color: var(--brand); }

/* 表格增强：冻结表头 / 自定义列宽 / 列宽拖拽手柄 */
.note-rich-content table.note-table.note-table-freeze thead th {
  position: sticky; top: 0; z-index: 3; background: var(--hover);
  box-shadow: 0 1px 0 var(--line);
}
.note-rich-content table.note-table.note-table-resized { width: auto !important; max-width: none !important; }
.note-rich-content table.note-table th,
.note-rich-content table.note-table td { position: relative; }
.note-rich-content table.note-table th::after {
  content: ''; position: absolute; top: 0; right: 0; bottom: 0; width: 6px;
  cursor: col-resize;
}
.note-rich-content table.note-table th:hover::after { background: color-mix(in srgb, var(--accent) 32%, transparent); }
/* 行高拖拽指示：行下缘 9px 热区，与列宽对称的拖拽光标（row-resize）+ 悬停高亮 */
.note-rich-content table.note-table th::before,
.note-rich-content table.note-table td::before {
  content: ''; position: absolute; left: 0; right: 0; bottom: -5px; height: 9px;
  cursor: row-resize;
  z-index: 2;
}
.note-rich-content table.note-table tr:hover th::before,
.note-rich-content table.note-table tr:hover td::before {
  background: color-mix(in srgb, var(--accent) 26%, transparent);
}

/* 响应式：小屏目录改为浮层 */
@media (max-width: 860px) {
  .note-toc {
    position: absolute; z-index: 8; top: 0; bottom: 0; left: 0;
    box-shadow: var(--shadow); width: 220px; flex-basis: 220px;
  }
  .note-toc.collapsed { display: none; }
  .note-toc-reopen { display: none !important; }
}

@media (max-width: 768px) {
  .notes-grid { grid-template-columns: 1fr; }
  .notes-list-head { display: none; }
  .note-list-row { grid-template-columns: 1fr; gap: 8px; }
  .note-list-actions { justify-content: flex-start; }
}

/* Upload queue: 右下角小弹窗，不干扰主文件列表 */
.upload-queue {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 1000;
  width: 320px;
  max-height: 50vh;
  overflow-y: auto;
  margin: 0;
  padding: 14px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow);
  display: flex; flex-direction: column; gap: 10px;
}
.uq-item { display: flex; flex-direction: column; gap: 5px; }
.uq-row { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.uq-name { font-size: 13px; color: var(--ink); font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.uq-status { font-size: 11px; color: var(--muted); white-space: nowrap; }
.uq-bar { height: 8px; background: #eef1f6; border-radius: 999px; overflow: hidden; }
.uq-fill { height: 100%; width: 0; background: linear-gradient(90deg, var(--brand), #4f86f7); border-radius: 999px; transition: width .15s ease; }
.uq-status.uq-cancelled { color: var(--danger, #ef4444); }
.uq-cancel {
  flex: 0 0 auto; width: 22px; height: 22px; border: none; border-radius: 50%;
  background: rgba(120,130,150,0.12); color: var(--muted); cursor: pointer;
  font-size: 12px; line-height: 1; display: inline-flex; align-items: center; justify-content: center;
  transition: background .15s, color .15s, transform .15s;
}
.uq-cancel:hover { background: var(--danger, #ef4444); color: #fff; transform: scale(1.08); }
.uq-cancel:disabled { opacity: .4; cursor: default; }

/* Password gate */
.pwd-gate { display: flex; align-items: center; justify-content: center; min-height: 50vh; }
.pwd-card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 28px 26px; width: 320px; max-width: 90%; box-shadow: 0 8px 30px rgba(20,40,80,0.08); text-align: center; }
.pwd-card h3 { margin: 0 0 16px; font-size: 16px; color: var(--ink); }
.pwd-card .input { width: 100%; margin-bottom: 12px; text-align: center; }
.pwd-card .btn { width: 100%; }

/* Document reader */
.doc-frame { width: 100%; height: calc(100vh - 200px); min-height: 60vh; border: 0; border-radius: var(--radius); background: #fff; }

/* Avatar preview */
.avatar-preview {
  width: 80px; height: 80px; border-radius: 50%;
  background: var(--brand); color: #fff; font-size: 28px; font-weight: 700;
  display: flex; align-items: center; justify-content: center; margin: 0 auto 12px;
  background-position: center; background-size: cover;
}

/* Dark theme */
[data-theme="dark"] {
  --bg: #0f1420;
  --panel: #171c2b;
  --ink: #e6e9f0;
  --muted: #9aa3b5;
  --line: #2a3144;
  --hover: #232a3d;
  --brand-soft: #1d2a4a;
  --shadow: 0 4px 24px rgba(0, 0, 0, 0.45);
}
[data-theme="dark"] body { background: var(--bg); }
[data-theme="dark"] .input, [data-theme="dark"] .textarea, [data-theme="dark"] select {
  background: #0f1420; color: var(--ink); border-color: var(--line);
}
[data-theme="dark"] .file-card .thumb,
[data-theme="dark"] .thumb-small,
[data-theme="dark"] .file-list th,
[data-theme="dark"] .file-list tr:hover td,
[data-theme="dark"] .user-table th,
[data-theme="dark"] .chat { background: #11161f; }
[data-theme="dark"] .sidebar,
[data-theme="dark"] .topbar-public,
[data-theme="dark"] .modal,
[data-theme="dark"] .card { background: var(--panel); }
[data-theme="dark"] .tree-row:hover,
[data-theme="dark"] .folder-select-row:hover,
[data-theme="dark"] .nav-item.active { color: var(--nav-color); }
[data-theme="dark"] .tag-status.on { background: rgba(34,197,94,.18); color: #4ade80; }
[data-theme="dark"] .tag-status.off { background: rgba(239,68,68,.18); color: #f87171; }
[data-theme="dark"] .tag-cap.on { background: rgba(34,197,94,.18); color: #4ade80; }
[data-theme="dark"] .batch-bar { background: #1d2a4a; border-color: #2a406a; }
[data-theme="dark"] .file-list tbody tr.selected td,
[data-theme="dark"] .file-list tbody tr[data-folder].selected td { background: #1d2a4a; }
[data-theme="dark"] .user-table td { background: #171c2b; }
[data-theme="dark"] .user-table tr:hover td { background: #11161f; }
[data-theme="dark"] .tag-cap.off { background: rgba(100,116,139,.18); color: #94a3b8; }
[data-theme="dark"] .tag-cap.danger { background: rgba(239,68,68,.18); color: #f87171; }
[data-theme="dark"] .login-page {
  background: radial-gradient(circle at 20% 30%, rgba(26, 86, 219, 0.18) 0%, transparent 40%),
    radial-gradient(circle at 80% 70%, rgba(249, 115, 22, 0.14) 0%, transparent 40%), #0f1420;
}
[data-theme="dark"] .home-search-box { background: var(--panel); }
[data-theme="dark"] .mode-btn { background: var(--panel); }
[data-theme="dark"] .mode-btn.active { background: var(--brand); color: #fff; }
[data-theme="dark"] .home-ai-answer { background: color-mix(in srgb, var(--brand) 10%, var(--panel)); }
[data-theme="dark"] .home-tag { background: #1d2433; color: var(--muted); }
[data-theme="dark"] .home-tag-chip { background: #11161f; border-color: #2a3344; color: var(--muted); }
[data-theme="dark"] .home-tag-chip:hover { border-color: var(--brand); color: var(--brand); }
[data-theme="dark"] .home-tag-chip.on { background: var(--brand); border-color: var(--brand); color: #fff; }
[data-theme="dark"] .home-result-thumb { background: #11161f; }
[data-theme="dark"] .home-title { background: linear-gradient(135deg, #60a5fa, #93c5fd); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
[data-theme="dark"] .toast { background: #2a3144; }
[data-theme="dark"] .pwd-card { background: var(--panel); }
[data-theme="dark"] .uq-bar { background: #2a3144; }
[data-theme="dark"] .sidebar-toggle .bar { background: var(--ink); }

/* Responsive */
.sidebar-mask { display: none; }

/* ============ 响应式 / 移动端 ============ */
@media (max-width: 768px) {
  /* 登录页 */
  .login-page { padding: 16px; }
  .login-card { width: 100%; max-width: 92%; padding: 28px 22px; }
  .login-card h2 { font-size: 21px; }
  .login-card .hint { font-size: 13px; margin-bottom: 18px; }
  .login-preview-wrap { max-height: 300px; }

  /* 后台：侧边栏改为抽屉 */
  .app-layout { height: 100vh; overflow: hidden; }
  .sidebar {
    position: fixed; top: 0; bottom: 0; left: 0;
    width: 82%; max-width: 300px; height: 100%;
    z-index: 60; transform: translateX(-100%);
    transition: transform 0.25s ease;
    box-shadow: 0 0 40px rgba(0,0,0,0.25);
    border-radius: 0 var(--radius) var(--radius) 0;
  }
  .sidebar.open { transform: translateX(0); }
  .sidebar.collapsed { width: 82%; max-width: 300px; }
  .workspace { width: 100%; }
  .sidebar-mask {
    position: fixed; inset: 0;
    background: rgba(15, 20, 32, 0.45); z-index: 55;
  }
  .sidebar-mask.show { display: block; }

  /* 移动端侧边栏：折叠按钮改为抽屉内的关闭按钮 */
  .sidebar-collapse {
    position: absolute; top: 16px; right: 14px;
    width: 30px; height: 30px; margin-left: 0;
  }
  .sidebar-collapse::before { content: '\2715'; font-size: 14px; } /* × 关闭 */
  .sidebar.open .sidebar-collapse { display: flex; }
  .sidebar:not(.open) .sidebar-collapse { display: none; }

  /* 主内容：移动端保持紧凑，留出左侧浮动菜单按钮空间 */
  .main .content { padding: 12px; }
  .panel { padding: 0; }
  .explorer-head { padding: 0 0 10px; margin-bottom: 12px; }
  .page-head { padding-bottom: 10px; margin-bottom: 12px; }
  .panel > .toolbar { padding-bottom: 10px; margin-bottom: 12px; }
  .file-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .toolbar { gap: 8px; }
  .local-search { width: 100%; }

  /* 表格横向滚动 */
  .user-table, .url-case-table, .file-list, .audit-table { display: block; width: 100%; overflow-x: auto; white-space: nowrap; -webkit-overflow-scrolling: touch; }
  .card { overflow: hidden; }
  /* 编辑器画布：移动端 inspector 改为右侧滑层，避免挤压画布；画布本身触控拖拽平移已支持横向浏览 */
  .sop-toolbar, .wf-toolbar { flex-wrap: wrap; row-gap: 6px; }
  .sop-canvas-wrap, .wf-canvas-wrap { touch-action: none; min-height: 56vh; }
  .sop-inspector, .wf-inspector { position: fixed !important; top: 0; right: 0; bottom: 0; width: 86%; max-width: 360px; z-index: 70; border-radius: 0; box-shadow: -10px 0 34px rgba(0,0,0,.32); }
  .sop-inspector-toggle, .wf-inspector-toggle { right: auto !important; left: 12px; top: 12px; }

  /* 弹窗近全屏 */
  .modal-mask { padding: 12px; align-items: flex-end; }
  .modal { width: 100%; padding: 18px; max-height: 92vh; overflow-y: auto; }
  .confirm-dialog { width: 100%; max-width: 360px; }
  #chat { height: 46vh !important; }
  .office-frame { height: 70vh; }
  .doc-frame { height: calc(100vh - 160px); min-height: 60vh; }
}

@media (max-width: 480px) {
  .login-card { padding: 24px 18px; }
  .file-grid { grid-template-columns: 1fr; }
  .brand-text { display: none; }
  /* 资源管理工具栏窄屏更紧凑：按钮收紧,搜索框与类型筛选各占一行 */
  .toolbar { gap: 6px; }
  .toolbar .btn { padding: 6px 10px; font-size: 13px; }
  .toolbar .btn.primary { padding: 6px 11px; }
  .local-search { width: 100%; order: 5; }
  .type-filter { width: 100%; order: 6; justify-content: flex-start; }
  .explorer-head { padding: 0 0 10px; }
  .page-head { padding-bottom: 10px; }
  .panel > .toolbar { padding-bottom: 10px; }
}
@media (max-width: 1100px) {
  .sidebar-bottom-btn.user-btn { padding: 6px; justify-content: center; }
  .sidebar-bottom-btn.user-btn .user-name { display: none; }
}

/* ===== 回收站文件浏览布局 ===== */
#tabTrash .explorer-body { padding-top: 4px; }
#trashGrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 16px; }
#trashListView { table-layout: fixed; width: 100%; }
.trash-card { display: flex; flex-direction: column; min-height: 230px; padding: 12px; border: 1px solid transparent; border-radius: var(--radius-sm); transition: 0.15s; cursor: pointer; }
.trash-card:hover { border-color: var(--brand); transform: translateY(-2px); box-shadow: var(--shadow); }
.trash-card.selected { border-color: var(--brand); background: var(--brand-soft); }
.trash-card .thumb { margin-bottom: 8px; }
.trash-card .title { margin-bottom: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.trash-card .meta { margin-bottom: 10px; }
.trash-card .actions { position: static; opacity: 1; display: flex; gap: 8px; margin-top: auto; width: 100%; }
.trash-card .actions .btn { flex: 1; padding: 6px 8px; font-size: 12px; border-radius: 6px; }
.trash-card .actions .btn.danger { background: #fee2e2; color: #b91c1c; border-color: #fecaca; }
.trash-card .actions .btn.danger:hover { background: #fecaca; }
#trashGrid.reveal-in .trash-card,
#trashListView.reveal-in tbody tr { animation: cardReveal .5s cubic-bezier(.2,.7,.2,1) both; }
#trashGrid.reveal-in .trash-card:nth-child(2){animation-delay:.05s}
#trashGrid.reveal-in .trash-card:nth-child(3){animation-delay:.1s}
#trashGrid.reveal-in .trash-card:nth-child(4){animation-delay:.15s}
#trashGrid.reveal-in .trash-card:nth-child(5){animation-delay:.2s}
#trashGrid.reveal-in .trash-card:nth-child(6){animation-delay:.25s}
#trashGrid.reveal-in .trash-card:nth-child(7){animation-delay:.3s}
#trashGrid.reveal-in .trash-card:nth-child(8){animation-delay:.35s}
#trashGrid.reveal-in .trash-card:nth-child(n+9){animation-delay:.4s}
#trashListView.reveal-in tbody tr:nth-child(2){animation-delay:.05s}
#trashListView.reveal-in tbody tr:nth-child(3){animation-delay:.1s}
#trashListView.reveal-in tbody tr:nth-child(4){animation-delay:.15s}
#trashListView.reveal-in tbody tr:nth-child(5){animation-delay:.2s}
#trashListView.reveal-in tbody tr:nth-child(6){animation-delay:.25s}
#trashListView.reveal-in tbody tr:nth-child(7){animation-delay:.3s}
#trashListView.reveal-in tbody tr:nth-child(8){animation-delay:.35s}
#trashListView.reveal-in tbody tr:nth-child(n+9){animation-delay:.4s}
@media (prefers-reduced-motion: reduce) {
  #trashGrid.reveal-in .trash-card,
  #trashListView.reveal-in tbody tr { animation: none; }
}
[data-theme="dark"] .trash-card .actions .btn.danger { background: rgba(254,202,202,.15); color: #fecaca; border-color: rgba(254,202,202,.3); }
[data-theme="dark"] .trash-card .actions .btn.danger:hover { background: rgba(254,202,202,.25); }

/* ===== 统一上传按钮 + 下拉菜单 ===== */
.upload-wrap { position: relative; display: inline-block; }
.upload-menu {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  z-index: 50;
  min-width: 160px;
  background: var(--card, #fff);
  border: 1px solid var(--border, rgba(0,0,0,0.08));
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(0,0,0,0.18);
  padding: 6px;
  display: none;
}
.upload-menu-item {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 9px 12px;
  border: none;
  background: transparent;
  border-radius: 8px;
  cursor: pointer;
  font-size: 14px;
  color: var(--text, #1a1a1a);
  text-align: left;
}
.upload-menu-item:hover { background: var(--hover, rgba(0,0,0,0.05)); }
.upload-menu-item [data-icon] { color: var(--muted, #888); }

/* ===== 用户头像浮窗（卡片式菜单，WorkBuddy 风格浮层，不嵌套主界面） ===== */
.user-popup {
  position: fixed; z-index: 200; width: 264px;
  background: var(--panel); border: 1px solid var(--line, #e5e7eb);
  border-radius: 16px; box-shadow: 0 20px 60px rgba(0,0,0,.30);
  padding: 10px; display: none;
}
.user-popup.show { display: block; animation: upPop .14s ease-out; }
@keyframes upPop { from { opacity: 0; transform: translateY(6px) scale(.98); } to { opacity: 1; transform: none; } }
.up-head { display: flex; align-items: center; gap: 12px; padding: 8px 8px 12px; margin-bottom: 6px; border-bottom: 1px solid var(--line, #eef0f4); }
.up-avatar {
  width: 46px; height: 46px; border-radius: 50%; flex: 0 0 auto;
  background: linear-gradient(135deg, #1a56db, #3b82f6); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 18px; font-weight: 700; background-size: cover; background-position: center;
}
.up-meta { min-width: 0; }
.up-name { font-weight: 700; font-size: 15px; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.up-role { font-size: 12px; color: var(--muted); margin-top: 2px; }
.up-list { display: flex; flex-direction: column; gap: 2px; }
.up-item {
  display: flex; align-items: center; gap: 12px; width: 100%;
  padding: 10px 10px; border: none; background: transparent; cursor: pointer;
  border-radius: 10px; text-align: left; color: var(--ink);
  font-size: 14px; font-weight: 500; transition: background .15s, color .15s;
}
.up-item:hover { background: var(--hover, rgba(0,0,0,.06)); }
.up-item .up-ic { display: inline-flex; align-items: center; justify-content: center; color: var(--muted); transition: color .15s; }
.up-item:hover .up-ic { color: var(--brand, #2563eb); }
.up-item .up-txt { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.up-item.danger { color: var(--danger, #ef4444); }
.up-item.danger .up-ic { color: var(--danger, #ef4444); }
.up-item.danger:hover { background: rgba(239,68,68,.10); }
.up-divider { height: 1px; background: var(--line, #eef0f4); margin: 6px 4px; }
/* 外观：右侧 浅色/深色 胶囊分段开关 */
.up-toggle { display: inline-flex; background: var(--hover, rgba(0,0,0,.06)); border-radius: 999px; padding: 2px; gap: 2px; flex: 0 0 auto; }
.up-tg {
  width: 30px; height: 26px; border: none; background: transparent; cursor: pointer;
  border-radius: 999px; display: inline-flex; align-items: center; justify-content: center;
  color: var(--muted); transition: background .15s, color .15s;
}
.up-tg.active { background: var(--panel); color: var(--brand, #2563eb); box-shadow: 0 1px 3px rgba(0,0,0,.14); }
.up-tg:hover { color: var(--brand, #2563eb); }

/* ===== 帮助与操作说明 弹窗 ===== */
.modal-mask {
  position: fixed; inset: 0; z-index: 300; display: none;
  align-items: center; justify-content: center;
  background: rgba(8,12,20,.55); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px);
  padding: 20px;
}
.modal-mask.show { display: flex; animation: maskFade .16s ease-out; }
@keyframes maskFade { from { opacity: 0; } to { opacity: 1; } }
.modal {
  width: min(820px, 100%); max-height: 86vh; display: flex; flex-direction: column;
  background: var(--panel); border: 1px solid var(--line, #e5e7eb);
  border-radius: 16px; box-shadow: 0 30px 80px rgba(0,0,0,.40);
  overflow: hidden; animation: modalPop .18s ease-out;
}
@keyframes modalPop { from { opacity: 0; transform: translateY(10px) scale(.98); } to { opacity: 1; transform: none; } }
.modal-head { display: flex; align-items: center; justify-content: space-between; padding: 16px 18px; border-bottom: 1px solid var(--line, #eef0f4); }
.modal-head h3 { margin: 0; font-size: 16px; font-weight: 700; color: var(--ink); }
.help-modal .modal-close {
  width: 32px; height: 32px; border: none; background: transparent; color: var(--muted);
  border-radius: 9px; cursor: pointer; display: inline-flex; align-items: center; justify-content: center;
  transition: background .15s, color .15s;
}
.help-modal .modal-close:hover { background: var(--hover, rgba(0,0,0,.06)); color: var(--ink); }
.help-modal .modal-body { padding: 18px; overflow-y: auto; }
/* SFV 板块：选择目标文件夹弹窗（对标资源管理 moveTree）—— 树状结构 + folder icon + 新建文件夹按钮 */
.folder-picker-toolbar { display: flex; align-items: center; gap: 8px; padding: 0 0 10px; border-bottom: 1px solid var(--line); margin-bottom: 8px; }
.folder-picker-body { max-height: 50vh; overflow: auto; padding: 4px; }
.fp-row { padding: 2px 0; }
.fp-item { display: flex; align-items: center; gap: 8px; padding: 6px 10px; border-radius: 6px; cursor: pointer; transition: background .12s; user-select: none; }
.fp-item:hover { background: color-mix(in srgb, var(--brand) 8%, transparent); }
.fp-item input[type="radio"] { cursor: pointer; accent-color: var(--brand); flex: 0 0 auto; }
.fp-item .fp-ico { width: 18px; height: 18px; display: inline-grid; place-items: center; color: var(--brand); flex: 0 0 auto; }
.fp-item .fp-ico svg { width: 16px; height: 16px; }
.fp-item .fp-name { flex: 1 1 auto; font-size: 13px; color: var(--ink); }
.fp-item.fp-root { font-weight: 600; border-bottom: 1px solid var(--line); margin-bottom: 4px; padding-bottom: 8px; }
.help-modal .modal { padding: 0; }
.help-body { color: var(--ink); line-height: 1.7; font-size: 14px; }
.help-body h1 { font-size: 22px; margin: 0 0 14px; }
.help-body h2 { font-size: 17px; margin: 22px 0 10px; padding-bottom: 6px; border-bottom: 1px solid var(--line, #eef0f4); }
.help-body h3 { font-size: 15px; margin: 16px 0 8px; }
.help-body p { margin: 8px 0; }
.help-body ul, .help-body ol { margin: 8px 0; padding-left: 22px; }
.help-body li { margin: 4px 0; }
.help-body code { background: var(--hover, rgba(0,0,0,.06)); padding: 1px 6px; border-radius: 6px; font-size: 12.5px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.help-body strong { font-weight: 700; }
.help-body a { color: var(--brand, #2563eb); text-decoration: none; }
.help-body a:hover { text-decoration: underline; }
.help-body hr.help-hr { border: none; border-top: 1px solid var(--line, #eef0f4); margin: 18px 0; }
.help-body blockquote.help-quote { margin: 10px 0; padding: 8px 14px; border-left: 3px solid var(--brand, #2563eb); background: var(--hover, rgba(0,0,0,.04)); border-radius: 8px; color: var(--muted); }
.help-body pre.help-code { background: var(--hover, rgba(0,0,0,.05)); border: 1px solid var(--line, #eef0f4); border-radius: 10px; padding: 12px 14px; overflow-x: auto; font-size: 12.5px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; line-height: 1.5; }
.help-body pre.help-code code { background: transparent; padding: 0; border-radius: 0; }
.help-body .help-img { max-width: 100%; border-radius: 10px; border: 1px solid var(--line, #eef0f4); margin: 8px 0; display: block; }
.help-body .help-fig-cap { font-size: 12.5px; color: var(--muted); padding: 8px 12px; border: 1px dashed var(--line, #e5e7eb); border-radius: 10px; background: var(--hover, rgba(0,0,0,.03)); margin: 8px 0; }
.help-body .help-table-wrap { overflow-x: auto; margin: 10px 0; }
.help-body table.help-table { border-collapse: collapse; width: 100%; font-size: 13px; }
.help-body table.help-table th, .help-body table.help-table td { border: 1px solid var(--line, #e5e7eb); padding: 8px 10px; text-align: left; }
.help-body table.help-table th { background: var(--hover, rgba(0,0,0,.04)); font-weight: 700; }
.help-body .help-loading { color: var(--muted); padding: 8px 0; }

/* 个人信息小弹窗（浮层，不嵌主界面框架，WorkBuddy 风格） */
.profile-popup { position: fixed; z-index: 210; width: max-content; max-width: calc(100vw - 16px); display: none; }
.profile-popup.show { display: block; animation: ppPop .14s ease-out; }
@keyframes ppPop { from { opacity: 0; transform: translateY(6px) scale(.98); } to { opacity: 1; transform: none; } }
.pp-card {
  width: 320px; max-width: calc(100vw - 24px);
  background: var(--panel); border: 1px solid var(--line, #e5e7eb);
  border-radius: 14px; box-shadow: 0 18px 50px rgba(0,0,0,.28);
  padding: 16px; max-height: calc(100vh - 24px); overflow-y: auto;
}
.pp-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.pp-head h3 { margin: 0; font-size: 15px; font-weight: 700; color: var(--ink); }
.pp-close {
  width: 28px; height: 28px; border: none; background: transparent; color: var(--muted);
  border-radius: 8px; cursor: pointer; display: inline-flex; align-items: center; justify-content: center;
  font-size: 16px; transition: background .15s, color .15s;
}
.pp-close:hover { background: var(--brand-soft); color: var(--ink); }
.pp-body { display: flex; flex-direction: column; gap: 10px; }
.pp-body .field { margin: 0; }
.pp-avatar-row { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 2px 0 6px; }
.pp-foot { display: flex; justify-content: flex-end; gap: 10px; margin-top: 14px; }

/* 个人信息 Tab：编辑资料按钮 */
.profile-actions { display: flex; justify-content: center; margin-top: 14px; }
.profile-edit { display: flex; flex-direction: column; gap: 12px; text-align: left; margin-top: 4px; }
.profile-card .btn.sm { margin-top: 12px; }

/* ===== 设置面板（点击头像 → 设置，弹出大面板） ===== */
/* 显式 z-index 30：低于 modal-mask 默认 40，确保从设置面板打开的
   planUpgradeMask / planOrdersMask 等弹窗能覆盖在上面，不会被遮挡 */
.settings-panel-mask { align-items: center; justify-content: center; padding: 24px; z-index: 30; }
.settings-panel {
  display: flex; width: min(960px, 100%); height: min(86vh, 760px);
  background: var(--panel); color: var(--ink);
  border: 1px solid var(--line); border-radius: 18px; overflow: hidden;
  box-shadow: 0 30px 80px rgba(0,0,0,.35); animation: spPop .18s ease-out;
}
@keyframes spPop { from { opacity: 0; transform: translateY(10px) scale(.985); } to { opacity: 1; transform: none; } }
.sp-nav {
  flex: 0 0 236px; display: flex; flex-direction: column; gap: 4px;
  padding: 18px 12px; background: var(--hover, rgba(0,0,0,.03));
  border-right: 1px solid var(--line); overflow-y: auto;
}
.sp-head { display: flex; align-items: center; gap: 12px; padding: 4px 8px 14px; margin-bottom: 6px; border-bottom: 1px solid var(--line); }
.sp-avatar {
  width: 42px; height: 42px; border-radius: 50%; flex: 0 0 auto;
  background: var(--brand-soft, rgba(37,99,235,.12)); color: var(--brand, #2563eb);
  display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 16px;
  background-size: cover; background-position: center;
}
.sp-meta { min-width: 0; }
.sp-name { font-weight: 700; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sp-role { font-size: 12px; color: var(--muted); }
.sp-nav-item {
  display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: none;
  background: transparent; color: var(--ink); border-radius: 10px; cursor: pointer;
  font-size: 14px; text-align: left; transition: background .15s, color .15s;
}
.sp-nav-item .up-ic { width: 18px; height: 18px; display: inline-flex; flex: 0 0 auto; }
.sp-nav-item .up-ic svg { width: 18px; height: 18px; }
.sp-nav-item .up-txt { flex: 1 1 auto; }
.sp-nav-item:hover { background: var(--brand-soft, rgba(37,99,235,.1)); }
.sp-nav-item.active { background: var(--brand, #2563eb); color: #fff; }
.sp-nav-item.danger { color: #ef4444; margin-top: auto; }
.sp-nav-item.danger:hover { background: rgba(239,68,68,.12); color: #ef4444; }
.sp-divider { margin: 12px 8px 6px; padding-top: 10px; border-top: 1px solid var(--line); font-size: 11px; font-weight: 700; letter-spacing: .06em; color: var(--muted); text-transform: uppercase; }
.sp-content { position: relative; flex: 1 1 auto; overflow-y: auto; padding: 22px 26px 26px; }
.sp-close {
  position: absolute; top: 14px; right: 14px; z-index: 2; width: 30px; height: 30px;
  border: none; background: transparent; color: var(--muted); border-radius: 8px; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center; font-size: 18px; transition: background .15s, color .15s;
}
.sp-close:hover { background: var(--brand-soft, rgba(37,99,235,.1)); color: var(--ink); }
.sp-close svg { width: 18px; height: 18px; }
.sp-section { display: none; }
.sp-section.active { display: block; animation: spFade .15s ease-out; }
@keyframes spFade { from { opacity: 0; } to { opacity: 1; } }
.sp-section .page-head { margin-bottom: 14px; }
.sp-section .page-head .ph-title { display: flex; align-items: center; gap: 8px; }
.sp-section .page-head [data-icon] { width: 20px; height: 20px; color: var(--brand, #2563eb); }
.sp-section .page-head [data-icon] svg { width: 20px; height: 20px; }
.sp-section .help-body { max-height: none; }
.about-body { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 26px 10px 14px; }
.about-logo { height: 56px; width: auto; max-width: 240px; margin-bottom: 22px; object-fit: contain; filter: drop-shadow(0 6px 16px rgba(0,0,0,0.14)); transition: transform 0.3s cubic-bezier(0.16,1,0.3,1); }
.about-logo:hover { transform: translateY(-2px) scale(1.02); }
.about-app { font-size: 22px; font-weight: 800; letter-spacing: 0.5px; color: var(--ink); margin-bottom: 6px; }
.about-app-en { font-size: 13px; font-weight: 600; letter-spacing: 0.3px; color: var(--muted); margin-bottom: 4px; }
.about-meta { font-size: 13px; color: var(--muted); margin-bottom: 6px; }
.about-divider { width: 100%; max-width: 300px; height: 1px; background: linear-gradient(90deg, transparent, var(--line), transparent); margin: 22px 0; }
.about-contact-title { font-size: 15px; font-weight: 700; color: var(--brand, #2563eb); margin-bottom: 14px; }
.about-contact-row { font-size: 13px; color: var(--muted); margin-bottom: 8px; }
.about-contact-row a { color: var(--brand, #2563eb); text-decoration: none; }
.about-contact-row a:hover { text-decoration: underline; }
@media (max-width: 720px) {
  .settings-panel { flex-direction: column; height: 90vh; }
  .sp-nav { flex: 0 0 auto; flex-direction: row; overflow-x: auto; border-right: none; border-bottom: 1px solid var(--line); padding: 10px; }
  .sp-head { display: none; }
  .sp-nav-item { flex: 0 0 auto; white-space: nowrap; }
  .sp-nav-item.danger { margin-top: 0; margin-left: auto; }
  .sp-content { padding: 16px; }
}

/* 文件夹共享弹窗 */
.acl-section { margin-bottom: 14px; }
.acl-section:last-of-type { margin-bottom: 0; }
.acl-section .hint { margin: 4px 0 0 24px; font-size: 12px; color: var(--muted); line-height: 1.5; }
.acl-divider { height: 1px; background: var(--line); margin: 14px 0; }
.acl-section .footer { margin-top: 8px; }

/* ===================== 标准作业 SOP ===================== */
.sop-editor { --sop: var(--section-color, var(--brand, #0B5CAD)); display: flex; flex-direction: column; gap: 10px; flex: 1; min-height: 0; height: auto; }
.sop-editor > .explorer-head { flex: 0 0 auto; }
.sop-workspace { flex: 1; min-height: 0; display: flex; gap: 10px; }

/* 画布 + 连线 + 节点 */
.sop-canvas-wrap {
  position: relative; flex: 1; min-width: 0; overflow: hidden;
  background-color: var(--bg);
  background-image: radial-gradient(color-mix(in srgb, var(--ink) 9%, transparent) 1px, transparent 1px);
  background-size: 22px 22px;
  border: 1px solid var(--line); border-radius: var(--radius);
  cursor: grab;
}
.sop-canvas-wrap.panning { cursor: grabbing; }
.sop-canvas { position: relative; transform-origin: 0 0; will-change: transform; }
.sop-edges { position: absolute; top: 0; left: 0; overflow: visible; pointer-events: none; color: var(--sop); z-index: 1; }
.sop-nodes { position: absolute; top: 0; left: 0; z-index: 2; }
.sop-canvas-hint { position: absolute; inset: 0; display: grid; place-items: center; color: var(--muted); font-size: 14px; pointer-events: none; z-index: 0; }

.sop-edge { fill: none; stroke: var(--sop); stroke-width: 2.5; opacity: .5; pointer-events: none; transition: opacity .15s ease, stroke-width .15s ease; }
.sop-edge.selected { opacity: 1; stroke: var(--danger, #d9483b); stroke-width: 3.5; }
.sop-edge.draft { stroke-dasharray: 7 6; opacity: .85; pointer-events: none; }
/* 透明加粗命中区：让连线更容易点击/删除，不干扰视觉 */
.sop-edge-hit { fill: none; stroke: transparent; stroke-width: 18; pointer-events: stroke; cursor: pointer; }
.sop-edge-hit:hover { stroke: color-mix(in srgb, var(--sop) 35%, transparent); }
.sop-edge-hit.selected { stroke: color-mix(in srgb, var(--danger, #d9483b) 35%, transparent); }

.sop-node {
  position: absolute; background: var(--panel); border: 1px solid var(--line); border-radius: 14px;
  box-shadow: var(--shadow); cursor: grab; user-select: none;
  transition: box-shadow .2s ease, border-color .2s ease, transform .12s ease;
}
.sop-node.selected { border-color: var(--sop); box-shadow: 0 0 0 3px color-mix(in srgb, var(--sop) 18%, transparent), var(--shadow); }
.sop-node.dragging { cursor: grabbing; box-shadow: 0 14px 30px -10px rgba(0,0,0,.4); transform: scale(1.02); z-index: 50; }
.sop-node-head { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-bottom: 1px solid var(--line); cursor: grab; }
.sop-node-idx { flex: 0 0 auto; width: 22px; height: 22px; border-radius: 50%; background: color-mix(in srgb, var(--sop) 15%, var(--panel)); color: var(--sop); font-size: 12px; font-weight: 800; display: grid; place-items: center; }
.sop-node-title { flex: 1; min-width: 0; font-size: 14px; font-weight: 700; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sop-node-kind { flex: 0 0 auto; font-size: 13px; font-weight: 700; color: var(--sop); background: color-mix(in srgb, var(--sop) 12%, var(--panel)); padding: 2px 6px; border-radius: 999px; line-height: 1; }
.sop-node-body { padding: 10px 12px 12px; }
.sop-node-text { margin: 0; font-size: 13px; line-height: 1.6; color: var(--muted); white-space: pre-wrap; }
.sop-node-text.muted { opacity: .7; }
.sop-node-url { font-size: 12px; color: var(--sop); word-break: break-all; font-family: ui-monospace, Menlo, Consolas, monospace; background: color-mix(in srgb, var(--sop) 8%, var(--panel)); padding: 4px 8px; border-radius: 8px; }
.sop-node-img { border-radius: 10px; overflow: hidden; margin-bottom: 8px; background: var(--hover, #eef2f7); }
.sop-node-img + .sop-node-text { margin-top: 4px; }
.sop-node-img img { width: 100%; max-height: 140px; object-fit: cover; display: block; }
/* 画布图文卡：仅展示「已附图片」徽标，不再渲染大图预览 */
.sop-node-img-badge { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; line-height: 1; color: var(--muted, #8a94a6); background: var(--hover, #eef2f7); border: 1px solid var(--border, #ececec); border-radius: 8px; padding: 4px 8px; margin-bottom: 8px; }
/* 详情页 / 公开页：媒体（图片/视频）约束在内容框架内，避免溢出 */
.res-media { max-width: 100%; margin: 10px 0; }
.res-media img, .res-media video { display: block; max-width: 100%; max-height: 360px; width: auto; height: auto; object-fit: contain; border-radius: 12px; background: var(--hover, #eef2f7); }
/* SOP 属性面板：自定义端口数量选择器 */
.sop-port-count { display: flex; flex-direction: column; gap: 4px; }
.sop-pc-label { font-size: 12px; color: var(--muted, #8a94a6); }
.sop-port-hint { font-size: 12px; color: var(--muted, #8a94a6); margin: 8px 0 0; line-height: 1.5; }
.sop-node-ops { margin: 6px 0 0; padding-left: 18px; font-size: 13px; color: var(--ink); line-height: 1.5; }
.sop-node-ops li { margin: 2px 0; }
.sop-node-confirm { margin-top: 8px; font-size: 11.5px; font-weight: 700; color: var(--sop); background: color-mix(in srgb, var(--sop) 12%, var(--panel)); display: inline-block; padding: 2px 8px; border-radius: 999px; }
.sop-res-chip { display: flex; align-items: center; gap: 8px; background: var(--hover, #eef2f7); border: 1px solid var(--line); border-radius: 10px; padding: 6px 8px; color: var(--ink); }
/* 资源预览框（详情面板内）—— 严格约束在框内不超界 */
.sop-res-preview {
  width: 100%;
  max-width: 248px;
  aspect-ratio: 4 / 3;
  margin: 0 auto 8px;
  border-radius: 10px;
  overflow: hidden;
  background: var(--hover, #eef2f7);
  display: flex; align-items: center; justify-content: center;
  border: 1px solid var(--line);
}
.sop-res-preview img { max-width: 100%; max-height: 100%; width: 100%; height: 100%; object-fit: contain; display: block; }
.sop-res-ico-big { font-size: 48px; line-height: 1; color: var(--muted); text-align: center; padding: 28px 0; }
.sop-res-ico { font-size: 20px; }
.sop-res-name { font-size: 12.5px; font-weight: 600; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ink); }

.sop-port { position: absolute; width: 16px; height: 16px; border-radius: 50%; background: var(--sop); border: 2px solid var(--panel); box-shadow: 0 2px 6px rgba(0,0,0,.2); cursor: crosshair; z-index: 5; transition: transform .15s ease, box-shadow .15s ease; }
/* 竖排（默认）：入口在上、出口在下 */
.sop-port.in { top: -9px; left: 50%; margin-left: -8px; }
.sop-port.out { bottom: -9px; left: 50%; margin-left: -8px; }
.sop-port:hover { transform: scale(1.2); box-shadow: 0 0 0 4px color-mix(in srgb, var(--sop) 25%, transparent); }
/* 横排：入口在左、出口在右 */
.sop-node.dir-h .sop-port.in {
  top: 50%; bottom: auto; left: -9px; right: auto; margin-left: 0; margin-top: -8px;
}
.sop-node.dir-h .sop-port.out {
  top: 50%; bottom: auto; left: auto; right: -9px; margin-left: 0; margin-top: -8px;
}
/* 输出端口分支标签：隐藏（现在用卡片内小药丸替代，不再在端口圆旁显示） */
.sop-port.out .sop-port-label { display: none; }
.sop-port.in .sop-port-label { display: none; }
.sop-node { display: flex; flex-direction: column; }
.sop-node-body { position: relative; flex: 1 1 auto; }
.sop-node-port-label {
  position: absolute;
  font-size: 10px; font-weight: 700;
  padding: 2px 7px; border-radius: 999px;
  background: var(--hover);
  color: var(--muted);
  white-space: nowrap;
  z-index: 4;
  pointer-events: none;
  border: 1px solid var(--line);
}
/* 横排：入口标签在左边缘内侧、出口标签在右边缘内侧（inline top:% 与端口圆点共用同一坐标系） */
.sop-node.dir-h .sop-node-port-label.in { left: 14px; transform: translateY(-50%); }
.sop-node.dir-h .sop-node-port-label.out { right: 14px; transform: translateY(-50%); }
/* 竖排：入口标签在上边缘内侧、出口标签在下边缘内侧（inline left:% 与端口圆点共用同一坐标系） */
.sop-node.dir-v .sop-node-port-label.in { top: 14px; transform: translateX(-50%); }
.sop-node.dir-v .sop-node-port-label.out { bottom: 14px; transform: translateX(-50%); }
/* 逻辑节点 */
.sop-node.card-logic { border-color: color-mix(in srgb, var(--sop) 45%, var(--line)); }
.sop-node-logic { margin: 2px 0 6px; font-size: 13px; font-weight: 800; color: var(--sop); }
.sop-node-branches { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
/* 选择器节点 */
.sop-node.card-selector { border-color: color-mix(in srgb, #d97706 50%, var(--line)); }
.sop-node.card-selector .sop-node-kind { color: #d97706; background: color-mix(in srgb, #d97706 12%, var(--panel)); }

.sop-node.card-selector { min-height: 78px; }

.sop-branch { font-size: 11px; font-weight: 700; color: #fff; background: var(--sop); padding: 2px 9px; border-radius: 999px; }
.sop-node-cond { font-size: 12px; font-weight: 700; color: var(--sop); margin: 2px 0 4px; line-height: 1.4; }
.sop-node-ai-q { font-size: 12px; font-weight: 700; color: var(--sop); margin: 2px 0 4px; line-height: 1.4; }
.sop-node-ai-a { font-size: 11.5px; color: var(--text); background: color-mix(in srgb, var(--sop) 9%, var(--panel)); border-radius: 8px; padding: 6px 8px; line-height: 1.45; max-height: 80px; overflow: hidden; }
.sop-node-ai-empty { font-size: 11px; color: var(--muted); font-style: italic; margin-top: 2px; }
.sop-ai-status { font-size: 11.5px; color: var(--primary); }
/* 开始 / 结束节点 */
.sop-node.role-start { border-color: color-mix(in srgb, #16a34a 55%, var(--line)); box-shadow: 0 0 0 3px color-mix(in srgb, #16a34a 14%, transparent); }
.sop-node.role-start .sop-node-kind { color: #16a34a; background: color-mix(in srgb, #16a34a 14%, var(--panel)); }
.sop-node.role-end { border-color: color-mix(in srgb, var(--danger, #d9483b) 55%, var(--line)); box-shadow: 0 0 0 3px color-mix(in srgb, var(--danger, #d9483b) 14%, transparent); }
.sop-node.role-end .sop-node-kind { color: var(--danger, #d9483b); background: color-mix(in srgb, var(--danger, #d9483b) 14%, var(--panel)); }
/* 开始节点只出不进、结束节点只进不出（JS 已不渲染，这里做防御性隐藏；
   注意：不能隐藏 role-start 的 .out 与 role-end 的 .in —— 那是它们唯一的端口） */
.sop-node.role-start .sop-port.in, .sop-node.role-end .sop-port.out { display: none; }
/* 开始/结束节点端口配色跟随节点语义色 */
.sop-node.role-start .sop-port { background: #16a34a; }
.sop-node.role-start .sop-port:hover { box-shadow: 0 0 0 4px color-mix(in srgb, #16a34a 25%, transparent); }
.sop-node.role-end .sop-port { background: var(--danger, #d9483b); }
.sop-node.role-end .sop-port:hover { box-shadow: 0 0 0 4px color-mix(in srgb, var(--danger, #d9483b) 25%, transparent); }

/* 逻辑类型选择器（属性面板） */
.sop-logic-picker { display: flex; flex-wrap: wrap; gap: 8px; }
.sop-logic-kind {
  font-size: 12.5px; font-weight: 700; padding: 7px 11px; border-radius: 9px;
  border: 1px solid var(--line); background: var(--panel); color: var(--text);
  cursor: pointer; transition: all .15s ease;
}
.sop-logic-kind:hover { border-color: var(--sop); }
.sop-logic-kind.active { background: var(--sop); color: #fff; border-color: var(--sop); }

/* 属性面板（改为悬浮于画布右上、可折叠） */
.sop-inspector {
  position: absolute; top: 14px; right: 14px; bottom: 14px; width: 290px;
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius);
  overflow: auto; padding: 16px; z-index: 12;
  box-shadow: 0 18px 44px -20px rgba(0,0,0,.4);
  transition: transform .28s cubic-bezier(.16,1,.3,1), opacity .2s ease;
}
.sop-canvas-wrap.inspector-collapsed .sop-inspector { transform: translateX(calc(100% + 28px)); opacity: 0; pointer-events: none; }

/* 属性面板折叠开关 */
.sop-inspector-toggle {
  position: absolute; top: 14px; right: 318px; z-index: 15;
  width: 30px; height: 48px; display: grid; place-items: center;
  border: 1px solid var(--line); background: var(--panel); border-radius: 12px;
  cursor: pointer; color: var(--ink); font-size: 16px; box-shadow: 0 8px 20px -10px rgba(0,0,0,.3);
  transition: right .28s cubic-bezier(.16,1,.3,1), background .15s ease, color .15s ease;
}
.sop-inspector-toggle:hover { color: var(--sop); border-color: var(--sop); }
.sop-canvas-wrap.inspector-collapsed .sop-inspector-toggle { right: 14px; }
.sop-it-ico { display: inline-block; transition: transform .28s cubic-bezier(.16,1,.3,1); }
.sop-canvas-wrap.inspector-collapsed .sop-it-ico { transform: rotate(180deg); }

/* 左上：流程卡片模板库 */
.sop-fab-btn {
  position: absolute; top: 14px; left: 14px; z-index: 15;
  display: inline-flex; align-items: center; gap: 6px; height: 38px; padding: 0 14px;
  border: 1px solid var(--line); background: var(--panel); border-radius: 12px;
  cursor: pointer; font-size: 13px; font-weight: 700; color: var(--ink);
  box-shadow: 0 8px 20px -10px rgba(0,0,0,.3); transition: all .15s ease;
}
.sop-fab-btn:hover { color: var(--sop); border-color: var(--sop); }
.sop-fab-ico { font-size: 15px; line-height: 1; }
.sop-template-panel {
  position: absolute; top: 60px; left: 14px; z-index: 16; width: 248px;
  max-height: calc(100% - 84px); overflow: auto;
  background: var(--panel); border: 1px solid var(--line); border-radius: 14px;
  box-shadow: 0 18px 44px -16px rgba(0,0,0,.45); padding: 10px;
}
.sop-tpl-head { display: flex; align-items: center; justify-content: space-between; padding: 2px 2px 8px; font-size: 13.5px; color: var(--ink); }
.sop-tpl-close { border: none; background: transparent; font-size: 20px; line-height: 1; cursor: pointer; color: var(--muted); padding: 0 4px; }
.sop-tpl-close:hover { color: var(--sop); }
.sop-template-list { display: flex; flex-direction: column; gap: 6px; }
.sop-tpl-item {
  display: flex; gap: 10px; align-items: center; text-align: left;
  border: 1px solid var(--line); background: var(--panel); border-radius: 12px;
  padding: 8px 9px; cursor: pointer; font: inherit; color: var(--ink); transition: all .15s ease;
}
.sop-tpl-item:hover { border-color: var(--sop); transform: translateX(2px); box-shadow: var(--shadow); }
.sop-tpl-ico { flex: 0 0 auto; width: 32px; height: 32px; border-radius: 10px; display: grid; place-items: center; font-size: 17px; background: color-mix(in srgb, var(--sop) 12%, var(--panel)); }
.sop-tpl-meta { min-width: 0; }
.sop-tpl-title { font-size: 13px; font-weight: 700; }
.sop-tpl-desc { font-size: 11px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* 模板库 / 我的组件 分组切换 */
.sop-tpl-tabs { display: flex; gap: 3px; margin: 0 0 10px; padding: 3px; border-radius: 10px; background: color-mix(in srgb, var(--ink) 5%, var(--panel)); }
.sop-tpl-tab {
  flex: 1; border: none; background: transparent; color: var(--muted); font: inherit; font-size: 11.5px; font-weight: 600;
  padding: 5px 2px; border-radius: 8px; cursor: pointer; transition: all .15s ease; white-space: nowrap; text-align: center;
}
.sop-tpl-tab:hover { color: var(--sop); }
.sop-tpl-tab.active { background: var(--panel); color: var(--sop); box-shadow: 0 1px 3px rgba(0,0,0,.12); }
.sop-comp-item { position: relative; padding-right: 46px; }
.sop-comp-ops { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); display: flex; gap: 2px; opacity: 0; transition: opacity .15s ease; }
.sop-comp-item:hover .sop-comp-ops { opacity: 1; }
.sop-comp-ops button {
  border: none; background: transparent; color: var(--muted); cursor: pointer;
  width: 20px; height: 20px; border-radius: 6px; font-size: 13px; line-height: 1; display: grid; place-items: center;
}
.sop-comp-ops button:hover { background: color-mix(in srgb, var(--sop) 14%, transparent); color: var(--sop); }
.sop-comp-empty { font-size: 12px; color: var(--muted); line-height: 1.7; padding: 14px 6px; text-align: center; }

/* 右下：缩放工具条 */
.sop-zoom-bar {
  position: absolute; right: 14px; bottom: 14px; z-index: 15;
  display: flex; align-items: center; gap: 2px; padding: 4px;
  background: var(--panel); border: 1px solid var(--line); border-radius: 12px;
  box-shadow: 0 8px 20px -10px rgba(0,0,0,.3);
}
.sop-zoom-bar button {
  width: 30px; height: 30px; border: none; background: transparent; border-radius: 8px;
  cursor: pointer; font-size: 16px; color: var(--ink); display: grid; place-items: center; transition: background .15s ease, color .15s ease;
}
.sop-zoom-bar button:hover { background: var(--hover, #eef2f7); color: var(--sop); }
/* 排布方向按钮：高亮当前方向（决定端口圆点在上下还是左右） */
#sopAutoLayoutBtn.active, #sopAutoLayoutHBtn.active {
  background: color-mix(in srgb, var(--section-color, var(--brand)) 14%, var(--panel));
  border-color: color-mix(in srgb, var(--section-color, var(--brand)) 45%, var(--line));
  color: var(--section-color, var(--brand));
  font-weight: 700;
}
.sop-zoom-val { min-width: 48px; text-align: center; font-size: 12.5px; font-weight: 700; color: var(--muted); }
.sop-inspector-empty { color: var(--muted); font-size: 13.5px; text-align: center; padding: 30px 10px; }
.sop-tips { text-align: left; margin: 14px auto 0; padding-left: 18px; font-size: 12.5px; line-height: 1.9; max-width: 240px; color: var(--muted); }
.sop-inspector-form { display: flex; flex-direction: column; gap: 14px; }
.sop-type-picker { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.sop-type { display: flex; align-items: center; justify-content: center; gap: 5px; padding: 10px 8px; border: 1px solid var(--line); border-radius: 10px; background: var(--panel); color: var(--ink); font-size: 13px; font-weight: 600; cursor: pointer; transition: all .15s ease; }
.sop-type-ico { font-size: 14px; line-height: 1; }
.sop-type:hover { border-color: var(--sop); color: var(--sop); }
.sop-type.active { background: var(--sop); border-color: var(--sop); color: #fff; }
.sop-res-slot { min-height: 64px; border: 1px dashed var(--line); border-radius: 10px; padding: 10px; display: flex; align-items: center; }
.sop-res-missing { color: var(--muted); font-size: 12.5px; }
.sop-check { display: flex; align-items: center; gap: 8px; font-size: 13.5px; color: var(--ink); cursor: pointer; }
.sop-check input { width: 16px; height: 16px; accent-color: var(--sop); }
.sop-inspector-actions { margin-top: 4px; display: flex; gap: 8px; }
.sop-inspector-actions .btn { flex: 1; }
.sop-title-input { min-width: 200px; flex: 0 1 300px; font-weight: 600; }
.sop-save-state { font-size: 12.5px; font-weight: 600; color: var(--muted); }
.sop-save-state.dirty { color: var(--sop); }

/* 资源选取弹窗 */
.sop-res-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; max-height: 46vh; overflow: auto; padding: 2px; }
.sop-res-item { display: flex; flex-direction: column; gap: 6px; border: 1px solid var(--line); border-radius: 12px; background: var(--panel); padding: 8px; text-align: left; cursor: pointer; font: inherit; color: var(--ink); transition: all .15s ease; }
.sop-res-item:hover { border-color: var(--sop); transform: translateY(-2px); box-shadow: var(--shadow); }
.sop-res-thumb { aspect-ratio: 16 / 10; border-radius: 8px; overflow: hidden; background: var(--hover, #eef2f7); display: grid; place-items: center; }
.sop-res-thumb img { width: 100%; height: 100%; object-fit: cover; }
.sop-res-thumb .sop-res-ico { font-size: 30px; opacity: .6; }
.sop-res-title { font-size: 13px; font-weight: 600; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.sop-res-sub { font-size: 11.5px; color: var(--muted); }

/* 资源单选（卡片关联资源） */
.sop-res-item { position: relative; }
.sop-res-item.sop-res-sel { border-color: var(--sop); box-shadow: 0 0 0 2px color-mix(in srgb, var(--sop) 30%, transparent); }
.sop-res-item.sop-res-sel::after { content: '✓'; position: absolute; top: 6px; right: 6px; width: 20px; height: 20px; border-radius: 50%; background: var(--sop); color: #fff; display: grid; place-items: center; font-size: 12px; font-weight: 800; }

/* 图文说明：图片上传与排版 */
.sop-img-slot { min-height: 64px; border: 1px dashed var(--line); border-radius: 10px; padding: 10px; display: flex; align-items: center; justify-content: center; }
.sop-img-slot:empty::before { content: '暂无图片'; color: var(--muted); font-size: 12.5px; }
.sop-img-preview { display: block; max-width: 100%; max-height: 160px; border-radius: 8px; object-fit: contain; }
/* 预览卡片：缩略图 + 文件名 + 查看原图 / 移除 */
.sop-img-fig { margin: 0; width: 100%; display: flex; flex-direction: column; align-items: center; gap: 8px; }
.sop-img-err { display: none; width: 100%; padding: 14px 8px; text-align: center; font-size: 12.5px; color: var(--danger, #e5484d); }
.sop-img-fig.failed .sop-img-preview { display: none; }
.sop-img-fig.failed .sop-img-err { display: block; }
.sop-img-cap { width: 100%; display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--muted); }
.sop-img-name { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sop-img-link { flex: none; color: var(--sop, var(--primary)); text-decoration: none; }
.sop-img-link:hover { text-decoration: underline; }
.sop-img-del { flex: none; border: 1px solid var(--line); background: transparent; color: var(--muted); border-radius: 6px; padding: 2px 8px; font-size: 12px; cursor: pointer; }
.sop-img-del:hover { color: var(--danger, #e5484d); border-color: var(--danger, #e5484d); }
/* 画布卡片上的图片缩略图（限高，避免撑爆节点） */
.sop-node-img { margin-bottom: 8px; border-radius: 8px; overflow: hidden; border: 1px solid var(--border, #ececec); background: var(--hover, #eef2f7); }
.sop-node-img img { display: block; width: 100%; max-height: 96px; object-fit: cover; }
.sop-node-img.failed { border-style: dashed; }
.sop-node-img.failed img { display: none; }
.sop-node-img.failed::before { content: '🖼️ 图片加载失败'; display: block; padding: 10px; font-size: 12px; color: var(--muted, #8a94a6); text-align: center; }

/* 操作清单：可添加删除的选项列表 */
.sop-ops-list { display: flex; flex-direction: column; gap: 8px; }
.sop-ops-empty { color: var(--muted); font-size: 12.5px; padding: 8px 0; }
.sop-ops-item { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 11px; border: 1px solid var(--line); border-radius: 10px; background: var(--panel); font-size: 13.5px; }
.sop-ops-item span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sop-ops-item button { border: none; background: transparent; color: var(--muted); cursor: pointer; font-size: 16px; line-height: 1; padding: 2px 4px; border-radius: 6px; }
.sop-ops-item button:hover { color: var(--danger, #ef4444); background: color-mix(in srgb, var(--danger, #ef4444) 8%, transparent); }

/* AI 生成：参考来源选择 */
.sop-ai-ref-modes { display: flex; flex-wrap: wrap; gap: 8px; }
.sop-ai-ref-mode { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; padding: 6px 12px; border: 1px solid var(--line); border-radius: 999px; font-size: 13px; color: var(--ink); background: var(--panel); transition: border-color .15s ease, background .15s ease, color .15s ease; }
.sop-ai-ref-mode input { accent-color: var(--sop); margin: 0; }
.sop-ai-ref-mode:has(input:checked) { border-color: var(--sop); color: var(--sop); background: color-mix(in srgb, var(--sop) 10%, var(--panel)); font-weight: 700; }
.sop-ai-ref-items { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; min-height: 4px; }
.sop-ai-ref-chip { display: inline-flex; align-items: center; gap: 6px; max-width: 100%; padding: 5px 8px 5px 10px; border: 1px solid var(--line); border-radius: 999px; background: color-mix(in srgb, var(--sop) 8%, var(--panel)); color: var(--ink); font-size: 12.5px; }
.sop-ai-ref-chip .sop-ai-ref-chip-type { color: var(--sop); font-weight: 700; }
.sop-ai-ref-chip .sop-ai-ref-chip-x { cursor: pointer; color: var(--muted); font-weight: 800; padding: 0 2px; line-height: 1; }
.sop-ai-ref-chip .sop-ai-ref-chip-x:hover { color: var(--danger, #d9483b); }

/* 列表卡片（SOP 与「最佳实践」「账号」统一复用资源管理的 .card.file-card.mgmt-card 结构与比例） */
.file-card.sop-card { --sop: var(--section-color, var(--brand, #0B5CAD)); }
/* SOP 缩略图：完全沿用资源卡的 120px 缩略图 + 70px 圆角图标 tile，仅图标 tile 跟随板块配色 */
.file-card.sop-card .thumb .icon {
  background: color-mix(in srgb, var(--sop) 13%, var(--panel));
  color: var(--sop);
}
.file-card.sop-card .thumb svg.ico { opacity: .92; }
.sop-badge { display: inline-block; font-size: 11px; font-weight: 700; padding: 1px 7px; border-radius: 999px; color: var(--muted); background: var(--hover, #eef2f7); }
.sop-badge.on { color: #fff; background: var(--ok); }
.sop-badge.warn { color: #fff; background: #d97706; }
.sop-badge.lock { color: #fff; background: #d97706; }
.sop-badge.type { color: var(--section-color, var(--brand)); background: color-mix(in srgb, var(--section-color, var(--brand)) 12%, transparent); }

.sop-card { cursor: pointer; transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease; }
.sop-card:hover { transform: translateY(-2px); box-shadow: var(--shadow); border-color: color-mix(in srgb, var(--section-color, var(--brand)) 35%, var(--line)); }
#sopList tbody tr[data-id] { cursor: pointer; }
#sopList tbody tr[data-id]:hover td { background: color-mix(in srgb, var(--section-color, var(--brand)) 6%, transparent); }
#sopList .sop-badge { vertical-align: middle; }
.sop-title-input { min-width: 180px; }

@media (max-width: 900px) {
  .sop-workspace { flex-direction: column; overflow: hidden; }
  .sop-canvas-wrap { min-height: 460px; }
  .sop-editor { height: auto; min-height: 0; }
  #tabSop .content { overflow-y: auto; padding: 8px; }
  .sop-inspector { top: auto; bottom: 14px; left: 14px; right: 14px; width: auto; max-height: 52%; }
  .sop-inspector-toggle { display: none; }
  .sop-template-panel { width: auto; right: 14px; top: 58px; max-height: 46%; }
  .sop-fab-btn { height: 34px; }
}

/* ===== 分板块内容文件夹侧栏（SF = Section Folders） ===== */
/* 由 admin.js 的 SF 模块运行时注入：给 .explorer-body 加 .sf-on 后变为
   [ .sf-sidebar | .sf-main（包裹原 grid / list / empty） ] 两栏，HTML 与既有刷新逻辑零改动 */
.explorer-body.sf-on { display: flex; align-items: stretch; gap: 14px; }
.explorer-body.sf-on > .sf-main { flex: 1 1 auto; min-width: 0; }
.explorer-body.sf-on.sf-collapsed > .sf-sidebar { flex-basis: 42px; width: 42px; padding: 8px 5px; overflow: hidden; }
.explorer-body.sf-on.sf-collapsed > .sf-sidebar .sf-head-title,
.explorer-body.sf-on.sf-collapsed > .sf-sidebar .sf-add,
.explorer-body.sf-on.sf-collapsed > .sf-sidebar .sf-tree,
.explorer-body.sf-on.sf-collapsed > .sf-sidebar .sf-tip { display: none; }

.sf-sidebar {
  flex: 0 0 224px; width: 224px; box-sizing: border-box; align-self: flex-start;
  position: sticky; top: 0; max-height: calc(100vh - 210px); overflow-y: auto;
  background: var(--panel); border: 1px solid var(--line); border-radius: 12px;
  padding: 10px 8px; transition: flex-basis .16s ease, width .16s ease;
}
.sf-sidebar::-webkit-scrollbar { width: 6px; }
.sf-sidebar::-webkit-scrollbar-thumb { background: color-mix(in srgb, var(--ink) 14%, transparent); border-radius: 999px; }

.sf-head {
  display: flex; align-items: center; gap: 4px;
  padding: 0 4px 8px; margin-bottom: 4px; border-bottom: 1px solid var(--line);
}
.sf-head-title {
  flex: 1 1 auto; min-width: 0; font-size: 11px; font-weight: 700; letter-spacing: .4px;
  color: var(--muted); text-transform: uppercase; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.sf-iconbtn {
  flex: 0 0 auto; width: 24px; height: 24px; display: grid; place-items: center;
  border: none; background: transparent; color: var(--muted);
  cursor: pointer; border-radius: 6px; transition: background .12s ease, color .12s ease;
}
.sf-iconbtn:hover { background: var(--hover); color: var(--brand); }
.sf-iconbtn svg { width: 15px; height: 15px; }

.sf-tree { display: flex; flex-direction: column; gap: 2px; }
.sf-tree-node { display: flex; flex-direction: column; }
.sf-tree-row {
  display: flex; align-items: center; gap: 5px; padding: 5px 7px; border-radius: 8px;
  cursor: pointer; color: var(--ink); font-size: 13px; user-select: none;
  transition: background .12s ease, color .12s ease;
}
.sf-tree-row:hover { background: var(--hover); }
.sf-tree-row.active {
  background: color-mix(in srgb, var(--section-color, var(--brand)) 13%, transparent);
  color: var(--section-color, var(--brand)); font-weight: 600;
}
.sf-tree-row.drop-target {
  outline: 2px dashed var(--section-color, var(--brand)); outline-offset: -2px;
  background: color-mix(in srgb, var(--section-color, var(--brand)) 10%, transparent);
}
.sf-tree-tw {
  flex: 0 0 auto; width: 16px; height: 16px; display: grid; place-items: center;
  border: none; background: transparent; color: var(--muted);
  cursor: pointer; font-size: 9px; border-radius: 4px; line-height: 1;
}
.sf-tree-tw:hover { background: color-mix(in srgb, var(--ink) 10%, transparent); }
.sf-tree-tw.leaf { visibility: hidden; cursor: default; }
.sf-tree-ico { flex: 0 0 auto; display: grid; place-items: center; color: var(--muted); }
.sf-tree-ico svg { width: 14px; height: 14px; }
.sf-tree-row.active .sf-tree-ico { color: inherit; }
.sf-tree-name { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sf-tree-count {
  flex: 0 0 auto; font-size: 10.5px; color: var(--muted); min-width: 18px; text-align: center;
  background: color-mix(in srgb, var(--ink) 6%, transparent); padding: 1px 6px; border-radius: 999px;
}
.sf-tree-row.active .sf-tree-count {
  background: color-mix(in srgb, var(--section-color, var(--brand)) 18%, transparent); color: inherit;
}
.sf-tree-op {
  flex: 0 0 auto; width: 20px; height: 20px; display: grid; place-items: center;
  border: none; background: transparent; color: var(--muted);
  cursor: pointer; border-radius: 6px; opacity: 0; transition: opacity .12s ease, background .12s ease;
}
.sf-tree-op svg { width: 13px; height: 13px; }
.sf-tree-row:hover .sf-tree-op { opacity: 1; }
/* hover 时让位给三个操作按钮，避免 224px 宽度里标题被挤没 */
.sf-tree-row:hover .sf-tree-count { display: none; }
.sf-tree-op:hover { background: color-mix(in srgb, var(--ink) 12%, transparent); color: var(--ink); }
.sf-tree-op.danger:hover { background: color-mix(in srgb, #ef4444 16%, transparent); color: #ef4444; }
.sf-tree-children { display: flex; flex-direction: column; gap: 2px; margin-left: 14px; }
.sf-tree-children.hidden { display: none; }
.sf-tree-sep { height: 1px; background: var(--line); margin: 6px 4px; }
.sf-tip { font-size: 11.5px; color: var(--muted); line-height: 1.6; padding: 8px 6px 2px; }

/* 拖拽卡片入文件夹 */
.sf-dragging { opacity: .42; }
.sf-hidden { display: none !important; }

/* 新建 / 重命名内联输入 */
.sf-input {
  width: 100%; box-sizing: border-box; padding: 4px 7px; font-size: 13px;
  border: 1px solid var(--brand); border-radius: 7px;
  background: var(--bg, var(--panel)); color: var(--ink); outline: none;
}

@media (max-width: 900px) {
  .explorer-body.sf-on { flex-direction: column; gap: 10px; }
  .sf-sidebar {
    flex: 0 0 auto; width: 100%; position: static; max-height: 190px;
  }
  .explorer-body.sf-on.sf-collapsed > .sf-sidebar { flex-basis: auto; width: 100%; padding: 8px; }
  .explorer-body.sf-on.sf-collapsed > .sf-sidebar .sf-head-title { display: block; }
}

/* ===== 分板块内容文件夹视图（SFV = Section Folders Viewer） ===== */
/* 取代左侧树状侧栏：每个板块内呈现「资源管理」式文件夹视图
   [ .sfv-nav（工具栏行1 + 面包屑/批量栏行2） | .sfv-grid（文件夹+实体+资源卡片混排） ]
   注：.sfv-nav 定义见文件尾部的「SFV 双行」块（column flex），此处不再重复定义 */
.sfv-crumbs { display: flex; align-items: center; flex-wrap: wrap; gap: 2px; min-width: 0; }
.sfv-crumb {
  border: none; background: transparent; color: var(--muted); cursor: pointer;
  font-size: 13px; padding: 4px 8px; border-radius: 7px; transition: background .12s ease, color .12s ease;
}
.sfv-crumb:hover { background: var(--hover); color: var(--ink); }
.sfv-crumb.active { background: color-mix(in srgb, var(--section-color, var(--brand)) 14%, transparent); color: var(--section-color, var(--brand)); font-weight: 600; }
.sfv-crumb-sep { color: var(--muted); opacity: .6; margin: 0 1px; user-select: none; }
.sfv-bar { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.sfv-bar .btn { white-space: nowrap; }
.sfv-toggle { display: inline-flex; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
.sfv-tg {
  width: 30px; height: 30px; display: grid; place-items: center; border: none; background: transparent;
  color: var(--muted); cursor: pointer; transition: background .12s ease, color .12s ease;
}
.sfv-tg:hover { background: var(--hover); }
.sfv-tg.active { background: color-mix(in srgb, var(--section-color, var(--brand)) 16%, transparent); color: var(--section-color, var(--brand)); }

.sfv-section-title {
  font-size: 11px; font-weight: 700; letter-spacing: .4px; text-transform: uppercase;
  color: var(--muted); margin: 4px 2px 8px;
}
.sfv-empty { font-size: 12.5px; color: var(--muted); padding: 6px 2px 14px; }
.sfv-grid { display: grid; gap: 12px; }
.sfv-folder-grid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); margin-bottom: 16px; }
.sfv-res-grid { grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)); margin-bottom: 8px; }

.sfv-folder {
  position: relative; display: flex; flex-direction: column; align-items: center; gap: 6px;
  padding: 16px 10px 12px; border: 1px solid var(--line); border-radius: 13px;
  background: var(--panel); cursor: pointer; transition: border-color .14s ease, box-shadow .14s ease, transform .14s ease, background .14s ease;
}
.sfv-folder:hover { border-color: color-mix(in srgb, var(--section-color, var(--brand)) 45%, var(--line)); box-shadow: 0 6px 18px color-mix(in srgb, var(--ink) 8%, transparent); transform: translateY(-2px); }
.sfv-folder.drop-target { outline: 2px dashed var(--section-color, var(--brand)); outline-offset: -3px; background: color-mix(in srgb, var(--section-color, var(--brand)) 10%, transparent); }
.sfv-folder-ico { color: var(--section-color, var(--brand)); display: grid; place-items: center; }
.sfv-folder-ico svg { width: 40px; height: 40px; }
.sfv-folder-name { font-size: 13px; color: var(--ink); text-align: center; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sfv-folder-count { font-size: 10.5px; color: var(--muted); background: color-mix(in srgb, var(--ink) 6%, transparent); padding: 1px 8px; border-radius: 999px; }
.sfv-folder-ops { position: absolute; top: 6px; right: 6px; display: flex; gap: 2px; opacity: 0; transition: opacity .12s ease; }
.sfv-folder:hover .sfv-folder-ops { opacity: 1; }
.sfv-fop {
  width: 22px; height: 22px; display: grid; place-items: center; border: none; background: color-mix(in srgb, var(--ink) 6%, transparent);
  color: var(--muted); cursor: pointer; border-radius: 6px;
}
.sfv-fop svg { width: 13px; height: 13px; }
.sfv-fop:hover { background: color-mix(in srgb, var(--ink) 14%, transparent); color: var(--ink); }
.sfv-fop.danger:hover { background: color-mix(in srgb, #ef4444 16%, transparent); color: #ef4444; }

.sfv-folder.editing, .sfv-folder.editing:hover { align-items: stretch; cursor: default; transform: none; box-shadow: none; }
.sfv-finput {
  width: 100%; box-sizing: border-box; padding: 6px 8px; font-size: 13px; text-align: center;
  border: 1px solid var(--section-color, var(--brand)); border-radius: 8px;
  background: var(--bg, var(--panel)); color: var(--ink); outline: none;
}

.sfv-res {
  position: relative; display: flex; flex-direction: column; gap: 4px;
  padding: 10px; border: 1px solid var(--line); border-radius: 12px; background: var(--panel);
  cursor: pointer; transition: border-color .14s ease, box-shadow .14s ease, transform .14s ease;
}
.sfv-res:hover { border-color: color-mix(in srgb, var(--section-color, var(--brand)) 40%, var(--line)); box-shadow: 0 6px 16px color-mix(in srgb, var(--ink) 8%, transparent); transform: translateY(-2px); }
.sfv-res-thumb { height: 76px; border-radius: 8px; overflow: hidden; display: grid; place-items: center; background: color-mix(in srgb, var(--ink) 5%, transparent); color: var(--muted); }
.sfv-res-thumb img { width: 100%; height: 100%; object-fit: cover; }
.sfv-res-thumb svg { width: 38px; height: 38px; }
.sfv-res-name { font-size: 12.5px; color: var(--ink); line-height: 1.35; max-height: 2.7em; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.sfv-res-meta { font-size: 10.5px; color: var(--muted); }
.sfv-res-del {
  position: absolute; top: 6px; right: 6px; width: 22px; height: 22px; display: grid; place-items: center;
  border: none; background: color-mix(in srgb, var(--ink) 8%, transparent); color: var(--muted);
  cursor: pointer; border-radius: 6px; opacity: 0; transition: opacity .12s ease, background .12s ease, color .12s ease;
}
.sfv-res:hover .sfv-res-del { opacity: 1; }
.sfv-res-del:hover { background: color-mix(in srgb, #ef4444 16%, transparent); color: #ef4444; }

/* 拖拽实体/资源卡片入文件夹 */
.sfv-dragging { opacity: .42; }
.sfv-hidden { display: none !important; }

/* 列表模式：对标资源管理 renderList，渲染真实 <table> 多列 */
.sfv-list-wrap { width: 100%; overflow-x: auto; padding: 4px; }
.file-list-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.file-list-table thead th {
  text-align: left; color: var(--muted); font-weight: 600; font-size: 12px;
  padding: 10px 12px; border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--panel) 60%, transparent);
  white-space: nowrap;
}
.file-list-table tbody tr {
  border-bottom: 1px solid var(--line); transition: background .12s ease;
}
.file-list-table tbody tr:hover { background: color-mix(in srgb, var(--brand) 5%, transparent); }
.file-list-table tbody tr.selected { background: color-mix(in srgb, var(--brand) 10%, transparent); }
.file-list-table tbody td {
  padding: 10px 12px; vertical-align: middle; color: var(--ink);
}
.file-list-table .sel-td { width: 36px; text-align: center; }
.file-list-table .sel-td input[type="checkbox"] {
  width: 16px; height: 16px; cursor: pointer; accent-color: var(--brand);
}
.file-list-table .title-cell { display: flex; align-items: center; gap: 10px; min-width: 180px; }
.file-list-table .title-cell .thumb-small {
  width: 26px; height: 26px; border-radius: 6px; background: color-mix(in srgb, var(--brand) 10%, var(--panel));
  display: inline-grid; place-items: center; flex-shrink: 0; overflow: hidden; color: var(--brand);
}
.file-list-table .title-cell .thumb-small img { width: 100%; height: 100%; object-fit: cover; }
.file-list-table .title-cell .link-cell { color: var(--ink); font-weight: 600; cursor: pointer; }
.file-list-table .title-cell .link-cell:hover { color: var(--brand); text-decoration: underline; }
.file-list-table .row-actions { display: flex; align-items: center; gap: 4px; }
.file-list-table .row-actions .btn { padding: 4px 6px; min-width: 24px; }
.file-list-table tbody td.muted { color: var(--muted); }

/* 兼容旧的 .sfv-list（单列网格）— 重定向到新表格模式 */
.sfv-list .sfv-folder-grid { grid-template-columns: 1fr; }
.sfv-list .sfv-folder { flex-direction: row; align-items: center; gap: 10px; padding: 10px 12px; }
.sfv-list .sfv-folder-ico svg { width: 26px; height: 26px; }
.sfv-list .sfv-folder-name { text-align: left; flex: 1 1 auto; }
.sfv-list .sfv-res-grid { grid-template-columns: 1fr; }
.sfv-list .sfv-res { flex-direction: row; align-items: center; gap: 12px; }
.sfv-list .sfv-res-thumb { width: 54px; height: 54px; flex: 0 0 auto; }
.sfv-list .sfv-res-name { flex: 1 1 auto; max-height: none; -webkit-line-clamp: 1; }

/* ===== SFV 卡片多选复选框 + 选中态（对齐资源管理） ===== */
.sfv-main .file-card,
.sfv-main .mgmt-card,
.sfv-main .sop-card,
.sfv-main .note-list-row,
.sfv-main .items-row { position: relative; }

.sfv-check {
  position: absolute;
  top: 8px; left: 8px;
  width: 18px; height: 18px;
  margin: 0; cursor: pointer;
  accent-color: var(--section-color, var(--brand));
  z-index: 3;
  background: rgba(255,255,255,.85);
  border-radius: 3px;
}
[data-theme="dark"] .sfv-check { background: rgba(40,40,40,.85); }

/* 选中态：对齐资源管理（蓝色边框 + 浅蓝背景） */
.file-card.sfv-card-selected,
.mgmt-card.sfv-card-selected,
.sop-card.sfv-card-selected,
.note-list-row.sfv-card-selected,
.items-row.sfv-card-selected {
  border-color: var(--section-color, var(--brand)) !important;
  background: color-mix(in srgb, var(--section-color, var(--brand)) 10%, var(--panel)) !important;
  box-shadow: 0 0 0 1px var(--section-color, var(--brand));
}
.file-card.sfv-card-selected:hover,
.mgmt-card.sfv-card-selected:hover,
.sop-card.sfv-card-selected:hover { transform: translateY(-2px); }

/* ===== SFV 批量操作栏（对齐资源管理） ===== */
.sfv-batch-bar {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  flex: 1 1 auto; min-width: 0;
  padding: 0 2px;
  animation: sfv-batch-in .14s ease-out;
}
@keyframes sfv-batch-in { from { opacity: 0; transform: translateY(-2px); } to { opacity: 1; transform: none; } }
.sfv-batch-info {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 13px; color: var(--section-color, var(--brand)); font-weight: 600;
}
.sfv-batch-info .sfv-batch-count {
  background: color-mix(in srgb, var(--section-color, var(--brand)) 14%, transparent);
  padding: 2px 8px; border-radius: 999px;
}
.sfv-batch-actions { display: flex; align-items: center; gap: 6px; margin-left: auto; }
.sfv-batch-actions .sfv-batch-btn {
  border: 1px solid transparent; cursor: pointer;
  padding: 5px 12px; border-radius: 8px; font-size: 13px;
  display: inline-flex; align-items: center; gap: 5px;
  transition: background .12s ease, border-color .12s ease, color .12s ease;
}
.sfv-batch-actions .sfv-batch-btn:hover { background: var(--hover); }
.sfv-batch-actions .sfv-batch-btn[disabled] { opacity: .5; cursor: not-allowed; }
.sfv-batch-actions .sfv-batch-btn[data-kind="share"] { color: #f59e0b; border-color: #fbbf24; background: color-mix(in srgb, #f59e0b 8%, transparent); }
.sfv-batch-actions .sfv-batch-btn[data-kind="share"]:hover { background: color-mix(in srgb, #f59e0b 18%, transparent); }
.sfv-batch-actions .sfv-batch-btn[data-kind="move"] { color: #2563eb; border-color: #93c5fd; background: color-mix(in srgb, #2563eb 8%, transparent); }
.sfv-batch-actions .sfv-batch-btn[data-kind="move"]:hover { background: color-mix(in srgb, #2563eb 16%, transparent); }
.sfv-batch-actions .sfv-batch-btn[data-kind="delete"] { color: #ef4444; border-color: #fca5a5; background: color-mix(in srgb, #ef4444 8%, transparent); }
.sfv-batch-actions .sfv-batch-btn[data-kind="delete"]:hover { background: color-mix(in srgb, #ef4444 18%, transparent); }
.sfv-batch-actions .sfv-batch-btn[data-kind="cancel"] { color: var(--muted); }

/* ===== SFV 完全接管渲染：对齐资源管理 .card.file-card ===== */
.sfv-nav .sfv-bar { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.sfv-nav .sfv-bar .btn { white-space: nowrap; }
.sfv-crumbs { display: flex; align-items: center; flex-wrap: wrap; gap: 2px; min-width: 0; flex: 1 1 auto; }
.sfv-crumb {
  border: none; background: transparent; color: var(--muted); cursor: pointer;
  font-size: 13px; padding: 4px 8px; border-radius: 7px; transition: background .12s ease, color .12s ease;
}
.sfv-crumb:hover { background: var(--hover); color: var(--ink); }
.sfv-crumb.active { background: color-mix(in srgb, var(--section-color, var(--brand)) 14%, transparent); color: var(--section-color, var(--brand)); font-weight: 600; }
.sfv-crumb-sep { color: var(--muted); opacity: .6; margin: 0 1px; user-select: none; }
.sfv-toggle { display: inline-flex; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
.sfv-tg {
  width: 30px; height: 30px; display: grid; place-items: center; border: none; background: transparent;
  color: var(--muted); cursor: pointer; transition: background .12s ease, color .12s ease;
}
.sfv-tg:hover { background: var(--hover); }
.sfv-tg.active { background: color-mix(in srgb, var(--section-color, var(--brand)) 16%, transparent); color: var(--section-color, var(--brand)); }
/* 批量栏内嵌在 nav 里（复用资源管理 batch-bar 样式） */
.sfv-nav .batch-bar { flex: 1 1 auto; margin: 0; min-width: 0; }
/* 文件夹内联输入（新建子文件夹 / 重命名） */
.sfv-finput-wrap { margin-top: 8px; }
.sfv-finput {
  width: 100%; box-sizing: border-box; padding: 6px 8px; font-size: 13px;
  border: 1px solid var(--section-color, var(--brand)); border-radius: 8px;
  background: var(--bg, var(--panel)); color: var(--ink); outline: none;
}
.folder-card.editing .sfv-finput { margin: 4px 0 0; }
/* 文件夹卡 hover 高亮 drop-target（对齐资源管理） */
.file-card.folder-card.drop-target { outline: 2px dashed var(--brand); outline-offset: -3px; background: var(--brand-soft); }
/* 实体/资源卡拖拽中 */
.sfv-dragging { opacity: .42; }
/* 列表视图：对齐资源管理（文件夹/实体/资源行式） */
.sfv-list .file-grid { grid-template-columns: 1fr; }
.sfv-list .file-card { flex-direction: row; align-items: center; gap: 12px; }
.sfv-list .file-card .thumb { width: 64px; height: 64px; flex: 0 0 auto; margin-bottom: 0; }
.sfv-list .file-card .title { flex: 1 1 auto; margin: 0; }
.sfv-list .file-card .meta { flex: 0 0 auto; }
/* SFV 网格入场动画（对齐资源管理 #fileGrid.reveal-in） */
.sfv-grid.reveal-in .file-card { animation: cardReveal .5s cubic-bezier(.2,.7,.2,1) both; }
.sfv-grid.reveal-in .file-card:nth-child(2){animation-delay:.05s}
.sfv-grid.reveal-in .file-card:nth-child(3){animation-delay:.1s}
.sfv-grid.reveal-in .file-card:nth-child(4){animation-delay:.15s}
.sfv-grid.reveal-in .file-card:nth-child(5){animation-delay:.2s}
.sfv-grid.reveal-in .file-card:nth-child(n+6){animation-delay:.25s}

/* ===== 6 板块统一主题配色（Tailwind 500 系列，现代柔和风格，10% alpha 背景不刺眼） ===== */
.file-card[data-scope="files"]      .thumb { background: color-mix(in srgb, var(--brand, #0B5CAD) 10%, var(--panel)); border: 1px solid color-mix(in srgb, var(--brand, #0B5CAD) 25%, var(--line)); }.file-card[data-scope="files"]      .thumb .icon { background: color-mix(in srgb, var(--brand, #0B5CAD) 18%, var(--panel)); color: var(--brand, #0B5CAD); }.file-card[data-scope="files"]      .badge { background: color-mix(in srgb, var(--brand, #0B5CAD) 10%, var(--panel)); color: var(--brand, #0B5CAD); font-weight: 700; }
.file-card[data-scope="url_case"]      .thumb { background: color-mix(in srgb, var(--brand, #0B5CAD) 10%, var(--panel)); border: 1px solid color-mix(in srgb, var(--brand, #0B5CAD) 25%, var(--line)); }.file-card[data-scope="url_case"]      .thumb .icon { background: color-mix(in srgb, var(--brand, #0B5CAD) 18%, var(--panel)); color: var(--brand, #0B5CAD); }.file-card[data-scope="url_case"]      .badge { background: color-mix(in srgb, var(--brand, #0B5CAD) 10%, var(--panel)); color: var(--brand, #0B5CAD); font-weight: 700; }
.file-card[data-scope="sop"]      .thumb { background: color-mix(in srgb, var(--brand, #0B5CAD) 10%, var(--panel)); border: 1px solid color-mix(in srgb, var(--brand, #0B5CAD) 25%, var(--line)); }.file-card[data-scope="sop"]      .thumb .icon { background: color-mix(in srgb, var(--brand, #0B5CAD) 18%, var(--panel)); color: var(--brand, #0B5CAD); }.file-card[data-scope="sop"]      .badge { background: color-mix(in srgb, var(--brand, #0B5CAD) 10%, var(--panel)); color: var(--brand, #0B5CAD); font-weight: 700; }
.file-card[data-scope="note"]      .thumb { background: color-mix(in srgb, var(--brand, #0B5CAD) 10%, var(--panel)); border: 1px solid color-mix(in srgb, var(--brand, #0B5CAD) 25%, var(--line)); }.file-card[data-scope="note"]      .thumb .icon { background: color-mix(in srgb, var(--brand, #0B5CAD) 18%, var(--panel)); color: var(--brand, #0B5CAD); }.file-card[data-scope="note"]      .badge { background: color-mix(in srgb, var(--brand, #0B5CAD) 10%, var(--panel)); color: var(--brand, #0B5CAD); font-weight: 700; }
.file-card[data-scope="agent"]      .thumb { background: color-mix(in srgb, var(--brand, #0B5CAD) 10%, var(--panel)); border: 1px solid color-mix(in srgb, var(--brand, #0B5CAD) 25%, var(--line)); }.file-card[data-scope="agent"]      .thumb .icon { background: color-mix(in srgb, var(--brand, #0B5CAD) 18%, var(--panel)); color: var(--brand, #0B5CAD); }.file-card[data-scope="agent"]      .badge { background: color-mix(in srgb, var(--brand, #0B5CAD) 10%, var(--panel)); color: var(--brand, #0B5CAD); font-weight: 700; }
.file-card[data-scope="workflow"]      .thumb { background: color-mix(in srgb, var(--brand, #0B5CAD) 10%, var(--panel)); border: 1px solid color-mix(in srgb, var(--brand, #0B5CAD) 25%, var(--line)); }.file-card[data-scope="workflow"]      .thumb .icon { background: color-mix(in srgb, var(--brand, #0B5CAD) 18%, var(--panel)); color: var(--brand, #0B5CAD); }.file-card[data-scope="workflow"]      .badge { background: color-mix(in srgb, var(--brand, #0B5CAD) 10%, var(--panel)); color: var(--brand, #0B5CAD); font-weight: 700; }
/* 深色主题：背景透明度稍高（深色面板上需要更明显的色调） */
[data-theme="dark"] .file-card[data-scope="files"]      .thumb { background: color-mix(in srgb, var(--brand, #0B5CAD) 15%, var(--panel)); }[data-theme="dark"] .file-card[data-scope="files"]      .thumb .icon { background: color-mix(in srgb, var(--brand, #0B5CAD) 22%, var(--panel)); }
[data-theme="dark"] .file-card[data-scope="url_case"]      .thumb { background: color-mix(in srgb, var(--brand, #0B5CAD) 15%, var(--panel)); }[data-theme="dark"] .file-card[data-scope="url_case"]      .thumb .icon { background: color-mix(in srgb, var(--brand, #0B5CAD) 22%, var(--panel)); }
[data-theme="dark"] .file-card[data-scope="sop"]      .thumb { background: color-mix(in srgb, var(--brand, #0B5CAD) 15%, var(--panel)); }[data-theme="dark"] .file-card[data-scope="sop"]      .thumb .icon { background: color-mix(in srgb, var(--brand, #0B5CAD) 22%, var(--panel)); }
[data-theme="dark"] .file-card[data-scope="note"]      .thumb { background: color-mix(in srgb, var(--brand, #0B5CAD) 15%, var(--panel)); }[data-theme="dark"] .file-card[data-scope="note"]      .thumb .icon { background: color-mix(in srgb, var(--brand, #0B5CAD) 22%, var(--panel)); }
[data-theme="dark"] .file-card[data-scope="agent"]      .thumb { background: color-mix(in srgb, var(--brand, #0B5CAD) 15%, var(--panel)); }[data-theme="dark"] .file-card[data-scope="agent"]      .thumb .icon { background: color-mix(in srgb, var(--brand, #0B5CAD) 22%, var(--panel)); }
[data-theme="dark"] .file-card[data-scope="workflow"]      .thumb { background: color-mix(in srgb, var(--brand, #0B5CAD) 15%, var(--panel)); }[data-theme="dark"] .file-card[data-scope="workflow"]      .thumb .icon { background: color-mix(in srgb, var(--brand, #0B5CAD) 22%, var(--panel)); }


/* ===== SFV 双行：工具栏（左对齐一排）+ 第二行（crumbs / batch-bar） ===== */
.sfv-nav {
  display: flex; flex-direction: column; gap: 8px;
  margin-bottom: 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}
/* 工具栏镜像资源管理：按钮全部靠左（flex-start），单行不换行，spacer 把右侧切换按钮推到最右 */
.sfv-nav > .toolbar {
  margin: 0; padding: 0; border: 0;
  display: flex; align-items: center; gap: 10px;
  flex-wrap: nowrap;
  justify-content: flex-start;
}
.sfv-nav > .toolbar .btn { white-space: nowrap; flex: 0 0 auto; }
.sfv-nav > .toolbar .local-search { flex: 0 0 auto; }
.sfv-nav > .toolbar .spacer { flex: 1 1 auto; }
/* 时间筛选 chips：全部 / 24小时 / 7天 / 30天，对标资源管理 renderTypeFilter 体验 */
.sfv-nav > .toolbar .sfv-chips {
  display: inline-flex; align-items: center; gap: 4px;
  margin-left: 4px;
  padding: 2px 4px; border-radius: 8px;
  background: color-mix(in srgb, var(--ink) 4%, transparent);
}
.sfv-nav > .toolbar .sfv-chip {
  border: 1px solid transparent; background: transparent; color: var(--muted);
  font-size: 12px; font-weight: 600; padding: 4px 10px; border-radius: 6px;
  cursor: pointer; transition: background .12s, color .12s, border-color .12s;
}
.sfv-nav > .toolbar .sfv-chip:hover { background: color-mix(in srgb, var(--brand) 8%, transparent); color: var(--ink); }
.sfv-nav > .toolbar .sfv-chip.active {
  background: color-mix(in srgb, var(--brand) 14%, transparent);
  color: var(--brand); border-color: color-mix(in srgb, var(--brand) 35%, transparent);
}
/* 工具栏非主按钮去块状背景（仅图标+文字，hover 才显形），与资源管理 .explorer-head 一致的扁平观感 */
.sfv-nav > .toolbar .btn:not(.primary):not(.danger) {
  background: transparent;
  border-color: transparent;
  color: var(--ink);
  box-shadow: none;
  font-weight: 500;
}
.sfv-nav > .toolbar .btn:not(.primary):not(.danger):hover {
  background: color-mix(in srgb, var(--scope-color, var(--brand)) 10%, transparent);
  border-color: transparent;
  color: var(--scope-color, var(--brand));
  box-shadow: none;
}
/* 保留主操作按钮（上传 / 新建文件夹）的彩色背景（来自 .btn.magnetic） */
.sfv-nav > .toolbar .btn.magnetic {
  background: color-mix(in srgb, var(--scope-color, var(--brand)) 14%, var(--panel));
  border-color: color-mix(in srgb, var(--scope-color, var(--brand)) 28%, transparent);
  color: var(--scope-color, var(--brand));
}
.sfv-nav > .toolbar .btn.magnetic:hover {
  background: color-mix(in srgb, var(--scope-color, var(--brand)) 22%, var(--panel));
  color: var(--scope-color, var(--brand));
  border-color: var(--scope-color, var(--brand));
}
.sfv-nav > .sfv-row-2 { min-height: 32px; padding: 0 2px; display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.sfv-nav .sfv-row-2 .batch-bar { flex: 1 1 auto; margin: 0; }
.sfv-nav .sfv-row-2 .sfv-crumbs { flex: 1 1 auto; }


/* ============ 自定义表单模块（Form Builder） ============ */
/* forms 列表视图 panel 与其他管理模块一致：撑满父容器、display:flex column、内层 explorer-body 独立滚动（资源模块 line 700-703 同模式） */
#tabForms > .content > .panel { flex: 1; min-height: 0; display: flex; flex-direction: column; overflow: hidden; }
#formEditorView { display: flex; flex-direction: column; }
/* 表单提交记录视图：面板改为纵向 flex 列并填满，修复左侧大片空白；列表区独立滚动 */
#tabForms #formSubsView, #tabForms #formAllSubsView { flex: 1 1 0; min-height: 0; flex-direction: column; }
#tabForms #formSubsView > .explorer-body, #tabForms #formAllSubsView > .explorer-body { flex: 1; min-height: 0; overflow-y: auto; padding-right: 2px; }
.fb-body {
  display: grid;
  grid-template-columns: 236px minmax(0, 1fr) 340px;
  gap: 14px;
  padding: 14px 16px;
  align-items: start;
}
.fb-sec-title { font-size: 13px; font-weight: 700; color: var(--text); margin: 0 0 10px; letter-spacing: .02em; }
.fb-palette, .fb-fields, .fb-preview {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 14px;
}
.fb-type-list { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.fb-type-btn {
  display: flex; flex-direction: column; align-items: center; gap: 4px;
  padding: 10px 6px; border-radius: 10px; cursor: pointer;
  border: 1px solid var(--border); background: var(--bg);
  font-size: 12px; color: var(--text);
  transition: all .18s cubic-bezier(.16,1,.3,1);
}
.fb-type-btn:hover { border-color: #0e7490; color: #0e7490; transform: translateY(-1px); box-shadow: 0 4px 12px rgba(14,116,144,.12); }
.fb-type-ico { font-size: 18px; line-height: 1; }
.fb-settings .apm-label { display: block; font-size: 12px; font-weight: 600; margin: 0 0 4px; color: var(--muted); }
.fb-settings .input { width: 100%; }
.fb-settings code { font-size: 11px; background: var(--bg); padding: 1px 4px; border-radius: 4px; }

.fb-field-list { display: flex; flex-direction: column; gap: 10px; }
.fb-field-item {
  border: 1px solid var(--border); border-radius: 12px; background: var(--bg);
  transition: border-color .18s, box-shadow .18s;
}
.fb-field-item.open { border-color: #0e7490; box-shadow: 0 6px 18px rgba(14,116,144,.10); }
.fb-field-item.dragging { opacity: .45; }
.fb-field-head {
  display: flex; align-items: center; gap: 8px; padding: 10px 12px; cursor: pointer; user-select: none;
}
.fb-field-drag { cursor: grab; color: var(--muted); font-size: 14px; line-height: 1; }
.fb-field-badge {
  font-size: 11px; padding: 2px 7px; border-radius: 999px; flex: none;
  background: color-mix(in srgb, #0e7490 12%, transparent); color: #0e7490; font-weight: 600;
}
.fb-field-name { flex: 1; min-width: 0; font-weight: 600; font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fb-field-key { font-size: 11px; color: var(--muted); font-family: ui-monospace, Menlo, Consolas, monospace; flex: none; }
.fb-req-dot { color: #ef4444; font-weight: 700; }
.fb-field-ops { display: flex; gap: 4px; flex: none; }
.fb-mini-btn {
  border: 1px solid var(--border); background: var(--panel); border-radius: 7px;
  width: 24px; height: 24px; line-height: 1; cursor: pointer; color: var(--muted); font-size: 12px;
}
.fb-mini-btn:hover { color: var(--text); border-color: var(--muted); }
.fb-mini-btn.danger:hover { color: #ef4444; border-color: #ef4444; }
.fb-field-body { padding: 0 12px 12px; display: none; border-top: 1px dashed var(--border); margin-top: 2px; padding-top: 10px; }
.fb-field-item.open .fb-field-body { display: block; }
.fb-row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.fb-field-body label { display: block; font-size: 11px; color: var(--muted); font-weight: 600; margin: 8px 0 3px; }
.fb-field-body .input { width: 100%; }
.fb-chk { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; margin-top: 10px; }

.fb-fields-empty { text-align: center; padding: 44px 16px; color: var(--muted); }
.fb-empty-ico { font-size: 34px; margin-bottom: 8px; }
.fb-empty-title { font-weight: 700; color: var(--text); margin-bottom: 4px; }
.fb-empty-desc { font-size: 12px; }

/* 左右两栏跟随滚动并在超高时自身滚动，避免长表单把侧栏顶出视口 */
.fb-palette, .fb-preview {
  position: sticky; top: 12px;
  max-height: calc(100vh - 170px);
  overflow-y: auto; overflow-x: hidden;
}
.fb-palette::-webkit-scrollbar, .fb-preview::-webkit-scrollbar { width: 8px; }
.fb-palette::-webkit-scrollbar-thumb, .fb-preview::-webkit-scrollbar-thumb {
  background: var(--border); border-radius: 8px;
}
.fb-preview-card { border: 1px solid var(--border); border-radius: 12px; padding: 16px; background: var(--bg); }
.fb-pv-title { font-size: 17px; font-weight: 700; margin: 0 0 4px; }
.fb-pv-desc { font-size: 12px; color: var(--muted); margin: 0 0 14px; }
.fb-pv-field { margin-bottom: 12px; }
.fb-pv-label { font-size: 12px; font-weight: 600; margin-bottom: 5px; display: block; }
.fb-pv-input {
  width: 100%; border: 1px solid var(--border); border-radius: 8px; padding: 8px 10px;
  background: var(--panel); font-size: 13px; color: var(--muted);
}
.fb-pv-opt { display: flex; align-items: center; gap: 6px; font-size: 12px; margin: 4px 0; color: var(--muted); }
.fb-pv-help { font-size: 11px; color: var(--muted); margin-top: 3px; }
.fb-pv-submit {
  width: 100%; margin-top: 8px; padding: 10px; border-radius: 9px; border: none;
  background: linear-gradient(135deg, #22d3ee, #0e7490); color: #fff; font-weight: 700; font-size: 14px;
}
.fb-pv-stars { font-size: 20px; color: #f59e0b; letter-spacing: 3px; }

/* 全屏预览弹窗 */
.fb-preview-modal .agent-publish-modal-body { max-height: calc(100vh - 280px); overflow-y: auto; }
.fb-preview-modal .fb-preview-card { padding: 22px 24px; }
.fb-preview-modal .fb-pv-title { font-size: 20px; }

.fb-subs-wrap { padding: 0; overflow: auto; width: 100%; }
.fb-subs-table { width: 100%; border-collapse: collapse; font-size: 13px; table-layout: fixed; }
.fb-subs-table th, .fb-subs-table td {
  border-bottom: 1px solid var(--border); padding: 9px 10px; text-align: left; vertical-align: top;
  overflow-wrap: anywhere;
}
.fb-subs-table th { font-size: 12px; color: var(--muted); font-weight: 700; white-space: nowrap; background: var(--panel); position: sticky; top: 0; }
.fb-subs-table td { max-width: 280px; word-break: break-word; }
.fb-subs-table th:first-child, .fb-subs-table td:first-child { width: 150px; min-width: 150px; }
.fb-run-ok { color: #059669; font-weight: 600; }
.fb-run-fail { color: #ef4444; font-weight: 600; }
.fb-run-none { color: var(--muted); }

/* ===== 表单统计看板 + 全局提交记录 ===== */
.fb-stats { padding: 14px 16px 4px; display: flex; flex-direction: column; gap: 16px; }
.fb-stats-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.fb-stat-card {
  border: 1px solid var(--border); border-radius: 12px; padding: 14px 16px;
  background: linear-gradient(135deg, color-mix(in srgb, #0B5CAD 6%, var(--panel)), var(--panel));
}
.fb-stat-card .n { font-size: 24px; font-weight: 800; color: #0B5CAD; line-height: 1.1; }
.fb-stat-card .l { font-size: 12px; color: var(--muted); margin-top: 4px; }
.fb-stats-section { border: 1px solid var(--border); border-radius: 12px; padding: 12px 14px; background: var(--panel); }
.fb-stats-sec-title { font-size: 13px; font-weight: 700; margin-bottom: 10px; color: var(--text); }

.fb-bar-list { display: flex; flex-direction: column; gap: 8px; }
.fb-bar-row { display: grid; grid-template-columns: minmax(90px, 1.4fr) 3fr auto; align-items: center; gap: 10px; }
.fb-bar-label { font-size: 12px; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fb-bar-track { height: 8px; background: color-mix(in srgb, #0B5CAD 12%, var(--border)); border-radius: 999px; overflow: hidden; }
.fb-bar-fill { height: 100%; border-radius: 999px; background: linear-gradient(90deg, #0B5CAD, #38bdf8); }
.fb-bar-val { font-size: 12px; color: var(--muted); white-space: nowrap; }
.fb-bar-val .ok { color: #059669; }

.fb-trend { display: flex; align-items: flex-end; gap: 3px; height: 70px; padding: 2px 0; overflow-x: auto; }
.fb-trend-col { flex: 1 0 10px; display: flex; align-items: flex-end; min-width: 6px; }
.fb-trend-bar { width: 100%; min-height: 2px; background: linear-gradient(180deg, #38bdf8, #0B5CAD); border-radius: 3px 3px 0 0; }
.fb-trend-axis { display: flex; justify-content: space-between; font-size: 11px; color: var(--muted); margin-top: 4px; }

.fb-subs-global .fb-summary { max-width: none; color: var(--text); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.fb-subs-global .fb-ops { white-space: nowrap; }
.fb-detail-row td { background: color-mix(in srgb, #0B5CAD 4%, var(--panel)); padding: 12px 14px; }
.fb-detail-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px 18px; }
.fb-detail-item { display: flex; gap: 8px; font-size: 12px; line-height: 1.5; }
.fb-detail-item .k { flex: none; color: var(--muted); font-weight: 600; min-width: 64px; }
.fb-detail-item .v { color: var(--text); word-break: break-word; }

/* 时间窗分段控件 */
.fb-seg { display: inline-flex; border: 1px solid var(--border); border-radius: 9px; overflow: hidden; background: var(--panel); flex: none; }
.fb-seg-btn { border: none; background: transparent; padding: 6px 12px; font-size: 12px; color: var(--muted); cursor: pointer; transition: background .15s, color .15s; }
.fb-seg-btn + .fb-seg-btn { border-left: 1px solid var(--border); }
.fb-seg-btn:hover { color: var(--text); }
.fb-seg-btn.active { background: #0B5CAD; color: #fff; }

/* 字段分析 */
.fb-analytics-meta { margin: 10px 2px 6px; }
.fb-field-analytics { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 12px; padding: 4px; }
.fb-field-analytic { border: 1px solid var(--border); border-radius: 12px; padding: 12px 14px; background: var(--panel); }
.fb-fa-head { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; margin-bottom: 8px; }
.fb-fa-label { font-weight: 700; font-size: 13px; color: var(--text); }
.fb-fa-type { font-size: 11px; color: var(--muted); white-space: nowrap; }
.fb-fa-fill { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 10px; margin-bottom: 8px; }
.fb-fa-fill-val { font-size: 11px; color: var(--muted); white-space: nowrap; }
.fb-bar-track.sm { height: 6px; }
.fb-dist { margin-top: 4px; display: flex; flex-direction: column; gap: 6px; }
.fb-dist-row { display: grid; grid-template-columns: minmax(80px, 1.2fr) 3fr auto; align-items: center; gap: 8px; }
.fb-dist-label { font-size: 12px; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fb-dist-val { font-size: 11px; color: var(--muted); white-space: nowrap; }
.fb-kw-title { margin-bottom: 2px; }
.fb-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.fb-tag { font-size: 11px; background: color-mix(in srgb, #0B5CAD 10%, var(--panel)); color: #0B5CAD; border: 1px solid color-mix(in srgb, #0B5CAD 22%, transparent); border-radius: 999px; padding: 2px 9px; }
.fb-numeric { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 12px; color: var(--text); }
.fb-numeric span { background: color-mix(in srgb, #0B5CAD 8%, var(--panel)); border-radius: 6px; padding: 3px 8px; }
.ff-users .chk { font-size: 13px; }
.ff-users input { margin-right: 6px; }

/* AI 解读 Markdown 容器 */
.insight-md { font-size: 13px; line-height: 1.7; color: var(--text); max-height: 56vh; overflow: auto; }
.insight-md h1, .insight-md h2, .insight-md h3 { font-size: 15px; margin: 10px 0 6px; color: var(--text); }
.insight-md ul, .insight-md ol { padding-left: 20px; margin: 6px 0; }
.insight-md li { margin: 3px 0; }
.insight-md code { background: color-mix(in srgb, #0B5CAD 8%, var(--panel)); border-radius: 4px; padding: 1px 5px; font-size: 12px; }
.insight-md pre { background: color-mix(in srgb, #0B5CAD 6%, var(--panel)); border-radius: 8px; padding: 10px; overflow: auto; }
.insight-md p { margin: 6px 0; }

@media (max-width: 720px) {
  .fb-stats-cards { grid-template-columns: repeat(2, 1fr); }
  .fb-bar-row { grid-template-columns: 1fr; gap: 4px; }
  .fb-bar-track { width: 100%; }
  .fb-subs-global .fb-summary { max-width: 180px; }
}

@media (max-width: 1180px) {
  .fb-body { grid-template-columns: 210px minmax(0, 1fr); }
  .fb-preview { display: none; }
}
@media (max-width: 820px) {
  .fb-body { grid-template-columns: 1fr; }
  .fb-type-list { grid-template-columns: repeat(3, 1fr); }
}

/* ===== SFV 笔记卡片标签 + 工具栏活动标签筛选 ===== */
.sfv-tags { margin: 4px 0 2px; display: flex; flex-wrap: wrap; gap: 4px; }
.sfv-tags .note-tag-chip { font-size: 11px; padding: 1px 7px; line-height: 16px; }
.sfv-active-tag { gap: 4px; }
.sfv-active-tag .x { margin-left: 2px; opacity: .65; font-size: 11px; }
.sfv-active-tag:hover .x { opacity: 1; }

/* ===== 笔记附件管理面板（P2）===== */
.btn.xs { padding: 4px 10px; font-size: 12px; height: auto; line-height: 1.4; }
.attach-mask { position: fixed; inset: 0; background: rgba(15,23,42,.45); display: none; align-items: center; justify-content: center; z-index: 2000; padding: 24px; }
.attach-modal { width: min(880px, 100%); max-height: 86vh; background: #fff; border-radius: 14px; box-shadow: 0 24px 70px rgba(15,23,42,.28); display: flex; flex-direction: column; overflow: hidden; }
.attach-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 18px; border-bottom: 1px solid #e6e8eb; }
.attach-title { font-size: 15px; font-weight: 600; color: #1f2937; display: inline-flex; align-items: center; gap: 8px; }
.attach-head-actions { display: flex; gap: 8px; align-items: center; }
.attach-close { border: none; background: transparent; font-size: 22px; line-height: 1; color: #9aa1a9; cursor: pointer; padding: 0 4px; }
.attach-close:hover { color: #ef4444; }
.attach-toolbar { display: flex; align-items: center; gap: 14px; padding: 10px 18px; border-bottom: 1px solid #f0f2f5; font-size: 13px; color: #5b6573; }
.attach-selall { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; user-select: none; }
.attach-stat { margin-left: auto; color: #8a9099; }
.attach-body { padding: 10px 18px 18px; overflow: auto; }
.attach-empty { padding: 40px 18px; text-align: center; color: #8a9099; font-size: 13px; }
.attach-item { display: flex; align-items: center; gap: 12px; padding: 10px; border: 1px solid #eef0f3; border-radius: 10px; margin-bottom: 8px; background: #fcfdff; transition: border-color .15s, box-shadow .15s; }
.attach-item:hover { border-color: #cfd8e3; box-shadow: 0 2px 10px rgba(15,23,42,.05); }
.attach-checkwrap { display: flex; align-items: center; }
.attach-thumb { width: 46px; height: 46px; border-radius: 8px; background: #eef2f7; display: flex; align-items: center; justify-content: center; overflow: hidden; flex: 0 0 auto; color: #0b5cad; }
.attach-thumb-img { width: 100%; height: 100%; object-fit: cover; }
.attach-thumb-icon { width: 22px; height: 22px; }
.attach-meta { flex: 1 1 auto; min-width: 0; }
.attach-name { font-size: 13.5px; color: #1f2937; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.attach-sub { margin-top: 3px; font-size: 11.5px; color: #8a9099; display: flex; align-items: center; gap: 8px; }
.attach-badge { background: #eef4fb; color: #0b5cad; border-radius: 999px; padding: 1px 8px; font-size: 11px; }
.attach-miss { color: #ef4444; font-weight: 500; }
.attach-ops { display: flex; gap: 6px; flex: 0 0 auto; }
@media (max-width: 560px) {
  .attach-ops { flex-direction: column; }
  .attach-item { flex-wrap: wrap; }
}

/* ===== 笔记 OCR 结果弹窗（P3 #753） ===== */
.ocr-textarea {
  width: 100%; min-height: 260px; max-height: 56vh; resize: vertical; box-sizing: border-box;
  padding: 12px 14px; border: 1px solid #e6e8eb; border-radius: 10px;
  font-size: 13.5px; line-height: 1.7; color: #1f2937; background: #fcfdff;
  font-family: -apple-system, "Segoe UI", "Microsoft YaHei", sans-serif; outline: none;
}
.ocr-textarea:focus { border-color: #0b5cad; box-shadow: 0 0 0 3px rgba(11,90,173,.12); }
.ocr-foot { display: flex; justify-content: flex-end; gap: 8px; padding: 12px 18px; border-top: 1px solid #eef0f3; }
.btn.primary { background: var(--brand, #0b5cad); color: #fff; border-color: var(--brand, #0b5cad); }
.btn.primary:hover { filter: brightness(1.06); }

/* ===== 协作评论侧栏（P2-13） ===== */
.note-comment-panel {
  flex: 0 0 320px; width: 320px;
  display: flex; flex-direction: column; min-height: 0;
  background: var(--bg); border-left: 1px solid var(--line);
  box-sizing: border-box; align-self: stretch;
}
.note-cmt-badge {
  display: inline-block; min-width: 16px; height: 16px; line-height: 16px; padding: 0 4px;
  background: var(--danger, #ef4444); color: #fff; border-radius: 999px; font-size: 11px;
  font-weight: 700; text-align: center; margin-left: 2px; vertical-align: middle;
}
.note-comment-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 14px; border-bottom: 1px solid var(--line);
  font-size: 13px; font-weight: 700; color: var(--ink);
}
.note-comment-title { display: flex; align-items: center; gap: 6px; }
.note-comment-title svg.ico { width: 15px; height: 15px; }
.note-comment-head-actions { display: inline-flex; gap: 4px; }
.note-comment-mini {
  width: 26px; height: 26px; border: none; background: transparent; color: var(--muted);
  cursor: pointer; border-radius: 6px; display: inline-flex; align-items: center; justify-content: center;
}
.note-comment-mini:hover { background: var(--hover); color: var(--brand); }
.note-comment-mini svg.ico { width: 14px; height: 14px; }
.note-comment-list { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 10px 12px; }
.note-comment-empty { padding: 24px 12px; color: var(--muted); font-size: 12.5px; text-align: center; line-height: 1.6; }
.note-comment-item { display: flex; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.note-comment-item:last-child { border-bottom: none; }
.note-comment-avatar {
  flex: 0 0 30px; width: 30px; height: 30px; border-radius: 50%; overflow: hidden;
  background: var(--brand-soft, #eaf2fb); color: var(--brand, #0b5cad);
  display: inline-flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 700;
}
.note-comment-avatar img { width: 100%; height: 100%; object-fit: cover; }
.note-comment-body { flex: 1 1 auto; min-width: 0; }
.note-comment-meta { display: flex; align-items: baseline; gap: 8px; }
.note-comment-author { font-size: 13px; font-weight: 600; color: var(--ink); }
.note-comment-time { font-size: 11px; color: var(--muted); }
.note-comment-text { font-size: 13.5px; color: var(--ink); line-height: 1.55; margin-top: 3px; word-break: break-word; }
.note-mention { color: var(--brand, #0b5cad); font-weight: 600; background: var(--brand-soft, #eaf2fb); border-radius: 4px; padding: 0 3px; }
.note-comment-anchor-quote {
  margin-top: 6px; padding: 6px 10px; border-left: 3px solid var(--brand, #0b5cad);
  background: var(--hover); border-radius: 0 6px 6px 0; font-size: 12px; color: var(--muted);
  cursor: pointer; display: flex; gap: 6px; align-items: flex-start; line-height: 1.5;
}
.note-comment-anchor-quote svg.ico { width: 13px; height: 13px; flex: 0 0 13px; margin-top: 2px; color: var(--brand, #0b5cad); }
.note-comment-actions { margin-top: 4px; display: flex; gap: 12px; }
.note-comment-link { border: none; background: transparent; color: var(--muted); font-size: 12px; cursor: pointer; padding: 0; }
.note-comment-link:hover { color: var(--brand); }
.note-comment-link.danger:hover { color: var(--danger, #ef4444); }
.note-comment-compose { border-top: 1px solid var(--line); padding: 10px 12px; background: var(--panel, #fff); }
.note-comment-anchor {
  display: flex; gap: 6px; align-items: flex-start; margin-bottom: 8px; padding: 6px 10px;
  border-left: 3px solid var(--brand, #0b5cad); background: var(--hover); border-radius: 0 6px 6px 0;
  font-size: 12px; color: var(--muted); line-height: 1.5;
}
.note-comment-anchor svg.ico { width: 13px; height: 13px; flex: 0 0 13px; margin-top: 2px; color: var(--brand, #0b5cad); }
.note-comment-input-wrap { position: relative; }
.note-comment-input {
  width: 100%; resize: vertical; min-height: 44px; max-height: 140px; box-sizing: border-box;
  border: 1px solid var(--line); border-radius: 8px; padding: 8px 10px; font-size: 13.5px;
  font-family: inherit; color: var(--ink); background: var(--bg); line-height: 1.5;
}
.note-comment-input:focus { outline: none; border-color: var(--brand, #0b5cad); }
.note-comment-mention {
  position: absolute; left: 0; right: 0; bottom: calc(100% + 4px); z-index: 20;
  background: var(--panel, #fff); border: 1px solid var(--line); border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0,0,0,.14); max-height: 200px; overflow-y: auto; padding: 4px;
}
.note-cmt-mention-item {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 6px 10px; border-radius: 6px; cursor: pointer; font-size: 13px; color: var(--ink);
}
.note-cmt-mention-item:hover, .note-cmt-mention-item.active { background: var(--brand-soft, #eaf2fb); }
.note-cmt-mention-un { color: var(--muted); font-size: 12px; }
.note-comment-sendrow { display: flex; align-items: center; justify-content: space-between; margin-top: 8px; gap: 10px; }
.note-comment-hint { font-size: 11px; color: var(--muted); flex: 1 1 auto; min-width: 0; }
mark.note-comment-anchor-hl { background: #fff3a3; color: inherit; border-radius: 2px; padding: 0 1px; }


/* ===== 账号「可用功能模块」多选（P1-1 功能权限矩阵）===== */
.user-modules { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 6px; }
.user-modules .check { display: inline-flex; align-items: center; gap: 5px; font-size: 13px; cursor: pointer; }
.user-modules .check input { width: 15px; height: 15px; accent-color: #0b5cad; }
.user-modules .check span { color: var(--ink); }
.check-group { display: flex; flex-wrap: wrap; gap: 6px 18px; }
.check-group .check input { width: 15px; height: 15px; accent-color: #0b5cad; }

/* ===== 笔记双链（P2 #745）===== */
a.note-link { color: #0b5cad; text-decoration: none; border-bottom: 1px dashed #85b7eb; cursor: pointer; border-radius: 2px; padding: 0 1px; }
a.note-link:hover { background: #e6f1fb; border-bottom-style: solid; }
[data-theme="dark"] a.note-link { color: #7db4e8; border-bottom-color: #3a5a80; }
[data-theme="dark"] a.note-link:hover { background: #16283c; }
.note-backlinks { margin-top: 14px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--bg); }
.note-backlinks-head { display: flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 600; color: var(--ink); margin-bottom: 8px; }
.note-backlinks-count { color: var(--muted); font-weight: 400; }
.note-backlinks-list { display: flex; flex-direction: column; gap: 4px; max-height: 220px; overflow: auto; }
.note-backlink-item { padding: 5px 8px; border-radius: 6px; font-size: 13px; color: #0b5cad; cursor: pointer; border-left: 2px solid transparent; }
.note-backlink-item:hover { background: var(--brand-soft); border-left-color: #0b5cad; }
[data-theme="dark"] .note-backlink-item { color: #7db4e8; }
.note-link-suggest { position: absolute; z-index: 9999; background: var(--panel); border: 1px solid var(--line); border-radius: 10px; box-shadow: 0 10px 30px rgba(0,0,0,.12); padding: 4px; max-height: 260px; overflow: auto; font-size: 13px; }
.note-link-suggest-item { padding: 7px 10px; border-radius: 7px; cursor: pointer; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.note-link-suggest-item:hover { background: var(--brand-soft); }

/* ===== 模型库快捷入口（数据不拆、视图单列，P2 #745 迭代 2）===== */
.type-btn.model { width: auto; padding: 0 12px; gap: 6px; background: #e6f1fb; border-color: #85b7eb; color: #0b5cad; }
.type-btn.model .model-ico { display: inline-flex; }
.type-btn.model .model-label { font-size: 12.5px; font-weight: 600; white-space: nowrap; }
.type-btn.model:hover { transform: translateY(-1px); box-shadow: 0 3px 8px rgba(11,92,173,.15); }
.type-btn.model.active { background: #0b5cad; border-color: #0b5cad; color: #fff; box-shadow: 0 3px 10px rgba(11,92,173,.3); }
[data-theme="dark"] .type-btn.model { background: #16283c; border-color: #3a5a80; color: #7db4e8; }
[data-theme="dark"] .type-btn.model.active { background: #0b5cad; border-color: #0b5cad; color: #fff; }

/* ===== 开放平台 Open API 密钥管理（迭代 3）===== */
.openapi-toolbar { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.openapi-count { font-size: 12.5px; color: var(--muted); }
.openapi-list { display: flex; flex-direction: column; gap: 6px; }
.openapi-hint { color: var(--muted); font-size: 12.5px; }
.openapi-item { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--bg); }
.openapi-item.revoked { opacity: .55; }
.openapi-item-main { min-width: 0; flex: 1; }
.openapi-item-name { font-size: 13px; font-weight: 600; color: var(--ink); margin-bottom: 2px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.openapi-name-text { font-size: 12.5px; color: var(--muted); font-weight: 400; }
.openapi-appkey { display: inline-flex; align-items: center; gap: 4px; font-family: ui-monospace, monospace; font-size: 12px; background: var(--hover); padding: 2px 8px; border-radius: 6px; cursor: pointer; max-width: 320px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.openapi-appkey:hover { background: color-mix(in srgb, var(--brand) 12%, var(--hover)); }
.openapi-secret-text { display: inline-flex; align-items: center; gap: 4px; font-family: ui-monospace, monospace; font-size: 12px; background: var(--hover); padding: 2px 8px; border-radius: 6px; cursor: pointer; max-width: 360px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.openapi-secret-text:hover { background: color-mix(in srgb, var(--brand) 12%, var(--hover)); }
.openapi-secret-na { font-size: 11.5px; color: var(--muted); font-style: italic; }
.openapi-secret-text code { background: transparent; padding: 0; font-family: inherit; }
.openapi-copy-ico { display: inline-flex; opacity: .55; margin-left: 2px; }
.openapi-appkey:hover .openapi-copy-ico, .openapi-secret-text:hover .openapi-copy-ico { opacity: 1; }
.openapi-status-badge { display: inline-block; font-size: 10.5px; padding: 1px 8px; border-radius: 999px; background: #e6f7ec; color: #0f8a4d; font-weight: 600; }
.openapi-status-badge + .openapi-item-name + .openapi-name-text, .openapi-item-name .openapi-status-badge { margin-right: 4px; }
.openapi-item.revoked .openapi-status-badge { background: #eef0f3; color: #8a9099; }
.openapi-label { color: var(--muted); }
.openapi-item-meta { font-size: 11.5px; color: var(--ink); margin-top: 4px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.openapi-item-sub { font-size: 11px; color: var(--muted); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.openapi-item-actions { display: flex; gap: 6px; flex-shrink: 0; }
.openapi-item-meta { font-size: 11.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ===== 数据统计面板（设置弹窗「数据统计」）===== */
#spStatsHost { overflow-y: auto; }
.stats-grid { display: block; padding: 4px 0; }
.stats-card { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 18px 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--panel); }
.stats-ic { width: 36px; height: 36px; border-radius: 10px; background: var(--brand-soft); color: #0b5cad; display: inline-flex; align-items: center; justify-content: center; }
.stats-ic svg.ico { width: 18px; height: 18px; }
.stats-num { font-size: 22px; font-weight: 700; color: var(--ink); line-height: 1.1; }
.stats-label { font-size: 12px; color: var(--muted); }
.stats-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 16px; flex-wrap: wrap; }
.stats-toolbar-right { display: inline-flex; align-items: center; gap: 10px; }
.stats-toolbar .btn.sm { display: inline-flex; align-items: center; gap: 5px; }
.stats-layout { display: flex; flex-direction: column; gap: 16px; }
.stats-overview { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.stats-row { display: grid; gap: 16px; }
.stats-row-2 { grid-template-columns: 2fr 1fr; }
.stats-col { display: flex; flex-direction: column; gap: 16px; }
.stats-section { padding: 14px 16px; border: 1px solid var(--line); border-radius: 12px; background: var(--panel); }
.stats-section-title { font-size: 14px; font-weight: 700; color: var(--ink); margin-bottom: 10px; }
.stats-ai-summary { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; margin-bottom: 10px; }
.stats-ai-kv { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 6px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--bg); font-size: 12px; }
.stats-ai-kv span { color: var(--muted); }
.stats-lead-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 10px; }
.stats-lead-step { padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--bg); }
.stats-lead-num { font-size: 20px; font-weight: 700; color: var(--ink); line-height: 1.2; }
.stats-lead-label { font-size: 11px; color: var(--muted); margin: 2px 0 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.stats-lead-track { height: 4px; border-radius: 2px; background: var(--line); overflow: hidden; }
.stats-lead-fill { height: 100%; background: var(--accent); border-radius: 2px; }
@media (max-width: 720px) { .stats-lead-steps { grid-template-columns: repeat(2, 1fr); } }
.stats-ai-kv b { color: var(--ink); font-weight: 600; }
.sub-title { font-size: 12px; font-weight: 600; color: var(--muted); margin: 12px 0 6px; }
.kv-row { display: flex; justify-content: space-between; gap: 12px; font-size: 13px; padding: 3px 0; }
.kv-row span { color: var(--muted); }
.kv-row b { color: var(--ink); font-weight: 600; }
.bars { display: flex; flex-direction: column; gap: 6px; }
.bar-row { display: grid; grid-template-columns: 120px 1fr 130px; align-items: center; gap: 10px; font-size: 12px; }
.bar-label { color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bar-track { height: 8px; background: var(--line); border-radius: 6px; overflow: hidden; }
.bar-fill { height: 100%; background: linear-gradient(90deg, #1a56db, #3b82f6); border-radius: 6px; }
.bar-val { color: var(--muted); text-align: right; white-space: nowrap; }
.bar-sub { color: var(--muted); opacity: .8; }
.backup-overview { margin-bottom: 12px; }
.backup-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 12px; }
.backup-card { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; padding: 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--bg); color: var(--ink); cursor: pointer; transition: border-color .15s, background .15s; }
.backup-card:hover { border-color: var(--brand); background: var(--brand-soft); }
.backup-card svg.ico { color: var(--brand); }
.backup-card-title { font-size: 13px; font-weight: 600; }
.backup-card-sub { font-size: 11px; color: var(--muted); }
.backup-import-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.backup-import-row .check { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; cursor: pointer; white-space: nowrap; }
.backup-log { max-height: 220px; overflow: auto; background: #0f172a; color: #e2e8f0; padding: 10px 12px; border-radius: 8px; font-size: 11.5px; line-height: 1.5; white-space: pre-wrap; margin: 10px 0 0; }
.btn.outline { background: transparent; border: 1px solid var(--line); color: var(--ink); cursor: pointer; display: inline-flex; align-items: center; }
.btn.outline:hover { border-color: var(--brand); color: var(--brand); }
@media (max-width: 1100px) {
  .stats-overview { grid-template-columns: repeat(3, 1fr); }
  .stats-row-2 { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .stats-overview { grid-template-columns: repeat(2, 1fr); }
  .backup-cards { grid-template-columns: repeat(2, 1fr); }
  .stats-ai-summary { grid-template-columns: 1fr; }
  .bar-row { grid-template-columns: 84px 1fr 96px; gap: 6px; }
  .stats-toolbar { flex-direction: column; align-items: flex-start; }
}
.openapi-item-meta code { font-family: Consolas, monospace; }
.openapi-badge { color: #b45309; font-size: 11px; border: 1px solid #f59e0b; border-radius: 4px; padding: 0 4px; margin-left: 4px; }
.openapi-create { margin-top: 10px; padding: 12px; border: 1px dashed var(--line); border-radius: 10px; background: var(--bg); }
.openapi-scopes { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 6px; }
.openapi-scopes .check { display: inline-flex; align-items: center; gap: 5px; font-size: 13px; cursor: pointer; }
.openapi-secret-row { display: flex; gap: 8px; align-items: center; }
.openapi-secret-row .input.mono { font-family: Consolas, monospace; font-size: 12px; }

/* ===== 开放平台：接口文档 ===== */
.openapi-docs { margin-top: 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--bg); overflow: hidden; }
.openapi-docs-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 14px; background: var(--hover); border-bottom: 1px solid var(--line); }
.openapi-docs-title { font-size: 13px; font-weight: 600; color: var(--ink); }
.openapi-docs-body { padding: 12px 14px 14px; }
.openapi-doc-table { width: 100%; border-collapse: collapse; font-size: 12.5px; table-layout: fixed; }
.openapi-doc-table th { text-align: left; font-weight: 600; color: var(--muted); font-size: 11.5px; padding: 6px 8px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.openapi-doc-table th:nth-child(1) { width: 42%; }
.openapi-doc-table th:nth-child(3) { width: 18%; }
.openapi-doc-table td { padding: 7px 8px; border-bottom: 1px solid var(--line); color: var(--ink); vertical-align: top; word-break: break-all; }
.openapi-doc-table tr:last-child td { border-bottom: 0; }
.openapi-doc-table code { font-family: Consolas, monospace; font-size: 11.5px; background: var(--hover); padding: 1px 5px; border-radius: 4px; }
.openapi-method { display: inline-block; font-family: Consolas, monospace; font-size: 10.5px; font-weight: 700; padding: 1px 6px; border-radius: 4px; letter-spacing: .3px; }
.openapi-method.get { background: color-mix(in srgb, #0B5CAD 14%, transparent); color: #0B5CAD; }
.openapi-method.post { background: color-mix(in srgb, #16a34a 16%, transparent); color: #15803d; }
.openapi-scope { color: var(--muted); }
.openapi-curl { margin-top: 12px; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.openapi-curl-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 7px 12px; background: var(--hover); font-size: 12px; color: var(--muted); border-bottom: 1px solid var(--line); }
.openapi-curl pre { margin: 0; padding: 12px; font-family: Consolas, monospace; font-size: 11.5px; line-height: 1.65; color: var(--ink); background: var(--bg); overflow-x: auto; white-space: pre; }

/* ===== 全局命令面板（S3，Ctrl/Cmd+K）===== */
.cmdk-mask { position: fixed; inset: 0; z-index: 4000; background: rgba(15,23,42,.45); display: flex; align-items: flex-start; justify-content: center; padding-top: 12vh; backdrop-filter: blur(2px); }
.cmdk-panel { width: min(620px, 92vw); background: var(--panel); border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 24px 70px rgba(15,23,42,.25); overflow: hidden; display: flex; flex-direction: column; max-height: 70vh; }
.cmdk-input-row { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-bottom: 1px solid var(--line); }
.cmdk-ico { color: var(--muted); display: inline-flex; }
.cmdk-input { flex: 1; min-width: 0; border: none; outline: none; background: transparent; font-size: 14.5px; color: var(--ink); }
.cmdk-input::placeholder { color: var(--muted); }
.cmdk-esc { border: 1px solid var(--line); background: var(--bg); color: var(--muted); font-size: 11px; border-radius: 6px; padding: 2px 8px; cursor: pointer; }
.cmdk-ai-toggle { padding: 6px 14px; font-size: 12.5px; color: var(--muted); border-bottom: 1px solid var(--line); }
.cmdk-ai-toggle .check { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }
.cmdk-results { overflow: auto; padding: 6px; flex: 1; }
.cmdk-hint { color: var(--muted); font-size: 13px; padding: 14px; text-align: center; }
.cmdk-group { font-size: 11.5px; color: var(--muted); padding: 8px 10px 3px; font-weight: 600; }
.cmdk-item { padding: 7px 10px; border-radius: 8px; cursor: pointer; }
.cmdk-item.active { background: var(--brand-soft); }
.cmdk-item-title { font-size: 13.5px; color: var(--ink); }
.cmdk-item-snippet { font-size: 12px; color: var(--muted); margin-top: 1px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cmdk-ai-answer { padding: 10px 12px; }
.cmdk-ai-title { font-size: 12px; font-weight: 600; color: #0b5cad; margin-bottom: 4px; }
.cmdk-ai-body { font-size: 13px; color: var(--ink); line-height: 1.65; max-height: 200px; overflow: auto; }
.cmdk-ai-sources { font-size: 11.5px; color: var(--muted); margin-top: 6px; }
.cmdk-foot { display: flex; justify-content: space-between; padding: 7px 14px; border-top: 1px solid var(--line); font-size: 11.5px; color: var(--muted); }

/* ===== 站内通知中心（迭代 4 铃铛徽标保留）===== */
.notify-btn { position: relative; }
.notify-badge { position: absolute; top: 2px; right: 2px; min-width: 15px; height: 15px; padding: 0 3px; border-radius: 8px; background: #ef4444; color: #fff; font-size: 10px; line-height: 15px; text-align: center; font-weight: 700; }

/* ===== 通知大弹窗（modal-mask 居中，对齐个人中心/设置风格：左分类栏 + 右列表）===== */
.notify-modal-mask { padding: 0; align-items: center; justify-content: center; }
.notify-modal { width: min(960px, 100%); height: min(86vh, 760px); display: flex; flex-direction: column; padding: 0; overflow: hidden; border-radius: 18px; box-shadow: 0 30px 80px rgba(0,0,0,.35); }
.notify-modal-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 20px; border-bottom: 1px solid var(--line); }
.notify-modal-title { font-size: 16px; font-weight: 700; color: var(--ink); }
.notify-modal-actions { display: flex; gap: 8px; }
.notify-modal-body { display: flex; flex: 1 1 auto; min-height: 0; }
.notify-modal-side { flex: 0 0 180px; border-right: 1px solid var(--line); padding: 12px 8px; overflow: auto; background: var(--bg); }
.notify-modal-mid { flex: 1 1 auto; display: flex; flex-direction: column; min-width: 0; }
.notify-modal-list { flex: 1 1 auto; overflow: auto; padding: 8px; }

/* ===== 笔记协作者（P1-3）===== */
.note-collab-list { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.note-collab-chip { display: inline-flex; align-items: center; gap: 4px; background: var(--brand-soft); color: #0b5cad; border-radius: 999px; padding: 2px 10px; font-size: 12px; }
.note-collab-del { border: none; background: transparent; color: #0b5cad; cursor: pointer; font-size: 14px; line-height: 1; padding: 0 2px; }
.note-collab-del:hover { color: #ef4444; }
/* 协作者权限：可管理时为内联下拉，否则为只读徽标 */
.note-collab-chip b { font-weight: 600; }
.note-collab-perm { border: 1px solid rgba(11, 92, 173, .28); background: var(--card, #fff); color: #0b5cad; border-radius: 999px; font-size: 11px; line-height: 1; padding: 2px 4px; cursor: pointer; outline: none; }
.note-collab-perm:focus { border-color: #0b5cad; }
.note-collab-tag { background: rgba(11, 92, 173, .12); color: #0b5cad; border-radius: 999px; font-size: 11px; padding: 1px 7px; }
.note-collab-tag.is-view { background: rgba(138, 144, 153, .18); color: #6b7280; }
[data-theme="dark"] .note-collab-perm { background: rgba(255, 255, 255, .06); color: #8ab8ea; border-color: rgba(138, 184, 234, .35); }
[data-theme="dark"] .note-collab-tag { background: rgba(138, 184, 234, .18); color: #8ab8ea; }
[data-theme="dark"] .note-collab-tag.is-view { background: rgba(255, 255, 255, .1); color: #aab2bd; }
/* 只读协作者：笔记编辑器锁定提示条 */
.note-readonly-bar { display: flex; align-items: center; gap: 8px; margin: 0 0 10px; padding: 8px 12px; border-radius: 8px; background: rgba(138, 144, 153, .12); color: var(--muted, #6b7280); font-size: 12px; }
.note-readonly-bar b { color: var(--text, #222); font-weight: 600; }
.note-rich-toolbar.is-locked { opacity: .45; pointer-events: none; filter: grayscale(1); }
/* 笔记卡片协作标识 */
.note-perm-badge { display: inline-block; margin-left: 6px; padding: 1px 7px; border-radius: 999px; font-size: 11px; line-height: 1.6; background: rgba(11, 92, 173, .12); color: #0b5cad; vertical-align: middle; }
.note-perm-badge.is-view { background: rgba(138, 144, 153, .18); color: #6b7280; }
[data-theme="dark"] .note-perm-badge { background: rgba(138, 184, 234, .18); color: #8ab8ea; }
[data-theme="dark"] .note-perm-badge.is-view { background: rgba(255, 255, 255, .1); color: #aab2bd; }
/* 笔记生命周期标识（B5/B6） */
.note-lifecycle-badge { display: inline-block; margin-left: 6px; padding: 1px 7px; border-radius: 999px; font-size: 11px; line-height: 1.6; background: rgba(138, 144, 153, .18); color: #6b7280; vertical-align: middle; }
.note-lifecycle-badge.is-draft { background: rgba(245, 158, 11, .16); color: #b7791f; }
.note-lifecycle-badge.is-pending { background: rgba(11, 92, 173, .14); color: #0b5cad; }
[data-theme="dark"] .note-lifecycle-badge { background: rgba(255, 255, 255, .1); color: #aab2bd; }
[data-theme="dark"] .note-lifecycle-badge.is-draft { background: rgba(245, 158, 11, .2); color: #e0a93b; }
[data-theme="dark"] .note-lifecycle-badge.is-pending { background: rgba(138, 184, 234, .2); color: #8ab8ea; }

/* 笔记列表 lifecycle 筛选 */
.note-lifecycle-filter { width: 120px; min-width: auto; }
.note-lifecycle-filter .ls-input { border: none; background: transparent; width: 100%; cursor: pointer; outline: none; color: inherit; font: inherit; padding: 0 4px; }

/* SFV 工具栏内笔记生命周期筛选（与 .note-lifecycle-filter 同源，匹配 .sfv-lifecycle-filter 类） */
.sfv-lifecycle-filter {
  min-width: auto; width: auto; max-width: 110px;
  border: 1px solid var(--line, #ECECEC);
  background: #fff;
  border-radius: 8px;
  padding: 6px 8px;
  cursor: pointer;
  color: inherit;
  font: inherit;
  outline: none;
  height: 32px;
}
/* 时间筛选 chips 不被挤压，保持单行 */
.sfv-nav > .toolbar .local-search { width: 160px; min-width: 160px; }
.sfv-nav > .toolbar .sfv-chips { flex: 0 0 auto; white-space: nowrap; }
.sfv-nav > .toolbar .sfv-chip { white-space: nowrap; }
[data-theme="dark"] .sfv-lifecycle-filter { background: #1f2733; border-color: #2a3340; color: #e6edf3; }

/* 分享弹窗草稿态提示（B5/B6 闭环） */
.note-share-lifecycle-hint { margin: 0 0 12px; padding: 8px 12px; border-radius: 8px; background: rgba(245, 158, 11, .12); color: #b7791f; font-size: 13px; line-height: 1.5; border: 1px solid rgba(245, 158, 11, .35); }
[data-theme="dark"] .note-share-lifecycle-hint { background: rgba(245, 158, 11, .16); color: #e0a93b; border-color: rgba(245, 158, 11, .4); }
/* 保存冲突弹窗 */
.note-conflict-box { max-width: 520px; }
.note-conflict-box .nc-desc { font-size: 13px; line-height: 1.7; color: var(--muted, #6b7280); margin: 0 0 12px; }
.note-conflict-box .nc-desc b { color: var(--text, #222); }
.note-conflict-acts { display: flex; flex-wrap: wrap; gap: 8px; }

/* ===== 最佳实践升级（url_cases：状态/行业徽标 + 统计条）===== */
.ucs-badge { font-weight: 600; }
.ucs-badge.ucs-won { background: #e6f7ec; color: #0f8a4d; }
.ucs-badge.ucs-arc { background: #eef0f3; color: #8a9099; }
.ucs-badge.ucs-pending { background: #fdf3e0; color: #b26a00; }
.ucs-ind { background: #eef4fb; color: #0b5cad; }
.url-case-stats { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 10px 16px; border-top: 1px solid var(--line); font-size: 12px; color: var(--muted); }
.ucs-total { font-weight: 700; color: var(--ink); }
.ucs-chip { display: inline-flex; align-items: center; gap: 4px; background: var(--hover); border-radius: 999px; padding: 2px 10px; }
.ucs-chip b { color: var(--brand); }
.ucs-st-won b { color: #0f8a4d; }
.ucs-st-archived b { color: #8a9099; }

/* ===== 版本 diff 对比（P0-1 增强）===== */
.note-diff-toolbar { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.note-diff-title { font-size: 13px; font-weight: 600; color: var(--ink); flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.note-diff-legend { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; color: var(--muted); }
.note-diff-body { margin: 0; padding: 14px 16px; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 12.5px; line-height: 1.7; color: var(--ink); white-space: pre-wrap; word-break: break-word; }
.note-diff-body .d-del { display: block; background: #fde8e8; color: #c0392b; text-decoration: line-through; border-radius: 4px; padding: 0 4px; }
.note-diff-body .d-add { display: block; background: #e6f7ec; color: #0f8a4d; border-radius: 4px; padding: 0 4px; }
.note-diff-body .d-same { display: block; color: var(--muted); opacity: .75; }

/* ===== 发布弹窗底部操作区（主操作按钮统一放底部） ===== */
.apm-foot { display: flex; justify-content: flex-end; align-items: center; gap: 8px; padding: 14px 18px; border-top: 1px solid var(--line); background: var(--bg); }
.apm-foot .agent-publish-toggle { min-width: 140px; }
.apm-foot .agent-publish-toggle.soft { background: color-mix(in srgb, var(--brand) 10%, var(--bg)); color: var(--brand); border-color: color-mix(in srgb, var(--brand) 30%, var(--line)); }

/* ===== 通知中心三栏（独立模块，分类 / 列表 / 详情） ===== */
.notif-panel { padding: 0; overflow: hidden; }
.notif-layout { display: flex; height: calc(100vh - 210px); min-height: 420px; }
.notif-side { flex: 0 0 176px; border-right: 1px solid var(--line); padding: 12px 8px; overflow: auto; background: var(--bg); }
.notif-side-title { font-size: 11.5px; color: var(--muted); padding: 4px 10px 10px; font-weight: 600; letter-spacing: .3px; }
.notif-cat { display: flex; align-items: center; gap: 8px; padding: 9px 10px; border-radius: 8px; cursor: pointer; color: var(--ink); font-size: 13px; }
.notif-cat:hover { background: var(--hover); }
.notif-cat.active { background: var(--brand-soft); color: #0b5cad; font-weight: 600; }
.notif-cat svg.ico { width: 15px; height: 15px; flex: 0 0 auto; }
.notif-cat-count { margin-left: auto; background: #eef2f7; color: #5b6573; border-radius: 999px; font-size: 11px; padding: 1px 7px; }
.notif-cat.active .notif-cat-count { background: #0b5cad; color: #fff; }
.notif-mid { flex: 1 1 auto; display: flex; flex-direction: column; min-width: 0; border-right: 1px solid var(--line); }
.notif-mid-head { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; border-bottom: 1px solid var(--line); }
.notif-mid-title { font-size: 14px; font-weight: 700; color: var(--ink); }
.notif-mid-actions { display: flex; gap: 8px; }
.notif-list { flex: 1 1 auto; overflow: auto; padding: 8px; }
.notif-row { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid transparent; border-radius: 10px; cursor: pointer; margin-bottom: 4px; }
.notif-row:hover { background: var(--hover); }
.notif-row.active { background: var(--brand-soft); border-color: #0b5cad; }
.notif-row.unread .notif-row-title { font-weight: 600; }
.notif-row.unread .notif-row-title::before { content: '● '; color: #0b5cad; }
.notif-chk { display: flex; align-items: center; flex: 0 0 auto; }
.notif-row-main { flex: 1 1 auto; min-width: 0; }
.notif-row-title { font-size: 13.5px; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.notif-row-sub { margin-top: 3px; font-size: 11.5px; color: var(--muted); display: flex; gap: 8px; align-items: center; }
.notif-type { background: #eef4fb; color: #0b5cad; border-radius: 999px; padding: 1px 8px; font-size: 11px; }
.notif-more { padding: 8px; text-align: center; border-top: 1px solid var(--line); }
.notif-detail { flex: 0 0 300px; padding: 16px; overflow: auto; background: var(--bg); }
.notif-detail-empty { color: var(--muted); font-size: 13px; text-align: center; padding: 40px 0; }
.notif-detail-head { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.notif-detail-type { background: #eef4fb; color: #0b5cad; border-radius: 999px; padding: 2px 10px; font-size: 12px; font-weight: 600; }
.notif-detail-unread { background: #ef4444; color: #fff; border-radius: 999px; padding: 1px 8px; font-size: 11px; }
.notif-detail-title { font-size: 15px; font-weight: 600; color: var(--ink); line-height: 1.5; margin-bottom: 8px; }
.notif-detail-time { font-size: 12px; color: var(--muted); margin-bottom: 16px; }
.notif-detail-ops { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.notify-view-all { padding: 8px 12px; text-align: center; font-size: 12px; color: #0b5cad; cursor: pointer; border-top: 1px solid var(--line); }
.notify-view-all:hover { text-decoration: underline; }
/* 转发弹窗 */
.notif-forward-box { width: min(480px, 92vw); max-height: 78vh; background: var(--panel); border-radius: 14px; box-shadow: 0 24px 70px rgba(15,23,42,.28); display: flex; flex-direction: column; overflow: hidden; }
.notif-forward-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 18px; border-bottom: 1px solid var(--line); font-size: 15px; font-weight: 600; color: var(--ink); }
.notif-forward-x { border: none; background: transparent; font-size: 22px; line-height: 1; color: #9aa1a9; cursor: pointer; padding: 0 4px; }
.notif-forward-x:hover { color: #ef4444; }
.notif-forward-sub { padding: 8px 18px 0; font-size: 12px; color: var(--muted); }
.notif-forward-users { flex: 1 1 auto; overflow: auto; padding: 10px 18px; display: flex; flex-direction: column; gap: 2px; }
.notif-fwd-user { display: flex; align-items: center; gap: 8px; padding: 8px 6px; border-radius: 8px; cursor: pointer; font-size: 13px; color: var(--ink); }
.notif-fwd-user:hover { background: var(--hover); }
.notif-fwd-meta { margin-left: auto; font-size: 11.5px; color: var(--muted); }
.notif-forward-foot { display: flex; justify-content: flex-end; gap: 8px; padding: 12px 18px; border-top: 1px solid var(--line); }
@media (max-width: 900px) {
  .notif-layout { height: auto; min-height: 60vh; }
  .notif-side { flex: 0 0 130px; }
  .notif-detail { display: none; }
}

/* ===== 审计日志（B 级）===== */
.audit-list { overflow: auto; max-height: 52vh; }
.audit-table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.audit-table th, .audit-table td { padding: 8px 10px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.audit-table th { position: sticky; top: 0; background: var(--bg); color: var(--muted); font-weight: 600; font-size: 11.5px; }
.audit-table td { color: var(--ink); }
.audit-table td.muted { color: var(--muted); }
.audit-table tr:hover td { background: var(--hover); }
.audit-act { background: #eef4fb; color: #0b5cad; border-radius: 999px; padding: 1px 8px; font-size: 11px; white-space: nowrap; }
.audit-pager .btn:disabled { opacity: .45; cursor: default; }

/* ===== AI 回答引用定位 + 追问建议（A3，迭代 5）===== */
.home-ai-sources, .home-ai-sugs { margin-top: 6px; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.home-ai-src, .home-ai-sug { border: 1px solid var(--line); background: var(--bg); color: #0b5cad; font-size: 12px; border-radius: 999px; padding: 3px 10px; cursor: pointer; max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.home-ai-src:hover, .home-ai-sug:hover { background: var(--brand-soft); border-color: #0b5cad; }
.home-ai-sug { color: var(--ink); }
.home-ai-sug:hover { color: #0b5cad; }

/* ===== 版本与授权 License（迭代 6）===== */
.license-status { display: flex; flex-direction: column; gap: 4px; }
.license-badge { display: inline-block; width: fit-content; font-size: 13px; font-weight: 700; padding: 3px 12px; border-radius: 999px; }
.license-badge.ok { background: #eaf3de; color: #3b6d11; border: 1px solid #97c459; }
.license-badge.dev { background: #e6f1fb; color: #0b5cad; border: 1px solid #85b7eb; }
.license-badge.bad { background: #fcebeb; color: #a32d2d; border: 1px solid #f09595; }
.license-detail { font-size: 12.5px; color: var(--muted); }

/* ===== 设备台账（阶段 3 MVP）===== */
.device-alerts { margin-bottom: 10px; padding: 8px 12px; border-radius: 8px; background: #fef3c7; color: #92400e; font-size: 12.5px; border: 1px solid #fcd34d; }
.dev-warn { font-size: 11px; padding: 1px 7px; border-radius: 999px; }
.dev-warn.ok { background: #eaf3de; color: #3b6d11; }
.dev-warn.expiring { background: #fef3c7; color: #92400e; }
.dev-warn.expired { background: #fcebeb; color: #a32d2d; }
.dev-warn.none { background: #f1efE8; color: #5f5e5a; }
.dev-status { font-size: 11px; padding: 1px 7px; border-radius: 999px; white-space: nowrap; }
.dev-status.ok { background: #eaf3de; color: #3b6d11; }
.dev-status.warranty { background: #e6f0fb; color: #0b5cad; }
.dev-status.repair { background: #fef3c7; color: #92400e; }
.dev-status.retired { background: #f1efe8; color: #5f5e5a; }
.dev-status.none { background: #f1efe8; color: #5f5e5a; }
.dev-sub { font-size: 10.5px; color: var(--muted); margin-top: 1px; }
.dev-ops { white-space: nowrap; }
/* B6 保修看板 chips */
.dev-warranty-board { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 14px; }
.dev-wb-chip { display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px; border-radius: 999px; border: 1px solid var(--bd, #ECECEC); background: var(--bg-card, #fff); color: var(--text, #1a1a1a); font-size: 12.5px; cursor: pointer; transition: all .15s; }
.dev-wb-chip b { font-size: 14px; }
.dev-wb-chip:hover { transform: translateY(-1px); box-shadow: 0 2px 8px rgba(0,0,0,.06); }
.dev-wb-chip.active { box-shadow: 0 0 0 2px rgba(11,92,173,.35); border-color: #0B5CAD; }
.dev-wb-chip.expired b { color: #a32d2d; }
.dev-wb-chip.d30 b, .dev-wb-chip.d60 b, .dev-wb-chip.d90 b { color: #92400e; }
.dev-wb-chip.ok b { color: #3b6d11; }
.dev-wb-chip.clear { color: var(--muted); font-size: 12px; }

/* ===== FAB 部门智能体选择（智能体部门化）===== */
.fab-agent-row { padding: 6px 12px 0; }
.fab-agent-sel { width: 100%; font-size: 12px; padding: 5px 8px; border-radius: 8px; }

/* ===== 两步验证（2FA，P2-1）===== */
.twofa-modal .modal-body { padding: 18px 20px 20px; }
.twofa-qr { display: flex; justify-content: center; margin: 12px 0; }
.twofa-qr > div { position: relative; padding: 10px; background: #fff; border-radius: 10px; box-shadow: 0 1px 4px rgba(0,0,0,.12); }
.twofa-secret { display: flex; align-items: center; gap: 8px; background: var(--panel,#f7f8fa); border: 1px solid var(--border,#ececec); border-radius: 8px; padding: 8px 10px; }
.twofa-secret code.mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 13px; letter-spacing: .5px; word-break: break-all; flex: 1; }
.twofa-backup-list { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 16px; margin: 12px 0 4px; }
.twofa-backup-list .bc { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 14px; background: var(--panel,#f7f8fa); border: 1px dashed var(--border,#ececec); border-radius: 6px; padding: 6px 10px; text-align: center; letter-spacing: 1px; }
.twofa-backup-list .bc .used { color: var(--muted); text-decoration: line-through; }

/* ===== 多智能体协同弹窗（P2-6）===== */
.ma-block { margin-bottom: 14px; }
.ma-block-title { font-size: 13px; font-weight: 600; margin-bottom: 6px; color: var(--text, #222); }
.ma-pre { white-space: pre-wrap; word-break: break-word; background: var(--panel, #f7f8fa); border: 1px solid var(--border, #ececec); border-radius: 8px; padding: 10px 12px; font-size: 13px; line-height: 1.7; max-height: 260px; overflow: auto; margin: 0; font-family: inherit; }
.ma-final .ma-pre { border-color: #b8d4ef; background: var(--panel, #f7f8fa); max-height: 420px; }
.ma-final .ma-block-title { color: #0B5CAD; }
/* 智能体模块「多智能体协同」入口按钮（区别于新建智能体的主按钮） */
.ma-entry-btn {
  color: #0B5CAD;
  border: 1px solid color-mix(in srgb, #0B5CAD 42%, transparent);
  background: color-mix(in srgb, #0B5CAD 7%, #fff);
  font-weight: 600;
}
.ma-entry-btn:hover { background: color-mix(in srgb, #0B5CAD 13%, #fff); border-color: #0B5CAD; }
.ma-entry-btn svg.ico { color: #0B5CAD; }

.ma-steps { display: flex; align-items: stretch; gap: 6px; margin-bottom: 18px; flex-wrap: wrap; }
.ma-step { display: flex; align-items: center; gap: 10px; flex: 1 1 0; min-width: 116px; background: var(--panel, #f7f8fa); border: 1px solid var(--border, #ececec); border-radius: 10px; padding: 10px 12px; }
.ma-step-ic { width: 26px; height: 26px; border-radius: 50%; background: #0B5CAD; color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: 13px; flex: 0 0 auto; }
.ma-step-body { display: flex; flex-direction: column; line-height: 1.3; }
.ma-step-body b { font-size: 14px; color: var(--text, #222); }
.ma-step-arrow { display: flex; align-items: center; color: var(--muted); font-size: 16px; flex: 0 0 auto; }

/* ===== SSO 扫码登录弹窗（P2-5 体验升级）===== */
.sso-qr-box { width: 280px; padding: 24px 20px 18px; text-align: center; }
.sso-qr-box .icon-btn { position: absolute; top: 8px; right: 10px; }
.sso-qr-img { display: flex; justify-content: center; align-items: center; width: 200px; height: 200px; margin: 0 auto 12px; background: #fff; border-radius: 8px; padding: 8px; box-sizing: border-box; }
.sso-qr-img img, .sso-qr-img canvas { display: block; }
.sso-qr-hint { margin: 6px 0 0; color: var(--muted, #666); font-size: 13px; }

/* ===== 部门管理（SaaS 阶段①）===== */
#deptMask .modal { width: 620px; max-width: calc(100vw - 40px); }
.dept-tree-head { display: flex; align-items: center; margin-bottom: 12px; }
.dept-tree { border: 1px solid var(--line, #eee); border-radius: 10px; padding: 10px 12px; max-height: 50vh; overflow-y: auto; }
.dept-node { display: flex; align-items: center; gap: 8px; padding: 7px 4px; border-radius: 8px; }
.dept-node:hover { background: var(--brand-soft, #EFF4FA); }
.dept-caret { width: 16px; flex: 0 0 16px; display: inline-flex; color: var(--muted, #888); }
.dept-leaf { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--line-strong, #ccc); margin: 0 5px; }
.dept-name { font-weight: 500; font-size: 14px; white-space: nowrap; }
.dept-meta { color: var(--muted, #888); font-size: 12px; margin-left: 8px; }
.dept-actions { margin-left: auto; display: inline-flex; gap: 6px; opacity: 0; transition: opacity .12s; }
.dept-node:hover .dept-actions { opacity: 1; }

/* ===== 组织管理一体布局（左公司 / 右部门）===== */
.org-split { display: flex; gap: 14px; align-items: stretch; margin-top: 14px; }
.org-side { width: 220px; flex: 0 0 220px; border: 1px solid var(--line, #eee); border-radius: 10px; padding: 10px; box-sizing: border-box; display: flex; flex-direction: column; }
.org-side-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; font-weight: 500; font-size: 13px; }
.org-tenant-list { overflow-y: auto; max-height: 52vh; }
.org-tenant-item { padding: 8px 10px; border-radius: 8px; cursor: pointer; display: flex; align-items: center; gap: 8px; }
.org-tenant-item:hover { background: var(--brand-soft, #EFF4FA); }
.org-tenant-item.active { background: var(--brand-soft, #EFF4FA); box-shadow: inset 2px 0 0 var(--brand, #0B5CAD); }
.org-tenant-name { font-size: 13px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.org-tenant-meta { font-size: 11px; color: var(--muted, #888); }
.org-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.org-main-head { display: flex; align-items: center; margin-bottom: 10px; gap: 10px; }
.org-dept-title { font-weight: 600; font-size: 15px; }
.org-main-hint { font-size: 12px; color: var(--muted, #888); }
.org-dept-title:empty ~ .org-main-hint { display: inline; }

/* ===== 组织管理：顶部「当前公司概览」卡片 ===== */
.org-header {
  display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
  background: linear-gradient(135deg, var(--brand-soft, #EFF4FA), color-mix(in srgb, var(--brand) 6%, var(--panel)));
  border: 1px solid color-mix(in srgb, var(--brand) 14%, var(--line));
  border-radius: 14px; padding: 14px 18px; margin-top: 12px;
}
.org-header-main { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.org-header-title { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.org-header-name { margin: 0; font-size: 17px; font-weight: 700; color: var(--ink); line-height: 1.2; }
.org-header-policy {
  font-size: 11px; padding: 2px 8px; border-radius: 8px;
  background: color-mix(in srgb, var(--brand) 12%, transparent); color: var(--brand, #0B5CAD);
}
.org-header-stats { display: flex; align-items: center; gap: 8px; }
.org-stat-pill {
  display: inline-flex; align-items: baseline; gap: 4px;
  background: var(--panel); border: 1px solid var(--line);
  border-radius: 10px; padding: 6px 12px;
}
.org-stat-num { font-size: 16px; font-weight: 700; color: var(--brand, #0B5CAD); }
.org-stat-cap { font-size: 11px; color: var(--muted, #888); }
.org-header-actions { flex: 0 0 auto; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

/* 公司项目块 */
.org-projects { margin-top: 16px; border-top: 1px dashed var(--line); padding-top: 14px; }
.org-projects-head { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; font-weight: 600; font-size: 13px; color: var(--ink); }
.org-projects-head .spacer { flex: 1; }

/* 公司项布局 + 悬浮操作按钮 */
.org-tenant-item { flex-wrap: wrap; position: relative; }
.org-tenant-name { flex: 1 1 100%; }
.org-tenant-meta { flex: 1 1 100%; }
.org-tenant-actions { display: none; gap: 4px; margin-left: auto; }
.org-tenant-item:hover .org-tenant-actions { display: inline-flex; }
.plan-badge { display: inline-block; font-size: 10px; padding: 1px 6px; border-radius: 8px; background: var(--brand-soft, #EFF4FA); color: var(--brand, #0B5CAD); margin-left: 6px; vertical-align: 1px; }
.plan-badge-shared { background: #F1F4F8; color: #6B7785; font-weight: 500; }
.org-projects-hint { color: var(--muted, #888); font-size: 12px; margin: 0 0 10px 0; }
.org-project-shared { background: #FAFBFC; border-style: dashed; }
.org-project-shared .org-project-name { color: var(--muted, #6B7785); }
.org-project-link { color: var(--brand, #0B5CAD); cursor: pointer; text-decoration: none; border-bottom: 1px dashed transparent; transition: border-color 120ms ease; }
.org-project-link:hover { border-bottom-color: var(--brand, #0B5CAD); }
.org-project-list { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; }
.org-project-item { display: flex; align-items: center; justify-content: space-between; border: 1px solid var(--line,#eee); border-radius: 10px; padding: 10px 12px; }
.org-project-name { font-weight: 500; font-size: 13px; }
.org-project-meta { font-size: 11px; color: var(--muted,#888); margin-top: 2px; }
.org-project-actions { display: flex; gap: 6px; flex: 0 0 auto; }
/* ===== 项目空间独立页面 ===== */
.proj-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; margin-top: 4px; }
.proj-card {
  border: 1px solid var(--line); border-radius: 12px; padding: 14px 16px;
  background: var(--panel); box-shadow: var(--shadow);
  display: flex; flex-direction: column; gap: 8px;
  transition: border-color .15s, box-shadow .15s;
}
.proj-card:hover { border-color: color-mix(in srgb, var(--brand) 35%, var(--line)); }
.proj-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.proj-card-title { font-weight: 600; font-size: 14px; display: flex; align-items: center; flex-wrap: wrap; color: var(--ink); }
.proj-card-title .plan-badge { margin-left: 6px; }
.proj-card-actions { display: flex; gap: 6px; flex: 0 0 auto; }
.proj-card-desc { font-size: 12px; color: var(--muted); line-height: 1.5; }
.proj-stats { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 2px; }
.proj-stat { font-size: 11px; color: var(--muted); background: var(--brand-soft); border-radius: 8px; padding: 3px 8px; }
.proj-stat b { color: var(--brand); font-weight: 600; margin-right: 2px; }
.badge-ok { background: #E8F5EC; color: #1E8E3E; }
.badge-muted { background: #F0F0F0; color: #777; }
[data-theme="dark"] .badge-ok { background: rgba(34,197,94,.18); color: #4ade80; }
[data-theme="dark"] .badge-muted { background: rgba(148,163,184,.18); color: #94a3b8; }
.proj-member-list { display: flex; flex-direction: column; gap: 8px; max-height: 360px; overflow-y: auto; padding-right: 2px; }
.proj-member-row { display: flex; align-items: center; gap: 12px; border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; font-size: 13px; background: var(--panel); transition: border-color 0.15s, box-shadow 0.15s; }
.proj-member-row:hover { border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }
[data-theme="dark"] .proj-member-row:hover { box-shadow: 0 0 0 3px rgba(59,130,246,.18); }
.proj-member-info { flex: 1; min-width: 0; }
.proj-member-name { font-weight: 500; color: var(--ink); display: flex; align-items: center; gap: 8px; }
.proj-member-meta { font-size: 11px; color: var(--muted); margin-top: 2px; }
/* 头像复用系统 .avatar（实心品牌蓝圆 + 白字），保持全局一致 */
.proj-member-row .avatar { width: 34px; height: 34px; font-size: 14px; flex: 0 0 auto; }
.proj-member-row .btn { flex: 0 0 auto; }
.proj-member-empty { padding: 22px 12px; text-align: center; color: var(--muted); font-size: 13px; border: 1px dashed var(--line); border-radius: 10px; background: transparent; }
.proj-member-empty-icon { font-size: 24px; display: block; margin-bottom: 4px; opacity: 0.5; }
/* ===== 项目成员弹窗：标题/分区（对齐系统 modal / avatar / tag-role 规范）===== */
.proj-member-box { width: 560px; max-width: 100%; padding: 22px 24px 20px; }
.proj-modal-title { margin: 0 0 4px; font-size: 16px; font-weight: 700; color: var(--ink); display: flex; align-items: center; gap: 8px; padding-right: 32px; }
.proj-member-sub { font-size: 12px; color: var(--muted); margin: 0 0 18px; line-height: 1.5; }
.proj-section { margin-bottom: 16px; }
.proj-section-title { font-size: 13px; font-weight: 600; color: var(--ink); margin-bottom: 8px; display: flex; align-items: center; gap: 6px; }
.proj-section-count { font-size: 11px; color: var(--muted); background: var(--brand-soft); border-radius: 10px; padding: 1px 8px; font-weight: 500; }
.proj-section-hint { font-size: 12px; color: var(--muted); margin: 0 0 12px; line-height: 1.55; }
.proj-add-row { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.proj-field-label { font-size: 12px; color: var(--muted); flex: 0 0 44px; }
.proj-member-select { flex: 1; min-width: 0; }
.proj-role-radio { display: inline-flex; gap: 14px; align-items: center; flex: 1; }
.proj-role-opt { display: inline-flex; align-items: center; gap: 5px; font-size: 13px; color: var(--ink); cursor: pointer; user-select: none; }
.proj-role-opt input { accent-color: var(--brand); }
.proj-add-btn { flex: 0 0 auto; margin-left: auto; }
/* ===== 项目空间弹窗（新建/编辑项目 + 成员管理）：层级高于设置面板蒙层 ===== */
#projMemberMask { z-index: 1200; }
.proj-edit-mask { z-index: 1200; }
.proj-edit-dialog { width: 460px; max-width: 100%; }
.proj-edit-dialog h3 { margin: 0 0 6px; display: flex; align-items: center; gap: 8px; }
.proj-edit-dialog .hint { font-size: 12px; color: var(--muted); margin: 0 0 16px; }
.proj-edit-dialog .field { margin-bottom: 14px; }
.proj-edit-dialog .field label { display: block; font-size: 13px; font-weight: 500; margin-bottom: 6px; color: var(--ink); }
.proj-edit-dialog .footer { display: flex; justify-content: flex-end; gap: 10px; margin-top: 20px; padding-top: 14px; border-top: 1px solid var(--line); }
/* ===== B2 会话管理 ===== */
.session-list { display: flex; flex-direction: column; gap: 6px; max-height: 420px; overflow-y: auto; }
.session-row { display: flex; align-items: center; gap: 8px; border: 1px solid var(--line,#eee); border-radius: 8px; padding: 8px 10px; font-size: 13px; }
.session-row .plan-badge { margin-left: 0; flex: 0 0 auto; }

/* AI 工具调用日志 */
.agent-tools-log { display:flex; flex-direction:column; gap:6px; margin-bottom:10px; padding:8px 10px; background: color-mix(in srgb, var(--brand,#0B5CAD) 5%, var(--panel)); border:1px solid var(--line); border-radius:10px; }
.agent-tools-log::before { content:'🛠 工具调用'; display:block; font-size:11px; font-weight:700; color:var(--brand,#0B5CAD); margin-bottom:4px; }
.agent-tool-item { display:flex; align-items:flex-start; gap:8px; padding:6px 8px; background:var(--bg); border-radius:6px; font-size:11.5px; border-left:3px solid var(--brand,#0B5CAD); }
.agent-tool-item.pending { border-left-color:#f59e0b; }
.agent-tool-name { flex:0 0 auto; font-weight:600; color:#0B5CAD; white-space:nowrap; background:#EFF4FA; padding:1px 6px; border-radius:4px; }
.agent-tool-res { flex:1 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--muted); font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.agent-tool-status { flex:0 0 auto; font-size:10px; padding:1px 6px; border-radius:999px; background:#dcfce7; color:#166534; font-weight:600; }
.agent-tool-item.pending .agent-tool-status { background:#fef3c7; color:#92400e; }
.agent-debug-tools { display:inline-flex; align-items:center; gap:4px; font-size:12px; color:var(--muted,#5a6775); margin-right:6px; white-space:nowrap; }

/* AI 写操作二次确认卡片 */
.agent-confirm-card { margin:10px 0 6px; padding:12px 14px; background:#FDF6E3; border:1px solid #EFD9A7; border-radius:10px; }
.agent-confirm-preview { font-size:13px; color:#5a4a1a; line-height:1.5; }
.agent-confirm-card .row { margin-top:10px; }
.agent-confirm-card .btn.sm { padding: 5px 12px; font-size: 12px; }

/* AI 工具勾选区（三期） */
.agent-tool-chk { display:inline-flex; align-items:center; gap:6px; font-size:12px; padding:5px 10px; border:1px solid var(--line); border-radius:8px; cursor:pointer; background:var(--panel); transition:border-color .15s, background .15s; }
.agent-tool-chk:hover { border-color:#0B5CAD; background:var(--bg); }
.agent-tool-chk input { accent-color:#0B5CAD; }

/* ===== GoScanCloud IoT 设备联动面板 ===== */
.iot-conn-badge { font-size: 12px; padding: 4px 10px; border-radius: 999px; border: 1px solid transparent; white-space: nowrap; }
.iot-conn-badge.is-ok { background: #e6f4ea; color: #1a7f37; border-color: #bfe3c9; }
.iot-conn-badge.is-err { background: #fdecec; color: #c0392b; border-color: #f5c6c6; }
.iot-conn-badge.is-off { background: #eef1f5; color: #6b7785; border-color: #dde3ea; }
.iot-banner { margin: 12px 0; padding: 10px 14px; border-radius: 10px; font-size: 13px; }
.iot-banner.is-err { background: #fdecec; color: #c0392b; }
.iot-banner.is-off { background: #eef1f5; color: #6b7785; }
.iot-layout { display: grid; grid-template-columns: 320px 1fr; gap: 16px; padding: 14px; align-items: start; }
.iot-devlist { display: flex; flex-direction: column; gap: 8px; max-height: 66vh; overflow: auto; }
.iot-dev-card { border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; cursor: pointer; background: var(--panel); transition: border-color .15s, background .15s; }
.iot-dev-card:hover { border-color: #0B5CAD; }
.iot-dev-card.active { border-color: #0B5CAD; background: #eef4fb; }
.iot-dev-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.iot-dev-top b { font-size: 14px; color: var(--text); }
.iot-dev-meta { font-size: 12px; color: var(--muted); margin-top: 3px; }
.iot-detail { border: 1px solid var(--line); border-radius: 12px; padding: 14px 16px; background: var(--panel); min-height: 200px; }
.iot-detail-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.iot-detail-title { display: flex; align-items: center; gap: 8px; font-size: 16px; }
.iot-detail-meta { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 8px 0 14px; }
.iot-detail-meta > div { font-size: 12px; }
.iot-detail-meta .m-k { color: var(--muted); margin-right: 6px; }
.iot-detail-meta .m-v { color: var(--text); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.iot-st-badge { font-size: 11px; padding: 2px 8px; border-radius: 999px; }
.iot-st-badge.is-on { background: #e6f4ea; color: #1a7f37; }
.iot-st-badge.is-off { background: #eef1f5; color: #6b7785; }
.iot-section-h { font-size: 13px; font-weight: 600; color: var(--section-color, #0B5CAD); margin: 14px 0 8px; border-left: 3px solid var(--section-color, #0B5CAD); padding-left: 8px; }
.iot-tp { display: flex; flex-direction: column; gap: 4px; max-height: 320px; overflow: auto; }
.iot-tp-row { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 12px; padding: 5px 8px; border-radius: 6px; background: var(--bg); border: 1px solid var(--line); }
.iot-tp-k { color: var(--muted); }
.iot-tp-v { color: var(--text); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.iot-cmd-box { display: flex; flex-direction: column; gap: 8px; max-width: 460px; }
.iot-cmd-box .input { width: 100%; }
.iot-cmd-result { font-size: 12px; color: var(--muted); min-height: 16px; word-break: break-all; }
[data-theme="dark"] .iot-conn-badge.is-ok { background: rgba(26,127,55,.22); color: #7ee2a0; }
[data-theme="dark"] .iot-conn-badge.is-err { background: rgba(192,57,43,.22); color: #ff9b91; }
[data-theme="dark"] .iot-conn-badge.is-off { background: rgba(255,255,255,.08); color: #aab2bd; }
[data-theme="dark"] .iot-banner.is-err { background: rgba(192,57,43,.18); color: #ff9b91; }
[data-theme="dark"] .iot-banner.is-off { background: rgba(255,255,255,.06); color: #aab2bd; }
[data-theme="dark"] .iot-dev-card.active { background: rgba(11,92,173,.18); }
[data-theme="dark"] .iot-tp-row { background: rgba(255,255,255,.04); }

/* === 深色主题：工具栏次按钮（无 primary/danger 修饰）原本用 --section-color（蓝）作字色，
   在深色背景下（var(--panel)=#171c2b）字色对比度不足 → 提亮字色 + 加深背景 === */
[data-theme="dark"] .toolbar .btn:not(.primary):not(.danger) {
  background: color-mix(in srgb, var(--section-color, var(--brand)) 16%, var(--panel));
  color: color-mix(in srgb, var(--section-color, var(--brand)) 70%, #ffffff);
  border-color: color-mix(in srgb, var(--section-color, var(--brand)) 38%, transparent);
}
[data-theme="dark"] .toolbar .btn:not(.primary):not(.danger):hover {
  background: color-mix(in srgb, var(--section-color, var(--brand)) 24%, var(--panel));
  color: color-mix(in srgb, var(--section-color, var(--brand)) 55%, #ffffff);
  border-color: var(--section-color, var(--brand));
}
/* 编辑界面（modal、sop/wf inspector）次按钮同步修复 — 与工具栏同等提亮逻辑 */
[data-theme="dark"] .modal .btn:not(.primary):not(.danger),
[data-theme="dark"] .sop-inspector-form .btn:not(.primary):not(.danger),
[data-theme="dark"] .wf-inspector-form .btn:not(.primary):not(.danger) {
  background: color-mix(in srgb, var(--brand) 16%, var(--panel));
  color: color-mix(in srgb, var(--brand) 70%, #ffffff);
  border-color: color-mix(in srgb, var(--brand) 38%, transparent);
}
[data-theme="dark"] .modal .btn:not(.primary):not(.danger):hover,
[data-theme="dark"] .sop-inspector-form .btn:not(.primary):not(.danger):hover,
[data-theme="dark"] .wf-inspector-form .btn:not(.primary):not(.danger):hover {
  background: color-mix(in srgb, var(--brand) 24%, var(--panel));
  color: color-mix(in srgb, var(--brand) 55%, #ffffff);
  border-color: var(--brand);
}



/* ==== 移动端侧栏抽屉 + URL case modal 单列（2026-08-24 追加） ==== */
@media (max-width: 768px) {
  .sidebar {
    position: fixed;
    top: 0; left: 0; bottom: 0;
    width: 250px;
    max-width: 85vw;
    transform: translateX(-100%);
    transition: transform .25s ease;
    z-index: 60;
    box-shadow: 0 12px 40px rgba(0,0,0,.30);
  }
  body.sidebar-open-mobile .sidebar { transform: translateX(0); }
  body.sidebar-open-mobile { overflow: hidden; }
  body.sidebar-open-mobile::after {
    content: '';
    position: fixed; inset: 0;
    background: rgba(0,0,0,.42);
    z-index: 55;
    animation: gst-fade-in .18s ease;
  }
  body.sidebar-open-mobile .mobile-menu-trigger { display: none; }
  .workspace { margin-left: 0 !important; }
  /* 顶栏镂空，给浮动按钮让路 */
  .topbar { padding-left: 56px; }
}
@media (max-width: 720px) {
  /* 最佳实践编辑：URL/类型+状态 双行改成单列 */
  #urlCaseMask .field input.input,
  #urlCaseMask .field select.input,
  #urlCaseMask .field textarea.textarea {
    width: 100%;
    min-width: 0;
  }
  /* 覆盖所有 .row（含 inline gap:10 / flex:1），mobile 单列布局 */
  #urlCaseMask .row {
    flex-direction: column !important;
    gap: 12px !important;
  }
  #urlCaseMask .row > .field[style*="flex:"] {
    flex: 1 1 auto !important;
    min-width: 0 !important;
  }
}
@keyframes gst-fade-in { from { opacity: 0 } to { opacity: 1 } }
