/* ====== Reset & Base ====== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent;touch-action:pan-x pan-y;height:100%}
/* 移动端（iOS Safari）滚动修复：
   仅靠 html/body 的 overflow:hidden 在 iOS 上不可靠，文档层仍可能截获手势，
   导致 .chat-area 这类内层滚动容器「滚轮能滚、手指划不动」。
   用 position:fixed 把 body 彻底锁死，文档层无溢出 → 手势才会交给内层滚动容器。 */
body{
  font-family:'Inter','-apple-system','BlinkMacSystemFont','Segoe UI',sans-serif;
  background:#f8f9fa;color:#374151;
  position:fixed;inset:0;width:100%;height:100%;overflow:hidden;margin:0;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  user-select:none;-webkit-user-select:none;
}
input,textarea,button{font-family:inherit;outline:none;border:none;background:none;color:inherit;touch-action:manipulation;-webkit-text-size-adjust:100%;max-height:999999px}
a{color:var(--accent);text-decoration:none}
::-webkit-scrollbar{width:6px;height:6px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:rgba(0,0,0,0.15);border-radius:99px;border:1px solid transparent;background-clip:content-box}
::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,0.25);border:1px solid transparent;background-clip:content-box}
/* Firefox 滚动条 */
*{scrollbar-width:thin;scrollbar-color:rgba(0,0,0,0.15) transparent}
/* ====== CSS Variables ====== */
:root{
  --bg-deep:#f8f9fa;--bg-surface:#ffffff;--bg-elevated:#f0f1f3;
  --bg-card:#ffffff;--bg-card-hover:#f3f4f6;
  --accent:#f59e0b;--accent-dim:#d97706;--accent-glow:rgba(245,158,11,0.12);
  /* 焦点环：对 #ffffff ≈5.0:1、对 #f3f4f6 ≈4.6:1（均 ≥3:1，且 ≥4.5:1） */
  --focus-ring:#b45309;
  --blue:#3b82f6;--green:#10b981;--red:#ef4444;
  --text-primary:#1f2937;--text-secondary:#6b7280;--text-muted:#7c8590;
  --border:#e5e7eb;--border-light:#f3f4f6;
  --radius-sm:8px;--radius-md:14px;--radius-lg:20px;--radius-xl:28px;
  --shadow-card:0 1px 3px rgba(0,0,0,0.08),0 1px 2px rgba(0,0,0,0.04);
  --font-mono:'JetBrains Mono','SF Mono','Fira Code',monospace;
  --safe-bottom:env(safe-area-inset-bottom,0px);

  /* 工具步骤状态图标：用遮罩描边着色，颜色随 currentColor 变化 */
  --icon-check:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
  --icon-x:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 6 6 18'/%3E%3Cpath d='m6 6 12 12'/%3E%3C/svg%3E");

  /* 环境光背景 */
  --ambient-1: rgba(245,158,11,0.18);
  --ambient-2: rgba(59,130,246,0.14);
  --ambient-3: rgba(16,185,129,0.12);

  /* 毛玻璃表面 */
  --glass-bg-subtle : rgba(255,255,255,0.38);
  --glass-bg        : rgba(255,255,255,0.55);
  --glass-bg-strong : rgba(255,255,255,0.72);
  --glass-border        : rgba(255,255,255,0.55);
  --glass-border-strong : rgba(255,255,255,0.85);
  --glass-blur       : 20px;
  --glass-blur-heavy : 32px;
  --glass-shadow: 0 8px 32px rgba(31,41,55,0.10), 0 1px 2px rgba(31,41,55,0.06), inset 0 1px 0 rgba(255,255,255,0.60);

  /* 层级标尺 */
  --z-app:1; --z-header:10; --z-bottom:400; --z-sheet:900; --z-overlay:1050; --z-menu:1100; --z-toast:1200;

  /* 语义别名（补齐此前未定义的引用） */
  --bg: var(--bg-deep);
  --bg-primary: var(--bg-deep);
  --bg-secondary: var(--bg-elevated);
  --bg-tertiary: var(--bg-elevated);
  --bg-muted: var(--bg-elevated);
  --bg-hover: var(--bg-card-hover);
  --bg-active: var(--bg-card-hover);
  --card-bg: var(--bg-card);
  --header-bg: var(--glass-bg-strong);
  --border-color: var(--border);
  --radius: var(--radius-md);
  --text: var(--text-primary);
  --accent-hover: var(--accent-dim);
}

/* ====== Noise Texture ====== */
body::before{
  content:'';position:fixed;inset:0;z-index:0;pointer-events:none;
  opacity:0.03;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:256px 256px;
}

/* ====== Ambient Background Layer ====== */
.ambient-bg{
  position:fixed;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(48rem 32rem at 12% 8%,  var(--ambient-1), transparent 60%),
    radial-gradient(42rem 30rem at 88% 18%, var(--ambient-2), transparent 62%),
    radial-gradient(40rem 34rem at 50% 98%, var(--ambient-3), transparent 65%),
    var(--bg-deep);
}

/* ====== App Shell ====== */
/* 定位交给 body（position:fixed），#app 自身只用 absolute + overflow:hidden：
   iOS 上「定位」与「滚动」不能落在同一个元素上，否则内层无法手指滚动。 */
#app{position:absolute;top:0;left:0;right:0;z-index:1;display:flex;flex-direction:column;height:100vh;height:100dvh;height:var(--app-h,100dvh);max-width:480px;margin:0 auto;width:100%;overflow:hidden}

/* ====== Glass Surface Base ====== */
.glass{
  background: var(--glass-bg);
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(160%);
  backdrop-filter: blur(var(--glass-blur)) saturate(160%);
  border: 1px solid var(--glass-border);
  box-shadow: var(--glass-shadow);
}

