@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Fira+Code:wght@400;500&display=swap";:root{--aside-bg: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);--aside-border: #e2e8f0;--aside-shadow: 0 4px 20px rgba(0, 0, 0, .08);--text-main: #1e293b;--text-muted: #64748b;--text-subtle: #94a3b8;--block-bg: #ffffff;--block-border: #e2e8f0;--block-shadow: 0 2px 8px rgba(0, 0, 0, .04);--block-shadow-hover: 0 8px 24px rgba(0, 0, 0, .12);--hover-bg: linear-gradient(135deg, #f1f5f9 0%, #e2e8f0 100%);--hover-border: #cbd5e1;--category-border: linear-gradient(90deg, #0ea5e9 0%, #8b5cf6 100%);--transition-time: .3s;--transition-bounce: .5s cubic-bezier(.34, 1.56, .64, 1);--btn-primary: #0ea5e9;--btn-primary-hover: #0284c7;--btn-secondary: #64748b;--btn-secondary-hover: #475569}.dark-mode{--aside-bg: linear-gradient(180deg, #1e293b 0%, #0f172a 100%);--aside-border: #334155;--aside-shadow: 0 4px 20px rgba(0, 0, 0, .3);--text-main: #f1f5f9;--text-muted: #94a3b8;--text-subtle: #64748b;--block-bg: #1e293b;--block-border: #334155;--block-shadow: 0 2px 8px rgba(0, 0, 0, .2);--block-shadow-hover: 0 8px 24px rgba(0, 0, 0, .4);--hover-bg: linear-gradient(135deg, #334155 0%, #1e293b 100%);--hover-border: #475569;--category-border: linear-gradient(90deg, #38bdf8 0%, #a78bfa 100%)}.aside-container{position:relative;min-width:60px;max-width:520px;height:calc(100vh - 70px);background:var(--aside-bg);border-right:1px solid var(--aside-border);box-shadow:var(--aside-shadow);box-sizing:border-box;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;transition:width var(--transition-time) ease,background var(--transition-time),border-color var(--transition-time),box-shadow var(--transition-time);color:var(--text-main);overflow:hidden}.aside-container.resizing{transition:none!important}.aside-container.collapsed{width:60px}.resizer{position:absolute;top:0;right:0;bottom:0;width:6px;cursor:ew-resize;background:linear-gradient(90deg,transparent 0%,rgba(14,165,233,.2) 100%);z-index:10;transition:background var(--transition-fast, .15s ease)}.resizer:hover,.resizer:active{background:linear-gradient(90deg,transparent 0%,rgba(14,165,233,.5) 100%)}.aside-inner{display:flex;flex-direction:column;height:100%;padding:16px;overflow:hidden}.collapse-container{display:flex;align-items:center;justify-content:flex-end;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid var(--aside-border)}.collapse-button{width:36px;height:36px;display:flex;align-items:center;justify-content:center;cursor:pointer;background:linear-gradient(135deg,#fff,#f8fafc);border:1px solid var(--block-border);border-radius:10px;transition:all var(--transition-time);color:var(--text-muted);font-size:14px;font-weight:600;box-shadow:var(--block-shadow)}.dark-mode .collapse-button{background:linear-gradient(135deg,#334155,#1e293b);border-color:#475569}.aside-container.collapsed .collapse-button{transform:rotate(180deg)}.collapse-button:hover{transform:scale(1.08);background:linear-gradient(135deg,#0ea5e9,#0284c7);color:#fff;border-color:#0284c7;box-shadow:0 4px 12px #0ea5e966}.aside-container.collapsed .collapse-button:hover{transform:rotate(180deg) scale(1.1)}.collapse-button:active{transform:scale(.95)}.dark-mode .collapse-button:hover{transform:scale(1.08)}.dark-mode .aside-container.collapsed .collapse-button:hover{transform:rotate(180deg) scale(1.1)}.palette-title{text-align:center;font-size:1.1rem;font-weight:700;color:var(--text-main);margin:0 0 20px;letter-spacing:.5px;text-transform:uppercase;background:linear-gradient(135deg,#0ea5e9,#8b5cf6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.blocks-container{flex:1;overflow-y:auto;overflow-x:hidden;padding:4px;margin-right:-8px}.blocks-container::-webkit-scrollbar{width:4px}.blocks-container::-webkit-scrollbar-track{background:transparent}.blocks-container::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#cbd5e1,#94a3b8);border-radius:4px}.block-category{margin:20px 0 12px;font-size:.75rem;font-weight:700;color:var(--text-subtle);text-transform:uppercase;letter-spacing:1px;padding-bottom:8px;border-bottom:2px solid;border-image:var(--category-border) 1}.block-category:first-child{margin-top:0}.dndblock{display:flex;align-items:center;flex-wrap:wrap;margin:8px 0;padding:12px 14px;cursor:grab;background:var(--block-bg);border:1px solid var(--block-border);border-radius:12px;max-width:100%;transition:all var(--transition-time);box-shadow:var(--block-shadow);position:relative;overflow:hidden}.dndblock:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,transparent 0%,rgba(14,165,233,.03) 100%);opacity:0;transition:opacity var(--transition-time)}.dndblock:hover{transform:translateY(-3px) scale(1.02);box-shadow:var(--block-shadow-hover);border-color:var(--hover-border);background:var(--hover-bg)}.dndblock:hover:before{opacity:1}.dndblock:active{cursor:grabbing;transform:translateY(-1px) scale(1.01)}.dndblock.dragging{opacity:.6;transform:scale(.98);box-shadow:0 4px 12px #0ea5e94d}.dndblock .icon{flex-shrink:0;line-height:0;display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:8px;background:linear-gradient(135deg,#0ea5e91a,#8b5cf61a);color:#0ea5e9;transition:all var(--transition-time)}.dndblock:hover .icon{background:linear-gradient(135deg,#0ea5e9,#0284c7);color:#fff;transform:scale(1.1)}.dndblock span{margin-left:12px;margin-top:2px;line-height:1.3;white-space:normal;font-weight:600;font-size:.9rem;color:var(--text-main);transition:color var(--transition-time)}.dndblock:hover span{color:#0ea5e9}.dndblock svg:not(.MuiSvgIcon-root){width:1.1em;height:1.1em;margin-right:0;vertical-align:middle}.dndblock svg.MuiSvgIcon-root{width:1.2em;height:1.2em;vertical-align:middle}.dndblock.start-block .icon{background:linear-gradient(135deg,#10b98126,#05966926);color:#10b981}.dndblock.start-block:hover .icon{background:linear-gradient(135deg,#10b981,#059669)}.dndblock.end-block .icon{background:linear-gradient(135deg,#ef444426,#dc262626);color:#ef4444}.dndblock.end-block:hover .icon{background:linear-gradient(135deg,#ef4444,#dc2626)}.dndblock.if-block .icon,.dndblock.whileStart-block .icon{background:linear-gradient(135deg,#8b5cf626,#7c3aed26);color:#8b5cf6}.dndblock.if-block:hover .icon,.dndblock.whileStart-block:hover .icon{background:linear-gradient(135deg,#8b5cf6,#7c3aed)}.dndblock.input-block .icon,.dndblock.output-block .icon{background:linear-gradient(135deg,#f59e0b26,#d9770626);color:#f59e0b}.dndblock.input-block:hover .icon,.dndblock.output-block:hover .icon{background:linear-gradient(135deg,#f59e0b,#d97706)}.dndblock.move-block .icon,.dndblock.rotate-block .icon{background:linear-gradient(135deg,#ec489926,#db277726);color:#ec4899}.dndblock.move-block:hover .icon,.dndblock.rotate-block:hover .icon{background:linear-gradient(135deg,#ec4899,#db2777)}.dndblock.createVariable-block .icon,.dndblock.updateVariable-block .icon{background:linear-gradient(135deg,#3b82f626,#2563eb26);color:#3b82f6}.dndblock.createVariable-block:hover .icon,.dndblock.updateVariable-block:hover .icon{background:linear-gradient(135deg,#3b82f6,#2563eb)}@media(max-width:768px){.aside-container{max-width:320px;min-width:50px}.palette-title{font-size:.9rem}.dndblock{padding:10px 12px}.dndblock span{font-size:.8rem}}@keyframes slideIn{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}.dndblock{animation:slideIn .3s ease-out forwards;animation-delay:calc(var(--index, 0) * .05s);opacity:0}.react-flow{direction:ltr}.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__minimap svg{display:block}.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%}.help-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#0f172a99;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;justify-content:center;align-items:center;z-index:1300;padding:20px;animation:overlay-fade-in .2s ease-out}@keyframes overlay-fade-in{0%{opacity:0}to{opacity:1}}.help-modal-content{background:linear-gradient(180deg,#fff,#f8fafc);padding:32px;border-radius:24px;width:100%;max-width:640px;max-height:80vh;overflow-y:auto;box-shadow:0 25px 50px -12px #00000059,0 0 0 1px #0ea5e91a;border:1px solid rgba(14,165,233,.2);text-align:left;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;animation:modal-slide-in .3s ease-out}.help-modal-title{margin:0 0 20px;font-size:1.625rem;font-weight:700;color:#1e293b;border-bottom:2px solid;border-image:linear-gradient(90deg,#0ea5e9,#8b5cf6) 1;padding-bottom:12px}.help-modal-body{font-size:1rem;line-height:1.75;color:#475569;white-space:pre-wrap;margin-bottom:24px}.help-modal-close{display:block;width:120px;margin:0 auto;padding:12px 24px;border:none;background:linear-gradient(135deg,#0ea5e9,#0284c7);color:#fff;font-size:1rem;font-weight:600;border-radius:12px;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 12px #0ea5e94d}.dark-mode .help-modal-overlay{background:#000000b3}.dark-mode .help-modal-content{background:linear-gradient(180deg,#1e293b,#0f172a);box-shadow:0 25px 50px -12px #0009,0 0 0 1px #38bdf81a;border-color:#38bdf833}.dark-mode .help-modal-title{color:#f1f5f9}.dark-mode .help-modal-body{color:#94a3b8}.dark-mode .help-modal-close{background:linear-gradient(135deg,#38bdf8,#0ea5e9)}.dark-mode .help-modal-close:hover{background:linear-gradient(135deg,#0ea5e9,#0284c7)}@media(max-width:640px){.help-modal-content{padding:24px;width:100%;max-width:100%;border-radius:20px}.help-modal-title{font-size:1.25rem}.help-modal-body{font-size:.9375rem}.help-modal-close{width:100%;padding:14px 24px}}:root{--rt-color-white:#fff;--rt-color-dark:#222;--rt-color-success:#8dc572;--rt-color-error:#be6464;--rt-color-warning:#f0ad4e;--rt-color-info:#337ab7;--rt-opacity:.9;--rt-transition-show-delay:.15s;--rt-transition-closing-delay:.15s;--rt-arrow-size:8px}.core-styles-module_tooltip__3vRRp{left:0;opacity:0;pointer-events:none;position:absolute;top:0;will-change:opacity}.core-styles-module_fixed__pcSol{position:fixed}.core-styles-module_arrow__cvMwQ{-webkit-backface-visibility:hidden;backface-visibility:hidden;background:inherit;position:absolute;z-index:-1}.core-styles-module_content__BRKdB{position:relative;z-index:1}.core-styles-module_noArrow__xock6{display:none}.core-styles-module_clickable__ZuTTB{pointer-events:auto}.core-styles-module_show__Nt9eE{opacity:var(--rt-opacity);transition:opacity var(--rt-transition-show-delay) ease-out}.core-styles-module_closing__sGnxF{opacity:0;transition:opacity var(--rt-transition-closing-delay) ease-in}.styles-module_tooltip__mnnfp{border-radius:3px;font-size:90%;width:max-content}.styles-module_content__ydYdI{background:inherit;border-radius:inherit;padding:8px 16px}.styles-module_arrow__K0L3T{height:var(--rt-arrow-size);width:var(--rt-arrow-size)}[class*=react-tooltip__place-top]>.styles-module_arrow__K0L3T{transform:rotate(45deg)}[class*=react-tooltip__place-right]>.styles-module_arrow__K0L3T{transform:rotate(135deg)}[class*=react-tooltip__place-bottom]>.styles-module_arrow__K0L3T{transform:rotate(225deg)}[class*=react-tooltip__place-left]>.styles-module_arrow__K0L3T{transform:rotate(315deg)}.styles-module_dark__xNqje{background:var(--rt-color-dark);color:var(--rt-color-white)}.styles-module_light__Z6W-X{background-color:var(--rt-color-white);color:var(--rt-color-dark)}.styles-module_success__A2AKt{background-color:var(--rt-color-success);color:var(--rt-color-white)}.styles-module_warning__SCK0X{background-color:var(--rt-color-warning);color:var(--rt-color-white)}.styles-module_error__JvumD{background-color:var(--rt-color-error);color:var(--rt-color-white)}.styles-module_info__BWdHW{background-color:var(--rt-color-info);color:var(--rt-color-white)}:root{--blk-less-content-width: 240px;--blk-conditional-width: 340px;--blk-bg-start: linear-gradient(135deg, #d1fae5 0%, #a7f3d0 100%);--blk-bg-end: linear-gradient(135deg, #fee2e2 0%, #fecaca 100%);--blk-bg-if: linear-gradient(135deg, #ede9fe 0%, #ddd6fe 100%);--blk-bg-while: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);--blk-bg-input: linear-gradient(135deg, #fce7f3 0%, #fbcfe8 100%);--blk-bg-output: linear-gradient(135deg, #ffedd5 0%, #fed7aa 100%);--blk-bg-createVariable: linear-gradient(135deg, #e0e7ff 0%, #c7d2fe 100%);--blk-bg-updateVariable: linear-gradient(135deg, #cffafe 0%, #a5f3fc 100%);--blk-bg-move: linear-gradient(135deg, #dcfce7 0%, #bbf7d0 100%);--blk-bg-rotate: linear-gradient(135deg, #fef9c3 0%, #faf089 100%);--blk-bg-default: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);--blk-border: #cbd5e1;--blk-selected-bg: rgba(14, 165, 233, .15);--blk-selected-border: #0ea5e9;--blk-replacement-bg: #fef08a;--blk-handle-bg: #38bdf8;--blk-shadow: rgba(0, 0, 0, .08);--blk-shadow-hover: rgba(0, 0, 0, .15);--blk-transition-time: .3s;--blk-operand-width: 120px;--blk-operator-width: 70px;--blk-font-family: "Inter", -apple-system, BlinkMacSystemFont, sans-serif}.dark-mode{--blk-border: #475569;--blk-selected-bg: rgba(56, 189, 248, .2);--blk-selected-border: #38bdf8;--blk-handle-bg: #38bdf8;--blk-shadow: rgba(0, 0, 0, .3);--blk-shadow-hover: rgba(0, 0, 0, .5);--blk-bg-start: linear-gradient(135deg, #064e3b 0%, #065f46 100%);--blk-bg-end: linear-gradient(135deg, #7f1d1d 0%, #991b1b 100%);--blk-bg-if: linear-gradient(135deg, #4c1d95 0%, #5b21b6 100%);--blk-bg-while: linear-gradient(135deg, #78350f 0%, #92400e 100%);--blk-bg-input: linear-gradient(135deg, #831843 0%, #9d174d 100%);--blk-bg-output: linear-gradient(135deg, #9a3412 0%, #c2410c 100%);--blk-bg-createVariable: linear-gradient(135deg, #3730a3 0%, #4338ca 100%);--blk-bg-updateVariable: linear-gradient(135deg, #164e63 0%, #155e75 100%);--blk-bg-move: linear-gradient(135deg, #14532d 0%, #166534 100%);--blk-bg-rotate: linear-gradient(135deg, #713f12 0%, #854d0e 100%);--blk-bg-default: linear-gradient(135deg, #1e293b 0%, #0f172a 100%)}.block-container{width:var(--blk-less-content-width);padding:14px 18px;margin-bottom:14px;border:2px solid var(--blk-border);border-radius:16px;background:var(--blk-bg-default);box-shadow:0 4px 12px var(--blk-shadow),0 0 0 1px #00000005;transition:all var(--blk-transition-time) cubic-bezier(.4,0,.2,1);font-family:var(--blk-font-family);font-weight:600;text-align:center;position:relative;z-index:2;overflow:visible;display:flex;flex-direction:column;align-items:center}.block-container:hover{transform:translateY(-3px) scale(1.01);box-shadow:0 8px 24px var(--blk-shadow-hover),0 0 0 1px #0ea5e91a}.block-container.selected{box-shadow:0 12px 32px var(--blk-shadow-hover);position:relative}.block-container.selected:before{content:"";position:absolute;top:-3px;left:-3px;right:-3px;bottom:-3px;border-radius:inherit;pointer-events:none;background-image:linear-gradient(90deg,var(--blk-selected-border) 50%,transparent 50%),linear-gradient(90deg,var(--blk-selected-border) 50%,transparent 50%),linear-gradient(0deg,var(--blk-selected-border) 50%,transparent 50%),linear-gradient(0deg,var(--blk-selected-border) 50%,transparent 50%);background-repeat:repeat-x,repeat-x,repeat-y,repeat-y;background-size:16px 4px,16px 4px,4px 16px,4px 16px;background-position:left top,right bottom,left bottom,right top;animation:border-dance .5s infinite linear;opacity:.8}@keyframes border-dance{0%{background-position:0 0,0 0,0 0,0 0}to{background-position:10px 10px,10px 10px,10px 10px,10px 10px}}.block-container.start-block{background:var(--blk-bg-start);border-color:#10b981}.block-container.end-block{background:var(--blk-bg-end);border-color:#ef4444}.block-container.if-block{background:var(--blk-bg-if);border-color:#8b5cf6;width:var(--blk-conditional-width)}.block-container.whileStart-block{background:var(--blk-bg-while);border-color:#f59e0b;width:var(--blk-conditional-width)}.block-container.input-block{background:var(--blk-bg-input);border-color:#ec4899}.block-container.output-block{background:var(--blk-bg-output);border-color:#f97316}.block-container.createVariable-block{background:var(--blk-bg-createVariable);border-color:#6366f1}.block-container.updateVariable-block{background:var(--blk-bg-updateVariable);border-color:#06b6d4}.block-container.move-block{background:var(--blk-bg-move);border-color:#22c55e}.block-container.rotate-block{background:var(--blk-bg-rotate);border-color:#eab308}.dummy-block{min-height:36px;display:flex;justify-content:center;align-items:center;width:260px;border:2px dashed var(--blk-border);border-radius:16px;background:#f8fafc80}.dark-mode .dummy-block{background:#1e293b80}.join-block .block-header{display:flex;flex-direction:column;align-items:center}.dark-mode .block-container{color:#f1f5f9}.handle-target-circle,.handle-source-square{width:14px;height:14px;cursor:pointer;position:absolute;z-index:-1;transition:all var(--blk-transition-time);box-shadow:0 2px 6px #0003}.handle-target-circle{background:linear-gradient(135deg,#38bdf8,#0ea5e9);left:50%;top:0;transform:translate(-50%,-50%);border-radius:50%;border:2px solid white}.handle-target-circle:hover{transform:translate(-50%,-50%) scale(1.3);box-shadow:0 0 12px #38bdf899}.handle-source-square{background:linear-gradient(135deg,#38bdf8,#0ea5e9);left:50%;transform:translate(-50%);border-radius:4px;border:2px solid white}.handle-source-square:hover{transform:translate(-50%) scale(1.3);box-shadow:0 0 12px #38bdf899}.block-input{width:100%;margin-top:12px;padding:10px 14px;border-radius:10px;border:2px solid transparent;font-size:.9375rem;font-weight:500;box-sizing:border-box;transition:all var(--blk-transition-time);text-align:center;background:#ffffffb3;color:#1e293b}.dark-mode .block-input{background:#0000004d;color:#f1f5f9}.block-input:focus{outline:none;border-color:var(--blk-selected-border);background:#fffffff2;box-shadow:0 0 0 3px #0ea5e933}.block-input::placeholder{color:#94a3b8;font-style:italic}.dark-mode .block-input::placeholder{color:#64748b}.operand-input{width:var(--blk-operand-width);padding:8px 12px;border-radius:8px;border:2px solid transparent;box-sizing:border-box;font-size:.9375rem;font-weight:500;text-align:center;margin-right:0;background:#ffffffb3;color:#1e293b;transition:all var(--blk-transition-time)}.dark-mode .operand-input{background:#0000004d;color:#f1f5f9}.operand-input:focus{outline:none;border-color:var(--blk-selected-border);background:#fffffff2;box-shadow:0 0 0 3px #0ea5e933}.operator-select{width:var(--blk-operator-width);padding:8px 12px;border-radius:8px;border:2px solid transparent;box-sizing:border-box;font-size:.9375rem;font-weight:500;text-align:center;margin-right:0;background:#ffffffb3;color:#1e293b;cursor:pointer;transition:all var(--blk-transition-time)}.dark-mode .operator-select{background:#0000004d;color:#f1f5f9}.operator-select:focus{outline:none;border-color:var(--blk-selected-border)}.operator-input-wrapper{display:flex;align-items:center;justify-content:center;margin-top:12px;gap:8px}.operator-input-wrapper select,.operator-input-wrapper input{display:inline-block;vertical-align:middle;padding:10px 14px;font-size:.9375rem;font-weight:500;line-height:1.3;border-radius:10px;border:2px solid transparent;box-sizing:border-box;text-align:center;margin-top:0;background:#ffffffb3;color:#1e293b;transition:all var(--blk-transition-time)}.dark-mode .operator-input-wrapper select,.dark-mode .operator-input-wrapper input{background:#0000004d;color:#f1f5f9}.operator-input-wrapper select{width:var(--blk-operator-width)}.operator-input-wrapper select:focus,.operator-input-wrapper input:focus{outline:none;border-color:var(--blk-selected-border);box-shadow:0 0 0 3px #0ea5e933}.operator-input-wrapper .block-input{width:100%}.createVariable-input-wrapper{display:grid;grid-template-columns:auto minmax(0,1fr) auto minmax(0,1fr);align-items:center;width:100%;margin-top:12px;gap:8px}.createVariable-input-wrapper .set-label,.createVariable-input-wrapper .to-label{font-weight:700;white-space:nowrap;color:#1e293b;font-size:.9rem}.dark-mode .createVariable-input-wrapper .set-label,.dark-mode .createVariable-input-wrapper .to-label{color:#f1f5f9}.createVariable-input-wrapper .operand-input{width:100%;min-width:0}@media(max-width:520px){.createVariable-input-wrapper{grid-template-columns:auto minmax(100px,1fr)}}.condition-container{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;width:100%;margin-top:12px;gap:6px}.condition-container .operand-input{width:100%;min-width:0}.condition-container .operator-select{width:auto;min-width:58px}.help-button{position:absolute;top:6px;left:4px;background:#fffc;border:none;cursor:pointer;font-size:16px;width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:all var(--blk-transition-time);color:#64748b}.dark-mode .help-button{background:#0000004d;color:#94a3b8}.help-button:hover{animation:helpBounce .6s ease forwards;background:var(--blk-selected-border);color:#fff;transform:scale(1.1)}@keyframes helpBounce{0%{transform:translateY(0) scale(1)}25%{transform:translateY(-4px) scale(1.1)}50%{transform:translateY(0) scale(1)}75%{transform:translateY(-2px) scale(1.05)}to{transform:translateY(0)}}.block-icon{margin-bottom:8px;display:flex;align-items:center;justify-content:center}.block-icon svg{width:24px;height:24px}.toggle-type-button{position:absolute;top:6px;right:6px;background:#fffc;border:2px solid #cbd5e1;border-radius:8px;padding:4px 8px;cursor:pointer;font-size:12px;font-weight:600;transition:all var(--blk-transition-time);color:#64748b}.dark-mode .toggle-type-button{background:#0000004d;border-color:#475569;color:#94a3b8}.toggle-type-button:hover{background:var(--blk-selected-border);border-color:var(--blk-selected-border);color:#fff;transform:scale(1.05)}.block-container.executing{animation:blockPulse .6s ease-out}@keyframes blockPulse{0%{transform:scale(1);box-shadow:0 0 #0ea5e999}50%{transform:scale(1.05);box-shadow:0 0 20px 8px #0ea5e966}to{transform:scale(1);box-shadow:0 0 #0ea5e900}}.react-flow__edges{z-index:1000}@keyframes pulse{0%{box-shadow:0 0 #10b98199}70%{box-shadow:0 0 0 12px #10b98100}to{box-shadow:0 0 #10b98100}}.dummy-replaceable{animation:pulse 2s infinite;border-color:#10b981}.dummy-fixed{border:2px solid var(--blk-selected-border);animation:none}@keyframes flash{0%{background-color:transparent;transform:scale(1)}50%{background-color:var(--blk-replacement-bg);transform:scale(1.15)}to{background-color:transparent;transform:scale(1)}}.replacement-success{animation:flash .8s ease-out forwards;transform-origin:center center}@media(max-width:640px){.block-container{width:200px;padding:12px 14px}.block-container.if-block,.block-container.whileStart-block{width:260px}.operand-input{width:90px}.operator-select{width:60px}}.custom-block-wrapper{position:relative}.custom-block-wrapper.error-highlight:before{content:"";position:absolute;top:-5px;left:-5px;right:-5px;bottom:-5px;border-radius:18px;pointer-events:none;background-image:linear-gradient(90deg,#ef4444 50%,transparent 50%),linear-gradient(90deg,#ef4444 50%,transparent 50%),linear-gradient(0deg,#ef4444 50%,transparent 50%),linear-gradient(0deg,#ef4444 50%,transparent 50%);background-repeat:repeat-x,repeat-x,repeat-y,repeat-y;background-size:16px 3px,16px 3px,3px 16px,3px 16px;background-position:left top,right bottom,left bottom,right top;animation:border-dance .4s infinite linear;z-index:100}@keyframes border-dance{0%{background-position:left top,right bottom,left bottom,right top}to{background-position:left 16px top,right 16px bottom,left bottom 16px,right top 16px}}.error-snackbar{position:absolute;bottom:-36px;left:50%;transform:translate(-50%);background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;padding:8px 16px;border-radius:10px;font-size:.8125rem;font-weight:600;white-space:nowrap;z-index:10;box-shadow:0 4px 12px #ef444466;animation:errorSlideIn .3s ease-out}@keyframes errorSlideIn{0%{opacity:0;transform:translate(-50%) translateY(8px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.dark-mode .custom-block-wrapper.error-highlight:before{background-image:linear-gradient(90deg,#f87171 50%,transparent 50%),linear-gradient(90deg,#f87171 50%,transparent 50%),linear-gradient(0deg,#f87171 50%,transparent 50%),linear-gradient(0deg,#f87171 50%,transparent 50%)}.dark-mode .error-snackbar{background:linear-gradient(135deg,#f87171,#ef4444)}.react-flow__edge-path{transition:stroke .3s ease,stroke-width .3s ease}.react-flow__edge-path:hover{stroke:#0ea5e9;stroke-width:3.5}.react-flow__edge-path.selected{stroke:#8b5cf6!important;stroke-width:4!important;stroke-dasharray:8 8;animation:edge-dash 1s linear infinite}.react-flow__edge-path.executing{animation:edge-pulse .6s ease-in-out infinite;stroke:#10b981;stroke-width:4}.react-flow__edge{transition:opacity .3s ease}.react-flow__edge:hover{opacity:1}.dark-mode .react-flow__edge-path{stroke:#64748b}.dark-mode .react-flow__edge-path:hover{stroke:#38bdf8}.dark-mode .react-flow__edge-path.selected{stroke:#a78bfa!important}.dark-mode .react-flow__edge-path.executing{stroke:#34d399}@keyframes edge-dash{0%{stroke-dashoffset:16}to{stroke-dashoffset:0}}@keyframes edge-pulse{0%{stroke-width:3;opacity:1}50%{stroke-width:6;opacity:.5}to{stroke-width:3;opacity:1}}.edge-label{fill:#64748b;font-family:Inter,sans-serif;font-size:12px;font-weight:600}.edge-label-loop{fill:#a855f7;font-family:Inter,sans-serif;font-size:12px;font-weight:700}.edge-label-true{fill:#10b981;font-family:Inter,sans-serif;font-size:12px;font-weight:700}.edge-label-false{fill:#ef4444;font-family:Inter,sans-serif;font-size:12px;font-weight:700}.dark-mode .edge-label{fill:#94a3b8}.dark-mode .edge-label-loop{fill:#c084fc}.dark-mode .edge-label-true{fill:#34d399}.dark-mode .edge-label-false{fill:#f87171}.react-flow__handle{width:12px;height:12px;background:linear-gradient(135deg,#38bdf8,#0ea5e9);border:2px solid white;box-shadow:0 2px 6px #0003}.react-flow__handle:hover{transform:scale(1.3);box-shadow:0 0 10px #38bdf880}.dark-mode .react-flow__handle{background:linear-gradient(135deg,#38bdf8,#0ea5e9);border-color:#1e293b}.react-flow__edge-path.react-flow__edge-path-smoothstep{stroke-linejoin:round}.react-flow__edge-path.react-flow__edge-path-bezier{stroke-linecap:round}.palette-overlay{position:absolute;z-index:1000;background:linear-gradient(180deg,#fffffff2,#f8fafcf2);box-shadow:0 20px 40px #0003,0 0 0 1px #0000000d;border-radius:20px;padding:16px;max-height:70vh;border:1px solid rgba(14,165,233,.2);overflow-y:auto;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);animation:overlay-slide-in .3s ease-out}@keyframes overlay-slide-in{0%{opacity:0;transform:scale(.95) translateY(-10px)}to{opacity:1;transform:scale(1) translateY(0)}}.close-button{display:flex;align-items:center;justify-content:center;margin:0 auto 12px;width:36px;height:36px;font-size:18px;background:linear-gradient(135deg,#f1f5f9,#e2e8f0);border:none;border-radius:10px;cursor:pointer;color:#64748b;transition:all .2s ease}.close-button:hover{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;transform:scale(1.05)}.palette-overlay .aside-container{width:280px!important;max-width:280px!important;border:none;box-shadow:none;background:transparent}.palette-overlay .aside-container.collapsed{width:80px!important;max-width:80px!important}.dark-mode .palette-overlay{background:linear-gradient(180deg,#1e293bf2,#0f172af2);border-color:#38bdf833;box-shadow:0 20px 40px #00000080,0 0 0 1px #ffffff0d}.dark-mode .palette-overlay .close-button{background:linear-gradient(135deg,#334155,#1e293b);color:#94a3b8}.dark-mode .palette-overlay .close-button:hover{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff}.dark-mode .palette-overlay .aside-container{background-color:transparent;border:none}.dark-mode .palette-overlay .aside-container .collapse-button{background:linear-gradient(135deg,#334155,#1e293b);color:#e2e8f0;border-color:#475569}.dark-mode .palette-overlay .dndblock{background:linear-gradient(135deg,#1e293b,#0f172a);border-color:#334155}.dark-mode .palette-overlay .dndblock span{color:#e2e8f0}.palette-overlay-header{display:flex;justify-content:space-between;align-items:center;padding:8px;cursor:move;margin-bottom:8px;border-bottom:1px solid rgba(0,0,0,.08)}.dark-mode .palette-overlay-header{border-color:#ffffff14}@media(max-width:640px){.palette-overlay{width:90%!important;max-width:320px!important;left:5%!important;right:5%!important;border-radius:16px;padding:12px}.palette-overlay .aside-container{width:100%!important;max-width:100%!important}}.input-modal-body{display:flex;flex-direction:column;gap:1rem;align-items:center;margin-bottom:1.5rem}.input-modal-prompt{margin:0;font-size:1.25rem;font-weight:600;color:#1e293b;text-align:center;padding-bottom:1rem}.dark-mode .input-modal-prompt{color:#f1f5f9}.input-modal-input{padding:14px 20px;font-size:1rem;border-radius:12px;border:2px solid #e2e8f0;background:#fff;color:#1e293b;width:100%;max-width:320px;transition:all .2s ease;text-align:center}.input-modal-input:focus{outline:none;border-color:#0ea5e9;box-shadow:0 0 0 3px #0ea5e933}.input-modal-input::placeholder{color:#94a3b8}.dark-mode .input-modal-input{background:#1e293b;border-color:#334155;color:#f1f5f9}.dark-mode .input-modal-input:focus{border-color:#38bdf8;box-shadow:0 0 0 3px #38bdf833}.input-modal-footer{display:flex;justify-content:center;align-items:center;gap:16px;padding:1rem}.input-modal-footer .submit-btn{display:inline-flex;align-items:center;justify-content:center;margin-top:1rem;padding:14px 28px;font-size:1rem;font-weight:600;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;border:none;border-radius:12px;cursor:pointer;transition:all .2s ease;background:linear-gradient(135deg,#0ea5e9,#0284c7);color:#fff;box-shadow:0 4px 12px #0ea5e94d}.input-modal-footer .submit-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #0ea5e966;background:linear-gradient(135deg,#0284c7,#0369a1)}.input-modal-footer .submit-btn:active{transform:translateY(0)}.input-modal-footer .cancel-btn{display:inline-flex;align-items:center;justify-content:center;margin-top:1rem;padding:14px 28px;font-size:1rem;font-weight:600;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;border:2px solid #e2e8f0;border-radius:12px;cursor:pointer;transition:all .2s ease;background:transparent;color:#64748b}.input-modal-footer .cancel-btn:hover{background:#f1f5f9;border-color:#cbd5e1;color:#475569}.dark-mode .input-modal-footer .cancel-btn{border-color:#334155;color:#94a3b8}.dark-mode .input-modal-footer .cancel-btn:hover{background:#334155;border-color:#475569;color:#e2e8f0}@media(max-width:640px){.input-modal-prompt{font-size:1.125rem}.input-modal-input{padding:12px 16px;font-size:.9375rem}.input-modal-footer .submit-btn,.input-modal-footer .cancel-btn{padding:12px 20px;font-size:.9375rem}}.help-modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#0f172ab3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:1200;animation:fade-in .2s ease-out}.flowchart-container .react-flow__renderer{background:radial-gradient(circle at 20% 15%,rgba(14,165,233,.08) 0%,transparent 35%),radial-gradient(circle at 80% 80%,rgba(139,92,246,.07) 0%,transparent 35%)}.dark-mode .flowchart-container .react-flow__renderer{background:radial-gradient(circle at 20% 15%,rgba(56,189,248,.08) 0%,transparent 35%),radial-gradient(circle at 80% 80%,rgba(167,139,250,.09) 0%,transparent 35%)}.flowchart-container .react-flow__controls{background:#ffffffeb;border-radius:14px;border:1px solid rgba(148,163,184,.35);box-shadow:0 10px 24px #0f172a26;overflow:hidden}.flowchart-container .react-flow__controls-button{border:none;background:transparent;color:#334155}.flowchart-container .react-flow__controls-button:hover{background:#0ea5e924}.dark-mode .flowchart-container .react-flow__controls{background:#0f172ae6;border-color:#334155cc;box-shadow:0 10px 24px #02061773}.dark-mode .flowchart-container .react-flow__controls-button{color:#f1f5f9}.dark-mode .flowchart-container .react-flow__controls-button svg{fill:currentColor}.dark-mode .flowchart-container .react-flow__controls-button:hover{background:#38bdf829}.dark-mode .flowchart-container .react-flow__controls-button:disabled{color:#475569}.flowchart-container .react-flow__minimap{border-radius:14px;overflow:hidden;border:1px solid rgba(148,163,184,.4);box-shadow:0 10px 24px #0f172a33}.proximity-temp-edge path{stroke-dasharray:6 6;animation:proximity-dash .5s linear infinite;stroke-width:2.5}.proximity-edge path{stroke:#0ea5e9;stroke-width:2.5}.dark-mode .proximity-edge path{stroke:#38bdf8}@keyframes proximity-dash{to{stroke-dashoffset:-12}}.help-modal-content{background:linear-gradient(180deg,#fff,#f8fafc);padding:2rem;border-radius:24px;max-width:440px;width:90%;text-align:center;animation:modal-slide-in .3s ease-out;box-shadow:0 25px 50px -12px #00000059,0 0 0 1px #0ea5e91a;border:1px solid rgba(14,165,233,.2)}.help-modal-content h3{margin-top:0;font-size:1.5rem;font-weight:700;color:#1e293b;margin-bottom:1rem}.help-modal-content p{font-size:1rem;color:#64748b;margin:1rem 0;line-height:1.7}.help-modal-close{background:linear-gradient(135deg,#0ea5e9,#0284c7);color:#fff;border:none;padding:12px 28px;border-radius:12px;cursor:pointer;font-size:1rem;font-weight:600;transition:all .2s ease;box-shadow:0 4px 12px #0ea5e94d}.help-modal-close:hover{transform:translateY(-2px);box-shadow:0 6px 20px #0ea5e966}.help-modal-close:active{transform:translateY(0)}.canvas-container{width:100%;height:100%;position:relative;background:radial-gradient(circle at 50% 50%,rgba(14,165,233,.03) 0%,transparent 50%),linear-gradient(90deg,rgba(0,0,0,.02) 1px,transparent 1px),linear-gradient(rgba(0,0,0,.02) 1px,transparent 1px);background-size:100% 100%,24px 24px,24px 24px}.dark-mode .canvas-container{background:radial-gradient(circle at 50% 50%,rgba(14,165,233,.05) 0%,transparent 50%),linear-gradient(90deg,rgba(255,255,255,.02) 1px,transparent 1px),linear-gradient(rgba(255,255,255,.02) 1px,transparent 1px);background-size:100% 100%,24px 24px,24px 24px}.canvas-toolbar{position:sticky;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 16px;background:#ffffffeb;border-bottom:1px solid rgba(148,163,184,.4);box-shadow:0 6px 18px #0f172a14;z-index:20;pointer-events:none}.canvas-toolbar>*{pointer-events:auto}.toolbar-group{display:flex;gap:8px}.toolbar-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:auto;min-width:40px;height:40px;border:none;border-radius:12px;background:linear-gradient(180deg,#fff,#f8fafc);color:#64748b;cursor:pointer;transition:all .2s ease;box-shadow:0 2px 8px #00000014,0 0 0 1px #0000000d;position:relative;padding:0 12px}.toolbar-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001f,0 0 0 1px #0ea5e933;color:#0ea5e9}.toolbar-btn.primary{background:linear-gradient(135deg,#10b981,#059669);color:#fff;box-shadow:0 6px 16px #10b98159}.toolbar-btn.primary:hover{background:linear-gradient(135deg,#059669,#047857);color:#fff;box-shadow:0 8px 20px #10b98173}.toolbar-btn.danger{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;box-shadow:0 6px 16px #ef444459}.toolbar-btn.danger:hover{background:linear-gradient(135deg,#dc2626,#b91c1c);color:#fff;box-shadow:0 8px 20px #ef444473}.toolbar-label{font-size:.78rem;font-weight:700;letter-spacing:.01em}.toolbar-btn:after{content:attr(data-tooltip);position:absolute;left:50%;bottom:-34px;transform:translate(-50%);background:#0f172aeb;color:#e2e8f0;font-size:.7rem;font-weight:700;padding:4px 8px;border-radius:8px;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .15s ease,transform .15s ease;transform-origin:top center}.toolbar-btn:hover:after{opacity:1;transform:translate(-50%) translateY(2px)}.dark-mode .toolbar-btn:after{background:#020617f2;color:#e2e8f0}.toolbar-btn:active{transform:translateY(0)}.toolbar-btn.active{background:linear-gradient(135deg,#0ea5e9,#0284c7);color:#fff;box-shadow:0 4px 12px #0ea5e966}.dark-mode .toolbar-btn{background:linear-gradient(180deg,#334155,#1e293b);color:#94a3b8;box-shadow:0 2px 8px #0000004d,0 0 0 1px #ffffff0d}.dark-mode .toolbar-btn.primary{background:linear-gradient(135deg,#10b981,#059669);color:#fff;box-shadow:0 6px 16px #10b98159}.dark-mode .toolbar-btn.primary:hover{background:linear-gradient(135deg,#059669,#047857);color:#fff;box-shadow:0 8px 20px #10b98173}.dark-mode .toolbar-btn.danger{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;box-shadow:0 6px 16px #ef444459}.dark-mode .toolbar-btn.danger:hover{background:linear-gradient(135deg,#dc2626,#b91c1c);color:#fff;box-shadow:0 8px 20px #ef444473}.dark-mode .canvas-toolbar{background:#0f172aeb;border-bottom-color:#334155b3;box-shadow:0 6px 18px #02061766}.dark-mode .toolbar-btn:hover{color:#38bdf8;box-shadow:0 4px 12px #0006,0 0 0 1px #38bdf833}.zoom-controls{position:absolute;bottom:24px;left:24px;display:flex;flex-direction:column;gap:4px;background:linear-gradient(180deg,#fff,#f8fafc);padding:8px;border-radius:16px;box-shadow:0 4px 16px #0000001a,0 0 0 1px #0000000d;z-index:10}.dark-mode .zoom-controls{background:linear-gradient(180deg,#334155,#1e293b);box-shadow:0 4px 16px #0006,0 0 0 1px #ffffff0d}.zoom-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border:none;border-radius:10px;background:transparent;color:#64748b;cursor:pointer;transition:all .15s ease}.zoom-btn:hover{background:#0ea5e91a;color:#0ea5e9}.zoom-btn:active{transform:scale(.95)}.zoom-level{text-align:center;font-size:.75rem;font-weight:600;color:#94a3b8;padding:4px 0;border-top:1px solid rgba(0,0,0,.05);border-bottom:1px solid rgba(0,0,0,.05);margin:4px 0}.dark-mode .zoom-level{color:#64748b;border-color:#ffffff0d}.minimap-container{position:absolute;bottom:24px;right:24px;border-radius:16px;overflow:hidden;box-shadow:0 4px 16px #00000026;border:2px solid rgba(255,255,255,.1);z-index:10}.selection-box{position:absolute;border:2px dashed rgba(14,165,233,.5);background:#0ea5e91a;border-radius:8px;pointer-events:none;z-index:100}.node-context-menu{position:fixed;z-index:1300;min-width:160px;padding:6px;border-radius:10px;border:1px solid rgba(148,163,184,.45);background:#fffffff5;box-shadow:0 10px 24px #0f172a33;display:flex;flex-direction:column;gap:4px}.node-context-menu button{border:none;background:transparent;color:#334155;font-size:.875rem;font-weight:600;text-align:left;border-radius:8px;padding:8px 10px;cursor:pointer}.node-context-menu button:hover:not(:disabled){background:#0ea5e91f}.node-context-menu button:disabled{opacity:.55;cursor:not-allowed}.node-context-menu button.danger{color:#dc2626}.node-context-menu button.danger:hover{background:#ef44441f}.dark-mode .node-context-menu{background:#0f172af7;border-color:#475569e6;box-shadow:0 10px 24px #02061773}.dark-mode .node-context-menu button{color:#e2e8f0}.dark-mode .node-context-menu button:hover:not(:disabled){background:#38bdf829}.dark-mode .node-context-menu button.danger{color:#f87171}.dark-mode .node-context-menu button.danger:hover{background:#f8717129}.canvas-edge{stroke:#94a3b8;stroke-width:2;transition:stroke .2s ease,stroke-width .2s ease}.canvas-edge:hover{stroke:#0ea5e9;stroke-width:3}.canvas-edge.selected{stroke:#8b5cf6;stroke-width:3}.dark-mode .canvas-edge{stroke:#64748b}.dark-mode .canvas-edge:hover{stroke:#38bdf8}.dark-mode .canvas-edge.selected{stroke:#a78bfa}.handle{width:12px;height:12px;border-radius:50%;background:linear-gradient(135deg,#fff,#e2e8f0);border:2px solid #94a3b8;transition:all .15s ease;box-shadow:0 2px 4px #0000001a}.handle:hover{transform:scale(1.3);border-color:#0ea5e9;box-shadow:0 0 8px #0ea5e966}.handle.connecting{background:linear-gradient(135deg,#0ea5e9,#0284c7);border-color:#0ea5e9;animation:pulse 1s infinite}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.2)}}.dark-mode .handle{background:linear-gradient(135deg,#475569,#334155);border-color:#64748b}.dark-mode .handle:hover{border-color:#38bdf8}.dragging-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#0ea5e90d;z-index:1000;pointer-events:none;display:flex;align-items:center;justify-content:center}.dragging-indicator{display:flex;align-items:center;gap:12px;padding:16px 24px;background:linear-gradient(180deg,#fff,#f8fafc);border-radius:16px;box-shadow:0 8px 32px #00000026;animation:float 2s ease-in-out infinite}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.dragging-indicator-text{font-size:1rem;font-weight:600;color:#1e293b}.dark-mode .dragging-overlay{background:#0ea5e91a}.dark-mode .dragging-indicator{background:linear-gradient(180deg,#334155,#1e293b)}.dark-mode .dragging-indicator-text{color:#f1f5f9}.empty-canvas{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;pointer-events:none;z-index:1}.empty-canvas-icon{width:80px;height:80px;margin:0 auto 24px;color:#cbd5e1;opacity:.6}.empty-canvas-title{font-size:1.5rem;font-weight:700;color:#64748b;margin-bottom:8px}.empty-canvas-description{font-size:1rem;color:#94a3b8;max-width:320px;line-height:1.6}.dark-mode .empty-canvas-icon{color:#475569}.dark-mode .empty-canvas-title{color:#94a3b8}.dark-mode .empty-canvas-description{color:#64748b}.executing-node{animation:node-highlight .6s ease-out}@keyframes node-highlight{0%{transform:scale(1);box-shadow:0 0 #0ea5e980}50%{transform:scale(1.02);box-shadow:0 0 20px 5px #0ea5e966}to{transform:scale(1);box-shadow:0 0 #0ea5e900}}.context-menu{position:absolute;background:linear-gradient(180deg,#fff,#f8fafc);border:1px solid #e2e8f0;border-radius:12px;padding:8px;box-shadow:0 8px 24px #00000026;z-index:1100;min-width:180px;animation:context-menu-fade-in .15s ease-out}@keyframes context-menu-fade-in{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.context-menu-item{display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:8px;cursor:pointer;transition:all .15s ease;color:#1e293b;font-size:.9375rem;font-weight:500}.context-menu-item:hover{background:#0ea5e91a;color:#0ea5e9}.context-menu-item.danger:hover{background:#ef44441a;color:#ef4444}.context-menu-divider{height:1px;background:#e2e8f0;margin:8px 0}.dark-mode .context-menu{background:linear-gradient(180deg,#334155,#1e293b);border-color:#475569}.dark-mode .context-menu-item{color:#f1f5f9}.dark-mode .context-menu-item:hover{background:#38bdf826;color:#38bdf8}.dark-mode .context-menu-divider{background:#475569}@media(max-width:768px){.canvas-toolbar{top:12px;left:12px;right:12px}.toolbar-btn{width:36px;height:36px;padding:0 10px}.toolbar-label{display:none}.zoom-controls{bottom:16px;left:16px}.minimap-container{bottom:16px;right:16px}.help-modal-content{padding:1.5rem;border-radius:20px}}.navbar,.modal-backdrop,.modal-content,.signin-dropdown,.user-dropdown,.darkmode-btn-custom{--brand-gradient: linear-gradient(135deg, #0ea5e9 0%, #8b5cf6 50%, #ec4899 100%);--brand-primary: #0ea5e9;--brand-secondary: #8b5cf6;--brand-accent: #ec4899;--navbar-bg: linear-gradient(180deg, rgba(15, 23, 42, .98) 0%, rgba(30, 41, 59, .98) 100%);--navbar-surface: rgba(51, 65, 85, .6);--text-primary: #f8fafc;--text-secondary: #94a3b8;--text-muted: #64748b;--hover-bg: rgba(255, 255, 255, .1);--hover-border: rgba(14, 165, 233, .5);--active-bg: rgba(14, 165, 233, .2);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .3);--shadow-glow: 0 0 20px rgba(14, 165, 233, .3);--navbar-height: 70px;--navbar-padding: 1.5rem;--font-primary: "Inter", -apple-system, BlinkMacSystemFont, sans-serif;--font-brand: "Outfit", sans-serif}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.625rem 1.25rem;font-size:.9375rem;font-weight:600;line-height:1;border:none;border-radius:12px;cursor:pointer;transition:all var(--transition-base);outline:none;white-space:nowrap;text-decoration:none}.btn svg,.modal-btn svg,.navbar-menu-item svg,.signin-dropdown-item svg,.dropdown-item svg,.account-settings-title svg{display:inline-block;vertical-align:middle;width:1.125em;height:1.125em}.navbar{background:var(--navbar-bg);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);padding:0 var(--navbar-padding);display:flex;align-items:center;justify-content:space-between;box-shadow:var(--shadow-lg),0 0 0 1px #ffffff0d;position:relative;z-index:100;min-height:var(--navbar-height)}.navbar-container{display:flex;justify-content:space-between;align-items:center;width:100%;max-width:1600px;margin:0 auto}.navbar-brand{display:flex;align-items:center;gap:.75rem;text-decoration:none;color:var(--text-primary);transition:transform var(--transition-base)}.navbar-brand:hover{transform:scale(1.02)}.navbar-logo{height:42px;width:auto;filter:drop-shadow(0 2px 4px rgba(0,0,0,.3))}.navbar-title{font-family:var(--font-brand);font-size:1.625rem;font-weight:700;background:var(--brand-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.5px}.navbar-menu{position:absolute;left:50%;transform:translate(-50%)}.navbar-menu-list{list-style:none;display:flex;gap:.5rem;align-items:center}.navbar-menu-item{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;background:transparent;border:1px solid transparent;padding:.625rem 1rem;font-size:.9375rem;font-weight:500;font-family:var(--font-primary);color:var(--text-secondary);cursor:pointer;border-radius:10px;transition:all var(--transition-base);position:relative;overflow:hidden}.navbar-menu-item:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:var(--brand-gradient);opacity:0;transition:opacity var(--transition-base)}.navbar-menu-item:hover,.navbar-menu-item:focus{color:var(--text-primary);background:var(--hover-bg);border-color:var(--hover-border);transform:translateY(-2px);box-shadow:0 4px 12px #0ea5e940;outline:none}.navbar-menu-item:hover:before,.navbar-menu-item:focus:before{opacity:.1}.navbar-menu-item.active{color:var(--text-primary);background:var(--active-bg);border-color:var(--brand-primary)}.navbar-auth{display:flex;align-items:center;gap:1rem}.user-avatar{width:42px;height:42px;border-radius:12px;object-fit:cover;transition:all var(--transition-base);cursor:pointer;border:2px solid transparent;background:var(--brand-gradient);padding:2px}.user-avatar:hover,.user-avatar:focus{transform:translateY(-3px) scale(1.05);box-shadow:var(--shadow-glow);border-color:var(--brand-primary);outline:none}.signin-btn{background:var(--brand-gradient);color:#fff;border:1px solid transparent}.signin-btn:hover,.signin-btn:focus{color:#fff;transform:translateY(-2px);box-shadow:var(--shadow-glow);outline:none}.signin-btn svg{color:#fff}.signin-dropdown,.user-dropdown{position:absolute;top:calc(100% + 8px);right:0;background:linear-gradient(180deg,#1e293b,#0f172a);border:1px solid rgba(255,255,255,.1);border-radius:16px;box-shadow:var(--shadow-lg),0 0 40px #0ea5e926;z-index:1000;min-width:220px;overflow:hidden;animation:dropdownFadeIn .2s ease-out}@keyframes dropdownFadeIn{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.signin-dropdown-item,.dropdown-item{display:flex;align-items:center;gap:.75rem;width:100%;padding:.875rem 1.25rem;text-align:left;background:transparent;border:none;cursor:pointer;transition:all var(--transition-fast);color:#e2e8f0;font-size:.9375rem;font-weight:500}.signin-dropdown-item:hover,.signin-dropdown-item:focus,.dropdown-item:hover,.dropdown-item:focus{background:linear-gradient(90deg,rgba(14,165,233,.2) 0%,transparent 100%);color:var(--brand-primary);transform:translate(4px);outline:none}.dropdown-header{padding:1rem 1.25rem;border-bottom:1px solid rgba(255,255,255,.1);font-size:.875rem;color:var(--text-muted)}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;justify-content:center;align-items:center;z-index:1100;animation:backdropFadeIn .2s ease-out}@keyframes backdropFadeIn{0%{opacity:0}to{opacity:1}}.modal-content{background:linear-gradient(180deg,#1e293b,#0f172a);padding:2rem;border-radius:24px;max-width:480px;width:90%;box-shadow:0 25px 50px -12px #00000080,0 0 0 1px #ffffff1a;text-align:center;color:#f8fafc;animation:modal-slide-in .3s ease-out}@keyframes modal-slide-in{0%{opacity:0;transform:scale(.95) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}.modal-title{font-size:1.5rem;font-weight:700;color:#f8fafc;margin-bottom:1.5rem}.modal-subtitle{margin:.75rem 0 1rem;font-size:1rem;font-weight:700;color:#e2e8f0;letter-spacing:.4px}.modal-section{display:flex;justify-content:center;margin-bottom:1rem}.modal-input{width:100%;max-width:360px;padding:14px 18px;margin:0 auto 1rem;border:1px solid rgba(255,255,255,.15);border-radius:12px;font-size:1rem;box-sizing:border-box;display:block;background:#ffffff0d;color:#fff;transition:all var(--transition-base);text-align:center}.modal-input:focus{outline:none;border-color:var(--brand-primary);box-shadow:0 0 0 3px #0ea5e933,var(--shadow-glow)}.modal-input::placeholder{color:#cbd5e1}.modal-btn{padding:14px 28px;border:none;border-radius:12px;font-size:1rem;font-weight:600;cursor:pointer;text-transform:none;vertical-align:middle;transition:all var(--transition-base);box-shadow:var(--shadow-lg);margin:.5rem}.modal-button-group.save-button-group{flex-direction:column;align-items:stretch;justify-content:flex-start;gap:.85rem}.modal-button-group.save-button-group .modal-btn{max-width:360px}.modal-button-group.signin-button-group{flex-direction:column;align-items:stretch;justify-content:flex-start;gap:.85rem}.modal-button-group.signin-button-group .modal-btn{width:100%;max-width:360px}.file-btn,.import-btn,.load-example-btn{background:linear-gradient(135deg,#0ea5e9,#0284c7);color:#fff}.account-btn{background:linear-gradient(135deg,#8b5cf6,#7c3aed);color:#fff}.image-btn{background:linear-gradient(135deg,#ec4899,#db2777);color:#fff}.cancel-btn{background:linear-gradient(135deg,#475569,#334155);color:#f8fafc;border:1px solid rgba(255,255,255,.2)}.file-btn:hover,.import-btn:hover,.load-example-btn:hover,.account-btn:hover,.image-btn:hover,.cancel-btn:hover{transform:translateY(-2px);filter:brightness(1.08)}.signin-btn-custom{background:var(--brand-gradient);color:#fff}.signin-btn-custom:hover,.signin-btn-custom:focus{transform:translateY(-3px) scale(1.02);box-shadow:var(--shadow-glow)}.forgot-btn{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff}.forgot-btn:hover,.forgot-btn:focus{transform:translateY(-3px);box-shadow:0 0 20px #f59e0b66}.newuser-btn{background:linear-gradient(135deg,#8b5cf6,#7c3aed);color:#fff}.newuser-btn:hover,.newuser-btn:focus{transform:translateY(-3px);box-shadow:0 0 20px #8b5cf666}.delete-btn{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;border:none;border-radius:12px;padding:14px 28px;font-size:1rem;font-weight:600;cursor:pointer;transition:all var(--transition-base)}.delete-btn:hover,.delete-btn:focus{transform:translateY(-3px);box-shadow:0 0 20px #ef444466;outline:none}.project-list{list-style:none;padding:0;margin:0;max-height:320px;overflow-y:auto}.project-list-item{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.25rem;border-bottom:1px solid rgba(255,255,255,.08);transition:background var(--transition-fast)}.project-list-item:hover{background:#ffffff0d}.project-actions{display:flex;gap:.5rem}.project-load-btn{background:linear-gradient(135deg,#0ea5e9,#0284c7);color:#fff;padding:8px 16px;border-radius:8px;font-weight:600;font-size:.875rem;transition:all var(--transition-base)}.project-load-btn:hover,.project-load-btn:focus{transform:translateY(-2px);box-shadow:0 0 15px #0ea5e966}.project-delete-btn{background:linear-gradient(135deg,#64748b,#475569);color:#fff;padding:8px 16px;border-radius:8px;font-weight:600;font-size:.875rem;transition:all var(--transition-base)}.project-delete-btn:hover,.project-delete-btn:focus{background:linear-gradient(135deg,#ef4444,#dc2626);transform:translateY(-2px)}.no-projects{color:#cbd5e1;text-align:center;padding:2rem}.project-list-item>span{color:#e2e8f0;font-weight:600}.example-list{list-style:none;padding:0;margin:0 auto;text-align:center;max-width:560px}.example-list-item{margin:1.25rem auto;padding:1.25rem;border-bottom:1px solid rgba(255,255,255,.08);border-radius:12px;transition:all var(--transition-base)}.example-list-item:hover{background:#ffffff0d;transform:translate(4px)}.example-list-item h4{margin-bottom:.5rem;color:#f8fafc}.example-list-item p{margin-bottom:.75rem;color:#cbd5e1;font-size:.9375rem}.hint-modal .modal-content{max-width:560px}.hint-list{list-style:none;padding:0;text-align:left}.hint-list li{margin-bottom:1rem;color:#e2e8f0;padding-left:1.5rem;position:relative}.hint-list li:before{content:"→";position:absolute;left:0;color:var(--brand-primary)}.settings-section{display:flex;flex-direction:column;align-items:center;margin-bottom:1.5rem;padding:1rem;background:#ffffff08;border-radius:12px}.delete-account-title,.theme-title{margin-top:1rem;margin-bottom:1rem;font-size:1.125rem;font-weight:600;color:var(--text-primary)}.user-menu-container{position:relative}.user-menu-button{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:12px;background:var(--brand-gradient);color:#fff;border:none;cursor:pointer;transition:all var(--transition-base)}.user-menu-button:hover,.user-menu-button:focus{transform:translateY(-3px);box-shadow:var(--shadow-glow)}@media(max-width:768px){.navbar{padding:0 1rem;min-height:60px}.navbar-title{font-size:1.25rem}.navbar-logo{height:32px}.navbar-menu{position:fixed;top:0;left:0;height:100%;width:280px;background:var(--navbar-bg);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);flex-direction:column;align-items:flex-start;padding:5rem 1.5rem 2rem;transform:translate(-100%);transition:transform .3s ease;z-index:1200}.navbar-menu.open{transform:translate(0)}.navbar-menu-list{flex-direction:column;gap:.5rem;width:100%}.navbar-menu-item{width:100%;justify-content:flex-start;padding:1rem}.navbar-auth{display:none}.modal-content{padding:1.5rem;border-radius:20px}.modal-btn{padding:12px 20px;font-size:.9375rem}}@keyframes fade-in{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.modal-content,.user-dropdown,.navbar-menu{animation:fade-in .3s ease-out}.btn:hover{transform:translateY(-2px)}.signin-dropdown-item:hover,.dropdown-item:hover{transform:translate(4px)}.animated-btn:hover{transform:scale(1.05)}.darkmode-btn-custom{background:linear-gradient(135deg,#334155,#1e293b);color:var(--text-primary);border:1px solid var(--brand-primary);transition:all var(--transition-base)}.darkmode-btn-custom svg{color:#fff}.theme-mode-label{margin-left:.4rem;font-size:.8rem;font-weight:700;letter-spacing:.02em;color:#fff}.darkmode-btn-custom:hover,.darkmode-btn-custom:focus{border-color:var(--brand-accent);transform:scale(1.05);box-shadow:0 0 15px #ec48994d}.darkmode-btn-custom:hover svg,.darkmode-btn-custom:focus svg{color:#fff}.character-container{position:relative;display:inline-block}.character-container .character-image{width:100px;height:81px;object-fit:contain;transition:transform var(--transition-base)}.character-container:hover .character-image{transform:scale(1.05)}.message-bubble{position:absolute;bottom:calc(100% + 12px);left:50%;transform:translate(-50%) translateY(-.5rem);text-align:center;min-width:12rem;max-width:20rem;padding:12px 20px;background:linear-gradient(135deg,#fff,#f8fafc);color:#1e293b;border-radius:16px;box-shadow:0 8px 24px #0000001f,0 0 0 1px #0000000d;white-space:normal;overflow-wrap:break-word;line-height:1.5;font-size:.9375rem;font-weight:500;z-index:10;animation:bubble-slide-in .3s ease-out}@keyframes bubble-slide-in{0%{opacity:0;transform:translate(-50%) translateY(8px) scale(.95)}to{opacity:1;transform:translate(-50%) translateY(-.5rem) scale(1)}}.message-bubble:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border-width:10px 10px 0 10px;border-style:solid;border-color:#ffffff transparent transparent transparent;filter:drop-shadow(0 2px 2px rgba(0,0,0,.08))}.dark-mode .message-bubble{background:linear-gradient(135deg,#1e293b,#0f172a);color:#f1f5f9;border:1px solid rgba(255,255,255,.1);box-shadow:0 8px 24px #0006}.dark-mode .message-bubble:after{border-color:#1e293b transparent transparent transparent}@media(max-width:640px){.message-bubble{min-width:10rem;max-width:16rem;padding:10px 16px;font-size:.875rem}}.console-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;padding-bottom:10px;border-bottom:2px solid;border-image:linear-gradient(90deg,#0ea5e9,#8b5cf6) 1}.console-header h3{margin:0;font-size:.875rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:#1e293b;display:flex;align-items:center;gap:8px}.console-header h3:before{content:">";color:#10b981;font-weight:800}.dark-mode .console-header h3{color:#f1f5f9}.console-toggle-button{cursor:pointer;background:linear-gradient(135deg,#8b5cf6,#7c3aed);color:#fff;border:none;padding:8px 16px;border-radius:10px;font-size:.8125rem;font-weight:600;transition:all .2s ease;box-shadow:0 2px 8px #8b5cf64d}.console-toggle-button:hover{transform:translateY(-2px);box-shadow:0 4px 12px #8b5cf666}.console-toggle-button:active{transform:translateY(0)}.code-preview{background:linear-gradient(135deg,#fff,#f8fafc);border:1px solid #e2e8f0;padding:16px;border-radius:12px;display:flex;flex-direction:column;box-shadow:inset 0 1px 4px #0f172a14;position:relative;overflow:hidden}.code-preview .console-pre,.console .console-pre{background:transparent;border:none;border-radius:0;font-family:JetBrains Mono,Fira Code,Consolas,monospace;font-size:.8125rem;line-height:1.7;overflow-y:auto;margin:0;transition:height .3s ease,opacity .3s ease,padding .3s ease;height:150px;opacity:1;padding:0;color:#10b981}.code-preview.minimized .console-pre,.console.minimized .console-pre{height:0;opacity:0;padding:0}.error-line{color:#ef4444;font-weight:600;background:#ef44441a;padding:2px 6px;border-radius:4px}.dark-mode .error-line{background:#ef444433}.console{background:linear-gradient(135deg,#fff,#f8fafc);border:1px solid #e2e8f0;border-radius:12px;padding:16px;display:flex;flex-direction:column;max-height:200px;overflow-y:auto;color:#0f172a;box-shadow:inset 0 1px 4px #0f172a14;position:relative}.console:before{content:"OUTPUT";position:absolute;top:8px;right:12px;font-size:.625rem;font-weight:700;color:#0f172a4d;letter-spacing:1px}.dark-mode .console{background:linear-gradient(135deg,#0f172a,#1e293b);border:1px solid rgba(255,255,255,.1);color:#e2e8f0;box-shadow:inset 0 2px 8px #0000004d}.dark-mode .code-preview{background:linear-gradient(135deg,#0f172a,#1e293b);border:1px solid rgba(255,255,255,.1);box-shadow:inset 0 2px 8px #0000004d}.dark-mode .code-preview:before,.dark-mode .console:before{color:#ffffff26}.console-line.success{color:#10b981}.console::-webkit-scrollbar,.code-preview::-webkit-scrollbar{width:6px}.console::-webkit-scrollbar-track,.code-preview::-webkit-scrollbar-track{background:transparent}.console::-webkit-scrollbar-thumb,.code-preview::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#475569,#334155);border-radius:3px}@media(max-width:640px){.console-header{margin-bottom:8px;padding-bottom:8px}.console-header h3{font-size:.75rem}.console-toggle-button{padding:6px 12px;font-size:.75rem}.code-preview .console-pre,.console .console-pre{font-size:.75rem;height:120px}.console{max-height:160px}}.right-panel{--panel-bg: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);--panel-surface: #ffffff;--panel-overlay: rgba(255, 255, 255, .8);--panel-border: #e2e8f0;--panel-border-hover: #cbd5e1;--text-primary: #1e293b;--text-secondary: #64748b;--text-muted: #94a3b8;--hover-bg: #f1f5f9;--active-bg: #e2e8f0;--shadow-sm: 0 1px 3px rgba(0, 0, 0, .06);--shadow-md: 0 4px 12px rgba(0, 0, 0, .08);--shadow-lg: 0 8px 24px rgba(0, 0, 0, .12);--panel-width: 340px;--panel-collapsed: 60px}.dark-mode .right-panel{--panel-bg: linear-gradient(180deg, #1e293b 0%, #0f172a 100%);--panel-surface: #1e293b;--panel-overlay: rgba(30, 41, 59, .8);--panel-border: #334155;--panel-border-hover: #475569;--text-primary: #f1f5f9;--text-secondary: #94a3b8;--text-muted: #64748b;--hover-bg: #334155;--active-bg: #475569;--shadow-sm: 0 1px 3px rgba(0, 0, 0, .3);--shadow-md: 0 4px 12px rgba(0, 0, 0, .4);--shadow-lg: 0 8px 24px rgba(0, 0, 0, .5)}.right-panel{position:relative;display:flex;flex-direction:column;gap:16px;width:var(--panel-width);min-width:80px;max-width:600px;height:100%;padding:20px;background:var(--panel-bg);border-left:1px solid var(--panel-border);box-sizing:border-box;overflow-x:auto;-webkit-overflow-scrolling:touch;transition:width var(--transition-base),background var(--transition-base),border-color var(--transition-base),box-shadow var(--transition-base)}.right-panel.resizing{transition:none!important}.right-panel.collapsed{width:var(--panel-collapsed);padding:20px 12px}.resizer-left{position:absolute;top:0;bottom:0;left:0;width:6px;cursor:ew-resize;background:linear-gradient(90deg,rgba(14,165,233,.1) 0%,transparent 100%);z-index:10;transition:background var(--transition-fast)}.resizer-left:hover,.resizer-left:active{background:linear-gradient(90deg,rgba(14,165,233,.4) 0%,transparent 100%)}.collapse-button{width:100%;padding:10px;margin-bottom:16px;cursor:pointer;border:1px solid var(--panel-border);background:linear-gradient(135deg,#fff,#f8fafc);border-radius:12px;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;font-size:.9375rem;font-weight:600;text-align:center;line-height:1;color:var(--text-secondary);transition:all var(--transition-base);box-shadow:var(--shadow-sm)}.dark-mode .collapse-button{background:linear-gradient(135deg,#334155,#1e293b);border-color:#475569;color:#e2e8f0}.right-panel.collapsed .collapse-button{transform:rotate(180deg)}.right-panel .collapse-button:hover{transform:scale(1.05);background:linear-gradient(135deg,#0ea5e9,#0284c7);color:#fff;border-color:#0284c7;box-shadow:0 4px 12px #0ea5e94d}.right-panel.collapsed .collapse-button:hover{transform:rotate(180deg) scale(1.1)}.panel-section{background:var(--panel-surface);border:1px solid var(--panel-border);border-radius:16px;padding:20px;transition:all var(--transition-base);box-shadow:var(--shadow-sm);animation:slide-in-right .3s ease-out forwards}.panel-section:hover{border-color:var(--panel-border-hover);box-shadow:var(--shadow-md);transform:translateY(-2px)}.panel-section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid var(--panel-border)}.panel-section-title{font-size:.875rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--text-secondary);display:flex;align-items:center;gap:8px}.panel-section-title:before{content:"";width:4px;height:16px;background:linear-gradient(180deg,#0ea5e9,#8b5cf6);border-radius:2px}.character-area{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative;background:linear-gradient(135deg,#0ea5e90d,#8b5cf60d);border-radius:16px;padding:24px}.character-display-container{background:var(--panel-surface);border:1px solid var(--panel-border);padding:24px 32px;border-radius:20px;text-align:center;box-shadow:var(--shadow-md);transition:all var(--transition-slow)}.character-display-container:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg),0 0 30px #0ea5e926;border-color:#0ea5e94d}.character-position{font-family:JetBrains Mono,Fira Code,monospace;font-size:.875rem;color:var(--text-muted);margin-top:8px}.character-position span{color:#0ea5e9;font-weight:600}.console-output{background:linear-gradient(135deg,#0f172a,#1e293b);padding:16px 20px;border-radius:12px;font-family:JetBrains Mono,Fira Code,monospace;font-size:.8125rem;line-height:1.7;overflow-x:auto;max-height:160px;overflow-y:auto;color:#10b981;border:1px solid rgba(255,255,255,.1);box-shadow:inset 0 2px 8px #0000004d;position:relative}.console-output:before{content:"TERMINAL";position:absolute;top:8px;right:12px;font-size:.625rem;font-weight:700;color:#fff3;letter-spacing:1px}.console-line{display:block;margin-bottom:4px}.console-line.error{color:#ef4444}.console-line.warning{color:#f59e0b}.console-line.info{color:#3b82f6}.code-preview{background:linear-gradient(135deg,#fff,#f8fafc);padding:16px 20px;border-radius:12px;font-family:JetBrains Mono,Fira Code,monospace;font-size:.8125rem;line-height:1.7;overflow-x:auto;max-height:180px;overflow-y:auto;color:#0f172a;border:1px solid #e2e8f0;box-shadow:inset 0 1px 4px #0f172a14;position:relative}.code-preview:before{content:"CODE";position:absolute;top:8px;right:12px;font-size:.625rem;font-weight:700;color:#0f172a4d;letter-spacing:1px}.code-line{display:block}.code-keyword{color:#c084fc;font-weight:600}.code-string{color:#34d399}.code-number{color:#fbbf24}.code-comment{color:#64748b;font-style:italic}.blocks-list{list-style:none;padding:0;margin:0}.blocks-list-item{display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:10px;margin-bottom:8px;background:var(--hover-bg);transition:all var(--transition-base);cursor:pointer}.blocks-list-item:hover{background:linear-gradient(135deg,#0ea5e91a,#8b5cf61a);transform:translate(4px)}.block-type-indicator{width:8px;height:8px;border-radius:50%;flex-shrink:0}.block-type-indicator.start{background:#10b981}.block-type-indicator.end{background:#ef4444}.block-type-indicator.if{background:#8b5cf6}.block-type-indicator.while{background:#f59e0b}.block-type-indicator.input{background:#3b82f6}.block-type-indicator.output{background:#ec4899}.block-type-indicator.move{background:#14b8a6}.block-type-indicator.rotate{background:#f97316}.block-type-indicator.variable{background:#6366f1}.block-info{flex:1;min-width:0}.block-label{font-size:.875rem;font-weight:600;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.block-details{font-size:.75rem;color:var(--text-muted);margin-top:2px}.right-panel::-webkit-scrollbar{width:6px}.right-panel::-webkit-scrollbar-track{background:transparent}.right-panel::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#cbd5e1,#94a3b8);border-radius:3px}.right-panel::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#94a3b8,#64748b)}.dark-mode.right-panel::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#475569,#334155)}.dark-mode.right-panel::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#64748b,#475569)}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;text-align:center}.empty-state-icon{width:64px;height:64px;margin-bottom:16px;color:var(--text-muted);opacity:.5}.empty-state-title{font-size:1rem;font-weight:600;color:var(--text-secondary);margin-bottom:8px}.empty-state-description{font-size:.875rem;color:var(--text-muted)}@keyframes slide-in-right{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.panel-section:nth-child(2){animation-delay:.1s}.panel-section:nth-child(3){animation-delay:.2s}.panel-section:nth-child(4){animation-delay:.3s}@media(max-width:1200px){.right-panel{width:300px;min-width:60px}}@media(max-width:768px){.right-panel{width:100%;max-width:none;height:auto;max-height:50vh;border-left:none;border-top:1px solid var(--panel-border)}.panel-section{padding:16px}}:root{--toastify-color-light: #fff;--toastify-color-dark: #121212;--toastify-color-info: #3498db;--toastify-color-success: #07bc0c;--toastify-color-warning: #f1c40f;--toastify-color-error: hsl(6, 78%, 57%);--toastify-color-transparent: rgba(255, 255, 255, .7);--toastify-icon-color-info: var(--toastify-color-info);--toastify-icon-color-success: var(--toastify-color-success);--toastify-icon-color-warning: var(--toastify-color-warning);--toastify-icon-color-error: var(--toastify-color-error);--toastify-container-width: fit-content;--toastify-toast-width: 320px;--toastify-toast-offset: 16px;--toastify-toast-top: max(var(--toastify-toast-offset), env(safe-area-inset-top));--toastify-toast-right: max(var(--toastify-toast-offset), env(safe-area-inset-right));--toastify-toast-left: max(var(--toastify-toast-offset), env(safe-area-inset-left));--toastify-toast-bottom: max(var(--toastify-toast-offset), env(safe-area-inset-bottom));--toastify-toast-background: #fff;--toastify-toast-padding: 14px;--toastify-toast-min-height: 64px;--toastify-toast-max-height: 800px;--toastify-toast-bd-radius: 6px;--toastify-toast-shadow: 0px 4px 12px rgba(0, 0, 0, .1);--toastify-font-family: sans-serif;--toastify-z-index: 9999;--toastify-text-color-light: #757575;--toastify-text-color-dark: #fff;--toastify-text-color-info: #fff;--toastify-text-color-success: #fff;--toastify-text-color-warning: #fff;--toastify-text-color-error: #fff;--toastify-spinner-color: #616161;--toastify-spinner-color-empty-area: #e0e0e0;--toastify-color-progress-light: linear-gradient(to right, #4cd964, #5ac8fa, #007aff, #34aadc, #5856d6, #ff2d55);--toastify-color-progress-dark: #bb86fc;--toastify-color-progress-info: var(--toastify-color-info);--toastify-color-progress-success: var(--toastify-color-success);--toastify-color-progress-warning: var(--toastify-color-warning);--toastify-color-progress-error: var(--toastify-color-error);--toastify-color-progress-bgo: .2}.Toastify__toast-container{z-index:var(--toastify-z-index);-webkit-transform:translate3d(0,0,var(--toastify-z-index));position:fixed;width:var(--toastify-container-width);box-sizing:border-box;color:#fff;display:flex;flex-direction:column}.Toastify__toast-container--top-left{top:var(--toastify-toast-top);left:var(--toastify-toast-left)}.Toastify__toast-container--top-center{top:var(--toastify-toast-top);left:50%;transform:translate(-50%);align-items:center}.Toastify__toast-container--top-right{top:var(--toastify-toast-top);right:var(--toastify-toast-right);align-items:end}.Toastify__toast-container--bottom-left{bottom:var(--toastify-toast-bottom);left:var(--toastify-toast-left)}.Toastify__toast-container--bottom-center{bottom:var(--toastify-toast-bottom);left:50%;transform:translate(-50%);align-items:center}.Toastify__toast-container--bottom-right{bottom:var(--toastify-toast-bottom);right:var(--toastify-toast-right);align-items:end}.Toastify__toast{--y: 0px;position:relative;touch-action:none;width:var(--toastify-toast-width);min-height:var(--toastify-toast-min-height);box-sizing:border-box;margin-bottom:1rem;padding:var(--toastify-toast-padding);border-radius:var(--toastify-toast-bd-radius);box-shadow:var(--toastify-toast-shadow);max-height:var(--toastify-toast-max-height);font-family:var(--toastify-font-family);z-index:0;display:flex;flex:1 auto;align-items:center;word-break:break-word}@media only screen and (max-width:480px){.Toastify__toast-container{width:100vw;left:env(safe-area-inset-left);margin:0}.Toastify__toast-container--top-left,.Toastify__toast-container--top-center,.Toastify__toast-container--top-right{top:env(safe-area-inset-top);transform:translate(0)}.Toastify__toast-container--bottom-left,.Toastify__toast-container--bottom-center,.Toastify__toast-container--bottom-right{bottom:env(safe-area-inset-bottom);transform:translate(0)}.Toastify__toast-container--rtl{right:env(safe-area-inset-right);left:initial}.Toastify__toast{--toastify-toast-width: 100%;margin-bottom:0;border-radius:0}}.Toastify__toast-container[data-stacked=true]{width:var(--toastify-toast-width)}@media only screen and (max-width:480px){.Toastify__toast-container[data-stacked=true]{width:100vw}}.Toastify__toast--stacked{position:absolute;width:100%;transform:translate3d(0,var(--y),0) scale(var(--s));transition:transform .3s}.Toastify__toast--stacked[data-collapsed] .Toastify__toast-body,.Toastify__toast--stacked[data-collapsed] .Toastify__close-button{transition:opacity .1s}.Toastify__toast--stacked[data-collapsed=false]{overflow:visible}.Toastify__toast--stacked[data-collapsed=true]:not(:last-child)>*{opacity:0}.Toastify__toast--stacked:after{content:"";position:absolute;left:0;right:0;height:calc(var(--g) * 1px);bottom:100%}.Toastify__toast--stacked[data-pos=top]{top:0}.Toastify__toast--stacked[data-pos=bot]{bottom:0}.Toastify__toast--stacked[data-pos=bot].Toastify__toast--stacked:before{transform-origin:top}.Toastify__toast--stacked[data-pos=top].Toastify__toast--stacked:before{transform-origin:bottom}.Toastify__toast--stacked:before{content:"";position:absolute;left:0;right:0;bottom:0;height:100%;transform:scaleY(3);z-index:-1}.Toastify__toast--rtl{direction:rtl}.Toastify__toast--close-on-click{cursor:pointer}.Toastify__toast-icon{margin-inline-end:10px;width:22px;flex-shrink:0;display:flex}.Toastify--animate{animation-fill-mode:both;animation-duration:.5s}.Toastify--animate-icon{animation-fill-mode:both;animation-duration:.3s}.Toastify__toast-theme--dark{background:var(--toastify-color-dark);color:var(--toastify-text-color-dark)}.Toastify__toast-theme--light,.Toastify__toast-theme--colored.Toastify__toast--default{background:var(--toastify-color-light);color:var(--toastify-text-color-light)}.Toastify__toast-theme--colored.Toastify__toast--info{color:var(--toastify-text-color-info);background:var(--toastify-color-info)}.Toastify__toast-theme--colored.Toastify__toast--success{color:var(--toastify-text-color-success);background:var(--toastify-color-success)}.Toastify__toast-theme--colored.Toastify__toast--warning{color:var(--toastify-text-color-warning);background:var(--toastify-color-warning)}.Toastify__toast-theme--colored.Toastify__toast--error{color:var(--toastify-text-color-error);background:var(--toastify-color-error)}.Toastify__progress-bar-theme--light{background:var(--toastify-color-progress-light)}.Toastify__progress-bar-theme--dark{background:var(--toastify-color-progress-dark)}.Toastify__progress-bar--info{background:var(--toastify-color-progress-info)}.Toastify__progress-bar--success{background:var(--toastify-color-progress-success)}.Toastify__progress-bar--warning{background:var(--toastify-color-progress-warning)}.Toastify__progress-bar--error{background:var(--toastify-color-progress-error)}.Toastify__progress-bar-theme--colored.Toastify__progress-bar--info,.Toastify__progress-bar-theme--colored.Toastify__progress-bar--success,.Toastify__progress-bar-theme--colored.Toastify__progress-bar--warning,.Toastify__progress-bar-theme--colored.Toastify__progress-bar--error{background:var(--toastify-color-transparent)}.Toastify__close-button{color:#fff;position:absolute;top:6px;right:6px;background:transparent;outline:none;border:none;padding:0;cursor:pointer;opacity:.7;transition:.3s ease;z-index:1}.Toastify__toast--rtl .Toastify__close-button{left:6px;right:unset}.Toastify__close-button--light{color:#000;opacity:.3}.Toastify__close-button>svg{fill:currentColor;height:16px;width:14px}.Toastify__close-button:hover,.Toastify__close-button:focus{opacity:1}@keyframes Toastify__trackProgress{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.Toastify__progress-bar{position:absolute;bottom:0;left:0;width:100%;height:100%;z-index:1;opacity:.7;transform-origin:left}.Toastify__progress-bar--animated{animation:Toastify__trackProgress linear 1 forwards}.Toastify__progress-bar--controlled{transition:transform .2s}.Toastify__progress-bar--rtl{right:0;left:initial;transform-origin:right;border-bottom-left-radius:initial}.Toastify__progress-bar--wrp{position:absolute;overflow:hidden;bottom:0;left:0;width:100%;height:5px;border-bottom-left-radius:var(--toastify-toast-bd-radius);border-bottom-right-radius:var(--toastify-toast-bd-radius)}.Toastify__progress-bar--wrp[data-hidden=true]{opacity:0}.Toastify__progress-bar--bg{opacity:var(--toastify-color-progress-bgo);width:100%;height:100%}.Toastify__spinner{width:20px;height:20px;box-sizing:border-box;border:2px solid;border-radius:100%;border-color:var(--toastify-spinner-color-empty-area);border-right-color:var(--toastify-spinner-color);animation:Toastify__spin .65s linear infinite}@keyframes Toastify__bounceInRight{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(3000px,0,0)}60%{opacity:1;transform:translate3d(-25px,0,0)}75%{transform:translate3d(10px,0,0)}90%{transform:translate3d(-5px,0,0)}to{transform:none}}@keyframes Toastify__bounceOutRight{20%{opacity:1;transform:translate3d(-20px,var(--y),0)}to{opacity:0;transform:translate3d(2000px,var(--y),0)}}@keyframes Toastify__bounceInLeft{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(-3000px,0,0)}60%{opacity:1;transform:translate3d(25px,0,0)}75%{transform:translate3d(-10px,0,0)}90%{transform:translate3d(5px,0,0)}to{transform:none}}@keyframes Toastify__bounceOutLeft{20%{opacity:1;transform:translate3d(20px,var(--y),0)}to{opacity:0;transform:translate3d(-2000px,var(--y),0)}}@keyframes Toastify__bounceInUp{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(0,3000px,0)}60%{opacity:1;transform:translate3d(0,-20px,0)}75%{transform:translate3d(0,10px,0)}90%{transform:translate3d(0,-5px,0)}to{transform:translateZ(0)}}@keyframes Toastify__bounceOutUp{20%{transform:translate3d(0,calc(var(--y) - 10px),0)}40%,45%{opacity:1;transform:translate3d(0,calc(var(--y) + 20px),0)}to{opacity:0;transform:translate3d(0,-2000px,0)}}@keyframes Toastify__bounceInDown{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(0,-3000px,0)}60%{opacity:1;transform:translate3d(0,25px,0)}75%{transform:translate3d(0,-10px,0)}90%{transform:translate3d(0,5px,0)}to{transform:none}}@keyframes Toastify__bounceOutDown{20%{transform:translate3d(0,calc(var(--y) - 10px),0)}40%,45%{opacity:1;transform:translate3d(0,calc(var(--y) + 20px),0)}to{opacity:0;transform:translate3d(0,2000px,0)}}.Toastify__bounce-enter--top-left,.Toastify__bounce-enter--bottom-left{animation-name:Toastify__bounceInLeft}.Toastify__bounce-enter--top-right,.Toastify__bounce-enter--bottom-right{animation-name:Toastify__bounceInRight}.Toastify__bounce-enter--top-center{animation-name:Toastify__bounceInDown}.Toastify__bounce-enter--bottom-center{animation-name:Toastify__bounceInUp}.Toastify__bounce-exit--top-left,.Toastify__bounce-exit--bottom-left{animation-name:Toastify__bounceOutLeft}.Toastify__bounce-exit--top-right,.Toastify__bounce-exit--bottom-right{animation-name:Toastify__bounceOutRight}.Toastify__bounce-exit--top-center{animation-name:Toastify__bounceOutUp}.Toastify__bounce-exit--bottom-center{animation-name:Toastify__bounceOutDown}@keyframes Toastify__zoomIn{0%{opacity:0;transform:scale3d(.3,.3,.3)}50%{opacity:1}}@keyframes Toastify__zoomOut{0%{opacity:1}50%{opacity:0;transform:translate3d(0,var(--y),0) scale3d(.3,.3,.3)}to{opacity:0}}.Toastify__zoom-enter{animation-name:Toastify__zoomIn}.Toastify__zoom-exit{animation-name:Toastify__zoomOut}@keyframes Toastify__flipIn{0%{transform:perspective(400px) rotateX(90deg);animation-timing-function:ease-in;opacity:0}40%{transform:perspective(400px) rotateX(-20deg);animation-timing-function:ease-in}60%{transform:perspective(400px) rotateX(10deg);opacity:1}80%{transform:perspective(400px) rotateX(-5deg)}to{transform:perspective(400px)}}@keyframes Toastify__flipOut{0%{transform:translate3d(0,var(--y),0) perspective(400px)}30%{transform:translate3d(0,var(--y),0) perspective(400px) rotateX(-20deg);opacity:1}to{transform:translate3d(0,var(--y),0) perspective(400px) rotateX(90deg);opacity:0}}.Toastify__flip-enter{animation-name:Toastify__flipIn}.Toastify__flip-exit{animation-name:Toastify__flipOut}@keyframes Toastify__slideInRight{0%{transform:translate3d(110%,0,0);visibility:visible}to{transform:translate3d(0,var(--y),0)}}@keyframes Toastify__slideInLeft{0%{transform:translate3d(-110%,0,0);visibility:visible}to{transform:translate3d(0,var(--y),0)}}@keyframes Toastify__slideInUp{0%{transform:translate3d(0,110%,0);visibility:visible}to{transform:translate3d(0,var(--y),0)}}@keyframes Toastify__slideInDown{0%{transform:translate3d(0,-110%,0);visibility:visible}to{transform:translate3d(0,var(--y),0)}}@keyframes Toastify__slideOutRight{0%{transform:translate3d(0,var(--y),0)}to{visibility:hidden;transform:translate3d(110%,var(--y),0)}}@keyframes Toastify__slideOutLeft{0%{transform:translate3d(0,var(--y),0)}to{visibility:hidden;transform:translate3d(-110%,var(--y),0)}}@keyframes Toastify__slideOutDown{0%{transform:translate3d(0,var(--y),0)}to{visibility:hidden;transform:translate3d(0,500px,0)}}@keyframes Toastify__slideOutUp{0%{transform:translate3d(0,var(--y),0)}to{visibility:hidden;transform:translate3d(0,-500px,0)}}.Toastify__slide-enter--top-left,.Toastify__slide-enter--bottom-left{animation-name:Toastify__slideInLeft}.Toastify__slide-enter--top-right,.Toastify__slide-enter--bottom-right{animation-name:Toastify__slideInRight}.Toastify__slide-enter--top-center{animation-name:Toastify__slideInDown}.Toastify__slide-enter--bottom-center{animation-name:Toastify__slideInUp}.Toastify__slide-exit--top-left,.Toastify__slide-exit--bottom-left{animation-name:Toastify__slideOutLeft;animation-timing-function:ease-in;animation-duration:.3s}.Toastify__slide-exit--top-right,.Toastify__slide-exit--bottom-right{animation-name:Toastify__slideOutRight;animation-timing-function:ease-in;animation-duration:.3s}.Toastify__slide-exit--top-center{animation-name:Toastify__slideOutUp;animation-timing-function:ease-in;animation-duration:.3s}.Toastify__slide-exit--bottom-center{animation-name:Toastify__slideOutDown;animation-timing-function:ease-in;animation-duration:.3s}@keyframes Toastify__spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:root{--primary-50: #f0f9ff;--primary-100: #e0f2fe;--primary-200: #bae6fd;--primary-300: #7dd3fc;--primary-400: #38bdf8;--primary-500: #0ea5e9;--primary-600: #0284c7;--primary-700: #0369a1;--primary-800: #075985;--primary-900: #0c4a6e;--accent-500: #8b5cf6;--accent-600: #7c3aed;--accent-pink: #ec4899;--success-500: #10b981;--success-600: #059669;--warning-500: #f59e0b;--warning-600: #d97706;--error-500: #ef4444;--error-600: #dc2626;--gray-50: #f9fafb;--gray-100: #f3f4f6;--gray-200: #e5e7eb;--gray-300: #d1d5db;--gray-400: #9ca3af;--gray-500: #6b7280;--gray-600: #4b5563;--gray-700: #374151;--gray-800: #1f2937;--gray-900: #111827;--bg-primary: #f8fafc;--bg-secondary: #ffffff;--bg-tertiary: #f1f5f9;--surface-elevated: #ffffff;--surface-overlay: rgba(255, 255, 255, .8);--text-secondary: #475569;--text-primary: #1e293b;--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--transition-base: .2s cubic-bezier(.4, 0, .2, 1);--transition-slow: .3s cubic-bezier(.4, 0, .2, 1);--shadow-glow-primary: 0 0 20px rgba(14, 165, 233, .3);--shadow-glow-accent: 0 0 20px rgba(139, 92, 246, .3);--radius-sm: .375rem;--radius-md: .5rem;--radius-lg: .75rem;--radius-xl: 1rem;--radius-2xl: 1.5rem;--radius-full: 9999px;--transition-bounce: .5s cubic-bezier(.34, 1.56, .64, 1);--navbar-height: 70px;--sidebar-width: 320px;--right-panel-width: 320px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body,html{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:linear-gradient(135deg,var(--bg-primary) 0%,#e2e8f0 100%);color:var(--text-primary);height:100vh;overflow:hidden;line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.App{display:flex;flex-direction:column;height:100vh;width:100%;background:linear-gradient(180deg,var(--bg-primary) 0%,var(--gray-50) 100%)}.app-container{display:flex;flex:1;gap:0;padding:0;overflow:hidden;position:relative}.BlockPalette{flex-shrink:0}.BlockPalette>*{overflow-y:auto;overflow-x:hidden}.flowchart-container{flex:1;display:flex;flex-direction:column;height:100%;position:relative}.reactflow-wrapper{flex:1;background:var(--surface-elevated);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg),inset 0 0 0 1px #0000000d;position:relative;width:100%;height:100%;overflow:hidden;margin:16px 16px 16px 0}.flowchart-wrapper{position:relative;width:100%;height:100%;background:radial-gradient(circle at 50% 50%,rgba(14,165,233,.03) 0%,transparent 50%),linear-gradient(90deg,rgba(0,0,0,.02) 1px,transparent 1px),linear-gradient(rgba(0,0,0,.02) 1px,transparent 1px);background-size:100% 100%,20px 20px,20px 20px}.right-panel>*{overflow-y:auto;color:var(--text-secondary)}.character-area{flex:1;display:flex;justify-content:center;align-items:center;position:relative;background:linear-gradient(135deg,#0ea5e90d,#8b5cf60d);border-radius:var(--radius-lg);padding:16px}.CharacterDisplay{background:var(--surface-elevated);padding:20px 24px;border-radius:var(--radius-xl);box-shadow:var(--shadow-lg),var(--shadow-glow-primary);text-align:center;border:1px solid rgba(14,165,233,.2);transition:all var(--transition-slow)}.CharacterDisplay:hover{transform:translateY(-4px);box-shadow:var(--shadow-xl),var(--shadow-glow-primary)}.run-button,.reset-button,.delete-button{padding:10px 20px;border-radius:var(--radius-lg);cursor:pointer;font-size:14px;font-weight:600;color:#fff;border:none;transition:all var(--transition-base);position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:8px}.run-button{background:linear-gradient(135deg,#10b981,#059669);box-shadow:var(--shadow-md),0 0 #10b98166}.run-button:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg),0 0 20px #10b98166}.run-button:active{transform:translateY(0)}.reset-button{background:linear-gradient(135deg,#f59e0b,#d97706);box-shadow:var(--shadow-md),0 0 #f59e0b66}.reset-button:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg),0 0 20px #f59e0b66}.delete-button{background:linear-gradient(135deg,#ef4444,#dc2626);box-shadow:var(--shadow-md),0 0 #ef444466}.delete-button:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg),0 0 20px #ef444466}.character-container{position:relative}.panel{background:var(--surface-elevated);border:1px solid var(--gray-200);padding:16px;border-radius:var(--radius-lg);box-sizing:border-box;overflow:auto;transition:all var(--transition-base)}.panel:hover{border-color:var(--primary-300);box-shadow:var(--shadow-md)}.CodePreview{background:linear-gradient(135deg,#1e293b,#0f172a);padding:16px 20px;border-radius:var(--radius-lg);box-shadow:var(--shadow-lg) inset;font-family:Fira Code,JetBrains Mono,Courier New,monospace;font-size:13px;line-height:1.7;overflow-x:auto;max-height:180px;color:#e2e8f0;border:1px solid rgba(255,255,255,.1);position:relative}.CodePreview:before{content:"";position:absolute;top:8px;left:12px;display:flex;gap:6px}.CodePreview .line-number{color:var(--gray-500);margin-right:16px;-webkit-user-select:none;user-select:none;min-width:24px;display:inline-block}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--gray-100);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--gray-300) 0%,var(--gray-400) 100%);border-radius:var(--radius-full);transition:background var(--transition-base)}::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,var(--gray-400) 0%,var(--gray-500) 100%)}@media(max-width:1024px){.app-container{flex-direction:column;overflow:auto}.BlockPalette,.right-panel{width:100%;max-width:none}.reactflow-wrapper{height:400px;margin:8px}:root{--navbar-height: 60px}}@media(max-width:640px){.run-button,.reset-button,.delete-button{padding:8px 14px;font-size:12px}.CodePreview{font-size:12px;padding:12px}}.dark-mode{background:linear-gradient(180deg,#0f172a,#1e293b);color:#e2e8f0}.dark-mode .navbar{background:linear-gradient(180deg,#0f172af2,#1e293bf2);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid rgba(255,255,255,.1)}.dark-mode .hint-list li{color:#e2e8f0}.dark-mode .btn{background-color:var(--gray-700);color:#e2e8f0}.dark-mode .BlockPalette{border-color:#ffffff1a}.dark-mode .right-panel{background:linear-gradient(180deg,#1e293bf2,#0f172af2);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-color:#ffffff1a;color:#e2e8f0}.dark-mode .block-container{border:2px solid var(--gray-600);box-shadow:0 4px 8px #00000080}.dark-mode .console{background:linear-gradient(180deg,#1e293b,#0f172a);border-color:#ffffff1a}.dark-mode .console-header h3{color:#e2e8f0}.dark-mode .console .console-pre{color:#10b981;background-color:transparent}.dark-mode .code-preview{background:linear-gradient(135deg,#1e293b,#0f172a);border-color:#ffffff1a}.dark-mode .collapse-button{background-color:var(--gray-700);color:#e2e8f0}.dark-mode .settings-section,.dark-mode .delete-account-title,.dark-mode .theme-title{color:#e2e8f0}.dark-mode .modal-content,.dark-mode .modal-title,.dark-mode .modal-input{background-color:#1e293b;color:#e2e8f0;border-color:#ffffff1a}.dark-mode .project-list{background:linear-gradient(180deg,#1e293b,#0f172a);color:#e2e8f0}.dark-mode .modal-subtitle{color:#e2e8f0}.dark-mode .project-actions .btn{transition:transform .3s ease,box-shadow .3s ease}.dark-mode .project-load-btn:hover,.dark-mode .project-delete-btn:hover{transform:scale(1.05);background-color:#334155}.dark-mode .modal-btn{background:linear-gradient(135deg,var(--gray-700) 0%,var(--gray-600) 100%);color:#e2e8f0;border:1px solid rgba(255,255,255,.2)}.dark-mode .file-btn,.dark-mode .import-btn,.dark-mode .load-example-btn{background:linear-gradient(135deg,#0ea5e9,#0284c7);color:#fff}.dark-mode .account-btn{background:linear-gradient(135deg,#8b5cf6,#7c3aed);color:#fff}.dark-mode .image-btn{background:linear-gradient(135deg,#ec4899,#db2777);color:#fff}.dark-mode .cancel-btn{background:linear-gradient(135deg,#475569,#334155);color:#f8fafc}.dark-mode .modal-btn:hover{background:linear-gradient(135deg,var(--gray-600) 0%,var(--gray-500) 100%);transform:scale(1.05)}.dark-mode .flowchart-wrapper,.dark-mode .flowchart-container{background:linear-gradient(180deg,#0f172a,#1e293b)}.dark-mode .reactflow-wrapper{background:#1e293b;border-color:#ffffff1a}.dark-mode .react-flow__background{fill:#0f172a}.dark-mode .block-input,.dark-mode .operand-input,.dark-mode .operator-select{background-color:#334155;color:#f1f5f9;border-color:#475569}.dark-mode .block-input::placeholder{color:#94a3b8}.dark-mode .message-bubble{background:var(--gray-700);color:#f1f5f9}.dark-mode .message-bubble p{color:inherit}.dark-mode .character-area{background:linear-gradient(135deg,#0ea5e91a,#8b5cf61a)}.dark-mode .CharacterDisplay{background:linear-gradient(180deg,#1e293b,#0f172a);border-color:#0ea5e94d;color:#e2e8f0}@keyframes fade-in-up{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.animate-fade-in{animation:fade-in-up .4s ease-out forwards}*:focus-visible{outline:2px solid var(--primary-500);outline-offset:2px}*,*:before,*:after{box-sizing:border-box}*{margin:0;padding:0}html{height:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}body{height:100%;line-height:1.5;overflow:hidden;font-family:var(--font-sans);font-size:var(--text-base);color:var(--text-primary);background:linear-gradient(135deg,#f8fafc,#e2e8f0,#f1f5f9);min-height:100vh}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}#root{isolation:isolate;height:100%;width:100%}:root{--brand-primary: #0ea5e9;--brand-secondary: #8b5cf6;--brand-accent: #ec4899;--color-success: #10b981;--color-warning: #f59e0b;--color-error: #ef4444;--color-info: #3b82f6;--bg-body: #f8fafc;--bg-surface: #ffffff;--bg-elevated: #ffffff;--text-primary: #1e293b;--text-secondary: #64748b;--text-muted: #94a3b8;--text-inverse: #ffffff;--border-light: #e2e8f0;--border-medium: #cbd5e1;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--shadow-xl: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);--radius-sm: .25rem;--radius-md: .5rem;--radius-lg: .75rem;--radius-xl: 1rem;--radius-2xl: 1.5rem;--radius-full: 9999px;--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-base: .2s cubic-bezier(.4, 0, .2, 1);--transition-slow: .3s cubic-bezier(.4, 0, .2, 1);--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono: "Fira Code", "JetBrains Mono", "Courier New", monospace;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 1.875rem;--text-4xl: 2.25rem;--font-light: 300;--font-normal: 400;--font-medium: 500;--font-semibold: 600;--font-bold: 700;--z-dropdown: 1000;--z-sticky: 1020;--z-fixed: 1030;--z-modal-backdrop: 1040;--z-modal: 1050;--z-popover: 1060;--z-tooltip: 1070}::selection{background:#0ea5e94d;color:var(--text-primary)}:focus-visible{outline:2px solid var(--brand-primary);outline-offset:2px}h1,h2,h3,h4,h5,h6{font-weight:var(--font-semibold);line-height:1.25;color:var(--text-primary)}h1{font-size:var(--text-4xl)}h2{font-size:var(--text-3xl)}h3{font-size:var(--text-2xl)}h4{font-size:var(--text-xl)}h5{font-size:var(--text-lg)}h6{font-size:var(--text-base)}p{margin-bottom:var(--space-4);color:var(--text-secondary)}a{color:var(--brand-primary);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--brand-secondary)}input,textarea,select,button{font-family:inherit;font-size:inherit}button{cursor:pointer;border:none;background:none}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#cbd5e1,#94a3b8);border-radius:var(--radius-full);border:2px solid transparent;background-clip:padding-box}::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#94a3b8,#64748b);background-clip:padding-box}*{scrollbar-width:thin;scrollbar-color:#94a3b8 transparent}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;-webkit-clip-path:inset(50%);clip-path:inset(50%);white-space:nowrap;border-width:0}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes ping{75%,to{transform:scale(2);opacity:0}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes bounce{0%,to{transform:translateY(-5%);animation-timing-function:cubic-bezier(.8,0,1,1)}50%{transform:translateY(0);animation-timing-function:cubic-bezier(0,0,.2,1)}}.animate-spin{animation:spin 1s linear infinite}.animate-ping{animation:ping 1s cubic-bezier(0,0,.2,1) infinite}.animate-pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}.animate-bounce{animation:bounce 1s infinite}.loading-dots:after{content:"";animation:dots 1.5s steps(4,end) infinite}@keyframes dots{0%,20%{content:""}40%{content:"."}60%{content:".."}80%,to{content:"..."}}.toast-container,.react-flow__node{font-family:var(--font-sans)}.react-flow__edge-path{stroke-width:2}.react-flow__controls{box-shadow:var(--shadow-lg);border-radius:var(--radius-lg);overflow:hidden}.react-flow__controls-button{border:none;background:var(--bg-surface);color:var(--text-secondary);transition:all var(--transition-fast)}.react-flow__controls-button:hover{background:var(--bg-elevated);color:var(--brand-primary)}.react-flow__minimap{background:var(--bg-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg)}.react-flow__attribution{opacity:.5;font-size:10px}@media print{body{background:#fff}.no-print{display:none!important}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}