.sidebar{position:fixed;left:0;top:0;bottom:0;width:230px;background:var(--bg-sidebar);display:flex;flex-direction:column;justify-content:space-between;padding:1.5rem 0;z-index:100;border-right:1px solid var(--border-color)}.sidebar-top{display:flex;flex-direction:column;gap:2.5rem}.sidebar-logo{display:flex;align-items:center;gap:.75rem;padding:0 1.5rem}.logo-icon{font-size:1.6rem}.logo-text{font-size:1.1rem;font-weight:700;color:#fff;letter-spacing:-.01em}.sidebar-nav{list-style:none;display:flex;flex-direction:column;gap:.3rem;padding:0 .85rem}.sidebar-link{display:flex;align-items:center;gap:.85rem;padding:.8rem 1rem;border-radius:10px;text-decoration:none;color:var(--text-secondary);font-size:.95rem;font-weight:600;transition:all .15s ease}.sidebar-link:hover{background:var(--bg-card);color:var(--text-primary)}.sidebar-link.active{background:linear-gradient(135deg,#6c63ff26,#1db89a1a);color:#fff;border-left:3px solid #6C63FF;padding-left:calc(1rem - 3px)}.sidebar-icon{font-size:1.25rem;width:26px;text-align:center;flex-shrink:0}.sidebar-label{white-space:nowrap}.sidebar-bottom{padding:1rem .85rem 0;border-top:1px solid var(--border-color)}.sidebar-about{display:flex;align-items:center;gap:.85rem;padding:.7rem 1rem;border-radius:10px;color:var(--text-secondary);font-size:.85rem;font-weight:500;cursor:default;transition:all .15s ease}.sidebar-about:hover{background:var(--bg-card);color:var(--text-primary)}.mobile-tab-bar{display:none}@media (max-width: 768px){.sidebar{display:none}.mobile-tab-bar{display:flex;position:fixed;bottom:0;left:0;right:0;background:var(--bg-sidebar);border-top:1px solid var(--border-color);z-index:100;padding:.5rem 0;justify-content:space-around;align-items:center}.tab-item{display:flex;flex-direction:column;align-items:center;gap:.2rem;text-decoration:none;color:var(--text-secondary);font-weight:600;padding:.4rem 1rem;border-radius:8px;transition:all .15s ease}.tab-item.active{color:var(--primary-color)}.tab-icon{font-size:1.35rem}.tab-label{font-size:.65rem;letter-spacing:.02em}}.app-layout{display:flex;min-height:100vh;background:var(--bg-primary)}.main-content{flex:1;margin-left:230px;min-height:100vh;overflow-y:auto}@media (max-width: 768px){.main-content{margin-left:0;padding-bottom:70px}}.home-page{padding:2rem;max-width:860px;margin:0 auto;animation:fadeIn .4s ease}.welcome-banner{background:linear-gradient(135deg,#243b55,#264560 40%,#1f3a50);border:1px solid rgba(108,99,255,.15);border-radius:16px;padding:2.5rem;margin-bottom:2rem;position:relative;overflow:hidden}.welcome-banner:before{content:"";position:absolute;top:-80px;right:-60px;width:260px;height:260px;background:radial-gradient(circle,rgba(108,99,255,.18) 0%,transparent 70%);border-radius:50%}.welcome-banner:after{content:"";position:absolute;bottom:-60px;left:-40px;width:200px;height:200px;background:radial-gradient(circle,rgba(29,184,154,.15) 0%,transparent 70%);border-radius:50%}.welcome-content{display:flex;justify-content:space-between;align-items:center;gap:2rem;position:relative;z-index:1}.welcome-text h1{font-size:1.85rem;font-weight:700;color:#fff;margin-bottom:.6rem;line-height:1.2}.welcome-text p{color:#b8cadc;font-size:1rem;line-height:1.6;margin-bottom:1.5rem;max-width:460px}.start-btn{background:linear-gradient(135deg,#6c63ff,#8b7dff);color:#fff;border:none;padding:.8rem 1.8rem;border-radius:10px;font-size:.95rem;font-weight:700;cursor:pointer;transition:all .15s ease;font-family:inherit}.start-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #6c63ff59}.welcome-graphic{flex-shrink:0}.welcome-emoji{font-size:4.5rem;display:block}.section{margin-bottom:2rem}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.section-title{font-size:1.2rem;font-weight:700;color:var(--text-heading);margin-bottom:.85rem}.section-header .section-title{margin-bottom:0}.view-all-btn{background:none;border:none;color:#6c63ff;font-size:.9rem;font-weight:600;cursor:pointer;font-family:inherit;transition:opacity .15s}.view-all-btn:hover{opacity:.75}.continue-card{background:var(--bg-card);border:1px solid var(--border-color);border-left:4px solid #E5A100;border-radius:12px;padding:1.25rem 1.5rem;display:flex;align-items:center;gap:1.25rem;cursor:pointer;transition:all .15s ease}.continue-card:hover{background:var(--bg-card-hover);border-color:#e5a100;border-left-color:#e5a100}.continue-icon{font-size:2.25rem;flex-shrink:0}.continue-info{flex:1}.continue-info h3{font-size:1.05rem;font-weight:700;color:var(--text-heading);margin-bottom:.15rem}.continue-info>p{color:var(--text-secondary);font-size:.85rem;margin-bottom:.6rem}.continue-progress{display:flex;align-items:center;gap:.65rem}.continue-progress-bar{flex:1;height:6px;background:var(--bg-primary);border-radius:3px;overflow:hidden;max-width:180px}.continue-progress-fill{height:100%;background:#e5a100;border-radius:3px;transition:width .3s ease}.continue-progress-text{font-size:.75rem;color:var(--text-secondary);white-space:nowrap}.continue-arrow{font-size:1.3rem;color:#e5a100;flex-shrink:0}.featured-grid{display:flex;flex-direction:column;gap:.75rem}.featured-card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:12px;padding:1.25rem 1.5rem;cursor:pointer;transition:all .15s ease;display:flex;align-items:center;gap:1.25rem}.featured-card:hover{background:var(--bg-card-hover);border-color:var(--primary-color)}.featured-card-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:0;gap:.5rem}.level-badge{padding:.2rem .6rem;border-radius:6px;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em}.level-badge.beginner{background:#1db89a1f;color:var(--primary-color)}.level-badge.intermediate{background:#e5a1001f;color:var(--secondary-color)}.level-badge.advanced{background:#d94f4f1f;color:var(--danger-color)}.duration{font-size:.78rem;color:var(--text-secondary)}.featured-card h3{font-size:1rem;font-weight:700;color:var(--text-heading);margin-bottom:.2rem;line-height:1.3}.featured-card p{font-size:.85rem;color:var(--text-secondary);line-height:1.4;margin-bottom:0;flex:1}.featured-btn{background:var(--primary-color);border:none;color:#fff;padding:.5rem 1rem;border-radius:8px;font-size:.8rem;font-weight:700;cursor:pointer;font-family:inherit;transition:all .15s ease;white-space:nowrap;flex-shrink:0}.featured-btn:hover{background:var(--primary-hover);transform:translateY(-1px)}.about-card{background:linear-gradient(135deg,#283d52,#243b55);border:1px solid rgba(108,99,255,.18);border-radius:12px;padding:1.75rem;display:flex;gap:1.5rem;align-items:flex-start}.about-card-icon{font-size:2.5rem;flex-shrink:0}.about-card-content h2{font-size:1.15rem;font-weight:700;color:#fff;margin-bottom:.6rem}.about-card-content p{color:#b0bdcc;font-size:.9rem;line-height:1.65;margin-bottom:.6rem}.about-card-content p:last-child{margin-bottom:0}@media (max-width: 768px){.home-page{padding:1.25rem}.welcome-banner{padding:1.5rem}.welcome-content{flex-direction:column;text-align:center}.welcome-text h1{font-size:1.4rem}.welcome-graphic{display:none}.featured-card{flex-direction:column;align-items:flex-start}.featured-btn{width:100%;text-align:center}.about-card{flex-direction:column;text-align:center;align-items:center}}.lessons-page{min-height:100vh;background:var(--bg-primary);animation:fadeIn .4s ease}.lessons-container{max-width:700px;margin:0 auto;padding:2rem}.lessons-header{margin-bottom:2.5rem}.lessons-header h1{font-size:1.75rem;color:var(--text-heading);margin-bottom:.4rem;font-weight:700}.lessons-header p{font-size:.95rem;color:var(--text-secondary)}.lesson-path{display:flex;flex-direction:column;gap:0;position:relative}.path-item{display:flex;align-items:flex-start;gap:1.25rem;position:relative;cursor:pointer;padding-bottom:1.5rem}.path-item:last-child{padding-bottom:0}.path-connector{position:absolute;left:22px;top:46px;bottom:0;width:2px;background:var(--border-color);z-index:0}.path-step{flex-shrink:0;width:46px;height:46px;border-radius:50%;background:var(--bg-card);border:2.5px solid var(--step-color, var(--primary-color));display:flex;align-items:center;justify-content:center;z-index:1;transition:all .2s ease;margin-top:.75rem}.path-item:hover .path-step{background:var(--step-color, var(--primary-color));box-shadow:0 0 18px color-mix(in srgb,var(--step-color, var(--primary-color)) 35%,transparent)}.step-number{font-size:1rem;font-weight:700;color:var(--step-color, var(--primary-color));transition:color .2s ease}.path-item:hover .step-number{color:#fff}.path-card{flex:1;background:var(--bg-card);border:1px solid var(--border-color);border-left:3px solid var(--step-color, var(--primary-color));border-radius:12px;padding:1.25rem 1.5rem;transition:all .2s ease}.path-item:hover .path-card{background:var(--bg-card-hover);border-color:var(--step-color, var(--primary-color));border-left-color:var(--step-color, var(--primary-color))}.path-card-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.path-level{padding:.2rem .6rem;border-radius:6px;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em}.path-level.beginner{background:#1db89a1f;color:var(--primary-color)}.path-level.intermediate{background:#e5a1001f;color:var(--secondary-color)}.path-level.advanced{background:#d94f4f1f;color:var(--danger-color)}.path-duration{color:var(--text-secondary);font-size:.8rem}.path-card h3{color:var(--text-heading);font-size:1.1rem;margin-bottom:.35rem;font-weight:700;line-height:1.3}.path-card p{color:var(--text-secondary);line-height:1.5;margin-bottom:1rem;font-size:.88rem}.path-btn{background:var(--step-color, var(--primary-color));border:none;color:#fff;padding:.55rem 1.1rem;border-radius:8px;font-weight:700;cursor:pointer;transition:all .15s ease;font-family:inherit;font-size:.85rem;opacity:.85}.path-item:hover .path-btn{opacity:1;transform:translateY(-1px)}.lessons-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:60vh;color:var(--text-secondary)}.loading-spinner{width:36px;height:36px;border:3px solid var(--border-color);border-top:3px solid var(--primary-color);border-radius:50%;animation:spin .8s linear infinite;margin-bottom:1rem}.no-lessons{text-align:center;padding:3rem;color:var(--text-secondary)}@media (max-width: 768px){.lessons-container{padding:1.25rem}.lessons-header h1{font-size:1.4rem}.path-card{padding:1rem 1.25rem}.path-step{width:38px;height:38px}.path-connector{left:18px;top:38px}.step-number{font-size:.9rem}}.audio-player-wrapper{display:inline-flex;align-items:center;gap:.5rem;margin-left:.5rem}.audio-play-button{background:var(--primary-color);border:none;border-radius:50%;width:28px;height:28px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease;padding:0;box-shadow:0 2px 8px #1db89a33;flex-shrink:0}.audio-play-button:hover:not(:disabled){transform:scale(1.1);box-shadow:0 4px 12px #1db89a4d}.audio-play-button:active:not(:disabled){transform:scale(.95)}.audio-play-button:disabled{opacity:.5;cursor:wait}.audio-play-button.playing{background:#ff6b6b;animation:pulse 1.5s ease-in-out infinite}.audio-play-button.error{background:#e74c3c}@keyframes pulse{0%,to{box-shadow:0 2px 8px #ff6b6b4d}50%{box-shadow:0 4px 16px #ff6b6b80}}.audio-icon{color:#fff;font-size:10px;line-height:1;display:inline-block}.audio-icon.play{margin-left:1px}.audio-icon.pause{font-size:9px}.audio-icon.loading{animation:spin 1s linear infinite;font-size:11px}.audio-icon.error{font-size:11px;color:#fff}.audio-error-message{font-size:.75rem;color:#e74c3c;font-style:italic}@media (max-width: 768px){.audio-play-button{width:26px;height:26px}.audio-icon{font-size:9px}.audio-icon.play{margin-left:.5px}}.lesson-detail-page{min-height:100vh;background:var(--bg-primary);animation:fadeIn .4s ease}.lesson-detail-container{max-width:800px;margin:0 auto;padding:2rem}.lesson-header{margin-bottom:1.5rem}.lesson-title-section{text-align:left}.lesson-badge{display:inline-block;padding:.25rem .7rem;border-radius:8px;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;margin-bottom:.75rem;background:#6c63ff1f;color:#6c63ff}.lesson-title-section h1{font-size:1.75rem;color:var(--text-heading);margin-bottom:.5rem;font-weight:700;line-height:1.2}.lesson-description{font-size:1rem;color:var(--text-secondary);line-height:1.5}.lesson-progress{margin-bottom:1.5rem}.progress-bar{width:100%;height:10px;background:var(--bg-card);border-radius:5px;overflow:hidden;margin-bottom:.5rem}.progress-fill{height:100%;background:linear-gradient(90deg,var(--primary-color),#6C63FF);transition:width .3s ease;border-radius:5px}.progress-text{text-align:right;color:var(--text-secondary);font-size:.85rem}.lesson-content{background:var(--bg-card);border-radius:14px;padding:2rem;border:1px solid var(--border-color);border-top:3px solid #6C63FF;margin-bottom:1.5rem;min-height:300px}.lesson-section h2{color:var(--primary-color);font-size:1.5rem;margin-bottom:1.5rem;font-weight:700}.text-content{font-size:1.05rem;line-height:1.8;color:var(--text-secondary)}.text-content p{margin-bottom:1.25rem}.vocabulary-list{display:flex;flex-direction:column;gap:1rem}.vocabulary-item{background:var(--bg-primary);padding:1.25rem;border-radius:12px;border-left:4px solid var(--primary-color);transition:all .2s ease}.vocabulary-item:nth-child(6n+1){border-left-color:#6c63ff}.vocabulary-item:nth-child(6n+2){border-left-color:#1db89a}.vocabulary-item:nth-child(6n+3){border-left-color:#e5a100}.vocabulary-item:nth-child(6n+4){border-left-color:#e8567f}.vocabulary-item:nth-child(6n+5){border-left-color:#3b82f6}.vocabulary-item:nth-child(6n+6){border-left-color:#a855f7}.vocabulary-item:hover{background:var(--bg-card-hover)}.vocab-main{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem;flex-wrap:wrap;gap:1rem}.vocab-okrika{flex:1;min-width:200px}.vocab-okrika-header{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.vocab-okrika h3{font-size:1.25rem;color:var(--primary-color);font-weight:700;margin:0}.vocab-part-of-speech{font-size:.85rem;color:var(--text-secondary);font-weight:400}.vocab-definition{font-size:.95rem;color:var(--text-secondary);margin:.35rem 0 0;font-weight:400}.vocab-forms{font-size:.9rem;color:var(--text-secondary);margin-top:.4rem;padding-top:.4rem;border-top:1px solid var(--border-color)}.form-label{font-weight:600;color:var(--text-primary);margin-right:.3rem}.form-separator{margin:0 .75rem;color:var(--border-color)}.vocab-english{flex:1;text-align:right}.vocab-english p{font-size:1.05rem;color:var(--text-primary);font-weight:500}.vocab-example{margin-top:.75rem;padding-top:.75rem;border-top:1px solid var(--border-color)}.example-okrika{color:var(--primary-color);font-size:.95rem;margin-bottom:.4rem;font-weight:500;display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.example-okrika strong{color:var(--text-primary);margin-right:.4rem}.form-indicator{font-size:.85rem;color:var(--primary-color);font-weight:500;margin-top:.4rem;margin-bottom:.4rem}.form-indicator strong{color:var(--text-primary);margin-right:.3rem}.example-translation{color:var(--text-secondary);font-size:.9rem;font-style:italic}.example-translation strong{color:var(--text-primary);margin-right:.4rem;font-style:normal}.vocab-conjugations{margin-top:.75rem;padding-top:.75rem;border-top:1px solid var(--primary-color)}.conjugations-title{color:var(--primary-color);font-size:1rem;font-weight:700;margin-bottom:.75rem}.conjugations-dropdown{display:flex;flex-direction:column;gap:.4rem}.conjugation-dropdown-item{border:1px solid var(--border-color);border-radius:10px;overflow:hidden;transition:all .2s ease}.conjugation-dropdown-item:hover{border-color:var(--primary-color)}.conjugation-dropdown-header{width:100%;background:var(--bg-card);border:none;padding:.7rem 1rem;display:flex;justify-content:space-between;align-items:center;cursor:pointer;font-family:inherit;transition:all .2s ease;text-align:left;color:var(--text-primary)}.conjugation-dropdown-header:hover{background:var(--bg-card-hover)}.conjugation-dropdown-header:focus{outline:2px solid var(--primary-color);outline-offset:-2px}.conjugation-label{font-weight:600;color:var(--primary-color);font-size:.9rem}.dropdown-arrow{color:var(--primary-color);font-size:.75rem;transition:transform .2s ease;flex-shrink:0;margin-left:1rem}.conjugation-dropdown-content{padding:.85rem 1rem;background:var(--bg-primary);animation:slideDown .2s ease}@keyframes slideDown{0%{opacity:0;max-height:0}to{opacity:1;max-height:200px}}.conjugation-example{color:var(--text-primary);font-size:.9rem;display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.conjugation-example strong{color:var(--text-primary);margin-right:.3rem}.conjugation-example-translation{color:var(--text-secondary);font-style:italic}.lesson-navigation{display:flex;justify-content:space-between;gap:1rem;margin-bottom:1.5rem}.nav-button{padding:.85rem 1.75rem;border:none;border-radius:12px;font-size:.95rem;font-weight:700;cursor:pointer;transition:all .2s ease;font-family:inherit;flex:1;max-width:200px}.nav-button.prev{background:var(--bg-card);color:var(--text-primary);border:1px solid var(--border-color)}.nav-button.prev:hover:not(:disabled){background:var(--bg-card-hover);border-color:var(--primary-color)}.nav-button.next{background:var(--primary-color);color:#fff}.nav-button.next:hover:not(:disabled){background:var(--primary-hover);transform:translateY(-2px);box-shadow:0 4px 15px #1db89a40}.nav-button:disabled{opacity:.3;cursor:not-allowed}.lesson-complete{background:linear-gradient(135deg,#2a4060,#283d52);border:1px solid rgba(108,99,255,.25);color:var(--text-primary);padding:2rem;border-radius:14px;text-align:center;margin-top:1rem}.lesson-complete h3{font-size:1.5rem;margin-bottom:.75rem;color:var(--text-heading)}.lesson-complete p{font-size:1rem;margin-bottom:1.25rem;color:var(--text-secondary)}.complete-button{background:linear-gradient(135deg,#6c63ff,#a855f7);color:#fff;border:none;padding:.85rem 2rem;border-radius:12px;font-size:1rem;font-weight:700;cursor:pointer;transition:all .2s ease;font-family:inherit}.complete-button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #6c63ff4d}.lesson-loading,.lesson-error{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:60vh;color:var(--text-secondary)}.lesson-error h2{color:var(--text-primary);margin-bottom:1.25rem}.lesson-error button{background:var(--primary-color);color:#fff;border:none;padding:.85rem 1.75rem;border-radius:12px;font-size:1rem;font-weight:700;cursor:pointer;transition:all .2s ease;font-family:inherit}.lesson-error button:hover{background:var(--primary-hover);transform:translateY(-2px)}.part-navigation{display:flex;gap:.5rem;margin-bottom:1.5rem;flex-wrap:wrap}.part-tab{padding:.65rem 1.25rem;border:1px solid var(--border-color);background:var(--bg-card);color:var(--text-secondary);border-radius:10px;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .2s ease;font-family:inherit}.part-tab:hover{background:var(--bg-card-hover);color:var(--text-primary)}.part-tab.active{background:#6c63ff;color:#fff;border-color:#6c63ff}.quiz-section{text-align:center}.quiz-container{max-width:600px;margin:0 auto}.quiz-review-dropdown{margin-top:1.25rem;text-align:left;border-radius:10px;border:1px solid var(--border-color);background:var(--bg-primary);overflow:hidden}.quiz-review-summary{list-style:none;cursor:pointer;padding:.55rem .85rem;font-size:.8rem;font-weight:600;color:var(--text-secondary);-webkit-user-select:none;user-select:none;transition:color .2s ease,background .2s ease}.quiz-review-summary::-webkit-details-marker{display:none}.quiz-review-summary:before{content:"▶";display:inline-block;margin-right:.45rem;font-size:.65rem;transition:transform .2s ease;color:#e74c3c}.quiz-review-dropdown[open] .quiz-review-summary:before{transform:rotate(90deg)}.quiz-review-dropdown[open] .quiz-review-summary{color:var(--text-primary);border-bottom:1px solid var(--border-color)}.quiz-review-summary:hover{background:var(--bg-card-hover);color:var(--text-primary)}.quiz-review-list{list-style:none;margin:0;padding:.5rem .85rem .65rem;max-height:10rem;overflow-y:auto;display:flex;flex-direction:column;gap:.5rem}.quiz-review-item{display:flex;flex-direction:column;gap:.15rem;padding-bottom:.5rem;border-bottom:1px solid var(--border-color)}.quiz-review-item:last-child{padding-bottom:0;border-bottom:none}.quiz-review-word{font-size:.9rem;font-weight:700;color:var(--text-primary)}.quiz-review-detail{font-size:.78rem;color:var(--text-secondary);line-height:1.35}.quiz-review-detail strong{color:var(--text-primary);font-weight:600}.question-header{margin-bottom:1.25rem}.question-number{display:inline-block;background:var(--bg-primary);padding:.4rem .85rem;border-radius:8px;color:var(--text-secondary);font-size:.85rem;font-weight:600}.question-text{margin-bottom:1.5rem}.question-text h3{font-size:1.3rem;color:var(--text-primary);font-weight:600;line-height:1.4}.quiz-options{display:flex;flex-direction:column;gap:.75rem;margin-bottom:1.5rem}.quiz-option{padding:1rem 1.25rem;border:2px solid var(--border-color);background:var(--bg-primary);border-radius:12px;font-size:1rem;font-weight:500;cursor:pointer;transition:all .2s ease;text-align:left;font-family:inherit;color:var(--text-primary)}.quiz-option:hover:not(:disabled){border-color:var(--primary-color);background:var(--bg-card-hover)}.quiz-option:disabled{cursor:not-allowed}.quiz-option.selected{border-color:var(--primary-color);background:var(--bg-card-hover)}.quiz-option.correct{border-color:var(--primary-color);background:#1db89a1f;color:var(--primary-color);font-weight:700}.quiz-option.incorrect{border-color:#e74c3c;background:#e74c3c26;color:#e74c3c;font-weight:700}.quiz-feedback{margin-top:1.25rem;padding:1.25rem;border-radius:12px;background:var(--bg-primary);animation:quiz-feedback-in .5s ease-out .25s both}@keyframes quiz-feedback-in{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion: reduce){.quiz-feedback{animation:none;opacity:1;transform:none}}.feedback-correct{color:var(--primary-color);font-size:1.1rem;font-weight:700;margin-bottom:.75rem}.feedback-incorrect{color:#e74c3c;font-size:1rem;margin-bottom:.75rem}.feedback-incorrect strong{color:var(--primary-color)}.quiz-next-button{background:var(--primary-color);color:#fff;border:none;padding:.85rem 1.75rem;border-radius:12px;font-size:.95rem;font-weight:700;cursor:pointer;transition:all .2s ease;font-family:inherit;margin-top:.5rem}.quiz-next-button:hover{background:var(--primary-hover);transform:translateY(-2px)}.dialogue-section{text-align:left}.dialogues-list{display:flex;flex-direction:column;gap:1.5rem}.dialogue-item{background:var(--bg-primary);padding:1.5rem;border-radius:12px;border-left:4px solid var(--primary-color)}.dialogue-title{color:var(--primary-color);font-size:1.2rem;font-weight:700;margin-bottom:1.25rem;text-align:center}.exchange-speaker{font-weight:700;color:var(--primary-color);font-size:.9rem}.exchange-content{background:var(--bg-card);padding:.85rem 1.25rem;border-radius:10px;border-left:3px solid var(--accent-color)}.exchange-okrika{font-size:1.1rem;color:var(--text-primary);font-weight:500;margin-bottom:.35rem;display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.exchange-english{font-size:.95rem;color:var(--text-secondary);font-style:italic}@media (max-width: 768px){.lesson-detail-container{padding:1.25rem}.lesson-title-section h1{font-size:1.4rem}.lesson-content{padding:1.25rem}.vocab-main{flex-direction:column;align-items:flex-start}.vocab-english{text-align:left}.vocab-okrika-header{flex-direction:column;align-items:flex-start;gap:.5rem}.lesson-navigation{flex-direction:column}.nav-button{max-width:100%}.part-navigation{flex-direction:column}.part-tab{width:100%;text-align:center}.question-text h3{font-size:1.1rem}.quiz-option{font-size:.95rem;padding:.85rem}.dialogue-item{padding:1rem}.exchange-okrika{font-size:1rem}.conjugation-dropdown-header{padding:.6rem .8rem;font-size:.85rem}.conjugation-label{font-size:.8rem}.conjugation-dropdown-content{padding:.7rem}.conjugation-example{flex-direction:column;align-items:flex-start}}.stories-page{min-height:100vh;background:var(--bg-primary);animation:fadeIn .4s ease}.stories-container{max-width:960px;margin:0 auto;padding:2rem}.stories-header{margin-bottom:2rem}.stories-header h1{font-size:2rem;color:var(--text-heading);margin-bottom:.5rem;font-weight:700}.stories-header p{font-size:1rem;color:var(--text-secondary);max-width:600px}.stories-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1rem}.story-card{background:var(--bg-card);border-radius:14px;padding:1.5rem;border:1px solid var(--border-color);transition:all .2s ease;cursor:pointer;display:flex;flex-direction:column}.story-card:hover{background:var(--bg-card-hover);transform:translateY(-3px)}.story-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem}.story-level{padding:.25rem .7rem;border-radius:8px;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em}.story-level.beginner{background:#1db89a1f;color:var(--primary-color)}.story-level.intermediate{background:#f39c1226;color:var(--secondary-color)}.story-level.advanced{background:#e74c3c26;color:#e74c3c}.story-reading-time{color:var(--text-secondary);font-size:.85rem}.story-card h3{color:var(--text-primary);font-size:1.15rem;margin-bottom:.5rem;font-weight:700;line-height:1.3}.story-card p{color:var(--text-secondary);line-height:1.5;margin-bottom:1.25rem;font-size:.9rem;flex:1}.story-button{background:transparent;border:2px solid var(--primary-color);color:var(--primary-color);padding:.65rem 1.2rem;border-radius:10px;font-weight:700;cursor:pointer;transition:all .2s ease;font-family:inherit;font-size:.9rem;width:100%}.story-button:hover{background:var(--primary-color);color:#fff}.stories-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:60vh;color:var(--text-secondary)}.no-stories{text-align:center;padding:3rem;color:var(--text-secondary)}@media (max-width: 768px){.stories-container{padding:1.25rem}.stories-grid{grid-template-columns:1fr}.stories-header h1{font-size:1.5rem}}.story-detail-page{min-height:100vh;background:var(--bg-primary);animation:fadeIn .4s ease}.story-detail-container{max-width:800px;margin:0 auto;padding:2rem}.story-header{margin-bottom:1.5rem}.back-button{background:transparent;border:1px solid var(--border-color);color:var(--text-secondary);padding:.5rem 1rem;border-radius:10px;cursor:pointer;font-family:inherit;font-weight:600;font-size:.9rem;margin-bottom:1.25rem;transition:all .2s ease;display:inline-block}.back-button:hover{background:var(--bg-card);color:var(--text-primary);border-color:var(--primary-color)}.story-title-section{text-align:left}.story-badge{display:inline-block;padding:.25rem .7rem;border-radius:8px;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;margin-bottom:.75rem;background:#e8567f1f;color:#e8567f}.story-title-section h1{font-size:1.75rem;color:var(--text-heading);margin-bottom:.5rem;font-weight:700;line-height:1.2}.story-description{font-size:1rem;color:var(--text-secondary);line-height:1.5;margin-bottom:.35rem}.story-reading-time{font-size:.9rem;color:var(--text-secondary);font-style:italic}.story-content{background:var(--bg-card);border-radius:14px;padding:2rem;border:1px solid var(--border-color);border-top:3px solid #E8567F;margin-bottom:1.5rem;min-height:300px}.story-instruction{background:var(--bg-primary);padding:.85rem 1.25rem;border-radius:10px;margin-bottom:1.5rem;border-left:4px solid #E5A100}.story-instruction p{margin:0;color:var(--text-secondary);font-size:.9rem;font-weight:500}.story-paragraph{margin-bottom:2rem;padding-bottom:2rem;border-bottom:1px solid var(--border-color)}.story-paragraph:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0}.paragraph-okrika-container{display:flex;align-items:flex-start;gap:.5rem;margin-bottom:.75rem}.paragraph-okrika{flex:1}.paragraph-english-full{margin-top:.75rem;padding:.85rem 1rem;background:var(--bg-primary);border-radius:10px;border-left:3px solid var(--accent-color)}.paragraph-english-full p{font-size:1rem;color:var(--text-secondary);line-height:1.7;font-style:italic;margin:0}.paragraph-okrika p{font-size:1.25rem;color:#fff;font-weight:500;line-height:1.8;text-align:left;margin:0}.story-dialogue{text-align:left}.dialogue-exchanges{display:flex;flex-direction:column;gap:1rem}.dialogue-exchange{display:flex;flex-direction:column;gap:.4rem}.exchange-speaker{font-weight:700;color:var(--primary-color);font-size:.95rem}.dialogue-exchange:nth-child(2n) .exchange-speaker{color:#e8567f}.exchange-content{background:var(--bg-primary);padding:.85rem 1.25rem;border-radius:10px;border-left:3px solid var(--accent-color)}.dialogue-exchange:nth-child(2n) .exchange-content{border-left-color:#e8567f}.exchange-okrika-container{display:flex;align-items:flex-start;gap:.5rem;margin-bottom:.35rem}.exchange-okrika{font-size:1.15rem;color:var(--text-primary);font-weight:500;flex:1;line-height:1.6}.translation-toggle-btn{background:transparent;border:1px solid var(--border-color);color:var(--text-secondary);padding:.35rem .5rem;border-radius:8px;cursor:pointer;font-size:1rem;transition:all .2s ease;flex-shrink:0;display:flex;align-items:center;justify-content:center;min-width:36px;height:36px}.translation-toggle-btn:hover{background:var(--bg-card-hover);border-color:var(--primary-color)}.exchange-english-full{margin-top:.5rem;padding:.65rem .85rem;background:var(--bg-card);border-radius:8px;border-left:3px solid var(--accent-color);font-size:1rem;color:var(--text-secondary);font-style:italic;line-height:1.6}.exchange-english{font-size:1rem;color:var(--text-secondary);font-style:italic}.clickable-word{position:relative;cursor:pointer;color:inherit;text-decoration:underline;text-decoration-color:var(--primary-color);text-decoration-thickness:2px;text-underline-offset:3px;padding:2px 4px;border-radius:4px;transition:all .2s ease;display:inline-block;margin:0 1px}.clickable-word:hover{background:var(--bg-card-hover);text-decoration-thickness:3px}.clickable-word.active{background:var(--bg-card-hover);text-decoration-thickness:3px;text-decoration-color:var(--accent-color)}.word-tooltip{position:absolute;bottom:100%;left:50%;transform:translate(-50%);background:#6c63ff;color:#fff;padding:.4rem .85rem;border-radius:8px;font-size:.85rem;white-space:nowrap;margin-bottom:.5rem;z-index:1000;box-shadow:0 4px 12px #0000004d;font-weight:700}.word-tooltip:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border:6px solid transparent;border-top-color:#6c63ff}.story-complete{background:linear-gradient(135deg,#2a4060,#283d52);border:1px solid rgba(232,86,127,.25);color:var(--text-primary);padding:2rem;border-radius:14px;text-align:center;margin-top:1rem}.story-complete h3{font-size:1.5rem;margin-bottom:.75rem;color:var(--text-heading)}.story-complete p{font-size:1rem;margin-bottom:1.5rem;color:var(--text-secondary)}.story-actions{display:flex;gap:.75rem;justify-content:center;flex-wrap:wrap}.action-button{background:var(--primary-color);color:#fff;border:none;padding:.85rem 2rem;border-radius:12px;font-size:1rem;font-weight:700;cursor:pointer;transition:all .2s ease;font-family:inherit}.action-button:hover{background:var(--primary-hover);transform:translateY(-2px)}.action-button.secondary{background:transparent;border:2px solid var(--primary-color);color:var(--primary-color)}.action-button.secondary:hover{background:var(--primary-color);color:#fff}.story-loading,.story-error{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:60vh;color:var(--text-secondary)}.story-error h2{color:var(--text-primary);margin-bottom:.75rem}.story-error p{color:var(--text-secondary);margin-bottom:1.25rem}.story-error button{background:var(--primary-color);color:#fff;border:none;padding:.85rem 1.75rem;border-radius:12px;font-size:1rem;font-weight:700;cursor:pointer;transition:all .2s ease;font-family:inherit}.story-error button:hover{background:var(--primary-hover);transform:translateY(-2px)}.loading-spinner{width:40px;height:40px;border:3px solid var(--border-color);border-top:3px solid var(--primary-color);border-radius:50%;animation:spin .8s linear infinite;margin-bottom:1rem}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (max-width: 768px){.story-detail-container{padding:1.25rem}.story-title-section h1{font-size:1.4rem}.story-content{padding:1.25rem}.paragraph-okrika p{font-size:1.1rem}.story-actions{flex-direction:column}.action-button{width:100%}}.profile-page{min-height:100vh;background:var(--bg-primary);animation:fadeIn .4s ease}.profile-container{max-width:640px;margin:0 auto;padding:2rem}.profile-heading{font-size:1.75rem;font-weight:700;color:var(--text-heading);margin-bottom:1.5rem}.profile-card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:16px;padding:2rem;display:flex;gap:1.5rem;align-items:flex-start;margin-bottom:2rem}.profile-avatar{flex-shrink:0;width:80px;height:80px;border-radius:50%;overflow:hidden;background:linear-gradient(135deg,#6c63ff,#a855f7)}.profile-avatar img{width:100%;height:100%;object-fit:cover}.profile-avatar-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:2rem;font-weight:700;color:#fff}.profile-info{flex:1;min-width:0}.profile-name{font-size:1.35rem;font-weight:700;color:var(--text-heading);margin-bottom:.25rem}.profile-email{font-size:.9rem;color:var(--text-secondary);margin-bottom:.35rem}.profile-joined{font-size:.85rem;color:var(--text-secondary);margin-bottom:1rem}.profile-stats{display:flex;gap:1.5rem;flex-wrap:wrap}.profile-stat{display:flex;flex-direction:column;align-items:flex-start}.profile-stat-value{font-size:1.5rem;font-weight:700;color:var(--primary-color)}.profile-stat-label{font-size:.75rem;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.04em}.profile-section{margin-bottom:2rem}.profile-section-title{font-size:1.15rem;font-weight:700;color:var(--text-heading);margin-bottom:1rem}.profile-empty{color:var(--text-secondary);font-size:.95rem;padding:1.25rem;background:var(--bg-card);border:1px solid var(--border-color);border-radius:12px;margin-bottom:1rem}.profile-lesson-list{list-style:none;display:flex;flex-direction:column;gap:.5rem;margin-bottom:1rem}.profile-lesson-item{display:flex;align-items:center;gap:1rem;padding:1rem 1.25rem;background:var(--bg-card);border:1px solid var(--border-color);border-radius:12px;cursor:pointer;transition:all .15s ease}.profile-lesson-item:hover{background:var(--bg-card-hover);border-color:var(--primary-color)}.profile-lesson-check{flex-shrink:0;width:28px;height:28px;border-radius:50%;background:#1db89a33;color:var(--primary-color);display:flex;align-items:center;justify-content:center;font-size:.9rem;font-weight:700}.profile-lesson-details{flex:1;min-width:0;display:flex;flex-direction:column;gap:.2rem}.profile-lesson-title{font-weight:600;color:var(--text-primary)}.profile-lesson-meta{font-size:.8rem;color:var(--text-secondary)}.profile-lesson-arrow{color:var(--text-secondary);font-size:1.1rem}.profile-lesson-item:hover .profile-lesson-arrow{color:var(--primary-color)}.profile-cta{display:inline-block;background:var(--primary-color);color:#fff;border:none;padding:.7rem 1.4rem;border-radius:10px;font-size:.9rem;font-weight:700;cursor:pointer;font-family:inherit;transition:all .15s ease}.profile-cta:hover{background:var(--primary-hover);transform:translateY(-1px)}.profile-cta-secondary{background:transparent;border:2px solid var(--primary-color);color:var(--primary-color)}.profile-cta-secondary:hover{background:var(--primary-color);color:#fff}.profile-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:60vh;color:var(--text-secondary)}.profile-loading .loading-spinner{width:40px;height:40px;border:3px solid var(--border-color);border-top:3px solid var(--primary-color);border-radius:50%;animation:spin .8s linear infinite;margin-bottom:1rem}@keyframes spin{to{transform:rotate(360deg)}}@media (max-width: 768px){.profile-container{padding:1.25rem}.profile-card{flex-direction:column;align-items:center;text-align:center}.profile-stats{justify-content:center}.profile-heading{font-size:1.4rem}}.auth-page{min-height:100vh;background:var(--bg-primary);display:flex;align-items:center;justify-content:center;padding:1.5rem}.auth-container{width:100%;max-width:520px;background:var(--bg-card);border:1px solid var(--border-color);border-radius:16px;padding:2rem}.auth-container h1{color:var(--text-heading);font-weight:800;margin-bottom:.25rem}.auth-subtitle{color:var(--text-secondary);margin-bottom:1.25rem;font-size:.95rem}.auth-form{display:flex;flex-direction:column;gap:1rem}.auth-label{color:var(--text-secondary);font-size:.9rem;display:flex;flex-direction:column;gap:.45rem;font-weight:600}.auth-label input{background:var(--bg-primary);border:1px solid var(--border-color);border-radius:12px;padding:.85rem 1rem;color:var(--text-primary);font-family:inherit;outline:none}.auth-label input:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary-color) 25%,transparent)}.auth-error{background:#d94f4f26;border:1px solid rgba(217,79,79,.35);color:#ffb6b6;padding:.75rem 1rem;border-radius:12px;font-weight:600}.auth-button{background:var(--primary-color);border:none;color:#fff;padding:.95rem 1rem;border-radius:12px;font-size:1rem;font-weight:800;cursor:pointer;transition:transform .15s ease,background .15s ease}.auth-button:disabled{opacity:.7;cursor:not-allowed}.auth-button:hover:not(:disabled){transform:translateY(-1px);background:var(--primary-hover)}.auth-toggle{width:100%;margin-top:1.25rem;background:transparent;border:1px solid var(--border-color);color:var(--text-secondary);padding:.8rem 1rem;border-radius:12px;cursor:pointer;font-weight:800}.auth-toggle:disabled{opacity:.7;cursor:not-allowed}.auth-back{width:100%;margin-top:.8rem;background:transparent;border:none;color:var(--text-secondary);padding:.5rem .25rem;cursor:pointer;font-weight:700}@media (max-width: 768px){.auth-container{padding:1.25rem}}.about-page{min-height:100vh;background:var(--bg-primary);animation:fadeIn .4s ease}.about-container{max-width:760px;margin:0 auto;padding:2rem;display:flex;flex-direction:column;gap:1.25rem}.about-header h1{font-size:2rem;font-weight:700;color:var(--text-heading);margin-bottom:.4rem}.about-header p{color:var(--text-primary);font-size:1rem}.about-card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:14px;padding:1.75rem;display:flex;flex-direction:column;gap:1rem}.about-card h2{font-size:1.25rem;font-weight:700;color:var(--primary-color);margin-bottom:.25rem}.about-card p{color:var(--text-primary);line-height:1.75;font-size:.975rem;margin:0}.about-footer-card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:14px;padding:1.5rem 1.75rem;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem}.about-credit{color:var(--text-primary);font-size:.9rem;margin:0}.about-links{display:flex;gap:.75rem}.about-link{display:flex;align-items:center;gap:.4rem;color:var(--text-primary);text-decoration:none;font-size:.9rem;font-weight:600;padding:.45rem .9rem;border-radius:8px;border:1px solid var(--border-color);transition:all .2s ease}.about-link:hover{color:var(--primary-color);border-color:var(--primary-color);background:var(--bg-card-hover)}@media (max-width: 768px){.about-header h1{font-size:1.5rem}.about-footer-card{flex-direction:column;align-items:flex-start}}*{margin:0;padding:0;box-sizing:border-box}:root{--bg-primary: #1F2D3D;--bg-sidebar: #182738;--bg-card: #283D52;--bg-card-hover: #325168;--primary-color: #1DB89A;--primary-hover: #17a088;--secondary-color: #E5A100;--accent-color: #4DD4AC;--purple: #6C63FF;--purple-hover: #5A52E0;--pink: #E8567F;--blue: #3B82F6;--violet: #A855F7;--text-primary: #EDF2F7;--text-heading: #FFFFFF;--text-secondary: #94A3B8;--border-color: #3A5068;--danger-color: #D94F4F;--dark-bg: #182738;--light-bg: #283D52;--text-dark: #EDF2F7;--text-light: #EDF2F7;--shadow: 0 4px 16px rgba(0, 0, 0, .2);--shadow-hover: 0 8px 24px rgba(0, 0, 0, .3)}html{scroll-behavior:smooth}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;line-height:1.6;color:var(--text-primary);background:var(--bg-primary);overflow-x:hidden}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--bg-primary)}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--text-secondary)}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideIn{0%{transform:translate(-100%)}to{transform:translate(0)}}.fade-in-up{animation:fadeInUp .5s ease-out}.fade-in{animation:fadeIn .6s ease-out}