/* 第 12 轮四稿 · 己：资产、分镜、视频、交付。版式类由戊提供，这里只写内容与卡片。 */

/* 根节点不生成盒子：让戊的 .r12-ws height:100% 直接对内容区计算，面板底才落在主控顶 − 8 */
.r12x-stage {
  display: contents;
  color: var(--r12-ink);
}

/* 窄窗口：全集两个面板并排（340 侧栏），不堆到第二行 */
.r12f-project.is-narrow .r12x-stage-storyboard[data-scope='all'] .r12-ws.is-main-side,
.r12f-project.is-narrow .r12x-stage-video[data-scope='all'] .r12-ws.is-main-side,
.r12f-project.is-narrow .r12x-stage-delivery[data-scope='all'] .r12-ws.is-main-side {
  grid-template-columns: minmax(0, 1fr) 340px;
}

/* 窄窗口浮层里放的就是原来的侧栏面板 */
.r12x-side-float { padding: 8px; gap: 8px; }
.r12x-side-float > * { flex: 1; min-height: 0; }
.r12x-side-float > .r12x-refs-col { display: flex; flex-direction: column; gap: 8px; }

/* ── 资产生成卡 ─────────────────────────────────────────────── */

.r12x-head-tools { display: flex; align-items: center; gap: 8px; margin-left: auto; }

.r12x-count { font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); font-weight: 500; }

.r12x-search { width: 220px; height: 28px; flex: none; gap: 6px; padding: 0 8px; }
.r12x-search > svg { width: 16px; height: 16px; flex: none; color: var(--r12-muted); }
.r12x-search input { flex: 1; min-width: 0; height: 100%; padding: 0; border: 0; background: transparent; color: var(--r12-ink); font: inherit; outline: none; }

.r12x-asset-scroll { flex: 1; min-height: 0; overflow: auto; display: flex; flex-direction: column; gap: 12px; }

.r12x-group { display: flex; flex-direction: column; gap: 8px; }
.r12x-group-head { display: flex; align-items: baseline; gap: 6px; font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); }
.r12x-group-head b { font-weight: 600; color: var(--r12-ink); }
.r12x-group-head span { color: var(--r12-muted); font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); }

/* 20271 资产库（ui/pages/styles/workbench.css:48-54）：卡宽 152、列间距 12、内边距 6、图 4:3 的位置让给原图横版 */
.r12x-grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, 152px); justify-content: start; align-items: start; }
.r12x-grid.is-char, .r12x-grid.is-scene, .r12x-grid.is-prop, .r12x-grid.is-voice { grid-template-columns: repeat(auto-fill, 152px); }
.r12x-grid > .is-hidden { display: none; }
.r12x-group.is-hidden { display: none; }

.r12x-asset-card { width: 152px; padding: 6px; cursor: pointer; transition: border-color 160ms var(--r12-ease); }
.r12x-asset-card:hover { border-color: rgba(255, 255, 255, .28); }
:root[data-mode='light'] .r12x-asset-card:hover { border-color: rgba(17, 17, 26, .28); }
.r12x-asset-card[aria-pressed='true']:hover { border-color: var(--r12-selected-border); }
.r12x-asset-card .r12-card-media { width: 100%; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 8px; background: var(--r12-surface-3); }
.r12x-asset-card.r12x-asset-prop .r12-card-media { aspect-ratio: 1 / 1; }
.r12x-asset-card .r12-card-media img,
.r12x-asset-card .r12-card-media .r12x-art { width: 100%; height: 100%; display: block; object-fit: contain; }
.r12x-asset-card .r12-card-media .r12x-art svg { width: 100%; height: 100%; }
.r12x-asset-card .r12-card-body { gap: 2px; padding: 0; }
.r12x-asset-card .r12-card-name { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); font-weight: 600; }

.r12x-badge { display: inline-flex; align-items: center; height: 18px; margin-left: 6px; padding: 0 6px; border-radius: var(--r12-r-pill); background: var(--r12-surface-3); color: var(--r12-muted); font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); font-weight: 500; }

.r12x-status-line { display: flex; align-items: center; gap: 4px; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }
.r12x-status-line .r12-btn { margin-left: auto; }

.r12x-art { width: 100%; height: 100%; display: block; }
.r12x-art svg { width: 100%; height: 100%; display: block; }

.r12x-fail { display: grid; place-items: center; padding: 8px; background: var(--r12-surface-3); }
.r12x-fail-text { font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); text-align: center; }

.r12x-cover { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; background: color-mix(in srgb, var(--r12-bg) 58%, transparent); color: var(--r12-ink); font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); font-weight: 500; }
.r12x-spinner { width: 18px; height: 18px; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: r12x-spin 720ms linear infinite; }
@keyframes r12x-spin { to { transform: rotate(360deg); } }
.r12x-regen { align-self: flex-start; margin-top: 2px; }

.r12x-voice-media { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; color: var(--r12-muted); }
.r12x-wave svg { width: 28px; height: 28px; }
.r12x-wave-chip { position: absolute; right: 6px; bottom: 6px; }
.r12x-voice-play { margin-left: auto; }

/* ── 角色音色检查点：共用自适应资产卡；本层只处理资产页外壳 ── */
.r12x-voices { display: block; min-width: 0; }
.r12x-voices .ft-voice-list { max-width: none; }
[data-r12av2-panel='voices'] .r12av2-head-copy > span { display: none; }

/* ── 资产详情（常驻右栏，宽度由 .is-main-side 的 400 决定） ── */

.r12x-detail { min-height: 0; }
.r12x-detail-body { flex: 1; min-height: 0; overflow: auto; display: flex; flex-direction: column; gap: 10px; }
.r12x-detail-name { font-weight: 500; color: var(--r12-muted); }
.r12x-resolution { margin: 0; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }
.r12x-team-version { display: flex; flex-direction: column; gap: 4px; padding: 8px 10px; border: 1px solid var(--r12-line); border-radius: var(--r12-r-control); background: var(--r12-surface-2); }
.r12x-team-source, .r12x-team-new { margin: 0; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }
.r12x-team-new { display: flex; align-items: center; gap: 8px; color: var(--r12-ink); }
.r12x-swap-menu { display: flex; flex-direction: column; gap: 10px; padding: 4px; max-height: 420px; overflow: auto; }
.r12x-swap-source h4 { margin: 0 0 6px; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); font-weight: 600; color: var(--r12-muted); }
.r12x-swap-items { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.r12x-swap-item { display: flex; flex-direction: column; gap: 4px; padding: 4px; border: 1px solid var(--r12-line); border-radius: var(--r12-r-control); background: var(--r12-surface-2); color: var(--r12-ink); cursor: pointer; }
.r12x-swap-item img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; border-radius: var(--r12-r-media); background: var(--r12-surface-3); }
.r12x-swap-item span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); }

.r12x-detail-media { position: relative; flex: none; aspect-ratio: 16 / 9; border-radius: var(--r12-r-card); overflow: hidden; background: var(--r12-surface-3); }
.r12x-detail-media.r12-zoomable { cursor: zoom-in; }
.r12x-detail-media img,
.r12x-detail-media .r12x-art { width: 100%; height: 100%; object-fit: contain; display: block; }

.r12x-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.r12x-desc { margin: 0; font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); color: var(--r12-muted); }
.r12x-forms-head { display: flex; align-items: center; gap: 8px; }
.r12x-forms-head h3 { flex: 1; min-width: 0; font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); font-weight: 600; color: var(--r12-ink); }

.r12x-timeline { display: flex; flex-direction: column; gap: 6px; }
.r12x-form-row { display: flex; align-items: center; gap: 8px; }
.r12x-form-label { width: 92px; flex: none; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); white-space: nowrap; }
.r12x-cells { flex: 1; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 2px; }
.r12x-cell { height: 8px; border-radius: var(--r12-r-pill); background: var(--r12-surface-3); }
.r12x-cell.is-on { background: color-mix(in srgb, var(--r12-ink) 52%, transparent); }

.r12x-prompt { border: 1px solid var(--r12-line); border-radius: var(--r12-r-control); padding: 8px 10px; }
.r12x-prompt summary { cursor: pointer; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); list-style: none; }
.r12x-prompt summary::-webkit-details-marker { display: none; }
.r12x-prompt p { margin: 6px 0 0; }

