@import"https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700;800;900&display=swap";:root{--primary-400: #6366F1;--primary-500: #4F46E5;--primary-600: #4338CA;--primary-700: #3730A3;--primary-gradient: linear-gradient(135deg, #4F46E5 0%, #7C3AED 100%);--accent-yellow: #F59E0B;--accent-orange: #F97316;--accent-pink: #EC4899;--accent-cyan: #06B6D4;--accent-green: #10B981;--coin-bg: #FAEEDA;--coin-fg: #854F0B;--gem-bg: #E6F1FB;--gem-fg: #185FA5;--streak-bg: #FCEBEB;--streak-fg: #A32D2D;--cat-test: #185FA5;--cat-test-bg: #E6F1FB;--cat-challenge: #993556;--cat-challenge-bg: #FBEAF0;--cat-vocab: #BA7517;--cat-vocab-bg: #FAEEDA;--cat-speaking: #0F6E56;--cat-speaking-bg: #E1F5EE;--success: #10B981;--success-light: #D1FAE5;--error: #EF4444;--error-light: #FEE2E2;--warning: #F59E0B;--warning-light: #FEF3C7;--white: #FFFFFF;--gray-50: #F9FAFB;--gray-100: #F3F4F6;--gray-200: #E5E7EB;--gray-300: #D1D5DB;--gray-400: #9CA3AF;--gray-500: #6B7280;--gray-600: #4B5563;--gray-700: #374151;--gray-800: #1F2937;--gray-900: #111827;--bg-main: linear-gradient(180deg, #FAF9F7 0%, #F0EEFF 100%);--bg-card: rgba(255, 255, 255, .92);--bg-card-hover: rgba(255, 255, 255, .98);--bg-glass: rgba(255, 255, 255, .15);--shadow-sm: 0 1px 3px rgba(0, 0, 0, .08);--shadow-md: 0 4px 14px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 30px rgba(0, 0, 0, .15);--shadow-xl: 0 20px 50px rgba(0, 0, 0, .2);--shadow-glow-primary: 0 0 20px rgba(79, 70, 229, .4);--shadow-glow-accent: 0 0 20px rgba(245, 158, 11, .4);--shadow-card-playful: 0 4px 0 rgba(83, 74, 183, .15);--shadow-card-hover: 0 8px 0 rgba(83, 74, 183, .2);--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 24px;--radius-full: 9999px;--font-family: "Nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-xs: .75rem;--font-sm: .875rem;--font-base: 1rem;--font-lg: 1.125rem;--font-xl: 1.25rem;--font-2xl: 1.5rem;--font-3xl: 1.875rem;--font-4xl: 2.25rem;--font-5xl: 3rem;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--space-16: 4rem;--transition-fast: .15s ease;--transition-normal: .25s ease;--transition-slow: .4s cubic-bezier(.4, 0, .2, 1);--transition-bounce: .5s cubic-bezier(.68, -.55, .265, 1.55)}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html{font-size:16px;scroll-behavior:smooth;-webkit-font-smoothing:antialiased}body{font-family:var(--font-family);color:var(--gray-800);line-height:1.6;min-height:100vh;background:var(--bg-main);background-attachment:fixed;overflow-x:hidden}#root{min-height:100vh;display:flex;flex-direction:column}img{max-width:100%;display:block}button{font-family:inherit;cursor:pointer;border:none;outline:none}input,textarea{font-family:inherit;border:none;outline:none}a{text-decoration:none;color:inherit}.container{width:100%;max-width:1000px;margin:0 auto;padding:0 var(--space-4)}.glass-card{background:var(--bg-card);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:var(--radius-lg);border:1px solid rgba(255,255,255,.3);box-shadow:var(--shadow-lg)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-3) var(--space-6);border-radius:var(--radius-full);font-weight:700;font-size:var(--font-base);transition:all var(--transition-normal);position:relative;overflow:hidden}.btn-primary{background:var(--primary-gradient);color:var(--white);box-shadow:var(--shadow-glow-primary)}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 0 30px #4f46e599}.btn-primary:active{transform:translateY(0)}.btn-accent{background:linear-gradient(135deg,var(--accent-yellow) 0%,var(--accent-orange) 100%);color:var(--white);box-shadow:var(--shadow-glow-accent)}.btn-accent:hover{transform:translateY(-2px);box-shadow:0 0 30px #f59e0b99}.btn-lg{padding:var(--space-4) var(--space-8);font-size:var(--font-xl)}.btn-sm{padding:var(--space-2) var(--space-4);font-size:var(--font-sm)}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes pulse-glow{0%,to{box-shadow:0 0 5px #4f46e54d}50%{box-shadow:0 0 25px #4f46e599}}@keyframes bounce-in{0%{transform:scale(.3);opacity:0}50%{transform:scale(1.05)}70%{transform:scale(.9)}to{transform:scale(1);opacity:1}}@keyframes slide-up{0%{transform:translateY(30px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes star-pop{0%{transform:scale(0) rotate(0);opacity:0}50%{transform:scale(1.3) rotate(180deg);opacity:1}to{transform:scale(1) rotate(360deg);opacity:1}}@keyframes confetti-fall{0%{transform:translateY(-100%) rotate(0);opacity:1}to{transform:translateY(100vh) rotate(720deg);opacity:0}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes wiggle{0%,to{transform:rotate(0)}25%{transform:rotate(-3deg)}75%{transform:rotate(3deg)}}.animate-float{animation:float 3s ease-in-out infinite}.animate-bounce-in{animation:bounce-in .6s ease both}.animate-slide-up{animation:slide-up .5s ease both}.animate-star{animation:star-pop .5s ease both}.animate-wiggle{animation:wiggle .5s ease}.stagger-children>*:nth-child(1){animation-delay:.05s}.stagger-children>*:nth-child(2){animation-delay:.1s}.stagger-children>*:nth-child(3){animation-delay:.15s}.stagger-children>*:nth-child(4){animation-delay:.2s}.stagger-children>*:nth-child(5){animation-delay:.25s}.stagger-children>*:nth-child(6){animation-delay:.3s}.stagger-children>*:nth-child(7){animation-delay:.35s}.stagger-children>*:nth-child(8){animation-delay:.4s}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#ffffff4d;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#ffffff80}@media(max-width:768px){html{font-size:14px}.container{padding:0 var(--space-3)}}@media(max-width:480px){html{font-size:13px}}.app-layout{min-height:100vh;position:relative}.app-layout:before,.app-layout:after{content:"";position:fixed;border-radius:50%;z-index:0;pointer-events:none}.app-layout:before{width:300px;height:300px;background:radial-gradient(circle,rgba(245,158,11,.15) 0%,transparent 70%);top:-100px;right:-100px;animation:float 6s ease-in-out infinite}.app-layout:after{width:400px;height:400px;background:radial-gradient(circle,rgba(236,72,153,.12) 0%,transparent 70%);bottom:-150px;left:-150px;animation:float 8s ease-in-out infinite reverse}.home-page{padding:var(--space-8) 0;position:relative;z-index:1}.game-dashboard{display:flex;flex-direction:column;gap:var(--space-5);margin-bottom:var(--space-8)}.dashboard-hero{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:var(--space-6);align-items:center;padding:var(--space-8);background:linear-gradient(135deg,#fff,#f8fafc 58%,#e1f5ee);border:2px solid rgba(79,70,229,.12);border-radius:var(--radius-xl);box-shadow:var(--shadow-card-playful)}.dashboard-copy{display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-4)}.dashboard-kicker{color:var(--cat-speaking);font-size:var(--font-sm);font-weight:900;text-transform:uppercase}.dashboard-title{max-width:620px;color:var(--gray-900);font-size:var(--font-4xl);font-weight:900;line-height:1.1}.dashboard-subtitle{max-width:560px;color:var(--gray-600);font-size:var(--font-lg);font-weight:700}.dashboard-mascot{position:relative;display:flex;justify-content:center}.dashboard-logo-img{width:190px;height:auto;padding:var(--space-4);background:#fff;border:2px solid var(--gray-100);border-radius:var(--radius-xl);box-shadow:var(--shadow-md);object-fit:contain}.dashboard-level-badge{position:absolute;right:4px;bottom:8px;padding:var(--space-2) var(--space-3);background:var(--primary-gradient);color:#fff;border-radius:var(--radius-full);font-weight:900;box-shadow:var(--shadow-md)}.dashboard-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) minmax(220px,.75fr);gap:var(--space-4)}.quest-panel,.progress-panel,.challenge-panel{padding:var(--space-5);background:#fff;border:2px solid rgba(31,41,55,.08);border-radius:var(--radius-lg);box-shadow:var(--shadow-card-playful)}.quest-panel{background:var(--cat-vocab-bg)}.progress-panel{background:var(--cat-test-bg)}.challenge-panel{background:var(--cat-challenge-bg)}.panel-header{display:flex;align-items:center;gap:var(--space-3);margin-bottom:var(--space-4)}.panel-icon{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;background:#fff;border-radius:var(--radius-md);font-size:1.35rem;box-shadow:var(--shadow-sm)}.panel-header h2{color:var(--gray-900);font-size:var(--font-lg);font-weight:900;line-height:1.1}.panel-header p{color:var(--gray-600);font-size:var(--font-sm);font-weight:700}.mission-list{display:flex;flex-direction:column;gap:var(--space-2)}.mission-item{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);padding:var(--space-3);background:#ffffffb8;border-radius:var(--radius-md);color:var(--gray-700);font-weight:800}.mission-item strong{color:var(--coin-fg);white-space:nowrap}.mission-item.active{outline:2px solid rgba(245,158,11,.28)}.mission-item.done{background:#d1fae5d9;color:#065f46}.mission-item.done strong{color:#047857}.level-progress-large{display:flex;flex-direction:column;gap:var(--space-2)}.level-progress-top{display:flex;justify-content:space-between;color:var(--gem-fg);font-weight:900}.level-progress-track{height:14px;background:#fff;border-radius:var(--radius-full);overflow:hidden;border:1px solid rgba(24,95,165,.15)}.level-progress-track div{height:100%;background:linear-gradient(90deg,var(--cat-test),var(--accent-cyan));border-radius:inherit}.level-progress-large p{color:var(--gray-600);font-size:var(--font-sm);font-weight:700}.ld-page{position:relative;z-index:1;padding:var(--space-8) 0}.ld-hero,.ld-result-header{display:flex;justify-content:space-between;gap:var(--space-6);align-items:center;padding:var(--space-8);margin-bottom:var(--space-6);background:#fff;border:1px solid rgba(31,41,55,.08);border-radius:var(--radius-lg);box-shadow:var(--shadow-card-playful)}.ld-kicker{color:var(--cat-speaking);font-size:var(--font-sm);font-weight:900;text-transform:uppercase}.ld-hero h1,.ld-result-header h1{color:var(--gray-900);font-size:var(--font-3xl);font-weight:900;line-height:1.15;margin:var(--space-2) 0}.ld-hero p,.ld-result-header p{max-width:680px;color:var(--gray-600);font-weight:700}.ld-hero-stat{min-width:140px;padding:var(--space-5);text-align:center;background:var(--cat-speaking-bg);border-radius:var(--radius-md);color:var(--cat-speaking)}.ld-hero-stat strong{display:block;font-size:var(--font-4xl);line-height:1}.ld-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--space-4)}.ld-position-card,.ld-result-panel,.ld-answer-review,.ld-admin-editor,.ld-history-panel,.ld-submission-detail,.ld-empty-panel{padding:var(--space-5);background:#fff;border:1px solid rgba(31,41,55,.08);border-radius:var(--radius-lg);box-shadow:var(--shadow-card-playful)}.ld-position-card{display:flex;flex-direction:column;gap:var(--space-4)}.ld-history-panel{margin-bottom:var(--space-5)}.ld-history-list{display:flex;flex-direction:column;gap:var(--space-2);margin-top:var(--space-4)}.ld-history-row{width:100%;display:flex;justify-content:space-between;gap:var(--space-4);padding:var(--space-3);background:var(--gray-50);border:1px solid var(--gray-200);border-radius:var(--radius-md);color:var(--gray-700);text-align:left;cursor:pointer}.ld-history-row strong,.ld-history-row span,.ld-history-row em{display:block}.ld-history-row strong{color:var(--gray-900);font-weight:900}.ld-history-row span{margin-top:var(--space-1);color:var(--gray-500);font-size:var(--font-sm);font-weight:700}.ld-history-row em{color:var(--cat-speaking);font-style:normal;font-weight:900;text-align:right}.ld-card-top,.ld-meta-row,.ld-question-footer,.ld-detail-header,.ld-admin-actions,.ld-score-line{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3)}.ld-card-top span,.ld-card-top em,.ld-meta-row span,.ld-detail-header span{padding:var(--space-1) var(--space-3);background:var(--gray-100);border-radius:var(--radius-full);color:var(--gray-700);font-size:var(--font-sm);font-style:normal;font-weight:900}.ld-position-card h2{color:var(--gray-900);font-size:var(--font-xl);font-weight:900}.ld-position-card p,.ld-result-panel p,.ld-review-section p,.ld-empty-panel{color:var(--gray-600);font-weight:700}.ld-progress-track{height:10px;overflow:hidden;background:var(--gray-100);border-radius:var(--radius-full)}.ld-progress-track div{height:100%;background:linear-gradient(90deg,var(--cat-speaking),var(--accent-green))}.ld-alert{padding:var(--space-4);margin-bottom:var(--space-4);border-radius:var(--radius-md);font-weight:800}.ld-alert.error{background:var(--error-light);color:var(--error)}.ld-exam-page{min-height:100vh;display:grid;grid-template-columns:300px minmax(0,1fr);background:var(--gray-50)}.ld-exam-sidebar{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;gap:var(--space-4);padding:var(--space-5);background:#fff;border-right:1px solid var(--gray-200);overflow-y:auto}.ld-exam-sidebar h1{color:var(--gray-900);font-size:var(--font-xl);font-weight:900;line-height:1.2}.ld-exam-sidebar p,.ld-save-state{color:var(--gray-600);font-size:var(--font-sm);font-weight:800}.ld-timer{padding:var(--space-4);background:var(--gray-900);color:#fff;border-radius:var(--radius-md);font-size:var(--font-2xl);font-weight:900;text-align:center}.ld-exam-sidebar nav{display:flex;flex-direction:column;gap:var(--space-2)}.ld-exam-sidebar nav button,.ld-admin-tabs button,.ld-submission-list button{width:100%;padding:var(--space-3);background:var(--gray-50);border:1px solid var(--gray-200);border-radius:var(--radius-md);color:var(--gray-700);text-align:left;font-weight:800}.ld-exam-sidebar nav button{display:flex;justify-content:space-between;gap:var(--space-3)}.ld-exam-sidebar nav button.active,.ld-admin-tabs button.active,.ld-submission-list button.active{background:var(--cat-speaking-bg);border-color:#0f6e564d;color:var(--cat-speaking)}.ld-exam-main{padding:var(--space-8)}.ld-section-heading{margin-bottom:var(--space-5)}.ld-section-heading span{color:var(--cat-speaking);font-size:var(--font-sm);font-weight:900}.ld-section-heading h2{color:var(--gray-900);font-size:var(--font-3xl);font-weight:900}.ld-section-heading p{color:var(--gray-600);font-weight:700}.ld-question{padding:var(--space-5);margin-bottom:var(--space-4);background:#fff;border:1px solid var(--gray-200);border-radius:var(--radius-lg)}.ld-question-title{display:flex;gap:var(--space-3);margin-bottom:var(--space-4)}.ld-question-title span{width:32px;height:32px;flex:0 0 32px;display:inline-flex;align-items:center;justify-content:center;background:var(--cat-speaking-bg);color:var(--cat-speaking);border-radius:var(--radius-full);font-weight:900}.ld-question-title h3{color:var(--gray-900);font-size:var(--font-lg);font-weight:900;line-height:1.35}.ld-question textarea,.ld-admin-editor textarea,.ld-grade-box textarea{width:100%;min-height:160px;padding:var(--space-4);border:1px solid var(--gray-200);border-radius:var(--radius-md);resize:vertical}.ld-upload{position:relative;color:var(--primary-600);font-weight:900;cursor:pointer}.ld-upload input{display:none}.ld-evidence-list{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-top:var(--space-3)}.ld-evidence-list span,.ld-evidence-list a{display:inline-flex;max-width:100%;padding:var(--space-1) var(--space-3);background:var(--cat-speaking-bg);border-radius:var(--radius-full);color:var(--cat-speaking);font-size:var(--font-sm);font-weight:900;overflow-wrap:anywhere}.ld-result-layout,.ld-admin-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.8fr);gap:var(--space-4);align-items:start}.ld-result-panel h2,.ld-answer-review h2,.ld-result-panel h3,.ld-grade-box h3,.ld-review-section h3{color:var(--gray-900);font-weight:900;margin-bottom:var(--space-3)}.ld-score-line strong{color:var(--cat-speaking);font-size:var(--font-xl)}.ld-result-columns{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4);margin-top:var(--space-4)}.ld-result-columns span{display:block;padding:var(--space-2) 0;color:var(--gray-700);font-weight:800}.ld-answer-review,.ld-review-section{margin-top:var(--space-4)}.ld-review-section article{padding:var(--space-4);margin-top:var(--space-3);background:var(--gray-50);border-radius:var(--radius-md)}.ld-admin-tabs{display:flex;gap:var(--space-3);margin:var(--space-5) 0}.ld-admin-tabs button{width:auto;text-align:center}.ld-admin-layout{grid-template-columns:280px minmax(0,1fr)}.ld-submission-list{display:flex;flex-direction:column;gap:var(--space-2)}.ld-submission-list span{display:block;margin-top:var(--space-1);color:var(--gray-500);font-size:var(--font-sm)}.ld-admin-editor,.ld-submission-detail{display:flex;flex-direction:column;gap:var(--space-4)}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-4)}.ld-admin-editor label,.ld-grade-box{display:flex;flex-direction:column;gap:var(--space-2);color:var(--gray-700);font-weight:900}.ld-checkbox-row{flex-direction:row!important;align-items:center}.code-textarea{min-height:360px!important;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:var(--font-sm)}.ld-submission-detail pre{max-height:260px;overflow:auto;padding:var(--space-3);background:var(--gray-900);border-radius:var(--radius-md);color:#fff;font-size:var(--font-sm)}.ld-staff-table{display:flex;flex-direction:column;gap:var(--space-3)}.ld-staff-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.65fr);gap:var(--space-4);align-items:center;padding:var(--space-4);background:var(--gray-50);border:1px solid var(--gray-200);border-radius:var(--radius-md)}.ld-staff-row strong,.ld-staff-row span{display:block}.ld-staff-row span{color:var(--gray-600);font-size:var(--font-sm);font-weight:800}.ld-staff-actions{display:flex;gap:var(--space-2);align-items:center}.ld-chip-button{padding:var(--space-1) var(--space-3);background:var(--cat-speaking-bg);border-radius:var(--radius-full);color:var(--cat-speaking);font-size:var(--font-sm);font-weight:900}@media(max-width:768px){.ld-hero,.ld-result-header,.ld-card-top,.ld-meta-row,.ld-detail-header,.ld-score-line{align-items:flex-start;flex-direction:column}.ld-exam-page,.ld-result-layout,.ld-admin-layout,.ld-staff-row,.form-grid,.ld-result-columns{grid-template-columns:1fr}.ld-staff-actions{align-items:stretch;flex-direction:column}.ld-exam-sidebar{position:static;height:auto;border-right:0;border-bottom:1px solid var(--gray-200)}.ld-exam-main{padding:var(--space-4)}}.hero-section{text-align:center;padding:var(--space-12) 0 var(--space-8)}.hero-mascot{animation:float 3s ease-in-out infinite;margin-bottom:var(--space-4);filter:drop-shadow(0 10px 20px rgba(0,0,0,.1));display:flex;justify-content:center}.hero-logo-img{width:260px;height:auto;object-fit:contain;background:#ffffffe6;border-radius:var(--radius-xl);padding:var(--space-4) var(--space-6);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.hero-title{font-size:var(--font-4xl);font-weight:900;background:linear-gradient(135deg,#fff,#e0e7ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:var(--space-3);line-height:1.2}.hero-subtitle{font-size:var(--font-xl);color:#ffffffd9;font-weight:600;max-width:500px;margin:0 auto var(--space-8)}.hero-badges{display:flex;justify-content:center;gap:var(--space-3);margin-bottom:var(--space-8);flex-wrap:wrap}.hero-badge{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);background:var(--bg-glass);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:var(--radius-full);color:#fff;font-weight:700;font-size:var(--font-sm);border:1px solid rgba(255,255,255,.2)}.tests-section{position:relative;z-index:1}.section-title{font-size:var(--font-2xl);font-weight:800;color:var(--gray-900);margin-bottom:var(--space-1)}.tests-section-header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);margin-bottom:var(--space-6)}.tests-section-header p{color:var(--gray-600);font-weight:700}.test-cards{display:grid;gap:var(--space-6);max-width:700px;margin:0 auto}.test-card{background:var(--bg-card);border-radius:var(--radius-xl);padding:var(--space-8);box-shadow:var(--shadow-lg);transition:all var(--transition-slow);position:relative;overflow:hidden;cursor:pointer;border:2px solid transparent}.test-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-xl);border-color:var(--primary-400)}.test-card:before{content:"";position:absolute;top:0;left:0;right:0;height:6px;background:var(--primary-gradient)}.test-card-header{display:flex;align-items:center;gap:var(--space-4);margin-bottom:var(--space-4)}.test-card-icon{width:60px;height:60px;background:var(--primary-gradient);border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;font-size:1.8rem;box-shadow:var(--shadow-glow-primary)}.test-card-info h3{font-size:var(--font-xl);font-weight:800;color:var(--gray-800);margin-bottom:var(--space-1)}.test-card-level{display:inline-flex;align-items:center;gap:var(--space-1);padding:2px 10px;background:linear-gradient(135deg,var(--accent-cyan),var(--accent-green));border-radius:var(--radius-full);color:#fff;font-size:var(--font-xs);font-weight:700}.test-card-desc{color:var(--gray-500);font-size:var(--font-base);line-height:1.6;margin-bottom:var(--space-5)}.test-card-meta{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--space-3)}.test-card-stats{display:flex;gap:var(--space-4)}.test-stat{display:flex;align-items:center;gap:var(--space-1);font-size:var(--font-sm);color:var(--gray-500);font-weight:600}.test-stat span{font-size:1.1rem}.test-page{padding:var(--space-4) 0 var(--space-8);position:relative;z-index:1}.test-header{background:var(--bg-card);border-radius:var(--radius-xl);padding:var(--space-5) var(--space-6);margin-bottom:var(--space-5);box-shadow:var(--shadow-md)}.test-header-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-4);flex-wrap:wrap;gap:var(--space-3)}.test-header-title{font-size:var(--font-lg);font-weight:800;color:var(--gray-800)}.test-header-progress-text{font-size:var(--font-sm);font-weight:700;color:var(--primary-500)}.section-tabs{display:flex;gap:var(--space-2);margin-bottom:var(--space-6);overflow-x:auto;padding-bottom:var(--space-2);-webkit-overflow-scrolling:touch}.section-tab{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);background:var(--gray-100);border-radius:var(--radius-full);font-weight:700;font-size:var(--font-sm);color:var(--gray-500);white-space:nowrap;transition:all var(--transition-normal);cursor:pointer;border:2px solid transparent}.section-tab:hover{background:var(--gray-200);color:var(--gray-700)}.section-tab.active{background:var(--primary-gradient);color:#fff;box-shadow:var(--shadow-glow-primary)}.section-tab.completed{background:var(--success-light);color:var(--success);border-color:var(--success)}.question-group-card{background:var(--bg-card);border-radius:var(--radius-xl);padding:var(--space-6) var(--space-8);box-shadow:var(--shadow-lg);margin-bottom:var(--space-5)}.group-instruction{font-size:var(--font-xl);font-weight:700;color:var(--gray-800);margin-bottom:var(--space-5);padding:var(--space-5);background:linear-gradient(135deg,#eef2ff,#f5f3ff);border-radius:var(--radius-md);border-left:4px solid var(--primary-500)}.group-paragraph{font-size:var(--font-base);line-height:1.8;color:var(--gray-700);padding:var(--space-5);background:#fffbeb;border-radius:var(--radius-md);border:1px solid rgba(245,158,11,.2);margin-bottom:var(--space-5);white-space:pre-wrap}.group-audio-player{margin-bottom:var(--space-5)}.group-example-image{display:flex;justify-content:center;margin-bottom:var(--space-5)}.group-example-img{max-width:100%;max-height:400px;object-fit:contain;border-radius:var(--radius-lg);border:2px solid var(--gray-200);background:var(--gray-50);padding:var(--space-2)}.questions-list{display:flex;flex-direction:column;gap:var(--space-5)}.question-item{padding:var(--space-5);border-radius:var(--radius-lg);border:2px solid var(--gray-100);transition:all var(--transition-normal)}.question-item:hover{border-color:var(--gray-200)}.question-item.answered{border-color:var(--primary-400);background:#f5f3ff08}.question-number-badge{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;background:var(--primary-gradient);color:#fff;font-weight:800;font-size:var(--font-sm);border-radius:var(--radius-full);margin-bottom:var(--space-3)}.question-content{font-size:var(--font-lg);font-weight:600;color:var(--gray-700);margin-bottom:var(--space-4)}.question-image-container{display:flex;justify-content:center;margin-bottom:var(--space-4)}.question-image{max-width:320px;max-height:320px;object-fit:contain;border-radius:var(--radius-lg);background:var(--gray-50);padding:var(--space-2);border:2px solid var(--gray-200)}.tick-image-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--space-5)}.tick-image-option{position:relative;border:3px solid var(--gray-200);border-radius:var(--radius-lg);overflow:hidden;cursor:pointer;transition:all var(--transition-bounce);background:#fff}.tick-image-option:hover{transform:scale(1.03);border-color:var(--primary-400)}.tick-image-option.selected{border-color:var(--primary-500);box-shadow:var(--shadow-glow-primary)}.tick-image-option.selected:after{content:"✓";position:absolute;top:8px;right:8px;width:28px;height:28px;background:var(--primary-500);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:14px;animation:bounce-in .4s ease}.tick-image-img{width:100%;aspect-ratio:1;object-fit:contain;padding:var(--space-3);background:var(--gray-50)}.tick-image-label{text-align:center;padding:var(--space-3);font-weight:700;font-size:var(--font-lg);color:var(--gray-600)}.true-false-container{display:flex;flex-direction:column;align-items:center;gap:var(--space-4)}.true-false-image{width:280px;height:280px;object-fit:contain;border-radius:var(--radius-xl);background:var(--gray-50);padding:var(--space-4);border:2px solid var(--gray-200)}.true-false-buttons{display:flex;gap:var(--space-3)}.tf-btn{padding:var(--space-4) var(--space-10);border-radius:var(--radius-full);font-weight:800;font-size:var(--font-xl);transition:all var(--transition-bounce);border:3px solid transparent;min-height:52px}.tf-btn-true{background:var(--success-light);color:var(--success);border-color:var(--success)}.tf-btn-false{background:var(--error-light);color:var(--error);border-color:var(--error)}.tf-btn:hover{transform:scale(1.05)}.tf-btn.selected{transform:scale(1.1);box-shadow:0 0 20px #00000026}.tf-btn-true.selected{background:var(--success);color:#fff}.tf-btn-false.selected{background:var(--error);color:#fff}.mc-options{display:flex;flex-direction:column;gap:var(--space-3)}.mc-option{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);border:2px solid var(--gray-200);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-normal);background:#fff}.mc-option:hover{border-color:var(--primary-400);background:#f5f3ff;transform:translate(4px)}.mc-option.selected{border-color:var(--primary-500);background:#eef2ff;box-shadow:0 0 0 3px #4f46e51a}.mc-option-letter{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:var(--gray-100);font-weight:800;font-size:var(--font-sm);color:var(--gray-600);transition:all var(--transition-normal);flex-shrink:0}.mc-option.selected .mc-option-letter{background:var(--primary-gradient);color:#fff}.mc-option-text{font-weight:600;font-size:var(--font-base);color:var(--gray-700)}.find-error-sentence{font-size:var(--font-lg);color:var(--gray-700);margin-bottom:var(--space-4);padding:var(--space-3);background:var(--gray-50);border-radius:var(--radius-md);text-align:center;font-weight:600}.find-error-options{display:flex;flex-wrap:wrap;gap:var(--space-3);justify-content:center}.error-option{padding:var(--space-2) var(--space-5);border:2px solid var(--gray-200);border-radius:var(--radius-full);cursor:pointer;transition:all var(--transition-bounce);font-weight:700;font-size:var(--font-base);background:#fff}.error-option:hover{border-color:var(--error);background:var(--error-light);transform:scale(1.05)}.error-option.selected{background:var(--error);color:#fff;border-color:var(--error);box-shadow:0 0 15px #ef44444d}.fill-blank-input{display:inline-block;width:180px;padding:var(--space-2) var(--space-3);border:none;border-bottom:3px solid var(--primary-400);background:var(--gray-50);font-size:var(--font-lg);font-weight:700;color:var(--gray-800);text-align:center;border-radius:var(--radius-sm) var(--radius-sm) 0 0;transition:all var(--transition-normal)}.fill-blank-input:focus{border-bottom-color:var(--primary-600);background:#eef2ff;box-shadow:0 4px 12px #4f46e526}.fill-blank-input::placeholder{color:var(--gray-300);font-weight:600}.unscramble-container{display:flex;flex-direction:column;align-items:center;gap:var(--space-4)}.unscramble-image{width:220px;height:220px;object-fit:contain;border-radius:var(--radius-xl);background:var(--gray-50);padding:var(--space-4);border:2px solid var(--gray-200)}.unscramble-answer{display:flex;gap:var(--space-2);min-height:56px;padding:var(--space-3);background:var(--gray-50);border-radius:var(--radius-md);border:2px dashed var(--primary-400);min-width:200px;justify-content:center;align-items:center;flex-wrap:wrap}.unscramble-letters{display:flex;gap:var(--space-2);flex-wrap:wrap;justify-content:center}.letter-tile{width:56px;height:56px;display:flex;align-items:center;justify-content:center;background:var(--primary-gradient);color:#fff;font-weight:900;font-size:var(--font-xl);border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-bounce);-webkit-user-select:none;user-select:none;box-shadow:var(--shadow-sm)}.letter-tile:hover{transform:scale(1.1) rotate(-3deg)}.letter-tile:active{transform:scale(.95)}.letter-tile.placed{background:var(--accent-yellow);color:var(--gray-800)}.letter-tile.in-answer{background:linear-gradient(135deg,var(--accent-yellow),var(--accent-orange))}.unscramble-input-row{display:flex;align-items:center;gap:var(--space-3)}.unscramble-text-input{padding:var(--space-2) var(--space-4);border:2px solid var(--primary-400);border-radius:var(--radius-md);font-size:var(--font-lg);font-weight:700;text-align:center;width:160px;text-transform:uppercase;letter-spacing:4px}.unscramble-text-input:focus{border-color:var(--primary-600);box-shadow:0 0 0 3px #4f46e526}.speaking-container{display:flex;flex-direction:column;align-items:center;gap:var(--space-4)}.speaking-image{width:280px;height:280px;object-fit:contain;border-radius:var(--radius-xl);background:var(--gray-50);padding:var(--space-4);border:2px solid var(--gray-200)}.speaking-prompt{font-size:var(--font-lg);font-weight:600;color:var(--gray-700);text-align:center;max-width:400px}.speaking-audio-prompt{width:100%;max-width:400px}.record-btn{width:100px;height:100px;border-radius:50%;background:linear-gradient(135deg,var(--error),#DC2626);color:#fff;font-size:2.5rem;display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 8px #ef444433;transition:all var(--transition-normal)}.record-btn:hover{transform:scale(1.1);box-shadow:0 0 0 8px #ef44444d}.record-btn.recording{animation:pulse-glow 1.5s infinite;box-shadow:0 0 0 8px #ef444466}.record-btn.recording:after{content:"";width:30px;height:30px;background:#fff;border-radius:4px}.recording-indicator{display:flex;align-items:center;gap:var(--space-2);color:var(--error);font-weight:700}.recording-dot{width:10px;height:10px;background:var(--error);border-radius:50%;animation:pulse-glow 1s infinite}.recording-done{display:flex;align-items:center;gap:var(--space-2);color:var(--success);font-weight:700}.navigation-buttons{display:flex;justify-content:space-between;align-items:center;gap:var(--space-4);padding-top:var(--space-5);margin-top:var(--space-5);border-top:1px solid var(--gray-100)}.nav-info{font-size:var(--font-sm);color:var(--gray-400);font-weight:600}.test-page-fullscreen{height:100vh;height:100dvh;display:flex;flex-direction:column;overflow:hidden;position:relative;z-index:1}.test-header-compact{flex-shrink:0;background:#fffffff2;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);padding:var(--space-3) var(--space-4);border-bottom:1px solid rgba(0,0,0,.06);z-index:10}.thc-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-2)}.thc-left{display:flex;align-items:center;gap:var(--space-3);min-width:0}.thc-title{font-size:var(--font-base);font-weight:800;color:var(--gray-800);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.thc-right{flex-shrink:0}.thc-counter{font-size:var(--font-sm);font-weight:800;color:var(--primary-500);background:#4f46e514;padding:2px 10px;border-radius:var(--radius-full)}.thc-progress{width:100%}.thc-progress-bar{width:100%;height:6px;background:var(--gray-100);border-radius:var(--radius-full);overflow:hidden}.thc-progress-fill{height:100%;background:var(--primary-gradient);border-radius:var(--radius-full);position:relative}.thc-progress-fill:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent);animation:shimmer 2s infinite;background-size:200% 100%}.streak-counter.streak-sm{padding:2px 8px;font-size:var(--font-xs);gap:var(--space-1)}.test-section-strip{flex-shrink:0;display:flex;gap:var(--space-1);padding:var(--space-2) var(--space-4);overflow-x:auto;-webkit-overflow-scrolling:touch;background:#ffffffb3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid rgba(0,0,0,.04)}.test-section-strip::-webkit-scrollbar{display:none}.section-strip-btn{display:flex;align-items:center;gap:var(--space-1);padding:4px 12px;background:var(--gray-100);border-radius:var(--radius-full);font-weight:700;font-size:var(--font-xs);color:var(--gray-500);white-space:nowrap;transition:all var(--transition-normal);cursor:pointer;border:1.5px solid transparent}.section-strip-btn:hover{background:var(--gray-200);color:var(--gray-700)}.section-strip-btn.active{background:var(--primary-gradient);color:#fff;box-shadow:0 2px 8px #4f46e54d}.section-strip-btn.completed{background:var(--success-light);color:var(--success);border-color:var(--success)}.section-strip-label{max-width:100px;overflow:hidden;text-overflow:ellipsis}.section-strip-check{font-size:.7rem;color:var(--success)}.question-dots-bar{flex-shrink:0;display:flex;align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-4);background:#fff9;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid rgba(0,0,0,.04)}.question-dots-scroll{display:flex;gap:var(--space-2);overflow-x:auto;flex:1;-webkit-overflow-scrolling:touch;padding:2px 0}.question-dots-scroll::-webkit-scrollbar{display:none}.question-dots-section{display:flex;gap:4px;padding-right:var(--space-2);border-right:1px solid var(--gray-200)}.question-dots-section:last-child{border-right:none;padding-right:0}.q-dot{width:12px;height:12px;border-radius:50%;background:var(--gray-200);border:2px solid transparent;cursor:pointer;transition:all var(--transition-normal);flex-shrink:0;padding:0}.q-dot:hover{background:var(--gray-300);transform:scale(1.3)}.q-dot.filled{background:var(--primary-500)}.q-dot.active{background:var(--accent-yellow);border-color:var(--accent-orange);transform:scale(1.4);box-shadow:0 0 8px #f59e0b80}.q-dot.active.filled{background:var(--primary-500);border-color:var(--primary-700);box-shadow:0 0 8px #4f46e580}.q-dot.matching{width:18px;border-radius:6px}.question-dots-label{font-size:var(--font-xs);font-weight:800;color:var(--gray-400);white-space:nowrap;flex-shrink:0}.test-question-area{flex:1;min-height:0;overflow:hidden;position:relative}.test-question-slide{height:100%;overflow-y:auto;-webkit-overflow-scrolling:touch}.test-nav-bottom{flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding:var(--space-3) var(--space-4);padding-bottom:calc(var(--space-3) + env(safe-area-inset-bottom,0px));background:#fffffff2;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-top:1px solid rgba(0,0,0,.08);gap:var(--space-3);z-index:10}.nav-btn{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-3) var(--space-5);border-radius:var(--radius-full);font-weight:700;font-size:var(--font-sm);transition:all var(--transition-normal);cursor:pointer;border:none}.nav-btn:disabled{opacity:.35;cursor:not-allowed;transform:none!important}.nav-btn-prev{background:var(--gray-100);color:var(--gray-600)}.nav-btn-prev:not(:disabled):hover{background:var(--gray-200);transform:translate(-2px)}.nav-btn-next{background:var(--primary-gradient);color:#fff;box-shadow:0 2px 12px #4f46e54d}.nav-btn-next:hover{transform:translate(2px);box-shadow:0 4px 20px #4f46e566}.nav-btn-submit{background:linear-gradient(135deg,var(--accent-yellow) 0%,var(--accent-orange) 100%);color:#fff;box-shadow:0 2px 12px #f59e0b4d;animation:pulse-glow-accent 2s infinite}@keyframes pulse-glow-accent{0%,to{box-shadow:0 2px 12px #f59e0b4d}50%{box-shadow:0 4px 24px #f59e0b80}}.nav-btn-submit:hover{transform:translateY(-2px)}.nav-btn-arrow{font-size:var(--font-base);line-height:1}.nav-btn-text{line-height:1}.nav-center-info{flex:1;text-align:center;min-width:0}.nav-section-label{font-size:var(--font-xs);font-weight:700;color:var(--gray-400);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}.single-question-view{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100%;padding:var(--space-4) var(--space-4) var(--space-6)}.sqv-content{width:100%;max-width:680px;display:flex;flex-direction:column;gap:var(--space-4)}.sqv-instruction{display:flex;align-items:flex-start;gap:var(--space-2);padding:var(--space-3) var(--space-4);background:linear-gradient(135deg,#eef2ff,#f5f3ff);border-radius:var(--radius-md);border-left:3px solid var(--primary-500);font-size:var(--font-sm);font-weight:600;color:var(--gray-700);line-height:1.5}.sqv-instruction-icon{flex-shrink:0;font-size:var(--font-base)}.sqv-paragraph{border-radius:var(--radius-md);overflow:hidden;border:1px solid rgba(245,158,11,.2);background:#fffbeb}.sqv-paragraph-toggle{width:100%;display:flex;align-items:center;justify-content:space-between;padding:var(--space-3) var(--space-4);background:transparent;font-weight:700;font-size:var(--font-sm);color:var(--accent-orange);cursor:pointer;transition:all var(--transition-normal)}.sqv-paragraph-toggle:hover{background:#f59e0b14}.sqv-paragraph-chevron{font-size:var(--font-xs);transition:transform var(--transition-normal)}.sqv-paragraph-text{padding:0 var(--space-4) var(--space-4);font-size:var(--font-sm);line-height:1.8;color:var(--gray-700);white-space:pre-wrap}.sqv-audio{max-width:100%}.sqv-example-image{display:flex;justify-content:center}.sqv-example-img{max-width:100%;max-height:200px;object-fit:contain;border-radius:var(--radius-lg);border:2px solid var(--gray-200);background:var(--gray-50);padding:var(--space-2)}.sqv-matching-wrapper{width:100%}.sqv-question-card{background:var(--bg-card);border-radius:var(--radius-xl);padding:var(--space-6);box-shadow:var(--shadow-lg);border:2px solid transparent;transition:border-color var(--transition-normal)}.sqv-question-header{display:flex;align-items:center;gap:var(--space-3);margin-bottom:var(--space-4)}.sqv-question-badge{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;background:var(--primary-gradient);color:#fff;font-weight:900;font-size:var(--font-lg);border-radius:var(--radius-full);box-shadow:0 3px 12px #4f46e54d;transition:all var(--transition-bounce)}.sqv-question-badge.answered{background:linear-gradient(135deg,var(--success) 0%,#059669 100%);box-shadow:0 3px 12px #10b9814d}.sqv-answered-tag{font-size:var(--font-xs);font-weight:800;color:var(--success);background:var(--success-light);padding:2px 10px;border-radius:var(--radius-full)}.sqv-question-text{font-size:var(--font-xl);font-weight:700;color:var(--gray-800);margin-bottom:var(--space-4);line-height:1.5}.sqv-question-image-wrap{display:flex;justify-content:center;margin-bottom:var(--space-4)}.sqv-question-image{max-width:280px;max-height:280px;object-fit:contain;border-radius:var(--radius-lg);background:var(--gray-50);padding:var(--space-2);border:2px solid var(--gray-200)}.sqv-answer-area{margin-top:var(--space-2)}@media(max-width:768px){.thc-title{font-size:var(--font-sm)}.test-section-strip{padding:var(--space-1) var(--space-3)}.section-strip-btn{padding:3px 8px;font-size:.65rem}.question-dots-bar{padding:var(--space-1) var(--space-3)}.q-dot{width:10px;height:10px}.q-dot.matching{width:15px}.single-question-view{padding:var(--space-3) var(--space-3) var(--space-4)}.sqv-question-card{padding:var(--space-4)}.sqv-question-badge{width:38px;height:38px;font-size:var(--font-base)}.sqv-question-text{font-size:var(--font-lg)}.sqv-question-image{max-width:220px;max-height:220px}.nav-btn{padding:var(--space-2) var(--space-4);font-size:var(--font-xs)}.test-nav-bottom{padding:var(--space-2) var(--space-3)}.true-false-image,.speaking-image{width:200px;height:200px}.unscramble-image{width:160px;height:160px}.tick-image-grid{grid-template-columns:repeat(2,1fr);gap:var(--space-3)}}.progress-bar-container{width:100%;height:14px;background:var(--gray-100);border-radius:var(--radius-full);overflow:hidden;position:relative}.progress-bar-fill{height:100%;background:var(--primary-gradient);border-radius:var(--radius-full);transition:width .6s cubic-bezier(.4,0,.2,1);position:relative}.progress-bar-fill:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);animation:shimmer 2s infinite;background-size:200% 100%}.progress-bar-stars{display:flex;justify-content:space-between;margin-top:var(--space-1);padding:0 var(--space-1)}.progress-star{font-size:1.2rem;opacity:.3;transition:all var(--transition-bounce)}.progress-star.earned{opacity:1;animation:star-pop .5s ease}.streak-counter{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);background:linear-gradient(135deg,var(--accent-orange),var(--accent-yellow));border-radius:var(--radius-full);color:#fff;font-weight:800;font-size:var(--font-sm);box-shadow:var(--shadow-glow-accent)}.streak-fire{font-size:1.3rem;animation:wiggle .3s ease}.result-page{padding:var(--space-8) 0;position:relative;z-index:1}.result-card{background:var(--bg-card);border-radius:var(--radius-xl);padding:var(--space-8);box-shadow:var(--shadow-xl);text-align:center;max-width:600px;margin:0 auto;position:relative;overflow:hidden}.result-card:before{content:"";position:absolute;top:0;left:0;right:0;height:8px;background:var(--primary-gradient)}.result-badge-container{margin:var(--space-6) 0}.result-badge{width:120px;height:120px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:3.5rem;margin:0 auto var(--space-4);animation:bounce-in .8s ease;position:relative}.result-badge.gold{background:linear-gradient(135deg,#f59e0b,#d97706);box-shadow:0 0 40px #f59e0b80}.result-badge.silver{background:linear-gradient(135deg,#9ca3af,#6b7280);box-shadow:0 0 40px #9ca3af80}.result-badge.bronze{background:linear-gradient(135deg,#d97706,#92400e);box-shadow:0 0 40px #d9770680}.result-badge.none{background:linear-gradient(135deg,var(--gray-200),var(--gray-300))}.result-badge-label{font-size:var(--font-xl);font-weight:800;text-transform:uppercase;margin-bottom:var(--space-2)}.result-score{font-size:var(--font-5xl);font-weight:900;background:var(--primary-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:var(--space-2)}.result-score-detail{font-size:var(--font-lg);color:var(--gray-500);font-weight:600}.reward-summary{display:flex;justify-content:center;gap:var(--space-2);flex-wrap:wrap;margin-top:var(--space-4)}.reward-chip{padding:var(--space-2) var(--space-4);border-radius:var(--radius-full);font-size:var(--font-sm);font-weight:900;box-shadow:var(--shadow-sm)}.reward-chip.xp{background:var(--cat-test-bg);color:var(--cat-test)}.reward-chip.coin{background:var(--coin-bg);color:var(--coin-fg)}.reward-chip.gem{background:var(--gem-bg);color:var(--gem-fg)}.result-sections{margin-top:var(--space-6);display:flex;flex-direction:column;gap:var(--space-3)}.result-section-row{display:flex;align-items:center;justify-content:space-between;padding:var(--space-3) var(--space-4);background:var(--gray-50);border-radius:var(--radius-md)}.result-section-name{display:flex;align-items:center;gap:var(--space-2);font-weight:700;font-size:var(--font-sm);color:var(--gray-700)}.result-section-score{font-weight:800;color:var(--primary-500)}.result-streak{margin-top:var(--space-5);padding:var(--space-3);background:linear-gradient(135deg,#fef3c7,#fffbeb);border-radius:var(--radius-md);font-weight:700;color:var(--accent-orange)}.result-actions{display:flex;gap:var(--space-3);justify-content:center;margin-top:var(--space-6);flex-wrap:wrap}.result-detail-container{margin-top:var(--space-6);display:flex;flex-direction:column;gap:var(--space-3);text-align:left}.result-detail-section{border:1px solid var(--gray-200);border-radius:var(--radius-lg);overflow:hidden}.result-detail-section-header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-3) var(--space-4);background:linear-gradient(135deg,#f8fafc,#f1f5f9);cursor:pointer;transition:background var(--transition-normal);gap:var(--space-3)}.result-detail-section-header:hover{background:linear-gradient(135deg,#f1f5f9,#e2e8f0)}.result-detail-section-info{display:flex;align-items:center;gap:var(--space-2);min-width:0}.result-detail-section-icon{font-size:1.2rem;flex-shrink:0}.result-detail-section-title{font-weight:700;font-size:var(--font-sm);color:var(--gray-700);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.result-detail-section-stats{display:flex;align-items:center;gap:var(--space-2);flex-shrink:0}.result-detail-correct-badge{font-size:var(--font-sm);font-weight:700;color:var(--success)}.result-detail-wrong-badge{font-size:var(--font-sm);font-weight:700;color:var(--error)}.result-detail-toggle{font-size:var(--font-xs);color:var(--gray-400);width:20px;text-align:center}.result-detail-questions{padding:var(--space-2) var(--space-3);display:flex;flex-direction:column;gap:var(--space-2)}.result-detail-question{padding:var(--space-3);border-radius:var(--radius-md);border-left:4px solid var(--gray-200);background:var(--gray-50);transition:all var(--transition-normal)}.result-detail-question.correct{border-left-color:var(--success);background:#f0fdf4}.result-detail-question.incorrect{border-left-color:var(--error);background:#fef2f2}.result-detail-q-header{display:flex;align-items:center;gap:var(--space-2);margin-bottom:var(--space-1)}.result-detail-q-num{background:var(--primary-gradient);color:#fff;font-weight:800;font-size:var(--font-xs);padding:2px 8px;border-radius:var(--radius-full)}.result-detail-q-status{font-size:.9rem}.result-detail-q-type{font-size:var(--font-xs);color:var(--gray-500);font-weight:600;margin-left:auto}.result-detail-q-content{font-size:var(--font-sm);color:var(--gray-600);margin:var(--space-1) 0;font-weight:500}.result-detail-answers{display:flex;flex-direction:column;gap:var(--space-1);margin-top:var(--space-2)}.result-detail-answer{display:flex;align-items:baseline;gap:var(--space-2);font-size:var(--font-sm);padding:var(--space-1) var(--space-2);border-radius:var(--radius-sm)}.result-detail-answer.correct{color:#166534;background:#16a34a14}.result-detail-answer.wrong{color:#991b1b;background:#ef444414}.result-detail-answer-label{font-weight:700;flex-shrink:0;font-size:var(--font-xs)}.speaking-detail-card{margin-top:var(--space-2);padding:var(--space-3);background:linear-gradient(135deg,#eef2ff,#f5f3ff);border-radius:var(--radius-md);border:1px solid rgba(79,70,229,.12);display:flex;flex-direction:column;gap:var(--space-2)}.speaking-detail-transcript{display:flex;flex-direction:column;gap:2px}.speaking-detail-label{font-size:var(--font-xs);font-weight:700;color:var(--gray-500)}.speaking-detail-value{font-size:var(--font-sm);color:var(--gray-700);font-style:italic}.speaking-detail-score-row{display:flex;gap:var(--space-2);flex-wrap:wrap}.speaking-detail-score{display:inline-flex;align-items:center;gap:var(--space-1);padding:2px 10px;border-radius:var(--radius-full);font-weight:800;font-size:var(--font-xs)}.speaking-detail-score.high{background:linear-gradient(135deg,#d1fae5,#a7f3d0);color:#065f46}.speaking-detail-score.mid{background:linear-gradient(135deg,#fef3c7,#fde68a);color:#92400e}.speaking-detail-score.low{background:linear-gradient(135deg,#fee2e2,#fecaca);color:#991b1b}.speaking-detail-feedback{font-size:var(--font-xs);color:var(--primary-600);font-weight:500;line-height:1.4}.confetti-container{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:1000;overflow:hidden}.confetti-piece{position:absolute;top:-10px;width:12px;height:12px;animation:confetti-fall linear forwards}.audio-player{display:flex;align-items:center;gap:var(--space-4);padding:var(--space-4);background:linear-gradient(135deg,#eef2ff,#f5f3ff);border-radius:var(--radius-lg);border:1px solid rgba(79,70,229,.15)}.audio-play-btn{width:50px;height:50px;border-radius:50%;background:var(--primary-gradient);color:#fff;font-size:1.3rem;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-glow-primary);transition:all var(--transition-normal);flex-shrink:0}.audio-play-btn:hover{transform:scale(1.1)}.audio-info{flex:1}.audio-label{font-weight:700;font-size:var(--font-sm);color:var(--gray-600);margin-bottom:var(--space-1)}.audio-progress-container{cursor:pointer;padding:var(--space-1) 0}.audio-progress-track{width:100%;height:6px;background:var(--gray-200);border-radius:var(--radius-full);position:relative;overflow:visible}.audio-progress-fill{height:100%;background:var(--primary-gradient);border-radius:var(--radius-full);transition:width .1s linear}.audio-progress-thumb{position:absolute;top:50%;width:14px;height:14px;background:var(--primary-500);border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 4px #4f46e566;transition:left .1s linear}.audio-time{display:flex;justify-content:space-between;font-size:var(--font-xs);color:var(--gray-400);font-weight:600;margin-top:var(--space-1);font-variant-numeric:tabular-nums}.tick-image-img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:var(--radius-md)}.true-false-image{max-width:250px;max-height:250px;object-fit:contain;border-radius:var(--radius-lg);border:2px solid var(--gray-200);background:var(--gray-50)}.unscramble-image{max-width:200px;max-height:200px;object-fit:contain;border-radius:var(--radius-md);border:2px solid var(--gray-200);background:var(--gray-50)}.modal-overlay{position:fixed;inset:0;background:#00000080;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:100;padding:var(--space-4)}.modal-content{background:#fff;border-radius:var(--radius-xl);padding:var(--space-8);max-width:420px;width:100%;text-align:center;box-shadow:var(--shadow-xl);animation:bounce-in .4s ease}.modal-icon{font-size:3rem;margin-bottom:var(--space-4)}.modal-title{font-size:var(--font-xl);font-weight:800;color:var(--gray-800);margin-bottom:var(--space-3)}.modal-text{color:var(--gray-500);margin-bottom:var(--space-6)}.btn-outline{padding:var(--space-3) var(--space-6);border-radius:var(--radius-full);font-weight:700;background:transparent;border:2px solid var(--gray-300);color:var(--gray-600);transition:all var(--transition-normal)}.image-placeholder{width:100%;aspect-ratio:1;background:var(--gray-50);border-radius:var(--radius-md);display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--gray-400);font-weight:700;font-size:var(--font-sm);gap:var(--space-2)}.image-placeholder-icon{font-size:4rem}.image-placeholder{font-size:var(--font-lg)}.navbar{background:#ffffffeb;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-bottom:1px solid rgba(255,255,255,.3);padding:var(--space-2) 0;position:sticky;top:0;z-index:100;box-shadow:var(--shadow-sm)}.navbar-inner{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3)}.navbar-brand{display:flex;align-items:center;gap:var(--space-2);font-weight:900;font-size:var(--font-lg)}.navbar-logo-img{height:32px;width:auto;object-fit:contain}.navbar-title{background:var(--primary-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.navbar-links{display:flex;gap:var(--space-2)}.nav-link{padding:var(--space-2) var(--space-3);border-radius:var(--radius-full);font-weight:700;font-size:var(--font-sm);color:var(--gray-600);transition:all var(--transition-normal)}.nav-link:hover{background:var(--gray-100);color:var(--gray-800)}.nav-link.active{background:var(--primary-gradient);color:#fff}.navbar-user{display:flex;align-items:center}.user-menu{display:flex;align-items:center;gap:var(--space-2)}.currency-pill-group{display:flex;align-items:center;gap:var(--space-2);flex-wrap:wrap}.currency-pill{min-height:34px;display:inline-flex;align-items:center;gap:var(--space-1);padding:var(--space-1) var(--space-3);border-radius:var(--radius-full);font-size:var(--font-sm);font-weight:900;border:1px solid rgba(31,41,55,.08);box-shadow:var(--shadow-sm);white-space:nowrap}.currency-icon{font-size:1rem}.coin-pill{background:var(--coin-bg);color:var(--coin-fg)}.gem-pill{background:var(--gem-bg);color:var(--gem-fg)}.streak-pill{background:var(--streak-bg);color:var(--streak-fg)}.level-pill{position:relative;overflow:hidden;background:#fff;color:var(--primary-600)}.level-mini-bar{position:absolute;left:8px;right:8px;bottom:4px;height:3px;overflow:hidden;background:var(--gray-100);border-radius:var(--radius-full)}.level-mini-bar span{display:block;height:100%;background:var(--primary-gradient);border-radius:inherit}.user-avatar{font-size:1.6rem}.user-name{font-weight:700;font-size:var(--font-sm);color:var(--gray-700)}.user-role-badge{padding:2px 8px;background:linear-gradient(135deg,var(--accent-cyan),var(--accent-green));border-radius:var(--radius-full);color:#fff;font-size:var(--font-xs);font-weight:700;text-transform:uppercase}.btn-outline{background:transparent;border:2px solid var(--gray-300);color:var(--gray-600);padding:var(--space-2) var(--space-4);border-radius:var(--radius-full);font-weight:700;font-size:var(--font-sm);cursor:pointer;transition:all var(--transition-normal)}.btn-outline:hover{border-color:var(--gray-400);background:var(--gray-50)}.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:var(--space-8) 0;position:relative;z-index:1}.login-card{width:100%;max-width:480px;padding:var(--space-8)}.login-header{text-align:center;margin-bottom:var(--space-6)}.login-mascot{animation:float 3s ease-in-out infinite;margin-bottom:var(--space-3);display:flex;justify-content:center}.login-logo-img{width:200px;height:auto;object-fit:contain}.login-title{font-size:var(--font-2xl);font-weight:900;color:var(--gray-800);margin-bottom:var(--space-2)}.login-subtitle{color:var(--gray-500);font-size:var(--font-base)}.login-tabs{display:flex;gap:var(--space-2);margin-bottom:var(--space-6);background:var(--gray-100);border-radius:var(--radius-full);padding:4px}.login-tab{flex:1;padding:var(--space-2) var(--space-4);border-radius:var(--radius-full);font-weight:700;font-size:var(--font-sm);background:transparent;color:var(--gray-500);transition:all var(--transition-normal);cursor:pointer}.login-tab.active{background:#fff;color:var(--primary-500);box-shadow:var(--shadow-sm)}.login-form{display:flex;flex-direction:column;gap:var(--space-4)}.form-group{display:flex;flex-direction:column;gap:var(--space-2)}.form-label{font-weight:700;font-size:var(--font-sm);color:var(--gray-600)}.form-input{padding:var(--space-3) var(--space-4);border:2px solid var(--gray-200);border-radius:var(--radius-md);font-size:var(--font-base);font-weight:600;color:var(--gray-800);transition:all var(--transition-normal);background:#fff;width:100%;font-family:inherit}.form-input:focus{border-color:var(--primary-400);box-shadow:0 0 0 3px #4f46e51a;outline:none}.form-textarea{resize:vertical;min-height:80px;line-height:1.6}.form-error{padding:var(--space-3);background:var(--error-light);border-radius:var(--radius-md);color:var(--error);font-weight:700;font-size:var(--font-sm)}.avatar-grid{display:flex;flex-wrap:wrap;gap:var(--space-2)}.avatar-option{width:48px;height:48px;font-size:1.5rem;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-md);border:3px solid var(--gray-200);background:#fff;cursor:pointer;transition:all var(--transition-bounce)}.avatar-option:hover{transform:scale(1.1);border-color:var(--primary-400)}.avatar-option.selected{border-color:var(--primary-500);box-shadow:var(--shadow-glow-primary);transform:scale(1.1)}.login-demo-accounts{margin-top:var(--space-5);text-align:center}.demo-title{font-size:var(--font-sm);color:var(--gray-400);margin-bottom:var(--space-2)}.demo-list{display:flex;gap:var(--space-2);justify-content:center;flex-wrap:wrap}.demo-btn{padding:var(--space-1) var(--space-3);border-radius:var(--radius-full);font-size:var(--font-xs);font-weight:700;background:var(--gray-100);color:var(--gray-600);cursor:pointer;transition:all var(--transition-normal);border:none;font-family:inherit}.demo-btn:hover{background:var(--primary-gradient);color:#fff}.admin-page{padding:var(--space-6) 0;position:relative;z-index:1}.admin-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-6);flex-wrap:wrap;gap:var(--space-3)}.admin-title{font-size:var(--font-2xl);font-weight:900;color:#fff}.admin-subtitle{color:#fffc;font-size:var(--font-base)}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:var(--space-4);margin-bottom:var(--space-8)}.stat-card{padding:var(--space-5);text-align:center}.stat-icon{width:48px;height:48px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;font-size:1.5rem;margin:0 auto var(--space-3);color:#fff}.stat-value{font-size:var(--font-3xl);font-weight:900;color:var(--gray-800)}.stat-label{font-size:var(--font-sm);font-weight:600;color:var(--gray-500)}.admin-section{margin-bottom:var(--space-8)}.admin-section-title{font-size:var(--font-xl);font-weight:800;color:#fff;margin-bottom:var(--space-4)}.quick-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:var(--space-4)}.action-card{padding:var(--space-5);display:flex;flex-direction:column;align-items:center;gap:var(--space-2);text-align:center;transition:all var(--transition-slow);cursor:pointer}.action-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-xl)}.action-icon{font-size:2rem}.action-label{font-weight:800;font-size:var(--font-lg);color:var(--gray-800)}.action-desc{font-size:var(--font-sm);color:var(--gray-500)}.admin-test-list{display:flex;flex-direction:column;gap:var(--space-3)}.admin-test-row{padding:var(--space-4) var(--space-5);display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);flex-wrap:wrap}.admin-test-info{display:flex;flex-direction:column;gap:var(--space-1)}.admin-test-info strong{font-size:var(--font-lg);color:var(--gray-800)}.admin-test-meta{font-size:var(--font-sm);color:var(--gray-500)}.admin-test-actions{display:flex;gap:var(--space-2);flex-wrap:wrap}.admin-empty{text-align:center;padding:var(--space-10);color:var(--gray-500)}.settings-alert{padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);font-weight:800;margin-bottom:var(--space-4)}.settings-alert.success{background:var(--success-light);color:var(--success)}.settings-alert.error{background:var(--error-light);color:var(--error)}.settings-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);gap:var(--space-5)}.settings-form-grid,.badge-reward-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-4)}.badge-reward-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.settings-field{display:flex;flex-direction:column;gap:var(--space-2);color:var(--gray-700);font-size:var(--font-sm);font-weight:800}.settings-field.small{min-width:84px}.settings-field.compact{min-width:0}.settings-subtitle{margin:var(--space-5) 0 var(--space-3);color:var(--gray-700);font-size:var(--font-base);font-weight:900}.settings-help{color:var(--gray-500);font-size:var(--font-sm);font-weight:700;margin-bottom:var(--space-4)}.level-preview{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--space-2);margin-top:var(--space-5)}.level-preview div{padding:var(--space-3);background:var(--cat-test-bg);border-radius:var(--radius-md);text-align:center}.level-preview strong,.level-preview span{display:block}.level-preview strong{color:var(--cat-test);font-weight:900}.level-preview span{color:var(--gray-600);font-size:var(--font-xs);font-weight:800}.settings-section-header{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-4);margin-bottom:var(--space-4)}.mission-editor-list{display:flex;flex-direction:column;gap:var(--space-3)}.mission-editor-row{display:grid;grid-template-columns:82px minmax(180px,1.4fr) minmax(150px,1fr) repeat(4,minmax(78px,.55fr)) auto;align-items:end;gap:var(--space-3);padding:var(--space-4);background:var(--gray-50);border:1px solid var(--gray-200);border-radius:var(--radius-lg)}.mission-title-field{min-width:0}.mission-toggle{display:flex;align-items:center;gap:var(--space-2);padding-bottom:var(--space-3);color:var(--gray-700);font-weight:900}.editor-card{padding:var(--space-6);margin-bottom:var(--space-5)}.editor-card-title{font-size:var(--font-lg);font-weight:800;color:var(--gray-800);margin-bottom:var(--space-4)}.editor-card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-4)}.editor-form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--space-4);margin-bottom:var(--space-4)}.editor-section{border:2px solid var(--gray-100);border-radius:var(--radius-lg);margin-bottom:var(--space-3);overflow:hidden}.editor-section-header{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-4);background:var(--gray-50);cursor:pointer;transition:background var(--transition-fast)}.editor-section-header:hover{background:var(--gray-100)}.editor-section-toggle{font-size:var(--font-sm);color:var(--gray-400)}.editor-section-icon{font-size:1.3rem}.editor-section-name{font-weight:700;color:var(--gray-800);flex:1}.editor-section-meta{font-size:var(--font-sm);color:var(--gray-400);font-weight:600}.editor-section-body{padding:var(--space-4)}.editor-groups-area{margin-top:var(--space-4)}.editor-groups-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-3);flex-wrap:wrap;gap:var(--space-2)}.editor-groups-header h4{font-weight:700;color:var(--gray-700)}.editor-group{border:1px solid var(--gray-200);border-radius:var(--radius-md);margin-bottom:var(--space-3)}.editor-group-header{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-3);background:#f5f3ff;cursor:pointer;font-size:var(--font-sm);font-weight:600;color:var(--gray-700)}.editor-group-body{padding:var(--space-4)}.editor-questions-area{margin-top:var(--space-4)}.editor-question{border:1px solid var(--gray-200);border-radius:var(--radius-md);padding:var(--space-4);margin-bottom:var(--space-3);background:#fff}.editor-question-header{display:flex;align-items:center;gap:var(--space-3);margin-bottom:var(--space-3)}.editor-question-type{padding:2px 8px;background:var(--primary-gradient);color:#fff;font-size:var(--font-xs);font-weight:700;border-radius:var(--radius-full)}.editor-option-row{display:flex;align-items:center;gap:var(--space-2);margin-bottom:var(--space-2)}.icon-picker{display:flex;gap:var(--space-1);flex-wrap:wrap}.icon-option{width:36px;height:36px;border:2px solid var(--gray-200);border-radius:var(--radius-sm);font-size:1.1rem;cursor:pointer;background:#fff;display:flex;align-items:center;justify-content:center;transition:all var(--transition-fast)}.icon-option.selected{border-color:var(--primary-500);background:#eef2ff}.modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:200;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal-content{background:#fff;border-radius:var(--radius-xl);padding:var(--space-8);text-align:center;max-width:400px;width:90%;box-shadow:var(--shadow-xl)}.modal-icon{font-size:3rem;margin-bottom:var(--space-3)}.modal-title{font-size:var(--font-xl);font-weight:800;color:var(--gray-800);margin-bottom:var(--space-2)}.modal-text{color:var(--gray-500);margin-bottom:var(--space-5)}.modal-actions{display:flex;gap:var(--space-3);justify-content:center}.speaking-transcript{width:100%;max-width:500px;padding:var(--space-4);background:#f0fdf4;border-radius:var(--radius-md);border:1px solid rgba(16,185,129,.2)}.transcript-label{font-size:var(--font-sm);font-weight:700;color:var(--gray-600);margin-bottom:var(--space-2)}.transcript-text{font-size:var(--font-base);color:var(--gray-800);line-height:1.6}.transcript-interim{color:var(--gray-400);font-style:italic}.ai-evaluating{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-4);color:var(--primary-500);font-weight:700}.ai-spinner{width:24px;height:24px;border:3px solid var(--gray-200);border-top-color:var(--primary-500);border-radius:50%;animation:spin .8s linear infinite}.ai-feedback-card{width:100%;max-width:500px;padding:var(--space-5);background:linear-gradient(135deg,#eef2ff,#f5f3ff);border-radius:var(--radius-lg);border:2px solid var(--primary-400);box-shadow:var(--shadow-glow-primary)}.ai-feedback-header{display:flex;align-items:center;gap:var(--space-3);margin-bottom:var(--space-3)}.ai-score{font-size:var(--font-2xl);font-weight:900;background:var(--primary-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.ai-feedback-title{font-weight:800;color:var(--gray-600);font-size:var(--font-sm)}.ai-feedback-text{font-size:var(--font-base);color:var(--gray-700);font-weight:600;margin-bottom:var(--space-4);line-height:1.6}.ai-feedback-details{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-3)}.ai-detail{display:flex;flex-direction:column;align-items:center;gap:var(--space-1);text-align:center}.ai-detail-label{font-size:var(--font-xs);color:var(--gray-500);font-weight:700}.ai-detail-value{font-size:var(--font-sm);color:var(--gray-800);font-weight:800}.ai-badge{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);background:linear-gradient(135deg,#eef2ff,#f0fdf4);border-radius:var(--radius-full);font-size:var(--font-sm);font-weight:700;color:var(--primary-500);border:1px solid rgba(79,70,229,.2)}.api-key-input-row{display:flex;gap:var(--space-2);align-items:center;flex-wrap:wrap}.speaking-warning{font-size:var(--font-sm);color:var(--warning);font-weight:600;padding:var(--space-3);background:var(--warning-light);border-radius:var(--radius-md);text-align:center;max-width:400px}@media(min-width:768px)and (max-width:1200px){.tick-image-grid{grid-template-columns:repeat(3,1fr);gap:var(--space-6)}.true-false-image,.speaking-image{width:320px;height:320px}.unscramble-image{width:260px;height:260px}.letter-tile{width:64px;height:64px;font-size:var(--font-2xl)}.record-btn{width:110px;height:110px}.mc-option{padding:var(--space-4) var(--space-5);min-height:52px}.error-option{padding:var(--space-3) var(--space-6);font-size:var(--font-lg);min-height:48px}.fill-blank-input{width:240px;font-size:var(--font-xl);padding:var(--space-3) var(--space-4)}.unscramble-text-input{width:220px;font-size:var(--font-xl)}.image-placeholder-icon{font-size:5rem}}@media(max-width:767px){.dashboard-hero{grid-template-columns:1fr;padding:var(--space-5)}.dashboard-title{font-size:var(--font-3xl)}.dashboard-subtitle{font-size:var(--font-base)}.dashboard-mascot{order:-1}.dashboard-logo-img{width:150px}.dashboard-grid{grid-template-columns:1fr}.tests-section-header{align-items:stretch;flex-direction:column}.currency-pill-group{gap:var(--space-1)}.currency-pill{min-height:30px;padding:var(--space-1) var(--space-2);font-size:var(--font-xs)}.navbar-inner,.user-menu{flex-wrap:wrap}.hero-title{font-size:var(--font-3xl)}.hero-subtitle{font-size:var(--font-base)}.hero-mascot{font-size:4rem}.test-card{padding:var(--space-5)}.question-group-card{padding:var(--space-4) var(--space-5)}.tick-image-grid{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}.true-false-image,.speaking-image{width:220px;height:220px}.unscramble-image{width:180px;height:180px}.result-card{padding:var(--space-5)}.settings-grid,.settings-form-grid,.badge-reward-grid{grid-template-columns:1fr}.settings-section-header{flex-direction:column}.mission-editor-row{grid-template-columns:1fr}.mission-toggle{padding-bottom:0}}.error-analysis{margin-top:var(--space-5);text-align:left}.error-analysis-header{display:flex;align-items:center;justify-content:space-between;cursor:pointer;padding:var(--space-3) var(--space-4);background:#ef444414;border-radius:var(--radius-xl);margin-bottom:var(--space-3);transition:background .2s}.error-analysis-header:hover{background:#ef444424}.error-analysis-header h4{color:var(--error);font-size:var(--font-base);margin:0}.error-toggle{font-size:.8rem;color:var(--gray-400);transition:transform .2s}.error-summary-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-3);margin-bottom:var(--space-4)}.error-stat{text-align:center;padding:var(--space-3);border-radius:var(--radius-lg);background:var(--gray-50)}.error-stat.correct{background:#10b9811a}.error-stat.wrong{background:#ef44441a}.error-stat.accuracy{background:#4f46e51a}.error-stat-num{display:block;font-size:1.8rem;font-weight:800;line-height:1.2}.error-stat.correct .error-stat-num{color:var(--success)}.error-stat.wrong .error-stat-num{color:var(--error)}.error-stat.accuracy .error-stat-num{color:var(--primary-600)}.error-stat-label{font-size:var(--font-sm);color:var(--gray-500)}.error-section-highlights{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3);margin-bottom:var(--space-4)}.section-highlight{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3);border-radius:var(--radius-lg);font-size:var(--font-sm)}.section-highlight>span:first-child{font-size:1.5rem}.section-highlight div{display:flex;flex-direction:column;gap:2px}.section-highlight strong{color:var(--gray-700)}.section-highlight span{color:var(--gray-500);font-size:.8rem}.section-highlight.strongest{background:#10b9811a;border-left:3px solid var(--success)}.section-highlight.weakest{background:#ef444414;border-left:3px solid var(--error)}.error-type-summary{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-bottom:var(--space-4)}.error-type-chip{display:flex;align-items:center;gap:var(--space-2);padding:6px 14px;border-radius:var(--radius-full);background:var(--gray-100);font-size:var(--font-sm);font-weight:600}.error-type-count{background:var(--error);color:#fff;padding:2px 8px;border-radius:var(--radius-full);font-size:.7rem;font-weight:700}.error-detail-list{margin-top:var(--space-3)}.error-section-group{margin-bottom:var(--space-4)}.error-section-title{color:var(--gray-700);font-size:var(--font-base);margin-bottom:var(--space-2);padding-bottom:var(--space-1);border-bottom:1px solid var(--gray-200)}.error-item{background:#ef44440a;border:1px solid rgba(239,68,68,.12);border-radius:var(--radius-lg);padding:var(--space-3);margin-bottom:var(--space-2)}.error-item.compact{padding:var(--space-2) var(--space-3)}.error-item-header{display:flex;align-items:center;gap:var(--space-2);margin-bottom:var(--space-1)}.error-q-num{background:var(--error);color:#fff;font-size:.7rem;font-weight:700;padding:2px 8px;border-radius:var(--radius-full)}.error-type-badge{font-size:.75rem;color:var(--gray-500);font-weight:600}.error-content{font-size:var(--font-sm);color:var(--gray-700);margin:var(--space-1) 0}.error-answers{display:flex;gap:var(--space-4);font-size:var(--font-sm)}.error-answer{display:flex;align-items:center;gap:var(--space-1)}.error-answer.wrong{color:var(--error)}.error-answer.correct{color:var(--success);font-weight:600}.answer-label{font-weight:700}.level-tips{margin-top:var(--space-4);padding:var(--space-4);background:#4f46e50f;border-radius:var(--radius-xl);border-left:4px solid var(--primary-500)}.level-tips h5{color:var(--primary-600);margin-bottom:var(--space-3)}.level-tip-item{padding:var(--space-2) 0;color:var(--gray-600);font-size:var(--font-sm);line-height:1.6;border-bottom:1px solid rgba(79,70,229,.08)}.level-tip-item:last-child{border-bottom:none}.perfect-score{text-align:center;font-size:1.2rem;font-weight:700;color:var(--success);padding:var(--space-4);background:#10b9811a;border-radius:var(--radius-xl);margin-top:var(--space-4)}.result-level-badge{font-size:var(--font-sm);color:var(--gray-500);margin-top:var(--space-2)}.history-page{position:relative;z-index:1}.history-empty{text-align:center;padding:var(--space-8);margin-top:var(--space-6)}.history-empty h3{color:var(--gray-600);margin-bottom:var(--space-2)}.history-list{display:flex;flex-direction:column;gap:var(--space-3);margin-top:var(--space-4)}.history-card{padding:0;overflow:hidden;transition:box-shadow .2s}.history-card:hover,.history-card.expanded{box-shadow:var(--shadow-lg)}.history-card-header{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-4);cursor:pointer;transition:background .2s}.history-card-header:hover{background:#4f46e50a}.history-badge{font-size:2rem}.history-info{flex:1}.history-title{font-weight:700;color:var(--gray-800)}.history-meta{display:flex;gap:var(--space-3);font-size:var(--font-sm);color:var(--gray-500);margin-top:2px}.history-score-col{text-align:right}.history-percentage{font-size:1.4rem;font-weight:800;line-height:1}.history-points{font-size:var(--font-sm);color:var(--gray-400)}.history-details{padding:0 var(--space-4) var(--space-4);border-top:1px solid var(--gray-100)}.history-section-scores{display:flex;flex-direction:column;gap:var(--space-2);margin-top:var(--space-3)}.history-section-row{display:flex;align-items:center;gap:var(--space-3);font-size:var(--font-sm)}.history-section-row>span:first-child{flex:1;color:var(--gray-600)}.history-section-bar-wrap{flex:2;height:8px;background:var(--gray-100);border-radius:var(--radius-full);overflow:hidden}.history-section-bar{height:100%;border-radius:var(--radius-full);transition:width .5s ease}.history-section-score{width:50px;text-align:right;font-weight:600;color:var(--gray-600);font-size:.8rem}.loading-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--space-8) var(--space-4);gap:var(--space-4);color:var(--gray-500);font-size:var(--font-base)}.loading-spinner{width:40px;height:40px;border:4px solid var(--gray-200);border-top-color:var(--primary-500);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.empty-state{text-align:center;padding:var(--space-8) var(--space-4);color:var(--gray-500);font-size:var(--font-base)}.back-link{display:inline-block;color:#ffffffb3;font-weight:700;font-size:var(--font-sm);margin-bottom:var(--space-2);transition:color var(--transition-fast)}.back-link:hover{color:#fff}.user-create-section{margin-bottom:var(--space-6)}.user-create-form{display:flex;flex-direction:column;gap:var(--space-4)}.user-form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--space-4)}.avatar-grid.compact{gap:var(--space-1)}.avatar-grid.compact .avatar-option{width:40px;height:40px;font-size:1.2rem}.role-selector{display:flex;gap:var(--space-2);flex-wrap:wrap}.role-option{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);border-radius:var(--radius-full);border:2px solid var(--gray-200);background:#fff;font-weight:700;font-size:var(--font-sm);cursor:pointer;transition:all var(--transition-normal);font-family:inherit;color:var(--gray-600)}.role-option:hover{border-color:var(--role-color, var(--gray-400));background:color-mix(in srgb,var(--role-color, var(--gray-400)) 8%,white)}.role-option.selected{border-color:var(--role-color, var(--primary-500));background:color-mix(in srgb,var(--role-color, var(--primary-500)) 12%,white);color:var(--role-color, var(--primary-500));box-shadow:0 0 0 3px color-mix(in srgb,var(--role-color, var(--primary-500)) 15%,transparent)}.role-option-icon{font-size:1.1rem}.form-success{padding:var(--space-3);background:#ecfdf5;border-radius:var(--radius-md);color:#059669;font-weight:700;font-size:var(--font-sm)}.user-toolbar{display:flex;align-items:center;gap:var(--space-4);margin-bottom:var(--space-5);flex-wrap:wrap}.user-search{position:relative;flex:1;min-width:200px}.user-search .search-icon{position:absolute;left:var(--space-3);top:50%;transform:translateY(-50%);font-size:var(--font-base);pointer-events:none}.user-search .form-input{padding-left:2.5rem}.user-filter-tabs{display:flex;gap:var(--space-1);background:#ffffff26;border-radius:var(--radius-full);padding:3px;flex-wrap:wrap}.filter-tab{padding:var(--space-1) var(--space-3);border-radius:var(--radius-full);font-weight:700;font-size:var(--font-xs);background:transparent;color:#ffffffb3;cursor:pointer;transition:all var(--transition-normal);border:none;font-family:inherit;white-space:nowrap}.filter-tab:hover{color:#fff;background:#ffffff1a}.filter-tab.active{background:#fff;color:var(--primary-500);box-shadow:var(--shadow-sm)}.user-list{display:flex;flex-direction:column;gap:var(--space-2)}.user-card{padding:var(--space-3) var(--space-5);display:flex;align-items:center;gap:var(--space-4)}.user-card-avatar{font-size:2rem;width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:var(--gray-50);border-radius:var(--radius-md);flex-shrink:0}.user-card-info{flex:1;min-width:0}.user-card-name{font-weight:800;color:var(--gray-800);font-size:var(--font-base);display:flex;align-items:center;gap:var(--space-2)}.you-badge{padding:1px 8px;background:var(--primary-gradient);color:#fff;font-size:var(--font-xs);font-weight:700;border-radius:var(--radius-full)}.user-card-id{font-size:var(--font-xs);color:var(--gray-400);font-family:monospace}.user-card-role{min-width:130px;display:flex;align-items:center}.user-role-badge{padding:4px 12px;background:linear-gradient(135deg,var(--role-color, #3B82F6),color-mix(in srgb,var(--role-color, #3B82F6) 80%,#000));border-radius:var(--radius-full);color:#fff;font-size:var(--font-xs);font-weight:700;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap}.role-badge-btn{background:none;border:none;cursor:pointer;padding:0;transition:transform var(--transition-fast)}.role-badge-btn:hover:not(:disabled){transform:scale(1.05)}.role-badge-btn:disabled{cursor:default;opacity:.8}.role-edit-dropdown{display:flex;align-items:center;gap:var(--space-1)}.role-edit-dropdown .form-input{padding:var(--space-1) var(--space-2);font-size:var(--font-sm);width:auto;min-width:120px}.user-card-date{font-size:var(--font-sm);color:var(--gray-400);font-weight:600;min-width:90px;text-align:right}@media(max-width:768px){.user-card{flex-wrap:wrap;padding:var(--space-3);gap:var(--space-2)}.user-card-role{min-width:auto}.user-card-date{min-width:auto;text-align:left}.user-toolbar{flex-direction:column;align-items:stretch}.user-filter-tabs{justify-content:center}.user-form-grid{grid-template-columns:1fr}}.media-uploader{display:flex;flex-direction:column;gap:var(--space-2)}.media-dropzone{border:2px dashed var(--gray-300);border-radius:var(--radius-lg);padding:var(--space-6) var(--space-4);display:flex;flex-direction:column;align-items:center;gap:var(--space-2);cursor:pointer;transition:all var(--transition-normal);background:var(--gray-50);text-align:center}.media-dropzone:hover{border-color:var(--primary-400);background:#eef2ff}.media-dropzone.drag-over{border-color:var(--primary-500);background:#eef2ff;box-shadow:0 0 0 3px #4f46e526;transform:scale(1.01)}.media-dropzone.uploading{pointer-events:none;opacity:.8}.media-dropzone-icon{font-size:2.5rem}.media-dropzone-text{font-weight:700;color:var(--gray-600);font-size:var(--font-sm)}.media-dropzone-hint{font-size:var(--font-xs);color:var(--gray-400)}.media-uploader.compact .media-dropzone{padding:var(--space-3) var(--space-3);flex-direction:row;gap:var(--space-2)}.media-uploader.compact .media-dropzone-icon{font-size:1.5rem}.media-uploader.compact .media-dropzone-text{font-size:var(--font-xs)}.media-uploader.compact .media-dropzone-hint{display:none}.media-upload-progress{width:100%;display:flex;flex-direction:column;gap:var(--space-2);align-items:center}.media-progress-bar{width:100%;max-width:200px;height:6px;background:var(--gray-200);border-radius:var(--radius-full);overflow:hidden}.media-progress-fill{height:100%;background:var(--primary-gradient);border-radius:var(--radius-full);transition:width .3s ease}.media-progress-text{font-size:var(--font-xs);font-weight:700;color:var(--primary-500)}.media-uploader-preview{display:flex;flex-direction:column;gap:var(--space-2);border:2px solid var(--gray-200);border-radius:var(--radius-lg);padding:var(--space-3);background:#fff}.media-uploader-preview.compact{flex-direction:row;align-items:center;padding:var(--space-2)}.media-preview-image{border-radius:var(--radius-md);overflow:hidden;max-height:160px;display:flex;align-items:center;justify-content:center;background:var(--gray-50)}.media-uploader-preview.compact .media-preview-image{max-height:60px;width:60px;flex-shrink:0}.media-preview-image img{max-width:100%;max-height:160px;object-fit:contain}.media-uploader-preview.compact .media-preview-image img{max-height:60px}.media-preview-audio{width:100%}.media-preview-audio audio{width:100%;height:36px;border-radius:var(--radius-md)}.media-preview-actions{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2)}.media-preview-url{font-size:var(--font-xs);color:var(--gray-500);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:200px}.media-url-toggle{display:flex;flex-direction:column}.media-url-btn{background:none;border:none;color:var(--gray-400);font-size:var(--font-xs);font-weight:600;cursor:pointer;padding:0;text-align:left;font-family:inherit;transition:color var(--transition-fast)}.media-url-btn:hover{color:var(--primary-500)}.media-paste-btn{color:var(--primary-400)!important}.media-paste-btn:hover{color:var(--primary-600)!important}.media-upload-error{font-size:var(--font-xs);color:var(--error);font-weight:700}.matching-container{display:flex;flex-direction:column;gap:var(--space-5)}.matching-columns{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-5)}@media(max-width:768px){.matching-columns{grid-template-columns:1fr}}.matching-column{display:flex;flex-direction:column;gap:var(--space-2)}.matching-column-header{font-size:var(--font-base);font-weight:800;color:var(--gray-500);text-transform:uppercase;letter-spacing:1px;padding:var(--space-2) var(--space-3);border-bottom:2px solid var(--gray-200);margin-bottom:var(--space-2)}.matching-item{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);border:2px solid var(--gray-200);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-normal);background:#fff;position:relative;min-height:52px}.matching-item:hover{border-color:var(--primary-400);background:#f5f3ff;transform:translateY(-1px)}.matching-item.selected{border-color:var(--primary-500);background:#eef2ff;box-shadow:0 0 0 3px #4f46e526}.matching-item.matched{border-color:var(--success);background:var(--success-light)}.matching-item.highlighted{border-color:var(--accent-yellow);background:#fffbeb;animation:gentle-pulse 1.5s ease-in-out infinite}@keyframes gentle-pulse{0%,to{box-shadow:0 0 #f59e0b1a}50%{box-shadow:0 0 0 6px #f59e0b26}}.matching-item-number{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-full);background:var(--primary-gradient);color:#fff;font-weight:800;font-size:var(--font-sm);flex-shrink:0}.matching-item-letter{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-full);background:var(--gray-100);color:var(--gray-600);font-weight:800;font-size:var(--font-sm);flex-shrink:0;text-transform:uppercase}.matching-item.matched .matching-item-letter{background:var(--success);color:#fff}.matching-item-text{font-weight:600;font-size:var(--font-base);color:var(--gray-700);flex:1}.matching-word .matching-item-text{font-weight:800;font-size:var(--font-lg)}.matching-clear-btn{width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-full);background:var(--error-light);color:var(--error);font-weight:800;font-size:var(--font-xs);cursor:pointer;transition:all var(--transition-normal);border:none;flex-shrink:0}.matching-clear-btn:hover{background:var(--error);color:#fff;transform:scale(1.1)}.matching-link-badge{width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-full);background:var(--success);color:#fff;font-weight:800;font-size:var(--font-xs);text-transform:uppercase;flex-shrink:0}.matching-summary{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-4);background:var(--gray-50);border-radius:var(--radius-md);border:1px solid var(--gray-200)}.matching-summary-item{display:flex;align-items:center;gap:var(--space-2);font-size:var(--font-sm);color:var(--gray-400);padding:var(--space-1) 0}.matching-summary-item.done{color:var(--gray-700)}.matching-summary-num{width:24px;height:24px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-full);background:var(--gray-200);font-weight:800;font-size:var(--font-xs);flex-shrink:0}.matching-summary-item.done .matching-summary-num{background:var(--success);color:#fff}.matching-summary-word{font-weight:700;min-width:80px}.matching-summary-arrow{color:var(--gray-300);font-weight:700}.matching-summary-item.done .matching-summary-arrow{color:var(--success)}.matching-summary-def{font-style:italic;color:var(--gray-500);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:300px}.matching-summary-item.done .matching-summary-def{color:var(--gray-600)}
