/* 侧边栏采用聊天优先的极简布局；设置项只在抽屉面板里出现。
   全局层（RFC 0017 收编定稿）：组件样式已迁各 SFC <style scoped>（清单见 tests/unit/migratedSfcStyles.ts），
   本文件只含——基座（令牌语义变量/视口/滚动条/元素规则）、命令式 DOM 族（气泡/工具组/附件卡等 25 族，
   节点无组件 scope 标记）、teleport 浮层覆写（hover 提示/模型菜单）、共享契约族（图标钮联合/menu-switch/
   kimi-logout/confirm-overlay/设置行系/账户卡系/模态壳）。族边界由 tests/unit/vueSfcStyles.spec.ts 看守。 */
:root {
  /* 数据可视化品牌蓝（kimi-design tokens: color.chart.brand.blue）——用量条 Code 段/图例专用。 */
  --color-chart-brand-blue: #357af6;
  color: var(--color-labels-primary);
  background: var(--color-background-primary);
  font-family: 'PingFang SC', 'Avenir Next', 'Microsoft YaHei', sans-serif;
  font-size: 16px;
  /* 对话末尾的滚动呼吸留白——只加在内容末尾（chat-log padding-bottom），中间记录占满不缺块；
     滚到最后一条还能继续往上滚一段、空出这段距离，再贴住输入框。 */
  --conversation-bottom-space: 1.5rem;
  /* 输入框上方的固定外边距保持小（仅基础呼吸）；真正的"末尾留白"走上面的 --conversation-bottom-space，
     这样中间记录不会一直缺一块。任务运行中 steps 面板可见时此值被 0.1rem 覆盖（tab 插背后）。 */
  --composer-top-space: 0.5rem;
  --composer-side-icon-size: 18px;
  /* Kimi Design token mappings. Keep product styles on these semantic variables instead of local one-off colors. */
  --color-brand-kimi-dark: var(--Labels-Primary);
  --color-brand-kimi-dark-hover: rgba(37, 37, 37, 1);
  --color-brand-kimi-dark-active: var(--Labels-Primary-active);
  /* 发送键置灰底色（≈ brand-dark 的 50% 淡化）——独立 token 而非整键 opacity，见 :disabled 规则注释。 */
  --color-brand-kimi-dark-disabled: var(--Labels-Tertiary);
  /* Kimi 品牌蓝：switch 开启态等强调控件（设计 token Colors/KMBlue）。 */
  --color-brand-km-blue: #1783ff;
  --color-background-primary: var(--Bg-Primary);
  --color-background-secondary: var(--Bg-Secondary);
  --color-background-tertiary: var(--Bg-Tertiary);
  --color-labels-primary: var(--Labels-Primary);
  --color-labels-primary-hover: var(--Labels-Primary-hover);
  --color-labels-secondary: var(--Labels-Secondary);
  /* 思考标题 shimmer 高光带颜色（亮色主题：略深于背景文字，平移时形成扫光）。 */
  --shimmer-highlight: rgba(0, 0, 0, 0.12);
  --color-labels-tertiary: var(--Labels-Tertiary);
  --color-labels-quaternary: var(--Labels-Quaternary);
  --color-fills-f1: var(--Fills-F1);
  --color-fills-f2: var(--Fills-F2);
  --color-fills-f3: var(--Fills-F3);
  --color-fills-f4: var(--Fills-F4);
  --color-separator-s1: var(--Separators-S1);
  /* Buttons 组件族（Figma 7052:11946，规格仅亮色）补充 token：
     secondary hover #EFEFEF≈黑.065（比 f2 深一阶）；outline 描边 #EEEEEE≈黑.067（hover 描边与默认一致，规格 hover 仅底色变 f1）；
     disabled 字色三族同为 labels/quaternary rgba(0,0,0,0.3)（7052:12184/12190/12196）。 */
  --color-fills-f1-hover: rgba(0, 0, 0, 0.065);
  --color-buttons-outline-border: rgba(0, 0, 0, 0.067);
  --color-buttons-disabled-text: var(--Labels-Quaternary);
  --color-buttons-disabled-text-secondary: var(--Labels-Quaternary);
  --color-mask-toast-pc: var(--MaskBg-ToastPC);
  --color-mask-base: var(--MaskBg-Base);
  /* 附件卡关闭圆钮底色（设计稿 maskbg/fill_icon，两主题同固定值）+ backdrop-blur(2px)。 */
  --color-maskbg-fill-icon: rgba(0, 0, 0, 0.25);
  --color-mask-alpha-solid: var(--Always-Black);
  --color-always-white: var(--Always-White);
  --color-inverse-spinner-track: rgba(255, 255, 255, 0.45);
  --color-status-danger: var(--Colors-Red);
  --color-status-danger-hover: var(--Colors-Red-hover);
  --color-status-danger-active: var(--Colors-Red-active);
  --color-status-danger-25: var(--Colors-Red25);
  --color-status-danger-bg: rgba(255, 56, 73, 0.1);
  --color-status-orange: var(--Colors-Orange);
  --color-status-orange-hover: var(--Colors-Orange-hover);
  --color-status-orange-active: var(--Colors-Orange-active);
  --color-status-orange-25: rgba(255, 149, 0, 0.25);
  --color-status-orange-bg: rgba(255, 149, 0, 0.1);
  --color-status-positive-green: var(--Colors-PositiveGreen);
  --color-status-positive-green-hover: var(--Colors-PositiveGreen-hover);
  --color-status-positive-green-25: var(--Colors-PositiveGreen25);
  --color-status-positive-green-bg: rgba(22, 196, 86, 0.1);
  /* 历史会话文档类型 tag / 附件图标底色（基色复用 --color-brand-km-blue）。 */
  --color-status-kmblue-bg: rgba(23, 131, 255, 0.1);
  --color-bubble-gray-pc: var(--Others-BubbleGray_PC);
  /* 用户气泡底色改 fills-f2 后，hover 略深一档、长消息折叠渐变用与气泡有效色一致的不透明色。 */
  --color-bubble-gray-pc-hover: rgba(0, 0, 0, 0.08);
  --color-bubble-fade: #f2f2f2;
  --radius-xxs: 4px;
  --radius-sm: 8px;
  --radius-md: 10px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  /* Dialogs 面板（设计稿 7030:42103 rounded-[20px]）。 */
  --radius-2xl: 20px;
  --radius-full: 100px;
  --shadow-input-default: 0 5px 16px -4px rgba(0, 0, 0, 0.07);
  --shadow-small: 0 4px 16.4px rgba(0, 0, 0, 0.1);
  --motion-ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --motion-ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);

  --steps-muted-fill: var(--Fills-F1);
  /* 运行中任务面板的卡片底色：暖调浅灰（更浅、接近白），与输入框白卡叠出「卡片插背后」质感。 */
  --steps-card-bg: var(--Bg-Secondary);
  --conversation-scrollbar-thumb: var(--Fills-F4);
  --conversation-scrollbar-thumb-hover: var(--Labels-Tertiary);
  /* 工具详情面板代码语法高亮（设计稿 7035:9310：数字金 #d5a700、关键字紫 #a500b5；基础文本为 labels/primary）。 */
  --color-syntax-key: #af00db;
  --color-syntax-string: #a31515;
  --color-syntax-number: #d5a700;
  --color-syntax-keyword: #a500b5;

  color-scheme: light;
  --z-toast: 1000;
  --z-tooltip: 900;
  --z-dialog-alert: 870;
  --z-dialog: 860;
  --z-modal-backdrop: 800;
  --z-modal: 810;
  --z-header: 500;
}

/* —— 暗色主题：data-theme="dark" 挂在 <html>，覆盖同名颜色变量整体换肤 —— */
:root[data-theme='dark'] {
  color-scheme: dark;
  --color-brand-kimi-dark: var(--Labels-Primary);
  --color-brand-kimi-dark-hover: rgba(255, 255, 255, 0.848);
  --color-brand-kimi-dark-active: var(--Labels-Primary-active);
  --color-brand-kimi-dark-disabled: var(--Labels-Tertiary);
  /* 暗色下品牌蓝略提亮，保证 switch 开启态在深底上可读。 */
  --color-brand-km-blue: #3b92ff;
  --color-background-primary: var(--Bg-Primary);
  --color-background-secondary: var(--Bg-Secondary);
  --color-background-tertiary: var(--Bg-Tertiary);
  --color-labels-primary: var(--Labels-Primary);
  --color-labels-primary-hover: var(--Labels-Primary-hover);
  --color-labels-secondary: var(--Labels-Secondary);
  /* 暗色主题：高光要亮于背景文字，否则看不出平移。 */
  --shimmer-highlight: rgba(255, 255, 255, 0.96);
  --color-labels-tertiary: var(--Labels-Tertiary);
  --color-labels-quaternary: var(--Labels-Quaternary);
  --color-fills-f1: var(--Fills-F1);
  --color-fills-f2: var(--Fills-F2);
  --color-fills-f3: var(--Fills-F3);
  --color-fills-f4: var(--Fills-F4);
  --color-separator-s1: var(--Separators-S1);
  /* Buttons 暗色（规格仅亮色，按反相推导）：黑 alpha 换白 alpha；描边略提一档保证深底可辨；
     disabled 字色对齐暗色 labels-quaternary（0.26）。 */
  --color-fills-f1-hover: rgba(255, 255, 255, 0.12);
  --color-buttons-outline-border: rgba(255, 255, 255, 0.08);
  --color-buttons-disabled-text: var(--Labels-Quaternary);
  --color-buttons-disabled-text-secondary: var(--Labels-Quaternary);
  --color-mask-toast-pc: var(--MaskBg-ToastPC);
  --color-mask-base: var(--MaskBg-Base);
  /* 亮暗同值（设计稿固定色），暗色侧显式声明保持双主题 token 对齐。 */
  --color-maskbg-fill-icon: rgba(0, 0, 0, 0.25);
  --color-status-danger: var(--Colors-Red);
  --color-status-danger-hover: var(--Colors-Red-hover);
  --color-status-danger-active: var(--Colors-Red-active);
  --color-status-danger-25: var(--Colors-Red25);
  --color-status-danger-bg: rgba(255, 71, 86, 0.14);
  --color-status-orange: var(--Colors-Orange);
  --color-status-orange-hover: var(--Colors-Orange-hover);
  --color-status-orange-active: var(--Colors-Orange-active);
  --color-status-orange-25: rgba(255, 159, 10, 0.25);
  --color-status-orange-bg: rgba(255, 159, 10, 0.14);
  --color-status-positive-green-hover: var(--Colors-PositiveGreen-hover);
  --color-status-positive-green-25: var(--Colors-PositiveGreen25);
  --color-status-positive-green-bg: rgba(22, 196, 86, 0.14);
  --color-status-kmblue-bg: rgba(61, 155, 255, 0.14);
  --color-bubble-gray-pc: var(--Others-BubbleGray_PC);
  /* 暗色：fills-f2(白 10%) 叠 #121212 的有效色 ≈ #2b2b2b。 */
  --color-bubble-gray-pc-hover: rgba(255, 255, 255, 0.14);
  --color-bubble-fade: #2b2b2b;
  /* 暗色语法高亮：与亮色同色相（金数字 / 紫关键字）但提亮，保证深底可读。 */
  --color-syntax-key: #c586c0;
  --color-syntax-string: #ce9178;
  --color-syntax-number: #e5c07b;
  --color-syntax-keyword: #c678dd;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  min-height: 100vh;
  background: var(--color-background-primary);
}

