/* =====================================================================
 * S2 内联引擎 · 粘合样式（设计变量 + 参考 CSS 未覆盖的根节点/自增类 + 布局）
 * 参考站组件样式见 s2-stage.css（作用域 .s2-stage）。
 * ===================================================================== */

/* ---------- 参考站设计变量（暗色主题，computed tokens） ---------- */
.s2-stage {
  --b-20: rgba(0,0,0,.2); --b-30: rgba(0,0,0,.3); --b-40: rgba(0,0,0,.4);
  --b-50: rgba(0,0,0,.5); --b-60: rgba(0,0,0,.6); --b-80: rgba(0,0,0,.8); --b-90: rgba(0,0,0,.9);
  --bg-card: rgb(28,30,34); --bg-card-2: rgb(30,31,37); --bg-card-2-a: rgba(30,31,37,.95);
  --bg-elevated-2: rgb(42,45,51); --bg-hover-solid: rgb(35,37,42);
  --bg-input: rgb(27,28,33); --bg-input-a: rgba(27,28,33,.95);
  --bg-page: rgb(15,15,18); --bg-page-2: rgb(12,12,15); --bg-page-a: rgba(15,15,18,.95);
  --bg-panel: rgb(20,20,25); --bg-panel-3: rgb(22,22,28); --bg-panel-5: rgb(24,25,30); --bg-panel-a: rgba(20,20,25,.95);
  --c-primary-rgb: 0,202,224;
  --c-primary-3: rgba(0,202,224,.03); --c-primary-5: rgba(0,202,224,.05); --c-primary-6: rgba(0,202,224,.06);
  --c-primary-8: rgba(0,202,224,.08); --c-primary-10: rgba(0,202,224,.1); --c-primary-12: rgba(0,202,224,.12);
  --c-primary-15: rgba(0,202,224,.15); --c-primary-20: rgba(0,202,224,.2); --c-primary-25: rgba(0,202,224,.25);
  --c-primary-30: rgba(0,202,224,.3); --c-primary-35: rgba(0,202,224,.35); --c-primary-40: rgba(0,202,224,.4);
  --c-primary-50: rgba(0,202,224,.5); --c-primary-60: rgba(0,202,224,.6); --c-primary-70: rgba(0,202,224,.7);
  --c-primary-80: rgba(0,202,224,.8); --c-primary-85: rgba(0,202,224,.85); --c-primary-90: rgba(0,202,224,.9); --c-primary-95: rgba(0,202,224,.95);
  --card-color: rgb(28,30,34); --color-2: rgb(27,28,33); --color-primary: rgb(0,202,224);
  --color-text-primary: rgb(245,251,255); --color-text-secondary: rgb(140,153,160); --color-warn: #f59e0b;
  --scrollbar-thumb: rgba(255,255,255,.08);
  --text-content: rgba(200,203,212,.85); --text-heading: rgba(255,255,255,.92);
  --text-primary: rgb(245,251,255); --text-secondary: rgb(140,153,160); --text-tertiary: rgb(96,105,110);
  --w-2: rgba(255,255,255,.02); --w-3: rgba(255,255,255,.03); --w-4: rgba(255,255,255,.04); --w-5: rgba(255,255,255,.05);
  --w-6: rgba(255,255,255,.06); --w-7: rgba(255,255,255,.07); --w-8: rgba(255,255,255,.08); --w-10: rgba(255,255,255,.1);
  --w-12: rgba(255,255,255,.12); --w-15: rgba(255,255,255,.15); --w-20: rgba(255,255,255,.2); --w-25: rgba(255,255,255,.25);
  --w-30: rgba(255,255,255,.3); --w-35: rgba(255,255,255,.35); --w-40: rgba(255,255,255,.4); --w-45: rgba(255,255,255,.45);
  --w-50: rgba(255,255,255,.5); --w-60: rgba(255,255,255,.6); --w-70: rgba(255,255,255,.7); --w-80: rgba(255,255,255,.8);
  --w-85: rgba(255,255,255,.85); --w-90: rgba(255,255,255,.9); --w-95: rgba(255,255,255,.95); --w-100: rgb(255,255,255);
  color-scheme: dark;
}

