/* ============================================================
   BrandOS 组件样式 v4 · 微信风
   只消费 tokens.css 变量；不在此处发明颜色。
   结构：顶栏 / 侧导航 / 页面容器 / 卡片 / 单元格列表 /
        按钮 / 表单 / 步骤条 / 页签 / 网格 / 弹层(toast·dialog)
   ============================================================ */

* { 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);
  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;
  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 图，「沃家设计」大字为视觉主角） */
.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);
}

/* ================= 侧导航 ================= */
.nav {
  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);
  padding: 12px 10px;
  overflow-y: auto;
}
.nav-group { margin-bottom: 18px; }
.nav-group-t {
  font-size: var(--t-weak); color: var(--text-3);
  padding: 6px 10px 4px;
}
.nav-item {
  display: flex; align-items: center; gap: 10px;
  width: 100%; text-align: left;
  padding: 9px 10px; margin: 1px 0;
  border-radius: var(--r-m);
  color: var(--text-2); font-size: var(--t-body);
  transition: background .15s, color .15s;
}
.nav-item svg { width: 19px; height: 19px; flex: none; }
.nav-item:hover { background: var(--hover); }
.nav-item.active { background: var(--brand-soft); color: var(--brand); font-weight: 600; }

/* ================= 页面容器 ================= */
.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; }
.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); }
.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; }
.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); }

/* 选项片（比例 / 风格等单选） */
.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;
}
.style-item:hover { border-color: var(--brand); }
.style-item.on { border-color: var(--brand); box-shadow: 0 0 0 1px var(--brand); }
.style-item .sw { height: 54px; display: block; }
.style-item .sn { font-size: 14px; font-weight: 700; color: var(--text); padding: 7px 8px 2px; text-align: center; letter-spacing: .3px; }
.style-item .ss { font-size: var(--t-aux); color: var(--text-2); padding: 1px 8px 8px; text-align: center; line-height: 1.45; }
.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; }

/* 风格分组（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: nowrap; }
.sg-row .style-item { flex: 1 1 0; width: auto; min-width: 0; }
.sg-row .style-item .sw { height: 64px; }
.sg-row .style-item .ss { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* 窄屏兜底：列太窄时允许折行，每张至少约三成宽 */
@media (max-width: 720px) {
  .sg-row { flex-wrap: wrap; }
  .sg-row .style-item { flex: 1 1 30%; }
}
.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-sw { height: 170px; border-radius: 10px; border: 1px solid var(--line); }
.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; }

/* ================= 页签 ================= */
.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: #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); }

/* 知识库 */
.kl-list { display: flex; flex-direction: column; gap: 10px; }
.k-card { border: 1px solid var(--line); border-radius: var(--r-m); background: var(--card-2); padding: 12px 14px; }
.k-card .k-t { font-weight: 600; font-size: var(--t-body); }
.k-card .k-meta { font-size: var(--t-weak); color: var(--text-3); margin: 3px 0 6px; display: flex; gap: 8px; flex-wrap: wrap; }
.k-card .k-b { font-size: var(--t-aux); color: var(--text-2); }
.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; }

/* ================= 响应式 ================= */
@media (max-width: 900px) {
  .nav { display: none; }
  .main { margin-left: 0; padding: calc(var(--topbar-h) + 14px) 12px 72px; }
  /* 顶栏窄屏（A1 定稿策略）：隐藏副标 / AI 状态文字 / 门店名，保核心元素不挤占 */
  .topbar .brand .bs, .health #healthTxt, .ugroup .s { display: none; }
  .mobile-nav {
    position: fixed; z-index: 50; left: 0; right: 0; bottom: 0;
    display: flex; background: var(--topbar);
    border-top: 1px solid var(--line);
    padding-bottom: env(safe-area-inset-bottom);
  }
  .mobile-nav .nav-item { flex: 1; flex-direction: column; gap: 3px; padding: 8px 0 6px; font-size: var(--t-weak); border-radius: 0; }
}
@media (min-width: 901px) { .mobile-nav { display: none; } }

