/* ============================================================
   WOJIA OS 组件样式 v4 · 微信风
   只消费 tokens.css 变量；不在此处发明颜色。
   结构：顶栏 / 侧导航 / 页面容器 / 卡片 / 单元格列表 /
        按钮 / 表单 / 步骤条 / 页签 / 网格 / 弹层(toast·dialog)
   V2.46.0 桌面化：仅桌面端使用（手机端=小程序/移动H5，见
   docs/mobile-legacy.md 留档册）。保留的 @media 只有两类：
   桌面档宽度调节（窄栏/单列/降列）与 prefers-reduced-motion。
   ============================================================ */

* { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--font-sans);
  font-size: var(--t-body);
  line-height: var(--lh);
  color: var(--text);
  background: var(--bg);
  min-width: var(--app-min-w); /* 桌面底线：更窄出横向滚动，布局不散架 */
  transition: background .2s ease, color .2s ease;
}
img { display: block; max-width: 100%; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
input, textarea, select { font: inherit; color: var(--text); }
a { color: var(--link); text-decoration: none; }
::selection { background: var(--brand-soft); }

/* ================= 顶栏 ================= */
.topbar {
  position: fixed; inset: 0 0 auto 0; z-index: 50;
  min-width: var(--app-min-w); /* 与 body 底线同步：出横滚时顶栏跟着滚，不悬空 */
  height: var(--topbar-h);
  display: flex; align-items: center; gap: 12px;
  padding: 0 20px;
  background: var(--topbar);
  border-bottom: 1px solid var(--line);
}
/* 品牌区（A1 左置主角定稿 09-27：去 logo 图，软件名大字为视觉主角；V2.45.0 更名 WOJIA OS） */
.topbar .brand { display: flex; align-items: baseline; gap: 10px; flex: none; }
.topbar .brand .bn { font-size: 20px; font-weight: 800; letter-spacing: 1px; }
.topbar .brand .bs { font-size: var(--t-weak); color: var(--text-3); }

/* 信息胶囊：费用 + 天气合并（A1 定稿） */
.info-group {
  display: flex; align-items: center; gap: 10px;
  background: var(--bg); border: 1px solid var(--line);
  border-radius: 999px; padding: 5px 14px;
}
.info-group .sep { width: 1px; height: 12px; background: var(--line-strong); }

.top-actions { display: flex; align-items: center; gap: 12px; flex: none; margin-left: auto; }
.icon-btn {
  width: 36px; height: 36px; border-radius: var(--r-m);
  display: grid; place-items: center;
  color: var(--text-2);
  transition: background .15s;
}
.icon-btn:hover { background: var(--hover); }
.icon-btn svg { width: 20px; height: 20px; }

.health { display: flex; align-items: center; gap: 6px; font-size: var(--t-weak); color: var(--text-3); padding: 0 6px; }
.health .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--text-3); }
.health.ok .dot { background: var(--brand); }
.health.bad .dot { background: var(--danger); }

.weather-chip {
  display: flex; align-items: center; gap: 6px;
  font-size: var(--t-weak); color: var(--text-2);
}

/* ================= 侧边栏（V2.20.0 重构） =================
   结构：.sidebar（flex 列）= .nav（滚动分组）+ .side-foot（关于系统 + 环境徽标）
   交互：组可折叠（状态存 localStorage）；选中态 = 浅绿底 + 左侧 3px 指示条；
   响应式三档：≥1281 完整栏 / 901–1280 图标窄栏 / ≤900 隐藏走底部导航 */
.sidebar {
  position: fixed; z-index: 40;
  top: var(--topbar-h); left: 0; bottom: 0;
  width: var(--nav-w);
  background: var(--topbar);
  border-right: 1px solid var(--line);
  display: flex; flex-direction: column;
}
.nav { flex: 1; overflow-y: auto; padding: 14px 10px 12px; }
.nav-group { margin-bottom: 22px; }
.nav-group-t {
  display: flex; align-items: center; width: 100%;
  padding: 4px 12px 6px; text-align: left;
  font-size: var(--t-weak); color: var(--text-3); letter-spacing: .06em;
  border-radius: var(--r-s);
  transition: color .16s ease;
}
.nav-group-t:hover { color: var(--text-2); }
.nav-group-t .chev { width: 12px; height: 12px; margin-left: auto; color: var(--text-3); transition: transform .22s ease; }
.nav-group.closed .nav-group-t .chev { transform: rotate(-90deg); }
.nav-items { display: flex; flex-direction: column; gap: 2px; margin-top: 2px; }
.nav-group.closed .nav-items { display: none; }
.nav-item {
  position: relative;
  display: flex; align-items: center; gap: 10px;
  width: 100%; text-align: left;
  padding: 9px 12px;
  border-radius: var(--r-m);
  color: var(--text-2); font-size: var(--t-body);
  transition: background .16s ease, color .16s ease;
}
.nav-item svg { width: 19px; height: 19px; flex: none; }
.nav-item:hover { background: var(--hover); color: var(--text); }
.nav-item.active { background: var(--brand-soft); color: var(--brand); font-weight: 600; }
.nav-item.active::before {
  content: ''; position: absolute; left: 2px; top: 50%; transform: translateY(-50%);
  width: 3px; height: 18px; border-radius: 2px; background: var(--brand);
}
/* 底部固定区 */
.side-foot { border-top: 1px solid var(--line); padding: 8px 10px 10px; }

/* ================= 环境徽标（侧栏底部区内） =================
   dev = 琥珀系（扳手图标） / prod = 松绿系（对勾图标），一眼区分。 */
