/* =====================================================
   CECPS AI 助手 v2.1 Polish 层
   叠加在 v2-enhancements.css 之上，做视觉与微交互打磨
   对应 review 中 1–18 + 20 项
   ===================================================== */

/* ───── (1) 项目图标：单字时收紧字号、加微妙 inset 边 ───── */
.sb-proj-icon,
.proj-hero-icon,
.proj-modal-preview-icon,
.pm-name-icon {
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.10), inset 0 -1px 0 rgba(0,0,0,0.06);
}
/* 字号 + 紧凑字间距：让 2 个汉字在 24×24 圆角块里横排不换行，
   视觉上和 hero 48×48 + font 19px 完全等比缩放（24/48 = 11/22≈0.5） */
.sb-proj-icon { font-size: 11px; font-weight: 600; letter-spacing: -0.1em; white-space: nowrap; line-height: 1; }
.sb-proj-icon svg { stroke-width: 1.7; }
.proj-hero-icon { font-size: 22px; font-weight: 600; letter-spacing: -0.05em; white-space: nowrap; line-height: 1; }
html[data-theme="dark"] .sb-proj-icon,
html[data-theme="dark"] .proj-hero-icon,
html[data-theme="dark"] .pm-name-icon { box-shadow: inset 0 0 0 1px rgba(255,255,255,0.06); }

/* ───── (4) 侧栏 padding 加宽，行高更舒展 ───── */
.sb-section { padding: 4px 14px; }
.sb-section-head { padding: 6px 8px 4px; }
.sb-child-row { padding: 6px 10px; line-height: 1.4; }

/* ───── (NEW) 侧栏 hover/active 整理 ───── */
.sb-child-row { border-radius: 6px; margin-right: 2px; }
.sb-child-row:hover { background: var(--hover); color: var(--text); }
.sb-child-row.active,
.sb-child-row.active:hover {
  background: var(--ink-soft);
  color: var(--ink);
  font-weight: 500;
}
.sb-session-row { border-radius: 6px; transition: background 120ms; }
.sb-session-row:hover { background: var(--hover); }
.sb-session-item:hover { background: transparent !important; }
.sb-session-row .sb-session-item.active,
.sb-session-row .sb-session-item.active:hover {
  background: var(--ink-soft) !important;
  color: var(--ink) !important;
}

/* ───── (5) 项目页 hero 收紧上下空白 ───── */
.proj-hero { padding: 36px 48px 22px; gap: 18px; }
.proj-hero-icon { width: 48px; height: 48px; border-radius: 12px; }
.proj-hero-name { font-size: 22px; margin-bottom: 4px; }
.proj-hero-desc { font-size: 12.5px; line-height: 1.55; }
.proj-body { padding: 22px 48px 88px; gap: 22px; }

/* ───── (6) 三栏 sticky 列高度修正 ───── */

/* ───── (7) 项目色：14 色现代柔和色板（参考 Notion/Linear 配色） ─────
   pc-9 原本是纯白（视觉上空心 bug），改成奶茶暖灰，更易识别。 */