/* ================= 做海报 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); }

.prod-table { width: 100%; border-collapse: collapse; }
.prod-table th { font-size: var(--t-aux); color: var(--text-2); text-align: left; padding: 4px 6px; font-weight: 500; }
.prod-table td { padding: 3px 4px; }
.prod-table .input { padding: 6px 8px; font-size: var(--t-aux); }
.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); }

/* ================= 做海报 v6：促销长图 / 主题参考 / 提示词润色 ================= */
.poster-scroll { border-radius: 10px; }
/* 长图头部 v2：品牌眉行 + 大标题 + 金条利益点 + 日期胶囊 */
.poster.long .p-head {
  background: linear-gradient(135deg,#1E7A46,#2E9159);
  color: #fff; padding: 13px 15px 12px;
  position: relative; overflow: hidden;
}
.poster.long .p-head::after {
  content: ""; position: absolute; right: -32px; top: -34px;
  width: 116px; height: 116px; border-radius: 50%;
  background: rgba(255,255,255,.09);
  box-shadow: -52px 64px 0 -24px rgba(255,255,255,.07);
}
.poster.long .ph-top {
  display: flex; justify-content: space-between; align-items: center;
  font-size: 9.5px; position: relative; z-index: 1;
}
.poster.long .ph-brand { letter-spacing: 1.5px; font-weight: 600; opacity: .95; }
.poster.long .ph-date {
  border: 1px solid rgba(255,255,255,.55); border-radius: 999px;
  padding: 1px 9px; font-size: 9px; opacity: .95;
}
.poster.long .ph-title {
  font-size: 20px; font-weight: 800; letter-spacing: 1px;
  margin-top: 7px; position: relative; z-index: 1;
}
.poster.long .ph-sub {
  font-size: 10.5px; opacity: .95; margin-top: 5px;
  display: flex; align-items: center; gap: 7px;
  position: relative; z-index: 1;
}
.poster.long .ph-sub .bar { width: 15px; height: 2px; background: #C9A227; flex: none; border-radius: 1px; }
.poster.long .p-prods { padding: 10px; display: grid; gap: 8px; background: #fff; }
.poster.long .p-prods.c1 { grid-template-columns: 1fr; }
.poster.long .p-prods.c2 { grid-template-columns: 1fr 1fr; }
.poster.long .p-prods.c3 { grid-template-columns: 1fr 1fr 1fr; }
/* 商品卡 v3（信息层级：视觉 → 名称 → 规格胶囊 → 价格组；1列列表式 / 2列标准 / 3列紧凑） */
.pcard { border: 1px solid #ececec; border-radius: 10px; overflow: hidden; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.05); }
.pcard .pc-img { position: relative; width: 100%; aspect-ratio: 4/3; display: grid; place-items: center; }
.pcard .pc-img img { width: 100%; height: 100%; object-fit: cover; position: absolute; inset: 0; }
.pcard .pc-ph { text-align: center; padding: 0 8px; position: relative; z-index: 1; }
.pcard .pc-ph .n { font-size: 13px; font-weight: 700; }
.pcard .pc-ph .s { font-size: 10px; opacity: .75; margin-top: 2px; }
.pcard .pc-off {
  position: absolute; left: 0; top: 8px; z-index: 2;
  background: #8A6D14; color: #fff;
  font-size: 10px; font-weight: 700;
  padding: 2px 8px 2px 6px; border-radius: 0 6px 6px 0;
  box-shadow: 0 1px 4px rgba(138,109,20,.35);
}
.pcard .pc-img .pc-re {
  position: absolute; right: 5px; top: 5px; z-index: 2;
  width: 22px; height: 22px; border-radius: 6px;
  background: rgba(255,255,255,.92); color: #555;
  display: none; place-items: center; cursor: pointer;
  box-shadow: 0 1px 4px rgba(0,0,0,.15);
}
.pcard:hover .pc-img .pc-re { display: grid; }
/* 商品图：生成中遮罩 + 历史回溯 */
.pcard .pc-loading {
  position: absolute; inset: 0; z-index: 3;
  background: rgba(255,255,255,.72);
  display: grid; place-items: center; align-content: center; gap: 6px;
  font-size: 10px; color: var(--text-2);
}
.pcard .pc-loading .spin {
  width: 18px; height: 18px;
  border: 2px solid rgba(0,0,0,.15); border-top-color: var(--poster-pine);
  border-radius: 50%; animation: gf-rot .8s linear infinite;
}
.pcard .pc-nav {
  position: absolute; left: 0; right: 0; bottom: 5px; z-index: 2;
  display: none; justify-content: center; align-items: center; gap: 8px;
}
.pcard:hover .pc-nav { display: flex; }
.pcard .pc-nav button {
  width: 20px; height: 20px; border-radius: 50%;
  background: rgba(255,255,255,.92); color: #444;
  display: grid; place-items: center; font-size: 12px; line-height: 1;
  box-shadow: 0 1px 4px rgba(0,0,0,.18);
}
.pcard .pc-nav button:disabled { opacity: .35; cursor: default; }
.pcard .pc-nav .idx {
  font-size: 9px; color: #fff; background: rgba(0,0,0,.45);
  border-radius: 999px; padding: 1px 7px;
}
/* —— 信息区：名称(主) → 规格胶囊(辅) → 价格组(最强) —— */
.pcard .pc-info { padding: 8px 10px 10px; }
.pcard .pc-mid { min-width: 0; }
.pcard .pc-name {
  font-size: 12.5px; font-weight: 600; color: #1a1a1a; line-height: 1.35;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.pcard .pc-spec {
  display: inline-block; max-width: 100%;
  font-size: 9.5px; color: #8a8a8a; background: #f5f5f5;
  border-radius: 4px; padding: 1px 6px; margin-top: 4px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.pcard .pc-right { margin-top: 7px; display: flex; align-items: baseline; gap: 5px; flex-wrap: wrap; }
.pcard .now { color: #C42A1F; font-weight: 800; }
.pcard .now .yen { font-size: 10px; margin-right: 1px; }
.pcard .now .int { font-size: 17px; letter-spacing: -.5px; }
.pcard .now .dec { font-size: 11px; }
.pcard .old { color: #b3b3b3; text-decoration: line-through; font-size: 10px; }
.pcard .save {
  margin-left: auto; background: #8A6D14; color: #fff;
  font-size: 9.5px; font-weight: 600; border-radius: 4px; padding: 1px 5px;
}
/* 1 列：电商列表式 —— 左图 ｜ 中（名称+规格） ｜ 右价格栏（虚线分隔、价格最大化） */
.poster.long .p-prods.c1 .pcard { display: flex; align-items: stretch; }
.poster.long .p-prods.c1 .pcard .pc-img { width: 102px; flex: none; aspect-ratio: 1/1; }
.poster.long .p-prods.c1 .pcard .pc-info { flex: 1; display: flex; align-items: center; padding: 8px 0; min-width: 0; }
.poster.long .p-prods.c1 .pcard .pc-mid { flex: 1; padding: 0 12px; min-width: 0; }
.poster.long .p-prods.c1 .pcard .pc-name { font-size: 13.5px; }
.poster.long .p-prods.c1 .pcard .pc-spec { margin-top: 5px; font-size: 10px; }
.poster.long .p-prods.c1 .pcard .pc-right {
  flex: none; margin-top: 0; flex-direction: column; flex-wrap: nowrap;
  align-items: flex-end; justify-content: center; gap: 3px;
  padding: 0 14px; border-left: 1px dashed #f0f0f0;
}
.poster.long .p-prods.c1 .pcard .now .yen { font-size: 11px; }
.poster.long .p-prods.c1 .pcard .now .int { font-size: 22px; }
.poster.long .p-prods.c1 .pcard .now .dec { font-size: 12px; }
.poster.long .p-prods.c1 .pcard .save { margin-left: 0; }
/* 3 列：紧凑模式 —— 规格缩小、隐藏省¥（折扣由角标承载） */
.poster.long .p-prods.c3 .pcard .pc-info { padding: 6px 8px 8px; }
.poster.long .p-prods.c3 .pcard .pc-name { font-size: 11px; }
.poster.long .p-prods.c3 .pcard .pc-spec { font-size: 8.5px; padding: 1px 5px; margin-top: 3px; }
.poster.long .p-prods.c3 .pcard .pc-right { margin-top: 5px; gap: 4px; }
.poster.long .p-prods.c3 .pcard .now .yen { font-size: 9px; }
.poster.long .p-prods.c3 .pcard .now .int { font-size: 14px; }
.poster.long .p-prods.c3 .pcard .now .dec { font-size: 9.5px; }
.poster.long .p-prods.c3 .pcard .old { font-size: 9px; }
.poster.long .p-prods.c3 .pcard .save { display: none; }
.poster.long .p-prods.c3 .pcard .pc-off { font-size: 9px; padding: 2px 6px 2px 5px; top: 6px; }

/* 生成进度条（替代步骤清单，避免选择题观感） */
.gf-track { height: 6px; border-radius: 3px; background: var(--card-2); border: 1px solid var(--line); overflow: hidden; }
.gf-bar { height: 100%; width: 0; background: var(--brand); border-radius: 3px; transition: width .4s ease; }
.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%, #57b98a 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: 5px; font-size: 11px; color: var(--text-3); min-height: 15px; }
.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); }
@keyframes gf-slide { 0% { margin-left: -32%; } 100% { margin-left: 100%; } }
.gf-status { display: flex; align-items: center; gap: 8px; margin-top: 9px; font-size: var(--t-aux); color: var(--text-2); min-height: 20px; }
.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); }

/* 日期段 */
.date-range { display: flex; align-items: center; gap: 8px; }
.date-range .input { flex: 1; }
.date-range .sep { color: var(--text-3); flex: none; }

/* 主题 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); }

/* 门店 / 品牌 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; }
@media (max-width: 880px) {
  .auth-split { flex-direction: column; }
  .auth-side { padding: 24px 26px; }
  .as-mid { padding: 18px 0; }
  .as-slogan { font-size: 19px; }
  .as-feats { display: none; }
  .as-desc { margin-top: 8px; }
  .as-foot { display: none; }
  .auth-pane { padding: 26px 20px 40px; }
}

/* ================= 顶栏：费用字段 / 用户（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; }
.cost-chip b:last-child { 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; }
@media (max-width: 640px) {
  .rv-row { flex-wrap: wrap; }
  .cm-name { width: 110px; }
  .stat b { font-size: 18px; }
}

/* ================= 品牌资产：标志版本 / 标准色 ================= */
.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; }
@media (max-width: 720px) { .logo-grid { grid-template-columns: 1fr; } }

.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; }
@media (max-width: 640px) {
  .cs-row { flex-direction: column; gap: 8px; }
  .cs-sw { width: 100%; height: 60px; }
}

/* ================= AI 透明化：标识 / 免责 / 来源 ================= */
/* 生成图角标（叠在 AI 生成画面上） */
.p-vimg { position: relative; }
/* object-fit:cover：与导出裁切口径一致（生图 1080×1440，显示区 4/4.4），
   此前缺省 fill 会把图纵向压扁、主体位置与导出/占位态不一致 */
.p-vimg .p-img { display: block; width: 100%; height: 100%; object-fit: cover; }
.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); }
/* 商品图小角标 */
.pc-ai {
  position: absolute; left: 5px; bottom: 5px; z-index: 2;
  background: rgba(0,0,0,.62); color: #fff;
  font-size: 9px; font-weight: 700; border-radius: 3px; padding: 1px 5px;
}
/* 免责 / 来源说明行 */
.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: var(--t-weak); }
.gf-steps { margin-top: 8px; display: flex; flex-direction: column; gap: 4px; }
.gf-steps:empty { display: none; }
.gf-step { display: flex; align-items: center; gap: 7px; font-size: var(--t-weak); color: var(--text-3); }
.gf-step .gf-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--line-strong); flex: none; }
.gf-step.doing { color: var(--text); }
.gf-step.doing .gf-dot { background: var(--brand); 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); }
.gf-step .gf-d { margin-left: auto; font-size: 10px; color: var(--text-3); text-align: right; }
@keyframes gf-pulse { 50% { opacity: .3; } }

