.color-swatch{width:28px;height:28px;border-radius:50%;outline:none;box-shadow:none;border:1px solid var(--panel-background);cursor:pointer}.color-swatch.active{outline:2px solid var(--text)}.shape-swatch{width:28px;height:28px;background:transparent;border:none;cursor:pointer;padding:4px;border-radius:4px;display:flex;align-items:center;justify-content:center}.shape-swatch:hover{background-color:rgba(0,0,0,.05)}.shape-swatch.active{background-color:rgba(0,0,0,.1)}.react-flow__node-toolbar.shape-node-toolbar{background-color:#ffffff;box-shadow:0 4px 6px -1px rgb(0 0 0/.1),0 2px 4px -2px rgb(0 0 0/.1);border-radius:8px;padding:8px;display:flex;flex-direction:column;gap:8px;border:1px solid #e2e8f0}.toolbar-row{display:flex;gap:8px;flex-wrap:wrap;max-width:240px}.shape-swatch__svg{overflow:visible}.color-swatch--dynamic{background-color:var(--swatch-color)}.react-flow{--xy-background-color:#ffffff;color-scheme:light;color:#1a1a1a;--xy-theme-primary:#4f46e5;--xy-theme-primary-light:#818cf8;--xy-theme-selected:#6366f1;--xy-theme-hover:#cbd5e1;--xy-theme-edge-hover:#4f46e5;--xy-theme-color-focus:#e0e7ff;--xy-theme-border:#e2e8f0;--xy-theme-shadow:rgba(0,0,0,0.04);--xy-node-border-default:1px solid #e2e8f0;--xy-node-boxshadow-default:0 2px 2px 0 rgba(0,0,0,0.08),0 2px 2px 0 rgba(0,0,0,0.04);--xy-node-border-radius-default:8px;--xy-node-background-color-default:#ffffff;--xy-handle-background-color-default:#ffffff;--xy-handle-border-color-default:#94a3b8;--xy-edge-stroke-default:#cbd5e1;--xy-edge-stroke-width-default:2px;--xy-edge-label-color-default:#475569}.react-flow.dark{--xy-background-color:#0f172a;--xy-theme-border:#334155;--xy-theme-hover:#475569;--xy-theme-color-focus:#1e293b;--xy-node-background-color-default:#1e293b;--xy-node-border-default:1px solid #334155;--xy-node-boxshadow-default:0 4px 6px -1px rgba(0,0,0,0.3),0 2px 4px -1px rgba(0,0,0,0.2);--xy-edge-stroke-default:#475569}.react-flow__node{display:flex;justify-content:center;align-items:center;text-align:center;padding:3px;font-size:16px;flex-direction:column}.react-flow__node-toolbar{color-scheme:light;color:#1a1a1a;--background:0 0% 100%;--foreground:222.2 84% 4.9%;--border:214.3 31.8% 91.4%;--accent:210 40% 96.1%;--accent-foreground:222.2 47.4% 11.2%;--destructive:0 84.2% 60.2%;--destructive-foreground:210 40% 98%}.react-flow__node-base{background-color:#ffe599;border-radius:12px}.react-flow__node-annotation,.react-flow__node-shape{padding:0;box-shadow:none}.react-flow.dark .react-flow__node-dynamic{--dn-bg:#1e293b;--dn-bg-surface:#0f172a;--dn-border:#334155;--dn-border-selected:#8b5cf6;--dn-text-primary:#e2e8f0;--dn-text-secondary:#94a3b8;--dn-text-muted:#64748b;--dn-error-bg:#450a0a;--dn-error-border:#7f1d1d;--dn-error-text:#fca5a5;--dn-spinner-track:#4c1d95;--dn-spinner-head:#8b5cf6}.react-flow.dark .react-flow__node-dynamic .dn-card{background-color:var(--dn-bg)!important;border-color:var(--dn-border)!important}.react-flow.dark .react-flow__node-dynamic .dn-card.dn-card--selected{border-color:var(--dn-border-selected)!important}.react-flow.dark .react-flow__node-dynamic .dn-header{background-color:var(--dn-bg-surface)!important;border-bottom-color:var(--dn-border)!important}.react-flow.dark .react-flow__node-dynamic .dn-header-label{color:var(--dn-text-secondary)!important}.react-flow.dark .react-flow__node-dynamic .dn-header-sep{background-color:var(--dn-border)!important}.react-flow.dark .react-flow__node-dynamic .dn-empty{background-color:var(--dn-bg-surface)!important}.react-flow.dark .react-flow__node-dynamic .dn-title{color:var(--dn-text-primary)!important}.react-flow.dark .react-flow__node-dynamic .dn-subtitle{color:var(--dn-text-muted)!important}.react-flow.dark .react-flow__node-dynamic .dn-generating-text{color:var(--dn-text-secondary)!important}.react-flow.dark .react-flow__node-dynamic .dn-error{background-color:var(--dn-error-bg)!important;border-color:var(--dn-error-border)!important;color:var(--dn-error-text)!important}.react-flow.dark .react-flow__node-dynamic .dn-spinner{border-color:var(--dn-spinner-track)!important;border-top-color:var(--dn-spinner-head)!important}.react-flow__node-group{background-color:rgba(99,102,241,.05);border:2px dashed var(--xy-theme-selected);border-radius:var(--xy-node-border-radius-default)}.react-flow__node-group.active{border:3px solid red}.react-flow__edge-path{stroke:var(--xy-edge-stroke-default);stroke-width:var(--xy-edge-stroke-width-default)}.react-flow__edge.selectable.selected .react-flow__edge-path,.react-flow__edge.selectable:hover .react-flow__edge-path{stroke:var(--xy-theme-edge-hover);stroke-width:2.5px}.react-flow__edge.animated .react-flow__edge-path{stroke-dasharray:5;animation:dashdraw .5s linear infinite}.react-flow__handle{background-color:#29b6f2;border:none;width:10px;height:10px;border-radius:50%;opacity:0}.editable-flow .react-flow__node.selected .react-flow__handle,.editable-flow .react-flow__node:hover .react-flow__handle,.react-flow__handle.connecting,.react-flow__handle.connectingfrom,.react-flow__handle.connectingto,.react-flow__handle.valid{opacity:1}.react-flow__handle.connectionindicator:hover{pointer-events:all;border-color:var(--xy-theme-edge-hover);background-color:var(--xy-theme-primary-light);opacity:1}.react-flow__handle.connectingfrom,.react-flow__handle.connectingto,.react-flow__handle.connectionindicator:focus{border-color:var(--xy-theme-edge-hover);background-color:var(--xy-theme-primary)}.rotatable-node__handle{position:absolute;width:15px;height:15px;background:#3b82f6;left:50%;bottom:-30px;border-radius:100%;transform:translate(-50%,50%);cursor:crosshair;border:2px solid white;box-shadow:0 0 4px rgba(0,0,0,.2);z-index:50}.rotatable-node__handle:after{content:"";display:block;position:absolute;width:2px;height:24px;background:#3b82f6;left:50%;bottom:10px;transform:translateX(-50%);opacity:.5}.rotatable-node__handle:hover{background:#2563eb;transform:translate(-50%,50%) scale(1.5);transition:transform .1s ease}.crop-handles-layer{pointer-events:none}.crop-handles-layer>*{pointer-events:auto}.crop-border{top:var(--ch-t);right:var(--ch-r);bottom:var(--ch-b);left:var(--ch-l);pointer-events:none}.crop-handle-edge{position:absolute;z-index:10;background:#3b82f6}.crop-handle-edge--bottom,.crop-handle-edge--top{height:12px;top:calc(var(--ch-t, 0%) - 6px);bottom:calc(var(--ch-b, 0%) - 6px);left:calc(var(--ch-l, 0%) + 20%);right:calc(var(--ch-r, 0%) + 20%);cursor:ns-resize}.crop-handle-edge--top{top:calc(var(--ch-t) - 6px);bottom:auto}.crop-handle-edge--bottom{bottom:calc(var(--ch-b) - 6px);top:auto}.crop-handle-edge--left,.crop-handle-edge--right{width:12px;top:calc(var(--ch-t, 0%) + 20%);bottom:calc(var(--ch-b, 0%) + 20%);cursor:ew-resize}.crop-handle-edge--left{left:calc(var(--ch-l) - 6px);right:auto}.crop-handle-edge--right{right:calc(var(--ch-r) - 6px);left:auto}.crop-handle-corner{position:absolute;z-index:10;width:16px;height:16px;background:#3b82f6;border:2px solid white;border-radius:2px}.crop-handle-corner--tl{top:calc(var(--ch-t) - 8px);left:calc(var(--ch-l) - 8px);cursor:nwse-resize}.crop-handle-corner--tr{top:calc(var(--ch-t) - 8px);right:calc(var(--ch-r) - 8px);cursor:nesw-resize}.crop-handle-corner--bl{bottom:calc(var(--ch-b) - 8px);left:calc(var(--ch-l) - 8px);cursor:nesw-resize}.crop-handle-corner--br{bottom:calc(var(--ch-b) - 8px);right:calc(var(--ch-r) - 8px);cursor:nwse-resize}.file-node-crop-clip{clip-path:inset(var(--ch-t,var(--crop-t,0)) var(--ch-r,var(--crop-r,0)) var(--ch-b,var(--crop-b,0)) var(--ch-l,var(--crop-l,0)))}.file-node-audio-progress{width:var(--audio-pct,0)}.react-flow__node-resizer{border-radius:0;border:none}.react-flow__node-resizer__line{border-color:#6366f1;border-width:2px}.react-flow__resize-control.handle{background-color:#ffffff;border:2px solid #6366f1;border-radius:4px;width:12px;height:12px}.react-flow__resize-control.line{border-color:#6366f1;border-width:2px}.react-flow__controls{box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);border:1px solid #e2e8f0;border-radius:12px;overflow:hidden}.react-flow__controls-button{background-color:#ffffff;border-bottom:1px solid #e2e8f0;transition:all .2s ease}.react-flow__controls-button:hover{background-color:#f8fafc}.react-flow__controls-button svg{fill:#64748b}.react-flow__controls-button:hover svg{fill:#4f46e5}.react-flow__minimap{background-color:#ffffff;border:1px solid #e2e8f0;border-radius:12px;box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06)}.react-flow__minimap-mask{fill:#6366f1;fill-opacity:.1;stroke:#6366f1;stroke-width:2}.react-flow__minimap-node{fill:#cbd5e1;stroke:#94a3b8;stroke-width:1}.react-flow__background{background-color:var(--xy-background-color)}:root{--color-primary:#ff0073;--color-background:#fefefe;--color-hover-bg:#f6f6f6;--color-disabled:#76797e}.xy-theme__button-group{display:flex;align-items:center;.xy-theme__button:first-child{border-radius:100px 0 0 100px}.xy-theme__button:last-child{border-radius:0 100px 100px 0;margin:0}}.xy-theme__button{display:inline-flex;align-items:center;justify-content:center;height:2.5rem;padding:0 1rem;border-radius:100px;border:1px solid var(--color-primary);background-color:var(--color-background);color:var(--color-primary);transition:background-color .2s ease,border-color .2s ease;box-shadow:var(--xy-node-boxshadow-default);cursor:pointer}.xy-theme__button.active{background-color:var(--color-primary);color:white;border-color:var(--color-primary)}.xy-theme__button.active:active,.xy-theme__button.active:hover{background-color:var(--color-primary);opacity:.9}.xy-theme__button:hover{background-color:var(--xy-controls-button-background-color-hover-default)}.xy-theme__button:active{background-color:var(--color-hover-bg)}.xy-theme__button:disabled{color:var(--color-disabled);opacity:.8;cursor:not-allowed;border:1px solid var(--color-disabled)}.xy-theme__button>span{margin-right:.2rem}.xy-theme__button+.xy-theme__button{margin-left:.3rem}.xy-theme__input{padding:.5rem .75rem;border:1px solid var(--color-primary);border-radius:7px;background-color:var(--color-background);transition:background-color .2s ease,border-color .2s ease;font-size:1rem;color:inherit}.xy-theme__input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 2px rgba(255,0,115,.3)}.xy-theme__checkbox{-webkit-appearance:none;appearance:none;width:1.25rem;height:1.25rem;border-radius:7px;border:2px solid var(--color-primary);background-color:var(--color-background);transition:background-color .2s ease,border-color .2s ease;cursor:pointer;display:inline-block;vertical-align:middle;margin-right:.5rem}.xy-theme__checkbox:checked{background-color:var(--color-primary);border-color:var(--color-primary)}.xy-theme__checkbox:focus{outline:none;box-shadow:0 0 0 2px rgba(255,0,115,.3)}.xy-theme__select{padding:.5rem .75rem;border:1px solid var(--color-primary);border-radius:50px;background-color:var(--color-background);transition:background-color .2s ease,border-color .2s ease;font-size:1rem;color:inherit;margin-right:.5rem;box-shadow:var(--xy-node-boxshadow-default)}.xy-theme__select:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 2px rgba(255,0,115,.3)}.xy-theme__label{margin-top:10px;margin-bottom:3px;display:inline-block}.dndflow{flex-grow:1;height:100%}.dndflow aside{border-right:1px solid #eee;padding:15px 10px;font-size:12px;background:#fcfcfc}.dndflow aside .description{margin-bottom:10px}.dndflow .selectall{margin-top:10px}@media screen and (min-width:768px){.dndflow{flex-direction:row}.dndflow aside{width:20%;max-width:250px}}.tool-overlay{pointer-events:auto;position:absolute;top:0;left:0;z-index:4;height:100%;width:100%;transform-origin:top left;cursor:copy;touch-action:none}.rectangle-preview{position:absolute;z-index:10;background-color:var(--rect-preview-color,rgba(0,89,220,.1))}.rectangle-preview--ellipse{border-radius:50%}.lasso-controls{display:flex;align-items:center;gap:10px}.lasso-controls button{width:150px}.lasso-controls label{display:flex;align-items:center;justify-content:center;line-height:1}.react-flow__node-freehand{background:transparent;overflow:visible;padding:0;pointer-events:none!important}.react-flow__node-freehand,.react-flow__node-freehand.draggable:hover,.react-flow__node-freehand.selectable:focus,.react-flow__node-freehand.selectable:focus:active,.react-flow__node-freehand.selectable:hover{border:none;box-shadow:none}.freehand-overlay{position:absolute;z-index:4;height:100%;width:100%;transform-origin:top left;cursor:crosshair;touch-action:none;pointer-events:auto}.freehand-eraser-overlay{position:absolute;inset:0;z-index:10;width:100%;height:100%;pointer-events:none}.freehand-overlay svg{width:100%;height:100%}.freehand-drawing{cursor:crosshair}.react-flow__resize-control{pointer-events:all}.preview{display:flex;justify-content:center;align-items:center;height:100%;flex-direction:column}.preview img{width:300px;height:300px;border:1px solid #ccc}.image-container{position:relative;width:300px;height:300px}.preview button{margin-top:1rem}.image-status{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-weight:700;width:280px;text-align:center}.mobile-canvas-wrapper{display:flex;justify-content:center;align-items:center;background:linear-gradient(135deg,#f1f5f9,#e2e8f0);padding:24px}.mobile-phone-frame{position:relative;border-radius:40px;background:#1a1a1a;padding:12px;box-shadow:0 0 0 2px #333,0 25px 50px -12px rgba(0,0,0,.4),inset 0 0 0 1px rgba(255,255,255,.1)}.mobile-phone-frame:before{content:"";position:absolute;top:8px;left:50%;transform:translateX(-50%);width:100px;height:28px;background:#000;border-radius:20px;z-index:10}.mobile-phone-frame:after{content:"";position:absolute;inset:12px;border-radius:32px;pointer-events:none;box-shadow:inset 0 0 0 1px rgba(0,0,0,.3);z-index:5}.mobile-phone-frame .react-flow{border-radius:32px;overflow:hidden}.mobile-phone-frame>div:after{content:"";position:absolute;bottom:-6px;left:50%;transform:translateX(-50%);width:134px;height:5px;background:#fff;border-radius:3px;z-index:10}.dark .mobile-canvas-wrapper,.react-flow.dark~.mobile-canvas-wrapper{background:linear-gradient(135deg,#1e293b,#0f172a)}.dark .mobile-phone-frame{background:#0a0a0a;box-shadow:0 0 0 2px #222,0 25px 50px -12px rgba(0,0,0,.6),inset 0 0 0 1px rgba(255,255,255,.05)}.note-node__body{background-color:var(--note-color,#fef3c7)}.flow-touch-canvas{touch-action:none}@keyframes slideProgress{0%{transform:scaleX(0)}to{transform:scaleX(1)}}.animated-svg-edge__icon{border-radius:50%}.rectangle-node__toolbar{display:flex;gap:.25rem;border-radius:.5rem;border:1px solid #e5e5e5;background-color:white;padding:.5rem;box-shadow:0 10px 15px -3px rgb(0 0 0/.1),0 4px 6px -4px rgb(0 0 0/.1)}.rectangle-node__color-btn{height:1.5rem;width:1.5rem;border-radius:9999px;border:none;cursor:pointer;transition:transform .15s ease-in-out;background-color:var(--rect-swatch)}.rectangle-node__color-btn:hover{transform:scale(1.1)}.rectangle-node__outer{height:100%;width:100%}.rectangle-node__inner,.rectangle-node__outer{display:flex;align-items:center;justify-content:center}.rectangle-node__inner{position:relative;height:calc(100% - 5px);width:calc(100% - 5px);background-color:var(--rect-color,white);border-radius:.375rem;box-shadow:0 1px 2px 0 rgb(0 0 0/.05);border:1px solid #e5e5e5}.rectangle-node__inner--ellipse{border-radius:50%}.rectangle-node__inner--selected{outline:2px solid #3b82f6;outline-offset:2px}