.r12x-history-head { font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }
.r12x-history { display: flex; gap: 6px; overflow: auto; padding-bottom: 2px; flex-shrink: 0; min-height: 40px; }
.r12x-thumb { flex: none; width: 56px; height: 38px; padding: 0; border: 1px solid var(--r12-line); border-radius: var(--r12-r-media); overflow: hidden; background: var(--r12-surface-3); }
.r12x-thumb img { width: 100%; height: 100%; display: block; object-fit: cover; }
.r12x-thumb[aria-pressed='true'] { border-color: var(--r12-selected-border); box-shadow: 0 0 0 1px var(--r12-selected-border); }

.r12x-detail-foot { flex: none; display: flex; gap: 8px; padding: 8px 12px; border-top: 1px solid var(--r12-line); }

/* ── 资产提示词 / 音色 行 ──────────────────────────────────── */

.r12x-row { display: flex; align-items: center; gap: 10px; min-height: 36px; padding: 4px 4px; border-bottom: 1px solid var(--r12-line); min-width: 0; }
.r12x-row:last-child { border-bottom: 0; }
.r12x-prompt-row { min-height: 56px; align-items: flex-start; }
.r12x-row-thumb { flex: none; width: 40px; height: 40px; border-radius: var(--r12-r-media); overflow: hidden; background: var(--r12-surface-3); display: block; }
.r12x-row-thumb img, .r12x-row-thumb .r12x-art { width: 100%; height: 100%; display: block; object-fit: cover; }
.r12x-row-icon { flex: none; width: 32px; height: 32px; display: grid; place-items: center; border-radius: var(--r12-r-control); background: var(--r12-surface-3); color: var(--r12-muted); }
.r12x-row-icon svg { width: 16px; height: 16px; }
.r12x-row-title { flex: none; min-width: 96px; font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); font-weight: 600; }
.r12x-row-edit { flex: 1; min-width: 0; font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); color: var(--r12-ink); white-space: normal; }
.r12x-row-desc { flex: 1; min-width: 0; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.r12x-row-side { flex: none; display: flex; align-items: center; gap: 8px; }

/* ── 分镜 ──────────────────────────────────────────────────── */

.r12x-storyboard { min-height: 0; }
.r12x-group-list-panel, .r12x-current-group, .r12x-refs-col { min-height: 0; }
.r12x-group-list { flex: 1; min-height: 0; overflow: auto; display: flex; flex-direction: column; gap: 2px; padding: 0 8px 8px; }
.r12x-group-item { display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 1px; min-height: 40px; padding: 6px 12px; border: 0; border-radius: var(--r12-r-control); background: transparent; color: var(--r12-ink); text-align: left; }
.r12x-group-item:hover { background: var(--r12-hover); }
.r12x-group-item[aria-pressed='true'] { background: var(--r12-selected-bg); box-shadow: var(--r12-selected-shadow, none); }
.r12x-group-line { align-self: stretch; display: flex; align-items: baseline; gap: 6px; min-width: 0; }
.r12x-group-id { flex: none; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); font-weight: 600; color: var(--r12-muted); }
.r12x-group-title { min-width: 0; font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.r12x-group-meta { font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); white-space: nowrap; }

.r12x-current-group { display: flex; flex-direction: column; }
.r12x-current-group .r12-panel-head h3.r12x-current-title { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.r12x-current-body { flex: 1; min-height: 0; overflow: auto; padding: 0 12px 10px; }
.r12x-shots { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px; }

.r12x-shot-card { display: flex; flex-direction: column; gap: 6px; padding: 6px; border: 1px solid var(--r12-line); border-radius: var(--r12-r-card); background: var(--r12-surface-2); min-width: 0; }
.r12x-shot-card .r12-card-media { width: 100%; }
.r12x-shot-no, .r12x-shot-time { position: absolute; bottom: 6px; height: 20px; display: inline-flex; align-items: center; padding: 0 6px; border-radius: var(--r12-r-pill); background: color-mix(in srgb, var(--r12-bg) 66%, transparent); color: var(--r12-ink); font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); font-weight: 600; }
.r12x-shot-no { left: 6px; }
.r12x-shot-time { right: 6px; }
.r12x-shot-meta { display: flex; align-items: center; justify-content: space-between; gap: 6px; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }
.r12x-shot-meta b { font-weight: 600; color: var(--r12-ink); }
.r12x-shot-desc, .r12x-shot-line, .r12x-shot-cast { margin: 0; font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); color: var(--r12-muted); }
.r12x-shot-desc { color: var(--r12-ink); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.r12x-editable { border-radius: 6px; }
.r12x-editable:hover { background: var(--r12-hover); }

.r12x-middle-col { display: flex; flex-direction: column; gap: 8px; min-height: 0; min-width: 0; }
.r12x-middle-col > .r12x-current-group { flex: 1; min-height: 0; }
.r12x-review-card { flex: none; border: 1px solid var(--r12-line); border-radius: var(--r12-r-card); background: var(--r12-surface); }
.r12x-review { flex: none; display: flex; align-items: center; flex-wrap: wrap; gap: 8px; padding: 8px 12px; border-top: 1px solid var(--r12-line); }
.r12x-review-card .r12x-review { border-top: 0; }
.r12x-review-state { display: flex; align-items: center; flex: none; gap: 4px; margin-right: auto; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); white-space: nowrap; }
.r12x-review-actions { display: flex; align-items: center; flex: none; flex-wrap: nowrap; gap: 8px; margin-left: auto; }

.r12x-axis { display: flex; flex-direction: column; gap: 10px; padding: 4px 2px 8px; }
.r12x-axis-line { position: relative; height: 1px; margin: 20px 24px; background: var(--r12-line-strong); }
.r12x-axis-dot { position: absolute; top: -4px; width: 8px; height: 8px; border-radius: 50%; background: var(--r12-ink); }
.r12x-axis-dot.is-0 { left: 0; }
.r12x-axis-dot.is-1 { left: 50%; }
.r12x-axis-dot.is-2 { left: 100%; }
.r12x-axis-row { display: grid; grid-template-columns: 44px minmax(0, 1fr) minmax(0, 1fr); gap: 8px; align-items: center; padding: 6px 10px; border: 1px solid var(--r12-line); border-radius: var(--r12-r-control); font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }
.r12x-axis-row b { color: var(--r12-ink); font-weight: 600; }

.r12x-refs-col { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.r12x-refs-half, .r12x-video-half { flex: 1 1 50%; min-height: 0; }
.r12x-refs-body { flex: 1; min-height: 0; overflow: auto; }
.r12x-ref-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.r12x-ref { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.r12x-ref img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; border-radius: var(--r12-r-media); background: var(--r12-surface-3); }
.r12x-ref small { font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.r12x-preview-body { flex: 1; min-height: 0; overflow: auto; display: flex; flex-direction: column; gap: 8px; }
.r12x-preview { position: relative; aspect-ratio: 16 / 9; border-radius: var(--r12-r-card); overflow: hidden; background: var(--r12-surface-3); }
.r12x-preview img { width: 100%; height: 100%; display: block; object-fit: cover; }
.r12x-play-big { position: absolute; inset: 0; margin: auto; background: color-mix(in srgb, var(--r12-bg) 58%, transparent); color: var(--r12-ink); }
.r12x-note { margin: 0; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }

/* ── 视频 ──────────────────────────────────────────────────── */

.r12x-video-prompt { display: flex; flex-direction: column; }
.r12x-video-body { flex: 1; min-height: 0; display: flex; flex-direction: column; }
/* 补24：参考图条、本组总述、镜头行 */
.r12x-prompt-body { gap: 8px; overflow: hidden; }
.r12x-shot-error { margin: 0; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-error); }
.r12x-ref-strip { display: flex; align-items: center; gap: 8px; flex: none; }
.r12x-ref-thumb, .r12x-ref-add { width: 40px; height: 40px; flex: none; padding: 0; display: grid; place-items: center; border: 1px solid var(--r12-line); border-radius: 8px; overflow: hidden; background: var(--r12-surface-3); color: var(--r12-muted); }
.r12x-ref-thumb img, .r12x-ref-thumb .r12x-art { width: 40px; height: 40px; display: block; object-fit: cover; }
.r12x-ref-add svg { width: 20px; height: 20px; }
.r12x-ref-voice { height: 40px; flex: none; display: inline-flex; align-items: center; gap: 6px; padding: 0 10px; border: 1px solid var(--r12-line); border-radius: 8px; background: var(--r12-surface-3); font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-ink); }
.r12x-ref-voice svg { width: 16px; height: 16px; flex: none; }
.r12x-video-summary { flex: none; font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); color: var(--r12-ink); }
.r12x-video-summary-text, .r12x-shot-desc-text { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); }
.r12x-shot-rows { flex: 1; min-height: 0; overflow: auto; display: flex; flex-direction: column; gap: 12px; padding-right: 2px; }
.r12x-shot-row { display: grid; grid-template-columns: auto auto minmax(0, 1fr); align-items: start; gap: 8px; border-radius: var(--r12-r-control); }
.r12x-shot-row.is-selected { background: var(--r12-selected-bg); box-shadow: inset 0 0 0 1px var(--r12-selected-border); }
.r12x-shot-no { height: 20px; padding: 0 6px; border-radius: 4px; background: var(--r12-surface-3); font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); font-weight: 600; color: var(--r12-ink); }
/* 补24：镜头行里的镜头头，行内胶囊，不绝对定位（分镜卡图片上的 .r12x-shot-no 角标不动） */
.r12x-line-no { position: static; flex: none; display: inline-flex; align-items: center; height: 20px; padding: 0 8px; border-radius: var(--r12-r-pill); background: var(--r12-surface-3); color: var(--r12-ink); font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); font-weight: 600; }
.r12x-shot-dur { height: 20px; padding: 0 6px; display: inline-flex; align-items: center; gap: 2px; border: 1px solid var(--r12-line); border-radius: 4px; background: transparent; color: var(--r12-ink); font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); }
.r12x-shot-dur svg { width: 12px; height: 12px; }
.r12x-shot-desc { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; min-width: 0; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); }
.r12x-shot-desc-text { min-width: 0; }
.r12x-asset-tag { display: inline-flex; align-items: center; gap: 4px; height: 20px; padding: 0 6px 0 2px; border-radius: 4px; background: var(--r12-surface-3); font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-ink); white-space: nowrap; }
.r12x-asset-tag img { width: 16px; height: 16px; border-radius: 4px; object-fit: cover; display: block; }
.r12x-group-quote { flex: none; }