/* ================= 图片来源角标 / 记录按钮 ================= */
.pc-lib {
  position: absolute; left: 5px; bottom: 5px; z-index: 2;
  background: rgba(30,122,70,.82); color: #fff;
  font-size: 9px; font-weight: 700; border-radius: 3px; padding: 1px 5px;
}
.pc-rec {
  position: absolute; right: 5px; bottom: 5px; z-index: 2; cursor: pointer;
  background: rgba(0,0,0,.5); color: #fff; backdrop-filter: blur(2px);
  font-size: 9px; border-radius: 3px; padding: 1px 5px;
}
.pc-rec:hover { background: rgba(0,0,0,.72); }
.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); }
.p-re-main {
  position: absolute; right: 8px; bottom: 8px; z-index: 4; cursor: pointer;
  display: inline-flex; align-items: center; gap: 3px;
  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); }

/* ================= 融合版头图 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: #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;
}
/* 长图渐变头块：安全区规范（头块 ≤ 底部 640 可遮盖区，李叔 09-27 放宽：超 10% 即 ≤704 也可）；
   标题默认两行大字，顶延 100px（两行 xl 总高 ~650 守 704）；值=导出 100/52/36 等比 */
.pf-grad.pf-grad-long { padding: 9.26cqw 4.81cqw 3.3cqw; }
.pf-grad .pg-brow { display: flex; align-items: center; }
.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: #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; }

