/* Mini-test replacement. The saved homepage stylesheet remains the visual base. */
.hero-visual { min-height: 0; height: auto; }
.practice-surface { position: relative; inset: auto; height: auto; min-height: 0; padding: 30px; }
.practice-top { display: flex; gap: 20px; align-items: flex-start; padding: 0; }
.surface-title--quiz { font-size: 29px; white-space: normal; margin: 9px 0 12px; }
.practice-progress { width: 92px; padding-top: 7px; display: block; }
.practice-body { display: grid; grid-template-columns: minmax(0,1fr) 190px; gap: 18px; margin-top: 24px; align-items: stretch; }
.side-rail { width: auto; min-width: 0; padding: 0!important; display: flex; gap: 16px; align-self: stretch; justify-content: flex-start; }
.side-rail > aside { width: 100%; margin: 0; }
.quiz-card { min-width: 0; background: #fff; border: 1px solid rgba(63,98,156,.13); border-radius: 23px; padding: 23px; box-shadow: var(--shadow-sm); }
.quiz-card fieldset { padding: 0; margin: 0; border: 0; min-width: 0; }
.quiz-card legend { padding: 0; margin: 0 0 21px; font-size: 21px; font-weight: 780; line-height: 1.32; letter-spacing: -.035em; }
.quiz-instruction { font-size: 13px; font-weight: 650; color: var(--text-2); margin: 0 0 12px; }
.quiz-options { display: grid; gap: 10px; }
.quiz-option { display: flex; align-items: center; gap: 11px; padding: 14px 12px; border: 1px solid #dce5f3; border-radius: 13px; background: #f9fbff; min-height: 58px; font-size: 15px; font-weight: 620; line-height: 1.35; cursor: pointer; transition: border-color .18s, background .18s; }
.quiz-option:hover { border-color: #8db2fa; }
.quiz-option:has(input:checked) { background: #eef4ff; border-color: #2468f2; }
.quiz-option.is-correct { background: #effaf3; border-color: #58af77; }
.quiz-option.is-wrong { background: #fff5ed; border-color: #da985c; }
.quiz-option input { flex: 0 0 17px; width: 17px; height: 17px; margin: 0; accent-color: #2468f2; }
.quiz-check { width: 100%; min-height: 50px; margin-top: 18px; padding: 12px 16px; font: inherit; font-weight: 750; cursor: pointer; }
.quiz-check:disabled { cursor: default; opacity: .55; transform: none; box-shadow: none; }
.quiz-context { margin: 0 0 18px; padding: 14px; border-radius: 13px; background: #f1f6ff; color: var(--text); font-size: 16px; line-height: 1.55; font-weight: 550; }
.quiz-continue { width: 100%; min-height: 50px; margin-top: 18px; padding: 12px 16px; font-size: 15px; font-weight: 750; white-space: normal; text-align: center; }
.quiz-check[hidden], .quiz-continue[hidden], .quiz-context[hidden] { display: none!important; }
.quiz-feedback { min-height: 190px!important; padding: 20px!important; flex: 1; background: #fff; }
.quiz-feedback .result-row { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; margin: 16px 0 12px; }
.quiz-feedback .result-icon { width: 42px; height: 42px; flex-basis: 42px; border-radius: 50%; display: grid; place-items: center; background: #eef4ff; color: #2468f2; font-size: 22px; font-weight: 750; border: 1px solid #d6e5ff; }
.quiz-feedback .result-title { font-size: 21px; line-height: 1.15; letter-spacing: -.03em; font-weight: 780; }
.quiz-feedback .result-copy { font-size: 13px; line-height: 1.5; }
.quiz-feedback[data-state="correct"] .result-icon { color: #188c49; background: #eaf8ee; border-color: #b9e2c5; }
.quiz-feedback[data-state="wrong"] .result-icon { color: #a45e20; background: #fff3e7; border-color: #efd4b8; }
.next-card { min-height: 0; background: #f1f6ff; padding: 20px; }
.next-card .next-title { font-size: 18px; }
.quiz-next-link { display: inline-flex; align-items: center; min-height: 44px; margin-top: 8px; color: #245fe8; font-size: 14px; font-weight: 750; }
.lead { max-width: 480px; }
.cta-row { gap: 18px; flex-wrap: wrap; }
.route-card > span:nth-child(2) > span { white-space: normal; }
@media (min-width: 1361px) { .hero { align-items: center; } }
@media (max-width: 1360px) { .hero-visual { width: 100%; max-width: 800px; margin-inline: auto; } .practice-body { grid-template-columns: minmax(0,1fr) 220px; } }
@media (max-width: 700px) { .practice-surface { padding: 23px; } .practice-body { grid-template-columns: minmax(0,1fr); gap: 14px; } .side-rail { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; } .quiz-feedback { min-height: 0!important; } .quiz-feedback .result-row { flex-direction: row; align-items: center; gap: 10px; } .quiz-feedback .result-title { font-size: 18px; } .quiz-feedback .result-icon { flex: 0 0 35px; width: 35px; height: 35px; } .surface-title--quiz { font-size: 27px; } }
@media (max-width: 460px) { .practice-surface { padding: 18px; border-radius: 25px; } .practice-progress { width: 57px; padding-top: 8px; } .practice-progress__value { font-size: 13px; } .practice-top { gap: 10px; } .surface-title--quiz { font-size: 25px; } .surface-chip { font-size: 12px; padding-inline: 8px; } .quiz-card { padding: 18px; } .quiz-card legend { font-size: 21px; } .side-rail { grid-template-columns: minmax(0,1fr); } .quiz-feedback,.next-card { padding: 17px!important; } .quiz-feedback .result-row { margin-block: 10px; } .quiz-option { font-size: 14px; } .practice-label { font-size: 13px; } .cta-row .btn { white-space: normal; } }

/* Progress uses data attributes to comply with the production CSP. */
.practice-progress[data-completed="0"] .practice-progress__fill { width: 0%; }
.practice-progress[data-completed="1"] .practice-progress__fill { width: 33.333333%; }
.practice-progress[data-completed="2"] .practice-progress__fill { width: 66.666667%; }
.practice-progress[data-completed="3"] .practice-progress__fill { width: 100%; }