.r12x-field-row.is-duration { align-items: center; }
.r12x-duration { display: flex; align-items: center; gap: 8px; flex: 1; min-width: 0; }
.r12x-duration input[type='range'] { flex: 1; min-width: 70px; accent-color: var(--r12-ink); }
.r12x-duration input[type='number'] { width: 56px; height: 28px; border: 1px solid var(--r12-line); border-radius: var(--r12-r-control); background: var(--r12-surface-3); color: var(--r12-ink); text-align: center; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); }
.r12x-video-prompt-body { flex: 1; min-height: 0; overflow: auto; display: flex; flex-direction: column; gap: 10px; }
.r12x-prompt-full { margin: 0; padding: 8px 10px; border-radius: var(--r12-r-control); background: var(--r12-surface-3); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); color: var(--r12-ink); white-space: pre-wrap; }
.r12x-shot-breakdown { display: flex; flex-direction: column; gap: 6px; }

.r12x-video-settings, .r12x-video-info { display: flex; flex-direction: column; }
/* 补25：右栏顶部的本组预览 */
.r12x-prompt-preview { position: relative; width: 100%; aspect-ratio: 16 / 9; flex: none; border-radius: 12px; overflow: hidden; background: color-mix(in srgb, var(--r12-bg) 82%, #000); }
.r12x-prompt-preview > img { width: 100%; height: 100%; display: block; object-fit: cover; }
.r12x-prompt-preview.is-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; border: 1px solid var(--r12-line); background: var(--r12-surface-3); }
.r12x-preview-play { width: 32px; height: 32px; color: var(--r12-muted); }
.r12x-preview-play svg { width: 32px; height: 32px; }
.r12x-preview-empty { font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); color: var(--r12-muted); }
.r12x-video-settings-body, .r12x-video-info-body { flex: 1; min-height: 0; overflow: auto; display: flex; flex-direction: column; gap: 10px; }
.r12x-field-row { display: flex; align-items: center; gap: 8px; min-height: 28px; }
.r12x-field-row > span:first-child { flex: none; width: 52px; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }
.r12x-value { font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); color: var(--r12-ink); }
.r12x-model-row { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.r12x-model-btn svg { width: 14px; height: 14px; }
.r12x-model-btn[aria-pressed='true'] { background: var(--r12-selected-bg); color: var(--r12-ink); font-weight: 600; }
.r12x-duration-select, .r12x-res-select { height: 28px; min-width: 140px; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); }

.r12x-player-panel { display: flex; flex-direction: column; }
.r12x-player-body { flex: 1; min-height: 0; display: flex; flex-direction: column; gap: 8px; }
.r12x-player { position: relative; width: 100%; aspect-ratio: 16 / 9; border-radius: var(--r12-r-card); overflow: hidden; background: color-mix(in srgb, var(--r12-bg) 82%, #000); }
.r12x-player img { width: 100%; height: 100%; display: block; object-fit: cover; }
.r12x-thumb-strip { display: flex; gap: 8px; overflow: auto; flex: none; }
.r12x-video-thumb { position: relative; flex: none; width: 120px; padding: 0; border: 1px solid var(--r12-line); border-radius: var(--r12-r-card); overflow: hidden; background: var(--r12-surface-2); }
.r12x-video-thumb img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; display: block; }
.r12x-video-thumb span { position: absolute; right: 4px; bottom: 4px; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: #fff; }
.r12x-video-thumb.is-active { border-color: var(--r12-selected-border); box-shadow: 0 0 0 1px var(--r12-selected-border); }
.r12x-video-thumb.is-adopted .r12x-thumb-check { position: absolute; top: 4px; left: 4px; width: 18px; height: 18px; display: grid; place-items: center; border-radius: 50%; background: var(--r12-ink); color: var(--r12-bg); }
.r12x-video-thumb .r12x-thumb-check svg { width: 12px; height: 12px; }

.r12x-adopt { align-self: flex-start; }
.r12x-adopt.is-adopted { color: var(--r12-ink); }

/* ── 交付 ──────────────────────────────────────────────────── */

.r12x-delivery-center { display: flex; flex-direction: column; }
.r12x-delivery-list { flex: 1; min-height: 0; overflow: auto; }
.r12x-check-block { padding: 8px 0; border-bottom: 1px solid var(--r12-line); }
.r12x-check-block:last-child { border-bottom: 0; }
.r12x-check-title { font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); font-weight: 600; padding: 2px 0 6px; }
.r12x-check-row { display: flex; align-items: center; gap: 8px; min-height: 36px; padding: 2px 0; border-bottom: 1px solid var(--r12-line); font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); }
.r12x-check-row:last-child { border-bottom: 0; }
.r12x-check-name { flex: none; width: 84px; color: var(--r12-ink); white-space: nowrap; }
.r12x-check-note { flex: 1; min-width: 0; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.r12x-check-row .r12-btn { margin-left: auto; flex: none; }

.r12x-delivery-side { display: flex; flex-direction: column; }
.r12x-delivery-side-body { flex: 1; min-height: 0; overflow: auto; display: flex; flex-direction: column; gap: 10px; }
.r12x-delivery-records { display: flex; flex-direction: column; gap: 4px; }
.r12x-export-row { display: flex; align-items: center; gap: 10px; min-height: 40px; padding: 4px 0; border-bottom: 1px solid var(--r12-line); }
.r12x-export-row:last-child { border-bottom: 0; }
.r12x-export-row .r12x-row-title { flex: 1; }
.r12x-export-row .r12x-row-desc { flex: none; }
.r12x-export-row .r12x-row-side { flex: none; }

/* ── 全集总揽 ─────────────────────────────────────────────── */

.r12x-all-main, .r12x-all-detail { min-height: 0; }
.r12x-all-scroll { flex: 1; min-height: 0; overflow: auto; }
.r12x-all-detail-body { flex: 1; min-height: 0; overflow: auto; display: flex; flex-direction: column; gap: 10px; }

.r12x-all-table { display: flex; flex-direction: column; }
.r12x-all-row { display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 4px 8px; border: 0; border-bottom: 1px solid var(--r12-line); background: transparent; color: var(--r12-ink); text-align: left; width: 100%; }
.r12x-all-row:last-child { border-bottom: 0; }
.r12x-all-row[aria-pressed='true'] { background: var(--r12-selected-bg); }
.r12x-all-ep { flex: none; width: 190px; font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.r12x-all-cell { flex: none; width: 64px; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }
.r12x-sb-thumbs { display: flex; gap: 4px; overflow: hidden; }
.r12x-sb-thumbs img { width: 56px; height: 32px; object-fit: cover; border-radius: var(--r12-r-media); display: block; }

.r12x-matrix { display: flex; flex-direction: column; gap: 4px; min-width: 560px; }
.r12x-matrix-head, .r12x-matrix-row { display: grid; grid-template-columns: 110px repeat(6, minmax(0, 1fr)); gap: 4px; align-items: center; }
.r12x-matrix-delivery .r12x-matrix-head,
.r12x-matrix-delivery .r12x-matrix-row { grid-template-columns: 110px repeat(5, minmax(0, 1fr)); }
.r12x-matrix-head { height: 28px; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }
.r12x-matrix-ep { font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); white-space: nowrap; }
.r12x-matrix-col { text-align: center; }
.r12x-matrix-cell { height: 34px; display: grid; place-items: center; padding: 0 4px; border: 1px solid var(--r12-line); border-radius: var(--r12-r-control); background: var(--r12-surface-2); color: var(--r12-ink); font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.r12x-matrix-cell.is-done { color: var(--r12-ok); }
.r12x-matrix-cell.is-review { color: var(--r12-review); }
.r12x-matrix-cell.is-todo { color: var(--r12-faint); }
.r12x-matrix-cell.is-active { border-color: var(--r12-selected-border); box-shadow: 0 0 0 1px var(--r12-selected-border); color: var(--r12-ink); }

.r12x-video-ep-list { display: flex; flex-direction: column; gap: 2px; flex: 1; min-height: 0; }
.r12x-video-ep-row { display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 4px 6px; border: 0; border-radius: var(--r12-r-control); background: transparent; color: var(--r12-ink); text-align: left; }
.r12x-video-ep-row img { width: 64px; height: 36px; object-fit: cover; border-radius: var(--r12-r-media); flex: none; }
.r12x-video-ep-row.is-active { background: var(--r12-selected-bg); box-shadow: var(--r12-selected-shadow, none); }
.r12x-video-ep-title { font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); font-weight: 600; }
.r12x-video-ep-meta { font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }
.r12x-matrix-cell svg { width: 16px; height: 16px; }

/* ── 通栏里的模型胶囊 ─────────────────────────────────────── */

.r12x-model-pill { display: inline-flex; align-items: center; height: 28px; gap: 4px; padding: 0 8px; border: 1px solid transparent; border-radius: var(--r12-r-pill); background: var(--r12-surface-3); color: var(--r12-ink); font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); font-weight: 500; white-space: nowrap; }
button.r12x-model-pill { cursor: pointer; }
button.r12x-model-pill:hover { border-color: var(--r12-line-strong); }
button.r12x-model-pill:focus-visible { outline: 2px solid var(--r12-ink); outline-offset: 2px; }
.r12x-model-pill svg { width: 14px; height: 14px; }
.r12x-model-pill.is-locked { cursor: default; color: var(--r12-muted); }
.r12x-model-pill.is-locked svg:last-of-type { width: 12px; height: 12px; }
.r12x-video-params { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.r12x-model-bar { flex: 1; min-width: 0; height: 28px; display: inline-flex; align-items: center; gap: 6px; padding: 0 8px; border: 1px solid var(--r12-line); border-radius: var(--r12-r-control); background: var(--r12-surface-3); color: var(--r12-ink); font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); cursor: pointer; }
.r12x-model-bar > span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-align: left; }
.r12x-model-bar svg { width: 14px; height: 14px; flex: none; }
.r12x-model-picker { display: flex; flex-direction: column; gap: 2px; }
.r12x-model-pick-row { display: flex; align-items: center; gap: 8px; height: 44px; padding: 0 10px; border: 0; border-radius: var(--r12-r-control); background: transparent; color: var(--r12-ink); font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); text-align: left; cursor: pointer; }
.r12x-model-pick-row:hover { background: var(--r12-hover); }
.r12x-model-pick-row.is-current { background: var(--r12-selected-bg); }
.r12x-model-pick-row svg { width: 16px; height: 16px; flex: none; }
.r12x-model-pick-name { flex: 1; min-width: 0; }

