:root{--primary-color: #2563EB;--primary-hover: #1D4ED8;--bg-color: #F7F9FC;--text-color: #111827;--text-muted: #6B7280;--card-bg: #FFFFFF;--heading-color: #111827;--border-color: #E5E7EB;--border-radius: 12px;--secondary-color: #64748B;--toggle-bg: #e0e0e0;--toggle-text: #333;--syntax-keyword: #d73a49;--syntax-string: #032f62;--syntax-comment: #6a737d;--syntax-number: #005cc5;--syntax-class: #6f42c1;--syntax-builtin: #005cc5;--active-node-bg: #e8f5e9;--active-node-border: #4caf50;--highlight-mix-color: white}[data-theme=dark]{--primary-color: #3B82F6;--primary-hover: #60A5FA;--bg-color: #111827;--text-color: #F9FAFB;--text-muted: #E5E7EB;--card-bg: #1F2937;--heading-color: #F3F4F6;--border-color: #374151;--secondary-color: #94A3B8;--toggle-bg: #374151;--toggle-text: #F9FAFB;--syntax-keyword: #ff7b72;--syntax-string: #a5d6ff;--syntax-comment: #8b949e;--syntax-number: #79c0ff;--syntax-class: #d2a8ff;--syntax-builtin: #79c0ff;--active-node-bg: rgba(76, 175, 80, .2);--active-node-border: #4caf50;--highlight-mix-color: transparent}body{margin:0;font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.6;color:var(--text-color);background-color:var(--bg-color);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}.app-container{max-width:900px;margin:0 auto;padding:2rem;min-height:100vh;display:flex;flex-direction:column;background-color:var(--bg-color);color:var(--text-color);transition:background-color .3s ease,color .3s ease}.app-summary-section{margin-bottom:3rem}.top-controls{position:absolute;top:2rem;right:2rem;display:flex;gap:1rem;align-items:center}.theme-toggle-btn{padding:.5rem;background:var(--toggle-bg);color:var(--toggle-text);border:none;border-radius:50%;width:36px;height:36px;font-size:1.2rem;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 4px #0000001a}.theme-toggle-btn:hover{transform:scale(1.1)}.toggle-timer-btn{padding:.5rem 1rem;background:var(--primary-color);color:#fff;border:none;border-radius:6px;font-size:.85rem;font-weight:600;cursor:pointer;transition:all .2s;box-shadow:0 2px 4px #0000001a}.toggle-timer-btn:hover{background:var(--primary-hover);box-shadow:0 4px 8px #00000026}.search-section{transition:all .5s ease;width:100%;display:flex;flex-direction:column;align-items:center}.search-section.centered{margin-top:20vh}.search-section.compact{margin-top:0;margin-bottom:2rem}.main-title{font-size:3rem;margin-bottom:2rem;color:var(--heading-color)}.search-form{display:flex;width:100%;max-width:600px;gap:10px}.search-input{flex:1;padding:1rem 1.5rem;font-size:1.1rem;border:2px solid var(--border-color);border-radius:50px;outline:none;transition:border-color .2s;box-shadow:0 4px 6px #0000000d}.search-input:focus{border-color:var(--primary-color)}.search-button{padding:0 2rem;background-color:var(--primary-color);color:#fff;border:none;border-radius:50px;font-size:1rem;font-weight:600;cursor:pointer;transition:background-color .2s}.search-button:hover{background-color:var(--primary-hover)}.content-area{width:100%}.fade-in{animation:fadeIn .5s ease-in}.topic-header{text-align:center;margin-bottom:2rem}.search-meta{color:#666;font-size:.9rem;margin-bottom:.5rem}.topic-header h1{font-size:2.5rem;margin:0;color:var(--heading-color)}.difficulty-controls{display:flex;justify-content:center;background:var(--toggle-bg);padding:5px;border-radius:50px;width:fit-content;margin:0 auto 2rem}.difficulty-btn{background:transparent;border:none;padding:.5rem 1.5rem;border-radius:40px;font-weight:600;color:var(--text-muted);cursor:pointer;transition:all .2s}.explanation-card{background:var(--card-bg);padding:2.5rem;border-radius:var(--border-radius);box-shadow:0 4px 12px #00000014;margin-bottom:2rem;line-height:1.8;font-size:1.1rem}.explanation-card h3{margin-top:1.5rem;color:var(--primary-color)}.explanation-card code{background:#f4f4f4;padding:.2rem .4rem;border-radius:4px;font-family:monospace;color:#d63384}.toy-example-section{margin-top:3rem;margin-bottom:3rem}.toy-example-section h3{margin-bottom:1rem;color:var(--text-muted)}.toy-example-box{background-color:var(--bg-color);border:1px solid var(--border-color);padding:1.5rem;border-radius:var(--border-radius);border-left:5px solid var(--primary-color)}.example-sentence{font-size:1.2rem;font-style:italic;margin-bottom:1rem;color:var(--text-color)}.example-explanation{font-size:.95rem;color:var(--text-muted)}.sources-section{margin-top:3rem;padding-top:2rem;border-top:2px solid var(--border-color)}.sources-section h2{font-size:2rem;color:var(--heading-color);margin-bottom:1rem}.sources-intro{color:var(--text-muted);margin-bottom:2rem;font-size:1.05rem}.sources-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.5rem}.source-card{background:var(--card-bg);padding:1.5rem;border-radius:var(--border-radius);box-shadow:0 2px 8px #00000014;transition:transform .2s,box-shadow .2s}.source-card:hover{transform:translateY(-4px);box-shadow:0 4px 16px #0000001f}.source-header{margin-bottom:.75rem}.source-type{display:inline-block;padding:.25rem .75rem;background:#e0e7ff;color:#4338ca;border-radius:20px;font-size:.85rem;font-weight:600}.source-title{margin:.5rem 0 1rem;font-size:1.1rem}.source-title a{color:var(--primary-color);text-decoration:none;transition:color .2s}.source-title a:hover{color:var(--primary-hover);text-decoration:underline}.source-description{color:var(--text-muted);font-size:.95rem;line-height:1.6;margin:0}.quiz-toggle-container{text-align:center;margin:2rem 0}.quiz-toggle-btn{padding:1rem 2.5rem;background:#3a7afe;color:#fff;border:none;border-radius:50px;font-size:1.1rem;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px #3a7afe40}.quiz-toggle-btn:hover{background:#2563eb;transform:translateY(-2px);box-shadow:0 6px 16px #3a7afe59}.quiz-toggle-btn:active{transform:translateY(0)}.quiz-wrapper{overflow:hidden;transition:max-height .5s ease,opacity .5s ease,margin-top .5s ease}.quiz-wrapper.quiz-hidden{max-height:0;opacity:0;margin-top:0}.quiz-wrapper.quiz-visible{max-height:5000px;opacity:1;margin-top:2rem}@media(max-width:600px){.app-container{padding:1rem}.toggle-timer-btn{top:1rem;right:1rem;font-size:.75rem;padding:.4rem .8rem}.search-form{flex-direction:column}.search-button{padding:1rem;width:100%}.difficulty-controls{width:100%;overflow-x:auto}.difficulty-btn{padding:.5rem 1rem;font-size:.9rem}.sources-grid{grid-template-columns:1fr}.quiz-toggle-btn{padding:.8rem 2rem;font-size:1rem}}.app-footer{text-align:center;padding:2rem;margin-top:auto;color:var(--secondary-color);font-size:.9rem;width:100%}.app-footer a{color:#3a7afe;text-decoration:none;font-weight:500}.app-footer a:hover{text-decoration:underline}.timer-score-widget{position:fixed;bottom:16px;right:16px;padding:12px 16px;border-radius:8px;background:var(--card-bg);box-shadow:0 2px 8px #00000026;font-size:.9rem;z-index:1000;min-width:200px}.widget-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}.widget-row:last-child{margin-bottom:0}.widget-label{color:var(--text-muted);font-weight:500}.widget-value{color:var(--text-color);font-weight:700;font-size:1rem}@media(max-width:600px){.timer-score-widget{bottom:8px;right:8px;font-size:.85rem;min-width:180px}}.quiz-section{margin-top:4rem;padding-top:3rem;border-top:2px solid #e0e0e0}.quiz-section h2{font-size:2rem;color:var(--heading-color);margin-bottom:1rem}.quiz-intro{color:var(--text-muted);font-size:1.05rem;margin-bottom:1rem}.quiz-filters-container{margin-bottom:2rem;display:flex;flex-direction:column;gap:1rem}.toggle-concepts-btn{background:var(--card-bg);border:1px solid var(--border-color);padding:.5rem 1rem;border-radius:8px;font-size:.9rem;color:var(--text-color);cursor:pointer;align-self:flex-start;transition:all .2s;display:flex;align-items:center;gap:.5rem}.toggle-concepts-btn:hover{background:var(--bg-color);border-color:var(--border-color);color:var(--heading-color)}.toggle-concepts-btn:after{content:"▼";font-size:.7rem;transition:transform .2s}.difficulty-filter{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}.filter-label{font-weight:600;color:var(--heading-color)}.filter-buttons{display:flex;gap:.5rem}.filter-btn{background:var(--card-bg);border:1px solid var(--border-color);padding:.5rem 1rem;border-radius:20px;font-size:.9rem;cursor:pointer;transition:all .2s;color:var(--text-muted)}.filter-btn:hover{background:var(--bg-color);border-color:var(--text-muted)}.filter-btn.active{background:var(--primary-color);color:#fff;border-color:var(--primary-color)}.quiz-controls{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;gap:1rem;flex-wrap:wrap}.quiz-progress{background:var(--primary-color);color:#fff;padding:.75rem 1.5rem;border-radius:8px;font-size:1rem;text-align:center;flex-grow:1;margin-bottom:0}.reset-quiz-btn{background:var(--card-bg);color:var(--primary-color);border:2px solid var(--primary-color);padding:.75rem 1.5rem;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s;white-space:nowrap}.reset-quiz-btn:hover{background:var(--bg-color)}.quiz-questions{display:flex;flex-direction:column;gap:2rem}.question-card{background:var(--card-bg);padding:2rem;border-radius:var(--border-radius);box-shadow:0 2px 8px #00000014;transition:transform .2s,box-shadow .2s}.question-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001f}.question-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem}.question-number{font-size:.85rem;font-weight:700;color:var(--primary-color);text-transform:uppercase;letter-spacing:.5px}.difficulty-badge{font-size:.75rem;padding:.25rem .75rem;border-radius:12px;font-weight:600;text-transform:uppercase}.difficulty-badge.beginner{background-color:#d1fae5;color:#065f46}.difficulty-badge.intermediate{background-color:#fff7ed;color:#9a3412}.difficulty-badge.advanced{background-color:#fee2e2;color:#991b1b}.question-text{font-size:1.15rem;font-weight:600;color:var(--heading-color);margin-bottom:1.5rem;line-height:1.6}.mcq-options{display:flex;flex-direction:column;gap:.75rem;margin-bottom:1rem}.quiz-option-btn{background:var(--bg-color);border:2px solid var(--border-color);padding:1rem 1.5rem;border-radius:8px;text-align:left;cursor:pointer;font-size:1rem;transition:all .2s;color:var(--text-color)}.quiz-option-btn:hover:not(:disabled){background:var(--card-bg);border-color:var(--primary-color)}.quiz-option-btn:disabled{cursor:default;opacity:.7}.quiz-option-btn.selected{background:#e0e7ff;border-color:var(--primary-color);font-weight:600}.true-false-buttons{display:flex;gap:1rem;margin-bottom:1rem}.true-false-buttons .quiz-option-btn{flex:1;text-align:center}.free-form-input{width:100%;padding:1rem;border:2px solid var(--border-color);border-radius:8px;font-size:1rem;font-family:inherit;resize:vertical;margin-bottom:1rem;transition:border-color .2s;background:var(--bg-color);color:var(--text-color)}.free-form-input:focus{outline:none;border-color:var(--primary-color)}.free-form-input:disabled{background-color:#f9fafb;cursor:not-allowed}.submit-answer-btn{background:var(--primary-color);color:#fff;border:none;padding:.75rem 1.5rem;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:background-color .2s}.submit-answer-btn:hover:not(:disabled){background:var(--primary-hover)}.submit-answer-btn:disabled{background-color:#ccc;cursor:not-allowed}.feedback{margin-top:1rem;padding:1rem 1.5rem;border-radius:8px;font-weight:600}.feedback-correct{background:#d1fae5;color:#065f46;border-left:4px solid #10b981}.feedback-incorrect{background:#fee2e2;color:#991b1b;border-left:4px solid #ef4444}.feedback-explanation{margin-top:.5rem;font-weight:400;font-size:.95rem;opacity:.9}.no-questions{text-align:center;padding:3rem;color:var(--text-muted);background:var(--bg-color);border-radius:8px;font-style:italic}@media(max-width:600px){.question-card{padding:1.5rem}.quiz-option-btn{padding:.75rem 1rem;font-size:.95rem}.true-false-buttons{flex-direction:column}.difficulty-filter{flex-direction:column;align-items:flex-start}.filter-buttons{width:100%;overflow-x:auto;padding-bottom:.5rem}.filter-btn{white-space:nowrap}.quiz-controls{flex-direction:column;align-items:stretch}.reset-quiz-btn{width:100%}}.pagination-controls{display:flex;justify-content:center;align-items:center;gap:2rem;margin-top:2.5rem;padding-top:2.5rem;border-top:2px solid #e0e0e0}.pagination-btn{background:var(--primary-color);color:#fff;border:none;padding:.875rem 2rem;border-radius:8px;cursor:pointer;font-weight:600;font-size:1rem;transition:all .3s ease;box-shadow:0 2px 4px #0000001a;min-width:120px}.pagination-btn:hover:not(:disabled){background:var(--primary-hover);transform:translateY(-2px);box-shadow:0 4px 8px #00000026}.pagination-btn:active:not(:disabled){transform:translateY(0);box-shadow:0 2px 4px #0000001a}.pagination-btn:disabled{opacity:.4;cursor:not-allowed;background:#ccc;box-shadow:none}.page-indicator{font-weight:600;color:var(--heading-color);font-size:1rem;background:var(--card-bg);padding:.75rem 1.5rem;border-radius:6px;border:1px solid var(--border-color)}@media(max-width:600px){.page-indicator{font-size:.85rem;padding:.5rem 1rem;width:100%;text-align:center;margin-bottom:1rem}.pagination-controls{flex-direction:column;gap:1rem;padding-top:1.5rem;margin-top:1.5rem}.pagination-btn{width:100%;padding:.75rem}}.focused-mode-banner{background:#646cff1a;border:1px solid rgba(100,108,255,.3);padding:.8rem 1.2rem;border-radius:8px;margin-bottom:1.5rem;display:flex;align-items:center;gap:1rem;animation:fadeIn .5s ease-out}.mode-badge{background:#646cff;color:#fff;padding:.2rem .6rem;border-radius:4px;font-weight:700;font-size:.85rem;white-space:nowrap}.mode-desc{color:#666;font-size:.9rem}@media(prefers-color-scheme:light){.mode-desc{color:#555}}.filter-btn.focused-btn{border-color:#646cff;color:#646cff;font-weight:600}.filter-btn.focused-btn:hover{background:#646cff1a}.filter-btn.focused-btn.active{background:#646cff;color:#fff}.concept-selection-panel{background:var(--card-bg);padding:2rem;border-radius:12px;box-shadow:0 4px 12px #00000014;margin-bottom:2rem}.selection-header h3{font-size:1.5rem;color:var(--heading-color);margin:0 0 .5rem}.selection-description{color:#6b7280;font-size:1rem;margin:0 0 1.5rem;line-height:1.5}.selection-controls{display:flex;gap:.75rem;margin-bottom:1.5rem;flex-wrap:wrap}.select-all-btn,.deselect-all-btn{padding:.6rem 1.2rem;border:2px solid #e0e0e0;background:#fff;border-radius:8px;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .2s ease}.select-all-btn:hover{border-color:#10b981;background:#10b9811a;transform:translateY(-2px)}.deselect-all-btn:hover{border-color:#ef4444;background:#ef44441a;transform:translateY(-2px)}.concepts-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1rem;margin-bottom:1.5rem}.concept-checkbox-card{display:flex;align-items:center;gap:1rem;padding:1rem 1.25rem;border:2px solid #e0e0e0;border-radius:10px;background:#fff;cursor:pointer;transition:all .3s ease}.concept-checkbox-card:hover{border-color:var(--primary-color);background:#2563eb0d;transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.concept-checkbox-card.selected{border-color:var(--primary-color);background:#2563eb1a;box-shadow:0 4px 12px #2563eb33}.checkbox-wrapper{flex-shrink:0}.checkbox-wrapper input[type=checkbox]{width:20px;height:20px;cursor:pointer;accent-color:var(--primary-color)}.concept-info{flex:1}.concept-title-small{font-weight:600;font-size:.95rem;color:var(--heading-color);margin-bottom:.25rem;line-height:1.3}.question-badge{display:inline-block;font-size:.85rem;color:#6b7280;background:#f3f4f6;padding:.25rem .6rem;border-radius:12px;font-weight:500}.concept-checkbox-card.selected .question-badge{background:#2563eb33;color:var(--primary-color);font-weight:600}.selection-summary{text-align:center;padding:1rem;background:#f8f9fa;border-radius:8px;font-size:1.05rem;color:var(--text-color)}.selection-summary strong{color:var(--primary-color)}@media(max-width:768px){.concepts-grid{grid-template-columns:1fr}.concept-selection-panel{padding:1.5rem}}.concept-sequence{background:var(--bg-color);padding:2.5rem;border-radius:var(--border-radius);box-shadow:0 2px 8px #0000000d;margin-bottom:3rem;transition:background-color .5s ease,border-color .5s ease;border:2px solid transparent}.concept-sequence.section-complete{background-color:#d1fae5;border-color:#10b981}.concept-sequence.section-complete .progress-indicator{background-color:#059669}.progress-indicator{background:#3a7afe;color:#fff;padding:.75rem 1.5rem;border-radius:8px;font-weight:700;font-size:.95rem;margin:0 0 2rem;text-align:center}.concept-content{margin-bottom:2rem}.concept-title{font-size:2rem;color:var(--heading-color);margin-bottom:2rem;text-align:center}.concept-section{margin-bottom:2rem;padding:1.5rem;background:var(--card-bg);border-radius:8px;border-left:4px solid var(--primary-color)}.section-heading{font-size:1.3rem;color:var(--primary-color);margin-top:0;margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}.section-content{font-size:1.05rem;line-height:1.7;color:var(--text-color);margin:0}.nav-buttons{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding-top:1.5rem;border-top:2px solid var(--border-color)}.nav-btn{padding:.75rem 1.5rem;background:var(--primary-color);color:#fff;border:none;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s;min-width:120px}.nav-btn:hover:not(:disabled){background:var(--primary-hover);transform:translateY(-2px);box-shadow:0 4px 8px #00000026}.nav-btn:disabled{background:#d1d5db;cursor:not-allowed;opacity:.6}.concept-dots{display:flex;gap:.5rem;align-items:center}.dot{width:12px;height:12px;border-radius:50%;background:#d1d5db;cursor:pointer;transition:all .2s}.dot:hover{background:#9ca3af;transform:scale(1.2)}.dot.active{background:#3a7afe;transform:scale(1.3)}.dot.understood:after{content:"✓";position:absolute;top:-8px;right:-8px;font-size:10px;color:#10b981;font-weight:700}.summary-container{margin-top:3rem}@media(max-width:600px){.concept-sequence{padding:1.5rem}.concept-title{font-size:1.5rem}.section-heading{font-size:1.1rem}.section-content{font-size:1rem}.nav-buttons{flex-direction:column}.nav-btn{width:100%}.concept-dots{order:-1}}.concept-nav-bar{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:2rem;justify-content:center;padding-bottom:1.5rem;border-bottom:1px solid #e2e8f0}.nav-item{background:var(--card-bg);border:1px solid var(--border-color);padding:.5rem 1rem;border-radius:20px;font-size:.9rem;color:var(--text-muted);cursor:pointer;transition:all .2s ease;font-weight:500}.nav-item:hover{background:var(--bg-color);border-color:var(--text-muted);color:var(--text-color)}.nav-item.active{background:#3a7afe;color:#fff;border-color:#3a7afe;box-shadow:0 2px 4px #3a7afe4d}.nav-item.completed{border-color:#10b981;color:#059669}.nav-item.completed.active{background:#10b981;color:#fff;border-color:#10b981}@media(max-width:600px){.concept-nav-bar{overflow-x:auto;flex-wrap:nowrap;justify-content:flex-start;padding-bottom:1rem;-webkit-overflow-scrolling:touch;scrollbar-width:none}.concept-nav-bar::-webkit-scrollbar{display:none}.nav-item{white-space:nowrap;flex-shrink:0}}.difficulty-selector{display:flex;align-items:center;gap:1rem;margin-bottom:2rem;flex-wrap:wrap}.difficulty-label{font-weight:600;color:var(--heading-color);font-size:1.1rem}.difficulty-buttons{display:flex;gap:.5rem;background:var(--toggle-bg);padding:4px;border-radius:50px}.difficulty-btn{background:transparent;border:none;padding:.5rem 1.25rem;border-radius:40px;font-weight:600;color:var(--text-muted);cursor:pointer;transition:all .2s;font-size:.95rem}.difficulty-btn:hover{color:var(--heading-color)}.difficulty-btn.active{background:var(--card-bg);color:var(--primary-color);box-shadow:0 2px 4px #0000001a}.concept-section-container{display:flex;flex-direction:column;gap:1.5rem}.concept-card{background:var(--card-bg);padding:1.75rem;border-radius:12px;box-shadow:0 1px 3px #00000014;transition:all .3s ease}.concept-card:hover{box-shadow:0 4px 12px #3a7afe26;transform:translateY(-2px)}.card-heading{display:flex;align-items:center;gap:.75rem;font-size:1.3rem;color:var(--heading-color);margin:0 0 1rem;font-weight:600}.card-icon{font-size:1.5rem}.card-content{font-size:1.05rem;line-height:1.7;color:var(--text-color);margin:0}.toyexample-card{border-left:4px solid #F59E0B}.code-card{border-left:4px solid #805ad5}.clickable-heading{cursor:pointer;-webkit-user-select:none;user-select:none;transition:opacity .2s}.clickable-heading:hover{opacity:.8}.toggle-icon{font-size:.9rem;color:var(--text-muted)}.code-content{margin-top:1rem}.code-block{background-color:var(--bg-color);padding:1rem;border-radius:.5rem;overflow-x:auto;font-family:Fira Code,Consolas,Monaco,monospace;font-size:.9rem;color:var(--text-color);border:1px solid var(--border-color);margin:0}.equations-section{margin-top:1.5rem}.understanding-section{margin-top:2rem;padding-top:1.5rem;border-top:2px solid #E5E7EB;display:flex;justify-content:center}.example-description{font-size:1rem;color:var(--text-color);margin-bottom:1rem;font-weight:500}.steps-container{background:var(--bg-color);padding:1.25rem;border-radius:8px;min-height:100px;margin-bottom:1rem}.step-item{display:flex;align-items:flex-start;gap:.75rem;margin-bottom:.75rem;padding:.75rem;background:var(--card-bg);border-radius:6px;box-shadow:0 1px 3px #0000001a}.step-item:last-child{margin-bottom:0}.step-number{background:var(--primary-color);color:#fff;min-width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.9rem;flex-shrink:0}.step-text{font-size:1rem;line-height:1.6;color:var(--text-color);flex:1}.no-steps-message,.no-example-message{text-align:center;color:var(--text-muted);font-style:italic;padding:2rem 1rem;font-size:1rem}.example-controls{display:flex;gap:.75rem;flex-wrap:wrap;margin-bottom:.75rem}.control-btn{padding:.65rem 1.25rem;border:none;border-radius:8px;font-size:.95rem;font-weight:600;cursor:pointer;transition:all .2s ease;flex:1;min-width:120px}.next-btn{background:#10b981;color:#fff}.next-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #10b9814d}.next-btn:disabled{background:#d1d5db;cursor:not-allowed}.reveal-btn{background:#f59e0b;color:#fff}.reveal-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #f59e0b4d}.reset-btn{background:var(--secondary-color);color:#fff}.reset-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #6b72804d}.progress-indicator{text-align:center;font-size:.9rem;font-weight:500}.fade-in{animation:fadeIn .4s ease-out}@media(max-width:600px){.concept-card{padding:1.25rem}.card-heading{font-size:1.1rem}.card-content{font-size:1rem}.example-controls{flex-direction:column}.control-btn{width:100%}}.architecture-visual-section{margin-bottom:1rem}.visual-toggle-btn{background:#f3f4f6;border:1px solid #E5E7EB;color:#4b5563;padding:.75rem 1.5rem;border-radius:8px;font-weight:600;cursor:pointer;width:100%;text-align:left;transition:all .2s ease;display:flex;align-items:center;gap:.5rem}.visual-toggle-btn:hover{background:#e5e7eb;color:#1f2d3d}.visual-toggle-btn.active{background:#e0f2fe;border-color:#3a7afe;color:#0284c7}.architecture-visual-content{background:#fff;border:1px solid #E5E7EB;border-top:none;border-radius:0 0 12px 12px;padding:1.5rem;text-align:center;margin-top:-4px;box-shadow:0 4px 6px #0000000d}.architecture-image{max-width:100%;height:auto;max-height:500px;border-radius:8px;box-shadow:0 2px 8px #0000001a;margin-bottom:1rem}.visual-caption{color:#6b7280;font-size:.9rem;font-style:italic;margin:0}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.architecture-placeholder{width:100%;height:300px;background-color:#f1f5f9;border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#64748b;border:2px dashed #cbd5e1}.placeholder-icon{font-size:3rem;margin-bottom:1rem}.understanding-btn{padding:.65rem 1.25rem;border:2px solid #E5E7EB;background:#fff;border-radius:8px;font-size:.95rem;font-weight:600;cursor:pointer;transition:all .3s ease;color:#6b7280;display:inline-flex;align-items:center;gap:.5rem}.understanding-btn:hover{border-color:#3a7afe;background:#3a7afe0d;transform:translateY(-1px)}.understanding-btn.understood{background:#10b981;border-color:#10b981;color:#fff}.understanding-btn.understood:hover{background:#059669;border-color:#059669}.understanding-btn .checkmark,.understanding-btn .circle{font-size:1.1rem}.understanding-btn .circle{color:#9ca3af}@media(max-width:600px){.understanding-btn{width:100%;justify-content:center}}@font-face{font-display:block;font-family:KaTeX_AMS;font-style:normal;font-weight:400;src:url(/assets/KaTeX_AMS-Regular-BQhdFMY1.woff2) format("woff2"),url(/assets/KaTeX_AMS-Regular-DMm9YOAa.woff) format("woff"),url(/assets/KaTeX_AMS-Regular-DRggAlZN.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Caligraphic;font-style:normal;font-weight:700;src:url(/assets/KaTeX_Caligraphic-Bold-Dq_IR9rO.woff2) format("woff2"),url(/assets/KaTeX_Caligraphic-Bold-BEiXGLvX.woff) format("woff"),url(/assets/KaTeX_Caligraphic-Bold-ATXxdsX0.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Caligraphic;font-style:normal;font-weight:400;src:url(/assets/KaTeX_Caligraphic-Regular-Di6jR-x-.woff2) format("woff2"),url(/assets/KaTeX_Caligraphic-Regular-CTRA-rTL.woff) format("woff"),url(/assets/KaTeX_Caligraphic-Regular-wX97UBjC.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Fraktur;font-style:normal;font-weight:700;src:url(/assets/KaTeX_Fraktur-Bold-CL6g_b3V.woff2) format("woff2"),url(/assets/KaTeX_Fraktur-Bold-BsDP51OF.woff) format("woff"),url(/assets/KaTeX_Fraktur-Bold-BdnERNNW.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Fraktur;font-style:normal;font-weight:400;src:url(/assets/KaTeX_Fraktur-Regular-CTYiF6lA.woff2) format("woff2"),url(/assets/KaTeX_Fraktur-Regular-Dxdc4cR9.woff) format("woff"),url(/assets/KaTeX_Fraktur-Regular-CB_wures.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Main;font-style:normal;font-weight:700;src:url(/assets/KaTeX_Main-Bold-Cx986IdX.woff2) format("woff2"),url(/assets/KaTeX_Main-Bold-Jm3AIy58.woff) format("woff"),url(/assets/KaTeX_Main-Bold-waoOVXN0.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Main;font-style:italic;font-weight:700;src:url(/assets/KaTeX_Main-BoldItalic-DxDJ3AOS.woff2) format("woff2"),url(/assets/KaTeX_Main-BoldItalic-SpSLRI95.woff) format("woff"),url(/assets/KaTeX_Main-BoldItalic-DzxPMmG6.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Main;font-style:italic;font-weight:400;src:url(/assets/KaTeX_Main-Italic-NWA7e6Wa.woff2) format("woff2"),url(/assets/KaTeX_Main-Italic-BMLOBm91.woff) format("woff"),url(/assets/KaTeX_Main-Italic-3WenGoN9.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Main;font-style:normal;font-weight:400;src:url(/assets/KaTeX_Main-Regular-B22Nviop.woff2) format("woff2"),url(/assets/KaTeX_Main-Regular-Dr94JaBh.woff) format("woff"),url(/assets/KaTeX_Main-Regular-ypZvNtVU.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Math;font-style:italic;font-weight:700;src:url(/assets/KaTeX_Math-BoldItalic-CZnvNsCZ.woff2) format("woff2"),url(/assets/KaTeX_Math-BoldItalic-iY-2wyZ7.woff) format("woff"),url(/assets/KaTeX_Math-BoldItalic-B3XSjfu4.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Math;font-style:italic;font-weight:400;src:url(/assets/KaTeX_Math-Italic-t53AETM-.woff2) format("woff2"),url(/assets/KaTeX_Math-Italic-DA0__PXp.woff) format("woff"),url(/assets/KaTeX_Math-Italic-flOr_0UB.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_SansSerif;font-style:normal;font-weight:700;src:url(/assets/KaTeX_SansSerif-Bold-D1sUS0GD.woff2) format("woff2"),url(/assets/KaTeX_SansSerif-Bold-DbIhKOiC.woff) format("woff"),url(/assets/KaTeX_SansSerif-Bold-CFMepnvq.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_SansSerif;font-style:italic;font-weight:400;src:url(/assets/KaTeX_SansSerif-Italic-C3H0VqGB.woff2) format("woff2"),url(/assets/KaTeX_SansSerif-Italic-DN2j7dab.woff) format("woff"),url(/assets/KaTeX_SansSerif-Italic-YYjJ1zSn.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_SansSerif;font-style:normal;font-weight:400;src:url(/assets/KaTeX_SansSerif-Regular-DDBCnlJ7.woff2) format("woff2"),url(/assets/KaTeX_SansSerif-Regular-CS6fqUqJ.woff) format("woff"),url(/assets/KaTeX_SansSerif-Regular-BNo7hRIc.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Script;font-style:normal;font-weight:400;src:url(/assets/KaTeX_Script-Regular-D3wIWfF6.woff2) format("woff2"),url(/assets/KaTeX_Script-Regular-D5yQViql.woff) format("woff"),url(/assets/KaTeX_Script-Regular-C5JkGWo-.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Size1;font-style:normal;font-weight:400;src:url(/assets/KaTeX_Size1-Regular-mCD8mA8B.woff2) format("woff2"),url(/assets/KaTeX_Size1-Regular-C195tn64.woff) format("woff"),url(/assets/KaTeX_Size1-Regular-Dbsnue_I.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Size2;font-style:normal;font-weight:400;src:url(/assets/KaTeX_Size2-Regular-Dy4dx90m.woff2) format("woff2"),url(/assets/KaTeX_Size2-Regular-oD1tc_U0.woff) format("woff"),url(/assets/KaTeX_Size2-Regular-B7gKUWhC.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Size3;font-style:normal;font-weight:400;src:url(data:font/woff2;base64,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) format("woff2"),url(/assets/KaTeX_Size3-Regular-CTq5MqoE.woff) format("woff"),url(/assets/KaTeX_Size3-Regular-DgpXs0kz.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Size4;font-style:normal;font-weight:400;src:url(/assets/KaTeX_Size4-Regular-Dl5lxZxV.woff2) format("woff2"),url(/assets/KaTeX_Size4-Regular-BF-4gkZK.woff) format("woff"),url(/assets/KaTeX_Size4-Regular-DWFBv043.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Typewriter;font-style:normal;font-weight:400;src:url(/assets/KaTeX_Typewriter-Regular-CO6r4hn1.woff2) format("woff2"),url(/assets/KaTeX_Typewriter-Regular-C0xS9mPB.woff) format("woff"),url(/assets/KaTeX_Typewriter-Regular-D3Ib7_Hf.ttf) format("truetype")}.katex{font: 1.21em KaTeX_Main,Times New Roman,serif;line-height:1.2;text-indent:0;text-rendering:auto}.katex *{-ms-high-contrast-adjust:none!important;border-color:currentColor}.katex .katex-version:after{content:"0.16.25"}.katex .katex-mathml{clip:rect(1px,1px,1px,1px);border:0;height:1px;overflow:hidden;padding:0;position:absolute;width:1px}.katex .katex-html>.newline{display:block}.katex .base{position:relative;white-space:nowrap;width:-webkit-min-content;width:-moz-min-content;width:min-content}.katex .base,.katex .strut{display:inline-block}.katex .textbf{font-weight:700}.katex .textit{font-style:italic}.katex .textrm{font-family:KaTeX_Main}.katex .textsf{font-family:KaTeX_SansSerif}.katex .texttt{font-family:KaTeX_Typewriter}.katex .mathnormal{font-family:KaTeX_Math;font-style:italic}.katex .mathit{font-family:KaTeX_Main;font-style:italic}.katex .mathrm{font-style:normal}.katex .mathbf{font-family:KaTeX_Main;font-weight:700}.katex .boldsymbol{font-family:KaTeX_Math;font-style:italic;font-weight:700}.katex .amsrm,.katex .mathbb,.katex .textbb{font-family:KaTeX_AMS}.katex .mathcal{font-family:KaTeX_Caligraphic}.katex .mathfrak,.katex .textfrak{font-family:KaTeX_Fraktur}.katex .mathboldfrak,.katex .textboldfrak{font-family:KaTeX_Fraktur;font-weight:700}.katex .mathtt{font-family:KaTeX_Typewriter}.katex .mathscr,.katex .textscr{font-family:KaTeX_Script}.katex .mathsf,.katex .textsf{font-family:KaTeX_SansSerif}.katex .mathboldsf,.katex .textboldsf{font-family:KaTeX_SansSerif;font-weight:700}.katex .mathitsf,.katex .mathsfit,.katex .textitsf{font-family:KaTeX_SansSerif;font-style:italic}.katex .mainrm{font-family:KaTeX_Main;font-style:normal}.katex .vlist-t{border-collapse:collapse;display:inline-table;table-layout:fixed}.katex .vlist-r{display:table-row}.katex .vlist{display:table-cell;position:relative;vertical-align:bottom}.katex .vlist>span{display:block;height:0;position:relative}.katex .vlist>span>span{display:inline-block}.katex .vlist>span>.pstrut{overflow:hidden;width:0}.katex .vlist-t2{margin-right:-2px}.katex .vlist-s{display:table-cell;font-size:1px;min-width:2px;vertical-align:bottom;width:2px}.katex .vbox{align-items:baseline;display:inline-flex;flex-direction:column}.katex .hbox{width:100%}.katex .hbox,.katex .thinbox{display:inline-flex;flex-direction:row}.katex .thinbox{max-width:0;width:0}.katex .msupsub{text-align:left}.katex .mfrac>span>span{text-align:center}.katex .mfrac .frac-line{border-bottom-style:solid;display:inline-block;width:100%}.katex .hdashline,.katex .hline,.katex .mfrac .frac-line,.katex .overline .overline-line,.katex .rule,.katex .underline .underline-line{min-height:1px}.katex .mspace{display:inline-block}.katex .clap,.katex .llap,.katex .rlap{position:relative;width:0}.katex .clap>.inner,.katex .llap>.inner,.katex .rlap>.inner{position:absolute}.katex .clap>.fix,.katex .llap>.fix,.katex .rlap>.fix{display:inline-block}.katex .llap>.inner{right:0}.katex .clap>.inner,.katex .rlap>.inner{left:0}.katex .clap>.inner>span{margin-left:-50%;margin-right:50%}.katex .rule{border:0 solid;display:inline-block;position:relative}.katex .hline,.katex .overline .overline-line,.katex .underline .underline-line{border-bottom-style:solid;display:inline-block;width:100%}.katex .hdashline{border-bottom-style:dashed;display:inline-block;width:100%}.katex .sqrt>.root{margin-left:.2777777778em;margin-right:-.5555555556em}.katex .fontsize-ensurer.reset-size1.size1,.katex .sizing.reset-size1.size1{font-size:1em}.katex .fontsize-ensurer.reset-size1.size2,.katex .sizing.reset-size1.size2{font-size:1.2em}.katex .fontsize-ensurer.reset-size1.size3,.katex .sizing.reset-size1.size3{font-size:1.4em}.katex .fontsize-ensurer.reset-size1.size4,.katex .sizing.reset-size1.size4{font-size:1.6em}.katex .fontsize-ensurer.reset-size1.size5,.katex .sizing.reset-size1.size5{font-size:1.8em}.katex .fontsize-ensurer.reset-size1.size6,.katex .sizing.reset-size1.size6{font-size:2em}.katex .fontsize-ensurer.reset-size1.size7,.katex .sizing.reset-size1.size7{font-size:2.4em}.katex .fontsize-ensurer.reset-size1.size8,.katex .sizing.reset-size1.size8{font-size:2.88em}.katex .fontsize-ensurer.reset-size1.size9,.katex .sizing.reset-size1.size9{font-size:3.456em}.katex .fontsize-ensurer.reset-size1.size10,.katex .sizing.reset-size1.size10{font-size:4.148em}.katex .fontsize-ensurer.reset-size1.size11,.katex .sizing.reset-size1.size11{font-size:4.976em}.katex .fontsize-ensurer.reset-size2.size1,.katex .sizing.reset-size2.size1{font-size:.8333333333em}.katex .fontsize-ensurer.reset-size2.size2,.katex .sizing.reset-size2.size2{font-size:1em}.katex .fontsize-ensurer.reset-size2.size3,.katex .sizing.reset-size2.size3{font-size:1.1666666667em}.katex .fontsize-ensurer.reset-size2.size4,.katex .sizing.reset-size2.size4{font-size:1.3333333333em}.katex .fontsize-ensurer.reset-size2.size5,.katex .sizing.reset-size2.size5{font-size:1.5em}.katex .fontsize-ensurer.reset-size2.size6,.katex .sizing.reset-size2.size6{font-size:1.6666666667em}.katex .fontsize-ensurer.reset-size2.size7,.katex .sizing.reset-size2.size7{font-size:2em}.katex .fontsize-ensurer.reset-size2.size8,.katex .sizing.reset-size2.size8{font-size:2.4em}.katex .fontsize-ensurer.reset-size2.size9,.katex .sizing.reset-size2.size9{font-size:2.88em}.katex .fontsize-ensurer.reset-size2.size10,.katex .sizing.reset-size2.size10{font-size:3.4566666667em}.katex .fontsize-ensurer.reset-size2.size11,.katex .sizing.reset-size2.size11{font-size:4.1466666667em}.katex .fontsize-ensurer.reset-size3.size1,.katex .sizing.reset-size3.size1{font-size:.7142857143em}.katex .fontsize-ensurer.reset-size3.size2,.katex .sizing.reset-size3.size2{font-size:.8571428571em}.katex .fontsize-ensurer.reset-size3.size3,.katex .sizing.reset-size3.size3{font-size:1em}.katex .fontsize-ensurer.reset-size3.size4,.katex .sizing.reset-size3.size4{font-size:1.1428571429em}.katex .fontsize-ensurer.reset-size3.size5,.katex .sizing.reset-size3.size5{font-size:1.2857142857em}.katex .fontsize-ensurer.reset-size3.size6,.katex .sizing.reset-size3.size6{font-size:1.4285714286em}.katex .fontsize-ensurer.reset-size3.size7,.katex .sizing.reset-size3.size7{font-size:1.7142857143em}.katex .fontsize-ensurer.reset-size3.size8,.katex .sizing.reset-size3.size8{font-size:2.0571428571em}.katex .fontsize-ensurer.reset-size3.size9,.katex .sizing.reset-size3.size9{font-size:2.4685714286em}.katex .fontsize-ensurer.reset-size3.size10,.katex .sizing.reset-size3.size10{font-size:2.9628571429em}.katex .fontsize-ensurer.reset-size3.size11,.katex .sizing.reset-size3.size11{font-size:3.5542857143em}.katex .fontsize-ensurer.reset-size4.size1,.katex .sizing.reset-size4.size1{font-size:.625em}.katex .fontsize-ensurer.reset-size4.size2,.katex .sizing.reset-size4.size2{font-size:.75em}.katex .fontsize-ensurer.reset-size4.size3,.katex .sizing.reset-size4.size3{font-size:.875em}.katex .fontsize-ensurer.reset-size4.size4,.katex .sizing.reset-size4.size4{font-size:1em}.katex .fontsize-ensurer.reset-size4.size5,.katex .sizing.reset-size4.size5{font-size:1.125em}.katex .fontsize-ensurer.reset-size4.size6,.katex .sizing.reset-size4.size6{font-size:1.25em}.katex .fontsize-ensurer.reset-size4.size7,.katex .sizing.reset-size4.size7{font-size:1.5em}.katex .fontsize-ensurer.reset-size4.size8,.katex .sizing.reset-size4.size8{font-size:1.8em}.katex .fontsize-ensurer.reset-size4.size9,.katex .sizing.reset-size4.size9{font-size:2.16em}.katex .fontsize-ensurer.reset-size4.size10,.katex .sizing.reset-size4.size10{font-size:2.5925em}.katex .fontsize-ensurer.reset-size4.size11,.katex .sizing.reset-size4.size11{font-size:3.11em}.katex .fontsize-ensurer.reset-size5.size1,.katex .sizing.reset-size5.size1{font-size:.5555555556em}.katex .fontsize-ensurer.reset-size5.size2,.katex .sizing.reset-size5.size2{font-size:.6666666667em}.katex .fontsize-ensurer.reset-size5.size3,.katex .sizing.reset-size5.size3{font-size:.7777777778em}.katex .fontsize-ensurer.reset-size5.size4,.katex .sizing.reset-size5.size4{font-size:.8888888889em}.katex .fontsize-ensurer.reset-size5.size5,.katex .sizing.reset-size5.size5{font-size:1em}.katex .fontsize-ensurer.reset-size5.size6,.katex .sizing.reset-size5.size6{font-size:1.1111111111em}.katex .fontsize-ensurer.reset-size5.size7,.katex .sizing.reset-size5.size7{font-size:1.3333333333em}.katex .fontsize-ensurer.reset-size5.size8,.katex .sizing.reset-size5.size8{font-size:1.6em}.katex .fontsize-ensurer.reset-size5.size9,.katex .sizing.reset-size5.size9{font-size:1.92em}.katex .fontsize-ensurer.reset-size5.size10,.katex .sizing.reset-size5.size10{font-size:2.3044444444em}.katex .fontsize-ensurer.reset-size5.size11,.katex .sizing.reset-size5.size11{font-size:2.7644444444em}.katex .fontsize-ensurer.reset-size6.size1,.katex .sizing.reset-size6.size1{font-size:.5em}.katex .fontsize-ensurer.reset-size6.size2,.katex .sizing.reset-size6.size2{font-size:.6em}.katex .fontsize-ensurer.reset-size6.size3,.katex .sizing.reset-size6.size3{font-size:.7em}.katex .fontsize-ensurer.reset-size6.size4,.katex .sizing.reset-size6.size4{font-size:.8em}.katex .fontsize-ensurer.reset-size6.size5,.katex .sizing.reset-size6.size5{font-size:.9em}.katex .fontsize-ensurer.reset-size6.size6,.katex .sizing.reset-size6.size6{font-size:1em}.katex .fontsize-ensurer.reset-size6.size7,.katex .sizing.reset-size6.size7{font-size:1.2em}.katex .fontsize-ensurer.reset-size6.size8,.katex .sizing.reset-size6.size8{font-size:1.44em}.katex .fontsize-ensurer.reset-size6.size9,.katex .sizing.reset-size6.size9{font-size:1.728em}.katex .fontsize-ensurer.reset-size6.size10,.katex .sizing.reset-size6.size10{font-size:2.074em}.katex .fontsize-ensurer.reset-size6.size11,.katex .sizing.reset-size6.size11{font-size:2.488em}.katex .fontsize-ensurer.reset-size7.size1,.katex .sizing.reset-size7.size1{font-size:.4166666667em}.katex .fontsize-ensurer.reset-size7.size2,.katex .sizing.reset-size7.size2{font-size:.5em}.katex .fontsize-ensurer.reset-size7.size3,.katex .sizing.reset-size7.size3{font-size:.5833333333em}.katex .fontsize-ensurer.reset-size7.size4,.katex .sizing.reset-size7.size4{font-size:.6666666667em}.katex .fontsize-ensurer.reset-size7.size5,.katex .sizing.reset-size7.size5{font-size:.75em}.katex .fontsize-ensurer.reset-size7.size6,.katex .sizing.reset-size7.size6{font-size:.8333333333em}.katex .fontsize-ensurer.reset-size7.size7,.katex .sizing.reset-size7.size7{font-size:1em}.katex .fontsize-ensurer.reset-size7.size8,.katex .sizing.reset-size7.size8{font-size:1.2em}.katex .fontsize-ensurer.reset-size7.size9,.katex .sizing.reset-size7.size9{font-size:1.44em}.katex .fontsize-ensurer.reset-size7.size10,.katex .sizing.reset-size7.size10{font-size:1.7283333333em}.katex .fontsize-ensurer.reset-size7.size11,.katex .sizing.reset-size7.size11{font-size:2.0733333333em}.katex .fontsize-ensurer.reset-size8.size1,.katex .sizing.reset-size8.size1{font-size:.3472222222em}.katex .fontsize-ensurer.reset-size8.size2,.katex .sizing.reset-size8.size2{font-size:.4166666667em}.katex .fontsize-ensurer.reset-size8.size3,.katex .sizing.reset-size8.size3{font-size:.4861111111em}.katex .fontsize-ensurer.reset-size8.size4,.katex .sizing.reset-size8.size4{font-size:.5555555556em}.katex .fontsize-ensurer.reset-size8.size5,.katex .sizing.reset-size8.size5{font-size:.625em}.katex .fontsize-ensurer.reset-size8.size6,.katex .sizing.reset-size8.size6{font-size:.6944444444em}.katex .fontsize-ensurer.reset-size8.size7,.katex .sizing.reset-size8.size7{font-size:.8333333333em}.katex .fontsize-ensurer.reset-size8.size8,.katex .sizing.reset-size8.size8{font-size:1em}.katex .fontsize-ensurer.reset-size8.size9,.katex .sizing.reset-size8.size9{font-size:1.2em}.katex .fontsize-ensurer.reset-size8.size10,.katex .sizing.reset-size8.size10{font-size:1.4402777778em}.katex .fontsize-ensurer.reset-size8.size11,.katex .sizing.reset-size8.size11{font-size:1.7277777778em}.katex .fontsize-ensurer.reset-size9.size1,.katex .sizing.reset-size9.size1{font-size:.2893518519em}.katex .fontsize-ensurer.reset-size9.size2,.katex .sizing.reset-size9.size2{font-size:.3472222222em}.katex .fontsize-ensurer.reset-size9.size3,.katex .sizing.reset-size9.size3{font-size:.4050925926em}.katex .fontsize-ensurer.reset-size9.size4,.katex .sizing.reset-size9.size4{font-size:.462962963em}.katex .fontsize-ensurer.reset-size9.size5,.katex .sizing.reset-size9.size5{font-size:.5208333333em}.katex .fontsize-ensurer.reset-size9.size6,.katex .sizing.reset-size9.size6{font-size:.5787037037em}.katex .fontsize-ensurer.reset-size9.size7,.katex .sizing.reset-size9.size7{font-size:.6944444444em}.katex .fontsize-ensurer.reset-size9.size8,.katex .sizing.reset-size9.size8{font-size:.8333333333em}.katex .fontsize-ensurer.reset-size9.size9,.katex .sizing.reset-size9.size9{font-size:1em}.katex .fontsize-ensurer.reset-size9.size10,.katex .sizing.reset-size9.size10{font-size:1.2002314815em}.katex .fontsize-ensurer.reset-size9.size11,.katex .sizing.reset-size9.size11{font-size:1.4398148148em}.katex .fontsize-ensurer.reset-size10.size1,.katex .sizing.reset-size10.size1{font-size:.2410800386em}.katex .fontsize-ensurer.reset-size10.size2,.katex .sizing.reset-size10.size2{font-size:.2892960463em}.katex .fontsize-ensurer.reset-size10.size3,.katex .sizing.reset-size10.size3{font-size:.337512054em}.katex .fontsize-ensurer.reset-size10.size4,.katex .sizing.reset-size10.size4{font-size:.3857280617em}.katex .fontsize-ensurer.reset-size10.size5,.katex .sizing.reset-size10.size5{font-size:.4339440694em}.katex .fontsize-ensurer.reset-size10.size6,.katex .sizing.reset-size10.size6{font-size:.4821600771em}.katex .fontsize-ensurer.reset-size10.size7,.katex .sizing.reset-size10.size7{font-size:.5785920926em}.katex .fontsize-ensurer.reset-size10.size8,.katex .sizing.reset-size10.size8{font-size:.6943105111em}.katex .fontsize-ensurer.reset-size10.size9,.katex .sizing.reset-size10.size9{font-size:.8331726133em}.katex .fontsize-ensurer.reset-size10.size10,.katex .sizing.reset-size10.size10{font-size:1em}.katex .fontsize-ensurer.reset-size10.size11,.katex .sizing.reset-size10.size11{font-size:1.1996142719em}.katex .fontsize-ensurer.reset-size11.size1,.katex .sizing.reset-size11.size1{font-size:.2009646302em}.katex .fontsize-ensurer.reset-size11.size2,.katex .sizing.reset-size11.size2{font-size:.2411575563em}.katex .fontsize-ensurer.reset-size11.size3,.katex .sizing.reset-size11.size3{font-size:.2813504823em}.katex .fontsize-ensurer.reset-size11.size4,.katex .sizing.reset-size11.size4{font-size:.3215434084em}.katex .fontsize-ensurer.reset-size11.size5,.katex .sizing.reset-size11.size5{font-size:.3617363344em}.katex .fontsize-ensurer.reset-size11.size6,.katex .sizing.reset-size11.size6{font-size:.4019292605em}.katex .fontsize-ensurer.reset-size11.size7,.katex .sizing.reset-size11.size7{font-size:.4823151125em}.katex .fontsize-ensurer.reset-size11.size8,.katex .sizing.reset-size11.size8{font-size:.578778135em}.katex .fontsize-ensurer.reset-size11.size9,.katex .sizing.reset-size11.size9{font-size:.6945337621em}.katex .fontsize-ensurer.reset-size11.size10,.katex .sizing.reset-size11.size10{font-size:.8336012862em}.katex .fontsize-ensurer.reset-size11.size11,.katex .sizing.reset-size11.size11{font-size:1em}.katex .delimsizing.size1{font-family:KaTeX_Size1}.katex .delimsizing.size2{font-family:KaTeX_Size2}.katex .delimsizing.size3{font-family:KaTeX_Size3}.katex .delimsizing.size4{font-family:KaTeX_Size4}.katex .delimsizing.mult .delim-size1>span{font-family:KaTeX_Size1}.katex .delimsizing.mult .delim-size4>span{font-family:KaTeX_Size4}.katex .nulldelimiter{display:inline-block;width:.12em}.katex .delimcenter,.katex .op-symbol{position:relative}.katex .op-symbol.small-op{font-family:KaTeX_Size1}.katex .op-symbol.large-op{font-family:KaTeX_Size2}.katex .accent>.vlist-t,.katex .op-limits>.vlist-t{text-align:center}.katex .accent .accent-body{position:relative}.katex .accent .accent-body:not(.accent-full){width:0}.katex .overlay{display:block}.katex .mtable .vertical-separator{display:inline-block;min-width:1px}.katex .mtable .arraycolsep{display:inline-block}.katex .mtable .col-align-c>.vlist-t{text-align:center}.katex .mtable .col-align-l>.vlist-t{text-align:left}.katex .mtable .col-align-r>.vlist-t{text-align:right}.katex .svg-align{text-align:left}.katex svg{fill:currentColor;stroke:currentColor;fill-rule:nonzero;fill-opacity:1;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;display:block;height:inherit;position:absolute;width:100%}.katex svg path{stroke:none}.katex img{border-style:none;max-height:none;max-width:none;min-height:0;min-width:0}.katex .stretchy{display:block;overflow:hidden;position:relative;width:100%}.katex .stretchy:after,.katex .stretchy:before{content:""}.katex .hide-tail{overflow:hidden;position:relative;width:100%}.katex .halfarrow-left{left:0;overflow:hidden;position:absolute;width:50.2%}.katex .halfarrow-right{overflow:hidden;position:absolute;right:0;width:50.2%}.katex .brace-left{left:0;overflow:hidden;position:absolute;width:25.1%}.katex .brace-center{left:25%;overflow:hidden;position:absolute;width:50%}.katex .brace-right{overflow:hidden;position:absolute;right:0;width:25.1%}.katex .x-arrow-pad{padding:0 .5em}.katex .cd-arrow-pad{padding:0 .55556em 0 .27778em}.katex .mover,.katex .munder,.katex .x-arrow{text-align:center}.katex .boxpad{padding:0 .3em}.katex .fbox,.katex .fcolorbox{border:.04em solid;box-sizing:border-box}.katex .cancel-pad{padding:0 .2em}.katex .cancel-lap{margin-left:-.2em;margin-right:-.2em}.katex .sout{border-bottom-style:solid;border-bottom-width:.08em}.katex .angl{border-right:.049em solid;border-top:.049em solid;box-sizing:border-box;margin-right:.03889em}.katex .anglpad{padding:0 .03889em}.katex .eqn-num:before{content:"(" counter(katexEqnNo) ")";counter-increment:katexEqnNo}.katex .mml-eqn-num:before{content:"(" counter(mmlEqnNo) ")";counter-increment:mmlEqnNo}.katex .mtr-glue{width:50%}.katex .cd-vert-arrow{display:inline-block;position:relative}.katex .cd-label-left{display:inline-block;position:absolute;right:calc(50% + .3em);text-align:left}.katex .cd-label-right{display:inline-block;left:calc(50% + .3em);position:absolute;text-align:right}.katex-display{display:block;margin:1em 0;text-align:center}.katex-display>.katex{display:block;text-align:center;white-space:nowrap}.katex-display>.katex>.katex-html{display:block;position:relative}.katex-display>.katex>.katex-html>.tag{position:absolute;right:0}.katex-display.leqno>.katex>.katex-html>.tag{left:0;right:auto}.katex-display.fleqn>.katex{padding-left:2em;text-align:left}body{counter-reset:katexEqnNo mmlEqnNo}.math-equation-block{margin:1.5rem 0;padding:1.5rem;background:#f7f9fc;border-radius:12px;border-left:4px solid #3A7AFE}.equation-display{margin-bottom:1rem;text-align:center;font-size:1.1rem}.equation-explanation{margin:1rem 0;padding:.75rem;background:#fff;border-radius:8px;line-height:1.6;color:#1f2d3d}.equation-explanation strong{color:#3a7afe;display:block;margin-bottom:.5rem}.equation-terms{margin:1rem 0;padding:.75rem;background:#fff;border-radius:8px}.equation-terms strong{color:#3a7afe;display:block;margin-bottom:.5rem}.terms-list{list-style:none;padding:0;margin:0}.terms-list li{padding:.4rem 0;color:#1f2d3d;display:flex;align-items:center;gap:.5rem}.terms-list li .katex{color:#3a7afe;font-weight:600}.equation-intuition{margin:1rem 0;padding:.75rem;background:#3a7afe14;border-radius:8px;line-height:1.6;color:#1f2d3d;font-style:italic}.equation-intuition strong{color:#3a7afe;display:block;margin-bottom:.5rem;font-style:normal}@media(max-width:600px){.math-equation-block{padding:1rem}.equation-display{font-size:1rem}}.simple-syntax-highlighter{background-color:var(--bg-color);color:var(--text-color);padding:1rem;border-radius:.5rem;font-family:Fira Code,Consolas,Monaco,monospace;font-size:.9rem;overflow-x:auto;margin:0;border:1px solid var(--border-color);line-height:1.5}.token.keyword{color:var(--syntax-keyword);font-weight:700}.token.string{color:var(--syntax-string)}.token.comment{color:var(--syntax-comment);font-style:italic}.token.number{color:var(--syntax-number)}.token.class-name{color:var(--syntax-class)}.token.builtin{color:var(--syntax-builtin)}.token.identifier{color:var(--text-color)}.big-picture-container{padding:1rem}.pipeline{display:flex;align-items:center;justify-content:center;gap:.5rem;margin-bottom:1.5rem;flex-wrap:wrap}.pipeline-stage{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1.25rem 1.5rem;background:var(--card-bg);border:2px solid var(--border-color);border-radius:12px;min-width:140px;cursor:pointer;transition:all .3s ease}.pipeline-stage:hover{border-color:var(--primary-color);background:#2563eb0d;transform:translateY(-4px) scale(1.05);box-shadow:0 8px 20px #2563eb26}.pipeline-stage.active{border-color:var(--primary-color);background:#2563eb1a;transform:translateY(-4px) scale(1.05);box-shadow:0 8px 20px #2563eb33}.stage-icon{font-size:2.5rem;margin-bottom:.5rem}.stage-name{font-size:.9rem;font-weight:600;color:var(--text-color);text-align:center}.pipeline-arrow{font-size:1.5rem;color:var(--text-muted);font-weight:700}.stage-description{background:#2563eb1a;padding:1rem 1.25rem;border-radius:8px;border-left:4px solid var(--primary-color);line-height:1.6;color:var(--text-color)}.instruction-text{text-align:center;color:var(--text-muted);font-style:italic;padding:1rem}.fade-in{animation:fadeInUp .3s ease}@keyframes fadeInUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media(max-width:600px){.pipeline{flex-direction:column}.pipeline-arrow{transform:rotate(90deg)}.pipeline-stage{width:100%}}.toy-example-container{background:var(--bg-color);border:1px solid var(--border-color);border-radius:8px;padding:20px;font-family:Inter,sans-serif;color:var(--text-color);margin-top:15px}.input-section{margin-bottom:20px;display:flex;align-items:center;gap:10px}.text-input{padding:8px 12px;border:1px solid var(--border-color);border-radius:4px;font-size:1rem;flex-grow:1}@media(max-width:600px){.text-input{font-size:.9rem;padding:6px 10px;width:100%}.input-section{flex-direction:column;align-items:stretch}}.visualization-flow{display:flex;flex-direction:column;align-items:center;gap:10px}.flow-step{background:var(--card-bg);padding:15px;border-radius:8px;box-shadow:0 2px 4px #0000000d;width:100%;text-align:center}.flow-step h4{margin:0 0 10px;font-size:.9rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}.arrow{font-size:1.2rem;color:var(--text-muted);font-weight:700}.token-list,.id-list{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}.token-chip{background:#e3f2fd;color:#1976d2;padding:4px 8px;border-radius:4px;font-family:monospace;font-weight:700}.id-chip{background:#f3e5f5;color:#7b1fa2;padding:4px 8px;border-radius:4px;font-family:monospace;font-weight:700}.vector-list{display:flex;flex-direction:column;gap:8px;align-items:center}.vector-item{display:flex;align-items:center;gap:10px;background:var(--card-bg);padding:5px 10px;border-radius:4px;border:1px solid var(--border-color)}.token-label{width:40px;text-align:right;font-weight:700;font-size:.9rem}.vector-visual{display:flex;gap:2px}.vector-cell{width:15px;height:15px;border-radius:2px}.vector-values{font-family:monospace;font-size:.75rem;color:var(--text-muted)}.encoder-diagram,.decoder-diagram{display:flex;flex-direction:column;align-items:center;gap:5px;margin:20px 0}.diagram-node{background:var(--card-bg);border:2px solid var(--border-color);border-radius:8px;padding:10px 20px;width:250px;text-align:center;transition:all .3s ease;position:relative}.diagram-node.active-node{border-color:var(--active-node-border);background-color:var(--active-node-bg);transform:scale(1.05);box-shadow:0 4px 8px #4caf5033}.diagram-node.completed-node{border-color:#a5d6a7;color:var(--text-muted)}.node-content{display:flex;align-items:center;justify-content:center;gap:10px;font-weight:600}.node-connector{color:var(--text-muted);font-size:1.2rem;margin-top:5px}.side-input{position:absolute;left:100%;top:50%;transform:translateY(-50%);white-space:nowrap;margin-left:15px;background:#fff3e0;color:#e65100;padding:5px 10px;border-radius:4px;font-size:.85rem;border:1px solid #ffe0b2;opacity:0;transition:opacity .5s ease}.side-input.fade-in{opacity:1}.controls{display:flex;justify-content:center;margin-bottom:20px}.animate-btn{background:#2196f3;color:#fff;border:none;padding:10px 20px;border-radius:20px;cursor:pointer;font-size:1rem;font-weight:600;transition:background .2s}.animate-btn:hover{background:#1976d2}.animate-btn:disabled{background:#b0bec5;cursor:not-allowed}.explanation-box{background:var(--bg-color);border-left:4px solid var(--primary-color);padding:15px;border-radius:4px;margin-top:20px}.explanation-box h4{margin:0 0 5px;color:var(--primary-color)}.explanation-box p{margin:0;font-size:.95rem;line-height:1.5}.positional-container{padding:1rem}.word-row{display:flex;justify-content:center;gap:.75rem;margin-bottom:1.5rem;flex-wrap:wrap}.word-box{position:relative;display:flex;flex-direction:column;align-items:center;min-width:80px}.position-indicator{position:absolute;top:-35px;background:var(--primary-color);color:#fff;padding:.25rem .6rem;border-radius:6px;font-size:.8rem;font-weight:600;white-space:nowrap}.slide-down{animation:slideDown .3s ease}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.word-text{padding:.75rem 1rem;background:var(--card-bg);border:2px solid var(--border-color);border-radius:8px;font-weight:600;color:var(--text-color);transition:all .2s ease}.word-box:hover .word-text{border-color:var(--primary-color);transform:translateY(-2px);box-shadow:0 4px 8px #2563eb26}.controls-row{display:flex;gap:.75rem;justify-content:center;margin-bottom:1rem;flex-wrap:wrap}.control-button{padding:.6rem 1.2rem;border:none;border-radius:8px;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .2s ease}.control-button.primary{background:var(--primary-color);color:#fff}.control-button.primary:hover{background:var(--primary-hover);transform:translateY(-2px);box-shadow:0 4px 12px #2563eb4d}.control-button.secondary{background:var(--card-bg);color:var(--text-color);border:2px solid var(--border-color)}.control-button.secondary:hover{border-color:var(--primary-color);color:var(--primary-color);transform:translateY(-2px)}.explanation-text{text-align:center;color:var(--text-muted);font-size:.95rem;line-height:1.5;padding:.75rem}@media(max-width:600px){.word-row{gap:.5rem}.word-box{min-width:65px}.controls-row{flex-direction:column}.control-button{width:100%}}.attention-container{display:flex;flex-direction:column;gap:2rem;padding:1.5rem;background:var(--card-bg);border-radius:12px;color:var(--text-color);box-shadow:0 4px 6px #0000001a}.sentence-display{display:flex;flex-wrap:wrap;gap:.8rem;justify-content:center;padding:2rem;background:var(--bg-color);border-radius:8px;min-height:100px;align-items:center;border:1px solid var(--border-color)}.word-token{position:relative;padding:.5rem 1rem;background:var(--border-color);border-radius:6px;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);-webkit-user-select:none;user-select:none;border:2px solid transparent;color:var(--text-color)}.word-token:hover{background:var(--secondary-color);transform:translateY(-2px)}.word-token.selected{background:#646cff;color:#fff;border-color:#646cff;box-shadow:0 4px 12px #646cff66;z-index:10}.attention-value-label{position:absolute;top:-24px;left:50%;transform:translate(-50%);font-size:.75rem;background:#000c;color:#fff;padding:2px 6px;border-radius:4px;pointer-events:none;white-space:nowrap;font-weight:700}.attention-info{min-height:300px}.instruction-box{text-align:center;padding:2rem;color:var(--text-muted);font-size:1.1rem;border:2px dashed var(--border-color);border-radius:8px;background:var(--bg-color)}.calculation-breakdown{background:var(--card-bg);padding:1.5rem;border-radius:8px;border:1px solid var(--border-color);box-shadow:0 2px 8px #0000000d}.calculation-breakdown h3{margin-top:0;color:#646cff;border-bottom:1px solid #eee;padding-bottom:.5rem}.vector-display{margin:1rem 0;font-family:monospace;background:var(--bg-color);padding:.8rem;border-radius:4px;display:flex;align-items:center;gap:1rem;border:1px solid var(--border-color)}.vector-display .label{color:var(--text-muted);font-weight:600}.vector-display .vector-values{color:#007acc;font-size:1.1rem}.steps-table-container{overflow-x:auto;margin:1.5rem 0;border:1px solid var(--border-color);border-radius:6px}.steps-table{width:100%;border-collapse:collapse;font-size:.9rem}.steps-table th,.steps-table td{padding:.8rem;text-align:left;border-bottom:1px solid var(--border-color)}.steps-table th{background:var(--bg-color);color:var(--heading-color);font-weight:600}.steps-table tr:hover{background:var(--bg-color)}.current-word-row{background:#646cff14}.word-cell{font-weight:700;color:var(--text-color)}.vector-cell{font-family:monospace;color:var(--text-muted);font-size:.85rem}.weight-cell{width:150px}.weight-bar-container{display:flex;align-items:center;gap:.5rem}.weight-bar{height:6px;background:#646cff;border-radius:3px;transition:width .3s ease}.formula-explanation{margin-top:1.5rem;padding:1rem;background:var(--bg-color);border-left:4px solid #646cff;font-size:.9rem;color:var(--text-color)}.fade-in{animation:fadeIn .3s ease-in}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.multihead-container{padding:1rem}.head-selector{display:flex;gap:.75rem;margin-bottom:1.5rem;flex-wrap:wrap;justify-content:center}.head-btn{padding:.7rem 1.2rem;border:2px solid;border-radius:8px;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .3s ease}.head-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.head-btn.active{transform:translateY(-2px);box-shadow:0 6px 16px #0003}.sentence-visualization{display:flex;flex-wrap:wrap;gap:.6rem;justify-content:center;padding:1.5rem;background:var(--bg-color);border-radius:12px;margin-bottom:1.5rem}.word-item{padding:.6rem 1rem;background:var(--card-bg);border:2px solid var(--border-color);border-radius:8px;font-weight:500;transition:all .3s ease}.word-item.highlighted{border-color:var(--highlight-color);background:color-mix(in srgb,var(--highlight-color) 15%,var(--highlight-mix-color));transform:translateY(-2px);box-shadow:0 4px 8px color-mix(in srgb,var(--highlight-color) 25%,transparent);font-weight:600}.head-description{background:var(--card-bg);border:2px solid var(--border-color);border-radius:12px;padding:1.25rem}.desc-title{font-size:1.1rem;font-weight:700;margin-bottom:.5rem}.desc-text{color:var(--text-muted);margin-bottom:1rem;line-height:1.6}.pattern-list{display:flex;flex-direction:column;gap:.5rem}.pattern-item{display:flex;align-items:center;gap:.5rem;padding:.5rem;background:var(--bg-color);border-radius:6px;font-size:.9rem}.pattern-from,.pattern-to{font-weight:600;color:var(--text-color)}.pattern-arrow{color:var(--text-muted);font-weight:700}.pattern-label{color:var(--text-muted);font-size:.85rem;font-style:italic}.slide-in{animation:slideIn .3s ease}@keyframes slideIn{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}@media(max-width:600px){.head-selector{flex-direction:column}.head-btn{width:100%}.sentence-visualization{gap:.4rem;padding:1rem}}.feedforward-container{padding:1rem}.vector-visualization{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:2rem 1rem;background:var(--bg-color);border-radius:12px;margin-bottom:1.5rem}.vector-stage{display:flex;flex-direction:column;align-items:center;gap:.5rem;width:100%;max-width:300px}.stage-label{font-size:.9rem;font-weight:600;color:var(--text-muted);transition:all .3s ease}.stage-label.active{color:var(--primary-color);transform:scale(1.05)}.vector-bar{height:40px;background:var(--border-color);border-radius:8px;display:flex;align-items:center;justify-content:center;transition:all .5s ease;position:relative;overflow:hidden}.vector-bar.original{background:linear-gradient(135deg,#64748b,#475569)}.vector-bar.expanded{background:linear-gradient(135deg,#3b82f6,#2563eb)}.vector-bar.expanded.animate{animation:expand .5s ease}.vector-bar.relu{background:linear-gradient(135deg,#f59e0b,#d97706)}.vector-bar.relu.animate{animation:pulse .5s ease}.vector-bar.compressed{background:linear-gradient(135deg,#10b981,#059669)}.vector-bar.compressed.animate{animation:compress .5s ease}@keyframes expand{0%{transform:scaleX(.5)}50%{transform:scaleX(1.1)}to{transform:scaleX(1)}}@keyframes compress{0%{transform:scaleX(2)}50%{transform:scaleX(.9)}to{transform:scaleX(1)}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.03)}}.bar-label{color:#fff;font-weight:600;font-size:.9rem}.arrow-indicator{font-size:1.5rem;color:var(--border-color);font-weight:700;transition:all .3s ease}.arrow-indicator.active{color:var(--primary-color);animation:bounce .5s ease}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(5px)}}.transform-btn{display:block;margin:0 auto;padding:.8rem 2rem;background:var(--primary-color);color:#fff;border:none;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s ease}.transform-btn:hover:not(:disabled){background:var(--primary-hover);transform:translateY(-2px);box-shadow:0 4px 12px #2563eb4d}.transform-btn:disabled{background:var(--secondary-color);cursor:not-allowed}.explanation{text-align:center;margin-top:1rem;color:var(--text-color);font-size:.95rem;font-weight:500;min-height:24px}@media(max-width:600px){.vector-visualization{padding:1.5rem .5rem}.vector-stage{max-width:250px}}.layernorm-container{padding:1rem}.flow-diagram{position:relative;display:flex;flex-direction:column;align-items:center;gap:1rem;padding:2rem 1rem;background:var(--bg-color);border-radius:12px;margin-bottom:1.5rem;min-height:400px}.flow-node{display:flex;flex-direction:column;align-items:center;gap:.5rem;z-index:2}.node-label{font-size:.85rem;font-weight:600;color:var(--text-muted)}.node-box{padding:.8rem 1.5rem;background:var(--card-bg);border:2px solid var(--primary-color);border-radius:10px;font-weight:600;color:var(--text-color);font-family:Courier New,monospace}.input-node .node-box{border-color:#64748b}.layer-node .node-box{border-color:#3b82f6}.norm-node .node-box{border-color:#f59e0b}.output-node .node-box{border-color:#10b981}.flow-path{width:3px;height:30px;position:relative;transition:all .3s ease}.path-line{width:100%;height:100%;background:var(--border-color);position:relative}.flow-path.flowing .path-line:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:var(--primary-color);animation:flowDown 1.5s ease}@keyframes flowDown{0%{transform:translateY(-100%)}to{transform:translateY(100%)}}.residual-path{position:absolute;left:50%;top:60px;width:100px;height:120px;transform:translate(-50%);z-index:1}.residual-line{position:absolute;width:3px;height:100%;background:var(--border-color);left:-50px;border-radius:3px}.residual-line:before,.residual-line:after{content:"";position:absolute;width:50px;height:3px;background:var(--border-color)}.residual-line:before{top:0;left:0}.residual-line:after{bottom:0;left:0;width:53px}.residual-path.flowing .residual-line:before{animation:flowRight .5s ease .3s}.residual-path.flowing .residual-line{animation:glowLine .5s ease .8s}.residual-path.flowing .residual-line:after{animation:flowRight .5s ease 1.3s}@keyframes flowRight{0%,to{background:var(--border-color)}50%{background:#10b981}}@keyframes glowLine{0%,to{background:var(--border-color)}50%{background:#10b981}}.residual-label{position:absolute;left:-140px;top:50%;transform:translateY(-50%);font-size:.8rem;font-weight:600;color:#10b981;white-space:nowrap}.add-node{width:32px;height:32px;border-radius:50%;background:#10b981;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.2rem;z-index:3;box-shadow:0 2px 8px #10b9814d}.controls{display:flex;gap:.75rem;justify-content:center;margin-bottom:1rem;flex-wrap:wrap}.toggle-btn,.animate-btn{padding:.7rem 1.5rem;border:none;border-radius:8px;font-size:.95rem;font-weight:600;cursor:pointer;transition:all .2s ease}.toggle-btn{background:var(--primary-color);color:#fff}.toggle-btn:hover{background:var(--primary-hover);transform:translateY(-2px);box-shadow:0 4px 12px #2563eb4d}.animate-btn{background:var(--card-bg);color:var(--primary-color);border:2px solid var(--primary-color)}.animate-btn:hover{background:#2563eb0d;transform:translateY(-2px)}.info-box{background:var(--card-bg);border:2px solid var(--border-color);border-radius:12px;padding:1rem 1.25rem;line-height:1.6;color:var(--text-color)}@media(max-width:600px){.flow-diagram{padding:1.5rem .5rem}.residual-label{font-size:.7rem;left:-120px}.controls{flex-direction:column}.toggle-btn,.animate-btn{width:100%}}.completion-indicator{padding:.5rem .9rem;display:flex;align-items:center;gap:.5rem;border-radius:999px;background:#fff;border:1px solid #E5E7EB;box-shadow:0 2px 8px #00000014}.completion-indicator.complete{background:#10b981;border-color:#10b981;animation:celebrate .6s ease}@keyframes celebrate{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.completion-content{display:flex;align-items:center;gap:.5rem;font-size:.9rem;font-weight:600}.completion-indicator.complete .completion-content{color:#fff}.completion-text{color:#1f2d3d}.completion-indicator.complete .completion-text{color:#fff}.completion-icon{font-size:1.2rem}.completion-check{font-size:1.1rem}.progress-bar{width:80px;height:6px;background:#e5e7eb;border-radius:3px;overflow:hidden}.progress-fill{height:100%;background:#3a7afe;border-radius:3px;transition:width .4s ease}@media(max-width:600px){.completion-indicator{position:static;width:100%;margin-bottom:1rem}.completion-content{justify-content:center}.progress-bar{width:100px}}.concept-summary-section{background:var(--card-bg);padding:2rem;border-radius:12px;box-shadow:0 2px 8px #00000014;margin:2rem 0;transition:background-color .5s ease,border-color .5s ease}.concept-summary-section.summary-complete{background-color:#d1fae5}.concept-summary-section.summary-complete .summary-textarea{border-color:#10b981;background-color:var(--bg-color)}.summary-header{margin-bottom:1.5rem}.summary-title{font-size:1.5rem;color:var(--heading-color);margin:0 0 .75rem}.summary-hint{color:var(--text-muted);font-size:.95rem;line-height:1.5;margin:0}.summary-textarea{width:100%;padding:1rem;border:2px solid #E5E7EB;border-radius:8px;font-size:1rem;font-family:inherit;line-height:1.6;resize:vertical;min-height:150px;transition:all .2s ease;color:var(--text-color);background:var(--bg-color);border-color:var(--border-color)}.summary-textarea:focus{outline:none;border-color:#3a7afe;box-shadow:0 0 0 3px #3a7afe1a}.summary-textarea::placeholder{color:#9ca3af;font-style:italic}.summary-footer{margin-top:.75rem;text-align:right}.summary-info{font-size:.85rem;color:var(--text-muted);font-style:italic}@media(max-width:600px){.concept-summary-section{padding:1.5rem}.summary-title{font-size:1.25rem}}.concept-explorer{max-width:1200px;margin:0 auto;padding:2rem}.explorer-header{text-align:center;margin-bottom:3rem}.explorer-title{font-size:2.5rem;color:var(--heading-color);margin-bottom:.5rem;font-weight:800}.explorer-subtitle{font-size:1.2rem;color:var(--text-muted);margin:0}.concepts-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem}.concept-card-item{background:var(--card-bg);border-radius:16px;padding:2rem;box-shadow:0 4px 6px #0000000d;transition:all .3s ease;display:flex;flex-direction:column;align-items:flex-start;border:1px solid var(--border-color);position:relative;overflow:hidden}.concept-card-item:hover{transform:translateY(-5px);box-shadow:0 12px 20px #0000001a;border-color:#3a7afe}.primary-card{border-top:6px solid #3A7AFE}.placeholder-card{opacity:.8;background:var(--bg-color);border:1px solid var(--border-color)}.card-badge{font-size:.75rem;font-weight:700;padding:.25rem .75rem;border-radius:20px;margin-bottom:1rem;text-transform:uppercase;letter-spacing:.5px}.card-badge.intermediate{background:#e0f2fe;color:#0284c7}.card-badge.coming-soon{background:#f3f4f6;color:#9ca3af}.card-title{font-size:1.5rem;color:var(--heading-color);margin:0 0 .75rem;font-weight:700}.card-description{color:var(--text-muted);font-size:1rem;line-height:1.6;margin:0 0 2rem;flex-grow:1}.card-cta-btn{width:100%;padding:.875rem;border-radius:8px;font-weight:600;font-size:1rem;cursor:pointer;transition:all .2s;border:none}.primary-card .card-cta-btn{background:#3a7afe;color:#fff}.primary-card .card-cta-btn:hover{background:#2563eb;box-shadow:0 4px 12px #2563eb33}.placeholder-card .card-cta-btn.disabled{background:#e5e7eb;color:#9ca3af;cursor:not-allowed}@media(max-width:768px){.concepts-grid{grid-template-columns:1fr}.explorer-title{font-size:2rem}}
