*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:Nunito,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background-color:var(--bg);color:var(--text-primary);line-height:1.5;min-height:100vh;overflow-x:hidden}img,svg{max-width:100%;display:block}button{font-family:inherit;cursor:pointer;border:none;outline:none;font-size:inherit}input,textarea{font-family:inherit;font-size:inherit;outline:none;border:none}a{text-decoration:none;color:inherit}ul,ol{list-style:none}:root{--primary: #58CC02;--primary-dark: #58A700;--primary-light: #7AE033;--primary-glow: rgba(88, 204, 2, .3);--error: #FF4B4B;--error-dark: #EA2B2B;--error-glow: rgba(255, 75, 75, .3);--gold: #FFC800;--gold-dark: #E6B400;--gold-glow: rgba(255, 200, 0, .3);--info: #1CB0F6;--info-dark: #1899D6;--info-glow: rgba(28, 176, 246, .3);--purple: #CE82FF;--purple-dark: #B366E6;--purple-glow: rgba(206, 130, 255, .3);--bg: #131F24;--bg-elevated: #1A2B32;--surface: #1A2B32;--surface-light: #233A44;--surface-lighter: #2D4A56;--text-primary: #FFFFFF;--text-secondary: #8BA4AE;--text-muted: #5A7A86;--border: #37464F;--border-light: #2D3D45;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 20px;--radius-full: 9999px;--shadow-sm: 0 2px 8px rgba(0, 0, 0, .2);--shadow-md: 0 4px 16px rgba(0, 0, 0, .3);--shadow-lg: 0 8px 32px rgba(0, 0, 0, .4);--shadow-glow-green: 0 0 20px rgba(88, 204, 2, .2);--shadow-glow-gold: 0 0 20px rgba(255, 200, 0, .2);--transition-fast: .15s ease;--transition: .25s ease;--transition-slow: .4s ease;--space-xs: 4px;--space-sm: 8px;--space-md: 16px;--space-lg: 24px;--space-xl: 32px;--space-2xl: 48px;--space-3xl: 64px;--z-dropdown: 100;--z-sticky: 200;--z-modal-backdrop: 300;--z-modal: 400;--z-toast: 500;--z-confetti: 600}:root.theme-light{--bg: #F5F7FB;--bg-elevated: #FFFFFF;--surface: #FFFFFF;--surface-light: #F1F5F9;--surface-lighter: #E2E8F0;--text-primary: #102A43;--text-secondary: #486581;--text-muted: #697B8C;--border: #D9E2EC;--border-light: #E2E8F0}:root.theme-dark{--bg: #131F24;--bg-elevated: #1A2B32;--surface: #1A2B32;--surface-light: #233A44;--surface-lighter: #2D4A56;--text-primary: #FFFFFF;--text-secondary: #8BA4AE;--text-muted: #5A7A86;--border: #37464F;--border-light: #2D3D45}:root.theme-auto{color-scheme:dark}@media (prefers-color-scheme: light){:root.theme-auto{--bg: #F5F7FB;--bg-elevated: #FFFFFF;--surface: #FFFFFF;--surface-light: #F1F5F9;--surface-lighter: #E2E8F0;--text-primary: #102A43;--text-secondary: #486581;--text-muted: #697B8C;--border: #D9E2EC;--border-light: #E2E8F0}}@media (prefers-color-scheme: dark){:root.theme-auto{--bg: #131F24;--bg-elevated: #1A2B32;--surface: #1A2B32;--surface-light: #233A44;--surface-lighter: #2D4A56;--text-primary: #FFFFFF;--text-secondary: #8BA4AE;--text-muted: #5A7A86;--border: #37464F;--border-light: #2D3D45}}.glass{background:rgba(26,43,50,.7);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--border)}.glass-light{background:rgba(35,58,68,.6);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid var(--border-light)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-sm);padding:12px 24px;border-radius:var(--radius-md);font-weight:700;font-size:1rem;transition:all var(--transition);position:relative;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.btn:active{transform:scale(.96)}.btn-primary{background:var(--primary);color:#fff;box-shadow:0 4px 0 var(--primary-dark),var(--shadow-sm)}.btn-primary:hover{background:var(--primary-light);transform:translateY(-1px);box-shadow:0 5px 0 var(--primary-dark),var(--shadow-md)}.btn-primary:active{transform:translateY(2px) scale(.98);box-shadow:0 2px 0 var(--primary-dark)}.btn-secondary{background:transparent;color:var(--primary);border:2px solid var(--primary)}.btn-secondary:hover{background:rgba(88,204,2,.1)}.btn-danger{background:var(--error);color:#fff;box-shadow:0 4px 0 var(--error-dark),var(--shadow-sm)}.btn-info{background:var(--info);color:#fff;box-shadow:0 4px 0 var(--info-dark),var(--shadow-sm)}.btn-gold{background:var(--gold);color:#1a1a1a;box-shadow:0 4px 0 var(--gold-dark),var(--shadow-sm)}.btn-lg{padding:16px 32px;font-size:1.125rem;border-radius:var(--radius-lg)}.btn-sm{padding:8px 16px;font-size:.875rem}.card{background:var(--surface);border-radius:var(--radius-lg);border:1px solid var(--border);padding:var(--space-lg);transition:all var(--transition)}.card-elevated{background:var(--surface-light);box-shadow:var(--shadow-md)}.card:hover{border-color:var(--border-light)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInRight{0%{opacity:0;transform:translate(30px)}to{opacity:1;transform:translate(0)}}@keyframes slideInLeft{0%{opacity:0;transform:translate(-30px)}to{opacity:1;transform:translate(0)}}@keyframes slideInUp{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}@keyframes pulseScale{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-4px)}20%,40%,60%,80%{transform:translate(4px)}}@keyframes glow{0%,to{box-shadow:0 0 8px var(--primary-glow)}50%{box-shadow:0 0 20px var(--primary-glow),0 0 40px var(--primary-glow)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-15px)}}@keyframes countUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes heartLose{0%{transform:scale(1);opacity:1}50%{transform:scale(1.5);opacity:.5}to{transform:scale(0) translateY(-40px);opacity:0}}@keyframes starBurst{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 progressFill{0%{width:0}}@keyframes confettiPiece{0%{transform:translateY(0) rotate(0) rotateX(0);opacity:1}to{transform:translateY(100vh) rotate(720deg) rotateX(360deg);opacity:0}}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--bg)}::-webkit-scrollbar-thumb{background:var(--border);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}#root{min-height:100vh;display:flex;flex-direction:column}.text-gradient{background:linear-gradient(135deg,var(--primary),var(--info));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.text-gradient-gold{background:linear-gradient(135deg,var(--gold),#FF9500);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}::selection{background:var(--primary);color:#fff}:focus-visible{outline:2px solid var(--primary);outline-offset:2px}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.landing-page{background-color:#131f24;color:#fff;min-height:100vh;font-family:Nunito,sans-serif;overflow-x:hidden;padding-bottom:20px}.landing-header{display:flex;justify-content:space-between;align-items:center;padding:20px 40px;max-width:1200px;margin:0 auto;border-bottom:1px solid #202F36}.logo-container{display:flex;align-items:center;gap:10px}.logo-icon{font-size:32px}.logo-text{font-size:24px;font-weight:800;color:#58cc02;letter-spacing:-.5px}.nav-btn{padding:8px 20px;font-weight:700}.btn{border-radius:12px;font-family:inherit;font-weight:700;cursor:pointer;transition:all .2s ease;text-transform:uppercase;letter-spacing:.8px;font-size:14px;border:none}.btn-primary{background-color:#58cc02;color:#fff;border-bottom:4px solid #46A302}.btn-primary:hover{background-color:#61e002;transform:translateY(-2px)}.btn-primary:active{border-bottom:0px solid transparent;transform:translateY(2px)}.btn-secondary{background-color:#1cb0f6;color:#fff;border-bottom:4px solid #1899D6}.btn-secondary:hover{background-color:#24c0ff;transform:translateY(-2px)}.btn-secondary:active{border-bottom:0px solid transparent;transform:translateY(2px)}.btn-outline{background-color:transparent;color:#1cb0f6;border:2px solid #202F36;border-bottom:4px solid #202F36}.btn-outline:hover{background-color:#1cb0f61a;border-color:#1cb0f6;color:#fff}.btn-lg{padding:16px 32px;font-size:16px}.hero-section{display:flex;align-items:center;justify-content:space-between;max-width:1200px;margin:60px auto;padding:0 40px;gap:40px}.hero-content{flex:1.2;text-align:left}.hero-title{font-size:52px;font-weight:800;line-height:1.15;margin-bottom:20px;letter-spacing:-1.5px}.gradient-text{background:linear-gradient(135deg,#58CC02 0%,#1CB0F6 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.hero-subtitle{font-size:20px;color:#afbbbf;line-height:1.5;margin-bottom:35px;font-weight:500}.hero-ctas{display:flex;gap:20px;flex-wrap:wrap}.hero-mascot-container{flex:.8;display:flex;justify-content:center;align-items:center}.mascot-wrapper{position:relative;width:250px;height:250px;display:flex;justify-content:center;align-items:center}.mascot-emoji{font-size:160px;z-index:2;animation:float-animation 6s ease-in-out infinite}.mascot-glow{position:absolute;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,rgba(88,204,2,.25) 0%,rgba(0,0,0,0) 70%);filter:blur(10px);z-index:1}.stats-bar{display:flex;justify-content:space-around;align-items:center;background:rgba(26,43,50,.6);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:2px solid #202F36;border-radius:20px;padding:30px;max-width:1000px;margin:40px auto;opacity:0;transform:translateY(30px);transition:all .8s ease}.stat-item{display:flex;flex-direction:column;align-items:center}.stat-number{font-size:36px;font-weight:800;color:#58cc02}.stat-label{font-size:14px;color:#afbbbf;font-weight:700;margin-top:5px}.stat-divider{width:2px;height:50px;background-color:#202f36}.features-section{max-width:1200px;margin:100px auto;padding:0 40px;opacity:0;transform:translateY(30px);transition:all .8s ease}.section-title{font-size:36px;font-weight:800;text-align:center;margin-bottom:50px}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:30px}.feature-card{background:rgba(26,43,50,.4);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border:2px solid #202F36;border-radius:24px;padding:30px;text-align:center;transition:all .3s ease}.feature-card:hover{transform:translateY(-8px);border-color:#58cc02;box-shadow:0 10px 20px #58cc021a}.feature-icon{font-size:48px;margin-bottom:20px}.feature-card-title{font-size:22px;font-weight:800;margin-bottom:12px;color:#fff}.feature-card-desc{font-size:15px;color:#afbbbf;line-height:1.5}.how-it-works{max-width:1000px;margin:100px auto;padding:0 40px;opacity:0;transform:translateY(30px);transition:all .8s ease}.steps-container{display:flex;justify-content:space-between;position:relative;gap:40px;margin-top:40px}.steps-container:before{content:"";position:absolute;top:30px;left:10%;right:10%;height:2px;background-color:#202f36;z-index:1}.step-item{flex:1;display:flex;flex-direction:column;align-items:center;text-align:center;position:relative;z-index:2}.step-number{width:60px;height:60px;border-radius:50%;background-color:#1a2b32;border:4px solid #202F36;color:#58cc02;font-size:24px;font-weight:800;display:flex;align-items:center;justify-content:center;margin-bottom:20px;box-shadow:0 0 15px #0000004d}.step-title{font-size:18px;font-weight:800;margin-bottom:10px}.step-desc{font-size:14px;color:#afbbbf;line-height:1.4}.languages-section{max-width:800px;margin:100px auto;padding:0 40px;opacity:0;transform:translateY(30px);transition:all .8s ease}.languages-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.lang-item{background:rgba(26,43,50,.3);border:2px solid #202F36;border-radius:20px;padding:20px;display:flex;flex-direction:column;align-items:center;gap:10px;cursor:pointer;transition:all .2s ease}.lang-item:hover{border-color:#1cb0f6;transform:scale(1.05)}.lang-flag{font-size:40px}.lang-name{font-size:15px;font-weight:700}.testimonials-section{max-width:1200px;margin:100px auto;padding:0 40px;opacity:0;transform:translateY(30px);transition:all .8s ease}.testimonials-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:30px}.testimonial-card{background:rgba(26,43,50,.4);border:2px solid #202F36;border-radius:24px;padding:30px;display:flex;flex-direction:column;justify-content:space-between;text-align:left}.user-rating{color:#ffc800;font-size:16px;margin-bottom:15px}.testimonial-quote{font-size:15px;line-height:1.5;color:#e2e8f0;font-style:italic;margin-bottom:20px}.user-info{display:flex;align-items:center;gap:12px}.user-avatar{font-size:32px;background:#1A2B32;width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center}.user-name{font-weight:800;font-size:15px}.user-level{font-size:12px;color:#afbbbf;font-weight:700}.landing-footer{background:linear-gradient(180deg,#131F24 0%,#0A1012 100%);padding:80px 40px 40px;text-align:center;border-top:2px solid #202F36}.footer-title{font-size:36px;font-weight:800;margin-bottom:15px}.footer-subtitle{font-size:18px;color:#afbbbf;margin-bottom:30px}.btn-footer-cta{padding:18px 48px;font-size:18px}.footer-info{margin-top:80px;font-size:14px;color:#4b5a60;border-top:1px solid #1A2B32;padding-top:30px}@keyframes float-animation{0%{transform:translateY(0) rotate(0)}50%{transform:translateY(-15px) rotate(2deg)}to{transform:translateY(0) rotate(0)}}.pulse-animation{animation:pulse-ring 2s cubic-bezier(.4,0,.6,1) infinite}@keyframes pulse-ring{0%,to{transform:scale(1);box-shadow:0 0 #58cc0266}50%{transform:scale(1.03);box-shadow:0 0 0 10px #58cc0200}}.visible{opacity:1!important;transform:translateY(0)!important}@media (max-width: 900px){.hero-section{flex-direction:column;text-align:center;margin:40px auto}.hero-content{text-align:center}.hero-title{font-size:40px}.hero-ctas{justify-content:center}.mascot-emoji{font-size:120px}.steps-container{flex-direction:column;gap:30px}.steps-container:before{display:none}.languages-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width: 480px){.landing-header{padding:15px 20px}.logo-text{font-size:20px}.hero-section{padding:0 20px}.hero-title{font-size:32px}.hero-subtitle{font-size:16px}.hero-ctas{flex-direction:column}.btn-lg{width:100%}.stats-bar{flex-direction:column;gap:20px;padding:20px;margin:20px}.stat-divider{width:50px;height:2px}.features-section{padding:0 20px}.section-title{font-size:28px}.languages-grid{grid-template-columns:1fr}}.onboarding-page{background-color:#131f24;color:#fff;min-height:100vh;font-family:Nunito,sans-serif;display:flex;flex-direction:column;align-items:center;padding:20px}.onboarding-header{width:100%;max-width:600px;display:flex;align-items:center;justify-content:space-between;margin-bottom:40px;gap:15px}.back-btn{background:none;border:none;color:#afbbbf;font-size:24px;font-weight:700;cursor:pointer;padding:0 10px}.back-btn:hover{color:#fff}.progress-bar-container{flex:1;height:16px;background-color:#202f36;border-radius:8px;overflow:hidden}.progress-bar-fill{height:100%;background-color:#58cc02;border-radius:8px;transition:width .3s cubic-bezier(.4,0,.2,1);box-shadow:0 0 8px #58cc02}.step-counter{font-size:14px;color:#afbbbf;font-weight:700}.onboarding-content-container{width:100%;max-width:500px;flex:1;display:flex;align-items:center;justify-content:center}.onboarding-step{width:100%;display:flex;flex-direction:column;align-items:center;text-align:center;animation:slide-in .4s cubic-bezier(.4,0,.2,1) forwards}.step-title{font-size:28px;font-weight:800;margin-bottom:12px;letter-spacing:-.5px}.step-subtitle{font-size:16px;color:#afbbbf;margin-bottom:35px;line-height:1.4}.welcome-mascot{font-size:100px;margin-bottom:24px;animation:welcome-bounce 3s infinite ease-in-out}.options-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;width:100%;margin-bottom:35px}.grid-3x2{grid-template-rows:repeat(3,1fr)}.option-card{background-color:#1a2b32;border:2px solid #202F36;border-bottom:5px solid #202F36;border-radius:16px;padding:16px;display:flex;align-items:center;gap:12px;cursor:pointer;transition:all .15s ease;-webkit-user-select:none;user-select:none}.option-card:hover{background-color:#1cb0f60d;border-color:#1cb0f6}.option-card.selected{background-color:#1cb0f61a;border-color:#1cb0f6;border-bottom-color:#1cb0f6;transform:translateY(2px)}.card-emoji{font-size:28px}.card-label{font-size:16px;font-weight:700;color:#fff}.options-list{display:flex;flex-direction:column;gap:12px;width:100%;margin-bottom:35px}.list-option-card{background-color:#1a2b32;border:2px solid #202F36;border-bottom:5px solid #202F36;border-radius:16px;padding:16px 20px;display:flex;justify-content:space-between;align-items:center;cursor:pointer;transition:all .15s ease}.list-option-card:hover{background-color:#58cc020d;border-color:#58cc02}.list-option-card.selected{background-color:#58cc021a;border-color:#58cc02;border-bottom-color:#58cc02;transform:translateY(2px)}.list-option-label{font-size:16px;font-weight:700}.list-option-desc{font-size:14px;color:#afbbbf;font-weight:700}.level-buttons{display:flex;gap:15px;width:100%;margin-bottom:30px}.level-btn{flex:1;background-color:#1a2b32;border:2px solid #202F36;border-bottom:5px solid #202F36;color:#fff;border-radius:16px;padding:16px;font-family:inherit;font-weight:700;font-size:15px;cursor:pointer;transition:all .15s ease}.level-btn:hover{border-color:#1cb0f6}.level-btn.disabled,.level-btn:disabled{opacity:.5;cursor:not-allowed;border-color:#444;color:#888}.level-btn.active{background-color:#1cb0f61a;border-color:#1cb0f6;border-bottom-color:#1cb0f6;transform:translateY(2px)}.test-panel{background-color:#17282d;border:2px solid #202f36;border-radius:20px;padding:18px;margin-bottom:20px}.test-question-card{margin-bottom:18px}.question-index{font-size:12px;color:#8aa0ae;margin-bottom:8px}.question-text{font-size:15px;font-weight:700;margin-bottom:12px}.question-options{display:grid;gap:10px}.option-btn{width:100%;text-align:left;background-color:#1a2b32;border:2px solid #202f36;border-radius:14px;padding:12px 14px;color:#fff;cursor:pointer;transition:all .15s ease}.option-btn:hover{background-color:#1cb0f614;border-color:#1cb0f6}.option-btn.selected{background-color:#1cb0f624;border-color:#1cb0f6}.test-result{margin-top:14px;padding:14px;background-color:#1cb0f614;border:1px solid rgba(28,176,246,.15);border-radius:14px;color:#d0f4ff}.level-note{margin-top:12px;font-size:13px;color:#afbbbf}.registration-form{width:100%;background:rgba(26,43,50,.4);border:2px solid #202F36;border-radius:20px;padding:20px;margin-bottom:30px;text-align:left}.form-heading{font-size:18px;font-weight:800;margin-bottom:15px}.input-group{margin-bottom:15px}.input-group:last-child{margin-bottom:0}.input-label{display:block;font-size:12px;font-weight:800;color:#afbbbf;text-transform:uppercase;margin-bottom:6px}.form-input{width:100%;background-color:#131f24;border:2px solid #202F36;border-radius:12px;padding:12px 16px;color:#fff;font-family:inherit;font-size:15px;font-weight:600;outline:none;transition:border-color .2s}.form-input:focus{border-color:#58cc02}.btn-block{width:100%}.btn-continue{margin-top:10px}@keyframes slide-in{0%{opacity:0;transform:translate(40px)}to{opacity:1;transform:translate(0)}}@keyframes welcome-bounce{0%,to{transform:translateY(0) scale(1)}50%{transform:translateY(-12px) scale(1.05)}}.animate-fade{animation:fade-in .6s ease forwards}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.bottom-nav{position:fixed;bottom:0;left:0;right:0;height:72px;background:rgba(26,43,50,.85);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:2px solid #3f4f56;z-index:1000;display:flex;justify-content:center;align-items:center;padding-bottom:env(safe-area-inset-bottom,0px)}.bottom-nav-container{width:100%;max-width:600px;display:grid;grid-template-columns:repeat(5,1fr);height:100%}.bottom-nav-tab{background:none;border:none;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#afbbbf;cursor:pointer;position:relative;transition:all .2s cubic-bezier(.4,0,.2,1);padding:8px 0;gap:4px}.bottom-nav-tab:hover{color:#fff;transform:translateY(-2px)}.bottom-nav-icon{font-size:22px;transition:transform .2s ease}.bottom-nav-tab:active .bottom-nav-icon{transform:scale(.85)}.bottom-nav-label{font-size:11px;font-weight:700;letter-spacing:.5px;text-transform:uppercase}.bottom-nav-tab.active{color:#58cc02}.bottom-nav-tab.active .bottom-nav-icon{transform:translateY(-2px) scale(1.1)}.bottom-nav-indicator{position:absolute;bottom:6px;width:4px;height:4px;border-radius:50%;background-color:#58cc02;box-shadow:0 0 8px #58cc02}@media (max-width: 480px){.bottom-nav{height:64px}.bottom-nav-icon{font-size:18px}.bottom-nav-label{font-size:9px}}.dashboard-page{background-color:#131f24;color:#fff;min-height:100vh;padding-bottom:90px;font-family:Nunito,sans-serif}.dashboard-header{position:sticky;top:0;background-color:#131f24f2;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:2px solid #202F36;z-index:100;display:flex;justify-content:space-between;align-items:center;padding:12px 30px;max-width:1000px;margin:0 auto}.dashboard-header-left{display:flex;align-items:center;gap:10px;cursor:pointer}.course-flag{font-size:24px}.course-name{font-size:16px;font-weight:800;color:#e2e8f0}.dashboard-header-right{display:flex;gap:20px}.header-stat{display:flex;align-items:center;gap:6px;background-color:#1a2b32;border:1px solid #202F36;border-radius:12px;padding:6px 12px;font-weight:800}.stat-icon{font-size:18px}.stat-val{font-size:14px}.streak-val{color:#ff9600}.gems-val{color:#1cb0f6}.hearts-val{color:#ff4b4b}.dashboard-main-content{max-width:1000px;margin:20px auto 0;padding:0 20px}.dashboard-grid-layout{display:grid;grid-template-columns:3fr 2fr;gap:30px;align-items:start}.path-column{display:flex;flex-direction:column;gap:40px}.unit-section{display:flex;flex-direction:column;align-items:center;width:100%}.unit-banner{width:100%;border-radius:20px;padding:20px 24px;display:flex;justify-content:space-between;align-items:center;box-shadow:0 8px 16px #0003;margin-bottom:30px}.unit-banner-left{text-align:left;flex:1}.unit-banner-title{font-size:22px;font-weight:800;color:#fff;margin:0 0 6px}.unit-banner-desc{font-size:14px;color:#ffffffd9;margin:0;font-weight:600}.unit-banner-right{display:flex;align-items:center;gap:15px}.unit-banner-icon{font-size:40px}.unit-progress-circle{width:50px;height:50px;border-radius:50%;border:4px solid rgba(255,255,255,.3);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px}.lessons-path-container{display:flex;flex-direction:column;align-items:center;gap:20px;width:100%;position:relative;padding:10px 0}.lesson-node-wrapper{display:flex;flex-direction:column;align-items:center;z-index:10;position:relative}.lesson-node-btn{width:68px;height:68px;border-radius:50%;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 6px #00000026;transition:all .15s ease;outline:none}.lesson-node-btn:hover{transform:translateY(-2px);filter:brightness(1.05)}.lesson-node-btn:active{transform:translateY(4px);box-shadow:0 2px #00000026}.lesson-node-emoji{font-size:28px}.lesson-node-name{font-size:12px;font-weight:800;color:#afbbbf;margin-top:8px;max-width:120px;text-align:center;line-height:1.2}.lesson-node-locked{background-color:#3b4d54;border-bottom:5px solid #28373B;cursor:not-allowed;opacity:.85}.lesson-node-completed{background-color:#ffc800;border-bottom:5px solid #E6A100}.lesson-node-current{background-color:#58cc02;border-bottom:5px solid #46A302}.pulsing-border{animation:pulse-border 1.5s infinite}@keyframes pulse-border{0%{box-shadow:0 6px #00000026,0 0 #58cc0266}70%{box-shadow:0 6px #00000026,0 0 0 10px #58cc0200}to{box-shadow:0 6px #00000026,0 0 #58cc0200}}.checkpoint-wrapper{margin:30px 0;display:flex;flex-direction:column;align-items:center}.checkpoint-star{font-size:32px;background-color:#ffc800;width:60px;height:60px;border-radius:12px;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 10px #ffc8004d;cursor:pointer;animation:rotate-star 10s infinite linear}.checkpoint-label{font-size:12px;font-weight:800;color:#ffc800;margin-top:8px}.sidebar-column{display:flex;flex-direction:column;gap:20px;position:sticky;top:90px}.sidebar-card{background-color:#1a2b32;border:2px solid #202F36;border-radius:20px;padding:20px;text-align:left}.level-card-header{display:flex;align-items:center;gap:15px;margin-bottom:15px}.level-avatar{font-size:40px;background-color:#131f24;width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;border:2px solid #202F36}.user-profile-name{font-size:18px;font-weight:800;margin:0}.user-level-badge{font-size:13px;color:#58cc02;font-weight:700;margin:2px 0 0}.xp-progress-section{display:flex;flex-direction:column;gap:8px}.xp-text-row{display:flex;justify-content:space-between;font-size:12px;font-weight:800;color:#afbbbf}.xp-bar-container{height:12px;background-color:#131f24;border-radius:6px;overflow:hidden}.xp-bar-fill{height:100%;background-color:#58cc02;border-radius:6px}.quests-card-title{font-size:18px;font-weight:800;margin:0 0 15px}.quests-list{display:flex;flex-direction:column;gap:16px}.quest-item{display:flex;gap:12px;align-items:flex-start;border-bottom:1px solid #202F36;padding-bottom:12px}.quest-item:last-child{border-bottom:none;padding-bottom:0}.quest-icon-container{font-size:24px;background-color:#131f24;width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.quest-info{flex:1}.quest-title-row{display:flex;justify-content:space-between;align-items:center}.quest-title{font-weight:800;font-size:14px}.quest-reward{font-size:11px;font-weight:800;color:#ffc800}.quest-desc{font-size:12px;color:#afbbbf;margin:4px 0 8px;line-height:1.3}.quest-progress-row{display:flex;align-items:center;gap:10px}.quest-progress-bar-bg{flex:1;height:8px;background-color:#131f24;border-radius:4px;overflow:hidden}.quest-progress-bar-fill{height:100%;border-radius:4px;transition:width .3s ease}.quest-progress-text{font-size:11px;font-weight:800;color:#afbbbf;width:30px;text-align:right}@media (max-width: 768px){.dashboard-grid-layout{grid-template-columns:1fr}.sidebar-column{position:static}}@media (max-width: 480px){.dashboard-header{padding:10px 15px}.header-stat{padding:4px 8px;gap:4px}.stat-icon{font-size:15px}.stat-val{font-size:12px}.unit-banner{padding:15px}.unit-banner-title{font-size:18px}.unit-banner-icon{font-size:32px}.unit-progress-circle{width:40px;height:40px;font-size:11px}.lesson-node-btn{width:60px;height:60px}.lesson-node-emoji{font-size:24px}}.lesson-page{background-color:#131f24;color:#fff;min-height:100vh;display:flex;flex-direction:column;align-items:center;font-family:Nunito,sans-serif;overflow:hidden;position:relative}.lesson-loading{font-size:20px;font-weight:800;color:#afbbbf;height:100vh;display:flex;align-items:center;justify-content:center}.lesson-top-bar{width:100%;max-width:800px;display:flex;align-items:center;justify-content:space-between;padding:20px;gap:15px}.lesson-close-btn{background:none;border:none;color:#afbbbf;font-size:22px;cursor:pointer;padding:0 10px;font-weight:700}.lesson-close-btn:hover{color:#fff}.lesson-progress-bg{flex:1;height:16px;background-color:#202f36;border-radius:8px;overflow:hidden}.lesson-progress-fill{height:100%;background-color:#58cc02;border-radius:8px;transition:width .3s cubic-bezier(.4,0,.2,1);box-shadow:0 0 8px #58cc02}.lesson-hearts-container{display:flex;align-items:center;gap:6px;background-color:#1a2b32;border:1px solid #202F36;border-radius:12px;padding:6px 14px;font-weight:700}.heart-icon-wrapper{font-size:16px;position:relative;display:inline-block}.heart-shattering-anim{position:absolute;top:0;left:0;animation:shatter 1.2s ease forwards;pointer-events:none;z-index:10}.heart-count{color:#ff4b4b;font-size:15px}.exercise-container{flex:1;width:100%;max-width:600px;display:flex;flex-direction:column;padding:20px 20px 140px;overflow-y:auto;box-sizing:border-box}.exercise-instruction{text-align:left;margin-bottom:24px}.instruction-badge{color:#1cb0f6;font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.8px;display:block;margin-bottom:4px}.exercise-title{font-size:24px;font-weight:800;margin:0;line-height:1.25}.exercise-workspace{width:100%;flex:1;display:flex;flex-direction:column;justify-content:center}.options-vertical{display:flex;flex-direction:column;gap:12px;width:100%}.choice-button{background-color:#1a2b32;border:2px solid #202F36;border-bottom:5px solid #202F36;border-radius:16px;padding:16px 20px;display:flex;align-items:center;cursor:pointer;text-align:left;color:#fff;font-family:inherit;font-size:16px;font-weight:700;transition:all .1s ease;-webkit-user-select:none;user-select:none}.choice-button:hover:not(:disabled){background-color:#1cb0f60d;border-color:#1cb0f6}.choice-button.selected{background-color:#1cb0f61f;border-color:#1cb0f6;border-bottom-color:#1cb0f6;transform:translateY(2px)}.choice-number{border:2px solid #202F36;border-radius:8px;width:26px;height:26px;display:flex;align-items:center;justify-content:center;margin-right:14px;font-size:13px;color:#afbbbf;flex-shrink:0}.choice-button.selected .choice-number{border-color:#1cb0f6;color:#1cb0f6}.choice-text{flex:1}.translation-workspace{display:flex;flex-direction:column;gap:20px;width:100%}.translation-source-container{display:flex;align-items:center;gap:12px;background-color:#1a2b32;border:2px solid #202F36;border-radius:20px;padding:16px 20px;text-align:left}.speech-trigger-btn{font-size:24px;cursor:pointer;-webkit-user-select:none;user-select:none}.speech-trigger-btn:active{transform:scale(.9)}.translation-source-sentence{font-size:18px;font-weight:700;margin:0;line-height:1.3}.translation-answer-area{min-height:100px;background-color:#1a2b324d;border:2px dashed #202F36;border-radius:20px;padding:15px;display:flex;flex-wrap:wrap;gap:10px;align-content:flex-start;position:relative}.answer-placeholder{color:#4b5a60;font-size:15px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none;font-weight:700}.translation-word-bank{min-height:80px;display:flex;flex-wrap:wrap;gap:10px;justify-content:center;align-content:flex-start;margin-top:15px}.word-pill{background-color:#1a2b32;border:2px solid #202F36;border-bottom:4px solid #202F36;border-radius:12px;padding:8px 16px;font-size:15px;font-weight:700;color:#fff;cursor:pointer;font-family:inherit;transition:all .1s ease}.word-pill:hover{background-color:#20353f}.word-pill:active{transform:translateY(2px);border-bottom:2px solid #202F36}.answer-pill{background-color:#1cb0f6;border-color:#1899d6;border-bottom-color:#1899d6}.answer-pill:hover{background-color:#24c0ff}.fillblank-workspace{display:flex;flex-direction:column;gap:30px;width:100%}.fillblank-sentence-row{background-color:#1a2b32;border:2px solid #202F36;border-radius:20px;padding:24px}.fillblank-sentence{font-size:20px;font-weight:700;line-height:1.4;margin:0}.blank-highlight{color:#1cb0f6;border-bottom:2px solid #1CB0F6;padding:0 8px;margin:0 4px;font-weight:800}.fillblank-options-row{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.listening-workspace{display:flex;flex-direction:column;align-items:center;gap:30px;width:100%}.audio-buttons-row{display:flex;align-items:center;gap:20px}.audio-play-btn{border:none;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;outline:none;transition:all .15s ease}.main-audio{width:100px;height:100px;background-color:#1cb0f6;box-shadow:0 6px #1899d6,0 10px 20px #1cb0f64d}.main-audio:active{transform:translateY(4px);box-shadow:0 2px #1899d6}.main-audio .audio-play-icon{font-size:40px}.slow-audio{width:60px;height:60px;background-color:#ff9600;box-shadow:0 4px #d67f00,0 6px 15px #ff960033}.slow-audio:active{transform:translateY(3px);box-shadow:0 1px #d67f00}.slow-audio .audio-play-icon{font-size:24px}.listening-input-container{width:100%}.listening-text-input{width:100%;background-color:#1a2b32;border:2px solid #202F36;border-radius:16px;padding:16px 20px;color:#fff;font-family:inherit;font-size:16px;font-weight:700;outline:none;text-align:center;transition:border-color .2s}.listening-text-input:focus{border-color:#1cb0f6}.matching-workspace{display:grid;grid-template-columns:1fr 1fr;gap:20px;width:100%}.matching-column{display:flex;flex-direction:column;gap:10px}.matching-card{background-color:#1a2b32;border:2px solid #202F36;border-bottom:4px solid #202F36;border-radius:16px;padding:16px;color:#fff;font-family:inherit;font-size:15px;font-weight:700;cursor:pointer;transition:all .1s ease;-webkit-user-select:none;user-select:none}.matching-card:hover:not(:disabled){border-color:#1cb0f6}.matching-card.selected{background-color:#1cb0f61a;border-color:#1cb0f6;border-bottom-color:#1cb0f6;transform:translateY(2px)}.matching-card.matched{background-color:#58cc021a;border-color:#58cc02;border-bottom-color:#58cc02;color:#58cc02;cursor:not-allowed;opacity:.8}.exit-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#0009;z-index:1000;display:flex;align-items:center;justify-content:center;padding:20px}.exit-modal{background-color:#1a2b32;border:2px solid #202F36;border-radius:24px;padding:30px;max-width:400px;width:100%;text-align:center}.exit-modal-mascot{font-size:72px;display:block;margin-bottom:15px}.exit-modal-title{font-size:22px;font-weight:800;margin:0 0 10px}.exit-modal-desc{font-size:14px;color:#afbbbf;line-height:1.4;margin:0 0 24px;font-weight:600}.exit-modal-actions{display:flex;flex-direction:column;gap:10px}.lesson-footer-panel{position:fixed;bottom:0;left:0;right:0;background-color:#131f24;border-top:2px solid #202F36;padding:20px;z-index:100;min-height:100px;display:flex;align-items:center;justify-content:center;padding-bottom:env(safe-area-inset-bottom,20px)}.footer-panel-container{width:100%;max-width:600px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:15px}.check-submit-btn{width:100%;padding:16px 0}.check-submit-btn:disabled{background-color:#202f36;border-bottom-color:#202f36;color:#4b5a60;cursor:not-allowed;transform:none}.lesson-footer-panel.correct-panel{background-color:#d7ffb7;border-top-color:#58cc02;color:#46a302}.lesson-footer-panel.correct-panel .feedback-status-title{color:#58cc02}.lesson-footer-panel.correct-panel .feedback-explanation{color:#46a302}.lesson-footer-panel.correct-panel .feedback-continue-btn{background-color:#58cc02;border-bottom-color:#46a302;color:#fff}.lesson-footer-panel.wrong-panel{background-color:#ffdfdf;border-top-color:#ff4b4b;color:#ea2b2b}.lesson-footer-panel.wrong-panel .feedback-status-title{color:#ff4b4b}.lesson-footer-panel.wrong-panel .feedback-explanation{color:#ea2b2b}.lesson-footer-panel.wrong-panel .feedback-continue-btn{background-color:#ff4b4b;border-bottom-color:#ea2b2b;color:#fff}.feedback-text-info{text-align:left;flex:1}.feedback-status-row{display:flex;align-items:center;gap:10px;margin-bottom:5px}.feedback-status-icon{font-size:24px}.feedback-status-title{font-size:20px;font-weight:800}.feedback-explanation{font-size:14px;font-weight:700;margin:0;line-height:1.3}.feedback-continue-btn{padding:16px 40px}.lesson-complete-screen{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;max-width:500px;text-align:center;padding:30px}.complete-mascot{font-size:110px;margin-bottom:20px;animation:scale-up-star .6s cubic-bezier(.175,.885,.32,1.275)}.complete-title{font-size:32px;font-weight:800;margin:0 0 10px;color:#ffc800}.complete-subtitle{font-size:16px;color:#afbbbf;margin:0 0 40px;line-height:1.4;font-weight:600}.complete-stats-row{display:grid;grid-template-columns:1fr 1fr;gap:20px;width:100%;margin-bottom:40px}.complete-stat-card{background-color:#1a2b32;border:2px solid #202F36;border-radius:24px;padding:20px}.complete-stat-icon{font-size:28px;display:block;margin-bottom:10px}.complete-stat-value{font-size:24px;font-weight:800;margin-bottom:4px}.complete-stat-label{font-size:12px;color:#afbbbf;font-weight:700;text-transform:uppercase}.perfect-badge{background-color:#ffc8001a;border:2px solid #FFC800;color:#ffc800;padding:12px 24px;border-radius:16px;font-weight:800;font-size:15px;margin-bottom:40px}.complete-finish-btn{width:100%}.shake-element{animation:shake .4s ease}@keyframes shake{0%,to{transform:translate(0)}20%,60%{transform:translate(-6px)}40%,80%{transform:translate(6px)}}@keyframes shatter{0%{transform:scale(1) translate(0);opacity:1}30%{transform:scale(1.3) translateY(-10px);opacity:.8}to{transform:scale(.6) translate(15px,30px) rotate(45deg);opacity:0}}@keyframes scale-up-star{0%{transform:scale(0)}to{transform:scale(1)}}.animate-slide-up{animation:slide-up .25s cubic-bezier(.4,0,.2,1)}@keyframes slide-up{0%{transform:translateY(100%)}to{transform:translateY(0)}}@media (max-width: 480px){.lesson-top-bar{padding:10px}.exercise-title{font-size:20px}.choice-button{padding:12px 16px;font-size:15px}.main-audio{width:80px;height:80px}.main-audio .audio-play-icon{font-size:32px}.matching-card{padding:12px;font-size:14px}.feedback-continue-btn{width:100%}}.profile-page{background-color:#131f24;color:#fff;min-height:100vh;padding-bottom:90px;font-family:Nunito,sans-serif}.profile-main-content{max-width:800px;margin:0 auto;padding:30px 20px;display:flex;flex-direction:column;gap:35px}.profile-user-card{display:flex;flex-direction:column;align-items:center;text-align:center;background-color:#1a2b32;border:2px solid #202F36;border-radius:28px;padding:30px;position:relative;overflow:hidden}.profile-avatar-img{width:100%;height:100%;object-fit:cover;border-radius:50%}.profile-avatar-wrapper{position:relative;width:90px;height:90px;display:flex;align-items:center;justify-content:center;margin-bottom:15px}.profile-avatar-emoji{font-size:56px;z-index:2}.profile-avatar-glow{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:50%;background:radial-gradient(circle,rgba(28,176,246,.3) 0%,rgba(0,0,0,0) 70%);filter:blur(5px);z-index:1}.profile-username{font-size:24px;font-weight:800;margin:0 0 8px;letter-spacing:-.5px}.profile-league-badge-container{display:flex;align-items:center;gap:8px;background-color:#131f24;border:1px solid #202F36;border-radius:12px;padding:6px 16px}.profile-league-emoji{font-size:16px}.profile-league-text{font-size:13px;font-weight:800;color:#afbbbf}.section-heading{font-size:20px;font-weight:800;text-align:left;margin:0 0 15px}.profile-settings-section{background-color:#1a2b32;border:2px solid #202F36;border-radius:24px;padding:24px;display:flex;flex-direction:column;gap:18px}.settings-header-row{display:flex;justify-content:space-between;align-items:center;gap:12px}.settings-saved-msg{color:#7af07f;font-weight:700;font-size:14px}.settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.setting-field{display:flex;flex-direction:column;gap:10px;font-size:14px;color:#c1d2dc}.setting-field span{font-weight:700}.setting-field input{width:100%;padding:14px 16px;border-radius:16px;background:#131F24;border:1px solid #233A44;color:#fff}.setting-field input::placeholder{color:#6e7e8b}.profile-image-file-input{width:100%;padding:12px 14px;border-radius:16px;background:#131F24;border:1px solid #233A44;color:#fff}.clear-image-btn{margin-top:10px;background:transparent;color:#ff8a8a;border:1px solid #FF8A8A;border-radius:14px;padding:10px 14px;font-size:13px;cursor:pointer;align-self:flex-start}.clear-image-btn:hover{background:rgba(255,138,138,.1)}.theme-field{display:flex;flex-direction:column;gap:12px}.theme-options{display:flex;gap:12px;flex-wrap:wrap}.theme-option{display:inline-flex;align-items:center;gap:8px;padding:12px 14px;border-radius:16px;border:1px solid #233A44;background:#131F24;cursor:pointer;color:#e2edf4;font-size:14px}.theme-option input{accent-color:#58CC02}.theme-option.selected{border-color:#58cc02;background:rgba(88,204,2,.08)}.settings-save-btn{width:fit-content;align-self:flex-start;background:#58CC02;color:#08120d;font-weight:800;padding:14px 28px;border-radius:18px;transition:all .18s ease}.settings-save-btn:hover{transform:translateY(-1px)}.settings-save-btn:active{transform:translateY(1px)}.profile-stats-section{padding:18px;border-radius:18px;border:2px solid transparent}.profile-stats-section.league-gold{background:linear-gradient(135deg,rgba(255,200,0,.06),rgba(255,200,0,.02));border-color:#ffc8002e}.profile-stats-section.league-silver{background:linear-gradient(135deg,rgba(192,192,192,.06),rgba(192,192,192,.02));border-color:#c0c0c024}.profile-stats-section.league-bronze{background:linear-gradient(135deg,rgba(176,122,72,.06),rgba(176,122,72,.02));border-color:#b07a4824}.profile-stats-section.league-gold .stat-card{background:linear-gradient(180deg,rgba(255,238,153,.04),rgba(26,43,50,.02));border-color:#ffc8001f}.profile-stats-section.league-gold .stat-card .stat-card-icon{color:#ffc800}.profile-stats-section.league-silver .stat-card{background:linear-gradient(180deg,rgba(224,224,224,.035),rgba(26,43,50,.02));border-color:#c0c0c01a}.profile-stats-section.league-silver .stat-card .stat-card-icon{color:silver}.profile-stats-section.league-bronze .stat-card{background:linear-gradient(180deg,rgba(205,160,120,.035),rgba(26,43,50,.02));border-color:#b07a481a}.profile-stats-section.league-bronze .stat-card .stat-card-icon{color:#b07a48}.profile-stats-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:15px}.stat-card{background-color:#1a2b32;border:2px solid #202F36;border-radius:20px;padding:16px 20px;display:flex;flex-direction:column;align-items:flex-start;text-align:left}.stat-card-icon{font-size:24px;margin-bottom:8px}.stat-card-number{font-size:22px;font-weight:800;margin-bottom:2px}.stat-card-label{font-size:12px;color:#afbbbf;font-weight:700;text-transform:uppercase}.calendar-card{background-color:#1a2b32;border:2px solid #202F36;border-radius:20px;padding:20px}.calendar-grid-container{display:flex;gap:10px;overflow-x:auto;padding-bottom:10px}.day-labels{display:flex;flex-direction:column;justify-content:space-between;height:126px;padding-top:2px}.day-label{font-size:10px;font-weight:800;color:#4b5a60;height:14px;line-height:14px}.calendar-squares-grid{display:grid;grid-template-rows:repeat(7,1fr);grid-auto-flow:column;gap:4px}.calendar-square{width:14px;height:14px;border-radius:3px;transition:transform .1s ease}.calendar-square:hover{transform:scale(1.2);z-index:10;cursor:pointer}.active-level-0{background-color:#131f24}.active-level-1{background-color:#234e30}.active-level-2{background-color:#2d8b3f}.active-level-3{background-color:#58cc02}.calendar-legend{display:flex;align-items:center;justify-content:flex-end;gap:6px;margin-top:10px}.legend-label{font-size:11px;color:#afbbbf;font-weight:700}.legend-squares{display:flex;gap:4px}.achievements-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px}.achievement-card{background-color:#1a2b32;border:2px solid #202F36;border-radius:24px;padding:20px;display:flex;gap:15px;align-items:center;transition:all .2s ease;position:relative}.achievement-card.unlocked{border-color:#ffc800;box-shadow:0 4px 12px #ffc8000d}.achievement-card.locked{opacity:.65}.achievement-icon-wrapper{position:relative;width:50px;height:50px;background-color:#131f24;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:26px;flex-shrink:0}.achievement-card.unlocked .achievement-icon-wrapper{border:2px solid #FFC800;background-color:#ffc80014}.achievement-lock-overlay{position:absolute;bottom:-4px;right:-4px;font-size:12px;background-color:#202f36;border-radius:50%;width:18px;height:18px;display:flex;align-items:center;justify-content:center}.achievement-info{flex:1;text-align:left}.achievement-name{font-size:15px;font-weight:800;margin:0 0 4px}.achievement-card.unlocked .achievement-name{color:#ffc800}.achievement-desc{font-size:12px;color:#afbbbf;margin:0 0 10px;line-height:1.35;font-weight:600}.achievement-progress-row{display:flex;align-items:center;gap:10px}.achievement-progress-bar-bg{flex:1;height:8px;background-color:#131f24;border-radius:4px;overflow:hidden}.achievement-progress-bar-fill{height:100%;background-color:#1cb0f6;border-radius:4px}.achievement-card.unlocked .achievement-progress-bar-fill{background-color:#ffc800}.achievement-progress-text{font-size:11px;font-weight:800;color:#afbbbf}.achievement-card.unlocked .achievement-progress-text{color:#ffc800}@media (max-width: 600px){.profile-stats-grid,.achievements-grid{grid-template-columns:1fr}}.profile-logout-btn{margin-top:20px;background-color:#ff4b4b1a;border:2px solid rgba(255,75,75,.25);border-bottom:4px solid rgba(255,75,75,.4);border-radius:16px;color:#ff4b4b;font-family:inherit;font-weight:800;font-size:14px;padding:10px 24px;cursor:pointer;display:flex;align-items:center;gap:8px;transition:all .15s ease}.profile-logout-btn:hover{background-color:#ff4b4b2e;border-color:#ff4b4b66;color:#f33}.profile-logout-btn:active{border-bottom-width:2px;transform:translateY(2px)}.leaderboard-page{background-color:#131f24;color:#fff;min-height:100vh;padding-bottom:90px;font-family:Nunito,sans-serif}.leaderboard-main-content{max-width:600px;margin:0 auto;padding:30px 20px;display:flex;flex-direction:column;gap:25px}.league-banner-card{border-radius:24px;padding:24px;display:flex;align-items:center;gap:20px;box-shadow:0 8px 20px #0000004d}.league-big-icon{font-size:56px;filter:drop-shadow(0 4px 6px rgba(0,0,0,.2))}.league-banner-right{text-align:left}.league-name-title{font-size:24px;font-weight:800;margin:0 0 4px;color:#fff}.league-timer{font-size:14px;font-weight:700;color:#ffffffe6;margin:0}.league-tiers-nav{display:flex;background-color:#1a2b32;border:2px solid #202F36;border-radius:20px;padding:8px;justify-content:space-around}.tier-nav-item{display:flex;flex-direction:column;align-items:center;padding:8px 16px;position:relative;opacity:.5;transition:opacity .2s ease;cursor:pointer}.tier-nav-item.active{opacity:1}.tier-nav-icon{font-size:22px;margin-bottom:4px}.tier-nav-name{font-size:12px;font-weight:800}.tier-nav-indicator{position:absolute;bottom:-4px;width:16px;height:3px;border-radius:2px;background-color:#58cc02}.leaderboard-zones-info{display:flex;gap:15px}.zone-info-card{flex:1;background-color:#1a2b32;border:2px solid #202F36;border-radius:16px;padding:12px 16px;display:flex;align-items:center;gap:10px;font-size:13px;font-weight:800}.zone-info-badge{background-color:#58cc0226;color:#58cc02;border:1px solid #58CC02;border-radius:8px;padding:2px 8px;font-size:11px}.zone-info-badge.badge-red{background-color:#ff4b4b26;color:#ff4b4b;border-color:#ff4b4b}.zone-info-text{color:#afbbbf}.rankings-list-container{background-color:#1a2b32;border:2px solid #202F36;border-radius:24px;overflow:hidden}.rankings-header{display:grid;grid-template-columns:80px 1fr 100px;padding:16px 20px;border-bottom:2px solid #202F36;font-size:12px;font-weight:800;color:#afbbbf;text-transform:uppercase;text-align:left}.col-user{text-align:left}.rankings-rows{display:flex;flex-direction:column}.ranking-row{display:grid;grid-template-columns:80px 1fr 100px;align-items:center;padding:14px 20px;border-bottom:1px solid #202F36;transition:all .15s ease;position:relative}.ranking-row:last-child{border-bottom:none}.ranking-row:hover{background-color:#ffffff05}.rank-col{text-align:left}.rank-badge{font-size:15px;font-weight:800;color:#afbbbf}.rank-medal{font-size:20px}.user-col{display:flex;align-items:center;gap:14px;text-align:left}.user-avatar-emoji{font-size:28px;background-color:#131f24;width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center}.user-name-details{display:flex;flex-direction:column}.user-row-name{font-weight:800;font-size:15px}.user-row-streak{font-size:12px;font-weight:800;color:#ff9600}.xp-col{text-align:right}.xp-value{font-weight:800;color:#e2e8f0;font-size:14px}.ranking-row-me{background-color:#1cb0f614;border-left:4px solid #1CB0F6}.ranking-row-me .user-row-name{color:#1cb0f6}.ranking-row.row-promotion:after{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background-color:#58cc02;opacity:.6}.ranking-row.row-demotion:after{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background-color:#ff4b4b;opacity:.6}@media (max-width: 480px){.rankings-header,.ranking-row{grid-template-columns:60px 1fr 80px;padding:12px 14px}.user-avatar-emoji{width:34px;height:34px;font-size:22px}}.shop-page{background-color:#131f24;color:#fff;min-height:100vh;padding-bottom:90px;font-family:Nunito,sans-serif}.shop-main-content{max-width:600px;margin:0 auto;padding:30px 20px;display:flex;flex-direction:column;gap:25px}.shop-header-card{display:flex;justify-content:space-between;align-items:center;background-color:#1a2b32;border:2px solid #202F36;border-radius:24px;padding:20px 28px}.shop-page-title{font-size:24px;font-weight:800;margin:0}.shop-gem-counter{display:flex;align-items:center;gap:8px;background-color:#131f24;border:2px solid #202F36;border-radius:14px;padding:6px 16px;font-weight:800}.shop-gem-emoji{font-size:20px}.shop-gem-value{font-size:16px;color:#1cb0f6}.shop-tabs{display:flex;gap:10px}.shop-tab-btn{flex:1;background-color:#1a2b32;border:2px solid #202F36;border-radius:16px;padding:12px;color:#afbbbf;font-family:inherit;font-weight:800;font-size:14px;cursor:pointer;transition:all .15s ease}.shop-tab-btn:hover{color:#fff;border-color:#2e3e44}.shop-tab-btn.active{background-color:#1cb0f61a;color:#1cb0f6;border-color:#1cb0f6}.shop-items-list{display:flex;flex-direction:column;gap:16px}.shop-item-card{background-color:#1a2b32;border:2px solid #202F36;border-radius:24px;padding:20px;display:flex;align-items:center;gap:18px}.shop-item-icon-wrapper{width:56px;height:56px;background-color:#1cb0f61a;border:2px solid rgba(28,176,246,.3);border-radius:16px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.shop-item-icon-wrapper.wrapper-heart{background-color:#ff4b4b1a;border-color:#ff4b4b4d}.shop-item-icon-wrapper.wrapper-xp{background-color:#ffc8001a;border-color:#ffc8004d}.shop-item-emoji{font-size:28px}.shop-item-details{flex:1;text-align:left}.shop-item-name{font-size:16px;font-weight:800;margin:0 0 4px}.shop-item-desc{font-size:12px;color:#afbbbf;margin:0 0 8px;line-height:1.35;font-weight:600}.shop-item-owned{font-size:11px;font-weight:800;color:#4b5a60}.shop-buy-btn{padding:12px 20px;font-size:13px;white-space:nowrap}.shop-buy-btn:disabled{background-color:#202f36;border-bottom-color:#202f36;color:#4b5a60;cursor:not-allowed;transform:none}.shop-gems-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:20px}.gem-pack-card{background-color:#1a2b32;border:2px solid #202F36;border-bottom:5px solid #202F36;border-radius:24px;padding:24px 16px;display:flex;flex-direction:column;align-items:center;text-align:center;position:relative;transition:all .2s ease}.gem-pack-card:hover{transform:translateY(-4px);border-color:#1cb0f6}.gem-pack-emoji{font-size:40px;margin-bottom:12px}.emoji-lg{font-size:48px}.emoji-xl{font-size:54px}.gem-pack-title{font-size:18px;font-weight:800;margin:0 0 4px}.gem-pack-desc{font-size:12px;color:#afbbbf;margin:0 0 20px;font-weight:600}.gem-pack-price{width:100%;padding:12px 0}.pack-popular{border-color:#58cc02;border-bottom-color:#46a302;background:radial-gradient(circle at top right,rgba(88,204,2,.05) 0%,rgba(0,0,0,0) 80%),#1A2B32}.pack-popular-badge{position:absolute;top:-12px;background-color:#58cc02;color:#fff;font-size:10px;font-weight:800;padding:4px 12px;border-radius:20px;text-transform:uppercase;letter-spacing:.5px;box-shadow:0 4px 10px #58cc024d}.shop-premium-section{width:100%}.premium-banner-card{background:linear-gradient(135deg,#CE82FF 0%,#8B5CF6 100%);border-radius:28px;padding:35px;text-align:left;box-shadow:0 12px 30px #8b5cf64d;position:relative;overflow:hidden}.premium-banner-card:before{content:"";position:absolute;top:-50px;right:-50px;width:150px;height:150px;border-radius:50%;background-color:#ffffff1a;pointer-events:none}.premium-header{display:flex;align-items:center;gap:12px;margin-bottom:24px}.premium-crown{font-size:32px;background-color:#fff3;width:50px;height:50px;border-radius:12px;display:flex;align-items:center;justify-content:center}.premium-title{font-size:28px;font-weight:800;margin:0;color:#fff}.premium-benefits-list{list-style:none;padding:0;margin:0 0 35px;display:flex;flex-direction:column;gap:12px}.premium-benefits-list li{font-size:15px;font-weight:700;display:flex;align-items:center;gap:10px;color:#fff}.benefit-icon{font-size:18px}.premium-pricing-row{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:15px}.price-tag{color:#fff}.price-val{font-size:32px;font-weight:900}.price-period{font-size:15px;font-weight:700;opacity:.8}.premium-action-btn{background-color:#fff;color:#8b5cf6;padding:16px 32px;font-size:15px;border-bottom:4px solid #E2E8F0}.premium-action-btn:hover{background-color:#f8fafc;transform:translateY(-2px)}.premium-action-btn:active{border-bottom-width:0;transform:translateY(2px)}.premium-action-btn:disabled{background-color:#ffffff4d;color:#fff;border-bottom-color:#ffffff4d;cursor:not-allowed;transform:none}.premium-yearly-hint{font-size:12px;font-weight:700;color:#fffc;margin:10px 0 0}.checkout-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#000000b3;z-index:1100;display:flex;align-items:center;justify-content:center;padding:20px}.checkout-modal{background-color:#1a2b32;border:2px solid #202F36;border-radius:24px;padding:40px 30px;max-width:380px;width:100%;text-align:center;display:flex;flex-direction:column;align-items:center}.spinner{width:50px;height:50px;border:5px solid #202F36;border-top:5px solid #1CB0F6;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:20px}.checkout-title{font-size:20px;font-weight:800;margin:0 0 8px}.checkout-desc{font-size:14px;color:#afbbbf;margin:0;font-weight:600;line-height:1.35}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.shop-pending-section{background:rgba(28,176,246,.1);border:2px solid rgba(28,176,246,.35);border-radius:16px;padding:16px;margin-bottom:16px}.shop-pending-title{font-size:16px;font-weight:800;margin:0 0 4px}.shop-pending-hint{font-size:13px;color:#afbbbf;margin:0 0 12px}.shop-pending-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.shop-pending-item{display:flex;justify-content:space-between;align-items:center;background:#202F36;border-radius:12px;padding:10px 14px;font-size:14px;font-weight:700}.shop-pending-status{color:#ffc800;font-size:12px}.shop-error-banner{background:rgba(255,75,75,.15);border:2px solid rgba(255,75,75,.4);color:#ff4b4b;border-radius:12px;padding:12px 16px;margin-bottom:16px;font-size:14px;font-weight:700}@media (max-width: 480px){.premium-banner-card{padding:20px}.premium-title{font-size:22px}.premium-benefits-list li{font-size:13px}.price-val{font-size:26px}.premium-action-btn{width:100%;padding:12px}}.admin-page{min-height:100vh;display:grid;grid-template-columns:260px minmax(0,1fr);background:#f4f7fb;color:#17212b}.admin-page--gate{display:block}.admin-gate{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:32px 20px;text-align:center}.admin-gate__header{max-width:420px;margin-bottom:8px}.admin-gate__icon{font-size:2.5rem;display:block;margin-bottom:12px}.admin-gate h2{margin:0 0 8px;color:#17212b}.admin-gate p,.admin-gate__hint{margin:0;color:#5b6775}.admin-gate__link{margin-top:8px;color:#1cb0f6;font-weight:700;text-decoration:none}.admin-gate__link:hover{text-decoration:underline}.admin-sidebar{position:sticky;top:0;height:100vh;padding:22px 18px;background:#17212b;color:#f7fbff;display:flex;flex-direction:column;gap:24px}.admin-brand{display:flex;align-items:center;gap:12px;min-height:48px}.admin-brand-mark{width:42px;height:42px;display:grid;place-items:center;border-radius:8px;background:#58cc02;color:#fff;font-weight:900}.admin-brand strong,.admin-brand span{display:block}.admin-brand span{margin-top:2px;color:#9fb2c1;font-size:.84rem}.admin-menu{display:grid;gap:8px}.admin-menu button,.admin-public-link{min-height:42px;padding:0 12px;border-radius:8px;background:transparent;color:#b8c7d3;text-align:left;font-weight:800;display:flex;align-items:center}.admin-menu button:hover,.admin-menu button.active,.admin-public-link:hover{background:#233342;color:#fff}.admin-public-link{margin-top:auto;border:1px solid #33475b}.admin-main{min-width:0;padding:26px}.admin-topbar{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;margin-bottom:22px}.admin-kicker{color:#60758a;font-size:.78rem;text-transform:uppercase;font-weight:900;letter-spacing:0}.admin-topbar h1{margin-top:4px;font-size:1.75rem;line-height:1.2}.admin-actions{display:flex;gap:10px;width:min(560px,100%)}.admin-search,.admin-panel input,.admin-panel select{width:100%;min-height:42px;padding:0 12px;border:1px solid #d7e0ea;border-radius:8px;background:#ffffff;color:#17212b}.admin-primary-btn,.admin-button-row button{min-height:42px;padding:0 14px;border-radius:8px;background:#1cb0f6;color:#fff;font-weight:900;white-space:nowrap}.admin-metrics{display:grid;grid-template-columns:repeat(4,minmax(150px,1fr));gap:14px;margin-bottom:18px}.metric-tile,.admin-panel{background:#ffffff;border:1px solid #dfe7ef;border-radius:8px;box-shadow:0 10px 24px #17212b0f}.metric-tile{min-height:96px;padding:16px}.metric-tile span{display:block;color:#687c8f;font-size:.88rem;font-weight:800}.metric-tile strong{display:block;margin-top:8px;font-size:1.45rem;line-height:1.2}.admin-workspace{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(320px,.8fr);gap:18px;align-items:start}.admin-panel{padding:18px;min-width:0}.admin-panel.full{width:100%}.panel-heading{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:14px}.panel-heading h2{font-size:1.04rem;line-height:1.2}.panel-heading span{color:#6d8294;font-size:.86rem;font-weight:800}.admin-table{display:grid;gap:8px;overflow-x:auto}.admin-row{min-width:720px;display:grid;grid-template-columns:110px 1.5fr 110px 105px 130px;gap:12px;align-items:center;min-height:62px;padding:10px 12px;border-radius:8px;background:#f8fafc;color:#17212b;text-align:left}.admin-row.transactions{grid-template-columns:110px 1.2fr 110px 130px 105px 110px}.admin-row-head{min-height:38px;color:#65788b;font-size:.78rem;text-transform:uppercase;font-weight:900;background:#eef3f8}.admin-row.selected{outline:2px solid #1cb0f6;background:#eef9ff}.admin-row strong,.admin-row small{display:block}.admin-row small{color:#718698;margin-top:2px}.status-pill{width:fit-content;min-width:78px;padding:5px 8px;border-radius:999px;text-align:center;font-weight:900;font-size:.78rem;background:#e8eef4;color:#52677a}.status-pill.active,.status-pill.connected,.status-pill.paid{background:#e6f7dc;color:#2f7b08}.status-pill.limited,.status-pill.refunded{background:#fff5d8;color:#896600}.status-pill.blocked,.status-pill.disconnected,.status-pill.failed{background:#ffe7e7;color:#b42323}.admin-panel label{display:grid;gap:7px;margin-bottom:12px;color:#44586b;font-weight:900;font-size:.88rem}.field-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.admin-button-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}.admin-button-row button:nth-child(2){background:#ff4b4b}.admin-button-row button:nth-child(3){background:#58cc02}.provider-grid{display:grid;grid-template-columns:repeat(3,minmax(160px,1fr));gap:12px}.provider-card{min-height:132px;padding:14px;border:1px solid #dfe7ef;border-radius:8px;background:#f8fafc;text-align:left;display:grid;gap:6px;align-content:start}.provider-card.selected{outline:2px solid #1cb0f6;background:#eef9ff}.provider-card strong{font-size:1.08rem}.provider-card span,.provider-card small{color:#62778a;font-weight:800}.provider-state{width:12px;height:12px;border-radius:999px;background:#9aaabc}.provider-state.connected{background:#58cc02}.provider-state.disconnected{background:#ff4b4b}.provider-state.maintenance{background:#ffc800}.settings-grid{grid-template-columns:repeat(2,minmax(260px,1fr))}.toggle-line{min-height:42px;grid-template-columns:20px 1fr;align-items:center}.toggle-line input{min-height:auto;width:18px;height:18px}@media (max-width: 1100px){.admin-page{grid-template-columns:1fr}.admin-sidebar{position:relative;height:auto}.admin-menu{grid-template-columns:repeat(4,minmax(0,1fr))}.admin-public-link{margin-top:0}.admin-workspace,.settings-grid{grid-template-columns:1fr}.admin-metrics{grid-template-columns:repeat(2,minmax(150px,1fr))}}@media (max-width: 720px){.admin-main{padding:16px}.admin-topbar,.admin-actions{flex-direction:column}.admin-actions{width:100%}.admin-menu,.admin-metrics,.provider-grid,.field-grid{grid-template-columns:1fr}.admin-topbar h1{font-size:1.35rem}}.admin-content{display:grid;grid-template-columns:340px 1fr;gap:24px;align-items:start;margin-top:16px}.admin-sidebar-content{background:#ffffff;border:1px solid #dfe7ef;border-radius:12px;padding:20px;box-shadow:0 4px 12px #0000000d}.user-list{display:flex;flex-direction:column;gap:10px;max-height:600px;overflow-y:auto;margin-top:12px}.user-item{display:flex;align-items:center;gap:12px;width:100%;padding:12px;border:1px solid #eee;border-radius:8px;background:#fdfdfd;cursor:pointer;transition:all .2s ease;text-align:left;border-bottom:2px solid #ddd}.user-item:hover{background:#f5f8ff;border-color:#cbdcfd}.user-item.selected{background:#eef4ff;border-color:#3b82f6;box-shadow:0 0 0 2px #3b82f61a}.user-item-avatar{font-size:24px;width:40px;height:40px;border-radius:50%;background:#e0f2fe;display:grid;place-items:center}.user-item-info{flex:1}.user-item-name{font-weight:700;color:#1e293b;font-size:14px}.user-item-email{font-size:12px;color:#64748b}.user-item-role{display:inline-block;font-size:10px;background:#f1f5f9;color:#475569;padding:2px 6px;border-radius:4px;margin-top:2px;text-transform:uppercase;font-weight:700}.admin-form{background:#ffffff;border:1px solid #dfe7ef;border-radius:12px;padding:24px;box-shadow:0 4px 12px #0000000d}.form-section{margin-bottom:20px}.form-section label{display:block;font-weight:600;margin-bottom:6px;color:#475569;font-size:14px}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:8px}.stat-box{background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:10px;text-align:center}.stat-label{font-size:11px;color:#64748b;text-transform:uppercase;font-weight:600}.stat-value{font-size:18px;font-weight:700;color:#0f172a;margin-top:4px}.stats-grid-main{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;margin-top:16px}.stat-card{display:flex;align-items:center;gap:16px;background:#ffffff;border:1px solid #dfe7ef;border-radius:12px;padding:20px;box-shadow:0 4px 12px #0000000d}.stat-card-icon{font-size:32px;width:56px;height:56px;border-radius:12px;background:#eff6ff;display:grid;place-items:center}.stat-card-content{flex:1}.stat-card-label{font-size:13px;color:#64748b;font-weight:500}.stat-card-value{font-size:24px;font-weight:700;color:#1e293b;margin-top:4px}.settings-content{display:flex;flex-direction:column;gap:20px;margin-top:16px}.settings-section{background:#ffffff;border:1px solid #dfe7ef;border-radius:12px;padding:20px;box-shadow:0 4px 12px #0000000d}.settings-section h3{margin-top:0;margin-bottom:12px;font-size:16px;color:#1e293b}@media (max-width: 900px){.admin-content{grid-template-columns:1fr}}.courses-page{background-color:#131f24;color:#fff;min-height:100vh;padding-bottom:90px;font-family:Nunito,sans-serif}.courses-header{background-color:#1a2b32;border-bottom:2px solid #202F36;padding:24px 20px;position:sticky;top:0;z-index:100}.courses-header-title{max-width:600px;margin:0 auto;text-align:left}.courses-header-title h2{font-size:24px;font-weight:800;margin:0 0 4px}.courses-header-title p{font-size:14px;color:#afbbbf;margin:0;font-weight:600}.courses-main-content{max-width:600px;margin:0 auto;padding:30px 20px}.courses-grid{display:flex;flex-direction:column;gap:16px}.course-card{background-color:#1a2b32;border:2px solid #202F36;border-bottom:5px solid #202F36;border-radius:24px;padding:20px;display:flex;align-items:center;gap:20px;position:relative;cursor:pointer;transition:all .2s ease;text-align:left}.course-card:hover{transform:translateY(-3px);border-color:#1cb0f6;border-bottom-color:#1899d6}.course-card:active{transform:translateY(1px);border-bottom-width:2px;margin-bottom:3px}.course-card.active{border-color:#58cc02;border-bottom-color:#46a302;background:radial-gradient(circle at top right,rgba(88,204,2,.05) 0%,rgba(0,0,0,0) 80%),#1A2B32}.course-flag-wrapper{width:64px;height:64px;background-color:#1cb0f61a;border:2px solid rgba(28,176,246,.3);border-radius:18px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.course-card.active .course-flag-wrapper{background-color:#58cc021a;border-color:#58cc024d}.course-card-flag{font-size:32px}.course-card-info{flex:1}.course-card-name{font-size:18px;font-weight:800;margin:0 0 4px}.course-card-languages{font-size:14px;color:#afbbbf;margin:0 0 6px;font-weight:600}.course-card-meta{display:flex;align-items:center;gap:8px;font-size:12px;color:#6b7c85;font-weight:700}.course-card-action{flex-shrink:0}.active-badge{background-color:#58cc0226;color:#58cc02;font-size:12px;font-weight:800;padding:6px 14px;border-radius:12px;text-transform:uppercase;letter-spacing:.5px;border:1px solid rgba(88,204,2,.3)}.select-course-btn{background-color:#202f36;border:2px solid #2E3E44;border-bottom:4px solid #2E3E44;border-radius:14px;color:#afbbbf;font-family:inherit;font-weight:800;font-size:13px;padding:8px 16px;cursor:pointer;transition:all .15s ease}.course-card:hover .select-course-btn{background-color:#1cb0f6;border-color:#1cb0f6;border-bottom-color:#1899d6;color:#fff}.animate-fade{animation:fadeIn .25s ease-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.app-container{width:100%;min-height:100vh;background-color:#131f24}