/* 视口硬钳制：shell 高 100vh、滚动全在内部容器（chat-log / history-list / 设置页）。
   只锁 body 不够——真正滚动的 scroller 是 html，浮层/异常宽内容撑大 scrollWidth 后
   整窗格就能被触控板拖着左右滚。 */
html,
body {
  overflow: hidden;
}

button,
input,
textarea {
  font: inherit;
}

button {
  cursor: pointer;
}

.app-body {
  overflow: hidden;
}

.app-shell {
  position: relative;
  display: grid;
  /* 5 行 = 顶栏 / 会话滚动区 / steps 面板 / 快捷入口提示栏 / 输入框卡片；后四者按需显隐，空 auto 轨道高度为 0。 */
  grid-template-rows: auto minmax(0, 1fr) auto auto auto;
  height: 100vh;
  /* 顶部控制区保持轻量，右侧任务窗格把注意力留给欢迎态和输入框；顶部内边距 12（设计稿：胶囊距窗口顶 12）。 */
  padding: 12px 16px 16px;
}

/* 全局保险：grid 子项默认 min-width:auto（=min-content），任一宽内容（长模型名、长代码串）
   都会把 shell 撑出视口右缘、body overflow:hidden 再把右側元素裁掉。归零后宽内容只能
   局部省略/滚动，顶栏与输入区永不被整体推出。 */
.app-shell > * {
  min-width: 0;
}

@media (prefers-reduced-motion: reduce) {
  .attachment-menu {
    animation: none;
  }
}

.ghost-button {
  position: relative;
  border: 1px solid transparent;
  border-radius: var(--radius-full);
  background: var(--color-fills-f1);
  color: var(--color-labels-secondary);
  padding: 0;
  text-decoration: none;
  transition:
    background-color 160ms ease,
    color 160ms ease,
    transform 120ms var(--motion-ease-out),
    box-shadow 160ms ease;
}

/* 图标按钮（新建 / 历史 / 设置齿轮 / 关闭返回箭头）：固定圆形，居中放 svg。 */
#new-session,
#history-toggle,
#history-close,
#history-more,
#settings-toggle,
#settings-close,
#feedback-back,
#login-back,
#plugins-skills-close,
.settings-modal-close {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  padding: 0;
  color: var(--color-labels-secondary);
}

#new-session svg,
#history-toggle svg,
#history-close svg,
#history-more svg,
#settings-toggle svg,
#settings-close svg,
#feedback-back svg,
#plugins-skills-close svg,
.settings-modal-close svg {
  display: block;
  width: 18px;
  height: 18px;
}

/* 返回按钮（设置/历史/反馈/登录）：纯箭头无灰底圆，hover 仅加深颜色。 */
#settings-close,
#history-close,
#feedback-back,
#login-back,
#plugins-skills-close {
  width: 28px;
  height: 28px;
  background: transparent;
}

#settings-close svg,
#history-close svg,
#feedback-back svg,
#login-back svg,
#plugins-skills-close svg {
  width: 16px;
  height: 16px;
}

#settings-close:hover,
#history-close:hover,
#feedback-back:hover,
#login-back:hover,
#plugins-skills-close:hover {
  background: transparent;
  color: var(--color-labels-primary);
}

/* 历史面板「…」按钮（走查行9）：静止透明（同返回箭头族），hover 底色由下方 #history-more:hover 承担。
   圆角矩形 radius-md（10px）：与 Header_web 顶栏按钮 32×32 圆角 10 同族（PaywallPage.vue 返回按钮注释有出处），
   只覆盖本按钮，不改 .ghost-button 全局圆角。 */
#history-more {
  background: transparent;
  border-radius: var(--radius-md);
}

#new-session:hover,
#history-toggle:hover,
#history-more:hover,
#settings-toggle:hover,
.settings-modal-close:hover {
  color: var(--color-labels-secondary);
  background: var(--color-fills-f2);
}

#new-session:active,
#history-toggle:active,
#history-close:active,
#history-more:active,
#settings-toggle:active,
#settings-close:active,
#feedback-back:active,
#plugins-skills-close:active,
.settings-modal-close:active {
  transform: scale(0.97);
}

.ghost-button:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 2px var(--color-background-primary), 0 0 0 4px var(--color-brand-kimi-dark);
}

.conversation-scroll::-webkit-scrollbar,
.settings-content::-webkit-scrollbar,
.history-list::-webkit-scrollbar {
  width: 0.5rem;
  height: 0.5rem;
}

.conversation-scroll::-webkit-scrollbar-track,
.settings-content::-webkit-scrollbar-track,
.history-list::-webkit-scrollbar-track {
  background: transparent;
}

.conversation-scroll::-webkit-scrollbar-thumb,
.settings-content::-webkit-scrollbar-thumb,
.history-list::-webkit-scrollbar-thumb {
  border: 0.12rem solid transparent;
  border-radius: 999px;
  background: var(--conversation-scrollbar-thumb);
  background-clip: content-box;
}

.conversation-scroll:hover::-webkit-scrollbar-thumb,
.conversation-scroll::-webkit-scrollbar-thumb:hover,
.settings-content:hover::-webkit-scrollbar-thumb,
.settings-content::-webkit-scrollbar-thumb:hover,
.history-list:hover::-webkit-scrollbar-thumb,
.history-list::-webkit-scrollbar-thumb:hover {
  background: var(--conversation-scrollbar-thumb-hover);
  background-clip: content-box;
}

.conversation-scroll::-webkit-scrollbar-button,
.settings-content::-webkit-scrollbar-button,
.history-list::-webkit-scrollbar-button {
  display: none;
}

/* 气泡与复制行共用整行悬停区域，保留操作行占位，显隐时消息不跳动。 */
.user-message-row {
  display: grid;
  min-width: 0;
  gap: 0.75rem;
}

.message {
  min-width: 0;
  max-width: 88%;
  margin: 0;
  border-radius: var(--radius-lg);
  font-size: 14px;
  line-height: 20px;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.message.assistant {
  position: relative;
  justify-self: start;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  border-radius: 0;
  background: transparent;
  color: var(--color-labels-primary);
  /* 14px/22px（2026-07-31 产品裁决：消息字号全线小一号）；走查行7：流内不再挂 IP 头像，
     2026-08-21「统一左边界距帧 48px（shell 16 + 32px 头像边沟）」裁决在该处作废——
     回复内容左缘回到 shell 内边距，气泡/工具组/Done 行/thinking 全族同为 padding 0 12px。 */
  font-size: 14px;
  line-height: 22px;
  padding: 0 12px;
  white-space: normal;
}

/* 队列拖拽期间的全局光标与禁选（类加在 documentElement 上，scoped 盖不到）。 */
html.message-queue-pointer-dragging,
html.message-queue-pointer-dragging * {
  cursor: grabbing !important;
  user-select: none !important;
}

/* steer 反馈条：左缘与助手正文对齐。 */
.steer-feedback {
  margin: 4px 0 0;
  padding: 0 12px;
  color: var(--color-labels-tertiary);
  font-size: 13px;
  line-height: 20px;
}

/* 模型尚未读到的 steer 与其反馈条排在处理中指示器（order:999）之后。 */
[data-steer-pending] {
  order: 1000;
}

.markdown-table-scroll {
  max-width: 100%;
  margin: 0.52rem 0 0.68rem;
  overflow-x: auto;
}

@keyframes shimmer-text {
  0% { background-position: 100% 0; }   /* 高光在文字左外，整行纯基色 */
  55% { background-position: 0 0; }      /* 快速扫到右外、完全消失 */
  100% { background-position: 0 0; }     /* 停顿间隔：保持消失，下一轮从左慢慢淡入 */
}

/* 扫光互斥（走查行17 裁决：方案 A）——同视图内有活动工具组在扫时，其后的思考标题降级
   静态灰：同一时刻只有一级扫光。组落地摘除 is-active 后标题自动恢复扫光；纯思考（无
   活动组）不受影响。工具组与 pending 指示器同为 .session-view 直接子级，兄弟选择器可及。 */
.tool-group.is-active ~ .message.is-thinking .thinking-headline {
  animation: none;
  background: none;
  color: var(--color-labels-secondary);
}

/* 任务步骤的旋转动画由 StepsPanel.vue 引用。 */
@keyframes tool-status-spin {
  to { transform: rotate(360deg); }
}

/* 通用 hover 提示气泡（hoverTooltip.ts 单浮层服务，naive-ui NTooltip 渲染）：原生 title 在 WPS
   CEF 窗格不渲染，hover 提示必须自绘。配色沿用 .fanout-tip 的 toast 形态；定位/层级由浮层
   容器承担（teleport 到 body，z-index 经组件 prop 给 --z-toast 同值 1000）。 */
.hover-tooltip {
  max-width: 320px;
  padding: 6px 10px;
  border-radius: var(--radius-md);
  background: var(--color-mask-toast-pc);
  color: var(--color-always-white);
  font-size: 12px;
  line-height: 1.45;
  white-space: pre-wrap;
  word-break: break-word;
  box-shadow: var(--shadow-small);
}

/* 文件卡（设计稿 2607「组件」filecard_web）：202x72 横向卡——44px 文档式图标 + meta 列
   （文件名 + 描述行），f1 底、radius-lg、无描边（仅 failed 态有 0.5px 红描边）。
   真实尺寸排版、不用 zoom，待发送横滚容器 scrollLeft 坐标系不受影响。 */
.attachment-card {
  position: relative;
  box-sizing: border-box;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 8px;
  width: 202px;
  min-width: 202px;
  height: 72px;
  border: 0;
  border-radius: var(--radius-lg);
  background: var(--color-fills-f1);
  color: var(--color-labels-primary);
  padding: 14px 10px;
}

/* failed：bg 仍 f1，仅 0.5px 红描边；图标与文件名压到 0.5 透明度（规则见下方图标/文件名处）。 */
.attachment-card.is-error {
  border: 0.5px solid var(--color-status-danger);
}

/* 2607 主改版（67d87516）误删的声明，R4d 裁决补回——三处附件 spinner 引用它。 */
@keyframes ui-spin {
  to {
    transform: rotate(360deg);
  }
}

/* 附件消息「后台落盘中」：乐观气泡已上屏，字节读取 + 落盘全在后台。此时在每个附件卡片方块「上」叠一层
   半透明遮罩（::before 压暗卡片内容）+ 方块中央一个旋转 spinner（复用 ui-spin），表示该文件正在保存到
   本地库；落盘完成后本 wrap 会被无 spinner 的新 wrap 整体替换。落盘全在后台，不阻塞打字/加文件。 */
.message-attachments.is-saving .attachment-card::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: var(--color-background-primary);
  opacity: 0.55;
  pointer-events: none;
  z-index: 1;
}

