.integration-workflow-dashboard { display: grid; gap: 14px; min-width: 0; }
.workflow-alert { margin: 0; }
.workflow-toolbar, .workflow-meta { display: flex; align-items: end; flex-wrap: wrap; gap: 10px; }
.workflow-toolbar .field, .workflow-meta .field { min-width: 150px; margin: 0; }
.workflow-toolbar .workflow-select { flex: 1 1 220px; }
.workflow-toolbar .workflow-run-trigger { flex: 1 1 170px; }
.workflow-enabled { display: inline-flex; align-items: center; gap: 7px; min-height: 38px; color: var(--text, #e8e6df); }
.workflow-enabled.is-enabled { color: #9bd3aa; }
.workflow-enabled input { width: auto; }
.workflow-meta .field { flex: 1 1 220px; }
.workflow-meta > small { flex: 0 0 100%; color: var(--muted, #aaa79f); }
.workflow-editor-shell { display: grid; grid-template-columns: minmax(150px, 190px) minmax(300px, 1fr) minmax(230px, 290px); gap: 12px; min-height: 560px; position: relative; }
.workflow-palette, .workflow-inspector { display: flex; flex-direction: column; gap: 9px; min-width: 0; padding: 13px; }
.workflow-palette strong { margin-top: 6px; }
.workflow-palette-item { width: 100%; padding: 9px 10px; border: 1px solid var(--line, #45443f); border-radius: 8px; background: var(--surface-raised, #262725); color: var(--text, #e8e6df); text-align: start; cursor: grab; overflow-wrap: anywhere; }
.workflow-palette-item:active { cursor: grabbing; }
.workflow-canvas-wrap { min-height: 560px; overflow: hidden; border: 1px solid var(--line, #45443f); border-radius: 10px; background: #171916; }
.workflow-canvas-wrap .react-flow { width: 100%; height: 100%; min-height: 560px; }
.workflow-node-card { position: relative; display: grid; gap: 5px; min-width: 150px; max-width: 220px; padding: 11px 13px; border: 1px solid #626963; border-radius: 10px; background: #252a27; color: #f1f3ed; box-shadow: 0 5px 20px #0005; }
.workflow-node-card.selected { border-color: #8bc5a3; box-shadow: 0 0 0 2px #4c9870; }
.workflow-node-trigger { border-left: 4px solid #e9ad5d; }
.workflow-node-agent { border-left: 4px solid #8aabed; }
.workflow-node-action { border-left: 4px solid #8bc5a3; }
.workflow-node-kind { color: #aeb9af; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.workflow-node-card strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.workflow-node-card small { font-size: 11px; overflow-wrap: anywhere; }
.workflow-step-status { display: inline-flex; width: fit-content; padding: 2px 7px; border-radius: 99px; background: #4b504b; color: #eee; font-size: 11px; }
.workflow-step-status.is-running { background: #245b76; }
.workflow-step-status.is-completed { background: #285d40; }
.workflow-step-status.is-failed, .workflow-node-error { background: #743a35; color: #ffe1dc; }
.workflow-step-status.is-skipped, .workflow-step-status.is-cancelled { background: #565650; }
.workflow-inspector h3 { margin: 0 0 4px; }
.workflow-inspector-fields { display: flex; flex-direction: column; gap: 9px; min-width: 0; }
.workflow-inspector .field { min-width: 0; }
.workflow-inspector input, .workflow-inspector select, .workflow-inspector textarea { max-width: 100%; }
.workflow-inspector textarea { resize: vertical; }
.workflow-agent-details { display: grid; gap: 9px; padding-top: 10px; border-top: 1px solid var(--line, #45443f); }
.workflow-agent-details summary { cursor: pointer; font-weight: 600; }
.workflow-create-agent { display: grid; gap: 9px; padding: 10px; border: 1px solid var(--line, #45443f); border-radius: 8px; }
.workflow-tool-options { display: grid; gap: 6px; max-height: 170px; overflow: auto; border: 1px solid var(--line, #45443f); border-radius: 7px; }
.workflow-tool-options label { overflow-wrap: anywhere; }
.workflow-tool-options input { width: auto; }
.workflow-action-input { display: grid; gap: 6px; padding-top: 8px; border-top: 1px solid var(--line, #45443f); }
.workflow-message { overflow-wrap: anywhere; }
.workflow-inspector-toggle { display: none; }
.workflow-loading, .workflow-empty { min-height: 120px; display: grid; place-items: center; }
.workflow-run-drawer { display: grid; grid-template-columns: minmax(200px, 280px) minmax(0, 1fr); gap: 14px; }
.workflow-drawer-heading { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: center; }
.workflow-drawer-heading h3 { margin: 0; }
.workflow-run-list { display: grid; align-content: start; gap: 6px; max-height: 360px; overflow: auto; }
.workflow-run-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 8px; padding: 9px; border: 1px solid var(--line, #45443f); border-radius: 8px; background: transparent; color: inherit; text-align: start; cursor: pointer; }
.workflow-run-item.selected { border-color: #8bc5a3; }
.workflow-run-item strong, .workflow-run-item small { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.workflow-run-item small { grid-column: 1 / -1; color: var(--muted, #aaa79f); }
.workflow-run-detail { display: grid; align-content: start; gap: 8px; min-width: 0; }
.workflow-run-detail ul { display: grid; gap: 7px; margin: 0; padding: 0; list-style: none; }
.workflow-run-detail li { display: grid; grid-template-columns: minmax(80px, 1fr) auto; gap: 5px 10px; padding: 8px; border-radius: 7px; background: #222421; overflow-wrap: anywhere; }
.workflow-run-detail li small { grid-column: 1 / -1; }
.workflow-run-detail > small { color: var(--muted, #aaa79f); }
@media (max-width: 980px) {
  .workflow-editor-shell { grid-template-columns: minmax(130px, 170px) minmax(280px, 1fr); }
  .workflow-inspector-toggle { display: block; position: absolute; right: 8px; top: 8px; z-index: 10; }
  .workflow-inspector { display: none; position: absolute; z-index: 9; right: 8px; top: 48px; width: min(320px, calc(100vw - 42px)); max-height: min(75vh, 620px); overflow: auto; box-shadow: 0 12px 36px #0009; }
  .workflow-inspector.is-open { display: flex; }
}
@media (max-width: 640px) {
  .workflow-editor-shell { grid-template-columns: minmax(0, 1fr); min-height: 0; }
  .workflow-palette { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: center; }
  .workflow-palette strong { grid-column: 1 / -1; }
  .workflow-canvas-wrap, .workflow-canvas-wrap .react-flow { min-height: 460px; }
  .workflow-run-drawer { grid-template-columns: minmax(0, 1fr); }
  .workflow-run-list { max-height: 220px; }
  .workflow-toolbar > .button { flex: 1 1 auto; }
}