/* 矩阵发布 · 发布中心(js/publish.js)· pb- 前缀
 * 颜色全部走全站变量(css/style.css 浅色 / css/tokens.css 深色),带浅色兜底值;窄屏(≈400px)单列、不出横向滚动。 */
#page-publish {
    padding: 0;
    --pb-pri: var(--primary, #c8791f);
    --pb-pri-h: var(--primary-hover, #a86412);
    --pb-acc: var(--accent, #c8791f);
    --pb-tint: var(--primary-light, #f6ecd9);
    --pb-card: var(--bg-white, #fff);
    --pb-soft: var(--bg-warm, #faf8f3);
    --pb-bg: var(--bg, #f4f2ec);
    --pb-line: var(--border, #e8e2d6);
    --pb-tx: var(--text, #23262e);
    --pb-tx2: var(--text-secondary, #6c6f78);
    --pb-tx3: var(--text-hint, #9a9ca3);
    --pb-strong: var(--strong, var(--text, #23262e));
    --pb-ok: var(--success, #2f9e89);
    --pb-err: var(--danger, #c4472f);
    --pb-warn: var(--warning, #d49a2a);
    --pb-run: #4a8fd6;
    --pb-act: #e07b2a;
    --pb-shadow: var(--shadow-lg, 0 14px 36px rgba(60, 40, 10, .13));
}
#page-publish *, #page-publish *::before, #page-publish *::after { box-sizing: border-box; }
#page-publish [hidden] { display: none !important; }
.pb-page { padding: 20px 24px 56px; color: var(--pb-tx); max-width: 1480px; display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.pb-dim { color: var(--pb-tx3); font-size: 12px; font-weight: 400; }
.pb-pad { padding: 14px; margin: 0; }
.pb-grow { flex: 1; min-width: 0; }
.pb-center { text-align: center; }
.pb-err-t { color: var(--pb-err); font-style: normal; font-size: 12px; }
.pb-empty { padding: 36px 12px; text-align: center; color: var(--pb-tx3); font-size: 13px; line-height: 1.9; grid-column: 1 / -1; margin: 0; }
.pb-empty.sm { padding: 14px 8px; font-size: 12px; }
.pb-warn { background: var(--pb-tint); border: 1px solid var(--pb-acc); border-radius: 10px; padding: 10px 12px; font-size: 13px; line-height: 1.7; overflow-wrap: anywhere; }
.pb-row { display: flex; align-items: center; gap: 8px; min-width: 0; }
.pb-row.wrap { flex-wrap: wrap; }
.pb-page p { margin: 0; }
.pb-page h4 { margin: 0; font-size: 14px; color: var(--pb-strong); font-weight: 600; }

/* 按钮 / 输入 */
.pb-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; border: 1px solid var(--pb-line); background: var(--pb-card); color: var(--pb-tx); padding: 8px 14px; border-radius: 9px; font-size: 13px; cursor: pointer; white-space: nowrap; font-family: inherit; line-height: 1.2; text-decoration: none; transition: border-color .15s, color .15s, background .15s; }
.pb-btn:hover:not(:disabled) { border-color: var(--pb-pri); color: var(--pb-pri); }
.pb-btn:disabled { opacity: .45; cursor: not-allowed; }
.pb-btn.primary { background: var(--pb-pri); border-color: var(--pb-pri); color: #fff; font-weight: 600; }
.pb-btn.primary:hover:not(:disabled) { background: var(--pb-pri-h); border-color: var(--pb-pri-h); color: #fff; }
.pb-btn.ghost { background: transparent; }
.pb-btn.danger { color: var(--pb-err); border-color: color-mix(in srgb, var(--pb-err) 45%, transparent); }
.pb-btn.danger:hover:not(:disabled) { background: color-mix(in srgb, var(--pb-err) 10%, transparent); color: var(--pb-err); border-color: var(--pb-err); }
.pb-btn.warn { color: var(--pb-act); border-color: color-mix(in srgb, var(--pb-act) 55%, transparent); }
.pb-btn.sm { padding: 6px 11px; font-size: 12.5px; border-radius: 8px; }
.pb-btn.xs { padding: 4px 8px; font-size: 12px; border-radius: 7px; gap: 4px; }
.pb-lnk { background: none; border: none; color: var(--pb-acc); font-size: 12px; cursor: pointer; padding: 2px 4px; text-decoration: none; font-family: inherit; display: inline-flex; align-items: center; gap: 4px; }
.pb-lnk:hover { text-decoration: underline; }
.pb-page a:not(.pb-btn) { color: var(--pb-acc); }
.pb-inp { width: 100%; min-width: 0; border: 1px solid var(--pb-line); border-radius: 9px; padding: 8px 11px; font-size: 13px; background: var(--pb-card); color: var(--pb-tx); font-family: inherit; outline: none; }
.pb-inp:focus { border-color: var(--pb-pri); box-shadow: 0 0 0 3px color-mix(in srgb, var(--pb-pri) 16%, transparent); }
.pb-inp:disabled { opacity: .7; cursor: not-allowed; }
.pb-inp.sm { width: 110px; }
.pb-inp.xs { width: 84px; padding: 5px 8px; }
.pb-inp.code { width: 120px; letter-spacing: .2em; font-variant-numeric: tabular-nums; }
.pb-ta { resize: vertical; min-height: 92px; line-height: 1.65; }
.pb-chk { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; cursor: pointer; flex-wrap: wrap; }
.pb-chk input { accent-color: var(--pb-pri); }
.pb-fld { display: flex; flex-direction: column; gap: 6px; min-width: 0; font-size: 13px; }
.pb-fld > span { font-size: 12px; color: var(--pb-tx2); }
.pb-lab { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; font-size: 13px; color: var(--pb-tx); font-weight: 500; }
.pb-lab small { font-weight: 400; color: var(--pb-tx3); font-size: 11.5px; margin-left: 4px; }
.pb-seg { display: inline-flex; flex-wrap: wrap; gap: 4px; }
.pb-seg button { border: 1px solid var(--pb-line); background: var(--pb-card); border-radius: 8px; padding: 6px 12px; font-size: 12.5px; cursor: pointer; color: var(--pb-tx2); font-family: inherit; }
.pb-seg button:hover { border-color: var(--pb-pri); color: var(--pb-pri); }
.pb-seg button.on { background: var(--pb-pri); border-color: var(--pb-pri); color: #fff; font-weight: 600; }
.pb-grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.pb-grid3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.pb-span2 { grid-column: 1 / -1; }

/* 状态标签 / 小圆点 */
.pb-tag { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; padding: 2px 8px; border-radius: 999px; background: var(--pb-soft); color: var(--pb-tx2); border: 1px solid var(--pb-line); font-style: normal; white-space: nowrap; line-height: 1.5; }
.pb-tag.ok { color: var(--pb-ok); border-color: color-mix(in srgb, var(--pb-ok) 40%, transparent); background: color-mix(in srgb, var(--pb-ok) 10%, transparent); }
.pb-tag.err { color: var(--pb-err); border-color: color-mix(in srgb, var(--pb-err) 40%, transparent); background: color-mix(in srgb, var(--pb-err) 10%, transparent); }
.pb-tag.run { color: var(--pb-run); border-color: color-mix(in srgb, var(--pb-run) 40%, transparent); background: color-mix(in srgb, var(--pb-run) 10%, transparent); }
.pb-tag.wait { color: var(--pb-tx2); }
.pb-tag.act { color: var(--pb-act); border-color: color-mix(in srgb, var(--pb-act) 45%, transparent); background: color-mix(in srgb, var(--pb-act) 12%, transparent); }
.pb-tag.off { opacity: .7; }
.pb-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--pb-tx3); flex: none; }
.pb-dot.ok { background: var(--pb-ok); } .pb-dot.err { background: var(--pb-err); } .pb-dot.warn { background: var(--pb-warn); }
.pb-dot.run { background: var(--pb-run); } .pb-dot.act { background: var(--pb-act); } .pb-dot.wait { background: var(--pb-tx3); }
.pb-pi { width: 1.15em; text-align: center; flex: none; }

/* 顶部 */
.pb-top { display: flex; align-items: center; gap: 12px; }
.pb-title { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; min-width: 0; flex: 1; }
.pb-title h2 { margin: 0; font-size: 20px; color: var(--pb-strong); display: flex; align-items: center; gap: 8px; font-family: var(--font-display-cn, inherit); }
.pb-title h2 i { color: var(--pb-acc); }
.pb-title small { font-size: 12px; color: var(--pb-tx3); }
.pb-bell-wrap { position: relative; flex: none; }
.pb-bell { position: relative; width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--pb-line); background: var(--pb-card); color: var(--pb-tx2); cursor: pointer; font-size: 15px; display: flex; align-items: center; justify-content: center; }
.pb-bell:hover, .pb-bell.has { color: var(--pb-acc); border-color: var(--pb-acc); }
.pb-bell em { position: absolute; top: -4px; right: -4px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--pb-err); color: #fff; font-size: 11px; font-style: normal; font-weight: 600; line-height: 18px; text-align: center; }
.pb-inbox { position: absolute; right: 0; top: calc(100% + 8px); z-index: 50; width: min(360px, calc(100vw - 24px)); max-height: min(70vh, 520px); display: flex; flex-direction: column; background: var(--pb-card); border: 1px solid var(--pb-line); border-radius: 12px; box-shadow: var(--pb-shadow); overflow: hidden; }
.pb-inbox-h { display: flex; align-items: center; justify-content: space-between; padding: 10px 14px; border-bottom: 1px solid var(--pb-line); font-size: 13px; }
.pb-inbox-l { overflow-y: auto; }
.pb-ib { display: flex; align-items: flex-start; border-bottom: 1px solid var(--pb-line); }
.pb-ib:last-child { border-bottom: none; }
.pb-ib.unread { background: var(--pb-tint); }
.pb-ib-main { flex: 1; min-width: 0; display: flex; gap: 10px; align-items: flex-start; text-align: left; padding: 10px 6px 10px 14px; background: none; border: none; cursor: pointer; color: var(--pb-tx); font-family: inherit; }
.pb-ib-main .pb-pi { margin-top: 3px; }
.pb-ib-main span { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pb-ib-main b { font-size: 13px; font-weight: 500; overflow-wrap: anywhere; }
.pb-ib-main small { font-size: 12px; color: var(--pb-tx2); line-height: 1.5; overflow-wrap: anywhere; }
.pb-ib-read { flex: none; background: none; border: none; color: var(--pb-tx3); cursor: pointer; padding: 12px 12px; }
.pb-ib-read:hover { color: var(--pb-ok); }

.pb-tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--pb-line); }
.pb-tab { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 10px 14px; background: none; border: none; border-bottom: 2px solid transparent; margin-bottom: -1px; color: var(--pb-tx2); font-size: 14px; cursor: pointer; font-family: inherit; white-space: nowrap; }
.pb-tab:hover { color: var(--pb-acc); }
.pb-tab.on { color: var(--pb-acc); border-bottom-color: var(--pb-acc); font-weight: 600; }
.pb-dot-n { min-width: 16px; height: 16px; padding: 0 4px; border-radius: 8px; background: var(--pb-act); color: #fff; font-size: 10.5px; font-style: normal; line-height: 16px; text-align: center; }
.pb-body { display: flex; flex-direction: column; gap: 14px; min-width: 0; }

/* 账号矩阵 */
.pb-bar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.pb-chips { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; min-width: 0; flex: 1; }
.pb-chip { border: 1px solid var(--pb-line); background: var(--pb-card); color: var(--pb-tx2); border-radius: 999px; padding: 4px 12px; font-size: 12.5px; cursor: pointer; font-family: inherit; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pb-chip small { opacity: .7; }
.pb-chip:hover { border-color: var(--pb-pri); color: var(--pb-pri); }
.pb-chip.on { background: var(--pb-tint); border-color: var(--pb-acc); color: var(--pb-acc); font-weight: 600; }
.pb-tip { display: flex; gap: 10px; align-items: flex-start; background: var(--pb-soft); border: 1px solid var(--pb-line); border-radius: 12px; padding: 12px 14px; font-size: 12.5px; line-height: 1.7; color: var(--pb-tx2); }
.pb-tip > i { color: var(--pb-acc); margin-top: 4px; }
.pb-tip > div { flex: 1; min-width: 0; }
.pb-tip b { color: var(--pb-tx); font-size: 13px; }
.pb-cols { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr)); gap: 14px; align-items: start; }
.pb-col { background: var(--pb-card); border: 1px solid var(--pb-line); border-radius: 14px; padding: 12px; display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.pb-col.off { opacity: .85; }
.pb-col-h { display: flex; align-items: center; gap: 8px; font-size: 14px; }
.pb-col-h .pb-pi { font-size: 17px; }
.pb-col-h b { color: var(--pb-strong); }
.pb-col-h small { margin-left: auto; color: var(--pb-tx3); font-size: 12px; }
.pb-na { display: flex; flex-direction: column; gap: 2px; background: var(--pb-soft); border: 1px dashed var(--pb-line); border-radius: 10px; padding: 8px 10px; font-size: 12px; color: var(--pb-tx2); overflow-wrap: anywhere; }
.pb-na b { color: var(--pb-tx); font-size: 13px; }
.pb-paused { font-size: 12px; color: var(--pb-act); background: color-mix(in srgb, var(--pb-act) 10%, transparent); border-radius: 8px; padding: 6px 10px; line-height: 1.6; overflow-wrap: anywhere; }
.pb-accs { display: flex; flex-direction: column; gap: 8px; }
.pb-col-acts { display: flex; gap: 6px; flex-wrap: wrap; }
.pb-acc { border: 1px solid var(--pb-line); border-radius: 12px; padding: 10px; display: flex; flex-direction: column; gap: 8px; background: var(--pb-soft); min-width: 0; }
.pb-acc.err { border-color: color-mix(in srgb, var(--pb-err) 45%, var(--pb-line)); }
.pb-acc.act { border-color: color-mix(in srgb, var(--pb-act) 45%, var(--pb-line)); }
.pb-acc-h { display: flex; align-items: center; gap: 10px; min-width: 0; }
.pb-av { width: 38px; height: 38px; border-radius: 50%; object-fit: cover; flex: none; background: var(--pb-tint); }
.pb-av.sm { width: 28px; height: 28px; }
.pb-av.t { display: inline-flex; align-items: center; justify-content: center; color: var(--pb-acc); font-weight: 600; font-size: 15px; }
.pb-av.sm.t { font-size: 12px; }
.pb-acc-n { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; min-width: 0; }
.pb-acc-n b { font-size: 14px; color: var(--pb-strong); font-weight: 600; overflow-wrap: anywhere; }
.pb-acc-m { display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: center; font-size: 12px; }
.pb-quota { color: var(--pb-tx2); font-variant-numeric: tabular-nums; }
.pb-quota.full { color: var(--pb-act); }
.pb-gtags { display: flex; gap: 4px; flex-wrap: wrap; }
.pb-gtags span { font-size: 11px; padding: 1px 8px; border-radius: 6px; background: var(--pb-tint); color: var(--pb-acc); overflow-wrap: anywhere; }
.pb-acc-acts { display: flex; gap: 4px; flex-wrap: wrap; }
.pb-confirm { display: flex; flex-direction: column; gap: 8px; border: 1px solid color-mix(in srgb, var(--pb-err) 40%, var(--pb-line)); background: color-mix(in srgb, var(--pb-err) 6%, transparent); border-radius: 10px; padding: 10px; font-size: 12.5px; line-height: 1.6; }
.pb-confirm i { color: var(--pb-err); }
.pb-acc-edit { display: flex; flex-direction: column; gap: 8px; border-top: 1px dashed var(--pb-line); padding-top: 8px; }

/* 弹层 */
.pb-modal { position: fixed; inset: 0; z-index: 3000; display: flex; align-items: center; justify-content: center; padding: 16px; }
.pb-mbg { position: absolute; inset: 0; background: rgba(12, 14, 20, .55); backdrop-filter: blur(3px); }
.pb-mbox { position: relative; width: min(520px, 100%); max-height: calc(100vh - 32px); overflow: auto; background: var(--pb-card); color: var(--pb-tx); border: 1px solid var(--pb-line); border-radius: 16px; padding: 16px 18px; box-shadow: var(--pb-shadow); display: flex; flex-direction: column; gap: 12px; font-size: 13px; line-height: 1.6; }
.pb-mbox.sm { width: min(420px, 100%); }
.pb-mbox.lg { width: min(960px, 100%); }
.pb-mbox p { margin: 0; overflow-wrap: anywhere; }
.pb-mh { display: flex; align-items: center; gap: 10px; }
.pb-mh b { flex: 1; font-size: 15px; color: var(--pb-strong); }
.pb-mx { width: 30px; height: 30px; border: none; border-radius: 8px; background: var(--pb-soft); color: var(--pb-tx2); cursor: pointer; flex: none; }
.pb-mx:hover { color: var(--pb-err); }
.pb-mfoot { display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap; align-items: center; }
.pb-pps { display: flex; flex-direction: column; gap: 8px; }
.pb-pp { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; border: 1px solid var(--pb-line); border-radius: 10px; padding: 10px 12px; }
.pb-pp .pb-pi { font-size: 18px; }
.pb-pp.off { opacity: .75; }
.pb-pp small { flex-basis: 100%; overflow-wrap: anywhere; }
.pb-lg-st, .pb-lg-qr { display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; padding: 16px 4px; }
.pb-lg-st > i { font-size: 34px; color: var(--pb-acc); }
.pb-lg-st.ok > i { color: var(--pb-ok); }
.pb-lg-st.warn > i { color: var(--pb-warn); }
.pb-lg-st.err > i { color: var(--pb-err); }
.pb-lg-st b, .pb-lg-qr b { font-size: 15px; color: var(--pb-strong); }
.pb-lg-st small, .pb-lg-qr small { color: var(--pb-tx2); font-size: 12px; overflow-wrap: anywhere; }
.pb-qr { width: min(240px, 70vw); height: min(240px, 70vw); object-fit: contain; background: #fff; border-radius: 12px; padding: 8px; border: 1px solid var(--pb-line); image-rendering: pixelated; }
.pb-qr.none { display: flex; align-items: center; justify-content: center; color: #888; font-size: 24px; }
.pb-cd { font-variant-numeric: tabular-nums; }
.pb-lb { display: flex; justify-content: center; }
.pb-lb img { max-width: 100%; max-height: 75vh; border-radius: 8px; border: 1px solid var(--pb-line); }

/* 新建发布 */
.pb-steps { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.pb-step { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px 6px 6px; border-radius: 999px; border: 1px solid var(--pb-line); background: var(--pb-card); color: var(--pb-tx2); font-size: 13px; cursor: pointer; font-family: inherit; }
.pb-step em { width: 22px; height: 22px; border-radius: 50%; background: var(--pb-soft); display: inline-flex; align-items: center; justify-content: center; font-style: normal; font-size: 12px; font-weight: 600; }
.pb-step.on { border-color: var(--pb-pri); color: var(--pb-pri); font-weight: 600; }
.pb-step.on em { background: var(--pb-pri); color: #fff; }
.pb-step.done em { background: color-mix(in srgb, var(--pb-ok) 18%, transparent); color: var(--pb-ok); }
.pb-step:disabled { opacity: .5; cursor: not-allowed; }
.pb-step-sep { color: var(--pb-tx3); font-size: 10px; }
.pb-sec { background: var(--pb-card); border: 1px solid var(--pb-line); border-radius: 14px; padding: 14px; display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.pb-srcs { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(160px, calc(50% - 6px)), 1fr)); gap: 12px; }
.pb-up { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; aspect-ratio: 3 / 4; border: 2px dashed var(--pb-line); border-radius: 12px; cursor: pointer; text-align: center; padding: 12px; color: var(--pb-tx2); font-size: 12px; min-width: 0; }
.pb-up > i { font-size: 26px; color: var(--pb-acc); }
.pb-up b { font-size: 13px; color: var(--pb-tx); font-weight: 600; }
.pb-up small { line-height: 1.5; overflow-wrap: anywhere; }
.pb-up:hover, .pb-up.over { border-color: var(--pb-pri); background: var(--pb-tint); }
.pb-up.busy { cursor: default; border-style: solid; }
.pb-bar-p { width: 100%; height: 6px; border-radius: 3px; background: var(--pb-soft); border: 1px solid var(--pb-line); overflow: hidden; }
.pb-bar-p i { display: block; height: 100%; background: var(--pb-run); border-radius: 3px; transition: width .3s; }
.pb-src { display: flex; flex-direction: column; text-align: left; background: var(--pb-soft); border: 2px solid transparent; border-radius: 12px; overflow: hidden; cursor: pointer; padding: 0; color: var(--pb-tx); font-family: inherit; min-width: 0; }
.pb-src:hover:not(:disabled) { border-color: var(--pb-pri); }
.pb-src.on { border-color: var(--pb-pri); box-shadow: 0 0 0 3px color-mix(in srgb, var(--pb-pri) 18%, transparent); }
.pb-src.blocked { cursor: not-allowed; opacity: .6; filter: grayscale(.7); }
.pb-src-cv { position: relative; display: flex; align-items: center; justify-content: center; aspect-ratio: 3 / 4; background: #0c0d10; color: #777; font-size: 26px; overflow: hidden; }
.pb-src-cv img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pb-dur { position: absolute; right: 6px; bottom: 6px; background: rgba(0, 0, 0, .65); color: #fff; font-size: 11px; font-style: normal; padding: 1px 6px; border-radius: 5px; font-variant-numeric: tabular-nums; }
.pb-src-blk { position: absolute; inset: auto 0 0 0; background: rgba(20, 20, 20, .82); color: #fff; font-size: 11.5px; line-height: 1.5; padding: 6px 8px; display: flex; gap: 5px; align-items: flex-start; overflow-wrap: anywhere; }
.pb-src-m { display: flex; flex-direction: column; gap: 2px; padding: 8px 10px 10px; min-width: 0; }
.pb-src-m b { font-size: 13px; font-weight: 500; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow-wrap: anywhere; }
.pb-src-m small { font-size: 11px; color: var(--pb-tx3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pb-pager { display: flex; align-items: center; justify-content: center; gap: 10px; flex-wrap: wrap; }
.pb-srcbar { display: flex; align-items: center; gap: 12px; background: var(--pb-card); border: 1px solid var(--pb-line); border-radius: 14px; padding: 10px 12px; min-width: 0; }
.pb-srcbar img, .pb-srcbar-i { width: 52px; height: 52px; border-radius: 8px; object-fit: cover; flex: none; background: #0c0d10; display: flex; align-items: center; justify-content: center; color: #777; }
.pb-srcbar > div { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.pb-srcbar b { font-size: 14px; color: var(--pb-strong); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pb-srcbar small { font-size: 12px; color: var(--pb-tx3); overflow-wrap: anywhere; }
.pb-pchips { display: flex; flex-wrap: wrap; gap: 8px; }
.pb-pchip { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--pb-line); background: var(--pb-card); border-radius: 10px; padding: 7px 12px; cursor: pointer; font-family: inherit; color: var(--pb-tx); font-size: 13px; max-width: 100%; }
.pb-pchip small { color: var(--pb-tx3); font-size: 11.5px; }
.pb-pchip .pb-ck { color: var(--pb-tx3); }
.pb-pchip.on { border-color: var(--pb-pri); background: var(--pb-tint); }
.pb-pchip.on .pb-ck { color: var(--pb-pri); }
.pb-pchip:disabled { opacity: .5; cursor: not-allowed; }
.pb-hint { font-size: 12px; color: var(--pb-tx2); line-height: 1.6; overflow-wrap: anywhere; }
.pb-hint i { color: var(--pb-acc); }
.pb-hint.warn { background: color-mix(in srgb, var(--pb-warn) 10%, transparent); border-radius: 10px; padding: 8px 12px; }
.pb-gen { font-size: 13px; color: var(--pb-acc); }
.pb-ptabs { display: flex; gap: 4px; flex-wrap: wrap; border-bottom: 1px solid var(--pb-line); }
.pb-ptab { display: inline-flex; align-items: center; gap: 6px; background: none; border: none; border-bottom: 2px solid transparent; margin-bottom: -1px; padding: 8px 12px; color: var(--pb-tx2); font-size: 13px; cursor: pointer; font-family: inherit; }
.pb-ptab.on { color: var(--pb-acc); border-bottom-color: var(--pb-acc); font-weight: 600; }
.pb-ed { display: flex; flex-direction: column; gap: 14px; background: var(--pb-card); border: 1px solid var(--pb-line); border-top: none; border-radius: 0 0 14px 14px; padding: 14px; min-width: 0; }
.pb-fi:empty { display: none; }
.pb-fi { display: flex; flex-direction: column; gap: 3px; }
.pb-is { display: flex; gap: 6px; align-items: flex-start; font-size: 12px; line-height: 1.55; overflow-wrap: anywhere; }
.pb-is i { margin-top: 3px; flex: none; }
.pb-is.err { color: var(--pb-err); }
.pb-is.warn { color: var(--pb-warn); }
.pb-cnt { font-size: 12px; color: var(--pb-tx3); font-variant-numeric: tabular-nums; font-weight: 400; white-space: nowrap; }
.pb-cnt.err { color: var(--pb-err); font-weight: 600; }
.pb-cnt.warn { color: var(--pb-warn); font-weight: 600; }
.pb-topics { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; border: 1px solid var(--pb-line); border-radius: 9px; padding: 6px 8px; background: var(--pb-card); min-width: 0; }
.pb-topics:focus-within { border-color: var(--pb-pri); }
.pb-topic { display: inline-flex; align-items: center; gap: 2px; background: var(--pb-tint); color: var(--pb-acc); border-radius: 6px; padding: 2px 2px 2px 8px; font-size: 12.5px; max-width: 100%; overflow-wrap: anywhere; }
.pb-topic button { background: none; border: none; color: inherit; cursor: pointer; padding: 2px 5px; font-size: 11px; opacity: .7; }
.pb-topic button:hover { opacity: 1; }
.pb-topic-in { flex: 1; min-width: 120px; border: none; outline: none; background: transparent; color: var(--pb-tx); font-size: 13px; padding: 4px; font-family: inherit; }
.pb-lock { color: var(--pb-tx2); font-size: 12px; line-height: 1.5; }
.pb-lock i { color: var(--pb-acc); }
.pb-cover { display: flex; gap: 12px; align-items: flex-start; flex-wrap: wrap; }
.pb-cov-v { width: min(240px, 100%); max-height: 320px; border-radius: 10px; background: #000; flex: none; }
.pb-cov-nov { width: min(240px, 100%); padding: 22px 12px; text-align: center; border: 1px dashed var(--pb-line); border-radius: 10px; color: var(--pb-tx3); font-size: 12px; }
.pb-cov-ctl { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; flex: 1; min-width: 180px; }
.pb-cov-ctl label { display: inline-flex; align-items: center; gap: 6px; }
.pb-ed-acts { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; border-top: 1px dashed var(--pb-line); padding-top: 12px; }
.pb-c-foot { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; position: sticky; bottom: 0; z-index: 5; background: var(--pb-bg); padding: 10px 0; border-top: 1px solid var(--pb-line); }

.pb-pblk { display: flex; flex-direction: column; gap: 8px; border: 1px solid var(--pb-line); border-radius: 12px; padding: 10px; }
.pb-pblk-h { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.pb-pblk-h small { color: var(--pb-tx3); }
.pb-picks { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(220px, 100%), 1fr)); gap: 6px; }
.pb-pick { display: flex; align-items: center; gap: 8px; text-align: left; background: var(--pb-soft); border: 1px solid var(--pb-line); border-radius: 10px; padding: 7px 10px; cursor: pointer; color: var(--pb-tx); font-family: inherit; min-width: 0; }
.pb-pick .pb-ck { color: var(--pb-tx3); font-size: 15px; }
.pb-pick.on { border-color: var(--pb-pri); background: var(--pb-tint); }
.pb-pick.on .pb-ck { color: var(--pb-pri); }
.pb-pick.full { opacity: .5; cursor: not-allowed; }
.pb-pick-n { display: flex; flex-direction: column; min-width: 0; }
.pb-pick-n b { font-size: 13px; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pb-pick-n small { font-size: 11px; color: var(--pb-tx3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pb-prev { display: flex; flex-direction: column; gap: 8px; }
.pb-plan { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; border: 1px solid var(--pb-line); border-radius: 10px; max-height: 300px; overflow-y: auto; }
.pb-plan li { display: flex; align-items: center; gap: 8px; padding: 7px 10px; border-bottom: 1px solid var(--pb-line); font-size: 13px; min-width: 0; }
.pb-plan li:last-child { border-bottom: none; }
.pb-plan li span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pb-plan li em { font-style: normal; color: var(--pb-acc); font-variant-numeric: tabular-nums; white-space: nowrap; }

/* 发布记录 */
.pb-need-bar { background: color-mix(in srgb, var(--pb-act) 12%, transparent); color: var(--pb-act); border: 1px solid color-mix(in srgb, var(--pb-act) 40%, transparent); border-radius: 10px; padding: 8px 12px; font-size: 13px; }
.pb-tasks { display: flex; flex-direction: column; gap: 10px; }
.pb-task { background: var(--pb-card); border: 1px solid var(--pb-line); border-radius: 14px; overflow: hidden; min-width: 0; }
.pb-task.need { border-color: var(--pb-act); box-shadow: 0 0 0 1px color-mix(in srgb, var(--pb-act) 35%, transparent); }
.pb-task-h { width: 100%; display: flex; align-items: center; gap: 12px; padding: 10px 12px; background: none; border: none; cursor: pointer; text-align: left; color: var(--pb-tx); font-family: inherit; min-width: 0; }
.pb-task-cv { width: 48px; height: 64px; border-radius: 8px; object-fit: cover; flex: none; background: #0c0d10; display: flex; align-items: center; justify-content: center; color: #777; }
.pb-task-m { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.pb-task-m b { font-size: 14px; color: var(--pb-strong); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pb-task-m small { font-size: 12px; color: var(--pb-tx3); overflow-wrap: anywhere; }
.pb-task-c { display: flex; flex-wrap: wrap; gap: 4px; }
.pb-chev { color: var(--pb-tx3); font-size: 12px; flex: none; }
.pb-tgs { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr)); gap: 10px; padding: 0 12px 12px; }
.pb-tg { border: 1px solid var(--pb-line); border-radius: 12px; padding: 10px; display: flex; flex-direction: column; gap: 7px; background: var(--pb-soft); min-width: 0; font-size: 12.5px; }
.pb-tg.need { order: -1; border-color: var(--pb-act); background: color-mix(in srgb, var(--pb-act) 7%, var(--pb-soft)); box-shadow: 0 0 0 1px color-mix(in srgb, var(--pb-act) 30%, transparent); }
.pb-tg.ok { border-left: 3px solid var(--pb-ok); }
.pb-tg.err { border-left: 3px solid var(--pb-err); }
.pb-tg.run { border-left: 3px solid var(--pb-run); }
.pb-tg-h { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; min-width: 0; }
.pb-tg-h b { font-size: 13.5px; color: var(--pb-strong); overflow-wrap: anywhere; }
.pb-tg-t { font-size: 11.5px; }
.pb-tg-err { color: var(--pb-err); display: flex; gap: 6px; align-items: flex-start; line-height: 1.55; overflow-wrap: anywhere; }
.pb-tg-err i { margin-top: 3px; }
.pb-tg-tip { color: var(--pb-tx); line-height: 1.6; overflow-wrap: anywhere; }
.pb-tg-tip i { color: var(--pb-act); margin-right: 4px; }
.pb-tg-tip.warn { color: var(--pb-err); }
.pb-tg-tip.warn i { color: var(--pb-err); }
.pb-tg .pb-row { flex-wrap: wrap; }
.pb-tg-acts { display: flex; gap: 6px; flex-wrap: wrap; }
.pb-shots { display: flex; gap: 6px; flex-wrap: wrap; }
.pb-shot { width: 64px; height: 44px; padding: 0; border: 1px solid var(--pb-line); border-radius: 6px; overflow: hidden; cursor: zoom-in; background: #0c0d10; }
.pb-shot img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pb-evs summary { cursor: pointer; color: var(--pb-tx3); font-size: 12px; }
.pb-evs ol { margin: 6px 0 0; padding-left: 18px; display: flex; flex-direction: column; gap: 3px; color: var(--pb-tx2); overflow-wrap: anywhere; }
.pb-evs small { color: var(--pb-tx3); margin-right: 6px; font-variant-numeric: tabular-nums; }

/* 日历 */
.pb-cal-h { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pb-cal-h b { font-size: 16px; color: var(--pb-strong); min-width: 110px; text-align: center; }
.pb-legend { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 12px; color: var(--pb-tx2); }
.pb-legend span { display: inline-flex; align-items: center; gap: 5px; }
.pb-cal { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); border: 1px solid var(--pb-line); border-radius: 12px; overflow: hidden; background: var(--pb-line); gap: 1px; }
.pb-cal-wd { background: var(--pb-soft); text-align: center; font-size: 12px; color: var(--pb-tx2); padding: 6px 0; }
.pb-cal-d { background: var(--pb-card); min-height: 96px; padding: 4px; display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.pb-cal-d.blank { background: var(--pb-soft); }
.pb-cal-d.today .pb-cal-dn b { background: var(--pb-pri); color: #fff; }
.pb-cal-dn b { display: inline-flex; width: 22px; height: 22px; border-radius: 50%; align-items: center; justify-content: center; font-size: 12px; color: var(--pb-tx2); font-weight: 500; }
.pb-cal-dn small { display: none; }
.pb-ci { display: flex; align-items: center; gap: 4px; width: 100%; min-width: 0; text-align: left; border: none; border-left: 3px solid var(--pb-tx3); background: var(--pb-soft); border-radius: 4px; padding: 2px 4px; font-size: 11px; color: var(--pb-tx); cursor: pointer; font-family: inherit; }
.pb-ci em { font-style: normal; color: var(--pb-tx2); font-variant-numeric: tabular-nums; flex: none; }
.pb-ci span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.pb-ci.ok { border-left-color: var(--pb-ok); }
.pb-ci.err { border-left-color: var(--pb-err); }
.pb-ci.run { border-left-color: var(--pb-run); }
.pb-ci.act { border-left-color: var(--pb-act); background: color-mix(in srgb, var(--pb-act) 10%, var(--pb-soft)); }
.pb-ci.off { opacity: .55; text-decoration: line-through; }
.pb-ci.edit:hover { outline: 1px solid var(--pb-pri); }

/* 中等宽度 */
@media (max-width: 900px) {
    .pb-grid3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .pb-grid3 > :first-child { grid-column: 1 / -1; }
}
/* 手机(≈400px):单列、日历改列表、去掉横向溢出 */
@media (max-width: 640px) {
    .pb-page { padding: 12px 12px 40px; gap: 12px; }
    .pb-title h2 { font-size: 18px; }
    .pb-title small { display: none; }
    .pb-tabs { gap: 0; overflow-x: auto; scrollbar-width: none; }
    .pb-tabs::-webkit-scrollbar { display: none; }
    .pb-tab { flex: 0 0 auto; padding: 9px 10px; font-size: 13px; gap: 4px; }   /* 窄屏:页签按内容宽,放不下横向滑(原来 flex:1 + min-width:0 字会叠在一起) */
    .pb-tab i { display: none; }
    .pb-grid2, .pb-grid3 { grid-template-columns: minmax(0, 1fr); }
    .pb-sec { padding: 12px 10px; }
    .pb-ed { padding: 12px 10px; }
    .pb-step { padding: 4px 10px 4px 4px; font-size: 12px; }
    .pb-step-sep { display: none; }
    .pb-bar > .pb-btn.primary { width: 100%; }
    .pb-c-foot .pb-btn { padding: 8px 10px; }
    .pb-c-foot .pb-grow { flex-basis: 100%; order: -1; }
    .pb-cover { flex-direction: column; }
    .pb-cov-v, .pb-cov-nov { width: 100%; }
    .pb-tgs { padding: 0 8px 10px; }
    .pb-task-h { gap: 8px; padding: 10px 8px; }
    .pb-task-cv { width: 40px; height: 54px; }
    .pb-mbox { padding: 14px 12px; }
    .pb-modal { padding: 8px; align-items: flex-end; }
    .pb-cal { display: flex; flex-direction: column; background: none; border: none; gap: 6px; }
    .pb-cal-wd, .pb-cal-d.blank, .pb-cal-d.empty { display: none; }
    .pb-cal-d { min-height: 0; border: 1px solid var(--pb-line); border-radius: 10px; padding: 8px; gap: 5px; }
    .pb-cal-dn b { display: none; }
    .pb-cal-dn small { display: block; font-size: 12px; color: var(--pb-tx2); font-weight: 600; }
    .pb-cal-d.today .pb-cal-dn small { color: var(--pb-pri); }
    .pb-ci { font-size: 12.5px; padding: 6px 8px; }
}

/* 开通清单(只有超管看得到,2026-10-15) */
.pb-setup { border: 1px solid var(--pb-acc); border-radius: 12px; padding: 12px 14px; background: var(--pb-soft); font-size: 13px; color: var(--pb-tx2); margin-bottom: 12px; }
.pb-setup > b { color: var(--pb-tx); display: flex; align-items: center; gap: 6px; }
.pb-setup > b i { color: var(--pb-acc); }
.pb-setup ol { list-style: none; margin: 8px 0 4px; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.pb-setup li { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pb-setup li > span { flex: 1; min-width: 0; }
.pb-setup li > span b { color: var(--pb-tx); margin-right: 8px; }
.pb-setup li.ok > i { color: #3a9a5b; }
.pb-setup li.todo > i { color: var(--pb-acc); }

/* 没有矩阵发布权限的说明卡(2026-10-24):是什么 / 为什么用不了 / 找谁开通 + 文字按钮 */
.pb-denied { max-width: 560px; margin: 32px auto; padding: 28px 24px; text-align: center; background: var(--pb-card); border: 1px solid var(--pb-line); border-radius: 14px; display: flex; flex-direction: column; align-items: center; gap: 10px; color: var(--pb-tx2); }
.pb-denied > i { font-size: 28px; color: var(--pb-acc); }
.pb-denied > b { font-size: 16px; color: var(--pb-strong); }
.pb-denied p { margin: 0; font-size: 13px; line-height: 1.8; }
.pb-denied .pb-row { justify-content: center; flex-wrap: wrap; margin-top: 6px; }