.attachment-saving-spinner {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 1.5rem;
  height: 1.5rem;
  margin: -0.75rem 0 0 -0.75rem;
  border: 2px solid var(--color-fills-f2);
  border-top-color: var(--color-brand-kimi-dark);
  border-radius: 50%;
  animation: ui-spin 0.7s linear infinite;
  pointer-events: none;
  z-index: 2;
}

/* 图片附件（设计稿 content=pic）：72x72 缩略图方块，0.5px s1 描边、radius 12；
   overflow:hidden 把 hover 放大的图片裁在方块内(方块大小不变,只内部图片放大)。 */
.attachment-card.is-image {
  display: block;
  width: 72px;
  min-width: 72px;
  flex-basis: 72px;
  padding: 0;
  border: 0.5px solid var(--color-separator-s1);
  overflow: hidden;
}

.attachment-card-thumb {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
  transition: transform 220ms var(--motion-ease-out);
}

/* hover 时方块内图片轻微放大(方块大小不变,靠父级 overflow:hidden 裁切),移开恢复。 */
.attachment-card.is-image:hover .attachment-card-thumb {
  transform: scale(1.08);
}

/* 可点放大预览的图片卡：缩略图本身显示放大光标;移除按钮是兄弟节点,光标不受影响。 */
.attachment-card.is-previewable .attachment-card-thumb {
  cursor: zoom-in;
}

/* 缩略图加载失败：回退为文件卡布局（202x72 横向），隐藏坏图，显示图标 + 文件名 + 描述行。 */
.attachment-card.is-image.is-thumb-failed {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 202px;
  min-width: 202px;
  flex-basis: 202px;
  padding: 14px 10px;
}

.attachment-card.is-thumb-failed .attachment-card-thumb {
  display: none;
}

/* 图片卡状态叠加层（设计稿 content=pic type=upload/failed）：72x72 缩略图上压 40% 黑遮罩
   （rgba 固定值，两主题同）+ 居中 24px 指示器；upload/phrase=LoadingDark 白 spinner，failed=Exclamation_f。
   遮罩不吞点击（关闭钮 z-index 1 在其上；缩略图预览点击穿透）。 */
.attachment-card-overlay {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  border-radius: inherit;
  background: rgba(0, 0, 0, 0.4);
  pointer-events: none;
}

.attachment-card-overlay-spinner {
  width: 24px;
  height: 24px;
  border: 2px solid rgba(255, 255, 255, 0.35);
  border-top-color: #fff;
  border-radius: 50%;
  animation: ui-spin 0.7s linear infinite;
}

.attachment-card-overlay-icon {
  width: 24px;
  height: 24px;
  color: #fff;
}

.attachment-card-overlay-icon svg {
  display: block;
  width: 100%;
  height: 100%;
}

/* 缩略图加载失败回退文件卡时，叠加层一并隐藏（文件卡有自己的文字状态行）。 */
.attachment-card.is-thumb-failed .attachment-card-overlay {
  display: none;
}

/* 文件类型图标位（设计稿 file icon_new，44px 盒）：内嵌 30px kimi 文件类型缩略图标（固定多色件，
   _light/_dark 随主题切换；走查行6：24px 偏小，按走查参考图放到 30px）。--{variant} class 钩子保留为测试/e2e 锚，渲染内容按变体注入（FILE_ICON_NAMES）。 */
.attachment-card-icon {
  flex: none;
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  color: var(--color-labels-secondary);
}

.attachment-card-icon svg {
  display: block;
  width: 30px;
  height: 30px;
}