/* ── 生成材料弹窗、修改框 ─────────────────────────────────── */

.r12x-quote { display: flex; flex-direction: column; gap: 10px; }
.r12x-quote-lead { margin: 0; font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); color: var(--r12-muted); }
.r12x-quote-list { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 2px; }
.r12x-quote-list li { display: flex; align-items: center; gap: 8px; min-height: 32px; padding: 0 2px; border-bottom: 1px solid var(--r12-line); font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); color: var(--r12-ink); }
.r12x-quote-list li:last-child { border-bottom: 0; }
.r12x-quote-list svg { width: 16px; height: 16px; flex: none; color: var(--r12-ok); }
.r12x-quote-total { display: flex; align-items: center; justify-content: space-between; padding: 8px 10px; border-radius: var(--r12-r-control); background: var(--r12-surface-3); font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); color: var(--r12-muted); }
.r12x-quote-total b { color: var(--r12-ink); font-size: var(--r12-fs-title); line-height: var(--r12-lh-title); }
.r12x-prompt-block { display: flex; flex-direction: column; gap: 2px; padding: 8px 0; border-bottom: 1px solid var(--r12-line); }
.r12x-prompt-block:last-child { border-bottom: 0; }
.r12x-prompt-block b { font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); }
.r12x-prompt-block p { margin: 0; font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); color: var(--r12-muted); }
.r12x-textarea { height: auto; min-height: 120px; padding: 8px 10px; resize: vertical; font: inherit; line-height: var(--r12-lh-ui); }

/* ── 六稿：一键成片停点卡与每集卡 ─────────────────────────── */

.r12x-stop-wrap { display: flex; flex-direction: column; gap: 8px; height: 100%; min-height: 0; }
.r12x-stop-wrap > .r12-ws { flex: 1; min-height: 0; height: auto; }
/* 六稿十二：停止卡跟着内容长高，不再卡在 58% 后内部滚，整张卡的内容都要露出来 */
.r12x-stop-card { flex: none; min-height: 0; overflow: visible; }
.r12x-stop-head { flex: none; padding: 10px 14px 0; }
.r12x-stop-head h2 { margin: 0; font-size: var(--r12-fs-title); line-height: var(--r12-lh-title); font-weight: 600; color: var(--r12-ink); }
.r12x-stop-head p { margin: 3px 0 0; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }
.r12x-stop-body { flex: none; min-height: 0; overflow: visible; padding: 10px 14px; }
.r12x-stop-foot { flex: none; display: flex; align-items: center; gap: 8px; padding: 10px 14px; border-top: 1px solid var(--r12-line); }
.r12x-stop-note { margin-right: auto; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }
.r12x-stop-balance { margin: 0; padding: 0 14px 10px; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }

/* 停点卡独占工作区；底部主控是悬浮层，不从工作区高度中预留空白。 */
.r12x-stop-wrap.is-solo { height: 100%; overflow: hidden; }
.r12x-stop-wrap.is-solo > .r12x-stop-card {
  flex: 1 1 auto;
  min-height: 0;
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.r12x-stop-wrap.is-solo .r12x-stop-head,
.r12x-stop-wrap.is-solo .r12x-stop-foot { flex: none; }
.r12x-stop-wrap.is-solo .r12x-stop-body { flex: 1 1 auto; min-height: 0; overflow: auto; }
/* 停点卡自己内部滚，不再给页面叠第二层纵向滚动。 */
.r12f-content:has(.r12x-stop-wrap.is-solo) { overflow: hidden; }

.r12x-dress-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.r12x-dress-cell { display: flex; flex-direction: column; gap: 4px; min-width: 0; padding: 6px; border: 1px solid var(--r12-line); border-radius: var(--r12-r-card); background: var(--r12-surface-2); }
.r12x-dress-cell.is-selected { border-color: var(--r12-selected-border); box-shadow: 0 0 0 1px var(--r12-selected-border); }
.r12x-dress-media { position: relative; display: block; }
.r12x-dress-main { display: block; width: 100%; aspect-ratio: 16 / 9; padding: 0; border: 0; border-radius: 8px; overflow: hidden; background: var(--r12-surface-3); cursor: pointer; }
.r12x-dress-main img { width: 100%; height: 100%; display: block; object-fit: cover; }
.r12x-dress-zoom,
.r12x-dress-alt-zoom {
  position: absolute;
  top: 4px;
  right: 4px;
  z-index: 1;
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid var(--r12-line-strong, var(--r12-line));
  border-radius: var(--r12-r-pill);
  background: color-mix(in srgb, var(--r12-surface) 84%, transparent);
  color: var(--r12-ink);
  box-shadow: 0 1px 4px rgba(0, 0, 0, .28);
  cursor: zoom-in;
}
.r12x-dress-zoom:hover,
.r12x-dress-alt-zoom:hover { background: var(--r12-surface); }
.r12x-dress-zoom svg { width: 13px; height: 13px; }
.r12x-dress-alt-zoom { top: 2px; right: 2px; width: 18px; height: 18px; }
.r12x-dress-alt-zoom svg { width: 11px; height: 11px; }
.r12x-dress-name { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); font-weight: 600; }
.r12x-dress-alts { display: flex; flex-wrap: wrap; gap: 4px; }
.r12x-dress-alt-wrap { position: relative; display: block; flex: 0 0 calc(50% - 2px); aspect-ratio: 16 / 9; }
.r12x-dress-alt-wrap .r12x-dress-alt { display: block; width: 100%; height: 100%; padding: 0; border: 1px solid var(--r12-line); border-radius: 6px; overflow: hidden; background: var(--r12-surface-3); cursor: pointer; }
.r12x-dress-alt img { width: 100%; height: 100%; display: block; object-fit: cover; }
.r12x-dress-redo { align-self: flex-start; }

