.exam-root{--exam-color-primary:#2563eb;--exam-color-primary-dark:#1d4ed8;--exam-color-primary-light:#3b82f6;--exam-color-primary-subtle:#eff6ff;--exam-color-accent:#f59e0b;--exam-color-accent-dark:#d97706;--exam-color-accent-subtle:#fffbeb;--exam-color-success:#10b981;--exam-color-success-subtle:#ecfdf5;--exam-color-error:#ef4444;--exam-color-error-subtle:#fef2f2;--exam-color-warning:#f59e0b;--exam-color-white:#fff;--exam-color-gray-50:#f9fafb;--exam-color-gray-100:#f3f4f6;--exam-color-gray-200:#e5e7eb;--exam-color-gray-300:#d1d5db;--exam-color-gray-400:#9ca3af;--exam-color-gray-500:#6b7280;--exam-color-gray-600:#4b5563;--exam-color-gray-700:#374151;--exam-color-gray-800:#1f2937;--exam-color-gray-900:#111827;--exam-color-listening:#8b5cf6;--exam-color-reading:#10b981;--exam-color-writing:#f59e0b;--exam-color-speaking:#ef4444;--exam-font-sans:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--exam-font-mono:"JetBrains Mono", "Fira Code", monospace;--exam-text-xs:.75rem;--exam-text-sm:.875rem;--exam-text-base:1rem;--exam-text-lg:1.125rem;--exam-text-xl:1.25rem;--exam-text-2xl:1.5rem;--exam-text-3xl:1.875rem;--exam-text-4xl:2.25rem;--exam-font-normal:400;--exam-font-medium:500;--exam-font-semibold:600;--exam-font-bold:700;--exam-space-1:.25rem;--exam-space-2:.5rem;--exam-space-3:.75rem;--exam-space-4:1rem;--exam-space-5:1.25rem;--exam-space-6:1.5rem;--exam-space-8:2rem;--exam-space-10:2.5rem;--exam-space-12:3rem;--exam-space-16:4rem;--exam-radius-sm:.375rem;--exam-radius-md:.5rem;--exam-radius-lg:.75rem;--exam-radius-xl:1rem;--exam-radius-2xl:1.5rem;--exam-radius-full:9999px;--exam-shadow-sm:0 1px 2px 0 #0000000d;--exam-shadow-md:0 4px 6px -1px #0000001a, 0 2px 4px -1px #0000000f;--exam-shadow-lg:0 10px 15px -3px #0000001a, 0 4px 6px -2px #0000000d;--exam-shadow-xl:0 20px 25px -5px #0000001a, 0 10px 10px -5px #0000000a;--exam-transition-fast:.15s ease;--exam-transition-base:.2s ease;--exam-transition-slow:.3s ease}.dark .exam-root{--exam-color-white:#111827;--exam-color-gray-50:#1f2937;--exam-color-gray-100:#374151;--exam-color-gray-200:#4b5563;--exam-color-gray-300:#6b7280;--exam-color-gray-400:#9ca3af;--exam-color-gray-500:#d1d5db;--exam-color-gray-600:#e5e7eb;--exam-color-gray-700:#f3f4f6;--exam-color-gray-800:#f9fafb;--exam-color-gray-900:#fff;--exam-color-primary-subtle:#2563eb26}.exam-container{max-width:1200px;padding:0 var(--exam-space-6);margin:0 auto}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.btn{justify-content:center;align-items:center;gap:var(--exam-space-2);padding:var(--exam-space-3) var(--exam-space-6);font-family:var(--exam-font-sans);font-size:var(--exam-text-base);font-weight:var(--exam-font-semibold);border-radius:var(--exam-radius-lg);cursor:pointer;transition:all var(--exam-transition-base);white-space:nowrap;border:2px solid #0000;line-height:1.5;text-decoration:none;display:inline-flex}.btn:disabled{opacity:.5;cursor:not-allowed}.btn--primary{background-color:var(--exam-color-primary);color:var(--exam-color-white);border-color:var(--exam-color-primary)}.btn--primary:hover:not(:disabled){background-color:var(--exam-color-primary-dark);border-color:var(--exam-color-primary-dark);box-shadow:var(--exam-shadow-md);transform:translateY(-1px)}.btn--secondary{background-color:var(--exam-color-white);color:var(--exam-color-primary);border-color:var(--exam-color-primary)}.btn--secondary:hover:not(:disabled){background-color:var(--exam-color-primary-subtle)}.btn--accent{background-color:var(--exam-color-accent);color:var(--exam-color-white);border-color:var(--exam-color-accent)}.btn--accent:hover:not(:disabled){background-color:var(--exam-color-accent-dark)}.btn--ghost{color:var(--exam-color-gray-600);border-color:var(--exam-color-gray-300);background-color:#0000}.btn--ghost:hover:not(:disabled){background-color:var(--exam-color-gray-100);color:var(--exam-color-gray-900)}.btn--danger{background-color:var(--exam-color-error);color:var(--exam-color-white);border-color:var(--exam-color-error)}.btn--sm{padding:var(--exam-space-2) var(--exam-space-4);font-size:var(--exam-text-sm)}.btn--lg{padding:var(--exam-space-4) var(--exam-space-8);font-size:var(--exam-text-lg)}.btn--full{width:100%}.btn__icon{flex-shrink:0;width:1.25em;height:1.25em}.card{background-color:var(--exam-color-white);border-radius:var(--exam-radius-xl);box-shadow:var(--exam-shadow-sm);border:1px solid var(--exam-color-gray-200);transition:box-shadow var(--exam-transition-base);overflow:hidden}.card:hover{box-shadow:var(--exam-shadow-md)}.card__header{padding:var(--exam-space-6);border-bottom:1px solid var(--exam-color-gray-100)}.card__body{padding:var(--exam-space-6)}.card__footer{padding:var(--exam-space-6);border-top:1px solid var(--exam-color-gray-100);background-color:var(--exam-color-gray-50)}.card--elevated{box-shadow:var(--exam-shadow-lg)}.card--interactive{cursor:pointer;transition:all var(--exam-transition-base)}.card--interactive:hover{box-shadow:var(--exam-shadow-xl);border-color:var(--exam-color-primary-light);transform:translateY(-2px)}.progress-bar{background-color:var(--exam-color-gray-200);border-radius:var(--exam-radius-full);width:100%;height:8px;overflow:hidden}.progress-bar__fill{background:linear-gradient(90deg, var(--exam-color-primary), var(--exam-color-primary-light));border-radius:var(--exam-radius-full);height:100%;transition:width var(--exam-transition-slow);position:relative}.progress-bar__fill:after{content:"";background:linear-gradient(90deg,#0000,#ffffff4d);width:20px;position:absolute;top:0;bottom:0;right:0}.progress-steps,.progress-step{align-items:center;gap:var(--exam-space-2);display:flex}.progress-step__dot{border-radius:var(--exam-radius-full);width:32px;height:32px;font-size:var(--exam-text-sm);font-weight:var(--exam-font-bold);background-color:var(--exam-color-gray-200);color:var(--exam-color-gray-500);transition:all var(--exam-transition-base);justify-content:center;align-items:center;display:flex}.progress-step--completed .progress-step__dot{background-color:var(--exam-color-success);color:var(--exam-color-white)}.progress-step--active .progress-step__dot{background-color:var(--exam-color-primary);color:var(--exam-color-white);box-shadow:0 0 0 4px var(--exam-color-primary-subtle)}.progress-step__label{font-size:var(--exam-text-sm);font-weight:var(--exam-font-medium);color:var(--exam-color-gray-500)}.progress-step--active .progress-step__label{color:var(--exam-color-primary);font-weight:var(--exam-font-semibold)}.progress-step__connector{background-color:var(--exam-color-gray-200);border-radius:var(--exam-radius-full);width:40px;height:2px}.progress-step--completed+.progress-step__connector,.progress-step__connector--completed{background-color:var(--exam-color-success)}.timer{align-items:center;gap:var(--exam-space-2);padding:var(--exam-space-2) var(--exam-space-4);background-color:var(--exam-color-gray-100);border-radius:var(--exam-radius-lg);font-family:var(--exam-font-mono);font-size:var(--exam-text-lg);font-weight:var(--exam-font-bold);color:var(--exam-color-gray-700);display:inline-flex}.timer--warning{background-color:var(--exam-color-accent-subtle);color:var(--exam-color-accent-dark);animation:1s infinite pulse-warning}.timer--danger{background-color:var(--exam-color-error-subtle);color:var(--exam-color-error);animation:.5s infinite pulse-danger}@keyframes pulse-warning{0%,to{opacity:1}50%{opacity:.7}}@keyframes pulse-danger{0%,to{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.05)}}.timer__icon{width:20px;height:20px}.question-card{background-color:var(--exam-color-white);border-radius:var(--exam-radius-xl);padding:var(--exam-space-8);box-shadow:var(--exam-shadow-md);border:1px solid var(--exam-color-gray-200)}.question-card__number{align-items:center;gap:var(--exam-space-2);padding:var(--exam-space-2) var(--exam-space-4);background-color:var(--exam-color-primary-subtle);color:var(--exam-color-primary);border-radius:var(--exam-radius-full);font-size:var(--exam-text-sm);font-weight:var(--exam-font-semibold);margin-bottom:var(--exam-space-6);display:inline-flex}.question-card__text{font-size:var(--exam-text-xl);font-weight:var(--exam-font-semibold);color:var(--exam-color-gray-900);margin-bottom:var(--exam-space-8);line-height:1.5}.question-card__media{margin-bottom:var(--exam-space-8);border-radius:var(--exam-radius-lg);overflow:hidden}.question-card__media img,.question-card__media audio{width:100%;display:block}.options-list{gap:var(--exam-space-3);flex-direction:column;display:flex}.option{align-items:flex-start;gap:var(--exam-space-4);padding:var(--exam-space-5);background-color:var(--exam-color-gray-50);border:2px solid var(--exam-color-gray-200);border-radius:var(--exam-radius-lg);cursor:pointer;transition:all var(--exam-transition-base);display:flex}.option:hover{border-color:var(--exam-color-primary-light);background-color:var(--exam-color-primary-subtle)}.option--selected{border-color:var(--exam-color-primary);background-color:var(--exam-color-primary-subtle)}.option--correct{border-color:var(--exam-color-success);background-color:var(--exam-color-success-subtle)}.option--incorrect{border-color:var(--exam-color-error);background-color:var(--exam-color-error-subtle)}.option__marker{border-radius:var(--exam-radius-full);border:2px solid var(--exam-color-gray-300);width:28px;height:28px;font-size:var(--exam-text-sm);font-weight:var(--exam-font-bold);color:var(--exam-color-gray-500);transition:all var(--exam-transition-base);flex-shrink:0;justify-content:center;align-items:center;display:flex}.option:hover .option__marker{border-color:var(--exam-color-primary);color:var(--exam-color-primary)}.option--selected .option__marker{background-color:var(--exam-color-primary);border-color:var(--exam-color-primary);color:var(--exam-color-white)}.option--correct .option__marker{background-color:var(--exam-color-success);border-color:var(--exam-color-success);color:var(--exam-color-white)}.option--incorrect .option__marker{background-color:var(--exam-color-error);border-color:var(--exam-color-error);color:var(--exam-color-white)}.option__text{font-size:var(--exam-text-base);color:var(--exam-color-gray-700);padding-top:2px;line-height:1.5}.option--selected .option__text{color:var(--exam-color-primary-dark);font-weight:var(--exam-font-medium)}.exam-header{z-index:100;background-color:var(--exam-color-white);border-bottom:1px solid var(--exam-color-gray-200);box-shadow:var(--exam-shadow-sm);position:sticky;top:0}.exam-header__container{padding:var(--exam-space-4) var(--exam-space-6);justify-content:space-between;align-items:center;max-width:1200px;margin:0 auto;display:flex}.exam-header__brand{align-items:center;gap:var(--exam-space-3);display:flex}.exam-header__logo{background:linear-gradient(135deg, var(--exam-color-primary), var(--exam-color-primary-light));border-radius:var(--exam-radius-lg);width:40px;height:40px;color:var(--exam-color-white);font-weight:var(--exam-font-bold);font-size:var(--exam-text-lg);justify-content:center;align-items:center;display:flex}.exam-header__title{font-size:var(--exam-text-lg);font-weight:var(--exam-font-bold);color:var(--exam-color-gray-900)}.exam-header__meta{align-items:center;gap:var(--exam-space-6);display:flex}.exam-header__section-badge{align-items:center;gap:var(--exam-space-2);padding:var(--exam-space-2) var(--exam-space-4);border-radius:var(--exam-radius-full);font-size:var(--exam-text-sm);font-weight:var(--exam-font-semibold);display:flex}.exam-header__section-badge--listening{color:var(--exam-color-listening);background-color:#8b5cf61a}.exam-header__section-badge--reading{color:var(--exam-color-reading);background-color:#10b9811a}.exam-header__section-badge--writing{color:var(--exam-color-writing);background-color:#f59e0b1a}.exam-header__section-badge--speaking{color:var(--exam-color-speaking);background-color:#ef44441a}.question-nav{gap:var(--exam-space-2);grid-template-columns:repeat(auto-fill,minmax(44px,1fr));max-width:400px;display:grid}.question-nav__item{border-radius:var(--exam-radius-md);border:2px solid var(--exam-color-gray-200);background-color:var(--exam-color-white);width:44px;height:44px;font-size:var(--exam-text-sm);font-weight:var(--exam-font-semibold);color:var(--exam-color-gray-600);cursor:pointer;transition:all var(--exam-transition-base);justify-content:center;align-items:center;display:flex}.question-nav__item:hover{border-color:var(--exam-color-primary);color:var(--exam-color-primary)}.question-nav__item--current{border-color:var(--exam-color-primary);background-color:var(--exam-color-primary);color:var(--exam-color-white);box-shadow:0 0 0 3px var(--exam-color-primary-subtle)}.question-nav__item--answered{border-color:var(--exam-color-success);background-color:var(--exam-color-success-subtle);color:var(--exam-color-success)}.question-nav__item--flagged{border-color:var(--exam-color-accent);background-color:var(--exam-color-accent-subtle);color:var(--exam-color-accent-dark)}.question-nav__item--flagged:after{content:"";background-color:var(--exam-color-accent);border-radius:var(--exam-radius-full);width:8px;height:8px;position:absolute;top:2px;right:2px}.exam-layout{gap:var(--exam-space-8);max-width:1200px;padding:var(--exam-space-8) var(--exam-space-6);grid-template-columns:1fr 320px;margin:0 auto;display:grid}.exam-layout__main{min-width:0}.exam-layout__sidebar{top:calc(73px + var(--exam-space-8));height:fit-content;position:sticky}@media (max-width:968px){.exam-layout{grid-template-columns:1fr}.exam-layout__sidebar{order:-1;position:static}}.exam-start{min-height:100vh;padding:var(--exam-space-8);background:linear-gradient(135deg, var(--exam-color-primary-subtle) 0%, var(--exam-color-gray-50) 100%);justify-content:center;align-items:center;display:flex}.exam-start__card{text-align:center;width:100%;max-width:640px}.exam-start__icon{width:80px;height:80px;margin:0 auto var(--exam-space-6);background:linear-gradient(135deg, var(--exam-color-primary), var(--exam-color-primary-light));border-radius:var(--exam-radius-2xl);color:var(--exam-color-white);justify-content:center;align-items:center;display:flex}.exam-start__title{font-size:var(--exam-text-3xl);font-weight:var(--exam-font-bold);color:var(--exam-color-gray-900);margin-bottom:var(--exam-space-4)}.exam-start__subtitle{font-size:var(--exam-text-lg);color:var(--exam-color-gray-600);margin-bottom:var(--exam-space-8)}.exam-start__info-grid{gap:var(--exam-space-4);margin-bottom:var(--exam-space-8);grid-template-columns:repeat(3,1fr);display:grid}.exam-start__info-item{padding:var(--exam-space-5);background-color:var(--exam-color-gray-50);border-radius:var(--exam-radius-lg);border:1px solid var(--exam-color-gray-200)}.exam-start__info-value{font-size:var(--exam-text-2xl);font-weight:var(--exam-font-bold);color:var(--exam-color-primary);margin-bottom:var(--exam-space-1)}.exam-start__info-label{font-size:var(--exam-text-sm);color:var(--exam-color-gray-500)}.exam-start__rules{text-align:left;background-color:var(--exam-color-gray-50);border-radius:var(--exam-radius-lg);padding:var(--exam-space-6);margin-bottom:var(--exam-space-8)}.exam-start__rules-title{font-size:var(--exam-text-lg);font-weight:var(--exam-font-semibold);color:var(--exam-color-gray-900);margin-bottom:var(--exam-space-4);align-items:center;gap:var(--exam-space-2);display:flex}.exam-start__rules-list{gap:var(--exam-space-3);flex-direction:column;list-style:none;display:flex}.exam-start__rules-list li{align-items:flex-start;gap:var(--exam-space-3);font-size:var(--exam-text-sm);color:var(--exam-color-gray-600);display:flex}.exam-start__rules-list li:before{content:"✓";background-color:var(--exam-color-success);width:20px;height:20px;color:var(--exam-color-white);border-radius:var(--exam-radius-full);font-size:var(--exam-text-xs);flex-shrink:0;justify-content:center;align-items:center;margin-top:1px;display:flex}.exam-results{min-height:100vh;padding:var(--exam-space-8) var(--exam-space-6);background-color:var(--exam-color-gray-50)}.exam-results__header{text-align:center;margin-bottom:var(--exam-space-10)}.exam-results__badge{align-items:center;gap:var(--exam-space-2);padding:var(--exam-space-2) var(--exam-space-4);background-color:var(--exam-color-success-subtle);color:var(--exam-color-success);border-radius:var(--exam-radius-full);font-size:var(--exam-text-sm);font-weight:var(--exam-font-semibold);margin-bottom:var(--exam-space-4);display:inline-flex}.exam-results__title{font-size:var(--exam-text-4xl);font-weight:var(--exam-font-bold);color:var(--exam-color-gray-900);margin-bottom:var(--exam-space-4)}.exam-results__subtitle{font-size:var(--exam-text-lg);color:var(--exam-color-gray-600)}.score-card{background:linear-gradient(135deg, var(--exam-color-primary), var(--exam-color-primary-dark));border-radius:var(--exam-radius-2xl);padding:var(--exam-space-10);color:var(--exam-color-white);text-align:center;margin-bottom:var(--exam-space-8)}.score-card__label{font-size:var(--exam-text-sm);font-weight:var(--exam-font-medium);opacity:.9;text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--exam-space-2)}.score-card__value{font-size:var(--exam-text-4xl);font-weight:var(--exam-font-bold);margin-bottom:var(--exam-space-2)}.score-card__band{padding:var(--exam-space-2) var(--exam-space-6);border-radius:var(--exam-radius-full);font-size:var(--exam-text-xl);font-weight:var(--exam-font-bold);background-color:#fff3;display:inline-block}.score-breakdown{gap:var(--exam-space-4);margin-bottom:var(--exam-space-8);grid-template-columns:repeat(4,1fr);display:grid}.score-breakdown__item{background-color:var(--exam-color-white);border-radius:var(--exam-radius-xl);padding:var(--exam-space-6);text-align:center;border:1px solid var(--exam-color-gray-200)}.score-breakdown__icon{border-radius:var(--exam-radius-xl);width:48px;height:48px;margin:0 auto var(--exam-space-3);font-size:var(--exam-text-xl);justify-content:center;align-items:center;display:flex}.score-breakdown__icon--listening{color:var(--exam-color-listening);background-color:#8b5cf61a}.score-breakdown__icon--reading{color:var(--exam-color-reading);background-color:#10b9811a}.score-breakdown__icon--writing{color:var(--exam-color-writing);background-color:#f59e0b1a}.score-breakdown__icon--speaking{color:var(--exam-color-speaking);background-color:#ef44441a}.score-breakdown__label{font-size:var(--exam-text-sm);font-weight:var(--exam-font-medium);color:var(--exam-color-gray-500);margin-bottom:var(--exam-space-1)}.score-breakdown__score{font-size:var(--exam-text-2xl);font-weight:var(--exam-font-bold);color:var(--exam-color-gray-900)}@media (max-width:768px){.exam-start__info-grid{grid-template-columns:1fr}.score-breakdown{grid-template-columns:repeat(2,1fr)}.question-card{padding:var(--exam-space-5)}.exam-header__container{gap:var(--exam-space-3);flex-wrap:wrap}.exam-header__meta{justify-content:space-between;width:100%}}@media (max-width:480px){.score-breakdown{grid-template-columns:1fr}.btn--lg{padding:var(--exam-space-3) var(--exam-space-6);font-size:var(--exam-text-base)}}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes slideIn{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}.animate-fade-in{animation:.3s ease-out fadeIn}.animate-slide-in{animation:.3s ease-out slideIn}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--exam-color-gray-100);border-radius:var(--exam-radius-full)}::-webkit-scrollbar-thumb{background:var(--exam-color-gray-300);border-radius:var(--exam-radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--exam-color-gray-400)}