:root{--primary-color: #6366f1;--primary-dark: #4f46e5;--success-color: #10b981;--error-color: #ef4444;--text-primary: #1f2937;--text-secondary: #6b7280;--bg-main: #f9fafb;--bg-card: #ffffff;--border-color: #e5e7eb;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1);--border-radius-sm: 8px;--border-radius: 12px;--border-radius-lg: 20px;--transition-base: all .2s ease}@media(prefers-color-scheme:dark){:root{--text-primary: #f9fafb;--text-secondary: #d1d5db;--bg-main: #111827;--bg-card: #1f2937;--border-color: #374151}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;line-height:1.6;font-weight:400;color:var(--text-primary);background-color:var(--bg-main);margin:0;display:flex;justify-content:center;align-items:center;min-height:100vh;padding:1rem;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#app{width:100%;max-width:700px;margin:0 auto}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.fade-in{animation:fadeIn .4s ease-out}.quiz-container{background:var(--bg-card);border-radius:20px;padding:2.5rem;box-shadow:var(--shadow-lg);min-height:400px}.progress-bar{width:100%;height:8px;background:var(--border-color);border-radius:10px;overflow:hidden;margin-bottom:2rem}.progress-fill{height:100%;background:linear-gradient(90deg,var(--primary-color),var(--primary-dark));border-radius:10px;transition:width .5s ease}.question-header{margin-bottom:1rem}.question-number{display:inline-block;padding:.5rem 1rem;background:#ede9fe;color:var(--primary-dark);border-radius:20px;font-size:.875rem;font-weight:600}.question-text{text-align:center;font-size:1.75rem;font-weight:700;color:var(--text-primary);margin-bottom:2rem;line-height:1.3}.options-container{display:flex;flex-direction:column;gap:1rem;margin-bottom:2rem}.option-button{display:flex;align-items:center;gap:1rem;width:100%;padding:1.25rem;background:var(--bg-card);border:2px solid var(--border-color);border-radius:12px;cursor:pointer;font-size:1rem;transition:all .2s ease;text-align:left;position:relative}.option-button:hover:not(.disabled){border-color:var(--primary-color);background:#f5f3ff;transform:translateY(-2px);box-shadow:var(--shadow-md)}.option-button:active:not(.disabled){transform:translateY(0)}.option-letter{display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:var(--border-color);color:var(--text-secondary);border-radius:10px;font-weight:700;flex-shrink:0;transition:all .2s ease}.option-button:hover:not(.disabled) .option-letter{background:var(--primary-color);color:#fff}.option-text{flex:1;color:var(--text-primary);font-weight:500}.option-button.correct{border-color:var(--success-color);background:#f0fdf4}.option-button.correct .option-letter{background:var(--success-color);color:#fff}.option-button.incorrect{border-color:var(--error-color);background:#fef2f2}.option-button.incorrect .option-letter{background:var(--error-color);color:#fff}.option-button.disabled{cursor:not-allowed;opacity:.6}.checkmark,.crossmark{position:absolute;right:1.25rem;font-size:1.5rem;font-weight:700}.checkmark{color:var(--success-color)}.crossmark{color:var(--error-color)}.next-button{display:flex;align-items:center;justify-content:center;gap:.5rem;width:100%;padding:1rem 2rem;background:var(--primary-color);color:#fff;border:none;border-radius:12px;font-size:1.125rem;font-weight:600;cursor:pointer;transition:all .2s ease}.next-button:hover{background:var(--primary-dark);transform:translateY(-2px);box-shadow:var(--shadow-md)}.next-button:active{transform:translateY(0)}.arrow{font-size:1.25rem;transition:transform .2s ease}.next-button:hover .arrow{transform:translate(4px)}.email-description{text-align:center;color:var(--text-secondary);margin-bottom:2rem;font-size:1.125rem}.email-form{display:flex;flex-direction:column;gap:1.5rem}.input-group{position:relative}.email-input{width:100%;padding:1rem 1rem 1rem 3rem;font-size:1rem;border:2px solid var(--border-color);border-radius:12px;transition:all .2s ease;font-family:inherit}.email-input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #6366f11a}.email-input.invalid{border-color:var(--error-color)}.email-input.invalid:focus{box-shadow:0 0 0 3px #ef44441a}.input-icon{position:absolute;left:1rem;top:50%;transform:translateY(-50%);font-size:1.25rem}.error-message{color:var(--error-color);font-size:.875rem;min-height:1.25rem;margin-top:-.5rem}.results-container{padding:3rem 2.5rem}.results-header{text-align:center;margin-bottom:2rem}.score-circle{width:150px;height:150px;margin:0 auto 1.5rem;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;border:8px solid;position:relative}.score-circle.pass{border-color:var(--success-color);background:#f0fdf4}.score-circle.fail{border-color:var(--error-color);background:#fef2f2}.score-number{font-size:2rem;font-weight:800;line-height:1}.score-circle.pass .score-number{color:var(--success-color)}.score-circle.fail .score-number{color:var(--error-color)}.score-label{font-size:.875rem;color:var(--text-secondary);margin-top:.25rem}.results-title{font-size:2rem;margin-bottom:.5rem;color:var(--text-primary)}.results-subtitle{font-size:1.125rem;color:var(--text-secondary)}.user-info{display:flex;align-items:center;justify-content:center;gap:.75rem;padding:1rem;background:#f5f3ff;border-radius:12px;margin-bottom:2rem}.email-label{font-weight:600;color:var(--text-secondary)}.email-value{font-weight:700;color:var(--primary-dark)}.review-title{font-size:1.25rem;font-weight:700;margin-bottom:1rem;color:var(--text-primary)}.answers-review{margin-bottom:2rem}.answer-item{padding:1.25rem;border-radius:12px;margin-bottom:1rem;border:2px solid}.answer-item.correct-answer{background:#f0fdf4;border-color:var(--success-color)}.answer-item.wrong-answer{background:#fef2f2;border-color:var(--error-color)}.answer-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem}.answer-number{font-weight:600;color:var(--text-secondary);font-size:.875rem}.answer-status{font-weight:700;font-size:.875rem}.correct-answer .answer-status{color:var(--success-color)}.wrong-answer .answer-status{color:var(--error-color)}.answer-question{font-weight:600;color:var(--text-primary);margin-bottom:.75rem}.answer-details{display:flex;flex-direction:column;gap:.5rem}.your-answer,.correct-answer-text{font-size:.875rem}.correct-text{color:var(--success-color);font-weight:600}.incorrect-text{color:var(--error-color);font-weight:600}.restart-button{display:flex;align-items:center;justify-content:center;gap:.5rem;width:100%;padding:1rem 2rem;background:var(--text-primary);color:#fff;border:none;border-radius:12px;font-size:1.125rem;font-weight:600;cursor:pointer;transition:all .2s ease}.restart-button:hover{background:var(--text-secondary);transform:translateY(-2px);box-shadow:var(--shadow-md)}.restart-button:active{transform:translateY(0)}.error-container{min-height:500px;display:flex;align-items:center;justify-content:center}.error-content{text-align:center;max-width:500px;padding:2rem}.error-icon{font-size:5rem;margin-bottom:1.5rem;animation:bounce 2s infinite}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.error-title{font-size:1.75rem;font-weight:700;color:var(--error-color);margin-bottom:1rem}.error-description{font-size:1rem;color:var(--text-secondary);line-height:1.6;margin-bottom:2rem}.error-actions{margin-bottom:2rem}.error-actions .next-button{display:inline-flex;align-items:center;gap:.5rem}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.error-details{margin-top:2rem;padding:1rem;background:var(--color-background-secondary);border-radius:var(--border-radius);text-align:left}.error-details summary{cursor:pointer;font-weight:600;color:var(--text-primary);-webkit-user-select:none;user-select:none;padding:.5rem;border-radius:var(--border-radius-sm);transition:background-color var(--transition-base)}.error-details summary:hover{background-color:var(--border-color)}.error-hint{margin-top:1rem;font-size:.875rem;color:var(--text-secondary);font-weight:600}.error-reasons{margin:.5rem 0 0 1.5rem;padding:0;font-size:.875rem;color:var(--text-secondary);line-height:1.8}.error-reasons li{margin-bottom:.25rem}@media(max-width:640px){body{padding:.5rem}.quiz-container{padding:1.5rem;border-radius:16px}.results-container{padding:2rem 1.5rem}.question-text{font-size:1.375rem}.option-button{padding:1rem}.option-letter{width:36px;height:36px;font-size:.875rem}.option-text{font-size:.9375rem}.score-circle{width:120px;height:120px}.score-number{font-size:2.5rem}.results-title{font-size:1.5rem}.answer-item{padding:1rem}}@media(prefers-color-scheme:dark){body{background:linear-gradient(135deg,#1e293b,#312e81)}.question-number{background:#312e81;color:#c7d2fe}.option-button{background:var(--bg-card)}.option-button:hover:not(.disabled){background:#312e81}.option-button.correct{background:#064e3b}.option-button.incorrect{background:#7f1d1d}.user-info{background:#312e81}.email-value{color:#c7d2fe}.answer-item.correct-answer{background:#064e3b}.answer-item.wrong-answer{background:#7f1d1d}.score-circle.pass{background:#064e3b}.score-circle.fail{background:#7f1d1d}.error-details,.restart-button{background:#312e81}.restart-button:hover{background:#4f46e5}}