/* ==========================================================================
   跨境军师 SellerStrategist AI · 样式表
   Design tokens 源自 Ardot 画布（暖白 #F7F5F1 + 鼠尾草青 #35786B）
   ========================================================================== */

/* ---------- Design Tokens ---------- */
:root {
  /* 色彩 · 中性 */
  --cream: #F7F5F1;
  --cream-2: #F4F2EC;
  --white: #FFFFFF;
  --border: #E6E2D8;
  --line: #EFEBE2;

  /* 色彩 · 文本 */
  --text: #37352F;
  --text-2: #5A554B;
  --text-3: #8A8474;
  --text-4: #A9A399;
  --text-5: #C4BFB4;

  /* 色彩 · 品牌 */
  --teal: #35786B;
  --teal-deep: #2C5F55;
  --teal-soft: #6BA8A0;
  --teal-tint: #E7F1EE;

  /* 色彩 · 语义 */
  --green: #2E8B5F;
  --green-tint: #E7F3EB;
  --red: #C0523D;
  --red-tint: #F9ECE8;
  --amber: #A97514;
  --amber-tint: #FBF3E4;
  --amber-bg: #F8F1DF;
  --blue: #4A6FA5;
  --blue-tint: #EDF1F7;
  --purple: #7E57C2;
  --purple-tint: #F4ECFB;

  /* 圆角 */
  --r-sm: 6px;
  --r-md: 8px;
  --r-lg: 12px;
  --r-xl: 16px;

  /* 阴影 */
  --shadow-sm: 0 1px 2px rgba(40, 32, 16, .04);
  --shadow-md: 0 2px 12px rgba(40, 32, 16, .06);
  --shadow-lg: 0 8px 28px rgba(40, 32, 16, .10);

  /* 字体 */
  --font: 'Noto Sans SC', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

/* ---------- Base / Reset ---------- */
*, *::before, *::after { box-sizing: border-box; }

html, body { margin: 0; padding: 0; }

body {
  background: var(--cream);
  color: var(--text);
  font-family: var(--font);
  font-size:16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, p, ul, ol, dl, dd { margin: 0; }
ul, ol { padding: 0; list-style: none; }
button { font-family: inherit; cursor: pointer; }
b, strong { font-weight: 600; }
small { font-size: inherit; }

:focus-visible {
  outline: 2px solid var(--teal);
  outline-offset: 2px;
  border-radius: var(--r-sm);
}

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

.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 100;
  background: var(--teal);
  color: #fff;
  padding: 8px 16px;
  border-radius: 0 0 var(--r-md) 0;
}
.skip-link:focus { left: 0; }

.hidden { display: none !important; }
[hidden] { display: none !important; } /* 防止 flex/grid display 覆盖 hidden 属性 */
.ico { width: 16px; height: 16px; flex-shrink: 0; }

/* ---------- App 布局 ---------- */
/* 关键：外层锁定为视口高度且不滚动 —— 滚动只发生在右侧 .body 内部，
   文档流本身永不滚动，因此左侧栏天然固定，不会跟着右侧内容上下移动。
   （此前为 min-height:100vh，整页被内容撑高 → 滚动发生在 document 上，
     侧边栏与内容一起滚走；这是"左侧跟着滑动"的根因。） */
.app {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  grid-template-rows: minmax(0, 1fr);   /* 单行：侧栏 + 主区（顶部提示条已移入顶栏，2026-10-20） */
  height: 100vh;
  height: 100dvh; /* 移动端动态视口（含地址栏收缩），不支持的浏览器回落 100vh */
  overflow: hidden;
}

/* ---------- 顶部提示条（2026-10-17 初版 / 2026-10-20 移入顶栏居中）----------
   与用户头像同一行、绝对水平居中，不另占一整行、不挤压 LOGO 与工作台。
   字体跟随站内默认（LOGO 同款 Noto Sans SC），颜色调淡。 */
.top-note {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  max-width: 46%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: var(--text-4);
  font-family: var(--font);
  font-size: 12px;
  letter-spacing: 0.02em;
  line-height: 1;
}
.top-note__link {
  border: 0; background: none; padding: 0;
  font: inherit; letter-spacing: inherit;
  color: var(--teal); cursor: pointer;
  text-decoration: underline; text-decoration-style: dotted;
  text-underline-offset: 3px;
}
.top-note__link:hover { text-decoration-style: solid; }

/* ---------- 侧边栏 ---------- */
.sidebar {
  background: var(--white);
  border-right: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  padding: 20px 0;
  min-height: 0; /* 允许内部子项在高度受限时收缩（最近会话自己滚） */
}
/* 品牌区 / 新建按钮 / 功能模块 / 知识来源库 / 分隔线 / 账号区 一律不压缩：
   它们在任何滚动状态下都停在原处，多余的高度全部由「最近会话」内部滚动消化 */
.sidebar > .sidebar__brand,
.sidebar > .sidebar__new,
.sidebar > .sidebar__nav,
.sidebar > .sidebar__kb,
.sidebar > .sidebar__divider,
.sidebar > .sidebar__user { flex-shrink: 0; }

.sidebar__brand {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 16px 12px;
}
.brand-mark {
  width: 34px; height: 34px;
  border-radius: 9px;
  background: var(--teal);
  color: #fff;
  display: grid;
  place-items: center;
  font-weight: 700;
}
/* 品牌图形（SVG）：尺寸已按 34px 圆角块对齐，等比填满即可 */
.brand-mark img {
  display: block;
  width: 100%; height: 100%;
  border-radius: inherit;
}
.brand-name b { display: block; font-size:17px; line-height: 1.3; }
.brand-name small { font-size:11px; color: var(--text-3); letter-spacing: .5px; }

.sidebar__new { margin: 0 16px; }

.sidebar__label {
  font-size:13px;
  font-weight: 500;
  color: var(--text-4);
  padding: 10px 8px 4px;
}
.sidebar__nav { padding: 6px 12px 0; }
.sidebar__divider { height: 1px; background: var(--line); margin: 10px 16px; }

.nav-item {
  display: flex;
  align-items: center;
  gap: 10px;
  height: 38px;
  padding: 0 12px;
  border-radius: var(--r-md);
  color: var(--text-2);
  font-size:15px;
  text-decoration: none;
  transition: background 120ms ease;
}
.nav-item:hover { background: var(--cream); }
.nav-item.is-active {
  background: var(--teal-tint);
  color: var(--teal-deep);
  font-weight: 600;
}
.nav-tag { margin-left: auto; font-size:12px; color: var(--text-5); font-weight: 500; }
.nav-item.is-active .nav-tag { color: var(--teal-soft); }

.sidebar__sessions { flex: 1 1 auto; overflow-y: auto; overscroll-behavior: contain; padding: 0 12px; min-height: 0; }
.session-list li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  height: 34px;
  padding: 0 12px;
  border-radius: var(--r-md);
  font-size:14px;
  color: var(--text-2);
  cursor: pointer;
  white-space: nowrap;
  overflow: hidden;
}
.session-list li:hover { background: var(--cream); }
/* 当前打开的会话：与 hover 区分，让用户知道自己在哪一段对话里 */
.session-list li.is-active { background: var(--teal-tint); color: var(--teal-deep); font-weight: 500; }
.session-list li > span:first-child { overflow: hidden; text-overflow: ellipsis; }
.session-list .t { font-size:12px; color: var(--text-5); flex-shrink: 0; }

.sidebar__user {
  position: relative;
  padding: 8px 8px 0;
}
.sidebar__user-btn {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 8px;
  border: 0;
  border-radius: var(--r-md);
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
  transition: background 120ms ease;
}
.sidebar__user-btn:hover,
.sidebar__user-btn[aria-expanded="true"] { background: var(--cream); }
.sidebar__user-chev { margin-left: auto; color: var(--text-4); transition: transform 120ms ease; }
.sidebar__user-btn[aria-expanded="true"] .sidebar__user-chev { transform: rotate(180deg); }
.user-info b { display: block; font-size:14px; }
.user-info small { font-size:12px; color: var(--text-3); }
/* 双类选择器提高优先级：基础 .user-menu 定义在文件更后，单类会被其 top:calc(100%+10px) 覆盖（曾导致侧边栏菜单往下弹） */
.user-menu.user-menu--sidebar {
  top: auto;
  bottom: calc(100% + 10px);
  left: 8px;
  right: 8px;
  width: auto;
}

.avatar {
  width: 32px; height: 32px;
  border-radius: 50%;
  background: var(--teal-tint);
  color: var(--teal-deep);
  display: grid;
  place-items: center;
  font-weight: 600;
  font-size:14px;
  flex-shrink: 0;
}
.avatar--sm { width: 30px; height: 30px; }
/* 未登录态：圆形头像里放「未登录」三字。中文全角宽≈1em，三字宽度须 ≤ 圆在文字
   行高处的可用宽度（32px 圆约 29px、.avatar--sm 的 30px 圆约 27px），
   故压到 8px 并微收字距，左右各留 ~1.5px 余量 */
.avatar--guest { font-size:10px; letter-spacing: -.2px; }

.scrim {
  position: fixed;
  inset: 0;
  z-index: 40;
  background: rgba(40, 32, 16, .35);
}

/* ---------- 顶栏 ---------- */
.main { display: flex; flex-direction: column; min-width: 0; min-height: 0; }

.topbar {
  height: 60px;
  background: var(--white);
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 0 24px;
  flex-shrink: 0;
  position: relative;   /* 顶部提示条绝对居中于此（2026-10-20） */
}
/* 双类选择器提高优先级：防止被后定义的 .icon-btn{display:grid} 覆盖（曾导致桌面端三道杠误显示且点击无效） */
.topbar .topbar__menu { display: none; }
.topbar__chat, .topbar__page { display: flex; align-items: center; gap: 12px; flex: 1; min-width: 0; }
.topbar__title { font-size:20px; font-weight: 600; }
.topbar__right { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }

/* 头像下拉菜单 */
.user-menu-wrap { position: relative; }
.avatar--btn { border: 0; padding: 0; cursor: pointer; transition: box-shadow 120ms ease; }
.avatar--btn:hover, .avatar--btn[aria-expanded="true"] { box-shadow: 0 0 0 2px var(--teal-soft); }
.user-menu {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  width: 300px;
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-lg);
  padding: 6px;
  z-index: 55;
}
.user-menu__head { display: flex; align-items: center; gap: 10px; padding: 10px; }
.user-menu__head b { display: block; font-size:16px; line-height: 1.3; }
.user-menu__head small { font-size:14px; color: var(--text-3); }
.user-menu__section { padding: 10px; border-top: 1px solid var(--line); }
.user-menu__label {
  font-size:13px;
  font-weight: 500;
  color: var(--text-4);
  margin: 0 0 6px;
}
.user-menu__row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  font-size:14px;
  color: var(--text-2);
  padding: 3px 0;
}
.user-menu__row b { color: var(--text); font-weight: 600; font-variant-numeric: tabular-nums; }
.user-menu__plan { display: flex; justify-content: space-between; align-items: center; gap: 10px; font-size:14px; color: var(--text-2); }
/* 修复（2026-10-15）：档位名被右侧 badge 挤成竖排——
   左侧档位名不可收缩、永不折行；超宽时让 badge 自己折行而不是挤压左侧。 */
.user-menu__plan > span:first-child { flex: 0 0 auto; white-space: nowrap; }
.user-menu__plan .badge { white-space: normal; text-align: right; line-height: 1.45; min-width: 0; }
.user-menu .btn { width: 100%; margin-top: 10px; }
/* 退出登录：弱化的次要操作，不与「管理订阅」抢视觉。
   选择器用双类是为了盖掉 .btn 的 border:0（同为单类时靠后定义才生效） */
.user-menu .user-menu__logout {
  background: transparent;
  border: 1px solid var(--border);
  color: var(--text-3);
}
.user-menu .user-menu__logout:hover { background: var(--cream); color: var(--text-2); }

.tabs { display: flex; gap: 6px; }
.tab {
  height: 34px;
  padding: 0 16px;
  border: 0;
  border-radius: var(--r-md);
  background: transparent;
  color: var(--text-2);
  font-size:15px;
  transition: background 120ms ease;
}
.tab:hover { background: var(--cream); }
/* 模块后台生成角标（⏳）：listing/wiki 各自生成中互不影响 */
.tab .busy-dot { font-size:14px; }
.tab[aria-selected="true"] {
  background: var(--teal-tint);
  color: var(--teal-deep);
  font-weight: 600;
}

.badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  height: 26px;
  padding: 0 10px;
  border-radius: var(--r-sm);
  font-size:13px;
  font-weight: 500;
  background: var(--green-tint);
  color: var(--green);
  white-space: nowrap;
}
.badge--amber { background: var(--amber-bg); color: var(--amber); }
.badge--blue { background: var(--blue-tint); color: var(--blue); }
.badge--purple { background: var(--purple-tint); color: var(--purple); }

/* ---------- 按钮 / 芯片 ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 38px;
  padding: 0 16px;
  border: 0;
  border-radius: var(--r-md);
  font-size:14px;
  font-weight: 500;
  text-decoration: none;
  transition: filter 120ms ease, opacity 120ms ease;
}
.btn:hover { filter: brightness(.97); }
.btn:disabled { opacity: .5; cursor: not-allowed; }
.btn--primary { background: var(--teal); color: #fff; }
.btn--secondary { background: var(--white); color: var(--text-2); border: 1px solid var(--border); }
.btn--amber { background: var(--amber-bg); color: var(--amber); }

.icon-btn {
  width: 38px; height: 38px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--text-3);
  display: grid;
  place-items: center;
  flex-shrink: 0;
}
.icon-btn:hover { background: var(--cream-2); }
.send-btn { background: var(--teal); }
.send-btn:hover { background: var(--teal); filter: brightness(1.05); }

.chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 30px;
  padding: 0 14px;
  border: 1px solid var(--border);
  border-radius: 15px;
  background: var(--white);
  color: var(--text-2);
  font-size:14px;
  transition: background 120ms ease;
}
.chip:hover { background: var(--cream); }

.mini-btn {
  height: 30px;
  padding: 0 12px;
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  background: var(--white);
  color: var(--text-2);
  font-size:13px;
  font-weight: 500;
}
.mini-btn--danger { border-color: rgba(192, 82, 61, .7); color: var(--red); }

/* ---------- 对话视图 ---------- */
/* .body = 右侧唯一滚动容器。工作台/日历/来源库等长页面仍由它滚动。 */
.body {
  flex: 1 1 auto;
  min-height: 0; /* 关键：flex 子项默认 min-height:auto 会被内容撑开，滚动条将失效 */
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain; /* 滚到底不把滚动传递给外层 */
  background: var(--cream);
}
.view { display: flex; flex-direction: column; min-height: 100%; }

/* 对话视图独占 .body 高度、自身不外溢；滚动下放到 .chat，
   输入区则作为 .chat 的兄弟节点常驻底部，永不随消息增长被挤出屏幕 */
#view-chat { height: 100%; min-height: 0; overflow: hidden; }

.chat {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  /* 2026-10-13：原为 contain —— 它把「滚到底后继续滚」的滚动链掐断，导致全站页脚
     （2026-10-07 加入）在对话页永远滚不出来（ICP 备案号合规展示受阻）。改为 auto 后：
     对话区滚到底继续滚 ⇒ 自然带出页脚，与其它页面行为一致；终极边界仍由 .body 的
     contain 兜住（不会把滚动传给 document）。实测 1440×900 真实滚轮：
     修复前 .body 滚动量恒为 0（连滚 16 次不动），修复后 0 → 168（页脚全部高度）。 */
  overscroll-behavior: auto;
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 28px 40px;
}
/* flex:0 0 auto —— 禁止 .thread 被压缩：消息过多时由 .chat 出滚动条，
   而不是把消息挤扁或把后面的输入区顶下去 */
.thread { flex: 0 0 auto; display: flex; flex-direction: column; gap: 20px; }

.msg-row { display: flex; }
.msg-row--user { justify-content: flex-end; }

.bubble {
  max-width: 600px;
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  padding: 12px 18px;
  font-size:16px;
}

