body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}*{box-sizing:border-box;margin:0;padding:0}:root{--bg-color:#f8f9fa;--text-color:#2c3e50;--header-bg:#1a1f2e;--header-text:#fff;--card-bg:#fff;--border-color:#e1e4e8;--primary-color:#4a90e2;--secondary-color:#6c757d;--success-color:#28a745;--warning-color:#fd7e14;--danger-color:#dc3545;--shadow-color:#00000014;--shadow-hover:#00000026;--terminal-bg:#1e1e1e;--terminal-text:#f1f1f1;--timeline-bg:#f8f9fa;--accent-color:#667eea;--accent-light:#764ba2;--transition-speed:0.3s;--transition-smooth:cubic-bezier(0.4,0,0.2,1);--transition-bounce:cubic-bezier(0.68,-0.55,0.265,1.55)}body.dark-mode{--bg-color:#0d1117;--text-color:#e6edf3;--header-bg:#010409;--header-text:#fff;--card-bg:#161b22;--border-color:#30363d;--primary-color:#58a6ff;--secondary-color:#8b949e;--success-color:#3fb950;--warning-color:#f0883e;--danger-color:#f85149;--shadow-color:#0006;--shadow-hover:#0009;--terminal-bg:#010409;--terminal-text:#e6edf3;--timeline-bg:#0d1117;--accent-color:#7c3aed;--accent-light:#a855f7}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInRight{0%{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:translateX(0)}}@keyframes slideInLeft{0%{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes glow{0%{box-shadow:0 0 5px #4a90e2,0 0 10px #4a90e2;box-shadow:0 0 5px var(--primary-color),0 0 10px var(--primary-color)}to{box-shadow:0 0 10px #4a90e2,0 0 20px #4a90e2,0 0 30px #4a90e2;box-shadow:0 0 10px var(--primary-color),0 0 20px var(--primary-color),0 0 30px var(--primary-color)}}body{background-color:#f8f9fa;background-color:var(--bg-color);color:#2c3e50;color:var(--text-color);font-family:Inter,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;line-height:1.6;overflow-x:hidden;transition:background-color .3s cubic-bezier(.4,0,.2,1),color .3s cubic-bezier(.4,0,.2,1);transition:background-color var(--transition-speed) var(--transition-smooth),color var(--transition-speed) var(--transition-smooth)}.App{animation:fadeIn .6s cubic-bezier(.4,0,.2,1);animation:fadeIn .6s var(--transition-smooth);display:flex;flex-direction:column;min-height:100vh}.App-header{animation:slideInRight .5s cubic-bezier(.4,0,.2,1);animation:slideInRight .5s var(--transition-smooth);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:linear-gradient(135deg,#1a1f2e,#2c3e50);background:linear-gradient(135deg,var(--header-bg) 0,#2c3e50 100%);box-shadow:0 4px 20px #00000014;box-shadow:0 4px 20px var(--shadow-color);color:#fff;color:var(--header-text);padding:1.25rem 2rem;position:sticky;top:0;z-index:1000}.header-content{align-items:center;display:flex;justify-content:space-between;margin:0 auto;max-width:1400px;width:100%}.App-header h1{-webkit-text-fill-color:#0000;animation:slideInRight .6s cubic-bezier(.4,0,.2,1);animation:slideInRight .6s var(--transition-smooth);background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;background-clip:text;cursor:pointer;font-size:1.8rem;font-weight:700;transition:transform .3s cubic-bezier(.4,0,.2,1);transition:transform var(--transition-speed) var(--transition-smooth)}.App-header h1:hover{transform:scale(1.05)}main{animation:fadeIn .8s cubic-bezier(.4,0,.2,1);animation:fadeIn .8s var(--transition-smooth);flex:1 1;margin:0 auto;max-width:1400px;padding:2rem;width:100%}footer{animation:slideInLeft .5s cubic-bezier(.4,0,.2,1);animation:slideInLeft .5s var(--transition-smooth);background:linear-gradient(135deg,#1a1f2e,#2c3e50);background:linear-gradient(135deg,var(--header-bg) 0,#2c3e50 100%);box-shadow:0 -4px 20px #00000014;box-shadow:0 -4px 20px var(--shadow-color);color:#fff;color:var(--header-text);margin-top:auto;padding:1.5rem;text-align:center}footer p{margin:.25rem 0;opacity:.9}.error,.loading{align-items:center;animation:pulse 2s infinite;color:#6c757d;color:var(--secondary-color);display:flex;font-size:1.5rem;height:50vh;justify-content:center}.error{color:#dc3545;color:var(--danger-color)}.theme-toggle{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);background:linear-gradient(135deg,var(--accent-color) 0,var(--accent-light) 100%);border:none;border-radius:50%;box-shadow:0 4px 15px #667eea66;color:#fff;cursor:pointer;display:flex;font-size:1.4rem;height:50px;justify-content:center;outline:none;overflow:hidden;position:relative;transition:all .3s cubic-bezier(.68,-.55,.265,1.55);transition:all var(--transition-speed) var(--transition-bounce);width:50px}.theme-toggle:before{background:linear-gradient(90deg,#0000,#ffffff4d,#0000);content:"";height:100%;left:-100%;position:absolute;top:0;transition:left .5s;width:100%}.theme-toggle:hover:before{left:100%}.theme-toggle:hover{box-shadow:0 6px 25px #667eea99;transform:rotate(180deg) scale(1.1)}.theme-toggle:active{transform:rotate(180deg) scale(.95)}.learning-journey{animation:scaleIn .6s cubic-bezier(.4,0,.2,1);background:#fff;box-shadow:0 8px 32px #00000014;transition:all .3s cubic-bezier(.4,0,.2,1)}.learning-journey:hover{box-shadow:0 12px 48px #00000026}.module-content{animation:fadeIn .6s cubic-bezier(.4,0,.2,1);animation:fadeIn .6s var(--transition-smooth);display:flex;flex-direction:column;min-height:80vh;padding-bottom:120px}.module-header{align-items:center;animation:slideInRight .6s cubic-bezier(.4,0,.2,1);animation:slideInRight .6s var(--transition-smooth);border-bottom:2px solid #e1e4e8;border-bottom:2px solid var(--border-color);display:flex;justify-content:space-between;margin-bottom:2rem;padding-bottom:1.5rem}.module-description{color:#6c757d;color:var(--secondary-color);font-size:1.05rem;line-height:1.8;margin-top:.5rem}.visualization{animation:scaleIn .6s cubic-bezier(.4,0,.2,1);animation:scaleIn .6s var(--transition-smooth);background:#fff;background:var(--card-bg);border:1px solid #e1e4e8;border:1px solid var(--border-color);border-radius:12px;color:#2c3e50;color:var(--text-color);margin-top:24px;padding:20px;transition:all .3s cubic-bezier(.4,0,.2,1);transition:all var(--transition-speed) var(--transition-smooth)}.visualization:hover{border-color:#4a90e2;border-color:var(--primary-color);box-shadow:0 8px 32px #00000026;box-shadow:0 8px 32px var(--shadow-hover);transform:translateY(-4px)}.visualization-title{color:#4a90e2;color:var(--primary-color);font-size:1.1rem;font-weight:600;margin-bottom:12px}.visualization-description{color:#6c757d;color:var(--secondary-color);font-size:.9rem;font-style:italic;line-height:1.6;margin-bottom:16px}.timeline-bar{align-items:center;animation:slideInLeft .6s cubic-bezier(.4,0,.2,1);animation:slideInLeft .6s var(--transition-smooth);background:linear-gradient(180deg,#f8f9fa,#fff);background:linear-gradient(180deg,var(--timeline-bg) 0,var(--card-bg) 100%);border-top:2px solid #e1e4e8;border-top:2px solid var(--border-color);box-shadow:0 -4px 20px #00000014;box-shadow:0 -4px 20px var(--shadow-color);display:flex;height:120px;margin-top:1rem;padding:0 1.5rem;position:relative;z-index:10}.timeline-label{color:#2c3e50;color:var(--text-color);font-size:1rem;font-weight:700;letter-spacing:.05em;margin-right:2rem;text-transform:uppercase;white-space:nowrap}.timeline-steps{align-items:center;display:flex;flex-wrap:nowrap;gap:12px;max-width:100%;overflow-x:auto;overflow-y:hidden;padding:.5rem 0;scrollbar-color:#4a90e2 #0000;scrollbar-color:var(--primary-color) #0000;scrollbar-width:thin}.timeline-steps::-webkit-scrollbar{height:8px}.timeline-steps::-webkit-scrollbar-track{background:#0000;border-radius:10px}.timeline-steps::-webkit-scrollbar-thumb{background:linear-gradient(90deg,#4a90e2,#667eea);background:linear-gradient(90deg,var(--primary-color),var(--accent-color));border-radius:10px;-webkit-transition:all .3s;transition:all .3s;-webkit-transition:all var(--transition-speed);transition:all var(--transition-speed)}.timeline-steps::-webkit-scrollbar-thumb:hover{background:linear-gradient(90deg,#667eea,#4a90e2);background:linear-gradient(90deg,var(--accent-color),var(--primary-color))}.timeline-step{background:#fff;background:var(--card-bg);border:2px solid #e1e4e8;border:2px solid var(--border-color);border-radius:12px;box-shadow:0 2px 8px #00000014;box-shadow:0 2px 8px var(--shadow-color);color:#2c3e50;color:var(--text-color);cursor:pointer;display:flex;flex-direction:column;height:80px;justify-content:center;min-width:140px;overflow:hidden;padding:12px 16px;position:relative;transition:all .3s cubic-bezier(.68,-.55,.265,1.55);transition:all var(--transition-speed) var(--transition-bounce)}.timeline-step:before{background:linear-gradient(90deg,#0000,#667eea1a,#0000);content:"";height:100%;left:-100%;position:absolute;top:0;transition:left .6s;width:100%}.timeline-step:hover:before{left:100%}.timeline-step.active{background:linear-gradient(135deg,#4a90e2,#667eea);background:linear-gradient(135deg,var(--primary-color) 0,var(--accent-color) 100%);border-color:#4a90e2;border-color:var(--primary-color);box-shadow:0 8px 24px #667eea66;color:#fff;transform:scale(1.05)}.timeline-step.disabled{border-color:#e1e4e8;border-color:var(--border-color);cursor:not-allowed;opacity:.4}.timeline-step:not(.disabled):hover{border-color:#4a90e2;border-color:var(--primary-color);box-shadow:0 8px 24px #00000026;box-shadow:0 8px 24px var(--shadow-hover);transform:translateY(-4px) scale(1.02)}.step-number{font-size:.95rem;font-weight:700;margin-bottom:.25rem}.step-title{font-size:.85rem;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.terminal{animation:scaleIn .6s cubic-bezier(.4,0,.2,1);animation:scaleIn .6s var(--transition-smooth);background:linear-gradient(135deg,#1e1e1e,#252525);background:linear-gradient(135deg,var(--terminal-bg) 0,#252525 100%);border:1px solid #e1e4e8;border:1px solid var(--border-color);border-radius:12px;box-shadow:0 4px 20px #00000014;box-shadow:0 4px 20px var(--shadow-color);color:#f1f1f1;color:var(--terminal-text);font-family:Fira Code,Courier New,Courier,monospace;height:240px;margin-bottom:1rem;overflow-y:auto;padding:1.5rem;transition:all .3s cubic-bezier(.4,0,.2,1);transition:all var(--transition-speed) var(--transition-smooth)}.terminal:hover{border-color:#28a745;border-color:var(--success-color);box-shadow:0 8px 32px #00000026;box-shadow:0 8px 32px var(--shadow-hover)}.terminal-input{background:#1e1e1e;background:var(--terminal-bg);border-radius:0 0 12px 12px;border-top:1px solid #e1e4e8;border-top:1px solid var(--border-color);display:flex;padding:.75rem 1.5rem}.terminal-prompt{color:#28a745;color:var(--success-color);font-weight:700;margin-right:.75rem}.terminal-command{background:#0000;border:none;color:#f1f1f1;color:var(--terminal-text);flex:1 1;font-family:Fira Code,Courier New,Courier,monospace;font-size:1rem;outline:none}.content-container{animation:fadeIn .6s cubic-bezier(.4,0,.2,1);animation:fadeIn .6s var(--transition-smooth);display:flex;flex:1 1;gap:1.5rem;margin-bottom:1rem}.file-structure{animation:slideInRight .6s cubic-bezier(.4,0,.2,1);animation:slideInRight .6s var(--transition-smooth);background:#fff;background:var(--card-bg);border:1px solid #e1e4e8;border:1px solid var(--border-color);border-radius:12px;box-shadow:0 4px 20px #00000014;box-shadow:0 4px 20px var(--shadow-color);color:#2c3e50;color:var(--text-color);overflow-y:auto;padding:1.5rem;transition:all .3s cubic-bezier(.4,0,.2,1);transition:all var(--transition-speed) var(--transition-smooth);width:280px}.file-structure:hover{border-color:#4a90e2;border-color:var(--primary-color);box-shadow:0 8px 32px #00000026;box-shadow:0 8px 32px var(--shadow-hover)}.guidance-interface{animation:slideInLeft .6s cubic-bezier(.4,0,.2,1);animation:slideInLeft .6s var(--transition-smooth);background:#fff;background:var(--card-bg);border:1px solid #e1e4e8;border:1px solid var(--border-color);border-radius:12px;box-shadow:0 4px 20px #00000014;box-shadow:0 4px 20px var(--shadow-color);flex:1 1;overflow-y:auto;padding:1.5rem;transition:all .3s cubic-bezier(.4,0,.2,1);transition:all var(--transition-speed) var(--transition-smooth)}.guidance-interface:hover{box-shadow:0 8px 32px #00000026;box-shadow:0 8px 32px var(--shadow-hover)}.tabs{background:#fff;background:var(--card-bg);border-bottom:2px solid #e1e4e8;border-bottom:2px solid var(--border-color);border-radius:12px 12px 0 0;display:flex;margin-bottom:1.5rem}.tab,.tabs{overflow:hidden}.tab{background:#0000;border-bottom:3px solid #0000;color:#2c3e50;color:var(--text-color);cursor:pointer;font-weight:600;padding:1rem 1.5rem;position:relative;text-align:center;transition:all .3s cubic-bezier(.4,0,.2,1);transition:all var(--transition-speed) var(--transition-smooth)}.tab:before{background:linear-gradient(90deg,#4a90e2,#667eea);background:linear-gradient(90deg,var(--primary-color),var(--accent-color));bottom:0;content:"";height:3px;left:0;position:absolute;transform:scaleX(0);transform-origin:left;transition:transform .3s cubic-bezier(.4,0,.2,1);transition:transform var(--transition-speed) var(--transition-smooth);width:100%}.tab:hover{background:#667eea0d;color:#4a90e2;color:var(--primary-color)}.tab:hover:before{transform:scaleX(1)}.tab.active{background:#667eea1a;color:#4a90e2;color:var(--primary-color)}.tab.active:before{transform:scaleX(1)}.tabs-container{animation:fadeIn .6s ease-out;background:#fff;background:var(--card-bg);border-radius:12px;box-shadow:0 2px 8px #0000001a;margin-bottom:1.5rem;overflow:hidden;transition:cubic-bezier(.4,0,.2,1);transition:var(--transition-smooth)}.tabs-container:hover{box-shadow:0 4px 12px #00000026}.tab-content{animation:fadeIn .4s ease-out;padding:1.5rem}.module-node,.tab-content{background:#fff;background:var(--card-bg)}.module-node{align-items:center;border:3px solid #4a90e2;border:3px solid var(--primary-color);border-radius:16px;box-shadow:0 4px 16px #00000014;box-shadow:0 4px 16px var(--shadow-color);color:#2c3e50;color:var(--text-color);cursor:pointer;display:flex;flex-direction:column;height:110px;justify-content:center;overflow:hidden;padding:1.25rem;position:absolute;transition:all .3s cubic-bezier(.68,-.55,.265,1.55);transition:all var(--transition-speed) var(--transition-bounce);width:200px}.module-node:before{background:linear-gradient(90deg,#0000,#fff3,#0000);content:"";height:100%;left:-100%;position:absolute;top:0;transition:left .6s;width:100%}.module-node:hover:before{left:100%}.module-node:hover{animation:float 2s ease-in-out infinite;box-shadow:0 12px 32px #00000026;box-shadow:0 12px 32px var(--shadow-hover);transform:translateY(-8px) scale(1.05)}.module-node h3{font-size:1.05rem;font-weight:700;margin-bottom:.5rem;text-align:center}.module-node p{color:#6c757d;color:var(--secondary-color);font-size:.85rem;line-height:1.4;text-align:center}.btn,.next-step-button{align-items:center;background:linear-gradient(135deg,#4a90e2,#667eea);background:linear-gradient(135deg,var(--primary-color) 0,var(--accent-color) 100%);border:none;border-radius:12px;box-shadow:0 4px 16px #667eea4d;color:#fff;cursor:pointer;display:inline-flex;font-size:1rem;font-weight:600;justify-content:center;overflow:hidden;padding:.875rem 1.75rem;position:relative;transition:all .3s cubic-bezier(.68,-.55,.265,1.55);transition:all var(--transition-speed) var(--transition-bounce)}.btn:before,.next-step-button:before{background:linear-gradient(90deg,#0000,#ffffff4d,#0000);content:"";height:100%;left:-100%;position:absolute;top:0;transition:left .6s;width:100%}.btn:hover:before,.next-step-button:hover:before{left:100%}.btn:hover,.next-step-button:hover{box-shadow:0 8px 24px #667eea80;transform:translateY(-2px) scale(1.02)}.btn:active,.next-step-button:active{transform:translateY(0) scale(.98)}.debug-toggle{align-items:center;background:#fff;background:var(--card-bg);border:1px solid #e1e4e8;border:1px solid var(--border-color);border-radius:8px;color:#2c3e50;color:var(--text-color);cursor:pointer;display:flex;font-size:.9rem;gap:.75rem;margin-bottom:1rem;padding:.75rem 1rem;transition:all .3s cubic-bezier(.4,0,.2,1);transition:all var(--transition-speed) var(--transition-smooth);-webkit-user-select:none;user-select:none}.debug-toggle:hover{background:#667eea0d;border-color:#4a90e2;border-color:var(--primary-color);transform:translateX(4px)}.debug-toggle input[type=checkbox]{accent-color:#4a90e2;accent-color:var(--primary-color);cursor:pointer;height:20px;width:20px}@media (max-width:768px){.content-container{flex-direction:column;gap:1rem}.file-structure{max-height:250px;width:100%}.App-header h1{font-size:1.4rem}.timeline-step{height:70px;min-width:120px}}::-webkit-scrollbar{height:12px;width:12px}::-webkit-scrollbar-track{background:#f8f9fa;background:var(--bg-color);border-radius:10px}::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#4a90e2,#667eea);background:linear-gradient(180deg,var(--primary-color),var(--accent-color));border:2px solid #f8f9fa;border:2px solid var(--bg-color);border-radius:10px}::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#667eea,#4a90e2);background:linear-gradient(180deg,var(--accent-color),var(--primary-color))}.react-flow__node.animated-node{animation:fadeIn .6s ease-out forwards}.react-flow__node.animated-node:hover{box-shadow:0 8px 24px #667eea4d!important;transform:scale(1.05) translateY(-4px);z-index:10}.react-flow__node.animated-node:active{transform:scale(.98)}.react-flow__edge-path{transition:stroke-width .3s ease,stroke .3s ease}.react-flow__edge:hover .react-flow__edge-path{stroke:#667eea;stroke:var(--accent-color)}.react-flow__edge.animated{animation:pulse 2s ease-in-out infinite}.react-flow__controls{border:1px solid #e1e4e8;box-shadow:0 2px 8px #0000001a}.react-flow__controls,.react-flow__controls button{background:#fff;transition:cubic-bezier(.4,0,.2,1);transition:var(--transition-smooth)}.react-flow__controls button{border-bottom:1px solid #e1e4e8;color:#2c3e50}.react-flow__controls button:hover{background:#4a90e2}.react-flow__background{background:#f8f9fa}.module-node-content h3{color:#1a1a1a;font-size:1rem;margin:0 0 8px;transition:color .3s ease}.module-node-content p{color:#666;font-size:.85rem;transition:color .3s ease}.react-flow__node.animated-node:hover .module-node-content h3{color:#4a90e2}.react-flow__node.animated-node:hover .module-node-content p{color:#333}body.dark-mode .react-flow__node.animated-node{background:#fff!important}body.dark-mode .react-flow__node.animated-node:hover .module-node-content h3{color:#764ba2}body.dark-mode .react-flow__controls,body.dark-mode .react-flow__controls button{background:#2d2d2d;border-color:#444}body.dark-mode .react-flow__controls button:hover{background:#667eea}.fade-enter{opacity:0;transform:translateY(20px)}.fade-enter-active{transition:opacity .4s ease-out,transform .4s cubic-bezier(.4,0,.2,1);transition:opacity .4s ease-out,transform .4s var(--transition-smooth)}.fade-enter-active,.fade-exit{opacity:1;transform:translateY(0)}.fade-exit-active{opacity:0;transform:translateY(-20px);transition:opacity .3s ease-in,transform .3s cubic-bezier(.4,0,.2,1);transition:opacity .3s ease-in,transform .3s var(--transition-smooth)}.react-flow{direction:ltr}.react-flow__container{height:100%;left:0;position:absolute;top:0;width:100%}.react-flow__pane{cursor:grab;z-index:1}.react-flow__pane.selection{cursor:pointer}.react-flow__pane.dragging{cursor:grabbing}.react-flow__viewport{pointer-events:none;transform-origin:0 0;z-index:2}.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{overflow:visible;pointer-events:none}.react-flow__connection-path,.react-flow__edge-path{stroke:#b1b1b7;stroke-width:1;fill:none}.react-flow__edge{cursor:pointer;pointer-events:visibleStroke}.react-flow__edge.animated path{stroke-dasharray:5;animation:dashdraw .5s linear infinite}.react-flow__edge.animated path.react-flow__edge-interaction{stroke-dasharray: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;user-select:none}.react-flow__connection{pointer-events:none}.react-flow__connection .animated{stroke-dasharray:5;animation:dashdraw .5s linear infinite}.react-flow__connectionline{z-index:1001}.react-flow__nodes{pointer-events:none;transform-origin:0 0}.react-flow__node{box-sizing:border-box;cursor:grab;pointer-events:all;position:absolute;transform-origin:0 0;-webkit-user-select:none;user-select:none}.react-flow__node.dragging{cursor:grabbing}.react-flow__nodesselection{pointer-events:none;transform-origin:left top;z-index:3}.react-flow__nodesselection-rect{cursor:grab;pointer-events:all;position:absolute}.react-flow__handle{background:#1a192b;border:1px solid #fff;border-radius:100%;height:6px;min-height:5px;min-width:5px;pointer-events:none;position:absolute;width:6px}.react-flow__handle.connectionindicator{cursor:crosshair;pointer-events:all}.react-flow__handle-bottom{bottom:-4px;left:50%;top:auto;transform:translate(-50%)}.react-flow__handle-top{left:50%;top:-4px;transform:translate(-50%)}.react-flow__handle-left{left:-4px;top:50%;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{margin:15px;position:absolute;z-index:5}.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:translateX(-50%)}.react-flow__attribution{background:#ffffff80;font-size:10px;margin:0;padding:2px 3px}.react-flow__attribution a{color:#999;text-decoration:none}@keyframes dashdraw{0%{stroke-dashoffset:10}}.react-flow__edgelabel-renderer{height:100%;pointer-events:none;position:absolute;-webkit-user-select:none;user-select:none;width:100%}.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-group,.react-flow__node-input,.react-flow__node-output{background-color:#fff;border:1px solid #1a192b;border-radius:3px;color:#222;font-size:12px;padding:10px;text-align:center;width:150px}.react-flow__node-default.selectable:hover,.react-flow__node-group.selectable:hover,.react-flow__node-input.selectable:hover,.react-flow__node-output.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-group.selectable.selected,.react-flow__node-group.selectable:focus,.react-flow__node-group.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{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 #0059dccc}.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{align-items:center;background:#fefefe;border:none;border-bottom:1px solid #eee;box-sizing:initial;cursor:pointer;display:flex;height:16px;justify-content:center;padding:5px;-webkit-user-select:none;user-select:none;width:16px}.react-flow__controls-button:hover{background:#f4f4f4}.react-flow__controls-button svg{max-height:12px;max-width:12px;width:100%}.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.bottom,.react-flow__resize-control.top{cursor:ns-resize}.react-flow__resize-control.bottom.right,.react-flow__resize-control.top.left{cursor:nwse-resize}.react-flow__resize-control.bottom.left,.react-flow__resize-control.top.right{cursor:nesw-resize}.react-flow__resize-control.handle{background-color:#3367d9;border:1px solid #fff;border-radius:1px;height:4px;transform:translate(-50%,-50%);width:4px}.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.bottom.left,.react-flow__resize-control.handle.top.left{left:0}.react-flow__resize-control.handle.bottom.right,.react-flow__resize-control.handle.top.right{left:100%}.react-flow__resize-control.line{border:0 solid #3367d9}.react-flow__resize-control.line.left,.react-flow__resize-control.line.right{height:100%;top:0;transform:translate(-50%);width:1px}.react-flow__resize-control.line.left{border-left-width:1px;left:0}.react-flow__resize-control.line.right{border-right-width:1px;left:100%}.react-flow__resize-control.line.bottom,.react-flow__resize-control.line.top{height:1px;left:0;transform:translateY(-50%);width:100%}.react-flow__resize-control.line.top{border-top-width:1px;top:0}.react-flow__resize-control.line.bottom{border-bottom-width:1px;top:100%}.learning-journey{animation:scaleIn .6s var(--transition-smooth);background:var(--card-bg);border-radius:16px;box-shadow:0 8px 32px var(--shadow-color);height:85vh;overflow:hidden;position:relative;transition:all var(--transition-speed) var(--transition-smooth);width:100%}.learning-journey .react-flow{height:100%;width:100%}.learning-journey:hover{box-shadow:0 12px 48px var(--shadow-hover)}.learning-journey .loading-container{color:var(--secondary-color);font-size:1.2rem;height:100%}.graph-legend,.learning-journey .loading-container{align-items:center;display:flex;justify-content:center}.graph-legend{animation:slideUp .5s var(--transition-smooth);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);background:var(--card-bg);border:1px solid var(--border-color);border-radius:12px;bottom:20px;box-shadow:0 4px 20px var(--shadow-color);flex-wrap:wrap;gap:16px;left:20px;margin:0 auto;max-width:500px;padding:12px 20px;position:absolute;right:20px;z-index:10}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.legend-item{align-items:center;background:var(--bg-color);border:1px solid var(--border-color);border-radius:20px;cursor:default;display:flex;gap:8px;padding:6px 12px;transition:all var(--transition-speed) var(--transition-smooth);-webkit-user-select:none;user-select:none}.legend-item:hover{box-shadow:0 4px 12px var(--shadow-color);transform:translateY(-2px)}.legend-color{border-radius:50%;box-shadow:0 0 0 1px #0000001a;flex-shrink:0;height:12px;min-height:12px;min-width:12px;width:12px}.legend-label{color:var(--text-color);font-size:.85rem;font-weight:500;line-height:1;white-space:nowrap}@media (max-width:600px){.graph-legend{bottom:10px;gap:10px;left:10px;padding:10px 14px;right:10px}.legend-item{gap:6px;padding:5px 10px}.legend-color{height:10px;min-height:10px;min-width:10px;width:10px}.legend-label{font-size:.75rem}}@media (max-width:400px){.graph-legend{flex-direction:column;gap:6px}.legend-item{justify-content:center;width:100%}}.react-flow__node.animated-node{animation:fadeIn .4s ease-out forwards}.react-flow__node.animated-node:hover{box-shadow:0 12px 28px var(--shadow-hover)!important;transform:translateY(-4px)!important;z-index:10!important}.react-flow__node.animated-node:active{transform:translateY(-2px)!important;transition:transform .1s ease}.module-node-content{padding:4px;text-align:center}.module-node-content h3{color:var(--text-color);font-size:.95rem;font-weight:600;line-height:1.3;margin:0 0 6px;transition:color .2s ease}.module-node-content p{-webkit-line-clamp:2;-webkit-box-orient:vertical;color:var(--secondary-color);display:-webkit-box;font-size:.8rem;line-height:1.4;margin:0;overflow:hidden;transition:color .2s ease}.react-flow__node.animated-node:hover .module-node-content h3{color:var(--primary-color)}.react-flow__node.animated-node:hover .module-node-content p{color:var(--text-color)}.react-flow__edge-path{stroke-width:2;transition:stroke-width .2s ease,stroke .2s ease}.react-flow__edge:hover .react-flow__edge-path{stroke-width:3}.react-flow__edge.animated .react-flow__edge-path{stroke-dasharray:5;animation:flowDash 1s linear infinite}@keyframes flowDash{to{stroke-dashoffset:-10}}.react-flow__controls{background:var(--card-bg);border:1px solid var(--border-color);border-radius:8px;box-shadow:0 2px 8px var(--shadow-color);overflow:hidden}.react-flow__controls button{align-items:center;background:var(--card-bg);border:none;border-bottom:1px solid var(--border-color);color:var(--text-color);display:flex;height:28px;justify-content:center;padding:0;transition:all .2s ease;width:28px}.react-flow__controls button:last-child{border-bottom:none}.react-flow__controls button:hover{background:var(--primary-color);color:#fff}.react-flow__controls button svg{fill:currentColor}.react-flow__background{background:var(--bg-color)}body.dark-mode .react-flow__node.animated-node{background:var(--card-bg)!important}body.dark-mode .module-node-content h3{color:#f0f0f0}body.dark-mode .module-node-content p{color:#aaa}body.dark-mode .react-flow__node.animated-node:hover .module-node-content h3{color:var(--accent-light)}body.dark-mode .react-flow__node.animated-node:hover .module-node-content p{color:#ddd}body.dark-mode .react-flow__controls,body.dark-mode .react-flow__controls button{background:var(--card-bg);border-color:var(--border-color)}body.dark-mode .react-flow__controls button{color:#f0f0f0}body.dark-mode .react-flow__controls button:hover{background:var(--accent-color)}body.dark-mode .graph-legend{background:#161b22f2}body.dark-mode .legend-item{background:var(--bg-color);border-color:var(--border-color)}body.dark-mode .legend-color{box-shadow:0 0 0 1px #ffffff1a}
/*# sourceMappingURL=main.75971385.css.map*/