/* meta 列：文件名 + 第二行（描述/错误/进度），列内 gap 4。 */
.attachment-card-meta {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.attachment-card-name {
  min-width: 0;
  overflow: hidden;
  color: var(--color-labels-primary);
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* 描述行「PDF 2.0 KB」（设计稿 labels/quaternary）。 */
.attachment-card-desc {
  min-width: 0;
  overflow: hidden;
  color: var(--color-labels-quaternary);
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* failed 态状态行（设计稿「上传失败，请重试」14px/20 #ff3849）。 */
.attachment-card-error {
  min-width: 0;
  overflow: hidden;
  color: var(--color-status-danger);
  font-size: 14px;
  line-height: 20px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* upload/phrase 态状态行：16px spinner + 12/18 labels-primary 进度文案。 */
.attachment-card-status {
  display: flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
}

.attachment-card-status-spinner {
  flex: none;
  width: 16px;
  height: 16px;
  border: 2px solid var(--color-fills-f2);
  border-top-color: var(--color-brand-kimi-dark);
  border-radius: 50%;
  animation: ui-spin 0.7s linear infinite;
}

.attachment-card-status-text {
  overflow: hidden;
  color: var(--color-labels-primary);
  font-size: 12px;
  line-height: 18px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* failed：图标 + 文件名 0.5 透明度（错误文案保持全红）；
   upload/phrase：图标 + 文件名 0.5（状态行 spinner 自带 0.5、进度文案保持全透明度，与设计稿一致）。 */
.attachment-card.is-error .attachment-card-icon,
.attachment-card.is-error .attachment-card-name {
  opacity: 0.5;
}

.attachment-card.is-upload .attachment-card-icon,
.attachment-card.is-upload .attachment-card-name,
.attachment-card.is-phrase .attachment-card-icon,
.attachment-card.is-phrase .attachment-card-name {
  opacity: 0.5;
}

/* upload/phrase 状态行 spinner 压 0.5（设计稿：仅图标/文件名/spinner 半透明，状态文字不压）。 */
.attachment-card.is-upload .attachment-card-status-spinner,
.attachment-card.is-phrase .attachment-card-status-spinner {
  opacity: 0.5;
}

/* 模版跳转带入的旧文件：右下角保留来源小图标（删除按钮占右上角），提示由整张卡片 hover 触发。 */
.attachment-card-source-icon {
  position: absolute;
  right: 4px;
  bottom: 4px;
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  color: var(--color-labels-tertiary);
  z-index: 2;
}

.attachment-card-source-icon svg {
  width: 14px;
  height: 14px;
}

/* 关闭钮（设计稿 CloseIcon）：14px 圆（radius 999）+ maskbg/fill_icon 底 rgba(0,0,0,.25)（固定值两主题同）
   + backdrop-blur 2px + 白色 ×（kimi Close，currentColor），定位 top 5 right 5；默认隐藏，hover/聚焦卡片才显现，
   叠在卡片内容之上。位置在卡片内部，图片卡的 overflow:hidden 不会把它裁掉。 */
.attachment-card-remove {
  position: absolute;
  top: 5px;
  right: 5px;
  display: grid;
  place-items: center;
  width: 14px;
  height: 14px;
  border: 0;
  border-radius: 999px;
  background-color: var(--color-maskbg-fill-icon);
  color: #fff;
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
  padding: 0;
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
  /* hover 时缩略图带 transform 会新建层叠上下文、按 DOM 顺序压在 × 之上(× 在 img 之前),
     故给 × 抬一层 z-index,确保放大动画期间始终盖在图片上、不被吞掉。 */
  z-index: 1;
  transition: opacity 160ms ease;
}

.attachment-card-remove svg {
  display: block;
  /* 叉占圆约 57%（走查行44：12px 几乎撑满 14px 圆，设计参照图叉占圆约一半）。 */
  width: 8px;
  height: 8px;
}

/* 鼠标悬停卡片 / 键盘聚焦时才显示 × —— 鼠标移开即隐藏。 */
.attachment-card:hover .attachment-card-remove,
.attachment-card:focus-within .attachment-card-remove,
.attachment-card-remove:focus-visible {
  opacity: 1;
  pointer-events: auto;
}

.attachment-card-remove:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 2px var(--color-background-primary), 0 0 0 4px var(--color-brand-kimi-dark);
}

.attachment-card-remove:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}

textarea,
#chat-input {
  width: 100%;
  min-height: 3.5rem;
  max-height: 13rem;
  /* 关闭原生右下角缩放手柄——#chat-input 高度随内容自适应（走查行32 撤掉顶部拖拽抓手）。 */
  resize: none;
  overflow: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--conversation-scrollbar-thumb) transparent;
  border: 0;
  outline: 0;
  /* 不画 UA 表单控件底色（暗色下会是一块灰），透明继承 .composer 的白色卡片面。 */
  background: transparent;
  color: var(--color-labels-primary);
  font-size: 16px;
  line-height: 24px;
  /* 设计稿：文本区水平内距 8px、顶部 0（走查行6：composer 卡片四边已等距 8，首行不再额外加 6）。 */
  padding: 0 8px;
}

/* 内联技能 chip：Kimi 主站同款浅灰小胶囊，原子节点（contenteditable=false）随 backspace 整体删除。 */
/* user 气泡同款：发送后 `/name` 也物化为 chip（skillChipReplay 统一规则）。 */
#chat-input .skill-chip,
.message.user .skill-chip {
  display: inline-block;
  padding: 1px 8px;
  margin: 0 1px;
  border-radius: 8px;
  background: var(--color-fills-f1);
  color: var(--color-labels-secondary);
  font-size: 13px; /* 随输入框收小（原 14/22） */
  line-height: 20px;
  cursor: default;
}
/* 气泡 chip 只读防选；composer chip 不设 user-select:none——否则全选不高亮、
   浏览器纯文本序列化（execCommand copy / 右键复制）会丢掉 chip。 */
.message.user .skill-chip {
  user-select: none;
}

/* 内联选区 chip：与技能 chip 同款浅灰小胶囊，开头不是 slash，是 CSS 画的虚线框小图案
   （::before 纯装饰，不进 textContent，序列化只认 data-selection-label）。 */
#chat-input .composer-selection-chip,
.tutorial-composer .composer-selection-chip,
.message.user .composer-selection-chip {
  display: inline-block;
  padding: 1px 8px;
  margin: 0 1px;
  /* 圆角 12（走查行41，Figma 参照 Sheet1!F21 chip）。 */
  border-radius: 12px;
  background: var(--color-fills-f1);
  color: var(--color-labels-secondary);
  font-size: 13px;
  line-height: 20px;
  cursor: default;
}
#chat-input .composer-selection-chip::before,
.tutorial-composer .composer-selection-chip::before,
.message.user .composer-selection-chip::before {
  content: '';
  display: inline-block;
  width: 9px;
  height: 9px;
  margin-right: 4px;
  border: 1px dashed currentColor;
  border-radius: 2px;
  vertical-align: -1px; /* 与 13/20 文本基线目视对齐 */
}
.message.user .composer-selection-chip {
  user-select: none;
}
/* 快捷入口占位 token（RFC 0019 阶段3）：浅灰胶囊包单行 input，宽度由 launchToken.ts 按内容估。
   原子 span（contenteditable=false）随 backspace 整体删除——删除逻辑在 skillChipEditor。
   不撑行高（宿主 24px）靠 input 显式 height 钉死（CEF 按 line-height 推 input 高度不稳定，
   曾把所在行撑高）；CEF 以 input 文本基线作 inline-block 基线（偏移量直接体现为渲染偏差），
   vertical-align 归零让 token 文字与两侧文本基线平齐。 */
#chat-input .launch-token {
  display: inline-block;
  padding: 0 4px;
  margin: 0 1px;
  border-radius: 6px;
  background: var(--color-fills-f1);
  vertical-align: baseline;
  cursor: text;
}
#chat-input .launch-token-input {
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--color-labels-secondary);
  font-size: 13px;
  line-height: 16px;
  height: 16px;
  /* 走查行4：输入态文字居左，光标落在内容起点，不再居中。 */
  text-align: left;
  min-width: 3em;
  /* 走查行4 复验：居左后光标贴内容起点，与外框 0.5px 描边相碰读起来被裁——
     左端留 2px（border-box 吃进宽度余量，胶囊外形不变）。 */
  padding: 0 0 0 2px;
}
/* 走查行4：输入态描边上移到 token 外框（数值沿用全局 input:focus 的 0.5px s1 内描边规格，
   出处注释见下方全局 input:focus 规则）。 */
#chat-input .launch-token:focus-within {
  box-shadow: inset 0 0 0 0.5px var(--color-separator-s1);
}
/* 走查行4：全局 input:focus 会在内层 input 上再画一圈 0.5px 内描边，这里中和掉，
   输入态只留外框那一圈。 */
#chat-input .launch-token-input:focus {
  box-shadow: none;
}
#chat-input .launch-token-input::placeholder {
  color: var(--color-labels-tertiary);
}

textarea::-webkit-scrollbar,
#chat-input::-webkit-scrollbar {
  width: 0.5rem;
  height: 0.5rem;
}

textarea::-webkit-scrollbar-track,
#chat-input::-webkit-scrollbar-track {
  background: transparent;
}

textarea::-webkit-scrollbar-thumb,
#chat-input::-webkit-scrollbar-thumb {
  border: 0.12rem solid transparent;
  border-radius: 999px;
  background: var(--conversation-scrollbar-thumb);
  background-clip: content-box;
}

textarea:hover::-webkit-scrollbar-thumb,
#chat-input:hover::-webkit-scrollbar-thumb,
#chat-input::-webkit-scrollbar-thumb:hover {
  background: var(--conversation-scrollbar-thumb-hover);
  background-clip: content-box;
}

textarea::-webkit-scrollbar-button,
#chat-input::-webkit-scrollbar-button {
  display: none;
}

textarea::placeholder {
  color: var(--color-labels-secondary);
}

/* hidden 属性的 UA 样式压不过本类的 display:flex——显式兜底（技能视图切换、模板项宿主门控都靠它隐藏）。 */
.attachment-menu-item[hidden] {
  display: none;
}

.attachment-menu-item {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  height: 36px;
  border: 0;
  border-radius: var(--radius-md);
  background: transparent;
  color: var(--color-labels-primary);
  padding: 8px;
  font: inherit;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  letter-spacing: 0;
  cursor: pointer;
  transition:
    background-color 160ms ease,
    color 160ms ease;
}

.attachment-menu-item:hover {
  background: var(--color-fills-f1);
}

/* display:flex 会盖过 UA 的 [hidden]{display:none}——宿主门控（如「使用自定义模版」仅 wps/wpp 揭示）靠 hidden 属性，须显式覆盖。 */
.attachment-menu-item[hidden] {
  display: none;
}

.attachment-menu-item:disabled {
  color: var(--color-labels-quaternary);
  cursor: not-allowed;
}

.attachment-menu-item:disabled:hover {
  background: transparent;
}

.attachment-menu-lead {
  display: inline-flex;
  align-items: center;
  min-width: 0;
  gap: 4px;
}

.attachment-menu-icon,
.attachment-menu-check {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
}

.attachment-menu-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* dev 小标志（跨组件共享族：附件菜单「显示工具参数」/设置环境行/历史「导出所选」）——
   标记 dev-only 功能入口：9px 小写、小圆角长方形（2026-08-18 裁决）。 */
.dev-tag {
  flex: 0 0 auto;
  padding: 1px 4px;
  border-radius: var(--radius-xxs);
  background: var(--color-fills-f2);
  color: var(--color-labels-tertiary);
  font-size: 9px;
  font-weight: 600;
  line-height: 13px;
  letter-spacing: 0.03em;
}

.attachment-menu-check {
  opacity: 0;
}

.attachment-menu-item.is-selected .attachment-menu-check {
  opacity: 1;
}

@keyframes attachment-menu-in {
  from {
    opacity: 0;
    transform: scale(0.97);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

/* 自定义 hover 提示：取代原生 title（原生有 ~0.5-1s 固定延迟，无法调快）。
   内容来自 data-tip，hover 几乎即时淡入（0.08s，无延迟）。外观共用，方向各异：
   composer 图标按钮在底部 → 提示朝上；顶栏图标按钮在顶部 → 提示朝下。
   注意：附件菜单内的行（思考模式/联网搜索）不用这里——菜单会裁剪 ::after，
   那些行走 data-hovertip 的 JS 委托浮层（.hover-tip，teleport 到 body 脱出裁剪）。 */
.composer-icon-button[data-tip]::after,
.composer button[type='submit'][data-tip]::after,
.ghost-button[data-tip]::after {
  content: attr(data-tip);
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
  background: var(--color-mask-toast-pc);
  color: var(--color-always-white);
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  padding: 8px 12px;
  border-radius: var(--radius-md);
  opacity: 0;
  pointer-events: none;
  transform: translateX(-50%) scale(0.97);
  transform-origin: center;
  transition:
    opacity 125ms var(--motion-ease-out),
    transform 125ms var(--motion-ease-out);
  z-index: var(--z-tooltip);
}

/* composer 图标在最左侧：气泡左对齐贴按钮左缘向右展开，避免长文案居中后往左溢出窗格被截断。 */
.composer-icon-button[data-tip]::after {
  bottom: calc(100% + 6px);
  left: 0;
  transform: scale(0.97);
  transform-origin: bottom left;
}

.ghost-button[data-tip]::after {
  top: calc(100% + 6px);
}

/* 顶栏左缘（历史会话）：气泡左对齐贴按钮左缘向右展开，避免居中后往左溢出窗格被截断。 */
#history-toggle[data-tip]::after {
  left: 0;
  transform: scale(0.97);
  transform-origin: top left;
}

#history-toggle[data-tip]:hover::after {
  transform: scale(1);
}

/* 顶栏右缘（设置）：气泡右对齐贴按钮右缘向左展开，同理避免往右溢出。 */
#settings-toggle[data-tip]::after {
  left: auto;
  right: 0;
  transform: scale(0.97);
  transform-origin: top right;
}

