.react-flow__container{position:absolute;width:100%;height:100%;top:0;left:0}.react-flow__pane{z-index:1;cursor:-webkit-grab;cursor:grab}.react-flow__pane.selection{cursor:pointer}.react-flow__pane.dragging{cursor:-webkit-grabbing;cursor:grabbing}.react-flow__viewport{transform-origin:0 0;z-index:2;pointer-events:none}.react-flow__renderer{z-index:4}.react-flow__selection{z-index:6}.react-flow__nodesselection-rect:focus,.react-flow__nodesselection-rect:focus-visible{outline:none}.react-flow .react-flow__edges{pointer-events:none;overflow:visible}.react-flow__edge-path,.react-flow__connection-path{stroke:#b1b1b7;stroke-width:1;fill:none}.react-flow__edge{pointer-events:visibleStroke;cursor:pointer}.react-flow__edge.animated path{stroke-dasharray:5;-webkit-animation:dashdraw .5s linear infinite;animation:dashdraw .5s linear infinite}.react-flow__edge.animated path.react-flow__edge-interaction{stroke-dasharray:none;-webkit-animation:none;animation:none}.react-flow__edge.inactive{pointer-events:none}.react-flow__edge.selected,.react-flow__edge:focus,.react-flow__edge:focus-visible{outline:none}.react-flow__edge.selected .react-flow__edge-path,.react-flow__edge:focus .react-flow__edge-path,.react-flow__edge:focus-visible .react-flow__edge-path{stroke:#555}.react-flow__edge-textwrapper{pointer-events:all}.react-flow__edge-textbg{fill:#fff}.react-flow__edge .react-flow__edge-text{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.react-flow__connection{pointer-events:none}.react-flow__connection .animated{stroke-dasharray:5;-webkit-animation:dashdraw .5s linear infinite;animation:dashdraw .5s linear infinite}.react-flow__connectionline{z-index:1001}.react-flow__nodes{pointer-events:none;transform-origin:0 0}.react-flow__node{position:absolute;-webkit-user-select:none;-moz-user-select:none;user-select:none;pointer-events:all;transform-origin:0 0;box-sizing:border-box;cursor:-webkit-grab;cursor:grab}.react-flow__node.dragging{cursor:-webkit-grabbing;cursor:grabbing}.react-flow__nodesselection{z-index:3;transform-origin:left top;pointer-events:none}.react-flow__nodesselection-rect{position:absolute;pointer-events:all;cursor:-webkit-grab;cursor:grab}.react-flow__handle{position:absolute;pointer-events:none;min-width:5px;min-height:5px;width:6px;height:6px;background:#1a192b;border:1px solid white;border-radius:100%}.react-flow__handle.connectionindicator{pointer-events:all;cursor:crosshair}.react-flow__handle-bottom{top:auto;left:50%;bottom:-4px;transform:translate(-50%)}.react-flow__handle-top{left:50%;top:-4px;transform:translate(-50%)}.react-flow__handle-left{top:50%;left:-4px;transform:translateY(-50%)}.react-flow__handle-right{right:-4px;top:50%;transform:translateY(-50%)}.react-flow__edgeupdater{cursor:move;pointer-events:all}.react-flow__panel{position:absolute;z-index:5;margin:15px}.react-flow__panel.top{top:0}.react-flow__panel.bottom{bottom:0}.react-flow__panel.left{left:0}.react-flow__panel.right{right:0}.react-flow__panel.center{left:50%;transform:translate(-50%)}.react-flow__attribution{font-size:10px;background:#ffffff80;padding:2px 3px;margin:0}.react-flow__attribution a{text-decoration:none;color:#999}@-webkit-keyframes dashdraw{0%{stroke-dashoffset:10}}@keyframes dashdraw{0%{stroke-dashoffset:10}}.react-flow__edgelabel-renderer{position:absolute;width:100%;height:100%;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.react-flow__edge.updating .react-flow__edge-path{stroke:#777}.react-flow__edge-text{font-size:10px}.react-flow__node.selectable:focus,.react-flow__node.selectable:focus-visible{outline:none}.react-flow__node-default,.react-flow__node-input,.react-flow__node-output,.react-flow__node-group{padding:10px;border-radius:3px;width:150px;font-size:12px;color:#222;text-align:center;border-width:1px;border-style:solid;border-color:#1a192b;background-color:#fff}.react-flow__node-default.selectable:hover,.react-flow__node-input.selectable:hover,.react-flow__node-output.selectable:hover,.react-flow__node-group.selectable:hover{box-shadow:0 1px 4px 1px #00000014}.react-flow__node-default.selectable.selected,.react-flow__node-default.selectable:focus,.react-flow__node-default.selectable:focus-visible,.react-flow__node-input.selectable.selected,.react-flow__node-input.selectable:focus,.react-flow__node-input.selectable:focus-visible,.react-flow__node-output.selectable.selected,.react-flow__node-output.selectable:focus,.react-flow__node-output.selectable:focus-visible,.react-flow__node-group.selectable.selected,.react-flow__node-group.selectable:focus,.react-flow__node-group.selectable:focus-visible{box-shadow:0 0 0 .5px #1a192b}.react-flow__node-group{background-color:#f0f0f040}.react-flow__nodesselection-rect,.react-flow__selection{background:#0059dc14;border:1px dotted rgba(0,89,220,.8)}.react-flow__nodesselection-rect:focus,.react-flow__nodesselection-rect:focus-visible,.react-flow__selection:focus,.react-flow__selection:focus-visible{outline:none}.react-flow__controls{box-shadow:0 0 2px 1px #00000014}.react-flow__controls-button{border:none;background:#fefefe;border-bottom:1px solid #eee;box-sizing:content-box;display:flex;justify-content:center;align-items:center;width:16px;height:16px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;padding:5px}.react-flow__controls-button:hover{background:#f4f4f4}.react-flow__controls-button svg{width:100%;max-width:12px;max-height:12px}.react-flow__controls-button:disabled{pointer-events:none}.react-flow__controls-button:disabled svg{fill-opacity:.4}.react-flow__minimap{background-color:#fff}.react-flow__resize-control{position:absolute}.react-flow__resize-control.left,.react-flow__resize-control.right{cursor:ew-resize}.react-flow__resize-control.top,.react-flow__resize-control.bottom{cursor:ns-resize}.react-flow__resize-control.top.left,.react-flow__resize-control.bottom.right{cursor:nwse-resize}.react-flow__resize-control.bottom.left,.react-flow__resize-control.top.right{cursor:nesw-resize}.react-flow__resize-control.handle{width:4px;height:4px;border:1px solid #fff;border-radius:1px;background-color:#3367d9;transform:translate(-50%,-50%)}.react-flow__resize-control.handle.left{left:0;top:50%}.react-flow__resize-control.handle.right{left:100%;top:50%}.react-flow__resize-control.handle.top{left:50%;top:0}.react-flow__resize-control.handle.bottom{left:50%;top:100%}.react-flow__resize-control.handle.top.left,.react-flow__resize-control.handle.bottom.left{left:0}.react-flow__resize-control.handle.top.right,.react-flow__resize-control.handle.bottom.right{left:100%}.react-flow__resize-control.line{border-color:#3367d9;border-width:0;border-style:solid}.react-flow__resize-control.line.left,.react-flow__resize-control.line.right{width:1px;transform:translate(-50%);top:0;height:100%}.react-flow__resize-control.line.left{left:0;border-left-width:1px}.react-flow__resize-control.line.right{left:100%;border-right-width:1px}.react-flow__resize-control.line.top,.react-flow__resize-control.line.bottom{height:1px;transform:translateY(-50%);left:0;width:100%}.react-flow__resize-control.line.top{top:0;border-top-width:1px}.react-flow__resize-control.line.bottom{border-bottom-width:1px;top:100%}.container{width:100vw;height:100vh;padding:0;margin:0}.header{margin-bottom:20px;box-shadow:0 10px 5px #add8e6;border-radius:0 0 20% 20%;background:linear-gradient(45deg,#090979 0%,#00d4ff 100%)}input{border-radius:5px}.home__container{background:var(--bg-gradient);height:calc(100vh - 80px);width:100vw;display:grid;margin-top:80px;grid-template-columns:1fr 1fr}.home__view--left{display:flex;justify-content:center;align-items:center;text-align:left;padding-left:50px;color:var(--main-green);font-size:x-large;font-weight:700;background:transparent}.home__view--right{display:flex;justify-content:center;align-items:center;background:transparent}.home__btn{font-size:2em}.home__btn--icon{margin-left:5px}.nav-bar{background:#64bfec;display:flex;justify-content:space-around;align-items:center;position:absolute;height:80px;width:100vw;top:0;left:0}.title{display:flex;flex-direction:row;align-items:center;height:100%}.title p{color:var(--main-green);font-weight:700;font-size:50px;margin-right:20px}.nav-link-container{display:flex;flex-direction:row;align-items:center}.nav-link{font-size:large;color:var(--main-green);height:50%;padding:10px;display:flex;justify-content:space-around;align-items:center;border:5px solid transparent;transition:all .4s ease}.nav-link:hover{border:5px solid #fb74a8}.auth-btn,.account-info{width:250px;padding-top:5px;display:flex;flex-direction:row;justify-content:center;align-items:center}.account-icon{background-color:#faebd7;border-radius:25%;padding:10px;margin-right:10px}.account-username{font-size:large;color:var(--main-green);font-weight:700}#root{margin:0 auto;text-align:center}.container{width:100vw;height:calc(100vh - 80px);padding:0;margin:80px 0 0;background:#fff}.header{height:100px;margin-bottom:20px;box-shadow:0 10px 5px #add8e6;border-radius:0 0 20% 20%;background-color:#f0f8ff;padding-top:10px}h1,label{color:var(--main-green);padding:1%;margin:0}.course{font-weight:700;font-size:1.2rem}input{border-radius:5px;margin-left:5px}.naming-modal{position:absolute;top:50vh;background-color:#faebd7;z-index:3}.naming-modal::backdrop{background:#0000007f}.flow__container{width:100vw;height:calc(100vh - 200px);background-color:#f0f8ff;position:absolute;top:200px}.generate-node{background-color:#ffe0e8;height:50px;width:100px;padding:5px;border-radius:10px;display:flex;text-align:center;justify-content:center;box-shadow:3px 3px 5px #90599e}.generate-node>label{color:#90599e;display:flex;justify-content:center;align-items:center}.generated__handle__target,.generated__handle__source{top:50%;pointer-events:none;opacity:0}.users-created-node{height:20px;width:120px;padding:0;margin:10px;display:flex;text-align:center;justify-content:center;border-radius:10px;z-index:1;position:relative}.users-created__handle__target{top:50%;pointer-events:none;opacity:0}.users-created__handle__source{top:0;left:0;transform:none;background-color:#ffe0e8;height:100%;width:100%;border-radius:10px;box-shadow:3px 3px 5px #90599e;border:none}.custom-drag-handle{background:transparent;margin-right:4px;display:flex;align-items:center;justify-content:center}.users-created__input{width:100%;margin-left:5px;background:transparent;border:none;color:#90599e}.base-modal{background-color:#faebd7;border-radius:20px;width:20vw;height:30vh}.modal-close-btn{background-color:transparent;border:none;display:flex;width:100%;justify-content:flex-end;margin-bottom:10px}.naming-modal-form{display:flex;height:70%;flex-direction:column;text-align:left}.naming-label{font-size:2rem;color:gray}.naming-input{height:30px}.btn-container{display:flex;justify-content:center;margin-top:20px}.about__container{margin-top:80px;-ms-overflow-style:none;scrollbar-width:none;background:var(--bg-gradient)}.about__creator{width:100vw;height:calc(100vh - 80px);display:grid;grid-template-columns:2fr 3fr}.about__creator--left-view{background:#fb74a8;display:flex;justify-content:center;align-items:center;box-shadow:10px 10px 30px #f39ebc;border-radius:0 25% 25% 0}.about__creator--right-view{display:flex;flex-direction:column;justify-content:center}.info-container{display:grid;grid-template-columns:2fr 1fr;text-align:justify;padding-left:20px;gap:20px;color:#fafa33}a{color:#fafa33}.info__section{color:var(--main-green);font-weight:700}.creator-img{width:335px;height:500px;border-radius:45%}.about__tutorial{width:100vw;height:100vh;display:grid;grid-template-columns:3fr 2fr}.about__tutorial--left-view{display:grid;grid-template-columns:2fr 1fr;align-items:center;text-align:justify;padding:20px;color:#fafa33}ul{list-style-type:"🔔 "}.mode{font-weight:700;font-size:1.8rem;color:var(--main-green);margin:0}.nodes-illustration{display:flex;flex-direction:column;justify-content:space-between;margin-left:20px}.nodes-img{width:275px;height:200px;margin-top:20px;border-radius:15%}.img-note{margin:0;text-align:center}.about__tutorial--right-view{background:#8ac8e7;display:flex;justify-content:center;align-items:center;box-shadow:-10px 0 30px #c3daf5;border-radius:25% 0 0 25%}.login-title{font-size:2.5rem;color:#fafa33}.login-form{display:flex;flex-direction:column;width:350px;text-align:left;border-radius:10%;padding:20px}.login-input{width:100%;height:35px;border-radius:15px;margin-top:20px;margin-bottom:20px}.form-container{background:var(--bg-gradient);width:100vw;height:calc(100vh - 80px);margin-top:80px;display:flex;flex-direction:column;justify-content:center;align-items:center}.signup-title{font-size:2.5rem;color:#fafa33;margin-bottom:0}.signup-form{display:flex;flex-direction:column;width:350px;text-align:left;border-radius:10%;padding:20px}.input-label{font-weight:700;font-size:1.5rem}.signup-input{width:100%;height:35px;border-radius:15px;margin-top:20px;margin-bottom:20px}.btn-container{display:flex;justify-content:center}.err{height:20px;margin:5px;text-align:left;color:#fafa33}.account__container{width:100vw;margin-top:80px;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;padding:20px}.welcome-msg{padding:0;margin:0}.flow-element{background-color:#faebd7;margin:10px;padding:10px;width:25%;height:50px;display:flex;justify-content:space-between;text-align:left;border-radius:10px}h2{display:flex;justify-content:center;align-items:center}.edit-btn-container{display:flex;height:100%;margin-top:0;justify-content:center;align-items:center}.edit-btn,.delete-btn{border-radius:10px;transition:var(--btn-hover-transition);height:100%;margin-right:10px}.edit-btn:hover{background-color:transparent}.delete-btn:hover{color:#faebd7;background-color:#ff2400}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--btn-hover-transition: all .4s ease;--main-green: #C8F578;--bg-gradient: linear-gradient(135deg, #fb74a8 0%, #8ac8e7 100%)}a{font-weight:500;text-decoration:none}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh;background:var(--bg-gradient)}body::-webkit-scrollbar{display:none}h1{font-size:3.2em;line-height:1.1}.btn{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-weight:500;font-family:inherit;display:inline-block;width:max-content;margin:1rem;background-color:#eeefff;cursor:pointer;transition:var(--btn-hover-transition);box-shadow:-8px -8px 5px #00308f}.btn:hover{background:linear-gradient(90deg,#30a5bd 0%,#00b3ff 53%,#74fcfc 100%);color:#f0f8ff;transform:rotateX(10deg) rotateY(30deg) rotate(-10deg)}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}button{background-color:#f9f9f9}}