.env-badge { margin-top: 6px; }
.env-badge .eb-card {
  display: flex; align-items: center; gap: 9px;
  padding: 8px 10px;
  border-radius: var(--r-m);
  border: 1px solid transparent;
  transition: background .16s ease, border-color .16s ease;
}
.env-badge[data-env="dev"] .eb-card {
  background: var(--warn-soft);
  border-color: rgba(250, 157, 59, 0.38);
}
.env-badge[data-env="prod"] .eb-card {
  background: var(--brand-soft);
  border-color: rgba(7, 193, 96, 0.30);
}
.env-badge .eb-ico {
  width: 26px; height: 26px; flex: none;
  display: flex; align-items: center; justify-content: center;
  border-radius: 8px; color: #fff;
}
.env-badge[data-env="dev"] .eb-ico { background: var(--warn); }
.env-badge[data-env="prod"] .eb-ico { background: var(--brand); }
.env-badge .eb-ico svg { width: 15px; height: 15px; }
.env-badge .eb-txt { min-width: 0; line-height: 1.35; }
.env-badge .eb-env { display: block; font-size: var(--t-aux); font-weight: 600; }
.env-badge[data-env="dev"] .eb-env { color: #C2710A; }
.env-badge[data-env="prod"] .eb-env { color: var(--brand); }
[data-theme="dark"] .env-badge[data-env="dev"] .eb-env { color: var(--warn); }
.env-badge .eb-ver {
  display: block;
  font-size: var(--t-weak); color: var(--text-3);
  font-variant-numeric: tabular-nums;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* ---- 桌面窄窗图标窄栏（901–1280px）：只留图标，悬停浮名称 ---- */
@media (min-width: 901px) and (max-width: 1280px) {
  .sidebar { width: var(--rail-w); }
  .nav { padding: 12px 8px; }
  .nav-group { margin-bottom: 6px; }
  .nav-group-t { display: none; } /* 组名隐藏，分组改分隔线 */
  .nav-group + .nav-group .nav-items { border-top: 1px solid var(--line); padding-top: 6px; }
  .nav-group.closed .nav-items { display: flex; } /* 窄栏无折叠入口，恒展开 */
  .nav-item { justify-content: center; padding: 11px 0; gap: 0; }
  .nav-item .lbl { display: none; }
  .nav-item.active::before { left: -8px; }
  /* 窄栏名称提示用原生 title（条目标记已带）：CSS ::after 浮层会撑出 .nav 横向滚动条，弃用 */
  .side-foot { padding: 8px; }
  .env-badge .eb-card { justify-content: center; padding: 6px; }
  .env-badge .eb-txt { display: none; }
}

/* dev 环境徽标在侧栏底部 .side-foot 常显（V2.46.0 桌面化：原 ≤900 顶栏小标签随小屏规则移除） */

/* ================= 页面容器 ================= */
.main {
  margin-left: var(--nav-w);
  padding: calc(var(--topbar-h) + 20px) 24px 48px;
}
.wrap { max-width: var(--wrap); margin: 0 auto; }
.page-head { margin-bottom: 18px; }
.page-title { font-size: var(--t-page); font-weight: 700; }
.page-desc { font-size: var(--t-aux); color: var(--text-2); margin-top: 4px; }

/* ================= 卡片 ================= */
.card {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--r-l);
  padding: var(--pad);
  box-shadow: var(--shadow-1);
}
.card + .card { margin-top: var(--gap); }
.card-t {
  font-size: var(--t-card); font-weight: 600;
  display: flex; align-items: center; gap: 8px;
  margin-bottom: 12px;
}
.card-t .sub { font-size: var(--t-weak); color: var(--text-3); font-weight: 400; }
/* 五步动线徽标（V2.19.0 UI 重组：①场景/日历 ②内容 ③商品 ④AI画面 ⑤预览） */
.card-t .step { display: inline-flex; min-width: 20px; height: 20px; border-radius: 6px; background: var(--brand); color: #fff; font-size: 11px; font-weight: 800; align-items: center; justify-content: center; padding: 0 5px; margin-right: 2px; }

/* ================= 生成卡（V2.19.1 三态清晰化 · V2.21.1 瑞士排版） =================
   瑞士排版：单一左轴网格、发丝线结构、数字表格化、零断词换行 */
/* 卡头成本签：决策前置——点按钮前就知道花多少 */
.gen-cost { font-size: var(--t-weak); color: var(--gold); font-weight: 700; font-variant-numeric: tabular-nums; letter-spacing: .3px; }
/* 就绪条：生成前自检（必填/商品/主视觉），待生成态显示，进行中隐藏 */
.gen-ready { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.gr-chip { font-size: var(--t-weak); padding: 4px 12px; border-radius: 999px; background: var(--bg); color: var(--text-3); white-space: nowrap; }
.gr-chip.ok { color: var(--brand); background: var(--brand-soft); font-weight: 600; }
.gr-chip.bad { color: var(--danger); background: var(--danger-soft); font-weight: 600; }
/* 信息条：规格表三行（左轴 + 发丝分隔，替三格挤压断词） */
.gen-meta { display: flex; flex-direction: column; margin-top: 14px; padding-top: 8px; border-top: 1px solid var(--line); }
.gen-meta span { display: flex; align-items: center; gap: 8px; padding: 6px 0; font-size: 11.5px; color: var(--text-3); line-height: 1.6; white-space: nowrap; }
.gen-meta span + span { border-top: 1px solid var(--line); }
.gen-meta .gm-ic { width: 14px; flex: none; text-align: center; font-size: 10px; font-style: normal; }
/* 完成态导出按钮呼吸强调 */
.btn.primary.ready { box-shadow: 0 4px 16px rgba(7, 193, 96, .42); }
.card-t .right { margin-left: auto; font-size: var(--t-aux); font-weight: 400; }

/* ================= 单元格列表（cell） ================= */
.cells { background: var(--card); border: 1px solid var(--line); border-radius: var(--r-l); overflow: hidden; box-shadow: var(--shadow-1); }
.cell {
  display: flex; align-items: center; gap: 12px;
  padding: 13px var(--pad);
  border-bottom: 1px solid var(--line);
}
.cell:last-child { border-bottom: 0; }
.cell .cell-main { flex: 1; min-width: 0; }
.cell .cell-t { font-size: var(--t-body); }
.cell .cell-d { font-size: var(--t-weak); color: var(--text-3); margin-top: 2px; }
.cell .cell-ft { color: var(--text-3); font-size: var(--t-aux); flex: none; }
.cell.tap { cursor: pointer; transition: background .15s; }
.cell.tap:hover { background: var(--hover); }

/* ================= 按钮 ================= */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  min-height: 38px; padding: 0 18px;
  border-radius: var(--r-m);
  font-size: var(--t-body); font-weight: 500;
  border: 1px solid var(--line-strong);
  color: var(--text);
  background: var(--card);
  transition: background .15s, border-color .15s, transform .05s;
  user-select: none;
}
.btn:hover { background: var(--hover); }
.btn:active { transform: scale(0.98); }
.btn.primary { background: var(--brand); border-color: var(--brand); color: #fff; }
.btn.primary:hover { background: var(--brand-press); }
.btn.primary:disabled { background: var(--text-3); border-color: transparent; cursor: not-allowed; }
.btn.danger { color: var(--danger); border-color: var(--danger); }
.btn.ghost { border-color: transparent; color: var(--brand); }
.btn.ghost:hover { background: var(--brand-soft); }
/* 商品清单一键清空（V2.34.1·渲染稿 prod-clear-mock-v1）：红字无框 ghost，破坏性操作
   不与主操作争视觉；hover 浅红底；清单全空 disabled 防误点 */
.btn-clear { border-color: transparent; background: none; color: var(--danger); }
.btn-clear:hover { background: var(--danger-soft); }
.btn-clear:disabled { color: var(--text-3); background: none; cursor: not-allowed; }
/* 商品表底部操作行：添加/整批重出居左，清空居右（破坏性末端惯例） */
.prod-opsrow { display: flex; align-items: center; margin-top: 8px; }
.prod-opsrow .spacer { flex: 1; }
.btn.small { min-height: 30px; padding: 0 12px; font-size: var(--t-aux); border-radius: var(--r-s); }
.btn.block { width: 100%; min-height: 44px; font-size: 15px; }

/* ================= 表单 ================= */
.field { margin-bottom: 14px; }
.field > label { display: block; font-size: var(--t-aux); color: var(--text-2); margin-bottom: 6px; }
/* 机制字段双列网格（V2.20.2）：短字段半宽成对，长文本 .mf-full 整行 */
.mf-grid { display: grid; grid-template-columns: 1fr 1fr; column-gap: 12px; }
.mf-grid .mf-full { grid-column: 1 / -1; }
.field > label .req { color: var(--danger); margin-left: 2px; }
.input, .textarea, .select {
  width: 100%;
  background: var(--card-2);
  border: 1px solid var(--line);
  border-radius: var(--r-m);
  padding: 9px 12px;
  outline: none;
  transition: border-color .15s, background .15s;
}
.input:focus, .textarea:focus, .select:focus { border-color: var(--brand); background: var(--card); }
.textarea { min-height: 84px; resize: vertical; }
.field .tip { font-size: var(--t-weak); color: var(--text-3); margin-top: 4px; }
.field .tip.warn { color: var(--danger); }

/* ================= 画面配方卡（V2.46.0 第四模块重构，渲染稿 module4-prompt-mock-v1 拍板） =================
   风格/场景/氛围三行 + 来源徽标（系统抽/手选/规则）+ 单层「换…」+ 换一签；
   锁定态变灰上锁挂「恢复自动配方」（铁律①：手动改提示词后配方不凭空消失） */
.recipe-card { border: 1.5px solid var(--brand); border-radius: 12px; background: linear-gradient(180deg, var(--brand-soft), var(--card)); padding: 4px 14px 8px; margin-bottom: 8px; }
.recipe-card.locked { border-color: var(--line-strong); background: var(--card-2); }
.recipe-card.locked .rc-row, .recipe-card.locked .rc-foot { opacity: .55; }
.rc-head { display: flex; align-items: center; gap: 8px; padding: 8px 0 6px; border-bottom: 1px dashed var(--line); }
.rc-head b { font-size: var(--t-aux); color: var(--brand); }
.recipe-card.locked .rc-head b { color: var(--text-2); }
.rc-head .rc-tip { font-size: var(--t-weak); color: var(--text-3); }
.rc-redraw { margin-left: auto; display: inline-flex; align-items: center; gap: 4px; font-size: var(--t-weak); font-weight: 700; color: var(--brand); border: 1px solid var(--brand); background: var(--card); border-radius: 999px; padding: 3px 12px; cursor: pointer; }
.rc-redraw:hover { background: var(--brand); color: #fff; }
.rc-row { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px dashed var(--line); }
.rc-row:last-of-type { border-bottom: none; }
.rc-k { flex: none; width: 34px; font-size: var(--t-weak); color: var(--text-3); font-weight: 600; }
.rc-v { font-size: var(--t-aux); font-weight: 700; color: var(--text); }
.rc-v small { font-weight: 400; color: var(--text-3); margin-left: 6px; font-size: var(--t-weak); }
.rc-v.rc-off { color: var(--text-3); font-weight: 400; }
.rc-src { flex: none; font-size: 10px; padding: 1px 8px; border-radius: 999px; font-weight: 700; white-space: nowrap; }
.rc-src.sys { background: var(--brand-soft); color: var(--brand); }
.rc-src.hand { background: var(--warn-soft); color: var(--gold); }
.rc-src.rule { background: var(--card-2); color: var(--text-3); }
.rc-row .rc-x { margin-left: auto; font-size: var(--t-weak); color: var(--brand); font-weight: 600; cursor: pointer; flex: none; padding: 2px 6px; border-radius: 4px; }
.rc-row .rc-x:hover { background: var(--brand-soft); }
.rc-foot { font-size: var(--t-weak); color: var(--text-3); padding-top: 7px; line-height: 1.7; }
.rc-foot b { color: var(--text-2); }
.rc-lock { display: flex; align-items: center; gap: 10px; background: var(--warn-soft); border: 1px solid var(--gold); border-radius: 10px; padding: 9px 14px; margin-bottom: 8px; font-size: var(--t-weak); color: var(--gold); }
.rc-lock b { font-size: var(--t-aux); }
.rc-unlock { margin-left: auto; background: var(--brand); color: #fff; font-size: var(--t-weak); font-weight: 700; border-radius: 8px; padding: 6px 14px; cursor: pointer; white-space: nowrap; }
.rc-unlock:hover { background: var(--brand-press); }
/* 氛围手选内联池（配方卡氛围行「换…」展开） */
.rc-moodpool { border-top: 1px dashed var(--line); padding: 8px 0 2px; }
.rc-mp-t { font-size: var(--t-weak); color: var(--text-3); margin-bottom: 6px; }
.rc-mp-i { display: inline-block; font-size: var(--t-weak); padding: 3px 10px; border: 1px solid var(--line); border-radius: 999px; margin: 0 6px 6px 0; cursor: pointer; background: var(--card); }
.rc-mp-i:hover { border-color: var(--brand); color: var(--brand); }
.rc-mp-i.on { border-color: var(--brand); background: var(--brand-soft); color: var(--brand); font-weight: 700; }

/* 状态条统一（V2.46.0：联动/体检/润色三条同款，固定顺序；nodelink-bar 退役） */
.st-bar { display: flex; align-items: flex-start; gap: 7px; border-radius: 8px; padding: 7px 11px; font-size: var(--t-weak); margin-bottom: 6px; line-height: 1.6; }
.st-bar svg { flex: none; margin-top: 2px; opacity: .7; }
.st-bar.st-green { background: var(--brand-soft); color: var(--brand); }
.st-bar.st-gold { background: var(--warn-soft); color: var(--gold); }
.st-bar.st-grey { background: var(--card-2); color: var(--text-3); }
.st-bar .st-x { margin-left: auto; font-weight: 600; cursor: pointer; flex: none; padding: 0 4px; border-radius: 4px; white-space: nowrap; }
.st-bar.st-green .st-x:hover { background: rgba(0,0,0,.07); }
.st-bar.st-grey .st-x { color: var(--brand); }

/* 「全部风格」抽屉（V2.46.0 风格区收拢）：抽屉内风格库 DOM 原样，仅外层折叠 */
.style-drawer { margin-top: 10px; }
.style-drawer-bar { display: flex; align-items: center; gap: 10px; margin-top: 8px; flex-wrap: wrap; }
.lbl-tip { font-weight: 400; color: var(--text-3); font-size: var(--t-weak); margin-left: 6px; }
/* 提示词字数条（接 prompt-kit budget.bodyMax；超线提示自动降级） */
.p-budget { display: inline-flex; align-items: center; gap: 7px; font-size: var(--t-weak); color: var(--text-3); margin-right: 2px; }
.p-budget .pb-bar { width: 72px; height: 5px; border-radius: 3px; background: var(--line); overflow: hidden; display: inline-block; }
.p-budget .pb-bar i { display: block; height: 100%; background: var(--brand); border-radius: 3px; }
.p-budget .pb-bar i.over { background: var(--warn); }

/* 选项片（比例 / 风格等单选） */
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
/* 预览卡版式 chips（09-27 两行头部定稿）：三颗均分整行，380px 列宽下不挤压不断行 */
.pv-chips { margin: 0 0 12px; flex-wrap: nowrap; }
.pv-chips .chip { flex: 1; text-align: center; white-space: nowrap; padding-left: 6px; padding-right: 6px; }
.chip {
  padding: 7px 14px;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  font-size: var(--t-aux);
  color: var(--text-2);
  cursor: pointer;
  transition: all .15s;
  user-select: none;
}
.chip:hover { border-color: var(--brand); color: var(--brand); }
.chip.on { background: var(--brand); border-color: var(--brand); color: #fff; }
.chip .mini { font-size: var(--t-weak); opacity: .75; margin-left: 4px; }

/* ================= 步骤条 ================= */
.steps { display: flex; align-items: center; gap: 0; margin-bottom: 20px; }
.step { display: flex; align-items: center; gap: 8px; color: var(--text-3); font-size: var(--t-aux); }
.step .no {
  width: 24px; height: 24px; border-radius: 50%;
  border: 1px solid var(--line-strong);
  display: grid; place-items: center;
  font-size: var(--t-weak);
  background: var(--card);
}
.step.on { color: var(--brand); font-weight: 600; }
.step.on .no { background: var(--brand); border-color: var(--brand); color: #fff; }
.step.done { color: var(--text-2); }
.step.done .no { background: var(--brand-soft); border-color: var(--brand); color: var(--brand); }
.step-line { flex: 1; max-width: 72px; height: 1px; background: var(--line-strong); margin: 0 12px; }

/* ================= 场景 / 风格网格 ================= */
.scene-grid {
  display: grid; gap: 12px;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
}
.scene-card {
  border: 1px solid var(--line);
  border-radius: var(--r-l);
  background: var(--card-2);
  padding: 14px;
  cursor: pointer;
  transition: border-color .15s, background .15s, box-shadow .15s;
}
.scene-card:hover { border-color: var(--brand); box-shadow: var(--shadow-2); }
.scene-card.on { border-color: var(--brand); background: var(--brand-soft); }
.scene-card .sc-ic {
  width: 38px; height: 38px; border-radius: 10px;
  background: var(--brand-soft); color: var(--brand);
  display: grid; place-items: center; margin-bottom: 10px;
}
.scene-card .sc-ic svg { width: 21px; height: 21px; }
.scene-card .sc-n { font-weight: 600; font-size: var(--t-body); }
.scene-card .sc-d { font-size: var(--t-aux); color: var(--text-2); margin-top: 3px; }
.scene-card .rec { color: var(--gold); font-size: var(--t-weak); margin-top: 6px; }

.style-row { display: flex; gap: 10px; flex-wrap: wrap; }
.style-item {
  width: 108px; border: 1px solid var(--line); border-radius: var(--r-m);
  overflow: hidden; cursor: pointer; background: var(--card-2);
  transition: border-color .15s, transform .12s;
  display: flex; flex-direction: column;
  min-height: 154px;
}
.style-item:hover { border-color: var(--brand); transform: translateY(-1px); }
.style-item.on { border-color: var(--brand); box-shadow: 0 0 0 1px var(--brand); }
/* 头图区：swatch 渐变打底 + preview 图片叠加；图片加载失败则隐退显示 swatch */
.style-item .sp-top { position: relative; height: 64px; overflow: hidden; background: var(--card-2); }
.style-item .sp-top.no-preview::after {
  content: '暂无示例图';
  position: absolute; inset: 0;
  display: grid; place-items: center;
  font-size: 11px; color: rgba(255,255,255,.9);
  text-shadow: 0 1px 2px rgba(0,0,0,.35);
  background: rgba(0,0,0,.18);
  pointer-events: none;
}
.style-item .sp-top .sw { position: absolute; inset: 0; height: 100%; display: block; }
.style-item .sp-preview { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
/* 图片加载前骨架闪烁 */
.style-item .sp-preview:not([src]) { opacity: 0; }
.style-item .sp-preview[src=""] { opacity: 0; }
.style-item .sp-preview:not([data-loaded]) { background: linear-gradient(90deg, var(--card-2) 25%, var(--card) 50%, var(--card-2) 75%); background-size: 200% 100%; animation: spSkeleton 1.2s infinite; }
@keyframes spSkeleton { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }
.style-item .sp-tags { display: flex; gap: 4px; padding: 6px 8px 0; min-height: 20px; white-space: nowrap; overflow: hidden; }
.style-item .sp-tags:empty { display: none; }
.sp-tag {
  display: inline-flex; align-items: center; font-size: 10px; color: var(--text-2);
  background: var(--card); border: 1px solid var(--line); border-radius: 3px;
  padding: 1px 5px; line-height: 1.3; max-width: 100%;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.style-item .sn { font-size: 14px; font-weight: 700; color: var(--text); padding: 6px 8px 2px; text-align: center; letter-spacing: .3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.style-item .ss { font-size: var(--t-aux); color: var(--text-2); padding: 2px 8px 8px; text-align: center; line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.9em; }
.style-item .rec-tag { display: inline-block; background: var(--gold); color: #fff; font-size: 10px; border-radius: 3px; padding: 0 4px; margin-left: 4px; vertical-align: 1px; }
/* V2.41.7 仅排版层风格（卡标 genOff，靠文字成立生图出不来）：灰化+禁选+角标，知识仍走排版层 */
.style-item.layout-only { opacity: .55; cursor: not-allowed; }
.style-item.layout-only:hover { border-color: var(--line); transform: none; }
.style-item .lo-tag { display: inline-block; background: var(--text-3, #999); color: #fff; font-size: 10px; border-radius: 3px; padding: 0 4px; margin-left: 4px; vertical-align: 1px; }

/* 知识库推荐区（V2.40.2）：模块→场景→意图/商品 → 风格，附理由与冲突/风险提示。
   只在引擎算出结果时渲染（无结果整块消失，退回原一行说明，不留半截 UI）。 */
.rec-zone { border: 1px solid var(--line); border-radius: var(--r-m); background: var(--card-2); padding: 10px 12px; margin-bottom: 10px; }
.rec-basis { font-size: var(--t-weak); color: var(--text-2); margin-bottom: 8px; }
.rec-basis b { color: var(--text); font-weight: 600; }
.rec-cards { display: flex; gap: 10px; flex-wrap: wrap; }
.rec-cards .style-item { width: 168px; min-height: 180px; }
.rec-cards .style-item .sp-top { height: 90px; }
.rec-cards .style-item .sn { padding-top: 6px; }
.rec-why { font-size: var(--t-weak); color: var(--text-2); padding: 3px 8px 8px; line-height: 1.5; text-align: center; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.rec-warn { margin-top: 8px; font-size: var(--t-aux); line-height: 1.5; border-radius: var(--r-s); padding: 6px 10px; }
.rec-warn.risk { background: rgba(201,162,39,.12); color: #8A6D14; }
.rec-warn.conflict { background: var(--danger-soft); color: var(--danger); }

/* 风格分组（STYLE_GROUPS 五组分类；A 版布局：每组一行、卡片拉伸铺满） */
.style-group { width: 100%; }
.style-group + .style-group { margin-top: 12px; }
.sg-head { display: flex; align-items: baseline; gap: 8px; margin: 2px 0 8px; }
.sg-name { font-size: var(--t-body); font-weight: 700; color: var(--text); }
.sg-desc { font-size: var(--t-weak); color: var(--text-2); }
.sg-row { display: flex; gap: 10px; flex-wrap: wrap; }
.sg-row .style-item { flex: 1 1 0; width: auto; min-width: 0; min-height: 162px; }
.sg-row .style-item .sp-top { height: 72px; }
.sg-row .style-item .ss { -webkit-line-clamp: 1; min-height: 1.45em; }
/* V2.41.6 扩展风格折叠区：58 张卡挤一行会窄到看不清，必须换行 + 固定栅格宽度 */
.sg-row.sg-more { flex-wrap: wrap; margin-top: 8px; }
.sg-row.sg-more .style-item { flex: 0 0 calc(20% - 8px); min-width: 96px; }
/* 响应式：小屏保证卡片最小可点，中屏 4 列，大屏保持弹性 */
@media (max-width: 820px) {
  .sg-row .style-item { flex: 0 0 calc(25% - 8px); min-width: 88px; }
  .sg-row.sg-more .style-item { flex: 0 0 calc(25% - 8px); }
  .style-row .style-item { width: calc(25% - 8px); }
}
@media (max-width: 560px) {
  .sg-row .style-item { flex: 0 0 calc(33.333% - 7px); }
  .sg-row.sg-more .style-item { flex: 0 0 calc(33.333% - 7px); }
  .style-row .style-item { width: calc(33.333% - 7px); }
  .rec-cards .style-item { width: calc(50% - 5px); }
}
.style-more-bar { display: flex; align-items: center; gap: 10px; margin-top: 12px; flex-wrap: wrap; }
.btn-more {
  font-size: var(--t-weak); color: var(--brand); background: #fff;
  border: 1px solid var(--brand); border-radius: 999px; padding: 5px 14px; cursor: pointer;
}
.btn-more:hover { background: var(--brand); color: #fff; }
.more-tip { font-size: var(--t-weak); color: var(--text-2); }
.style-item { position: relative; }
.style-item .sinfo {
  position: absolute; top: 4px; right: 4px; width: 18px; height: 18px;
  border-radius: 50%; background: rgba(0,0,0,.45); color: #fff;
  font: italic 700 11px/18px Georgia, serif; text-align: center; cursor: pointer;
}
.style-item .sinfo:hover { background: var(--brand); }

/* 风格详情弹层 */
.style-dialog { width: 460px; max-width: 92vw; }
.style-dialog .d-b { max-height: 62vh; overflow-y: auto; text-align: left; }
.sd-preview { position: relative; height: 170px; border-radius: 10px; border: 1px solid var(--line); overflow: hidden; background: var(--card-2); }
.sd-preview .sd-sw { position: absolute; inset: 0; height: 100%; display: block; }
.sd-preview-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.sd-tags { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 10px; }
.sd-group {
  display: inline-block; margin-left: 8px; font-size: var(--t-weak); font-weight: 400;
  color: var(--brand); background: rgba(30,122,70,.1); border-radius: 4px;
  padding: 1px 6px; vertical-align: 2px;
}
.sd-short { margin: 8px 0 2px; color: var(--text-2); font-size: var(--t-aux); }
.sd-sec { margin-top: 12px; }
.sd-k { font-size: var(--t-aux); font-weight: 700; color: var(--brand); margin-bottom: 3px; }
.sd-v { font-size: var(--t-body); color: var(--text); line-height: 1.65; }
.sd-sim-row { display: flex; gap: 8px; flex-wrap: wrap; }
.sd-sim {
  width: 96px; border: 1px solid var(--line); border-radius: var(--r-s);
  overflow: hidden; cursor: pointer; background: var(--card-2);
  transition: border-color .15s;
}
.sd-sim:hover { border-color: var(--brand); }
.sd-sim-sw { height: 52px; display: block; }
.sd-sim-name { font-size: 12px; font-weight: 600; color: var(--text); padding: 5px 6px; text-align: center; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ================= 页签 ================= */
.tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--line); margin-bottom: 16px; }
.tab {
  padding: 9px 14px; font-size: var(--t-body); color: var(--text-2);
  border-bottom: 2px solid transparent; margin-bottom: -1px;
  cursor: pointer; transition: color .15s, border-color .15s;
}
.tab:hover { color: var(--text); }
.tab.on { color: var(--brand); border-bottom-color: var(--brand); font-weight: 600; }

/* ================= 图库网格 ================= */
.grid {
  display: grid; gap: 14px;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
}
.g-item {
  background: var(--card); border: 1px solid var(--line);
  border-radius: var(--r-l); overflow: hidden;
  box-shadow: var(--shadow-1);
  transition: box-shadow .15s, transform .15s;
}
.g-item:hover { box-shadow: var(--shadow-2); transform: translateY(-2px); }
.g-item .g-img { aspect-ratio: 4/5; background: var(--card-2); cursor: zoom-in; width: 100%; object-fit: cover; }
.g-item .g-info { padding: 10px 12px; }
.g-item .g-t { font-size: var(--t-aux); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.g-item .g-d { font-size: var(--t-weak); color: var(--text-3); margin-top: 2px; }
.g-item .g-ops { display: flex; gap: 8px; padding: 0 12px 12px; }

.empty {
  text-align: center; color: var(--text-3);
  padding: 56px 0; font-size: var(--t-aux);
}
.empty .big { font-size: 30px; margin-bottom: 10px; }

/* ================= 海报预览 ================= */
.studio { display: grid; grid-template-columns: 1fr 380px; gap: var(--gap); align-items: start; }
@media (max-width: 1180px) { .studio { grid-template-columns: 1fr; } }

.poster-stage {
  background: var(--card-2); border: 1px solid var(--line); border-radius: var(--r-l);
  padding: 18px; display: grid; place-items: center; min-height: 420px;
}
.poster {
  width: 320px; border-radius: 10px; overflow: hidden;
  box-shadow: var(--shadow-3); background: #fff;
  position: relative;
  /* cqw 容器：融合版头块字号按 导出px/1080 等比缩放，预览=导出严格一致 */
  container-type: inline-size;
}
.poster .p-img { width: 100%; aspect-ratio: 4/5; object-fit: cover; background: #EDEAE4; }
.poster .p-bar {
  background: var(--poster-pine); color: #fff;
  padding: 10px 14px 12px;
}
.poster .p-greet { font-size: 17px; font-weight: 700; letter-spacing: 1px; }
.poster .p-wish { font-size: 11.5px; opacity: .92; margin-top: 3px; }
.poster .p-foot {
  display: flex; justify-content: space-between; align-items: center;
  font-size: 10.5px; opacity: .85; margin-top: 8px;
  border-top: 1px solid rgba(255,255,255,.28); padding-top: 7px;
}
.poster .p-ph {
  aspect-ratio: 4/5; display: grid; place-items: center;
  color: var(--text-3); font-size: var(--t-aux);
  background:
    repeating-linear-gradient(45deg, rgba(0,0,0,.02) 0 12px, transparent 12px 24px),
    var(--card-2);
  text-align: center; padding: 20px;
}

/* 经典版·全面屏：1080×2340 比例锁定，画面区自适应填满，色条贴底（与导出一致） */
.poster.classic-full { aspect-ratio: 1080/2340; display: flex; flex-direction: column; }
.poster.classic-full .p-vimg { flex: 1; min-height: 0; position: relative; }
.poster.classic-full .p-vimg .p-img { width: 100%; height: 100%; aspect-ratio: auto; object-fit: cover; display: block; }
.poster.classic-full .p-ph { flex: 1; aspect-ratio: auto; }
.poster.classic-full .p-bar { flex: none; padding: 12px 16px 17px; }
/* 经典版色条四行结构：眉行（品牌·类型+日期）→ 大标题 → 金条副题 → slogan+logo */
.poster.classic-full .pb-top { display: flex; justify-content: space-between; align-items: center; font-size: 10px; font-weight: 600; letter-spacing: 1.5px; opacity: .85; }
.poster.classic-full .p-greet { font-size: 23px; font-weight: 800; letter-spacing: 1px; line-height: 1.2; margin-top: 5px; }
.poster.classic-full .p-wish { display: flex; align-items: center; gap: 8px; font-size: 11.5px; opacity: .95; margin-top: 5px; }
.poster.classic-full .p-wish .pb-bar { width: 22px; height: 3px; background: var(--poster-gold, #C9A227); border-radius: 2px; flex: none; }
.poster.classic-full .p-foot { font-size: 10px; margin-top: 8px; }
.poster.classic-full .pb-logo { height: 13px; width: auto; display: block; }

/* AI 生成进度 → 见 v6 进度条（.gf-*） */
@keyframes pulse { from { opacity: .4 } to { opacity: 1 } }

/* 提示词卡 */
.prompt-box {
  background: var(--card-2); border: 1px solid var(--line);
  border-radius: var(--r-m); padding: 12px 14px;
  font-size: var(--t-aux); color: var(--text-2);
  white-space: pre-wrap; word-break: break-word;
  max-height: 220px; overflow-y: auto;
}

/* 合规提示 */
.comply { display: flex; gap: 8px; align-items: flex-start; font-size: var(--t-aux); border-radius: var(--r-m); padding: 10px 12px; }
.comply.ok { background: var(--brand-soft); color: var(--brand); }
.comply.bad { background: var(--danger-soft); color: var(--danger); }
/* 质检面板标签页（V2.46.3）：合规 / 知识体检 / 排版要点三合一，默认只展开合规 */
.qc-tabs { display: inline-flex; background: var(--card-2); border: 1px solid var(--line); border-radius: 8px; padding: 2px; gap: 2px; margin-bottom: 6px; }
.qc-tab { position: relative; padding: 5px 12px; border-radius: 6px; font-size: var(--t-aux); color: var(--text-2); cursor: pointer; user-select: none; }
.qc-tab.on { background: var(--card); color: var(--brand); font-weight: 600; box-shadow: var(--shadow-1); }
.qc-tab:not(.on):hover { color: var(--text); background: var(--hover); }
.qc-dot { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--danger); margin-left: 5px; vertical-align: 1px; }
.qc-body { margin-top: 2px; }

/* ================= 知识库 KB v2（五段体系 + 进化引擎） ================= */
/* 顶栏：搜索 + 扫描起草 */
/* ---- V2 渲染稿场景一：体系总览（五段流 + 进化引擎三环） ---- */
.fw-wrap { margin-bottom: 14px; }
.fw-flow { display: flex; gap: 10px; align-items: stretch; }
.fw-seg { flex: 1; background: var(--card); border-radius: 10px; box-shadow: 0 1px 3px rgba(0,0,0,.05); border-top: 4px solid #1E7A46; padding: 12px 12px 10px; position: relative; }
.fw-seg::after { content: "›"; position: absolute; right: -10px; top: 38%; font-size: 20px; color: #bbb; z-index: 2; }
.fw-seg:last-child::after { display: none; }
.fw-seg.s1 { border-top-color: #8A6D14; } .fw-seg.s2 { border-top-color: #1E7A46; }
.fw-seg.s3 { border-top-color: #07C160; } .fw-seg.s4 { border-top-color: #C9A227; } .fw-seg.s5 { border-top-color: #576b95; }
.fw-no { font-size: 11px; color: #aaa; letter-spacing: 1px; }
.fw-name { font-size: 16px; font-weight: 700; margin: 2px 0 1px; }
.fw-q { font-size: 12px; color: #999; margin-bottom: 8px; }
.fw-layer { font-size: 12px; color: #444; padding: 3px 0; display: flex; justify-content: space-between; }
.fw-layer i { font-style: normal; color: #fff; background: #c8c9cc; border-radius: 8px; font-size: 10px; min-width: 16px; text-align: center; padding: 1px 4px; height: 16px; line-height: 14px; margin-left: 6px; }
.fw-call { margin-top: 8px; font-size: 11px; color: #07C160; background: #e8f9f0; border-radius: 5px; padding: 4px 7px; line-height: 1.5; }
.fw-call.gray { color: #8A6D14; background: #faf3e0; }
.fw-call.blue { color: #576b95; background: #eef1f7; }
.evo-band { margin-top: 14px; background: linear-gradient(135deg, #0d3d24, #1E7A46); border-radius: 12px; padding: 16px 18px; color: #fff; }
.evo-t { font-size: 14px; font-weight: 700; display: flex; align-items: center; gap: 8px; }
.evo-t .evo-pulse { width: 9px; height: 9px; border-radius: 50%; background: #4ade80; box-shadow: 0 0 8px #4ade80; animation: kb2-pulse 1.6s infinite; }
.evo-rings { display: flex; gap: 12px; margin-top: 12px; }
.evo-ring { flex: 1; background: rgba(255,255,255,.09); border: 1px solid rgba(255,255,255,.15); border-radius: 10px; padding: 11px 13px; position: relative; }
.evo-ring::after { content: "→"; position: absolute; right: -14px; top: 40%; color: rgba(255,255,255,.5); font-size: 15px; }
.evo-ring:last-child::after { content: "↺"; right: -15px; }
.evo-ring h4 { font-size: 13px; font-weight: 700; color: #a7f3c9; }
.evo-ring ul { margin-top: 6px; font-size: 11.5px; line-height: 1.8; color: rgba(255,255,255,.85); list-style: none; padding: 0; }
.evo-ring ul li::before { content: "· "; color: #4ade80; font-weight: 700; }
@media (max-width: 1100px) { .fw-flow, .evo-rings { flex-direction: column; } .fw-seg::after, .evo-ring::after { display: none; } }
/* ↑ ≤1100 为桌面档内调节（横排流程图竖排），保留 */

.kb2-bar { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.kb2-search { flex: 1; display: flex; align-items: center; gap: 8px; background: var(--card); border: 1px solid var(--line); border-radius: var(--r-m); padding: 8px 12px; }
.kb2-search input { flex: 1; border: 0; outline: 0; background: transparent; font-size: var(--t-aux); color: var(--text); }
/* 主体：左树右卡 */
.kb2-main { display: flex; gap: 12px; align-items: flex-start; }
/* V2 渲染稿：树 244px / 圆角 10 / 阴影无描边 */
.kb2-tree { width: 244px; flex: none; background: var(--card); border-radius: 10px; box-shadow: 0 1px 3px rgba(0,0,0,.05); padding: 8px 0; position: sticky; top: 12px; max-height: calc(100vh - 140px); overflow-y: auto; }
.kb2-sec { padding: 9px 14px 4px; font-size: 11.5px; color: #999; display: flex; justify-content: space-between; }
.kb2-sec b { color: #1a1a1a; font-size: 12.5px; font-weight: 700; }
.kb2-node { display: flex; align-items: center; justify-content: space-between; padding: 7px 14px 7px 26px; font-size: 13px; color: #353535; cursor: pointer; border-left: 3px solid transparent; }
.kb2-node:hover { background: var(--card-2); }
.kb2-node.on { background: #e8f9f0; border-left-color: #07C160; color: #07C160; font-weight: 600; }
.kb2-node .cnt { font-size: 11px; color: #bbb; }
.kb2-node.on .cnt { color: #07C160; }
.kb2-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #f0a020; margin-left: 5px; vertical-align: 1px; }
.kb2-evo { margin: 10px 12px 6px; background: linear-gradient(135deg, #0d3d24, #1E7A46); color: #fff; border-radius: 8px; padding: 10px 12px; font-size: 12.5px; cursor: pointer; }
.kb2-evo b { display: flex; align-items: center; gap: 6px; font-size: 13px; }
.kb2-evo .nums { display: flex; gap: 8px; margin-top: 6px; font-size: 11px; color: rgba(255,255,255,.85); }
.kb2-pulse { width: 7px; height: 7px; border-radius: 50%; background: #4ade80; box-shadow: 0 0 6px #4ade80; animation: kb2-pulse 1.6s infinite; }
@keyframes kb2-pulse { 50% { opacity: .4; } }
/* 右侧内容（V2 稿：卡片圆角 10 / 阴影无描边 / padding 15px 17px / 间距 12） */
.kb2-content { flex: 1; min-width: 0; }
.kb2-crumb { font-size: 12.5px; color: #999; margin-bottom: 8px; }
.kb2-crumb b { color: #1a1a1a; }
.kb2-layernote { background: #faf7ec; border: 1px solid #f0e6c8; color: #8a6d14; font-size: 12.5px; border-radius: 8px; padding: 9px 13px; line-height: 1.6; margin-bottom: 10px; }
.kb2-list { display: flex; flex-direction: column; gap: 12px; }
.kb2-card { border-radius: 10px; background: var(--card); box-shadow: 0 1px 3px rgba(0,0,0,.05); padding: 15px 17px; }
.kb2-card.fold { cursor: pointer; }
.kb2-card.fold:hover { box-shadow: var(--shadow-2); }
.kb2-t { font-weight: 700; font-size: 15.5px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.kb2-meta { font-size: 11.5px; color: #999; margin: 7px 0 0; display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.kb2-meta .kid { font-family: ui-monospace, monospace; color: #576b95; }
.kb2-health { color: #1E7A46; }
.kb2-b { font-size: 13px; color: #555; line-height: 1.75; margin-top: 9px; }
.kb2-uses { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 10px; padding-top: 10px; border-top: 1px dashed #eee; align-items: center; }
.kb2-uses .lb { font-size: 11px; color: #aaa; }
.kb2-use { font-size: 11px; border-radius: 4px; padding: 3px 8px; }
.kb2-use.ai { background: #e8f9f0; color: #07C160; }
.kb2-use.qc { background: #faf3e0; color: #8a6d14; }
.kb2-use.man { background: #f0f0f0; color: #888; }
.kb2-sec-t { font-size: 12px; font-weight: 700; color: #1E7A46; margin: 13px 0 7px; }
.kb2-dir { font-size: 13px; color: #353535; line-height: 1.8; list-style: none; padding: 0; margin: 0; }
.kb2-dir li { padding-left: 20px; position: relative; margin: 3px 0; }
.kb2-dir li::before { content: "✓"; position: absolute; left: 0; color: #07C160; font-weight: 700; }
.kb2-dir.bad li::before { content: "✕"; color: #d44; }
.kb2-good { background: #f0faf4; border-left: 3px solid #07C160; border-radius: 0 6px 6px 0; padding: 8px 12px; font-size: 12.5px; color: #333; line-height: 1.7; }
.kb2-qcbox { background: #faf3e0; border-radius: 6px; padding: 8px 12px; font-size: 12.5px; color: #8a6d14; line-height: 1.7; }
.kb2-en { font-family: ui-monospace, monospace; font-size: 11px; color: var(--text-3); background: var(--card-2); border-radius: 6px; padding: 7px 11px; line-height: 1.7; }
.kb2-stats { display: flex; gap: 14px; margin-top: 10px; font-size: 11.5px; color: #999; flex-wrap: wrap; }
.kb2-stats b { color: #07C160; font-weight: 600; }
.kb2-ops { display: flex; gap: 8px; margin-top: 11px; flex-wrap: wrap; align-items: center; }
.kb2-later { font-size: 12px; color: #aaa; margin-left: auto; }
/* 进化中心（V2 稿：胶囊 tab 选中松绿 / 状态行 + 金色扫描钮 / 候选卡阴影无描边） */
.kb2-tabs { display: flex; gap: 8px; margin-bottom: 0; flex-wrap: wrap; }
.kb2-tab { font-size: 13px; padding: 7px 16px; border-radius: 999px; background: var(--card); color: #555; border: 1px solid #e3e4e6; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
.kb2-tab.on { background: #1E7A46; border-color: #1E7A46; color: #fff; font-weight: 600; }
.kb2-tab .n { background: rgba(0,0,0,.12); border-radius: 8px; font-size: 11px; padding: 0 6px; }
.kb2-tab.on .n { background: rgba(255,255,255,.22); }
.kb2-evorow { display: flex; justify-content: space-between; align-items: center; margin: 12px 0; gap: 10px; flex-wrap: wrap; }
.kb2-evorow .st { font-size: 12px; color: #888; }
.btn.gold { background: #C9A227; border-color: #C9A227; color: #fff; font-weight: 600; }
.btn.gold:hover { background: #b8941f; border-color: #b8941f; }
.kb2-cand { background: var(--card); border-radius: 10px; box-shadow: 0 1px 3px rgba(0,0,0,.05); border-left: 4px solid #07C160; padding: 14px 17px; margin-bottom: 10px; }
.kb2-cand.conflict { border-left-color: #f0a020; }
.kb2-cand.review { border-left-color: #576b95; }
.kb2-src { margin-top: 7px; font-size: 12px; color: #576b95; background: #eef1f7; border-radius: 6px; padding: 7px 11px; line-height: 1.6; }
.kb2-check { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 8px; }
.kb2-ck { font-size: 11px; border-radius: 4px; padding: 3px 8px; }
.kb2-ck.ok { background: #e8f9f0; color: #07C160; }
.kb2-ck.warn { background: #fdf3e3; color: #b57708; }
.kb2-ck.info { background: #eef1f7; color: #576b95; }
.kb2-diff { background: #fffbf3; border: 1px solid #f0e2b8; border-radius: 8px; padding: 10px 13px; margin-top: 9px; font-size: 12.5px; line-height: 1.75; color: #6b5410; }
.kb2-diff b { color: #b57708; }
/* 调用矩阵（V2 稿：段头单行 / hot 深绿字 #0a7a3d / cold #f4f4f5） */
.kb2-mx { width: 100%; border-collapse: separate; border-spacing: 4px; }
.kb2-mx th { font-size: 12px; color: #888; font-weight: 600; padding: 6px 8px; text-align: center; }
.kb2-mx th.rh { text-align: left; color: #1a1a1a; font-size: 12.5px; white-space: nowrap; }
.kb2-mx td { background: var(--card); border-radius: 7px; padding: 9px 10px; font-size: 11.5px; text-align: center; vertical-align: top; }
.kb2-mx td.hot { background: #e8f9f0; color: #0a7a3d; font-weight: 600; }
.kb2-mx td.warm { background: #faf3e0; color: #8a6d14; }
.kb2-mx td.cold { background: #f4f4f5; color: #b0b0b0; }
.kb2-mx td .how { display: block; font-size: 10px; color: #999; margin-top: 2px; font-weight: 400; }
.kb2-legend { display: flex; gap: 14px; margin-top: 10px; font-size: 11.5px; color: #888; flex-wrap: wrap; }
.kb2-legend i { display: inline-block; width: 11px; height: 11px; border-radius: 3px; margin-right: 4px; vertical-align: -1px; font-style: normal; }
.kb2-empty { text-align: center; color: var(--text-3); font-size: var(--t-aux); padding: 28px 0; }
/* 变更日志 */
.kb2-log { font-size: var(--t-aux); color: var(--text-2); }
.kb2-log .row { display: flex; gap: 10px; padding: 7px 4px; border-bottom: 1px dashed var(--line); align-items: baseline; }
.kb2-log .ts { color: var(--text-3); font-size: var(--t-weak); flex: none; font-family: ui-monospace, monospace; }
.kb2-log .type { flex: none; font-size: var(--t-weak); border-radius: 4px; padding: 1px 7px; background: var(--card-2); color: var(--text-3); }
.tag { display: inline-block; font-size: var(--t-weak); color: var(--brand); background: var(--brand-soft); border-radius: 4px; padding: 1px 7px; margin: 0 4px 4px 0; }

/* ================= 弹层 ================= */
.toast-wrap { position: fixed; left: 50%; top: 18%; transform: translateX(-50%); z-index: 200; display: flex; flex-direction: column; gap: 8px; align-items: center; pointer-events: none; }
.toast {
  background: rgba(0,0,0,.78); color: #fff;
  font-size: var(--t-aux);
  border-radius: var(--r-m); padding: 10px 18px;
  max-width: 70vw; text-align: center;
  animation: toast-in .18s ease;
}
@keyframes toast-in { from { opacity: 0; transform: translateY(-8px) } to { opacity: 1 } }

.mask {
  position: fixed; inset: 0; z-index: 150;
  background: var(--mask);
  display: grid; place-items: center;
  animation: toast-in .15s ease;
}
.dialog {
  background: var(--card); border-radius: var(--r-l);
  width: min(480px, 92vw); max-height: 86vh; overflow: auto;
  box-shadow: var(--shadow-3);
}
.dialog .d-t { font-size: var(--t-card); font-weight: 600; padding: 18px var(--pad) 0; text-align: center; }
.dialog .d-b { padding: 14px var(--pad) 18px; color: var(--text-2); font-size: var(--t-body); }
.dialog .d-ops { display: flex; border-top: 1px solid var(--line); }
.dialog .d-ops .btn { flex: 1; border: 0; border-radius: 0; min-height: 46px; }
.dialog .d-ops .btn + .btn { border-left: 1px solid var(--line); }
.viewer { max-width: min(560px, 94vw); }
.viewer img { width: 100%; border-radius: 8px; }

/* ================= 桌面档宽度调节 ================= */
/* 桌面窄窗窄栏：主内容区让位（须晚于 .main 基础规则才生效，V2.20.0 探针 D1 实证） */
@media (min-width: 901px) and (max-width: 1280px) {
  .main { margin-left: var(--rail-w); }
}
/* V2.46.0 桌面化：原 ≤900 小屏块（侧栏隐藏+mobile-nav 底栏）已移除，
   手法留档 docs/mobile-legacy.md；窗口窄于 --app-min-w 由 body 底线出横滚兜底 */

/* ================= 做海报 v5：同页编辑+预览 ================= */
.sticky-col { position: sticky; top: calc(var(--topbar-h) + 20px); }
.type-tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--line); margin-bottom: 14px; }
.type-tab {
  padding: 9px 18px; font-size: var(--t-body); color: var(--text-2);
  border-bottom: 2px solid transparent; margin-bottom: -1px; cursor: pointer;
}
.type-tab.on { color: var(--brand); border-bottom-color: var(--brand); font-weight: 600; }

/* 营销日历条 */
.cal-strip { display: flex; gap: 8px; flex-wrap: wrap; }
.cal-item {
  border: 1px solid var(--line); border-radius: var(--r-m);
  background: var(--card-2); padding: 7px 12px;
  font-size: var(--t-aux); cursor: default;
  display: flex; align-items: center; gap: 8px;
  transition: border-color .15s, background .15s;
}
.cal-item .d { color: var(--text-3); font-size: var(--t-weak); }
.cal-item .k { font-size: 10px; border-radius: 3px; padding: 0 4px; background: var(--brand-soft); color: var(--brand); }
.cal-item.today { border-color: var(--gold); }
.cal-item.link { cursor: pointer; }
.cal-item.link:hover { border-color: var(--brand); }
.cal-item.on { border-color: var(--brand); background: var(--brand-soft); }
.cal-item.dim { opacity: .45; }

/* 天气卡 */
.weather-now { display: flex; align-items: center; gap: 14px; }
.weather-now .t { font-size: 24px; font-weight: 700; }
.weather-now .w { font-size: var(--t-aux); color: var(--text-2); }
.weather-days { display: flex; gap: 8px; margin-top: 10px; }
.weather-day {
  flex: 1; text-align: center; border: 1px solid var(--line);
  border-radius: var(--r-m); padding: 7px 4px; background: var(--card-2);
  font-size: var(--t-weak); color: var(--text-2);
}
.weather-day .wd { font-weight: 600; color: var(--text); font-size: var(--t-aux); }

/* 商品录入：模式切换 */
.mini-tabs { display: inline-flex; background: var(--card-2); border: 1px solid var(--line); border-radius: 8px; padding: 2px; gap: 2px; }
.mini-tab { padding: 5px 14px; border-radius: 6px; font-size: var(--t-aux); color: var(--text-2); cursor: pointer; }
.mini-tab.on { background: var(--card); color: var(--brand); font-weight: 600; box-shadow: var(--shadow-1); }

/* 商品清单表（V2.46.3 界面优化·渲染稿 studio-ux-optimization-mock-v2 李叔拍板）：
   表头浅底圆角 / 行分隔线 / 行 hover / 输入框内联（静置无框，聚焦才显品牌色框） /
   首列 32px 缩略图位 / 行内省¥徽章。左右两列描边闭合，整表成一个圆角容器 */
.prod-table { width: 100%; table-layout: fixed; border-collapse: separate; border-spacing: 0; }
.prod-table th {
  font-size: var(--t-weak); color: var(--text-2); text-align: left; padding: 7px 8px; font-weight: 600;
  background: var(--card-2); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); white-space: nowrap;
}
.prod-table th:first-child { border-left: 1px solid var(--line); border-top-left-radius: var(--r-m); }
.prod-table th:last-child { border-right: 1px solid var(--line); border-top-right-radius: var(--r-m); }
.prod-table td { padding: 3px 5px; border-bottom: 1px solid var(--line); }
.prod-table td:first-child { border-left: 1px solid var(--line); }
.prod-table td:last-child { border-right: 1px solid var(--line); }
.prod-table tbody tr:last-child td:first-child { border-bottom-left-radius: var(--r-m); }
.prod-table tbody tr:last-child td:last-child { border-bottom-right-radius: var(--r-m); }
.prod-table tbody tr:hover td { background: var(--hover); }
.prod-table .input { width: 100%; box-sizing: border-box; padding: 6px 8px; font-size: var(--t-aux); background: transparent; border-color: transparent; }
.prod-table td:hover .input { border-color: var(--line); background: var(--card); }
/* 特价列：省¥徽章置于输入框下方，不挤压输入框 */
.prod-table td .prod-sale-input { display: block; width: 100%; min-width: 60px; }
.prod-save-below { display: inline-flex; align-items: center; margin-top: 2px; padding: 1px 7px; border-radius: 999px;
  font-size: var(--t-weak); font-weight: 700; color: #C42A1F; background: #FCE8E4; border: 1px solid #C42A1F;
  white-space: nowrap; font-variant-numeric: tabular-nums; vertical-align: middle;
}
.prod-table .input.inp-err { border-color: var(--danger); background: var(--danger-soft); }
.prod-del { color: var(--text-3); width: 26px; height: 26px; border-radius: 6px; display: grid; place-items: center; }
.prod-del:hover { color: var(--danger); background: var(--danger-soft); }
/* 商品图重配图入口（V2.24.1）：与删除钮同格并排，hover 品牌色区分语义 */
.prod-re { color: var(--text-3); width: 26px; height: 26px; border-radius: 6px; display: inline-grid; place-items: center; }
.prod-re:hover { color: var(--brand); background: var(--brand-soft); }
.prod-ops { display: inline-flex; align-items: center; gap: 2px; white-space: nowrap; }

/* 生成进度条（V2.21.0 引擎控制台：刻度化 + 前沿光点，条纹遮罩零 JS 分段） */
.gf-track { position: relative; height: 8px; border-radius: 3px; background: var(--card-2); border: 1px solid var(--line); overflow: hidden; }
.gf-track::after {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: repeating-linear-gradient(90deg, transparent 0 10px, var(--card) 10px 13px);
}
.gf-bar {
  position: relative; height: 100%; width: 0; border-radius: 3px;
  background: linear-gradient(90deg, var(--brand), var(--fx-mint) 160%);
  transition: width .4s ease;
}
.gf-bar::after {
  content: ''; position: absolute; right: -2px; top: 50%; transform: translateY(-50%);
  width: 8px; height: 8px; border-radius: 50%; background: #CFFFF0;
  box-shadow: 0 0 8px 3px rgba(61, 232, 176, .7);
  animation: gf-tipbre 1.1s ease-in-out infinite;
}
@keyframes gf-tipbre { 50% { box-shadow: 0 0 3px 1px rgba(61, 232, 176, .35); } }
.gf-bar.indet {
  width: 38%; transition: none; animation: gf-slide 1.15s infinite ease-in-out, gf-flow 1.8s linear infinite;
  background: linear-gradient(90deg, var(--brand) 0%, var(--fx-mint) 50%, var(--brand) 100%);
  background-size: 200% 100%; border-radius: 3px;
}
@keyframes gf-flow { 0% { background-position: 0% 0; } 100% { background-position: -200% 0; } }
/* 生成小提示（轮换文案 + 淡入动效） */
.gf-tips { margin-top: 6px; font-size: 11.5px; color: var(--text-3); min-height: 16px; }
.gf-tips:empty { display: none; }
.gf-tips.gf-tips-in { animation: gf-tip-in .5s ease; }
@keyframes gf-tip-in { from { opacity: 0; transform: translateY(3px); } to { opacity: 1; transform: none; } }
.gf-bar.err { background: var(--danger); }
.gf-bar.err::after { display: none; }
@keyframes gf-slide { 0% { margin-left: -32%; } 100% { margin-left: 100%; } }
.gf-status { display: flex; align-items: flex-start; gap: 8px; margin-top: 10px; font-size: 13px; color: var(--text-2); min-height: 20px; }
.gf-status .gf-spin { margin-top: 4px; }
.gf-status #gfText { flex: 1; min-width: 0; line-height: 1.5; font-weight: 600; color: var(--text); }
.gf-spin { width: 12px; height: 12px; flex: none; border: 2px solid var(--line-strong); border-top-color: var(--brand); border-radius: 50%; animation: gf-rot .8s linear infinite; }
@keyframes gf-rot { to { transform: rotate(360deg); } }

/* 商品录入必填校验 */
.prod-table .input.inp-err { border-color: var(--danger); background: var(--danger-soft); }
.prod-table th .req { color: var(--danger); }

/* ===== 活动时间自绘日历 CALPOP（V2.39.0 方案B双月，李叔拍板） ===== */
/* 日期框（替代原生 input[type=date]） */
.calwrap { position: relative; }
.calbox {
  display: flex; align-items: center; gap: 8px; min-height: 42px;
  border: 1px solid var(--line-strong); border-radius: var(--r-m);
  background: var(--card); padding: 9px 12px; cursor: pointer;
  font-size: 14.5px; user-select: none;
}
.calbox:hover, .calbox:focus-visible { border-color: var(--brand); outline: none; }
.calbox.open { border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }
.calbox .cb-d { color: var(--text); white-space: nowrap; }
.calbox .cb-d.pending { color: #FA9D3B; }
.calbox .cb-sep { color: var(--text-3); font-size: 13px; }
.calbox .cb-ico { margin-left: auto; display: flex; color: var(--text-3); }
/* 日历浮层：双月并排 860px，z140（高于风格预览60、低于全局遮罩150） */
.calpop {
  position: absolute; z-index: 140; left: 0; margin-top: 6px;
  width: min(860px, calc(100vw - 40px));
  background: var(--card); border: 1px solid var(--line); border-radius: 14px;
  box-shadow: var(--shadow-3); padding: 18px 20px 14px;
}
.calpop.hidden { display: none; }
.calpop .cp-chips { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.calpop .cp-chips span {
  font-size: 14px; padding: 6px 14px; border-radius: 20px; background: var(--card-2);
  color: var(--text-2); cursor: pointer; white-space: nowrap;
}
.calpop .cp-chips span:hover { background: var(--brand-soft); color: var(--brand); }
.calpop .cp-months { display: flex; gap: 32px; }
.calpop .cp-month { flex: 1; min-width: 0; }
.calpop .cp-mhead {
  display: flex; align-items: center; justify-content: center; gap: 12px;
  font-size: 18px; font-weight: 600; margin-bottom: 12px;
}
.calpop .cp-mhead .cp-nav {
  cursor: pointer; color: var(--text-3); padding: 4px 10px; border-radius: var(--r-s);
  font-weight: 400; user-select: none; font-size: 20px; line-height: 1;
}
.calpop .cp-mhead .cp-nav:hover { background: var(--card-2); color: var(--brand); }
.calpop .cp-mhead .cp-nav.dis { visibility: hidden; }
.calpop .cp-wrow, .calpop .cp-drow { display: grid; grid-template-columns: repeat(7, 1fr); }
.calpop .cp-wrow { font-size: 13px; color: var(--text-3); margin-bottom: 4px; }
.calpop .cp-wrow i { font-style: normal; text-align: center; padding: 2px 0; }
/* 日期格：数字在上、节庆字在下（13px 金粗，V3 终版） */
.calpop .cp-drow i {
  position: relative; cursor: pointer; color: var(--text); user-select: none; font-style: normal;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  height: 64px; border-radius: var(--r-m); line-height: 1.15;
}
.calpop .cp-drow i .cp-dd { font-size: 17px; font-weight: 500; }
.calpop .cp-drow i .cp-nd {
  font-style: normal; font-size: 13px; font-weight: 600; color: var(--gold);
  margin-top: 3px; height: 15px; white-space: nowrap; overflow: hidden; max-width: 100%;
}
.calpop .cp-drow i.dim { color: var(--text-3); cursor: default; background: none !important; }
.calpop .cp-drow i:not(.dim):hover { background: var(--brand-soft); }
.calpop .cp-drow i.today .cp-dd::after {
  content: ''; display: block; margin: 1px auto 0;
  width: 5px; height: 5px; border-radius: 50%; background: var(--brand);
}
.calpop .cp-drow i.inrange { background: var(--brand-soft); border-radius: 0; }
.calpop .cp-drow i.rs, .calpop .cp-drow i.re { background: var(--brand); }
.calpop .cp-drow i.rs .cp-dd, .calpop .cp-drow i.re .cp-dd { color: #fff; }
.calpop .cp-drow i.rs .cp-nd, .calpop .cp-drow i.re .cp-nd { color: #FFE9A8; }
.calpop .cp-drow i.rs { border-radius: var(--r-m) 0 0 var(--r-m); }
.calpop .cp-drow i.re { border-radius: 0 var(--r-m) var(--r-m) 0; }
.calpop .cp-drow i.rs.re { border-radius: var(--r-m); }
.calpop .cp-foot {
  display: flex; align-items: center; margin-top: 14px; padding-top: 12px;
  border-top: 1px solid var(--line); font-size: 15px; color: var(--text-3);
}
.calpop .cp-foot .sel { color: var(--brand); font-weight: 600; }
.calpop .cp-foot .cp-btns { margin-left: auto; display: flex; gap: 10px; }
.calpop .cp-foot button {
  border: none; border-radius: var(--r-m); font-size: 15px; padding: 8px 22px; cursor: pointer;
}
.calpop .cp-foot .cp-clr { background: none; color: var(--text-3); }
.calpop .cp-foot .cp-ok { background: var(--brand); color: #fff; }

/* 主题 AI 参考 */
.ai-ref-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }

/* 提示词编辑 */
.prompt-edit { width: 100%; min-height: 150px; background: var(--card-2); border: 1px solid var(--line); border-radius: var(--r-m); padding: 12px 14px; font-size: var(--t-aux); color: var(--text); line-height: var(--lh); outline: none; resize: vertical; }
.prompt-edit:focus { border-color: var(--brand); }
/* 提示词操作头（V2.23.1）：润色/重置按钮收入标签行，与文本域只隔 6px */
.prompt-head { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.prompt-head-label { font-size: var(--t-aux); color: var(--text-2); }
/* V2.46.3：字数条从操作组里挪出来居中，头部成「标签 ｜ 字数条 ｜ 操作」三分区 */
.prompt-head-actions { display: flex; gap: 8px; flex: none; }
.prompt-head .p-budget { margin-left: auto; margin-right: auto; }
/* 提示词结构视图（V2.46.5）：段 chips + 裁决日志——把 Φ1 结构公式与 Φ2 消解公式显性化在界面上。
   零新色零新组件，全部取自 tokens：可裁段用虚线边框区分，裁决动作用品牌色/警示色区分 */
.prompt-struct { margin: 6px 0 8px; }
.ps-row { display: flex; flex-wrap: wrap; gap: 6px; }
.ps-chip { display: inline-flex; align-items: center; gap: 5px; padding: 3px 9px; border: 1px solid var(--line); border-radius: 999px; background: var(--card-2); font-size: var(--t-weak); color: var(--text-2); }
.ps-chip b { font-weight: 600; font-size: 10px; color: var(--text-3); }
.ps-chip.drop { border-style: dashed; color: var(--text-3); }
.ps-chip i { font-style: normal; font-size: 10px; color: var(--warn); }
.ps-log { margin-top: 7px; padding-top: 6px; border-top: 1px dashed var(--line); font-size: var(--t-weak); color: var(--text-3); }
.ps-log.none { border-top: 0; padding-top: 2px; }
.ps-log-h { color: var(--text-2); font-weight: 600; }
.ps-log-i { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; padding: 2px 0; }
.ps-dim { min-width: 62px; color: var(--text-2); }
.ps-cri { padding: 0 6px; border: 1px solid var(--line); border-radius: 4px; }
.ps-arrow { color: var(--text-3); }
.ps-act { font-weight: 600; }
.ps-act.st { color: var(--danger); }
.ps-act.rw { color: var(--brand); }
.ps-act.kp { color: var(--text-3); }

/* 门店 / 品牌 CRUD */
.cell .ops { display: flex; gap: 6px; flex: none; }
.form-dialog .field { text-align: left; }

/* 工具类 */
.row { display: flex; align-items: center; gap: 10px; }
.row.between { justify-content: space-between; }
.col { display: flex; flex-direction: column; gap: 10px; }
.mt8 { margin-top: 8px; } .mt12 { margin-top: 12px; } .mt16 { margin-top: 16px; }
.muted { color: var(--text-3); font-size: var(--t-weak); }
.hidden { display: none !important; }

/* ================= 登录 / 注册门禁（沃家统一样式：左品牌栏 + 右表单，与沃家账房同族） ================= */
.auth-gate { position: fixed; inset: 0; z-index: 60; background: #f7f5f0; overflow-y: auto; }
.auth-split { display: flex; min-height: 100vh; }
/* 左：品牌栏（固定深松绿，不随主题变化，保持家族统一） */
.auth-side {
  flex: 1.15; min-width: 0; color: #f2efe5;
  background:
    radial-gradient(circle at 85% 12%, rgba(201,162,39,.16) 0 18%, transparent 45%),
    linear-gradient(160deg, #0f2f1d 0%, #14532f 52%, #1E7A46 100%);
  display: flex; flex-direction: column; padding: 36px 52px 26px;
}
.as-brand { display: flex; align-items: center; gap: 12px; }
.as-brand img { height: 34px; width: auto; }
.as-name { font-size: 17px; font-weight: 700; letter-spacing: 1px; }
.as-sub { font-size: 11px; opacity: .7; margin-top: 2px; }
.as-mid { flex: 1; display: flex; flex-direction: column; justify-content: center; padding: 36px 0; max-width: 560px; }
.as-slogan { font-size: 27px; font-weight: 700; line-height: 1.55; letter-spacing: 1px; }
.as-desc { font-size: 12.5px; opacity: .72; line-height: 1.85; margin-top: 14px; }
.as-feats { margin-top: 36px; display: flex; flex-direction: column; gap: 17px; }
.as-feat { display: flex; gap: 12px; align-items: flex-start; }
.as-fic {
  flex: none; width: 30px; height: 30px; border-radius: 8px;
  background: rgba(255,255,255,.1); display: grid; place-items: center; color: #cde8d7;
}
.as-ft { font-size: 13px; font-weight: 600; letter-spacing: .5px; }
.as-fd { font-size: 11px; opacity: .62; margin-top: 2px; line-height: 1.6; }
.as-foot { font-size: 10.5px; opacity: .5; letter-spacing: .5px; }
/* 右：表单栏（固定浅色，不受明暗主题影响） */
.auth-pane { flex: 1; display: grid; place-items: center; padding: 32px 24px; background: #f7f5f0; color: #1a1a1a; }
.auth-card2 { width: 340px; max-width: 100%; }
.auth-tabs {
  display: flex; gap: 4px; margin: 4px 0 18px;
  background: #ece7db; border-radius: 10px; padding: 3px;
}
.auth-tab { flex: 1; padding: 8px 0; border-radius: 8px; font-size: var(--t-body); color: #6b6558; }
.auth-tab.on { background: #fff; color: #1a1a1a; font-weight: 600; box-shadow: 0 1px 4px rgba(0,0,0,.08); }
.auth-pane .field { text-align: left; margin-bottom: 14px; }
.auth-pane .field label { color: #6b6558; }
.auth-pane .input { background: #fff; border: 1px solid #e3ddce; color: #1a1a1a; }
.auth-pane .input:focus { border-color: #1E7A46; }
.pw-wrap { position: relative; }
.pw-wrap .input { width: 100%; padding-right: 38px; box-sizing: border-box; }
.pw-eye { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); cursor: pointer; color: #9a9384; display: grid; place-items: center; }
.pw-eye:hover { color: #1E7A46; }
.auth-submit { width: 100%; margin-top: 6px; padding: 11px 0; font-size: var(--t-body); }
.auth-tip { font-size: var(--t-weak); color: #9a9384; margin-top: 14px; line-height: 1.7; text-align: center; }
.auth-ok { padding: 14px 0 4px; text-align: center; }
.auth-ok-ic { width: 46px; height: 46px; margin: 0 auto; color: #1E7A46; }
.auth-ok-ic svg { width: 100%; height: 100%; }
.auth-ok-t { font-size: 16px; font-weight: 700; margin-top: 10px; }
.auth-ok-s { font-size: var(--t-aux); color: #6b6558; margin: 8px 0 16px; line-height: 1.7; }

/* ================= 顶栏：费用字段 / 用户（A1 定稿 09-27） ================= */
/* cost-chip 在 .info-group 胶囊内，自身去边框背景 */
.cost-chip {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: var(--t-weak); color: var(--text-2);
  background: none; border: 0; padding: 0; cursor: pointer;
}
.cost-chip:hover b { text-decoration: underline; }
.cost-chip b { color: var(--poster-red, #C42A1F); font-weight: 700; }
/* 任务一（09-27）：今日/累计/余额三段视觉区分——今日红（当日消耗）、
   累计墨色（历史沉淀）、余额松绿（账户剩余）；竖线分隔，悬停文案见 title */
.cost-chip .cc-item { display: inline-flex; align-items: baseline; gap: 3px; white-space: nowrap; }
.cost-chip .cc-item + .cc-item { border-left: 1px solid var(--line); padding-left: 7px; }
.cost-chip .cc-total b { color: var(--text); }
.cost-chip .cc-bal b { color: var(--brand); }
/* 用户区：名字末字圆形头像 + 姓名/门店 */
.ugroup { display: inline-flex; align-items: center; gap: 8px; cursor: default; }
.ugroup .avatar {
  width: 32px; height: 32px; border-radius: 50%; flex: none;
  background: var(--poster-pine, #1E7A46); color: #fff;
  display: grid; place-items: center; font-size: 14px; font-weight: 700;
}
.ugroup .n { font-weight: 600; color: var(--text); font-size: var(--t-aux); }
.ugroup .s { color: var(--text-3); font-size: var(--t-weak); }
.rv-tops { text-align: right; white-space: nowrap; }
.rv-tops .btn { margin-left: 6px; }

/* ================= 页面标题（pg 别名，与 page-head 一致） ================= */
.pg-h { margin-bottom: 18px; }
.pg-h h2 { font-size: var(--t-page); font-weight: 700; }
.pg-h p { font-size: var(--t-aux); color: var(--text-2); margin-top: 4px; }

/* ================= 资源费用页 ================= */
.cost-card { padding: 18px 20px; }
.cost-t { font-size: var(--t-card); font-weight: 700; margin-bottom: 6px; }
.cost-note { font-size: var(--t-weak); color: var(--text-3); margin-bottom: 12px; }
.cost-note b { color: var(--brand); }
.stat-row { display: flex; flex-wrap: wrap; gap: 8px 0; }
.stat { flex: 1 1 90px; min-width: 80px; }
.stat b { display: block; font-size: 22px; font-weight: 800; letter-spacing: -.5px; }
.stat span { font-size: var(--t-weak); color: var(--text-3); }
.cost-div { height: 1px; background: var(--line); margin: 14px -20px; }
.cost-row { display: flex; justify-content: space-between; align-items: center; padding: 7px 0; font-size: var(--t-body); }
.cost-row.big .cr-name { font-weight: 700; }
.cr-name { color: var(--text); font-weight: 600; }
.cr-val { color: var(--text-2); font-size: var(--t-aux); }
.cr-cost { color: var(--poster-red, #C42A1F); font-size: 18px; font-weight: 800; }
.cr-bal { font-size: 16px; font-weight: 800; color: var(--text); }
.cost-prov { margin-top: 14px; }
.cost-prov-h { display: flex; justify-content: space-between; align-items: center; font-size: var(--t-body); }
.bar { flex: 1; height: 8px; border-radius: 4px; background: var(--card-2); overflow: hidden; }
.bar.big { height: 10px; margin: 8px 0 10px; }
.bar i { display: block; height: 100%; background: var(--text); border-radius: 4px; min-width: 2px; opacity: .85; }
.cost-model { display: flex; align-items: center; gap: 10px; padding: 5px 0 5px 14px; }
.cm-name { flex: none; width: 190px; font-size: var(--t-weak); color: var(--text-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cm-val { flex: none; width: 60px; text-align: right; font-size: var(--t-weak); color: var(--text-2); }

/* ================= 表格（日志 / 审核 / 成员消耗） ================= */
.table { width: 100%; border-collapse: collapse; font-size: var(--t-aux); }
.table th { text-align: left; color: var(--text-3); font-weight: 500; font-size: var(--t-weak); padding: 6px 8px; border-bottom: 1px solid var(--line); }
.table td { padding: 8px; border-bottom: 1px solid var(--line); vertical-align: top; }
.table tr:last-child td { border-bottom: 0; }
.table .num, .table td.num { text-align: right; font-weight: 700; }
.table .nowrap { white-space: nowrap; color: var(--text-2); }
.cost-table td:last-child { text-align: right; font-weight: 700; }
.log-act { display: inline-block; background: var(--brand-soft); color: var(--brand); border-radius: 4px; padding: 1px 8px; font-size: var(--t-weak); font-weight: 600; white-space: nowrap; }
.log-detail { color: var(--text-2); word-break: break-all; }
.tag.ok { color: var(--brand); background: var(--brand-soft); }
.tag.bad { color: var(--danger); background: var(--danger-soft); }
.tag.wait { color: #B26A00; background: #FFF3E0; }
[data-theme="dark"] .tag.wait { color: #E5B567; background: rgba(229,181,103,.12); }

/* ================= 注册审核 ================= */
.rv-row { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.rv-row:last-child { border-bottom: 0; }
.rv-info { flex: 1; min-width: 0; }
.rv-info b { font-size: var(--t-body); }
.rv-info span { display: block; font-size: var(--t-weak); color: var(--text-3); margin-top: 2px; }
.rv-time { flex: none; font-size: var(--t-weak); color: var(--text-3); }
.rv-ops { flex: none; display: flex; gap: 8px; }

.m-cnt { font-size: var(--t-weak); color: var(--text-3); margin-left: 5px; }

/* ================= 用户管理（V2.14.0）：搜索工具条 / 前端分页条 ================= */
.um-tools { display: flex; align-items: center; gap: 10px; margin: 6px 0 12px; flex-wrap: wrap; }
.um-tools .input { flex: 1 1 200px; min-width: 160px; }
.um-tools select.input { flex: 0 0 auto; width: auto; }
.um-tools .btn { flex: none; }
.um-page { display: flex; align-items: center; justify-content: flex-end; gap: 12px; padding: 12px 0 2px; font-size: var(--t-weak); color: var(--text-3); }

/* ================= 品牌资产：标志版本 / 标准色 ================= */
.logo-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin-top: 12px; }
.logo-ver { border: 1px solid var(--line); border-radius: var(--r-m); overflow: hidden; background: var(--card); }
.lv-preview { height: 110px; display: grid; place-items: center; padding: 14px; }
.lv-preview.light { background: #F7F5F0; }
.lv-preview.dark { background: #17120E; }
.lv-preview img { max-width: 88%; max-height: 70px; object-fit: contain; }
.lv-meta { padding: 9px 12px 2px; display: flex; align-items: baseline; gap: 8px; }
.lv-name { font-size: var(--t-body); font-weight: 700; }
.lv-use { font-size: var(--t-weak); color: var(--text-3); }
.lv-dl {
  display: inline-block; margin: 6px 12px 10px;
  font-size: var(--t-weak); color: var(--brand); font-weight: 600;
  text-decoration: none;
}
.lv-dl:hover { text-decoration: underline; }

.cs-group { margin-top: 6px; }
.cs-group + .cs-group { margin-top: 14px; }
.cs-gt { font-size: var(--t-aux); font-weight: 700; color: var(--text-2); margin-bottom: 8px; }
.cs-row { display: flex; gap: 14px; padding: 8px 0; border-bottom: 1px solid var(--line); }
.cs-row:last-child { border-bottom: 0; }
.cs-sw {
  flex: none; width: 132px; height: 74px; border-radius: var(--r-m);
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: 8px 10px; color: #fff; box-shadow: inset 0 0 0 1px rgba(0,0,0,.06);
}
.cs-sw span { font-size: var(--t-body); font-weight: 700; text-shadow: 0 1px 3px rgba(0,0,0,.25); }
.cs-sw em { font-style: normal; font-size: 10px; opacity: .85; }
.cs-sw[style*="#F7F5F0"] span, .cs-sw[style*="#f7f5f0"] span { color: #17120E; text-shadow: none; }
.cs-sw[style*="#F7F5F0"] em, .cs-sw[style*="#f7f5f0"] em { color: #6b6558; }
.cs-info { flex: 1; min-width: 0; }
.cs-codes { display: flex; flex-wrap: wrap; gap: 6px; }
.cs-code {
  font-size: var(--t-weak); font-family: Consolas, monospace;
  background: var(--card-2); border: 1px solid var(--line);
  border-radius: 4px; padding: 2px 8px; color: var(--text-2);
}
.cs-code[data-hex] { cursor: pointer; color: var(--brand); font-weight: 700; }
.cs-code[data-hex]:hover { border-color: var(--brand); }
.cs-use { font-size: var(--t-weak); color: var(--text-3); margin-top: 6px; line-height: 1.6; }
.cs-rules { margin-top: 16px; border-top: 1px dashed var(--line); padding-top: 12px; }
.cs-rule { display: flex; gap: 10px; align-items: baseline; padding: 4px 0; }
.cs-rule b {
  flex: none; width: 18px; height: 18px; border-radius: 50%;
  background: var(--brand); color: #fff; font-size: 11px;
  display: grid; place-items: center;
}
.cs-rule span { font-size: var(--t-aux); color: var(--text-2); line-height: 1.6; }

/* ================= AI 透明化：标识 / 免责 / 来源 ================= */
/* 生成图角标（叠在 AI 生成画面上） */
.p-vimg { position: relative; }
/* object-fit:cover：与导出裁切口径一致（生图 1080×1440，显示区 4/4.4），
   此前缺省 fill 会把图纵向压扁、主体位置与导出/占位态不一致；
   object-position:center top（V2.23.0 主图自适应）：生图主体限上部，保上裁下不裁头 */
.p-vimg .p-img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.ai-badge {
  position: absolute; right: 8px; top: 8px; z-index: 4;
  display: inline-flex; align-items: center; gap: 3px;
  background: rgba(0,0,0,.62); color: #fff;
  font-size: 10px; font-weight: 600; letter-spacing: .5px;
  border-radius: 4px; padding: 2px 7px;
  backdrop-filter: blur(2px);
}
.ai-badge.static { position: static; backdrop-filter: none; background: var(--text); }
/* 免责 / 来源说明行 */
.ai-note {
  display: flex; align-items: center; gap: 5px;
  font-size: var(--t-weak); color: var(--text-3); line-height: 1.6;
}
.ai-note svg { flex: none; opacity: .7; }

/* ================= AI 生成记录页 ================= */
.gh-card { padding: 14px 16px; }
.gh-head { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.gh-model { font-size: var(--t-weak); color: var(--text-2); font-family: Consolas, monospace; }
.gh-time { margin-left: auto; font-size: var(--t-weak); color: var(--text-3); }
.gh-prompt {
  font-size: var(--t-weak); color: var(--text-3); margin-bottom: 8px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.gh-img { cursor: zoom-in; border-radius: var(--r-m); overflow: hidden; border: 1px solid var(--line); max-width: 340px; }
.gh-img img { width: 100%; display: block; }
.gh-text {
  font-size: var(--t-aux); color: var(--text-2); line-height: 1.7;
  background: var(--card-2); border-radius: var(--r-m); padding: 10px 12px;
  max-height: 140px; overflow-y: auto; white-space: pre-wrap; word-break: break-word;
}
.gh-ops { display: flex; gap: 8px; margin-top: 10px; }

/* ================= 顶栏 ⋯ 更多菜单 ================= */
.more-wrap { position: relative; display: inline-flex; }
.more-menu {
  position: absolute; right: 0; top: calc(100% + 8px); z-index: 60;
  background: var(--card); border: 1px solid var(--line); border-radius: 10px;
  box-shadow: 0 8px 28px rgba(0,0,0,.14); padding: 5px; min-width: 138px;
}
.mm-item {
  display: flex; align-items: center; gap: 8px; width: 100%;
  padding: 9px 10px; border: 0; background: none; border-radius: 7px;
  font-size: var(--t-aux); color: var(--text); cursor: pointer; text-align: left;
}
.mm-item:hover { background: var(--hover); }
.mm-item.danger { color: var(--danger); }
.mm-item svg { width: 14px; height: 14px; flex: none; }
.mm-ver { padding: 7px 14px 5px; font-size: 11px; color: var(--text-3); border-bottom: 1px solid var(--line); margin-bottom: 4px; user-select: none; }

/* ================= 营销日历 · 折叠月历 ================= */
.cal-month { margin-top: 10px; border-top: 1px dashed var(--line); padding-top: 10px; }
.cal-mhead {
  display: flex; align-items: center; justify-content: space-between;
  font-size: var(--t-aux); font-weight: 600; color: var(--text); margin-bottom: 8px;
}
.cm-btn {
  width: 26px; height: 26px; border-radius: 7px; cursor: pointer; line-height: 1;
  border: 1px solid var(--line); background: var(--card); color: var(--text-2); font-size: 14px;
}
.cm-btn:hover { border-color: var(--brand); color: var(--brand); }
.cal-dows {
  display: grid; grid-template-columns: repeat(7, 1fr);
  text-align: center; font-size: 10px; color: var(--text-3); margin-bottom: 4px;
}
.cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 3px; }
.cal-day {
  min-height: 42px; border-radius: 7px; border: 1px solid transparent;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 3px 1px; box-sizing: border-box;
}
.cal-day .cd-n { font-size: var(--t-weak); color: var(--text); line-height: 1.2; }
.cal-day .cd-t {
  font-size: 9px; color: var(--brand); line-height: 1.2; max-width: 100%;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 0 2px;
}
.cal-day.today { border-color: var(--gold); }
.cal-day.today .cd-n { color: var(--gold); font-weight: 700; }
.cal-day.has { cursor: pointer; background: var(--brand-soft); }
.cal-day.has:hover { border-color: var(--brand); }
.cal-day.on { background: var(--brand); border-color: var(--brand); }
.cal-day.on .cd-n, .cal-day.on .cd-t { color: #fff; }
.cal-day.empty { background: none; }

/* ================= 生成步骤（透明化） ================= */
.gf-time { margin-left: auto; flex: none; color: var(--text-3); font-size: 11px; font-family: var(--font-mono); font-variant-numeric: tabular-nums; white-space: nowrap; line-height: 20px; }
.gf-steps { margin-top: 10px; display: flex; flex-direction: column; gap: 6px; font-family: var(--font-mono); }
.gf-steps:empty { display: none; }
/* 步骤行：瑞士三栏网格（标记轴 | 名称 | 参数），名称零断词、参数右对齐；
   V2.21.2 dot 列承载状态图标（done✓/err✕/doing 脉冲点），名称列纯文本零前缀 */
.gf-step { display: grid; grid-template-columns: 12px minmax(0, 1fr) auto; column-gap: 8px; align-items: center; padding: 1px 0; font-size: 12px; color: var(--text-3); }
.gf-step .gf-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--line-strong); justify-self: center; }
.gf-step .gf-dot.gf-ic { width: auto; height: auto; background: none; border-radius: 0; font-size: 11px; font-weight: 700; line-height: 1; animation: none; }
.gf-step > span:nth-child(2) { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gf-step.doing { color: var(--text); }
.gf-step.doing .gf-dot { background: var(--fx-mint); animation: gf-pulse 1s infinite; }
.gf-step.done { color: var(--text-2); }
.gf-step.done .gf-dot { background: var(--brand); }
.gf-step.err { color: var(--danger); }
.gf-step.err .gf-dot { background: var(--danger); }
/* 图标化 dot 不受底色规则影响（同特异性后写胜，须置于 done/err 规则之后） */
.gf-step.done .gf-dot.gf-ic { background: none; color: var(--brand); }
.gf-step.err .gf-dot.gf-ic { background: none; color: var(--danger); }
.gf-step .gf-d { font-size: 11px; color: var(--text-3); text-align: right; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 190px; font-variant-numeric: tabular-nums; }
@keyframes gf-pulse { 50% { opacity: .3; } }

/* ================= 引擎控制台（V2.21.0 生成中预览覆盖层） =================
   复古未来控制台：深松绿舱底 + 青绿单色 + CRT 纹理 + 等宽字体 + AI 日志流；
   只动 transform/opacity，纯 CSS 循环，零 JS 逐帧（日志/百分比由既有 500ms 计时器驱动） */
.poster-stage { position: relative; }
.holo-fx {
  position: absolute; inset: 0; z-index: 8; border-radius: var(--r-l);
  overflow: hidden;
  background: linear-gradient(165deg, #0A1F15 0%, var(--fx-ink) 60%, #040B08 100%);
  box-shadow: inset 0 0 80px rgba(61, 232, 176, .06), 0 10px 32px rgba(0, 0, 0, .25);
}
.holo-fx .hx-crt { position: absolute; inset: 0; pointer-events: none; opacity: .5;
  background: repeating-linear-gradient(0deg, rgba(61, 232, 176, .03) 0 1px, transparent 1px 3px); }
.holo-fx .hx-grid { position: absolute; inset: 0; opacity: .35;
  background-image: linear-gradient(rgba(61, 232, 176, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(61, 232, 176, .05) 1px, transparent 1px);
  background-size: 44px 44px; }
.holo-fx .hx-scan { position: absolute; left: 0; right: 0; height: 2px; top: -2px;
  background: linear-gradient(90deg, transparent, var(--fx-mint) 35%, var(--fx-mint) 65%, transparent);
  filter: drop-shadow(0 0 8px var(--fx-mint));
  animation: hx-scanline 3.6s cubic-bezier(.45, .05, .55, .95) infinite; }
@keyframes hx-scanline { 0% { top: -2px; opacity: 0; } 8% { opacity: .9; } 92% { opacity: .9; } 100% { top: 100%; opacity: 0; } }
.holo-fx .hx-hud { position: absolute; width: 20px; height: 20px; border: 1.5px solid rgba(61, 232, 176, .55); animation: hx-hudbre 2.8s ease-in-out infinite; }
.holo-fx .hx-hud.tl { top: 12px; left: 12px; border-right: 0; border-bottom: 0; }
.holo-fx .hx-hud.tr { top: 12px; right: 12px; border-left: 0; border-bottom: 0; }
.holo-fx .hx-hud.bl { bottom: 12px; left: 12px; border-right: 0; border-top: 0; }
.holo-fx .hx-hud.br { bottom: 12px; right: 12px; border-left: 0; border-top: 0; }
@keyframes hx-hudbre { 0%, 100% { opacity: .4; } 50% { opacity: .95; } }
.holo-fx .hx-top { position: absolute; top: 16px; left: 18px; right: 18px; display: flex; align-items: center; gap: 8px;
  font-family: var(--font-mono); font-size: 10px; letter-spacing: .12em; color: rgba(61, 232, 176, .55); }
.holo-fx .hx-top .rec { width: 7px; height: 7px; border-radius: 50%; background: var(--fx-mint);
  box-shadow: 0 0 8px var(--fx-mint); animation: hx-rec 1.2s ease-in-out infinite; }
@keyframes hx-rec { 50% { opacity: .25; box-shadow: none; } }
.holo-fx .hx-top .el { margin-left: auto; font-variant-numeric: tabular-nums; }
.holo-fx .hx-mid { position: absolute; top: 15%; left: 18px; right: 18px; }
.holo-fx .hx-label { font-family: var(--font-mono); font-size: 10px; letter-spacing: .3em; color: rgba(61, 232, 176, .55); margin-bottom: 4px; }
.holo-fx .hx-pct { font-family: var(--font-mono); font-size: 60px; font-weight: 700; letter-spacing: -.04em; line-height: 1;
  color: #D8FFF0; text-shadow: 0 0 24px rgba(61, 232, 176, .45); }
.holo-fx .hx-pct small { font-size: 20px; font-weight: 400; color: rgba(61, 232, 176, .55); }
.holo-fx .hx-phase { margin-top: 8px; font-size: 12.5px; color: rgba(216, 255, 240, .85); letter-spacing: .06em; }
.holo-fx .hx-cells { display: flex; gap: 3px; margin-top: 14px; }
.holo-fx .hx-cells i { width: 14px; height: 5px; background: rgba(61, 232, 176, .15); border-radius: 1px; transition: background .3s, box-shadow .3s; }
.holo-fx .hx-cells i.on { background: var(--fx-mint); box-shadow: 0 0 6px rgba(61, 232, 176, .7); }
.holo-fx .hx-log { position: absolute; left: 18px; right: 18px; bottom: 38px;
  font-family: var(--font-mono); font-size: 10.5px; line-height: 1.9; color: rgba(61, 232, 176, .8); }
.holo-fx .hx-log .ln { opacity: 0; transform: translateX(-4px); transition: opacity .3s, transform .3s;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.holo-fx .hx-log .ln.in { opacity: 1; transform: none; }
.holo-fx .hx-log .ln .ok { color: #8AFFD6; }
.holo-fx .hx-log .ln .dim { color: rgba(61, 232, 176, .45); }
.holo-fx .hx-log .cur { display: inline-block; width: 7px; height: 12px; background: var(--fx-mint); vertical-align: -2px; animation: hx-rec .9s steps(2) infinite; }
.holo-fx .hx-bot { position: absolute; left: 18px; right: 18px; bottom: 14px; display: flex; justify-content: space-between;
  font-family: var(--font-mono); font-size: 9px; letter-spacing: .1em; color: rgba(61, 232, 176, .4); }
/* 完成实体化：glitch 一闪定格（加在预览首个容器上） */
.hx-final { animation: hx-glitch .7s steps(1); }
@keyframes hx-glitch {
  0% { opacity: 0; transform: translateX(-6px); filter: hue-rotate(40deg) saturate(3) brightness(1.8); }
  18% { opacity: 1; transform: translateX(4px); filter: hue-rotate(-30deg) saturate(2); }
  36% { transform: translateX(-2px); filter: none; }
  54% { transform: translateX(1px); }
  100% { opacity: 1; transform: none; filter: none; }
}
/* 降级：系统减弱动效 → 全部静态 */
@media (prefers-reduced-motion: reduce) {
  .holo-fx .hx-scan, .holo-fx .hx-hud, .holo-fx .hx-top .rec, .holo-fx .hx-log .cur,
  .gf-bar::after, .hx-final { animation: none !important; }
}

/* ================= 图片来源角标 / 记录按钮 ================= */
.p-rec {
  position: absolute; left: 8px; top: 8px; z-index: 4; cursor: pointer;
  background: rgba(0,0,0,.5); color: #fff; backdrop-filter: blur(2px);
  font-size: 10px; border-radius: 4px; padding: 2px 7px;
}
.p-rec:hover { background: rgba(0,0,0,.72); }
/* 节庆装饰开关 chip（V2.38.0 P2）：「记录」正下方同列，关闭态降透明度 */
.p-deco-toggle {
  position: absolute; left: 8px; top: 34px; z-index: 5; cursor: pointer;
  background: rgba(0,0,0,.5); color: #fff; backdrop-filter: blur(2px);
  font-size: 10px; border-radius: 4px; padding: 2px 7px;
}
.p-deco-toggle:hover { background: rgba(0,0,0,.72); }
.p-deco-toggle.is-off { opacity: .45; }
.p-re-main {
  position: absolute; right: 8px; bottom: 8px; z-index: 4; cursor: pointer;
  display: inline-flex; align-items: center; gap: 5px;
  background: rgba(0,0,0,.55); color: #fff; backdrop-filter: blur(2px);
  font-size: 10px; border-radius: 4px; padding: 3px 8px;
}
.p-re-main:hover { background: rgba(30,122,70,.85); }

/* ================= 主图调位（V2.24.0）：图带右上悬浮钮（AI 徽标正下方）+ 调位模式提示条 ================= */
.p-badj {
  position: absolute; right: 8px; top: 34px; z-index: 7; cursor: pointer;
  display: inline-flex; align-items: center; gap: 4px;
  background: rgba(0,0,0,.55); color: #fff; backdrop-filter: blur(2px);
  font-size: 10px; border-radius: 4px; padding: 3px 8px; user-select: none;
}
.p-badj:hover { background: rgba(0,0,0,.75); }
.p-badj.on { background: var(--brand); }
/* 调位模式：图带虚线高亮；全程禁文本选择（拖拽不蓝屏/白块） */
.band-adj-on { outline: 2px dashed rgba(255,255,255,.9); outline-offset: -2px; }
.band-adj-on, .band-adj-on * { user-select: none; -webkit-user-select: none; }
/* 调位提示条：图带内顶部居中（两角徽标不挡、不压底部标题），不进导出（导出走模板字符串非 DOM） */
.band-adj-bar {
  position: absolute; left: 50%; top: 10px; transform: translateX(-50%); z-index: 8;
  display: flex; align-items: center; gap: 8px; white-space: nowrap;
  max-width: calc(100% - 12px);
  background: rgba(0,0,0,.66); color: #fff; backdrop-filter: blur(3px);
  font-size: 11px; border-radius: 999px; padding: 5px 8px 5px 14px;
}
.band-adj-bar .bab-t { opacity: .85; overflow: hidden; text-overflow: ellipsis; }
.band-adj-bar .bab-btn {
  border: 1px solid rgba(255,255,255,.45); background: transparent; color: #fff;
  border-radius: 999px; padding: 3px 12px; font-size: 11px; cursor: pointer; font-family: inherit;
}
.band-adj-bar .bab-btn:hover { background: rgba(255,255,255,.14); }
.band-adj-bar .bab-btn.on { background: var(--brand); border-color: var(--brand); }

/* ================= 融合版头图 3.0（满幅画面；白卡容器 / 渐变压字 两种底块） ================= */
.p-vimg.fuse { position: relative; }
.p-vimg.fuse .p-img { width: 100%; height: 100%; display: block; object-fit: cover; }

/* 融合·白卡：底部白色容器，层级 = 眉毛行 → 取色大标题 → 金条副标题 → 小字脚 */
.pf-card {
  position: absolute; left: 12px; right: 12px; bottom: 12px; z-index: 2;
  background: #fff; border-radius: 16px; box-shadow: 0 12px 32px rgba(0,0,0,.24);
  padding: 14px 17px 12px; color: #1a1a1a;
}
.pf-card .pc-top { display: flex; justify-content: space-between; align-items: center; font-size: 9.5px; letter-spacing: 2px; color: #999; }
.pf-card .pc-brand { font-weight: 600; }
.pf-card .pc-date { border: 1.5px solid currentColor; border-radius: 999px; padding: 1px 10px; font-weight: 600; font-size: 9.5px; color: #888; }
.pf-card .pc-title { font-size: 26px; font-weight: 800; letter-spacing: 1px; line-height: 1.24; margin-top: 9px; }
.pf-card .pc-sub { display: flex; align-items: center; gap: 8px; font-size: 11.5px; color: #666; margin-top: 7px; }
.pf-card .pc-sub .bar { width: 20px; height: 3px; background: var(--poster-gold, #C9A227); border-radius: 2px; flex: none; }
.pf-card .pc-foot {
  display: flex; justify-content: space-between; align-items: center;
  margin-top: 10px; padding-top: 8px; border-top: 1px solid #f0f0f0;
  font-size: 9.5px; color: #999; letter-spacing: 1px;
}

/* 融合·渐变（v9 定稿 F5-a）：顶部暗纱+logo / 金眉行+拖尾线 / 大标题 / 金短线 / 商品清单+省金 / slogan+门店地址
   —— cqw 等比体系（导出 px / 1080 × 100）：预览即导出的严格等比缩略，断行点一致 —— */
.p-gradshade {
  position: absolute; left: 0; right: 0; top: 0; height: 38.9cqw; z-index: 2; pointer-events: none;
  background: linear-gradient(180deg, rgba(21,33,29,.55), rgba(21,33,29,0));
}
.p-gradlogo {
  position: absolute; left: 5.19cqw; top: 13.9cqw; height: 6.67cqw; width: auto; z-index: 2; display: block;
  filter: drop-shadow(0 0.19cqw 0.74cqw rgba(0,0,0,.35));
}
.pf-grad {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 2;
  padding: 38.9cqw 5.19cqw 5.19cqw; color: #fff;
}
.pf-grad .pg-brow { display: flex; align-items: center; }
/* 时间副标题（V2.13.1 动态配色）：字色/阴影/眉线色由 JS browStyleOf() 按主图背景
   WCAG 对比度计算后内联注入（见 app.js fuseGradHtml），此处 color 仅作首绘前兜底 */
.pf-grad .pg-brow-t { font-size: 2.78cqw; font-weight: 700; letter-spacing: 0.56cqw; color: #E8C65A; white-space: nowrap; }
.pf-grad .pg-brow-line { flex: 1; height: 0.19cqw; background: rgba(232,198,90,.4); margin-left: 2.22cqw; }
.pf-grad .pg-title { font-size: 11.1cqw; font-weight: 900; letter-spacing: 0.37cqw; line-height: 1.16; margin-top: 1.48cqw; text-shadow: 0 0.37cqw 2.22cqw rgba(0,0,0,.4); }
.pf-grad .pg-goldbar { width: 5.93cqw; height: 0.74cqw; background: var(--poster-gold, #C9A227); border-radius: 0.37cqw; margin-top: 2.22cqw; }
.pf-grad .pg-sub { font-size: 3.33cqw; font-weight: 700; letter-spacing: 0.19cqw; opacity: .92; margin-top: 1.85cqw; }
.pf-grad .pg-items { margin-top: 2.22cqw; }
.pf-grad .pg-item {
  display: flex; justify-content: space-between; align-items: baseline;
  padding: 1.85cqw 0; border-bottom: 0.19cqw solid rgba(255,255,255,.14);
}
.pf-grad .pgi-name { font-size: 4.44cqw; font-weight: 700; letter-spacing: 0.09cqw; }
.pf-grad .pgi-price { text-align: right; line-height: 1; white-space: nowrap; }
.pf-grad .pgi-price .yen { font-size: 2.78cqw; font-weight: 800; }
.pf-grad .pgi-price .int { font-size: 6.67cqw; font-weight: 900; letter-spacing: -0.09cqw; }
.pf-grad .pgi-price .dec { font-size: 3.33cqw; font-weight: 900; }
.pf-grad .pgi-price .unit { font-size: 2.41cqw; font-weight: 600; opacity: .6; }
.pf-grad .pgi-price .save { display: block; font-size: 2.41cqw; font-weight: 700; color: #E8C65A; letter-spacing: 0.05cqw; margin-top: 0.56cqw; }
.pf-grad .pg-foot {
  display: flex; justify-content: space-between; align-items: center;
  margin-top: 2.96cqw; padding-top: 2.59cqw; border-top: 0.19cqw solid rgba(255,255,255,.14);
  font-size: 2.41cqw; letter-spacing: 0.28cqw; opacity: .85;
}
.pf-grad .pg-addr { color: #E8C65A; font-weight: 700; opacity: 1; max-width: 58%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: right; }

/* 数字排版统一：价格 / 表格数字等宽对齐，多位数字上下不跳动 */
.pf-grad .pgi-price, .table .num, .table td.num { font-variant-numeric: tabular-nums; }

.poster.fuse { padding: 0; overflow: hidden; }
.poster.fuse .p-vimg { border-radius: 0; }
/* 长图融合占位：必须显式 text-align:left——.poster .p-ph 基类带 text-align:center，
   会继承进绝对定位的 .pf-grad 头块，导致生成前标题/副标题居中、生成后左对齐（前后排版不一致 BUG） */
.p-ph.fuse { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: left; }
/* 渐变占位提示：墨底胶囊钉顶部居中（浅灰占位底上清晰可见），避免与底部头块挤一起 */
.p-ph.fuse .p-ph-hint {
  position: absolute; top: 26px; left: 50%; transform: translateX(-50%); z-index: 2;
  width: max-content; max-width: 86%; padding: 8px 16px 9px; border-radius: 999px;
  background: rgba(21,33,29,.42);
  text-align: center; color: rgba(255,255,255,.92); font-size: 11px; letter-spacing: 2px;
  pointer-events: none;
}
.p-ph.fuse .p-ph-hint span { font-size: 9.5px; letter-spacing: .5px; opacity: .85; }
.p-ph-fuse {
  position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column;
  align-items: center; justify-content: flex-start; padding-top: 30px; color: rgba(255,255,255,.92);
  font-size: 13px; text-align: center; text-shadow: 0 1px 6px rgba(0,0,0,.4); pointer-events: none;
}
.p-ph-fuse span { font-size: 11px; opacity: .85; margin-top: 4px; }
/* 占位提示胶囊：半透明墨底，浅灰占位/图上均清晰可见 */
.p-ph-fuse .p-ph-chip {
  display: inline-block; font-style: normal; background: rgba(21,33,29,.42);
  padding: 9px 18px 10px; border-radius: 999px; backdrop-filter: blur(2px);
}
.p-ph-fuse .p-ph-chip span { display: block; }

/* ================= 瀑布流卡片（AI记录 / 图库 / 我的产出） ================= */
.masonry { column-count: 3; column-gap: 12px; }
@media (max-width: 1280px) { .masonry { column-count: 2; } }
/* 图片型网格（全员/我的产出、商品图库）6 列高密度瀑布流（李叔 09-27：双列/三列信息密度过低）。
   按桌面视口逐级降列，卡片宽度保持可读 */
.masonry.gal6 { column-count: 6; column-gap: 10px; }
.masonry.gal6 .m-item { margin-bottom: 10px; }
@media (max-width: 1500px) { .masonry.gal6 { column-count: 5; } }
@media (max-width: 1200px) { .masonry.gal6 { column-count: 4; } }
.m-item {
  /* position:relative（V2.35.0）：商品图库卡片右上角 ✎ 改名钮靠它定位 */
  position: relative;
  break-inside: avoid; margin-bottom: 12px; cursor: pointer;
  background: var(--card); border: 1px solid var(--line); border-radius: 10px; overflow: hidden;
  transition: box-shadow .15s ease, transform .15s ease;
}
.m-item:hover { box-shadow: 0 6px 18px rgba(0,0,0,.10); transform: translateY(-1px); }
.m-item .m-img { width: 100%; display: block; background: var(--hover); }
.m-meta { padding: 8px 10px 10px; }
.m-t { font-size: var(--t-aux); font-weight: 600; color: var(--text); display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.m-d { font-size: var(--t-aux); color: var(--text-2); margin-top: 3px; line-height: 1.5; }
.m-text {
  padding: 10px 12px; font-size: var(--t-aux); color: var(--text-2); line-height: 1.7;
  max-height: 132px; overflow: hidden; position: relative;
}
.m-text::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 40px;
  background: linear-gradient(transparent, var(--card));
}
.m-kind {
  display: inline-block; font-size: 10px; border-radius: 4px; padding: 1px 6px; flex: none;
  background: var(--brand-soft); color: var(--brand);
}
.m-kind.llm { background: rgba(201,162,39,.14); color: #9a7b14; }
/* 图片用途角标（V2.27.0）：主图=品牌松绿（默认），商品图=淡蓝，未标注=中性灰 */
.m-kind.prod { background: rgba(43,108,176,.12); color: #2b6cb0; }
.m-kind.unknown { background: rgba(120,120,120,.12); color: #6b6b6b; }

/* 图片详情浮层 */
/* V2.36.0 方案A：详情弹窗重排（李叔 09-30 截图派单）
   旧版操作按钮排在右侧 45% 窄栏（.id-side .d-ops），5 钮各分不到 60px 导致文字竖断，
   本版改为弹窗通栏底条 .d-opsbar（已删除旧的 .id-side .d-ops 规则，无残留） */
.id-dialog {
  width: min(760px, 92vw); max-height: 88vh;
  display: flex; flex-direction: column; position: relative; overflow: hidden;
}
.id-imgwrap {
  flex: 1 1 55%; min-width: 0; display: flex; align-items: flex-start; justify-content: center;
  background: var(--hover); border-radius: 10px; overflow: hidden;
}
.id-imgwrap img { max-width: 100%; max-height: 76vh; display: block; object-fit: contain; cursor: zoom-in; }
.id-body { display: flex; gap: 16px; padding: 16px; flex: 1; min-height: 0; overflow: auto; }
.id-side { flex: 1 1 45%; min-width: 0; display: flex; flex-direction: column; }
.id-side .d-b { flex: 1; }
/* 右上独立关闭：位置让位给通栏操作条后，∁ 不再与危险操作争）
   z-index 5 保证压在标题与信息之上 */
.id-x {
  position: absolute; top: 10px; right: 12px; z-index: 5;
  width: 30px; height: 30px; border: 0; border-radius: 50%;
  background: rgba(0, 0, 0, .05); color: var(--text-2); font-size: 15px; line-height: 1;
  display: grid; place-items: center; cursor: pointer; transition: background .15s, color .15s;
}
.id-x:hover { background: rgba(0, 0, 0, .1); color: var(--text); }
/* 通栏操作条：宽由 45% 窄栏 → 弹窗全宽，每钮 ≥120px 不再竖字；主钮独占富余宽度 */
.d-opsbar { border-top: 1px solid var(--line); background: var(--card); padding: 12px 16px; display: flex; gap: 10px; align-items: center; }
/* min-width 保底：按钮再多也不至于被挤成窄条（删除这类短钮同样体面、好点） */
.d-opsbar .btn { min-height: 40px; min-width: 104px; white-space: nowrap; flex: none; }
.d-opsbar .btn.primary { flex: 1; }
.d-opsbar .btn .ic { font-size: 15px; line-height: 1; }
/* 信息分组小标题（文件 / 导出 / 图源） */
.d-grp { margin-top: 12px; }
.d-grp:first-child { margin-top: 10px; }
.d-grp .gt { font-size: var(--t-aux); color: var(--text-3); letter-spacing: 2px; margin-bottom: 2px; }
.rec-row b.hl { color: var(--brand); font-weight: 600; }
.rec-row b.mut { color: var(--text-3); font-weight: 400; }
.rec-row b.brand { color: var(--brand); }
.id-prompt {
  margin-top: 8px; padding: 8px 10px; background: var(--hover); border-radius: 8px;
  font-size: var(--t-weak); color: var(--text-2); line-height: 1.6;
  max-height: 160px; overflow: auto; word-break: break-all; user-select: text;
}

/* ================= 生成记录弹窗 ================= */
.rec-row {
  display: flex; align-items: baseline; gap: 10px; font-size: var(--t-aux);
  padding: 4px 0; border-bottom: 1px dashed var(--line);
}
.rec-row span { flex: none; width: 76px; color: var(--text-3); font-size: var(--t-weak); }
.rec-row b { color: var(--text); font-weight: 600; word-break: break-all; }
.rec-prompt {
  margin-top: 8px; font-size: var(--t-weak); color: var(--text-2); line-height: 1.7;
  background: var(--card-2); border-radius: var(--r-m); padding: 10px 12px;
  max-height: 130px; overflow-y: auto; white-space: pre-wrap; word-break: break-word;
}

/* ================= 风格头图悬停大图预览 ================= */
#stylePreview {
  position: fixed; z-index: 90; width: 240px; pointer-events: none;
  background: var(--card); border: 1px solid var(--line); border-radius: 12px;
  box-shadow: 0 12px 40px rgba(0,0,0,.18); padding: 10px; box-sizing: border-box;
  opacity: 0; transform: translateY(6px) scale(.96);
  transition: opacity .16s ease, transform .16s ease;
}
#stylePreview.show { opacity: 1; transform: translateY(0) scale(1); }
#stylePreview.below { transform: translateY(-6px) scale(.96); }
#stylePreview.below.show { transform: translateY(0) scale(1); }
#stylePreview .sp-top { height: 140px; border-radius: 8px; border: 1px solid var(--line); overflow: hidden; position: relative; }
#stylePreview .sp-top .sw { position: absolute; inset: 0; height: 100%; display: block; }
#stylePreview .sp-preview { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
#stylePreview .sp-name { font-size: 14px; font-weight: 700; color: var(--text); margin-top: 8px; }
#stylePreview .sp-short { font-size: var(--t-aux); color: var(--text-2); margin-top: 2px; }
#stylePreview .sp-tip { font-size: 10px; color: var(--brand); margin-top: 6px; }

/* ================= 新版本提示横幅 ================= */
.ver-banner {
  display: flex; align-items: center; justify-content: center; gap: 12px;
  padding: 8px 16px; font-size: var(--t-weak);
  background: var(--brand-soft); color: var(--brand);
  border-bottom: 1px solid var(--line);
}
.ver-banner button {
  border: 1px solid var(--brand); background: var(--brand); color: #fff;
  font-size: var(--t-weak); border-radius: 6px; padding: 3px 12px; cursor: pointer;
}
.ver-banner button:hover { background: var(--brand-press); }

/* ================= 批量导入向导（三步） ================= */
.imp-steps { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }
.imp-step {
  display: flex; align-items: center; gap: 6px;
  font-size: var(--t-aux); color: var(--text-3);
  transition: color .2s ease;
}
.imp-step i {
  width: 20px; height: 20px; border-radius: 50%;
  display: grid; place-items: center;
  font-size: var(--t-weak); font-style: normal;
  background: var(--hover); color: var(--text-3);
  transition: background .2s ease, color .2s ease;
}
.imp-step.on { color: var(--text); font-weight: 600; }
.imp-step.on i { background: var(--brand); color: #fff; }
.imp-step.done { color: var(--brand); }
.imp-step.done i { background: var(--brand-soft); color: var(--brand); }
.imp-step-sep { flex: 0 0 22px; height: 1px; background: var(--line-strong); }

/* 第①步：拖拽上传区 */
.imp-drop {
  border: 1.5px dashed var(--line-strong);
  border-radius: var(--r-l);
  background: var(--card-2);
  padding: 30px 16px;
  text-align: center;
  cursor: pointer;
  transition: border-color .2s ease, background .2s ease;
}
.imp-drop:hover { border-color: var(--brand); }
.imp-drop.over {
  border-color: var(--brand);
  background: var(--brand-soft);
}
.imp-drop-ico { color: var(--brand); margin-bottom: 8px; }
.imp-drop-t { font-size: var(--t-body); color: var(--text); }
.imp-drop-t .imp-link { color: var(--brand); font-weight: 600; text-decoration: underline; }
.imp-drop-s { font-size: var(--t-weak); color: var(--text-3); margin-top: 6px; }
.imp-paste-tg {
  margin-top: 10px;
  font-size: var(--t-aux); color: var(--text-2);
  display: flex; align-items: center; gap: 4px;
  border-radius: var(--r-s); padding: 4px 6px;
  transition: background .15s, color .15s;
}
.imp-paste-tg:hover { background: var(--hover); color: var(--text); }
.imp-paste-tg .imp-paste-arrow { transition: transform .2s ease; }
.imp-paste-tg.open .imp-paste-arrow { transform: rotate(180deg); }

/* 第②步：映射 + 预览 */
.imp-file-line {
  display: flex; align-items: center; gap: 6px;
  font-size: var(--t-aux); color: var(--text-2); margin-bottom: 10px;
}
.imp-nohd {
  margin-left: 6px; padding: 1px 7px;
  font-size: var(--t-weak); color: var(--warn);
  background: var(--warn-soft); border-radius: 5px;
}
.imp-map { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }
.imp-col {
  display: flex; flex-direction: column; gap: 4px;
  min-width: 108px; max-width: 150px;
  padding: 7px 9px;
  border: 1px solid var(--line); border-radius: var(--r-m);
  background: var(--card-2);
  transition: opacity .2s ease, border-color .2s ease;
}
.imp-col.off { opacity: .55; }
.imp-col-h {
  font-size: var(--t-weak); color: var(--text-2);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.imp-col-s { padding: 4px 6px; font-size: var(--t-weak); }
.imp-sum { font-size: var(--t-aux); color: var(--text-2); margin-bottom: 6px; }
.imp-ok { color: var(--brand); font-weight: 600; }
.imp-bad-t { color: var(--danger); }
.imp-prev {
  max-height: 320px; overflow-y: auto;
  border: 1px solid var(--line); border-radius: var(--r-m);
  padding: 4px 8px;
}
.imp-table td { font-size: var(--t-aux); padding: 5px 6px; }
.imp-table .imp-no { color: var(--text-3); width: 30px; }
.imp-table .imp-empty { color: var(--text-3); }
.imp-table tr.imp-bad td { background: var(--danger-soft); }
.imp-table tr.imp-bad td:first-child { border-radius: var(--r-s) 0 0 var(--r-s); }
.imp-table tr.imp-bad td:last-child { border-radius: 0 var(--r-s) var(--r-s) 0; }

/* 第③步：结果 */
.imp-result { padding-top: 2px; }
.imp-res-counts { display: flex; gap: 18px; font-size: var(--t-card); margin-bottom: 12px; }
.imp-sec {
  border: 1px solid var(--line); border-radius: var(--r-m);
  background: var(--card-2);
  padding: 8px 12px; margin-bottom: 8px;
}
.imp-sec summary { font-size: var(--t-aux); color: var(--text-2); cursor: pointer; }
.imp-sec .imp-names { font-size: var(--t-aux); color: var(--text); margin-top: 6px; line-height: 1.7; }
.imp-sec-t { font-size: var(--t-aux); font-weight: 600; color: var(--text); margin-bottom: 6px; }
.imp-fail {
  display: flex; align-items: baseline; gap: 10px;
  font-size: var(--t-aux); padding: 3px 0;
}
.imp-fail-no { color: var(--text-3); flex: none; }
.imp-fail-t { color: var(--danger); flex: none; }
.imp-fail-raw {
  color: var(--text-3); font-size: var(--t-weak);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* ================= 手动填写 · 拖拽排序 ================= */
.prod-grip { width: 26px; padding-right: 0 !important; }
.prod-grip-h { width: 26px; }
.prod-table .grip {
  display: grid; place-items: center;
  width: 22px; height: 26px;
  color: var(--text-3);
  border-radius: 6px;
  cursor: grab;
  transition: color .15s, background .15s;
}
.prod-table .grip:hover { color: var(--brand); background: var(--brand-soft); }
.prod-table .grip:active { cursor: grabbing; }
.prod-table tr.dragging { opacity: .45; }
.prod-table tr.drop-before td { box-shadow: inset 0 2px 0 var(--brand); }
.prod-table tr.drop-after td { box-shadow: inset 0 -2px 0 var(--brand); }

/* ================= 版本更新弹窗（V2.16.0，设计稿 v2 定稿） =================
   【硬编码·品牌展示色】金绿细线/大版本号的深绿 #155E35 为品牌色，不进功能组件；
   【动态主题色】卡片/文字/线/按钮一律走 var(--*) 跟随明暗主题 */
.upd-dialog { width: min(430px, 92vw); max-width: 92vw; padding: 0; overflow: hidden; }
.upd-dialog::before { content: ''; display: block; height: 3px; background: linear-gradient(90deg, #1E7A46, var(--gold)); }
.upd-in { padding: 24px 28px 22px; }
.upd-brow { font-size: 12px; letter-spacing: 2.5px; color: var(--text-3); font-weight: 600; }
.upd-ver { display: flex; align-items: baseline; gap: 10px; margin-top: 8px; }
.upd-ver .v { font-size: 27px; font-weight: 800; color: #155E35; letter-spacing: .5px; }
[data-theme="dark"] .upd-ver .v { color: #7BC79B; }
.upd-ver .d { font-size: 12px; color: var(--text-3); }
.upd-rule { height: 1px; background: var(--line); margin: 15px 0 4px; }
.upd-list { padding: 4px 0 2px; max-height: 264px; overflow-y: auto; }
.upd-li { display: flex; gap: 11px; padding: 8px 0; }
.upd-li .mk { flex: none; color: var(--gold); font-size: 13px; line-height: 1.75; }
.upd-li .tx { font-size: 13.5px; line-height: 1.75; color: var(--text); }
.upd-li .tx b { color: #155E35; font-weight: 600; }
[data-theme="dark"] .upd-li .tx b { color: #7BC79B; }
.upd-btn { width: 100%; height: 44px; margin-top: 14px; font-size: 15px; font-weight: 600; letter-spacing: 1px; }
.upd-note { text-align: center; font-size: 11.5px; color: var(--text-3); margin-top: 10px; }
.upd-note b { color: #8A6D14; font-weight: 600; cursor: pointer; }
[data-theme="dark"] .upd-note b { color: var(--gold); }

/* ================= 关于软件页（V2.16.0，设计稿 v2 定稿） =================
   【硬编码·品牌展示色】墨绿品牌卡 #0F3D24 + 金 #C9A227 为品牌形象色，明暗主题通用；
   其余卡片/文字走主题变量 */
.ab { max-width: 1080px; }
.ab-hero { background: #0F3D24; border-radius: 14px; padding: 34px 36px 30px; color: #fff; position: relative; overflow: hidden; }
.ab-hero::after { content: ''; position: absolute; right: -70px; top: -70px; width: 240px; height: 240px; border-radius: 50%; background: rgba(201,162,39,.12); }
.ab-hero::before { content: ''; position: absolute; right: 30px; bottom: -100px; width: 180px; height: 180px; border-radius: 50%; background: rgba(255,255,255,.05); }
.ab-hero-top { display: flex; align-items: center; gap: 18px; position: relative; z-index: 1; }
.ab-lg { height: 64px; padding: 0 22px; background: #fff; border-radius: 14px; display: grid; place-items: center; flex: none; }
.ab-lg img { height: 26px; width: auto; display: block; } /* 横版 logo（465×86）按高度撑，白砖自适应宽度 */
.ab-nm { font-size: 24px; font-weight: 800; letter-spacing: 1px; }
.ab-sb { font-size: 12.5px; opacity: .68; margin-top: 3px; letter-spacing: 1px; }
.ab-ver { margin-left: auto; text-align: right; flex: none; position: relative; z-index: 1; }
.ab-ver .v { display: inline-block; border: 1px solid rgba(201,162,39,.55); color: #C9A227; border-radius: 999px; padding: 4px 15px; font-size: 13.5px; font-weight: 700; letter-spacing: .5px; }
.ab-ver .u { font-size: 11px; opacity: .6; margin-top: 7px; }
.ab-slogan { position: relative; z-index: 1; margin-top: 24px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.14); }
.ab-slogan .cn { font-size: 19px; font-weight: 600; letter-spacing: 1.5px; color: #F3E3A8; }
.ab-slogan .en { font-size: 11px; letter-spacing: 3px; opacity: .5; margin-top: 6px; }
.ab-card { background: var(--card); border-radius: 12px; padding: 22px 26px; margin-top: 14px; }
.ab-sec-t { display: flex; align-items: center; gap: 9px; font-size: 15px; font-weight: 700; margin-bottom: 12px; color: var(--text); }
.ab-sec-t::before { content: ''; width: 4px; height: 15px; border-radius: 2px; background: var(--gold); }
.ab-who { font-size: 13.5px; line-height: 1.95; color: var(--text-2); }
.ab-pillars { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 14px; }
.ab-pl { background: var(--card); border-radius: 12px; padding: 20px 20px 18px; border-top: 3px solid #1E7A46; }
.ab-pl .no { font-size: 11px; letter-spacing: 2px; color: #8A6D14; font-weight: 700; }
[data-theme="dark"] .ab-pl .no { color: var(--gold); }
.ab-pl h4 { font-size: 14.5px; font-weight: 700; margin: 7px 0 8px; color: var(--text); }
.ab-pl p { font-size: 12.5px; line-height: 1.8; color: var(--text-2); }
.ab-val { display: grid; grid-template-columns: repeat(3, 1fr); }
.ab-vl { padding: 4px 18px 4px 0; }
.ab-vl + .ab-vl { border-left: 1px solid var(--line); padding-left: 20px; }
.ab-vl h5 { font-size: 13.5px; font-weight: 700; color: #155E35; margin-bottom: 6px; }
[data-theme="dark"] .ab-vl h5 { color: #7BC79B; }
.ab-vl p { font-size: 12.5px; line-height: 1.8; color: var(--text-2); }
.rel-item { display: flex; gap: 14px; padding: 13px 0; border-bottom: 1px solid var(--line); }
.rel-item:last-child { border-bottom: 0; padding-bottom: 2px; }
.rel-rail { flex: none; display: flex; flex-direction: column; align-items: center; width: 14px; }
.rel-rail .r-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--gold); margin-top: 6px; box-shadow: 0 0 0 3px rgba(201,162,39,.16); }
.rel-item.old .r-dot { background: #CBCDD3; box-shadow: none; }
.rel-rail .r-line { flex: 1; width: 1px; background: var(--line); margin-top: 5px; }
.rel-item:last-child .r-line { display: none; }
.rel-main { flex: 1; min-width: 0; }
.rel-head { display: flex; align-items: baseline; gap: 10px; }
.rel-v { font-size: 14px; font-weight: 700; color: #155E35; }
[data-theme="dark"] .rel-v { color: #7BC79B; }
.rel-item.old .rel-v { color: var(--text); font-weight: 600; }
.rel-d { font-size: 12px; color: var(--text-3); }
.rel-tag { font-size: 11px; color: #8A6D14; border: 1px solid rgba(201,162,39,.4); border-radius: 4px; padding: 0 6px; }
[data-theme="dark"] .rel-tag { color: var(--gold); }
.rel-list { margin-top: 5px; font-size: 12.5px; line-height: 1.8; color: var(--text-2); padding-left: 0; }
.rel-list li { margin-left: 15px; }

/* ================= 促销六形式（V10 新骨架） ================= */
/* 预览：1080 定宽模板 + JS 实测缩放，保证预览=导出像素级一致 */
.promo6-wrap { position: relative; width: 100%; overflow: hidden; border-radius: var(--r-l, 14px); box-shadow: 0 10px 32px rgba(0,0,0,.22); }
.promo6-scale { width: 1080px; transform-origin: top left; }
.promo6-wrap .ai-badge { z-index: 6; }
.promo6-wrap .p-rec, .promo6-wrap .p-re-main { z-index: 6; }

/* ============================================================
   图片重生成 + 版本历史 · 方案 A「微信清爽风」V2.28.1
   设计要点：标题左对齐+信息副标 / 分段控件 Tab / 提示词内嵌卡 /
   主按钮留边圆角 / 说明文字归入按钮下方
   颜色一律走 tokens.css 变量，不写死色值。
   注：UI 主色 = 微信绿（--brand）；品牌松绿（--poster-pine）按规范
   只用于海报内容，不进界面组件。若李叔要这张弹窗改松绿，把 --ih-accent 换成 var(--poster-pine) 即可。
   ============================================================ */
.ih-dialog { --ih-accent: var(--brand); --ih-accent-press: var(--brand-press); width: 480px; max-width: 94vw; padding: 0; overflow: hidden; border-radius: var(--r-l); }

/* 头部：主标题 + 副标（模型 · 耗时 · 旧版存历史）+ 圆形关闭 */
.ih-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 16px 18px 12px; }
.ih-head-l { min-width: 0; }
.ih-t { font-size: var(--t-card); font-weight: 600; color: var(--text); line-height: 1.4; }
.ih-sub { font-size: var(--t-weak); color: var(--text-2); margin-top: 4px; line-height: 1.5; }
.ih-x { flex: none; width: 26px; height: 26px; border-radius: 50%; background: var(--bg); color: var(--text-2); display: flex; align-items: center; justify-content: center; font-size: 13px; cursor: pointer; }
.ih-x:hover { background: var(--line-strong); color: var(--text); }

/* 分段控件（微信风：灰底滑块 + 选中白底） */
.ih-seg { margin: 0 18px 2px; background: var(--bg); border-radius: var(--r-m); padding: 3px; display: flex; gap: 3px; }
.ih-seg-i { flex: 1; text-align: center; padding: 7px 0; border-radius: 6px; font-size: var(--t-aux); color: var(--text-2); cursor: pointer; transition: all .15s ease; }
.ih-seg-i.on { background: var(--card); color: var(--ih-accent); font-weight: 600; box-shadow: 0 1px 3px var(--line); }

/* 内容区 */
.ih-body { padding: 14px 18px 16px; }
.ih-fld-h { display: flex; align-items: center; justify-content: space-between; margin-bottom: 7px; }
.ih-fld-t { font-size: var(--t-aux); font-weight: 600; color: var(--text); }
.ih-chip { font-size: var(--t-weak); color: var(--ih-accent); background: var(--brand-soft); padding: 2px 8px; border-radius: 999px; }
.ih-fld-r { display: flex; align-items: center; gap: 9px; }
.ih-link { background: none; border: none; padding: 0; font-size: var(--t-weak); color: var(--link); cursor: pointer; font-family: inherit; }
.ih-link:hover { text-decoration: underline; }
.ih-link:disabled { opacity: .5; cursor: default; }
.ih-ta { width: 100%; box-sizing: border-box; background: var(--card-2); border: 1px solid transparent; border-radius: var(--r-m); padding: 11px 12px; font-size: var(--t-aux); line-height: 1.75; color: var(--text); resize: vertical; min-height: 152px; font-family: inherit; }
.ih-ta:focus { outline: none; border-color: var(--ih-accent); background: var(--card); }

/* 主按钮：两侧留边、圆角 8px，费用写进按钮 */
.ih-go { display: block; width: 100%; margin-top: 14px; background: var(--ih-accent); color: #fff; border: none; border-radius: var(--r-m); padding: 11px 0; font-size: var(--t-body); font-weight: 600; cursor: pointer; font-family: inherit; }
.ih-go:hover { background: var(--ih-accent-press); }
.ih-go:disabled { opacity: .6; cursor: default; }
.ih-note { font-size: var(--t-weak); color: var(--text-2); text-align: center; margin-top: 9px; line-height: 1.6; }

/* 加载 / 空态 */
.ih-loading { padding: 34px 10px; text-align: center; font-size: var(--t-aux); color: var(--text-2); }
.ih-empty { padding: 26px 10px 22px; text-align: center; }
.ih-empty-ic { font-size: 30px; opacity: .45; }
.ih-empty-t { font-size: var(--t-body); color: var(--text); margin-top: 8px; }
.ih-empty-d { font-size: var(--t-weak); color: var(--text-2); margin-top: 4px; line-height: 1.6; }

/* 图库三级分组 */
.ih-grp { margin-bottom: 14px; }
.ih-grp-t { font-size: var(--t-weak); font-weight: 600; color: var(--text-2); margin-bottom: 8px; letter-spacing: .3px; }
.ih-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); gap: 9px; }
.ih-item { position: relative; border-radius: var(--r-m); overflow: hidden; cursor: pointer; border: 2px solid transparent; background: var(--card-2); }
.ih-item img { width: 100%; aspect-ratio: 1/1; object-fit: cover; display: block; }
.ih-item:hover { border-color: var(--ih-accent); }
.ih-item.picking { opacity: .55; pointer-events: none; }
.ih-item-m { position: absolute; left: 0; right: 0; bottom: 0; padding: 14px 6px 4px; font-size: var(--t-weak); color: #fff; background: linear-gradient(transparent, rgba(0,0,0,.66)); display: flex; justify-content: space-between; gap: 4px; }
.ih-item-m span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* 版本历史抽屉（同款头部与按钮） */
.ih-hist { --ih-accent: var(--brand); --ih-accent-press: var(--brand-press); width: 720px; max-width: 94vw; padding: 0; overflow: hidden; border-radius: var(--r-l); }
.ih-hist-body { padding: 14px 18px 16px; display: grid; grid-template-columns: 1fr 200px; gap: 14px; }
.ih-hist-main { background: var(--bg); border-radius: var(--r-m); min-height: 280px; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.ih-hist-main img { max-width: 100%; max-height: 46vh; object-fit: contain; display: block; }
.ih-hist-side { max-height: 46vh; overflow-y: auto; display: flex; flex-direction: column; gap: 6px; }
.ih-ver { display: flex; gap: 8px; align-items: center; padding: 6px; border-radius: var(--r-m); cursor: pointer; border: 1px solid transparent; }
.ih-ver:hover { background: var(--bg); }
.ih-ver.on { border-color: var(--ih-accent); background: var(--brand-soft); }
.ih-ver img { width: 46px; height: 46px; border-radius: 7px; object-fit: cover; flex: none; }
.ih-ver-m { min-width: 0; }
.ih-ver-t { font-size: var(--t-aux); font-weight: 600; color: var(--text); }
.ih-ver-d { font-size: var(--t-weak); color: var(--text-2); margin-top: 2px; }
.ih-hist-foot { grid-column: 1 / -1; display: flex; align-items: center; gap: 12px; border-top: 1px solid var(--line); padding-top: 12px; }
.ih-hist-info { flex: 1; font-size: var(--t-aux); color: var(--text-2); line-height: 1.6; }
.ih-hist-foot .ih-go { width: auto; flex: none; margin-top: 0; padding: 9px 22px; }

/* 入口旁「历史 N」角标 */
.ih-badge { display: inline-flex; align-items: center; gap: 3px; margin-left: 6px; font-size: var(--t-weak); line-height: 1; padding: 3px 7px; border-radius: 999px; background: var(--brand-soft); color: var(--brand); cursor: pointer; border: 1px solid var(--line-strong); white-space: nowrap; }
.ih-badge:hover { background: var(--brand); color: #fff; }
.p-re-main .ih-badge, .prod-re .ih-badge { margin-left: 4px; }
/* 商品表操作列：角标作为 .prod-ops 第四个 flex 子项一排排列，防压缩防换行（V2.30.1 堆叠修复） */
.prod-ops .ih-badge { flex: none; align-self: center; margin-left: 4px; }

/* 促销六形式商品图换图入口 V3（V2.28.4 渲染稿 fix3b 李叔拍板）：
   海报内零按钮——V2.28.3 双层按钮随海报 0.37 缩放只剩 16px「看都看不到」；
   改 body 层悬浮操作条（fixed、屏幕尺寸恒定 36px）+ 图描边；.p6-img 为无样式定位标记。 */
.p6-opsbar { position: fixed; z-index: 950; display: none; align-items: center; gap: 4px; background: var(--card); border-radius: 999px; padding: 4px; box-shadow: 0 6px 24px rgba(0,0,0,.18), 0 0 0 1px rgba(0,0,0,.06); transform: translateX(-50%); }
.p6-opsbar.show { display: flex; animation: p6opsin .16s ease; }
@keyframes p6opsin { from { opacity: 0; transform: translateX(-50%) translateY(4px); } to { opacity: 1; transform: translateX(-50%) translateY(0); } }
.p6-opsbar button { display: flex; align-items: center; gap: 6px; height: 36px; padding: 0 14px; border: none; background: transparent; border-radius: 999px; font-size: 13.5px; font-weight: 600; color: var(--text); cursor: pointer; white-space: nowrap; transition: background .12s; font-family: inherit; }
.p6-opsbar button:hover { background: var(--card-2); }
.p6-opsbar button.p6-ops-regen { color: var(--brand); }
.p6-opsbar button.p6-ops-regen:hover { background: var(--brand-soft); }
.p6-opsbar button i { font-style: normal; font-size: 15px; line-height: 1; }
.p6-ops-sep { width: 1px; height: 18px; background: var(--line); }
.p6-opsbar::after { content: ''; position: absolute; left: 50%; bottom: -5px; transform: translateX(-50%); width: 10px; height: 10px; background: var(--card); box-shadow: 2px 2px 4px rgba(0,0,0,.06); rotate: 45deg; border-radius: 2px; }
.p6-opsbar.flip::after { bottom: auto; top: -5px; box-shadow: -2px -2px 4px rgba(0,0,0,.05); }
.p6-opsring { position: fixed; z-index: 949; display: none; border: 2px solid var(--brand); border-radius: 10px; pointer-events: none; box-shadow: 0 0 0 3px var(--brand-soft); }
.p6-opsring.show { display: block; }
/* 生成中动效（后台任务挂起时叠在商品图上）：微光扫过 + 进度环 + 百分比 */
.p6-genov { position: absolute; inset: 0; z-index: 6; overflow: hidden; background: rgba(255,255,255,.22); }
.p6-genov::after { content: ''; position: absolute; inset: 0; background: linear-gradient(100deg, transparent 30%, rgba(255,255,255,.55) 50%, transparent 70%); background-size: 220% 100%; animation: p6shine 1.6s linear infinite; }
@keyframes p6shine { from { background-position: 130% 0; } to { background-position: -90% 0; } }
.p6-gen-ring { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 58px; height: 58px; border-radius: 50%; background: conic-gradient(var(--brand) 0 30%, rgba(255,255,255,.55) 30% 100%); display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 14px rgba(0,0,0,.22); }
/* 内圈尺寸由 JS 内联 --inner 驱动（V2.29.3：环直径按图盒短边×0.62 自适应，不再用固定档位） */
.p6-gen-ring::before { content: ''; position: absolute; width: var(--inner, 46px); height: var(--inner, 46px); border-radius: 50%; background: rgba(30,20,12,.45); }
.p6-gen-ring b { position: relative; color: #fff; font-size: 13px; font-variant-numeric: tabular-nums; }
/* 主视觉生成中大环（吸收 fix4 动效）：promo6 图带在 scale 坐标系内，
   海报坐标 200px 环 ≈ 屏幕 74px，文案 40px ≈ 屏幕 15px——观感不随缩放缩水 */
.p6-gen-ring.p6-xl { width: 200px; height: 200px; }
.p6-gen-ring.p6-xl::before { width: 156px; height: 156px; }
.p6-gen-ring.p6-xl b { font-size: 52px; }
.p6-gen-txt { position: absolute; left: 0; right: 0; bottom: 10%; text-align: center; font-size: 12.5px; color: #fff; text-shadow: 0 1px 4px rgba(0,0,0,.5); }
.p6-gen-txt.p6-xl { font-size: 40px; bottom: 8%; text-shadow: 0 3px 10px rgba(0,0,0,.55); letter-spacing: 2px; }

/* 底部生成任务条 + 任务面板（图片生成后台化 V2.28.3）：弹窗点完即收，任务条全程播报 */
.iq-bar { position: fixed; left: 50%; bottom: 18px; transform: translateX(-50%); z-index: 900; background: rgba(38,34,28,.92); color: #fff; border-radius: 999px; display: flex; align-items: center; gap: 12px; padding: 10px 12px 10px 18px; box-shadow: 0 12px 32px rgba(0,0,0,.30); white-space: nowrap; font-size: 13.5px; cursor: pointer; user-select: none; }
.iq-bar .iq-spin { display: inline-block; animation: iqrot 1.1s linear infinite; font-style: normal; }
@keyframes iqrot { to { transform: rotate(360deg); } }
.iq-bar .iq-cnt { font-weight: 800; }
.iq-bar .iq-names { color: rgba(255,255,255,.72); max-width: 200px; overflow: hidden; text-overflow: ellipsis; }
.iq-bar .iq-prog { font-variant-numeric: tabular-nums; color: #7CE7A8; font-weight: 700; }
.iq-bar .iq-up { background: rgba(255,255,255,.14); border-radius: 999px; padding: 6px 14px; font-size: 12.5px; }
.iq-pop { position: fixed; right: 22px; bottom: 74px; z-index: 901; width: 330px; max-width: calc(100vw - 32px); background: var(--card, #fff); border-radius: 18px; box-shadow: 0 18px 48px rgba(0,0,0,.22); border: 1px solid var(--line, #EAE4D8); overflow: hidden; }
.iq-pop .iq-hd { padding: 14px 18px; font-size: 14px; font-weight: 800; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--line); background: var(--card-2); }
.iq-pop .iq-hd span { font-size: 12px; color: var(--brand-press); font-weight: 700; }
.iq-pop .iq-x { cursor: pointer; color: var(--text-2); font-size: 15px; padding: 2px 6px; }
.iq-trow { display: flex; align-items: center; gap: 12px; padding: 13px 18px; border-bottom: 1px solid var(--line); }
.iq-trow:last-child { border-bottom: 0; }
.iq-trow .iq-ic { width: 34px; height: 34px; border-radius: 10px; flex: none; display: flex; align-items: center; justify-content: center; font-style: normal; font-size: 16px; background: var(--card-2); color: var(--text-2); }
.iq-trow.run .iq-ic { color: var(--brand-press); }
.iq-trow.done .iq-ic { background: #EAF7EE; color: var(--brand-press); }
.iq-trow.err .iq-ic { background: #FDF1EF; color: var(--danger); }
.iq-trow .iq-tt { font-size: 13.5px; font-weight: 700; color: var(--text); }
.iq-trow .iq-ts { font-size: 11.5px; color: var(--text-3, #9A938A); margin-top: 3px; }
.iq-trow .iq-bar2 { height: 5px; border-radius: 99px; background: var(--line); margin-top: 7px; overflow: hidden; }
.iq-trow .iq-bar2 i { display: block; height: 100%; background: var(--brand); border-radius: 99px; transition: width .6s ease; }
.iq-trow .iq-x { margin-left: auto; color: var(--text-3); font-size: 12px; flex: none; cursor: pointer; }
.iq-trow .iq-x:hover { color: var(--danger); }

/* 生成任务迷你胶囊（V2.46.2 修 D3/D4）：全部终态后看板立即折叠——
   结果摘要+时间常驻右下角，▴ 展开看历史 / ✕ 彻底关闭；新任务入队自动让位整板 */
.iq-mini { position: fixed; right: 22px; bottom: 18px; z-index: 901; display: flex; align-items: center; gap: 8px; background: var(--card, #fff); border: 1px solid var(--line, #EAE4D8); border-radius: 999px; padding: 8px 10px 8px 14px; box-shadow: 0 8px 24px rgba(0,0,0,.16); font-size: 12.5px; color: var(--text-2); user-select: none; }
.iq-mini .iq-mini-ck { width: 20px; height: 20px; border-radius: 50%; background: #EAF7EE; color: var(--brand-press); display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 800; flex: none; }
.iq-mini .iq-mini-ck.warn { background: #FFF3D6; color: #8A6D14; }
.iq-mini .iq-mini-tt { font-weight: 700; color: var(--text); max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.iq-mini .iq-mini-tm { color: var(--text-3, #9A938A); font-variant-numeric: tabular-nums; }
.iq-mini .iq-mini-btn { cursor: pointer; color: var(--text-2); padding: 2px 6px; border-radius: 6px; }
.iq-mini .iq-mini-btn:hover { background: var(--card-2); }

/* 生成区完成卡（V2.46.2 genPhase 完成态）：✓ 主文案 + 来源徽标（本次生成/后台任务/断线续跑） */
.gf-done { color: var(--brand-press); font-weight: 700; }
.gf-src { display: inline-block; background: var(--card-2); color: var(--text-2); border-radius: 6px; font-size: 11.5px; padding: 2px 8px; margin-left: 6px; font-weight: 400; }

/* 导出完成行动卡（V2.29.2）：自动下载被浏览器「多文件下载拦截」静默丢弃时的手动保存兜底。
   右下固定、避开底部任务条（bottom:18 的 .iq-bar）；「保存到本地」是用户手势点击不触发拦截 */
.export-done { position: fixed; right: 22px; bottom: 86px; z-index: 950; width: 300px; background: var(--card); border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 16px 44px var(--mask); padding: 16px 18px 14px; }
.export-done .ed-t { font-size: 14.5px; font-weight: 800; color: var(--text); }
.export-done .ed-n { font-size: 12px; color: var(--text-3); margin-top: 5px; word-break: break-all; }
.export-done .ed-ops { display: flex; align-items: center; gap: 10px; margin-top: 12px; }
.export-done .ed-btn { font-size: 13px; font-weight: 700; border-radius: 999px; padding: 7px 16px; border: 1px solid var(--line); background: var(--card-2); color: var(--text-2); cursor: pointer; text-decoration: none; display: inline-block; }
.export-done .ed-btn.ed-primary { background: var(--brand); border-color: var(--brand); color: #fff; }
.export-done .ed-btn.ed-primary:hover { background: var(--brand-press); }
.export-done .ed-x { margin-left: auto; color: var(--text-3); cursor: pointer; font-size: 13px; background: none; border: none; padding: 4px 6px; }
.export-done .ed-x:hover { color: var(--text); }
.export-done .ed-tip { margin-top: 10px; font-size: 12px; color: var(--danger); }
/* 任务面板底部「重跑失败 N 张」（吸收 fix4 动效稿） */
.iq-ft { padding: 10px 12px; border-top: 1px solid var(--line); background: var(--card-2); }
.iq-ft-btn { display: block; text-align: center; font-size: 12.5px; font-weight: 700; padding: 7px 0; border-radius: 8px; background: var(--brand); color: #fff; cursor: pointer; }
.iq-ft-btn:hover { background: var(--brand-press); }

/* ============================================================
   商品图上传五步弹窗（V2.30.0 · gallery.js openProdUpload）
   结构：#layer > .mask#pupMask > .dialog.pup-dialog
   ============================================================ */
.pup-dialog { width: 560px; max-width: 94vw; padding: 0; overflow: hidden; border-radius: var(--r-l); max-height: 92vh; display: flex; flex-direction: column; }
.pup-head { display: flex; align-items: center; padding: 16px var(--pad) 0; }
.pup-t { flex: 1; font-size: var(--t-card); font-weight: 700; }
.pup-x { width: 28px; height: 28px; border-radius: 8px; display: grid; place-items: center; color: var(--text-3); cursor: pointer; font-size: 14px; }
.pup-x:hover { background: var(--card-2); color: var(--text); }
.pup-sub { padding: 4px var(--pad) 12px; font-size: var(--t-aux); color: var(--text-2); border-bottom: 1px solid var(--line); }
.pup-body { padding: 16px var(--pad) 18px; overflow-y: auto; }
/* ① 拖放选图区 */
.pup-drop { border: 2px dashed var(--line-strong); border-radius: var(--r-m); padding: 34px 16px; text-align: center; cursor: pointer; transition: border-color .15s, background .15s; }
.pup-drop:hover, .pup-drop.over { border-color: var(--brand); background: var(--brand-soft); }
.pup-drop-ic { font-size: 34px; }
.pup-drop-t { font-size: var(--t-body); font-weight: 700; margin-top: 8px; }
.pup-drop-d { font-size: var(--t-aux); color: var(--text-3); margin-top: 6px; }
/* ② 识别 / ④ 优化 等待 */
.pup-row { display: flex; gap: 14px; align-items: flex-start; }
.pup-thumb { width: 96px; height: 96px; object-fit: cover; border-radius: var(--r-m); border: 1px solid var(--line); flex: none; background: var(--card-2); }
.pup-vinfo { flex: 1; min-width: 0; }
.pup-loading { display: flex; align-items: center; gap: 8px; font-size: var(--t-body); color: var(--text); font-weight: 600; }
.pup-loading .spin { width: 14px; height: 14px; flex: none; border: 2px solid var(--line-strong); border-top-color: var(--brand); border-radius: 50%; animation: gf-rot .8s linear infinite; }

/* ---------- ④ AI 优化中（V2.33.0 方案B：进度环 + 三阶段点亮）----------
   替掉原「一根转圈 + 一行秒数」——40–65 秒干等分不清在跑还是死了，且看不到优化的哪张图。
   三块：原图卡（扫光表示在处理）/ 进度环（与海报主视觉 iQ 环同款）/ 三阶段（按秒点亮）。
   全走令牌：明/暗双主题自动继承，无硬编码色值——色条与描边一律 var(--brand)/var(--line-*)。 */
.pup-opt { display: flex; flex-direction: column; align-items: center; }
.pup-opt-goods { position: relative; width: 260px; height: 150px; border: 1px solid var(--line); border-radius: var(--r-l); overflow: hidden; background: var(--card-2); }
.pup-opt-goods img { width: 100%; height: 100%; object-fit: contain; display: block; }
/* 扫光：与 .p6-band 主视觉生成微光同源语汇（不同实现：扫光不遮商品本体） */
.pup-opt-goods::after { content: ''; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(105deg, transparent 38%, rgba(255, 255, 255, 0.5) 50%, transparent 62%);
  background-size: 250% 100%; animation: pup-shim 2.2s linear infinite; }
@media (prefers-reduced-motion: reduce) { .pup-opt-goods::after { animation: none; } }
.pup-opt-tag { position: absolute; left: 10px; top: 10px; z-index: 2; font-size: var(--t-weak); color: #fff;
  background: rgba(0, 0, 0, 0.45); border-radius: 4px; padding: 2px 8px; }
.pup-opt-row { display: flex; align-items: center; gap: 26px; margin-top: 18px; flex-wrap: wrap; justify-content: center; }
.pup-opt-ring { position: relative; width: 148px; height: 148px; flex: none; }
.pup-opt-ring svg { transform: rotate(-90deg); }
.pup-opt-num { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.pup-opt-num b { font-size: 30px; font-weight: 700; color: var(--text); font-variant-numeric: tabular-nums; line-height: 1.1; }
.pup-opt-num b small { font-size: var(--t-aux); font-weight: 400; color: var(--text-3); margin-left: 2px; }
.pup-opt-num span { font-size: var(--t-weak); color: var(--text-3); margin-top: 2px; }
.pup-opt-side { min-width: 232px; }
.pup-opt-title { font-size: var(--t-card); font-weight: 700; color: var(--text); }
.pup-opt-title small { font-weight: 400; font-size: var(--t-aux); color: var(--text-3); margin-left: 6px; }
.pup-opt-steps { margin-top: 12px; }
.pup-opt-step { position: relative; display: flex; align-items: center; gap: 10px; padding: 7px 0; font-size: var(--t-body); color: var(--text-3); transition: color .3s; }
.pup-opt-step::before { content: ''; position: absolute; left: 10px; top: -8px; height: 16px; border-left: 2px dashed var(--line); transition: border-color .3s; }
.pup-opt-step:first-child::before { display: none; }
.pup-opt-dot { position: relative; z-index: 1; flex: none; width: 22px; height: 22px; border-radius: 50%; border: 2px solid var(--line); background: var(--card); font-style: normal; font-size: var(--t-weak); font-weight: 700; color: var(--text-3); display: flex; align-items: center; justify-content: center; transition: all .3s; }
.pup-opt-step.doing { color: var(--text); font-weight: 600; }
.pup-opt-step.doing .pup-opt-dot { border-color: var(--brand); color: var(--brand); box-shadow: 0 0 0 4px var(--brand-soft); }
.pup-opt-step.done { color: var(--text-2); }
.pup-opt-step.done .pup-opt-dot { background: var(--brand); border-color: var(--brand); color: #fff; }
.pup-opt-step.done::before { border-left-color: var(--brand); }
.pup-opt-note { font-size: var(--t-aux); color: var(--text-3); margin-top: 14px; line-height: 1.6; }
.pup-opt-ops { margin-top: 16px; display: flex; flex-direction: column; align-items: center; gap: 6px; }
.pup-opt-ops .btn { min-width: 210px; }
.pup-opt-tip { font-size: var(--t-weak); color: var(--text-3); }
@keyframes pup-shim { from { background-position: 120% 0; } to { background-position: -120% 0; } }
/* 入库中提示里的 spin（.pup-note 容器内），与 loading 同款小圈（V2.30.2 补：此前只在 .pup-loading 内有样式，pupMsg 里的是死圈） */
.pup-note .spin { display: inline-block; width: 12px; height: 12px; border: 2px solid var(--line-strong); border-top-color: var(--brand); border-radius: 50%; animation: gf-rot .8s linear infinite; vertical-align: -2px; }
.pup-note { font-size: var(--t-aux); color: var(--text-3); margin-top: 10px; line-height: 1.6; }
.pup-evi { font-size: var(--t-aux); color: var(--text-2); background: var(--card-2); border-radius: 8px; padding: 8px 10px; }
.pup-warn { font-size: var(--t-aux); color: var(--danger); background: var(--danger-soft); border-radius: 8px; padding: 8px 10px; margin-top: 8px; line-height: 1.5; }
/* ---- V2.34.0 入库名字二次确认（方案C）：确认页黄条 + 末尾入库确认层 ---- */
.pup-cfwarn { font-size: var(--t-aux); color: var(--warn); background: var(--warn-soft); border-radius: 8px; padding: 8px 10px; margin-top: 10px; line-height: 1.55; }
.pup-cfwarn b { color: var(--warn); }
.pup-cfops { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.pup-mini { font-size: var(--t-weak); padding: 4px 10px; border-radius: 999px; border: 1px dashed var(--brand); color: var(--brand); background: var(--card); cursor: pointer; }
.pup-mini:hover { background: var(--brand-soft); }
.pup-mini.ghost { border-style: solid; border-color: var(--line-strong); color: var(--text-2); }
.pup-mini.ghost:hover { color: var(--text); background: var(--card-2); }
/* z-index 必须 > .mask 的 150（pup 弹窗遮罩）——首版 60 被整个压在弹窗下面：
   DOM 断言全绿（被盖住的元素照样响应事件），用户却一个像素都看不见（Edge 实测抓的） */
.pup-cfmask { position: fixed; inset: 0; z-index: 160; background: rgba(0, 0, 0, .45); display: flex; align-items: center; justify-content: center; padding: 20px; animation: pup-cffade .18s; }
@keyframes pup-cffade { from { opacity: 0; } }
.pup-cf { width: 460px; max-width: 100%; max-height: 88vh; overflow-y: auto; background: var(--card); border-radius: var(--r-l); padding: 18px var(--pad) 16px; box-shadow: 0 12px 40px rgba(0, 0, 0, .22); animation: pup-cfup .22s; }
@keyframes pup-cfup { from { transform: translateY(18px); opacity: .4; } }
.pup-cf-h { font-size: var(--t-card); font-weight: 700; color: var(--text); }
.pup-cf-s { font-size: var(--t-weak); color: var(--text-3); margin-top: 4px; }
.pup-cf-row { display: flex; gap: 14px; align-items: flex-start; margin-top: 14px; }
.pup-cf-img { width: 88px; height: 88px; object-fit: cover; border-radius: var(--r-m); border: 1px solid var(--line); background: var(--card-2); flex: none; }
.pup-cf-main { flex: 1; min-width: 0; }
.pup-cf-lab { font-size: var(--t-aux); color: var(--text-2); margin-bottom: 6px; }
.pup-cf-lab b { color: var(--text); }
.pup-cf-ref { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: var(--t-weak); color: var(--text-3); margin-top: 8px; }
.pup-cf-ref b { color: var(--text-2); font-weight: 600; }
.pup-cf .btn { width: 100%; margin-top: 8px; }
.input.bad { border-color: var(--danger); }
@media (prefers-reduced-motion: reduce) {
  .pup-cfmask, .pup-cf { animation: none; }
}
/* ③ 确认：建议名 chips + 并入提示 + 档位卡 */
.pup-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0 10px; }
.pup-chip { font-size: var(--t-aux); padding: 6px 12px; border-radius: 999px; border: 1px solid var(--line-strong); color: var(--text-2); cursor: pointer; }
.pup-chip:hover { border-color: var(--brand); color: var(--brand); }
.pup-chip.on { background: var(--brand); border-color: var(--brand); color: #fff; font-weight: 700; }
.pup-merge { font-size: var(--t-aux); color: var(--brand); background: var(--brand-soft); border-radius: 8px; padding: 7px 10px; margin-bottom: 10px; }
.pup-tiers { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 14px; }
.pup-tier { border: 1.5px solid var(--line); border-radius: var(--r-m); padding: 10px 12px; cursor: pointer; transition: border-color .15s, background .15s; }
.pup-tier:hover { border-color: var(--brand); }
.pup-tier.on { border-color: var(--brand); background: var(--brand-soft); }
.pup-tier-t { font-size: var(--t-aux); font-weight: 700; display: flex; align-items: center; gap: 6px; }
.pup-rec { font-size: 10px; background: var(--brand); color: #fff; border-radius: 4px; padding: 1px 5px; font-weight: 700; }
.pup-tier-c { font-size: var(--t-card); font-weight: 800; color: var(--brand); margin-top: 4px; font-variant-numeric: tabular-nums; }
.pup-tier-d { font-size: 11px; color: var(--text-3); margin-top: 4px; line-height: 1.5; }
.pup-go { display: block; width: 100%; margin-top: 16px; background: var(--brand); color: #fff; border: none; border-radius: var(--r-m); padding: 12px 0; font-size: var(--t-body); font-weight: 700; cursor: pointer; font-family: inherit; }
.pup-go:hover { background: var(--brand-press); }
.pup-go:disabled { opacity: .6; cursor: default; }
.pup-ops2 { display: flex; gap: 10px; justify-content: center; margin-top: 10px; }
/* ⑤ 原图 vs 优化版 对比 */
.pup-vs { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.pup-vs-i img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: var(--r-m); border: 1px solid var(--line); background: var(--card-2); display: block; }
.pup-vs-t { text-align: center; font-size: var(--t-aux); color: var(--text-2); margin-top: 6px; font-weight: 600; }
/* 商品表行内上传按钮（与 .prod-re 同规格） */
.prod-up { color: var(--text-3); width: 26px; height: 26px; border-radius: 6px; display: inline-grid; place-items: center; }
.prod-up:hover { color: var(--brand); background: var(--brand-soft); }

/* ============================================================
   商品图库 · 改名（V2.35.0 李叔 09-29 派单②，方案 C）
   卡片 ✎ 悬浮钮 + 完整改名层；视觉语言对齐 V2.34.0 入库确认层（.pup-cf*）
   ============================================================ */
/* 卡片 ✎：常态可见（不 hover 也看得见——藏起来等于没有入口，李叔 09-29 定的） */
.gal-re { position: absolute; right: 8px; top: 8px; width: 28px; height: 28px; border-radius: 50%; background: rgba(255, 255, 255, .96); border: 1px solid var(--line-strong); display: grid; place-items: center; font-size: 14px; color: var(--text-2); box-shadow: 0 2px 8px rgba(0, 0, 0, .14); cursor: pointer; z-index: 2; }
.gal-re:hover { color: var(--brand); border-color: var(--brand); background: var(--card); }
.gal-re:active { transform: scale(.92); }
/* 别名角标：改名时留了旧名 → 旧名照样命中 */
.m-alias { font-size: var(--t-weak); color: var(--text-2); background: var(--card-2); border: 1px dashed var(--line-strong); border-radius: var(--r-s); padding: 0 4px; }
/* z-index 160 硬约束：必须 > .mask 的 150，否则被弹窗遮罩压住（V2.34.0 实测坑：断言绿≠眼睛绿） */
.gal-ren-mask { position: fixed; inset: 0; z-index: 160; background: rgba(0, 0, 0, .45); display: flex; align-items: center; justify-content: center; padding: 20px; animation: gal-ren-fade .18s; }
@keyframes gal-ren-fade { from { opacity: 0; } }
.gal-ren { width: 460px; max-width: 100%; max-height: 88vh; overflow-y: auto; background: var(--card); border-radius: var(--r-l); padding: 18px var(--pad) 16px; box-shadow: 0 12px 40px rgba(0, 0, 0, .22); animation: gal-ren-up .22s; }
@keyframes gal-ren-up { from { transform: translateY(18px); opacity: .4; } }
.gal-ren-h { font-size: var(--t-card); font-weight: 700; color: var(--text); }
.gal-ren-s { font-size: var(--t-weak); color: var(--text-3); margin-top: 4px; }
.gal-ren-row { display: flex; gap: 14px; align-items: flex-start; margin-top: 14px; }
.gal-ren-img { width: 76px; height: 76px; object-fit: cover; border-radius: var(--r-m); border: 1px solid var(--line); background: var(--card-2); flex: none; }
.gal-ren-main { flex: 1; min-width: 0; }
.gal-ren-lab { font-size: var(--t-aux); color: var(--text-2); margin-bottom: 6px; }
.gal-ren-lab b { color: var(--text); }
/* 提示条：琥珀=后果/撞名（--warn），红=空名拦截（--danger）——两种警示不许混色 */
.gal-ren-alert { display: none; font-size: var(--t-aux); color: var(--warn); background: var(--warn-soft); border-radius: var(--r-m); padding: 8px 10px; margin-top: 10px; line-height: 1.55; }
.gal-ren-alert.show { display: block; }
.gal-ren-alert.bad { color: var(--danger); background: var(--danger-soft); }
.gal-ren-alert b { color: inherit; }
.gal-ren-chk { display: flex; align-items: center; gap: 8px; font-size: var(--t-aux); color: var(--text-2); margin-top: 12px; cursor: pointer; }
.gal-ren-chk input { width: 16px; height: 16px; accent-color: var(--brand); }
.gal-ren-note { font-size: var(--t-weak); color: var(--text-3); margin-top: 8px; line-height: 1.55; }
.gal-ren-ops { display: flex; gap: 10px; margin-top: 14px; }
.gal-ren-ops .btn { flex: 1; margin: 0; }
@media (prefers-reduced-motion: reduce) {
  .gal-ren-mask, .gal-ren { animation: none; }
}

/* ================= 产出下载 · 二次确认（V2.36.0 李叔 09-30 派单③） =================
   下载前确认「这张海报以哪家店名义落款」：店长锁定自己门店、超管可任选。
   ★ z-index 170：必须 > 改名层 160 > 遮罩 150（V2.34.0 教训：断言绿 ≠ 眼睛绿） */
.dl-foot-mask {
  position: fixed; inset: 0; z-index: 170; background: rgba(0, 0, 0, .45);
  display: flex; align-items: center; justify-content: center; padding: 20px;
  animation: gal-ren-fade .18s;
}
.dl-foot {
  background: var(--card); border-radius: 14px; width: 560px; max-width: 100%;
  max-height: 88vh; overflow: auto; box-shadow: 0 8px 24px rgba(0, 0, 0, .14);
  animation: gal-ren-pop .2s cubic-bezier(.16, 1, .3, 1);
}
.dl-h { padding: 16px 18px 10px; position: relative; }
.dl-h .dl-t { font-size: 16px; font-weight: 700; }
.dl-h .dl-s { font-size: var(--t-weak); color: var(--text-2); margin-top: 3px; }
.dl-x {
  position: absolute; top: 12px; right: 14px; width: 30px; height: 30px; border: 0; border-radius: 50%;
  background: var(--hover); color: var(--text-2); font-size: 14px; line-height: 1;
  display: grid; place-items: center; cursor: pointer; transition: background .15s, color .15s;
}
.dl-x:hover { background: var(--line); color: var(--text); }
.dl-b { padding: 0 18px 8px; }
.dl-file { display: flex; gap: 12px; align-items: center; background: var(--hover); border-radius: var(--r-m); padding: 12px; }
.dl-thumb { width: 54px; height: 118px; object-fit: cover; border-radius: 6px; flex: none; background: var(--line); }
.dl-finfo { display: flex; flex-direction: column; gap: 2px; font-size: var(--t-weak); color: var(--text-2); min-width: 0; }
.dl-finfo b { font-size: 13.5px; color: var(--text); font-weight: 600; word-break: break-all; }
.dl-finfo b.hl { color: var(--brand); }
.dl-finfo b.mut { color: var(--text-3); font-weight: 400; }
.dl-lbl { font-size: var(--t-weak); color: var(--text-2); margin: 12px 0 6px; }
.dl-list { border: 1px solid var(--line); border-radius: var(--r-m); overflow: hidden; max-height: 200px; overflow-y: auto; }
.dl-opt { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-bottom: 1px solid var(--line-soft); cursor: pointer; font-size: 13.5px; }
.dl-opt:last-child { border-bottom: 0; }
.dl-opt:hover { background: var(--hover); }
.dl-opt .dl-ck { width: 18px; flex: none; color: var(--text-3); text-align: center; }
.dl-opt .dl-nm { font-weight: 600; white-space: nowrap; }
.dl-opt .dl-me { font-style: normal; background: var(--brand); color: #fff; font-size: 10.5px; border-radius: 4px; padding: 0 5px; margin-left: 6px; line-height: 17px; }
.dl-opt .dl-ad { margin-left: auto; color: var(--text-2); font-size: var(--t-aux); text-align: right; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 46%; }
.dl-opt.on { background: var(--brand-soft); }
.dl-opt.on .dl-ck { color: var(--brand); font-weight: 700; }
.dl-opt.on .dl-nm { color: var(--brand); }
.dl-diff { border: 1px solid var(--line); border-radius: var(--r-m); padding: 12px 14px; margin-top: 12px; }
.dl-cap { font-size: var(--t-aux); color: var(--text-3); letter-spacing: 1px; margin-bottom: 8px; }
.dl-fl { display: flex; justify-content: space-between; align-items: center; background: var(--card); border: 1px solid var(--line-soft); border-radius: 6px; padding: 9px 12px; font-size: 11px; color: var(--text-3); }
.dl-fl b { color: var(--text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 58%; }
.dl-fl b .mut { color: var(--text-3); font-weight: 400; }
.dl-fl.new { outline: 2px solid var(--danger); outline-offset: 2px; }
.dl-fl.new b { color: var(--brand); font-weight: 700; }
.dl-arrow { text-align: center; color: var(--text-3); font-size: var(--t-aux); padding: 6px 0; }
.dl-tip { font-size: var(--t-weak); color: var(--text-2); background: var(--hover); border-radius: var(--r-m); padding: 8px 12px; line-height: 1.7; margin: 12px 0 4px; }
.dl-tip b { color: #8A5A1E; }
.dl-f { padding: 12px 18px 16px; display: flex; gap: 10px; }
.dl-f .btn { flex: 1; min-height: 42px; }
@media (prefers-reduced-motion: reduce) {
  .dl-foot-mask, .dl-foot { animation: none; }
}

/* ============================================================
   风格参考库（V2.47.0 李叔「风格示例图」派单）—— 独立页面 #/styleref
   纪律：卡片高度统一（grid 固定图区 132px，缺图走占位不塌）、标签单行截断、
        缺图/失效一律显示占位并打角标，绝不装作有图。
   ============================================================ */
.sr-page { padding: 4px 0 8px; }
.sr-head { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
.sr-h1 { font-size: var(--t-page); font-weight: 700; color: var(--text); }
.sr-stat { font-size: 13px; color: var(--text-2); }
.sr-err { color: var(--danger); cursor: help; }
.sr-bar { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-bottom: 12px; }
.sr-bar .sr-q { flex: 1 1 220px; min-width: 180px; }
.sr-bar .sr-sel { flex: 0 0 auto; width: auto; min-width: 108px; }
.sr-view.on { border-color: var(--brand); color: var(--brand); background: var(--brand-soft); }
.sr-fallback { background: var(--warn-soft); border-left: 3px solid var(--warn); padding: 8px 12px; font-size: 13px; color: var(--text-2); border-radius: 6px; margin-bottom: 12px; }

/* 网格：图区固定高度，卡高一致；缺图卡显示占位文字不塌陷 */
.sr-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(168px, 1fr)); gap: 12px; }
.sr-card { background: var(--card); border: 1px solid var(--line); border-radius: 10px; overflow: hidden; cursor: pointer; transition: border-color .15s, transform .15s; }
.sr-card:hover { border-color: var(--brand); transform: translateY(-1px); }
.sr-card .sr-ph { position: relative; height: 132px; background: var(--card-2); overflow: hidden; }
.sr-card .sr-ph img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
/* 占位（缺图 / 图片加载失败）：白字压暗底，与 V2.46.8 的 no-preview 同款手法 */
.sr-card .sr-ph-ph { position: absolute; inset: 0; display: none; align-items: center; justify-content: center; text-align: center; padding: 10px; font-size: 13px; color: #fff; background: rgba(0, 0, 0, .42); }
.sr-card.missing .sr-ph-ph, .sr-ph.broken .sr-ph-ph { display: flex; }
.sr-card.missing .sr-ph { background: linear-gradient(135deg, var(--card-2), var(--line-strong)); }
.sr-ph-ph.sm { font-size: 11px; }
.sr-meta { padding: 8px 10px 10px; }
.sr-card .sr-t { font-size: 14px; font-weight: 600; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sr-row { display: flex; gap: 4px; flex-wrap: nowrap; overflow: hidden; margin-top: 4px; min-height: 20px; }
.sr-tag, .sr-scene { font-size: 11px; color: var(--text-2); background: var(--card-2); border: 1px solid var(--line); border-radius: 4px; padding: 1px 6px; white-space: nowrap; flex: 0 0 auto; }
.sr-scene { color: var(--brand); border-color: var(--brand); background: var(--brand-soft); }
.sr-badge { position: absolute; top: 6px; right: 6px; font-size: 11px; padding: 2px 7px; border-radius: 20px; color: #fff; }
.sr-badge.pend { background: var(--warn); }
.sr-badge.stale { background: var(--danger); }
.sr-badge.retire { background: var(--text-3); }

/* 列表：缩略图 44px 方，三栏 */
.sr-list { display: flex; flex-direction: column; gap: 8px; }
.sr-row-item { display: flex; align-items: center; gap: 12px; background: var(--card); border: 1px solid var(--line); border-radius: 10px; padding: 8px 12px; cursor: pointer; }
.sr-row-item:hover { border-color: var(--brand); }
.sr-thumb { position: relative; flex: 0 0 56px; height: 44px; border-radius: 6px; overflow: hidden; background: var(--card-2); }
.sr-thumb img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.sr-thumb .sr-ph-ph { display: none; }
.sr-row-item.missing .sr-thumb { background: linear-gradient(135deg, var(--card-2), var(--line-strong)); }
.sr-row-item.missing .sr-thumb .sr-ph-ph { display: flex; }
.sr-ri-main { flex: 1; min-width: 0; }
.sr-ri-main .sr-t { font-size: 14px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sr-sub { font-size: 12px; color: var(--text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sr-ri-r { flex: 0 0 auto; display: flex; align-items: center; gap: 8px; }
.sr-src { font-size: 12px; color: var(--text-3); }

/* 灯箱：大图 + 元信息 + 来源 + 版权 */
.sr-dialog { max-width: 760px; }
.sr-big { background: var(--card-2); border-radius: 8px; overflow: hidden; min-height: 200px; display: flex; align-items: center; justify-content: center; }
.sr-big img { max-width: 100%; max-height: 46vh; display: block; object-fit: contain; }
.sr-big-ph { padding: 40px 20px; text-align: center; color: var(--text-2); font-size: 14px; }
.sr-ph-note { font-size: 12px; color: var(--text-3); margin-top: 6px; }
.sr-info { margin-top: 12px; }
.sr-kv { display: flex; gap: 10px; font-size: 13px; padding: 3px 0; }
.sr-kv b { flex: 0 0 62px; font-weight: 600; color: var(--text-2); }
.sr-kv span { flex: 1; color: var(--text); word-break: break-all; }
.sr-note { font-size: 12px; color: var(--text-2); margin-top: 6px; }
.sr-warn { margin-top: 10px; font-size: 12px; color: var(--gold); background: var(--card-2); border: 1px dashed var(--gold); border-radius: 6px; padding: 6px 10px; }
.sr-kid { font-size: 12px; color: var(--text-3); font-weight: 400; }
.sr-nosrc { font-size: 12px; color: var(--danger); margin-right: auto; }
.sr-empty { padding: 48px 20px; text-align: center; color: var(--text-2); font-size: 14px; }
.sr-empty-s { font-size: 12px; color: var(--text-3); margin-top: 8px; line-height: 1.7; }
.sr-loading { padding: 40px; text-align: center; color: var(--text-2); }
.sr-foot { margin-top: 16px; font-size: 12px; color: var(--text-3); line-height: 1.7; border-top: 1px solid var(--line); padding-top: 10px; }

/* ---- V2.47.1 维护闭环：新增/编辑弹层、灯箱操作条、留痕、退役态 ---- */
.sr-editor { max-width: 560px; }
.sr-editor .d-b { max-height: 62vh; overflow-y: auto; text-align: left; }
.sr-editor .field { text-align: left; }
.sr-editor .input { width: 100%; box-sizing: border-box; }
.sr-formerr { display: none; background: var(--danger-soft, rgba(194, 42, 31, .1)); border-left: 3px solid var(--danger); color: var(--danger); font-size: 12px; line-height: 1.7; padding: 8px 10px; border-radius: 6px; white-space: normal; }
/* 灯箱操作条：多个操作横排，右侧放「查看来源/关闭」 */
.sr-opsbar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; border-top: 1px solid var(--line); padding: 10px 12px; background: var(--card); }
.sr-opsbar .btn { flex: none; }
.sr-gap { flex: 1 1 auto; }
.sr-chk { display: inline-flex; align-items: center; gap: 5px; font-size: 13px; color: var(--text-2); cursor: pointer; white-space: nowrap; }
/* 变更留痕：最新在上，最多列 6 条（多了没意义，真要查去看真源） */
.sr-log { margin-top: 10px; border-top: 1px dashed var(--line); padding-top: 8px; }
.sr-log-t { font-size: 12px; color: var(--text-3); margin-bottom: 4px; }
.sr-log-i { font-size: 11px; color: var(--text-2); line-height: 1.8; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* 退役态：整卡降透明度，但绝不隐藏（留痕可查是纪律） */
.sr-card.retired, .sr-row-item.retired { opacity: .62; }