#settings-toggle[data-tip]:hover::after {
  transform: scale(1);
}

/* 发送键在窗格最右缘：气泡右对齐、贴按钮右缘向左展开，避免居中/左对齐溢出窗格被截断。 */
.composer button[type='submit'][data-tip]::after {
  bottom: calc(100% + 6px);
  left: auto;
  right: 0;
  transform: scale(0.97);
  transform-origin: bottom right;
}

.composer-icon-button[data-tip]:hover::after,
.composer button[type='submit'][data-tip]:hover::after,
.ghost-button[data-tip]:hover::after {
  opacity: 1;
  transition-delay: 300ms;
}

.composer-icon-button[data-tip]:hover::after {
  transform: scale(1);
}

.attachment-button[aria-expanded='true'][data-tip]::after {
  display: none;
}

.ghost-button[data-tip]:hover::after {
  transform: translateX(-50%) scale(1);
}

/* 即时 hover 提示（无原生 title 的 ~1s 延迟，hover 即 125ms 淡入）：
   用于 disabled 的「联网搜索」菜单项。
   单独成块，不并入上面的 .thinking-toggle/.ghost-button 组（uiSurface 断言其精确顺序）。 */
.attachment-menu-item[data-tip]::after {
  content: attr(data-tip);
  position: absolute;
  background: var(--color-mask-toast-pc);
  color: var(--color-always-white);
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  padding: 8px 12px;
  border-radius: var(--radius-md);
  white-space: normal;
  width: max-content;
  max-width: min(220px, calc(100vw - 48px));
  opacity: 0;
  pointer-events: none;
  transition: opacity 125ms var(--motion-ease-out);
  z-index: var(--z-tooltip);
}
.attachment-menu-item[data-tip]::after { top: calc(100% + 6px); left: 0; }
.attachment-menu-item[data-tip]:hover::after { opacity: 1; }

/* 即时悬浮提示浮层（ui/hoverTip.ts 委托，naive-ui NTooltip 渲染）：气泡 teleport 到 body、
   由浮层容器定位，脱离任何卡片 overflow:hidden 裁剪；用于 disabled 元素（CSS ::after 会被裁、
   native title 不弹）。外观对齐上面的 [data-tip] 气泡（深色 mask 底 + 白字）。 */
.hover-tip {
  position: relative;
  background: var(--color-mask-toast-pc);
  color: var(--color-always-white);
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  padding: 8px 12px;
  border-radius: var(--radius-md);
  white-space: normal;
  max-width: min(240px, calc(100vw - 16px));
  animation: hover-tip-in 125ms var(--motion-ease-out);
}
/* 指向宿主的箭头（--tip-arrow-shift 抵消视口边距位移）；.is-below 时翻到顶边朝上。 */
.hover-tip::after {
  content: '';
  position: absolute;
  left: calc(50% + var(--tip-arrow-shift, 0px));
  border: 5px solid transparent;
  margin-left: -5px;
}
.hover-tip::after { top: 100%; border-top-color: var(--color-mask-toast-pc); }
.hover-tip.is-below::after { top: auto; bottom: 100%; border-top-color: transparent; border-bottom-color: var(--color-mask-toast-pc); }
/* 宽变体：长文案放宽到 320px 单行收住。 */
.hover-tip.is-wide {
  width: max-content;
  max-width: min(320px, calc(100vw - 16px));
}
.hover-tip.is-balanced {
  width: max-content;
  max-width: min(180px, calc(100vw - 40px));
  white-space: pre-line;
}
@keyframes hover-tip-in {
  from { opacity: 0; }
  to { opacity: 1; }
}
/* 气泡不吃鼠标事件（否则气泡自身拦截 mouseleave）——vueuc 会给浮层内容子级开 pointer-events:all，
   须按同等选择器强度压回。 */
.v-binder-follower-content > .hover-tip,
.v-binder-follower-content > .hover-tooltip {
  pointer-events: none;
}

/* 模型菜单浮层（naive-ui NDropdown 承载）——几何/色板变量在 naiveTheme 的 Dropdown 覆盖，
   变量表达不了的旧 .model-menu 外观契约在此补齐。选择器一律双类起步：naive cssinjs 运行时注入、
   文档序晚于本表，同特异性会被它盖掉。 */
.n-dropdown-menu.model-menu-float {
  box-sizing: border-box;
  min-width: 180px;
  max-width: min(280px, calc(100vw - 32px));
  border: 0.5px solid var(--color-separator-s1);
  box-shadow: var(--shadow-small);
}

@media (max-width: 560px) {
  .n-dropdown-menu.model-menu-float {
    width: min(180px, calc((100vw - 32px) / 2));
    min-width: 0;
  }
}

/* 箭头预留位margin归零：naive 按 [v-placement] 给 popover-shared 挂 margin-bottom:6px（0-2-0），
   会把上弹菜单整体顶高 6px——旧契约是菜单底缘贴触发器顶-8px，无箭头故须压平（三类压两类）。 */
.n-dropdown-menu.n-dropdown.model-menu-float {
  margin: 0;
}

/* 项：横向内边距与行高对齐旧 .attachment-menu-item（naive 项体默认无横向内边距、行高撑满项高）。 */
.n-dropdown-menu.model-menu-float .n-dropdown-option-body {
  padding: 0 8px;
  line-height: 20px;
}

/* 项 hover 底：naive 画在 ::before（默认左右各缩 4px、圆角随菜单）——旧契约贴项缘、圆角 --radius-md。 */
.n-dropdown-menu.model-menu-float .n-dropdown-option-body::before {
  left: 0;
  right: 0;
  border-radius: var(--radius-md);
}

/* label 槽内改 flex：文案省略号 + 对勾占位两端排（旧 .attachment-menu-item 的 space-between 语义）。 */
.n-dropdown-menu.model-menu-float .n-dropdown-option-body__label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}

/* 前后缀空壳摘掉（宽度变量已归零，但 suffix 另带 padding 0 8px——须比 naive 三类选择器多一类才压得住）。 */
.n-dropdown-menu.model-menu-float .n-dropdown-option .n-dropdown-option-body__prefix,
.n-dropdown-menu.model-menu-float .n-dropdown-option .n-dropdown-option-body__suffix {
  display: none;
}

/* 选中项对勾显隐（旧 .attachment-menu-item.is-selected .attachment-menu-check 规则的锚点迁移）。
   对勾用 KMblue（走查行35）。 */
.n-dropdown-menu.model-menu-float .n-dropdown-option-body.is-selected .attachment-menu-check {
  opacity: 1;
  color: var(--color-brand-km-blue);
}

.model-menu-check svg {
  width: 100%;
  height: 100%;
}

/* 模型二级菜单经 teleport 渲染，样式随浮层统一生效。 */
.effort-menu-value { color: var(--color-labels-secondary); white-space: nowrap; }

/* 模型菜单底部分隔线：旧契约为 0.5px 发丝描边（naive 默认 1px 实底），上下留白不变。 */
.n-dropdown-menu.model-menu-float .n-dropdown-divider {
  height: 0;
  margin: 4px 0;
  background: none;
  border-top: 0.5px solid var(--color-separator-s1);
}

/* 模型切换器 hover 提示：与 composer 图标按钮同款气泡；右对齐防止溢出窗格右缘。 */
.current-model-name.is-switchable[data-tip]::after {
  content: attr(data-tip);
  position: absolute;
  bottom: calc(100% + 6px);
  right: 0;
  white-space: nowrap;
  background: var(--color-mask-toast-pc);
  color: var(--color-always-white);
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  padding: 8px 12px;
  border-radius: var(--radius-md);
  opacity: 0;
  pointer-events: none;
  transform: scale(0.97);
  transform-origin: bottom right;
  transition:
    opacity 125ms var(--motion-ease-out),
    transform 125ms var(--motion-ease-out);
  z-index: var(--z-tooltip);
}

.current-model-name.is-switchable[data-tip]:hover::after {
  opacity: 1;
  transform: scale(1);
  transition-delay: 300ms;
}

/* 菜单行 switch（思考模式 / 联网搜索共用）：32×18 轨道 + 14px 滑块，开启态品牌蓝。
   思考模式由内嵌 checkbox :checked 驱动；联网搜索由 chatPage 切 .is-selected 驱动。 */
.menu-switch {
  position: relative;
  flex: 0 0 auto;
  width: 32px;
  height: 18px;
  border-radius: 999px;
  background: var(--color-fills-f3);
  transition: background-color 160ms ease;
}

.menu-switch::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--color-always-white);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
  transition:
    transform 160ms var(--motion-ease-out),
    width 160ms var(--motion-ease-out),
    height 160ms var(--motion-ease-out),
    top 160ms var(--motion-ease-out);
}

/* 管理模态行的开关与 composer 里的 .menu-switch 同一组件：button 化清默认样式，
   用 .is-on 类驱动开态（composer 侧由 :checked/.is-selected 驱动，互不干扰）。 */
button.menu-switch {
  border: 0;
  padding: 0;
  cursor: pointer;
}

.menu-switch.is-on {
  background: var(--color-brand-km-blue);
}

.menu-switch.is-on::after {
  transform: translateX(14px);
}

/* hover 不改圆点几何（走查行33：hover 缩点 14→12 让切换瞬间尺寸/落点跳变）——
   开/关/hover 任意组合圆点恒 14px、偏移恒 2/14，切换只剩平滑平移。 */
.thinking-toggle input:checked ~ .menu-switch,
.attachment-menu-item.is-selected .menu-switch {
  background: var(--color-brand-km-blue);
}

.thinking-toggle input:checked ~ .menu-switch::after,
.attachment-menu-item.is-selected .menu-switch::after {
  transform: translateX(14px);
}

/* 禁用态淡化（对齐 Figma Switch Disabled 变体）：联网搜索行 :disabled（未开通会员 /
   工具全局禁用）时文字已由 .attachment-menu-item:disabled 转淡，这里只补 switch 同款淡化。 */
