:root{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;line-height:1.6;font-weight:400;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--spacing-2xl: 3rem;--radius-sm: .375rem;--radius-md: .5rem;--radius-lg: .75rem;--radius-xl: 1rem;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.light-theme,:root{--primary-color: #6366f1;--primary-hover: #5855eb;--primary-light: #e0e7ff;--secondary-color: #10b981;--secondary-hover: #059669;--accent-color: #f59e0b;--danger-color: #ef4444;--danger-hover: #dc2626;--bg-primary: #ffffff;--bg-secondary: #f9fafb;--bg-tertiary: #f3f4f6;--bg-gradient: linear-gradient(135deg, #f9fafb 0%, #e0e7ff 100%);--text-primary: #111827;--text-secondary: #374151;--text-tertiary: #4b5563;--text-muted: #6b7280;--border-primary: #e5e7eb;--border-secondary: #d1d5db;--border-focus: #6366f1;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04);--white: #ffffff;--gray-50: #f9fafb;--gray-100: #f3f4f6;--gray-200: #e5e7eb;--gray-300: #d1d5db;--gray-600: #4b5563;--gray-700: #374151;--gray-800: #1f2937;--gray-900: #111827}.dark-theme{--primary-color: #818cf8;--primary-hover: #6366f1;--primary-light: #312e81;--secondary-color: #34d399;--secondary-hover: #10b981;--accent-color: #fbbf24;--danger-color: #f87171;--danger-hover: #ef4444;--bg-primary: #111827;--bg-secondary: #1f2937;--bg-tertiary: #374151;--bg-gradient: linear-gradient(135deg, #1f2937 0%, #312e81 100%);--text-primary: #f9fafb;--text-secondary: #e5e7eb;--text-tertiary: #d1d5db;--text-muted: #9ca3af;--border-primary: #374151;--border-secondary: #4b5563;--border-focus: #818cf8;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .3);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .3), 0 2px 4px -1px rgba(0, 0, 0, .2);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .3), 0 4px 6px -2px rgba(0, 0, 0, .2);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .4), 0 10px 10px -5px rgba(0, 0, 0, .3);--white: #1f2937;--gray-50: #374151;--gray-100: #4b5563;--gray-200: #6b7280;--gray-300: #9ca3af;--gray-600: #d1d5db;--gray-700: #e5e7eb;--gray-800: #f3f4f6;--gray-900: #f9fafb}*{box-sizing:border-box;margin:0;padding:0}body{margin:0;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background:var(--bg-gradient);color:var(--text-primary);min-height:100vh;transition:background .3s ease,color .3s ease;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent;touch-action:manipulation}#root{max-width:1200px;margin:0 auto;padding:var(--spacing-lg);min-height:100vh}h1{font-size:3rem;font-weight:700;color:var(--text-primary);margin-bottom:var(--spacing-lg);text-align:center;background:linear-gradient(135deg,var(--primary-color),var(--secondary-color));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}h2{font-size:2rem;font-weight:600;color:var(--text-primary);margin-bottom:var(--spacing-md)}h3{font-size:1.5rem;font-weight:500;color:var(--text-secondary);margin-bottom:var(--spacing-md)}.btn{display:inline-flex;align-items:center;justify-content:center;padding:var(--spacing-sm) var(--spacing-lg);border:none;border-radius:var(--radius-md);font-size:1rem;font-weight:500;font-family:inherit;cursor:pointer;transition:all .2s ease-in-out;text-decoration:none;min-height:44px}.btn-primary{background-color:var(--primary-color);color:var(--bg-primary);box-shadow:var(--shadow-md)}.btn-primary:hover{background-color:var(--primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-lg)}.btn-secondary{background-color:var(--secondary-color);color:var(--bg-primary);box-shadow:var(--shadow-md)}.btn-secondary:hover{background-color:var(--secondary-hover);transform:translateY(-1px);box-shadow:var(--shadow-lg)}.btn-outline{background-color:var(--bg-primary);color:var(--primary-color);border:2px solid var(--primary-color);box-shadow:var(--shadow-sm)}.btn-outline:hover{background-color:var(--primary-color);color:var(--bg-primary);transform:translateY(-1px);box-shadow:var(--shadow-md)}.btn-danger{background-color:var(--danger-color);color:var(--white);box-shadow:var(--shadow-md)}.btn-danger:hover{background-color:var(--danger-hover);transform:translateY(-1px);box-shadow:var(--shadow-lg)}.card{background-color:var(--bg-primary);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);padding:var(--spacing-xl);margin-bottom:var(--spacing-lg);transition:all .2s ease-in-out;border:1px solid var(--border-primary)}.card:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.container{max-width:800px;margin:0 auto;padding:var(--spacing-lg)}.text-center{text-align:center}.quiz-container{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-xl);min-height:80vh;justify-content:center}.question-card{background-color:var(--white);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);padding:var(--spacing-2xl);margin-bottom:var(--spacing-xl);max-width:700px;width:100%;transition:all .3s ease}.question-card:hover{box-shadow:var(--shadow-xl)}.question-card h3{font-size:1.25rem;color:var(--gray-800);margin-bottom:var(--spacing-lg);line-height:1.5}.options{display:grid;gap:var(--spacing-md);margin-top:var(--spacing-lg)}.option-btn{padding:var(--spacing-md) var(--spacing-lg);border:2px solid var(--gray-200);background-color:var(--white);color:var(--gray-700);border-radius:var(--radius-md);cursor:pointer;transition:all .2s ease;text-align:left;font-size:1rem;min-height:50px;display:flex;align-items:center}.option-btn:hover{border-color:var(--primary-color);background-color:var(--primary-light);transform:translate(4px)}.option-btn.selected{border-color:var(--primary-color);background-color:var(--primary-color);color:var(--white);box-shadow:var(--shadow-md)}.nav-buttons{display:flex;justify-content:space-between;gap:var(--spacing-md);margin-top:var(--spacing-xl);width:100%;max-width:700px}.progress-indicator{display:flex;align-items:center;gap:var(--spacing-md);margin-bottom:var(--spacing-xl);background-color:var(--white);padding:var(--spacing-md) var(--spacing-lg);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm)}.progress-bar{flex:1;height:8px;background-color:var(--gray-200);border-radius:var(--radius-sm);overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,var(--primary-color),var(--secondary-color));transition:width .3s ease}.dropdown-container{position:relative;margin-bottom:var(--spacing-xl)}.dropdown-select{width:100%;max-width:300px;padding:var(--spacing-md) var(--spacing-lg);border:2px solid var(--gray-200);border-radius:var(--radius-md);background-color:var(--white);color:var(--gray-700);font-size:1rem;cursor:pointer;transition:all .2s ease;appearance:none;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");background-position:right 12px center;background-repeat:no-repeat;background-size:16px;padding-right:40px}.dropdown-select:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px var(--primary-light)}.dropdown-select:hover{border-color:var(--primary-color)}.custom-topic-container{position:relative;margin-bottom:var(--spacing-xl)}.topic-textarea{width:100%;max-width:500px;padding:var(--spacing-md) var(--spacing-lg);border:2px solid var(--border-primary);border-radius:var(--radius-md);background-color:var(--bg-primary);color:var(--text-primary);font-size:1rem;font-family:inherit;resize:vertical;min-height:80px;transition:all .2s ease;margin-bottom:var(--spacing-md)}.topic-textarea:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px var(--primary-light)}.topic-textarea:hover{border-color:var(--border-focus)}.topic-textarea::placeholder{color:var(--text-muted);font-style:italic}.topic-buttons{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:var(--spacing-md);max-width:600px;margin:0 auto var(--spacing-xl)}.topic-btn{padding:var(--spacing-lg);border:2px solid var(--gray-200);background:linear-gradient(135deg,var(--white) 0%,var(--gray-50) 100%);color:var(--gray-700);border-radius:var(--radius-lg);cursor:pointer;transition:all .3s ease;font-weight:500;font-size:1rem;min-height:60px;display:flex;align-items:center;justify-content:center;text-align:center}.topic-btn:hover{border-color:var(--primary-color);background:linear-gradient(135deg,var(--primary-light) 0%,var(--white) 100%);transform:translateY(-2px);box-shadow:var(--shadow-md)}.loader-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:200px;gap:var(--spacing-md)}.loader{height:60px;aspect-ratio:2;border-bottom:3px solid #0000;background:linear-gradient(90deg,var(--primary-color) 50%,#0000 0) -25% 100%/50% 3px repeat-x border-box;position:relative;animation:l3-0 .75s linear infinite}.loader:before{content:"";position:absolute;inset:auto 42.5% 0;aspect-ratio:1;border-radius:50%;background:var(--secondary-color);animation:l3-1 .75s cubic-bezier(0,900,1,900) infinite}@keyframes l3-0{to{background-position:-125% 100%}}@keyframes l3-1{0%,2%{bottom:0%}98%,to{bottom:.1%}}@media (max-width: 1024px){.container{padding:var(--spacing-md)}.progress-indicator{flex-direction:column;gap:var(--spacing-sm);text-align:center}.progress-bar{width:100%;max-width:300px}}@media (max-width: 768px){#root{padding:var(--spacing-sm);min-height:100vh}.container{padding:var(--spacing-sm);max-width:100%}h1{font-size:2rem;margin-bottom:var(--spacing-md)}h2{font-size:1.5rem}h3{font-size:1.2rem}.card{padding:var(--spacing-lg);margin-bottom:var(--spacing-md);border-radius:var(--radius-md)}.quiz-container{gap:var(--spacing-lg);min-height:90vh;padding:var(--spacing-sm)}.question-card{padding:var(--spacing-lg);max-width:100%;margin-bottom:var(--spacing-lg)}.question-card h3{font-size:1.1rem;line-height:1.4;margin-bottom:var(--spacing-md)}.options{gap:var(--spacing-sm);margin-top:var(--spacing-md)}.option-btn{padding:var(--spacing-md);font-size:.95rem;min-height:44px;text-align:left;word-wrap:break-word;line-height:1.3}.option-label{margin-right:var(--spacing-sm);flex-shrink:0}.nav-buttons{flex-direction:column;gap:var(--spacing-sm);width:100%;max-width:100%}.nav-buttons .btn{width:100%;min-height:48px;font-size:1rem}.progress-indicator{flex-direction:column;gap:var(--spacing-sm);padding:var(--spacing-md);text-align:center}.progress-counter,.progress-percentage{font-size:.9rem}.progress-bar{width:100%;height:6px}.topic-buttons{grid-template-columns:1fr;gap:var(--spacing-sm);max-width:100%}.topic-btn{padding:var(--spacing-md);min-height:56px;font-size:.95rem}.topic-textarea{width:100%;max-width:100%;padding:var(--spacing-md);font-size:1rem;min-height:100px}.theme-toggle-container{top:calc(var(--spacing-2xl) + 1rem);right:var(--spacing-md)}.theme-toggle-btn{padding:var(--spacing-xs) var(--spacing-sm);font-size:.8rem}.theme-toggle-track{width:40px;height:20px}.theme-toggle-thumb{width:16px;height:16px}.dark-theme .theme-toggle-thumb{transform:translate(20px)}.theme-icon{font-size:.65rem}.feedback-emoji{font-size:3rem;margin-bottom:var(--spacing-sm)}.feedback-score-card{padding:var(--spacing-lg);margin-bottom:var(--spacing-lg)}.feedback-score-number{font-size:2.5rem}.feedback-score-percentage{font-size:1.2rem}.feedback-message-card{padding:var(--spacing-lg);margin-bottom:var(--spacing-lg)}.feedback-message-text{font-size:1rem;line-height:1.5}.feedback-actions{flex-direction:column;gap:var(--spacing-sm);width:100%}.feedback-actions .btn{width:100%;min-height:48px}.home-description{font-size:1.1rem;margin-bottom:var(--spacing-lg);line-height:1.5}.custom-topic-container{margin-bottom:var(--spacing-lg)}.start-button-enabled,.start-button-disabled{width:100%;min-height:48px;font-size:1rem}.divider{margin:var(--spacing-lg) 0;font-size:.9rem}}@media (max-width: 480px){#root,.container{padding:var(--spacing-xs)}.card{padding:var(--spacing-md);border-radius:var(--radius-sm)}.quiz-container{gap:var(--spacing-md)}h1{font-size:1.8rem}.question-card{padding:var(--spacing-md)}.question-card h3{font-size:1rem}.option-btn{padding:var(--spacing-sm) var(--spacing-md);font-size:.9rem;min-height:40px}.progress-indicator{padding:var(--spacing-sm)}.feedback-emoji{font-size:2.5rem}.feedback-score-number{font-size:2rem}.topic-btn{padding:var(--spacing-sm);min-height:48px;font-size:.9rem}.theme-toggle-container{top:var(--spacing-2xl);right:var(--spacing-sm)}}@media (max-width: 768px) and (orientation: landscape){.quiz-container{min-height:80vh}.question-card{margin-bottom:var(--spacing-md)}.feedback-emoji{font-size:2.5rem;margin-bottom:var(--spacing-xs)}.card{padding:var(--spacing-md)}}.theme-toggle-container{position:fixed;top:var(--spacing-lg);right:var(--spacing-lg);z-index:1000}.theme-toggle-btn{display:flex;align-items:center;gap:var(--spacing-sm);background-color:var(--bg-primary);border:2px solid var(--border-primary);border-radius:var(--radius-xl);padding:var(--spacing-sm) var(--spacing-md);cursor:pointer;transition:all .3s ease;box-shadow:var(--shadow-md);font-family:inherit;font-size:.9rem;font-weight:500;color:var(--text-secondary)}.theme-toggle-btn:hover{border-color:var(--primary-color);box-shadow:var(--shadow-lg);transform:translateY(-1px)}.theme-toggle-track{position:relative;width:48px;height:24px;background-color:var(--bg-tertiary);border-radius:12px;transition:all .3s ease;border:1px solid var(--border-secondary)}.dark-theme .theme-toggle-track{background-color:var(--primary-color)}.theme-toggle-thumb{position:absolute;top:2px;left:2px;width:20px;height:20px;background-color:var(--bg-primary);border-radius:50%;transition:all .3s ease;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-sm);border:1px solid var(--border-primary)}.dark-theme .theme-toggle-thumb{transform:translate(24px);background-color:var(--bg-secondary)}.theme-icon{font-size:.75rem;transition:all .3s ease}.theme-toggle-label{font-weight:500;color:var(--text-tertiary);min-width:35px;text-align:left}@keyframes toggleSlide{0%{transform:translate(0)}to{transform:translate(24px)}}.question-card{background-color:var(--bg-primary);border:1px solid var(--border-primary)}.option-btn{border:2px solid var(--border-primary);background-color:var(--bg-primary);color:var(--text-secondary)}.option-btn:hover{border-color:var(--primary-color);background-color:var(--primary-light)}.dropdown-select{border:2px solid var(--border-primary);background-color:var(--bg-primary);color:var(--text-secondary)}.dropdown-select:focus{border-color:var(--border-focus)}.topic-btn{border:2px solid var(--border-primary);background:var(--bg-primary);color:var(--text-secondary)}.topic-btn:hover{border-color:var(--primary-color);background:var(--primary-light)}.feedback-emoji{font-size:4rem;margin-bottom:var(--spacing-md)}.feedback-title{margin-bottom:var(--spacing-lg)}.feedback-topic{font-size:1.2rem;color:var(--text-secondary);margin-bottom:var(--spacing-lg);font-weight:500}.feedback-score-card{border-radius:var(--radius-xl);padding:var(--spacing-xl);margin-bottom:var(--spacing-xl)}.feedback-score-number{font-size:3rem;margin-bottom:var(--spacing-sm)}.feedback-score-percentage{font-size:1.5rem;color:var(--gray-600);font-weight:500}.feedback-message-card{background-color:var(--gray-50);border-radius:var(--radius-lg);padding:var(--spacing-xl);margin-bottom:var(--spacing-xl);border:1px solid var(--gray-200)}.feedback-message-title{color:var(--gray-800);margin-bottom:var(--spacing-md)}.feedback-message-text{font-size:1.1rem;line-height:1.6;color:var(--gray-700);font-style:italic}.feedback-actions{display:flex;gap:var(--spacing-md);justify-content:center;flex-wrap:wrap}.quiz-header{margin-bottom:var(--spacing-lg)}.progress-counter{font-weight:500;color:var(--gray-600);min-width:120px}.progress-percentage{font-weight:500;color:var(--primary-color)}.nav-button-disabled{opacity:.5;cursor:not-allowed}.nav-button-answer-disabled{opacity:.6;cursor:not-allowed}.quiz-back-home{margin-top:var(--spacing-xl)}.quiz-back-home-btn{font-size:.9rem}.home-description{font-size:1.2rem;color:var(--gray-600);margin-bottom:var(--spacing-xl)}.dropdown-margin{margin:0 auto var(--spacing-lg)}.start-button-enabled{min-width:180px;opacity:1;cursor:pointer}.start-button-disabled{min-width:180px;opacity:.6;cursor:not-allowed}.divider{margin:var(--spacing-xl) 0;color:var(--gray-400)}.question-label-container{margin-bottom:var(--spacing-lg)}.question-label{color:var(--primary-color);font-size:.9rem;font-weight:600;text-transform:uppercase;letter-spacing:1px}.option-label{font-weight:600;margin-right:var(--spacing-md)}.option-label-selected{color:var(--white)}.option-label-unselected{color:var(--primary-color)}.answer-confirmation{margin-top:var(--spacing-lg);padding:var(--spacing-md);background-color:var(--primary-light);border-radius:var(--radius-md);color:var(--primary-color);font-weight:500;text-align:center;font-size:.9rem}.question-review-container{width:100%}.review-title{color:var(--text-primary);font-size:1.5rem;font-weight:600;text-align:center;margin-bottom:var(--spacing-lg);display:flex;align-items:center;justify-content:center;gap:var(--spacing-sm)}.review-questions{display:flex;flex-direction:column;gap:var(--spacing-lg)}.review-question-card{border:2px solid var(--border-primary);border-radius:var(--radius-lg);padding:var(--spacing-lg);background-color:var(--bg-secondary);transition:all .3s ease}.review-question-card:hover{border-color:var(--primary-color);box-shadow:var(--shadow-md)}.review-question-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-md);padding-bottom:var(--spacing-sm);border-bottom:1px solid var(--border-primary)}.question-number{font-weight:600;color:var(--text-secondary);font-size:.9rem}.answer-status{font-size:1.2rem;padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-md);font-weight:600}.answer-status.correct{background-color:var(--secondary-color);color:#fff}.answer-status.incorrect{background-color:var(--danger-color);color:#fff}.review-question-text{font-size:1.1rem;font-weight:500;color:var(--text-primary);margin-bottom:var(--spacing-lg);line-height:1.6}.review-options{display:flex;flex-direction:column;gap:var(--spacing-sm)}.review-option{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-md);border-radius:var(--radius-md);border:2px solid var(--border-secondary);background-color:var(--bg-primary);transition:all .3s ease}.review-option.correct-answer{border-color:var(--secondary-color);background-color:#10b98110;color:var(--secondary-color)}.review-option.user-wrong-answer{border-color:var(--danger-color);background-color:#ef444410;color:var(--danger-color)}.option-label{background-color:var(--primary-color);color:#fff;width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:600;flex-shrink:0}.review-option.correct-answer .option-label{background-color:var(--secondary-color)}.review-option.user-wrong-answer .option-label{background-color:var(--danger-color)}.option-text{flex:1;font-size:1rem;line-height:1.4}.option-indicator{font-size:1.2rem;margin-left:auto}@media (max-width: 768px){.review-title{font-size:1.3rem}.review-question-card{padding:var(--spacing-md)}.review-question-text{font-size:1rem}.review-option{padding:var(--spacing-sm) var(--spacing-md)}.option-text{font-size:.9rem}}@media (max-width: 480px){.review-question-header{flex-direction:column;align-items:flex-start;gap:var(--spacing-xs)}.answer-status{align-self:flex-end;font-size:1rem}.review-question-card,.review-option{padding:var(--spacing-sm)}.option-label{width:20px;height:20px;font-size:.7rem}.option-text{font-size:.85rem}.option-indicator{font-size:1rem}}