/* BODHI Dashboard · css/orchestration.css · 编排画布（节点图）
   层叠位置 = index.html 里排在 scene-board.css 之后。
   ⚠ 纪律同 ui.css 头部：带组件类的元素**不叠同域 tailwind 工具类**，要微调就在这里加修饰类。

   六个类型色是本文件唯一新增的 token；其余颜色/圆角/阴影/动效一律取 ui.css 的 --b-* / --mo-*。 */

:root {
  --orch-c-beat:   rgb(var(--gold-500));   /* 金：节拍——与全站主色同源，它是唯一原子 */
  --orch-c-dyn:    #4a7fa8;   /* 蓝：动态分镜 */
  --orch-c-board:  #3f6b58;   /* 绿：故事板 */
  --orch-c-image:  #7a5a9c;   /* 紫：图片 */
  --orch-c-video:  #9c5a43;   /* 红棕：正片视频 */
  --orch-c-audio:  #3c8489;   /* 青：音频 */
  --orch-node-bg:  var(--b-surface);
}
.dark {
  --orch-c-beat:   #d8ab63;
  --orch-c-dyn:    #7fb2d8;
  --orch-c-board:  #6fae92;
  --orch-c-image:  #b092d4;
  --orch-c-video:  #d1917a;
  --orch-c-audio:  #6cc0c6;
  --orch-node-bg:  var(--b-surface-2);
}

