/* Scoped to the interactive test; loaded after the shared theme. */
.test-page .test-card {
  padding: 32px 36px;
  border: 1px solid #dce5df;
  border-radius: 22px;
  box-shadow: 0 12px 40px rgba(23, 53, 45, .06);
}
.test-page .test-statusbar { margin-bottom: 20px; padding-bottom: 20px; gap: 24px; }
.test-page .test-question-count { white-space: normal; font-size: 13px; letter-spacing: .02em; }
.test-page .test-score { border: 1px solid #deeee4; background: #f0f7f2; border-radius: 14px; }
.test-page .test-progress { height: 6px; }
.test-page .test-audio-toolbar { display:flex; align-items:center; flex-wrap:wrap; gap:10px; margin:0 0 20px; }
.test-page #audioToggle {
  display:inline-flex; align-items:center; gap:10px; min-height:44px;
  padding:8px 14px; border:1px solid #d5dfd8; border-radius:999px;
  background:#f6f8f5; color:#52665a; font-size:13px; font-weight:600;
  line-height:1.4; cursor:pointer; box-shadow:none; transition:background .15s, border-color .15s;
}
.test-page #audioToggle::after {
  content:''; width:32px; height:20px; flex-shrink:0; border-radius:999px;
  background:radial-gradient(circle at 10px 10px, white 0 6px, transparent 7px), #87988d;
}
.test-page #audioToggle[aria-pressed="true"] { background:#edf7f0; color:#176448; border-color:#bcd9c6; }
.test-page #audioToggle[aria-pressed="true"]::after {
  background:radial-gradient(circle at 22px 10px, white 0 6px, transparent 7px), #176448;
}
.test-page #audioToggle:hover { border-color:#176448; }
.test-page #audioToggle:focus-visible { outline:3px solid #dbb65f; outline-offset:3px; }
.test-page #audioStatus { color:#61716a; font-size:12px; }
.test-page .test-question h2 { margin:0 0 26px; font-size:clamp(22px, 2.4vw, 28px); line-height:1.4; letter-spacing:-.02em; }
.test-page .test-answers { gap:10px; }
.test-page .reponse { padding:14px 16px; border-radius:12px !important; font-size:16px; min-height:64px; }
.test-page .answer-letter { width:32px; height:32px; flex-basis:32px; font-size:13px; border-radius:10px; }
.test-page .reponse.is-correct,
.test-page .radioInputTest:checked + .reponse.is-correct { background:#edf8f0 !important; border-color:#71ad85 !important; color:#17643a; box-shadow:none; }
.test-page .reponse.is-incorrect,
.test-page .radioInputTest:checked + .reponse.is-incorrect { background:#fff3f1 !important; border-color:#dba39c !important; color:#983f36; box-shadow:none; }
.test-page .reponse.is-correct .answer-letter { background:#26834b !important; color:white; }
.test-page .reponse.is-incorrect .answer-letter { background:#b64f45 !important; color:white; }
.test-page .reponse.is-correct::after { content:'✓'; margin-left:auto; font-weight:700; }
.test-page .reponse.is-incorrect::after { content:'×'; margin-left:auto; font-weight:700; }
.test-page .test-feedback { min-height:0; padding:0; margin:0; }
.test-page .test-feedback-message:not(:empty) { margin-top:14px; font-size:14px; font-weight:500; }
.test-page .test-actions { margin-top:24px; gap:12px; }
.test-page .test-actions .btn { min-height:48px; border-radius:10px; box-shadow:none; }
.test-page .test-live-results { margin-top:24px; padding-top:18px; gap:12px 24px; flex-wrap:wrap; font-size:13px; }
@media (max-width:600px) {
  .test-page .test-card { padding:22px 18px; border-radius:18px; }
  .test-page .test-statusbar { gap:12px; }
  .test-page .test-score { min-width:70px; padding:10px; }
  .test-page .test-question h2 { font-size:22px; margin-bottom:20px; }
  .test-page .reponse { padding:12px; gap:10px; font-size:15px; }
  .test-page .test-actions .btn { min-width:0; flex:1; }
}