/* ---------- 流程舞台布局（仅作用于内嵌舞台，不影响 body 级覆盖层根） ---------- */
.s2-stage.s2ie-stage {
  display: flex; flex-direction: column;
  width: 100%; max-width: 1200px; margin: 0 auto; padding: 10px 24px 160px;
  color: var(--text-content); font-size: 14px; line-height: 1.6;
  /* 渐变标题自带 transparent fill；重置避免其被普通正文继承导致文字不可见 */
  -webkit-text-fill-color: currentColor;
}
.s2-stage.s2ie-stage .jieDian-body { color: var(--text-content); -webkit-text-fill-color: currentColor; }
/* 内联流水线启动后：隐藏 S2 介绍页（星空背景 / hero / 能力与流水线介绍），时间线接管主区 */
#agentWorkspace.s2ie-hide-intro .s2-cosmos,
#agentWorkspace.s2ie-hide-intro .s2-hero,
#agentWorkspace.s2ie-hide-intro .s2-engine { display: none !important; }
#agentWorkspace.s2ie-hide-intro { height: auto !important; min-height: 0 !important; overflow: visible !important; }
.s2-stage.s2ie-stage .s2-config-header { margin-top: 4px !important; margin-bottom: 14px; }
.s2-stage.s2ie-stage .s2-config-title { font-weight: 600; color: var(--text-heading); margin-bottom: 8px; }
.s2-stage.s2ie-stage .s2-config-selectors { display: flex; flex-wrap: wrap; gap: 14px; }
.s2-stage.s2ie-stage .s2-config-label { color: var(--text-tertiary); font-size: 12px; margin-right: 6px; }
.s2ie-chip { display: inline-flex; align-items: center; gap: 4px; padding: 3px 10px; font-size: 12px; color: #cffafe;
  background: var(--c-primary-8); border: 1px solid var(--c-primary-20); border-radius: 999px; }
.s2ie-plotbar { display: flex; gap: 10px; align-items: baseline; margin: 6px 2px 14px; padding: 10px 14px;
  background: var(--w-3); border: 1px solid var(--w-7); border-radius: 12px; }
