/* 夜奇迹公众号内容生成中台 · 设计系统 */
:root{
  --ink:#14161c; --ink2:#2b2f3a; --sub:#6b7280; --mute:#9aa1ae;
  --navy:#101935; --navy2:#1c2b52; --navy3:#2c3e6b;
  --gold:#c9a26b; --gold2:#e0c79b;
  --paper:#f5f6f8; --card:#ffffff; --line:#e6e8ee; --line2:#eef0f4;
  --ok:#2f7a52; --ok-bg:#e8f3ed; --warn:#b07a12; --warn-bg:#fdf3e2; --bad:#b4342f; --bad-bg:#fbeceb;
  --info:#2a5fa8; --info-bg:#eaf1fb;
  --r:12px; --r2:16px;
  --sh:0 1px 2px rgba(16,25,53,.05), 0 4px 16px rgba(16,25,53,.06);
  --sh2:0 8px 32px rgba(16,25,53,.12);
  --grad:linear-gradient(135deg,#101935 0%,#2c3e6b 100%);
  --grad-gold:linear-gradient(135deg,#c9a26b 0%,#e6d1a8 100%);
}
*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%}
body{
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","HarmonyOS Sans SC","Microsoft YaHei",sans-serif;
  background:var(--paper); color:var(--ink); font-size:14px; line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}
::selection{background:rgba(201,162,107,.28)}

/* ===== 布局 ===== */
.app{display:flex;min-height:100vh}
.side{
  width:260px;flex:0 0 260px;background:var(--grad);color:#cfd6e6;
  display:flex;flex-direction:column;position:fixed;top:0;bottom:0;left:0;z-index:20;
}
.side-brand{
  padding:24px 20px 18px;
  border-bottom:1px solid rgba(255,255,255,.08);
  display:flex;align-items:center;gap:13px;
  background:
    radial-gradient(120% 80% at 0% 0%, rgba(201,162,107,.10) 0%, transparent 55%),
    linear-gradient(180deg, rgba(255,255,255,.035) 0%, rgba(255,255,255,0) 100%);
}
.side-brand .mark{
  width:44px;height:44px;border-radius:13px;
  background:linear-gradient(145deg,#101935 0%,#1a2a50 100%);
  display:flex;align-items:center;justify-content:center;
  color:var(--gold);font-weight:800;font-size:18px;letter-spacing:.5px;
  border:1.5px solid rgba(201,162,107,.45);
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,.12),
    0 2px 8px rgba(0,0,0,.22),
    0 0 18px rgba(201,162,107,.18);
  transition:transform .18s ease,box-shadow .18s ease;
  flex:0 0 auto;
}
.side-brand:hover .mark{
  transform:scale(1.04) translateY(-1px);
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,.16),
    0 4px 14px rgba(0,0,0,.28),
    0 0 26px rgba(201,162,107,.30);
}
.side-brand .brand-lines{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center}
.side-brand h1{
  font-size:16px;color:#fff;font-weight:700;letter-spacing:.3px;line-height:1.25;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  text-shadow:0 1px 2px rgba(0,0,0,.22);
}
.side-brand p{
  margin-top:5px;
  font-size:11.5px;color:rgba(207,214,230,.62);letter-spacing:.2px;line-height:1.5;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.side-brand p#brandProduct{
  color:var(--gold2);font-weight:500;
}
.side-brand p:empty{display:none}
.nav{padding:10px 10px;flex:1;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(201,162,107,.35) transparent}
.nav::-webkit-scrollbar{width:5px}
.nav::-webkit-scrollbar-track{background:transparent}
.nav::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,rgba(201,162,107,.30),rgba(201,162,107,.45));
  border-radius:3px;border:1px solid rgba(255,255,255,.06)
}
.nav::-webkit-scrollbar-thumb:hover{
  background:linear-gradient(180deg,rgba(201,162,107,.50),rgba(224,199,155,.62));
  box-shadow:0 0 12px rgba(201,162,107,.30)
}
.nav .cap{font-size:10.5px;color:rgba(207,214,230,.42);padding:12px 10px 6px;letter-spacing:1.2px}
.nav a{
  display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:9px;
  font-size:13.5px;color:rgba(207,214,230,.86);cursor:pointer;margin-bottom:2px;
  transition:background .16s,color .16s;position:relative;
}
.nav a:hover{background:rgba(255,255,255,.07);color:#fff}
.nav a.on{background:rgba(255,255,255,.13);color:#fff;font-weight:600}
.nav a.on::before{content:"";position:absolute;left:0;top:9px;bottom:9px;width:3px;border-radius:0 3px 3px 0;background:var(--gold)}
.nav a .ic{width:18px;text-align:center;font-size:14px;opacity:.9}
.nav a .bd{margin-left:auto;background:var(--gold);color:#101935;font-size:10.5px;font-weight:700;
  padding:1px 6px;border-radius:999px;min-width:18px;text-align:center}
.side-foot{padding:12px 18px;border-top:1px solid rgba(255,255,255,.08);font-size:11px;color:rgba(207,214,230,.45)}

.main{flex:1;margin-left:260px;min-width:0;display:flex;flex-direction:column}
.top{
  height:58px;background:rgba(255,255,255,.86);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);display:flex;align-items:center;gap:14px;
  padding:0 24px;position:sticky;top:0;z-index:15;
}
.top h2{font-size:16px;font-weight:700;letter-spacing:.3px}
.top .crumb{font-size:12px;color:var(--mute)}
.top .right{margin-left:auto;display:flex;align-items:center;gap:10px}
.page{padding:22px 24px 60px;flex:1}

/* ===== 通用组件 ===== */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:18px 20px;margin-bottom:16px}
.card.tight{padding:14px 16px}
.card-h{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.card-h h3{font-size:15px;font-weight:700}
.card-h .sub{font-size:12px;color:var(--mute);font-weight:400}
.card-h .r{margin-left:auto;display:flex;gap:8px;align-items:center}
.card-h.clickable{cursor:pointer;position:relative;transition:.18s}
.card-h.clickable:hover h3{color:var(--navy3)}
.card-h.clickable:hover .sub{color:var(--sub)}
.card-h.clickable .arrow{position:absolute;right:0;top:2px;font-size:13px;color:var(--mute);opacity:0;transition:.18s}
.card-h.clickable:hover .arrow{opacity:1;color:var(--gold)}
.sec-t{font-size:13px;font-weight:700;color:var(--ink2);margin:20px 0 10px;display:flex;align-items:center;gap:8px}
.sec-t:first-child{margin-top:0}
.sec-t::before{content:"";width:3px;height:13px;border-radius:2px;background:var(--gold)}

/* 版块内子项切换：把同类卡片合并进同一版块后，用它切换子项（目前用于 IM 互通） */
.subnav{display:flex;gap:4px;flex-wrap:wrap;padding:4px;margin-bottom:14px;background:var(--paper);
  border:1px solid var(--line2);border-radius:10px}
.subnav .sbtn{border:1px solid transparent;background:transparent;color:var(--sub);font:inherit;
  font-size:12.5px;font-weight:600;padding:5px 12px;border-radius:7px;cursor:pointer;transition:.16s;
  display:inline-flex;align-items:center;gap:5px}
.subnav .sbtn:hover{background:rgba(255,255,255,.85);color:var(--ink)}
.subnav .sbtn.on{background:#fff;border-color:var(--line);color:var(--navy);
  box-shadow:0 1px 5px rgba(16,25,53,.10)}
.subnav .sbtn .n{color:var(--gold);font-weight:700}
.subpane>.card-h{border-bottom:1px dashed var(--line2);padding-bottom:10px;margin-bottom:12px}
.subpane>.card-h h3{font-size:14px}

.btn{
  display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:9px;
  border:1px solid var(--line);background:#fff;font-size:13px;cursor:pointer;
  transition:.16s;white-space:nowrap;font-weight:500;
}
.btn:hover{border-color:#cfd4de;background:#fafbfc}
.btn.pri{background:var(--grad);border-color:transparent;color:#fff;box-shadow:0 2px 10px rgba(16,25,53,.22)}
.btn.pri:hover{filter:brightness(1.12)}
.btn.gold{background:var(--grad-gold);border-color:transparent;color:#101935;font-weight:600}
.btn.gold:hover{filter:brightness(1.06)}
.btn.sm{padding:4px 10px;font-size:12px;border-radius:7px}
.btn.danger{color:var(--bad);border-color:#f0d3d2}
.btn.danger:hover{background:var(--bad-bg)}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn.ghost{border-color:transparent;background:transparent;color:var(--sub)}
.btn.ghost:hover{background:#f2f4f7}

.inp,.sel,.ta{
  width:100%;padding:8px 11px;border:1px solid var(--line);border-radius:9px;background:#fff;
  font-size:13px;transition:.16s;outline:none;
}
.inp:focus,.sel:focus,.ta:focus{border-color:var(--navy3);box-shadow:0 0 0 3px rgba(44,62,107,.10)}
.ta{min-height:110px;resize:vertical;line-height:1.75;font-family:inherit}
.sel{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6'><path d='M1 1l4 4 4-4' fill='none' stroke='%236b7280' stroke-width='1.5' stroke-linecap='round'/></svg>");
  background-repeat:no-repeat;background-position:right 11px center;padding-right:30px}
label.fl{display:block;font-size:12px;color:var(--sub);margin-bottom:5px;font-weight:500}
.field{margin-bottom:12px}
.row{display:flex;gap:12px;flex-wrap:wrap}
.row>*{flex:1;min-width:0}

.tag{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;padding:2px 9px;border-radius:999px;
  background:#f2f4f7;color:var(--sub);border:1px solid var(--line2);white-space:nowrap}
.tag.gold{background:rgba(201,162,107,.14);color:#8a6b32;border-color:rgba(201,162,107,.35)}
.tag.navy{background:rgba(16,25,53,.07);color:var(--navy3);border-color:rgba(16,25,53,.14)}
.tag.ok{background:var(--ok-bg);color:var(--ok);border-color:#cfe6d9}
.tag.warn{background:var(--warn-bg);color:var(--warn);border-color:#f2e2c2}
.tag.bad{background:var(--bad-bg);color:var(--bad);border-color:#f0d3d2}
.tag.info{background:var(--info-bg);color:var(--info);border-color:#d5e3f6}

.grid{display:grid;gap:14px}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
.g5{grid-template-columns:repeat(5,1fr)}
@media(max-width:1100px){.g4{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(2,1fr)}}
@media(max-width:1240px){.g5{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){.g2,.g3,.g4{grid-template-columns:1fr}.g5{grid-template-columns:repeat(2,1fr)}}

.stat{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;box-shadow:var(--sh);position:relative}
.stat .k{font-size:12px;color:var(--mute)}
.stat .v{font-size:24px;font-weight:700;letter-spacing:-.5px;margin-top:2px}
.stat .v small{font-size:12px;font-weight:500;color:var(--mute);margin-left:3px}
.stat-link{cursor:pointer;transition:.18s}
.stat-link:hover{border-color:var(--gold);background:linear-gradient(135deg,#fffdf9,#fff);box-shadow:var(--sh2)}
.stat-link:hover .k{color:var(--navy3)}
.stat-link:hover .v{color:var(--navy)}
.stat-link .arrow{position:absolute;right:12px;top:12px;font-size:13px;color:var(--mute);opacity:0;transition:.18s}
.stat-link:hover .arrow{opacity:1;color:var(--gold)}

/* 今日数据看板 */
.mstat{min-height:98px;display:flex;flex-direction:column;justify-content:center}
.mstat .v.na{font-size:15px;font-weight:600;color:var(--mute);margin-top:5px}
.trend{font-size:11.5px;margin-top:5px;color:var(--mute);letter-spacing:.2px}
.trend.up{color:#b4342f;font-weight:600}
.trend.down{color:#2f7a52;font-weight:600}
.trend.na{color:var(--mute)}
.num-in{max-width:112px;padding:5px 8px;font-size:12.5px}
.note.warn-note{border-left-color:var(--warn);background:var(--warn-bg);color:#7a5510}
.cmd-out{background:#fafbfc;border:1px solid var(--line2);border-radius:10px;padding:12px 14px;
  font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12.5px;line-height:1.8;
  white-space:pre-wrap;word-break:break-word;max-height:320px;overflow:auto}

/* 创建向导步骤 */
.wiz-step{display:flex;gap:10px;padding:9px 0;border-bottom:1px dashed var(--line2);align-items:flex-start}
.wiz-step:last-child{border-bottom:none}
.wiz-n{flex:0 0 22px;height:22px;border-radius:50%;background:var(--navy);color:#fff;
  font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;margin-top:1px}
.wiz-step .b{font-weight:600}
.wiz-step:nth-child(n+7) .wiz-n{background:var(--gold);color:#3a2c12}

table{width:100%;border-collapse:collapse;font-size:13px}
th,td{padding:9px 10px;text-align:left;border-bottom:1px solid var(--line2);vertical-align:top}
th{font-size:12px;color:var(--sub);font-weight:600;background:#fafbfc}
tbody tr:hover{background:#fafbfc}
.tbl-wrap{overflow-x:auto}

.empty{padding:44px 20px;text-align:center;color:var(--mute);font-size:13px}
.empty .big{font-size:30px;opacity:.35;margin-bottom:8px}

/* 进度条 */
.bar{height:5px;border-radius:3px;background:#eef0f4;overflow:hidden}
.bar>i{display:block;height:100%;background:var(--grad);border-radius:3px;transition:width .3s}
.bar.gold>i{background:var(--grad-gold)}

/* 阶段化任务 */
.stages{display:flex;flex-direction:column;gap:0}
.stage{display:flex;gap:12px;position:relative;padding-bottom:16px}
.stage:last-child{padding-bottom:0}
.stage .dot{width:22px;height:22px;border-radius:50%;flex:0 0 22px;display:flex;align-items:center;justify-content:center;
  font-size:11px;font-weight:700;background:#eef0f4;color:var(--mute);z-index:1;margin-top:1px}
.stage.done .dot{background:var(--ok);color:#fff}
.stage.running .dot{background:var(--grad);color:#fff;animation:pulse 1.1s infinite}
.stage.failed .dot{background:var(--bad);color:#fff}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(44,62,107,.4)}70%{box-shadow:0 0 0 8px rgba(44,62,107,0)}100%{box-shadow:0 0 0 0 rgba(44,62,107,0)}}
.stage:not(:last-child)::before{content:"";position:absolute;left:10.5px;top:22px;bottom:0;width:1.5px;background:var(--line)}
.stage.done:not(:last-child)::before{background:var(--ok)}
.stage .nm{font-size:13px;font-weight:600}
.stage .pm{font-size:12px;color:var(--mute);margin-top:1px}
.stage.running .pm{color:var(--navy3);font-weight:500}

/* 注入效果预览：结构化卡片（原来是一坨纯文本，看不懂） */
.dg-sum{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:space-between;background:#f7f8fa;border:1px solid var(--line2);border-radius:10px;padding:9px 12px;margin-bottom:12px;font-size:12.5px;color:var(--sub)}
.dg-group{margin-bottom:12px}
.dg-group:last-child{margin-bottom:0}
.dg-g-h{display:flex;align-items:center;gap:8px;margin:4px 0 8px}
.dg-item{border:1px solid var(--line2);border-left:3px solid var(--navy3);border-radius:9px;background:#fff;padding:10px 13px;margin-bottom:8px}
.dg-item:last-child{margin-bottom:0}
.dg-h{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:5px}
.dg-t{font-weight:600;font-size:13.5px;color:var(--ink,#1c2333)}
.dg-meta{font-size:11.5px;color:var(--sub);margin-left:auto;white-space:nowrap}
.dg-body{font-size:12.5px;line-height:1.75;color:#3a4358;white-space:pre-wrap;word-break:break-word}
.dg-lines{font-size:12.5px;line-height:1.7;color:#3a4358}
.dg-line{position:relative;padding:2px 0 2px 13px}
.dg-line::before{content:"";position:absolute;left:2px;top:11px;width:4px;height:4px;border-radius:50%;background:var(--navy3);opacity:.55}
.dg-line + .dg-line{border-top:1px dashed var(--line2)}

/* 「别人刚更新了数据 · 刷新」提示条：只在非自动刷新的页面上出现，
   底部居中、不挡内容，点一下重载当前页 */
.sync-bar{position:fixed;left:50%;transform:translateX(-50%);bottom:20px;z-index:150;
  display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:999px;
  background:#fff;border:1px solid var(--line);box-shadow:0 6px 22px rgba(16,25,53,.16);
  font-size:13px;color:var(--ink)}

/* 进度卡（runBox）跑完 / 失败的收尾态：跑完自动折叠收起，失败留在页面上说清原因 */
.card.runbox-done{border-color:rgba(47,122,82,.35);background:var(--ok-bg)}
.card.runbox-done .card-h h3{color:var(--ok)}
.card.runbox-fail{border-color:rgba(180,52,47,.35);background:var(--bad-bg)}
.card.runbox-fail .card-h h3{color:var(--bad)}

/* 提示词试运行结果：选题类输出渲染成中文卡片，不再是一坨 JSON/代码 */
.rnitems{display:flex;flex-direction:column;gap:8px}
.rnitem{border:1px solid var(--line2);border-radius:10px;padding:10px 12px;background:#fff}
.rnitem .hd{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.rnitem .hd .no{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;
  border-radius:50%;background:var(--grad);color:#fff;font-size:11.5px;font-weight:700;flex:0 0 20px}
.rnitem .hd b{font-size:13.5px}
.rnitem .small{color:var(--ink2)}
.rnitem .small.muted{color:var(--mute)}

/* 提示条 */
.note{background:#fafbfc;border:1px solid var(--line2);border-left:3px solid var(--gold);
  padding:9px 13px;border-radius:0 8px 8px 0;font-size:12.5px;color:#6b5b3e;margin:10px 0}
.note.bad{border-left-color:var(--bad);background:var(--bad-bg);color:#8c2f2b}
.note.ok{border-left-color:var(--ok);background:var(--ok-bg);color:#276140}
.note.info{border-left-color:var(--info);background:var(--info-bg);color:#25508f}

/* 弹层 */
.mask{position:fixed;inset:0;background:rgba(16,25,53,.42);backdrop-filter:blur(2px);z-index:100;
  display:flex;align-items:center;justify-content:center;padding:20px}
.modal{background:#fff;border-radius:var(--r2);box-shadow:var(--sh2);width:100%;max-width:680px;
  max-height:86vh;display:flex;flex-direction:column;overflow:hidden}
.modal.wide{max-width:940px}
.modal-h{padding:16px 20px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:10px}
.modal-h h3{font-size:15px;font-weight:700}
.modal-h .x{margin-left:auto;cursor:pointer;color:var(--mute);font-size:18px;line-height:1;padding:2px 6px;border-radius:6px}
.modal-h .x:hover{background:#f2f4f7;color:var(--ink)}
.modal-b{padding:18px 20px;overflow-y:auto;flex:1}
.modal-f{padding:12px 20px;border-top:1px solid var(--line);display:flex;gap:10px;justify-content:flex-end;background:#fafbfc}

/* toast */
.toasts{position:fixed;top:16px;right:20px;z-index:200;display:flex;flex-direction:column;gap:8px}
.toast{background:#fff;border:1px solid var(--line);border-left:3px solid var(--ok);
  box-shadow:var(--sh2);border-radius:10px;padding:10px 16px;font-size:13px;min-width:190px;
  animation:slidein .22s ease}
.toast.bad{border-left-color:var(--bad)}
.toast.info{border-left-color:var(--info)}
@keyframes slidein{from{opacity:0;transform:translateX(16px)}to{opacity:1;transform:none}}

/* 选题卡 */
.topic{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;
  transition:.18s;position:relative;box-shadow:var(--sh)}
.topic:hover{box-shadow:var(--sh2);border-color:#d8dce4}
.topic.sel{border-color:var(--gold);background:linear-gradient(180deg,rgba(201,162,107,.06),#fff)}
.topic .hd{display:flex;gap:10px;align-items:flex-start}
.topic .tt{font-size:14.5px;font-weight:700;line-height:1.5;flex:1}
.topic .an{font-size:12.5px;color:var(--sub);margin-top:6px}
.topic .ft{display:flex;align-items:center;gap:8px;margin-top:10px;flex-wrap:wrap}
.chk{
  width:17px;height:17px;border:1.6px solid #c9cfd9;border-radius:5px;cursor:pointer;flex:0 0 17px;
  display:flex;align-items:center;justify-content:center;background:#fff;transition:.15s;margin-top:2px;
}
.chk:hover{border-color:var(--navy3)}
.chk.on{background:var(--grad);border-color:transparent;color:#fff;font-size:11px}
.score{font-weight:700;font-size:13px}
.score.hi{color:var(--ok)}.score.mid{color:var(--warn)}.score.lo{color:var(--bad)}

/* 账号卡 */
.acard{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;box-shadow:var(--sh);
  position:relative;overflow:hidden;transition:.18s}
.acard:hover{box-shadow:var(--sh2);transform:translateY(-1px)}
.acard::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--grad)}
.acard.paused::before{background:#c9cfd9}
.acard .nm{font-size:15px;font-weight:700;display:flex;align-items:center;gap:8px}
.acard .mt{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px}
.acard .mt .stat-col{display:block;background:#fafbfc;border-radius:8px;padding:7px 9px;text-align:center;color:inherit;text-decoration:none;cursor:pointer;transition:.15s}
.acard .mt .stat-col:hover{background:#eef1f5;transform:translateY(-1px);box-shadow:0 2px 6px rgba(0,0,0,.05)}
.acard .mt .n{font-size:16px;font-weight:700}
.acard .mt .l{font-size:11px;color:var(--mute)}

/* 提示词 */
.pgroup{margin-bottom:6px}
.pgroup-h{display:flex;align-items:center;gap:10px;padding:11px 14px;background:#fafbfc;border:1px solid var(--line);
  border-radius:10px;cursor:pointer;font-weight:600;font-size:13.5px}
.pgroup-h:hover{background:#f5f7fa}
.pgroup-h .ar{font-size:11px;color:var(--mute);width:10px;flex:0 0 10px}
.pgroup-h .cnt{margin-left:auto;font-size:11.5px;color:var(--mute);font-weight:400}
.pgroup-b{border:1px solid var(--line);border-top:none;border-radius:0 0 10px 10px;padding:4px}
.pitem{display:flex;align-items:center;gap:10px;padding:9px 12px;border-bottom:1px solid var(--line2);cursor:pointer}
.pitem:last-child{border-bottom:none}
.pitem:hover{background:#fafbfc}
.pitem .nm{font-size:13.5px;font-weight:500}
.pitem .ds{font-size:12px;color:var(--mute)}
.pitem .r{margin-left:auto;display:flex;gap:6px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.pkey{font-size:11px;background:transparent;border:1px dashed var(--line);padding:0 5px;border-radius:4px;color:var(--mute);font-family:ui-monospace,Menlo,Consolas,monospace}
.plegend{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.vchip{font-size:11px;background:#f2f4f7;border:1px solid var(--line2);padding:2px 6px;border-radius:4px;
  color:#5c6370;font-family:ui-monospace,Menlo,Consolas,monospace;cursor:pointer;transition:.15s}
.vchip:hover{border-color:var(--navy3);color:var(--navy3);background:#fff}
.vchip.on{background:var(--ok-bg);border-color:#cfe6d9;color:var(--ok)}
.pver{border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin-top:10px;background:#fafbfc}
.pvpre{margin:8px 0 0;max-height:220px;overflow:auto;background:#fff;border:1px solid var(--line2);border-radius:8px;
  padding:10px;font-size:11.5px;line-height:1.7;white-space:pre-wrap;word-break:break-all;
  font-family:ui-monospace,Menlo,Consolas,monospace}
.rnpre{margin:8px 0 0;max-height:260px;overflow:auto;background:#fafbfc;border:1px solid var(--line2);border-radius:8px;
  padding:10px;font-size:11.5px;line-height:1.7;white-space:pre-wrap;word-break:break-all;
  font-family:ui-monospace,Menlo,Consolas,monospace}
.rnres{max-height:320px;overflow:auto;background:#fff;border:1px solid var(--line);border-radius:8px;
  padding:12px;font-size:13px;line-height:1.85;white-space:pre-wrap;word-break:break-word}
.rw-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:10px}
@media(max-width:700px){.rw-grid{grid-template-columns:repeat(2,1fr)}}
.rwbtn{justify-content:center;padding:8px 4px}
.rwitem{border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin-top:10px;background:#fafbfc}
.rwitem:hover{background:#fff;border-color:var(--line2)}
.rwtext{font-size:13.5px;line-height:1.8;white-space:pre-wrap;word-break:break-word}
.vars{display:flex;gap:4px;flex-wrap:wrap;margin-top:4px}
.vars code{font-size:11px;background:#f2f4f7;border:1px solid var(--line2);padding:0 5px;border-radius:4px;color:#5c6370;font-family:ui-monospace,Menlo,Consolas,monospace}

/* 写作台 */
.editor{display:grid;grid-template-columns:300px 1fr;gap:16px}
@media(max-width:1000px){.editor{grid-template-columns:1fr}}
.ed-side .card{padding:14px}
.md-body{font-size:14.5px;line-height:1.9}

/* ===== 写作台：流程步骤条 ===== */
.wsteps{
  display:flex;align-items:center;gap:6px;flex-wrap:wrap;
  background:var(--card);border:1px solid var(--line);border-radius:var(--r);
  padding:12px 14px;margin-bottom:14px;box-shadow:var(--sh);
}
.wstep{
  display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:20px;
  font-size:13px;color:var(--sub);background:var(--paper);border:1px solid transparent;
  cursor:pointer;transition:.18s;user-select:none;
}
.wstep:hover{border-color:var(--gold);color:var(--navy)}
.wstep .n{
  width:22px;height:22px;flex:0 0 22px;border-radius:50%;
  background:#dfe3ea;color:#7a8290;display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:700;transition:.18s;
}
.wstep.done{color:var(--navy);background:var(--ok-bg)}
.wstep.done .n{background:var(--ok);color:#fff}
.wstep.active{
  background:linear-gradient(135deg,rgba(201,162,107,.18),rgba(224,199,155,.18));
  border-color:var(--gold);color:var(--navy);font-weight:600;
}
.wstep.active .n{background:var(--grad-gold);color:#101935}
.wstep-line{flex:0 0 12px;height:2px;background:var(--line);border-radius:2px}
.wstep-line.done{background:var(--ok)}
.wsteps .tail{margin-left:auto;font-size:12px;color:var(--mute)}

.md-body h1,.md-body h2,.md-body h3,.md-body h4{font-weight:700;margin:18px 0 8px;line-height:1.45}
.md-body h1{font-size:19px}.md-body h2{font-size:17px}.md-body h3{font-size:15.5px}
.md-body p{margin:0 0 12px}
.md-body ul,.md-body ol{padding-left:22px;margin:0 0 12px}
.md-body blockquote{border-left:3px solid var(--gold);background:#faf7f2;padding:8px 14px;margin:0 0 12px;color:#6b5b3e;border-radius:0 6px 6px 0}
.md-body code{background:#f2f4f7;padding:1px 5px;border-radius:4px;font-size:13px}

/* 公众号排版稿：左侧手机预览 + 右侧 HTML */
.hidden{display:none !important}
#wPhoneCard{position:sticky;top:74px;z-index:5}
#wPhoneCard .phone-frame{
  width:280px;height:520px;max-width:100%;margin:0 auto;border:10px solid #1f2430;border-radius:34px;overflow:hidden;
  background:#000;box-shadow:var(--sh2);position:relative
}
#wPhoneCard .phone-frame iframe{width:100%;height:100%;border:0;background:#fff}
.layout-html{min-width:0}
#wLayoutTpl{min-width:120px}

.gate{border:1px solid var(--line);border-radius:10px;margin-bottom:10px;overflow:hidden}
.gate-h{display:flex;align-items:center;gap:9px;padding:10px 14px;background:#fafbfc;font-size:13.5px;font-weight:600}
.gate-h .st{margin-left:auto}
.gate-b{padding:10px 14px;font-size:12.5px}
.gate-b .iss{display:flex;gap:8px;padding:5px 0;border-bottom:1px dashed var(--line2)}
.gate-b .iss:last-child{border-bottom:none}
.gate-b .iss .ty{flex:0 0 auto;font-weight:600;color:var(--ink2)}
.gate-b .iss .wh{color:var(--sub)}
.gate-b .iss .sg{margin-left:auto;color:var(--ok);text-align:right;max-width:40%}
.gate-b .iss .ops{flex:0 0 auto;display:flex;gap:6px;align-items:center}
.gate-b .iss .ops .btn{padding:2px 10px;font-size:11.5px}
.gate-b .iss{align-items:center;flex-wrap:wrap}

/* QC 完成后的折叠摘要 */
.qc-summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;background:#fafbfc;border:1px solid var(--line);border-radius:10px;margin-bottom:10px}
.qc-sum-l{display:flex;align-items:center;gap:8px;flex-wrap:wrap}

/* 对照 */
.cmp{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:860px){.cmp{grid-template-columns:1fr}}
.cmp>div{border:1px solid var(--line);border-radius:10px;padding:12px 14px;background:#fafbfc}
.cmp>div.ai{background:linear-gradient(180deg,rgba(201,162,107,.07),#fafbfc);border-color:rgba(201,162,107,.4)}
.cmp h5{font-size:12px;color:var(--mute);margin-bottom:6px;font-weight:600;letter-spacing:.3px}
.cmp .tx{font-size:13px;white-space:pre-wrap;line-height:1.8}

.split{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:stretch}
@media(max-width:900px){.split{grid-template-columns:1fr}}
.split>.col{display:flex;flex-direction:column;min-height:0;gap:16px}
.split .card{flex:1;display:flex;flex-direction:column;min-height:0;overflow:hidden}
.split .card-body{flex:1;overflow-y:auto;min-height:0;max-height:320px;padding-right:4px}
.split .card-body::-webkit-scrollbar{width:4px}
.split .card-body::-webkit-scrollbar-thumb{background:var(--line);border-radius:2px}

.kv{display:flex;gap:8px;font-size:12.5px;padding:4px 0;border-bottom:1px dashed var(--line2)}
.kv:last-child{border-bottom:none}
.kv .k{color:var(--mute);flex:0 0 88px}
.kv .v{flex:1;word-break:break-all}
.kv.run-row .k{flex:0 0 auto;min-width:74px;white-space:nowrap}

.mono{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12.5px}
.hl{background:rgba(201,162,107,.3);padding:0 2px;border-radius:3px}
.scroll{overflow-y:auto}
.nowrap{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.muted{color:var(--mute)}
.small{font-size:12px}
.b{font-weight:700}
.mt8{margin-top:8px}.mt12{margin-top:12px}.mt16{margin-top:16px}
.flex{display:flex;gap:8px;align-items:center}
.sp{margin-left:auto}
.mb{margin-bottom:8px}

/* ===== 配图：方案卡片 ===== */
.imgslot{background:#fff;border:1px solid var(--line2);border-radius:12px;padding:14px 16px;margin-bottom:12px;box-shadow:var(--sh)}
.imgslot:last-of-type{margin-bottom:0}
.imgslot-h{display:flex;align-items:center;gap:8px;margin-bottom:10px;flex-wrap:wrap}
.imgslot-h .b{font-size:14px;font-weight:700}
.imgslot-h .r{margin-left:auto;display:flex;gap:6px;align-items:center}
.imgslot-b{display:flex;gap:14px;align-items:flex-start}
.imgslot-pv{
  flex:0 0 260px;max-width:45%;aspect-ratio:2.35/1;background:var(--paper);
  border:1px solid var(--line);border-radius:10px;display:flex;align-items:center;justify-content:center;
  overflow:hidden;cursor:pointer;transition:.18s
}
.imgslot-pv:hover{border-color:var(--gold);box-shadow:var(--sh2);background:#fffdf9}
.imgslot-pv .imgpv{
  width:100%;height:100%;object-fit:cover;display:block;border-radius:10px
}
.imgslot-pv .imgpv[src$='.svg']{object-fit:contain;padding:8px;background:#fff}
.imgslot-pv.err{background:var(--bad-bg);border-color:var(--bad)}
.imgslot-pv.err .imgpv{display:none}
.imgslot-pv.err::after{content:"图片加载失败";color:var(--bad);font-size:12px}
.imgslot-info{flex:1;min-width:0}
.imgslot-info .mt8{display:flex;gap:6px;flex-wrap:wrap}
@media(max-width:820px){.imgslot-b{flex-direction:column}.imgslot-pv{flex:none;width:100%}}
.img-scroll{max-height:620px;overflow:auto;padding-right:4px}
.img-scroll::-webkit-scrollbar{width:6px}
.img-scroll::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px}

/* ===== 配图：图库网格 ===== */
.img-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(212px,1fr));gap:14px}
.img-card{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;box-shadow:var(--sh);
  display:flex;flex-direction:column;transition:.18s}
.img-card:hover{border-color:var(--gold);box-shadow:var(--sh2)}
.img-card .pv{height:132px;background:var(--paper);cursor:pointer;overflow:hidden;display:flex;align-items:center;justify-content:center}
.img-card .pv img{width:100%;height:100%;object-fit:cover;display:block}
.img-card .pv img[src$='.svg']{object-fit:contain;padding:6px;background:#fff}
.img-card .info{padding:10px 12px 12px;display:flex;flex-direction:column;gap:6px;flex:1}
.img-card .nm{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.img-card .tags{display:flex;gap:4px;flex-wrap:wrap}
.img-card .acts{display:flex;gap:6px;margin-top:auto;padding-top:6px}

/* ===== 素材库：行可点击 + 超出滚动 ===== */
.mat-table tbody tr.mat-row{cursor:pointer;transition:.18s}
.mat-table tbody tr.mat-row:hover{background:#f3f6fb}
.mat-scroll{position:relative}
.mat-scroll thead th{position:sticky;top:0;background:#fafbfc;z-index:2;box-shadow:0 1px 0 var(--line2)}
.mat-scroll::-webkit-scrollbar{width:6px}
.mat-scroll::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px}
/* 表头与内容居中对齐；素材列、受影响选题列保留左对齐 */
.mat-table th,.mat-table td{text-align:center;vertical-align:middle}
.mat-table th:first-child,.mat-table td:first-child,
.mat-table th:nth-child(6),.mat-table td:nth-child(6){text-align:left}

/* ===== 写作台：第6步确认条 + 第7步终稿预览 ===== */
.final-confirm{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:12px;padding:12px 14px;border:1px dashed var(--line);border-radius:12px;background:var(--paper)}
.final-confirm.ok{border-style:solid;border-color:rgba(47,122,82,.35);background:var(--ok-bg)}
.final-confirm .btn{margin-left:auto}
.final-card{margin:12px 0;padding:14px 16px;border:1px solid var(--line2);border-radius:12px;background:linear-gradient(180deg,#fffdf9,#fff);box-shadow:var(--sh)}
.final-card .fc-h{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.final-card .fc-h .b{font-size:15px;font-weight:700}
.final-card .fc-h .sp{margin-left:auto}
.final-card .fc-pv{margin-top:8px;font-size:13px;line-height:1.8;color:var(--mute);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

/* ===== 终稿资产池 ===== */
.fin-card{margin-bottom:12px;transition:.18s}
.fin-card:hover{border-color:var(--gold);box-shadow:var(--sh2)}

/* ===== 品牌 LOGO（首字 / 文字 / 图片） ===== */
/* 图片形态：方块内铺满，按圆角裁掉直角 */
.side-brand .mark.is-image{overflow:hidden;padding:0}
.side-brand .mark.is-image img{
  width:100%;height:100%;object-fit:cover;display:block;border-radius:11px;
}
/* 设置页预览方块：与侧边栏同款，放大到 64px 便于看清 */
.logo-edit{display:flex;gap:18px;align-items:flex-start;flex-wrap:wrap}
.logo-edit .mark{
  width:64px;height:64px;border-radius:16px;flex:0 0 auto;overflow:hidden;
  background:linear-gradient(145deg,#101935 0%,#1a2a50 100%);
  display:flex;align-items:center;justify-content:center;
  color:var(--gold);font-weight:800;font-size:26px;letter-spacing:.5px;
  border:1.5px solid rgba(201,162,107,.45);
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,.12),
    0 2px 8px rgba(0,0,0,.22),
    0 0 18px rgba(201,162,107,.18);
}
.logo-edit .mark img{width:100%;height:100%;object-fit:cover;display:block}
.logo-edit .mark .logo-empty{font-size:11px;font-weight:500;color:var(--mute)}
.logo-edit-main{flex:1;min-width:240px}
.logo-file-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
/* 表单里的辅助说明（只作用于 field 内，不影响卡片标题旁的 .sub） */
.field .sub{display:block;margin-top:5px;font-size:11.5px;line-height:1.6;color:var(--mute)}
.field .sub b{color:var(--sub);font-weight:600}

/* ---------- 多人协作：右上角当前成员 ---------- */
.me{display:flex;align-items:center;gap:8px;padding-left:12px;margin-left:2px;border-left:1px solid var(--line)}
.me-av{width:30px;height:30px;border-radius:50%;background:var(--grad);color:#fff;font-size:13px;font-weight:700;
  display:flex;align-items:center;justify-content:center;flex:0 0 auto;box-shadow:0 2px 6px rgba(16,25,53,.25)}
.me-txt{display:flex;flex-direction:column;line-height:1.25}
.me-txt b{font-size:12.5px;font-weight:600}
.me-txt span{font-size:11px;color:var(--mute)}

/* ---------- 成员管理 ---------- */
.ucard{display:flex;align-items:flex-start;gap:12px;padding:12px 0;border-bottom:1px dashed var(--line2)}
.ucard:last-child{border-bottom:none}
.ucard.off{opacity:.55}
.uav{width:40px;height:40px;border-radius:12px;flex:0 0 auto;background:linear-gradient(145deg,#101935,#1a2a50);
  color:var(--gold);font-weight:800;font-size:16px;display:flex;align-items:center;justify-content:center}
.umain{flex:1;min-width:0}
.unm{font-size:14px;font-weight:700;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.usub{font-size:12px;color:var(--mute);margin-top:3px}
.uact{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end;max-width:230px}
@media(max-width:900px){.uact{max-width:none}}

/* 权限勾选：两列网格，勾选框 + 名称 + 说明 */
.perm-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:6px 12px;margin-bottom:6px}
@media(max-width:760px){.perm-grid{grid-template-columns:1fr}}
.perm-item{display:flex;align-items:flex-start;gap:8px;padding:7px 10px;border:1px solid var(--line2);
  border-radius:9px;background:#fafbfc;cursor:pointer;transition:.15s}
.perm-item:hover{background:#f2f4f7;border-color:var(--line)}
.perm-item input{margin-top:3px;flex:0 0 auto}
.perm-item span{font-size:12.5px;font-weight:500}
.perm-item small{display:block;font-size:11px;color:var(--mute);line-height:1.5;margin-top:1px}
.perm-item.ro{cursor:default;opacity:.72}
.perm-item.ro:hover{background:#fafbfc;border-color:var(--line2)}

/* ============================================================
   移动端适配（手机 / 平板）
   ≤900px：侧边导航改成抽屉（汉堡按钮唤出）
   ≤620px：手机排版 —— 单列、触控尺寸加大、表格横滑、弹层贴底
   说明：桌面样式一行未动，全部新增在这段里。
   ============================================================ */

/* 汉堡按钮 / 抽屉遮罩 / 抽屉底部操作：只在窄屏出现 */
.ham{display:none;align-items:center;justify-content:center;width:38px;height:38px;flex:0 0 auto;
  border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--ink2);
  font-size:17px;line-height:1;cursor:pointer;padding:0}
.ham:active{background:#f2f4f7}
.side-mask{display:none}
.side-act{display:none}

@media (max-width:900px){
  .ham{display:flex}
  /* 侧栏变抽屉：默认滑出屏幕外，.open 时滑入 */
  .side{transform:translateX(-100%);transition:transform .26s cubic-bezier(.4,0,.2,1);will-change:transform}
  .side.open{transform:translateX(0);box-shadow:0 0 48px rgba(0,0,0,.40)}
  .main{margin-left:0}
  .side-mask{display:block;position:fixed;inset:0;background:rgba(16,25,53,.45);
    z-index:19;opacity:0;pointer-events:none;transition:opacity .26s}
  .side-mask.on{opacity:1;pointer-events:auto}
  /* 手机上顶部右侧放不下「改密码 / 退出」，挪到抽屉底部 */
  .side-act{display:flex;gap:8px;margin-top:10px}
  .side-act .btn{flex:1;justify-content:center;background:rgba(255,255,255,.08);
    border-color:rgba(255,255,255,.20);color:#e8ecf5}
  .side-act .btn:hover{background:rgba(255,255,255,.15)}
}

@media (max-width:620px){
  /* ---- 顶栏 ---- */
  .top{height:52px;padding:0 12px;gap:10px}
  .top h2{font-size:15px}
  .top .crumb{display:none}                 /* 面包屑在手机上太占地方 */
  .top .right{gap:8px}
  .top .right>.btn{display:none}            /* 「接入大模型」入口改走侧栏 */
  .me{padding-left:8px;margin-left:0;gap:6px}
  .me-txt{display:none}                     /* 只留头像 + 小按钮 */
  .me .btn.sm{padding:5px 9px}
  #btnMyPwd{display:none}                   /* 顶栏太挤：改密码改走抽屉底部 */
  #modeTag{font-size:11px;padding:1px 7px}

  /* ---- 页面与卡片 ---- */
  .page{padding:14px 12px calc(30px + env(safe-area-inset-bottom,0px));overflow-x:hidden}
  .card{padding:14px 14px;margin-bottom:12px;border-radius:12px}
  .card.tight{padding:12px 12px}
  .card-h{flex-wrap:wrap;gap:8px;margin-bottom:12px}
  .card-h h3{font-size:14.5px}
  .card-h .r{margin-left:0;width:100%;flex-wrap:wrap}
  .card-h.clickable .arrow{opacity:1}
  .sec-t{margin:16px 0 8px}

  /* ---- 一律单列 ---- */
  .g2,.g3,.g4,.g5,.grid{grid-template-columns:1fr}
  .row{flex-direction:column;gap:10px}
  .row>*{width:100%;min-width:0}
  .editor,.cmp,.split{grid-template-columns:1fr}

  /* ---- 触控尺寸：输入框 16px，避免 iOS 聚焦时自动放大整页 ---- */
  .inp,.sel,.ta{font-size:16px;padding:10px 12px;min-height:44px;border-radius:9px}
  .ta{min-height:120px}
  .btn{padding:10px 14px;min-height:42px}
  .btn.sm{min-height:34px;padding:6px 11px}
  .field{margin-bottom:10px}
  .fl{font-size:12.5px}

  /* ---- 表格：容器内横向滑动，列不被压扁 ----
     .wide 由 JS 按列数打上（≥4 列才算宽表）：只有宽表才强制最小宽度去横滑，
     2~3 列的小表在手机上自适应显示，不用用户左右拖。 */
  .tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .tbl-wrap.wide table{min-width:560px}
  .tbl-wrap::-webkit-scrollbar{height:6px}
  .tbl-wrap::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px}

  /* ---- 弹层：贴底弹出，按钮加大 ---- */
  .mask{padding:0;align-items:flex-end}
  .modal{max-width:100%;max-height:92vh;border-radius:16px 16px 0 0}
  .modal.wide{max-width:100%}
  .modal-h{padding:14px 16px}
  .modal-h h3{font-size:14.5px}
  .modal-b{padding:14px 16px}
  .modal-f{padding:10px 14px calc(12px + env(safe-area-inset-bottom,0px))}
  .modal-f .btn{flex:1;justify-content:center;min-height:42px}

  /* ---- 子项切换条：横向滚动，不折行 ---- */
  .subnav{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .subnav .sbtn{white-space:nowrap;flex:0 0 auto}

  /* ---- 统计卡 ---- */
  .stat{padding:12px 14px}
  .stat .v{font-size:21px}

  /* ---- 内容不撑破屏幕 ---- */
  .page img,.page svg,.page canvas,.page video{max-width:100%;height:auto}
  pre,.mono{white-space:pre-wrap;word-break:break-word}

  /* ---- 成员卡片操作区 ---- */
  .ucard{flex-wrap:wrap}
  .uact{max-width:none;width:100%;justify-content:flex-start}
}