/* AutoBuddy 品牌版壳 · 客户端壳抽屉式聊天窗 * 设计目标：极简、ChatGPT 同级体验、2 MB 体积内 * 主题：暗色优先（避免 Electron 默认亮色刺眼），客户可在设置里切浅色 */ /* ========== CSS 变量（明暗双主题） ========== */ :root { /* 深色主题：商务绿色系（底 #0a0c15，翠绿 #22c55e → 深绿 #16a34a） */ --bg-primary: #0a0c15; --ab-fs: 0.94; /* 界面字号倍率（设置→通用→界面字号）；【P38-10 2026-10-10 老板批"太粗犷"】全局默认下调 6%，各档仍按 0.94 基准缩放 */ --ab-radius: 1; /* 界面圆角倍率（设置→通用→界面圆角），1=标准；0=直角，2=大圆角 */ --bg-secondary: #12141f; --bg-tertiary: #1a1c2a; --bg-hover: rgba(34,197,94,0.08); --border: rgba(34,197,94,0.15); --text-primary: #e0e0e0; --text-secondary: #a9adc4; --text-muted: #8a8aa8; --accent: #22c55e; --accent-hover: #16a34a; --accent-light: rgba(34,197,94,0.12); --user-bubble: linear-gradient(135deg,#4ade80,#22c55e); --bot-bubble: #1a1c2a; --success: #10b981; --error: #ef4444; --warn: #f59e0b; --shadow: 0 4px 20px rgba(0, 0, 0, 0.5); /* 侧栏（深色主题）：半透明微绿压一层，透出 body 左上翠绿背影光 */ --side-bg: rgba(13,26,19,0.38); --side-border: rgba(34,197,94,0.18); --side-text: #c6cadb; --side-text-strong: #ffffff; --side-muted: #8a8aa8; --side-hover: rgba(34,197,94,0.10); --side-active: rgba(34,197,94,0.16); --side-chip-border: rgba(34,197,94,0.30); /* v157 深色：卡片/表单/滚动条统一变量（之前 --card-bg/--text 未定义，fallback 到 #fff 导致深色白卡片） */ --card-bg: rgba(255,255,255,0.04); --text: #c6c9d4; /* 亮灰，替代纯白刺眼 */ --scrollbar-thumb: rgba(34,197,94,0.55); --scrollbar-thumb-hover: rgba(34,197,94,0.8); } /* ===== v308 P9e：主题包扩展 ===== 默认(:root)=深色商务绿；.ab-light=浅色；下列两套为新增主题包。 navy 属深色系（不挂 ab-light，自动继承深色专属规则）；warm 属浅色系（自带浅色变量）。 */ :root.ab-theme-navy { --bg-primary: #070b18; --bg-secondary: #0f1626; --bg-tertiary: #16213a; --bg-hover: rgba(79,142,247,0.08); --accent: #4f8ef7; --accent-hover: #3b7ae0; --accent-light: rgba(79,142,247,0.12); --border: rgba(79,142,247,0.18); --text-primary: #e2e8f5; --text-secondary: #a7b3cc; --text-muted: #8794ad; --card-bg: rgba(255,255,255,0.04); --text: #c3cddf; --user-bubble: linear-gradient(135deg,#6ba4ff,#4f8ef7); --bot-bubble: #16213a; --scrollbar-thumb: rgba(79,142,247,0.55); --scrollbar-thumb-hover: rgba(79,142,247,0.8); --side-bg: rgba(10,18,36,0.42); --side-border: rgba(79,142,247,0.20); --side-text: #c3cddf; --side-muted: #8794ad; --side-hover: rgba(79,142,247,0.10); --side-active: rgba(79,142,247,0.16); --side-chip-border: rgba(79,142,247,0.30); } /* ⚠️ warm 会同时挂 .ab-light（浅色系）→ 两个选择器同为 (0,2,0)，靠顺序决胜负太脆弱， 故显式加 `:root.ab-light.ab-theme-warm`（0,3,0）确保暖色变量压过 ab-light 的默认浅色。 */ :root.ab-theme-warm, :root.ab-light.ab-theme-warm { --bg-primary: #f7f4ee; --bg-secondary: #ffffff; --bg-tertiary: #efe9df; --bg-hover: rgba(176,125,43,0.08); --accent: #b07d2b; --accent-hover: #96691f; --accent-light: rgba(176,125,43,0.12); --border: rgba(120,90,40,0.18); --text-primary: #3a332a; --text-secondary: #6b6152; --text-muted: #8b8071; --card-bg: rgba(0,0,0,0.03); --text: #4a4237; --user-bubble: linear-gradient(135deg,#d9b271,#c79a4a); --bot-bubble: #ffffff; --scrollbar-thumb: rgba(176,125,43,0.5); --scrollbar-thumb-hover: rgba(176,125,43,0.75); --side-bg: rgba(255,252,246,0.78); --side-border: rgba(120,90,40,0.20); --side-text: #4a4237; --side-text-strong: #2b251d; --side-muted: #8b8071; --side-hover: rgba(176,125,43,0.10); --side-active: rgba(176,125,43,0.16); --side-chip-border: rgba(176,125,43,0.30); } :root.ab-light { --bg-primary: #ffffff; --bg-secondary: #f9fafb; --bg-tertiary: #f3f4f6; --bg-hover: #e5e7eb; --border: #e5e7eb; --text-primary: #111827; --text-secondary: #4b5563; --text-muted: #9ca3af; --accent: #16a34a; --accent-hover: #22c55e; --accent-light: rgba(22, 163, 74, 0.1); --user-bubble: #d1fae5; --bot-bubble: #f3f4f6; --shadow: 0 4px 20px rgba(0, 0, 0, 0.08); /* 侧栏（浅色主题） */ --side-bg: linear-gradient(180deg, #f4f5fa 0%, #eff0f7 55%, #e9ebf3 100%); --side-border: rgba(60,60,110,0.08); --side-text: #000000; --side-text-strong: #000000; --side-muted: #7d829e; --side-hover: rgba(255,255,255,0.7); --side-active: #ffffff; --side-chip-border: rgba(60,60,110,0.22); /* v157 浅色 */ --card-bg: #ffffff; --text: #111827; --scrollbar-thumb: rgba(22,163,74,0.55); --scrollbar-thumb-hover: rgba(22,163,74,0.8); } /* ===== 无障碍：色弱模式（P0·2026-10-08）===== 增强色彩对比与饱和度，让颜色差异更易区分（设置→通用→无障碍）。 关闭时无任何影响；开启时整页叠加一层 filter。 */ :root.ab-colorweak { filter: saturate(1.5) contrast(1.06); } /* ===== 设置中心：主题色色板（设置→通用→主题色，P1·2026-10-08）===== */ .ab-accent-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; } .ab-accent-swatch { width: 30px; height: 30px; padding: 0; cursor: pointer; border-radius: calc(8px * var(--ab-radius,1)); border: 2px solid var(--border); background: var(--sw, var(--bg-tertiary)); display: inline-flex; align-items: center; justify-content: center; font-size: calc(10px * var(--ab-fs,1)); color: var(--text-secondary); transition: transform .12s, border-color .12s, box-shadow .12s; } .ab-accent-swatch:hover { transform: translateY(-1px); } .ab-accent-swatch.ab-set-on { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-light); } .ab-accent-swatch[data-accent=""] { width: auto; min-width: 58px; padding: 0 10px; background: var(--bg-tertiary); color: var(--text-secondary); } .ab-accent-pick { width: 34px; height: 30px; padding: 0; border: 2px solid var(--border); cursor: pointer; border-radius: calc(8px * var(--ab-radius,1)); background: none; } /* ========== Reset ========== */ * { box-sizing: border-box; margin: 0; padding: 0; } html, body { height: 100%; overflow: hidden; } body { /* v138 字体对齐 WorkBuddy：去 Inter/去 letter-spacing，栈顺序与 WorkBuddy body 完全一致 WorkBuddy body font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Helvetica Neue,Arial,sans-serif */ /* [C.216] 首位加内置字体 'AB Sans'：Mac 上 @font-face 的 local("PingFang SC") 命中系统苹方 （零下载、字形与 WorkBuddy 完全一致）；Windows/Linux 落内置分片，不再降级到微软雅黑+Segoe UI， 各端字形统一。详见 assets/fonts/ab-sans.css 头部注释。 */ font-family: 'AB Sans', -apple-system, BlinkMacSystemFont, 'SF Pro Text', 'SF Pro Display', 'Helvetica Neue', 'PingFang SC', 'Hiragino Sans GB', 'Segoe UI', Roboto, 'Microsoft YaHei', system-ui, sans-serif; /* P38-10 苹果显式优先 + C.216 内置字体兜底 */ background: var(--bg-primary); color: var(--text-primary); font-size:calc(15px * var(--ab-fs,1)); line-height: 1.6; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; } /* 深色模式：左上角翠绿背影光斑（radial）→ 右下深墨绿的全局过渡 */ :root:not(.ab-light) body { background: radial-gradient(ellipse 640px 500px at 0% 0%, color-mix(in srgb, var(--accent) 22%, transparent) 0%, color-mix(in srgb, var(--accent) 10%, transparent) 34%, color-mix(in srgb, var(--accent) 3.5%, transparent) 58%, transparent 78%), linear-gradient(135deg, #10231a 0%, #0d1120 38%, #0e1226 62%, #0f1f16 100%); background-attachment: fixed; } /* 主区容器透明，透出 body 全局渐变（左右两栏吃同一背景） */ :root:not(.ab-light) .ab-root, :root:not(.ab-light) .ab-main, :root:not(.ab-light) .ab-messages, :root:not(.ab-light) .ab-view-chat, :root:not(.ab-light) .ab-header { background: transparent; } /* 顶栏在深色下透全局渐变 + 底部一点青色发丝线 */ :root:not(.ab-light) .ab-header { backdrop-filter: blur(10px); } /* SVG 线性图标统一规格 */ .ab-ic { width: 17px; height: 17px; flex-shrink: 0; vertical-align: -3px; } /* ===== Token Plan 亿享计划 · 彩色线性图标（标题粗体 / 内容细体，关键词精简） ===== */ /* 图标仍为线性描边（stroke=currentColor），用 color 上色；颜色与商务绿主题协调 */ .ab-promo .ab-ic { width: 15px; height: 15px; vertical-align: -2.5px; } .ab-promo .ic-megaphone { color: var(--accent-hover); } /* 主题绿 · 预告 */ .ab-promo .ic-sparkle { color: #f59e0b; } /* 琥珀金 · 体验金/福利 */ .ab-promo .ic-users { color: #0ea5e9; } /* 天蓝 · 邀请/双方 */ .ab-promo .ic-calendar { color: #8b5cf6; } /* 紫色 · 签到/天数 */ .ab-promo .ic-clipboard { color: var(--accent); } /* 翠绿 · 规则/发放 */ /* 标题粗体主题绿；内容细体正常字色；仅核心金额用金色点缀 */ .ab-promo-title.ab-promo-title { color: var(--accent) !important; font-weight: 700; } /* 促销标题整句绿色（双类提权，压过 .ab-modal-title/.ab-set-label 的后定义灰色） */ .ab-promo .kw { color: var(--accent); font-weight: 700; } .ab-promo .kw-gold { color: #d97706; font-weight: 600; } /* ========== 主框架（Open WebUI 风格：左侧边栏 + 右侧主区） ========== */ .ab-root { display: flex; flex-direction: row; height: 100vh; background: var(--bg-primary); position: relative; } .ab-main { display: flex; flex-direction: column; flex: 1; min-width: 0; height: 100vh; } /* ========== 左栏骨架（项目/会话/更多 · 浅色适配） ========== */ .ab-proj-head { display: flex; align-items: center; justify-content: space-between; padding: 10px 14px 4px; font-size:calc(12px * var(--ab-fs,1)); color: var(--side-muted); letter-spacing: 0.5px; } .ab-proj-add { border: none; background: none; color: var(--side-muted); cursor: pointer; padding: 0 4px; display: flex; } .ab-proj-add:hover { color: var(--side-text-strong); } .ab-proj-list { padding: 0 8px; } .ab-proj-item { display: flex; align-items: center; justify-content: space-between; padding: 7px 10px; border-radius: calc(8px * var(--ab-radius,1)); font-size:calc(13px * var(--ab-fs,1)); color: var(--side-text); cursor: pointer; transition: background 0.12s; } .ab-proj-item:hover { background: var(--side-hover); color: var(--side-text-strong); } .ab-proj-item.ab-proj-active { background: var(--side-active); color: var(--side-text-strong); box-shadow: 0 1px 4px rgba(0,0,0,0.10); } .ab-proj-count { font-size:calc(11px * var(--ab-fs,1)); color: var(--side-muted); } /* 固定分类标题（普通会话 / 项目任务） */ .ab-cat-head { display: flex; align-items: center; justify-content: space-between; padding: 10px 14px 4px; font-size:calc(12px * var(--ab-fs,1)); font-weight: 600; color: var(--side-muted); letter-spacing: 0.5px; user-select: none; } /* 可折叠分类头：加箭头 + 手型 */ .ab-cat-collapsible { cursor: pointer; transition: background .14s; } .ab-cat-collapsible:hover { background: var(--side-hover); } .ab-cat-arrow { font-size:calc(11px * var(--ab-fs,1)); color: var(--side-muted); width: 14px; text-align: center; flex-shrink: 0; margin-right: 4px; } /* 项目文件夹行（可折叠） */ .ab-proj-folder { display: flex; align-items: center; gap: 6px; padding: 7px 10px; border-radius: calc(8px * var(--ab-radius,1)); font-size:calc(13px * var(--ab-fs,1)); font-weight: 600; color: var(--side-text-strong); cursor: pointer; transition: background 0.12s; position: relative; padding-right: 30px; } .ab-proj-folder:hover { background: var(--side-hover); } .ab-proj-caret { display: inline-flex; transition: transform 0.15s; color: var(--side-muted); } .ab-proj-caret .ab-ic { width: 13px; height: 13px; } .ab-proj-folder:not(.ab-collapsed) .ab-proj-caret { transform: rotate(90deg); } .ab-proj-fname { flex: 1; display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .ab-proj-fname .ab-ic { width: 15px; height: 15px; } .ab-proj-kebab { position: absolute; right: 4px; top: 50%; transform: translateY(-50%); border: none; background: none; color: var(--side-muted); cursor: pointer; padding: 3px; border-radius: calc(5px * var(--ab-radius,1)); line-height: 1; display: flex; opacity: 0; } .ab-proj-folder:hover .ab-proj-kebab { opacity: 1; } .ab-proj-kebab:hover { background: var(--side-hover); color: var(--side-text-strong); } .ab-proj-kebab .ab-ic { width: 15px; height: 15px; } /* 项目文件夹下的会话列表（缩进） */ .ab-proj-sess { padding-left: 16px; margin-bottom: 4px; } /* 侧栏滚动区：普通会话 + 项目任务（两列表同滚动，项目任务紧随其后） */ .ab-side-scroll { flex: 1; overflow-y: auto; min-height: 0; display: flex; flex-direction: column; } /* 覆盖 .ab-side-list 的 flex:1：普通会话只占内容高度，不撑开，项目任务紧跟其后（提高特异性压过 1083 行的 .ab-side-list） */ .ab-side-scroll .ab-normal-list.ab-side-list { flex: 0 0 auto; max-height: none; overflow: visible; padding: 0 8px; } .ab-side-scroll .ab-proj-list { flex: 0 0 auto; } /* 更多设置按钮 + 用户头像 */ .ab-side-foot { padding: 8px 8px 8px 12px; border-top: 1px solid var(--side-border); display: flex; align-items: center; gap: 6px; } /* 用户块：头像+名称+更多图标 一体，整块可点击 */ .ab-user-block { display: flex; align-items: center; gap: 8px; flex: 1; padding: 6px 8px; border-radius: calc(8px * var(--ab-radius,1)); cursor: pointer; background: transparent; border: none; transition: background .14s; min-width: 0; } .ab-user-block:hover { background: var(--side-hover); } .ab-user-avatar-img { width: 32px; height: 32px; border-radius: 50%; border: 1px solid var(--side-border); flex-shrink: 0; } .ab-user-name { font-size:calc(12px * var(--ab-fs,1)); font-weight: 500; color: var(--side-text-strong); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; flex: 1; text-align: left; } .ab-user-more-ico { width: 16px; height: 16px; color: #111; flex-shrink: 0; } .ab-user-block:hover .ab-user-more-ico { color: #000; } /* v186 深色：左栏底部「三个点」图标原硬编码 #111 黑，深色下几乎不可见 → 改白色 */ :root:not(.ab-light) .ab-user-more-ico { color: #ffffff; } :root:not(.ab-light) .ab-user-block:hover .ab-user-more-ico { color: #ffffff; } /* 远程通道入口：左下角手机/电脑连接图标按钮（在用户块右侧，黑色吸引点击） */ .ab-device-link-btn { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: calc(8px * var(--ab-radius,1)); flex-shrink: 0; background: transparent; border: none; cursor: pointer; color: #111; transition: background .14s, color .14s; } .ab-device-link-btn:hover { background: var(--side-hover); } .ab-device-link-btn .ab-ic { width: 18px; height: 18px; } .ab-device-link-img { width: 18px; height: 18px; display: block; object-fit: contain; } /* v186 深色：「手机/电脑连接」是 png 位图，深色下需反相转白才可见 */ :root:not(.ab-light) .ab-device-link-img { filter: brightness(0) invert(1); opacity: .92; } :root:not(.ab-light) .ab-device-link-btn:hover .ab-device-link-img { opacity: 1; } .ab-flex-spacer { flex: 1; } /* 用户头像弹出菜单（加宽，超过左栏 252px，便于后续扩充内容） */ .ab-user-panel { position: fixed; z-index: 1500; width: 320px; background: var(--bg-primary); border: 1px solid var(--border); border-radius: calc(12px * var(--ab-radius,1)); box-shadow: 0 12px 40px rgba(0,0,0,0.28); padding: 8px; } .ab-user-panel.hidden { display: none; } .ab-user-head { display: flex; align-items: center; gap: 12px; padding: 10px 12px; } .ab-user-head-logo { width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--border); } .ab-user-head-info { flex: none; width: 56px; min-width: 0; } .ab-user-head-name { font-size:calc(12.5px * var(--ab-fs,1)); font-weight: 500; color: var(--text-primary, var(--side-text-strong)); max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .ab-user-head-plan { font-size:calc(11px * var(--ab-fs,1)); color: var(--side-muted); max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .ab-user-divider { height: 1px; background: var(--border); margin: 5px 6px; } .ab-user-item { display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-radius: calc(8px * var(--ab-radius,1)); font-size:calc(13.5px * var(--ab-fs,1)); color: var(--side-text); cursor: pointer; transition: all 0.14s; position: relative; border: 1px solid transparent; } .ab-user-item .ab-ic { width: 16px; height: 16px; flex-shrink: 0; transition: color 0.14s; } /* 鼠标经过：绿色高亮 + 淡绿底 + 左侧色条，清晰可感 */ .ab-user-item:hover { background: var(--accent-light); color: var(--accent); border-color: var(--accent); box-shadow: inset 3px 0 0 var(--accent); transform: translateX(2px); } .ab-user-item:hover .ab-ic { color: var(--accent); } .ab-user-item-accent { color: var(--accent); font-weight: 600; } .ab-user-item-danger:hover { background: rgba(229,83,75,0.1); color: #e5534b; border-color: #e5534b; box-shadow: inset 3px 0 0 #e5534b; } .ab-user-tag { margin-left: auto; font-size:calc(10px * var(--ab-fs,1)); padding: 1px 7px; border-radius: calc(8px * var(--ab-radius,1)); background: var(--bg-primary); border: 1px dashed var(--accent); color: var(--accent); font-weight: 500; } .ab-user-val { margin-left: auto; font-size:calc(12px * var(--ab-fs,1)); color: var(--side-muted); font-family: Consolas, monospace; display: inline-flex; align-items: center; gap: 5px; } .ab-pt-refresh { border: none; background: none; cursor: pointer; padding: 1px; color: var(--side-muted); display: inline-flex; border-radius: calc(5px * var(--ab-radius,1)); transition: all 0.15s; } .ab-pt-refresh:hover { color: var(--accent); transform: rotate(90deg); } .ab-pt-refresh .ab-ic { width: 13px; height: 13px; } .ab-pt-refresh.ab-spin { animation: abSpin 0.6s linear; } @keyframes abSpin { to { transform: rotate(360deg); } } /* ===== 套餐购买弹窗 / 邀请弹窗（通用遮罩） ===== */ .ab-modal-overlay { position: fixed; inset: 0; z-index: 3000; background: rgba(0,0,0,0.55); backdrop-filter: blur(3px); display: flex; align-items: center; justify-content: center; } .ab-modal-overlay.hidden { display: none; } .ab-modal { width: 720px; max-width: 94vw; max-height: 88vh; overflow-y: auto; background: var(--bg-primary); border: 1px solid var(--border); border-radius: calc(16px * var(--ab-radius,1)); box-shadow: 0 24px 64px rgba(0,0,0,0.45); padding: 22px 24px; } .ab-modal-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; } .ab-modal-title { font-size:calc(17px * var(--ab-fs,1)); font-weight: 700; color: var(--text-primary); } .ab-modal-sub { font-size:calc(12.5px * var(--ab-fs,1)); color: var(--text-muted); margin-bottom: 18px; } /* 一号通登录弹窗 · 双角色 tab（用户 / 代理商） */ .ab-login-tabs { display: flex; gap: 8px; margin: 4px 0 12px; } .ab-login-tab { flex: 1; border: 1px solid var(--border); background: var(--bg-secondary); color: var(--text-secondary); border-radius: calc(8px * var(--ab-radius,1)); padding: 8px 0; font-size:calc(13.5px * var(--ab-fs,1)); cursor: pointer; } .ab-login-tab:hover { border-color: var(--accent); } .ab-login-tab.active { border-color: var(--accent); background: var(--accent-light); color: var(--accent); font-weight: 600; } /* ===== 一号通 · 账号中心入口（胶囊 + 下方「登录/注册 →→」提示） ===== */ .ab-acct-box { margin-left: auto; display: flex; flex-direction: column; align-items: center; gap: 3px; flex: none; } .ab-acct-hint { border: none; background: none; padding: 0; cursor: pointer; font-family: inherit; font-size:calc(10.5px * var(--ab-fs,1)); line-height: 1.2; color: var(--accent); letter-spacing: .2px; display: inline-flex; align-items: center; gap: 3px; } .ab-acct-hint:hover { text-decoration: underline; } .ab-acct-hint .ab-acct-arrow { font-size:calc(11px * var(--ab-fs,1)); letter-spacing: -1px; } .ab-acct-hint.hidden { display: none; } .ab-acct-pill { display: flex; align-items: center; gap: 6px; margin-left: auto; padding: 5px 11px; border: 1px solid var(--border); border-radius: 999px; background: var(--bg-secondary); cursor: pointer; transition: all .16s; flex: none; font-family: inherit; line-height: 1.2; white-space: nowrap; } .ab-acct-pill:hover { border-color: var(--border); background: var(--bg-tertiary); } .ab-acct-pill .ab-ic { width: 14px; height: 14px; flex: none; color: var(--text-muted); } .ab-acct-pill-name { font-size:calc(12px * var(--ab-fs,1)); font-weight: 500; color: var(--text-primary); max-width: 96px; overflow: hidden; text-overflow: ellipsis; } .ab-acct-pill-dot { font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); } .ab-acct-pill-sub { font-size:calc(12px * var(--ab-fs,1)); font-weight: 500; color: var(--text-primary); } /* ===== 一号通 · 账号中心弹窗（未登录=登录表单 / 已登录=中心主页） ===== */ .ab-modal.ab-acct { width: 520px; padding: 0; overflow: hidden; } .ab-acct-head { display: flex; align-items: center; gap: 11px; padding: 16px 18px; background: var(--bg-secondary); border-bottom: 1px solid var(--border); } .ab-acct-head-logo { width: 32px; height: 32px; border-radius: calc(9px * var(--ab-radius,1)); flex: none; display: flex; align-items: center; justify-content: center; background: var(--accent-light); color: var(--accent); border: 1px solid var(--accent); } .ab-acct-head-logo .ab-ic { width: 17px; height: 17px; } .ab-acct-head-tx { flex: 1; display: flex; flex-direction: column; gap: 2px; min-width: 0; } .ab-acct-head-t { font-size:calc(15px * var(--ab-fs,1)); font-weight: 700; color: var(--text-primary); } .ab-acct-head-s { font-size:calc(11.5px * var(--ab-fs,1)); color: var(--text-muted); } .ab-acct-badge { flex: none; font-size:calc(11px * var(--ab-fs,1)); padding: 4px 12px; border-radius: 999px; border: 1px dashed var(--border); color: var(--text-muted); background: var(--bg-primary); max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .ab-acct-badge.on { border: 1px solid var(--accent); color: var(--accent); background: var(--accent-light); } /* 本项目 .hidden 非全局类（各组件单独声明），账号中心需自带一条 */ .ab-acct .hidden { display: none; } .ab-acct-field { display: block; } .ab-acct-col { width: 400px; max-width: 100%; margin: 0 auto; } .ab-acct-lbrow { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; } .ab-acct-forgot { font-size:calc(12px * var(--ab-fs,1)); color: var(--accent); text-decoration: none; } .ab-acct-forgot:hover { text-decoration: underline; } .ab-acct-input { display: block; width: 100%; text-align: center; height: 40px; } .ab-acct-input::placeholder { text-align: center; } /* 图形验证码：输入框自适应 + 右侧 132x44 图片，点击刷新 */ .ab-acct-cap { display: flex; align-items: center; gap: 10px; } .ab-acct-cap-in { flex: 1; width: auto; min-width: 0; } .ab-acct-cap-img { width: 132px; height: 44px; flex: none; border-radius: calc(8px * var(--ab-radius,1)); overflow: hidden; cursor: pointer; background: var(--bg-secondary); border: 1px solid var(--border); display: flex; align-items: center; justify-content: center; font-size:calc(10.5px * var(--ab-fs,1)); color: var(--text-muted); } .ab-acct-cap-img svg { width: 100%; height: 100%; display: block; } .ab-acct-submit { height: 42px; font-size:calc(14.5px * var(--ab-fs,1)); letter-spacing: 2px; } .ab-acct-tips { margin-top: 16px; padding: 12px 14px; border-radius: calc(10px * var(--ab-radius,1)); background: var(--bg-secondary); border: 1px solid var(--border); display: flex; flex-direction: column; gap: 8px; } .ab-acct-tip { display: flex; align-items: center; gap: 8px; font-size:calc(12px * var(--ab-fs,1)); color: var(--text-secondary); } .ab-acct-tip .ab-ic { width: 14px; height: 14px; flex: none; color: var(--accent); } .ab-acct-body { padding: 16px 18px 18px; } .ab-acct-lb { font-size:calc(12.5px * var(--ab-fs,1)); font-weight: 600; color: var(--text-secondary); margin-bottom: 6px; } .ab-acct-msg { min-height: 17px; font-size:calc(12px * var(--ab-fs,1)); margin-top: 8px; color: var(--error, #ef4444); } .ab-acct-submit { width: 100%; margin-top: 6px; } .ab-acct-footnote { margin-top: 12px; text-align: center; } .ab-acct-footnote a { color: var(--accent); } /* [AB-REG-LINK-20260928] 账号中心「立即注册 →」一号通注册入口，落到 #register 注册 Tab。 颜色跟随主题变量 --accent（老板 2026-09-28 定：不同主题不同颜色，不写死绿色）： 跟随系统/深色 #22c55e 绿 · 浅色 #16a34a 绿 · 暗夜蓝 #4f8ef7 蓝 · 护眼暖灰 #b07d2b 棕。 加粗 + 去下划线；hover 用 --accent-hover 加深并显下划线。 */ .ab-acct-footnote a.ab-reg-link, .ab-acct-footnote a.ab-reg-link:visited { color: var(--accent); font-weight: 600; text-decoration: none; } .ab-acct-footnote a.ab-reg-link:hover { color: var(--accent-hover); text-decoration: underline; } .ab-acct-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-bottom: 16px; } .ab-acct-stat { background: var(--bg-secondary); border: 1px solid var(--border); border-radius: calc(10px * var(--ab-radius,1)); padding: 10px 12px; display: flex; flex-direction: column; gap: 5px; min-width: 0; } .ab-acct-stat .k { font-size:calc(11.5px * var(--ab-fs,1)); color: var(--text-muted); } .ab-acct-stat .v { font-size:calc(17px * var(--ab-fs,1)); font-weight: 700; color: var(--text-primary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .ab-acct-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; } .ab-acct-cell { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 13px 8px; border: 1px solid var(--border); border-radius: calc(10px * var(--ab-radius,1)); background: var(--bg-primary); color: var(--text-secondary); cursor: pointer; transition: all .16s; font-family: inherit; } .ab-acct-cell:hover { border-color: var(--accent); background: var(--accent-light); } .ab-acct-cell .ab-ic { width: 17px; height: 17px; } .ab-acct-cell .n { font-size:calc(12.5px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary); } .ab-acct-cell:hover .n { color: var(--accent); } .ab-acct-cell .t { font-size:calc(10.5px * var(--ab-fs,1)); color: var(--text-muted); } .ab-acct-note { margin-top: 14px; font-size:calc(11.5px * var(--ab-fs,1)); line-height: 1.7; color: var(--text-muted); } .ab-acct-bottom { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 18px; border-top: 1px solid var(--border); background: var(--bg-secondary); } .ab-acct-ver { font-size:calc(11.5px * var(--ab-fs,1)); color: var(--text-muted); } .ab-plan-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 16px; } .ab-plan-card { border: 1.5px solid var(--border); border-radius: calc(14px * var(--ab-radius,1)); padding: 16px 13px; text-align: center; cursor: pointer; transition: all 0.18s; position: relative; background: var(--bg-secondary); } .ab-plan-card:hover { border-color: var(--accent); transform: translateY(-3px); box-shadow: 0 8px 24px rgba(0,0,0,0.2); } .ab-plan-card.ab-plan-on { border-color: var(--accent); background: var(--accent-light); box-shadow: 0 0 0 3px var(--accent-light); } .ab-plan-hot { position: absolute; top: -10px; left: 50%; transform: translateX(-50%); background: linear-gradient(135deg, var(--accent), var(--accent-hover)); color: #fff; font-size:calc(10.5px * var(--ab-fs,1)); font-weight: 700; padding: 2px 12px; border-radius: calc(10px * var(--ab-radius,1)); letter-spacing: 0.5px; } .ab-plan-name { font-size:calc(14px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary); margin-bottom: 8px; } .ab-plan-price { font-size:calc(15px * var(--ab-fs,1)); color: var(--accent); margin-bottom: 4px; } .ab-plan-price b { font-size:calc(26px * var(--ab-fs,1)); font-weight: 800; font-family: Consolas, monospace; } .ab-plan-unit { font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); } .ab-plan-feats { list-style: none; margin-top: 12px; text-align: left; } .ab-plan-feats li { font-size:calc(11.5px * var(--ab-fs,1)); color: var(--text-secondary); padding: 4px 0 4px 18px; position: relative; } .ab-plan-feats li::before { content: '✓'; position: absolute; left: 0; color: var(--accent); font-weight: 700; } /* 支付区：微信/支付宝切换 + 二维码占位 */ .ab-pay-row { display: flex; gap: 10px; margin-bottom: 14px; } .ab-pay-tab { flex: 1; display: flex; align-items: center; justify-content: center; gap: 8px; padding: 11px; border: 1.5px solid var(--border); border-radius: calc(10px * var(--ab-radius,1)); cursor: pointer; font-size:calc(14px * var(--ab-fs,1)); font-weight: 600; color: var(--text-secondary); transition: all 0.15s; background: var(--bg-secondary); } .ab-pay-tab.ab-pay-on[data-pay="wx"] { border-color: var(--accent); color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, transparent); } .ab-pay-tab.ab-pay-on[data-pay="ali"] { border-color: #1677ff; color: #1677ff; background: rgba(22,119,255,0.08); } .ab-pay-body { display: flex; gap: 22px; align-items: center; } .ab-qr-wrap { flex-shrink: 0; text-align: center; } .ab-qr-box { width: 180px; height: 180px; border: 1.5px solid var(--border); border-radius: calc(12px * var(--ab-radius,1)); display: flex; align-items: center; justify-content: center; overflow: hidden; background: #fff; position: relative; } .ab-qr-box img { width: 100%; height: 100%; object-fit: cover; } /* 二维码遮罩：同意协议前盖住二维码（半透明可隐约看到二维码） */ .ab-qr-mask { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; background: rgba(255,255,255,0.42); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); color: var(--text-primary); font-size:calc(12.5px * var(--ab-fs,1)); font-weight: 600; text-align: center; padding: 0 16px; line-height: 1.5; transition: opacity .2s; } .ab-qr-mask .ab-ic { width: 26px; height: 26px; color: var(--text-secondary); } .ab-qr-mask.ab-qr-mask-off { opacity: 0; pointer-events: none; } .ab-qr-agree-btn { border: none; border-radius: calc(8px * var(--ab-radius,1)); padding: 7px 16px; font-size:calc(12px * var(--ab-fs,1)); font-weight: 600; color: #fff; background: linear-gradient(135deg, var(--accent), var(--accent-hover)); cursor: pointer; transition: all .15s; box-shadow: 0 2px 8px color-mix(in srgb, var(--accent) 35%, transparent); } .ab-qr-agree-btn:hover { filter: brightness(1.08); transform: translateY(-1px); } .ab-qr-agree-btn.ab-qr-agreed { opacity: .75; cursor: default; } .ab-qr-tip { font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); margin-top: 8px; } .ab-pay-info { flex: 1; } .ab-pay-amount { font-size:calc(13px * var(--ab-fs,1)); color: var(--text-secondary); margin-bottom: 6px; } .ab-pay-amount b { font-size:calc(26px * var(--ab-fs,1)); color: var(--accent); font-family: Consolas, monospace; } .ab-pay-note { font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); line-height: 1.7; } /* 套餐弹窗 v2：副标题 / 折扣 / 续费 / 协议 */ .ab-modal-wide { width: 860px; max-width: 96vw; } .ab-plan-sub { font-size:calc(11.5px * var(--ab-fs,1)); color: var(--text-muted); margin: -4px 0 8px; } .ab-plan-discount { color: var(--accent) !important; font-weight: 600; } .ab-plan-discount::before { content: '★' !important; color: var(--accent) !important; } .ab-pay-plan-line { font-size:calc(13px * var(--ab-fs,1)); color: var(--text-secondary); font-weight: 600; margin-bottom: 6px; } .ab-pay-detail { display: inline-block; font-size:calc(12px * var(--ab-fs,1)); color: var(--accent); margin: 6px 0 10px; text-decoration: none; } .ab-pay-detail:hover { text-decoration: underline; } .ab-pay-agree { display: flex; align-items: flex-start; gap: 7px; font-size:calc(11.5px * var(--ab-fs,1)); color: var(--text-muted); line-height: 1.5; cursor: pointer; } .ab-pay-agree input { margin-top: 2px; accent-color: var(--accent); cursor: pointer; } .ab-pay-agree a { color: var(--accent); text-decoration: none; } .ab-pay-agree a:hover { text-decoration: underline; } .ab-qr-tip.ab-qr-blocked { color: #e0533d; font-weight: 600; } /* 时长按钮排（套餐 × 时长联动） */ .ab-term-row { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; } .ab-term-label { font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); flex-shrink: 0; } .ab-term-tabs { display: flex; gap: 8px; flex: 1; } .ab-term-tab { flex: 1; text-align: center; padding: 7px 4px; border: 1.5px solid var(--border); border-radius: calc(9px * var(--ab-radius,1)); font-size:calc(12px * var(--ab-fs,1)); font-weight: 600; color: var(--text-secondary); cursor: pointer; transition: all 0.15s; background: var(--bg-secondary); } .ab-term-tab.ab-term-on { border-color: var(--accent); color: var(--accent); background: var(--accent-light); } .ab-term-tab.ab-term-off { opacity: .4; cursor: not-allowed; border-style: dashed; } /* 加油包卡：锁定灰态 + 锁图标 */ .ab-plan-card.ab-plan-locked { filter: grayscale(1); opacity: .55; } .ab-plan-card.ab-plan-locked:hover { border-color: var(--border); transform: none; box-shadow: none; } .ab-plan-lock { position: absolute; top: 8px; right: 8px; width: 22px; height: 22px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: var(--bg-primary); border: 1.5px solid var(--border); color: var(--text-muted); } .ab-plan-lock .ab-ic { width: 12px; height: 12px; } .ab-gas-pts { color: var(--accent); font-weight: 700; } /* ============ 易支付真实付款码（2026-09-28）============ */ /* 真实二维码画布：叠在原占位图之上（不重建 DOM，保留遮罩与按钮的事件绑定） */ .ab-qr-box canvas#payQrCanvas { position: absolute; inset: 0; width: 100%; height: 100%; background: #fff; z-index: 1; display: none; } .ab-qr-box canvas#payQrCanvas.on { display: block; } .ab-qr-box #payQrImg.hide { visibility: hidden; } .ab-qr-box .ab-qr-mask { z-index: 2; } /* 刷新付款码 */ .ab-qr-refresh { margin-top: 8px; padding: 5px 14px; font-size:calc(12px * var(--ab-fs,1)); font-weight: 600; cursor: pointer; border: 1.5px solid var(--border); border-radius: calc(8px * var(--ab-radius,1)); background: var(--bg-secondary); color: var(--text-secondary); transition: all .15s; } .ab-qr-refresh:hover { border-color: var(--accent); color: var(--accent); } /* 订单信息行（订单号 + 网页付款链接） */ .ab-pay-ordermeta { font-size:calc(11.5px * var(--ab-fs,1)); color: var(--text-muted); line-height: 1.6; margin: 2px 0 8px; word-break: break-all; } .ab-pay-ordermeta a { color: var(--accent); text-decoration: none; } .ab-pay-ordermeta a:hover { text-decoration: underline; } /* ============ 资料库视图 ============ */ /* v71 顶栏一行：tabs + ima 广场按钮 + 搜索框 */ .ab-lib-topbar { display: flex; align-items: center; gap: 12px; padding: 12px 18px 0; flex-shrink: 0; flex-wrap: wrap; } .ab-lib-topbar .ab-task-tabs { margin-bottom: 0; flex: 0 0 auto; align-items: center; } .ab-lib-topbar .ab-task-tab { white-space: nowrap; padding: 7px 14px; flex: 0 0 auto; } .ab-lib-discover-btn { display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px; border-radius: calc(9px * var(--ab-radius,1)); border: 1.5px solid color-mix(in srgb, var(--accent) 35%, transparent); background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 12%, transparent), color-mix(in srgb, var(--accent) 5%, transparent)); color: var(--accent); font-size:calc(12px * var(--ab-fs,1)); font-weight: 600; cursor: pointer; transition: all .15s; flex: 0 0 auto; } .ab-lib-discover-btn:hover { border-color: var(--accent); box-shadow: 0 4px 12px color-mix(in srgb, var(--accent) 18%, transparent); transform: translateY(-1px); } /* 资料库注脚：转载出处声明，绿色箭头跳知识库广场 */ .ab-lib-note { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); display: flex; align-items: center; gap: 2px; margin-left: auto; white-space: nowrap; } .ab-lib-note-link { color: var(--accent); display: inline-flex; align-items: center; text-decoration: none; } .ab-lib-note-link .ab-ic { width: 13px; height: 13px; } .ab-lib-note-link:hover { color: var(--accent-hover); } .ab-lib-discover-btn .ab-ic { width: 14px; height: 14px; } .ab-lib-discover-btn span { white-space: nowrap; } .ab-lib-discover-ic { font-size:calc(14px * var(--ab-fs,1)); } .ab-lib-toolbar { display: flex; gap: 10px; flex: 1; min-width: 200px; } .ab-lib-toolbar .ab-task-search { flex: 1; } .ab-lib-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 14px; padding: 4px 18px 20px; /* 左右 18px 内边距，防止卡片贴边 */ flex: 1; min-height: 0; overflow-y: auto; /* 占据剩余空间并可滚动 */ align-content: start; /* 卡片从顶部开始排，不满时不拉伸 */ } /* ============ P4 文档知识库（我的文档） ============ */ .ab-kbdocs { display: flex; flex-direction: column; flex: 1; min-height: 0; overflow-y: auto; padding: 12px 18px 24px; gap: 10px; } .ab-kb-hd { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; } .ab-kb-hd-l { display: flex; flex-direction: column; gap: 2px; font-size:calc(15px * var(--ab-fs,1)); color: var(--text-primary); } .ab-kb-hd-l .ab-ic { width: 16px; height: 16px; color: var(--accent); vertical-align: -2px; } .ab-kb-hd-l b { font-size:calc(15px * var(--ab-fs,1)); } .ab-kb-hd-s { font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); font-weight: 400; } .ab-kb-upload { flex: none; display: inline-flex; align-items: center; gap: 5px; padding: 7px 14px; border-radius: calc(9px * var(--ab-radius,1)); border: 1px solid var(--accent); background: var(--accent); color: #fff; font-size:calc(13px * var(--ab-fs,1)); font-weight: 600; cursor: pointer; transition: all .15s; } .ab-kb-upload:hover { filter: brightness(1.05); box-shadow: 0 2px 10px color-mix(in srgb, var(--accent) 30%, transparent); } .ab-kb-upload .ab-ic { width: 14px; height: 14px; } .ab-kb-searchbar { display: flex; gap: 8px; } .ab-kb-searchbar input { flex: 1; padding: 8px 12px; border: 1px solid var(--border); border-radius: calc(9px * var(--ab-radius,1)); background: var(--bg-secondary); color: var(--text-primary); font-size:calc(13px * var(--ab-fs,1)); } .ab-kb-searchbar input:focus { outline: none; border-color: var(--accent); } .ab-kb-list-t { font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); margin: 4px 0 2px; } .ab-kb-doc { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--border); border-radius: calc(10px * var(--ab-radius,1)); background: var(--bg-secondary); } .ab-kb-doc-ico { width: 30px; height: 30px; border-radius: calc(8px * var(--ab-radius,1)); background: color-mix(in srgb, var(--accent) 10%, transparent); color: var(--accent); display: flex; align-items: center; justify-content: center; flex: 0 0 auto; } .ab-kb-doc-ico .ab-ic { width: 16px; height: 16px; } .ab-kb-doc-name { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size:calc(13px * var(--ab-fs,1)); color: var(--text-primary); } .ab-kb-doc-meta { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); white-space: nowrap; } .ab-kb-hit { border: 1px solid var(--border); border-left: 3px solid var(--accent); border-radius: calc(8px * var(--ab-radius,1)); padding: 10px 12px; background: var(--bg-secondary); margin-bottom: 8px; } .ab-kb-hit-src { font-size:calc(11px * var(--ab-fs,1)); color: var(--accent); font-weight: 600; margin-bottom: 4px; } .ab-kb-hit-txt { font-size:calc(12.5px * var(--ab-fs,1)); color: var(--text-secondary); line-height: 1.6; white-space: pre-wrap; word-break: break-word; } .ab-kb-empty, .ab-kb-loading { padding: 26px 16px; text-align: center; color: var(--text-muted); font-size:calc(13px * var(--ab-fs,1)); line-height: 1.7; } .ab-lib-card { display: flex; flex-direction: column; gap: 10px; border: 1.5px solid var(--border); border-radius: calc(12px * var(--ab-radius,1)); padding: 16px; background: var(--bg-secondary); cursor: pointer; transition: all 0.15s; } .ab-lib-card:hover { border-color: var(--accent); transform: translateY(-2px); box-shadow: 0 6px 18px rgba(0,0,0,0.18); } .ab-lib-ic { width: 34px; height: 34px; border-radius: calc(9px * var(--ab-radius,1)); display: flex; align-items: center; justify-content: center; background: var(--accent-light); color: var(--accent); overflow: hidden; flex-shrink: 0; } .ab-lib-ic .ab-ic { width: 18px; height: 18px; } .ab-lib-cover { width: 100%; height: 100%; object-fit: cover; display: block; } .ab-lib-name { font-size:calc(14px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary); margin-bottom: 4px; } .ab-lib-desc { font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); line-height: 1.5; } .ab-lib-meta { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-top: auto; } .ab-lib-tag { font-size:calc(11px * var(--ab-fs,1)); padding: 1px 8px; border-radius: calc(8px * var(--ab-radius,1)); background: var(--bg-primary); border: 1px solid var(--border); color: var(--text-secondary); } .ab-lib-hot { font-size:calc(11px * var(--ab-fs,1)); padding: 1px 8px; border-radius: calc(8px * var(--ab-radius,1)); background: linear-gradient(135deg, var(--accent), var(--accent-hover)); color: #fff; font-weight: 600; } .ab-lib-count { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); margin-left: auto; font-family: Consolas, monospace; } .ab-lib-empty { grid-column: 1 / -1; text-align: center; padding: 48px 20px; color: var(--text-muted); font-size:calc(13px * var(--ab-fs,1)); } /* ── 资料库：发现广场横幅（v71 已废弃，改为 .ab-lib-discover-btn 顶栏按钮） ── */ .ab-lib-banner { display: none; } /* ── 自训练功能卡（专家/知识库共用）：绿色虚线 + 绿主字 + 线性图标 + hover 浅绿 ── */ .ab-func-add { background: transparent; border: 1.5px dashed var(--accent); position: relative; } .ab-func-add:hover { border-color: var(--accent); background: var(--accent-light); box-shadow: 0 4px 14px color-mix(in srgb, var(--accent) 12%, transparent); } .ab-func-add-ic { background: var(--accent-light); color: var(--accent); border: 1px solid color-mix(in srgb, var(--accent) 25%, transparent); } .ab-func-add-name { color: var(--accent); font-weight: 700; } /* 内虚线框 ⊕ 号（新建卡核心视觉：外绿虚线 + 内虚线浅绿框 + 居中 +） */ .ab-func-plus { width: 100%; min-height: 76px; border-radius: calc(10px * var(--ab-radius,1)); border: 1.5px dashed color-mix(in srgb, var(--accent) 45%, transparent); background: var(--accent-light); display: flex; align-items: center; justify-content: center; color: var(--accent); font-size:calc(34px * var(--ab-fs,1)); font-weight: 300; line-height: 1; transition: all .15s; margin-bottom: 8px; user-select: none; } .ab-func-add:hover .ab-func-plus { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 16%, transparent); transform: scale(1.02); } .ab-func-plus .ab-ic { width: 30px; height: 30px; } .ab-func-add-sub { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); margin-top: 4px; line-height: 1.5; } /* ===== 四菜单创建卡统一：外绿虚线框 + 内小虚线框⊕ + 名称 + 副标题 ===== */ /* 让 .ab-func-add 在任何卡片容器(mkt/lib/wf/auto)里都呈现统一列式布局 */ .ab-mkt-card.ab-func-add, .ab-lib-card.ab-func-add, .ab-wf-card.ab-func-add { display: flex; flex-direction: column; align-items: stretch; justify-content: flex-start; background: transparent; border: 1.5px dashed var(--accent); cursor: pointer; transition: all .15s; text-align: center; } .ab-mkt-card.ab-func-add:hover, .ab-lib-card.ab-func-add:hover, .ab-wf-card.ab-func-add:hover { border-color: var(--accent); background: var(--accent-light); box-shadow: 0 4px 14px color-mix(in srgb, var(--accent) 12%, transparent); transform: translateY(-2px); } /* 统一名称行（覆盖各容器默认左对齐） */ .ab-func-add .ab-func-add-name { justify-content: center; text-align: center; } /* 让 lib/wf 容器里的 plus 占满卡宽居中 */ .ab-lib-card.ab-func-add .ab-func-plus, .ab-mkt-card.ab-func-add .ab-func-plus { margin-bottom: 10px; } /* ===== 任务列表「我创建的」汇总区 + 分区标题 ===== */ .ab-task-sect { font-size:calc(12px * var(--ab-fs,1)); font-weight: 700; color: var(--accent); margin: 14px 2px 8px; letter-spacing: .5px; } .ab-task-sect:first-child { margin-top: 2px; } .ab-task-mylist { display: flex; flex-wrap: wrap; gap: 8px; padding: 2px 2px 6px; } /* ===== 顶部「我创建的」草稿/任务区（四菜单共用，紧凑单行条，最小视觉占用） ===== */ .ab-myzone { grid-column: 1 / -1; border: 1px dashed var(--border); border-radius: calc(8px * var(--ab-radius,1)); background: var(--bg-secondary); padding: 4px 10px; display: flex; align-items: center; gap: 8px; min-height: 30px; } .ab-myzone-head { display: flex; align-items: center; gap: 6px; font-size:calc(11px * var(--ab-fs,1)); font-weight: 700; color: var(--text-secondary); letter-spacing: .3px; flex-shrink: 0; margin: 0; } .ab-myzone-head .ab-myzone-count { font-weight: 500; color: var(--text-muted); font-size:calc(10px * var(--ab-fs,1)); } .ab-myzone-list { display: flex; flex-wrap: nowrap; gap: 6px; overflow-x: auto; flex: 1; align-items: center; scrollbar-width: thin; } .ab-myzone-empty { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); padding: 0; white-space: nowrap; } .ab-my-chip { display: inline-flex; align-items: center; gap: 5px; background: var(--bg-primary); border: 1px solid var(--border); border-radius: calc(14px * var(--ab-radius,1)); padding: 2px 9px 2px 6px; font-size:calc(11px * var(--ab-fs,1)); color: var(--text-primary); cursor: pointer; transition: all .15s; white-space: nowrap; flex-shrink: 0; } .ab-my-chip:hover { border-color: var(--accent); box-shadow: 0 1px 5px color-mix(in srgb, var(--accent) 12%, transparent); } .ab-my-chip-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--warn); flex-shrink: 0; } .ab-my-chip-dot.ok { background: var(--success); } .ab-my-chip-name { font-weight: 600; max-width: 140px; overflow: hidden; text-overflow: ellipsis; } .ab-my-chip-status { color: var(--text-muted); font-size:calc(10px * var(--ab-fs,1)); } .ab-my-chip-x { color: var(--text-muted); font-size:calc(12px * var(--ab-fs,1)); line-height: 1; padding: 0 1px; border-radius: calc(3px * var(--ab-radius,1)); } .ab-my-chip-x:hover { color: var(--error); background: var(--bg-hover); } .ab-func-new { display: inline-block; padding: 1px 6px; border-radius: calc(6px * var(--ab-radius,1)); background: var(--accent-light); color: var(--accent); border: 1px solid color-mix(in srgb, var(--accent) 30%, transparent); font-size:calc(10px * var(--ab-fs,1)); font-weight: 600; margin-left: 4px; vertical-align: 1px; } /* 旧紫卡类保留兼容（不再使用渐变，统一指到绿虚线） */ .ab-lib-card-distill { background: transparent; border: 1.5px dashed var(--accent); position: relative; } .ab-lib-card-distill:hover { border-color: var(--accent); background: var(--accent-light); box-shadow: 0 4px 14px color-mix(in srgb, var(--accent) 12%, transparent); } .ab-lib-ic-distill { background: var(--accent-light); color: var(--accent); border: 1px solid color-mix(in srgb, var(--accent) 25%, transparent); } .ab-lib-new { display: inline-block; padding: 1px 6px; border-radius: calc(6px * var(--ab-radius,1)); background: var(--accent-light); color: var(--accent); border: 1px solid color-mix(in srgb, var(--accent) 30%, transparent); font-size:calc(10px * var(--ab-fs,1)); font-weight: 600; margin-left: 4px; vertical-align: 1px; } /* ── 自训练统一设置弹窗骨架（专家/知识库共用，绿色主调，线性图标） ── */ .ab-func-panel { width: 92vw; max-width: 680px; max-height: 88vh; display: flex; flex-direction: column; } .ab-func-body { flex: 1; overflow-y: auto; padding: 18px 22px; display: flex; flex-direction: column; gap: 18px; } .ab-func-sec-t { display: flex; align-items: center; gap: 7px; font-size:calc(13px * var(--ab-fs,1)); font-weight: 700; color: var(--accent); margin-bottom: 11px; } .ab-func-sec-t .ab-ic { width: 15px; height: 15px; color: var(--accent); } /* 模式卡（线性图标 + 文案），选中态绿边浅绿底 */ .ab-func-modes { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; } .ab-func-mode { display: flex; align-items: flex-start; gap: 10px; padding: 12px 14px; border-radius: calc(10px * var(--ab-radius,1)); border: 1.5px solid var(--border); background: var(--bg-secondary); cursor: pointer; text-align: left; transition: all .15s; } .ab-func-mode:hover { border-color: var(--accent); } .ab-func-mode.ab-func-mode-on { border-color: var(--accent); background: var(--accent-light); box-shadow: 0 2px 8px color-mix(in srgb, var(--accent) 12%, transparent); } .ab-func-mode-ic { width: 30px; height: 30px; border-radius: calc(8px * var(--ab-radius,1)); flex-shrink: 0; display: flex; align-items: center; justify-content: center; background: var(--accent-light); color: var(--accent); } .ab-func-mode-ic .ab-ic { width: 16px; height: 16px; } .ab-func-mode-t { font-size:calc(13px * var(--ab-fs,1)); font-weight: 700; color: var(--text-primary); margin-bottom: 3px; } .ab-func-mode-d { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); line-height: 1.5; } /* 表单字段 */ .ab-func-field { margin-bottom: 2px; } .ab-func-label { display: block; font-size:calc(12px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary); margin-bottom: 6px; } .ab-func-label .req { color: #ef4444; margin-left: 2px; } .ab-func-input, .ab-func-select, .ab-func-textarea { width: 100%; padding: 10px 12px; font-size:calc(13px * var(--ab-fs,1)); border: 1.5px solid var(--border); border-radius: calc(8px * var(--ab-radius,1)); background: var(--bg-secondary); color: var(--text-primary); outline: none; transition: border-color .15s; font-family: inherit; } .ab-func-input:focus, .ab-func-select:focus, .ab-func-textarea:focus { border-color: var(--accent); } .ab-func-textarea { resize: vertical; min-height: 64px; } .ab-func-hint { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); margin-top: 5px; line-height: 1.5; } .ab-func-label-opt { font-weight: 400; color: var(--text-muted); font-size:calc(11px * var(--ab-fs,1)); } /* 上传资料按钮 + 文件槽 */ .ab-func-upload { display: inline-flex; align-items: center; gap: 6px; padding: 8px 16px; border-radius: calc(8px * var(--ab-radius,1)); border: 1.5px dashed var(--accent); background: transparent; color: var(--accent); font-size:calc(12px * var(--ab-fs,1)); font-weight: 600; cursor: pointer; transition: all .15s; } .ab-func-upload .ab-ic { width: 14px; height: 14px; } .ab-func-upload:hover { background: var(--accent-light); } .ab-func-fileslot { margin-top: 8px; display: flex; flex-direction: column; gap: 5px; } .ab-func-fileslot-empty { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); padding: 8px 0; } .ab-func-file-item { display: flex; align-items: center; gap: 7px; padding: 6px 10px; border-radius: calc(7px * var(--ab-radius,1)); background: var(--bg-secondary); border: 1px solid var(--border); font-size:calc(12px * var(--ab-fs,1)); } .ab-func-file-ic { color: var(--accent); display: inline-flex; flex-shrink: 0; } .ab-func-file-ic .ab-ic { width: 13px; height: 13px; } .ab-func-file-name { color: var(--text-primary); font-weight: 500; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .ab-func-file-meta { color: var(--text-muted); font-size:calc(10px * var(--ab-fs,1)); flex-shrink: 0; } .ab-func-file-ok { color: var(--accent); } .ab-func-file-warn { color: #f59e0b; } .ab-func-file-x { flex-shrink: 0; border: none; background: none; color: var(--text-muted); cursor: pointer; padding: 2px; border-radius: calc(4px * var(--ab-radius,1)); display: flex; align-items: center; } .ab-func-file-x:hover { background: #ef4444; color: #fff; } .ab-func-file-x .ab-ic { width: 12px; height: 12px; } .ab-func-row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; } /* 底部按钮区 */ .ab-func-foot { display: flex; justify-content: flex-end; gap: 10px; } .ab-func-cancel { padding: 10px 20px; border-radius: calc(10px * var(--ab-radius,1)); border: 1.5px solid var(--border); background: transparent; color: var(--text-muted); font-size:calc(13px * var(--ab-fs,1)); font-weight: 600; cursor: pointer; transition: all .15s; } .ab-func-cancel:hover { border-color: var(--text-muted); color: var(--text-primary); } .ab-func-go { display: inline-flex; align-items: center; gap: 7px; padding: 10px 22px; border-radius: calc(10px * var(--ab-radius,1)); border: none; background: linear-gradient(135deg, var(--accent), var(--accent-hover)); color: #fff; font-size:calc(13px * var(--ab-fs,1)); font-weight: 600; cursor: pointer; transition: all .15s; } .ab-func-go .ab-ic { width: 15px; height: 15px; } .ab-func-go:hover { background: var(--accent-hover); transform: translateY(-1px); box-shadow: 0 6px 16px color-mix(in srgb, var(--accent) 30%, transparent); } .ab-func-go:disabled { opacity: .6; cursor: not-allowed; transform: none; } /* 底部提示条（绿色，重要提示醒目） */ .ab-func-tip { font-size:calc(11px * var(--ab-fs,1)); color: var(--accent); line-height: 1.6; font-weight: 500; padding: 10px 12px; border-radius: calc(8px * var(--ab-radius,1)); background: var(--accent-light); border-left: 3px solid var(--accent); } /* ── 旧 v73 蒸馏窗类（保留结构，配色统一改绿） ── */ .ab-lib-panel-distill { width: 92vw; max-width: 680px; max-height: 88vh; display: flex; flex-direction: column; } .ab-distill-body { flex: 1; overflow-y: auto; padding: 18px 22px; display: flex; flex-direction: column; gap: 18px; } .ab-distill-sec-t { font-size:calc(13px * var(--ab-fs,1)); font-weight: 700; color: var(--accent); margin-bottom: 11px; } .ab-distill-cmp { display: flex; align-items: stretch; gap: 12px; } .ab-distill-cmp-col { flex: 1; padding: 12px 14px; border-radius: calc(10px * var(--ab-radius,1)); background: var(--bg-secondary); border: 1px solid var(--border); } .ab-distill-cmp-col.ab-distill-cmp-on { background: var(--accent-light); border-color: var(--accent); } .ab-distill-cmp-h { font-size:calc(12px * var(--ab-fs,1)); font-weight: 700; margin-bottom: 8px; color: var(--text-primary); } .ab-distill-cmp-p { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); line-height: 1.6; } .ab-distill-cmp-arrow { display: flex; align-items: center; font-size:calc(18px * var(--ab-fs,1)); color: var(--accent); font-weight: 700; } .ab-distill-modes { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; } .ab-distill-mode { padding: 12px 14px; border-radius: calc(10px * var(--ab-radius,1)); border: 1.5px solid var(--border); background: var(--bg-secondary); cursor: pointer; text-align: left; transition: all .15s; } .ab-distill-mode:hover { border-color: var(--accent); } .ab-distill-mode.ab-distill-mode-on { border-color: var(--accent); background: var(--accent-light); box-shadow: 0 2px 8px color-mix(in srgb, var(--accent) 12%, transparent); } .ab-distill-mode-t { font-size:calc(13px * var(--ab-fs,1)); font-weight: 700; color: var(--text-primary); margin-bottom: 4px; } .ab-distill-mode-d { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); } .ab-distill-input { width: 100%; padding: 10px 12px; font-size:calc(13px * var(--ab-fs,1)); border: 1.5px solid var(--border); border-radius: calc(8px * var(--ab-radius,1)); background: var(--bg-secondary); color: var(--text-primary); outline: none; transition: border-color .15s; } .ab-distill-input:focus { border-color: var(--accent); } .ab-distill-foot { display: flex; justify-content: flex-end; } .ab-distill-go { padding: 10px 22px; border-radius: calc(10px * var(--ab-radius,1)); border: none; background: linear-gradient(135deg, var(--accent), var(--accent-hover)); color: #fff; font-size:calc(13px * var(--ab-fs,1)); font-weight: 600; cursor: pointer; transition: all .15s; } .ab-distill-go:hover { background: var(--accent-hover); transform: translateY(-1px); box-shadow: 0 6px 16px color-mix(in srgb, var(--accent) 30%, transparent); } .ab-distill-tip { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); line-height: 1.6; padding: 10px 12px; border-radius: calc(8px * var(--ab-radius,1)); background: var(--accent-light); border-left: 3px solid var(--accent); } /* ── 资料库：收藏按钮 ── */ .ab-lib-card { position: relative; } /* ── 资料库视图内通用容器：tabs/chips 加内边距+不压缩（v70 修边距贴边/无法滚动） ── */ #view-lib .ab-mkt-cats { padding: 12px 18px; margin-bottom: 0; flex-shrink: 0; } .ab-lib-fav { position: absolute; top: 10px; right: 10px; width: 28px; height: 28px; border: none; border-radius: calc(7px * var(--ab-radius,1)); cursor: pointer; background: transparent; color: var(--text-muted); font-size:calc(17px * var(--ab-fs,1)); line-height: 1; display: flex; align-items: center; justify-content: center; transition: all .15s; } .ab-lib-fav:hover { background: var(--bg-hover); color: #f59e0b; } /* ── 资料库：嵌入模态（iframe） ── */ .ab-lib-panel.ab-lib-panel-embed { width: 94vw; max-width: 1400px; height: 90vh; } /* 最大化模式：铺满视口 */ .ab-lib-panel.ab-lib-panel-embed.ab-lib-max { max-width: 100vw !important; width: 100vw !important; height: 100vh !important; border-radius: 0 !important; } .ab-lib-openext { font-size:calc(12px * var(--ab-fs,1)); color: var(--accent); text-decoration: none; padding: 5px 11px; border: 1px solid var(--accent); border-radius: calc(7px * var(--ab-radius,1)); transition: all .15s; } .ab-lib-openext:hover { background: linear-gradient(135deg, var(--accent), var(--accent-hover)); color: #fff; } .ab-lib-embed-body { flex: 1; position: relative; overflow: hidden; background: #fff; } .ab-lib-embed-frame { width: 100%; height: 100%; border: none; display: block; } .ab-lib-embed-loading { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size:calc(14px * var(--ab-fs,1)); color: #666; background: #f5f6f8; z-index: 1; } .ab-lib-meta .ab-lib-count { margin-left: 0; } /* ============ ima 自渲染阅读器（方案X：调 BFF 解析接口，绕过客户端拦截） ============ */ /* ab-lib-embed-body 默认 overflow:hidden 会裁剪自渲染内容，reader 模式覆盖为可滚动 */ .ab-lib-embed-body.ab-lib-reader { overflow-y: auto !important; overflow-x: hidden; } .ab-lib-reader { overflow-y: auto; padding: 14px 16px 30px; background: #f5f6f8; } .ab-reader-kbbar { display: flex; align-items: center; justify-content: space-between; gap: 10px; background: linear-gradient(135deg,var(--accent-hover),var(--accent)); color: #fff; border-radius: calc(12px * var(--ab-radius,1)); padding: 13px 16px; margin-bottom: 14px; flex-wrap: wrap; } .ab-reader-kbname { font-size:calc(16px * var(--ab-fs,1)); font-weight: 700; } .ab-reader-kbcount { font-size:calc(11px * var(--ab-fs,1)); opacity: .9; } .ab-reader-list { display: flex; flex-direction: column; gap: 12px; } .ab-reader-item { background: #fff; border: 1px solid #e5e6eb; border-radius: calc(12px * var(--ab-radius,1)); overflow: hidden; transition: box-shadow .15s; } .ab-reader-item:hover { box-shadow: 0 4px 14px rgba(0,0,0,.07); } .ab-reader-head { padding: 13px 15px 11px; cursor: pointer; display: flex; gap: 11px; align-items: flex-start; } .ab-reader-ic { width: 36px; height: 36px; border-radius: calc(8px * var(--ab-radius,1)); flex-shrink: 0; display: flex; align-items: center; justify-content: center; font-size:calc(10px * var(--ab-fs,1)); font-weight: 700; color: #fff; } .ab-reader-ic.ic-pdf { background: #ef4444; } .ab-reader-ic.ic-note { background: #f59e0b; } .ab-reader-ic.ic-img { background: #8b5cf6; } .ab-reader-ic.ic-wx { background: #07c160; } .ab-reader-main { flex: 1; min-width: 0; } .ab-reader-title { font-size:calc(14px * var(--ab-fs,1)); font-weight: 600; line-height: 1.4; color: #1a1b26; } .ab-reader-meta { font-size:calc(11px * var(--ab-fs,1)); color: #999; margin-top: 4px; display: flex; gap: 9px; align-items: center; flex-wrap: wrap; } .ab-reader-type { background: #f0f0f2; padding: 1px 7px; border-radius: calc(4px * var(--ab-radius,1)); } .ab-reader-ok { color: var(--accent-hover); } .ab-reader-arrow { color: #bbb; font-size:calc(17px * var(--ab-fs,1)); flex-shrink: 0; align-self: center; transition: transform .2s; } .ab-reader-item.open .ab-reader-arrow { transform: rotate(90deg); } .ab-reader-body { display: none; padding: 0 15px 14px 62px; border-top: 1px solid #f4f4f5; } .ab-reader-item.open .ab-reader-body { display: block; } .ab-reader-summary { background: var(--accent-light); border: 1px solid var(--accent-light); border-radius: calc(8px * var(--ab-radius,1)); padding: 11px 13px; margin-top: 12px; } .ab-reader-sumlb { font-size:calc(11px * var(--ab-fs,1)); font-weight: 700; color: var(--accent-hover); margin-bottom: 4px; } .ab-reader-sumtxt { font-size:calc(12.5px * var(--ab-fs,1)); line-height: 1.7; color: #374151; } .ab-reader-wxlink { display: inline-flex; align-items: center; gap: 6px; margin-top: 11px; background: #07c160; color: #fff; font-size:calc(12.5px * var(--ab-fs,1)); padding: 7px 15px; border-radius: calc(7px * var(--ab-radius,1)); text-decoration: none; } .ab-reader-wxlink:hover { background: #06ad56; } .ab-reader-media { margin-top: 11px; } .ab-reader-medialb { font-size:calc(12px * var(--ab-fs,1)); color: #666; margin-bottom: 6px; } .ab-reader-media img { max-width: 100%; border-radius: calc(7px * var(--ab-radius,1)); border: 1px solid #eee; image-rendering: -webkit-optimize-contrast; } .ab-reader-nolink { font-size:calc(12px * var(--ab-fs,1)); color: #999; margin-top: 11px; font-style: italic; } /* 目录型：分类图标 + 面包屑 + 正文预览 */ .ab-reader-ic.ic-folder { background: #3b82f6; font-size:calc(18px * var(--ab-fs,1)); } .ab-reader-item.is-folder { border-left: 3px solid #3b82f6; } .ab-reader-crumb { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 8px 2px 12px; font-size:calc(12px * var(--ab-fs,1)); color: #666; /* 吸顶：下拉时返回按钮常驻窗体顶部 */ position: sticky; top: -14px; z-index: 50; background: #f5f6f8; margin: -14px -16px 6px; padding-left: 16px; padding-right: 16px; border-bottom: 1px solid #e5e7eb; } .ab-reader-back { color: var(--accent-hover); cursor: pointer; font-weight: 600; flex-shrink: 0; padding: 3px 10px; border-radius: calc(6px * var(--ab-radius,1)); background: var(--accent-light); border: 1px solid var(--accent-light); } .ab-reader-back:hover { background: var(--accent-light); } .ab-reader-path { color: #999; } .ab-reader-intro { background: #fffbeb; border: 1px solid #fde68a; border-radius: calc(8px * var(--ab-radius,1)); padding: 11px 13px; margin-top: 10px; } .ab-reader-introlb { font-size:calc(11px * var(--ab-fs,1)); font-weight: 700; color: #b45309; margin-bottom: 4px; } .ab-reader-introtxt { font-size:calc(12.5px * var(--ab-fs,1)); line-height: 1.7; color: #44403c; white-space: pre-wrap; word-break: break-word; } /* 分页加载更多 */ .ab-reader-sentinel { text-align: center; padding: 14px 0 6px; } .ab-reader-more { display: inline-block; font-size:calc(12.5px * var(--ab-fs,1)); color: var(--accent-hover); cursor: pointer; padding: 7px 18px; border-radius: calc(8px * var(--ab-radius,1)); background: var(--accent-light); border: 1px solid var(--accent-light); } .ab-reader-more:hover { background: var(--accent-light); } .ab-reader-end { font-size:calc(12px * var(--ab-fs,1)); color: #bbb; } /* ============ 内容包胶囊（1:1 同快捷标签尺寸，图标+名称，不透提示词） ============ */ .ab-packbar { padding: 8px 16px 0; } .ab-packbar.hidden { display: none; } .ab-pack-chip { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--accent); border-radius: calc(16px * var(--ab-radius,1)); background: var(--accent-light); color: var(--accent); padding: 6px 8px 6px 13px; font-size:calc(13px * var(--ab-fs,1)); font-weight: 500; white-space: nowrap; } .ab-pack-ic { display: inline-flex; align-items: center; flex-shrink: 0; color: var(--accent); } .ab-pack-ic .ab-ic { width: 17px; height: 17px; } /* 快捷通道里的专家头像（圆形小头像） */ .ab-pack-ava { width: 20px; height: 20px; border-radius: 50%; object-fit: cover; flex-shrink: 0; } .ab-pack-kind { font-size:calc(10px * var(--ab-fs,1)); padding: 1px 5px; border-radius: calc(5px * var(--ab-radius,1)); background: linear-gradient(135deg, var(--accent), var(--accent-hover)); color: #fff; opacity: .8; flex-shrink: 0; } .ab-pack-name { white-space: nowrap; } .ab-pack-x { flex-shrink: 0; border: none; background: none; color: var(--accent); cursor: pointer; padding: 0; margin-left: 2px; border-radius: 50%; display: flex; align-items: center; opacity: 0.65; } .ab-pack-x:hover { opacity: 1; background: rgba(0,0,0,0.08); } .ab-pack-x .ab-ic { width: 14px; height: 14px; } /* 气泡内已发送的内容包小卡片 */ .ab-pack-mini { display: inline-flex; align-items: center; gap: 6px; font-size:calc(12px * var(--ab-fs,1)); font-weight: 600; border: 1px solid rgba(255,255,255,0.3); border-radius: calc(8px * var(--ab-radius,1)); padding: 4px 10px; margin-bottom: 8px; color: inherit; background: rgba(255,255,255,0.12); } .ab-pack-mini .ab-ic { width: 14px; height: 14px; } .ab-light .ab-pack-mini { border-color: var(--border); background: var(--bg-secondary); color: var(--text-primary); } /* ============ P2 多模态附件（输入区待发预览 + 气泡内已发缩略图） ============ */ .ab-attachbar { padding: 8px 16px 0; display: flex; flex-wrap: wrap; gap: 8px; } .ab-attachbar.hidden { display: none; } .ab-attach-chip { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--border); border-radius: calc(10px * var(--ab-radius,1)); background: var(--bg-secondary); padding: 4px 6px 4px 9px; font-size:calc(12px * var(--ab-fs,1)); max-width: 230px; } .ab-attach-chip.is-img { padding: 4px; } .ab-attach-thumb { width: 34px; height: 34px; border-radius: calc(6px * var(--ab-radius,1)); object-fit: cover; display: block; } .ab-attach-ico { display: inline-flex; align-items: center; color: var(--accent); flex-shrink: 0; } .ab-attach-ico.is-txt { color: #0891b2; } .ab-attach-ico .ab-ic { width: 16px; height: 16px; } .ab-attach-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 120px; color: var(--text-primary); } .ab-attach-size { color: var(--text-secondary); font-size:calc(11px * var(--ab-fs,1)); flex-shrink: 0; } .ab-attach-x { flex-shrink: 0; border: none; background: none; color: var(--text-secondary); cursor: pointer; padding: 0; display: flex; align-items: center; opacity: 0.6; } .ab-attach-x:hover { opacity: 1; } .ab-attach-x .ab-ic { width: 13px; height: 13px; } /* 用户气泡内已发送附件 */ .ab-attach-mini { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; } .ab-attach-mini-thumb { width: 96px; height: 96px; border-radius: calc(8px * var(--ab-radius,1)); object-fit: cover; border: 1px solid rgba(255,255,255,0.35); display: block; } .ab-attach-mini-chip { display: inline-flex; align-items: center; gap: 5px; font-size:calc(12px * var(--ab-fs,1)); border: 1px solid rgba(255,255,255,0.3); border-radius: calc(8px * var(--ab-radius,1)); padding: 4px 9px; background: rgba(255,255,255,0.12); color: inherit; } .ab-attach-mini-chip .ab-ic { width: 13px; height: 13px; } .ab-light .ab-attach-mini-chip { border-color: var(--border); background: var(--bg-secondary); color: var(--text-primary); } .ab-light .ab-attach-mini-thumb { border-color: var(--border); } /* 邀请弹窗 */ .ab-invite-code-row { display: flex; gap: 10px; margin-bottom: 14px; } .ab-invite-code { flex: 1; padding: 12px 16px; border: 1.5px dashed var(--border); border-radius: calc(10px * var(--ab-radius,1)); font-size:calc(20px * var(--ab-fs,1)); font-weight: 700; font-family: Consolas, monospace; letter-spacing: 2px; color: var(--accent); text-align: center; background: var(--bg-secondary); } .ab-invite-link-row { display: flex; gap: 8px; margin-bottom: 8px; } .ab-invite-link { flex: 1; padding: 10px 12px; border: 1px solid var(--border); border-radius: calc(8px * var(--ab-radius,1)); font-size:calc(12px * var(--ab-fs,1)); color: var(--text-secondary); background: var(--bg-secondary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } /* 外观：浅色/深色切换按钮 */ .ab-user-theme-btns { margin-left: auto; display: flex; gap: 4px; } .ab-user-theme-btn { border: 1px dashed var(--border); background: var(--bg-primary); color: var(--text-muted); font-size:calc(11px * var(--ab-fs,1)); padding: 2px 8px; border-radius: calc(6px * var(--ab-radius,1)); cursor: pointer; transition: all 0.12s; } .ab-user-theme-btn:hover { border-color: var(--accent); color: var(--accent); } .ab-user-theme-btn.ab-theme-on { background: var(--bg-primary); border: 1px dashed var(--accent); color: var(--accent); font-weight: 600; } .ab-more-btn { display: flex; align-items: center; gap: 6px; border: none; background: none; color: var(--side-muted); font-size:calc(13px * var(--ab-fs,1)); padding: 8px 10px; cursor: pointer; border-radius: calc(8px * var(--ab-radius,1)); } .ab-more-btn:hover { background: var(--side-hover); color: var(--side-text-strong); } /* ===== 命令面板 (Ctrl+K) ===== */ .ab-palette-overlay { position: fixed; inset: 0; z-index: 2000; background: rgba(0, 0, 0, 0.45); backdrop-filter: blur(2px); display: flex; justify-content: center; align-items: flex-start; padding-top: 15vh; } .ab-palette-overlay.hidden { display: none; } .ab-palette { width: 560px; max-width: 92vw; max-height: 60vh; background: var(--bg-primary); border: 1px solid var(--border); border-radius: calc(12px * var(--ab-radius,1)); overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 16px 48px rgba(0, 0, 0, 0.35); } .ab-palette-head { display: flex; align-items: center; gap: 8px; padding: 10px 14px; border-bottom: 1px solid var(--border); } .ab-palette-head .ab-ic { width: 16px; height: 16px; color: var(--text-muted); flex-shrink: 0; } .ab-palette-input { flex: 1; border: none; outline: none; background: transparent; color: var(--text-primary); font-size:calc(14px * var(--ab-fs,1)); font-family: inherit; } .ab-palette-input::placeholder { color: var(--text-muted); } .ab-palette-hint { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); border: 1px solid var(--border); border-radius: calc(4px * var(--ab-radius,1)); padding: 1px 6px; flex-shrink: 0; } .ab-palette-list { overflow-y: auto; padding: 6px; } .ab-palette-item { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: calc(8px * var(--ab-radius,1)); cursor: pointer; } .ab-palette-item .ab-ic { width: 16px; height: 16px; color: var(--text-muted); flex-shrink: 0; } .ab-palette-item.ab-palette-sel { background: var(--accent-light); } .ab-palette-item.ab-palette-sel .ab-ic { color: var(--accent); } .ab-palette-name { flex: 1; font-size:calc(13px * var(--ab-fs,1)); color: var(--text-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .ab-palette-item.ab-palette-sel .ab-palette-name { color: var(--accent); } .ab-palette-hinttxt { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); flex-shrink: 0; max-width: 40%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .ab-palette-empty { padding: 18px; text-align: center; font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); } /* ===== 设置面板 ===== */ .ab-set-overlay { position: fixed; inset: 0; z-index: 2100; background: rgba(0, 0, 0, 0.45); display: flex; align-items: center; justify-content: center; } .ab-set-overlay.hidden { display: none; } .ab-set-dialog { width: 480px; max-width: 92vw; max-height: 80vh; background: var(--bg-primary); border: 1px solid var(--border); border-radius: calc(12px * var(--ab-radius,1)); overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 16px 48px rgba(0, 0, 0, 0.35); } .ab-set-head { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; border-bottom: 1px solid var(--border); font-size:calc(14px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary); } .ab-set-body { overflow-y: auto; padding: 8px 16px 16px; } .ab-set-group { padding: 12px 0; border-bottom: 1px solid var(--border); } .ab-set-group:last-child { border-bottom: none; } .ab-set-label { font-size:calc(12px * var(--ab-fs,1)); font-weight: 600; color: var(--text-secondary); margin-bottom: 8px; } /* 【C.061 · 2026-10-17 老板裁定】设置「模型」页分两个「区块」，标题加底色以一眼区分： .ab-region-ab = AutoBuddy 模型区 ┐ 两者底色一致（强调色浅底 + 强调色左条 + 强调色文字）， .ab-region-sub = 子系统模型分配区 ┘ 靠「两块各自独立成区」区分，不再用灰/绿两色区分。 非「模型」页也可复用（本例仅模型页使用）。 */ .ab-set-region { margin-bottom: 4px; } .ab-set-region-head { font-size: calc(13px * var(--ab-fs,1)); font-weight: 700; line-height: 1.3; padding: 8px 12px; margin: 2px 0 4px; border-radius: calc(8px * var(--ab-radius,1)); border-left: 3px solid var(--border); background: var(--bg-tertiary); color: var(--text-secondary); } .ab-set-region-head.ab-region-ab { background: var(--accent-light); border-left-color: var(--accent); color: var(--accent); } .ab-set-region-head.ab-region-sub { background: var(--accent-light); border-left-color: var(--accent); color: var(--accent); } .ab-set-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; } .ab-set-radio { display: inline-flex; align-items: center; gap: 5px; font-size:calc(13px * var(--ab-fs,1)); color: var(--text-secondary); cursor: pointer; padding: 5px 10px; border: 1px solid var(--border); border-radius: calc(8px * var(--ab-radius,1)); } .ab-set-radio input { accent-color: var(--accent); margin: 0; } .ab-set-radio.ab-set-on { border-color: var(--accent); color: var(--accent); background: var(--accent-light); } .ab-set-select { flex: 1; min-width: 0; padding: 7px 10px; font-size:calc(13px * var(--ab-fs,1)); background: var(--bg-tertiary); border: 1px solid var(--border); border-radius: calc(8px * var(--ab-radius,1)); color: var(--text-primary); outline: none; font-family: inherit; } .ab-set-select:focus { border-color: var(--accent); } .ab-set-note { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); margin-top: 6px; line-height: 1.5; } .ab-set-about { font-size:calc(12.5px * var(--ab-fs,1)); color: var(--text-secondary); line-height: 1.8; } /* ===== 设置中心 v2：左菜单 + 右内容（对标 WorkBuddy 总设置窗口） ===== */ .ab-set-dialog.ab-set-v2 { width: 860px; max-width: 96vw; height: 620px; max-height: 88vh; } .ab-set-v2-main { display: flex; flex: 1; min-height: 0; } .ab-set-nav { width: 160px; flex-shrink: 0; padding: 10px 8px; border-right: 1px solid var(--border); overflow-y: auto; display: flex; flex-direction: column; gap: 2px; } .ab-set-nav-item { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: calc(8px * var(--ab-radius,1)); font-size:calc(13px * var(--ab-fs,1)); color: var(--text-secondary); cursor: pointer; transition: all .12s; border: none; background: transparent; text-align: left; font-family: inherit; white-space: nowrap; } .ab-set-nav-item .ab-ic { width: 15px; height: 15px; flex-shrink: 0; } .ab-set-nav-item:hover { background: var(--bg-tertiary); color: var(--text-primary); } .ab-set-nav-item.ab-set-nav-on { background: var(--accent-light); color: var(--accent); font-weight: 600; } .ab-set-pages { flex: 1; min-width: 0; overflow-y: auto; padding: 16px 20px; } .ab-set-page { display: none; } .ab-set-page.ab-set-page-on { display: block; } .ab-set-page-title { font-size:calc(15px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary); margin: 0 0 4px; } .ab-set-page-desc { font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); margin-bottom: 14px; } /* 行式控件 */ .ab-set-input, .ab-set-num { flex: 1; min-width: 0; padding: 7px 10px; font-size:calc(13px * var(--ab-fs,1)); background: var(--bg-tertiary); border: 1px solid var(--border); border-radius: calc(8px * var(--ab-radius,1)); color: var(--text-primary); outline: none; font-family: inherit; } .ab-set-num { flex: none; width: 90px; } .ab-set-input:focus, .ab-set-num:focus { border-color: var(--accent); } .ab-set-input[type="password"] { letter-spacing: 1px; } .ab-set-btn { padding: 6px 14px; font-size:calc(12.5px * var(--ab-fs,1)); border-radius: calc(8px * var(--ab-radius,1)); cursor: pointer; border: 1px solid var(--border); background: var(--bg-tertiary); color: var(--text-primary); font-family: inherit; transition: all .12s; flex-shrink: 0; } .ab-set-btn:hover { border-color: var(--accent); color: var(--accent); } .ab-set-btn.danger:hover { border-color: var(--error,#ef4444); color: var(--error,#ef4444); } .ab-set-btn.primary { background: linear-gradient(135deg, var(--accent), var(--accent-hover)); border-color: var(--accent); color: #fff; } .ab-set-btn.primary:hover { opacity: 0.88; color: #fff; } /* v347 描边黑字按钮（整套创建等）：无实心背景 + 黑字 + 黑细边 */ .ab-set-btn.ab-btn-outline { background: transparent; border: 1px solid var(--border); color: var(--text-muted); } .ab-set-btn.ab-btn-outline:hover { border-color: var(--accent); color: var(--accent); opacity: 1; } /* 开关 */ .ab-set-switch { position: relative; width: 38px; height: 20px; flex-shrink: 0; cursor: pointer; } .ab-set-switch input { opacity: 0; width: 0; height: 0; position: absolute; } .ab-set-switch .ab-set-slider { position: absolute; inset: 0; border-radius: calc(20px * var(--ab-radius,1)); transition: .2s; background: var(--border); } .ab-set-switch .ab-set-slider::before { content: ''; position: absolute; width: 14px; height: 14px; border-radius: 50%; left: 3px; top: 3px; background: #fff; transition: .2s; box-shadow: 0 1px 3px rgba(0,0,0,0.25); } .ab-set-switch input:checked + .ab-set-slider { background: linear-gradient(135deg, var(--accent), var(--accent-hover)); } .ab-set-switch input:checked + .ab-set-slider::before { transform: translateX(18px); } .ab-set-row-between { display: flex; align-items: center; justify-content: space-between; gap: 12px; } .ab-set-row-label { font-size:calc(13px * var(--ab-fs,1)); color: var(--text-primary); } .ab-set-range { flex: 1; accent-color: var(--accent); } /* 快捷键表 */ .ab-kbd-row { display: flex; align-items: center; justify-content: space-between; padding: 8px 0; border-bottom: 1px dashed var(--border); font-size:calc(13px * var(--ab-fs,1)); } .ab-kbd-row:last-child { border-bottom: none; } .ab-kbd { display: inline-flex; align-items: center; gap: 3px; } .ab-kbd span { padding: 2px 7px; border-radius: calc(5px * var(--ab-radius,1)); font-size:calc(11px * var(--ab-fs,1)); font-family: Consolas, monospace; background: var(--bg-tertiary); border: 1px solid var(--border); color: var(--text-primary); box-shadow: 0 1px 0 var(--border); } /* 存储统计 */ .ab-store-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 8px 0 12px; } .ab-store-cell { padding: 10px 12px; border: 1px solid var(--border); border-radius: calc(8px * var(--ab-radius,1)); } .ab-store-num { font-size:calc(18px * var(--ab-fs,1)); font-weight: 700; color: var(--text-primary); } .ab-store-name { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); margin-top: 2px; } .ab-more-panel { /* 定位由 JS anchorPopup 用 fixed 贴按钮上方 */ width: 180px; background: var(--bg-primary); border: 1px solid var(--border); border-radius: calc(10px * var(--ab-radius,1)); box-shadow: var(--shadow); z-index: 200; overflow: hidden; } .ab-more-panel.hidden { display: none; } .ab-more-item { padding: 10px 14px; font-size:calc(13px * var(--ab-fs,1)); color: var(--text-secondary); cursor: pointer; } .ab-more-item:hover { background: var(--bg-hover); color: var(--text-primary); } /* ========== 顶栏标题 + 三按钮 ========== */ .ab-header-title { font-size:calc(13px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary); max-width: 40%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } /* 搜索条 */ .ab-searchbar { display: flex; align-items: center; gap: 8px; padding: 8px 16px; background: var(--bg-secondary); border-bottom: 1px solid var(--border); } .ab-searchbar.hidden { display: none; } .ab-search-input { flex: 1; border: 1px solid var(--border); background: var(--bg-tertiary); color: var(--text-primary); border-radius: calc(8px * var(--ab-radius,1)); padding: 6px 12px; font-size:calc(13px * var(--ab-fs,1)); outline: none; } .ab-search-input:focus { border-color: var(--accent); } .ab-search-count { font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); } .ab-search-hit { outline: 2px solid var(--warn); outline-offset: 2px; border-radius: calc(12px * var(--ab-radius,1)); } /* 历史提问下拉 */ .ab-history-panel { position: absolute; top: 52px; right: 60px; width: 320px; max-height: 400px; background: var(--bg-primary); border: 1px solid var(--border); border-radius: calc(10px * var(--ab-radius,1)); box-shadow: var(--shadow); z-index: 110; overflow: hidden; display: flex; flex-direction: column; } .ab-history-panel.hidden { display: none; } .ab-history-head { padding: 10px 14px; border-bottom: 1px solid var(--border); font-size:calc(13px * var(--ab-fs,1)); font-weight: 600; } .ab-history-list { overflow-y: auto; } .ab-history-item { padding: 9px 14px; font-size:calc(12px * var(--ab-fs,1)); color: var(--text-secondary); cursor: pointer; border-bottom: 1px solid var(--border); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .ab-history-item:hover { background: var(--bg-hover); color: var(--text-primary); } /* ========== 欢迎区（商务版 · 大标题 + 三模式） ========== */ .ab-welcome2 { display: flex; flex-direction: column; align-items: center; gap: 0; padding: 4px 24px 12px; } .ab-w2-title { font-size:calc(50px * var(--ab-fs,1)); font-weight: 700; color: var(--text-primary); letter-spacing: 2px; text-align: center; margin: 0; line-height: 1; } /* v106: 欢迎页蓝紫色 LOGO 图片（替换文字标题） */ .ab-w2-logo-img { max-width: 360px; width: 100%; height: auto; display: block; margin: 0 auto; } @media (max-width: 768px) { .ab-w2-logo-img { max-width: 260px; } } /* ── 欢迎页标题标签 ── */ .ab-w2-title-wrap { position: relative; display: inline-block; text-align: center; } .ab-w2-badges { position: absolute; top: 4px; right: -130px; display: flex; gap: 5px; } .ab-w2-badge { display: inline-block; padding: 2px 8px; font-size:calc(10px * var(--ab-fs,1)); font-weight: 600; border-radius: 99px; letter-spacing: 0.3px; white-space: nowrap; cursor: default; } a.ab-w2-badge { text-decoration: none; } .ab-w2-badge-beta { background: #000; color: #fff; cursor: pointer; transition: all .15s; } .ab-w2-badge-beta:hover { filter: brightness(1.7); transform: translateY(-1px); } .ab-w2-badge-wp { background: linear-gradient(135deg, var(--accent), var(--accent-hover)); color: #fff; cursor: pointer; transition: all .15s; } .ab-w2-badge-wp:hover { filter: brightness(1.1); transform: translateY(-1px); } /* ── 白皮书弹窗 ── */ .ab-wp-modal { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; } .ab-wp-overlay { position: absolute; inset: 0; background: rgba(0,0,0,.55); backdrop-filter: blur(4px); } .ab-wp-panel { position: relative; width: 92vw; max-width: 1100px; height: 88vh; background: var(--bg-primary, #1a1b26); border: 1px solid var(--border, rgba(255,255,255,.08)); border-radius: calc(16px * var(--ab-radius,1)); display: flex; flex-direction: column; overflow: hidden; box-shadow: 0 24px 64px rgba(0,0,0,.4); } .ab-wp-header { display: flex; align-items: center; justify-content: space-between; padding: 16px 24px; border-bottom: 1px solid var(--border, rgba(255,255,255,.08)); flex-shrink: 0; } .ab-wp-header-left { display: flex; flex-direction: column; gap: 2px; } .ab-wp-header-title { font-size:calc(18px * var(--ab-fs,1)); font-weight: 700; color: var(--text-primary, #e4e6f0); } .ab-wp-header-sub { font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted, #8a8fa8); } .ab-wp-header-right { display: flex; align-items: center; gap: 12px; } .ab-wp-header-ver { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted, #8a8fa8); } .ab-wp-close { width: 32px; height: 32px; border: none; border-radius: calc(8px * var(--ab-radius,1)); background: var(--bg-hover, rgba(255,255,255,.06)); color: var(--text-secondary, #b0b4c8); font-size:calc(16px * var(--ab-fs,1)); cursor: pointer; display: flex; align-items: center; justify-content: center; transition: background .15s; } .ab-wp-close:hover { background: var(--bg-active, rgba(255,255,255,.12)); } /* [AB-MERGE-20260920] 白皮书顶栏绿色「分享网页」按钮 */ .ab-wp-share { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 14px; border: none; border-radius: 99px; background: linear-gradient(100deg, var(--accent-hover), var(--accent)); color: #fff; font-size:calc(13px * var(--ab-fs,1)); font-weight: 700; cursor: pointer; transition: transform .15s, filter .15s; white-space: nowrap; } .ab-wp-share:hover { filter: brightness(1.08); transform: translateY(-1px); } .ab-wp-share:active { transform: translateY(0); } .ab-wp-share .ab-ic { width: 15px; height: 15px; } /* [AB-WP-20260920] 白皮书弹窗右上角「操作文档」描边按钮（封面按钮已删，统一收口到顶栏） */ .ab-wp-doc { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 14px; border: 1px solid var(--border, rgba(255,255,255,.18)); border-radius: 99px; background: transparent; color: var(--text-secondary, #b0b4c8); font-size:calc(12.5px * var(--ab-fs,1)); font-weight: 600; cursor: pointer; text-decoration: none; transition: border-color .15s, color .15s; white-space: nowrap; } .ab-wp-doc:hover { border-color: var(--accent); color: var(--accent); } .ab-wp-doc .ab-ic { width: 15px; height: 15px; } .ab-wp-doc .ar { font-size:calc(11px * var(--ab-fs,1)); opacity: .8; } /* [AB-MERGE-20260920] 分享弹窗（公众号式卡片：二维码 + 复制链接，替代系统分享面板） */ .ab-wp-share-mask { position: fixed; inset: 0; z-index: 10001; display: flex; align-items: center; justify-content: center; background: rgba(15,23,42,.45); } .ab-wp-share-card { position: relative; width: 440px; max-width: calc(100vw - 40px); background: #fff; border-radius: calc(16px * var(--ab-radius,1)); padding: 22px 24px 24px; box-shadow: 0 20px 60px rgba(15,23,42,.25); box-sizing: border-box; } .ab-wp-share-close { position: absolute; top: 12px; right: 14px; width: 28px; height: 28px; display: flex; align-items: center; justify-content: center; border-radius: 50%; cursor: pointer; color: #64748b; font-size:calc(14px * var(--ab-fs,1)); line-height: 1; background: #f1f5f9; transition: background .15s, color .15s; } .ab-wp-share-close:hover { background: #e2e8f0; color: #0f172a; } .ab-wp-share-head { display: flex; align-items: center; gap: 8px; font-size:calc(15px * var(--ab-fs,1)); font-weight: 800; color: #0f172a; margin-bottom: 14px; } .ab-wp-share-head .ab-ic { width: 18px; height: 18px; color: var(--accent-hover); } .ab-wp-share-body { display: flex; gap: 18px; } .ab-wp-share-qrwrap { flex: none; width: 152px; display: flex; flex-direction: column; align-items: center; gap: 8px; } .ab-wp-share-qr { width: 148px; height: 148px; border: 1px solid #e2e8f0; border-radius: calc(12px * var(--ab-radius,1)); padding: 6px; box-sizing: border-box; background: #fff; } .ab-wp-share-qr-tip { font-size:calc(11px * var(--ab-fs,1)); color: #94a3b8; line-height: 16px; text-align: center; } .ab-wp-share-info { flex: 1; min-width: 0; display: flex; flex-direction: column; } .ab-wp-share-title { font-size:calc(14.5px * var(--ab-fs,1)); font-weight: 700; color: #0f172a; line-height: 21px; } .ab-wp-share-sub { font-size:calc(12px * var(--ab-fs,1)); color: #64748b; line-height: 18px; margin: 6px 0 12px; } .ab-wp-share-kv { display: flex; align-items: center; gap: 8px; margin-top: auto; } .ab-wp-share-url { flex: 1; min-width: 0; height: 34px; border: 1px solid #e2e8f0; border-radius: calc(8px * var(--ab-radius,1)); padding: 0 10px; font-size:calc(12px * var(--ab-fs,1)); color: #475569; background: #f8fafc; box-sizing: border-box; } .ab-wp-share-copy { flex: none; height: 34px; padding: 0 14px; border: none; border-radius: calc(8px * var(--ab-radius,1)); background: linear-gradient(100deg, var(--accent-hover), var(--accent)); color: #fff; font-size:calc(12.5px * var(--ab-fs,1)); font-weight: 700; cursor: pointer; transition: filter .15s; } .ab-wp-share-copy:hover { filter: brightness(1.08); } .ab-wp-share-copy.ok { background: var(--accent-hover); } /* ── 资料库详情模态 ── */ .ab-lib-modal { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; } .ab-lib-overlay { position: absolute; inset: 0; background: rgba(0,0,0,.55); backdrop-filter: blur(4px); } .ab-lib-panel { position: relative; width: 92vw; max-width: 1000px; height: 86vh; background: var(--bg-primary, #1a1b26); border: 1px solid var(--border, rgba(255,255,255,.08)); border-radius: calc(16px * var(--ab-radius,1)); display: flex; flex-direction: column; overflow: hidden; box-shadow: 0 24px 64px rgba(0,0,0,.4); } .ab-lib-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 20px; border-bottom: 1px solid var(--border, rgba(255,255,255,.08)); flex-shrink: 0; } .ab-lib-head-l { display: flex; align-items: center; gap: 12px; } .ab-lib-head-ic { width: 38px; height: 38px; border-radius: calc(10px * var(--ab-radius,1)); background: color-mix(in srgb, var(--accent) 15%, transparent); color: var(--accent); display: flex; align-items: center; justify-content: center; } .ab-lib-head-ic svg { width: 20px; height: 20px; } .ab-lib-head-title { font-size:calc(16px * var(--ab-fs,1)); font-weight: 700; color: var(--text-primary, #e4e6f0); } .ab-lib-head-sub { font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted, #8a8fa8); margin-top: 2px; } /* 转载预览提示行：深色底上用亮琥珀色（与内页正文预览标签 #b45309 同色系，深色底等效观感） */ .ab-lib-panel-embed .ab-lib-head-sub { color: #f59e0b; font-weight: 600; } .ab-lib-head-r { display: flex; align-items: center; gap: 10px; } .ab-lib-head-tag { font-size:calc(11px * var(--ab-fs,1)); padding: 2px 8px; border-radius: calc(6px * var(--ab-radius,1)); background: color-mix(in srgb, var(--accent) 15%, transparent); color: var(--accent); } .ab-lib-head-count { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted, #8a8fa8); } .ab-lib-close { width: 32px; height: 32px; border: none; border-radius: calc(8px * var(--ab-radius,1)); background: var(--bg-hover, rgba(255,255,255,.06)); color: var(--text-secondary, #b0b4c8); font-size:calc(16px * var(--ab-fs,1)); cursor: pointer; display: flex; align-items: center; justify-content: center; } .ab-lib-close:hover { background: var(--bg-active, rgba(255,255,255,.12)); } /* 最大化按钮：与关闭按钮同款，尺寸稍小 */ .ab-lib-max-btn { width: 32px; height: 32px; border: none; border-radius: calc(8px * var(--ab-radius,1)); background: var(--bg-hover, rgba(255,255,255,.06)); color: var(--text-secondary, #b0b4c8); font-size:calc(14px * var(--ab-fs,1)); cursor: pointer; display: flex; align-items: center; justify-content: center; } .ab-lib-max-btn:hover { background: var(--bg-active, rgba(255,255,255,.12)); color: var(--accent); } .ab-lib-main { display: flex; flex: 1; overflow: hidden; } .ab-lib-side { width: 210px; flex-shrink: 0; border-right: 1px solid var(--border, rgba(255,255,255,.08)); overflow-y: auto; padding: 12px; } .ab-lib-cat { padding: 4px 0; } .ab-lib-cat-name { padding: 9px 12px; border-radius: calc(8px * var(--ab-radius,1)); font-size:calc(13px * var(--ab-fs,1)); color: var(--text-secondary, #b0b4c8); cursor: pointer; display: flex; align-items: center; justify-content: space-between; transition: all .15s; } .ab-lib-cat-name:hover { background: var(--bg-hover, rgba(255,255,255,.06)); color: var(--text-primary, #e4e6f0); } .ab-lib-cat.on .ab-lib-cat-name { background: color-mix(in srgb, var(--accent) 15%, transparent); color: var(--accent); font-weight: 600; } .ab-lib-cat-n { font-size:calc(11px * var(--ab-fs,1)); opacity: .7; font-weight: 400; } .ab-lib-content { flex: 1; overflow: hidden; display: flex; flex-direction: column; } .ab-lib-doclist { flex: 1; overflow-y: auto; padding: 16px 20px; } .ab-lib-doclist-h { font-size:calc(15px * var(--ab-fs,1)); font-weight: 700; color: var(--text-primary, #e4e6f0); margin-bottom: 14px; display: flex; align-items: baseline; gap: 8px; } .ab-lib-doclist-h span { font-size:calc(12px * var(--ab-fs,1)); font-weight: 400; color: var(--text-muted, #8a8fa8); } .ab-lib-doc { padding: 13px 15px; border: 1px solid var(--border, rgba(255,255,255,.08)); border-radius: calc(10px * var(--ab-radius,1)); margin-bottom: 10px; cursor: pointer; transition: all .15s; background: var(--bg-secondary, rgba(255,255,255,.02)); } .ab-lib-doc:hover { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 6%, transparent); } .ab-lib-doc-t { font-size:calc(14px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary, #e4e6f0); } .ab-lib-doc-s { font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted, #8a8fa8); margin-top: 5px; line-height: 1.5; } .ab-lib-doc-m { display: flex; gap: 14px; margin-top: 8px; font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted, #8a8fa8); } .ab-lib-docview { flex: 1; overflow-y: auto; padding: 16px 24px 40px; } .ab-lib-back { border: none; background: var(--bg-hover, rgba(255,255,255,.06)); color: var(--text-secondary, #b0b4c8); font-size:calc(12px * var(--ab-fs,1)); padding: 6px 12px; border-radius: calc(7px * var(--ab-radius,1)); cursor: pointer; margin-bottom: 16px; } .ab-lib-back:hover { background: color-mix(in srgb, var(--accent) 15%, transparent); color: var(--accent); } .ab-lib-article { max-width: 720px; } .ab-lib-article h1 { font-size:calc(22px * var(--ab-fs,1)); font-weight: 700; color: var(--text-primary, #e4e6f0); margin: 0 0 6px; line-height: 1.3; } .ab-lib-article-m { font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted, #8a8fa8); margin-bottom: 22px; padding-bottom: 14px; border-bottom: 1px solid var(--border, rgba(255,255,255,.08)); } .ab-lib-article h2 { font-size:calc(17px * var(--ab-fs,1)); font-weight: 700; color: var(--text-primary, #e4e6f0); margin: 24px 0 10px; } .ab-lib-article h3 { font-size:calc(15px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary, #e4e6f0); margin: 18px 0 8px; } .ab-lib-article h4 { font-size:calc(14px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary, #e4e6f0); margin: 14px 0 6px; } .ab-lib-article p { font-size:calc(13.5px * var(--ab-fs,1)); line-height: 1.75; color: var(--text-secondary, #b0b4c8); margin: 8px 0; } .ab-lib-article ul { margin: 8px 0; padding-left: 20px; } .ab-lib-article li { font-size:calc(13.5px * var(--ab-fs,1)); line-height: 1.7; color: var(--text-secondary, #b0b4c8); margin: 4px 0; } .ab-lib-article strong { color: var(--text-primary, #e4e6f0); font-weight: 600; } .ab-lib-article code { background: color-mix(in srgb, var(--accent) 12%, transparent); color: var(--accent); padding: 1px 6px; border-radius: calc(4px * var(--ab-radius,1)); font-size:calc(12px * var(--ab-fs,1)); font-family: monospace; } .ab-lib-article pre { background: var(--bg-secondary, rgba(0,0,0,.3)); border: 1px solid var(--border, rgba(255,255,255,.08)); border-radius: calc(8px * var(--ab-radius,1)); padding: 14px; overflow-x: auto; margin: 12px 0; } .ab-lib-article pre code { background: none; color: var(--text-secondary, #b0b4c8); padding: 0; } .ab-lib-article blockquote { border-left: 3px solid var(--accent); background: color-mix(in srgb, var(--accent) 6%, transparent); padding: 10px 14px; margin: 12px 0; border-radius: 0 calc(8px * var(--ab-radius,1)) calc(8px * var(--ab-radius,1)) 0; font-size:calc(13px * var(--ab-fs,1)); color: var(--text-secondary, #b0b4c8); } .ab-lib-article table { width: 100%; border-collapse: collapse; margin: 12px 0; font-size:calc(12.5px * var(--ab-fs,1)); } .ab-lib-article td { border: 1px solid var(--border, rgba(255,255,255,.08)); padding: 8px 10px; color: var(--text-secondary, #b0b4c8); } .ab-lib-article tr:first-child td { background: color-mix(in srgb, var(--accent) 8%, transparent); font-weight: 600; color: var(--text-primary, #e4e6f0); } .ab-wp-body { display: flex; flex: 1; overflow: hidden; } .ab-wp-sidebar { width: 220px; flex-shrink: 0; border-right: 1px solid var(--border, rgba(255,255,255,.08)); padding: 16px 0; overflow-y: auto; } .ab-wp-toc-ch { padding: 8px 20px; font-size:calc(13px * var(--ab-fs,1)); color: var(--text-secondary, #b0b4c8); cursor: pointer; transition: background .12s, color .12s; border-left: 3px solid transparent; } .ab-wp-toc-ch:hover { background: var(--bg-hover, rgba(255,255,255,.04)); color: var(--text-primary, #e4e6f0); } .ab-wp-toc-ch.on { border-left-color: var(--accent); color: var(--accent); background: color-mix(in srgb, var(--accent) 6%, transparent); } .ab-wp-toc-no { font-weight: 700; margin-right: 4px; } /* [AB-WP-20260920] 白皮书侧栏二级标题（默认展示，点击直达对应小节） */ .ab-wp-toc-sec { display: block; padding: 4px 20px 4px 40px; font-size:calc(12px * var(--ab-fs,1)); line-height: 1.5; color: var(--text-muted, #8a8fa8); cursor: pointer; border-left: 3px solid transparent; transition: color .12s, background .12s; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .ab-wp-toc-sec:hover { color: var(--accent); background: var(--bg-hover, rgba(255,255,255,.04)); } .ab-wp-toc-sec.on { color: var(--accent); } .ab-wp-content { flex: 1; padding: 24px 32px; overflow-y: auto; color: var(--text-secondary, #b0b4c8); font-size:calc(14px * var(--ab-fs,1)); line-height: 1.8; } .ab-wp-chapter { margin-bottom: 32px; } .ab-wp-chap-h { margin-bottom: 20px; } .ab-wp-chap-no { font-size:calc(11px * var(--ab-fs,1)); letter-spacing: 0.3em; color: var(--accent); font-weight: 700; } .ab-wp-chap-h h2 { font-size:calc(24px * var(--ab-fs,1)); font-weight: 800; color: var(--text-primary, #e4e6f0); margin: 6px 0 8px; } .ab-wp-chap-bar { width: 48px; height: 4px; background: var(--accent); border-radius: calc(3px * var(--ab-radius,1)); } .ab-wp-sec { margin-bottom: 24px; } .ab-wp-sec h3 { font-size:calc(17px * var(--ab-fs,1)); font-weight: 700; color: var(--text-primary, #e4e6f0); margin-bottom: 10px; } .ab-wp-sec h4 { font-size:calc(15px * var(--ab-fs,1)); font-weight: 700; color: var(--text-primary, #e4e6f0); margin: 16px 0 8px; } .ab-wp-sec h5 { font-size:calc(12px * var(--ab-fs,1)); letter-spacing: 0.1em; color: var(--accent); margin: 14px 0 6px; font-weight: 700; } .ab-wp-sec p { margin: 8px 0; } .ab-wp-sec ul, .ab-wp-sec ol { margin: 8px 0 8px 20px; } .ab-wp-sec li { margin-bottom: 4px; } .ab-wp-sec table { width: 100%; border-collapse: collapse; margin: 12px 0; font-size:calc(13px * var(--ab-fs,1)); } .ab-wp-sec th { background: var(--bg-hover, rgba(255,255,255,.06)); color: var(--text-primary, #e4e6f0); text-align: left; padding: 8px 12px; font-weight: 600; } .ab-wp-sec td { padding: 8px 12px; border-bottom: 1px solid var(--border, rgba(255,255,255,.06)); } .ab-wp-sec tr:nth-child(even) td { background: rgba(255,255,255,.02); } .ab-wp-sec b { color: var(--text-primary, #e4e6f0); } /* [AB-MERGE-20260920] 十八子系统详解内嵌组件：段序号/标签/分组标签/跳过说明/固定列宽表格 */ .ab-wp-sec h4 .sec-no { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: calc(6px * var(--ab-radius,1)); margin-right: 8px; background: var(--accent); color: #fff; font-size:calc(12px * var(--ab-fs,1)); font-weight: 800; vertical-align: middle; } .ab-wp-sec .sec-tag { display: inline-block; font-size:calc(11px * var(--ab-fs,1)); color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, transparent); border: 1px solid color-mix(in srgb, var(--accent) 20%, transparent); border-radius: 99px; padding: 1px 9px; margin-left: 8px; vertical-align: middle; font-weight: 600; } .ab-wp-sec .stage-pill { display: inline-block; font-size:calc(11px * var(--ab-fs,1)); color: #f59e0b; background: rgba(245,158,11,.08); border: 1px solid rgba(245,158,11,.25); border-radius: 99px; padding: 1px 9px; margin-left: 8px; vertical-align: middle; font-weight: 600; } .ab-wp-sec .flow-label { font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted, #8a8fa8); margin: 14px 0 4px; font-weight: 700; } .ab-wp-sec .dim { color: var(--text-muted, #8a8fa8); font-size:calc(12px * var(--ab-fs,1)); } .ab-wp-sec table.wp-align { table-layout: fixed; } .ab-wp-sec table.wp-align th:first-child, .ab-wp-sec table.wp-align td:first-child { width: 108px; } .ab-wp-sec table.wp-align th:nth-child(2), .ab-wp-sec table.wp-align td:nth-child(2) { width: auto; } .ab-wp-sec table.wp-align th:last-child, .ab-wp-sec table.wp-align td:last-child { width: 200px; } .ab-wp-sec .wp-io .wp-box { min-width: 130px; } /* 白皮书内部组件 */ .wp-stats { display: grid; grid-template-columns: repeat(4,1fr); gap: 10px; margin: 14px 0; } .wp-stat { background: color-mix(in srgb, var(--accent) 8%, transparent); border: 1px solid color-mix(in srgb, var(--accent) 15%, transparent); border-radius: calc(10px * var(--ab-radius,1)); padding: 14px 10px; text-align: center; } .wp-stat .n { font-size:calc(22px * var(--ab-fs,1)); font-weight: 800; color: var(--accent); } .wp-stat .n small { font-size:calc(12px * var(--ab-fs,1)); } .wp-stat .t { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted, #8a8fa8); margin-top: 4px; } .wp-note { background: color-mix(in srgb, var(--accent) 6%, transparent); border-left: 3px solid var(--accent); border-radius: 0 calc(8px * var(--ab-radius,1)) calc(8px * var(--ab-radius,1)) 0; padding: 10px 14px; margin: 12px 0; font-size:calc(13px * var(--ab-fs,1)); } .wp-note b { color: var(--accent); } .wp-quote { margin: 20px 0; padding: 16px 22px; background: linear-gradient(120deg, color-mix(in srgb, var(--accent) 6%, transparent), color-mix(in srgb, var(--accent) 2%, transparent)); border-radius: calc(12px * var(--ab-radius,1)); font-size:calc(15px * var(--ab-fs,1)); font-weight: 600; color: var(--accent); line-height: 1.8; text-align: center; } .wp-grid6 { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; margin: 14px 0; } .wp-g6 { border: 1px solid var(--border, rgba(255,255,255,.08)); border-radius: calc(10px * var(--ab-radius,1)); padding: 12px 8px; text-align: center; } .wp-g6 .i { font-size:calc(22px * var(--ab-fs,1)); } .wp-g6 .t { font-size:calc(13px * var(--ab-fs,1)); font-weight: 700; margin-top: 4px; color: var(--text-primary, #e4e6f0); } .wp-g6 .c { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted, #8a8fa8); } .wp-g6.hi { background: color-mix(in srgb, var(--accent) 8%, transparent); border-color: color-mix(in srgb, var(--accent) 20%, transparent); } .wp-tl { border-left: 3px solid color-mix(in srgb, var(--accent) 20%, transparent); margin: 14px 0 14px 6px; padding-left: 18px; } .wp-tl .it { position: relative; margin-bottom: 14px; } .wp-tl .it::before { content: ""; position: absolute; left: -24px; top: 6px; width: 9px; height: 9px; border-radius: 50%; background: var(--accent); border: 2px solid var(--bg-primary, #1a1b26); box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 20%, transparent); } .wp-tl .d { font-size:calc(11px * var(--ab-fs,1)); font-weight: 700; letter-spacing: 0.08em; color: var(--accent); } .wp-tl .t { font-size:calc(14px * var(--ab-fs,1)); font-weight: 700; margin-top: 2px; color: var(--text-primary, #e4e6f0); } .wp-tl p { font-size:calc(13px * var(--ab-fs,1)); margin-top: 2px; } .wp-io { display: flex; align-items: stretch; gap: 8px; margin: 10px 0; flex-wrap: wrap; } .wp-box { flex: 1; min-width: 180px; background: var(--bg-hover, rgba(255,255,255,.04)); border: 1px dashed var(--border, rgba(255,255,255,.1)); border-radius: calc(8px * var(--ab-radius,1)); padding: 8px 12px; font-size:calc(12px * var(--ab-fs,1)); } .wp-box .lb { font-size:calc(11px * var(--ab-fs,1)); color: var(--accent); font-weight: 700; letter-spacing: 0.08em; margin-bottom: 2px; } .wp-arw { display: flex; align-items: center; color: var(--accent); font-size:calc(18px * var(--ab-fs,1)); font-weight: 700; } .wp-dept { border: 1px solid var(--border, rgba(255,255,255,.08)); border-radius: calc(12px * var(--ab-radius,1)); margin: 16px 0; overflow: hidden; } .wp-dept-h { display: flex; align-items: center; gap: 12px; padding: 12px 16px; background: linear-gradient(100deg, color-mix(in srgb, var(--accent) 6%, transparent), color-mix(in srgb, var(--accent) 2%, transparent)); border-bottom: 1px solid var(--border, rgba(255,255,255,.06)); } .wp-num { width: 32px; height: 32px; flex-shrink: 0; border-radius: calc(8px * var(--ab-radius,1)); background: var(--accent); color: #fff; display: flex; align-items: center; justify-content: center; font-size:calc(16px * var(--ab-fs,1)); font-weight: 800; } .wp-tt { font-size:calc(16px * var(--ab-fs,1)); font-weight: 800; color: var(--text-primary, #e4e6f0); } .wp-rr { font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted, #8a8fa8); } .wp-cat { margin-left: auto; font-size:calc(11px * var(--ab-fs,1)); background: var(--bg-hover, rgba(255,255,255,.08)); color: var(--text-secondary, #b0b4c8); border-radius: 99px; padding: 3px 10px; white-space: nowrap; } .wp-dept-b { padding: 14px 16px 16px; } .wp-story { border: 1px solid var(--border, rgba(255,255,255,.08)); border-radius: calc(12px * var(--ab-radius,1)); margin: 14px 0; overflow: hidden; } .wp-story-h { background: var(--bg-hover, rgba(255,255,255,.06)); padding: 10px 16px; display: flex; align-items: center; gap: 8px; } .wp-story-h .t { font-weight: 700; font-size:calc(14px * var(--ab-fs,1)); color: var(--text-primary, #e4e6f0); } .wp-story-h .w { margin-left: auto; font-size:calc(11px * var(--ab-fs,1)); color: var(--accent); } .wp-story-b { padding: 12px 16px 14px; } .wp-chain { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; margin: 8px 0 4px; } .wp-step { font-size:calc(12px * var(--ab-fs,1)); background: var(--bg-hover, rgba(255,255,255,.04)); border: 1px solid var(--border, rgba(255,255,255,.08)); border-radius: calc(7px * var(--ab-radius,1)); padding: 5px 9px; } .wp-step b { color: var(--text-primary, #e4e6f0); } .wp-step.mk { background: color-mix(in srgb, var(--accent) 8%, transparent); border-color: color-mix(in srgb, var(--accent) 20%, transparent); color: var(--accent); } .wp-step.boss { background: var(--bg-hover, rgba(255,255,255,.06)); border-color: var(--text-primary, #e4e6f0); color: var(--text-primary, #e4e6f0); font-weight: 700; } .wp-ar { color: var(--text-muted, #8a8fa8); font-weight: 700; } .wp-story-f { margin-top: 10px; font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted, #8a8fa8); border-top: 1px dashed var(--border, rgba(255,255,255,.06)); padding-top: 8px; } .wp-story-f b { color: var(--accent); } .wp-rules { list-style: none; margin: 12px 0; } .wp-rules li { display: flex; gap: 10px; padding: 10px 14px; border: 1px solid var(--border, rgba(255,255,255,.08)); border-radius: calc(9px * var(--ab-radius,1)); margin: 6px 0; font-size:calc(13px * var(--ab-fs,1)); } .wp-rules .ic { flex: 0 0 22px; height: 22px; border-radius: calc(6px * var(--ab-radius,1)); display: flex; align-items: center; justify-content: center; font-weight: 800; font-size:calc(12px * var(--ab-fs,1)); } .wp-rules .no .ic { background: rgba(239,68,68,.12); color: #ef4444; } .wp-bwords { display: flex; flex-wrap: wrap; gap: 5px; margin: 8px 0; } .wp-bwords span { font-size:calc(12px * var(--ab-fs,1)); background: rgba(239,68,68,.08); color: #ef4444; border: 1px solid rgba(239,68,68,.15); border-radius: calc(6px * var(--ab-radius,1)); padding: 2px 9px; text-decoration: line-through; } /* ── 白皮书封面页 ── */ .ab-wp-cover { display: flex; align-items: center; justify-content: center; min-height: 60vh; text-align: center; } .ab-wp-cover-inner { display: flex; flex-direction: column; align-items: center; width: 100%; } .ab-wp-cover-logo { display: flex; flex-direction: column; align-items: center; padding-top: 20px; } .ab-wp-cover-logo img.ic { height: 92px; width: auto; max-width: 100%; } .ab-wp-cover-rule { width: 56px; height: 3px; background: linear-gradient(90deg, #024518, #1f8a45); border-radius: calc(2px * var(--ab-radius,1)); margin: 12px 0 10px; } .ab-wp-cover-logo img.wm { width: 240px; height: auto; max-width: 100%; } .ab-wp-cover-mid { margin: 24px 0; } .ab-wp-cover-ck { font-size:calc(10px * var(--ab-fs,1)); letter-spacing: 0.4em; color: var(--accent); font-weight: 700; } .ab-wp-cover-mid h1 { font-size:calc(32px * var(--ab-fs,1)); font-weight: 800; color: var(--text-primary, #e4e6f0); margin: 10px 0 0; line-height: 1.4; } .ab-wp-cover-mid h2 { font-size:calc(16px * var(--ab-fs,1)); font-weight: 400; color: var(--accent); margin: 8px 0 0; letter-spacing: 0.06em; } .ab-wp-cover-theme { display: inline-block; margin-top: 20px; background: linear-gradient(100deg, var(--accent-hover), var(--accent)); color: #fff; padding: 10px 28px; border-radius: 99px; font-size:calc(14px * var(--ab-fs,1)); font-weight: 700; letter-spacing: 0.03em; } .ab-wp-cover-bot { margin-top: 28px; width: 100%; } .ab-wp-cover-info { display: flex; justify-content: center; gap: 40px; border-top: 1px solid var(--border, rgba(255,255,255,.08)); padding-top: 14px; } .ab-wp-cover-info > div { text-align: center; } .ab-wp-cover-info .lb { font-size:calc(10px * var(--ab-fs,1)); color: var(--text-muted, #8a8fa8); letter-spacing: 0.1em; } .ab-wp-cover-info .vl { font-size:calc(13px * var(--ab-fs,1)); color: var(--text-primary, #e4e6f0); font-weight: 600; margin-top: 3px; } .ab-wp-cover-foot { margin-top: 16px; display: flex; justify-content: center; gap: 20px; font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted, #8a8fa8); } /* ── 白皮书目录页 ── */ .ab-wp-toc { padding: 10px 0; } .ab-wp-toc-h { display: flex; align-items: baseline; gap: 12px; border-bottom: 2px solid var(--text-primary, #e4e6f0); padding-bottom: 10px; margin-bottom: 16px; } .ab-wp-toc-en { font-size:calc(10px * var(--ab-fs,1)); letter-spacing: 0.4em; color: var(--accent); font-weight: 700; } .ab-wp-toc-cn { font-size:calc(24px * var(--ab-fs,1)); font-weight: 800; color: var(--text-primary, #e4e6f0); } .ab-wp-toc-list { display: flex; flex-direction: column; gap: 2px; } .ab-wp-toc-item { display: flex; align-items: baseline; gap: 8px; padding: 6px 0; cursor: pointer; font-size:calc(15px * var(--ab-fs,1)); font-weight: 700; color: var(--text-primary, #e4e6f0); transition: color .12s; } .ab-wp-toc-item:hover { color: var(--accent); } .ab-wp-toc-no { font-weight: 800; color: var(--accent); width: 24px; flex: 0 0 24px; } .ab-wp-toc-sub { padding: 2px 0 2px 32px; cursor: pointer; font-size:calc(13px * var(--ab-fs,1)); color: var(--text-secondary, #b0b4c8); transition: color .12s; } .ab-wp-toc-sub:hover { color: var(--accent); } .ab-w2-subtitle { font-size:calc(30px * var(--ab-fs,1)); font-weight: 700; color: var(--text-primary); text-align: center; margin: 8px 0 20px; line-height: 1; letter-spacing: 1px; white-space: nowrap; } /* 深色模式：套用首页 hero「智能云控平台」彩色扫光字效（青→紫流光扫过） */ :root:not(.ab-light) .ab-w2-title { background: linear-gradient(135deg, #ffffff, var(--accent), var(--accent-hover), var(--accent)); background-size: 300% 300%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: abGradientShift 4s ease infinite; } @keyframes abGradientShift { 0%, 100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } } /* 五模式 = 分段选择器（统一连贯背景 + 滑动高亮块） */ .ab-w2-modes { position: relative; display: flex; gap: 0; background: var(--bg-secondary); border: 1px solid var(--border); border-radius: 999px; padding: 4px; } /* 滑动高亮块（随点击滑到激活模式） */ .ab-w2-glider { position: absolute; top: 4px; bottom: 4px; left: 0; width: 0; border-radius: 999px; background: #3a3f4b; transition: left 0.28s cubic-bezier(0.4, 0, 0.2, 1), width 0.28s cubic-bezier(0.4, 0, 0.2, 1); z-index: 0; pointer-events: none; } :root.ab-light .ab-w2-glider { background: #2f3542; } .ab-w2-mode { position: relative; z-index: 1; display: inline-flex; align-items: center; justify-content: center; gap: 6px; border: none; background: transparent; color: var(--text-secondary); border-radius: 999px; padding: 8px 17px; font-size:calc(13.5px * var(--ab-fs,1)); cursor: pointer; transition: color 0.2s; white-space: nowrap; } .ab-w2-mode .ab-ic { width: 15px; height: 15px; } .ab-w2-mode:hover { color: var(--text-primary); } .ab-w2-mode.ab-w2-mode-on { color: #fff; font-weight: 600; background: transparent; } /* 「热门」促销徽标（C.257）：尺寸紧凑 + 跟随主题 accent（各档自动取同色相略深，白字对比度 ≥3.4:1）+ 低频呼吸闪烁，纯装饰不抢点击 */ .ab-hot-badge { position: absolute; top: -6px; right: -2px; z-index: 2; padding: 1px 4px; border-radius: 6px; font-size: calc(9px * var(--ab-fs, 1)); line-height: 1.3; font-weight: 700; letter-spacing: 0.2px; color: #fff; background: var(--accent); background: color-mix(in srgb, var(--accent) 82%, #000); border: 1px solid color-mix(in srgb, var(--accent) 40%, #fff); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2); pointer-events: none; user-select: none; animation: abHotBreath 2.6s ease-in-out infinite; will-change: opacity; } @keyframes abHotBreath { 0%, 100% { opacity: 0.45; } 50% { opacity: 1; } } @media (prefers-reduced-motion: reduce) { .ab-hot-badge { animation: none; opacity: 0.92; } } /* ========== 输入区（悬浮居中 → 落底） ========== */ .ab-inputzone { display: flex; flex-direction: column; flex-shrink: 0; width: 100%; } .ab-inputzone-center { flex: 1; display: flex; flex-direction: column; justify-content: flex-start; padding: 0 16px 2.2vh; } .ab-inputzone-center .ab-inputbar { max-width: 830px; width: 100%; margin: 0 auto; border: none; background: transparent; } .ab-inputzone-center .ab-inputbox { box-shadow: 0 8px 30px rgba(0,0,0,0.10); } .ab-inputzone-center .ab-hotbar { max-width: 830px; margin: 0 auto; width: 100%; } .ab-inputzone-bottom .ab-inputbar { border-top: 1px solid var(--border); } .ab-inputzone-bottom .ab-hotbar { border-top: 1px solid var(--border); } /* 热门子系统条（输入框上方单行横排） */ .ab-hotbar { display: flex; align-items: center; gap: 4px; padding: 8px 16px 6px; background: var(--bg-secondary); } /* ============ 智能多媒体参数条（内置于输入框底部单独一行，豆包式无边框） ============ */ .ab-mediabar { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; padding: 4px 10px 2px; margin-top: 2px; } .ab-mediabar.hidden { display: none; } .ab-media-tabs { display: flex; gap: 6px; margin-bottom: 8px; } .ab-media-tab { display: inline-flex; align-items: center; gap: 5px; border: 1px solid var(--border); border-radius: calc(14px * var(--ab-radius,1)); background: transparent; color: var(--text-muted); padding: 4px 12px; font-size:calc(12px * var(--ab-fs,1)); cursor: pointer; } .ab-media-tab .ab-ic { width: 14px; height: 14px; } .ab-media-tab.on { border-color: var(--accent); color: var(--accent); background: var(--accent-light); font-weight: 600; } .ab-media-opts { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; } /* 豆包式参数 chip：默认无边框无底色，鼠标经过才浮出浅底+微阴影 */ .ab-media-chip { display: inline-flex; align-items: center; gap: 5px; border: none !important; /* 无边框，强制不被 .ab-chip 等覆盖 */ border-radius: calc(8px * var(--ab-radius,1)); background: transparent !important; /* 默认透明 */ color: var(--text-primary); padding: 4px 8px; font-size:calc(12px * var(--ab-fs,1)); cursor: pointer; white-space: nowrap; box-shadow: none !important; /* 默认无阴影 */ transition: background .14s, box-shadow .14s; } .ab-media-chip:hover { background: rgba(0,0,0,.05) !important; /* 悬停才浮浅底 */ box-shadow: 0 1px 4px rgba(0,0,0,.10) !important; color: var(--accent); } [data-theme="dark"] .ab-media-chip:hover { background: rgba(255,255,255,.07) !important; box-shadow: 0 1px 5px rgba(0,0,0,.4) !important; } .ab-media-chip .ab-ic { width: 13px; height: 13px; color: var(--text-muted); } .ab-media-chip:hover .ab-ic { color: var(--accent); } .ab-media-chip .ab-ic:last-child { transform: rotate(90deg); width: 11px; height: 11px; } /* 时长滑杆上拉窗（滑杆收纳在弹层里，不占输入框空间） */ .ab-media-durpop { padding: 6px 4px; min-width: 220px; } .ab-media-durpop-title { font-size:calc(12px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary); padding: 4px 8px 8px; display: flex; align-items: center; gap: 6px; } .ab-media-durpop-title .ab-ic { width: 14px; height: 14px; color: var(--accent); } .ab-media-durpop-body { display: flex; align-items: center; gap: 10px; padding: 0 8px; } .ab-media-durpop-body .ab-media-slider { flex: 1; width: auto; } .ab-media-durpop-val { font-size:calc(13px * var(--ab-fs,1)); font-weight: 600; color: var(--accent); min-width: 34px; text-align: right; } .ab-media-durpop-range { display: flex; justify-content: space-between; font-size:calc(10px * var(--ab-fs,1)); color: var(--text-muted); padding: 4px 8px 4px; } /* 模型菜单分组标题（媒体模型的组头） */ /* GW.187i【2026-10-26 老板令·第 2 项】模型组标题由灰改黑、字号对齐「日常办公」组标题 （老板原话「现在是灰色的标题，要换成黑色，方便客户区分模型组啊」）。 */ .ab-model-group-title { font-size:calc(12.5px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary); padding: 7px 10px 4px; } /* ===== 智能多媒体 · 参数条精修（豆包式无边框+常显参数名） ===== */ /* 类型标签：选中态绿色高亮胶囊，一眼看出当前生成模式 */ .ab-media-typetag-on { background: color-mix(in srgb, var(--accent) 20%, transparent) !important; color: var(--accent) !important; font-weight: 600; border: 1px solid color-mix(in srgb, var(--accent) 45%, transparent); box-shadow: 0 0 0 1.5px color-mix(in srgb, var(--accent) 8%, transparent); border-radius: 999px; padding: 4px 11px !important; } .ab-media-typetag-on .ab-ic { color: var(--accent) !important; } [data-theme="dark"] .ab-media-typetag-on { color: var(--accent) !important; background: color-mix(in srgb, var(--accent) 22%, transparent) !important; border-color: color-mix(in srgb, var(--accent) 40%, transparent); } /* 参数 chip：参数名(600 主色) + 参数值(regular)，对标豆包"模型 Seedream 4.5 ∨"排版 */ .ab-media-chip-label { color: var(--text-primary); font-weight: 600; } .ab-media-chip-val { color: var(--text-secondary); font-weight: 400; } .ab-media-chip:hover .ab-media-chip-val { color: var(--accent); } .ab-mediabar { gap: 12px !important; } /* 尺寸/音色弹窗标题（对标豆包"比例"组头） */ .ab-media-ratio-title { font-size:calc(12px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary); padding: 4px 6px 8px; } /* 音色网格 */ .ab-media-voice-grid { display: flex; flex-wrap: wrap; gap: 6px; } .ab-media-voice-grid .ab-media-ratio-cell { min-width: 56px; height: 52px; } /* 时长滑杆分组（比例网格下方，对标豆包视频弹窗） */ .ab-media-durwrap { padding: 10px 6px 4px; border-top: 1px solid var(--border); margin-top: 8px; min-width: 260px; } .ab-media-durwrap-title { font-size:calc(12px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary); padding-bottom: 10px; display: flex; justify-content: space-between; } .ab-media-durwrap-val { color: var(--accent); font-weight: 600; } .ab-media-durwrap .ab-media-slider { width: 100%; } .ab-media-durwrap-range { display: flex; justify-content: space-between; font-size:calc(10px * var(--ab-fs,1)); color: var(--text-muted); padding-top: 4px; } /* 尺寸上拉窗：横排紧缩缩略图网格，横版横图/竖版竖图 */ .ab-media-ratio-grid { padding: 8px; min-width: 240px; } .ab-media-ratio-grid-in { display: flex; flex-wrap: wrap; gap: 6px; } .ab-media-ratio-cell { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; width: 52px; height: 56px; border-radius: calc(8px * var(--ab-radius,1)); cursor: pointer; border: 1px solid transparent; color: var(--text-muted); transition: all .13s; } .ab-media-ratio-cell:hover { background: var(--bg-primary); color: var(--accent); box-shadow: 0 1px 4px rgba(0,0,0,.10); } .ab-media-ratio-cell.on { border-color: var(--accent); color: var(--accent); background: color-mix(in srgb, var(--accent) 10%, transparent); } .ab-media-ratio-txt { font-size:calc(11px * var(--ab-fs,1)); font-weight: 600; } .ab-media-ratio-auto { display: inline-flex; color: var(--accent); } .ab-media-ratio-auto .ab-ic { width: 16px; height: 16px; } /* 模版参考：大网格弹窗，成列展示可选模版 */ .ab-media-tpl-pop { padding: 10px; min-width: 320px; max-width: 420px; } .ab-media-tpl-head { font-size:calc(12px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary); padding: 2px 4px 10px; } .ab-media-tpl-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; } .ab-media-tpl-cell { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 12px 6px; border-radius: calc(10px * var(--ab-radius,1)); cursor: pointer; border: 1px solid var(--border); background: var(--bg-primary); transition: all .13s; } .ab-media-tpl-cell:hover { border-color: var(--accent); transform: translateY(-1px); box-shadow: 0 3px 10px rgba(0,0,0,.10); } .ab-media-tpl-cell.on { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 10%, transparent); } .ab-media-tpl-thumb { width: 100%; height: 44px; border-radius: calc(6px * var(--ab-radius,1)); display: flex; align-items: center; justify-content: center; background: color-mix(in srgb, var(--accent) 8%, transparent); color: var(--accent); } .ab-media-tpl-thumb .ab-ic { width: 20px; height: 20px; } /* ===== C.121 智能多媒体参数图标图片化（风格／音色／模版参考 · 32px webp）===== */ .ab-media-opt-ico { width: 16px; height: 16px; object-fit: contain; display: block; flex-shrink: 0; } .ab-media-chip .ab-media-opt-ico { width: 13px; height: 13px; } .ab-model-logo .ab-media-opt-ico { width: 18px; height: 18px; } .ab-media-ratio-auto .ab-media-opt-ico { width: 16px; height: 16px; } .ab-media-tpl-thumb .ab-media-opt-ico { width: 24px; height: 24px; } /* GPT 官方 logo：跟随主题黑/白，不吃 accent 绿 */ .ab-gpt-logo { color: var(--text-primary) !important; } /* C.121b 模版参考：AI 生成圆角缩略图（64px 源 / 显示 32px，热条 14px） */ .ab-media-opt-ico.ab-media-tpl-img { width: 32px; height: 32px; border-radius: calc(7px * var(--ab-radius,1)); object-fit: cover; } .ab-media-tpl-thumb .ab-media-opt-ico.ab-media-tpl-img { width: 32px; height: 32px; } .ab-hot-chip .ab-media-opt-ico.ab-media-tpl-img { width: 14px; height: 14px; border-radius: calc(4px * var(--ab-radius,1)); } .ab-media-tpl-name { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-primary); font-weight: 500; text-align: center; } .ab-media-mul { color: var(--accent); font-weight: 600; font-size:calc(11px * var(--ab-fs,1)); } .ab-media-cost { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); margin-left: auto; padding-right: 4px; } .ab-media-desc { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); margin-left: 6px; font-weight: normal; display: block; margin-top: 1px; } .ab-media-menu { max-height: 360px; overflow-y: auto; } .ab-media-menu.ab-media-ratio-grid, .ab-media-menu.ab-media-tpl-pop { min-width: 300px; max-width: 440px; max-height: 420px; } .ab-hotbar.hidden { display: none; } /* ========== 智能多媒体 · 输入框底部参数条（新 UI） ========== */ .ab-media-typetag { display: inline-flex; align-items: center; gap: 5px; font-size:calc(12px * var(--ab-fs,1)); font-weight: 500; color: var(--text-secondary); /* 默认无高亮，与其他快捷标签一致 */ padding: 4px 6px 4px 0; flex-shrink: 0; border-radius: 999px; transition: background .15s, color .15s; } .ab-media-typetag .ab-ic { width: 13px; height: 13px; color: currentColor; } .ab-media-typetag:hover { color: var(--text-primary); background: var(--bg-hover); } /* C.361：类型标签改成可点按钮（点上拉窗切换 对话/图像/视频/音频） */ .ab-media-typebtn { cursor: pointer; user-select: none; } .ab-media-typebtn .ab-ic:last-child { width: 11px; height: 11px; opacity: .5; } .ab-media-typebtn:hover .ab-ic:last-child { opacity: .9; } /* 比例缩略块：CSS 画的小矩形，一眼看出横竖比例 */ .ab-ratio-thumb { display: inline-block; flex-shrink: 0; border: 1.5px solid currentColor; border-radius: calc(2px * var(--ab-radius,1)); background: color-mix(in srgb, var(--accent) 15%, transparent); vertical-align: middle; } .ab-media-chip.on .ab-ratio-thumb, .ab-media-menu-item.on .ab-ratio-thumb { background: color-mix(in srgb, var(--accent) 35%, transparent); } /* 时长滑杆 */ .ab-media-slider { -webkit-appearance: none; appearance: none; width: 88px; height: 4px; border-radius: 999px; background: rgba(120,130,150,.28); outline: none; cursor: pointer; margin: 0 2px; } .ab-media-slider::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 12px; height: 12px; border-radius: 50%; background: linear-gradient(135deg, var(--accent), var(--accent-hover)); border: 2px solid #fff; box-shadow: 0 1px 3px rgba(0,0,0,.25); cursor: grab; } .ab-media-slider::-moz-range-thumb { width: 12px; height: 12px; border-radius: 50%; background: linear-gradient(135deg, var(--accent), var(--accent-hover)); border: 2px solid #fff; box-shadow: 0 1px 3px rgba(0,0,0,.25); cursor: grab; } [data-theme="dark"] .ab-media-slider::-webkit-slider-thumb { border-color: #1a1d21; } [data-theme="dark"] .ab-media-slider::-moz-range-thumb { border-color: #1a1d21; } .ab-media-dur-val { font-size:calc(11px * var(--ab-fs,1)); color: var(--accent); font-weight: 600; min-width: 30px; text-align: center; } /* 参数弹层：滚动区与条目强化 */ .ab-media-menuscroll { max-height: 300px; overflow-y: auto; } .ab-media-menu-item { display: flex; align-items: center; gap: 8px; padding: 7px 10px; border-radius: calc(8px * var(--ab-radius,1)); cursor: pointer; } .ab-media-menu-item:hover { background: var(--bg-hover); } /* 选中态：实心绿底白字（点击才出现，默认无） */ .ab-media-menu-item.on { background: var(--accent); color: #fff; font-weight: 600; } .ab-media-menu-item .ab-ic { width: 16px; height: 16px; flex-shrink: 0; color: var(--text-muted); } .ab-media-menu-item.on .ab-ic { color: #fff; } .ab-media-menu-item .ab-media-desc { flex: 1; } .ab-media-group-title { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); padding: 6px 10px 3px; font-weight: 600; } /* 积分消耗：绿色小字，藏在运行状态行里 */ /* C.72【老板 2026-10-18】原规则会把整行统计（含「本轮消耗 N 积分」）转成主色 + 加粗，太显眼。 改为跟随主体灰色，与非计费时完全一致；类名保留（app.js 仍在 toggle），仅不再改配色与字重。 */ .ab-run-hasmedia { color: var(--text-muted) !important; font-weight: normal !important; } [data-theme="dark"] .ab-run-hasmedia { color: var(--text-muted) !important; font-weight: normal !important; } .ab-inputzone-center .ab-hotbar { background: transparent; padding-bottom: 10px; } .ab-hotbar-track { flex: 1; display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; min-width: 0; } .ab-hotbar-track::-webkit-scrollbar { display: none; } .ab-hot-chip { display: inline-flex; align-items: center; gap: 6px; flex-shrink: 0; border: 1px solid var(--border); background: var(--bg-primary); color: var(--text-secondary); border-radius: calc(16px * var(--ab-radius,1)); padding: 6px 13px; font-size:calc(13px * var(--ab-fs,1)); cursor: pointer; transition: all 0.15s; white-space: nowrap; } .ab-hot-chip:hover { border-color: var(--text-muted); color: var(--text-primary); } /* 选中态：深色实底白字——点过的一级/子类型标签高亮，客户一眼看到自己选了啥 */ .ab-hot-chip.ab-hot-on { background: linear-gradient(135deg, var(--accent), var(--accent-hover)); border-color: var(--accent); color: #fff; font-weight: 600; box-shadow: 0 2px 6px color-mix(in srgb, var(--accent) 35%, transparent); } .ab-hot-chip.ab-hot-on .ab-ic { color: #fff; } .ab-hot-chip.ab-hot-on:hover { background: linear-gradient(135deg, var(--accent), var(--accent-hover)); color: #fff; } /* 二级标签选中态：深绿实底白字 */ .ab-hot-chip.ab-hot-sel { background: var(--accent-hover); border-color: var(--accent-hover); color: #fff; font-weight: 600; } .ab-hot-chip.ab-hot-sel .ab-ic { color: #fff; } .ab-hot-chip.ab-hot-sel:hover { background: var(--accent-hover); color: #fff; } /* 一级标签的二级指示小箭头（斜向下） */ .ab-hot-caret { width: 12px; height: 12px; transform: rotate(90deg); opacity: 0.6; margin-left: 2px; } /* 二级标签：斜向小胶囊（略小 + 斜切视觉） */ .ab-hot-lv2 { font-size:calc(12px * var(--ab-fs,1)); padding: 5px 12px; border-radius: calc(14px * var(--ab-radius,1)) calc(14px * var(--ab-radius,1)) calc(14px * var(--ab-radius,1)) calc(4px * var(--ab-radius,1)); /* 左下斜切角 → 斜向下的视觉 */ background: var(--accent-light); border-color: var(--accent); color: var(--accent); } .ab-hot-lv2:hover { background: linear-gradient(135deg, var(--accent), var(--accent-hover)); color: #fff; border-color: var(--accent); } /* 返回一级按钮 */ .ab-hot-back { border-style: dashed; color: var(--text-muted); } .ab-hotbar-arrow { flex-shrink: 0; border: none; background: none; color: var(--text-muted); cursor: pointer; padding: 4px; display: flex; align-items: center; border-radius: calc(6px * var(--ab-radius,1)); transition: all 0.15s; } .ab-hotbar-arrow:hover { color: var(--text-primary); background: var(--bg-primary); } .ab-hotbar-arrow.hidden { display: none; } /* 输入框 */ .ab-inputbar { position: relative; padding: 10px 16px 12px; background: var(--bg-secondary); flex-shrink: 0; } .ab-inputbox { border: 1px solid var(--border); background: var(--bg-primary); border-radius: calc(16px * var(--ab-radius,1)); padding: 12px 14px 10px; transition: border-color 0.15s; } .ab-inputbox:focus-within { border-color: var(--text-muted); } .ab-input { width: 100%; min-height: 88px; max-height: 200px; /* [C.258] 让浏览器自己按内容算高度（Chromium 123+）。支持时 app.js 完全不碰 height， 省掉「置 auto → 读 scrollHeight → 回写 height」每次按键的一次强制同步布局； 不支持的老内核会忽略这行，退回 JS 自适应，行为不变。 */ field-sizing: content; resize: none; border: none; background: transparent; color: var(--text-primary); font-size:calc(15px * var(--ab-fs,1)); line-height: 1.6; font-family: inherit; outline: none; } .ab-input::placeholder { color: var(--text-muted); } .ab-input-foot { display: flex; align-items: center; gap: 8px; margin-top: 10px; } .ab-chip { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--border); background: var(--bg-secondary); color: var(--text-secondary); border-radius: calc(9px * var(--ab-radius,1)); padding: 5px 11px; font-size:calc(12px * var(--ab-fs,1)); cursor: pointer; max-width: 220px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .ab-chip:hover { border-color: var(--text-muted); color: var(--text-primary); } .ab-chip-plus { padding: 5px 8px; } /* v176 计划模式开关 */ .ab-chip-planmode .ab-planmode-state { font-size:calc(10px * var(--ab-fs,1)); padding: 1px 6px; border-radius: calc(7px * var(--ab-radius,1)); border: 1px solid var(--border); background: transparent; color: var(--text-secondary); margin-left: 2px; } /* 开状态：绿色虚线边框 + 绿色文字（线性风格，不喧宾夺主） */ .ab-chip-planmode.ab-planmode-on { border: 1px dashed var(--accent); color: var(--accent); background: transparent; font-weight: 500; } .ab-chip-planmode.ab-planmode-on .ab-planmode-state { border: 1px dashed var(--accent); background: transparent; color: var(--accent); } /* 快捷通道功能胶囊（选中的专家/技能/插件，放 chip 行，accent 高亮） */ .ab-chip-pack { border: 1px dashed var(--accent); background: transparent; color: var(--accent); font-weight: 500; max-width: 240px; } .ab-chip-pack.hidden { display: none; } .ab-chip-pack:hover { background: var(--accent-light); color: var(--accent); } .ab-chip-pack .ab-chippack-kind { background: var(--accent-light); color: var(--accent); } .ab-chip-pack .ab-chippack-x { color: var(--accent); } .ab-chip-pack .ab-chippack-x:hover { background: var(--accent-light); } .ab-chippack-ic { display: inline-flex; align-items: center; flex-shrink: 0; } .ab-chippack-ic .ab-ic { width: 15px; height: 15px; } .ab-chippack-ava { width: 18px; height: 18px; border-radius: 50%; object-fit: cover; flex-shrink: 0; } .ab-chippack-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 130px; } .ab-chippack-kind { font-size:calc(10px * var(--ab-fs,1)); padding: 0 4px; border-radius: calc(4px * var(--ab-radius,1)); background: linear-gradient(135deg, var(--accent), var(--accent-hover)); color: #fff; opacity: .85; flex-shrink: 0; } .ab-chippack-x { flex-shrink: 0; border: none; background: none; color: var(--accent); cursor: pointer; padding: 0; border-radius: 50%; display: flex; align-items: center; opacity: .7; } .ab-chippack-x:hover { opacity: 1; background: rgba(0,0,0,.1); } .ab-chippack-x .ab-ic { width: 13px; height: 13px; } /* 空态占位：「专家·技能·工具·插件」入口，灰态（与 .ab-chip 同款），已连接态才转绿 */ .ab-chip-pack.ab-chip-pack-empty { border: 1px solid var(--border); background: var(--bg-secondary); color: var(--text-secondary); font-weight: 500; padding: 5px 13px; } .ab-chip-pack.ab-chip-pack-empty:hover { border-color: var(--text-muted); color: var(--text-primary); } .ab-chip-pack.ab-chip-pack-empty .ab-ic { width: 15px; height: 15px; color: var(--text-muted); } .ab-chippack-empty-txt { white-space: nowrap; font-weight: 500; } /* 快捷通道空态上拉菜单 */ .ab-pack-entry-menu { min-width: 200px; } .ab-pack-entry-menu .ab-sess-menu-item { align-items: baseline; } .ab-pack-entry-label { font-weight: 500; color: var(--text-primary); flex-shrink: 0; } .ab-pack-entry-desc { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); margin-left: auto; padding-left: 10px; } .ab-flex-spacer { flex: 1; } /* 发送按钮：商务黑色圆钮，向上箭头 */ .ab-send { width: 36px; height: 36px; display: inline-flex; align-items: center; justify-content: center; border: none; background: #1c1f27; color: #fff; border-radius: 50%; cursor: pointer; transition: all 0.15s; flex-shrink: 0; } /* 深色下发送钮套翠绿→深绿渐变，hover 增亮 */ :root:not(.ab-light) .ab-send { background: linear-gradient(135deg,var(--accent-hover),var(--accent)); } :root:not(.ab-light) .ab-send:hover { background: linear-gradient(135deg,var(--accent),var(--accent-hover)); transform: scale(1.06); } :root:not(.ab-light) .ab-send.ab-send-stop { background: linear-gradient(135deg,var(--accent-hover),var(--accent)); } :root:not(.ab-light) .ab-send.ab-send-stop:hover { background: linear-gradient(135deg,var(--accent),var(--accent-hover)); } .ab-send:hover { background: #000; transform: scale(1.06); } .ab-send:disabled { background: var(--bg-hover); color: var(--text-muted); cursor: not-allowed; transform: none; } /* 发送钮停止态（忙时）：仍是黑圆钮，中心白色四方块 */ .ab-send.ab-send-stop { background: #1c1f27; } .ab-send.ab-send-stop:hover { background: #000; } .ab-send.ab-send-stop .ab-ic { width: 14px; height: 14px; } /* ============ C.314 · 插话式并发（任务进行中补充/纠正，不打断）============ */ /* 输入框上方那行说明：只在任务进行中出现，任务一结束 JS 立刻摘掉节点（不占常驻空间） */ .ab-ij-hint { display: flex; align-items: center; gap: 6px; font-size: calc(12px * var(--ab-fs,1)); line-height: 18px; color: var(--text-muted); padding: 0 12px 6px; opacity: .92; user-select: none; } /* 已被服务端确认并入当前轮的客户补充：小标签告诉客户「这句真的进去了」，不是白打 */ .ab-msg-interjected { position: relative; } .ab-ij-tag { display: inline-flex; align-items: center; gap: 4px; margin-top: 6px; padding: 1px 8px; font-size: calc(11px * var(--ab-fs,1)); line-height: 16px; border-radius: 999px; color: var(--text-muted); background: color-mix(in srgb, var(--accent) 8%, transparent); border: 1px solid color-mix(in srgb, var(--accent) 22%, transparent); white-space: nowrap; } .ab-ij-tag::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: var(--accent); flex-shrink: 0; } /* 运行统计条（DSH 风格，居中） */ .ab-run-stats { padding: 2px 20px 2px; /* [C.97] 原 6/8px → 2/2px，省 10px 高；字号不变，保证可读 */ font-size:calc(11.5px * var(--ab-fs,1)); color: var(--text-muted); font-family: Consolas, 'Courier New', monospace; background: var(--bg-secondary); white-space: nowrap; overflow-x: auto; scrollbar-width: none; text-align: center; } .ab-run-stats::-webkit-scrollbar { display: none; } .ab-run-stats.hidden { display: none; } .ab-usage-ring { flex-shrink: 0; } /* 用量环独立容器（不包在模型按钮里） */ .ab-usage-ring-wrap { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; flex-shrink: 0; margin-right: 4px; } /* 模型图标（内联 SVG） */ .ab-model-icon { width: 18px; height: 18px; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; margin-right: 4px; } .ab-model-icon svg { width: 16px; height: 16px; } /* 模型菜单：定位由 JS 按模型按钮 fixed 精确定位（bottom 贴按钮顶、left 贴按钮左），此处只放尺寸 */ .ab-inputbar .ab-model-menu { min-width: 280px; max-width: 320px; max-height: 320px; overflow-y: auto; } /* ========== 自动化 / 任务列表 ========== */ /* ===== 专家•技能•工具•插件 ===== */ /* ===== 专家·技能·工具·插件 = WorkBuddy 技能市场风格 ===== */ /* 一级分段 tab（小胶囊滑块风格） */ .ab-mkt-topbar { display: flex; align-items: center; gap: 12px; padding-right: 20px; margin-bottom: 0; flex-shrink: 0; flex-wrap: wrap; } .ab-mkt-segment { position: relative; display: inline-flex; gap: 0; padding: 3px; margin: 0 0 12px 20px; background: var(--bg-secondary); border: 1px solid var(--border); border-radius: 999px; flex-shrink: 0; align-self: flex-start; } .ab-mkt-search-wrap { position: relative; display: flex; align-items: center; flex: 1; min-width: 220px; max-width: 420px; margin-bottom: 12px; } .ab-mkt-search-ico { position: absolute; left: 12px; width: 14px; height: 14px; color: var(--text-muted); pointer-events: none; } .ab-mkt-search { width: 100%; padding: 7px 12px 7px 34px; font-size:calc(13px * var(--ab-fs,1)); color: var(--text-primary); background: var(--bg-secondary); border: 1px solid var(--border); border-radius: 999px; outline: none; transition: border-color .2s, box-shadow .2s; } .ab-mkt-search::placeholder { color: var(--text-muted); } .ab-mkt-search:focus { border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 12%, transparent); } /* 专家板块右上角星号说明 */ .ab-mkt-expert-note { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); margin-left: auto; margin-bottom: 12px; white-space: nowrap; } .ab-mkt-seg-glider { position: absolute; top: 3px; bottom: 3px; left: 0; width: 0; border-radius: 999px; background: var(--text-primary); transition: left 0.28s cubic-bezier(0.4,0,0.2,1), width 0.28s cubic-bezier(0.4,0,0.2,1); z-index: 0; pointer-events: none; } .ab-mkt-seg { position: relative; z-index: 1; padding: 5px 18px; font-size:calc(13px * var(--ab-fs,1)); font-weight: 500; color: var(--text-muted); cursor: pointer; border: none; background: transparent; border-radius: 999px; transition: color .2s; text-align: center; white-space: nowrap; } .ab-mkt-seg:hover { color: var(--text-primary); } /* 选中态：需高于 .ab-mkt-seg:hover(0,2,0)，否则点选后鼠标悬停会把白字变深色、与滑块同色看不清 */ .ab-mkt-seg.ab-mkt-seg-on, .ab-mkt-seg.ab-mkt-seg-on:hover { color: var(--bg-primary); font-weight: 600; } /* 二级分类筛选 chips（线性风格，无填充背景） */ .ab-mkt-cats { display: flex; gap: 8px; padding: 0 20px 12px; flex-wrap: wrap; flex-shrink: 0; } .ab-mkt-cat { padding: 4px 12px; font-size:calc(12px * var(--ab-fs,1)); font-weight: 500; color: var(--text-muted); cursor: pointer; border: 1px solid var(--border); background: transparent; border-radius: 999px; transition: color .15s, border-color .15s, background .15s; white-space: nowrap; } .ab-mkt-cat-count { display: inline-block; margin-left: 4px; padding: 0 5px; font-size:calc(10px * var(--ab-fs,1)); font-weight: 400; line-height: 1.4; color: var(--text-muted); background: rgba(0,0,0,.04); border-radius: calc(8px * var(--ab-radius,1)); min-width: 18px; text-align: center; } .ab-mkt-cat-on .ab-mkt-cat-count { color: var(--accent); background: color-mix(in srgb, var(--accent) 12%, transparent); font-weight: 500; } .ab-mkt-cat:hover { color: var(--text-primary); border-color: var(--text-muted); } .ab-mkt-cat-on { color: var(--accent); border-color: var(--accent); background: color-mix(in srgb, var(--accent) 6%, transparent); font-weight: 600; } /* 卡片网格 */ .ab-mkt-grid { flex: 1; overflow-y: auto; padding: 4px 20px 20px; display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; align-content: start; scrollbar-gutter: stable; } /* 卡片（参考超级员工广场设计） */ .ab-mkt-card { display: flex; flex-direction: column; padding: 16px; border: 1px solid var(--border); border-radius: calc(16px * var(--ab-radius,1)); background: var(--bg-secondary); transition: border-color .15s, box-shadow .15s; cursor: pointer; position: relative; } .ab-mkt-card:hover { border-color: var(--accent); box-shadow: 0 4px 16px rgba(0,0,0,.1); } .ab-mkt-card-top { display: flex; align-items: flex-start; gap: 12px; flex: 1; position: relative; } /* 大师名称缩小放右上角 */ .ab-mkt-card-corner-name { position: absolute; top: 0; right: 0; font-size:calc(11px * var(--ab-fs,1)); font-weight: 500; color: var(--text-muted); background: var(--bg-primary); padding: 2px 8px; border-radius: calc(4px * var(--ab-radius,1)); border: 1px solid var(--border); } .ab-mkt-card-icon { width: 48px; height: 48px; border-radius: calc(12px * var(--ab-radius,1)); background: transparent; border: 1px solid var(--border); color: var(--text-muted); display: flex; align-items: center; justify-content: center; flex-shrink: 0; } .ab-mkt-card-icon .ab-ic { width: 24px; height: 24px; } /* [C.117] 工具・插件卡片图标：图片自带圆角底板，去掉外框避免双边 */ .ab-mkt-card-icon:has(.ab-ic-plugin) { background: transparent; border: 0; overflow: hidden; } .ab-mkt-card-icon .ab-ic-plugin { border-radius: calc(12px * var(--ab-radius,1)); } /* [C.119] 技能卡片图标：同上，97 个家族图（assets/card-icons-skill/） */ .ab-mkt-card-icon:has(.ab-ic-skill) { background: transparent; border: 0; overflow: hidden; } .ab-mkt-card-icon .ab-ic-skill { border-radius: calc(12px * var(--ab-radius,1)); } .ab-mkt-card-avatar { width: 48px; height: 48px; border-radius: calc(12px * var(--ab-radius,1)); object-fit: cover; flex-shrink: 0; } .ab-mkt-card-info { flex: 1; min-width: 0; } .ab-mkt-card-name { font-size:calc(14.5px * var(--ab-fs,1)); font-weight: 650; color: var(--text-primary); margin-bottom: 6px; line-height: 1.3; } .ab-mkt-card-desc { font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .ab-mkt-card-foot { display: flex; align-items: center; justify-content: space-between; margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--border); } .ab-mkt-card-stats { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); } /* 卡片右下角操作按钮 */ .ab-mkt-card-btn { padding: 4px 12px; font-size:calc(11px * var(--ab-fs,1)); font-weight: 500; background: linear-gradient(135deg, var(--accent), var(--accent-hover)); color: #fff; border: none; border-radius: calc(6px * var(--ab-radius,1)); cursor: pointer; transition: opacity .14s; opacity: 0; } .ab-mkt-card:hover .ab-mkt-card-btn { opacity: 1; } .ab-mkt-card-btn:hover { filter: brightness(1.1); opacity: .85 !important; } /* 自训练入口卡片（统一绿虚线功能卡，同 .ab-func-add） */ .ab-mkt-card--add { border: 1.5px dashed var(--accent); background: transparent; align-items: center; justify-content: center; flex-direction: column; text-align: center; gap: 8px; min-height: 100px; } .ab-mkt-card--add .ab-mkt-card-icon { background: var(--accent-light); color: var(--accent); border: 1px solid color-mix(in srgb, var(--accent) 25%, transparent); } .ab-mkt-card--add .ab-mkt-card-name { font-weight: 700; color: var(--accent); } .ab-mkt-card--add .ab-mkt-card-desc { color: var(--text-muted); } .ab-mkt-card--add:hover { border-color: var(--accent); background: var(--accent-light); box-shadow: 0 4px 14px color-mix(in srgb, var(--accent) 12%, transparent); } .ab-mkt-card--add:hover .ab-mkt-card-icon { color: var(--accent); border-color: var(--accent); background: var(--accent-light); } /* 自训练专家卡片右上角删除按钮 */ .ab-mkt-card-del { position: absolute; top: 8px; right: 8px; z-index: 3; width: 24px; height: 24px; border-radius: calc(6px * var(--ab-radius,1)); border: none; background: var(--bg-primary); color: var(--text-muted); cursor: pointer; display: flex; align-items: center; justify-content: center; opacity: 0; transition: all .15s; box-shadow: 0 1px 4px rgba(0,0,0,.15); } .ab-mkt-card:hover .ab-mkt-card-del { opacity: 1; } .ab-mkt-card-del:hover { background: #ef4444; color: #fff; } .ab-mkt-card-del .ab-ic { width: 13px; height: 13px; } /* 空态 */ .ab-mkt-empty { grid-column: 1 / -1; display: flex; align-items: center; justify-content: center; padding: 60px 20px; color: var(--text-muted); font-size:calc(14px * var(--ab-fs,1)); } /* ===== 实用性优先卡片（2026-09-07 R42）：标题=职能，人名缩右上角，四要素 ===== */ .ab-mkt-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; margin-bottom: 10px; position: relative; } .ab-mkt-card-title { font-size:calc(15px * var(--ab-fs,1)); font-weight: 700; color: var(--text-primary); line-height: 1.25; flex: 1; min-width: 0; padding-right: 4px; } .ab-mkt-card-head .ab-mkt-card-corner-name { position: static; flex-shrink: 0; font-size:calc(11px * var(--ab-fs,1)); font-weight: 500; color: var(--text-muted); background: var(--bg-primary); padding: 2px 8px; border-radius: calc(4px * var(--ab-radius,1)); border: 1px solid var(--border); max-width: 45%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } /* C.119 技能/插件卡片：中文主名下方显示原名（灰小字） */ .ab-mkt-card-sub { font-size:calc(11px * var(--ab-fs,1)); font-weight: 500; color: var(--text-muted); line-height: 1.3; margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } /* C.119 分批加载提示条 */ .ab-mkt-more { grid-column: 1 / -1; display: flex; align-items: center; justify-content: center; padding: 18px 12px; margin-top: 4px; border-radius: calc(10px * var(--ab-radius,1)); border: 1px dashed var(--border); color: var(--text-muted); font-size:calc(12px * var(--ab-fs,1)); letter-spacing: .3px; } .ab-mkt-card-body { display: flex; align-items: flex-start; gap: 12px; flex: 1; } .ab-mkt-card-body .ab-mkt-card-avatar, .ab-mkt-card-ava { width: 52px; height: 52px; border-radius: calc(12px * var(--ab-radius,1)); flex-shrink: 0; } .ab-mkt-card-body .ab-mkt-card-avatar { object-fit: cover; border: 1px solid var(--border); } .ab-mkt-card-ava { display: flex; align-items: center; justify-content: center; } .ab-mkt-card-ava .ab-mkt-card-icon { width: 52px; height: 52px; } .ab-mkt-card-rows { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 5px; } .ab-mkt-card-row { display: flex; align-items: baseline; gap: 6px; font-size:calc(12px * var(--ab-fs,1)); line-height: 1.45; } .ab-mkt-card-row-label { flex-shrink: 0; color: var(--accent); font-weight: 600; font-size:calc(11px * var(--ab-fs,1)); white-space: nowrap; } .ab-mkt-card-row-val { color: var(--text-secondary); min-width: 0; word-break: break-word; overflow-wrap: break-word; } /* 大师卡 DiceBear 头像统一底色区分 */ .ab-mkt-card--master .ab-mkt-card-avatar { background: rgba(139,92,246,.08); } .ab-mkt-card--se .ab-mkt-card-avatar { background: color-mix(in srgb, var(--accent) 6%, transparent); } /* 专家区右上角星号注释 */ .ab-mkt-disclaimer-note { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); line-height: 1.4; text-align: right; max-width: 320px; } .ab-auto-list { flex: 1; overflow-y: auto; padding: 14px 18px; } .ab-auto-note { font-size:calc(12px * var(--ab-fs,1)); color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, transparent); border: 1px solid color-mix(in srgb, var(--accent) 30%, transparent); border-radius: calc(10px * var(--ab-radius,1)); padding: 10px 14px; margin-bottom: 12px; line-height: 1.6; } .ab-auto-cat { font-size:calc(12px * var(--ab-fs,1)); font-weight: 700; color: var(--accent); margin: 16px 2px 8px; letter-spacing: 0.5px; } .ab-auto-cat:first-of-type { margin-top: 4px; } .ab-auto-tpl-ico { width: 34px; height: 34px; border-radius: calc(9px * var(--ab-radius,1)); background: transparent; border: 1px solid var(--border); color: var(--text-muted); display: flex; align-items: center; justify-content: center; flex-shrink: 0; } .ab-auto-tpl-ico .ab-ic { width: 18px; height: 18px; } /* [C.114b] 自动化・工作流 卡片图标图片化：图片撑满 34px 圆角槽，槽本身去掉描边（图自带圆角底板） */ .ab-auto-tpl-ico:has(.ab-ic-img), .ab-auto-icoslot:has(.ab-ic-img) { background: transparent; border: 0; overflow: hidden; } .ab-auto-tpl-ico .ab-ic-img, .ab-auto-icoslot .ab-ic-img { border-radius: calc(9px * var(--ab-radius,1)); } .ab-auto-icoslot { width: 34px; height: 34px; flex: 0 0 auto; display: flex; align-items: center; justify-content: center; border: 1px solid var(--border); border-radius: calc(9px * var(--ab-radius,1)); color: var(--text-muted); background: transparent; } .ab-auto-icoslot .ab-ic { width: 18px; height: 18px; } .ab-wf-card-top:has(.ab-auto-icoslot) { align-items: center; gap: 8px; } .ab-auto-tpl { transition: border-color .15s, transform .15s; } .ab-auto-tpl:hover { border-color: var(--accent); transform: translateX(3px); } .ab-wf-tpl { transition: border-color .15s, transform .15s; } .ab-wf-tpl:hover { border-color: var(--accent); transform: translateX(3px); } .ab-wf-case { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); margin-top: 5px; line-height: 1.5; background: color-mix(in srgb, var(--accent) 5%, transparent); border-left: 2px solid color-mix(in srgb, var(--accent) 35%, transparent); padding: 5px 9px; border-radius: 0 calc(6px * var(--ab-radius,1)) calc(6px * var(--ab-radius,1)) 0; } .ab-auto-item { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid var(--border); border-radius: calc(12px * var(--ab-radius,1)); margin-bottom: 10px; background: var(--bg-secondary); cursor: pointer; transition: border-color 0.15s; } .ab-auto-item:hover { border-color: var(--accent); } .ab-auto-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; } .ab-auto-dot.ok { background: var(--success); } .ab-auto-dot.wait { background: var(--warn); } .ab-auto-body { flex: 1; min-width: 0; } .ab-auto-name { font-size:calc(13px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary); } .ab-auto-desc { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); margin-top: 2px; } .ab-auto-desc code { font-family: Consolas, monospace; } /* ========== 工作流编排 ========== */ .ab-wf-actions { display: flex; gap: 6px; flex-shrink: 0; } .ab-wf-actions .ab-set-btn { font-size:calc(11px * var(--ab-fs,1)); padding: 4px 10px; border-radius: calc(8px * var(--ab-radius,1)); border: 1px solid var(--border); background: var(--bg-secondary); color: var(--text-primary); cursor: pointer; transition: all 0.15s; } .ab-wf-actions .ab-set-btn:hover { border-color: var(--accent); color: var(--accent); } .ab-wf-actions .ab-set-btn.danger { color: var(--danger, #ef4444); } .ab-wf-actions .ab-set-btn.danger:hover { border-color: var(--danger, #ef4444); } /* ========== 工作流可视化编辑器 ========== */ .ab-wf-list-mode { flex: 1; display: flex; flex-direction: column; min-height: 0; } .ab-wf-list-mode.hidden { display: none; } .ab-wf-editor-mode { flex: 1; display: flex; flex-direction: column; min-height: 0; } .ab-wf-editor-mode.hidden { display: none; } .ab-wf-toolbar { display: flex; align-items: center; gap: 6px; flex-shrink: 0; padding: 6px 12px; border-bottom: 0.5px solid var(--border); background: var(--bg-secondary); } .ab-wf-toolbar .ab-wf-back { display: flex; align-items: center; gap: 4px; flex-shrink: 0; } .ab-wf-toolbar-label { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); flex-shrink: 0; } .ab-wf-name-input { font-size:calc(12px * var(--ab-fs,1)); padding: 4px 8px; border-radius: calc(6px * var(--ab-radius,1)); border: 0.5px solid var(--border); background: var(--bg-primary); color: var(--text-primary); width: 140px; flex-shrink: 0; } .ab-wf-name-input:focus { border-color: var(--accent); outline: none; } .ab-wf-editor-title { font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); flex-shrink: 0; } .ab-wf-zoom-info { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); min-width: 36px; text-align: center; flex-shrink: 0; } .ab-wf-toolbar .ab-wf-zoom-out, .ab-wf-toolbar .ab-wf-zoom-in, .ab-wf-toolbar .ab-wf-zoom-reset { font-size:calc(12px * var(--ab-fs,1)); padding: 3px 8px; flex-shrink: 0; } .ab-wf-toolbar .ab-wf-save { color: var(--accent); border-color: var(--accent); } .ab-wf-toolbar .ab-wf-run { color: var(--accent); border-color: var(--accent); } .ab-wf-body { flex: 1; display: flex; min-height: 0; overflow: hidden; } /* 左侧节点面板 */ .ab-wf-palette { width: 135px; flex-shrink: 0; padding: 8px 6px; display: flex; flex-direction: column; gap: 6px; border-right: 0.5px solid var(--border); background: var(--bg-secondary); overflow-y: auto; } .ab-wf-pal-title { font-size:calc(11px * var(--ab-fs,1)); font-weight: 500; color: var(--text-muted); margin-bottom: 2px; } .ab-wf-pal-item { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 6px 4px; border-radius: calc(8px * var(--ab-radius,1)); cursor: grab; transition: background 0.15s; } .ab-wf-pal-item:hover { background: var(--bg-primary); } .ab-wf-pal-item:active { cursor: grabbing; } .ab-wf-pal-node { width: 100%; text-align: center; font-size:calc(12px * var(--ab-fs,1)); font-weight: 500; padding: 7px 0; border-radius: calc(8px * var(--ab-radius,1)); border: 1px solid var(--border); background: var(--bg-primary); color: var(--text-primary); user-select: none; } .ab-wf-pal-hint { font-size:calc(10px * var(--ab-fs,1)); color: var(--text-muted); } /* 节点类型颜色 */ .ab-wf-n-start { border-color: #5DCAA5; color: #0F6E56; background: #E1F5EE; } .ab-wf-n-llm { border-color: #85B7EB; color: #0C447C; background: #E6F1FB; } .ab-wf-n-tool { border-color: #AFA9EC; color: #3C3489; background: #EEEDFE; } .ab-wf-n-condition { border-color: #FAC775; color: #854F0B; background: #FAEEDA; } .ab-wf-n-end { border-color: #F0997B; color: #993C1D; background: #FAECE7; } /* 中间画布 */ .ab-wf-canvas-wrap { flex: 1; min-width: 0; position: relative; overflow: hidden; background: var(--bg-tertiary, var(--bg-primary)); } .ab-wf-canvas { width: 100%; height: 100%; display: block; cursor: default; } .ab-wf-canvas.dragging { cursor: grabbing; } .ab-wf-canvas.linking { cursor: crosshair; } .ab-wf-canvas.panning { cursor: grab; } .ab-wf-canvas.panning:active { cursor: grabbing; } .ab-wf-grid-bg { pointer-events: all; } /* SVG 节点样式 */ .ab-wf-svg-node { cursor: grab; } .ab-wf-svg-node:hover .ab-wf-node-body { stroke-width: 2; } .ab-wf-svg-node.selected .ab-wf-node-body { stroke-width: 2.5; stroke-dasharray: 4 2; } .ab-wf-svg-node.dragging { cursor: grabbing; opacity: 0.85; } /* SVG 锚点（连线起点）—加大+hover高亮 */ .ab-wf-anchor { cursor: crosshair !important; transition: r 0.15s; } .ab-wf-anchor:hover { r: 8 !important; } /* SVG 连线样式 */ .ab-wf-svg-edge { fill: none; stroke: var(--text-muted); stroke-width: 1.5; } .ab-wf-svg-edge:hover { stroke: var(--accent); stroke-width: 2; } .ab-wf-svg-edge.selected { stroke: var(--accent); stroke-width: 2.5; stroke-dasharray: 6 3; } .ab-wf-svg-edge-temp { fill: none; stroke: var(--accent); stroke-width: 2; stroke-dasharray: 5 3; pointer-events: none; } .ab-wf-edge-del { cursor: pointer; opacity: 0; transition: opacity 0.15s; } .ab-wf-svg-edge:hover .ab-wf-edge-del { opacity: 1; } /* 右侧属性面板（P5b 默认折叠成细条） */ .ab-wf-props { width: 230px; flex-shrink: 0; display: flex; flex-direction: row; border-left: 0.5px solid var(--border); background: var(--bg-secondary); transition: width 0.22s ease; overflow: hidden; } .ab-wf-props.collapsed { width: 30px; } .ab-wf-props-in { flex: 1; min-width: 0; padding: 10px 12px; display: flex; flex-direction: column; gap: 8px; overflow-y: auto; } .ab-wf-props.collapsed .ab-wf-props-in { display: none; } /* 折叠细条按钮（常显，折叠时竖排「属性」+箭头） */ .ab-wf-props-foldbtn { flex-shrink: 0; width: 30px; border: none; cursor: pointer; background: transparent; color: var(--text-muted); display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 10px 0; font-size:calc(12px * var(--ab-fs,1)); border-right: 0.5px solid var(--border); transition: background 0.15s, color 0.15s; } .ab-wf-props-foldbtn:hover { background: var(--bg-primary); color: var(--accent); } .ab-wf-props-fold-arr { font-size:calc(14px * var(--ab-fs,1)); line-height: 1; transition: transform 0.2s; } .ab-wf-props.collapsed .ab-wf-props-fold-arr { transform: rotate(180deg); } .ab-wf-props-fold-txt { writing-mode: vertical-rl; letter-spacing: 3px; font-size:calc(11px * var(--ab-fs,1)); } .ab-wf-props-title { font-size:calc(11px * var(--ab-fs,1)); font-weight: 500; color: var(--text-muted); } .ab-wf-props-empty { font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); padding: 12px 4px; border-radius: calc(8px * var(--ab-radius,1)); background: var(--bg-primary); border: 0.5px solid var(--border); line-height: 1.8; } .ab-wf-step { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-secondary); padding: 3px 0; line-height: 1.6; } .ab-wf-step b { color: var(--text-primary); } .ab-wf-props-form { display: flex; flex-direction: column; gap: 10px; } .ab-wf-props-form.hidden { display: none; } .ab-wf-prop-row { display: flex; flex-direction: column; gap: 3px; } .ab-wf-prop-label { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); } .ab-wf-prop-tip { font-size:calc(10px * var(--ab-fs,1)); color: var(--text-muted); font-style: italic; } .ab-wf-prop-input, .ab-wf-prop-select, .ab-wf-prop-textarea { font-size:calc(12px * var(--ab-fs,1)); padding: 5px 8px; border-radius: calc(6px * var(--ab-radius,1)); border: 0.5px solid var(--border); background: var(--bg-primary); color: var(--text-primary); font-family: inherit; } .ab-wf-prop-textarea { min-height: 50px; resize: vertical; font-size:calc(11px * var(--ab-fs,1)); } .ab-wf-prop-input:focus, .ab-wf-prop-select:focus, .ab-wf-prop-textarea:focus { border-color: var(--accent); outline: none; } .ab-wf-prop-select { cursor: pointer; } .ab-wf-prop-del { font-size:calc(11px * var(--ab-fs,1)); padding: 5px 0; border-radius: calc(6px * var(--ab-radius,1)); border: 0.5px solid var(--danger, #ef4444); background: transparent; color: var(--danger, #ef4444); cursor: pointer; margin-top: 4px; } .ab-wf-prop-del:hover { background: rgba(239,68,68,0.08); } /* P5b：复制/删除按钮并排容器 */ .ab-wf-prop-acts { display: flex; gap: 8px; margin-top: 4px; } .ab-wf-prop-acts .ab-wf-prop-dup, .ab-wf-prop-acts .ab-wf-prop-del { flex: 1; margin-top: 0; } .ab-wf-prop-dup { font-size:calc(11px * var(--ab-fs,1)); padding: 5px 0; border-radius: calc(6px * var(--ab-radius,1)); border: 0.5px solid var(--accent); background: transparent; color: var(--accent); cursor: pointer; } .ab-wf-prop-dup:hover { background: color-mix(in srgb, var(--accent) 8%, transparent); } /* ========== MCP 工具市场 ========== */ .ab-mcp-tools { margin-top: 6px; display: flex; flex-direction: column; gap: 4px; } .ab-mcp-tool { display: flex; gap: 8px; align-items: baseline; padding: 3px 0; font-size:calc(11px * var(--ab-fs,1)); } .ab-mcp-tool-name { color: var(--accent); font-weight: 600; font-family: Consolas, monospace; flex-shrink: 0; } .ab-mcp-tool-desc { color: var(--text-muted); line-height: 1.4; } /* MCP 市场页签（2026-09-29）：工具宝库视图内嵌面板 */ .ab-mkt-grid.hidden { display: none; } .ab-mkt-cats.hidden { display: none; } .ab-mkt-search-wrap.hidden { display: none; } .ab-mcp-panel { flex: 1; display: flex; flex-direction: column; min-height: 0; } .ab-mcp-panel.hidden { display: none; } .ab-mcp-head { padding: 8px 20px 2px; font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); } /* MCP 市场卡片（2026-09-29 卡片化：分类 chips + 网格卡片） */ .ab-mcp-card { border: 1px solid var(--border); border-radius: calc(12px * var(--ab-radius,1)); padding: 14px; background: var(--bg-primary); display: flex; flex-direction: column; gap: 8px; } .ab-mcp-card:hover { border-color: var(--accent); } .ab-mcp-card-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; } .ab-mcp-card-name { font-size:calc(13px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary); } .ab-mcp-card-sub { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); } /* [C.118] MCP 市场卡片图标：图片自带圆角底板，40px 展示，名称占满剩余宽并允许换行 */ .ab-mcp-card-ico { width: 40px; height: 40px; flex: 0 0 auto; border-radius: calc(10px * var(--ab-radius,1)); overflow: hidden; display: inline-flex; align-items: center; justify-content: center; background: var(--bg-secondary); color: var(--text-muted); } .ab-mcp-card-ico .ab-ic-img { width: 100%; height: 100%; object-fit: contain; display: block; } .ab-mcp-card-ico .ab-ic { width: 22px; height: 22px; } .ab-mcp-card-top { justify-content: flex-start; } .ab-mcp-card-name { flex: 1 1 auto; min-width: 0; line-height: 1.35; } .ab-mcp-card-top .ab-sub-badge { flex: 0 0 auto; } .ab-mcp-try { align-self: flex-start; margin-top: 2px; } /* v342：对话细腻功能（积分预警 / 文件变更 / 外部模型提示 / 对话内搜索 / 清空上下文） */ .ab-confirm-credit { display: flex; align-items: center; gap: 6px; margin: 6px 0 2px; font-size:calc(12px * var(--ab-fs,1)); color: var(--warn); line-height: 1.5; } .ab-confirm-file { display: flex; align-items: center; gap: 6px; margin: 4px 0 2px; font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); } .ab-extmodel-warn { display: flex; align-items: center; gap: 6px; padding: 5px 12px; font-size:calc(12px * var(--ab-fs,1)); color: var(--warn); } .ab-chat-search { display: flex; align-items: center; gap: 6px; padding: 6px 10px; background: var(--bg-secondary); border-bottom: 1px solid var(--border); } .ab-cs-input { flex: 1; min-width: 120px; padding: 5px 10px; font-size:calc(13px * var(--ab-fs,1)); color: var(--text-primary); background: var(--bg-primary); border: 1px solid var(--border); border-radius: calc(8px * var(--ab-radius,1)); outline: none; } .ab-cs-input:focus { border-color: var(--accent); } .ab-cs-count { font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); white-space: nowrap; } .ab-cs-btn { width: 24px; height: 24px; border: none; background: transparent; color: var(--text-muted); cursor: pointer; border-radius: calc(6px * var(--ab-radius,1)); font-size:calc(13px * var(--ab-fs,1)); } .ab-cs-btn:hover { background: var(--bg-primary); color: var(--text-primary); } .ab-bubble-text.ab-search-hit { box-shadow: inset 0 -2px 0 rgba(245,158,11,.55); } .ab-bubble-text.ab-search-cur { box-shadow: inset 0 -2px 0 var(--accent); background: rgba(245,158,11,.10); } .ab-mcp-try.ab-assist-pbtn { font-size:calc(11px * var(--ab-fs,1)); padding: 4px 10px; border-radius: calc(8px * var(--ab-radius,1)); border: 1px solid var(--border); background: transparent; color: var(--text-muted); font-weight: 400; cursor: pointer; transition: all 0.15s; flex-shrink: 0; } .ab-mcp-try.ab-assist-pbtn:hover { border-color: var(--accent); color: var(--accent); background: transparent; } /* ========== 右侧产物面板 ========== */ .ab-artpanel { width: 640px; max-width: 52vw; /* 窄屏不挤爆聊天区 */ flex-shrink: 0; display: flex; flex-direction: column; background: var(--bg-secondary); border-left: 1px solid var(--border); } .ab-artpanel.hidden { display: none; } /* 最大化：固定定位铺满整个窗口（position:fixed 相对视口，不受父容器 .ab-root 影响） */ .ab-artpanel.ab-art-max { position: fixed; inset: 0; width: 100vw; max-width: 100vw; height: 100vh; z-index: 2000; border-left: none; box-shadow: 0 0 80px rgba(0,0,0,.35); } .ab-art-head-btns { display: flex; gap: 4px; align-items: center; padding: 0 8px; align-self: stretch; } .ab-art-head { display: flex; align-items: center; justify-content: space-between; padding: 6px 12px; border-bottom: 1px solid var(--border); font-size:calc(13px * var(--ab-fs,1)); font-weight: 600; } .ab-art-list { flex: 1; overflow-y: auto; padding: 12px; } .ab-art-item { border: 1px solid var(--border); border-radius: calc(10px * var(--ab-radius,1)); background: var(--bg-primary); padding: 10px 12px; margin-bottom: 10px; } .ab-art-title { font-size:calc(13px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary); margin-bottom: 4px; } .ab-art-meta { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); margin-bottom: 6px; } .ab-art-preview { font-size:calc(12px * var(--ab-fs,1)); color: var(--text-secondary); line-height: 1.5; max-height: 60px; overflow: hidden; } .ab-art-acts { display: flex; gap: 6px; margin-top: 8px; } /* ============ v129 右侧产物面板（WorkBuddy 编辑器式：多标签同开预览） ============ */ /* 顶部编辑器标签栏：与聊天区顶栏高度对齐 */ .ab-art-editorbar { display: flex; align-items: stretch; flex-shrink: 0; background: var(--bg-secondary); border-bottom: 1px solid var(--border); height: 57px; box-sizing: border-box; } .ab-art-editorbar .ab-art-collapse, .ab-art-editorbar .ab-art-tabs { align-self: stretch; } .ab-art-tabs { flex: 1; min-width: 0; display: flex; align-items: stretch; overflow-x: auto; overflow-y: hidden; scrollbar-width: thin; } .ab-art-tabs::-webkit-scrollbar { height: 3px; } /* 单个标签（含 文件列表 / 各文件） */ .ab-art-tab { display: flex; align-items: center; gap: 6px; padding: 0 10px; font-size:calc(12.5px * var(--ab-fs,1)); color: var(--text-secondary); cursor: pointer; border: none; background: none; border-right: 1px solid var(--border); white-space: nowrap; flex-shrink: 0; max-width: 180px; position: relative; user-select: none; } .ab-art-tab:hover { background: rgba(0,0,0,0.04); color: var(--text-primary); } .ab-art-tab.on { background: var(--bg-primary); color: var(--accent-hover); box-shadow: inset 0 2px 0 var(--accent-hover); } .ab-art-tab .ab-art-tab-ic { width: 15px; height: 15px; display: flex; align-items: center; color: #6b7280; flex-shrink: 0; } .ab-art-tab .ab-art-tab-ic .ab-ic { width: 14px; height: 14px; } .ab-art-tab.on .ab-art-tab-ic { color: var(--accent-hover); } .ab-art-tab .ab-art-tab-name { overflow: hidden; text-overflow: ellipsis; font-family: Consolas, Monaco, monospace; } .ab-art-tab .ab-art-tab-x { width: 16px; height: 16px; display: flex; align-items: center; justify-content: center; border-radius: calc(4px * var(--ab-radius,1)); color: var(--text-muted); flex-shrink: 0; opacity: 0; transition: opacity .12s; } .ab-art-tab:hover .ab-art-tab-x, .ab-art-tab.on .ab-art-tab-x { opacity: 1; } .ab-art-tab .ab-art-tab-x:hover { background: rgba(0,0,0,0.12); color: var(--text-primary); } .ab-art-tab .ab-art-tab-x .ab-ic { width: 11px; height: 11px; } /* 「+」新建标签 */ .ab-art-tab-add { display: flex; align-items: center; justify-content: center; width: 34px; flex-shrink: 0; border: none; background: none; color: var(--text-muted); cursor: pointer; border-right: 1px solid var(--border); } .ab-art-tab-add:hover { background: rgba(0,0,0,0.05); color: var(--accent-hover); } .ab-art-tab-add .ab-ic { width: 15px; height: 15px; } /* 主体（左栏文件列表常驻 + 右栏内容区） */ .ab-art-body { flex: 1; min-height: 0; overflow: hidden; display: flex; } /* 左栏文件列表（常驻，可折叠） */ .ab-art-side { width: 200px; flex-shrink: 0; border-right: 1px solid var(--border); display: flex; flex-direction: column; background: var(--bg-secondary); overflow: hidden; transition: width .18s ease, opacity .15s; } .ab-art-side-h { padding: 8px 12px; font-size:calc(11px * var(--ab-fs,1)); font-weight: 600; color: var(--text-muted); letter-spacing: .4px; border-bottom: 1px solid var(--border); flex-shrink: 0; } .ab-art-side-list { flex: 1; overflow-y: auto; padding: 4px 6px; } .ab-art-side-list .ab-art-file .fname { font-size:calc(12px * var(--ab-fs,1)); } .ab-art-side-list .ab-art-file .fext { display: none; } .ab-art-side-none { padding: 20px 10px; font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); text-align: center; } /* 折叠态：左栏缩到 0 */ .ab-artpanel.ab-art-side-collapsed .ab-art-side { width: 0; border-right: none; opacity: 0; } /* 右栏内容区 */ .ab-art-main { flex: 1; min-width: 0; display: flex; flex-direction: column; overflow: hidden; background: var(--bg-primary); } /* 左栏高亮当前打开的文件 */ .ab-art-file.on { background: color-mix(in srgb, var(--accent) 12%, transparent); } .ab-art-file.on .fname { color: var(--accent-hover); font-weight: 600; } /* 折叠按钮（撑满 editorbar 高度，图标垂直居中对齐聊天顶栏） */ .ab-art-editorbar .ab-art-collapse { width: 34px; height: 100%; flex-shrink: 0; border-right: 1px solid var(--border); color: var(--text-muted); border-radius: 0; display: flex; align-items: center; justify-content: center; } .ab-art-collapse:hover { color: var(--text-primary); background: var(--bg-hover); } /* 空白预览器（右栏空态） */ .ab-art-blank-main { flex: 1; min-height: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; background: var(--bg-primary); } .ab-art-blank-logo { color: var(--text-muted); opacity: .28; } .ab-art-blank-logo .ab-ic { width: 52px; height: 52px; } .ab-art-blank-tip { font-size:calc(13px * var(--ab-fs,1)); color: var(--text-secondary); font-weight: 500; } .ab-art-blank-hint { font-size:calc(11.5px * var(--ab-fs,1)); color: var(--text-muted); } /* 文件列表行：灰单色图标 + 短文件名 + 格式 */ .ab-art-file { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-radius: calc(6px * var(--ab-radius,1)); cursor: pointer; transition: background .12s; } .ab-art-file:hover { background: rgba(0,0,0,0.05); } .ab-art-file .fic16 { width: 16px; height: 16px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; color: #6b7280; } .ab-art-file .fic16 .ab-ic { width: 15px; height: 15px; } .ab-art-file .fname { flex: 1; min-width: 0; font-size:calc(13px * var(--ab-fs,1)); color: var(--text-primary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: Consolas, Monaco, monospace; } .ab-art-file .fopen { font-size:calc(10px * var(--ab-fs,1)); color: var(--accent-hover); border: 1px solid color-mix(in srgb, var(--accent) 40%, transparent); border-radius: calc(4px * var(--ab-radius,1)); padding: 0 5px; flex-shrink: 0; } .ab-art-file .fext { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); flex-shrink: 0; } /* 右键菜单 */ .ab-art-ctx { position: fixed; z-index: 10000; background: var(--bg-primary, #fff); border: 1px solid var(--border, rgba(0,0,0,0.12)); border-radius: calc(8px * var(--ab-radius,1)); box-shadow: 0 8px 28px rgba(0,0,0,0.18); padding: 4px; min-width: 160px; } .ab-art-ctx-item { padding: 8px 12px; font-size:calc(13px * var(--ab-fs,1)); color: var(--text-primary); border-radius: calc(6px * var(--ab-radius,1)); cursor: pointer; white-space: nowrap; } .ab-art-ctx-item:hover { background: color-mix(in srgb, var(--accent) 10%, transparent); color: var(--accent-hover); } /* 落盘位置弹层 */ .ab-artloc-mask { position: fixed; inset: 0; background: rgba(0,0,0,0.45); z-index: 10001; display: flex; align-items: center; justify-content: center; padding: 24px; } .ab-artloc-box { background: var(--bg-primary, #fff); border-radius: calc(14px * var(--ab-radius,1)); padding: 22px; max-width: 460px; width: 100%; box-shadow: 0 20px 60px rgba(0,0,0,0.3); } .ab-artloc-h { font-size:calc(15px * var(--ab-fs,1)); font-weight: 700; color: var(--text-primary); margin-bottom: 12px; } .ab-artloc-name { font-size:calc(13.5px * var(--ab-fs,1)); color: var(--text-primary); margin-bottom: 8px; font-weight: 600; } .ab-artloc-path { font-family: Consolas, Monaco, monospace; font-size:calc(12px * var(--ab-fs,1)); color: var(--text-secondary); background: rgba(0,0,0,0.05); border: 1px solid var(--border); border-radius: calc(8px * var(--ab-radius,1)); padding: 10px 12px; word-break: break-all; } .ab-artloc-acts { display: flex; gap: 8px; margin-top: 16px; justify-content: flex-end; } .ab-artloc-acts button { border: 1px solid var(--border); background: var(--bg-primary); color: var(--text-primary); border-radius: calc(8px * var(--ab-radius,1)); padding: 7px 16px; font-size:calc(13px * var(--ab-fs,1)); cursor: pointer; } .ab-artloc-copy { background: var(--accent-hover) !important; border-color: var(--accent-hover) !important; color: #fff !important; } /* 预览页头（标题 + 操作） */ .ab-art-pv-head { display: flex; align-items: center; gap: 9px; padding: 11px 13px; border-bottom: 1px solid var(--border); background: var(--bg-secondary); flex-shrink: 0; } .ab-art-pv-title { flex: 1; min-width: 0; font-size:calc(13px * var(--ab-fs,1)); font-weight: 700; color: var(--text-primary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .ab-art-pv-acts { display: flex; gap: 5px; flex-shrink: 0; } .ab-art-pv-acts .ab-icon-btn { width: 28px; height: 28px; } /* 预览体 */ .ab-art-pv-body { flex: 1; min-height: 0; overflow: auto; padding: 18px; background: var(--bg-primary); } .ab-art-pv-doc { font-size:calc(15px * var(--ab-fs,1)); line-height: 1.8; color: var(--text-primary); word-break: break-word; } .ab-art-pv-doc pre, .ab-art-pv-code { background: rgba(0,0,0,0.05); border: 1px solid var(--border); border-radius: calc(10px * var(--ab-radius,1)); padding: 14px 16px; font-family: Consolas, Monaco, monospace; font-size:calc(13px * var(--ab-fs,1)); line-height: 1.65; overflow: auto; white-space: pre; color: var(--text-primary); } .ab-art-pv-img { display: flex; align-items: center; justify-content: center; min-height: 200px; } .ab-art-pv-img img { max-width: 100%; max-height: 100%; border-radius: calc(10px * var(--ab-radius,1)); box-shadow: 0 6px 24px rgba(0,0,0,0.15); } .ab-art-pv-media { display: flex; align-items: center; justify-content: center; } .ab-art-pv-media video, .ab-art-pv-media audio { width: 100%; border-radius: calc(10px * var(--ab-radius,1)); } .ab-art-pv-frame { width: 100%; height: 100%; border: none; border-radius: calc(10px * var(--ab-radius,1)); background: #fff; } /* ===== C.209 ⑦ 可视化交互原型（沙箱内渲染 · 原型/源码切换） ===== */ .ab-proto-wrap { height: 100%; display: flex; flex-direction: column; min-height: 0; } .ab-proto-bar { flex: 0 0 auto; display: flex; align-items: center; gap: 8px; padding: 6px 10px; border-bottom: 1px solid var(--ab-line, #e6e9ef); background: var(--ab-bg2, #f8fafc); } .ab-proto-tab { border: 1px solid transparent; background: transparent; color: var(--ab-ink3, #6b7280); font-size: 12px; line-height: 1; padding: 5px 11px; border-radius: 6px; cursor: pointer; } .ab-proto-tab.on { background: #fff; border-color: var(--ab-line, #e6e9ef); color: var(--ab-ink, #111827); font-weight: 600; box-shadow: 0 1px 2px rgba(16, 24, 40, .06); } .ab-proto-note { margin-left: auto; font-size: 11px; color: var(--ab-ink3, #9aa1ad); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .ab-proto-box { flex: 1 1 auto; min-height: 0; position: relative; background: #fff; } .ab-proto-box > iframe, .ab-proto-frame { width: 100%; height: 100%; border: 0; display: block; background: #fff; } .ab-proto-src { margin: 0; height: 100%; overflow: auto; } /* v129 详情 meta 条（文件名 + 操作按钮组） */ .ab-art-pv-meta { display: flex; align-items: center; gap: 10px; padding: 8px 13px; border-bottom: 1px solid var(--border); background: var(--bg-secondary); flex-shrink: 0; } .ab-art-pv-meta .m-name { flex: 1; min-width: 0; font-size:calc(12.5px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .ab-art-pv-meta .m-acts { display: flex; gap: 4px; flex-shrink: 0; align-items: center; } .ab-art-pv-meta .m-acts .ab-icon-btn { width: 26px; height: 26px; color: var(--text-muted); } .ab-art-pv-meta .m-acts .ab-icon-btn:hover { color: var(--text-primary); background: var(--bg-hover); } /* v130 浏览器模式（WorkBuddy 式地址栏） */ .ab-art-browserbar { display: flex; align-items: center; gap: 4px; padding: 6px 10px; border-bottom: 1px solid var(--border); background: var(--bg-secondary); flex-shrink: 0; } .ab-art-browserbar .ab-icon-btn { width: 26px; height: 26px; color: var(--text-muted); } .ab-art-browserbar .ab-icon-btn:hover { color: var(--text-primary); background: var(--bg-hover); } .ab-art-bb-url { flex: 1; min-width: 0; margin: 0 4px; padding: 5px 12px; font-size:calc(12px * var(--ab-fs,1)); color: var(--text-secondary); background: var(--bg-tertiary, rgba(0,0,0,0.05)); border: 1px solid var(--border); border-radius: 999px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: Consolas, Monaco, monospace; } /* P2-② 版本切换器（地址栏右侧，线性风格） */ .ab-art-verbar { display: inline-flex; align-items: center; gap: 2px; flex: none; margin: 0 2px; } .ab-art-ver { padding: 2px 7px; font-size:calc(11px * var(--ab-fs,1)); font-family: Consolas, Monaco, monospace; color: var(--text-muted); background: transparent; border: 1px solid var(--border); border-radius: calc(6px * var(--ab-radius,1)); cursor: pointer; transition: all .12s; } .ab-art-ver:hover { border-color: var(--accent); color: var(--accent); } .ab-art-ver.on { border-color: var(--accent); color: var(--accent); font-weight: 600; background: transparent; } /* P6 版本对比按钮 + 对比弹层 */ .ab-art-cmp { padding: 2px 8px; font-size:calc(11px * var(--ab-fs,1)); font-family: inherit; font-weight: 600; color: var(--accent); background: transparent; border: 1px solid var(--accent); border-radius: calc(6px * var(--ab-radius,1)); cursor: pointer; transition: all .12s; white-space: nowrap; } .ab-art-cmp:hover { background: var(--accent); color: #fff; } .ab-art-diff-ov { position: fixed; inset: 0; z-index: 9999; background: rgba(0,0,0,.45); display: flex; align-items: center; justify-content: center; padding: 20px; } .ab-art-diff-box { width: min(860px, 96vw); max-height: 88vh; background: var(--card-bg, #fff); border: 1px solid var(--border); border-radius: calc(14px * var(--ab-radius,1)); display: flex; flex-direction: column; overflow: hidden; box-shadow: 0 12px 48px rgba(0,0,0,.28); } .ab-art-diff-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 16px; border-bottom: 1px solid var(--border); font-weight: 600; color: var(--text-primary); } .ab-art-diff-head .ab-ic { width: 16px; height: 16px; vertical-align: -2px; margin-right: 4px; color: var(--accent); } .ab-art-diff-body { overflow: auto; padding: 10px 0; } .ab-art-diff-stat { padding: 8px 18px; font-size:calc(13px * var(--ab-fs,1)); color: var(--text-secondary); border-bottom: 1px dashed var(--border); } .ab-art-diff-stat .d-add { color: var(--accent-hover); } .ab-art-diff-stat .d-del { color: #dc2626; } .ab-art-diff { font-family: Consolas, Monaco, monospace; font-size:calc(12.5px * var(--ab-fs,1)); line-height: 1.6; } .ab-art-diff-line { display: flex; white-space: pre-wrap; word-break: break-all; color: var(--text-secondary); } .ab-art-diff-line .ab-art-diff-sign { flex: none; width: 22px; text-align: center; color: var(--text-muted); user-select: none; } .ab-art-diff-line .ab-art-diff-txt { flex: 1 1 auto; padding: 0 10px 0 0; } .ab-art-diff-line.d-add { background: color-mix(in srgb, var(--accent) 10%, transparent); } .ab-art-diff-line.d-add .ab-art-diff-sign, .ab-art-diff-line.d-add .ab-art-diff-txt { color: var(--accent-hover); } .ab-art-diff-line.d-del { background: rgba(220,38,38,.08); text-decoration: none; } .ab-art-diff-line.d-del .ab-art-diff-sign, .ab-art-diff-line.d-del .ab-art-diff-txt { color: #dc2626; } .ab-art-diff-big { padding: 30px 20px; text-align: center; color: var(--text-muted); } .ab-art-bb-path { cursor: pointer; } .ab-art-bb-path:hover { color: var(--text-primary); border-color: var(--accent); } /* v135 文件详情 meta 卡（图标 + 文件名 + 属性表格） */ .ab-art-pv-infocard { display: flex; align-items: flex-start; gap: 14px; padding: 16px 18px; margin-bottom: 16px; background: var(--bg-secondary); border: 1px solid var(--border); border-radius: calc(12px * var(--ab-radius,1)); } .ab-art-pv-ico { width: 44px; height: 44px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; background: var(--bg-tertiary, rgba(0,0,0,0.05)); border-radius: calc(10px * var(--ab-radius,1)); color: var(--accent); } .ab-art-pv-ico .ab-ic { width: 24px; height: 24px; } /* ============ v138 产物文件彩色 SVG 图标（货对板：按文件类型给独立图标+配色） ============ md=绿M↓ / txt=横线文本 / doc=蓝文档 / html=青 / code=靛{} / image=紫山太阳 / video=橙▶ / audio=粉♪ / pdf=红PDF标签 SVG 自带 fill 色，CSS 只控尺寸 */ .ab-fic { width: 100%; height: 100%; display: block; } .fic16 .ab-fic { width: 17px; height: 17px; } .ab-art-tab-ic .ab-fic { width: 15px; height: 15px; } .ab-art-pv-ico .ab-fic { width: 26px; height: 26px; } /* 详情预览大图标配底色（按类型呼应） */ .ab-art-pv-ico[data-art-type="text"], .ab-art-pv-ico[data-art-type="doc"] { background: rgba(59,130,246,0.08); } .ab-art-pv-ico[data-art-type="markdown"] { background: color-mix(in srgb, var(--accent) 10%, transparent); } .ab-art-pv-ico[data-art-type="html"] { background: rgba(8,145,178,0.10); } .ab-art-pv-ico[data-art-type="code"] { background: rgba(99,102,241,0.10); } .ab-art-pv-ico[data-art-type="image"] { background: rgba(168,85,247,0.10); } .ab-art-pv-ico[data-art-type="video"] { background: rgba(234,88,12,0.10); } .ab-art-pv-ico[data-art-type="audio"] { background: rgba(236,72,153,0.10); } .ab-art-pv-ico[data-art-type="pdf"] { background: rgba(220,38,38,0.08); } .ab-art-pv-info { flex: 1; min-width: 0; } .ab-art-pv-fname { font-size:calc(17px * var(--ab-fs,1)); font-weight: 700; color: var(--text-primary); margin-bottom: 10px; word-break: break-all; font-family: Consolas, Monaco, monospace; } /* v135 文件属性表 */ .ab-art-pv-table { border-collapse: collapse; width: 100%; font-size:calc(13.5px * var(--ab-fs,1)); } .ab-art-pv-table th, .ab-art-pv-table td { border: 1px solid var(--border); padding: 7px 12px; text-align: left; vertical-align: top; } .ab-art-pv-table th { width: 92px; background: var(--bg-tertiary, rgba(0,0,0,0.04)); font-weight: 600; color: var(--text-secondary); white-space: nowrap; } .ab-art-pv-table td { color: var(--text-primary); word-break: break-all; } .ab-art-pv-cellurl { font-family: Consolas, Monaco, monospace; font-size:calc(12.5px * var(--ab-fs,1)); color: var(--accent); } /* Markdown 详情排版（一级/二级/三级标题分层清晰，级差拉大） */ .ab-art-pv-md { line-height: 1.9; font-size:calc(15px * var(--ab-fs,1)); color: var(--text-primary); } .ab-art-pv-md h1 { font-size:calc(30px * var(--ab-fs,1)); font-weight: 800; margin: 26px 0 14px; padding-bottom: 10px; border-bottom: 3px solid var(--accent); letter-spacing: 0.02em; color: var(--text-primary); } .ab-art-pv-md h2 { font-size:calc(23px * var(--ab-fs,1)); font-weight: 700; margin: 24px 0 12px; padding-left: 12px; border-left: 5px solid var(--accent); color: var(--text-primary); } .ab-art-pv-md h3 { font-size:calc(18px * var(--ab-fs,1)); font-weight: 700; margin: 18px 0 9px; color: var(--text-primary); } .ab-art-pv-md h4 { font-size:calc(16px * var(--ab-fs,1)); font-weight: 600; margin: 15px 0 7px; color: var(--text-secondary); text-transform: none; } .ab-art-pv-md p { margin: 11px 0; } /* 列表符号多样化（报告规范，不死板）：ul 按层级用不同线性符号，ol 细线框编号 */ .ab-art-pv-md ul, .ab-art-pv-md ol { margin: 12px 0; padding-left: 8px; list-style: none; } /* ul 一级：▪ 小方块（稳重） */ .ab-art-pv-md ul > li { position: relative; padding-left: 22px; margin: 6px 0; } .ab-art-pv-md ul > li::before { content: '▪'; position: absolute; left: 2px; top: 0; color: var(--accent); font-size:calc(13px * var(--ab-fs,1)); line-height: inherit; } /* ul 二级：・ 中点 */ .ab-art-pv-md ul > li ul > li::before { content: '・'; color: var(--text-secondary); font-size:calc(15px * var(--ab-fs,1)); } /* ul 三级：△ 空三角 */ .ab-art-pv-md ul > li ul > li ul > li::before { content: '△'; color: var(--text-muted); font-size:calc(11px * var(--ab-fs,1)); } /* ul 四级：◇ 空菱 */ .ab-art-pv-md ul > li ul > li ul > li ul > li::before { content: '◇'; color: var(--text-muted); font-size:calc(11px * var(--ab-fs,1)); } /* ol 细线框编号（仅强调顺序时用，同份产物≤2 组） */ .ab-art-pv-md ol { counter-reset: abli; } .ab-art-pv-md ol > li { position: relative; padding-left: 28px; margin: 6px 0; counter-increment: abli; } .ab-art-pv-md ol > li::before { content: counter(abli); position: absolute; left: 0; top: 2px; width: 17px; height: 17px; display: flex; align-items: center; justify-content: center; background: transparent; color: var(--accent); font-size:calc(11px * var(--ab-fs,1)); font-weight: 600; border: 1.5px solid var(--accent); border-radius: calc(5px * var(--ab-radius,1)); } .ab-art-pv-md li { margin: 4px 0; } .ab-art-pv-md code { background: var(--bg-tertiary, rgba(0,0,0,0.06)); padding: 2px 7px; border-radius: calc(5px * var(--ab-radius,1)); font-family: Consolas, Monaco, monospace; font-size:calc(13px * var(--ab-fs,1)); } .ab-art-pv-md pre { background: rgba(0,0,0,0.05); border: 1px solid var(--border); border-radius: calc(10px * var(--ab-radius,1)); padding: 14px 16px; margin: 12px 0; overflow: auto; } .ab-art-pv-md pre code { background: none; padding: 0; font-size:calc(13px * var(--ab-fs,1)); } .ab-art-pv-md blockquote { margin: 12px 0; padding: 10px 16px; border-left: 4px solid var(--accent); background: var(--bg-secondary); border-radius: 0 calc(8px * var(--ab-radius,1)) calc(8px * var(--ab-radius,1)) 0; color: var(--text-secondary); } .ab-art-pv-md table { border-collapse: collapse; margin: 14px 0; width: 100%; font-size:calc(15px * var(--ab-fs,1)); } /* v138 表格样式也作用于聊天气泡（mdRender 产物）——气泡内表格同样电子化 */ .ab-bubble table, .ab-msg-text table { border-collapse: separate; border-spacing: 0; margin: 10px 0; width: 100%; font-size:calc(13.5px * var(--ab-fs,1)); border: 1px solid var(--border); border-radius: calc(8px * var(--ab-radius,1)); overflow: hidden; } .ab-bubble th, .ab-msg-text th { background: color-mix(in srgb, var(--accent) 10%, transparent); font-weight: 600; padding: 7px 11px; text-align: left; border-bottom: 2px solid var(--accent); } .ab-bubble td, .ab-msg-text td { padding: 7px 11px; border-top: 1px solid var(--border); } .ab-bubble tbody tr:nth-child(even), .ab-msg-text tbody tr:nth-child(even) { background: var(--bg-secondary); } .ab-art-pv-md th, .ab-art-pv-md td { border: 1px solid var(--border); padding: 8px 13px; text-align: left; } .ab-art-pv-md th { background: var(--bg-tertiary, rgba(0,0,0,0.05)); font-weight: 600; } .ab-art-pv-md tr:nth-child(even) td { background: var(--bg-secondary); } .ab-art-pv-md hr { border: none; border-top: 2px solid var(--border); margin: 18px 0; } .ab-art-pv-md strong { color: var(--text-primary); font-weight: 700; } .ab-art-pv-md a { color: var(--accent); text-decoration: none; } .ab-art-pv-md a:hover { text-decoration: underline; } /* ============ v138 报告级排版增强（产物=成品报告，一眼看清结构/重点/结论） ============ */ /* ① h2 色块标题（淡绿底+圆角+左侧粗条）——代替"裸字+竖线" */ .ab-art-pv-md h2 { background: linear-gradient(90deg, color-mix(in srgb, var(--accent) 10%, transparent), color-mix(in srgb, var(--accent) 2%, transparent)); border-left: 5px solid var(--accent); border-radius: 0 calc(8px * var(--ab-radius,1)) calc(8px * var(--ab-radius,1)) 0; padding: 9px 14px; margin: 22px 0 12px; font-size:calc(19px * var(--ab-fs,1)); font-weight: 700; } /* ② h3 线性图标式（前置小三角标记） */ .ab-art-pv-md h3 { position: relative; padding-left: 18px; } .ab-art-pv-md h3::before { content: '▸'; position: absolute; left: 0; color: var(--accent); font-weight: 700; } /* ③ 关键词高亮（==xxx== → mark） */ .ab-art-pv-md mark { background: linear-gradient(180deg, rgba(250,204,21,0.0) 45%, rgba(250,204,21,0.45) 45%); color: var(--text-primary); padding: 0 2px; border-radius: calc(2px * var(--ab-radius,1)); font-weight: 600; } /* ④ 键盘/命令式关键词（+++xxx+++ → kbd） */ .ab-art-pv-md kbd { font-family: Consolas, Monaco, monospace; font-size:calc(12.5px * var(--ab-fs,1)); background: var(--bg-secondary); border: 1px solid var(--border); border-bottom-width: 2px; border-radius: calc(5px * var(--ab-radius,1)); padding: 1px 6px; color: var(--text-primary); white-space: nowrap; } /* ⑤ 表格升舱：斑马纹+表头深底+圆角+阴影+悬浮 */ .ab-art-pv-md table { border-collapse: separate; border-spacing: 0; border: 1px solid var(--border); border-radius: calc(10px * var(--ab-radius,1)); overflow: hidden; box-shadow: 0 1px 3px rgba(0,0,0,0.06); font-size:calc(14.5px * var(--ab-fs,1)); } .ab-art-pv-md thead th { background: linear-gradient(180deg, var(--bg-tertiary, color-mix(in srgb, var(--accent) 10%, transparent)), color-mix(in srgb, var(--accent) 6%, transparent)); color: var(--text-primary); font-weight: 700; font-size:calc(13.5px * var(--ab-fs,1)); letter-spacing: 0.02em; padding: 10px 13px; border-bottom: 2px solid var(--accent); border-top: none; } .ab-art-pv-md tbody td { padding: 9px 13px; border-top: none; border-left: none; } .ab-art-pv-md tbody td:last-child, .ab-art-pv-md thead th:last-child { border-right: none; } .ab-art-pv-md tbody tr:nth-child(even) { background: var(--bg-secondary); } .ab-art-pv-md tbody tr:hover { background: color-mix(in srgb, var(--accent) 6%, transparent); } /* ⑥ blockquote 升舱：左侧色条+浅底+圆角+内部垂直居中 */ .ab-art-pv-md blockquote { border-left: 4px solid var(--accent); background: linear-gradient(90deg, color-mix(in srgb, var(--accent) 7%, transparent), color-mix(in srgb, var(--accent) 2%, transparent)); border-radius: 0 calc(10px * var(--ab-radius,1)) calc(10px * var(--ab-radius,1)) 0; padding: 12px 16px; color: var(--text-primary); position: relative; } /* ⑦ hr 升舱：默认虚线+中心菱形；*** 点线；___ 实线 */ .ab-art-pv-md hr { border: none; border-top: 2px dashed var(--border); margin: 22px 0; position: relative; overflow: visible; } .ab-art-pv-md hr::after { content: '◆'; position: absolute; left: 50%; top: -9px; transform: translateX(-50%); background: var(--bg-primary); color: var(--accent); font-size:calc(11px * var(--ab-fs,1)); padding: 0 8px; } .ab-art-pv-md hr.dots { border-top-style: dotted; } .ab-art-pv-md hr.dots::after { content: '・・・'; font-size:calc(13px * var(--ab-fs,1)); letter-spacing: 2px; top: -11px; } .ab-art-pv-md hr.solid { border-top: 1.5px solid var(--border); } .ab-art-pv-md hr.solid::after { content: '§'; font-size:calc(12px * var(--ab-fs,1)); top: -10px; } /* ⑧ task list（- [ ] / - [x]）：方框+勾选 */ .ab-art-pv-md .ab-task { list-style: none; padding-left: 26px; position: relative; } .ab-art-pv-md .ab-task::before { content: none; } .ab-art-pv-md .ab-task-box { position: absolute; left: 0; top: 2px; width: 15px; height: 15px; border: 1.5px solid var(--accent); border-radius: calc(4px * var(--ab-radius,1)); display: inline-flex; align-items: center; justify-content: center; font-size:calc(11px * var(--ab-fs,1)); color: #fff; background: transparent; } .ab-art-pv-md .ab-task.done .ab-task-box { background: var(--accent); } .ab-art-pv-md .ab-task.done { color: var(--text-muted); text-decoration: line-through; } /* ⑨ 结论/总结/最终 关键词前自动加 ✅（只对以这些词开头的段落/列表项） */ .ab-art-pv-md p > strong:first-child, .ab-art-pv-md li > strong:first-child { color: var(--accent); } /* ⑩ 行内代码更醒目（浅绿底+绿字） */ .ab-art-pv-md code:not(pre code) { background: color-mix(in srgb, var(--accent) 10%, transparent); color: var(--accent); border: 1px solid color-mix(in srgb, var(--accent) 18%, transparent); } /* 纯文本模板 */ .ab-art-pv-txt { white-space: pre-wrap; word-break: break-word; } .ab-art-pv-body-flush { padding: 0; display: flex; flex-direction: column; } .ab-art-pv-body-flush .ab-art-browser-frame { flex: 1; min-height: 0; border-radius: 0; } /* 空态 */ .ab-art-empty { padding: 40px 20px; text-align: center; color: var(--text-muted); font-size:calc(13px * var(--ab-fs,1)); line-height: 1.8; } /* ========== 工作区导航（侧栏 · 浅色适配） ========== */ /* 工作区菜单折叠头 */ .ab-nav-head { display: flex; align-items: center; gap: 6px; padding: 8px 10px; margin: 6px 10px 0; font-size:calc(12px * var(--ab-fs,1)); font-weight: 600; color: var(--text-muted); cursor: pointer; border-radius: calc(6px * var(--ab-radius,1)); transition: background .14s; user-select: none; } .ab-nav-head:hover { background: var(--side-hover); color: var(--side-text-strong); } .ab-nav-collapse-txt { font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); width: 14px; text-align: center; transition: color .14s; } .ab-nav-head:hover .ab-nav-collapse-txt { color: var(--side-text-strong); } .ab-nav-head-txt { flex: 1; } .ab-nav { display: flex; flex-direction: column; gap: 2px; padding: 6px 10px; border-bottom: 1px solid var(--side-border); transition: all .2s; } .ab-nav.ab-nav-collapsed { display: none; } .ab-nav-item { display: flex; align-items: center; gap: 9px; padding: 8px 10px; border-radius: calc(8px * var(--ab-radius,1)); font-size:calc(14px * var(--ab-fs,1)); color: var(--side-text); cursor: pointer; transition: all 0.15s; user-select: none; } .ab-nav-item:hover { background: var(--side-hover); color: var(--side-text-strong); } .ab-nav-item.ab-nav-active { background: var(--side-active); color: var(--side-text-strong); font-weight: 600; box-shadow: 0 1px 4px rgba(0,0,0,0.10); } /* [C.219] 侧栏导航文字强制单行：左栏空间本就紧张（252px），一旦折成两行就白占一行高度。 字号可被 --ab-fs 放大，所以除了把长文案缩短，这里再用 nowrap 兜底； overflow+ellipsis 只在极端窄屏/超大字号时生效，正常回退为完整显示。 */ .ab-nav-txt { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } /* ========== 视图容器 ========== */ .ab-view { display: flex; flex-direction: column; flex: 1; min-height: 0; position: relative; } .ab-view.hidden { display: none; } /* ========== 子系统工作台 ========== */ /* ===== 顶栏副标题 + 内页 Tab 行（v87+） ===== */ .ab-header-sub { font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); margin-left: 8px; font-weight: 400; } .ab-tabbar { padding: 0 18px !important; gap: 0 !important; } .ab-tabbar-tabs { display: flex; align-items: stretch; gap: 2px; flex: 1; } .ab-tabbar-tab { padding: 9px 16px; font-size:calc(12px * var(--ab-fs,1)); font-weight: 600; color: var(--text-muted); cursor: pointer; border-bottom: 2px solid transparent; transition: all .15s; display: inline-flex; align-items: center; } .ab-tabbar-tab:hover { color: var(--text-primary); } .ab-tabbar-tab.ab-tabbar-on { color: var(--accent); border-bottom-color: var(--accent); } /* 任务页签融进 Tab 行（覆盖原 .ab-task-tab 块样式） */ .ab-tabbar .ab-task-tab { padding: 9px 16px; border-radius: 0; background: transparent; border-bottom: 2px solid transparent; } .ab-tabbar .ab-task-tab.ab-task-tab-on { color: var(--accent); border-bottom-color: var(--accent); background: transparent; } /* ===== v293：内页统一「分段滑块」Tab（助理/同事、查看任务、资料库），与自动化/专家一致 ===== */ .ab-seg-tabs { position: relative; display: inline-flex; gap: 0; padding: 3px; background: var(--bg-primary); border: 1px solid var(--border); border-radius: 999px; flex: 0 0 auto; align-self: center; } .ab-seg-tabs .ab-seg-glider { position: absolute; top: 3px; bottom: 3px; left: 0; width: 0; border-radius: 999px; background: var(--text-primary); transition: left .28s cubic-bezier(.4,0,.2,1), width .28s cubic-bezier(.4,0,.2,1); z-index: 0; pointer-events: none; } .ab-seg-tabs .ab-seg-tab { position: relative; z-index: 1; padding: 5px 16px; font-size:calc(13px * var(--ab-fs,1)); font-weight: 500; color: var(--text-muted); cursor: pointer; border: none; background: transparent; border-radius: 999px; transition: color .2s; text-align: center; white-space: nowrap; font-family: inherit; line-height: 1.2; } .ab-seg-tabs .ab-seg-tab:hover { color: var(--text-primary); } .ab-seg-tabs .ab-seg-tab.ab-seg-on { color: var(--bg-primary); font-weight: 600; } /* 资料库顶栏里的滑块间距 */ .ab-lib-topbar .ab-seg-tabs { margin-bottom: 0; } /* v293：远程通道按钮 —— 绿色高亮，醒目可见 */ .ab-assist-btn.primary { border-color: transparent; color: #fff; font-weight: 600; background: linear-gradient(135deg, var(--accent), var(--accent-hover)); box-shadow: 0 2px 10px color-mix(in srgb, var(--accent) 30%, transparent); } .ab-assist-btn.primary:hover { background: linear-gradient(135deg, var(--accent-hover), var(--accent)); box-shadow: 0 3px 14px color-mix(in srgb, var(--accent) 42%, transparent); } .ab-assist-btn .ab-ic { width: 13px; height: 13px; } .ab-subs-head { display: flex; align-items: center; gap: 10px; padding: 6px 18px; border-bottom: 1px solid var(--border); background: var(--bg-secondary); flex-shrink: 0; } /* 顶栏已显示当前菜单名，内页标题隐藏，只留副标题+按钮一行 */ .ab-subs-title { display: none; } .ab-subs-sub { font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); flex: 1; } /* ===== 自动化一键启动设置弹窗 ===== */ .ab-autosetup-mask { position: fixed; inset: 0; background: rgba(0,0,0,.5); z-index: 9999; display: flex; align-items: center; justify-content: center; padding: 20px; } .ab-autosetup { width: 520px; max-width: 100%; max-height: 90vh; overflow-y: auto; background: var(--bg-primary); border: 1px solid var(--border); border-radius: calc(16px * var(--ab-radius,1)); box-shadow: 0 20px 60px rgba(0,0,0,.3); } .ab-autosetup-head { display: flex; align-items: center; justify-content: space-between; padding: 16px 20px; border-bottom: 1px solid var(--border); } .ab-autosetup-title { font-size:calc(15px * var(--ab-fs,1)); font-weight: 700; color: var(--text-primary); } .ab-autosetup-x { background: transparent; border: none; color: var(--text-muted); font-size:calc(16px * var(--ab-fs,1)); cursor: pointer; padding: 4px 8px; border-radius: calc(6px * var(--ab-radius,1)); } .ab-autosetup-x:hover { background: var(--bg-secondary); color: var(--text-primary); } .ab-autosetup-body { padding: 18px 20px; display: flex; flex-direction: column; gap: 14px; } .ab-as-field { display: flex; flex-direction: column; gap: 6px; flex: 1; } .ab-as-row { display: flex; gap: 12px; } .ab-as-label { font-size:calc(12px * var(--ab-fs,1)); font-weight: 600; color: var(--text-secondary); } .ab-as-input { background: var(--bg-secondary); border: 1px solid var(--border); border-radius: calc(8px * var(--ab-radius,1)); padding: 9px 12px; font-size:calc(13px * var(--ab-fs,1)); color: var(--text-primary); font-family: inherit; outline: none; transition: border-color .15s; } .ab-as-input:focus { border-color: var(--accent); } .ab-as-textarea { resize: vertical; line-height: 1.6; } .ab-as-check { flex-direction: row !important; align-items: center; gap: 8px; font-size:calc(12px * var(--ab-fs,1)); color: var(--text-secondary); justify-content: flex-end; } .ab-as-check input { accent-color: var(--accent); width: 15px; height: 15px; } .ab-as-hint { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); background: var(--accent-light); border-left: 2px solid var(--accent); padding: 8px 12px; border-radius: 0 calc(8px * var(--ab-radius,1)) calc(8px * var(--ab-radius,1)) 0; line-height: 1.6; } /* v384：演示版调度限制警示（琥珀色，区别于常规提示） */ .ab-as-hint-warn { margin-top: 6px; color: #92400e; background: #fffbeb; border-left-color: #f59e0b; } .ab-as-hint-warn b { color: #b45309; } .ab-autosetup-foot { display: flex; justify-content: flex-end; gap: 10px; padding: 14px 20px; border-top: 1px solid var(--border); } .ab-as-cancel { background: transparent; border: 1px solid var(--border); color: var(--text-secondary); font-size:calc(13px * var(--ab-fs,1)); padding: 8px 18px; border-radius: calc(8px * var(--ab-radius,1)); cursor: pointer; font-family: inherit; } .ab-as-cancel:hover { background: var(--bg-secondary); } .ab-as-go { background: linear-gradient(135deg, var(--accent), var(--accent-hover)); border: none; color: #fff; font-size:calc(13px * var(--ab-fs,1)); font-weight: 600; padding: 8px 20px; border-radius: calc(8px * var(--ab-radius,1)); cursor: pointer; font-family: inherit; transition: opacity .15s; } .ab-as-go:hover { filter: brightness(1.1); opacity: .88; } /* ===== 自动化/工作流模版网格（chips+卡片，复刻子系统模式） ===== */ /* 自动化・工作流 合并视图：面板容器 */ .ab-hub-panel { flex: 1; overflow-y: auto; display: flex; flex-direction: column; } /* 隐藏态必须压过 display:flex（双类优先级） */ .ab-hub-panel.hidden { display: none; } .ab-auto-grid, .ab-wf-grid { flex: 1; overflow-y: auto; padding: 4px 20px 20px; display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; align-content: start; } .ab-auto-grid .ab-auto-note { grid-column: 1 / -1; margin: 0; } .ab-auto-grid .ab-auto-cat { grid-column: 1 / -1; margin: 8px 2px 2px; } .ab-auto-grid .ab-auto-tpl { transform: none !important; } .ab-auto-grid .ab-auto-tpl:hover { transform: translateY(-2px) !important; box-shadow: var(--shadow); } .ab-auto-grid .ab-auto-item { align-items: flex-start; flex-direction: column; gap: 8px; padding: 14px; border-radius: calc(12px * var(--ab-radius,1)); height: 100%; } .ab-auto-grid .ab-auto-item .ab-auto-tpl-ico { margin-bottom: 2px; } .ab-auto-grid .ab-auto-body { flex: 1; } .ab-auto-grid .ab-sub-badge { align-self: flex-end; } .ab-wf-card { background: var(--bg-secondary); border: 1px solid var(--border); border-radius: calc(12px * var(--ab-radius,1)); padding: 14px; cursor: pointer; transition: all .15s; display: flex; flex-direction: column; gap: 8px; } .ab-wf-card:hover { border-color: var(--accent); transform: translateY(-2px); box-shadow: var(--shadow); } .ab-wf-card-top { display: flex; align-items: center; gap: 8px; } .ab-wf-card-dept { font-size:calc(10px * var(--ab-fs,1)); padding: 2px 8px; border-radius: calc(8px * var(--ab-radius,1)); font-weight: 600; background: var(--accent-light); color: var(--accent); } .ab-wf-card-name { font-size:calc(14px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary); } .ab-wf-card-desc { font-size:calc(12px * var(--ab-fs,1)); color: var(--text-secondary); line-height: 1.5; min-height: 36px; } .ab-wf-card-foot { display: flex; align-items: center; justify-content: space-between; margin-top: 2px; } .ab-wf-card-nodes { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); } .ab-wf-card-use { background: transparent; border: 1px solid var(--border); color: var(--text-muted); font-size:calc(12px * var(--ab-fs,1)); padding: 4px 14px; border-radius: calc(6px * var(--ab-radius,1)); cursor: pointer; transition: all .15s; font-family: inherit; } .ab-wf-card-use:hover { border-color: var(--accent); color: var(--accent); } .ab-wf-myline { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; padding: 10px 14px; background: var(--bg-secondary); border: 1px solid var(--border); border-radius: calc(10px * var(--ab-radius,1)); } .ab-wf-myline .ab-wf-myname { font-size:calc(13px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary); } .ab-wf-myline .ab-wf-mymeta { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); } /* [C.116] 工作流「我的工作流」置顶：网格容器内标题与条目都占满整行，避免被挤成 280px 单列 */ .ab-wf-grid .ab-auto-cat { grid-column: 1 / -1; margin: 8px 2px 2px; } .ab-wf-grid .ab-wf-mine { grid-column: 1 / -1; margin-bottom: 0; } .ab-wf-myhead { color: var(--accent); } .ab-wf-myhead + .ab-wf-mine { margin-top: 2px; } .ab-wf-tplhead { margin-top: 16px; color: var(--text-muted); font-weight: 700; } .ab-subs-grid { flex: 1; overflow-y: auto; display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; padding: 16px 18px; align-content: start; } /* [C.114a] 接管中心 tab：本表 .hidden 一律按「组件+hidden」定义，缺这条时点「接管中心」21 张子系统卡仍留在上方，看着像重复渲染（老板 2026-10-21 反馈）。*/ .ab-subs-grid.hidden { display: none; } .ab-sub-card { background: var(--bg-secondary); border: 1px solid var(--border); border-radius: calc(12px * var(--ab-radius,1)); padding: 14px; cursor: pointer; transition: all 0.15s; display: flex; flex-direction: column; gap: 8px; } .ab-sub-card:hover { border-color: var(--accent); transform: translateY(-2px); box-shadow: var(--shadow); } .ab-sub-top { display: flex; align-items: center; gap: 8px; } .ab-sub-ico { font-size:calc(20px * var(--ab-fs,1)); } .ab-sub-name { font-size:calc(14px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary); flex: 1; } .ab-sub-badge { font-size:calc(10px * var(--ab-fs,1)); padding: 2px 8px; border-radius: calc(8px * var(--ab-radius,1)); font-weight: 600; } .ab-sub-badge.ok { background: color-mix(in srgb, var(--accent) 15%, transparent); color: var(--success); } .ab-sub-badge.wait { background: rgba(245,158,11,0.15); color: var(--warn); } /* v348 外部 MCP 市场：徽标 + 元信息 + 安装命令 */ .ab-sub-badge.ext { background: rgba(59,130,246,0.12); color: #3b82f6; } .ab-mcp-card-ext { border-style: dashed; } .ab-mcp-ext-meta { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); } .ab-mcp-ext-desc { font-size:calc(12px * var(--ab-fs,1)); color: var(--text-primary); line-height: 1.5; } .ab-mcp-ext-install { font-size:calc(11px * var(--ab-fs,1)); } .ab-mcp-ext-install code { background: var(--bg-secondary); border: 1px solid var(--border); border-radius: calc(6px * var(--ab-radius,1)); padding: 2px 6px; font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); } /* ===== v350b 内容创作链/一键分发 交互补全（2026-10-01）===== */ /* 问题1：红框抖动提醒未填字段 */ .ab-as-input.ab-as-err { border-color: var(--error, #ef4444) !important; box-shadow: 0 0 0 3px rgba(239,68,68,0.15); animation: abErrShake .3s; } @keyframes abErrShake { 0%,100% { transform: translateX(0); } 25% { transform: translateX(-5px); } 75% { transform: translateX(5px); } } /* 问题2：绿色光线扫过文字动效（对齐聊天回复的扫光感） */ .ab-scanline { padding: 18px 14px; text-align: center; overflow: hidden; } .ab-scanline-txt { font-size:calc(13px * var(--ab-fs,1)); font-weight: 600; letter-spacing: 0.5px; background: linear-gradient(90deg, var(--text-muted) 0%, var(--text-muted) 40%, var(--accent) 50%, var(--text-muted) 60%, var(--text-muted) 100%); background-size: 200% 100%; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; animation: abScanline 1.4s linear infinite; } @keyframes abScanline { 0% { background-position: 120% 0; } 100% { background-position: -20% 0; } } /* 问题3：成稿步骤卡 + 功能条 */ .ab-skillchain-step { border: 1px solid var(--border); border-radius: calc(10px * var(--ab-radius,1)); padding: 10px 12px; margin-bottom: 8px; background: var(--bg-primary); } .ab-skillchain-step-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 6px; } .ab-skillchain-body { white-space: pre-wrap; line-height: 1.6; max-height: 200px; overflow-y: auto; font-size:calc(13px * var(--ab-fs,1)); color: var(--text-primary); margin-top: 4px; } .ab-skillchain-step-head .ab-mcp-tool-name { font-size:calc(13px * var(--ab-fs,1)); } .ab-skillchain-inline .ab-skillchain-status { font-weight: 700; } .ab-as-platgroup { display: flex; gap: 14px; flex-wrap: wrap; padding: 6px 0; } .ab-as-plat { display: flex; align-items: center; gap: 5px; font-size:calc(13px * var(--ab-fs,1)); color: var(--text-primary); cursor: pointer; font-weight: 400; } .ab-as-plat input[type=checkbox] { accent-color: var(--accent); cursor: pointer; } .ab-chain-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border); } .ab-chain-btn { background: transparent; border: 1px solid var(--border); color: var(--text-muted); border-radius: calc(8px * var(--ab-radius,1)); padding: 6px 14px; font-size:calc(12px * var(--ab-fs,1)); cursor: pointer; transition: all .15s; } .ab-chain-btn:hover { border-color: var(--accent); color: var(--accent); } /* v351 技能链对话流内联样式 */ .ab-skillchain-inline { margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--border); } .ab-skillchain-status { font-size:calc(11px * var(--ab-fs,1)); } .ab-scanline-inline { font-size:calc(11px * var(--ab-fs,1)); font-weight: 400; } .ab-sub-desc { font-size:calc(12px * var(--ab-fs,1)); color: var(--text-secondary); line-height: 1.5; min-height: 36px; } .ab-sub-foot { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); display: flex; justify-content: flex-end; } .ab-sub-cmd { color: var(--accent); } .ab-sub-open { background: transparent; border: 1px solid var(--border); color: var(--text-muted); font-size:calc(12px * var(--ab-fs,1)); padding: 4px 14px; border-radius: calc(6px * var(--ab-radius,1)); cursor: pointer; transition: all .15s; font-family: inherit; } .ab-sub-open:hover { border-color: var(--accent); color: var(--accent); } .ab-sub-card { cursor: pointer; } .ab-sub-card.ab-sub-live .ab-sub-badge.ok { box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent) 30%, transparent); } /* ============ P8a 智能体接管中心（只读） ============ */ .ab-subtab { cursor: pointer; user-select: none; } .ab-agent-hub { display: flex; flex-direction: column; min-height: 0; flex: 1 1 auto; } .ab-agent-hub.hidden { display: none; } .ab-agent-hd { display: flex; flex-direction: column; gap: 2px; padding: 12px 18px 4px; } .ab-agent-hd-t { font-size:calc(15px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary); } .ab-agent-hd-t .ab-ic { width: 17px; height: 17px; vertical-align: -3px; margin-right: 5px; color: var(--accent); } .ab-agent-hd-s { font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); } .ab-agent-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; padding: 12px 18px 24px; overflow: auto; } .ab-agent-card { border: 1px solid var(--border); border-radius: calc(12px * var(--ab-radius,1)); padding: 12px 14px; background: var(--bg-secondary, #fff); display: flex; flex-direction: column; gap: 8px; } .ab-agent-card.ab-agent-off { opacity: .55; } .ab-agent-top { display: flex; align-items: center; gap: 8px; } .ab-agent-ico { width: 32px; height: 32px; border-radius: calc(9px * var(--ab-radius,1)); display: flex; align-items: center; justify-content: center; background: color-mix(in srgb, var(--accent) 10%, transparent); color: var(--accent); flex: 0 0 auto; } .ab-agent-ico .ab-ic { width: 17px; height: 17px; } .ab-agent-name { font-size:calc(14px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary); flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .ab-agent-kind { font-size:calc(10px * var(--ab-fs,1)); padding: 1px 6px; border-radius: calc(6px * var(--ab-radius,1)); background: rgba(2,132,199,.12); color: #0284c7; text-transform: uppercase; } .ab-agent-state { font-size:calc(11px * var(--ab-fs,1)); padding: 2px 8px; border-radius: calc(10px * var(--ab-radius,1)); white-space: nowrap; } .ab-agent-state.ok { background: color-mix(in srgb, var(--accent) 15%, transparent); color: var(--success); } .ab-agent-state.no { background: rgba(148,163,184,.15); color: var(--text-muted); } .ab-agent-meta { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); word-break: break-all; } .ab-agent-caps { display: flex; flex-wrap: wrap; gap: 4px; } .ab-agent-cap { font-size:calc(10px * var(--ab-fs,1)); padding: 1px 7px; border-radius: calc(6px * var(--ab-radius,1)); background: var(--bg-hover, rgba(0,0,0,.05)); color: var(--text-secondary); } .ab-agent-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: auto; padding-top: 4px; border-top: 1px dashed var(--border); } .ab-agent-grant { display: inline-flex; align-items: center; gap: 6px; font-size:calc(12px * var(--ab-fs,1)); color: var(--text-primary); cursor: pointer; } .ab-agent-grant input { accent-color: var(--accent); cursor: pointer; } .ab-agent-lv { font-size:calc(11px * var(--ab-fs,1)); color: var(--accent); font-weight: 600; } .ab-agent-lv.dim { color: var(--text-muted); font-weight: 400; } .ab-agent-run { margin-left: auto; border: 1px solid var(--accent); color: var(--accent); background: transparent; border-radius: calc(6px * var(--ab-radius,1)); padding: 2px 10px; font-size:calc(11.5px * var(--ab-fs,1)); cursor: pointer; } .ab-agent-run:hover { background: var(--accent); color: #fff; } .ab-agent-result-mask { position: fixed; inset: 0; background: rgba(15,23,42,.45); z-index: 9000; display: flex; align-items: center; justify-content: center; } .ab-agent-result { width: min(760px, 92vw); max-height: 82vh; background: var(--panel-bg, #fff); border-radius: calc(12px * var(--ab-radius,1)); box-shadow: 0 18px 60px rgba(0,0,0,.25); display: flex; flex-direction: column; overflow: hidden; } .ab-agent-result-hd { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; border-bottom: 1px solid var(--border, #e5e7eb); font-weight: 600; font-size:calc(13.5px * var(--ab-fs,1)); } .ab-agent-result-bd { flex: 1; overflow: auto; margin: 0; padding: 14px 16px; font-size:calc(12.5px * var(--ab-fs,1)); line-height: 1.7; white-space: pre-wrap; word-break: break-word; color: var(--text-primary); background: var(--bg, #f8fafc); } .ab-agent-result-ft { display: flex; align-items: center; gap: 8px; padding: 10px 16px; border-top: 1px solid var(--border, #e5e7eb); } .ab-agent-result-dir { margin-left: auto; font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); max-width: 45%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .ab-agent-empty, .ab-agent-loading { grid-column: 1 / -1; display: flex; align-items: center; gap: 10px; padding: 34px 20px; justify-content: center; text-align: center; color: var(--text-muted); font-size:calc(13px * var(--ab-fs,1)); line-height: 1.7; } .ab-agent-empty .ab-ic { width: 26px; height: 26px; color: var(--accent); flex: 0 0 auto; } /* 停止按钮 */ .ab-stop { width: 36px !important; height: 36px !important; color: var(--error) !important; border: 1px solid var(--border) !important; border-radius: 50% !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; } .ab-stop.hidden { display: none !important; } /* 消息操作（复制/重生成，悬停气泡出现） */ .ab-msg-actions { display: flex; gap: 4px; margin-top: 4px; opacity: 0; transition: opacity 0.15s; } .ab-msg:hover .ab-msg-actions { opacity: 1; } /* v144：AI 回复底部标签固定左对齐 + 默认显示（不依赖 hover） */ .ab-msg-actions.ab-msg-actions-left { justify-content: flex-start; opacity: 1; flex-wrap: nowrap; /* v322：底部工具行永远单行，不换行成两行 */ min-width: 0; } /* v322 操作按钮图标化：纯图标无文字，悬停出 tooltip（title），无边框 */ .ab-msg-act { border: none; background: transparent; color: var(--text-muted); border-radius: calc(6px * var(--ab-radius,1)); font-size:calc(12px * var(--ab-fs,1)); padding: 3px 6px; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; transition: color .12s, background .12s; } .ab-msg-act:hover { color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, transparent); border: none; } .ab-msg-act .ab-ic { width: 15px; height: 15px; } /* v322 模型名必须完整显示、自适应长度、永远一行（绝不换行成两行） */ .ab-msg-actions.ab-msg-actions-left .ab-msg-meta { /* v325：模型名+时间是「5个快捷按钮组」的一部分，紧跟其后，绝不用 margin-left:auto 推到最右 */ flex: 0 0 auto; white-space: nowrap; overflow: visible; text-overflow: clip; max-width: none; } /* ===== v304 P9a：用户消息「编辑重发」内联编辑态 ===== */ .ab-msg-editwrap { margin-top: 6px; } .ab-msg-editarea { width: 100%; box-sizing: border-box; resize: vertical; min-height: 54px; max-height: 40vh; border: 1px solid var(--accent); border-radius: calc(8px * var(--ab-radius,1)); background: var(--bg-secondary, #12141f); color: var(--text-primary, #e0e0e0); font: inherit; font-size:calc(13px * var(--ab-fs,1)); line-height: 1.6; padding: 8px 10px; outline: none; } .ab-msg-editbar { display: flex; align-items: center; gap: 8px; margin-top: 6px; } .ab-msg-editok, .ab-msg-editcancel { border-radius: calc(6px * var(--ab-radius,1)); font-size:calc(11.5px * var(--ab-fs,1)); padding: 4px 12px; cursor: pointer; border: 1px solid var(--border, color-mix(in srgb, var(--accent) 15%, transparent)); background: var(--bg-secondary, #12141f); color: var(--text-muted); } .ab-msg-editok { color: var(--accent); border-color: var(--accent); } .ab-msg-editok:hover { background: var(--accent-light, color-mix(in srgb, var(--accent) 12%, transparent)); } .ab-msg-editcancel:hover { color: var(--text-primary, #e0e0e0); } .ab-msg-edithint { font-size:calc(10.5px * var(--ab-fs,1)); color: var(--text-muted); opacity: .75; margin-left: auto; } /* v180 B-轻：断线重试定格注记（旧气泡尾部，虚线分隔 + 细字提示） */ .ab-resume-note { margin-top: 10px; padding-top: 8px; border-top: 1px dashed var(--border); font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); line-height: 1.5; } /* ===== P40 · 511 ④⑤：中断三动作组 + 错误态专业化卡片（线性描边，无实心大色块） ===== */ .ab-err-card { margin: 10px 0 2px; padding: 10px 12px; border: 1px solid color-mix(in srgb, var(--error, #ef4444) 32%, transparent); border-radius: calc(10px * var(--ab-radius,1)); background: color-mix(in srgb, var(--error, #ef4444) 6%, transparent); } .ab-err-card.is-timeout { border-color: color-mix(in srgb, var(--warn, #f59e0b) 42%, transparent); background: color-mix(in srgb, var(--warn, #f59e0b) 7%, transparent); } .ab-err-card.is-stopped { border-color: var(--border); background: var(--bg-secondary); } .ab-err-hd { display: flex; align-items: center; gap: 6px; margin-bottom: 6px; font-size:calc(13px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary, inherit); } .ab-err-hd .ab-ic { width: 15px; height: 15px; color: var(--error, #ef4444); } .ab-err-card.is-timeout .ab-err-hd .ab-ic { color: var(--warn, #f59e0b); } .ab-err-card.is-stopped .ab-err-hd .ab-ic { color: var(--text-muted); } .ab-err-row { display: flex; gap: 8px; font-size:calc(12px * var(--ab-fs,1)); line-height: 1.6; } .ab-err-row + .ab-err-row { margin-top: 2px; } .ab-err-k { flex: 0 0 auto; color: var(--text-muted); } .ab-err-v { flex: 1 1 auto; color: var(--text-primary, inherit); word-break: break-word; } .ab-int-acts { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 8px; } .ab-int-btn { display: inline-flex; align-items: center; gap: 5px; padding: 4px 10px; border: 1px solid var(--border); border-radius: calc(999px * var(--ab-radius,1)); background: var(--bg-secondary); color: var(--text-primary, inherit); font-size:calc(12px * var(--ab-fs,1)); cursor: pointer; transition: border-color .12s, color .12s, background .12s; align-self: flex-start; /* P40 \u00b7 511\uff1a\u9632\u5916\u5c42 flex stretch \u628a\u6309\u94ae\u62c9\u9ad8 */ } .ab-int-btn .ab-ic { width: 13px; height: 13px; } .ab-int-btn:hover { border-color: var(--accent); color: var(--accent); background: var(--accent-light, transparent); } .ab-int-btn.primary { border-color: var(--accent); color: var(--accent); } .ab-int-btn.ghost { color: var(--text-muted); } .ab-int-btn:disabled { opacity: .5; cursor: default; } .ab-int-acts.is-dropped { opacity: .55; } /* ===== P40 · 511 ④⑤ end ===== */ /* ========== v184：任务完成站内气泡（360×140，0.5px 绿框无阴影，30px 淡绿头+10px 深灰正文） ========== */ #abToastHost { position: fixed; right: 22px; bottom: 22px; z-index: 9999; display: flex; flex-direction: column; gap: 12px; pointer-events: none; } .ab-toast-done { pointer-events: auto; position: relative; display: flex; flex-direction: column; width: 360px; height: 140px; box-sizing: border-box; background: var(--bg-secondary, #fff); border: 0.5px solid var(--accent); border-radius: calc(12px * var(--ab-radius,1)); cursor: pointer; overflow: hidden; opacity: 0; transform: translateY(16px) scale(.97); transition: opacity .28s ease, transform .28s ease; } .ab-toast-done.ab-toast-in { opacity: 1; transform: translateY(0) scale(1); } .ab-toast-done.ab-toast-out { opacity: 0; transform: translateY(10px) scale(.97); } /* 头部：30px 淡绿色带底 + 品牌字 + ✓图标 任务已完成 */ .ab-toast-head { flex: none; display: flex; align-items: center; gap: 8px; height: 30px; box-sizing: border-box; padding: 0 14px; background: color-mix(in srgb, var(--accent) 6%, transparent); border-bottom: 0.5px solid var(--accent); } .ab-toast-brand { font-size:calc(14px * var(--ab-fs,1)); font-weight: 700; color: var(--accent); letter-spacing: .2px; } .ab-toast-ic { flex: none; width: 20px; height: 20px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; border: 1.5px solid var(--accent); background: var(--bg-secondary, #fff); color: var(--accent); } .ab-toast-ic .ab-ic { width: 12px; height: 12px; } .ab-toast-title { font-size:calc(14px * var(--ab-fs,1)); font-weight: 600; color: var(--accent); } .ab-toast-x { flex: none; margin-left: auto; border: none; background: none; color: var(--accent); cursor: pointer; padding: 3px; border-radius: calc(6px * var(--ab-radius,1)); display: flex; align-items: center; opacity: .75; } .ab-toast-x:hover { opacity: 1; background: color-mix(in srgb, var(--accent) 12%, transparent); } .ab-toast-x .ab-ic { width: 14px; height: 14px; } /* 内容区：纯白底，与客户端通用正文字号一致（15px），2-3 行预览 */ .ab-toast-body { flex: 1; width: 100%; box-sizing: border-box; padding: 10px 14px; background: var(--bg-secondary, #fff); font-size:calc(13px * var(--ab-fs,1)); color: #4b5563; line-height: 1.6; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; word-break: break-word; } /* 底部 30s 倒计时条（线性，绿色渐缩） */ .ab-toast-bar { position: absolute; left: 0; bottom: 0; height: 3px; width: 100%; background: var(--accent); transform-origin: left center; animation: abToastBar linear forwards; opacity: .85; } @keyframes abToastBar { from { transform: scaleX(1); } to { transform: scaleX(0); } } /* ========== 左侧边栏（商务版 · 浅色蓝紫过渡） ========== */ .ab-sidebar { width: 252px; flex-shrink: 0; display: flex; flex-direction: column; background: var(--side-bg); border-right: 1px solid var(--side-border); transition: margin-left 0.2s ease, width 0.2s ease; color: var(--side-text); overflow: hidden; } :root:not(.ab-light) .ab-sidebar { backdrop-filter: blur(8px); } /* v104: 折叠后缩成 48px 图标栏（margin-left:0 不移动，width:48px 缩窄，图标栏留在屏幕内） */ .ab-sidebar.ab-sidebar-collapsed { margin-left: 0; width: 48px; } /* 折叠后隐藏宽内容，保留 48px 图标栏 */ .ab-sidebar.ab-sidebar-collapsed .ab-brand, .ab-sidebar.ab-sidebar-collapsed .ab-side-top, .ab-sidebar.ab-sidebar-collapsed .ab-nav, .ab-sidebar.ab-sidebar-collapsed .ab-side-scroll, .ab-sidebar.ab-sidebar-collapsed .ab-side-foot { display: none; } .ab-sidebar.ab-sidebar-collapsed .ab-side-iconbar { display: flex; } /* 展开状态隐藏图标栏 */ .ab-side-iconbar { display: none; flex-direction: column; align-items: center; padding: 8px 0; gap: 4px; height: 100%; } .ab-side-iconbar .ab-icon-btn { width: 28px; height: 28px; border-radius: calc(6px * var(--ab-radius,1)); } /* v105: 手机端窄图标栏适配 */ @media (max-width: 768px) { .ab-side-iconbar { padding: 4px 0; gap: 2px; } .ab-side-iconbar .ab-icon-btn { width: 26px; height: 26px; } .ab-side-iconbar .ab-icon-btn .ab-ic { width: 14px; height: 14px; } } .ab-side-top { padding: 6px 12px 4px; } /* 品牌位（最左上角，版本号白字无边框在右下角） */ .ab-brand { display: flex; align-items: baseline; gap: 8px; padding: 14px 14px 8px; position: relative; } .ab-brand-name { font-size:calc(17px * var(--ab-fs,1)); font-weight: 700; color: var(--side-text-strong); letter-spacing: 0.3px; line-height: 1; } /* 深色下品牌名以翠绿为主（对齐首页主标题色） */ :root:not(.ab-light) .ab-brand-name { color: var(--accent); text-shadow: 0 0 12px color-mix(in srgb, var(--accent) 35%, transparent); } :root:not(.ab-light) .ab-brand-ver { color: var(--accent); } .ab-brand-ver { font-size:calc(10px * var(--ab-fs,1)); color: var(--side-text-strong); font-family: Consolas, monospace; transform: translateY(1px); } /* 侧边栏内折叠按钮（品牌位右侧）：向左实心角标 */ .ab-brand-collapse { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); width: 24px; height: 24px; display: flex; align-items: center; justify-content: center; color: var(--side-muted); opacity: 0.8; transition: all .15s; } .ab-brand-collapse:hover { opacity: 1; color: var(--side-text-strong); } .ab-brand-collapse .ab-ic { width: 16px; height: 16px; fill: currentColor; } /* 手机端：侧边栏展开时折叠按钮可见（侧边栏覆盖在内容上） */ @media (max-width: 768px) { .ab-brand-collapse { color: var(--side-text-strong); opacity: 1; background: var(--side-bg, var(--bg-secondary)); border-radius: 50%; width: 28px; height: 28px; display: flex; align-items: center; justify-content: center; box-shadow: 0 2px 8px rgba(0,0,0,0.15); } .ab-brand-collapse .ab-ic { width: 16px; height: 16px; fill: currentColor; } } /* 新建任务：商务幽灵按钮 */ .ab-newchat { width: 100%; display: flex; align-items: center; justify-content: center; gap: 7px; padding: 5px 12px; background: transparent; color: var(--side-text); border: 1px solid var(--side-chip-border); border-radius: calc(8px * var(--ab-radius,1)); font-size:calc(13px * var(--ab-fs,1)); font-weight: 500; cursor: pointer; transition: all 0.15s; } .ab-newchat:hover { background: var(--side-hover); } /* ===== v175 跨会话搜索 ===== */ .ab-sess-search { position: relative; display: flex; align-items: center; gap: 6px; margin: 4px 12px 2px; padding: 0 8px; background: var(--side-hover); border: 1px solid var(--side-chip-border); border-radius: calc(8px * var(--ab-radius,1)); height: 30px; transition: border-color .15s; } .ab-sess-search:focus-within { border-color: var(--accent); } .ab-sess-search-ico { width: 14px; height: 14px; color: var(--side-text-dim, #94a3b8); flex: none; } .ab-sess-search-input { flex: 1; min-width: 0; background: transparent; border: none; outline: none; color: var(--side-text); font-size:calc(12.5px * var(--ab-fs,1)); height: 100%; } .ab-sess-search-input::placeholder { color: var(--side-text-dim, #94a3b8); } .ab-sess-search-clear { flex: none; display: flex; align-items: center; justify-content: center; width: 18px; height: 18px; background: transparent; border: none; cursor: pointer; color: var(--side-text-dim, #94a3b8); border-radius: calc(4px * var(--ab-radius,1)); padding: 0; } .ab-sess-search-clear:hover { background: var(--side-active); color: var(--side-text); } .ab-sess-search-clear .ab-ic { width: 12px; height: 12px; } .ab-sess-search-results { margin: 2px 12px 4px; background: var(--panel, #fff); border: 1px solid var(--side-chip-border); border-radius: calc(8px * var(--ab-radius,1)); max-height: 320px; overflow-y: auto; box-shadow: 0 6px 20px rgba(0,0,0,.12); } .ab-sess-hit { padding: 8px 10px; cursor: pointer; border-bottom: 1px solid var(--side-chip-border); } .ab-sess-hit:last-child { border-bottom: none; } .ab-sess-hit:hover { background: var(--side-hover); } .ab-sess-hit-title { font-size:calc(12.5px * var(--ab-fs,1)); font-weight: 600; color: var(--side-text); display: flex; align-items: center; gap: 6px; margin-bottom: 2px; } .ab-sess-hit-snip { font-size:calc(11.5px * var(--ab-fs,1)); color: var(--side-text-dim, #94a3b8); line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .ab-sess-hit-snip mark { background: color-mix(in srgb, var(--accent) 25%, transparent); color: var(--accent); border-radius: calc(2px * var(--ab-radius,1)); padding: 0 1px; } .ab-sess-hit-meta { font-size:calc(10.5px * var(--ab-fs,1)); color: var(--side-text-dim, #94a3b8); flex: none; } .ab-sess-search-empty { padding: 14px; text-align: center; font-size:calc(12px * var(--ab-fs,1)); color: var(--side-text-dim, #94a3b8); } .ab-sidebar.ab-sidebar-collapsed .ab-sess-search, .ab-sidebar.ab-sidebar-collapsed .ab-sess-search-results { display: none; } .ab-side-list { flex: 1; overflow-y: auto; padding: 8px; } .ab-session-item { display: flex; align-items: center; justify-content: space-between; gap: 6px; padding: 8px 10px; margin-bottom: 2px; border-radius: calc(8px * var(--ab-radius,1)); font-size:calc(13px * var(--ab-fs,1)); color: var(--side-text); cursor: pointer; transition: background 0.12s; overflow: hidden; padding-right: 30px; /* 右侧留位给 ⋯ 钮 */ } .ab-session-item:hover { background: var(--side-hover); color: var(--side-text-strong); } .ab-session-item.ab-session-active { background: var(--side-active); color: var(--side-text-strong); box-shadow: 0 1px 4px rgba(0,0,0,0.10); border-left: 3px solid var(--accent); padding-left: 7px; } .ab-session-text { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } /* 【C.145 2026-10-24 老板令】修「标题只滚几个字就被截断、字只剩半边」 ── 根因（代码层实证，非猜测）：旧实现把 transform 直接挂在 .ab-session-text 上， 而它自己就是 overflow:hidden 的裁剪窗口（宽度仅 ~143px）。文字在排版阶段就已经被 裁成 143px 的一块，位移这块「裁好的窗口」只是把它整体移出父容器、右侧露白， 永远不会把 143px 之后的字带进视野 ⇒ 客户看到的正是「滚两下就断、字被切半边」。 ── 修法：滚动层与裁剪层分离成两层。 · 外层 .ab-session-text 保持 143px 裁剪窗口不变（布局零变化） · 内层 .ab-session-inner 按内容真实宽度排版（743px 级的完整标题） · hover 时位移的是内层 ⇒ 一个字一个字从右向左真实滚过窗口 ── 省略号仍保留：内层默认 max-width:100% + ellipsis，不滚时照样显示「…」； 只有 JS 确认溢出并打了 ab-mq-on 才展开内层准备滚动。 */ .ab-session-inner { display: inline-block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; vertical-align: baseline; } /* 【C.94b 2026-10-20 老板令】会话标题悬停左右滚动 —— 让客户一眼看清是哪个会话 · 只有文字溢出（JS 打了 ab-mq-on）才滚，短标题零影响 · 来回滚（alternate）而不是单向跳回，视觉更稳；时长由 --ab-mq-dur 按距离给 · 尊重系统「减少动态效果」设置 */ .ab-session-text.ab-mq-on { text-overflow: clip; } .ab-session-text.ab-mq-on .ab-session-inner { max-width: none; overflow: visible; text-overflow: clip; } .ab-session-item:hover .ab-session-text.ab-mq-on .ab-session-inner { animation: abSessMarquee var(--ab-mq-dur, 2.6s) ease-in-out infinite alternate; } @keyframes abSessMarquee { from { transform: translateX(0); } to { transform: translateX(var(--ab-mq, 0px)); } } @media (prefers-reduced-motion: reduce) { /* [C.99] 原来直接 animation:none ⇒ 系统开启「减少动态效果」的客户永远看不到滚动，等于功能没做。 改为只滚一轮即停：既尊重无障碍，又保证一次完整反馈。 */ .ab-session-item:hover .ab-session-text.ab-mq-on .ab-session-inner { animation-iteration-count: 1; } } /* 会话主区：标题一行 + 副信息（时间默认行内显示，不占整行） */ .ab-session-main { flex: 1; min-width: 0; display: flex; align-items: baseline; gap: 8px; } .ab-session-sub { display: inline-flex; align-items: center; gap: 5px; font-size:calc(11px * var(--ab-fs,1)); color: var(--side-muted); white-space: nowrap; flex-shrink: 0; transition: opacity 0.12s; } /* 时间默认行内常显（功能键已收进 ⋯ 菜单，无需让位） */ /* 状态标识：运行中旋转绿环 / 完成未读绿点 / 失败红点 */ .ab-sess-dot { width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; } .ab-sess-dot.done { background: var(--accent); } .ab-sess-dot.fail { background: #ef4444; } .ab-sess-ring { width: 10px; height: 10px; flex-shrink: 0; border: 1.5px solid color-mix(in srgb, var(--accent) 30%, transparent); border-top-color: var(--accent); border-radius: 50%; animation: ab-spin 0.9s linear infinite; } @keyframes ab-spin { to { transform: rotate(360deg); } } /* ===== v124 会话列表状态标：更显眼的绿色转圈 + 完成粗绿点 ===== */ .ab-sess-ring-lg { width: 13px; height: 13px; flex-shrink: 0; border: 2px solid color-mix(in srgb, var(--accent) 22%, transparent); border-top-color: var(--accent); border-right-color: var(--accent); border-radius: 50%; animation: ab-spin 0.7s linear infinite; box-shadow: 0 0 6px color-mix(in srgb, var(--accent) 45%, transparent); } .ab-sess-bigdot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; background: var(--accent); box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 16%, transparent), 0 0 5px color-mix(in srgb, var(--accent) 40%, transparent); } .ab-sess-bigdot.fail { background: #ef4444; box-shadow: 0 0 0 2px rgba(239,68,68,0.16), 0 0 5px rgba(239,68,68,0.35); } @keyframes ab-ls-breathe { 0%,100% { opacity: .3; transform: scale(.85); } 50% { opacity: 1; transform: scale(1.2); } } @keyframes ab-ls-swap { 0% { opacity: 0; transform: translateY(4px); } 100% { opacity: 1; transform: translateY(0); } } /* v144 常驻状态条：AutoBuddy 标题下，消息结束前常显（轮播短语+百分比+计时+展开流程） v148 关键修复：width:0 + min-width:100% —— 本条不参与父级 max-content 计算。 否则轮播文案/计时文字长度一变，同一消息体内的计划卡、产物卡宽度会跟着一起抖动。 v148：拆两行 —— 第一行（状态词）撑满，第二行（处理时长）独占一行、按自身文字长度自适应。 */ .ab-status-strip { width: 0; min-width: 100%; display: block; overflow: visible; margin: 2px 0 6px; font-size:calc(12px * var(--ab-fs,1)); color: var(--text-secondary, #555); /* v325：思考/进度条只用来显示进度，去边框去大背景块，保持简洁（老板指令） */ background: transparent; border: none; border-radius: 0; padding: 2px 0; transition: opacity .4s; } .ab-status-strip.done { opacity: 0; pointer-events: none; height: 0; margin: 0; padding: 0; border: none; } .ab-status-strip .ab-ss-row { display: flex; align-items: center; gap: 6px; min-width: 0; flex-wrap: nowrap; } .ab-status-strip .ab-ss-row2 { margin-top: 4px; width: fit-content; max-width: 100%; } .ab-status-strip .ab-ss-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--accent); flex: 0 0 auto; animation: ab-ls-breathe 1.1s ease-in-out infinite; } /* 【2026-10-08 P20-u】老板反馈：思考语/俏皮语被截断（“正在思…”）。修法：俏皮句「整行独占 + 允许换行」完整显示；思考语/阶段词也放开省略号。 */ .ab-status-strip .ab-ss-pct { order: 4; } .ab-status-strip .ab-ss-txt { order: 5; flex: 0 1 auto; min-width: 0; white-space: normal; overflow: visible; text-overflow: clip; line-height: 1.45; margin-top: 0; } .ab-status-strip .ab-ss-think, .ab-status-strip .ab-ss-phase { flex: 0 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .ab-status-strip .ab-ss-pct, .ab-status-strip .ab-ss-timer { flex: 0 0 auto; white-space: nowrap; } .ab-status-strip .ab-ss-pct { font-variant-numeric: tabular-nums; font-weight: 700; color: var(--accent); } .ab-status-strip .ab-ss-timer { font-variant-numeric: tabular-nums; color: var(--text-muted); } .ab-status-strip .ab-ss-toggle { color: var(--accent-hover); cursor: pointer; user-select: none; margin-left: 4px; display: none; white-space: nowrap; } .ab-status-strip .ab-ss-toggle:hover { text-decoration: underline; } /* v144：任务计时已移入常驻状态条（.ab-status-strip），此处样式废弃保留以免误删引用 */ .ab-task-timer { display: none; } /* AI 气泡底部元信息（模型名 + 时间，对标 WorkBuddy）— v144 去 emoji 标记，模型图标与输入框一致 */ .ab-msg-meta { display: inline-flex; align-items: center; gap: 6px; font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); font-weight: 400; margin-left: 8px; } .ab-msg-model { display: inline-flex; align-items: center; gap: 3px; } .ab-msg-model .ab-ic { width: 13px; height: 13px; } /* 全局产物入口（两类回复都显示）—— v322 中性灰 + ↗，去绿色文字 */ /* C.101 产物槽三段式：任务产生制品 / 文件变更 / 引用来源 + 查看所有产物入口（固定常显，0 值柔化） */ .ab-msg-artentry { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 8px 0 2px; } .ab-slot { display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; } .ab-slot-seg { display: inline-flex; align-items: center; padding: 2px 9px; border-radius: 999px; background: color-mix(in srgb, var(--accent) 6%, transparent); font-size:calc(12px * var(--ab-fs,1)); color: var(--text-secondary, #555); font-weight: 500; white-space: nowrap; } .ab-slot-seg.is-zero { opacity: .45; } .ab-slot-n { letter-spacing: .2px; } .ab-msg-artentry .ab-art-more { display: inline-flex; align-items: center; gap: 4px; cursor: pointer; font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); font-weight: 500; } .ab-msg-artentry .ab-art-more:hover { color: var(--accent); text-decoration: none; } /* ===== v124 消息底部产物区（无边框 · 一排两格栅格 · 彩色类型图标） ===== */ /* v322 无边框：去虚线分隔与标题行框感，留白分区，消除「一大条一大条」廉价感 */ .ab-msg-artifacts { margin-top: 12px; padding-top: 4px; border-top: none; display: flex; flex-direction: column; gap: 0; } .ab-msg-artifacts-head { align-self: flex-start; font-size:calc(12px * var(--ab-fs,1)); font-weight: 600; color: var(--text-secondary, #555); display: inline-flex; align-items: center; gap: 5px; letter-spacing: .2px; margin-bottom: 7px; padding: 3px 9px; border-radius: 999px; background: color-mix(in srgb, var(--accent) 6%, transparent); } /* v322 一排两格栅格（窄屏回落单列），产物卡按文件类型自带彩色图标 */ .ab-artifact-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; } @media (max-width: 560px) { .ab-artifact-grid { grid-template-columns: 1fr; } } .ab-artifact-item { display: flex; align-items: center; gap: 10px; padding: 13px 15px; border-radius: calc(11px * var(--ab-radius,1)); background: color-mix(in srgb, var(--accent) 6%, transparent); border: none; cursor: pointer; font-size:calc(14px * var(--ab-fs,1)); transition: background .15s, transform .12s, box-shadow .15s; } .ab-artifact-item:hover { background: color-mix(in srgb, var(--accent) 12%, transparent); transform: translateY(-1px); box-shadow: 0 3px 10px color-mix(in srgb, var(--accent) 12%, transparent); } .ab-artifact-item .ab-ic { width: 18px; height: 18px; flex-shrink: 0; color: #6b7280; } .ab-artifact-item .ab-artifact-fic { width: 26px; height: 26px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; } .ab-artifact-item .ab-artifact-fic .ab-ic { width: 22px; height: 22px; } .ab-artifact-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text-primary, #222); font-weight: 600; } .ab-artifact-tool { font-size:calc(12.5px * var(--ab-fs,1)); color: var(--text-secondary, #888); flex-shrink: 0; padding: 2px 8px; border-radius: calc(6px * var(--ab-radius,1)); background: rgba(0,0,0,0.05); } /* v322：绿色粗体「查看 ›」→ 加粗箭头 ↗（产物多了不晃眼，一眼知是打开按钮） */ .ab-artifact-open { font-size:calc(17px * var(--ab-fs,1)); color: var(--text-secondary, #888); flex-shrink: 0; font-weight: 700; line-height: 1; } .ab-artifact-item:hover .ab-artifact-open { color: var(--accent); } /* GW.045 问题①：总览「主文件」卡 —— 排最后，用强调描边 + 「主文件」标签，与分文件一眼区分 */ .ab-artifact-item.ab-artifact-main { background: color-mix(in srgb, var(--accent) 12%, transparent); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 42%, transparent); } .ab-artifact-item.ab-artifact-main .ab-artifact-name { font-weight: 700; } .ab-artifact-tag { flex-shrink: 0; font-size: calc(11px * var(--ab-fs,1)); font-weight: 700; line-height: 1; letter-spacing: .3px; color: var(--accent); background: color-mix(in srgb, var(--accent) 14%, transparent); border: 1px solid color-mix(in srgb, var(--accent) 45%, transparent); padding: 2px 7px; border-radius: 999px; } /* ===== P41 · 512 产物展示专业化 ========================================= ① 生成中占位（虚线 + 游走进度）② 类型筛选条 + 计数 ③ 批量选择 / 下载 / 复制路径 ④ 内联预览（图片 / 视频 / 文首 20 行 / 外链 / 需专用渲染器） 风格沿用：线性描边图标、accent 低饱和、随 var(--ab-fs) 缩放。========= */ .ab-msg-artifacts-head { flex-wrap: wrap; } /* 允许类型筛选条换行到第二行 */ .ab-art-count { font-size: calc(11.5px * var(--ab-fs, 1)); color: var(--text-muted); font-weight: 600; } /* ① 生成中占位 */ .ab-artifact-item.ab-artifact-pending { background: rgba(0, 0, 0, .03); box-shadow: inset 0 0 0 1px var(--border); cursor: default; } .ab-artifact-item.ab-artifact-pending:hover { transform: none; box-shadow: inset 0 0 0 1px var(--border); } .ab-art-prog { position: relative; width: 58px; height: 3px; flex-shrink: 0; border-radius: 999px; overflow: hidden; background: color-mix(in srgb, var(--accent) 14%, transparent); } .ab-art-prog i { position: absolute; top: 0; bottom: 0; width: 40%; border-radius: 999px; background: var(--accent); animation: abArtProg 1.15s ease-in-out infinite; } @keyframes abArtProg { 0% { left: -45%; } 100% { left: 100%; } } /* ② 选择框（默认低调，hover 显形，选中反色） */ .ab-art-sel { width: 16px; height: 16px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; border: 1.5px solid var(--border); border-radius: 4px; color: transparent; cursor: pointer; transition: background .15s, border-color .15s; } .ab-art-sel .ab-ic { width: 11px; height: 11px; } .ab-artifact-item:hover .ab-art-sel { border-color: color-mix(in srgb, var(--accent) 55%, transparent); } .ab-artifact-item.is-sel .ab-art-sel { background: var(--accent); border-color: var(--accent); } .ab-artifact-item.is-sel .ab-art-sel .ab-ic { color: #fff; } .ab-artifact-item.is-sel { box-shadow: inset 0 0 0 1.5px color-mix(in srgb, var(--accent) 55%, transparent); } /* ② 内联展开三角 */ .ab-art-fold { flex-shrink: 0; padding: 2px 3px; border-radius: 5px; cursor: pointer; font-size: calc(12px * var(--ab-fs, 1)); line-height: 1; color: var(--text-muted); transition: color .15s, background .15s; } .ab-art-fold:hover { color: var(--accent); background: color-mix(in srgb, var(--accent) 10%, transparent); } /* ② 类型筛选条 */ .ab-art-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; width: 100%; margin-top: 1px; } .ab-art-chip { padding: 2px 9px; border: none; border-radius: 999px; cursor: pointer; font-size: calc(11.5px * var(--ab-fs, 1)); font-weight: 600; color: var(--text-secondary, #888); background: rgba(0, 0, 0, .05); transition: color .15s, background .15s; } .ab-art-chip:hover { color: var(--accent); background: color-mix(in srgb, var(--accent) 12%, transparent); } .ab-art-chip.on { color: var(--accent); background: color-mix(in srgb, var(--accent) 20%, transparent); } .ab-artifact-item.is-hidden { display: none; } /* ③ 批量工具条 */ .ab-art-tools { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 9px; } .ab-art-seln { font-size: calc(12px * var(--ab-fs, 1)); color: var(--text-muted); } .ab-art-seln.on { color: var(--accent); font-weight: 600; } .ab-art-tbtn { display: inline-flex; align-items: center; gap: 5px; cursor: pointer; padding: 4px 10px; border-radius: 999px; border: 1px solid var(--border); font-size: calc(12.5px * var(--ab-fs, 1)); color: var(--text-secondary, #888); background: rgba(0, 0, 0, .04); transition: color .15s, border-color .15s, background .15s; } .ab-art-tbtn:hover { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 45%, transparent); background: color-mix(in srgb, var(--accent) 8%, transparent); } .ab-art-tbtn .ab-ic { width: 13px; height: 13px; } /* ④ 内联预览区（占满整行，跟随卡片排序移动） */ .ab-art-inline { grid-column: 1 / -1; margin: -2px 0 4px; padding: 10px 12px; overflow: hidden; border: 1px solid var(--border); border-radius: calc(10px * var(--ab-radius, 1)); background: rgba(0, 0, 0, .04); } .ab-art-il-img { display: block; max-width: 100%; max-height: 260px; border-radius: 8px; cursor: zoom-in; } .ab-art-il-vid { display: block; max-width: 100%; max-height: 280px; border-radius: 8px; } /* GW.218A：语音合成产物内嵌播放器（无画面，限宽即可） */ .ab-art-il-aud { display: block; width: 100%; max-width: 420px; height: calc(38px * var(--ab-fs, 1)); border-radius: 8px; } .ab-art-il-link { font-size: calc(13px * var(--ab-fs, 1)); color: var(--accent); word-break: break-all; } /* 提权到 (0,3,0)：既有的 `.ab-bubble pre { max-height:420px }` 会压过单类名选择器 */ .ab-art-inline pre.ab-art-il-pre { margin: 0; max-height: 220px; overflow: auto; font-family: ui-monospace, Menlo, Consolas, monospace; font-size: calc(12px * var(--ab-fs, 1)); line-height: 1.6; white-space: pre-wrap; word-break: break-word; color: var(--text-primary, #222); } .ab-art-il-more, .ab-art-il-open { margin-top: 8px; padding: 0; border: none; background: none; cursor: pointer; font-size: calc(12.5px * var(--ab-fs, 1)); font-weight: 600; color: var(--accent); } .ab-art-il-tip { display: flex; align-items: center; gap: 8px; font-size: calc(12.5px * var(--ab-fs, 1)); color: var(--text-secondary, #888); } .ab-art-il-tip .ab-ic { width: 15px; height: 15px; } /* ===== P41 · 512 end ===== /* ===== P41fix · 513 产物卡「6 格可视 + 横向滚动 + 右侧动态箭头」+ 彩色文件图标 ===== ① 卡片：浅灰底无边框 + 紧凑单行（彩色文件图标 + 文件名 + 文件大小） ② 网格：行优先 2 列 x 3 行 = 6 个可视，多余列横向延伸 ⇒ 横向滚动（细滚动条） ③ 右侧动态箭头：可滚才显；滚到末尾变「回到开头」（‹）========= */ /* ① 卡片规格：一行搞定 —— 浅灰底 + 无边框 + 圆角；文件名超长省略，尾部固定文件大小 注：本文件后方另有一条 v362「去框化」规则（.ab-artifact-item{background:transparent!important;border-bottom:1px}）， 本轮按老板最新要求（很浅的灰色背景 / 无边框）用更高特异性 + !important 覆盖它。 hover 只改背景、不动 box-shadow，避免吃掉「选中 / 主文件」的强调描边。 */ .ab-msg-artifacts .ab-artifact-item { align-items: center; gap: 9px; padding: 0 10px !important; height: calc(44px * var(--ab-fs, 1)) !important; border: 0 !important; border-bottom: 0 !important; border-radius: calc(9px * var(--ab-radius, 1)) !important; background: rgba(127, 127, 127, .10) !important; } .ab-msg-artifacts .ab-artifact-item:hover { background: rgba(127, 127, 127, .18) !important; } .ab-msg-artifacts .ab-artifact-item .ab-artifact-fic { width: 22px; height: 22px; } .ab-artifact-name { font-weight: 500; } .ab-art-size { flex-shrink: 0; max-width: 92px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: calc(11.5px * var(--ab-fs, 1)); color: var(--text-muted); font-variant-numeric: tabular-nums; } .ab-artifact-item .ab-artifact-tool { max-width: 76px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } @media (max-width: 560px) { .ab-artifact-item .ab-artifact-tool { display: none; } } /* ② 网格：行高固定（行数由 JS 显式 grid-row 决定，最多 3 行）；列宽由 JS 按「每列 = 半宽」下发 */ .ab-artifact-grid { gap: 8px; grid-auto-rows: calc(44px * var(--ab-fs, 1)); align-items: stretch; } /* ② 滚动视口：可视宽度 = 2 列，多余横向滚动（细滚动条，不抢阅读区） */ .ab-art-viewport { position: relative; overflow-x: auto; overflow-y: hidden; scrollbar-width: thin; scrollbar-color: color-mix(in srgb, var(--text-muted) 42%, transparent) transparent; padding: 3px 2px 6px; margin: -3px -2px 0; overscroll-behavior-x: contain; } .ab-art-viewport.has-arrow { padding-right: 30px; } .ab-art-viewport::-webkit-scrollbar { height: 4px; } .ab-art-viewport::-webkit-scrollbar-track { background: transparent; } .ab-art-viewport::-webkit-scrollbar-thumb { background: color-mix(in srgb, var(--text-muted) 38%, transparent); border-radius: 999px; } /* ③ 右侧动态箭头（线性描边圆钮） */ .ab-art-arrow { position: absolute; right: 0; top: calc(50% - 3px); transform: translateY(-50%); width: 26px; height: 26px; display: flex; align-items: center; justify-content: center; border: 1px solid var(--border); border-radius: 50%; background: var(--card-bg, #fff); color: var(--text-secondary, #888); font-size: calc(15px * var(--ab-fs, 1)); line-height: 1; cursor: pointer; box-shadow: 0 2px 8px rgba(0, 0, 0, .12); transition: color .15s, border-color .15s, opacity .15s; z-index: 2; } .ab-art-arrow:hover { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 45%, transparent); } .ab-art-arrow.hidden { display: none; } .ab-art-arrow.is-end { opacity: .72; } /* ===== P41fix · 513 end ===== /* ===== P41fix2 · 514 产物卡补「文件格式后缀」（.md / .png / .html …） ===== ① name 改 flex 容器 —— 主名可省略号截断，扩展名徽标永不被截 ② 徽标：小号加粗弱化色，紧跟主名，视觉上仍是文件名的一部分 ===== */ .ab-artifact-name.ab-art-nm { display: flex; align-items: baseline; gap: 2px; min-width: 0; } .ab-artifact-name.ab-art-nm .ab-art-base { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .ab-artifact-name.ab-art-nm .ab-art-ext { flex: 0 0 auto; font-weight: 700; letter-spacing: .2px; font-size: calc(11.5px * var(--ab-fs, 1)); color: var(--text-secondary, #6b7280); opacity: 1; } :root:not(.ab-light) .ab-artifact-name.ab-art-nm .ab-art-ext { color: #9aa0ae; } /* ===== P41fix2 · 514 end ===== */ /* v125 查看所有产物/变更 汇总链接 */ .ab-msg-artifacts-foot { display: flex; gap: 18px; padding: 6px 2px 2px; } .ab-msg-artifacts-foot .ab-art-more { display: inline-flex; align-items: center; gap: 4px; font-size:calc(13.5px * var(--ab-fs,1)); font-weight: 600; color: var(--accent-hover); cursor: pointer; padding: 4px 2px; border-radius: calc(6px * var(--ab-radius,1)); } .ab-msg-artifacts-foot .ab-art-more:hover { background: color-mix(in srgb, var(--accent) 8%, transparent); } .ab-msg-artifacts-foot .ab-art-more .ab-ic { width: 14px; height: 14px; } .ab-side-empty { padding: 20px 12px; text-align: center; font-size:calc(12px * var(--ab-fs,1)); color: var(--side-muted); } .ab-side-brand { display: flex; align-items: center; gap: 8px; font-size:calc(13px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary); } .ab-side-logo { width: 24px; height: 24px; border-radius: calc(6px * var(--ab-radius,1)); } /* ============ 主题 LOGO 切换（浅色=黑/默认，深色=墨绿） ============ */ /* 通用规则：默认(深色)显示 ab-logo-dark，浅色(.ab-light)显示 ab-logo-light */ .ab-logo-dark { display: inline-block; } .ab-logo-light { display: none; } .ab-light .ab-logo-dark { display: none; } .ab-light .ab-logo-light { display: inline-block; } /* 顶部侧栏 LOGO 包装 */ .ab-side-logo-wrap { display: inline-flex; align-items: center; } /* 聊天头像内的两张 LOGO（铺满圆形头像） */ .ab-avatar-bot .ab-logo-light, .ab-avatar-bot .ab-logo-dark { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; } /* ============ 会话「⋯」操作菜单 ============ */ .ab-session-item { position: relative; } .ab-session-kebab { position: absolute; right: 4px; top: 50%; transform: translateY(-50%); border: none; background: none; color: var(--side-muted); cursor: pointer; padding: 3px; border-radius: calc(5px * var(--ab-radius,1)); line-height: 1; display: flex; opacity: 0; flex-shrink: 0; } .ab-session-item:hover .ab-session-kebab { opacity: 1; } .ab-session-kebab:hover { background: var(--side-hover); color: var(--side-text-strong); } .ab-session-kebab .ab-ic { width: 15px; height: 15px; } .ab-session-pinned .ab-session-text { font-weight: 600; } /* 弹出的操作菜单（fixed，由 JS 定位） */ .ab-sess-menu { min-width: 150px; background: var(--bg-primary); border: 1px solid var(--border); border-radius: calc(10px * var(--ab-radius,1)); box-shadow: 0 8px 24px rgba(0,0,0,0.15); z-index: 300; overflow: hidden; padding: 4px; } .ab-sess-menu-item { display: flex; align-items: center; gap: 8px; padding: 8px 10px; font-size:calc(13px * var(--ab-fs,1)); color: var(--text-secondary); border-radius: calc(7px * var(--ab-radius,1)); cursor: pointer; } .ab-sess-menu-item .ab-ic { width: 14px; height: 14px; flex-shrink: 0; } .ab-sess-menu-item:hover { background: var(--bg-hover); color: var(--text-primary); } .ab-sess-menu-danger { color: #c0392b; } .ab-sess-menu-danger:hover { background: rgba(239,68,68,0.10); color: #c0392b; } /* 系统提示词预设面板 */ .ab-prompt-panel { position: absolute; top: 52px; right: 12px; width: 280px; background: var(--bg-primary); border: 1px solid var(--border); border-radius: calc(10px * var(--ab-radius,1)); box-shadow: 0 8px 24px rgba(0,0,0,0.15); z-index: 100; overflow: hidden; } .ab-prompt-panel.hidden { display: none; } .ab-prompt-header { display: flex; align-items: center; justify-content: space-between; padding: 10px 14px; border-bottom: 1px solid var(--border); font-size:calc(13px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary); } .ab-prompt-close { border: none; background: none; color: var(--text-muted); cursor: pointer; font-size:calc(14px * var(--ab-fs,1)); } .ab-prompt-close:hover { color: var(--text-primary); } .ab-prompt-list { max-height: 320px; overflow-y: auto; } .ab-prompt-item { padding: 10px 14px; border-bottom: 1px solid var(--border); cursor: pointer; transition: background 0.12s; } .ab-prompt-item:last-child { border-bottom: none; } .ab-prompt-item:hover { background: var(--bg-hover); } .ab-prompt-item-name { font-size:calc(13px * var(--ab-fs,1)); font-weight: 500; color: var(--text-primary); margin-bottom: 3px; } .ab-prompt-item-desc { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); line-height: 1.4; } .ab-prompt-item.ab-prompt-active { background: var(--accent-light); } .ab-prompt-item.ab-prompt-active .ab-prompt-item-name { color: var(--accent); } /* 导出按钮 */ .ab-export-btn { border: none; background: none; color: var(--text-muted); cursor: pointer; font-size:calc(13px * var(--ab-fs,1)); padding: 0 4px; flex-shrink: 0; } .ab-export-btn:hover { color: var(--accent); } /* ========== 模型切换（Open WebUI 风格下拉） ========== */ .ab-model { position: relative; display: flex; align-items: center; gap: 7px; padding: 6px 12px; background: var(--bg-tertiary); border: 1px solid var(--border); border-radius: calc(8px * var(--ab-radius,1)); cursor: pointer; font-size:calc(13px * var(--ab-fs,1)); color: var(--text-primary); user-select: none; } .ab-model:hover { background: var(--bg-hover); } .ab-model-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--success); flex-shrink: 0; } .ab-model-name { max-width: 200px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .ab-model-caret { color: var(--text-muted); font-size:calc(11px * var(--ab-fs,1)); } .ab-model-menu { display: none; /* 定位由 JS 按模型按钮 fixed 接管，此处只放外观 */ min-width: 280px; max-width: 320px; max-height: 320px; overflow-y: auto; background: var(--bg-secondary); border: 1px solid var(--border); border-radius: calc(8px * var(--ab-radius,1)); box-shadow: var(--shadow); z-index: 200; } .ab-model-menu.ab-model-open { display: block; } .ab-model.ab-model-open .ab-model-menu { display: block; } .ab-model-item { padding: 9px 12px; font-size:calc(13px * var(--ab-fs,1)); color: var(--text-secondary); cursor: pointer; white-space: nowrap; display: flex; align-items: center; gap: 8px; } .ab-model-item:hover { background: var(--bg-hover); color: var(--text-primary); } .ab-model-item.ab-model-active { color: var(--text-primary); } /* GW.187e【2026-10-26 19:28 老板令】被选中的图像模型 / 视频模型要在列表里「背景常亮」： 客户下次打开列表一眼看出上次挑的是哪个；切到哪个，哪个常亮。 只圈 .ab-media-pick（智能多媒体的模型行），不改变普通对话模型列表的观感。 */ .ab-model-item.ab-media-pick.ab-model-active { background: color-mix(in srgb, var(--accent) 13%, transparent); box-shadow: inset 3px 0 0 var(--accent); } /* GW.187g【2026-10-26 21:10 老板令】选中态不再加粗 —— 老板原话「字体不要粗体，正常细体即可」， 识别改成「当前」标签 + 线路胶囊虚线边框 ⇒ 这里把原来的 font-weight:600 撤销掉。 */ .ab-model-item.ab-media-pick.ab-model-active .ab-model-name { font-weight: 400; } /* 「当前」标签：跟在被选中模型的名字后面，小号细体、品牌色淡底，客户一眼看出上次选的是哪个 */ .ab-cur-tag { margin-left: 6px; padding: 0 5px; height: 15px; line-height: 15px; display: inline-block; border-radius: calc(4px * var(--ab-radius, 1)); background: color-mix(in srgb, var(--accent) 14%, transparent); color: var(--accent); font-size: calc(10px * var(--ab-fs, 1)); font-weight: 400; vertical-align: middle; white-space: nowrap; } .ab-model-item.ab-media-pick.ab-model-active:hover { background: color-mix(in srgb, var(--accent) 19%, transparent); } .ab-model-brand { width: 16px; height: 16px; border-radius: calc(4px * var(--ab-radius,1)); flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; font-size:calc(10px * var(--ab-fs,1)); font-weight: 700; color: #fff; } /* 模型品牌 SVG 图标（内联 SVG，非外部文件） */ .ab-model-logo { width: 20px; height: 20px; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; vertical-align: middle; } .ab-model-logo svg { width: 18px; height: 18px; } .ab-model-divider { height: 1px; background: var(--border); margin: 4px 0; } .ab-model-custom { color: var(--accent); font-weight: 500; } .ab-model-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; } /* ========== 权限菜单（定位由 JS anchorPopup 用 fixed 贴按钮上方） ========== */ .ab-perm-menu { min-width: 320px; max-width: 380px; background: var(--bg-secondary); border: 1px solid var(--border); border-radius: calc(10px * var(--ab-radius,1)); box-shadow: var(--shadow); z-index: 200; overflow: hidden; padding: 4px; } .ab-perm-menu.hidden { display: none; } .ab-perm-item { padding: 10px 12px; border-radius: calc(8px * var(--ab-radius,1)); cursor: pointer; } .ab-perm-item:hover { background: var(--bg-hover); } .ab-perm-item.ab-perm-on { background: var(--accent-light); } .ab-perm-name { font-size:calc(13px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary); display: flex; align-items: center; gap: 6px; } .ab-perm-desc { font-size:calc(11.5px * var(--ab-fs,1)); color: var(--text-muted); margin-top: 3px; line-height: 1.4; } .ab-chip.ab-chip-perm-full { border-color: #d97757; color: #b5482a; background: rgba(217,119,87,0.08); } .ab-model-tag { margin-left: 6px; padding: 1px 6px; background: var(--accent-light); color: var(--accent); border-radius: calc(6px * var(--ab-radius,1)); font-size:calc(10px * var(--ab-fs,1)); } /* 模型行右侧标记区：当前/免费使用/倍率，整体右对齐 */ .ab-model-side { margin-left: auto; display: inline-flex; align-items: center; gap: 8px; flex-shrink: 0; padding-left: 8px; } /* 限时免费：绿色细体，不加粗 */ .ab-model-free { color: var(--accent); font-size:calc(11px * var(--ab-fs,1)); font-weight: 400; white-space: nowrap; } /* 倍率：灰色（后续加付费模型时改这个值即可） */ .ab-model-rate { color: var(--text-muted); font-size:calc(11px * var(--ab-fs,1)); font-family: Consolas, 'Courier New', monospace; white-space: nowrap; } /* 当前标签挪进 side 区后去掉多余左间距 */ .ab-model-side .ab-model-tag { margin-left: 0; } /* ===== v175 全部模型折叠区 ===== */ .ab-model-alltoggle { cursor: pointer; } .ab-model-allcnt { display: inline-block; min-width: 18px; padding: 0 5px; margin-left: 4px; background: var(--accent); color: #fff; border-radius: calc(9px * var(--ab-radius,1)); font-size:calc(10.5px * var(--ab-fs,1)); text-align: center; line-height: 16px; } .ab-model-allarrow { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); } .ab-model-allwrap { display: flex; flex-direction: column; } .ab-model-allsearch { display: flex; align-items: center; gap: 5px; margin: 4px 8px; padding: 0 8px; background: var(--bg, #f8fafc); border: 1px solid var(--border); border-radius: calc(6px * var(--ab-radius,1)); height: 28px; } .ab-model-allsearch:focus-within { border-color: var(--accent); } .ab-model-allinput { flex: 1; min-width: 0; background: transparent; border: none; outline: none; font-size:calc(12px * var(--ab-fs,1)); color: var(--text); height: 100%; } .ab-model-alllist { max-height: 260px; overflow-y: auto; } .ab-model-allempty { padding: 14px; text-align: center; font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); } .ab-model-rate-paid { color: #f59e0b; font-size:calc(10px * var(--ab-fs,1)); border: 1px solid #f59e0b44; border-radius: calc(4px * var(--ab-radius,1)); padding: 0 3px; } /* ===== GW.171【2026-10-25】视频按秒计价的「元/秒」价格 + 暗红「夜间折扣」标签 ===== */ .ab-model-price { color: var(--text-primary); font-size:calc(11.5px * var(--ab-fs,1)); font-family: Consolas, 'Courier New', monospace; white-space: nowrap; } .ab-model-price em { font-style: normal; font-size:calc(10px * var(--ab-fs,1)); color: var(--text-muted); margin-left: 1px; } /* 夜间折扣：暗红色线性细标签（默认深色主题） */ .ab-night-tag { color: #e05a5a; font-size:calc(10px * var(--ab-fs,1)); line-height: 15px; padding: 0 4px; border: 1px solid rgba(224, 90, 90, .38); border-radius: calc(3px * var(--ab-radius,1)); background: rgba(224, 90, 90, .10); white-space: nowrap; cursor: pointer; user-select: none; } .ab-night-tag:hover { color: #ff6b6b; border-color: rgba(224, 90, 90, .72); background: rgba(224, 90, 90, .18); } /* 浅色主题压深一档，保证白底对比度（warm 同属浅色系，一并生效） */ :root.ab-light .ab-night-tag { color: #a3261e; border-color: rgba(163, 38, 30, .32); background: rgba(163, 38, 30, .07); } :root.ab-light .ab-night-tag:hover { color: #7d1a14; border-color: rgba(163, 38, 30, .62); background: rgba(163, 38, 30, .13); } /* 夜间折扣说明卡（点标签弹出，点空白关闭） */ .ab-night-card { position: fixed; z-index: 99999; /* FE.009：宽度按内容自适应（原来写死 300px 会把「MiniMax H3（1080P）」挤折行） */ width: auto; min-width: 336px; max-width: min(560px, calc(100vw - 24px)); box-sizing: border-box; padding: 12px 13px 10px; background: var(--bg-secondary, #12141f); border: 1px solid var(--border, rgba(34,197,94,.15)); border-radius: calc(10px * var(--ab-radius,1)); box-shadow: var(--shadow, 0 4px 20px rgba(0,0,0,.5)); color: var(--text, #c6c9d4); animation: abNightIn .14s ease-out; } @keyframes abNightIn { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } } .ab-night-head { display: flex; align-items: center; gap: 6px; font-size:calc(13px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary, #e0e0e0); } .ab-night-head svg { width: 15px; height: 15px; color: #e05a5a; flex-shrink: 0; } .ab-night-sub { margin: 7px 0 8px; font-size:calc(11.5px * var(--ab-fs,1)); color: var(--text-secondary, #a9adc4); line-height: 1.6; white-space: nowrap; } .ab-night-sub b { color: #e05a5a; font-weight: 600; } .ab-night-table { width: auto; min-width: 100%; border-collapse: collapse; font-size:calc(11px * var(--ab-fs,1)); white-space: nowrap; } .ab-night-table th, .ab-night-table td { padding: 5px 6px; text-align: center; border-bottom: 1px solid var(--border, rgba(34,197,94,.15)); } .ab-night-table th:first-child, .ab-night-table td:first-child { text-align: left; } .ab-night-table thead th { color: var(--text-muted, #8a8aa8); font-weight: 500; font-size:calc(10.5px * var(--ab-fs,1)); background: var(--bg-tertiary, #1a1c2a); } .ab-night-table tbody tr:nth-child(even) td { background: rgba(128,128,128,.05); } .ab-night-table tbody td:nth-child(2) { color: var(--text-secondary, #a9adc4); font-family: Consolas, 'Courier New', monospace; } .ab-night-table tbody td:nth-child(3) { color: #e05a5a; font-family: Consolas, 'Courier New', monospace; font-weight: 600; } .ab-night-foot { margin-top: 8px; font-size:calc(10px * var(--ab-fs,1)); color: var(--text-muted, #8a8aa8); line-height: 1.5; white-space: nowrap; } :root.ab-light .ab-night-table tbody td:nth-child(3) { color: #a3261e; } :root.ab-light .ab-night-head svg { color: #a3261e; } :root.ab-light .ab-night-sub b { color: #a3261e; } /* ===== 付费精选分组：家族小标题 + 付费/倍率/促销标签（线性描边风格，不实心大色块） ===== */ .ab-model-fam { font-size:calc(11px * var(--ab-fs,1)); font-weight: 600; letter-spacing: .04em; color: var(--text-muted); padding: 8px 10px 4px; border-top: 1px dashed rgba(148,163,184,.28); margin-top: 2px; } .ab-model-fam:first-child { border-top: none; margin-top: 0; } .ab-model-paid { /* 付费标识 */ display: inline-block; font-size:calc(10px * var(--ab-fs,1)); line-height: 1; padding: 2px 5px; border: 1px solid #f59e0b; color: #f59e0b; border-radius: calc(4px * var(--ab-radius,1)); margin-left: 4px; } .ab-model-mul { /* 倍率标识（付费精选具体倍率，如 0.01x） */ display: inline-block; font-size:calc(10px * var(--ab-fs,1)); line-height: 1; padding: 2px 5px; border: 1px solid #fbbf24; color: #b45309; background: #fef3c7; border-radius: calc(4px * var(--ab-radius,1)); margin-left: 4px; } .ab-model-promo { /* 促销标识：热门 / 夜间折扣 / 限时低价 / 视觉版 / 高速 / 新上 */ display: inline-block; font-size:calc(10px * var(--ab-fs,1)); line-height: 1; padding: 2px 5px; border: 1px solid #a78bfa; color: #6d28d9; background: #ede9fe; border-radius: calc(4px * var(--ab-radius,1)); margin-left: 4px; } .ab-model-proxy { /* 国际版模型：需代理可用（橙色调，区别于绿色促销标） */ display: inline-block; font-size:calc(10px * var(--ab-fs,1)); line-height: 1; padding: 2px 5px; border: 1px solid #fb923c; color: #c2410c; background: #ffedd5; border-radius: calc(4px * var(--ab-radius,1)); margin-left: 6px; } .ab-mtip-proxy { /* hover 介绍卡里的「接代理可用」提示 */ display: inline-block; font-size:calc(11px * var(--ab-fs,1)); line-height: 1; padding: 2px 6px; border: 1px solid #fb923c; color: #c2410c; background: #ffedd5; border-radius: calc(4px * var(--ab-radius,1)); margin-left: 6px; vertical-align: middle; } /* ========== 顶部栏（可拖动区：拖动抽屉=拖动客户端整体） ========== */ .ab-header { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 16px; background: var(--bg-secondary); border-bottom: 1px solid var(--border); flex-shrink: 0; -webkit-app-region: drag; /* frame:false 窗口的拖动区 */ } .ab-header button, .ab-header .ab-icon-btn, .ab-header .ab-actions, .ab-header .ab-header-title { -webkit-app-region: no-drag; } .ab-burger { font-size:calc(16px * var(--ab-fs,1)) !important; } .ab-actions { display: flex; gap: 4px; margin-left: auto; } .ab-icon-btn { width: 32px; height: 32px; border: none; background: transparent; color: var(--text-secondary); cursor: pointer; border-radius: calc(6px * var(--ab-radius,1)); font-size:calc(14px * var(--ab-fs,1)); transition: all 0.15s; } .ab-icon-btn:hover { background: var(--bg-hover); color: var(--text-primary); } /* v146 增强提示词按钮：busy 呼吸 */ .ab-enh-busy { animation: abEnhPulse 0.9s ease-in-out infinite; color: var(--accent) !important; } @keyframes abEnhPulse { 0%,100% { opacity: 1; } 50% { opacity: 0.35; } } /* v146 中枢弹层（chip 上方弹出，复用 perm-menu 定位壳） */ .ab-hub-menu { min-width: 280px; max-width: 330px; background: var(--bg-primary); border: 1px solid var(--border); border-radius: calc(12px * var(--ab-radius,1)); box-shadow: 0 12px 40px rgba(0,0,0,.28); padding: 8px; z-index: 9999; } .ab-hub-sec { font-size:calc(11px * var(--ab-fs,1)); font-weight: 600; letter-spacing: .04em; color: var(--text-muted); padding: 8px 10px 4px; text-transform: none; } /* v146 中枢弹层主标题：绿色高亮 */ .ab-hub-sec-hl { color: var(--accent); font-size:calc(12px * var(--ab-fs,1)); padding-top: 6px; } .ab-hub-item { display: flex; align-items: flex-start; gap: 10px; width: 100%; border: none; background: transparent; cursor: pointer; text-align: left; padding: 8px 10px; border-radius: calc(8px * var(--ab-radius,1)); transition: background .15s; } .ab-hub-item:hover { background: var(--bg-hover); } .ab-hub-item .ab-ic { width: 16px; height: 16px; flex-shrink: 0; margin-top: 2px; color: var(--accent); } .ab-hub-item-t { display: flex; flex-direction: column; gap: 2px; min-width: 0; } .ab-hub-item-t b { font-size:calc(13.5px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary); } .ab-hub-item-t i { font-style: normal; font-size:calc(11.5px * var(--ab-fs,1)); color: var(--text-muted); line-height: 1.4; } /* ========== 会话列表 ========== */ .ab-sessions { display: flex; gap: 8px; padding: 10px 16px; background: var(--bg-secondary); border-bottom: 1px solid var(--border); overflow-x: auto; flex-shrink: 0; } .ab-session { padding: 6px 12px; background: var(--bg-tertiary); border: 1px solid var(--border); border-radius: calc(16px * var(--ab-radius,1)); color: var(--text-secondary); cursor: pointer; white-space: nowrap; font-size:calc(13px * var(--ab-fs,1)); transition: all 0.15s; } .ab-session:hover { background: var(--bg-hover); } .ab-session-active { background: var(--accent-light); border-color: var(--accent); color: var(--accent); } /* ========== 消息流 ========== */ .ab-messages { flex: 1; overflow-y: auto; padding: 20px 16px; scroll-behavior: smooth; display: flex; flex-direction: column; } /* 空会话时欢迎区贴底，与下方输入区挨在一起整体垂直居中 */ .ab-messages:has(> .ab-welcome2:only-child) { justify-content: flex-end; } .ab-messages > .ab-welcome2:only-child { padding-bottom: 2vh; } .ab-messages::-webkit-scrollbar { width: 6px; } .ab-messages::-webkit-scrollbar-track { background: transparent; } .ab-messages::-webkit-scrollbar-thumb { background: var(--border); border-radius: calc(3px * var(--ab-radius,1)); } /* 欢迎卡片 */ .ab-welcome2 { width: 100%; } .ab-welcome { text-align: center; padding: 40px 20px; color: var(--text-secondary); } .ab-welcome h2 { font-size:calc(22px * var(--ab-fs,1)); margin-bottom: 12px; color: var(--text-primary); } .ab-welcome p { font-size:calc(14px * var(--ab-fs,1)); margin-bottom: 24px; } .ab-tips { display: flex; flex-direction: column; gap: 8px; max-width: 360px; margin: 0 auto; } .ab-tip { padding: 10px 14px; background: var(--bg-secondary); border: 1px solid var(--border); border-radius: calc(10px * var(--ab-radius,1)); font-size:calc(13px * var(--ab-fs,1)); cursor: pointer; transition: all 0.15s; text-align: left; } .ab-tip:hover { background: var(--accent-light); border-color: var(--accent); color: var(--accent); } /* 消息气泡 */ .ab-msg { display: flex; gap: 10px; margin-bottom: 16px; animation: fadeIn 0.2s ease-out; width: 100%; } @keyframes fadeIn { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } } .ab-msg-user { flex-direction: row-reverse; } .ab-avatar { width: 32px; height: 32px; border-radius: 50%; flex-shrink: 0; display: flex; align-items: center; justify-content: center; font-size:calc(16px * var(--ab-fs,1)); } .ab-avatar-bot { background: transparent; overflow: hidden; } .ab-avatar-user { background: var(--bg-tertiary); color: var(--text-secondary); overflow: hidden; } .ab-avatar-user img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; } .ab-bubble { max-width: 100%; padding: 10px 14px; border-radius: calc(12px * var(--ab-radius,1)); word-wrap: break-word; white-space: pre-wrap; } /* 图像生成消息内嵌图片 */ .ab-bubble-img { display: block; max-width: 320px; width: 100%; border-radius: calc(10px * var(--ab-radius,1)); margin-top: 8px; border: 1px solid var(--border); cursor: zoom-in; } /* 视频生成消息内嵌视频（P16 视频真通道 v389） */ .ab-bubble-video { display: block; max-width: 420px; width: 100%; border-radius: calc(10px * var(--ab-radius,1)); margin-top: 8px; border: 1px solid var(--border); background: #000; } /* GW.218A 音频生成消息内嵌播放器（TTS 出 audio/mpeg，直连 data URL 播放） 宽度比视频窄一档（语音没有画面，全宽会显得空），高度由原生控件决定。 */ .ab-bubble-audio { display: block; width: 300px; max-width: 100%; height: calc(36px * var(--ab-fs, 1)); margin-top: 8px; border-radius: calc(10px * var(--ab-radius,1)); border: 1px solid var(--border); background: var(--panel, #f7f7f8); } /* 音频没有「放大查看」⇒ 动作条只剩下载按钮，位置仍贴右上角（播放器右侧留白处） */ .ab-bubble-media-audio .ab-bubble-media-act { top: calc(-30px * var(--ab-fs, 1)); } /* ===== C.94【2026-10-19 老板令】气泡内媒体「放大 + 下载」动作条 ===== 原缺陷：生图结果只塞了一个裸 ，CSS 写了 cursor:zoom-in 却没人接点击，也没有任何下载入口。 现在统一包一层 .ab-bubble-media，右上角【常显】两个线性图标按钮（⤢ 放大 / ⤓ 下载）， 点图本体同样进大图浮层。常显而非 hover 才显 —— 老板明确「图片上要有下载按钮图标」。 */ .ab-bubble-media { position: relative; display: inline-block; max-width: 100%; margin-top: 8px; line-height: 0; } .ab-bubble-media .ab-bubble-img, .ab-bubble-media .ab-bubble-video, .ab-bubble-media .ab-bubble-audio { margin-top: 0; } .ab-bubble-media-act { position: absolute; right: calc(6px * var(--ab-fs, 1)); top: calc(6px * var(--ab-fs, 1)); display: inline-flex; gap: calc(4px * var(--ab-fs, 1)); z-index: 2; } .ab-bubble-media-btn { display: inline-flex; align-items: center; justify-content: center; width: calc(24px * var(--ab-fs, 1)); height: calc(24px * var(--ab-fs, 1)); border-radius: calc(6px * var(--ab-radius, 1)); background: rgba(0, 0, 0, .52); border: 1px solid rgba(255, 255, 255, .22); color: #fff; cursor: pointer; line-height: 0; transition: background .15s ease, transform .15s ease, opacity .15s ease; } .ab-bubble-media-btn:hover { background: rgba(0, 0, 0, .74); transform: translateY(-1px); } .ab-bubble-media-btn:active { transform: translateY(0); } .ab-bubble-media-btn svg.ab-ic { width: calc(13px * var(--ab-fs, 1)); height: calc(13px * var(--ab-fs, 1)); pointer-events: none; } .ab-bubble-user { background: var(--user-bubble); color: var(--accent); /* 深绿文字，配浅绿底 */ } /* AI 消息品牌标识（头像右侧粗体 AutoBuddy） */ .ab-msg-brand { font-size:calc(14px * var(--ab-fs,1)); font-weight: 700; color: var(--text-primary); margin-bottom: 6px; letter-spacing: 0.5px; } .ab-bubble-bot { background: var(--bot-bubble); color: var(--text-primary); } .ab-bubble-tool { background: var(--accent-light); border: 1px solid var(--accent); color: var(--accent); font-family: 'Consolas', 'Monaco', monospace; font-size:calc(12px * var(--ab-fs,1)); } /* 流式输出光标（精准到正文文本容器，不跟随产物卡） */ .ab-bubble-text.ab-streaming::after, .ab-streaming > .ab-bubble-text::after { content: '▍'; animation: blink 1s infinite; color: var(--accent); font-weight: 400; margin-left: 1px; } @keyframes blink { 0%, 50% { opacity: 1; } 51%, 100% { opacity: 0; } } /* ========== 快捷按钮栏（已废弃：欢迎区取代） ========== */ /* ========== 状态栏 ========== */ .ab-status { padding: 4px 16px; background: var(--bg-primary); border-top: 1px solid var(--border); font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); text-align: right; flex-shrink: 0; } .ab-status.ab-status-busy { color: var(--warn); } .ab-status.ab-status-error { color: var(--error); } .ab-status.ab-status-success { color: var(--accent); } .ab-status.ab-status-warn { color: var(--warn); } /* P2-①：授权即将到期提醒 */ /* AI 生成内容提示（行业标准，常驻底部，不刺眼） */ .ab-ai-notice { padding: 5px 16px 8px; background: var(--bg-primary); font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); text-align: center; opacity: 0.85; flex-shrink: 0; letter-spacing: 0.2px; user-select: none; } /* ===== [C.97 2026-10-20 老板令] 底栏三行并一行：左（消耗/剩余次数）｜中（AI 标识）｜右（实时状态）===== 原来 #status（26px）＋ .ab-ai-notice（31px）＋ 输入框下方 #abCostHint（20px）各占一行，合计约 77px； 合并后单行约 24px，再压输入区底部留白，回复区实收约 67px。 */ .ab-footbar { display: flex; align-items: center; gap: 10px; padding: 3px 16px 4px; background: var(--bg-primary); border-top: 1px solid var(--border); font-size: calc(11px * var(--ab-fs,1)); color: var(--text-muted); flex-shrink: 0; line-height: 1.35; font-weight: 400; /* [C.98] 老板令：三块统一正常字重，禁止加粗 */ } .ab-footbar > .ab-foot-l { flex: 0 1 auto; min-width: 0; max-width: 38%; margin: 0; padding: 0; text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; opacity: 1; } .ab-footbar > .ab-foot-c { flex: 1 1 auto; min-width: 0; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; opacity: .8; letter-spacing: .2px; } .ab-footbar > .ab-status { flex: 0 1 auto; min-width: 0; max-width: 38%; margin: 0; /* [C.98] 右侧让出 26px：给固定定位的版本徽标 #abVerBadge(right:6px) 留位， 否则「模型服务未连接」这类长状态会压到版本号上（实测横向重叠 10px）。 */ padding: 0 26px 0 0; background: none; border: none; text-align: right; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } /* [C.97] 未登录态：左右两块统一走主题色（提醒客户可用次数）；登录客户与桌面端不加此类，保持原灰字 */ .ab-footbar.ab-foot-anon > .ab-foot-l { color: var(--accent); } /* [C.98] 去粗体，保留主题色 */ .ab-footbar.ab-foot-anon > .ab-status:not(.ab-status-busy):not(.ab-status-error):not(.ab-status-warn) { color: var(--accent); } /* [C.98] 去粗体，语义色仍优先 */ /* [C.97] 底栏变矮后窄屏保底：中间 AI 标识优先让位，左右两块保证完整 */ @media (max-width: 560px) { .ab-footbar { gap: 6px; padding: 3px 10px 4px; } .ab-footbar > .ab-foot-c { display: none; } } /* ========== 移动端适配（小窗体） ========== */ @media (max-width: 400px) { .ab-bubble { max-width: 85%; } .ab-quick-label { font-size:calc(11px * var(--ab-fs,1)); } } /* ========== 手机端适配（≤768px） ========== */ @media (max-width: 768px) { /* v105: 侧边栏固定浮层，collapsed 缩成 36px 窄图标栏（margin-left:0 不移动，直接缩窄） */ .ab-sidebar { position: fixed; left: 0; top: 0; bottom: 0; z-index: 200; margin-left: 0; width: 36px; transition: width 0.25s ease; box-shadow: 4px 0 24px rgba(0,0,0,0.15); } .ab-sidebar:not(.ab-sidebar-collapsed) { width: 252px; } /* v105: 主内容 margin-left:36px 给窄图标栏让位，展开时浮层覆盖 */ .ab-main { width: 100%; margin-left: 36px; } /* 遮罩层：点击关闭侧边栏 */ .ab-side-mask { position: fixed; inset: 0; z-index: 199; background: rgba(0,0,0,0.35); display: none; } .ab-side-mask.ab-mask-show { display: block; } /* 欢迎页 6 部门胶囊：缩小间距+字号，允许横滚 */ .ab-welcome2 { padding: 4px 8px 12px; align-items: stretch; } .ab-w2-title-wrap, .ab-w2-subtitle { text-align: center; } .ab-w2-modes { overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; max-width: 100%; width: 100%; padding: 4px; justify-content: flex-start; align-self: stretch; box-sizing: border-box; } .ab-w2-modes::-webkit-scrollbar { display: none; } /* v106: 手机端胶囊极限紧凑——8px 字 + 3px padding，6 按钮总宽 ~290px，327px 可用宽度内全可见 */ .ab-w2-mode { padding: 3px 4px; font-size:calc(8px * var(--ab-fs,1)); gap: 0; flex-shrink: 0; min-width: 0; white-space: nowrap; letter-spacing: -0.2px; } .ab-w2-mode .ab-ic { display: none; } /* 手机端标题缩小，腾空间给胶囊 */ .ab-w2-title { font-size:calc(24px * var(--ab-fs,1)) !important; } .ab-w2-subtitle { font-size:calc(11px * var(--ab-fs,1)) !important; margin-bottom: 6px !important; } /* 快捷标签条也可横滚 */ .ab-hotbar-track { overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; } .ab-hotbar-track::-webkit-scrollbar { display: none; } /* 输入框适配 */ .ab-inputzone-center { padding: 0 10px 4vh; } } /* ========== Markdown 渲染（消息气泡内） ========== */ .ab-bubble h1, .ab-bubble h2, .ab-bubble h3, .ab-bubble h4 { margin: 12px 0 6px; font-weight: 700; line-height: 1.3; color: var(--text-primary); } .ab-bubble h1 { font-size:calc(18px * var(--ab-fs,1)); } .ab-bubble h2 { font-size:calc(16px * var(--ab-fs,1)); } .ab-bubble h3 { font-size:calc(15px * var(--ab-fs,1)); } .ab-bubble h4 { font-size:calc(14px * var(--ab-fs,1)); } .ab-bubble p { margin: 6px 0; } .ab-bubble ul, .ab-bubble ol { margin: 6px 0; padding-left: 22px; } .ab-bubble li { margin: 3px 0; } .ab-bubble code { background: var(--bg-tertiary); padding: 2px 6px; border-radius: calc(4px * var(--ab-radius,1)); font-family: 'Cascadia Code', Consolas, 'Courier New', monospace; font-size:calc(12.5px * var(--ab-fs,1)); color: var(--accent-hover); } .ab-bubble pre { background: var(--bg-tertiary); border: 1px solid var(--border); border-radius: calc(8px * var(--ab-radius,1)); padding: 10px 12px; margin: 8px 0; overflow-x: auto; } .ab-bubble pre code { background: none; padding: 0; color: var(--text-primary); font-size:calc(12.5px * var(--ab-fs,1)); line-height: 1.5; } /* 代码块独立复制按钮（P0-2） */ .ab-code-wrap { position: relative; } .ab-code-copy { position: absolute; top: 6px; right: 6px; font-size:calc(11px * var(--ab-fs,1)); padding: 2px 8px; border-radius: calc(6px * var(--ab-radius,1)); background: var(--card-bg, rgba(255,255,255,0.85)); border: 1px solid var(--border, rgba(0,0,0,0.12)); color: var(--text-secondary, #555); cursor: pointer; opacity: 0; transition: opacity .15s; z-index: 2; } .ab-bubble pre:hover .ab-code-copy, .ab-code-wrap:hover .ab-code-copy { opacity: 1; } .ab-code-copy:hover { background: var(--accent); color: #fff; border-color: var(--accent); } /* 工具调用参数折叠（P0-4） */ .ab-wstep-args { margin: 4px 0 2px 21px; font-size:calc(11.5px * var(--ab-fs,1)); color: var(--text-secondary, #666); } .ab-wstep-args summary { cursor: pointer; color: var(--accent-hover); user-select: none; font-size:calc(11px * var(--ab-fs,1)); outline: none; } .ab-wstep-args pre { margin: 4px 0 0; padding: 7px 9px; border-radius: calc(7px * var(--ab-radius,1)); background: var(--bg-tertiary, rgba(0,0,0,0.04)); border: 1px solid var(--border, rgba(0,0,0,0.1)); overflow-x: auto; font-size:calc(11px * var(--ab-fs,1)); line-height: 1.45; white-space: pre-wrap; word-break: break-word; } /* Agent 时间线（P1 轻量版） */ .ab-timeline { margin: 2px 0 8px; padding-left: 16px; border-left: 2px solid color-mix(in srgb, var(--accent) 25%, transparent); display: flex; flex-direction: column; gap: 7px; } .ab-tl-node { position: relative; padding: 2px 0 2px 4px; font-size:calc(12.5px * var(--ab-fs,1)); color: var(--text-secondary, #555); } .ab-tl-node::before { content: ''; position: absolute; left: -21px; top: 6px; width: 8px; height: 8px; border-radius: 50%; background: var(--accent); border: 2px solid var(--card-bg, #fff); } .ab-tl-node.tl-think::before { background: #94a3b8; } .ab-tl-node.tl-tool::before { background: var(--accent); } .ab-tl-node.tl-result::before { background: #3b82f6; } .ab-tl-node.tl-err::before { background: #ef4444; } .ab-tl-node.tl-info::before { background: #8b5cf6; } /* P2-④：授权/跳过类提示 */ /* v306 P9c：容错事件（退避重试 / 自动切换模型）—— 让编排容错过程可见而非静默 */ .ab-tl-node.tl-retry::before { background: #f59e0b; } .ab-tl-node.tl-retry .ab-tl-head { color: #f59e0b; } .ab-tl-node.tl-switch::before { background: var(--accent); } .ab-tl-node.tl-switch .ab-tl-head { color: var(--accent); } .ab-tl-head { display: flex; align-items: center; gap: 6px; font-weight: 600; color: var(--text-primary); } .ab-tl-time { font-size:calc(10.5px * var(--ab-fs,1)); color: var(--text-muted); font-weight: 400; } .ab-tl-detail { margin-top: 2px; font-size:calc(11.5px * var(--ab-fs,1)); color: var(--text-secondary, #666); } .ab-tl-toggle { margin: 2px 0 10px 0; font-size:calc(11.5px * var(--ab-fs,1)); color: var(--accent-hover); cursor: pointer; user-select: none; display: inline-block; } .ab-tl-toggle:hover { text-decoration: underline; } /* 富交互卡片（P1 轻量版） */ .ab-rcard { margin: 8px 0; border: 1px solid var(--border, rgba(0,0,0,0.1)); border-radius: calc(11px * var(--ab-radius,1)); overflow: hidden; background: var(--card-bg, #fff); } .ab-rcard-head { display: flex; align-items: center; gap: 8px; padding: 9px 13px; font-weight: 700; font-size:calc(13.5px * var(--ab-fs,1)); color: var(--text-primary); background: var(--bg-tertiary, rgba(0,0,0,0.03)); border-bottom: 1px solid var(--border, rgba(0,0,0,0.08)); } .ab-rcard-body { padding: 10px 13px; } .ab-msg-richcards { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin: 6px 0; } .ab-msg-richcards > .ab-rcard { grid-column: 1 / -1; } /* ===== P1fix · C.214 链接卡「3 列 × 2 行 + 右侧箭头横向滚动」 ===== 老板 2026-10-31：十几张「打开链接」纵向堆满回复区、且只有裸 URL 看不出用途。 ① 卡片压扁为两行：关键词（主）+ 域名（次），高 38px ② 视口限两行、3 列 = 6 个可视；第 7 个起向右延伸，横向滚动（细滚动条） ③ 右侧动态箭头：可滚才显；滚到末尾变「回到开头」（‹）—— 复用产物卡 P41fix · 513 范式 */ .ab-rc-viewport { grid-column: 1 / -1; position: relative; overflow-x: auto; overflow-y: hidden; scrollbar-width: thin; scrollbar-color: color-mix(in srgb, var(--text-muted) 42%, transparent) transparent; padding: 2px 2px 5px; margin: -2px -2px 0; overscroll-behavior-x: contain; } .ab-rc-viewport.has-arrow { padding-right: 28px; } .ab-rc-viewport::-webkit-scrollbar { height: 4px; } .ab-rc-viewport::-webkit-scrollbar-track { background: transparent; } .ab-rc-viewport::-webkit-scrollbar-thumb { background: color-mix(in srgb, var(--text-muted) 38%, transparent); border-radius: 999px; } .ab-rc-grid { display: grid; gap: 6px; grid-auto-rows: calc(38px * var(--ab-fs,1)); align-items: stretch; } .ab-rc-arrow { position: absolute; right: 0; top: calc(50% - 4px); transform: translateY(-50%); width: 24px; height: 24px; display: flex; align-items: center; justify-content: center; border: 1px solid var(--border); border-radius: 50%; background: var(--card-bg, #fff); color: var(--text-secondary, #888); font-size: calc(14px * var(--ab-fs,1)); line-height: 1; cursor: pointer; box-shadow: 0 2px 8px rgba(0, 0, 0, .12); transition: color .15s, border-color .15s, opacity .15s; z-index: 2; } .ab-rc-arrow:hover { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 45%, transparent); } .ab-rc-arrow.hidden { display: none; } .ab-rc-arrow.is-end { opacity: .72; } /* C.215：句内提到的同一链接 → 换成关键词文字（句子保留，不再出现第二遍网址） */ .ab-rc-inline-kw { color: var(--accent); font-weight: 500; } .ab-rcard-link { display: flex; flex-direction: column; justify-content: center; gap: 1px; padding: 0 9px; height: 100%; min-width: 0; border: none; border-radius: calc(7px * var(--ab-radius,1)); margin: 0; background: var(--bg-tertiary, rgba(0,0,0,0.03)); text-decoration: none; color: var(--text-primary); transition: background .15s; overflow: hidden; } .ab-rcard-link:hover { background: var(--accent-light); } .ab-rcard-link .ab-rc-kw { font-size: calc(12px * var(--ab-fs,1)); font-weight: 600; line-height: 1.25; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .ab-rcard-link .ab-rc-host { font-size: calc(10.5px * var(--ab-fs,1)); color: var(--text-muted); line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .ab-rcard-link .ab-rc-url { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .ab-rcard-rows { display: flex; flex-direction: column; gap: 5px; } .ab-rcard-row { display: flex; gap: 8px; font-size:calc(12.5px * var(--ab-fs,1)); } .ab-rcard-row .k { color: var(--text-muted); min-width: 64px; flex-shrink: 0; } .ab-rcard-row .v { color: var(--text-primary); flex: 1; } .ab-bubble blockquote { border-left: 3px solid var(--accent); padding: 2px 12px; margin: 8px 0; color: var(--text-secondary); background: var(--accent-light); border-radius: 0 calc(6px * var(--ab-radius,1)) calc(6px * var(--ab-radius,1)) 0; } .ab-bubble table { border-collapse: collapse; margin: 8px 0; font-size:calc(13px * var(--ab-fs,1)); } .ab-bubble th, .ab-bubble td { border: 1px solid var(--border); padding: 5px 10px; text-align: left; } .ab-bubble th { background: var(--bg-tertiary); font-weight: 600; } .ab-bubble a { color: var(--accent-hover); text-decoration: none; } .ab-bubble a:hover { text-decoration: underline; } .ab-bubble hr { border: none; border-top: 1px solid var(--border); margin: 10px 0; } .ab-bubble strong { color: var(--text-primary); font-weight: 700; } /* ============ P2 任务中心增强（2026-09-05） ============ */ /* 页签栏 */ .ab-task-tabs { display: flex; gap: 6px; margin-bottom: 12px; } .ab-task-tab { flex: 1; padding: 7px 0; text-align: center; font-size:calc(12px * var(--ab-fs,1)); font-weight: 600; border: 1px solid var(--border); border-radius: calc(8px * var(--ab-radius,1)); cursor: pointer; color: var(--text-muted); background: transparent; transition: all .15s; } .ab-task-tab:hover { border-color: var(--accent); color: var(--accent); } .ab-task-tab.ab-task-tab-on { background: linear-gradient(135deg, var(--accent), var(--accent-hover)); border-color: var(--accent); color: #fff; } /* 搜索 + 操作行 */ .ab-task-toolbar { display: flex; gap: 6px; margin-bottom: 12px; align-items: center; } .ab-task-search { flex: 1; padding: 7px 10px; font-size:calc(12px * var(--ab-fs,1)); border: 1px solid var(--border); border-radius: calc(8px * var(--ab-radius,1)); background: var(--bg-secondary); color: var(--text-primary); outline: none; } .ab-task-search:focus { border-color: var(--accent); } .ab-task-act { padding: 6px 10px; font-size:calc(11px * var(--ab-fs,1)); border: 1px solid var(--border); border-radius: calc(8px * var(--ab-radius,1)); background: transparent; color: var(--text-muted); cursor: pointer; white-space: nowrap; transition: all .15s; } .ab-task-act:hover { border-color: var(--accent); color: var(--accent); } .ab-task-act.danger:hover { border-color: var(--error,#ef4444); color: var(--error,#ef4444); } /* 任务项操作按钮（hover 显示） */ .ab-task-ops { display: flex; gap: 4px; opacity: 0; transition: opacity .15s; } .ab-auto-item:hover .ab-task-ops { opacity: 1; } .ab-task-op { width: 24px; height: 24px; display: flex; align-items: center; justify-content: center; border: 1px solid var(--border); border-radius: calc(6px * var(--ab-radius,1)); background: transparent; color: var(--text-muted); cursor: pointer; font-size:calc(11px * var(--ab-fs,1)); transition: all .15s; } .ab-task-op:hover { border-color: var(--accent); color: var(--accent); } .ab-task-op.danger:hover { border-color: var(--error,#ef4444); color: var(--error,#ef4444); } /* 状态徽标补充 */ .ab-sub-badge.fail { background: rgba(239,68,68,0.15); color: var(--error,#ef4444); } .ab-sub-badge.run { background: rgba(59,130,246,0.15); color: #3b82f6; } .ab-auto-dot.fail { background: var(--error,#ef4444); } .ab-auto-dot.run { background: #3b82f6; } /* 实时任务步骤时间线 */ .ab-live-step { color: var(--accent); font-size:calc(11px * var(--ab-fs,1)); margin-top: 2px; } .ab-live-steps { margin-top: 4px; padding: 6px 8px; background: rgba(0,0,0,0.04); border-radius: calc(6px * var(--ab-radius,1)); max-height: 120px; overflow-y: auto; } .ab-live-step-row { font-size:calc(10px * var(--ab-fs,1)); color: var(--text-muted); line-height: 1.6; display: flex; gap: 6px; } .ab-live-step-time { flex-shrink: 0; font-family: Consolas, monospace; opacity: 0.7; } [data-theme="dark"] .ab-live-steps { background: rgba(255,255,255,0.05); } /* ============ 生产资料表单（P3 ask_form，v118） ============ */ .ab-ask-form { width: min(620px, 100%); } /* v194-② 快捷指令面板 */ /* v193 选项式澄清卡 */ .ab-ask-options { width: min(560px, 100%); } .ab-ao-q { font-size:calc(14px * var(--ab-fs,1)); font-weight: 600; color: var(--text); margin-bottom: 10px; line-height: 1.5; } .ab-ao-opts { display: flex; flex-direction: column; gap: 8px; margin-bottom: 10px; } .ab-ao-opt { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 9px 12px; border: 1px solid var(--border); border-radius: calc(10px * var(--ab-radius,1)); background: transparent; cursor: pointer; text-align: left; transition: border-color .15s, background .15s; } .ab-ao-opt:hover:not(:disabled) { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 6%, transparent); } .ab-ao-opt:disabled { opacity: 0.55; cursor: default; } .ab-ao-opt-label { font-size:calc(13px * var(--ab-fs,1)); font-weight: 600; color: var(--text); } .ab-ao-opt-desc { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); line-height: 1.4; } .ab-ao-free { display: flex; gap: 6px; } .ab-ao-input { flex: 1; padding: 7px 10px; border: 1px solid var(--border); border-radius: calc(8px * var(--ab-radius,1)); background: var(--bg-input, transparent); color: var(--text); font-size:calc(12px * var(--ab-fs,1)); outline: none; } .ab-ao-input:focus { border-color: var(--accent); } .ab-ao-send { padding: 7px 14px; border: none; border-radius: calc(8px * var(--ab-radius,1)); background: var(--accent); color: #fff; font-size:calc(12px * var(--ab-fs,1)); cursor: pointer; } .ab-ao-send:hover { filter: brightness(1.08); } .ab-ao-done .ab-ao-q::after { content: " ✓ 已回复"; font-size:calc(11px * var(--ab-fs,1)); color: var(--accent); font-weight: 500; } .ab-af-head { margin-bottom: 10px; } .ab-af-title { display: flex; align-items: center; gap: 6px; font-weight: 600; font-size:calc(14px * var(--ab-fs,1)); color: var(--text); margin-bottom: 8px; } .ab-af-title .ab-ic { width: 16px; height: 16px; color: var(--accent); } .ab-af-progress { display: flex; align-items: center; gap: 10px; } .ab-af-bar { flex: 1; height: 6px; border-radius: calc(3px * var(--ab-radius,1)); background: var(--border); overflow: hidden; } .ab-af-fill { height: 100%; border-radius: calc(3px * var(--ab-radius,1)); background: linear-gradient(90deg, var(--accent), var(--accent-hover)); width: 0; transition: width .3s; } .ab-af-count { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); white-space: nowrap; } .ab-af-history { margin-bottom: 10px; padding: 8px 10px; border: 1px dashed var(--border); border-radius: calc(10px * var(--ab-radius,1)); } .ab-af-history-label { display: flex; align-items: center; gap: 4px; font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); margin-bottom: 6px; } .ab-af-history-label .ab-ic { width: 13px; height: 13px; } .ab-af-chips { display: flex; flex-wrap: wrap; gap: 6px; } .ab-af-chip { display: inline-flex; align-items: center; gap: 5px; padding: 4px 10px 4px 5px; border: 1px solid var(--border); border-radius: 999px; background: transparent; font-size:calc(12px * var(--ab-fs,1)); color: var(--text); cursor: pointer; transition: all .15s; } .ab-af-chip:hover { border-color: var(--accent); color: var(--accent); } .ab-af-chip img { width: 20px; height: 20px; border-radius: 50%; object-fit: cover; } .ab-af-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 12px; } @media (max-width: 560px) { .ab-af-grid { grid-template-columns: 1fr; } } .ab-af-field { display: flex; flex-direction: column; gap: 5px; padding: 10px; border: 1px solid var(--border); border-radius: calc(10px * var(--ab-radius,1)); } .ab-af-field.ab-af-req { border-color: rgba(239,68,68,0.45); } .ab-af-field label { font-size:calc(12px * var(--ab-fs,1)); font-weight: 600; color: var(--text); display: flex; align-items: center; gap: 5px; } .ab-af-star { color: #ef4444; font-style: normal; } .ab-af-opt { font-size:calc(10px * var(--ab-fs,1)); font-weight: 400; color: var(--text-muted); border: 1px solid var(--border); border-radius: calc(4px * var(--ab-radius,1)); padding: 0 4px; font-style: normal; } .ab-af-input { width: 100%; padding: 7px 9px; border: 1px solid var(--border); border-radius: calc(8px * var(--ab-radius,1)); background: transparent; color: var(--text); font-size:calc(13px * var(--ab-fs,1)); outline: none; transition: border .15s; } .ab-af-input:focus { border-color: var(--accent); } .ab-af-pick { display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 8px 10px; border: 1px dashed var(--border); border-radius: calc(8px * var(--ab-radius,1)); background: transparent; color: var(--text-muted); font-size:calc(12px * var(--ab-fs,1)); cursor: pointer; transition: all .15s; } .ab-af-pick:hover { border-color: var(--accent); color: var(--accent); } .ab-af-pick .ab-ic { width: 14px; height: 14px; } .ab-af-thumbs { display: flex; flex-wrap: wrap; gap: 6px; } .ab-af-thumb { position: relative; width: 52px; height: 52px; } .ab-af-thumb img { width: 100%; height: 100%; object-fit: cover; border-radius: calc(8px * var(--ab-radius,1)); border: 1px solid var(--border); } .ab-af-thumb-x { position: absolute; top: -6px; right: -6px; width: 16px; height: 16px; border-radius: 50%; border: none; background: #ef4444; color: #fff; font-size:calc(11px * var(--ab-fs,1)); line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; } .ab-af-imgnote { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); line-height: 1.5; } .ab-af-foot { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; } .ab-af-submit { padding: 9px 18px; border: none; border-radius: 999px; background: var(--border); color: var(--text-muted); font-size:calc(13px * var(--ab-fs,1)); font-weight: 600; cursor: not-allowed; transition: all .2s; } .ab-af-submit.ab-af-ready { background: linear-gradient(135deg, var(--accent), var(--accent-hover)); color: #fff; cursor: pointer; box-shadow: 0 2px 10px color-mix(in srgb, var(--accent) 35%, transparent); } .ab-af-submit.ab-af-ready:hover { transform: translateY(-1px); box-shadow: 0 4px 14px color-mix(in srgb, var(--accent) 45%, transparent); } .ab-af-tip { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); } .ab-af-done { opacity: .75; } .ab-af-done .ab-af-fill { background: var(--accent); } /* ============ 工作进程步骤条（v120） ============ */ .ab-wsteps { display: flex; flex-direction: column; gap: 5px; margin-bottom: 6px; } .ab-wstep { display: flex; align-items: center; gap: 7px; padding: 6px 10px; border: 1px solid var(--border); border-radius: calc(8px * var(--ab-radius,1)); font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); background: rgba(0,0,0,0.02); transition: all .3s; } [data-theme="dark"] .ab-wstep { background: rgba(255,255,255,0.04); } .ab-wstep-ico { display: inline-flex; } .ab-wstep-ico .ab-ic { width: 13px; height: 13px; } .ab-wstep-txt { flex: 1; } .ab-wstep-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--accent); animation: ab-wpulse 1s ease-in-out infinite; } @keyframes ab-wpulse { 0%,100% { opacity: .35; transform: scale(.8); } 50% { opacity: 1; transform: scale(1.15); } } .ab-wstep-ok { color: var(--text); border-color: color-mix(in srgb, var(--accent) 35%, transparent); } .ab-wstep-ok .ab-wstep-dot { background: var(--accent); animation: none; width: auto; height: auto; border-radius: 0; font-size:calc(13px * var(--ab-fs,1)); color: var(--accent); font-weight: 700; } .ab-wstep-fail { border-color: rgba(239,68,68,0.4); } .ab-wstep-fail .ab-wstep-dot { background: #ef4444; animation: none; width: auto; height: auto; border-radius: 0; font-size:calc(13px * var(--ab-fs,1)); color: #ef4444; font-weight: 700; } .ab-wsteps-done { flex-direction: row; } .ab-wsteps-done { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border: 1px solid color-mix(in srgb, var(--accent) 30%, transparent); border-radius: 999px; font-size:calc(11px * var(--ab-fs,1)); color: var(--accent-hover); background: color-mix(in srgb, var(--accent) 8%, transparent); } .ab-wsteps-done .ab-ic { width: 12px; height: 12px; } /* ===== v325：执行过程统一折叠容器（「查看已完成的N步工作进程」）===== */ /* 运行中过程正常显示；流结束后全部收进这个可折叠盒，正文顶部只留一个干净的可点头部 */ .ab-procfold { margin: 2px 0 8px; } .ab-procfold-head { display: inline-flex; align-items: center; gap: 6px; font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); cursor: pointer; padding: 3px 0; user-select: none; background: transparent; border: none; } .ab-procfold-head:hover { color: var(--text-primary); } .ab-procfold-head .ab-pf-arrow { transition: transform .2s; display: inline-block; } .ab-procfold.open .ab-procfold-head .ab-pf-arrow { transform: rotate(90deg); } /* GW.041：折叠头步骤摘要（"查看已完成的 N 步工作进程 搜索资料 → 读取网页 …"），比主标题更弱、过长省略 */ .ab-pf-brief { color: var(--text-muted); opacity: .8; font-size: calc(11px * var(--ab-fs,1)); font-weight: 400; max-width: 42ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; border: 1px solid var(--border, rgba(128,128,128,0.22)); border-radius: calc(6px * var(--ab-radius,1)); padding: 0 6px; } .ab-procfold-body { display: none; margin-top: 6px; padding-left: 4px; border-left: 2px solid var(--border, rgba(128,128,128,0.18)); } .ab-procfold.open .ab-procfold-body { display: block; } /* 折叠体内子元素去掉各自边框/背景，紧凑排列 */ .ab-procfold-body .ab-timeline, .ab-procfold-body .ab-subtimeline { border: none; background: transparent; padding: 2px 0; margin: 4px 0; } .ab-procfold-body .ab-subpar { margin: 4px 0; } /* ===== v325：正文关键词加粗保底（防主题继承 font-weight:normal 压制 ）===== */ .ab-bubble-text strong, .ab-msg strong, .ab-bubble-text b, .ab-msg b { font-weight: 700; color: var(--text-primary); } /* ============ v174 敏感操作提示条 / 确认卡 / 代码块动作 / 快捷键帮助 ============ */ /* 付费子系统被调用时的醒目提示：客户可立即止损，或本会话放权 */ .ab-risk-bar { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; margin: 4px 0 8px; padding: 6px 10px; border: 1px solid rgba(245,158,11,0.4); border-radius: calc(8px * var(--ab-radius,1)); background: rgba(245,158,11,0.09); font-size:calc(12px * var(--ab-fs,1)); } .ab-risk-ico { display: inline-flex; color: #f59e0b; } .ab-risk-ico .ab-ic { width: 13px; height: 13px; } .ab-risk-txt { flex: 1; min-width: 160px; color: var(--text-muted); } .ab-risk-txt b { color: var(--text); font-weight: 600; } .ab-risk-btn { padding: 3px 9px; border: 1px solid var(--border); border-radius: calc(6px * var(--ab-radius,1)); background: var(--bg-primary, #fff); color: var(--text-muted); font-size:calc(11px * var(--ab-fs,1)); cursor: pointer; transition: all .16s; } .ab-risk-btn:hover { border-color: var(--accent); color: var(--accent); } .ab-risk-btn.danger { border-color: rgba(239,68,68,0.4); color: #dc2626; background: rgba(239,68,68,0.08); } [data-theme="dark"] .ab-risk-btn { background: rgba(255,255,255,0.05); } /* BFF 升级后的真门禁确认卡（当前 BFF 未发 confirm_request，样式先就位） */ .ab-confirm-card { margin: 10px 0 4px; padding: 12px 14px; border: 1px solid rgba(245,158,11,0.45); border-radius: calc(10px * var(--ab-radius,1)); background: rgba(245,158,11,0.07); } .ab-confirm-hd { display: flex; align-items: center; gap: 6px; font-size:calc(13px * var(--ab-fs,1)); font-weight: 500; margin-bottom: 6px; } .ab-confirm-hd .ab-ic { width: 14px; height: 14px; color: #f59e0b; } .ab-confirm-body { font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); line-height: 1.6; } .ab-confirm-body b { color: var(--text); } .ab-confirm-acts { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; } .ab-confirm-btn { padding: 5px 12px; border: 1px solid var(--border); border-radius: calc(7px * var(--ab-radius,1)); background: var(--bg-primary, #fff); color: var(--text-muted); font-size:calc(12px * var(--ab-fs,1)); cursor: pointer; transition: all .16s; } .ab-confirm-btn.primary { border-color: color-mix(in srgb, var(--accent) 50%, transparent); background: color-mix(in srgb, var(--accent) 12%, transparent); color: var(--accent); } .ab-confirm-btn.ghost { opacity: .7; } .ab-confirm-btn:hover { border-color: var(--accent); } .ab-confirm-btn:disabled { opacity: .45; cursor: default; pointer-events: none; } /* P2-④：已作出选择后禁用其余按钮 */ [data-theme="dark"] .ab-confirm-btn { background: rgba(255,255,255,0.05); } /* 代码块动作：存产物按钮 + 长块折叠 */ .ab-code-copy.ab-code-save { margin-left: 6px; } .ab-code-copy.ab-code-more { margin-left: 6px; } /* ===== v305 P9b：代码块动作容器 + 「一键运行」沙箱 ===== */ /* 🔴 关键：动作按钮是 absolute 定位，必须让 pre 成为定位上下文 —— 否则相对更外层（bubble）定位， 按钮会飘到气泡右上角而不是代码块右上角（v305 实测 actsRect.x=1080 vs pre.x=324；历史「复制」按钮同样错位）。 */ .ab-bubble pre { position: relative; } /* P38-3：代码块 / 长英文文本内嵌滚动窗口（长代码不撑破气泡与页面） */ .ab-bubble pre { max-height: 420px; overflow: auto; } .ab-bubble pre > code { display: block; min-width: max-content; } /* 动作按钮装进 flex 容器（原先每个按钮各自 absolute 定位在右上角，加到 3 个就互相压住） */ .ab-code-acts { position: absolute; top: 6px; right: 6px; display: flex; gap: 6px; z-index: 2; opacity: 0; transition: opacity .15s; } .ab-bubble pre:hover .ab-code-acts, .ab-code-wrap:hover .ab-code-acts { opacity: 1; } .ab-code-acts .ab-code-copy { position: static; opacity: 1; } .ab-code-acts .ab-code-copy.ab-code-save, .ab-code-acts .ab-code-copy.ab-code-more { margin-left: 0; } /* 运行按钮：绿色主调（线性描边） */ .ab-code-acts .ab-code-run { color: var(--accent); border-color: var(--accent); } .ab-code-acts .ab-code-run:hover { background: var(--accent); color: #fff; } .ab-code-acts .ab-code-run[disabled] { opacity: .5; cursor: default; } .ab-code-acts .ab-code-run-off { color: var(--text-muted, #8a8aa8); border-color: var(--border, rgba(0,0,0,.12)); } /* 运行输出面板 */ .ab-code-out { margin: 6px 0 2px; padding: 8px 10px; border-radius: calc(8px * var(--ab-radius,1)); font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size:calc(11.5px * var(--ab-fs,1)); line-height: 1.6; white-space: pre-wrap; word-break: break-word; max-height: 260px; overflow: auto; background: var(--bg-tertiary, #1a1c2a); color: var(--text-secondary, #a9adc4); border-left: 2px solid var(--border, color-mix(in srgb, var(--accent) 15%, transparent)); } .ab-code-out.is-running { color: var(--text-muted, #8a8aa8); border-left-color: var(--accent); } .ab-code-out.is-ok { border-left-color: var(--success); } .ab-code-out.is-err { border-left-color: var(--error, #ef4444); color: var(--text-primary, #e0e0e0); } .ab-code-folded { max-height: 240px; overflow: hidden; position: relative; } .ab-code-folded::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 48px; background: linear-gradient(to bottom, transparent, var(--bg-primary, #fff)); } [data-theme="dark"] .ab-code-folded::after { background: linear-gradient(to bottom, transparent, var(--bg-secondary, #1a1a1a)); } /* 快捷键帮助面板 */ .ab-shortcut-help { position: fixed; inset: 0; z-index: 8000; display: flex; align-items: center; justify-content: center; background: rgba(0,0,0,0.35); } .ab-shortcut-card { width: 380px; max-width: 90vw; background: var(--bg-primary, #fff); border: 1px solid var(--border); border-radius: calc(12px * var(--ab-radius,1)); padding: 16px 18px; box-shadow: 0 12px 40px rgba(0,0,0,0.18); } .ab-shortcut-hd { display: flex; align-items: center; gap: 7px; font-size:calc(14px * var(--ab-fs,1)); font-weight: 500; margin-bottom: 12px; } .ab-shortcut-hd .ab-ic { width: 15px; height: 15px; } .ab-shortcut-x { margin-left: auto; border: 0; background: none; cursor: pointer; color: var(--text-muted); display: inline-flex; padding: 2px; } .ab-shortcut-x .ab-ic { width: 14px; height: 14px; } .ab-shortcut-row { display: flex; align-items: center; gap: 12px; padding: 6px 0; border-top: 1px solid var(--border); font-size:calc(12px * var(--ab-fs,1)); } .ab-shortcut-row:first-child { border-top: 0; } .ab-shortcut-row kbd { min-width: 130px; padding: 3px 8px; border: 1px solid var(--border); border-bottom-width: 2px; border-radius: calc(6px * var(--ab-radius,1)); background: var(--bg-secondary, #f6f6f6); font-family: var(--font-mono, monospace); font-size:calc(11px * var(--ab-fs,1)); color: var(--text); } .ab-shortcut-row span { color: var(--text-muted); } /* ============ v173 P2 上下文水位交互提醒条 ============ */ /* 非侵入式：挂在输入区上方，不遮挡消息区；客户自己决定何时压缩 */ .ab-ctx-alert { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 0 16px 8px; padding: 7px 12px; border: 1px solid rgba(245,158,11,0.35); border-radius: calc(10px * var(--ab-radius,1)); background: rgba(245,158,11,0.08); font-size:calc(12px * var(--ab-fs,1)); color: var(--text); } .ab-ctx-alert.is-crit { border-color: rgba(239,68,68,0.4); background: rgba(239,68,68,0.08); } .ab-ctx-alert-ico { display: inline-flex; color: #f59e0b; } .ab-ctx-alert.is-crit .ab-ctx-alert-ico { color: #ef4444; } .ab-ctx-alert-ico .ab-ic { width: 14px; height: 14px; } .ab-ctx-alert-txt { flex: 1; min-width: 180px; color: var(--text-muted); } .ab-ctx-alert-txt b { color: var(--text); font-weight: 600; } .ab-ctx-alert-btn { display: inline-flex; align-items: center; gap: 4px; padding: 4px 10px; border: 1px solid var(--border); border-radius: calc(7px * var(--ab-radius,1)); background: var(--bg-primary, #fff); color: var(--text-muted); font-size:calc(11px * var(--ab-fs,1)); cursor: pointer; transition: all .16s; } .ab-ctx-alert-btn .ab-ic { width: 12px; height: 12px; } .ab-ctx-alert-btn:hover { border-color: var(--accent); color: var(--accent); } .ab-ctx-alert-btn.primary { border-color: rgba(245,158,11,0.5); color: #b45309; background: rgba(245,158,11,0.12); } .ab-ctx-alert.is-crit .ab-ctx-alert-btn.primary { border-color: rgba(239,68,68,0.5); color: #dc2626; background: rgba(239,68,68,0.12); } [data-theme="dark"] .ab-ctx-alert-btn { background: rgba(255,255,255,0.05); } [data-theme="dark"] .ab-ctx-alert-btn.primary { color: #fbbf24; } [data-theme="dark"] .ab-ctx-alert.is-crit .ab-ctx-alert-btn.primary { color: #f87171; } /* ============ v172 P1 折叠老步骤条 + 续渲提示条 ============ */ /* 超长任务链（>60 步）时把最早已完成的步骤合并成一行，防 DOM 膨胀 */ .ab-wstep-fold { border-style: dashed; opacity: .72; } .ab-wstep-fold .ab-wstep-ico .ab-ic { width: 12px; height: 12px; color: var(--accent-hover); } .ab-wstep-fold .ab-wstep-txt { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); } /* hydrate 续渲：刷新/重进后接显示上次未说完的回答，顶部挂一行说明 */ .ab-restore-hint { display: inline-flex; align-items: center; gap: 6px; margin-top: 8px; padding: 4px 10px; border: 1px dashed var(--border); border-radius: 999px; font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); background: rgba(0,0,0,0.02); } [data-theme="dark"] .ab-restore-hint { background: rgba(255,255,255,0.04); } .ab-restore-hint .ab-ic { width: 12px; height: 12px; } /* ============ v139 用量明细弹层（WorkBuddy 风：分类占比+精致紧凑） ============ */ .ab-usage-pop { position: absolute; bottom: 52px; right: 0; z-index: 500; width: 236px; background: var(--bg-primary, #fff); border: 1px solid var(--border); border-radius: calc(10px * var(--ab-radius,1)); box-shadow: 0 6px 24px rgba(0,0,0,0.10); padding: 12px 14px; font-size:calc(12.5px * var(--ab-fs,1)); } .ab-usage-pop.hidden { display: none; } .ab-usage-pop-head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 2px; } .ab-usage-pop-title { font-weight: 700; font-size:calc(13px * var(--ab-fs,1)); color: var(--text-primary); } .ab-usage-pop-pct { font-weight: 700; font-size:calc(13px * var(--ab-fs,1)); color: var(--accent); font-family: Consolas, Monaco, monospace; } .ab-usage-pop-sub { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); margin-bottom: 10px; font-family: Consolas, Monaco, monospace; } .ab-usage-pop-list { display: flex; flex-direction: column; gap: 3px; margin-bottom: 10px; } .ab-usage-pop-item { display: flex; align-items: center; gap: 7px; padding: 2px 0; } .ab-up-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; } .ab-up-name { flex: 1; color: var(--text-secondary); font-size:calc(12px * var(--ab-fs,1)); } .ab-up-val { color: var(--text-primary); font-weight: 600; font-size:calc(12px * var(--ab-fs,1)); font-family: Consolas, Monaco, monospace; min-width: 34px; text-align: right; } /* 分段彩色占比条 */ .ab-usage-bar { display: flex; height: 7px; border-radius: calc(4px * var(--ab-radius,1)); overflow: hidden; background: var(--bg-secondary); margin: 8px 0 10px; } .ab-usage-seg { display: block; height: 100%; width: 0; transition: width .3s; } /* 每行细占比条 */ .ab-up-bar { width: 60px; height: 4px; background: var(--bg-secondary); border-radius: calc(2px * var(--ab-radius,1)); overflow: hidden; flex-shrink: 0; } .ab-up-bar i { display: block; height: 100%; width: 0; border-radius: calc(2px * var(--ab-radius,1)); transition: width .3s; } .ab-usage-pop-btn { display: flex; align-items: center; justify-content: center; gap: 5px; width: 100%; padding: 5px 0; border: 1px dashed var(--accent); border-radius: calc(7px * var(--ab-radius,1)); background: transparent; color: var(--accent); font-size:calc(12px * var(--ab-fs,1)); font-weight: 400; cursor: pointer; transition: background .15s; } .ab-usage-pop-btn:hover { background: color-mix(in srgb, var(--accent) 7%, transparent); } /* v344：相邻虚线按钮留出间距（此前「压缩上下文 / 清空上下文」边框粘连） */ .ab-usage-pop-btn + .ab-usage-pop-btn { margin-top: 8px; } .ab-usage-pop-btn .ab-ic { width: 12px; height: 12px; } .ab-input-foot { position: relative; } /* ===== v145 ===== */ /* 状态条：完成后常显（不再淡出），dot 转为灰色对勾态 */ .ab-status-strip.finished .ab-ss-dot { background: #94a3b8; animation: none; } .ab-status-strip.finished { background: transparent; border-color: transparent; } /* v328：流式执行中三块（状态行/正文/状态条）先靠拢，收尾后自然撑开 */ .ab-turn-running .ab-status-strip { margin: 0; } .ab-turn-running .ab-bubble { margin-top: 2px; } .ab-status-strip .ab-ss-timer { font-weight: 700; color: var(--text-primary); } .ab-status-strip .ab-ss-phase { color: var(--text-muted); } /* 一键到底：输入框上方居中悬浮，仅向上拉取上下文时显示 */ .ab-inputzone { position: relative; } .ab-jump-bottom { position: absolute; left: 50%; transform: translateX(-50%); bottom: calc(100% + 8px); display: none; align-items: center; gap: 5px; padding: 5px 12px; border-radius: 999px; border: 1px solid var(--border); background: var(--card-bg, #fff); color: var(--text-secondary, #555); font-size:calc(11.5px * var(--ab-fs,1)); cursor: pointer; box-shadow: 0 4px 14px rgba(0,0,0,0.12); z-index: 30; } .ab-jump-bottom.show { display: inline-flex; } .ab-jump-bottom:hover { color: var(--accent); border-color: var(--accent); } .ab-jump-bottom .ab-ic { width: 12px; height: 12px; } /* 右侧用户提问记录条（温度计式） */ .ab-urail { /* v187：原 top:50%+translateY(-50%) 垂直居中 → 段数变多时向下也扩张，盖住输入框。 改为底边锚定(bottom) + height:auto → 内容变多时只向上生长，绝不下沉遮挡输入区。 --urail-bottom 由 app.js 按输入区实际高度动态写入（兜底 112px）。 */ position: absolute; right: 4px; top: auto; bottom: var(--urail-bottom, 112px); transform: none; width: 10px; max-height: 46vh; overflow-y: auto; overflow-x: hidden; display: flex; flex-direction: column; gap: 3px; padding: 3px 0; z-index: 12; scrollbar-width: none; } .ab-urail::-webkit-scrollbar { width: 0; height: 0; } .ab-urail.hidden { display: none; } .ab-ur-seg { position: relative; width: 10px; height: 14px; flex-shrink: 0; border-radius: calc(3px * var(--ab-radius,1)); background: color-mix(in srgb, var(--accent) 28%, transparent); cursor: pointer; transition: background .15s, transform .1s; } .ab-ur-seg:hover { background: var(--accent); transform: scaleX(1.25); } .ab-ur-seg.active { background: var(--accent); } .ab-ur-tip { position: absolute; right: 18px; top: 50%; transform: translateY(-50%); display: none; white-space: nowrap; max-width: 260px; overflow: hidden; text-overflow: ellipsis; padding: 5px 9px; border-radius: calc(7px * var(--ab-radius,1)); background: var(--card-bg, #fff); color: var(--text-primary); border: 1px solid var(--border); box-shadow: 0 4px 14px rgba(0,0,0,0.14); font-size:calc(11.5px * var(--ab-fs,1)); z-index: 40; pointer-events: none; } .ab-ur-seg:hover .ab-ur-tip { display: block; } /* ===== v146 ===== */ /* 收尾总结卡（✅ 本轮总结 + 可点击的下一步建议）—— v322 结果区去绿色边框，改中性灰卡 */ .ab-summary-card { margin: 10px 0 2px; padding: 10px 12px; border: none; border-radius: calc(10px * var(--ab-radius,1)); background: color-mix(in srgb, var(--accent) 6%, transparent); } .ab-sc-head { display: flex; align-items: center; gap: 6px; font-size:calc(12.5px * var(--ab-fs,1)); font-weight: 700; color: var(--text-secondary, #555); } .ab-sc-ico { display: inline-flex; font-size:calc(13px * var(--ab-fs,1)); line-height: 1; } .ab-sc-body { margin-top: 5px; font-size:calc(13px * var(--ab-fs,1)); line-height: 1.7; color: var(--text-primary); } .ab-sc-body p { margin: 0 0 4px; } .ab-sc-body p:last-child { margin-bottom: 0; } .ab-sc-shead { display: flex; align-items: center; gap: 5px; margin-top: 9px; font-size:calc(11.5px * var(--ab-fs,1)); color: var(--text-muted); } .ab-sc-shead svg { width: 12px; height: 12px; } .ab-sc-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; } .ab-sc-chip { padding: 5px 10px; border-radius: 999px; font-size:calc(11.5px * var(--ab-fs,1)); cursor: pointer; border: 1px solid var(--border, #e5e7eb); background: var(--card-bg, #fff); color: var(--text-secondary, #444); line-height: 1.45; text-align: left; transition: border-color .15s, color .15s, background .15s; } .ab-sc-chip:hover { border-color: var(--accent); color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, transparent); } /* C.74（2026-10-18 老板令）：建议项支持「点一下就地改、改完发送」＋ 右侧 ➤ 一键直发 */ .ab-sc-chipwrap { display: inline-flex; align-items: center; gap: 1px; max-width: 100%; } .ab-sc-chipwrap .ab-sc-chip.hidden { display: none; } .ab-sc-go { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; padding: 0; flex: 0 0 auto; border: none; border-radius: 999px; background: transparent; color: var(--text-muted); cursor: pointer; transition: color .15s, background .15s; } .ab-sc-go svg { width: 12px; height: 12px; } .ab-sc-go:hover { color: var(--accent); background: color-mix(in srgb, var(--accent) 10%, transparent); } .ab-sc-edit { min-width: 200px; max-width: min(420px, 100%); padding: 5px 10px; border-radius: 999px; outline: none; border: 1px solid var(--accent); background: var(--card-bg, #fff); color: var(--text-primary); font-family: inherit; line-height: 1.45; font-size: calc(11.5px * var(--ab-fs,1)); } .ab-sc-edit::placeholder { color: var(--text-muted); } :root:not(.ab-light) .ab-sc-edit { background: rgba(255,255,255,0.06); color: #e8eaf2; } /* 用户提问记录条：默认容纳 30 条（14px 段 + 3px 间距），超出可滚轮滑动 */ .ab-urail { max-height: min(516px, 56vh); } /* ===== v147 ===== */ .ab-status-strip .ab-ss-think { color: var(--accent); } /* v322：运行中绿色醒目（过程区可彩色） */ .ab-status-strip .ab-ss-think.done { color: var(--text-muted); } /* v322：结果定格立即变灰（绿色纪律） */ .ab-status-strip .ab-ss-txt.ab-ss-tip { color: var(--text-muted); } /* v322 绿色纪律：整个状态条收尾后全部转灰，终态不再保留绿色 */ .ab-status-strip.finished .ab-ss-think { color: var(--text-muted); } .ab-status-strip.finished .ab-ss-pct { color: var(--text-muted); font-weight: 400; } .ab-status-strip.finished .ab-ss-dot { background: var(--text-muted); } /* v322 过程彩色收灰：收尾后时间线全部中性灰，结果区严谨不花哨 */ .ab-timeline.tl-finished .ab-tl-node { color: var(--text-muted); } .ab-timeline.tl-finished .ab-tl-node::before { background: #94a3b8 !important; } .ab-timeline.tl-finished .ab-tl-head { color: var(--text-muted) !important; font-weight: 500; } .ab-timeline.tl-finished .ab-tl-detail { color: var(--text-muted); } /* v322 通用滚动容器：表格超宽横向滚动 + 限高纵向滚动 + 表头吸顶（最优价值内容收在可视框内） */ .ab-tbl-wrap { max-width: 100%; max-height: 420px; overflow: auto; margin: 6px 0; border: 1px solid var(--border, rgba(0,0,0,0.1)); border-radius: calc(8px * var(--ab-radius,1)); } .ab-tbl-wrap table { margin: 0; min-width: 100%; border-collapse: collapse; } .ab-tbl-wrap thead th { position: sticky; top: 0; z-index: 1; background: var(--bg-secondary, #f6f7f9); } .ab-bubble pre { max-width: 100%; overflow: auto; } /* v322：代码块长行同样收进滚动容器 */ /* v322 多任务/多代理执行过程长文本收进固定高度滚动容器，不刷屏占满视角 */ .ab-timeline.tl-scroll { max-height: 260px; overflow-y: auto; padding-right: 6px; } /* ===== v163 WorkBuddy 专业细节移植 ===== */ /* ① 工具 pending 状态边框脉冲（对标 WB tool-status-pending） */ @keyframes ab-border-ping { 0% { outline-color: var(--accent); outline-width: 1px; } 75%, 100% { outline-color: color-mix(in srgb, var(--accent) 0%, transparent); outline-width: 3px; } } .ab-wstep.ab-wstep-run { /* P38-3.2：进行中的步骤 —— 取消粗边框与大面积扫光（老板规则：不需要大面积边框；光线只扫文字） */ position: relative; } /* 只让「文字」有白色光线扫过（完成后自动转移到下一项） */ .ab-wstep.ab-wstep-run .ab-wstep-txt { background: linear-gradient(110deg, color-mix(in srgb, var(--text-secondary, #555) 88%, transparent) 0%, color-mix(in srgb, var(--text-secondary, #555) 88%, transparent) 35%, rgba(255, 255, 255, 0.96) 50%, color-mix(in srgb, var(--text-secondary, #555) 88%, transparent) 65%, color-mix(in srgb, var(--text-secondary, #555) 88%, transparent) 100%); background-size: 200% 100%; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; animation: ab-shining-text-sweep 2s linear infinite; } @keyframes ab-active-sweep { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } /* ② 思考中扫光文字（对标 WB cb-shining-text-sweep，绿色主题） */ /* P38-3.2：扫光段 绿色 → 白色（老板口径：取消绿色光线，改通用白色光线） */ .ab-status-strip .ab-ss-think:not(.done) { background: linear-gradient(110deg, color-mix(in srgb, var(--text-muted, #6b7280) 78%, transparent) 0%, color-mix(in srgb, var(--text-muted, #6b7280) 78%, transparent) 35%, rgba(255, 255, 255, 0.96) 50%, color-mix(in srgb, var(--text-muted, #6b7280) 78%, transparent) 65%, color-mix(in srgb, var(--text-muted, #6b7280) 78%, transparent) 100%); background-size: 200% 100%; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; animation: ab-shining-text-sweep 2.2s linear infinite; } /* 深色模式：底色更亮，扫光更柔和 */ [data-theme="dark"] .ab-status-strip .ab-ss-think:not(.done), :root:not(.ab-light) .ab-status-strip .ab-ss-think:not(.done) { background: linear-gradient(110deg, color-mix(in srgb, #c6c9d4 72%, transparent) 0%, color-mix(in srgb, #c6c9d4 72%, transparent) 35%, rgba(255, 255, 255, 0.98) 50%, color-mix(in srgb, #c6c9d4 72%, transparent) 65%, color-mix(in srgb, #c6c9d4 72%, transparent) 100%); background-size: 200% 100%; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; animation: ab-shining-text-sweep 2.2s linear infinite; } @keyframes ab-shining-text-sweep { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } /* 完成态摘掉扫光，恢复正常文字 */ .ab-status-strip .ab-ss-think.done { background: none; -webkit-text-fill-color: currentColor; animation: none; } /* ③ codicon 节流旋转（对标 WB steps(30) 机械齿轮感） */ /* v166 修复：i-tool 扳手图标非旋转对称，改 i-loader 圆环虚线；加 !important 防覆盖 */ @keyframes ab-codicon-spin { 100% { transform: rotate(360deg); } } .ab-wstep-run .ab-wstep-ico .ab-ic, .ab-wstep.ab-wstep-run .ab-wstep-ico .ab-ic { animation: ab-codicon-spin 1s steps(30) infinite !important; transform-origin: center; } /* ④ tooltip 毛玻璃（对标 WB cb-tooltip，绿色主题，产物/工具等浮层通用） */ .ab-tooltip, [role="tooltip"] { background: rgba(15, 23, 18, 0.78); color: #f3f4f6; border-radius: calc(8px * var(--ab-radius,1)); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); box-shadow: 0 4px 16px rgba(0, 0, 0, 0.18); border: 1px solid color-mix(in srgb, var(--accent) 15%, transparent); font-size:calc(12px * var(--ab-fs,1)); padding: 6px 10px; } [data-theme="dark"] .ab-tooltip, [data-theme="dark"] [role="tooltip"] { background: rgba(0, 0, 0, 0.78); border-color: color-mix(in srgb, var(--accent) 22%, transparent); } /* ⑤ 骨架屏 shimmer（产物加载占位，对标 WB widgetShimmer） */ @keyframes ab-shimmer { 0% { background-position: -200% 0; } 100% { background-position: 200% 0; } } .ab-skeleton, .ab-artifact-skeleton { background: linear-gradient(90deg, rgba(148, 163, 184, 0.08) 25%, rgba(148, 163, 184, 0.18) 50%, rgba(148, 163, 184, 0.08) 75%); background-size: 200% 100%; animation: ab-shimmer 1.5s infinite; border-radius: calc(6px * var(--ab-radius,1)); } /* ⑥ 折叠箭头 hover 渐显（对标 WB cb-fold-arrow） */ .ab-fold-arrow, .ab-wstep-args summary::-webkit-details-marker { opacity: 0; transition: opacity 0.16s ease; } .ab-wstep:hover .ab-fold-arrow, .ab-wstep-args[open] .ab-fold-arrow, .ab-wstep-args summary:hover::-webkit-details-marker { opacity: 1; } /* 纳入知识库按钮（替代点赞点踩，功能性优先） */ .ab-kb-btn.done { color: var(--text-muted); cursor: default; } .ab-kb-btn.done svg { color: var(--text-muted); } /* 计划确认卡（对标 WorkBuddy build-plan） */ .ab-plan-card { margin: 10px 0 2px; padding: 10px 12px; border: 1px solid var(--border, #e5e7eb); border-left: 3px solid var(--accent); border-radius: calc(10px * var(--ab-radius,1)); background: var(--card-bg, #fff); } .ab-pc-head { display: flex; align-items: center; gap: 6px; font-size:calc(12.5px * var(--ab-fs,1)); font-weight: 700; color: var(--text-primary); } .ab-pc-head svg { width: 14px; height: 14px; color: var(--accent); } .ab-pc-goal { margin-top: 4px; font-size:calc(11.5px * var(--ab-fs,1)); color: var(--text-muted); } .ab-pc-steps { margin: 6px 0 0; padding-left: 18px; font-size:calc(12.5px * var(--ab-fs,1)); line-height: 1.8; color: var(--text-secondary, #444); } .ab-pc-acts { display: flex; gap: 8px; margin-top: 9px; flex-wrap: wrap; } .ab-pc-accept, .ab-pc-adjust { display: inline-flex; align-items: center; gap: 5px; padding: 6px 12px; border-radius: calc(8px * var(--ab-radius,1)); font-size:calc(12px * var(--ab-fs,1)); cursor: pointer; border: 1px solid var(--border, #e5e7eb); background: var(--card-bg, #fff); color: var(--text-secondary, #444); } .ab-pc-accept { border-color: var(--accent); color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, transparent); font-weight: 600; } .ab-pc-accept:hover { background: color-mix(in srgb, var(--accent) 15%, transparent); } .ab-pc-adjust:hover { border-color: var(--accent); color: var(--accent); } .ab-pc-accept svg, .ab-pc-adjust svg { width: 13px; height: 13px; } /* 引用来源标注（对标 WorkBuddy「引用 N 篇资料作为参考」） */ .ab-ref-bar { margin: 8px 0 2px; font-size:calc(11.5px * var(--ab-fs,1)); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; } .ab-ref-head { grid-column: 1 / -1; display: inline-flex; align-items: center; gap: 5px; cursor: pointer; color: var(--text-muted); user-select: none; } .ab-ref-head svg { width: 12px; height: 12px; } .ab-ref-head:hover { color: var(--accent); } .ab-ref-toggle { font-size:calc(13px * var(--ab-fs,1)); line-height: 1; } .ab-ref-bar.collapsed .ab-ref-item { display: none; } .ab-ref-item { display: flex; align-items: baseline; gap: 6px; margin-top: 0; padding: 6px 9px; border-radius: calc(7px * var(--ab-radius,1)); border: none; background: color-mix(in srgb, var(--accent) 6%, transparent); overflow: hidden; } .ab-ref-dot { width: 4px; height: 4px; border-radius: 50%; background: var(--accent); flex-shrink: 0; position: relative; top: -2px; } .ab-ref-t { font-weight: 600; color: var(--text-primary); flex-shrink: 0; } .ab-ref-s { color: var(--text-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } /* ===== v149 助理矩阵（身份·能力·记忆·触达·节拍） ===== */ .ab-assist-tools { margin-left: auto; display: flex; gap: 8px; } .ab-assist-btn { display: inline-flex; align-items: center; gap: 5px; padding: 5px 12px; border-radius: calc(8px * var(--ab-radius,1)); font-size:calc(12px * var(--ab-fs,1)); cursor: pointer; border: 1px solid var(--accent); color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, transparent); font-weight: 600; } .ab-assist-btn.ghost { border-color: var(--border, #e5e7eb); color: var(--text-secondary, #444); background: transparent; font-weight: 400; } .ab-assist-btn:hover { background: color-mix(in srgb, var(--accent) 15%, transparent); } .ab-assist-btn.ghost:hover { border-color: var(--accent); color: var(--accent); background: color-mix(in srgb, var(--accent) 6%, transparent); } .ab-assist-chbar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 0 0 12px; padding: 8px 12px; border: 1px solid var(--border, #e5e7eb); border-radius: calc(10px * var(--ab-radius,1)); background: var(--bg-secondary, #f6f7f9); font-size:calc(12px * var(--ab-fs,1)); color: var(--text-secondary, #444); } .ab-assist-chbar .ab-chbar-ico { display: inline-flex; color: var(--accent); } .ab-assist-chbar .ab-chbar-ico svg { width: 14px; height: 14px; } .ab-assist-chbar b { color: var(--accent); } .ab-assist-chbar .ab-chbar-hint { margin-left: auto; font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); } .ab-assist-card { display: flex; flex-direction: column; gap: 6px; } .ab-assist-card.on { border-color: var(--accent); box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 12%, transparent); } .ab-assist-meta { display: flex; flex-direction: column; gap: 3px; font-size:calc(11.5px * var(--ab-fs,1)); color: var(--text-muted); } .ab-assist-state { display: inline-flex; align-items: center; gap: 5px; color: var(--text-secondary, #444); } .ab-assist-state i { width: 6px; height: 6px; border-radius: 50%; background: #cbd5e1; display: inline-block; } .ab-assist-card.on .ab-assist-state i { background: var(--accent); } /* 助理详情弹窗 */ .ab-assist-x { background: none; border: none; cursor: pointer; font-size:calc(14px * var(--ab-fs,1)); color: var(--text-muted); margin-left: auto; } .ab-assist-tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--border, #e5e7eb); margin-bottom: 12px; } .ab-assist-tab { padding: 6px 12px; font-size:calc(12.5px * var(--ab-fs,1)); color: var(--text-muted); cursor: pointer; border-bottom: 2px solid transparent; } .ab-assist-tab.on { color: var(--accent); border-bottom-color: var(--accent); font-weight: 600; } .ab-assist-pane { max-height: 52vh; overflow-y: auto; } .ab-assist-note { font-size:calc(11.5px * var(--ab-fs,1)); color: var(--text-muted); margin-bottom: 10px; line-height: 1.7; } .ab-assist-form { display: flex; flex-direction: column; gap: 10px; } .ab-assist-form label { display: flex; flex-direction: column; gap: 4px; font-size:calc(11.5px * var(--ab-fs,1)); color: var(--text-muted); } .ab-assist-form input, .ab-assist-form textarea { padding: 7px 10px; border-radius: calc(8px * var(--ab-radius,1)); border: 1px solid var(--border, #e5e7eb); background: var(--card-bg, #fff); color: var(--text-primary); font-size:calc(13px * var(--ab-fs,1)); font-family: inherit; resize: vertical; } .ab-assist-form input:focus, .ab-assist-form textarea:focus { outline: none; border-color: var(--accent); } .ab-assist-acts { display: flex; gap: 8px; margin-top: 12px; flex-wrap: wrap; } .ab-assist-pbtn { padding: 6px 14px; border-radius: calc(8px * var(--ab-radius,1)); font-size:calc(12px * var(--ab-fs,1)); cursor: pointer; border: 1px solid var(--accent); background: color-mix(in srgb, var(--accent) 8%, transparent); color: var(--accent); font-weight: 600; } .ab-assist-pbtn.ghost { border-color: var(--border, #e5e7eb); background: transparent; color: var(--text-secondary, #444); font-weight: 400; } .ab-assist-pbtn.danger { border-color: #fecaca; background: rgba(239,68,68,0.06); color: #dc2626; font-weight: 400; } .ab-assist-empty { font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); padding: 10px 0; } /* 能力选择 chips */ .ab-ability-chips { display: flex; flex-wrap: wrap; gap: 6px; } .ab-ability-chip { padding: 5px 10px; border-radius: 999px; font-size:calc(11.5px * var(--ab-fs,1)); cursor: pointer; border: 1px solid var(--border, #e5e7eb); background: var(--card-bg, #fff); color: var(--text-secondary, #444); } .ab-ability-chip.on { border-color: var(--accent); color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, transparent); } /* 远程通道列表 */ .ab-ch-note { font-size:calc(13px * var(--ab-fs,1)); font-weight: 700; color: var(--text-primary); margin-bottom: 4px; } .ab-ch-note span { display: block; margin-top: 3px; font-size:calc(11.5px * var(--ab-fs,1)); font-weight: 400; color: var(--text-muted); line-height: 1.7; } /* 官方小程序通道卡片（远程通道页顶部） */ .ab-mp-official { display: flex; align-items: center; gap: 16px; padding: 16px 18px; margin-bottom: 14px; border-radius: calc(12px * var(--ab-radius,1)); border: 1px solid var(--brand-color, var(--accent-hover)); /* v186：原 var(--bg-card) 变量未定义 → fallback #fff 导致深色下白卡片，改用已定义的 --card-bg */ background: var(--card-bg, rgba(255,255,255,0.04)); } .ab-mp-official-text { flex: 1; min-width: 0; } .ab-mp-official-title { font-size:calc(15px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary); margin-bottom: 5px; } .ab-mp-official-desc { font-size:calc(12.5px * var(--ab-fs,1)); color: var(--text-muted); line-height: 1.6; margin-bottom: 8px; } .ab-mp-official-tag { display: inline-block; font-size:calc(11px * var(--ab-fs,1)); font-weight: 600; padding: 2px 9px; border-radius: calc(20px * var(--ab-radius,1)); color: #fff; background: var(--brand-color, var(--accent-hover)); } .ab-mp-official-code { width: 108px; height: 108px; border-radius: calc(10px * var(--ab-radius,1)); flex-shrink: 0; border: 1px solid var(--border, #e5e7eb); object-fit: cover; background: #fff; } .ab-ch-item { display: flex; align-items: center; gap: 10px; padding: 10px 12px; margin-top: 8px; border: 1px solid var(--border, #e5e7eb); border-radius: calc(10px * var(--ab-radius,1)); background: var(--card-bg, #fff); } .ab-ch-item.on { border-color: color-mix(in srgb, var(--accent) 45%, transparent); background: color-mix(in srgb, var(--accent) 5%, transparent); } .ab-ch-item.slim { padding: 8px 10px; margin-top: 6px; } .ab-ch-ico { display: inline-flex; color: var(--text-secondary, #444); flex-shrink: 0; align-items: center; justify-content: center; } .ab-ch-ico svg { width: 18px; height: 18px; } .ab-ch-logo { width: 22px; height: 22px; object-fit: contain; border-radius: calc(5px * var(--ab-radius,1)); display: block; } .ab-ch-body { flex: 1 1 auto; min-width: 0; } .ab-ch-name { font-size:calc(12.5px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary); display: flex; align-items: center; gap: 6px; } .ab-ch-desc { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); margin-top: 2px; line-height: 1.6; } .ab-ch-risk { font-size:calc(10px * var(--ab-fs,1)); font-weight: 600; padding: 1px 6px; border-radius: 999px; border: 1px solid #fcd34d; color: #b45309; background: rgba(251,191,36,0.12); } .ab-ch-warn { margin-top: 4px; font-size:calc(11px * var(--ab-fs,1)); color: #b45309; } .ab-ch-act { flex-shrink: 0; padding: 5px 12px; border-radius: calc(8px * var(--ab-radius,1)); font-size:calc(11.5px * var(--ab-fs,1)); cursor: pointer; border: 1px solid var(--border, #e5e7eb); background: var(--card-bg, #fff); color: var(--text-secondary, #444); } .ab-ch-act:hover { border-color: var(--accent); color: var(--accent); } .ab-ch-act.on { border-color: var(--accent); color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, transparent); } .ab-cron-item { display: flex; align-items: center; gap: 8px; padding: 7px 10px; margin-top: 6px; border: 1px solid var(--border, #e5e7eb); border-radius: calc(8px * var(--ab-radius,1)); font-size:calc(12px * var(--ab-fs,1)); } .ab-cron-item code { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); } /* ===== v150 设置中心「通道」页签 ===== */ .ab-ch-on { font-size:calc(10px * var(--ab-fs,1)); font-weight: 600; padding: 1px 6px; border-radius: 999px; border: 1px solid color-mix(in srgb, var(--accent) 50%, transparent); color: var(--accent); background: color-mix(in srgb, var(--accent) 12%, transparent); } .ab-ch-off { font-size:calc(10px * var(--ab-fs,1)); font-weight: 400; padding: 1px 6px; border-radius: 999px; border: 1px solid var(--border, #e5e7eb); color: var(--text-muted); background: transparent; } .ab-ch-fields { display: flex; flex-direction: column; gap: 8px; } .ab-ch-field { display: flex; flex-direction: column; gap: 4px; } .ab-ch-field > span { font-size:calc(11.5px * var(--ab-fs,1)); color: var(--text-muted); } .ab-ch-field .ab-set-input { width: 100%; box-sizing: border-box; } .ab-set-acts { display: flex; gap: 8px; flex-wrap: wrap; } /* v155：点「配置」后配置区自动滚入视野，并轻高亮一次提示位置 */ @keyframes abChCfgFlash { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--accent) 0%, transparent); } 35% { box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent); } 100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--accent) 0%, transparent); } } .ab-ch-cfg-flash { animation: abChCfgFlash 1.2s ease-out 1; border-radius: calc(10px * var(--ab-radius,1)); } /* v156：配置面板标题（「微信小程序 · 配置」）加粗绿色，一眼看清正在配哪个通道 */ .ab-ch-cfg-title { font-size:calc(14px * var(--ab-fs,1)); font-weight: 700; color: var(--accent); letter-spacing: .2px; } /* ==================== v157 深色模式协调（亮灰文字 / 深色透明卡片 / 绿色细滚动条） ==================== */ /* --- 1&2. 聊天回复 + 产物文档：纯白 → 亮灰（仅深色，浅色不动） --- */ :root:not(.ab-light) .ab-bubble-bot, :root:not(.ab-light) .ab-bubble-bot .ab-bubble-text, :root:not(.ab-light) .ab-msg-text, :root:not(.ab-light) .ab-art-pv-doc, :root:not(.ab-light) .ab-art-pv-title, :root:not(.ab-light) .ab-artifact-name, :root:not(.ab-light) .ab-af-title, :root:not(.ab-light) .ab-af-field label, :root:not(.ab-light) .ab-af-input, :root:not(.ab-light) .ab-wstep-ok { color: #c6c9d4; } /* 标题层级保留略亮一档，区分正文 */ :root:not(.ab-light) .ab-bubble h1, :root:not(.ab-light) .ab-bubble h2, :root:not(.ab-light) .ab-bubble h3, :root:not(.ab-light) .ab-bubble h4, :root:not(.ab-light) .ab-art-pv-doc h1, :root:not(.ab-light) .ab-art-pv-doc h2, :root:not(.ab-light) .ab-art-pv-doc h3 { color: #e2e5ec; } /* --- 3. 工具/表单卡片：白底 → 深色半透明 --- */ :root:not(.ab-light) .ab-plan-card, /* 执行计划确认卡 */ :root:not(.ab-light) .ab-rcard, /* 富交互卡片 */ :root:not(.ab-light) .ab-ask-form, /* 生产资料补料表单 */ :root:not(.ab-light) .ab-af-field, /* 表单字段卡 */ :root:not(.ab-light) .ab-summary-card, /* 本轮总结卡 */ :root:not(.ab-light) .ab-sc-chip, /* 下一步建议按钮 */ :root:not(.ab-light) .ab-pc-accept, :root:not(.ab-light) .ab-pc-adjust, :root:not(.ab-light) .ab-jump-bottom, :root:not(.ab-light) .ab-ability-chip, :root:not(.ab-light) .ab-ref-item, :root:not(.ab-light) .ab-artifact-item, :root:not(.ab-light) .ab-ch-item, :root:not(.ab-light) .ab-ch-act, :root:not(.ab-light) .ab-assist-form input, :root:not(.ab-light) .ab-assist-form textarea { background: rgba(255,255,255,0.04); } /* 深色下卡片边框/次级文字微调 */ :root:not(.ab-light) .ab-sc-chip, :root:not(.ab-light) .ab-pc-adjust, :root:not(.ab-light) .ab-ability-chip, :root:not(.ab-light) .ab-ch-act { color: #c6c9d4; } /* 总结卡保留绿调但压暗 */ :root:not(.ab-light) .ab-summary-card { background: color-mix(in srgb, var(--accent) 8%, transparent); border-left-color: var(--accent); } :root:not(.ab-light) .ab-sc-head { color: var(--accent); } :root:not(.ab-light) .ab-sc-chip:hover, :root:not(.ab-light) .ab-pc-adjust:hover { border-color: var(--accent); color: var(--accent); background: color-mix(in srgb, var(--accent) 10%, transparent); } :root:not(.ab-light) .ab-pc-accept { color: var(--accent); } /* 代码复制钮（深色） */ :root:not(.ab-light) .ab-code-copy { background: rgba(255,255,255,0.08); border-color: color-mix(in srgb, var(--accent) 18%, transparent); color: #a9adc4; } /* --- 4. 绿色细滚动条：聊天窗 + 产物列表 + 产物详情（深色） --- */ :root:not(.ab-light) .ab-messages, :root:not(.ab-light) .ab-art-list, :root:not(.ab-light) .ab-art-side-list, :root:not(.ab-light) .ab-art-pv-body, :root:not(.ab-light) .ab-side-list, :root:not(.ab-light) .ab-lib-doclist, :root:not(.ab-light) .ab-lib-docview, :root:not(.ab-light) .ab-assist-pane { scrollbar-width: thin; scrollbar-color: var(--scrollbar-thumb) transparent; } :root:not(.ab-light) .ab-messages::-webkit-scrollbar, :root:not(.ab-light) .ab-art-list::-webkit-scrollbar, :root:not(.ab-light) .ab-art-side-list::-webkit-scrollbar, :root:not(.ab-light) .ab-art-pv-body::-webkit-scrollbar, :root:not(.ab-light) .ab-side-list::-webkit-scrollbar, :root:not(.ab-light) .ab-lib-doclist::-webkit-scrollbar, :root:not(.ab-light) .ab-lib-docview::-webkit-scrollbar, :root:not(.ab-light) .ab-assist-pane::-webkit-scrollbar { width: 5px; height: 5px; } :root:not(.ab-light) .ab-messages::-webkit-scrollbar-track, :root:not(.ab-light) .ab-art-list::-webkit-scrollbar-track, :root:not(.ab-light) .ab-art-side-list::-webkit-scrollbar-track, :root:not(.ab-light) .ab-art-pv-body::-webkit-scrollbar-track, :root:not(.ab-light) .ab-side-list::-webkit-scrollbar-track, :root:not(.ab-light) .ab-lib-doclist::-webkit-scrollbar-track, :root:not(.ab-light) .ab-lib-docview::-webkit-scrollbar-track, :root:not(.ab-light) .ab-assist-pane::-webkit-scrollbar-track { background: transparent; } :root:not(.ab-light) .ab-messages::-webkit-scrollbar-thumb, :root:not(.ab-light) .ab-art-list::-webkit-scrollbar-thumb, :root:not(.ab-light) .ab-art-side-list::-webkit-scrollbar-thumb, :root:not(.ab-light) .ab-art-pv-body::-webkit-scrollbar-thumb, :root:not(.ab-light) .ab-side-list::-webkit-scrollbar-thumb, :root:not(.ab-light) .ab-lib-doclist::-webkit-scrollbar-thumb, :root:not(.ab-light) .ab-lib-docview::-webkit-scrollbar-thumb, :root:not(.ab-light) .ab-assist-pane::-webkit-scrollbar-thumb { background: var(--scrollbar-thumb); border-radius: calc(3px * var(--ab-radius,1)); } :root:not(.ab-light) .ab-messages::-webkit-scrollbar-thumb:hover, :root:not(.ab-light) .ab-art-pv-body::-webkit-scrollbar-thumb:hover { background: var(--scrollbar-thumb-hover); } /* ==================== v158：历史问答竖条不再遮挡聊天滚动条 ==================== */ /* v158b：竖条左移进消息区内侧（滚动条左缘约 view右缘-6px，竖条 right:13px 让开），padding-right 容纳竖条 */ .ab-urail { right: 13px; } .ab-messages { padding-right: 40px; } /* v158c：聊天滚动条加粗加深（之前 5px/0.35 太浅看不见） */ :root:not(.ab-light) .ab-messages::-webkit-scrollbar { width: 7px; } :root:not(.ab-light) .ab-messages::-webkit-scrollbar-thumb { background: color-mix(in srgb, var(--accent) 60%, transparent); border-radius: calc(4px * var(--ab-radius,1)); } :root:not(.ab-light) .ab-messages::-webkit-scrollbar-thumb:hover { background: color-mix(in srgb, var(--accent) 85%, transparent); } /* v158d：浅色模式聊天滚动条也用绿色细条（原先无浅色规则，落在 v157 深色选择器之外默认灰） */ :root.ab-light .ab-messages, :root.ab-light .ab-art-list, :root.ab-light .ab-art-side-list, :root.ab-light .ab-art-pv-body, :root.ab-light .ab-side-list, :root.ab-light .ab-lib-doclist, :root.ab-light .ab-lib-docview, :root.ab-light .ab-assist-pane { scrollbar-width: thin; scrollbar-color: var(--scrollbar-thumb) transparent; } :root.ab-light .ab-messages::-webkit-scrollbar, :root.ab-light .ab-art-list::-webkit-scrollbar, :root.ab-light .ab-art-side-list::-webkit-scrollbar, :root.ab-light .ab-art-pv-body::-webkit-scrollbar, :root.ab-light .ab-side-list::-webkit-scrollbar, :root.ab-light .ab-lib-doclist::-webkit-scrollbar, :root.ab-light .ab-lib-docview::-webkit-scrollbar, :root.ab-light .ab-assist-pane::-webkit-scrollbar { width: 6px; height: 6px; } :root.ab-light .ab-messages::-webkit-scrollbar-track, :root.ab-light .ab-art-list::-webkit-scrollbar-track, :root.ab-light .ab-art-pv-body::-webkit-scrollbar-track, :root.ab-light .ab-lib-doclist::-webkit-scrollbar-track, :root.ab-light .ab-lib-docview::-webkit-scrollbar-track { background: transparent; } :root.ab-light .ab-messages::-webkit-scrollbar-thumb, :root.ab-light .ab-art-list::-webkit-scrollbar-thumb, :root.ab-light .ab-art-side-list::-webkit-scrollbar-thumb, :root.ab-light .ab-art-pv-body::-webkit-scrollbar-thumb, :root.ab-light .ab-side-list::-webkit-scrollbar-thumb, :root.ab-light .ab-lib-doclist::-webkit-scrollbar-thumb, :root.ab-light .ab-lib-docview::-webkit-scrollbar-thumb, :root.ab-light .ab-assist-pane::-webkit-scrollbar-thumb { background: var(--scrollbar-thumb); border-radius: calc(3px * var(--ab-radius,1)); } :root.ab-light .ab-messages::-webkit-scrollbar-thumb:hover, :root.ab-light .ab-art-pv-body::-webkit-scrollbar-thumb:hover { background: var(--scrollbar-thumb-hover); } /* v158e：深色模式用户气泡改柔和透明绿（原实心渐变 #4ade80→#22c55e 太刺眼） */ :root:not(.ab-light) .ab-bubble-user { background: color-mix(in srgb, var(--accent) 18%, transparent); border: 1px solid color-mix(in srgb, var(--accent) 32%, transparent); color: #d7f0e0; } /* ==================== v159：任务/产物删除功能 ==================== */ /* 产物左栏行内删除钮（默认隐藏，hover 行显示） */ .ab-art-file { position: relative; } .ab-art-del { flex-shrink: 0; width: 18px; height: 18px; border: none; border-radius: calc(4px * var(--ab-radius,1)); background: transparent; color: var(--text-muted); font-size:calc(11px * var(--ab-fs,1)); line-height: 1; cursor: pointer; opacity: 0; transition: opacity .15s, background .15s, color .15s; display: inline-flex; align-items: center; justify-content: center; margin-left: 4px; } .ab-art-file:hover .ab-art-del { opacity: 1; } .ab-art-del:hover { background: rgba(239,68,68,0.12); color: #ef4444; } /* 右键菜单危险项（删除） */ .ab-art-ctx-danger { color: #ef4444 !important; } .ab-art-ctx-danger:hover { background: rgba(239,68,68,0.10) !important; } /* 任务删除钮危险色（已有 .ab-task-op.danger，补 hover 红） */ .ab-task-op.danger:hover { background: rgba(239,68,68,0.12); border-color: #ef4444; color: #ef4444; } /* v161 授权页激活码输入框：浅绿底双主题统一 */ #licCodeInput { background: color-mix(in srgb, var(--accent) 12%, transparent) !important; border: 1px solid color-mix(in srgb, var(--accent) 45%, transparent) !important; border-radius: calc(10px * var(--ab-radius,1)); color: inherit; transition: border-color .15s, box-shadow .15s; } #licCodeInput:focus { outline: none; border-color: var(--accent-hover) !important; box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent); background: color-mix(in srgb, var(--accent) 16%, transparent) !important; } #licCodeInput::placeholder { color: rgba(100,116,139,0.7); } /* ========== v189：子代理嵌套 · 子任务卡片 ========== */ .ab-subcards { display: flex; flex-direction: column; gap: 8px; margin: 10px 0 4px; } .ab-subcard { border: 1px solid var(--border, rgba(0,0,0,.08)); border-left: 2px solid var(--accent); border-radius: calc(8px * var(--ab-radius,1)); padding: 8px 10px; background: var(--card-bg, rgba(0,0,0,.02)); } .ab-subcard.is-done { border-left-color: var(--accent); } .ab-subcard-head { display: flex; align-items: center; gap: 8px; } .ab-subcard-dot { width: 7px; height: 7px; border-radius: 50%; flex: none; border: 1.5px solid var(--accent); background: transparent; } .ab-subcard.is-done .ab-subcard-dot { background: var(--accent); } .ab-subcard-label { font-size:calc(12.5px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary); flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .ab-subcard-type { font-size:calc(10px * var(--ab-fs,1)); padding: 1px 6px; border-radius: 999px; flex: none; color: var(--accent); border: 1px solid var(--accent); opacity: .85; } .ab-subcard-status { font-size:calc(10.5px * var(--ab-fs,1)); color: var(--text-muted); flex: none; } .ab-subcard.is-done .ab-subcard-status { color: var(--accent); } .ab-subcard-steps { margin-top: 6px; display: flex; flex-direction: column; gap: 3px; } .ab-subcard-steps.collapsed { display: none; } .ab-substep { font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); line-height: 1.5; padding-left: 15px; position: relative; } .ab-substep::before { content: ''; position: absolute; left: 5px; top: 7px; width: 4px; height: 4px; border-radius: 50%; border: 1px solid var(--accent); } .ab-subcard-done { margin-top: 6px; font-size:calc(11.5px * var(--ab-fs,1)); color: var(--text-secondary); line-height: 1.6; white-space: pre-wrap; word-break: break-word; } /* v190 P3：复核标记与复核意见 */ .ab-subcard.is-critiqued .ab-subcard-status { color: var(--accent); font-weight: 600; } .ab-subcard.is-critiqued .ab-subcard-status::before { content: '✓ '; } .ab-subcard-critique { margin-top: 6px; padding: 5px 8px; border-radius: calc(6px * var(--ab-radius,1)); border: 1px dashed var(--accent); background: transparent; font-size:calc(10.5px * var(--ab-fs,1)); color: var(--text-muted); line-height: 1.55; } /* ========== v304 P9a：子代理「并行面板」增强（总览条 + 运行/失败三态 + 耗时） ========== */ /* 并行总览条：压在子任务卡列表上方，直观呈现「本批派了几个、几个在跑、几个完成/失败」 */ .ab-subpar { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin: 10px 0 2px; padding: 6px 10px; border: 1px solid var(--border, color-mix(in srgb, var(--accent) 15%, transparent)); border-radius: calc(8px * var(--ab-radius,1)); background: var(--card-bg, rgba(255,255,255,.04)); font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); } .ab-subpar-glyph { color: var(--accent); font-size:calc(12px * var(--ab-fs,1)); line-height: 1; } .ab-subpar.is-busy .ab-subpar-glyph { animation: abSubSpin 1.4s linear infinite; } @keyframes abSubSpin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } .ab-subpar-title { color: var(--text-secondary); font-weight: 600; } .ab-subpar-stat { color: var(--text-muted); } .ab-subpar-stat b { color: var(--accent); font-weight: 700; } .ab-subpar-chip { padding: 1px 7px; border-radius: 999px; border: 1px solid currentColor; font-size:calc(10px * var(--ab-fs,1)); line-height: 1.5; } .ab-subpar-chip.run { color: var(--accent); } .ab-subpar-chip.done { color: var(--success); } .ab-subpar-chip.err { color: var(--error, #ef4444); } .ab-subpar-hint { margin-left: auto; color: var(--text-muted); opacity: .8; } .ab-subpar.is-busy .ab-subpar-hint { color: var(--accent); opacity: 1; } /* 子代理角色符号（线性几何符号，禁实心/emoji） */ .ab-subcard-glyph { flex: none; color: var(--accent); font-size:calc(11px * var(--ab-fs,1)); line-height: 1; opacity: .9; } /* 运行中：空心点 + 呼吸脉冲（与 is-done 实心绿区分） */ .ab-subcard.is-running { border-left-color: var(--accent); } /* P38-3.2：取消卡片大面积扫光，只让标题文字扫过白色光线 */ .ab-subcard.is-running .ab-subcard-label { background: linear-gradient(110deg, color-mix(in srgb, var(--text-primary, #111) 90%, transparent) 0%, color-mix(in srgb, var(--text-primary, #111) 90%, transparent) 35%, rgba(255, 255, 255, 0.96) 50%, color-mix(in srgb, var(--text-primary, #111) 90%, transparent) 65%, color-mix(in srgb, var(--text-primary, #111) 90%, transparent) 100%); background-size: 200% 100%; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; animation: ab-shining-text-sweep 2.2s linear infinite; } .ab-subcard.is-running .ab-subcard-dot { border-color: var(--accent); animation: abSubPulse 1.2s ease-in-out infinite; } @keyframes abSubPulse { 0%,100% { opacity: 1; } 50% { opacity: .28; } } /* 失败/跳过：红左边框 + 红点 + 红状态字（旧版一律绿勾，真失败被伪装成成功） */ .ab-subcard.is-error { border-left-color: var(--error, #ef4444); } .ab-subcard.is-error .ab-subcard-dot { border-color: var(--error, #ef4444); background: var(--error, #ef4444); } .ab-subcard.is-error .ab-subcard-status { color: var(--error, #ef4444); } .ab-subcard.is-error .ab-subcard-glyph { color: var(--error, #ef4444); } /* 耗时（子任务右侧细字） */ .ab-subcard-dur { font-size:calc(10px * var(--ab-fs,1)); color: var(--text-muted); flex: none; } /* ===== v305 P9b：交叉检查卡（结论结构化：通过/发现问题 + 分条清单） ===== */ .ab-subcard.is-crosscheck { border-left-color: var(--accent); } .ab-subcard.is-crosscheck .ab-subcard-done { margin-top: 4px; } .ab-sub-xbadge { display: inline-block; margin: 2px 0 6px; padding: 2px 8px; border-radius: 999px; font-size:calc(10.5px * var(--ab-fs,1)); border: 1px solid currentColor; } .ab-sub-xbadge.is-pass { color: var(--success); } .ab-sub-xbadge.is-warn { color: var(--warn, #f59e0b); } .ab-sub-xlist { display: flex; flex-direction: column; gap: 3px; } .ab-sub-xitem { font-size:calc(11.5px * var(--ab-fs,1)); line-height: 1.6; color: var(--text-secondary, #a9adc4); padding-left: 14px; position: relative; } .ab-sub-xitem::before { content: '·'; position: absolute; left: 4px; top: 0; color: var(--warn, #f59e0b); } /* ===== v307 P9d：子代理执行时间线（横向甘特，看清并行区间与耗时差）===== */ .ab-subtimeline { margin: 8px 0 4px; padding: 8px 10px; border-radius: calc(8px * var(--ab-radius,1)); border: 1px solid var(--border, color-mix(in srgb, var(--accent) 15%, transparent)); background: var(--card-bg, rgba(0,0,0,.02)); } .ab-stl-head { font-size:calc(10.5px * var(--ab-fs,1)); color: var(--text-muted); margin-bottom: 6px; letter-spacing: .3px; } .ab-stl-row { display: flex; align-items: center; gap: 8px; margin: 3px 0; } .ab-stl-name { flex: none; width: 96px; font-size:calc(11px * var(--ab-fs,1)); color: var(--text-secondary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .ab-stl-track { flex: 1 1 auto; position: relative; height: 10px; border-radius: calc(5px * var(--ab-radius,1)); background: var(--bg-tertiary, rgba(0,0,0,.06)); } .ab-stl-bar { position: absolute; top: 0; height: 100%; border-radius: calc(5px * var(--ab-radius,1)); } /* v325：时间线进度条调淡浅绿（原 --accent 太亮刺眼，抢正文焦点） */ .ab-stl-bar.run { background: color-mix(in srgb, var(--accent) 45%, transparent); } .ab-stl-bar.done { background: color-mix(in srgb, var(--accent) 50%, transparent); } .ab-stl-bar.err { background: rgba(252,165,165,0.55); } .ab-stl-dur { flex: none; width: 40px; text-align: right; font-size:calc(10.5px * var(--ab-fs,1)); color: var(--text-muted); } /* ===== P39 多子代理协同实时反馈（GW.041）===== */ /* P39-4 委派链路条：主代理 ◎ → 派发 N → 子代理执行 → 回传 M → 主代理汇总 */ .ab-subchain { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin: 8px 0 0; padding: 6px 10px; border-radius: calc(8px * var(--ab-radius,1)); background: var(--bg-secondary, rgba(0,0,0,.03)); font-size:calc(10.5px * var(--ab-fs,1)); } .ab-sch-seg { flex: none; padding: 2px 7px; border-radius: 999px; background: var(--bg-tertiary, rgba(0,0,0,.05)); color: var(--text-secondary); white-space: nowrap; } .ab-sch-seg.main { color: var(--text-primary); font-weight: 600; } .ab-sch-seg.dispatch { background: color-mix(in srgb, var(--accent) 10%, transparent); } .ab-sch-seg.run { color: var(--accent); background: color-mix(in srgb, var(--accent) 12%, transparent); } .ab-sch-seg.back { color: var(--success); background: color-mix(in srgb, var(--success) 12%, transparent); } .ab-sch-seg.warn { color: var(--warn, #f59e0b); background: rgba(245,158,11,0.12); } .ab-sch-seg.sum { color: var(--accent); background: color-mix(in srgb, var(--accent) 14%, transparent); } .ab-sch-arrow { flex: none; color: var(--text-muted); opacity: .45; } .ab-sch-arrow.on { color: var(--accent); opacity: 1; } /* P39-2 六态状态灯：queued / tool / critique 三态为新增（running / done / error 沿用既有样式） */ .ab-subcard.is-queued { border-left-color: var(--text-muted); } .ab-subcard.is-queued .ab-subcard-dot { border-color: var(--text-muted); } .ab-subcard.is-queued .ab-subcard-status { color: var(--text-muted); } .ab-subcard.is-tool { border-left-color: #3b82f6; } .ab-subcard.is-tool .ab-subcard-dot { border-color: #3b82f6; background: #3b82f6; } .ab-subcard.is-tool .ab-subcard-status { color: #3b82f6; } .ab-subcard.is-critique { border-left-color: var(--warn, #f59e0b); } .ab-subcard.is-critique .ab-subcard-dot { border-color: var(--warn, #f59e0b); animation: abSubPulse 1.2s ease-in-out infinite; } .ab-subcard.is-critique .ab-subcard-status { color: var(--warn, #f59e0b); } .ab-subcard-status.is-tick { font-variant-numeric: tabular-nums; } /* P39-3 回传卡手动展开：线性符号开关，禁实心按钮 */ .ab-subcard-toggle { display: inline-flex; align-items: center; gap: 4px; margin-top: 6px; cursor: pointer; user-select: none; font-size:calc(10.5px * var(--ab-fs,1)); color: var(--text-muted); } .ab-subcard-toggle:hover { color: var(--accent); } .ab-subcard-toggle.is-open { color: var(--accent); } /* GW.042 · P39-5b 单子代理重派（↻）：线性符号入口（禁实心按钮）；未落定（排队/执行/工具/复核中）时隐藏，避免重跑中途误触 */ .ab-subcard-redo { flex: none; margin-left: 2px; padding: 0 6px; border-radius: 999px; cursor: pointer; user-select: none; font-size:calc(10.5px * var(--ab-fs,1)); line-height: 1.7; color: var(--text-muted); white-space: nowrap; border: 1px solid var(--border, color-mix(in srgb, var(--accent) 18%, transparent)); } .ab-subcard-redo:hover { color: var(--accent); border-color: var(--accent); } .ab-subcard-redo.is-armed { color: var(--warn, #f59e0b); border-color: var(--warn, #f59e0b); } .ab-subcard-redo.is-busy { color: var(--accent); border-color: var(--accent); opacity: .7; cursor: default; } .ab-subcard:not(.is-done):not(.is-error) .ab-subcard-redo { display: none; } /* P39-5b：重派后主代理汇总（另起一块，不改写那一轮原文正文） */ .ab-subredo-sum { margin: 8px 0 0; padding: 8px 10px; border-radius: calc(8px * var(--ab-radius,1)); background: var(--bg-secondary, rgba(0,0,0,.03)); border-left: 2px solid var(--accent); } .ab-subredo-sum-head { font-size:calc(11px * var(--ab-fs,1)); color: var(--accent); font-weight: 600; } .ab-subredo-sum-body { margin-top: 4px; font-size:calc(12.5px * var(--ab-fs,1)); color: var(--text-secondary); line-height: 1.65; white-space: pre-wrap; } /* ===== v307 P9d：会话收藏星标 + 标签 chips ===== */ .ab-sess-star { color: var(--warn, #f59e0b); margin-right: 4px; font-size:calc(12px * var(--ab-fs,1)); } .ab-sess-tags { display: flex; flex-wrap: wrap; gap: 3px; margin-top: 3px; } .ab-sess-tags i { font-style: normal; font-size:calc(9.5px * var(--ab-fs,1)); line-height: 1.5; padding: 0 5px; border-radius: 999px; border: 1px solid var(--border, color-mix(in srgb, var(--accent) 25%, transparent)); color: var(--text-muted); } /* C.355【2026-11-06 老板令】会话所属部门标签：线性描边 + 强调色，和普通标签一眼区分 */ .ab-sess-tags i.ab-sess-dept { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 55%, transparent); background: color-mix(in srgb, var(--accent) 7%, transparent); } /* ===== v307 P9d：页面级轻提示条（顶部居中，3.5s 淡出）===== */ .ab-tipbar { position: fixed; left: 50%; top: 16px; transform: translate(-50%, -8px); max-width: min(560px, 88vw); padding: 8px 14px; border-radius: calc(10px * var(--ab-radius,1)); background: var(--card-bg, rgba(18,20,31,.96)); color: var(--text-primary, #e0e0e0); border: 1px solid var(--accent); font-size:calc(12.5px * var(--ab-fs,1)); line-height: 1.5; z-index: 99998; opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s; } .ab-tipbar.show { opacity: 1; transform: translate(-50%, 0); } /* ===== v316：执行过程「灰蒙版工作区」（1:1 复刻 WorkBuddy）===== 位于输入框上方：执行中实时显示当前步骤（小图标 + 标题 + 细节），收尾自动收起。 */ .ab-workzone { max-height: 0; opacity: 0; overflow: hidden; margin: 0; padding: 0 12px; border-radius: calc(10px * var(--ab-radius,1)) calc(10px * var(--ab-radius,1)) 0 0; background: var(--bg-tertiary, rgba(0,0,0,.04)); border: 1px solid var(--border, color-mix(in srgb, var(--accent) 14%, transparent)); border-bottom: none; transition: max-height .2s, opacity .2s, padding .2s; } .ab-workzone.show { max-height: 140px; opacity: 1; padding: 8px 12px; overflow-y: auto; } .ab-wz-head { font-size:calc(12px * var(--ab-fs,1)); color: var(--text-secondary); line-height: 1.6; display: flex; align-items: baseline; gap: 6px; font-weight: 500; } .ab-wz-body { margin-top: 4px; font-size:calc(11.5px * var(--ab-fs,1)); color: var(--text-muted); line-height: 1.65; max-height: 88px; overflow-y: auto; } /* ===== v308 P9e：语音输入按钮 ===== */ .ab-voice-btn { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: calc(8px * var(--ab-radius,1)); cursor: pointer; border: 1px solid var(--border, color-mix(in srgb, var(--accent) 18%, transparent)); background: transparent; color: var(--text-muted); } .ab-voice-btn:hover { color: var(--accent); border-color: var(--accent); } .ab-voice-btn.on { color: #fff; background: var(--error, #ef4444); border-color: var(--error, #ef4444); animation: abVoicePulse 1.4s ease-in-out infinite; } @keyframes abVoicePulse { 0%,100% { opacity: 1 } 50% { opacity: .6 } } /* ===== v308 P9e：提示词模板库弹层 ===== */ .ab-plib { position: fixed; inset: 0; background: rgba(0,0,0,.45); display: flex; align-items: flex-start; justify-content: center; padding-top: 9vh; z-index: 100000; } .ab-plib-card { width: min(720px, 92vw); max-height: 74vh; display: flex; flex-direction: column; border-radius: calc(14px * var(--ab-radius,1)); overflow: hidden; background: var(--bg-secondary, #12141f); border: 1px solid var(--border, color-mix(in srgb, var(--accent) 18%, transparent)); box-shadow: 0 12px 40px rgba(0,0,0,.35); } .ab-plib-hd { display: flex; align-items: center; gap: 8px; padding: 12px 14px; border-bottom: 1px solid var(--border, color-mix(in srgb, var(--accent) 15%, transparent)); font-size:calc(13px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary); } .ab-plib-cnt { font-size:calc(11px * var(--ab-fs,1)); font-weight: 400; color: var(--text-muted); } .ab-plib-x { margin-left: auto; border: none; background: transparent; color: var(--text-muted); cursor: pointer; } .ab-plib-search { margin: 10px 14px 6px; padding: 8px 10px; border-radius: calc(8px * var(--ab-radius,1)); border: 1px solid var(--border, color-mix(in srgb, var(--accent) 18%, transparent)); background: var(--bg-primary, #0a0c15); color: var(--text-primary); font-size:calc(12.5px * var(--ab-fs,1)); outline: none; } .ab-plib-search:focus { border-color: var(--accent); } .ab-plib-cats { display: flex; flex-wrap: wrap; gap: 6px; padding: 6px 14px 4px; } .ab-plib-cat { border: 1px solid var(--border, color-mix(in srgb, var(--accent) 18%, transparent)); background: transparent; color: var(--text-muted); font-size:calc(11px * var(--ab-fs,1)); padding: 2px 9px; border-radius: 999px; cursor: pointer; } .ab-plib-cat.on { color: var(--accent); border-color: var(--accent); } .ab-plib-list { flex: 1 1 auto; overflow-y: auto; padding: 6px 14px 14px; display: flex; flex-direction: column; gap: 6px; } .ab-plib-item { display: flex; align-items: center; gap: 8px; text-align: left; padding: 8px 10px; border-radius: calc(8px * var(--ab-radius,1)); cursor: pointer; border: 1px solid var(--border, color-mix(in srgb, var(--accent) 12%, transparent)); background: transparent; } .ab-plib-item:hover { border-color: var(--accent); background: var(--accent-light, color-mix(in srgb, var(--accent) 8%, transparent)); } .ab-plib-item b { font-size:calc(12.5px * var(--ab-fs,1)); font-weight: 500; color: var(--text-primary); } .ab-plib-item span { margin-left: auto; font-size:calc(10.5px * var(--ab-fs,1)); color: var(--text-muted); } .ab-plib-empty { padding: 18px; text-align: center; color: var(--text-muted); font-size:calc(12px * var(--ab-fs,1)); } /* ===== v308 P9e：成本用量预估条 ===== */ .ab-cost-hint { margin: 4px 0 0; padding: 0 4px; font-size:calc(10.5px * var(--ab-fs,1)); color: var(--text-muted); opacity: .85; } .ab-cost-hint.is-media { color: var(--warn, #f59e0b); opacity: 1; } /* ===== v308 P9e：快捷键地图分组 ===== */ .ab-shortcut-body { max-height: 62vh; overflow-y: auto; } .ab-shortcut-group { margin: 0 0 10px; } .ab-sc-gname { font-size:calc(10.5px * var(--ab-fs,1)); color: var(--text-muted); letter-spacing: .4px; margin: 8px 0 4px; padding-bottom: 3px; border-bottom: 1px dashed var(--border, color-mix(in srgb, var(--accent) 16%, transparent)); } /* 🔴 v308 P9e：主题包必须一并覆盖「全局背影光」—— 深色默认有 :root:not(.ab-light) body 的硬编码绿色光斑+墨绿渐变（126 行），不覆盖的话 换成 navy 也还是绿的（实测踩到）。这两条**放在文件靠后**，以同权重后定义的方式胜出。 */ :root.ab-theme-navy body { background: radial-gradient(ellipse 640px 500px at 0% 0%, rgba(79,142,247,0.20) 0%, rgba(79,142,247,0.09) 34%, rgba(59,122,224,0.03) 58%, transparent 78%), linear-gradient(135deg, #0a1024 0%, #070b18 38%, #0a1020 62%, #0b1330 100%); background-attachment: fixed; } :root.ab-light.ab-theme-warm body { background: #f7f4ee; background-attachment: fixed; } /* ===== v309：左下角「外观」→ 颜色主题下拉（一个按钮显示当前主题名，点开选 5 档） ===== */ .ab-theme-dd { display: inline-flex; align-items: center; gap: 5px; min-width: 92px; justify-content: space-between; } .ab-theme-dd .ab-td-caret { font-style: normal; font-size:calc(9px * var(--ab-fs,1)); opacity: .7; } .ab-theme-menu { position: fixed; z-index: 100001; min-width: 138px; padding: 5px; border-radius: calc(10px * var(--ab-radius,1)); background: var(--bg-secondary, #12141f); border: 1px solid var(--border, color-mix(in srgb, var(--accent) 20%, transparent)); box-shadow: 0 10px 30px rgba(0,0,0,.35); display: flex; flex-direction: column; gap: 2px; } .ab-tm-item { display: flex; align-items: center; gap: 8px; width: 100%; padding: 6px 9px; border: none; border-radius: calc(7px * var(--ab-radius,1)); cursor: pointer; background: transparent; color: var(--text-primary, #e0e0e0); font-size:calc(12.5px * var(--ab-fs,1)); text-align: left; } .ab-tm-item:hover { background: var(--accent-light, color-mix(in srgb, var(--accent) 10%, transparent)); } .ab-tm-item.on { color: var(--accent); } .ab-tm-dot { width: 11px; height: 11px; border-radius: 50%; flex: none; border: 1px solid rgba(255,255,255,.25); } .ab-tm-system { background: linear-gradient(135deg,#8a93a8,#5a6070); } .ab-tm-dark { background: #10231a; } .ab-tm-light { background: #f4f5fa; } .ab-tm-navy { background: #0f1626; } .ab-tm-warm { background: #e9dcc4; } .ab-tm-ck { margin-left: auto; font-style: normal; font-size:calc(11px * var(--ab-fs,1)); } /* ========== v186：深色模式全局统一「浅绿细滚动条」 ========== 之前只对若干 class 逐个枚举，未覆盖到的元素会掉回系统默认白灰滚动条。 改为全局兜底：深色下所有可滚动元素一律浅绿色细条（Wekbit + Firefox 双写）。 注意：末尾重申设计上需要「隐藏滚动条」的控件，避免被全局规则覆盖后冒出绿条。 */ :root:not(.ab-light) ::-webkit-scrollbar { width: 5px; height: 5px; } :root:not(.ab-light) ::-webkit-scrollbar-track { background: transparent; } :root:not(.ab-light) ::-webkit-scrollbar-thumb { background: var(--scrollbar-thumb, color-mix(in srgb, var(--accent) 55%, transparent)); border-radius: calc(3px * var(--ab-radius,1)); } :root:not(.ab-light) ::-webkit-scrollbar-thumb:hover { background: var(--scrollbar-thumb-hover, color-mix(in srgb, var(--accent) 80%, transparent)); } :root:not(.ab-light) ::-webkit-scrollbar-corner { background: transparent; } /* Firefox */ :root:not(.ab-light) * { scrollbar-width: thin; scrollbar-color: var(--scrollbar-thumb, color-mix(in srgb, var(--accent) 55%, transparent)) transparent; } /* 重申隐藏：这些控件设计上不显示滚动条 */ :root:not(.ab-light) .ab-hotbar-track::-webkit-scrollbar, :root:not(.ab-light) .ab-run-stats::-webkit-scrollbar, :root:not(.ab-light) .ab-w2-modes::-webkit-scrollbar, :root:not(.ab-light) .ab-urail::-webkit-scrollbar { display: none; width: 0; height: 0; } :root:not(.ab-light) .ab-hotbar-track, :root:not(.ab-light) .ab-run-stats, :root:not(.ab-light) .ab-w2-modes, :root:not(.ab-light) .ab-urail { scrollbar-width: none; } /* ===== 远程通道 · 官方小程序绑定码卡片（v191 回注） ===== */ .ab-mp-bind { display: flex; align-items: center; gap: 18px; padding: 18px; border-radius: calc(12px * var(--ab-radius,1)); border: 1px solid var(--accent); background: var(--accent-light); } .ab-mp-bind-left { flex-shrink: 0; text-align: center; } .ab-mp-bind-qr { width: 150px; height: 150px; border-radius: calc(10px * var(--ab-radius,1)); display: block; background: #fff; border: 1px solid var(--border); object-fit: cover; } .ab-mp-bind-code { margin-top: 8px; font-family: ui-monospace, Consolas, monospace; font-size:calc(18px * var(--ab-fs,1)); font-weight: 700; letter-spacing: 3px; color: var(--accent); text-align: center; } .ab-mp-bind-right { flex: 1; min-width: 0; } .ab-mp-bind-status { font-size:calc(13px * var(--ab-fs,1)); font-weight: 700; margin-bottom: 8px; color: var(--text-primary); } .ab-mp-bind-desc { font-size:calc(12.5px * var(--ab-fs,1)); color: var(--text-primary); line-height: 1.7; } @media (max-width: 560px) { .ab-mp-bind { flex-direction: column; align-items: stretch; } .ab-mp-bind-left { margin: 0 auto; } } /* ===== 左下角悬浮助理气泡（1:1 对齐桌面壳浮标 fab.html）===== */ .ab-fab { position: fixed; left: 20px; bottom: 20px; z-index: 9990; width: 320px; height: 120px; cursor: pointer; display: flex; align-items: center; justify-content: flex-start; transition: transform 0.15s; /* v203-fix 真机测试修复：容器是 320×120 透明大矩形，会盖住左下角「账户与设置」按钮 → 用户点不到设置（Playwright 实测 intercepts pointer events）。 容器透传点击，只让图标本身可点（ring/bubble 已 pointer-events:none）。 */ pointer-events: none; } .ab-fab:hover { transform: scale(1.08); } .ab-fab-ring { position: absolute; top: 60px; left: 60px; width: 84px; height: 84px; border-radius: 50%; background: rgba(0,229,255,0.55); transform: translate(-50%,-50%) scale(1); animation: abFabPulse 3s ease-out infinite; pointer-events: none; z-index: 0; } @keyframes abFabPulse { 0% { transform: translate(-50%,-50%) scale(1); opacity: 0.55; } 100% { transform: translate(-50%,-50%) scale(1.45); opacity: 0; } } .ab-fab-icon { position: relative; width: 88px; height: 88px; margin-left: 16px; z-index: 1; object-fit: contain; filter: none; animation: abFabFloat 4s ease-in-out infinite; pointer-events: auto; /* v203-fix：容器透传后，图标本身恢复可点 */ cursor: pointer; } @keyframes abFabFloat { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-6px); } } .ab-fab-bubble { position: absolute; top: 4px; left: 108px; width: max-content; padding: 8px 14px; border-radius: calc(12px * var(--ab-radius,1)) calc(12px * var(--ab-radius,1)) calc(12px * var(--ab-radius,1)) calc(2px * var(--ab-radius,1)); background: rgba(0,229,255,0.92); color: #0a0c15; font-size:calc(11px * var(--ab-fs,1)); font-weight: 600; line-height: 1.5; white-space: nowrap; text-align: center; box-shadow: 0 2px 8px rgba(0,229,255,0.35); pointer-events: none; z-index: 3; display: none; } .ab-fab-bubble.show { display: block; } .ab-fab-bubble::after { content: ''; position: absolute; bottom: -4px; left: 14px; width: 8px; height: 8px; background: rgba(0,229,255,0.92); border-radius: 0 0 calc(8px * var(--ab-radius,1)) 0; transform: rotate(45deg); } /* ============ 亿享·每日签到弹窗（v224：每日500万·连签10天共5000万） ============ */ .ab-checkin-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 4px 0 14px; } .ab-checkin-stat { background: var(--bg-secondary); border: 1px solid var(--border); border-radius: calc(10px * var(--ab-radius,1)); padding: 12px 10px; text-align: center; } .ab-checkin-stat-label { font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); margin-bottom: 5px; } .ab-checkin-stat-val { font-size:calc(18px * var(--ab-fs,1)); font-weight: 700; color: var(--text-primary); } .ab-checkin-stat-val.hot { color: var(--accent); } .ab-checkin-week { display: grid; grid-template-columns: repeat(5, 1fr); gap: 7px; margin-bottom: 14px; } .ab-ck-day { aspect-ratio: 1; border: 1px solid var(--border); border-radius: calc(9px * var(--ab-radius,1)); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; background: var(--bg-secondary); transition: all 0.15s; } .ab-ck-day .d-label { font-size:calc(10.5px * var(--ab-fs,1)); color: var(--text-muted); } .ab-ck-day .d-ico { width: 16px; height: 16px; color: var(--text-muted); } .ab-ck-day.signed { background: var(--accent-light); border-color: var(--accent); } .ab-ck-day.signed .d-label, .ab-ck-day.signed .d-ico { color: var(--accent); } .ab-ck-day.today { border-color: var(--accent); border-width: 2px; box-shadow: 0 0 0 3px var(--accent-light); } .ab-ck-day.today .d-label { color: var(--accent); font-weight: 600; } .ab-checkin-progress { height: 7px; background: var(--bg-secondary); border-radius: 99px; overflow: hidden; border: 1px solid var(--border); } .ab-checkin-progress-fill { height: 100%; background: linear-gradient(90deg, var(--accent), var(--accent-hover)); border-radius: 99px; transition: width 0.4s ease; } .ab-checkin-progress-label { font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); margin: 7px 0 14px; text-align: center; } .ab-checkin-btn-wrap { text-align: center; } .ab-checkin-btn { width: 100%; padding: 11px 0; font-size:calc(14.5px * var(--ab-fs,1)); } .ab-checkin-done { color: var(--accent); font-size:calc(13.5px * var(--ab-fs,1)); font-weight: 600; padding: 11px 0; } .ab-checkin-done.hidden { display: none; } /* ===== v226 签到弹窗重设计（模仿网关 pro-modal：徽章+标题+进度+3统计+10天日历+主按钮） ===== */ .ab-checkin-modal { width: 480px; text-align: center; position: relative; padding: 28px 30px 22px; } .ab-checkin-x { position: absolute; top: 12px; right: 14px; } .ab-ck-badge { display: inline-block; padding: 4px 16px; background: linear-gradient(135deg, #f59e0b, #d97706); border-radius: calc(20px * var(--ab-radius,1)); font-size:calc(11.5px * var(--ab-fs,1)); color: #fff; font-weight: 600; margin-bottom: 10px; } .ab-ck-title { font-size:calc(21px * var(--ab-fs,1)); font-weight: 800; color: var(--text-primary); margin-bottom: 4px; } .ab-ck-sub { font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); margin-bottom: 16px; } .ab-ck-card { background: var(--bg-secondary); border: 1px solid var(--border); border-radius: calc(14px * var(--ab-radius,1)); padding: 16px; margin-bottom: 14px; } .ab-checkin-modal .ab-checkin-progress { margin-bottom: 8px; } .ab-checkin-modal .ab-checkin-progress-label { margin: 0 0 12px; } .ab-checkin-modal .ab-checkin-stats { margin: 0 0 14px; } .ab-checkin-modal .ab-checkin-stat { background: var(--bg-primary); } .ab-checkin-modal .ab-checkin-week { margin-bottom: 14px; } .ab-ck-view { padding: 9px 26px; background: linear-gradient(135deg, var(--accent), var(--accent-hover)); color: #fff; border: none; border-radius: calc(10px * var(--ab-radius,1)); font-size:calc(13px * var(--ab-fs,1)); font-weight: 600; cursor: pointer; transition: all .2s; } .ab-ck-view:hover { transform: translateY(-1px); box-shadow: 0 4px 14px color-mix(in srgb, var(--accent) 30%, transparent); } .ab-ck-note { font-size:calc(10.5px * var(--ab-fs,1)); color: var(--text-muted); margin-top: 12px; line-height: 1.7; } .ab-checkin-modal .ab-checkin-btn { width: auto; padding: 11px 36px; font-size:calc(14px * var(--ab-fs,1)); font-weight: 700; background: linear-gradient(135deg, #f59e0b, #ea580c); border: none; border-radius: 50px; color: #fff; cursor: pointer; transition: all .2s; box-shadow: 0 0 18px rgba(245,158,11,.25); } .ab-checkin-modal .ab-checkin-btn:hover { transform: translateY(-2px); box-shadow: 0 0 26px rgba(245,158,11,.35); } .ab-checkin-modal .ab-checkin-btn:disabled { opacity: .5; cursor: not-allowed; transform: none; } .ab-checkin-modal .ab-checkin-done { display: inline-block; padding: 8px 20px; background: var(--accent-light); border: 1px solid var(--accent); border-radius: calc(20px * var(--ab-radius,1)); color: var(--accent); font-size:calc(13px * var(--ab-fs,1)); font-weight: 600; } .ab-checkin-modal .ab-checkin-done.hidden { display: none; } /* ===== [AB-DOCS-20260919] 关于页·帮助与支持链接（线性图标）+ 白皮书封面「操作文档」入口 ===== */ .ab-set-link { display: inline-flex; align-items: center; gap: 7px; font-size:calc(13px * var(--ab-fs,1)); color: var(--accent); text-decoration: none; padding: 3px 2px; transition: color .18s, transform .18s; } .ab-set-link:hover { color: var(--accent-hover); text-decoration: underline; text-underline-offset: 3px; transform: translateX(2px); } .ab-set-link .ab-ic { width: 15px; height: 15px; } .ab-set-link-main { font-weight: 700; } .ab-set-link-out { font-size:calc(11px * var(--ab-fs,1)); opacity: .7; margin-left: -2px; } .ab-wp-cover-docwrap { margin-top: 16px; } .ab-wp-cover-doc { display: inline-flex; align-items: center; gap: 7px; padding: 8px 22px; border: 1px solid var(--accent); border-radius: 99px; color: var(--accent); font-size:calc(12.5px * var(--ab-fs,1)); font-weight: 600; letter-spacing: .02em; text-decoration: none; background: transparent; transition: all .2s; } .ab-wp-cover-doc:hover { background: color-mix(in srgb, var(--accent) 14%, transparent); transform: translateY(-1px); } .ab-wp-cover-doc .ab-ic { width: 14px; height: 14px; } .ab-wp-cover-doc .ar { font-size:calc(11px * var(--ab-fs,1)); opacity: .8; } /* ========== v247 模型菜单：加宽显示全名 + 三级折叠 + 细滚动条 + 悬停简介卡 ========== */ /* ① 加宽：原 max-width 320px 会把长模型名截断（老板报「显示不全」） */ .ab-inputbar .ab-model-menu { min-width: 360px; max-width: 460px; max-height: 420px; overflow-y: auto; scrollbar-width: thin; scrollbar-color: var(--scrollbar-thumb) transparent; } /* ③ 细滚动条：与项目其它列表一致的 5px（原为此处未定制 → 落到浏览器默认粗条） */ .ab-inputbar .ab-model-menu::-webkit-scrollbar { width: 5px; height: 5px; } .ab-inputbar .ab-model-menu::-webkit-scrollbar-track { background: transparent; } .ab-inputbar .ab-model-menu::-webkit-scrollbar-thumb { background: var(--scrollbar-thumb); border-radius: calc(3px * var(--ab-radius,1)); } .ab-inputbar .ab-model-menu::-webkit-scrollbar-thumb:hover { background: var(--scrollbar-thumb-hover); } .ab-model-alllist { max-height: 300px; overflow-y: auto; scrollbar-width: thin; scrollbar-color: var(--scrollbar-thumb) transparent; } .ab-model-alllist::-webkit-scrollbar { width: 5px; } .ab-model-alllist::-webkit-scrollbar-track { background: transparent; } .ab-model-alllist::-webkit-scrollbar-thumb { background: var(--scrollbar-thumb); border-radius: calc(3px * var(--ab-radius,1)); } .ab-model-alllist::-webkit-scrollbar-thumb:hover { background: var(--scrollbar-thumb-hover); } /* ① 名称不再截断（原 max-width:200px + ellipsis） */ .ab-model-name { max-width: none; } /* ② 可折叠分组头 */ .ab-model-ghead { display: flex; align-items: center; gap: 6px; padding: 7px 10px; cursor: pointer; user-select: none; font-size:calc(12.5px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary); } .ab-model-ghead:hover { background: var(--bg-hover); } .ab-model-gtitle { flex: 1; min-width: 0; } .ab-model-gcnt { font-size:calc(11px * var(--ab-fs,1)); font-weight: 500; color: var(--text-muted); background: var(--bg, #f8fafc); border: 1px solid var(--border); border-radius: calc(8px * var(--ab-radius,1)); padding: 0 6px; line-height: 16px; } .ab-model-garrow { font-size:calc(10px * var(--ab-fs,1)); color: var(--text-muted); } .ab-model-gbody { display: flex; flex-direction: column; } .ab-model-gbody.hidden { display: none; } .ab-model-gbody > .ab-model-item { padding-left: 18px; } /* ④ 悬停简介卡（对标 WorkBuddy 模型清单二级菜单：名称/描述/消耗速度/上下文窗口/促销/提示/使用） */ .ab-mtip { position: fixed; z-index: 400; width: 272px; padding: 12px; background: var(--bg-secondary); border: 1px solid var(--border); border-radius: calc(14px * var(--ab-radius,1)); box-shadow: var(--shadow); display: flex; flex-direction: column; gap: 6px; } .ab-mtip-name { font-size:calc(14px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary); line-height: 20px; word-break: break-all; } .ab-mtip-badge { display: inline-block; margin-left: 6px; font-size:calc(10px * var(--ab-fs,1)); font-weight: 500; padding: 1px 5px; border-radius: calc(4px * var(--ab-radius,1)); border: 1px solid #a78bfa; color: #6d28d9; background: #ede9fe; } .ab-mtip-desc { font-size:calc(12px * var(--ab-fs,1)); line-height: 18px; color: var(--text-muted); } .ab-mtip-row { display: flex; align-items: center; gap: 8px; } .ab-mtip-label { font-size:calc(12.5px * var(--ab-fs,1)); color: var(--text-primary); flex: none; } .ab-mtip-val { font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); margin-left: auto; } .ab-mtip-promo { font-size:calc(11.5px * var(--ab-fs,1)); line-height: 16px; color: #b45309; background: #fef3c7; border: 1px solid #fde68a; border-radius: calc(6px * var(--ab-radius,1)); padding: 4px 8px; } .ab-mtip-tip { font-size:calc(11.5px * var(--ab-fs,1)); line-height: 16px; color: var(--text-muted); } .ab-mtip-id { font-size:calc(10.5px * var(--ab-fs,1)); color: var(--text-muted); opacity: .75; word-break: break-all; } .ab-mtip-use { margin-top: 4px; height: 30px; border: none; border-radius: calc(8px * var(--ab-radius,1)); background: linear-gradient(135deg, var(--accent), var(--accent-hover)); color: #fff; font-size:calc(12.5px * var(--ab-fs,1)); font-weight: 600; cursor: pointer; } .ab-mtip-use:hover { filter: brightness(1.06); } /* ========== v249 模型菜单微调：付费/倍率灰字、促销绿字、使用按钮绿字、思考强度三档 ========== */ /* 「付费」与倍率改灰色字体（老板要求：不要彩色标签堆叠） */ .ab-model-paid { display: inline-block; font-size:calc(10px * var(--ab-fs,1)); line-height: 1; padding: 2px 5px; border: 1px solid var(--border); color: var(--text-muted); border-radius: calc(4px * var(--ab-radius,1)); } .ab-model-mul { display: inline-block; font-size:calc(10px * var(--ab-fs,1)); line-height: 1; padding: 2px 5px; border: 1px solid var(--border); color: var(--text-muted); background: transparent; border-radius: calc(4px * var(--ab-radius,1)); } /* 促销标签改绿色字体（气泡外框浅绿，仍为线性风格） */ .ab-model-promo { display: inline-block; font-size:calc(10px * var(--ab-fs,1)); line-height: 1; padding: 2px 5px; border: 1px solid color-mix(in srgb, var(--accent) 45%, transparent); color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, transparent); border-radius: calc(4px * var(--ab-radius,1)); } /* 「使用」按钮：去实心背景、去胶囊，仅绿色字体 */ .ab-mtip-use { margin-top: 2px; height: auto; padding: 4px 0; background: none; border: none; border-radius: 0; color: var(--accent); font-size:calc(12.5px * var(--ab-fs,1)); font-weight: 600; text-align: right; cursor: pointer; } .ab-mtip-use:hover { filter: none; text-decoration: underline; color: var(--accent-hover); } /* 思考强度三档（低/中/高）—— 选中项绿色加粗，未选中灰字 */ .ab-mtip-effrow { align-items: center; } .ab-eff-group { margin-left: auto; display: inline-flex; align-items: center; gap: 10px; } .ab-eff-btn { background: none; border: none; padding: 0 1px; cursor: pointer; font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); } .ab-eff-btn:hover { color: var(--accent); } .ab-eff-btn.on { color: var(--accent); font-weight: 600; } /* GW.255【2026-11-04 老板令】思考强度「锁定档」：该模型上游只认一档（Hy4=high）→ 钉「高」置灰不可切。 覆盖 .on 的高亮，统一走 muted 灰 + not-allowed，右侧挂一枚线性小锁说明「不是坏了，是固定的」。 */ .ab-eff-group-locked { gap: 0; } .ab-eff-btn-lock, .ab-eff-btn-lock.on { color: var(--text-muted); font-weight: 600; opacity: .55; cursor: not-allowed; } .ab-eff-btn-lock:hover { color: var(--text-muted); } .ab-eff-btn-lock:disabled { cursor: not-allowed; } .ab-eff-lock-ico { margin-left: 3px; vertical-align: -1px; opacity: .85; } /* ========== v250：滚动条更细更淡 + 品牌图片图标 ========== */ /* ③ 模型菜单滚动条：4px，超浅淡绿（原 5px 绿条仍偏重） */ .ab-inputbar .ab-model-menu::-webkit-scrollbar { width: 4px; height: 4px; } .ab-inputbar .ab-model-menu::-webkit-scrollbar-thumb { background: color-mix(in srgb, var(--accent) 16%, transparent); border-radius: calc(2px * var(--ab-radius,1)); } .ab-inputbar .ab-model-menu::-webkit-scrollbar-thumb:hover { background: color-mix(in srgb, var(--accent) 30%, transparent); } .ab-model-alllist::-webkit-scrollbar { width: 4px; } .ab-model-alllist::-webkit-scrollbar-thumb { background: color-mix(in srgb, var(--accent) 16%, transparent); border-radius: calc(2px * var(--ab-radius,1)); } .ab-model-alllist::-webkit-scrollbar-thumb:hover { background: color-mix(in srgb, var(--accent) 30%, transparent); } /* ② 品牌图片图标（混元 / Kimi / 小米 MiMo / 智谱 GLM） */ .ab-model-logo-img { width: 18px; height: 18px; border-radius: calc(4px * var(--ab-radius,1)); object-fit: contain; display: block; } /* ========== v251：滚动条 2px 最浅淡绿 ========== */ .ab-inputbar .ab-model-menu { scrollbar-width: thin; scrollbar-color: color-mix(in srgb, var(--accent) 10%, transparent) transparent; } .ab-inputbar .ab-model-menu::-webkit-scrollbar { width: 2px; height: 2px; } .ab-inputbar .ab-model-menu::-webkit-scrollbar-track { background: transparent; } .ab-inputbar .ab-model-menu::-webkit-scrollbar-thumb { background: color-mix(in srgb, var(--accent) 10%, transparent); border-radius: 1px; } .ab-inputbar .ab-model-menu::-webkit-scrollbar-thumb:hover { background: color-mix(in srgb, var(--accent) 18%, transparent); } .ab-model-alllist { scrollbar-width: thin; scrollbar-color: color-mix(in srgb, var(--accent) 10%, transparent) transparent; } .ab-model-alllist::-webkit-scrollbar { width: 2px; } .ab-model-alllist::-webkit-scrollbar-track { background: transparent; } .ab-model-alllist::-webkit-scrollbar-thumb { background: color-mix(in srgb, var(--accent) 10%, transparent); border-radius: 1px; } .ab-model-alllist::-webkit-scrollbar-thumb:hover { background: color-mix(in srgb, var(--accent) 18%, transparent); } /* ============ P6 远程视图：屏幕常驻横幅 ============ 客户「知情」是免授权方案的兜底：手机在看时屏幕上必须有常驻提示且能一键断开。 ⚠️ `.hidden` 不是全局类，必须自己写 `.ab-vnc-banner.hidden`（否则隐藏不生效）。 */ .ab-vnc-banner { position: fixed; left: 50%; top: 10px; transform: translateX(-50%); z-index: 2147483000; display: flex; align-items: center; gap: 10px; max-width: calc(100vw - 24px); padding: 8px 10px 8px 12px; border-radius: calc(10px * var(--ab-radius,1)); background: #fff8ec; border: 1px solid #f0d9b5; color: #8a5a12; box-shadow: 0 2px 10px rgba(0, 0, 0, .10); font-size:calc(13px * var(--ab-fs,1)); } .ab-vnc-banner.hidden { display: none; } .ab-vnc-ico { width: 18px; height: 18px; flex: 0 0 18px; color: #c07a1c; } .ab-vnc-txt { white-space: nowrap; } .ab-vnc-acts { display: flex; align-items: center; gap: 6px; margin-left: 2px; } .ab-vnc-acts .ab-assist-pbtn { padding: 4px 10px; font-size:calc(12px * var(--ab-fs,1)); } /* ===== P4 同事 / 接力链弹窗（分组表单 + 每棒行 + 模型选择 + 预览） ===== */ .ab-team-grp{border:1px solid var(--border);border-radius:calc(10px * var(--ab-radius,1));padding:10px 12px;display:flex;flex-direction:column;gap:10px} .ab-team-grp>.ab-team-grp-hd{display:flex;align-items:center;gap:8px;font-size:calc(12.5px * var(--ab-fs,1));font-weight:600;color:var(--text-primary);cursor:pointer;user-select:none} .ab-team-grp>.ab-team-grp-hd .ab-team-grp-badge{font-size:calc(11px * var(--ab-fs,1));font-weight:400;color:var(--text-muted)} .ab-team-grp>.ab-team-grp-hd .ab-team-grp-toggle{margin-left:auto;font-size:calc(12px * var(--ab-fs,1));color:var(--text-muted)} .ab-team-grp-body{display:flex;flex-direction:column;gap:10px} .ab-team-grp.collapsed>.ab-team-grp-body{display:none} .ab-team-steprow{border:1px solid var(--border);border-radius:calc(9px * var(--ab-radius,1));padding:9px 10px;display:flex;flex-direction:column;gap:8px;background:var(--bg-secondary)} .ab-team-steprow .ab-team-steprow-hd{display:flex;align-items:center;gap:8px} .ab-team-steprow .ab-team-steprow-hd b{font-size:calc(12.5px * var(--ab-fs,1))} .ab-team-steprow-x{margin-left:auto;background:transparent;border:1px solid var(--border);color:var(--text-muted);cursor:pointer;font-size:calc(12px * var(--ab-fs,1));border-radius:calc(6px * var(--ab-radius,1));padding:1px 7px} .ab-team-steprow-x:hover{border-color:var(--accent);color:var(--accent)} .ab-team-steprow-x+.ab-team-steprow-x{margin-left:0} .ab-team-chips{display:flex;flex-wrap:wrap;gap:6px} .ab-team-tog{font-size:calc(11.5px * var(--ab-fs,1));padding:3px 9px;border:1px solid var(--border);border-radius:calc(9px * var(--ab-radius,1));cursor:pointer;color:var(--text-secondary);user-select:none;display:inline-flex;align-items:center;gap:3px} .ab-team-tog svg{width:13px;height:13px} .ab-team-tog.on{border-color:var(--accent);color:var(--accent);background:var(--accent-light)} .ab-team-tog.danger{color:#ef4444} .ab-team-mini{font-size:calc(11.5px * var(--ab-fs,1));padding:2px 8px;border-radius:calc(8px * var(--ab-radius,1));border:1px solid var(--border);color:var(--text-muted)} .ab-team-modeltag{color:var(--accent);border-color:var(--accent)} .ab-team-preview{font-size:calc(12px * var(--ab-fs,1));line-height:1.7;border:1px dashed var(--border);border-radius:calc(10px * var(--ab-radius,1));padding:10px 12px;background:var(--bg-secondary);color:var(--text-secondary)} .ab-team-preview b{color:var(--text-primary)} .ab-team-tplbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap} .ab-team-tplbtn{padding:2px 8px !important;font-size:calc(11.5px * var(--ab-fs,1)) !important} /* ===== P5 行业模板库（开箱即用同事） ===== */ .ab-tplib-grid{display:flex;flex-direction:column;gap:14px} .ab-tplib-pack{border:1px solid var(--border);border-radius:calc(12px * var(--ab-radius,1));padding:12px 14px;display:flex;flex-direction:column;gap:10px} .ab-tplib-packhd{display:flex;align-items:center;gap:8px;font-size:calc(13px * var(--ab-fs,1));font-weight:600;color:var(--text-primary)} .ab-tplib-packhd svg{width:16px;height:16px} .ab-tplib-packhd .ab-team-grp-badge{font-size:calc(11px * var(--ab-fs,1));font-weight:400;color:var(--text-muted)} .ab-tplib-packhd .ab-tplib-batch{margin-left:auto;padding:3px 10px !important;font-size:calc(12px * var(--ab-fs,1)) !important} .ab-tplib-desc{font-size:calc(11.5px * var(--ab-fs,1));color:var(--text-muted);line-height:1.6} .ab-tplib-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px} .ab-tplib-card{border:1px solid var(--border);border-radius:calc(10px * var(--ab-radius,1));padding:9px 10px;display:flex;flex-direction:column;gap:4px;background:var(--bg-secondary)} .ab-tplib-cardhd{display:flex;align-items:center;gap:6px;font-size:calc(12.5px * var(--ab-fs,1));font-weight:600;color:var(--text-primary)} .ab-tplib-cardhd svg{width:15px;height:15px;color:var(--accent)} .ab-tplib-cardmeta{font-size:calc(11.5px * var(--ab-fs,1));color:var(--text-secondary)} .ab-tplib-desc+.ab-tplib-cards{margin-top:2px} .ab-tplib-card .ab-tplib-desc{min-height:16px} .ab-tplib-cardacts{display:flex;gap:6px;margin-top:2px} .ab-tplib-cardacts .ab-set-btn{padding:2px 10px !important;font-size:calc(11.5px * var(--ab-fs,1)) !important} /* ===== P6：助理/同事 首卡统一「新建」样式（并入四菜单创建卡体系） ===== */ .ab-sub-card.ab-func-add, .ab-team-card.ab-func-add { display: flex; flex-direction: column; align-items: stretch; justify-content: flex-start; background: transparent; border: 1.5px dashed var(--accent); cursor: pointer; transition: all .15s; text-align: center; } .ab-sub-card.ab-func-add:hover, .ab-team-card.ab-func-add:hover { border-color: var(--accent); background: var(--accent-light); box-shadow: 0 4px 14px color-mix(in srgb, var(--accent) 12%, transparent); transform: translateY(-2px); } .ab-sub-card.ab-func-add .ab-func-add-name, .ab-team-card.ab-func-add .ab-func-add-name { font-size:calc(14px * var(--ab-fs,1)); line-height: 1.4; } .ab-sub-card.ab-func-add .ab-func-plus, .ab-team-card.ab-func-add .ab-func-plus { margin-bottom: 10px; } /* ===== P6：AI 同事团下方「行业模板库」常驻区 ===== */ .ab-team-tplsec { margin-top: 2px; } .ab-tpl-pack-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(258px, 1fr)); gap: 12px; margin-top: 10px; } .ab-tpl-pack-card { border: 1px solid var(--border); border-radius: calc(12px * var(--ab-radius,1)); padding: 12px; background: var(--bg-secondary, #fff); display: flex; flex-direction: column; gap: 8px; cursor: pointer; transition: all .15s; } .ab-tpl-pack-card:hover { border-color: var(--accent); transform: translateY(-2px); box-shadow: 0 4px 14px color-mix(in srgb, var(--accent) 12%, transparent); } .ab-tpl-pack-hd { display: flex; align-items: center; gap: 8px; font-size:calc(14px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary); } .ab-tpl-pack-hd svg { width: 16px; height: 16px; color: var(--accent); } .ab-tpl-pack-hd .ab-team-grp-badge { margin-left: auto; font-size:calc(11px * var(--ab-fs,1)); font-weight: 400; color: var(--text-muted); } .ab-tpl-pack-desc { font-size:calc(12px * var(--ab-fs,1)); opacity: .8; line-height: 1.5; min-height: 34px; } .ab-tpl-pack-chips { display: flex; flex-wrap: wrap; gap: 4px; } .ab-tpl-pack-chip { font-size:calc(11px * var(--ab-fs,1)); padding: 2px 7px; border-radius: calc(8px * var(--ab-radius,1)); border: 1px solid var(--border); opacity: .85; color: var(--text-secondary); } .ab-tpl-pack-ft { display: flex; align-items: center; gap: 8px; margin-top: auto; } .ab-tpl-pack-ft .ab-set-btn { padding: 3px 10px !important; font-size:calc(12px * var(--ab-fs,1)) !important; } .ab-tpl-pack-more { margin-left: auto; font-size:calc(11.5px * var(--ab-fs,1)); color: var(--accent); cursor: pointer; } /* ===== P7：行业模板库「创建本行业模板」首卡 + 自建模板卡 ===== */ .ab-tpl-pack-card.ab-func-add { background: transparent; border: 1.5px dashed var(--accent); display: flex; flex-direction: column; align-items: stretch; justify-content: flex-start; text-align: center; } .ab-tpl-pack-card.ab-func-add:hover { border-color: var(--accent); background: var(--accent-light); box-shadow: 0 4px 14px color-mix(in srgb, var(--accent) 12%, transparent); transform: translateY(-2px); } .ab-tpl-pack-card.ab-func-add .ab-func-plus { margin-bottom: 10px; } .ab-tpl-pack-card.ab-func-add .ab-func-add-name { font-size:calc(14px * var(--ab-fs,1)); line-height: 1.4; } .ab-tpl-pack-own { border-color: color-mix(in srgb, var(--accent) 45%, transparent); } .ab-tpl-pack-own:hover { border-color: var(--accent); } .ab-tpl-pack-own .ab-tpl-pack-more { color: var(--accent); } /* ==================== P5a · React Flow 只读画布（无限画布迁移 第一期） ==================== */ /* 挂载点：编辑器画布区并列的 #wfCanvasRf（引擎开关切换显示；旧 SVG #wfCanvas 保留回退） */ .ab-wf-canvas-rf { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #f4f5f8; display: none; /* 默认隐藏，引擎开关切到 reactflow 时显示 */ } .ab-wf-canvas-rf.on { display: block; } /* RF 根容器必须撑满（关键：否则 RF 量到 0 尺寸不画边/节点） */ .ab-wf-canvas-rf .react-flow, .ab-wf-canvas-rf .react-flow__renderer, .ab-wf-canvas-rf .react-flow__pane { width: 100%; height: 100%; } /* 画布切换按钮（挂在工具栏） */ .ab-wf-engine-toggle { display: inline-flex; align-items: center; gap: 4px; } /* ---- 富卡片节点（无边框浮起微阴影，对齐聚合图文引擎专业风） ---- */ .rf-node { --nc: #378ADD; --nbg: #E6F1FB; position: relative; display: inline-flex; flex-direction: column; width: 100%; height: 100%; /* 由节点 style.width/height 驱动，支持 NodeResizer 边角拉伸 */ background: #fff; border: none; border-radius: calc(12px * var(--ab-radius,1)); /* 无边框浮起：分层微阴影营造悬浮感，选中改用 shadow ring（不用边框） */ box-shadow: 0 1px 2px rgba(16,24,40,.06), 0 4px 14px rgba(16,24,40,.10); font-size:calc(12px * var(--ab-fs,1)); font-family: inherit; color: #1a1a1a; transition: box-shadow .18s, transform .18s; } .rf-node:hover { box-shadow: 0 2px 4px rgba(16,24,40,.08), 0 10px 28px rgba(16,24,40,.16); transform: translateY(-2px); } .rf-node.on { box-shadow: 0 1px 2px rgba(16,24,40,.06), 0 6px 20px rgba(16,24,40,.14), 0 0 0 2.5px var(--nc); } .rf-node.c-green { --nc: #0F6E56; --nbg: #E1F5EE; } .rf-node.c-blue { --nc: #378ADD; --nbg: #E6F1FB; } .rf-node.c-purple { --nc: #7F77DD; --nbg: #EEEDFE; } .rf-node.c-amber { --nc: #EF9F27; --nbg: #FAEEDA; } .rf-node.c-coral { --nc: #F0997B; --nbg: #FAECE7; } /* 头部：色点 + 名称 + ⚙（无边框浮起后，头部色块圆角兜顶部） */ .rf-node .rf-hd { display: flex; align-items: center; gap: 7px; padding: 8px 11px; background: var(--nbg); border-bottom: 1px solid rgba(0,0,0,.05); border-radius: calc(12px * var(--ab-radius,1)) calc(12px * var(--ab-radius,1)) 0 0; overflow: hidden; } .rf-node.pill .rf-hd { border-bottom: none; justify-content: center; border-radius: calc(12px * var(--ab-radius,1)); } .rf-node .rf-ndot { width: 9px; height: 9px; border-radius: 50%; background: var(--nc); flex: none; } .rf-node .rf-tt { font-size:calc(12px * var(--ab-fs,1)); font-weight: 600; color: var(--nc); flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .rf-node .rf-cfg { flex: none; width: 21px; height: 21px; border-radius: calc(6px * var(--ab-radius,1)); border: 1px solid var(--nc); background: #fff; color: var(--nc); font-size:calc(12px * var(--ab-fs,1)); line-height: 1; display: flex; align-items: center; justify-content: center; cursor: pointer; } .rf-node .rf-cfg:hover { background: var(--nbg); } /* P5b 卡片头部操作钮（放大编辑/复制/删除），选中卡片时显现 */ .rf-node .rf-hop { flex: none; width: 21px; height: 21px; border-radius: calc(6px * var(--ab-radius,1)); border: 1px solid var(--nc); background: #fff; color: var(--nc); font-size:calc(12px * var(--ab-fs,1)); line-height: 1; display: none; align-items: center; justify-content: center; cursor: pointer; } .rf-node:hover .rf-hop, .rf-node.on .rf-hop { display: inline-flex; } .rf-node .rf-hop:hover { background: var(--nbg); } .rf-node .rf-hop-del:hover { background: #FAECE7; color: #993C1D; border-color: #F0997B; } /* 主体：模型下拉 + 参数 chips + prompt 预览（overflow:hidden 兜底文字，圆角兜底部） */ .rf-node .rf-bd { padding: 9px 11px; display: flex; flex-direction: column; gap: 7px; flex: 1; min-height: 0; overflow: hidden; border-radius: 0 0 calc(12px * var(--ab-radius,1)) calc(12px * var(--ab-radius,1)); } .rf-node .rf-msel { display: flex; align-items: center; gap: 5px; font-size:calc(11px * var(--ab-fs,1)); } .rf-node .rf-k { color: #8a8a8a; flex: none; } .rf-node .rf-sel { flex: 1; min-width: 0; border: 1px solid var(--nc); border-radius: calc(7px * var(--ab-radius,1)); padding: 3px 6px; font-size:calc(11px * var(--ab-fs,1)); background: #fff; color: var(--nc); } .rf-node .rf-sel:disabled { opacity: .75; cursor: not-allowed; } .rf-node .rf-chips { display: flex; align-items: center; gap: 5px; flex-wrap: wrap; } .rf-node .rf-chip { font-size:calc(10.5px * var(--ab-fs,1)); color: #1a1a1a; font-weight: 500; background: #f4f3f1; border: 1px solid #e3e3e0; border-radius: calc(6px * var(--ab-radius,1)); padding: 1px 7px; max-width: 190px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .rf-node .rf-ipt { border: 1px solid #e3e3e0; border-radius: calc(8px * var(--ab-radius,1)); background: #fafaf9; padding: 6px 8px; font-size:calc(11px * var(--ab-fs,1)); color: #4a4a48; min-height: 40px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } /* 把手（连线锚点） */ .rf-node .rf-hnd, .react-flow__handle.rf-hnd { width: 11px; height: 11px; border-radius: 50%; background: var(--nc); border: 2px solid #fff; box-shadow: 0 0 0 1px var(--nc); } /* MiniMap / Controls 主题微调（融入浅色画布） */ .ab-wf-canvas-rf .react-flow__minimap { border-radius: calc(12px * var(--ab-radius,1)); overflow: hidden; box-shadow: 0 4px 16px rgba(0,0,0,.12); } /* NodeResizer 边角拉伸手柄（选中节点时显示，绿色主题） */ /* 注意：.rf-node 有 overflow:hidden，resizer 手柄在节点边界外会被裁掉， 需让 resizer 容器脱离裁剪：RF 12 的 resizer 是节点子元素，给它负 z-index 不行， 正确做法是让手柄可见——把 .rf-node 的 overflow 改为在拉伸时不裁剪不现实， 故给 resizer 手柄加足够大的可视区域并向内偏移，确保在 overflow 内可点。 */ .rf-node .react-flow__resize-control { position: absolute; z-index: 6; } .rf-node .react-flow__resize-control.handle { width: 11px; height: 11px; border-radius: 50%; background: #fff; border: 1.5px solid var(--nc, #378ADD); box-shadow: 0 1px 3px rgba(0,0,0,.2); /* 向内收 2px 让手柄整体落在 overflow:hidden 的节点盒内，保证可命中 */ margin: -3px; } .rf-node .react-flow__resize-control.line { border-color: var(--nc, #378ADD); border-width: 1.5px; opacity: .5; } .ab-wf-canvas-rf .react-flow__controls { border-radius: calc(10px * var(--ab-radius,1)); overflow: hidden; box-shadow: 0 4px 14px rgba(0,0,0,.10); } .ab-wf-canvas-rf .react-flow__controls-button { border-bottom: 1px solid #e3e3e0; } /* ===== 左侧悬浮大功能图标 dock（对齐聚合图文引擎 side-dock） ===== */ /* 10 钮变高后不再垂直居中（上半截会被顶挡），改顶部留白对齐 + 超高可滚动 */ .ab-wf-canvas-rf .rf-dock { position: absolute; left: 12px; top: 14px; transform: none; z-index: 8; margin: 0; max-height: calc(100% - 28px); } .rf-dock-in { display: flex; flex-direction: column; gap: 3px; padding: 6px; background: rgba(255,255,255,.92); backdrop-filter: blur(8px); border: 1px solid #e3e3e0; border-radius: calc(14px * var(--ab-radius,1)); box-shadow: 0 6px 22px rgba(0,0,0,.12); max-height: 100%; overflow-y: auto; scrollbar-width: none; } .rf-dock-in::-webkit-scrollbar { width: 0; height: 0; } /* 按钮略收，10 钮一屏放下 */ .rf-dbtn { width: 42px; height: 41px; flex: none; border-radius: calc(10px * var(--ab-radius,1)); border: 1px solid transparent; background: transparent; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; cursor: pointer; color: #5a5a58; transition: all .12s; } .rf-dbtn:hover:not(:disabled) { background: #E1F5EE; color: #0F6E56; border-color: #0F6E56; } .rf-dbtn.on { background: #0F6E56; color: #fff; border-color: #0F6E56; } .rf-dbtn:disabled { opacity: .38; cursor: not-allowed; } .rf-dbtn .rf-dic { width: 19px; height: 19px; display: flex; align-items: center; justify-content: center; } .rf-dbtn .rf-dic svg { width: 100%; height: 100%; } .rf-dbtn .rf-dlb { font-size:calc(8.5px * var(--ab-fs,1)); line-height: 1; } .rf-ddiv { height: 1px; background: #e3e3e0; margin: 3px 4px; } /* ===== dock 子菜单 flyout（从 dock 右侧浮出，对齐对应按钮高度） ===== */ .ab-wf-canvas-rf .rf-fly { position: absolute; left: 66px; z-index: 9; margin: 0; } .ab-wf-canvas-rf .rf-fly-add { top: 14px; } /* 对齐「添加」钮（dock 第 1 个） */ .ab-wf-canvas-rf .rf-fly-asset { top: 210px; } /* 对齐「素材工具」钮 */ .ab-wf-canvas-rf .rf-fly-view { top: 305px; } /* 对齐「画布视图」钮 */ .rf-fly-in { min-width: 168px; padding: 7px; display: flex; flex-direction: column; gap: 2px; background: rgba(255,255,255,.96); backdrop-filter: blur(10px); border: 1px solid #e3e3e0; border-radius: calc(12px * var(--ab-radius,1)); box-shadow: 0 10px 30px rgba(0,0,0,.16); } .rf-fly-t { font-size:calc(11px * var(--ab-fs,1)); font-weight: 600; color: #8a8a8a; padding: 2px 8px 6px; } .rf-fly-item { display: flex; align-items: center; gap: 9px; text-align: left; padding: 7px 9px; border: none; border-radius: calc(8px * var(--ab-radius,1)); background: transparent; font-size:calc(12px * var(--ab-fs,1)); color: #2a2a28; cursor: pointer; transition: background .12s; } .rf-fly-item:hover { background: #E1F5EE; } .rf-fly-item .rf-fly-n { width: 74px; flex: none; text-align: center; font-size:calc(11px * var(--ab-fs,1)); font-weight: 500; padding: 4px 0; border-radius: calc(6px * var(--ab-radius,1)); border: 1px solid; } .rf-fly-item .rf-fly-h { font-size:calc(10.5px * var(--ab-fs,1)); color: #8a8a8a; } /* ===== ⚙ 参数配置面板（只读 popover，从节点右侧浮出） ===== */ .rf-pop { position: absolute; left: calc(100% + 10px); top: 0; z-index: 20; width: 240px; background: #fff; border: 1.5px solid var(--nc, #378ADD); border-radius: calc(12px * var(--ab-radius,1)); box-shadow: 0 8px 28px rgba(0,0,0,.16); overflow: hidden; font-size:calc(11px * var(--ab-fs,1)); text-align: left; } .rf-pop-hd { display: flex; align-items: center; justify-content: space-between; padding: 8px 11px; background: var(--nbg, #E6F1FB); border-bottom: 1px solid #e3e3e0; font-weight: 600; color: var(--nc, #378ADD); font-size:calc(11.5px * var(--ab-fs,1)); } .rf-pop-x { width: 18px; height: 18px; border-radius: calc(5px * var(--ab-radius,1)); border: 1px solid var(--nc, #378ADD); background: #fff; color: var(--nc, #378ADD); font-size:calc(13px * var(--ab-fs,1)); line-height: 1; display: flex; align-items: center; justify-content: center; cursor: pointer; padding: 0; } .rf-pop-bd { padding: 8px 11px; max-height: 220px; overflow-y: auto; display: flex; flex-direction: column; gap: 6px; } .rf-pop-row { display: flex; gap: 7px; align-items: flex-start; } .rf-pop-k { flex: none; width: 70px; color: #8a8a8a; font-size:calc(10.5px * var(--ab-fs,1)); padding-top: 1px; } .rf-pop-v { flex: 1; min-width: 0; color: #1a1a1a; word-break: break-all; white-space: pre-wrap; max-height: 60px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; } .rf-pop-ft { padding: 6px 11px; border-top: 1px dashed #e3e3e0; color: #a0a09e; font-size:calc(10px * var(--ab-fs,1)); background: #fafaf9; } /* ===== P5d · 工作流执行可视化 ===== */ /* 运行钮（dock 第 11 钮，绿色主调） */ .rf-dbtn-run { background: #0F6E56 !important; color: #fff !important; border-color: #0F6E56 !important; } .rf-dbtn-run:hover:not(:disabled) { background: #0d6248 !important; color: #fff !important; } /* 节点运行态（浮起阴影上叠色环，不动边框原则） */ .rf-node.rf-running { box-shadow: 0 0 0 2.5px #378ADD, 0 4px 14px rgba(55,138,221,.35) !important; animation: rfPulse 1.1s ease-in-out infinite; } .rf-node.rf-done { box-shadow: 0 0 0 2.5px #0F6E56, 0 4px 14px rgba(15,110,86,.28) !important; } .rf-node.rf-error { box-shadow: 0 0 0 2.5px #D85A30, 0 4px 14px rgba(216,90,48,.32) !important; } @keyframes rfPulse { 0%,100% { opacity: 1; } 50% { opacity: .72; } } /* 卡片头部状态点 */ .rf-run-dot { width: 8px; height: 8px; border-radius: 50%; flex: none; margin-left: 4px; } .rf-run-running { background: #378ADD; animation: rfPulse 1.1s ease-in-out infinite; } .rf-run-done { background: #0F6E56; } .rf-run-error { background: #D85A30; } /* 执行结果面板（画布右下浮层） */ .ab-wf-runlog { position: absolute; right: 14px; bottom: 14px; z-index: 30; width: 320px; max-height: 46%; background: #fff; border: 1.5px solid #0F6E56; border-radius: calc(12px * var(--ab-radius,1)); box-shadow: 0 10px 32px rgba(0,0,0,.18); display: flex; flex-direction: column; overflow: hidden; font-size:calc(11.5px * var(--ab-fs,1)); } .ab-wf-runlog.hidden { display: none; } .ab-wf-runlog-hd { display: flex; align-items: center; justify-content: space-between; padding: 8px 12px; background: #E1F5EE; border-bottom: 1px solid #d7efe4; font-weight: 600; color: #0F6E56; } .ab-wf-runlog-hd .x { width: 20px; height: 20px; border-radius: calc(6px * var(--ab-radius,1)); border: 1px solid #0F6E56; background: #fff; color: #0F6E56; cursor: pointer; line-height: 1; padding: 0; } .ab-wf-runlog-bd { padding: 8px 10px; overflow-y: auto; display: flex; flex-direction: column; gap: 5px; } .ab-wf-rl-line { display: flex; gap: 6px; align-items: baseline; line-height: 1.5; } .ab-wf-rl-line .ic { flex: none; width: 14px; font-weight: 700; } .ab-wf-rl-line.st-done .ic { color: #0F6E56; } .ab-wf-rl-line.st-error .ic { color: #D85A30; } /* C.174：跳过态（失败策略=跳过 / 条件未走这条）——要能一眼看出"这格没跑"，不能假装全绿 */ .ab-wf-rl-line.st-skip { opacity: .7; } .ab-wf-rl-line.st-skip .ic { color: #8a94a6; } .ab-wf-rl-line.st-running { color: #378ADD; font-weight: 600; } .ab-wf-rl-line .nm { flex: none; color: #1a1a1a; font-weight: 600; } .ab-wf-rl-line .out { flex: 1; min-width: 0; color: #6b6b6b; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .ab-wf-rl-err { padding: 7px 9px; background: #FAECE7; border: 1px solid #F0997B; border-radius: calc(8px * var(--ab-radius,1)); color: #99351d; word-break: break-all; } .ab-wf-rl-ok { padding: 7px 9px; background: #E1F5EE; border: 1px solid #5DCAA5; border-radius: calc(8px * var(--ab-radius,1)); } .ab-wf-rl-ok .t { color: #0F6E56; font-weight: 700; margin-bottom: 3px; } .ab-wf-rl-ok .v { color: #1a1a1a; white-space: pre-wrap; word-break: break-all; max-height: 160px; overflow-y: auto; } /* ============ 激活码 · 授权与设备（Phase6 2026-09-28）============ */ .ab-lic-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px} .ab-lic-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:calc(10px * var(--ab-radius,1));padding:12px 14px;min-width:0} .ab-lic-card-k{font-size:calc(12px * var(--ab-fs,1));color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .ab-lic-card-v{font-size:calc(19px * var(--ab-fs,1));font-weight:600;margin-top:6px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .ab-lic-card-s{font-size:calc(11px * var(--ab-fs,1));color:var(--text-muted);margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .ab-lic-cap{font-size:calc(12px * var(--ab-fs,1));font-weight:400;color:var(--text-muted);margin-left:6px} .ab-lic-codes{border:1px solid var(--border);border-radius:calc(10px * var(--ab-radius,1));overflow:hidden} .ab-lic-code-row{display:grid;grid-template-columns:150px minmax(0,1fr) 74px 54px;gap:10px;align-items:center;padding:9px 12px;border-bottom:1px solid var(--border)} .ab-lic-code-row:last-child{border-bottom:none} .ab-lic-code-name{font-size:calc(13px * var(--ab-fs,1));font-weight:500;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .ab-lic-code-val{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:calc(11.5px * var(--ab-fs,1));color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:.2px} .ab-lic-badge{display:inline-block;font-size:calc(11px * var(--ab-fs,1));padding:2px 8px;border-radius:999px;white-space:nowrap;border:1px solid} .ab-lic-badge.on{background:color-mix(in srgb, var(--accent) 14%, transparent);border-color:color-mix(in srgb, var(--accent) 45%, transparent);color:var(--accent)} .ab-lic-badge.used{background:rgba(148,163,184,.14);border-color:rgba(148,163,184,.4);color:var(--text-muted)} .ab-lic-badge.exp{background:rgba(239,68,68,.12);border-color:rgba(239,68,68,.4);color:#ef4444} .ab-lic-copy{font-size:calc(11px * var(--ab-fs,1));padding:3px 9px;border-radius:calc(7px * var(--ab-radius,1));border:1px solid var(--border);background:transparent;color:var(--text-secondary);cursor:pointer;transition:all .15s} .ab-lic-copy:hover:not(:disabled){border-color:var(--accent);color:var(--accent)} .ab-lic-copy:disabled{opacity:.4;cursor:not-allowed} .ab-lic-tiers{border:1px solid var(--border);border-radius:calc(10px * var(--ab-radius,1));padding:2px 12px} .ab-lic-tier-row{display:grid;grid-template-columns:128px 84px minmax(0,1fr);gap:10px;align-items:center;padding:12px 0;border-bottom:1px solid var(--border)} .ab-lic-tier-row:last-child{border-bottom:none} .ab-lic-tier-row.is-cur{background:linear-gradient(90deg,color-mix(in srgb, var(--accent) 6%, transparent),transparent 70%)} .ab-lic-tier-name{font-size:calc(13px * var(--ab-fs,1));font-weight:500} .ab-lic-tier-price{font-size:calc(11px * var(--ab-fs,1));color:var(--text-muted);margin-top:3px} .ab-lic-tier-num{font-size:calc(15px * var(--ab-fs,1));font-weight:500;white-space:nowrap} .ab-lic-tier-tags{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;min-width:0} .ab-lic-tag{font-size:calc(11px * var(--ab-fs,1));padding:2px 8px;border-radius:999px;background:var(--bg-secondary);border:1px solid var(--border);white-space:nowrap} .ab-lic-tag.eng{background:rgba(55,138,221,.12);border-color:rgba(55,138,221,.4);color:#7cb3ee} .ab-lic-tier-dash{font-size:calc(12px * var(--ab-fs,1));color:var(--text-muted);opacity:.55} @media (max-width:640px){ .ab-lic-cards{grid-template-columns:repeat(2,minmax(0,1fr))} .ab-lic-card{padding:10px 12px} .ab-lic-card-v{font-size:calc(17px * var(--ab-fs,1))} .ab-lic-code-row{grid-template-columns:minmax(0,1fr) auto auto;gap:6px 8px;padding:9px 11px} .ab-lic-code-name{grid-area:1/1} .ab-lic-ccell{grid-area:1/2} .ab-lic-ccell2{grid-area:1/3} .ab-lic-code-val{grid-area:2/1/3/4;white-space:normal;word-break:break-all} .ab-lic-tier-row{grid-template-columns:minmax(0,1fr) auto;gap:6px 10px} .ab-lic-tier-tags{grid-column:1/-1} } /* ===== 授权页 v6（2026-09-29）：页头+面包屑 / 累进式权益表 / 手动激活子系统下拉 / 未登录默认态 ===== */ .ab-set-page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px} .ab-set-page-head .ab-set-page-title{margin:0} .ab-set-page-crumb{font-size:calc(11.5px * var(--ab-fs,1));color:var(--text-muted);margin-top:3px} .ab-lic-login-btn{font-size:calc(11px * var(--ab-fs,1));padding:3px 11px;margin-top:7px;border-radius:calc(7px * var(--ab-radius,1));border:1px solid var(--border);background:transparent;color:var(--text-secondary);cursor:pointer;text-decoration:none;display:inline-block;transition:all .15s} .ab-lic-login-btn:hover{border-color:var(--accent);color:var(--accent)} .ab-lic-tbl{width:100%;border-collapse:collapse;table-layout:fixed;font-size:calc(12.5px * var(--ab-fs,1))} .ab-lic-tbl th{background:var(--bg-secondary);font-weight:500;text-align:left;padding:8px 12px;border:1px solid var(--border);font-size:calc(11.5px * var(--ab-fs,1));color:var(--text-muted)} .ab-lic-tbl td{padding:10px 12px;border:1px solid var(--border);vertical-align:top;line-height:1.65;word-break:break-word} .ab-lic-tbl tbody tr:nth-child(even) td{background:rgba(148,163,184,.06)} .ab-lic-tbl tbody tr.is-cur td{background:color-mix(in srgb, var(--accent) 8%, transparent)} .ab-lic-td-name b{font-size:calc(13px * var(--ab-fs,1));font-weight:500} .ab-lic-td-num{display:block;font-size:calc(11.5px * var(--ab-fs,1));color:var(--text-muted);margin-top:3px;font-weight:400} .ab-lic-td-sub{color:var(--text-secondary)} .ab-lic-lead{color:var(--accent);font-weight:500} .ab-lic-td-price{white-space:nowrap} .ab-lic-ex-label{font-size:calc(11.5px * var(--ab-fs,1));color:var(--text-muted);margin:14px 0 0} .ab-lic-ex-row{display:grid;grid-template-columns:150px minmax(0,1fr) 74px 54px;gap:10px;align-items:center;padding:9px 0 0;opacity:.72} .ab-lic-ex-row .ab-lic-code-name,.ab-lic-ex-row .ab-lic-code-val{color:var(--text-muted)} .ab-lic-act-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap} .ab-lic-act-in{flex:1 1 220px;min-width:160px;background:color-mix(in srgb, var(--accent) 12%, transparent);border:1px solid color-mix(in srgb, var(--accent) 45%, transparent);border-radius:calc(10px * var(--ab-radius,1));padding:8px 12px;color:inherit;font-size:calc(13px * var(--ab-fs,1));outline:none;font-family:ui-monospace,Menlo,Consolas,monospace} .ab-lic-act-in:focus{border-color:var(--accent)} .ab-lic-act-sel{flex:0 1 200px;min-width:150px;background:var(--bg-secondary);border:1px solid var(--border);border-radius:calc(10px * var(--ab-radius,1));padding:8px 10px;color:var(--text-primary);font-size:calc(13px * var(--ab-fs,1));outline:none;cursor:pointer} .ab-lic-act-sel:focus{border-color:var(--accent)} .ab-lic-act-sel option,.ab-lic-act-sel optgroup{background:var(--bg-primary,#fff);color:var(--text-primary)} @media (max-width:640px){ .ab-lic-tbl{font-size:calc(12px * var(--ab-fs,1))} .ab-lic-tbl th,.ab-lic-tbl td{padding:8px 9px} .ab-lic-act-in,.ab-lic-act-sel{flex:1 1 100%;min-width:0} .ab-lic-ex-row{grid-template-columns:minmax(0,1fr) auto auto;gap:6px 8px} .ab-lic-ex-row .ab-lic-code-val{grid-column:1/-1;white-space:normal;word-break:break-all} } /* v6.1（2026-09-29）：权益表宽度自洽 + 窄屏兜底（不撑破屏幕，容器内可滑） */ .ab-lic-tbl th,.ab-lic-tbl td{box-sizing:border-box} #licTierList{overflow-x:auto;-webkit-overflow-scrolling:touch} .ab-lic-act-row .ab-set-btn{white-space:nowrap} @media (max-width:640px){ .ab-lic-tbl{font-size:calc(11.5px * var(--ab-fs,1))} .ab-lic-tbl th{font-size:calc(11px * var(--ab-fs,1))} .ab-lic-tbl th,.ab-lic-tbl td{padding:7px 8px} .ab-lic-td-name b{font-size:calc(12.5px * var(--ab-fs,1))} .ab-lic-td-num{font-size:calc(11px * var(--ab-fs,1))} } /* v7（2026-09-29）：升级弹窗底部「套餐权益对照」——复用授权页 .ab-lic-tbl 一套样式 */ .ab-buy-tiers{margin-top:18px;padding-top:14px;border-top:1px solid var(--border)} .ab-buy-tiers-cap{font-size:calc(13px * var(--ab-fs,1));font-weight:600;color:var(--text-primary);margin-bottom:10px} #buyTierList{overflow-x:auto;-webkit-overflow-scrolling:touch} /* 列宽用类（renderLicTiers 输出 col.c-name / col.c-price）：窄屏加宽价格列，避免「¥198 / 月」被裁出 3px */ .ab-lic-tbl .c-name{width:21%} .ab-lic-tbl .c-price{width:16%} @media (max-width:640px){ .ab-lic-tbl .c-name{width:27%} .ab-lic-tbl .c-price{width:23%} } /* 邀请弹窗：邀请统计 / 未登录引导 */ .ab-invite-stat{font-size:calc(12.5px * var(--ab-fs,1));color:var(--text-secondary);line-height:1.8;margin:2px 0 8px} .ab-invite-stat b{font-weight:600} /* ===== GW.148 2026-10-18 · 邀约窗 → 签到引流按钮（绿色蒙版 / 绿色实心） ===== */ .ab-invite-stat-row{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap} .ab-invite-ck-btn{display:inline-flex;align-items:center;justify-content:center;gap:5px;height:30px;padding:0 13px;border-radius:calc(8px * var(--ab-radius,1));border:1px solid #15803d;background:#15803d;color:#fff;font-size:calc(12.5px * var(--ab-fs,1));font-weight:700;cursor:pointer;white-space:nowrap;flex:0 0 auto;transition:all .18s;box-shadow:0 2px 10px rgba(21,128,61,.30)} .ab-invite-ck-btn:hover{background:#166534;border-color:#166534;box-shadow:0 3px 14px rgba(22,101,52,.40)} .ab-invite-ck-btn:disabled{cursor:not-allowed;box-shadow:none} .ab-invite-ck-btn.masked{background:rgba(34,197,94,.13);border-color:rgba(34,197,94,.46);color:#4ade80} .ab-invite-ck-btn.masked:hover{background:rgba(34,197,94,.13);border-color:rgba(34,197,94,.46)} .ab-invite-ck-foot{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;box-sizing:border-box;margin:14px 0 2px;height:44px;border-radius:calc(10px * var(--ab-radius,1));border:1px solid rgba(34,197,94,.50);background:linear-gradient(180deg,rgba(34,197,94,.20),rgba(22,163,74,.12));color:#4ade80;font-size:calc(13.5px * var(--ab-fs,1));font-weight:700;letter-spacing:.2px;cursor:pointer;transition:all .18s} .ab-invite-ck-foot:hover{background:linear-gradient(180deg,rgba(34,197,94,.30),rgba(22,163,74,.20));border-color:rgba(34,197,94,.72)} .ab-invite-ck-foot.unlocked{background:linear-gradient(135deg,#15803d,#166534);border-color:#15803d;color:#fff;box-shadow:0 4px 16px rgba(21,128,61,.38)} .ab-ck-gate{margin:12px 0 16px;padding:8px 10px;border-radius:calc(8px * var(--ab-radius,1));background:rgba(245,158,11,.10);border:1px solid rgba(245,158,11,.32);color:#f59e0b;font-size:calc(12px * var(--ab-fs,1));line-height:1.6;text-align:center} .ab-ck-gate b{color:#fbbf24;font-weight:700} .ab-ck-gate.hidden{display:none} /* 浅色主题：蒙版按钮改用深绿字，保证对比度 ≥ 4.5 */ :root.ab-light .ab-invite-ck-btn.masked{background:rgba(22,163,74,.10);border-color:rgba(22,163,74,.42);color:#15803d} :root.ab-light .ab-invite-ck-foot{background:linear-gradient(180deg,rgba(22,163,74,.14),rgba(22,163,74,.08));border-color:rgba(22,163,74,.42);color:#15803d} :root.ab-light .ab-invite-ck-foot:hover{background:linear-gradient(180deg,rgba(22,163,74,.20),rgba(22,163,74,.12));border-color:rgba(22,163,74,.62)} :root.ab-light .ab-invite-ck-foot.unlocked{background:linear-gradient(135deg,#15803d,#166534);color:#fff} :root.ab-light .ab-ck-gate{background:rgba(245,158,11,.10);border-color:rgba(245,158,11,.35);color:#b45309} :root.ab-light .ab-ck-gate b{color:#92400e} #inviteNeedLogin{border:1px dashed var(--border);border-radius:calc(10px * var(--ab-radius,1));padding:12px 14px;color:var(--text-muted)} /* ===== v345 colleagues 第一批：卡片徽标/筛选/置顶暂停/详情侧栏 ===== */ .ab-team-filter{display:flex;gap:6px;margin-bottom:10px;flex-wrap:wrap} .ab-team-ftog{font-size:calc(11.5px * var(--ab-fs,1));padding:3px 11px;border-radius:calc(12px * var(--ab-radius,1));border:1px solid var(--border);cursor:pointer;opacity:.75;user-select:none} .ab-team-ftog:hover{opacity:1} .ab-team-ftog.on{background:color-mix(in srgb, var(--accent) 12%, transparent);color:var(--accent-hover);border-color:color-mix(in srgb, var(--accent) 45%, transparent);opacity:1} .ab-team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;grid-column:1/-1} .ab-team-dot.abn{background:rgba(239,68,68,.12);color:#ef4444} .ab-team-dot.paused{background:rgba(100,116,139,.14);color:#64748b} .ab-team-card.ab-team-paused{opacity:.55;filter:saturate(.6)} .ab-team-card.ab-team-pinned{border-color:rgba(245,158,11,.55);box-shadow:0 0 0 1px rgba(245,158,11,.18)} .ab-team-pinico{font-size:calc(11px * var(--ab-fs,1))} .ab-team-more{cursor:pointer;opacity:.45;padding:0 4px;border-radius:calc(6px * var(--ab-radius,1));font-size:calc(15px * var(--ab-fs,1));line-height:1;user-select:none;flex:0 0 auto} .ab-team-more:hover{opacity:1;background:rgba(100,116,139,.12)} .ab-team-resp,.ab-team-pers{font-size:calc(11px * var(--ab-fs,1));opacity:.66;line-height:1.5;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .ab-team-memoff{color:#d97706 !important;opacity:1 !important} .ab-team-menu{position:fixed;z-index:9999;background:var(--bg-secondary,#fff);border:1px solid var(--border);border-radius:calc(10px * var(--ab-radius,1));box-shadow:0 8px 24px rgba(0,0,0,.12);padding:5px;min-width:140px} .ab-team-menu-it{font-size:calc(12.5px * var(--ab-fs,1));padding:7px 12px;border-radius:calc(7px * var(--ab-radius,1));cursor:pointer} .ab-team-menu-it:hover{background:color-mix(in srgb, var(--accent) 10%, transparent);color:var(--accent-hover)} .ab-team-pfhd{display:flex;align-items:center;gap:10px;margin-bottom:12px} .ab-team-pfhd svg{width:28px;height:28px} .ab-team-pfhd b{font-size:calc(16px * var(--ab-fs,1))} .ab-team-pfrow{display:flex;gap:10px;padding:7px 0;border-bottom:1px dashed var(--border);font-size:calc(12.5px * var(--ab-fs,1))} .ab-team-pfk{flex:0 0 96px;opacity:.6} .ab-team-pfv{flex:1;min-width:0;word-break:break-all} .ab-team-go[disabled]{opacity:.45;cursor:not-allowed} /* ===== v346 定时任务人性化（分态分组/倒计时/有效期/环境提示） ===== */ .ab-cron-group-head{font-size:calc(12px * var(--ab-fs,1));font-weight:700;color:var(--text-muted);margin:14px 0 6px;letter-spacing:.5px;display:flex;align-items:center;gap:8px} .ab-cron-group-head::after{content:'';flex:1;height:1px;background:var(--border);opacity:.6} /* ===== v357 #2/#3：自定义「模型列表」区块排版 + 彩色图标 + 「当前」实心高亮 ===== */ .ab-cmlist-wrap{margin:8px 0 10px;border:1px solid var(--border);border-radius:calc(8px * var(--ab-radius,1));overflow:hidden;background:var(--bg-secondary,transparent)} .ab-cmlist-title{margin:0!important;padding:7px 10px!important;font-size:calc(12px * var(--ab-fs,1))!important;font-weight:700!important;color:var(--text-secondary)!important;background:var(--bg-tertiary,rgba(128,128,128,.06))!important;border-bottom:1px solid var(--border)!important;display:flex!important;align-items:center!important;gap:8px!important} .ab-cmlist-cap{padding:6px 10px;font-size:calc(11px * var(--ab-fs,1));color:var(--text-muted);letter-spacing:.3px} /* v359：「当前」标签实心高亮 —— 提到文件末尾以确保压过 4194 行的 .ab-model-tag 基础样式 */ .ab-model-tag.ab-tag-current{background:var(--accent)!important;color:#fff!important;border:1px solid transparent!important;font-weight:700!important;box-shadow:0 1px 4px rgba(0,0,0,.18)!important;letter-spacing:.5px} /* v359：统一圆角按钮（设置页模型列表 + 聊天输入框下方模型菜单，两处同名同款）*/ .ab-cmlist-btn,.ab-cm-btn{ font-family:inherit!important;font-size:calc(12px * var(--ab-fs,1))!important;line-height:1.5!important; padding:4px 12px!important;border-radius:calc(8px * var(--ab-radius,1))!important; border:1px solid var(--border)!important;background:transparent!important; color:var(--text-secondary)!important;cursor:pointer!important; transition:border-color .15s,color .15s,background .15s!important;white-space:nowrap!important; } .ab-cmlist-btn:hover,.ab-cm-btn:hover{border-color:var(--accent)!important;color:var(--accent)!important;background:var(--accent-light)!important} .ab-cmlist-btn.danger,.ab-cm-btn.danger{border-color:color-mix(in srgb,var(--error,#ef4444) 40%,var(--border))!important;color:var(--error,#ef4444)!important} .ab-cmlist-btn.danger:hover,.ab-cm-btn.danger:hover{border-color:var(--error,#ef4444)!important;background:color-mix(in srgb,var(--error,#ef4444) 10%,transparent)!important;color:var(--error,#ef4444)!important} /* v359：模型名称加大加亮（此前 13px/继承色太淡，看不清）*/ .ab-cmlist-name{font-size:calc(14px * var(--ab-fs,1))!important;font-weight:600!important;color:var(--text-primary)!important;line-height:1.45!important} .ab-cmlist-id{font-size:calc(11.5px * var(--ab-fs,1))!important;opacity:1!important;color:var(--text-muted)!important} /* v359：图标放大到 26px，容纳 2 字符字形（原 22px/10px 显得破损）*/ .ab-cmlist-badge{flex:0 0 auto;width:26px!important;height:26px!important;border-radius:calc(8px * var(--ab-radius,1))!important;display:flex!important;align-items:center!important;justify-content:center!important;color:#fff!important;font-size:calc(11px * var(--ab-fs,1))!important;font-weight:700!important;letter-spacing:.3px;box-shadow:0 1px 3px rgba(0,0,0,.15);font-family:inherit!important} .ab-cmlist-title .ab-cmlist-hint{font-weight:400!important;opacity:.7!important;font-size:calc(11px * var(--ab-fs,1))!important} .ab-cmlist{display:flex;flex-direction:column;max-height:260px;overflow-y:auto} .ab-cmlist-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:7px 10px!important;border-bottom:1px dashed var(--border)!important;cursor:pointer} .ab-cmlist-row:last-child{border-bottom:none!important} .ab-cmlist-row:hover{background:var(--bg-tertiary,rgba(128,128,128,.06))} .ab-cmlist-cur{background:color-mix(in srgb, var(--accent) 10%, transparent)!important} .ab-cmlist-meta{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:1px} .ab-cmlist-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .ab-cmlist-id{overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .ab-cmlist-tag{font-size:calc(10px * var(--ab-fs,1));padding:1px 6px;border-radius:calc(10px * var(--ab-radius,1));background:rgba(128,128,128,.14);opacity:.85} .ab-cmlist-empty{padding:10px 10px;font-size:calc(12px * var(--ab-fs,1));opacity:.62;display:flex;flex-direction:column;gap:2px} .ab-cmlist-empty-sub{font-size:calc(11px * var(--ab-fs,1));opacity:.75} /* v359：聊天菜单里的自定义模型行：用 ab-model-item 的排版，但名称/端点对齐设置页卡片 */ .ab-model-item .ab-cmlist-meta{gap:1px} .ab-model-item .ab-cmlist-id{max-width:230px} .ab-model-item .ab-cmlist-ops,.ab-model-side{display:flex;align-items:center;gap:6px;flex:0 0 auto} .ab-model-item.ab-cmlist-row{padding:7px 10px!important} /* v359：设置页内联提示（保存/删除结果直接显示在弹窗内，不再只写被遮住的聊天区状态栏）*/ #cmFormMsg{min-height:16px;font-size:calc(12px * var(--ab-fs,1));margin-top:4px} #cmFormMsg.ab-cm-msg-ok{color:var(--accent);font-weight:600} #cmFormMsg.ab-cm-msg-err{color:var(--error,#ef4444);font-weight:600} /* v360 #1：设置页「当前 / 编辑 / 删除」三者尺寸完全统一 + 间距拉开（此前大小不一、黏成一片）*/ .ab-cmlist-ops{flex:0 0 auto;display:flex!important;align-items:center!important;gap:8px!important} .ab-cmlist-ops .ab-model-tag.ab-tag-current, .ab-cmlist-ops .ab-cmlist-btn{ flex:0 0 auto;height:26px!important;min-width:52px!important; display:inline-flex!important;align-items:center!important;justify-content:center!important; padding:0 12px!important;margin:0!important;border-radius:calc(8px * var(--ab-radius,1))!important; font-family:inherit!important;font-size:calc(12px * var(--ab-fs,1))!important;line-height:1!important; font-weight:600!important;letter-spacing:.2px;box-sizing:border-box!important; border:1px solid transparent!important;white-space:nowrap!important; } /* v360 #2：右下角模型菜单 —— 自定义模型完全对齐内置模型行（无卡片/无 url/无编辑删除）*/ .ab-model-item.ab-cmlist-row{padding:0!important;background:transparent!important} .ab-model-item.ab-cmlist-row:hover{background:var(--bg-hover)!important} .ab-model-item .ab-cmlist-meta{flex:1 1 auto;min-width:0;display:flex!important;flex-direction:column;gap:0} .ab-model-item .ab-cmlist-name{font-size:inherit!important;font-weight:inherit!important;color:inherit!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} /* 线性彩色图标（无边框无背景的描边字形）—— 与内置模型的 ab-model-logo 观感一致 */ .ab-cm-glyph{ flex:0 0 auto;width:18px;height:18px;display:inline-flex!important;align-items:center;justify-content:center; font-family:inherit!important;font-size:calc(12px * var(--ab-fs,1))!important;font-weight:800!important;line-height:1; background:none!important;border:0!important;border-radius:0!important;box-shadow:none!important; letter-spacing:-.3px;transform:translateY(-.5px); } /* ===== v362【老板铁律：回复区不要一堆边框】工作进程/引用/产物一律去框化 ===== 此前：.ab-wstep 每步 1px 实线边框 + 灰底 → 「查看已完成的 N 步工作进程」展开后是一列方框； .ab-ref-item 每条绿底方块；两者与正文并列时视觉噪声极大。 现在：改为「左侧一条极细竖线 + 悬浮淡底」的轻量分层，正文仍是唯一主角。 */ .ab-wsteps{gap:1px!important} .ab-wstep{ border:0!important;border-left:2px solid var(--border)!important;border-radius:0!important; background:transparent!important;padding:5px 10px!important; } .ab-wstep:hover{background:var(--bg-hover,rgba(128,128,128,.05))!important;border-left-color:var(--accent)!important} .ab-wstep-ok{border-left-color:color-mix(in srgb, var(--accent) 55%, transparent)!important} .ab-wstep-fail{border-left-color:rgba(239,68,68,.5)!important} [data-theme="dark"] .ab-wstep{background:transparent!important} .ab-procfold-body{border-left:0!important;padding-left:2px!important} .ab-procfold-body .ab-wstep{border-left:2px solid var(--border)!important;background:transparent!important} /* 引用资料条：一行两条、极简无框 */ .ab-ref-bar{gap:2px 14px!important} .ab-ref-item{ border:0!important;background:transparent!important;padding:3px 0!important;border-radius:0!important; border-bottom:1px dotted var(--border)!important; } .ab-ref-item:hover{background:transparent!important;border-bottom-color:var(--accent)!important} .ab-ref-head{font-size:calc(12px * var(--ab-fs,1))!important;padding:2px 0!important} /* 产物卡（消息内两列网格）去框化 */ .ab-artifact-item{ border:0!important;background:transparent!important;padding:8px 10px!important;border-radius:calc(8px * var(--ab-radius,1))!important; border-bottom:1px solid var(--border)!important; } .ab-artifact-item:hover{background:var(--bg-hover,rgba(128,128,128,.06))!important;box-shadow:none!important;transform:none!important} .ab-msg-artifacts{border:0!important;background:transparent!important;padding:2px 0!important} .ab-msg-artifacts-head{border:0!important;background:transparent!important;padding:2px 0 4px!important} /* ===== v362【老板重设计要求：产物内页要「报告/文稿级」排版，不要垃圾排版】===== 旧问题：① 顶部 infocard（44px 图标 + 文件名 + 4 行带边框属性表）霸占约 1/4 屏， 正文被挤到下方；② 属性表每格都有边框，像 Excel 截图，观感廉价； ③ 正文虽然走 mdRender，但缺少「文稿感」——标题/正文/要点/结论之间无节奏层次。 新方案：标题区压缩成一行「面包屑 + 元信息」（元信息用 · 分隔的极简行，不要表格）； 正文按 A4 文稿排版：窄栏阅读宽度、段间距、要点符、引用块、结论区、表格斑马纹。 */ .ab-art-pv-body{padding:0!important;background:var(--bg-primary)!important} /* —— 文稿头：单行标题 + 极简元信息 —— */ .ab-art-pv-infocard{ display:block!important;padding:14px 26px 12px!important;margin:0!important; background:transparent!important;border:0!important;border-radius:0!important; border-bottom:1px solid var(--border)!important; } .ab-art-pv-infocard>.ab-art-pv-ico{display:none!important} /* 44px 大图标已由地址栏/标签承担，删掉省空间 */ .ab-art-pv-info{display:block!important} /* 文件名：作为文稿主标题 */ .ab-art-pv-fname{ font-size:calc(19px * var(--ab-fs,1))!important;font-weight:700!important;color:var(--text-primary)!important; margin:0 0 5px!important;line-height:1.4!important; font-family:inherit!important;word-break:break-word!important; } /* 元信息：把原来的 4 行属性「表格」压成一行 · 分隔的淡灰小字 */ .ab-art-pv-table{ display:block!important;width:auto!important;border:0!important;font-size:calc(11.5px * var(--ab-fs,1))!important; color:var(--text-muted)!important;line-height:1.6!important; } .ab-art-pv-table tbody{display:flex!important;flex-wrap:wrap!important;gap:0 6px!important} .ab-art-pv-table tr{display:contents!important} .ab-art-pv-table th,.ab-art-pv-table td{ display:inline!important;border:0!important;padding:0!important;background:transparent!important; font-size:inherit!important;color:inherit!important;white-space:nowrap!important; } .ab-art-pv-table th{font-weight:400!important;opacity:.75;width:auto!important} .ab-art-pv-table th::after{content:" ·";opacity:.5} .ab-art-pv-table td{max-width:min(46vw,420px);overflow:hidden;text-overflow:ellipsis;vertical-align:bottom!important} .ab-art-pv-cellurl{font-family:inherit!important;font-size:inherit!important;color:var(--text-muted)!important} /* —— 文稿正文：窄栏 + 段间距，接近 A4 阅读感 —— */ .ab-art-pv-doc,.ab-art-pv-md{ max-width:74ch!important;margin:0 auto!important;padding:26px 26px 60px!important; font-size:calc(15.5px * var(--ab-fs,1))!important;line-height:1.95!important;color:var(--text-primary)!important; } .ab-art-pv-md h1{font-size:calc(24px * var(--ab-fs,1))!important;margin:34px 0 14px!important;padding-bottom:8px!important;border-bottom:2px solid var(--accent)!important} .ab-art-pv-md h1:first-child{margin-top:0!important} .ab-art-pv-md h2{font-size:calc(19px * var(--ab-fs,1))!important;margin:28px 0 11px!important;padding-left:10px!important;border-left:4px solid var(--accent)!important} .ab-art-pv-md h3{font-size:calc(16.5px * var(--ab-fs,1))!important;margin:20px 0 8px!important;color:var(--text-primary)!important} .ab-art-pv-md p{margin:12px 0!important} /* 要点/列表：细竖线 + 悬挂缩进，不用大圆点堆叠 */ .ab-art-pv-md ul>li{padding-left:18px!important;margin:7px 0!important} .ab-art-pv-md ol{counter-reset:abartli!important} .ab-art-pv-md ol>li{padding-left:20px!important;margin:7px 0!important} /* 引用块：左细线 + 淡底，不要整块黑框 */ .ab-art-pv-md blockquote{ margin:14px 0!important;padding:8px 14px!important;border:0!important; border-left:3px solid var(--border)!important;background:rgba(128,128,128,.05)!important; color:var(--text-secondary)!important; } /* 表格：斑马纹 + 只留横线（去掉所有竖边框），这才是文稿感 */ .ab-art-pv-md .ab-tbl-wrap{margin:16px 0!important;border:1px solid var(--border)!important;border-radius:calc(8px * var(--ab-radius,1))!important;overflow:auto} .ab-art-pv-md table{border-collapse:collapse!important;width:100%!important;font-size:calc(13.5px * var(--ab-fs,1))!important} .ab-art-pv-md th,.ab-art-pv-md td{border:0!important;border-bottom:1px solid var(--border)!important;padding:8px 12px!important;text-align:left!important} .ab-art-pv-md thead th{background:var(--bg-tertiary,rgba(128,128,128,.07))!important;font-weight:700!important;white-space:nowrap} /* 代码块：细框 + 等宽，不要厚重黑底 */ .ab-art-pv-md pre{border:1px solid var(--border)!important;border-radius:calc(8px * var(--ab-radius,1))!important;padding:12px 14px!important;font-size:calc(12.5px * var(--ab-fs,1))!important;line-height:1.7!important} /* ✅ 结论行：淡绿底 + 左绿条（报告级收尾强调） */ .ab-art-pv-md strong{color:var(--text-primary);font-weight:700} mark{background:rgba(250,204,21,.28)!important;color:inherit!important;padding:1px 3px!important;border-radius:calc(3px * var(--ab-radius,1))!important} /* 空态：不是"啥都没有"，给引导 */ .ab-art-blank-tip{font-size:calc(14px * var(--ab-fs,1))!important;color:var(--text-secondary)!important} /* ===== v364 产物面板排版定稿（老板选定「方案③ WorkBuddy + 增强」，逆向自 WorkBuddy app.asar）===== 一句话：标题降噪（30px→20px、去掉荧光绿装饰）、表格恢复格线 + 斑马纹、列表用原生 marker、 选中态改中性灰、Tab 条隐藏滚动条、正文限栏 832px。全部写在本文件末尾，确保压过历史规则。 */ /* ── 面板外壳：极淡分隔线 + 胶囊滚动条 ── */ .ab-artpanel{background:var(--bg-primary)!important} .ab-art-editorbar{height:40px!important;background:var(--bg-primary)!important;border-bottom:1px solid var(--border)!important;align-items:center!important} .ab-art-editorbar .ab-art-collapse{width:28px!important;border-right:none!important} .ab-art-collapse:hover{background:var(--bg-hover)!important} /* ── Tab 条：隐藏滚动条 + 弹性宽度 + 常态 400 仅 active 600（WorkBuddy 核心洞察）── */ .ab-art-tabs{align-items:center!important;gap:4px!important;padding:0 4px!important;overflow-x:auto!important;overflow-y:hidden!important;scrollbar-width:none!important} .ab-art-tabs::-webkit-scrollbar{display:none!important} .ab-art-tab{ flex:1 1 0!important;min-width:76px!important;max-width:200px!important;height:32px!important; padding:0 8px!important;gap:6px!important;font-size:calc(13px * var(--ab-fs,1))!important; border:none!important;border-radius:calc(8px * var(--ab-radius,1))!important;background:transparent!important; color:var(--text-secondary)!important;font-weight:400!important; transition:background-color .1s,color .1s!important; } .ab-art-tab:hover{background:var(--bg-hover)!important;color:var(--text-primary)!important} .ab-art-tab.on{background:var(--bg-tertiary,rgba(0,0,0,.05))!important;color:var(--text-primary)!important;box-shadow:none!important;font-weight:600!important} .ab-art-tab.on .ab-art-tab-ic{color:var(--text-secondary)!important} .ab-art-tab .ab-art-tab-name{flex:1 1 auto!important;min-width:0!important;font-family:inherit!important;font-size:calc(13px * var(--ab-fs,1))!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important} .ab-art-tab .ab-art-tab-ic{flex:0 0 auto!important} .ab-art-tab .ab-art-tab-x{flex:0 0 auto!important;opacity:0!important;width:14px!important;height:14px!important;border-radius:999px!important} .ab-art-tab:hover .ab-art-tab-x,.ab-art-tab.on .ab-art-tab-x{opacity:1!important} .ab-art-tab-add{width:28px!important;height:28px!important;border-radius:calc(8px * var(--ab-radius,1))!important;border-right:none!important} .ab-art-tab-add:hover{background:var(--bg-hover)!important;color:var(--accent)!important} /* ── 左栏文件列表：固定 32px 行高 + 中性灰选中态（去掉绿色）── */ /* v394 修复：此处原先 width:248px!important 会压过后文折叠规则(.ab-art-side-collapsed)，导致左栏折叠后仍占 248px、 正文被挤到右侧。改为不带 !important 的宽度（正常态仍 248px），并在下方补一条高优先级折叠规则兜底。 */ .ab-art-side{width:248px;background:var(--bg-primary)!important} .ab-art-side-h{border-bottom:none!important;padding:8px 12px!important;color:var(--text-muted)!important} .ab-art-side-list{padding:0 6px!important} .ab-art-file{height:32px!important;padding:0 8px!important;border-radius:0!important;background:transparent!important;transition:background .12s!important} .ab-art-file:hover{background:rgba(0,0,0,.03)!important} [data-theme="dark"] .ab-art-file:hover{background:rgba(255,255,255,.05)!important} .ab-art-file.on{background:rgba(0,0,0,.05)!important} .ab-art-file.on:hover{background:rgba(0,0,0,.05)!important} [data-theme="dark"] .ab-art-file.on{background:rgba(255,255,255,.07)!important} [data-theme="dark"] .ab-art-file.on:hover{background:rgba(255,255,255,.07)!important} .ab-art-file.on .fname{color:var(--text-primary)!important;font-weight:600!important} .ab-art-side-list .ab-art-file .fname{font-size:calc(12.5px * var(--ab-fs,1))!important;font-family:inherit!important} .ab-art-side-none{color:var(--text-muted)!important} /* v394：折叠左栏时彻底让位（高优先级兜底，确保正文撑满整区域，不再被左侧文件列表占位挤压）*/ .ab-artpanel.ab-art-side-collapsed .ab-art-side{width:0!important;border-right:none!important;opacity:0!important;overflow:hidden!important} /* ── 地址栏（文件路径）更轻 ── */ .ab-art-browserbar{background:var(--bg-primary)!important;border-bottom:1px solid var(--border)!important} /* ── 文稿头：文件名做主标题 + 元信息一行（沿用 v362，v364 追加单行化）── */ .ab-art-pv-infocard{display:block!important;padding:14px 26px 12px!important;margin:0!important; background:transparent!important;border:0!important;border-bottom:1px solid var(--border)!important;border-radius:0!important} .ab-art-pv-infocard>.ab-art-pv-ico{display:none!important} .ab-art-pv-info{display:block!important;flex:none!important} .ab-art-pv-fname{font-size:calc(19px * var(--ab-fs,1))!important;font-weight:700!important;color:var(--text-primary)!important; margin:0 0 5px!important;line-height:1.4!important;font-family:inherit!important;word-break:break-word!important} /* ── ③ 增强：元信息补「字数 / 预计阅读」（由 renderArtDetail 注入 .ab-art-pv-wc）── */ .ab-art-pv-wc b{color:var(--text-secondary)!important;font-weight:600!important} /* 元信息行：窄面板下也必须单行 —— 收敛为「类型 · 工具 · 规模」三项，完整信息走 title 悬浮 */ .ab-art-pv-table{display:flex!important;align-items:baseline!important;flex-wrap:nowrap!important;gap:0!important; font-size:calc(11px * var(--ab-fs,1))!important;line-height:1.6!important;color:var(--text-muted)!important; border:0!important;background:transparent!important;white-space:nowrap!important;overflow:hidden!important} .ab-art-pv-table>span{flex:0 0 auto!important;overflow:hidden;text-overflow:ellipsis;max-width:11em} .ab-art-pv-table>span:first-child{flex:0 1 auto!important;max-width:9em} .ab-art-pv-sep{flex:0 0 auto!important;margin:0 6px!important;opacity:.45!important} .ab-art-pv-cellurl{font-family:inherit!important;font-size:inherit!important;color:var(--text-muted)!important} /* ══════ 文稿正文：WorkBuddy .ai-markdown-card 规格 ══════ */ .ab-art-pv-body{scrollbar-width:thin!important;scrollbar-color:var(--border) transparent!important;scrollbar-gutter:stable!important} .ab-art-pv-body::-webkit-scrollbar{width:8px!important;height:8px!important} .ab-art-pv-body::-webkit-scrollbar-track{background:transparent!important} .ab-art-pv-body::-webkit-scrollbar-thumb{background:var(--border)!important;background-clip:padding-box!important;border:2px solid transparent!important;border-radius:999px!important} .ab-art-pv-body::-webkit-scrollbar-thumb:hover{background:var(--text-muted)!important;background-clip:padding-box!important} .ab-art-pv-md,.ab-art-pv-doc{ max-width:832px!important;margin:0 auto!important;padding:26px 26px 64px!important; font-size:calc(14.5px * var(--ab-fs,1))!important;line-height:1.85!important;color:var(--text-primary)!important; } /* 标题层级：靠留白分层，不靠装饰（WorkBuddy 全部 16px 上下） */ .ab-art-pv-md h1,.ab-art-pv-doc h1{font-size:calc(20px * var(--ab-fs,1))!important;font-weight:600!important;margin:32px 0 12px!important;padding:0!important;border:none!important;letter-spacing:normal!important} .ab-art-pv-md h1:first-child,.ab-art-pv-doc h1:first-child{margin-top:0!important} .ab-art-pv-md h2,.ab-art-pv-doc h2{font-size:calc(17px * var(--ab-fs,1))!important;font-weight:600!important;margin:26px 0 10px!important;padding:0!important;border:none!important} .ab-art-pv-md h3,.ab-art-pv-doc h3{font-size:calc(15px * var(--ab-fs,1))!important;font-weight:600!important;margin:20px 0 8px!important;color:var(--text-primary)!important} .ab-art-pv-md h4,.ab-art-pv-doc h4{font-size:calc(14px * var(--ab-fs,1))!important;font-weight:500!important;margin:16px 0 7px!important;color:var(--text-secondary)!important} .ab-art-pv-md p,.ab-art-pv-doc p{margin:10px 0!important} /* 引用块：左细线 + 极淡底 */ .ab-art-pv-md blockquote,.ab-art-pv-doc blockquote{ margin:14px 0!important;padding:8px 14px!important;border:none!important; border-left:3px solid var(--border)!important;background:rgba(128,128,128,.04)!important;color:var(--text-secondary)!important; } .ab-art-pv-md blockquote p,.ab-art-pv-doc blockquote p{margin:0!important} /* 列表：原生 marker（有序序号加粗，层级天然分明） */ .ab-art-pv-md ul,.ab-art-pv-doc ul{list-style-position:disc!important;list-style-type:disc!important;margin:10px 0 10px 18px!important;padding-left:.2rem!important} .ab-art-pv-md ul>li,.ab-art-pv-doc ul>li{margin:5px 0!important;padding-left:2px!important} .ab-art-pv-md ul>li::before,.ab-art-pv-doc ul>li::before{content:none!important} .ab-art-pv-md ol,.ab-art-pv-doc ol{list-style-position:decimal!important;list-style-type:decimal!important;margin:10px 0 10px 20px!important;padding-left:.2rem!important} .ab-art-pv-md ol>li,.ab-art-pv-doc ol>li{margin:5px 0!important;padding-left:2px!important} .ab-art-pv-md ol>li::before,.ab-art-pv-doc ol>li::before{content:none!important;width:auto!important;height:auto!important;border:none!important;background:none!important;color:inherit!important;font-size:inherit!important;display:inline!important;align-items:normal!important;justify-content:normal!important;border-radius:0!important} .ab-art-pv-md ol>li::marker,.ab-art-pv-doc ol>li::marker{font-weight:700!important;color:var(--text-secondary)!important} /* ③ 增强：表格恢复 1px 格线 + 表头不铺底色 + 斑马纹（宽表左右两列能横向对位） */ .ab-art-pv-md .ab-tbl-wrap,.ab-art-pv-doc .ab-tbl-wrap{ margin:16px 0!important;border:1px solid var(--border)!important;border-radius:calc(4px * var(--ab-radius,1))!important;overflow:auto!important;background:transparent!important; } .ab-art-pv-md .ab-tbl-wrap table,.ab-art-pv-doc .ab-tbl-wrap table{border-collapse:collapse!important;min-width:100%!important;margin:0!important;font-size:calc(13px * var(--ab-fs,1))!important} .ab-art-pv-md .ab-tbl-wrap th,.ab-art-pv-doc .ab-tbl-wrap th{ border:1px solid var(--border)!important;background:none!important;padding:10px!important; text-align:left!important;font-weight:600!important;color:var(--text-primary)!important;white-space:normal!important; } .ab-art-pv-md .ab-tbl-wrap td,.ab-art-pv-doc .ab-tbl-wrap td{ border:1px solid var(--border)!important;padding:10px!important;text-align:left!important; vertical-align:top!important;color:var(--text-primary)!important; } .ab-art-pv-md .ab-tbl-wrap tbody tr:nth-child(even),.ab-art-pv-doc .ab-tbl-wrap tbody tr:nth-child(even){background:rgba(0,0,0,.017)!important} [data-theme="dark"] .ab-art-pv-md .ab-tbl-wrap tbody tr:nth-child(even),[data-theme="dark"] .ab-art-pv-doc .ab-tbl-wrap tbody tr:nth-child(even){background:rgba(255,255,255,.028)!important} /* 代码块：细框等宽，不用厚重黑底 */ .ab-art-pv-md pre,.ab-art-pv-doc pre,.ab-art-pv-code{border:1px solid var(--border)!important;border-radius:calc(8px * var(--ab-radius,1))!important;padding:12px 14px!important;font-size:calc(12.5px * var(--ab-fs,1))!important;line-height:1.7!important;background:rgba(128,128,128,.04)!important} .ab-art-pv-md code,.ab-art-pv-doc code{background:rgba(128,128,128,.09)!important;padding:1px 5px!important;border-radius:calc(4px * var(--ab-radius,1))!important;font-size:calc(12.5px * var(--ab-fs,1))!important} .ab-art-pv-md pre code,.ab-art-pv-doc pre code{background:none!important;padding:0!important} .ab-art-pv-md mark,.ab-art-pv-doc mark{background:rgba(250,204,21,.28)!important;padding:1px 3px!important;border-radius:calc(3px * var(--ab-radius,1))!important;color:inherit!important} .ab-art-pv-md strong,.ab-art-pv-doc strong{font-weight:600!important;color:var(--text-primary)!important} .ab-art-pv-md hr,.ab-art-pv-doc hr{border:none!important;border-top:1px solid var(--border)!important;margin:24px 0!important} /* 结论区：淡绿底 + 左绿条 */ .ab-art-pv-md .concl,.ab-art-pv-doc .concl{margin:18px 0 0!important;padding:12px 14px!important;background:color-mix(in srgb, var(--accent) 7%, transparent)!important;border-left:3px solid var(--accent)!important;border-radius:0 calc(6px * var(--ab-radius,1)) calc(6px * var(--ab-radius,1)) 0!important;color:var(--text-primary)!important} /* 行动项：→ 前缀 */ .ab-art-pv-md .todo,.ab-art-pv-doc .todo{margin:7px 0!important;padding-left:20px!important;position:relative!important} .ab-art-pv-md .todo::before,.ab-art-pv-doc .todo::before{content:'\\2192'!important;position:absolute!important;left:2px!important;color:var(--accent)!important;font-weight:700!important} /* 空态提示更清楚 */ .ab-art-blank-tip{font-size:calc(14px * var(--ab-fs,1))!important;color:var(--text-secondary)!important} /* ══════ v366 文档引擎：markdown-it + highlight.js + katex ══════ */ /* 代码块：语言标签 + 复制按钮（取代原先裸 
）*/
.ab-md-code{margin:16px 0!important;border:1px solid var(--border)!important;border-radius:calc(8px * var(--ab-radius,1))!important;overflow:hidden!important;background:rgba(128,128,128,.035)!important}
.ab-md-code-hd{display:flex!important;align-items:center!important;justify-content:space-between!important;
  padding:5px 10px 5px 12px!important;border-bottom:1px solid var(--border)!important;background:var(--bg-tertiary,rgba(128,128,128,.06))!important}
.ab-md-code-lang{font-size:calc(10.5px * var(--ab-fs,1))!important;letter-spacing:.6px!important;text-transform:uppercase!important;color:var(--text-muted)!important;font-family:inherit!important}
.ab-md-code-copy{
  font-family:inherit!important;font-size:calc(11px * var(--ab-fs,1))!important;line-height:1.6!important;color:var(--text-secondary)!important;
  background:transparent!important;border:1px solid var(--border)!important;border-radius:calc(6px * var(--ab-radius,1))!important;
  padding:1px 9px!important;cursor:pointer!important;transition:all .12s!important;
}
.ab-md-code-copy:hover{border-color:var(--accent)!important;color:var(--accent)!important}
.ab-md-code-copy.ok{border-color:var(--accent)!important;color:var(--accent)!important;font-weight:600!important}
.ab-md-code pre{margin:0!important;border:0!important;border-radius:0!important;background:transparent!important;padding:12px 14px!important;overflow-x:auto!important}
.ab-md-code code{background:none!important;padding:0!important;font-family:Consolas,Monaco,monospace!important;font-size:calc(12.5px * var(--ab-fs,1))!important;line-height:1.7!important}
/* highlight.js 主题（极简：只给关键字/字符串/注释上色，不铺背景）*/
.ab-md-code .hljs-keyword,.ab-md-code .hljs-selector-tag{color:#a626a4!important}
.ab-md-code .hljs-string,.ab-md-code .hljs-attr,.ab-md-code .hljs-template-tag{color:#50a14f!important}
.ab-md-code .hljs-comment,.ab-md-code .hljs-quote{color:#a0a1a7!important;font-style:italic!important}
.ab-md-code .hljs-number,.ab-md-code .hljs-literal{color:#986801!important}
.ab-md-code .hljs-title,.ab-md-code .hljs-function .hljs-title{color:#4078f2!important}
.ab-md-code .hljs-built_in,.ab-md-code .hljs-type{color:#c18401!important}
.ab-md-code .hljs-variable,.ab-md-code .hljs-params{color:#e45649!important}
.ab-md-code .hljs-meta{color:#0184bc!important}
code.hljs{background:rgba(128,128,128,.08)!important;padding:1px 5px!important;border-radius:calc(4px * var(--ab-radius,1))!important}
/* 表格横向滚动容器（宽表不再压缩列宽）*/
.ab-tbl-scroll{overflow-x:auto!important;max-width:100%!important;-webkit-overflow-scrolling:touch!important}
.ab-tbl-scroll table{min-width:100%!important}
/* 表格：纯数字列右对齐（报表观感）*/
.ab-tbl-wrap td{text-align:left!important}
.ab-tbl-wrap td.is-num,.ab-tbl-wrap th.is-num{text-align:right!important;font-variant-numeric:tabular-nums!important}
/* KaTeX 公式容器：块级居中 + 横向可滚 */
.ab-art-pv-md .katex-display,.ab-md .katex-display{margin:16px 0!important;overflow-x:auto!important;overflow-y:hidden!important;padding:2px 0!important}
.ab-art-pv-md .katex,.ab-md .katex{font-size:1.04em!important}
.ab-md-formula-err{color:var(--error,#ef4444)!important;background:rgba(239,68,68,.06)!important;padding:1px 4px!important;border-radius:calc(3px * var(--ab-radius,1))!important}
/* [C.137] katex 按需加载的「占位态」：库还没到货时先按等宽原文显示，到货后由 _abMathSweep 原地升格。
   刻意做成"能读、不跳版"的样式（同色系浅底 + 等宽字体），避免出现裸 $ 或整块空白。 */
.ab-math-raw{font-family:Consolas,Monaco,monospace!important;font-size:.94em!important;color:inherit!important;
  background:rgba(22,163,74,.07)!important;border-radius:calc(4px * var(--ab-radius,1))!important;padding:0 3px!important;white-space:pre-wrap!important}
.ab-math-raw-blk{display:block!important;text-align:center!important;padding:6px 8px!important;margin:8px 0!important}
/* 表格表头 sticky（滚动时列名始终可见）*/
.ab-art-pv-md .ab-tbl-wrap th,.ab-md .ab-tbl-wrap th{position:sticky!important;top:0!important;z-index:2!important}
.ab-cron-countdown{color:var(--accent);font-weight:600}
.ab-cron-envtip{opacity:.75}

/* ===== v367 Word(.docx) 预览（docx-preview 输出容器） ===== */
.ab-art-pv-docx{padding:18px 14px 28px;background:#e8eaf0;overflow:auto;max-height:100%}
.ab-docx-loading{padding:40px 0;text-align:center;color:#6b7280;font-size:calc(13px * var(--ab-fs,1))}
/* docx-preview 渲染出的「纸张」：浅灰底 + 白色 A4 页 + 细阴影，跟 Word 阅读模式一致 */
.ab-art-pv-docx .ab-docx-wrapper{background:transparent!important;padding:0!important}
.ab-art-pv-docx section.ab-docx{background:#fff!important;margin:0 auto 14px!important;box-shadow:0 1px 4px rgba(15,23,42,.13),0 0 0 1px rgba(15,23,42,.05)!important;border-radius:calc(2px * var(--ab-radius,1));overflow:hidden}
/* 预览器限栏：A4 宽最多顶满面板 */
.ab-art-pv-docx section.ab-docx{max-width:820px}
/* 回退提示卡 */
.ab-docx-fallback{padding:42px 20px;text-align:center;color:#4b5563}
.ab-docx-fb-ico{margin:0 auto 12px;width:44px;height:44px;color:#3b82f6}
.ab-docx-fb-ico svg{width:44px;height:44px}
.ab-docx-fb-title{font-size:calc(15px * var(--ab-fs,1));font-weight:600;color:#111827;margin-bottom:8px;word-break:break-all}
.ab-docx-fb-desc{font-size:calc(12.5px * var(--ab-fs,1));line-height:1.7;margin-bottom:16px;color:#6b7280}
.ab-docx-fb-acts .ab-assist-pbtn{display:inline-flex;align-items:center;gap:6px}
.ab-docx-fb-acts .ab-assist-pbtn svg{width:15px;height:15px}

/* ===== v368 Excel(.xlsx/.xls/.csv) 预览（SheetJS 输出容器） ===== */
.ab-art-pv-xlsx{padding:14px 12px 24px;background:var(--bg-primary);overflow:auto;max-height:100%}
.ab-xlsx-wrap{display:flex;flex-direction:column;gap:16px}
.ab-xlsx-sheet{border:1px solid var(--border,#e5e7eb);border-radius:calc(8px * var(--ab-radius,1));overflow:hidden;background:#fff;box-shadow:0 1px 3px rgba(15,23,42,.06)}
.ab-xlsx-sheetname{padding:9px 14px;font-size:calc(12.5px * var(--ab-fs,1));font-weight:600;color:#374151;background:#f9fafb;border-bottom:1px solid var(--border,#e5e7eb)}
.ab-xlsx-tblwrap{overflow:auto;max-height:70vh}
.ab-xlsx-tblwrap table{border-collapse:collapse;width:100%;font-size:calc(12.5px * var(--ab-fs,1))}
.ab-xlsx-tblwrap th,.ab-xlsx-tblwrap td{border:1px solid #e5e7eb;padding:5px 10px;text-align:left;white-space:nowrap}
.ab-xlsx-tblwrap thead th,.ab-xlsx-tblwrap tr:first-child td{background:#f3f4f6;font-weight:600;color:#111827}

/* ===== v369 PDF 预览（pdfjs canvas 序列） ===== */
.ab-art-pv-pdf{padding:14px 12px 28px;background:#e8eaf0;overflow:auto;max-height:100%}
.ab-pdf-wrap{display:flex;flex-direction:column;gap:14px;align-items:center}
.ab-pdf-page{background:#fff;box-shadow:0 1px 4px rgba(15,23,42,.15),0 0 0 1px rgba(15,23,42,.05);border-radius:calc(2px * var(--ab-radius,1));display:block;max-width:100%;height:auto}
.ab-pdf-more{padding:14px 18px;background:#fff;border-radius:calc(8px * var(--ab-radius,1));color:#6b7280;font-size:calc(12.5px * var(--ab-fs,1));border:1px solid var(--border,#e5e7eb);text-align:center;max-width:520px}

/* ===== v370 PPT(.pptx) 预览（PPTXjs 输出容器） ===== */
.ab-art-pv-pptx{padding:16px 12px 28px;background:#e8eaf0;overflow:auto;max-height:100%}
.ab-pptx-wrap{display:flex;flex-direction:column;gap:0;align-items:center}
.ab-pptx-holder{width:100%;max-width:900px;display:flex;flex-direction:column;gap:14px}
/* pptxjs 渲染出的每张幻灯片：白卡片 + 阴影，默认 960×720 等比缩放到面板宽 */
.ab-pptx-holder .slide{background:#fff!important;box-shadow:0 1px 4px rgba(15,23,42,.15),0 0 0 1px rgba(15,23,42,.05)!important;border-radius:calc(2px * var(--ab-radius,1));overflow:hidden;margin:0 auto;max-width:100%;height:auto}
/* 隐藏 pptxjs 自带 loading 进度条（我们用自己的「正在解析」占位） */
.ab-pptx-holder .slides-loadnig-msg{display:none!important}

/* ===== P19-A 统一可观测看板（自动化监控） ===== */
.am-stats{display:flex;gap:10px;flex-wrap:wrap;margin:10px 0}
.am-stat{flex:1;min-width:110px;background:var(--bg-secondary,#12141f);border:1px solid var(--border,color-mix(in srgb, var(--accent) 15%, transparent));border-radius:calc(10px * var(--ab-radius,1));padding:12px 14px;display:flex;flex-direction:column;gap:2px}
.am-stat-num{font-size:calc(22px * var(--ab-fs,1));font-weight:700;color:var(--text-primary,#e0e0e0)}
.am-stat-label{font-size:calc(12px * var(--ab-fs,1));color:var(--text-secondary,#a9adc4)}
.am-section{margin-top:14px}
.am-section-h{font-size:calc(13px * var(--ab-fs,1));font-weight:600;color:var(--text-secondary,#a9adc4);margin:6px 2px 8px;border-left:3px solid var(--brand,var(--accent));padding-left:8px}
.am-src{display:inline-block;font-size:calc(11px * var(--ab-fs,1));padding:1px 7px;border-radius:calc(10px * var(--ab-radius,1));font-weight:600;margin-right:2px}
.am-src-cloud{background:color-mix(in srgb, var(--accent) 14%, transparent);color:var(--accent)}
.am-src-local{background:rgba(96,165,250,.16);color:#60a5fa}
.am-tl-it{display:flex;align-items:flex-start;gap:10px;padding:7px 2px;border-bottom:1px solid var(--border,color-mix(in srgb, var(--accent) 10%, transparent))}
.am-tl-dot{width:9px;height:9px;border-radius:50%;margin-top:5px;flex:none}
.am-tl-dot.ok{background:var(--accent)}
.am-tl-dot.fail{background:#ef4444}
.am-tl-dot.run{background:#f59e0b}
.am-tl-body{min-width:0}
.am-tl-name{font-size:calc(13px * var(--ab-fs,1));font-weight:600;color:var(--text-primary,#e0e0e0)}
.am-tl-meta{font-size:calc(11.5px * var(--ab-fs,1));color:var(--text-secondary,#a9adc4);margin-top:1px}

/* ===== v397 P20-a 全局搜索 ===== */
.ab-gs-overlay{position:fixed;inset:0;z-index:2050;background:rgba(0,0,0,.45);backdrop-filter:blur(2px);display:flex;justify-content:center;align-items:flex-start;padding-top:12vh}
.ab-gs-overlay.hidden{display:none}
.ab-gs{width:600px;max-width:92vw;max-height:64vh;background:var(--bg-primary);border:1px solid var(--border);border-radius:calc(12px * var(--ab-radius,1));overflow:hidden;display:flex;flex-direction:column;box-shadow:0 16px 48px rgba(0,0,0,.35)}
.ab-gs-head{display:flex;align-items:center;gap:8px;padding:11px 14px;border-bottom:1px solid var(--border)}
.ab-gs-head .ab-ic{width:17px;height:17px;color:var(--accent);flex-shrink:0}
.ab-gs-input{flex:1;border:none;outline:none;background:transparent;color:var(--text-primary);font-size:calc(14px * var(--ab-fs,1));font-family:inherit}
.ab-gs-input::placeholder{color:var(--text-muted)}
.ab-gs-hint{font-size:calc(11px * var(--ab-fs,1));color:var(--text-muted);border:1px solid var(--border);border-radius:calc(4px * var(--ab-radius,1));padding:1px 6px;flex-shrink:0}
.ab-gs-list{overflow-y:auto;padding:6px;min-height:88px}
.ab-gs-group{font-size:calc(11px * var(--ab-fs,1));font-weight:600;color:var(--text-muted);padding:8px 10px 4px;letter-spacing:.4px}
.ab-gs-item{display:flex;align-items:flex-start;gap:10px;padding:8px 10px;border-radius:calc(8px * var(--ab-radius,1));cursor:pointer}
.ab-gs-item .ab-ic{width:16px;height:16px;color:var(--text-muted);flex-shrink:0;margin-top:1px}
.ab-gs-item.ab-gs-sel{background:var(--accent-light)}
.ab-gs-item.ab-gs-sel .ab-ic{color:var(--accent)}
.ab-gs-body{flex:1;min-width:0;display:flex;flex-direction:column}
.ab-gs-title{font-size:calc(13px * var(--ab-fs,1));color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ab-gs-item.ab-gs-sel .ab-gs-title{color:var(--accent)}
.ab-gs-sub{font-size:calc(12px * var(--ab-fs,1));color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}
.ab-gs-item mark{background:rgba(250,204,21,.38);color:inherit;border-radius:calc(3px * var(--ab-radius,1));padding:0 1px}
.ab-gs-empty,.ab-gs-loading{padding:22px;text-align:center;font-size:calc(12px * var(--ab-fs,1));color:var(--text-muted)}
.ab-gs-tip{padding:10px 12px}
.ab-gs-tip-t{font-size:calc(12px * var(--ab-fs,1));color:var(--text-muted);margin-bottom:8px}
.ab-gs-tip-row{display:flex;align-items:center;gap:9px;padding:6px 4px;font-size:calc(12.5px * var(--ab-fs,1));color:var(--text-muted)}
.ab-gs-tip-row .ab-ic{width:15px;height:15px;color:var(--accent);flex-shrink:0}
.ab-gs-foot{display:flex;gap:14px;align-items:center;padding:7px 14px;border-top:1px solid var(--border);font-size:calc(11px * var(--ab-fs,1));color:var(--text-muted)}

/* ===== v397 P20-c 资产分享 ===== */
.ab-mkt-card-share{flex:none;width:30px;height:30px;border-radius:calc(8px * var(--ab-radius,1));border:1px solid var(--border);background:transparent;color:var(--text-muted);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:0;margin-right:6px}
.ab-mkt-card-share:hover{border-color:var(--accent);color:var(--accent)}
.ab-mkt-card-share .ab-ic{width:15px;height:15px}
.ab-ash-mask{position:fixed;inset:0;z-index:2200;background:rgba(0,0,0,.45);display:flex;align-items:center;justify-content:center;padding:20px}
.ab-ash-card{position:relative;width:520px;max-width:92vw;background:var(--bg-primary);border:1px solid var(--border);border-radius:calc(14px * var(--ab-radius,1));box-shadow:0 16px 48px rgba(0,0,0,.35);padding:18px 20px}
.ab-ash-close{position:absolute;right:14px;top:12px;cursor:pointer;color:var(--text-muted);font-size:calc(15px * var(--ab-fs,1))}
.ab-ash-head{display:flex;align-items:center;gap:8px;font-size:calc(15px * var(--ab-fs,1));color:var(--text-primary);margin-bottom:14px;padding-right:20px}
.ab-ash-head .ab-ic{width:17px;height:17px;color:var(--accent);flex-shrink:0}
.ab-ash-body{display:flex;gap:18px;align-items:center}
.ab-ash-qrwrap{flex:none;width:170px;text-align:center}
.ab-ash-qr{width:170px;height:170px;display:block;border:1px solid var(--border);border-radius:calc(10px * var(--ab-radius,1));background:#fff;margin:0 auto}
.ab-ash-qr-tip{font-size:calc(11px * var(--ab-fs,1));color:var(--text-muted);margin-top:6px;line-height:1.5}
.ab-ash-info{flex:1;min-width:0}
.ab-ash-title{font-size:calc(15px * var(--ab-fs,1));font-weight:600;color:var(--text-primary);margin-bottom:4px}
.ab-ash-sub{font-size:calc(12px * var(--ab-fs,1));color:var(--text-muted);line-height:1.6;margin-bottom:10px}
.ab-ash-kv{display:flex;gap:8px}
.ab-ash-url{flex:1;min-width:0;font-size:calc(12px * var(--ab-fs,1));color:var(--text-muted);border:1px solid var(--border);border-radius:calc(8px * var(--ab-radius,1));padding:7px 10px;background:var(--panel,#f8fafb);outline:none}
.ab-ash-copy{flex:none;border:none;border-radius:calc(8px * var(--ab-radius,1));background:var(--accent);color:#fff;font-size:calc(12px * var(--ab-fs,1));font-weight:600;padding:7px 14px;cursor:pointer}
.ab-ash-hint{font-size:calc(11px * var(--ab-fs,1));color:var(--text-muted);margin-top:8px}
@media (max-width:600px){.ab-ash-body{flex-direction:column}.ab-ash-qrwrap{width:100%}}

/* ===== v397 P20-e 客户端自检 ===== */
.ab-diag-list{display:flex;flex-direction:column;gap:2px}
.ab-diag-empty{padding:16px;text-align:center;font-size:calc(12px * var(--ab-fs,1));color:var(--text-muted)}
.ab-diag-sum{font-size:calc(12.5px * var(--ab-fs,1));font-weight:600;padding:8px 10px;border-radius:calc(8px * var(--ab-radius,1));margin-bottom:6px}
.ab-diag-sum.ok{background:color-mix(in srgb, var(--accent) 10%, transparent);color:var(--accent)}
.ab-diag-sum.bad{background:rgba(220,38,38,.10);color:#b91c1c}
.ab-diag-row{display:flex;align-items:center;gap:10px;padding:7px 10px;border-radius:calc(8px * var(--ab-radius,1));font-size:calc(13px * var(--ab-fs,1))}
.ab-diag-row:nth-child(odd){background:var(--panel,#f8fafb)}
.ab-diag-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.ab-diag-dot.ok{background:var(--accent-hover)}
.ab-diag-dot.bad{background:#dc2626}
.ab-diag-name{width:84px;flex-shrink:0;color:var(--text-primary)}
.ab-diag-detail{flex:1;min-width:0;color:var(--text-muted);word-break:break-all}
/* ===== v398 P20-f 应用管理 + 安全中心 ===== */
.ab-set-cap{margin-left:8px;font-size:calc(11px * var(--ab-fs,1));font-weight:400;color:var(--text-muted)}
.ab-app-kv{display:flex;justify-content:space-between;gap:10px;padding:6px 2px;font-size:calc(13px * var(--ab-fs,1));border-bottom:1px dashed var(--border)}
.ab-app-kv:last-of-type{border-bottom:0}
.ab-app-kv span{color:var(--text-muted)}
.ab-app-count{font-size:calc(12px * var(--ab-fs,1));color:var(--text-muted);margin-bottom:6px}
.ab-app-count b{color:var(--text-primary)}
.ab-app-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 10px;border-radius:calc(8px * var(--ab-radius,1))}
.ab-app-row:nth-child(odd){background:var(--panel,#f8fafb)}
.ab-app-row-l{min-width:0}
.ab-app-row-n{font-size:calc(13px * var(--ab-fs,1));color:var(--text-primary);display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.ab-app-row-m{font-size:calc(11.5px * var(--ab-fs,1));color:var(--text-muted);margin-top:2px}
.ab-app-tag{display:inline-block;padding:1px 6px;border-radius:calc(8px * var(--ab-radius,1));font-size:calc(10.5px * var(--ab-fs,1));border:1px solid var(--border);color:var(--text-muted)}
.ab-app-tag.ext{border-color:color-mix(in srgb, var(--accent) 50%, transparent);color:var(--accent-hover)}
.ab-app-toggle{flex-shrink:0;padding:4px 12px;border-radius:calc(8px * var(--ab-radius,1));font-size:calc(12px * var(--ab-fs,1));cursor:pointer;border:1px solid var(--border);background:transparent;color:var(--text-primary)}
.ab-app-toggle.on{background:linear-gradient(135deg,var(--accent),var(--accent-hover));border-color:transparent;color:#fff}
.ab-app-revoke{flex-shrink:0;padding:4px 12px;border-radius:calc(8px * var(--ab-radius,1));font-size:calc(12px * var(--ab-fs,1));cursor:pointer;border:1px solid rgba(220,38,38,.5);background:transparent;color:#dc2626}
.ab-app-revoke:hover{background:rgba(220,38,38,.08)}
.ab-audit-row{display:flex;justify-content:space-between;gap:10px;padding:7px 10px;border-radius:calc(8px * var(--ab-radius,1));font-size:calc(12.5px * var(--ab-fs,1))}
.ab-audit-row:nth-child(odd){background:var(--panel,#f8fafb)}
.ab-audit-t{color:var(--text-primary);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ab-audit-m{color:var(--text-muted);flex-shrink:0}
/* ===== v400 P20-h 每月多日期选择器 ===== */
.ab-md-grid{display:flex;flex-wrap:wrap;gap:5px;margin-top:2px}
.ab-md-chip{width:32px;height:28px;border-radius:calc(7px * var(--ab-radius,1));border:1px solid var(--border);background:transparent;color:var(--text-secondary);font-size:calc(12px * var(--ab-fs,1));cursor:pointer;padding:0;font-family:inherit}
.ab-md-chip:hover{border-color:var(--accent)}
.ab-md-chip.ab-md-on{background:linear-gradient(135deg,var(--accent),var(--accent-hover));border-color:transparent;color:#fff;font-weight:600}
/* ===== v401 P20-l ⑥系统分享入站：拖拽入站遮罩 ===== */
.ab-drop-overlay{position:fixed;inset:0;z-index:99998;display:flex;align-items:center;justify-content:center;background:rgba(15,17,21,.72);backdrop-filter:blur(2px);pointer-events:none}
.ab-drop-overlay.hidden{display:none}
.ab-drop-inner{display:flex;flex-direction:column;align-items:center;gap:8px;padding:26px 40px;border:2px dashed var(--accent);border-radius:calc(16px * var(--ab-radius,1));background:var(--panel,#fff);color:var(--text-primary,#1f2937);box-shadow:0 12px 40px rgba(0,0,0,.35);text-align:center}
.ab-drop-inner .ab-ic{width:34px;height:34px;color:var(--accent)}
.ab-drop-t1{font-size:calc(15px * var(--ab-fs,1));font-weight:600}
.ab-drop-t2{font-size:calc(12px * var(--ab-fs,1));color:var(--text-muted,#6b7280)}
/* ===== v402 P20-m ⑦专家团：多专家并行协作选择器 ===== */
.ab-team-overlay{position:fixed;inset:0;z-index:99999;display:flex;align-items:center;justify-content:center;background:rgba(15,17,21,.55);backdrop-filter:blur(2px)}
.ab-team-dlg{width:min(560px,92vw);max-height:82vh;display:flex;flex-direction:column;background:var(--panel,#fff);border:1px solid var(--border);border-radius:calc(16px * var(--ab-radius,1));box-shadow:0 20px 60px rgba(0,0,0,.4);overflow:hidden}
.ab-team-head{display:flex;align-items:flex-start;justify-content:space-between;padding:16px 18px 10px;border-bottom:1px solid var(--border)}
.ab-team-title{font-size:calc(15px * var(--ab-fs,1));font-weight:600;color:var(--text-primary)}
.ab-team-sub{font-size:calc(12px * var(--ab-fs,1));color:var(--text-muted);margin-top:3px}
.ab-team-x{border:none;background:transparent;font-size:calc(20px * var(--ab-fs,1));line-height:1;color:var(--text-muted);cursor:pointer;padding:2px 6px;border-radius:calc(6px * var(--ab-radius,1))}
.ab-team-x:hover{background:var(--hover,rgba(0,0,0,.05))}
/* [C.108] 原选择器与同事团 Tab 冲突，把 Tab 压成 3 列；收窄到弹窗内 */
.ab-team-dlg .ab-team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:14px 18px;overflow-y:auto}
.ab-team-card{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 6px;border:1px solid var(--border);border-radius:calc(10px * var(--ab-radius,1));background:transparent;color:var(--text-secondary);cursor:pointer;font-family:inherit}
.ab-team-card:hover{border-color:var(--accent)}
.ab-team-card.ab-team-on{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 8%, transparent);color:var(--text-primary);font-weight:600}
.ab-team-ico .ab-ic{width:20px;height:20px;color:var(--accent)}
.ab-team-nm{font-size:calc(12px * var(--ab-fs,1))}
.ab-team-ck{position:absolute;top:4px;right:6px;font-size:calc(12px * var(--ab-fs,1));color:var(--accent);opacity:0}
.ab-team-card.ab-team-on .ab-team-ck{opacity:1}
.ab-team-foot{display:flex;align-items:center;gap:8px;padding:12px 18px;border-top:1px solid var(--border)}
.ab-team-cnt{font-size:calc(12px * var(--ab-fs,1));color:var(--text-muted)}
.ab-team-go{background:linear-gradient(135deg,var(--accent),var(--accent-hover));color:#fff;border-color:transparent}
.ab-team-go:disabled{opacity:.45;cursor:not-allowed}
/* ===== v403 P20-n ⑨品牌设计模板库 ===== */
.ab-brand-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;padding:14px 18px;overflow-y:auto}
.ab-brand-card{display:flex;flex-direction:column;gap:6px;padding:12px;border:1px solid var(--border);border-radius:calc(12px * var(--ab-radius,1));background:transparent;cursor:pointer;text-align:left;font-family:inherit;color:var(--text-secondary)}
.ab-brand-card:hover{border-color:var(--accent);box-shadow:0 4px 14px rgba(0,0,0,.08)}
.ab-brand-top{display:flex;align-items:center;gap:6px;color:var(--text-primary);font-size:calc(13px * var(--ab-fs,1))}
.ab-brand-top .ab-ic{width:16px;height:16px;color:var(--accent)}
.ab-brand-sw{display:flex;gap:4px}
.ab-brand-sw i{width:22px;height:14px;border-radius:calc(4px * var(--ab-radius,1));border:1px solid rgba(0,0,0,.12)}
.ab-brand-desc{font-size:calc(11.5px * var(--ab-fs,1));color:var(--text-muted)}
.ab-brand-f{font-size:calc(11px * var(--ab-fs,1));color:var(--text-muted);opacity:.85}
/* ===== v406 P20-o ⑧P0 文档集成 ===== */
.ab-doc-prov{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.ab-doc-prov-item{border:1px solid var(--border);border-radius:calc(10px * var(--ab-radius,1));padding:10px 12px;cursor:pointer;background:transparent}
.ab-doc-prov-item:hover{border-color:var(--accent)}
.ab-doc-prov-on{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 7%, transparent)}
.ab-doc-prov-h{display:flex;align-items:center;gap:6px;font-size:calc(13px * var(--ab-fs,1))}
.ab-doc-badge{font-size:calc(11px * var(--ab-fs,1));padding:1px 7px;border-radius:calc(9px * var(--ab-radius,1));font-weight:600}
.ab-doc-ok{background:var(--nc-soft,color-mix(in srgb, var(--accent) 10%, transparent));color:#0f5132}
.ab-doc-no{background:#fffbeb;color:#b45309}
.ab-doc-cur{background:var(--blue-bg,#eff6ff);color:#2563eb}
.ab-doc-prov-n{font-size:calc(11.5px * var(--ab-fs,1));color:var(--text-muted);margin-top:3px}
.ab-doc-prov-cfg{display:flex;gap:6px;margin-top:7px;align-items:center}
.ab-doc-prov-cfg .ab-as-input{flex:1 1 0;min-width:0;font-size:calc(12px * var(--ab-fs,1));padding:4px 7px}
.ab-doc-prov-cfg [data-tk]{flex:0 1 104px}
.ab-doc-prov-cfg .ab-set-btn{flex:0 0 auto;padding:4px 10px;font-size:calc(12px * var(--ab-fs,1));white-space:nowrap}
/* ===== C.189 P25 甲档：文档平台真 MCP 连接（六态徽标 + 工具清单） ===== */
.ab-doc-err{background:#fef2f2;color:#b91c1c}
.ab-doc-idle{background:#f1f5f9;color:#475569}
.ab-doc-loc{background:#f1f5f9;color:#475569}
.ab-doc-st-detail{font-size:calc(11px * var(--ab-fs,1));margin-top:5px;line-height:1.5;word-break:break-all}
.ab-doc-st-err{color:#b91c1c}
.ab-doc-st-ok{color:#0f5132}
.ab-doc-st-warn{color:#b45309}
.ab-doc-mcp-row{display:flex;gap:6px;margin-top:6px;align-items:center;flex-wrap:wrap}
.ab-doc-mcp-row .ab-set-btn{padding:3px 9px;font-size:calc(11.5px * var(--ab-fs,1));white-space:nowrap}
.ab-doc-mcp-tools{margin-top:6px;font-size:calc(11px * var(--ab-fs,1));color:var(--text-muted);line-height:1.6}
.ab-doc-mcp-tools code{font-family:ui-monospace,Menlo,Consolas,monospace;background:color-mix(in srgb, var(--accent) 8%, transparent);padding:1px 5px;border-radius:4px;margin-right:4px;display:inline-block}
.ab-doc-mcp-map{margin-top:5px;display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 8px;align-items:center;font-size:calc(11px * var(--ab-fs,1))}
.ab-doc-mcp-map label{color:var(--text-muted);white-space:nowrap}
.ab-doc-mcp-map select{font-size:calc(11px * var(--ab-fs,1));padding:2px 5px;border:1px solid var(--border);border-radius:calc(6px * var(--ab-radius,1));background:#fff;color:var(--text-primary);width:100%;min-width:0;max-width:100%}
.ab-doc-wrap{display:flex;gap:12px;margin-top:8px;min-height:300px}
.ab-doc-list{width:210px;flex-shrink:0;border:1px solid var(--border);border-radius:calc(10px * var(--ab-radius,1));overflow:auto;max-height:420px;background:var(--panel,#f8fafb)}
.ab-doc-li{display:flex;justify-content:space-between;gap:6px;padding:7px 10px;font-size:calc(12.5px * var(--ab-fs,1));cursor:pointer;border-bottom:1px solid var(--border)}
.ab-doc-li:hover{background:color-mix(in srgb, var(--accent) 7%, transparent)}
.ab-doc-li-on{background:color-mix(in srgb, var(--accent) 12%, transparent);font-weight:600;color:#0f5132}
.ab-doc-li-sz{color:var(--text-muted);font-size:calc(11px * var(--ab-fs,1));flex-shrink:0}
.ab-doc-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.ab-doc-tools{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.ab-doc-newname{width:180px;font-size:calc(12px * var(--ab-fs,1));padding:4px 7px}
.ab-doc-cur{font-size:calc(12.5px * var(--ab-fs,1));font-weight:600;color:var(--text-primary)}
.ab-doc-body{width:100%;min-height:210px;resize:vertical;border:1px solid var(--border);border-radius:calc(8px * var(--ab-radius,1));padding:10px;font-size:calc(13px * var(--ab-fs,1));line-height:1.6;font-family:inherit;background:#fff;color:var(--text-primary)}
.ab-doc-meta{font-size:calc(11.5px * var(--ab-fs,1));color:var(--text-muted)}
.ab-doc-conf{color:#b45309}
.ab-doc-conf-snip{opacity:.7;font-size:calc(11px * var(--ab-fs,1))}
/* 行内复选标签（与 .ab-set-radio 同风格，避免回退浏览器默认字体） */
.ab-set-rowline{display:inline-flex;align-items:center;gap:6px;font-size:calc(13px * var(--ab-fs,1));color:var(--text-secondary);cursor:pointer;font-family:inherit}
.ab-set-rowline input{accent-color:var(--accent);margin:0;flex-shrink:0}

.ab-doc-tools2{margin-top:2px}
.ab-doc-tpl{width:112px;font-size:calc(12px * var(--ab-fs,1));padding:4px 7px}
.ab-doc-cmt{width:150px;font-size:calc(12px * var(--ab-fs,1));padding:4px 7px}

/* ===== v408 P20-r 输入区：放大/润色/麦克风竖排在输入框右侧 ===== */
.ab-inputbox{position:relative}
.ab-input-righticons{position:absolute;right:10px;top:10px;display:flex;flex-direction:column;align-items:center;gap:3px;z-index:5}
.ab-input-righticons .ab-icon-btn,.ab-input-righticons .ab-voice-btn{width:28px;height:28px;border-radius:calc(8px * var(--ab-radius,1));display:inline-flex;align-items:center;justify-content:center}
.ab-inputbox .ab-input{padding-right:56px}
.ab-big-input-mask{position:fixed;inset:0;z-index:999995;background:rgba(15,23,42,.42);display:flex;align-items:center;justify-content:center;padding:24px}
.ab-big-input-dlg{width:min(880px,92vw);height:min(620px,80vh);background:var(--card-bg,#fff);border:1px solid var(--border);border-radius:calc(14px * var(--ab-radius,1));display:flex;flex-direction:column;overflow:hidden;box-shadow:0 20px 60px rgba(15,23,42,.28)}
.ab-big-input-head{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--border)}
.ab-big-input-title{font-weight:600;font-size:calc(14px * var(--ab-fs,1));color:var(--text-primary)}
.ab-big-input-cnt{font-size:calc(12px * var(--ab-fs,1));color:var(--text-muted);margin-left:auto}
.ab-big-input-ta{flex:1;min-height:0;width:100%;border:0;outline:none;resize:none;padding:16px;font-size:calc(14px * var(--ab-fs,1));line-height:1.7;background:transparent;color:var(--text-primary);font-family:inherit}
.ab-task-datapanel{flex:1;min-height:0;overflow:auto}
.ab-task-datapanel.hidden{display:none !important}

.ab-chip-brand-on{border-color:var(--accent);color:var(--accent)}

/* ===== P20-v 技能管理（本地技能记忆）===== */
.ab-autosetup.ab-skillmgr { width: 560px; }
.ab-skillmgr-memhead { display: flex; align-items: center; justify-content: space-between; font-weight: 700; font-size: calc(13px * var(--ab-fs,1)); color: var(--text-primary); }
.ab-skillmgr-memstate { font-weight: 500; font-size: calc(12px * var(--ab-fs,1)); color: var(--accent); }
.ab-skillmgr-note { font-size: calc(12px * var(--ab-fs,1)); color: var(--text-muted); line-height: 1.55; }
.ab-skillmgr-sub { margin-top: 6px; font-weight: 600; font-size: calc(12.5px * var(--ab-fs,1)); color: var(--text-secondary); }
.ab-skillmgr-chips { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.ab-skillmgr-chip { display: inline-flex; align-items: center; gap: 4px; padding: 3px 9px; border: 1px solid color-mix(in srgb, var(--accent) 40%, transparent); border-radius: calc(12px * var(--ab-radius,1)); background: color-mix(in srgb, var(--accent) 8%, transparent); color: var(--accent); font-size: calc(12px * var(--ab-fs,1)); }
.ab-skillmgr-chip .ab-ic { width: 13px; height: 13px; }
.ab-skillmgr-chip b { font-weight: 700; opacity: .7; }
.ab-skillmgr-clear { padding: 3px 9px; border: 1px dashed var(--border); border-radius: calc(12px * var(--ab-radius,1)); background: transparent; color: var(--text-muted); font-size: calc(11.5px * var(--ab-fs,1)); cursor: pointer; }
.ab-skillmgr-clear:hover { color: var(--error, #ef4444); border-color: var(--error, #ef4444); }
.ab-skillmgr-row { display: flex; align-items: center; gap: 8px; padding: 6px 2px; border-bottom: 1px solid var(--border); }
.ab-skillmgr-row:last-child { border-bottom: none; }
.ab-skillmgr-off { opacity: .5; }
.ab-skillmgr-ic { display: inline-flex; width: 20px; height: 20px; align-items: center; justify-content: center; color: var(--accent); flex-shrink: 0; }
.ab-skillmgr-ic .ab-ic { width: 16px; height: 16px; }
.ab-skillmgr-name { flex: 1; min-width: 0; font-size: calc(12.5px * var(--ab-fs,1)); color: var(--text-primary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ab-skillmgr-tag { font-size: calc(10px * var(--ab-fs,1)); padding: 0 5px; border-radius: calc(7px * var(--ab-radius,1)); background: var(--bg-secondary); color: var(--text-muted); }
.ab-skillmgr-btn { flex-shrink: 0; padding: 2px 9px; border: 1px solid var(--border); border-radius: calc(7px * var(--ab-radius,1)); background: var(--bg-secondary); color: var(--text-secondary); font-size: calc(11.5px * var(--ab-fs,1)); cursor: pointer; transition: all .15s; }
.ab-skillmgr-btn:hover { border-color: var(--accent); color: var(--accent); }
.ab-skillmgr-btn.danger:hover { border-color: var(--error, #ef4444); color: var(--error, #ef4444); }
.ab-skillmgr-empty, .ab-skillmgr-more { font-size: calc(12px * var(--ab-fs,1)); color: var(--text-muted); padding: 6px 2px; }
.ab-skill-mem-strip { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; padding: 2px 2px 8px; }
.ab-skill-mem-lbl { font-size: calc(11.5px * var(--ab-fs,1)); color: var(--text-muted); flex-shrink: 0; }
.ab-skill-mem-chip { display: inline-flex; align-items: center; gap: 4px; padding: 3px 10px; border: 1px solid color-mix(in srgb, var(--accent) 40%, transparent); border-radius: calc(13px * var(--ab-radius,1)); background: color-mix(in srgb, var(--accent) 8%, transparent); color: var(--accent); font-size: calc(12px * var(--ab-fs,1)); cursor: pointer; }
.ab-skill-mem-chip:hover { background: color-mix(in srgb, var(--accent) 16%, transparent); }
.ab-skill-mem-chip .ab-ic { width: 13px; height: 13px; }

/* ===== P29：消息区紧凑化（段落/列表/标题间距收紧，行高略降，省出可视空间） ===== */
/* 用户气泡文字色 --user-bubble-fg：深色系=亮灰 #e8eaed；浅色系=近黑 #0f1115；
   选了自定义主题色时由 JS 按背景亮度（WCAG 对比度）自动改成近黑或亮灰 */
:root { --user-bubble-fg: #e8eaed; }
:root.ab-light { --user-bubble-fg: #0f1115; }
:root.ab-theme-warm, :root.ab-light.ab-theme-warm { --user-bubble-fg: #2a2115; }
.ab-msg { margin-bottom: 10px; }
.ab-bubble { padding: 8px 12px; }
.ab-msg-brand { margin-bottom: 3px; }
/* P42：流式中滚动窗口；完成后全文平铺（老板 2026-10-13 令：正文不得默认折叠/限高，撤销 P38-3 的 420px 常驻滚动） */
.ab-bubble-text { line-height: 1.68; max-height: none; overflow: visible; }
.ab-streaming > .ab-bubble-text { max-height: 420px; overflow-y: auto; overflow-x: hidden; overscroll-behavior: contain; }
.ab-bubble-text.ab-folded { max-height: 260px; overflow: hidden; position: relative; }
/* 折叠态底部渐隐：提示「下面还有内容」，不是被生硬切断 */
.ab-bubble-text.ab-folded::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 44px;
  pointer-events: none; background: linear-gradient(to bottom, transparent, var(--bg-elev, var(--bg-secondary, #fff))); }
.ab-fold-more { display: inline-flex; align-items: center; gap: 5px; margin: 6px 0 2px; padding: 3px 10px;
  font-size: calc(12px * var(--ab-fs,1)); color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, transparent);
  border: 1px solid color-mix(in srgb, var(--accent) 26%, transparent); border-radius: 999px; cursor: pointer; user-select: none; }
.ab-fold-more:hover { background: color-mix(in srgb, var(--accent) 14%, transparent); }
.ab-bubble-text > p { margin: 10px 0; }
.ab-bubble-text > ul, .ab-bubble-text > ol { margin: 10px 0; padding-left: 22px; }
.ab-bubble-text li { margin: 5px 0; line-height: 1.68; }
.ab-bubble-text li > p { margin: 4px 0; }
.ab-bubble-text > h1, .ab-bubble-text > h2, .ab-bubble-text > h3,
.ab-bubble-text > h4, .ab-bubble-text > h5, .ab-bubble-text > h6 { line-height: 1.4; color: var(--text-primary); }
.ab-bubble-text > h1 { font-size: calc(19px * var(--ab-fs,1)); margin: 18px 0 9px; }
.ab-bubble-text > h2 { font-size: calc(17.5px * var(--ab-fs,1)); margin: 18px 0 9px; padding-bottom: 5px; border-bottom: 1px solid var(--border); }
.ab-bubble-text > h3 { font-size: calc(16px * var(--ab-fs,1)); margin: 15px 0 7px; }
.ab-bubble-text > h4, .ab-bubble-text > h5, .ab-bubble-text > h6 { font-size: calc(15px * var(--ab-fs,1)); margin: 13px 0 6px; }
.ab-bubble-text > blockquote { margin: 12px 0; padding: 8px 13px; border-left: 3px solid color-mix(in srgb, var(--accent) 45%, transparent);
  background: color-mix(in srgb, var(--accent) 5%, transparent); border-radius: 0 calc(6px * var(--ab-radius,1)) calc(6px * var(--ab-radius,1)) 0;
  color: var(--text-secondary); }
.ab-bubble-text > hr { margin: 16px 0; border: 0; border-top: 1px solid var(--border); }
/* ===== P38-3.1：把产物面板那套「报告级排版语言」接入聊天气泡 =====
   ▪ 行动项 → 前缀 + 悬挂缩进；✅ 结论行 → 淡底 + 左强调条。原先这两个类在聊天区零样式，
   导致符号与普通正文长得一样、回看无层次。 */
.ab-bubble-text > p.todo { position: relative; margin: 7px 0; padding-left: 20px; }
.ab-bubble-text > p.todo::before { content: '\2192'; position: absolute; left: 2px; top: 0;
  color: var(--accent); font-weight: 700; }
.ab-bubble-text > p.concl { margin: 12px 0; padding: 10px 13px; border-left: 3px solid var(--accent);
  border-radius: 0 calc(6px * var(--ab-radius,1)) calc(6px * var(--ab-radius,1)) 0;
  background: color-mix(in srgb, var(--accent) 7%, transparent); color: var(--text-primary); }
/* 表格：留足上下间距，避免与正文贴住 */
.ab-bubble-text .ab-tbl-wrap { margin: 13px 0; }
.ab-bubble-text .ab-tbl-wrap > table { font-size: calc(13.5px * var(--ab-fs,1)); }
.ab-bubble-text .ab-tbl-wrap thead th { background: color-mix(in srgb, var(--accent) 9%, var(--bg-secondary, #f6f7f9));
  font-weight: 700; }
.ab-bubble-text .ab-tbl-wrap tbody tr:nth-child(even) { background: color-mix(in srgb, var(--text-primary) 3%, transparent); }
.ab-bubble-text > p:first-child { margin-top: 0; }
.ab-bubble-text > p:last-child { margin-bottom: 0; }
.ab-msg-artifacts { margin-top: 8px; }
/* 用户气泡文字：不再跟随主题色（自定义主题色会导致文字与底色同色糊成一团），
   改由 --user-bubble-fg 控制：背景亮→近黑，背景暗→亮灰（JS 按对比度自动切换） */
:root .ab-msg.ab-msg-user .ab-bubble-user { color: var(--user-bubble-fg, #0f1115); }

/* ===== P31：AI 回复段落间距「真根因」修复 =====
   .ab-bubble 全局 white-space:pre-wrap（用户消息需要保留手工换行），
   但 AI 正文是 markdown-it 产出的 HTML：`
a
\n
b
` 之间的换行会被 pre-wrap 渲染成空行，
   实测 3 段多出 ~55px。故：AI 气泡正文改 normal（流式期间仍保留 pre-wrap），代码块单独保留 pre。 */
.ab-bubble-bot .ab-bubble-text { white-space: normal; }
.ab-bubble-bot .ab-bubble-text.ab-streaming,
.ab-bubble-bot.ab-streaming > .ab-bubble-text { white-space: pre-wrap; }
.ab-bubble-text pre, .ab-bubble-text pre code { white-space: pre; }
.ab-bubble-tool { white-space: pre-wrap; }

/* ===== P38-3.5：总概括卡内的「子代理协同」层 ===== */
.ab-sc-subs { margin: 8px 0 2px; padding: 8px 10px; border-radius: calc(8px * var(--ab-radius,1));
  background: color-mix(in srgb, var(--text-primary) 3%, transparent); }
.ab-sc-subshead { font-size: calc(11.5px * var(--ab-fs,1)); font-weight: 600; color: var(--text-secondary); margin-bottom: 6px; }
.ab-sc-sub { display: flex; align-items: baseline; gap: 7px; margin: 4px 0; min-width: 0;
  font-size: calc(12px * var(--ab-fs,1)); }
.ab-sc-subdot { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); flex: 0 0 auto; transform: translateY(-1px); }
.ab-sc-subdot.is-err { background: var(--error, #ef4444); }
.ab-sc-subname { color: var(--text-primary); font-weight: 600; flex: 0 0 auto; }
.ab-sc-substate { color: var(--text-muted); flex: 0 0 auto; }
.ab-sc-subtxt { color: var(--text-secondary); flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ===== P38-5 收尾专业化 + 计划预告 ===== */
.ab-pc-live { display: inline-flex; align-items: center; gap: 5px; font-size: calc(11.5px * var(--ab-fs,1));
  color: var(--text-muted); }
.ab-sc-arts { display: inline-flex; align-items: center; gap: 5px; margin: 7px 0 2px;
  font-size: calc(12px * var(--ab-fs,1)); color: var(--text-secondary); }
.ab-sc-arts strong { color: var(--text-primary); font-weight: 700; }
.ab-sc-artsmk { color: var(--accent); font-weight: 700; }

/* ===== P38-7 执行动作语义化（线性图标 + 动作词 + 文件名 + 增减量）===== */
.ab-act-verb { color: var(--text-secondary); }
.ab-act-target { display: inline-block; margin-left: 5px; padding: 0 5px; border-radius: calc(4px * var(--ab-radius,1));
  font-family: 'Cascadia Code', Consolas, monospace; font-size: calc(11.5px * var(--ab-fs,1));
  color: var(--text-primary); background: color-mix(in srgb, var(--text-primary) 6%, transparent);
  max-width: 260px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: bottom; }
.ab-act-delta { display: inline-flex; gap: 4px; margin-left: 6px; font-variant-numeric: tabular-nums;
  font-size: calc(11.5px * var(--ab-fs,1)); }
.ab-act-delta em { font-style: normal; font-weight: 700; }
.ab-act-delta em.add { color: #16a34a; }
.ab-act-delta em.del { color: #dc2626; }
.ab-act-note { margin-left: 6px; color: var(--text-muted); font-size: calc(11.5px * var(--ab-fs,1)); }
.ab-wstep-ico .ab-ic { width: 13px; height: 13px; }
.ab-wstep-run .ab-act-verb { color: inherit; }

/* GW.045 问题④【老板 2026-10-10：回复信息太窄 → 宽度自适应，对齐 WorkBuddy 参考宽度】
   WorkBuddy 实测（renderer main-content-core.css）：对话内容列 = var(--cb-chat-max-content-width,848px)，
   宽屏 @media (width>=1681px) 放大到 1008px，整体 margin:0 auto 居中。
   此处：消息列与输入区共用同一条 --ab-chat-maxw，宽度随视口自适应，且「消息列 ↔ 输入框」左右对齐。
   · 消息行整体居中到内容列宽（原为左贴边 + 800px 硬顶，右侧留白过大 = 老板所见的"太窄"）；
   · 内容列填满居中行，短回复仍定宽不缩（防关键词被挤压换行）。 */
:root { --ab-chat-maxw: 848px; }
@media (min-width: 1681px) { :root { --ab-chat-maxw: 1008px; } }
.ab-msg { max-width: var(--ab-chat-maxw); margin-left: auto; margin-right: auto; }
.ab-msg:not(.ab-msg-user) > div[style*="min-width"] { flex: 1 1 auto; min-width: 0; max-width: none; }
.ab-inputzone-center .ab-inputbar,
.ab-inputzone-center .ab-hotbar { max-width: var(--ab-chat-maxw); }

/* ===== GW.040【老板 2026-10-10 指令：运行过程实时展示】「思考过程」可折叠实时区 =====
   BFF 把模型思考段(reasoning)实时下发为 thinking 帧 → 渲染在气泡正文上方。
   进行中：线性描边时钟图标 + 逐字滚动，客户实时看到模型在"想什么"；
   正文到达：自动收起为「已思考 Ns · 展开」（保留，可随时回看）。 */
.ab-thinklive {
  margin: 0 0 8px;
  border: 1px solid var(--border);
  border-left: 2px solid var(--accent);
  border-radius: calc(9px * var(--ab-radius));
  background: var(--card-bg);
  overflow: hidden;
}
.ab-thinklive-head {
  display: flex; align-items: center; gap: 6px;
  padding: 6px 10px; cursor: default; user-select: none;
  font-size: calc(12px * var(--ab-fs)); color: var(--text-secondary);
}
.ab-thinklive:not(.is-live) .ab-thinklive-head { cursor: pointer; }
.ab-thinklive-ico { width: 14px; height: 14px; flex: 0 0 auto; color: var(--accent); }
.ab-thinklive.is-live .ab-thinklive-ico { animation: abThinkPulse 1.6s ease-in-out infinite; }
@keyframes abThinkPulse { 0%, 100% { opacity: 1; } 50% { opacity: .3; } }
.ab-thinklive-title { font-weight: 600; color: var(--text-secondary); }
.ab-thinklive.is-live .ab-thinklive-title { color: var(--accent); }
.ab-thinklive-meta { color: var(--text-muted); font-size: calc(11px * var(--ab-fs)); min-width: 0; max-width: 62%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ab-thinklive-caret { margin-left: auto; color: var(--text-muted); font-size: calc(11px * var(--ab-fs)); }
.ab-thinklive-body {
  max-height: 180px; overflow-y: auto;
  padding: 2px 12px 10px;
  font-size: calc(12px * var(--ab-fs)); line-height: 1.7;
  color: var(--text-muted);
  white-space: pre-wrap; word-break: break-word;
  border-top: 1px dashed var(--border);
}
.ab-thinklive.is-collapsed .ab-thinklive-body { display: none; }
/* GW.041：思考首帧前占位（"正在思考…"），比正文更弱，与脉动图标呼应 */
.ab-thinklive-ph { color: var(--text-muted); opacity: .7; }
.ab-thinklive.is-live .ab-thinklive-ph { animation: abThinkPulse 1.6s ease-in-out infinite; }
/* 深色系主题：压一层更柔的底，避免与气泡同色糊在一起 */
:root:not(.ab-light) .ab-thinklive { background: rgba(255,255,255,0.035); }

/* ===== GW.044【老板 2026-10-10：照 WorkBuddy 实时进程——按推理轮次切段的「进程瀑布」】==========
   形态：段（.ab-pfseg）纵向堆叠，每段 = 一次推理(思考) + 其触发的动作；
        · 进行中段 → 展开、实时滚动（左侧竖线提示推进中）；
        · 完成段   → 自动折叠为一行总结「▸ 已完成 N 步工作 · 摘要」；
        · 整个瀑布盒内滚动（max-height + overflow-y:auto），上文流式输出可回看，不撑破气泡。
   开关 AB_PFLOW=false 时不产生 .ab-pflow，本块不生效（样式层天然向前兼容旧结构）。 */
.ab-pflow {
  display: flex; flex-direction: column; gap: 6px;
  margin: 0 0 8px;
  max-height: 300px; overflow-y: auto;
  padding-right: 2px;
}
/* 段头（折叠条）：箭头 + 标题 + 一句话摘要 */
.ab-pfseg-head {
  display: flex; align-items: center; gap: 6px;
  padding: 5px 9px; border-radius: calc(8px * var(--ab-radius));
  font-size: calc(12px * var(--ab-fs)); color: var(--text-secondary);
  cursor: default; user-select: none;
}
.ab-pfseg.is-done .ab-pfseg-head { cursor: pointer; }
.ab-pfseg.is-done .ab-pfseg-head:hover { background: color-mix(in srgb, var(--accent) 8%, transparent); }
.ab-pf-arrow { flex: 0 0 auto; color: var(--text-muted); font-size: calc(11px * var(--ab-fs)); display: inline-block; }
.ab-pfseg-title { font-weight: 600; flex: 0 0 auto; }
.ab-pfseg.is-live .ab-pfseg-title { color: var(--accent); }
.ab-pfseg-brief { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text-muted); font-size: calc(11px * var(--ab-fs)); }
/* 段体：进行中展开；完成后随 is-collapsed 收起 */
.ab-pfseg-body { display: flex; flex-direction: column; gap: 4px; padding-left: 4px; }
.ab-pfseg.is-collapsed .ab-pfseg-body { display: none; }
/* 进行中段：左侧竖线提示「正在推进」；完成段：整体略收灰弱化 */
.ab-pfseg.is-live { border-left: 2px solid color-mix(in srgb, var(--accent) 35%, transparent); border-radius: 2px; }
.ab-pfseg.is-done { opacity: .92; }
/* 段内复用 .ab-thinklive / .ab-wsteps 既有渲染，做最轻的边距归零 */
.ab-pfseg-body > .ab-thinklive { margin: 0; }
.ab-pfseg-body > .ab-wsteps { margin-bottom: 4px; }
/* 关键：段内思考区不再独立开滚动条——文本全展开，统一由外层 .ab-pflow 一条滚动条承接（老板口径：内嵌滚动条处理上文流式输出） */
.ab-pflow .ab-thinklive-body { max-height: none; overflow-y: visible; }
/* 瀑布盒内滚动条：细窄低调（Webkit），不喧宾夺主 */
.ab-pflow::-webkit-scrollbar { width: 6px; }
.ab-pflow::-webkit-scrollbar-thumb { background: var(--border); border-radius: 3px; }
.ab-pflow::-webkit-scrollbar-track { background: transparent; }
/* ===== /GW.044 ===== */

/* ===== P0（2026-10-11 对标 WorkBuddy 回复链）新增三处：编辑态产物保护提示 / 归纳卡量化收尾行 / 请求 ID 详情行 ===== */
/* P0-N3 编辑重发：明确「已有产物不会被删除」，消除客户误以为改名重发会连带清文件的顾虑 */
.ab-msg-editnote { margin-top: 6px; font-size: calc(11px * var(--ab-fs,1)); line-height: 1.55; color: var(--text-muted); opacity: .88; }
/* P0-N2 完成汇总语义：归纳卡标题下量化收尾行（N 轮 · N 个工具调用） */
.ab-sc-done { margin-top: 4px; font-size: calc(11.5px * var(--ab-fs,1)); color: var(--text-muted); letter-spacing: .2px; }
/* P0-3 请求 ID 详情行：底部可一键复制（线性 info 图标 + 等宽 id + 复制暗示） */
.ab-msg-reqid { display: inline-flex; align-items: center; gap: 6px; margin-top: 6px; padding: 2px 8px 2px 6px;
  border-radius: calc(6px * var(--ab-radius,1)); font-size: calc(10.5px * var(--ab-fs,1)); color: var(--text-muted);
  cursor: pointer; user-select: none; transition: background .15s, color .15s, opacity .15s; }
.ab-msg-reqid:hover { background: color-mix(in srgb, var(--accent) 8%, transparent); color: var(--text-secondary); }
.ab-msg-reqid svg { width: 11px; height: 11px; flex: 0 0 auto; opacity: .8; }
.ab-reqid-v { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, 'Courier New', monospace; color: var(--text-secondary); }
.ab-reqid-cp { color: var(--accent); opacity: .55; transition: opacity .15s; }
.ab-msg-reqid:hover .ab-reqid-cp { opacity: 1; }
/* ===== /P0 2026-10-11 ===== */
.ab-ck-msg { margin-top: 9px; font-size:calc(12.5px * var(--ab-fs,1)); line-height: 1.6; color: var(--text-muted); min-height: 18px; word-break: break-all; }
.ab-ck-msg.ok { color: var(--accent); font-weight: 600; }
.ab-ck-msg.warn { color: #f59e0b; font-weight: 600; }
.ab-ck-msg.err { color: #ef4444; font-weight: 600; }

/* ===== P1（2026-10-11）对话排队链路 · 纯追加，不改存量 =====
   玩家（=客户）排队时：状态行走既有 .ab-status-strip，仅复用 .ab-ss-phase 位做排队文案，
   动作按钮挂新增 .ab-ss-qact 位；升级出口条 .ab-q-upgrade 挂在状态条内。
   全部字号走 calc(Npx * var(--ab-fs)) —— 全局字号唯一杠杆。图标一律线性描边（禁实心）。 */
.ab-ss-qact { display:inline-flex; align-items:center; gap:6px; margin-left:8px; }
.ab-ss-qact button { border:1px solid var(--line); background:#fff; color:#374151;
  border-radius:6px; padding:2px 10px; font-size:calc(12px * var(--ab-fs,0.94)); cursor:pointer; line-height:1.5; }
.ab-ss-qact button:hover { border-color:var(--accent); color:var(--accent); }
.ab-status-strip.ab-ss-queueing .ab-ss-phase { color:#b45309; font-weight:600; }
.ab-status-strip.ab-ss-qtimeout .ab-ss-phase { color:#b91c1c; font-weight:600; }
/* 超时态「重试」按钮：跟随红色超时主题（老板 2026-10-11 接入） */
.ab-ss-qtimeout .ab-ss-qact button { border-color:#fca5a5; color:#b91c1c; font-weight:600; }
.ab-ss-qtimeout .ab-ss-qact button:hover { background:#b91c1c; border-color:#b91c1c; color:#fff; }
.ab-q-upgrade { display:flex; align-items:center; gap:9px; margin-top:9px; padding:9px 12px;
  border:1px solid #bfdbfe; background:#eff6ff; border-radius:8px;
  font-size:calc(12.5px * var(--ab-fs,0.94)); color:#1e3a8a; line-height:1.5; }
.ab-q-upgrade .ab-qu-sico { width:15px; height:15px; flex:0 0 auto; color:#2563eb; }
.ab-q-upgrade .ab-qu-txt { flex:1; min-width:0; }
.ab-q-upgrade .ab-q-up { flex:0 0 auto; border:1px solid #bfdbfe; background:#fff; color:#2563eb;
  border-radius:6px; padding:3px 12px; font-weight:600; cursor:pointer;
  font-size:calc(12.5px * var(--ab-fs,0.94)); }
.ab-q-upgrade .ab-q-up:hover { background:#2563eb; color:#fff; }
/* 深色主题下的可读性兜底 */
body[data-theme="dark"] .ab-q-upgrade, .ab-dark .ab-q-upgrade { background:#172554; border-color:#1e40af; color:#bfdbfe; }
body[data-theme="dark"] .ab-status-strip.ab-ss-queueing .ab-ss-phase { color:#fbbf24; }

/* ===== N4（2026-10-11）回放渐进揭示 ===== */
/* 待揭示态：只动 opacity / transform —— **不影响布局**，
   故虚拟窗口测高（virtHeightOf）与滚动位置零影响，长会话窗口化不会错位。 */
.ab-msg-reveal { opacity: 0; transform: translateY(6px); transition: opacity .28s ease, transform .28s ease; }
.ab-msg-reveal.ab-msg-in { opacity: 1; transform: none; }
/* 「跳过回放」入口：揭示期间出现，点了立即全量刷出（尊重「我不想等」） */
.ab-reveal-skip {
  position: fixed; left: 50%; bottom: 96px; transform: translateX(-50%); z-index: 60;
  padding: 6px 14px; border-radius: 999px;
  border: 1px solid var(--border); background: var(--bg-primary); color: var(--text-muted);
  font-size: calc(12px * var(--ab-fs, 1)); line-height: 1.5; cursor: pointer;
  box-shadow: 0 2px 10px rgba(15,23,42,.10);
}
.ab-reveal-skip:hover { color: var(--text-primary); border-color: var(--accent); }
/* 无障碍：系统开启「减少动态效果」时直接全显，不做渐入 */
@media (prefers-reduced-motion: reduce) {
  .ab-msg-reveal { transition: none; opacity: 1; transform: none; }
}

/* [SECFIX-AB-PAID-GATE-20261013] 网页演示版未登录：付费模型行**保持可点击**（点击 → 弹登录窗）。
   2026-10-13 老板口径：整行不再重灰/禁选（原 .62 会把名称右侧 🔒 一起压暗、看不出来），
   只留「付费」标签 + 醒目 🔒；点击后由 abPaidModelDenied() 弹登录窗口，仍不切换模型。 */
.ab-model-item.ab-model-locked { opacity: .85; }
/* 名称右侧 🔒 图标：醒目可见（勿与行灰显叠加到看不清） */
.ab-model-lock { display: inline-flex; align-items: center; margin-left: 4px; vertical-align: middle; }
.ab-model-lock svg { width: 14px; height: 14px; }

/* GW.104b【2026-10-13 老板】模型列表右侧标签放大（列表高/宽充裕） */
.ab-model-side .ab-model-tag,
.ab-model-side .ab-model-paid,
.ab-model-side .ab-model-mul,
.ab-model-side .ab-model-promo,
.ab-model-side .ab-model-free,
.ab-model-side .ab-model-rate {
  font-size: calc(13px * var(--ab-fs,1));
  padding: 3px 7px;
  line-height: 1.4;
}

/* ===== 【C.061 · 2026-10-17 老板纠偏后的落点】子系统模型分配区（「设置 → 模型」页内） =====
   左列=子系统下拉；右列=四类模型（对话/图片/视频/音频）下拉；
   保存即写入模型总线并即时生效；已保存配置罗列在下方列表，可点选编辑、热载生效。
   （原挂在聊天输入框下方「模型」菜单内，2026-10-17 迁至设置页；此处不再需要菜单专用的外间距/上分隔线，
     由外层 .ab-set-group 的分组间距与分隔线承担。） */
.ab-subsys-alloc {
  margin-top: 0;
  padding: 0;
}
.ab-sa-head {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 8px; margin-bottom: 8px;
}
.ab-sa-title { font-size: calc(13px * var(--ab-fs,1)); font-weight: 600; color: var(--text-primary); }
.ab-sa-hint { font-size: calc(11px * var(--ab-fs,1)); color: var(--text-muted); white-space: nowrap; }
.ab-sa-form { display: flex; gap: 10px; align-items: flex-start; }
.ab-sa-col-l { flex: 0 0 38%; min-width: 0; display: flex; flex-direction: column; gap: 5px; }
.ab-sa-col-r { flex: 1 1 62%; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.ab-sa-lb { font-size: calc(11px * var(--ab-fs,1)); color: var(--text-muted); }
.ab-sa-subsys {
  width: 100%; padding: 6px 8px; font-size: calc(12.5px * var(--ab-fs,1));
  background: var(--bg-tertiary); border: 1px solid var(--border);
  border-radius: calc(7px * var(--ab-radius,1)); color: var(--text-primary);
  outline: none; font-family: inherit; cursor: pointer;
}
.ab-sa-subsys:focus { border-color: var(--accent); }
.ab-sa-row { display: flex; align-items: center; gap: 8px; }
.ab-sa-mod {
  flex: 0 0 34px; font-size: calc(12px * var(--ab-fs,1));
  color: var(--text-secondary); text-align: right;
}
.ab-sa-modsel {
  flex: 1 1 auto; min-width: 0; padding: 5px 7px; font-size: calc(12px * var(--ab-fs,1));
  background: var(--bg-tertiary); border: 1px solid var(--border);
  border-radius: calc(6px * var(--ab-radius,1)); color: var(--text-primary);
  outline: none; font-family: inherit; cursor: pointer;
}
.ab-sa-modsel:focus { border-color: var(--accent); }
.ab-sa-actions { display: flex; justify-content: flex-end; margin-top: 9px; }
.ab-sa-save {
  padding: 6px 16px; font-size: calc(12.5px * var(--ab-fs,1)); font-weight: 600;
  color: #fff; background: var(--accent); border: none;
  border-radius: calc(7px * var(--ab-radius,1)); cursor: pointer;
}
.ab-sa-save:hover { background: var(--accent-hover, var(--accent)); }
.ab-sa-list {
  margin-top: 10px; padding-top: 8px;
  border-top: 1px dashed var(--border);
  display: flex; flex-direction: column; gap: 5px;
}
.ab-sa-item {
  display: flex; align-items: center; gap: 8px; padding: 6px 8px;
  border: 1px solid var(--border); border-radius: calc(7px * var(--ab-radius,1));
  background: var(--bg-secondary); cursor: pointer;
}
.ab-sa-item:hover { border-color: var(--accent); }
.ab-sa-iname { flex: 0 0 auto; font-size: calc(12.5px * var(--ab-fs,1)); color: var(--text-primary); font-weight: 600; }
.ab-sa-ivals {
  flex: 1 1 auto; min-width: 0; font-size: calc(11.5px * var(--ab-fs,1));
  color: var(--text-secondary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.ab-sa-iedit { flex: 0 0 auto; font-size: calc(11.5px * var(--ab-fs,1)); color: var(--accent); }
.ab-sa-empty { font-size: calc(11.5px * var(--ab-fs,1)); color: var(--text-muted); line-height: 1.6; padding: 2px 0; }


/* ===== C.77 ①：回复正文「拍板体」小节块 =====
   模型按「✅结论 / 📊数据 / 🔧改动 / ⚠️问题 / ❌踩坑 / 🔴受限 / 🟡条件 / 🟢可执行 / ⚪参考 / 🎯待拍板」分节时，
   渲染成左侧语义色条 + 极淡底色的小节标题，与正文形成层次。
   色相只用来区分语义，不改变文字颜色（统一走 var(--text-primary)），浅色与深色主题都可读。 */
.ab-bubble-text > p.ab-sec,
.ab-art-pv-md .ab-sec {
  display: flex; align-items: baseline; gap: 7px;
  margin: 15px 0 7px; padding: 6px 12px;
  border-left: 3px solid color-mix(in srgb, var(--accent) 70%, transparent);
  border-radius: 0 calc(6px * var(--ab-radius, 1)) calc(6px * var(--ab-radius, 1)) 0;
  background: color-mix(in srgb, var(--accent) 5%, transparent);
  font-weight: 600; font-size: calc(14.5px * var(--ab-fs, 1));
  color: var(--text-primary); line-height: 1.55;
}
.ab-sec .ab-sec-e { flex: 0 0 auto; font-size: calc(13.5px * var(--ab-fs, 1)); line-height: 1.5; }
.ab-sec .ab-sec-t { flex: 1 1 auto; min-width: 0; word-break: break-word; }
.ab-bubble-text > p.ab-sec:first-child { margin-top: 0; }
/* 语义色：必须用 (0,3,1) 复合选择器，否则会被上面的基类 .ab-bubble-text > p.ab-sec (0,2,1) 压掉 —— 实测第一版 4 个小节块全长成同一个绿条 */
.ab-bubble-text > p.ab-sec.ab-sec-ok, .ab-art-pv-md p.ab-sec.ab-sec-ok { border-left-color: #16a34a; background: color-mix(in srgb, #16a34a 8%, transparent); }
.ab-bubble-text > p.ab-sec.ab-sec-data, .ab-art-pv-md p.ab-sec.ab-sec-data { border-left-color: #2563eb; background: color-mix(in srgb, #2563eb 8%, transparent); }
.ab-bubble-text > p.ab-sec.ab-sec-fix, .ab-art-pv-md p.ab-sec.ab-sec-fix { border-left-color: #0d9488; background: color-mix(in srgb, #0d9488 8%, transparent); }
.ab-bubble-text > p.ab-sec.ab-sec-warn, .ab-art-pv-md p.ab-sec.ab-sec-warn { border-left-color: #d97706; background: color-mix(in srgb, #d97706 9%, transparent); }
.ab-bubble-text > p.ab-sec.ab-sec-err, .ab-art-pv-md p.ab-sec.ab-sec-err { border-left-color: #dc2626; background: color-mix(in srgb, #dc2626 9%, transparent); }
.ab-bubble-text > p.ab-sec.ab-sec-limit, .ab-art-pv-md p.ab-sec.ab-sec-limit { border-left-color: #dc2626; background: color-mix(in srgb, #dc2626 6%, transparent); }
.ab-bubble-text > p.ab-sec.ab-sec-cond, .ab-art-pv-md p.ab-sec.ab-sec-cond { border-left-color: #ca8a04; background: color-mix(in srgb, #ca8a04 8%, transparent); }
.ab-bubble-text > p.ab-sec.ab-sec-go, .ab-art-pv-md p.ab-sec.ab-sec-go { border-left-color: #16a34a; background: color-mix(in srgb, #16a34a 6%, transparent); }
.ab-bubble-text > p.ab-sec.ab-sec-ref, .ab-art-pv-md p.ab-sec.ab-sec-ref { border-left-color: var(--text-muted); background: color-mix(in srgb, var(--text-muted) 7%, transparent); }
.ab-bubble-text > p.ab-sec.ab-sec-decide, .ab-art-pv-md p.ab-sec.ab-sec-decide { border-left-color: #7c3aed; background: color-mix(in srgb, #7c3aed 8%, transparent); }
/* 其余语义（提示/备注/排查/交付/上线/配置/安全/文件/链接）沿用主题色，只做淡底 */
.ab-bubble-text > p.ab-sec.ab-sec-tip, .ab-bubble-text > p.ab-sec.ab-sec-note, .ab-bubble-text > p.ab-sec.ab-sec-find, .ab-bubble-text > p.ab-sec.ab-sec-pkg, .ab-bubble-text > p.ab-sec.ab-sec-ship, .ab-bubble-text > p.ab-sec.ab-sec-cfg, .ab-bubble-text > p.ab-sec.ab-sec-lock, .ab-bubble-text > p.ab-sec.ab-sec-doc, .ab-bubble-text > p.ab-sec.ab-sec-link { border-left-color: color-mix(in srgb, var(--accent) 70%, transparent); background: color-mix(in srgb, var(--accent) 5%, transparent); }

/* ===== C.77 ②：图片 / 视频产物在聊天页直接出缩略图 =====
   文档类仍是 44px 单行产物行；图片/视频进这条缩略图带：方形缩略图 + 文件名 + 悬停出 ↗/☁。
   仍带 .ab-artifact-item 类 ⇒ 计数 / 类型筛选 / 批量选择 / 右键菜单 全部照旧生效。 */
.ab-msg-artifacts .ab-art-thumbs {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px;
  margin: 2px 0 9px;
}
@media (max-width: 560px) {
  .ab-msg-artifacts .ab-art-thumbs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.ab-msg-artifacts .ab-artifact-item.ab-art-thumb {
  display: block !important;
  position: relative;
  height: auto !important;
  padding: 0 !important;
  overflow: hidden;
  border-radius: calc(9px * var(--ab-radius, 1)) !important;
  background: rgba(127, 127, 127, .10) !important;
  cursor: zoom-in;
}
.ab-msg-artifacts .ab-artifact-item.ab-art-thumb:hover { background: rgba(127, 127, 127, .16) !important; }
.ab-msg-artifacts .ab-artifact-item.ab-art-thumb.is-hidden { display: none !important; }
.ab-art-thumb-box { display: block; position: relative; width: 100%; aspect-ratio: 1 / 1; overflow: hidden; }
/* C.215：远端沙箱图片取不到字节 ⇒ 占位框（虚线 + 说明），绝不给碎图 */
.ab-art-thumb-box.ab-art-thumb-miss {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
  background: rgba(127, 127, 127, .08);
  border: 1px dashed color-mix(in srgb, var(--text-muted) 45%, transparent);
  border-radius: calc(7px * var(--ab-radius, 1));
}
.ab-art-thumb-miss-ic { font-size: calc(18px * var(--ab-fs, 1)); color: var(--text-muted); line-height: 1; }
.ab-art-thumb-miss-t { font-size: calc(10.5px * var(--ab-fs, 1)); color: var(--text-muted); }
.ab-art-thumb-i, .ab-art-thumb-v {
  display: block; width: 100%; height: 100%; object-fit: cover;
  transition: transform .18s ease;
}
.ab-msg-artifacts .ab-artifact-item.ab-art-thumb:hover .ab-art-thumb-i,
.ab-msg-artifacts .ab-artifact-item.ab-art-thumb:hover .ab-art-thumb-v { transform: scale(1.05); }
.ab-art-thumb-play {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: calc(32px * var(--ab-fs, 1)); height: calc(32px * var(--ab-fs, 1));
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%; background: rgba(0, 0, 0, .46); color: #fff;
  font-size: calc(11px * var(--ab-fs, 1)); pointer-events: none;
}
.ab-art-thumb-name {
  display: block; padding: 0 6px;
  height: calc(22px * var(--ab-fs, 1)); line-height: calc(22px * var(--ab-fs, 1));
  font-size: calc(11px * var(--ab-fs, 1)); color: var(--text-secondary);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  background: rgba(127, 127, 127, .07);
}
.ab-art-thumb-act {
  position: absolute; right: 4px; top: 4px; display: inline-flex; gap: 3px;
  /* C.94：原来 opacity:0（不悬停完全看不见）⇒ 客户找不到下载图标；改为常显，悬停再提亮 */
  opacity: .92; transition: opacity .15s ease;
}
.ab-msg-artifacts .ab-artifact-item.ab-art-thumb:hover .ab-art-thumb-act { opacity: 1; }
.ab-art-thumb-act .ab-artifact-open,
.ab-art-thumb-act .ab-artifact-cloud,
.ab-art-thumb-act .ab-artifact-dl {
  display: inline-flex; align-items: center; justify-content: center;
  width: calc(20px * var(--ab-fs, 1)); height: calc(20px * var(--ab-fs, 1));
  border-radius: calc(5px * var(--ab-radius, 1));
  background: rgba(0, 0, 0, .50); color: #fff;
  font-size: calc(11.5px * var(--ab-fs, 1)); font-weight: 400;
}

/* ===== C.77 ③：聊天页大图浮层 =====
   点缩略图 ⇒ 就地看大图，不用先弹右侧产物面板；Esc / 点图 / 点背景关闭。 */
.ab-img-lb {
  position: fixed; inset: 0; z-index: 10000;
  background: rgba(8, 10, 14, .84);
  display: flex; flex-direction: column;
}
.ab-img-lb-bar {
  flex: 0 0 auto; display: flex; align-items: center; gap: 9px;
  padding: 9px 15px; color: #e8ecf3; background: rgba(0, 0, 0, .34);
}
.ab-img-lb-name {
  flex: 1 1 auto; min-width: 0; font-size: calc(13px * var(--ab-fs, 1));
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.ab-img-lb-btn {
  flex: 0 0 auto; border: 1px solid rgba(255, 255, 255, .26);
  background: rgba(255, 255, 255, .10); color: #e8ecf3;
  border-radius: calc(6px * var(--ab-radius, 1)); padding: 4px 11px;
  cursor: pointer; font-size: calc(12.5px * var(--ab-fs, 1));
  text-decoration: none; line-height: 1.5; font-family: inherit;
}
.ab-img-lb-btn:hover { background: rgba(255, 255, 255, .20); }
.ab-img-lb-body {
  flex: 1 1 auto; display: flex; align-items: center; justify-content: center;
  padding: 12px; overflow: auto; min-height: 0;
}
.ab-img-lb-media {
  max-width: 94vw; max-height: calc(100vh - 118px);
  border-radius: calc(8px * var(--ab-radius, 1));
  box-shadow: 0 18px 60px rgba(0, 0, 0, .55);
  background: #0b0d12;
}
/* GW.218A：灯箱里的语音播放器（点气泡下载条不会进灯箱，此规则给将来可能的入口兜底） */
.ab-img-lb-media.ab-bubble-audio {
  width: min(560px, 94vw);
  height: calc(48px * var(--ab-fs, 1));
  background: #14171f;
}
/* C.215：远端图片取不到时的说明面板（不假装有图，讲清原因与出路） */
.ab-img-lb-miss {
  max-width: min(560px, 90vw); padding: 20px 22px; color: #e8ecf3;
  background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .16);
  border-radius: calc(10px * var(--ab-radius, 1));
}
.ab-img-lb-miss-t { font-size: calc(14px * var(--ab-fs, 1)); font-weight: 600; margin-bottom: 8px; }
.ab-img-lb-miss-p {
  font-family: ui-monospace, Menlo, Consolas, monospace; font-size: calc(12px * var(--ab-fs, 1));
  color: #a9d4ff; word-break: break-all; margin-bottom: 10px;
}
.ab-img-lb-miss-h { font-size: calc(12.5px * var(--ab-fs, 1)); color: #b9c2d0; line-height: 1.6; }

/* ==================== C.107 视觉块（聊天回复结构化排版 · 档一 · 皮肤返工版） ====================
   老板 2026-10-20 21:2x 四条返工令，逐条对应下面四个小节：
     ① 每一组视觉块要有「版块」的总细线外框 —— 见 §A 版块外框；
     ② 标题保持较粗、内容一律改细字，字号分层次，关键与重点必须高亮 —— 见 §B 排版层级 + §C 高亮；
     ③ 小卡片的立体支撑落在「左侧 + 顶侧」，不许全堆左侧 —— 见 §D 左上 L 形支撑；
     ④ 整套按参考那种工整、耐读的路子来 —— §A~§D 统一同一套语言。
   颜色一律吃主题变量（5 套主题自动跟随），禁写死色值。
   color-mix 前面都留了纯变量兜底声明，老内核不会崩成透明。 */

/* ---------- §A 版块外框：一组视觉块 = 一个完整版块 ---------- */
.ab-vb {
  /* 排版层级：4 级字号 / 3 级字重（老板第 2 条「字号不要一刀切、字体不要都那么粗」） */
  --vb-fs-xl: calc(25px   * var(--ab-fs, 1));   /* 指标数字 */
  --vb-fs-lg: calc(14px   * var(--ab-fs, 1));   /* 卡片名 / 版块内标题（较粗） */
  --vb-fs-md: calc(13.4px * var(--ab-fs, 1));   /* 正文（细）·基数已补 --ab-fs 0.94 的亏空 */
  --vb-fs-sm: calc(12.2px * var(--ab-fs, 1));   /* 单位 / 辅助标签（细）·同上 */
  --vb-w-thin: 300;                             /* 正文细字 */
  --vb-w-mid: 500;
  --vb-w-bold: 600;                             /* 只给标题和数字 */
  --vb-tone: var(--accent);

  position: relative;
  margin: 15px 0 17px;
  padding: 10px 14px 14px;
  /* 底色与渐变分开写：底色留实色（暗色主题/对比度测量都要它），渐变只叠一层淡头 */
  background-color: var(--card-bg, var(--bg-secondary));
  background-image: linear-gradient(180deg,
      color-mix(in srgb, var(--vb-tone) 6%, transparent) 0%,
      transparent 46%);
  border: 1px solid var(--border);
  border-radius: 14px;
  /* 🔴 返工二：禁用负偏移 box-shadow —— 负偏移会在左上角同时向两边外露，
     两道光叠成一个三角块（老板原话「左侧阴影和顶侧阴影不要重叠」）。
     改为 ::before 画两条独立方向光：顶条只管顶边、左条只管左边，
     且都从「圆角半径之外」才起笔 ⇒ 两段矩形在几何上不相交，绝无重叠。 */
  box-shadow: none;
  --vb-go: 4px;      /* 光条离边框外扩距离 */
  --vb-strip: 5px;   /* 光条厚度 */
  --vb-cut: 18px;    /* 拐角留空（≥ 圆角半径，这才是「不重叠」的关键）*/
  --vb-glow: color-mix(in srgb, var(--vb-tone) 16%, transparent);
  font-family: "Segoe UI Variable Text", "Segoe UI", "Microsoft YaHei Light",
               "Microsoft YaHei", "PingFang SC", system-ui, sans-serif;
  font-weight: var(--vb-w-thin);
  color: var(--text-secondary);
  /* 版块内文字统一细字，标题位单独加粗 —— 见下方各 *-n */
}

/* 四类版块各给一个渐变方向性微差，避免四组看起来一模一样 */
.ab-vb-cards  { --vb-tone: var(--accent); }
.ab-vb-metrics{ --vb-tone: var(--accent); }
.ab-vb-flow   { --vb-tone: color-mix(in srgb, var(--accent) 82%, var(--text-primary)); }
.ab-vb-grade  { --vb-tone: var(--accent); }

.ab-vb-body { padding-top: 22px; }   /* 给右上角三点/快捷条让位，不压第一行卡片顶边 */

/* ---------- 右上角工具条（沿用 C.107 已验证的防误触结构，只调位置） ---------- */
.ab-vb-dots {
  position: absolute; top: 6px; right: 8px;
  width: 26px; height: 22px; padding: 0;
  display: flex; align-items: center; justify-content: center;
  font: 700 15px/1 -apple-system, "Segoe UI", sans-serif;
  letter-spacing: 1px;
  color: var(--text-muted);
  background: transparent; border: 1px solid transparent; border-radius: 7px;
  cursor: pointer; opacity: .38;
  transition: opacity .15s, background .15s, border-color .15s, color .15s;
  z-index: 3;
}
.ab-vb-dots:hover { opacity: 1; color: var(--text-primary); background: var(--bg-tertiary); border-color: var(--border); }
/* 🔴 三点不随 hover 消失：hover 只让快捷条浮出，三点永远是最后兜底入口
   （第一版让三点 hover 淡出 ⇒ 点"更多"被快捷条拦截、误触"下载到本地"，真机抓到后拆开） */
.ab-vb:hover .ab-vb-dots { opacity: .9; }

.ab-vb-quick {
  position: absolute; top: 5px; right: 37px;   /* 右侧让出 37px 给常驻三点，两者不重叠 */
  display: flex; align-items: center; gap: 2px;
  padding: 2px 3px;
  background: var(--card-bg, var(--bg-secondary));
  border: 1px solid var(--border);
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .07);
  opacity: 0; pointer-events: none; transform: translateY(-3px);
  transition: opacity .16s ease, transform .16s ease;
  z-index: 4;
}
.ab-vb:hover .ab-vb-quick,
.ab-vb:focus-within .ab-vb-quick { opacity: 1; pointer-events: auto; transform: translateY(0); }
.ab-vb-qb {
  padding: 3px 9px; border: 0; border-radius: 6px;
  font-size: 11.5px; line-height: 1.5; font-weight: var(--vb-w-thin); color: var(--text-secondary);
  background: transparent; cursor: pointer; white-space: nowrap;
  transition: background .14s, color .14s;
}
.ab-vb-qb:hover { background: var(--bg-tertiary); color: var(--text-primary); }

/* ---------- 展开菜单（单例，挂在 body 上） ---------- */
.ab-vb-menu {
  position: fixed; z-index: 9999; min-width: 158px;
  display: flex; flex-direction: column;
  padding: 5px;
  background: var(--card-bg, var(--bg-secondary));
  border: 1px solid var(--border);
  border-radius: 10px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, .12), 0 1px 4px rgba(0, 0, 0, .06);
}
.ab-vb-menu[hidden] { display: none; }
.ab-vb-menu button {
  display: block; width: 100%; text-align: left;
  padding: 7px 11px; border: 0; border-radius: 7px;
  font-size: 12.5px; line-height: 1.5; font-weight: var(--vb-w-thin); color: var(--text-secondary);
  background: transparent; cursor: pointer;
  transition: background .14s, color .14s;
}
.ab-vb-menu button:hover { background: var(--accent-light, var(--bg-tertiary)); color: var(--text-primary); }
.ab-vb-sep { height: 1px; margin: 4px 6px; background: var(--border); }

/* ---------- §C 高亮三件套：关键与重点必须跳出来（老板第 2 条） ---------- */
.ab-vb-mark {              /* ① 引号内的原话/结论：淡底块 */
  padding: 0 3px; border-radius: 3px;
  background: color-mix(in srgb, var(--vb-tone) 15%, transparent);
  color: var(--text-primary);
  font-weight: var(--vb-w-mid);
}
.ab-vb-em {                /* ② 数字 + 单位：强调色 + 等宽数字 */
  color: var(--vb-tone);
  font-weight: var(--vb-w-mid);
  font-variant-numeric: tabular-nums;
  letter-spacing: -.1px;
}
.ab-vb-kw {                /* ③ 判断类关键词：加粗 + 强调色 */
  color: var(--vb-tone);
  font-weight: var(--vb-w-bold);
}
/* 浅色系主题（浅色 / 护眼暖灰）里把高亮词再压深一档：
   纯 accent 压在白底只有 3.3:1，偏淡、不够「跳」；压深后到 ~4.9:1，既醒目又不刺眼。
   深色系（默认商务绿 / 暗夜蓝）保持原 accent —— 深底上压深反而糊。 */
:root.ab-light .ab-vb-em, :root.ab-light .ab-vb-kw,
:root.ab-theme-warm .ab-vb-em, :root.ab-theme-warm .ab-vb-kw {
  color: color-mix(in srgb, var(--accent) 76%, #10261a);
}


/* ---------- §D-2 两条方向光（返工二 · 几何上不相交） ----------
   顶条：x ∈ [cut, 100%-cut]，y ∈ [0, strip]
   左条：x ∈ [0, strip]，y ∈ [cut, 100%-cut]
   因为 cut > strip，两条矩形既不同行也不同列 ⇒ 左上角天然留空，不可能重叠。
   （旧做法的 box-shadow 负偏移会把同一条阴影同时漏到左边和顶边，拐角必叠。） */
.ab-vb::before,
.ab-vb-card::before,
.ab-vb-metric::before,
.ab-vb-grow::before {
  content: "";
  position: absolute;
  /* 只向上、向左外扩：右下不动 ⇒ 不会把 scrollWidth 撑大（也不会引出横向滚动条） */
  top: calc(var(--vb-go, 3px) * -1);
  left: calc(var(--vb-go, 3px) * -1);
  right: 0;
  bottom: 0;
  border-radius: inherit;
  pointer-events: none;
  z-index: 0;
  background-repeat: no-repeat;
  background-image:
    linear-gradient(to top,  var(--vb-glow), transparent 90%),
    linear-gradient(to left, var(--vb-glow), transparent 90%);
  background-size:
    calc(100% - var(--vb-cut, 14px) * 2) var(--vb-strip, 4px),
    var(--vb-strip, 4px) calc(100% - var(--vb-cut, 14px) * 2);
  /* 起点减掉 go，让光条相对元素边框起算，cut 依然是「离边框拐角的距离」 */
  background-position:
    calc(var(--vb-cut, 14px) - var(--vb-go, 3px)) 0,
    0 calc(var(--vb-cut, 14px) - var(--vb-go, 3px));
}

/* ---------- §D 左上 L 形支撑：小卡片/指标/分级行统一「顶边 + 左边」双线 ---------- */
/* 组件变量：--vb-line（细线色）、--vb-rail（支撑色）、--vb-glow（左上柔光） */
.ab-vb { --vb-line: var(--border); }

/* ---- 类型①对比卡组 ---- */
.ab-vb-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.ab-vb-card {
  position: relative;
  padding: 12px 13px 13px;
  background: var(--bg-tertiary);
  border: 1px solid var(--vb-line);
  border-top: 2px solid color-mix(in srgb, var(--text-muted) 46%, var(--vb-line));
  border-left: 2px solid color-mix(in srgb, var(--text-muted) 46%, var(--vb-line));
  border-radius: 4px 10px 10px 10px;   /* 左上收角更紧，视觉上「由左上撑起」 */
  /* 返工二：不再用 box-shadow（会左上重叠），改两条不相交方向光 */
  box-shadow: none;
  --vb-go: 3px; --vb-strip: 4px; --vb-cut: 13px;
  --vb-glow: color-mix(in srgb, var(--text-muted) 26%, transparent);
}
.ab-vb-card.is-pick {
  border-color: color-mix(in srgb, var(--vb-tone) 28%, var(--vb-line));
  border-top-color: var(--vb-tone);
  border-left-color: var(--vb-tone);
  background-color: var(--bg-tertiary);
  background-image: linear-gradient(180deg,
      color-mix(in srgb, var(--vb-tone) 13%, transparent) 0%,
      transparent 64%);
  --vb-glow: color-mix(in srgb, var(--vb-tone) 30%, transparent);
}
.ab-vb-pick {
  position: absolute; top: 9px; right: 10px;
  padding: 0 7px;
  font-size: 10px; line-height: 16px; font-weight: var(--vb-w-mid);
  color: var(--vb-tone);
  background: color-mix(in srgb, var(--vb-tone) 15%, transparent);
  border-radius: 20px;
}
.ab-vb-card-n {
  font-size: var(--vb-fs-lg); font-weight: var(--vb-w-bold); line-height: 1.5;
  color: var(--text-primary);
  letter-spacing: .1px;
  margin-bottom: 6px; padding-right: 46px;
  word-break: break-word;
}
.ab-vb-card-d {
  font-size: var(--vb-fs-md); font-weight: var(--vb-w-thin); line-height: 1.78;
  color: var(--text-secondary);
  word-break: break-word;
}

/* ---- 类型②指标条 ---- */
.ab-vb-metrics { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 10px; }
.ab-vb-metric {
  padding: 13px 13px 12px;
  background-color: var(--bg-tertiary);
  background-image: linear-gradient(180deg,
      color-mix(in srgb, var(--vb-tone) 11%, transparent) 0%,
      transparent 66%);
  border: 1px solid var(--vb-line);
  border-top: 2px solid var(--vb-tone);
  border-left: 2px solid var(--vb-tone);
  border-radius: 4px 10px 10px 10px;
  position: relative;                 /* ::before 定位锚点（原来漏了，伪元素会跑飞） */
  box-shadow: none;
  --vb-go: 3px; --vb-strip: 4px; --vb-cut: 13px;
  --vb-glow: color-mix(in srgb, var(--vb-tone) 22%, transparent);
}
.ab-vb-metric-v {
  font-size: var(--vb-fs-xl); font-weight: var(--vb-w-bold); line-height: 1.1;
  color: var(--vb-tone);                     /* 数字本身即重点，直接染强调色 */
  letter-spacing: -1px;
  font-variant-numeric: tabular-nums;
  word-break: break-all;
}
.ab-vb-metric-u {
  margin-left: 3px;
  font-size: var(--vb-fs-sm); font-weight: var(--vb-w-thin);
  color: var(--text-muted);
  letter-spacing: 0;
}
.ab-vb-metric-l {
  margin-top: 6px;
  font-size: var(--vb-fs-sm); font-weight: var(--vb-w-thin); line-height: 1.55;
  color: var(--text-muted);
}

/* ---- 类型③流程链 ---- */
.ab-vb-flow { display: flex; align-items: flex-start; }
.ab-vb-step { display: flex; gap: 8px; flex: 1 1 0; min-width: 0; }
.ab-vb-step-n {
  flex: 0 0 auto;
  width: 24px; height: 24px;
  display: flex; align-items: center; justify-content: center;
  font-size: 11.5px; font-weight: var(--vb-w-bold); line-height: 1;
  color: var(--vb-tone);
  background: color-mix(in srgb, var(--vb-tone) 12%, transparent);
  border-top: 1px solid var(--vb-tone);
  border-left: 1px solid var(--vb-tone);
  border-right: 1px solid color-mix(in srgb, var(--vb-tone) 45%, transparent);
  border-bottom: 1px solid color-mix(in srgb, var(--vb-tone) 45%, transparent);
  border-radius: 50%;
  box-shadow: 0 0 5px color-mix(in srgb, var(--vb-tone) 18%, transparent);
}
.ab-vb-step-t {
  flex: 1 1 auto; min-width: 0;
  padding-top: 1px;
  font-size: var(--vb-fs-md); font-weight: var(--vb-w-thin); line-height: 1.68;
  color: var(--text-secondary);
  word-break: break-word;
}
.ab-vb-flow-ar {
  flex: 0 0 auto; position: relative;
  width: 17px; height: 1.5px; margin: 12px 4px 0;
  background: color-mix(in srgb, var(--border) 80%, var(--text-muted));
}
.ab-vb-flow-ar::after {
  content: ""; position: absolute; right: 0; top: -3px;
  width: 7px; height: 7px;
  border-top: 1.5px solid color-mix(in srgb, var(--border) 80%, var(--text-muted));
  border-right: 1.5px solid color-mix(in srgb, var(--border) 80%, var(--text-muted));
  transform: rotate(45deg);
}

/* ---- 类型④分级清单 ---- */
.ab-vb-grade { display: flex; flex-direction: column; gap: 8px; }
.ab-vb-grow {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 9px 13px 9px 12px;
  background: var(--bg-tertiary);
  border: 1px solid var(--vb-line);
  border-top: 2px solid var(--text-muted);
  border-left: 2px solid var(--text-muted);
  border-radius: 4px 9px 9px 9px;
  position: relative;
  box-shadow: none;
  --vb-go: 3px; --vb-strip: 4px; --vb-cut: 12px;
  --vb-glow: color-mix(in srgb, var(--text-muted) 22%, transparent);
  font-size: var(--vb-fs-md); font-weight: var(--vb-w-thin); line-height: 1.66;
  color: var(--text-secondary);
}
.ab-vb-gdot {
  flex: 0 0 auto; width: 3px; height: 15px; margin-top: 3px; border-radius: 2px;
  background: var(--text-muted);
}
.ab-vb-gtext { flex: 1 1 auto; min-width: 0; word-break: break-word; }
/* 语义色同时上「顶边 + 左边」两条，不再是单边死板色条 */
.ab-vb-g-limit { border-top-color: var(--error);   border-left-color: var(--error);   --vb-glow: color-mix(in srgb, var(--error) 26%, transparent); }
.ab-vb-g-cond  { border-top-color: var(--warn);    border-left-color: var(--warn);    --vb-glow: color-mix(in srgb, var(--warn) 26%, transparent); }
.ab-vb-g-go    { border-top-color: var(--success); border-left-color: var(--success); --vb-glow: color-mix(in srgb, var(--success) 26%, transparent); }
.ab-vb-g-limit .ab-vb-gdot { background: var(--error); }
.ab-vb-g-cond  .ab-vb-gdot { background: var(--warn); }
.ab-vb-g-go    .ab-vb-gdot { background: var(--success); }
.ab-vb-g-ref   .ab-vb-gdot { background: var(--text-muted); }
/* 分级行里的关键词跟随语义色，红行就红着高亮，不串色 */
.ab-vb-g-limit .ab-vb-kw { color: var(--error); }
.ab-vb-g-cond  .ab-vb-kw { color: var(--warn); }
.ab-vb-g-go    .ab-vb-kw { color: var(--success); }

/* ---- 窄屏：卡片单列、指标条两列、流程链竖排（箭头转竖向） ---- */
@media (max-width: 620px) {
  .ab-vb { padding: 9px 11px 12px; border-radius: 12px; }
  .ab-vb-grid { grid-template-columns: minmax(0, 1fr); }
  .ab-vb-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ab-vb-flow { flex-direction: column; gap: 8px; }
  .ab-vb-step { flex: 1 1 auto; width: 100%; }
  .ab-vb-flow-ar { width: 1.5px; height: 12px; margin: 0 0 0 12px; }
  .ab-vb-flow-ar::after {
    right: auto; left: -3px; top: auto; bottom: 0;
    transform: rotate(135deg);
  }
}

/* ---- 触屏：没有 hover，快捷条不浮出，只用常驻三点 ---- */
@media (hover: none) {
  .ab-vb-quick { display: none; }
  .ab-vb-dots { opacity: .6; }
}

/* ---- 导出/打印：工具条不入镜 ---- */
@media print {
  .ab-vb-dots, .ab-vb-quick, .ab-vb-menu { display: none !important; }
}

/* ---- 减少动效偏好 ---- */
@media (prefers-reduced-motion: reduce) {
  .ab-vb-quick, .ab-vb-dots, .ab-vb-qb, .ab-vb-menu button { transition: none; }
}

/* ============ [C.108] 子系统 / 接管中心：取消内层限高，整页展开 ============
   根因：.ab-root / .ab-main 均 height:100vh，视图锁死视口高度，内层 #subsGrid 自己滚。
   做法：仅在「子系统」视图可见时把 .ab-main 变成滚动容器，并让 #subsGrid / #agentHub
        取消 flex 撑满与内层滚动，自然展开。
   :has() 限定范围 ⇒ 其它视图零影响；不支持 :has 的浏览器自动退回原行为。 */
.ab-root:has(#view-subs:not(.hidden)) .ab-main { overflow-y: auto; }
.ab-root:has(#view-subs:not(.hidden)) #view-subs { flex: 0 0 auto; }
.ab-root:has(#view-subs:not(.hidden)) #subsGrid { flex: 0 0 auto; overflow: visible; }
.ab-root:has(#view-subs:not(.hidden)) #agentHub { flex: 0 0 auto; }
.ab-root:has(#view-subs:not(.hidden)) #agentHub .ab-agent-list { flex: 0 0 auto; overflow: visible; }


/* ===== [C.109] 卡片图标图片化（只覆盖「卡片图标位」；导航/Tab/按钮/状态符号仍线性 SVG） ===== */
/* 图片本体已压进纯白圆角底板 => 5 套主题下都稳 */
.ab-ic-img{display:block;width:100%;height:100%;object-fit:contain;border-radius:inherit}
/* 助理卡片：26px 白底小卡 */
.ab-sub-ico{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;flex:0 0 auto;border-radius:8px;overflow:hidden;vertical-align:middle}
/* 同事卡片：沿用 34px 容器，有图时底色转白、加细边 */
.ab-team-av:has(.ab-ic-img){background:#fff;border:1px solid var(--border);overflow:hidden}
.ab-team-av:has(.ab-ic-img) .ab-ic-img{border-radius:9px}

/* ===== [C.110] 卡片标准排版：全屏 5 列 / 非全屏 3 列 · 图标 48px · 文字自适应 ===== */
/* 栅格：≥1600 五列｜900–1599 三列｜<900 两列（移动端保护） */
/* 弹窗内同事网格 .ab-team-dlg .ab-team-grid 特异性更高，不受影响 */
@media (min-width:1600px){
  .ab-subs-grid,.ab-team-grid,.ab-tpl-pack-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
}
@media (min-width:900px) and (max-width:1599px){
  .ab-subs-grid,.ab-team-grid,.ab-tpl-pack-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:899px){
  .ab-subs-grid,.ab-team-grid,.ab-tpl-pack-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
/* 图标 48×48（对齐 WorkBuddy 口径）；无图卡片的线性 SVG 内绘 28 */
.ab-sub-ico{width:48px;height:48px;border-radius:12px}
.ab-sub-ico svg{width:28px;height:28px}
/* 卡片内边距与节奏 */
.ab-sub-card{padding:16px;gap:10px}
.ab-sub-top{gap:10px}
/* 文字自适应：camp 随视口，--ab-fs 字号档位仍生效 */
.ab-sub-name{font-size:calc(14.5px * var(--ab-fs,1));line-height:1.35;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ab-sub-desc{font-size:calc(12.5px * var(--ab-fs,1));line-height:1.6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ab-assist-meta{font-size:calc(12px * var(--ab-fs,1))}
.ab-sub-badge{font-size:calc(11.5px * var(--ab-fs,1))}
/* 同事卡：头像 48 + 姓名字号自适应 */
.ab-team-av{width:48px;height:48px;border-radius:13px}
.ab-team-av svg{width:28px;height:28px}
.ab-team-hd{gap:10px}
.ab-team-who b{font-size:calc(14.5px * var(--ab-fs,1))}
.ab-team-who i{font-size:calc(12px * var(--ab-fs,1))}
/* 行业模板库卡 */
.ab-tpl-pack-card{padding:16px}
.ab-tpl-pack-hd{font-size:calc(14.5px * var(--ab-fs,1))}
.ab-tpl-pack-desc{font-size:calc(12.5px * var(--ab-fs,1));display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ab-func-add-name{font-size:calc(14.5px * var(--ab-fs,1))}

/* [C.110b] 全屏（五列）字号上浮一档 */
@media (min-width:1600px){
  .ab-sub-name,.ab-func-add-name,.ab-tpl-pack-hd{font-size:calc(15.5px * var(--ab-fs,1))}
  .ab-sub-desc,.ab-tpl-pack-desc{font-size:calc(13px * var(--ab-fs,1))}
  .ab-assist-meta{font-size:calc(12.8px * var(--ab-fs,1))}
  .ab-sub-badge{font-size:calc(12px * var(--ab-fs,1))}
}

/* ===== [C.111] 图标改浓色实底 + 白剪影 + 100% 撑满 ===== */
/* 图标自带浓绿底 ⇒ 卸掉容器白底与描边，否则叠出两道白框 */
.ab-team-av:has(.ab-ic-img){background:transparent;border:0}
.ab-sub-ico:has(.ab-ic-img),.ab-team-av:has(.ab-ic-img){overflow:hidden}
/* 图片圆角与容器同径：48px 容器 → 12px 圆角 */
.ab-sub-ico .ab-ic-img,.ab-team-av .ab-ic-img{border-radius:12px}

/* ==================== C.130 P0 可视化块：回复内嵌图表（纯内联 SVG） ==================== */
.ab-viz{margin:12px 0 16px;border:1px solid var(--border-3,rgba(128,128,128,.22));border-radius:12px;
  background:var(--inner-bg,rgba(127,127,127,.05));overflow:hidden;position:relative}
.ab-viz-hd{padding:11px 44px 2px 14px;font-size:13.5px;font-weight:600;color:var(--text-primary,#1f2937);line-height:1.5}
.ab-viz-body{padding:4px 8px 0}
.ab-viz-svg{display:block;width:100%;height:auto;max-height:340px}
.ab-viz-axis{stroke:var(--border-3,rgba(128,128,128,.4));stroke-width:1}
.ab-viz-grid{stroke:var(--border-3,rgba(128,128,128,.2));stroke-width:1;stroke-dasharray:3 4}
.ab-viz-bar{fill:var(--accent,#16a34a);opacity:.88;transition:opacity .15s ease}
.ab-viz-bar:hover{opacity:1}
.ab-viz-line{fill:none;stroke:var(--accent,#16a34a);stroke-width:2.4;stroke-linejoin:round;stroke-linecap:round}
.ab-viz-area{fill:url(#abVizLg)}
.ab-viz-g0{stop-color:var(--accent,#16a34a);stop-opacity:.34}
.ab-viz-g1{stop-color:var(--accent,#16a34a);stop-opacity:0}
.ab-viz-dot{fill:var(--card-bg,#fff);stroke:var(--accent,#16a34a);stroke-width:2.4}
.ab-viz-xlab{fill:var(--text-muted,#94a3b8);font-size:12px}
.ab-viz-val{fill:var(--text-primary,#334155);font-size:12.5px;font-weight:600}
.ab-viz-ctr{fill:var(--text-primary,#1f2937);font-size:22px;font-weight:700}
.ab-viz-csub{fill:var(--text-muted,#94a3b8);font-size:11.5px}
/* 饼图色板：--viz-c 同时驱动扇形 fill 与图例色块 */
.ab-viz-c0{--viz-c:#16a34a}.ab-viz-c1{--viz-c:#3b82f6}.ab-viz-c2{--viz-c:#f59e0b}.ab-viz-c3{--viz-c:#ef4444}
.ab-viz-c4{--viz-c:#8b5cf6}.ab-viz-c5{--viz-c:#14b8a6}.ab-viz-c6{--viz-c:#f472b6}.ab-viz-c7{--viz-c:#64748b}
.ab-viz-slice{fill:var(--viz-c,#94a3b8);stroke:var(--card-bg,#fff);stroke-width:1.5;transition:opacity .15s ease}
.ab-viz-slice:hover{opacity:.85}
.ab-viz-lg{display:flex;flex-wrap:wrap;gap:6px 14px;padding:4px 14px 11px;font-size:12px;color:var(--text-secondary,#475569)}
.ab-viz-lgitem{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.ab-viz-lgitem b{font-weight:600;color:var(--text-primary,#1f2937)}
.ab-viz-dot-i{width:9px;height:9px;border-radius:3px;display:inline-block;background:var(--viz-c,#94a3b8)}
.ab-viz-ft{padding:0 14px 10px;font-size:11.5px;color:var(--text-muted,#94a3b8)}
@media (max-width:600px){
  .ab-viz-svg{max-height:260px}
  .ab-viz-hd{font-size:12.5px}
}

/* C.132：横向条形的类目标签 + 数值标签 */
.ab-viz-ylab{fill:var(--text-secondary,#475569);font-size:12px}

/* ==================== C.130·P1-1 仪表盘 / 热力图 / 散点图 ==================== */
.ab-viz-track{fill:none;stroke:var(--border-3,rgba(128,128,128,.22));stroke-width:17;stroke-linecap:round}
.ab-viz-prog{fill:none;stroke:var(--accent,#16a34a);stroke-width:17;stroke-linecap:round;transition:opacity .15s ease}
.ab-viz-prog:hover{opacity:.82}
.ab-viz-gauge-tg{fill:var(--error,#dc2626);stroke:var(--card-bg,#fff);stroke-width:1.2}
.ab-viz-gauge-val{fill:var(--text-primary,#1f2937);font-size:27px;font-weight:700;letter-spacing:-.02em}
.ab-viz-gauge-unit{font-size:12.5px;font-weight:600;fill:var(--text-secondary,#475569);margin-left:2px}
.ab-viz-gauge-lab{fill:var(--text-secondary,#475569);font-size:12.5px;font-weight:600}
.ab-viz-heat-cell{fill:var(--accent,#16a34a);stroke:var(--card-bg,#fff);stroke-width:1}
.ab-viz-heat-x,.ab-viz-heat-y{fill:var(--text-muted,#94a3b8);font-size:10.5px}
.ab-viz-heat-v{fill:#fff;font-size:10.5px;font-weight:600;paint-order:stroke;stroke:rgba(0,0,0,.28);stroke-width:2.2px;stroke-linejoin:round}
.ab-viz-pt{fill:var(--accent,#16a34a);fill-opacity:.68;stroke:var(--card-bg,#fff);stroke-width:1.2;transition:fill-opacity .15s ease}
.ab-viz-pt:hover{fill-opacity:1}
.ab-viz-tick{fill:var(--text-muted,#94a3b8);font-size:10.5px}
/* 热力图列多时横向可滑（避免格子被压扁、字看不清） */
.ab-viz-scroll{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;padding-bottom:2px}
.ab-viz-scroll::-webkit-scrollbar{height:5px}
.ab-viz-scroll::-webkit-scrollbar-thumb{background:var(--border-3,rgba(128,128,128,.3));border-radius:3px}


/* ==================== C.130·P0-2 指标卡 ==================== */
.ab-mx-grid{display:grid;grid-template-columns:repeat(var(--mx-cols,4),minmax(0,1fr));gap:10px;padding:2px 6px 8px}
.ab-mx-item{padding:11px 12px 10px;border:1px solid var(--border-3,rgba(128,128,128,.2));border-radius:10px;
  background:var(--card-bg,rgba(255,255,255,.6))}
.ab-mx-l{font-size:12px;color:var(--text-muted,#94a3b8);line-height:1.4;margin-bottom:5px}
.ab-mx-v{font-size:22px;font-weight:700;color:var(--text-primary,#1f2937);line-height:1.15;letter-spacing:-.02em}
.ab-mx-u{font-size:12px;font-weight:600;color:var(--text-secondary,#475569);margin-left:3px}
.ab-mx-d{font-size:11.5px;font-weight:600;margin-top:5px;color:var(--text-muted,#94a3b8)}
.ab-mx-d.is-up{color:var(--success,#16a34a)}
.ab-mx-d.is-down{color:var(--error,#dc2626)}
.ab-mx-spark{display:block;width:100%;height:26px;margin-top:7px;overflow:visible}
.ab-mx-spark-l{fill:none;stroke:var(--accent,#16a34a);stroke-width:1.8;stroke-linejoin:round;stroke-linecap:round}
.ab-mx-spark-l.is-down{stroke:var(--error,#dc2626)}

/* ==================== C.130·P0-3 竖向时间线 ====================
   注意：类名前缀用 .ab-viz-tl-*，禁止复用 .ab-tl-* —— 那是 Agent 执行时间线（.ab-timeline）的命名空间 */
.ab-viz-tl-c{min-width:0}
.ab-viz-tl-list{list-style:none;margin:0;padding:4px 8px 10px 6px}
.ab-viz-tl-item{position:relative;padding:0 0 14px 24px}
.ab-viz-tl-item:last-child{padding-bottom:2px}
.ab-viz-tl-item:before{content:"";position:absolute;left:5px;top:12px;bottom:0;width:1.5px;background:var(--border-3,rgba(128,128,128,.28))}
.ab-viz-tl-item:last-child:before{display:none}
.ab-viz-tl-dot{position:absolute;left:0;top:5px;width:11px;height:11px;border-radius:50%;
  background:var(--card-bg,#fff);border:2px solid var(--accent,#16a34a);box-sizing:border-box}
.ab-viz-tl-item.is-done .ab-viz-tl-dot{background:var(--accent,#16a34a)}
.ab-viz-tl-time{font-size:11.5px;font-weight:700;color:var(--accent,#16a34a);letter-spacing:.02em;margin-bottom:2px}
.ab-viz-tl-t{font-size:13.5px;font-weight:600;color:var(--text-primary,#1f2937);line-height:1.5}
.ab-viz-tl-d{font-size:12.5px;color:var(--text-secondary,#475569);line-height:1.6;margin-top:2px}
@media (max-width:600px){
  .ab-mx-v{font-size:19px}
  .ab-mx-grid{grid-template-columns:repeat(auto-fit,minmax(112px,1fr));gap:8px}
}

/* ===== C.130·P1-2 图表交互（悬停提示 / 悬停高亮 / 点击固定，纯 DOM 零 CSP）===== */
.ab-viz .ab-viz-bar,.ab-viz .ab-viz-slice,.ab-viz .ab-viz-dot,.ab-viz .ab-viz-pt,
.ab-viz .ab-viz-heat-cell,.ab-viz .ab-viz-prog{cursor:pointer;
  transition:filter .12s ease,opacity .12s ease,stroke-width .12s ease}
.ab-viz .is-hl{filter:brightness(1.1) saturate(1.15)}
.ab-viz .ab-viz-slice.is-hl,.ab-viz .ab-viz-bar.is-hl,.ab-viz .ab-viz-pt.is-hl{opacity:1}
.ab-viz .ab-viz-heat-cell.is-hl{stroke:var(--accent,#16a34a);stroke-width:2.5}
.ab-viz .ab-viz-dot.is-hl,.ab-viz .ab-viz-prog.is-hl{stroke:var(--accent,#16a34a)}
.ab-viz-tip{position:fixed;z-index:9999;pointer-events:none;max-width:260px;
  padding:6px 9px;border-radius:8px;font-size:12.5px;line-height:1.45;font-weight:600;
  color:var(--text-primary,#1f2937);background:var(--card-bg,#fff);
  border:1px solid var(--border-3,rgba(128,128,128,.28));
  box-shadow:0 6px 20px rgba(0,0,0,.16);white-space:normal;word-break:break-word;
  -webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
@media (hover:none){.ab-viz .ab-viz-bar,.ab-viz .ab-viz-slice,.ab-viz .ab-viz-dot,
  .ab-viz .ab-viz-pt,.ab-viz .ab-viz-heat-cell{cursor:default}}

/* ===== C.135·P2-2 图表卡「导出 PNG」按钮（绝对定位，不占文档流）===== */
.ab-viz-xbtn{position:absolute;top:7px;right:9px;display:inline-flex;align-items:center;gap:3px;
  height:22px;padding:0 7px;border:1px solid var(--border-3,rgba(128,128,128,.22));border-radius:6px;
  background:var(--card-bg,rgba(255,255,255,.72));color:var(--text-secondary,#475569);
  font-family:inherit;font-size:calc(10.5px * var(--ab-fs,1));font-weight:600;line-height:1;
  letter-spacing:.2px;cursor:pointer;opacity:.72;
  transition:opacity .15s ease,color .15s ease,border-color .15s ease;
  -webkit-user-select:none;user-select:none}
.ab-viz-xbtn:hover{opacity:1;color:var(--accent,#16a34a);border-color:var(--accent,#16a34a)}
.ab-viz-xbtn:active{transform:translateY(.5px)}
.ab-viz-xbtn svg{display:block;flex:none}
@media (hover:none){.ab-viz-xbtn{opacity:1}}

/* ===== C.130·P1-3 表格升格：可排序 / 可筛选（纯 DOM 零 CSP，只用主题变量）===== */
.ab-tblx{margin:6px 0}
.ab-tblx-bar{display:flex;align-items:center;gap:8px;margin:0 0 6px;
  font-size:calc(12px * var(--ab-fs,1));color:var(--text-muted,#8a8f98)}
.ab-tblx-q{flex:1 1 auto;min-width:0;height:28px;padding:0 10px;
  border:1px solid var(--border-3,rgba(128,128,128,.26));
  border-radius:calc(7px * var(--ab-radius,1));
  background:var(--inner-bg,var(--bg-secondary,#f6f7f9));color:var(--text-primary,#1f2937);
  font-size:calc(12.5px * var(--ab-fs,1));font-family:inherit;outline:none;
  transition:border-color .15s ease,box-shadow .15s ease}
.ab-tblx-q:focus{border-color:var(--accent,#16a34a);
  box-shadow:0 0 0 2px color-mix(in srgb,var(--accent,#16a34a) 18%,transparent)}
.ab-tblx-q::placeholder{color:var(--text-muted,#8a8f98)}
.ab-tblx-q::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}
.ab-tblx-cnt{flex:0 0 auto;white-space:nowrap;font-variant-numeric:tabular-nums}
.ab-tblx-clear{flex:0 0 auto;width:20px;height:20px;line-height:1;padding:0;cursor:pointer;
  border:none;border-radius:50%;background:var(--bg-tertiary,rgba(128,128,128,.16));
  color:var(--text-secondary,#666);font-size:calc(11px * var(--ab-fs,1))}
.ab-tblx-clear:hover{background:color-mix(in srgb,var(--accent,#16a34a) 18%,transparent);
  color:var(--accent,#16a34a)}
.ab-tblx .ab-tblx-clear[hidden],.ab-tblx tr[hidden]{display:none !important}
.ab-tblx th[data-abtbl-col]{position:relative;cursor:pointer;-webkit-user-select:none;user-select:none;
  padding-right:22px !important}
.ab-tblx th[data-abtbl-col]:hover{background:color-mix(in srgb,var(--accent,#16a34a) 18%,transparent)}
.ab-tblx th[data-abtbl-col]:focus-visible{outline:2px solid var(--accent,#16a34a);outline-offset:-2px}
.ab-tblx th[data-abtbl-col]::after{content:'';position:absolute;right:7px;top:50%;width:0;height:0;
  margin-top:-2px;opacity:.32;border-left:3.5px solid transparent;border-right:3.5px solid transparent;
  border-bottom:5px solid var(--text-secondary,#666)}
.ab-tblx th[data-abtbl-dir="1"]::after{opacity:1;border-bottom-color:var(--accent,#16a34a)}
.ab-tblx th[data-abtbl-dir="-1"]::after{opacity:1;margin-top:-3px;border-bottom:none;
  border-top:5px solid var(--accent,#16a34a)}
.ab-tblx td.is-num,.ab-tblx th.is-num{text-align:right!important;font-variant-numeric:tabular-nums!important}
.ab-tblx tr.ab-tblx-empty td{text-align:center;color:var(--text-muted,#8a8f98);
  padding:14px 11px;font-size:calc(12.5px * var(--ab-fs,1))}
@media (max-width:600px){
  .ab-tblx-bar{gap:6px}
  .ab-tblx-q{height:26px;font-size:calc(12px * var(--ab-fs,1))}
  .ab-tblx th[data-abtbl-col]{padding-right:18px !important}
}
@media (hover:none){.ab-tblx th[data-abtbl-col]{cursor:default}}

/* ===== C.133 工具版块·浅色主题次级文字对比度（2026-10-22）=====
   问题：浅色主题 --text-muted(#9ca3af) 落在 #f9fafb / #fff 上只有 2.43–2.54:1，
   工具版块里的分类胶囊、分类计数、卡片英文副名、使用次数、右上角名称、已加载提示全部发虚。
   做法：只在这两个承载 .ab-mkt-* 组件的视图内把 --text-muted 提到 #6b7280（实测 4.65–4.83:1，达 AA），
   不动全局变量，其他页面/主题零影响；--text-secondary(#4b5563) 仍在上一档，层级不塌。 */
:root.ab-light #view-tools,
:root.ab-light #view-lib {
  --text-muted: #6b7280;
}

/* ================= C3（2026-10-23）长期记忆治理面板 · 设置页「AI 自动记忆」 ================= */
/* 设计口径：线性描边 + 描边色区分身份，不用实心大色块；五类记忆靠边框颜色分（约束用红、偏好/画像用主色）。 */
/* 🔴 浅色主题对比度（C.141 真机实测 2.43:1，与 C.133 工具版块同一根因，别删）：
   全局 --text-muted(#9ca3af) 落在 --bg-secondary(#f9fafb) 上只有 2.43:1，低于 WCAG AA 4.5:1，
   表现为「key / 日期 / 类别徽标 / 钉住删除按钮」全部发虚（老板 2026-10-22 已明确批过这个毛病）。
   C.133 的修法只作用在 #view-tools / #view-lib，设置弹窗不继承 ⇒ 这里在本面板作用域内单独提到
   #6b7280（实测 4.62:1，达 AA），不动全局变量、设置页其他区域零影响。 */
:root.ab-light .ab-mem-list,
:root.ab-light #memC1Info { --text-muted: #6b7280; }
.ab-mem-list { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; }
.ab-mem-empty {
  padding: 14px 12px; border: 1px dashed var(--border); border-radius: calc(8px * var(--ab-radius,1));
  font-size:calc(12px * var(--ab-fs,1)); color: var(--text-muted); line-height: 1.65; text-align: center;
}
.ab-mem-item {
  border: 1px solid var(--border); border-radius: calc(10px * var(--ab-radius,1));
  background: var(--bg-secondary); padding: 9px 11px; transition: border-color .15s;
}
.ab-mem-item:hover { border-color: var(--accent); }
.ab-mem-item-exp { opacity: .62; }
.ab-mem-head { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin-bottom: 5px; }
.ab-mem-kind {
  font-size:calc(10.5px * var(--ab-fs,1)); line-height: 1; padding: 3px 7px; border-radius: 4px;
  border: 1px solid var(--border); color: var(--text-muted); white-space: nowrap; flex-shrink: 0;
}
.ab-mem-kind-preference,
.ab-mem-kind-profile { border-color: var(--accent); color: var(--accent); }
.ab-mem-kind-constraint { border-color: var(--error, #ef4444); color: var(--error, #ef4444); }
.ab-mem-key { font-family: ui-monospace, Consolas, monospace; font-size:calc(11px * var(--ab-fs,1)); color: var(--text-muted); }
.ab-mem-tag-pin {
  font-size:calc(10.5px * var(--ab-fs,1)); padding: 2px 6px; border-radius: 4px;
  border: 1px solid var(--accent); color: var(--accent); white-space: nowrap;
}
.ab-mem-tag-exp {
  font-size:calc(10.5px * var(--ab-fs,1)); padding: 2px 6px; border-radius: 4px;
  border: 1px solid var(--border); color: var(--text-muted); white-space: nowrap;
}
.ab-mem-meta { margin-left: auto; font-size:calc(10.5px * var(--ab-fs,1)); color: var(--text-muted); white-space: nowrap; }
.ab-mem-val { font-size:calc(12.5px * var(--ab-fs,1)); color: var(--text-primary); line-height: 1.65; word-break: break-word; }
.ab-mem-ops { display: flex; gap: 8px; margin-top: 7px; }
.ab-mem-op {
  padding: 3px 10px; font-size:calc(11px * var(--ab-fs,1)); border-radius: calc(6px * var(--ab-radius,1));
  border: 1px solid var(--border); background: transparent; color: var(--text-muted);
  cursor: pointer; font-family: inherit; transition: all .12s;
}
.ab-mem-op:hover { border-color: var(--accent); color: var(--accent); }
.ab-mem-op-del:hover { border-color: var(--error, #ef4444); color: var(--error, #ef4444); }
/* 窄屏（手机/窄窗）：日期行不再右推，避免与标签挤成两行断裂 */
@media (max-width: 560px) { .ab-mem-meta { margin-left: 0; width: 100%; } }

/* ===== GW.187i【2026-10-26 老板令·第 3 项】模型介绍右边界拉齐 =====
   老板原话「图像组和视频组 模型列表的模型介绍那一排字 要统一向最右侧靠齐啊，现在参差不齐的」。
   根因：右侧区 .ab-model-side 的宽度随内容变（17/35/41/82/92/121px），而模型介绍用的是
   margin-left:auto 贴住「会变宽变窄的左侧主区」右边界 ⇒ 每行右边界都不一样。
   办法：只给多媒体行（.ab-media-pick）的右侧区定一个不小于最长内容的最小宽度、内部靠右对齐，
   左侧主区右边界就固定了，模型介绍自然连成一条直线。普通对话模型列表不受影响。 */
/* GW.187j【2026-10-26 老板令·第 2 项】右侧列改成两行：第 1 行 夜间折扣/推荐+倍率或价格，
   第 2 行 模型介绍（右边界统一贴最右）。min-width 保留，保证短价格行的右边界也齐。 */
.ab-model-item.ab-media-pick .ab-model-side {
  min-width: calc(124px * var(--ab-fs, 1));
  justify-content: flex-end;
}

/* ===== GW.187i【2026-10-26 老板令·第 1 项】下拉窗选项统一悬停背景 =====
   老板原话「下拉窗 鼠标经过模型列表后 怎么没反应呢…鼠标经过要有统一有背景啊，不然客户都不知道滑到哪个模型了」。
   根因：选项原来是裸 div，靠行内 background 表达选中态 ⇒ 行内样式压过 :hover，鼠标划过毫无反馈。
   现改成类名驱动：选中态与悬停态都走 CSS，两边都看得见。 */
.ab-chat-opt {
  font-size: calc(13px * var(--ab-fs, 1));
  transition: background .12s;
}
.ab-chat-opt:hover { background: var(--bg-hover); }
.ab-chat-opt.ab-chat-opt-on { background: color-mix(in srgb, var(--accent) 10%, transparent); }
.ab-chat-opt.ab-chat-opt-on:hover { background: color-mix(in srgb, var(--accent) 18%, transparent); }

/* ===== GW.187j【2026-10-26 老板令·第 1 项】Auto自动对话模型 右侧 =====
   ① 圆角虚线边框把「当前对话模型名」框住 —— 让客户看出这里是一组可换的模型，
      不会被误认为「下面所有模型列表的折扣按钮」；
   ② 折叠/展开箭头：加粗 + 主题色（默认主题 --accent = #22c55e 绿）实心三角，
      原来 10px 半透明箭头太不明显，客户根本注意不到可以下拉。 */
.ab-media-modelpick {
  font-size: calc(11.5px * var(--ab-fs, 1));
  line-height: 1;
  padding: 3px 9px;
  border-radius: 999px;
  border: 1px dashed color-mix(in srgb, var(--accent) 62%, transparent);
  color: var(--text-primary);
  max-width: calc(168px * var(--ab-fs, 1));
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ab-media-caret {
  font-size: 12px;
  font-weight: 900;
  line-height: 1;
  color: var(--accent);
  transform: translateY(-1px);
}

/* ==================== C.161 支付方式官方图标 · 登录弹窗层级 ====================
   老板 2026-10-27 令：①「微信支付 / 支付宝」两个按钮改用官方图标；
   ②未登录改为在弹窗内登录 —— 账号中心弹窗与套餐弹窗同为 .ab-modal-overlay（z-index:3000），
     这里把 #loginModal 抬到 3200，确保登录窗永远压在套餐窗之上，客户不会「登录窗被挡住」。 */
.ab-pay-logo {
  width: 18px; height: 18px; flex: 0 0 18px;
  object-fit: contain; display: block; pointer-events: none;
}
/* 非选中态图标略微退后，选中态保持官方原色，避免两枚品牌色抢视觉 */
.ab-pay-tab:not(.ab-pay-on) .ab-pay-logo { opacity: .82; }
#loginModal { z-index: 3200; }

/* ══ C.176 ② Agent 原语：角色库面板（角色存服务端，桌面与网页共用一套）══ */
.ab-role-wrap { display: flex; gap: 14px; padding: 12px 18px 18px; min-height: 0; flex: 1; }
.ab-role-side { width: 242px; flex: 0 0 242px; display: flex; flex-direction: column; gap: 8px; min-height: 0; }
.ab-role-side-hd { font-size: calc(12px * var(--ab-fs, 1)); color: var(--text-muted); letter-spacing: .04em; padding: 2px 2px 0; }
.ab-role-list { flex: 1; overflow-y: auto; display: flex; flex-direction: column; gap: 6px; min-height: 0; }
.ab-role-item { border: 1px solid var(--border); border-radius: calc(8px * var(--ab-radius, 1)); padding: 9px 10px; cursor: pointer; background: var(--bg-secondary); transition: border-color .16s, background .16s; }
.ab-role-item:hover { background: var(--bg-hover); }
.ab-role-item.on { border-color: var(--accent); background: var(--accent-light); }
.ab-role-item-nm { font-size: calc(13px * var(--ab-fs, 1)); color: var(--text-primary); font-weight: 600; display: flex; align-items: center; gap: 6px; }
.ab-role-bd { font-size: calc(10px * var(--ab-fs, 1)); font-weight: 400; color: var(--text-muted); border: 1px solid var(--border); border-radius: 999px; padding: 0 6px; line-height: 16px; }
.ab-role-item-ds { font-size: calc(11.5px * var(--ab-fs, 1)); color: var(--text-muted); margin-top: 3px; line-height: 1.45; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.ab-role-tip { font-size: calc(12px * var(--ab-fs, 1)); color: var(--text-muted); padding: 10px 2px; }
.ab-role-new { flex: 0 0 auto; height: 32px; border: 1px dashed var(--border); background: transparent; color: var(--text-secondary); border-radius: calc(8px * var(--ab-radius, 1)); cursor: pointer; font-size: calc(12.5px * var(--ab-fs, 1)); }
.ab-role-new:hover { border-color: var(--accent); color: var(--accent); }
.ab-role-edit { flex: 1; min-width: 0; overflow-y: auto; border: 1px solid var(--border); border-radius: calc(10px * var(--ab-radius, 1)); background: var(--bg-secondary); padding: 14px 16px; }
.ab-role-empty { color: var(--text-muted); font-size: calc(12.5px * var(--ab-fs, 1)); line-height: 1.7; }
.ab-role-row { display: flex; align-items: center; gap: 10px; margin-bottom: 9px; }
.ab-role-row-top { align-items: flex-start; }
.ab-role-lb { flex: 0 0 76px; font-size: calc(12px * var(--ab-fs, 1)); color: var(--text-secondary); }
.ab-role-in { flex: 1; min-width: 0; height: 30px; padding: 0 9px; border: 1px solid var(--border); border-radius: calc(7px * var(--ab-radius, 1)); background: var(--bg-tertiary); color: var(--text-primary); font-size: calc(12.5px * var(--ab-fs, 1)); }
.ab-role-ta { flex: 1; min-width: 0; padding: 8px 9px; border: 1px solid var(--border); border-radius: calc(7px * var(--ab-radius, 1)); background: var(--bg-tertiary); color: var(--text-primary); font-size: calc(12.5px * var(--ab-fs, 1)); line-height: 1.6; resize: vertical; font-family: inherit; }
.ab-role-in:focus, .ab-role-ta:focus { outline: none; border-color: var(--accent); }
.ab-role-foot { display: flex; align-items: center; gap: 10px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--border); }
.ab-role-save { height: 30px; padding: 0 16px; border: 1px solid var(--accent); background: var(--accent-light); color: var(--accent); border-radius: calc(7px * var(--ab-radius, 1)); cursor: pointer; font-size: calc(12.5px * var(--ab-fs, 1)); }
.ab-role-save:hover { background: var(--accent); color: #fff; }
.ab-role-del { height: 30px; padding: 0 14px; border: 1px solid var(--border); background: transparent; color: var(--error); border-radius: calc(7px * var(--ab-radius, 1)); cursor: pointer; font-size: calc(12.5px * var(--ab-fs, 1)); }
.ab-role-del:disabled { opacity: .45; cursor: not-allowed; color: var(--text-muted); }
.ab-role-id { margin-left: auto; font-size: calc(11px * var(--ab-fs, 1)); color: var(--text-muted); font-family: ui-monospace, Menlo, Consolas, monospace; }

/* ===== GW.198【2026-10-27 老板令】「最热」促销标改暗红色字体 ===== */
/* 老板原话：「DeepSeek-V4.1-Flash 和 GLM-5.3-Flash 两个模型的促销标 都改为"最热"字体颜色换暗红色标签」 */
/* 线性风格：不铺实心色块，只做暗红文字 + 极浅红底 + 细红边（与全站线性图标口径一致） */
.ab-model-tag.ab-tag-hot,
.ab-model-promo.ab-tag-hot,
.ab-mtip-badge.ab-tag-hot {
  color: #a01f1a !important;
  background: rgba(160, 31, 26, .075) !important;
  border: 1px solid rgba(160, 31, 26, .28) !important;
  font-weight: 600 !important;
}
/* 暗色主题下提亮保证可读（浅色主题才是老板核对口径，此处不动其色值） */
[data-theme="dark"] .ab-model-tag.ab-tag-hot,
[data-theme="dark"] .ab-model-promo.ab-tag-hot,
[data-theme="dark"] .ab-mtip-badge.ab-tag-hot {
  color: #e0574f !important;
  background: rgba(224, 87, 79, .14) !important;
  border-color: rgba(224, 87, 79, .40) !important;
}

/* ===== C.187【2026-10-28 老板令】多人协同 · 办公面板「文档」页 状态条与头像墙 ===== */
/* 线性口径：头像只做描边＋文字同色，不铺实心色块；色点仅表示连接态，面积极小 */
.ab-collab-bar{display:flex;align-items:center;gap:8px;margin:6px 0 4px;padding:5px 10px;
  border:1px solid var(--ab-line,#e5e7eb);border-radius:7px;background:#fafcfa;
  font-size:12.5px;line-height:1.6;color:#4b5563}
.ab-collab-dot{width:7px;height:7px;border-radius:50%;flex:none;
  border:1.5px solid #cbd5e1;background:transparent}
.ab-collab-dot.on{border-color:#16a34a;background:#16a34a}
.ab-collab-dot.off{border-color:#d97706;background:#d97706}
.ab-collab-txt{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ab-collab-av{display:flex;gap:4px;flex:none}
.ab-collab-av1{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;
  border-radius:50%;border:1.5px solid #16a34a;background:#fff;
  font-size:11px;font-weight:600;line-height:1;overflow:hidden}
.ab-collab-sw{border:1px solid var(--ab-line,#e5e7eb);background:#fff;border-radius:6px;
  padding:2px 9px;font-size:12px;color:#374151;cursor:pointer;white-space:nowrap;flex:none}
.ab-collab-sw:hover{border-color:#16a34a;color:#15803d}
.ab-set-btn.ab-collab-dirty{border-color:#d97706;color:#b45309;
  box-shadow:0 0 0 2px rgba(217,119,6,.12)}
[data-theme="dark"] .ab-collab-bar{background:#141a17;border-color:#2a3530;color:#9fb0a7}
[data-theme="dark"] .ab-collab-av1{background:#1a211d}
[data-theme="dark"] .ab-collab-sw{background:#1a211d;border-color:#2a3530;color:#c7d3cc}

/* ══════════════════════════════════════════════════════════════════════════
   GW.206【2026-10-28 22:21 老板令】模型列表极简化 · 列表单色 + 悬浮卡片承载详情
   ────────────────────────────────────────────────────────────────────────
   老板原话：
     「模型列表里面把之前的彩色的主题元素，换成普通黑色或者灰色通用字体元素，
      这样可以减少一种颜色在整洁的模型列表排列上」
     「列表唯一彩色元素就是促销标签，这个必须保留的，这是营销必备的，
      不然客户第一眼决定选哪个模型还得促销标来引导的」
     「『当前』标留字…不再启动主题元素的绿色，换通用元素颜色」
     「线路胶囊要一起进卡片」「卡片里的线路可点，悬停就能换」
   ⇒ 列表＝灰图标 + 模型名 +（当前·灰）+ 促销标（唯一彩色）+ 一个价格
     卡片＝官方彩色 LOGO + 完整介绍 + 线路（虚线选中、可点换）
   ⚠️ 促销标相关类（.ab-model-tag / .ab-night-tag / .ab-tag-hot）一律不动、保持彩色。
   ══════════════════════════════════════════════════════════════════════════ */

/* 单色图标：列表里所有模型 LOGO 统一走次要文字色（GPT 官方标仍由 .ab-gpt-logo 压成正文色） */
.ab-mono-logo { color: var(--text-secondary); }
.ab-mono-on   { color: var(--text-primary); }

/* 「当前」标改通用色：去掉主题绿底，只留细描边 + 次要文字色（老板令：不再启动主题色） */
.ab-model-tag.ab-tag-plain {
  background: transparent;
  color: var(--text-muted);
  border: 1px solid var(--border);
}

.ab-cur-tag.ab-cur-plain {
  background: transparent;
  color: var(--text-muted);
  border: 1px solid var(--border);
  padding: 0 5px;
}
.ab-model-tag.ab-tag-current.ab-cur-plain {
  background: transparent !important;
  color: var(--text-muted) !important;
  border: 1px solid var(--border) !important;
  box-shadow: none !important;
  font-weight: 400 !important;
}

/* 右侧「当前模型名」虚线胶囊 + 三角：边框与箭头都降为通用灰 */
.ab-media-modelpick.ab-plain {
  border-color: var(--border);
  color: var(--text-secondary);
  padding-right: 6px;
}
.ab-media-caret.ab-plain { color: var(--text-secondary); }

/* 媒体模型的全部行（Auto 四行 + 具体模型行）：统一 45px，
   与普通对话模型行（.ab-model-item 默认 9px 上下内距 = 45px）完全对齐 ⇒ 整个菜单行高一致 */
.ab-model-item.ab-media-row {
  padding: 0 12px !important;
  height: 45px;
  white-space: nowrap;
  align-items: center;
}

/* 选中行不再铺主题绿底 + 绿竖条，改中性：浅底 + 次要色竖条（唯一彩色留给促销标） */
.ab-model-item.ab-media-pick.ab-model-active {
  background: var(--bg-tertiary);
  box-shadow: inset 3px 0 0 var(--text-secondary);
}
.ab-model-item.ab-media-pick.ab-model-active:hover {
  background: var(--bg-hover);
}

/* 「添加自定义模型…」入口：静态走次要灰，悬停才回到正文色 ——
   老板令「列表唯一彩色元素就是促销标签」，所以这个入口不能再常亮主题绿 */
.ab-model-custom { color: var(--text-secondary) !important; }
.ab-model-custom:hover { color: var(--text-primary) !important; }

/* ── 媒体模型悬浮卡片（唯一允许出现品牌彩色的地方）── */
.ab-mcard {
  position: fixed;
  z-index: 401;
  width: 262px;
  padding: 12px;
  background: var(--bg-secondary);
  border: 1px solid var(--border);
  border-radius: calc(12px * var(--ab-radius, 1));
  box-shadow: var(--shadow);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ab-mcard-hd { display: flex; align-items: center; gap: 8px; }
.ab-mcard-logo {
  width: 26px; height: 26px; flex: 0 0 26px;
  display: inline-flex; align-items: center; justify-content: center;
}
.ab-mcard-logo svg { width: 26px; height: 26px; }
.ab-mcard-name {
  font-size: calc(13.5px * var(--ab-fs, 1));
  font-weight: 500;
  color: var(--text-primary);
  flex: 1 1 auto; min-width: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.ab-mcard-desc {
  font-size: calc(12px * var(--ab-fs, 1));
  line-height: 18px;
  color: var(--text-muted);
}
.ab-mcard-prow { display: flex; align-items: center; gap: 8px; }
.ab-mcard-price {
  font-size: calc(13px * var(--ab-fs, 1));
  color: var(--text-primary);
  font-family: Consolas, 'Courier New', monospace;
}
.ab-mcard-price em {
  font-style: normal;
  font-size: calc(10.5px * var(--ab-fs, 1));
  color: var(--text-muted);
  margin-left: 1px;
}
.ab-mcard-sec {
  font-size: calc(10.5px * var(--ab-fs, 1));
  color: var(--text-muted);
  letter-spacing: .04em;
  padding-top: 7px;
  border-top: 1px solid var(--border);
}
.ab-mcard-lanes { display: flex; flex-wrap: wrap; gap: 6px; }
.ab-mcard-lane {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: calc(11px * var(--ab-fs, 1));
  line-height: 1;
  padding: 5px 9px;
  border-radius: 999px;
  cursor: pointer;
  user-select: none;
  background: transparent;
  border: 1px solid var(--border);
  color: var(--text-secondary);
}
.ab-mcard-lane:hover { border-color: var(--text-muted); color: var(--text-primary); }
.ab-mcard-lane.on { border: 1px dashed var(--text-muted); color: var(--text-primary); }
.ab-mcard-lp {
  font-family: Consolas, 'Courier New', monospace;
  font-size: calc(10.5px * var(--ab-fs, 1));
  opacity: .75;
}
.ab-mcard-lp em { font-style: normal; font-size: calc(10px * var(--ab-fs, 1)); }

/* ══════════════════════════════════════════════════════════════════════════════
   GW.207【2026-10-28 老板令·6 条】智能多媒体模型列表 · 细节修正
   ──────────────────────────────────────────────────────────────────────────────
   老板原话（逐条）：
     ①「模型列表页的 MiniMax H3 左侧需要黑白的官方 LOGO 图标…还有『Auto 自动视频模型』
        左侧也确实该有黑白标啊 现在没有标的，你添加上去」  → app.js A1 + 本块末尾 .ab-mm-logo
     ②「『Auto 自动对话模型』右侧的 虚线框要改为深色 例如黑色的，不然客户都不知道这里还可以选择下拉」
     ③「『Auto 自动音频模型』右侧的虚线框没修改成功啊 现在是实线框，虚线框也需要改为深色 例如黑色的」
     ④「『添加自定义模型...』字体要加粗」
     ⑤「线路一 线路二 不要带倍率…把倍率换成 多少钱/张，例如：0.06元/张」＋「默认选择的线路二
        需要彩色标记啊 ，客户那里知道选的是哪个」
     ⑥「所有模型被选中后的『当前』标签 要深色明显一点，之前我们是绿色实心的，现在你可以改为深色
        通用色实心显示，例如黑色胶囊白色文字，标签不要太小了 看都看不见」
   ──────────────────────────────────────────────────────────────────────────────
   ⚠️ 全部写成末尾追加（不改上文老规则）⇒ 同特异性靠书写顺序自然胜出；回滚只需删掉本块。
   ══════════════════════════════════════════════════════════════════════════════ */

/* ── ②③ 右侧「当前模型名」胶囊：深色虚线 ──────────────────────────────────────
   🔴 实测根因：borderStyle 一直是 dashed，但 border-color 取的是 --border（浅色主题 #e5e7eb），
   1px 浅灰虚线压在白底上肉眼等同「一条看不见的实线」⇒ 老板才说「没修改成功啊 现在是实线框」。
   修法：边框换成正文色 var(--text-primary)（浅色主题＝#111827 近黑）并加粗到 1.5px，虚线才真的显形。 */
.ab-media-modelpick.ab-plain {
  border: 1.5px dashed var(--text-primary) !important;
  color: var(--text-secondary);
  padding-right: 8px;
}
.ab-media-caret.ab-plain { color: var(--text-primary) !important; }

/* ── ⑥「当前」标：通用色反转实心 + 加大 ────────────────────────────────────────
   原来 .ab-model-tag.ab-tag-current 是「主题绿实底 + 白字 + 1px 白描边」；
   .ab-cur-tag.ab-cur-plain 又被 GW.206 降成了透明底浅灰字 ⇒ 两套并存、后者几乎看不见。
   现统一为一套：底色 = var(--text-primary)、字色 = var(--bg-primary)
   ⇒ 浅色主题＝黑胶囊白字（正是老板举的例子）；深色主题＝浅胶囊深字，两主题都最高对比。
   字号 10px → 11.5px、上下内距 1px → 2px，标签不再「看都看不见」。 */
.ab-cur-tag.ab-cur-plain,
.ab-model-tag.ab-tag-current,
.ab-model-tag.ab-tag-current.ab-cur-plain {
  background: var(--text-primary) !important;
  color: var(--bg-primary) !important;
  border: 0 !important;
  box-shadow: none !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  font-size: calc(11.5px * var(--ab-fs, 1)) !important;
  padding: 2px 8px !important;
  margin-left: 6px !important;
  height: auto !important;
  line-height: 1.3 !important;
  vertical-align: middle;
  border-radius: 999px !important;
  white-space: nowrap;
}
/* hover 时不要回退成主题绿底（.ab-model-item…:hover 那条规则会带背景色） */
.ab-model-item.ab-media-pick.ab-model-active:hover .ab-cur-tag.ab-cur-plain {
  background: var(--text-primary) !important;
  color: var(--bg-primary) !important;
}

/* ── ⑤ 卡片里「被选中的线路」加彩色标记 ────────────────────────────────────────
   原来 .ab-mcard-lane.on 只有 1px 虚线灰边 + 正文色字 ⇒ 客户看不出当前走哪条线路。
   现改成主题色描边 + 主题色淡底 + 主题色加粗字（卡片内用彩色是老板认可的，
   与 GW.206「列表唯一彩色＝促销标」不冲突 —— 这条只在悬浮卡片里生效）。 */
.ab-mcard-lane.on {
  border: 1px solid var(--accent) !important;
  background: color-mix(in srgb, var(--accent) 15%, transparent) !important;
  color: var(--accent) !important;
  font-weight: 600 !important;
}
.ab-mcard-lane.on .ab-mcard-lp { opacity: .95; }

/* ── ④「添加自定义模型…」加粗 ────────────────────────────────────────────────
   app.js 里已加 inline font-weight:600；这里再兜一层，防止以后有人清掉行内样式。 */
.ab-model-custom { font-weight: 600 !important; }

/* ── ① 单色官方 LOGO（MiniMax H3 / Auto 自动视频模型）────────────────────────
   官方 path 用 currentColor 填充 ⇒ 自动跟随 .ab-mono-logo 的次要文字色，与其它线性图标同款；
   .ab-mono-on（选中行）时变正文色。尺寸与 sprite 图标一致（18×18）。 */
.ab-mm-logo { display: block; width: 18px; height: 18px; flex: none; }
.ab-model-logo .ab-mm-logo { width: 18px; height: 18px; }
/* 列表右侧「元/张」：数字等宽、单位小一号，与「元/秒」同款观感 */
.ab-model-price em { font-style: normal; font-size: calc(10.5px * var(--ab-fs, 1)); margin-left: 1px; }
/* ===== GW.207 END ===== */

/* ===== C.298 本地能力面板（技能闸的第一个真实调用方）===== */
/* 只补四处：面板宽度、目录输入框弹性、闸状态行取色、结果输出区。其余行/输入/按钮
   全部复用 .ab-as-row / .ab-as-input / .ab-set-btn 等既有类，避免为一块新 UI 再长一套设计语言。 */
.ab-autosetup.ab-localtool { width: 720px; }
.ab-localtool-path { flex: 1; min-width: 0; }
/* 闸状态行是本面板最要紧的一句（到底有没有接线、扫到几个技能），
   用 --text-secondary 而不是 sibling 面板那种更淡的 muted，保证一眼读得清。 */
.ab-localtool-gate { color: var(--text-secondary); }
.ab-localtool-hint { font-size: calc(11px * var(--ab-fs, 1)); color: var(--text-muted); line-height: 1.5; }
.ab-localtool-out { margin: 0; max-height: 42vh; overflow: auto; font-family: ui-monospace, Consolas, "Courier New", monospace; font-size: calc(11.5px * var(--ab-fs, 1)); line-height: 1.6; white-space: pre-wrap; word-break: break-word; background: var(--bg-secondary); border: 1px solid var(--border); border-radius: calc(10px * var(--ab-radius, 1)); padding: 10px 12px; color: var(--text-primary); }
/* ===== C.298 END ===== */
/* ===== C.302 操作权限面板（工作台内可开 · 与「本地能力」面板同一套骨架）===== */
.ab-autosetup.ab-toolpolicy { width: 880px; }
.ab-policy-tier-row { display: flex; gap: 10px; }
.ab-policy-tier { flex: 1; min-width: 0; border: 1px solid var(--border); border-radius: calc(10px * var(--ab-radius, 1)); padding: 10px 12px; cursor: pointer; background: var(--bg-secondary); transition: border-color .15s, background .15s; }
.ab-policy-tier:hover { border-color: var(--accent); }
.ab-policy-tier-on { border-color: var(--accent); background: var(--accent-light); }
.ab-policy-tier-h { display: flex; align-items: center; gap: 6px; font-weight: 600; font-size: calc(13px * var(--ab-fs, 1)); color: var(--text-primary); }
.ab-policy-tag { font-size: calc(10.5px * var(--ab-fs, 1)); font-weight: 400; color: var(--accent); border: 1px solid currentColor; border-radius: 999px; padding: 0 6px; line-height: 1.6; }
.ab-policy-tier-d { margin-top: 6px; font-size: calc(11.5px * var(--ab-fs, 1)); line-height: 1.55; color: var(--text-secondary); }
.ab-policy-cols { display: flex; gap: 12px; align-items: flex-start; }
.ab-policy-col { flex: 1; min-width: 0; border: 1px solid var(--border); border-radius: calc(10px * var(--ab-radius, 1)); padding: 10px 12px; background: var(--bg-secondary); }
.ab-policy-col-h { font-weight: 600; font-size: calc(12.5px * var(--ab-fs, 1)); color: var(--text-primary); margin-bottom: 8px; }
.ab-policy-kv { font-size: calc(11.5px * var(--ab-fs, 1)); line-height: 1.7; color: var(--text-secondary); }
.ab-policy-kv b { color: var(--text-primary); font-weight: 600; }
.ab-policy-scoped { margin-top: 6px; max-height: 132px; overflow: auto; }
.ab-policy-scoped-item { font-size: calc(11px * var(--ab-fs, 1)); line-height: 1.6; color: var(--text-secondary); padding: 3px 0; border-bottom: 1px dashed var(--border); word-break: break-word; }
.ab-policy-scoped-item:last-child { border-bottom: 0; }
.ab-policy-scoped-item b { color: var(--text-primary); font-weight: 600; }
.ab-policy-sec { display: flex; align-items: center; gap: 8px; margin-top: 4px; font-weight: 600; font-size: calc(12.5px * var(--ab-fs, 1)); color: var(--text-primary); }
.ab-policy-count { font-weight: 400; color: var(--text-muted); font-size: calc(11px * var(--ab-fs, 1)); }
.ab-policy-list { max-height: 118px; overflow: auto; font-size: calc(11px * var(--ab-fs, 1)); line-height: 1.65; color: var(--text-secondary); }
.ab-policy-row { display: flex; gap: 8px; padding: 3px 0; border-bottom: 1px dashed var(--border); }
.ab-policy-row:last-child { border-bottom: 0; }
.ab-policy-row-t { flex: 0 0 44px; color: var(--text-muted); font-variant-numeric: tabular-nums; }
.ab-policy-row-m { flex: 1; min-width: 0; word-break: break-all; }
.ab-policy-deny { color: var(--error); }
.ab-policy-ok { color: var(--success); }
.ab-policy-sep { height: 1px; background: var(--border); margin: 4px 0; }
/* ===== C.302 END ===== */

/* ===== C.350 补回：v397 P20-d 图片处理面板样式 =====
   来龙去脉：这套 .ab-ie-* 样式在 2026-10-22 09:32 ~ 10-24 01:01 之间的一次 styles.css
   重写里被整段丢掉（备份 bak-c128 还有、bak-c141 已无），而入口一直活着
   （04-tools-flow.js 工具栏按钮 + 06-settings-init.js 命令面板都还能调 abImageEditOpen），
   结果是客户点「图片处理」看到一片裸排版、卡片掉到页面最底部。
   老板 2026-11-05 23:15 答复「补回（推荐）」⇒ 从 _bak_c114a_20261021-015449/styles.css 原样还原，
   一字未改。选择器全是 .ab-ie-*、与现有样式零重名；用到的 9 个 CSS 变量当前都有定义。 */
/* ===== v397 P20-d 图片处理 ===== */
.ab-ie-mask{position:fixed;inset:0;z-index:2200;background:rgba(0,0,0,.45);display:flex;align-items:center;justify-content:center;padding:20px}
.ab-ie-card{position:relative;width:620px;max-width:94vw;max-height:90vh;overflow:auto;background:var(--bg-primary);border:1px solid var(--border);border-radius:calc(14px * var(--ab-radius,1));box-shadow:0 16px 48px rgba(0,0,0,.35);padding:18px 20px}
.ab-ie-close{position:absolute;right:14px;top:12px;cursor:pointer;color:var(--text-muted);font-size:calc(15px * var(--ab-fs,1))}
.ab-ie-head{display:flex;align-items:center;gap:8px;font-size:calc(15px * var(--ab-fs,1));color:var(--text-primary);margin-bottom:14px}
.ab-ie-head .ab-ic{width:17px;height:17px;color:var(--accent);flex-shrink:0}
.ab-ie-sub{font-size:calc(12px * var(--ab-fs,1));color:var(--text-muted)}
.ab-ie-body{display:flex;gap:16px;align-items:flex-start}
.ab-ie-drop{flex:none;width:240px;height:240px;border:1.5px dashed var(--border);border-radius:calc(12px * var(--ab-radius,1));display:flex;align-items:center;justify-content:center;text-align:center;cursor:pointer;color:var(--text-muted);font-size:calc(13px * var(--ab-fs,1));overflow:hidden;background:var(--panel,#f8fafb)}
.ab-ie-drop:hover{border-color:var(--accent);color:var(--accent)}
.ab-ie-preview{width:100%;height:100%;object-fit:contain}
.ab-ie-right{flex:1;min-width:0;display:flex;flex-direction:column;gap:10px}
.ab-ie-presets{display:flex;flex-wrap:wrap;gap:6px}
.ab-ie-preset{border:1px solid var(--border);background:transparent;color:var(--text-muted);border-radius:calc(8px * var(--ab-radius,1));padding:5px 10px;font-size:calc(12px * var(--ab-fs,1));cursor:pointer}
.ab-ie-preset.on{border-color:var(--accent);color:var(--accent);background:var(--accent-light)}
.ab-ie-prompt{border:1px solid var(--border);border-radius:calc(8px * var(--ab-radius,1));padding:8px 10px;font-size:calc(13px * var(--ab-fs,1));font-family:inherit;color:var(--text-primary);background:var(--bg-primary);outline:none;resize:vertical}
.ab-ie-go{border:none;border-radius:calc(8px * var(--ab-radius,1));background:var(--accent);color:#fff;font-size:calc(13px * var(--ab-fs,1));font-weight:600;padding:9px 14px;cursor:pointer}
.ab-ie-go:disabled{opacity:.6;cursor:default}
.ab-ie-hint{font-size:calc(11px * var(--ab-fs,1));color:var(--text-muted)}
.ab-ie-result{margin-top:14px;border-top:1px solid var(--border);padding-top:12px}
.ab-ie-rtitle{font-size:calc(13px * var(--ab-fs,1));font-weight:600;color:var(--text-primary);margin-bottom:8px}
.ab-ie-rimg{max-width:100%;max-height:52vh;border-radius:calc(10px * var(--ab-radius,1));border:1px solid var(--border)}
@media (max-width:640px){.ab-ie-body{flex-direction:column}.ab-ie-drop{width:100%;height:200px}}

/* C.362【2026-11-06 老板令】生图/生视频「动起来的进度」：圆环在转、环心数字在走、阶段词在换 */
.ab-gen{display:flex;align-items:center;gap:14px;padding:2px 0}
.ab-gen-ring{position:relative;width:56px;height:56px;flex:none}
.ab-gen-ring svg{width:56px;height:56px;transform:rotate(-90deg);display:block}
.ab-gen-bg{fill:none;stroke:var(--border);stroke-width:5}
.ab-gen-arc{fill:none;stroke:var(--accent);stroke-width:5;stroke-linecap:round;transition:stroke-dashoffset .6s ease}
.ab-gen-spin{fill:none;stroke:var(--accent);stroke-width:5;stroke-linecap:round;opacity:.45;transform-origin:28px 28px;animation:abGenSpin 1.4s linear infinite}
@keyframes abGenSpin{to{transform:rotate(360deg)}}
.ab-gen-pct{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:calc(13px * var(--ab-fs,1));font-weight:600;color:var(--accent);font-variant-numeric:tabular-nums}
.ab-gen-info{min-width:0;display:flex;flex-direction:column;gap:3px}
.ab-gen-phase{font-size:calc(13px * var(--ab-fs,1));color:var(--text-primary)}
.ab-gen-sub{font-size:calc(12px * var(--ab-fs,1));color:var(--text-muted);font-variant-numeric:tabular-nums}
.ab-gen-hint{font-size:calc(11px * var(--ab-fs,1));color:var(--text-muted);opacity:.85}
@media (prefers-reduced-motion:reduce){.ab-gen-spin{animation:none}}
/* ===== C.375：可复用进度圆环（子代理／专家团／工作流／定时任务四处共用一套几何）=====
   尺寸由 JS 写外层 width/height；viewBox 恒 0 0 56 56、r=24 不变 ⇒ 一套 CSS 撑全档。
   弧只按「真进度」填充；拿不到真分母时 .is-spin 让虚线弧一直转（环心放已用秒数）。*/
.ab-ring{position:relative;display:inline-flex;flex:none;vertical-align:middle;line-height:0}
.ab-ring-slot{display:inline-flex;align-items:center;flex:none}
.ab-wf-rl-ring{margin-left:auto;margin-right:8px}
.ab-ring svg{width:100%;height:100%;display:block;transform:rotate(-90deg)}
.ab-ring-bg{fill:none;stroke:var(--border);stroke-width:5}
.ab-ring-arc{fill:none;stroke:var(--accent);stroke-width:5;stroke-linecap:round;transition:stroke-dashoffset .6s ease}
.ab-ring-spin{fill:none;stroke:var(--accent);stroke-width:5;stroke-linecap:round;opacity:.45;transform-origin:28px 28px;animation:abGenSpin 1.4s linear infinite;visibility:hidden}
.ab-ring.is-spin .ab-ring-spin{visibility:visible}
.ab-ring-txt{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-weight:600;line-height:1;color:var(--accent);font-variant-numeric:tabular-nums;letter-spacing:-.2px}
.ab-ring.is-error .ab-ring-arc{stroke:var(--error,#ef4444)}
.ab-ring.is-error .ab-ring-spin{stroke:var(--error,#ef4444)}
.ab-ring.is-error .ab-ring-txt{color:var(--error,#ef4444)}
.ab-ring.is-done .ab-ring-txt{color:var(--success,var(--accent))}
@media (prefers-reduced-motion:reduce){.ab-ring-spin{animation:none}}

/* ============================================================================
   【C.376 2026-11-06】⑤ 一键上线弹层（发布 / 站点管理）
   沿用 --bg-primary / --text-primary / --border / --accent-hover / --ab-radius / --ab-fs
   这些既有变量 => 深色、浅色、暗夜蓝、护眼暖灰四档主题自动跟随，不写死颜色。
   ============================================================================ */
.ab-pub-mask{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:10002;display:flex;align-items:center;justify-content:center;padding:24px}
.ab-pub-box{background:var(--bg-primary,#fff);color:var(--text-primary);border-radius:calc(14px * var(--ab-radius,1));box-shadow:0 20px 60px rgba(0,0,0,.3);width:100%;max-width:600px;max-height:86vh;display:flex;flex-direction:column;overflow:hidden}
.ab-pub-head{display:flex;align-items:center;gap:8px;padding:15px 18px 12px;border-bottom:1px solid var(--border)}
.ab-pub-h{flex:1;display:flex;align-items:center;gap:8px;font-size:calc(15px * var(--ab-fs,1));font-weight:700;color:var(--text-primary)}
.ab-pub-h .ab-ic{width:18px;height:18px;color:var(--accent-hover);vertical-align:0}
.ab-pub-x{border:0;background:transparent;color:var(--text-secondary);cursor:pointer;width:28px;height:28px;border-radius:calc(8px * var(--ab-radius,1));display:flex;align-items:center;justify-content:center;padding:0}
.ab-pub-x:hover{background:rgba(127,127,127,.14);color:var(--text-primary)}
.ab-pub-tip{padding:12px 18px 0;font-size:calc(12.5px * var(--ab-fs,1));line-height:1.7;color:var(--text-secondary)}
.ab-pub-lb{display:block;padding:12px 18px 0;font-size:calc(12.5px * var(--ab-fs,1));color:var(--text-secondary)}
.ab-pub-title{display:block;width:100%;margin-top:6px;padding:9px 12px;font-size:calc(13.5px * var(--ab-fs,1));color:var(--text-primary);background:var(--bg-secondary,transparent);border:1px solid var(--border);border-radius:calc(8px * var(--ab-radius,1));outline:none;box-sizing:border-box}
.ab-pub-title:focus{border-color:var(--accent-hover)}
.ab-pub-row{display:flex;flex-wrap:wrap;gap:8px;padding:12px 18px 0}
.ab-pub-go{border:1px solid var(--accent-hover);background:var(--accent-hover);color:#fff;border-radius:calc(8px * var(--ab-radius,1));padding:8px 16px;font-size:calc(13px * var(--ab-fs,1));cursor:pointer;font-weight:600}
.ab-pub-go:hover{filter:brightness(1.06)}
.ab-pub-go:disabled{opacity:.55;cursor:default;filter:none}
.ab-pub-go-2{background:transparent;color:var(--text-primary);border-color:var(--border);font-weight:500}
.ab-pub-go-2:hover{background:rgba(127,127,127,.1);filter:none}
.ab-pub-note{padding:10px 18px 0;font-size:calc(12px * var(--ab-fs,1));line-height:1.7;color:var(--text-secondary)}
.ab-pub-result{padding:0 18px}
.ab-pub-ok{display:flex;align-items:center;gap:7px;margin-top:12px;padding:9px 12px;border-radius:calc(8px * var(--ab-radius,1));background:rgba(34,197,94,.12);color:var(--success,var(--accent-hover));font-size:calc(13px * var(--ab-fs,1));font-weight:600}
.ab-pub-ok .ab-ic{width:16px;height:16px}
.ab-pub-err{display:flex;align-items:flex-start;gap:7px;margin-top:12px;padding:9px 12px;border-radius:calc(8px * var(--ab-radius,1));background:rgba(239,68,68,.1);color:var(--error,#ef4444);font-size:calc(12.5px * var(--ab-fs,1));line-height:1.6}
.ab-pub-err .ab-ic{width:15px;height:15px;margin-top:1px}
.ab-pub-url{margin-top:8px;padding:9px 12px;font-family:Consolas,Monaco,monospace;font-size:calc(12px * var(--ab-fs,1));color:var(--text-primary);background:rgba(127,127,127,.1);border:1px solid var(--border);border-radius:calc(8px * var(--ab-radius,1));word-break:break-all;user-select:all}
.ab-pub-sect{display:flex;align-items:center;gap:8px;margin-top:16px;padding:10px 18px 8px;border-top:1px solid var(--border);font-size:calc(12.5px * var(--ab-fs,1))}
.ab-pub-sect-h{font-weight:700;color:var(--text-primary)}
.ab-pub-quota{flex:1;color:var(--text-secondary);font-size:calc(11.5px * var(--ab-fs,1))}
.ab-pub-refresh{border:1px solid var(--border);background:transparent;color:var(--text-secondary);width:26px;height:26px;border-radius:calc(7px * var(--ab-radius,1));cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0}
.ab-pub-refresh .ab-ic{width:14px;height:14px}
.ab-pub-refresh:hover{color:var(--text-primary);background:rgba(127,127,127,.1)}
.ab-pub-list{flex:1;min-height:120px;overflow:auto;padding:0 18px 16px}
.ab-pub-empty{padding:18px 0;text-align:center;font-size:calc(12.5px * var(--ab-fs,1));color:var(--text-secondary);line-height:1.7}
.ab-pub-item{display:flex;align-items:center;gap:10px;padding:10px 12px;margin-bottom:8px;border:1px solid var(--border);border-radius:calc(10px * var(--ab-radius,1));background:var(--bg-secondary,transparent)}
.ab-pub-item.is-off{opacity:.72}
.ab-pub-i-main{flex:1;min-width:0}
.ab-pub-i-title{display:flex;align-items:center;gap:7px;font-size:calc(13px * var(--ab-fs,1));font-weight:600;color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ab-pub-badge{flex-shrink:0;padding:1px 7px;border-radius:999px;font-size:calc(10.5px * var(--ab-fs,1));font-weight:500;color:var(--text-secondary);background:rgba(127,127,127,.16)}
.ab-pub-i-meta{margin-top:3px;font-size:calc(11.5px * var(--ab-fs,1));color:var(--text-secondary);font-variant-numeric:tabular-nums}
.ab-pub-i-acts{display:flex;flex-wrap:wrap;gap:5px;justify-content:flex-end}
.ab-pub-i-acts button{border:1px solid var(--border);background:transparent;color:var(--text-secondary);border-radius:calc(7px * var(--ab-radius,1));padding:4px 9px;font-size:calc(11.5px * var(--ab-fs,1));cursor:pointer;white-space:nowrap}
.ab-pub-i-acts button:hover{color:var(--text-primary);background:rgba(127,127,127,.1)}
.ab-pub-i-acts button.is-danger:hover{color:var(--error,#ef4444);border-color:var(--error,#ef4444)}
/* 面板工具条里的「上线」按钮：与相邻图标按钮同尺寸，只上一点主色，不做实心块 */
.ab-art-pv-pub{color:var(--accent-hover)}
.ab-art-pv-pub:hover{background:rgba(34,197,94,.12)}
@media (max-width:640px){
  .ab-pub-box{max-height:92vh}
  .ab-pub-item{flex-direction:column;align-items:stretch}
  .ab-pub-i-acts{justify-content:flex-start}
}

/* ============================================================================
   【C.377 2026-11-06】⑥ 托管后端不自建、改对接 —— 外部数据服务（自带云）
   沿用 --bg-primary / --text-primary / --text-secondary / --border / --accent-hover
   等既有变量 => 深色、浅色、暗夜蓝、护眼暖灰四档主题自动跟随，不写死颜色。
   ============================================================================ */
.ab-extdb-why{
  padding:10px 12px;
  border-left:3px solid var(--accent-hover);
  background:color-mix(in srgb, var(--accent) 8%, transparent);
  border-radius:0 var(--ab-radius) var(--ab-radius) 0;
  line-height:1.85;
  /* 这段是「我们不给你存数据」的核心声明，不能走 .ab-set-note 的 --text-muted
     （浅色档 #9ca3af 对白底只有 2.5:1，读不清）。改用 --text-secondary，四档均 ≥6:1。 */
  color:var(--text-secondary);
}
.ab-extdb-why b{color:var(--text-primary);font-weight:600}
.ab-extdb-path{
  font-size:calc(var(--ab-fs) - 1px);
  color:var(--text-secondary);
  word-break:break-all;
}
#extdbMsg{min-height:18px;line-height:1.7}
#extdbMsg.is-ok{color:var(--accent-hover)}
#extdbMsg.is-bad{color:#dc2626}
#extdbMsg.is-warn{color:#d97706}
.ab-extdb-out{margin-top:14px;border:1px solid var(--border);border-radius:var(--ab-radius);overflow:hidden}
.ab-extdb-out-head{
  display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;
  padding:9px 12px;
  background:color-mix(in srgb, var(--text-primary) 4%, transparent);
  border-bottom:1px solid var(--border);
}
.ab-extdb-out-title{font-weight:600;color:var(--text-primary)}
.ab-extdb-out-hint{font-size:calc(var(--ab-fs) - 2px);color:var(--text-secondary)}
.ab-extdb-block + .ab-extdb-block{border-top:1px solid var(--border)}
.ab-extdb-block-head{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:7px 12px;
  font-size:calc(var(--ab-fs) - 1px);
  color:var(--text-secondary);
}
.ab-extdb-pre{
  margin:0;padding:10px 12px 14px;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
  font-size:calc(var(--ab-fs) - 2px);
  line-height:1.72;
  color:var(--text-primary);
  white-space:pre;
  overflow-x:auto;
  overflow-y:auto;
  max-height:230px;
  background:color-mix(in srgb, var(--text-primary) 3%, transparent);
  border-top:1px dashed var(--border);
}

/* 【C.377】⑥ 上线弹层里的「接我自己的云」引导条 */
.ab-extdb-cta{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  flex-wrap:wrap;
  margin-top:12px;
  padding:10px 12px 10px 14px;
  border:1px solid var(--border);
  border-left:3px solid var(--accent, #3b82f6);
  border-radius:10px;
  background:color-mix(in srgb, var(--accent, #3b82f6) 6%, transparent);
}
.ab-extdb-cta-txt{
  flex:1 1 240px;min-width:0;
  font-size:calc(var(--ab-fs) - 1px);
  line-height:1.6;
  opacity:.9;
}
.ab-extdb-cta-txt b{font-weight:600;opacity:1}
.ab-extdb-cta-btn{
  flex:0 0 auto;
  padding:7px 14px;
  font-size:calc(var(--ab-fs) - 1px);
  font-weight:500;
  color:var(--accent, #3b82f6);
  background:transparent;
  border:1px solid color-mix(in srgb, var(--accent, #3b82f6) 52%, transparent);
  border-radius:8px;
  cursor:pointer;
  transition:background .16s, color .16s;
}
.ab-extdb-cta-btn:hover{
  background:color-mix(in srgb, var(--accent, #3b82f6) 14%, transparent);
}
/* 从弹层跳过来时闪一下，让人一眼看到落在哪 */
.ab-set-region.is-flash{
  animation:abExtdbFlash 1.5s ease-out 1;
}
@keyframes abExtdbFlash{
  0%   { box-shadow:0 0 0 0 color-mix(in srgb, var(--accent, #3b82f6) 55%, transparent); }
  35%  { box-shadow:0 0 0 6px color-mix(in srgb, var(--accent, #3b82f6) 18%, transparent); }
  100% { box-shadow:0 0 0 0 color-mix(in srgb, var(--accent, #3b82f6) 0%, transparent); }
}