/* ============================================================
   S2 内联引擎视觉修正（最后加载，覆盖 s2-stage.css 的扁平/浅色背景）
   策略：舞台本体透明，让全局星空(.page-bg/#agGlobalFx)铺满；
        节点内容用玻璃卡，内卡统一半透明质感。
   ============================================================ */

/* ---- 舞台本体：透明、定位，清除所有浅色/扁平背景 ---- */
.s2-stage.s2ie-stage {
  position: relative;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  border: none !important;
  overflow: visible;
  width: 100%;
  box-sizing: border-box;
  padding: 4px 2px 24px;
}

/* ---- 顶部配置条 / 本次剧情条：玻璃胶囊 ---- */
.s2-stage .s2-config-header {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  background: linear-gradient(160deg, rgba(24,30,44,.55), rgba(12,16,25,.4));
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 14px;
  padding: 10px 16px;
  margin-bottom: 12px;
  backdrop-filter: blur(14px) saturate(1.25);
  -webkit-backdrop-filter: blur(14px) saturate(1.25);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}
.s2-stage .s2-config-title { font-weight: 700; color: #e8f1f8; font-size: .92rem; }
.s2-stage .s2-config-selectors { display: flex; gap: 10px; flex-wrap: wrap; }
.s2-stage .s2-config-item { display: flex; align-items: center; gap: 6px; font-size: .74rem; color: #9fb2c8; }
.s2-stage .s2ie-chip {
  background: rgba(0,202,224,.12);
  border: 1px solid rgba(0,202,224,.3);
  color: #7fe9f5; border-radius: 999px; padding: 2px 10px; font-size: .72rem;
}
.s2-stage .s2ie-plotbar {
  display: flex; align-items: baseline; gap: 10px;
  background: linear-gradient(160deg, rgba(24,30,44,.45), rgba(12,16,25,.32));
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 12px; padding: 9px 14px; margin-bottom: 16px;
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
}
.s2-stage .s2ie-plotlab { font-size: .72rem; color: #8fa3ba; flex-shrink: 0; }
.s2-stage .s2ie-plottx { font-size: .82rem; color: #d6e2ee; line-height: 1.5; }

/* ---- 节点时间线 ---- */
.s2-stage .jieDian-item { display: flex; align-items: stretch; gap: 14px; margin: 0 0 16px; }
.s2-stage .jieDian-left { display: flex; flex-direction: column; align-items: center; flex-shrink: 0; width: 34px; }
.s2-stage .jieDian-icon {
  width: 34px; height: 34px; border-radius: 50%; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  background: rgba(10,14,22,.6); border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 0 0 4px rgba(0,202,224,.06);
}
.s2-stage .jieDian-line { flex: 1; width: 2px; margin-top: 6px;
  background: linear-gradient(180deg, rgba(0,202,224,.35), rgba(120,80,255,.18)); }
.s2-stage .jieDian-item:last-child .jieDian-line { display: none; }

/* ---- 节点内容：玻璃卡 ---- */
.s2-stage .jieDian-content {
  position: relative; flex: 1; min-width: 0;
  background: linear-gradient(160deg, rgba(23,29,43,.66), rgba(12,16,26,.55));
  border: 1px solid rgba(255,255,255,.085);
  border-radius: 16px;
  padding: 15px 17px;
  backdrop-filter: blur(16px) saturate(1.28);
  -webkit-backdrop-filter: blur(16px) saturate(1.28);
  box-shadow: 0 14px 38px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.07);
}
.s2-stage .jieDian-header { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
.s2-stage .jieDian-name { font-size: 1.02rem; font-weight: 700; color: #eef4fb; }
.s2-stage .jieDian-sub { font-size: .76rem; color: #93a6bd; }

/* ---- 副标题（意图“选择下一步的创作方式”） ---- */
.s2-stage .s2ie-step-sub {
  margin: 12px 0 10px; font-size: .84rem; font-weight: 600; color: #cfe0f0;
  display: flex; align-items: center; gap: 8px;
}
.s2-stage .s2ie-step-sub::before {
  content: ""; width: 16px; height: 2px; border-radius: 2px;
  background: linear-gradient(90deg,#00cae0,#7850ff);
  box-shadow: 0 0 8px rgba(0,202,224,.7);
}
.s2-stage .s2ie-sub2 { font-size: .86rem; color: #c3d3e6; line-height: 1.6;
  background: rgba(0,202,224,.07); border: 1px solid rgba(0,202,224,.18);
  border-radius: 10px; padding: 10px 13px; }
.s2-stage .s2ie-chosen { font-size: .82rem; color: #8ff0c0; margin-bottom: 10px; font-weight: 600; }

/* ---- 回退钮 ---- */
.s2-stage .rollback-btn {
  float: right; display: inline-flex; align-items: center; gap: 5px;
  background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.1);
  color: #aebdd0; border-radius: 999px; padding: 4px 11px; font-size: .72rem; cursor: pointer;
}
.s2-stage .rollback-btn:hover { color: #fff; border-color: rgba(255,255,255,.25); }

/* ---- 确认主钮：青蓝渐变 + 辉光 ---- */
.s2-stage .action-area { display: flex; align-items: center; gap: 10px; margin-top: 14px; flex-wrap: wrap; }
.s2-stage .confirm-btn {
  display: inline-flex; align-items: center; gap: 7px;
  background: linear-gradient(135deg,#06c6dd 0%,#2f7cf6 100%);
  color: #03131c; font-weight: 700; font-size: .88rem;
  border: none; border-radius: 11px; padding: 10px 20px; cursor: pointer; font-family: inherit;
  box-shadow: 0 8px 24px rgba(0,180,224,.38), inset 0 1px 0 rgba(255,255,255,.45);
  transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
}
.s2-stage .confirm-btn svg { color: #03131c; }
.s2-stage .confirm-btn:hover { transform: translateY(-1px); filter: brightness(1.06);
  box-shadow: 0 12px 30px rgba(0,180,224,.55), inset 0 1px 0 rgba(255,255,255,.5); }
.s2-stage .confirm-btn:disabled { opacity: .5; cursor: not-allowed; transform: none; filter: none; }
.s2-stage .s2ie-ghost {
  background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.12);
  color: #b9c8da; border-radius: 11px; padding: 10px 16px; cursor: pointer; font-family: inherit; font-size: .84rem;
}
.s2-stage .s2ie-ghost:hover { color: #fff; border-color: rgba(255,255,255,.28); }

/* ---- 调整建议区 ---- */
.s2-stage .suggestion-section { margin-top: 12px; }
.s2-stage .suggestion-label { font-size: .74rem; color: #8fa3ba; margin-bottom: 6px; }
.s2-stage .suggestion-area { display: flex; align-items: center; gap: 8px;
  background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.1);
  border-radius: 10px; padding: 7px 11px; }
.s2-stage .suggestion-icon { color: #00cae0; flex-shrink: 0; }
.s2-stage .suggestion-input {
  flex: 1; background: transparent; border: none; outline: none; resize: none;
  color: #dce7f3; font-size: .82rem; font-family: inherit;
}
.s2-stage .suggestion-hint { font-size: .68rem; color: #7488a0; flex-shrink: 0; }

/* ---- 内卡：意图 / 方向 统一玻璃底（保留变体配色，仅加通透与描边） ---- */
.s2-stage .option-card,
.s2-stage .fangxiang-card {
  backdrop-filter: blur(10px) saturate(1.2);
  -webkit-backdrop-filter: blur(10px) saturate(1.2);
  border-radius: 13px;
  transition: transform .16s ease, box-shadow .16s ease;
}
.s2-stage .option-card:hover,
.s2-stage .fangxiang-card:hover { transform: translateY(-2px); }

/* ---- 资产卡 ---- */
.s2-stage .asset-card {
  background: linear-gradient(160deg, rgba(255,255,255,.055), rgba(255,255,255,.02));
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 13px; overflow: hidden;
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  transition: transform .16s ease, box-shadow .16s ease;
}
.s2-stage .asset-card:hover { transform: translateY(-2px); box-shadow: 0 14px 30px rgba(0,0,0,.4); }
.s2-stage .asset-card.add-card { background: transparent; border: 1px dashed rgba(255,255,255,.18); }

/* ---- 分镜卡 ---- */
.s2-stage .shot-card {
  background: linear-gradient(160deg, rgba(255,255,255,.05), rgba(255,255,255,.018));
  border: 1px solid rgba(255,255,255,.085);
  border-radius: 13px; padding: 12px 14px;
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  margin-bottom: 12px;
}
.s2-stage .shot-row { display: flex; gap: 10px; margin-top: 9px; }
.s2-stage .row-icon { flex-shrink: 0; width: 26px; height: 26px; border-radius: 8px;
  display: flex; align-items: center; justify-content: center; background: rgba(255,255,255,.06); font-size: .82rem; }
.s2-stage .row-content { flex: 1; min-width: 0; }
.s2-stage .row-label { font-size: .68rem; color: #8497ad; margin-bottom: 2px; }
.s2-stage .row-text { font-size: .82rem; color: #d2dfec; line-height: 1.55; }

/* ---- 视频提示词合并框 / 成片 ---- */
.s2-stage .merged-prompt-header,
.s2-stage .merged-prompt-text {
  background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.09);
  border-radius: 10px; padding: 10px 13px;
}
.s2-stage .vo-item { margin-top: 10px; }
.s2-stage .vo-add {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  border: 1px dashed rgba(0,202,224,.4); border-radius: 12px;
  padding: 14px; color: #7fe9f5; cursor: pointer; background: rgba(0,202,224,.05);
}
.s2-stage .vo-add:hover { background: rgba(0,202,224,.12); }
.s2-stage .vo-failed {
  border: 1px solid rgba(248,113,113,.4); background: rgba(248,113,113,.08);
  border-radius: 12px; padding: 14px; color: #fca5a5; text-align: center;
}
.s2-stage .vo-done { position: relative; border-radius: 12px; overflow: hidden; border: 1px solid rgba(255,255,255,.1); }

/* ---- 加载/错误文案 ---- */
.s2-stage .s2ie-loading-tx { color: #9db2c8; font-size: .86rem; display: flex; align-items: center; gap: 9px; }
.s2-stage .s2ie-err { color: #fca5a5; font-size: .84rem; line-height: 1.5; }
.s2-stage .s2ie-muted { color: #7488a0; font-size: .82rem; }

/* ---- 空章节态 ---- */
.s2-stage.s2ie-empty .s2ie-empty-chapter { text-align: center; padding: 70px 20px; }
.s2-stage .s2ie-empty-ico { font-size: 3rem; margin-bottom: 14px; }
.s2-stage .s2ie-empty-tx { font-size: 1.05rem; font-weight: 700; color: #e6eff8; margin-bottom: 8px; }
.s2-stage .s2ie-empty-sub { font-size: .84rem; color: #8fa3ba; }

/* ============================================================
   玩法说明 → 左下角动作槽（最高优先级，覆盖 s2-studio.css 旧胶囊规则）
   ============================================================ */
#wsComposer #agBottomActionLeft { position: absolute; z-index: 60; left: 22px; top: auto; bottom: 72px; transform: none; }
#wsComposer #agBottomActionLeft #agPlaybookBtn {
  position: static !important;
  width: 38px !important; height: 38px !important; flex: 0 0 auto !important;
  padding: 0 !important; margin: 0 !important; border-radius: 50% !important;
  display: inline-flex !important; flex-direction: row !important; align-items: center !important; justify-content: center !important;
  gap: 0 !important; font-size: 0 !important; line-height: 1 !important;
  color: rgba(0,202,224,.95) !important;
  background: rgba(0,202,224,.10) !important;
  border: 1px solid rgba(0,202,224,.45) !important;
  box-shadow: none !important;
}
#wsComposer #agBottomActionLeft #agPlaybookBtn svg { width: 19px !important; height: 19px !important; flex: 0 0 auto !important; }
#wsComposer #agBottomActionLeft #agPlaybookBtn span { display: none !important; }
#wsComposer #agBottomActionLeft #agPlaybookBtn::before { content: none !important; }
#wsComposer #agBottomActionLeft #agPlaybookBtn::after { content: none !important; }
#wsComposer #agBottomActionLeft #agPlaybookBtn:hover {
  background: rgba(0,202,224,.22) !important; border-color: rgba(0,202,224,.75) !important;
}
#agPlaybookTip {
  position: absolute; left: 48px; top: 50%; transform: translateY(-50%) translateX(-4px);
  opacity: 0; pointer-events: none; transition: opacity .15s, transform .15s;
  white-space: nowrap; font-size: 12px; color: #dff6fb;
  background: rgba(15,23,34,.94); border: 1px solid rgba(0,202,224,.35);
  padding: 5px 10px; border-radius: 8px;
}
#wsComposer #agBottomActionLeft:hover #agPlaybookTip { opacity: 1; transform: translateY(-50%) translateX(0); }
html[data-theme="light"] #wsComposer #agBottomActionLeft #agPlaybookBtn { background:#fff !important; border-color:#bfeaf0 !important; color:#0e8a99 !important; }

/* ---- 章节按钮选中高亮（1:1 参考站：当前章节青色高亮 + 左侧点亮） ---- */
.s2proj-chap { transition: background .15s, color .15s, border-color .15s; }
.s2proj-chap.active {
  color: #67e8f9 !important;
  background: rgba(0,202,224,.14) !important;
  border-color: rgba(0,202,224,.55) !important;
}
.s2proj-chap.active .s2proj-chap-dot { background: #00cae0 !important; box-shadow: 0 0 8px rgba(0,202,224,.9); }
html[data-theme="light"] .s2proj-chap.active { color:#0e7490 !important; background:#eafafc !important; border-color:#22d1dc !important; }

/* ---- 项目栏展开/收起：作曲器 + 对话历史竖钮整体右靠（1:1 参考站 flex 右推效果） ---- */
#wsComposer { margin-left: 0; transition: margin-left .22s ease; }
#sbHistoryAnchor { left: 0; transition: left .22s ease; }
.workspace-shell.s2proj-state-collapsed #wsComposer { margin-left: 44px; }
.workspace-shell.s2proj-state-open #wsComposer { margin-left: 340px; }
.workspace-shell.s2proj-state-collapsed #sbHistoryAnchor { left: 44px; }
.workspace-shell.s2proj-state-open #sbHistoryAnchor { left: 340px; }
/* 窄屏浮层态项目栏不占位，作曲器/历史钮保持原位 */
@media (max-width: 960px) {
  .workspace-shell.s2proj-state-open #wsComposer { margin-left: 0; }
  .workspace-shell.s2proj-state-open #sbHistoryAnchor { left: 0; }
}

/* ---- 作曲器恢复正常流式堆叠（更大、底栏不重叠，S2 / agent-mode） ---- */
#wsComposer.agent-mode.cp-v2 .composer-box {
  display: block !important; height: auto !important; padding: 14px 16px 12px !important;
}
#wsComposer.agent-mode.cp-v2 .composer-params {
  position: static !important; min-height: 0 !important; margin: 6px 0 0 !important; padding: 0 !important;
}
#wsComposer.agent-mode.cp-v2 .composer-bottom {
  position: static !important; height: auto !important; margin: 8px 0 0 !important; padding: 0 !important;
  display: flex !important; align-items: center; gap: 10px; flex-wrap: wrap;
}
#wsComposer.agent-mode.cp-v2 .composer-box textarea {
  min-height: 96px !important; padding: 4px 0 !important; font-size: 14.5px; line-height: 1.65;
}
#wsComposer.agent-mode .cp-layout { align-items: stretch; }
#wsComposer.agent-mode #s2ComposerBar,
#wsComposer.agent-mode #s2ModeSwitch,
#wsComposer.agent-mode .send-stack { align-self: center; display: flex; align-items: center; }
#wsComposer.agent-mode #s2ModeSwitch { margin-left: 6px; }
#wsComposer.agent-mode .send-stack .send-btn,
#wsComposer.agent-mode .send-stack button { width: 36px; height: 36px; }
/* 窄屏：可换行、不挤压 */
@media (max-width: 1180px) {
  #wsComposer.agent-mode.cp-v2 .composer-box textarea { min-height: 72px !important; }
  #wsComposer.agent-mode .composer-bottom { gap: 8px; }
}

/* @pb-visibility-bound : 显隐只认 agent-mode，杜绝模型模式残留/竞态 */
#wsComposer:not(.agent-mode) #agBottomActionLeft #agPlaybookBtn { display: none !important; }
#wsComposer.agent-mode #agBottomActionLeft #agPlaybookBtn { display: inline-flex !important; }