.attachment-menu-item:disabled .menu-switch {
  opacity: 0.4;
}

.composer button[type='submit'],
.version-modal-action,
.provider-form-save,
.kimi-logout {
  border: 0;
  border-radius: var(--radius-md);
  background: var(--color-brand-kimi-dark);
  color: var(--color-background-primary);
  min-height: 32px;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  padding: 6px 10px;
  transition:
    background-color 160ms ease,
    transform 120ms var(--motion-ease-out),
    opacity 160ms ease,
    box-shadow 160ms ease;
}

/* 表单「测试并保存」/ 退出登录按钮调小：更紧的 padding + 略小字号。 */
.provider-form-save,
.kimi-logout {
  padding: 6px 10px;
  font-size: 14px;
}

.composer button[type='submit']:not(:disabled):hover,
.version-modal-action:not(:disabled):hover,
.provider-form-save:not(:disabled):hover {
  background: var(--color-brand-kimi-dark-hover);
}

.composer button[type='submit']:not(:disabled):active,
.version-modal-action:not(:disabled):active,
.provider-form-save:not(:disabled):active {
  background: var(--color-brand-kimi-dark-active);
  transform: scale(0.97);
}

/* primary disabled（组件族）：底 #D9D9D9（=fills-f3 有效色）、字 labels/quaternary rgba(0,0,0,0.3)
   （--color-buttons-disabled-text，规格 7052:12184），不用整键 opacity。 */
.provider-form-save:disabled,
.version-modal-action:disabled {
  background: var(--color-fills-f3);
  color: var(--color-buttons-disabled-text);
  cursor: not-allowed;
}

.composer button[type='submit']:focus-visible,
.version-modal-action:focus-visible,
.provider-form-save:focus-visible,
.provider-manager-add:focus-visible,
.kimi-logout:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 2px var(--color-background-primary), 0 0 0 4px var(--color-brand-kimi-dark);
}

.submit-stop-icon {
  display: block;
  width: 0.78rem;
  height: 0.78rem;
  border-radius: 0.16rem;
  background: var(--color-background-primary);
}

/* 发送按钮里的细线上箭头：28px（对齐 kimi-desktop 发送键，36px 圆内净视觉 ≈13px）；
   颜色继承按钮前景（var(--color-background-primary)）。 */
.submit-send-icon {
  display: block;
  width: 1.75rem;
  height: 1.75rem;
}

.muted {
  color: var(--color-labels-tertiary);
  font-size: 0.9rem;
}

.settings-panel {
  position: absolute;
  inset: 0;
  z-index: var(--z-modal);
  display: flex;
  flex-direction: column;
  gap: 4px;
  /* 面板本身不滚动；只有 .settings-content 内容区滚动。 */
  overflow: hidden;
  background: var(--color-background-primary);
  padding: 0;
}

.settings-panel[hidden] {
  display: none;
}

.settings-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding-top: 10px;
}

.settings-header strong {
  color: var(--color-labels-primary);
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
}

.settings-header p {
  margin: 4px 0 0;
}

/* 设置页头部（设计稿 Header_web，同历史会话头部）：52px 高、左右 10px、0.5px 底部分隔线；
   左返回 + Regular 标题。 */
.settings-panel:not(.history-panel) > .settings-header {
  flex: 0 0 auto;
  align-items: center;
  justify-content: flex-start;
  gap: 4px;
  height: 44px;
  padding-top: 0;
  padding-inline: 10px;
  border-bottom: 0.5px solid var(--color-separator-s1);
}

.settings-panel:not(.history-panel) > .settings-header strong {
  font-weight: 400;
}

.membership-login-btn {
  align-self: flex-start;
  margin-top: 4px;
  padding: 6px 16px;
}
/* .kimi-logout 的 display:inline-flex 会盖过 UA 的 [hidden]{display:none}——登出态必须显式隐藏。 */
.membership-login-btn[hidden] {
  display: none;
}
/* 登录态 Account 卡（对齐设计稿 Settings/Web › Account）：f1 底圆角 12、p16、整卡可点；
   48px f2 兜底头像 + 名称 15/22 Regular primary + 状态 12/18 Medium tertiary + 右侧 20px chevron。 */
.membership-account {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  border: 0;
  border-radius: var(--radius-lg);
  background: var(--color-fills-f1);
  padding: 16px;
  color: var(--color-labels-primary);
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: background-color 160ms ease;
}
/* 环境切换行（debug 专属）基础规则留全局：cursor:default 被全局 .settings-row 的 cursor:pointer 压死中，
   scoped 会翻盘（RFC 0017 B2 仲裁）；[hidden] 与 segmented 控件规则已迁 SettingsPage.vue。 */
.kimi-env-row {
  justify-content: space-between;
  cursor: default;
}
/* 登录后账户卡：头像 + 昵称 + 会员徽章（对齐 kimi-desktop 侧边栏样式） */
.membership-account {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 12px;
}
.account-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
  background: var(--color-labels-tertiary);
}
.account-badge {
  display: inline-flex;
  align-items: center;
  height: 16px;
  padding: 0 5px;
  border-radius: 4px;
  font-size: 10px;
  font-weight: 400;
  line-height: 14px;
  color: var(--color-background-primary);
  background: var(--color-labels-primary);
  flex-shrink: 0;
}
.account-badge[hidden] {
  display: none;
}

.membership-account:hover {
  background: var(--color-fills-f2);
}

.membership-account:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 2px var(--color-background-primary), 0 0 0 4px var(--color-brand-kimi-dark);
}

/* 单栏内容区（RFC 0016）：唯一滚动区，左右 16px 留白；账户卡/组卡/退出登录纵向堆叠。 */
.settings-content {
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1 1 auto;
  min-height: 0;
  /* 同 .history-list：交叉轴 min-content 下限防御 + 显式 overflow-x（缺省会算成 auto）。 */
  min-width: 0;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 8px 16px 24px;
  /* margin-right 8px 把滚动条挂进 [panel-16, panel-8]——与 conversation-scroll 的
     [frame-16, frame-8] 同几何，滚动条不贴面板右边框（2026-07-31 裁决）。 */
  margin-right: 8px;
  /* 滚动条走 ::-webkit-scrollbar 单一路径（与 .conversation-scroll 共享规则组）——
     标准 scrollbar-width/color 在 CEF(Chrome 104)不生效，在新 Chromium 又会盖过 webkit 规则。 */
}

/* 关键：子项禁止收缩——flex 子项默认 shrink:1，空间不足时会把各分组卡压矮裁掉行
   （矮窗格实机复现：语言行半遮、最大工具调用次数消失、假「无法滚动」），
   shrink:0 让内容溢出交给容器滚动。 */
.settings-content > * {
  flex-shrink: 0;
}

/* 分组行行首 20px 图标（设计稿：主题=太阳/显示器/月亮、思考轮数=灯泡、工具次数=魔法棒、版本=圆圈上箭头）。 */
.row-icon {
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  color: var(--color-labels-primary);
}

/* 设置行（RFC 0016）：分组卡内整行可点，行高 52、左右 16；行首 20px 图标 + label 左 + 行值/控件右。
   行本身无边框透明底，卡片外形由外层 .settings-group 承担。 */
.settings-row {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 52px;
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 8px 16px;
  color: var(--color-labels-primary);
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  text-align: left;
  cursor: pointer;
  transition: background-color 160ms ease;
}

/* f1 卡面上 hover 用 f2，--color-background-secondary 在 f1 上几乎不可见。 */
.settings-row:hover {
  background: var(--color-fills-f2);
}

.settings-row:focus-visible {
  outline: 0;
  box-shadow: inset 0 0 0 2px var(--color-brand-kimi-dark);
}

/* 置灰占位行（语言）：无交互能力，淡化 + 禁点。 */
.settings-row.is-disabled {
  cursor: default;
  opacity: 0.45;
}

.settings-row.is-disabled:hover {
  background: transparent;
}

