.login-container[data-v-4496ac6d]{min-height:100vh;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.login-background[data-v-4496ac6d]{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(135deg,#667eea,#764ba2);z-index:0}.login-background[data-v-4496ac6d]:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E")}.login-card[data-v-4496ac6d]{position:relative;z-index:1;background:#fffffffa;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:24px;padding:48px;width:100%;max-width:480px;box-shadow:0 20px 60px #0000004d}.login-header[data-v-4496ac6d]{text-align:center;margin-bottom:32px}.logo[data-v-4496ac6d]{display:flex;justify-content:center;margin-bottom:16px}.login-header h1[data-v-4496ac6d]{font-size:28px;font-weight:800;background:linear-gradient(135deg,#4f46e5,#7c3aed);-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:8px}.login-header p[data-v-4496ac6d]{color:#6b7280;font-size:14px}.login-form[data-v-4496ac6d]{margin-bottom:32px}.form-group[data-v-4496ac6d]{margin-bottom:20px}.form-group label[data-v-4496ac6d]{display:block;margin-bottom:8px;font-weight:600;color:#374151;font-size:14px}.form-group input[data-v-4496ac6d]{width:100%;padding:12px 16px;border:2px solid #E5E7EB;border-radius:12px;font-size:15px;transition:all .2s;font-family:inherit}.form-group input[data-v-4496ac6d]:focus{outline:none;border-color:#4f46e5;box-shadow:0 0 0 3px #4f46e51a}.error-message[data-v-4496ac6d]{background:#fee2e2;border:1px solid #EF4444;color:#dc2626;padding:12px 16px;border-radius:8px;margin-bottom:16px;font-size:14px}.login-button[data-v-4496ac6d]{width:100%;padding:14px;background:linear-gradient(135deg,#4f46e5,#7c3aed);color:#fff;border:none;border-radius:12px;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s}.login-button[data-v-4496ac6d]:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 10px 20px #4f46e54d}.login-button[data-v-4496ac6d]:disabled{opacity:.6;cursor:not-allowed}.demo-accounts[data-v-4496ac6d]{border-top:2px solid #E5E7EB;padding-top:24px}.demo-accounts h3[data-v-4496ac6d]{font-size:14px;font-weight:600;color:#6b7280;margin-bottom:12px;text-align:center}.demo-grid[data-v-4496ac6d]{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.demo-account[data-v-4496ac6d]{background:#f3f4f6;border:2px solid #E5E7EB;border-radius:8px;padding:12px 8px;text-align:center;cursor:pointer;transition:all .2s}.demo-account[data-v-4496ac6d]:hover{background:#e5e7eb;border-color:#4f46e5;transform:translateY(-2px)}.demo-account strong[data-v-4496ac6d]{display:block;font-size:13px;color:#374151;margin-bottom:4px}.demo-account span[data-v-4496ac6d]{display:block;font-size:11px;color:#6b7280;font-family:JetBrains Mono,monospace}[data-v-acc41936]{margin:0;padding:0;box-sizing:border-box}[data-v-acc41936]:root{--primary-600: #4F46E5;--primary-700: #4338CA;--primary-500: #6366F1;--purple-600: #7C3AED;--purple-700: #6D28D9;--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;--success-500: #10B981;--success-600: #059669;--warning-500: #F59E0B;--error-500: #EF4444;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--spacing-2xl: 3rem;--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono: "JetBrains Mono", "Fira Code", "Consolas", monospace;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04);--radius-sm: .375rem;--radius-md: .5rem;--radius-lg: .75rem;--radius-xl: 1rem;--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-base: .25s cubic-bezier(.4, 0, .2, 1);--transition-slow: .35s cubic-bezier(.4, 0, .2, 1)}body[data-v-acc41936]{font-family:var(--font-sans);background:linear-gradient(135deg,#667eea,#764ba2);background-attachment:fixed;color:var(--gray-800);line-height:1.6;overflow-x:hidden}.header[data-v-acc41936]{background:#fffffff2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--gray-200);position:sticky;top:0;z-index:100;box-shadow:var(--shadow-sm)}.header-content[data-v-acc41936]{max-width:1920px;margin:0 auto;padding:var(--spacing-md) var(--spacing-xl);display:flex;justify-content:space-between;align-items:center}.logo[data-v-acc41936]{display:flex;align-items:center;gap:var(--spacing-md);font-weight:700;font-size:1.25rem;color:var(--gray-900)}.logo-text[data-v-acc41936]{background:linear-gradient(135deg,var(--primary-600),var(--purple-600));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.nav[data-v-acc41936]{display:flex;gap:var(--spacing-xl)}.nav-link[data-v-acc41936]{text-decoration:none;color:var(--gray-600);font-weight:500;padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-md);transition:all var(--transition-base);position:relative}.nav-link[data-v-acc41936]:hover{color:var(--primary-600);background:var(--gray-50)}.nav-link.active[data-v-acc41936]{color:var(--primary-600)}.nav-link.active[data-v-acc41936]:after{content:"";position:absolute;bottom:-1rem;left:50%;transform:translate(-50%);width:60%;height:3px;background:linear-gradient(90deg,var(--primary-600),var(--purple-600));border-radius:2px}.container[data-v-acc41936]{max-width:1920px;margin:0 auto;display:grid;grid-template-columns:320px 1fr;gap:var(--spacing-xl);padding:var(--spacing-xl);min-height:calc(100vh - 80px)}.sidebar[data-v-acc41936]{background:#fffffffa;border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);padding:var(--spacing-xl);height:fit-content;max-height:calc(100vh - 120px);overflow-y:auto;position:sticky;top:100px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.sidebar[data-v-acc41936]::-webkit-scrollbar{width:6px}.sidebar[data-v-acc41936]::-webkit-scrollbar-track{background:var(--gray-100);border-radius:3px}.sidebar[data-v-acc41936]::-webkit-scrollbar-thumb{background:var(--gray-300);border-radius:3px}.sidebar[data-v-acc41936]::-webkit-scrollbar-thumb:hover{background:var(--gray-400)}.sidebar-header[data-v-acc41936]{margin-bottom:var(--spacing-xl);padding-bottom:var(--spacing-lg);border-bottom:2px solid var(--gray-100)}.sidebar-header h2[data-v-acc41936]{font-size:1.5rem;font-weight:700;color:var(--gray-900);margin-bottom:var(--spacing-lg)}.progress-indicator[data-v-acc41936]{display:flex;justify-content:center}.progress-circle[data-v-acc41936]{position:relative;width:48px;height:48px}.progress-circle svg[data-v-acc41936]{transform:rotate(-90deg)}.progress-text[data-v-acc41936]{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:.75rem;font-weight:700;color:var(--primary-600)}.sidebar-content[data-v-acc41936]{display:flex;flex-direction:column;gap:var(--spacing-lg)}.topic-section[data-v-acc41936]{border-radius:var(--radius-lg);overflow:hidden;transition:all var(--transition-base)}.topic-section.active[data-v-acc41936]{background:linear-gradient(135deg,#4f46e50d,#7c3aed0d)}.topic-header[data-v-acc41936]{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-md);cursor:pointer;-webkit-user-select:none;user-select:none}.topic-icon[data-v-acc41936]{font-size:1.5rem}.topic-header h3[data-v-acc41936]{font-size:1rem;font-weight:600;color:var(--gray-800)}.lesson-list[data-v-acc41936]{list-style:none;padding:0 var(--spacing-sm)}.lesson-item[data-v-acc41936]{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-md) var(--spacing-lg);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-base);margin-bottom:var(--spacing-xs);font-weight:200}.lesson-item[data-v-acc41936]:hover{background:#4f46e514;transform:translate(4px)}.lesson-item.active[data-v-acc41936]{background:#bfdbfe;color:#ccf807;box-shadow:var(--shadow-md)}.lesson-item.completed .lesson-status[data-v-acc41936]{color:var(--success-500);font-weight:700}.lesson-item.active .lesson-status[data-v-acc41936]{color:#38e005}.lesson-status[data-v-acc41936]{width:20px;text-align:center;font-size:.875rem}.lesson-title[data-v-acc41936]{flex:1;font-size:.8rem;font-weight:200;color:#05d321}.lesson-item.active .lesson-title[data-v-acc41936]{font-weight:200;color:#05d321}.main-content[data-v-acc41936]{background:#fffffffa;border-radius:var(--radius-xl);box-shadow:var(--shadow-xl);overflow:hidden;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.content-wrapper[data-v-acc41936]{display:grid;grid-template-rows:1fr auto;height:calc(100vh - 120px)}.lesson-content[data-v-acc41936]{padding:var(--spacing-2xl);overflow-y:auto}.lesson-content[data-v-acc41936]::-webkit-scrollbar{width:8px}.lesson-content[data-v-acc41936]::-webkit-scrollbar-track{background:var(--gray-100)}.lesson-content[data-v-acc41936]::-webkit-scrollbar-thumb{background:var(--gray-300);border-radius:4px}.lesson-content[data-v-acc41936]::-webkit-scrollbar-thumb:hover{background:var(--gray-400)}.lesson-header[data-v-acc41936]{margin-bottom:var(--spacing-xl);padding-bottom:var(--spacing-lg);border-bottom:3px solid var(--gray-100);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--spacing-md)}.lesson-main-title[data-v-acc41936]{font-size:1.5rem;font-weight:600;background:linear-gradient(135deg,var(--primary-600),var(--purple-600));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:0;flex:1 1 auto;color:#05d321}.lesson-meta[data-v-acc41936]{display:flex;gap:var(--spacing-lg);font-size:.9rem;color:var(--gray-600);align-items:center;flex-wrap:wrap}.lesson-intro[data-v-acc41936]{background:linear-gradient(135deg,#4f46e50d,#7c3aed0d);border-left:4px solid var(--primary-600);padding:var(--spacing-lg);border-radius:var(--radius-md);margin-bottom:var(--spacing-xl)}.lesson-intro p[data-v-acc41936]{margin-bottom:var(--spacing-md);font-size:1.05rem;line-height:1.7}.lesson-intro p[data-v-acc41936]:last-child{margin-bottom:0}.content-section[data-v-acc41936]{margin-bottom:var(--spacing-2xl);animation:fadeInUp-acc41936 .6s ease-out}@keyframes fadeInUp-acc41936{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.section-title[data-v-acc41936]{display:flex;align-items:center;gap:var(--spacing-md);font-size:1.75rem;font-weight:700;color:var(--gray-900);margin-bottom:var(--spacing-lg)}.section-icon[data-v-acc41936]{font-size:1.5rem}.section-content p[data-v-acc41936]{margin-bottom:var(--spacing-md);font-size:1.05rem;line-height:1.8;color:var(--gray-700)}.code-example[data-v-acc41936]{background:var(--gray-900);border-radius:var(--radius-lg);overflow:hidden;margin:var(--spacing-lg) 0;box-shadow:var(--shadow-lg)}.code-header[data-v-acc41936]{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-md) var(--spacing-lg);background:#0000004d;border-bottom:1px solid rgba(255,255,255,.1)}.code-label[data-v-acc41936]{color:var(--gray-300);font-size:.875rem;font-weight:500}.copy-btn[data-v-acc41936]{display:flex;align-items:center;gap:var(--spacing-sm);background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:var(--gray-300);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-sm);cursor:pointer;font-size:.875rem;transition:all var(--transition-base)}.copy-btn[data-v-acc41936]:hover{background:#fff3;color:#fff}.code-example pre[data-v-acc41936]{margin:0;padding:var(--spacing-lg);overflow-x:auto}.code-example code[data-v-acc41936]{font-family:var(--font-mono);font-size:.95rem;line-height:1.6;color:#e5e7eb}.operator-grid[data-v-acc41936]{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--spacing-md);margin:var(--spacing-lg) 0}.operator-card[data-v-acc41936]{background:linear-gradient(135deg,#4f46e50d,#7c3aed0d);border:2px solid var(--gray-200);border-radius:var(--radius-lg);padding:var(--spacing-lg);text-align:center;transition:all var(--transition-base)}.operator-card[data-v-acc41936]:hover{border-color:var(--primary-600);transform:translateY(-4px);box-shadow:var(--shadow-md)}.operator-symbol[data-v-acc41936]{font-family:var(--font-mono);font-size:2rem;font-weight:700;color:var(--primary-600);margin-bottom:var(--spacing-sm)}.operator-name[data-v-acc41936]{font-size:.9rem;color:var(--gray-600);font-weight:500}.interactive-section[data-v-acc41936]{background:linear-gradient(135deg,#4f46e508,#7c3aed08);border:2px dashed var(--primary-600);border-radius:var(--radius-xl);padding:var(--spacing-xl)}.exercise-container[data-v-acc41936]{margin-top:var(--spacing-lg)}.exercise-description h3[data-v-acc41936]{font-size:1.25rem;font-weight:600;color:var(--gray-900);margin-bottom:var(--spacing-md)}.hint-box[data-v-acc41936]{background:#f59e0b1a;border-left:4px solid var(--warning-500);padding:var(--spacing-md) var(--spacing-lg);border-radius:var(--radius-md);margin-top:var(--spacing-md)}.hint-box strong[data-v-acc41936]{color:var(--warning-500)}.code-editor-container[data-v-acc41936]{border-top:2px solid var(--gray-200);background:var(--gray-50)}.editor-header[data-v-acc41936]{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-md) var(--spacing-lg);background:#fff;border-bottom:1px solid var(--gray-200)}.editor-tabs[data-v-acc41936]{display:flex;gap:var(--spacing-sm)}.editor-tab[data-v-acc41936]{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);background:var(--gray-100);border-radius:var(--radius-sm);font-size:.875rem;font-weight:500;color:var(--gray-600)}.editor-tab.active[data-v-acc41936]{background:linear-gradient(135deg,var(--primary-600),var(--purple-600));color:#fff}.editor-actions[data-v-acc41936]{display:flex;gap:var(--spacing-sm)}.editor-btn[data-v-acc41936]{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);background:#fff;border:1px solid var(--gray-300);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-base);color:var(--gray-600)}.editor-btn[data-v-acc41936]:hover{background:var(--gray-50);border-color:var(--gray-400)}.run-btn[data-v-acc41936]{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-lg);background:linear-gradient(135deg,var(--primary-600),var(--purple-600));border:none;border-radius:var(--radius-md);color:#fff;font-weight:600;cursor:pointer;transition:all var(--transition-base);box-shadow:var(--shadow-sm)}.run-btn[data-v-acc41936]:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}.run-btn[data-v-acc41936]:active{transform:translateY(0)}.editor-body[data-v-acc41936]{display:flex;background:var(--gray-900);min-height:200px;max-height:300px}.line-numbers[data-v-acc41936]{padding:var(--spacing-md);background:#0003;color:var(--gray-500);font-family:var(--font-mono);font-size:.9rem;line-height:1.6;text-align:right;-webkit-user-select:none;user-select:none;border-right:1px solid rgba(255,255,255,.1);white-space:pre-wrap;overflow-y:hidden}.code-editor[data-v-acc41936]{flex:1;padding:var(--spacing-md);background:transparent;border:none;outline:none;color:#e5e7eb;font-family:var(--font-mono);font-size:.9rem;line-height:1.6;resize:none;overflow-y:auto}.code-editor[data-v-acc41936]::-webkit-scrollbar{width:8px;height:8px}.code-editor[data-v-acc41936]::-webkit-scrollbar-track{background:#0003}.code-editor[data-v-acc41936]::-webkit-scrollbar-thumb{background:#fff3;border-radius:4px}.code-editor[data-v-acc41936]::-webkit-scrollbar-thumb:hover{background:#ffffff4d}.output-container[data-v-acc41936]{background:#fff;border-top:1px solid var(--gray-200)}.output-header[data-v-acc41936]{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-md) var(--spacing-lg);background:var(--gray-50);border-bottom:1px solid var(--gray-200)}.output-label[data-v-acc41936]{display:flex;align-items:center;gap:var(--spacing-sm);font-size:.875rem;font-weight:600;color:var(--gray-700)}.clear-output-btn[data-v-acc41936]{padding:var(--spacing-xs) var(--spacing-md);background:transparent;border:1px solid var(--gray-300);border-radius:var(--radius-sm);color:var(--gray-600);font-size:.875rem;cursor:pointer;transition:all var(--transition-base)}.clear-output-btn[data-v-acc41936]:hover{background:var(--gray-100);border-color:var(--gray-400)}.output-content[data-v-acc41936]{padding:var(--spacing-lg);font-family:var(--font-mono);font-size:.9rem;line-height:1.6;color:var(--gray-700);min-height:100px;max-height:200px;overflow-y:auto;white-space:pre-wrap}.output-content.error[data-v-acc41936]{color:var(--error-500)}.output-content.success[data-v-acc41936]{color:var(--success-600)}.lesson-navigation[data-v-acc41936]{display:flex;justify-content:space-between;padding:var(--spacing-lg) var(--spacing-2xl);background:#fff;border-top:2px solid var(--gray-100)}.nav-btn[data-v-acc41936]{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-md) var(--spacing-xl);background:#fff;border:2px solid var(--gray-300);border-radius:var(--radius-lg);font-size:1rem;font-weight:600;color:var(--gray-700);cursor:pointer;transition:all var(--transition-base)}.nav-btn[data-v-acc41936]:hover{background:linear-gradient(135deg,var(--primary-600),var(--purple-600));border-color:transparent;color:#fff;transform:translateY(-2px);box-shadow:var(--shadow-md)}.nav-btn[data-v-acc41936]:disabled{opacity:.5;cursor:not-allowed}.nav-btn[data-v-acc41936]:disabled:hover{background:#fff;color:var(--gray-700);transform:none;box-shadow:none}@media (max-width: 1024px){.container[data-v-acc41936]{grid-template-columns:1fr}.sidebar[data-v-acc41936]{position:static;max-height:none}.content-wrapper[data-v-acc41936]{height:auto}}@media (max-width: 768px){.header-content[data-v-acc41936]{padding:var(--spacing-md)}.nav[data-v-acc41936]{gap:var(--spacing-md)}.container[data-v-acc41936]{padding:var(--spacing-md);gap:var(--spacing-md)}.lesson-content[data-v-acc41936]{padding:var(--spacing-lg)}.lesson-title[data-v-acc41936]{font-size:1rem}.operator-grid[data-v-acc41936]{grid-template-columns:repeat(2,1fr)}}@keyframes pulse-acc41936{0%,to{opacity:1}50%{opacity:.5}}.loading[data-v-acc41936]{animation:pulse-acc41936 2s cubic-bezier(.4,0,.6,1) infinite}.hidden[data-v-acc41936]{display:none}.fade-in[data-v-acc41936]{animation:fadeIn-acc41936 .3s ease-in}@keyframes fadeIn-acc41936{0%{opacity:0}to{opacity:1}}.platform-container[data-v-acc41936]{min-height:100vh;background:linear-gradient(135deg,#667eea,#764ba2);background-attachment:fixed}.welcome-screen[data-v-acc41936]{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;text-align:center;padding:48px}.welcome-screen h1[data-v-acc41936]{font-size:32px;font-weight:800;background:linear-gradient(135deg,#4f46e5,#7c3aed);-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:16px}.welcome-screen p[data-v-acc41936]{font-size:18px;color:#6b7280}.header-right[data-v-acc41936]{display:flex;align-items:center;gap:16px}.user-info[data-v-acc41936]{font-size:14px;color:#374151;font-weight:500}.logout-btn[data-v-acc41936]{padding:8px 16px;background:#fff;border:2px solid #E5E7EB;border-radius:8px;color:#374151;font-weight:600;cursor:pointer;transition:all .2s}.logout-btn[data-v-acc41936]:hover{background:#f3f4f6;border-color:#d1d5db}.complete-btn[data-v-acc41936]{padding:8px 16px;background:#fff;border:2px solid #E5E7EB;border-radius:8px;color:#374151;font-weight:600;cursor:pointer;transition:all .2s;font-size:14px}.complete-btn[data-v-acc41936]:hover{background:#f3f4f6;border-color:#10b981}.complete-btn.completed[data-v-acc41936]{background:#10b981;border-color:#10b981;color:#fff}.lesson-duration[data-v-acc41936]{font-size:12px;color:#9ca3af;margin-left:auto}.lesson-video[data-v-acc41936]{margin:20px 0;width:100%;border-radius:8px;overflow:hidden;box-shadow:0 4px 6px #0000001a;background:#000}.video-player[data-v-acc41936]{width:100%;display:block}.lesson-detail[data-v-acc41936]{margin-top:20px;line-height:1.6;color:#374151}[data-v-acc41936] .lesson-detail h1,[data-v-acc41936] .lesson-detail h2,[data-v-acc41936] .lesson-detail h3{margin-top:1.5em;margin-bottom:.5em;color:#111827}[data-v-acc41936] .lesson-detail p{margin-bottom:1em}[data-v-acc41936] .lesson-detail pre{background:#1f2937;color:#f3f4f6;padding:1rem;border-radius:.5rem;overflow-x:auto;margin-bottom:1em}[data-v-acc41936] .lesson-detail pre code{background:transparent;padding:0;color:inherit}[data-v-acc41936] .lesson-detail code{background:#f3f4f6;padding:.2rem .4rem;border-radius:.25rem;font-family:monospace}.toggle-icon[data-v-acc41936]{margin-left:8px;font-size:10px;opacity:.7}.code-editor-container.is-collapsed[data-v-acc41936]{flex-shrink:0}*{margin:0;padding:0;box-sizing:border-box}:root{--primary-600: #4F46E5;--primary-700: #4338CA;--primary-500: #6366F1;--purple-600: #7C3AED;--purple-700: #6D28D9;--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;--success-500: #10B981;--success-600: #059669;--warning-500: #F59E0B;--error-500: #EF4444;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--spacing-2xl: 3rem;--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono: "JetBrains Mono", "Fira Code", "Consolas", monospace;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04);--radius-sm: .375rem;--radius-md: .5rem;--radius-lg: .75rem;--radius-xl: 1rem;--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-base: .25s cubic-bezier(.4, 0, .2, 1);--transition-slow: .35s cubic-bezier(.4, 0, .2, 1)}body{font-family:var(--font-sans);background:linear-gradient(135deg,#667eea,#764ba2);background-attachment:fixed;color:var(--gray-800);line-height:1.6;overflow-x:hidden}.header{background:#fffffff2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--gray-200);position:sticky;top:0;z-index:100;box-shadow:var(--shadow-sm)}.header-content{max-width:1920px;margin:0 auto;padding:var(--spacing-md) var(--spacing-xl);display:flex;justify-content:space-between;align-items:center}.logo{display:flex;align-items:center;gap:var(--spacing-md);font-weight:700;font-size:1.25rem;color:var(--gray-900)}.logo-text{background:linear-gradient(135deg,var(--primary-600),var(--purple-600));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.nav{display:flex;gap:var(--spacing-xl)}.nav-link{text-decoration:none;color:var(--gray-600);font-weight:500;padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-md);transition:all var(--transition-base);position:relative}.nav-link:hover{color:var(--primary-600);background:var(--gray-50)}.nav-link.active{color:var(--primary-600)}.nav-link.active:after{content:"";position:absolute;bottom:-1rem;left:50%;transform:translate(-50%);width:60%;height:3px;background:linear-gradient(90deg,var(--primary-600),var(--purple-600));border-radius:2px}.container{max-width:1920px;margin:0 auto;display:grid;grid-template-columns:320px 1fr;gap:var(--spacing-xl);padding:var(--spacing-xl);min-height:calc(100vh - 80px)}.sidebar{background:#fffffffa;border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);padding:var(--spacing-xl);height:fit-content;max-height:calc(100vh - 120px);overflow-y:auto;position:sticky;top:100px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.sidebar::-webkit-scrollbar{width:6px}.sidebar::-webkit-scrollbar-track{background:var(--gray-100);border-radius:3px}.sidebar::-webkit-scrollbar-thumb{background:var(--gray-300);border-radius:3px}.sidebar::-webkit-scrollbar-thumb:hover{background:var(--gray-400)}.sidebar-header{margin-bottom:var(--spacing-xl);padding-bottom:var(--spacing-lg);border-bottom:2px solid var(--gray-100)}.sidebar-header h2{font-size:1.5rem;font-weight:700;color:var(--gray-900);margin-bottom:var(--spacing-lg)}.progress-indicator{display:flex;justify-content:center}.progress-circle{position:relative;width:48px;height:48px}.progress-circle svg{transform:rotate(-90deg)}.progress-text{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:.75rem;font-weight:700;color:var(--primary-600)}.sidebar-content{display:flex;flex-direction:column;gap:var(--spacing-lg)}.topic-section{border-radius:var(--radius-lg);overflow:hidden;transition:all var(--transition-base)}.topic-section.active{background:linear-gradient(135deg,#4f46e50d,#7c3aed0d)}.topic-header{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-md);cursor:pointer;-webkit-user-select:none;user-select:none}.topic-icon{font-size:1.5rem}.topic-header h3{font-size:1rem;font-weight:600;color:var(--gray-800)}.lesson-list{list-style:none;padding:0 var(--spacing-sm)}.lesson-item{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-md) var(--spacing-lg);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-base);margin-bottom:var(--spacing-xs);font-weight:200}.lesson-item:hover{background:#4f46e514;transform:translate(4px)}.lesson-item.active{background:#bfdbfe;color:#ccf807;box-shadow:var(--shadow-md)}.lesson-item.completed .lesson-status{color:var(--success-500);font-weight:700}.lesson-item.active .lesson-status{color:#38e005}.lesson-status{width:20px;text-align:center;font-size:.875rem}.lesson-title{flex:1;font-size:.8rem;font-weight:200;color:#05d321}.lesson-item.active .lesson-title{font-weight:200;color:#05d321}.main-content{background:#fffffffa;border-radius:var(--radius-xl);box-shadow:var(--shadow-xl);overflow:hidden;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.content-wrapper{display:grid;grid-template-rows:1fr auto;height:calc(100vh - 120px)}.lesson-content{padding:var(--spacing-2xl);overflow-y:auto}.lesson-content::-webkit-scrollbar{width:8px}.lesson-content::-webkit-scrollbar-track{background:var(--gray-100)}.lesson-content::-webkit-scrollbar-thumb{background:var(--gray-300);border-radius:4px}.lesson-content::-webkit-scrollbar-thumb:hover{background:var(--gray-400)}.lesson-header{margin-bottom:var(--spacing-xl);padding-bottom:var(--spacing-lg);border-bottom:3px solid var(--gray-100);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--spacing-md)}.lesson-main-title{font-size:1.5rem;font-weight:600;background:linear-gradient(135deg,var(--primary-600),var(--purple-600));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:0;flex:1 1 auto;color:#05d321}.lesson-meta{display:flex;gap:var(--spacing-lg);font-size:.9rem;color:var(--gray-600);align-items:center;flex-wrap:wrap}.lesson-intro{background:linear-gradient(135deg,#4f46e50d,#7c3aed0d);border-left:4px solid var(--primary-600);padding:var(--spacing-lg);border-radius:var(--radius-md);margin-bottom:var(--spacing-xl)}.lesson-intro p{margin-bottom:var(--spacing-md);font-size:1.05rem;line-height:1.7}.lesson-intro p:last-child{margin-bottom:0}.content-section{margin-bottom:var(--spacing-2xl);animation:fadeInUp .6s ease-out}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.section-title{display:flex;align-items:center;gap:var(--spacing-md);font-size:1.75rem;font-weight:700;color:var(--gray-900);margin-bottom:var(--spacing-lg)}.section-icon{font-size:1.5rem}.section-content p{margin-bottom:var(--spacing-md);font-size:1.05rem;line-height:1.8;color:var(--gray-700)}.code-example{background:var(--gray-900);border-radius:var(--radius-lg);overflow:hidden;margin:var(--spacing-lg) 0;box-shadow:var(--shadow-lg)}.code-header{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-md) var(--spacing-lg);background:#0000004d;border-bottom:1px solid rgba(255,255,255,.1)}.code-label{color:var(--gray-300);font-size:.875rem;font-weight:500}.copy-btn{display:flex;align-items:center;gap:var(--spacing-sm);background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:var(--gray-300);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-sm);cursor:pointer;font-size:.875rem;transition:all var(--transition-base)}.copy-btn:hover{background:#fff3;color:#fff}.code-example pre{margin:0;padding:var(--spacing-lg);overflow-x:auto}.code-example code{font-family:var(--font-mono);font-size:.95rem;line-height:1.6;color:#e5e7eb}.operator-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--spacing-md);margin:var(--spacing-lg) 0}.operator-card{background:linear-gradient(135deg,#4f46e50d,#7c3aed0d);border:2px solid var(--gray-200);border-radius:var(--radius-lg);padding:var(--spacing-lg);text-align:center;transition:all var(--transition-base)}.operator-card:hover{border-color:var(--primary-600);transform:translateY(-4px);box-shadow:var(--shadow-md)}.operator-symbol{font-family:var(--font-mono);font-size:2rem;font-weight:700;color:var(--primary-600);margin-bottom:var(--spacing-sm)}.operator-name{font-size:.9rem;color:var(--gray-600);font-weight:500}.interactive-section{background:linear-gradient(135deg,#4f46e508,#7c3aed08);border:2px dashed var(--primary-600);border-radius:var(--radius-xl);padding:var(--spacing-xl)}.exercise-container{margin-top:var(--spacing-lg)}.exercise-description h3{font-size:1.25rem;font-weight:600;color:var(--gray-900);margin-bottom:var(--spacing-md)}.hint-box{background:#f59e0b1a;border-left:4px solid var(--warning-500);padding:var(--spacing-md) var(--spacing-lg);border-radius:var(--radius-md);margin-top:var(--spacing-md)}.hint-box strong{color:var(--warning-500)}.code-editor-container{border-top:2px solid var(--gray-200);background:var(--gray-50)}.editor-header{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-md) var(--spacing-lg);background:#fff;border-bottom:1px solid var(--gray-200)}.editor-tabs{display:flex;gap:var(--spacing-sm)}.editor-tab{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);background:var(--gray-100);border-radius:var(--radius-sm);font-size:.875rem;font-weight:500;color:var(--gray-600)}.editor-tab.active{background:linear-gradient(135deg,var(--primary-600),var(--purple-600));color:#fff}.editor-actions{display:flex;gap:var(--spacing-sm)}.editor-btn{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);background:#fff;border:1px solid var(--gray-300);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-base);color:var(--gray-600)}.editor-btn:hover{background:var(--gray-50);border-color:var(--gray-400)}.run-btn{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-lg);background:linear-gradient(135deg,var(--primary-600),var(--purple-600));border:none;border-radius:var(--radius-md);color:#fff;font-weight:600;cursor:pointer;transition:all var(--transition-base);box-shadow:var(--shadow-sm)}.run-btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}.run-btn:active{transform:translateY(0)}.editor-body{display:flex;background:var(--gray-900);min-height:200px;max-height:300px}.line-numbers{padding:var(--spacing-md);background:#0003;color:var(--gray-500);font-family:var(--font-mono);font-size:.9rem;line-height:1.6;text-align:right;-webkit-user-select:none;user-select:none;border-right:1px solid rgba(255,255,255,.1);white-space:pre-wrap;overflow-y:hidden}.code-editor{flex:1;padding:var(--spacing-md);background:transparent;border:none;outline:none;color:#e5e7eb;font-family:var(--font-mono);font-size:.9rem;line-height:1.6;resize:none;overflow-y:auto}.code-editor::-webkit-scrollbar{width:8px;height:8px}.code-editor::-webkit-scrollbar-track{background:#0003}.code-editor::-webkit-scrollbar-thumb{background:#fff3;border-radius:4px}.code-editor::-webkit-scrollbar-thumb:hover{background:#ffffff4d}.output-container{background:#fff;border-top:1px solid var(--gray-200)}.output-header{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-md) var(--spacing-lg);background:var(--gray-50);border-bottom:1px solid var(--gray-200)}.output-label{display:flex;align-items:center;gap:var(--spacing-sm);font-size:.875rem;font-weight:600;color:var(--gray-700)}.clear-output-btn{padding:var(--spacing-xs) var(--spacing-md);background:transparent;border:1px solid var(--gray-300);border-radius:var(--radius-sm);color:var(--gray-600);font-size:.875rem;cursor:pointer;transition:all var(--transition-base)}.clear-output-btn:hover{background:var(--gray-100);border-color:var(--gray-400)}.output-content{padding:var(--spacing-lg);font-family:var(--font-mono);font-size:.9rem;line-height:1.6;color:var(--gray-700);min-height:100px;max-height:200px;overflow-y:auto;white-space:pre-wrap}.output-content.error{color:var(--error-500)}.output-content.success{color:var(--success-600)}.lesson-navigation{display:flex;justify-content:space-between;padding:var(--spacing-lg) var(--spacing-2xl);background:#fff;border-top:2px solid var(--gray-100)}.nav-btn{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-md) var(--spacing-xl);background:#fff;border:2px solid var(--gray-300);border-radius:var(--radius-lg);font-size:1rem;font-weight:600;color:var(--gray-700);cursor:pointer;transition:all var(--transition-base)}.nav-btn:hover{background:linear-gradient(135deg,var(--primary-600),var(--purple-600));border-color:transparent;color:#fff;transform:translateY(-2px);box-shadow:var(--shadow-md)}.nav-btn:disabled{opacity:.5;cursor:not-allowed}.nav-btn:disabled:hover{background:#fff;color:var(--gray-700);transform:none;box-shadow:none}@media (max-width: 1024px){.container{grid-template-columns:1fr}.sidebar{position:static;max-height:none}.content-wrapper{height:auto}}@media (max-width: 768px){.header-content{padding:var(--spacing-md)}.nav{gap:var(--spacing-md)}.container{padding:var(--spacing-md);gap:var(--spacing-md)}.lesson-content{padding:var(--spacing-lg)}.lesson-title{font-size:1rem}.operator-grid{grid-template-columns:repeat(2,1fr)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.loading{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}.hidden{display:none}.fade-in{animation:fadeIn .3s ease-in}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}