/* 数字排版统一：价格 / 表格数字等宽对齐，多位数字上下不跳动 */
.pcard .now, .pf-grad .pgi-price, .table .num, .table td.num { font-variant-numeric: tabular-nums; }

/* 长图头块差异项（导出 30/标题五档/56×7/36 等比）
   标题自适应五档（09-27 二版：默认两行大字，超 2 行才降档）——
   ≤10字 t-xl 16.67cqw(180px) / ≤12 t-lg 13.89(150) / ≤14 t-md 11.85(128) / ≤16 t-sm 10.37(112) / 更长 t-xs 8.89(96,字距收紧) */
.pf-grad-long .pg-brow-t { font-size: 2.78cqw; letter-spacing: 0.37cqw; }
.pf-grad-long .pg-title { font-size: 16.67cqw; letter-spacing: 0.19cqw; line-height: 1.1; margin-top: 1.3cqw; }
.pf-grad-long.t-lg .pg-title { font-size: 13.89cqw; }
.pf-grad-long.t-md .pg-title { font-size: 11.85cqw; }
.pf-grad-long.t-sm .pg-title { font-size: 10.37cqw; }
.pf-grad-long.t-xs .pg-title { font-size: 8.89cqw; letter-spacing: 0.09cqw; }
.pf-grad-long .pg-goldbar { width: 5.19cqw; height: 0.65cqw; margin-top: 1.3cqw; }
.pf-grad-long .pg-sub { font-size: 3.33cqw; margin-top: 1.11cqw; }

.poster.fuse { padding: 0; overflow: hidden; }
.poster.fuse .p-vimg { border-radius: 0; }
.p-ph.fuse { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; }
/* 渐变占位提示：墨底胶囊钉顶部居中（浅灰占位底上清晰可见），避免与底部头块挤一起 */
.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; } }
@media (max-width: 760px) { .masonry { column-count: 1; } }
.m-item {
  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; }

/* 图片详情浮层 */
.id-dialog {
  width: min(760px, 92vw); max-height: 88vh; overflow: auto;
  display: flex; gap: 16px; padding: 16px;
}
.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-side { flex: 1 1 45%; min-width: 0; display: flex; flex-direction: column; }
.id-side .d-ops { margin-top: auto; padding-top: 12px; display: flex; gap: 8px; flex-wrap: wrap; }
.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;
}
@media (max-width: 640px) { .id-dialog { flex-direction: column; } .id-imgwrap img { max-height: 46vh; } }

/* ================= 生成记录弹窗 ================= */
.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-sw { height: 140px; border-radius: 8px; border: 1px solid var(--line); }
#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); }