/* 样片媒体保持 16:9；意见在右，余额与操作收进卡头，避开悬浮主控。 */
.r12x-sample-head { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; padding-bottom: 10px; border-bottom: 1px solid var(--r12-line); }
.r12x-sample-demo { display: inline-flex; align-items: center; height: 18px; margin-left: 6px; padding: 0 6px; border-radius: 999px; background: var(--r12-surface-3); color: var(--r12-muted); font-size: var(--r12-fs-small); line-height: 18px; font-weight: 500; white-space: nowrap; vertical-align: middle; }
.r12x-sample-head-actions { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 6px; margin-left: auto; min-width: 0; }
.r12x-sample-head-actions > .r12-btn,
.r12x-sample-head-actions > .r12x-stop-balance { white-space: nowrap; }
.r12x-sample-head .r12x-stop-balance { margin: 0 4px 0 0; padding: 0; }
.r12x-sample-body { display: flex; gap: 12px; align-items: flex-start; }
.r12x-sample-body > .r12x-player {
  flex: 0 0 auto;
  width: min(calc(40vh * 16 / 9), calc(100% - 312px));
  /* 样片源是 640×360：大窗口也不放大到原始像素以上。 */
  max-width: 640px;
  aspect-ratio: 16 / 9;
}
.r12x-sample-player .r12vp { height: 100%; min-height: 0; }
.r12x-sample-player .r12vp-video { flex: 1 1 auto; min-height: 0; height: auto; aspect-ratio: auto; object-fit: contain; }
.r12x-sample-unavailable { margin: 0; padding: 16px; color: var(--r12-muted); }
.r12x-sample-side { flex: 1; min-width: 0; min-height: 0; display: flex; flex-direction: column; gap: 8px; }
.r12x-sample-notes { width: 100%; flex: none; display: flex; flex-direction: column; gap: 8px; }
.r12x-sample-actions { flex-wrap: wrap; }
.r12x-sample-actions .r12x-stop-balance { flex: 1 0 100%; margin: 0; padding: 0; }
.r12x-sample-note { display: flex; flex-direction: column; gap: 4px; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }
.r12x-sample-note textarea { min-height: 62px; resize: vertical; padding: 6px 8px; border: 1px solid var(--r12-line); border-radius: var(--r12-r-control); background: var(--r12-surface-3); color: var(--r12-ink); font: inherit; font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); }

/* 短窗口（600 高实测）：视频按可用高度反算 16:9，完整连控制区留在工作区内；
   三个意见框压成紧凑三行，不和视频抢高度。900 / 1000 高不走这条。 */
@media (max-height: 720px) {
  .r12x-stop-wrap.is-solo .r12x-sample-body { align-items: stretch; gap: 10px; }
  .r12x-stop-wrap.is-solo .r12x-sample-body > .r12x-player {
    flex: 0 1 auto;
    width: auto;
    height: min(100%, 360px, calc(100vh - 360px));
    max-width: min(640px, calc(100% - 300px));
    min-height: 0;
  }
  .r12x-stop-wrap.is-solo .r12x-sample-side { min-height: 0; justify-content: center; }
  .r12x-stop-wrap.is-solo .r12x-sample-notes { gap: 4px; }
  .r12x-stop-wrap.is-solo .r12x-sample-note { gap: 2px; }
  .r12x-stop-wrap.is-solo .r12x-sample-note textarea {
    height: 34px;
    min-height: 34px;
    padding: 3px 6px;
    resize: none;
    overflow-y: auto;
  }
}

.r12x-ep-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
@media (min-width: 1600px) { .r12x-ep-cards { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.r12x-ep-card { padding: 0; overflow: hidden; }
.r12x-ep-card .r12-panel-head { padding: 0 10px; }
.r12x-ep-card-body { display: flex; flex-direction: column; gap: 8px; padding: 8px 10px 10px; }
.r12x-ep-progress { display: flex; justify-content: space-between; gap: 8px; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }
.r12x-ep-items { display: flex; flex-wrap: wrap; gap: 3px 10px; }
.r12x-ep-item { display: inline-flex; align-items: center; gap: 4px; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-ink); }
.r12x-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--r12-line-strong); flex: none; }
.r12x-dot.is-done { background: var(--r12-ink); }
.r12x-dot.is-review { background: var(--r12-error); }
.r12x-ep-foot { display: flex; align-items: center; gap: 8px; padding-top: 6px; border-top: 1px solid var(--r12-line); }
.r12x-ep-review { display: inline-flex; align-items: center; gap: 6px; margin-right: auto; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }

/* 七稿 31：分组预览和画面对比都算详情，遮罩从顶栏底开始，卡片再离顶栏 8 */
.r12-dialog-backdrop[data-r12-dialog="r12x-sb-preview"],
.r12-dialog-backdrop[data-r12-dialog="r12x-video-compare"] {
  top: var(--r12-topbar-h, 48px);
}
.r12x-anchor-form { display: flex; flex-direction: column; gap: 10px; padding: 12px; }
.r12x-anchor-foot { display: flex; justify-content: flex-end; gap: 8px; }

html[data-motion='reduced'] .r12x-spinner { animation: none; }

/* ── 七稿：分镜表、全集折叠、本集详情 ─────────────────────── */
.r12x-sb-groups { display: flex; flex-direction: column; gap: 12px; padding: 10px 0 4px; }
.r12x-sb-group { display: flex; flex-direction: column; gap: 8px; padding: 10px 12px 12px; border: 1px solid var(--r12-line); border-radius: var(--r12-r-card); background: var(--r12-surface-2); }
.r12x-sb-group-head { display: flex; align-items: center; gap: 10px; }
.r12x-sb-group-head h3 { flex: 1; min-width: 0; margin: 0; font-size: var(--r12-fs-title); line-height: var(--r12-lh-title); font-weight: 600; color: var(--r12-ink); }
.r12x-sb-table-wrap { overflow-x: auto; }
.r12x-sb-table { width: 100%; min-width: 680px; border-collapse: collapse; table-layout: fixed; }
.r12x-sb-table th, .r12x-sb-table td { padding: 6px 8px; border-bottom: 1px solid var(--r12-line); text-align: left; vertical-align: top; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }
.r12x-sb-table th { font-weight: 500; white-space: nowrap; }
.r12x-sb-table th:nth-child(1) { width: 56px; }
.r12x-sb-table th:nth-child(2) { width: 72px; }
.r12x-sb-table th:nth-child(3) { width: 64px; }
.r12x-sb-table th:nth-child(4) { width: 64px; }
.r12x-sb-table th:nth-child(7) { width: 52px; }
.r12x-sb-table th:nth-child(8) { width: 58px; }
.r12x-sb-table tr:last-child td { border-bottom: 0; }
.r12x-sb-table .r12x-shot-card.is-selected td { background: var(--r12-selected-bg); }
.r12x-sb-table .r12x-shot-card.is-selected td:first-child { box-shadow: inset 2px 0 0 var(--r12-selected-border); }
.r12x-ref-assets { display: flex; flex-direction: column; gap: 6px; }
.r12x-ref-asset { display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 4px; border: 1px solid transparent; border-radius: var(--r12-r-control); }
.r12x-ref-asset.is-active { border-color: var(--r12-selected-border); background: var(--r12-selected-bg); }
.r12x-ref-asset-img { flex: none; width: 44px; height: 32px; border-radius: var(--r12-r-media); overflow: hidden; background: var(--r12-surface-3); }
.r12x-ref-asset-img img, .r12x-ref-asset-img .r12x-art { width: 100%; height: 100%; display: block; object-fit: cover; }
.r12x-ref-asset-main { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.r12x-ref-asset-main b { font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); font-weight: 600; }
.r12x-ref-asset-main small { font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }
.r12x-sb-group-title { cursor: pointer; }
.r12x-sb-group-title:hover { color: var(--r12-ink); }
.r12x-sb-detail-shots { display: flex; flex-direction: column; gap: 6px; margin-bottom: 8px; }
.r12x-sb-detail-shot { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 2px 8px; padding: 6px 8px; border: 1px solid var(--r12-line); border-radius: var(--r12-r-control); }
.r12x-sb-detail-shot b { grid-row: span 2; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-ink); }
.r12x-sb-detail-shot span { font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-ink); }
.r12x-sb-detail-shot small { font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }
.r12x-sb-detail-shot.is-active { border-color: var(--r12-selected-border); background: var(--r12-selected-bg); }

