/* ===== ThirdHub ai-chat.css — AI 对话页 + 模型选择器 ===== */
.ai-page { display: flex; flex-direction: column; overflow: hidden; }
.ai-wrap { display: flex; flex-direction: column; flex: 1; min-height: 0; }

/* 顶栏：左菜单 / 中间胶囊居中 / 右新对话 */
.ai-topbar {
  flex-shrink: 0; z-index: 15;
  display: flex; align-items: center; gap: 8px;
  padding: 10px 14px 8px;
  background: linear-gradient(var(--bg-page) 80%, transparent);
}
.ai-topbar-center {
  flex: 1; min-width: 0;
  display: flex; justify-content: center; align-items: center; gap: 8px;
}
.ai-pill {
  display: flex; align-items: center; gap: 7px;
  padding: 8px 13px; border-radius: 999px;
  background: var(--bg-card); box-shadow: var(--shadow-card);
  font-size: 13px; font-weight: 600; max-width: 46%;
  transition: transform .15s;
}
.ai-pill:active { transform: scale(.95); }
.ai-pill .vendor-ico { width: 20px; height: 20px; }
.ai-pill .pill-text { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.ai-pill .pill-arrow { color: var(--text-tertiary); font-size: 10px; }

/* 左侧抽屉（Kimi 式） */
.ai-drawer-mask {
  position: absolute; inset: 0; z-index: 60;
  background: rgba(0,0,0,.5); opacity: 0; pointer-events: none;
  transition: opacity .25s;
}
.ai-drawer-mask.open { opacity: 1; pointer-events: auto; }
.ai-drawer {
  position: absolute; top: 0; bottom: 0; left: 0; z-index: 61;
  width: min(300px, 82vw);
  background: var(--bg-page); border-right: 1px solid var(--border);
  transform: translateX(-100%); transition: transform .3s cubic-bezier(.4,0,.2,1);
  display: flex; flex-direction: column;
  padding: calc(14px + env(safe-area-inset-top)) 12px 12px;
}
.ai-drawer.open { transform: translateX(0); }
.ai-drawer-head { display: flex; align-items: center; gap: 9px; padding: 2px 6px 14px; }
.ai-drawer-logo {
  width: 34px; height: 34px; border-radius: 11px; display: grid; place-items: center;
  background: linear-gradient(135deg, var(--primary), var(--primary-deep)); color: #fff;
}
.ai-drawer-logo svg { width: 20px; height: 20px; }
.ai-drawer-title { font-size: 15px; font-weight: 800; }
.ai-drawer-item {
  display: flex; align-items: center; gap: 11px;
  width: 100%; text-align: left;
  padding: 11px 12px; border-radius: 12px; margin-bottom: 4px;
  font-size: 14px; font-weight: 600; color: var(--text-primary);
  background: var(--bg-card); box-shadow: var(--shadow-card);
  transition: transform .15s;
}
.ai-drawer-item:active { transform: scale(.97); }
.ai-drawer-item svg { width: 19px; height: 19px; flex-shrink: 0; color: var(--text-secondary); }
.ai-drawer-item span:nth-child(2) { flex: 1; }
.ai-drawer-arrow { color: var(--text-tertiary); display: inline-flex; }
.ai-drawer-arrow svg { width: 15px; height: 15px; }
.ai-drawer-sec { font-size: 12px; font-weight: 700; color: var(--text-tertiary); padding: 14px 8px 8px; }
.ai-drawer-sessions { flex: 1; overflow-y: auto; min-height: 0; display: flex; flex-direction: column; gap: 2px; }
.ai-drawer-empty { text-align: center; color: var(--text-tertiary); font-size: 12.5px; padding: 18px 0; }
.ai-session {
  display: flex; align-items: center; gap: 9px;
  width: 100%; text-align: left; padding: 9px 10px; border-radius: 10px;
  transition: background .15s;
}
.ai-session:active { background: var(--bg-input); }
.ai-session.on { background: rgba(59,91,253,.12); }
.ai-session-ico { width: 26px; height: 26px; border-radius: 8px; display: grid; place-items: center; background: var(--bg-card); color: var(--text-tertiary); flex-shrink: 0; }
.ai-session-ico svg { width: 15px; height: 15px; }
.ai-session-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.ai-session-title { font-size: 13.5px; font-weight: 600; color: var(--text-primary); }
.ai-session-date { font-size: 11px; color: var(--text-tertiary); }
.ai-session-del { width: 26px; height: 26px; border-radius: 7px; display: grid; place-items: center; color: var(--text-tertiary); flex-shrink: 0; }
.ai-session-del:active { color: var(--danger); background: var(--bg-input); }
.ai-session-del svg { width: 14px; height: 14px; }

/* 欢迎区（居中） */
.ai-welcome {
  margin: auto; padding: 20px 8px 30px;
  display: flex; flex-direction: column; align-items: center; text-align: center;
  max-width: 560px; width: 100%;
  animation: msg-in .25s ease;
}
.ai-welcome-logo {
  width: 72px; height: 72px; border-radius: 22px;
  display: grid; place-items: center; color: #fff;
  background: linear-gradient(135deg, var(--primary), var(--primary-deep));
  box-shadow: 0 10px 26px rgba(59,91,253,.35);
  margin-bottom: 16px;
}
.ai-welcome-logo svg { width: 38px; height: 38px; }
.ai-welcome-title { font-size: 22px; font-weight: 800; margin-bottom: 8px; }
.ai-welcome-sub { font-size: 13px; color: var(--text-tertiary); margin-bottom: 22px; }
.ai-welcome-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; width: 100%; }
.ai-welcome-card {
  display: flex; flex-direction: column; align-items: flex-start; gap: 5px;
  padding: 14px; border-radius: 14px; text-align: left;
  background: var(--bg-card); box-shadow: var(--shadow-card);
  transition: transform .15s;
}
.ai-welcome-card:active { transform: scale(.96); }
.ai-welcome-card-ico { width: 32px; height: 32px; border-radius: 10px; display: grid; place-items: center; background: rgba(59,91,253,.12); color: var(--primary); }
.ai-welcome-card-ico svg { width: 18px; height: 18px; }
.ai-welcome-card-t { font-size: 14px; font-weight: 700; color: var(--text-primary); }
.ai-welcome-card-d { font-size: 11.5px; color: var(--text-tertiary); }

