.container{display:-webkit-box;display:-ms-flexbox;display:flex;height:100vh;font-family:Arial,sans-serif}.sidebar{width:200px;padding:20px;background:#f5f5f5;border-right:1px solid #ddd;overflow-y:auto}.step-item{padding:10px;margin-bottom:10px;background:#fff;border:1px solid #3498db;border-radius:4px;cursor:move;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.canvas{-webkit-box-flex:1;-ms-flex:1;flex:1;position:relative;background:#f9f9f9;overflow:hidden}.node{width:50px;height:50px;background:#3498db;border-radius:4px;cursor:pointer;z-index:10}.group,.node{position:absolute}.group{border:2px dashed #e74c3c;border-radius:6px;background:rgba(231,76,60,.1);z-index:5}.group-header{padding:5px;background:#e74c3c;color:#fff;font-size:12px}.group-connector{position:absolute;right:-5px;top:50%;width:10px;height:10px;background:#2ecc71;border-radius:50%;cursor:crosshair}.connectors{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:1}