/* 征集新品（/product-call）。只用 tokens.css 变量。 */
[hidden] { display: none !important; }
body { margin: 0; background: var(--surface-sunken); color: var(--text-primary);
       font: var(--fs-sm)/var(--lh-sm) var(--font-sans, -apple-system, "PingFang SC", system-ui, sans-serif); }
.pc-app { max-width: 1320px; margin: 0 auto; padding: var(--sp-5) var(--sp-4) var(--sp-8); }
:root[data-embedded="1"] .pc-app { padding-top: var(--sp-3); }
.pc-head h1 { font-size: var(--fs-lg); margin: 0 0 4px; }
.pc-head p { margin: 0; color: var(--text-muted); font-size: var(--fs-xs); max-width: 90ch; }
.pc-goto { font-size: var(--fs-xs); color: var(--text-muted); margin: var(--sp-2) 0 var(--sp-3); }
.pc-goto a, .pc-calls a { color: var(--accent); }
.pc-muted { color: var(--text-muted); font-size: var(--fs-xs); }
.pc-err { color: var(--danger-fg); }
.pc-warn { color: var(--warning-fg); background: var(--warning-bg); border: var(--bw-hair) solid var(--warning-border); border-radius: var(--radius-sm);
           padding: 4px var(--sp-2); font-size: var(--fs-xs); }
.pc-why { color: var(--text-muted); font-size: 11px; }
.pc-ok { color: var(--success-fg); }
.pc-empty { color: var(--text-muted); text-align: center; padding: var(--sp-6); }

.pc-layout { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: var(--sp-4); align-items: start; }
.pc-calls { display: flex; flex-direction: column; gap: 6px; position: sticky; top: var(--sp-2); }
.pc-call { text-align: left; border: var(--bw-hair) solid var(--border-subtle); border-radius: var(--radius-md); background: var(--surface);
           padding: var(--sp-2) var(--sp-3); cursor: pointer; font: inherit; color: var(--text-primary); display: flex; flex-direction: column; gap: 2px; }
.pc-call:hover { background: var(--surface-hover); }
.pc-call.on { border-color: var(--accent); background: var(--accent-soft-bg); }
.pc-call b { font-size: var(--fs-xs); }
.pc-call small { color: var(--text-muted); font-size: 11px; }
.pc-st { align-self: flex-start; font-size: 11px; padding: 0 6px; border-radius: var(--radius-full); white-space: nowrap; }
.pc-st.st-draft { background: var(--warning-bg); color: var(--warning-fg); }
.pc-st.st-sent { background: var(--success-bg); color: var(--success-fg); }
.pc-st.st-cancelled { background: var(--neutral-bg); color: var(--neutral-fg); }

.pc-main { background: var(--surface); border: var(--bw-hair) solid var(--border-subtle); border-radius: var(--radius-md); padding: var(--sp-3) var(--sp-4); min-width: 0; }
.pc-mtop { display: flex; align-items: baseline; gap: var(--sp-2); flex-wrap: wrap; margin-bottom: var(--sp-3); }
.pc-mtop h2 { font-size: var(--fs-md); margin: 0; }
.pc-mtop small { color: var(--text-muted); font-size: 11px; }
.pc-row { margin-bottom: var(--sp-3); }
.pc-row label { display: flex; flex-direction: column; gap: 4px; font-size: var(--fs-xs); color: var(--text-secondary); }
.pc-row input, .pc-row textarea, .pc-preview textarea, .pc-note input, .pc-tsal input {
  font: inherit; font-size: var(--fs-sm); padding: 4px var(--sp-2); border: var(--bw-hair) solid var(--border-strong);
  border-radius: var(--radius-sm); background: var(--surface); color: var(--text-primary); }
.pc-row textarea, .pc-preview textarea { width: 100%; box-sizing: border-box; resize: vertical; line-height: var(--lh-md); }
.pc-acts { display: flex; flex-wrap: wrap; gap: var(--sp-2); align-items: center; margin: 6px 0; }
.pc-btn { border: var(--bw-hair) solid var(--border-strong); border-radius: var(--radius-sm); background: var(--surface); color: var(--text-primary);
          padding: 3px var(--sp-3); font: inherit; font-size: var(--fs-xs); cursor: pointer; white-space: nowrap; }
