.quizShell{background-color:var(--bg-base);flex-direction:column;min-height:100vh;display:flex}.quizHeader{z-index:100;background:var(--bg-light);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--bg-highlight);padding:var(--spacing-md)var(--spacing-lg);position:sticky;top:0}.quizHeaderContent{justify-content:space-between;align-items:center;max-width:64rem;margin:0 auto;display:flex}.quizLogo{align-items:center;gap:var(--spacing-sm);color:var(--text-primary);text-decoration:none;display:flex}.quizLogoIcon{background:linear-gradient(135deg,var(--color-primary)0%,var(--color-secondary)100%);border-radius:var(--radius-sm);color:#fff;justify-content:center;align-items:center;width:2rem;height:2rem;font-size:1rem;font-weight:700;display:flex}.quizLogoText{background:linear-gradient(135deg,var(--color-primary)0%,var(--color-secondary)100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:1.125rem;font-weight:700}.quizNav{align-items:center;gap:var(--spacing-md);display:flex}.quizNavLink{color:var(--text-secondary);padding:var(--spacing-xs)var(--spacing-sm);border-radius:var(--radius-sm);transition:color var(--duration-fast)ease,background-color var(--duration-fast)ease;font-size:.875rem;font-weight:500;text-decoration:none}.quizNavLink:hover{color:var(--text-primary);background-color:var(--bg-highlight)}.quizMain{padding:var(--spacing-lg);flex:1}.quizMainContent{max-width:48rem;margin:0 auto}.quizMobileNav{background:var(--bg-light);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--bg-highlight);padding:var(--spacing-sm)var(--spacing-md);z-index:100;display:none;position:fixed;bottom:0;left:0;right:0}.quizMobileNavContent{justify-content:space-around;align-items:center;display:flex}.quizMobileNavItem{color:var(--text-secondary);padding:var(--spacing-xs);transition:color var(--duration-fast)ease;flex-direction:column;align-items:center;gap:2px;font-size:.625rem;font-weight:500;text-decoration:none;display:flex}.quizMobileNavItem:hover,.quizMobileNavItemActive{color:var(--color-primary)}@media (max-width:48rem){.quizNav{display:none}.quizMobileNav{display:block}.quizMain{padding-bottom:5rem}.quizToneNextSteps{grid-template-columns:1fr}}.quizHomeContainer{padding:var(--spacing-xl)0;text-align:center}.quizEyebrow{margin-bottom:var(--spacing-xs);letter-spacing:.12em;text-transform:uppercase;color:var(--color-primary);font-size:.75rem;font-weight:700}.quizContentSection{text-align:left;background:var(--bg-light);border:1px solid var(--color-neutral-border);border-radius:var(--radius-lg);max-width:48rem;box-shadow:var(--shadow-sm);margin-top:3rem;margin-left:auto;margin-right:auto;padding:1.5rem}.quizContentTitle{color:var(--text-primary);margin-bottom:var(--spacing-md);font-size:1.25rem;font-weight:700}.quizContentText{color:var(--text-secondary);margin-bottom:var(--spacing-md);line-height:1.7}.quizContentList{margin:0 0 var(--spacing-md);color:var(--text-secondary);padding-left:1.25rem}.quizContentList li{margin-bottom:.75rem;line-height:1.6}.quizCallout{border-radius:var(--radius-md);color:var(--text-primary);background:#1139d714;background:lab(32.2413% 38.5698 -84.8478/.08);border:1px solid #1139d729;border:1px solid lab(32.2413% 38.5698 -84.8478/.16);padding:1rem 1.25rem;line-height:1.6}.quizToneNextSteps{gap:var(--spacing-md);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.quizToneNextStepCard{border-radius:var(--radius-md);background:var(--bg-base);border:1px solid var(--color-neutral-border);color:inherit;transition:transform var(--duration-normal)var(--ease-spring),border-color var(--duration-fast)ease,box-shadow var(--duration-fast)ease;flex-direction:column;gap:.5rem;padding:1.25rem;text-decoration:none;display:flex}.quizToneNextStepCard:hover{border-color:var(--color-primary);box-shadow:var(--shadow-md);transform:translateY(-2px)}.quizToneStepLabel{color:var(--text-primary);font-size:1rem;font-weight:700}.quizToneStepText{color:var(--text-secondary);font-size:.875rem;line-height:1.6}.quizSeoSection{padding:0 var(--spacing-md);text-align:left;border-top:1px solid var(--color-neutral-border);max-width:800px;margin-top:4rem;margin-left:auto;margin-right:auto;padding-top:3rem}.quizSeoTitle{color:var(--text-primary);margin-bottom:var(--spacing-md);margin-top:2.5rem;font-size:1.5rem;font-weight:700}.quizSeoTitle:first-child{margin-top:0}.quizSeoText{color:var(--text-secondary);margin-bottom:var(--spacing-lg);font-size:1rem;line-height:1.7}.quizSeoList{margin-bottom:var(--spacing-lg);color:var(--text-secondary);padding-left:1.5rem;list-style:outside}.quizSeoList li{margin-bottom:.75rem;line-height:1.6}.quizSeoList li strong{color:var(--text-primary)}.quizFaqItem{background:var(--bg-light);padding:var(--spacing-lg);border-radius:var(--radius-md);margin-bottom:1.5rem}.quizFaqQuestion{color:var(--text-primary);margin-bottom:.5rem;font-size:1.1rem;font-weight:600}.quizFaqAnswer{color:var(--text-secondary);font-size:1rem;line-height:1.6}.quizHomeHeader{text-align:center;margin-bottom:var(--spacing-xxl)}.quizHomeTitle{color:var(--text-primary);margin-bottom:var(--spacing-sm);font-size:clamp(1.75rem,5vw,2.5rem);font-weight:800}.quizHomeSubtitle{color:var(--text-secondary);font-size:1rem}.quizFormatGrid{justify-content:center;gap:var(--spacing-md);margin-bottom:var(--spacing-xl);flex-wrap:wrap;display:flex}.quizFormatCard{background:var(--bg-light);border-radius:var(--radius-md);max-width:300px;padding:var(--spacing-lg);cursor:pointer;transition:transform var(--duration-normal)var(--ease-spring),box-shadow var(--duration-normal)ease,border-color var(--duration-fast)ease;box-shadow:var(--shadow-sm);text-align:left;border:2px solid #0000;flex:240px;width:100%}.quizFormatCard:hover{box-shadow:var(--shadow-lg);border-color:var(--color-primary);transform:translateY(-4px)}.quizFormatCardSelected{border-color:var(--color-primary);background:#1139d714;background:lab(32.2413% 38.5698 -84.8478/.08)}.quizFormatCardDisabled{opacity:.5;cursor:not-allowed}.quizFormatCardDisabled:hover{box-shadow:var(--shadow-sm);border-color:#0000;transform:none}.quizFormatIcon{border-radius:var(--radius-md);width:3rem;height:3rem;margin-bottom:var(--spacing-md);justify-content:center;align-items:center;font-size:1.5rem;display:flex}.quizFormatIconListen{color:var(--color-primary);background:#1139d71a;background:lab(32.2413% 38.5698 -84.8478/.1)}.quizFormatIconTone{color:var(--color-tone-2);background:#189a3026;background:lab(55.7164% -50.7132 43.8697/.15)}.quizFormatIconPhonetic{color:var(--color-tone-3);background:#0083e326;background:lab(52.5446% -2.04957 -60.1708/.15)}.quizFormatIconMixed{color:var(--color-tone-4);background:#8843db26;background:lab(43.977% 52.1621 -67.7502/.15)}.quizFormatName{color:var(--text-primary);margin-bottom:var(--spacing-xs);font-size:1.125rem;font-weight:700}.quizFormatDescription{color:var(--text-secondary);margin-bottom:var(--spacing-md);font-size:.875rem;line-height:1.5}.quizFormatMeta{align-items:center;gap:var(--spacing-sm);color:var(--text-tertiary);font-size:.75rem;display:flex}.quizStartButton{width:100%;padding:var(--spacing-md)var(--spacing-xl);color:#fff;background:linear-gradient(135deg,var(--color-primary)0%,var(--color-secondary)100%);border-radius:var(--radius-full);cursor:pointer;transition:transform var(--duration-fast)var(--ease-spring),box-shadow var(--duration-fast)ease,opacity var(--duration-fast)ease;border:none;font-size:1rem;font-weight:600;box-shadow:0 4px 14px #1139d759;box-shadow:0 4px 14px lab(32.2413% 38.5698 -84.8478/.35)}.quizStartButton:hover:not(:disabled){transform:scale(1.02);box-shadow:0 6px 20px #1139d773;box-shadow:0 6px 20px lab(32.2413% 38.5698 -84.8478/.45)}.quizStartButton:active:not(:disabled){transform:scale(.98)}.quizStartButton:disabled{opacity:.5;cursor:not-allowed}.quizLoading{text-align:center;padding:var(--spacing-xxl)}.quizLoadingSpinner{border:3px solid var(--color-neutral-border);border-top-color:var(--color-primary);width:2.5rem;height:2.5rem;margin:0 auto var(--spacing-md);border-radius:50%;animation:.8s linear infinite quizSpin}@keyframes quizSpin{to{transform:rotate(360deg)}}.quizLoadingText{color:var(--text-secondary);font-size:.875rem}.quizHomeError{text-align:center;padding:var(--spacing-lg);background:var(--color-danger-bg);border:1px solid var(--color-danger-border);border-radius:var(--radius-md);color:var(--color-danger-text);margin-bottom:var(--spacing-lg)}.quizProgressContainer{align-items:center;gap:var(--spacing-md);width:100%;display:flex}.quizProgressBarContainer{background:var(--bg-highlight);border-radius:var(--radius-full);flex:1;height:12px;overflow:hidden}.quizProgressBar{background:linear-gradient(90deg,var(--color-primary)0%,var(--color-secondary)100%);border-radius:var(--radius-full);height:100%;transition:width var(--duration-normal)var(--ease-default)}.quizProgressRight{align-items:center;gap:var(--spacing-md);display:flex}.quizQuestionCounter{color:var(--text-secondary);font-variant-numeric:tabular-nums;font-size:1rem;font-weight:700}.quizPauseOverlay{background:var(--bg-base);z-index:100;opacity:.95;flex-direction:column;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.quizPauseTitle{color:var(--text-primary);margin-bottom:var(--spacing-md);font-size:1.5rem;font-weight:700}.quizPauseText{color:var(--text-secondary)}.quizPauseButton{cursor:pointer;margin-left:var(--spacing-md);padding:var(--spacing-xs);color:var(--text-secondary);transition:background-color var(--duration-fast)ease,color var(--duration-fast)ease;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;display:flex}.quizPauseButton:hover{background-color:var(--bg-highlight);color:var(--text-primary)}.quizPlayerContainer{min-height:100vh;padding:var(--spacing-lg);flex-direction:column;padding-top:0;display:flex;position:relative}.quizProgressSection{top:calc(4rem + 1px + var(--spacing-md));z-index:20;background:var(--bg-light);padding:var(--spacing-sm)var(--spacing-lg);border-radius:var(--radius-full);box-shadow:var(--shadow-sm);border:1px solid var(--color-neutral-border);max-width:48rem;margin:var(--spacing-md)auto var(--spacing-xl);box-sizing:border-box;align-items:center;width:100%;display:flex;position:sticky}.quizProgressWrapper{width:100%}.quizQuestionCard{width:100%;max-width:36rem;margin:var(--spacing-xl)auto;padding:var(--spacing-xxl)var(--spacing-xl);background:var(--bg-light);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);text-align:center;position:relative}.quizQuestionType{padding:var(--spacing-xs)var(--spacing-md);color:var(--color-primary);border-radius:var(--radius-full);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--spacing-lg);background:#1139d71a;background:lab(32.2413% 38.5698 -84.8478/.1);font-size:.75rem;font-weight:600;display:inline-block}.quizQuestionText{color:var(--text-primary);margin-bottom:var(--spacing-lg);font-size:1.5rem;font-weight:700;line-height:1.3}.quizAudioSection{align-items:center;gap:var(--spacing-md);flex-direction:column;display:flex}.quizAudioHint{color:var(--text-secondary);text-align:center;font-size:.875rem}.quizOptionsSection{gap:var(--spacing-sm);flex-direction:column;width:100%;max-width:36rem;margin:0 auto;display:flex}.quizFeedback{width:100%;max-width:36rem;margin:var(--spacing-md)auto 0;text-align:center;padding:var(--spacing-md);border-radius:var(--radius-md);animation:quizFadeIn var(--duration-fast)var(--ease-default);box-sizing:border-box;flex-direction:column;justify-content:center;min-height:4.5rem;display:flex}.quizFeedbackCorrect{background:var(--color-success-bg);border:1px solid var(--color-success-border)}.quizFeedbackIncorrect{background:var(--color-danger-bg);border:1px solid var(--color-danger-border)}.quizFeedbackTitle{justify-content:center;align-items:center;gap:var(--spacing-sm);font-size:1rem;font-weight:700;display:flex}.quizFeedbackCorrect .quizFeedbackTitle{color:var(--color-success-text)}.quizFeedbackIncorrect .quizFeedbackTitle{color:var(--color-danger-text)}.quizFeedbackText{color:var(--text-secondary);margin-top:var(--spacing-xs);font-size:.875rem;line-height:1.5}.quizFeedbackIcon{width:1.25rem;height:1.25rem}@keyframes quizFadeIn{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}@keyframes quizQuestionEnter{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(0)}}.quizQuestionAnimatedContent{animation:quizQuestionEnter var(--duration-normal)var(--ease-spring)forwards;flex-direction:column;width:100%;display:flex}.quizTimer{justify-content:center;align-items:center;display:flex}.quizOption{align-items:center;gap:var(--spacing-md);padding:var(--spacing-md)var(--spacing-lg);background:var(--bg-light);border-radius:var(--radius-lg);cursor:pointer;transition:border-color var(--duration-fast)ease,background-color var(--duration-fast)ease,transform var(--duration-fast)var(--ease-spring),box-shadow var(--duration-fast)ease;box-shadow:var(--shadow-sm);text-align:left;border:2px solid #0000;width:100%;min-height:56px;display:flex}.quizOption:hover:not(:disabled){border-color:var(--color-primary);box-shadow:var(--shadow-md);transform:translateY(-2px)}.quizOption:disabled{cursor:default}.quizOptionSelected{border-color:var(--color-primary);background:#1139d714;background:lab(32.2413% 38.5698 -84.8478/.08)}.quizOptionCorrect{border-color:var(--color-success);background:var(--color-success-bg)}.quizOptionIncorrect{border-color:var(--color-danger);background:var(--color-danger-bg)}.quizOptionShowCorrect{border-color:var(--color-success);background:var(--color-success-bg)}.quizLetterBadge{border-radius:var(--radius-md);width:2.5rem;height:2.5rem;transition:background-color var(--duration-fast)ease,color var(--duration-fast)ease,transform var(--duration-fast)var(--ease-spring);flex-shrink:0;justify-content:center;align-items:center;font-size:1rem;font-weight:700;display:flex}.quizOption:not(.quizOptionCorrect):not(.quizOptionIncorrect):not(.quizOptionShowCorrect) .quizLetterBadge{background:var(--bg-highlight);color:var(--text-secondary)}.quizOption:hover:not(:disabled):not(.quizOptionCorrect):not(.quizOptionIncorrect):not(.quizOptionShowCorrect) .quizLetterBadge{background:var(--color-primary);color:#fff;transform:scale(1.05)}.quizOptionSelected .quizLetterBadge{background:var(--color-primary);color:#fff}.quizOptionCorrect .quizLetterBadge{background:var(--color-success);color:#fff}.quizOptionIncorrect .quizLetterBadge{background:var(--color-danger);color:#fff}.quizOptionShowCorrect .quizLetterBadge{background:var(--color-success);color:#fff}.quizOptionContent{align-items:center;gap:var(--spacing-sm);flex:1;min-width:0;display:flex}.quizPinyinText{color:var(--text-primary);font-size:1.125rem;font-weight:600;line-height:1.4}.quizLetterLabel{color:var(--text-tertiary);font-size:.875rem;font-weight:500}.quizResultIcon{animation:quizPopIn var(--duration-fast)var(--ease-spring);flex-shrink:0;justify-content:center;align-items:center;font-size:1.25rem;display:flex}.quizResultIconCorrect{color:var(--color-success)}.quizResultIconIncorrect{color:var(--color-danger)}@keyframes quizPopIn{0%{opacity:0;transform:scale(0)}50%{transform:scale(1.2)}to{opacity:1;transform:scale(1)}}.quizAudioButton{background:linear-gradient(135deg,var(--color-primary)0%,var(--color-secondary)100%);color:#fff;cursor:pointer;width:5rem;height:5rem;transition:transform var(--duration-fast)var(--ease-spring),box-shadow var(--duration-fast)ease;border:none;border-radius:50%;justify-content:center;align-items:center;display:flex;position:relative;box-shadow:0 4px 14px #1139d759;box-shadow:0 4px 14px lab(32.2413% 38.5698 -84.8478/.35)}.quizAudioButton:hover:not(:disabled){transform:scale(1.08);box-shadow:0 6px 20px #1139d773;box-shadow:0 6px 20px lab(32.2413% 38.5698 -84.8478/.45)}.quizAudioButton:active:not(:disabled){transform:scale(.95)}.quizAudioButton:disabled{opacity:.5;cursor:not-allowed}.quizAudioIcon{width:2.5rem;height:2.5rem;transition:transform var(--duration-fast)ease}.quizAudioButtonPlaying .quizAudioIcon{animation:1s ease-in-out infinite quizPulse}@keyframes quizPulse{0%,to{transform:scale(1)}50%{transform:scale(1.15)}}.quizAudioRing{border:2px solid var(--color-primary);opacity:0;border-radius:50%;position:absolute;inset:-4px;transform:scale(.8)}.quizAudioButtonPlaying .quizAudioRing{animation:1.2s ease-out infinite quizRipple}@keyframes quizRipple{0%{opacity:.6;transform:scale(.8)}to{opacity:0;transform:scale(1.4)}}.quizAudioTooltip{bottom:calc(100% + var(--spacing-sm));background:var(--text-primary);color:var(--bg-light);padding:var(--spacing-xs)var(--spacing-sm);border-radius:var(--radius-sm);white-space:nowrap;opacity:0;pointer-events:none;transition:opacity var(--duration-fast)ease;font-size:.75rem;font-weight:500;position:absolute;left:50%;transform:translate(-50%)}.quizAudioButton:hover .quizAudioTooltip{opacity:1}.quizTimerContainer{justify-content:center;align-items:center;width:48px;height:48px;display:flex;position:relative}.quizTimerSvg{width:100%;height:100%;position:absolute}.quizTimerBgCircle{fill:none;stroke:var(--color-neutral-border);stroke-width:6px}.quizTimerProgressCircle{fill:none;stroke:var(--color-primary);stroke-width:6px;stroke-linecap:round;transition:stroke-dashoffset 1s linear,stroke .3s}.quizTimerProgressCircleWarning{stroke:var(--color-warning)}.quizTimerProgressCircleUrgent{stroke:var(--color-danger)}.quizTimerTimeText{z-index:1;font-variant-numeric:tabular-nums;color:var(--text-primary);font-size:1rem;font-weight:700;transition:color .3s;position:relative}.quizTimerTimeTextWarning{color:var(--color-warning-text)}.quizTimerTimeTextUrgent{color:var(--color-danger-text);animation:.5s ease-in-out infinite quizTimerPulse}@keyframes quizTimerPulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.quizResultsContainer{padding:var(--spacing-xl)0;text-align:center}.quizResultsHeader{margin-bottom:var(--spacing-xl)}.quizResultsTitle{color:var(--text-primary);margin-bottom:var(--spacing-xs);font-size:clamp(1.5rem,5vw,2rem);font-weight:800}.quizResultsSubtitle{color:var(--text-secondary);font-size:1rem}.quizScoreCard{background:var(--bg-light);border-radius:var(--radius-lg);padding:var(--spacing-xl);margin-bottom:var(--spacing-xl);box-shadow:var(--shadow-md)}.quizScoreCircle{width:10rem;height:10rem;margin:0 auto var(--spacing-lg);border-radius:50%;flex-direction:column;justify-content:center;align-items:center;display:flex;position:relative}.quizScoreCircle:before{content:"";background:conic-gradient(from 0deg,var(--color-primary)calc(var(--progress)*1%),var(--color-neutral-border)calc(var(--progress)*1%));-webkit-mask-composite:xor;border-radius:50%;padding:4px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.quizScoreValue{color:var(--text-primary);font-size:2.5rem;font-weight:800;line-height:1}.quizScoreLabel{color:var(--text-secondary);margin-top:var(--spacing-xs);font-size:.875rem}.quizStatsGrid{gap:var(--spacing-md);margin-bottom:var(--spacing-xl);grid-template-columns:repeat(2,1fr);display:grid}.quizStatItem{background:var(--bg-highlight);border-radius:var(--radius-md);padding:var(--spacing-md);text-align:center}.quizStatValue{color:var(--text-primary);margin-bottom:var(--spacing-xs);font-size:1.5rem;font-weight:700}.quizStatValueCorrect{color:var(--color-success)}.quizStatValueIncorrect{color:var(--color-danger)}.quizStatLabel{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;font-size:.75rem}.quizXpSection{background:linear-gradient(135deg,var(--color-primary)0%,var(--color-secondary)100%);border-radius:var(--radius-md);padding:var(--spacing-lg);margin-bottom:var(--spacing-xl);color:#fff}.quizXpLabel{opacity:.9;margin-bottom:var(--spacing-xs);font-size:.875rem}.quizXpValue{font-size:2rem;font-weight:800}.quizXpSuffix{opacity:.8;margin-left:var(--spacing-xs);font-size:.875rem}.quizActions{gap:var(--spacing-md);flex-direction:column;display:flex}.quizActionButton{padding:var(--spacing-md)var(--spacing-xl);border-radius:var(--radius-full);cursor:pointer;transition:transform var(--duration-fast)var(--ease-spring),box-shadow var(--duration-fast)ease;justify-content:center;align-items:center;gap:var(--spacing-sm);border:none;font-size:1rem;font-weight:600;display:inline-flex}.quizActionButton:disabled{opacity:.5;cursor:not-allowed}.quizActionButtonPrimary{background:linear-gradient(135deg,var(--color-primary)0%,var(--color-secondary)100%);color:#fff;box-shadow:0 4px 14px #1139d759;box-shadow:0 4px 14px lab(32.2413% 38.5698 -84.8478/.35)}.quizActionButtonPrimary:hover:not(:disabled){transform:scale(1.02);box-shadow:0 6px 20px #1139d773;box-shadow:0 6px 20px lab(32.2413% 38.5698 -84.8478/.45)}.quizActionButtonSecondary{background:var(--bg-light);color:var(--text-primary);border:2px solid var(--color-neutral-border)}.quizActionButtonSecondary:hover:not(:disabled){border-color:var(--color-primary);background:#1139d70d;background:lab(32.2413% 38.5698 -84.8478/.05)}