/* ── 宿主 ─────────────────────────────────────────────────────────── */
.orch-root {
  position: relative;
  height: 72vh;
  min-height: 480px;
  border: 1px solid var(--b-line);
  border-radius: var(--b-radius-lg);
  overflow: hidden;
  background: var(--b-canvas);
}
.orch-fullscreen {
  position: fixed;
  inset: 0;
  z-index: 45;
  background: var(--b-canvas);
}
.orch-fullscreen { display: flex; flex-direction: column; }
.orch-root.is-fullscreen {
  flex: 1;
  height: auto;
  min-height: 0;
  border: 0;
  border-radius: 0;
}
/* 全屏自带的顶栏：工具条原本长在页签条右侧，全屏后被 overlay 盖住，搬到这里来 */
.orch-fs-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 7px 12px;
  border-bottom: 1px solid var(--b-line);
  background: var(--b-surface);
}
.orch-fs-title { font-size: 12.5px; font-weight: 600; color: var(--b-text); }
.orch-fs-meta { flex: 1; min-width: 0; }
.orch-fs-tools { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.orch-elsewhere,
.orch-loading,
.orch-error {
  padding: 28px 18px;
  text-align: center;
  font-size: 13px;
  color: var(--b-text-dim);
}
.orch-error { color: var(--b-red); }

/* ── 视口与世界 ───────────────────────────────────────────────────── */
.orch-viewport {
  position: absolute;
  inset: 0;
  overflow: hidden;
  cursor: grab;
  touch-action: none;
  background-image: radial-gradient(var(--b-line) 1px, transparent 1px);
  background-size: 24px 24px;
  outline: none;
}
body.orch-dragging { user-select: none; cursor: grabbing; }
body.orch-dragging .orch-viewport { cursor: grabbing; }

.orch-world {
  position: absolute;
  left: 0;
  top: 0;
  transform-origin: 0 0;
  will-change: transform;
}
.orch-edges {
  position: absolute;
  left: 0;
  top: 0;
  overflow: visible;
  pointer-events: none;
}
.orch-edge {
  fill: none;
  stroke: var(--b-line-2);
  stroke-width: 2;
  pointer-events: stroke;
  cursor: pointer;
  transition: stroke var(--mo-fast) var(--mo-out), stroke-width var(--mo-fast) var(--mo-out);
}
/* 深色下边线压到 60%，否则一屏连线比节点还抢眼 */
.dark .orch-edge { opacity: .6; }
.orch-edge:hover { stroke-width: 3; }
.orch-edge.is-sel { stroke: var(--b-gold); stroke-width: 3.5; }
.dark .orch-edge.is-sel { opacity: 1; }
.orch-edge-temp { stroke: var(--b-gold-soft); stroke-dasharray: 6 5; pointer-events: none; }
.orch-edge[data-edge-kind="shot"]       { stroke: var(--orch-c-beat); }
.orch-edge[data-edge-kind="dynboard"]   { stroke: var(--orch-c-dyn); }
.orch-edge[data-edge-kind="storyboard"] { stroke: var(--orch-c-board); }
.orch-edge[data-edge-kind="image"]      { stroke: var(--orch-c-image); }
.orch-edge[data-edge-kind="video"]      { stroke: var(--orch-c-video); }
.orch-edge[data-edge-kind="audio"]      { stroke: var(--orch-c-audio); }
.orch-edge-no {
  font-size: 10px;
  fill: var(--b-text-dim);
  font-family: ui-monospace, monospace;
}

.orch-marquee {
  position: absolute;
  border: 1px dashed var(--b-gold);
  background: rgb(var(--gold-500) / .12);
  border-radius: 4px;
  pointer-events: none;
}

/* ── 节点卡 ───────────────────────────────────────────────────────── */
.orch-node {
  position: absolute;
  background: var(--orch-node-bg);
  border: 1px solid var(--b-line);
  border-radius: var(--b-radius);
  box-shadow: var(--b-shadow-sm);
  font-size: 12px;
  color: var(--b-text);
  cursor: grab;
  animation: orch-node-in var(--mo-slow) var(--mo-out) both;
}
@keyframes orch-node-in {
  from { opacity: 0; transform: translateY(var(--mo-rise)) scale(.97); }
  to   { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .orch-node { animation: none; }
}
.orch-node.is-sel {
  border-color: var(--b-gold);
  box-shadow: 0 0 0 2px rgb(var(--gold-500) / .3), var(--b-shadow);
}
.orch-node.is-drop-ok  { border-color: var(--b-green); box-shadow: 0 0 0 3px rgb(63 107 88 / .35); }
.orch-node.is-drop-bad { border-color: var(--b-red);   box-shadow: 0 0 0 3px rgb(156 77 67 / .35); }
.orch-node[data-missing="1"] { border-style: dashed; opacity: .85; }

.orch-node-head {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 5px 6px 5px 9px;
  border-bottom: 1px solid var(--b-line);
  border-left: 3px solid var(--b-line-2);
  border-radius: var(--b-radius) var(--b-radius) 0 0;
}
.orch-node[data-node-type="shot"]       .orch-node-head { border-left-color: var(--orch-c-beat); }
.orch-node[data-node-type="dynboard"]   .orch-node-head { border-left-color: var(--orch-c-dyn); }
.orch-node[data-node-type="storyboard"] .orch-node-head { border-left-color: var(--orch-c-board); }
.orch-node[data-node-type="image"]      .orch-node-head { border-left-color: var(--orch-c-image); }
.orch-node[data-node-type="video"]      .orch-node-head { border-left-color: var(--orch-c-video); }
.orch-node[data-node-type="audio"]      .orch-node-head { border-left-color: var(--orch-c-audio); }

.orch-node-icon { font-size: 13px; line-height: 1; }
.orch-node-title {
  flex: 1;
  min-width: 0;
  font-weight: 600;
  font-size: 12px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.orch-node-body {
  padding: 6px 9px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-height: 26px;
}
.orch-node-empty, .orch-missing { color: var(--b-text-dim); font-size: 11px; }
.orch-missing { color: var(--b-red); padding: 8px 9px; }

.orch-node-foot {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 4px 9px 6px;
  border-top: 1px solid var(--b-line);
}
.orch-chip {
  font-size: 10.5px;
  padding: 1px 7px;
  border-radius: 999px;
  border: 1px solid var(--b-line);
  color: var(--b-text-dim);
  white-space: nowrap;
}
.orch-chip[data-state="ready"]   { border-color: var(--orch-c-beat); color: var(--orch-c-beat); }
.orch-chip[data-state="done"]    { border-color: var(--b-green); color: var(--b-green); }
.orch-chip[data-state="missing"],
.orch-chip[data-state="failed"]  { border-color: var(--b-red); color: var(--b-red); }
.orch-chip[data-state="busy"] {
  border-color: var(--b-blue);
  color: var(--b-blue);
  animation: orch-pulse 1.4s ease-in-out infinite;
}
@keyframes orch-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .45; } }

/* ── 端口 ─────────────────────────────────────────────────────────── */
.orch-port {
  position: absolute;
  top: 50%;
  width: 12px;
  height: 12px;
  margin-top: -6px;
  border-radius: 50%;
  border: 2px solid var(--b-surface);
  background: var(--b-line-2);
  transition: transform var(--mo-fast) var(--mo-out), background var(--mo-fast) var(--mo-out);
}
.orch-port-in  { left: -7px; }
.orch-port-out { right: -7px; cursor: crosshair; }
.orch-port:hover { transform: scale(1.5); background: var(--b-gold); }
.orch-node[data-node-type="shot"]       .orch-port-out { background: var(--orch-c-beat); }
.orch-node[data-node-type="dynboard"]   .orch-port-out { background: var(--orch-c-dyn); }
.orch-node[data-node-type="storyboard"] .orch-port-out { background: var(--orch-c-board); }
.orch-node[data-node-type="image"]      .orch-port-out { background: var(--orch-c-image); }
.orch-node[data-node-type="video"]      .orch-port-out { background: var(--orch-c-video); }
.orch-node[data-node-type="audio"]      .orch-port-out { background: var(--orch-c-audio); }
/* 连成一条时端口弹一下——幅度要看得见，不然等于没做（memory motion_amplitude_perceptible） */
.orch-port.orch-pop { animation: orch-pop 420ms var(--mo-spring); }
@keyframes orch-pop {
  0% { transform: scale(1); }
  45% { transform: scale(2.1); }
  100% { transform: scale(1); }
}

/* ── 节拍节点正文 ─────────────────────────────────────────────────── */
.orch-beat-line { display: flex; align-items: center; gap: 5px; flex-wrap: wrap; }
.orch-beat-dur {
  font-family: ui-monospace, monospace;
  font-size: 11px;
  color: var(--orch-c-beat);
  font-weight: 600;
}
.orch-beat-track { font-size: 10.5px; color: var(--b-text-dim); }
.orch-char-chip {
  font-size: 10.5px;
  padding: 0 6px;
  border-radius: 999px;
  background: var(--b-surface-3);
  color: var(--b-text-2);
}
.orch-beat-dots { display: flex; gap: 4px; }
.orch-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  border: 1px solid var(--b-line-2);
  background: transparent;
}
.orch-dot.is-on { background: var(--b-green); border-color: var(--b-green); }
.orch-thumb {
  width: 54px;
  height: 32px;
  object-fit: cover;
  border-radius: 4px;
  border: 1px solid var(--b-line);
  cursor: zoom-in;
}
.orch-ref-summary { display: flex; flex-direction: column; gap: 2px; }
.orch-ref-kv { font-size: 11px; color: var(--b-text-2); display: flex; gap: 6px; }
.orch-ref-kv b { color: var(--b-text-dim); font-weight: 500; }

