@font-face{font-family:"Lateef";src:url("fonts/Lateef-Regular.ttf") format("truetype");font-weight:normal;font-style:normal;font-display:swap}
*{box-sizing:border-box;border-radius:0!important;font-family:"Lateef",serif!important}
html,body{margin:0;background:#f3f4f6;color:#1f2937;font-size:22px;line-height:1.6}
header{background:#1e3a5f;color:#fff;display:flex;gap:1rem;align-items:center;padding:.4rem 1rem;flex-wrap:wrap}
header a,header button.link{color:#fff;text-decoration:none;background:none;border:0;cursor:pointer;font-size:1rem}
header .brand{font-size:1.4rem;margin-left:auto}
main{max-width:1100px;margin:1rem auto;padding:0 1rem}
.card{background:#fff;border:1px solid #d1d5db;padding:1rem;margin-bottom:1rem}
h1,h2,h3{margin:.3rem 0;font-weight:bold}
input,select,textarea,button{font-size:1rem;padding:.3rem .6rem;border:1px solid #9ca3af;background:#fff}
input[type=text],input[type=password],textarea,select{width:100%}
textarea{min-height:6rem}
button,.btn{background:#1e3a5f;color:#fff;border:1px solid #1e3a5f;cursor:pointer;text-decoration:none;display:inline-block;padding:.25rem .9rem}
.btn.sec,button.sec{background:#fff;color:#1e3a5f}
button.danger{background:#b91c1c;border-color:#b91c1c}
table{width:100%;border-collapse:collapse;background:#fff}
th,td{border:1px solid #d1d5db;padding:.3rem .5rem;text-align:right}
th{background:#e5e7eb}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.7rem}
label{display:block;margin-top:.4rem}
.muted{color:#6b7280}
.ok{color:#166534}.err{color:#b91c1c}
.inline{display:inline}
.q{border-right:4px solid #1e3a5f}
.opt{display:block;padding:.2rem .4rem;border:1px solid #e5e7eb;margin:.2rem 0;cursor:pointer}
.timer{position:sticky;top:0;background:#fef3c7;border:1px solid #f59e0b;padding:.4rem 1rem;font-size:1.4rem;z-index:5}
.modal-bg{position:fixed;inset:0;background:rgba(0,0,0,.45);display:none;align-items:center;justify-content:center;z-index:50}
.modal-bg.show{display:flex}
.modal{background:#fff;border:2px solid #1e3a5f;min-width:300px;max-width:90vw;padding:1rem}
.modal .actions{display:flex;gap:.5rem;justify-content:flex-start;margin-top:1rem}
.viewer img,.viewer video{max-width:100%}
.viewer iframe{width:100%;height:80vh;border:1px solid #d1d5db}
.pre{white-space:pre-wrap}
.course-card{display:block;color:inherit;text-decoration:none}
.course-card:hover{border-color:#1e3a5f;background:#eef2f7}
.reading-text{font-size:1.25rem;line-height:2;max-width:60rem}
.dt-field{display:block;margin-top:.4rem}.dt-row{display:flex;gap:.3rem}.dt-row input[type=text]{flex:1;width:auto}
.jp-pop{position:absolute;z-index:40;background:#fff;border:2px solid #1e3a5f;padding:.5rem;min-width:320px;box-shadow:0 4px 12px rgba(0,0,0,.25)}
.jp-head,.jp-foot{display:flex;gap:.25rem;align-items:center;margin-bottom:.3rem}.jp-head select{width:auto}.jp-year{width:5.5rem}
.jp-grid{width:100%}.jp-grid th,.jp-grid td{text-align:center;padding:0;border:1px solid #e5e7eb}
.jp-day{width:100%;background:#fff;color:#1f2937;border:0;padding:.2rem}.jp-day:hover{background:#dbeafe}
.jp-today{outline:2px solid #f59e0b}.jp-sel{background:#1e3a5f!important;color:#fff!important}
.qedit td{vertical-align:middle}.correct-cell{width:9rem;background:#f0fdf4}.correct-lbl{margin:0;cursor:pointer;color:#166534}
.opts li.is-correct{background:#dcfce7}
details summary{cursor:pointer;color:#1e3a5f;margin:.4rem 0}
.q .unans{display:inline-block;margin-top:.2rem}.q.answered .unans{display:none}
.q:not(.answered){border-right-color:#b91c1c}
.finish{text-align:center}.finish button{font-size:1.3rem;padding:.4rem 1.5rem}
button:disabled{background:#9ca3af;border-color:#9ca3af;cursor:not-allowed}
.result .big{font-size:1.8rem}
