:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400}body{margin:0;min-height:100vh;background:linear-gradient(135deg,#667eea,#764ba2)}*{margin:0;padding:0;box-sizing:border-box}:root{--primary-color: #4a90d9;--primary-dark: #357abd;--secondary-color: #6c757d;--success-color: #28a745;--danger-color: #dc3545;--warning-color: #ffc107;--background: #f0f4f8;--card-background: #ffffff;--text-primary: #333333;--text-secondary: #666666;--border-color: #e0e0e0;--shadow: 0 4px 6px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 25px rgba(0, 0, 0, .15);--radius: 12px;--radius-sm: 8px}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif;background:var(--background);color:var(--text-primary);min-height:100vh}.app-container{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px}.admin-link{position:fixed;bottom:20px;right:20px;background:var(--secondary-color);color:#fff;border:none;padding:10px 20px;border-radius:var(--radius-sm);cursor:pointer;font-size:14px;transition:background .3s;z-index:100}.admin-link:hover{background:#5a636b}.logo{font-size:80px;margin-bottom:20px}h1{font-size:32px;color:var(--primary-color);margin-bottom:10px;text-align:center}h2{font-size:24px;color:var(--text-secondary);margin-bottom:20px;text-align:center}.description{color:var(--text-secondary);text-align:center;max-width:500px;margin-bottom:30px;line-height:1.6}.info-cards{display:flex;justify-content:center;gap:20px;margin-bottom:30px}.info-card{background:var(--card-background);padding:20px 30px;border-radius:var(--radius);box-shadow:var(--shadow);text-align:center;min-width:120px}.info-number{display:block;font-size:36px;font-weight:700;color:var(--primary-color)}.info-label{display:block;font-size:14px;color:var(--text-secondary);margin-top:5px}.start-button{background:var(--primary-color);color:#fff;border:none;padding:16px 48px;font-size:18px;border-radius:var(--radius);cursor:pointer;transition:all .3s;box-shadow:var(--shadow)}.start-button:hover{background:var(--primary-dark);transform:translateY(-2px);box-shadow:var(--shadow-lg)}.start-button:disabled{opacity:.6;cursor:not-allowed;transform:none}.login-form{background:var(--card-background);padding:30px;border-radius:var(--radius);box-shadow:var(--shadow);width:100%;max-width:450px;margin-bottom:20px}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:8px;font-weight:500;color:var(--text-primary)}.form-group input{width:100%;padding:12px 16px;border:2px solid var(--border-color);border-radius:var(--radius-sm);font-size:16px;transition:border-color .3s}.form-group input:focus{outline:none;border-color:var(--primary-color)}.form-group input.error{border-color:var(--danger-color)}.form-group input:disabled{background:#f5f5f5;cursor:not-allowed}.error-message{color:var(--danger-color);font-size:14px;margin-top:5px;text-align:center}.login-screen{text-align:center;justify-items:center}.admin-login-screen{text-align:center}.admin-login-form{margin:0 auto}.admin-hint{background:var(--card-background);padding:15px 25px;border-radius:var(--radius-sm);box-shadow:var(--shadow);margin-top:20px;font-size:14px;color:var(--text-secondary)}.admin-hint p{margin:5px 0}.back-button{background:transparent;color:var(--primary-color);border:none;padding:10px 20px;font-size:14px;cursor:pointer;transition:color .3s}.back-button:hover{color:var(--primary-dark)}.user-info-display{background:var(--card-background);padding:15px 25px;border-radius:var(--radius-sm);box-shadow:var(--shadow);margin-bottom:20px;text-align:left;max-width:400px;margin-left:auto;margin-right:auto}.user-info-display p{margin:5px 0;color:var(--text-secondary)}.change-user-btn{background:transparent;color:var(--primary-color);border:none;padding:10px 20px;font-size:14px;cursor:pointer;margin-top:15px;transition:color .3s}.change-user-btn:hover{color:var(--primary-dark)}.quiz-screen{width:100%;max-width:800px}.quiz-header{margin-bottom:20px}.progress-info{display:flex;justify-content:space-between;margin-bottom:10px;color:var(--text-secondary);font-size:14px}.progress-bar{height:8px;background:var(--border-color);border-radius:4px;overflow:hidden}.progress-fill{height:100%;background:var(--primary-color);transition:width .3s ease;border-radius:4px}.question-card{background:var(--card-background);padding:30px;border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:25px}.question-number{color:var(--primary-color);font-size:14px;font-weight:600;margin-bottom:10px}.question-text{font-size:20px;line-height:1.5;color:var(--text-primary)}.question-image-container{margin-top:20px;display:flex;justify-content:center}.question-image{max-width:100%;max-height:300px;border-radius:var(--radius-sm);object-fit:contain}.options-container{display:flex;flex-direction:column;gap:12px;margin-bottom:20px}.option-button{display:flex;align-items:center;padding:16px 20px;background:var(--card-background);border:2px solid var(--border-color);border-radius:var(--radius-sm);cursor:pointer;transition:all .3s;font-size:16px;text-align:left}.option-button:hover:not(.disabled){border-color:var(--primary-color);background:#f0f7ff}.option-button.selected{border-color:var(--primary-color);background:#e8f4fd}.option-button.correct{border-color:var(--success-color);background:#d4edda}.option-button.wrong{border-color:var(--danger-color);background:#f8d7da}.option-button.disabled{opacity:.6;cursor:not-allowed}.option-letter{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;background:var(--primary-color);color:#fff;border-radius:50%;margin-right:15px;font-weight:700;flex-shrink:0}.option-button.correct .option-letter{background:var(--success-color)}.option-button.wrong .option-letter{background:var(--danger-color)}.option-text{flex:1}.check-icon{color:var(--success-color);font-size:20px;margin-left:10px}.cross-icon{color:var(--danger-color);font-size:20px;margin-left:10px}.feedback{background:var(--card-background);padding:20px;border-radius:var(--radius-sm);box-shadow:var(--shadow);display:flex;justify-content:space-between;align-items:center}.feedback-text{font-size:16px;font-weight:500}.feedback-text.correct{color:var(--success-color)}.feedback-text.wrong{color:var(--danger-color)}.next-button{background:var(--primary-color);color:#fff;border:none;padding:12px 30px;font-size:16px;border-radius:var(--radius-sm);cursor:pointer;transition:background .3s}.next-button:hover{background:var(--primary-dark)}.result-screen{text-align:center;max-width:700px;width:100%}.result-icon{font-size:80px;margin-bottom:20px}.score-display{display:flex;justify-content:center;align-items:center;gap:30px;margin:30px 0}.score-circle{width:120px;height:120px;border-radius:50%;background:var(--primary-color);display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff}.score-number{font-size:36px;font-weight:700}.score-total{font-size:14px;opacity:.9}.score-percentage{font-size:48px;font-weight:700;color:var(--primary-color)}.results-summary{display:flex;justify-content:center;gap:30px;margin-bottom:30px}.summary-item{background:var(--card-background);padding:15px 25px;border-radius:var(--radius-sm);box-shadow:var(--shadow);text-align:center}.summary-label{display:block;font-size:14px;color:var(--text-secondary);margin-bottom:5px}.summary-value{font-size:24px;font-weight:700}.summary-item.correct .summary-value{color:var(--success-color)}.summary-item.wrong .summary-value{color:var(--danger-color)}.results-table-container{background:var(--card-background);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;margin-bottom:30px}.results-table-container h3{padding:15px 20px;background:var(--background);margin:0;font-size:16px;color:var(--text-primary)}.results-table{width:100%;border-collapse:collapse;background-color:var(--background)}.results-table th,.results-table td{padding:12px 15px;text-align:left;border-bottom:1px solid var(--border-color)}.results-table th{background:var(--background);font-weight:600;color:var(--text-secondary);font-size:14px}.results-table .correct-row{background:#d4edda}.results-table .wrong-row{background:#f8d7da}.saving-status{display:flex;align-items:center;justify-content:center;gap:10px;margin:15px 0;color:var(--text-secondary)}.success-message{color:var(--success-color);margin:15px 0;font-weight:500}.save-success{font-size:16px}.save-error{background:#f8d7da;padding:10px 15px;border-radius:var(--radius-sm)}.spinner{width:24px;height:24px;border:3px solid var(--border-color);border-top-color:var(--primary-color);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.admin-dashboard{width:100%;max-width:1200px;min-height:100vh}.admin-header{display:flex;justify-content:space-between;align-items:center;background:var(--card-background);padding:20px 25px;border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:25px}.admin-header-left{display:flex;align-items:center;gap:20px}.admin-header-left h1{margin:0;font-size:24px;text-align:left}.admin-username{color:var(--text-secondary);font-size:14px}.admin-header-right{display:flex;gap:10px}.password-btn,.export-btn,.logout-btn{padding:10px 20px;border:none;border-radius:var(--radius-sm);cursor:pointer;font-size:14px;transition:all .3s}.password-btn{background:var(--secondary-color);color:#fff}.password-btn:hover{background:#5a636b}.export-btn{background:var(--success-color);color:#fff}.export-btn:hover{background:#218838}.logout-btn{background:var(--danger-color);color:#fff}.logout-btn:hover{background:#c82333}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:15px;margin-bottom:25px}.stat-card{background:var(--card-background);padding:20px;border-radius:var(--radius);box-shadow:var(--shadow);text-align:center}.stat-value{display:block;font-size:28px;font-weight:700;color:var(--primary-color);margin-bottom:5px}.stat-label{display:block;font-size:13px;color:var(--text-secondary)}.stat-card.passed .stat-value{color:var(--success-color)}.stat-card.failed .stat-value{color:var(--danger-color)}.results-section{background:var(--card-background);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}.results-header{display:flex;justify-content:space-between;align-items:center;padding:20px 25px;border-bottom:1px solid var(--border-color);flex-wrap:wrap;gap:15px}.results-header h2{margin:0;font-size:18px;text-align:left}.search-form{display:flex;gap:10px}.search-input{padding:10px 15px;border:2px solid var(--border-color);border-radius:var(--radius-sm);font-size:14px;width:250px;transition:border-color .3s}.search-input:focus{outline:none;border-color:var(--primary-color)}.search-btn{padding:10px 20px;background:var(--primary-color);color:#fff;border:none;border-radius:var(--radius-sm);cursor:pointer;font-size:14px;transition:background .3s}.search-btn:hover{background:var(--primary-dark)}.clear-btn{padding:10px 15px;background:var(--secondary-color);color:#fff;border:none;border-radius:var(--radius-sm);cursor:pointer;font-size:14px}.clear-btn:hover{background:#5a636b}.results-table-wrapper{overflow-x:auto}.admin-table{width:100%;border-collapse:collapse}.admin-table th,.admin-table td{padding:12px 15px;text-align:left;border-bottom:1px solid var(--border-color);white-space:nowrap}.admin-table th{background:var(--background);font-weight:600;color:var(--text-secondary);font-size:13px;text-transform:uppercase}.admin-table th.sortable{cursor:pointer;-webkit-user-select:none;user-select:none;transition:background .3s}.admin-table th.sortable:hover{background:#e0e0e0}.admin-table .passed-row{background:#d4edda}.admin-table .failed-row{background:#f8d7da}.admin-table .no-results{text-align:center;color:var(--text-secondary);padding:30px}.status-badge{display:inline-block;padding:4px 12px;border-radius:20px;font-size:12px;font-weight:600}.status-badge.passed{background:var(--success-color);color:#fff}.status-badge.failed{background:var(--danger-color);color:#fff}.details-btn{padding:6px 14px;background:var(--primary-color);color:#fff;border:none;border-radius:var(--radius-sm);cursor:pointer;font-size:12px;transition:background .3s}.details-btn:hover{background:var(--primary-dark)}.pagination{display:flex;justify-content:center;align-items:center;gap:15px;padding:20px;border-top:1px solid var(--border-color)}.page-btn{padding:8px 16px;background:var(--primary-color);color:#fff;border:none;border-radius:var(--radius-sm);cursor:pointer;font-size:14px;transition:background .3s}.page-btn:hover:not(:disabled){background:var(--primary-dark)}.page-btn:disabled{opacity:.5;cursor:not-allowed}.page-info{color:var(--text-secondary);font-size:14px}.loading-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px;color:var(--text-secondary)}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.modal-content{background:var(--card-background);border-radius:var(--radius);box-shadow:var(--shadow-lg);width:100%;max-width:600px;max-height:80vh;overflow-y:auto;padding:20px}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:20px 25px;border-bottom:1px solid var(--border-color)}.modal-header h3{margin:0;font-size:18px}.modal-close{background:none;border:none;font-size:24px;cursor:pointer;color:var(--text-secondary);padding:0;line-height:1}.modal-close:hover{color:var(--text-primary)}.modal-body{padding:25px}.modal-body .form-group{margin-bottom:15px}.result-info{margin-bottom:20px}.result-info p{margin:8px 0;color:var(--text-secondary)}.answers-detail h4{margin-bottom:15px;color:var(--text-primary)}.details-table{width:100%;border-collapse:collapse;font-size:14px}.details-table th,.details-table td{padding:8px 12px;text-align:left;border:1px solid var(--border-color)}.details-table th{background:var(--background);font-weight:600}.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}.cancel-btn{padding:10px 20px;background:var(--secondary-color);color:#fff;border:none;border-radius:var(--radius-sm);cursor:pointer;font-size:14px}.cancel-btn:hover{background:#5a636b}.submit-btn{padding:10px 20px;background:var(--primary-color);color:#fff;border:none;border-radius:var(--radius-sm);cursor:pointer;font-size:14px}.submit-btn:hover{background:var(--primary-dark)}.filters-row{display:flex;gap:15px;align-items:center;flex-wrap:wrap}.quiz-type-filter{padding:8px 12px;border:2px solid var(--border-color);border-radius:var(--radius-sm);font-size:14px;background:var(--card-background);cursor:pointer;transition:border-color .3s;min-width:200px}.quiz-type-filter:focus{outline:none;border-color:var(--primary-color)}.quiz-type-badge{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:20px;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.quiz-type-badge.sim{background:#e3f2fd;color:#1976d2;border:1px solid #bbdefb}.quiz-type-badge.pdd{background:#fff3e0;color:#f57c00;border:1px solid #ffcc02}.quiz-type-badge.med{background:#ffebee;color:#d32f2f;border:1px solid #ffcdd2}.quiz-nav{display:flex;gap:10px;justify-content:center;margin-top:20px;flex-wrap:wrap}.quiz-nav-btn{display:flex;align-items:center;gap:8px;padding:10px 20px;background:var(--card-background);border:2px solid var(--border-color);border-radius:var(--radius-sm);cursor:pointer;font-size:14px;transition:all .3s}.quiz-nav-btn:hover{border-color:var(--primary-color);background:#f0f7ff}.quiz-nav-btn.active{background:var(--primary-color);color:#fff;border-color:var(--primary-color)}.quiz-nav-btn.active:hover{background:var(--primary-dark)}@media (max-width: 768px){.admin-header{flex-direction:column;gap:15px;text-align:center}.admin-header-left{flex-direction:column;gap:10px}.admin-header-left h1{font-size:20px}.admin-header-right{flex-wrap:wrap;justify-content:center}.stats-grid{grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}.results-header,.filters-row{flex-direction:column;align-items:stretch}.quiz-type-filter{width:100%}.search-form{flex-wrap:wrap}.search-input{width:100%}.info-cards{flex-direction:column;align-items:center}.score-display{flex-direction:column;gap:15px}.results-summary{flex-direction:column;align-items:center}.feedback{flex-direction:column;gap:15px;text-align:center}.admin-link{bottom:10px;right:10px;padding:8px 14px;font-size:12px}}