.ai-card, .rating-card {
  max-width: 820px;
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  padding: 22px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.ai-head { display: flex; align-items: center; gap: 10px; }
.ai-head .spacer { flex: 1; }
.ai-avatar {
  width: 30px; height: 30px;
  border-radius: 9px;
  background: var(--teal);
  color: #fff;
  display: grid;
  place-items: center;
  font-size:16px;
  flex-shrink: 0;
}
.ai-name { font-size:15px; font-weight: 600; }
.ai-time { font-size:13px; color: var(--text-5); font-variant-numeric: tabular-nums; }
/* AI 回答卡片右上角的完整时间戳（年月日时分秒） */
.ai-head { position: relative; }
.ai-card { position: relative; }
/* 流式生成中的动画：闪烁光标 + 卡片呼吸描边——切走再切回也不丢 */
.live-stream { min-height: 24px; }
.live-stream::after { content: '▍'; color: var(--teal); animation: caretBlink 1s steps(2) infinite; }
@keyframes caretBlink { 50% { opacity: 0; } }
.ai-card.is-streaming { border-color: var(--teal); animation: cardBreath 2.2s ease-in-out infinite; }
@keyframes cardBreath { 50% { box-shadow: 0 0 0 4px rgba(44, 95, 85, .10); } }
/* 生成失败卡（前台可见 + 重试按钮） */
.chat-error-card { border-color: rgba(192, 82, 61, .4); background: var(--red-tint, #FBEFEC); }
.ai-para { font-size:16px; line-height: 1.7; }
/* 流式回答完成后的 Markdown 容器（替换 .live-stream 的纯文本态） */
.md-answer { font-size:16px; line-height: 1.7; }
/* 回答里的 Markdown 排版元素（前端自行渲染的极简子集，见 js/app.js mdRender） */
.ai-card h4 { font-size:15.5px; font-weight: 700; color: var(--text-1); margin: 14px 0 6px; }
.ai-card ul, .ai-card ol { margin: 6px 0 10px; padding-left: 20px; font-size:16px; line-height: 1.75; }
.ai-card li { margin: 3px 0; }
.ai-card code { background: rgba(0,0,0,.055); border-radius: 4px; padding: 1px 5px;
  font-size:14.5px; font-family: ui-monospace, Menlo, Consolas, monospace; }
.ai-card pre { background: #F4F2ED; border-radius: 8px; padding: 10px 12px; margin: 8px 0;
  overflow-x: auto; font-size:14.5px; line-height: 1.6;
  font-family: ui-monospace, Menlo, Consolas, monospace; }
.ai-card table { width: 100%; border-collapse: collapse; margin: 10px 0; font-size:15px; }
.ai-card th, .ai-card td { border: 1px solid var(--line); padding: 7px 9px; text-align: left;
  line-height: 1.6; vertical-align: top; }
.ai-card th { background: rgba(0,0,0,.03); font-weight: 600; }
.ai-para .cite-mark { color: var(--blue); font-weight: 600; }
/* 引用角标可点击 + 来源行高亮（2026-09-18：兑现「角标可查看来源」承诺） */
.cite-mark { cursor: pointer; }
.citations__row.is-flash { background: rgba(44, 95, 85, .14); border-radius: 6px;
  transition: background .5s ease-out; }
/* 内联小按钮（删除报表等） */
.link-btn { background: none; border: none; padding: 0; cursor: pointer;
  color: var(--teal); font-size:14px; text-decoration: underline; }
/* 示例填充行（流量词示例 / Listing 示例选择） */
.sample-row { display: flex; align-items: center; gap: 10px; margin: 10px 0; flex-wrap: wrap; }
.sample-row__hint { font-size:13px; color: var(--text-3); }
/* TOP 热词表（ABA 排行） */
.hotword-box { margin-top: 10px; }
.hotword-note { font-size:14px; color: var(--text-2); margin: 0 0 8px; }
.hotword-table { width: 100%; border-collapse: collapse; font-size:14.5px; }
.hotword-table th, .hotword-table td { border: 1px solid var(--line); padding: 6px 9px; text-align: left; }
.hotword-table th { background: rgba(0,0,0,.03); font-weight: 600; }
.hotword-table .hw-rank { font-variant-numeric: tabular-nums; font-weight: 600; color: var(--teal); width: 56px; }
.hotword-table .hw-up { color: #C0392B; font-weight: 600; }
.hotword-table .hw-down { color: #1E7F4F; font-weight: 600; }
.hotword-table .hw-new { color: var(--blue); font-weight: 600; }
.hotword-actions { display: flex; align-items: center; gap: 10px; margin-top: 10px; flex-wrap: wrap; }
/* 本次会话的方案 tab 条（可横滑，刷新后不保留） */
.report-tabs { display: flex; gap: 8px; overflow-x: auto; padding: 4px 2px 10px;
  scrollbar-width: thin; }
.report-tab { flex: 0 0 auto; max-width: 240px; text-align: left; cursor: pointer;
  border: 1px solid var(--line); background: var(--surface, #FFF); border-radius: 10px;
  padding: 8px 12px; transition: border-color .15s; }
.report-tab:hover { border-color: var(--teal); }
.report-tab.is-active { border-color: var(--teal); background: rgba(44, 95, 85, .07); }
.report-tab b { display: block; font-size:14.5px; color: var(--text-1);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.report-tab small { font-size:13px; color: var(--text-3); }

.confidence {
  display: inline-flex;
  align-items: center;
  height: 22px;
  padding: 0 8px;
  border-radius: var(--r-sm);
  background: var(--green-tint);
  color: var(--green);
  font-size:13px;
  font-weight: 500;
}
.module-chip {
  display: inline-flex;
  align-items: center;
  height: 22px;
  padding: 0 8px;
  border-radius: var(--r-sm);
  font-size:13px;
  font-weight: 500;
}
.module-chip--purple { background: var(--purple-tint); color: var(--purple); }
.module-chip--blue { background: var(--blue-tint); color: var(--blue); }

.citations {
  background: var(--cream);
  border-radius: var(--r-md);
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.citations__lbl { font-size:13px; color: var(--text-3); font-weight: 500; }
.citations__row { display: flex; align-items: flex-start; gap: 8px; font-size:14px; color: var(--text-2); }
.citations__tag { flex: none; color: var(--blue); font-weight: 600; font-size:13px; }
/* 联网来源用琥珀色与库内知识区分：联网内容未经核实，不能与自有知识库混同 */
.citations__tag--web { color: var(--amber); }
.citations__text { flex: 1; line-height: 1.5; }
/* 实时回答卡片的引用槽位：空槽位不占位，meta 事件到达后才撑开 */
[id$="-citations"]:not(:empty) { margin-top: 10px; }

.disclaimer { display: flex; align-items: center; gap: 6px; font-size:13px; color: var(--text-3); }
.feedback { display: flex; align-items: center; gap: 8px; font-size:13px; color: var(--text-3); }

.streaming { display: flex; align-items: center; gap: 10px; }
.streaming__dot {
  width: 10px; height: 10px;
  border-radius: 50%;
  background: var(--teal);
  animation: pulse 1.6s ease-in-out infinite;
}
.stream-status { display: flex; justify-content: space-between; align-items: center; font-size:13px; color: var(--text-3); }
.stop-btn {
  height: 28px;
  padding: 0 12px;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--white);
  color: var(--text-2);
  font-size:13px;
  font-weight: 500;
}

.skel { display: flex; flex-direction: column; gap: 10px; }
.skel__bar {
  height: 12px;
  border-radius: 6px;
  background: var(--line);
  animation: pulse 1.6s ease-in-out infinite;
}
.skel__bar:nth-child(2) { width: 91%; animation-delay: .15s; }
.skel__bar:nth-child(3) { width: 60%; animation-delay: .3s; }
@keyframes pulse { 0%, 100% { opacity: .45; } 50% { opacity: 1; } }

/* 评分卡 */
.rating-row { display: flex; align-items: center; gap: 12px; }
.rating-row__name { width: 120px; flex-shrink: 0; font-size:14px; font-weight: 600; }
.rating-row__track {
  flex: 1;
  height: 6px;
  border-radius: 3px;
  background: var(--line);
  position: relative;
  overflow: hidden;
}
.rating-row__fill { position: absolute; inset: 0 auto 0 0; border-radius: 3px; }
.rating-row__score { width: 120px; flex-shrink: 0; font-size:14px; font-weight: 600; }
.rating-row__reason { flex: 1; font-size:13px; color: var(--text-3); min-width: 0; }
.rewrite-hint { font-size:14px; line-height: 1.6; color: var(--text-2); }

/* ---------- 输入区 ---------- */
/* 常驻底部：flex-shrink:0 保证它永不被上方内容压缩或推出屏幕 */
.input-area {
  background: var(--white);
  border-top: 1px solid var(--border);
  padding: 14px 40px 18px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  flex-shrink: 0;
  position: relative;
  z-index: 2;
}
.quick-chips { display: flex; gap: 8px; flex-wrap: wrap; }

.input-box {
  display: flex;
  align-items: flex-end;
  gap: 10px;
  min-height: 54px;
  border-radius: var(--r-lg);
  background: var(--cream);
  padding: 8px 8px 8px 12px;
}
/* 模型选择下拉：贴输入框最左侧，与联网开关并列 */
.model-select {
  flex: none;
  align-self: center;
  height: 30px;
  max-width: 190px;
  padding: 0 8px;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--white);
  color: var(--text-2);
  font-family: inherit;
  font-size:14px;
  cursor: pointer;
  transition: border-color 120ms ease;
}
.model-select:hover { border-color: var(--teal-soft); }
.model-select:focus { outline: none; border-color: var(--teal); }

.input-box__field {
  flex: 1;
  border: 0;
  background: transparent;
  resize: none;
  font-family: inherit;
  font-size:15px;
  color: var(--text);
  line-height: 1.5;
  padding: 6px 0;
  max-height: 120px;
}
.input-box__field::placeholder { color: var(--text-5); }
.input-box__field:focus { outline: none; }
.input-box__field.is-filled { color: var(--text); white-space: pre-wrap; }

/* 联网开关 */
.web-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 34px;
  padding: 0 10px 0 12px;
  border: 1px solid var(--border);
  border-radius: 17px;
  background: var(--white);
  color: var(--text-2);
  font-size:14px;
  flex-shrink: 0;
  transition: background 120ms ease, border-color 120ms ease, color 120ms ease;
}
.web-toggle:hover { border-color: var(--teal-soft); }
.web-toggle__switch {
  width: 28px; height: 16px;
  border-radius: 8px;
  background: var(--line);
  position: relative;
  transition: background 120ms ease;
}
.web-toggle__switch::after {
  content: '';
  position: absolute;
  left: 2px; top: 2px;
  width: 12px; height: 12px;
  border-radius: 50%;
  background: #fff;
  transition: left 120ms ease;
}
.web-toggle[aria-pressed="true"] {
  background: var(--teal-tint);
  border-color: rgba(53, 120, 107, .3);
  color: var(--teal-deep);
}
.web-toggle[aria-pressed="true"] .web-toggle__switch { background: var(--teal); }
.web-toggle[aria-pressed="true"] .web-toggle__switch::after { left: 14px; }

/* 深度分析轨迹条（2026-10-17）：回答下方折叠条，展示 Agent 工具调用序列 */
.trace-bar { margin-top: 12px; border: 1px solid var(--border); border-radius: 10px; background: var(--cream); overflow: hidden; }
.trace-bar__head { display: flex; align-items: center; gap: 8px; padding: 9px 12px; font-size: 13px; color: var(--text-2); cursor: pointer; user-select: none; }
.trace-bar__head:hover { background: var(--cream-2); }
.trace-bar__head .count { color: var(--teal-deep); font-weight: 600; }
.trace-bar__arrow { margin-left: auto; font-size: 11px; color: var(--text-4); }
.trace-bar__body { border-top: 1px solid var(--border); padding: 6px 12px; }
.trace-step { display: flex; align-items: center; gap: 10px; padding: 6px 0; border-bottom: 1px dashed var(--line); font-size: 13px; }
.trace-step:last-child { border-bottom: none; }
.trace-step .ok { color: var(--teal-deep); font-weight: 600; }
.trace-step .fail { color: var(--red); font-weight: 600; }
.trace-step .nm { color: var(--text); }
.trace-step .t { margin-left: auto; color: var(--text-4); font-size: 12px; }

/* 我的记忆（2026-10-17）：个人中心记忆列表 */
.mem-list { display: flex; flex-direction: column; gap: 10px; }
.mem-item { display: flex; align-items: center; gap: 12px; border: 1px solid var(--border); border-radius: 10px; padding: 12px 14px; }
.mem-item__k { min-width: 76px; font-size: 13px; color: var(--teal-deep); font-weight: 600; }
.mem-item__v { flex: 1; font-size: 14px; color: var(--text); }
.mem-item__conf { font-size: 12px; color: var(--text-4); }
.mem-item__del { border: none; background: none; color: var(--text-4); cursor: pointer; font-size: 14px; padding: 2px 6px; }
.mem-item__del:hover { color: var(--red); }
.mem-actions { margin-top: 14px; text-align: right; }
.btn--ghost { border: 1px solid var(--border); background: var(--white); color: var(--text-2); border-radius: 8px; padding: 7px 14px; font-size: 13px; cursor: pointer; }
.btn--ghost:hover { border-color: var(--red); color: var(--red); }

.input-cap { font-size:13px; color: var(--text-4); }
/* 快捷键提示：贴输入框右下角，弱化但仍可辨识 */
.input-kbd { margin: -4px 0 0; font-size:13px; color: var(--text-4); text-align: right; }
.input-kbd kbd {
  display: inline-block; margin: 0 2px; padding: 1px 5px;
  border: 1px solid var(--border); border-radius: 4px;
  background: var(--tint, #F1EFE9); font-family: inherit;
  font-size:12px; color: var(--text-3);
}

/* Listing 输入模板卡 */
.tpl-card {
  background: var(--teal-tint);
  border: 1px solid rgba(53, 120, 107, .25);
  border-radius: var(--r-lg);
  padding: 16px 18px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.tpl-card__head { display: flex; align-items: center; gap: 8px; font-size:15px; color: var(--teal-deep); }
.tpl-card__head b { font-weight: 600; }
.tpl-card__spacer { flex: 1; }
.tpl-card__toggle {
  border: 0;
  background: transparent;
  color: var(--teal-soft);
  font-size:13px;
  font-weight: 500;
  padding: 2px 4px;
}
.tpl-field { display: flex; gap: 10px; align-items: center; font-size:14px; }
.tpl-field b { width: 130px; flex-shrink: 0; color: var(--text); font-weight: 600; }
.tpl-field span { color: var(--text-2); flex: 1; }
.tpl-card__actions { display: flex; gap: 10px; }

/* ---------- 工作台 ---------- */
.page {
  padding: 28px 40px 32px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  max-width: 1180px;
  width: 100%;
  margin: 0 auto;
}
.greet { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; }
.greet__title { font-size:26px; font-weight: 600; }
.greet__sub { margin-top: 6px; font-size:15px; color: var(--text-3); }
.cal-note b { color: var(--text-2); font-weight: 600; }
.section-title { font-size:16px; font-weight: 600; margin-bottom: 4px; }

/* 已购额度总览（2026-10-22）：通用额度大号展示，与「每日额度」区分 */
.credit-hero { display: flex; align-items: center; gap: 24px; padding: 20px 24px;
  background: linear-gradient(135deg, #EAF4F0, #F8FBF9); border: 1px solid var(--teal-soft);
  border-radius: var(--r-lg); margin-bottom: 18px; flex-wrap: wrap; }
.credit-hero__main { flex: 1 1 320px; display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.credit-hero__lbl { font-size: 13px; font-weight: 600; color: var(--teal-deep); letter-spacing: .04em; }
.credit-hero__num { font-size: 42px; font-weight: 750; color: var(--teal-deep); line-height: 1; }
.credit-hero__num--sm { font-size: 26px; }
.credit-hero__unit { font-size: 13px; color: var(--text-3); }
.credit-hero__hint { flex-basis: 100%; font-size: 12px; color: var(--text-3); margin-top: 6px; }
.credit-hero__side { display: flex; align-items: baseline; gap: 6px;
  padding-left: 20px; border-left: 1px solid var(--teal-soft); }
.credit-hero__buy { flex: none; }
/* 用户菜单已购额度行：数字用品牌色强调 */
.user-menu__row--credit b { color: var(--teal-deep); }

.quota-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.quota-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.quota-card__lbl { font-size:14px; color: var(--text-3); }
.quota-card__vals { display: flex; align-items: baseline; gap: 4px; }
.quota-card__used { font-size:24px; font-weight: 600; }
/* 2026-10-22：数字口径改为「剩余/总量」，剩余为 0 时标红提示已用尽 */
.quota-card__used.is-empty { color: #B3261E; }
.user-menu__row b.is-empty { color: #B3261E; }
.quota-card__sep { font-size:16px; color: var(--text-5); }
.quota-card__total { font-size:24px; color: var(--text-5); }
.quota-card__track { height: 6px; border-radius: 3px; background: var(--line); position: relative; overflow: hidden; }
.quota-card__fill { position: absolute; inset: 0 auto 0 0; background: var(--teal); border-radius: 3px; }
.quota-card__note { font-size:13px; color: var(--text-4); }

.two-col { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 20px; }
.guide-list { display: flex; flex-direction: column; gap: 16px; }
.guide {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 18px 20px;
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  cursor: pointer;
  text-decoration: none;
  color: inherit;
  transition: border-color 120ms ease;
}
.guide:hover { border-color: var(--teal-soft); }
.guide__ico {
  width: 40px; height: 40px;
  border-radius: var(--r-lg);
  display: grid;
  place-items: center;
  font-size:20px;
  flex-shrink: 0;
}
.guide__ico--teal { background: var(--teal-tint); color: var(--teal); }
.guide__ico--purple { background: var(--purple-tint); color: var(--purple); }
.guide__ico--blue { background: var(--blue-tint); color: var(--blue); }
.guide__col { flex: 1; min-width: 0; }
.guide__col b { display: block; font-size:16px; }
.guide__col span { font-size:14px; color: var(--text-3); }
.guide__arrow { color: var(--text-5); }

.sub-card {
  background: var(--teal-tint);
  border: 1px solid rgba(53, 120, 107, .2);
  border-radius: var(--r-lg);
  padding: 22px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  align-self: start;
}
.sub-card__tag { font-size:13px; font-weight: 500; color: var(--teal-deep); }
.sub-card h3 { font-size:17px; font-weight: 600; }
.sub-card > p { font-size:14px; color: var(--teal-deep); }
.sub-card__list { display: flex; flex-direction: column; gap: 8px; }
.sub-card__list li {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size:14px;
  color: var(--teal-deep);
}
.sub-card__list li::before { content: '✓'; color: var(--teal); font-weight: 700; }
.sub-card__price { font-size:24px; font-weight: 600; }
.sub-card__price small { font-size:15px; font-weight: 400; color: var(--text-3); }
.sub-card__btn { width: 100%; }

/* ---------- 报表上传 ---------- */
.upload-page {
  padding: 32px max(24px, calc((100% - 880px) / 2));
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.steps {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}
.step { display: flex; align-items: center; gap: 8px; }
.step__dot { width: 10px; height: 10px; border-radius: 50%; background: var(--line); }
.step.is-active .step__dot { background: var(--teal); }
.step__lbl { font-size:14px; color: var(--text-3); }
.step.is-active .step__lbl { color: var(--teal-deep); font-weight: 600; }
.steps__line { width: 48px; height: 1px; background: var(--line); }

.dropzone {
  background: var(--white);
  border: 1.5px dashed var(--text-5);
  border-radius: var(--r-xl);
  padding: 32px 40px 28px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  text-align: center;
  cursor: pointer;
  transition: border-color 120ms ease;
}
.dropzone:hover, .dropzone:focus-visible { border-color: var(--teal); }
.dropzone__ico {
  width: 56px; height: 56px;
  border-radius: var(--r-xl);
  background: var(--teal-tint);
  color: var(--teal);
  display: grid;
  place-items: center;
  font-size:30px;
}
.dropzone__title { font-size:18px; font-weight: 600; }
.dropzone__desc { font-size:15px; color: var(--text-3); }
.dropzone__tip { font-size:14px; color: var(--text-4); }
.download-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 38px;
  padding: 0 16px;
  border: 1px solid var(--text-5);
  border-radius: 9px;
  background: var(--white);
  color: var(--teal);
  font-size:14px;
  font-weight: 500;
}
.download-btn:hover { border-color: var(--teal); background: var(--cream); }

.types-label { font-size:14px; color: var(--text-3); font-weight: 500; }
.types { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 10px; }
.type-chip {
  height: 30px;
  padding: 0 12px;
  border-radius: 15px;
  background: var(--cream-2);
  color: var(--text-2);
  font-size:14px;
  display: inline-flex;
  align-items: center;
  cursor: pointer;
}

.file-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  padding: 18px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
}
.file-card__main { display: flex; align-items: center; gap: 14px; flex: 1; min-width: 0; }
.file-ico {
  width: 44px; height: 44px;
  border-radius: var(--r-lg);
  background: var(--blue-tint);
  color: var(--blue);
  display: grid;
  place-items: center;
  font-size:22px;
  flex-shrink: 0;
}
.file-card__main b { display: block; font-size:16px; }
.file-card__main span { font-size:14px; color: var(--text-3); }
.file-card__ops { display: flex; flex-direction: column; gap: 6px; align-items: flex-end; }

.agg-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  padding: 18px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.agg-card__head { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.agg-card__head b { font-size:15px; font-weight: 600; }
.pill {
  height: 24px;
  padding: 0 10px;
  border-radius: var(--r-sm);
  background: var(--teal-tint);
  color: var(--teal-deep);
  font-size:13px;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
}
.agg-stats { display: flex; gap: 24px; flex-wrap: wrap; }
.agg-stats div { display: flex; flex-direction: column; gap: 4px; }
.agg-stats dt { font-size:13px; color: var(--text-4); }
.agg-stats dd { font-size:20px; font-weight: 600; }

.safe-row {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  padding: 14px;
  display: flex;
  align-items: center;
  gap: 12px;
}
.safe-ico {
  width: 18px; height: 18px;
  border-radius: 4px;
  background: var(--cream-2);
  display: grid;
  place-items: center;
  font-size:12px;
  flex-shrink: 0;
}
.safe-row__text { flex: 1; font-size:14px; color: var(--text-2); }
.switch {
  width: 40px; height: 22px;
  border: 0;
  border-radius: 11px;
  background: var(--teal);
  position: relative;
  flex-shrink: 0;
  transition: background 120ms ease;
}
.switch::after {
  content: '';
  position: absolute;
  right: 3px; top: 3px;
  width: 16px; height: 16px;
  border-radius: 50%;
  background: #fff;
  transition: right 120ms ease;
}
.switch[aria-checked="false"] { background: var(--line); }
.switch[aria-checked="false"]::after { right: calc(100% - 19px); }

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

/* ---------- 方案报告 ---------- */
.report {
  padding: 32px max(24px, calc((100% - 1100px) / 2)) 48px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.report-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--r-xl);
  padding: 28px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  font-size:17px;          /* 2026-09-19：整卡基准字号上调（此前 12–14px 阅读很累） */
  line-height: 1.75;
}
.report-card--intel { border-color: rgba(44, 95, 85, .35); }
.report-card__head { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.report-card__head h3 { font-size:20px; font-weight: 700; }
.report-card__meta { font-size:14.5px; color: var(--text-3); }

/* 竞品词情报卡片（联网逐词深查产出） */
.intel-card { background: var(--cream, #FAF9F6); border-radius: var(--r-lg);
  padding: 16px 18px; display: flex; flex-direction: column; gap: 8px; }
.intel-card__head b { font-size:17px; color: var(--teal-deep); }
.intel-card__row { margin: 0; font-size:16.5px; line-height: 1.7; }
.intel-card__lbl { display: inline-block; min-width: 132px; font-weight: 700;
  color: var(--teal); margin-right: 8px; }

.summary-grid { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 16px; }
.summary-grid__text { font-size:17px; line-height: 1.8; margin: 0; }
.summary-stats {
  background: var(--cream);
  border-radius: var(--r-lg);
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.summary-stats__row { display: flex; justify-content: space-between; align-items: baseline; }
.summary-stats__lbl { font-size:15px; color: var(--text-3); }
.summary-stats__val { font-size:20px; font-weight: 600; }
.val--good { color: var(--green); }
.val--bad { color: var(--red); }
.val--neutral { color: var(--teal-deep); }

/* 分步执行卡（纵向，替代旧的行内 chip——旧版把整句阶段名拼进类名导致内容叠加） */
.stages { display: flex; flex-direction: column; gap: 12px; }
.stage-card { border-radius: var(--r-lg); padding: 14px 18px; }
.stage-card__no { display: inline-block; font-size:14px; font-weight: 700;
  padding: 2px 10px; border-radius: 999px; margin-bottom: 6px; }
.stage-card__text { margin: 0; font-size:16.5px; line-height: 1.8; }
.stage-card--s1 { background: var(--amber-tint, #FDF3E2); }
.stage-card--s1 .stage-card__no { background: var(--amber, #C77D1E); color: #fff; }
.stage-card--s2 { background: var(--cream-2, #F4F1EA); }
.stage-card--s2 .stage-card__no { background: var(--text-2); color: #fff; }
.stage-card--s3 { background: var(--green-tint, #E9F4EE); }
.stage-card--s3 .stage-card__no { background: var(--green, #2E8B5F); color: #fff; }

.camp-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.camp {
  background: var(--cream);
  border-radius: var(--r-lg);
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.camp__top { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.camp__top b { font-size:16.5px; font-weight: 600; }
.camp__tag {
  height: 22px;
  padding: 0 8px;
  border-radius: var(--r-sm);
  display: inline-flex;
  align-items: center;
  font-size:13px;
  font-weight: 500;
  white-space: nowrap;
}
.camp__tag--down { background: var(--teal-tint); color: var(--teal-deep); }
.camp__tag--up { background: var(--green-tint); color: var(--green); }
.camp__tag--flat { background: var(--cream-2); color: var(--text-2); }
.camp__meta { font-size:15.5px; color: var(--text-2); margin: 0; }
.camp__cite { font-size:14px; color: var(--blue); font-weight: 500; margin: 0; }

.bid-table { display: flex; flex-direction: column; gap: 6px; }
.bid-row { display: flex; align-items: flex-start; gap: 14px; padding: 12px 14px; border-radius: var(--r-md); }
.bid-row:nth-child(odd) { background: var(--cream); }
.bid-row__kw { width: 210px; font-size:16.5px; font-weight: 600; flex-shrink: 0; }
.bid-row__tp { width: 70px; font-size:15px; color: var(--text-2); flex-shrink: 0; }
.bid-row__bid { width: 150px; font-size:16.5px; font-weight: 600; color: var(--teal); flex-shrink: 0; }
.bid-row__anchor { flex: 1; font-size:15px; color: var(--text-2); min-width: 0; }

.dual { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.list-card { border-radius: var(--r-xl); padding: 22px; }
.list-card--neg { background: var(--red-tint); border: 1px solid rgba(192, 82, 61, .2); }
.list-card--harv { background: var(--green-tint); border: 1px solid rgba(46, 139, 95, .25); }
.list-card h4 { margin: 0 0 10px; font-size:16.5px; font-weight: 700; }
.list-card--neg h4 { color: var(--red); }
.list-card--harv h4 { color: var(--green); }
.list-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
  background: #fff;
  border-radius: var(--r-md);
  padding: 12px 14px;
  margin-bottom: 8px;
  font-size:15.5px;
  line-height: 1.65;
  color: var(--text-2);
}
.list-row b { color: var(--text); font-weight: 600; flex: 1; min-width: 0; }
.list-row__metric { width: 130px; text-align: center; font-size:14.5px; flex-shrink: 0; }
.list-card--neg .list-row__metric { color: var(--red); }
.list-card--harv .list-row__metric { color: var(--green); }
.list-row__act { width: 170px; text-align: left; font-size:15px; font-weight: 500; flex-shrink: 1.2; }
.list-card--neg .list-row__act { color: var(--red); }
.list-card--harv .list-row__act { color: var(--green); }
.list-more {
  justify-content: center;
  color: var(--text-3);
  font-size:13px;
  cursor: pointer;
}

.banner {
  background: var(--amber-bg);
  border: 1px solid rgba(169, 117, 20, .2);
  border-radius: var(--r-lg);
  padding: 14px 18px;
  display: flex;
  align-items: center;
  gap: 10px;
  font-size:14px;
  color: var(--amber);
}
.report-actions { display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; }

/* ---------- Toast ---------- */
.toast {
  position: fixed;
  bottom: 28px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--text);
  color: #fff;
  padding: 10px 16px;
  border-radius: var(--r-md);
  font-size:14px;
  opacity: 0;
  transition: opacity 200ms ease;
  pointer-events: none;
  box-shadow: var(--shadow-lg);
  z-index: 60;
  max-width: min(90vw, 560px);
}
.toast.is-show { opacity: 1; }
.toast__dot {
  display: inline-block;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--teal-soft);
  margin-right: 8px;
  vertical-align: middle;
}

/* ---------- 广告方案 v2 · 快速建议表单 ---------- */
.mode-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--r-xl);
  padding: 28px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.mode-card__head { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.mode-card__head h3 { margin: 0; font-size:19px; font-weight: 600; color: var(--text); }
.mode-card__head .spacer { flex: 1; }
.mode-card__desc { margin: 0; font-size:15px; color: var(--text-2); }
.mode-card__note { margin: 0; font-size:13px; color: var(--text-4); }
.recent-reports { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.recent-reports label { font-size:14px; color: var(--text-3); }
.recent-reports select { flex: 1 1 220px; min-width: 0; max-width: 100%; }
.report-session-note { margin: 16px 24px 8px; font-size:13px; color: var(--text-3); }
/* 第 2 步 · 经营目标：上传成功后才出现，承载「目标 ACOS」并触发方案生成 */
.plan-goal { margin-top: 4px; padding-top: 14px; border-top: 1px dashed var(--border); }
.plan-goal__row { display: flex; gap: 10px; align-items: flex-end; flex-wrap: wrap; }
.plan-goal__row .btn { flex-shrink: 0; }
.plan-goal__hint { margin: 8px 0 0; font-size:13px; color: var(--text-4); line-height: 1.6; }
.mode-tag {
  height: 26px;
  padding: 0 12px;
  border-radius: 13px;
  display: inline-flex;
  align-items: center;
  font-size:14px;
  font-weight: 500;
  color: #fff;
  flex-shrink: 0;
}
.mode-tag--teal { background: var(--teal); }
.mode-tag--amber { background: var(--amber); }

.form-block {
  background: var(--cream);
  border-radius: var(--r-lg);
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.form-block--row { flex-direction: row; align-items: center; gap: 16px; }
.form-block__head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.form-block__head b { font-size:16px; font-weight: 600; color: var(--text); }
.form-block__head span { font-size:13px; color: var(--text-4); }

.form-row3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.field__lbl { font-size:14px; color: var(--text-3); }
.field__input {
  height: 44px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--white);
  padding: 0 14px;
  font-family: inherit;
  font-size:15px;
  font-weight: 500;
  color: var(--text);
}
.field__input:focus { outline: none; border-color: var(--teal-soft); }

.calc-result {
  display: flex;
  align-items: center;
  gap: 10px;
  background: var(--teal-tint);
  border-radius: 10px;
  padding: 14px 16px;
  color: var(--teal-deep);
  flex-wrap: wrap;
}
.calc-result b { font-size:16px; font-weight: 600; }
.calc-result__formula { margin-left: auto; font-size:14px; }

.seg { display: flex; gap: 6px; height: 44px; align-items: center; }
.seg__opt {
  height: 34px;
  padding: 0 14px;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--white);
  color: var(--text-2);
  font-size:14px;
}
.seg__opt.is-active { background: var(--teal); border-color: var(--teal); color: #fff; font-weight: 500; }

.paste-box {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.paste-box__field {
  border: 0;
  background: transparent;
  resize: vertical;
  min-height: 96px;
  font-family: inherit;
  font-size:14px;
  line-height: 1.6;
  color: var(--text-2);
}
.paste-box__field:focus { outline: none; }
.paste-box__status { margin: 0; font-size:13px; font-weight: 500; color: var(--green); }
.fmt-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.fmt-row__lbl { font-size:13px; color: var(--text-4); }

.web-col { display: flex; flex-direction: column; gap: 6px; align-items: center; flex-shrink: 0; }
.web-fetch-btn { border: 1px solid rgba(53, 120, 107, .4); color: var(--teal); }
.web-fetch-btn.is-loading { opacity: .6; pointer-events: none; }
.web-col__quota { font-size:13px; color: var(--text-3); }
/* 查询结果 / 状态栏：独占一行、可折行。
   原来是 inline-flex + white-space:nowrap，长结果（商品名 + 价格 + 竞品 + 置信度）
   会把所在行撑宽，把左侧输入框挤成竖排。这里改为可折行的块级行。
   2026-09-22 完成态根因修复：display:flex 无 wrap 时，完成态的三个子项
   （摘要 span / 出处胶囊 / 整组 .mkt-cards）被压成横向三列——卡片组被
   挤到侧边成窄条。加载/降级态仍是单 span 不受影响；完成态由
   「.market-status 纵向列 + .mkt-summary 摘要行 + .mkt-cards 卡片行」
   三段纵向堆叠承接（规则见 .ai-attrib 注释块下方）。 */
.market-status {
  margin: 0;
  display: flex;
  align-items: flex-start;
  gap: 6px;
  font-size:13px;
  font-weight: 500;
  color: var(--green);
  background: var(--green-tint);
  border-radius: var(--r-sm);
  padding: 8px 12px;
  text-align: left;
  line-height: 1.7;
  white-space: normal;
  overflow-wrap: anywhere;
  min-width: 0;
}
.market-status::before { content: '✓'; font-weight: 700; flex-shrink: 0; }
.market-status.is-loading { color: var(--text-3); background: var(--cream-2); }
.market-status.is-loading::before { content: '⌛'; }
/* 有情报卡片时隐藏绿勾（摘要行 + 卡片混合布局，勾只对首行有意义） */
.market-status:has(.mkt-cards)::before { display: none; }
.market-status:has(.mkt-cards) { background: transparent; padding: 8px 4px; }
/* 完成态纵向堆叠：摘要行与卡片组各占整行，不再横向挤压 */
.market-status:has(.mkt-summary) { flex-direction: column; gap: 0; }
/* 市场情报卡片（2026-09-19 运营视角扩展：价格分档/TOP5/卖点/痛点） */
/* ── 联网查市场（2026-10-21）：结果折叠 + 下载 + 7 天历史 ── */
.mkt-tools { display: flex; justify-content: flex-end; margin: 0 0 6px; width: 100%; }
.mkt-tools .btn { height: 32px; padding: 0 14px; font-size: 12.5px; }
.mkt-fold { width: 100%; margin-top: 2px; }
.mkt-fold__sum { cursor: pointer; font-size: 13px; font-weight: 600; color: var(--teal-deep);
  padding: 6px 0; user-select: none; }
.mkt-fold__sum:hover { text-decoration: underline; text-underline-offset: 3px; }
.mkt-fold > .mkt-cards { margin-top: 6px; }
/* 折叠块在结果容器里：隐藏绿勾、去掉绿色底，交给内部卡片承载视觉 */
.market-status:has(.mkt-fold)::before { display: none; }
.market-status:has(.mkt-fold) { background: transparent; padding: 8px 4px; flex-direction: column; gap: 0; }

/* 历史列表 */
.mkt-hist { display: flex; flex-direction: column; gap: 8px; }
.mkt-hist__item { display: flex; align-items: center; gap: 12px; padding: 10px 12px;
  border: 1px solid var(--line); border-radius: var(--r-md); background: #fff; flex-wrap: wrap; }
.mkt-hist__main { flex: 1 1 220px; min-width: 0; }
.mkt-hist__main b { display: block; font-size: 13.5px; color: var(--text); }
.mkt-hist__main span { display: block; font-size: 12px; color: var(--text-3); margin-top: 2px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mkt-hist__meta { display: flex; gap: 10px; font-size: 12px; color: var(--text-3); flex: none; }
.mkt-hist__exp { color: var(--amber); font-weight: 600; }
.mkt-hist__act { display: flex; gap: 6px; flex: none; }
.mkt-hist__act .btn { height: 32px; padding: 0 12px; font-size: 12.5px; }

.mkt-cards { display: flex; flex-direction: column; gap: 12px; margin-top: 10px;
  width: 100%; text-align: left; }
.mkt-block { background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg);
  padding: 12px 14px; }
.mkt-block__t { display: block; font-size:15px; font-weight: 700; margin-bottom: 8px;
  color: var(--teal-deep); }
.mkt-block__t--warn { color: var(--red); }
.mkt-row { display: flex; gap: 10px; padding: 5px 0; font-size:15px;
  border-bottom: 1px dashed var(--line); align-items: baseline; }
.mkt-row:last-child { border-bottom: none; }
.mkt-row__k { width: 84px; font-weight: 600; flex-shrink: 0; }
.mkt-row__p { width: 110px; font-weight: 700; color: var(--teal); flex-shrink: 0; }
.mkt-row__n { color: var(--text-2); min-width: 0; }
.mkt-seller { padding: 8px 0; border-bottom: 1px dashed var(--line); }
.mkt-seller:last-child { border-bottom: none; }
.mkt-seller__head { display: flex; justify-content: space-between; gap: 10px;
  font-size:15.5px; font-weight: 600; }
.mkt-seller__price { color: var(--teal); white-space: nowrap; }
.mkt-seller__meta { font-size:14px; color: var(--text-3); margin-top: 3px; }
.mkt-seller__pts { font-size:14.5px; color: var(--text-2); margin-top: 4px; }
.mkt-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.mkt-chip { background: var(--green-tint, #E9F4EE); color: var(--green, #2E8B5F);
  font-size:14px; padding: 3px 10px; border-radius: 999px; }
.mkt-list { margin: 0; padding-left: 18px; font-size:15px; color: var(--text-2); }
.mkt-list li { margin-bottom: 4px; }
.mkt-kv { font-size:15px; padding: 5px 0; border-bottom: 1px dashed var(--line); }
.mkt-kv:last-child { border-bottom: none; }
.mkt-kv span { display: inline-block; min-width: 110px; font-weight: 600;
  color: var(--text-2); margin-right: 8px; }
.mkt-cite { font-size:14px; color: var(--blue); padding: 3px 0; }
.mkt-playbook { margin: 0; font-size:15.5px; line-height: 1.8; color: var(--text-2); }

/* ── AI 出处标注（2026-09-22 四版）：行内流式胶囊。
   实测教训：不能用 inline-flex + flex-wrap——flex 容器在窄空间里会把
   每个子项各自挤成一行（逐项竖排），独立的「·」分隔符 item 换行时
   还会掉到行首独占一行。改为 display:block + 子项 inline + 正常换行，
   换行行为与普通文本一致：窄了按词折行，绝不竖排、不挤压兄弟元素。
   分隔符 · 由 ::after 挂在每个 bit 尾部，随段走。── */
.ai-attrib {
  display: block;
  font-size:13px;
  line-height: 1.6;
  color: var(--text-3);
  background: var(--cream-2);
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: 1px 10px;
  margin: 0;
  vertical-align: middle;
  white-space: normal;
  overflow-wrap: anywhere;
  max-width: 100%;
  width: fit-content;
}
.ai-attrib .ai-attrib__bit { display: inline; white-space: nowrap; }
.ai-attrib .ai-attrib__bit:not(:last-child)::after {
  content: '·';
  margin: 0 6px;
  color: var(--text-5);
  font-weight: 400;
}
.ai-attrib b { color: var(--text-2); font-weight: 600; }
.ai-attrib i { font-style: normal; margin: 0 6px; color: var(--text-5); }
/* 行内场景（market 摘要行 / quick 头部行）：与前后文字同行排布 */
.mkt-summary .ai-attrib, .mode-card__head .ai-attrib, .report-card__head .ai-attrib {
  display: inline-block;
  margin-left: 6px;
}
/* 聊天卡内是纵向 flex：靠左、与正文留一线间距即可 */
.ai-card .ai-attrib { margin-top: 6px; }
/* 联网查市场完成态（补充说明，规则主体在上方 .market-status 主定义）：
   .mkt-summary 摘要行 + .mkt-cards 卡片组各占整行。 */
.mkt-summary { display: block; line-height: 1.8; }
.mkt-summary .ai-attrib { margin-left: 4px; }
/* 降级 / 失败态：原来没有独立颜色，失败也会显示绿勾 */
.market-status.is-warn { color: var(--amber); background: var(--amber-bg); }
.market-status.is-warn::before { content: '⚠'; }
/* 结果里的字段对：标签重、值常规，用 · 分隔且允许换行 */
.market-status b { font-weight: 600; }
.market-status i { font-style: normal; color: var(--text-5); padding: 0 6px; }

.cta-row { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.cta-row__btn { height: 48px; padding: 0 28px; font-size:16px; }
.cta-row__note { font-size:14px; color: var(--text-3); }
.muted { color: var(--text-5); }

.result-card { border: 1.5px solid rgba(53, 120, 107, .3); }
.health-row {
  background: var(--amber-bg);
  border-radius: 10px;
  padding: 12px 16px;
  font-size:15px;
  font-weight: 500;
  color: var(--amber);
}
.tri-row {
  display: flex;
  align-items: center;
  gap: 10px;
  border-radius: var(--r-md);
  padding: 10px 14px;
  font-size:15px;
}
.tri-row b { flex: 1; min-width: 0; font-weight: 600; }
.tri-row__metric { width: 160px; font-size:13px; flex-shrink: 0; }
.tri-row__act { width: 120px; text-align: right; font-size:13px; font-weight: 500; flex-shrink: 0; }
.tri-row--neg { background: var(--red-tint); color: var(--text); }
.tri-row--neg .tri-row__metric, .tri-row--neg .tri-row__act { color: var(--red); }
.tri-row--watch { background: var(--amber-tint); }
.tri-row--watch .tri-row__metric, .tri-row--watch .tri-row__act { color: var(--amber); }
.tri-row--harv { background: var(--green-tint); }
.tri-row--harv .tri-row__metric, .tri-row--harv .tri-row__act { color: var(--green); }
/* 推荐广告词 + 投流打法（2026-09-20）：快速建议的两栏增量输出 */
.rec-block { border: 1px solid var(--line); border-radius: var(--r-lg); padding: 14px 16px; }
.rec-block--playbook { background: var(--teal-tint); border-color: rgba(44, 95, 85, .25); }
.rec-block__head { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap;
  margin-bottom: 10px; }
.rec-block__head h4 { margin: 0; font-size:16px; font-weight: 700; }
.rec-row { display: flex; align-items: center; gap: 10px; padding: 8px 0;
  border-bottom: 1px dashed var(--line); font-size:15px; }
.rec-row:last-child { border-bottom: none; }
.rec-row__kw { flex: 1.2; min-width: 0; font-weight: 600; word-break: break-all; }
.rec-row__match { width: 52px; text-align: center; font-size:13.5px; font-weight: 600;
  padding: 2px 0; border-radius: 6px; background: var(--teal-tint); color: var(--teal-deep);
  flex-shrink: 0; }
.rec-row__src { width: 68px; text-align: center; font-size:13px; color: var(--text-3);
  flex-shrink: 0; }
.rec-row__why { flex: 1.6; min-width: 0; color: var(--text-2); }
.playbook-text { margin: 0; font-size:15.5px; line-height: 1.8; }
.up-row {
  background: var(--teal-tint);
  border-radius: 10px;
  padding: 12px 16px;
  font-size:14px;
  font-weight: 500;
  color: var(--teal-deep);
}

.compact-drop {
  background: var(--cream);
  border: 1.5px dashed var(--text-5);
  border-radius: var(--r-lg);
  padding: 18px 20px;
  display: flex;
  align-items: center;
  gap: 16px;
  cursor: pointer;
  transition: border-color 120ms ease;
}
.compact-drop:hover, .compact-drop:focus-visible { border-color: var(--teal); }
.compact-drop__ico {
  width: 44px; height: 44px;
  border-radius: var(--r-lg);
  background: var(--teal-tint);
  color: var(--teal);
  display: grid;
  place-items: center;
  font-size:22px;
  flex-shrink: 0;
}
.compact-drop__text { flex: 1; min-width: 0; }
.compact-drop__text b { display: block; font-size:15px; font-weight: 600; color: var(--text); }
.compact-drop__text span { font-size:13px; color: var(--text-3); }

/* ---------- 旺季日历 ---------- */

.cal-switch {
  display: flex;
  align-items: center;
  gap: 16px;
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 16px 20px;
}
.cal-arrow {
  width: 40px; height: 40px;
  border-radius: 50%;
  border: none;
  background: var(--cream);
  color: var(--text-2);
  display: grid; place-items: center;
  cursor: pointer;
  flex-shrink: 0;
  transition: background .15s, color .15s;
}
.cal-arrow:hover { background: var(--teal-tint); color: var(--teal-deep); }
.cal-arrow--next { background: var(--teal); color: #fff; }
.cal-arrow--next:hover { background: var(--teal-deep); color: #fff; }
.cal-switch__center { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; }
.cal-switch__row { display: flex; align-items: baseline; gap: 8px; justify-content: center; flex-wrap: wrap; }
.cal-switch__row b { font-size:22px; }
.cal-switch__row span { font-size:14px; color: var(--text-3); }
.cal-dots { display: flex; gap: 6px; }
.cal-dot {
  width: 8px; height: 8px;
  border-radius: 4px;
  border: none; padding: 0;
  background: var(--border);
  cursor: pointer;
  transition: background .15s, width .15s;
}
.cal-dot:hover { background: var(--teal-soft); }
.cal-dot.is-active { background: var(--teal); width: 20px; }

.hint-row {
  display: flex; gap: 8px; align-items: flex-start;
  background: var(--amber-bg);
  border-radius: 10px;
  padding: 12px 16px;
  font-size:14px; font-weight: 500; color: var(--amber);
  line-height: 1.7;
}

.cal-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.cal-month {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  padding: 14px;
  display: flex; flex-direction: column; gap: 8px;
}
.cal-month.is-current { border: 1.5px solid rgba(53, 120, 107, .45); }
.cal-month__head { display: flex; align-items: center; justify-content: space-between; }
.cal-month__name { font-size:15px; font-weight: 600; }
.cal-month.is-current .cal-month__name { color: var(--teal-deep); }
.cal-now-tag { font-size:11px; font-weight: 500; background: var(--teal-tint); color: var(--teal-deep); padding: 2px 8px; border-radius: 10px; }
.cal-evt {
  font-size:12px;
  padding: 5px 8px;
  border-radius: var(--r-sm);
  background: var(--cream);
  color: var(--text-2);
  text-align: left;
}
.cal-evt--promo { background: var(--teal-tint); color: var(--teal-deep); font-weight: 500; }
.cal-evt--prep { background: var(--amber-tint); color: var(--amber); font-weight: 500; }

.cal-note { display: flex; gap: 8px; align-items: flex-start; font-size:13px; color: var(--text-3); line-height: 1.7; }

/* ---------- 知识来源库（侧边栏迷你区 + 独立视图） ---------- */
.sidebar__kb { margin-top: 14px; padding: 0 12px; }
.kb-count { font-size:13px; color: var(--text-3); font-weight: 400; }
.kb-mini { list-style: none; margin: 6px 0 0; padding: 0; display: grid; gap: 6px; }
.kb-mini li { display: flex; align-items: center; gap: 7px; font-size:14px; color: var(--text-2); min-width: 0; }
.kb-mini__title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.src-dot { width: 7px; height: 7px; border-radius: 50%; flex: none; }
.src-dot--official { background: var(--teal); }
.src-dot--exp { background: var(--amber); }
.src-dot--third { background: var(--text-3); }
.kb-more { display: inline-block; margin-top: 8px; font-size:14px; color: var(--teal); text-decoration: none; }
.kb-more:hover { text-decoration: underline; }

/* 官方交流群入口（2026-10-07）
   刻意放在侧栏「资源区」、与知识来源库并列 —— 这一区本来就是站内资源，
   放这里它读起来是资源而不是广告位。这是它「不像广告」的全部原因，换位置前先想清楚。
   淡青底是刻意的：没有底色它会被当成普通链接直接忽略掉。 */
.sidebar__group {
  display: flex; align-items: center; gap: 8px;
  margin: 2px 12px 10px; padding: 8px 10px;
  border-radius: 8px;
  font-size: 12.5px; color: var(--teal-deep);
  background: var(--teal-tint);
  text-decoration: none;
  transition: background .15s ease, color .15s ease;
}
.sidebar__group:hover { background: var(--teal-soft); color: #fff; }
.sidebar__group .ico { width: 14px; height: 14px; flex: none; }
.sidebar__group-tag { margin-left: auto; font-size: 10.5px; opacity: .6; }

/* 群弹层里的欢迎语 */
.group-welcome { text-align: center; padding: 2px 0 4px; }
.group-welcome__hi { font-size: 14px; font-weight: 600; color: var(--text); line-height: 1.5; margin: 0 0 5px; }
.group-welcome__sub { font-size: 11.5px; color: var(--text-4); margin: 0; }

/* ---------- 登录/注册的同意勾选框（2026-10-07） ---------- */
/* 未勾选时提交按钮置灰（按钮上带 disabled 属性，这里是它的视觉）。
   勾选框文案本身已解释了为什么不能点，不再额外弹提示。 */
.auth-submit:disabled { opacity: .45; cursor: not-allowed; }
.auth-consent {
  display: flex; align-items: flex-start; gap: 8px;
  margin: 2px 0 14px; font-size: 12.5px; line-height: 1.65; color: var(--text-3);
}
.auth-consent input[type="checkbox"] {
  flex: none; width: 15px; height: 15px; margin: 2px 0 0;
  accent-color: var(--teal);   /* 用站点主色，不用浏览器默认蓝 */
  cursor: pointer;
}
.auth-consent label { cursor: pointer; }
.auth-consent a { color: var(--teal); text-decoration: none; }
.auth-consent a:hover { text-decoration: underline; }

/* ---------- 全站页脚（2026-10-07） ---------- */
/* 放在滚动容器 .body 的末尾（所有 .view 之后）。
   刻意做得很轻：一条细线 + 一行小字。法务链接需要的是「可达」，不是「显眼」——
   做重了它就会跟工作台的内容抢注意力。 */
.site-foot {
  margin-top: 26px; padding: 18px 34px 22px;
  border-top: 1px solid var(--line);
  display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
  font-size: 12px; color: var(--text-5);
}
.site-foot__links { margin-left: auto; display: flex; gap: 14px; }
.site-foot__links a { color: var(--text-4); text-decoration: none; }
.site-foot__links a:hover { color: var(--teal); text-decoration: underline; }
@media (max-width: 640px) {
  .site-foot { padding: 16px 20px 20px; }
  .site-foot__links { margin-left: 0; }
}

.src-filters { display: grid; gap: 8px; margin-bottom: 14px; }
.src-filter-row { display: flex; flex-wrap: wrap; gap: 8px; }
.src-tab { border: 1px solid var(--line, #E3DFD5); background: #fff; border-radius: 15px; padding: 5px 13px; font-size:14px; color: var(--text-2); cursor: pointer; }
.src-tab.is-active { background: var(--teal); border-color: var(--teal); color: #fff; font-weight: 600; }
.src-chip { border: 1px solid var(--line, #E3DFD5); background: #fff; border-radius: 6px; padding: 4px 10px; font-size:14px; color: var(--text-2); cursor: pointer; }
.src-chip.is-active { border-color: var(--teal); color: var(--teal); background: var(--teal-tint, #EAF4F1); font-weight: 600; }
.src-list { display: grid; gap: 10px; }
.src-card { border: 1px solid var(--line, #E3DFD5); border-radius: 10px; padding: 12px 14px; background: #fff; }
.src-card__head { display: flex; align-items: center; gap: 8px; }
.src-card__head b { font-size:15px; }
.src-card__meta { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; font-size:13px; color: var(--text-3); align-items: center; }
.src-tier { flex: none; font-size:12px; font-weight: 700; padding: 2px 8px; border-radius: 4px; }
.src-tier--official { background: var(--teal-tint, #EAF4F1); color: var(--teal); }
.src-tier--exp { background: var(--amber-tint, #FBF3E4); color: #9A6B0F; }
.src-tier--third { background: var(--tint, #F1EFE9); color: var(--text-2); }
.src-tag { border: 1px solid var(--line, #E3DFD5); border-radius: 4px; padding: 1px 6px; }
.src-tag--cat { border-style: dashed; }
.src-domain { color: var(--blue); }
.src-conf--high { color: var(--green); }
.src-conf--mid { color: #9A6B0F; }
.src-conf--low { color: var(--text-3); }
.src-empty { font-size:15px; color: var(--text-3); padding: 20px 0; text-align: center; }

/* ---------- 空状态（去假数据后：接口未就绪 / 新会话 / 未生成时的占位） ---------- */

.empty-hint {
  font-size:15px;
  color: var(--text-3);
  line-height: 1.7;
  padding: 18px 20px;
  margin: 0;
  text-align: center;
  background: #FAF9F6;
  border: 1px dashed #E3DFD5;
  border-radius: 10px;
}

.thread-empty { max-width: 520px; margin: 9vh auto 0; text-align: center; }
.thread-empty__title {
  font-size:17px;
  font-weight: 500;
  color: var(--text-2);
  margin: 0 0 8px;
}
.thread-empty__hint {
  font-size:15px;
  line-height: 1.7;
  color: var(--text-3);
  margin: 0;
}

/* ---------- 响应式（桌面 1440 优先，窄屏降级） ---------- */
@media (max-width: 1280px) {
  .quota-grid { grid-template-columns: repeat(2, 1fr); }
  .camp-grid { grid-template-columns: 1fr; }
  .rating-row__reason { display: none; }
}

@media (max-width: 1024px) {
  .app { grid-template-columns: minmax(0, 1fr); }

  .sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 50;
    width: 280px;
    transform: translateX(-100%);
    transition: transform 200ms ease;
    box-shadow: var(--shadow-lg);
  }
  .sidebar.is-open { transform: translateX(0); }
  .topbar .topbar__menu { display: grid; }
  .topbar__right .btn--amber { display: none; }

  .two-col, .summary-grid, .dual { grid-template-columns: 1fr; }
  .form-row3 { grid-template-columns: 1fr; }
  .cal-grid { grid-template-columns: repeat(2, 1fr); }
  .form-block--row { flex-direction: column; align-items: stretch; }
  .tri-row__metric { width: auto; }
  .tri-row { flex-wrap: wrap; }
  .tri-row__act { width: auto; margin-left: auto; }
  .chat { padding: 20px; }
  .input-area { padding: 12px 20px 16px; }
  .ai-card, .rating-card, .bubble { max-width: 100%; }
  .page { padding: 24px 20px; }
  .upload-page, .report { padding-left: 20px; padding-right: 20px; }
  .bid-row { flex-wrap: wrap; }
  .bid-row__anchor { flex-basis: 100%; }
  .tpl-field { flex-wrap: wrap; }
  .tpl-field span { flex-basis: 100%; }
  .rating-row__score { width: auto; }
  .topbar { padding: 0 16px; gap: 8px; }
  .topbar__right #topbarStatus { display: none; }
}

@media (max-width: 640px) {
  .quota-grid { grid-template-columns: 1fr; }
  .cal-grid { grid-template-columns: 1fr; }
  .cal-switch { flex-direction: column; }
  .cal-switch__center { order: -1; width: 100%; }
  .actions { flex-direction: column; }
  .actions .btn { width: 100%; }
  .steps__lbl { display: none; }
  .file-card { flex-direction: column; align-items: stretch; }
  .file-card__ops { flex-direction: row; justify-content: flex-end; }
}

/* 矮视口兜底：固定区块 + 会话列表塞不进一屏时，改为整条侧边栏统一滚动，
   避免底部的账号区被裁掉（正常高度下不会命中） */
@media (max-height: 700px) and (min-width: 1025px) {
  .sidebar { overflow-y: auto; overscroll-behavior: contain; }
  .sidebar__sessions { flex: 0 0 auto; overflow: visible; }
}

/* ---------- 动效偏好 ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* ---------- 注册弹窗（邮箱验证码流） ---------- */
.modal-scrim { position: fixed; inset: 0; background: rgba(0,0,0,.45); z-index: 100;
  display: flex; align-items: center; justify-content: center; padding: 20px; }
.modal-scrim.hidden { display: none; }
.modal-card { width: 420px; max-width: 100%; max-height: 90vh; overflow: auto;
  background: #fff; border-radius: 14px; padding: 24px 26px;
  box-shadow: 0 16px 48px rgba(0,0,0,.22); }
.modal-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; }
.modal-head b { font-size:19px; }
.modal-close { border: none; background: none; font-size:24px; line-height: 1;
  color: var(--text-3); cursor: pointer; padding: 4px; }
.modal-close:hover { color: var(--text); }

/* 登录 / 注册切换 tab（默认落在「登录」） */
.auth-tabs {
  display: flex;
  gap: 4px;
  padding: 3px;
  margin-bottom: 18px;
  background: var(--cream);
  border-radius: var(--r-md);
}
.auth-tab {
  flex: 1;
  height: 34px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--text-3);
  font-family: inherit;
  font-size:15px;
  font-weight: 500;
  cursor: pointer;
  transition: background 120ms ease, color 120ms ease;
}
.auth-tab:hover { color: var(--text-2); }
.auth-tab.is-active { background: var(--white); color: var(--teal-deep); box-shadow: 0 1px 3px rgba(0, 0, 0, .06); }

.auth-field { margin-bottom: 14px; }
.auth-field label { display: block; font-size:14px; font-weight: 600; color: var(--text-2); margin-bottom: 5px; }
.auth-field input { width: 100%; box-sizing: border-box; border: 1px solid var(--line, #E3DFD5);
  border-radius: 8px; padding: 9px 12px; font-size:15px; color: var(--text); outline: none; }
.auth-field input:focus { border-color: var(--teal); }
.auth-err { min-height: 16px; margin: 4px 0 0; font-size:13px; color: var(--red); }

.code-row { display: flex; gap: 8px; }
.code-row input { flex: 1; letter-spacing: 2px; }
.code-row .btn { flex: none; white-space: nowrap; }
.code-row .btn:disabled { opacity: .55; cursor: not-allowed; }

.auth-submit { width: 100%; margin-top: 4px; letter-spacing: 6px; }
.auth-note { margin: 12px 0 0; font-size:13px; color: var(--text-3); line-height: 1.7; }

/* ---------- AI 调用反馈：旋转圆圈 / 读秒 / token 徽标（2026-09-11） ---------- */
@keyframes qa-spin { to { transform: rotate(360deg); } }
.spin-circle { display: inline-block; width: 14px; height: 14px; flex: none;
  border: 2px solid rgba(53,120,107,.25); border-top-color: var(--teal);
  border-radius: 50%; animation: qa-spin .8s linear infinite; vertical-align: -2px; }
.spin-circle--light { border-color: rgba(255,255,255,.35); border-top-color: #fff; }

.busy-note { display: inline-flex; align-items: center; gap: 7px;
  font-size:14px; color: var(--teal); font-weight: 600; }
.btn.is-busy { opacity: .72; pointer-events: none; }

.ai-timer { font-variant-numeric: tabular-nums; font-size:13px; color: var(--text-3); }
/* 检索阶段状态提示（联网召回期间显示，避免用户以为卡死） */
.stream-note { font-size:13px; color: var(--teal, #2C5F55); font-weight: 600; }
.token-badge { display: inline-flex; align-items: center; gap: 4px;
  font-size:13px; color: var(--text-3); font-variant-numeric: tabular-nums;
  border: 1px solid var(--line); border-radius: 10px; padding: 2px 8px;
  background: var(--surface, #FAF9F6); white-space: nowrap; }
.token-badge b { color: var(--teal); font-weight: 600; }

/* ---------- 2026-09-30 修复补充：会话删除 / 拖拽高亮 / 初始化失败横幅 ---------- */

/* 会话条目内的删除按钮：默认隐藏，悬停/聚焦或选中时露出 */
.session-item { position: relative; }
.session-item .session-del {
  display: none;
  position: absolute; right: 6px; top: 50%; transform: translateY(-50%);
  width: 20px; height: 20px; line-height: 18px; padding: 0;
  border: none; border-radius: 6px;
  background: transparent; color: var(--text-3, #999);
  font-size: 15px; cursor: pointer; text-align: center;
}
.session-item:hover .session-del, .session-item:focus-within .session-del,
.session-item.is-active .session-del { display: block; }
.session-item .session-del:hover { background: var(--red-tint, #F6E7E2); color: var(--red, #C0523D); }
/* 给右侧时间戳留出空间，避免与删除按钮重叠 */
.session-item .t { margin-right: 20px; }

/* 报表拖拽区：文件悬停时的高亮态（配合 app.js 的 dragenter/dragover） */
.compact-drop.is-dragover {
  border-color: var(--teal);
  background: var(--teal-tint);
  border-style: solid;
}

/* 初始化失败横幅（2026-09-30）：挂在 topbar 下方，作为 .main 的固定横条。
   2026-10-14 从 .body 内移出——此前插在滚动区顶部会把 100% 高的对话/生图
   视图整体下推，贴底的输入区被顶出视口（「横幅一出，输入框被挤下去一半」）。
   现在它压缩的是 .body 的高度，视图重新撑满剩余空间，输入框始终完整可见。 */
.init-warn {
  flex-shrink: 0;
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  padding: 10px 24px;
  border-bottom: 1px solid #E8D9B8;
  background: #FBF3E1; color: #7A5B13; font-size: 13.5px;
}
.init-warn span { flex: 1; min-width: 200px; }

/* ---------- 热词搜索（2026-09-30）：勾选列 + 内嵌分页 ---------- */
.hotword-table .hw-check { width: 36px; text-align: center; }
.hotword-table input[type="checkbox"] { width: 15px; height: 15px;
  accent-color: var(--teal); cursor: pointer; vertical-align: middle; }
.hw-pager-inline { display: flex; align-items: center; gap: 14px; justify-content: center;
  padding: 10px 0 2px; font-size: 13px; color: var(--text-3); }
.hw-pager-inline .btn { padding: 4px 14px; font-size: 13px; }

/* ---------- 2026-10-01 对话页布局改造：限宽居中 + 右侧时效速览栏 ---------- */
/* 根因修复：此前消息气泡与输入框横贯全宽（1440 屏 ~1100px），中文单行 70+ 字
   远超最佳阅读行宽，右侧大片空白。现对话列限宽 860px 居中（ChatGPT 同款口径），
   宽屏多出的空间给右侧常驻信息栏（热词 TOP / 旺季节点，时效数据）。 */
#view-chat { flex-direction: row; }   /* 覆盖 .view 的 column：左对话列 + 右栏 */

.chat-main {
  flex: 1 1 auto; min-width: 0; height: 100%;
  display: flex; flex-direction: column;
}

/* 对话列限宽：.thread 与输入区的子元素同宽对齐（860px = 阅读行宽上限） */
.thread { width: 100%; max-width: 860px; margin: 0 auto; }
.input-area > * { width: 100%; max-width: 860px; margin-left: auto; margin-right: auto; }

.chat-rail {
  flex: 0 0 340px; border-left: 1px solid var(--border);
  background: var(--cream); overflow-y: auto;
  padding: 18px 16px; display: flex; flex-direction: column; gap: 18px;
}

/* 右栏排版放大（2026-10-16）：主行字号对齐左栏功能模块（15px）——
   标题 15 / 主行 15 / 次级 13 / 脚注 12；内边距与行距同步加大。 */
.rail-card {
  background: var(--white); border: 1px solid var(--border);
  border-radius: var(--r-lg); padding: 15px 15px 11px;
}
.rail-card__head {
  display: flex; align-items: baseline; gap: 6px;
  font-size: 15px; font-weight: 700; color: var(--text);
  padding-bottom: 10px; border-bottom: 1px dashed var(--line);
}
.rail-card__meta { margin-left: auto; font-size: 12px; font-weight: 400;
  color: var(--text-3); white-space: nowrap; }

.rail-hot-list, .rail-fest-list { list-style: none; margin: 6px 0 0; padding: 0; }

.rail-hot { display: flex; align-items: center; gap: 8px;
  padding: 6px 7px; border-radius: 8px; cursor: pointer; font-size: 15px; }
.rail-hot:hover { background: var(--teal-tint); }
.rail-hot__rank { font-variant-numeric: tabular-nums; color: var(--teal);
  width: 28px; text-align: right; font-weight: 600; flex: none; }
.rail-hot__kw { flex: 1; min-width: 0; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; }
.rail-hot__up { color: var(--green); font-size: 12.5px; flex: none; }
.rail-hot__down { color: var(--red); font-size: 12.5px; flex: none; }
.rail-hot__flat { color: var(--text-3); font-size: 12.5px; flex: none; }
.rail-hot__new { background: var(--teal-tint); color: var(--teal-deep);
  font-size: 11px; border-radius: 6px; padding: 1px 6px; flex: none; }

.rail-fest { display: flex; align-items: center; gap: 8px; padding: 8px 7px; font-size: 15px; }
.rail-fest__name { flex: 1; min-width: 0; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; }
.rail-fest__days { font-variant-numeric: tabular-nums; color: var(--text-3);
  font-size: 13px; white-space: nowrap; flex: none; }
.rail-fest--promo .rail-fest__name { font-weight: 700; color: var(--teal-deep); }
.rail-fest--promo .rail-fest__days { color: var(--teal); font-weight: 600; }

.rail-empty { font-size: 13.5px; color: var(--text-3); padding: 10px 6px; }
.rail-card__more { display: block; width: 100%; text-align: center; margin-top: 6px;
  padding: 8px 0 3px; border: none; border-top: 1px dashed var(--line);
  background: none; color: var(--teal); font-size: 13.5px; cursor: pointer; }
.rail-card__more:hover { text-decoration: underline; }

/* 窄屏：右栏整体隐藏，恢复单列对话（与既有断点体系对齐） */
@media (max-width: 1279px) {
  #view-chat { flex-direction: column; }
  .chat-rail { display: none; }
}
/* 右栏卡片头：标题与时间戳不挤同一行（时间戳过长会把标题挤折行） */
.rail-card__head { flex-wrap: wrap; row-gap: 2px; }
.rail-card__head .rail-card__meta { flex: 0 0 100%; text-align: right; margin-left: 0; }

/* ---------- 右栏热词分页 + 旺季节点地区按钮组（2026-10-01） ---------- */
.rail-pager { display: flex; align-items: center; justify-content: center;
  gap: 3px; padding: 8px 0 2px; flex-wrap: wrap; }
.rail-page-btn { min-width: 23px; height: 23px; padding: 0 3px;
  border: 1px solid var(--line); border-radius: 6px; background: var(--white);
  color: var(--text-2); font-size: 12.5px; line-height: 21px;
  cursor: pointer; font-variant-numeric: tabular-nums; }
.rail-page-btn:hover:not(:disabled) { border-color: var(--teal); color: var(--teal); }
.rail-page-btn.is-active { background: var(--teal); border-color: var(--teal);
  color: #fff; font-weight: 600; }
.rail-page-btn:disabled { opacity: .35; cursor: default; }
.rail-page-btn--nav { font-size: 14px; }

.rail-fest-regions { display: flex; flex-wrap: wrap; gap: 6px; padding: 10px 0 4px; }
.rail-region-chip { border: 1px solid var(--line); border-radius: 999px;
  background: var(--white); color: var(--text-2);
  font-size: 12.5px; padding: 4px 10px; cursor: pointer; }
.rail-region-chip:hover { border-color: var(--teal); color: var(--teal); }
.rail-region-chip.is-active { background: var(--teal); border-color: var(--teal);
  color: #fff; font-weight: 600; }

/* ══ 个人中心视图（2026-10-03）══
   由独立页面 profile.html 的内联样式改造而来，改为主站模块视图。
   全部选择器限定在 .profile-wrap 内，避免与主站既有样式互相污染。 */
.profile-wrap {
  /* 居中与留白对齐主站其它模块的 .page（max-width / width / margin:auto / padding 四项
     缺一不可 —— 此前只写了 max-width，导致内容贴着导航栏） */
  max-width: 1180px;
  width: 100%;
  margin: 0 auto;
  padding: 28px 40px 32px;
}
.profile-wrap .pcard {
  background: var(--white); border: 1px solid var(--border);
  border-radius: var(--r-md); padding: 16px; margin-bottom: 14px;
}
.profile-wrap .pcard > h3 { font-size: 13px; margin: 0 0 12px; color: var(--text-3); font-weight: 600; }

/* 账号信息卡（首位）：品牌色渐变 + 首字头像 */
.profile-wrap .pcard--identity {
  background: linear-gradient(135deg, var(--teal) 0%, var(--teal-deep) 100%);
  border-color: transparent; color: #fff;
  box-shadow: 0 6px 18px -8px rgba(44, 95, 85, .55);
}
.profile-wrap .identity { display: flex; align-items: center; gap: 14px; }
.profile-wrap .identity__avatar {
  width: 54px; height: 54px; flex: 0 0 54px; border-radius: 50%;
  background: rgba(255,255,255,.16); border: 1.5px solid rgba(255,255,255,.34);
  display: flex; align-items: center; justify-content: center;
  font-size: 22px; font-weight: 700; color: #fff;
}
.profile-wrap .identity__meta { min-width: 0; }
.profile-wrap .identity__name { margin: 0 0 3px; font-size: 17px; font-weight: 650; color: #fff; }
.profile-wrap .identity__email,
.profile-wrap .identity__since {
  margin: 0; font-size: 12.5px; color: rgba(255,255,255,.84);
  display: flex; align-items: center; gap: 5px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.profile-wrap .identity__email svg { width: 14px; height: 14px; flex: 0 0 14px; opacity: .85; }
.profile-wrap .identity__since { margin-top: 3px; color: rgba(255,255,255,.62); font-size: 11.5px; }

/* 会员等级卡（次位） */
.profile-wrap .pcard--member { padding-bottom: 0; }
.profile-wrap .member { display: flex; align-items: center; gap: 14px; }
.profile-wrap .lv-badge {
  flex: 0 0 auto; display: inline-flex; align-items: baseline;
  padding: 8px 14px; border-radius: 12px;
  background: linear-gradient(135deg, #EAF3DE, #D6E8C0);
  color: #173404; font-size: 18px; font-weight: 750; letter-spacing: .3px;
  box-shadow: inset 0 0 0 1px rgba(23,52,4,.08);
}
.profile-wrap .member__prog { flex: 1; min-width: 0; }
.profile-wrap .member__title { font-size: 13px; font-weight: 600; color: var(--text-1); margin-bottom: 5px; }
.profile-wrap .pbar { height: 9px; background: #EFEDE7; border-radius: 6px; overflow: hidden; margin: 0 0 5px; }
.profile-wrap .pbar > i {
  display: block; height: 100%; border-radius: 6px;
  background: linear-gradient(90deg, var(--teal), #5FA391);
  transition: width .45s cubic-bezier(.4,0,.2,1);
}
.profile-wrap .stats {
  display: grid; grid-template-columns: repeat(4, 1fr);
  margin: 16px -16px 0; border-top: 1px solid var(--border);
  background: #FCFBF8; border-radius: 0 0 var(--r-md) var(--r-md);
}
.profile-wrap .stat { padding: 12px 8px; text-align: center; }
.profile-wrap .stat + .stat { border-left: 1px solid var(--border); }
.profile-wrap .stat b { display: block; font-size: 17px; font-weight: 700; color: var(--teal-deep); line-height: 1.25; }
.profile-wrap .stat span { display: block; font-size: 11.5px; color: var(--text-3); margin-top: 2px; }
@media (max-width: 560px) {
  .profile-wrap .stats { grid-template-columns: repeat(2, 1fr); }
  .profile-wrap .stat:nth-child(3) { border-left: none; }
  .profile-wrap .stat:nth-child(3), .profile-wrap .stat:nth-child(4) { border-top: 1px solid var(--border); }
}

/* 额度 / 使用统计小格子 */
.profile-wrap .pgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 12px; }
.profile-wrap .pkv .k { font-size: 12px; color: var(--text-3); }
.profile-wrap .pkv .v { font-size: 15px; font-weight: 600; color: var(--text-1); }

/* 签到日历 */
.profile-wrap .cal { display: grid; grid-template-columns: repeat(7, 1fr); gap: 5px; max-width: 340px; }
.profile-wrap .cal .d {
  aspect-ratio: 1; display: flex; align-items: center; justify-content: center;
  border-radius: 7px; background: #F2F0EA; font-size: 12px; color: var(--text-3);
}
.profile-wrap .cal .d.on { background: var(--teal); color: #fff; font-weight: 600; }
.profile-wrap .cal .d.today { outline: 2px solid var(--teal); outline-offset: 1px; }
.profile-wrap .cal .hd { font-size: 11px; text-align: center; color: var(--text-3); padding: 2px 0; }

/* 账号设置表单 */
.profile-wrap .pform { display: grid; gap: 9px; max-width: 360px; }
.profile-wrap .pform input {
  font: inherit; border: 1px solid var(--border); border-radius: var(--r-md);
  padding: 7px 10px; background: var(--white); color: var(--text-1); width: 100%;
}
.profile-wrap .prow { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.profile-wrap .pmsg { font-size: 12.5px; }
.profile-wrap .pmsg.ok { color: var(--teal); }
.profile-wrap .pmsg.bad { color: #B3261E; }
.profile-wrap .phint { font-size: 12px; color: var(--text-3); }
.profile-wrap .pdivider { border: none; border-top: 1px solid var(--border); margin: 16px 0; }
.profile-wrap .pdanger { color: #B3261E; }
/* 窄屏留白同步 .page 的 1024px 断点 */
@media (max-width: 1024px) {
  .profile-wrap { padding: 24px 20px; }
}

/* ==========================================================================
   充值/订阅（2026-10-05）
   全部选择器限定在 .bill-wrap 内，避免与主站既有样式互相污染
   （沿用 .profile-wrap 的做法）。设计稿与标注：design/billing/preview.html
   注意：不要用 var(--text-1) —— 该 token 从未在 :root 定义（见文末待修项）。
   ========================================================================== */
.bill-wrap {
  max-width: 1120px;
  width: 100%;
  margin: 0 auto;
  padding: 28px 40px 32px;
}

/* ---------- 顶部说明 ---------- */
.bill-wrap .bill-eyebrow { font-size: 11.5px; font-weight: 500; letter-spacing: .22em; color: var(--teal); margin: 0 0 10px; }
/* 加购分区标题（2026-10-20）：比顶部 eyebrow 更大更醒目，用户一眼看到「通用额度包 / 生图次数包」 */
.bill-wrap .bill-eyebrow.bill-section {
  font-size: 16px; font-weight: 700; letter-spacing: .02em;
  color: var(--teal-deep); margin: 0 0 10px;
}
.bill-wrap .bill-h1 { font-size: 27px; font-weight: 650; letter-spacing: -.2px; margin: 0 0 8px; color: var(--text); }
.bill-wrap .bill-sub { font-size: 13.5px; color: var(--text-3); margin: 0; line-height: 1.7; }
.bill-wrap .bill-sub b { color: var(--text-2); font-weight: 600; }

/* ---------- 当前档位条 ---------- */
.bill-wrap .bill-status {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  margin: 18px 0 30px; padding: 11px 16px;
  background: var(--white); border: 1px solid var(--border); border-radius: var(--r-md);
  font-size: 13px; color: var(--text-3);
}
.bill-wrap .bill-status__dot { width: 6px; height: 6px; border-radius: 50%; background: var(--teal-soft); flex: 0 0 6px; }
.bill-wrap .bill-status b { color: var(--text); font-weight: 600; }
.bill-wrap .bill-status__link { margin-left: auto; color: var(--teal); text-decoration: none; font-weight: 500; }
.bill-wrap .bill-status__link:hover { text-decoration: underline; }
.bill-wrap .bill-status--expired { background: var(--amber-tint); border-color: #EFD9AE; }
.bill-wrap .bill-status--warn b { color: var(--amber); }

/* ---------- 档位卡 ---------- */
.bill-wrap .bill-tiers { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; align-items: stretch; padding-top: 14px; }
.bill-wrap .tier {
  position: relative; display: flex; flex-direction: column;
  background: var(--white); border: 1px solid var(--border);
  border-radius: var(--r-xl); padding: 30px 24px 24px; box-shadow: var(--shadow-sm);
}
.bill-wrap .tier--pick { background: var(--teal-tint); border: 1px solid var(--teal-soft); }
.bill-wrap .tier--pick .tier__delta { background: var(--white); }
.bill-wrap .tier__badge {
  position: absolute; top: -11px; left: 50%; transform: translateX(-50%);
  padding: 4px 13px; border-radius: 100px; background: var(--teal); color: #fff;
  font-size: 11.5px; font-weight: 600; letter-spacing: .04em; white-space: nowrap;
}
.bill-wrap .tier__rank { font-size: 15px; font-weight: 600; color: var(--text); margin: 0 0 3px; }
.bill-wrap .tier__pos { font-size: 12.5px; color: var(--text-4); margin: 0; min-height: 20px; }
.bill-wrap .tier__price { display: flex; align-items: baseline; gap: 4px; margin: 18px 0 4px; }
.bill-wrap .tier__cur { font-size: 17px; font-weight: 600; color: var(--teal-deep); align-self: flex-start; margin-top: 7px; }
.bill-wrap .tier__num { font-size: 40px; font-weight: 700; letter-spacing: -1.4px; color: var(--teal-deep); line-height: 1; }
.bill-wrap .tier__per { font-size: 12.5px; color: var(--text-4); }
.bill-wrap .tier__cycle { font-size: 11.5px; color: var(--text-5); margin: 0 0 20px; }
.bill-wrap .tier__rule { height: 1px; background: var(--line); margin: 0 0 18px; }
.bill-wrap .tier__rule--gap { margin: 20px 0 16px; }
.bill-wrap .tier__grp { font-size: 11.5px; color: var(--text-4); letter-spacing: .06em; margin: 0 0 7px; }
.bill-wrap .tier__hero { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin: 0 0 16px; }
.bill-wrap .tier__hero-k { font-size: 14px; color: var(--text-2); }
.bill-wrap .tier__hero-v { font-size: 21px; font-weight: 700; color: var(--text); letter-spacing: -.4px; }
.bill-wrap .tier__hero-v i { font-size: 12px; font-weight: 500; font-style: normal; color: var(--text-4); margin-left: 2px; }
.bill-wrap .tier__rest { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.bill-wrap .tier__rest-k { font-size: 13px; color: var(--text-2); }
.bill-wrap .tier__rest-v { font-size: 17px; font-weight: 600; color: var(--text); }
.bill-wrap .tier__rest-v i { font-size: 12px; font-weight: 500; font-style: normal; color: var(--text-4); margin-left: 2px; }
.bill-wrap .tier__mods { font-size: 11.5px; color: var(--text-4); margin: 6px 0 0; line-height: 1.65; }
/* 模型权限：不拆「生成 / 联网」，直接列新增可用的模型名（见 PRD §2.7.5） */
.bill-wrap .tier__models-k { font-size: 13px; color: var(--text-2); margin: 0; }
.bill-wrap .tier__models { font-size: 16px; font-weight: 650; color: var(--text); letter-spacing: -.2px; margin: 5px 0 0; }
/* 会员卡附加权益（2026-10-23 · Pro 的「优先响应通道」） */
.bill-wrap .tier__perks { margin: 10px 0 0; display: flex; flex-direction: column; gap: 5px; }
.bill-wrap .tier__perk { margin: 0; font-size: 13.5px; font-weight: 600; color: var(--teal-deep); }
/* AI 生图权益强调行（2026-10-15）：高亮「最新 GPT 生图模型 · 可生成 4K 高质量图」 */
.bill-wrap .tier__image-em {
  font-size: 12.5px; font-weight: 600; color: var(--teal-deep);
  background: var(--teal-tint); border-radius: 6px; padding: 4px 9px;
  margin: 0; display: inline-block; line-height: 1.5;
}
.bill-wrap .tier__models--locked { color: var(--text-5); }
.bill-wrap .tier__delta {
  align-self: flex-start; margin-top: 14px; padding: 3px 10px;
  font-size: 11.5px; font-weight: 500; color: var(--teal-deep);
  background: var(--teal-tint); border-radius: 100px;
}
.bill-wrap .tier__cta { margin-top: auto; padding-top: 22px; }
.bill-wrap .tier__cta .btn { width: 100%; height: 42px; font-size: 14.5px; border-radius: var(--r-md); }
.bill-wrap .tier__fine { font-size: 11px; color: var(--text-5); text-align: center; margin: 10px 0 0; }
.bill-wrap .bill-foot { margin-top: 34px; font-size: 11.5px; color: var(--text-5); line-height: 1.8; }

/* ---------- 支付弹层 ---------- */
.bill-pay-card {
  width: 392px; max-width: 100%; background: #fff; border-radius: var(--r-xl);
  padding: 24px 26px 22px; box-shadow: 0 16px 48px rgba(0,0,0,.22);
}
.bill-pay-sum { display: flex; align-items: baseline; justify-content: space-between; padding: 12px 14px; background: var(--cream); border-radius: var(--r-md); margin-bottom: 18px; }
.bill-pay-sum__k { font-size: 13px; color: var(--text-3); }
.bill-pay-sum__v { font-size: 15px; font-weight: 600; color: var(--text); }
.bill-pay-sum__v em { font-size: 20px; font-style: normal; font-weight: 700; color: var(--teal-deep); }
/* 支付宝「电脑网站支付」WEB 端官方样式对齐（2026-10-20）：
   ① 成功提示条 ② 支付方式选择卡（LOGO+推荐标签）③ 蓝色「立即支付」。
   品牌元素必须用官方 LOGO 图形（img/alipay/alipay-logo.png），不能用色块顶替。 */
.bill-pay-banner { display: flex; gap: 10px; padding: 12px 14px; background: var(--cream); border-radius: var(--r-md); margin-bottom: 16px; }
.bill-pay-banner__ico {
  width: 26px; height: 26px; border-radius: 50%; background: #1677FF; flex: none;
  display: flex; align-items: center; justify-content: center; margin-top: 1px;
}
.bill-pay-banner__ico svg { width: 14px; height: 14px; }
.bill-pay-banner__t { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.bill-pay-banner__t b { font-size: 13px; color: var(--text); font-weight: 600; line-height: 1.45; }
.bill-pay-banner__meta { font-size: 12.5px; color: var(--text-3); }
.bill-pay-banner__meta em { font-style: normal; color: #FF6A00; font-weight: 700; font-size: 15px; }

/* 支付弹层 · 联系邮箱（2026-10-22）：订单溯源用，显著但不阻断支付 */
.bill-contact { margin: 0 0 14px; }
.bill-contact__lbl { display: block; font-size: 13px; font-weight: 600;
  color: var(--text-2); margin-bottom: 6px; }
.bill-contact__lbl em { font-style: normal; font-weight: 400; font-size: 12px;
  color: var(--text-3); margin-left: 4px; }
.bill-contact__input { width: 100%; height: 40px; padding: 0 12px;
  border: 1px solid var(--border); border-radius: 8px; font-size: 14px;
  font-family: inherit; background: var(--white); }
.bill-contact__input:focus { outline: none; border-color: var(--teal);
  box-shadow: 0 0 0 2px var(--teal-soft); }
.bill-contact__msg { margin: 6px 0 0; font-size: 12px; color: var(--text-3); min-height: 16px; }
.bill-contact__msg.is-ok { color: var(--green); }
.bill-contact__msg.is-bad { color: #B3261E; }

.bill-pay-way-t { font-size: 12.5px; color: var(--text-3); margin: 0 0 8px; }
.bill-pay-way { display: flex; gap: 8px; margin: 0 0 16px; }
.bill-pay-way__item {
  flex: 1; display: flex; align-items: center; gap: 8px; padding: 10px 12px;
  border: 1.5px solid #1677FF; border-radius: var(--r-md); background: #fff;
}
.bill-pay-way__radio { width: 14px; height: 14px; border-radius: 50%; border: 1.5px solid #cdc8be; flex: none; position: relative; }
.bill-pay-way__item.is-active .bill-pay-way__radio { border-color: #1677FF; }
.bill-pay-way__item.is-active .bill-pay-way__radio::after {
  content: ""; position: absolute; inset: 2.5px; border-radius: 50%; background: #1677FF;
}
.bill-pay-way__logo { width: 22px; height: 22px; border-radius: 5px; display: block; flex: none; }
.bill-pay-way__name { font-size: 13.5px; font-weight: 600; color: var(--text); }
.bill-pay-way__tag {
  margin-left: auto; font-size: 10.5px; line-height: 1; color: #fff; background: #FF6A00;
  border-radius: 3px; padding: 3px 5px; font-weight: 600; flex: none;
}

/* 官方样例的主按钮是支付宝蓝（与站内品牌青区分：这是「支付宝动作」的语义色） */
.bill-pay-btn {
  display: flex; width: 100%; height: 42px; align-items: center; justify-content: center;
  background: #1677FF; border-radius: var(--r-md); color: #fff;
  font-size: 14.5px; font-weight: 600; text-decoration: none;
}
.bill-pay-btn:hover { background: #3d8bff; }
.bill-alipay__brand { display: flex; align-items: center; justify-content: center; gap: 6px; margin: 14px 0 0; font-size: 12.5px; color: var(--text-2); }
.bill-alipay__brand-logo { width: 16px; height: 16px; border-radius: 4px; display: inline-block; }
.bill-timer { display: flex; align-items: center; justify-content: center; gap: 6px; margin: 16px 0 14px; font-size: 12.5px; color: var(--text-3); }
.bill-timer b { font-variant-numeric: tabular-nums; color: var(--amber); font-weight: 600; }
.bill-timer.is-over b { color: var(--red); }
.bill-pay-card .btn { width: 100%; height: 42px; font-size: 14.5px; border-radius: var(--r-md); }
.bill-pay-alt { font-size: 11.5px; color: var(--text-4); line-height: 1.75; margin: 14px 0 0; padding-top: 14px; border-top: 1px solid var(--line); }
.bill-pay-alt b { color: var(--text-2); font-weight: 600; }
.bill-pay-ord { font-size: 11px; color: var(--text-5); text-align: center; margin: 12px 0 0; font-variant-numeric: tabular-nums; }
.bill-demo-note {
  margin: 0 0 14px; padding: 9px 11px; border-radius: var(--r-md);
  background: var(--amber-tint); color: var(--amber);
  font-size: 11.5px; line-height: 1.65;
}
.bill-demo-note b { color: var(--amber); font-weight: 600; }

/* ---------- 人工开通（上线初期的收费方式，见 app.js BILLING_MODE） ---------- */
.bill-manual-simple { text-align: center; padding: 18px 0 22px; }
.bill-manual-simple__main { font-size: 15px; font-weight: 600; color: var(--teal-deep); margin: 0 0 9px; }
.bill-manual-simple__sub { font-size: 12px; color: var(--text-4); margin: 0; letter-spacing: .02em; }

/* ---------- 群二维码 + 群号复制（2026-10-07） ---------- */
.bill-qq { display: flex; flex-direction: column; align-items: center; padding: 2px 0 0; }
/* ⚠️ 二维码外面**不要**加边框 / 阴影 / 圆角裁切：四周白边就是静区，
   加一圈描边等于把静区挤掉，会直接影响识别率。 */
.bill-qq__img { display: block; width: 176px; height: 176px; background: #fff; }
.bill-qq__row { display: flex; align-items: center; gap: 10px; margin: 12px 0 5px; }
.bill-qq__no { font-size: 13px; color: var(--text-2); }
.bill-qq__no b {
  font-weight: 600; color: var(--text);
  font-variant-numeric: tabular-nums; letter-spacing: .06em;
}
.bill-qq__tip { margin: 0; font-size: 11.5px; color: var(--text-4); }

.bill-qq__copy {
  position: relative;
  font: inherit; font-size: 12px; font-weight: 500; line-height: 1;
  padding: 8px 13px; border-radius: 100px; cursor: pointer;
  color: var(--teal-deep); background: var(--teal-tint); border: 1px solid transparent;
  transition: background .15s ease, color .15s ease;
}
.bill-qq__copy:hover { background: var(--teal-soft); color: #fff; }
.bill-qq__copy:focus-visible { outline: 2px solid var(--teal); outline-offset: 2px; }
/* 把点击区撑到 44px 高：按钮本身约 30px，靠伪元素上下各补 7px。
   触控目标 44px 是 WCAG 的硬线，小尺寸内联按钮最容易漏掉这一条。 */
.bill-qq__copy::after { content: ''; position: absolute; inset: -7px -6px; }
/* 窄屏兜底：整行允许换行，按钮不会被挤出弹层 */
@media (max-width: 400px) {
  .bill-qq__row { flex-wrap: wrap; justify-content: center; }
}

/* 「已复制」就地反馈：浅色小胶囊，浮在按钮右侧。
   放在右侧而不是上方 —— 上方就是二维码，压上去会挡住码。
   也**不复用全局 .toast**：那个是深色、弹在屏幕底部，用户刚点完按钮，视线就在按钮上。 */
.bill-copy { position: relative; display: inline-flex; }
.bill-copy__done {
  position: absolute; left: calc(100% + 8px); top: 50%;
  transform: translate(0, -50%) scale(.96);
  padding: 4px 11px; border-radius: 100px; white-space: nowrap;
  background: var(--white); color: var(--teal-deep);
  border: 1px solid var(--teal-soft);
  font-size: 11.5px; font-weight: 600;
  box-shadow: 0 5px 14px -5px rgba(40, 32, 16, .3);
  opacity: 0; pointer-events: none;
  transition: opacity .18s ease, transform .18s ease;
}
.bill-copy__done.is-show { opacity: 1; transform: translate(0, -50%) scale(1); }

/* ---------- 开通成功 ---------- */
.bill-done-card { width: 400px; max-width: 100%; background: #fff; border-radius: var(--r-xl); padding: 30px 28px 24px; box-shadow: 0 16px 48px rgba(0,0,0,.22); text-align: center; }
.bill-done-ico { width: 54px; height: 54px; margin: 0 auto 16px; border-radius: 50%; background: var(--teal-tint); display: grid; place-items: center; }
.bill-done-ico svg { width: 27px; height: 27px; }
.bill-done-h { font-size: 19px; font-weight: 650; color: var(--text); margin: 0 0 6px; }
.bill-done-p { font-size: 13px; color: var(--text-3); margin: 0 0 20px; }
.bill-done-p b { color: var(--teal-deep); font-weight: 600; }
.bill-done-diff { border: 1px solid var(--border); border-radius: var(--r-md); overflow: hidden; margin-bottom: 20px; }
.bill-done-row { display: flex; align-items: center; justify-content: space-between; padding: 11px 14px; font-size: 13px; }
.bill-done-row + .bill-done-row { border-top: 1px solid var(--line); }
.bill-done-row__k { color: var(--text-2); }
.bill-done-row__v { color: var(--text-4); font-variant-numeric: tabular-nums; }
.bill-done-row__v b { color: var(--teal-deep); font-weight: 700; font-size: 14.5px; }
.bill-done-card .btn { width: 100%; height: 42px; font-size: 14.5px; border-radius: var(--r-md); }

/* 窄屏：档位卡并排 → 单列；触控目标抬到 44px 以上 */
@media (max-width: 1024px) {
  .bill-wrap { padding: 24px 20px; }
  .bill-wrap .bill-tiers { grid-template-columns: 1fr; gap: 22px; }
  .bill-wrap .tier__cta .btn,
  .bill-pay-card .btn,
  .bill-done-card .btn { height: 46px; }
}
@media (max-width: 640px) {
  .bill-wrap .bill-h1 { font-size: 22px; }
}

/* ==========================================================================
   会员身份牌（2026-10-05）
   放在 .profile-wrap 内并全部加前缀，沿用该段的隔离做法。
   设计稿与规格：design/member-card/preview.html
   只有开通了会员才渲染卡片；未开通的只看到一行引导（方案 B）。
   ========================================================================== */
.profile-wrap .uid-label { font-size: 12.5px; font-weight: 600; color: var(--text-3); margin: 0 0 12px; }
.profile-wrap .uid-label__warn { color: var(--amber); font-weight: 500; }

/* ---------- 卡面 ---------- */
.profile-wrap .uid {
  position: relative; overflow: hidden; box-sizing: border-box;
  width: 100%; max-width: 440px; aspect-ratio: 400 / 248;
  border-radius: 18px; padding: 26px 28px;
  display: flex; flex-direction: column;
}
/* 压边：内缩 11px 的一圈细线 —— 「像不像一张卡」全靠这一笔 */
.profile-wrap .uid::before {
  content: ''; position: absolute; inset: 11px; border-radius: 11px;
  border: 1px solid currentColor; opacity: .15; pointer-events: none;
}
/* 水印：只让圆盘的一小片弧贴在右下角，多了就俗 */
.profile-wrap .uid__wm {
  position: absolute; right: -22%; bottom: -42%; width: 60%; aspect-ratio: 1;
  opacity: .05; pointer-events: none;
}
.profile-wrap .uid__wm svg, .profile-wrap .uid__mark svg { display: block; width: 100%; height: 100%; }

/* Pro · 深青典藏 */
.profile-wrap .uid--pro {
  background: linear-gradient(135deg, #31695E 0%, #1F463C 100%); color: #E7F1EE;
  box-shadow: 0 14px 34px -14px rgba(31, 70, 60, .6);
}
/* Lite · 素笺
   ⚠️ 底必须是**纯白**：站点页面底是暖白 #F7F5F1，卡面若也用暖白，卡与页面的边界会糊掉。 */
.profile-wrap .uid--lite {
  background: var(--white); border: 1px solid var(--border); color: var(--teal-deep);
  box-shadow: var(--shadow-sm);
}
/* ⚠️ 白卡上的压边线要更实（.22）：同样是 14% 不透明度，青在深底上看得见，
   在纯白上几乎等于没有 —— 同一个数值在两种底色上不是同一个效果。 */
.profile-wrap .uid--lite::before { opacity: .22; }
.profile-wrap .uid--lite .uid__wm { opacity: .05; }

.profile-wrap .uid__top { display: flex; align-items: center; gap: 10px; }
.profile-wrap .uid__mark { width: 25px; height: 25px; flex: 0 0 25px; }
.profile-wrap .uid__brand b { display: block; font-size: 13px; font-weight: 600; letter-spacing: .05em; line-height: 1.2; }
.profile-wrap .uid__brand small { display: block; font-size: 7.5px; letter-spacing: .27em; opacity: .55; margin-top: 1px; }
.profile-wrap .uid__tier {
  margin-left: auto; font-size: 10px; font-weight: 600; letter-spacing: .15em;
  padding: 4px 11px 3px; border-radius: 100px;
}
.profile-wrap .uid--pro .uid__tier { border: 1px solid rgba(231, 241, 238, .34); }
.profile-wrap .uid--lite .uid__tier { background: var(--teal-tint); color: var(--teal-deep); }

.profile-wrap .uid__no { margin-top: auto; }
.profile-wrap .uid__no-lbl { font-size: 8.5px; letter-spacing: .34em; opacity: .5; margin: 0 0 4px; }
.profile-wrap .uid__no-val {
  font-size: 34px; font-weight: 600; letter-spacing: .05em; line-height: 1;
  margin: 0; font-variant-numeric: tabular-nums;
}

.profile-wrap .uid__foot { display: flex; align-items: flex-end; gap: 32px; margin-top: 20px; }
.profile-wrap .uid__k { font-size: 8.5px; letter-spacing: .2em; opacity: .46; margin: 0 0 3px; }
.profile-wrap .uid__v { font-size: 12.5px; font-weight: 500; margin: 0; }
.profile-wrap .uid__right { margin-left: auto; text-align: right; }

/* ---------- 未开通会员：一行低调引导（方案 B） ---------- */
.profile-wrap .uid-empty {
  border: 1px dashed var(--border); border-radius: var(--r-md);
  padding: 15px 17px; max-width: 440px;
}
.profile-wrap .uid-empty__t { font-size: 13px; font-weight: 600; color: var(--text-2); margin: 0 0 5px; }
.profile-wrap .uid-empty__d { font-size: 12.5px; color: var(--text-3); margin: 0 0 9px; line-height: 1.7; }
.profile-wrap .uid-empty__a { font-size: 12.5px; font-weight: 500; color: var(--teal); text-decoration: none; }
.profile-wrap .uid-empty__a:hover { text-decoration: underline; }

@media (max-width: 640px) {
  .profile-wrap .uid { padding: 20px 22px; }
  .profile-wrap .uid__no-val { font-size: 26px; }
  .profile-wrap .uid__foot { gap: 18px; margin-top: 14px; }
}

/* ==========================================================================
   AI 生图（2026-10-14）
   对话式视图 + 右栏（我的图库 / 亚马逊图片规格 / 生图次数包）。
   设计样图：design/ai-image/v1-plus.html；生成能力为接口预留（占位图走通全流程）。
   选择器一律 .aig- 前缀或限定 #view-ai-image 内，避免与主站样式互相污染。
   ========================================================================== */

/* 与对话页同构的两栏布局：左对话列 + 右栏，自身不滚动（滚动下放给 .chat） */
#view-ai-image { flex-direction: row; height: 100%; min-height: 0; overflow: hidden; }

/* ---------- 输入区：参考图（输入框左侧附件位）+ 尺寸快选（输入框下方） ----------
   2026-10-14 调整：尺寸行原在输入框上方——两行尺寸卡把输入框顶到屏幕最底部
   （空态动线断裂：中央引导与输入框隔了 300px）。移下来后输入框整体上移 ~130px，
   「先写描述、再选尺寸」的操作层级也更顺。 */
.aig-sizes { display: flex; gap: 10px; flex-wrap: wrap; }
.aig-size {
  display: flex; flex-direction: column; gap: 1px; align-items: flex-start;
  padding: 9px 14px 8px; min-width: 172px;
  border: 1px solid var(--border); border-radius: 10px; background: var(--white);
  cursor: pointer; text-align: left; font-family: inherit;
  transition: border-color 120ms ease, background 120ms ease;
}
.aig-size b { font-size: 13.5px; font-weight: 600; color: var(--text); }
.aig-size span { font-size: 12px; color: var(--text-3); font-variant-numeric: tabular-nums; }
.aig-size:hover { border-color: var(--teal-soft); }
.aig-size.is-active { border-color: var(--teal); background: var(--teal-tint); }
.aig-size.is-active b { color: var(--teal-deep); }
.aig-size.is-active span { color: var(--teal); }
.aig-size:disabled { opacity: .55; cursor: not-allowed; }

/* 自定义尺寸：选中后在其下方展开宽高输入 */
.aig-custom { display: none; align-items: center; gap: 6px; width: 100%; margin-top: 2px; }
.aig-custom.is-open { display: inline-flex; }
.aig-custom input {
  width: 68px; height: 30px; border: 1px solid var(--border); border-radius: 8px;
  font-family: inherit; font-size: 12.5px; padding: 0 8px; text-align: center;
  color: var(--text); background: var(--white);
}
.aig-custom input:focus { outline: none; border-color: var(--teal-soft); }
.aig-custom span { font-size: 12px; color: var(--text-4); }

/* 参考图（垫图）：输入框内左侧的附件位小方块（38px，垂直居中）。
   空态 = 虚线「+」；已上传 = 缩略图 + 右上角移除。 */
.aig-ref {
  width: 38px; height: 38px; border-radius: 9px; border: 1.5px dashed var(--text-5);
  background: var(--white); display: flex; align-items: center; justify-content: center;
  color: var(--text-3); cursor: pointer; padding: 0; font-family: inherit; flex: none;
  align-self: center;
}
.aig-ref .ico { width: 20px; height: 20px; }
.aig-ref:hover { border-color: var(--teal); color: var(--teal); }
.aig-ref.is-filled { border: 1px solid var(--border); position: relative; overflow: hidden; }
.aig-ref.is-filled img { width: 100%; height: 100%; object-fit: cover; display: block; }
.aig-ref__x {
  position: absolute; right: 2px; top: 2px; width: 14px; height: 14px; border-radius: 50%;
  background: rgba(40, 32, 16, .55); color: #fff; font-size: 10px; line-height: 14px;
  text-align: center; cursor: pointer;
}
.aig-ref__x:hover { background: var(--red); }

/* 渠道 / 模型 ID 下拉（2026-10-15）：复用全局 .model-select 基础样式
   （与对话页输入框里的模型下拉同源），这里只做生图输入框内的窄身适配。 */
.aig-sel { max-width: 152px; font-size: 12.5px; }
.aig-sel--model { max-width: 205px; }

/* 生图输入框（2026-10-16）：默认显示两行——min-height 锁两行高
   （15px 字号 × 1.5 行高 × 2 行 + 12px 上下内边距 = 57px），
   多行输入由 autoGrow 向上生长（上限 120px，与对话页输入框一致）。 */
.aig-field { min-height: 57px; }
/* 发送键与左侧参考图/下拉统一垂直居中（输入框两行高后避免贴底） */
#aiimgInputForm .send-btn { align-self: center; }

/* ---------- 对话流：结果卡 ---------- */
.aig-shot {
  background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg);
  display: flex; align-items: center; justify-content: center; overflow: hidden; flex: none;
}
.aig-shot img { width: 100%; height: 100%; object-fit: cover; display: block; }
.aig-result { display: flex; gap: 22px; align-items: flex-start; }
.aig-result__side { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 12px; }
.aig-kv {
  display: flex; justify-content: space-between; gap: 12px; font-size: 13.5px;
  padding: 7px 0; border-bottom: 1px dashed var(--line);
}
.aig-kv:last-child { border-bottom: 0; }
.aig-kv .k { color: var(--text-3); flex: none; }
.aig-kv .v { color: var(--text); font-weight: 500; font-variant-numeric: tabular-nums; text-align: right; }
.aig-kv .v.ok { color: var(--green); }
.aig-ops { display: flex; gap: 10px; flex-wrap: wrap; }
.aig-cap { font-size: 12px; color: var(--text-4); line-height: 1.6; }

/* 生成中（等待占位）：spinner + 提示条 */
.aig-generating { display: flex; align-items: center; gap: 9px; font-size: 13.5px; color: var(--teal-deep); font-weight: 500; }
.aig-generating .skel { flex: 1; min-width: 0; }

/* ---------- 右栏 · 我的图库 ---------- */
.aig-ico { width: 16px; height: 16px; flex: none; align-self: center; color: var(--text-2); }
.aig-newgroup {
  margin-left: auto; border: 1px solid var(--border); background: var(--white);
  color: var(--text-2); font-size: 12px; border-radius: 6px; padding: 3px 9px;
  cursor: pointer; font-family: inherit; font-weight: 400;
}
.aig-newgroup:hover { border-color: var(--teal); color: var(--teal); }
.aig-groups { display: flex; flex-wrap: wrap; gap: 7px; padding: 8px 2px 6px; }
.aig-gchip {
  border: 1px solid var(--line); border-radius: 999px; background: var(--white);
  color: var(--text-2); font-size: 12.5px; padding: 4px 11px; cursor: pointer; font-family: inherit;
}
.aig-gchip i { font-style: normal; color: var(--text-4); font-size: 11.5px; margin-left: 2px; }
.aig-gchip:hover { border-color: var(--teal-soft); }
.aig-gchip.is-active { background: var(--teal); border-color: var(--teal); color: #fff; font-weight: 500; }
.aig-gchip.is-active i { color: rgba(255, 255, 255, .78); }

/* 新建分组的内联输入框（就地创建） */
.aig-newgroup-input {
  width: 100%; margin: 2px 0 4px; height: 30px;
  border: 1px solid var(--teal-soft); border-radius: 8px;
  font-family: inherit; font-size: 13px; padding: 0 10px; color: var(--text); background: var(--white);
}
.aig-newgroup-input:focus { outline: none; border-color: var(--teal); }

/* 图库记录行 */
.aig-rail-item { display: flex; gap: 10px; align-items: center; padding: 6px 5px; border-radius: 8px; position: relative; }
.aig-rail-item:hover { background: var(--teal-tint); }
.aig-rail-item .t {
  width: 38px; height: 38px; border-radius: 8px; border: 1px solid var(--line);
  background: #fff; flex: none; display: flex; align-items: center; justify-content: center; overflow: hidden;
}
.aig-rail-item .t img { width: 100%; height: 100%; object-fit: cover; }
.aig-rail-item .m { flex: 1; min-width: 0; }
.aig-rail-item .m b {
  display: block; font-size: 15px; color: var(--text-2); font-weight: 500;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.aig-rail-item .m span {
  font-size: 12.5px; color: var(--text-4); font-variant-numeric: tabular-nums;
  display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.aig-row-more {
  flex: none; border: 0; background: none; color: var(--text-4); font-size: 16px;
  line-height: 1; padding: 4px 3px; cursor: pointer; border-radius: 6px;
}
.aig-row-more:hover { color: var(--teal); background: var(--white); }

/* 移至分组：行内小菜单 */
.aig-move-menu {
  position: absolute; right: 2px; top: calc(100% - 4px); z-index: 30;
  background: var(--white); border: 1px solid var(--border); border-radius: 10px;
  box-shadow: var(--shadow-md); padding: 5px; min-width: 140px;
}
.aig-move-menu button {
  display: block; width: 100%; text-align: left; border: 0; background: none;
  font-family: inherit; font-size: 13.5px; color: var(--text-2);
  padding: 7px 11px; border-radius: 6px; cursor: pointer;
}
.aig-move-menu button:hover { background: var(--cream); }
.aig-move-menu button.is-cur { color: var(--teal-deep); font-weight: 600; }

/* 空态（无图片/无分组） */
.aig-empty { font-size: 13px; color: var(--text-4); padding: 12px 6px; text-align: center; line-height: 1.7; }

/* ---------- 右栏 · 规格与次数包（价格表） ---------- */
.aig-spec-note { font-size: 11.5px; color: var(--text-3); line-height: 1.7; padding: 5px 4px 0; }
.aig-quota { font-size: 13.5px; color: var(--text-3); margin: 10px 4px 6px; }
.aig-quota b { color: var(--teal-deep); font-size: 16px; font-variant-numeric: tabular-nums; }
.aig-price__row { display: flex; align-items: baseline; gap: 6px; padding: 7px 9px; border-radius: 8px; }
.aig-price__row .n { font-size: 15px; font-weight: 500; color: var(--text-2); }
.aig-price__row .c { font-size: 13px; color: var(--text-4); font-variant-numeric: tabular-nums; }
.aig-price__row b { margin-left: auto; font-size: 16px; font-weight: 700; color: var(--text); font-variant-numeric: tabular-nums; }
.aig-price__row em {
  font-style: normal; font-size: 11.5px; font-weight: 600; color: #fff;
  background: var(--teal); border-radius: 6px; padding: 2px 7px;
}
.aig-price__row.is-hot { background: var(--teal-tint); }
.aig-price__row.is-hot b { color: var(--teal-deep); }
.aig-price__cta { width: 100%; margin-top: 10px; height: 38px; font-size: 14px; }
.aig-price__fine { margin: 8px 0 0; font-size: 12px; color: var(--text-5); text-align: center; line-height: 1.6; }

/* ---------- 参数行（2026-10-14 真实生图）：质量 + 数量 ---------- */
.aig-opts { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.aig-opts__lbl { font-size: 12.5px; color: var(--text-4); }
.aig-opts .seg { height: 30px; gap: 4px; }
.aig-opts .seg__opt { height: 28px; padding: 0 12px; font-size: 12.5px; }
.aig-stepper { display: inline-flex; align-items: center; gap: 4px; }
.aig-step {
  width: 28px; height: 28px; border: 1px solid var(--border); border-radius: 8px;
  background: var(--white); color: var(--text-2); font-size: 15px; line-height: 1;
  cursor: pointer; font-family: inherit; display: grid; place-items: center;
}
.aig-step:hover:not(:disabled) { border-color: var(--teal); color: var(--teal); }
.aig-step:disabled { opacity: .4; cursor: not-allowed; }
#aiimgCountVal { min-width: 22px; text-align: center; font-size: 14px; color: var(--text); font-variant-numeric: tabular-nums; }
.aig-opts__cost { margin-left: auto; font-size: 12px; color: var(--text-4); }
/* 消耗提示里的额度恢复倒计时（2026-10-15）：品牌色 + 等宽数字，随时在走 */
#aiimgResetCd { color: var(--teal-deep); font-weight: 600; font-variant-numeric: tabular-nums; }

/* 用户菜单里的额度窗口标签（AI 生图行「7天 / 每日」，2026-10-15） */
.user-menu__row small { font-size: 10.5px; color: var(--text-4); font-weight: 400; margin-left: 2px; }

/* 生成中计时器（真实出图约 1–2 分钟） */
.aig-timer { margin-left: auto; font-size: 12.5px; font-weight: 600; color: var(--teal-deep); font-variant-numeric: tabular-nums; }

/* ---------- 生图模型标注（2026-10-15）：ID 由 /ai-image/meta 下发 ---------- */
.aig-model-note { margin: 2px 0 0; font-size: 12px; color: var(--text-4); }

/* ---------- 游客锁条（2026-10-15）：生图对游客上锁但可见 ---------- */
.aig-lock {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 10px 14px; margin-bottom: 2px;
  border: 1px solid #EFD9AE; border-radius: 10px;
  background: var(--amber-bg); color: var(--amber); font-size: 13.5px;
}
.aig-lock .ico { width: 17px; height: 17px; }
.aig-lock span { flex: 1; min-width: 200px; }
.aig-lock .btn { height: 32px; font-size: 13px; flex: none; }

/* ---------- 亚马逊图片规格速查（右栏，2026-10-16：替换原分类目卡） ---------- */
.aig-cat { display: flex; flex-direction: column; padding: 6px 2px 2px; }
.aig-cat__row {
  display: flex; align-items: baseline; justify-content: space-between; gap: 10px;
  padding: 7px 3px; border-bottom: 1px dashed var(--line);
}
.aig-cat__row:last-child { border-bottom: 0; }
.aig-cat__row b { font-size: 15px; font-weight: 600; color: var(--text-2); flex: none; }
.aig-cat__row span { font-size: 13px; color: var(--text-3); font-variant-numeric: tabular-nums; text-align: right; }
.aig-cat__foot { margin: 8px 0 2px; font-size: 12px; color: var(--text-4); line-height: 1.65; }

/* ---------- 生图空态 · 样图按钮与预览弹层（2026-10-16） ---------- */
.aig-sample { display: inline-flex; align-items: center; gap: 6px; }
.aig-peek {
  width: 30px; height: 30px; padding: 0; border: 1px solid var(--border);
  border-radius: 9px; background: var(--white); overflow: hidden;
  cursor: zoom-in; flex: none;
}
.aig-peek .aig-peek__thumb { width: 100%; height: 100%; object-fit: cover; display: block; }
.aig-peek:hover { border-color: var(--teal); box-shadow: 0 0 0 2px var(--teal-tint); }

.aig-peek-card {
  width: min(92vw, 780px); max-height: 92vh; background: #fff;
  border-radius: 14px; padding: 16px 18px 14px;
  box-shadow: 0 16px 48px rgba(0,0,0,.22);
  display: flex; flex-direction: column; min-width: 0;
}
.aig-peek-card .modal-head { margin-bottom: 10px; }
.aig-peek-body { min-height: 0; display: flex; justify-content: center; }
.aig-peek__img {
  max-width: 100%; max-height: calc(92vh - 130px);
  border-radius: 10px; display: block; margin: 0 auto;
}

/* 窄屏：尺寸卡两列铺开；渠道/模型下拉收窄，给输入框留出行宽 */
@media (max-width: 640px) {
  .aig-size { flex: 1 1 calc(50% - 5px); min-width: 0; }
  .aig-sel { max-width: 116px; }
  .aig-sel--model { max-width: 156px; font-size: 12px; }
  .top-note { max-width: 52%; font-size: 11px; letter-spacing: 0; }
}

/* ── 快速建议 · 品类热词预览（2026-11-07 专业化升级）────────────── */
.hotword-peek { margin-top: 10px; padding: 12px 14px; border: 1px dashed var(--line);
  border-radius: var(--r-md); background: var(--cream-2); }
.hotword-peek__head { font-size: 12.5px; font-weight: 600; color: var(--text-2);
  margin-bottom: 8px; }
.hotword-peek__list { display: flex; flex-wrap: wrap; gap: 6px; }
.hotword-peek__hint { margin: 8px 0 0; font-size: 12px; color: var(--text-3); line-height: 1.6; }
.hw-chip { display: inline-flex; align-items: baseline; gap: 5px; padding: 3px 9px;
  background: #fff; border: 1px solid var(--line); border-radius: 999px; font-size: 12px; }
.hw-chip b { font-weight: 600; color: var(--text); }
.hw-chip i { font-style: normal; color: var(--text-3); font-size: 11px; }
.hw-chip em { font-style: normal; font-weight: 600; font-size: 11px; }
/* 排名上升=利好（绿）／下降=预警（红）：这里表达的是「名次变化」，不是股价 */
.hw-chip em.is-up { color: #1F7A4D; }
.hw-chip em.is-down { color: #B3261E; }

/* ── 快速建议 · Markdown 报告（2026-11-07 流式）────────────────── */
.quick-md { font-size: 14px; line-height: 1.78; color: var(--text); }
.quick-md.is-streaming::after { content: '▋'; margin-left: 2px; color: var(--teal);
  animation: mdBlink 1s steps(2) infinite; }
@keyframes mdBlink { 0%, 50% { opacity: 1; } 51%, 100% { opacity: 0; } }
.quick-md .md-h { font-size: 15.5px; font-weight: 700; color: var(--text);
  margin: 18px 0 8px; padding-left: 10px; border-left: 3px solid var(--teal); }
.quick-md .md-h:first-child { margin-top: 4px; }
.quick-md .md-p { margin: 0 0 8px; }
.quick-md .md-li { margin: 0 0 5px; padding-left: 6px; }
.quick-md .md-quote { margin: 0 0 8px; padding: 6px 10px; border-left: 2px solid var(--line);
  color: var(--text-2); background: var(--cream-2); border-radius: 0 6px 6px 0; }
.quick-md code { padding: 1px 5px; background: var(--cream-2); border-radius: 4px;
  font-size: 12.5px; }
.quick-md .md-table-wrap { overflow-x: auto; margin: 6px 0 12px; }
.quick-md .md-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.quick-md .md-table th, .quick-md .md-table td { border: 1px solid var(--line);
  padding: 7px 10px; text-align: left; vertical-align: top; }
.quick-md .md-table th { background: var(--cream-2); font-weight: 600; white-space: nowrap; }
.quick-md .md-table tbody tr:nth-child(even) { background: #FCFCFB; }

/* ── 快速建议 · 报告增强（2026-11-08 P1/P2）：指标条 / 季节 / 趋势 / 导航 ── */
.qmetric { display: flex; flex-wrap: wrap; gap: 10px; margin: 12px 0 14px; }
.qmetric__item { flex: 1 1 118px; padding: 10px 12px; background: var(--cream-2);
  border: 1px solid var(--line); border-radius: var(--r-md); }
.qmetric__item i { display: block; font-style: normal; font-size: 12px;
  color: var(--text-3); margin-bottom: 3px; }
.qmetric__item b { font-size: 17px; font-weight: 700; color: var(--text); }
.qmetric__item.is-ok b { color: #1F7A4D; }
.qmetric__item.is-bad b { color: #B3261E; }
.qmetric__item.is-warn b { color: #8A5A12; }

.qseason { display: flex; flex-wrap: wrap; align-items: center; gap: 6px;
  margin: 0 0 12px; font-size: 12.5px; color: var(--text-2); }
.qseason b { font-weight: 600; margin-right: 2px; }
.qseason__chip { padding: 3px 9px; background: #FFF4E5; border: 1px solid #F3D9B0;
  border-radius: 999px; color: #8A5A12; font-size: 12px; }

.qtrend { display: flex; flex-wrap: wrap; gap: 12px; margin: 0 0 12px; }
.qtrend__item { display: inline-flex; align-items: center; gap: 8px; padding: 6px 10px;
  border: 1px solid var(--line); border-radius: var(--r-md); background: #fff; font-size: 12.5px; }
.qtrend__item b { font-weight: 600; color: var(--text); }
.qtrend__item em { font-style: normal; color: var(--text-3); }
.qtrend__item em.is-up { color: #1F7A4D; }
.qtrend__item em.is-down { color: #B3261E; }
.qtrend__spark { color: var(--teal); flex: none; }

.quick-nav { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 10px; }
.quick-nav__btn { padding: 4px 11px; font-size: 12.5px; border: 1px solid var(--line);
  border-radius: 999px; background: #fff; color: var(--text-2); cursor: pointer;
  font-family: inherit; }
.quick-nav__btn:hover { border-color: var(--teal); color: var(--teal-deep); }

.md-table-wrap { position: relative; }
.md-table__copy { position: absolute; top: 4px; right: 4px; padding: 2px 8px;
  font-size: 11.5px; border: 1px solid var(--line); border-radius: 6px;
  background: #fff; color: var(--text-3); cursor: pointer; font-family: inherit; }
.md-table__copy:hover { color: var(--teal-deep); border-color: var(--teal); }

/* ── 快速建议 · 联网调研阶段（2026-11-08）──────────────────────── */
.qstage { margin: 0 0 12px; padding: 10px 14px; border: 1px solid var(--line);
  border-radius: var(--r-md); background: #fff; font-size: 13px; color: var(--text-2); }
.qstage.is-busy { display: flex; align-items: center; gap: 8px;
  background: var(--cream-2); color: var(--text-3); }
.qstage summary { cursor: pointer; font-weight: 600; color: var(--text-2); font-size: 13px; }
.qstage summary::-webkit-details-marker { color: var(--teal); }
.qstage__body { margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--line);
  font-size: 13px; line-height: 1.7; max-height: 340px; overflow-y: auto; }
.qstage__body .md-p { margin: 0 0 6px; }