:root{
  /* ── 品牌色：深海军蓝 → 亮天蓝（比原来的 #1a5276 更亮、更透） ── */
  --primary:#14598f;
  --primary-d:#0e4370;
  --primary-a:#1d6fb0;
  --primary-b:#3f9fd8;
  --primary-05:rgba(20,89,143,.05);
  --primary-10:rgba(20,89,143,.10);
  --primary-20:rgba(20,89,143,.18);
  --primary-30:rgba(20,89,143,.30);
  --primary-40:rgba(20,89,143,.42);

  /* ── 中性色：统一成冷灰（原来偏暖的米色和蓝色背景打架，显脏） ── */
  --bg:#f5f7fa;
  --bg-2:#eef2f7;
  --card:#ffffff;
  --warm:#f7f8fa;
  --warm-2:#eef1f5;
  --secondary:rgba(248,250,252,.72);
  --line:#e4e9f0;
  --line-soft:#edf1f6;
  --line-strong:#ced8e3;
  --ink:#0f1c2a;
  --ink2:#34465a;
  --ink3:#5d7186;
  --ink4:#93a3b6;
  /* 兼容旧写法：充值页 / 登录页 / 管理后台 / 四个专区页都在用 --ink-2 这类变量，
     原先 :root 里没有定义 → 颜色直接失效（文字变成继承色）。这里补齐。 */
  --ink-2:var(--ink2);
  --ink-3:var(--ink3);
  --ink-4:var(--ink4);

  --gold:#a1741a;   --gold-l:#fdf8ea;
  --green:#0f8a63;  --green-l:#e9f7f2;
  --purple:#6b4fd0; --purple-l:#f3f0fd;
  --red:#cc4437;    --red-l:#fdeeec;
  --amber:#b7791f;

  --r:16px; --r2:14px; --r3:10px; --r4:16px; --r-full:999px;
  --sh-xs:0 1px 2px rgba(15,28,42,.04);
  --sh:0 1px 2px rgba(15,28,42,.04), 0 10px 28px -10px rgba(15,28,42,.14);
  --sh-lg:0 2px 6px rgba(15,28,42,.05), 0 24px 52px -18px rgba(15,28,42,.22);
  --sh-primary:0 6px 18px -4px rgba(20,89,143,.38);
  --grad-primary:linear-gradient(135deg,#14598f,#1d6fb0 55%,#2e86c8);
  --grad-accent:linear-gradient(135deg,#0f8a63,#2bb489);
  --grad-text:linear-gradient(120deg,#14598f 10%,#1d6fb0 55%,#3f9fd8);

  --shell:1440px;
  --header-h:64px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--bg); color:var(--ink);
  font:14.5px/1.7 -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
  font-variant-numeric:tabular-nums;
}
/* ⚠️ 不要在这里写 h1~h4{color:...} 的全局规则：
   标题颜色要靠继承（.hero 里是白字），全局规则会把它盖掉。 */
:focus-visible{outline:2px solid var(--primary-a);outline-offset:2px}
a{color:var(--primary-a);text-decoration:none}
button{font-family:inherit;letter-spacing:inherit}
input,select,textarea{font-family:inherit;font-size:14px;color:var(--ink)}
/* 行内代码：接口地址那种超长串必须能断行，否则手机上会把整页撑宽（横向滚动） */
code,kbd{
  font-family:ui-monospace,"SF Mono",Consolas,"Courier New",monospace;font-size:.92em;
  background:var(--warm-2);border-radius:5px;padding:1px 5px;
  overflow-wrap:anywhere;word-break:break-word;
}
::selection{background:var(--primary-20)}
*::-webkit-scrollbar{width:9px;height:9px}
*::-webkit-scrollbar-thumb{background:rgba(0,0,0,.14);border-radius:9px;border:2px solid transparent;background-clip:content-box}
*::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,.26);background-clip:content-box}
*::-webkit-scrollbar-track{background:transparent}
/* 面板内滚动条：细、主色半透明（对标它的 custom-scrollbar） */
.panel-b::-webkit-scrollbar,.copy-block::-webkit-scrollbar{width:4px;height:4px}
.panel-b::-webkit-scrollbar-track,.copy-block::-webkit-scrollbar-track{background:transparent}
.panel-b::-webkit-scrollbar-thumb,.copy-block::-webkit-scrollbar-thumb{background:var(--primary-20);border-radius:4px;border:0}
.panel-b::-webkit-scrollbar-thumb:hover,.copy-block::-webkit-scrollbar-thumb:hover{background:rgba(20,89,143,.5)}

/* ---------- 顶部导航栏 ---------- */
.topbar{
  position:sticky;top:0;z-index:60;width:100%;
  background:rgba(255,255,255,.78);backdrop-filter:blur(20px) saturate(1.8);
  border-bottom:1px solid var(--line);
}
.topbar-in{
  max-width:var(--shell);margin:0 auto;height:var(--header-h);
  display:flex;align-items:center;gap:16px;padding:0 24px;
}
.brand{display:flex;align-items:center;gap:10px;flex:0 0 auto;cursor:pointer}
.brand .mark{
  width:36px;height:36px;border-radius:11px;flex:0 0 36px;
  background-image:var(--grad-primary);
  color:#fff;display:grid;place-items:center;font-size:18px;font-weight:800;
  box-shadow:var(--sh-primary);
}
.brand b{font-size:14.5px;font-weight:800;letter-spacing:-.2px;line-height:1.2;display:block;color:var(--ink)}
.brand small{display:block;font-size:10.5px;color:var(--ink4);font-weight:500;letter-spacing:.1px}

.topnav{display:flex;align-items:center;gap:2px;flex:1;overflow-x:auto;overflow-y:visible;scrollbar-width:none}
.topnav::-webkit-scrollbar{display:none}
.topnav button{
  display:flex;align-items:center;gap:6px;white-space:nowrap;border:0;background:none;cursor:pointer;
  border-radius:10px;padding:8px 11px;font-size:13.5px;font-weight:600;color:var(--ink2);min-height:38px;
  transition:background .16s,color .16s;
}
.topnav button:hover{background:var(--primary-05);color:var(--primary)}
.topnav button.on{
  background:var(--primary-10);color:var(--primary);font-weight:800;
}
.topnav button .ico{font-size:14px}
.topnav button .lock{font-size:10px;opacity:.55}

