/* One calm, legible assessment surface on phones and desktop. */
.exam-hub-intro { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:30px; border:1px solid #e8dde6; border-radius:26px; background:linear-gradient(120deg,#fff,#f0e8ef); }
.exam-hub-intro h2 { margin:12px 0; font-size:clamp(22px,3vw,30px); color:#493044; }
.exam-hub-intro p { color:#706675; line-height:1.7; max-width:540px; margin:0; }
.exam-hub-badge { text-align:center; flex-shrink:0; color:#704763; font-size:38px; font-weight:750; padding:18px; border:1px solid #decfda; border-radius:22px; background:#ffffffad; }
.exam-hub-badge small { display:block; font-size:11px; font-weight:600; margin-top:5px; }
.exam-upcoming { border-top:1px solid #e5dce4; padding-top:22px; margin-top:30px; }
.exam-upcoming summary { cursor:pointer; color:#66586a; font-size:14px; font-weight:650; line-height:1.6; margin-bottom:22px; }
.exam-upcoming summary span { margin-left:8px; border-radius:8px; padding:4px 8px; background:#eee6ed; }
.exam-hub .mini-exam-card { border-radius:23px; background:#fff; border:1px solid #e5dfe5; box-shadow:0 8px 25px #38233305; }
.view[data-rendered-view="quiz"],.view[data-rendered-view="placement"] { animation:none; }
.exam-page { max-width:760px; padding-top:26px; padding-bottom:130px; }
.exam-top { display:flex; align-items:center; gap:14px; margin-bottom:24px; }
.exam-top>div { flex:1; min-width:0; }
.exam-top small { display:block; color:#735269; font-size:11px; font-weight:750; letter-spacing:.11em; margin-bottom:5px; }
.exam-top strong { display:block; color:#24222b; font-size:14px; line-height:1.4; }
.exam-count { border:1px solid #e5dce4; border-radius:16px; padding:10px 13px; background:#ffffffb8; color:#65405b; white-space:nowrap; font-weight:750; font-variant-numeric:tabular-nums; }
.exam-progress { height:6px; border-radius:9px; background:#e9e2e8; overflow:hidden; margin-bottom:25px; }
.exam-progress>span { display:block; height:100%; background:#704763; border-radius:inherit; transition:width .35s ease; }
.exam-card { background:#fff; border:1px solid #e7e0e6; border-radius:28px; padding:30px; box-shadow:0 15px 45px #38233307; }
.exam-meta { display:flex; justify-content:space-between; align-items:center; gap:12px; font-size:11px; color:#746b77; font-weight:650; }
.exam-meta>span:first-child { color:#704763; letter-spacing:.06em; }
.exam-page .quiz-question { background:none; border:0; border-radius:0; padding:0; margin:23px 0 28px; color:#24222b; font-size:clamp(22px,3vw,29px); line-height:1.48; letter-spacing:-.55px; text-wrap:pretty; }
.exam-page .quiz-options { display:grid; gap:11px; }
.exam-page .quiz-option { display:grid; grid-template-columns:34px minmax(0,1fr) 23px; align-items:center; gap:13px; width:100%; min-height:72px; padding:16px; background:#fff; border:1.5px solid #e4dfe5; border-radius:17px; color:#34313b; font-size:15px; font-weight:550; line-height:1.5; text-align:left; box-shadow:none; overflow-wrap:anywhere; }
.exam-page .quiz-option__letter { width:34px; height:34px; border-radius:11px; background:#f2edf2; color:#756272; font-size:13px; }
.exam-page .quiz-option:not(:disabled):hover { background:#faf7fa; border-color:#a9859f; transform:none; }
.exam-page .quiz-option:focus-visible,.exam-page .btn:focus-visible { outline:3px solid #a980a0; outline-offset:4px; }
.exam-page .quiz-option.is-selected { background:#f2e9f0; border-color:#704763; box-shadow:0 0 0 1px #704763; }
.exam-page .quiz-option.is-selected .quiz-option__letter { background:#704763; color:#fff; }
.exam-page .quiz-option:disabled { cursor:default; opacity:1; }
.exam-page .quiz-option.is-correct { background:#edf6f0; border-color:#568569; color:#244d35; }
.exam-page .quiz-option.is-correct .quiz-option__letter { background:#39734f; color:#fff; }
.exam-page .quiz-option.is-wrong { background:#fff3f1; border-color:#bc7b75; color:#743d37; }
.exam-page .quiz-option.is-wrong .quiz-option__letter { background:#a45c57; color:#fff; }
.exam-page .quiz-option.is-muted { color:#77717a; background:#faf9fb; }
.exam-page .quiz-option>.icon { width:21px; height:21px; }
.exam-page .answer-feedback { margin:22px 0 0; padding:20px; border-radius:18px; }
.exam-page .answer-feedback__title { font-size:16px; }
.exam-page .answer-feedback p { font-size:14px; line-height:1.7; margin:8px 0 0; }
.exam-page .exam-next { margin-top:20px; min-height:52px; border-radius:16px; }
.exam-hint { color:#817783; font-size:12px; line-height:1.5; margin:20px 0 0; text-align:center; }
.exam-page .exam-next:disabled { opacity:.5; cursor:default; }
.exam-card { animation:exam-enter .26s ease-out both; }
.exam-card:has(.answer-feedback),.exam-card:has([aria-pressed="true"]) { animation:none; }
@keyframes exam-enter { from { opacity:.5; transform:translateY(6px); } to { opacity:1; transform:translateY(0); } }
@media(max-width:600px) {
  .exam-hub-intro { padding:23px; gap:15px; align-items:flex-start; }
  .exam-hub-badge { padding:12px; font-size:28px; }
  .exam-hub-intro p { font-size:13px; }
  .exam-page { padding:18px 16px 115px; }
  .exam-top { gap:10px; margin-bottom:20px; }
  .exam-top strong { font-size:12px; }
  .exam-card { padding:23px 18px; border-radius:24px; }
  .exam-page .quiz-option { font-size:14px; padding:14px 12px; gap:10px; grid-template-columns:30px minmax(0,1fr) 20px; }
  .exam-page .quiz-option__letter { width:30px; height:30px; }
  .exam-page .quiz-question { font-size:23px; margin:20px 0 24px; }
}
@media(prefers-reduced-motion:reduce) { .exam-card { animation:none; } .exam-page * { transition:none!important; } }