/* 消息区：宽屏居中 */
.ai-messages { flex: 1; overflow-y: auto; padding: 4px 16px 12px; display: flex; flex-direction: column; gap: 14px; }
@media (min-width: 768px) {
  .ai-messages > * { max-width: 780px; width: 100%; margin-left: auto; margin-right: auto; }
}
.msg { display: flex; gap: 10px; max-width: 100%; animation: msg-in .22s ease; }
@keyframes msg-in { from { opacity: 0; transform: translateY(8px); } }
.msg-avatar { width: 34px; height: 34px; border-radius: 12px; flex-shrink: 0; display: grid; place-items: center; background: var(--bg-card); box-shadow: var(--shadow-card); }
.msg-avatar .vendor-ico, .msg-avatar svg { width: 22px; height: 22px; }
.msg.user { flex-direction: row-reverse; }
.msg.user .msg-avatar { background: linear-gradient(135deg, var(--primary), var(--primary-deep)); color: #fff; }
.msg-body { min-width: 0; max-width: calc(100% - 46px); }
.msg-meta { font-size: 11px; color: var(--text-tertiary); margin-bottom: 4px; display: flex; gap: 8px; align-items: center; }
.msg.user .msg-meta { justify-content: flex-end; }
.msg-bubble {
  padding: 12px 14px; border-radius: 16px;
  background: var(--bg-card); box-shadow: var(--shadow-card);
  font-size: 15px; line-height: 1.75; word-break: break-word; overflow-wrap: anywhere;
}
.msg.user .msg-bubble { background: linear-gradient(135deg, var(--primary), var(--primary-deep)); color: #fff; border-top-right-radius: 6px; }
.msg.assistant .msg-bubble { border-top-left-radius: 6px; }
.msg-bubble img { border-radius: 10px; margin-top: 8px; }
.msg-actions { display: flex; gap: 4px; margin-top: 6px; opacity: .85; }
.msg-act { width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; color: var(--text-tertiary); background: var(--bg-card); }
.msg-act svg { width: 16px; height: 16px; }
.msg-act:active { transform: scale(.88); }

/* 流式光标 */
.streaming::after { content: '▍'; color: var(--primary); animation: blink .8s infinite; }
@keyframes blink { 50% { opacity: 0; } }

/* 多模型对比 */
.compare-grid { display: grid; gap: 10px; }
@media (min-width: 768px) { .compare-grid { grid-template-columns: 1fr 1fr; } }
.compare-cell { background: var(--bg-card); border-radius: 14px; padding: 12px; box-shadow: var(--shadow-card); }
.compare-head { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; font-size: 12px; font-weight: 700; }
.compare-head .vendor-ico { width: 20px; height: 20px; }

/* 输入栏 */
.ai-inputbar {
  flex-shrink: 0; padding: 8px 12px calc(10px + env(safe-area-inset-bottom));
  background: var(--bg-page);
}
.ai-input-row {
  display: flex; align-items: flex-end; gap: 8px;
  background: var(--bg-card); border-radius: 22px; padding: 6px 8px 6px 6px;
  box-shadow: var(--shadow-card); border: 1px solid var(--border);
}
.ai-tool-btn { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; color: var(--text-tertiary); flex-shrink: 0; transition: all .2s; }
.ai-tool-btn:active { transform: scale(.85); }
.ai-tool-btn.on { color: var(--primary); background: rgba(59,91,253,.12); }
.ai-tool-btn.recording { color: #fff; background: var(--danger); animation: pulse 1.2s infinite; }
@keyframes pulse { 50% { box-shadow: 0 0 0 8px rgba(255,77,79,.18); } }
.ai-plus-btn {
  width: 38px; height: 38px; border-radius: 50%; flex-shrink: 0;
  display: grid; place-items: center;
  background: var(--bg-input); color: var(--text-secondary);
  transition: transform .2s;
}
.ai-plus-btn:active { transform: scale(.85) rotate(90deg); }
.ai-plus-btn svg { width: 20px; height: 20px; }

/* 附件预览条 */
.ai-attach-strip { display: flex; gap: 8px; padding: 2px 4px 8px; overflow-x: auto; }
.ai-attach-chip { position: relative; width: 52px; height: 52px; border-radius: 10px; overflow: hidden; flex-shrink: 0; box-shadow: var(--shadow-card); }
.ai-attach-chip img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ai-attach-x {
  position: absolute; top: 2px; right: 2px; width: 17px; height: 17px; border-radius: 50%;
  background: rgba(0,0,0,.65); color: #fff; display: grid; place-items: center;
}
.ai-attach-x svg { width: 10px; height: 10px; }
.msg-imgs { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 6px; }
.msg-imgs img { width: 84px; height: 84px; object-fit: cover; border-radius: 9px; }

/* ＋ 面板（OmniHub 式：遮罩 + 底部上滑半屏面板） */
.ai-plus-mask {
  position: absolute; inset: 0; z-index: 60;
  background: rgba(0,0,0,.5); opacity: 0; pointer-events: none;
  transition: opacity .25s;
}
.ai-plus-mask.open { opacity: 1; pointer-events: auto; }
.ai-plus-sheet {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 61;
  background: var(--bg-page); border-radius: 18px 18px 0 0;
  border-top: 1px solid var(--border);
  transform: translateY(102%); transition: transform .3s cubic-bezier(.4,0,.2,1);
  padding: 18px 16px calc(18px + env(safe-area-inset-bottom));
  max-height: 62%; overflow-y: auto;
}
.ai-plus-sheet.open { transform: translateY(0); }
.ai-plus-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 14px; }
.ai-plus-cell {
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  padding: 15px 4px 13px; border-radius: 14px;
  background: var(--bg-card); box-shadow: var(--shadow-card);
  transition: transform .15s;
}
.ai-plus-cell:active { transform: scale(.94); }
.ai-plus-ico {
  width: 46px; height: 46px; border-radius: 50%;
  display: grid; place-items: center;
  background: rgba(59,91,253,.12); color: var(--primary);
}
.ai-plus-ico svg { width: 22px; height: 22px; }
.ai-plus-label { font-size: 12px; color: var(--text-secondary); font-weight: 600; }
.ai-plus-settings { background: var(--bg-card); border-radius: 14px; padding: 4px 14px; box-shadow: var(--shadow-card); }
.ai-plus-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 0; }
.ai-plus-row-info { flex: 1; min-width: 0; }
.ai-plus-row-name { font-size: 14px; font-weight: 600; }
.ai-plus-row-sub { font-size: 11.5px; color: var(--text-tertiary); margin-top: 2px; }
.ai-toggle {
  width: 46px; height: 27px; border-radius: 999px; flex-shrink: 0;
  background: var(--bg-input); position: relative; transition: background .2s;
}
.ai-toggle::after {
  content: ''; position: absolute; top: 3px; left: 3px;
  width: 21px; height: 21px; border-radius: 50%;
  background: #fff; box-shadow: 0 1px 4px rgba(0,0,0,.3);
  transition: transform .2s;
}
.ai-toggle.on { background: var(--primary); }
.ai-toggle.on::after { transform: translateX(19px); }
.ai-toggle.disabled { opacity: .4; }

/* 模型列表子页面 */
.models-page { padding: 4px 16px 26px; max-width: 860px; margin: 0 auto; width: 100%; overflow-y: auto; flex: 1; }
.models-search { margin-bottom: 8px; }
.models-search-box {
  display: flex; align-items: center; gap: 8px;
  background: var(--bg-card); border-radius: 13px; padding: 11px 14px;
  box-shadow: var(--shadow-card); border: 1px solid var(--border);
}
.models-search-box svg { width: 16px; height: 16px; color: var(--text-tertiary); flex-shrink: 0; }
.models-search-box input { flex: 1; border: none; background: none; outline: none; font-size: 14px; color: var(--text-primary); }
.models-hint { font-size: 11.5px; color: var(--text-tertiary); padding: 2px 4px 12px; }
.provider-section { margin-bottom: 20px; }
.provider-head { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; padding: 0 2px; }
.provider-ico { width: 26px; height: 26px; display: inline-flex; }
.provider-ico .vendor-ico { width: 26px; height: 26px; }
.provider-name { font-size: 15px; font-weight: 700; }
.provider-count { font-size: 11.5px; color: var(--text-tertiary); font-weight: 500; }
.provider-head .tag { margin-left: auto; }
.provider-key-link { cursor: pointer; }
.model-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; }
@media (max-width: 480px) { .model-grid { grid-template-columns: 1fr 1fr; } }
.model-card {
  display: flex; align-items: center; gap: 10px;
  padding: 12px 13px; border-radius: 14px; text-align: left;
  background: var(--bg-card); box-shadow: var(--shadow-card);
  border: 1px solid transparent;
  transition: transform .15s;
}
.model-card:active { transform: scale(.97); }
.model-card-ico { width: 34px; height: 34px; flex-shrink: 0; display: inline-flex; }
.model-card-ico .vendor-ico { width: 34px; height: 34px; }
.model-card-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.model-card-name { font-size: 13px; font-weight: 700; color: var(--text-primary); }
.model-card-tags { display: flex; gap: 4px; flex-wrap: wrap; }
.mtag { font-size: 10px; font-weight: 600; padding: 1px 6px; border-radius: 6px; background: var(--bg-input); color: var(--text-tertiary); }
.mtag.vision { color: #6f8bff; background: rgba(59,91,253,.12); }
.mtag.thinking { color: #b48bff; background: rgba(150,91,253,.13); }
.mtag.long { color: var(--accent); background: rgba(245,166,35,.13); }
.mtag.stream { color: #3dd68c; background: rgba(46,204,113,.13); }
.mtag.new { color: #3dd68c; background: rgba(46,204,113,.13); }
.model-card-go { color: var(--text-tertiary); display: inline-flex; flex-shrink: 0; }
.model-card-go svg { width: 14px; height: 14px; }
.icon-btn.spinning svg { animation: spin .7s linear infinite; }
.ai-textarea {
  flex: 1; border: none; background: none; outline: none; resize: none;
  font-size: 15px; line-height: 1.5; max-height: 120px; padding: 9px 2px;
  color: var(--text-primary);
}
.ai-send {
  width: 38px; height: 38px; border-radius: 50%; flex-shrink: 0;
  background: linear-gradient(135deg, var(--primary), var(--primary-deep));
  color: #fff; display: grid; place-items: center;
  box-shadow: 0 3px 10px rgba(59,91,253,.4); transition: transform .15s;
}
.ai-send:active { transform: scale(.88); }
.ai-send.stop { background: var(--danger); }
.ai-token-hint { text-align: center; font-size: 10px; color: var(--text-tertiary); padding-top: 5px; }

/* 模型选择器 */
.ms-search { margin-bottom: 10px; }
.ms-list { display: flex; flex-direction: column; gap: 4px; }
.ms-group { margin-bottom: 8px; }
.ms-vendor { display: flex; align-items: center; gap: 8px; padding: 8px 4px 6px; position: sticky; top: 0; background: var(--bg-page); z-index: 2; }
.ms-vico { width: 26px; height: 26px; }
.ms-vico .vendor-ico { width: 26px; height: 26px; }
.ms-vname { font-size: 13px; font-weight: 700; flex: 1; }
.ms-item {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  width: 100%; text-align: left; padding: 10px 12px; border-radius: 10px;
  font-size: 14px; color: var(--text-primary); transition: background .15s;
}
.ms-item:active { background: var(--bg-input); }
.ms-item.on { background: rgba(59,91,253,.12); color: var(--primary); font-weight: 600; }
.ms-item.dim { opacity: .45; }
.vendor-ico { width: 32px; height: 32px; border-radius: 50%; flex-shrink: 0; }

/* 模式切换 */
.mode-menu .btn { justify-content: flex-start; }

/* 辩论模式 */
.debate-side { font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 6px; }
.debate-pro { background: rgba(46,204,113,.15); color: #3dd68c; }
.debate-con { background: rgba(255,77,79,.13); color: #ff7875; }
.debate-judge { background: rgba(245,166,35,.15); color: var(--accent); }

/* 会话列表 */
.chat-session { display: flex; align-items: center; gap: 10px; padding: 13px 14px; border-radius: 12px; }
.chat-session:active { background: var(--bg-input); }
.chat-session.on { background: rgba(59,91,253,.1); }

/* Markdown */
.md-p { margin: 4px 0; }
.md-h { font-weight: 700; margin: 10px 0 4px; }
.md-h1 { font-size: 19px; } .md-h2 { font-size: 17px; } .md-h3 { font-size: 15.5px; } .md-h4 { font-size: 14.5px; }
.md-code { background: rgba(120,130,160,.18); padding: 1px 6px; border-radius: 5px; font-size: 13px; font-family: ui-monospace, Menlo, Consolas, monospace; }
.md-pre { background: #12141d; border-radius: 12px; margin: 8px 0; overflow: hidden; border: 1px solid rgba(255,255,255,.06); }
.md-pre-head { display: flex; justify-content: space-between; align-items: center; padding: 6px 12px; font-size: 11px; color: #8b93a7; background: rgba(255,255,255,.04); }
.md-copy { font-size: 11px; color: #6f8bff; padding: 2px 8px; border-radius: 6px; background: rgba(59,91,253,.14); }
.md-pre pre { padding: 12px; overflow-x: auto; font-size: 12.5px; line-height: 1.65; color: #d5dbea; font-family: ui-monospace, Menlo, Consolas, monospace; }
.md-ul, .md-ol { padding-left: 20px; margin: 4px 0; }
.md-ul li, .md-ol li { margin: 2px 0; }
.md-quote { border-left: 3px solid var(--primary); padding: 4px 10px; margin: 6px 0; color: var(--text-secondary); background: rgba(59,91,253,.06); border-radius: 0 8px 8px 0; }
.md-hr { border: none; border-top: 1px solid var(--border); margin: 10px 0; }
.msg.user .md-code { background: rgba(255,255,255,.2); }

/* 官方品牌图标（v1.3）：圆角方形白底 + 品牌色字形 / 彩色官方 PNG */
.vendor-ico.brand { display: inline-grid; place-items: center; border-radius: 26%; overflow: hidden; position: relative; box-shadow: var(--shadow-card); }
.vendor-ico.brand svg { width: 68%; height: 68%; }
.vendor-ico.brand img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; background: #fff; }
.vendor-ico.brand .brand-letter { font-size: 12px; font-weight: 700; font-family: system-ui, sans-serif; }

/* Key 自动识别日志 */
.identify-log {
  max-height: 180px; overflow-y: auto;
  background: var(--bg-input); border-radius: 10px;
  padding: 10px 12px; font-size: 12px; line-height: 1.8;
  color: var(--text-secondary); font-family: ui-monospace, Menlo, monospace;
}

/* ================= v1.5 ================= */
[hidden] { display: none !important; }

/* 抽屉联动滑动：对话页随抽屉右移，1/5 区域可点回 */
.ai-wrap { transition: transform .3s cubic-bezier(.4,0,.2,1); }
.ai-wrap.ai-noanim, .ai-drawer.ai-noanim { transition: none !important; }
.ai-peek-mask {
  position: absolute; inset: 0; z-index: 59; display: none;
}
.ai-peek-mask.show { display: block; }
@media (max-width: 768px) {
  .ai-drawer { width: min(80vw, 480px); }
  .ai-drawer.open ~ .ai-wrap, .ai-page:has(.ai-drawer.open) .ai-wrap { transform: translateX(min(80vw, 480px)); }
  .ai-page:has(.ai-drawer.open) .ai-drawer-mask { opacity: 0; pointer-events: none; }
}
@media (min-width: 769px) {
  .ai-peek-mask.show { display: none; }
}

/* 工作区切换条 */
.ai-ws-bar {
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
  padding: 6px 12px; border-bottom: 1px solid var(--border);
  overflow-x: auto; scrollbar-width: none;
}
.ai-ws-bar::-webkit-scrollbar { display: none; }
.ai-ws-chip {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 6px 12px; border-radius: 999px; font-size: 12.5px; font-weight: 600;
  background: var(--bg-card); color: var(--text-secondary);
  border: 1px solid var(--border); white-space: nowrap; flex-shrink: 0;
  transition: all .18s;
}
.ai-ws-chip svg { width: 14px; height: 14px; }
.ai-ws-chip.on { background: var(--primary); border-color: var(--primary); color: #fff; }
.ai-ws-chip.sm { padding: 4px 10px; font-size: 11.5px; }
.ai-ws-sep { width: 1px; height: 16px; background: var(--border); flex-shrink: 0; }

/* 输入栏：空时仅语音键 */
.ai-send.stop { background: var(--bg-card); border: 1px solid var(--border); }
.ai-stop-square {
  width: 14px; height: 14px; border-radius: 3px;
  background: var(--text-primary); display: block;
}
.ai-tool-btn[hidden], .ai-send[hidden] { display: none !important; }

/* 按住说话 */
.ai-voicebar { display: flex; align-items: center; gap: 8px; position: relative; }
.ai-voicebar .ai-tool-btn { flex-shrink: 0; }
.ai-hold-btn {
  flex: 1; height: 42px; border-radius: 21px;
  background: var(--bg-card); border: 1px solid var(--border);
  font-size: 14px; font-weight: 600; color: var(--text-primary);
  user-select: none; -webkit-user-select: none; touch-action: none;
  transition: all .15s; overflow: hidden;
}
.ai-hold-btn.recording { background: var(--primary); border-color: var(--primary); color: #fff; }
.ai-hold-btn.canceling { background: var(--danger); border-color: var(--danger); color: #fff; }
.ai-voice-hint {
  position: absolute; top: -30px; left: 50%; transform: translateX(-50%);
  font-size: 11.5px; color: var(--text-tertiary);
  background: var(--bg-card); padding: 3px 10px; border-radius: 8px;
  border: 1px solid var(--border); white-space: nowrap;
}

/* 思考块（默认折叠） */
.think {
  border: 1px solid var(--border); border-radius: 10px;
  margin-bottom: 8px; overflow: hidden; background: var(--bg-input);
}
.think-head {
  display: flex; align-items: center; gap: 6px; width: 100%;
  padding: 8px 10px; font-size: 12.5px; font-weight: 600; color: var(--text-secondary);
}
.think-head svg { width: 14px; height: 14px; color: var(--primary); }
.think-title { flex: 1; text-align: left; }
.think-chev { transition: transform .2s; display: inline-flex; }
.think-chev svg { color: var(--text-tertiary); }
.think.open .think-chev { transform: rotate(90deg); }
.think-body {
  display: none; padding: 0 12px 10px;
  font-size: 12.5px; line-height: 1.7; color: var(--text-tertiary);
  white-space: pre-wrap; word-break: break-word;
  max-height: 260px; overflow-y: auto;
}
.think.open .think-body { display: block; }

/* 长按重编辑提示 */
.msg-editable { cursor: pointer; }
.msg-editable:active { opacity: .75; }

/* 抽屉 tabs / 筛选 / 底部搜索 */
.ai-dtabs { display: flex; gap: 4px; padding: 10px 0 6px; }
.ai-dtab {
  flex: 1; padding: 7px 0; border-radius: 9px;
  font-size: 13px; font-weight: 600; color: var(--text-secondary);
  transition: all .18s;
}
.ai-dtab.on { background: var(--bg-card); color: var(--primary); box-shadow: var(--shadow-card); }
.ai-dfilters { display: flex; gap: 4px; padding-bottom: 8px; }
.ai-dfilter {
  padding: 4px 10px; border-radius: 999px; font-size: 11.5px;
  color: var(--text-tertiary); border: 1px solid var(--border);
  transition: all .18s;
}
.ai-dfilter.on { color: #fff; background: var(--primary); border-color: var(--primary); }
.ai-drawer-scroll { flex: 1; overflow-y: auto; min-height: 0; }
.ai-drawer-bottom {
  display: flex; gap: 8px; padding-top: 10px;
  border-top: 1px solid var(--border);
}
.ai-dsearch {
  flex: 1; display: flex; align-items: center; gap: 7px;
  background: var(--bg-input); border-radius: 10px; padding: 0 10px; height: 38px;
  border: 1px solid var(--border);
}
.ai-dsearch svg { width: 15px; height: 15px; color: var(--text-tertiary); flex-shrink: 0; }
.ai-dsearch input { flex: 1; background: none; border: 0; outline: 0; font-size: 13px; color: var(--text-primary); min-width: 0; }
.ai-dnew {
  width: 38px; height: 38px; border-radius: 10px; flex-shrink: 0;
  background: var(--primary); color: #fff; display: grid; place-items: center;
}
.ai-dnew svg { width: 18px; height: 18px; }

/* 抽屉 - AI模型列表 */
.ai-dm-vendor { margin-bottom: 8px; }
.ai-dm-vhead {
  display: flex; align-items: center; gap: 7px;
  font-size: 12.5px; font-weight: 700; color: var(--text-secondary);
  padding: 6px 4px;
}
.ai-dm-vhead .vendor-ico, .ai-dm-vhead svg { width: 18px; height: 18px; }
.ai-dm-item {
  display: flex; align-items: center; gap: 7px; width: 100%;
  padding: 7px 8px; border-radius: 8px; font-size: 12.5px;
  color: var(--text-primary); text-align: left;
}
.ai-dm-item:active { background: var(--bg-card); }
.ai-dm-type {
  width: 18px; height: 18px; border-radius: 5px; flex-shrink: 0;
  display: grid; place-items: center; font-size: 10px; font-weight: 700;
}
.ai-dm-type.chat { background: rgba(59,91,253,.15); color: #6f8bff; }
.ai-dm-type.image { background: rgba(155,89,255,.15); color: #b98aff; }
.ai-dm-type.video { background: rgba(255,150,60,.15); color: #ffa94d; }

/* 抽屉 - 智能体 */
.ai-dagent-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 2px 0 6px; }
.ai-dagent {
  display: flex; flex-direction: column; align-items: flex-start; gap: 4px;
  padding: 10px; border-radius: 12px; text-align: left;
  background: var(--bg-card); box-shadow: var(--shadow-card);
  transition: transform .15s;
}
.ai-dagent:active { transform: scale(.96); }
.ai-dagent-ico {
  width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center;
  background: rgba(59,91,253,.12); color: var(--primary);
}
.ai-dagent-ico svg { width: 16px; height: 16px; }
.ai-dagent-name { font-size: 13px; font-weight: 700; color: var(--text-primary); }
.ai-dagent-desc { font-size: 11px; color: var(--text-tertiary); line-height: 1.4; }

/* 抽屉 - 灵感广场 */
.ai-di-group { margin-bottom: 10px; }
.ai-di-cat { font-size: 12px; font-weight: 700; color: var(--text-tertiary); padding: 6px 4px; }
.ai-di-cards { display: flex; flex-direction: column; gap: 6px; }
.ai-di-card {
  display: flex; flex-direction: column; gap: 2px; text-align: left;
  padding: 9px 11px; border-radius: 10px;
  background: var(--bg-card); box-shadow: var(--shadow-card);
}
.ai-di-t { font-size: 13px; font-weight: 600; color: var(--text-primary); }
.ai-di-p { font-size: 11.5px; color: var(--text-tertiary); max-width: 100%; }

/* 模型设置页 */
.mp-top { margin-bottom: 10px; }
.mp-search { height: 40px; }
.models-rank-entry {
  display: flex; align-items: center; gap: 10px; width: 100%;
  padding: 12px 14px; border-radius: 12px; margin-bottom: 12px;
  background: linear-gradient(135deg, rgba(59,91,253,.12), rgba(155,89,255,.10));
  border: 1px solid rgba(59,91,253,.25);
  font-size: 14px; font-weight: 700; color: var(--text-primary);
}
.models-rank-entry svg { width: 18px; height: 18px; color: var(--primary); }
.models-rank-entry .muted { font-size: 11.5px; font-weight: 400; }
.provider-card {
  background: var(--bg-card); border-radius: 14px; margin-bottom: 10px;
  box-shadow: var(--shadow-card); overflow: hidden;
}
.provider-head {
  display: flex; align-items: center; gap: 11px;
  padding: 13px 14px; cursor: pointer; user-select: none;
}
.provider-ico { width: 34px; height: 34px; display: grid; place-items: center; flex-shrink: 0; }
.provider-ico .vendor-ico, .provider-ico svg { width: 30px; height: 30px; }
.provider-info { flex: 1; min-width: 0; }
.provider-name { font-size: 14px; font-weight: 700; }
.provider-sub { font-size: 11.5px; color: var(--text-tertiary); margin-top: 1px; }
.provider-chev { display: inline-flex; color: var(--text-tertiary); transition: transform .2s; }
.provider-chev svg { width: 15px; height: 15px; }
.provider-card.open > .provider-head > .provider-chev { transform: rotate(90deg); }
.provider-body { padding: 0 10px 10px; }
.mp-sub { font-size: 11.5px; font-weight: 700; color: var(--text-tertiary); padding: 8px 6px 4px; }
.model-row {
  display: flex; align-items: center; gap: 8px;
  padding: 9px 10px; border-radius: 9px; font-size: 13px;
  color: var(--text-primary); cursor: pointer;
  font-family: ui-monospace, Menlo, monospace;
}
.model-row:active { background: var(--bg-input); }
.model-row.dep { color: var(--text-tertiary); }
.dep-box {
  margin: 6px 4px 0; border-radius: 10px;
  background: var(--bg-input); border: 1px dashed var(--border);
}
.dep-head {
  display: flex; align-items: center; gap: 7px;
  padding: 9px 11px; font-size: 12.5px; font-weight: 600;
  color: var(--text-tertiary); cursor: pointer; user-select: none;
}
.dep-head svg { width: 14px; height: 14px; }
.dep-head .provider-chev { margin-left: auto; }
.dep-box.open .dep-head .provider-chev { transform: rotate(90deg); }
.dep-list { padding: 0 6px 6px; }
.provider-foot { padding: 8px 6px 4px; }
.tag-purple { background: rgba(155,89,255,.14); color: #b98aff; }
.tag-orange { background: rgba(255,150,60,.14); color: #ffa94d; }
.spinning svg, .icon-btn.spinning { animation: th-spin 1s linear infinite; }
@keyframes th-spin { to { transform: rotate(360deg); } }

/* 排行榜页 */
.rank-layout { display: flex; gap: 10px; min-height: 60vh; }
.rank-side {
  width: 84px; flex-shrink: 0; display: flex; flex-direction: column; gap: 4px;
  border-right: 1px solid var(--border); padding-right: 8px;
}
.rank-cat {
  padding: 9px 6px; border-radius: 9px; font-size: 12.5px; font-weight: 600;
  color: var(--text-secondary); text-align: center; transition: all .15s;
}
.rank-cat.on { background: var(--primary); color: #fff; }
.rank-main { flex: 1; min-width: 0; }
.rank-radar-wrap { display: flex; flex-direction: column; align-items: center; padding: 6px 0 2px; }
.rank-radar-tip { font-size: 11px; color: var(--text-tertiary); margin-top: 2px; }
.rank-list { display: flex; flex-direction: column; gap: 4px; margin-top: 10px; }
.rank-row-item {
  display: flex; align-items: center; gap: 9px;
  padding: 8px 10px; border-radius: 10px; background: var(--bg-card);
}
.rank-no {
  width: 22px; height: 22px; border-radius: 7px; flex-shrink: 0;
  display: grid; place-items: center;
  font-size: 12px; font-weight: 800; color: var(--text-tertiary);
  background: var(--bg-input);
}
.rank-no.top { background: linear-gradient(135deg, #ffb84d, #ff7a45); color: #fff; }
.rank-ico { width: 24px; height: 24px; display: grid; place-items: center; flex-shrink: 0; }
.rank-ico .vendor-ico, .rank-ico svg { width: 22px; height: 22px; }
.rank-model { flex: 1; min-width: 0; }
.rank-mname { font-size: 13px; font-weight: 600; }
.rank-pname { font-size: 11px; color: var(--text-tertiary); }
.rank-score { display: flex; align-items: center; gap: 6px; width: 96px; flex-shrink: 0; }
.rank-bar { flex: 1; height: 5px; border-radius: 3px; background: var(--bg-input); overflow: hidden; }
.rank-bar i { display: block; height: 100%; border-radius: 3px; background: linear-gradient(90deg, var(--primary), #9b59ff); }
.rank-score span { font-size: 12px; font-weight: 700; color: var(--text-secondary); width: 22px; text-align: right; }

/* 图片/视频生成中提示 */
.ai-gen-hint { display: flex; align-items: center; gap: 8px; font-size: 13.5px; color: var(--text-secondary); }
.ai-gen-hint svg { width: 16px; height: 16px; animation: th-pulse 1.2s ease-in-out infinite; }
.ai-gen-hint.err { color: var(--danger); }
.ai-gen-hint.err svg { animation: none; }
@keyframes th-pulse { 0%,100% { opacity: 1; } 50% { opacity: .35; } }

/* 网页预览 iframe */
.code-preview-frame { display: block; }
.md-pre-btns { display: inline-flex; gap: 6px; }
.md-preview {
  padding: 2px 9px; border-radius: 6px; font-size: 11px;
  background: rgba(59,91,253,.2); color: #8fa5ff;
}

/* 手表端 */
@media (max-width: 380px) and (pointer: coarse) {
  .ai-ws-bar { padding: 4px 8px; }
  .ai-ws-chip { padding: 4px 9px; font-size: 11px; }
  .ai-dtabs { flex-wrap: wrap; }
  .rank-layout { flex-direction: column; }
  .rank-side { width: 100%; flex-direction: row; overflow-x: auto; border-right: 0; border-bottom: 1px solid var(--border); padding: 0 0 6px; }
  .rank-cat { white-space: nowrap; }
}