.s2ie-plotlab { flex-shrink: 0; font-size: 12px; color: var(--c-primary-80, #67e8f9); font-weight: 600; }
.s2ie-plottx { color: var(--text-content); font-size: 13px; max-height: 60px; overflow: auto; }
.s2-stage.s2ie-stage .jiedian-mianban { padding: 1.25rem 1.25rem 1.5rem; }
.s2-stage .mode-switch-wrapper { display: none !important; } /* 模式开关沿用作曲器外侧分段控件 */

/* ---------- 节点 loading / 文本状态 ---------- */
.s2ie-spin { width: 16px; height: 16px; border-radius: 50%; display: inline-block;
  border: 2px solid var(--c-primary-20, rgba(0,202,224,.2)); border-top-color: var(--color-primary, #00cae0);
  animation: s2ie-spin .8s linear infinite; }
@keyframes s2ie-spin { to { transform: rotate(360deg); } }
.s2ie-loading-tx { color: var(--text-secondary); font-size: 13px; padding: 6px 0; display: flex; align-items: center; gap: 8px; }
.s2ie-loading-tx::before { content: ""; width: 12px; height: 12px; border-radius: 50%;
  border: 2px solid var(--w-15); border-top-color: var(--text-secondary); animation: s2ie-spin .8s linear infinite; }
.s2ie-err { color: #fca5a5; font-size: 13px; background: rgba(239,68,68,.08); border: 1px solid rgba(239,68,68,.25); padding: 8px 12px; border-radius: 10px; }
.s2ie-sub2 { color: var(--text-secondary); font-size: 12.5px; margin-bottom: 12px; }
.s2ie-chosen { color: #6ee7b7; font-size: 13px; margin-bottom: 10px; }
.s2ie-muted { color: var(--text-tertiary); font-size: 12.5px; padding: 4px 0; }
.s2ie-ghost { height: 38px; padding: 0 16px; margin-left: 10px; border-radius: 10px; cursor: pointer;
  background: var(--w-5); color: var(--text-content); border: 1px solid var(--w-12); font-size: 13px; }
.s2ie-ghost:hover { background: var(--w-8); }
.s2ie-ghost:disabled { opacity: .45; cursor: not-allowed; }

/* ---------- 意图分析 option-card 补充 ---------- */
.s2-stage .option-card { display: flex; gap: 10px; align-items: flex-start; }
.s2-stage .option-check { width: 20px; height: 20px; display: inline-flex; align-items: center; justify-content: center; color: var(--color-primary); }
.s2-stage .option-circle { width: 16px; height: 16px; border-radius: 50%; border: 2px solid var(--w-20); display: inline-block; }
.s2-stage .option-content b { display: block; color: var(--text-heading); font-size: 13.5px; margin-bottom: 2px; }
.s2-stage .opt-reason { font-size: 12.5px; line-height: 1.55; margin-top: 5px; }
.s2-stage .opt-rec { color: #7dd3fc; }
.s2-stage .opt-norec { color: var(--text-tertiary); }

/* ---------- 创意方向卡内部 ---------- */
.s2-stage .fangxiang-card .card-badge { margin-bottom: 10px; color: rgb(var(--accent, 96,165,250)); font-size: 15px; }
.s2-stage .fangxiang-card .card-title { font-size: 14.5px; font-weight: 600; color: var(--w-95); }
.s2-stage .fangxiang-card .card-desc { margin: 6px 0 0; }
.s2-stage .fangxiang-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: auto; padding-top: 12px; }
.s2-stage .fangxiang-chips .scene-chip { font-size: 11.5px; color: var(--w-70); }

/* ---------- 缺失的组件根节点 ---------- */
.s2-stage .dagang-node, .s2-stage .xiaoshuo-node, .s2-stage .zichan-node { width: 100%; }
.s2-stage .zichan-confirm-area { margin-top: .75rem; display: flex; flex-direction: column; gap: 1rem; }
.s2-stage .reader-paper-inner { padding: 14px 16px; }

/* ---------- 资产卡占位/失败 ---------- */
.s2-stage .preview-ph { width: 100%; height: 100%; min-height: 150px; display: flex; align-items: center; justify-content: center;
  font-size: 40px; font-weight: 700; color: var(--w-50);
  background: linear-gradient(135deg, var(--w-5), var(--w-2)); }
.s2-stage .asset-fail { position: absolute; left: 6px; right: 6px; bottom: 6px; font-size: 11px; color: #fca5a5;
  background: rgba(0,0,0,.62); padding: 3px 6px; border-radius: 6px; }
.s2-stage .s2ie-asset-foot, .s2-stage .s2ie-shot-foot { display: flex; justify-content: flex-end; margin-top: 14px; }

/* ---------- 视频节点：出镜资产格 / 封面 video / 底部 ---------- */
.s2-stage .video-assets-grid { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
.s2-stage .asset-cell { position: relative; width: 64px; }
.s2-stage .asset-cell-img { width: 64px; height: 64px; object-fit: cover; border-radius: 8px; border: 1px solid var(--w-10); display: block; }
.s2-stage .asset-cell-no { position: absolute; top: 3px; left: 3px; z-index: 2; font-size: 10px; padding: 1px 5px; border-radius: 6px;
  background: rgba(0,0,0,.62); color: #cffafe; }
.s2-stage .asset-cell-name { display: block; font-size: 10.5px; color: var(--text-tertiary); margin-top: 3px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 64px; }
video.vo-cover-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.s2-stage .s2ie-ship-foot { display: flex; justify-content: flex-end; gap: 10px; margin-top: 16px; }
/* 底部三大操作按钮（匹配资产 / 生成提示词 / 批量生成视频） */
.s2-stage .s2ie-ship-actions { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 18px; }
.s2-stage .s2ie-act-btn { height: 46px; border-radius: 12px; font-size: 14px; font-weight: 700; cursor: pointer;
  border: 1px solid transparent; color: #fff; transition: transform .15s ease, box-shadow .15s ease, filter .15s ease; }
.s2-stage .s2ie-act-btn:hover:not(:disabled) { transform: translateY(-1px); filter: brightness(1.08); }
.s2-stage .s2ie-act-asset { background: linear-gradient(135deg,#0ea5e9,#2563eb); box-shadow: 0 6px 18px rgba(14,165,233,.28); }
.s2-stage .s2ie-act-prompt { background: linear-gradient(135deg,#8b5cf6,#6d28d9); box-shadow: 0 6px 18px rgba(139,92,246,.28); }
.s2-stage .s2ie-act-video { background: linear-gradient(135deg,#10b981,#059669); box-shadow: 0 6px 18px rgba(16,185,129,.28); }
.s2-stage .s2ie-act-btn:disabled { opacity: .45; cursor: not-allowed; box-shadow: none; }
@media (max-width: 720px){ .s2-stage .s2ie-ship-actions { grid-template-columns: 1fr; } }
.s2-stage .s2ie-done-banner { margin-top: 14px; padding: 12px 16px; border-radius: 12px; font-size: 13px; color: #6ee7b7;
  background: rgba(34,197,94,.08); border: 1px solid rgba(34,197,94,.25); text-align: center; }

/* ---------- 输入控件继承 ---------- */
.s2-stage textarea, .s2-stage input { font-family: inherit; }
.s2-stage .confirm-btn:disabled, .s2-stage .step-btn:disabled, .s2-stage .vo-add-disabled, .s2-stage button:disabled { opacity: .5; cursor: not-allowed; }

/* ---------- body 级覆盖层根（仅承载变量，不参与文档流布局；无 transform，fixed 相对视口） ---------- */
.s2-stage.s2ie-overlay-root { position: static; max-width: none; padding: 0; }
.s2-stage.s2ie-imgwrap { background: transparent; border: none; box-shadow: none; padding: 0; }

/* 窄屏 */
@media (max-width: 720px) {
  .s2-stage.s2ie-stage { padding: 8px 10px 120px; }
  .s2-stage .fangxiang-grid { grid-template-columns: 1fr; }
  .s2-stage .s2-config-selectors { gap: 8px; }
}

/* @V56 S2 项目门控：未建项目时作曲器只读引导态 */
#promptInput.s2-gated{ opacity:.6; cursor:pointer !important; }
#promptInput.s2-gated::placeholder{ color:rgba(34,211,238,.9); }


/* ===== 舞台铺满主区（修复内联引擎只占屏幕中间窄列、两侧大片留白）===== */
.s2-stage.s2ie-stage {
  align-items: stretch !important;
  max-width: min(1560px, 100%) !important;
}
.s2-stage.s2ie-stage > .s2-config-header,
.s2-stage.s2ie-stage > .s2ie-plotbar,
.s2-stage.s2ie-stage > .jiedian-mianban {
  width: 100%;
  box-sizing: border-box;
}
.s2-stage.s2ie-stage .s2-config-selectors { flex-wrap: wrap; row-gap: 8px; }
/* 节点面板内的时间线项横向吃满 */
.s2-stage.s2ie-stage .jiedian-mianban { width: 100%; }
.s2-stage.s2ie-stage .jieDian-item { width: 100%; }


/* ===== 资产卡：完整展示整张图（三视图/场景图不裁切），深色衬底 ===== */
.s2-stage .card-preview { background:#0b0d12; }
.s2-stage .preview-img { width:100%; height:100%; object-fit:contain; padding:6px; box-sizing:border-box; background:#0b0d12; }
.s2-stage .asset-card .card-info { min-height:0; }