Flowfile 0.5.6__py3-none-any.whl → 0.6.1__py3-none-any.whl

flowfile/web/static/assets/{DesignerView-71d4e9a1.css → DesignerView-Dm6OzlIc.css}

@@ -1,9 +1,9 @@
 
-.button-group[data-v-e214f6f3] {
+.button-group[data-v-3d73f4dc] {
   display: flex;
   gap: 10px;
 }
-.button-group .el-button[data-v-e214f6f3] {
+.button-group .el-button[data-v-3d73f4dc] {
   display: flex;
   align-items: center;
   gap: 6px;
@@ -20,47 +20,47 @@
 }
 
 /* Run button - normal state */
-.button-group .el-button[data-v-e214f6f3]:first-child:not([disabled]) {
+.button-group .el-button[data-v-3d73f4dc]:first-child:not([disabled]) {
   background-color: var(--primary-blue) !important;
   border: 1px solid var(--primary-blue-light) !important;
-  color: var(--color-accent-subtle) !important;
+  color: #ffffff !important;
 }
 
 /* Run button - hover state */
-.button-group .el-button[data-v-e214f6f3]:first-child:not([disabled]):hover {
+.button-group .el-button[data-v-3d73f4dc]:first-child:not([disabled]):hover {
   background-color: var(--color-button-primary) !important;
   border-color: var(--color-button-primary) !important;
 }
 
 /* Run button - disabled state */
-.button-group .el-button:first-child[disabled][data-v-e214f6f3] {
+.button-group .el-button:first-child[disabled][data-v-3d73f4dc] {
   background-color: var(--color-gray-400) !important;
   border: 1px solid var(--color-gray-400) !important;
-  color: var(--color-accent-subtle) !important;
+  color: #ffffff !important;
   cursor: not-allowed;
   opacity: 0.7;
 }
 
 /* Cancel button */
-.button-group .el-button[data-v-e214f6f3]:nth-child(2) {
+.button-group .el-button[data-v-3d73f4dc]:nth-child(2) {
   background-color: var(--color-danger) !important;
   border: 1px solid var(--color-danger) !important;
-  color: var(--color-accent-subtle) !important;
+  color: #ffffff !important;
 }
 
 /* Cancel button - hover state */
-.button-group .el-button[data-v-e214f6f3]:nth-child(2):hover {
+.button-group .el-button[data-v-3d73f4dc]:nth-child(2):hover {
   background-color: var(--color-danger-hover) !important;
   border-color: var(--color-danger-hover) !important;
 }
 
 /* Active state for both buttons */
-.button-group .el-button[data-v-e214f6f3]:active {
+.button-group .el-button[data-v-3d73f4dc]:active {
   transform: translateY(1px);
   box-shadow: none;
 }
 
-.browser-title[data-v-bcb824aa] {
+.browser-title[data-v-42889233] {
   display: flex;
   align-items: center;
   gap: 8px;
@@ -69,32 +69,32 @@
   font-weight: 600;
   color: var(--color-text-primary);
 }
-.mode-selector[data-v-bcb824aa] {
+.mode-selector[data-v-42889233] {
   display: flex;
   justify-content: center;
 }
-.browser-content[data-v-bcb824aa] {
+.browser-content[data-v-42889233] {
   display: flex;
   flex-direction: column;
   height: calc(100% - 116px); /* Adjust based on header height */
   overflow: hidden;
 }
-.browser-toolbar[data-v-bcb824aa] {
+.browser-toolbar[data-v-42889233] {
   padding: 16px;
   background-color: var(--color-background-primary);
   border-bottom: 1px solid var(--color-border-primary);
 }
-.browser-action-btn[data-v-bcb824aa] {
+.browser-action-btn[data-v-42889233] {
   background-color: var(--color-file-browser-bg);
   color: var(--color-text-inverse);
 }
-.path-navigation[data-v-bcb824aa] {
+.path-navigation[data-v-42889233] {
   display: flex;
   align-items: center;
   gap: 12px;
   margin-bottom: 12px;
 }
-.nav-button[data-v-bcb824aa] {
+.nav-button[data-v-42889233] {
   display: inline-flex;
   align-items: center;
   gap: 4px;
@@ -107,11 +107,11 @@
   cursor: pointer;
   transition: all 0.2s ease;
 }
-.nav-button[data-v-bcb824aa]:hover:not(:disabled) {
+.nav-button[data-v-42889233]:hover:not(:disabled) {
   background-color: var(--color-background-secondary);
   border-color: var(--color-border-secondary);
 }
-.current-path[data-v-bcb824aa] {
+.current-path[data-v-42889233] {
   flex: 1;
   padding: 8px 12px;
   background-color: var(--color-background-secondary);
@@ -120,38 +120,38 @@
   font-family: var(--font-family-mono);
   color: var(--color-text-secondary);
 }
-.search-container[data-v-bcb824aa] {
+.search-container[data-v-42889233] {
   display: flex;
   align-items: center;
   gap: 16px;
   flex: 1;
 }
-.search-input[data-v-bcb824aa] {
+.search-input[data-v-42889233] {
   flex: 1;
 }
-.browser-main[data-v-bcb824aa] {
+.browser-main[data-v-42889233] {
   flex: 1;
   overflow-y: auto;
   padding: 16px;
 }
-.file-item[data-v-bcb824aa] {
+.file-item[data-v-42889233] {
   border: 1px solid var(--color-border-primary);
   border-radius: 8px;
   overflow: hidden;
   transition: all 0.2s ease;
 }
-.file-item[data-v-bcb824aa]:hover {
+.file-item[data-v-42889233]:hover {
   transform: translateY(-2px);
   box-shadow: var(--shadow-sm);
 }
-.file-item.selected[data-v-bcb824aa] {
+.file-item.selected[data-v-42889233] {
   border-color: var(--color-info);
   border-width: 2px;
   background-color: var(--color-background-selected);
   box-shadow: var(--shadow-md);
   position: relative;
 }
-.file-item.selected[data-v-bcb824aa]::after {
+.file-item.selected[data-v-42889233]::after {
   content: "check_circle";
   font-family: "Material Icons";
   position: absolute;
@@ -162,29 +162,29 @@
   background: var(--color-background-primary);
   border-radius: 50%;
 }
-.file-item-content[data-v-bcb824aa] {
+.file-item-content[data-v-42889233] {
   padding: 12px;
   display: flex;
   align-items: center;
   gap: 12px;
 }
-.file-icon-wrapper[data-v-bcb824aa] {
+.file-icon-wrapper[data-v-42889233] {
   display: flex;
   align-items: center;
   justify-content: center;
   width: 30px;
   height: 30px;
 }
-.file-icon[data-v-bcb824aa] {
+.file-icon[data-v-42889233] {
   width: 24px;
   height: 24px;
   color: var(--color-text-tertiary);
 }
-.file-details[data-v-bcb824aa] {
+.file-details[data-v-42889233] {
   flex: 1;
   min-width: 0;
 }
-.file-name[data-v-bcb824aa] {
+.file-name[data-v-42889233] {
   font-weight: 500;
   color: var(--color-text-primary);
   margin-bottom: 4px;
@@ -192,11 +192,11 @@
   overflow: hidden;
   text-overflow: ellipsis;
 }
-.file-info[data-v-bcb824aa] {
+.file-info[data-v-42889233] {
   font-size: 12px;
   color: var(--color-text-secondary);
 }
-.browser-actions[data-v-bcb824aa] {
+.browser-actions[data-v-42889233] {
   padding: 16px;
   background-color: var(--color-background-secondary);
   border-top: 1px solid var(--color-border-primary);
@@ -207,58 +207,58 @@
   box-sizing: border-box;
   gap: 12px;
 }
-.selected-file[data-v-bcb824aa] {
+.selected-file[data-v-42889233] {
   color: var(--color-text-secondary);
   font-size: 14px;
 }
-.loading-state[data-v-bcb824aa],
-.error-state[data-v-bcb824aa],
-.empty-state[data-v-bcb824aa] {
+.loading-state[data-v-42889233],
+.error-state[data-v-42889233],
+.empty-state[data-v-42889233] {
   display: flex;
   align-items: center;
   justify-content: center;
   height: 200px;
   color: var(--color-text-secondary);
 }
-.error-state[data-v-bcb824aa] {
+.error-state[data-v-42889233] {
   color: var(--color-danger);
 }
-.error-content[data-v-bcb824aa] {
+.error-content[data-v-42889233] {
   display: flex;
   flex-direction: column;
   align-items: center;
   gap: 12px;
   text-align: center;
 }
-.error-icon[data-v-bcb824aa] {
+.error-icon[data-v-42889233] {
   font-size: 48px;
   color: var(--color-danger, #ef4444);
 }
-.error-message[data-v-bcb824aa] {
+.error-message[data-v-42889233] {
   max-width: 300px;
 }
-.empty-state[data-v-bcb824aa] {
+.empty-state[data-v-42889233] {
   flex-direction: column;
   gap: 8px;
   color: var(--color-text-secondary);
 }
-.empty-state .material-icons[data-v-bcb824aa] {
+.empty-state .material-icons[data-v-42889233] {
   font-size: 48px;
   opacity: 0.5;
 }
 
 /* Refresh button styling */
-.refresh-button[data-v-bcb824aa] {
+.refresh-button[data-v-42889233] {
   padding: 8px;
   min-width: auto;
 }
-.refresh-button .material-icons[data-v-bcb824aa] {
+.refresh-button .material-icons[data-v-42889233] {
   transition: transform 0.3s ease;
 }
-.refresh-button .material-icons.spin[data-v-bcb824aa] {
-  animation: spin-bcb824aa 1s linear infinite;
+.refresh-button .material-icons.spin[data-v-42889233] {
+  animation: spin-42889233 1s linear infinite;
 }
-@keyframes spin-bcb824aa {
+@keyframes spin-42889233 {
 from {
     transform: rotate(0deg);
 }
@@ -266,10 +266,10 @@ to {
     transform: rotate(360deg);
 }
 }
-.hidden-file[data-v-bcb824aa] {
+.hidden-file[data-v-42889233] {
   opacity: 0.5;
 }
-.file-browser[data-v-bcb824aa] {
+.file-browser[data-v-42889233] {
   display: flex;
   flex-direction: column;
   height: 70vh; /* Set to 70% of viewport height */
@@ -277,20 +277,20 @@ to {
   border-radius: 8px;
   box-shadow: var(--shadow-md);
 }
-.browser-content[data-v-bcb824aa] {
+.browser-content[data-v-42889233] {
   display: flex;
   flex-direction: column;
   flex: 1;
   min-height: 0; /* Enable proper flex child scrolling */
   overflow: hidden;
 }
-.browser-main[data-v-bcb824aa] {
+.browser-main[data-v-42889233] {
   flex: 1;
   overflow-y: auto; /* Make this section scrollable */
   padding: 16px;
   min-height: 0; /* Enable proper flex child scrolling */
 }
-.grid-container[data-v-bcb824aa] {
+.grid-container[data-v-42889233] {
   display: grid;
   grid-template-columns: repeat(auto-fill, minmax(205px, 1fr));
   gap: 16px;
@@ -298,25 +298,25 @@ to {
 }
 
 /* Optional: if you want to maintain icon size consistency */
-.file-icon[data-v-bcb824aa] {
+.file-icon[data-v-42889233] {
   width: 24px;
   height: 24px;
   object-fit: contain;
 }
 
 /* Add new styles for sort controls */
-.search-and-sort-container[data-v-bcb824aa] {
+.search-and-sort-container[data-v-42889233] {
   display: flex;
   flex-direction: column;
   gap: 12px;
 }
-.sort-controls[data-v-bcb824aa] {
+.sort-controls[data-v-42889233] {
   display: flex;
   align-items: center;
   gap: 8px;
   min-width: 180px; /* Prevent select from being too narrow */
 }
-.sort-direction-button[data-v-bcb824aa] {
+.sort-direction-button[data-v-42889233] {
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -324,13 +324,13 @@ to {
   height: 32px;
   padding: 0;
 }
-.controls-row[data-v-bcb824aa] {
+.controls-row[data-v-42889233] {
   display: flex;
   align-items: center;
   gap: 16px;
   margin-top: 12px;
 }
-.form-hint[data-v-bcb824aa] {
+.form-hint[data-v-42889233] {
   font-size: 12px;
   color: var(--color-text-tertiary);
   margin-top: 8px;
@@ -339,22 +339,22 @@ to {
   gap: 6px;
   flex-wrap: wrap;
 }
-.preview-label[data-v-bcb824aa] {
+.preview-label[data-v-42889233] {
   color: var(--color-text-secondary);
 }
-.form-hint code[data-v-bcb824aa] {
+.form-hint code[data-v-42889233] {
   background-color: var(--color-background-secondary);
   padding: 2px 6px;
   border-radius: 4px;
   font-family: monospace;
   color: var(--color-text-primary);
 }
-.auto-extension-hint[data-v-bcb824aa] {
+.auto-extension-hint[data-v-42889233] {
   color: var(--color-text-muted);
   font-style: italic;
 }
 
-.action-buttons[data-v-f8281642] {
+.action-buttons[data-v-0e8c073f] {
   padding-left: var(--spacing-5);
   display: flex;
   align-items: center;
@@ -362,7 +362,7 @@ to {
   height: 50px;
   font-family: var(--font-family-base);
 }
-.action-btn[data-v-f8281642] {
+.action-btn[data-v-0e8c073f] {
   display: flex;
   align-items: center;
   gap: var(--spacing-1-5);
@@ -378,63 +378,70 @@ to {
   font-weight: var(--font-weight-medium);
   box-shadow: var(--shadow-xs);
 }
-.action-btn[data-v-f8281642]:hover {
+.action-btn[data-v-0e8c073f]:hover {
   background-color: var(--color-background-tertiary);
   border-color: var(--color-border-secondary);
 }
-.action-btn[data-v-f8281642]:active {
+.action-btn[data-v-0e8c073f]:active {
   transform: translateY(1px);
   box-shadow: none;
 }
-.action-btn.active[data-v-f8281642] {
+.action-btn.active[data-v-0e8c073f] {
   background-color: var(--color-accent-subtle);
   border-color: var(--color-accent);
   color: var(--color-accent);
 }
-.btn-icon[data-v-f8281642] {
+.btn-icon[data-v-0e8c073f] {
   font-size: 18px;
   color: var(--color-text-secondary);
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   text-rendering: optimizeLegibility;
 }
-.action-btn:hover .btn-icon[data-v-f8281642] {
+.action-btn:hover .btn-icon[data-v-0e8c073f] {
   color: var(--color-text-primary);
 }
-.action-btn.active .btn-icon[data-v-f8281642] {
+.action-btn.active .btn-icon[data-v-0e8c073f] {
   color: var(--color-accent);
 }
-.btn-text[data-v-f8281642] {
+.btn-text[data-v-0e8c073f] {
   white-space: nowrap;
 }
-.settings-modal-content[data-v-f8281642] {
+.settings-modal-content[data-v-0e8c073f] {
   padding: var(--spacing-4);
   font-family: var(--font-family-base);
 }
-.form-group[data-v-f8281642] {
+.form-group[data-v-0e8c073f] {
   margin-bottom: var(--spacing-4);
 }
-.form-group label[data-v-f8281642] {
+.form-group label[data-v-0e8c073f] {
   display: block;
   margin-bottom: var(--spacing-2);
   font-size: var(--font-size-sm);
   font-weight: var(--font-weight-medium);
   color: var(--color-text-primary);
 }
-.quick-create-modal[data-v-f8281642] {
+.form-hint[data-v-0e8c073f] {
+  display: block;
+  margin-top: var(--spacing-1);
+  font-size: var(--font-size-xs, 11px);
+  color: var(--color-text-muted, #999);
+  line-height: 1.4;
+}
+.quick-create-modal[data-v-0e8c073f] {
   padding: var(--spacing-4) 0;
 }
-.quick-create-modal .form-group[data-v-f8281642] {
+.quick-create-modal .form-group[data-v-0e8c073f] {
   margin-bottom: var(--spacing-5);
 }
-.quick-create-modal label[data-v-f8281642] {
+.quick-create-modal label[data-v-0e8c073f] {
   display: block;
   margin-bottom: var(--spacing-2);
   font-size: var(--font-size-sm);
   font-weight: var(--font-weight-medium);
   color: var(--color-text-primary);
 }
-.preview-text[data-v-f8281642] {
+.preview-text[data-v-0e8c073f] {
   padding: var(--spacing-3);
   background-color: var(--color-background-muted);
   border: 1px solid var(--color-border-light);
@@ -442,14 +449,14 @@ to {
   font-size: var(--font-size-md);
   color: var(--color-text-secondary);
 }
-.preview-text code[data-v-f8281642] {
+.preview-text code[data-v-0e8c073f] {
   background-color: var(--color-background-tertiary);
   padding: 2px var(--spacing-1-5);
   border-radius: var(--border-radius-sm);
   font-family: var(--font-family-mono);
   font-size: var(--font-size-sm);
 }
-.dialog-footer[data-v-f8281642] {
+.dialog-footer[data-v-0e8c073f] {
   display: flex;
   gap: var(--spacing-2);
 }
@@ -10717,6 +10724,47 @@ to {
 .context-menu[data-v-9260496a] {
   min-width: 200px;
 }
+
+.undo-redo-controls[data-v-ef0e185f] {
+  position: absolute;
+  top: 12px;
+  left: 192px; /* Position after the node list panel */
+  display: flex;
+  gap: 4px;
+  z-index: 1000;
+  background: var(--color-background-primary);
+  border: 1px solid var(--color-border-light);
+  border-radius: var(--border-radius-lg);
+  padding: 4px;
+  box-shadow: var(--shadow-md);
+}
+.control-btn[data-v-ef0e185f] {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 32px;
+  height: 32px;
+  background: transparent;
+  border: none;
+  border-radius: var(--border-radius-md);
+  cursor: pointer;
+  color: var(--color-text-secondary);
+  transition: all var(--transition-fast);
+}
+.control-btn[data-v-ef0e185f]:hover:not(:disabled) {
+  background: var(--color-background-tertiary);
+  color: var(--color-text-primary);
+}
+.control-btn[data-v-ef0e185f]:active:not(:disabled) {
+  transform: scale(0.95);
+}
+.control-btn[data-v-ef0e185f]:disabled {
+  opacity: 0.3;
+  cursor: not-allowed;
+}
+.control-btn .material-icons[data-v-ef0e185f] {
+  font-size: 20px;
+}
 .vue-flow {
   position: relative;
   width: 100%;
@@ -10736,10 +10784,10 @@ to {
   z-index: 1;
 }
 .vue-flow__pane.draggable {
-     cursor: grab;
+    cursor: grab;
 }
 .vue-flow__pane.selection {
-     cursor: pointer;
+    cursor: pointer;
 }
 .vue-flow__pane.dragging {
     cursor: grabbing;
@@ -10784,31 +10832,31 @@ to {
   cursor: pointer;
 }
 .vue-flow__edge.animated path {
-     stroke-dasharray: 5;
-     animation: dashdraw 0.5s linear infinite;
+    stroke-dasharray: 5;
+    animation: dashdraw 0.5s linear infinite;
 }
 .vue-flow__edge.animated path.vue-flow__edge-interaction {
-     stroke-dasharray: none;
-     animation: none;
+    stroke-dasharray: none;
+    animation: none;
 }
 .vue-flow__edge.inactive {
-     pointer-events: none;
+    pointer-events: none;
 }
 .vue-flow__edge.selected,
   .vue-flow__edge:focus,
   .vue-flow__edge:focus-visible {
-     outline: none;
+    outline: none;
 }
 .vue-flow__edge.selected .vue-flow__edge-path,
   .vue-flow__edge:focus .vue-flow__edge-path,
   .vue-flow__edge:focus-visible .vue-flow__edge-path {
-     stroke: #555;
+    stroke: #555;
 }
 .vue-flow__edge-textwrapper {
-     pointer-events: all;
+    pointer-events: all;
 }
 .vue-flow__edge-textbg {
-     fill: white;
+    fill: white;
 }
 .vue-flow__edge-text {
     pointer-events: none;
@@ -10820,8 +10868,8 @@ to {
   pointer-events: none;
 }
 .vue-flow__connection .animated {
-     stroke-dasharray: 5;
-     animation: dashdraw 0.5s linear infinite;
+    stroke-dasharray: 5;
+    animation: dashdraw 0.5s linear infinite;
 }
 .vue-flow__connectionline {
   z-index: 1001;
@@ -10830,25 +10878,6 @@ to {
   pointer-events: none;
   transform-origin: 0 0;
 }
-.vue-flow__node-default,
-.vue-flow__node-input,
-.vue-flow__node-output {
-  border-width: 1px;
-  border-style: solid;
-  border-color: #bbb;
-}
-.vue-flow__node-default.selected,
-  .vue-flow__node-default:focus,
-  .vue-flow__node-default:focus-visible,
-  .vue-flow__node-input.selected,
-  .vue-flow__node-input:focus,
-  .vue-flow__node-input:focus-visible,
-  .vue-flow__node-output.selected,
-  .vue-flow__node-output:focus,
-  .vue-flow__node-output:focus-visible {
-     outline: none;
-     border: 1px solid #555;
-}
 .vue-flow__node {
   position: absolute;
   -webkit-user-select: none;
@@ -10872,12 +10901,12 @@ to {
   pointer-events: none;
 }
 .vue-flow__nodesselection-rect {
-     position: absolute;
-     pointer-events: all;
-     cursor: grab;
+    position: absolute;
+    pointer-events: all;
+    cursor: grab;
 }
 .vue-flow__nodesselection-rect.dragging {
-          cursor: grabbing;
+      cursor: grabbing;
 }
 .vue-flow__handle {
   position: absolute;
@@ -10886,28 +10915,28 @@ to {
   min-height: 5px;
 }
 .vue-flow__handle.connectable {
-     pointer-events: all;
-     cursor: crosshair;
+    pointer-events: all;
+    cursor: crosshair;
 }
 .vue-flow__handle-bottom {
-     left: 50%;
-     bottom: 0;
-     transform: translate(-50%, 50%);
+    left: 50%;
+    bottom: 0;
+    transform: translate(-50%, 50%);
 }
 .vue-flow__handle-top {
-     left: 50%;
-     top: 0;
-     transform: translate(-50%, -50%);
+    left: 50%;
+    top: 0;
+    transform: translate(-50%, -50%);
 }
 .vue-flow__handle-left {
-     top: 50%;
-     left: 0;
-     transform: translate(-50%, -50%);
+    top: 50%;
+    left: 0;
+    transform: translate(-50%, -50%);
 }
 .vue-flow__handle-right {
-     top: 50%;
-     right: 0;
-     transform: translate(50%, -50%);
+    top: 50%;
+    right: 0;
+    transform: translate(50%, -50%);
 }
 .vue-flow__edgeupdater {
   cursor: move;
@@ -10919,20 +10948,20 @@ to {
   margin: 15px;
 }
 .vue-flow__panel.top {
-     top: 0;
+    top: 0;
 }
 .vue-flow__panel.bottom {
-     bottom: 0;
+    bottom: 0;
 }
 .vue-flow__panel.left {
-     left: 0;
+    left: 0;
 }
 .vue-flow__panel.right {
-     right: 0;
+    right: 0;
 }
 .vue-flow__panel.center {
-     left: 50%;
-     transform: translateX(-50%);
+    left: 50%;
+    transform: translateX(-50%);
 }
 @keyframes dashdraw {
 from {
@@ -10942,7 +10971,7 @@ from {
 :root {
   --vf-node-bg: #fff;
   --vf-node-text: #222;
-  --vf-connection-path:  #b1b1b7;
+  --vf-connection-path: #b1b1b7;
   --vf-handle: #555;
 }
 .vue-flow__edge.updating .vue-flow__edge-path {
@@ -10962,7 +10991,7 @@ from {
 }
 .vue-flow__node.selectable:focus,
   .vue-flow__node.selectable:focus-visible {
-     outline: none;
+    outline: none;
 }
 .vue-flow__node-default,
 .vue-flow__node-input,
@@ -10984,7 +11013,19 @@ from {
   .vue-flow__node-input.selected:hover,
   .vue-flow__node-output.selected,
   .vue-flow__node-output.selected:hover {
-     box-shadow: 0 0 0 0.5px var(--vf-box-shadow);
+    box-shadow: 0 0 0 0.5px var(--vf-box-shadow);
+}
+.vue-flow__node-default.selected,
+  .vue-flow__node-default:focus,
+  .vue-flow__node-default:focus-visible,
+  .vue-flow__node-input.selected,
+  .vue-flow__node-input:focus,
+  .vue-flow__node-input:focus-visible,
+  .vue-flow__node-output.selected,
+  .vue-flow__node-output:focus,
+  .vue-flow__node-output:focus-visible {
+    outline: none;
+    border: 1px solid #555;
 }
 .vue-flow__node-default .vue-flow__handle, .vue-flow__node-input .vue-flow__handle, .vue-flow__node-output .vue-flow__handle {
     background: var(--vf-handle);
@@ -11003,8 +11044,8 @@ from {
 .vue-flow__node-input.selected,
   .vue-flow__node-input:focus,
   .vue-flow__node-input:focus-visible {
-     outline: none;
-     border: 1px solid var(--vf-node-color, #0041d0);
+    outline: none;
+    border: 1px solid var(--vf-node-color, #0041d0);
 }
 .vue-flow__node-default {
   --vf-handle: var(--vf-node-color, #1a192b);
@@ -11016,8 +11057,8 @@ from {
 .vue-flow__node-default.selected,
   .vue-flow__node-default:focus,
   .vue-flow__node-default:focus-visible {
-     outline: none;
-     border: 1px solid var(--vf-node-color, #1a192b);
+    outline: none;
+    border: 1px solid var(--vf-node-color, #1a192b);
 }
 .vue-flow__node-output {
   --vf-handle: var(--vf-node-color, #ff0072);
@@ -11029,8 +11070,8 @@ from {
 .vue-flow__node-output.selected,
   .vue-flow__node-output:focus,
   .vue-flow__node-output:focus-visible {
-     outline: none;
-     border: 1px solid var(--vf-node-color, #ff0072);
+    outline: none;
+    border: 1px solid var(--vf-node-color, #ff0072);
 }
 .vue-flow__nodesselection-rect,
 .vue-flow__selection {
@@ -11041,7 +11082,7 @@ from {
   .vue-flow__nodesselection-rect:focus-visible,
   .vue-flow__selection:focus,
   .vue-flow__selection:focus-visible {
-     outline: none;
+    outline: none;
 }
 .vue-flow__handle {
   width: 6px;
@@ -11115,8 +11156,8 @@ from {
 
 /* handle styles */
 .vue-flow__resize-control.handle {
-  width: 4px;
-  height: 4px;
+  width: 5px;
+  height: 5px;
   border: 1px solid #fff;
   border-radius: 1px;
   background-color: #3367d9;
@@ -11266,11 +11307,11 @@ main {
   gap: 10px;
 }
 
-.flow-tabs-container[data-v-5470f189] {
+.flow-tabs-container[data-v-6574f019] {
   width: 100%;
   font-family: var(--font-family-base);
 }
-.flow-tabs[data-v-5470f189] {
+.flow-tabs[data-v-6574f019] {
   display: flex;
   align-items: center;
   overflow-x: auto;
@@ -11280,17 +11321,17 @@ main {
   padding-left: var(--spacing-1);
   scrollbar-width: thin;
 }
-.flow-tabs[data-v-5470f189]::-webkit-scrollbar {
+.flow-tabs[data-v-6574f019]::-webkit-scrollbar {
   height: 4px;
 }
-.flow-tabs[data-v-5470f189]::-webkit-scrollbar-track {
+.flow-tabs[data-v-6574f019]::-webkit-scrollbar-track {
   background: transparent;
 }
-.flow-tabs[data-v-5470f189]::-webkit-scrollbar-thumb {
+.flow-tabs[data-v-6574f019]::-webkit-scrollbar-thumb {
   background-color: var(--color-gray-300);
   border-radius: var(--border-radius-full);
 }
-.flow-tab[data-v-5470f189] {
+.flow-tab[data-v-6574f019] {
   display: flex;
   align-items: center;
   padding: 0 var(--spacing-4);
@@ -11306,28 +11347,28 @@ main {
   margin-right: 1px;
   transition: all var(--transition-fast);
 }
-.flow-tab.active[data-v-5470f189] {
+.flow-tab.active[data-v-6574f019] {
   background-color: var(--color-background-primary);
   border-top: 2px solid var(--primary-blue);
   box-shadow: var(--shadow-xs);
   z-index: 1;
 }
-.flow-tab[data-v-5470f189]:not(.active):hover {
+.flow-tab[data-v-6574f019]:not(.active):hover {
   background-color: var(--color-background-hover);
 }
-.tab-content[data-v-5470f189] {
+.tab-content[data-v-6574f019] {
   display: flex;
   align-items: center;
   gap: var(--spacing-2);
   width: calc(100% - 20px);
   overflow: hidden;
 }
-.tab-icon[data-v-5470f189] {
+.tab-icon[data-v-6574f019] {
   font-size: var(--font-size-xl);
-  color: var(--color-accent-subtle);
+  color: var(--color-accent);
   flex-shrink: 0;
 }
-.tab-name[data-v-5470f189] {
+.tab-name[data-v-6574f019] {
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
@@ -11336,10 +11377,10 @@ main {
   letter-spacing: 0.01em;
   color: var(--color-text-secondary);
 }
-.active .tab-name[data-v-5470f189] {
+.active .tab-name[data-v-6574f019] {
   color: var(--color-text-primary);
 }
-.close-icon[data-v-5470f189] {
+.close-icon[data-v-6574f019] {
   font-size: var(--font-size-lg);
   color: var(--color-text-muted);
   opacity: 0;
@@ -11350,21 +11391,21 @@ main {
   transition: all var(--transition-fast);
   transform: scale(0.9);
 }
-.flow-tab:hover .close-icon[data-v-5470f189] {
+.flow-tab:hover .close-icon[data-v-6574f019] {
   opacity: 1;
 }
-.close-icon[data-v-5470f189]:hover {
+.close-icon[data-v-6574f019]:hover {
   background-color: var(--color-background-tertiary);
   color: var(--color-text-secondary);
   transform: scale(1);
 }
-.active .close-icon[data-v-5470f189]:hover {
+.active .close-icon[data-v-6574f019]:hover {
   background-color: var(--color-background-hover);
   color: var(--color-primary);
 }
 
 /* New flow tab styling */
-.new-flow-tab[data-v-5470f189] {
+.new-flow-tab[data-v-6574f019] {
   min-width: 40px;
   max-width: 40px;
   display: flex;
@@ -11372,7 +11413,7 @@ main {
   align-items: center;
   color: var(--color-primary);
 }
-.new-flow-tab[data-v-5470f189]:hover {
+.new-flow-tab[data-v-6574f019]:hover {
   background-color: var(--color-background-hover);
 }