.workflow-page{height:100%;min-height:0;background:#15191f;color:#e9edf5;display:flex;flex-direction:column;font-size:13px}
.workflow-page button,.workflow-page input,.workflow-page select,.workflow-page textarea{font:inherit}
.workflow-page button{cursor:pointer}.workflow-page button:disabled{opacity:.45;cursor:default}
.wf-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 20px;border-bottom:1px solid #343b47;background:#1d222a;flex-wrap:wrap}
.wf-top h2{font-size:18px;margin:0}.wf-top p{color:#a9b3c5;font-size:12px;margin:5px 0 0}
.wf-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.wf-button{background:#2b3240;color:#edf1f8;border:1px solid #414c60;border-radius:6px;padding:8px 11px;font-weight:550}
.wf-button:hover:not(:disabled){background:#374156}.wf-button.primary{background:#7765e8;border-color:#8f7dfb;color:white}.wf-button.danger{color:#ffafb5}
.wf-badge{font-size:10px;padding:3px 7px;border:1px solid #536077;border-radius:5px;color:#c2ccdd;text-transform:uppercase;white-space:nowrap}.wf-badge.live{background:#184936;color:#9ae6b9;border-color:#2d654d}.wf-badge.draft{color:#f5d793;border-color:#77643d}
.wf-filters{display:flex;gap:10px;padding:14px 20px;border-bottom:1px solid #2e3540;flex-wrap:wrap}.wf-filters input{width:240px}
.workflow-page input,.workflow-page textarea,.workflow-page select{background:#141a23;border:1px solid #414b5d;color:#edf1f8;border-radius:5px;padding:8px;min-width:0}
.workflow-page input:focus,.workflow-page textarea:focus,.workflow-page select:focus{outline:2px solid #8c7ef0;outline-offset:1px}
.wf-list{padding:14px 20px;overflow:auto;flex:1}.wf-group{margin-bottom:24px}.wf-group h3{font-size:13px;display:flex;gap:9px;align-items:center;margin:10px 0}.wf-group p{font-size:11px;color:#a7b1c3;margin:6px 0 12px}
.wf-row{display:grid;grid-template-columns:minmax(180px,1fr) 80px 80px 95px 160px;gap:14px;align-items:center;padding:14px 16px;border:1px solid #333d4c;background:#202630;border-radius:8px;margin:7px 0;text-align:left;color:inherit;width:100%}
.wf-row:hover{background:#293242}.wf-row strong{font-size:13px;display:block}.wf-row small{font-size:11px;color:#a9b4c9;display:block;margin-top:4px}.wf-row>span:not(:first-child){font-size:12px}.wf-row .wf-actions{justify-content:flex-end}
.wf-empty{padding:60px 20px;text-align:center;color:#aeb9ca}.wf-empty h3{font-size:20px;color:#e1e7f1;margin-bottom:10px}
.wf-editor{display:grid;grid-template-columns:140px minmax(280px,1fr) 292px;flex:1;min-height:0;overflow:hidden}.wf-palette{padding:14px 10px;background:#1c222c;border-right:1px solid #333c4b;overflow:auto}
.wf-palette h3{font-size:10px;letter-spacing:1.4px;text-transform:uppercase;color:#aeb8ca;margin:5px 0 14px}.wf-palette button{display:block;width:100%;border:1px solid #3b4658;background:#242d3b;color:#e2e8f3;padding:10px 7px;text-align:left;border-radius:7px;margin:0 0 7px;font-size:11px}.wf-palette button:hover{border-color:#9c8bf3;background:#30374b}.wf-palette p{font-size:11px;line-height:1.6;color:#9ca9bd;margin-top:18px}
.wf-canvas-area{position:relative;min-width:0;min-height:0;background:#10151c}.wf-viewport{position:absolute;inset:0;overflow:auto;background-image:radial-gradient(#344051 1px,transparent 1px);background-size:18px 18px;overscroll-behavior:contain}
.wf-space{position:relative}.wf-world{position:absolute;top:0;left:0;transform-origin:0 0}.wf-world svg{position:absolute;inset:0;overflow:visible;pointer-events:none}.wf-world path{stroke:#7788a6;stroke-width:1.6;fill:none}.wf-world marker path{fill:#a3b2cb;stroke:none}
.wf-node{position:absolute;width:244px;border:1px solid #465168;background:#252d39;border-radius:9px;box-shadow:0 5px 14px #0004;color:#e6ebf4;overflow:visible;user-select:none}.wf-node.selected{outline:2px solid #a190ff;outline-offset:2px}.wf-node.start:before{content:'START';position:absolute;top:-24px;left:0;font-size:10px;font-weight:700;letter-spacing:1px;color:#b9abff}
.wf-node header{display:flex;align-items:center;gap:8px;padding:11px 12px;border-bottom:1px solid #3b4658;cursor:grab;border-radius:8px 8px 0 0;background:#303a4a;touch-action:none}.wf-node header b{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wf-node header small{font-size:10px;margin-left:auto;color:#b8c3d5}.wf-node p{white-space:pre-wrap;font-size:11px;line-height:1.6;margin:11px 12px;color:#ced6e5;overflow-wrap:anywhere;max-height:80px;overflow:hidden}.wf-node .wf-call-name{color:#c1b3ff}
.wf-port{position:relative;display:flex;align-items:center;justify-content:space-between;width:100%;padding:9px 12px;color:#d9e2f2;background:transparent;border:0;border-top:1px solid #3a4556;text-align:left;font-size:11px;gap:7px}.wf-port i{border:2px solid #a6a3e9;background:#252d39;width:11px;height:11px;border-radius:50%;position:absolute;right:-6px}.wf-port:hover{background:#3a3e5e}.wf-port.pending{background:#53456e}.wf-node footer{padding:8px 12px;color:#96a7be;font-size:10px;border-top:1px solid #3b4658}
.wf-canvas-tools{position:absolute;bottom:14px;left:14px;display:flex;align-items:center;gap:4px;z-index:2;background:#252e3c;border:1px solid #46516b;border-radius:8px;padding:5px;box-shadow:0 4px 14px #0005}.wf-canvas-tools button{background:none;color:#e9edfa;border:0;min-width:31px;padding:7px}.wf-canvas-tools span{font-size:11px;min-width:40px;text-align:center}.wf-connect-hint{position:absolute;top:12px;left:12px;right:12px;background:#6c54cb;color:#fff;padding:10px;border-radius:7px;z-index:2;font-size:12px}
.wf-inspector{background:#1d2531;border-left:1px solid #354154;padding:16px;overflow:auto}.wf-inspector h3{font-size:14px;margin:0 0 14px}.wf-inspector label{display:flex;flex-direction:column;gap:6px;margin-bottom:13px;font-size:11px;color:#b7c3d7}.wf-inspector textarea{resize:vertical;min-height:78px;line-height:1.6}.wf-inspector small{font-size:10px;line-height:1.5;color:#91a0b9}.wf-inspector .wf-check{flex-direction:row;align-items:center;gap:7px;margin:8px 0}.wf-inspector .wf-check input{width:auto;accent-color:#8a76eb}.wf-inspector .wf-option{border:1px solid #3d485b;border-radius:7px;padding:9px;margin:10px 0}.wf-inspector .wf-option label{margin:5px 0 8px}.wf-inspector .wf-option h4{font-size:11px;color:#d4dded;display:flex;justify-content:space-between}.wf-inspector .wf-option h4 button{border:0;background:none;color:#e79da9}.wf-inspector hr{border:0;border-top:1px solid #3b4657;margin:18px 0}.wf-inspector .wf-button{font-size:11px}
.wf-save-status{font-size:11px;color:#c8bbff}.wf-metrics{display:flex;gap:17px;flex-wrap:wrap}.wf-metrics span{color:#a9b5ca;font-size:11px}.wf-metrics b{color:#edf1f8;font-size:15px;margin-right:4px}
.wf-preview-log{display:flex;flex-direction:column;gap:12px;max-height:52vh;overflow:auto;padding:10px;background:#f4f5fa;border-radius:8px}.wf-preview-msg{padding:10px 12px;white-space:pre-wrap;background:#fff;border:1px solid #e2e4ed;border-radius:8px;max-width:95%;font-size:13px;line-height:1.6}.wf-preview-msg.visitor{align-self:flex-end;background:#6a59cf;color:#fff}.wf-preview-msg small{display:block;color:#888;font-size:10px;margin-bottom:3px}.wf-preview-buttons{display:grid;gap:6px}.wf-preview-buttons button{text-align:left}.wf-preview-end{font-size:12px;text-align:center;color:#6d7287;padding:8px}
@media(max-width:1100px){.wf-editor{grid-template-columns:110px minmax(220px,1fr) 250px}.wf-row{grid-template-columns:minmax(140px,1fr) 65px 70px 120px}.wf-row .wf-row-sites{display:none}}
@media(max-width:760px){.workflow-page{min-height:650px}.wf-editor{grid-template-columns:1fr;overflow:auto}.wf-palette{display:flex;gap:5px;overflow-x:auto;padding:8px;flex-shrink:0}.wf-palette h3,.wf-palette p{display:none}.wf-palette button{min-width:90px;margin:0}.wf-canvas-area{height:410px;min-height:410px}.wf-inspector{max-height:500px;overflow:auto;border-top:1px solid #3c4659}.wf-row{grid-template-columns:1fr 75px}.wf-row>span:nth-child(2),.wf-row>span:nth-child(3){display:none}.wf-filters input{width:100%}}

.workflow-page{color-scheme:dark;overflow:hidden}.workflow-page *{scrollbar-color:#49566d #1a222e;scrollbar-width:thin}.wf-top{flex-shrink:0}.wf-metrics{width:100%;align-items:center}.wf-metrics .wf-button{margin-left:auto}.wf-node:focus-visible{outline:2px solid #a190ff}.wf-palette,.wf-inspector{min-height:0}.wf-metrics-note{color:#9daac0;font-size:10px}