.pc-1  { background: #4f9b6e; }  /* 森绿 */
.pc-2  { background: #c07a3a; }  /* 焦糖 */
.pc-3  { background: #4374ad; }  /* 海蓝 */
.pc-4  { background: #8c5fb0; }  /* 紫罗兰 */
.pc-5  { background: #b95068; }  /* 玫红 */
.pc-6  { background: #5e6253; }  /* 橄榄灰 */
.pc-7  { background: #c79c66; color: #2a1f10; }  /* 沙金 */
.pc-8  { background: #4f7c7e; }  /* 鸭青 */
.pc-9  { background: #a08368; }  /* 奶茶（原白色 → 暖灰，修视觉空心 bug） */
.pc-10 { background: #1d1d1d; }  /* 墨黑 */
.pc-11 { background: #4d8aa6; }  /* 雾蓝 */
.pc-12 { background: #d68a8a; }  /* 樱粉 */
.pc-13 { background: #6fa57e; }  /* 薄荷 */
.pc-14 { background: #8a8a8a; }  /* 中性灰 */
.pm-color::after,
.pm-color.pc-1::after  { background: #4f9b6e; }
.pm-color.pc-2::after  { background: #c07a3a; }
.pm-color.pc-3::after  { background: #4374ad; }
.pm-color.pc-4::after  { background: #8c5fb0; }
.pm-color.pc-5::after  { background: #b95068; }
.pm-color.pc-6::after  { background: #5e6253; }
.pm-color.pc-7::after  { background: #c79c66; }
.pm-color.pc-8::after  { background: #4f7c7e; }
.pm-color.pc-9::after  { background: #a08368; }
.pm-color.pc-10::after { background: #1d1d1d; }
.pm-color.pc-11::after { background: #4d8aa6; }
.pm-color.pc-12::after { background: #d68a8a; }
.pm-color.pc-13::after { background: #6fa57e; }
.pm-color.pc-14::after { background: #8a8a8a; }

/* ── 预设角色芯片：4 个常用角色（研究专家 / 资深文案编辑 / ...），
   点击把对应预设文本填入项目提示词框。视觉上对齐 AI 润色按钮的克制感。 */
.prompt-preset-row {
  display: flex; flex-wrap: wrap; gap: 6px;
  padding: 6px 4px 4px;
}
.prompt-preset-chip {
  display: inline-flex; align-items: center; gap: 2px;
  padding: 4px 10px;
  font-size: 12px; line-height: 1.4;
  color: var(--text-3);
  background: var(--card-bg, transparent);
  border: 1px solid var(--border-soft, rgba(0,0,0,0.08));
  border-radius: 14px;
  cursor: pointer;
  transition: background 120ms, color 120ms, border-color 120ms;
  user-select: none;
}
.prompt-preset-chip:hover {
  background: var(--hover, rgba(0,0,0,0.04));
  color: var(--text);
  border-color: var(--ink, rgba(0,0,0,0.4));
}
.prompt-preset-chip .prompt-preset-hash {
  color: var(--text-5);
  margin-right: 2px;
}
html[data-theme="dark"] .prompt-preset-chip:hover { color: var(--ink); }

/* ───── (8) AI 润色按钮 hover 收敛 ───── */
.proj-prompt-polish:hover {
  background: var(--card-bg);
  color: var(--ink);
  border-color: var(--ink);
  box-shadow: 0 0 0 3px var(--ink-softer);
}
.proj-prompt-polish:hover svg { color: var(--ink); }
html[data-theme="dark"] .proj-prompt-polish:hover { color: var(--ink); }
html[data-theme="dark"] .proj-prompt-polish:hover svg { color: var(--ink); }

/* ───── (9) 侧栏 active：项目级 vs 子对话级 区分 ─────
   重做：参考 Claude.ai / ChatGPT / Linear / Notion 侧栏选中态——
   **整块浅底色高亮 + 6px 圆角**，不加左侧描边条，不给 icon 加 outline。
   选中色用 --hover 之上更明显一档的 --hover-strong（fallback rgba 4%）。
   选中态 name 字号字重不变，仅 color 加深到 --text 突出。 */
.sb-proj-row:not(.active):hover,
.sb-proj-row.expanded:not(.active):hover {
  background: var(--hover) !important;
  color: var(--text) !important;
}
.sb-proj-row.active,
.sb-proj-row.active:hover {
  background: var(--hover-strong, rgba(0, 0, 0, 0.06));
  color: var(--text);
  border-radius: 6px;
  box-shadow: none;
}
/* 视觉互斥：子对话被 hover 或 active 时，父项目 active 底色让位，
   避免"父+子同时高亮"双重视觉竞争（用户在 chat-in-project 下的常见困惑）。
   :has() chrome 105+ / safari 15.4+ / firefox 121+，2026 年生产环境已普及。 */
.sb-proj-row.active:has(+ .sb-proj-children .sb-child-row:hover),
.sb-proj-row.active:has(+ .sb-proj-children .sb-child-row.active) {
  background: transparent;
}
.sb-proj-row.active .sb-proj-name {
  color: var(--text);
  font-weight: 500;
}
/* 选中态不再给 icon 加描边（之前的 outline 看起来重复 + 偏脏） */
.sb-proj-row.active .sb-proj-icon {
  outline: none;
}
html[data-theme="dark"] .sb-proj-row.active,
html[data-theme="dark"] .sb-proj-row.active:hover {
  background: rgba(255, 255, 255, 0.08);
}

/* 子对话保留 ink-soft 软底 */
.sb-child-row.active {
  background: var(--ink-soft);
  color: var(--ink);
  font-weight: 500;
}

/* ───── (11) 文件类型图标：线性文档轮廓 + 角标色 ───── */
.proj-file-icon,
.atpicker-icon,
.pcc-dot {
  position: relative;
  background: var(--card-bg) !important;
  color: var(--text-3) !important;
  border: 1px solid var(--border);
  border-radius: 4px;
  overflow: visible;
  box-shadow: none;
}
.proj-file-icon { width: 30px; height: 36px; padding: 0; align-items: flex-end; justify-content: center; padding-bottom: 4px; font-size: 8.5px; font-weight: 700; letter-spacing: 0.01em; }
.proj-file-icon::before {
  content: ""; position: absolute;
  top: 0; right: 0;
  width: 9px; height: 9px;
  border-bottom: 1px solid var(--border);
  border-left: 1px solid var(--border);
  background: var(--sidebar-bg);
  border-radius: 0 3px 0 4px;
}
.proj-file-icon::after {
  content: ""; position: absolute;
  left: 4px; right: 4px; top: 4px; height: 2px;
  border-top: 1px solid currentColor;
  opacity: 0.32;
  box-shadow: 0 4px 0 -1px currentColor, 0 8px 0 -1px currentColor;
}
/* 类型色作为左下角彩色条 */
.proj-file-icon.ft-pdf  { color: #c14a35; border-color: rgba(193,74,53,0.28); }
.proj-file-icon.ft-doc,
.proj-file-icon.ft-docx { color: #2f6db8; border-color: rgba(47,109,184,0.26); }
.proj-file-icon.ft-xls,
.proj-file-icon.ft-xlsx { color: #2f7d52; border-color: rgba(47,125,82,0.28); }
.proj-file-icon.ft-ppt,
.proj-file-icon.ft-pptx { color: #c45e2c; border-color: rgba(196,94,44,0.26); }
.proj-file-icon.ft-txt,
.proj-file-icon.ft-md   { color: #555; }
.proj-file-icon.ft-png,
.proj-file-icon.ft-jpg  { color: #7a4eb0; border-color: rgba(122,78,176,0.26); }
html[data-theme="dark"] .proj-file-icon::before { background: var(--card-bg-2, #14171a); }

/* atpicker / 输入框 chip dot 改为小圆点 */
.atpicker-icon { width: 22px; height: 26px; font-size: 7.5px; padding-bottom: 3px; }
.pcc-dot { width: 8px !important; height: 8px !important; border-radius: 50% !important; padding: 0 !important; border: none !important; }
.pcc-dot.ft-pdf  { background: #c14a35 !important; }
.pcc-dot.ft-doc, .pcc-dot.ft-docx { background: #2f6db8 !important; }
.pcc-dot.ft-xls, .pcc-dot.ft-xlsx { background: #2f7d52 !important; }
.pcc-dot.ft-ppt, .pcc-dot.ft-pptx { background: #c45e2c !important; }
.pcc-dot.ft-md, .pcc-dot.ft-txt { background: #888 !important; }
.pcc-dot.ft-png, .pcc-dot.ft-jpg { background: #7a4eb0 !important; }

/* ───── (12) @picker 入场动画 ───── */
.atpicker {
  transform: translateY(4px);
  opacity: 0;
  pointer-events: none;
  transition: transform 140ms var(--ease, cubic-bezier(.2,.8,.2,1)), opacity 120ms;
}
.atpicker.open {
  transform: translateY(0);
  opacity: 1;
  pointer-events: auto;
}

/* ───── (13) Tweaks 分段控件 hover 反馈 ───── */
#cecpsTweaks .tw-seg button:not(.active):hover {
  background: rgba(0,0,0,0.04);
  color: var(--text);
}
html[data-theme="dark"] #cecpsTweaks .tw-seg button:not(.active):hover {
  background: rgba(255,255,255,0.05);
}

/* ───── (15) 子对话列表平滑展开 ───── */
.sb-proj-children {
  display: flex !important;
  overflow: hidden;
  max-height: 0;
  opacity: 0;
  padding-top: 0;
  padding-bottom: 0;
  margin-bottom: 0;
  border-left: 1px solid transparent;
  transition:
    max-height 220ms var(--ease, cubic-bezier(.2,.8,.2,1)),
    opacity 160ms ease,
    padding 160ms ease,
    border-color 200ms ease;
}
.sb-proj-row.expanded + .sb-proj-children {
  max-height: 800px;
  opacity: 1;
  padding: 2px 0 4px 18px;
  margin-bottom: 2px;
  border-left-color: var(--border-soft);
}

/* B7 子对话进场 stagger：每行 30ms 延迟 + 上滑+淡入，160ms */
@keyframes sbChildEnter {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: translateY(0); }
}
.sb-proj-row.expanded + .sb-proj-children .sb-child-row,
.sb-proj-row.expanded + .sb-proj-children .sb-child-more,
.sb-proj-row.expanded + .sb-proj-children .sb-child-empty {
  animation: sbChildEnter 160ms var(--ease) both;
}
.sb-proj-row.expanded + .sb-proj-children .sb-child-row:nth-child(1) { animation-delay: 0ms; }
.sb-proj-row.expanded + .sb-proj-children .sb-child-row:nth-child(2) { animation-delay: 30ms; }
.sb-proj-row.expanded + .sb-proj-children .sb-child-row:nth-child(3) { animation-delay: 60ms; }
.sb-proj-row.expanded + .sb-proj-children .sb-child-more { animation-delay: 90ms; }

/* ───── (16) AI 润色 loading + 流式动效 ───── */
/* 按钮：呼吸光晕 + 内嵌 sparkles 旋转。
   配色用 --ink + --green-accent，与全局视觉密度对齐（按钮 24-32px）。 */
.proj-prompt-polish.loading {
  pointer-events: none;
  position: relative;
  background: linear-gradient(135deg,
              color-mix(in srgb, var(--ink) 5%, var(--card-bg)) 0%,
              var(--card-bg) 100%);
  color: var(--ink);
  border-color: color-mix(in srgb, var(--ink) 22%, transparent);
  animation: polishBreathe 1.6s ease-in-out infinite;
}
.proj-prompt-polish.loading svg {
  color: var(--green-accent);
  animation: polishSparkleSpin 2.2s linear infinite;
  transform-origin: 50% 50%;
}
@keyframes polishBreathe {
  0%, 100% { box-shadow: 0 0 0 0   color-mix(in srgb, var(--ink) 26%, transparent); }
  50%      { box-shadow: 0 0 0 6px color-mix(in srgb, var(--ink)  0%, transparent); }
}
@keyframes polishSparkleSpin {
  0%   { transform: rotate(0deg)   scale(1); }
  50%  { transform: rotate(180deg) scale(1.18); }
  100% { transform: rotate(360deg) scale(1); }
}

/* 输入框：原文字本身做 shimmer —— 业界标准 AI 生成态做法
   （ChatGPT/shadcn/motion-primitives/prompt-kit 皆同款）：
   linear-gradient + background-clip: text + color: transparent，
   动画移动 background-position 让"高亮带"沿文字扫过。
   注意：必须用 !important —— line 1093 的 .proj-section-prompt
   .proj-prompt 用了 !important 覆盖 background/color，本规则要赢
   过去得跟着用。 */
.proj-section-prompt .proj-prompt.polish-active {
  position: relative;
  isolation: isolate;
}
.proj-section-prompt .proj-prompt.polish-active::before {
  content: "";
  position: absolute;
  z-index: 2;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  border-radius: 10px;
  pointer-events: none;
  background:
    linear-gradient(
      100deg,
      transparent 0%,
      transparent 28%,
      color-mix(in srgb, var(--green-accent) 10%, transparent) 38%,
      rgba(255,255,255,0.72) 48%,
      color-mix(in srgb, #c9a96e 30%, transparent) 56%,
      transparent 68%,
      transparent 100%
    );
  background-size: 260% 100%;
  mix-blend-mode: screen;
  opacity: 0.95;
  animation: polishSweep 1.35s cubic-bezier(.42,0,.18,1) infinite;
}
.proj-section-prompt .proj-prompt.polish-active::after {
  content: "";
  position: absolute;
  z-index: 1;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  border-radius: 10px;
  pointer-events: none;
  box-shadow:
    inset 0 0 0 1px color-mix(in srgb, var(--green-accent) 20%, transparent),
    0 0 24px color-mix(in srgb, var(--green-accent) 12%, transparent);
  opacity: 0.75;
  animation: polishAura 1.8s ease-in-out infinite;
}
.proj-section-prompt .proj-prompt.polish-running {
  position: relative;
  z-index: 0;
  caret-color: transparent;
  background-image: linear-gradient(
    100deg,
    var(--text-4) 0%,
    var(--text-4) 30%,
    var(--text) 43%,
    var(--green-accent) 50%,
    #c9a96e 57%,
    var(--text-2) 66%,
    var(--text-4) 100%
  ) !important;
  background-color: rgba(201, 169, 110, 0.035) !important;
  background-size: 260% 100% !important;
  background-clip: text !important;
  -webkit-background-clip: text !important;
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  text-shadow: 0 0 18px color-mix(in srgb, var(--green-accent) 14%, transparent);
  animation: polishTextShimmer 1.35s cubic-bezier(.42,0,.18,1) infinite;
}
@keyframes polishSweep {
  0%   { background-position: 145% 0; transform: translateX(-4%); }
  100% { background-position: -145% 0; transform: translateX(4%); }
}
@keyframes polishTextShimmer {
  0%   { background-position: 145% 0; }
  100% { background-position: -145% 0; }
}
@keyframes polishAura {
  0%, 100% { opacity: 0.48; }
  50%      { opacity: 0.9; }
}
/* dark mode：基色仍为 --text-5，高亮带换成 --green-accent 显眼 */
html[data-theme="dark"] .proj-section-prompt .proj-prompt.polish-running {
  background-image: linear-gradient(
    100deg,
    var(--text-4) 0%,
    var(--text-4) 30%,
    var(--text) 43%,
    var(--green-accent) 50%,
    #d9b777 57%,
    var(--text-2) 66%,
    var(--text-4) 100%
  ) !important;
}

/* 完成瞬间：整段新文本一瞬间替换原文，配合淡入 + 微上浮 + 绿光散开
   （由 JS 在 textContent 替换后挂上 .polish-replace，700ms 后移除） */
.proj-prompt.polish-replace {
  animation:
    polishReplaceIn 380ms cubic-bezier(0.25, 1, 0.5, 1) both,
    polishGlow 900ms ease-out both;
}
@keyframes polishReplaceIn {
  0%   { opacity: 0; transform: translateY(8px); filter: blur(4px); }
  100% { opacity: 1; transform: translateY(0);   filter: blur(0); }
}
@keyframes polishGlow {
  0% {
    box-shadow:
      0 0 0 0 color-mix(in srgb, var(--green-accent) 45%, transparent),
      inset 0 0 0 1px color-mix(in srgb, #c9a96e 35%, transparent);
  }
  55% {
    box-shadow:
      0 0 0 10px color-mix(in srgb, var(--green-accent) 12%, transparent),
      inset 0 0 0 1px color-mix(in srgb, var(--green-accent) 20%, transparent);
  }
  100% {
    box-shadow:
      0 0 0 0 color-mix(in srgb, var(--green-accent) 0%, transparent),
      inset 0 0 0 1px transparent;
  }
}

/* 字符级 diff 高亮：润色后新增的字符段用淡绿底标出来，2.4s 内逐渐淡出，
   让用户一眼看到模型改了哪几处而不是盯着整段感觉"好像没变"。 */
.proj-prompt .polish-diff-add {
  background-color: color-mix(in srgb, var(--green-accent) 26%, transparent);
  border-radius: 3px;
  padding: 1px 2px;
  margin: 0 -1px;
  animation: polishDiffFade 2400ms ease-out forwards;
}
html[data-theme="dark"] .proj-prompt .polish-diff-add {
  background-color: color-mix(in srgb, var(--green-accent) 32%, transparent);
}
@keyframes polishDiffFade {
  0%, 55% { background-color: color-mix(in srgb, var(--green-accent) 26%, transparent); }
  100%    { background-color: transparent; }
}

/* 用户在偏好"减少动画"时，全部退化为不动 */
@media (prefers-reduced-motion: reduce) {
  .proj-prompt-polish.loading,
  .proj-prompt-polish.loading svg,
  .proj-section-prompt .proj-prompt.polish-active::before,
  .proj-section-prompt .proj-prompt.polish-active::after,
  .proj-prompt.polish-running,
  .proj-prompt.polish-replace,
  .proj-prompt .polish-diff-add {
    animation: none !important;
  }
}

/* ───── (18) 上传区 drag-over 反馈 ───── */
.proj-file-upload.dragover,
.proj-side-upload.dragover {
  background: var(--ink-softer);
  border-color: var(--ink) !important;
  border-style: solid !important;
  color: var(--ink);
  transform: scale(1.005);
}
.proj-file-upload { transition: all 160ms; }

/* 上传区两行文案：主提示 + 副提示（点击 / 拖拽 / 粘贴 三种入口都能用）。
   外层 .proj-file-upload 是 flex row（icon 左、文案右），用一个内层 column
   flex 容器把两行文案竖排，避免被父 flex 横向挤压换行。 */
.proj-file-upload .proj-file-upload-text {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  line-height: 1.3;
  min-width: 0;
  white-space: nowrap;
}
.proj-file-upload .proj-file-upload-main {
  font-size: 13px;
  font-weight: 500;
  color: inherit;
}
.proj-file-upload .proj-file-upload-hint {
  font-size: 11.5px;
  color: var(--text-muted, rgba(0, 0, 0, 0.42));
}
html[data-theme="dark"] .proj-file-upload .proj-file-upload-hint {
  color: rgba(255, 255, 255, 0.5);
}

/* ───── 上传中占位卡（Bug 1 进度反馈） ───── */
.proj-file-card.proj-file-card--uploading {
  position: relative;
  opacity: 0.92;
}
.proj-file-card.proj-file-card--uploading .proj-file-icon {
  opacity: 0.6;
}
.proj-file-card.proj-file-card--uploading .proj-file-upload-sub {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 6px;
  font-size: 11.5px;
  color: var(--text-muted, rgba(0, 0, 0, 0.5));
}
.proj-file-card.proj-file-card--uploading .proj-file-upload-pct {
  font-variant-numeric: tabular-nums;
  font-weight: 500;
  color: var(--text);
}
.proj-file-card.proj-file-card--uploading .proj-file-upload-bar {
  height: 3px;
  border-radius: 2px;
  background: rgba(0, 0, 0, 0.06);
  overflow: hidden;
  margin-top: 6px;
}
.proj-file-card.proj-file-card--uploading .proj-file-upload-bar-fill {
  height: 100%;
  width: 0;
  background: var(--accent, #1f7a3f);
  border-radius: 2px;
  transition: width 160ms ease-out;
}
.proj-file-card.proj-file-card--uploading .proj-file-upload-cancel {
  position: absolute;
  top: 6px;
  right: 6px;
  width: 22px;
  height: 22px;
  border: 0;
  background: transparent;
  color: var(--text-muted, rgba(0, 0, 0, 0.4));
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background 120ms, color 120ms;
}
.proj-file-card.proj-file-card--uploading .proj-file-upload-cancel:hover {
  background: rgba(0, 0, 0, 0.06);
  color: var(--text);
}
.proj-file-card.proj-file-card--uploading.is-failed .proj-file-upload-bar-fill {
  background: var(--danger, #c14343);
}
.proj-file-card.proj-file-card--uploading.is-failed .proj-file-upload-label {
  color: var(--danger, #c14343);
}
html[data-theme="dark"] .proj-file-card.proj-file-card--uploading .proj-file-upload-bar {
  background: rgba(255, 255, 255, 0.08);
}
html[data-theme="dark"] .proj-file-card.proj-file-card--uploading .proj-file-upload-cancel {
  color: rgba(255, 255, 255, 0.5);
}
html[data-theme="dark"] .proj-file-card.proj-file-card--uploading .proj-file-upload-cancel:hover {
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
}

/* ───── (20) 概览模式：资料默认折叠（项目内对话上移） ───── */

/* ───── (2)(3) 欢迎页 hero + 快捷入口 ───── */
.welcome-v21 {
  width: 100%;
  max-width: 760px;
  margin: 18px auto 0;
  display: none;
  flex-direction: column;
  gap: 18px;
}
body[data-welcome-v21="1"] .welcome-v21 { display: flex; }
/* 葡西语滚动问候保留：放在 hero 上方，间距收一点 */
body[data-welcome-v21="1"] .welcome-tagline { margin-bottom: 4px; }

.wv21-hero {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 18px 20px;
  border-radius: 14px;
  background: linear-gradient(135deg, var(--ink-softer) 0%, var(--card-bg) 60%);
  border: 1px solid var(--border-soft);
  cursor: pointer;
  transition: all 160ms;
  text-align: left;
  font-family: inherit;
}
.wv21-hero:hover {
  border-color: var(--ink);
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(0,0,0,0.04);
}
.wv21-hero-icon {
  width: 42px; height: 42px;
  border-radius: 11px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  background: var(--ink);
  color: white;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.10);
}
html[data-theme="dark"] .wv21-hero-icon { color: #14171a; }
.wv21-hero-meta { flex: 1; min-width: 0; }
.wv21-hero-eyebrow {
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink);
  margin-bottom: 4px;
}
.wv21-hero-title {
  font-size: 15px;
  font-weight: 600;
  color: var(--text);
  margin-bottom: 3px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.wv21-hero-sub {
  font-size: 12px;
  color: var(--text-3);
  display: flex;
  gap: 8px;
  align-items: center;
}
.wv21-hero-sub .dot { width: 2px; height: 2px; border-radius: 50%; background: var(--text-5); }
.wv21-hero-arrow { color: var(--text-4); flex-shrink: 0; transition: transform 160ms; }
.wv21-hero:hover .wv21-hero-arrow { transform: translateX(3px); color: var(--ink); }

.wv21-section-h {
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-4);
  margin: 6px 4px 4px;
}

.wv21-projects {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}
.wv21-proj {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 12px;
  border-radius: 10px;
  border: 1px solid var(--border-soft);
  background: var(--card-bg);
  cursor: pointer;
  transition: all 140ms;
  font-family: inherit;
  text-align: left;
}
.wv21-proj:hover { border-color: var(--ink); transform: translateY(-1px); }
.wv21-proj-icon {
  width: 26px; height: 26px;
  border-radius: 7px;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-size: 11px;
  font-weight: 600;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.10);
}
.wv21-proj-meta { flex: 1; min-width: 0; }
.wv21-proj-name {
  font-size: 12.5px;
  font-weight: 500;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.wv21-proj-count {
  font-size: 10.5px;
  color: var(--text-4);
  margin-top: 1px;
}

.wv21-chips {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.wv21-chip {
  padding: 6px 11px;
  font-size: 12px;
  border-radius: 999px;
  border: 1px solid var(--border-soft);
  background: var(--card-bg);
  color: var(--text-2);
  cursor: pointer;
  transition: all 140ms;
  font-family: inherit;
}
.wv21-chip:hover {
  border-color: var(--ink);
  color: var(--ink);
  background: var(--ink-softer);
}

.wv21-greet-row {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 2px;
}
.wv21-greet-row h1 {
  font-size: 28px;
  font-weight: 600;
  letter-spacing: -0.01em;
  margin: 0;
  color: var(--text);
}
.wv21-greet-row .wv21-tag-pt {
  font-size: 12.5px;
  color: var(--text-4);
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

/* ═══════ v2.1.1 项目页改造 ═══════ */

/* 项目内对话列表：限高滚动，避免无限堆叠 */
.proj-chat-list-wrap {
  position: relative;
  max-height: 380px;
  overflow-y: auto;
  border-radius: 10px;
  scrollbar-width: thin;
  scrollbar-color: var(--text-5) transparent;
  mask-image: linear-gradient(180deg, transparent 0, #000 12px, #000 calc(100% - 18px), transparent 100%);
  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 12px, #000 calc(100% - 18px), transparent 100%);
  padding: 6px 2px 12px;
}
.proj-chat-list-wrap::-webkit-scrollbar { width: 6px; }
.proj-chat-list-wrap::-webkit-scrollbar-thumb { background: var(--text-5); border-radius: 3px; }
.proj-chat-list-wrap::-webkit-scrollbar-track { background: transparent; }

/* 三栏布局下的中间列改造：composer 直接落地 */

/* project 视图：隐藏欢迎页和消息区 */
body[data-view="project"] #welcomeScreen,
body[data-view="project"] #messages { display: none !important; }

/* #cecpsProjView 默认隐藏，project 视图时由 project.css 后面的规则显示。
   入场过渡由 main.css 的 viewFadeIn animation 接管（D3）。 */
#cecpsProjView { display: none; }
/* 整页拖拽态：dragover 时整张表盖一层柔和的虚线提示，告诉用户
   "松手就把这些文件上传到本项目资料"。不影响子元素交互。 */
#cecpsProjView.is-dragover { position: relative; }
#cecpsProjView.is-dragover::before {
  content: "松开即上传到此项目资料";
  position: absolute; inset: 8px;
  display: flex; align-items: center; justify-content: center;
  font-size: 14px; font-weight: 500; color: var(--ink);
  background: var(--ink-soft);
  border: 2px dashed var(--ink);
  border-radius: 16px;
  z-index: 40;
  pointer-events: none;
  letter-spacing: 0.02em;
}

/* 项目页 / chat-in-project 视图下：复用主 composer，保持原样（flex+center） */
body[data-view="project"] footer.composer,
body[data-view="project"] .composer,
body[data-view="project"] .composer-wrap,
body[data-view="project"] #composerWrap,
body[data-view="chat-in-project"] footer.composer {
  display: flex !important;
}
/* 三栏模式下隐藏所有 "在此项目开启对话" 入口 —— 主 composer 直接接管 */
/* 隐藏提示条：composer 保持原位、原样，不加任何额外修饰 */
.proj-composer-hint { display: none !important; }

/* chat-in-project 视图：彻底移除 composer 周围的额外 chrome（用户不要这些） */
body[data-view="chat-in-project"] .proj-context-bar,
body[data-view="chat-in-project"] #projContextBar,
body[data-view="chat-in-project"] .proj-drawer,
body[data-view="chat-in-project"] .proj-right-panel,
body[data-view="chat-in-project"] .proj-breadcrumb,
body[data-view="chat-in-project"] #projBreadcrumb { display: none !important; }

/* chat-in-project 视图：右上角浮动 mini badge — 极轻、悬浮展开 */
/* 让 composer-inner 成为 cip-mini 的定位 anchor */
.composer-inner { position: relative; }
.cip-mini {
  position: absolute;
  bottom: calc(100% + 8px);
  left: 4px;
  top: auto;
  right: auto;
  z-index: 30;
  display: none;
  align-items: center;
  gap: 7px;
  padding: 4px 11px 4px 4px;
  font-size: 12px;
  color: var(--text-2);
  background: linear-gradient(180deg, var(--card-bg) 0%, rgba(31, 60, 51, 0.018) 100%);
  border: 1px solid rgba(15, 23, 42, 0.07);
  border-radius: 999px;
  box-shadow:
    0 1px 2px rgba(15, 23, 42, 0.04),
    0 4px 10px rgba(15, 23, 42, 0.04);
  cursor: pointer;
  transition: transform 140ms, border-color 140ms, box-shadow 140ms;
}
body[data-view="chat-in-project"] .cip-mini { display: inline-flex; }
.cip-mini:hover {
  color: var(--text);
  border-color: rgba(15, 23, 42, 0.12);
  box-shadow:
    0 2px 4px rgba(15, 23, 42, 0.06),
    0 8px 18px rgba(15, 23, 42, 0.08);
  transform: translateY(-0.5px);
}
.cip-mini .sb-proj-icon {
  width: 22px !important; height: 22px !important;
  font-size: 8px !important;
  letter-spacing: -0.06em !important;
  border-radius: 6px !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2);
}
.cip-mini-meta { display: inline-flex; align-items: center; gap: 6px; }
.cip-mini-name {
  font-weight: 600;
  color: var(--text);
  letter-spacing: 0.005em;
  white-space: nowrap;
}
.cip-mini-sep {
  color: var(--text-5);
  font-size: 11px;
  margin: 0 1px;
}
.cip-mini-tag {
  background: rgba(31, 60, 51, 0.05);
  color: var(--text-3);
  font-size: 11px;
  padding: 2px 8px;
  border-radius: 5px;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-weight: 500;
  letter-spacing: 0.005em;
  transition: background 120ms, color 120ms;
}
.cip-mini:hover .cip-mini-tag {
  background: rgba(31, 60, 51, 0.08);
  color: var(--text-2);
}
html[data-theme="dark"] .cip-mini {
  background: linear-gradient(180deg, var(--card-bg) 0%, rgba(255, 255, 255, 0.02) 100%);
  border-color: rgba(255, 255, 255, 0.08);
  box-shadow:
    0 1px 2px rgba(0, 0, 0, 0.30),
    0 4px 10px rgba(0, 0, 0, 0.18);
}
html[data-theme="dark"] .cip-mini:hover {
  border-color: rgba(255, 255, 255, 0.14);
}
html[data-theme="dark"] .cip-mini-tag { background: rgba(255, 255, 255, 0.05); }
html[data-theme="dark"] .cip-mini:hover .cip-mini-tag { background: rgba(255, 255, 255, 0.08); }

/* hover/click 展开的 popover —— 第十二轮视觉升级：双层柔和阴影、header 加重、
   file row hover 反馈、prompt 改 accent border-left。 */
.cip-pop {
  position: absolute;
  bottom: calc(100% + 38px);
  left: 4px;
  top: auto;
  right: auto;
  z-index: 31;
  width: 336px;
  background: var(--card-bg);
  border: 1px solid var(--border-soft);
  border-radius: 16px;
  box-shadow:
    0 24px 48px rgba(15, 23, 42, 0.10),
    0 6px 16px rgba(15, 23, 42, 0.06),
    0 1px 0 rgba(255, 255, 255, 0.6) inset;
  padding: 16px 18px 14px;
  font-size: 12.5px;
  color: var(--text-2);
  opacity: 0;
  transform: translateY(-4px) scale(0.98);
  pointer-events: none;
  transition: opacity 160ms ease, transform 160ms ease;
}
.cip-pop.open { opacity: 1; transform: translateY(0) scale(1); pointer-events: auto; }
.cip-pop-head {
  display: flex; align-items: center; gap: 11px;
  padding-bottom: 12px;
  margin-bottom: 12px;
  border-bottom: 1px solid var(--border-soft);
}
.cip-pop-head .sb-proj-icon {
  width: 32px !important; height: 32px !important;
  font-size: 13px !important; border-radius: 9px !important;
  flex-shrink: 0;
}
.cip-pop-head-meta { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.cip-pop-head-name {
  font-weight: 600; color: var(--text); font-size: 14px;
  letter-spacing: -0.005em;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.cip-pop-head-sub { color: var(--text-4); font-size: 11px; line-height: 1.4; }
.cip-pop-section-h {
  font-size: 10.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-4);
  margin: 10px 0 6px;
  font-weight: 600;
}
.cip-pop-files { display: flex; flex-direction: column; gap: 2px; margin: 0 -6px; }
.cip-pop-file {
  display: flex; align-items: center; gap: 9px;
  padding: 6px 8px; border-radius: 8px;
  font-size: 12px; color: var(--text-2);
  transition: background 120ms ease;
}
.cip-pop-file:hover { background: var(--hover); }
.cip-pop-file-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text); }
.cip-pop-file-size { color: var(--text-4); font-size: 10.5px; font-variant-numeric: tabular-nums; flex-shrink: 0; }
.cip-pop-file-icon {
  width: 24px; height: 24px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 6px;
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  font-size: 8.5px;
  font-weight: 700;
  letter-spacing: -0.02em;
  background: var(--hover);
  color: var(--text-3);
  flex-shrink: 0;
}
.cip-pop-prompt {
  background: linear-gradient(180deg, var(--hover) 0%, var(--card-bg) 100%);
  border-left: 2px solid var(--accent, #18a058);
  border-radius: 4px 9px 9px 4px;
  padding: 10px 12px;
  font-size: 12px;
  line-height: 1.6;
  color: var(--text-2);
  max-height: 132px;
  overflow-y: auto;
  white-space: pre-wrap;
  margin-top: 2px;
}
.cip-pop-empty { color: var(--text-5); font-style: italic; padding: 6px 0; font-size: 11.5px; }

/* ═══════ 旧 chat-in-project context-bar 装饰（已废弃，仅保留空规则） ═══════ */
/* 顶部 sticky 项目卡片：替代原来扁平的 chip 条 */
body[data-view="chat-in-project"] .proj-context-bar,
body[data-view="chat-in-project"] .proj-drawer {
  position: sticky;
  top: 8px;
  z-index: 12;
  margin: 8px 24px 12px;
  padding: 12px 16px;
  background: var(--card-bg);
  border: 1px solid var(--border-soft);
  border-radius: 14px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 4px 12px rgba(0,0,0,0.02);
  display: flex;
  align-items: center;
  gap: 12px;
}
body[data-view="chat-in-project"] .proj-context-bar::before {
  content: "";
  width: 3px;
  align-self: stretch;
  background: linear-gradient(180deg, var(--ink) 0%, var(--ink) 60%, transparent 100%);
  border-radius: 2px;
  margin-right: 2px;
}
body[data-view="chat-in-project"] .proj-context-label {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-size: 13.5px;
  color: var(--text);
  font-weight: 600;
  letter-spacing: 0;
  padding: 0;
  border: none;
  margin: 0;
}
body[data-view="chat-in-project"] .proj-context-label .sb-proj-icon {
  width: 26px !important; height: 26px !important;
  font-size: 11px !important;
  border-radius: 7px !important;
}
body[data-view="chat-in-project"] .proj-context-meta {
  display: flex; flex-direction: column; gap: 2px;
}
body[data-view="chat-in-project"] .proj-context-meta-sub {
  font-size: 11px; color: var(--text-4); font-weight: 400;
}
body[data-view="chat-in-project"] .proj-context-divider {
  width: 1px; height: 22px; background: var(--border-soft);
}
body[data-view="chat-in-project"] .proj-context-chips {
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap; flex: 1;
}
.proj-context-chip {
  background: transparent;
  color: var(--text-3);
  font-size: 11.5px;
  border-radius: 7px;
  padding: 4px 9px 4px 7px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  border: 1px solid var(--border-soft);
  transition: all 120ms;
  cursor: pointer;
}
.proj-context-chip:hover { background: var(--hover); color: var(--text); border-color: var(--border); }
.proj-context-chip svg { opacity: 0.65; }
body[data-view="chat-in-project"] .proj-context-actions {
  display: flex; align-items: center; gap: 6px;
}
body[data-view="chat-in-project"] .proj-context-actions button {
  background: transparent;
  border: 1px solid var(--border-soft);
  color: var(--text-3);
  border-radius: 8px;
  padding: 5px 10px;
  font-size: 11.5px;
  cursor: pointer;
  transition: all 120ms;
  display: inline-flex; align-items: center; gap: 5px;
}
body[data-view="chat-in-project"] .proj-context-actions button:hover {
  background: var(--hover); color: var(--text); border-color: var(--border);
}

/* 消息区在 chat-in-project 视图下加一点上方留白，让 sticky 条不挤压 */
body[data-view="chat-in-project"] #messages { padding-top: 4px; }

/* 隐藏旧的面包屑，避免和新 sticky 卡片重复 */
body[data-view="chat-in-project"] .proj-breadcrumb { display: none !important; }

/* ═══════ chat-in-project 视图打磨 ═══════ */

/* 项目上下文条：从一行 chip 改成更克制的卡片 */
body[data-view="chat-in-project"] .proj-context-bar {
  margin: 6px 24px 4px;
  padding: 8px 12px;
  background: var(--card-bg);
  border: 1px solid var(--border-soft);
  border-radius: 10px;
  gap: 10px;
}
body[data-view="chat-in-project"] .proj-context-label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 11.5px;
  color: var(--text-2);
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
  padding-right: 10px;
  border-right: 1px solid var(--border-soft);
  margin-right: 2px;
}
body[data-view="chat-in-project"] .proj-context-label .sb-proj-icon {
  width: 18px !important; height: 18px !important;
  font-size: 10px !important;
  border-radius: 5px !important;
}
.proj-context-chip {
  background: var(--hover);
  color: var(--text-2);
  font-size: 11.5px;
  border-radius: 6px;
  padding: 3px 9px 3px 7px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid transparent;
  transition: all 120ms;
}
.proj-context-chip:hover { border-color: var(--border); background: var(--card-bg); }

/* 项目内对话顶部条 (drawer 模式) — 收一收 */
.proj-drawer {
  background: var(--card-bg);
  border: 1px solid var(--border-soft);
  border-radius: 12px;
  padding: 10px 14px;
  margin: 14px 24px 0;
  box-shadow: 0 1px 2px rgba(0,0,0,0.02);
}

/* 三栏模式下的右侧面板（chat-in-project 时） */

/* 浮动「打开项目页」面包屑：永远显示 (chat-in-project) */
.proj-breadcrumb {
  position: sticky;
  top: 0;
  z-index: 20;
  display: none;
  align-items: center;
  gap: 8px;
  padding: 10px 24px;
  font-size: 12px;
  color: var(--text-3);
  background: linear-gradient(180deg, var(--bg, var(--card-bg)) 60%, transparent);
  backdrop-filter: blur(8px);
}
body[data-view="chat-in-project"] .proj-breadcrumb { display: flex; }

/* ═══════ v2.1 三栏对齐 + 折叠按钮 + 文件密度 ═══════ */

/* 项目主页：整体视口固定不滚动，仅每列内部滚动 */
body[data-view="project"] #cecpsProjView { display: flex; flex-direction: column; height: 100vh; max-height: 100vh; overflow: hidden; }
body[data-view="project"] #cecpsProjView .proj-hero { flex-shrink: 0; }
body[data-view="project"] #cecpsProjView .proj-body { flex: 1; min-height: 0; overflow: hidden; padding-bottom: 18px; }

/* 三栏 grid 布局（来自设计稿 v2-polish-2.css line 813）*/
body[data-proj-layout="threecol"] .proj-body {
  display: grid !important;
  align-items: stretch;
  /* 左右两栏完全对称（同 minmax + 同 fr），中间宽。原来左 0.9fr/260px、
     右 0.95fr/280px 不对称——视觉上左右栏宽度差 ~19px，导致下方居中
     composer 看起来"离右栏更近"。 */
  grid-template-columns: minmax(260px, 0.9fr) minmax(0, 1.7fr) minmax(260px, 0.9fr);
  gap: 24px;
}
body[data-proj-layout="threecol"] .proj-section-files,
body[data-proj-layout="threecol"] .proj-section-prompt,
body[data-proj-layout="threecol"] .proj-section-chats {
  position: static !important;
  align-self: stretch;
  margin-top: 0 !important;
  padding-top: 14px !important;
  overflow-y: auto;
}

/* 三栏：统一起始位置、对齐高度、网格基线 */

.proj-section-head { display: flex !important; align-items: center; gap: 8px; }
.proj-section-head .proj-section-title { flex: 1; min-width: 0; }
/* Hero 描述：用户没填描述时不显示这一行，避免占位 */
.proj-hero-desc:empty { display: none; }

/* （波次 3：移除原来的 density toggle / dot / 紧凑模式 —— 原型 v2-enhancements
    没有这些 class，按 1:1 改回原型样式。如果之后要加紧凑模式，从原型扩展。） */

/* ═══════ v2.1 三栏视觉打磨 ═══════ */

/* 页面底色更柔和，三栏卡片在其上漂浮感更明显 */
body[data-view="project"] { background: #f7f5ef; }
body[data-view="project"][data-theme="dark"] { background: #15201c; }

/* 主区四周更舒服的留白 */
body[data-view="project"] #cecpsProjView .proj-body {
  padding: 4px 28px 22px !important;
  gap: 20px !important;
}

/* 三栏卡片：更细的描边、更软的圆角、轻微 hover 抬起 */

/* section head：更高、底分割线更细、标题更有层级感 */

/* 给三个标题前加小色点，区分列的"角色" */

/* 内容区与 head 之间不再 padding-top，让 head 真的"贴着" */

/* 文件卡：更轻、hover 微亮 */
.proj-section-files .proj-file-card {
  border: 1px solid rgba(31, 60, 51, 0.06) !important;
  background: var(--card-bg) !important;
  transition: all 140ms;
  border-radius: 10px !important;
}
.proj-section-files .proj-file-card:hover {
  border-color: rgba(31, 60, 51, 0.14) !important;
  background: rgba(31, 60, 51, 0.018) !important;
  transform: translateY(-1px);
  box-shadow: 0 4px 10px -6px rgba(31, 60, 51, 0.15);
}
/* 深色模式：文件卡用 --card-bg-2 让它在 section（--card-bg）上"浮起来"，
   否则卡与容器底色完全相同（都是 #1e2228）→ 看不出卡片边界。 */
html[data-theme="dark"] .proj-section-files .proj-file-card {
  background: var(--card-bg-2) !important;
  border-color: rgba(255, 255, 255, 0.06) !important;
}
html[data-theme="dark"] .proj-section-files .proj-file-card:hover {
  background: rgba(255, 255, 255, 0.04) !important;
  border-color: rgba(255, 255, 255, 0.14) !important;
  box-shadow: 0 4px 10px -6px rgba(0, 0, 0, 0.5);
}

/* 文件类型徽标：更柔的色调 */
.proj-section-files .proj-file-icon { font-weight: 700 !important; }
.proj-section-files .proj-file-icon.ft-pdf { background: #fef2ed !important; color: #c2410c !important; }
.proj-section-files .proj-file-icon.ft-doc, 
.proj-section-files .proj-file-icon.ft-docx { background: #eef4fb !important; color: #1e4ea8 !important; }
.proj-section-files .proj-file-icon.ft-xls, 
.proj-section-files .proj-file-icon.ft-xlsx { background: #ecf6ee !important; color: #1f7a3f !important; }
.proj-section-files .proj-file-icon.ft-ppt,
.proj-section-files .proj-file-icon.ft-pptx { background: #fef3eb !important; color: #b8460e !important; }
/* 深色模式：把 ft-* 浅 pastel 底盘换成低饱和暗色，避免在深底文件卡上"亮瞎眼"。
   字色用偏亮的同色相，保证 SRT/XLSX/PDF 这种 3 字徽标仍可读。 */
html[data-theme="dark"] .proj-section-files .proj-file-icon.ft-pdf {
  background: rgba(194, 65, 12, 0.18) !important; color: #fb923c !important;
}
html[data-theme="dark"] .proj-section-files .proj-file-icon.ft-doc,
html[data-theme="dark"] .proj-section-files .proj-file-icon.ft-docx {
  background: rgba(30, 78, 168, 0.22) !important; color: #93c5fd !important;
}
html[data-theme="dark"] .proj-section-files .proj-file-icon.ft-xls,
html[data-theme="dark"] .proj-section-files .proj-file-icon.ft-xlsx {
  background: rgba(31, 122, 63, 0.22) !important; color: #86efac !important;
}
html[data-theme="dark"] .proj-section-files .proj-file-icon.ft-ppt,
html[data-theme="dark"] .proj-section-files .proj-file-icon.ft-pptx {
  background: rgba(184, 70, 14, 0.22) !important; color: #fdba74 !important;
}

/* 上传区：虚线柔化、文案小 */
.proj-section-files .proj-file-upload {
  border: 1.5px dashed rgba(31, 60, 51, 0.14) !important;
  background: rgba(31, 60, 51, 0.012) !important;
  color: var(--text-4) !important;
  font-size: 12px !important;
  border-radius: 10px !important;
  transition: all 140ms;
}
.proj-section-files .proj-file-upload:hover {
  border-color: var(--ink) !important;
  color: var(--ink) !important;
  background: rgba(31, 60, 51, 0.03) !important;
}

/* 对话行：去掉外框，靠 hover 显示分组 */
.proj-section-chats .proj-chat-row {
  border: 1px solid transparent !important;
  background: transparent !important;
  border-radius: 10px !important;
  padding: 10px 12px !important;
  transition: all 120ms;
}
.proj-section-chats .proj-chat-row:hover {
  background: rgba(31, 60, 51, 0.035) !important;
  border-color: rgba(31, 60, 51, 0.06) !important;
}
.proj-section-chats .pcl-title { font-weight: 500 !important; color: var(--text) !important; }
.proj-section-chats .pcl-sub { color: var(--text-4) !important; font-size: 11.5px !important; margin-top: 2px; }
.proj-section-chats .pcl-time { color: var(--text-4) !important; font-size: 11px !important; flex-shrink: 0; }

/* "新对话"按钮（中间列顶部）更突出但不刺眼 */
.proj-section-chats .proj-chat-fab {
  background: var(--ink) !important;
  color: var(--ink-fg, #fff) !important;
  border: none !important;
  border-radius: 10px !important;
  padding: 11px 14px !important;
  font-weight: 500 !important;
  font-size: 13px !important;
  margin-bottom: 10px !important;
  transition: all 140ms;
  box-shadow: 0 1px 2px rgba(31, 60, 51, 0.15);
}
.proj-section-chats .proj-chat-fab:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 10px -2px rgba(31, 60, 51, 0.25);
}

/* 提示词编辑器：纸感、更大输入面 */
.proj-section-prompt .proj-prompt {
  background: rgba(201, 169, 110, 0.04) !important;
  border: 1px solid rgba(201, 169, 110, 0.12) !important;
  border-radius: 10px !important;
  padding: 14px !important;
  font-size: 13px !important;
  line-height: 1.7 !important;
  color: var(--text-2) !important;
}
.proj-section-prompt .proj-prompt:focus {
  border-color: rgba(201, 169, 110, 0.35) !important;
  background: var(--card-bg) !important;
  outline: none;
}
/* 深色模式：金色 alpha 在深底上偏脏，换成中性透明白 + 暗色文字色 */
html[data-theme="dark"] .proj-section-prompt .proj-prompt {
  background: rgba(255, 255, 255, 0.02) !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
  color: var(--text-2) !important;
}
html[data-theme="dark"] .proj-section-prompt .proj-prompt:focus {
  background: var(--card-bg-2) !important;
  border-color: rgba(127, 195, 158, 0.35) !important;
}
.proj-section-prompt .prompt-editor-foot {
  border-top: none !important;
  padding-top: 8px !important;
}
.proj-section-prompt .prompt-editor-meta {
  font-size: 11px !important;
  color: var(--text-4) !important;
}

/* hero 区：底部细分割线代替阴影 */
body[data-view="project"] #cecpsProjView .proj-hero {
  border-bottom: 1px solid rgba(31, 60, 51, 0.05);
  padding: 14px 28px !important;
  background: transparent !important;
}

/* 滚动条：超细灰，仅 hover 时显色 */

/* ═══════ 消息时间戳 + 删除按钮 ═══════ */
.msg-time-stamp {
  font-size: 10.5px;
  color: var(--text-5, #a0a0a0);
  margin-top: 4px;
  letter-spacing: 0.02em;
  font-variant-numeric: tabular-nums;
  opacity: 0.7;
  transition: opacity 140ms;
}
.msg-row:hover .msg-time-stamp { opacity: 1; }
.msg-row.user .msg-time-stamp { text-align: right; }
.msg-row.assistant .msg-time-stamp { text-align: left; padding-left: 2px; }

.msg-del-btn {
  background: transparent;
  border: none;
  width: 26px; height: 26px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 6px;
  color: var(--text-5);
  cursor: pointer;
  transition: all 120ms;
}
.msg-del-btn:hover { background: rgba(220, 38, 38, 0.08); color: #dc2626; }

/* 会话行删除按钮 */
.sb-session-row, .sb-flat-row, .proj-chat-row { position: relative; }
.sess-del-btn {
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  width: 22px; height: 22px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 5px;
  background: transparent;
  border: none;
  color: var(--text-5);
  cursor: pointer;
  opacity: 0;
  transition: all 120ms;
}
.sb-session-row:hover .sess-del-btn,
.sb-flat-row:hover .sess-del-btn,
.proj-chat-row:hover .sess-del-btn { opacity: 1; }
.sess-del-btn:hover { background: rgba(220, 38, 38, 0.1); color: #dc2626; }
/* 项目对话行的时间始终预留 26px 给删除按钮位置 —— 不能只在 hover 时
   加 padding，否则 hover/非 hover 两种状态的时间垂直线不一致，列表
   看起来"未对齐"。删除按钮 absolute 不占布局位，只控制 opacity。 */
.proj-chat-row .pcl-time { padding-right: 26px; }
.proj-breadcrumb a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--text-3);
  cursor: pointer;
  padding: 3px 8px;
  border-radius: 6px;
  transition: all 120ms;
}
.proj-breadcrumb a:hover { background: var(--hover); color: var(--text); }
.proj-breadcrumb .crumb-sep { color: var(--text-5); }
.proj-breadcrumb .crumb-current {
  font-weight: 500;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 320px;
}

/* ── Phase C-2：composer mini-badge（chat-in-project 视图） ──── */
.mini-badge {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 4px 10px; margin-bottom: 8px;
  background: var(--card); border: 1px solid var(--border); border-radius: 999px;
  font-size: 12px; color: var(--text-3);
  cursor: pointer; user-select: none;
  align-self: flex-start;
  transition: background 120ms;
}
.mini-badge:hover { background: var(--hover); color: var(--text); }
.mini-badge-icon {
  width: 18px; height: 18px; border-radius: 4px;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 10px; font-weight: 600; color: #fff;
  flex-shrink: 0;
}
.mini-badge-text { font-weight: 500; color: var(--text-2); }
.mini-badge-meta { color: var(--text-4); }

.mini-badge-popover {
  position: fixed; z-index: 80;
  width: 320px; max-height: 60vh; overflow-y: auto;
  background: var(--card); border: 1px solid var(--border); border-radius: 12px;
  box-shadow: 0 10px 32px rgba(0,0,0,0.12);
  padding: 12px 14px;
  opacity: 0; transform: translateY(4px);
  transition: opacity 140ms, transform 140ms;
  pointer-events: none;
}
.mini-badge-popover.visible {
  opacity: 1; transform: translateY(0);
  pointer-events: auto;
}
.mb-pop-section { margin-bottom: 12px; }
.mb-pop-section:last-child { margin-bottom: 0; }
.mb-pop-section h4 {
  margin: 0 0 6px; font-size: 11.5px; font-weight: 600;
  color: var(--text-3); letter-spacing: 0.04em; text-transform: uppercase;
}
.mb-pop-files {
  list-style: none; padding: 0; margin: 0;
  display: flex; flex-direction: column; gap: 4px;
}
.mb-pop-file {
  display: flex; align-items: center; justify-content: space-between;
  padding: 4px 6px; border-radius: 6px;
  font-size: 12.5px; color: var(--text-2);
}
.mb-pop-file:hover { background: var(--hover); }
.mb-pop-fname { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1; min-width: 0; }
.mb-pop-fsize { font-size: 11px; color: var(--text-4); flex-shrink: 0; margin-left: 8px; }
.mb-pop-empty { padding: 6px; color: var(--text-4); font-size: 12px; }
.mb-pop-prompt {
  margin: 0; padding: 8px;
  font-size: 12px; line-height: 1.5; color: var(--text-2);
  background: var(--hover); border-radius: 6px;
  white-space: pre-wrap; word-break: break-word;
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Inter", sans-serif;
  max-height: 200px; overflow-y: auto;
}

#projFilesList { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }

/* （原 .proj-files-drop 拖放区已废弃：现在统一用原型 .proj-file-upload 装在
    .proj-file-grid 末尾。upload 节点本身就是放置区。） */

#projSessionsList { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }

/* 空状态 */
.proj-empty { list-style: none; padding: 12px 0; font-size: 12.5px; color: var(--text-4); }

/* 项目 hero 区：图标更大 */
#cecpsProjView .proj-hero {
  display: flex; align-items: flex-start; gap: 14px;
  padding: 24px 32px 16px; border-bottom: 1px solid var(--border-soft, #eee);
}
#cecpsProjView .proj-hero-icon {
  width: 44px; height: 44px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-size: 18px; font-weight: 700; flex-shrink: 0;
}
#cecpsProjView .proj-hero-meta { flex: 1; min-width: 0; }
#cecpsProjView .proj-hero-name { font-size: 20px; font-weight: 600; margin: 0 0 4px; }
#cecpsProjView .proj-hero-desc { font-size: 12.5px; color: var(--text-3); margin: 0; line-height: 1.55; }

/* 三栏 section 内边距 */
#cecpsProjView .proj-section-head {
  display: flex; align-items: center;
  padding-bottom: 10px; margin-bottom: 8px;
  border-bottom: 1px solid var(--border-soft, #eee);
}
#cecpsProjView .proj-section-title { font-size: 12px; font-weight: 600; color: var(--text-3); text-transform: uppercase; letter-spacing: 0.05em; }

/* （原 .proj-prompt-ta textarea 已废弃：改用原型 .proj-prompt contenteditable
    div，避免右下 resize 拖把 + 与原型对齐 placeholder/字数统计样式） */

/* ── section count 徽章 ── */
.proj-section-count {
  margin-left: 6px;
  padding: 1px 6px;
  background: var(--hover, rgba(0,0,0,0.06));
  border-radius: 10px;
  font-size: 11px;
  font-weight: 600;
  color: var(--text-3);
}


/* ── hero 区收紧 ── */
#cecpsProjView .proj-hero {
  padding: 28px 40px 18px !important;
  gap: 18px !important;
  border-bottom: 1px solid var(--border-soft, rgba(0,0,0,0.07));
}
#cecpsProjView .proj-hero-icon {
  width: 40px !important; height: 40px !important;
  border-radius: 10px !important; font-size: 16px !important;
  color: #fff;
}
#cecpsProjView .proj-hero-name { font-size: 18px !important; font-weight: 600; margin: 0 0 3px !important; }
#cecpsProjView .proj-hero-desc { font-size: 12px !important; color: var(--text-3); margin: 0 !important; }

/* hero 区标题行：项目名 + 「项目内对话共享」徽章并排 */
#cecpsProjView .proj-hero-name-row {
  display: flex; align-items: baseline; gap: 10px;
  flex-wrap: wrap; margin-bottom: 3px;
}
#cecpsProjView .proj-hero-name-row .proj-hero-name { margin: 0 !important; }
#cecpsProjView .proj-hero-share-tag {
  font-size: 11px; font-weight: 500;
  color: var(--text-3);
  background: var(--hover, rgba(0,0,0,0.06));
  padding: 2px 8px; border-radius: 10px;
  white-space: nowrap;
  user-select: none;
}

/* ── 三栏 body 左右边距 ── */
body[data-proj-layout="threecol"] .proj-body {
  padding: 16px 28px 80px !important;
}

/* ── 项目页背景色（暖米色） ── */
body[data-view="project"] .main { background: #f7f5ef; }
html[data-theme="dark"] body[data-view="project"] .main { background: var(--bg); }
body[data-view="project"] #cecpsProjView .proj-section-files,
body[data-view="project"] #cecpsProjView .proj-section-chats,
body[data-view="project"] #cecpsProjView .proj-section-prompt {
  background: #fff;
  border-radius: 10px;
  padding: 14px 16px;
  border: 1px solid rgba(0,0,0,0.06);
}
/* 深色模式统一色板：抛弃 #1a2520 绿调，套主项目 --card-bg 让三栏跟
   消息流、sidebar 等其他模块视觉同源；边框稍微提亮让层级可读。 */
html[data-theme="dark"] body[data-view="project"] #cecpsProjView .proj-section-files,
html[data-theme="dark"] body[data-view="project"] #cecpsProjView .proj-section-chats,
html[data-theme="dark"] body[data-view="project"] #cecpsProjView .proj-section-prompt {
  background: var(--card-bg);
  border-color: rgba(255,255,255,0.08);
}

/* section head 下边框 */
#cecpsProjView .proj-section-head {
  padding-bottom: 10px !important;
  margin-bottom: 10px !important;
  border-bottom: 1px solid rgba(0,0,0,0.07) !important;
}
html[data-theme="dark"] #cecpsProjView .proj-section-head {
  border-bottom-color: rgba(255,255,255,0.08) !important;
}

/* ── 侧栏项目行（来自 v2-enhancements.css） ── */
.sb-proj-row {
  display: flex; align-items: center; gap: 8px;
  /* padding-left 12 让项目行 caret 比顶层 header caret (X=6) 明显靠右；
     padding-right 11 让数量徽标右缘 (right=11) 跟侧栏其他行尾 affordance
     的统一锚点对齐。 */
  padding: 8px 11px 8px 12px;
  border-radius: 8px; cursor: pointer;
  font-size: 13px; line-height: 1.4; color: var(--text-2);
  transition: background 120ms, color 120ms;
  user-select: none; position: relative;
}
.sb-proj-row:hover { background: var(--hover); color: var(--text); }
.sb-proj-row.expanded .sb-proj-name { font-weight: 500; }
/* active 视觉由上方 polish-2 段（约 88-99 行）定义，这里不再反向覆盖 */

.sb-proj-caret {
  width: 14px; height: 14px;
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--text-4);
  transform: rotate(-90deg);
  transition: transform 160ms var(--ease, ease);
  flex-shrink: 0;
}
.sb-proj-row.expanded .sb-proj-caret { transform: rotate(0); }

.sb-proj-icon {
  width: 24px; height: 24px; border-radius: 7px;
  flex-shrink: 0; display: inline-flex;
  align-items: center; justify-content: center;
  font-weight: 600; color: white;
  /* font-size + letter-spacing + nowrap 由顶部 (1) 区块统一指定 */
}
.sb-proj-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sb-proj-count {
  font-size: 10.5px; color: var(--text-4);
  font-variant-numeric: tabular-nums; flex-shrink: 0; padding-left: 4px;
  transition: opacity 120ms;
}
.sb-proj-row:hover .sb-proj-count { opacity: 0; }

/* 项目下嵌套子对话 */
.sb-proj-children {
  display: flex; flex-direction: column; gap: 1px;
  padding: 0 0 0 18px; margin-left: 4px;
  border-left: 1px solid transparent; margin-bottom: 0;
  max-height: 0; opacity: 0; overflow: hidden;
  transition: max-height 220ms cubic-bezier(.2,.8,.2,1), opacity 160ms, padding 160ms, border-color 200ms, margin-bottom 160ms;
}
.sb-proj-row.expanded + .sb-proj-children {
  max-height: 800px; opacity: 1;
  padding: 2px 0 4px 18px; margin-bottom: 2px;
  border-left-color: var(--border-soft);
}
.sb-child-row {
  padding: 5px 8px; border-radius: 5px; cursor: pointer;
  font-size: 12px; color: var(--text-3);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  transition: background 120ms, color 120ms;
}
.sb-child-row:hover { background: var(--hover); color: var(--text); }
.sb-child-row.active { background: var(--ink-soft); color: var(--ink); font-weight: 500; }

/* ══════════════════════════════════════════════
   文件卡片（对标设计稿 proj-file-card 规范）
   ══════════════════════════════════════════════ */
#projFilesList { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:4px; }
#projFilesList li { list-style:none; }
.proj-file-card {
  display:flex; align-items:center; gap:10px;
  padding:9px 12px; border-radius:10px;
  background:var(--card-bg,#fff);
  border:1px solid rgba(0,0,0,0.06);
  cursor:default;
  /* 切换大块/紧凑密度时，padding/gap/border-color 等都过渡，避免硬切 */
  transition: padding 200ms cubic-bezier(.2,.8,.2,1), gap 200ms cubic-bezier(.2,.8,.2,1), border-color 120ms;
  position:relative;
}
.proj-file-card:hover { border-color:rgba(0,0,0,0.12); }
/* 文档型文件图标 */
.proj-file-icon {
  width:30px; height:36px; border-radius:4px;
  border:1px solid var(--border,#ddd);
  display:flex; align-items:flex-end; justify-content:center;
  font-size:8.5px; font-weight:700; letter-spacing:0;
  flex-shrink:0; position:relative; overflow:visible;
  padding-bottom:4px; color:var(--text-3);
  background:var(--card-bg,#fff);
  /* 切换密度时尺寸/字号过渡 */
  transition: width 200ms cubic-bezier(.2,.8,.2,1), height 200ms cubic-bezier(.2,.8,.2,1), font-size 200ms, border-radius 200ms;
}
.proj-file-icon::before {
  content:""; position:absolute; top:0; right:0;
  width:9px; height:9px;
  border-bottom:1px solid var(--border,#ddd);
  border-left:1px solid var(--border,#ddd);
  border-radius:0 3px 0 4px;
  background:var(--sidebar-bg,#f5f5f3);
}
.proj-file-icon.ft-pdf  { color:#c14a35; border-color:rgba(193,74,53,0.28); background:#fef2ed; }
.proj-file-icon.ft-docx { color:#1e4ea8; border-color:rgba(30,78,168,0.26); background:#eef4fb; }
.proj-file-icon.ft-xlsx { color:#1f7a3f; border-color:rgba(31,122,63,0.28); background:#ecf6ee; }
.proj-file-icon.ft-pptx { color:#b8460e; border-color:rgba(184,70,14,0.26); background:#fef3eb; }
.proj-file-icon.ft-img  { color:#7a4eb0; border-color:rgba(122,78,176,0.26); background:#f5f0fc; }
.proj-file-icon.ft-audio { color:#0969b8; background:#ebf3fc; }
.proj-file-icon.ft-video { color:#1a7c5a; background:#edf7f2; }
.proj-file-meta { flex:1; min-width:0; }
.proj-file-name { font-size:13px; font-weight:500; color:var(--text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; transition: font-size 200ms; }
.proj-file-name { cursor: default; }
/* 文件名 hover 即时浮层(JS 单例,挂 body)。position:fixed 逃逸列表滚动容器的
   overflow 裁切;视觉沿用 main.css 的 [data-tip] 气泡。淡入快到近乎即时。 */
.file-name-tip {
  position: fixed; z-index: 200; display: none;
  max-width: min(420px, 90vw);
  padding: 5px 9px;
  font-size: 12px; font-weight: 500; line-height: 1.4;
  color: #fff; background: rgba(20,23,26,0.92);
  border-radius: 6px;
  white-space: normal; word-break: break-all;
  pointer-events: none;
  box-shadow: 0 4px 10px rgba(0,0,0,0.18);
  opacity: 0; transition: opacity 90ms;
}
.file-name-tip.is-show { opacity: 1; }
html[data-theme="dark"] .file-name-tip { background: rgba(245,245,245,0.95); color:#14171a; }
.proj-file-sub { font-size:11px; color:var(--text-4); margin-top:2px; }
.proj-file-del {
  opacity:0; flex-shrink:0; width:26px; height:26px;
  background:none; border:none; cursor:pointer;
  color:var(--danger,#e53e3e); border-radius:5px;
  display:flex; align-items:center; justify-content:center;
  transition:opacity 120ms, background 120ms;
}
.proj-file-card:hover .proj-file-del { opacity:1; }
.proj-file-del:hover { background:rgba(229,62,62,0.08); }
.proj-file-empty { color:var(--text-4); font-size:12.5px; padding:8px 0; list-style:none; }

/* 紧凑变体：消息气泡内的附件卡片（messages.js 复用 renderFileCard({compact:true})）。
   宽度受限、不浮动、不响应 hover。 */
.proj-file-card--inline {
  width: 280px;
  max-width: 100%;
  padding: 7px 10px;
}
.proj-file-card--inline:hover {
  border-color: rgba(0,0,0,0.06);
  background: var(--card-bg, #fff);
  transform: none;
  box-shadow: none;
}
.proj-file-card--inline .proj-file-name { font-size: 12.5px; }

/* density toggle 控件（移植 v2-polish-2.css 918-944 + 1188-1196）*/
.proj-density-toggle {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 1px;
  padding: 2px;
  background: rgba(31, 60, 51, 0.05);
  border-radius: 7px;
  border: 1px solid transparent;
  flex-shrink: 0;
}
.proj-density-toggle button {
  width: 22px; height: 20px;
  display: inline-flex; align-items: center; justify-content: center;
  background: transparent;
  border: none;
  border-radius: 5px;
  color: var(--text-4);
  cursor: pointer;
  transition: all 120ms;
}
.proj-density-toggle button:hover { color: var(--text-2); }
.proj-density-toggle button.active {
  background: var(--card-bg);
  color: var(--ink);
  box-shadow: 0 1px 2px rgba(31, 60, 51, 0.08), 0 0 0 0.5px rgba(31, 60, 51, 0.08);
}

/* 密度：compact 模式 (data-file-density 对齐 v2-polish-2.css) */
body[data-file-density="compact"] .proj-file-card { padding:5px 10px !important; gap:8px; }
body[data-file-density="compact"] .proj-file-icon { width:18px !important; height:18px !important; font-size:7.5px !important; border-radius:3px !important; }
body[data-file-density="compact"] .proj-file-name { font-size:12px; }
body[data-file-density="compact"] .proj-file-sub { display:none; }

/* ══════════════════════════════════════════════
   对话行（对标设计稿 proj-chat-row / pcl-* 规范）
   ══════════════════════════════════════════════ */
#projSessionsList { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:2px; }
#projSessionsList li { list-style:none; }
.proj-chat-row {
  /* Y 轴居中：让右侧 .pcl-time 和 absolute 居中的 .sess-del-btn 视觉上对齐
     （之前用 flex-start 时间贴顶，按钮 top:50%，两者错位） */
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  padding:10px 12px; border-radius:10px; cursor:pointer;
  border:1px solid transparent;
  transition:background 120ms, border-color 120ms;
}
.proj-chat-row:hover {
  background:rgba(31,60,51,0.035);
  border-color:rgba(31,60,51,0.06);
}
.pcl-title-row { display:flex; align-items:center; gap:4px; min-width:0; }
.pcl-title { font-size:13px; font-weight:500; color:var(--text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; flex:1; min-width:0; }
.pcl-sub { font-size:11.5px; color:var(--text-4); margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pcl-time { font-size:11px; color:var(--text-4); flex-shrink:0; white-space:nowrap; }

/* 密度：compact 模式 (data-chat-density 对齐 v2-polish-2.css) */
body[data-chat-density="compact"] .proj-chat-row { padding:5px 10px !important; }
body[data-chat-density="compact"] .pcl-title { font-size:12.5px; }
body[data-chat-density="compact"] .pcl-sub { display:none !important; }

/* ══════════════════════════════════════════════
   Mini badge（cip-mini 行内布局段已删 — 由上方 polish-2 段
   .cip-mini { position:absolute; bottom:calc(100%+6px) ... } 接管，浮空气泡而非行内）
   ══════════════════════════════════════════════ */

.cip-pop {
  position:fixed; z-index:9999;
  width:320px; background:var(--card-bg,#fff);
  border:1px solid var(--border-soft); border-radius:14px;
  box-shadow:0 8px 30px rgba(0,0,0,0.14);
  padding:0; overflow:hidden;
  display:flex; flex-direction:column;
  max-height:calc(100vh - 24px); min-height:0;
  opacity:0; transform:translateY(6px);
  pointer-events:none;
  transition:opacity 160ms, transform 140ms;
}
.cip-pop-head, .cip-pop-section-h { flex:0 0 auto; }
.cip-pop-files {
  flex:1 1 auto; min-height:0; overflow-y:auto;
  scrollbar-width:thin;
}
.cip-pop-files::-webkit-scrollbar { width:6px; }
.cip-pop-files::-webkit-scrollbar-thumb {
  background:var(--border, rgba(0,0,0,0.15));
  border-radius:3px;
}
.cip-pop.open { opacity:1; transform:translateY(0); pointer-events:auto; }
.cip-pop-head {
  display:flex; align-items:center; gap:10px;
  padding:14px 16px 12px;
  border-bottom:1px solid var(--border-soft);
}
.cip-pop-head .sb-proj-icon { width:28px; height:28px; border-radius:7px; font-size:12px; flex-shrink:0; }
.cip-pop-head-name { font-size:14px; font-weight:600; color:var(--text); }
.cip-pop-head-sub { font-size:11.5px; color:var(--text-4); margin-top:2px; }
.cip-pop-section-h {
  padding:10px 16px 6px;
  font-size:10.5px; font-weight:600; color:var(--text-4);
  text-transform:uppercase; letter-spacing:0.05em;
}
.cip-pop-files { padding:0 10px 10px; display:flex; flex-direction:column; gap:2px; }
.cip-pop-file {
  display:flex; align-items:center; gap:8px;
  padding:5px 6px; border-radius:6px;
}
.cip-pop-file-icon {
  width:20px; height:24px; border-radius:3px;
  border:1px solid var(--border); background:var(--card-bg);
  display:flex; align-items:flex-end; justify-content:center;
  font-size:7px; font-weight:700; color:var(--text-3);
  flex-shrink:0; padding-bottom:2px;
}
.cip-pop-file-name { flex:1; font-size:12px; color:var(--text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cip-pop-file-size { font-size:11px; color:var(--text-4); flex-shrink:0; }
.cip-pop-empty { padding:8px 16px; font-size:12px; color:var(--text-4); }
.cip-pop-prompt {
  margin:0 10px 12px; padding:8px 10px;
  background:var(--hover); border-radius:8px;
  font-size:12px; color:var(--text-3); line-height:1.55;
  max-height:120px; overflow-y:auto;
  white-space:pre-wrap; word-break:break-word;
}

/* ══════════════════════════════════════════════
   侧栏子对话样式（.sb-child-dot / .sb-child-more）
   ══════════════════════════════════════════════ */
.sb-child-row { display:flex; align-items:center; gap:6px; }
.sb-child-dot {
  width:5px; height:5px; border-radius:50%;
  background:var(--text-5); flex-shrink:0;
  transition:background 120ms;
}
.sb-child-row:hover .sb-child-dot,
.sb-child-row.active .sb-child-dot { background:var(--ink); }
/* 分支会话的小分叉图标——和 .sb-session-branch-icon 同源（最近对话区） */
.sb-child-branch-icon {
  flex:0 0 auto; width:11px; height:11px;
  color:var(--text-4); opacity:0.9;
  display:inline-flex; align-items:center; justify-content:center;
  margin-left:-3px; /* 11px icon 比 5px dot 占地多，往左拉一点让标题文字基本同位 */
  transition:color 120ms, opacity 120ms;
  position:relative; /* 给深度角标定位用 */
}
.sb-child-branch-icon svg { width:100%; height:100%; }
.sb-child-row:hover .sb-child-branch-icon,
.sb-child-row.active .sb-child-branch-icon { color:var(--ink); opacity:1; }
/* 嵌套深度角标：图标右下角的小数字（仅 depth>=2 显示）。
   设计参考 macOS Dock badge / iOS app icon badge 的视觉语义：
   一个紧贴主图标的小 pill，告诉你"这是第 N 层"。 */
.sb-child-branch-depth {
  position:absolute;
  right:-6px; bottom:-5px;
  min-width:11px; height:11px; padding:0 2.5px;
  border-radius:6px; background:var(--text-4); color:#fff;
  font-size:8.5px; font-weight:700; line-height:11px;
  text-align:center; font-variant-numeric:tabular-nums;
  box-shadow:0 0 0 1.5px var(--surface, #fff); /* 描边，让角标和图标本身分开 */
  transition:background 120ms;
}
.sb-child-row:hover .sb-child-branch-depth,
.sb-child-row.active .sb-child-branch-depth { background:var(--ink); }
.sb-child-title { flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sb-child-more {
  font-size:11.5px; color:var(--text-4);
  /* 19px = sb-child-row padding-left (8) + dot (5) + gap (6)，和子项标题文字左对齐 */
  /* padding-right 11 跟侧栏右侧 affordance 锚点一致 (right=11) */
  padding:4px 11px 4px 19px; cursor:pointer;
  transition:color 120ms;
  display:flex; align-items:center; justify-content:space-between;
}
.sb-child-more svg { flex-shrink:0; }
.sb-child-more:hover { color:var(--ink); }

/* ══════════════════════════════════════════════
   侧栏 section（1:1 原型 v2-enhancements.css 第 6-38 行）
   ══════════════════════════════════════════════ */
/* 容器自身不再做横向缩进 —— 让顶级 header 能直接贴到侧栏左缘当 L1 看。
   缩进改由内部子元素自己控制：header 给 padding-left 4，子项目行
   给 padding-left 12，这样 header 比下方任何 item 都更靠左。 */
.sb-section { padding: 4px 0; flex-shrink: 0; }
/* 通用 sb-section-head 样式：以「最近对话」原始视觉为标杆——
   深色字 (var(--text))、无 hover 背景高亮、无 border-radius/button 化，
   简洁的分类标题。项目分类 / 最近对话 / 日期分组三处共享同一套。 */
/* sb-section-head 基础布局：通用规则（日期分组、项目分组、最近对话）共享，
   顶级 section 后面再补 override。 */
.sb-section-head {
  display:flex; align-items:center; gap:6px;
  padding:6px 12px 4px;
  font-size:11px; font-weight:600; color:var(--text);
  letter-spacing:0.04em;
  cursor:pointer;
  user-select:none;
}
.sb-section-head:focus-visible {
  outline:1.5px solid var(--brand, var(--text-3));
  outline-offset:1px;
}
.sb-section-head .sb-section-title { display:inline-flex; align-items:center; }
.sb-section-title { font-size:11px; font-weight:600; color:inherit; letter-spacing:0.04em; }
.sb-section-head .sb-section-caret {
  width:11px; height:11px;
  display:inline-flex; align-items:center; justify-content:center;
  color: var(--text-5);
  flex-shrink:0;
  transition: color 140ms, transform 180ms var(--ease, ease);
}
.sb-section-projects.collapsed .sb-section-caret,
.sb-section-head.collapsed .sb-section-caret { transform:rotate(-90deg); }

/* ── 顶级 section label（「项目」「最近对话」必须长得完全一致）─────────
   ① 两者样式**完全对称**：字号、字重、颜色、letter-spacing、padding 全部一样。
   ② DOM 顺序：caret → title → (settings 齿轮仅项目侧)。
   ③ 视觉权重：顶层 L1 必须**比下面所有层级都重**（更大字号 + 更粗字重 +
      更深颜色）。规格：13px + weight 600 + var(--text) 深色 + letter-spacing 0。
      下面的日期分组 L2 用 11px + weight 500 + var(--text-3) 中灰；
      会话标题 L3 13px + 400 + var(--text)。L1 > L3 > L2 的层级一目了然。
   ④ 上下间距：padding-top 14（拉开跟上一个区块的距离），padding-bottom 8。 */
.sb-section-projects > .sb-section-head,
#cecpsRecentHead {
  /* 顶层 L1 header 必须**贴侧栏左缘**——它是 L1，比下面任何 item 都更靠左。
     左 padding 6px（视觉外缘）；右 padding 11px 让齿轮右缘 (right=11) 跟
     侧栏所有行尾 affordance 的统一 right 锚点对齐。 */
  padding: 14px 11px 8px 6px;
  font-size: 13px;
  font-weight: 600;
  color: var(--text);
  letter-spacing: 0;
  text-transform: none;
}
.sb-section-projects > .sb-section-head .sb-section-title,
#cecpsRecentHead .sb-section-title {
  flex: 1;
  text-align: left;
  font-size: 13px;
  font-weight: 600;
  color: var(--text);
  letter-spacing: 0;
}
.sb-section-projects > .sb-section-head .sb-section-caret,
#cecpsRecentHead .sb-section-caret {
  width: 11px; height: 11px;
  color: var(--text-3);
  opacity: 0.85;
}

/* ── 日期分组 header (「今天」/「昨天」/「5月12日」)：L2 层级 ─────
   规格：比顶层 L1（13px / 600 / 深色）轻一档，但比 L3 对话项（13px / 400 /
   中灰）保留"分组标签"语义——用 11.5px / 500 / 比 L3 略深的灰，外加
   letter-spacing 形成 meta 风格。覆盖基础 .sb-section-head 的深色+600 默认值。 */
.sb-section-head.sb-date-group,
.sb-section-head.sb-date-group .sb-section-title {
  font-size: 11.5px;
  font-weight: 500;
  color: var(--text-3);
  letter-spacing: 0.03em;
}
.sb-section-head.sb-date-group {
  /* 日期分组 L2 缩进比 L1 多 —— L1 padding-left=6, L2 padding-left=12,
     左对齐刚好在 session item 的 caret 起始位置附近，视觉上"父级 header
     在最左，分组 header 缩进，对话项再缩进"形成清晰的三级层级。
     右 padding 11 跟其他行尾元素同锚点。 */
  padding: 8px 11px 4px 12px;
}
.sb-section-head.sb-date-group .sb-section-caret {
  width: 9px; height: 9px;
  color: var(--text-4);
  opacity: 0.7;
}

/* ── Toggle A「项目栏锁定滚动」（默认勾选） ─────────────────────────
   勾选状态：侧栏分两段独立滚动 —— 项目区按内容高度占位 + 不参与滚动；
            最近对话区独占剩余空间 + 内部滚动。
   取消勾选：整个 .sidebar 作为唯一滚动容器，项目区 + 最近对话区一起滚。

   实现：基础布局 .sidebar(display:flex column, overflow:hidden) 已在
   sidebar.css 定义；.sb-sessions(=#sessionList)默认 flex:1 + overflow-y:auto。
   这里只针对 #cecpsProjectsSection 补 flex-shrink:0 防它被压缩，并在
   Toggle A=OFF 时切到"整体滚"的另一布局态。 */

#cecpsProjectsSection {
  flex-shrink: 0;
}

/* Toggle A = ON（默认）：保持 sidebar.css 默认行为
   —— .sb-sessions { flex:1; overflow-y:auto } 已经实现"只滚最近对话"。
   这里不写任何 override。 */

/* Toggle A = OFF：整体滚动
   —— .sidebar 自己 overflow:auto；#sessionList 撤销自己的滚动；
   #cecpsProjectsSection 用 display:contents 把 header / list 直接提升为
   .sidebar 的直接子节点（sticky 父链就锚到 .sidebar，滚到底部也固定）。
   两个 L1 header 在外层滚动容器里走 position:sticky。 */
body[data-proj-section-sticky="0"] #sidebar.sidebar,
body[data-proj-section-sticky="0"] aside.sidebar {
  overflow-y: auto;
}
body[data-proj-section-sticky="0"] #sessionList {
  flex: 0 0 auto;
  overflow: visible;
}
body[data-proj-section-sticky="0"] #cecpsProjectsSection {
  display: contents;
}
body[data-proj-section-sticky="0"] .sb-section-projects > .sb-section-head,
body[data-proj-section-sticky="0"] #cecpsRecentHead {
  position: sticky;
  top: 0;
  z-index: 5;
  background: var(--sidebar-bg);
}
/* 「最近对话」要 stick 在「项目」header 下面（不能两个都 stick top:0 重叠）。
   方案：「最近对话」 top 改成 = 项目 header 高度（≈ 36px）。 */
body[data-proj-section-sticky="0"] #cecpsRecentHead {
  top: 36px;
}
/* 整体滚动模式下 .sb-foot（联系支持 + 用户卡片）也会跟着滚走；用 sticky
   把它钉在侧栏底部。背景色要补齐，否则滚动内容会从下方透出来。 */
body[data-proj-section-sticky="0"] .sb-foot {
  position: sticky;
  bottom: 0;
  z-index: 5;
  background: var(--sidebar-bg);
}

/* ── Toggle B「在侧边栏展开项目对话」 ───────────────────────────────
   勾选（默认）：项目行有 caret，可点击展开 / 折叠看 3 条最近对话。
   取消勾选：caret 隐藏；项目行整行点击直接进项目主页（不在侧栏展开）；
            已经展开的子对话区也一起收起。
   状态由 body[data-allow-proj-expand] 控制（默认 1）。 */
body[data-allow-proj-expand="0"] .sb-proj-caret {
  display: none;
}
body[data-allow-proj-expand="0"] .sb-proj-children {
  display: none !important;
}

/* 「项目」section header 右侧齿轮按钮：尺寸压到 16x16（图标 12px），
   跟下方数量徽标 / 删除按钮的视觉权重比例协调；颜色 --text-3 浅灰，
   hover 加深。整体右缘 right:10px —— 跟所有"行尾 affordance"共享同一
   right 锚点（参见下方 sb-proj-count / sb-session-delete / sb-child-more
   末尾箭头），垂直方向各元素 right 边在同一直线上。 */
.sb-section-settings {
  display: inline-flex; align-items: center; justify-content: center;
  width: 18px; height: 18px; padding: 0;
  margin-left: auto;  /* 把齿轮推到 header 最右；右缘由 header padding-right=11 决定 */
  margin-right: 0;
  background: transparent; border: 0;
  border-radius: 5px;
  color: var(--text-3);
  cursor: pointer;
  opacity: 0;
  transition: background 120ms, opacity 120ms, color 120ms;
}
.sb-section-settings svg { width: 13px; height: 13px; }
.sb-section-head:hover .sb-section-settings,
.sb-section-settings:hover,
.sb-section-settings:focus-visible,
.sb-section-settings[aria-expanded="true"] {
  opacity: 1;
}
.sb-section-settings:hover {
  background: var(--hover, rgba(0,0,0,0.06));
  color: var(--text);
}
.sb-section-settings:focus-visible {
  outline: 1.5px solid var(--brand, var(--text-3));
  outline-offset: 1px;
}

/* ── 项目偏好设置面板（侧栏「项目」section header 齿轮触发） ─────
   定位由 JS 算（fixed + top/left），样式（背景、阴影、内距）在这里。
   抽屉/弹层视觉走「弹出卡片」语义，跟 inline-confirm 的克制风格一致。 */
.proj-settings-panel {
  position: fixed;
  width: 280px;
  background: var(--card-bg, #ffffff);
  border: 1px solid var(--border, rgba(0,0,0,0.08));
  border-radius: 10px;
  box-shadow: 0 8px 28px rgba(0,0,0,0.12), 0 2px 8px rgba(0,0,0,0.06);
  padding: 12px 14px 10px;
  z-index: 9999;
  font-size: 12.5px;
  color: var(--text);
}
.proj-settings-head {
  font-size: 12px;
  font-weight: 600;
  color: var(--text-3);
  letter-spacing: 0.06em;
  padding-bottom: 8px;
  margin-bottom: 6px;
  border-bottom: 1px solid var(--border-soft, rgba(0,0,0,0.06));
}
.proj-settings-row {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 8px 0;
  cursor: pointer;
}
.proj-settings-row + .proj-settings-row {
  border-top: 1px solid var(--border-soft, rgba(0,0,0,0.04));
}
.proj-settings-meta { flex: 1; min-width: 0; }
.proj-settings-label {
  font-size: 13px;
  font-weight: 500;
  color: var(--text);
  margin-bottom: 2px;
}
.proj-settings-hint {
  font-size: 11.5px;
  color: var(--text-4, var(--text-3));
  line-height: 1.5;
}
.proj-settings-row input[type="checkbox"] {
  flex-shrink: 0;
  width: 16px; height: 16px;
  margin-top: 2px;
  accent-color: var(--ink, #1f3c33);
  cursor: pointer;
}
/* 折叠时隐藏整个最近对话列表 —— header 已抽出 sessListEl 不再是兄弟，
   用 body class 驱动。 */
body.cecps-recent-collapsed #sessionList { display: none; }

/* ══════════════════════════════════════════════
   侧栏项目列表 .sb-proj-list
   ══════════════════════════════════════════════ */
.sb-proj-list {
  display:flex; flex-direction:column; gap:1px;
  overflow:hidden;
  max-height:9999px;
  opacity:1;
  transition:max-height 220ms var(--ease, ease), opacity 160ms var(--ease, ease);
}
.sb-section-projects.collapsed .sb-proj-list {
  max-height:0;
  opacity:0;
  pointer-events:none;
}

/* 行尾"…"项目设置（hover 出现）—— 对齐到 right:11 统一锚点 */
.sb-proj-more {
  position:absolute; right:11px;
  width:18px; height:18px; border-radius:5px;
  display:inline-flex; align-items:center; justify-content:center;
  color:var(--text-4);
  opacity:0; background:transparent;
  transition:background 120ms, opacity 120ms, color 120ms;
}
.sb-proj-more svg { width:12px; height:12px; }
.sb-proj-row:hover .sb-proj-more { opacity:1; }
.sb-proj-row .sb-proj-more:hover { background:var(--hover-strong, var(--hover)); color:var(--text); }
.sb-proj-row:hover .sb-proj-count { opacity:0; }

/* caret 命中区：让点击 caret SVG 周围的 padding 也算命中（修 Bug 2） */
.sb-proj-caret {
  width:14px; height:14px;
  display:inline-flex; align-items:center; justify-content:center;
  color:var(--text-4);
  transform:rotate(-90deg);
  transition:transform 160ms var(--ease, ease);
  flex-shrink:0;
  cursor:pointer;
  padding:2px;
  margin:-2px;
  border-radius:4px;
}
.sb-proj-caret:hover { color:var(--text); background:var(--hover); }
.sb-proj-row.expanded .sb-proj-caret { transform:rotate(0); }

/* "新建项目" 虚线按钮（1:1 原型 .sb-proj-add） */
.sb-proj-add {
  display:flex; align-items:center; gap:8px;
  padding:7px 8px; border-radius:6px;
  font-size:12.5px; color:var(--text-4);
  cursor:pointer;
  border:1px dashed transparent;
  transition:all 140ms;
}
.sb-proj-add:hover {
  color:var(--ink);
  background:var(--ink-softer);
}

/* ══ prompt editor 底部工具栏 ══ */
.prompt-editor { display:flex; flex-direction:column; flex:1; min-height:0; }
.prompt-editor-foot {
  display:flex; align-items:center; justify-content:space-between;
  padding: 6px 2px 2px;
  font-size:11px; color:var(--text-4);
}
.prompt-editor-actions { display:flex; gap:4px; }
.prompt-foot-btn {
  display:inline-flex; align-items:center; gap:4px;
  padding:4px 8px; border-radius:6px;
  background:transparent; border:1px solid var(--border-soft);
  color:var(--text-3); font-size:11.5px; cursor:pointer;
  transition:background 120ms, border-color 120ms, color 120ms;
}
.prompt-foot-btn:hover { background:var(--hover); color:var(--text); border-color:var(--border); }
.proj-prompt-polish { color:var(--ink) !important; border-color:var(--ink-softer) !important; }
.proj-prompt-polish:hover { background:var(--ink-softer) !important; }

/* ══ 对话区 FAB（新对话按钮）══ */
.proj-chat-fab {
  display:flex; align-items:center; gap:6px;
  width:100%; padding:8px 12px; margin-bottom:8px;
  background:var(--ink-softer); border:1px solid var(--ink-soft);
  border-radius:9px; color:var(--ink); font-size:12px; font-weight:500;
  cursor:pointer; transition:background 120ms, border-color 120ms;
}
.proj-chat-fab:hover { background:var(--ink-soft); border-color:var(--ink); }

/* ─────────── 项目 创建/编辑 模态 G4 视觉重做 ─────────── */
.proj-modal-backdrop {
  position: fixed; inset: 0;
  background: rgba(20, 22, 20, 0.42);
  backdrop-filter: blur(6px);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 300;
  opacity: 0;
  transition: opacity 180ms;
  animation: none;
}
.proj-modal-backdrop.open { opacity: 1; }
.proj-modal {
  width: 480px;
  max-width: 92vw;
  max-height: 90vh;
  background: var(--card-bg);
  border-radius: 18px;
  box-shadow: 0 32px 80px rgba(0,0,0,0.28), 0 2px 6px rgba(0,0,0,0.06);
  border: 1px solid var(--border-soft);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  transform: translateY(10px) scale(0.98);
  transition: transform 220ms cubic-bezier(.2,.8,.2,1);
}
.proj-modal-backdrop.open .proj-modal { transform: translateY(0) scale(1); }
.proj-modal-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 18px 22px 14px;
}
.proj-modal-title { font-size: 15px; font-weight: 600; color: var(--text); }
.proj-modal-close {
  border: none; background: transparent; cursor: pointer;
  width: 30px; height: 30px; border-radius: 8px;
  color: var(--text-3);
  display: inline-flex; align-items: center; justify-content: center;
  transition: background 120ms, color 120ms;
}
.proj-modal-close:hover { background: var(--hover); color: var(--text); }
.proj-modal-body {
  padding: 4px 22px 14px;
  display: flex; flex-direction: column; gap: 12px;
  overflow-y: auto;
  flex: 1;
}
.proj-modal-field { display: flex; flex-direction: column; gap: 6px; }
.pm-label {
  font-size: 11.5px; font-weight: 600;
  letter-spacing: 0.04em; color: var(--text-3);
  display: inline-flex; align-items: center; gap: 6px;
  text-transform: uppercase;
}
.pm-required { font-weight: 500; color: var(--text-4); font-size: 10px; text-transform: none; letter-spacing: 0; }
.pm-optional { font-weight: 500; color: var(--text-5); font-size: 10px; text-transform: none; letter-spacing: 0; }
.pm-input {
  width: 100%; padding: 10px 13px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--card-bg);
  font-family: inherit; font-size: 13.5px;
  color: var(--text); outline: none;
  transition: border-color 140ms, box-shadow 140ms;
  box-sizing: border-box;
}
.pm-input::placeholder { color: var(--text-5); }
.pm-input:focus { border-color: var(--ink); box-shadow: 0 0 0 3px var(--ink-soft); }
.pm-input.error { border-color: var(--danger); box-shadow: 0 0 0 3px var(--danger-soft); }

/* G3 顶部大预览图标块（取代原"输入框前小色块 + popover"的紧凑结构） */
.pm-preview-wrap {
  display: flex; justify-content: center; align-items: center;
  padding: 0 0 2px;
}
.pm-name-icon {
  flex-shrink: 0;
  width: 52px; height: 52px;
  border-radius: 12px;
  border: none;
  display: inline-flex; align-items: center; justify-content: center;
  color: white; font-weight: 600; font-size: 19px;
  letter-spacing: 0.02em;
  box-shadow: 0 2px 6px rgba(0,0,0,0.10), inset 0 1px 0 rgba(255,255,255,0.10);
  transition: transform 200ms var(--ease);
}
.pm-name-icon.empty::before {
  content: ""; width: 18px; height: 18px;
  border: 1.5px dashed rgba(255,255,255,0.7); border-radius: 50%;
}
.pm-name-icon.empty .pm-name-icon-inner { display: none; }
.pm-name-icon .pm-name-icon-inner { display: inline-flex; align-items: center; justify-content: center; }
.pm-name-icon.pc-9 { color: #fff; }

/* 颜色行：14 色 grid 7×2，方圆均匀 */
.pm-color-row {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 6px;
  padding: 0;
}
.pm-color {
  width: 100%;
  aspect-ratio: 1;
  max-width: 26px;
  margin: 0 auto;
  border-radius: 50%;
  border: 2px solid transparent;
  cursor: pointer;
  position: relative;
  padding: 0;
  background: transparent;
  transition: transform 120ms;
}
.pm-color::after {
  content: ""; position: absolute; inset: 0;
  border-radius: 50%;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.10), inset 0 -1px 0 rgba(0,0,0,0.06);
}
.pm-color:hover { transform: scale(1.08); }
.pm-color.active {
  box-shadow: 0 0 0 2px var(--card-bg), 0 0 0 4px var(--ink);
  border-color: transparent;
}

/* 图标网格 8×4 */
.pm-icon-grid {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  gap: 4px;
  justify-items: center;
}
.pm-icon-cell {
  width: 100%; max-width: 34px; aspect-ratio: 1; border: none;
  background: transparent; color: var(--text-2);
  border-radius: 8px; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  transition: background 120ms, color 120ms, transform 120ms;
}
.pm-icon-cell:hover { background: var(--ink-softer); color: var(--ink); }
.pm-icon-cell:hover svg { transform: scale(1.06); }
.pm-icon-cell.active {
  background: var(--ink-soft);
  color: var(--ink);
  box-shadow: inset 0 0 0 1.5px var(--ink);
}

.pm-icon-text {
  margin-top: 4px;
  font-size: 12.5px;
}

/* foot + 按钮 */
.proj-modal-foot {
  padding: 14px 22px 18px;
  display: flex; justify-content: space-between; align-items: center;
  border-top: 1px solid var(--border-soft);
  background: var(--sidebar-bg);
}
.pm-btn {
  font-size: 13px; font-weight: 500;
  padding: 8px 18px;
  border-radius: 9px;
  border: 1px solid transparent;
  cursor: pointer;
  font-family: inherit;
  transition: background 140ms, border-color 140ms, color 140ms, transform 100ms;
}
.pm-btn:active { transform: scale(0.97); }
.pm-btn-ghost { background: transparent; color: var(--text-2); border-color: var(--border); }
.pm-btn-ghost:hover { color: var(--text); border-color: var(--text-4); background: var(--hover); }
.pm-btn-primary { background: var(--ink); color: white; }
html[data-theme="dark"] .pm-btn-primary { color: #14171a; }
.pm-btn-primary:hover { background: var(--ink-hover); }
.pm-btn-danger { background: transparent; color: var(--danger); border-color: transparent; }
.pm-btn-danger:hover { background: var(--danger-soft); }

/* ═══════ 波次 3：项目主页 1:1 补齐（原型 v2-enhancements 374-944）═══════ */

/* prompt contenteditable：与原型对齐 placeholder + 字数底栏 */
.proj-section-prompt .proj-prompt {
  outline: none;
  white-space: pre-wrap;
  min-height: 140px;
  max-height: calc(100vh - 320px);
  overflow-y: auto;
  cursor: text;
  resize: none;            /* 关键：禁掉之前 textarea 留下的右下三角 */
}
.proj-section-prompt .proj-prompt:empty::before {
  content: attr(data-placeholder);
  color: var(--text-5);
  white-space: pre-wrap;
  pointer-events: none;
}

/* 文件网格：三栏单列、卡片之间紧凑 */
body[data-proj-layout="threecol"] .proj-section-files .proj-file-grid {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

/* 中栏 .proj-chat-list 头部 fab：与原型一致 */
.proj-section-chats .proj-chat-list { display: flex; flex-direction: column; gap: 6px; }

/* 进项目主页时，已经有的 .proj-chat-row.active 残留视觉强清——
 * 严格防御：无论任何来源，都不让 .proj-chat-row 出现"自动选中"高亮 */
.proj-section-chats .proj-chat-row.active,
.proj-section-chats .proj-chat-row:focus,
.proj-section-chats .proj-chat-row:focus-within {
  background: transparent !important;
  border-color: rgba(31, 60, 51, 0.06) !important;
  outline: none !important;
}

/* === v2-polish-2 三栏视觉打磨（对齐 v2-polish-2.css:1012-1074） === */

/* 三栏卡片：更细的描边、更软的圆角、轻微 hover 抬起 */
body[data-proj-layout="threecol"] .proj-section-files,
body[data-proj-layout="threecol"] .proj-section-prompt,
body[data-proj-layout="threecol"] .proj-section-chats,
body[data-proj-layout="threecol"] .proj-mid-col {
  border-radius: 16px !important;
  border-color: rgba(31, 60, 51, 0.08) !important;
  box-shadow: 0 1px 0 rgba(31, 60, 51, 0.02), 0 6px 18px -8px rgba(31, 60, 51, 0.06) !important;
  padding-top: 0 !important;
  transition: box-shadow 200ms;
}
body[data-theme="dark"][data-proj-layout="threecol"] .proj-section-files,
body[data-theme="dark"][data-proj-layout="threecol"] .proj-section-prompt,
body[data-theme="dark"][data-proj-layout="threecol"] .proj-section-chats { border-color: rgba(255,255,255,0.06) !important; }

/* section head：更高、底分割线更细、标题更有层级感 */
body[data-proj-layout="threecol"] .proj-section-head {
  padding: 14px 18px !important;
  min-height: 48px !important;
  border-bottom: 1px solid rgba(31, 60, 51, 0.06) !important;
  margin-bottom: 0 !important;
  background: linear-gradient(180deg, rgba(31, 60, 51, 0.018) 0%, rgba(31, 60, 51, 0) 100%);
  border-radius: 16px 16px 0 0;
}
body[data-proj-layout="threecol"] .proj-section-title {
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.01em;
  color: var(--text-2) !important;
  display: inline-flex;
  align-items: center;
  gap: 7px;
}
body[data-proj-layout="threecol"] .proj-section-count {
  font-size: 10.5px !important;
  font-weight: 600 !important;
  padding: 1px 7px !important;
  background: rgba(31, 60, 51, 0.06) !important;
  color: var(--text-3) !important;
  border-radius: 999px !important;
  border: none !important;
  letter-spacing: 0.02em;
}

/* 给三个标题前加小色点，区分列的"角色" */
body[data-proj-layout="threecol"] .proj-section-files .proj-section-title::before,
body[data-proj-layout="threecol"] .proj-section-prompt .proj-section-title::before,
body[data-proj-layout="threecol"] .proj-section-chats > .proj-section-head .proj-section-title::before {
  content: '';
  width: 6px; height: 6px; border-radius: 50%;
  flex-shrink: 0;
}
body[data-proj-layout="threecol"] .proj-section-files .proj-section-title::before { background: #d97757; }
body[data-proj-layout="threecol"] .proj-section-chats > .proj-section-head .proj-section-title::before { background: var(--ink); }
body[data-proj-layout="threecol"] .proj-section-prompt .proj-section-title::before { background: #c9a96e; }

/* 内容区与 head 之间不再 padding-top，让 head 真的"贴着" */
body[data-proj-layout="threecol"] .proj-section-files .proj-file-grid,
body[data-proj-layout="threecol"] .proj-section-prompt .prompt-editor,
body[data-proj-layout="threecol"] .proj-section-chats .proj-chat-list-wrap,
body[data-proj-layout="threecol"] .proj-section-chats .proj-chat-list {
  padding: 12px 14px 14px !important;
}

/* P1-5 compact 模式下文件图标角标隐藏（对齐 v2-polish-2.css:958-959） */
body[data-file-density="compact"] .proj-section-files .proj-file-icon::before,
body[data-file-density="compact"] .proj-section-files .proj-file-icon::after { display: none; }

/* B3 项目对话空状态 */
.proj-chat-empty {
  display: flex; flex-direction: column; align-items: center;
  gap: 8px; padding: 28px 16px;
  border: 1px dashed var(--border-soft); border-radius: 12px;
  color: var(--text-4); text-align: center;
}
.proj-chat-empty svg { width: 48px; height: 48px; color: var(--text-5); opacity: 0.85; }
.proj-chat-empty-title { font-size: 13.5px; color: var(--text-2); font-weight: 500; margin-top: 2px; }
.proj-chat-empty-sub { font-size: 12px; color: var(--text-4); }
.proj-chat-empty-cta {
  margin-top: 8px; padding: 6px 14px; font-size: 12.5px;
  background: var(--ink); color: #fff; border-radius: 999px;
  transition: background 120ms;
}
.proj-chat-empty-cta:hover { background: var(--ink-hover); }
html[data-theme="dark"] .proj-chat-empty-cta { color: #14171a; }

/* C2 项目「⋯」菜单 popover */
.sb-proj-menu {
  position: fixed;
  z-index: 80;
  min-width: 144px;
  padding: 4px;
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.12), 0 1px 3px rgba(0,0,0,0.06);
  display: flex;
  flex-direction: column;
  gap: 1px;
  animation: projMenuIn 120ms var(--ease) both;
}
@keyframes projMenuIn {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: translateY(0); }
}
.sb-proj-menu-item {
  display: flex; align-items: center; gap: 8px;
  padding: 7px 10px;
  font-size: 12.5px; color: var(--text);
  background: transparent; border-radius: 6px;
  text-align: left; cursor: pointer;
  transition: background 100ms;
}
.sb-proj-menu-item:hover { background: var(--hover); }
.sb-proj-menu-item.danger { color: var(--danger); }
.sb-proj-menu-item.danger:hover { background: var(--danger-soft); }
.sb-proj-menu-item svg { color: currentColor; flex-shrink: 0; }

/* C5 项目资料卡 UI 升级（复用 attach-badge 设计语言） */

/* 上传区：圆角加大、底色加深、文案 500、虚线更明显 */
.proj-section-files .proj-file-upload {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  border: 1.5px dashed rgba(31, 60, 51, 0.22) !important;
  background: var(--ink-softer) !important;
  color: var(--text-3) !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  border-radius: 12px !important;
  padding: 14px 12px !important;
  line-height: 1 !important;
  transition: all 160ms var(--ease) !important;
}
.proj-section-files .proj-file-upload svg {
  color: var(--ink);
  opacity: 0.7;
  flex-shrink: 0;
  display: block;
}
.proj-section-files .proj-file-upload:hover {
  border-color: var(--ink) !important;
  background: var(--ink-soft) !important;
  color: var(--ink) !important;
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(31, 60, 51, 0.06);
}
.proj-section-files .proj-file-upload:hover svg { opacity: 1; }
.proj-section-files .proj-file-upload.dragover {
  border-color: var(--ink) !important;
  border-style: solid !important;
  background: var(--ink-soft) !important;
  color: var(--ink) !important;
}
/* 深色模式：原虚线 rgba(31, 60, 51, 0.22) 在深底上几乎看不见，提到 0.22 alpha 的白色；
   底色用透明白叠加而不是 --ink-softer（避免叠加偏绿）。 */
html[data-theme="dark"] .proj-section-files .proj-file-upload {
  border-color: rgba(255, 255, 255, 0.18) !important;
  background: rgba(255, 255, 255, 0.025) !important;
  color: var(--text-3) !important;
}
html[data-theme="dark"] .proj-section-files .proj-file-upload:hover {
  border-color: var(--ink) !important;
  background: rgba(127, 195, 158, 0.10) !important;
}
html[data-theme="dark"] .proj-section-files .proj-file-upload svg {
  color: var(--text-2);
}

/* 文件卡：圆角 12、hover 阴影更明显 */
.proj-section-files .proj-file-card {
  border: 1px solid var(--border-soft) !important;
  background: var(--card-bg) !important;
  border-radius: 12px !important;
  padding: 10px 12px !important;
  gap: 10px !important;
  /* 密度切换（大块 ↔ 紧凑）需要 padding/gap 也过渡，避免硬切 */
  transition: padding 200ms cubic-bezier(.2,.8,.2,1), gap 200ms cubic-bezier(.2,.8,.2,1), border-color 140ms, box-shadow 140ms, transform 140ms !important;
}
.proj-section-files .proj-file-card:hover {
  border-color: var(--border) !important;
  background: var(--card-bg) !important;
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06) !important;
}
/* 深色模式：第二段也叠一层 --card-bg-2，避免被同优先级的 --card-bg 覆盖 */
html[data-theme="dark"] .proj-section-files .proj-file-card {
  background: var(--card-bg-2) !important;
  border-color: rgba(255, 255, 255, 0.06) !important;
}
html[data-theme="dark"] .proj-section-files .proj-file-card:hover {
  background: rgba(255, 255, 255, 0.04) !important;
  border-color: rgba(255, 255, 255, 0.14) !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5) !important;
}

/* 文件类型徽章：实色 + 白字（与 composer attach-badge 一致） */
.proj-section-files .proj-file-icon {
  width: 38px !important;
  height: 38px !important;
  padding: 0 !important;
  border-radius: 8px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em !important;
  color: #fff !important;
  /* 密度切换时尺寸/字号过渡 */
  transition: width 200ms cubic-bezier(.2,.8,.2,1), height 200ms cubic-bezier(.2,.8,.2,1), font-size 200ms, border-radius 200ms !important;
  background: var(--text-3) !important;
  border: none !important;
}
.proj-section-files .proj-file-icon::before,
.proj-section-files .proj-file-icon::after { display: none !important; }
.proj-section-files .proj-file-icon.ft-pdf { background: #c14343 !important; color: #fff !important; }
.proj-section-files .proj-file-icon.ft-doc,
.proj-section-files .proj-file-icon.ft-docx { background: #3a6db1 !important; color: #fff !important; }
.proj-section-files .proj-file-icon.ft-xls,
.proj-section-files .proj-file-icon.ft-xlsx { background: #2f8a55 !important; color: #fff !important; }
.proj-section-files .proj-file-icon.ft-ppt,
.proj-section-files .proj-file-icon.ft-pptx { background: #c8743a !important; color: #fff !important; }
.proj-section-files .proj-file-icon.ft-txt,
.proj-section-files .proj-file-icon.ft-md { background: #6c6e75 !important; color: #fff !important; }
.proj-section-files .proj-file-icon.ft-png,
.proj-section-files .proj-file-icon.ft-jpg { background: #8a4fbf !important; color: #fff !important; }
.proj-section-files .proj-file-icon.ft-audio { background: #8a4fbf !important; color: #fff !important; }
.proj-section-files .proj-file-icon.ft-video { background: #c14377 !important; color: #fff !important; }
html[data-theme="dark"] .proj-section-files .proj-file-icon { color: #f5f4ef !important; }

/* 删除按钮：默认半透明，hover 卡片时变明显 */
.proj-section-files .proj-file-del { opacity: 0; transition: opacity 120ms; }
.proj-section-files .proj-file-card:hover .proj-file-del { opacity: 0.7; }
.proj-section-files .proj-file-del:hover { opacity: 1; color: var(--danger); }

/* F4 项目子对话空状态：从"白底大字横跨整列"改成弱提示风格——
   小字、灰色、左缩进对齐 .sb-child-row，不打扰视觉。 */
.sb-child-empty {
  padding: 6px 10px;
  font-size: 11.5px;
  color: var(--text-4);
  font-style: italic;
  letter-spacing: 0.02em;
  background: transparent;
  border: none;
  margin: 0;
  line-height: 1.4;
}

/* H2 折叠 toggle：默认折叠，点开露出颜色 + 图标分组 */
.pm-advanced-toggle {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 10px;
  margin: -4px 0;
  border: none;
  background: transparent;
  color: var(--text-3);
  font-family: inherit; font-size: 12.5px;
  cursor: pointer;
  border-radius: 8px;
  align-self: flex-start;
  transition: background 120ms, color 120ms;
}
.pm-advanced-toggle:hover { background: var(--hover); color: var(--text); }
.pm-adv-chevron { transition: transform 180ms var(--ease); }
.pm-advanced-toggle.expanded .pm-adv-chevron { transform: rotate(180deg); }
.pm-advanced {
  display: flex; flex-direction: column; gap: 12px;
  animation: viewFadeIn 200ms var(--ease) both;
}
.pm-advanced[hidden] { display: none !important; animation: none; }

/* H4 自定义图标输入分组 */
.pm-icon-custom { display: flex; flex-direction: column; gap: 4px; margin-top: 2px; }
.pm-sublabel {
  font-size: 11px;
  color: var(--text-4);
  letter-spacing: 0.02em;
}