/* ── palette / minimap / 状态栏 ───────────────────────────────────── */
.orch-palette {
  position: absolute;
  left: 10px;
  top: 10px;
  z-index: 3;
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 6px;
  background: var(--b-surface);
  border: 1px solid var(--b-line);
  border-radius: var(--b-radius);
  box-shadow: var(--b-shadow-sm);
}
.orch-palette-head {
  font-size: 10px;
  color: var(--b-text-dim);
  letter-spacing: .08em;
  padding: 0 2px 2px;
}
.orch-pal-btn {
  display: flex;
  align-items: center;
  gap: 6px;
  border: 1px solid transparent;
  background: transparent;
  color: var(--b-text-2);
  font-size: 11.5px;
  padding: 3px 8px 3px 5px;
  border-radius: 5px;
  cursor: pointer;
  text-align: left;
}
.orch-pal-btn:hover { background: var(--b-surface-3); border-color: var(--b-line); color: var(--b-text); }
.orch-pal-btn[disabled] { opacity: .4; cursor: not-allowed; }
.orch-pal-icon { width: 14px; text-align: center; }
.orch-pal-btn[data-new-node="shot"]       .orch-pal-icon { color: var(--orch-c-beat); }
.orch-pal-btn[data-new-node="dynboard"]   .orch-pal-icon { color: var(--orch-c-dyn); }
.orch-pal-btn[data-new-node="storyboard"] .orch-pal-icon { color: var(--orch-c-board); }
.orch-pal-btn[data-new-node="image"]      .orch-pal-icon { color: var(--orch-c-image); }
.orch-pal-btn[data-new-node="video"]      .orch-pal-icon { color: var(--orch-c-video); }
.orch-pal-btn[data-new-node="audio"]      .orch-pal-icon { color: var(--orch-c-audio); }

.orch-minimap {
  position: absolute;
  right: 10px;
  bottom: 10px;
  z-index: 3;
  width: 160px;
  height: 100px;
  background: var(--b-surface);
  border: 1px solid var(--b-line);
  border-radius: var(--b-radius);
  box-shadow: var(--b-shadow-sm);
  overflow: hidden;
  cursor: pointer;
}
.orch-mm-node { position: absolute; border-radius: 1px; background: var(--b-line-2); }
.orch-mm-node[data-node-type="shot"]       { background: var(--orch-c-beat); }
.orch-mm-node[data-node-type="dynboard"]   { background: var(--orch-c-dyn); }
.orch-mm-node[data-node-type="storyboard"] { background: var(--orch-c-board); }
.orch-mm-node[data-node-type="image"]      { background: var(--orch-c-image); }
.orch-mm-node[data-node-type="video"]      { background: var(--orch-c-video); }
.orch-mm-node[data-node-type="audio"]      { background: var(--orch-c-audio); }
.orch-mm-view {
  position: absolute;
  border: 1px solid var(--b-gold);
  background: rgb(var(--gold-500) / .1);
  pointer-events: none;
}

.orch-status {
  position: absolute;
  left: 10px;
  bottom: 10px;
  z-index: 3;
  display: flex;
  gap: 12px;
  align-items: center;
  padding: 4px 10px;
  font-size: 11px;
  color: var(--b-text-2);
  background: var(--b-surface);
  border: 1px solid var(--b-line);
  border-radius: 999px;
  box-shadow: var(--b-shadow-sm);
}
.orch-status-dim { color: var(--b-text-dim); }
.orch-status-save { font-family: ui-monospace, monospace; }

/* ── 拖到空白弹出的「新建什么节点」小菜单 ─────────────────────────── */
.orch-menu {
  position: absolute;
  z-index: 6;
  min-width: 132px;
  padding: 4px;
  background: var(--b-surface);
  border: 1px solid var(--b-line);
  border-radius: var(--b-radius);
  box-shadow: var(--b-shadow);
}
.orch-menu-head {
  font-size: 10.5px;
  color: var(--b-text-dim);
  padding: 3px 8px 5px;
}
.orch-menu-item {
  display: block;
  width: 100%;
  text-align: left;
  border: 0;
  background: transparent;
  color: var(--b-text-2);
  font-size: 12px;
  padding: 5px 8px;
  border-radius: 5px;
  cursor: pointer;
}
.orch-menu-item:hover { background: var(--b-surface-3); color: var(--b-text); }

/* ── 快捷键提示层 ─────────────────────────────────────────────────── */
.orch-help {
  position: absolute;
  inset: 0;
  z-index: 8;
  background: rgb(var(--ink-950) / .55);
  display: flex;
  align-items: center;
  justify-content: center;
}
.orch-help-card {
  background: var(--b-surface);
  border: 1px solid var(--b-line);
  border-radius: var(--b-radius-lg);
  box-shadow: var(--b-shadow);
  padding: 16px 20px;
  max-height: 82%;
  overflow-y: auto;
}
.orch-help-card h4 { font-size: 13px; margin: 0 0 10px; color: var(--b-text); }
.orch-help-row { display: flex; gap: 12px; font-size: 12px; padding: 3px 0; }
.orch-help-row kbd {
  flex: 0 0 168px;
  font-family: ui-monospace, monospace;
  font-size: 11px;
  color: var(--b-gold-deep);
}
.orch-help-row span { color: var(--b-text-2); }
.orch-help-foot { font-size: 11px; color: var(--b-text-dim); margin: 10px 0 0; }

/* ── 工具条里的图切换 + 挑选 modal ───────────────────────────────── */
.orch-graph-pick {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 11px;
  color: var(--b-text-dim);
}
.orch-select {
  font-size: 12px;
  padding: 2px 6px;
  border-radius: 5px;
  border: 1px solid var(--b-line);
  background: var(--b-surface);
  color: var(--b-text);
}
.orch-meta-hint { font-size: 11px; color: var(--b-text-dim); }

