@import"https://fonts.googleapis.com/css2?family=Montserrat:wght@600;700;800&family=Poppins:wght@400;500&family=Inter:wght@300;400;500;600;700&family=Outfit:wght@300;400;500;600;700;800&display=swap";:root{color-scheme:light}*{margin:0;padding:0;box-sizing:border-box}*,*:before,*:after{box-sizing:border-box}html,body{max-width:100%;overflow-x:hidden;background-color:#fff;color:#222}#root{min-height:100vh}.app-shell{width:100%}body{font-family:Inter,sans-serif;background-color:#fff;color:#222;line-height:1.5}a{text-decoration:none;color:inherit}button{cursor:pointer;border:none;outline:none}h1,h2,h3{font-family:Outfit,sans-serif;letter-spacing:.5px}label{font-family:Poppins,sans-serif}button{font-family:Montserrat,sans-serif;font-weight:600}input,select,textarea{background-color:#fff;color:#222}@media(max-width:650px){.form-grid{grid-template-columns:1fr!important}.form-grid .full-width{grid-column:span 1!important}}@media(prefers-color-scheme:dark){html,body{background-color:#fff!important;color:#222!important}}@supports (height: 100dvh){#root{height:100dvh}}.navbar{position:fixed;top:0;left:0;width:100%;height:auto;min-height:unset;background-color:#f8f9fa;display:flex;justify-content:space-between;align-items:center;margin:0 auto;padding:10px 24px;box-shadow:0 4px 12px #0000002e;z-index:1000}.navbar-left{display:flex;align-items:center;gap:clamp(.4rem,2vw,.6rem);margin-left:clamp(20px,6vw,150px)}.navbar-logo{height:clamp(50px,6vw,70px);width:auto;object-fit:contain}.navbar-title{font-size:clamp(.95rem,2.5vw,1.1rem);font-weight:600}.navbar-center{display:flex;gap:24px;align-items:center}.nav-link{text-decoration:none;font-weight:600;color:#555;padding-bottom:4px;border-bottom:2px solid transparent;font-size:clamp(.9rem,1.5vw,1rem)}.nav-link:hover{color:#007bff}.nav-link.active{color:#007bff;border-bottom-color:#007bff}.desktop-only{display:flex}.mobile-tabs{display:none}.navbar-right{margin-right:clamp(20px,6vw,150px);display:flex;align-items:center;gap:clamp(8px,2vw,12px)}.user-info{display:flex;align-items:center;gap:8px;color:#000;font-size:clamp(.85rem,2.5vw,1rem);font-weight:500;flex-wrap:wrap}.user-avatar{width:50px;height:50px;border-radius:50%;object-fit:cover;border:2px solid #007bff}.user-id{font-size:clamp(.7rem,2vw,.8rem);font-weight:500;color:#333;padding:.3rem .6rem;background:#e3f2fd;border-radius:6px;max-width:110px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.logout-btn,.admin-login-btn{padding:clamp(5px,1.5vw,8px) clamp(10px,2.5vw,14px);font-size:clamp(.8rem,2vw,.95rem);border-radius:6px}.admin-login-btn:hover{background-color:#1468c2;transform:translateY(-3px);box-shadow:0 6px 15px #0d47a14d}.logout-btn{background-color:#dc3545;color:#fff;font-weight:600;transition:background-color .3s,transform .2s ease}.logout-btn:hover{background-color:#b52d38;transform:translateY(-2px)}.admin-login-btn{background:#007bff;color:#fff;border-radius:6px;font-weight:600}.mobile-text{display:none}@media(min-width:900px){.navbar-center{gap:45px}.nav-link{font-size:1rem;letter-spacing:.2px}}@media(max-width:640px){.navbar{flex-direction:row;align-items:center;padding:8px}.navbar-left{margin-left:0}.navbar-right{margin-right:0;width:100%;display:flex;justify-content:flex-end}.navbar-title{font-size:.95rem}.desktop-text{display:none}.mobile-text{display:inline}.desktop-only{display:none}.mobile-tabs{display:flex;position:fixed;top:64px;left:0;width:100%;background-color:#fff;border-bottom:1px solid #ddd;box-shadow:0 3px 8px #00000026;z-index:999}.tab-link{flex:1;text-align:center;padding:10px 0;font-size:.85rem;font-weight:600;text-decoration:none;color:#555;border-bottom:3px solid transparent}.tab-link.active{color:#007bff;border-bottom-color:#007bff;background-color:#f8f9fa}}.footer{width:100%;background-color:#2f3d4c;color:#f0f4f8;text-align:center;padding:1rem 0;font-size:.95rem;box-shadow:0 -2px 8px #0000000d;z-index:10}.footer-text{margin:.3rem 0;font-weight:500}.footer-links a{color:#0056b3;text-decoration:none;margin:0 .3rem;transition:color .3s}.footer-links a:hover{color:#007bff;text-decoration:underline}@media(max-width:480px){.footer{font-size:.85rem;padding:.8rem .6rem}.footer-links{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;white-space:nowrap}.footer-links a{margin:0}}#root{width:100%;height:100vh;margin:0;text-align:center;display:flex;flex-direction:column}.app-container{min-height:100vh;display:flex;flex-direction:column}.main-container{width:100%;max-width:100%;padding:100px 20px 40px;flex:1;flex-direction:column;background:linear-gradient(135deg,#e3f2fd,#f4f6f8);font-family:Poppins,sans-serif}.exam-title{font-size:clamp(1.5rem,4vw,2rem);font-weight:700;margin-bottom:clamp(1.5rem,5vw,2rem);color:#0d47a1;text-align:center;letter-spacing:.5px;text-shadow:1px 1px 3px rgba(0,0,0,.1)}.login-wrapper{flex:1;display:flex;align-items:center;justify-content:center;padding:1rem}.login-card{background-color:#fffc;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:clamp(1.5rem,4vw,2rem);border-radius:18px;width:100%;max-width:340px;box-shadow:0 12px 30px #00000026;transition:transform .2s ease}.login-card:hover{transform:translateY((-6px));box-shadow:0 15px 35px #00000038}.login-card h3{text-align:center;margin-bottom:clamp(1.2rem,3vw,1.5rem);color:#0d47a1;font-size:clamp(1.2rem,3vw,1.5rem);font-weight:600;letter-spacing:.5px}form{width:100%}.form-row{display:flex;flex-direction:column;gap:1rem;margin-bottom:1rem;width:100%}label{font-weight:600;color:#1a1a1a;width:auto;white-space:nowrap;text-align:left;font-size:clamp(.9rem,2.5vw,1rem)}input{width:100%;padding:clamp(.6rem,2vw,.75rem);border-radius:6px;border:1.5px solid #c9c9c9;font-size:clamp(.9rem,2.5vw,1rem);outline:none;transition:all .3s ease}input:focus{border-color:#1976d2;box-shadow:0 0 4px #1976d24d}.login-btn{background:linear-gradient(135deg,#1976d2,#0d47a1);color:#fff;padding:clamp(.55rem,2vw,.7rem) clamp(1.2rem,4vw,1.6rem);border-radius:10px;font-size:.95rem;font-weight:600;width:auto;align-self:center;cursor:pointer;margin-top:1rem;border:none;transition:background-color .3s,transform .2s ease}.login-btn:hover{background-color:#0056b3;transform:translateY(-3px);box-shadow:0 6px 15px #0d47a14d}.error-text{color:red;font-size:clamp(.8rem,2.2vw,.9rem);text-align:center}.switch-login{margin-top:1rem;text-align:center;font-size:clamp(.8rem,2.3vw,.9rem)}.login-link{color:#007bff;cursor:pointer;font-weight:600}.login-link:hover{color:#0d47a1;text-decoration:underline}@media(max-width:640px){.main-container{padding-top:130px}}@media(max-width:480px){.login-card{padding:1.8rem 1.2rem}.form-row{flex-direction:column;align-items:flex-start;gap:.4rem}label{text-align:left;width:100%}input{width:100%}.exam-title{font-size:1.6rem}}.loading-container{display:flex;flex-direction:column;align-items:center;margin-top:80px}.spinner{width:50px;height:50px;border:4px solid #ddd;border-top:4px solid #2c7be5;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:12px}@keyframes spin{to{transform:rotate(360deg)}}.error-box{background:#ffecec;color:#b00020;padding:16px;border-radius:8px;max-width:600px;margin:60px auto;text-align:center}.success-text{color:#198754;font-weight:600;margin:10px 0}.modal-backdrop{position:fixed;inset:0;background:#00000073;display:flex;align-items:center;justify-content:center;z-index:2000}.modal-box{background:#fff;padding:1.5rem;border-radius:12px;width:90%;max-width:420px;box-shadow:0 10px 30px #00000040}.modal-title{margin-bottom:.75rem;font-size:1.2rem;font-weight:700}.modal-title.danger{color:#d32f2f}.modal-message{font-size:.95rem;color:#444}.modal-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:1.5rem}.btn{padding:8px 14px;border-radius:6px;border:none;font-weight:600;cursor:pointer}.btn.primary{background:#1976d2;color:#fff}.btn.danger{background:#dc3545;color:#fff}.btn.secondary{padding:8px 14px;border-radius:6px;border:none;font-weight:600;cursor:pointer;background:#e0e0e0}.admin-dashboard{width:100%;max-width:1100px;margin-inline:auto;padding-inline:clamp(12px,4vw,24px);padding-block:clamp(12px,4vw,24px);font-family:Arial,Helvetica,sans-serif;background:#f9fafb;box-sizing:border-box;overflow-x:auto}.admin-dashboard h2{margin-bottom:6px;font-size:clamp(1.6rem,2.5vw,1.8rem)}.admin-dashboard p{color:#555;margin-bottom:20px;font-size:clamp(1rem,2vw,1.2rem)}.error-text,.success-text{padding:10px 14px;border-radius:6px;margin-bottom:12px;font-size:clamp(.85rem,2vw,.95rem)}.error-text{background:#ffe6e6;color:#b30000}.success-text{background:#e6fffa;color:#006d5b}.table-container{width:100%;overflow-x:auto;border:1px solid #ddd;border-radius:8px;margin-bottom:24px;background:#fff}.table-container h3{margin-top:10px}.config-table{width:100%;min-width:680px;border-collapse:collapse}.config-table th,.config-table td{padding:clamp(8px,1.8vw,12px);border:1px solid #e0e0e0;text-align:center;vertical-align:middle;font-size:clamp(.8rem,2vw,.9rem)}.config-table th{background:#cad4df;font-weight:600;position:sticky;top:0;z-index:1}.empty-row td{text-align:center;vertical-align:middle;padding:20px;color:#888;font-style:italic}.config-table tbody tr:nth-child(2n){background-color:#f8fafc}.config-table tbody tr:nth-child(odd){background-color:#fff}.config-table tbody tr:hover{background-color:#eef6ff}.active-row{background:#cfe9fb!important;font-weight:600}.active-row td:last-child{color:#007acc}.selected-row{background-color:#eef6ff;cursor:pointer}.config-table tr{cursor:pointer}.section-card{margin-top:clamp(20px,4vw,30px);padding:clamp(14px,3vw,20px);border-radius:12px;text-align:center;background:#fafafa;box-shadow:0 6px 18px #0000000d;overflow:hidden}.section-title{font-size:clamp(1.6rem,3.5vw,1.9rem);font-weight:700;margin-bottom:clamp(15px,3vw,20px);padding-bottom:6px;color:#333;letter-spacing:1px}.upload-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:clamp(14px,3vw,24px);padding:clamp(20px,4vw,30px);border:2px dashed #cbd5e1;border-radius:12px;background:transparent;width:100%}.upload-card{display:flex;flex-direction:column;align-items:center;gap:clamp(10px,2.5vw,14px);padding:clamp(18px,3vw,24px);border-radius:12px;box-shadow:4px 12px 15px #0000000d;min-width:0;min-height:260px;justify-content:space-between}.upload-card h4{font-size:clamp(1.1rem,2.8vw,1.3rem);font-weight:600;margin-bottom:14px;color:#1f2937}.upload-card input[type=file],.upload-card input[type=text]{width:90%;padding:6px 10px;height:clamp(32px,5vw,38px);font-size:clamp(.8rem,2.5vw,.9rem);box-sizing:border-box;margin:10px auto}.upload-dropzone{width:100%;min-height:clamp(110px,28vw,160px);border:2px dashed #cbd5e1;border-radius:12px;background:#f8fafc;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:clamp(8px,2vw,12px);text-align:center;cursor:pointer}.upload-card h4{margin-bottom:10px;text-align:center}.config-actions{margin-top:40px;display:flex;flex-direction:column;align-items:center;gap:clamp(12px,2vw,20px)}.form-grid{width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,2.5vw,24px);margin-top:20px}.form-field{display:flex;flex-direction:column;align-items:flex-start;gap:clamp(6px,1vw,10px)}.form-field label{font-weight:600;margin-bottom:6px;white-space:nowrap;font-size:clamp(.85rem,2vw,.95rem)}.form-field input,.form-field select{width:100%;padding:clamp(8px,1.6vw,10px);border-radius:6px;border:1px solid #ccc;font-size:clamp(.85rem,2vw,.95rem);text-align:center;box-sizing:border-box}.inline-delete{display:grid;grid-template-columns:1fr auto;gap:8px;width:100%;align-items:center}.inline-delete select{width:100%;min-width:0}.icon-danger-btn{background:#ffe6e6;border:1px solid #ff4d4d;color:#b30000;padding:6px 10px;border-radius:6px;cursor:pointer;font-size:16px}.icon-danger-btn:disabled{opacity:.5;cursor:not-allowed}.inline-assign{display:grid;grid-template-columns:1fr auto;gap:10px;width:100%;align-items:center}.inline-assign input{width:100%;min-width:0}.inline-assign .assign-btn{padding:0 16px;width:auto}.assign-btn{height:35px;padding:0 15px;font-size:.9rem;font-weight:600;border-radius:8px;background:#007acc;color:#fff;white-space:nowrap;cursor:pointer}.form-field .assign-btn{align-self:center}.action-buttons{margin-top:40px}.action-buttons button,.section-card button{width:clamp(180px,90%,260px);max-width:100%;height:45px;margin-top:15px;padding:0 18px;font-size:.85rem;font-weight:600;border-radius:8px;display:flex;align-items:center;justify-content:center;white-space:nowrap;flex-direction:row;box-sizing:border-box;cursor:pointer}.primary-btn{background:#007acc;color:#fff}.primary-btn,.danger-btn,.assign-btn{width:clamp(180px,80%,260px);max-width:100%}.danger-btn{width:clamp(200px,60%,260px);background-color:#c62828;color:#fff;border:none;padding:.65rem 1.2rem;font-size:.95rem;font-weight:600;border-radius:6px;cursor:pointer;transition:background-color .25s ease,transform .15s ease}.danger-btn:disabled{background-color:#e0e0e0;color:#9e9e9e;cursor:not-allowed}.readonly-input{background-color:#f4f6f8;cursor:not-allowed}@media(max-width:900px){.upload-grid{grid-template-columns:repeat(2,1fr);gap:16px}}@media(max-width:700px){.admin-dashboard{max-width:100%;margin:0;padding-inline:12px}.form-grid,.upload-grid{grid-template-columns:1fr;padding:6px}}.employees-page{width:100%;max-width:1100px;margin:0 auto}.page-title{font-size:1.6rem;font-weight:700;margin-bottom:1.2rem;color:#0d47a1}.table-wrapper{background:#fff;border-radius:12px;box-shadow:0 6px 18px #0000001f;overflow-x:auto}.employees-table{width:100%;border-collapse:collapse}.employees-table th,.employees-table td{padding:12px 14px;text-align:left;font-size:.9rem}.employees-table thead{background:#f4f6f8}.employees-table th.center-col,.employees-table td.center-col{text-align:center;vertical-align:middle}.center-col .table-actions{justify-content:center}.employees-table tr:not(:last-child){border-bottom:1px solid #e0e0e0}.edit-btn{background:#f1f5f9;border:1px solid #cbd5e1;padding:6px 10px;border-radius:6px;cursor:pointer}.edit-btn:hover{background:#e2e8f0}.role.admin{color:#d32f2f;font-weight:600}.role.employee{color:#1976d2;font-weight:500}.empty-row{text-align:center;padding:20px;color:#777}.message-wrapper{max-width:520px;width:100%;margin:1rem auto}.template-links{margin:1.5rem auto;max-width:520px;width:100%}.template-links a{display:block;text-align:center;background:#eef2ff;color:#1e3a8a;padding:14px;border-radius:12px;font-weight:600;text-decoration:none;box-shadow:0 6px 16px #00000014}.template-links a:hover{background:#e0e7ff}.upload-card{display:flex;flex-direction:column;align-items:center;gap:clamp(10px,2.5vw,14px);padding:clamp(14px,3vw,20px);border-radius:12px;box-shadow:0 10px 25px #00000014;min-width:0}.employee-upload{max-width:520px;width:100%;margin:2rem auto}.upload-dropzone{min-height:clamp(110px,28vw,160px);border:2px dashed #cbd5e1;border-radius:12px;background:#f8fafc;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:clamp(8px,2vw,12px);text-align:center;cursor:pointer}.upload-dropzone:hover{background:#f1f5f9;border-color:#94a3b8}.upload-icon{width:clamp(28px,8vw,42px);height:clamp(28px,8vw,42px);opacity:.5;filter:grayscale(100%)}.upload-dropzone p{font-size:clamp(.85rem,3vw,1rem);font-weight:500;margin:0;color:#475569}.upload-dropzone span{font-size:clamp(.7rem,2.5vw,.8rem);font-weight:500;color:#94a3b8}.upload-section input[type=file]{width:100%;display:block;margin:10px auto}.selected-file{display:flex;flex-direction:column;gap:4px;font-size:.85rem;color:#334155;word-break:break-all;text-align:center}.upload-section button{margin-top:auto}.section-card,.upload-card{display:flex;flex-direction:column;align-items:center}.upload-card .primary-btn{width:100%;max-width:220px;height:clamp(36px,6vw,42px);font-size:clamp(.75rem,2.5vw,.85rem);margin-top:8px}.upload-dropzone input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer}.card-footer{margin-top:auto}.primary-btn{background:#007acc;color:#fff;width:clamp(180px,80%,260px);max-width:100%;padding:clamp(12px,3vw,15px);border-radius:12px}.primary-btn:hover{background:#005fa3}.primary-btn:active{transform:scale(.98)}.primary-btn:disabled{opacity:.6;cursor:not-allowed}.employee-form{max-width:700px;margin:2rem auto;padding:1.5rem}.form-title{font-size:1.2rem;font-weight:700;margin-bottom:1.2rem;color:#0d47a1;text-align:center}.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px 18px}.form-field{display:flex;flex-direction:column;gap:4px}.form-field label{font-size:.8rem;font-weight:600;color:#475569}.form-field input,.form-field select{padding:10px 12px;border-radius:8px;border:1px solid #cbd5e1;font-size:.9rem}.form-field input:focus,.form-field select:focus{outline:none;border-color:#1976d2;box-shadow:0 0 0 1px #1976d2}.full-width{grid-column:span 2}.checkbox-field{grid-column:span 2;display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:8px}.checkbox-field label{font-size:.9rem;font-weight:600;color:#334155;cursor:pointer}.checkbox-field input{width:16px;height:16px;cursor:pointer}.form-actions{margin-top:1.2rem;display:flex;justify-content:center}.results-page{max-width:1100px;width:100%;margin:auto;padding:20px;overflow-x:auto}.page-title{font-size:1.8rem;margin-bottom:20px}.results-card{background:#fff;border-radius:12px;box-shadow:0 6px 18px #0000001f;padding:15px;width:100%;max-width:100%}.results-filters{display:grid;grid-template-columns:minmax(200px,1fr) minmax(160px,1fr) auto;gap:14px;margin-bottom:20px;align-items:center}.results-filters select,.results-filters input{padding:10px}.results-filters select{cursor:pointer}.results-filters input{max-width:100%}.results-filters select:focus{outline:none;border-color:#2563eb;box-shadow:0 0 0 2px #2563eb40}.results-table-wrapper{overflow-x:auto}.results-table{width:100%;border-collapse:collapse}.results-table th,.results-table td{padding:12px 14px;border-bottom:1px solid #e5e7eb;text-align:left;font-size:.9rem}.results-table thead{background:#f8fafc}.results-table th.center-col,.results-table td.center-col{text-align:center}.table-actions{display:flex;align-items:center;gap:8px}.danger-btn{background:#dc3545;color:#fff;border:none;padding:6px 10px;font-size:.8rem;border-radius:6px;cursor:pointer}.danger-btn:hover{background:#b52d38}.results-table tr:not(:last-child){border-bottom:1px solid #e0e0e0}.empty-state{text-align:center;padding:20px;color:#64748b}.results-export{display:flex;gap:12px;margin-top:16px;flex-wrap:wrap}.export-btn{padding:10px 16px;border-radius:8px;border:none;cursor:pointer;font-size:.9rem;display:flex;align-items:center;gap:6px}.export-btn.excel{background:#16a34a;color:#fff}.export-btn.pdf{background:#dc2626;color:#fff}.export-btn:hover{opacity:.9}@media(max-width:900px){.results-filters{grid-template-columns:1fr 1fr}.results-filters button{grid-column:1 / -1;width:100%}}@media(max-width:600px){.results-filters{grid-template-columns:1fr}.page-title{font-size:1.5rem}.results-filters button{width:100%}.results-table th,.results-table td{padding:10px;font-size:.8rem;white-space:nowrap}.results-export{flex-direction:column}.export-btn{width:100%;justify-content:center}}.exam-container{width:80%;max-width:700px;margin:30px auto;padding-bottom:40px}.timer{position:fixed;top:80px;right:20px;width:fit-content;display:flex;align-items:center;gap:8px;background:#ffe5e5;color:#d11a2a;padding:4px 8px;border-radius:10px;font-weight:700;margin-bottom:20px;font-size:18px;box-shadow:0 4px 10px #00000026;z-index:1000}.hourglass{font-size:22px;animation:rotateHourglass 2s infinite linear}@keyframes rotateHourglass{0%{transform:rotate(0)}50%{transform:rotate(180deg)}to{transform:rotate(360deg)}}.exam-title{text-align:center;margin-bottom:25px;font-size:26px;font-weight:700;font-family:Montserrat,sans-serif}.progress-bar{width:100%;height:8px;background:#e0e0e0;border-radius:4px;margin:16px 0}.progress-fill{height:100%;background:#2ecc71;transition:width .3s ease}.qstn-card{width:85%;background:#fff;padding:18px 20px;margin:0 auto 20px;border-left:5px solid #1a73e8;border-radius:10px;box-shadow:0 3px 10px #0000001a;transition:transform .2s ease,box-shadow .2s ease}.qstn-card:hover{transform:translateY(-4px);box-shadow:0 6px 18px #0000002e}.qstn-image-wrapper{margin:10px 0;text-align:center}.qstn-image{max-width:100%;max-height:300px;object-fit:contain}.qstn-text{font-size:18px;font-weight:600}.options{display:flex;flex-direction:column;gap:8px;width:100%;padding-left:10px;margin-top:30px}.option-label{width:100%;padding:10px 14px;background:#fff;display:flex;align-items:center;text-align:left;cursor:pointer;font-size:16px;gap:12px;line-height:1.4;border:1px solid #d1d1d1;border-radius:8px}.option-label:hover{background:#e3f2fd;border-color:#90caf9}.option-label input{margin-top:3px;flex-shrink:0;transform:scale(1.2)}.radio-wrap{width:22px;display:flex;justify-content:center;flex-shrink:0}.option-text{flex:1;text-align:left;white-space:normal}.next-btn{margin-top:20px;padding:12px 28px;font-size:16px;font-weight:600;background:linear-gradient(135deg,#2563eb,#1e40af);color:#fff;border:none;border-radius:8px;cursor:pointer;box-shadow:0 6px 14px #2563eb59;transition:all .25s ease}.next-btn:hover{transform:translateY(-2px);box-shadow:0 10px 22px #2563eb73}.next-btn:active{transform:translateY(0);box-shadow:0 5px 12px #2563eb59}.submit-btn{background:#1a73e8;color:#fff;padding:12px 25px;font-size:1.1rem;border:none;border-radius:8px;cursor:pointer;width:auto;min-width:200px;margin:20px auto;font-weight:700;transition:background .2s ease}.submit-btn:hover{background:#155ab5}.modal-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#0009;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);display:flex;justify-content:center;align-items:center;z-index:1000}.modal-box{background:#fff;padding:28px;border-radius:14px;width:90%;max-width:420px;text-align:center;box-shadow:0 20px 40px #00000040;animation:popIn .3s ease}.success-icon{font-size:36px;color:#16a34a;margin-bottom:10px}.view-score-btn{margin-top:16px;padding:10px 22px;font-size:15px;font-weight:600;background:#2563eb;color:#fff;border:none;border-radius:8px;cursor:pointer}.view-score-btn:hover{background:#1d4ed8}@keyframes popIn{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}@media(min-width:1024px){.options.with-image{display:grid;grid-template-columns:1fr 1fr;gap:10px}}@media(max-width:768px){.qstn-card{width:100%}.timer,.hourglass{font-size:15px;border-radius:8px}}.scorecard-wrapper{display:flex;flex-direction:column;align-items:center;gap:clamp(20px,5vw,30px);margin-top:clamp(20px,6vw,40px);padding:0 clamp(12px,4vw,20px) 80px;max-width:100vw;overflow-x:hidden}.result-card{width:100%;max-width:clamp(300px,90vw,420px);padding:clamp(18px,5vw,30px);background:#fff;border-radius:16px;box-shadow:0 4px 10px #00000026;text-align:center}.result-title{font-size:26px;font-weight:600;margin-bottom:10px}.score-text{font-size:clamp(.95rem,3vw,1.1rem);font-weight:600;margin-top:10px;line-height:1.6}.percentage-text{display:block;margin-top:6px}.remark{font-size:clamp(1rem,4vw,1.25rem);margin-top:12px;font-weight:700}.review-section{margin-top:30px;padding:20px;border-radius:12px;background:#f8fafc;box-shadow:0 6px 18px #0000000d}.review-section h3{font-size:20px;margin-bottom:16px;text-align:center;color:#1f2937}.review-block{margin-top:20px;padding:15px;border-radius:10px}.review-block.wrong{background:#fff1f2;border-left:5px solid #dc2626}.review-block.unanswered{background:#fff7ed;border-left:5px solid #f59e0b}.review-block h4{font-size:17px;margin-bottom:12px;color:#111827}.review-question{margin-bottom:14px;padding-bottom:12px;border-bottom:1px dashed #e5e7eb}.review-question:last-child{border-bottom:none}.question-text{font-weight:600;margin-bottom:6px;color:#111827}.wrong-answer{color:#b91c1c;font-weight:500}.correct-answer{color:#166534;font-weight:500}.chart-box{width:100%;max-width:600px;display:flex;justify-content:center;overflow:hidden}.chart-row{display:flex;gap:30px;margin-top:30px;flex-wrap:wrap;justify-content:center}.chart-inner{width:100%;height:420px}.chart-label{margin-top:10px;font-size:14px;font-weight:600}.cert-btn{width:clamp(220px,80vw,300px);margin-top:25px;padding:12px 26px;background:linear-gradient(135deg,#059669,#047857);color:#fff;border:none;border-radius:8px;font-weight:600;cursor:pointer;box-shadow:0 6px 16px #05966966}.cert-btn:hover{transform:translateY(-2px);background:#15803d}.cert-toast{position:fixed;bottom:clamp(70px,12vh,100px);left:50%;transform:translate(-50%);max-width:90vw;background:#16a34a;color:#fff;padding:10px 18px;border-radius:8px;font-size:14px;font-weight:500;box-shadow:0 6px 18px #0003;z-index:1000}@media(max-width:768px){.chart-box{width:100%;max-width:320px;overflow-x:hidden}.chart-inner{height:300px}.cert-btn{width:100%;max-width:320px}}