.pc-btn:hover { background: var(--surface-hover); }
.pc-btn:disabled { opacity: .6; cursor: default; }
.pc-primary { background: var(--accent); border-color: var(--accent); color: var(--text-on-accent); font-weight: var(--fw-semibold); }
.pc-primary:hover { background: var(--accent-hover); }
.pc-link { border: 0; background: none; color: var(--accent); font-size: var(--fs-xs); cursor: pointer; padding: 2px 4px; white-space: nowrap; }
.pc-link:hover { text-decoration: underline; }
.pc-sendbar { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-3); padding: var(--sp-2) var(--sp-3); margin: var(--sp-2) 0 var(--sp-3);
              background: var(--accent-soft-bg); border-radius: var(--radius-sm); font-size: var(--fs-xs); }

.pc-table { width: 100%; border-collapse: separate; border-spacing: 0; }
.pc-table th { position: sticky; top: 0; background: var(--surface); text-align: left; font-size: 11px; color: var(--text-muted); font-weight: var(--fw-medium);
               padding: 6px var(--sp-2); border-bottom: var(--bw-hair) solid var(--border); white-space: nowrap; z-index: var(--z-sticky); }
.pc-table td { padding: 6px var(--sp-2); border-bottom: var(--bw-hair) solid var(--border-subtle); vertical-align: top; }
.pc-tname { width: 150px; }
.pc-tname b { display: block; }
.pc-tname small { color: var(--text-muted); font-size: 11px; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 150px; }
.pc-tsal { width: 96px; }
.pc-tsal input { width: 84px; font-size: var(--fs-xs); }
.pc-tact { width: 72px; text-align: right; }
.pc-tst { width: 170px; font-size: var(--fs-xs); }
.pc-tn { width: 56px; white-space: nowrap; }
.pc-preview { white-space: pre-wrap; font-size: var(--fs-xs); line-height: var(--lh-md); cursor: text; padding: 4px 6px; border-radius: var(--radius-sm); }
.pc-preview:hover { background: var(--surface-hover); }
.pc-preview.edited { border-left: 3px solid var(--info-border); }
.pc-t-dropped td, .pc-t-skip td { opacity: .55; }
.pc-ftable tbody tr { cursor: pointer; }
.pc-ftable tbody tr:hover { background: var(--surface-hover); }
.pc-ftable small { color: var(--text-muted); }

.pc-sum { display: flex; flex-wrap: wrap; gap: var(--sp-2); margin-bottom: var(--sp-2); }
.pc-card { background: var(--surface-sunken); border-radius: var(--radius-md); padding: var(--sp-2) var(--sp-3); min-width: 96px; display: flex; flex-direction: column; }
.pc-card b { font-size: var(--fs-lg); line-height: 1.2; }
.pc-card span { font-size: 11px; color: var(--text-muted); white-space: nowrap; }
.pc-card.pc-bad b { color: var(--danger-fg); }
.pc-tabs, .pc-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: var(--sp-3) 0 var(--sp-2); }
.pc-tabs button, .pc-chips button { border: var(--bw-hair) solid var(--border-subtle); border-radius: var(--radius-full); background: var(--surface);
                                     padding: 2px var(--sp-3); font-size: var(--fs-xs); cursor: pointer; color: var(--text-secondary); white-space: nowrap; }
.pc-tabs button.on, .pc-chips button.on { background: var(--accent); border-color: var(--accent); color: var(--text-on-accent); }
.pc-tabs button small, .pc-chips button small { opacity: .75; }