/* 九稿二轮：视频全集集 → 组 → 镜头 */
.r12x-video-all-ep { display: flex; flex-direction: column; gap: 4px; }
.r12x-matrix-row-video-all .r12x-matrix-ep { display: inline-flex; align-items: center; gap: 4px; padding: 0; border: 0; background: transparent; color: var(--r12-muted); text-align: left; cursor: pointer; }
.r12x-matrix-row-video-all .r12x-matrix-ep svg { width: 14px; height: 14px; }
.r12x-video-all-groups { display: flex; flex-direction: column; gap: 4px; padding: 2px 0 6px 14px; }
.r12x-video-all-group { display: flex; flex-direction: column; gap: 2px; }
.r12x-video-all-group-row { display: flex; align-items: center; gap: 6px; min-height: 32px; padding: 0 8px; border: 1px solid transparent; border-radius: var(--r12-r-control); background: transparent; color: var(--r12-ink); text-align: left; cursor: pointer; }
.r12x-video-all-group-row svg { width: 14px; height: 14px; flex: none; color: var(--r12-muted); }
.r12x-video-all-group-row b { font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); font-weight: 600; }
.r12x-video-all-group-row small { margin-left: auto; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }
.r12x-video-all-group-row:hover { background: var(--r12-hover); }
.r12x-video-all-group-row.is-active { background: var(--r12-selected-bg); border-color: var(--r12-selected-border); }
.r12x-video-all-shots { display: flex; flex-direction: column; gap: 2px; padding: 2px 0 2px 22px; }
.r12x-video-all-shot { display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; align-items: center; gap: 8px; min-height: 30px; padding: 0 8px; border: 1px solid transparent; border-radius: var(--r12-r-control); background: transparent; color: var(--r12-ink); text-align: left; cursor: pointer; }
.r12x-video-all-shot span { font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); font-weight: 600; }
.r12x-video-all-shot b { font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); font-weight: 500; }
.r12x-video-all-shot small { font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }
.r12x-video-all-shot:hover { background: var(--r12-hover); }
.r12x-video-all-shot.is-active { background: var(--r12-selected-bg); border-color: var(--r12-selected-border); }
.r12x-video-all-detail-extra { display: flex; flex-direction: column; gap: 4px; padding: 8px 0; border-top: 1px solid var(--r12-line); }
.r12x-sb-table .r12x-shot-card { display: table-row; padding: 0; border: 0; border-radius: 0; background: transparent; }
.r12x-sb-table .r12x-shot-no { position: static; display: inline-flex; align-items: center; height: 20px; padding: 0 6px; border-radius: var(--r12-r-pill); background: var(--r12-surface-3); color: var(--r12-ink); font-weight: 600; }
.r12x-sb-thumb { position: relative; display: block; width: 56px; height: 32px; border-radius: 6px; overflow: hidden; background: var(--r12-surface-3); }
.r12x-sb-thumb img { width: 100%; height: 100%; display: block; object-fit: cover; }
.r12x-sb-thumb .r12-ai-badge { right: 2px; bottom: 2px; padding: 0 2px; font-size: var(--r12-fs-small); }
.r12x-sb-edit { display: block; min-height: 18px; color: var(--r12-ink); }
.r12x-sb-move, .r12x-sb-sec { color: var(--r12-ink); white-space: nowrap; }
.r12x-sb-state { display: inline-flex; align-items: center; height: 18px; padding: 0 6px; border-radius: var(--r12-r-pill); background: var(--r12-surface-3); color: var(--r12-muted); white-space: nowrap; }
.r12x-sb-state.is-done { background: color-mix(in srgb, var(--r12-accent-user, #3377F7) 16%, transparent); color: var(--r12-ink); }

.r12x-sb-eps { display: flex; flex-direction: column; gap: 8px; padding: 10px 0 4px; }
.r12x-sb-ep { border: 1px solid var(--r12-line); border-radius: var(--r12-r-card); background: var(--r12-surface); overflow: hidden; }
.r12x-sb-ep-row { display: flex; align-items: center; gap: 8px; width: 100%; min-height: 44px; padding: 6px 12px; border: 0; background: transparent; color: var(--r12-ink); text-align: left; cursor: pointer; }
.r12x-sb-ep-row:hover { background: var(--r12-hover); }
.r12x-sb-caret { flex: none; display: inline-flex; color: var(--r12-muted); }
.r12x-sb-caret svg { width: 16px; height: 16px; }
.r12x-sb-ep-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); font-weight: 600; }
.r12x-sb-ep-cell { flex: none; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); white-space: nowrap; }
.r12x-sb-thumbs { flex: none; display: inline-flex; gap: 4px; margin-left: auto; }
.r12x-sb-thumbs img { width: 56px; height: 32px; object-fit: cover; display: block; border-radius: 4px; background: var(--r12-surface-3); }
.r12x-sb-ep-body { padding: 0 12px 12px; border-top: 1px solid var(--r12-line); }

.r12x-sb-detail { flex: 1 1 auto; align-self: stretch; width: 100%; height: auto; min-height: 0; }
.r12x-sb-detail-body { display: flex; flex-direction: column; gap: 10px; padding: 10px 12px 12px; }
.r12x-sb-detail-meta { display: flex; flex-wrap: wrap; gap: 8px 14px; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }
.r12x-sb-assets { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.r12x-sb-asset { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.r12x-sb-asset img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; border-radius: var(--r12-r-media); background: var(--r12-surface-3); }
.r12x-sb-asset span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }

