.wf-finding{border:1px solid var(--rule);border-radius:4px;padding:1rem 1.2rem;margin:0 0 1rem;background:var(--paper-2)}
.wf-finding h3{margin:.4rem 0 .5rem;font-size:1.12rem;line-height:1.3}
.wf-finding p{margin:.3rem 0;color:var(--ink-2)}
.wf-path{text-transform:none;letter-spacing:.02em}
.wf-finding details{margin-top:.6rem}
.wf-finding summary{cursor:pointer;color:var(--mute)}
.wf-tree{font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:.78rem;white-space:pre-wrap;color:var(--ink-2);margin:.4rem 0 0}
.wf-none{padding:1rem 0;color:var(--ink-2)}
#text.dragging{outline:2px dashed var(--verdigris)}
/* the workflow, drawn */
.wf-graph-wrap{margin:0 0 1.6rem;padding:.6rem .6rem .2rem;border:1px solid var(--rule);border-radius:4px;background:var(--paper);overflow-x:auto}
.wf-graph{display:block;width:100%;min-width:min(100%,32rem);max-height:34rem;height:auto;font-family:"Newsreader",Georgia,serif}
.wf-graph .wf-box{fill:var(--paper-2);stroke:var(--rule);stroke-width:1.2;transition:opacity .25s ease,stroke .2s ease}
.wf-graph .wf-accent{fill:var(--verdigris)}
.wf-graph .wf-name{font-size:14px;fill:var(--ink);font-weight:500}
.wf-graph .wf-type{font-size:10.5px;fill:var(--mute);font-family:"IBM Plex Mono",ui-monospace,monospace;letter-spacing:.04em}
.wf-graph .wf-node.flagged .wf-box{stroke:var(--oxide);stroke-width:1.6}
.wf-graph .wf-node.flagged{cursor:pointer}
.wf-graph .wf-node.unreachable .wf-box{stroke-dasharray:4 3;fill:transparent}
.wf-graph .wf-node.unreachable .wf-name{fill:var(--mute)}
.wf-graph .wf-node.ghost .wf-box{stroke:var(--oxide);stroke-dasharray:4 3;fill:color-mix(in srgb,var(--oxide) 6%,transparent)}
.wf-graph .wf-node.ghost .wf-name{font-style:italic;fill:var(--oxide)}
.wf-graph .wf-node.ghost .wf-type{fill:var(--oxide)}
.wf-graph .wf-badge{fill:var(--oxide)}
.wf-graph .wf-badge-n{font-size:12px;fill:var(--paper);font-weight:600;font-family:"IBM Plex Mono",ui-monospace,monospace}
.wf-graph .wf-edge{fill:none;stroke:var(--ink-2);stroke-width:1.4;opacity:.55;transition:opacity .25s ease,stroke .2s ease}
.wf-graph .wf-edge.conditional{stroke-dasharray:5 4}
.wf-graph .wf-edge.never{stroke:var(--oxide);stroke-dasharray:3 4;opacity:.8}
.wf-graph .wf-edge.ghost{stroke:var(--oxide);stroke-dasharray:3 4;opacity:.8}
.wf-graph .wf-arrow{fill:var(--ink-2);opacity:.7}
.wf-graph .wf-arrow.bad{fill:var(--oxide)}
.wf-graph .wf-edge-label{font-size:10.5px;fill:var(--mute);font-family:"IBM Plex Mono",ui-monospace,monospace;letter-spacing:.04em}
.wf-graph .wf-edge-label.never{fill:var(--oxide)}
.wf-graph.lit .wf-node:not(.lit) .wf-box,.wf-graph.lit .wf-node:not(.lit) text{opacity:.3}
.wf-graph.lit .wf-edge:not(.lit){opacity:.15}
.wf-graph.lit .wf-edge.lit{opacity:1;stroke:var(--oxide);stroke-width:2}
.wf-graph .wf-node.lit .wf-box{stroke:var(--oxide);stroke-width:2.2;filter:drop-shadow(0 0 6px color-mix(in srgb,var(--oxide) 45%,transparent))}
.wf-graph .wf-node:focus-visible{outline:none}
.wf-graph .wf-node:focus-visible .wf-box{stroke:var(--verdigris);stroke-width:2}
.wf-caption{margin:.5rem 0 0 .2rem}
.wf-finding.lit{background:color-mix(in srgb,var(--oxide) 5%,transparent)}