.orch-pick-card { width: 520px; max-width: 92vw; padding: 16px 18px; }
.orch-pick-title { font-size: 14px; margin: 0; color: var(--b-text); }
.orch-pick-sub { font-size: 11.5px; color: var(--b-text-dim); margin: 4px 0 0; }
.orch-pick-list {
  margin: 12px 0;
  max-height: 46vh;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.orch-pick-row {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  text-align: left;
  border: 1px solid transparent;
  background: transparent;
  border-radius: 6px;
  padding: 6px 9px;
  font-size: 12.5px;
  color: var(--b-text-2);
  cursor: pointer;
}
.orch-pick-row:hover { background: var(--b-surface-3); border-color: var(--b-line); color: var(--b-text); }
.orch-pick-row.is-disabled { opacity: .4; cursor: not-allowed; }
.orch-pick-label { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.orch-pick-meta { font-family: ui-monospace, monospace; font-size: 11px; color: var(--b-text-dim); }
.orch-pick-empty { font-size: 12px; color: var(--b-text-dim); padding: 18px; text-align: center; }
.orch-pick-foot { display: flex; gap: 8px; justify-content: flex-end; }

/* ── 移动端：画布不给拖，只出说明 ─────────────────────────────────── */
@media (max-width: 768px) {
  .orch-palette, .orch-minimap { display: none; }
  .orch-root { height: 60vh; min-height: 320px; }
}

/* ── 动态分镜节点（M2）───────────────────────────────────────────────── */
.orch-dyn-line {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  color: var(--b-text-2);
  flex-wrap: wrap;
}
.orch-dyn-slate {
  font-family: ui-monospace, monospace;
  font-weight: 600;
  color: var(--b-text);
}
.orch-strip {
  width: 100%;
  height: 34px;
  object-fit: cover;
  border-radius: 4px;
  border: 1px solid var(--b-line);
  background: var(--b-surface-3);
}

/* ── 故事板节点（M3）─────────────────────────────────────────────────── */
.orch-board-line {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  color: var(--b-text-2);
  flex-wrap: wrap;
}
.orch-board-adopted {
  font-size: 10px;
  padding: 0 6px;
  border-radius: 999px;
  border: 1px solid var(--b-gold-soft);
  color: var(--b-gold-deep);
}
.orch-board-cells { display: flex; gap: 3px; flex-wrap: wrap; }

/* ── 设置面板的基础件（字段 / 输入 / 拍列表 / 预览……；栏骨架见下面「页签骨架」）── */
.orch-set-box {
  border: 1px solid var(--b-line);
  border-radius: var(--b-radius);
  background: var(--b-surface-2);
  padding: 10px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}
.orch-set-h { font-size: 12px; margin: 0; color: var(--b-text); font-weight: 600; }
.orch-set-field { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.orch-set-label { font-size: 11px; color: var(--b-text-dim); }
.orch-set-hint { font-size: 10.5px; color: var(--b-text-dim); }
.orch-set-input {
  width: 100%;
  box-sizing: border-box;
  font-size: 12px;
  padding: 4px 6px;
  border: 1px solid var(--b-line);
  border-radius: 5px;
  background: var(--b-surface);
  color: var(--b-text);
}
.orch-set-ta { font-family: inherit; resize: vertical; }
.orch-set-beats {
  display: flex; flex-direction: column; gap: 2px;
  max-height: 190px; overflow-y: auto;
}
.orch-set-beat {
  display: flex; gap: 6px; align-items: baseline;
  font-size: 11px; color: var(--b-text-2);
}
.orch-set-beat b { font-family: ui-monospace, monospace; color: var(--b-text); }
.orch-set-beat i { margin-left: auto; font-style: normal; color: var(--b-text-dim); }
.orch-set-empty, .orch-set-note { font-size: 11px; color: var(--b-text-dim); margin: 0; }
.orch-set-sum { font-size: 11px; color: var(--b-text-2); }
.orch-set-pre {
  font-size: 11px;
  line-height: 1.55;
  white-space: pre-wrap;
  max-height: 220px;
  overflow: auto;
  background: var(--b-surface-3);
  border: 1px solid var(--b-line);
  border-radius: 5px;
  padding: 8px;
  margin: 0;
  color: var(--b-text-2);
}
.orch-set-pre.is-loading { opacity: .45; }
.orch-set-chan { font-size: 12px; max-height: 420px; overflow: auto; }
.orch-set-lines {
  border: 1px solid var(--b-line);
  border-radius: var(--b-radius);
  background: var(--b-surface-2);
  padding: 8px 10px;
  font-size: 11.5px;
  color: var(--b-text-2);
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.orch-set-lines[data-orch-apply-lines="0"] { display: none; }
.orch-set-lines-h { font-size: 11px; color: var(--b-text-dim); }
.orch-set-line.is-warn { color: var(--b-gold-deep); }
.orch-set-picks { display: flex; flex-direction: column; gap: 3px; max-height: 200px; overflow-y: auto; }
.orch-set-pick {
  display: flex; gap: 6px; align-items: baseline;
  font-size: 11px; color: var(--b-text-2); cursor: pointer;
}
.orch-set-pick b { font-family: ui-monospace, monospace; color: var(--b-text); }

/* ── 图片节点（M4）─────────────────────────────────────────────────── */
.orch-img-compact { display: flex; gap: 8px; align-items: flex-start; }
.orch-img-thumb {
  width: 66px; height: 44px; object-fit: cover; flex: 0 0 auto;
  border-radius: 4px; border: 1px solid var(--b-line);
  background: var(--b-surface-3);
}
.orch-img-meta { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.orch-img-name {
  font-size: 11.5px; color: var(--b-text-2);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.orch-img-cat {
  align-self: flex-start;
  font-size: 10px; padding: 1px 5px; border-radius: 999px;
  border: 1px solid var(--orch-c-image); color: var(--orch-c-image);
}
.orch-img-blank {
  width: 66px; height: 44px; flex: 0 0 auto;
  display: flex; align-items: center; justify-content: center;
  font-size: 10px; text-align: center; line-height: 1.3;
  color: var(--b-red); border: 1px dashed var(--b-red); border-radius: 4px;
}
.orch-img-prov { font-size: 10.5px; color: var(--b-text-dim); line-height: 1.45; }

/* ── 音频节点（M4）─────────────────────────────────────────────────── */
.orch-audio-compact { display: flex; flex-direction: column; gap: 5px; }
.orch-audio-line { display: flex; align-items: center; gap: 6px; min-width: 0; }
.orch-audio-icon { font-size: 13px; line-height: 1; }
.orch-audio-name {
  font-size: 11.5px; color: var(--b-text-2); min-width: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.orch-audio-kind {
  margin-left: auto; flex: 0 0 auto;
  font-size: 10px; padding: 1px 5px; border-radius: 999px;
  border: 1px solid var(--orch-c-audio); color: var(--orch-c-audio);
}
.orch-audio-el { width: 100%; height: 28px; }

/* ── 设置面板的页签骨架（2026-09-08，三个设置窗共用；见 modals/tabbed.js）────
   一次只看一栏：顶部页签条，每栏独占整张卡，卡放宽到 ~1040px，栏内再左右两列。
   之前把 3–4 栏硬塞进 768px，每栏 170px，通道那套药丸折三行、绑定句读不出来。 */
#modal-root .modal-card.orch-set-card { width: 100%; max-width: min(1040px, 94vw); }
.orch-set-tabbed { display: flex; flex-direction: column; gap: 0; min-width: 0; }
.orch-set-tabs {
  display: flex; align-items: center; gap: 2px; flex-wrap: wrap;
  border-bottom: 1px solid var(--b-line-2);
}
.orch-set-tab {
  font-size: 12.5px; padding: 6px 14px; border: 0; background: transparent;
  color: var(--b-text-dim); cursor: pointer; border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  transition: color var(--mo-fast), border-color var(--mo-fast);
}
.orch-set-tab:hover { color: var(--b-text); }
.orch-set-tab.is-active { color: var(--b-gold-deep); border-bottom-color: var(--b-gold); font-weight: 600; }
/* 每栏自己封顶自己滚：整张卡不能撑过一屏，底部那颗「应用接线」得一直按得到 */
/* 面板就是原来那块 `.orch-set-box`（边框与底色留着当框），只把内边距放开 */
.orch-set-pane { max-height: min(64vh, 640px); overflow-y: auto; padding: 12px 14px; gap: 10px; }
.orch-set-two {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 10px 18px; align-items: start; min-width: 0;
}
.orch-set-two.is-3-2 { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); }
.orch-set-two.is-2-3 { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); }
.orch-set-col { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.orch-set-btns { display: flex; gap: 6px; flex-wrap: wrap; }
@media (max-width: 900px) {
  .orch-set-two, .orch-set-two.is-3-2, .orch-set-two.is-2-3 { grid-template-columns: 1fr; }
}
/* 有了整张卡的宽度，字号与各块的封顶都可以放开 */
.orch-set-tabbed .orch-set-input { font-size: 13px; padding: 5px 8px; }
.orch-set-tabbed .orch-set-label { font-size: 11.5px; }
.orch-set-tabbed .orch-set-hint,
.orch-set-tabbed .orch-set-empty, .orch-set-tabbed .orch-set-note { font-size: 11.5px; line-height: 1.5; }
.orch-set-tabbed .orch-set-sum { font-size: 12px; }
.orch-set-tabbed .orch-set-beats { max-height: 320px; gap: 4px; }
.orch-set-tabbed .orch-set-beat { font-size: 12px; }
.orch-set-tabbed .orch-set-beat span {
  flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.orch-set-tabbed .orch-set-pre { max-height: 380px; font-size: 12px; }
.orch-set-tabbed .orch-set-chan { max-height: none; overflow: visible; font-size: 13px; }
.orch-set-tabbed .orch-set-picks { max-height: 320px; gap: 5px; }
.orch-set-tabbed .orch-set-pick { font-size: 12px; }
.orch-set-tabbed .orch-set-pick span {
  flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* ── 设置窗「详情」页签（2026-09-08 晚，卡片详情视图并进来的；modals/detail-bits.js）── */
.orch-set-kvs { display: flex; flex-direction: column; gap: 4px; }
.orch-set-kv {
  display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: 8px;
  font-size: 12.5px; color: var(--b-text-2); line-height: 1.5; min-width: 0;
}
.orch-set-kv b { color: var(--b-text-dim); font-weight: 500; }
.orch-set-kv span { min-width: 0; overflow-wrap: anywhere; }
.orch-set-acts { display: flex; gap: 6px; flex-wrap: wrap; padding-top: 4px; }
.orch-set-blank {
  display: flex; align-items: center; justify-content: center; text-align: center;
  font-size: 12px; line-height: 1.5; color: var(--b-text-dim);
  border: 1px dashed var(--b-line); border-radius: 6px; padding: 10px; min-height: 60px;
}
.orch-set-blank.is-big { min-height: 160px; padding: 20px; }
.orch-set-bigimg {
  display: block; width: 100%; max-height: min(60vh, 560px); object-fit: contain;
  border-radius: 6px; border: 1px solid var(--b-line);
  background: var(--b-surface-3); cursor: zoom-in;
}
.orch-set-audio { width: 100%; height: 36px; }
/* 镜次：一格一条能播的视频 */
.orch-set-takes {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px;
}
.orch-set-take {
  margin: 0; min-width: 0; display: flex; flex-direction: column; gap: 4px;
  padding: 4px; border: 1px solid var(--b-line); border-radius: 6px; background: var(--b-surface);
}
.orch-set-take.is-sel { border-color: var(--b-gold); box-shadow: 0 0 0 1px var(--b-gold-soft); }
.orch-set-video {
  display: block; width: 100%; aspect-ratio: 16 / 9; background: #000; border-radius: 4px;
}
.orch-set-strip { display: block; width: 100%; border-radius: 4px; object-fit: cover; }
.orch-set-take figcaption { display: flex; align-items: center; gap: 6px; font-size: 11.5px; color: var(--b-text-2); }
.orch-set-take figcaption b { font-family: ui-monospace, monospace; color: var(--b-text); }
.orch-set-take-tag {
  font-size: 10.5px; padding: 0 6px; border-radius: 999px;
  border: 1px solid var(--b-gold); color: var(--b-gold-deep);
}
.orch-set-take figcaption .orch-mini-txt { margin-left: auto; }
.orch-mini-txt {
  font-size: 11px; padding: 1px 8px; border: 1px solid var(--b-line); border-radius: 4px;
  background: var(--b-surface-2); color: var(--b-text-2); cursor: pointer;
}
.orch-mini-txt:hover { border-color: var(--b-gold-soft); color: var(--b-gold-deep); }
/* 切片 / 故事板格：首帧 md 缩略铺格 */
.orch-set-cuts, .orch-set-cells {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px;
}
.orch-set-cut, .orch-set-cell { margin: 0; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.orch-set-cut-img, .orch-set-cell-img {
  display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover;
  border-radius: 4px; border: 1px solid var(--b-line); background: var(--b-surface-3); cursor: pointer;
}
.orch-set-cut .orch-set-blank, .orch-set-cell .orch-set-blank { aspect-ratio: 16 / 9; min-height: 0; padding: 4px; }
.orch-set-cut figcaption, .orch-set-cell figcaption {
  font-size: 11px; color: var(--b-text-dim); font-family: ui-monospace, monospace;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.orch-set-cut.is-missing { opacity: .55; }

/* ── 视频节点设置面板（M5）：参考栏的每一行 ──────────────────────────── */
.orch-set-refs {
  display: flex; flex-direction: column; gap: 3px;
  max-height: 320px; overflow-y: auto;
}
/* 左：编号 / 名字 / 排序与开关；右：绑定句。窄屏退成上下两行。 */
.orch-ref-row {
  display: grid; grid-template-columns: minmax(150px, 2fr) minmax(0, 3fr);
  gap: 4px 10px; align-items: center;
  font-size: 12px; color: var(--b-text-2); min-width: 0;
  padding: 4px 0;
}
.orch-ref-row.is-ro { display: flex; gap: 6px; align-items: center; color: var(--b-text-dim); }
@media (max-width: 900px) { .orch-ref-row { grid-template-columns: 1fr; } }
.orch-ref-row + .orch-ref-row { border-top: 1px dashed var(--b-line); }
.orch-ref-top { display: flex; gap: 5px; align-items: center; min-width: 0; }
.orch-ref-row.is-off { opacity: .45; text-decoration: line-through; }
.orch-ref-no {
  flex: 0 0 auto; font-family: ui-monospace, monospace; font-size: 10.5px;
  padding: 1px 5px; border-radius: 3px;
  background: var(--b-surface-3); color: var(--b-text-dim);
}
.orch-ref-name {
  flex: 1 1 auto; min-width: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.orch-ref-bind { width: 100%; box-sizing: border-box; font-size: 12px; padding: 3px 7px; }
.orch-mini {
  flex: 0 0 auto; width: 20px; height: 20px; line-height: 1;
  border: 1px solid var(--b-line); border-radius: 4px;
  background: var(--b-surface-2); color: var(--b-text-dim);
  font-size: 11px; cursor: pointer;
}
.orch-mini:hover { border-color: var(--b-gold-soft); color: var(--b-gold-deep); }
.orch-mini[disabled] { opacity: .4; cursor: not-allowed; }

/* ── M6：任务芯片走秒 / 只读与空图提示 / 移动端清单 ─────────────────── */

/* 秒数每秒变一次：等宽数字，免得芯片跟着抖 */
.orch-chip-elapsed { font-variant-numeric: tabular-nums; }

/* 只读态：palette 换成一句说明（写按钮一个都不出，规格书 §1.3）*/
.orch-palette-ro,
.orch-palette-hint {
  max-width: 190px;
  font-size: 11px;
  line-height: 1.55;
  color: var(--b-text-dim);
  padding: 4px 4px 2px;
}
.orch-palette-hint {
  margin-top: 4px;
  padding-top: 6px;
  border-top: 1px solid var(--b-line);
}

/* ≤768：不渲染画布，只给节点清单（规格书 §0.2）*/
.orch-mobile { padding: 14px 12px 20px; }
.orch-mobile-head {
  font-size: 15px;
  font-weight: 600;
  color: var(--b-text);
  margin-bottom: 4px;
}
.orch-mobile-note {
  font-size: 12px;
  line-height: 1.6;
  color: var(--b-text-dim);
  margin: 0 0 12px;
}
.orch-mobile-list { display: flex; flex-direction: column; gap: 6px; }
.orch-mobile-graph {
  font-size: 11px;
  color: var(--b-text-dim);
  letter-spacing: .06em;
  margin-top: 8px;
}
.orch-mobile-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 9px;
  border: 1px solid var(--b-line);
  border-radius: var(--b-radius);
  background: var(--b-surface);
}
.orch-mobile-icon { width: 16px; text-align: center; }
.orch-mobile-kind { font-size: 11px; color: var(--b-text-dim); min-width: 3.6em; }
.orch-mobile-title {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 12.5px;
  color: var(--b-text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.orch-mobile-row[data-node-type="shot"]       .orch-mobile-icon { color: var(--orch-c-beat); }
.orch-mobile-row[data-node-type="dynboard"]   .orch-mobile-icon { color: var(--orch-c-dyn); }
.orch-mobile-row[data-node-type="storyboard"] .orch-mobile-icon { color: var(--orch-c-board); }
.orch-mobile-row[data-node-type="image"]      .orch-mobile-icon { color: var(--orch-c-image); }
.orch-mobile-row[data-node-type="video"]      .orch-mobile-icon { color: var(--orch-c-video); }
.orch-mobile-row[data-node-type="audio"]      .orch-mobile-icon { color: var(--orch-c-audio); }

/* 只读弹框：摘掉提交键后在原位说明一句 */
.orch-set-ro-note {
  margin-right: auto;
  font-size: 11.5px;
  color: var(--b-text-dim);
}
.orch-set-ro { line-height: 1.7; }

/* ── 分组（2026-09-08 · 规格书 §13.1）─────────────────────────────────
   展开态是画在**节点层之下**的一块色底：它只是背景，`pointer-events:none`，
   免得挡住底下的平移与框选；只有标题条与四角把手把事件收回来。 */
.orch-group-layer {
  position: absolute;
  left: 0;
  top: 0;
  pointer-events: none;
}
.orch-group {
  position: absolute;
  border: 1.5px solid var(--orch-g-line);
  border-radius: var(--b-radius-lg);
  background: var(--orch-g-fill);
  pointer-events: none;
  animation: orch-node-in var(--mo-slow) var(--mo-out) both;
}
@media (prefers-reduced-motion: reduce) { .orch-group { animation: none; } }
.orch-group.is-sel { border-color: var(--b-gold); box-shadow: 0 0 0 2px rgb(var(--gold-500) / .28); }
.orch-group.is-manual { border-style: dashed; }

/* 整条上缘都是把手（透明），看得见的只是左端那枚色标 */
.orch-group-bar {
  position: absolute;
  left: -1.5px;
  right: -1.5px;
  top: -1.5px;
  height: 26px;
  pointer-events: auto;
  cursor: grab;
}
body.orch-dragging .orch-group-bar { cursor: grabbing; }
.orch-group-head {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 100%;
  height: 100%;
  padding: 0 12px 0 9px;
  border-radius: var(--b-radius-lg) 0 var(--b-radius-lg) 0;
  background: var(--orch-g-line);
  color: #fff;
  font-size: 11.5px;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
}
.orch-group-icon { font-size: 12px; line-height: 1; }
.orch-group-title { overflow: hidden; text-overflow: ellipsis; }
.orch-group-foot {
  position: absolute;
  right: 8px;
  bottom: 5px;
  font-size: 10.5px;
  color: var(--orch-g-line);
  opacity: .85;
}
.orch-group-grip {
  position: absolute;
  width: 14px;
  height: 14px;
  pointer-events: auto;
  border: 1.5px solid var(--orch-g-line);
  background: var(--b-surface);
  border-radius: 3px;
  opacity: 0;
  transition: opacity var(--mo-fast) var(--mo-out);
}
.orch-group:hover .orch-group-grip, .orch-group.is-sel .orch-group-grip { opacity: .9; }
.orch-group-grip-nw { left: -7px;  top: -7px;    cursor: nwse-resize; }
.orch-group-grip-ne { right: -7px; top: -7px;    cursor: nesw-resize; }
.orch-group-grip-sw { left: -7px;  bottom: -7px; cursor: nesw-resize; }
.orch-group-grip-se { right: -7px; bottom: -7px; cursor: nwse-resize; }

/* 折叠态：与节点同款的一张卡（图标 ▣、类型色＝组色） */
.orch-group-card {
  position: absolute;
  background: var(--orch-node-bg);
  border: 1px solid var(--orch-g-line);
  border-radius: var(--b-radius);
  box-shadow: var(--b-shadow-sm);
  font-size: 12px;
  color: var(--b-text);
  cursor: grab;
  animation: orch-node-in var(--mo-slow) var(--mo-out) both;
}
@media (prefers-reduced-motion: reduce) { .orch-group-card { animation: none; } }
.orch-group-card.is-sel {
  border-color: var(--b-gold);
  box-shadow: 0 0 0 2px rgb(var(--gold-500) / .3), var(--b-shadow);
}
.orch-group-card-head {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 5px 8px 5px 9px;
  border-bottom: 1px solid var(--b-line);
  border-left: 3px solid var(--orch-g-line);
  border-radius: var(--b-radius) var(--b-radius) 0 0;
  background: var(--orch-g-fill);
}
.orch-group-card-body {
  padding: 5px 9px;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.orch-group-card-sum { font-size: 11px; color: var(--b-text-2); white-space: nowrap; }
.orch-group-card-kinds { display: flex; gap: 5px; flex-wrap: wrap; margin-left: auto; }
.orch-group-kind {
  font-size: 10.5px;
  padding: 1px 6px;
  border-radius: 999px;
  border: 1px solid var(--b-line);
  color: var(--b-text-dim);
  font-family: ui-monospace, monospace;
}
.orch-group-kind[data-node-type="shot"]       { color: var(--orch-c-beat); }
.orch-group-kind[data-node-type="dynboard"]   { color: var(--orch-c-dyn); }
.orch-group-kind[data-node-type="storyboard"] { color: var(--orch-c-board); }
.orch-group-kind[data-node-type="image"]      { color: var(--orch-c-image); }
.orch-group-kind[data-node-type="video"]      { color: var(--orch-c-video); }
.orch-group-kind[data-node-type="audio"]      { color: var(--orch-c-audio); }
.orch-group-card .orch-port { background: var(--orch-g-line); }

/* 七种组色：一条描边 + 一层很淡的底。深色下底色要更淡，否则整块盖住网格 */
.orch-group, .orch-group-card { --orch-g-line: rgb(var(--gold-500)); --orch-g-fill: rgb(var(--gold-500) / .10); }
[data-group-color="blue"]   { --orch-g-line: #4a7fa8; --orch-g-fill: rgb(74 127 168 / .10); }
[data-group-color="green"]  { --orch-g-line: #3f6b58; --orch-g-fill: rgb(63 107 88 / .10); }
[data-group-color="purple"] { --orch-g-line: #7a5a9c; --orch-g-fill: rgb(122 90 156 / .10); }
[data-group-color="red"]    { --orch-g-line: #9c5a43; --orch-g-fill: rgb(156 90 67 / .10); }
[data-group-color="cyan"]   { --orch-g-line: #3c8489; --orch-g-fill: rgb(60 132 137 / .10); }
[data-group-color="gray"]   { --orch-g-line: #7b736a; --orch-g-fill: rgb(123 115 106 / .10); }
.dark .orch-group, .dark .orch-group-card { --orch-g-line: #d8ab63; --orch-g-fill: rgb(216 171 99 / .08); }
.dark [data-group-color="blue"]   { --orch-g-line: #7fb2d8; --orch-g-fill: rgb(127 178 216 / .08); }
.dark [data-group-color="green"]  { --orch-g-line: #6fae92; --orch-g-fill: rgb(111 174 146 / .08); }
.dark [data-group-color="purple"] { --orch-g-line: #b092d4; --orch-g-fill: rgb(176 146 212 / .08); }
.dark [data-group-color="red"]    { --orch-g-line: #d1917a; --orch-g-fill: rgb(209 145 122 / .08); }
.dark [data-group-color="cyan"]   { --orch-g-line: #6cc0c6; --orch-g-fill: rgb(108 192 198 / .08); }
.dark [data-group-color="gray"]   { --orch-g-line: #a8a096; --orch-g-fill: rgb(168 160 150 / .08); }

.orch-mm-group { background: var(--b-gold-soft); }

/* ── 右键菜单（规格书 §13.2）───────────────────────────────────────────
   挂 `document.body` + `position:fixed`：留在视口里会被 `overflow:hidden` 裁掉，
   还会跟着 `.orch-world` 的 transform 一起缩放（前端踩坑合集第 9 条）。
   z-index 130 高过全站最高的那层（改图编辑器 120），全屏 overlay 也压不住它。 */
.orch-ctx-layer {
  position: fixed;
  inset: 0;
  z-index: 130;
  pointer-events: none;
}
.orch-ctx {
  position: fixed;
  min-width: 196px;
  max-width: 320px;
  padding: 5px;
  background: var(--b-surface);
  border: 1px solid var(--b-line);
  border-radius: var(--b-radius);
  box-shadow: var(--b-shadow);
  pointer-events: auto;
  animation: orch-ctx-in 120ms var(--mo-out) both;
}
@keyframes orch-ctx-in {
  from { opacity: 0; transform: translateY(-6px) scale(.97); }
  to   { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) { .orch-ctx { animation: none; } }
.orch-ctx-head {
  font-size: 10.5px;
  color: var(--b-text-dim);
  padding: 3px 9px 6px;
  border-bottom: 1px solid var(--b-line);
  margin-bottom: 4px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.orch-ctx-item {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  text-align: left;
  border: 0;
  background: transparent;
  color: var(--b-text-2);
  font-size: 12px;
  padding: 5px 9px;
  border-radius: 5px;
  cursor: pointer;
}
.orch-ctx-item:hover:not([disabled]),
.orch-ctx-item:focus-visible:not([disabled]) {
  background: var(--b-surface-3);
  color: var(--b-text);
  outline: none;
}
.orch-ctx-item[disabled] { opacity: .42; cursor: not-allowed; }
.orch-ctx-item.is-danger { color: var(--b-red); }
.orch-ctx-item.is-danger:hover:not([disabled]) { background: rgb(156 77 67 / .14); }
.orch-ctx-icon { width: 15px; text-align: center; flex: 0 0 15px; }
.orch-ctx-label { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.orch-ctx-hint {
  font-size: 10.5px;
  color: var(--b-text-dim);
  font-family: ui-monospace, monospace;
  white-space: nowrap;
}
.orch-ctx-sep { height: 1px; background: var(--b-line); margin: 4px 6px; }

/* ── 「调整顺序」小窗 ─────────────────────────────────────────────── */
.orch-order-list { display: flex; flex-direction: column; gap: 4px; margin: 12px 0; }
.orch-order-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 5px 8px;
  border: 1px solid var(--b-line);
  border-radius: var(--b-radius);
  background: var(--b-surface-2);
  font-size: 12px;
}
.orch-order-no {
  flex: 0 0 20px;
  text-align: center;
  font-family: ui-monospace, monospace;
  color: var(--b-gold-deep);
}
.orch-order-label { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.orch-order-meta { font-size: 10.5px; color: var(--b-text-dim); }