/* ============================================================
   聚浪内容工坊 V2 · 内容创作中心三栏工作台
   左栏 = 创作流程 + 拆解卡片 / 中栏 = 主流程 / 右栏 = 生成配置 + AI 状态
   设计令牌全部挂在 .cs-shell 上（组件只消费变量，不写死颜色）
   ============================================================ */

/* ---------- 系统左侧菜单里的「内容创作中心」直达链接 ---------- */
.nav-direct-link { text-decoration:none; }
.nav-direct-link .ng-chevron { transform:none !important; }
.nav-group-direct .nav-direct-link { background:transparent; }
.nav-group-direct .nav-direct-link:hover { color:#1e293b; background:#f8fafc; }
.nav-group-direct .nav-direct-link.active { color:#694fe7; background:#f0edff; font-weight:500; }

/* 进入创作中心时让出版面：隐藏全局顶栏，页面自己铺满 */
.content-studio-mode .topbar { display:none; }
.content-studio-mode .main-content { background:#f6f4fb; padding-top:0; }
.content-studio-page {
  padding:0 !important; min-height:100vh;
  background:
    radial-gradient(circle at 14% 4%,rgba(216,240,231,.5),transparent 32%),
    radial-gradient(circle at 86% 2%,rgba(250,224,235,.48),transparent 30%),
    linear-gradient(135deg,#faf9ff 0%,#f7f5fc 54%,#fdf8f7 100%);
}

/* ---------- 设计令牌 ---------- */
.cs-shell {
  --ink:#3b3552; --ink-strong:#2c2644; --ink-2:#6f6987; --ink-3:#9a94ad; --ink-4:#b8b2c7;
  --line:#ece7f5; --line-2:#f3f0fa; --soft:#faf9fe; --card:#fff;
  --violet:#8b7ae8; --violet-2:#a78bfa; --violet-ink:#5f4fc4; --violet-bg:#f1eefe; --violet-line:#e2dbfb;
  --mint:#4fc3a1; --mint-ink:#2f9c7d; --mint-bg:#e9f9f2; --mint-line:#d3f0e4;
  --pink:#ee9cb4; --pink-ink:#c96b86; --pink-bg:#fdeef4; --pink-line:#f8dde7;
  --amber:#e0ad62; --amber-ink:#a97c33; --amber-bg:#fdf5e7; --amber-line:#f6e6cb;
  --sh1:0 6px 18px rgba(122,102,190,.055); --sh2:0 12px 30px rgba(122,102,190,.075);
  --r-lg:20px; --r-md:14px; --r-sm:11px;
  color:var(--ink); font-size:13px;
}
.cs-shell * { box-sizing:border-box; }
.cs-shell i[class*="fa-"] { font-style:normal; }

/* ---------- 页面顶端一级导航：创作 / 合规 ---------- */
.cs-workspace-nav {
  position:sticky; top:0; z-index:35; width:100%; border-bottom:1px solid rgba(226,219,248,.9);
  background:rgba(255,255,255,.88); backdrop-filter:blur(18px) saturate(145%); -webkit-backdrop-filter:blur(18px) saturate(145%);
  box-shadow:0 5px 20px rgba(105,79,180,.055);
}
.cs-workspace-nav-inner { width:min(1520px,100%); min-height:68px; margin:0 auto; padding:0 clamp(14px,2.2vw,30px); display:flex; align-items:center; gap:24px; }
.cs-workspace-title { display:flex; align-items:center; gap:10px; flex:none; }
.cs-workspace-title .mark { width:35px; height:35px; border-radius:12px; display:flex; align-items:center; justify-content:center; color:#fff; background:linear-gradient(145deg,#58c7aa,#8b7ae8); box-shadow:0 7px 16px rgba(111,93,202,.22); }
.cs-workspace-title b,.cs-workspace-title small { display:block; }
.cs-workspace-title b { color:var(--ink-strong); font-size:14px; font-weight:800; }
.cs-workspace-title small { margin-top:3px; color:var(--ink-4); font-size:8px; font-weight:700; letter-spacing:1.3px; }
.cs-workspace-links { align-self:stretch; display:flex; align-items:stretch; gap:4px; }
.cs-workspace-links button { position:relative; min-width:126px; padding:0 20px; border:0; background:transparent; color:var(--ink-3); font:750 13px/1 inherit; cursor:pointer; transition:color .16s,background .16s; }
.cs-workspace-links button i { margin-right:7px; }
.cs-workspace-links button:hover { color:var(--violet-ink); background:rgba(241,238,254,.55); }
.cs-workspace-links button.on { color:var(--violet-ink); background:linear-gradient(180deg,rgba(243,240,255,.3),rgba(240,236,255,.78)); }
.cs-workspace-links button.on:after { content:''; position:absolute; left:20px; right:20px; bottom:0; height:3px; border-radius:3px 3px 0 0; background:linear-gradient(90deg,#8b7ae8,#5bc8aa); }
.cs-workspace-note { margin-left:auto; display:flex; align-items:center; gap:7px; color:var(--mint-ink); font-size:10.5px; font-weight:650; }

/* ---------- 页面骨架 ---------- */
.cs-page { width:min(1520px,100%); margin:0 auto; padding:22px clamp(14px,2.2vw,30px) 44px; }
.cs-layout { display:grid; grid-template-columns:220px minmax(0,1fr) 272px; gap:15px; align-items:start; }
.cs-rail { display:flex; flex-direction:column; }
.cs-main { min-width:0; display:flex; flex-direction:column; gap:14px; }
.cs-rail > .cs-card + .cs-card { margin-top:14px; }

/* ★★ 左右两栏跟随中栏下滑固定
   吸顶基准 = 顶端导航条（68px）+ 页面内边距（22px）+ 呼吸位（8px）= 98px。
   栅格项默认 stretch 会把 rail 拉满整行 → sticky 失效，必须 align-self:start。
   内容比视口高时内部滚动（max-height + overflow:auto），保证底部卡片仍可达。 */
.cs-rail-left, .cs-rail-right {
  position:sticky; top:98px; align-self:start;
  max-height:calc(100vh - 110px); overflow:auto; overscroll-behavior:contain;
  padding-right:2px; scrollbar-width:thin;
}
.cs-rail-left::-webkit-scrollbar, .cs-rail-right::-webkit-scrollbar { width:5px; }
.cs-rail-left::-webkit-scrollbar-thumb, .cs-rail-right::-webkit-scrollbar-thumb { background:var(--violet-line); border-radius:99px; }
.cs-rail-left::-webkit-scrollbar-track, .cs-rail-right::-webkit-scrollbar-track { background:transparent; }
/* 吸顶层去掉卡片阴影裁切感：滚动时边缘更干净 */
.cs-rail-left > .cs-card, .cs-rail-right > .cs-card { flex:none; }

/* ---------- 卡片 ---------- */
.cs-card {
  position:relative; background:var(--card); border:1px solid var(--line); border-radius:var(--r-lg);
  box-shadow:var(--sh1); overflow:hidden;
}
.cs-card.tint-mint { background:linear-gradient(160deg,#f4fdf9 0%,#fff 62%); border-color:var(--mint-line); }
.cs-card.tint-pink { background:linear-gradient(160deg,#fdf4f7 0%,#fff 62%); border-color:var(--pink-line); }
.cs-pad { padding:0 16px 16px; }
.cs-head { display:flex; align-items:flex-start; gap:9px; padding:15px 16px 13px; }
.cs-head .grow { flex:1; min-width:0; }
.cs-title { color:var(--ink-strong); font-size:13.5px; font-weight:750; letter-spacing:.1px; }
.cs-sub { margin-top:4px; color:var(--ink-3); font-size:11px; line-height:1.6; }
.cs-chip {
  flex:none; width:26px; height:26px; border-radius:9px; display:flex; align-items:center; justify-content:center;
  border:1px solid var(--violet-line); background:var(--violet-bg); color:var(--violet-ink); font-size:11px;
}
.cs-chip.mint { border-color:var(--mint-line); background:var(--mint-bg); color:var(--mint-ink); }
.cs-chip.pink { border-color:var(--pink-line); background:var(--pink-bg); color:var(--pink-ink); }
.cs-chip.amber { border-color:var(--amber-line); background:var(--amber-bg); color:var(--amber-ink); }
.cs-chip.plain { border-color:var(--line); background:var(--soft); color:var(--ink-3); }

/* ---------- 徽标 / 药丸按钮 ---------- */
.cs-badge {
  display:inline-flex; align-items:center; gap:5px; padding:4px 9px; border-radius:99px; white-space:nowrap;
  border:1px solid var(--violet-line); background:var(--violet-bg); color:var(--violet-ink);
  font-size:10px; font-weight:700;
}
.cs-badge.mint { border-color:var(--mint-line); background:var(--mint-bg); color:var(--mint-ink); }
.cs-badge.pink { border-color:var(--pink-line); background:var(--pink-bg); color:var(--pink-ink); }
.cs-badge.amber { border-color:var(--amber-line); background:var(--amber-bg); color:var(--amber-ink); }
.cs-badge.gray { border-color:#eae7f3; background:#f4f3f9; color:var(--ink-3); }
.cs-btn {
  display:inline-flex; align-items:center; gap:5px; cursor:pointer; white-space:nowrap;
  border:1px solid var(--line); background:#fff; color:var(--ink-2);
  border-radius:99px; padding:7px 12px; font:700 11px/1 inherit;
  transition:border-color .15s,color .15s,box-shadow .15s,transform .15s;
}
.cs-btn:hover { border-color:var(--violet-line); color:var(--violet-ink); box-shadow:var(--sh1); }
.cs-btn.primary { border-color:transparent; background:linear-gradient(135deg,#8b7ae8,#a98bf0); color:#fff; box-shadow:0 6px 14px rgba(139,122,232,.24); }
.cs-btn.mint { border-color:transparent; background:linear-gradient(135deg,#4fc3a1,#66cfb2); color:#fff; box-shadow:0 6px 14px rgba(79,195,161,.22); }
.cs-btn.ghost { background:var(--soft); border-color:var(--line-2); }
.cs-btn.wide { width:100%; justify-content:center; min-height:38px; font-size:12px; }
.cs-btn:disabled { opacity:.55; cursor:not-allowed; transform:none; box-shadow:none; }

/* ---------- 左栏：品牌 / 用户 ---------- */
.cs-brand { display:flex; align-items:center; gap:11px; padding:14px; }
.cs-brand-mark {
  flex:none; width:38px; height:38px; border-radius:13px; display:flex; align-items:center; justify-content:center;
  color:#fff; font-size:15px; background:linear-gradient(145deg,#6fd0bd,#8b7ae8);
  box-shadow:0 8px 18px rgba(139,122,232,.24);
}
.cs-brand-name { color:var(--ink-strong); font-size:14.5px; font-weight:780; letter-spacing:.3px; }
.cs-brand-sub { margin-top:4px; color:var(--ink-4); font-size:9px; font-weight:600; letter-spacing:1.5px; }
.cs-user { display:flex; align-items:center; gap:11px; padding:12px 13px; }
.cs-user-avatar {
  flex:none; width:40px; height:40px; border-radius:14px; display:flex; align-items:center; justify-content:center;
  color:#fff; font-size:15px; font-weight:800; background:linear-gradient(145deg,#ee9cb4,#c98ee0);
  box-shadow:0 6px 14px rgba(238,156,180,.26);
}
.cs-user-copy { min-width:0; }
.cs-user-name { color:var(--ink-strong); font-size:13px; font-weight:750; }
.cs-user-role { margin-top:3px; color:var(--ink-3); font-size:10.5px; }
.cs-user-tag { margin-top:7px; }

/* ---------- 左栏：创作流程 ---------- */
.cs-flow-head { display:flex; align-items:center; justify-content:space-between; padding:15px 16px 10px; }
.cs-flow-head .t { color:var(--ink-strong); font-size:12.5px; font-weight:750; }
.cs-flow-head .p { color:var(--violet-ink); font-size:12.5px; font-weight:800; }
.cs-bar { height:5px; margin:0 16px 13px; border-radius:99px; background:#f0edfa; overflow:hidden; }
.cs-bar > i { display:block; height:100%; border-radius:99px; background:linear-gradient(90deg,#8b7ae8,#b39ff5); transition:width .3s; }
.cs-steps { list-style:none; margin:0; padding:0 10px 12px; display:flex; flex-direction:column; gap:2px; }
.cs-step { display:flex; gap:10px; padding:7px 6px; border-radius:10px; }
.cs-step .n {
  flex:none; width:22px; height:22px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  border:1px solid #ebe8f4; background:#f2f0f8; color:var(--ink-4); font-size:10.5px; font-weight:800;
}
.cs-step .txt { min-width:0; }
.cs-step .txt b { display:block; color:var(--ink); font-size:11.5px; font-weight:700; }
.cs-step .txt small { display:block; margin-top:3px; color:var(--ink-4); font-size:9.5px; line-height:1.45; }
.cs-step.done .n { border-color:transparent; background:linear-gradient(145deg,#8b7ae8,#a98bf0); color:#fff; box-shadow:0 4px 10px rgba(139,122,232,.26); }
.cs-step.now { background:var(--violet-bg); }
.cs-step.now .n { border:1.5px solid var(--violet-2); background:#fff; color:var(--violet-ink); }
.cs-step.todo .txt b { color:var(--ink-3); font-weight:600; }

/* ---------- 左栏：卡片列表 ---------- */
.cs-list { display:flex; flex-direction:column; gap:6px; padding:0 10px 12px; }
.cs-list.scroll { max-height:340px; overflow:auto; }
.cs-draft {
  display:flex; align-items:center; gap:8px; padding:8px; width:100%; text-align:left; cursor:pointer;
  border:1px solid transparent; border-radius:10px; background:transparent; font:inherit;
}
.cs-draft:hover { background:var(--soft); border-color:var(--line-2); }
.cs-draft.on { background:var(--violet-bg); border-color:var(--violet-line); }
.cs-draft .copy { flex:1; min-width:0; }
/* 卡片内文案块：外层是 flex 项被块级化，内层 span 仍需显式块级，否则标题与时间同行 */
.cs-draft .nm, .cs-draft .mt, .cs-item .h { display:block; }
.cs-draft .nm { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--ink); font-size:11.5px; font-weight:650; }
.cs-draft .mt { margin-top:4px; color:var(--ink-4); font-size:9.5px; }
.cs-card-delete { flex:none; display:inline-flex; align-items:center; justify-content:center; width:25px; height:25px; padding:0; border:0; border-radius:8px; background:transparent; color:var(--ink-4); cursor:pointer; font-size:10px; transition:color .15s,background .15s; }
.cs-card-delete:hover { background:var(--pink-bg); color:var(--pink-ink); }
.cs-empty { padding:22px 16px; text-align:center; color:var(--ink-4); font-size:11px; line-height:1.75; }
.cs-empty i { display:block; margin-bottom:9px; color:#c3bcf4; font-size:22px; }

/* ---------- 中栏：工具条 / 分页签 ---------- */
.cs-toolbar { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.cs-tabs { display:inline-flex; gap:3px; padding:3px; border:1px solid var(--line-2); border-radius:99px; background:#f2effb; }
.cs-tab {
  display:inline-flex; align-items:center; gap:6px; cursor:pointer; border:0; background:transparent;
  border-radius:99px; padding:8px 15px; color:var(--ink-3); font:700 12px/1 inherit;
}
.cs-tab.on { background:#fff; color:var(--violet-ink); box-shadow:0 4px 10px rgba(139,122,232,.16); }
.cs-toolbar .right { margin-left:auto; display:flex; align-items:center; gap:8px; flex-wrap:wrap; }

/* ---------- 中栏：概览卡 ---------- */
.cs-hero { padding:19px 20px 17px; border-color:#e8e2f8; background:linear-gradient(112deg,#f3efff 0%,#fdf3f7 52%,#fdf1ec 100%); }
.cs-hero:after {
  content:''; position:absolute; right:-60px; top:-150px; width:250px; height:250px; border-radius:50%;
  background:rgba(255,255,255,.42);
}
.cs-hero-top { position:relative; z-index:2; display:flex; gap:16px; align-items:flex-start; }
.cs-hero-top .col { flex:1; min-width:0; }
.cs-kicker { color:var(--mint-ink); font-size:10px; font-weight:800; letter-spacing:1.6px; }
.cs-hero h1 { margin:7px 0 8px; color:var(--ink-strong); font-size:25px; font-weight:800; line-height:1.18; letter-spacing:-.6px; }
.cs-hero p { margin:0; max-width:620px; color:var(--ink-2); font-size:12px; line-height:1.7; }
.cs-hero-art {
  flex:none; width:118px; height:86px; border-radius:22px 22px 14px 22px; align-self:flex-end; margin-bottom:-12px;
  display:flex; align-items:center; justify-content:center; color:#8b7ae8; font-size:30px;
  background:rgba(255,255,255,.5); box-shadow:inset 0 0 0 1px rgba(255,255,255,.6); transform:rotate(-3deg);
}
.cs-stats { position:relative; z-index:2; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:9px; margin-top:17px; }
.cs-stat { padding:11px 13px; border-radius:var(--r-md); border:1px solid rgba(255,255,255,.9); background:rgba(255,255,255,.72); box-shadow:0 5px 13px rgba(122,102,190,.06); }
.cs-stat b { display:block; color:#5b4bbd; font-size:19px; font-weight:800; line-height:1; }
.cs-stat span { display:block; margin-top:6px; color:var(--ink-3); font-size:10px; }

/* ---------- 表单控件 ---------- */
.cs-field { min-width:0; }
.cs-label { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:7px; color:var(--ink-2); font-size:11.5px; font-weight:750; }
.cs-label em { font-style:normal; color:var(--ink-4); font-size:10px; font-weight:600; }
.cs-ta {
  width:100%; min-height:120px; resize:vertical; outline:0; padding:11px 12px;
  border:1px solid #eae6f4; border-radius:var(--r-sm); background:#fffdfe; color:var(--ink);
  font:12px/1.75 inherit; transition:border-color .15s,box-shadow .15s;
}
.cs-ta:focus { border-color:var(--violet-2); box-shadow:0 0 0 4px rgba(139,122,232,.1); }
.cs-ta::placeholder { color:var(--ink-4); }
.cs-ta.line { min-height:38px; height:38px; padding:9px 12px; resize:none; }
.cs-count { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:9px; color:var(--ink-4); font-size:10px; }
.cs-count .cache { display:inline-flex; align-items:center; gap:5px; color:var(--mint-ink); }
.cs-hint { color:var(--ink-4); font-size:10.5px; line-height:1.6; }
.cs-row-actions { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:11px; flex-wrap:wrap; }
.cs-status {
  display:none; align-items:flex-start; gap:7px; margin-top:10px; padding:9px 11px;
  border-radius:9px; background:var(--violet-bg); color:var(--violet-ink); font-size:11px; line-height:1.6;
}
.cs-status.show { display:flex; }
.cs-status.error { background:#fff2f3; color:#c65a65; }

/* 品类卡片式选择器：与品类营销数据共用服务端统一品类列表 */
.cs-category-picker { position:relative; z-index:20; min-height:56px; border:1px solid var(--line); border-radius:14px; background:linear-gradient(135deg,#fff 0%,#fcfaff 100%); box-shadow:0 5px 14px rgba(122,102,190,.045); transition:border-color .16s,box-shadow .16s,background .16s; }
.cs-category-picker:hover,.cs-category-picker.open { border-color:var(--violet-2); background:#fff; box-shadow:0 0 0 4px rgba(139,122,232,.1),0 8px 20px rgba(122,102,190,.07); }
.cs-category-picker.open { z-index:80; }
.cs-card:has(.cs-category-picker.open) { overflow:visible; }
.cs-category-trigger { display:flex; align-items:center; gap:10px; width:100%; min-height:56px; padding:8px 10px; border:0; background:transparent; color:inherit; cursor:pointer; text-align:left; font:inherit; }
.cs-category-icon {
  flex:none; width:40px; height:40px; border-radius:12px; display:flex; align-items:center; justify-content:center;
  border:1px solid var(--violet-line); background:linear-gradient(145deg,var(--violet-bg),#f9f6ff); color:var(--violet-ink);
  font-size:14px; box-shadow:inset 0 1px 0 rgba(255,255,255,.8); transition:color .16s,background .16s,border-color .16s;
}
.cs-category-picker.filled .cs-category-icon {
  border-color:var(--mint-line); background:linear-gradient(145deg,var(--mint-bg),#f7fffb); color:var(--mint-ink);
}
.cs-category-body { flex:1; min-width:0; }
.cs-category-body small,.cs-category-body b { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cs-category-body small { margin-bottom:4px; color:var(--ink-3); font-size:9.5px; font-weight:700; letter-spacing:.25px; }
.cs-category-body b { color:var(--ink-strong); font-size:13px; line-height:1.45; }
.cs-category-body b:first-child { margin:0; }
.cs-category-chevron { flex:none; margin:0 6px; color:var(--ink-4); font-size:10px; transition:transform .16s,color .16s; }
.cs-category-picker.open .cs-category-chevron { color:var(--violet-ink); transform:rotate(180deg); }
.cs-category-menu { position:absolute; left:8px; right:8px; top:calc(100% + 7px); max-height:250px; overflow:auto; padding:6px; border:1px solid var(--violet-line); border-radius:13px; background:rgba(255,255,255,.98); box-shadow:0 16px 35px rgba(70,52,145,.16),0 2px 8px rgba(70,52,145,.08); backdrop-filter:blur(16px); }
.cs-category-option { display:flex; align-items:center; justify-content:space-between; gap:8px; width:100%; min-height:36px; padding:7px 9px; border:1px solid transparent; border-radius:9px; background:transparent; color:var(--ink-2); cursor:pointer; font:650 11px/1.4 inherit; text-align:left; }
.cs-category-option:hover { border-color:var(--line-2); background:var(--soft); color:var(--ink); }
.cs-category-option.on { border-color:var(--mint-line); background:var(--mint-bg); color:var(--mint-ink); }
.cs-category-option i { color:var(--mint-ink); font-size:10px; }
.cs-category-empty { padding:13px 8px; color:var(--ink-4); font-size:10px; line-height:1.6; text-align:center; }
.cs-category-clear {
  position:absolute; right:10px; top:50%; transform:translateY(-50%); width:24px; height:24px; padding:0; border:0; border-radius:8px; background:var(--soft); color:var(--ink-4);
  cursor:pointer; font-size:10px; transition:color .15s,background .15s;
}
.cs-category-clear:hover { background:var(--violet-bg); color:var(--violet-ink); }
.cs-category-hint { display:flex; align-items:flex-start; gap:6px; margin-top:7px; color:var(--ink-4); font-size:10px; line-height:1.55; }
.cs-category-hint i { margin-top:2px; color:#a99dde; }

/* 产品名称必须来自产品词库：自绘选择器避免自由输入造成词库匹配失效 */
.cs-product-picker { position:relative; z-index:21; min-height:56px; border:1px solid var(--line); border-radius:14px; background:linear-gradient(135deg,#fff 0%,#fcfaff 100%); box-shadow:0 5px 14px rgba(122,102,190,.045); transition:border-color .16s,box-shadow .16s,background .16s; }
.cs-product-picker:hover,.cs-product-picker.open { border-color:var(--violet-2); background:#fff; box-shadow:0 0 0 4px rgba(139,122,232,.1),0 8px 20px rgba(122,102,190,.07); }
.cs-product-picker.open { z-index:90; }
.cs-card:has(.cs-product-picker.open),.cs-modal:has(.cs-product-picker.open) { overflow:visible; }
.cs-product-picker-trigger { display:flex; align-items:center; gap:10px; width:100%; min-height:56px; padding:8px 10px; border:0; background:transparent; color:inherit; cursor:pointer; text-align:left; font:inherit; }
.cs-product-picker-icon { flex:none; width:40px; height:40px; border-radius:12px; display:flex; align-items:center; justify-content:center; border:1px solid var(--violet-line); background:linear-gradient(145deg,var(--violet-bg),#f9f6ff); color:var(--violet-ink); font-size:14px; box-shadow:inset 0 1px 0 rgba(255,255,255,.8); transition:color .16s,background .16s,border-color .16s; }
.cs-product-picker.filled .cs-product-picker-icon { border-color:var(--mint-line); background:linear-gradient(145deg,var(--mint-bg),#f7fffb); color:var(--mint-ink); }
.cs-product-picker-body { flex:1; min-width:0; }
.cs-product-picker-body small,.cs-product-picker-body b { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cs-product-picker-body small { margin-bottom:4px; color:var(--ink-3); font-size:9.5px; font-weight:700; letter-spacing:.25px; }
.cs-product-picker-body small em { color:var(--pink-ink); font-style:normal; }
.cs-product-picker-body b { color:var(--ink-strong); font-size:13px; line-height:1.45; }
.cs-product-picker-chevron { flex:none; margin:0 6px; color:var(--ink-4); font-size:10px; transition:transform .16s,color .16s; }
.cs-product-picker.open .cs-product-picker-chevron { color:var(--violet-ink); transform:rotate(180deg); }
.cs-product-picker-menu { position:absolute; left:8px; right:8px; top:calc(100% + 7px); max-height:250px; overflow:auto; padding:6px; border:1px solid var(--violet-line); border-radius:13px; background:rgba(255,255,255,.98); box-shadow:0 16px 35px rgba(70,52,145,.16),0 2px 8px rgba(70,52,145,.08); backdrop-filter:blur(16px); }
.cs-product-picker-option { display:flex; align-items:center; justify-content:space-between; gap:8px; width:100%; min-height:36px; padding:7px 9px; border:1px solid transparent; border-radius:9px; background:transparent; color:var(--ink-2); cursor:pointer; font:650 11px/1.4 inherit; text-align:left; }
.cs-product-picker-option:hover { border-color:var(--line-2); background:var(--soft); color:var(--ink); }
.cs-product-picker-option.on { border-color:var(--mint-line); background:var(--mint-bg); color:var(--mint-ink); }
.cs-product-picker-option i { color:var(--mint-ink); font-size:10px; }
.cs-product-picker-empty { padding:13px 8px; color:var(--ink-4); font-size:10px; line-height:1.6; text-align:center; }
.cs-product-picker-clear { position:absolute; right:10px; top:50%; transform:translateY(-50%); width:24px; height:24px; padding:0; border:0; border-radius:8px; background:var(--soft); color:var(--ink-4); cursor:pointer; font-size:10px; transition:color .15s,background .15s; }
.cs-product-picker-clear:hover { background:var(--violet-bg); color:var(--violet-ink); }
.cs-product-picker-hint { display:flex; align-items:flex-start; gap:6px; margin-top:7px; color:var(--ink-4); font-size:10px; line-height:1.55; }
.cs-product-picker-hint i { margin-top:2px; color:#a99dde; }

/* 风格偏好：自绘下拉，避免浏览器原生 select 的样式割裂 */
.cs-style-select { position:relative; z-index:10; }
.cs-style-select.open { z-index:40; }
.cs-card:has(.cs-style-select.open) { overflow:visible; }
.cs-style-trigger {
  display:flex; align-items:center; gap:9px; width:100%; min-height:52px; padding:7px 10px;
  border:1px solid var(--line); border-radius:12px; background:linear-gradient(135deg,#fff 0%,#fcfaff 100%);
  color:var(--ink); cursor:pointer; text-align:left; font:inherit; transition:border-color .16s,box-shadow .16s,background .16s;
}
.cs-style-trigger:hover,.cs-style-select.open .cs-style-trigger { border-color:var(--violet-2); background:#fff; box-shadow:0 0 0 3px rgba(139,122,232,.08); }
.cs-style-trigger-icon {
  flex:none; width:31px; height:31px; border-radius:10px; display:flex; align-items:center; justify-content:center;
  color:var(--violet-ink); background:var(--violet-bg); border:1px solid var(--violet-line); font-size:11px;
}
.cs-style-trigger-copy { flex:1; min-width:0; }
.cs-style-trigger-copy small,.cs-style-trigger-copy b { display:block; }
.cs-style-trigger-copy small { margin-bottom:3px; color:var(--ink-3); font-size:9px; font-weight:700; }
.cs-style-trigger-copy b { overflow:hidden; color:var(--ink-strong); font-size:12px; font-weight:750; text-overflow:ellipsis; white-space:nowrap; }
.cs-style-chevron { flex:none; color:var(--ink-4); font-size:10px; transition:transform .16s,color .16s; }
.cs-style-select.open .cs-style-chevron { color:var(--violet-ink); transform:rotate(180deg); }
.cs-style-menu {
  position:absolute; left:0; right:0; top:calc(100% + 7px); max-height:268px; overflow:auto; padding:6px;
  border:1px solid var(--violet-line); border-radius:14px; background:rgba(255,255,255,.98);
  box-shadow:0 16px 35px rgba(70,52,145,.16),0 2px 8px rgba(70,52,145,.08); backdrop-filter:blur(16px);
}
.cs-style-option {
  display:flex; align-items:center; gap:8px; width:100%; min-height:43px; padding:7px 8px; border:1px solid transparent;
  border-radius:10px; background:transparent; color:var(--ink-2); cursor:pointer; text-align:left; font:inherit; transition:background .14s,border-color .14s,color .14s;
}
.cs-style-option:hover { background:var(--soft); border-color:var(--line-2); color:var(--ink); }
.cs-style-option.on { background:var(--violet-bg); border-color:var(--violet-line); color:var(--violet-ink); }
.cs-style-index { flex:none; width:20px; height:20px; border-radius:7px; display:flex; align-items:center; justify-content:center; background:#f5f2fc; color:var(--ink-4); font-size:9px; font-weight:800; }
.cs-style-option.on .cs-style-index { background:#fff; color:var(--violet-ink); }
.cs-style-option-copy { flex:1; min-width:0; }
.cs-style-option-copy b,.cs-style-option-copy small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cs-style-option-copy b { color:inherit; font-size:10.5px; font-weight:750; }
.cs-style-option-copy small { margin-top:2px; color:var(--ink-4); font-size:9px; }
.cs-style-option > i { flex:none; color:var(--violet-ink); font-size:10px; }

/* 一键仿写：从拆解卡直接打开的轻量悬浮窗 */
.cs-modal-backdrop { position:fixed; z-index:1200; inset:0; display:flex; align-items:center; justify-content:center; padding:20px; background:rgba(39,29,74,.32); backdrop-filter:blur(5px); }
.cs-modal { width:min(620px,100%); max-height:min(720px,calc(100vh - 40px)); overflow:auto; padding:20px; border:1px solid rgba(255,255,255,.8); border-radius:22px; background:#fff; box-shadow:0 24px 70px rgba(43,28,100,.25); }
.cs-modal-head { display:flex; align-items:flex-start; gap:11px; padding-bottom:15px; border-bottom:1px solid var(--line-2); }
.cs-modal-head .cs-title { color:var(--ink-strong); font-size:16px; font-weight:800; }
.cs-modal-head .cs-sub { margin-top:4px; color:var(--ink-3); font-size:10.5px; line-height:1.55; }
.cs-modal-close { flex:none; width:28px; height:28px; border:0; border-radius:9px; background:var(--soft); color:var(--ink-3); cursor:pointer; }
.cs-modal-close:hover { background:var(--pink-bg); color:var(--pink-ink); }
.cs-modal-source { display:flex; align-items:center; gap:9px; margin:14px 0 16px; padding:10px 12px; border:1px solid var(--mint-line); border-radius:12px; background:var(--mint-bg); color:var(--mint-ink); }
.cs-modal-source > i { width:28px; height:28px; display:flex; align-items:center; justify-content:center; border-radius:9px; background:#fff; }
.cs-modal-source span,.cs-modal-source b,.cs-modal-source small { display:block; }
.cs-modal-source b { font-size:11px; }
.cs-modal-source small { max-width:480px; margin-top:2px; overflow:hidden; color:var(--ink-3); font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.cs-modal-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px 12px; }
.cs-modal-field { display:block; min-width:0; }
.cs-modal-field > span { display:block; margin-bottom:6px; color:var(--ink-2); font-size:11px; font-weight:750; }
.cs-modal-field > span em { color:var(--pink-ink); font-style:normal; }
.cs-modal-field input,.cs-modal-field textarea { display:block; width:100%; box-sizing:border-box; padding:10px 11px; outline:0; border:1px solid var(--line); border-radius:10px; background:#fffdfd; color:var(--ink); font:11px/1.6 inherit; transition:border-color .16s,box-shadow .16s; }
.cs-modal-field input:focus,.cs-modal-field textarea:focus { border-color:var(--violet-2); box-shadow:0 0 0 3px rgba(139,122,232,.1); }
.cs-modal-field textarea { min-height:110px; resize:vertical; }
.cs-modal-selling { grid-column:1/-1; }
.cs-modal-style { position:relative; }
.cs-modal-style .cs-style-trigger { min-height:39px; }
.cs-modal-style .cs-style-trigger-copy b { font-size:11px; }
.cs-modal-actions { display:flex; justify-content:flex-end; gap:8px; margin-top:17px; padding-top:14px; border-top:1px solid var(--line-2); }
.cs-modal-actions .cs-btn { min-height:36px; }
.cs-type-tag { display:inline-flex; align-items:center; padding:2px 6px; margin-right:5px; border-radius:99px; font-size:9px; font-weight:750; }
.cs-type-tag.image { background:var(--pink-bg); color:var(--pink-ink); }
.cs-type-tag.video { background:var(--violet-bg); color:var(--violet-ink); }
.cs-recognized-type-value { display:flex; align-items:center; gap:8px; padding:10px 11px; border:1px solid var(--violet-line); border-radius:10px; background:var(--violet-bg); color:var(--violet-ink); }
.cs-recognized-type-value i { font-size:14px; }
.cs-recognized-type-value b { font-size:12px; }
.cs-recognized-type-value span { color:var(--ink-3); font-size:10px; }

/* 类型 chips */
.cs-chips { display:flex; flex-wrap:wrap; gap:6px; }
.cs-ch { cursor:pointer; border:1px solid var(--line); border-radius:99px; padding:6px 11px; background:#fff; color:var(--ink-2); font:700 11px/1 inherit; }
.cs-ch.on { border-color:var(--violet); background:var(--violet); color:#fff; box-shadow:0 5px 12px rgba(139,122,232,.22); }

.cs-divider { padding-bottom:13px; margin-bottom:13px; border-bottom:1px solid var(--line-2); }
.cs-divider:last-child { padding-bottom:0; margin-bottom:0; border-bottom:0; }
.cs-block-label { margin-bottom:8px; color:var(--ink-2); font-size:11.5px; font-weight:750; }
.cs-block-label em { font-style:normal; margin-left:6px; color:var(--ink-4); font-size:10px; font-weight:600; }

/* ---------- 中栏：卡片列表（爆文卡片） ---------- */
.cs-grid2 { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:14px; align-items:start; }
.cs-grid2 > .cs-card + .cs-card { margin-top:0; }
.cs-item {
  display:flex; gap:10px; align-items:flex-start; width:100%; text-align:left; cursor:pointer; font:inherit;
  border:1px solid var(--line); border-radius:var(--r-md); background:#fff; padding:10px 11px;
  transition:border-color .15s,background .15s,box-shadow .15s;
}
.cs-item:hover { border-color:var(--violet-line); box-shadow:var(--sh1); }
.cs-item.on { border-color:#c7bcfb; background:#fbfaff; box-shadow:0 0 0 3px rgba(167,139,250,.1); }
.cs-item .tile { flex:none; width:28px; height:28px; border-radius:9px; display:flex; align-items:center; justify-content:center; border:1px solid var(--pink-line); background:var(--pink-bg); color:var(--pink-ink); font-size:11px; }
.cs-item .body { flex:1; min-width:0; }
.cs-item .h { color:var(--ink); font-size:11.5px; font-weight:700; line-height:1.45; }
.cs-item .m { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:5px; color:var(--ink-4); font-size:10px; }

/* ============================================================
   ★★ 爆文拆解区（融合卡）
   把原来的「已拆解的爆文卡片」+「拆解成果 · 7 维」两张并排卡片
   合成**一个外壳**：左侧选卡列（290px，soft 底 + 细分隔线），右侧成果详情。
   关键：外壳统一渐变头 + 一条 1px 分隔线，消除「两张卡高度不齐 → 右侧突兀」。
   ============================================================ */
.cs-fuse { padding:0; }
.cs-fuse-top {
  position:relative; display:flex; align-items:flex-start; gap:11px; padding:16px 18px;
  background:linear-gradient(108deg,#f6f3ff 0%,#fbf6fb 46%,#f4fcf8 100%);
  border-bottom:1px solid var(--line-2);
}
.cs-fuse-top:after {
  content:''; position:absolute; right:-50px; top:-110px; width:200px; height:200px; border-radius:50%;
  background:rgba(255,255,255,.5);
}
.cs-fuse-top .mark {
  position:relative; z-index:1; flex:none; width:34px; height:34px; border-radius:12px;
  display:flex; align-items:center; justify-content:center; color:#fff; font-size:14px;
  background:linear-gradient(145deg,#8b7ae8,#5bc8aa); box-shadow:0 7px 16px rgba(111,93,202,.22);
}
.cs-fuse-top .ttl { position:relative; z-index:1; flex:1; min-width:0; }
.cs-fuse-top .ttl b { display:block; color:var(--ink-strong); font-size:14px; font-weight:780; letter-spacing:.1px; }
.cs-fuse-top .ttl small { display:block; margin-top:5px; color:var(--ink-3); font-size:11px; line-height:1.6; }
.cs-fuse-top .tools { position:relative; z-index:1; flex:none; display:flex; align-items:center; gap:8px; }

.cs-fuse-body { display:grid; grid-template-columns:290px minmax(0,1fr); }
/* 左半：卡片选择列（不是独立卡片，是融合体的左半，靠右 1px 分隔线切分） */
.cs-fuse-items { display:flex; flex-direction:column; min-width:0; background:#fbfaff; border-right:1px solid var(--line-2); }
.cs-fuse-items-head { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:12px 14px 8px; }
.cs-fuse-items-head .t { color:var(--ink-2); font-size:11.5px; font-weight:750; }
.cs-fuse-items-list { display:flex; flex-direction:column; gap:5px; padding:0 10px 12px; max-height:600px; overflow:auto; }
.cs-pick {
  position:relative; display:flex; gap:9px; align-items:flex-start; width:100%; text-align:left; cursor:pointer; font:inherit;
  padding:9px 10px 9px 12px; border:1px solid transparent; border-radius:12px; background:transparent;
  transition:background .15s,border-color .15s,box-shadow .15s;
}
.cs-pick:hover { background:#fff; border-color:var(--line-2); }
.cs-pick.on { background:#fff; border-color:#d8cffb; box-shadow:0 5px 14px rgba(122,102,190,.09); }
.cs-pick.on:before {
  content:''; position:absolute; left:0; top:11px; bottom:11px; width:3px; border-radius:0 3px 3px 0;
  background:linear-gradient(180deg,#8b7ae8,#5bc8aa);
}
.cs-pick .tile {
  flex:none; width:26px; height:26px; border-radius:8px; display:flex; align-items:center; justify-content:center;
  border:1px solid var(--pink-line); background:var(--pink-bg); color:var(--pink-ink); font-size:10px;
}
.cs-pick .body { flex:1; min-width:0; }
.cs-pick .h {
  display:-webkit-box; overflow:hidden; -webkit-line-clamp:2; -webkit-box-orient:vertical;
  color:var(--ink); font-size:11.5px; font-weight:680; line-height:1.45;
}
.cs-pick .m { display:block; margin-top:4px; color:var(--ink-4); font-size:9.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cs-pick .cs-card-delete { align-self:center; }

/* 右半：成果详情 */
.cs-fuse-result { display:flex; flex-direction:column; min-width:0; }
.cs-fuse-result-head { display:flex; align-items:flex-start; gap:9px; padding:14px 16px 12px; }
.cs-fuse-result-head .grow { flex:1; min-width:0; }
.cs-fuse-result-head .ttl { color:var(--ink-strong); font-size:13px; font-weight:750; }
.cs-fuse-result-head .sub { margin-top:4px; color:var(--ink-3); font-size:10.5px; line-height:1.55; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cs-fuse-res { display:flex; flex-direction:column; gap:9px; padding:0 16px 14px; }
.cs-fuse-res .cs-grid2 { gap:9px; }
.cs-fuse-foot { padding:0 16px 15px; }

/* ---------- 中栏：拆解成果 / 输出 ---------- */
.cs-res { display:flex; flex-direction:column; gap:9px; padding:0 12px 13px; }
.cs-blk { padding:11px 12px; border:1px solid var(--line-2); border-radius:var(--r-md); background:var(--soft); }
.cs-blk h4 { display:flex; align-items:center; gap:7px; margin:0 0 6px; color:var(--ink-2); font-size:11.5px; font-weight:750; }
.cs-blk h4 i { color:var(--violet); font-size:11px; }
.cs-blk p { margin:0; color:var(--ink-2); font-size:10.5px; line-height:1.8; white-space:pre-wrap; }
.cs-blk.mint { border-color:var(--mint-line); background:var(--mint-bg); }
.cs-blk.mint h4 { color:var(--mint-ink); } .cs-blk.mint h4 i { color:var(--mint); }
.cs-blk.pink { border-color:var(--pink-line); background:#fdf3f6; }
.cs-blk.pink h4 { color:var(--pink-ink); } .cs-blk.pink h4 i { color:var(--pink); }
.cs-out-sec { padding:12px 0; border-top:1px solid var(--line-2); }
.cs-out-sec:first-child { padding-top:0; border-top:0; }
.cs-out-head { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.cs-out-head .n { display:flex; align-items:center; gap:7px; color:var(--ink); font-size:11.5px; font-weight:750; }
.cs-out-head .n i { color:var(--violet); font-size:11px; }
.cs-copy { display:inline-flex; align-items:center; gap:4px; border:0; background:transparent; color:var(--violet-ink); font:700 10px/1 inherit; cursor:pointer; }
.cs-out-body { margin-top:8px; color:var(--ink-2); font-size:10.5px; line-height:1.8; white-space:pre-wrap; }
.cs-pills { display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }
.cs-pl { padding:6px 10px; border:1px solid var(--violet-line); border-radius:8px; background:var(--violet-bg); color:var(--violet-ink); font-size:10px; font-weight:600; }
.cs-mx { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:8px; }
.cs-mx-item { padding:10px; border:1px solid var(--line-2); border-radius:var(--r-sm); background:var(--soft); }
.cs-mx-item b { display:block; color:var(--ink); font-size:10.5px; font-weight:750; }
.cs-mx-item span { display:block; margin-top:5px; color:var(--ink-4); font-size:9.5px; line-height:1.6; }

/* ---------- 右栏 ---------- */
.cs-seg { display:inline-flex; gap:3px; padding:3px; border:1px solid var(--line-2); border-radius:99px; background:#f2effb; }
.cs-seg > span { flex:1; text-align:center; padding:6px 10px; border-radius:99px; color:var(--ink-3); font-size:10.5px; font-weight:700; }
.cs-seg > span.on { background:#fff; color:var(--violet-ink); box-shadow:0 3px 8px rgba(139,122,232,.16); }
.cs-kv { display:flex; flex-direction:column; gap:10px; }
.cs-kv .k { display:block; margin-bottom:5px; color:var(--ink-3); font-size:10.5px; font-weight:700; }
.cs-kv .v { padding:9px 11px; border:1px solid var(--line); border-radius:10px; background:#fffdfe; color:var(--ink); font-size:11px; line-height:1.6; word-break:break-word; }
.cs-kv .v.mute { background:#faf9fd; color:var(--ink-4); }

/* ---------- 右栏：AI 生图提示词 ---------- */
.cs-image-prompts-card { border-color:var(--pink-line); background:linear-gradient(165deg,#fffafd 0%,#fff 58%); }
.cs-image-prompts { padding-top:0; }
.cs-image-prompt-meta { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:9px 0 10px; border-top:1px solid var(--line-2); color:var(--pink-ink); font-size:9.5px; line-height:1.45; }
.cs-image-prompt-meta > span { display:flex; align-items:flex-start; gap:5px; min-width:0; }
.cs-image-prompt-meta > span i { flex:none; margin-top:1px; }
.cs-image-prompt-list { display:flex; flex-direction:column; gap:8px; }
.cs-image-prompt-item { padding:9px 10px 10px; border:1px solid var(--pink-line); border-radius:11px; background:#fff; }
.cs-image-prompt-head { display:flex; align-items:flex-start; justify-content:space-between; gap:8px; }
.cs-image-prompt-head > div { min-width:0; }
.cs-image-prompt-head b { display:block; color:var(--ink-strong); font-size:11px; font-weight:760; }
.cs-image-prompt-head small { display:block; margin-top:3px; color:var(--ink-4); font-size:9px; line-height:1.4; }
.cs-image-prompt-text { max-height:138px; overflow:auto; margin-top:7px; padding:8px; border-radius:8px; background:#fff9fb; color:var(--ink-2); font-size:10px; line-height:1.65; white-space:pre-wrap; word-break:break-word; scrollbar-width:thin; }
.cs-image-prompt-details { margin-top:7px; border-top:1px dashed var(--pink-line); padding-top:6px; }
.cs-image-prompt-details summary { cursor:pointer; color:var(--pink-ink); font-size:9.5px; font-weight:700; list-style:none; }
.cs-image-prompt-details summary::-webkit-details-marker { display:none; }
.cs-image-prompt-details summary:before { content:'+'; display:inline-flex; align-items:center; justify-content:center; width:14px; height:14px; margin-right:4px; border-radius:4px; background:var(--pink-bg); font-size:11px; }
.cs-image-prompt-details[open] summary:before { content:'−'; }
.cs-image-prompt-detail { display:grid; grid-template-columns:45px minmax(0,1fr); gap:6px; margin-top:6px; color:var(--ink-3); font-size:9.5px; line-height:1.5; }
.cs-image-prompt-detail b { color:var(--ink-2); font-weight:700; }
.cs-image-prompt-detail span { min-width:0; word-break:break-word; }
.cs-image-prompt-hint { display:flex; gap:5px; margin-top:10px; padding:8px 9px; border-radius:9px; background:var(--amber-bg); color:var(--amber-ink); font-size:9.5px; line-height:1.55; }
.cs-image-prompts-empty { padding-top:6px; }

/* ---------- 标题优化与产品词库 ---------- */
.cs-title-optimizer-card { border-color:#ded8fa; background:linear-gradient(160deg,#fff 0%,#fbfaff 100%); }
.cs-library-btn { flex:none; padding:6px 9px; border-color:var(--violet-line); background:var(--violet-bg); color:var(--violet-ink); }
.cs-library-btn span { display:inline-flex; min-width:16px; height:16px; align-items:center; justify-content:center; border-radius:99px; background:#fff; font-size:9px; }
.cs-title-input { display:block; width:100%; min-height:76px; resize:vertical; outline:0; padding:10px 11px; border:1px solid var(--line-2); border-radius:11px; background:#fff; color:var(--ink); font:11px/1.65 inherit; }
.cs-title-input:focus { border-color:var(--violet-2); box-shadow:0 0 0 3px rgba(139,122,232,.1); }
.cs-title-actions { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:8px; }
.cs-title-actions .cs-hint { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--ink-4); font-size:9.5px; }
.cs-title-status { margin-top:8px; padding:7px 9px; border-radius:8px; background:var(--mint-bg); color:var(--mint-ink); font-size:9.5px; line-height:1.5; }
.cs-title-status.error { background:#fff1f3; color:#c95e73; }
.cs-title-results { display:flex; flex-direction:column; gap:6px; margin-top:10px; }
.cs-title-result { display:flex; align-items:flex-start; gap:7px; padding:8px 9px; border:1px solid var(--line-2); border-radius:9px; background:#fff; color:var(--ink-2); font-size:10px; line-height:1.6; }
.cs-title-result-copy { display:flex; flex:1; min-width:0; flex-direction:column; gap:2px; }
.cs-title-result-copy small { color:var(--violet); font-size:8.5px; font-weight:750; }
.cs-title-result-copy span { min-width:0; }
.cs-hot-word-row { display:flex; flex-wrap:wrap; align-items:center; gap:5px; color:var(--pink-ink); font-size:9px; }
.cs-hot-word-row i { color:#ef8a77; }
.cs-hot-word-row span { padding:3px 6px; border-radius:99px; background:var(--pink-bg); }
.cs-library-backdrop { position:fixed; z-index:80; inset:0; display:flex; align-items:flex-start; justify-content:flex-end; padding:82px 24px 24px; background:rgba(38,31,61,.18); backdrop-filter:blur(3px); }
.cs-library-popover { width:min(520px,calc(100vw - 32px)); max-height:min(650px,calc(100vh - 110px)); overflow:auto; padding:20px; border:1px solid #e3dcf6; border-radius:20px; background:#fff; box-shadow:0 24px 70px rgba(72,57,117,.25); }
.cs-library-head { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; padding-bottom:14px; border-bottom:1px solid var(--line-2); }
.cs-library-head h2 { margin:5px 0 5px; color:var(--ink-strong); font-size:20px; }
.cs-library-head p { margin:0; color:var(--ink-3); font-size:10.5px; line-height:1.65; }
.cs-library-toolbar { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:13px 0 10px; color:var(--ink-3); font-size:10.5px; }
.cs-library-toolbar b { color:var(--violet-ink); font-size:15px; }
.cs-library-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; }
.cs-library-term { display:flex; align-items:center; justify-content:space-between; gap:6px; min-height:42px; padding:8px 9px 8px 11px; border:1px solid var(--line-2); border-radius:11px; background:linear-gradient(135deg,#fcfbff,#fff); color:var(--ink-2); font-size:11px; font-weight:680; cursor:pointer; transition:border-color .15s,background .15s,box-shadow .15s; }
.cs-library-term:hover { border-color:var(--violet-2); background:#fff; box-shadow:0 4px 12px rgba(91,72,156,.08); }
.cs-library-term.selected { border-color:var(--mint-line); background:var(--mint-bg); color:var(--mint-ink); box-shadow:0 0 0 2px rgba(70,190,145,.1); }
.cs-library-term span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cs-library-term button { flex:none; width:20px; height:20px; border:0; border-radius:6px; background:transparent; color:var(--ink-4); cursor:pointer; }
.cs-library-term button:hover { background:#fff0f3; color:var(--pink-ink); }
.cs-library-add { display:flex; align-items:center; min-height:42px; border:1px dashed var(--violet-2); border-radius:11px; background:var(--violet-bg); }
.cs-library-add input { flex:1; min-width:0; padding:8px 9px 8px 11px; border:0; outline:0; background:transparent; color:var(--ink); font:11px inherit; }
.cs-library-add button { flex:none; width:38px; height:40px; border:0; border-left:1px solid var(--violet-line); border-radius:0 10px 10px 0; background:transparent; color:var(--violet-ink); cursor:pointer; }
.cs-library-add button:hover { background:#e9e4ff; }
.cs-library-add button:disabled { opacity:.4; cursor:not-allowed; }
.cs-library-foot { display:flex; align-items:flex-start; gap:6px; margin-top:12px; padding:8px 10px; border-radius:9px; background:var(--mint-bg); color:var(--mint-ink); font-size:9.5px; line-height:1.55; }
.cs-library-foot.error { background:#fff1f3; color:#c95e73; }

/* ---------- 图片参考素材上传 ---------- */
.cs-upload-row { display:flex; align-items:center; flex-wrap:wrap; gap:7px; margin-top:8px; }
.cs-upload-btn { display:inline-flex; align-items:center; gap:5px; width:max-content; padding:6px 9px; border:1px dashed var(--violet-line); border-radius:8px; background:var(--violet-bg); color:var(--violet-ink); font-size:10px; font-weight:750; cursor:pointer; }
.cs-upload-btn:hover { border-color:var(--violet-2); background:#ece8ff; }
.cs-upload-hint { color:var(--ink-4); font-size:9.5px; }
.cs-upload-previews { display:flex; flex-wrap:wrap; gap:7px; margin-top:8px; }
.cs-upload-preview { position:relative; width:54px; height:54px; overflow:hidden; border:1px solid var(--line); border-radius:8px; background:#f8f7fc; }
.cs-upload-preview img { display:block; width:100%; height:100%; object-fit:cover; }
.cs-upload-preview button { position:absolute; top:2px; right:2px; display:flex; align-items:center; justify-content:center; width:17px; height:17px; padding:0; border:0; border-radius:50%; background:rgba(45,38,68,.72); color:#fff; font-size:9px; cursor:pointer; }
.cs-product-upload { margin-top:9px; padding:9px; border:1px solid var(--pink-line); border-radius:10px; background:#fffafd; }
.cs-product-upload-head { display:flex; align-items:flex-start; justify-content:space-between; gap:7px; margin-bottom:7px; }
.cs-product-upload-head span { color:var(--ink-2); font-size:10.5px; font-weight:750; }
.cs-product-upload-head span i { color:var(--pink-ink); margin-right:4px; }
.cs-product-upload-head em { margin-left:3px; color:var(--pink-ink); font-style:normal; font-size:9px; font-weight:650; }
.cs-product-upload-head small { color:var(--ink-4); font-size:9px; }
.cs-state { display:flex; flex-direction:column; gap:8px; padding:12px; margin:0 14px 14px; border-radius:var(--r-md); border:1px solid var(--line-2); background:var(--soft); }
.cs-state.mint { border-color:var(--mint-line); background:var(--mint-bg); }
.cs-state.amber { border-color:var(--amber-line); background:var(--amber-bg); }
.cs-state-line { display:flex; align-items:flex-start; gap:7px; color:var(--ink-2); font-size:10.5px; line-height:1.7; }
.cs-state-line i { flex:none; margin-top:2px; color:var(--mint); font-size:11px; }
.cs-state-line.amber i { color:var(--amber); }
.cs-tips { list-style:none; margin:0; padding:0 12px 14px; display:flex; flex-direction:column; gap:8px; }
.cs-tips li { display:flex; gap:7px; color:var(--ink-2); font-size:10.5px; line-height:1.7; }
.cs-tips li i { flex:none; margin-top:2px; color:var(--violet); font-size:10px; }

/* ---------- 加载动画 ---------- */
.cs-shell .fa-spinner { animation:csSpin .8s linear infinite; }
@keyframes csSpin { to { transform:rotate(360deg); } }

/* ---------- 融合后的违规词检测 ---------- */
.cs-violation-wrap { display:flex; flex-direction:column; gap:14px; }
.cs-violation-hero { position:relative; overflow:hidden; display:flex; align-items:center; justify-content:space-between; min-height:132px; padding:24px 28px; border:1px solid #e5def9; border-radius:22px; background:linear-gradient(116deg,#f2efff 0%,#fdf2f6 55%,#edf9f4 100%); box-shadow:var(--sh1); }
.cs-violation-hero:after { content:''; position:absolute; width:230px; height:230px; border-radius:50%; right:-75px; top:-120px; background:rgba(255,255,255,.46); }
.cs-violation-hero h1 { margin:7px 0 8px; color:var(--ink-strong); font-size:25px; line-height:1.18; }
.cs-violation-hero p { margin:0; color:var(--ink-2); font-size:12px; line-height:1.7; }
.cs-violation-shield { position:relative; z-index:1; width:80px; height:80px; flex:none; display:flex; align-items:center; justify-content:center; border-radius:24px; color:#7765da; font-size:31px; background:rgba(255,255,255,.66); box-shadow:inset 0 0 0 1px rgba(255,255,255,.8),0 8px 22px rgba(111,93,202,.1); }
.cs-violation-wrap .vd-integrated { display:flex; flex-direction:column; gap:14px; }
.cs-violation-wrap .vd-mode-tabs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; padding:7px; border:1px solid var(--line); border-radius:18px; background:#fff; box-shadow:var(--sh1); }
.cs-violation-wrap .vd-mode-tabs button { display:flex; align-items:center; gap:11px; min-height:58px; padding:10px 16px; border:1px solid transparent; border-radius:13px; background:transparent; color:var(--ink-3); font:inherit; text-align:left; cursor:pointer; }
.cs-violation-wrap .vd-mode-tabs button > i { width:31px; height:31px; display:flex; align-items:center; justify-content:center; border-radius:10px; color:var(--violet); background:var(--violet-bg); }
.cs-violation-wrap .vd-mode-tabs button span,.cs-violation-wrap .vd-mode-tabs button small { display:block; }
.cs-violation-wrap .vd-mode-tabs button span { font-size:12px; font-weight:750; }
.cs-violation-wrap .vd-mode-tabs button small { margin-top:4px; color:var(--ink-4); font-size:9.5px; font-weight:550; }
.cs-violation-wrap .vd-mode-tabs button.on { border-color:var(--violet-line); color:var(--violet-ink); background:linear-gradient(135deg,#f3f0ff,#fff9fc); box-shadow:0 5px 14px rgba(122,102,190,.08); }
.cs-violation-wrap .vd-mode-tabs button.on > i { color:#fff; background:linear-gradient(145deg,#8b7ae8,#59c6a9); }
.cs-violation-wrap .vd-stat-card,.cs-violation-wrap .vd-upload-panel,.cs-violation-wrap .vd-result-panel { border-color:var(--line); border-radius:18px; box-shadow:var(--sh1); }
.cs-violation-wrap .vd-btn-detect { background:linear-gradient(135deg,#8b7ae8,#a98bf0); box-shadow:0 4px 12px rgba(139,122,232,.23); }
.cs-violation-wrap .vd-drop-zone:hover,.cs-violation-wrap .vd-drop-active { border-color:#a99bed; background:#faf8ff; }
.cs-violation-wrap .vd-drop-icon,.cs-violation-wrap .vd-drop-link,.cs-violation-wrap .vd-panel-title i { color:var(--violet); }
.vd-text-grid { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:14px; align-items:stretch; }
.vd-text-panel { padding-bottom:16px; }
.vd-textarea { display:block; width:calc(100% - 32px); min-height:330px; margin:0 16px; padding:16px; resize:vertical; outline:0; border:1px solid #e8e3f3; border-radius:13px; background:#fffdfd; color:var(--ink); font:13px/1.85 inherit; transition:border-color .16s,box-shadow .16s; }
.vd-textarea:focus { border-color:var(--violet-2); box-shadow:0 0 0 4px rgba(139,122,232,.1); }
.vd-textarea::placeholder { color:var(--ink-4); }
.vd-text-meta { display:flex; justify-content:space-between; gap:12px; margin:8px 17px 0; color:var(--ink-4); font-size:10.5px; }
.vd-text-panel .vd-actions { padding:14px 16px 0; }
.vd-text-error { display:flex; align-items:center; gap:7px; margin:12px 16px 0; padding:9px 11px; border-radius:10px; background:#fff1f3; color:#c95e73; font-size:11px; }
.vd-text-result { min-height:470px; }
.vd-text-result-body { padding:16px; }
.vd-text-result .vd-highlight-text { min-height:280px; padding:16px; border:1px solid var(--line-2); border-radius:13px; background:#fcfbfe; color:var(--ink-2); font-size:13px; line-height:1.9; white-space:pre-wrap; }

/* ---------- 响应式 ---------- */
@media (max-width:1400px) {
  .cs-layout { grid-template-columns:200px minmax(0,1fr) 252px; }
  .cs-hero-art { display:none; }
  .cs-fuse-body { grid-template-columns:250px minmax(0,1fr); }
}
@media (max-width:1180px) {
  .cs-layout { grid-template-columns:minmax(0,1fr); }
  .cs-rail { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:12px; align-items:start; }
  .cs-rail > .cs-card + .cs-card { margin-top:0; }
  .cs-rail-left { order:1; } .cs-main { order:2; } .cs-rail-right { order:3; }
  /* 单列堆叠后左右栏不再吸顶，避免与小屏内容互相遮挡 */
  .cs-rail-left, .cs-rail-right { position:static; max-height:none; overflow:visible; padding-right:0; }
  .cs-list.scroll { max-height:260px; }
}
@media (max-width:900px) {
  .cs-grid2 { grid-template-columns:minmax(0,1fr); }
  .cs-grid2 > .cs-card + .cs-card { margin-top:14px; }
  .cs-mx { grid-template-columns:minmax(0,1fr); }
  .cs-stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .vd-text-grid { grid-template-columns:minmax(0,1fr); }
  .cs-workspace-note { display:none; }
  /* 融合卡在窄屏改为上下堆叠：选卡列在上，成果在下 */
  .cs-fuse-body { grid-template-columns:minmax(0,1fr); }
  .cs-fuse-items { border-right:0; border-bottom:1px solid var(--line-2); }
  .cs-fuse-items-list { max-height:none; }
}
@media (max-width:620px) {
  .cs-workspace-nav-inner { min-height:auto; padding:9px 10px; flex-wrap:wrap; gap:8px; }
  .cs-workspace-title { width:100%; }
  .cs-workspace-links { width:100%; min-height:42px; }
  .cs-workspace-links button { flex:1; min-width:0; padding:0 8px; }
  .cs-violation-hero { padding:18px 16px; }
  .cs-violation-hero h1 { font-size:21px; }
  .cs-violation-shield { display:none; }
  .cs-violation-wrap .vd-mode-tabs { grid-template-columns:minmax(0,1fr); }
  .cs-page { padding:14px 10px 30px; }
  .cs-hero { padding:16px 14px; }
  .cs-hero h1 { font-size:20px; }
  .cs-head { padding-left:13px; padding-right:13px; }
  .cs-pad { padding-left:13px; padding-right:13px; }
  .cs-status { flex-direction:column; }
  .cs-modal-backdrop { align-items:flex-end; padding:10px; }
  .cs-modal { max-height:calc(100vh - 20px); padding:16px; border-radius:18px; }
  .cs-modal-grid { grid-template-columns:minmax(0,1fr); }
  .cs-modal-selling { grid-column:auto; }
  .cs-library-backdrop { align-items:flex-end; justify-content:center; padding:10px; }
  .cs-library-popover { max-height:calc(100vh - 20px); border-radius:18px; }
  .cs-library-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