/* ── 七稿：交付审片、全集折叠行、导出选择 ─────────────────── */
.r12x-review-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: start; padding: 10px 0 12px; }
.r12x-review-copy { margin: 0; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }
.r12x-review-switch { display: inline-flex; align-items: center; gap: 6px; padding-top: 1px; white-space: nowrap; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-ink); }
.r12x-review-result { display: flex; flex-direction: column; gap: 6px; padding: 10px 0; }
.r12x-review-toggle { display: inline-flex; align-items: center; gap: 4px; align-self: flex-start; padding: 0; border: 0; background: transparent; color: var(--r12-ink); font: inherit; font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); cursor: pointer; }
.r12x-review-toggle svg { width: 14px; height: 14px; color: var(--r12-muted); }
.r12x-review-problems { display: flex; flex-direction: column; gap: 6px; padding: 8px 10px; border: 1px solid var(--r12-line); border-radius: var(--r12-r-control); background: var(--r12-surface-2); }
.r12x-problem { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }
.r12x-problem-shot { flex: none; display: inline-flex; align-items: center; height: 20px; padding: 0 6px; border-radius: var(--r12-r-pill); background: var(--r12-surface-3); color: var(--r12-ink); font-weight: 600; }
.r12x-problem-issue { flex: 1; min-width: 0; display: inline-flex; align-items: center; gap: 4px; padding: 0; border: 0; background: transparent; color: var(--r12-muted); font: inherit; text-align: left; cursor: pointer; }
.r12x-problem-issue svg { width: 14px; height: 14px; flex: none; }
.r12x-problem-detail { flex: 1 0 100%; padding: 4px 0 2px 28px; color: var(--r12-muted); }
.r12x-export-bar { display: flex; align-items: center; gap: 8px; width: 100%; padding: 8px 10px; margin-bottom: 8px; border: 1px solid var(--r12-line); border-radius: var(--r12-r-control); background: var(--r12-surface-2); font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-ink); }
.r12x-export-bar > span { margin-right: auto; }
.r12x-ep-list { display: flex; flex-direction: column; gap: 8px; }
.r12x-ep-row { border: 1px solid var(--r12-line); border-radius: var(--r12-r-card); background: var(--r12-surface); overflow: hidden; }
.r12x-ep-row.is-picked { background: color-mix(in srgb, var(--r12-accent-user, #3377F7) 8%, var(--r12-surface)); border-color: color-mix(in srgb, var(--r12-accent-user, #3377F7) 26%, var(--r12-line)); }
.r12x-ep-row-head { display: flex; align-items: center; gap: 8px; padding: 4px 10px 4px 12px; }
.r12x-ep-check { position: relative; flex: none; box-sizing: border-box; width: 16px; height: 16px; min-width: 16px; min-height: 16px; display: grid; place-items: center; padding: 0; border: 1px solid var(--r12-line-strong); border-radius: 50%; background: transparent; color: #fff; cursor: pointer; }
.r12x-ep-check::after { content: ''; position: absolute; inset: -6px; border-radius: 50%; }
.r12x-ep-check svg { width: 10px; height: 10px; }
.r12x-ep-check svg * { stroke-width: 2.4; }
.r12x-ep-check[aria-pressed='true'] { border-color: var(--r12-accent-user, #3377F7); background: var(--r12-accent-user, #3377F7); }
.r12x-ep-toggle { flex: 1; min-width: 0; display: flex; align-items: center; gap: 8px; min-height: 36px; padding: 0; border: 0; background: transparent; color: var(--r12-ink); text-align: left; cursor: pointer; }
.r12x-ep-caret { flex: none; display: inline-flex; color: var(--r12-muted); }
.r12x-ep-caret svg { width: 16px; height: 16px; }
.r12x-ep-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); font-weight: 600; }
.r12x-ep-cell { flex: none; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); white-space: nowrap; }
.r12x-ep-expanded { display: flex; flex-direction: column; gap: 8px; padding: 10px 16px 12px; border-top: 1px solid var(--r12-line); }
.r12x-ep-meta { display: flex; flex-wrap: wrap; gap: 8px 14px; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }
.r12x-ep-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.r12x-ep-wait { font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }
.r12x-export-note { margin: 2px 0 0; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }
.r12x-ep-panel .r12-panel-body { padding: 12px; }
.r12x-ep-panel .r12x-all-scroll { overflow: auto; }
@media (max-width: 1100px) {
  .r12x-ep-toggle { flex-wrap: wrap; row-gap: 2px; }
}
.r12x-compare { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.r12x-compare figure, .r12x-compare-one { margin: 0; display: flex; flex-direction: column; gap: 6px; }
.r12x-compare img, .r12x-compare-one img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; display: block; border-radius: var(--r12-r-card); background: var(--r12-surface-3); }
.r12x-compare figcaption, .r12x-compare-one figcaption { font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }

/* ── 七稿：主控底部条浮在页面上，被压着的面板让出底部条高度 ───────── */
.r12-panel.is-under-dock :is(.r12x-asset-scroll, .r12x-all-scroll, .r12x-delivery-list, .r12x-delivery-side-body, .r12x-detail-body, .r12x-current-body, .r12x-video-settings-body, .r12x-video-info-body, .r12x-group-list, .r12x-shot-rows, .r12x-refs-body) {
  padding-bottom: var(--r12-dock-clear, 0px);
}
.r12-panel.is-under-dock { position: relative; }
.r12-panel.is-under-dock > .r12x-detail-foot,
.r12-panel.is-under-dock .r12x-review,
.r12-panel.is-under-dock .r12x-ep-foot {
  position: absolute;
  left: 0;
  right: 0;
  bottom: var(--r12-dock-clear, 0px);
  margin-bottom: 0;
  z-index: 2;
  background: var(--r12-surface);
}
.r12-panel.is-under-dock .r12x-current-body { padding-bottom: calc(var(--r12-dock-clear, 0px) + 10px); }
.r12-panel.is-under-dock .r12x-detail-body { padding-bottom: calc(var(--r12-dock-clear, 0px) + 61px); }
.r12-panel.is-under-dock .r12x-player-body,
.r12-panel.is-under-dock .r12x-preview-body {
  padding-bottom: var(--r12-dock-clear, 0px);
  overflow-y: auto;
}
.r12-panel.is-under-dock .r12x-player-body > .r12x-player { flex: 0 0 auto; }
.r12-panel.is-under-dock .r12x-prod-video-body { padding-bottom: calc(12px + var(--r12-dock-clear, 0px)); }

/* ── 生产视图（ds-5850）：分镜制作 / 视频同屏三栏。类名统一 r12x-prod- ── */

/* 分镜：制作 / 总览分段 */
.r12x-prod-sb-heading { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: 8px; }
.r12x-prod-sb-heading .r12x-current-title { flex: none; }
.r12x-prod-sb { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.r12x-prod-sb-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; flex-wrap: wrap; min-width: 0; }
.r12x-prod-sb-title { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.r12x-prod-sb-title b { font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); font-weight: 600; color: var(--r12-ink); }
.r12x-prod-sb-title small { font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }
.r12x-prod-sb-actions { display: flex; align-items: center; gap: 8px; flex: none; }
.r12x-prod-sb-axis .r12x-axis { padding-top: 0; }

/* 分镜卡：头 = 镜号 / 缩略图 / 景别运镜 / 时长；主体 = 描述与台词；底 = 人物与参考 */
.r12x-prod-shot-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 8px; min-width: 0; align-items: start; }
.r12x-prod-shot { display: flex; flex-direction: column; gap: 8px; min-width: 0; padding: 10px; border: 1px solid var(--r12-line); border-radius: var(--r12-r-card); background: var(--r12-surface-2); }
.r12x-prod-shot-head { display: flex; align-items: flex-start; gap: 8px; min-width: 0; }
.r12x-prod-shot-thumb { position: relative; flex: none; width: 104px; aspect-ratio: 16 / 10; overflow: hidden; border-radius: var(--r12-r-media, 8px); background: var(--r12-surface-3); }
.r12x-prod-shot-thumb img { width: 100%; height: 100%; display: block; object-fit: cover; }
.r12x-prod-shot-thumb .r12-ai-badge { position: absolute; top: 4px; left: 4px; }
.r12x-prod-shot-title { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.r12x-prod-shot-no { font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); font-weight: 600; color: var(--r12-ink); }
.r12x-prod-shot-meta { font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); white-space: nowrap; }
.r12x-prod-shot-main { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.r12x-prod-shot-foot { display: flex; flex-direction: column; gap: 3px; padding-top: 6px; border-top: 1px solid var(--r12-line); font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }
.r12x-prod-shot-foot > span { display: flex; align-items: center; flex-wrap: wrap; gap: 4px; min-width: 0; }
.r12x-prod-shot-foot b { flex: none; font-weight: 600; color: var(--r12-ink); }

/* 编辑区：可见字段名 + 虚线可编辑区；沿用共用 .r12-editable 的保存逻辑 */
.r12x-prod-field { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.r12x-prod-field-name { font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }
.r12x-prod-field .r12-editable { min-width: 0; padding: 2px 4px; border: 1px dashed transparent; color: var(--r12-ink); font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); white-space: pre-wrap; overflow-wrap: anywhere; }
.r12x-prod-field .r12-editable:hover { border-color: var(--r12-line-strong); }
.r12x-prod-field .r12-editable:focus { border-color: var(--r12-selected-border); background: var(--r12-surface-3); outline: 0; }
.r12x-prod-shot-framing { font-weight: 600; }
.r12x-prod-shot-line { color: var(--r12-muted); }

/* 完整提示词弹窗 */
.r12x-prod-prompt-dialog { display: flex; flex-direction: column; gap: 10px; }
.r12x-prod-prompt-shot { display: flex; flex-direction: column; gap: 6px; padding: 10px; border: 1px solid var(--r12-line); border-radius: var(--r12-r-card); background: var(--r12-surface-2); }
.r12x-prod-prompt-shot-head { display: flex; align-items: baseline; gap: 8px; }
.r12x-prod-prompt-shot-head b { font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); color: var(--r12-ink); }
.r12x-prod-prompt-shot-head span { font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }
.r12x-prod-prompt-field { margin: 0; }
.r12x-prod-prompt-cast { margin: 0; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }

/* 视频：卡头 + 同屏三栏 */
.r12x-prod-video { display: flex; flex-direction: column; min-height: 0; min-width: 0; }
.r12x-prod-video-head { height: auto; min-height: 40px; padding-top: 6px; padding-bottom: 6px; flex-wrap: wrap; align-items: flex-start; row-gap: 6px; }
.r12x-prod-video-title { flex: 1 1 420px; min-width: 0; display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.r12x-prod-video-title h2 { margin: 0; font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); font-weight: 600; color: var(--r12-ink); }
.r12x-prod-video-meta, .r12x-prod-video-state { flex: none; display: inline-flex; align-items: center; gap: 4px; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); white-space: nowrap; }
.r12x-prod-video-actions { flex: none; display: flex; align-items: center; gap: 8px; margin-left: auto; }
.r12x-prod-video-body { flex: 1; min-height: 0; overflow: hidden; padding: 10px 12px 12px; }
.r12x-prod-video-grid { display: grid; grid-template-columns: minmax(380px, 1.6fr) minmax(120px, .55fr) minmax(280px, 1fr); gap: 10px; height: 100%; min-height: 0; min-width: 0; }
.r12x-prod-video-col { display: flex; flex-direction: column; min-width: 0; min-height: 0; overflow: hidden; border: 1px solid var(--r12-line); border-radius: var(--r12-r-card); background: var(--r12-surface-2); }
.r12x-prod-video-col.is-focus { border-color: var(--r12-selected-border); box-shadow: inset 0 0 0 1px var(--r12-selected-border); }
.r12x-prod-col-head { flex: none; display: flex; align-items: center; gap: 8px; min-width: 0; padding: 8px 10px; border-bottom: 1px solid var(--r12-line); }
.r12x-prod-col-head h3 { margin: 0; flex: none; font-size: var(--r12-fs-ui); line-height: var(--r12-lh-ui); font-weight: 600; color: var(--r12-ink); }
.r12x-prod-col-head .r12-seg { margin-left: auto; }
.r12x-prod-focus-tag { flex: none; display: inline-flex; align-items: center; height: 20px; padding: 0 7px; border-radius: var(--r12-r-pill); background: var(--r12-selected-bg); color: var(--r12-ink); font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); }
.r12x-prod-count { margin-left: auto; flex: none; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); white-space: nowrap; }
.r12x-prod-col-body { flex: 1; min-height: 0; overflow: auto; display: flex; flex-direction: column; gap: 10px; padding: 10px; }
.r12x-prod-prompt-text { min-height: 120px; }
.r12x-prod-shot-rows { display: flex; flex-direction: column; gap: 12px; }