.pc-items { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: var(--sp-3); }
.pc-item { border: var(--bw-hair) solid var(--border-subtle); border-radius: var(--radius-md); overflow: hidden; display: flex; flex-direction: column; background: var(--surface); }
.pc-pics { display: grid; grid-template-columns: repeat(2, 1fr); gap: 2px; background: var(--surface-sunken); min-height: 60px; }
.pc-pics img { width: 100%; aspect-ratio: 1; object-fit: cover; cursor: zoom-in; display: block; }
.pc-pics img:only-child { grid-column: span 2; aspect-ratio: 4 / 3; object-fit: contain; }
.pc-nopic { grid-column: span 2; display: flex; align-items: center; justify-content: center; color: var(--text-disabled); font-size: 11px; }
.pc-ibody { padding: var(--sp-2) var(--sp-3); display: flex; flex-direction: column; gap: 4px; font-size: var(--fs-xs); }
.pc-ibody p { margin: 0; color: var(--text-secondary); }
.pc-iname { display: flex; flex-wrap: wrap; gap: 6px; align-items: baseline; }
.pc-iname code, .pc-pitem code { font-size: 11px; background: var(--surface-sunken); padding: 0 4px; border-radius: var(--radius-sm); }
.pc-what { font-size: 11px; padding: 0 6px; border-radius: var(--radius-full); white-space: nowrap; }
.pc-what.w-新品 { background: var(--success-bg); color: var(--success-fg); }
.pc-what.w-爆款 { background: var(--danger-bg); color: var(--danger-fg); }
.pc-what.w-主推 { background: var(--warning-bg); color: var(--warning-fg); }
.pc-what.w-其他 { background: var(--neutral-bg); color: var(--neutral-fg); }
.pc-ifacts { display: flex; flex-wrap: wrap; gap: var(--sp-2); color: var(--text-primary); font-weight: var(--fw-medium); }
.pc-files { display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.pc-files a, .pc-ifrom a, .pc-msg a { color: var(--accent); text-decoration: none; }
.pc-ifrom { color: var(--text-muted); font-size: 11px; display: flex; gap: var(--sp-2); }
.pc-said { text-decoration: underline dotted; cursor: help; }
.pc-src { font-size: 11px; color: var(--text-muted); margin: var(--sp-3) 0; }
.pc-src summary { cursor: pointer; }
.pc-src p { max-width: 100ch; }

.pc-panel { position: fixed; top: 0; right: 0; bottom: 0; width: min(520px, 100vw); background: var(--surface); border-left: var(--bw-hair) solid var(--border);
            box-shadow: var(--shadow-3); z-index: var(--z-modal); overflow-y: auto; }
.pc-panel-top { position: sticky; top: 0; background: var(--surface); display: flex; justify-content: space-between; align-items: flex-start;
                padding: var(--sp-3) var(--sp-4); border-bottom: var(--bw-hair) solid var(--border-subtle); z-index: 1; }
.pc-panel-top small { display: block; color: var(--text-muted); font-size: 11px; }
.pc-x { border: 0; background: none; font-size: 22px; line-height: 1; cursor: pointer; color: var(--text-muted); }
.pc-panel-body { padding: var(--sp-3) var(--sp-4) var(--sp-6); }
.pc-panel-body h3 { font-size: var(--fs-sm); margin: var(--sp-4) 0 var(--sp-2); }
.pc-sumline { background: var(--surface-sunken); border-radius: var(--radius-sm); padding: 6px var(--sp-2); margin: 0; }
.pc-msg { border-left: 2px solid var(--border); padding: 2px 0 2px var(--sp-2); margin-bottom: 6px; font-size: var(--fs-xs); }
.pc-msg.ours { border-left-color: var(--accent); background: var(--accent-soft-bg); }
.pc-msg span { color: var(--text-muted); font-size: 11px; }
.pc-msg p { margin: 2px 0 0; white-space: pre-wrap; }
.pc-msg img { max-width: 220px; max-height: 220px; border-radius: var(--radius-sm); display: block; margin-top: 2px; cursor: zoom-in; }
.pc-pitem { border: var(--bw-hair) solid var(--border-subtle); border-radius: var(--radius-sm); padding: 6px var(--sp-2); margin-bottom: 6px; font-size: var(--fs-xs); }
.pc-pitem p { margin: 2px 0; color: var(--text-secondary); }
.pc-pitem small { color: var(--text-muted); }
.pc-note { display: flex; gap: 6px; }
.pc-note input { flex: 1; font-size: var(--fs-xs); }
.pc-lightbox { position: fixed; inset: 0; background: var(--overlay); z-index: var(--z-toast); display: flex; align-items: center; justify-content: center; cursor: zoom-out; }
.pc-lightbox img { max-width: 92vw; max-height: 92vh; border-radius: var(--radius-md); }

@media (max-width: 900px) {
  .pc-layout { grid-template-columns: 1fr; }
  .pc-calls { position: static; flex-direction: row; overflow-x: auto; }
  .pc-call { min-width: 200px; }
}
@media (max-width: 640px) {
  .pc-row input, .pc-row textarea, .pc-tsal input, .pc-note input { font-size: 16px; }
  .pc-tst, .pc-tn { display: none; }
}

/* 10-22 分两轮要资料：每款的卖点 / 用在哪 / 客户为什么买 / 担心什么 / 有人卖过、还缺什么、上架·发给开发 */
.pc-info { list-style: none; margin: 2px 0 0; padding: 0; display: flex; flex-direction: column; gap: 2px; color: var(--text-secondary); }
.pc-info li span { color: var(--text-muted); margin-right: 4px; }
.pc-info li span::after { content: "："; }
.pc-miss { color: var(--warning-fg) !important; font-size: 11px; }
.pc-pick { margin-left: auto; font-size: 11px; color: var(--text-secondary); display: inline-flex; align-items: center; gap: 2px; cursor: pointer; }
.pc-shelved { margin-left: auto; font-size: 11px; padding: 0 6px; border-radius: var(--radius-full); background: var(--success-bg); color: var(--success-fg); }
.pc-item.is-shelved { border-color: var(--success-border, var(--border-subtle)); }
.pc-shelvebar { display: flex; flex-wrap: wrap; gap: var(--sp-2); align-items: center; margin: 0 0 var(--sp-3); }
.pc-btn:disabled { opacity: .5; cursor: default; }
.pc-dropwhy { margin: 0 0 4px; font-size: 11px; color: var(--warning-fg); background: var(--warning-bg); border-radius: var(--radius-sm); padding: 2px 6px; }
.pc-ask { display: flex; flex-direction: column; gap: 4px; }
.pc-ask textarea { width: 100%; box-sizing: border-box; font: inherit; font-size: var(--fs-xs); padding: 4px 6px; border: var(--bw-hair) solid var(--border-strong); border-radius: var(--radius-sm); }
.pc-ask .pc-btn { align-self: flex-start; }
.pc-tuned { display: inline-block; margin-top: 2px; font-size: 11px; color: var(--accent); }

/* 新品墙（10-23） */
.pc-mode { display: inline-flex; gap: 2px; background: var(--surface-sunken); border-radius: var(--radius-full); padding: 2px; margin-bottom: var(--sp-2); }
.pc-mode button { border: 0; background: none; padding: 3px 14px; border-radius: var(--radius-full); font: inherit; font-size: var(--fs-xs); cursor: pointer; color: var(--text-secondary); }
.pc-mode button.on { background: var(--surface); color: var(--text-primary); font-weight: var(--fw-semibold); box-shadow: 0 1px 2px rgba(0,0,0,.08); }
.pw-top { justify-content: space-between; }
.pw-boardbox { margin: var(--sp-2) 0 var(--sp-3); font-size: var(--fs-xs); }
.pw-boardbox summary { cursor: pointer; color: var(--text-secondary); }
.pw-board td, .pw-board th { text-align: center; }
.pw-board td:first-child { text-align: left; }
.pw-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: var(--sp-3); }
.pw-card { display: flex; gap: var(--sp-2); border: var(--bw-hair) solid var(--border-subtle); border-radius: var(--radius-md); background: var(--surface); padding: var(--sp-2); }
.pw-card.late { border-color: var(--danger-fg); }
.pw-card.due { border-color: var(--warning-fg); }
.pw-pic { flex: 0 0 96px; }
.pw-pic img { width: 96px; height: 96px; object-fit: cover; border-radius: var(--radius-sm); cursor: zoom-in; }
.pw-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; font-size: var(--fs-xs); }
.pw-name { display: flex; flex-wrap: wrap; gap: 6px; align-items: baseline; }
.pw-name code { font-size: 11px; background: var(--surface-sunken); padding: 0 4px; border-radius: var(--radius-sm); }
.pw-src { color: var(--text-muted); font-size: 11px; }
.pw-late { color: var(--danger-fg); font-weight: var(--fw-semibold); font-size: 11px; }
.pw-who { color: var(--text-secondary); }
.pw-owner { font: inherit; font-size: 11px; border: var(--bw-hair) solid var(--border-subtle); border-radius: var(--radius-sm); padding: 0 4px; }
.pw-sell, .pw-said, .pw-nas { margin: 0; color: var(--text-secondary); }
.pw-nas code { font-size: 10px; word-break: break-all; }
.pw-steps { display: flex; list-style: none; margin: 4px 0; padding: 0; gap: 2px; }
.pw-steps li { flex: 1; text-align: center; font-size: 11px; padding: 2px 0; background: var(--surface-sunken); color: var(--text-muted); border-radius: 3px; }
.pw-steps li.ok { background: var(--success-bg); color: var(--success-fg); }
.pw-steps li.skip { text-decoration: line-through; }
.pw-steps li.cur { background: var(--accent); color: var(--text-on-accent); font-weight: var(--fw-semibold); }
.pw-dkhs { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; }
.pw-dkhs label { display: flex; gap: 4px; align-items: center; }
.pw-dkhs input, .pw-eval textarea, .pw-next input { flex: 1; font: inherit; font-size: 11px; border: var(--bw-hair) solid var(--border-strong); border-radius: var(--radius-sm); padding: 2px 4px; min-width: 0; }
.pw-eval textarea { width: 100%; box-sizing: border-box; margin-top: 4px; }
.pw-no { color: var(--danger-fg); }
@media (max-width: 520px) { .pw-grid { grid-template-columns: 1fr; } }
.pw-shot { margin-bottom: var(--sp-2); }
.pw-cmts { border-top: var(--bw-hair) dashed var(--border-subtle); padding-top: 4px; }
.pw-cmts p { margin: 0 0 2px; color: var(--text-secondary); }
.pw-cmt-in { display: flex; gap: 4px; }
.pw-cmt-in input, .pw-next textarea { flex: 1; font: inherit; font-size: 11px; border: var(--bw-hair) solid var(--border-subtle); border-radius: var(--radius-sm); padding: 2px 4px; min-width: 0; }
.pw-next textarea { width: 100%; box-sizing: border-box; margin: 4px 0; }
/* 新品墙第三版（10-23 晚老板批注：一行一款、环节可选） */
.pw-grid { grid-template-columns: 1fr; }
.pw-card { display: grid; grid-template-columns: 96px minmax(0, 1fr) 340px; gap: var(--sp-3); align-items: start; }
.pw-side { display: flex; flex-direction: column; gap: 6px; font-size: var(--fs-xs); border-left: var(--bw-hair) solid var(--border-subtle); padding-left: var(--sp-3); }
.pw-side textarea { width: 100%; box-sizing: border-box; font: inherit; font-size: 11px; border: var(--bw-hair) solid var(--border-strong); border-radius: var(--radius-sm); padding: 3px 5px; }
.pw-verdict { margin: 0; color: var(--text-secondary); }
.pw-acts { display: flex; flex-wrap: wrap; gap: 4px; }
.pw-chip { border: var(--bw-hair) solid var(--border-strong); background: var(--surface); border-radius: var(--radius-full); padding: 1px 9px; font: inherit; font-size: 11px; cursor: pointer; color: var(--text-secondary); }
.pw-chip small { margin-left: 3px; font-size: 10px; }
.pw-chip.s-todo { background: var(--accent-soft-bg); border-color: var(--accent); color: var(--accent); font-weight: var(--fw-semibold); }
.pw-chip.s-done { background: var(--success-bg); border-color: var(--success-fg); color: var(--success-fg); }
.pw-chip.s-no { text-decoration: line-through; color: var(--text-muted); border-style: dashed; }
@media (max-width: 900px) { .pw-card { grid-template-columns: 72px minmax(0, 1fr); } .pw-side { grid-column: 1 / -1; border-left: 0; padding-left: 0; } .pw-pic img { width: 72px; height: 72px; } }