#viewFlow { overflow: auto; }
#viewFlow [hidden] { display: none !important; }
.workflow-mode-tabs { display:flex; gap:24px; padding:0 24px; border-bottom:1px solid var(--olf-line); background:var(--olf-paper-raised); }
.workflow-mode-tabs > button { min-height:48px; padding:12px 4px; border:0; border-bottom:3px solid transparent; background:transparent; color:var(--olf-ink-secondary); font:600 14px var(--olf-font-sans); cursor:pointer; }
.workflow-mode-tabs > button[aria-selected="true"] { border-bottom-color:var(--olf-accent); color:var(--olf-ink); }
.workflow-mode-tabs > button:focus-visible { outline:2px solid var(--olf-accent); outline-offset:-4px; }
.workflow-toolbar-more { position:relative; }
.workflow-toolbar-more > summary { min-height:44px; padding:10px 14px; border:1px solid var(--olf-line); border-radius:var(--olf-radius-control); cursor:pointer; font-size:14px; }
.workflow-toolbar-more > button { display:block; width:100%; margin-top:6px; }
.workflow-toolbar-more[open] { padding:8px; margin:-8px; background:var(--olf-paper-raised); border:1px solid var(--olf-line); border-radius:var(--olf-radius-control); }
@media(max-width:760px){.workflow-mode-tabs{gap:16px;padding-inline:16px}.workflow-mode-tabs>button{font-size:13px;flex:1;}}
#workflowGuide.workflow-guided-setup .workflow-editor { display:flex; flex-direction:column; height:auto; min-height:0; }
#workflowGuide.workflow-guided-setup :is(.workflow-library,#guideCanvas,.workflow-canvas-caption,.workflow-canvas-footnote,#guideArrange) { display:none; }
#workflowGuide.workflow-guided-setup .workflow-stage { height:auto; min-height:0; }
#workflowGuide.workflow-guided-setup .workflow-step-navigator { position:static; display:flex; flex-wrap:wrap; padding:16px 24px; margin:0; }
#workflowGuide.workflow-guided-setup .workflow-step-navigator button { min-height:44px; font-size:14px; }
#workflowGuide.workflow-guided-setup .workflow-settings { width:100%; max-width:760px; padding:24px; border:0; overflow:visible; }
#workflowGuide.workflow-guided-setup .workflow-build-bar { display:none; }
.workflow-guide { width: 100%; color: var(--olf-ink); font-size: 15px; line-height: 1.5; --olf-ink-muted: var(--olf-ink-secondary); }
.workflow-guide p { line-height: 1.55; }
.workflow-topbar { min-height: 84px; padding: 18px 24px; display: flex; justify-content: space-between; align-items: center; gap: 20px; border-bottom: 1px solid var(--olf-line); background: var(--olf-paper-raised); }
.workflow-eyebrow { display: flex; gap: 12px; color: var(--olf-ink-muted); font: 12px var(--olf-font-mono); letter-spacing: .07em; }
.workflow-topbar h2 { font-size: 19px; font-weight: 600; margin: 7px 0 0; letter-spacing: -.02em; }
.workflow-draft { display: inline-block; vertical-align: middle; font-size: 12px; font-weight: 400; letter-spacing: 0; color: var(--olf-ink-muted); border: 1px solid var(--olf-line); padding: 3px 7px; border-radius: 4px; margin-left: 8px; }
.workflow-top-actions { display: flex; align-items: center; gap: 10px; }
.workflow-top-actions select { max-width: 200px; font-size: 14px; }
.workflow-document-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding: 10px 24px; border-bottom: 1px solid var(--olf-line); }
.workflow-document-bar > span { color: var(--olf-ink-muted); font-size: 12px; }
.workflow-document-bar .btn { font-size: 13px; }
.workflow-open-file { position: relative; overflow: hidden; cursor: pointer; }
.workflow-open-file input { position: absolute; inset: 0; opacity: 0; width: 100%; cursor: pointer; }
.workflow-open-file:focus-within { outline: 2px solid var(--olf-accent); outline-offset: 2px; }
.workflow-about { padding: 10px 24px; border-bottom: 1px solid var(--olf-line); background: var(--olf-paper-raised); }
.workflow-about summary, .workflow-step-notes summary { cursor: pointer; font-size: 14px; color: var(--olf-ink-secondary); }
.workflow-about-fields { display: grid; grid-template-columns: 1fr 2fr; gap: 20px; margin-top: 16px; }
.workflow-about label, .workflow-step-notes label { display: flex; flex-direction: column; gap: 6px; font-size: 14px; }
.workflow-about input, .workflow-about textarea, .workflow-step-notes input, .workflow-step-notes textarea { padding: 8px; color: var(--olf-ink); background: var(--olf-paper); border: 1px solid var(--olf-line); border-radius: 4px; font: inherit; width: 100%; resize: vertical; }
.workflow-about p { margin-top: 10px; color: var(--olf-ink-muted); font-size: 13px; }
.workflow-step-notes { border-top: 1px solid var(--olf-line); margin-top: 18px; padding-top: 14px; }
.workflow-step-notes label { margin-top: 14px; }
.workflow-node-note { font-size: 12px; color: var(--olf-ink-secondary); border-left: 2px solid var(--olf-accent); padding-left: 7px; margin-bottom: 12px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; white-space: pre-wrap; }
.workflow-editor { display: grid; grid-template-columns: 206px minmax(0,1fr) 300px; min-height: 480px; height: min(62vh,700px); }
.workflow-library, .workflow-settings { background: var(--olf-paper-raised); min-width: 0; overflow: auto; }
.workflow-library { border-right: 1px solid var(--olf-line); display: flex; flex-direction: column; padding: 16px 12px; }
.workflow-panel-title { line-height: 1.4; display: flex; align-items: center; justify-content: space-between; font-size: 15px; font-weight: 600; margin-bottom: 12px; }
.workflow-panel-title > span:last-child:not(:first-child) { font: 12px var(--olf-font-mono); color: var(--olf-ink-muted); font-weight: 400; }
.workflow-library input { width: 100%; padding: 9px 10px; background: var(--olf-paper); border: 1px solid var(--olf-line); border-radius: 6px; color: var(--olf-ink); font: inherit; }
.workflow-section-label { margin: 24px 0 10px; font: 11px var(--olf-font-mono); color: var(--olf-ink-muted); letter-spacing: .1em; }
.workflow-tool { display: flex; align-items: center; gap: 10px; width: 100%; text-align: left; padding: 12px 6px; border: 0; border-radius: 6px; background: transparent; color: var(--olf-ink); cursor: pointer; }
.workflow-tool:hover, .workflow-tool[aria-pressed="true"] { background: var(--olf-accent-soft); }
.workflow-tool strong { display: block; font-size: 14px; font-weight: 500; }
.workflow-tool small { display: block; font-size: 12px; color: var(--olf-ink-muted); margin-top: 5px; }
.tool-glyph, .workflow-node-symbol { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 6px; background: var(--olf-paper-muted); color: var(--olf-accent); font-size: 21px; }
.workflow-library-footer { margin-top: auto; padding-top: 32px; }
.workflow-library-footer p { color: var(--olf-ink-muted); font-size: 13px; margin-bottom: 12px; }
.workflow-library-footer button { font-size: 13px; }
.workflow-stage { position: relative; min-width: 0; background: var(--olf-paper); }
#guideCanvas { width: 100%; height: 100%; min-height: 380px; }
.workflow-canvas-caption { position: absolute; z-index: 4; top: 18px; left: 20px; right: 20px; display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--olf-ink-secondary); pointer-events: none; }
.workflow-canvas-hint { margin-left: auto; font-size: 12px; color: var(--olf-ink-muted); }
.workflow-canvas-footnote { position: absolute; bottom: 16px; left: 65px; right: 170px; z-index: 4; font-size: 12px; color: var(--olf-ink-muted); pointer-events: none; }
.workflow-status-dot { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--olf-accent); flex-shrink: 0; }
.workflow-settings { padding: 18px; border-left: 1px solid var(--olf-line); }
.workflow-settings-body > p { color: var(--olf-ink-secondary); font-size: 14px; margin: 0 0 20px; }
.workflow-settings-body > label:not(.guide-confirm) { display: block; margin: 18px 0 7px; font-weight: 500; font-size: 14px; }
.workflow-settings-body > label > span { color: var(--olf-ink-muted); font-size: 13px; font-weight: 400; }
.workflow-settings-body select { width: 100%; font-size: 14px; }
.workflow-settings-body .workflow-setting-hint { font-size: 13px; color: var(--olf-ink-muted); margin-top: 12px; }
.guide-confirm { display: flex; gap: 8px; align-items: start; line-height: 1.5; margin-top: 20px; }
.guide-confirm input { margin-top: 3px; flex-shrink: 0; }
.workflow-ai-box { border-top: 1px solid var(--olf-line); padding-top: 20px; margin-top: 20px; }
.workflow-ai-box button { width: 100%; justify-content: center; font-size: 14px; }
.workflow-ai-box p { font-size: 12px; color: var(--olf-ink-muted); margin-top: 10px; }
.guide-proposal { padding: 10px; background: var(--olf-accent-soft); margin-top: 10px; border-radius: 6px; }
.guide-proposal p { margin: 0 0 12px; color: var(--olf-ink); }
.workflow-result-limit { padding: 10px 0; margin-bottom: 12px; display: flex; align-items: center; justify-content: space-between; gap: 16px; border-bottom: 1px solid var(--olf-line); }
.workflow-result-limit strong { font-size: 14px; font-weight: 600; white-space: nowrap; }
.workflow-result-limit span { color: var(--olf-ink-secondary); font-size: 14px; }
.workflow-preview-details summary { cursor: pointer; font-size: 14px; color: var(--olf-ink-secondary); }
.workflow-preview-details p { font-size: 14px; color: var(--olf-ink-secondary); margin: 12px 0 0; }
.workflow-inspection { border-top: 1px solid var(--olf-line); background: var(--olf-paper-raised); }
.workflow-settings-disclosure > summary, .workflow-dock-summary { cursor: pointer; list-style: none; display: flex; align-items: center; gap: 12px; }
.workflow-settings-disclosure > summary::-webkit-details-marker, .workflow-dock-summary::-webkit-details-marker { display: none; }
.workflow-settings-disclosure > summary::before, .workflow-dock-summary::before { content: '›'; font-size: 20px; line-height: 1; color: var(--olf-ink-secondary); transform: rotate(0); transition: transform .15s; }
.workflow-settings-disclosure[open] > summary::before, .workflow-inspection-disclosure[open] > summary::before { transform: rotate(90deg); }
.workflow-settings-disclosure > summary { margin: 0; }
.workflow-settings-disclosure > summary > span:first-of-type { flex: 1; }
.workflow-settings-disclosure[open] > summary { margin-bottom: 18px; }
.workflow-dock-summary { min-height: 54px; padding: 12px 20px; font-size: 14px; font-weight: 600; }
.workflow-dock-summary > span:first-of-type { flex: 1; }
.workflow-dock-summary #guideSummary { font-weight: 400; text-align: right; }
.workflow-inspection-disclosure[open] > summary { border-bottom: 1px solid var(--olf-line); }
.workflow-inspection-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 20px; border-bottom: 1px solid var(--olf-line); min-height: 52px; flex-wrap: wrap; }
.workflow-inspection-bar [role="tablist"] { display: flex; align-self: stretch; gap: 24px; min-height: 50px; }
.workflow-inspection-bar button { border: 0; border-bottom: 2px solid transparent; background: transparent; color: var(--olf-ink-muted); font: 14px var(--olf-font-sans); cursor: pointer; }
.workflow-inspection-bar button[aria-selected="true"] { border-bottom-color: var(--olf-accent); color: var(--olf-ink); font-weight: 600; }
#guideSummary { color: var(--olf-ink-muted); font-size: 13px; }
#guideMessage { margin: 0; padding: 14px 20px 0; color: var(--olf-ink-secondary); font-size: 14px; line-height: 1.6; }
#guideMessage[role="alert"] { color: var(--olf-danger); }
.workflow-empty { display: flex; justify-content: center; align-items: center; gap: 14px; padding: 30px; color: var(--olf-ink-muted); }
.workflow-empty strong { font-size: 15px; color: var(--olf-ink-secondary); font-weight: 500; }
.workflow-empty p { margin-top: 5px; font-size: 14px; }
.workflow-empty-icon { font-size: 32px; }
#guideMap { height: 300px; margin: 16px 20px; border-radius: 6px; }
.guide-table-scroll { overflow: auto; max-height: 360px; margin: 12px 20px 20px; border: 1px solid var(--olf-line); border-radius: 8px; }
.workflow-row-filter { display: flex; align-items: center; gap: 12px; padding: 16px 20px 0; font-size: 14px; flex-wrap: wrap; }
.workflow-row-filter select { font-size: 14px; width: auto; min-width: 180px; min-height: 40px; }
.workflow-row-filter > span { color: var(--olf-ink-secondary); margin-left: auto; font-variant-numeric: tabular-nums; }
.workflow-guide table { width: 100%; min-width: 600px; table-layout: fixed; border-collapse: collapse; text-align: left; font-size: 14px; line-height: 1.55; }
.workflow-guide th { font-weight: 600; color: var(--olf-ink); font-size: 13px; text-transform: none; letter-spacing: 0; white-space: nowrap; background: var(--olf-paper-muted); position: sticky; top: 0; }
.workflow-guide th, .workflow-guide td { padding: 12px 14px; border-bottom: 1px solid var(--olf-line); vertical-align: top; }
.workflow-guide td { overflow-wrap: break-word; color: var(--olf-ink); }
.workflow-guide td:nth-child(2), .workflow-guide td:nth-child(3) { white-space: nowrap; font-variant-numeric: tabular-nums; }
.workflow-guide tbody tr:last-child td { border-bottom: 0; }
.workflow-guide tbody tr:hover { background: var(--olf-accent-soft); }
#guideLog { list-style: none; padding: 16px 20px; font: 13px var(--olf-font-mono); max-height: 250px; overflow: auto; }
#guideLog li { padding: 7px 0; color: var(--olf-ink-secondary); }
#guideBack { margin: 12px; }
.workflow-guide button:disabled { opacity: .5; cursor: not-allowed; }
.workflow-guide :focus-visible { outline: 2px solid var(--olf-accent); outline-offset: 3px; }
.workflow-node { position: relative; width: 220px; padding: 10px 12px 6px; border: 1px solid var(--olf-line-strong); border-radius: 8px; background: var(--olf-paper-raised); box-shadow: 0 2px 8px #0000000d; color: var(--olf-ink); }
.workflow-node.is-selected { border-color: var(--olf-accent); box-shadow: 0 0 0 2px var(--olf-accent-soft), 0 8px 24px #00000012; }
.workflow-node-head { display: flex; gap: 8px; align-items: flex-start; }
.workflow-node .workflow-node-head .workflow-node-symbol { flex: none; width: 22px; height: 22px; border-radius: 5px; font-size: 12px; }
.workflow-node-head > strong { font-weight: 600; font-size: 14px; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; }
.workflow-node-detail { font-size: 12px; color: var(--olf-ink-muted); margin: 4px 0 0 30px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.workflow-node-ports { display: flex; flex-direction: column; gap: 2px; margin: 6px 0 2px; }
.workflow-node-ports button { width: 100%; text-align: left; border: 1px solid var(--olf-line); background: var(--olf-paper); color: var(--olf-ink); border-radius: 4px; font: 12px var(--olf-font-sans); padding: 2px 8px; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* Each port row reaches the node's edge so its dot sits beside its own label. */
.workflow-node-port-row { position: relative; display: flex; align-items: center; margin: 0 -12px; padding: 0 12px; min-height: 24px; }
.workflow-node-inputs { display: flex; flex-direction: column; gap: 0; margin: 6px 0 0; }
.workflow-node-input-label { font: 12px var(--olf-font-sans); color: var(--olf-ink-muted); }
.workflow-node-input-label::before { content: "\2192\00a0"; }
.workflow-node-ports button:hover { background: var(--olf-accent-soft); }
.workflow-node-ports .workflow-port-rejected { border-left: 3px solid var(--olf-signal-orange); }
.workflow-inspect-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.workflow-step-navigator { position: absolute; bottom: 16px; left: 16px; right: 16px; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; z-index: 5; }
.workflow-step-navigator button { padding: 7px 9px; border: 1px solid var(--olf-line); border-radius: 5px; background: var(--olf-paper-raised); color: var(--olf-ink); font: 12px var(--olf-font-sans); cursor: pointer; }
.workflow-step-navigator button:last-child { margin-left: auto; }
.workflow-canvas-footnote { top: 48px; bottom: auto; left: 20px; }
.workflow-data-change { margin: 10px 20px; color: var(--olf-ink-secondary); font-size: 14px; }
.workflow-record-choice { display: flex; align-items: center; gap: 12px; padding: 12px 20px; }
.workflow-record-choice select { width: auto; max-width: 100%; }
.workflow-record-tree { margin: 0 20px 20px; padding: 16px; overflow: auto; max-height: 360px; background: var(--olf-paper); border: 1px solid var(--olf-line); border-radius: 6px; font: 13px/1.6 var(--olf-font-mono); white-space: pre-wrap; overflow-wrap: anywhere; }
#guideDataTable { table-layout: auto; }
#guideDataTable td { min-width: 140px; white-space: normal; }
.workflow-guide #guideSchemaPanel td { white-space: normal; }
.workflow-inspection-bar [role="tablist"] { flex-wrap: wrap; gap: 18px; }
.workflow-node-status { margin: 4px 0 0; font-size: 11px; display: flex; gap: 6px; align-items: center; color: var(--olf-ink-muted); }
/* Overview: zoomed far out, each step is its name in type large enough to read; ports keep their places. */
.wf-far .workflow-node > :not(.workflow-node-head) { visibility: hidden; }
.wf-far .workflow-node-head { position: absolute; inset: 0; z-index: 1; padding: 8px 10px; align-items: center; justify-content: center; text-align: center; background: var(--olf-paper-raised); border-radius: 8px; }
.wf-far .workflow-node-head .workflow-node-symbol { display: none; }
.wf-far .workflow-node-head > strong { font-size: min(calc(11px / var(--wf-zoom, 1)), 30px); -webkit-line-clamp: 3; }
/* Review steps stay as small outlined boxes in the overview, so the main flow's names stand out. */
.workflow-node.is-review { border-style: dashed; }
.wf-far .workflow-node.is-review .workflow-node-head > strong { visibility: hidden; }
.workflow-canvas-frame { width: 100%; height: 100%; }
.workflow-node-status.complete { color: var(--olf-success); }
.workflow-node-status.complete .workflow-status-dot { background: var(--olf-success); }
.workflow-feature-workspace .workflow-editor { height:650px; grid-template-columns:190px minmax(0,1fr) 330px; }
.workflow-feature-workspace .workflow-library,.workflow-feature-workspace .workflow-settings { overflow:auto; padding:16px; }
.workflow-feature-workspace .workflow-library button { display:block; width:100%; margin:8px 0; text-align:left; }
.workflow-feature-workspace .workflow-settings > label { display:block; margin:14px 0; font-size:13px; }
.workflow-feature-workspace input:not([type=checkbox]),.workflow-feature-workspace select,.workflow-feature-workspace textarea { display:block; width:100%; padding:8px; border:1px solid var(--olf-line); border-radius:5px; background:var(--olf-paper); color:var(--olf-ink); }
.workflow-feature-workspace .workflow-settings button { margin:6px 0; }
.workflow-feature-workspace .workflow-inspection { padding:18px; }
.workflow-feature-workspace .workflow-inspection td { max-width:360px; overflow:hidden; text-overflow:ellipsis; }
.workflow-feature-workspace pre { white-space:pre-wrap; overflow-wrap:anywhere; max-height:400px; overflow:auto; }
.workflow-feature-workspace > details { padding:16px; border:1px solid var(--olf-line); margin:12px 0; }
@media(max-width:1000px){.workflow-feature-workspace .workflow-editor {grid-template-columns:170px minmax(0,1fr); height:auto;} .workflow-feature-workspace .workflow-settings {grid-column:1/-1; max-height:600px;}}
.workflow-node .react-flow__handle { width: 10px; height: 10px; border: 2px solid var(--olf-paper-raised); background: var(--olf-accent); }
.workflow-node .react-flow__handle:hover { box-shadow: 0 0 0 4px var(--olf-accent-soft); }
.workflow-stage .react-flow { --xy-controls-button-background-color: var(--olf-paper-raised); --xy-controls-button-background-color-hover: var(--olf-accent-soft); --xy-controls-button-color: var(--olf-ink); --xy-controls-button-border-color: var(--olf-line); --xy-background-color: var(--olf-paper); }
.workflow-stage .react-flow__controls { box-shadow: none; border: 1px solid var(--olf-line); border-radius: 6px; overflow: hidden; }
.workflow-stage .react-flow__attribution { font-size: 8px; background: var(--olf-paper-raised); }
.workflow-stage .react-flow__attribution a { color: var(--olf-ink-muted); }
@media (max-width: 1150px) {
  .workflow-editor { grid-template-columns: 190px minmax(0,1fr); height: auto; }
  .workflow-library { grid-column: 1; grid-row: 1; }
  .workflow-stage { grid-column: 2; grid-row: 1; height: 460px; }
  .workflow-settings { grid-column: 1 / -1; border-left: 0; border-top: 1px solid var(--olf-line); overflow: visible; }
  .workflow-settings-body { max-width: 720px; }
  .workflow-canvas-hint { display: none; }
  .workflow-library-footer { padding-top: 16px; }
  .workflow-library-footer p:last-child { display: none; }
}
@media (max-width: 850px) {
  .workflow-about-fields { grid-template-columns: 1fr; }
  .workflow-topbar { padding: 16px; flex-wrap: wrap; gap: 14px; } .workflow-top-actions { width: 100%; justify-content: space-between; }
  .workflow-editor { grid-template-columns: 176px minmax(0,1fr); }
  .workflow-stage { height: 430px; }
  .workflow-library { padding: 16px 10px; }
  .workflow-library .workflow-panel-title { flex-wrap: wrap; gap: 4px; }
  .workflow-tool { gap: 8px; padding: 12px 0; }
  .workflow-tool .tool-glyph { width: 24px; min-width: 24px; height: 28px; font-size: 19px; }
  .workflow-tool strong { font-size: 13px; }
  .workflow-tool small { font-size: 12px; }
  .workflow-settings { border-left: 0; border-top: 1px solid var(--olf-line); overflow: visible; }
  .workflow-settings-body { max-width: 720px; } .workflow-settings-body > p { margin-bottom: 12px; }
  .workflow-inspection-bar { align-items: start; flex-direction: column; padding: 0 18px 12px; gap: 2px; } .workflow-inspection-bar button { padding: 12px 0; }
  .workflow-canvas-footnote { top: 48px; bottom: auto; left: 16px; right: 16px; font-size: 12px; } .workflow-draft { font-size: 12px; }
}

@media (max-width: 480px) {
  .workflow-editor { grid-template-columns: minmax(0,1fr); }
  .workflow-library { grid-column: 1; grid-row: 1; max-height: 220px; border-right: 0; border-bottom: 1px solid var(--olf-line); }
  .workflow-stage { grid-column: 1; grid-row: 2; }
  .workflow-step-navigator { bottom: 12px; }
  .workflow-canvas-footnote { display: none; }
  .workflow-tool .tool-glyph { display: none; }
  .workflow-library-footer { display: none; }
  .workflow-row-filter { gap: 8px; }
  .workflow-row-filter > span { margin-left: 0; flex-basis: 100%; }
  .workflow-top-actions { flex-wrap: wrap; gap: 12px; }
}

/* Discover, compose and get assistance without covering the canvas. */
#guideLibraryCategory { width: 100%; margin-top: 10px; font-size: 13px; }
.workflow-tool-state { color: var(--olf-accent) !important; font-size: 11px !important; }
.workflow-remove-step { margin-top: 18px; }
.workflow-build-bar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 10px 18px; border-top: 1px solid var(--olf-line); background: var(--olf-paper-raised); }
.workflow-build-bar .btn { font-size: 12px; }
.workflow-auto-toggle { display: flex; gap: 8px; align-items: center; margin-right: auto; font-size: 13px; }
.workflow-next-step { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding: 14px 18px; border-top: 1px solid var(--olf-line); background: var(--olf-paper-raised); }
.workflow-next-step > div { flex: 1 1 240px; }
.workflow-assist-label { font: 11px var(--olf-font-mono); letter-spacing: .04em; color: var(--olf-accent); }
.workflow-next-step p { margin: 4px 0 0; font-size: 14px; }
.workflow-next-step .workflow-assist-note { flex-basis: 100%; margin: 0; font-size: 12px; color: var(--olf-ink-secondary); }
@media(max-width:1150px) { .workflow-library { max-height: 460px; } }
@media(max-width:850px) { .workflow-library { max-height: 430px; } }

.workflow-stage .react-flow__minimap, .workflow-stage .react-flow__controls { bottom: 62px; }
.workflow-record-tree { font: 14px/1.6 var(--olf-font-sans); white-space: normal; }
.workflow-record-identity { color: var(--olf-ink-secondary); font-size: 12px; overflow-wrap: anywhere; margin: 0 0 12px; }
.workflow-record-field { display: grid; grid-template-columns: minmax(120px,1fr) auto; gap: 4px 12px; padding: 10px 0; border-top: 1px solid var(--olf-line); }
.workflow-record-field > small { color: var(--olf-ink-secondary); }
.workflow-record-field > span, .workflow-record-field > details { grid-column: 1 / -1; white-space: pre-wrap; overflow-wrap: anywhere; }
.workflow-record-field details { padding-left: 12px; }
.workflow-record-field summary { cursor: pointer; }
@media(max-width:480px) { .workflow-library { max-height: 220px; } .workflow-record-choice { flex-wrap: wrap; } }

@media(max-width:480px) {
  .workflow-dock-summary { flex-wrap: wrap; gap: 6px; }
  .workflow-dock-summary #guideInspectionTitle { flex: 1 1 calc(100% - 34px); }
  .workflow-dock-summary #guideSummary { flex-basis: 100%; text-align: left; padding-left: 22px; }
  .workflow-inspection-bar [role="tablist"] { gap: 8px 18px; }
  .workflow-inspection-bar button { padding: 8px 0; }
}

@media(min-width:1151px) {
  .workflow-guide:not(#preparationGuide) .workflow-editor:has(.workflow-settings-disclosure:not([open])) { grid-template-columns: 206px minmax(0,1fr); height: auto; }
  .workflow-guide:not(#preparationGuide) .workflow-editor:has(.workflow-settings-disclosure:not([open])) .workflow-stage { height: clamp(380px,48vh,560px); }
  .workflow-guide:not(#preparationGuide) .workflow-editor:has(.workflow-settings-disclosure:not([open])) .workflow-library { max-height: clamp(380px,48vh,560px); }
  .workflow-guide:not(#preparationGuide) .workflow-settings:has(.workflow-settings-disclosure:not([open])) { grid-column: 1 / -1; border-left: 0; border-top: 1px solid var(--olf-line); overflow: visible; }
}

#preparationGuide .workflow-step-navigator { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 4px; }
#preparationGuide .workflow-step-navigator button { flex-shrink: 0; }
#prepFields label { display: flex; flex-direction: column; gap: 7px; margin: 14px 0; font-size: 14px; }
#prepMessage { margin: 14px 20px; font-size: 14px; }
#prepMessage[role="alert"] { color: var(--olf-danger); }
#prepTable { table-layout: auto; }
#prepTable td { min-width: 140px; white-space: normal; }
#prepSchemaPanel td { white-space: normal; }
#prepActivity { padding: 16px 30px; max-height: 280px; overflow: auto; font-size: 13px; }
#prepActivity li { padding: 7px 0; }
.workflow-top-actions { flex-wrap: wrap; }
.workflow-library input[type="checkbox"] { width: auto; flex-shrink: 0; padding: 0; }
@media(max-width:480px) { #prepInspectionTitle { flex: 1 1 calc(100% - 34px); } #prepSummary { flex-basis: 100%; text-align: left; padding-left: 22px; } }

#prepTable td:first-child { min-width: 90px; white-space: nowrap; }
.workflow-record-link { border: 0; padding: 0; background: transparent; color: var(--olf-accent); text-decoration: underline; cursor: pointer; font: inherit; }
#prepMap { height: 320px; min-width: 0; }
#prepFields .guide-confirm { flex-direction: row; align-items: flex-start; }
#prepFields .guide-confirm input { width: auto; flex-shrink: 0; margin-top: 3px; }
.workflow-database-picker { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.workflow-database-picker select { max-width: 180px; }
.workflow-storage-status { padding: 9px 18px; color: var(--olf-ink-secondary); font-size: 12px; line-height: 1.5; border-bottom: 1px solid var(--olf-line); overflow-wrap: anywhere; }
.workflow-saved-panel { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; padding: 14px 18px; background: var(--olf-paper-raised); border-bottom: 1px solid var(--olf-line); }
.workflow-saved-panel[hidden] { display: none; }
.workflow-saved-panel label { display: flex; flex: 1 1 200px; min-width: 0; flex-direction: column; gap: 7px; font-size: 13px; }
.workflow-saved-panel select { width: 100%; min-width: 0; }
.workflow-saved-panel > span { flex-basis: 100%; color: var(--olf-ink-secondary); font-size: 12px; }

/* Caption and step navigation occupy their own rows so React Flow measures
   the drawing area without either overlay covering fitted nodes. */
#preparationGuide .workflow-stage { display: grid; grid-template-rows: auto minmax(0,1fr) auto; }
#preparationGuide .workflow-canvas-caption { position: static; margin: 12px 16px; }
#prepCanvas { min-height: 0; min-width: 0; }
#preparationGuide .workflow-step-navigator { position: static; padding: 10px 16px; border-top: 1px solid var(--olf-line); }
#preparationGuide .workflow-stage .react-flow__minimap,
#preparationGuide .workflow-stage .react-flow__controls { bottom: 12px; }

.workflow-calculation-value { min-width: 0; margin: 16px 0; padding: 4px 12px 12px; border: 1px solid var(--olf-line); border-radius: 6px; }
.workflow-calculation-value legend { padding: 0 6px; font-size: 14px; font-weight: 600; color: var(--olf-ink); }
#prepFields .workflow-calculation-value label { margin: 10px 0 0; }

.workflow-node-detail.workflow-calculation-detail { white-space: normal; overflow-wrap: anywhere; text-overflow: clip; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; line-height: 1.5; }

.workflow-field-choice { min-width: 0; max-height: 280px; overflow: auto; padding: 8px 12px; margin: 16px 0; border: 1px solid var(--olf-line); border-radius: 6px; }
.workflow-field-choice legend { padding: 0 6px; font-size: 14px; font-weight: 600; }
#prepFields .workflow-field-check { flex-direction: row; align-items: flex-start; overflow-wrap: anywhere; }
#prepFields .workflow-field-check input { flex: 0 0 auto; width: auto; margin-top: 4px; }
.workflow-filter-rule > button { margin-top: 12px; }

.workflow-import-source { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--olf-line); }
.workflow-import-source > button { width: 100%; }
.workflow-import-source > p { margin-bottom: 0; }

.workflow-source-choices { display: grid; gap: 8px; margin: 16px 0 8px; }
.workflow-source-choices button { white-space: normal; text-align: left; padding: 8px 10px; }
.workflow-source-summary { margin: 16px 0; padding: 10px 12px; border: 1px solid var(--olf-line); border-radius: 6px; font-size: 14px; line-height: 1.6; }
.workflow-source-fields { margin: 12px 0 16px; border-top: 1px solid var(--olf-line); }
.workflow-source-fields > summary { padding: 12px 0; font-size: 14px; font-weight: 600; cursor: pointer; }
.workflow-source-fields input[type="search"] { box-sizing: border-box; width: 100%; min-width: 0; padding: 10px 12px; font: 14px var(--olf-font-sans); background: var(--olf-paper-raised); color: var(--olf-ink); border: 1px solid var(--olf-line); border-radius: 6px; }
.workflow-source-field-list { max-height: 260px; overflow: auto; }
.workflow-source-field { padding: 9px 0; border-bottom: 1px solid var(--olf-line); overflow-wrap: anywhere; }
.workflow-source-field strong, .workflow-source-field small { display: block; }
.workflow-source-field strong { font-size: 14px; }
.workflow-source-field small { margin-top: 3px; color: var(--olf-ink-muted); font-size: 12px; line-height: 1.5; }

.workflow-reading-evidence { margin: 12px 0; padding: 10px 12px; border: 1px solid var(--olf-line); border-radius: 6px; }
.workflow-reading-evidence > summary { color: var(--olf-ink); font-size: 14px; font-weight: 600; cursor: pointer; }
.workflow-reading-evidence > p, .workflow-reading-evidence li { color: var(--olf-ink-muted); font-size: 13px; line-height: 1.6; overflow-wrap: anywhere; }
.workflow-reading-evidence > p:last-child { margin-bottom: 0; }
.workflow-reading-evidence ul { max-height: 200px; overflow: auto; padding-left: 20px; }

.workflow-preview-limits { margin: 0 0 12px; font-size: 13px; }
.workflow-preview-limits > summary { color: var(--olf-ink-muted); cursor: pointer; }
.workflow-preview-limits > p { max-width: 85ch; line-height: 1.6; color: var(--olf-ink-muted); overflow-wrap: anywhere; }

[id^="prepRecordMembership"] input[type="search"] { width:100%; min-width:0; box-sizing:border-box; margin:10px 0; padding:10px 12px; font-size:14px; background:var(--olf-paper-raised); color:var(--olf-ink); border:1px solid var(--olf-line); border-radius:6px; }
[id^="prepRecordMembership"] > div { display:flex; flex-wrap:wrap; gap:6px; margin:8px 0; }

.workflow-connection-manager { margin:12px 0 18px; padding:14px; border:1px solid var(--olf-line); border-radius:6px; background:var(--olf-paper-raised); min-width:0; }
.workflow-connection-manager label { display:grid; gap:6px; margin:10px 0; font-size:14px; }
.workflow-connection-manager input, .workflow-connection-manager textarea, .workflow-connection-manager select { width:100%; min-width:0; max-width:100%; box-sizing:border-box; font:inherit; padding:10px 12px; background:var(--olf-paper); color:var(--olf-ink); border:1px solid var(--olf-line); border-radius:6px; }
.workflow-connection-manager textarea { resize:vertical; }
.workflow-connection-manager p { font-size:13px; line-height:1.6; overflow-wrap:anywhere; }
.workflow-connection-manager > button, .workflow-connection-actions button, #prepConnectionRevokeConfirm button { margin:5px 5px 5px 0; }
.workflow-connection-manager details { margin:12px 0; }
.workflow-connection-manager summary { cursor:pointer; font-size:14px; }

.workflow-files-manager { min-width:0; padding:0 0 12px; }
.workflow-files-manager label { display:grid; gap:6px; margin:12px 0; font-size:14px; }
.workflow-files-manager input { box-sizing:border-box; width:100%; min-width:0; max-width:100%; padding:10px 12px; font:inherit; color:var(--olf-ink); background:var(--olf-paper-raised); border:1px solid var(--olf-line); border-radius:6px; }
.workflow-files-manager p { font-size:13px; line-height:1.6; overflow-wrap:anywhere; }
.workflow-files-manager button { margin:5px 5px 5px 0; }
#prepWorkbookList { max-height:360px; overflow:auto; margin-top:12px; }
.workflow-file-entry { border-top:1px solid var(--olf-line); padding:12px 0; overflow-wrap:anywhere; }
.workflow-file-entry strong { font-size:14px; }

.workflow-result-disclosure { margin:12px 0; padding:10px 12px; border:1px solid var(--olf-line); border-radius:6px; }
.workflow-result-disclosure > summary { cursor:pointer; font-size:14px; font-weight:600; }
.workflow-result-saver label { display:grid; gap:6px; margin:12px 0; max-width:480px; font-size:14px; }
.workflow-result-saver input { width:100%; min-width:0; box-sizing:border-box; padding:10px 12px; font:inherit; background:var(--olf-paper-raised); color:var(--olf-ink); border:1px solid var(--olf-line); border-radius:6px; }
.workflow-result-saver p { max-width:85ch; font-size:13px; line-height:1.6; overflow-wrap:anywhere; }
.workflow-result-saver button { margin:5px 5px 5px 0; }

.workflow-workbook-review { min-width:0; }
.workflow-workbook-review label { display:grid; gap:6px; margin:14px 0; font-size:14px; }
.workflow-workbook-review input, .workflow-workbook-review select { width:100%; min-width:0; box-sizing:border-box; padding:10px 12px; font:inherit; background:var(--olf-paper-raised); color:var(--olf-ink); border:1px solid var(--olf-line); border-radius:6px; }
.workflow-workbook-review p { font-size:13px; line-height:1.6; overflow-wrap:anywhere; }
.workflow-workbook-review .guide-table-scroll { margin:12px 0; }
.workflow-workbook-review table { width:auto; min-width:100%; table-layout:auto; }
.workflow-workbook-review th, .workflow-workbook-review td { padding:10px; white-space:normal; }
.workflow-workbook-review th:first-child { min-width:44px; }
.workflow-workbook-review td { min-width:100px; }
.workflow-workbook-review td span, .workflow-workbook-review td small { display:block; white-space:normal; overflow-wrap:anywhere; }
.workflow-workbook-review td small { margin-top:4px; color:var(--olf-ink-secondary); font-size:12px; }

.workflow-run-history { max-height: 280px; overflow: auto; margin-top: 14px; }

/* Named account connections remain collapsed beside the tool library. */
.workflow-microsoft-connections{border-top:1px solid var(--olf-line,#5b5448);margin-top:12px;padding-top:10px;font-size:13px}
.workflow-microsoft-connections>summary{cursor:pointer;font-weight:600;padding:5px 0;color:var(--olf-ink,#f6f1e7)}
.workflow-microsoft-body{display:grid;gap:9px;padding:8px 0}.workflow-microsoft-body p{margin:0;line-height:1.5}
.workflow-microsoft-body label{display:grid;gap:5px}.workflow-microsoft-body input{box-sizing:border-box;min-width:0;width:100%;padding:8px;border:1px solid var(--olf-line,#5b5448);border-radius:5px;background:var(--olf-paper,#29261f);color:inherit;font:inherit}
.workflow-microsoft-body ul{list-style:none;padding:0;margin:0;display:grid;gap:8px}.workflow-microsoft-body li{display:grid;gap:5px;padding:8px;border:1px solid var(--olf-line,#5b5448);border-radius:5px;overflow-wrap:anywhere}.workflow-microsoft-body li span{color:var(--olf-ink-muted,#ccc3b2);font-size:12px}.workflow-microsoft-body .btn{white-space:normal;width:100%}
.workflow-microsoft-body [hidden]{display:none!important}

/* Refresh controls share the workflow's neutral theme and compact settings. */
.workflow-microsoft-refresh{border-top:1px solid var(--olf-line,#d4d4d4);padding-top:12px;margin-top:12px;font-size:13px}
.workflow-microsoft-refresh>summary{cursor:pointer;font-weight:600;padding:6px 0;color:var(--olf-ink,inherit)}
.workflow-refresh-body{display:grid;gap:12px;padding:10px 0;min-width:0}
.workflow-refresh-body p{margin:0;line-height:1.5;overflow-wrap:anywhere}
.workflow-refresh-field{display:grid;gap:6px;min-width:0}
.workflow-refresh-field .form-select{width:100%;min-width:0}
.workflow-refresh-consent{display:flex;align-items:flex-start;gap:9px;line-height:1.5}
.workflow-refresh-consent input{flex:none;margin-top:3px;accent-color:var(--olf-accent,#ad563d)}
.workflow-refresh-actions{display:flex;flex-wrap:wrap;gap:8px}
.workflow-refresh-actions .btn{white-space:normal;min-height:36px}
.workflow-refresh-history{display:grid;gap:12px}
.workflow-refresh-schedule{display:grid;gap:9px;border:1px solid var(--olf-line,#d4d4d4);border-radius:6px;padding:12px;min-width:0}
.workflow-refresh-schedule h4{margin:0;font-size:14px;overflow-wrap:anywhere}
.workflow-refresh-schedule dl{display:grid;grid-template-columns:minmax(0,1fr);gap:3px;margin:0}
.workflow-refresh-schedule dt{color:var(--olf-ink-secondary,inherit);font-size:12px}
.workflow-refresh-schedule dd{margin:0 0 5px;overflow-wrap:anywhere}
.workflow-microsoft-refresh [hidden]{display:none!important}

/* Preparation follows one source → steps → preview → publication journey.
   Keep selected settings beside the canvas regardless of disclosure state;
   the coordinate starter retains its separate existing layout above. */
#preparationGuide { min-width: 0; }
#preparationGuide .workflow-topbar { min-height: 76px; padding: 14px 24px; align-items: center; flex-wrap: wrap; gap: 12px 20px; }
#preparationGuide .workflow-topbar > div { min-width: 0; }
#preparationGuide .workflow-topbar h2 { margin-top: 6px; font-size: 20px; overflow-wrap: anywhere; }
#preparationGuide .workflow-top-actions { flex-wrap: wrap; gap: 8px; }
#preparationGuide .workflow-database-picker { flex-wrap: wrap; }
#preparationGuide .workflow-database-picker select { min-width: 0; max-width: min(240px,100%); }
#preparationGuide :is(.btn,.workflow-tool,.workflow-step-navigator button) { min-height: 44px; }
#preparationGuide .btn { font-size: 14px; line-height: 1.4; padding: 10px 14px; max-width: 100%; white-space: normal; text-box: normal; }
#preparationGuide :is(input:not([type="checkbox"]):not([type="file"]),select) { min-height: 44px; min-width: 0; max-width: 100%; }
#preparationGuide :is(button,a,input,select,summary,[tabindex]):focus-visible { outline: 2px solid var(--olf-accent); outline-offset: 3px; }
#prepJourney { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; padding: 12px 24px; background: var(--olf-paper-raised); border-bottom: 1px solid var(--olf-line); }
#prepJourney button { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; min-width: 0; padding: 10px 12px; border: 1px solid var(--olf-line); border-radius: var(--olf-radius-control); background: var(--olf-paper-raised); color: var(--olf-ink-secondary); font: 500 14px/1.4 var(--olf-font-sans); cursor: pointer; }
#prepJourney button:hover { border-color: var(--olf-line-strong); background: var(--olf-paper); }
#prepJourney button:is([aria-current="step"],[aria-pressed="true"],.active) { color: var(--olf-accent); border-color: var(--olf-accent); background: var(--olf-accent-soft); }
#prepJourney button:disabled { cursor: not-allowed; opacity: .5; }
#preparationGuide .workflow-source-picker { margin: 12px 24px; padding: 10px 14px; border-radius: var(--olf-radius-panel); }
#preparationGuide .workflow-source-picker > summary { display: list-item; min-height: 44px; padding: 10px 0; font-size: 14px; }
#preparationGuide .workflow-editor { display: grid; grid-template-columns: 180px minmax(0,1fr) 280px; grid-template-areas: "tools canvas settings"; min-height: 0; height: auto; border-block: 1px solid var(--olf-line); }
#preparationGuide .workflow-library { grid-area: tools; padding: 12px; border-right: 1px solid var(--olf-line); border-bottom: 0; max-height: clamp(340px,42vh,480px); min-height: 0; overflow: auto; }
#preparationGuide .workflow-stage { grid-area: canvas; height: clamp(340px,42vh,480px); min-height: 0; min-width: 0; }
#preparationGuide .workflow-settings { grid-area: settings; padding: 16px; border-top: 0; border-left: 1px solid var(--olf-line); max-height: clamp(340px,42vh,480px); min-height: 0; overflow: auto; }
#preparationGuide .workflow-settings-body { min-width: 0; max-width: 100%; }
#preparationGuide .workflow-settings-disclosure > summary { min-height: 44px; font-size: 15px; font-weight: 600; overflow-wrap: anywhere; }
#preparationGuide .workflow-settings-body :is(p,label) { overflow-wrap: anywhere; }
#prepToolsDisclosure > summary { min-height: 44px; padding: 10px 0; font-size: 14px; font-weight: 600; cursor: pointer; }
#preparationGuide .workflow-panel-title { margin-bottom: 10px; font-size: 14px; }
#preparationGuide .workflow-tool { padding: 10px 4px; min-width: 0; }
#preparationGuide .workflow-tool > span:last-child { min-width: 0; overflow-wrap: anywhere; }
#preparationGuide .workflow-tool strong { font-size: 13px; }
#preparationGuide .workflow-tool small { font-size: 12px; }
#preparationGuide .workflow-canvas-caption { margin: 10px 14px; font-size: 13px; overflow-wrap: anywhere; }
#preparationGuide .workflow-step-navigator { margin: 0; padding: 8px 12px; gap: 6px; min-width: 0; }
#preparationGuide .workflow-step-navigator button { font-size: 13px; padding: 8px 10px; }
#preparationGuide .workflow-next-step { padding: 12px 24px; }
#preparationGuide .workflow-inspection { scroll-margin-top: 12px; }
#preparationGuide .workflow-dock-summary { min-height: 54px; padding: 14px 24px; }
#preparationGuide .workflow-inspection-bar { padding-inline: 24px; }
#preparationGuide .workflow-inspection-bar button { min-height: 44px; }
#preparationGuide .guide-table-scroll { max-width: calc(100% - 40px); min-width: 0; }
#preparationGuide .workflow-publication { min-width: 0; padding: 18px 24px; border-top: 1px solid var(--olf-line); background: var(--olf-paper-raised); scroll-margin-top: 12px; }
#preparationGuide .workflow-publication > :is(h2,h3) { font-size: 18px; margin-bottom: 8px; }
#preparationGuide .workflow-publication > p { max-width: 85ch; color: var(--olf-ink-secondary); font-size: 14px; margin-block: 8px; }
#preparationGuide .workflow-publication .workflow-about { padding: 0; border: 0; }
#preparationGuide .workflow-publication summary { min-height: 44px; padding-block: 10px; }
#prepWorkflowOptions { margin: 18px 24px 24px; border: 1px solid var(--olf-line); border-radius: var(--olf-radius-panel); background: var(--olf-paper-raised); min-width: 0; }
#prepWorkflowOptions > summary { min-height: 48px; padding: 12px 16px; font-size: 14px; font-weight: 600; cursor: pointer; }
#prepWorkflowOptions > :not(summary) { min-width: 0; max-width: 100%; }
#prepWorkflowOptions .workflow-document-bar { padding: 12px 16px; }
#prepWorkflowOptions .workflow-about { padding: 12px 16px; }
#prepWorkflowOptions .workflow-about:last-child { border-bottom: 0; }
@media (max-width: 1100px) {
  #preparationGuide .workflow-editor { grid-template-columns: minmax(0,1fr) 280px; grid-template-areas: "tools tools" "canvas settings"; }
  #preparationGuide .workflow-library { max-height: none; border-right: 0; border-bottom: 1px solid var(--olf-line); padding: 8px 16px; }
  #prepLibrary { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,180px),1fr)); gap: 4px 12px; max-height: 240px; overflow: auto; }
  #preparationGuide .workflow-library .workflow-setting-hint { margin-block: 8px; }
}
@media (max-width: 760px) {
  #preparationGuide .workflow-topbar { padding: 12px 16px; gap: 10px; }
  #preparationGuide .workflow-top-actions { width: 100%; justify-content: flex-start; }
  #preparationGuide .workflow-top-actions .btn { flex: 1 1 100px; }
  #prepJourney { padding: 10px 16px; gap: 6px; }
  #prepJourney button { padding: 8px 4px; font-size: 13px; }
  #preparationGuide .workflow-source-picker { margin: 10px 16px; padding: 6px 12px; }
  #preparationGuide .workflow-editor { grid-template-columns: minmax(0,1fr); grid-template-areas: "tools" "canvas" "settings"; }
  #preparationGuide .workflow-settings { border-left: 0; border-bottom: 1px solid var(--olf-line); padding: 10px 16px; max-height: none; overflow: visible; }
  #preparationGuide .workflow-settings-body { max-width: 100%; }
  #preparationGuide .workflow-stage { height: 300px; }
  #preparationGuide .workflow-next-step { padding: 12px 16px; }
  #preparationGuide .workflow-dock-summary { padding: 12px 16px; }
  #preparationGuide .workflow-inspection-bar { padding-inline: 16px; }
  #preparationGuide .workflow-publication { padding: 16px; }
  #prepWorkflowOptions { margin: 16px; }
  .workspace-workflow-intro > div:first-child { display:none; }
  .workspace-workflow-intro { padding:8px 16px; }
  #preparationGuide .workflow-top-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
  #preparationGuide .workflow-database-picker { grid-column:1 / -1; }
  .workflow-toolbar-more > summary { min-height:44px; text-align:center; }
}

/* Canvas workbench: one toolbar, a source-first library and a tall work surface. */
body.workspace-shell:has(#viewFlow.active) .workspace-topbar { min-height:56px;padding-block:8px; }
body.workspace-shell:has(#viewFlow.active) .workspace-context { padding-block:7px;gap:8px 16px; }
.workflow-mode-bar { display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--olf-line);background:var(--olf-paper-raised); }
.workflow-mode-bar .workflow-mode-tabs { border:0;min-width:0;gap:20px; }
.workflow-mode-actions { padding:4px 16px;flex-shrink:0; }
.workflow-mode-actions .btn { min-height:36px;font-size:13px; }
#preparationGuide .workflow-topbar { min-height:68px;padding:10px 16px;flex-wrap:nowrap;gap:12px; }
#preparationGuide .workflow-topbar > div:first-child { flex:1 1 200px; }
#preparationGuide .workflow-eyebrow { display:none; }
#preparationGuide .workflow-topbar h2 { display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0;font-size:17px; }
#prepTitle { max-width:280px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
#preparationGuide .workflow-draft { margin:0;font-size:11px; }
#preparationGuide .workflow-top-actions { flex-wrap:nowrap;gap:6px; }
#preparationGuide .workflow-top-actions .btn { min-height:38px;padding:8px 10px;font-size:13px;white-space:nowrap; }
#preparationGuide .workflow-database-picker select { width:160px;max-width:160px;min-height:38px;font-size:13px; }
#preparationGuide .workflow-toolbar-more > summary { min-height:38px;padding:8px 10px;font-size:13px; }
#preparationGuide .workflow-toolbar-more[open] { padding:0;margin:0;border:0;background:transparent; }
#preparationGuide .workflow-toolbar-menu { position:absolute;right:0;top:calc(100% + 6px);z-index:30;display:grid;gap:4px;min-width:210px;padding:8px;border:1px solid var(--olf-line);border-radius:var(--olf-radius-panel);background:var(--olf-paper-raised);box-shadow:0 8px 24px #0002; }
#preparationGuide .workflow-toolbar-menu .btn { text-align:left;justify-content:flex-start; }
#preparationGuide .workflow-editor { grid-template-columns:236px minmax(0,1fr) 280px;grid-template-areas:"tools canvas settings";height:max(430px,calc(100dvh - 260px)); }
#preparationGuide :is(.workflow-library,.workflow-stage,.workflow-settings) { height:100%;max-height:none; }
#preparationGuide .workflow-library { padding:12px; }
#prepToolsDisclosure > summary { display:none; }
#prepToolsDisclosure > .workflow-panel-title { margin-bottom:10px; }
#preparationGuide .workflow-library-tabs { display:flex;gap:4px;padding:3px;background:var(--olf-paper-muted);border:1px solid var(--olf-line);border-radius:var(--olf-radius-control);margin-bottom:10px; }
#preparationGuide .workflow-library-tabs button { flex:1;min-height:36px;padding:6px 8px;border:0;border-radius:4px;background:transparent;color:var(--olf-ink-secondary);font:500 13px var(--olf-font-sans);cursor:pointer; }
#preparationGuide .workflow-library-tabs button[aria-pressed="true"] { background:var(--olf-paper-raised);color:var(--olf-ink);box-shadow:0 1px 3px #0002; }
#preparationGuide .workflow-library-count { margin:8px 0;font-size:12px;color:var(--olf-ink-secondary); }
#preparationGuide .workflow-library .form-select { width:100%;margin-top:8px; }
#preparationGuide .workflow-tool { padding:9px 8px;min-height:50px;border:1px solid transparent; }
#preparationGuide .workflow-tool:hover { border-color:var(--olf-line); }
#preparationGuide .workflow-tool small { margin-top:3px;line-height:1.4; }
#preparationGuide .workflow-tool:disabled { opacity:.55;cursor:not-allowed; }
#prepImportSource { display:none; }
#preparationGuide .workflow-library .guide-confirm { margin-top:16px;font-size:12px; }
#preparationGuide .workflow-library .guide-confirm + .workflow-setting-hint { display:none; }
#preparationGuide .workflow-canvas-caption { top:0;left:0;right:0;margin:0;padding:12px 14px;background:var(--olf-paper);border-bottom:1px solid var(--olf-line); }
#preparationGuide .workflow-dock-summary { min-height:46px;padding:10px 16px; }
@media(max-width:1200px) and (min-width:761px) {
  #preparationGuide .workflow-topbar { flex-wrap:wrap; }
  #preparationGuide .workflow-topbar > div:first-child { flex-basis:100%; }
  #preparationGuide .workflow-top-actions { width:100%; }
  #preparationGuide .workflow-editor { height:max(430px,calc(100dvh - 300px)); }
}
@media(max-width:1050px) and (min-width:761px) {
  #preparationGuide .workflow-editor { grid-template-columns:220px minmax(0,1fr);grid-template-areas:"tools canvas" "settings settings";height:auto; }
  #preparationGuide :is(.workflow-library,.workflow-stage) { height:500px; }
  #preparationGuide .workflow-settings { height:auto;max-height:340px;border-left:0;border-top:1px solid var(--olf-line); }
  #prepLibrary { display:block;max-height:none; }
}
@media(max-width:760px) {
  .workflow-mode-bar { align-items:stretch;flex-wrap:wrap; }
  .workflow-mode-bar .workflow-mode-tabs { flex:1;padding-inline:12px;gap:12px; }
  .workflow-mode-tabs > button { font-size:12px;padding-inline:0; }
  .workflow-mode-actions { padding:6px 12px; }
  #preparationGuide .workflow-topbar { flex-wrap:wrap;padding:10px 12px; }
  #preparationGuide .workflow-topbar > div:first-child { flex-basis:100%; }
  #preparationGuide .workflow-top-actions { display:flex;flex-wrap:wrap;gap:6px; }
  #preparationGuide .workflow-database-picker { flex:1 1 140px; }
  #preparationGuide .workflow-top-actions .btn { flex:0 1 auto; }
  #preparationGuide .workflow-editor { grid-template-columns:minmax(0,1fr);grid-template-areas:"tools" "canvas" "settings";height:auto; }
  #preparationGuide .workflow-library { height:auto;max-height:280px;padding:8px 12px; }
  #prepToolsDisclosure > summary { display:list-item;min-height:36px;padding:6px 0; }
  #prepToolsDisclosure > .workflow-panel-title { display:none; }
  #prepLibrary { display:block;max-height:none; }
  #preparationGuide .workflow-stage { height:420px; }
  #preparationGuide .workflow-settings { height:auto;max-height:none; }
}
