* { margin: 0; padding: 0; box-sizing: border-box; }
:root {
  --color-bg: #f5f6f7;
  --color-white: #ffffff;
  --color-primary: #3370ff;
  --color-primary-light: #e8f0fe;
  --color-primary-hover: #245bdb;
  --color-text: #1f2329;
  --color-text-secondary: #646a73;
  --color-text-tertiary: #8f959e;
  --color-text-quaternary: #b2b5bd;
  --color-border: #e0e0e0;
  --color-border-light: #eceef0;
  --color-bg-sidebar: #f7f8fa;
  --color-bg-hover: #f0f1f5;
  --color-bg-active: #e8f0fe;
  --color-danger: #f54a4a;
  --color-success: #34c759;
  --color-warning: #ff9d00;
  --color-sidebar-dark: #f0f1f5;
  --color-sidebar-text: #8f959e;
  --color-sidebar-hover: #e8eaed;
  --color-sidebar-active: #e8f0fe;
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.04);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.08);
  --shadow-lg: 0 8px 24px rgba(0,0,0,0.12);
  --page-nav-width: 52px;
  --func-nav-width: 160px;
  --tool-bar-width: 52px;
  --tool-panel-width: 280px;
  --transition: all 0.2s ease;
}
body {
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", sans-serif;
  background: var(--color-bg);
  color: var(--color-text);
  height: 100vh;
  overflow: hidden;
  -webkit-font-smoothing: antialiased;
}

/* ===== Login Page ===== */
.login-page {
  display: flex; align-items: center; justify-content: center;
  height: 100vh;
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}
.login-card {
  background: white; border-radius: var(--radius-xl); padding: 40px 36px;
  width: 400px; box-shadow: var(--shadow-lg);
}
.login-logo {
  width: 48px; height: 48px; border-radius: 12px;
  background: linear-gradient(135deg, #3370ff, #6e56cf);
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 20px; color: white;
}
.login-card h1 { font-size: 22px; font-weight: 600; text-align: center; margin-bottom: 6px; color: var(--color-text); }
.login-card .subtitle { text-align: center; color: var(--color-text-tertiary); font-size: 14px; margin-bottom: 32px; }
.login-card .form-group { margin-bottom: 20px; }
.login-card label { display: block; font-size: 13px; font-weight: 500; color: var(--color-text-secondary); margin-bottom: 8px; }
.login-card input {
  width: 100%; padding: 10px 14px; border: 1.5px solid var(--color-border);
  border-radius: var(--radius-md); font-size: 14px; outline: none;
  transition: var(--transition); background: var(--color-bg);
}
.login-card input:focus { border-color: var(--color-primary); background: white; box-shadow: 0 0 0 3px rgba(51,112,255,0.1); }
.login-card .btn-login {
  width: 100%; padding: 12px; background: var(--color-primary); color: white;
  border: none; border-radius: var(--radius-md); font-size: 15px; font-weight: 500;
  cursor: pointer; margin-top: 8px; transition: var(--transition);
}
.login-card .btn-login:hover { background: var(--color-primary-hover); }
.login-card .error-msg { color: var(--color-danger); font-size: 13px; text-align: center; margin-top: 12px; display: none; }

/* ===== Modals ===== */
/* modal-overlay moved to Modal section below */
/* modal-overlay.active moved to Modal section below */
.modal-card { background: white; border-radius: var(--radius-lg); padding: 28px 32px; width: 400px; box-shadow: var(--shadow-lg); }
.modal-card.wide { width: 560px; }
.modal-card h3 { font-size: 17px; font-weight: 600; margin-bottom: 20px; }
.modal-card .form-group { margin-bottom: 16px; }
.modal-card label { display: block; font-size: 13px; font-weight: 500; color: var(--color-text-secondary); margin-bottom: 6px; }
.modal-card input, .modal-card textarea, .modal-card select {
  width: 100%; padding: 9px 12px; border: 1.5px solid var(--color-border);
  border-radius: var(--radius-sm); font-size: 14px; outline: none;
  background: var(--color-bg); transition: var(--transition);
  font-family: inherit;
}
.modal-card input:focus, .modal-card textarea:focus, .modal-card select:focus { border-color: var(--color-primary); background: white; box-shadow: 0 0 0 3px rgba(51,112,255,0.1); }
.modal-card textarea { resize: vertical; min-height: 100px; }
.modal-card .btn-row { display: flex; gap: 10px; margin-top: 22px; }
.modal-card .btn-row button { flex: 1; padding: 10px; border-radius: var(--radius-md); border: none; font-size: 14px; font-weight: 500; cursor: pointer; transition: var(--transition); }
.modal-card .btn-primary { background: var(--color-primary); color: white; }
.modal-card .btn-primary:hover { background: var(--color-primary-hover); }
.modal-card .btn-secondary { background: var(--color-bg); color: var(--color-text); border: 1px solid var(--color-border); }
.modal-card .btn-secondary:hover { background: var(--color-bg-hover); }
.modal-card .error-msg { color: var(--color-danger); font-size: 12px; margin-top: 8px; display: none; }

/* ===== Main Layout ===== */
.main-layout { display: none; height: 100vh; flex-direction: row; }
.main-layout.active { display: flex; }

/* Page Navigation */
.page-nav {
  width: var(--page-nav-width); background: var(--color-sidebar-dark);
  display: flex; flex-direction: column; align-items: center;
  padding: 16px 0; flex-shrink: 0; gap: 4px;
}
.page-nav .nav-logo {
  width: 30px; height: 30px; border-radius: 8px;
  background: #e8eaed;
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 16px; color: #1f2329; font-weight: 700; font-size: 13px;
}
.page-nav .nav-item {
  width: 40px; height: 40px; border-radius: var(--radius-md);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; color: var(--color-sidebar-text); transition: var(--transition);
  position: relative;
}
.page-nav .nav-item:hover { background: var(--color-sidebar-hover); color: var(--color-text); }
.page-nav .nav-item.active { background: var(--color-sidebar-active); color: var(--color-primary); }
.page-nav .nav-item svg { width: 20px; height: 20px; }
.page-nav .nav-item .tooltip {
  display: none; position: absolute; left: 52px;
  background: #1f2329; color: #fff;
  padding: 5px 12px; border-radius: var(--radius-sm);
  font-size: 12px; white-space: nowrap; z-index: 10;
  box-shadow: var(--shadow-md);
}
.page-nav .nav-item:hover .tooltip { display: block; }
.page-nav .nav-spacer { flex: 1; }
.page-nav .user-bar { width: 100%; padding: 6px 0; justify-content: center; }
.page-nav .user-bar .nav-item { flex-shrink: 0; }

/* Functional Navigation */
.func-nav {
  width: var(--chat-nav-width, var(--func-nav-width)); /* 侧栏拖拽（2026-09-09接通）：优先用户拖宽，默认160 */
  position: relative; /* 拖拽把手 absolute 定位锚点 */
  background: var(--color-white);
  border-right: 1px solid var(--color-border-light);
  display: flex; flex-direction: column; flex-shrink: 0;
}
.func-nav .func-header { padding: 18px 16px 14px; font-size: 15px; font-weight: 600; color: var(--color-text); display: flex; align-items: center; justify-content: space-between; }

/* ===== 侧栏右缘拖拽把手（JS 2026-09-04埋点，CSS 2026-09-09接通）=====
   7px 透明命中带全高，hover/拖动显示 2px 蓝线（主色）；140~480px 限幅+localStorage记忆+双击复位由 chat.js 负责 */
#navResizeHandle {
  position: absolute; top: 0; right: 0;
  width: 7px; height: 100%;
  cursor: col-resize; z-index: 10;
}
#navResizeHandle::after {
  content: ''; position: absolute; top: 0; right: 2.5px;
  width: 2px; height: 100%;
  background: transparent; transition: background .15s ease;
}
#navResizeHandle:hover::after,
#navResizeHandle.on::after { background: var(--color-primary); }
body.nav-resizing, body.nav-resizing * { user-select: none !important; -webkit-user-select: none !important; }

