.workflow-modes, .output-toolbar { display: flex; gap: 10px; flex-wrap: wrap; margin: 16px 0; }
.workflow-modes button[aria-pressed=true] { border-color: var(--primary); background: var(--primary-soft); font-weight: 700; }
.workflow-summary { color: var(--muted); font-size: .9rem; }
.workflow-workspace { display: grid; grid-template-columns: minmax(220px, 1fr) minmax(200px, .8fr); gap: 24px; align-items: start; }
.workflow-graph { display: flex; flex-direction: column; align-items: stretch; padding: 20px; border: 1px solid var(--line); border-radius: 12px; background: radial-gradient(var(--line) 1px, transparent 1px) 0 0 / 16px 16px; }
.workflow-node { position: relative; display: grid; grid-template-columns: 28px 1fr; gap: 6px 10px; width: 100%; padding: 14px; border: 1px solid var(--line); border-radius: 10px; text-align: left; background: var(--surface); color: var(--text); cursor: pointer; font: inherit; }
.workflow-node[aria-pressed=true] { border-color: var(--primary); outline: 2px solid var(--primary-soft); background: var(--primary-soft); }
.workflow-node:focus-visible { outline: 2px solid var(--primary); outline-offset: 3px; }
.workflow-node small { grid-column: 2; line-height: 1.55; color: var(--muted); overflow-wrap: anywhere; }
.workflow-number { color: var(--muted); font-size: .8rem; padding-top: 2px; }
.workflow-review-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 12px; align-items: start; }
.workflow-review-head { grid-column: 1 / -1; }
.workflow-review-grid > .workflow-arrow { text-align: center; }
.workflow-review-grid .workflow-node:not(.workflow-review-head) { display: flex; flex-direction: column; height: 100%; }
.workflow-node-skipped { border-style: dashed; opacity: .7; }
.workflow-arrow { align-self: center; min-height: 26px; color: var(--muted); font-size: .8rem; padding: 4px 0; }
.workflow-route { display: block; margin: 8px 0; padding: 6px 0; border: 0; color: var(--text); background: transparent; cursor: pointer; text-align: left; text-decoration: underline; font: inherit; }
.workflow-inspector { position: sticky; top: 0; padding: 18px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface-soft); min-width: 0; }
.workflow-inspector h3 { margin: 0 0 10px; }
.workflow-inspector p { line-height: 1.6; }
.workflow-setting { display: grid; gap: 8px; margin-top: 18px; }
.workflow-setting span { font-size: .85rem; color: var(--muted); }
.workflow-setting strong { overflow-wrap: anywhere; white-space: pre-wrap; max-height: 140px; overflow: auto; font-size: .9rem; }
.workflow-setting button { justify-self: start; }
.workflow-notes { margin-top: 16px; color: var(--muted); font-size: .85rem; line-height: 1.65; }
.workflow-notes p { margin: 6px 0; }
.workflow-warning { color: var(--danger, #b42318); }
.workflow-controls { border-top: 1px solid var(--line); margin-top: 20px; padding-top: 8px; }
.output-fields { max-width: 100%; overflow: auto; }
.output-fields table { width: 100%; border-collapse: collapse; margin: 12px 0; font-size: .9rem; }
.output-fields td, .output-fields th { padding: 10px; text-align: left; border-bottom: 1px solid var(--line); overflow-wrap: anywhere; }
.output-feedback { margin: 16px 0; padding: 12px; background: var(--surface-soft); border-radius: 8px; overflow-wrap: anywhere; }
.agent-trial-output pre { border: 1px solid var(--line); border-radius: 8px; padding: 14px; }
.agent-trial-output details { margin: 16px 0; }
.trial-steps { color: var(--muted); line-height: 1.7; }
.message-quality-status { color:var(--muted); font-size:.85rem; line-height:1.5; margin:8px 0; }
.quality-presets { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin:16px 0; }
.quality-preset { display:flex; flex-direction:column; gap:10px; padding:18px; text-align:left; border:1px solid var(--line); border-radius:12px; background:var(--surface); color:var(--text); font:inherit; cursor:pointer; }
.quality-preset[aria-pressed=true] { border-color:var(--primary); background:var(--primary-soft); }
.quality-preset span, .quality-preset small { line-height:1.6; color:var(--muted); }
.quality-summary { padding:16px; border:1px solid var(--line); border-radius:12px; background:var(--surface-soft); margin-bottom:16px; line-height:1.7; overflow-wrap:anywhere; }
.quality-summary p { margin:8px 0; }
@media (max-width: 900px) {
    .quality-presets { grid-template-columns:1fr; }
    .workflow-workspace { grid-template-columns: 1fr; }
    .workflow-inspector { position: static; }
    .workflow-graph { padding: 12px; }
    .workflow-node { padding: 12px; }
    .output-toolbar select { width: 100%; }
}