/* ====== Header ====== */
.header{
  padding:4px 12px;display:flex;align-items:center;gap:6px;
  border-bottom:1px solid var(--glass-border);background:var(--glass-bg-strong);
  -webkit-backdrop-filter:blur(var(--glass-blur)) saturate(160%);backdrop-filter:blur(var(--glass-blur)) saturate(160%);
  box-shadow:var(--glass-shadow);
  position:sticky;top:0;z-index:var(--z-header);flex-shrink:0;min-height:44px;overflow:hidden;
}
.header-title{font-size:14px;font-weight:600;display:flex;align-items:center;gap:6px;flex:1;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.header-mode-badge{
  display:inline-flex;align-items:center;justify-content:center;gap:2px;padding:2px 5px;border-radius:5px;
  cursor:pointer;transition:all 0.2s;font-size:10px;font-weight:600;flex-shrink:0;
  border:1px solid var(--border);background:var(--bg-surface);
  color:var(--text-secondary);
}
.header-mode-badge:active{transform:scale(0.92)}
.header-mode-badge svg{width:13px;height:13px}
.header-mode-badge .mode-arrow{font-size:7px;color:var(--text-muted);margin-left:0}
.header-mode-badge.office{color:var(--accent);border-color:rgba(245,158,11,0.3);background:var(--accent-glow)}
.header-mode-badge.code{color:#818cf8;border-color:rgba(99,102,241,0.3);background:rgba(99,102,241,0.1)}
.header-badge{
  font-size:9px;font-weight:700;padding:2px 6px;border-radius:4px;
  background:linear-gradient(135deg,var(--accent),#f97316);color:#fff;
  letter-spacing:0.5px;text-transform:uppercase;line-height:1.2;
}
.header-title .logo{
  width:28px;height:28px;border-radius:8px;background:linear-gradient(135deg,var(--accent),#f97316);
  display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;color:#fff;flex-shrink:0;
}
.header-actions{display:flex;gap:4px;flex-shrink:0;position:relative;z-index:100}
.header-btn{
  width:40px;height:40px;border-radius:8px;display:flex;align-items:center;justify-content:center;
  cursor:pointer;transition:all 0.2s;color:var(--text-secondary);font-size:16px;
  background:var(--bg-surface);border:1px solid var(--border);
}
.header-btn:active{transform:scale(0.92);background:var(--bg-card-hover)}
.header-btn.active{color:var(--accent);border-color:var(--accent);background:var(--accent-glow)}
.status-dot{width:6px;height:6px;border-radius:50%;display:inline-block;margin-left:6px}
.status-dot.online{background:var(--green);box-shadow:0 0 6px var(--green)}
.status-dot.offline{background:var(--text-muted)}
.status-dot.error{background:var(--red);box-shadow:0 0 6px var(--red)}
.status-dot.mock{background:var(--accent);box-shadow:0 0 6px var(--accent-glow)}

/* ====== More Menu ====== */
.header-more-btn{display:none}
.more-menu{
  position:fixed;top:0;left:0;right:0;bottom:0;
  background:rgba(0,0,0,0.5);z-index:var(--z-overlay);display:none;
}
.more-menu.open{display:block}
.more-menu-panel{
  position:absolute;top:52px;right:12px;
  background:var(--bg-elevated);border:1px solid var(--border-light);
  border-radius:var(--radius-lg);box-shadow:0 4px 20px rgba(0,0,0,0.12);
  min-width:180px;padding:6px;z-index:var(--z-menu);
  animation:menuIn 0.2s cubic-bezier(0.16,1,0.3,1);
}
@keyframes menuIn{from{opacity:0;transform:translateY(-6px) scale(0.96)}to{opacity:1;transform:translateY(0) scale(1)}}
.more-menu-item{
  display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:8px;
  cursor:pointer;font-size:14px;color:var(--text-primary);transition:all 0.15s;
}
.more-menu-item:hover{background:var(--bg-card-hover)}
.more-menu-item:active{transform:scale(0.97)}
.more-menu-item svg{width:18px;height:18px;color:var(--text-muted);flex-shrink:0}

/* 窄屏 Header 适配 */
@media(max-width:420px){
  .header{padding:6px 8px;gap:4px;min-height:40px}
  .header-title{font-size:13px;gap:4px}
  .header-title .logo{width:24px;height:24px;font-size:12px}
  .header-btn{width:28px;height:28px;font-size:14px;border-radius:6px}
  .header-actions{gap:3px}
  .header-mode-badge{font-size:9px;padding:1px 4px}
  .header-mode-badge svg{width:11px;height:11px}
  .header-user{font-size:11px!important}
  .header-user-btn{font-size:9px!important;padding:1px 4px!important}
}
@media(max-width:360px){
  .header-actions .header-btn#btnHistory,
  .header-actions .header-btn#btnBookmark,
  .header-actions .header-btn#btnSettings{display:none}
  .header-actions .header-more-btn,
  .header-actions .header-btn#btnNewSession,
  .header-actions .header-btn#btnHistory{display:flex}
}

@media(min-width:481px){
  .header-more-btn{display:flex!important}
}

/* ====== Chat Area ====== */
/* 滚动容器：position 为 static（与 body/#app 的定位分离），iOS 才会把手指手势交给它。
   不再设置 -webkit-overflow-scrolling / overscroll-behavior：前者在 iOS13+ 已无效，
   后者在部分 iOS 版本上会连内层滚动一起吃掉。 */
.chat-area{flex:1;overflow-y:auto;overflow-x:hidden;padding:16px 14px 8px;touch-action:pan-y;scrollbar-gutter:stable;scroll-behavior:smooth;min-height:0}
/* 移动端确保聊天区域可滚动 */
@media(hover:none)and(pointer:coarse){.chat-area{overflow-y:scroll}}
.chat-area:empty::after{
  content:'开始对话，AI 助手将协助您完成办公任务';display:flex;align-items:center;justify-content:center;
  height:100%;color:var(--text-muted);font-size:14px;text-align:center;padding:40px 20px;
}

/* ====== Message ====== */
.msg{max-width:88%;margin-bottom:16px;animation:msgIn 0.35s cubic-bezier(0.16,1,0.3,1);position:relative}
@keyframes msgIn{from{opacity:0;transform:translateY(12px) scale(0.97)}to{opacity:1;transform:translateY(0) scale(1)}}
.msg.user{margin-left:auto}
.msg.ai{margin-right:auto;max-width:75%}
.msg.user .msg-bubble{
  background:linear-gradient(135deg,var(--accent),var(--accent-dim));color:#fff;
  border-radius:18px;border-bottom-right-radius:22px;
  box-shadow:0 2px 12px var(--accent-glow);
  padding:12px 16px;
}
.msg.ai .msg-bubble{
  background:transparent;border:none;padding:0;
  border-radius:0;box-shadow:none;
}
.msg-label{font-size:10px;color:var(--text-muted);padding:0 0 8px;font-weight:500;letter-spacing:0.3px}
.msg.user .msg-label{text-align:right}
.msg.ai .msg-label{padding-left:0}
.msg:hover .msg-actions{opacity:1}
.msg-actions{opacity:0;transition:opacity 0.2s}
.msg.user .msg-actions{opacity:1}
.msg.ai .msg-actions{padding-left:0}

/* AI 消息纯文段布局 */
.msg.ai .ai-content{
  font-size:14px;line-height:1.7;color:var(--text-primary);
}

/* ====== Markdown Content ====== */
.msg-bubble p{margin:6px 0}
.msg-bubble p:first-child{margin-top:0}
.msg-bubble p:last-child{margin-bottom:0}
.msg-bubble ul,.msg-bubble ol{padding-left:20px;margin:6px 0}
/* AI 消息 Markdown 内容样式 */
.msg.ai .ai-content .content-wrapper,
.msg.ai .content-wrapper{font-size:14px;line-height:1.7;color:var(--text-primary)}
.msg.ai .ai-content .content-wrapper p,
.msg.ai .content-wrapper p{margin:10px 0}
.msg.ai .ai-content .content-wrapper p:first-child,
.msg.ai .content-wrapper p:first-child{margin-top:0}
.msg.ai .ai-content .content-wrapper p:last-child,
.msg.ai .content-wrapper p:last-child{margin-bottom:0}
.msg.ai .ai-content .content-wrapper ul,
.msg.ai .ai-content .content-wrapper ol,
.msg.ai .content-wrapper ul,
.msg.ai .content-wrapper ol{padding-left:20px;margin:10px 0}
.msg.ai .ai-content .content-wrapper h1,
.msg.ai .ai-content .content-wrapper h2,
.msg.ai .ai-content .content-wrapper h3,
.msg.ai .ai-content .content-wrapper h4,
.msg.ai .content-wrapper h1,
.msg.ai .content-wrapper h2,
.msg.ai .content-wrapper h3,
.msg.ai .content-wrapper h4{font-weight:600;margin:18px 0 10px;line-height:1.3}
.msg.ai .ai-content .content-wrapper h1,
.msg.ai .content-wrapper h1{font-size:18px;color:var(--accent)}
.msg.ai .ai-content .content-wrapper h2,
.msg.ai .content-wrapper h2{font-size:16px}
.msg.ai .ai-content .content-wrapper h3,
.msg.ai .content-wrapper h3{font-size:15px}
.msg.ai .ai-content .content-wrapper code,
.msg.ai .content-wrapper code{background:var(--bg-tertiary);padding:2px 5px;border-radius:4px;font-size:12.5px;font-family:var(--font-mono)}
.msg.ai .ai-content .content-wrapper pre,
.msg.ai .content-wrapper pre{background:var(--bg-elevated);border:1px solid var(--border);border-radius:8px;padding:12px;margin:12px 0;overflow-x:auto}
.msg.ai .ai-content .content-wrapper pre code,
.msg.ai .content-wrapper pre code{background:none;padding:0;font-size:12.5px;line-height:1.55}
.msg.ai .ai-content .content-wrapper blockquote,
.msg.ai .content-wrapper blockquote{border-left:3px solid var(--accent);padding-left:14px;color:var(--text-secondary);margin:12px 0}
.msg.ai .ai-content .content-wrapper table,
.msg.ai .content-wrapper table{border-collapse:collapse;margin:12px 0;font-size:13px;width:100%}
.msg.ai .ai-content .content-wrapper th,
.msg.ai .ai-content .content-wrapper td,
.msg.ai .content-wrapper th,
.msg.ai .content-wrapper td{border:1px solid var(--border);padding:8px 12px;text-align:left}
.msg.ai .ai-content .content-wrapper th,
.msg.ai .content-wrapper th{background:var(--bg-surface);font-weight:600}
.msg.ai .ai-content .content-wrapper a,
.msg.ai .content-wrapper a{color:var(--accent);text-decoration:underline}
.msg.ai .ai-content .content-wrapper img,
.msg.ai .content-wrapper img{max-width:100%;border-radius:var(--radius-sm);margin:10px 0}

/* ====== AI 提问卡片 ====== */
.ask-question-card{
  background:var(--bg-elevated);
  border:1px solid var(--border);
  border-radius:14px;
  padding:16px;
  margin-top:8px;
  max-width:100%;
}
.ask-question-header{
  display:flex;align-items:center;gap:8px;
  margin-bottom:12px;
  color:var(--accent);
  font-size:13px;
  font-weight:600;
}
.ask-question-header svg{opacity:0.9}
.ask-question-type{
  margin-left:auto;
  font-size:11px;
  font-weight:500;
  color:var(--text-muted);
  background:var(--bg-tertiary);
  padding:2px 8px;
  border-radius:10px;
}
.ask-question-title{
  font-size:15px;
  font-weight:600;
  color:var(--text-primary);
  margin-bottom:14px;
  line-height:1.4;
}
.ask-question-options{
  display:flex;flex-direction:column;gap:8px;
  margin-bottom:16px;
}
.ask-question-option{
  display:flex;align-items:center;gap:10px;
  padding:12px 14px;
  background:var(--bg-card);
  border:1.5px solid var(--border);
  border-radius:10px;
  cursor:pointer;
  transition:all 0.15s;
  text-align:left;
  font-size:14px;
  color:var(--text-primary);
  font-family:inherit;
}
.ask-question-option:hover{
  border-color:var(--accent);
  background:rgba(99,102,241,0.05);
}
.ask-question-option.selected{
  border-color:var(--accent);
  background:rgba(99,102,241,0.1);
}
.ask-question-option .opt-indicator{
  width:18px;height:18px;
  border:2px solid var(--text-muted);
  border-radius:50%;
  flex-shrink:0;
  transition:all 0.15s;
}
.ask-question-option.multi .opt-indicator{border-radius:4px}
.ask-question-option.selected .opt-indicator{
  background:var(--accent);
  border-color:var(--accent);
}
.ask-question-option.selected .opt-indicator::after{
  content:'';
  width:8px;height:8px;
  border-radius:50%;
  background:#fff;
  display:block;
  margin:3px;
}
.ask-question-option.multi.selected .opt-indicator::after{
  border-radius:2px;
  clip-path:polygon(14% 44%,0 65%,50% 100%,100% 16%,80% 0%,43% 62%);
  background:#fff;
}
.ask-question-option .opt-text{flex:1}
.ask-question-submit{
  width:100%;
  padding:12px;
  background:var(--accent);
  color:#fff;
  border:none;
  border-radius:10px;
  font-size:14px;
  font-weight:600;
  cursor:pointer;
  transition:all 0.15s;
  font-family:inherit;
}
.ask-question-submit:disabled{opacity:0.4;cursor:not-allowed}
.ask-question-submit:not(:disabled):hover{background:var(--accent-dim)}
.ask-question-submit:not(:disabled):active{transform:scale(0.98)}
.ask-question-answered-header{
  display:flex;align-items:center;gap:6px;
  font-size:12px;
  color:var(--text-muted);
  margin-bottom:8px;
  padding-left:2px;
}
.ask-question-answered-header svg{color:var(--accent)}
.ask-question-answer-toggle{
  background:transparent;
  border:1px solid var(--border-light);
  border-radius:8px;
  overflow:hidden;
}
.ask-question-answer-summary{
  display:flex;align-items:center;gap:6px;
  padding:8px 12px;
  font-size:12px;
  color:var(--text-muted);
  cursor:pointer;
  user-select:none;
  list-style:none;
}
.ask-question-answer-summary::-webkit-details-marker{display:none}
.ask-question-answer-summary::marker{display:none;content:''}
.ask-question-answer-summary svg{transition:transform 0.2s;opacity:0.5}
.ask-question-answer-toggle[open] .ask-question-answer-summary svg{transform:rotate(90deg)}
.ask-question-answer-content{
  padding:8px 12px;
  font-size:13px;
  color:var(--text-secondary);
  border-top:1px solid var(--border-light);
}

/* ====== Message Tags ====== */
.msg-tags{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:6px}
.msg-tag{
  display:inline-flex;align-items:center;gap:3px;padding:1px 6px 1px 5px;
  border-radius:4px;font-size:11px;font-weight:500;line-height:1.5;
}
/* 用户气泡为琥珀底色，标签改用不透明浅底 + 深琥珀文字，保证对比度 ≈8:1 */
.msg.user .msg-tag.file-tag{background:rgba(255,255,255,0.92);color:#7c3a00}
.msg.user .msg-tag.skill-tag{background:rgba(255,255,255,0.92);color:#7c3a00}
.msg-tag svg{flex-shrink:0;width:12px;height:12px}
/* ====== 工具调用步骤：中性卡片，仅用状态色点缀 ====== */
.msg.tool{margin:3px 0;max-width:100%}
.msg.tool .msg-bubble{
  background:var(--bg-elevated);border:1px solid var(--border-light);border-radius:8px;
  padding:8px 10px;font-size:11.5px;font-family:inherit;color:var(--text-muted);line-height:1.4;
  box-shadow:none;
  transition:border-color .18s,box-shadow .18s,background .18s;
}
.msg.tool .msg-bubble:hover{border-color:var(--border);box-shadow:none}
/* 执行中：淡琥珀微光，完成/失败回到中性色 */
.msg.tool .msg-bubble[data-status="running"]{border-color:rgba(245,158,11,0.3);background:linear-gradient(180deg,rgba(245,158,11,0.05),rgba(245,158,11,0.01))}
.msg.tool .msg-bubble[data-status="error"]{border-color:rgba(239,68,68,0.2);background:rgba(239,68,68,0.01)}
/* 头部：状态圆点 + 图标 + 名称 + 参数 + 折叠箭头 */
.tool-header{display:flex;align-items:center;gap:8px;cursor:pointer;user-select:none;background:none;border-radius:0;margin-bottom:0;min-height:20px;color:var(--text-secondary);font-weight:500;font-size:12px}
.tool-header:active{opacity:.65}
.tool-icon{display:inline-flex;flex-shrink:0}
.tool-icon svg{width:13px;height:13px;color:var(--text-muted)}
.tool-label{color:var(--text-secondary);font-weight:500;white-space:nowrap;flex-shrink:0}
.tool-status{width:14px;height:14px;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;border-radius:50%}
.tool-bubble[data-status="running"] .tool-status{border:2px solid rgba(245,158,11,0.25);border-top-color:var(--accent);animation:spin .8s linear infinite}
.tool-bubble[data-status="done"] .tool-status{color:var(--green);background:rgba(16,185,129,0.1)}
.tool-bubble[data-status="error"] .tool-status{color:var(--red);background:rgba(239,68,68,0.1)}
.tool-bubble[data-status="done"] .tool-status::before,
.tool-bubble[data-status="error"] .tool-status::before{content:'';width:8px;height:8px;background:currentColor}
.tool-bubble[data-status="done"] .tool-status::before{-webkit-mask:var(--icon-check) center/contain no-repeat;mask:var(--icon-check) center/contain no-repeat}
.tool-bubble[data-status="error"] .tool-status::before{-webkit-mask:var(--icon-x) center/contain no-repeat;mask:var(--icon-x) center/contain no-repeat}
.tool-args{color:var(--text-muted);font-weight:400;font-size:11px;font-family:var(--font-mono);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tool-chevron{width:12px;height:12px;flex-shrink:0;color:var(--text-muted);transition:transform .2s ease}
.tool-bubble.tool-open .tool-chevron{transform:rotate(90deg)}
.tool-bubble[data-expandable="0"] .tool-chevron{visibility:hidden}
.tool-bubble[data-expandable="0"] .tool-header{cursor:default}
.tool-summary{padding-top:6px;font-size:11.5px;color:var(--text-muted);font-family:inherit;line-height:1.5}
.tool-result{white-space:pre-wrap;word-break:break-word;max-height:280px;overflow-y:auto;font-family:var(--font-mono);font-size:11px;line-height:1.5;color:var(--text-muted);padding:8px 10px;background:var(--bg-elevated);border:1px solid var(--border-light);border-radius:6px;margin-top:6px}
.tool-preview-link{padding:6px 0 4px}
.tool-preview-link a{display:inline-flex;align-items:center;gap:5px;padding:6px 14px;border-radius:8px;font-size:13px;font-weight:600;color:#fff;background:linear-gradient(135deg,var(--accent),#f97316);text-decoration:none;transition:all .2s;font-family:Inter,sans-serif}
.tool-preview-link a:active{transform:scale(.96);opacity:.85}
/* 子智能体卡片 */
.agent-cards-container{display:flex;flex-wrap:wrap;gap:8px;padding:4px 0}
.agent-card{flex:1;min-width:180px;max-width:100%;background:#1e1e2e;border:1px solid rgba(255,255,255,0.08);border-radius:10px;overflow:hidden}
.agent-card-header{display:flex;align-items:center;gap:6px;padding:8px 10px;background:#181825;border-bottom:1px solid rgba(255,255,255,0.06);font-size:12px}
.agent-card-name{font-weight:600;color:#cdd6f4}
.agent-card-role{margin-left:auto;font-size:10px;color:#6c7086;background:rgba(255,255,255,0.05);padding:1px 6px;border-radius:4px}
.agent-card-body{padding:8px 10px;font-size:12px;color:#a6adc8;line-height:1.5;max-height:80px;overflow:hidden;white-space:pre-wrap;word-break:break-all}
.agent-card-error{border-color:rgba(243,139,168,0.3)}
.agent-card-loading .agent-card-body{display:flex;align-items:center;gap:6px;color:#6c7086}
.agent-card-loading .agent-spinner{width:12px;height:12px;border:2px solid rgba(255,255,255,0.1);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite;flex-shrink:0}
.agent-card-loading .agent-card-status{font-size:11px}
.agent-summary{font-size:11px;color:#6c7086;padding:2px 0}
/* ====== 工具分组样式 ====== */
.tool-group .tool-group-header{display:flex;align-items:center;gap:6px;cursor:pointer;user-select:none;padding:2px 0;font-size:11.5px;color:var(--text-muted)}
.tool-group .tool-group-header:active{opacity:.7}
.tool-group .tool-count{background:rgba(0,0,0,0.05);color:var(--text-muted);border-radius:8px;padding:0 6px;font-size:10px;font-weight:500;line-height:16px}
.tool-group .tool-group-body{padding-top:4px;margin-top:4px;border-top:1px solid var(--border-light)}
.tool-group .tool-group-item{display:flex;align-items:center;gap:8px;padding:2px 0;font-size:11px;line-height:1.4}
.tool-group .tool-group-item svg{width:12px;height:12px;flex-shrink:0;color:var(--text-muted)}
.tool-group .tool-summary-inline{color:var(--text-muted);font-size:10px;margin-left:auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:200px}
/* ====== 沙箱终端输出块 ====== */
.term-block{border-radius:6px;overflow:hidden;border:1px solid var(--border-light);background:var(--bg-elevated);margin:4px 0;font-family:var(--font-mono);font-size:12px;line-height:1.5}
.term-block-loading{opacity:.8}
.term-header{display:flex;align-items:center;gap:6px;padding:6px 10px;background:rgba(0,0,0,0.02);color:var(--text-secondary);font-size:11px;font-weight:500;border-bottom:1px solid var(--border-light);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.term-header svg{flex-shrink:0;color:var(--text-muted)}
.term-body{padding:8px 0}
.term-line{padding:1px 10px;color:var(--text-secondary);white-space:pre-wrap;word-break:break-all}
.term-line+.term-line{margin-top:0}
.term-stderr{color:var(--red)}
.term-error{padding:8px 12px;color:#f7768e;background:rgba(247,118,142,.1);font-weight:600}
.term-loading{color:#565f89;font-style:italic}
.term-exit{padding:6px 12px 4px;border-top:1px solid rgba(255,255,255,.05);margin-top:4px;font-size:11px}
.term-exit-ok{color:#9ece6a}
.term-exit-err{color:#f7768e}
/* ====== 消息操作栏 ====== */
.msg-actions{display:flex;align-items:center;gap:4px;margin-top:8px;padding-top:6px;border-top:1px solid var(--border)}
.msg-action-btn{width:28px;height:28px;border-radius:6px;display:flex;align-items:center;justify-content:center;color:var(--text-muted);cursor:pointer;transition:all .15s;background:transparent}
.msg-action-btn:hover{background:var(--bg-card);color:var(--text-secondary)}
.msg-action-btn:active{transform:scale(.9)}
.msg-preview-link{display:inline-flex;align-items:center;gap:4px;margin-left:auto;padding:4px 10px;border-radius:6px;font-size:12px;font-weight:600;color:var(--accent);text-decoration:none;cursor:pointer;transition:all .15s}
.msg-preview-link:hover{background:var(--accent-glow)}
/* ====== 旋转动画 ====== */
.spin{animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.msg-bubble li{margin:2px 0}
.msg-bubble h1,.msg-bubble h2,.msg-bubble h3,.msg-bubble h4{font-weight:600;margin:12px 0 6px;line-height:1.3}
.msg-bubble h1{font-size:17px;color:var(--accent)}
.msg-bubble h2{font-size:15px}
.msg-bubble h3{font-size:14px}
.msg-bubble code{
  font-family:var(--font-mono);font-size:13px;background:rgba(255,255,255,0.06);padding:2px 6px;
  border-radius:4px;word-break:break-all;
}
.code-block-container{margin:8px 0;border-radius:8px;overflow:hidden;background:#1e1e2e;border:1px solid rgba(255,255,255,0.08)}
.code-block-header{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;background:rgba(0,0,0,0.3);border-bottom:1px solid rgba(255,255,255,0.06)}
.lang-label{font-size:11px;font-weight:600;color:#89ddff;font-family:var(--font-mono);text-transform:lowercase}
.code-block-header-actions{display:flex;align-items:center;gap:8px}
.code-copy-btn,.code-run-btn{display:inline-flex;align-items:center;gap:4px;padding:4px 8px;border:none;border-radius:4px;cursor:pointer;font-size:11px;font-family:inherit;transition:all .15s}
.code-copy-btn{background:rgba(255,255,255,0.06);color:#a6adc8}
.code-copy-btn:hover{background:rgba(255,255,255,0.12);color:#fff}
.code-copy-btn.copied{background:rgba(52,211,153,0.15);color:#34d399}
.code-run-btn{background:rgba(99,102,241,0.15);color:#818cf8}
.code-run-btn:hover{background:rgba(99,102,241,0.25)}
.code-block-body{display:flex;overflow:hidden}
.code-line-numbers{display:flex;flex-direction:column;padding:12px 0;background:rgba(0,0,0,0.2);border-right:1px solid rgba(255,255,255,0.06);user-select:none;text-align:right}
.code-line-number{display:block;padding:0 10px;font-family:var(--font-mono);font-size:12px;line-height:1.55;color:#4a4a6a;min-width:36px}
.code-block-body code{flex:1;margin:0;padding:12px 14px;background:none;border:none;border-radius:0;font-size:12.5px;line-height:1.55;color:#cdd6f4;overflow-x:auto;white-space:pre}
.code-output{margin:0;border-top:1px solid rgba(255,255,255,0.06);padding:10px 12px;background:rgba(0,0,0,0.2);font-size:12px}
.code-output-loading{color:#89b4fa}
.code-output-header{font-weight:600;color:#cdd6f4;margin-bottom:4px}
.code-output-stdout{color:#a6e3a4;white-space:pre-wrap;word-break:break-all}
.code-output-stderr{color:#f38ba8;white-space:pre-wrap;word-break:break-all}
.code-output-exitcode{color:#6c7086;margin-top:4px;font-size:11px}
.code-output-error{color:#f38ba8}
.code-output-empty{color:#6c7086}
.code-expand-btn{display:flex;align-items:center;justify-content:center;gap:4px;padding:8px;background:rgba(0,0,0,0.3);border-top:1px solid rgba(255,255,255,0.06);cursor:pointer;font-size:12px;color:#89b4fa;transition:all .15s}
.code-expand-btn:hover{background:rgba(0,0,0,0.5);color:#b4befe}
.code-collapsed{max-height:400px;overflow:hidden}
.msg-bubble pre{
  margin:8px 0;border-radius:var(--radius-sm);overflow-x:auto;
  background:var(--bg-elevated);border:1px solid var(--border);
}
.msg-bubble pre code{display:block;padding:12px 14px;background:none;font-size:12.5px;line-height:1.55;color:var(--text-primary)}
.msg-bubble blockquote{
  border-left:3px solid var(--accent);padding:4px 0 4px 12px;margin:8px 0;
  color:var(--text-secondary);background:rgba(245,158,11,0.04);border-radius:0 4px 4px 0;
}
.msg-bubble table{border-collapse:collapse;margin:8px 0;font-size:13px;width:100%}
.msg-bubble th,.msg-bubble td{border:1px solid var(--border);padding:6px 10px;text-align:left}
.msg-bubble th{background:var(--bg-surface);font-weight:600}
.msg-bubble hr{margin:12px 0;border:none;border-top:1px solid var(--border)}
.msg-bubble a{color:var(--blue);text-decoration:underline}
.msg-bubble strong{font-weight:600}
.msg-bubble img{max-width:100%;border-radius:var(--radius-sm);margin:6px 0}
.msg-bubble del{color:var(--text-muted);text-decoration:line-through}
.msg-bubble .katex{font-size:1.05em;color:var(--text-primary)}

/* ====== AI Question UI ====== */
.question-card{margin:10px 0;background:var(--bg-elevated);border:1px solid var(--border-light);border-radius:10px;padding:14px 16px;box-shadow:0 2px 8px rgba(0,0,0,0.15)}
.question-title{font-size:14px;font-weight:600;color:var(--text-primary);margin-bottom:10px;line-height:1.4}
.question-options{display:flex;flex-direction:column;gap:6px}
.question-option{display:flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid var(--border);border-radius:8px;cursor:pointer;transition:all 0.15s;background:var(--bg-card)}
.question-option:hover{border-color:var(--accent);background:rgba(99,102,241,0.05)}
.question-option.selected{border-color:var(--accent);background:rgba(99,102,241,0.1)}
.question-option .q-check{width:16px;height:16px;border:2px solid var(--text-muted);border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all 0.15s}
.question-option.multi .q-check{border-radius:3px}
.question-option .q-check.checked{background:var(--accent);border-color:var(--accent)}
.question-option .q-check.checked::after{content:'';width:6px;height:6px;background:#fff;border-radius:50%}
.question-option.multi .q-check.checked::after{border-radius:1px;width:8px;height:8px;clip-path:polygon(14% 44%,0 65%,50% 100%,100% 16%,80% 0%,43% 62%)}
.question-option-text{font-size:13px;color:var(--text-primary);flex:1}
.question-other-input{display:none;margin-top:6px;padding:8px 12px;border:1px solid var(--border);border-radius:8px;background:var(--bg-tertiary);color:var(--text-primary);font-size:16px;width:100%;resize:none;min-height:36px;font-family:inherit}
.question-other-input.visible{display:block}
.question-actions{display:flex;gap:8px;margin-top:10px}
.question-btn-confirm{flex:1;padding:8px 0;border:none;border-radius:8px;background:var(--accent);color:#fff;font-size:13px;font-weight:500;cursor:pointer;transition:opacity 0.15s}
.question-btn-confirm:disabled{opacity:0.4;cursor:not-allowed}
.question-btn-confirm:not(:disabled):hover{opacity:0.9}
.question-btn-skip{padding:8px 14px;border:1px solid var(--border);border-radius:8px;background:transparent;color:var(--text-muted);font-size:13px;cursor:pointer;transition:all 0.15s}
.question-btn-skip:hover{background:var(--bg-card);color:var(--text-primary)}
.question-badge{display:inline-block;font-size:11px;padding:2px 7px;border-radius:4px;background:rgba(99,102,241,0.1);color:var(--accent);margin-bottom:8px;font-weight:500}

/* ====== AI 提问弹窗 ====== */
.question-modal{max-width:440px;max-height:80dvh;width:92%}
.question-modal .modal-body{padding:0 20px 20px}
.question-modal-title{font-size:15px;font-weight:600;color:var(--text-primary);margin:0 0 6px;line-height:1.4}
.question-modal-desc{font-size:13px;color:var(--text-muted);margin:0 0 16px;line-height:1.4}
.question-modal-options{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}
.question-modal-option{display:flex;align-items:center;gap:10px;padding:10px 14px;border:1.5px solid var(--border);border-radius:10px;cursor:pointer;transition:all 0.15s;background:var(--bg-card);-webkit-tap-highlight-color:transparent}
.question-modal-option:active{transform:scale(0.98)}
.question-modal-option:hover{border-color:var(--accent);background:rgba(99,102,241,0.04)}
.question-modal-option.selected{border-color:var(--accent);background:rgba(99,102,241,0.08)}
.question-modal-option .q-radio{width:18px;height:18px;border:2px solid var(--text-muted);border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all 0.15s}
.question-modal-option.multi .q-radio{border-radius:4px}
.question-modal-option .q-radio.checked{background:var(--accent);border-color:var(--accent)}
.question-modal-option .q-radio.checked::after{content:'';width:8px;height:8px;border-radius:50%;background:#fff}
.question-modal-option.multi .q-radio.checked::after{border-radius:2px;width:10px;height:10px;clip-path:polygon(14% 44%,0 65%,50% 100%,100% 16%,80% 0%,43% 62%)}
.question-modal-option-text{font-size:14px;color:var(--text-primary);flex:1}
.question-modal-other{margin-bottom:16px}
.question-modal-other textarea{width:100%;padding:10px 14px;border:1.5px solid var(--border);border-radius:10px;background:var(--bg-tertiary);color:var(--text-primary);font-size:16px;resize:none;min-height:40px;font-family:inherit;box-sizing:border-box;transition:border-color 0.15s}
.question-modal-other textarea:focus{outline:none;border-color:var(--accent)}
.question-modal-actions{display:flex;gap:10px}
.question-modal-btn{flex:1;padding:11px 0;border:none;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;transition:all 0.15s;text-align:center}
.question-modal-btn.primary{background:var(--accent);color:#fff}
.question-modal-btn.primary:disabled{opacity:0.4;cursor:not-allowed}
.question-modal-btn.primary:not(:disabled):active{transform:scale(0.97)}
.question-modal-btn.secondary{flex:0;padding:11px 18px;background:transparent;border:1.5px solid var(--border);color:var(--text-muted)}
.msg-bubble .katex-display{margin:12px 0;overflow-x:auto;overflow-y:hidden;padding:4px 0;background:rgba(255,255,255,0.02);border-radius:6px;text-align:center}
.msg-bubble .math-error{color:#f87171;font-size:0.85em;padding:2px 6px;background:rgba(248,113,113,0.1);border-radius:4px;word-break:break-all}

/* ====== Typing Indicator ====== */
.typing{display:flex;align-items:center;gap:4px;padding:12px 16px}
.typing-dot{width:6px;height:6px;border-radius:50%;background:var(--text-muted);animation:typingBounce 1.2s infinite}
.typing-dot:nth-child(2){animation-delay:0.2s}
.typing-dot:nth-child(3){animation-delay:0.4s}
@keyframes typingBounce{0%,60%,100%{transform:translateY(0)}30%{transform:translateY(-6px)}}

/* ====== Input Area ====== */
.input-area{
  padding:8px 14px calc(8px + var(--safe-bottom));flex-shrink:0;
  background:rgba(255,255,255,0.9);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);
  border-top:1px solid var(--border);
}
.queue-status-bar{
  display:flex;align-items:center;justify-content:space-between;
  padding:8px 12px;margin-bottom:6px;border-radius:8px;
  background:linear-gradient(135deg,var(--accent),#f97316);color:#fff;
  font-size:12px;animation:queueSlideIn 0.3s cubic-bezier(0.16,1,0.3,1);
}
@keyframes queueSlideIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
.queue-status-info{display:flex;align-items:center;gap:6px}
.queue-icon{animation:queueSpin 1.5s linear infinite}
@keyframes queueSpin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
.queue-status-text{font-size:12px}
.queue-cancel-btn{
  padding:4px 10px;border-radius:4px;border:none;
  background:rgba(255,255,255,0.2);color:#fff;
  font-size:11px;cursor:pointer;transition:background 0.15s;
}
.queue-cancel-btn:hover{background:rgba(255,255,255,0.35)}
.input-wrapper{
  display:flex;flex-direction:column;gap:0;background:var(--bg-surface);
  border:1px solid var(--border);border-radius:var(--radius-lg);padding:4px 4px 4px 4px;
  transition:border-color 0.2s,box-shadow 0.2s;position:relative;
}
.input-wrapper:focus-within{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-glow)}
.input-row{display:flex;align-items:flex-end;gap:6px;width:100%}
.input-area textarea{
  flex:1;resize:none;padding:8px 0;font-size:16px;line-height:1.5;max-height:120px;min-height:40px;
  background:transparent;color:var(--text-primary);
}
.input-area textarea::placeholder{color:var(--text-muted)}
.agent-selector select{
  font-size:11px;padding:2px 6px;border:1px solid var(--border);border-radius:6px;background:var(--bg-card);color:var(--text-muted);cursor:pointer;max-width:120px;white-space:nowrap;text-overflow:ellipsis;
}
.agent-selector select:focus{outline:none;border-color:var(--accent);color:var(--text-primary)}
.agent-selector{display:inline-flex;align-items:center;margin-left:6px}
.agent-selector-btn{display:flex;align-items:center;gap:4px;padding:3px 8px;border:1px solid var(--border);border-radius:6px;background:var(--bg-card);color:var(--text-muted);font-size:11px;cursor:pointer;white-space:nowrap;transition:all .15s}
.agent-selector-btn:hover{border-color:var(--accent);color:var(--text-primary)}
.agent-sheet{max-height:65dvh;min-height:40dvh;overflow:hidden;display:flex;flex-direction:column}
.agent-sheet .agent-sheet-list{padding:2px 8px 16px;overflow-y:auto;flex:1;min-height:0}
.agent-sheet-item{display:flex;align-items:flex-start;gap:10px;padding:10px 12px;cursor:pointer;transition:all .12s;border-radius:8px;margin-bottom:2px}
.agent-sheet-item:active{transform:scale(.98)}
.agent-sheet-item:hover{background:var(--bg-tertiary)}
.agent-sheet-item.active{background:var(--bg-tertiary);color:var(--accent)}
.agent-sheet-item .agent-item-icon{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:14px}
.agent-sheet-item .agent-item-icon.system{background:var(--accent);color:#fff}
.agent-sheet-item .agent-item-icon.user{background:var(--bg-tertiary);color:var(--text-muted)}
.agent-sheet-item .agent-item-info{flex:1;min-width:0}
.agent-sheet-item .agent-item-name{font-size:13px;font-weight:500;color:var(--text-primary);line-height:1.3}
.agent-sheet-item .agent-item-desc{font-size:11px;color:var(--text-muted);line-height:1.3;margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.agent-sheet-item .agent-item-type{font-size:10px;padding:1px 6px;border-radius:4px;margin-left:6px;flex-shrink:0}
.agent-sheet-item .agent-item-type.system{background:var(--accent);color:#fff;opacity:0.7}
.agent-sheet-item .agent-item-type.user{background:var(--bg-tertiary);color:var(--text-muted)}
.send-btn{
  width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  background:var(--accent);color:#fff;font-size:18px;cursor:pointer;transition:all 0.2s;flex-shrink:0;
}
.send-btn:active{transform:scale(0.9)}
.send-btn:disabled{opacity:0.3;cursor:not-allowed;transform:none}
.stop-btn{
  width:40px;height:40px;border-radius:12px;display:none;align-items:center;justify-content:center;
  background:#e74c3c;color:#fff;font-size:14px;cursor:pointer;transition:all 0.2s;flex-shrink:0;border:none;
  font-weight:600;gap:4px;
}
.stop-btn:active{transform:scale(0.9)}
.stop-btn.show{display:flex}
.input-clear-btn{
  width:28px;height:28px;border-radius:50%;background:var(--bg-elevated);color:var(--text-muted);
  display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;
  border:none;transition:all 0.15s;
}
.input-clear-btn:hover{background:var(--bg-card-hover);color:var(--text-secondary)}
.input-clear-btn:active{transform:scale(0.9)}
.upload-btn{
  width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  background:var(--bg-elevated);color:var(--text-muted);cursor:pointer;transition:all 0.2s;flex-shrink:0;
  border:none;
}
.upload-btn:hover{background:var(--bg-card-hover);color:var(--accent)}
.upload-btn:active{transform:scale(0.9)}
.input-attachments{
  display:flex;flex-wrap:wrap;gap:6px;padding:6px 0;max-height:120px;overflow-y:auto;
}
.input-image-preview{
  position:relative;width:52px;height:52px;border-radius:8px;overflow:hidden;
  background:var(--bg-elevated);border:1px solid var(--border);flex-shrink:0;
}
.input-image-preview img{
  width:100%;height:100%;object-fit:cover;
}
.input-image-remove{
  position:absolute;top:2px;right:2px;width:18px;height:18px;border-radius:50%;
  background:rgba(0,0,0,0.6);color:#fff;border:none;cursor:pointer;display:flex;
  align-items:center;justify-content:center;opacity:0;transition:opacity 0.15s;padding:0;
}
.input-image-preview:hover .input-image-remove{opacity:1}
.input-file-preview{
  display:flex;align-items:center;gap:6px;padding:4px 8px;border-radius:6px;
  background:var(--bg-elevated);border:1px solid var(--border);max-width:160px;
}
.input-file-preview .file-preview-icon{color:var(--text-muted);flex-shrink:0}
.input-file-preview .file-preview-name{
  font-size:11px;color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;
  white-space:nowrap;max-width:80px;
}
.input-file-preview .file-preview-size{
  font-size:10px;color:var(--text-muted);flex-shrink:0;
}
.input-tools{display:flex;gap:4px;padding:4px 0;align-items:center}

/* ====== Message Attachments ====== */
.msg-attachments{
  display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px;
}
.msg-attachment-image{
  width:60px;height:60px;border-radius:6px;overflow:hidden;border:1px solid var(--border);
  cursor:pointer;
}
.msg-attachment-image img{
  width:100%;height:100%;object-fit:cover;transition:transform 0.15s;
}
.msg-attachment-image:hover img{transform:scale(1.05)}
.msg-attachment-file{
  display:flex;align-items:center;gap:4px;padding:4px 8px;border-radius:4px;
  background:var(--bg-tertiary);font-size:11px;color:var(--text-secondary);
}
.msg-attachment-file svg{color:var(--text-muted)}

/* ====== 文件变更审批条 ====== */
.change-bar{display:none;align-items:stretch;margin:0 0 4px 0;border-radius:8px;overflow:hidden;border:1px solid rgba(245,158,11,0.25);background:rgba(245,158,11,0.06);min-height:28px;font-size:12px;transition:all 0.2s}
/* Git 面板 */
.git-tab-btn{background:none;border:none;color:var(--text-muted);font-size:10px;font-weight:500;padding:2px 6px;border-radius:4px;cursor:pointer;transition:all 0.15s;text-transform:uppercase;letter-spacing:0.5px;line-height:1}
.git-tab-btn:hover{color:var(--accent);background:rgba(99,102,241,0.1)}
.git-tab-btn.active{color:var(--accent);background:rgba(99,102,241,0.15)}
.git-overlay{position:fixed;inset:0;z-index:calc(var(--z-overlay) + 10);height:100dvh;background:rgba(0,0,0,0.85);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;flex-direction:column}
.git-overlay-panel{background:var(--glass-bg);border:none;border-radius:0;width:100%;display:flex;flex:1;flex-direction:column;overflow:hidden;font-size:12px}
.git-panel-header{display:flex;align-items:center;gap:8px;padding:8px 16px;border-bottom:1px solid var(--border);flex-shrink:0}
.git-panel-body{flex:1;display:flex;overflow:hidden}
.git-panel-left{flex:1;display:flex;flex-direction:column;overflow-y:auto;border-right:1px solid var(--border);min-width:0;min-height:0}
.git-panel-right{flex:1;display:flex;flex-direction:column;overflow-y:auto;min-width:0;min-height:0}
.git-panel-left .git-section:last-child,.git-panel-right .git-section:last-child{border-bottom:none}
@media(max-width:480px){.git-panel-body{flex-direction:column}.git-panel-left{border-right:none;border-bottom:1px solid var(--border)}.git-panel-left,.git-panel-right{flex:none;overflow-y:auto;max-height:50vh}}
.git-panel-header .git-btn{padding:3px 8px;border-radius:4px;border:none;background:rgba(99,102,241,0.1);color:var(--accent);cursor:pointer;font-size:11px;transition:background 0.15s}
.git-panel-header .git-btn:hover{background:rgba(99,102,241,0.2)}
.git-panel-header .git-btn:disabled{opacity:0.5;cursor:not-allowed}
.git-section{padding:8px 16px;border-bottom:1px solid var(--border)}
.git-section:last-child{border-bottom:none}
.git-section-title{font-size:11px;font-weight:600;color:var(--text-muted);margin-bottom:6px;text-transform:uppercase;letter-spacing:0.5px}
.git-change-item{display:flex;align-items:center;gap:4px;padding:3px 0;font-size:11px;color:var(--text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.git-change-item .status-badge{display:inline-block;width:14px;height:14px;border-radius:3px;text-align:center;line-height:14px;font-size:9px;font-weight:700;flex-shrink:0}
.git-change-item .status-badge.staged{background:rgba(52,211,153,0.15);color:#34d399}
.git-change-item .status-badge.modified{background:rgba(250,204,21,0.15);color:#eab308}
.git-change-item .status-badge.new{background:rgba(96,165,250,0.15);color:#60a5fa}
.git-change-item .status-badge.deleted{background:rgba(248,113,113,0.15);color:#f87171}
.git-commit-item{display:flex;align-items:flex-start;gap:6px;padding:4px 0;border-bottom:1px solid rgba(99,102,241,0.06);font-size:11px}
.git-commit-item:last-child{border-bottom:none}
.git-commit-hash{font-family:var(--font-mono);color:var(--text-muted);font-size:10px;flex-shrink:0;width:40px}
.git-commit-msg{color:var(--text-primary);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.git-commit-time{color:var(--text-muted);font-size:10px;flex-shrink:0}
.git-branch-item{display:flex;align-items:center;gap:6px;padding:3px 6px;margin:2px 0;border-radius:4px;cursor:pointer;font-size:11px;color:var(--text-secondary);transition:background 0.15s}
.git-branch-item:hover{background:rgba(99,102,241,0.08)}
.git-branch-item.current{background:rgba(99,102,241,0.12);color:var(--accent);font-weight:600}
.git-branch-item .branch-current-mark{color:var(--accent);font-size:10px;flex-shrink:0}
/* ====== 分支管理增强 ====== */
.git-merge-overlay{position:fixed;inset:0;z-index:var(--z-overlay);background:rgba(0,0,0,0.5);display:flex;align-items:center;justify-content:center}
.git-merge-dialog{background:var(--glass-bg-strong);border:1px solid var(--glass-border);border-radius:12px;width:480px;max-width:90vw;display:flex;flex-direction:column;box-shadow:var(--glass-shadow)}
.git-merge-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--border)}
.git-merge-title{font-size:14px;font-weight:600;color:var(--text-primary)}
.git-merge-close{background:none;border:none;color:var(--text-muted);font-size:16px;cursor:pointer;padding:2px 6px;border-radius:4px}
.git-merge-close:hover{background:var(--bg-card-hover);color:var(--text-primary)}
.git-merge-body{padding:16px}
.git-merge-info{font-size:12px;color:var(--text-muted);margin-bottom:12px}
.git-merge-info strong{color:var(--text-primary)}
.git-merge-field{margin-bottom:12px}
.git-merge-field label{display:block;font-size:12px;color:var(--text-muted);margin-bottom:4px}
.git-merge-select{width:100%;padding:6px 10px;background:var(--bg-surface);border:1px solid var(--border);border-radius:6px;color:var(--text-primary);font-size:12px;outline:none}
.git-merge-select:focus{border-color:var(--accent)}
.git-merge-preview{margin-bottom:12px;padding:10px;background:var(--bg-elevated);border-radius:8px}
.git-merge-preview-title{font-size:11px;font-weight:600;color:var(--text-muted);margin-bottom:6px}
.git-merge-stats{font-size:11px;color:var(--text-muted);margin-bottom:6px}
.git-merge-files{display:flex;flex-direction:column;gap:2px;max-height:120px;overflow-y:auto}
.git-merge-file{font-size:10px;font-family:var(--font-mono);color:var(--text-secondary);padding:1px 4px}
.git-merge-file.added{color:#34d399}
.git-merge-file.modified{color:#eab308}
.git-merge-file.deleted{color:#f87171}
.git-merge-actions{display:flex;gap:8px;justify-content:flex-end;padding-top:12px;border-top:1px solid var(--border)}
.git-merge-actions .btn{padding:6px 16px;border-radius:6px;font-size:12px;cursor:pointer;border:none;font-weight:500}
.git-merge-actions .btn-primary{background:var(--accent);color:#fff}
.git-merge-actions .btn-primary:hover{opacity:.85}
.git-merge-actions .btn-primary:disabled{opacity:.4;cursor:not-allowed}
.git-merge-actions .btn-secondary{background:var(--bg-card-hover);color:var(--text-secondary)}
.git-merge-actions .btn-secondary:hover{color:var(--text-primary)}
.change-bar.code-mode{border-color:rgba(99,102,241,0.25);background:rgba(99,102,241,0.06)}
.change-bar.open{border-radius:8px 8px 0 0}
.change-bar-left{display:flex;align-items:center;gap:6px;padding:4px 10px;cursor:pointer;flex:1;min-width:0;color:var(--text-secondary);transition:background 0.15s;user-select:none}
.change-bar-left:hover{background:rgba(255,255,255,0.04)}
.change-bar-left .change-count{font-weight:600;color:var(--accent);font-size:13px}
.change-bar-left .change-arrow{font-size:10px;transition:transform 0.2s;margin-left:auto;flex-shrink:0;color:var(--text-muted)}
.change-bar-left .change-arrow.open{transform:rotate(180deg)}
.change-bar-actions{display:flex;align-items:center;gap:2px;padding:2px 4px;flex-shrink:0}
.change-bar-btn{width:24px;height:24px;border-radius:4px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all 0.15s;border:none;background:transparent;padding:0;font-size:14px}
.change-bar-btn.approve{color:#34d399}
.change-bar-btn.approve:hover{background:rgba(52,211,153,0.15)}
.change-bar-btn.reject{color:#f87171}
.change-bar-btn.reject:hover{background:rgba(248,113,113,0.15)}
/* 变更文件列表（向上展开） */
.change-file-list{display:none;position:absolute;bottom:100%;left:0;right:0;max-height:240px;overflow-y:auto;background:var(--bg-card);border:1px solid var(--border);border-radius:8px 8px 0 0;padding:4px 0;z-index:10;box-shadow:0 -4px 20px rgba(0,0,0,0.1)}
.change-file-list.open{display:block}
.change-file-item{display:flex;align-items:center;gap:8px;padding:6px 10px;cursor:pointer;transition:background 0.12s;font-size:12px}
.change-file-item:hover{background:var(--bg-card-hover)}
.change-file-item .file-icon{flex-shrink:0;width:14px;height:14px;color:var(--text-muted)}
.change-file-item .file-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-primary)}
.change-file-item .file-action{flex-shrink:0;font-size:10px;padding:1px 5px;border-radius:3px;font-weight:500}
.change-file-item .file-action.created{background:rgba(52,211,153,0.12);color:#34d399}
.change-file-item .file-action.updated{background:rgba(251,191,36,0.12);color:#f59e0b}
.change-file-item .file-action.deleted{background:rgba(248,113,113,0.12);color:#f87171}
.change-file-item .file-action.appended{background:rgba(96,165,250,0.12);color:#60a5fa}
/* Diff 弹窗 */
.diff-overlay{position:fixed;inset:0;z-index:var(--z-overlay);background:rgba(0,0,0,0.5);display:none;align-items:center;justify-content:center;padding:20px}
.diff-overlay.open{display:flex}
.diff-modal{background:var(--glass-bg-strong);border:1px solid var(--glass-border);border-radius:12px;width:90%;max-width:700px;max-height:80vh;display:flex;flex-direction:column;overflow:hidden;box-shadow:var(--glass-shadow)}
.diff-modal-header{display:flex;align-items:center;gap:8px;padding:12px 16px;border-bottom:1px solid var(--border);flex-shrink:0}
.diff-modal-header .diff-title{flex:1;font-size:13px;font-weight:600;color:var(--text-primary);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.diff-modal-header .diff-close{width:24px;height:24px;border-radius:4px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text-muted);transition:all 0.15s;font-size:16px}
.diff-modal-header .diff-close:hover{background:var(--bg-card-hover);color:var(--text-secondary)}
.diff-modal-body{flex:1;overflow:auto;padding:12px 16px;font-family:'SF Mono','Cascadia Code','Fira Code',monospace;font-size:12px;line-height:1.6;white-space:pre-wrap;word-break:break-all}
.diff-modal-body .diff-line{display:block;padding:0 8px;border-radius:2px}
.diff-modal-body .diff-line.add{background:rgba(52,211,153,0.1);color:#34d399}
.diff-modal-body .diff-line.remove{background:rgba(248,113,113,0.1);color:#f87171}
.diff-modal-body .diff-line.info{color:var(--text-muted);font-style:italic}
.diff-modal-footer{display:flex;gap:8px;padding:10px 16px;border-top:1px solid var(--border);justify-content:flex-end;flex-shrink:0}
.diff-modal-footer button{padding:5px 14px;border-radius:6px;border:none;font-size:12px;cursor:pointer;transition:all 0.15s;font-weight:500}
.diff-modal-footer .diff-approve{background:rgba(52,211,153,0.15);color:#34d399}
.diff-modal-footer .diff-approve:hover{background:rgba(52,211,153,0.25)}
.diff-modal-footer .diff-reject{background:rgba(248,113,113,0.15);color:#f87171}
.diff-modal-footer .diff-reject:hover{background:rgba(248,113,113,0.25)}

/* ====== Diff 侧边面板（Git 面板用） ====== */
.diff-side-panel{position:fixed;top:0;right:0;bottom:0;width:50%;max-width:560px;min-width:360px;z-index:var(--z-sheet);background:var(--bg-surface);border-left:1px solid var(--border);display:flex;flex-direction:column;transform:translateX(100%);transition:transform 0.25s cubic-bezier(0.16,1,0.3,1);box-shadow:-8px 0 40px rgba(0,0,0,0.12)}
.diff-side-panel.open{transform:translateX(0)}
.diff-side-backdrop{position:fixed;inset:0;z-index:calc(var(--z-sheet) - 1);background:rgba(0,0,0,0.4);opacity:0;pointer-events:none;transition:opacity 0.25s}
.diff-side-backdrop.open{opacity:1;pointer-events:auto}
.diff-side-header{display:flex;align-items:center;gap:8px;padding:10px 14px;border-bottom:1px solid var(--border);flex-shrink:0;min-height:44px}
.diff-side-header .diff-side-title{flex:1;font-size:13px;font-weight:600;color:var(--text-primary);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.diff-side-header .diff-side-status{font-size:10px;padding:1px 6px;border-radius:3px;font-weight:500;flex-shrink:0}
.diff-side-header .diff-side-status.created{background:rgba(52,211,153,0.12);color:#34d399}
.diff-side-header .diff-side-status.modified{background:rgba(251,191,36,0.12);color:#f59e0b}
.diff-side-header .diff-side-status.deleted{background:rgba(248,113,113,0.12);color:#f87171}
.diff-side-header .diff-side-close{width:26px;height:26px;border-radius:6px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text-muted);transition:all 0.15s;font-size:16px;flex-shrink:0}
.diff-side-header .diff-side-close:hover{background:var(--bg-card-hover);color:var(--text-secondary)}
.diff-side-toolbar{display:flex;align-items:center;gap:4px;padding:6px 14px;border-bottom:1px solid var(--border);flex-shrink:0;overflow-x:auto}
.diff-side-toolbar .diff-tool-btn{padding:3px 8px;border-radius:4px;border:none;background:rgba(99,102,241,0.08);color:var(--text-secondary);cursor:pointer;font-size:10px;transition:all 0.15s;white-space:nowrap;font-weight:500}
.diff-side-toolbar .diff-tool-btn:hover{background:rgba(99,102,241,0.18);color:var(--text-primary)}
.diff-side-toolbar .diff-tool-btn.active{background:rgba(99,102,241,0.2);color:var(--accent)}
.diff-side-toolbar .diff-tool-btn:disabled{opacity:0.4;cursor:not-allowed}
.diff-side-toolbar .diff-tool-spacer{flex:1}
.diff-side-toolbar .diff-tool-info{font-size:10px;color:var(--text-muted)}
.diff-side-body{flex:1;overflow:auto;padding:0;font-family:var(--font-mono);font-size:12px;line-height:1.55;background:var(--bg-deep)}
.diff-side-body .diff-line-wrapper{display:flex;min-height:20px;transition:background 0.08s}
.diff-side-body .diff-line-wrapper:hover{background:rgba(255,255,255,0.03)}
.diff-side-body .diff-line-num{width:48px;min-width:48px;text-align:right;padding:0 8px;color:var(--text-muted);font-size:11px;user-select:none;border-right:1px solid rgba(255,255,255,0.04);line-height:20px;flex-shrink:0}
.diff-side-body .diff-line-num.old{color:rgba(248,113,113,0.4)}
.diff-side-body .diff-line-num.new{color:rgba(52,211,153,0.4)}
.diff-side-body .diff-line-content{flex:1;padding:0 12px;white-space:pre-wrap;word-break:break-all;line-height:20px;min-width:0}
.diff-side-body .diff-line-wrapper.add{background:rgba(52,211,153,0.07)}
.diff-side-body .diff-line-wrapper.add .diff-line-content{color:#34d399}
.diff-side-body .diff-line-wrapper.remove{background:rgba(248,113,113,0.07)}
.diff-side-body .diff-line-wrapper.remove .diff-line-content{color:#f87171}
.diff-side-body .diff-line-wrapper.ellipsis{background:rgba(255,255,255,0.02);cursor:pointer}
.diff-side-body .diff-line-wrapper.ellipsis:hover{background:rgba(99,102,241,0.08)}
.diff-side-body .diff-line-wrapper.ellipsis .diff-line-content{text-align:center;color:var(--text-muted);font-size:11px}
.diff-side-body .diff-line-content .highlight-add{background:rgba(52,211,153,0.25);border-radius:2px}
.diff-side-body .diff-line-content .highlight-remove{background:rgba(248,113,113,0.25);border-radius:2px}
.diff-side-footer{display:flex;gap:8px;padding:8px 14px;border-top:1px solid var(--border);flex-shrink:0;justify-content:flex-end}
.diff-side-footer button{padding:5px 14px;border-radius:6px;border:none;font-size:12px;cursor:pointer;transition:all 0.15s;font-weight:500}
.diff-side-footer .diff-side-approve{background:rgba(52,211,153,0.15);color:#34d399}
.diff-side-footer .diff-side-approve:hover{background:rgba(52,211,153,0.25)}
.diff-side-footer .diff-side-reject{background:rgba(248,113,113,0.15);color:#f87171}
.diff-side-footer .diff-side-reject:hover{background:rgba(248,113,113,0.25)}
.diff-side-footer .diff-side-approve:disabled,.diff-side-footer .diff-side-reject:disabled{opacity:0.4;cursor:not-allowed}

/* 响应式：小屏幕 Diff 面板全宽 */
@media(max-width:640px){.diff-side-panel{width:100%;max-width:100%;min-width:0}}

.input-tool-btn{
  width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;
  font-size:15px;color:var(--text-muted);cursor:pointer;transition:all 0.2s;
}
.input-tool-btn:active{background:var(--bg-card-hover);color:var(--text-secondary)}
.input-tool-btn.active{color:var(--accent);background:var(--accent-glow)}

/* ====== Input Tags (Chips) ====== */
.input-tags{
  display:flex;flex-wrap:wrap;gap:4px;padding:4px 4px 0 4px;width:100%;
}
.input-tag{
  display:inline-flex;align-items:center;gap:4px;padding:2px 6px 2px 8px;
  border-radius:6px;font-size:12px;font-weight:500;line-height:1.4;
  animation:tagIn 0.2s cubic-bezier(0.16,1,0.3,1);
}
@keyframes tagIn{from{opacity:0;transform:scale(0.85)}to{opacity:1;transform:scale(1)}}
.input-tag.file-tag{background:rgba(99,102,241,0.15);color:rgb(129,140,248);border:1px solid rgba(99,102,241,0.25)}
.input-tag.skill-tag{background:rgba(236,72,153,0.15);color:rgb(244,114,182);border:1px solid rgba(236,72,153,0.25)}
.input-tag .tag-icon{width:14px;height:14px;flex-shrink:0}
.input-tag .tag-emoji{font-size:12px;line-height:1;flex-shrink:0}
.input-tag .tag-label{max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.input-tag .tag-close{
  width:16px;height:16px;border-radius:4px;display:inline-flex;align-items:center;justify-content:center;
  cursor:pointer;font-size:10px;line-height:1;transition:all 0.15s;background:transparent;border:none;color:inherit;opacity:0.6;padding:0;
}
.input-tag .tag-close:hover{opacity:1;background:rgba(0,0,0,0.15)}

/* ====== Plus Button & Menu ====== */
.plus-btn{
  width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;
  cursor:pointer;transition:all 0.2s;color:var(--text-secondary);flex-shrink:0;margin-bottom:4px;
  background:transparent;
}
.plus-btn:hover{background:var(--bg-card-hover);color:var(--text-primary)}
.plus-btn:active{transform:scale(0.9)}
.plus-btn.active{color:var(--accent);background:var(--accent-glow)}
.plus-menu{
  position:absolute;left:4px;bottom:calc(100% + 4px);z-index:var(--z-menu);
  background:var(--bg-elevated);border:1px solid var(--border-light);border-radius:var(--radius-md);
  padding:6px;min-width:180px;box-shadow:0 8px 32px rgba(0,0,0,0.12);
  display:none;backdrop-filter:blur(20px);
}
.plus-menu.open{display:block;animation:menuIn 0.2s cubic-bezier(0.16,1,0.3,1)}
@keyframes menuIn{from{opacity:0;transform:translateY(6px) scale(0.96)}to{opacity:1;transform:translateY(0) scale(1)}}
.plus-menu-item{
  display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:8px;
  cursor:pointer;transition:all 0.15s;font-size:13px;color:var(--text-secondary);font-weight:500;
}
.plus-menu-item:hover{background:var(--bg-card-hover);color:var(--text-primary)}
.plus-menu-item:active{transform:scale(0.97)}
.plus-menu-item svg{flex-shrink:0;width:18px;height:18px}
.plus-menu-divider{height:1px;background:var(--border-light);margin:4px 0;padding:0}

/* ====== Floating Selector ====== */
.floating-selector{
  position:fixed;left:50%;bottom:calc(var(--bottom-h, 140px) + 12px);transform:translateX(-50%);
  z-index:var(--z-menu);width:90vw;max-width:420px;max-height:360px;
  background:var(--bg-elevated);border:1px solid var(--border-light);
  border-radius:var(--radius-lg);box-shadow:0 8px 40px rgba(0,0,0,0.12);
  backdrop-filter:blur(20px);display:flex;flex-direction:column;
  animation:selectorIn 0.2s cubic-bezier(0.16,1,0.3,1);
}
@keyframes selectorIn{from{opacity:0;transform:translateX(-50%) translateY(8px) scale(0.96)}to{opacity:1;transform:translateX(-50%) translateY(0) scale(1)}}
.floating-selector-overlay{position:fixed;inset:0;z-index:var(--z-overlay);background:transparent}
.floating-selector-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:12px 16px;border-bottom:1px solid var(--border-light);
}
.floating-selector-title{font-size:14px;font-weight:600;color:var(--text-primary)}
.floating-selector-close{
  width:24px;height:24px;border-radius:6px;border:none;background:transparent;
  color:var(--text-muted);cursor:pointer;font-size:14px;display:flex;
  align-items:center;justify-content:center;transition:all 0.15s;
}
.floating-selector-close:hover{background:var(--bg-card-hover);color:var(--text-primary)}
.floating-selector-search{
  margin:8px 12px 0;padding:8px 12px;border-radius:8px;border:1px solid var(--border);
  background:var(--bg-card);color:var(--text-primary);font-size:16px;outline:none;
  transition:border-color 0.2s;
}
.floating-selector-search:focus{border-color:var(--accent)}
.floating-selector-search::placeholder{color:var(--text-muted)}
.floating-selector-list{
  flex:1;overflow-y:auto;padding:6px 8px;margin:4px 0;max-height:260px;min-height:0;
}
.floating-selector-item{
  display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:8px;
  cursor:pointer;transition:all 0.15s;font-size:13px;color:var(--text-secondary);
}
.floating-selector-item:hover{background:var(--bg-card-hover);color:var(--text-primary)}
.floating-selector-item:active{transform:scale(0.97)}
.floating-selector-item .icon{flex-shrink:0;width:18px;height:18px;color:var(--text-muted)}
.floating-selector-item .name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.floating-selector-item .tag{
  flex-shrink:0;padding:1px 6px;border-radius:4px;font-size:10px;font-weight:600;
  background:var(--bg-card);color:var(--text-muted);
}
.floating-selector-empty{
  padding:24px;text-align:center;color:var(--text-muted);font-size:13px;
}


/* ====== 审查增强 ====== */
.review-panel{position:fixed;right:0;top:0;bottom:0;width:380px;z-index:var(--z-sheet);background:var(--bg-card);border-left:1px solid var(--border);display:flex;flex-direction:column;overflow:hidden;box-shadow:-4px 0 20px rgba(0,0,0,0.08)}
.review-panel-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--border);flex-shrink:0}
.review-panel-title{font-size:13px;font-weight:600;color:var(--text-primary)}
.review-panel-close{background:none;border:none;color:var(--text-muted);font-size:16px;cursor:pointer;padding:2px 6px;border-radius:4px}
.review-panel-close:hover{background:var(--bg-card-hover);color:var(--text-primary)}
.review-panel-body{padding:12px 16px;overflow-y:auto;flex:1;min-height:0}
.review-summary{font-size:12px;color:var(--text-muted);padding:10px 12px;background:var(--bg-elevated);border-radius:8px;margin-bottom:12px;line-height:1.5;white-space:pre-wrap}
.review-issue-list{display:flex;flex-direction:column;gap:6px}
.review-issue-item{padding:8px 10px;background:var(--bg-elevated);border-radius:6px;font-size:12px}
.review-issue-item .issue-header{display:flex;align-items:center;gap:6px;margin-bottom:4px}
.review-issue-item .issue-badge{font-size:10px;font-weight:600;padding:1px 6px;border-radius:4px;flex-shrink:0}
.review-issue-item .issue-badge.error{background:rgba(248,113,113,0.15);color:#f87171}
.review-issue-item .issue-badge.warning{background:rgba(250,204,21,0.15);color:#eab308}
.review-issue-item .issue-badge.suggestion{background:rgba(96,165,250,0.15);color:#60a5fa}
.review-issue-item .issue-file{font-size:10px;color:var(--text-muted);font-family:var(--font-mono)}
.review-issue-item .issue-msg{color:var(--text-primary);font-size:11px;margin-top:2px}
.review-issue-item .issue-actions{display:flex;gap:6px;margin-top:6px}
.review-issue-item .issue-actions button{padding:2px 8px;border-radius:4px;font-size:10px;cursor:pointer;border:none;font-weight:500}
.review-issue-item .issue-actions .accept-btn{background:rgba(52,211,153,0.15);color:#34d399}
.review-issue-item .issue-actions .accept-btn:hover{background:rgba(52,211,153,0.25)}
.review-issue-item .issue-actions .dismiss-btn{background:rgba(248,113,113,0.15);color:#f87171}
.review-issue-item .issue-actions .dismiss-btn:hover{background:rgba(248,113,113,0.25)}

/* ====== Agent 面板 ====== */
.agent-overlay{position:fixed;inset:0;z-index:var(--z-overlay);background:rgba(0,0,0,0.6);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center}
.agent-panel{background:var(--glass-bg-strong);border:1px solid var(--glass-border);border-radius:12px;width:720px;max-width:90vw;max-height:85vh;display:flex;flex-direction:column;box-shadow:var(--glass-shadow)}
.agent-header{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid var(--border);flex-shrink:0}
.agent-title{font-size:14px;font-weight:600;color:var(--text-primary)}
.agent-close{background:none;border:none;color:var(--text-muted);font-size:16px;cursor:pointer;padding:2px 6px;border-radius:4px}
.agent-close:hover{background:var(--bg-card-hover);color:var(--text-primary)}
.agent-body{padding:18px;overflow-y:auto;flex:1;min-height:0}
.agent-section-title{font-size:13px;font-weight:600;color:var(--text-primary);margin-bottom:12px}
.agent-reasoning{font-size:12px;color:var(--text-muted);padding:10px 12px;background:var(--bg-elevated);border-radius:8px;margin-bottom:12px;line-height:1.5}
.agent-plan-list{display:flex;flex-direction:column;gap:4px;margin-bottom:12px;max-height:300px;overflow-y:auto}
.agent-plan-item{display:flex;align-items:center;gap:8px;padding:7px 10px;background:var(--bg-elevated);border-radius:6px;font-size:12px}
.agent-plan-step{font-size:10px;font-weight:600;color:var(--text-muted);flex-shrink:0;width:24px;text-align:center}
.agent-plan-action{font-size:10px;font-weight:600;padding:1px 6px;border-radius:4px;flex-shrink:0}
.agent-plan-action.read{background:rgba(96,165,250,0.15);color:#60a5fa}
.agent-plan-action.search{background:rgba(250,204,21,0.15);color:#eab308}
.agent-plan-action.modify{background:rgba(52,211,153,0.15);color:#34d399}
.agent-plan-action.create{background:rgba(52,211,153,0.15);color:#34d399}
.agent-plan-action.delete{background:rgba(248,113,113,0.15);color:#f87171}
.agent-plan-action.run_check{background:rgba(168,85,247,0.15);color:#a855f7}
.agent-plan-desc{flex:1;color:var(--text-primary);font-size:11px}
.agent-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:12px;padding-top:12px;border-top:1px solid var(--border)}
.agent-actions .btn{padding:6px 16px;border-radius:6px;font-size:12px;cursor:pointer;border:none;font-weight:500;transition:all .15s}
.agent-actions .btn-primary{background:var(--accent);color:#fff}
.agent-actions .btn-primary:hover{opacity:.85}
.agent-actions .btn-primary:disabled{opacity:.4;cursor:not-allowed}
.agent-actions .btn-secondary{background:var(--bg-card-hover);color:var(--text-secondary)}
.agent-actions .btn-secondary:hover{color:var(--text-primary)}
.agent-progress{width:100%;height:6px;background:var(--border);border-radius:3px;overflow:hidden;margin-bottom:8px}
.agent-progress-bar{height:100%;background:var(--accent);border-radius:3px;transition:width .4s;width:0%}
.agent-progress-info{display:flex;justify-content:space-between;font-size:11px;color:var(--text-muted);margin-bottom:12px}
.agent-log{display:flex;flex-direction:column;gap:3px;max-height:250px;overflow-y:auto;padding:8px;background:var(--bg-elevated);border-radius:8px;font-family:var(--font-mono);font-size:11px;line-height:1.4}
.agent-log-item{display:flex;gap:6px;align-items:flex-start;padding:2px 0;color:var(--text-muted)}
.agent-log-item .log-time{color:var(--text-muted);flex-shrink:0;font-size:10px;opacity:.6}
.agent-log-item .log-msg{color:var(--text-secondary);word-break:break-all}
.agent-log-item.done .log-msg{color:var(--text-primary)}
.agent-log-item.error .log-msg{color:var(--red)}
.agent-result{font-size:13px;padding:12px;background:rgba(52,211,153,0.1);border-radius:8px;color:var(--text-primary);line-height:1.5;margin-bottom:12px}

/* ====== 批量编辑 ====== */
.batch-edit-overlay{position:fixed;inset:0;z-index:var(--z-overlay);background:rgba(0,0,0,0.6);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center}
.batch-edit-panel{background:var(--glass-bg-strong);border:1px solid var(--glass-border);border-radius:12px;width:680px;max-width:90vw;max-height:80vh;display:flex;flex-direction:column;box-shadow:var(--glass-shadow)}
.batch-edit-header{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid var(--border);flex-shrink:0}
.batch-edit-title{font-size:14px;font-weight:600;color:var(--text-primary)}
.batch-edit-close{background:none;border:none;color:var(--text-muted);font-size:16px;cursor:pointer;padding:2px 6px;border-radius:4px}
.batch-edit-close:hover{background:var(--bg-card-hover);color:var(--text-primary)}
.batch-edit-body{padding:18px;overflow-y:auto;flex:1;min-height:0}
.batch-edit-step-title{font-size:13px;font-weight:600;color:var(--text-primary);margin-bottom:12px}
.batch-edit-textarea{width:100%;padding:10px 12px;font-family:var(--font-mono);font-size:12px;line-height:1.5;background:var(--bg-surface);border:1px solid var(--border);border-radius:8px;color:var(--text-primary);resize:vertical;min-height:80px;outline:none}
.batch-edit-textarea:focus{border-color:var(--accent)}
.batch-edit-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:16px;padding-top:12px;border-top:1px solid var(--border)}
.batch-edit-actions .btn{padding:6px 16px;border-radius:6px;font-size:12px;cursor:pointer;border:none;font-weight:500;transition:all .15s}
.batch-edit-actions .btn-primary{background:var(--accent);color:#fff}
.batch-edit-actions .btn-primary:hover{opacity:.85}
.batch-edit-actions .btn-primary:disabled{opacity:.4;cursor:not-allowed}
.batch-edit-actions .btn-secondary{background:var(--bg-card-hover);color:var(--text-secondary)}
.batch-edit-actions .btn-secondary:hover{color:var(--text-primary)}
.batch-edit-analysis{font-size:12px;color:var(--text-muted);padding:10px 12px;background:var(--bg-elevated);border-radius:8px;margin-bottom:12px;line-height:1.5}
.batch-edit-file-list{display:flex;flex-direction:column;gap:6px;max-height:300px;overflow-y:auto}
.batch-edit-file-item{display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--bg-elevated);border-radius:6px;font-size:12px;cursor:default;transition:all .15s}
.batch-edit-file-item:hover{background:var(--bg-card-hover)}
.batch-edit-file-item .file-checkbox{width:14px;height:14px;accent-color:var(--accent);cursor:pointer;flex-shrink:0}
.batch-edit-file-item .file-action{font-size:10px;font-weight:600;padding:1px 6px;border-radius:4px;flex-shrink:0}
.batch-edit-file-item .file-action.create{background:rgba(52,211,153,0.15);color:#34d399}
.batch-edit-file-item .file-action.modify{background:rgba(96,165,250,0.15);color:#60a5fa}
.batch-edit-file-item .file-action.delete{background:rgba(248,113,113,0.15);color:#f87171}
.batch-edit-file-item .file-name{flex:1;font-family:var(--font-mono);font-size:11px;color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.batch-edit-file-item .file-summary{font-size:11px;color:var(--text-muted);max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.batch-edit-progress{width:100%;height:6px;background:var(--border);border-radius:3px;overflow:hidden;margin-bottom:8px}
.batch-edit-progress-bar{height:100%;background:var(--accent);border-radius:3px;transition:width .3s;width:0%}
.batch-edit-progress-text{font-size:11px;color:var(--text-muted);margin-bottom:12px;text-align:center}
.batch-edit-file-results{display:flex;flex-direction:column;gap:4px}
.batch-edit-result-item{display:flex;align-items:center;gap:6px;padding:6px 10px;border-radius:4px;font-size:11px}
.batch-edit-result-item.success{background:rgba(52,211,153,0.1);color:#34d399}
.batch-edit-result-item.failed{background:rgba(248,113,113,0.1);color:#f87171}
.batch-edit-result-item .result-icon{flex-shrink:0;font-size:12px}
.batch-edit-result-summary{font-size:13px;padding:12px;background:rgba(52,211,153,0.1);border-radius:8px;color:var(--text-primary);line-height:1.5;margin-bottom:8px}

/* ====== Mode Selector Modal ====== */
.mode-selector-overlay{
  position:fixed;inset:0;z-index:var(--z-overlay);
  background:rgba(0,0,0,0.7);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);
  display:flex;align-items:center;justify-content:center;
  opacity:0;pointer-events:none;transition:opacity 0.35s ease;
}
.mode-selector-overlay.open{opacity:1;pointer-events:auto}
.mode-selector-modal{
  width:360px;max-width:90vw;background:var(--glass-bg-strong);
  border:1px solid var(--glass-border);border-radius:var(--radius-xl);
  padding:32px 28px 28px;box-shadow:var(--glass-shadow);
  transform:translateY(20px) scale(0.96);transition:transform 0.35s cubic-bezier(0.16,1,0.3,1);
}
.mode-selector-overlay.open .mode-selector-modal{transform:translateY(0) scale(1)}
.mode-selector-title{text-align:center;font-size:17px;font-weight:700;margin-bottom:4px;color:var(--text-primary)}
.mode-selector-sub{text-align:center;font-size:13px;color:var(--text-muted);margin-bottom:24px;line-height:1.5}
.mode-selector-cards{display:flex;flex-direction:column;gap:12px}
.mode-card{
  display:flex;align-items:center;gap:14px;padding:16px 18px;border-radius:var(--radius-md);
  background:var(--bg-card);border:1.5px solid var(--border);cursor:pointer;
  transition:all 0.2s;position:relative;overflow:hidden;
}
.mode-card:active{transform:scale(0.98)}
.mode-card.office:hover{border-color:var(--accent);background:var(--accent-glow)}
.mode-card.code:hover{border-color:#818cf8;background:rgba(99,102,241,0.08)}
.mode-card-icon{
  width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.mode-card-icon.office{background:linear-gradient(135deg,var(--accent),#f97316);color:#fff}
.mode-card-icon.code{background:linear-gradient(135deg,#6366f1,#8b5cf6);color:#fff}
.mode-card-icon svg{width:22px;height:22px}
.mode-card-body{flex:1;min-width:0}
.mode-card-name{font-size:14px;font-weight:600;color:var(--text-primary);margin-bottom:2px}
.mode-card-desc{font-size:12px;color:var(--text-muted);line-height:1.4}
.mode-card-check{width:20px;height:20px;border-radius:50%;border:2px solid var(--border-light);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all 0.2s}
.mode-card.selected .mode-card-check{border-color:var(--accent);background:var(--accent)}
.mode-card.selected.office .mode-card-check{border-color:var(--accent);background:var(--accent)}
.mode-card.selected.code .mode-card-check{border-color:#818cf8;background:#818cf8}
.mode-card-check svg{width:12px;height:12px;color:#fff;opacity:0;transition:opacity 0.2s}
.mode-card.selected .mode-card-check svg{opacity:1}
.mode-selector-confirm{
  margin-top:16px;width:100%;padding:12px;border-radius:var(--radius-md);
  font-size:14px;font-weight:600;cursor:pointer;text-align:center;transition:all 0.2s;
  background:var(--accent);color:#fff;border:none;
}
.mode-selector-confirm:active{transform:scale(0.97)}
.mode-selector-confirm.code{background:#818cf8}
.mode-selector-footer{text-align:center;margin-top:12px;font-size:12px;color:var(--text-muted)}
.mode-selector-footer a{color:var(--text-secondary);cursor:pointer;text-decoration:underline;text-underline-offset:2px}

/* ====== Mode Switcher ====== */
/* ====== File Reference Autocomplete ====== */
.file-ref-popup{
  position:fixed;bottom:calc(var(--bottom-h, 140px) + 12px);left:50%;transform:translateX(-50%);width:100%;max-width:448px;max-height:200px;overflow-y:auto;
  background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-sm);
  box-shadow:0 -4px 20px rgba(0,0,0,0.1);z-index:var(--z-menu);display:none;
}
.file-ref-item{
  display:flex;align-items:center;gap:8px;padding:8px 12px;cursor:pointer;font-size:13px;
  transition:background 0.15s;
}
.file-ref-item:hover,.file-ref-item.selected{background:var(--bg-card-hover)}
.file-ref-item .ref-icon{font-size:14px;width:18px;text-align:center;flex-shrink:0}
.file-ref-item .ref-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.file-ref-item .ref-path{font-size:11px;color:var(--text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:120px}
.file-ref-empty{padding:12px;text-align:center;color:var(--text-muted);font-size:12px}
.file-ref-group{font-size:10px;font-weight:600;color:var(--text-muted);padding:4px 10px 2px;text-transform:uppercase;letter-spacing:.5px}
.symbol-item .ref-icon{font-family:var(--font-mono);color:var(--accent)}

/* ====== Workspace Drawer ====== */
.drawer-overlay{
  position:fixed;inset:0;z-index:var(--z-overlay);background:rgba(0,0,0,0.7);
  opacity:0;pointer-events:none;transition:opacity 0.25s;
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
}
.drawer-overlay.open{opacity:1;pointer-events:auto}
.drawer{
  position:fixed;top:0;left:0;right:0;bottom:0;z-index:calc(var(--z-overlay) + 1);
  background:var(--bg-primary);
  transform:translateY(100%);transition:transform 0.35s cubic-bezier(0.16,1,0.3,1);
  display:flex;flex-direction:column;overflow:hidden;
}
.drawer.open{transform:translateY(0)}
.drawer-handle{width:36px;height:4px;border-radius:99px;background:var(--text-muted);margin:10px auto 6px;flex-shrink:0}
body.drawer-open .bottom-area{visibility:hidden;opacity:0;pointer-events:none}
body.drawer-open .ask-question-card{display:none}
.drawer-header{
  padding:8px 16px 12px;display:flex;align-items:center;gap:12px;border-bottom:1px solid var(--border);flex-shrink:0;
}
.drawer-tabs{display:flex;gap:4px;flex:1;justify-content:center}
.drawer-tab{display:flex;align-items:center;gap:6px;padding:8px 14px;border-radius:10px;font-size:13px;font-weight:500;color:var(--text-muted);cursor:pointer;transition:all .2s;background:transparent;border:none}
.drawer-tab.active{background:var(--accent);color:#fff}
.drawer-tab:hover:not(.active){color:var(--text-primary);background:var(--bg-card)}
.drawer-title{font-size:15px;font-weight:600;display:flex;align-items:center;gap:8px}
.drawer-close{
  width:36px;height:36px;min-width:36px;flex-shrink:0;border-radius:10px;display:flex;align-items:center;justify-content:center;
  cursor:pointer;font-size:16px;color:var(--text-secondary);transition:all 0.2s;background:var(--bg-card);
}
.drawer-close:hover{background:var(--bg-card-hover)}
.drawer-close:active{transform:scale(0.95)}
/* ====== 历史会话列表 ====== */
.session-item{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:12px;cursor:pointer;transition:all .15s;margin:4px 0}
.session-item:hover{background:var(--bg-card)}
.session-item:active{transform:scale(.98)}
.session-item .sess-icon{width:40px;height:40px;border-radius:10px;background:var(--accent-glow);display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--accent);position:relative}
.session-item .sess-icon .sess-status{
  position:absolute;bottom:-2px;right:-2px;width:12px;height:12px;border-radius:50%;border:2px solid var(--bg-primary);
}
.session-item .sess-icon .sess-status.thinking{background:#fbbf24;animation:pulse 1.5s infinite}
.session-item .sess-icon .sess-status.sending{background:#60a5fa;animation:pulse 1.5s infinite}
.session-item .sess-icon .sess-status.replying{background:#a78bfa;animation:pulse 1.5s infinite}
.session-item .sess-icon .sess-status.blocked{background:#f87171;animation:pulse 1.5s infinite}
.session-item .sess-icon .sess-status.idle{background:#4ade80}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:0.5}}
.session-item .sess-info{flex:1;min-width:0}
.session-item .sess-name{font-size:14px;font-weight:500;color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.session-item .sess-meta{font-size:12px;color:var(--text-muted);margin-top:3px;display:flex;align-items:center;gap:6px}
.session-item .sess-meta .sess-status-text{color:#fbbf24;font-weight:500}
.session-item .sess-meta .sess-status-text.sending{color:#60a5fa}
.session-item .sess-meta .sess-status-text.replying{color:#a78bfa}
.session-item .sess-meta .sess-status-text.blocked{color:#f87171}
.session-item .sess-action{width:24px;height:24px;border-radius:6px;display:flex;align-items:center;justify-content:center;color:var(--text-muted);cursor:pointer;transition:all .15s;background:transparent;border:none}
.session-item .sess-action:hover{color:var(--accent);background:var(--accent-glow)}
.session-item .sess-actions{display:flex;gap:4px;flex-shrink:0}
.session-item .sess-action-btn{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;color:var(--text-muted);cursor:pointer;transition:all .15s;background:transparent;border:none;opacity:0}
.session-item:hover .sess-action-btn{opacity:1}
.session-item .sess-action-btn:hover{color:var(--accent);background:var(--accent-glow)}
.session-item .sess-action-btn.danger:hover{color:#f87171;background:rgba(248,113,113,0.1)}
.session-item.current{background:var(--accent-glow);border:1px solid rgba(245,158,11,0.2)}
.drawer-body{flex:1;overflow-y:auto;padding:16px;min-height:0}

/* ====== Skills Tab ====== */
.skill-item{
  display:flex;align-items:center;gap:10px;padding:12px;border-radius:var(--radius-sm);
  cursor:pointer;transition:all 0.15s;font-size:13px;border:1px solid var(--border);margin-bottom:6px;
}
.skill-item:active{background:var(--bg-card-hover)}
.skill-item .skill-icon{
  width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;
  flex-shrink:0;font-size:16px;
}
.skill-item .skill-icon.system{background:linear-gradient(135deg,var(--accent),#f97316);color:#fff}
.skill-item .skill-icon.user{background:var(--accent-glow);color:var(--accent)}
.skill-item .skill-info{flex:1;min-width:0}
.skill-item .skill-name{font-size:13px;font-weight:600;color:var(--text-primary)}
.skill-item .skill-desc{font-size:11px;color:var(--text-muted);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.skill-item .skill-actions{display:flex;gap:4px;flex-shrink:0}
.skill-item .skill-action{
  width:28px;height:28px;border-radius:6px;display:flex;align-items:center;justify-content:center;
  color:var(--text-muted);cursor:pointer;transition:all .15s;background:transparent;border:none;font-size:14px;
}
.skill-item .skill-action:hover{color:var(--accent);background:var(--accent-glow)}
.skill-item .skill-action.delete:hover{color:var(--red);background:rgba(248,113,113,0.15)}
.skill-toolbar{display:flex;gap:6px;padding:0 0 10px}
.skill-toolbar button{
  padding:6px 14px;border-radius:8px;font-size:12px;font-weight:500;cursor:pointer;
  transition:all .15s;display:flex;align-items:center;gap:4px;border:none;
}
.skill-toolbar .btn-primary{background:var(--accent);color:#fff}
.skill-toolbar .btn-primary:active{transform:scale(.95)}
.skill-toolbar .btn-upload{background:var(--bg-card);color:var(--text-secondary);border:1px solid var(--border)}
.skill-toolbar .btn-upload:active{transform:scale(.95)}
.skill-tag{
  display:inline-block;font-size:9px;padding:1px 5px;border-radius:3px;font-weight:600;
  margin-left:4px;vertical-align:middle;
}
.skill-tag.system{background:var(--accent-glow);color:var(--accent)}
.skill-tag.user{background:rgba(96,165,250,0.15);color:var(--blue)}
/* Skill Edit Modal */
.skill-modal{max-width:520px;max-height:90vh}
.skill-modal .modal-body{padding:16px;overflow-y:auto}
.skill-form-group{margin-bottom:14px}
.skill-form-group label{display:block;font-size:12px;font-weight:500;color:var(--text-secondary);margin-bottom:4px}
.skill-form-group input,.skill-form-group textarea{
  width:100%;padding:10px 12px;border-radius:8px;background:var(--bg-card);
  border:1px solid var(--border);color:var(--text-primary);font-size:13px;transition:border-color .15s;
}
.skill-form-group input:focus,.skill-form-group textarea:focus{border-color:var(--accent)}
.skill-form-group textarea{min-height:120px;resize:vertical;font-family:var(--font-mono);font-size:12px;line-height:1.5}
.skill-form-group .char-count{font-size:11px;color:var(--text-muted);text-align:right;margin-top:2px}
.skill-empty{text-align:center;padding:40px 20px;color:var(--text-muted);font-size:13px;line-height:1.6}
.skill-empty svg{margin-bottom:10px;opacity:0.4}
.skill-item.pending{border-color:var(--accent);opacity:0.85}
.skill-item .skill-pending-bar{
  display:flex;gap:6px;margin-top:6px;padding-top:6px;border-top:1px solid var(--border);
}
.skill-item .skill-pending-bar button{
  padding:3px 10px;border-radius:5px;font-size:11px;font-weight:500;cursor:pointer;border:none;transition:all .15s;
}
.skill-item .skill-pending-bar .approve-btn{background:var(--green);color:#fff}
.skill-item .skill-pending-bar .approve-btn:active{transform:scale(.95)}
.skill-item .skill-pending-bar .reject-btn{background:rgba(248,113,113,0.2);color:var(--red)}
.skill-item .skill-pending-bar .reject-btn:active{transform:scale(.95)}
.skill-item .skill-trigger{font-size:10px;color:var(--text-muted);margin-top:1px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.skill-item .skill-trigger span{background:var(--bg-card);padding:1px 4px;border-radius:3px;margin:0 1px}

/* ====== 文档办公 ====== */
.doc-toolbar{display:flex;gap:6px;padding:0 0 10px}
.doc-list{display:flex;flex-direction:column;gap:2px}
.doc-item{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:6px;cursor:pointer;transition:background .12s}
.doc-item:active{transform:scale(.98)}
.doc-item:hover{background:var(--bg-tertiary)}
.doc-item .doc-item-icon{width:28px;height:28px;border-radius:6px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:12px}
.doc-item .doc-item-info{flex:1;min-width:0}
.doc-item .doc-item-name{font-size:12px;font-weight:500;color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.doc-item .doc-item-meta{font-size:10px;color:var(--text-muted);margin-top:1px}
.doc-item .doc-item-action{color:var(--text-muted);cursor:pointer;padding:4px;border-radius:4px;flex-shrink:0}
.doc-item .doc-item-action:hover{color:var(--accent);background:var(--accent-glow)}

/* ====== Projects ====== */
.project-toolbar{display:flex;gap:6px;padding:0 0 10px}
.project-list{display:flex;flex-direction:column;gap:2px}
.project-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;cursor:pointer;transition:all .15s;margin:2px 8px}
.project-item:hover{background:var(--bg-card)}
.project-item:active{transform:scale(.98)}
.project-item.current{background:var(--bg-card)}
.project-item .project-icon{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0;background:rgba(59,130,246,0.1);color:var(--accent)}
.project-item .project-info{flex:1;min-width:0}
.project-item .project-name{font-size:13px;font-weight:500;color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.project-item .project-meta{font-size:11px;color:var(--text-muted);margin-top:2px}
.project-item .project-actions{display:flex;gap:4px;flex-shrink:0}
.project-action-btn{color:var(--text-muted);cursor:pointer;padding:4px;border-radius:4px;border:none;background:transparent;transition:all .15s}
.project-action-btn:hover{color:var(--accent);background:var(--accent-glow)}
.project-action-btn.danger:hover{color:var(--red);background:rgba(248,113,113,0.1)}

/* ====== Project Creator Dialog ====== */
.project-creator-overlay{position:fixed;inset:0;z-index:var(--z-overlay);background:rgba(0,0,0,0.5);display:none;align-items:center;justify-content:center}
.project-creator-modal{background:var(--glass-bg-strong);border:1px solid var(--glass-border);border-radius:12px;width:360px;max-width:90vw;overflow:hidden;box-shadow:var(--glass-shadow)}
.project-creator-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border)}
.project-creator-header span:first-child{font-size:15px;font-weight:600}
.project-creator-close{color:var(--text-muted);cursor:pointer;font-size:18px;padding:4px;border-radius:4px;transition:all .15s}
.project-creator-close:hover{color:var(--text-primary);background:var(--bg-card)}
.project-creator-body{padding:20px}
.project-creator-field{display:flex;flex-direction:column;gap:6px}
.project-creator-field label{font-size:13px;color:var(--text-secondary);font-weight:500}
.project-creator-field input{padding:10px 12px;border:1px solid var(--border);border-radius:8px;font-size:14px;background:var(--bg-primary);color:var(--text-primary);transition:border-color .15s}
.project-creator-field input:focus{outline:none;border-color:var(--accent)}
.project-creator-footer{display:flex;gap:8px;justify-content:flex-end;padding:16px 20px;border-top:1px solid var(--border)}

/* ====== Todo List ====== */
.todo-panel{background:var(--bg-elevated);border:1px solid var(--border-light);border-radius:8px;margin:6px 0;overflow:hidden}
.todo-header{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;background:rgba(0,0,0,0.02);border-bottom:1px solid var(--border-light)}
.todo-header .todo-title{font-size:12px;font-weight:500;color:var(--text-secondary);display:flex;align-items:center;gap:6px}
.todo-header .todo-progress-text{font-size:11px;color:var(--text-muted)}
.todo-progress-bar{height:2px;background:var(--border-light);position:relative}
.todo-progress-bar .todo-progress-fill{height:100%;background:var(--accent);transition:width .3s ease;border-radius:0 1px 1px 0}
.todo-list{padding:4px 0}
.todo-item{display:flex;align-items:flex-start;gap:10px;padding:6px 12px;transition:background .1s}
.todo-item:hover{background:rgba(0,0,0,0.02)}
.todo-item .todo-checkbox{
  width:16px;height:16px;border-radius:4px;border:1.5px solid var(--text-muted);flex-shrink:0;
  display:flex;align-items:center;justify-content:center;cursor:pointer;margin-top:2px;transition:all .15s;
  background:transparent;color:transparent;font-size:10px;font-weight:700;
}
.todo-item .todo-checkbox:hover{border-color:var(--accent)}
.todo-item .todo-checkbox.done{background:var(--accent);border-color:var(--accent);color:#fff}
.todo-item .todo-checkbox.in-progress{border-color:var(--accent)}
.todo-item .todo-checkbox.in-progress::after{content:'';width:5px;height:5px;border-radius:50%;background:var(--accent)}
.todo-item .todo-content{flex:1;font-size:12px;line-height:1.4;color:var(--text-secondary);min-width:0}
.todo-item .todo-content.done{text-decoration:line-through;color:var(--text-muted)}
.todo-item .todo-badge{
  font-size:9px;padding:1px 5px;border-radius:3px;font-weight:500;flex-shrink:0;margin-top:2px;
}
.todo-item .todo-badge.done{background:rgba(34,197,94,0.1);color:var(--green)}
.todo-item .todo-badge.in-progress{background:rgba(245,158,11,0.1);color:var(--accent)}
.todo-item .todo-badge.pending{background:rgba(148,163,184,0.1);color:var(--text-muted)}
/* ====== Todo Group Tabs ====== */
.todo-group-tabs{display:flex;gap:2px;padding:6px 10px 0;overflow-x:auto;scrollbar-width:none;border-bottom:1px solid var(--border-light)}
.todo-group-tabs::-webkit-scrollbar{display:none}
.todo-group-tab{padding:4px 10px;font-size:11px;border-radius:4px 4px 0 0;cursor:pointer;white-space:nowrap;color:var(--text-muted);background:transparent;border:none;transition:all .15s;position:relative}
.todo-group-tab:hover{color:var(--text-secondary)}
.todo-group-tab.active{color:var(--accent);font-weight:500}
.todo-group-tab .tab-progress{font-size:10px;margin-left:3px;opacity:.7}
.todo-group-tab .tab-close{display:inline-block;margin-left:4px;font-size:12px;cursor:pointer;opacity:0;transition:opacity .15s}
.todo-group-tab:hover .tab-close{opacity:.5}
.todo-group-tab .tab-close:hover{opacity:1;color:var(--red)}

/* ====== File Tree ====== */
.file-item{
  display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:var(--radius-sm);
  cursor:pointer;transition:all 0.15s;font-size:13px;
}
.file-item:active{background:var(--bg-card-hover)}
.file-item .toggle-icon{width:16px;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text-muted);transition:transform 0.15s}
.file-item .toggle-icon.expanded{transform:rotate(90deg)}
.file-item .icon{font-size:16px;width:20px;text-align:center;flex-shrink:0}
.file-item .name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.file-item .size{font-size:11px;color:var(--text-muted);flex-shrink:0}
.file-item .file-actions{display:flex;gap:4px;opacity:0;transition:opacity 0.15s}
.file-item:hover .file-actions,.file-item:active .file-actions{opacity:1}
.file-action-btn{
  width:26px;height:26px;border-radius:6px;display:flex;align-items:center;justify-content:center;
  font-size:12px;cursor:pointer;color:var(--text-muted);transition:all 0.15s;
}
.file-action-btn:active{background:var(--bg-card-hover);color:var(--text-primary)}
.empty-state{padding:40px 20px;text-align:center;color:var(--text-muted);font-size:13px}
.empty-state .icon{font-size:32px;margin-bottom:8px;display:block}

/* ====== File Editor Modal ====== */
.modal-overlay{
  position:fixed;inset:0;z-index:calc(var(--z-overlay) + 10);background:rgba(0,0,0,0.6);
  opacity:0;pointer-events:none;transition:opacity 0.25s;
  -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
  display:flex;align-items:center;justify-content:center;padding:20px;
}
.modal-overlay.open{opacity:1;pointer-events:auto}
.modal{
  width:100%;max-width:720px;max-height:85vh;background:var(--bg-elevated);
  border-radius:16px;transform:scale(0.95) translateY(10px);
  transition:transform 0.3s cubic-bezier(0.16,1,0.3,1), opacity 0.3s;
  display:flex;flex-direction:column;overflow:hidden;
  border:1px solid var(--border-light);box-shadow:0 25px 50px -12px rgba(0,0,0,0.5);
}
/* 移动端 modal 确保可滚动 */
@media(hover:none)and(pointer:coarse){.modal{max-height:85dvh}}
.modal-overlay.open .modal{transform:scale(1) translateY(0)}
.modal-handle{width:36px;height:4px;border-radius:99px;background:var(--border);margin:12px auto 0;flex-shrink:0}
.modal-header{
  padding:16px 20px 12px;display:flex;align-items:center;justify-content:space-between;flex-shrink:0;
  border-bottom:1px solid var(--border-light);
}
.modal-title{font-size:15px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;color:var(--text-primary)}
.modal-actions{display:flex;gap:8px}
.modal-btn{
  padding:8px 16px;border-radius:8px;font-size:13px;font-weight:500;cursor:pointer;
  transition:all 0.15s;border:1px solid var(--border);background:var(--bg-surface);color:var(--text-secondary);
}
.modal-btn:active{transform:scale(0.97)}
.modal-btn.primary{background:var(--accent);color:#fff;border-color:var(--accent)}
.modal-btn.primary:hover{background:var(--accent-hover)}
.modal-btn.danger{color:var(--red);border-color:var(--red);background:rgba(239,68,68,0.08)}
.modal-btn.danger:hover{background:rgba(239,68,68,0.15)}
.modal-body{flex:1;overflow-y:auto;padding:16px 20px 20px;display:flex;flex-direction:column;min-height:0}

/* ====== Plan Review ====== */
.plan-review-content h1{font-size:20px;font-weight:700;color:#fff;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid var(--border)}
.plan-review-content h2{font-size:16px;font-weight:600;color:var(--accent);margin:20px 0 10px;display:flex;align-items:center;gap:6px}
.plan-review-content h3{font-size:14px;font-weight:600;color:var(--text-primary);margin:14px 0 8px}
.plan-review-content p{margin:6px 0;line-height:1.6}
.plan-review-content ul,.plan-review-content ol{margin:6px 0;padding-left:20px}
.plan-review-content li{margin:4px 0;line-height:1.5}
.plan-review-content hr{margin:16px 0;border:none;border-top:1px solid var(--border)}
.plan-review-content blockquote{
  border-left:3px solid var(--accent);padding:8px 12px;margin:10px 0;
  background:var(--accent-glow);border-radius:0 6px 6px 0;color:var(--text-secondary);
}
.plan-review-content code{
  background:var(--bg-card);color:var(--accent);padding:1px 5px;border-radius:4px;
  font-family:var(--font-mono);font-size:12px;
}
.plan-review-content pre{
  background:var(--bg-card);border:1px solid var(--border);border-radius:8px;
  padding:12px 16px;margin:10px 0;overflow-x:auto;
}
.plan-review-content pre code{background:none;padding:0;color:var(--text-primary)}
.plan-review-content table{width:100%;border-collapse:collapse;margin:10px 0}
.plan-review-content th,.plan-review-content td{
  padding:8px 12px;border:1px solid var(--border);text-align:left;font-size:13px;
}
.plan-review-content th{background:var(--bg-card);font-weight:600;color:var(--accent)}
.plan-review-content td{color:var(--text-secondary)}
.plan-review-content strong{color:var(--text-primary)}
.plan-review-content em{color:var(--text-secondary)}
/* 复选框样式 */
.plan-review-content .task-list-item{list-style:none;margin-left:-20px;display:flex;align-items:flex-start;gap:6px}
.plan-review-content .task-checkbox{
  display:inline-flex;width:16px;height:16px;border-radius:4px;border:2px solid var(--text-muted);
  margin-top:3px;flex-shrink:0;align-items:center;justify-content:center;transition:all 0.2s;
}
.plan-review-content .task-checkbox.done{background:var(--green);border-color:var(--green)}
.plan-review-content .task-checkbox.done::after{content:'✓';color:#fff;font-size:10px;font-weight:700}
.plan-review-content .task-checkbox.pending{background:transparent;border-color:var(--text-muted)}
/* 进度条 */
.plan-progress-bar{
  background:var(--bg-card);border-radius:99px;height:8px;overflow:hidden;margin:12px 0;
  border:1px solid var(--border);
}
.plan-progress-bar .progress-fill{
  height:100%;border-radius:99px;background:linear-gradient(90deg,var(--accent),var(--green));
  transition:width 0.5s ease;min-width:4px;
}
.plan-progress-stats{display:flex;justify-content:space-between;font-size:12px;color:var(--text-muted);margin-bottom:10px}
.plan-section-tag{
  display:inline-block;padding:2px 8px;border-radius:4px;font-size:10px;font-weight:600;
  letter-spacing:0.3px;text-transform:uppercase;
}
.plan-section-tag.objective{background:rgba(96,165,250,0.15);color:var(--blue)}
.plan-section-tag.scope{background:rgba(52,211,153,0.15);color:var(--green)}
.plan-section-tag.steps{background:rgba(245,158,11,0.15);color:var(--accent)}
.plan-section-tag.risk{background:rgba(248,113,113,0.15);color:var(--red)}
.plan-section-tag.result{background:rgba(167,139,250,0.15);color:#a78bfa}
.plan-section-tag.progress{background:rgba(96,165,250,0.15);color:var(--blue)}
/* Spec 模式章节标签 */
.plan-section-tag.overview{background:rgba(52,211,153,0.15);color:var(--green)}
.plan-section-tag.requirements{background:rgba(245,158,11,0.15);color:var(--accent)}
.plan-section-tag.architecture{background:rgba(167,139,250,0.15);color:#a78bfa}
.plan-section-tag.api{background:rgba(59,130,246,0.15);color:var(--blue)}
.plan-section-tag.data{background:rgba(16,185,129,0.15);color:#10b981}
.plan-section-tag.ui{background:rgba(236,72,153,0.15);color:#ec4899}
.plan-section-tag.security{background:rgba(248,113,113,0.15);color:var(--red)}
.plan-section-tag.constraints{background:rgba(251,191,36,0.15);color:#fbbf24}
.plan-section-tag.assumptions{background:rgba(167,139,250,0.15);color:#a78bfa}
.plan-section-tag.dependencies{background:var(--bg-elevated);color:var(--text-muted)}
/* Spec 文档 Tab 选择器 */
.spec-doc-tabs{
  display:flex;gap:4px;padding:8px 12px 0;background:var(--header-bg);
  border-bottom:1px solid var(--border-color);overflow-x:auto;
}
.spec-doc-tab{
  display:flex;align-items:center;gap:3px;padding:7px 10px;border:none;
  background:transparent;color:var(--text-muted);font-size:12px;font-weight:500;
  cursor:pointer;border-radius:8px 8px 0 0;white-space:nowrap;transition:all 0.2s;
}
.spec-doc-tab svg{flex-shrink:0;width:13px;height:13px}
.spec-doc-tab:hover{color:var(--text);background:rgba(128,128,128,0.06)}
.spec-doc-tab.active{
  color:var(--text);background:var(--bg);font-weight:600;
  box-shadow:0 -1px 3px rgba(0,0,0,0.04);
}
.spec-doc-tab[data-doc="prd"].active{color:#10b981}
.spec-doc-tab[data-doc="tech-design"].active{color:#a78bfa}
.spec-doc-tab[data-doc="api"].active{color:#3b82f6}
.modal-preview .modal-body{overflow:hidden;padding:0}

/* ====== 全屏预览 ====== */
.preview-overlay{
  position:fixed;inset:0;z-index:calc(var(--z-overlay) + 10);background:rgba(15,17,23,0.95);
  opacity:0;pointer-events:none;transition:opacity 0.2s;
  display:flex;flex-direction:column;
}
.preview-overlay.open{opacity:1;pointer-events:auto}
.preview-container{
  flex:1;display:flex;flex-direction:column;background:var(--bg-elevated);
  margin:0;border-radius:0;overflow:hidden;
}
.preview-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:12px 16px;background:var(--bg-surface);border-bottom:1px solid var(--border-light);
  flex-shrink:0;z-index:1;
}
.preview-title{font-size:15px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;color:var(--text-primary)}
.preview-actions{display:flex;gap:8px}
.preview-btn{
  width:36px;height:36px;border-radius:8px;display:flex;align-items:center;justify-content:center;
  background:transparent;border:1px solid var(--border-light);color:var(--text-muted);
  cursor:pointer;transition:all .15s;
}
.preview-btn:active{transform:scale(.95)}
.preview-btn:hover{background:var(--bg-card-hover);color:var(--text-primary)}
.preview-frame{flex:1;width:100%;border:none;background:#fff}
.editor-wrapper{
  position:relative;flex:1;display:flex;min-height:300px;
}
.editor-wrapper textarea{
  width:100%;flex:1;padding:16px;font-family:var(--font-mono);font-size:13px;line-height:1.6;
  background:var(--bg-surface);border:1px solid var(--border-light);border-radius:12px;
  color:var(--text-primary);resize:none;position:relative;z-index:1;caret-color:var(--text-primary);
}
.editor-wrapper textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(99,102,241,0.15)}
.editor-ghost{
  position:absolute;top:0;left:0;right:0;bottom:0;padding:16px;pointer-events:none;
  font-family:var(--font-mono);font-size:13px;line-height:1.6;white-space:pre-wrap;overflow:hidden;
  color:transparent;z-index:2;border:1px solid transparent;border-radius:12px;
}
.editor-ghost::after{
  content:attr(data-ghost);color:rgba(255,255,255,0.25);position:absolute;
  white-space:pre-wrap;word-wrap:break-word;
}
.editor-ghost.loading::after{color:rgba(255,255,255,0.15)}
.editor-ghost.loading::before{
  content:'';position:absolute;top:50%;left:50%;margin:-8px 0 0 20px;
  width:14px;height:14px;border:2px solid rgba(255,255,255,0.15);border-top-color:var(--accent);
  border-radius:50%;animation:ghost-spin .6s linear infinite;z-index:3;
}
@keyframes ghost-spin{to{transform:rotate(360deg)}}
.modal-file-info{font-size:12px;color:var(--text-muted);padding:8px 0;display:flex;gap:12px}

/* ====== 全屏分页编辑器 ====== */
.editor-overlay{
  position:fixed;inset:0;z-index:calc(var(--z-overlay) + 10);background:rgba(15,17,23,0.95);
  opacity:0;pointer-events:none;transition:opacity 0.2s;
  display:flex;flex-direction:column;
}
.editor-overlay.open{opacity:1;pointer-events:auto}
.editor-container{
  flex:1;display:flex;flex-direction:column;background:var(--bg-elevated);
  margin:0;border-radius:0;overflow:hidden;
}
.editor-header{
  display:flex;align-items:center;background:var(--bg-surface);
  border-bottom:1px solid var(--border-light);flex-shrink:0;min-height:48px;
}
.editor-tabs{
  display:flex;align-items:stretch;overflow-x:auto;flex:1;gap:0;
  scrollbar-width:thin;
}
.editor-tabs::-webkit-scrollbar{height:2px}
.editor-tabs::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}
.editor-tab{
  display:flex;align-items:center;gap:8px;padding:10px 16px;font-size:13px;
  cursor:pointer;border-right:1px solid var(--border-light);
  color:var(--text-muted);white-space:nowrap;position:relative;
  transition:background .15s;user-select:none;
  min-width:0;max-width:220px;
}
.editor-tab:hover{background:var(--bg-card-hover);color:var(--text-secondary)}
.editor-tab.active{background:var(--bg-elevated);color:var(--text-primary);border-bottom:2px solid var(--accent)}
.editor-tab .tab-name{overflow:hidden;text-overflow:ellipsis}
.editor-tab .tab-close{
  width:20px;height:20px;border-radius:4px;display:flex;align-items:center;justify-content:center;
  flex-shrink:0;opacity:0;transition:opacity .15s;
}
.editor-tab:hover .tab-close{opacity:0.5}
.editor-tab .tab-close:hover{opacity:1;background:var(--bg-card-hover)}
.editor-tab .tab-dirty{width:8px;height:8px;border-radius:50%;background:var(--accent);flex-shrink:0}
.editor-actions{
  display:flex;align-items:center;gap:8px;padding:8px 12px;flex-shrink:0;
}
.editor-btn{
  width:36px;height:36px;border-radius:8px;display:flex;align-items:center;justify-content:center;
  background:transparent;border:1px solid var(--border-light);color:var(--text-muted);
  cursor:pointer;transition:all .15s;
}
.editor-btn:active{transform:scale(.95)}
.editor-btn:hover{background:var(--bg-card-hover);color:var(--text-primary)}
.editor-btn.primary{background:var(--accent);color:#fff;border-color:var(--accent)}
.editor-btn.primary:hover{filter:brightness(1.1)}
.editor-body{
  flex:1;display:flex;flex-direction:column;overflow:hidden;padding:0 20px 20px;
}
.editor-file-info{font-size:12px;color:var(--text-muted);padding:10px 0;display:flex;gap:16px;flex-shrink:0}

/* ====== Settings Modal ====== */
.settings-section{margin-bottom:20px}
.settings-label{font-size:13px;font-weight:500;color:var(--text-secondary);margin-bottom:6px;display:block}
.settings-input{
  width:100%;padding:10px 14px;background:var(--bg-surface);border:1px solid var(--border);
  border-radius:var(--radius-sm);font-size:14px;color:var(--text-primary);
  transition:border-color 0.2s;
}
.settings-input:focus{border-color:var(--accent)}
.settings-hint{font-size:11px;color:var(--text-muted);margin-top:4px}
.settings-info{display:flex;gap:16px;font-size:12px;color:var(--text-secondary);padding:8px 0}
.settings-info-item{display:flex;align-items:center;gap:4px}
.toggle-switch{position:relative;display:inline-block;width:40px;height:22px;flex-shrink:0}
.toggle-switch input{opacity:0;width:0;height:0}
.toggle-slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background:var(--border);border-radius:22px;transition:all .25s}
.toggle-slider:before{content:"";position:absolute;height:16px;width:16px;left:3px;bottom:3px;background:#fff;border-radius:50%;transition:all .25s}
.toggle-switch input:checked+.toggle-slider{background:var(--accent)}
.toggle-switch input:checked+.toggle-slider:before{transform:translateX(18px)}

/* ====== Gesture ====== */
.msg.swiped-left{...}

/* ====== Page Container ====== */
.page-container{display:none;position:fixed;inset:0;z-index:60;background:var(--bg-surface);flex-direction:column}
.page-container.open{display:flex}
.page-header{display:flex;align-items:center;gap:8px;padding:10px 12px;border-bottom:1px solid var(--border);flex-shrink:0;min-height:48px}
.page-back{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text-secondary);background:transparent;border:none;font-size:18px;transition:all .15s;flex-shrink:0}
.page-back:active{background:var(--bg-card-hover)}
.page-title{font-size:15px;font-weight:600;color:var(--text-primary);flex:1}
.page-body{flex:1;overflow-y:auto;padding:12px;min-height:0}
.page-body .empty-state{padding:40px 20px;text-align:center;color:var(--text-muted);font-size:13px}
/* MCP/Agent 列表项 */
.page-list-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:8px;margin-bottom:6px;border:1px solid var(--border);background:var(--bg-card);transition:all .15s}
.page-list-item:active{transform:scale(.98)}
.page-list-item .pli-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.page-list-item .pli-info{flex:1;min-width:0}
.page-list-item .pli-name{font-size:13px;font-weight:500;color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.page-list-item .pli-desc{font-size:11px;color:var(--text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:1px}
.page-list-item .pli-actions{display:flex;gap:4px;flex-shrink:0}
.page-list-item .pli-actions button{padding:4px 8px;border-radius:6px;border:none;font-size:11px;cursor:pointer;transition:all .15s;background:var(--bg-surface);color:var(--text-secondary)}
.page-list-item .pli-actions button:active{transform:scale(.95)}
.page-list-item .pli-actions .active-btn{color:var(--green)}
.page-list-item .pli-actions .edit-btn{color:var(--accent)}
.page-list-item .pli-actions .del-btn{color:var(--red)}
.page-add-btn{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;padding:10px;border-radius:8px;border:1px dashed var(--border);background:transparent;color:var(--text-muted);font-size:13px;cursor:pointer;transition:all .15s;margin-top:8px}
.page-add-btn:active{background:var(--bg-card);color:var(--accent);border-color:var(--accent)}
/* 表单 */
.page-form-group{margin-bottom:12px}
.page-form-group label{display:block;font-size:12px;font-weight:500;color:var(--text-secondary);margin-bottom:4px}
.page-form-group input,.page-form-group textarea{width:100%;padding:8px 10px;border:1px solid var(--border);border-radius:6px;background:var(--bg-tertiary);color:var(--text);font-size:13px;outline:none;box-sizing:border-box;transition:border-color .2s}
.page-form-group input:focus,.page-form-group textarea:focus{border-color:var(--accent)}
.page-form-group textarea{resize:vertical;font-family:inherit;line-height:1.5;min-height:80px}
.page-form-group .char-hint{font-size:10px;color:var(--text-muted);margin-top:2px}
.page-form-actions{display:flex;gap:8px;margin-top:16px}
.page-form-actions button{flex:1;padding:10px;border-radius:8px;border:none;font-size:13px;font-weight:500;cursor:pointer;transition:all .15s;text-align:center}
.page-form-actions .primary-btn{background:var(--accent);color:#fff}
.page-form-actions .primary-btn:active{transform:scale(.97)}
button.primary-btn, .primary-btn{background:var(--accent);color:#fff;border:none;cursor:pointer;font-weight:500;transition:all .15s;display:inline-flex;align-items:center;justify-content:center}
button.primary-btn:active, .primary-btn:active{transform:scale(.97)}
button.danger-btn, .danger-btn{background:#dc2626;color:#fff;border:none;cursor:pointer;font-weight:500;transition:all .15s;display:inline-flex;align-items:center;justify-content:center}
button.danger-btn:active, .danger-btn:active{transform:scale(.97)}
.page-form-actions .cancel-btn{background:var(--bg-card);color:var(--text-secondary);border:1px solid var(--border)}
.page-form-actions .cancel-btn:active{transform:scale(.97)}
/* 测试连接结果 */
.test-result{padding:8px 10px;border-radius:6px;font-size:12px;margin-top:8px;white-space:pre-wrap}
.test-result.success{background:rgba(34,197,94,0.1);color:var(--green);border:1px solid rgba(34,197,94,0.2)}
.test-result.error{background:rgba(248,113,113,0.1);color:var(--red);border:1px solid rgba(248,113,113,0.2)}
/* Checkbox 标签悬停 */
.page-form-group label.checkbox-label:hover{background:var(--bg-card-hover)}

/* ====== Toast ====== */
.toast{
  position:fixed;bottom:100px;left:50%;transform:translateX(-50%) translateY(20px);z-index:var(--z-toast);
  padding:10px 20px;border-radius:var(--radius-sm);font-size:13px;font-weight:500;
  background:var(--bg-elevated);border:1px solid var(--border);box-shadow:var(--shadow-card);
  opacity:0;pointer-events:none;transition:all 0.3s;white-space:nowrap;
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.toast.success{border-color:var(--green)}
.toast.error{border-color:var(--red)}
.toast.info{border-color:var(--blue)}
.toast.warn{border-color:#f59e0b}

/* ====== Welcome Screen ====== */
.welcome-screen{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  height:100%;padding:40px 24px;text-align:center;
}
.welcome-screen .logo-large{
  width:64px;height:64px;border-radius:18px;background:linear-gradient(135deg,var(--accent),#f97316);
  display:flex;align-items:center;justify-content:center;font-size:30px;font-weight:700;color:#fff;
  margin-bottom:20px;box-shadow:0 8px 32px var(--accent-glow);
}
.welcome-screen h1{font-size:22px;font-weight:700;margin-bottom:6px}
.welcome-screen p{color:var(--text-secondary);font-size:14px;line-height:1.5;margin-bottom:24px}
.welcome-suggestions{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;width:100%}
.suggestion-chip{
  padding:8px 16px;border-radius:99px;border:1px solid var(--border);font-size:13px;
  cursor:pointer;transition:all 0.2s;background:var(--bg-card);color:var(--text-secondary);
}
.suggestion-chip:active{background:var(--accent-glow);border-color:var(--accent);color:var(--accent)}

/* ====== 深度思考推理过程 ======
   思考块是「正文内部」的一部分：折叠在回答上方、与回答同属一条消息，
   样式轻盈，不抢 AI 消息主体的视觉焦点。 */
.reasoning-wrapper{display:block;margin-bottom:12px}
.reasoning-wrapper:last-child{margin-bottom:0}
.content-wrapper{display:block}

.reasoning-details{
  border-radius:10px;overflow:hidden;
  background:var(--bg-tertiary);
  border:1px solid var(--border-light);
}
.reasoning-summary{
  display:flex;align-items:center;gap:6px;
  padding:6px 10px;cursor:pointer;
  font-size:12px;font-weight:500;line-height:1.4;
  color:var(--text-muted);user-select:none;list-style:none;
  transition:color .15s ease;
}
.reasoning-summary::-webkit-details-marker{display:none}
.reasoning-summary::marker{display:none;content:''}
.reasoning-summary:hover{color:var(--text-secondary)}
.reasoning-summary:focus-visible{outline:2px solid var(--focus-ring);outline-offset:-2px;border-radius:10px}
.reasoning-icon{display:inline-flex;flex-shrink:0;color:var(--text-muted);opacity:.8}
.reasoning-icon svg{display:block}
.reasoning-summary-text{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.reasoning-caret{flex-shrink:0;opacity:.5;transition:transform .2s ease}
.reasoning-details[open] .reasoning-caret{transform:rotate(180deg)}
.reasoning-content{
  padding:8px 10px 10px;font-size:12px;line-height:1.6;
  color:var(--text-muted);white-space:pre-wrap;word-break:break-word;
  max-height:250px;overflow-y:auto;
  border-top:1px solid var(--border-light);
}
/* 思考进行中：标题微呼吸，暗示内容仍在生成 */
.thinking-msg .reasoning-summary{color:var(--text-primary)}
.thinking-msg .reasoning-summary-text{animation:reasoningPulse 1.4s ease-in-out infinite}
@keyframes reasoningPulse{0%,100%{opacity:1}50%{opacity:.45}}
@media(prefers-reduced-motion:reduce){
  .thinking-msg .reasoning-summary-text{animation:none}
  .reasoning-caret{transition:none}
}

/* 模型切换抽屉 */
.model-selector{position:relative;display:inline-flex}
.model-selector-btn{display:flex;align-items:center;gap:4px;padding:2px 8px;font-size:12px;font-family:inherit;color:var(--text-secondary);cursor:pointer;border:1px solid transparent;border-radius:6px;background:transparent;transition:all 0.15s;white-space:nowrap;max-width:140px}
.model-selector-btn:hover{background:var(--bg-tertiary);border-color:var(--border)}
.model-logo-inline{width:16px;height:16px;border-radius:3px;vertical-align:middle;flex-shrink:0}
.model-arrow{font-size:8px;opacity:0.6}
/* 模型抽屉样式已统一移至文件下方（~3850 行），此处不重复声明 */

/* Token 用量指示器 */
.token-indicator{display:inline-flex;align-items:center;gap:4px;font-size:11px;color:var(--text-muted);padding:2px 8px;border-radius:4px;background:var(--bg-tertiary);white-space:nowrap}
.token-indicator.warning{color:#f59e0b;background:rgba(245,158,11,0.1)}
.token-indicator.danger{color:#ef4444;background:rgba(239,68,68,0.1)}

/* ====== 登录页面 ====== */
.login-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:var(--bg-primary);display:flex;align-items:center;justify-content:center;z-index:var(--z-overlay);padding:20px}
.login-card{background:var(--bg-card);border:1px solid var(--border);border-radius:16px;padding:40px;width:100%;max-width:380px;box-shadow:0 20px 60px rgba(0,0,0,0.15);text-align:center}
.login-logo{width:64px;height:64px;border-radius:16px;background:linear-gradient(135deg,var(--accent),#6366f1);display:flex;align-items:center;justify-content:center;font-size:28px;font-weight:700;color:#fff;margin:0 auto 16px}
.login-title{font-size:20px;font-weight:700;color:var(--text-primary);margin-bottom:4px}
.login-subtitle{font-size:13px;color:var(--text-muted);margin-bottom:28px}
.login-form{text-align:left}
.login-field{margin-bottom:16px}
.login-field label{display:block;font-size:12px;font-weight:600;color:var(--text-secondary);margin-bottom:6px}
.login-field input{width:100%;padding:10px 14px;border:1px solid var(--border);border-radius:8px;font-size:14px;font-family:inherit;background:var(--bg-primary);color:var(--text-primary);outline:none;transition:border-color 0.15s;box-sizing:border-box}
.login-field input:focus{border-color:var(--accent)}
.login-error{font-size:12px;color:#ef4444;margin-bottom:12px;display:none}
.login-error.visible{display:block}
.login-btn{width:100%;padding:10px;border:none;border-radius:8px;background:var(--accent);color:#fff;font-size:14px;font-weight:600;cursor:pointer;transition:opacity 0.15s;font-family:inherit}
.login-btn:hover{opacity:0.9}
.login-btn:disabled{opacity:0.5;cursor:not-allowed}
.login-hint{font-size:11px;color:var(--text-muted);margin-top:16px;padding:8px 12px;background:var(--bg-tertiary);border-radius:6px;text-align:center}

/* ====== 管理员面板弹窗 ====== */
.admin-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.4);display:none;align-items:center;justify-content:center;z-index:var(--z-overlay);padding:20px}
.admin-overlay.open{display:flex}
.admin-modal{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;width:100%;max-width:480px;max-height:80vh;overflow:hidden;box-shadow:0 16px 48px rgba(0,0,0,0.2);display:flex;flex-direction:column}
.admin-modal-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border);font-size:15px;font-weight:600;color:var(--text-primary)}
.admin-close{font-size:18px;cursor:pointer;color:var(--text-muted);padding:4px;line-height:1}
.admin-close:hover{color:var(--text-primary)}
.admin-modal-body{padding:20px;overflow-y:auto;min-height:0;flex:1}
.admin-section{margin-bottom:20px}
.admin-section:last-child{margin-bottom:0}
.admin-section-title{font-size:13px;font-weight:600;color:var(--text-secondary);margin-bottom:10px}
.admin-user-list{display:flex;flex-direction:column;gap:6px}
.admin-user-item{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;background:var(--bg-tertiary);border-radius:6px;font-size:12px;color:var(--text-primary)}
.admin-user-item .role{font-size:10px;padding:2px 6px;border-radius:3px;background:rgba(99,102,241,0.1);color:var(--accent)}
.admin-user-item .role.admin{background:rgba(245,158,11,0.1);color:#f59e0b}
.admin-user-delete{font-size:10px;padding:2px 8px;border:none;border-radius:4px;background:rgba(239,68,68,0.1);color:#ef4444;cursor:pointer;font-family:inherit}
.admin-user-delete:hover{background:rgba(239,68,68,0.2)}
.admin-create-form{display:flex;flex-direction:column;gap:8px}
.admin-create-form input,.admin-create-form select{padding:8px 12px;border:1px solid var(--border);border-radius:6px;font-size:12px;font-family:inherit;background:var(--bg-primary);color:var(--text-primary);outline:none}
.admin-create-form input:focus,.admin-create-form select:focus{border-color:var(--accent)}
.admin-btn{padding:8px 16px;border:none;border-radius:6px;background:var(--accent);color:#fff;font-size:12px;font-weight:500;cursor:pointer;font-family:inherit;transition:opacity 0.15s}
.admin-btn:hover{opacity:0.9}
.admin-btn.danger{background:rgba(239,68,68,0.1);color:#ef4444}
.admin-msg{font-size:11px;color:var(--text-muted);margin-top:8px}
.admin-loading{font-size:12px;color:var(--text-muted);padding:12px;text-align:center}
.admin-section-subtitle{font-weight:normal;color:var(--text-muted);font-size:11px}
.admin-section-actions{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;gap:12px}
.admin-toggle-label{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--text-primary);cursor:pointer}
.admin-app-list{display:flex;flex-direction:column;gap:6px}
.admin-app-item{display:flex;align-items:flex-start;justify-content:space-between;padding:10px 12px;background:var(--bg-tertiary);border-radius:6px;font-size:12px;color:var(--text-primary);gap:12px}
.admin-app-info{flex:1;min-width:0}
.admin-app-name{font-weight:500;color:var(--text-primary);margin-bottom:2px}
.admin-app-id{font-family:monospace;font-size:10px;color:var(--text-muted);margin-bottom:2px;word-break:break-all}
.admin-app-domain{font-size:11px;color:var(--text-muted)}
.admin-app-status{font-size:10px;padding:2px 6px;border-radius:3px}
.admin-app-status.enabled{background:rgba(34,197,94,0.1);color:#22c55e}
.admin-app-status.disabled{background:rgba(156,163,175,0.1);color:#9ca3af}
.admin-app-actions{display:flex;flex-direction:column;gap:4px}
.admin-app-action-btn{font-size:10px;padding:4px 8px;border:none;border-radius:4px;cursor:pointer;font-family:inherit}
.admin-app-action-btn.toggle{background:rgba(245,158,11,0.1);color:#f59e0b}
.admin-app-action-btn.delete{background:rgba(239,68,68,0.1);color:#ef4444}
.admin-app-action-btn:hover{opacity:0.9}

/* ====== 自定义工具管理 ====== */
.admin-tools-list{display:flex;flex-direction:column;gap:8px}
.admin-tools-tool-item{display:flex;align-items:flex-start;justify-content:space-between;padding:10px 12px;background:var(--bg-tertiary);border-radius:6px;gap:8px}
.admin-tools-tool-info{flex:1;min-width:0}
.admin-tools-tool-name{font-weight:600;font-size:13px;color:var(--text-primary);font-family:monospace}
.admin-tools-tool-desc{font-size:11px;color:var(--text-muted);margin-top:2px}
.admin-tools-tool-webhook{font-size:10px;color:var(--text-muted);margin-top:1px;word-break:break-all}
.admin-tools-tool-del{font-size:10px;padding:3px 8px;border:none;border-radius:4px;cursor:pointer;background:rgba(239,68,68,0.1);color:#ef4444;font-family:inherit;flex-shrink:0}
.admin-tools-tool-del:hover{opacity:0.9}
.admin-tools-desc{font-size:12px;color:var(--text-muted);line-height:1.5}

/* ====== 终端 ====== */
.terminal-container{display:flex;flex-direction:column;height:100%;min-height:0;background:#1a1a2e;border-radius:8px;overflow:hidden;font-family:'JetBrains Mono','Fira Code',monospace;font-size:13px;line-height:1.5}
.terminal-output{flex:1;overflow-y:auto;padding:12px;min-height:0;color:#e0e0e0;white-space:pre-wrap;word-break:break-all}
.terminal-output .terminal-line{padding:1px 0;min-height:18px}
.terminal-output .terminal-line.stdout{color:#e0e0e0}
.terminal-output .terminal-line.stderr{color:#f87171}
.terminal-output .terminal-line.error{color:#f87171;background:rgba(248,113,113,0.08)}
.terminal-output .terminal-line.success{color:#34d399}
.terminal-output .terminal-line.system{color:#94a3b8;font-style:italic}
.terminal-output .terminal-prompt-line{color:#a78bfa;display:flex;align-items:center;gap:6px;padding:2px 0}
.terminal-output .terminal-prompt-line .prompt{color:#a78bfa;font-weight:600}
.terminal-output .terminal-prompt-line .cmd{color:#e0e0e0}
.terminal-input-line{display:flex;align-items:center;gap:4px;padding:6px 12px;background:#16213e;border-top:1px solid rgba(255,255,255,0.06);flex-shrink:0}
.terminal-prompt{color:#a78bfa;font-weight:600;font-size:13px;font-family:'JetBrains Mono','Fira Code',monospace;flex-shrink:0}
.terminal-input{flex:1;background:transparent;border:none;outline:none;color:#e0e0e0;font-size:13px;font-family:'JetBrains Mono','Fira Code',monospace;padding:2px 0;min-width:0}
.terminal-input::placeholder{color:#4a4a6a}
.terminal-output::-webkit-scrollbar{width:4px}
.terminal-output::-webkit-scrollbar-track{background:transparent}
.terminal-output::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.1);border-radius:2px}
.terminal-output::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,0.2)}

/* Search result cards */
.search-results-container{display:flex;flex-direction:column;gap:8px;margin:8px 0}
.search-results-header{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:500;color:var(--text-secondary);margin-bottom:4px}
.search-result-card{padding:10px 12px;background:var(--bg-elevated);border-radius:8px;border:1px solid var(--border)}
.search-result-title{font-size:13px;font-weight:500;margin-bottom:2px}
.search-result-title a{color:var(--accent);text-decoration:none}
.search-result-title a:hover{text-decoration:underline}
.search-result-domain{font-size:11px;color:var(--text-muted);margin-bottom:4px}
.search-result-snippet{font-size:12px;color:var(--text-secondary);line-height:1.5}
.search-result-snippet mark{background:rgba(245,158,11,0.2);color:inherit;border-radius:2px;padding:0 2px}

/* Code block expand */
.code-block-container{position:relative;margin:6px 0;border-radius:6px;overflow:hidden;border:1px solid var(--border-light);background:var(--bg-elevated)}
.code-block-header{display:flex;align-items:center;gap:8px;padding:6px 10px;background:rgba(0,0,0,0.02);border-bottom:1px solid var(--border-light)}
.lang-label{font-size:10px;font-weight:500;color:var(--text-muted);text-transform:uppercase;letter-spacing:0.5px}
.code-block-header-actions{display:flex;gap:4px;margin-left:auto}
.code-copy-btn,.code-run-btn{display:inline-flex;align-items:center;gap:4px;padding:3px 8px;border-radius:4px;font-size:10px;font-weight:500;cursor:pointer;transition:all .15s;border:none}
.code-copy-btn{background:rgba(0,0,0,0.04);color:var(--text-muted)}
.code-copy-btn:hover{background:rgba(0,0,0,0.08);color:var(--text-secondary)}
.code-copy-btn.copied{color:var(--green)}
.code-run-btn{background:rgba(137,180,250,0.1);color:var(--text-muted)}
.code-run-btn:hover{background:rgba(137,180,250,0.15);color:var(--text-secondary)}
.code-block-body{display:flex;overflow:hidden}
.code-line-numbers{display:flex;flex-direction:column;padding:10px 0;min-width:36px;text-align:right;background:rgba(0,0,0,0.02);border-right:1px solid var(--border-light);user-select:none}
.code-line-number{font-size:11px;line-height:1.5;color:var(--text-muted);padding:0 8px;font-family:var(--font-mono);opacity:0.5}
.code-block-body pre{margin:0;padding:10px 12px;overflow-x:auto;flex:1;background:transparent}
.code-block-body pre code{display:block;font-family:var(--font-mono);font-size:12px;line-height:1.5;color:var(--text-secondary);background:none;padding:0;white-space:pre}
.code-block-body.code-collapsed{max-height:280px;overflow:hidden}
.code-expand-btn{display:flex;align-items:center;justify-content:center;gap:6px;padding:8px;text-align:center;font-size:11px;color:#6c7086;background:#1e1e2e;cursor:pointer;border:none;width:100%;transition:all .15s}
.code-expand-btn:hover{color:#cdd6f4;background:#181825}
.code-output{margin:0;border-top:1px solid rgba(255,255,255,0.04);display:none}

/* ====== 管理员面板标签页 ====== */
.admin-tabs{display:flex;gap:2px;padding:8px 16px;border-bottom:1px solid var(--border);background:var(--bg-surface);flex-shrink:0}
.admin-tab-btn{padding:8px 14px;border:none;border-radius:8px 8px 0 0;font-size:12px;font-weight:500;cursor:pointer;background:transparent;color:var(--text-muted);transition:all .15s;position:relative}
.admin-tab-btn:hover{color:var(--text-secondary);background:var(--bg-card-hover)}
.admin-tab-btn.active{color:var(--accent);background:var(--accent-glow)}
.admin-tab-content{display:block}

/* ====== 使用量统计样式 ====== */
.usage-summary{margin-bottom:8px}
.usage-stat-cards{display:flex;gap:10px}
.usage-stat-card{flex:1;background:var(--bg-tertiary);border-radius:10px;padding:14px;text-align:center}
.usage-stat-icon{display:flex;align-items:center;justify-content:center;color:var(--accent);margin-bottom:6px}
.usage-stat-value{font-size:22px;font-weight:700;color:var(--text-primary);line-height:1.2}
.usage-stat-label{font-size:11px;color:var(--text-muted);margin-top:4px}
.usage-table-container{overflow-x:auto}
.usage-table{width:100%;border-collapse:collapse;font-size:12px}
.usage-table th,.usage-table td{padding:8px 10px;text-align:left;border-bottom:1px solid var(--border)}
.usage-table th{background:var(--bg-surface);font-weight:600;color:var(--text-secondary)}
.usage-table td{color:var(--text-primary)}
.usage-table tr:last-child td{border-bottom:none}
.usage-table tr:hover td{background:var(--bg-card-hover)}

/* ====== Mobile Adaptation ====== */

/* ====== Model List (read-only, 设置页只读展示) ====== */
.model-item{
  display:flex;align-items:center;gap:10px;
  padding:12px 14px;border-radius:10px;border:1px solid var(--border);
  margin-bottom:8px;
}
.model-item-logo{width:28px;height:28px;border-radius:7px;flex-shrink:0;object-fit:contain}
.model-info{flex:1;min-width:0}
.model-name{font-size:14px;font-weight:600;color:var(--text-primary)}
.model-meta{font-size:11px;color:var(--text-muted);margin-top:2px}

@media (max-width: 480px) {
  .msg{max-width:92%;margin-bottom:10px}
  .msg-bubble{padding:10px 12px;font-size:13px}
  .msg-label{font-size:10px;padding:3px 3px 0}
  .input-area{padding:8px 10px calc(8px + var(--safe-bottom))}
  .input-wrapper{border-radius:16px;padding:4px 4px 4px 4px}
  .send-btn{width:48px;height:48px;border-radius:12px;min-width:48px;min-height:48px}
  .stop-btn{width:48px;height:48px;border-radius:12px;min-width:48px;min-height:48px}
  .input-clear-btn{width:44px;height:44px;min-width:44px;min-height:44px}
  .plus-btn{width:44px;height:44px;border-radius:10px;min-width:44px;min-height:44px}
  .code-block-container{margin-left:-12px;margin-right:-12px;border-radius:0;border-left:none;border-right:none}
  .code-block-header{padding:6px 10px}
  .code-block-body pre{padding:10px}
  .code-copy-btn,.code-run-btn{padding:8px 12px;font-size:11px;min-width:44px;min-height:44px}
  .msg-actions{padding-top:6px;gap:4px}
  .msg-action-btn{width:44px;height:44px;min-width:44px;min-height:44px}
  .chat-area{padding:12px 10px 6px}
  .header{padding:8px 10px;min-height:44px}
  .header-title{font-size:13px}
  .header-title .logo{width:28px;height:28px;font-size:13px;border-radius:6px}
  .header-btn{width:44px;height:44px;min-width:44px;min-height:44px;font-size:16px}
  .input-tool-btn{width:44px;height:44px;min-width:44px;min-height:44px}
  .floating-selector{width:95vw;max-width:95vw}
  .drawer{width:92%;max-width:92%}
  .modal{max-width:95%}
  .agent-panel{width:95vw;max-width:95vw}
  .batch-edit-panel{width:95vw;max-width:95vw}
  .quote-card{padding:10px 12px;min-height:44px}
  #searchPanel{min-width:calc(100vw - 20px);width:calc(100vw - 20px);left:10px;transform:none}
  .bookmark-panel{width:90vw;max-width:90vw}
}

@media (max-width: 360px) {
  .msg{max-width:95%}
  .msg-bubble{padding:10px 12px;font-size:13px}
  .input-area{padding:6px 8px}
  .send-btn{width:52px;height:52px}
  .header-actions .header-btn#btnHistory,
  .header-actions .header-btn#btnWorkspace{display:none}
}

/* Quote Area */
#quoteArea {
  margin-bottom: 8px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.quote-card {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  background: linear-gradient(135deg, var(--bg-elevated) 0%, var(--bg-tertiary) 100%);
  border: 1px solid var(--border);
  border-left: 4px solid var(--accent);
  border-radius: 8px;
  font-size: 13px;
  max-width: 100%;
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
  transition: all 0.2s ease;
}

.quote-card:hover {
  transform: translateX(2px);
  box-shadow: 0 4px 10px rgba(0,0,0,0.15);
}

.quote-icon {
  display: flex;
  align-items: center;
  color: var(--accent);
  flex-shrink: 0;
}

.quote-label {
  font-weight: 700;
  color: var(--accent);
  flex-shrink: 0;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.quote-content {
  color: var(--text-secondary);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 1;
  min-width: 0;
  line-height: 1.4;
}

.quote-time {
  color: var(--text-muted);
  font-size: 11px;
  flex-shrink: 0;
}

.quote-remove {
  background: none;
  border: none;
  padding: 2px;
  cursor: pointer;
  color: var(--text-muted);
  display: flex;
  align-items: center;
  border-radius: 4px;
  opacity: 0;
  transition: opacity 0.15s, color 0.15s;
  flex-shrink: 0;
}

.quote-card:hover .quote-remove {
  opacity: 1;
}

.quote-remove:hover {
  color: var(--accent);
  background: var(--bg-card-hover);
}

/* Message Quote Bubbles */
.msg-quotes {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--border);
}

.msg-quote-bubble {
  background: linear-gradient(135deg, var(--bg-elevated) 0%, var(--bg-tertiary) 100%);
  border: 1px solid var(--border);
  border-left: 4px solid var(--accent);
  border-radius: 10px;
  padding: 10px 12px;
  font-size: 13px;
  position: relative;
  box-shadow: 0 2px 8px rgba(0,0,0,0.15);
  transition: all 0.2s ease;
  cursor: pointer;
}

.msg-quote-bubble:hover {
  transform: translateX(4px);
  box-shadow: 0 4px 12px rgba(0,0,0,0.2);
  border-left-color: var(--accent-hover);
}

.msg-quote-bubble:hover .msg-quote-jump {
  opacity: 1;
}

.msg-quote-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
}

.msg-quote-seq {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--accent);
  color: white;
  font-size: 11px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.msg-quote-icon {
  display: flex;
  align-items: center;
  color: var(--accent);
}

/* Search Panel Styles */
#searchPanel {
  display: none;
  position: fixed;
  top: 60px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 12px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.3);
  z-index: var(--z-menu);
  align-items: center;
  gap: 8px;
  min-width: 400px;
}

.search-input-wrapper {
  flex: 1;
  position: relative;
}

#searchInput {
  width: 100%;
  padding: 8px 12px;
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: 8px;
  color: var(--text-primary);
  font-size: 14px;
  outline: none;
}

#searchInput:focus {
  border-color: var(--accent);
}

.search-count {
  font-size: 12px;
  color: var(--text-muted);
  min-width: 50px;
  text-align: center;
}

.search-nav-btn {
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: 6px;
  color: var(--text-primary);
  cursor: pointer;
  padding: 6px 10px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.search-nav-btn:hover:not(:disabled) {
  background: var(--bg-card-hover);
}

.search-nav-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.search-close-btn {
  background: none;
  border: none;
  color: var(--text-muted);
  cursor: pointer;
  padding: 4px;
}

.search-close-btn:hover {
  color: var(--text-primary);
}

.search-highlight {
  background: rgba(245, 158, 11, 0.2) !important;
  border-radius: 4px;
}

.msg-quote-label {
  font-weight: 700;
  color: var(--accent);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.msg-quote-time {
  color: var(--text-muted);
  font-size: 11px;
  margin-left: auto;
}

.msg-quote-jump {
  position: absolute;
  right: 8px;
  bottom: 8px;
  opacity: 0;
  transition: opacity 0.2s;
  color: var(--accent);
  font-size: 11px;
  display: flex;
  align-items: center;
  gap: 4px;
}

.msg-quote-content {
  color: var(--text-secondary);
  line-height: 1.6;
  font-size: 13px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

/* Quote Menu */
.quote-menu {
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 4px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.3);
  min-width: 160px;
}

.quote-menu-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 13px;
  color: var(--text-primary);
  transition: background 0.15s;
}

.quote-menu-item:hover {
  background: var(--bg-card);
}

.quote-menu-item svg {
  color: var(--text-muted);
  flex-shrink: 0;
}

/* Text select mode */
.text-select-mode {
  user-select: text;
  -webkit-user-select: text;
}

.text-select-mode::selection,
.text-select-mode *::selection {
  background: rgba(245, 158, 11, 0.3);
}



/* Tool Suggest Panel */
.tool-suggest-panel {
  position: fixed;
  bottom: calc(var(--bottom-h, 140px) + 12px);
  left: 50%;
  transform: translateX(-50%);
  width: calc(100% - 32px);
  max-width: 448px;
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: 12px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
  z-index: var(--z-menu);
  max-height: 280px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.tool-suggest-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 12px;
  border-bottom: 1px solid var(--border);
  background: var(--bg-secondary);
}

.tool-suggest-title {
  font-size: 12px;
  font-weight: 600;
  color: var(--text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.tool-suggest-close {
  background: none;
  border: none;
  color: var(--text-muted);
  cursor: pointer;
  padding: 4px;
  font-size: 14px;
  line-height: 1;
  opacity: 0.7;
  transition: opacity 0.2s;
}

.tool-suggest-close:hover {
  opacity: 1;
}

.tool-suggest-list {
  overflow-y: auto;
  padding: 6px;
}

.tool-suggest-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.15s ease;
  min-height: 48px;
}

.tool-suggest-item:hover {
  background: var(--bg-hover);
}

.tool-suggest-item:active {
  background: var(--bg-active);
}

.tool-suggest-icon {
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--accent);
  border-radius: 8px;
  flex-shrink: 0;
}

.tool-suggest-icon svg {
  width: 16px;
  height: 16px;
  color: white;
}

.tool-suggest-info {
  flex: 1;
  min-width: 0;
}

.tool-suggest-name {
  font-size: 13px;
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: 2px;
}

.tool-suggest-desc {
  font-size: 11px;
  color: var(--text-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.tool-suggest-score {
  font-size: 11px;
  color: var(--accent);
  font-weight: 600;
  background: rgba(52, 211, 153, 0.15);
  padding: 2px 6px;
  border-radius: 4px;
}

.tool-suggest-empty {
  text-align: center;
  padding: 20px;
  color: var(--text-muted);
  font-size: 13px;
}

/* Multi-Step Executor Panel */
.executor-panel {
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: 12px;
  margin: 12px 0;
  overflow: hidden;
  transition: all 0.3s ease;
}

.executor-panel.completed {
  border-color: var(--accent);
}

.executor-panel.aborted {
  opacity: 0.7;
}

.executor-panel.recovered {
  border-color: #f59e0b;
}

.executor-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  background: var(--bg-secondary);
  border-bottom: 1px solid var(--border);
}

.executor-title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 600;
  color: var(--text-primary);
}

.executor-actions {
  display: flex;
  gap: 8px;
}

.executor-btn {
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 6px;
  cursor: pointer;
  color: var(--text-secondary);
  transition: all 0.2s;
}

.executor-btn:hover {
  background: var(--bg-hover);
  color: var(--text-primary);
}

.executor-btn-stop:hover {
  background: rgba(248, 113, 113, 0.2);
  border-color: #f38ba8;
  color: #f38ba8;
}

.executor-progress {
  padding: 12px 16px;
  background: var(--bg-surface);
}

.executor-progress-bar {
  height: 6px;
  background: var(--bg-secondary);
  border-radius: 3px;
  overflow: hidden;
  margin-bottom: 8px;
}

.executor-progress-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--accent), #34d399);
  border-radius: 3px;
  transition: width 0.3s ease;
}

.executor-progress-text {
  font-size: 12px;
  color: var(--text-muted);
  text-align: center;
}

.executor-steps {
  padding: 12px 16px;
  max-height: 300px;
  overflow-y: auto;
}

.executor-step {
  display: flex;
  gap: 12px;
  padding: 8px 0;
  position: relative;
}

.executor-step-indicator {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex-shrink: 0;
}

.executor-step-icon {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 700;
  background: var(--bg-secondary);
  color: var(--text-muted);
  border: 2px solid var(--border);
  transition: all 0.3s;
  z-index: 1;
}

.executor-step-icon.pending {
  background: var(--bg-secondary);
  color: var(--text-muted);
  border-color: var(--border);
}

.executor-step-icon.running {
  background: var(--accent);
  color: white;
  border-color: var(--accent);
  animation: pulse 1.5s infinite;
}

.executor-step-icon.completed {
  background: #34d399;
  color: white;
  border-color: #34d399;
}

.executor-step-line {
  width: 2px;
  flex: 1;
  background: var(--border);
  margin-top: 4px;
  min-height: 20px;
}

.executor-step[data-status="completed"] .executor-step-line {
  background: #34d399;
}

.executor-step[data-status="running"] .executor-step-line {
  background: linear-gradient(180deg, var(--accent), var(--border));
}

.executor-step:last-child .executor-step-line {
  display: none;
}

.executor-step-content {
  flex: 1;
  padding-bottom: 8px;
}

.executor-step-action {
  font-size: 12px;
  font-weight: 600;
  color: var(--accent);
  text-transform: uppercase;
  margin-bottom: 2px;
}

.executor-step-desc {
  font-size: 14px;
  color: var(--text-primary);
  line-height: 1.4;
}

.executor-step-tool {
  display: none;
  font-size: 11px;
  color: var(--text-muted);
  margin-top: 4px;
  background: var(--bg-secondary);
  padding: 2px 8px;
  border-radius: 4px;
  width: fit-content;
}

.executor-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  background: var(--bg-secondary);
  border-top: 1px solid var(--border);
}

.executor-time {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: var(--text-muted);
}

.executor-btn-primary {
  padding: 8px 20px;
  background: var(--accent);
  color: white;
  border: none;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
}

.executor-btn-primary:hover {
  background: var(--accent-hover);
  transform: translateY(-1px);
}

.executor-btn-primary:disabled {
  background: var(--bg-muted);
  cursor: not-allowed;
  transform: none;
}

@keyframes pulse-dot {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.3; }
}

@keyframes pulse {
  0%, 100% {
    box-shadow: 0 0 0 0 rgba(52, 211, 153, 0.4);
  }
  50% {
    box-shadow: 0 0 0 8px rgba(52, 211, 153, 0);
  }
}

@media (max-width: 480px) {
  .tool-suggest-panel {
    left: 8px;
    right: 8px;
  }
  
  .tool-suggest-item {
    min-height: 52px;
    padding: 12px;
  }
  
  .executor-panel {
    margin: 8px -12px;
    border-radius: 0;
    border-left: none;
    border-right: none;
  }
}

/* Context Summary Panel */
.context-summary-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: calc(var(--z-sheet) - 1);
  opacity: 0;
  transition: opacity 0.2s ease;
}

.context-summary-overlay.show {
  opacity: 1;
}

.context-summary-panel {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0.9);
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: 16px;
  width: 90%;
  max-width: 480px;
  z-index: var(--z-sheet);
  opacity: 0;
  transition: all 0.2s ease;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4);
}

.context-summary-panel.show {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}

.context-summary-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid var(--border);
}

.context-summary-title {
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 600;
  font-size: 16px;
  color: var(--text-primary);
}

.context-summary-close {
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: none;
  border: none;
  color: var(--text-muted);
  cursor: pointer;
  border-radius: 6px;
  transition: all 0.2s;
}

.context-summary-close:hover {
  background: var(--bg-hover);
  color: var(--text-primary);
}

.context-summary-stats {
  display: flex;
  gap: 16px;
  padding: 16px 20px;
  border-bottom: 1px solid var(--border);
}

.context-stat {
  flex: 1;
  text-align: center;
  padding: 12px;
  background: var(--bg-secondary);
  border-radius: 10px;
}

.context-stat-value {
  font-size: 24px;
  font-weight: 700;
  color: var(--accent);
  margin-bottom: 4px;
}

.context-stat-label {
  font-size: 12px;
  color: var(--text-muted);
}

.context-summary-content {
  padding: 16px 20px;
  border-bottom: 1px solid var(--border);
}

.context-summary-label {
  font-size: 12px;
  font-weight: 600;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 8px;
}

.context-summary-text {
  font-size: 14px;
  color: var(--text-primary);
  line-height: 1.6;
}

.context-summary-actions {
  display: flex;
  gap: 12px;
  padding: 16px 20px;
}

.context-summary-btn {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 16px;
  background: var(--bg-secondary);
  border: 1px solid var(--border);
  border-radius: 10px;
  color: var(--text-secondary);
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
}

.context-summary-btn:hover {
  background: var(--bg-hover);
  border-color: var(--accent);
  color: var(--accent);
}

@media (max-width: 480px) {
  .context-summary-panel {
    width: 95%;
    border-radius: 12px;
  }
  
  .context-summary-stats {
    flex-direction: column;
    gap: 12px;
  }
}

/* Workflow Editor */
.workflow-editor-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: calc(var(--z-overlay) + 10);
  opacity: 0;
  transition: opacity 0.2s ease;
}

.workflow-editor-overlay.show {
  opacity: 1;
}

.workflow-editor {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0.95);
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: 16px;
  width: 90%;
  max-width: 800px;
  height: 70vh;
  max-height: 600px;
  z-index: var(--z-sheet);
  opacity: 0;
  transition: all 0.25s ease;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4);
  display: flex;
  flex-direction: column;
}

.workflow-editor.show {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}

.workflow-editor-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}

.workflow-editor-title {
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 600;
  font-size: 16px;
  color: var(--text-primary);
}

.workflow-editor-close {
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: none;
  border: none;
  color: var(--text-muted);
  cursor: pointer;
  border-radius: 6px;
  transition: all 0.2s;
}

.workflow-editor-close:hover {
  background: var(--bg-hover);
  color: var(--text-primary);
}

.workflow-editor-body {
  display: flex;
  flex: 1;
  overflow: hidden;
}

.workflow-list {
  width: 220px;
  border-right: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
}

.workflow-list-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  font-size: 12px;
  font-weight: 600;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  border-bottom: 1px solid var(--border);
}

.workflow-add-btn {
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--accent);
  border: none;
  border-radius: 6px;
  color: white;
  cursor: pointer;
  transition: all 0.2s;
}

.workflow-add-btn:hover {
  transform: scale(1.1);
}

.workflow-list-items {
  flex: 1;
  overflow-y: auto;
  padding: 8px;
}

.workflow-list-empty {
  text-align: center;
  padding: 20px;
  color: var(--text-muted);
  font-size: 13px;
}

.workflow-list-item {
  padding: 10px 12px;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.15s;
  margin-bottom: 4px;
}

.workflow-list-item:hover {
  background: var(--bg-hover);
}

.workflow-list-item.active {
  background: var(--accent);
  color: white;
}

.workflow-list-item-name {
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 2px;
}

.workflow-list-item-steps {
  font-size: 11px;
  opacity: 0.7;
}

.workflow-detail {
  flex: 1;
  padding: 16px 20px;
  overflow-y: auto;
}

.workflow-detail-empty {
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: var(--text-muted);
  text-align: center;
  gap: 12px;
}

.workflow-detail-empty p {
  font-size: 14px;
}

.workflow-detail-header {
  margin-bottom: 16px;
}

.workflow-name-input,
.workflow-desc-input {
  width: 100%;
  padding: 10px 12px;
  background: var(--bg-secondary);
  border: 1px solid var(--border);
  border-radius: 8px;
  color: var(--text-primary);
  font-size: 14px;
  margin-bottom: 8px;
  transition: border-color 0.2s;
}

.workflow-name-input:focus,
.workflow-desc-input:focus {
  outline: none;
  border-color: var(--accent);
}

.workflow-steps-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
  font-size: 13px;
  font-weight: 600;
  color: var(--text-secondary);
}

.workflow-step-add-btn {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  background: var(--bg-secondary);
  border: 1px solid var(--border);
  border-radius: 6px;
  color: var(--text-secondary);
  font-size: 12px;
  cursor: pointer;
  transition: all 0.2s;
}

.workflow-step-add-btn:hover {
  background: var(--accent);
  border-color: var(--accent);
  color: white;
}

.workflow-steps-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.workflow-steps-empty {
  text-align: center;
  padding: 30px;
  color: var(--text-muted);
  font-size: 13px;
}

.workflow-step-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px;
  background: var(--bg-secondary);
  border: 1px solid var(--border);
  border-radius: 10px;
  transition: border-color 0.2s;
}

.workflow-step-item:hover {
  border-color: var(--accent);
}

.workflow-step-number {
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--accent);
  color: white;
  border-radius: 50%;
  font-size: 12px;
  font-weight: 700;
  flex-shrink: 0;
}

.workflow-step-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.workflow-step-action {
  padding: 6px 10px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 6px;
  color: var(--text-primary);
  font-size: 12px;
  cursor: pointer;
}

.workflow-step-action:focus {
  outline: none;
  border-color: var(--accent);
}

.workflow-step-input {
  padding: 8px 10px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 6px;
  color: var(--text-primary);
  font-size: 13px;
}

.workflow-step-input:focus {
  outline: none;
  border-color: var(--accent);
}

.workflow-step-delete {
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: none;
  border: none;
  color: var(--text-muted);
  cursor: pointer;
  border-radius: 4px;
  transition: all 0.2s;
  flex-shrink: 0;
}

.workflow-step-delete:hover {
  background: rgba(248, 113, 113, 0.2);
  color: #f38ba8;
}

.workflow-actions {
  display: flex;
  gap: 10px;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--border);
}

.workflow-btn {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 16px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
}

.workflow-btn-primary {
  background: var(--accent);
  border: none;
  color: white;
}

.workflow-btn-primary:hover {
  background: var(--accent-hover);
}

.workflow-btn-run {
  background: rgba(52, 211, 153, 0.15);
  border: 1px solid #34d399;
  color: #34d399;
}

.workflow-btn-run:hover {
  background: rgba(52, 211, 153, 0.25);
}

.workflow-btn-delete {
  background: rgba(248, 113, 113, 0.15);
  border: 1px solid #f38ba8;
  color: #f38ba8;
}

.workflow-btn-delete:hover {
  background: rgba(248, 113, 113, 0.25);
}

@media (max-width: 480px) {
  .workflow-editor {
    width: 95%;
    height: 85vh;
    max-height: none;
    border-radius: 12px;
  }
  
  .workflow-editor-body {
    flex-direction: column;
  }
  
  .workflow-list {
    width: 100%;
    height: 120px;
    border-right: none;
    border-bottom: 1px solid var(--border);
  }
}

/* Data Analysis & Visualization */
.data-modal {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: var(--z-overlay);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity 0.2s ease;
}

.data-modal.show {
  opacity: 1;
}

.data-modal-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
}

.data-modal-content {
  position: relative;
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: 16px;
  width: 90%;
  max-width: 900px;
  max-height: 80vh;
  display: flex;
  flex-direction: column;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4);
}

.data-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid var(--border);
}

.data-modal-title {
  font-weight: 600;
  font-size: 16px;
  color: var(--text-primary);
}

.data-modal-actions {
  display: flex;
  gap: 8px;
}

.data-modal-btn {
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bg-secondary);
  border: 1px solid var(--border);
  border-radius: 8px;
  color: var(--text-secondary);
  cursor: pointer;
  transition: all 0.2s;
}

.data-modal-btn:hover {
  background: var(--accent);
  border-color: var(--accent);
  color: white;
}

.data-modal-body {
  flex: 1;
  overflow: auto;
  padding: 16px 20px;
}

.data-table-wrapper {
  overflow-x: auto;
}

.data-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}

.data-table th,
.data-table td {
  padding: 10px 12px;
  text-align: left;
  border-bottom: 1px solid var(--border);
}

.data-table th {
  background: var(--bg-secondary);
  font-weight: 600;
  color: var(--text-primary);
  position: sticky;
  top: 0;
}

.data-table td {
  color: var(--text-secondary);
}

.data-table tr:hover td {
  background: var(--bg-hover);
}

.data-table-empty {
  text-align: center;
  padding: 40px;
  color: var(--text-muted);
}

.mermaid-container {
  margin: 16px 0;
  text-align: center;
  overflow-x: auto;
}

.mermaid-container svg {
  max-width: 100%;
  height: auto;
}

.mermaid-error {
  color: #f38ba8;
  padding: 12px;
  background: rgba(248, 113, 113, 0.1);
  border-radius: 8px;
  font-size: 13px;
}

.chart-container {
  margin: 16px 0;
  padding: 16px;
  background: var(--bg-surface);
  border-radius: 12px;
  max-width: 600px;
}

.chart-embed-container {
  margin: 16px 0;
}

@media (max-width: 480px) {
  .data-modal-content {
    width: 95%;
    max-height: 90vh;
    border-radius: 12px;
  }
  
  .data-table {
    font-size: 12px;
  }
  
  .data-table th,
  .data-table td {
    padding: 8px;
  }
}

/* Webhook Panel */
.webhook-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: calc(var(--z-sheet) - 1);
  opacity: 0;
  transition: opacity 0.2s ease;
}

.webhook-overlay.show {
  opacity: 1;
}

.webhook-panel {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0.95);
  background: var(--glass-bg-strong);
  border: 1px solid var(--glass-border);
  border-radius: 16px;
  width: 90%;
  max-width: 500px;
  max-height: 70vh;
  z-index: var(--z-sheet);
  opacity: 0;
  transition: all 0.25s ease;
  box-shadow: var(--glass-shadow);
  display: flex;
  flex-direction: column;
}

.webhook-panel.show {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}

.webhook-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}

.webhook-title {
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 600;
  font-size: 16px;
  color: var(--text-primary);
}

.webhook-close {
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: none;
  border: none;
  color: var(--text-muted);
  cursor: pointer;
  border-radius: 6px;
  transition: all 0.2s;
}

.webhook-close:hover {
  background: var(--bg-hover);
  color: var(--text-primary);
}

.webhook-body {
  flex: 1;
  overflow-y: auto;
  padding: 16px 20px;
}

.webhook-list {
  margin-bottom: 16px;
}

.webhook-empty {
  text-align: center;
  padding: 30px;
  color: var(--text-muted);
  font-size: 14px;
}

.webhook-item {
  padding: 14px;
  background: var(--bg-secondary);
  border: 1px solid var(--border);
  border-radius: 10px;
  margin-bottom: 10px;
}

.webhook-item-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 6px;
}

.webhook-item-name {
  font-weight: 600;
  font-size: 14px;
  color: var(--text-primary);
}

.webhook-status {
  font-size: 11px;
  padding: 2px 8px;
  border-radius: 10px;
  background: var(--bg-muted);
  color: var(--text-muted);
}

.webhook-status.active {
  background: rgba(52, 211, 153, 0.15);
  color: #34d399;
}

.webhook-item-url {
  font-size: 12px;
  color: var(--text-muted);
  word-break: break-all;
  margin-bottom: 6px;
}

.webhook-item-events {
  font-size: 12px;
  color: var(--accent);
  margin-bottom: 10px;
}

.webhook-item-actions {
  display: flex;
  gap: 8px;
}

.webhook-action-btn {
  padding: 5px 12px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 6px;
  font-size: 12px;
  color: var(--text-secondary);
  cursor: pointer;
  transition: all 0.2s;
}

.webhook-action-btn:hover {
  background: var(--accent);
  border-color: var(--accent);
  color: white;
}

.webhook-action-delete:hover {
  background: rgba(248, 113, 113, 0.15);
  border-color: #f38ba8;
  color: #f38ba8;
}

.webhook-add-btn {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px;
  background: var(--accent);
  border: none;
  border-radius: 10px;
  color: white;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
}

.webhook-add-btn:hover {
  background: var(--accent-hover);
}

/* Webhook Form */
.webhook-form-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: var(--z-overlay);
  display: flex;
  align-items: center;
  justify-content: center;
}

.webhook-form {
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: 16px;
  width: 90%;
  max-width: 420px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4);
}

.webhook-form-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid var(--border);
}

.webhook-form-title {
  font-weight: 600;
  font-size: 16px;
  color: var(--text-primary);
}

.webhook-form-close {
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: none;
  border: none;
  color: var(--text-muted);
  cursor: pointer;
  border-radius: 6px;
}

.webhook-form-body {
  padding: 20px;
}

.webhook-form-group {
  margin-bottom: 16px;
}

.webhook-form-group label {
  display: block;
  font-size: 13px;
  font-weight: 600;
  color: var(--text-secondary);
  margin-bottom: 6px;
}

.webhook-form-group input {
  width: 100%;
  padding: 10px 12px;
  background: var(--bg-secondary);
  border: 1px solid var(--border);
  border-radius: 8px;
  color: var(--text-primary);
  font-size: 14px;
}

.webhook-form-group input:focus {
  outline: none;
  border-color: var(--accent);
}

.webhook-events-checkboxes {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.webhook-events-checkboxes label {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: var(--text-secondary);
  cursor: pointer;
}

.webhook-events-checkboxes input[type="checkbox"] {
  width: 16px;
  height: 16px;
  cursor: pointer;
}

.webhook-form-footer {
  display: flex;
  gap: 10px;
  padding: 16px 20px;
  border-top: 1px solid var(--border);
}

.webhook-form-btn {
  flex: 1;
  padding: 10px;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
  background: var(--bg-secondary);
  border: 1px solid var(--border);
  color: var(--text-secondary);
}

.webhook-form-btn:hover {
  background: var(--bg-hover);
}

.webhook-form-btn-primary {
  background: var(--accent);
  border-color: var(--accent);
  color: white;
}

.webhook-form-btn-primary:hover {
  background: var(--accent-hover);
}

@media (max-width: 480px) {
  .webhook-panel {
    width: 95%;
    max-height: 85vh;
  }
  
  .webhook-form {
    width: 95%;
  }
}

/* ====== 两行底部布局 V6 ====== */
.bottom-area {
  position: fixed;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  max-width: 480px;
  min-width: 0;
  padding: 12px 16px;
  background: var(--glass-bg-strong);
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(160%);
  backdrop-filter: blur(var(--glass-blur)) saturate(160%);
  border-top: 1px solid var(--glass-border);
  border-radius: 16px 16px 0 0;
  box-shadow: var(--glass-shadow);
  z-index: var(--z-bottom);
  transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

.bottom-area:hover,
.bottom-area:focus-within {
  border-top-color: var(--glass-border-strong);
  box-shadow: var(--glass-shadow), 0 -2px 12px rgba(245, 158, 11, 0.12);
}

.bottom-area:active {
  border-top-color: var(--glass-border-strong);
  box-shadow: var(--glass-shadow), 0 -1px 8px rgba(245, 158, 11, 0.18);
}

.input-row-v2 {
  margin-bottom: 10px;
}

.chat-input-v2 {
  width: 100%;
  height: 60px;
  min-height: 50px;
  max-height: 160px;
  padding: 10px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg-elevated);
  color: var(--text-primary);
  font-size: 14px;
  line-height: 1.5;
  resize: vertical;
  font-family: inherit;
}

.chat-input-v2:focus {
  outline: none;
  border-color: var(--accent);
}

.chat-input-v2::placeholder {
  color: var(--text-muted);
}

.action-row-v2 {
  display: flex;
  align-items: center;
  gap: 8px;
}

.plus-btn-v2 {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-card);
  color: var(--text-primary);
  font-size: 20px;
  font-weight: 400;
  cursor: pointer;
  flex-shrink: 0;
  transition: all 0.2s;
  display: flex;
  align-items: center;
  justify-content: center;
}

.plus-btn-v2:hover {
  background: var(--bg-card-hover);
  border-color: var(--accent);
}

.model-btn-v2 {
  height: 40px;
  padding: 0 14px;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-card);
  color: var(--text-primary);
  cursor: pointer;
  flex-shrink: 0;
  max-width: 160px;
  display: flex;
  align-items: center;
  gap: 6px;
  transition: all 0.2s;
}

.model-btn-v2:hover {
  background: var(--bg-card-hover);
  border-color: var(--accent);
}

.model-btn-name-v2 {
  font-size: 13px;
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 120px;
}

.action-row-right-v2 {
  flex: 1;
  display: flex;
  justify-content: flex-end;
}

.send-btn-v2 {
  height: 40px;
  padding: 0 24px;
  border-radius: 10px;
  background: var(--accent);
  color: #fff;
  border: none;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
}

.send-btn-v2:hover {
  background: var(--accent-dim);
}

.send-btn-v2:active {
  transform: scale(0.98);
}

@media (max-width: 768px) {
  .bottom-area {
    width: 100%;
    border-radius: 16px 16px 0 0;
  }

  .model-btn-v2 {
    max-width: 120px;
  }

  .model-btn-name-v2 {
    max-width: 80px;
  }
}

/* ====== 命令二级子菜单 ====== */
.plus-menu-command {
  position: relative;
}

.plus-menu-arrow {
  font-size: 10px;
  margin-left: auto;
  color: var(--text-muted);
  transition: transform 0.2s;
}

.plus-menu-command.active .plus-menu-arrow {
  transform: rotate(90deg);
}

.plus-submenu {
  position: absolute;
  left: 100%;
  top: 0;
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 6px;
  min-width: 160px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.15);
  z-index: var(--z-menu);
  display: none;
}

.plus-submenu.show {
  display: block;
}

.plus-submenu-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  border-radius: 8px;
  cursor: pointer;
  font-size: 13px;
  color: var(--text-primary);
  transition: background 0.15s;
}

.plus-submenu-item:hover {
  background: var(--bg-card-hover);
}

.plus-submenu-icon {
  font-size: 14px;
}

/* ====== 模型选择抽屉（统一 V1/V2，底部贴底全宽） ====== */
.model-drawer-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.4);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  z-index: calc(var(--z-sheet) - 1);
  display: none;
}

.model-drawer-overlay.open,
.model-drawer-overlay.show {
  display: block;
}

.model-drawer {
  position: fixed;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%) translateY(100%);
  width: 80%;
  max-width: 800px;
  background: var(--glass-bg-strong);
  border: 1px solid var(--glass-border);
  border-bottom: none;
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(160%);
  backdrop-filter: blur(var(--glass-blur)) saturate(160%);
  box-shadow: var(--glass-shadow);
  border-radius: 16px 16px 0 0;
  z-index: var(--z-sheet);
  transition: transform 0.3s ease;
  max-height: 70vh;
  display: flex;
  flex-direction: column;
}

.model-drawer.open {
  transform: translateX(-50%) translateY(0);
}

.model-drawer .model-drawer-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
  font-size: 14px;
  font-weight: 600;
  color: var(--text-primary);
}

.model-drawer .model-drawer-title {
  font-size: 16px;
  font-weight: 600;
  color: var(--text-primary);
}

.model-drawer .model-drawer-close {
  width: 40px;
  height: 40px;
  border-radius: 8px;
  border: none;
  background: var(--bg-card);
  color: var(--text-primary);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
}

.model-drawer .model-drawer-close:hover {
  background: var(--bg-card-hover);
}

.model-drawer .model-drawer-body,
.model-drawer .model-drawer-list {
  flex: 1;
  overflow-y: auto;
  padding: 8px;
}

.model-drawer .model-drawer-item {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 12px 16px;
  border: none;
  background: transparent;
  color: var(--text-primary);
  font-size: 14px;
  cursor: pointer;
  text-align: left;
  transition: all 0.15s;
  border-radius: 8px;
  font-family: inherit;
}

.model-drawer .model-drawer-item + .model-drawer-item {
  margin-top: 4px;
}

.model-drawer .model-drawer-item:hover {
  background: var(--bg-card);
}

.model-drawer .model-drawer-item.active {
  background: var(--accent);
  color: #fff;
  font-weight: 600;
}

.model-drawer .model-drawer-logo {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  object-fit: contain;
  flex-shrink: 0;
}

.model-drawer .model-drawer-name {
  flex: 1;
}

.model-drawer .model-drawer-check {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--accent);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  opacity: 0;
}

.model-drawer .model-drawer-item.active .model-drawer-check {
  opacity: 1;
}

@media (max-width: 600px) {
  .model-drawer {
    width: 100%;
    border-radius: 16px 16px 0 0;
  }
  .model-drawer .model-drawer-item {
    padding: 10px 12px;
  }
}

/* ====== 修复：聊天区不留大块空白 + 不被底部输入框挡住 ====== */
#app {
  padding-bottom: 0 !important;
}

/* 把 220px 的底部空间移到 chat-area 自身 padding-bottom：
   这样 flex:1 不会把 chat-area 撑高，下方空白区域被 chat-area 自身的 scroll 消化掉 */
.chat-area {
  padding-bottom: calc(var(--bottom-h, 140px) + 16px) !important;
}

.messages, #messages, .chat-list, main > *:not(.input-area):not(.input-tools):not(#bottomArea) {
  padding-bottom: 20px;
}

/* ====== 修复：+ 菜单 z-index ====== */
.plus-menu {
  z-index: var(--z-menu) !important;
}
.plus-submenu {
  z-index: var(--z-menu) !important;
}

/* ====== 修复：模型抽屉 z-index（已统一，无 V2 类名） ====== */

/* ====== 修复：底部栏 z-index（需高于 #app 但低于菜单/抽屉） ====== */
.bottom-area {
  z-index: var(--z-bottom);
}

/* ====== 修复：全屏浮层打开时隐藏底部输入区 ======
   遮罩为半透明（0.4~0.85），输入区层级低于遮罩但仍会透出来。
   用 visibility/opacity 而非 display，保持占位盒高度不变，
   避免 ResizeObserver 把 --bottom-h 归零导致聊天区跳动。 */
body.overlay-active .bottom-area,
body.overlay-active .plus-menu-v2 {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
}

/* ====== V2 + 菜单（独立于旧 .plus-menu，不受 oldInputArea 影响） ====== */
.plus-menu-v2 {
  position: fixed;
  bottom: calc(var(--bottom-h, 140px) + 12px);
  left: 50%;
  transform: translateX(-50%) translateY(8px) scale(0.96);
  width: 220px;
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 6px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.15);
  display: none;
  z-index: var(--z-menu);
  opacity: 0;
  transition: opacity 0.18s ease, transform 0.18s cubic-bezier(0.16,1,0.3,1);
}

.plus-menu-v2.open {
  display: block;
  opacity: 1;
  transform: translateX(-50%) translateY(0) scale(1);
}

.plus-menu-v2 .plus-menu-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.15s;
  font-size: 13px;
  color: var(--text-secondary);
  font-weight: 500;
}

.plus-menu-v2 .plus-menu-item:hover {
  background: var(--bg-card-hover);
  color: var(--text-primary);
}

.plus-menu-v2 .plus-menu-item:active {
  transform: scale(0.97);
}

.plus-menu-v2 .plus-menu-item svg {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
}

.plus-menu-v2 .plus-menu-divider {
  height: 1px;
  background: var(--border-light);
  margin: 4px 0;
  padding: 0;
}

.plus-menu-v2 .plus-submenu {
  position: absolute;
  left: 100%;
  top: 0;
  margin-left: 6px;
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 6px;
  min-width: 160px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.15);
  z-index: var(--z-menu);
}

@media (max-width: 480px) {
  .plus-menu-v2 {
    bottom: calc(var(--bottom-h, 140px) + 12px);
    width: calc(100vw - 32px);
    max-width: 240px;
  }
}

/* ====== Task 9: 无障碍与人体工学修复 ====== */

/* 9.1 触控目标：最小命中区 ≥40×40 */
.modal-btn{min-height:40px;min-width:40px}
/* 11.7 文件操作按钮（默认 opacity:0，hover/active 显形）桌面命中区 ≥40×40 */
.file-action-btn{min-width:40px;min-height:40px}
.spec-doc-tab{min-height:40px}
.diff-side-toolbar .diff-tool-btn{min-height:40px}
.diff-side-footer button{min-height:40px}
.header-user-btn{
  min-height:40px;min-width:40px;display:inline-flex;align-items:center;justify-content:center;
}

/* 9.7 补齐 hover / active / disabled 交互态 */
.modal-btn:hover{background:var(--bg-card-hover)}
.modal-btn.primary:hover{background:var(--accent-hover)}
.modal-btn.danger:hover{background:rgba(239,68,68,0.08)}
.modal-btn:disabled{opacity:0.5;cursor:not-allowed;transform:none}
.spec-doc-tab:active{transform:translateY(1px)}
.spec-doc-tab:disabled{opacity:0.5;cursor:not-allowed;transform:none}
.header-user-btn:hover{background:var(--bg-card-hover);color:var(--text-primary)}
.header-user-btn:active{transform:scale(0.96)}
.header-user-btn:disabled{opacity:0.5;cursor:not-allowed}

/* 9.3 统一 :focus-visible 焦点环（深 amber，对白/浅灰底 ≥4.5:1） */
:focus-visible{
  outline:2px solid var(--focus-ring);
  outline-offset:2px;
}

/* 9.1 小屏（<768px）触控目标提升至 44×44 */
@media (max-width: 767px){
  .header-btn{width:44px;height:44px}
  .editor-btn,.preview-btn{width:44px;height:44px}
  .drawer-close,.model-drawer .model-drawer-close{width:44px;height:44px}
  .send-btn,.stop-btn,.send-btn-v2{min-height:44px}
  .modal-btn,.spec-doc-tab,.diff-side-footer button,.header-user-btn,.diff-side-toolbar .diff-tool-btn{
    min-height:44px;min-width:44px;
  }
  /* 11.7 底部输入区 "+" 与文件操作按钮；模型按钮为宽药丸，仅提高度 */
  .plus-btn-v2,.file-action-btn{min-width:44px;min-height:44px}
  .model-btn-v2{min-height:44px}
}

/* 9.4 / 9.5 减少动态效果 */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:0.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:0.01ms !important;
    scroll-behavior:auto !important;
  }
  /* 禁用无限装饰动画 */
  .spin,[class*="spin"],[class*="pulse"],.typing-dot,.queue-icon,.agent-spinner{
    animation:none !important;
  }
}

/* ====== Task 8: 毛玻璃降级方案 ====== */
/* 不支持 backdrop-filter 时，回退为不透明表面，保证可读性与对比度 ≥4.5:1 */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))){
  .glass,
  .header,
  .bottom-area,
  .drawer,
  .model-drawer,
  .git-overlay-panel,
  .git-merge-dialog,
  .diff-modal,
  .agent-panel,
  .batch-edit-panel,
  .mode-selector-modal,
  .project-creator-modal,
  .modal,
  .webhook-panel,
  .preview-container,
  .preview-header,
  .editor-container,
  .editor-header,
  .msg.ai .ai-content,
  .tool-header,
  .tool-result{
    background: var(--bg-surface);
  }
}