.certificate-notification{background:linear-gradient(135deg,#fbbf24,#f59e0b);border:2px solid #d97706;border-radius:12px;padding:20px;margin:20px 0;text-align:center;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;animation:certificateGlow 2s ease-in-out infinite alternate}.certificate-notification h4{color:#92400e;font-size:1.5rem;font-weight:700;margin-bottom:10px;text-shadow:1px 1px 2px rgba(255,255,255,.3)}.certificate-notification p{color:#92400e;font-size:1rem;margin-bottom:15px;font-weight:500}.certificate-notification .btn{background:linear-gradient(135deg,#059669,#047857);border:none;color:#fff;padding:12px 24px;border-radius:8px;font-weight:700;font-size:1rem;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 4px #0000001a}.certificate-notification .btn:hover{background:linear-gradient(135deg,#047857,#065f46);transform:translateY(-2px);box-shadow:0 4px 8px #00000026}@keyframes certificateGlow{0%{box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}to{box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f,0 0 20px #fbbf244d}}.lesson-controls-overlay{background:#fffffff2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:8px;padding:.5rem;margin-bottom:.5rem;box-shadow:0 2px 4px -1px #0000001a;border:1px solid rgba(0,0,0,.1)}.lesson-info-bar{display:flex;justify-content:space-between;align-items:center;gap:1rem}.lesson-info h3{font-size:1rem;font-weight:600;color:#1f2937;margin:0 0 .125rem}.lesson-info p{font-size:.75rem;color:#6b7280;margin:0}.lesson-info .lesson-title{font-size:1rem;font-weight:600;color:#9ca3af;margin:0 0 .125rem}.lesson-info .drill-progress{font-size:.75rem;color:#6b7280;margin:0}.lesson-actions{display:flex;gap:.5rem;align-items:center}.btn{padding:.375rem .75rem;border-radius:4px;font-weight:500;cursor:pointer;transition:all .2s;border:none;font-size:.75rem;text-decoration:none;display:inline-flex;align-items:center;gap:.25rem}.btn-outline{background:transparent;color:#6b7280;border:1px solid #d1d5db}.btn-outline:hover:not(:disabled){background:#f9fafb;border-color:#9ca3af}.lesson-selector-container{max-width:1200px;margin:0 auto;padding:2rem}.lesson-header{text-align:center;margin-bottom:3rem}.lesson-header h2{font-size:2.5rem;font-weight:800;color:#1f2937;margin-bottom:1rem}.progress-overview{display:flex;align-items:center;justify-content:center;gap:1rem;margin-top:1rem}.progress-bar{width:300px;height:8px;background-color:#e5e7eb;border-radius:4px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,#10b981,#059669);transition:width .3s ease}.progress-text{font-weight:600;color:#374151}.lessons-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(350px,1fr));gap:1.5rem;margin-top:2rem}.lesson-card{background:#fff;border-radius:16px;padding:1.5rem;box-shadow:0 4px 6px -1px #0000001a;border:2px solid #e5e7eb;cursor:pointer;transition:all .3s ease;position:relative;overflow:hidden}.lesson-card:hover{transform:translateY(-2px);box-shadow:0 10px 25px -3px #0000001a}.lesson-card.available{border-color:#10b981;background:linear-gradient(135deg,#f0fdf4,#fff)}.lesson-card.available:hover{border-color:#059669;box-shadow:0 10px 25px -3px #10b98133}.lesson-card.completed{border-color:#3b82f6;background:linear-gradient(135deg,#eff6ff,#fff)}.lesson-card.completed:hover{border-color:#2563eb;box-shadow:0 10px 25px -3px #3b82f633}.lesson-card.locked{border-color:#d1d5db;background:#f9fafb;cursor:not-allowed;opacity:.6}.lesson-card.locked:hover{transform:none;box-shadow:0 4px 6px -1px #0000001a}.lesson-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.lesson-number{font-size:1.5rem;font-weight:800;color:#374151;background:#f3f4f6;padding:.5rem 1rem;border-radius:8px}.lesson-status{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;border-radius:20px;font-size:.875rem;font-weight:600}.lesson-status.available{background:#dcfce7;color:#166534}.lesson-status.completed{background:#dbeafe;color:#1e40af}.lesson-status.locked{background:#f3f4f6;color:#6b7280}.lesson-card-content{margin-bottom:1.5rem}.lesson-title{font-size:1.25rem;font-weight:700;color:#1f2937;margin-bottom:.5rem}.lesson-description{color:#6b7280;line-height:1.5;margin-bottom:1rem}.lesson-keys{margin-bottom:1rem}.new-keys,.review-keys{margin-bottom:.5rem}.new-keys strong,.review-keys strong{color:#374151;font-size:.875rem}.keys-list{font-family:Courier New,monospace;font-size:1.125rem;color:#059669;font-weight:600;margin-left:.5rem}.lesson-requirements{display:flex;gap:1rem;margin-top:1rem}.requirement{font-size:.875rem;color:#6b7280;background:#f3f4f6;padding:.25rem .75rem;border-radius:12px}.lesson-card-footer{border-top:1px solid #e5e7eb;padding-top:1rem}.lesson-progress{margin-top:1rem}.lesson-progress .progress-bar{width:100%;height:6px;background-color:#e5e7eb;border-radius:3px;overflow:hidden;margin-bottom:.5rem}.lesson-progress .progress-fill{height:100%;background:linear-gradient(90deg,#10b981,#059669);transition:width .3s ease}.progress-stats{display:flex;justify-content:space-between;font-size:.75rem;color:#6b7280}.lesson-interface{max-width:1000px;margin:0 auto;padding:2rem}.lesson-interface .lesson-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:2rem;padding:1.5rem;background:#fff;border-radius:12px;box-shadow:0 2px 4px #0000001a}.back-button{background:#6b7280;color:#fff;border:none;padding:.75rem 1.5rem;border-radius:8px;font-weight:600;cursor:pointer;transition:background-color .2s}.back-button:hover{background:#4b5563}.lesson-info h2{font-size:1.125rem;font-weight:600;color:#1f2937;margin-bottom:.25rem}.lesson-info p{color:#6b7280;margin:0;font-size:.875rem}.lesson-progress{text-align:right}.lesson-progress span{font-size:.875rem;color:#6b7280;margin-bottom:.5rem;display:block}.drill-container{background:#fff;border-radius:12px;padding:2rem;box-shadow:0 2px 4px #0000001a;margin-bottom:2rem}.drill-header{text-align:center;margin-bottom:1rem}.drill-header h3{font-size:1.125rem;font-weight:600;color:#1f2937;margin-bottom:.25rem}.drill-header p{color:#6b7280;font-size:.875rem}.drill-body{margin-bottom:2rem}.find-key-drill,.shift-toggle-drill,.sequences-drill,.words-drill,.speed-test-drill,.sentences-drill,.dictation-drill,.dialogue-drill,.paragraph-drill,.mastery-drill,.default-drill{text-align:center}.target-keys{font-size:2rem;font-weight:700;color:#059669;font-family:Courier New,monospace;padding:2rem;background:#f0fdf4;border-radius:12px;border:2px solid #dcfce7}.text-display{font-size:36px!important;line-height:1.6!important;color:#fff!important;font-family:Vazirmatn,Noto Sans Arabic,Arial Unicode MS,sans-serif!important;font-weight:500!important;padding:1rem;background:linear-gradient(135deg,#064e3b,#065f46);border-radius:16px;border:2px solid #10b981;text-align:right;direction:rtl;margin:0!important;unicode-bidi:bidi-override;height:180px;overflow-y:auto;overflow-x:hidden;scroll-behavior:smooth;word-spacing:normal!important;letter-spacing:.02em!important;box-shadow:0 4px 6px -1px #0000001a;min-height:80px;display:flex;align-items:center;justify-content:center}.text-display::-webkit-scrollbar{display:none!important}.text-display{scrollbar-width:none!important}.text-display span{font-family:Vazirmatn,Noto Sans Arabic,Arial Unicode MS,sans-serif!important;font-weight:500!important;color:#fff!important}.text-display .char-current{background-color:#3b82f64d!important;color:#fff!important;border-radius:4px;padding:2px 4px}.text-display .char-completed{color:#10b981!important;background-color:#10b9811a!important}.text-display .char-pending{color:#fff!important;opacity:.8}.text-display .char-correct{color:#10b981!important;background-color:#10b9811a!important}.text-display .char-incorrect{color:#ef4444!important;background-color:#ef44441a!important}.instruction{color:#6b7280;font-size:1rem;line-height:1.5}.timer-display{text-align:center;margin-bottom:2rem}.timer{font-size:3rem;font-weight:800;color:#dc2626;font-family:Courier New,monospace}.timer-label{font-size:1rem;color:#6b7280;margin-top:.5rem}.audio-controls{display:flex;justify-content:center;gap:1rem;margin-bottom:2rem}.drill-stats{display:flex;justify-content:center;gap:2rem;margin-top:2rem;padding:1.5rem;background:#f9fafb;border-radius:12px;border:1px solid #e5e7eb}.stat{text-align:center}.stat-label{display:block;font-size:.875rem;color:#6b7280;margin-bottom:.25rem}.stat-value{display:block;font-size:1.5rem;font-weight:700;color:#1f2937}.stat-value.success{color:#059669}.stat-value.warning{color:#d97706}.drill-completion{margin-top:2rem;padding:2rem;background:#f0fdf4;border-radius:12px;border:2px solid #dcfce7;text-align:center}.completion-message h3{font-size:1.5rem;font-weight:700;color:#059669;margin-bottom:1rem}.completion-stats{display:flex;justify-content:center;gap:2rem;margin-bottom:1rem}.completion-message-text{color:#374151;font-size:1rem;margin:0}.lesson-controls{display:flex;justify-content:space-between;align-items:center;padding:.75rem;background:#fff;border-radius:8px;box-shadow:0 2px 4px #0000001a}.btn{padding:.375rem .75rem;border-radius:4px;font-weight:500;cursor:pointer;transition:all .2s;border:none;font-size:.75rem}.btn:disabled{opacity:.5;cursor:not-allowed}#typing-tutor-wrapper .btn-primary{background:#3b82f6;color:#fff}#typing-tutor-wrapper .btn-primary:hover:not(:disabled){background:#2563eb}#typing-tutor-wrapper .btn-secondary{background:#6b7280;color:#fff}#typing-tutor-wrapper .btn-secondary:hover:not(:disabled){background:#4b5563}.lesson-completion{text-align:center;padding:3rem;background:#fff;border-radius:16px;box-shadow:0 4px 6px -1px #0000001a}.completion-header h2{font-size:2rem;font-weight:800;color:#059669;margin-bottom:1rem}.completion-header p{font-size:1.125rem;color:#6b7280;margin-bottom:2rem}.completion-stats{display:flex;justify-content:center;gap:2rem;margin-bottom:2rem}.stat-card{background:#f9fafb;padding:1.5rem;border-radius:12px;border:1px solid #e5e7eb;min-width:120px}.stat-card .stat-value{font-size:2rem;font-weight:800;color:#1f2937;margin-bottom:.5rem}.stat-card .stat-label{font-size:.875rem;color:#6b7280}.achievements{margin-bottom:2rem;padding:2rem;background:#fef3c7;border-radius:12px;border:2px solid #fbbf24}.achievements h3{font-size:1.5rem;font-weight:700;color:#92400e;margin-bottom:1rem}.achievement{background:#fff;padding:1rem;border-radius:8px;margin-bottom:1rem;border:1px solid #fbbf24}.achievement:last-child{margin-bottom:0}.achievement-title{font-weight:700;color:#92400e;margin-bottom:.5rem}.achievement-description{color:#6b7280;font-size:.875rem}.next-lesson{margin-bottom:2rem;padding:2rem;background:#eff6ff;border-radius:12px;border:2px solid #93c5fd}.next-lesson h3{font-size:1.5rem;font-weight:700;color:#1e40af;margin-bottom:.5rem}.next-lesson p{color:#374151;margin-bottom:1rem}.curriculum-complete{margin-bottom:2rem;padding:2rem;background:#f0fdf4;border-radius:12px;border:2px solid #86efac}.curriculum-complete h3{font-size:1.5rem;font-weight:700;color:#166534;margin-bottom:.5rem}.curriculum-complete p{color:#374151}.completion-actions{display:flex;justify-content:center;gap:1rem}.char-current{background-color:#3b82f6!important;color:#fff!important;padding:2px 4px!important;border-radius:4px!important;font-weight:700!important;box-shadow:0 0 0 2px #3b82f64d!important;animation:pulse 1s infinite!important}.char-completed{color:#059669!important;font-weight:600!important;text-decoration:line-through!important;opacity:.7!important}.char-pending{color:#6b7280!important;opacity:.6!important}.char-error{background-color:#dc2626!important;color:#fff!important;padding:2px 4px!important;border-radius:4px!important;font-weight:700!important;animation:shake .5s ease-in-out!important}@keyframes pulse{0%,to{box-shadow:0 0 0 2px #3b82f64d}50%{box-shadow:0 0 0 4px #3b82f680}}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-2px)}75%{transform:translate(2px)}}@media (max-width: 768px){.lesson-selector-container{padding:1rem}.lessons-grid{grid-template-columns:1fr;gap:1rem}.lesson-interface{padding:1rem}.lesson-interface .lesson-header{flex-direction:column;gap:1rem;text-align:center}.drill-stats,.completion-stats,.lesson-controls{flex-direction:column;gap:1rem}.completion-actions{flex-direction:column}.lesson-info-bar{flex-direction:column;gap:1rem;text-align:center}.lesson-actions{flex-wrap:wrap;justify-content:center}.btn{flex:1;min-width:120px}}@media (prefers-color-scheme: dark){.lesson-card{background:#1f2937;border-color:#374151;color:#f9fafb}.lesson-card.available{background:linear-gradient(135deg,#064e3b,#1f2937);border-color:#10b981}.lesson-card.completed{background:linear-gradient(135deg,#1e3a8a,#1f2937);border-color:#3b82f6}.lesson-card.locked{background:#111827;border-color:#374151}.lesson-title{color:#f9fafb}.lesson-description{color:#d1d5db}.text-display{background:linear-gradient(135deg,#064e3b,#065f46);border-color:#10b981;color:#fff!important;box-shadow:0 4px 6px -1px #0000004d;margin:0!important;height:80px;padding:1rem}.drill-container{background:#1f2937}.drill-header h3{color:#f9fafb}.drill-header p{color:#d1d5db}.lesson-controls-overlay{background:#1f2937f2;border-color:#ffffff1a}.lesson-info h3{color:#f9fafb}.lesson-info p{color:#d1d5db}.btn-outline{color:#d1d5db;border-color:#4b5563}.btn-outline:hover:not(:disabled){background:#374151;border-color:#6b7280}}.lesson-hint{margin-top:12px;padding-top:12px;border-top:1px solid rgba(0,0,0,.1)}.dark .lesson-hint{border-top-color:#ffffff1a}