/* Func Nav Collapse */
.func-nav.collapsed { width: 52px; }
.func-nav.collapsed .user-bar,
.func-nav.collapsed .search-box { display: none; }
.func-nav.collapsed .func-header { padding: 14px 0 10px; justify-content: center; }
.func-nav.collapsed .func-header .func-header-title { display: none; }
.func-nav.collapsed .func-collapse-btn svg { transform: rotate(180deg); }
.func-nav.collapsed .func-collapse-btn .tooltip { display: none; position: absolute; left: 52px; top: 50%; transform: translateY(-50%); background: #1f2329; color: #fff; padding: 5px 12px; border-radius: var(--radius-sm); font-size: 12px; white-space: nowrap; z-index: 10; box-shadow: var(--shadow-md); }
.func-nav.collapsed .func-collapse-btn:hover .tooltip { display: block; }
.func-nav.collapsed .func-list { padding: 0 6px 8px; overflow: visible !important; }
.func-nav.collapsed .perf-cat-header { display: none; }
.func-nav.collapsed .perf-cat-items { max-height: none !important; overflow: visible; }
.func-nav.collapsed .perf-cat-items .func-item { padding-left: 0; }
.func-nav.collapsed .func-item {
  width: 40px; height: 40px; padding: 0; margin: 0 auto 4px;
  display: flex; align-items: center; justify-content: center;
  border-radius: var(--radius-md); position: relative;
}
.func-nav.collapsed .func-item .item-main { display: none; }
.func-nav.collapsed .func-item .item-icon {
  display: flex; align-items: center; justify-content: center;
  font-size: 18px;
}
.func-nav.collapsed .func-item .item-tooltip {
  display: none; position: absolute; left: 46px; top: 50%; transform: translateY(-50%);
  background: #1f2329; color: #fff; padding: 5px 12px; border-radius: var(--radius-sm);
  font-size: 12px; white-space: nowrap; z-index: 10; box-shadow: var(--shadow-md);
}
.func-nav.collapsed .func-item:hover .item-tooltip { display: block; }
.func-nav .func-item .item-icon { display: none; }
.func-nav .func-item .item-tooltip { display: none; }

.func-collapse-btn {
  width: 28px; height: 28px; border-radius: var(--radius-sm);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; color: var(--color-text-tertiary); transition: var(--transition);
  position: relative; flex-shrink: 0;
}
.func-collapse-btn:hover { background: var(--color-bg-hover); color: var(--color-text); }
.func-collapse-btn svg { width: 16px; height: 16px; transition: transform 0.2s; }
.func-collapse-btn .tooltip {
  display: none; position: absolute; right: 36px; top: 50%; transform: translateY(-50%);
  background: #1f2329; color: #fff;
  padding: 5px 12px; border-radius: var(--radius-sm);
  font-size: 12px; white-space: nowrap; z-index: 10; box-shadow: var(--shadow-md);
}
.func-collapse-btn:hover .tooltip { display: block; }

.func-nav .func-list { flex: 1; overflow-y: auto; padding: 0 8px 8px; }
.func-nav .func-item {
  padding: 10px 12px; border-radius: var(--radius-md);
  cursor: pointer; font-size: 14px; color: var(--color-text-secondary);
  transition: var(--transition); margin-bottom: 2px;
  display: flex; align-items: center; gap: 10px; line-height: 1.4;
}
.func-nav .func-item:hover { background: var(--color-bg-hover); color: var(--color-text); }
.func-nav .func-item.active { background: var(--color-bg-active); color: var(--color-primary); font-weight: 500; }
.func-nav .func-item .item-main { flex: 1; overflow: hidden; }
.func-nav .func-item .item-title { font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.func-nav .func-item .item-meta { font-size: 11px; color: var(--color-text-quaternary); margin-top: 2px; }
.perf-cat-header {
  display: flex; align-items: center; padding: 10px 12px; cursor: pointer;
  font-size: 13px; font-weight: 600; color: var(--color-text-secondary);
  border-radius: 8px; margin: 4px 0 2px; user-select: none;
  transition: background 0.15s;
}
.perf-cat-header:hover { background: var(--color-bg-hover); }
.perf-cat-header .cat-arrow { margin-right: 6px; font-size: 10px; transition: transform 0.2s; }
.perf-cat-header.collapsed .cat-arrow { transform: rotate(-90deg); }
.perf-cat-items { overflow: hidden; max-height: 500px; transition: max-height 0.25s ease; }
.perf-cat-items.collapsed { max-height: 0; }
.perf-cat-items .func-item { padding-left: 28px; }

/* Workspace */
.workspace { flex: 1; display: flex; flex-direction: column; overflow: hidden; background: var(--color-bg); }
.workspace-header {
  padding: 14px 20px; background: var(--color-white);
  border-bottom: 1px solid var(--color-border-light);
  display: flex; align-items: center; gap: 12px; flex-shrink: 0;
}
.workspace-header h2 { font-size: 16px; font-weight: 600; flex: 1; }
.workspace-content { flex: 1; overflow-y: auto; padding: 0; position: relative; }

/* Tool Bar (right) */
.tool-bar {
  width: var(--tool-bar-width); background: var(--color-bg-sidebar);
  border-left: 1px solid var(--color-border-light);
  display: flex; flex-direction: column; align-items: center;
  padding: 16px 0; gap: 8px; flex-shrink: 0;
}
.tool-bar .tool-item {
  width: 40px; height: 40px; border-radius: var(--radius-md);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; color: var(--color-text-tertiary); transition: var(--transition);
  position: relative;
}
.tool-bar .tool-item:hover { background: var(--color-bg-hover); color: var(--color-text); }
.tool-bar .tool-item.active { background: var(--color-bg-active); color: var(--color-primary); }
.tool-bar .tool-item svg { width: 20px; height: 20px; }
.tool-bar .tool-item .tooltip {
  display: none; position: absolute; right: 52px;
  background: #1f2329; color: #fff;
  padding: 5px 12px; border-radius: var(--radius-sm);
  font-size: 12px; white-space: nowrap; z-index: 10;
}
.tool-bar .tool-item:hover .tooltip { display: block; }

/* Tool Panel */
.tool-panel {
  width: 0; overflow: hidden; background: var(--color-white);
  border-left: 1px solid var(--color-border-light);
  transition: width 0.25s ease; flex-shrink: 0; display: flex; flex-direction: column;
}
.tool-panel.open { width: var(--tool-panel-width); }
.tool-panel .panel-header {
  padding: 16px; font-size: 14px; font-weight: 600;
  border-bottom: 1px solid var(--color-border-light);
}
.tool-panel .panel-content { flex: 1; overflow-y: auto; min-height: 0; padding: 20px 16px; }

/* User bar */
.user-bar {
  padding: 12px 16px; border-top: 1px solid var(--color-border-light);
  display: flex; align-items: center; gap: 10px;
}
.user-bar .avatar {
  width: 32px; height: 32px; border-radius: 50%;
  background: linear-gradient(135deg, #3370ff, #6e56cf);
  display: flex; align-items: center; justify-content: center;
  color: white; font-size: 13px; font-weight: 600; flex-shrink: 0;
}
.user-bar .info { flex: 1; overflow: hidden; }
.user-bar .info .name { font-size: 13px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.user-bar .info .role-tag { font-size: 11px; color: var(--color-text-quaternary); }
.user-bar .logout {
  cursor: pointer; color: var(--color-text-quaternary); font-size: 12px;
  padding: 4px 8px; border-radius: var(--radius-sm); transition: var(--transition);
}
.user-bar .logout:hover { color: var(--color-danger); background: rgba(245,74,74,0.08); }

/* Chat styles */
.chat-container { display: flex; flex-direction: column; height: 100%; }
.message-list { flex: 1; overflow-y: auto; padding: 16px 20px; }
.message-item { display: flex; gap: 10px; margin-bottom: 16px; }
.message-item .avatar {
  width: 30px; height: 30px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 600; color: white; flex-shrink: 0;
}
/* v170: 旧avatar配色已删（与L556+新定义打架，实际生效始终是新定义；聊天流头像改由chat.js botAvatarHtml按身份色渲染） */
.message-item .bubble {
  max-width: 70%; padding: 10px 14px; border-radius: var(--radius-lg);
  font-size: 14px; line-height: 1.6; word-break: break-word;
}
.message-item .bubble.bot { background: var(--color-white); border: 1px solid var(--color-border-light); }
.message-item .bubble.user { background: var(--color-primary-light); color: var(--color-text); }
.message-item .bubble .meta { font-size: 11px; color: var(--color-text-quaternary); margin-top: 4px; }
.message-item .bubble img { max-width: 100%; border-radius: var(--radius-sm); margin-top: 6px; }

/* Management page */
.mgmt-content { padding: 20px; }
.mgmt-toolbar { margin-bottom: 16px; }
.btn-add {
  padding: 8px 16px; background: var(--color-primary); color: white;
  border: none; border-radius: var(--radius-md); font-size: 13px;
  font-weight: 500; cursor: pointer; transition: var(--transition);
}
.btn-add:hover { background: var(--color-primary-hover); }
.mgmt-table { width: 100%; border-collapse: collapse; background: var(--color-white); border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-sm); }
.mgmt-table th { background: var(--color-bg-sidebar); padding: 12px 16px; text-align: left; font-size: 13px; font-weight: 600; color: var(--color-text-secondary); border-bottom: 1px solid var(--color-border-light); }
.mgmt-table th.th-group { background: var(--color-bg); font-size: 11px; text-transform: uppercase; letter-spacing: 0.5px; color: var(--color-text-tertiary); text-align: center; }
.mgmt-table td { padding: 12px 16px; font-size: 13px; border-bottom: 1px solid var(--color-border-light); color: var(--color-text-secondary); }
.mgmt-table tr:hover td { background: var(--color-bg-hover); }
.mgmt-btn { padding: 4px 10px; border: none; border-radius: var(--radius-sm); font-size: 12px; cursor: pointer; transition: var(--transition); }
.mgmt-btn-edit { background: var(--color-primary-light); color: var(--color-primary); }
.mgmt-btn-edit:hover { background: var(--color-primary); color: white; }
.mgmt-btn-reset { background: #fff7e6; color: var(--color-warning); }
.mgmt-btn-reset:hover { background: var(--color-warning); color: white; }
.mgmt-btn-del { background: #ffe8e8; color: var(--color-danger); }
.mgmt-btn-del:hover { background: var(--color-danger); color: white; }

/* Placeholder */
.placeholder-page { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; color: var(--color-text-tertiary); }
.placeholder-page .icon { width: 64px; height: 64px; border-radius: 16px; background: var(--color-bg); display: flex; align-items: center; justify-content: center; margin-bottom: 16px; }
.placeholder-page .icon svg { width: 32px; height: 32px; stroke: var(--color-text-quaternary); }
.placeholder-page .title { font-size: 16px; font-weight: 500; margin-bottom: 6px; color: var(--color-text-secondary); }
.placeholder-page .desc { font-size: 13px; }

/* ===== Forum Styles ===== */
.forum-container { display: flex; flex-direction: column; height: 100%; }
.forum-tabs {
  display: flex; gap: 0; background: var(--color-white);
  border-bottom: 1px solid var(--color-border-light); flex-shrink: 0;
  padding: 0 20px; align-items: center;
}
.forum-tab {
  padding: 14px 20px; font-size: 14px; font-weight: 500;
  color: var(--color-text-secondary); cursor: pointer;
  border-bottom: 2px solid transparent; transition: var(--transition);
}
.forum-tab:hover { color: var(--color-text); }
.forum-tab.active { color: var(--color-primary); border-bottom-color: var(--color-primary); }
.forum-tab-spacer { flex: 1; }
.forum-new-btn {
  padding: 6px 14px; background: var(--color-primary); color: white;
  border: none; border-radius: var(--radius-md); font-size: 13px;
  font-weight: 500; cursor: pointer; transition: var(--transition);
  margin: 8px 0;
}
.forum-new-btn:hover { background: var(--color-primary-hover); }
.forum-list { flex: 1; overflow-y: auto; padding: 16px 20px; }
.forum-post-card {
  background: var(--color-white); border-radius: var(--radius-lg);
  padding: 18px 20px; margin-bottom: 12px; cursor: pointer;
  box-shadow: var(--shadow-sm); transition: var(--transition);
  border: 1px solid var(--color-border-light);
}
.forum-post-card:hover { box-shadow: var(--shadow-md); border-color: var(--color-border); }
.forum-post-card.pinned { border-left: 3px solid var(--color-primary); }
.forum-post-header { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.forum-post-header .avatar {
  width: 32px; height: 32px; border-radius: 50%;
  background: linear-gradient(135deg, #3370ff, #6e56cf);
  display: flex; align-items: center; justify-content: center;
  color: white; font-size: 12px; font-weight: 600; flex-shrink: 0;
}
.forum-post-header .author-info { flex: 1; }
.forum-post-header .author-name { font-size: 13px; font-weight: 500; color: var(--color-text); }
.forum-post-header .post-time { font-size: 11px; color: var(--color-text-quaternary); }
.forum-post-header .pin-badge {
  font-size: 11px; color: var(--color-primary); background: var(--color-primary-light);
  padding: 2px 8px; border-radius: 10px; font-weight: 500;
}
.forum-post-header .category-badge {
  font-size: 11px; padding: 2px 8px; border-radius: 10px; font-weight: 500;
}
.category-badge.讨论区 { background: #e8f0fe; color: #3370ff; }
.category-badge.问答区 { background: #e6f7ee; color: #34c759; }
.forum-post-title { font-size: 15px; font-weight: 600; color: var(--color-text); margin-bottom: 6px; line-height: 1.4; }
.forum-post-excerpt { font-size: 13px; color: var(--color-text-secondary); line-height: 1.6; margin-bottom: 10px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.forum-post-images { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
.forum-post-images img { width: 100px; height: 100px; object-fit: cover; border-radius: var(--radius-sm); }
.forum-post-footer { display: flex; gap: 20px; align-items: center; }
.forum-action {
  display: flex; align-items: center; gap: 4px;
  font-size: 12px; color: var(--color-text-tertiary); cursor: pointer;
  padding: 4px 8px; border-radius: var(--radius-sm); transition: var(--transition);
}
.forum-action:hover { background: var(--color-bg-hover); color: var(--color-text-secondary); }
.forum-action.liked { color: var(--color-danger); }
.forum-action.collected { color: var(--color-warning); }
.forum-action svg { width: 14px; height: 14px; }

/* Post detail */
.forum-detail { display: flex; flex-direction: column; height: 100%; }
.forum-detail-header {
  padding: 14px 20px; background: var(--color-white);
  border-bottom: 1px solid var(--color-border-light);
  display: flex; align-items: center; gap: 12px; flex-shrink: 0;
}
.forum-detail-header .back-btn {
  width: 32px; height: 32px; border-radius: var(--radius-md);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; color: var(--color-text-secondary); transition: var(--transition);
}
.forum-detail-header .back-btn:hover { background: var(--color-bg-hover); color: var(--color-text); }
.forum-detail-body { flex: 1; overflow-y: auto; padding: 20px; }
.forum-detail-content { background: var(--color-white); border-radius: var(--radius-lg); padding: 24px; box-shadow: var(--shadow-sm); margin-bottom: 20px; }
.forum-detail-content .post-title { font-size: 20px; font-weight: 600; margin-bottom: 12px; line-height: 1.4; }
.forum-detail-content .post-meta { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; font-size: 13px; color: var(--color-text-tertiary); }
.forum-detail-content .post-body { font-size: 14px; line-height: 1.8; color: var(--color-text); white-space: pre-wrap; }
.forum-detail-content .post-images { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 16px; }
.forum-detail-content .post-images img { max-width: 300px; max-height: 300px; border-radius: var(--radius-md); object-fit: cover; }
.forum-detail-actions { display: flex; gap: 16px; margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--color-border-light); }
.forum-detail-actions .forum-action { font-size: 13px; padding: 6px 12px; }
.forum-detail-actions .forum-action svg { width: 16px; height: 16px; }

/* Comments */
.comments-section { background: var(--color-white); border-radius: var(--radius-lg); padding: 20px 24px; box-shadow: var(--shadow-sm); }
.comments-section h4 { font-size: 15px; font-weight: 600; margin-bottom: 16px; }
.comment-input-box { display: flex; gap: 10px; margin-bottom: 20px; }
.comment-input-box textarea {
  flex: 1; padding: 10px 12px; border: 1.5px solid var(--color-border);
  border-radius: var(--radius-md); font-size: 13px; outline: none;
  resize: none; min-height: 60px; font-family: inherit;
  transition: var(--transition); background: var(--color-bg);
}
.comment-input-box textarea:focus { border-color: var(--color-primary); background: white; box-shadow: 0 0 0 3px rgba(51,112,255,0.1); }
.comment-input-box .btn-comment {
  padding: 8px 16px; background: var(--color-primary); color: white;
  border: none; border-radius: var(--radius-md); font-size: 13px;
  font-weight: 500; cursor: pointer; align-self: flex-end; transition: var(--transition);
}
.comment-input-box .btn-comment:hover { background: var(--color-primary-hover); }
.comment-item { padding: 12px 0; border-bottom: 1px solid var(--color-border-light); }
.comment-item:last-child { border-bottom: none; }
.comment-item .comment-header { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.comment-item .comment-avatar {
  width: 28px; height: 28px; border-radius: 50%;
  background: linear-gradient(135deg, #34c759, #30b350);
  display: flex; align-items: center; justify-content: center;
  color: white; font-size: 11px; font-weight: 600; flex-shrink: 0;
}
.comment-item .comment-name { font-size: 13px; font-weight: 500; color: var(--color-text); }
.comment-item .comment-time { font-size: 11px; color: var(--color-text-quaternary); }
.comment-item .comment-body { font-size: 13px; line-height: 1.6; color: var(--color-text); margin-left: 36px; }
.comment-item .comment-reply-btn { font-size: 12px; color: var(--color-text-tertiary); cursor: pointer; margin-left: 36px; margin-top: 4px; }
.comment-item .comment-reply-btn:hover { color: var(--color-primary); }
.comment-replies { margin-left: 36px; margin-top: 8px; padding-left: 12px; border-left: 2px solid var(--color-border-light); }
.comment-replies .comment-item { padding: 8px 0; }
.comment-replies .comment-item .comment-body { margin-left: 36px; }
.comment-replies .comment-item .comment-reply-btn { margin-left: 36px; }
.reply-hint { font-size: 12px; color: var(--color-text-tertiary); margin-bottom: 6px; display: flex; align-items: center; gap: 6px; }
.reply-hint .cancel-reply { color: var(--color-danger); cursor: pointer; font-size: 11px; }

/* Image upload preview */
.image-upload-area { margin-top: 8px; }
.image-preview-list { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
.image-preview-item { position: relative; width: 80px; height: 80px; }
.image-preview-item img { width: 100%; height: 100%; object-fit: cover; border-radius: var(--radius-sm); }
.image-preview-item .remove-img {
  position: absolute; top: -6px; right: -6px;
  width: 18px; height: 18px; border-radius: 50%;
  background: var(--color-danger); color: white;
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; cursor: pointer; line-height: 1;
}
.upload-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 12px; border: 1.5px dashed var(--color-border);
  border-radius: var(--radius-md); font-size: 12px;
  color: var(--color-text-tertiary); cursor: pointer; transition: var(--transition);
}
.upload-btn:hover { border-color: var(--color-primary); color: var(--color-primary); }
.upload-btn svg { width: 14px; height: 14px; }

/* Search */
.search-box {
  padding: 12px 16px; border-bottom: 1px solid var(--color-border-light);
}
.search-input-wrap {
  display: flex; align-items: center; gap: 8px;
  background: var(--color-bg); border-radius: var(--radius-md);
  padding: 8px 12px; border: 1.5px solid transparent; transition: var(--transition);
}
.search-input-wrap:focus-within { border-color: var(--color-primary); background: white; box-shadow: 0 0 0 3px rgba(51,112,255,0.1); }
.search-input-wrap svg { width: 16px; height: 16px; color: var(--color-text-quaternary); flex-shrink: 0; }
.search-input-wrap input { flex: 1; border: none; outline: none; background: transparent; font-size: 13px; color: var(--color-text); }

/* Toggle switch for anonymous */
.toggle-switch {
  position: relative; display: inline-block; width: 36px; height: 20px; flex-shrink: 0;
}
.toggle-switch input { opacity: 0; width: 0; height: 0; }
.toggle-slider {
  position: absolute; cursor: pointer; inset: 0;
  background: #ccc; border-radius: 20px; transition: 0.3s;
}
.toggle-slider:before {
  content: ""; position: absolute; height: 16px; width: 16px;
  left: 2px; bottom: 2px; background: white;
  border-radius: 50%; transition: 0.3s;
}
.toggle-switch input:checked + .toggle-slider { background: var(--color-primary); }
.toggle-switch input:checked + .toggle-slider:before { transform: translateX(16px); }
.anon-option {
  display: flex; align-items: center; gap: 8px;
  font-size: 13px; color: var(--color-text-secondary); margin-top: 8px; cursor: pointer;
  padding: 8px 12px; background: var(--color-bg); border-radius: var(--radius-md);
  transition: var(--transition); user-select: none;
}
.anon-option:hover { background: var(--color-bg-hover); }
.anon-option.active { background: var(--color-primary-light); color: var(--color-primary); }
.anon-real-name {
  font-size: 11px; color: var(--color-warning); background: #fff7e6;
  padding: 1px 6px; border-radius: 8px; margin-left: 4px;
}
.anon-avatar {
  background: #d1d5db !important; color: #6b7280 !important;
}
.anon-badge-inline {
  font-size: 11px; color: var(--color-text-tertiary); background: var(--color-bg);
  padding: 1px 6px; border-radius: 8px;
}

/* Chat Message Styles */
.message-item { display: flex; gap: 12px; margin-bottom: 16px; align-items: flex-start; }
.message-item .avatar { width: 30px; height: 30px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 500; flex-shrink: 0; }
.message-item .avatar.user { background: linear-gradient(135deg, #3370ff, #6e56cf); color: white; }
.message-item .avatar.bot { background: linear-gradient(135deg, #34c759, #30d158); color: white; }
.message-item .bubble { max-width: 92%; padding: 10px 14px; border-radius: 12px; font-size: 13px; line-height: 1.45; word-break: break-word; overflow-wrap: break-word; } /* v128: 宽度75→92/字号14→13/行高1.5→1.45 */
.message-item .bubble.user { background: #e3f2fd; color: #111; border: 1px solid #bbdefb; }
.message-item .bubble.bot { background: white; color: var(--color-text); border: 1px solid var(--color-border-light); overflow-x: auto; }
.message-item .bubble .meta { font-size: 11px; opacity: 0.7; margin-top: 4px; }
/* ===== Performance Page ===== */
.perf-page { padding: 20px; }
.perf-filter { display: flex; gap: 12px; margin-bottom: 20px; align-items: center; }
.perf-select { height: 36px; padding: 0 12px; border: 1px solid var(--color-border); border-radius: 6px; font-size: 14px; font-family: var(--font-family); background: #fff; color: var(--color-text-primary); outline: none; cursor: pointer; }
.perf-select:focus { border-color: var(--color-primary); }
.perf-btn { height: 36px; padding: 0 20px; background: var(--color-primary); color: #fff; border: none; border-radius: 6px; font-size: 14px; font-family: var(--font-family); cursor: pointer; transition: opacity .2s; }
.perf-btn:hover { opacity: .9; }
.perf-placeholder { text-align: center; padding: 60px 20px; color: var(--color-text-tertiary); font-size: 14px; }
.perf-loading { text-align: center; padding: 40px; color: var(--color-text-tertiary); font-size: 14px; }

.perf-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.perf-table th { background: #f5f6f7; padding: 6px 8px; text-align: left; font-weight: 500; color: var(--color-text-secondary); border-bottom: 1px solid var(--color-border); white-space: normal; text-align: center; }
.perf-table td { padding: 6px 8px; border-bottom: 1px solid var(--color-border); color: var(--color-text-primary); }
.perf-table td.num { text-align: right; font-variant-numeric: tabular-nums; }
.perf-table td.prod-name { max-width: 300px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.perf-table tbody tr:hover { background: #f0f1f2; }
.perf-status-ok { color: #00a874; }
.perf-status-miss { color: #f54a4a; }
.perf-status-pending { color: #ff8800; }
.perf-detail-btn { padding: 4px 12px; background: var(--color-primary); color: #fff; border: none; border-radius: 4px; font-size: 12px; cursor: pointer; }
.perf-detail-btn:hover { opacity: .9; }

.perf-detail { background: #fff; border-radius: 8px; padding: 20px; }
.perf-back { margin-bottom: 16px; }
.perf-back-btn { background: none; border: none; color: var(--color-primary); font-size: 14px; cursor: pointer; font-family: var(--font-family); }
.perf-back-btn:hover { opacity: .8; }
.perf-detail-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; padding-bottom: 16px; border-bottom: 1px solid var(--color-border); }
.perf-detail-header h3 { font-size: 18px; font-weight: 600; color: var(--color-text-primary); }
.perf-detail-staff { font-size: 13px; color: var(--color-text-secondary); }

.perf-section { margin-bottom: 24px; }
.perf-section h4 { font-size: 15px; font-weight: 600; color: var(--color-text-primary); margin-bottom: 12px; padding-left: 8px; border-left: 3px solid var(--color-primary); }

.perf-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px; }
.perf-gallery-item { border: 1px solid var(--color-border); border-radius: 8px; overflow: hidden; cursor: pointer; transition: box-shadow .2s; }
.perf-gallery-item:hover { box-shadow: 0 2px 8px rgba(0,0,0,.12); }
.perf-gallery-item img { width: 100%; height: 150px; object-fit: cover; display: block; }
.perf-gallery-label { display: block; padding: 6px 8px; font-size: 12px; color: var(--color-text-secondary); background: #f5f6f7; }

.perf-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 12px; }
.perf-card { background: #f5f6f7; border-radius: 8px; padding: 12px 16px; }
.perf-card.primary { background: rgba(51,112,255,.08); }
.perf-card.warn { background: rgba(255,136,0,.08); }
.perf-card-label { font-size: 12px; color: var(--color-text-secondary); margin-bottom: 4px; }
.perf-card-value { font-size: 18px; font-weight: 600; color: var(--color-text-primary); font-variant-numeric: tabular-nums; }

.perf-detail-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 8px; }

/* Performance Dashboard - New Styles */
.perf-upload-btn { background: #00a874 !important; margin-right: auto; }
.perf-upload-btn:hover { opacity: .9; }
.perf-period-btns { display: flex; gap: 0; }
.perf-period-btn { height: 36px; padding: 0 16px; border: 1px solid var(--color-border); background: #fff; color: var(--color-text-secondary); font-size: 13px; cursor: pointer; font-family: var(--font-family); transition: all .2s; }
.perf-period-btn:first-child { border-radius: 6px 0 0 6px; }
.perf-period-btn:last-child { border-radius: 0 6px 6px 0; border-left: none; }
.perf-period-btn.active { background: var(--color-primary); color: #fff; border-color: var(--color-primary); }
.func-nav .perf-cat-header svg { width: 16px; height: 16px; vertical-align: middle; margin-right: 6px; flex-shrink: 0; }
.func-nav .func-item svg { width: 16px; height: 16px; vertical-align: middle; margin-right: 6px; flex-shrink: 0; }
.perf-period-nav { display: flex; align-items: center; gap: 6px; }
.perf-nav-arrow { width: 28px; height: 28px; border: 1px solid var(--color-border); border-radius: 6px; background: #fff; cursor: pointer; color: var(--color-text-secondary); font-size: 12px; display: flex; align-items: center; justify-content: center; transition: all .2s; }
.perf-nav-arrow:hover { background: var(--color-bg-hover); color: var(--color-text); }
.perf-period-label { font-size: 13px; color: var(--color-text-secondary); min-width: 200px; text-align: center; white-space: nowrap; }
.perf-not-submitted { margin-top: 12px; padding: 8px 12px; background: rgba(245,74,74,.06); border-radius: 6px; font-size: 13px; }
.perf-input { height: 36px; padding: 0 12px; border: 1px solid var(--color-border); border-radius: 6px; font-size: 14px; font-family: var(--font-family); background: #fff; color: var(--color-text-primary); outline: none; flex: 1; }
.perf-input:focus { border-color: var(--color-primary); }
.perf-modal-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,.45); z-index: 9999; display: flex; align-items: center; justify-content: center; }
.perf-modal { background: #fff; border-radius: 12px; width: 90%; max-width: 520px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; }
.perf-modal-header { display: flex; align-items: center; justify-content: space-between; padding: 16px 20px; border-bottom: 1px solid var(--color-border); }
.perf-modal-header h3 { font-size: 17px; font-weight: 600; color: var(--color-text-primary); margin: 0; }
.perf-modal-close { font-size: 20px; cursor: pointer; color: var(--color-text-tertiary); transition: color .2s; }
.perf-modal-close:hover { color: var(--color-text-primary); }
.perf-modal-body { padding: 20px; overflow-y: auto; flex: 1; }
.perf-modal-footer { display: flex; justify-content: flex-end; gap: 12px; padding: 16px 20px; border-top: 1px solid var(--color-border); }
.perf-form-row { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.perf-form-row label { width: 60px; font-size: 14px; color: var(--color-text-secondary); flex-shrink: 0; }
.perf-form-row .perf-select, .perf-form-row .perf-input { flex: 1; }
.perf-upload-zone { border: 2px dashed var(--color-border); border-radius: 8px; padding: 32px 16px; text-align: center; cursor: pointer; transition: all .2s; flex: 1; }
.perf-upload-zone:hover, .perf-upload-zone.dragover { border-color: var(--color-primary); background: rgba(51,112,255,.04); }
.perf-upload-zone p { color: var(--color-text-tertiary); font-size: 14px; margin: 0; }
.perf-file-list { margin-top: 12px; }
.perf-file-item { display: flex; align-items: center; justify-content: space-between; padding: 8px 12px; background: #f5f6f7; border-radius: 6px; margin-bottom: 6px; font-size: 13px; }
.perf-file-remove { color: #f54a4a; cursor: pointer; font-size: 16px; }
.perf-btn-secondary { height: 36px; padding: 0 20px; background: #f5f6f7; color: var(--color-text-secondary); border: 1px solid var(--color-border); border-radius: 6px; font-size: 14px; font-family: var(--font-family); cursor: pointer; transition: all .2s; }
.perf-btn-secondary:hover { background: #e8e9ea; }
.perf-detail-item { display: flex; justify-content: space-between; padding: 8px 12px; background: #f5f6f7; border-radius: 6px; }
.perf-detail-label { font-size: 13px; color: var(--color-text-secondary); }
.perf-detail-value { font-size: 13px; color: var(--color-text-primary); font-weight: 500; font-variant-numeric: tabular-nums; }

.perf-image-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,.85); z-index: 9999; display: flex; align-items: center; justify-content: center; cursor: pointer; }
.perf-image-overlay img { max-width: 90%; max-height: 90%; object-fit: contain; border-radius: 4px; }


.form-section-title { font-size:13px; font-weight:600; color:var(--color-primary); margin:16px 0 8px; padding-bottom:4px; border-bottom:1px solid var(--color-border-light); }
.form-row { display:flex; gap:12px; }
.form-row .form-group { flex:1; }
.mgmt-table th, .mgmt-table td { white-space:nowrap; }
.staff-detail-row { display:flex; padding:8px 0; border-bottom:1px solid var(--color-border-light); }
.staff-detail-label { width:100px; font-size:12px; color:var(--color-text-tertiary); flex-shrink:0; }
.staff-detail-value { font-size:13px; color:var(--color-text); flex:1; }


/* Task Ownership Tabs */
.task-own-tabs { display: flex; gap: 0; margin-bottom: 12px; border-bottom: 1px solid var(--color-border-light); }
.task-own-tab { padding: 8px 16px; font-size: 13px; font-weight: 500; color: var(--color-text-secondary); cursor: pointer; border: none; background: none; border-bottom: 2px solid transparent; transition: all 0.15s; }
.task-own-tab:hover { color: var(--color-primary); }
.task-own-tab.active { color: var(--color-primary); border-bottom-color: var(--color-primary); }
.task-own-tab .count { font-size: 11px; color: var(--color-text-tertiary); margin-left: 4px; }
.task-own-tab.active .count { color: var(--color-primary); }
/* Task ownership badge */
.task-own-badge { font-size: 10px; padding: 1px 6px; border-radius: 4px; font-weight: 500; white-space: nowrap; }
.task-own-badge.created { background: #e8f0ff; color: #3370ff; }
.task-own-badge.assigned { background: #e8f7ee; color: #34c759; }
.task-own-badge.followed { background: #fff7e6; color: #ff9900; }
.task-own-badge.other { background: #f0f1f5; color: var(--color-text-tertiary); }

/* Task Module Styles */
/* Kanban Board */
.kanban-board { display: flex; gap: 12px; height: 100%; overflow-x: auto; padding-bottom: 8px; }
.kanban-col { flex: 1; min-width: 220px; max-width: 320px; display: flex; flex-direction: column; background: var(--color-bg); border-radius: 10px; overflow: hidden; }
.kanban-col-header { padding: 10px 14px; font-size: 13px; font-weight: 600; display: flex; align-items: center; justify-content: space-between; background: #fff; border-bottom: 2px solid var(--color-border-light); }
.kanban-col-count { background: var(--color-bg-hover); color: var(--color-text-secondary); font-size: 11px; padding: 1px 7px; border-radius: 10px; font-weight: 500; }
.kanban-col-body { flex: 1; overflow-y: auto; padding: 8px; min-height: 100px; }
.kanban-col-body.drag-over { background: rgba(51,112,255,0.06); border: 2px dashed var(--color-primary); border-radius: 8px; }
.kanban-card { background: #fff; border-radius: 8px; padding: 10px 12px; margin-bottom: 8px; border: 1px solid var(--color-border-light); cursor: grab; transition: box-shadow 0.15s; }
.kanban-card:hover { box-shadow: 0 2px 8px rgba(0,0,0,0.08); }
.kanban-card.dragging { opacity: 0.5; }
.kanban-card-title { font-size: 13px; font-weight: 500; margin-bottom: 6px; word-break: break-word; }
.kanban-card-meta { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.kanban-card-progress { height: 3px; background: var(--color-bg-hover); border-radius: 2px; margin-top: 6px; overflow: hidden; }
.kanban-card-progress-bar { height: 100%; background: var(--color-primary); border-radius: 2px; transition: width 0.3s; }
.kanban-card-assignee { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; border-radius: 50%; background: var(--color-primary-light); color: var(--color-primary); font-size: 10px; font-weight: 500; }
/* Task List Enhanced */
.task-list-toolbar { display: flex; gap: 8px; margin-bottom: 12px; flex-wrap: wrap; align-items: center; }
.task-list-toolbar select, .task-list-toolbar input { padding: 6px 10px; border: 1px solid var(--color-border); border-radius: 6px; font-size: 13px; background: #fff; }
.task-list-toolbar input { flex: 1; min-width: 120px; }
#taskListContainer { width: 100%; }
.task-list-item { display: flex; align-items: flex-start; gap: 10px; padding: 10px 14px; background: #fff; border-radius: 8px; border: 1px solid var(--color-border); margin-bottom: 6px; cursor: pointer; transition: var(--transition); width: 100%; }
.task-list-item:hover { box-shadow: var(--shadow-sm); border-color: var(--color-primary); }
.task-list-item.completed { opacity: 0.55; }
.task-list-item-body { flex: 1; min-width: 0; }
.task-list-item-title { font-size: 14px; font-weight: 500; margin-bottom: 4px; }
.task-list-item-meta { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; font-size: 12px; color: var(--color-text-secondary); }
.task-progress-mini { width: 60px; height: 4px; background: var(--color-bg-hover); border-radius: 2px; overflow: hidden; display: inline-block; vertical-align: middle; }
.task-progress-mini-bar { height: 100%; background: var(--color-primary); border-radius: 2px; }
/* Batch Bar */
.batch-bar { position: sticky; bottom: 0; left: 0; right: 0; background: #fff; border-top: 1px solid var(--color-border); padding: 10px 16px; display: none; align-items: center; gap: 8px; justify-content: space-between; box-shadow: 0 -2px 8px rgba(0,0,0,0.06); z-index: 10; }
.batch-bar.show { display: flex; }
.batch-bar-btn { padding: 5px 12px; border-radius: 6px; font-size: 12px; cursor: pointer; border: 1px solid var(--color-border); background: #fff; }
.batch-bar-btn.danger { color: #ff3b30; border-color: #ff3b30; }
.batch-bar-btn.success { color: #34c759; border-color: #34c759; }
/* Task delete buttons */
.task-item-del-btn { display: flex; }
.task-list-item:hover .task-item-del-btn { display: flex !important; }
.kanban-card-del-wrap { display: none; }
.kanban-card:hover .kanban-card-del-wrap { display: block !important; }
/* Subtasks */
.td-subtask-item { display: flex; align-items: center; gap: 8px; padding: 6px 0; }
.td-subtask-check { width: 16px; height: 16px; border-radius: 4px; border: 2px solid var(--color-border); cursor: pointer; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 10px; flex-shrink: 0; }
.td-subtask-check.checked { background: #34c759; border-color: #34c759; }
.td-subtask-text { flex: 1; font-size: 13px; }
.td-subtask-text.done { text-decoration: line-through; color: var(--color-text-tertiary); }
.td-subtask-del { color: var(--color-text-tertiary); cursor: pointer; font-size: 14px; opacity: 0; transition: opacity 0.15s; }
.td-subtask-item:hover .td-subtask-del { opacity: 1; }
/* Attachments */
.td-att-item { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border: 1px solid var(--color-border-light); border-radius: 6px; margin-bottom: 6px; }
.td-att-item:hover { background: var(--color-bg); }
.td-att-icon { font-size: 18px; }
.td-att-info { flex: 1; min-width: 0; }
.td-att-name { font-size: 13px; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.td-att-size { font-size: 11px; color: var(--color-text-tertiary); }
.td-att-del { color: #ff3b30; cursor: pointer; font-size: 12px; opacity: 0; }
.td-att-item:hover .td-att-del { opacity: 1; }
/* Progress bar in detail */
.td-progress-wrap { margin: 8px 0; }
.td-progress-bar-bg { width: 100%; height: 6px; background: var(--color-bg-hover); border-radius: 3px; overflow: hidden; }
.td-progress-bar-fill { height: 100%; background: var(--color-primary); border-radius: 3px; transition: width 0.3s; }
/* Recycle bin */
.recycle-item { display: flex; align-items: center; gap: 10px; padding: 8px 12px; border: 1px solid var(--color-border-light); border-radius: 6px; margin-bottom: 4px; opacity: 0.7; }
/* Task Module Styles */
.task-todo-wrap, .task-board-wrap, .task-assign-wrap, .task-remind-wrap { padding: 16px; height: 100%; overflow-y: auto; }
.task-filter-bar { display: flex; gap: 12px; margin-bottom: 16px; align-items: center; }
.task-list-container { display: flex; flex-direction: column; gap: 8px; }
.task-loading { text-align: center; padding: 40px 0; color: var(--color-text-tertiary); font-size: 14px; }
.task-empty { text-align: center; padding: 40px 0; color: var(--color-text-tertiary); font-size: 14px; }
.task-card { display: flex; align-items: flex-start; gap: 12px; padding: 12px 16px; background: #fff; border-radius: 8px; border: 1px solid var(--color-border-light); cursor: pointer; transition: var(--transition); }
.task-card:hover { box-shadow: var(--shadow-md); border-color: var(--color-primary); }
.task-card.completed { opacity: 0.6; }
.task-card-left { flex-shrink: 0; }
.task-card-body { flex: 1; min-width: 0; }
.task-card-title { font-size: 14px; font-weight: 500; margin-bottom: 6px; word-break: break-word; }
.task-card-meta { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.task-card-right { flex-shrink: 0; text-align: right; }
.task-tag { display: inline-block; padding: 2px 8px; border-radius: 4px; font-size: 11px; font-weight: 500; }
.task-check { width: 20px; height: 20px; border-radius: 50%; border: 2px solid var(--color-border); display: flex; align-items: center; justify-content: center; cursor: pointer; transition: var(--transition); }
.task-check.checked { background: var(--color-success); border-color: var(--color-success); }
.task-check:hover { border-color: var(--color-primary); }
.task-collab { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 22px; border-radius: 50%; background: var(--color-bg-hover); font-size: 10px; color: var(--color-text-secondary); padding: 0 4px; }
.task-due { font-size: 12px; font-weight: 500; white-space: nowrap; }
/* Kanban */
.kanban-board { display: flex; gap: 12px; overflow-x: auto; padding-bottom: 8px; }
.kanban-col { min-width: 260px; flex: 1; background: var(--color-bg-sidebar); border-radius: 8px; display: flex; flex-direction: column; max-height: calc(100vh - 180px); }
.kanban-col-header { padding: 12px 16px; font-size: 14px; font-weight: 600; display: flex; justify-content: space-between; align-items: center; }
.kanban-count { background: var(--color-bg-hover); padding: 1px 8px; border-radius: 10px; font-size: 12px; font-weight: 400; color: var(--color-text-secondary); }
.kanban-col-body { flex: 1; overflow-y: auto; padding: 8px; display: flex; flex-direction: column; gap: 8px; }
.kanban-empty { text-align: center; padding: 20px 0; color: var(--color-text-quaternary); font-size: 13px; }
.kanban-card { background: #fff; border-radius: 8px; padding: 12px; border: 1px solid var(--color-border-light); cursor: pointer; transition: var(--transition); }
.kanban-card:hover { box-shadow: var(--shadow-sm); }
.kanban-card-title { font-size: 13px; font-weight: 500; margin-bottom: 8px; word-break: break-word; }
.kanban-card-meta { display: flex; gap: 4px; flex-wrap: wrap; margin-bottom: 8px; }
.kanban-card-footer { display: flex; justify-content: space-between; align-items: center; }
.kanban-card-actions { display: flex; gap: 4px; margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--color-border-light); }
/* === Task Card Redesign === */
.kanban-card { border-left: 3px solid var(--color-border-light); }
.kanban-card-row1 { display: flex; justify-content: space-between; align-items: center; margin-bottom: 4px; gap: 4px; }
.kanban-card-row1-left { display: flex; gap: 4px; align-items: center; flex-wrap: wrap; }
.kanban-card-status { display: inline-flex; align-items: center; gap: 3px; font-size: 11px; white-space: nowrap; }
.kanban-card-status-dot { width: 6px; height: 6px; border-radius: 50%; display: inline-block; flex-shrink: 0; }
.kanban-card-row3 { display: flex; justify-content: space-between; align-items: center; font-size: 11px; color: var(--color-text-secondary); margin-top: 6px; gap: 4px; }
.kanban-card-flow { display: flex; align-items: center; gap: 3px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kanban-card-arrow { color: var(--color-text-tertiary); flex-shrink: 0; }
/* Tool-expanded: shrink kanban columns */
.workspace.tool-expanded .kanban-board { gap: 8px; }
.workspace.tool-expanded .kanban-col { min-width: 180px; }
/* List view card redesign */
.task-list-item-row1 { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; margin-bottom: 4px; }
.task-list-item-row3 { display: flex; justify-content: flex-start; align-items: center; font-size: 12px; color: var(--color-text-secondary); margin-top: 4px; gap: 12px; flex-wrap: wrap; }
.task-status-badge { display: inline-flex; align-items: center; gap: 3px; font-size: 11px; }
.task-status-dot { width: 6px; height: 6px; border-radius: 50%; display: inline-block; flex-shrink: 0; }
.kanban-move-btn { background: none; border: none; font-size: 11px; cursor: pointer; padding: 2px 6px; border-radius: 4px; }
.kanban-move-btn:hover { background: var(--color-bg-hover); }
/* Task Assign Form */
.task-assign-wrap { display: flex; gap: 20px; }
.task-assign-form { flex: 1; max-width: 500px; background: #fff; border-radius: 8px; padding: 20px; border: 1px solid var(--color-border-light); }
.task-assign-recent { flex: 1; }
.form-group { margin-bottom: 14px; }
.form-group label { display: block; font-size: 13px; color: var(--color-text-secondary); margin-bottom: 6px; font-weight: 500; }
.form-row2 { display: flex; gap: 12px; }
.form-row2 .form-group { flex: 1; }
.collab-checkbox-list { display: flex; flex-wrap: wrap; gap: 8px; max-height: 120px; overflow-y: auto; padding: 8px; border: 1px solid var(--color-border); border-radius: 6px; }
.collab-item { display: flex; align-items: center; gap: 4px; font-size: 13px; cursor: pointer; padding: 4px 8px; border-radius: 4px; }
.collab-item:hover { background: var(--color-bg-hover); }
/* Remind */
.remind-stats { display: flex; gap: 12px; margin-bottom: 20px; }
.remind-stat-card { flex: 1; padding: 16px; border-radius: 8px; text-align: center; background: #fff; border: 1px solid var(--color-border-light); }
.remind-stat-card .stat-num { font-size: 28px; font-weight: 700; }
.remind-stat-card .stat-label { font-size: 12px; color: var(--color-text-tertiary); margin-top: 4px; }
.remind-stat-card.overdue .stat-num { color: #f54a4a; }
.remind-stat-card.today .stat-num { color: #ff9d00; }
.remind-stat-card.week .stat-num { color: #3370ff; }
.remind-stat-card.pending .stat-num { color: var(--color-text-secondary); }
.remind-section { margin-bottom: 20px; }
.remind-section-header { font-size: 14px; font-weight: 600; margin-bottom: 8px; }
/* Modal */
.modal-overlay { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.4); z-index: 1000; overflow-y: auto; }
.modal-overlay.active { display: block; }
.modal-box { background: #fff; border-radius: 12px; width: 90%; max-width: 730px; margin: 40px auto; display: flex; flex-direction: column; max-height: calc(100vh - 80px); box-shadow: var(--shadow-lg); }
.modal-header { display: flex; justify-content: space-between; align-items: center; padding: 16px 20px; border-bottom: 1px solid var(--color-border-light); flex-shrink: 0; }
.modal-close { font-size: 24px; cursor: pointer; color: var(--color-text-tertiary); }
.modal-body { padding: 24px; overflow-y: auto; flex: 1 1 auto; min-height: 0; }
.modal-footer { border-top: 1px solid var(--color-border-light); padding: 12px 20px; display: flex; gap: 8px; justify-content: flex-end; flex-shrink: 0; }


/* Notification Panel */
.notif-panel {
  width: 0; overflow: hidden; background: var(--color-white);
  border-right: 1px solid var(--color-border-light);
  transition: width 0.25s ease; flex-shrink: 0; display: flex; flex-direction: column;
  display: flex; flex-direction: column;
}
.notif-panel.open { width: 320px; }
.notif-panel .np-header {
  padding: 16px; font-size: 14px; font-weight: 600;
  border-bottom: 1px solid var(--color-border-light);
  display: flex; align-items: center; justify-content: space-between;
}
.notif-panel .np-content { flex: 1; overflow-y: auto; padding: 0; }
.notif-item {
  padding: 12px 16px; border-bottom: 1px solid var(--color-border-light);
  cursor: pointer; transition: var(--transition);
}
.notif-item:hover { background: var(--color-bg); }
.notif-item .ni-title { font-size: 13px; font-weight: 500; color: var(--color-text); margin-bottom: 4px; }
.notif-item .ni-desc { font-size: 12px; color: var(--color-text-secondary); line-height: 1.4; }
.notif-item .ni-time { font-size: 11px; color: var(--color-text-tertiary); margin-top: 4px; }
.notif-item.unread { background: rgba(51,112,255,0.04); }
.notif-item.type-important { border-left: 3px solid #f54a4a; }
.notif-item.type-warning { border-left: 3px solid #ff9900; }
.notif-item.type-info { border-left: 3px solid var(--color-primary); }
.notif-item .ni-header { display: flex; align-items: center; justify-content: space-between; }
.notif-item .ni-type-tag { font-size: 10px; padding: 1px 6px; border-radius: 4px; font-weight: 500; }
.notif-item .ni-type-tag.important { background: #fef0f0; color: #f54a4a; }
.notif-item .ni-type-tag.warning { background: #fff7e6; color: #ff9900; }
.notif-item .ni-type-tag.info { background: #e8f0ff; color: var(--color-primary); }
.notif-item .ni-del { opacity: 0; transition: opacity 0.15s; cursor: pointer; color: var(--color-text-tertiary); }
.notif-item:hover .ni-del { opacity: 1; }
.notif-item .ni-del:hover { color: #f54a4a; }
.notif-section-label { padding: 8px 16px 4px; font-size: 11px; color: var(--color-text-tertiary); font-weight: 600; text-transform: uppercase; }
/* Create notification modal */
.notif-modal-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.4); z-index: 10000; display: flex; align-items: center; justify-content: center; }
.notif-modal { background: var(--color-white); border-radius: 12px; width: 420px; max-width: 90vw; overflow: hidden; }
.notif-modal .nm-header { padding: 16px; font-size: 14px; font-weight: 600; border-bottom: 1px solid var(--color-border-light); display: flex; align-items: center; justify-content: space-between; }
.notif-modal .nm-body { padding: 16px; }
.notif-modal .nm-footer { padding: 12px 16px; border-top: 1px solid var(--color-border-light); display: flex; justify-content: flex-end; gap: 8px; }
.notif-modal input, .notif-modal textarea, .notif-modal select { width: 100%; padding: 8px 12px; border: 1px solid var(--color-border); border-radius: 6px; font-size: 13px; outline: none; box-sizing: border-box; }
.notif-modal textarea { resize: vertical; min-height: 80px; font-family: inherit; }
.notif-modal label { font-size: 12px; color: var(--color-text-secondary); margin-bottom: 4px; display: block; }
.notif-modal .nm-field { margin-bottom: 12px; }

.notif-item.unread .ni-title::before {
  content: ''; display: inline-block; width: 6px; height: 6px;
  border-radius: 50%; background: var(--color-primary); margin-right: 6px;
  vertical-align: middle;
}

/* Nav logo -> notification button */
.page-nav .nav-logo {
  cursor: pointer; transition: var(--transition); position: relative;
}
.page-nav .nav-logo:hover { background: var(--color-sidebar-hover); }
.page-nav .nav-logo svg { width: 18px; height: 18px; }
.nav-logo .notif-badge {
  position: absolute; top: -2px; right: -4px;
  min-width: 16px; height: 16px; border-radius: 8px;
  background: #f54a4a; color: #fff; font-size: 10px;
  display: none; align-items: center; justify-content: center;
  padding: 0 4px; font-weight: 600;
}

/* Task Board Tool Item */
.tool-item .status-indicator {
  position: absolute; bottom: 4px; right: 4px;
  width: 8px; height: 8px; border-radius: 50%;
  border: 2px solid var(--color-bg-sidebar);
}
.tool-item .status-indicator.green { background: #34c759; }
.tool-item .status-indicator.red { background: #ff3b30; }
/* Tool icon color states */
.tool-item.task-gray svg { stroke: #8f959e; }
.tool-item.task-red svg { stroke: #ff3b30; }
.tool-item.task-green svg { stroke: #34c759; }
.tool-item .status-indicator.gray { background: #d1d4d9; }
/* Task detail modal */
.td-label { font-size: 12px; color: var(--color-text-tertiary); margin-bottom: 4px; }
.td-value { font-size: 14px; color: var(--color-text); }
.td-desc { background: var(--color-bg); border-radius: 8px; padding: 12px; font-size: 13px; color: var(--color-text-secondary); white-space: pre-wrap; margin-bottom: 16px; }
.td-comments { max-height: 200px; overflow-y: auto; margin-bottom: 12px; }
.td-comment { padding: 8px 0; border-bottom: 1px solid var(--color-border-light); }
.td-comment-author { font-size: 12px; font-weight: 500; color: var(--color-primary); }
.td-comment-content { font-size: 13px; color: var(--color-text); margin: 4px 0; }
.td-comment-time { font-size: 11px; color: var(--color-text-tertiary); }
.td-ack-badge { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; padding: 2px 8px; border-radius: 10px; background: #e8f5e9; color: #34c759; }

/* Task Board Panel (wider) */
.tool-panel.wide { width: 370px !important; }
.tp-section { padding: 12px 16px; }
.tp-section h4 {
  font-size: 15px; font-weight: 700; color: var(--color-text);
  margin-bottom: 8px; padding: 4px 0;
}
.tp-item {
  display: flex; align-items: flex-start; gap: 8px; width: 100%;
  padding: 10px 12px; border-radius: 8px; background: var(--color-bg);
  margin-bottom: 6px; cursor: pointer; transition: var(--transition);
  text-align: left; box-sizing: border-box;
}
.tp-item:hover { background: var(--color-bg-hover); }
.tp-item .tpi-title { font-size: 13px; font-weight: 500; color: var(--color-text); margin-bottom: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tp-item .tpi-meta { font-size: 11px; color: var(--color-text-tertiary); display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-top: 2px; }

/* Task Data Table */
.task-data-summary { display: flex; gap: 16px; margin-bottom: 20px; }
.task-data-card {
  flex: 1; background: var(--color-white); border: 1px solid var(--color-border-light);
  border-radius: 10px; padding: 16px;
}
.task-data-card .tdc-num { font-size: 28px; font-weight: 700; color: var(--color-text); }
.task-data-card .tdc-label { font-size: 12px; color: var(--color-text-secondary); margin-top: 4px; }
.task-data-card .tdc-num.green { color: #34c759; }
.task-data-card .tdc-num.red { color: #ff3b30; }
.task-data-card .tdc-num.orange { color: #ff9d00; }
.task-data-table { width: 100%; border-collapse: collapse; }
.task-data-table th {
  background: var(--color-bg-sidebar); padding: 10px 14px; text-align: left;
  font-size: 12px; font-weight: 600; color: var(--color-text-secondary);
  border-bottom: 1px solid var(--color-border-light);
}
.task-data-table td {
  padding: 10px 14px; font-size: 13px; color: var(--color-text);
  border-bottom: 1px solid var(--color-border-light);
}
.task-data-table tr:hover td { background: var(--color-bg); }




/* Copywriter Submit Modal */
.cw-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.4); z-index: 9999; display: none; align-items: center; justify-content: center; }
.cw-overlay.active { display: flex; }
.cw-modal { background: #fff; border-radius: 12px; width: 94%; max-width: 880px; max-height: 90vh; display: flex; flex-direction: column; overflow: hidden; box-shadow: 0 8px 32px rgba(0,0,0,0.15); }
.cw-modal-header { display: flex; justify-content: space-between; align-items: center; padding: 16px 24px; border-bottom: 1px solid var(--color-border); }
.cw-modal-header h3 { font-size: 16px; font-weight: 600; }
.cw-modal-close { cursor: pointer; font-size: 20px; color: var(--color-text-tertiary); width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; border-radius: 6px; }
.cw-modal-close:hover { background: var(--color-bg-hover); }
.cw-modal-body { flex: 1; overflow-y: auto; padding: 20px 24px; }
.cw-modal-footer { display: flex; justify-content: flex-end; align-items: center; padding: 16px 24px; border-top: 1px solid var(--color-border); background: var(--color-bg-sidebar); }
.cw-date-row { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.cw-date-row label { font-size: 14px; font-weight: 500; white-space: nowrap; }
.cw-date-row input[type=date] { padding: 6px 10px; border: 1px solid var(--color-border); border-radius: 6px; font-size: 14px; }
.cw-admin-row { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; padding: 10px 12px; background: #fff8e6; border-radius: 8px; }
.cw-admin-row label { font-size: 13px; font-weight: 500; }
.cw-admin-row select { padding: 4px 8px; border: 1px solid var(--color-border); border-radius: 6px; font-size: 13px; }
.cw-project-group { margin-bottom: 16px; border: 1px solid var(--color-border-light); border-radius: 10px; overflow: hidden; }
.cw-project-title { padding: 10px 16px; background: var(--color-bg-sidebar); font-size: 14px; font-weight: 600; color: var(--color-text); border-bottom: 1px solid var(--color-border-light); }
.cw-fields-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; padding: 14px 16px; }
.cw-field-item { display: flex; flex-direction: column; gap: 4px; }
.cw-field-item label { font-size: 12px; color: var(--color-text-secondary); }
.cw-field-item input { padding: 6px 10px; border: 1px solid var(--color-border); border-radius: 6px; font-size: 14px; width: 100%; }
.cw-field-item input:focus { outline: none; border-color: var(--color-primary); }
.cw-summary { font-size: 14px; color: var(--color-text-secondary); }
.cw-summary strong { color: var(--color-primary); font-size: 16px; }
.cw-btn-submit { background: var(--color-primary); color: #fff; border: none; padding: 8px 24px; border-radius: 8px; font-size: 14px; cursor: pointer; }
.cw-btn-submit:hover { background: var(--color-primary-hover); }
.cw-btn-cancel { background: var(--color-bg); color: var(--color-text); border: 1px solid var(--color-border); padding: 8px 20px; border-radius: 8px; font-size: 14px; cursor: pointer; }

/* ===== Logs Page CSS (merged from inline) ===== */

.logs-page { padding: 0; }
.logs-toolbar { display: flex; gap: 8px; margin-bottom: 12px; flex-wrap: wrap; align-items: center; }
.logs-toolbar select, .logs-toolbar input { padding: 6px 10px; border: 1px solid var(--color-border); border-radius: 6px; font-size: 13px; background: #fff; }
.logs-toolbar input[type="text"] { flex: 1; min-width: 150px; }
.logs-toolbar input[type="date"] { min-width: 140px; }
.logs-toolbar .btn { padding: 6px 16px; border: none; border-radius: 6px; font-size: 13px; cursor: pointer; background: var(--color-primary); color: #fff; }
.logs-toolbar .btn:hover { background: var(--color-primary-hover); }
.logs-toolbar .btn-secondary { background: var(--color-bg); color: var(--color-text); border: 1px solid var(--color-border); }
.logs-toolbar .btn-secondary:hover { background: var(--color-border); }
.logs-quick-btns { display: flex; gap: 4px; }
.logs-quick-btns .qb { padding: 4px 10px; font-size: 12px; border: 1px solid var(--color-border); border-radius: 4px; cursor: pointer; background: #fff; color: var(--color-text-secondary); }
.logs-quick-btns .qb.active { background: var(--color-primary); color: #fff; border-color: var(--color-primary); }
.logs-table { width: 100%; border-collapse: collapse; }
.logs-table th { background: var(--color-bg-hover); color: var(--color-text-secondary); font-size: 12px; font-weight: 600; padding: 10px 8px; text-align: left; border-bottom: 1px solid var(--color-border); white-space: nowrap; }
.logs-table td { padding: 8px; border-bottom: 1px solid var(--color-border); font-size: 13px; vertical-align: top; }
.logs-table tr:hover td { background: var(--color-bg); }
.logs-table .log-detail-cell { max-width: 300px; word-break: break-word; }
.logs-table .log-changes { margin-top: 4px; padding: 4px 8px; background: var(--color-bg); border-radius: 4px; font-size: 11px; color: var(--color-text-secondary); }
.logs-table .log-changes div { margin: 2px 0; }
.logs-status-badge { display: inline-block; padding: 2px 8px; border-radius: 10px; font-size: 11px; font-weight: 600; }
.logs-status-success { background: #e6f7ed; color: #22c55e; }
.logs-status-fail { background: #fef2f2; color: #ef4444; }
.logs-status-denied { background: #fff7ed; color: #f97316; }
.logs-pagination { display: flex; gap: 4px; justify-content: center; align-items: center; margin-top: 16px; }
.logs-pagination button { padding: 4px 12px; border: 1px solid var(--color-border); border-radius: 4px; cursor: pointer; background: #fff; font-size: 13px; }
.logs-pagination button:hover { background: var(--color-bg); }
.logs-pagination button.active { background: var(--color-primary); color: #fff; border-color: var(--color-primary); }
.logs-pagination button:disabled { opacity: 0.4; cursor: not-allowed; }
.logs-expand-row { display: none; }
.logs-expand-row.show { display: table-row; }
.logs-expand-content { background: var(--color-bg); font-size: 12px; color: var(--color-text-secondary); }
.logs-summary-bar { display: flex; gap: 16px; margin-bottom: 12px; font-size: 13px; color: var(--color-text-secondary); }
.logs-module-tag { display: inline-block; padding: 1px 6px; border-radius: 3px; font-size: 11px; font-weight: 500; }

/* ===== 中控绩效页面样式 ===== */
.zk-thumb-strip { display:flex; gap:3px; flex-wrap:wrap; max-width:200px; }
.zk-thumb { width:28px; height:28px; object-fit:cover; border-radius:3px; cursor:pointer; border:1px solid #e0e0e0; transition:transform 0.15s; }
.zk-thumb:hover { transform:scale(1.5); z-index:10; position:relative; }

.zk-slots { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-bottom:12px; }
.zk-slot { border:1px dashed #ccc; border-radius:8px; padding:8px; cursor:pointer; transition:border-color 0.15s,background 0.15s; }
.zk-slot:hover { border-color:#4f7cff; background:#f8faff; }
.zk-slot-label { font-size:11px; color:#666; margin-bottom:4px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.zk-slot-preview { width:100%; height:80px; display:flex; align-items:center; justify-content:center; border-radius:4px; background:#f5f5f5; position:relative; overflow:hidden; }
.zk-slot-preview img { width:100%; height:100%; object-fit:cover; border-radius:4px; }
.zk-slot-placeholder { font-size:11px; color:#bbb; }
.zk-slot-remove { position:absolute; top:2px; right:2px; width:18px; height:18px; background:rgba(255,59,48,0.9); color:#fff; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:10px; cursor:pointer; }

/* 中控上传弹窗 v2 - 平台分板块+多选+福袋列表 */
.zk-platforms-row { display:flex; gap:10px; margin-bottom:10px; }
.zk-platform-section { flex:1; border:1px solid #e8e8e8; border-radius:8px; padding:8px; }
.zk-platform-header { font-size:13px; font-weight:600; color:#333; margin-bottom:8px; padding-bottom:6px; border-bottom:1px solid #f0f0f0; }
.zk-upload-area { border:2px dashed #d9d9d9; border-radius:6px; padding:10px; text-align:center; cursor:pointer; transition:border-color 0.2s,background 0.2s; }
.zk-upload-area:hover { border-color:#4f7cff; background:#f8faff; }
.zk-upload-placeholder { font-size:12px; color:#999; }
.zk-thumb-item { position:relative; width:56px; height:56px; display:inline-block; margin-right:6px; margin-bottom:6px; border-radius:4px; overflow:hidden; border:1px solid #e0e0e0; }
.zk-thumb-item img { width:100%; height:100%; object-fit:cover; }
.zk-thumb-strip { display:flex; flex-wrap:wrap; gap:2px; margin-top:8px; }
.zk-lb-list { border:1px solid #e8e8e8; border-radius:6px; overflow:hidden; }
.zk-lb-item { display:flex; align-items:center; gap:8px; padding:8px 12px; border-bottom:1px solid #f0f0f0; font-size:12px; }
.zk-lb-item:last-child { border-bottom:none; }
.zk-lb-platform { background:#4f7cff; color:#fff; padding:2px 8px; border-radius:3px; font-size:11px; flex:0 0 auto; }
.zk-lb-content { flex:2; color:#333; }
.zk-lb-price { flex:0 0 auto; color:#e74c3c; font-weight:600; }
.zk-lb-count { flex:0 0 auto; color:#666; }
.zk-lb-remove { flex:0 0 auto; width:18px; height:18px; background:rgba(255,59,48,0.9); color:#fff; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:10px; cursor:pointer; }
/* zk table v3: toggle + inline detail + edit */
.zk-toggle-btn { cursor:pointer; font-size:14px; color:#4f7cff; display:inline-block; width:20px; text-align:center; user-select:none; }
.zk-toggle-btn:hover { color:#1a5fff; }
.zk-inline-detail { padding:12px 16px; background:#fafbfc; border-radius:8px; }
.zk-inline-section { margin-bottom:16px; }
.zk-inline-section:last-child { margin-bottom:0; }
.zk-inline-section h5 { font-size:13px; font-weight:600; color:#333; margin:0 0 8px 0; padding-bottom:6px; border-bottom:1px solid #eee; }

/* ===== Knowledge Base v2 Styles (飞书风格) ===== */

/* App container */
.kb-app { height: 100%; display: flex; flex-direction: column; background: var(--color-bg); overflow: hidden; }

/* ===== KB List View ===== */
.kb-list-view { flex: 1; overflow: auto; padding: 24px 32px; }
.kb-list-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 24px; }
.kb-list-title { font-size: 20px; font-weight: 600; color: var(--color-text); margin: 0; }
.kb-card-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 16px; }
.kb-card { background: var(--color-white); border-radius: 8px; overflow: hidden; cursor: pointer; transition: box-shadow .2s, transform .2s; border: 1px solid var(--color-border-light); }
.kb-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,.08); transform: translateY(-2px); }
.kb-card-cover { height: 120px; display: flex; align-items: center; justify-content: center; }
.kb-card-icon { font-size: 40px; filter: brightness(0) invert(1); opacity: .9; }
.kb-card-info { padding: 12px 14px; }
.kb-card-name { font-size: 14px; font-weight: 600; color: var(--color-text); margin-bottom: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kb-card-desc { font-size: 12px; color: var(--color-text-tertiary); margin-bottom: 8px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kb-card-meta { font-size: 11px; color: var(--color-text-tertiary); display: flex; gap: 6px; align-items: center; }

/* ===== KB Detail View ===== */
.kb-detail-view { flex: 1; display: flex; flex-direction: column; overflow: hidden; }
.kb-topbar { height: 44px; display: flex; align-items: center; justify-content: space-between; padding: 0 16px; background: var(--color-white); border-bottom: 1px solid var(--color-border-light); flex-shrink: 0; }
.kb-breadcrumb { display: flex; align-items: center; gap: 4px; font-size: 13px; color: var(--color-text-secondary); overflow: hidden; }
.kb-bc-link { color: var(--color-primary); cursor: pointer; white-space: nowrap; }
.kb-bc-link:hover { text-decoration: underline; }
.kb-bc-sep { color: var(--color-text-tertiary); margin: 0 2px; }
.kb-bc-item { white-space: nowrap; }
.kb-topbar-actions { display: flex; gap: 8px; align-items: center; }
.kb-columns { flex: 1; display: flex; overflow: hidden; }

/* ===== Sidebar ===== */
.kb-sidebar { width: 280px; flex-shrink: 0; background: var(--color-white); border-right: 1px solid var(--color-border-light); display: flex; flex-direction: column; overflow: hidden; }
.kb-sidebar-header { padding: 12px 16px 8px; flex-shrink: 0; }
.kb-sidebar-title { font-size: 15px; font-weight: 600; color: var(--color-text); }
.kb-search-wrap { padding: 0 12px 8px; flex-shrink: 0; }
.kb-search { width: 100%; height: 30px; border: 1px solid var(--color-border); border-radius: 6px; padding: 0 10px; font-size: 13px; outline: none; box-sizing: border-box; }
.kb-search:focus { border-color: var(--color-primary); }
.kb-tree { flex: 1; overflow-y: auto; padding: 4px 0; }
.kb-tree-node { user-select: none; }
.kb-tree-row { display: flex; align-items: center; height: 32px; cursor: pointer; padding-right: 8px; position: relative; }
.kb-tree-row:hover { background: var(--color-bg-hover); }
.kb-tree-row.active { background: var(--color-primary-light); color: var(--color-primary); }
.kb-tree-arrow { width: 16px; text-align: center; font-size: 10px; color: var(--color-text-tertiary); transition: transform .15s; flex-shrink: 0; cursor: pointer; }
.kb-tree-arrow.expanded { transform: rotate(90deg); }
.kb-tree-arrow-placeholder { width: 16px; flex-shrink: 0; }
.kb-tree-icon { font-size: 14px; margin-right: 6px; flex-shrink: 0; }
.kb-tree-name { flex: 1; font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kb-tree-actions { display: none; flex-shrink: 0; }
.kb-tree-row:hover .kb-tree-actions { display: flex; }
.kb-tree-add { background: none; border: none; color: var(--color-text-tertiary); cursor: pointer; font-size: 16px; padding: 0 4px; line-height: 1; }
.kb-tree-add:hover { color: var(--color-primary); }

/* ===== Outline Panel ===== */
.kb-outline { width: 240px; flex-shrink: 0; background: var(--color-white); border-right: 1px solid var(--color-border-light); display: flex; flex-direction: column; overflow: hidden; }
.kb-outline-header { padding: 12px 16px 8px; font-size: 13px; font-weight: 600; color: var(--color-text-secondary); flex-shrink: 0; }
.kb-outline-body { flex: 1; overflow-y: auto; padding: 0 8px 8px; }
.kb-outline-item { font-size: 12px; color: var(--color-text-secondary); cursor: pointer; padding: 4px 8px; border-radius: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kb-outline-item:hover { background: var(--color-bg-hover); color: var(--color-primary); }
.kb-outline-l1 { padding-left: 8px; font-weight: 500; }
.kb-outline-l2 { padding-left: 20px; }
.kb-outline-l3 { padding-left: 32px; }
.kb-outline-l4 { padding-left: 44px; }
.kb-outline-l5 { padding-left: 56px; }
.kb-outline-l6 { padding-left: 68px; }

/* ===== Content Area ===== */
.kb-content { flex: 1; overflow-y: auto; background: var(--color-white); }
.kb-content-header { padding: 24px 40px 12px; border-bottom: 1px solid var(--color-border-light); }
.kb-page-title { font-size: 24px; font-weight: 700; color: var(--color-text); margin: 0 0 8px; }
.kb-page-meta { font-size: 12px; color: var(--color-text-tertiary); display: flex; gap: 6px; align-items: center; }
.kb-page-body { padding: 20px 40px 60px; position: relative; min-height: 200px; }

/* Markdown body */
.kb-md-body { font-size: 14px; line-height: 1.7; color: var(--color-text); max-width: 800px; }
.kb-md-body h1 { font-size: 22px; font-weight: 700; margin: 24px 0 12px; }
.kb-md-body h2 { font-size: 18px; font-weight: 600; margin: 20px 0 10px; }
.kb-md-body h3 { font-size: 16px; font-weight: 600; margin: 16px 0 8px; }
.kb-md-body p { margin: 8px 0; }
.kb-md-body ul, .kb-md-body ol { padding-left: 24px; margin: 8px 0; }
.kb-md-body li { margin: 4px 0; }
.kb-md-body code { background: var(--color-bg-hover); padding: 2px 6px; border-radius: 3px; font-size: 13px; font-family: monospace; }
.kb-md-body pre { background: var(--color-bg-hover); padding: 12px 16px; border-radius: 6px; overflow-x: auto; }
.kb-md-body pre code { background: none; padding: 0; }
.kb-md-body blockquote { border-left: 3px solid var(--color-primary); padding-left: 12px; color: var(--color-text-secondary); margin: 8px 0; }
.kb-md-body table { border-collapse: collapse; margin: 12px 0; }
.kb-md-body th, .kb-md-body td { border: 1px solid var(--color-border); padding: 6px 12px; }
.kb-md-body th { background: var(--color-bg-hover); }
.kb-md-body img { max-width: 100%; border-radius: 4px; }
.kb-md-body a { color: var(--color-primary); }

/* Text view */
.kb-text-view { white-space: pre-wrap; font-size: 14px; line-height: 1.7; color: var(--color-text); font-family: monospace; }

/* Editor */
.kb-editor { display: flex; flex-direction: column; height: 100%; }
.kb-editor-textarea { flex: 1; border: 1px solid var(--color-border); border-radius: 6px; padding: 12px; font-size: 14px; line-height: 1.7; font-family: monospace; resize: none; outline: none; min-height: 400px; }
.kb-editor-textarea:focus { border-color: var(--color-primary); }
.kb-editor-actions { display: flex; gap: 8px; margin-top: 12px; }
.kb-edit-btn { position: absolute; top: 24px; right: 40px; }

/* Office/PDF editor */
.kb-editor-wrap { width: 100%; height: calc(100vh - 140px); }
.kb-editor-frame { width: 100%; height: 100%; border: none; }

/* Image viewer */
.kb-image-viewer { display: flex; align-items: center; justify-content: center; padding: 24px; }
.kb-image-viewer img { max-width: 100%; max-height: calc(100vh - 200px); border-radius: 4px; }

/* ===== Buttons ===== */
.kb-btn { height: 32px; padding: 0 14px; border: 1px solid var(--color-border); border-radius: 6px; background: var(--color-white); color: var(--color-text); font-size: 13px; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 4px; transition: all .15s; }
.kb-btn:hover { background: var(--color-bg-hover); }
.kb-btn-sm { height: 28px; padding: 0 10px; font-size: 12px; }
.kb-btn-primary { background: var(--color-primary); border-color: var(--color-primary); color: #fff; }
.kb-btn-primary:hover { background: var(--color-primary-hover); }
.kb-btn-danger { color: var(--color-danger); border-color: var(--color-danger); }
.kb-btn-danger:hover { background: #fef0f0; }

/* ===== Modal ===== */
.kb-modal-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,.4); display: flex; align-items: center; justify-content: center; z-index: 10000; }
.kb-modal { background: var(--color-white); border-radius: 8px; padding: 24px; width: 420px; max-width: 90vw; max-height: 80vh; overflow-y: auto; box-shadow: 0 8px 32px rgba(0,0,0,.16); }
.kb-modal-lg { width: 560px; }
.kb-modal-title { font-size: 16px; font-weight: 600; margin-bottom: 16px; color: var(--color-text); }
.kb-form-group { margin-bottom: 14px; }
.kb-form-group label { display: block; font-size: 13px; color: var(--color-text-secondary); margin-bottom: 6px; }
.kb-modal-input { width: 100%; height: 34px; border: 1px solid var(--color-border); border-radius: 6px; padding: 0 10px; font-size: 13px; outline: none; box-sizing: border-box; }
.kb-modal-input:focus { border-color: var(--color-primary); }
.kb-modal-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 20px; }
.kb-color-list { display: flex; gap: 8px; flex-wrap: wrap; }
.kb-color-pick { width: 28px; height: 28px; border-radius: 50%; cursor: pointer; border: 2px solid transparent; transition: border-color .15s; }
.kb-color-pick.selected { border-color: var(--color-text); }

/* ===== Permission Management ===== */
.kb-perm-list { margin-bottom: 16px; }
.kb-perm-row { display: flex; align-items: center; gap: 8px; padding: 8px 0; border-bottom: 1px solid var(--color-border-light); }
.kb-perm-name { flex: 1; font-size: 13px; }
.kb-perm-select { height: 28px; border: 1px solid var(--color-border); border-radius: 4px; font-size: 12px; padding: 0 6px; }
.kb-perm-add { display: flex; gap: 8px; align-items: center; padding-top: 12px; border-top: 1px solid var(--color-border-light); }
.kb-perm-add .kb-modal-input { flex: 1; }

/* ===== Context Menu ===== */
.kb-context-menu { position: fixed; background: var(--color-white); border: 1px solid var(--color-border); border-radius: 6px; padding: 4px 0; box-shadow: 0 4px 16px rgba(0,0,0,.12); z-index: 10001; min-width: 140px; }
.kb-ctx-item { padding: 8px 16px; font-size: 13px; color: var(--color-text); cursor: pointer; display: flex; align-items: center; gap: 8px; }
.kb-ctx-item:hover { background: var(--color-primary-light); color: var(--color-primary); }
.kb-ctx-icon { font-size: 14px; }
.kb-ctx-danger { color: var(--color-danger); }
.kb-ctx-danger:hover { background: #fef0f0; color: var(--color-danger); }

/* ===== States ===== */
.kb-loading { display: flex; align-items: center; justify-content: center; height: 200px; color: var(--color-text-tertiary); font-size: 14px; }
.kb-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; color: var(--color-text-tertiary); }
.kb-empty-icon { font-size: 48px; margin-bottom: 12px; opacity: .5; }
.kb-empty p { margin: 4px 0; font-size: 14px; }
.kb-empty-hint { font-size: 12px !important; color: var(--color-text-tertiary); }
.kb-empty-sm { padding: 16px; text-align: center; color: var(--color-text-tertiary); font-size: 13px; }
/* ===== KB v2.1 Additional Styles ===== */

/* Tree node "+" button - always visible on hover */
.kb-tree-row { position: relative; }
.kb-tree-actions { opacity: 0; transition: opacity 0.15s; }
.kb-tree-row:hover .kb-tree-actions { opacity: 1; }
.kb-tree-add {
  width: 20px; height: 20px; border: none; background: var(--color-primary);
  color: #fff; border-radius: 4px; font-size: 14px; line-height: 1;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
}
.kb-tree-add:hover { background: var(--color-primary-hover); }

/* Drag and drop feedback */
.kb-drag-over { background: var(--color-primary-light) !important; border: 2px dashed var(--color-primary); border-radius: 4px; }
.kb-tree-row[draggable="true"] { cursor: move; }
.kb-card[draggable="true"] { cursor: move; }

/* Action bar */
.kb-action-bar {
  position: absolute; top: 12px; right: 16px; display: flex; gap: 8px; z-index: 5;
}
.kb-fav-btn { font-size: 13px; }

/* Markdown typography improvements */
.kb-md-body { font-size: 15px; line-height: 1.8; color: var(--color-text); max-width: 760px; }
.kb-md-body h1 { font-size: 28px; font-weight: 700; margin: 24px 0 16px; color: var(--color-text); border-bottom: 1px solid var(--color-border-light); padding-bottom: 8px; }
.kb-md-body h2 { font-size: 22px; font-weight: 600; margin: 20px 0 12px; color: var(--color-text); }
.kb-md-body h3 { font-size: 18px; font-weight: 600; margin: 18px 0 10px; color: var(--color-text); }
.kb-md-body h4 { font-size: 16px; font-weight: 600; margin: 16px 0 8px; color: var(--color-text); }
.kb-md-body h5, .kb-md-body h6 { font-size: 14px; font-weight: 600; margin: 14px 0 6px; color: var(--color-text-secondary); }
.kb-md-body p { margin: 8px 0; }
.kb-md-body ul, .kb-md-body ol { margin: 8px 0; padding-left: 24px; }
.kb-md-body li { margin: 4px 0; }
.kb-md-body blockquote { margin: 12px 0; padding: 8px 16px; border-left: 3px solid var(--color-primary); background: var(--color-primary-light); border-radius: 0 4px 4px 0; color: var(--color-text-secondary); }
.kb-md-body code { background: #f0f1f5; padding: 2px 6px; border-radius: 3px; font-size: 13px; font-family: 'SF Mono', 'Fira Code', monospace; }
.kb-md-body pre { background: #1e1e2e; color: #cdd6f4; padding: 16px; border-radius: 8px; overflow-x: auto; margin: 12px 0; }
.kb-md-body pre code { background: none; padding: 0; color: inherit; }
.kb-md-body table { border-collapse: collapse; width: 100%; margin: 12px 0; }
.kb-md-body th, .kb-md-body td { border: 1px solid var(--color-border); padding: 8px 12px; text-align: left; }
.kb-md-body th { background: var(--color-bg-hover); font-weight: 600; }
.kb-md-body img { max-width: 100%; border-radius: 4px; margin: 8px 0; }
.kb-md-body a { color: var(--color-primary); text-decoration: none; }
.kb-md-body a:hover { text-decoration: underline; }
.kb-md-body hr { border: none; border-top: 1px solid var(--color-border-light); margin: 20px 0; }

/* Edit mode */
.kb-edit-actions { display: flex; justify-content: flex-end; gap: 8px; padding: 12px 0; }
#kbVditor { border-radius: 8px; overflow: hidden; }

/* Search results */
.kb-search-result { display: block !important; padding: 8px 12px !important; }
.kb-search-snippet { font-size: 12px; color: var(--color-text-tertiary); margin-top: 4px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Recent visits & favorites */
.kb-section { margin-bottom: 24px; }
.kb-section-title { font-size: 14px; font-weight: 600; color: var(--color-text-secondary); margin-bottom: 12px; }
.kb-recent-list { display: flex; flex-wrap: wrap; gap: 12px; }
.kb-recent-item {
  display: flex; align-items: center; gap: 8px; padding: 8px 14px;
  background: var(--color-white); border: 1px solid var(--color-border-light);
  border-radius: 8px; cursor: pointer; transition: all 0.15s; min-width: 200px;
}
.kb-recent-item:hover { border-color: var(--color-primary); box-shadow: 0 2px 8px rgba(51,112,255,0.1); }
.kb-recent-icon { font-size: 20px; }
.kb-recent-info { flex: 1; min-width: 0; }
.kb-recent-name { font-size: 13px; font-weight: 500; color: var(--color-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kb-recent-meta { font-size: 11px; color: var(--color-text-tertiary); margin-top: 2px; }

/* Recycle bin */
.kb-recycle-list { max-height: 400px; overflow-y: auto; }
.kb-recycle-item {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px; border-bottom: 1px solid var(--color-border-light);
}
.kb-recycle-item:last-child { border-bottom: none; }
.kb-recycle-info { display: flex; align-items: center; gap: 10px; }
.kb-recycle-icon { font-size: 20px; }
.kb-recycle-name { font-size: 14px; font-weight: 500; color: var(--color-text); }
.kb-recycle-meta { font-size: 12px; color: var(--color-text-tertiary); margin-top: 2px; }
.kb-recycle-actions { display: flex; gap: 6px; }

/* Empty state */
.kb-empty { text-align: center; padding: 40px 20px; color: var(--color-text-tertiary); }
.kb-empty-icon { font-size: 48px; margin-bottom: 12px; }
.kb-empty p { margin: 4px 0; font-size: 14px; }
.kb-empty-hint { color: var(--color-text-tertiary); font-size: 13px; }
.kb-empty-sm { font-size: 13px; color: var(--color-text-tertiary); padding: 12px; text-align: center; }
.kb-empty-sm a { cursor: pointer; }

/* Context menu danger item */
.kb-ctx-danger { color: var(--color-danger) !important; }

/* Danger button */
.kb-btn-danger { color: var(--color-danger); border-color: var(--color-danger); }
.kb-btn-danger:hover { background: var(--color-danger); color: #fff; }

/* List header actions */
.kb-list-actions { display: flex; gap: 8px; align-items: center; }

/* Card meta */
.kb-card-meta { font-size: 12px; color: var(--color-text-tertiary); margin-top: 4px; }

/* Permission add row */
.kb-perm-add { display: flex; gap: 8px; align-items: center; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--color-border-light); }
.kb-perm-add select { padding: 6px 10px; border: 1px solid var(--color-border); border-radius: 4px; font-size: 13px; }

/* Large modal */
.kb-modal-lg { max-width: 560px; width: 90vw; }

/* Vditor overrides */
.vditor { border: none !important; }
.vditor-toolbar { border-bottom: 1px solid var(--color-border-light) !important; }

/* Content area relative positioning for action bar */
.kb-content { position: relative; }

/* Card grid improvement */
.kb-card-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 16px; }

/* Card drag visual */
.kb-card[draggable="true"]:active { opacity: 0.6; }

/* Tree row hover - show add button */
.kb-tree-row:hover { background: var(--color-bg-hover); }
/* ===== Knowledge Base v2.2 CSS Additions ===== */

/* Tree connection lines */
.kb-tree-node { position: relative; }
.kb-tree-line {
  position: absolute; top: 0; bottom: 0; width: 1px;
  background: var(--color-border-light); pointer-events: none;
}
.kb-tree-node[data-level="0"] > .kb-tree-row { padding-left: 12px; }

/* "+" button always visible (not just hover) */
.kb-tree-actions {
  display: flex !important;
  opacity: 0.3;
  transition: opacity 0.15s;
  flex-shrink: 0;
  margin-left: 4px;
}
.kb-tree-row:hover .kb-tree-actions { opacity: 1; }
.kb-tree-add {
  background: none; border: none; color: var(--color-text-tertiary);
  cursor: pointer; font-size: 14px; padding: 2px 6px; line-height: 1;
  border-radius: 4px; transition: all 0.15s;
}
.kb-tree-add:hover {
  color: var(--color-primary);
  background: var(--color-primary-light);
}

/* Tree arrow improvements */
.kb-tree-arrow {
  width: 16px; text-align: center; font-size: 9px;
  color: var(--color-text-tertiary); transition: transform .15s;
  flex-shrink: 0; cursor: pointer; user-select: none;
}
.kb-tree-arrow:hover { color: var(--color-text-secondary); }
.kb-tree-arrow.expanded { transform: rotate(90deg); }

/* Tree icon colors */
.kb-tree-icon { font-size: 14px; margin-right: 6px; flex-shrink: 0; }

/* Tree row improvements */
.kb-tree-row {
  display: flex; align-items: center; height: 32px;
  cursor: pointer; padding-right: 8px; position: relative;
  border-radius: 4px; margin: 1px 4px;
  transition: background 0.1s;
}
.kb-tree-row:hover { background: var(--color-bg-hover); }
.kb-tree-row.active {
  background: var(--color-primary-light);
  color: var(--color-primary);
}
.kb-tree-row.active .kb-tree-name { font-weight: 500; }

/* ONLYOFFICE editor loading */
.kb-editor-loading {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
  text-align: center; color: var(--color-text-tertiary);
}
.kb-editor-loading p { margin-top: 12px; font-size: 13px; }
.kb-spinner {
  width: 32px; height: 32px; margin: 0 auto;
  border: 3px solid var(--color-border-light);
  border-top-color: var(--color-primary);
  border-radius: 50%; animation: kb-spin 0.8s linear infinite;
}
@keyframes kb-spin { to { transform: rotate(360deg); } }

/* Editor frame */
.kb-editor-wrap {
  position: relative; width: 100%; height: 100%;
  overflow: hidden;
}
.kb-editor-frame {
  width: 100%; height: 100%; border: none; display: block;
}

/* File info view (unknown types) */
.kb-file-info {
  display: flex; flex-direction: column; align-items: center;
  justify-content: center; height: 100%; gap: 12px; padding: 40px;
}
.kb-file-info-icon { font-size: 48px; }
.kb-file-info-name {
  font-size: 16px; font-weight: 500; color: var(--color-text);
}
.kb-file-info-meta {
  font-size: 13px; color: var(--color-text-tertiary);
}

/* Image viewer */
.kb-image-viewer {
  display: flex; align-items: center; justify-content: center;
  height: 100%; padding: 24px; overflow: auto;
}
.kb-image-viewer img {
  max-width: 100%; max-height: 100%; border-radius: 4px;
  cursor: zoom-in; transition: transform 0.2s;
  box-shadow: 0 2px 12px rgba(0,0,0,0.08);
}
.kb-image-viewer img.kb-img-zoom {
  max-width: none; max-height: none; cursor: zoom-out;
  transform: scale(1.5);
}

/* Video viewer */
.kb-video-viewer {
  display: flex; align-items: center; justify-content: center;
  height: 100%; padding: 24px;
}
.kb-video-viewer video {
  max-width: 100%; max-height: 100%; border-radius: 4px;
}

/* Upload modal */
.kb-upload-zone {
  border: 2px dashed var(--color-border); border-radius: 8px;
  padding: 32px 16px; text-align: center; cursor: pointer;
  transition: all 0.15s; background: var(--color-bg);
}
.kb-upload-zone:hover { border-color: var(--color-primary); background: var(--color-primary-light); }
.kb-upload-zone.kb-drag-active {
  border-color: var(--color-primary); background: var(--color-primary-light);
  border-style: solid;
}
.kb-upload-icon { font-size: 32px; margin-bottom: 8px; }
.kb-upload-text { font-size: 14px; color: var(--color-text); margin-bottom: 4px; }
.kb-upload-hint { font-size: 12px; color: var(--color-text-tertiary); }
.kb-file-name-display { margin-top: 8px; }
.kb-file-selected {
  display: flex; align-items: center; justify-content: space-between;
  padding: 8px 12px; background: var(--color-primary-light);
  border-radius: 6px; font-size: 13px;
}
.kb-file-selected .kb-file-size { color: var(--color-text-tertiary); font-size: 12px; }

/* Empty state with guidance */
.kb-empty-sm {
  text-align: center; padding: 24px 16px;
  color: var(--color-text-tertiary); font-size: 13px;
}
.kb-empty-icon-sm { font-size: 32px; margin-bottom: 8px; }

/* Action bar improvements */
.kb-action-bar {
  position: absolute; top: 8px; right: 16px;
  display: flex; gap: 8px; z-index: 5;
}

/* Search result snippet */
.kb-search-snippet {
  font-size: 11px; color: var(--color-text-tertiary);
  margin-top: 2px; white-space: nowrap;
  overflow: hidden; text-overflow: ellipsis;
  max-width: 200px;
}

/* Drag visual feedback */
.kb-drag-over {
  background: var(--color-primary-light) !important;
  border: 2px dashed var(--color-primary) !important;
  border-radius: 4px !important;
}
.kb-tree-row[draggable="true"] { cursor: move; }

/* Markdown body typography (optimized) */
.kb-md-body {
  font-size: 14px; line-height: 1.8; color: var(--color-text);
  max-width: 760px; padding: 24px 32px;
}
.kb-md-body h1 {
  font-size: 24px; font-weight: 600; margin: 24px 0 16px;
  padding-bottom: 8px; border-bottom: 1px solid var(--color-border-light);
}
.kb-md-body h2 {
  font-size: 20px; font-weight: 600; margin: 20px 0 12px;
}
.kb-md-body h3 {
  font-size: 17px; font-weight: 600; margin: 16px 0 10px;
}
.kb-md-body h4 {
  font-size: 15px; font-weight: 600; margin: 14px 0 8px;
}
.kb-md-body h5 { font-size: 14px; font-weight: 600; margin: 12px 0 6px; }
.kb-md-body h6 { font-size: 13px; font-weight: 600; margin: 10px 0 6px; color: var(--color-text-secondary); }
.kb-md-body p { margin: 10px 0; }
.kb-md-body ul, .kb-md-body ol { margin: 10px 0; padding-left: 24px; }
.kb-md-body li { margin: 4px 0; }
.kb-md-body ul li { list-style: disc; }
.kb-md-body ol li { list-style: decimal; }
.kb-md-body blockquote {
  margin: 12px 0; padding: 8px 16px;
  border-left: 3px solid var(--color-primary);
  background: var(--color-primary-light);
  border-radius: 0 4px 4px 0;
  color: var(--color-text-secondary);
}
.kb-md-body code {
  font-family: 'Menlo', 'Monaco', 'Courier New', monospace;
  font-size: 13px; background: var(--color-bg-hover);
  padding: 2px 6px; border-radius: 3px;
  color: #e83e8c;
}
.kb-md-body pre {
  background: #1e1e1e; color: #d4d4d4;
  padding: 16px; border-radius: 8px;
  overflow-x: auto; margin: 12px 0; font-size: 13px;
  line-height: 1.6;
}
.kb-md-body pre code {
  background: none; color: inherit; padding: 0;
}
.kb-md-body table {
  border-collapse: collapse; width: 100%; margin: 12px 0;
  font-size: 13px;
}
.kb-md-body th, .kb-md-body td {
  border: 1px solid var(--color-border); padding: 8px 12px;
}
.kb-md-body th {
  background: var(--color-bg-hover); font-weight: 600;
}
.kb-md-body tr:nth-child(even) { background: var(--color-bg); }
.kb-md-body img { max-width: 100%; border-radius: 4px; margin: 8px 0; }
.kb-md-body a { color: var(--color-primary); text-decoration: none; }
.kb-md-body a:hover { text-decoration: underline; }
.kb-md-body hr {
  border: none; border-top: 1px solid var(--color-border-light);
  margin: 20px 0;
}

/* Text view */
.kb-text-view {
  font-family: 'Menlo', 'Monaco', 'Courier New', monospace;
  font-size: 13px; line-height: 1.6; color: var(--color-text);
  padding: 24px 32px; white-space: pre-wrap; word-break: break-all;
  max-width: 760px;
}

/* Modal select styling */
.kb-modal-input { cursor: pointer; }
select.kb-modal-input { cursor: pointer; }

/* Context menu icon */
.kb-ctx-icon { margin-right: 8px; }

/* Content area */
.kb-content {
  flex: 1; overflow: hidden; position: relative;
  background: var(--color-white);
}

/* Sidebar tree container */
.kb-tree {
  flex: 1; overflow-y: auto; overflow-x: hidden;
  padding: 4px 0;
}

/* ===== KB v2.3 Styles ===== */

/* Color label bar on tree items */
.kb-tree-colorbar {
  display: inline-block;
  width: 3px;
  height: 14px;
  border-radius: 2px;
  margin-right: 4px;
  vertical-align: middle;
  flex-shrink: 0;
}

/* Sidebar collapsed state */
.kb-columns.kb-sidebar-collapsed .kb-sidebar {
  display: none;
}
.kb-columns.kb-sidebar-collapsed .kb-outline {
  display: none;
}

/* Who is editing status */
.kb-who-editing {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 4px 12px;
  background: #f0f7ff;
  border-bottom: 1px solid #e0e0e0;
  font-size: 12px;
  min-height: 28px;
}
.kb-editing-badge {
  background: #34c759;
  color: #fff;
  padding: 1px 6px;
  border-radius: 10px;
  font-size: 11px;
}
.kb-editing-user {
  color: #3370ff;
  font-weight: 500;
}
.kb-editing-user::before {
  content: "●";
  margin-right: 2px;
  color: #34c759;
}

/* ONLYOFFICE editor container */
.kb-oo-editor {
  width: 100%;
  height: 100%;
  min-height: 500px;
}

/* Fullscreen mode */
.kb-editor-wrap.kb-fullscreen {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9999;
  background: #fff;
}

/* Operation logs table */
.kb-logs-page {
  padding: 16px 24px;
  overflow-y: auto;
  height: calc(100vh - 120px);
}
.kb-logs-header h3 {
  font-size: 16px;
  color: #1f2329;
  margin: 0 0 16px 0;
}
.kb-logs-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.kb-logs-table th {
  text-align: left;
  padding: 8px 12px;
  background: #f5f6f7;
  color: #646a73;
  font-weight: 500;
  border-bottom: 1px solid #e0e0e0;
  position: sticky;
  top: 0;
  z-index: 1;
}
.kb-logs-table td {
  padding: 8px 12px;
  border-bottom: 1px solid #eceef0;
  color: #1f2329;
}
.kb-logs-table tr:hover td {
  background: #f8f9fa;
}
.kb-log-time {
  color: #8f959e;
  white-space: nowrap;
}
.kb-log-action {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 500;
}
.kb-log-detail {
  max-width: 300px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.kb-log-link {
  color: #3370ff;
  text-decoration: none;
}
.kb-log-link:hover {
  text-decoration: underline;
}

/* Version history */
.kb-version-list {
  max-height: 400px;
  overflow-y: auto;
}
.kb-version-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 0;
  border-bottom: 1px solid #eceef0;
}
.kb-version-info {
  display: flex;
  align-items: center;
  gap: 12px;
}
.kb-version-user {
  font-weight: 500;
  color: #1f2329;
}
.kb-version-time {
  color: #8f959e;
  font-size: 12px;
}
.kb-version-size {
  color: #8f959e;
  font-size: 12px;
}

/* Search wrap always visible */
.kb-search-wrap {
  padding: 8px 12px;
  border-bottom: 1px solid #eceef0;
}
.kb-search {
  width: 100%;
  padding: 6px 10px;
  border: 1px solid #e0e0e0;
  border-radius: 6px;
  font-size: 13px;
  outline: none;
  transition: border-color 0.2s;
  box-sizing: border-box;
}
.kb-search:focus {
  border-color: var(--color-primary);
}

/* v2.3.2: Fullscreen exit button */
.kb-fullscreen-exit-btn {
  position: fixed;
  top: 12px;
  right: 16px;
  z-index: 10000;
  padding: 6px 16px;
  background: #3370ff;
  color: #fff;
  border: none;
  border-radius: 6px;
  font-size: 14px;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(0,0,0,0.2);
  transition: background 0.2s;
}
.kb-fullscreen-exit-btn:hover {
  background: #245bdb;
}
/* v2.3.2: Placement buttons */
.kb-placement-btns {
  display: flex;
  gap: 8px;
}
.kb-placement-btn {
  flex: 1;
  padding: 8px 4px;
  border: 1px solid #dee0e3;
  border-radius: 6px;
  background: #fff;
  font-size: 12px;
  cursor: pointer;
  text-align: center;
  transition: all 0.2s;
}
.kb-placement-btn:hover {
  border-color: #3370ff;
  color: #3370ff;
}
.kb-placement-btn.active {
  border-color: #3370ff;
  background: #f0f4ff;
  color: #3370ff;
}

/* ===== Chat Page UI ===== */

/* Chat content wrapper - full-width header layout */
.chat-content-wrapper {
  flex: 1;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.chat-full-header {
  padding: 14px 20px;
  background: var(--color-white);
  border-bottom: 1px solid var(--color-border-light);
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 12px;
}
.chat-full-header h2 {
  font-size: 14px;
  font-weight: 400;
  flex: 1;
}
.chat-content-body {
  flex: 1;
  display: flex;
  overflow: hidden;
}

/* Chat sidebar header (with collapse button) */
.chat-sidebar-header {
  padding: 14px 16px 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-shrink: 0;
}
.chat-sidebar-header .chat-section-label {
  font-size: 15px;
  font-weight: 600;
  color: var(--color-text);
}
.chat-collapse-btn {
  width: 28px;
  height: 28px;
  border-radius: var(--radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: var(--color-text-tertiary);
  transition: transform 0.2s, background 0.15s;
  flex-shrink: 0;
}
.chat-collapse-btn:hover {
  background: var(--color-bg-hover);
  color: var(--color-text);
}
.chat-collapse-btn svg {
  transition: transform 0.2s;
}

/* Chat section labels */
.chat-section-label {
  font-size: 12px;
  color: var(--color-text-tertiary);
  font-weight: 500;
}

/* Chat avatar - circular */
.chat-avatar {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 600;
  color: #fff;
  flex-shrink: 0;
  user-select: none;
}

/* Chat item layout */
.func-item.chat-item {
  position: relative;
}

/* Chat item compact text: smaller fonts, save vertical space */
/* v118（2026-09-09）：紧凑化——目标侧栏放下10~20个Agent（每行约33px） */
.func-nav .func-item.chat-item {
  padding: 6px 10px;
  line-height: 1.35;
  margin-bottom: 2px;
  gap: 8px;
}
.func-nav .chat-item .item-title {
  font-size: 13px;
}
.func-nav .chat-item .item-meta {
  font-size: 10.5px;
  margin-top: 0px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* v119：Agent行头像回调 24→28px（v118过小，一屏12~17个） */
.func-nav .chat-item .chat-avatar {
  width: 28px;
  height: 28px;
  font-size: 12px;
}

/* Agent列表美化（2026-09-04）：侧栏头像立体高光 + hover微放大（行不位移防抖） */
.func-nav .chat-item .chat-avatar {
  box-shadow: inset 0 1px 2px rgba(255,255,255,0.38), 0 1px 3px rgba(31,35,41,0.10);
  transition: transform 0.18s ease;
}
.func-nav .chat-item:hover .chat-avatar { transform: scale(1.08); }
/* 选中不改字重（2026-09-04）：消除 400→500 文字变宽微跳 */
.func-nav .func-item.chat-item.active { font-weight: 400; }
/* 分区标签精修（2026-09-04）：小字号+字距+主色圆点 */
.func-list .chat-section-label {
  font-size: 11px; letter-spacing: 0.5px; color: var(--color-text-quaternary);
  display: flex; align-items: center; gap: 5px;
}
.func-list .chat-section-label::before {
  content: ''; width: 6px; height: 6px; border-radius: 50%;
  background: var(--color-primary); flex-shrink: 0;
}
/* 「查看他人记录」筛选下拉美化（2026-09-04）：统一圆角边框+自定义箭头+主色focus */
.agent-filter-select {
  display: block; margin: 4px 16px 6px;
  width: calc(100% - 32px);
  padding: 6px 10px; padding-right: 28px;
  border: 1px solid var(--color-border-light); border-radius: 8px;
  font-size: 13px; background-color: #fff; color: var(--color-text);
  outline: none; cursor: pointer;
  -webkit-appearance: none; appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%238f959e' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 10px center;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.agent-filter-select:hover { border-color: #c9cdd4; }
.agent-filter-select:focus { border-color: var(--color-primary); box-shadow: 0 0 0 2px rgba(51,112,255,0.12); }

/* Avatar tooltip (hidden by default, shown on hover when collapsed) */
.chat-avatar-tooltip {
  display: none;
  position: absolute;
  left: 56px;
  top: 50%;
  transform: translateY(-50%);
  background: #1f2329;
  color: #fff;
  padding: 5px 12px;
  border-radius: var(--radius-sm);
  font-size: 12px;
  white-space: nowrap;
  z-index: 10;
  box-shadow: var(--shadow-md);
  pointer-events: none;
}

/* === Chat sidebar collapsed state === */
.func-nav.chat-collapsed {
  width: 60px;
}
.func-nav.chat-collapsed .chat-sidebar-header {
  padding: 14px 0 10px;
  justify-content: center;
}
.func-nav.chat-collapsed .chat-sidebar-header .chat-section-label {
  display: none;
}
.func-nav.chat-collapsed .search-box {
  display: none;
}
.func-nav.chat-collapsed .user-bar .info,
.func-nav.chat-collapsed .user-bar .logout {
  display: none;
}
.func-nav.chat-collapsed .user-bar {
  justify-content: center;
  padding: 10px 0;
}
.func-nav.chat-collapsed .func-list .chat-section-label {
  display: none !important; /* ADMIN07b：盖过内联display:flex（我的Agent标签收起态竖排换行bug） */
}
.func-nav.chat-collapsed .func-list { overflow: visible !important; padding: 0 6px 8px; }
.func-nav.chat-collapsed .func-list .func-item {
  justify-content: center;
  padding: 8px 0;
  margin: 0 auto 4px;
}
.func-nav.chat-collapsed .func-item .item-main {
  display: none;
}
.func-nav.chat-collapsed .func-item .chat-avatar {
  width: 30px;
  height: 30px;
  font-size: 12px;
}
.func-nav.chat-collapsed .func-item:hover .chat-avatar-tooltip {
  display: block;
}
/* Hide the divider lines when collapsed */
.func-nav.chat-collapsed .func-list > div[style*="height:1px"] {
  display: none;
}

/* ===== ADMIN07b 收起态漏项补充 2026-09-12 ===== */
.func-nav.chat-collapsed .func-item .conv-state { display: none !important; } /* 收起态时间文字与头像重叠 */
.func-nav.chat-collapsed .func-item .agent-ops { display: none !important; } /* 收起态隐藏操作按钮组 */
.func-nav.chat-collapsed .agent-conv-list { display: none !important; } /* 收起态隐藏会话子列表防溢出 */
.func-nav.chat-collapsed #agentUserList { display: none !important; } /* 收起态隐藏他人记录用户列表 */
@keyframes spin{to{transform:rotate(360deg);}}

/* LLM上下文查看器 v2 */
.ai-context-modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.5);z-index:10000;display:flex;align-items:center;justify-content:center;}
.ai-context-modal{background:var(--color-bg);border-radius:12px;width:90%;max-width:900px;max-height:85vh;display:flex;flex-direction:column;box-shadow:0 8px 32px rgba(0,0,0,0.2);}
.ai-context-modal-header{display:flex;justify-content:space-between;align-items:center;padding:14px 20px;border-bottom:1px solid var(--color-border-light);font-weight:600;font-size:15px;}
.ai-context-modal-close{cursor:pointer;font-size:18px;color:var(--color-text-tertiary);}
.ai-context-modal-close:hover{color:var(--color-text);}
.ai-context-modal-body{padding:16px 20px;overflow-y:auto;flex:1;}
.ai-ctx-meta-bar{display:flex;gap:12px;flex-wrap:wrap;padding:8px 12px;background:var(--color-bg-tertiary);border-radius:8px;margin-bottom:12px;font-size:12px;color:var(--color-text-secondary);}
.ai-ctx-section{margin-bottom:16px;}
.ai-ctx-section-title{font-weight:600;font-size:13px;color:var(--color-text);margin-bottom:6px;padding-bottom:4px;border-bottom:1px solid var(--color-border-light);}
.ai-ctx-pre{background:var(--color-bg-tertiary);padding:10px 12px;border-radius:6px;font-size:12px;overflow-x:auto;white-space:pre-wrap;word-break:break-word;max-height:400px;overflow-y:auto;font-family:'SF Mono','Fira Code',monospace;line-height:1.5;}
.ai-ctx-msg{padding:8px 12px;margin-bottom:8px;background:var(--color-bg-tertiary);border-radius:6px;}
.ai-ctx-msg-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px;font-size:12px;font-weight:600;}
.ai-ctx-msg-role{text-transform:uppercase;}
.ai-ctx-msg-len{font-size:11px;color:var(--color-text-tertiary);font-weight:normal;}
.ai-ctx-msg-content{font-size:12px;white-space:pre-wrap;word-break:break-word;max-height:300px;overflow-y:auto;font-family:'SF Mono','Fira Code',monospace;line-height:1.5;color:var(--color-text-secondary);}
.ai-ctx-tool-result{padding:8px 12px;margin-bottom:6px;background:var(--color-bg-tertiary);border-radius:6px;font-size:12px;}

/* ===== AI Backend Panel - Base Components ===== */
.ai-sub-tab{padding:6px 10px;font-size:12px;color:var(--color-text-tertiary);cursor:pointer;border-bottom:2px solid transparent;transition:var(--transition);white-space:nowrap;}
.ai-sub-tab:hover{color:var(--color-text-secondary);}
.ai-sub-tab.active{color:var(--color-primary);border-bottom-color:var(--color-primary);font-weight:600;}
.ai-btn{padding:6px 14px;border:none;border-radius:6px;font-size:12px;cursor:pointer;transition:var(--transition);background:var(--color-primary);color:#fff;}
.ai-btn:hover{opacity:0.85;}
.ai-btn-mini{padding:3px 8px;font-size:11px;border-radius:4px;}
.ai-btn-primary{background:var(--color-primary);color:#fff;}
.ai-btn-secondary{background:var(--color-bg-tertiary);color:var(--color-text-secondary);border:1px solid var(--color-border-light);}
.ai-btn-secondary:hover{background:var(--color-sidebar-hover);}
.ai-btn-danger{background:#f54a4a;color:#fff;}
.ai-input{padding:5px 10px;border:1px solid var(--color-border-light);border-radius:6px;font-size:12px;outline:none;background:var(--color-bg);color:var(--color-text);transition:var(--transition);}
.ai-input:focus{border-color:var(--color-primary);}
.ai-loading{text-align:center;padding:20px;font-size:13px;color:var(--color-text-tertiary);}
.ai-empty{text-align:center;padding:30px 10px;font-size:13px;color:var(--color-text-tertiary);}
.ai-filter-btn{padding:3px 10px;font-size:11px;border:1px solid var(--color-border-light);border-radius:12px;background:var(--color-bg);color:var(--color-text-tertiary);cursor:pointer;transition:var(--transition);white-space:nowrap;}
.ai-filter-btn:hover{color:var(--color-text-secondary);border-color:var(--color-text-tertiary);}
.ai-filter-btn.active{background:var(--color-primary);color:#fff;border-color:var(--color-primary);}
.ai-dot{display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:4px;}

/* ===== AI Backend Panel - Log Items ===== */
.ai-log-timeline{display:flex;flex-direction:column;gap:0;}
.ai-log-type-tabs{display:flex;gap:4px;margin-bottom:8px;flex-wrap:wrap;}
.ai-log-group{margin-bottom:12px;border:1px solid var(--color-border-light);border-radius:8px;overflow:hidden;}
.ai-log-group-header{display:flex;justify-content:space-between;align-items:center;padding:6px 10px;background:var(--color-bg-tertiary);font-size:12px;font-weight:600;color:var(--color-text-secondary);}
.ai-log-group-body{display:flex;flex-direction:column;}
.ai-log-item{border-top:1px solid var(--color-border-light);}
.ai-log-item:first-child{border-top:none;}
.ai-log-item-header{display:flex;justify-content:space-between;align-items:center;padding:7px 10px;cursor:pointer;transition:background 0.15s;gap:6px;}
.ai-log-item-header:hover{background:var(--color-sidebar-hover);}
.ai-log-item-left{display:flex;align-items:center;gap:6px;flex:1;min-width:0;overflow:hidden;}
.ai-log-item-right{display:flex;align-items:center;gap:6px;flex-shrink:0;}
.ai-log-type-badge{font-size:10px;padding:2px 6px;border-radius:4px;font-weight:600;white-space:nowrap;flex-shrink:0;}
.ai-log-type-llm{background:#e8f0fe;color:#1967d2;}
.ai-log-type-gen{background:#fef7e0;color:#b06000;}
.ai-log-type-chat{background:#e6f4ea;color:#137333;}
.ai-log-type-tool{background:#f3e8fd;color:#8430ce;}
.ai-log-type-other{background:#f0f1f5;color:#5f6368;}
.ai-log-expand{font-size:10px;color:var(--color-text-tertiary);transition:transform 0.2s;}
.ai-log-detail{padding:8px 10px;background:var(--color-bg-secondary);border-top:1px solid var(--color-border-light);}
.ai-log-detail-section{margin-bottom:8px;}
.ai-log-detail-section:last-child{margin-bottom:0;}
.ai-log-detail-label{display:inline-block;font-size:11px;font-weight:600;color:var(--color-text-tertiary);margin-bottom:3px;text-transform:uppercase;letter-spacing:0.3px;}
.ai-log-detail-pre{background:var(--color-bg-tertiary);padding:6px 8px;border-radius:4px;font-size:11px;overflow-x:auto;white-space:pre-wrap;word-break:break-word;max-height:200px;overflow-y:auto;font-family:'SF Mono','Fira Code','Consolas',monospace;line-height:1.4;color:var(--color-text-secondary);}
.ai-log-detail-error{background:#fef0f0;color:#f54a4a;border:1px solid #fde2e2;}
.ai-log-stats{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:6px;}
.ai-log-stat{font-size:10px;color:var(--color-text-tertiary);background:var(--color-bg-tertiary);padding:2px 6px;border-radius:3px;}
.ai-log-status{font-size:10px;padding:1px 5px;border-radius:3px;font-weight:600;}
.ai-log-status.success{background:#e6f4ea;color:#137333;}
.ai-log-status.fail{background:#fef0f0;color:#f54a4a;}
.ai-log-status.deny{background:#fef7e0;color:#b06000;}
.ai-log-pagination{display:flex;justify-content:center;align-items:center;gap:8px;margin-top:10px;}
.ai-log-pagination button{padding:3px 10px;font-size:11px;border:1px solid var(--color-border-light);border-radius:4px;background:var(--color-bg);cursor:pointer;color:var(--color-text-secondary);}
.ai-log-pagination button:disabled{opacity:0.4;cursor:default;}
.ai-log-pagination button:not(:disabled):hover{border-color:var(--color-primary);color:var(--color-primary);}
.ai-log-pagination .page-info{font-size:11px;color:var(--color-text-tertiary);}
.ai-log-video-card{margin:6px 0;padding:8px;background:var(--color-bg-tertiary);border-radius:6px;border:1px solid var(--color-border-light);}
.ai-log-video-row{display:flex;gap:6px;align-items:center;font-size:11px;margin:3px 0;color:var(--color-text-secondary);}

/* ===== AI Backend Panel - Log Context Messages (inline) ===== */
.ai-log-ctx-msg{padding:6px 8px;margin-bottom:6px;border-radius:6px;border-left:3px solid;font-size:11px;}
.ai-log-ctx-msg-role{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:0.5px;margin-bottom:3px;display:flex;justify-content:space-between;align-items:center;}
.ai-log-ctx-msg-len{font-size:9px;color:var(--color-text-tertiary);font-weight:normal;}
.ai-log-ctx-msg-content{font-size:11px;white-space:pre-wrap;word-break:break-word;max-height:180px;overflow-y:auto;font-family:'SF Mono','Fira Code','Consolas',monospace;line-height:1.4;color:var(--color-text-secondary);}
.ai-log-ctx-msg-system{background:#f3e8fd;border-left-color:#8430ce;}
.ai-log-ctx-msg-system .ai-log-ctx-msg-role{color:#8430ce;}
.ai-log-ctx-msg-user{background:#e8f0fe;border-left-color:#1967d2;}
.ai-log-ctx-msg-user .ai-log-ctx-msg-role{color:#1967d2;}
.ai-log-ctx-msg-assistant{background:#e6f4ea;border-left-color:#137333;}
.ai-log-ctx-msg-assistant .ai-log-ctx-msg-role{color:#137333;}
.ai-log-ctx-msg-tool{background:#fef7e0;border-left-color:#b06000;}
.ai-log-ctx-msg-tool .ai-log-ctx-msg-role{color:#b06000;}

/* ===== AI后端日志系统 v3 CSS ===== */

/* Meta bar - 顶部信息栏 */
.ai-log-meta-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  padding: 8px 10px;
  margin-bottom: 8px;
  background: var(--color-bg-tertiary, #f5f5f5);
  border-radius: 6px;
  font-size: 12px;
  color: var(--color-text-secondary, #666);
}
.ai-log-meta-bar strong { color: var(--color-text, #333); }

/* Meta grid - 网格布局 */
.ai-log-meta-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 4px 12px;
  font-size: 12px;
  color: var(--color-text-secondary, #666);
}
.ai-log-meta-grid code {
  font-family: 'SF Mono', Monaco, monospace;
  font-size: 11px;
  color: var(--color-text-tertiary, #999);
  word-break: break-all;
}

/* Tool call */
.ai-log-tool-call {
  margin: 4px 0;
  padding: 6px 8px;
  border-left: 3px solid #1890ff;
  background: rgba(24, 144, 255, 0.04);
  border-radius: 0 4px 4px 0;
}
.ai-log-tool-call-name {
  font-weight: 600;
  font-size: 12px;
  color: #1890ff;
  margin-bottom: 4px;
}

/* Tool result */
.ai-log-tool-result {
  margin: 4px 0;
  padding: 6px 8px;
  border-radius: 0 4px 4px 0;
}
.ai-log-tool-ok {
  border-left: 3px solid #22c55e;
  background: rgba(34, 197, 94, 0.04);
}
.ai-log-tool-fail {
  border-left: 3px solid #ef4444;
  background: rgba(239, 68, 68, 0.04);
}
.ai-log-tool-result-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 4px;
  font-size: 12px;
  font-weight: 600;
}
.ai-log-tool-result-time {
  font-size: 11px;
  color: var(--color-text-tertiary, #999);
  font-weight: 400;
}

/* Context message - clickable header */
.ai-log-ctx-msg-header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 8px;
  background: var(--color-bg-tertiary, #f5f5f5);
  border-radius: 4px;
  margin-bottom: 2px;
  user-select: none;
  transition: background 0.15s;
}
.ai-log-ctx-msg-header:hover {
  background: var(--color-bg, #e8e8e8);
}
.ai-log-ctx-msg-role {
  font-weight: 600;
  font-size: 12px;
  flex-shrink: 0;
}
.ai-log-ctx-msg-len {
  font-size: 11px;
  color: var(--color-text-tertiary, #999);
}
.ai-log-ctx-msg-toggle {
  margin-left: auto;
  font-size: 11px;
  color: #1890ff;
  cursor: pointer;
}

/* Context message content */
.ai-log-ctx-msg-content,
.ai-log-ctx-msg-full {
  font-family: 'SF Mono', Monaco, 'Courier New', monospace;
  font-size: 12px;
  line-height: 1.5;
  padding: 6px 8px;
  margin: 0;
  white-space: pre-wrap;
  word-break: break-all;
  color: var(--color-text, #333);
  max-height: 600px;
  overflow-y: auto;
}

/* Log group header */
.ai-log-group-header {
  font-size: 11px;
  color: var(--color-text-tertiary, #999);
  padding: 6px 0 4px;
  border-bottom: 1px dashed var(--color-border-light, #e8e8e8);
  margin-bottom: 4px;
}

/* Detail section improvements */
.ai-log-detail-section {
  margin-bottom: 10px;
}
.ai-log-detail-label {
  display: block;
  font-size: 12px;
  font-weight: 600;
  color: var(--color-text-secondary, #666);
  margin-bottom: 4px;
}
.ai-log-detail-pre {
  font-family: 'SF Mono', Monaco, 'Courier New', monospace;
  font-size: 12px;
  line-height: 1.5;
  padding: 8px;
  margin: 0;
  background: var(--color-bg-tertiary, #f5f5f5);
  border-radius: 4px;
  white-space: pre-wrap;
  word-break: break-all;
  max-height: 500px;
  overflow-y: auto;
  color: var(--color-text, #333);
}
.ai-log-detail-error {
  background: rgba(239, 68, 68, 0.05);
  color: #c0392b;
}

/* Log item */
.ai-log-item {
  border: 1px solid var(--color-border-light, #e8e8e8);
  border-radius: 6px;
  margin-bottom: 4px;
  overflow: hidden;
  background: var(--color-bg-primary, #fff);
}
.ai-log-item-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 6px 10px;
  cursor: pointer;
  transition: background 0.15s;
}
.ai-log-item-header:hover {
  background: var(--color-bg-tertiary, #f5f5f5);
}
.ai-log-item-left {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 1;
  min-width: 0;
}
.ai-log-item-right {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
.ai-log-expand {
  font-size: 10px;
  color: var(--color-text-tertiary, #999);
  flex-shrink: 0;
}

/* Type badges */
.ai-log-type-badge {
  font-size: 10px;
  font-weight: 600;
  padding: 1px 6px;
  border-radius: 3px;
  flex-shrink: 0;
}
.ai-log-type-llm { background: rgba(24,144,255,0.12); color: #1890ff; }
.ai-log-type-gen { background: rgba(245,158,11,0.12); color: #d97706; }
.ai-log-type-chat { background: rgba(34,197,94,0.12); color: #16a34a; }
.ai-log-type-other { background: rgba(107,114,128,0.12); color: #6b7280; }

/* Status badges */
.ai-log-status {
  font-size: 10px;
  padding: 1px 6px;
  border-radius: 3px;
  font-weight: 600;
}
.ai-log-status-success { background: rgba(34,197,94,0.12); color: #16a34a; }
.ai-log-status-fail { background: rgba(239,68,68,0.12); color: #dc2626; }
.ai-log-status-deny { background: rgba(245,158,11,0.12); color: #d97706; }

/* Detail container */
.ai-log-detail {
  padding: 10px;
  border-top: 1px solid var(--color-border-light, #e8e8e8);
  background: var(--color-bg, #fafafa);
}

/* Video card */
.ai-log-video-card {
  margin: 6px 0;
}

/* Log timeline */
.ai-log-timeline {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.ai-log-group {
  margin-bottom: 8px;
}
.ai-log-group-body {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

/* Context message card */
.ai-log-ctx-msg {
  margin: 4px 0;
  border-radius: 4px;
  overflow: hidden;
  border: 1px solid var(--color-border-light, #e8e8e8);
}
.ai-log-ctx-msg-system { border-left: 3px solid #8b5cf6; }
.ai-log-ctx-msg-user { border-left: 3px solid #3b82f6; }
.ai-log-ctx-msg-assistant { border-left: 3px solid #22c55e; }
.ai-log-ctx-msg-tool { border-left: 3px solid #f59e0b; }

/* ============================================================
   注册功能样式 — 追加到 public/css/style.css 末尾
   所有类名统一 .auth-register-* 前缀，不污染现有样式
   ============================================================ */

/* 登录卡片底部注册入口 */
.auth-register-entry {
  text-align: center;
  margin-top: 16px;
  font-size: 13px;
  color: var(--color-text-tertiary, #94a3b8);
}
.auth-register-entry a {
  color: var(--color-primary, #3b82f6);
  text-decoration: none;
  font-weight: 500;
}
.auth-register-entry a:hover { text-decoration: underline; }

/* 注册弹窗卡片宽度 */
.auth-register-modal .modal-card {
  max-width: 440px;
  width: 90%;
}
.auth-register-card {
  max-height: 90vh;
  overflow-y: auto;
}
.auth-register-tip {
  font-size: 12px;
  color: var(--color-text-tertiary, #94a3b8);
  margin: 4px 0 16px;
}
.auth-required { color: #ef4444; }

/* 表单两列布局 */
.auth-register-card .form-row {
  display: flex;
  gap: 12px;
}
.auth-register-card .form-row .form-group { flex: 1; }

/* 验证码输入+按钮一行 */
.auth-sms-row {
  display: flex;
  gap: 8px;
}
.auth-sms-row input { flex: 1; }
.auth-sms-btn {
  padding: 0 16px;
  height: 40px;
  border: 1px solid var(--color-primary, #3b82f6);
  background: transparent;
  color: var(--color-primary, #3b82f6);
  border-radius: 8px;
  font-size: 13px;
  cursor: pointer;
  white-space: nowrap;
  transition: all 0.2s;
}
.auth-sms-btn:hover:not(:disabled) {
  background: var(--color-primary, #3b82f6);
  color: #fff;
}
.auth-sms-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* 注册结果提示条 */
.auth-register-result {
  margin-top: 12px;
  padding: 10px 14px;
  border-radius: 8px;
  font-size: 13px;
  text-align: center;
}
.auth-register-result.success {
  background: #f0fdf4;
  color: #16a34a;
  border: 1px solid #bbf7d0;
}
.auth-register-result.error {
  background: #fef2f2;
  color: #dc2626;
  border: 1px solid #fecaca;
}

/* ===== 管理页：待审核入口（v1.4 独立按钮+角标） ===== */
/* 工具栏"待审核"按钮（"+入职登记"旁，与 mgmt-btn 同风格） */
.auth-pending-btn { position: relative; }
/* 红色数字角标（按钮右上角圆形） */
.auth-badge-red {
  display: inline-block;
  min-width: 18px;
  height: 18px;
  line-height: 18px;
  padding: 0 5px;
  margin-left: 4px;
  border-radius: 9px;
  background: #ef4444;
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  text-align: center;
  vertical-align: middle;
}
/* 待审核列表弹窗 */
.auth-pending-modal .modal-card {
  max-width: 640px;
  width: 92%;
}
.auth-pending-card {
  max-height: 80vh;
  overflow-y: auto;
}
.auth-pending-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 12px 0 16px;
}
/* 待审核行：信息区 + 审批按钮 */
.auth-pending-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border: 1px solid var(--color-border, #e2e8f0);
  border-radius: 10px;
  background: var(--color-bg, #f8fafc);
}
.auth-pending-info { flex: 1; min-width: 0; }
.auth-pending-name {
  font-size: 14px;
  font-weight: 600;
  color: var(--color-text, #0f172a);
}
.auth-pending-title {
  margin-left: 8px;
  font-size: 12px;
  font-weight: 400;
  color: var(--color-primary, #3b82f6);
}
.auth-pending-meta {
  font-size: 12px;
  color: var(--color-text-tertiary, #94a3b8);
  margin-top: 3px;
  word-break: break-all;
}
.auth-pending-empty {
  padding: 28px 0;
  text-align: center;
  font-size: 13px;
  color: var(--color-text-tertiary, #94a3b8);
}

/* 审批按钮 */
.mgmt-btn-approve {
  color: #16a34a;
  border-color: #86efac;
}
.mgmt-btn-approve:hover { background: #f0fdf4; }
.mgmt-btn-reject {
  color: #dc2626;
  border-color: #fca5a5;
}
.mgmt-btn-reject:hover { background: #fef2f2; }

/* 审批表单弹窗（第二步） */
.auth-approve-modal .modal-card { max-width: 440px; }
.auth-approve-info {
  background: var(--color-bg, #f8fafc);
  padding: 12px 14px;
  border-radius: 8px;
  margin-bottom: 14px;
  font-size: 13px;
  line-height: 1.8;
}
.auth-approve-info strong { color: var(--color-text, #0f172a); }


/* ============================================================
   v1.1 追加：忘记密码 [R9]
   ============================================================ */

/* 入口行分隔符 */
.auth-entry-divider {
  margin: 0 8px;
  color: var(--color-border, #e2e8f0);
}

/* 找回密码弹窗（复用注册卡片样式） */
.auth-forgot-modal .modal-card {
  max-width: 440px;
  width: 90%;
}

/* ============================================================
   v1.5 追加：选项下拉化 + 待审核按钮独立行 [R10/R5.2]
   ============================================================ */

/* 待审核按钮独立行（"+ 入职登记"按钮行下方） */
.auth-pending-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 8px 0 4px;
}

/* "其他"手填兜底输入框（注册/审批弹窗共用） */
.auth-other-input {
  width: 100%;
  margin-top: 8px;
}

/* 下拉控件继承表单样式（注册弹窗 select 与 input 同风格） */
.auth-register-card select,
.auth-approve-modal select {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid var(--color-border, #e2e8f0);
  border-radius: 8px;
  background: var(--color-bg, #fff);
  color: var(--color-text, #0f172a);
  font-size: 14px;
  font-family: inherit;
  cursor: pointer;
  outline: none;
}
.auth-register-card select:focus,
.auth-approve-modal select:focus {
  border-color: var(--color-primary, #3b82f6);
}

/* 审批表单：项目勾选框组（横向流式排列） */
.approve-project-cbs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  margin-top: 8px;
}
.approve-cb-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  color: var(--color-text, #0f172a);
  cursor: pointer;
  user-select: none;
}
.approve-cb-item input[type="checkbox"] {
  width: 16px;
  height: 16px;
  cursor: pointer;
  accent-color: var(--color-primary, #3b82f6);
}

/* ============================================================
   v1.6 追加：验证码登录切换与表单 [R11]
   ============================================================ */
.auth-login-switch {
  text-align: center;
  margin: 4px 0 2px;
}
.auth-login-switch a {
  color: var(--color-primary, #2563eb);
  font-size: 13px;
  cursor: pointer;
  text-decoration: none;
}
.auth-login-switch a:hover {
  text-decoration: underline;
}

/* ===== Forum v2 2026-08-18 (REQ-007 UI优化 | 仅forum-前缀, 隔离不动其他板块) ===== */

/* 顶部视图栏（替代原两层导航：侧栏分区 + 顶栏只留标题和发帖） */
.forum-topbar { display: flex; align-items: center; justify-content: space-between; padding: 2px 2px 14px; }
.forum-view-title { font-size: 16px; font-weight: 600; color: var(--color-text-primary, #1f2329); display: flex; align-items: center; gap: 8px; }
.forum-view-sub { font-size: 12px; font-weight: 400; color: var(--color-text-tertiary, #8f959e); background: var(--color-bg-secondary, #f2f3f5); padding: 2px 8px; border-radius: 10px; }

/* 帖子卡片：hover 层次感 */
.forum-post-card { transition: box-shadow .18s ease, transform .18s ease, border-color .18s ease; cursor: pointer; }
.forum-post-card:hover { box-shadow: 0 6px 18px rgba(31, 35, 41, .09); transform: translateY(-1px); border-color: rgba(51, 112, 255, .45); }
.forum-post-card .forum-post-title { transition: color .15s ease; }
.forum-post-card:hover .forum-post-title { color: var(--color-primary, #3370ff); }
.forum-post-card .post-time { color: var(--color-text-tertiary, #8f959e); }

/* 已编辑标记 */
.edited-tag { display: inline-block; font-size: 11px; font-weight: 400; color: var(--color-text-tertiary, #8f959e); background: var(--color-bg-secondary, #f2f3f5); border-radius: 4px; padding: 1px 6px; margin-left: 8px; vertical-align: 1px; }

/* 浏览量（不可点统计） */
.forum-action.view-stat, .forum-action.static-stat { cursor: default; color: var(--color-text-tertiary, #8f959e); }
.forum-action.view-stat:hover, .forum-action.static-stat:hover { color: var(--color-text-tertiary, #8f959e); }

/* 分类徽章补全（公告通知原无入口无样式） */
.category-badge.公告通知 { background: rgba(255, 149, 2, .12); color: #d97a00; }
.category-badge.讨论区 { background: rgba(51, 112, 255, .1); color: var(--color-primary, #3370ff); }
.category-badge.问答区 { background: rgba(52, 199, 89, .12); color: #2ea121; }

/* 评论操作区：回复/删除并排 */
.comment-actions { display: flex; align-items: center; gap: 12px; margin-top: 4px; }
.comment-del-btn { font-size: 12px; color: var(--color-text-tertiary, #8f959e); cursor: pointer; transition: color .15s ease; }
.comment-del-btn:hover { color: var(--color-danger, #f54a45); }

/* 空状态引导按钮 */
.forum-empty-cta { margin-top: 14px; padding: 8px 22px; border: none; border-radius: 8px; background: var(--color-primary, #3370ff); color: #fff; font-size: 13px; cursor: pointer; transition: opacity .15s ease; }
.forum-empty-cta:hover { opacity: .88; }

/* 评论区空状态 */
.comments-empty { text-align: center; color: var(--color-text-tertiary, #8f959e); font-size: 13px; padding: 26px 0 10px; }

/* 侧边栏个人中心分区与板块分区的间隔 */
#funcNav .func-header { margin-top: 4px; }

/* 发帖按钮微调 */
.forum-new-btn { display: inline-flex; align-items: center; gap: 4px; }

/* ===== Forum v3 2026-08-18 (REQ-004 排序切换 | REQ-006 投票区 | 仅forum-/poll-前缀, 隔离不动其他板块) ===== */

/* 列表顶部：最新/最热排序切换胶囊 */
.forum-topbar { gap: 10px; }
.forum-sort-toggle { display: inline-flex; background: var(--color-bg-secondary, #f2f3f5); border-radius: 8px; padding: 2px; margin-right: auto; margin-left: 4px; }
.forum-sort-toggle .sort-opt { font-size: 12px; padding: 4px 14px; border-radius: 6px; cursor: pointer; color: var(--color-text-secondary, #646a73); transition: all .15s ease; user-select: none; }
.forum-sort-toggle .sort-opt.active { background: #fff; color: var(--color-primary, #3370ff); font-weight: 500; box-shadow: 0 1px 2px rgba(31, 35, 41, .08); }

/* 投票区分类徽章（紫） */
.category-badge.投票区 { background: rgba(112, 64, 255, .1); color: #7040ff; }

/* 卡片投票数统计（不可点） */
.forum-action.poll-stat { cursor: default; color: var(--color-text-tertiary, #8f959e); }
.forum-action.poll-stat:hover { color: var(--color-text-tertiary, #8f959e); }

/* 详情页投票组件 */
.forum-poll-box { background: linear-gradient(180deg, rgba(51, 112, 255, .03), rgba(112, 64, 255, .02)); border: 1px solid rgba(51, 112, 255, .18); border-radius: 10px; padding: 14px 16px; margin: 14px 0 6px; }
.forum-poll-title { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; color: var(--color-text-primary, #1f2329); margin-bottom: 12px; }
.forum-poll-title svg { color: var(--color-primary, #3370ff); }
.poll-mode-tag { font-size: 11px; font-weight: 400; color: var(--color-text-tertiary, #8f959e); background: var(--color-bg-secondary, #f2f3f5); border-radius: 4px; padding: 1px 6px; }
.poll-mode-tag.real { color: #7040ff; background: rgba(112, 64, 255, .1); }
.forum-poll-total { margin-left: auto; font-size: 12px; font-weight: 400; color: var(--color-text-tertiary, #8f959e); }

/* 未投票：单选列表 + 投票按钮 */
.forum-poll-option { display: flex; align-items: center; gap: 10px; padding: 9px 12px; border: 1px solid #e5e7eb; border-radius: 8px; margin-bottom: 8px; cursor: pointer; transition: all .15s ease; font-size: 13px; color: var(--color-text-primary, #1f2329); }
.forum-poll-option:hover { border-color: rgba(51, 112, 255, .5); background: rgba(51, 112, 255, .03); }
.forum-poll-option input[type="radio"] { accent-color: var(--color-primary, #3370ff); cursor: pointer; }
.forum-poll-btn { margin-top: 4px; padding: 8px 26px; border: none; border-radius: 8px; background: var(--color-primary, #3370ff); color: #fff; font-size: 13px; font-weight: 500; cursor: pointer; transition: opacity .15s ease; }
.forum-poll-btn:hover { opacity: .88; }

/* 已投票：条形图结果 */
.forum-poll-result { margin-bottom: 12px; }
.forum-poll-result-head { display: flex; align-items: center; justify-content: space-between; font-size: 13px; margin-bottom: 5px; }
.forum-poll-opt-text { color: var(--color-text-primary, #1f2329); font-weight: 500; }
.forum-poll-num { color: var(--color-text-tertiary, #8f959e); font-size: 12px; }
.poll-my-tag { display: inline-block; font-size: 11px; font-weight: 400; color: var(--color-primary, #3370ff); background: rgba(51, 112, 255, .1); border-radius: 4px; padding: 1px 6px; vertical-align: 1px; }
.forum-poll-bar { height: 10px; background: var(--color-bg-secondary, #f2f3f5); border-radius: 5px; overflow: hidden; }
.forum-poll-bar-fill { height: 100%; border-radius: 5px; background: linear-gradient(90deg, #3370ff, #6e56cf); transition: width .4s ease; }
.forum-poll-result.mine .forum-poll-bar-fill { background: linear-gradient(90deg, #3370ff, #3370ff); box-shadow: 0 0 0 2px rgba(51, 112, 255, .25); }
.forum-poll-result.mine .forum-poll-opt-text { color: var(--color-primary, #3370ff); }
.forum-poll-voters { font-size: 12px; color: var(--color-text-secondary, #646a73); margin-top: 4px; line-height: 1.5; }
.forum-poll-hint { font-size: 11px; color: var(--color-text-tertiary, #8f959e); text-align: right; margin-top: 2px; }

/* 发帖弹窗：投票编辑区 */
.poll-editor-group { background: rgba(51, 112, 255, .03); border: 1px dashed rgba(51, 112, 255, .3); border-radius: 8px; padding: 12px; }
.poll-option-row { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.poll-option-index { width: 18px; height: 18px; border-radius: 50%; background: var(--color-bg-secondary, #f2f3f5); color: var(--color-text-secondary, #646a73); font-size: 11px; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.poll-option-input { flex: 1; }
.poll-option-del { color: var(--color-text-tertiary, #8f959e); font-size: 16px; cursor: pointer; padding: 0 4px; transition: color .15s ease; }
.poll-option-del:hover { color: var(--color-danger, #f54a45); }
.poll-editor-bar { display: flex; align-items: center; justify-content: space-between; margin-top: 4px; }
.poll-add-btn { font-size: 12px; color: var(--color-primary, #3370ff); cursor: pointer; padding: 2px 6px; border-radius: 4px; transition: background .15s ease; }
.poll-add-btn:hover { background: rgba(51, 112, 255, .08); }
.poll-mode-toggle { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--color-text-secondary, #646a73); cursor: pointer; user-select: none; }
/* ===== Forum v4 - REQ-005 最佳答案（2026-08-18）===== */
.solved-badge { display:inline-flex; align-items:center; padding:1px 8px; margin-left:4px; border-radius:10px; font-size:11px; font-weight:600; color:#16a34a; background:rgba(22,163,74,.12); }
.comment-item.solved { border:1px solid rgba(22,163,74,.45); background:rgba(22,163,74,.06); border-radius:8px; padding:12px 10px; margin:8px 0; }
.solved-tag { display:inline-flex; align-items:center; padding:1px 8px; border-radius:10px; font-size:11px; font-weight:600; color:#fff; background:#16a34a; }
.comment-solve-btn { font-size:12px; color:var(--color-primary, #3370ff); cursor:pointer; user-select:none; }
.comment-solve-btn:hover { opacity:.75; }
.comment-solve-btn.active { color:#d97706; }
/* ===== Forum v5 - REQ-007 UI 细节美化（2026-08-18，纯 CSS 零功能影响）===== */

/* ---- 帖子卡片 ---- */
.forum-post-card .forum-post-excerpt {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden; line-height: 1.55; min-height: 40px;
}
.forum-post-card .forum-post-title { font-weight: 600; letter-spacing: .2px; }
.forum-post-card .avatar { box-shadow: 0 0 0 2px var(--color-white), 0 2px 6px rgba(31,35,41,.12); }
.forum-post-card.pinned { background: linear-gradient(90deg, rgba(51,112,255,.045), var(--color-white) 30%); }
.forum-post-images img { transition: transform .18s ease, box-shadow .18s ease; }
.forum-post-images img:hover { transform: scale(1.03); box-shadow: var(--shadow-md); }

/* ---- 详情页 ---- */
.forum-detail-content .post-title { font-size: 18px; font-weight: 700; line-height: 1.45; letter-spacing: .2px; }
.forum-detail-content .post-body { font-size: 14px; line-height: 1.75; color: var(--color-text); white-space: pre-wrap; }
.forum-detail-content .post-images img { border-radius: var(--radius-md); transition: transform .18s ease, box-shadow .18s ease; }
.forum-detail-content .post-images img:hover { transform: scale(1.02); box-shadow: var(--shadow-md); }
.forum-detail-header .back-btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 30px; height: 30px; border-radius: var(--radius-md);
  transition: background .15s ease, color .15s ease; cursor: pointer;
  color: var(--color-text-secondary);
}
.forum-detail-header .back-btn:hover { background: var(--color-bg-hover); color: var(--color-primary); }
.forum-action { border-radius: var(--radius-sm); padding: 4px 8px; transition: background .15s ease, color .15s ease; }
.forum-action:hover { background: var(--color-bg-hover); }

/* ---- 评论区 ---- */
.comment-item { transition: background .15s ease; border-radius: var(--radius-md); padding: 12px 8px; margin: 0 -8px; }
.comment-item:hover { background: rgba(31,35,41,.025); }
.comment-item.solved { margin: 8px -4px; box-shadow: 0 2px 10px rgba(22,163,74,.10); }
.comment-replies {
  margin-left: 18px; padding-left: 12px; border-left: 2px solid var(--color-border-light);
  border-radius: 2px;
}
.comment-replies .comment-item { margin: 0; padding: 10px 8px; }
.comment-input-box textarea {
  transition: border-color .18s ease, box-shadow .18s ease;
}
.comment-input-box textarea:focus {
  border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(51,112,255,.12);
}
.comment-input-box .btn-comment {
  background: linear-gradient(135deg, #3370ff, #4d84ff);
  box-shadow: 0 2px 8px rgba(51,112,255,.28);
  transition: opacity .15s ease, box-shadow .15s ease, transform .1s ease;
}
.comment-input-box .btn-comment:hover { box-shadow: 0 4px 12px rgba(51,112,255,.36); }
.comment-input-box .btn-comment:active { transform: scale(.97); }
.comments-empty {
  text-align: center; padding: 28px 0 20px; color: var(--color-text-quaternary);
  font-size: 13px; letter-spacing: .5px;
}
.comment-reply-btn, .comment-del-btn, .comment-solve-btn { border-radius: 4px; padding: 2px 6px; transition: background .15s ease, opacity .15s ease; }
.comment-reply-btn:hover, .comment-solve-btn:hover { background: var(--color-bg-hover); }
.solved-tag { box-shadow: 0 1px 6px rgba(22,163,74,.35); }

/* ---- 投票组件质感 ---- */
.forum-poll-box { border: 1px solid var(--color-border-light); }
.forum-poll-bar-fill { transition: width .6s cubic-bezier(.25,.8,.35,1); background: linear-gradient(90deg, #3370ff, #5c8dff); border-radius: inherit; }
.forum-poll-result.mine .forum-poll-bar-fill { background: linear-gradient(90deg, #245bdb, #3370ff); }
.forum-poll-btn {
  background: linear-gradient(135deg, #3370ff, #4d84ff);
  box-shadow: 0 2px 8px rgba(51,112,255,.28);
  transition: box-shadow .15s ease, transform .1s ease;
}
.forum-poll-btn:hover { box-shadow: 0 4px 12px rgba(51,112,255,.36); opacity: 1; }
.forum-poll-btn:active { transform: scale(.98); }
.forum-poll-option { border: 1px solid var(--color-border-light); transition: border-color .15s ease, background .15s ease; }
.forum-poll-option:hover { border-color: rgba(51,112,255,.4); background: rgba(51,112,255,.04); }
.forum-poll-option:has(input:checked) { border-color: var(--color-primary); background: rgba(51,112,255,.07); }

/* ---- 徽章微调 ---- */
.solved-badge { box-shadow: inset 0 0 0 1px rgba(22,163,74,.18); }
.pin-badge { box-shadow: inset 0 0 0 1px rgba(51,112,255,.15); }
.edited-tag { font-style: normal; }

/* ---- 排序切换胶囊过渡 ---- */
.forum-sort-toggle .sort-opt { transition: background .15s ease, color .15s ease; }

/* ===== 经营数据 v2：顶栏筛选 + 汇总看板 (2026-08-26) ===== */
.workspace-header { padding: 8px 16px; }
.workspace-header h2 { font-size: 14px; }
.biz-toolbar { display: flex; align-items: center; gap: 6px; }
.biz-toolbar .tb-btn { height: 26px; padding: 0 10px; font-size: 12px; color: var(--color-text-secondary); background: var(--color-white); border: 1px solid var(--color-border); border-radius: 4px; cursor: pointer; line-height: 24px; white-space: nowrap; }
.biz-toolbar .tb-btn:hover { border-color: var(--color-primary); color: var(--color-primary); }
.biz-toolbar .tb-btn.active { background: var(--color-primary); border-color: var(--color-primary); color: #fff; }
.biz-toolbar .tb-btn.tb-icon { width: 26px; padding: 0; text-align: center; font-size: 13px; }
.biz-toolbar .tb-period { font-size: 12px; color: var(--color-text-secondary); min-width: 118px; text-align: center; font-variant-numeric: tabular-nums; white-space: nowrap; }
.biz-toolbar .tb-select { height: 26px; font-size: 12px; padding: 0 4px; max-width: 110px; color: var(--color-text-secondary); background: var(--color-white); border: 1px solid var(--color-border); border-radius: 4px; outline: none; cursor: pointer; }
.biz-toolbar .tb-btn.tb-go { background: var(--color-primary); border-color: var(--color-primary); color: #fff; font-weight: 500; }
.biz-toolbar .tb-btn.tb-go:hover { background: var(--color-primary-hover); color: #fff; }

.sum-board { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 10px; }
.sum-hero { background: var(--color-white); border: 1px solid var(--color-border-light); border-radius: 8px; padding: 14px 16px; position: relative; overflow: hidden; }
.sum-hero::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--color-border); }
.sum-hero .lbl { font-size: 12px; color: var(--color-text-tertiary); margin-bottom: 6px; }
.sum-hero .val { font-size: 22px; font-weight: 700; color: var(--color-text); font-variant-numeric: tabular-nums; line-height: 1.2; }
.sum-hero.gmv::before { background: var(--color-primary); }
.sum-hero.gmv .val { color: var(--color-primary); }
.sum-hero.cost::before { background: var(--color-warning); }
.sum-hero.cost .val { color: var(--color-warning); }
.sum-hero.roi::before { background: var(--color-success); }
.sum-hero.roi .val { color: var(--color-success); }
.sum-hero.settle::before { background: var(--color-primary); opacity: .35; }
.sum-sub { display: flex; gap: 10px; }
.sum-sub .sum-item { flex: 1; display: flex; align-items: center; justify-content: space-between; background: var(--color-white); border: 1px solid var(--color-border-light); border-radius: 8px; padding: 10px 14px; font-size: 12px; color: var(--color-text-secondary); }
.sum-sub .sum-item b { font-size: 13px; color: var(--color-text); font-variant-numeric: tabular-nums; }

/* ===== 经营数据 v3：表头吸顶 + 首列固定 + 账号列收窄 (2026-08-26) ===== */
.live-detail-table thead th { position: sticky; top: 0; z-index: 6; box-shadow: 0 1px 0 var(--color-border); }
.live-detail-table thead th:first-child { z-index: 7; }
.live-detail-table td:first-child, .live-detail-table thead th:first-child { position: sticky; left: 0; }
.live-detail-table td:first-child { background: var(--color-white); z-index: 4; }
.live-detail-table tbody tr:hover td:first-child { background: var(--color-bg-hover); }
.live-detail-table th.acct-col, .live-detail-table td.acct-cell { max-width: 88px; white-space: normal; word-break: break-all; line-height: 1.3; padding-left: 4px; padding-right: 4px; }

/* 修正：日期列 sticky 仅作用于主行，展开行不受影响 */
.live-detail-table thead th:first-child { position: sticky; left: 0; }
.live-detail-table tbody tr.ld-main-row td:first-child { position: sticky; left: 0; background: var(--color-white); z-index: 4; }
.live-detail-table tbody tr.ld-main-row:hover td:first-child { background: var(--color-bg-hover); }

/* ===== v4：账号列改名 + 最多2行截断 (2026-08-26) ===== */
.live-detail-table th.acct-col { max-width: 100px; }
.live-detail-table td.acct-cell { max-width: 100px; padding-left: 4px; padding-right: 4px; }
.live-detail-table td.acct-cell .acct-txt { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; word-break: break-all; line-height: 1.3; white-space: normal; }

/* ===== v5：账号列置首 + 紧凑排版 (2026-08-26) ===== */
.live-detail-table th { padding: 5px 6px; }
.live-detail-table td { padding: 4px 6px; line-height: 1.25; }
.live-detail-table td.num { font-size: 12px; }

/* ===== v6：账号列修复压扁 + 字号 11px (2026-08-26) ===== */
.live-detail-table th.acct-col, .live-detail-table td.acct-cell { min-width: 100px; width: 100px; max-width: 100px; }
.live-detail-table th, .live-detail-table td { font-size: 11px; }
.live-detail-table td.num { font-size: 11px; }
.live-detail-table td.acct-cell .acct-txt { line-height: 1.4; }

/* ===== v7：表格独立滚动 + 列斑马纹 + hover 高亮 (2026-08-26) ===== */
.live-table-wrap { max-height: calc(100vh - 150px); overflow: auto; }
.live-detail-table tbody tr.ld-main-row td:nth-child(even) { background: #fafbfc; }
.live-detail-table tbody tr.ld-main-row td:nth-child(odd) { background: var(--color-white); }
.live-detail-table tbody tr.ld-main-row:hover td,
.live-detail-table tbody tr.ld-main-row:hover td:first-child { background: var(--color-bg-active); }

/* ===== v8：表头行高压缩 (2026-08-26) ===== */
.live-detail-table thead th { white-space: nowrap; padding: 3px 5px; line-height: 1.2; }

/* ===== v9：表格区顶满 + 两侧留白 10px (2026-08-26) ===== */
.biz-live-page { padding: 10px; }
.live-table-wrap { max-height: calc(100vh - 60px); }

/* ===== v10：删箭头列，整行点击展开 (2026-08-26) ===== */
.ld-main-row { cursor: pointer; }

/* ============================================================
   REQ-ADMIN01（2026-09-02）：管理页人员管理弹窗居中
   仅覆盖人员管理三个弹窗：#editStaffModal(编辑/入职登记)、
   #pendingModal(待审核列表)、#approveModal(审批表单)。
   不影响其他弹窗（注册/忘记密码/修改密码/发帖等）。
   ============================================================ */
#editStaffModal.active,
#pendingModal.active,
#approveModal.active {
  display: flex;
  align-items: center;
  justify-content: center;
}
/* 审批弹窗限高防超高裁顶（编辑弹窗内联限高85vh、待审核弹窗.auth-pending-card限高80vh） */
#approveModal .modal-card {
  max-height: 85vh;
  overflow-y: auto;
}

/* message-list custom scrollbar (20260902) */
.message-list { scrollbar-width: thin; scrollbar-color: rgba(0,0,0,0.25) transparent; }
.message-list::-webkit-scrollbar { width: 5px; }
.message-list::-webkit-scrollbar-track { background: transparent; }
.message-list::-webkit-scrollbar-thumb { background: rgba(0,0,0,0.18); border-radius: 3px; }
.message-list::-webkit-scrollbar-thumb:hover { background: rgba(0,0,0,0.32); }


/* ===== v62: 面板宽度拖拽（dock 工具面板 task.js + AI后端文件栏 ai-files.js；热区由 task.js 守护自动复活） ===== */
.tool-panel { position: relative; }
.tool-bar { position: relative; }
.tool-panel.dragging { transition: none !important; }
.dock-panel-resizer {
  display: none; position: absolute; left: -5px; top: 0; bottom: 0; width: 10px;
  cursor: col-resize; z-index: 30; background: transparent;
}
.dock-panel-resizer::after { content: ''; position: absolute; left: 50%; transform: translateX(-50%); top: 0; bottom: 0; width: 2px; background: transparent; }
.dock-panel-resizer:hover::after, .dock-panel-resizer:active::after { background: var(--color-primary); opacity: .3; }
.ai-file-resizer { flex-shrink: 0; width: 6px; cursor: col-resize; background: transparent; position: relative; }
.ai-file-resizer::after { content: ''; position: absolute; left: 50%; transform: translateX(-50%); top: 0; bottom: 0; width: 2px; background: transparent; }
.ai-file-resizer:hover::after, .ai-file-resizer:active::after { background: var(--color-primary); opacity: .3; }

/* ===== ADMIN07 人员管理布局优化 2026-09-11 ===== */
body.hide-ws-header .workspace-header { display: none; } /* 人员管理页隐藏顶部标题行 */
.mgmt-toolbar-inline { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.staff-search-input { padding: 6px 12px; border: 1px solid var(--color-border); border-radius: var(--radius-md); font-size: 13px; outline: none; width: 180px; transition: var(--transition); }
.staff-search-input:focus { border-color: var(--color-primary); }
.staff-row-highlight td { background: rgba(59,130,246,0.10) !important; } /* ADMIN08：编辑中行高亮 */
.staff-row-highlight td:first-child { box-shadow: inset 3px 0 0 var(--color-primary); }
.staff-mgmt-table td { padding: 8px 12px; font-size: 12.5px; } /* 行高紧凑 50→38 */
.staff-mgmt-table .dept-cell { max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } /* 部门限宽省略 */
.mgmt-content.staff-mgmt-root .staff-mgmt-scroll { flex: 1 1 0; min-height: 0; overflow: auto; } /* ADMIN09：PC滚动区flex撑满到底，弃用100vh死值 */
.mgmt-content:not(.staff-mgmt-root) .staff-mgmt-scroll { max-height: calc(100vh - 120px); overflow: auto; } /* ADMIN09：移动端保持原行为 */
/* ADMIN09：人员管理根容器flex化——工具栏行+表格纵向排布，滚动区吃满剩余高度，消除底部空白 */
.mgmt-content.staff-mgmt-root { height: 100%; box-sizing: border-box; display: flex; flex-direction: column; }
.mgmt-content.staff-mgmt-root .mgmt-toolbar { margin-bottom: 10px; flex-shrink: 0; } /* 间距16→10整体上移；仅人员管理生效，不影响其他模块 */
.staff-group-legend { margin-left: auto; font-size: 11px; text-transform: uppercase; letter-spacing: .5px; color: var(--color-text-tertiary); white-space: nowrap; } /* 分组图例靠右 */

/* ===== ADMIN07b Agent侧栏收起态布局修复 2026-09-11 ===== */
.func-nav.chat-collapsed .agent-filter-select { display: none; } /* 筛选下拉收起态隐藏（修：40px下拉在60px窄条溢出错位） */
.agent-conv-list { animation: convListIn 0.18s ease; } /* 会话子列表渲染淡入（修：展开合并硬切突兀；innerHTML重建才触发） */
@keyframes convListIn { from { opacity: 0; } to { opacity: 1; } }