/* Online Exam v4.0 */
@import url('https://fonts.googleapis.com/css2?family=Hind:wght@400;500;600;700;800&family=Noto+Sans+Bengali:wght@400;500;600;700&display=swap');

*{box-sizing:border-box;margin:0;padding:0}
#oe-app{font-family:'Hind','Noto Sans Bengali',Arial,sans-serif;max-width:1000px;margin:0 auto;padding:8px}
.hidden{display:none!important}

/* ── SETUP SCREEN ─────────────────────────── */
.oe-setup-wrap{background:#fff;border-radius:14px;box-shadow:0 2px 18px rgba(0,0,0,.09);overflow:hidden;max-width:900px;margin:0 auto}
.oe-setup-header{background:linear-gradient(135deg,#0056ff,#1a7aff);padding:1.1rem 1.5rem;display:flex;align-items:center;gap:12px}
.oe-logo-img{width:38px;height:38px;border-radius:50%;object-fit:cover;border:2px solid rgba(255,255,255,.5)}
.oe-setup-title{flex:1;color:#fff;font-size:1.25rem;font-weight:800}
.oe-home-icon{color:#fff;font-size:1.4rem;text-decoration:none;opacity:.85}
.oe-home-icon:hover{opacity:1}

.oe-setup-body{padding:1.5rem}
.oe-field-group{margin-bottom:1.4rem}
.oe-field-label{display:block;font-size:.78rem;font-weight:700;color:#64748b;text-transform:uppercase;letter-spacing:.07em;margin-bottom:.55rem}

.oe-select-big{width:100%;padding:2px;border:1.5px solid #e2e8f0;border-radius:8px;font-size:.97rem;color:#1e293b;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath fill='%2364748b' d='M5 6L0 0h10z'/%3E%3C/svg%3E") no-repeat right .9rem center;appearance:none;outline:none;transition:.15s}
.oe-select-big:focus{border-color:#0056ff;box-shadow:0 0 0 3px rgba(0,86,255,.1)}
.oe-cat-badge{margin-top:.45rem;display:inline-block;background:#e8f0fe;color:#0056ff;font-size:.8rem;font-weight:700;padding:.28rem .75rem;border-radius:20px}

/* Number/Time preset grid */
.oe-num-grid,.oe-time-grid{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:.6rem}
.oe-num-btn,.oe-time-btn{min-width:52px;padding:.45rem .7rem;border:1.5px solid #e2e8f0;border-radius:7px;background:#f8fafc;font-size:.92rem;font-weight:600;color:#334155;cursor:pointer;transition:.15s}
.oe-num-btn:hover,.oe-time-btn:hover{border-color:#0056ff;color:#0056ff}
.oe-num-btn.active,.oe-time-btn.active{background:#0056ff;color:#fff;border-color:#0056ff}
.oe-custom-row{display:flex;align-items:center;gap:.5rem;margin-top:.5rem}
.oe-custom-input{width:90px;padding:.4rem .55rem;border:1.5px solid #e2e8f0;border-radius:7px;font-size:.9rem;text-align:center;outline:none}
.oe-custom-input:focus{border-color:#0056ff}
.oe-custom-btn{padding:.4rem .85rem;background:#0056ff;color:#fff;border:none;border-radius:7px;font-size:.85rem;font-weight:700;cursor:pointer}
.oe-num-display{margin-top:.55rem;font-size:.87rem;color:#334155}
.oe-num-display strong{color:#0056ff}

.oe-start-btn{width:100%;padding:.85rem;background:linear-gradient(135deg,#0056ff,#003cc0);color:#fff;border:none;border-radius:10px;font-size:1.05rem;font-weight:800;cursor:pointer;margin-top:.5rem;transition:.15s;letter-spacing:.02em}
.oe-start-btn:hover:not(:disabled){opacity:.9;transform:translateY(-1px)}
.oe-start-btn:disabled{opacity:.45;cursor:not-allowed;transform:none}
.oe-err-msg{margin-top:.65rem;background:#fef2f2;border:1px solid #fca5a5;color:#b91c1c;border-radius:7px;padding:.55rem .9rem;font-size:.85rem}
.oe-loading-bar{display:flex;align-items:center;gap:.5rem;margin-top:.65rem;color:#0056ff;font-size:.88rem;justify-content:center}
.oe-spinner{width:16px;height:16px;border:2.5px solid #dbeafe;border-top-color:#0056ff;border-radius:50%;animation:spin .65s linear infinite;flex-shrink:0}
@keyframes spin{to{transform:rotate(360deg)}}

/* ── EXAM SCREEN ─────────────────────────── */
.oe-exam-wrap{display:grid;grid-template-columns:155px 1fr 130px;min-height:420px;background:#fff;border-radius:14px;box-shadow:0 2px 18px rgba(0,0,0,.09);overflow:hidden}
@media(max-width:650px){.oe-exam-wrap{grid-template-columns:1fr;grid-template-rows:auto 1fr auto}}

/* Sidebar */
.oe-exam-sidebar{background:#f8fafc;border-right:1px solid #e2e8f0;padding:1rem .8rem}
.oe-sidebar-title{font-size:.72rem;font-weight:700;color:#64748b;text-transform:uppercase;letter-spacing:.08em;margin-bottom:.7rem}
.oe-dots{display:flex;flex-wrap:wrap;gap:.3rem}
.oe-dot{width:30px;height:30px;border-radius:6px;border:1.5px solid #e2e8f0;background:#fff;display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:700;color:#475569;cursor:pointer;transition:.12s;user-select:none}
.oe-dot:hover{border-color:#0056ff}
.oe-dot.ans{background:#0056ff;color:#fff;border-color:#0056ff}
.oe-dot.cur{border:2.5px solid #0056ff;color:#0056ff}
.oe-dot.ans.cur{background:#0056ff;color:#fff;border:2.5px solid #003cc0}

/* Main question area */
.oe-exam-main{padding:1.2rem 1.4rem;display:flex;flex-direction:column}
.oe-exam-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:.9rem}
.oe-exam-cat{background:#e8f0fe;color:#0056ff;font-size:.78rem;font-weight:700;padding:.25rem .8rem;border-radius:20px;max-width:60%}
.oe-finish-btn{background:#ef4444;color:#fff;border:none;border-radius:7px;padding:.38rem .9rem;font-size:.82rem;font-weight:700;cursor:pointer}
.oe-q-num{font-size:.9rem;font-weight:700;color:#0056ff;margin-bottom:.3rem}
.oe-q-meta{color:#94a3b8;font-weight:400;font-size:.82rem}
.oe-divider{border:none;border-top:1px solid #e2e8f0;margin:.35rem 0 .9rem}
.oe-q-text{font-size:1rem;font-weight:600;color:#1e293b;line-height:1.65;margin-bottom:1rem}
.oe-q-opts{display:flex;flex-direction:column;gap:.4rem;margin-bottom:1.2rem;flex:1}
.oe-opt-lbl{display:flex;align-items:center;gap:.7rem;padding:.58rem .9rem;border:1.5px solid #e2e8f0;border-radius:8px;cursor:pointer;transition:.13s}
.oe-opt-lbl:hover{border-color:#0056ff;background:#f0f6ff}
.oe-opt-lbl.sel{border-color:#0056ff;background:#e8f0fe}
.oe-opt-lbl input[type=radio]{accent-color:#0056ff;width:15px;height:15px;flex-shrink:0}
.oe-opt-text{font-size:.92rem;color:#334155}
.oe-opt-lbl.sel .oe-opt-text{color:#0056ff;font-weight:600}

.oe-exam-nav{display:flex;gap:.55rem;align-items:center;flex-wrap:wrap;margin-top:auto}
.oe-nav-btn{padding:.48rem 1rem;border-radius:8px;font-size:.86rem;font-weight:600;cursor:pointer;border:none;transition:.13s}
.oe-prev-btn{background:#e2e8f0;color:#475569}
.oe-prev-btn:hover:not(:disabled){background:#cbd5e1}
.oe-prev-btn:disabled{opacity:.4}
.oe-next-btn{background:#0056ff;color:#fff}
.oe-next-btn:hover{background:#003cc0}
.oe-submit-btn{background:#16a34a;color:#fff;border:none;border-radius:8px;padding:.48rem 1.1rem;font-size:.86rem;font-weight:700;cursor:pointer;margin-left:auto}

/* Timer */
.oe-exam-timer{background:#f59e0b;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.25rem;padding:1rem}
.oe-timer-label{font-size:.66rem;font-weight:700;color:rgba(0,0,0,.55);text-transform:uppercase;letter-spacing:.1em}
.oe-timer-digits{font-size:1.55rem;font-weight:900;color:#1c0400;font-variant-numeric:tabular-nums;letter-spacing:.04em}
.oe-exam-timer.warn{background:#ef4444;animation:pulse .9s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.8}}

/* ── REPORT SCREEN ───────────────────────── */
.oe-report-wrap{background:#fff;border-radius:14px;box-shadow:0 2px 18px rgba(0,0,0,.09);overflow:hidden}

/* Top summary — matches report-exam.PNG */
.oe-report-summary{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:2px solid #e2e8f0}
.oe-report-stat{padding:1.1rem 1rem;text-align:center;border-right:1px solid #e2e8f0}
.oe-report-stat:last-child{border-right:none}
.oe-rs-label{font-size:.68rem;font-weight:700;color:#94a3b8;text-transform:uppercase;letter-spacing:.1em;margin-bottom:.3rem}
.oe-rs-val{font-size:1.55rem;font-weight:900;line-height:1}
.oe-rs-val.blue{color:#0056ff}
.oe-rs-val.orange{color:#f59e0b}

/* Table */
.oe-report-table-wrap{overflow-x:auto}
.oe-report-table{width:100%;border-collapse:collapse;font-size:.87rem}
.oe-report-table thead tr{background:#1e293b}
.oe-report-table thead th{color:#fff;padding:.65rem .9rem;text-align:left;font-size:.73rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;white-space:nowrap}
.oe-rpt-row{border-bottom:1px solid #f1f5f9;transition:.1s}
.oe-rpt-row:hover{background:#f8fafc}
.oe-rpt-row.rpt-ok{background:#fafffe}
.oe-rpt-row.rpt-bad{background:#fffafa}
.rpt-num{padding:.65rem .9rem;font-weight:700;color:#64748b;font-size:.82rem;width:44px;text-align:center;vertical-align:top}
.rpt-qcell{padding:.65rem .9rem;vertical-align:top;max-width:380px}
.rpt-qtxt{font-weight:600;color:#1e293b;line-height:1.55;margin-bottom:.3rem}
.rpt-expl{background:#eff6ff;border:1px solid #bfdbfe;border-radius:6px;padding:.35rem .65rem;font-size:.78rem;color:#1e40af;line-height:1.5;margin-top:.4rem}
.rpt-expl span{font-weight:700}
.rpt-ua{padding:.65rem .9rem;vertical-align:top;color:#475569;font-size:.87rem;min-width:120px}
.rpt-cor{padding:.65rem .9rem;vertical-align:top;font-size:.87rem;min-width:120px}
.rpt-green{color:#16a34a;font-weight:700}
.rpt-status{padding:.65rem .9rem;vertical-align:top;white-space:nowrap}
.rpt-pass{color:#16a34a;font-weight:700;font-size:.85rem}
.rpt-fail{color:#ef4444;font-weight:700;font-size:.85rem}

.oe-report-actions{padding:1.2rem;text-align:center;border-top:1px solid #e2e8f0}
.oe-retry-btn{background:#0056ff;color:#fff;border:none;border-radius:9px;padding:.7rem 2rem;font-size:.95rem;font-weight:700;cursor:pointer;transition:.13s}
.oe-retry-btn:hover{background:#003cc0}

/* ── Question body: text + image support ─────── */
.oe-q-body { margin-bottom: 1rem; }
.oe-q-text { font-size:1rem; font-weight:600; color:#1e293b; line-height:1.7; margin-bottom:.5rem; }
.oe-q-img-wrap { margin: .5rem 0; }
.oe-q-img { max-width:100%; max-height:320px; border-radius:8px; border:1px solid #e2e8f0; display:block; }

/* ── Option letter badge ─────────────────────── */
.oe-opt-letter {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: #e2e8f0;
  color: #475569;
  font-size: .75rem;
  font-weight: 800;
  flex-shrink: 0;
}
.oe-opt-lbl.sel .oe-opt-letter {
  background: #0056ff;
  color: #fff;
}
/* hide the raw radio button visually */
.oe-opt-lbl input[type=radio] { display:none; }