.settings-row-label {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

/* 行值（跟随 WPS / 中文 / 当前供应商 …）：下拉类行的当前值用 labels/primary（对齐设计稿
   I7051:11676 等下拉切换行）；仅「当前版本 X」等纯信息值用 is-muted 弱化。超出省略。 */
.settings-row-value {
  flex: 0 1 auto;
  min-width: 0;
  overflow: hidden;
  color: var(--color-labels-primary);
  white-space: nowrap;
  text-overflow: ellipsis;
}

.settings-row-value.is-muted {
  color: var(--color-labels-tertiary);
}

.settings-row-caret,
.settings-row-chevron {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  color: var(--color-labels-tertiary);
}

/* 行内下拉浮层（settingsMenu.ts 挂到 .settings-row-wrap 内）：紧凑窄菜单、右对齐锚在行值下方
   （设计稿 7051:10362/7051:10645/7051:11466），宽度随内容、下限 110px。 */
.settings-row-wrap {
  position: relative;
}

/* overflow 放开期间（以及任何后续状态），首/末行的 hover 底色不再被卡片圆角裁切——
   首/末行自带同色圆角，底色永不露出直角（2026-08-01 验收事故：主题行开浮层后角变方）。
   行有两种挂法：浮层行包在 .settings-row-wrap 里，无浮层行是组卡直接子级——两路都要兜。 */
.settings-group > .settings-row-wrap:first-child .settings-row,
.settings-group > .settings-row:first-child {
  border-top-left-radius: var(--radius-lg);
  border-top-right-radius: var(--radius-lg);
}

.settings-group > .settings-row-wrap:last-child .settings-row,
.settings-group > .settings-row:last-child {
  border-bottom-left-radius: var(--radius-lg);
  border-bottom-right-radius: var(--radius-lg);
}



/* 退出登录：底部全宽大按钮，对齐组件族 Buttons secondary 44 TextLeftIcon（规格 7052:12471：
   f1 底、圆角 12、16/24 Medium primary 文字、左侧 20px 图标、图标-文字 gap 6px），非品牌黑钮。 */
.kimi-logout {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
  min-height: 44px;
  min-width: 0;
  border-radius: var(--radius-lg);
  padding: 10px 14px;
  background: var(--color-fills-f1);
  color: var(--color-labels-primary);
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
}

/* inline-flex 盖过 UA 的 [hidden]{display:none}（同 composer-readonly-hint 坑），显式补回。 */
.kimi-logout[hidden] {
  display: none;
}

/* 左侧 SignOut 图标（组件族 44 档 TextLeftIcon icon slot 20px）：kimi SignOut，currentColor 跟随文字色。 */
.kimi-logout svg {
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
}

/* 退出登录是次级按钮：hover 用组件族 secondary hover（--color-fills-f1-hover，有效色 #EFEFEF）。
   不能复用主按钮的 brand-dark hover——底色翻转后文字色不跟随，两种主题下都会字底同色看不清。 */
.kimi-logout:not(:disabled):hover {
  background: var(--color-fills-f1-hover);
  color: var(--color-labels-primary);
}

.kimi-logout:not(:disabled):active {
  background: var(--color-fills-f3);
  color: var(--color-labels-primary);
  transform: scale(0.97);
}

/* secondary disabled（组件族）：底不变、字转 labels/quaternary rgba(0,0,0,0.3)（规格 7052:12190）。 */
.kimi-logout:disabled {
  color: var(--color-buttons-disabled-text-secondary);
}

/* 设置页模态（管理模型供应商 / 添加编辑表单 / 版本更新共用外壳）：遮罩铺满面板 + 居中卡片。 */
.settings-modal-overlay {
  position: absolute;
  inset: 0;
  z-index: var(--z-dialog);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  background: rgba(0, 0, 0, 0.4);
}

.settings-modal-overlay[hidden] {
  display: none;
}

/* 卡片 320px（设计稿 360px@540 等比收窄，402 窗格不追像素）：f1 底、圆角 20、p16。
   mask 上的弹窗不加投影（走查行40）——亮色靠 f1 底、暗色靠下方描边抬升块定边界。 */
.settings-modal {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 320px;
  max-width: 100%;
  max-height: calc(100% - 32px);
  overflow-y: auto;
  border-radius: var(--radius-2xl);
  background: var(--color-background-primary);
  padding: 16px;
}

.settings-modal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.settings-modal-head strong {
  color: var(--color-labels-primary);
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
}

.settings-modal-close {
  flex: 0 0 auto;
}

/* 共享族 .menu-switch 的禁用态：与浮层禁用项同档 0.45（原与 provider-manager 禁用分支联合，RFC 0017 B2 拆出留全局）。 */
button.menu-switch:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}


input {
  /* border-box + 定高 40（20 内容行 + 10×2 padding）：旧 min-height 走 content-box，
     内容已撑满 40 再加 1px×2 边框溢成 42。 */
  box-sizing: border-box;
  width: 100%;
  height: 40px;
  /* 默认态无边框（填充 f1 即边界）；focus 描边走 inset box-shadow 画在 40px 盒内（见下）。 */
  border: 0;
  border-radius: var(--radius-lg);
  outline: 0;
  background: var(--color-fills-f1);
  color: var(--color-labels-primary);
  font-size: 14px;
  line-height: 20px;
  padding: 10px 12px;
}

input::placeholder {
  color: var(--color-labels-tertiary);
}

/* focus（输入中）态：0.5px 内描边 separator/s1（规格 7030:42364）——inset shadow 不占盒尺寸，
   总高保持 40px；textarea 无边框不受此规则影响（composer 聚焦由卡片阴影表达）。 */
input:focus {
  box-shadow: inset 0 0 0 0.5px var(--color-separator-s1);
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}

/* 遮罩和内容排版由多个浮层共享，须保留在全局样式中。
   确认浮层的层级必须高于触发它的模态，避免被遮挡。
   入场使用 CSS 动画，卸载不依赖 transitionend，避免关闭时节点残留。 */
.confirm-overlay {
  position: absolute;
  inset: 0;
  z-index: var(--z-dialog-alert);
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  place-items: center;
  padding: 16px;
  background: var(--color-mask-base);
  animation: overlay-in 180ms var(--motion-ease-out);
}

.confirm-title {
  margin: 0 0 12px;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  color: var(--color-labels-primary);
}

.confirm-message {
  margin: 0 0 16px;
  font-size: 14px;
  line-height: 20px;
  color: var(--color-labels-primary);
  word-break: break-word;
  /* message 里的 \n 分段生效（走查行43：文件夹授权弹窗路径与正文连排不可读）。 */
  white-space: pre-line;
}

.confirm-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

/* 会话渲染域（观看隔离）：每个会话的对话流子树容器（.session-view，#chat-log 子元素）与浮层挂载点
   （.session-overlay-host，.app-shell 子元素；其两条规则随 R4a 迁 SessionOverlayHost.vue scoped）。
   display:contents 让子级直接参与外层布局——气泡照常吃 .chat-log 的 grid gap/order、浮层照常相对
   .app-shell 绝对定位；hidden（切走的会话）整域隐藏。 */
.session-view {
  display: contents;
}

.session-view[hidden] {
  display: none;
}

/* Kimi Web Toast：顶部居中深色浮层；状态差异由语义类和文案表达，不铺浅色背景。 */
.toast-root {
  position: fixed;
  top: 16px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  z-index: var(--z-toast);
  pointer-events: none;
}

@keyframes overlay-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes dialog-in {
  from {
    opacity: 0;
    transform: scale(0.96);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 1ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 1ms !important;
  }
}

/* ── 「+」菜单残余全局规则：菜单项 chevron 属 .attachment-menu 共享族；.skills-card 骨架/插件项样式已迁 PickerCard.vue scoped ── */
.attachment-menu-chevron {
  display: grid;
  place-items: center;
  color: var(--color-labels-tertiary);
}
.attachment-menu-chevron svg { display: block; width: 16px; height: 16px; }
/* 「插件」卡片残余：.plugin-card-icon 双主（composer 插件卡 + 设置面板网格）留全局（R4c 登记 SHARED）。 */
.plugin-card-icon {
  width: 44px;
  height: 44px;
  flex: none;
  border-radius: 12px;
  border: 0.5px solid var(--color-separator-s1, rgba(0, 0, 0, 0.08));
  object-fit: cover;
  background: var(--color-background-secondary, #f5f5f5);
}

/* 暗色设置浮层通过背景和描边与页面区分，避免同色时边界不可见。 */
:root[data-theme='dark'] .settings-modal {
  background: var(--color-background-tertiary);
  border: 1px solid var(--color-separator-s1);
}

/* 弹层内的按钮共用尺寸规则，须保留在全局样式中。 */
.modal-mask .kimi-button,
.confirm-modal .kimi-button {
  min-width: 62px;
  height: 32px;
  padding: 6px 10px;
  border-radius: var(--radius-md);
}

/* —— 独立登录页与会员拦截页（RFC 0018，设计稿 7030:45753）——
   单组件模板直辖样式已收进 LoginPage.vue / PaywallPage.vue 的 <style scoped>（登记制，
   清单见 tests/unit/migratedSfcStyles.ts）。本段只留两类全局族（vueSfcStyles.spec.ts 登记）：
   ① 双页共享族（SHARED）：.login-logotype、.login-submit——登录页与拦截页双主。
   ② 命令式 DOM 族（IMPERATIVE）：协议勾选行与弹窗 .login-agree 全族（agreementModal 运行时
      建节点挂 #login-panel，无组件 scope 标记；勾选行同时被登录页页脚模板复用）、
      区号下拉项 .login-country-option（smsLoginSection 运行时创建）。 */
.login-logotype {
  flex: 0 0 auto;
  width: 72px;
  height: 24px;
  /* logotype 随主题反色（亮色黑 / 暗色近白）：SVG 转 mask，由 background 上色。 */
  background: var(--color-labels-primary);
  -webkit-mask: url('/images/login-logotype.svg') no-repeat center / contain;
  mask: url('/images/login-logotype.svg') no-repeat center / contain;
}
/* 登录主按钮：启用为品牌黑底白字；禁用为 f3 底 + quaternary 字（设计稿 7030:45766）。 */
.login-submit {
  height: 48px;
  border: 0;
  border-radius: var(--radius-lg);
  background: var(--color-brand-kimi-dark);
  color: var(--color-always-white);
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  cursor: pointer;
  transition: background-color 160ms ease;
}
.login-submit:hover:not(:disabled) {
  background: var(--color-brand-kimi-dark-hover);
}
.login-submit:disabled {
  background: var(--color-fills-f3);
  color: var(--color-labels-quaternary);
  cursor: default;
}
.login-country-option {
  border: 0;
  min-height: 36px;
  border-radius: var(--radius-md);
  outline: 0;
  padding: 8px;
  background: transparent;
  color: var(--color-labels-primary);
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  text-align: left;
  cursor: pointer;
}
.login-country-option:hover {
  background: var(--color-fills-f1);
}
.login-country-option.selected {
  font-weight: 600;
}
/* 协议弹窗（RFC 0018 旅程 C）：命令式 DOM 浮层，卡片与按钮样式只能留全局层——
   .confirm-dialog/.confirm-cancel/.confirm-confirm 基座已随设计迁移收进各 Dialog SFC scoped，
   这里按弹窗自己的钩子类写同名取值（与 FolderMountDialog 卡片对齐）。 */
.login-agree-dialog {
  z-index: var(--z-dialog);
  width: min(360px, 100%);
  min-width: 0;
  background: var(--color-background-primary);
  border-radius: var(--radius-2xl);
  padding: 16px;
  box-shadow: none;
  animation: dialog-in 180ms var(--motion-ease-out);
}
:root[data-theme='dark'] .login-agree-dialog {
  background: var(--color-background-tertiary);
  border: 1px solid var(--color-separator-s1);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.5);
}
.login-agree-dialog .confirm-cancel,
.login-agree-dialog .confirm-confirm {
  border: 0;
  min-width: 62px;
  height: 32px;
  border-radius: var(--radius-md);
  padding: 6px 10px;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  cursor: pointer;
}
.login-agree-dialog .confirm-cancel {
  background: var(--color-fills-f1);
  color: var(--color-labels-primary);
}
.login-agree-dialog .confirm-cancel:hover {
  background: var(--color-fills-f2);
}
.login-agree-dialog .confirm-confirm {
  background: var(--color-brand-kimi-dark);
  color: var(--color-background-primary);
}
.login-agree-dialog .confirm-confirm:hover {
  background: var(--color-brand-kimi-dark-hover);
}
/* 未勾选弹窗内同意框时确认键禁用。 */
.login-agree-dialog .confirm-confirm:disabled {
  opacity: 0.4;
  cursor: default;
}
.login-agree-modal-row {
  margin: 0 0 16px;
}
.login-agree {
  display: flex;
  align-items: center;
  gap: 4px;
}
/* 圆形勾选框（设计稿 Checkboxs/Circle，16×16）：未选中为 1px 描边圆；选中态为「蓝圆盘 + 白色对勾」
   单层 SVG，对勾路径取自设计稿 Subtract 字形。不能垫白底——白底会超出 13.33px 字形边缘露出白圈。 */
