.cf-intro{display:flex;align-items:center;gap:14px;margin-bottom:16px}.cf-intro p{margin:0;color:#516077}.cf-controls,.cf-toolbar{display:flex;align-items:end;gap:16px;flex-wrap:wrap;padding:18px;background:white;border:1px solid #e1e6ef;border-radius:12px}.cf-controls label,.cf-toolbar label{display:grid;gap:7px;font-size:14px;font-weight:600;min-width:200px}.cf-controls select,.cf-toolbar select{padding:10px;border:1px solid #ccd5e2;border-radius:7px;background:white;max-width:100%}.cf-result{margin-top:20px}.cf-toolbar{justify-content:space-between}.cf-zoom{display:flex;gap:8px;align-items:center}.cf-zoom span{width:48px;text-align:center}.cf-stamp{font-size:13px;color:#58677b;margin:12px 0}.cf-workspace{display:grid;grid-template-columns:minmax(0,1fr) 280px;border:1px solid #dce3ef;border-radius:12px;overflow:hidden;background:#fff}.cf-viewport{height:580px;overflow:auto;background-color:#f5f7fb;background-image:radial-gradient(#cdd7e5 1px,transparent 1px);background-size:20px 20px}.cf-canvas{position:relative;transform-origin:0 0}.cf-canvas svg{position:absolute;inset:0}.cf-node{position:absolute;width:240px;min-height:118px;padding:14px 16px;text-align:left;background:#fff;border:1px solid #c7d3e3;border-top:4px solid #73869f;border-radius:9px;box-shadow:0 3px 10px #1324400b;color:#172944;cursor:pointer;font:inherit}.cf-node span{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:#586b85}.cf-node strong{display:block;font-size:16px;line-height:1.35;margin:6px 0;overflow-wrap:anywhere}.cf-node small{font-size:12px;color:#66768a}.cf-node.selected,.cf-node:focus-visible{outline:3px solid #284ad7;outline-offset:3px}.cf-inbound{border-top-color:#284ad7}.cf-schedule,.cf-switch{border-top-color:#b37b1b}.cf-menu{border-top-color:#7853c4}.cf-ring-group,.cf-queue{border-top-color:#008684}.cf-voicemail{border-top-color:#bf6294}.cf-unknown{border-top-color:#d27924;background:#fff9ef}.cf-edge-label{font:12px system-ui;fill:#344764;paint-order:stroke;stroke:#f5f7fb;stroke-width:4px;stroke-linejoin:round}.cf-details{border-left:1px solid #dce3ef;padding:22px;overflow-wrap:anywhere;max-height:580px;overflow:auto}.cf-details h2{font-size:19px;margin:16px 0}.cf-details dt{font-size:13px;color:#63718a;margin-top:17px}.cf-details dd{margin:4px 0;font-size:14px}.cf-details h3{font-size:14px;margin-top:24px}.cf-details ul,.cf-notes ul{padding-left:19px;font-size:14px;line-height:1.6}.cf-notes{margin-top:15px;padding:16px;border:1px solid #dce3ef;border-radius:9px;color:#52637a}.cf-notes summary{cursor:pointer;font-size:14px;font-weight:600}.cf-notes p{font-size:14px}@media(max-width:1000px){.cf-workspace{grid-template-columns:1fr}.cf-details{border-left:0;border-top:1px solid #dce3ef;max-height:320px}.cf-viewport{height:440px}}@media(max-width:600px){.cf-intro{align-items:flex-start}.cf-controls label,.cf-toolbar label{min-width:0;width:100%}}

/* Diagram geometry must override the shared 20px icon rule. */
.cf-canvas>svg{width:100%;height:100%;stroke:none;stroke-width:0;overflow:visible;pointer-events:none}


.cf-connector{fill:none;stroke:#3454b4;stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round}
.cf-node{box-sizing:border-box;overflow:hidden}.cf-node strong{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.cf-node small{display:block}

.cf-zoom{flex-wrap:wrap}.cf-viewport.cf-hand-mode,.cf-viewport.cf-hand-mode .cf-node{cursor:grab;user-select:none;touch-action:none}.cf-viewport.cf-dragging,.cf-viewport.cf-dragging .cf-node{cursor:grabbing}