/* 参考列 */
.r12x-prod-refs { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 8px; }
.r12x-prod-ref { display: flex; align-items: flex-start; gap: 6px; min-width: 0; padding: 6px; border: 1px solid var(--r12-line); border-radius: var(--r12-r-control); background: var(--r12-surface); }
.r12x-prod-ref-thumb-wrap { position: relative; flex: none; width: 40px; height: 40px; }
.r12x-prod-ref-thumb { width: 100%; height: 100%; padding: 0; display: grid; place-items: center; overflow: hidden; border: 1px solid var(--r12-line); border-radius: 8px; background: var(--r12-surface-3); color: var(--r12-muted); }
.r12x-prod-ref-thumb img { width: 100%; height: 100%; display: block; object-fit: cover; }
.r12x-prod-ref-thumb svg { width: 20px; height: 20px; }
.r12x-prod-ref-art { width: 100%; height: 100%; display: grid; place-items: center; }
.r12x-prod-ref-main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.r12x-prod-ref-meta { display: flex; align-items: baseline; gap: 4px; min-width: 0; }
.r12x-prod-ref-meta b { flex: none; font-size: 11px; line-height: 16px; font-weight: 600; color: var(--r12-muted); }
.r12x-prod-ref-meta small { min-width: 0; font-size: 11px; line-height: 16px; color: var(--r12-muted); white-space: nowrap; }
.r12x-prod-ref-name { display: block; min-width: 0; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); font-weight: 600; color: var(--r12-ink); white-space: normal; overflow-wrap: anywhere; text-overflow: clip; overflow: visible; }
.r12x-prod-ref-btn { position: absolute; right: -5px; top: -5px; z-index: 1; width: 20px; height: 20px; padding: 0; display: grid; place-items: center; border: 1px solid var(--r12-line); border-radius: 50%; background: var(--r12-surface); color: var(--r12-muted); }
.r12x-prod-ref-btn:hover { background: var(--r12-hover); color: var(--r12-ink); }
.r12x-prod-ref-btn svg { width: 12px; height: 12px; }
.r12x-prod-ref-add { flex: none; display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 32px; border: 1px dashed var(--r12-line-strong); border-radius: var(--r12-r-control); background: transparent; color: var(--r12-muted); font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); }
.r12x-prod-ref-add:hover { background: var(--r12-hover); color: var(--r12-ink); }
.r12x-prod-ref-add svg { width: 16px; height: 16px; }

/* 视频列 */
.r12x-prod-video-stage { position: relative; flex: none; width: 100%; border-radius: var(--r12-r-card); overflow: hidden; background: color-mix(in srgb, var(--r12-bg) 82%, #000); }
.r12x-prod-video-player { width: 100%; aspect-ratio: 16 / 9; display: block; object-fit: contain; background: #000; }
.r12x-prod-video-index { position: absolute; right: 6px; top: 6px; height: 20px; display: inline-flex; align-items: center; padding: 0 7px; border-radius: var(--r12-r-pill); background: color-mix(in srgb, var(--r12-bg) 70%, transparent); color: var(--r12-ink); font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); }
.r12x-prod-video-candidates { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; flex: none; }
.r12x-prod-video-candidate { position: relative; min-width: 0; padding: 0; overflow: hidden; border: 1px solid var(--r12-line); border-radius: 8px; background: var(--r12-surface); }
.r12x-prod-video-candidate video, .r12x-prod-video-candidate img { width: 100%; aspect-ratio: 16 / 9; display: block; object-fit: cover; pointer-events: none; background: #000; }
.r12x-prod-video-candidate span { position: absolute; left: 4px; right: 4px; bottom: 3px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; line-height: 16px; color: #fff; text-shadow: 0 1px 2px rgba(0, 0, 0, .7); }
.r12x-prod-video-candidate.is-active { border-color: var(--r12-selected-border); box-shadow: 0 0 0 1px var(--r12-selected-border); }
.r12x-prod-candidate-check { position: absolute; left: 3px; top: 3px; right: auto !important; bottom: auto !important; width: 18px; height: 18px; display: grid; place-items: center; border-radius: 50%; background: var(--r12-ink); color: var(--r12-bg); }
.r12x-prod-candidate-check svg { width: 12px; height: 12px; }
.r12x-prod-video-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; flex: none; }
.r12x-prod-video-facts { display: flex; flex-direction: column; gap: 4px; margin: 0; padding-top: 8px; border-top: 1px solid var(--r12-line); }
.r12x-prod-video-facts > div { display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.r12x-prod-video-facts dt { flex: none; width: 52px; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }
.r12x-prod-video-facts dd { margin: 0; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-ink); }

/* 参数弹窗 */
.r12x-prod-params { display: flex; flex-direction: column; gap: 12px; }
.r12x-prod-params-row { display: flex; align-items: center; gap: 8px; min-height: 28px; }
.r12x-prod-params-row > span:first-child { flex: none; width: 52px; font-size: var(--r12-fs-small); line-height: var(--r12-lh-small); color: var(--r12-muted); }

/* 卡内宽度不够三栏时同卡分段：三块内容和同组身份都保留，不横向溢出。
   1440 底部主控时卡内容宽约 866（>830，保持三栏）；1728 展开右侧栏时卡内容宽约 782（<830，分段）。 */
.r12x-prod-video { container-type: inline-size; }
@container (max-width: 830px) {
  .r12x-prod-video-body { overflow: auto; }
  .r12x-prod-video-grid { grid-template-columns: minmax(0, 1fr); height: auto; }
  .r12x-prod-video-col { min-height: 220px; }
}
.r12f-project.is-narrow .r12x-prod-video-body { overflow: auto; }
.r12f-project.is-narrow .r12x-prod-video-grid { grid-template-columns: minmax(0, 1fr); height: auto; }
.r12f-project.is-narrow .r12x-prod-video-col { min-height: 220px; }