.login-agree-checkbox {
  appearance: none;
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  margin: 0;
  /* 抵消全局 input 规则的 padding，否则 16px 盒被内边距挤压、背景字形失去居中基准。 */
  padding: 0;
  border: 1px solid var(--color-labels-quaternary);
  border-radius: var(--radius-full);
  background: transparent;
  cursor: pointer;
}
/* 全局 input:focus 的 inset 描边会沿圆周画一圈灰环（点击勾选后必触发焦点），勾选框不需要它。 */
.login-agree-checkbox:focus {
  box-shadow: none;
}
/* 键盘 Tab 聚焦时给品牌色外环作焦点指示；鼠标点击不匹配 focus-visible，不会带回灰环。 */
.login-agree-checkbox:focus-visible {
  box-shadow:
    0 0 0 2px var(--color-background-primary),
    0 0 0 4px var(--color-brand-kimi-dark);
}
.login-agree-checkbox:checked {
  border-color: transparent;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13.333 13.333'%3E%3Ccircle cx='6.6665' cy='6.6665' r='6.6665' fill='%231783FF'/%3E%3Cpath d='M10.0908 4.37598C9.85651 4.14166 9.4765 4.14166 9.24219 4.37598L5.6748 7.94336L4.28516 6.55273C4.05092 6.3185 3.67086 6.31864 3.43652 6.55273C3.20221 6.78705 3.20221 7.16705 3.43652 7.40137L5.25098 9.21582C5.4853 9.45007 5.86531 9.45011 6.09961 9.21582L10.0908 5.22461C10.3251 4.99031 10.3251 4.6103 10.0908 4.37598Z' fill='%23fff'/%3E%3C/svg%3E")
    no-repeat center / 13.33px;
}
/* 暗色主题：data URI 里无法引用 var，同一字形把圆盘填充换成暗色品牌蓝 #3b92ff 重写一遍。 */
:root[data-theme='dark'] .login-agree-checkbox:checked {
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13.333 13.333'%3E%3Ccircle cx='6.6665' cy='6.6665' r='6.6665' fill='%233b92ff'/%3E%3Cpath d='M10.0908 4.37598C9.85651 4.14166 9.4765 4.14166 9.24219 4.37598L5.6748 7.94336L4.28516 6.55273C4.05092 6.3185 3.67086 6.31864 3.43652 6.55273C3.20221 6.78705 3.20221 7.16705 3.43652 7.40137L5.25098 9.21582C5.4853 9.45007 5.86531 9.45011 6.09961 9.21582L10.0908 5.22461C10.3251 4.99031 10.3251 4.6103 10.0908 4.37598Z' fill='%23fff'/%3E%3C/svg%3E")
    no-repeat center / 13.33px;
}
.login-agree-text {
  margin: 0;
  color: var(--color-labels-tertiary);
  font-size: 12px;
  line-height: 18px;
}
.login-agree-link {
  border: 0;
  padding: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-weight: 500;
  cursor: pointer;
}

/* 工作空间列表由控制器创建，使用全局样式。 */
.workspace-group-label {
  margin: 10px 0 0;
  color: var(--color-labels-tertiary);
  font-size: 12px;
}

.workspace-row {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 56px;
  padding: 10px 12px;
  border: 1px solid var(--color-separator-s1);
  border-radius: 10px;
  background: var(--color-background-tertiary);
  color: var(--color-labels-primary);
  text-align: left;
}

.workspace-row:hover:not(:disabled),
.workspace-row[aria-current='true'] {
  border-color: var(--color-labels-tertiary);
  background: var(--color-fills-f1);
}

.workspace-row:disabled {
  cursor: default;
  opacity: 0.55;
}

.workspace-row__icon {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
  overflow: hidden;
  border-radius: 8px;
  background: var(--color-fills-f2);
  color: var(--color-labels-secondary);
  font-size: 13px;
}

.workspace-row__icon img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.workspace-row__copy {
  min-width: 0;
  flex: 1;
}

.workspace-row__name,
.workspace-row__detail {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.workspace-row__name {
  font-size: 13px;
  font-weight: 600;
}

.workspace-row__detail {
  margin-top: 2px;
  color: var(--color-labels-tertiary);
  font-size: 11px;
}

.workspace-row__state {
  color: var(--color-labels-tertiary);
  font-size: 12px;
  white-space: nowrap;
}

.workspace-retry {
  align-self: flex-start;
  min-height: 32px;
  padding: 0 12px;
  border: 1px solid var(--color-separator-s1);
  border-radius: 8px;
  background: var(--color-background-tertiary);
  color: var(--color-labels-primary);
  font-size: 12px;
}

/* 回答内定位引用标签（docs/rfcs/2026-10-21-answer-citations-design.md 4.3）：与输入框内选区 chip 同一套浅灰小胶囊，
   可点击所以文字用主色、带定位图标；悬停加深，键盘聚焦给蓝色描边。状态只靠类名与 aria-disabled 切换。 */
.citation-chip {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  max-width: 100%;
  box-sizing: border-box;
  margin: 0 1px;
  padding: 0 7px 0 5px;
  border: 0;
  border-radius: 12px;
  background: var(--color-fills-f1);
  color: var(--color-labels-primary);
  font: inherit;
  font-size: 13px;
  line-height: 20px;
  vertical-align: baseline;
  cursor: pointer;
  transition: background 120ms linear, color 120ms linear;
}
.citation-chip-nowrap {
  white-space: nowrap;
}
/* 标签后紧跟全角标点时收紧右侧：全角标点字形自带留白，再加外边距看起来像多了一个空格。 */
.citation-chip-nowrap > .citation-chip {
  margin-right: 0;
  padding-right: 5px;
}
.citation-chip:hover {
  background: var(--color-fills-f3);
}
.citation-chip:active {
  background: var(--color-fills-f4);
}
.citation-chip:focus-visible {
  outline: 2px solid var(--color-brand-km-blue);
  outline-offset: 1px;
}
.citation-chip-icon {
  flex: none;
  width: 12px;
  height: 12px;
  background: var(--color-labels-tertiary);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round'%3E%3Ccircle cx='8' cy='8' r='4.6'/%3E%3Ccircle cx='8' cy='8' r='1.3' fill='black' stroke='none'/%3E%3Cpath d='M8 1v2.2M8 12.8V15M1 8h2.2M12.8 8H15'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round'%3E%3Ccircle cx='8' cy='8' r='4.6'/%3E%3Ccircle cx='8' cy='8' r='1.3' fill='black' stroke='none'/%3E%3Cpath d='M8 1v2.2M8 12.8V15M1 8h2.2M12.8 8H15'/%3E%3C/svg%3E") center / contain no-repeat;
  transition: background 120ms linear;
}
.citation-chip:hover .citation-chip-icon {
  background: var(--color-brand-km-blue);
}
.citation-chip-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.citation-chip-sheet {
  color: var(--color-labels-secondary);
}
.citation-chip[aria-disabled='true'] .citation-chip-sheet {
  color: inherit;
}
/* 定位中：图标换成转圈，标签本身仍可见，避免排队等待时整块闪动。 */
.citation-chip.is-locating {
  cursor: progress;
}
.citation-chip.is-locating .citation-chip-icon {
  -webkit-mask: none;
  mask: none;
  background: transparent;
  border: 1.5px solid var(--color-fills-f4);
  border-top-color: var(--color-labels-secondary);
  border-radius: 50%;
  box-sizing: border-box;
  animation: ui-spin 700ms linear infinite;
}
/* 置灰：不可点，悬停用提示气泡说明原因。用 aria-disabled 而非 disabled，禁用按钮收不到 mouseenter。 */
.citation-chip[aria-disabled='true'] {
  color: var(--color-labels-quaternary);
  background: var(--color-fills-f1);
  cursor: default;
}
.citation-chip[aria-disabled='true'] .citation-chip-icon {
  background: var(--color-labels-quaternary);
}
.citation-chip.is-failed .citation-chip-icon {
  background: var(--color-status-orange);
}

.citation-tooltip {
  position: fixed;
  z-index: 1000;
  max-width: min(260px, calc(100vw - 16px));
  box-sizing: border-box;
  padding: 6px 10px;
  border-radius: var(--radius-sm);
  background: var(--color-mask-toast-pc);
  color: var(--color-always-white);
  font-size: 12px;
  line-height: 18px;
  pointer-events: none;
  opacity: 0;
  transform: translateY(2px);
  transition: opacity 120ms ease, transform 120ms ease;
}
.citation-tooltip.is-visible {
  opacity: 1;
  transform: none;
}
@media (prefers-reduced-motion: reduce) {
  .citation-chip.is-locating .citation-chip-icon {
    animation-duration: 1.6s;
  }
  .citation-tooltip {
    transition: none;
  }
}