.top-right{display:flex;align-items:center;gap:9px;flex:0 0 auto}
.ai-status{
  display:inline-flex;align-items:center;gap:6px;
  font-size:11.5px;padding:5px 11px;border-radius:var(--r-full);background:var(--warm);color:var(--ink3);
  font-weight:600;border:1px solid var(--line);white-space:nowrap;
}
.ai-status .ico svg{width:13px;height:13px}
.ai-status.on{background:var(--green-l);color:var(--green);border-color:rgba(15,138,99,.22)}
.credit-chip .ico svg{width:14px;height:14px;color:#a1741a}

/* ---------- 主容器 ---------- */
main.shell{position:relative;padding-bottom:104px}
.shell-in{max-width:var(--shell);margin:0 auto;padding:28px 32px 44px;position:relative}
/* 底部有 sticky 行动条时，给内容留出它占的高度，避免最后一块被压住 */
.shell-in:has(.actionbar),.shell-in:has(.planbar){padding-bottom:112px}
.bottom-nav{padding-bottom:env(safe-area-inset-bottom,0)}
.crumb{
  display:flex;align-items:center;gap:16px;margin-bottom:22px;flex-wrap:wrap;
  padding-left:2px;
}
.backlink{
  display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;color:var(--ink3);
  background:#fff;border:1px solid var(--line);cursor:pointer;padding:7px 13px;border-radius:var(--r-full);
  transition:.16s;flex:0 0 auto;box-shadow:var(--sh-xs);
}
.backlink:hover{color:var(--primary);border-color:var(--primary-30);background:var(--primary-05)}
.crumb .page-title{font-size:19px;font-weight:800;letter-spacing:-.4px;line-height:1.3}
.crumb .page-sub{font-size:12.5px;color:var(--ink3);font-weight:500;margin-top:2px}
.crumb .spacer{flex:1}
.page-actions{display:flex;gap:9px;flex-wrap:wrap}

/* ---------- 圆形步骤条 ---------- */
.stepper{display:flex;align-items:flex-start;justify-content:center;margin:0 0 34px;flex-wrap:wrap;gap:6px}
.stepper .sitem{display:flex;align-items:flex-start}
.stepper .sbtn{
  display:flex;flex-direction:column;align-items:center;gap:9px;border:0;background:none;cursor:pointer;
  padding:0;transition:opacity .2s;
}
.stepper .dot{
  width:50px;height:50px;border-radius:50%;border:2px solid var(--line);background:#fff;
  display:grid;place-items:center;font-size:19px;transition:.22s;position:relative;color:var(--ink4);
}
.stepper .dot .ico svg{width:21px;height:21px;stroke-width:1.9}
.stepper .sbtn.on .dot{color:var(--primary)}
.stepper .sbtn.done .dot{color:#fff}
.stepper .sbtn:hover .dot{border-color:var(--primary-20);transform:translateY(-2px)}
.stepper .slabel{font-size:12px;font-weight:800;color:var(--ink4);transition:color .2s;letter-spacing:-.1px}
.stepper .sbtn.on .dot{border-color:var(--primary);background:var(--primary-10);box-shadow:0 8px 22px -8px rgba(20,89,143,.5)}
.stepper .sbtn.on .slabel{color:var(--primary)}
.stepper .sbtn.done .dot{border-color:var(--primary);background:var(--primary);color:#fff}
.stepper .sbtn.done .slabel{color:var(--ink2)}
.stepper .sbtn.todo{opacity:.5}
.stepper .sline{
  width:38px;height:2px;background:var(--line);border-radius:2px;margin:24px 14px 0;
  transition:background .3s;
}
.stepper .sline.done{background:var(--primary)}
@media(max-width:820px){
  .stepper .sline{width:18px;margin:22px 8px 0}
  .stepper .dot{width:42px;height:42px;font-size:16px}
  .stepper .slabel{font-size:11px}
}

/* ---------- 左右分栏 ---------- */
.split{display:grid;grid-template-columns:290px minmax(0,1fr);gap:22px;align-items:start}
@media(max-width:1080px){.split{grid-template-columns:1fr;gap:16px}}
/* 等宽两栏（人设卡页用）。
   ⚠️ 千万别再用行内 style 写 grid-template-columns —— 行内样式优先级比媒体查询高，
      手机上就不会折成单栏，两栏挤在 390px 里没法看。这个坑踩过一次。 */
.split.two{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
@media(max-width:1080px){ .split.two{grid-template-columns:1fr} }

/* 左侧：选择面板（sticky + 内部可滚动） */
.panel{
  border:1px solid var(--line);border-radius:var(--r);background:var(--secondary);
  box-shadow:var(--sh-xs);position:sticky;top:calc(var(--header-h) + 22px);
  display:flex;flex-direction:column;
  /* 留出底部 sticky 行动条（约 71px）+ 安全间距，保证面板底部按钮永远可见可点 */
  max-height:calc(100vh - var(--header-h) - 120px);
}
.panel-h{
  padding:18px 20px 12px;display:flex;align-items:center;gap:8px;
  font-size:13.5px;font-weight:800;color:var(--primary);flex:0 0 auto;
}
.panel-h .spacer{flex:1}
.panel-h .mini{color:var(--ink4);font-weight:600}
.panel-b{padding:0 14px 16px;overflow-y:auto;flex:1;display:flex;flex-direction:column;gap:7px}
.panel-f{padding:12px 16px 16px;border-top:1px solid var(--line-soft);flex:0 0 auto;border-radius:0 0 var(--r) var(--r)}

/* 面板内的选项按钮（对标它的整块实心按钮） */
.opt{
  width:100%;text-align:left;padding:12px 15px;border-radius:var(--r3);border:1px solid var(--line);
  background:#fff;color:var(--ink2);font-size:13.5px;font-weight:700;cursor:pointer;
  transition:.16s;line-height:1.45;
}
.opt:hover{background:#fff;border-color:var(--line-strong);color:var(--ink);box-shadow:var(--sh-xs)}
.opt.on{
  background-image:var(--grad-primary);background-color:var(--primary);color:#fff;border-color:var(--primary);
  box-shadow:var(--sh-primary);
}
.opt.on:hover{background:var(--primary-d);color:#fff}
.opt .sub{display:block;font-size:11px;font-weight:500;color:var(--ink4);margin-top:3px}
.opt.on .sub{color:rgba(255,255,255,.82)}
.opt-group{font-size:11px;font-weight:700;color:var(--ink4);letter-spacing:.5px;margin:10px 4px 2px}
.opt-group:first-child{margin-top:2px}

/* 右侧：结果区 */
.result{min-width:0;display:flex;flex-direction:column;gap:16px}
/* 分栏里的卡片用暖米色系（对标它的 secondary/10 + secondary/20） */
.result .card{background:#fff;border-color:var(--line);border-radius:var(--r)}

/* ---------- 底部操作条 ---------- */
.actionbar{
  position:sticky;bottom:0;z-index:40;margin-top:8px;
  background:rgba(255,255,255,.94);backdrop-filter:blur(14px);
  border:1px solid var(--line);border-radius:var(--r2);box-shadow:var(--sh);
  padding:14px 18px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;
}
.actionbar .spacer{flex:1}
.planbar{
  position:sticky;bottom:0;z-index:39;margin-top:14px;
  background:rgba(255,255,255,.94);backdrop-filter:blur(14px);
  border:1px solid var(--line);border-radius:var(--r2);box-shadow:var(--sh);
  padding:12px 16px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;
}
.planbar .pt{font-size:11px;font-weight:800;color:var(--ink4);letter-spacing:.7px;text-transform:uppercase;flex:0 0 auto}
.planbar .pi{
  font-size:11.5px;color:var(--ink2);background:var(--warm);border:1px solid var(--line-soft);
  border-radius:9px;padding:6px 11px;max-width:330px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500;
}
.planbar .pi b{color:var(--ink4);font-weight:700;margin-right:6px}
.planbar .pi.off{opacity:.5}
.planbar .spacer{flex:1}

/* ---------- 移动端底部 tab ----------
   注意：shell.js 生成的是 <a>，原来只写了 button 选择器 → 手机上底部导航完全没样式。
   两个都覆盖。 */
.tabbar{
  display:none;position:fixed;left:0;right:0;bottom:0;z-index:70;
  border-top:1px solid var(--line);background:rgba(255,255,255,.96);backdrop-filter:blur(18px);
  padding:6px 4px calc(6px + env(safe-area-inset-bottom));
}
.tabbar a,.tabbar button{
  flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
  border:0;background:none;cursor:pointer;padding:7px 2px;color:var(--ink4);font-size:10.5px;font-weight:600;
  border-radius:10px;min-height:46px;text-decoration:none;
}
.tabbar a .ico,.tabbar button .ico{font-size:17px;line-height:1}
.tabbar a.on,.tabbar button.on{color:var(--primary);background:var(--primary-05);font-weight:700}
@media(max-width:860px){
  .tabbar{display:flex}
  main.shell{padding-bottom:86px}
  .actionbar,.planbar{position:static}
}

/* ---------- 卡片 ---------- */
.card{
  background:var(--card);border:1px solid var(--line-soft);border-radius:var(--r);
  box-shadow:var(--sh-xs);padding:22px 24px;margin-bottom:14px;
}
.card.warm{background:var(--warm);border-color:var(--line)}
.card>h2{margin:0 0 6px;font-size:16.5px;font-weight:800;letter-spacing:-.3px}
.card>h2+.tip{margin-bottom:18px}
.tip{font-size:12.5px;color:var(--ink3);line-height:1.72;font-weight:400}
.row{display:flex;gap:16px;flex-wrap:wrap}
.row>*{flex:1 1 220px;min-width:0}
.field{margin-bottom:16px}
.field label{display:block;font-size:12.5px;font-weight:700;color:var(--ink2);margin-bottom:7px}
.field label .req{color:var(--red)}
.field .hint{font-size:11.5px;color:var(--ink4);margin-top:6px;line-height:1.6;font-weight:400}

.inp{
  width:100%;padding:10px 13px;border:1px solid var(--line);border-radius:var(--r3);background:#fff;
  outline:none;transition:border-color .16s,box-shadow .16s;font-weight:400;
}
.inp::placeholder{color:var(--ink4);font-weight:400}
.inp:hover{border-color:var(--line-strong)}
.inp:focus{border-color:var(--primary-a);box-shadow:0 0 0 3px var(--primary-10)}
textarea.inp{resize:vertical;min-height:80px;line-height:1.72}
select.inp{
  appearance:none;cursor:pointer;padding-right:34px;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'><path d='M2.5 4.5L6 8l3.5-3.5' stroke='%235d7186' stroke-width='1.7' fill='none' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  background-repeat:no-repeat;background-position:right 13px center;
}

/* ---------- 按钮 ---------- */
.btn{
  border:1px solid var(--line);background:#fff;color:var(--ink2);padding:9px 16px;border-radius:var(--r3);
  cursor:pointer;font-size:13.5px;font-weight:700;transition:.16s;display:inline-flex;align-items:center;gap:7px;
  white-space:nowrap;box-shadow:var(--sh-xs);
}
.btn:hover{border-color:var(--line-strong);color:var(--ink);background:#fcfdfe;box-shadow:var(--sh)}
.btn.primary{background-image:var(--grad-primary);background-color:var(--primary);border-color:transparent;color:#fff;box-shadow:var(--sh-primary)}
.btn.primary:hover{background-image:linear-gradient(135deg,#0e4370,#14598f 55%,#1d6fb0);color:#fff;transform:translateY(-1px)}
.btn.accent{background:var(--green);border-color:transparent;color:#fff;box-shadow:0 6px 18px -4px rgba(15,138,99,.4)}
.btn.accent:hover{background:#0c7454;color:#fff;transform:translateY(-1px)}
.btn.dark{background:#132231;border-color:transparent;color:#fff}
.btn.dark:hover{background:#0b1622;color:#fff}
.btn.ghost{background:transparent;border-color:transparent;color:var(--primary);box-shadow:none}
.btn.ghost:hover{background:var(--primary-05);color:var(--primary);box-shadow:none}
.btn.sm{padding:6px 11px;font-size:12.5px;border-radius:9px}
.btn:disabled{opacity:.4;cursor:not-allowed;box-shadow:none;transform:none}
.btn-row{display:flex;gap:9px;flex-wrap:wrap;align-items:center}
.bar{display:flex;gap:9px;flex-wrap:wrap;align-items:center;padding-top:6px}

/* ---------- 行业卡 ---------- */
.ind-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(166px,1fr));gap:12px}
.ind{
  border:1px solid var(--line);border-radius:var(--r2);padding:15px;cursor:pointer;
  background:#fff;transition:.18s;text-align:left;
}
.ind:hover{border-color:var(--line-strong);transform:translateY(-2px);box-shadow:var(--sh)}
.ind.on{border-color:var(--primary);background:var(--primary-05);box-shadow:0 0 0 1px var(--primary-30)}
.ind .em{font-size:19px;line-height:1}
.ind b{display:block;font-size:14px;font-weight:800;margin:9px 0 4px;color:var(--ink);letter-spacing:-.2px}
.ind span{font-size:11.5px;color:var(--ink4);line-height:1.5;display:block;font-weight:400}
.ind.on b{color:var(--primary)}

/* ---------- 胶囊 ---------- */
.pillbar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:13px}
.pill{
  padding:7px 14px;border-radius:var(--r-full);border:1px solid var(--line);background:#fff;font-size:12.5px;
  cursor:pointer;color:var(--ink2);font-weight:600;transition:.16s;
}
.pill:hover{border-color:var(--primary-30);color:var(--primary);background:var(--primary-05)}
.pill.on{background-image:var(--grad-primary);background-color:var(--primary);border-color:transparent;color:#fff;font-weight:700;box-shadow:var(--sh-primary)}

/* ---------- 选题 / 结构 ---------- */
.st-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(268px,1fr));gap:12px}
.st{border:1px solid var(--line);border-radius:var(--r2);padding:16px;cursor:pointer;background:#fff;transition:.18s}
.st:hover{border-color:var(--line-strong);box-shadow:var(--sh);transform:translateY(-2px)}
.st.on{border-color:var(--primary);background:var(--primary-05);box-shadow:0 0 0 1px var(--primary-30)}
.st b{font-size:14px;font-weight:800;display:block;margin-bottom:6px;color:var(--ink);letter-spacing:-.2px;line-height:1.5}
.st .desc{font-size:12px;color:var(--ink4);line-height:1.6;margin-bottom:9px;font-weight:400}
.st .flow{display:flex;flex-direction:column;gap:4px;font-size:11.5px;color:var(--ink2)}
.st .flow i{font-style:normal;color:var(--ink4)}
.st .flow div{display:flex;gap:7px}
.st .flow em{
  font-style:normal;flex:0 0 17px;height:17px;border-radius:6px;background:var(--warm-2);color:var(--ink3);
  display:grid;place-items:center;font-size:10px;font-weight:800;margin-top:2px;
}
.st.on .flow em{background:#fff;color:var(--primary)}
.st .meta{display:flex;gap:6px;flex-wrap:wrap;align-items:center}

.tag{
  font-size:11px;padding:3px 9px;border-radius:var(--r-full);background:var(--warm);color:var(--ink3);
  white-space:nowrap;font-weight:600;border:1px solid var(--line-soft);
}
.tag.hot{background:var(--primary-10);color:var(--primary);border-color:var(--primary-20)}
.tag.blue{background:var(--primary-05);color:var(--primary-a);border-color:var(--primary-20)}
.tag.green{background:var(--green-l);color:var(--green);border-color:rgba(15,138,99,.2)}
.tag.gold{background:var(--gold-l);color:var(--gold);border-color:rgba(161,116,26,.2)}
.tag.purple{background:var(--purple-l);color:var(--purple);border-color:rgba(107,79,208,.2)}
.tag.red{background:var(--red-l);color:var(--red);border-color:rgba(204,68,55,.2)}

/* ---------- 成稿 / 剧本 ---------- */
.script-wrap{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:16px;align-items:start}
@media(max-width:1180px){.script-wrap{grid-template-columns:1fr}}
.box{border:1px solid var(--line-soft);border-radius:var(--r2);overflow:hidden;background:#fff}
.box-h{
  padding:12px 16px;background:var(--warm);border-bottom:1px solid var(--line-soft);font-size:12.5px;font-weight:700;
  color:var(--ink2);display:flex;align-items:center;gap:8px;flex-wrap:wrap;
}
.box-h .spacer{flex:1}
.box-b{padding:16px}
.part{margin-bottom:16px;padding-left:13px;border-left:3px solid var(--warm-2)}
.part.hook{border-left-color:var(--primary)}
.part.body{border-left-color:var(--primary-b)}
.part.cta{border-left-color:var(--green)}
.part.punch{border-left-color:var(--gold)}
.part .plabel{
  font-size:11px;font-weight:800;color:var(--ink4);letter-spacing:.7px;margin-bottom:7px;
  display:flex;gap:8px;align-items:center;flex-wrap:wrap;text-transform:uppercase;
}
.part .ptext{font-size:14.5px;line-height:1.88;white-space:pre-wrap;word-break:break-word;color:var(--ink)}
.part .pnote{
  font-size:11.5px;color:var(--ink4);margin-top:8px;line-height:1.62;padding-top:8px;
  border-top:1px dashed var(--line-soft);font-weight:500;
}
.cue{
  font-size:13px;color:#7a5c06;background:var(--gold-l);border:1px solid rgba(161,116,26,.16);
  border-radius:10px;padding:8px 12px;margin:8px 0 7px;line-height:1.6;font-weight:600;
}
.part.hook .cue{background:var(--primary-05);border-color:var(--primary-20);color:var(--primary)}
.part.cta .cue{background:var(--green-l);border-color:rgba(26,143,106,.18);color:var(--green)}
.part.punch .cue{background:var(--purple-l);border-color:rgba(109,79,196,.18);color:var(--purple)}
.copy-block{
  white-space:pre-wrap;font-size:14px;line-height:1.92;padding:17px;background:var(--warm);
  border:1px solid var(--line-soft);border-radius:var(--r3);max-height:640px;overflow:auto;
}

.check{display:flex;gap:10px;padding:11px 0;border-bottom:1px dashed var(--line-soft);font-size:12.5px;line-height:1.65}
.check:last-child{border-bottom:0}
.check .ci{flex:0 0 19px;height:19px;border-radius:50%;display:grid;place-items:center;font-size:11px;color:#fff;margin-top:1px;font-weight:800}
.check.ok .ci{background:var(--green)}
.check.warn .ci{background:var(--amber)}
.check.bad .ci{background:var(--red)}
.check b{display:block;font-size:12.5px;font-weight:800;color:var(--ink);margin-bottom:1px}
.check span{color:var(--ink4);font-size:11.5px;font-weight:500}
.score{
  display:flex;align-items:center;gap:15px;padding:15px 17px;background:linear-gradient(135deg,#f8fafc,#fff);
  border:1px solid var(--line-soft);border-radius:var(--r2);margin-bottom:15px;
}
.score .num{font-size:34px;font-weight:800;line-height:1;letter-spacing:-1.5px}
.score .num small{font-size:12px;color:var(--ink4);font-weight:600;letter-spacing:0}
.score .txt{font-size:12.5px;color:var(--ink2);line-height:1.65;font-weight:400}

/* ---------- 日历 ---------- */
.cal{display:grid;grid-template-columns:repeat(auto-fill,minmax(158px,1fr));gap:10px}
.cal-d{
  border:1px solid var(--line-soft);border-radius:var(--r3);padding:12px;background:#fff;font-size:12px;
  line-height:1.58;transition:.16s;
}
.cal-d:hover{border-color:var(--primary-20);box-shadow:var(--sh);transform:translateY(-1px)}
.cal-d .d{font-size:11px;color:var(--ink4);font-weight:700;margin-bottom:6px;display:flex;justify-content:space-between;align-items:center}
.cal-d .t{font-weight:700;font-size:12.5px;margin-bottom:5px;color:var(--ink);line-height:1.5}
.cal-d .a{color:var(--ink4);font-size:11px;font-weight:400}
.cal-d.rest{background:var(--warm);color:var(--ink4)}

/* ---------- 文案库 ---------- */
.lib-item{
  border:1px solid var(--line-soft);border-radius:var(--r2);padding:16px;margin-bottom:10px;background:#fff;
  display:flex;gap:14px;align-items:flex-start;transition:.16s;
}
.lib-item:hover{border-color:var(--line-strong);box-shadow:var(--sh)}
.lib-item .l-main{flex:1;min-width:0}
.lib-item h3{margin:0 0 7px;font-size:14.5px;font-weight:800;letter-spacing:-.2px}
.lib-item .l-meta{font-size:11.5px;color:var(--ink4);display:flex;gap:8px;flex-wrap:wrap;margin-bottom:9px;align-items:center;font-weight:400}
.lib-item .l-body{
  font-size:12.5px;color:var(--ink3);line-height:1.72;display:-webkit-box;-webkit-line-clamp:3;
  -webkit-box-orient:vertical;overflow:hidden;font-weight:400;
}
.empty{text-align:center;padding:52px 22px;color:var(--ink4);font-size:13px;font-weight:400;line-height:1.8}
.empty .em{font-size:34px;display:block;margin-bottom:12px;opacity:.55}
.guide{display:flex;flex-direction:column;align-items:center;gap:12px;padding:46px 22px;text-align:center}
.guide .em{font-size:38px;opacity:.6}
.guide h3{margin:0;font-size:16px;font-weight:800;letter-spacing:-.25px}
.guide p{margin:0;font-size:12.5px;color:var(--ink4);line-height:1.75;max-width:460px;font-weight:400}
.guide .bar{justify-content:center}

/* ---------- 弹窗 / toast / 提示 ---------- */
.mask{position:fixed;inset:0;background:rgba(15,28,42,.42);backdrop-filter:blur(4px);z-index:100;display:grid;place-items:center;padding:20px}
.modal{background:#fff;border-radius:var(--r);box-shadow:var(--sh-lg);width:100%;max-width:620px;max-height:88vh;display:flex;flex-direction:column;overflow:hidden}
.modal-h{padding:17px 22px;border-bottom:1px solid var(--line-soft);display:flex;align-items:center;gap:10px}
.modal-h b{font-size:15px;flex:1;font-weight:800}
.modal-b{padding:22px;overflow:auto}
.modal-f{padding:15px 22px;border-top:1px solid var(--line-soft);display:flex;gap:10px;justify-content:flex-end;background:var(--warm)}
.x{border:0;background:none;font-size:20px;color:var(--ink4);cursor:pointer;line-height:1;padding:3px 7px;border-radius:8px}
.x:hover{background:var(--warm);color:var(--ink)}
#toast{
  position:fixed;left:50%;bottom:36px;transform:translate(-50%,20px);background:#132231;color:#fff;
  padding:12px 22px;border-radius:var(--r3);font-size:13.5px;font-weight:600;opacity:0;pointer-events:none;
  transition:.26s cubic-bezier(.2,.8,.2,1);z-index:200;box-shadow:var(--sh-lg);max-width:80vw;
}
#toast.on{opacity:1;transform:translate(-50%,0)}
.notice{
  font-size:12.5px;line-height:1.72;padding:13px 15px;border-radius:var(--r3);
  background:var(--gold-l);border:1px solid rgba(161,116,26,.18);color:#7a5c06;margin-bottom:15px;font-weight:400;
}
.notice.blue{background:var(--primary-05);border-color:var(--primary-20);color:var(--primary)}
.notice.green{background:var(--green-l);border-color:rgba(15,138,99,.2);color:var(--green)}
.notice b{font-weight:800}
.mini{font-size:11.5px;color:var(--ink4);line-height:1.65;font-weight:400}
hr.sep{border:0;border-top:1px solid var(--line-soft);margin:18px 0}
.kv{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:13px}
.kv .chip{font-size:11.5px;padding:5px 11px;border-radius:var(--r-full);background:var(--warm);color:var(--ink3);font-weight:600}
.kv .chip b{color:var(--ink);font-weight:800}
.hidden{display:none !important}

@media(max-width:860px){
  .shell-in{padding:18px 14px 30px}
  .topbar-in{padding:0 14px;gap:10px}
  .brand small{display:none}
  .card{padding:18px;border-radius:var(--r2)}
  /* 手机上顶栏只留 logo + 账号：8 个导航项挤在 390px 里根本点不中，
     导航交给底部 tabbar，AI 设置从「我的 → 商家与 AI 设置」进。 */
  .topnav{display:none}
  .ai-status{display:none}
  .brand{flex:1;min-width:0}
  .pc-tabs{overflow-x:auto;flex-wrap:nowrap}
  .pc-tabs button{white-space:nowrap}
}


/* ==========================================================================
   多页面站点新增样式：账号 · 积分 · 首页 · 认证页
   ========================================================================== */

/* 品牌文字块（顶栏用 a 标签） */
.brand-txt{display:block}
.topnav a{
  display:flex;align-items:center;gap:6px;white-space:nowrap;text-decoration:none;
  border-radius:10px;padding:8px 11px;font-size:13.5px;font-weight:600;color:var(--ink2);
  transition:background .16s,color .16s;min-height:38px;
}
.topnav a:hover{background:var(--primary-05);color:var(--primary)}
.topnav a.on{background:var(--primary-10);color:var(--primary);font-weight:800}
.topnav a .ico{font-size:14px}
/* 线形 SVG 图标（取代 emoji：emoji 在不同系统上尺寸/颜色都不受控，一眼廉价） */
.ico{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;line-height:1}
.ico svg{width:16px;height:16px;display:block;stroke:currentColor;fill:none;
  stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.tabbar .ico svg{width:20px;height:20px}
.zone .z-ico svg{width:22px;height:22px}
.navmore-item .ico svg{width:16px;height:16px}

/* 积分胶囊 */
.credit-chip{
  display:inline-flex;align-items:center;gap:6px;text-decoration:none;
  background:#fff;border:1px solid var(--line);
  border-radius:var(--r-full);padding:6px 13px;transition:.16s;white-space:nowrap;
}
.credit-chip:hover{border-color:rgba(161,116,26,.45);box-shadow:0 4px 14px -4px rgba(161,116,26,.35)}
.credit-chip .cc-ico{font-size:13px}
.credit-chip .cc-num{font-size:14px;font-weight:800;color:#8a6508;font-variant-numeric:tabular-nums}
.credit-chip .cc-unit{font-size:11px;color:#a1741a;font-weight:600}

/* 账号菜单 */
.acct{position:relative}
.acct-btn{
  display:flex;align-items:center;gap:8px;border:1px solid var(--line);background:#fff;
  border-radius:var(--r-full);padding:4px 11px 4px 4px;cursor:pointer;transition:.16s;min-height:38px;
}
.acct-btn:hover{border-color:var(--line-strong);background:#fcfdfe;box-shadow:var(--sh-xs)}
.acct-btn .avatar{
  width:30px;height:30px;border-radius:50%;background-image:var(--grad-primary);color:#fff;
  display:grid;place-items:center;font-size:13px;font-weight:800;flex:0 0 30px;
}
.acct-btn .acct-name{font-size:13px;font-weight:700;color:var(--ink2);max-width:88px;overflow:hidden;text-overflow:ellipsis}
.acct-btn .caret{font-size:10px;color:var(--ink4)}
.acct-pop{
  position:absolute;right:0;top:calc(100% + 10px);width:252px;background:#fff;
  border:1px solid var(--line);border-radius:var(--r2);box-shadow:var(--sh-lg);
  padding:8px;opacity:0;visibility:hidden;transform:translateY(-6px);transition:.18s;z-index:80;
}
.acct-pop.on{opacity:1;visibility:visible;transform:translateY(0)}
.acct-head{padding:12px 12px 10px;border-bottom:1px solid var(--line-soft)}
.acct-head b{display:block;font-size:14px;font-weight:800}
.acct-head span{display:block;font-size:11.5px;color:var(--ink4);margin-top:2px;word-break:break-all}
.acct-credits{
  display:flex;align-items:center;justify-content:space-between;padding:11px 12px;margin:6px 0;
  background:var(--gold-l);border:1px solid rgba(161,116,26,.16);border-radius:10px;
}
.acct-credits span{font-size:12px;color:#8a6508;font-weight:600}
.acct-credits b{font-size:15px;color:#8a6508;font-weight:800;font-variant-numeric:tabular-nums}
.acct-item{
  display:flex;align-items:center;gap:9px;width:100%;text-align:left;border:0;background:none;cursor:pointer;
  padding:10px 12px;border-radius:9px;font-size:13px;font-weight:600;color:var(--ink2);
  text-decoration:none;transition:.14s;font-family:inherit;
}
.acct-item .ico{color:var(--ink4);transition:color .14s}
.acct-item:hover{background:var(--primary-05);color:var(--primary)}
.acct-item:hover .ico{color:var(--primary)}
.acct-item.danger:hover{background:var(--red-l);color:var(--red)}
.acct-item.danger:hover .ico{color:var(--red)}

/* ---------- 首页 Hero ---------- */
.hero{
  position:relative;overflow:hidden;border-radius:22px;padding:56px 52px 50px;margin-bottom:24px;
  background:
    linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px) 0 0/100% 46px,
    linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px) 0 0/46px 100%,
    radial-gradient(900px 420px at 84% -18%, rgba(63,159,216,.36), transparent 62%),
    radial-gradient(720px 380px at 2% 108%, rgba(20,89,143,.42), transparent 62%),
    linear-gradient(150deg,#0c3350 0%,#14598f 46%,#1f7ab5 100%);
  color:#fff;box-shadow:0 30px 64px -28px rgba(12,51,80,.72);
}
.hero::after{
  content:'';position:absolute;right:-120px;top:-110px;width:460px;height:460px;border-radius:50%;
  background:radial-gradient(circle at 34% 34%, rgba(255,255,255,.20), rgba(255,255,255,0) 62%);
  pointer-events:none;
}
.hero::before{
  content:'';position:absolute;left:-70px;bottom:-160px;width:360px;height:360px;border-radius:50%;
  background:radial-gradient(circle at 50% 50%, rgba(63,159,216,.30), rgba(63,159,216,0) 66%);
  pointer-events:none;
}
.hero .h-in{position:relative;z-index:2;max-width:730px}
.hero .kicker{
  display:inline-flex;align-items:center;gap:7px;font-size:11.5px;font-weight:600;letter-spacing:.4px;
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.20);
  padding:6px 14px;border-radius:var(--r-full);margin-bottom:20px;backdrop-filter:blur(6px);
}
.hero h1{
  margin:0 0 16px;font-size:38px;line-height:1.26;font-weight:800;letter-spacing:-1.1px;
}
.hero h1 em{
  font-style:normal;
  background-image:linear-gradient(100deg,#cfe8fa,#8fd0ee 60%,#ffffff);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.hero p{margin:0 0 26px;font-size:14.5px;line-height:1.85;color:rgba(255,255,255,.82);max-width:610px}
.hero .h-btns{display:flex;gap:11px;flex-wrap:wrap}
.hero .btn-hero{
  display:inline-flex;align-items:center;gap:8px;border:0;cursor:pointer;text-decoration:none;
  padding:13px 25px;border-radius:var(--r3);font-size:14.5px;font-weight:700;transition:.18s;
}
.hero .btn-hero.light{background:#fff;color:var(--primary);box-shadow:0 12px 28px -10px rgba(0,0,0,.55)}
.hero .btn-hero.light:hover{transform:translateY(-2px);box-shadow:0 18px 34px -12px rgba(0,0,0,.6)}
.hero .btn-hero.ghost{background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.26)}
.hero .btn-hero.ghost:hover{background:rgba(255,255,255,.20)}
.hero-stats{display:flex;gap:36px;flex-wrap:wrap;margin-top:34px;padding-top:24px;border-top:1px solid rgba(255,255,255,.16)}
.hero-stats .hs b{display:block;font-size:25px;font-weight:800;letter-spacing:-.7px;font-variant-numeric:tabular-nums}
.hero-stats .hs span{font-size:11.5px;color:rgba(255,255,255,.68);font-weight:600}

/* 首页区块标题 */
.sec-head{display:flex;align-items:flex-end;gap:14px;margin:32px 0 15px;flex-wrap:wrap}
.sec-head h2{margin:0;font-size:20px;font-weight:800;letter-spacing:-.5px}
.sec-head p{margin:0 0 1px;font-size:12.5px;color:var(--ink4);font-weight:400}
.sec-head .spacer{flex:1}

/* 专区卡片网格 */
.zone-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(258px,1fr));gap:14px}
.zone{
  display:block;text-decoration:none;color:inherit;background:#fff;border:1px solid var(--line-soft);
  border-radius:var(--r);padding:22px;transition:.2s;position:relative;overflow:hidden;box-shadow:var(--sh-xs);
}
.zone:hover{transform:translateY(-3px);box-shadow:var(--sh-lg);border-color:var(--primary-20)}
.zone .z-ico{
  width:44px;height:44px;border-radius:13px;display:grid;place-items:center;font-size:21px;
  background:var(--primary-05);border:1px solid var(--primary-10);color:var(--primary);margin-bottom:14px;
  transition:.2s;
}
.zone:hover .z-ico{background:var(--primary-10);border-color:var(--primary-20)}
.zone h3{margin:0 0 7px;font-size:15.5px;font-weight:800;letter-spacing:-.3px;display:flex;align-items:center;gap:8px}
.zone p{margin:0;font-size:12.5px;color:var(--ink3);line-height:1.7;font-weight:400}
.zone .z-foot{margin-top:14px;display:flex;gap:6px;flex-wrap:wrap}
.zone .z-arrow{
  position:absolute;right:20px;top:22px;font-size:16px;color:var(--primary);opacity:0;transition:.2s;
}
.zone:hover .z-arrow{opacity:1;transform:translateX(3px)}
.zone.soon{opacity:.72}
.zone.soon:hover{opacity:1}
/* 未登录时专区卡右上角挂一个"注册后可用"的小锁（点了会被服务端拦到登录页） */
.zone .z-lock{
  position:absolute;right:18px;top:20px;display:inline-flex;align-items:center;gap:4px;
  font-size:11px;font-weight:600;color:var(--ink4);background:var(--warm);
  border:1px solid var(--line);border-radius:var(--r-full);padding:3px 9px;white-space:nowrap;
}
.zone .z-lock .ico svg{width:12px;height:12px}
.zone.guest:hover .z-arrow{opacity:0}

/* ==========================================================================
   首页落地页区块：痛点 / 三步 / 对比表 / 价格 / FAQ / 底部行动条
   全部用现有组件拼的，没有引入图片或图标资源（老板要"便宜的"一版）
   ========================================================================== */
.pain{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px}
.pain .p-item{background:#fff;border:1px solid var(--line-soft);border-radius:var(--r2);padding:18px 20px;box-shadow:var(--sh-xs)}
.pain .p-item .pn{
  display:inline-grid;place-items:center;width:24px;height:24px;border-radius:8px;
  background:var(--red-l);color:var(--red);font-size:12px;font-weight:800;margin-bottom:10px;
}
.pain .p-item b{display:block;font-size:14.5px;font-weight:800;margin-bottom:6px;color:var(--ink)}
.pain .p-item p{margin:0;font-size:12.5px;color:var(--ink3);line-height:1.72}

.how{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px}
.how .h-step{background:#fff;border:1px solid var(--line-soft);border-radius:var(--r2);padding:20px;box-shadow:var(--sh-xs)}
.how .h-step .hn{
  display:inline-grid;place-items:center;width:26px;height:26px;border-radius:9px;
  background-image:var(--grad-primary);color:#fff;font-size:13px;font-weight:800;margin-bottom:12px;
}
.how .h-step b{display:block;font-size:15px;font-weight:800;margin-bottom:4px;color:var(--ink);letter-spacing:-.25px}
.how .h-step .hm{display:block;font-size:11.5px;color:var(--primary);font-weight:700;margin-bottom:8px}
.how .h-step p{margin:0;font-size:12.5px;color:var(--ink3);line-height:1.72}

/* 对比表在小屏会超宽 → 外面套一层可横向滚动，不要撑破整页 */
.cmp-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.cmp{width:100%;min-width:560px;border-collapse:collapse;font-size:13px;background:#fff;border:1px solid var(--line-soft);
  border-radius:var(--r2);overflow:hidden;box-shadow:var(--sh-xs)}
.cmp th{background:var(--warm);text-align:left;padding:11px 14px;font-size:12px;color:var(--ink3);font-weight:700;white-space:nowrap}
.cmp td{padding:12px 14px;border-top:1px solid var(--line-soft);color:var(--ink2);vertical-align:top}
.cmp td:first-child{font-weight:700;color:var(--ink);white-space:nowrap}
.cmp tr.best td{background:var(--primary-05)}
.cmp tr.best td:first-child{color:var(--primary)}
.cmp .pr{font-weight:800;color:var(--ink);white-space:nowrap}

.plans-line{display:grid;grid-template-columns:repeat(auto-fit,minmax(158px,1fr));gap:12px}
.plans-line .pl{background:#fff;border:1px solid var(--line-soft);border-radius:var(--r2);padding:16px 14px;
  text-align:center;box-shadow:var(--sh-xs)}
.plans-line .pl .pn2{font-size:13px;font-weight:800;color:var(--ink2)}
.plans-line .pl .pp{font-size:24px;font-weight:800;color:var(--primary);letter-spacing:-1px;margin:6px 0 2px}
.plans-line .pl .pc{font-size:12px;color:var(--ink4)}
.plans-line .pl .pu{font-size:11px;color:var(--ink4);margin-top:6px;line-height:1.5}

.faq{display:flex;flex-direction:column;gap:8px}
.faq details{background:#fff;border:1px solid var(--line-soft);border-radius:var(--r2);overflow:hidden;box-shadow:var(--sh-xs)}
.faq summary{cursor:pointer;padding:14px 18px;font-size:13.5px;font-weight:700;color:var(--ink);
  list-style:none;display:flex;align-items:flex-start;gap:9px;line-height:1.6}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{content:'+';color:var(--primary);font-weight:800;font-size:16px;flex:0 0 auto;line-height:1.4}
.faq details[open] summary::before{content:'−'}
.faq details[open] summary{border-bottom:1px solid var(--line-soft)}
.faq details p{margin:0;padding:14px 18px 16px 39px;font-size:12.5px;color:var(--ink3);line-height:1.82}

.cta-band{
  margin-top:32px;padding:34px 36px;border-radius:var(--r);text-align:center;
  background:
    radial-gradient(700px 300px at 80% -30%, rgba(63,159,216,.35), transparent 62%),
    linear-gradient(150deg,#0c3350,#14598f 58%,#1f7ab5);
  color:#fff;box-shadow:0 26px 54px -26px rgba(12,51,80,.7);
}
.cta-band h2{margin:0 0 9px;font-size:22px;font-weight:800;letter-spacing:-.6px;color:#fff}
.cta-band p{margin:0 0 20px;font-size:13.5px;color:rgba(255,255,255,.84)}
.cta-band .btn-hero{
  display:inline-flex;align-items:center;gap:8px;border:0;cursor:pointer;text-decoration:none;
  padding:13px 28px;border-radius:var(--r3);font-size:14.5px;font-weight:800;
  background:#fff;color:var(--primary);transition:.18s;
}
.cta-band .btn-hero:hover{transform:translateY(-2px);box-shadow:0 16px 30px -12px rgba(0,0,0,.55)}
.cta-band .cta-sub{margin:14px 0 0;font-size:12px;color:rgba(255,255,255,.62)}

.site-foot{margin-top:32px;padding-top:20px;border-top:1px solid var(--line);text-align:center;
  font-size:12px;color:var(--ink4);line-height:2}
.site-foot a{color:var(--ink3);font-weight:600}
.site-foot a:hover{color:var(--primary)}

/* ---------- "当前模式"提示条（人设卡页：内置模板 / 大模型打磨）----------
   存在的意义：让"现在到底用没用大模型、会不会扣额度"一眼可见，
   避免用户以为"我没开 AI，怎么自动用上了"。 */
.mode-line{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  padding:9px 13px;border-radius:var(--r3);margin-bottom:14px;
  background:var(--warm);border:1px solid var(--line);
  font-size:12.5px;color:var(--ink2);
}
.mode-line .ico{color:var(--ink4)}
.mode-line .ico svg{width:15px;height:15px}
.mode-line b{font-weight:800;color:var(--ink)}
.mode-line a{margin-left:auto;font-size:12.5px;font-weight:700;white-space:nowrap}
.mode-line.on{background:var(--primary-05);border-color:var(--primary-20);color:var(--primary)}
.mode-line.on .ico,.mode-line.on b{color:var(--primary)}
@media(max-width:640px){ .mode-line a{margin-left:0} }

/* ---------- 视频生成页 ---------- */
/* 出片设置面板：看完分镜再调，最后才点出片 */
.setbox{
  margin-top:14px;padding:14px 16px;border-radius:var(--r3);
  background:var(--warm);border:1px solid var(--line-soft);
}
.setbox .setrow{display:flex;align-items:center;gap:10px;margin-bottom:10px;flex-wrap:wrap}
.setbox .setrow label{flex:0 0 108px;font-size:12.5px;font-weight:700;color:var(--ink2)}
.setbox .setrow select,
.setbox .setrow input[type=text]{
  flex:1 1 200px;min-width:0;height:34px;padding:0 10px;font-size:13px;
  border:1px solid var(--line);border-radius:var(--r2);background:#fff;color:var(--ink);
}
.setbox .setchk{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ink2);cursor:pointer}
.setbox .setchk input{width:auto}
@media(max-width:640px){ .setbox .setrow label{flex-basis:100%} }
/* 分镜摘要：一行说清结果，细节折叠 */
.shotsum{
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  margin-top:12px;padding:10px 14px;border-radius:var(--r2);
  background:var(--warm);border:1px solid var(--line-soft);font-size:13px;color:var(--ink2);
}
.shotsum .lnk{
  margin-left:auto;background:none;border:0;padding:0;cursor:pointer;
  color:var(--ink);font-size:13px;font-weight:700;text-decoration:underline;
}
.shotsum .lnk:hover{color:var(--gold-deep,#8a6a20)}
/* 设置行里的"去某处挑/生成"小链接（跟在下拉后面）*/
.setrow .lnk2{
  flex:0 0 auto;font-size:12.5px;font-weight:700;color:var(--ink2);
  text-decoration:underline;white-space:nowrap;
}
.setrow .lnk2:hover{color:var(--ink)}

/* 分镜列表：一眼看清"哪一屏、说什么、画面拍什么" */
.shots{display:flex;flex-direction:column;gap:8px;margin-top:14px}
.shot{
  display:flex;gap:10px;align-items:flex-start;
  padding:10px 12px;border-radius:var(--r3);
  background:#fff;border:1px solid var(--line-soft);
}
.shot.key{border-color:var(--primary-30);background:var(--primary-05)}
.shot .sn{
  flex:0 0 auto;width:22px;height:22px;border-radius:99px;
  background:var(--warm);color:var(--ink3);font-size:11.5px;font-weight:800;
  display:flex;align-items:center;justify-content:center;
}
.shot.key .sn{background:var(--primary);color:#fff}
.shot .st{font-size:13.5px;font-weight:700;color:var(--ink);line-height:1.6}
.shot.key .st{color:var(--primary-d)}
.shot .sv{font-size:11.5px;color:var(--ink3);margin-top:4px;line-height:1.6}

/* 渲染进度条：渲染是分钟级的，没有可见进度用户会以为卡死 */
.pbar{height:8px;border-radius:99px;background:var(--warm);overflow:hidden;border:1px solid var(--line-soft)}
.pbar i{display:block;height:100%;background-image:var(--grad-primary);transition:width .3s}

/* 播放器：竖屏 720×1280，页面上限个高，别把版面撑爆 */
.vplayer{
  display:block;width:100%;max-width:300px;margin:14px auto 0;
  border-radius:var(--r3);background:#000;
}

/* 我的视频列表 */
.vlist{display:flex;flex-direction:column;gap:8px}
.vrow{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  padding:10px 12px;border-radius:var(--r3);background:#fff;border:1px solid var(--line-soft);
}
.vrow .vmain{flex:1 1 200px;min-width:0}
.vrow .vmain b{font-size:13px;color:var(--ink);display:block;margin-bottom:3px}
.vrow .vact{flex:0 0 auto}
@media(max-width:640px){ .vplayer{max-width:100%} }

/* ---------- 行业话术包（人设卡右侧那一块） ----------
   为什么要单独做得显眼：它是"行业列举不完"的解法 ——
   用户自己填什么细分生意，就按那个写话术。但**必须有 / 没有 / 过期了
   三种状态一眼能分清**，否则用户会以为它生效了（实际过期期间是不生效的）。 */
.lexbox{
  margin:14px 0 0;padding:13px 14px;border-radius:var(--r3);
  background:var(--warm);border:1px solid var(--line-soft);
}
.lexhead{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.lexhead b{font-size:13.5px;color:var(--ink);display:inline-flex;align-items:center;gap:6px}
.lexhead .ico svg{width:15px;height:15px;color:var(--primary)}
.lexhead .mini{font-size:11.5px;color:var(--ink3)}
.lexstate{
  display:flex;align-items:flex-start;gap:8px;font-size:12.5px;line-height:1.7;
  color:var(--ink2);background:#fff;border:1px solid var(--line-soft);
  border-radius:var(--r3);padding:9px 11px;
}
.lexstate .ico svg{width:14px;height:14px;margin-top:3px;flex:0 0 auto}
.lexstate.ok{background:var(--green-l);border-color:rgba(15,138,99,.2);color:var(--green)}
.lexstate.ok .ico svg{color:var(--green)}
.lexstate.warn{background:#fff8e8;border-color:rgba(214,158,46,.3);color:#8a6316}
.lexstate.warn .ico svg{color:#c08818}
.lexstate b{font-weight:800}
.lexchips{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px}
.lexchips span{
  font-size:11px;padding:2px 8px;border-radius:99px;
  background:#fff;border:1px solid var(--line-soft);color:var(--ink3);
}
@media(max-width:640px){ .lexhead .mini{display:none} }
/* 专区卡顶部一条渐变线（hover 才亮，静态不抢视线） */
.zone::before{
  content:'';position:absolute;left:0;right:0;top:0;height:3px;background-image:var(--grad-primary);
  opacity:0;transition:opacity .2s;
}
.zone:hover::before{opacity:1}

/* 首页人设库条 */
.mine{display:flex;gap:12px;flex-wrap:wrap}
.mine .mcard{
  display:flex;align-items:center;gap:11px;background:#fff;border:1px solid var(--line);
  border-radius:var(--r2);padding:13px 16px;text-decoration:none;color:inherit;transition:.18s;min-width:200px;
  box-shadow:var(--sh-xs);
}
.mine .mcard:hover{border-color:var(--primary-20);box-shadow:var(--sh);transform:translateY(-2px)}
.mine .mcard .av{
  width:36px;height:36px;border-radius:11px;background-image:var(--grad-primary);color:#fff;
  display:grid;place-items:center;font-size:15px;font-weight:800;flex:0 0 36px;
}
.mine .mcard b{display:block;font-size:13.5px;font-weight:800;line-height:1.3}
.mine .mcard span{display:block;font-size:11px;color:var(--ink4);margin-top:2px}
.mine .mcard.add{
  border-style:dashed;background:transparent;color:var(--ink4);justify-content:center;font-weight:700;font-size:13px;
  box-shadow:none;
}
.mine .mcard.add:hover{color:var(--primary);border-color:var(--primary-30);background:var(--primary-05)}

/* ---------- 认证页（登录/注册） ---------- */
.auth-wrap{max-width:460px;margin:52px auto 80px}
.auth-card{
  background:#fff;border:1px solid var(--line-soft);border-radius:var(--r);
  box-shadow:var(--sh-lg);padding:34px 34px 30px;
}
.auth-card h1{margin:0 0 8px;font-size:22px;font-weight:800;letter-spacing:-.6px}
.auth-card .lead{margin:0 0 24px;font-size:13px;color:var(--ink3);line-height:1.72;font-weight:400}
.auth-h .ico{font-size:20px}
.auth-h .ico svg{width:21px;height:21px;stroke-width:1.9}
.auth-foot{margin-top:18px;text-align:center;font-size:12.5px;color:var(--ink4)}
.auth-foot a{font-weight:700}
.perk{display:flex;gap:10px;align-items:flex-start;font-size:12.5px;color:var(--ink3);line-height:1.68;margin-bottom:10px}
.perk .pi{
  flex:0 0 20px;height:20px;border-radius:50%;background:var(--primary-05);color:var(--primary);
  display:grid;place-items:center;font-size:11px;font-weight:800;margin-top:1px;
}

/* ---------- 个人中心 ---------- */
.stat-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px}
.stat{
  background:#fff;border:1px solid var(--line-soft);border-radius:var(--r2);padding:17px 18px;
  box-shadow:var(--sh-xs);
}
.stat .sv{font-size:26px;font-weight:800;color:var(--ink);letter-spacing:-.9px;font-variant-numeric:tabular-nums}
.stat .sl{font-size:12px;color:var(--ink4);font-weight:600;margin-top:3px}
/* 统计卡配色：默认中性，需要强调时加类，不要在 HTML 里写死渐变 */
.stat.gold{background:linear-gradient(180deg,#fffcf3,#fff);border-color:rgba(161,116,26,.20)}
.stat.gold .sv{color:#8a6508}
.stat.gold .sl{color:#a1741a}
.stat.blue{background:linear-gradient(180deg,#f3f9fd,#fff);border-color:var(--primary-20)}
.stat.blue .sv{color:var(--primary)}
.stat.blue .sl{color:var(--primary-a)}
.stat.green{background:linear-gradient(180deg,#f0faf6,#fff);border-color:rgba(15,138,99,.20)}
.stat.green .sv{color:var(--green)}
.stat.green .sl{color:var(--green)}
.hist-h{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:10px;font-size:11.5px;font-weight:700;
  color:var(--ink4);padding:0 4px 10px;border-bottom:1px solid var(--line-soft);letter-spacing:.3px}
.hist-r{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:10px;font-size:12.5px;padding:11px 4px;
  border-bottom:1px dashed var(--line-soft);align-items:center}
.hist-r:last-child{border-bottom:0}
.hist-r .amt{font-weight:700;font-variant-numeric:tabular-nums}
.hist-r .amt.out{color:var(--red)}
.hist-r .amt.in{color:var(--green)}
.hist-r .bal{color:var(--ink4);font-variant-numeric:tabular-nums}
@media(max-width:640px){
  .hist-h,.hist-r{grid-template-columns:1.2fr 1fr 1fr;font-size:11.5px}
  .hist-h span:nth-child(4),.hist-r span:nth-child(4){display:none}
}

/* 充值套餐 */
.packs{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}
.pack{
  border:1px solid var(--line);border-radius:var(--r2);padding:18px;cursor:pointer;background:#fff;
  text-align:center;transition:.18s;
}
.pack:hover{border-color:var(--primary-20);transform:translateY(-2px);box-shadow:var(--sh)}
.pack.on{border-color:var(--primary);background:var(--primary-05);box-shadow:0 0 0 1px var(--primary-30)}
.pack b{display:block;font-size:18px;font-weight:800;color:var(--primary);font-variant-numeric:tabular-nums}
.pack .pk-y{font-size:11px;color:var(--ink4);margin-top:3px}
.pack .pk-p{font-size:15px;font-weight:800;margin-top:11px}
.pack .pk-t{font-size:11px;color:var(--ink4);margin-top:2px}

/* 首页空态与提示 */
.tipbar{
  display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--primary-20);
  border-radius:var(--r2);padding:12px 16px;font-size:12.5px;color:var(--primary);font-weight:600;margin-bottom:16px;
  box-shadow:var(--sh-xs);
}
.tipbar .spacer{flex:1}


/* ==========================================================================
   发布复盘看板
   ========================================================================== */

/* 自动洞察 */
.insight{
  display:flex;gap:11px;align-items:flex-start;padding:13px 14px;border-radius:var(--r3);
  background:#fafbfc;border:1px solid var(--line-soft);margin-bottom:9px;
}
.insight:last-child{margin-bottom:0}
.insight .i-ico{
  flex:0 0 22px;height:22px;border-radius:50%;display:grid;place-items:center;
  font-size:12px;font-weight:800;color:#fff;margin-top:1px;
}
.insight.good{background:var(--green-l);border-color:rgba(26,143,106,.2)}
.insight.good .i-ico{background:var(--green)}
.insight.warn{background:var(--gold-l);border-color:rgba(161,116,26,.2)}
.insight.warn .i-ico{background:var(--amber)}
.insight.bad{background:var(--red-l);border-color:rgba(192,57,43,.2)}
.insight.bad .i-ico{background:var(--red)}
.insight.info .i-ico{background:var(--primary-a)}
.insight .i-body b{display:block;font-size:13.5px;font-weight:800;margin-bottom:3px;color:var(--ink)}
.insight .i-body span{display:block;font-size:12.5px;line-height:1.72;color:var(--ink2);font-weight:500}

/* 归因表 */
.perf-table{margin-top:6px;border:1px solid var(--line-soft);border-radius:var(--r2);overflow:hidden}
.pt-h,.pt-r{
  display:grid;grid-template-columns:minmax(140px,1.6fr) 54px 88px 76px 84px 84px 96px;
  gap:8px;align-items:center;padding:11px 14px;
}
.pt-h{
  background:#fafbfc;font-size:11px;font-weight:800;color:var(--ink4);
  text-transform:uppercase;letter-spacing:.4px;border-bottom:1px solid var(--line-soft);
}
.pt-r{font-size:12.5px;border-bottom:1px dashed var(--line-soft);color:var(--ink2)}
.pt-r:last-child{border-bottom:0}
.pt-r:hover{background:#fcfdfe}
.pt-r.best{background:linear-gradient(90deg,var(--green-l),transparent 70%)}
.pt-r .pt-k{font-weight:800;color:var(--ink);display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.pt-r .pt-k .mini{font-weight:500}
.pt-r .num{font-variant-numeric:tabular-nums;font-weight:600}
.pt-r .pt-score{
  position:relative;font-weight:800;font-variant-numeric:tabular-nums;
  display:flex;flex-direction:column;gap:4px;align-items:flex-start;
}
.pt-r .pt-score i{
  display:block;height:4px;border-radius:3px;background:currentColor;opacity:.28;
  max-width:100%;min-width:6px;
}
@media(max-width:900px){
  .pt-h,.pt-r{grid-template-columns:minmax(110px,1.4fr) 44px 74px 68px;font-size:11.5px;padding:9px 10px}
  .pt-h span:nth-child(5),.pt-r span:nth-child(5),
  .pt-h span:nth-child(6),.pt-r span:nth-child(6){display:none}
}

/* 发布记录卡 */
.rec-wrap{display:flex;flex-direction:column;gap:10px}
.rec{
  display:flex;gap:14px;align-items:flex-start;padding:15px 16px;background:#fff;
  border:1px solid var(--line-soft);border-radius:var(--r2);transition:.16s;
}
.rec:hover{border-color:var(--line-strong);box-shadow:var(--sh-xs)}
.rec-main{flex:1;min-width:0}
.rec-title{font-size:14.5px;font-weight:800;line-height:1.5;margin-bottom:7px;color:var(--ink)}
.rec-meta{display:flex;gap:7px;flex-wrap:wrap;align-items:center;margin-bottom:10px}
.rec-nums{
  display:flex;gap:16px;flex-wrap:wrap;padding:9px 12px;background:var(--warm);
  border-radius:10px;font-size:11.5px;color:var(--ink4);font-weight:600;
}
.rec-nums span{display:flex;align-items:baseline;gap:4px;white-space:nowrap}
.rec-nums b{font-size:14px;color:var(--ink);font-weight:800;font-variant-numeric:tabular-nums}
.rec-nums .hl b{color:var(--primary)}
@media(max-width:720px){
  .rec{flex-direction:column}
  .rec-nums{gap:11px}
}

/* 日期输入对齐 */
input[type=date].inp{font-family:inherit}


/* ==========================================================================
   顶栏适配：导航加到 10 项后，中屏要把空间让给导航
   ========================================================================== */

/* 品牌副标题在窄屏先隐藏，把宽度让给导航 */
@media (max-width: 1900px){
  .brand .brand-txt small{ display:none }
}
/* 1760 及以下：整体收紧一档，10 项仍带图标 */
@media (max-width: 1920px){
  .topbar-in{ gap:12px }
  .topnav{ gap:1px }
  .topnav a{ padding:8px 10px; font-size:13px; gap:5px }
  .navmore-btn{ padding:8px 10px; font-size:13px; gap:5px }
  .topnav a .ico{ font-size:13px }
  .brand .brand-txt b{ font-size:14.5px }
  .credit-chip{ padding:6px 11px }
  .credit-chip .cc-num{ font-size:13px }
  .acct-btn .acct-name{ max-width:60px }
}
/* 1660 及以下：图标让位，保文字完整可读 */
@media (max-width: 1660px){
  .topnav a{ padding:8px 9px; font-size:12.5px }
  .topnav a .ico{ display:none }
  .navmore-btn{ padding:8px 9px; font-size:12.5px }
  .navmore-btn .ico{ display:none }
}
/* 1500 及以下：账号名与积分单位收起 */
@media (max-width: 1500px){
  .acct-btn .acct-name{ display:none }
  .acct-btn{ padding:5px 9px 5px 5px }
  .credit-chip .cc-unit{ display:none }
  .topnav a{ padding:8px 8px; font-size:12px }
  .navmore-btn{ padding:8px 8px; font-size:12px }
}
/* 1380 及以下：只留 logo 方块 */
@media (max-width: 1380px){
  .brand .brand-txt{ display:none }
  .topnav a{ padding:8px 7px }
  .navmore-btn{ padding:8px 7px }
}
/* 导航条允许横向滚动，任何宽度都不会把最后一项挤没 */
.topnav{
  min-width:0;
  overflow-x:auto;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
.topnav::-webkit-scrollbar{ display:none }
.topnav a{ flex:0 0 auto }
/* 顶栏右侧永不被压缩 */
.top-right{ flex:0 0 auto }


/* ==========================================================================
   选择面板：宽屏固定高度可滚动；窄屏（分栏变单栏）时恢复正常流式高度
   ========================================================================== */
.split 单栏时面板不固定高度{}
@media (max-width: 1080px){
  .panel{ position:static; max-height:none }
  .panel-b{ overflow:visible }
}


/* ==========================================================================
   个人中心：页签
   「设置」从顶栏右上角挪进这里（账号相关的东西集中在一处，用户找得到）
   ========================================================================== */
.pc-tabs{
  display:flex;gap:6px;flex-wrap:wrap;background:#fff;border:1px solid var(--line-soft);
  border-radius:var(--r2);padding:6px;margin-bottom:16px;box-shadow:var(--sh-xs);
}
.pc-tabs button{
  border:0;background:none;cursor:pointer;font-family:inherit;font-size:13.5px;font-weight:600;
  color:var(--ink2);padding:9px 16px;border-radius:10px;transition:.16s;
  display:inline-flex;align-items:center;gap:7px;
}
.pc-tabs button:hover{background:var(--primary-05);color:var(--primary)}
.pc-tabs button.on{background-image:var(--grad-primary);color:#fff;font-weight:700;box-shadow:var(--sh-primary)}
.pc-tabs button .ico svg{width:15px;height:15px}
.pc-tabs .pc-tabs-tip{margin-left:auto;align-self:center;padding-right:10px}

/* 账号信息头 */
.pc-hero{
  display:flex;align-items:center;gap:18px;flex-wrap:wrap;
  background:linear-gradient(135deg,var(--primary-05),#fff 70%);
  border:1px solid var(--primary-10);border-radius:var(--r);padding:20px 24px;margin-bottom:14px;
}
.pc-hero .pc-av{
  width:60px;height:60px;border-radius:18px;flex:0 0 60px;background-image:var(--grad-primary);
  color:#fff;display:grid;place-items:center;font-size:24px;font-weight:800;box-shadow:var(--sh-primary);
}
.pc-hero .pc-who{flex:1;min-width:180px}
/* 只作用在直接子元素上 —— 否则里面的 .tag（套餐标签）会被撑成整行灰条 */
.pc-hero .pc-who > b{display:block;font-size:17px;font-weight:800;letter-spacing:-.3px}
.pc-hero .pc-who > span{display:block;font-size:12.5px;color:var(--ink3);margin-top:3px;word-break:break-all}
.pc-hero .pc-bal{text-align:right}
.pc-hero .pc-bal b{display:block;font-size:26px;font-weight:800;color:#8a6508;letter-spacing:-1px;line-height:1.1}
.pc-hero .pc-bal span{font-size:11.5px;color:#a1741a;font-weight:600}
/* ---------- 剧本里"要改掉的地方"的标红 ----------
   自检面板会写"改掉标红的地方"，所以这里必须真的有红。
   用在：广告法风险词、开头的寒暄（"大家好/我是XX"）。 */
.risk-mark{
  background:#fdeceb;color:var(--red);font-weight:800;
  padding:1px 3px;border-radius:4px;
  box-shadow:inset 0 -2px 0 rgba(200,50,40,.35);
}
/* 勾了"只显示台词"时，标红依然要看得见 */
.copy-block.clean-only .risk-mark{background:#fdeceb;color:var(--red)}

/* ==========================================================================
   内容日历 v2：分周计划
   ========================================================================== */
.wk-tabs{display:flex;gap:9px;flex-wrap:wrap}
.wk-tab{
  flex:1 1 120px;min-width:0;text-align:left;cursor:pointer;
  background:#fff;border:1px solid var(--line);border-radius:var(--r3);
  padding:10px 12px;display:flex;flex-direction:column;gap:3px;transition:.16s;
}
.wk-tab b{font-size:13.5px;color:var(--ink)}
.wk-tab span{font-size:11.5px;color:var(--ink-3)}
.wk-tab:hover{border-color:var(--line-strong)}
.wk-tab.on{border-color:var(--primary);background:var(--primary-05);box-shadow:0 0 0 1px var(--primary-30)}
.wk-tab.on b,.wk-tab.on span{color:var(--primary-d)}
.wk-tab.lock{opacity:.5;cursor:not-allowed;background:var(--warm)}
.wk-tab:disabled{cursor:not-allowed}

.wk-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.wk-item{
  border:1px solid var(--line-soft);border-radius:var(--r3);padding:13px 14px;
  background:#fff;display:flex;flex-direction:column;
}
/* 重点 2 条给个左色条，一眼能看出哪条值得花时间 */
.wk-item.heavy{border-left:3px solid var(--amber);background:linear-gradient(180deg,rgba(214,158,46,.05),transparent 60px)}
.wi-h{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-bottom:8px}
.wi-n{font-size:12.5px;font-weight:800;color:var(--ink)}
.wi-t{font-size:14px;font-weight:700;color:var(--ink);line-height:1.55}
.wi-hook{
  margin-top:9px;padding:9px 11px;border-radius:var(--r3);
  background:var(--primary-05);border:1px solid var(--primary-10);
  font-size:12.5px;color:var(--ink-2);line-height:1.65;
}
.wi-hook b{color:var(--primary-d);margin-right:6px}
.wi-meta{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px}
.wi-meta span{
  font-size:11px;padding:2px 8px;border-radius:99px;
  background:var(--warm);border:1px solid var(--line-soft);color:var(--ink-3);
}
.wi-job{margin-top:9px;font-size:12px;color:var(--ink-3);line-height:1.7}
.wi-job .mini{display:block;margin-top:3px}

@media(max-width:640px){
  .wk-tab{flex:1 1 100%}
  .wk-list{grid-template-columns:1fr}
}

/* ---------- 「这些都是示例资料」提示条（人设卡页）---------- */
.demo-banner{margin-bottom:14px;display:flex;gap:12px;align-items:flex-start;flex-wrap:wrap}
.demo-banner .db-txt{flex:1 1 220px;min-width:0}
.demo-banner .btn{flex:0 0 auto}
@media(max-width:640px){
  /* 手机上按钮独占一行、占满宽度 —— 光靠 flex 挤在一行会贴着边，点起来也别扭 */
  .demo-banner .btn{flex:1 1 100%;justify-content:center}
}

/* ---------- 人设卡：行业下拉 + 旁边的「填入示例」 ----------
   行业放在第一个，选完就能一键填示例。窄屏自动折成上下两行。 */
.ind-pick{display:flex;gap:9px;align-items:stretch;flex-wrap:wrap}
.ind-pick select{flex:1 1 190px;min-width:0}
.ind-pick .btn{flex:0 0 auto;justify-content:center}
@media(max-width:640px){
  /* 手机上按钮占满一行，好点 */
  .ind-pick{gap:8px}
  .ind-pick select,.ind-pick .btn{flex:1 1 100%}
}

/* ---------- 手机端细节（≤640px）----------
   桌面版的这些地方在 390px 宽的手机上会挤：页头右侧按钮、策划背景条、人设卡。
   全部收在媒体查询里，不影响电脑上的排版。 */
@media(max-width:640px){
  /* 页头：标题独占一行，右侧按钮另起一行左对齐（不然会被挤出屏幕） */
  .crumb{gap:10px}
  .crumb .spacer{display:none}
  .crumb .page-title{font-size:17px}
  .page-actions{width:100%;justify-content:flex-start;gap:8px}
  /* 策划背景条：每个标签占整行，文字不截断 */
  .planbar{padding:11px 13px}
  .planbar .pt{width:100%}
  .planbar .pi{max-width:100%;flex:1 1 100%;white-space:normal;line-height:1.5}
  /* 底部行动条：按钮变大好点 */
  .actionbar{padding:12px 14px}
  .actionbar .btn,.actionbar .btn.primary{flex:1 1 auto;justify-content:center}
  /* 人设卡：一行一张，别两张挤在一起 */
  .mine .mcard{min-width:0;flex:1 1 100%}
  /* 卡片里的按钮：够大才点得中（苹果建议 ≥44px） */
  .card .bar .btn,.zbody .btn{flex:1 1 auto;justify-content:center}
  /* 表格：小屏横向滚动，不要被裁掉 */
  .card>.tbl,.card>table{display:block;overflow-x:auto;white-space:nowrap}
  /* 站点标题在手机上让位给账号按钮 */
  .brand small{display:none}
  /* 个人中心：余额数字不要挤在右边 */
  .pc-hero .pc-bal{text-align:left}
}


/* ==========================================================================
   纯文本版：把「（表演提示）」和台词区分开
   —— 提示是给拍的人看的，台词才是要念的，两者视觉上必须一眼分得清
   ========================================================================== */
.copy-block .pt-cue{
  display:inline;
  color:#a1741a;                    /* 琥珀色：和正文黑区分 */
  background:rgba(253,248,234,.9);  /* 极浅暖底，像便签 */
  font-size:12.5px;                 /* 比台词小一号 */
  font-style:italic;                /* 斜体：一眼看出是说明 */
  font-family:ui-monospace,"SF Mono",Consolas,"Courier New",monospace;  /* 等宽：更像场记标注 */
  padding:1px 6px;
  border-radius:6px;
  letter-spacing:.2px;
}
.copy-block .pt-line{display:block}
/* 台词行：正常字重，稍微加深一点保证对比 */
.copy-block .pt-say{color:var(--ink);font-weight:500}
/* 纯台词模式：提示整行隐藏 */
.copy-block.clean-only .pt-cue{display:none}
/* 顶部的小工具条 */
.copy-tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.copy-tools .mini{color:var(--ink4)}
.switch{
  display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;
  color:var(--ink3);cursor:pointer;user-select:none;
}
.switch input{width:auto;margin:0;cursor:pointer}


/* ==========================================================================
   顶栏「更多」下拉
   导航项加到 11 项后 1920 宽度也装不下，横向滚动用户发现不了，
   所以次要项收进下拉 —— 主项直接可见，次要项点一下就有。
   ========================================================================== */
.navmore{position:relative;display:flex;align-items:center}
.navmore-btn{
  display:flex;align-items:center;gap:6px;white-space:nowrap;border:0;background:none;cursor:pointer;
  border-radius:10px;padding:8px 11px;font-size:13.5px;font-weight:600;color:var(--ink2);
  min-height:38px;font-family:inherit;transition:background .16s,color .16s;
}
.navmore-btn:hover{background:var(--primary-05);color:var(--primary)}
.navmore-btn.on{background:var(--primary-10);color:var(--primary);font-weight:800}
.navmore-btn .caret{font-size:10px;opacity:.7}
.navmore-pop{
  /* 用 fixed 绕开 .topnav 的 overflow 裁剪（位置由 JS 设） */
  position:fixed;top:0;right:0;z-index:200;min-width:190px;
  background:#fff;border:1px solid var(--line);border-radius:var(--r2);
  box-shadow:var(--sh-lg);padding:7px;
  opacity:0;visibility:hidden;transform:translateY(-6px);transition:all .16s;
}
.navmore-pop.on{opacity:1;visibility:visible;transform:none}
.navmore-item{
  display:flex;align-items:center;gap:9px;padding:9px 11px;border-radius:9px;
  text-decoration:none;color:var(--ink2);font-size:13.5px;font-weight:600;white-space:nowrap;
}
.navmore-item:hover{background:var(--primary-05);color:var(--primary)}
.navmore-item.on{background:var(--primary-10);color:var(--primary);font-weight:800}
.navmore-item .ico{font-size:14px}

/* AI 状态条可点击（点了去个人中心的设置区） */
.ai-status{text-decoration:none;cursor:pointer;transition:all .16s}
/* 点了正在开的时候给个等待反馈，避免"点了没反应"的错觉 */
.ai-status.busy{opacity:.55;cursor:progress}
/* 从顶栏点进来时，AI 那一段闪一下，让人一眼看到开关在哪 */
.ai-flash{animation:aiFlash 2.4s ease-out}
@keyframes aiFlash{
  0%,100%{box-shadow:none}
  12%{box-shadow:0 0 0 3px rgba(28,92,171,.28)}
  70%{box-shadow:0 0 0 3px rgba(28,92,171,.18)}
}
.ai-status:hover{background:#fff;border-color:var(--primary-30);color:var(--primary)}
.ai-status.on{background:var(--green-l);color:var(--green);border-color:rgba(15,138,99,.28)}
.ai-status.on:hover{background:rgba(15,138,99,.14);border-color:rgba(15,138,99,.45)}


/* ==========================================================================
   自检状态徽章（取代原来的分数）
   原因：给分数会诱导用户反复重生成刷到 100 分 —— 每次都要调大模型花 token。
   改成状态：直接用 / 小问题（可免费修补）/ 需要改。
   ========================================================================== */
.qstate{
  display:flex;align-items:center;gap:12px;padding:13px 15px;border-radius:var(--r3);
  margin-bottom:14px;border:1px solid transparent;
}
.qs-badge{
  flex:0 0 auto;font-size:12.5px;font-weight:800;padding:5px 11px;border-radius:var(--r-full);
  white-space:nowrap;
}
.qs-txt{display:flex;flex-direction:column;gap:3px;min-width:0}
.qs-txt b{font-size:13.5px}
.qs-txt span{font-size:12.5px;line-height:1.6;opacity:.82}

.qstate.ready{background:rgba(46,125,50,.07);border-color:rgba(46,125,50,.22)}
.qstate.ready .qs-badge{background:var(--green);color:#fff}
.qstate.ready .qs-txt b{color:var(--green)}

.qstate.fixable{background:rgba(183,121,31,.07);border-color:rgba(183,121,31,.24)}
.qstate.fixable .qs-badge{background:#b7791f;color:#fff}
.qstate.fixable .qs-txt b{color:#8a5a15}

.qstate.retry{background:rgba(198,40,40,.06);border-color:rgba(198,40,40,.22)}
.qstate.retry .qs-badge{background:var(--red);color:#fff}
.qstate.retry .qs-txt b{color:var(--red)}


/* ==========================================================================
   专区页面版面（朋友圈 / 小红书 / 直播话术 / 爆款二创 共用）
   注意：类名用 .zwrap / .zgrid，避开首页已经占用的 .zone / .zone-grid
   组织方式：① 选类型 + ② 填要求 | 右栏人设背景  →  ③ 结果  →  生成历史
   ========================================================================== */
.zwrap{display:flex;flex-direction:column;gap:16px}
/* ⚠️ 这里是 stretch（不是 start）——
   三栏等高、底边对齐。用户反馈过"左边和右边两个框没对齐、粘贴框太小"：
   实测 左 560 / 中 347 / 右 475，中栏下面空一大块、文本框只有 96px。
   改成等高之后，中栏的文本框会自动长高把差额吃掉（见下面的 .zta 规则）。 */
.zgrid{display:grid;grid-template-columns:252px minmax(0,1fr) 266px;gap:16px;align-items:stretch}

.zcol,.zside{
  background:var(--card);border:1px solid var(--line-soft);border-radius:var(--r4);
  overflow:hidden;display:flex;flex-direction:column;min-width:0;box-shadow:var(--sh-xs);
}
.zside{background:linear-gradient(180deg,var(--primary-05),rgba(20,89,143,0) 120px),var(--card)}

.zhead{
  display:flex;align-items:center;gap:9px;padding:13px 16px;
  border-bottom:1px solid var(--line-soft);background:var(--warm);
  font-weight:700;font-size:13.5px;color:var(--ink);flex-shrink:0;
}
.znum{
  width:20px;height:20px;border-radius:6px;flex-shrink:0;
  background-image:var(--grad-primary);color:#fff;
  font-size:11.5px;font-weight:700;display:flex;align-items:center;justify-content:center;
}
.ztitle{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.zbody{padding:12px;display:flex;flex-direction:column;gap:9px;min-width:0}
.zscroll{overflow-y:auto;max-height:min(58vh,520px)}
/* 让 zbody 填满卡片，好让里面的文本框能"吃掉"多余的高度（三栏等高时才有多余高度）。
   min-height:0 是必须的 —— 不然 flex 子项的最小高度会撑破容器，滚动区就失效了。 */
.zgrid > .zcol > .zbody{flex:1 1 auto;min-height:0}

.zpicked{
  margin-top:2px;padding:9px 11px;border-radius:var(--r3);
  background:var(--primary-05);border:1px solid var(--primary-10);
  font-size:12.5px;color:var(--ink-2);
}
.zpicked b{color:var(--primary-d)}

.zempty{
  padding:16px 12px;border:1px dashed var(--line);border-radius:var(--r3);
  font-size:12.5px;color:var(--ink-3);line-height:1.75;text-align:center;
}
.zempty a{color:var(--primary-d);font-weight:600}

/* 右栏人设背景 */
.zsel{
  width:100%;padding:9px 11px;border:1px solid var(--line);border-radius:var(--r3);
  font-size:13px;font-family:inherit;background:#fff;color:var(--ink);box-sizing:border-box;
}
.zsel-fixed{background:var(--primary-05);font-weight:600}
.zkv{display:flex;gap:8px;align-items:baseline;font-size:12.5px;line-height:1.7;
  padding:7px 10px;background:var(--warm);border-radius:var(--r3)}
.zk{color:var(--ink-3);flex-shrink:0;width:56px}
.zv{color:var(--ink);word-break:break-word}
.zhint{
  margin-top:2px;padding:9px 11px;border-radius:var(--r3);
  background:var(--gold-l);border:1px solid rgba(161,116,26,.16);color:#8a6412;font-size:12px;line-height:1.7;
}

/* ② 里的表单元素 */
.zlabel{font-size:12.5px;font-weight:700;color:var(--ink);display:block;margin-bottom:-3px}
.zlabel i{color:var(--red);font-style:normal}
.zta{
  width:100%;min-height:96px;padding:11px 12px;border:1px solid var(--line);
  border-radius:var(--r3);font-family:inherit;font-size:13px;line-height:1.75;
  resize:vertical;box-sizing:border-box;color:var(--ink);
}
/* 粘贴框在三栏等高时自动长高（把中栏下面的空白吃掉）——
   用户要的就是"粘贴文案的框大一点"。下限 150px 保证即使没多余高度也够用。 */
.zgrid > .zcol > .zbody > .zta{flex:1 1 auto;min-height:150px}
.zta:focus{outline:none;border-color:var(--primary-a);box-shadow:0 0 0 3px var(--primary-10)}
.zta::placeholder{color:var(--ink-3)}
.zbtn-wide{width:100%;justify-content:center}

.opt-badge{
  margin-left:6px;padding:1px 6px;border-radius:99px;font-size:10.5px;font-style:normal;
  background:rgba(214,158,46,.16);color:#8a6412;font-weight:600;
}

/* 生成历史 */
.zhist-item{padding:10px 12px;border:1px solid var(--line-soft);border-radius:var(--r3);background:var(--warm)}
.zhist-t{font-size:13px;font-weight:600;color:var(--ink);margin-bottom:3px}
.zhist-m{font-size:11.5px;color:var(--ink-3)}

/* 窄屏：三栏折成单栏，右栏排到最前（先看人设背景） */
@media (max-width:1180px){
  .zgrid{grid-template-columns:1fr}
  .zgrid .zside{order:-1}
  .zscroll{max-height:none}
}

/* ---------- 拍摄指导卡片 ---------- */
.shootcard{
  margin-top:12px;padding:14px 16px;border-radius:var(--r3);
  background:#F4F8FC;border:1px solid #D6E2F0;
}
.shootcard .sc-h{font-size:14px;font-weight:700;color:var(--ink);margin-bottom:10px}
.shootcard .sc-h .mini{font-weight:400;color:var(--ink2)}
/* ⚠️ **不要用 flex**：一行里有多个 <b> 时，每个 <b> 会成为独立 flex 项，
   文字被拆得错位（"秒"和"不一定要露脸"被挤到下一行）。
   改成"第一个 <b> 当固定宽标签、其余照常内联流动"。 */
.shootcard .sc-row{
  font-size:13px;color:var(--ink2);line-height:1.95;margin-bottom:5px;
}
.shootcard .sc-row > b:first-child{
  display:inline-block;min-width:62px;color:var(--ink);
  font-weight:700;font-size:12.5px;
}
.shootcard .sc-row.ok{color:#1f6b3a}
.shootcard .sc-row.no{color:#a03a2a}
.shootcard .sc-note{
  margin-top:10px;padding-top:10px;border-top:1px dashed #CBD9E8;
  font-size:12px;color:#6b7c8f;
}
@media(max-width:640px){ .shootcard .sc-row{flex-direction:column;gap:0} }
/* ---------- 实拍上传卡片 ---------- */
.upcard{
  margin-top:10px;padding:14px 16px;border-radius:var(--r3);
  background:#FFF9F0;border:1px solid #F0DFC2;
}
.upcard .uc-h{font-size:14px;font-weight:700;color:var(--ink);margin-bottom:10px}
.upcard .uc-h .mini{font-weight:400;color:var(--ink2)}
.upcard .uc-row{font-size:13px;color:var(--ink2);line-height:1.9;margin-bottom:6px;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.upcard .uc-ok{color:#1f6b3a;font-weight:700}
.upcard .uc-idle{color:#8a7a5f}
.upcard .uc-err{margin-top:6px;padding:6px 10px;border-radius:6px;background:#FDECEA;color:#a03a2a;font-size:12.5px;line-height:1.6}

.upcard .uc-next{color:#8a5a1a;font-size:13px;font-weight:600;background:#FFF3DC;border:1px dashed #E8C88A;border-radius:8px;padding:8px 12px}

/* 免责声明勾选框：多行文字要顶端对齐，勾选框不跟着压缩 */
.upcard .uc-consent{align-items:flex-start;line-height:1.75;cursor:pointer;background:#fff;border:1px solid #EADFC8;border-radius:8px;padding:8px 10px;margin:2px 0 8px}
.upcard .uc-consent input{width:auto;margin-top:3px;flex:none}
.upcard .uc-consent span{flex:1 1 240px}
@media(max-width:640px){ .upcard .uc-consent{font-size:12.5px} }

/* ---------- 画面来源切换（模板 / 实拍）---------- */
.modesw{margin:14px 0 4px}
.modesw .ms-h{font-size:13px;font-weight:700;color:var(--ink);margin-bottom:8px}
.modesw .ms-row{display:flex;gap:10px;flex-wrap:wrap}
.ms-card{
  flex:1 1 200px;min-width:180px;text-align:left;cursor:pointer;
  border:2px solid #DDE5EE;background:#fff;border-radius:12px;
  padding:12px 14px;display:flex;flex-direction:column;gap:4px;
  font-family:inherit;transition:border-color .15s,background .15s;
}
.ms-card:hover{border-color:#9FB9D6}
.ms-card.on{border-color:var(--blue,#1F82F5);background:#F2F8FF;box-shadow:0 0 0 1px var(--blue,#1F82F5) inset}
.ms-card .ms-ico{font-size:18px;line-height:1}
.ms-card b{font-size:14px;color:var(--ink);font-weight:700}
.ms-card .ms-d{font-size:12px;color:var(--ink2);line-height:1.6}
.ms-card.on b{color:var(--blue,#1F82F5)}

/* 实拍版式预览（卡片 / 整屏） */
.real-layout-preview{position:relative;width:250px;height:444px;margin:8px 0 12px;border:1px solid #DDE5EE;border-radius:12px;overflow:hidden;background:#f8f1e2;font-family:var(--sans)}
.real-layout-preview .rlp-top{position:relative;z-index:2;padding:12px 14px 10px;background:#f8f1e2;border-bottom:2px solid #15242b}
.real-layout-preview .rlp-top span{display:block;font-size:9px;font-weight:800;color:#ff6b4a;letter-spacing:.14em;margin-bottom:3px}
.real-layout-preview .rlp-top b{display:block;font-size:13px;line-height:1.28;color:#15242b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.real-layout-preview .rlp-top b:nth-of-type(1){font-size:10px;color:#ff6b4a;font-weight:800;letter-spacing:.08em}
.real-layout-preview .rlp-media{position:absolute;left:0;right:0;top:112px;height:140px;border-top:3px solid #15242b;border-bottom:3px solid #15242b;border-left:0;border-right:0;background:#0e7c86;overflow:hidden;display:flex;align-items:center;justify-content:center;aspect-ratio:16/9}
.real-layout-preview .rlp-placeholder{text-align:center;color:#fff;font-size:11px;line-height:1.5;opacity:.95}
.real-layout-preview .rlp-placeholder span{display:block;font-size:30px;line-height:1;margin-bottom:6px}
.real-layout-preview .rlp-placeholder b{display:block;font-size:11px;font-weight:700}
.real-layout-preview .rlp-cap{position:absolute;left:18px;right:18px;bottom:52px;background:#15242b;color:#fff;font-size:10px;line-height:1.55;font-weight:700;padding:7px 8px;border-radius:2px}
.real-layout-preview .rlp-brand{position:absolute;left:18px;right:18px;bottom:16px;background:#b57834;color:#fff;text-align:center;font-size:10px;font-weight:800;padding:6px 4px;border:1px solid #15242b}
.real-layout-preview.is-card .rlp-media{top:112px;height:140px;border-radius:0}
.real-layout-preview.is-full .rlp-top{position:absolute;left:0;right:0;top:0;background:rgba(21,36,43,.72);border:none;padding:10px 12px}
.real-layout-preview.is-full .rlp-top span{color:#ffc94a}
.real-layout-preview.is-full .rlp-top b{color:#fff;font-size:14px}
.real-layout-preview.is-full .rlp-media{inset:0;height:auto;border:none;background:#0e7c86}
.real-layout-preview.is-full .rlp-cap{left:12px;right:12px;bottom:44px;background:rgba(21,36,43,.82);font-size:10px}
.real-layout-preview.is-full .rlp-brand{left:12px;right:12px;bottom:12px;font-size:10px}
@media(max-width:640px){.real-layout-preview{width:210px;height:373px}.real-layout-preview .rlp-media{height:220px;top:82px}}