deerflow-code/frontend-web/src/eightbf-roundtable/styles/step3.css

/* 8BF 第 3 步（结果绘制）独立样式入口。 */
.eightbf-roundtable .eightbf-roundtable__settings-mask {
  position: fixed;
  inset: 0;
  z-index: 90;
  display: grid;
  place-items: center;
  background: rgb(15 23 42 / 42%);
  padding: 20px;
}

.eightbf-roundtable .eightbf-roundtable__settings-dialog {
  width: min(460px, 100%);
  border-radius: 16px;
  background: #fff;
  padding: 20px;
  box-shadow: 0 24px 56px rgb(15 23 42 / 22%);
}

.eightbf-roundtable .eightbf-roundtable__settings-heading,
.eightbf-roundtable .eightbf-roundtable__settings-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.eightbf-roundtable .eightbf-roundtable__settings-kicker { color: #0f766e; font-size: 12px; font-weight: 700; }
.eightbf-roundtable .eightbf-roundtable__settings-heading h2 { margin-top: 2px; color: #0f172a; font-size: 16px; font-weight: 700; }
.eightbf-roundtable .eightbf-roundtable__settings-close { color: #64748b; }
.eightbf-roundtable .eightbf-roundtable__settings-tip { margin-top: 14px; color: #64748b; font-size: 13px; line-height: 1.6; }
.eightbf-roundtable .eightbf-roundtable__settings-field { display: grid; gap: 7px; margin-top: 16px; color: #334155; font-size: 13px; font-weight: 600; }
.eightbf-roundtable .eightbf-roundtable__settings-field select { width: 100%; border: 1px solid #cbd5e1; border-radius: 8px; padding: 9px 10px; font-weight: 500; }
.eightbf-roundtable .eightbf-roundtable__settings-error { margin-top: 10px; color: #b91c1c; font-size: 12px; }
.eightbf-roundtable .eightbf-roundtable__settings-actions { margin-top: 20px; justify-content: flex-end; }
.eightbf-roundtable .eightbf-roundtable__settings-actions button { border-radius: 8px; padding: 8px 12px; font-size: 13px; font-weight: 700; }
.eightbf-roundtable .eightbf-roundtable__settings-actions button:last-child { display: inline-flex; align-items: center; gap: 6px; background: #0f766e; color: #fff; }
.eightbf-roundtable .eightbf-roundtable__settings-actions button:disabled { cursor: not-allowed; opacity: .65; }

/* 管理员业务链配置弹窗：深色主题下与会商工作区使用同一套深蓝表面与高对比文字。 */
.dark .eightbf-roundtable .eightbf-roundtable__settings-mask {
  background: rgb(2 12 30 / 72%);
  backdrop-filter: blur(3px);
}

.dark .eightbf-roundtable .eightbf-roundtable__settings-dialog {
  border: 1px solid rgb(69 195 243 / 42%);
  background: #082b57;
  box-shadow: 0 24px 56px rgb(0 0 0 / 45%);
}

.dark .eightbf-roundtable .eightbf-roundtable__settings-kicker { color: #65d6c6; }
.dark .eightbf-roundtable .eightbf-roundtable__settings-heading h2 { color: #f1f7ff; }
.dark .eightbf-roundtable .eightbf-roundtable__settings-close { color: #a9bddb; }
.dark .eightbf-roundtable .eightbf-roundtable__settings-close:hover { color: #fff; }
.dark .eightbf-roundtable .eightbf-roundtable__settings-tip { color: #b9c9df; }
.dark .eightbf-roundtable .eightbf-roundtable__settings-field { color: #e6effc; }
.dark .eightbf-roundtable .eightbf-roundtable__settings-field select {
  border-color: rgb(143 196 255 / 48%);
  background: #0d3768;
  color: #f1f7ff;
  color-scheme: dark;
}
.dark .eightbf-roundtable .eightbf-roundtable__settings-field select:focus {
  border-color: #65d6c6;
  outline: 2px solid rgb(101 214 198 / 28%);
  outline-offset: 1px;
}
.dark .eightbf-roundtable .eightbf-roundtable__settings-field option { background: #0d3768; color: #f1f7ff; }
.dark .eightbf-roundtable .eightbf-roundtable__settings-error { color: #fca5a5; }
.dark .eightbf-roundtable .eightbf-roundtable__settings-actions button:first-child {
  color: #b9c9df;
}
.dark .eightbf-roundtable .eightbf-roundtable__settings-actions button:first-child:hover {
  background: rgb(143 196 255 / 12%);
  color: #fff;
}
.dark .eightbf-roundtable .eightbf-roundtable__settings-actions button:last-child {
  background: #167d74;
}
.dark .eightbf-roundtable .eightbf-roundtable__settings-actions button:last-child:hover {
  background: #21958a;
}

/* 第三步：8BF 左栏与第一步相同，对话区去掉原外层圆角白框，沿用第一、二步深蓝面板。 */
.dark .eightbf-roundtable[data-roundtable-step="3"] > main {
  padding: 12px 0;
}

.dark .eightbf-roundtable[data-roundtable-step="3"] > main[data-step2-sidebar-expanded="true"] {
  gap: 0;
}

.dark .eightbf-roundtable[data-roundtable-step="3"] > main[data-step2-sidebar-expanded="false"] {
  gap: 10px;
}

.dark .eightbf-roundtable[data-roundtable-step="3"] #middle-viewport {
  border-color: rgb(43 143 254 / 50%);
  border-radius: 4px;
  background: #032650;
  box-shadow: none;
}

.dark .eightbf-roundtable[data-roundtable-step="3"] #left-sidebar[data-sidebar-expanded="true"] {
  width: 374px;
  padding: 0 12px;
}

.dark .eightbf-roundtable[data-roundtable-step="3"] #left-sidebar[data-sidebar-expanded="false"] {
  width: 80px;
  padding: 0 12px;
}

.eightbf-roundtable .eightbf-roundtable-step3-chat {
  min-height: 0;
  background: #032650;
}

.eightbf-roundtable .eightbf-roundtable-step3-log {
  background: #032650;
  border: 0;
  box-shadow: none;
}

.eightbf-roundtable .eightbf-roundtable-step3-chat .position-roundtable-intent-header-actions button:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}

.eightbf-roundtable[data-roundtable-step="3"] .eightbf-roundtable-step3-log .text-slate-700,
.eightbf-roundtable[data-roundtable-step="3"] .eightbf-roundtable-step3-log .text-slate-500 {
  color: #aaceff;
}

.eightbf-roundtable[data-roundtable-step="3"] .eightbf-roundtable-step3-log .text-slate-400 {
  color: #8aa0c4;
}

/* PositionIntentInput is the shared Step 1/2 composer; Step 3 uses the exact same frame. */
.dark .eightbf-roundtable[data-roundtable-step="3"] .eightbf-roundtable-step3-input {
  flex: 0 0 auto;
}

@media (max-width: 1280px) {
  .dark .eightbf-roundtable[data-roundtable-step="3"] #left-sidebar[data-sidebar-expanded="true"] { width: 326px; }
}

@media (max-width: 1024px) {
  .dark .eightbf-roundtable[data-roundtable-step="3"] #left-sidebar[data-sidebar-expanded="true"] { width: 294px; }
}