﻿/* ==================== style.css ====================
   浙江造价多技能智能体 · 客户端样式（2026-10-15 自单文件版拆分）
   ======================================================= */
    * { margin: 0; padding: 0; box-sizing: border-box; }
    body { font-family: 'Microsoft YaHei', 'PingFang SC', sans-serif; background: #f0f2f5; height: 100vh; overflow: hidden; }

    /* 整体布局（DeepSeek 风：左侧边栏 + 右侧对话区，无顶部横条，2026-10-05） */
    .container { display: flex; height: 100vh; overflow: hidden; }

    /* 侧边栏 */
    .sidebar { width: 260px; background: #F9FAFB; border-right: 1px solid #dde0e5; display: flex; flex-direction: column; flex-shrink: 0; }
    .sidebar-brand { padding: 16px 16px 10px; font-size: 15px; font-weight: 600; color: #1f2937; letter-spacing: 0.5px; text-align: center; }
    /* 收起边栏（仅电脑端，2026-10-07 杨总指示：DeepSeek 式，brand 行右侧图标） */
    .sidebar-brand { display: flex; align-items: center; justify-content: center; gap: 8px; }
    .collapse-btn { display: flex; align-items: center; justify-content: center; background: transparent; border: none; color: #9ca3af; cursor: pointer; padding: 4px; border-radius: 6px; transition: color 0.15s, background 0.15s; flex-shrink: 0; }
    .collapse-btn:hover { color: #4d6bfe; background: #eef1fe; }
    /* 收起态：侧栏隐藏 + 左上角浮出展开按钮 */
    .container.sidebar-collapsed .sidebar { display: none; }
    .container.sidebar-collapsed .resize-v { display: none; }
    .sidebar-expand-btn { display: none; }
    .container.sidebar-collapsed .sidebar-expand-btn { display: flex; align-items: center; justify-content: center; position: fixed; top: 12px; left: 12px; z-index: 150; width: 36px; height: 36px; border-radius: 8px; background: #fff; border: 1px solid #e5e7eb; color: #6b7280; cursor: pointer; box-shadow: 0 1px 6px rgba(0,0,0,0.08); transition: color 0.15s, border-color 0.15s; }
    .container.sidebar-collapsed .sidebar-expand-btn:hover { color: #4d6bfe; border-color: #4d6bfe; }
    .sidebar-footer { border-top: 1px solid #d8dbe0; padding: 10px 12px; display: flex; align-items: center; gap: 8px; }
    .quota-badge { background: #fff; color: #4b5563; border: 1px solid #d8dbe0; border-radius: 12px; padding: 5px 12px; font-size: 12px; cursor: pointer; transition: background 0.2s; white-space: nowrap; font-weight: 600; }
    .quota-badge:hover { background: #f5f6f8; }
    .quota-badge.unlimited { opacity: 0.85; }
    /* 余额不足 100 万（含透支负值）→ 红色警示（2026-10-09 杨总指示） */
    .quota-badge.low-quota { color: #dc2626; border-color: #fca5a5; background: #fef2f2; }
    .quota-badge.low-quota:hover { background: #fee2e2; }
    /* Key 有效期小字标注（2026-10-11 杨总指示：徽标后加"至YYYY/M/D有效"，字号与历史对话日期一致=11px，黑色）
       剩余不足 7 天 → 红色；已过期 → 红色显示"已过期" */
    .quota-expire { font-size: 11px; color: #000; white-space: nowrap; line-height: 1.2; }
    .quota-expire.expiring { color: #dc2626; font-weight: 600; }
    /* 弹窗内"当前 Key 有效日期"显示窗（与 .quota-row 同款样式） */
    .quota-row.date-row { color: #1e40af; }
    .quota-row.date-row.expired { color: #dc2626; }
    .user-menu { position: relative; cursor: pointer; font-size: 16px; padding: 4px 10px; border-radius: 8px; transition: background 0.2s; color: #6b7280; margin-left: auto; }
    .user-menu:hover { background: #dfe2e7; }
    .user-dropdown { display: none; position: absolute; right: 0; bottom: 100%; margin-bottom: 6px; background: #fff; border-radius: 8px; box-shadow: 0 4px 16px rgba(0,0,0,0.15); min-width: 140px; z-index: 100; overflow: hidden; }
    .user-dropdown a { display: block; padding: 10px 16px; color: #333; text-decoration: none; font-size: 13px; transition: background 0.15s; }
    .user-dropdown a:hover { background: #f0f2f5; }
    .user-dropdown a.danger { color: #e53e3e; }

    /* 侧边栏 */
    .sidebar { width: 240px; background: #F9FAFB; border-right: 1px solid #e8e8e8; display: flex; flex-direction: column; }
    .sidebar-header { display: none; }
    /* DeepSeek 式（2026-10-19 杨总指示）：细线加号 + 文字，按钮内居中，白底圆角，hover 浅灰 */
    .new-chat-btn { margin: 2px 12px 10px; background: #fff; color: #374151; border: 1px solid #e5e7eb; padding: 10px 14px; border-radius: 10px; cursor: pointer; font-size: 14px; width: calc(100% - 24px); display: flex; align-items: center; justify-content: center; gap: 9px; transition: background 0.15s, border-color 0.15s; }
    .new-chat-btn:hover { background: #f3f4f6; border-color: #dde0e5; }
    .new-chat-btn svg { flex-shrink: 0; }
    .chat-list { flex: 1; overflow-y: auto; padding: 8px; }
    /* 历史对话栏滚动条：细条；鼠标未移入列表框时隐藏（2026-10-07 杨总指示） */
    .chat-list::-webkit-scrollbar { width: 5px; }
    .chat-list::-webkit-scrollbar-track { background: transparent; }
    .chat-list::-webkit-scrollbar-thumb { background: transparent; border-radius: 3px; transition: background 0.2s; }
    .chat-list:hover::-webkit-scrollbar-thumb { background: #d8dbe0; }
    .chat-list:hover::-webkit-scrollbar-thumb:hover { background: #c8ccd4; }
    /* Firefox：默认 thumb 透明=隐藏，移入列表框才显色 */
    .chat-list { scrollbar-width: thin; scrollbar-color: transparent transparent; }
    .chat-list:hover { scrollbar-color: #d8dbe0 transparent; }
    .chat-item { padding: 10px 12px; border-radius: 8px; cursor: pointer; margin-bottom: 4px; transition: background 0.15s; position: relative; }
    .chat-item:hover { background: #dfe2e7; }
    .chat-item.active { background: #eff6ff; color: #4d6bfe; }
    .chat-item .title { font-size: 13px; color: #333; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .chat-item .time { font-size: 11px; color: #999; margin-top: 2px; }
    .chat-item .delete-btn { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); background: none; border: none; color: #ccc; cursor: pointer; font-size: 14px; padding: 2px 4px; border-radius: 4px; display: none; }
    .chat-item:hover .delete-btn { display: block; }
    .chat-item .delete-btn:hover { color: #e53e3e; background: #fee2e2; }

    /* 分隔条 */
    .resize-v { width: 1px; cursor: col-resize; background: transparent; transition: background 0.2s; flex-shrink: 0; }
    .resize-v:hover, .resize-v.active { background: #4d6bfe; }

    /* 对话区（2026-10-05 三调：绝对定位方案——输入区焊死底部，拖动/缩放只伸缩输入框高度，底部永不移动） */
    .chat-area { position: relative; flex: 1; min-width: 0; overflow: hidden; background: #fff; --input-h: 160px; --col-w: 1200px; }
    /* ↑ --col-w：阅读列宽（2026-10-09 杨总指示：大屏消息左右分太开，限宽居中方便阅读）。
       消息区与输入卡片共用此值，保证两者左右边缘对齐；使用处 100% 均=对话区宽度。小屏自动收窄。 */
    /* inset:0 需 Chromium 87+，信创/UOS 老内核（如 Chromium 86）不认会导致容器坍缩为 0×0
       → 消息 DOM 已渲染但完全不可见（2026-10-11 UOS 用户报障）。改用四边显式写法（Chrome 1+ 支持） */
    .chat-body { position: absolute; top: 0; right: 0; bottom: 0; left: 0; }
    .empty-state { display: flex; flex-direction: column; align-items: center; justify-content: center; color: #999; position: absolute; top: 0; left: 0; right: 0; bottom: var(--input-h, 160px); z-index: 1; pointer-events: none; padding: 0 20px; text-align: center; }
    .msg { display: flex; gap: 10px; max-width: 85%; }
    .msg.user { align-self: flex-end; flex-direction: row-reverse; }
    .msg.assistant { align-self: flex-start; }
    /* msg-main：气泡+操作行纵排容器（2026-10-05 十四调：复制按钮改 DeepSeek 式常显淡灰） */
    .msg-main { display: flex; flex-direction: column; min-width: 0; max-width: 100%; }
    .bubble-foot { display: flex; align-items: center; gap: 10px; margin-top: 6px; }
    .msg.user .bubble-foot { justify-content: flex-end; }   /* 用户消息：按钮右下角 */
    .msg .avatar { width: 34px; height: 34px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 16px; flex-shrink: 0; }
    /* 头像统一：蓝底主题色 #4d6bfe（与按钮一致）+ 同一人形 SVG，用户黑、AI 白（2026-10-05 杨总定） */
    .msg.user .avatar { background: #4d6bfe; color: #1f2937; }
    .msg.assistant .avatar { background: #4d6bfe; color: #fff; }
    .msg .avatar svg { display: block; }
    .msg .bubble { padding: 10px 14px; border-radius: 12px; font-size: 14px; line-height: 1.7; word-break: break-word; }
    .msg.user .bubble { background: #fff; color: #1f2937; padding: 2px 0 0 0; }
    .msg.assistant .bubble { color: #333; padding: 2px 0 0 0; }
    /* 灰底黑字（2026-10-19 杨总定稿：黑底白字被否；灰色 #F9FAFB 同左侧历史对话框侧栏底色），
       细边框圆角，内部横向滚动保留 */
    .msg .bubble pre { background: #F9FAFB; color: #1f2937; border: 1px solid #e5e7eb; padding: 12px; border-radius: 8px; overflow-x: auto; margin: 8px 0; font-size: 13px; }
    .msg .bubble code { background: rgba(0,0,0,0.06); padding: 1px 4px; border-radius: 3px; font-size: 13px; }
    .msg .bubble pre code { background: none; padding: 0; }
    /* markdown 图片自适应 + 查看原图（2026-10-19 杨总方案）：超宽图 max-width:100% 自动缩小
       到气泡宽度内，不再撑破消息区（横向滚动条根源消除）；
       hover 出「查看原图」角标按钮，点击弹出全屏 lightbox 看原始尺寸 */
    .msg .bubble .img-box { position: relative; display: inline-block; max-width: 100%; margin: 6px 0; }
    .msg .bubble .img-box img { display: block; max-width: 100%; height: auto; border-radius: 8px; cursor: zoom-in; }
    .msg .bubble .img-box .img-zoom-btn { position: absolute; right: 8px; bottom: 8px; background: rgba(0,0,0,0.55); color: #fff; border: none; border-radius: 6px; padding: 3px 10px; font-size: 12px; line-height: 1.6; cursor: pointer; font-family: inherit; opacity: 0; transition: opacity 0.15s; }
    .msg .bubble .img-box:hover .img-zoom-btn { opacity: 1; }
    /* lightbox：全屏黑底看原图（点击任意处或 Esc 关闭） */
    .lightbox { display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.86); z-index: 1000; align-items: center; justify-content: center; }
    .lightbox.open { display: flex; }
    .lightbox img { max-width: 94vw; max-height: 90vh; border-radius: 6px; box-shadow: 0 8px 40px rgba(0,0,0,0.5); cursor: zoom-out; }
    .msg .bubble table { border-collapse: collapse; width: 100%; margin: 8px 0; font-size: 13px; }
    .msg .bubble th, .msg .bubble td { border: 1px solid #d1d5db; padding: 6px 10px; text-align: left; }
    .msg .bubble th { background: #f3f4f6; }
    .msg .bubble p { margin: 4px 0; }
    .msg .bubble ul, .msg .bubble ol { padding-left: 20px; margin: 4px 0; }
    .msg .bubble h1, .msg .bubble h2, .msg .bubble h3 { margin: 12px 0 6px; }
    .msg .bubble h1 { font-size: 18px; }
    .msg .bubble h2 { font-size: 16px; }
    .msg .bubble h3 { font-size: 15px; }

    /* 拖拽把手（2026-10-05 九调：hover 显示上下拉伸箭头，替代粗蓝条） */
    .resize-handle { position: absolute; left: 0; right: 0; bottom: var(--input-h, 160px); height: 20px; margin-bottom: -10px; cursor: ns-resize; z-index: 20; display: flex; align-items: center; justify-content: center; }
    .resize-icon { color: transparent; font-size: 11px; letter-spacing: 1px; line-height: 1; user-select: none; transition: color 0.15s, transform 0.15s; }
    .resize-handle:hover .resize-icon { color: #6b7280; }
    .resize-handle.active .resize-icon { color: #4d6bfe; transform: scaleY(1.15); }
    .drag-guide { position: absolute; left: 20px; right: 20px; top: 50%; height: 0; border-top: 1px dashed #c8ccd4; opacity: 0; transition: opacity 0.15s; }
    .resize-handle:hover .drag-guide { opacity: 1; }

    .chat-messages { position: absolute; top: 0; left: 0; right: 0; bottom: var(--input-h, 160px); overflow-y: auto; padding: 20px max(20px, calc((100% - var(--col-w)) / 2)); display: flex; flex-direction: column; gap: 16px; }
    /* 对话框滚动条：与历史对话栏 .chat-list 完全一致（2026-10-11 杨总指示：颜色、宽度统一）
       规格逐条照抄：5px 宽、track 透明、thumb 默认透明（隐藏）、移入列表框显 #d8dbe0、
       thumb 再 hover 显 #c8ccd4、圆角 3px */
    .chat-messages::-webkit-scrollbar { width: 5px; }
    .chat-messages::-webkit-scrollbar-track { background: transparent; }
    .chat-messages::-webkit-scrollbar-thumb { background: transparent; border-radius: 3px; transition: background 0.2s; }
    .chat-messages:hover::-webkit-scrollbar-thumb { background: #d8dbe0; }
    .chat-messages:hover::-webkit-scrollbar-thumb:hover { background: #c8ccd4; }
    /* Firefox：默认 thumb 透明=隐藏，移入才显色（与 chat-list 同策略） */
    .chat-messages { scrollbar-width: thin; scrollbar-color: transparent transparent; }
    .chat-messages:hover { scrollbar-color: #d8dbe0 transparent; }

    /* 输入区（absolute 焊死底部：拖动/缩放窗口时底边恒等于视口底边，永不移动） */
    .input-area { position: absolute; bottom: 0; left: 0; right: 0; padding: 8px max(20px, calc((100% - var(--col-w)) / 2)) 14px; background: #fff; z-index: 5; }
    .input-card { width: 100%; max-width: var(--col-w); margin: 0 auto; border: 1px solid #e5e7eb; border-radius: 18px; padding: 12px 14px 10px; background: #fff; box-shadow: 0 2px 12px rgba(0,0,0,0.05); transition: border-color 0.2s, box-shadow 0.2s; }
    .input-card.drag-over { border-color: #4d6bfe; background: #f5f8ff; box-shadow: 0 2px 16px rgba(77,107,254,0.18); }
    .input-card:focus-within { border-color: #4d6bfe; box-shadow: 0 2px 16px rgba(77,107,254,0.12); }
    .input-card textarea { width: 100%; resize: none; border: none; padding: 6px 4px; font-size: 14px; font-family: inherit; line-height: 1.6; min-height: 48px; max-height: none; outline: none; background: transparent; box-sizing: border-box; }
    .input-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 6px; }
    .toolbar-left { display: flex; align-items: center; gap: 10px; min-width: 0; }
    .agent-hint { font-size: 12px; color: #9ca3af; white-space: nowrap; }
    /* 【使用说明】黑标 + 悬停气泡（2026-10-07 杨总指示：黑标与灰字区分；气泡浅灰底黑字，含智能体介绍+示例问题可点击填入） */
    .agent-hint { position: relative; cursor: help; }
    .hint-tag { color: #1f2937; font-weight: 600; }
    .hint-pop { display: none; position: absolute; bottom: calc(100% + 10px); left: -8px; width: 380px; max-width: 76vw; background: #f3f4f6; color: #1f2937; border: 1px solid #e5e7eb; border-radius: 10px; padding: 12px 14px 10px; box-shadow: 0 6px 24px rgba(0,0,0,0.14); z-index: 60; white-space: normal; text-align: left; }
    .agent-hint.pop-open .hint-pop { display: block; }
    .hint-pop::after { content: ''; position: absolute; top: 100%; left: 24px; border: 7px solid transparent; border-top-color: #f3f4f6; }
    .hint-pop .hp-name { font-weight: 600; font-size: 13px; color: #1f2937; margin-bottom: 6px; }
    .hint-pop .hp-intro { font-size: 12px; line-height: 1.7; color: #374151; margin-bottom: 8px; }
    .hint-pop .hp-ex-title { font-size: 11px; color: #6b7280; margin-bottom: 5px; }
    .hint-pop .hp-ex { display: block; width: 100%; text-align: left; background: #fff; border: 1px solid #e5e7eb; border-radius: 8px; padding: 6px 10px; font-size: 12px; color: #374151; cursor: pointer; margin-bottom: 5px; transition: border-color 0.15s, color 0.15s; }
    .hint-pop .hp-ex:last-child { margin-bottom: 0; }
    .hint-pop .hp-ex:hover { border-color: #4d6bfe; color: #4d6bfe; }
    /* ===== 自定义智能体下拉（2026-10-11 杨总指示：去 emoji 改 #5E70F5 小蓝点）===== */
    .agent-select-native { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }  /* 原生 select 保留为数据源，视觉隐藏 */
    .agent-dd { position: relative; display: inline-block; }
    .agent-dd-btn { display: inline-flex; align-items: center; gap: 7px; background: #f4f5f7; color: #374151; border: 1px solid #e5e7eb; border-radius: 16px; padding: 6px 12px; font-size: 12px; cursor: pointer; max-width: 240px; font-family: inherit; }
    .agent-dd-btn:hover { background: #ecedef; }
    .agent-dd-btn:focus { outline: none; border-color: #4d6bfe; }
    .agent-dd-btn .dd-dot { width: 8px; height: 8px; border-radius: 50%; background: #5E70F5; flex-shrink: 0; }
    .agent-dd-btn #agentDDLabel { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .agent-dd-btn .dd-caret { font-size: 10px; color: #9ca3af; flex-shrink: 0; }
    .agent-dd-list { display: none; position: absolute; bottom: calc(100% + 6px); left: 0; min-width: 250px; max-height: 320px; overflow-y: auto; background: #fff; border: 1px solid #e5e7eb; border-radius: 10px; box-shadow: 0 4px 16px rgba(0,0,0,0.12); z-index: 300; padding: 4px; }
    .agent-dd.open .agent-dd-list { display: block; }
    /* 下拉列表滚动条：与历史对话栏 .chat-list 完全一致（2026-10-11 杨总指示：颜色、宽度统一）
       规格逐条照抄 chat-list：5px 宽、track 透明、thumb 默认透明（隐藏）、移入列表框显 #d8dbe0、
       thumb 再 hover 显 #c8ccd4、圆角 3px */
    .agent-dd-list::-webkit-scrollbar { width: 5px; }
    .agent-dd-list::-webkit-scrollbar-track { background: transparent; }
    .agent-dd-list::-webkit-scrollbar-thumb { background: transparent; border-radius: 3px; transition: background 0.2s; }
    .agent-dd-list:hover::-webkit-scrollbar-thumb { background: #d8dbe0; }
    .agent-dd-list:hover::-webkit-scrollbar-thumb:hover { background: #c8ccd4; }
    /* Firefox：默认 thumb 透明=隐藏，移入列表框才显色（与 chat-list 同策略） */
    .agent-dd-list { scrollbar-width: thin; scrollbar-color: transparent transparent; }
    .agent-dd-list:hover { scrollbar-color: #d8dbe0 transparent; }
    .agent-dd-item { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 7px; cursor: pointer; font-size: 13px; color: #333; white-space: nowrap; }
    .agent-dd-item:hover { background: #f4f5f7; }
    .agent-dd-item.selected { background: #eef1fe; color: #4d6bfe; font-weight: 600; }
    .agent-dd-item .dd-dot { width: 7px; height: 7px; border-radius: 50%; background: #5E70F5; flex-shrink: 0; }
    .toolbar-actions { display: flex; align-items: center; gap: 8px; }
    .send-btn { background: #4d6bfe; color: #fff; border: none; width: 40px; height: 40px; border-radius: 50%; cursor: pointer; font-size: 17px; flex-shrink: 0; transition: background 0.2s; display: flex; align-items: center; justify-content: center; }
    .send-btn:hover { background: #3a5bec; }
    /* 2026-10-19 杨总定稿：空输入禁用态 = 淡蓝色底白箭头（原灰色被否，改回淡蓝 #b6c3ff） */
    .send-btn:disabled { background: #b6c3ff; color: #fff; cursor: default; }
    .send-btn:disabled:hover { background: #b6c3ff; }
    /* 任务进行中：发送钮 ➤ 变 ⏹ 停止钮（点击叫停，2026-10-05 方案A 杨总定：在输入框右侧箭头位置替换） */
    .send-btn.stopping { background: #4d6bfe; }
    .send-btn.stopping:hover { background: #3a5bec; }
    .attach-btn { background: transparent; color: #6b7280; border: none; width: 36px; height: 36px; border-radius: 50%; cursor: pointer; font-size: 18px; flex-shrink: 0; transition: all 0.2s; display: flex; align-items: center; justify-content: center; }
    .attach-btn:hover { background: #f0f2f5; color: #4d6bfe; }
    /* 手机端抽屉开关☰ + 遮罩：默认隐藏（电脑端零影响，2026-10-07） */
    .menu-toggle { display: none; }
    .drawer-overlay { display: none; }

    /* ===== 手机端自适应（≤768px，全部隔离在媒体查询内，电脑端不命中；2026-10-07 杨总定：按宽度触发+☰左滑抽屉+遮罩）===== */
    @media (max-width: 768px) {
      /* 高度自适应：dvh 解决手机地址栏伸缩导致的溢出（电脑端不命中此块） */
      .container { height: 100vh; height: 100dvh; }
      .chat-area { --input-h: 132px; }

      /* 电脑端"收起边栏"功能在手机端不适用：隐藏两个按钮，并重置可能残留的收起状态
         （防止用户在电脑收起后缩窗到手机宽度，侧栏被 display:none 导致抽屉打不开） */
      .collapse-btn, .sidebar-expand-btn { display: none !important; }
      .container.sidebar-collapsed .sidebar { display: flex; }
      .container.sidebar-collapsed .resize-v { display: none; }

      /* 侧栏改抽屉：移出文档流，默认左滑隐藏，.open 时滑入 */
      .sidebar {
        position: fixed; top: 0; left: 0; bottom: 0; width: 82vw; max-width: 320px;
        transform: translateX(-100%); transition: transform 0.28s ease;
        z-index: 210; box-shadow: 2px 0 16px rgba(0,0,0,0.12);
      }
      .sidebar.open { transform: translateX(0); }

      /* ☰ 开关：左上角悬浮，触摸友好尺寸 */
      .menu-toggle {
        display: flex; align-items: center; justify-content: center;
        position: fixed; top: 10px; left: 10px; z-index: 150;
        width: 40px; height: 40px; border-radius: 10px;
        background: rgba(255,255,255,0.9); border: 1px solid #e5e7eb;
        color: #374151; font-size: 20px; cursor: pointer;
        box-shadow: 0 1px 6px rgba(0,0,0,0.08); backdrop-filter: blur(4px);
      }
      /* 遮罩：抽屉打开时显示，点击关闭 */
      .drawer-overlay {
        display: none; position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 200;
        background: rgba(0,0,0,0.4);
      }
      .drawer-overlay.show { display: block; }

      /* 消息区/欢迎卡片顶部让位给悬浮☰，避免遮挡 */
      .chat-messages { padding: 58px 14px 16px; gap: 14px; }
      .empty-state { top: 48px; padding: 0 16px; }

      /* 拖拽调高手柄在手机端无意义，隐藏（输入框仍随内容自适应） */
      .resize-handle { display: none; }
      /* 侧栏拖宽分隔条在抽屉模式下无意义，隐藏 */
      .resize-v { display: none; }

      /* 输入区：缩小留白，卡片几乎占满宽 */
      .input-area { padding: 6px 10px calc(10px + env(safe-area-inset-bottom)); }
      .input-card { width: 100%; border-radius: 16px; padding: 10px 12px 8px; }
      .input-card textarea { font-size: 16px; min-height: 44px; }  /* 16px 防 iOS 聚焦自动缩放 */
      /* 工具行：隐藏【使用说明】长文本（窄屏会溢出），保留下拉+附件+发送 */
      .agent-hint { display: none; }
      .agent-dd-btn { max-width: 46vw; font-size: 13px; padding: 7px 10px; }   /* 自定义下拉按钮（原 .agent-select）*/
      .agent-dd-list { min-width: 200px; max-height: 260px; }
      .send-btn { width: 44px; height: 44px; }   /* 触摸友好 */
      .attach-btn { width: 40px; height: 40px; }
      /* 消息气泡最大宽度放宽 */
      .msg { max-width: 92%; }
      /* 使用说明气泡若触发也不超屏 */
      .hint-pop { width: 88vw; max-width: 88vw; }
    }
    .file-chips { display: flex; flex-wrap: wrap; gap: 6px; }
    .file-chips:empty { display: none; }
    .file-chip { display: inline-flex; align-items: center; gap: 6px; background: #eff6ff; color: #1e40af; border: 1px solid #bfdbfe; border-radius: 6px; padding: 4px 10px; font-size: 12px; max-width: 280px; }
    /* 查询引导 chip（2026-10-13 杨总指示）：A22 回答末尾"请输入：查询XX定额/清单 XX 详细信息"
       渲染成可点击按钮，点一下就把查询句填入下方输入框（不自动发送，可再编辑）。
       按钮文本即查询句本身（不用 data-* 属性承载——escHtml 不转义双引号，属性承载有破坏 HTML 的风险） */
    .query-chip { display: inline-block; background: #eff6ff; color: #1e40af; border: 1px solid #bfdbfe; border-radius: 14px; padding: 2px 12px; font-size: 12.5px; line-height: 1.7; cursor: pointer; font-family: inherit; margin: 0 2px; vertical-align: baseline; transition: background 0.15s, border-color 0.15s; white-space: nowrap; }
    .query-chip:hover { background: #dbeafe; border-color: #93c5fd; }
    .query-chip:active { background: #bfdbfe; }
    /* 手机端：长查询句允许换行，避免撑破气泡 */
    @media (max-width: 768px) { .query-chip { white-space: normal; font-size: 12px; } }
    .file-chip .chip-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 180px; }
    .file-chip .chip-size { color: #93a5c8; }
    .file-chip .remove { cursor: pointer; color: #93c5fd; font-weight: bold; padding: 0 2px; }
    .file-chip .remove:hover { color: #e53e3e; }
    .status-text { font-size: 12px; color: #999; margin-top: 6px; }

    /* 设置弹窗 */
    .modal-overlay { display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.5); z-index: 1000; justify-content: center; align-items: center; }
    .modal-overlay.show { display: flex; }
    .modal { background: #fff; border-radius: 12px; padding: 24px; width: 420px; max-width: 90vw; position: relative; }
    .modal h2 { font-size: 16px; margin-bottom: 16px; }
    /* 弹窗右上角关闭叉（2026-10-09 杨总指示：没调整可直接点叉关闭） */
    .modal-close { position: absolute; top: 14px; right: 14px; width: 28px; height: 28px; border: none; background: transparent; color: #9ca3af; font-size: 20px; line-height: 1; cursor: pointer; border-radius: 6px; display: flex; align-items: center; justify-content: center; transition: background 0.15s, color 0.15s; padding: 0; }
    .modal-close:hover { background: #f0f2f5; color: #374151; }
    .modal label { display: block; font-size: 13px; color: #666; margin-bottom: 6px; }
    .modal input { width: 100%; padding: 10px 12px; border: 1px solid #d1d5db; border-radius: 8px; font-size: 14px; margin-bottom: 16px; }
    .modal input:focus { border-color: #4d6bfe; outline: none; }
    .modal .btn-group { display: flex; justify-content: flex-end; gap: 8px; }
    .modal .btn-group button { padding: 8px 20px; border-radius: 8px; border: none; cursor: pointer; font-size: 13px; }
    .modal .btn-primary { background: #4d6bfe; color: #fff; }
    .modal .btn-primary:hover { background: #3a5bec; }
    .modal .btn-secondary { background: #f0f2f5; color: #666; }
    .modal .btn-secondary:hover { background: #e5e7eb; }
    .modal .api-status { font-size: 12px; padding: 6px 10px; border-radius: 6px; margin-bottom: 12px; display: none; }
    .modal .api-status.ok { display: block; background: #dcfce7; color: #166534; }
    .modal .api-status.err { display: block; background: #fee2e2; color: #991b1b; }
    .modal .hint { font-size: 12px; color: #8a94a6; margin: -4px 0 16px; line-height: 1.7; background: #f8f9fb; border-radius: 8px; padding: 10px 12px; }
    .modal .key-row { display: flex; gap: 8px; align-items: center; margin-bottom: 16px; }
    .modal .key-row input { width: auto; flex: 1; margin-bottom: 0; }
    .modal .key-toggle { background: #f0f2f5; border: 1px solid #d1d5db; border-radius: 8px; padding: 8px 14px; cursor: pointer; font-size: 12px; color: #666; flex-shrink: 0; }
    .modal .key-toggle:hover { background: #e5e7eb; }
    .modal .btn-danger { background: #fee2e2; color: #991b1b; }
    /* Key 充值按钮（2026-10-09 杨总指示：占位待开发，底色 #F9C23C，禁用不可点） */
    .modal .btn-recharge { background: #F9C23C; color: #5c4400; cursor: not-allowed; opacity: 0.75; }
    .modal .btn-recharge:disabled { cursor: not-allowed; }
    .modal .btn-danger:hover { background: #fecaca; }
    .quota-row { background: #f8f9fb; border: 1px solid #e5e7eb; border-radius: 8px; padding: 10px 12px; font-size: 14px; color: #1e40af; margin-bottom: 16px; font-weight: 600; }
    .modal input[readonly] { background: #eef0f4; color: #8a94a6; cursor: default; }

    /* 思考中气泡（实时进度） */
    .msg .bubble.thinking { color: #666; font-size: 13px; }
    .thinking-spinner { display: inline-block; width: 14px; height: 14px; border: 2px solid #c7d2fe; border-top-color: #4d6bfe; border-radius: 50%; animation: spin 0.8s linear infinite; margin-right: 8px; vertical-align: -2px; }
    @keyframes spin { to { transform: rotate(360deg); } }
    /* 伪思考文字呼吸效果（2026-10-19 杨总指示）：透明度缓慢往复，像在"呼吸" */
    .think-text { animation: thinkBreath 1.8s ease-in-out infinite; }
    @keyframes thinkBreath { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }
    @keyframes pulse-stop { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.08); } }

    /* 消息元信息（token 消耗标注，2026-10-05 十四调并入 bubble-foot 行） */
    .msg-meta { font-size: 11px; color: #9ca3af; }
    /* 复制按钮：DeepSeek 式常显淡灰文字钮（hover 蓝，点击后绿） */
    .copy-btn { background: transparent; border: none; padding: 2px 8px; font-size: 11px; color: #9ca3af; cursor: pointer; border-radius: 6px; transition: color 0.15s, background 0.15s; }
    .copy-btn:hover { color: #4d6bfe; background: #f0f3ff; }
    .copy-btn.copied { color: #16a34a; }
    .copy-btn.copied:hover { color: #16a34a; background: #f0fdf4; }

    /* 载入动画 */
    .loading-dots::after { content: ''; animation: dots 1.5s steps(4, end) infinite; }
    @keyframes dots { 0%,20% { content: ''; } 40% { content: '.'; } 60% { content: '..'; } 80%,100% { content: '...'; } }
  