:root{--color-bg: #0F172A;--color-bg-secondary: #1E293B;--color-card: #334155;--color-border: #475569;--color-bg-secondary-rgb: 30, 41, 59;--color-border-rgb: 71, 85, 105;--color-primary: #818CF8;--color-secondary: #F472B6;--color-premium: #FFD700;--color-google: #4285F4;--color-text: #FFFFFF;--color-text-muted: rgba(255, 255, 255, .7);--color-success: #22c55e;--color-error: #ef4444;--color-info: #3b82f6;--color-warning: #f59e0b;--font-sans: "Inter", sans-serif;--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 2.25rem;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-12: 3rem;--space-16: 4rem;--radius-sm: .25rem;--radius-md: .5rem;--radius-lg: .75rem;--radius-xl: 1rem;--radius-full: 9999px;--shadow-md: 0 4px 15px rgba(0,0,0,.3);--shadow-lg: 0 8px 30px rgba(0,0,0,.5);--shadow-glow-primary: 0 0 20px -5px var(--color-primary)}*,*:before,*:after{box-sizing:border-box}body{font-family:var(--font-sans);margin:0;background-color:var(--color-bg);color:var(--color-text);font-size:var(--font-size-base);line-height:1.6}img{max-width:100%;display:block}h1,h2,h3,h4,h5,h6{color:var(--color-text);margin:0;font-weight:700;line-height:1.2}h1{font-size:var(--font-size-3xl)}h2{font-size:var(--font-size-2xl)}h3{font-size:var(--font-size-xl)}p{margin:0 0 var(--space-4) 0;color:var(--color-text-muted);max-width:65ch}a{color:var(--color-primary);text-decoration:none;transition:filter .2s}a:hover{filter:brightness(1.2)}body{margin:0;padding:0;overflow-x:hidden;position:relative;background:linear-gradient(135deg,#0a0e27,#16213e,#1a237e,#3949ab,#5e35b1);background-size:300% 300%;animation:galaxyFlow 25s ease-in-out infinite;color:var(--color-text-primary);font-family:var(--font-primary);line-height:1.6}@keyframes galaxyFlow{0%,to{background-position:0% 50%}25%{background-position:100% 0%}50%{background-position:100% 100%}75%{background-position:0% 100%}}body:before,body:after{content:"";position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:1}body:before{background-image:radial-gradient(2px 2px at 20px 30px,rgba(255,255,255,.8),transparent),radial-gradient(2px 2px at 40px 70px,rgba(99,102,241,.6),transparent),radial-gradient(1px 1px at 90px 40px,rgba(139,92,246,.7),transparent),radial-gradient(1px 1px at 130px 80px,rgba(6,182,212,.8),transparent),radial-gradient(2px 2px at 160px 30px,rgba(255,255,255,.9),transparent),radial-gradient(1px 1px at 200px 60px,rgba(99,102,241,.5),transparent),radial-gradient(2px 2px at 250px 90px,rgba(139,92,246,.6),transparent),radial-gradient(1px 1px at 300px 40px,rgba(6,182,212,.7),transparent);background-repeat:repeat;background-size:350px 200px;animation:starsMove 50s linear infinite}body:after{background-image:radial-gradient(4px 4px at 100px 50px,rgba(255,255,255,.9),rgba(255,255,255,.2) 50%,transparent),radial-gradient(5px 5px at 200px 100px,rgba(99,102,241,.8),rgba(99,102,241,.2) 50%,transparent),radial-gradient(3px 3px at 300px 150px,rgba(139,92,246,.9),transparent),radial-gradient(4px 4px at 400px 200px,rgba(6,182,212,.8),rgba(6,182,212,.2) 50%,transparent),radial-gradient(6px 6px at 150px 300px,rgba(255,255,255,1),rgba(255,255,255,.3) 50%,transparent),radial-gradient(3px 3px at 350px 50px,rgba(99,102,241,.7),transparent);background-repeat:repeat;background-size:600px 350px;animation:starsMove 35s linear infinite reverse,starsPulse 3s ease-in-out infinite}@keyframes starsMove{0%{transform:translate(0) translateY(0)}to{transform:translate(-200px) translateY(-100px)}}@keyframes starsPulse{0%,to{opacity:.7}50%{opacity:1}}#app-container:before{content:"";position:fixed;top:10%;left:10%;width:300px;height:300px;background:radial-gradient(circle,rgba(99,102,241,.3) 0%,rgba(99,102,241,.1) 50%,transparent 70%);border-radius:50%;animation:nebulaDrift 40s ease-in-out infinite;z-index:2;pointer-events:none}#app-container:after{content:"";position:fixed;top:60%;right:10%;width:250px;height:250px;background:radial-gradient(circle,rgba(139,92,246,.4) 0%,rgba(139,92,246,.1) 50%,transparent 70%);border-radius:50%;animation:nebulaDrift 35s ease-in-out infinite reverse;z-index:2;pointer-events:none}@keyframes nebulaDrift{0%,to{transform:translate(0) scale(1)}25%{transform:translate(50px,-30px) scale(1.1)}50%{transform:translate(-30px,40px) scale(.9)}75%{transform:translate(20px,20px) scale(1.05)}}#app-container{position:relative;z-index:10;display:flex;flex-direction:column;min-height:100vh;background-color:#0000000d;-webkit-backdrop-filter:blur(.5px);backdrop-filter:blur(.5px)}.view-container{position:relative;z-index:11;width:100%;max-width:1200px;margin:0 auto;padding:var(--space-8)}.card,.modal,.dropdown{background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2)}@media (max-width: 768px){body:before,body:after{animation-duration:60s,40s}#app-container:before,#app-container:after{width:200px;height:200px}}.button,button{display:inline-flex;align-items:center;justify-content:center;padding:var(--space-3) var(--space-6);gap:var(--space-2);width:auto;font-family:var(--font-sans);font-size:var(--font-size-base);font-weight:700;line-height:1.2;text-align:center;white-space:nowrap;border:1px solid transparent;border-radius:var(--radius-md);cursor:pointer;transition:all .2s ease-out}.btn-primary{background-color:var(--color-primary);color:var(--color-bg);box-shadow:var(--shadow-glow-primary)}.btn-primary:hover{filter:brightness(1.15);transform:translateY(-2px);box-shadow:0 6px 20px -5px var(--color-primary)}.btn-secondary{background-color:transparent;color:var(--color-text-muted);border-color:var(--color-border)}.btn-secondary:hover{background-color:var(--color-card);border-color:var(--color-primary);color:var(--color-text)}.btn-danger{background-color:transparent;color:var(--color-secondary);border-color:var(--color-secondary)}.btn-danger:hover{background-color:var(--color-secondary);color:var(--color-text);border-color:var(--color-secondary)}.btn-card{background-color:var(--color-bg-secondary);border-color:var(--color-border);color:var(--color-text);flex-direction:column;padding:var(--space-6);border-radius:var(--radius-lg);font-weight:500;gap:var(--space-2)}.btn-card:hover{background-color:var(--color-card);transform:translateY(-4px)}.btn-card .material-icons{font-size:2.5rem;color:var(--color-primary)}#google-login-button{background-color:var(--color-google);color:#fff}#google-login-button:hover{filter:brightness(1.1)}.button:active,button:active{transform:translateY(0);filter:brightness(.95)}.button:disabled,button:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none;filter:none}.button:focus-visible,button:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.button--full-width{width:100%}.card,.home-card,.course-selection-card,.store-card,.course-card,.lesson-card,.theme-card,.story-card,.exam-card,.recorded-class-card,.schedule-event-card,.stat-card,.empty-state-card{background-color:rgba(var(--color-bg-secondary-rgb),.5);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.1);border-radius:16px;box-shadow:0 8px 32px #0000004d;transition:all .3s ease;overflow:hidden}.card--clickable:hover,.home-card:hover,.course-selection-card:hover,.store-card:hover,.course-card:hover,.lesson-card:hover,.theme-card:hover,.story-card:hover,.exam-card:hover,.recorded-class-card:hover,.schedule-event-card:hover{cursor:pointer;transform:translateY(-5px);border-color:#ffffff4d;box-shadow:0 16px 40px #0006;background-color:rgba(var(--color-bg-secondary-rgb),.65)}.course-selection-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:24px;align-items:stretch}.course-selection-card{display:flex;flex-direction:column;height:100%}.course-selection-card .image-wrapper{position:relative;width:100%;padding-top:56.25%;overflow:hidden;background-color:rgba(var(--color-bg-secondary-rgb),.5);flex-shrink:0}.course-selection-card .course-selection-image{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;transition:transform .4s ease}.course-selection-card .image-wrapper:after{content:"";position:absolute;bottom:0;left:0;width:100%;height:60%;background:linear-gradient(to top,rgba(var(--color-bg-secondary-rgb),1),transparent);pointer-events:none}.course-selection-card:hover .course-selection-image{transform:scale(1.05)}.course-selection-content{padding:16px;display:flex;flex-direction:column;justify-content:space-between;flex-grow:1}.course-selection-title{font-size:1.125rem;font-weight:600;line-height:1.4;margin-bottom:8px;color:#fff}.course-selection-subtitle{font-size:.875rem;color:#ffffffb3;flex-grow:1}.course-selection-meta{margin-top:12px;padding-top:12px;border-top:1px solid rgba(255,255,255,.1);font-size:.75rem;color:#ffffffb3}.home-card{display:flex;height:200px}.home-card .image-wrapper{width:280px;height:100%;overflow:hidden;flex-shrink:0}.home-card .home-card-image{width:100%;height:100%;object-fit:cover}.home-card-content{padding:24px;display:flex;flex-direction:column;justify-content:space-between;flex-grow:1}.home-card-title{font-size:1.5rem;font-weight:700;color:#fff}.home-card-subtitle{font-size:.9rem;color:#ffffffb3}.lesson-card,.theme-card,.story-card,.exam-card,.recorded-class-card,.schedule-event-card{padding:var(--space-4) var(--space-5);display:flex;align-items:center;gap:var(--space-5)}.lesson-card span,.theme-card span,.story-card span{flex-grow:1;font-weight:500}.exam-card__content,.recorded-class-card__content{flex-grow:1}.stat-card{padding:24px;text-align:center}.stat-value{font-size:2rem;font-weight:700;color:var(--color-primary)}.stat-label{font-size:.9rem;color:#ffffffb3}.empty-state-card{border-style:dashed;border-width:2px;padding:48px 32px;text-align:center}.main-header{background-color:#1e293bb3;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--color-border);position:sticky;top:0;z-index:100;padding:var(--space-3) var(--space-6);height:64px}.header-logo img{height:36px}#top-nav{display:flex;gap:var(--space-2)}#top-nav button{background:none;color:var(--color-text-muted);padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);position:relative;display:flex;align-items:center;gap:var(--space-2)}#top-nav button:hover{background-color:var(--color-card);color:var(--color-text)}#top-nav button.active{color:var(--color-primary);background-color:#818cf81a}#user-info{display:flex;align-items:center;gap:var(--space-4);color:var(--color-text)}#logout-button{background:none;color:var(--color-text-muted);border-radius:var(--radius-full)}#logout-button:hover{background-color:var(--color-card);color:var(--color-text)}.premium-user .main-header{background:linear-gradient(90deg,#1e293bb3,#3a3214b3)}.premium-user #user-info{border:1px solid var(--color-premium);color:var(--color-premium);padding:var(--space-2) var(--space-3);border-radius:var(--radius-full);box-shadow:0 0 10px #ffd70066}#user-info{display:flex;align-items:center;gap:var(--space-4);cursor:pointer;padding:var(--space-2);border-radius:var(--radius-md);transition:background-color .2s ease}#user-info:hover{background-color:var(--color-card)}.user-details{display:flex;flex-direction:column;align-items:flex-end}.user-name-level{display:flex;align-items:center;gap:var(--space-3)}.level-chip{background-color:var(--color-primary-muted);color:var(--color-primary);font-size:var(--font-size-xs);font-weight:700;padding:3px 8px;border-radius:var(--radius-full)}.xp-text{font-size:var(--font-size-xs);color:var(--color-text-muted);margin-top:var(--space-1)}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0f172acc;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;justify-content:center;align-items:center;padding:var(--space-4);z-index:1000;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease}.modal-overlay.visible{opacity:1;visibility:visible}.modal-content{background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-12) var(--space-8);width:100%;max-width:420px;text-align:center;box-shadow:var(--shadow-lg);position:relative;transform:scale(.95);transition:transform .3s ease}.modal-overlay.visible .modal-content{transform:scale(1)}.modal-content .logo{height:60px;margin:0 auto var(--space-6) auto}.modal-content h2{font-size:var(--font-size-2xl);margin-bottom:var(--space-4)}.modal-content p{color:var(--color-text-muted);margin-bottom:var(--space-8);line-height:1.6}.close-modal-btn{position:absolute;top:var(--space-4);right:var(--space-4);background:none;border:none;color:var(--color-text-muted);cursor:pointer;padding:var(--space-2);border-radius:var(--radius-full);line-height:1;transition:color .2s ease,background-color .2s ease}.close-modal-btn:hover{color:var(--color-text);background-color:var(--color-card)}.close-modal-btn .material-icons{font-size:var(--font-size-2xl)}.payment-modal{max-width:500px}.reward-modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000;opacity:0;transition:opacity .3s ease}.reward-modal-overlay.visible{opacity:1}.reward-modal-card{background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-8);width:90%;max-width:400px;text-align:center;transform:scale(.9);opacity:0;transition:all .3s ease}.reward-modal-overlay.visible .reward-modal-card{transform:scale(1);opacity:1}.reward-modal-header .material-icons{font-size:4rem;color:var(--color-success)}.reward-modal-header h2{font-size:var(--font-size-2xl);margin:var(--space-4) 0}.reward-list{margin:var(--space-6) 0;display:flex;flex-direction:column;gap:var(--space-4)}.reward-item{background-color:var(--color-card);border-radius:var(--radius-md);padding:var(--space-4);display:flex;align-items:center;gap:var(--space-4);text-align:left;opacity:0;transform:translateY(20px);transition:all .5s ease;transition-delay:var(--delay)}.reward-item.visible{opacity:1;transform:translateY(0)}.reward-item .material-icons{font-size:2rem;color:var(--color-primary)}.reward-item .reward-info .reward-name{font-weight:500}.reward-item .reward-amount{margin-left:auto;font-size:var(--font-size-lg);font-weight:700;color:var(--color-success)}.promo-banner{background:linear-gradient(135deg,#1a237e,#3f51b5,#7c4dff);position:relative;overflow:hidden}.promo-banner:before{content:"";position:absolute;inset:0;background:#0000004d;z-index:1}.promo-banner>*{position:relative;z-index:2}.promo-banner{color:#fff;border-radius:var(--radius-lg);padding:var(--space-6);margin-bottom:var(--space-8);display:flex;align-items:center;gap:var(--space-6);box-shadow:0 8px 25px #0006,0 0 0 1px #ffffff1a inset;opacity:0;transform:translateY(-20px);animation:fadeInDown .5s .2s ease-out forwards}.promo-banner-icon{font-size:3rem;flex-shrink:0;color:gold;filter:drop-shadow(0 2px 6px rgba(0,0,0,.6));animation:pulse 2s infinite}.promo-banner-content{flex-grow:1}.promo-banner-title{font-size:var(--font-size-xl);font-weight:800;margin:0;color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.8),0 0 20px rgba(255,215,0,.3)}.promo-banner-text{margin:var(--space-1) 0 var(--space-3) 0;font-weight:600;font-size:var(--font-size-md);color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.7)}.promo-countdown{display:flex;align-items:center;gap:var(--space-2);margin-top:var(--space-2)}.countdown-item{display:flex;flex-direction:column;align-items:center;background:#0000004d;border-radius:var(--radius-sm);padding:var(--space-2);min-width:45px;border:1px solid rgba(255,255,255,.2)}.countdown-number{font-size:1.25rem;font-weight:800;color:gold;line-height:1;text-shadow:0 1px 2px rgba(0,0,0,.8)}.countdown-label{font-size:.7rem;font-weight:600;color:#fff;opacity:.9;margin-top:2px;text-shadow:0 1px 2px rgba(0,0,0,.6)}.countdown-separator{font-size:1.5rem;font-weight:700;color:gold;margin:0 var(--space-1);text-shadow:0 1px 2px rgba(0,0,0,.8);animation:blink 1s infinite}.promo-banner-cta{flex-shrink:0;background:linear-gradient(45deg,gold,#ffa000);color:#1a237e;border:none;font-weight:800;font-size:var(--font-size-md);padding:var(--space-4) var(--space-6);border-radius:var(--radius-md);cursor:pointer;display:flex;align-items:center;gap:var(--space-2);transition:all .3s ease;box-shadow:0 4px 15px #ffd70066,0 0 0 1px #0000001a}.promo-banner-cta:hover{transform:scale(1.05) translateY(-2px);box-shadow:0 8px 25px #ffd70099,0 0 20px #ffd7004d;background:linear-gradient(45deg,#ffa000,#ff8f00)}.promo-banner-cta:active{transform:scale(1.02) translateY(-1px)}.promo-banner-cta .material-icons{font-size:1.2rem}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeOutUp{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-20px)}}@keyframes slideOutUp{0%{opacity:1;transform:translateY(0);max-height:200px;margin-bottom:var(--space-8);padding:var(--space-6)}to{opacity:0;transform:translateY(-30px);max-height:0;margin-bottom:0;padding:0}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}@keyframes blink{0%,50%{opacity:1}51%,to{opacity:.5}}@media (max-width: 768px){.promo-banner{flex-direction:column;text-align:center;gap:var(--space-4);padding:var(--space-5)}.promo-banner-icon{font-size:2.5rem}.promo-banner-title{font-size:var(--font-size-lg)}.promo-countdown{justify-content:center;gap:var(--space-1)}.countdown-item{min-width:40px;padding:var(--space-1) var(--space-2)}.countdown-number{font-size:1.1rem}.countdown-label{font-size:.6rem}.promo-banner-cta{width:100%;justify-content:center}}.card{background:linear-gradient(180deg,#141c3a,#121833);border:1px solid #1c2450;border-radius:16px;padding:16px;color:var(--txt, #e9ecf4);transition:all .2s ease-in-out}.card .meta{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}.tag{font-size:12px;padding:4px 10px;background:#1b2349;color:#b8c0d9;border:1px solid #2b3566;border-radius:999px}.question-text{font-size:16px;line-height:1.55;margin-bottom:12px}.options{display:grid;gap:8px}.option{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border:1px solid #27305c;border-radius:12px;background:#161d3b;cursor:pointer;transition:background-color .2s,border-color .2s,transform .15s}.option:hover{background-color:#20284e;border-color:#3b467e;transform:translateY(-2px)}.option input[type=radio]{accent-color:var(--acc, #7aa2ff);flex-shrink:0;width:16px;height:16px;margin-top:4px}.option>span,.option>div{flex-grow:1;line-height:1.5}.card .actions{display:flex;gap:8px;margin-top:16px;padding-top:12px;border-top:1px solid #1c2450}.hint{font-size:14px;color:var(--sub, #b8c0d9);margin-top:12px;padding:12px;background:#111833;border-radius:10px}.option.correct{border-color:var(--good, #22c55e);background:#22c55e1a;color:#d1fae5}.option.correct span,.option.correct div{font-weight:600}.option.wrong{border-color:var(--bad, #ff6b6b);background:#ff6b6b1a;color:#fecaca}.question-text .content-image,.option .content-image{max-width:100%;max-height:250px;border-radius:8px;margin:4px 0;display:block;object-fit:contain}.content-error{padding:12px;background-color:#ff6b6b1a;border:1px dashed var(--bad, #ff6b6b);border-radius:8px;color:#fecaca;font-size:13px;text-align:center}.image-container{position:relative;min-height:50px;width:100%}.image-container.image-error:before{content:"⚠️ No se pudo cargar la imagen";position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;padding:12px;background-color:#ffd1661a;border:1px dashed var(--warn, #ffd166);border-radius:8px;color:#ffeab6;font-size:13px;text-align:center;box-sizing:border-box}#initial-flow-container{min-height:100vh;width:100%;background:linear-gradient(270deg,#0a0328,#190745,#0f0b3b);display:flex;align-items:center;justify-content:center;padding:var(--space-4);position:relative;overflow:hidden;z-index:100}#initial-flow-container:before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle at 20% 80%,rgba(129,140,248,.1) 0%,transparent 40%),radial-gradient(circle at 80% 20%,rgba(244,114,182,.1) 0%,transparent 40%);pointer-events:none;z-index:1}.onboarding-card{background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-xl);padding:var(--space-10) var(--space-8);box-shadow:0 25px 50px -12px #00000080;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);width:100%;max-width:420px;text-align:center;position:relative;z-index:2;display:flex;flex-direction:column;gap:var(--space-2);animation:slideUp .6s ease-out}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.onboarding-logo-img{width:100px;height:auto;object-fit:contain;margin:0 auto var(--space-4) auto;animation:logoPulse 4s ease-in-out infinite}@keyframes logoPulse{0%,to{transform:scale(1);filter:drop-shadow(0 8px 32px rgba(129,140,248,.3))}50%{transform:scale(1.05);filter:drop-shadow(0 10px 40px rgba(129,140,248,.45))}}.onboarding-title{font-size:var(--font-size-2xl);font-weight:700;margin:0}.onboarding-subtitle{font-size:var(--font-size-base);color:var(--color-text-muted);margin:0;line-height:1.5;max-width:320px;align-self:center}.google-auth-button{width:100%;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-3);padding:var(--space-3) var(--space-6);background-color:var(--color-bg-tertiary);color:var(--color-text);border:1px solid var(--color-border);border-radius:var(--radius-lg);font-size:var(--font-size-base);font-weight:500;cursor:pointer;transition:all .2s ease;text-decoration:none;margin-top:var(--space-4)}.google-auth-button:hover{transform:translateY(-2px);border-color:var(--color-primary);background-color:var(--color-bg-secondary);box-shadow:0 8px 25px #0003}.google-auth-button:disabled{opacity:.7;cursor:not-allowed;transform:none;background-color:var(--color-bg-tertiary)}.google-icon{width:20px;height:20px;flex-shrink:0}.spinner-small{display:inline-block;width:18px;height:18px;border:2px solid var(--color-border);border-top-color:var(--color-primary);border-radius:50%;animation:spin .8s linear infinite;margin-right:var(--space-2)}@media (max-width: 480px){.onboarding-card{padding:var(--space-8) var(--space-6)}.onboarding-title{font-size:var(--font-size-xl)}.onboarding-logo-img{width:80px}}#home-content-container{width:100%;max-width:1200px;margin:0 auto;padding:var(--space-8)}.welcome-title{font-size:var(--font-size-3xl);font-weight:700;text-align:center;margin-bottom:var(--space-2)}.welcome-subtitle{font-size:var(--font-size-lg);color:var(--color-text-muted);text-align:center;margin-bottom:var(--space-12)}.home-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:var(--space-8)}.empty-state{text-align:center;padding:var(--space-16) var(--space-4);color:var(--color-text-muted);background-color:var(--color-bg-secondary);border-radius:var(--radius-lg);border:2px dashed var(--color-border)}.empty-state .material-icons{font-size:3rem;margin-bottom:var(--space-4)}.empty-state h2{font-size:var(--font-size-xl);margin-bottom:var(--space-2)}.courses-view-container{width:100%;max-width:1280px;margin:0 auto;padding:var(--space-8)}.courses-view-title{font-size:var(--font-size-3xl);font-weight:700;text-align:center;margin-bottom:var(--space-12)}.courses-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:var(--space-8)}.manage-courses-view .hero-section{text-align:center;margin-bottom:var(--space-12)}.manage-courses-view .hero-section h1{font-size:var(--font-size-3xl);margin-bottom:var(--space-6);text-align:center}.manage-courses-view .hero-section .subtitle{color:var(--color-text-muted);max-width:700px;margin:0 auto;line-height:1.6;font-size:var(--font-size-lg);margin-bottom:var(--space-12);padding:0 var(--space-4)}.courses-grid{margin-top:var(--space-8);margin-bottom:var(--space-10)}.course-card-selectable{background-color:var(--color-bg-secondary);border:2px solid var(--color-border);border-radius:var(--radius-lg);overflow:hidden;cursor:pointer;transition:all .2s ease-in-out;position:relative;display:flex;flex-direction:column;margin-bottom:var(--space-4)}.course-card-selectable:hover{transform:translateY(-2px);box-shadow:0 6px 20px #00000026}.course-card-selectable.selected{border-color:var(--color-primary);transform:translateY(-4px);box-shadow:0 10px 30px #00000040}.course-card-selectable .home-card-image{width:100%;height:auto;aspect-ratio:16 / 10;object-fit:cover;flex-shrink:0}.course-card-selectable .home-card-content{padding:var(--space-6);background:none;flex-grow:1;display:flex;flex-direction:column;justify-content:center;text-align:center}.course-card-selectable .home-card-title{font-size:var(--font-size-lg);font-weight:600;line-height:1.4;margin:0}.selection-checkmark{position:absolute;bottom:16px;right:16px;color:var(--color-text-muted);transition:all .2s ease;font-size:var(--font-size-xl)}.course-card-selectable.selected .selection-checkmark{color:var(--color-primary);transform:scale(1.2)}.page-actions{display:flex;justify-content:center;margin-top:var(--space-12);margin-bottom:var(--space-8);width:100%}.page-actions .btn{padding:var(--space-4) var(--space-8);font-size:var(--font-size-lg)}@media (max-width: 768px){.manage-courses-view .hero-section h1{font-size:var(--font-size-2xl);margin-bottom:var(--space-4)}.manage-courses-view .hero-section .subtitle{font-size:var(--font-size-base);margin-bottom:var(--space-8);padding:0 var(--space-6)}.course-card-selectable .home-card-content{padding:var(--space-4)}.page-actions{margin-top:var(--space-8);padding:0 var(--space-4)}}.course-content-view-container{width:100%;max-width:960px;margin:0 auto;padding:var(--space-8)}.course-header{display:flex;align-items:center;gap:var(--space-6);padding:var(--space-6);margin-bottom:var(--space-12);border-radius:16px;background-color:rgba(var(--color-bg-secondary-rgb),.5);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);box-shadow:0 8px 32px #0000004d}.course-header img{width:72px;height:72px;border-radius:var(--radius-md)}.course-header__info{flex-grow:1}.course-header h1{font-size:var(--font-size-3xl);margin-bottom:var(--space-2);color:#fff}.course-header p{font-size:var(--font-size-lg);color:var(--color-text-muted);margin:0}.main-action-buttons{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-6)}.action-button{background-color:rgba(var(--color-bg-secondary-rgb),.4);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);color:var(--color-text);padding:var(--space-6);border-radius:16px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-2);text-align:center;font-size:var(--font-size-base);font-weight:500;cursor:pointer;transition:all .2s ease}.action-button:hover{transform:translateY(-5px);background-color:rgba(var(--color-bg-secondary-rgb),.6);border-color:#ffffff40;box-shadow:0 12px 35px #0006}.action-button .material-icons{font-size:2.5rem;color:var(--color-primary)}.section-divider{border:none;height:1px;background-color:#ffffff1a;margin:var(--space-12) 0}.lobby-card-text{background:linear-gradient(135deg,#ffffff1a,#ffffff0d,#0000001a);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.2);border-radius:20px;padding:var(--space-6);margin-bottom:var(--space-4);display:flex;align-items:center;gap:var(--space-5);cursor:pointer;transition:all .4s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;box-shadow:0 8px 32px #0000004d,inset 0 1px #ffffff1a}.lobby-card-text:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(0,212,255,.2),rgba(255,107,157,.2),transparent);transition:left .6s ease;z-index:1}.lobby-card-text:hover:before{left:100%}.lobby-card-text:hover{transform:translateY(-10px) scale(1.02);background:linear-gradient(135deg,#ffffff26,#ffffff14,#0000000d);border-color:#ffffff4d;box-shadow:0 25px 60px #0006,0 0 40px #00d4ff4d,inset 0 1px #fff3}.lobby-card-text .card-icon{width:70px;height:70px;display:flex;align-items:center;justify-content:center;border-radius:16px;position:relative;z-index:2;flex-shrink:0;border:2px solid rgba(255,255,255,.2);box-shadow:0 8px 25px #0000004d,inset 0 1px #ffffff1a}.lobby-card-text[data-card-id*=rafaga] .card-icon{background:linear-gradient(135deg,#ff6b9d,gold,#ff4081);animation:pulseGlow 4s ease-in-out infinite alternate}.lobby-card-text[data-card-id*=rafaga] .card-icon:after{content:"";width:38px;height:38px;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16 2L20.5 6.5L27 4L25.5 10.5L31 13L25.5 15.5L27 22L20.5 19.5L16 24L11.5 19.5L5 22L6.5 15.5L1 13L6.5 10.5L5 4L11.5 6.5L16 2Z' fill='white'/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;background-position:center}.lobby-card-text[data-card-id*=estudio] .card-icon{background:linear-gradient(135deg,#00d4ff,#4ecdc4,#00bcd4);animation:rotateGlow 6s linear infinite}.lobby-card-text[data-card-id*=estudio] .card-icon:after{content:"";width:38px;height:38px;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='16' cy='16' r='3' fill='white'/%3E%3Cpath d='M16 4V8M16 24V28M28 16H24M8 16H4' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='M23.314 8.686L20.485 11.515M11.515 20.485L8.686 23.314' stroke='white' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;background-position:center}.lobby-card-text[data-card-id*=galactica] .card-icon{background:linear-gradient(135deg,#9d50bb,#6441a4,#c471ed);animation:nebulaGlow 5s ease-in-out infinite alternate}.lobby-card-text[data-card-id*=galactica] .card-icon:after{content:"";width:38px;height:38px;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cellipse cx='16' cy='16' rx='13' ry='5' stroke='white' stroke-width='1.5'/%3E%3Cellipse cx='16' cy='16' rx='13' ry='5' stroke='rgba(255,255,255,0.8)' stroke-width='1.5' transform='rotate(60 16 16)'/%3E%3Cellipse cx='16' cy='16' rx='4' ry='4' fill='white'/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;background-position:center}.lobby-card-text .card-info{flex:1;position:relative;z-index:2}.lobby-card-text .card-title{font-size:1.4rem;font-weight:700;color:#fff;margin:0 0 .5rem;text-shadow:0 2px 4px rgba(0,0,0,.3)}.lobby-card-text .card-description{color:#ffffffd9;margin:0 0 .75rem;line-height:1.5;font-size:1rem}.lobby-card-text .card-premium-section{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);margin-top:auto;position:relative;z-index:2}.lobby-card-text .card-gems{display:flex;align-items:center;gap:.5rem;background:linear-gradient(135deg,#00d4ff33,#4ecdc433);border:1px solid rgba(0,212,255,.4);border-radius:12px;padding:.4rem .8rem;font-weight:600;color:#00d4ff;font-size:1rem;box-shadow:0 4px 12px #00d4ff33}.lobby-card-text .card-gems:before{content:"💎";font-size:1.1rem;filter:drop-shadow(0 0 4px rgba(0,212,255,.6))}.lobby-card-text .card-premium{background:linear-gradient(135deg,gold,#fa0);color:#000;padding:.4rem 1rem;border-radius:12px;font-size:.85rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px;box-shadow:0 4px 12px #ffd70066,inset 0 1px #ffffff4d;border:1px solid rgba(255,215,0,.6)}.lobby-card-text[data-is-premium=true]{border:2px solid transparent;background-clip:padding-box;position:relative}.lobby-card-text[data-is-premium=true]:after{content:"";position:absolute;inset:-2px;background:linear-gradient(45deg,gold,#ff6b9d,#00d4ff,#9d50bb,gold);background-size:400%;border-radius:20px;z-index:-1;animation:rotateBorder 6s linear infinite}.lobby-card-text[data-is-premium=true]:hover{box-shadow:0 25px 60px #0006,0 0 50px #ffd7004d,0 0 80px #ff6b9d33}.live-class-card{background-color:rgba(var(--color-bg-secondary-rgb),.5);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);border-left:4px solid var(--color-primary);border-radius:var(--radius-lg);padding:var(--space-5);margin-bottom:var(--space-4);display:grid;grid-template-areas:"indicator title arrow" "indicator description arrow";grid-template-columns:auto 1fr auto;align-items:center;gap:0 var(--space-4);cursor:pointer;transition:all .2s ease}.live-class-card:hover{transform:translateY(-4px);background-color:rgba(var(--color-bg-secondary-rgb),.65);border-color:#ffffff40}@keyframes pulseGlow{0%{box-shadow:0 0 20px #ff6b9d66,inset 0 1px #ffffff4d;transform:scale(1)}to{box-shadow:0 0 40px #ffd700b3,0 0 60px #ff6b9d66,inset 0 1px #fff6;transform:scale(1.05)}}@keyframes rotateGlow{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes nebulaGlow{0%{box-shadow:0 0 25px #9d50bb80,inset 0 1px #ffffff4d;transform:scale(1)}to{box-shadow:0 0 45px #6441a4cc,0 0 70px #9d50bb66,inset 0 1px #fff6;transform:scale(1.03)}}@keyframes rotateBorder{0%{background-position:0% 50%}to{background-position:100% 50%}}@keyframes pulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.1);opacity:.7}to{transform:scale(1);opacity:1}}@media (min-width: 768px){.main-action-buttons{grid-template-columns:repeat(4,1fr)}}@media (max-width: 768px){.lobby-card-text{padding:var(--space-4);gap:var(--space-4)}.lobby-card-text .card-icon{width:60px;height:60px}.lobby-card-text .card-icon:after{width:32px;height:32px}.lobby-card-text .card-title{font-size:1.2rem}.lobby-card-text .card-premium-section{flex-direction:column;align-items:stretch;gap:var(--space-2)}.lobby-card-text:hover{transform:translateY(-6px) scale(1.01)}}@supports not (backdrop-filter: blur(20px)){.lobby-card-text{background:rgba(var(--color-bg-secondary-rgb),.9)}}.story-mode-view,.subject-themes-view{width:100%;max-width:1100px;margin:0 auto;padding:var(--space-8)}.story-mode-header{display:flex;align-items:center;gap:var(--space-5);margin-bottom:var(--space-10)}.story-mode-header h1{font-size:var(--font-size-3xl);margin:0;color:#eaeaea}.back-button{background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:50%;width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background-color .2s ease}.back-button:hover{background-color:var(--color-card)}.story-mode-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--space-8)}.area-card,.subject-card,.theme-card{background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-6);cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;display:flex;flex-direction:column;text-align:center;text-decoration:none;color:var(--color-text)}.area-card:hover,.subject-card:hover,.theme-card:hover{transform:translateY(-6px);box-shadow:0 10px 30px #0003;border-color:var(--color-primary)}.card-icon-wrapper{margin:0 auto var(--space-5) auto;width:80px;height:80px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center}.card-icon-wrapper .material-icons{font-size:2.5rem;color:#fff}.card-main-title{font-size:var(--font-size-lg);font-weight:500;margin:0;margin-bottom:var(--space-2);line-height:1.3;color:#eaeaea}.card-secondary-text{font-size:var(--font-size-sm);color:#b0b0b0;margin-bottom:var(--space-5);flex-grow:1}.card-progress-container{width:100%;height:8px;background-color:var(--color-border);border-radius:var(--radius-full);overflow:hidden}.card-progress-fill{height:100%;background-color:var(--color-success);width:0%;transition:width .5s ease}.topic-lessons-view-container{display:grid;grid-template-columns:1fr;gap:var(--space-8);width:100%;max-width:1280px;margin:0 auto;padding:var(--space-6)}@media (min-width: 992px){.topic-lessons-view-container{grid-template-columns:minmax(0,2fr) minmax(0,1fr)}}.topic-lessons-header{display:flex;align-items:center;gap:var(--space-5);margin-bottom:var(--space-8)}.back-to-themes-btn{background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:50%;width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background-color .2s ease}.back-to-themes-btn:hover{background-color:var(--color-card)}.back-to-themes-btn .material-icons{font-size:1.25rem}.topic-lessons-header h1{font-size:var(--font-size-3xl);margin:0;color:#eaeaea}.lesson-group{margin-bottom:var(--space-8)}.lesson-group-title{font-size:var(--font-size-xl);font-weight:600;margin-bottom:var(--space-5);padding-bottom:var(--space-3);border-bottom:1px solid var(--color-border);display:flex;align-items:center;gap:var(--space-3);color:#eaeaea}.lesson-row{display:flex;align-items:center;gap:var(--space-4);padding:var(--space-4);border-radius:var(--radius-md);cursor:pointer;transition:background-color .2s ease;border:1px solid transparent}.lesson-row:hover{background-color:var(--color-bg-secondary)}.lesson-row .lesson-icon,.lesson-row .lesson-chevron{color:var(--color-text-muted)}.lesson-row .lesson-title{flex-grow:1;color:#d1d1d1}.lesson-row.is-completed{opacity:.6}.lesson-row.is-completed .lesson-title{text-decoration:line-through}.lesson-row.is-completed .lesson-icon{color:var(--color-success)}.lesson-navigation-pane{display:none}@media (min-width: 992px){.lesson-navigation-pane{display:block;position:sticky;top:100px;align-self:start;background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-6);max-height:calc(100vh - 120px);overflow-y:auto}}.nav-pane-header{font-size:var(--font-size-lg);font-weight:600;margin-bottom:var(--space-4);color:#eaeaea}.progress-bar{width:100%;height:8px;background-color:var(--color-border);border-radius:var(--radius-full);overflow:hidden;margin-bottom:var(--space-6)}.progress-bar-fill{height:100%;background-color:var(--color-success);width:0%;transition:width .5s ease}.nav-lesson-list{display:flex;flex-direction:column;gap:var(--space-1)}.nav-lesson-item{font-size:var(--font-size-sm);padding:var(--space-3);border-radius:var(--radius-sm);display:flex;align-items:center;gap:var(--space-3);cursor:pointer;transition:background-color .2s ease}.nav-lesson-item:hover{background-color:var(--color-card)}.nav-lesson-item.is-completed .nav-lesson-status{color:var(--color-success)}.nav-lesson-item .nav-lesson-title{flex-grow:1;color:#d1d1d1}.trivia-content{display:flex;flex-direction:column;width:100%;height:100%}.trivia-card{background-color:transparent;border:none;padding:0;flex-grow:1;display:flex;flex-direction:column}.trivia-card-header{font-size:var(--font-size-sm);color:var(--color-text-muted);margin-bottom:var(--space-6)}.trivia-card-body{margin-bottom:var(--space-8)}.trivia-question-text{font-size:var(--font-size-lg);line-height:1.7}.trivia-options-list{display:flex;flex-direction:column;gap:var(--space-4)}.trivia-option{display:flex;align-items:center;gap:var(--space-5);border:2px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-4);cursor:pointer;transition:all .2s ease-out}.option-letter{flex-shrink:0;width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background-color:var(--color-border);font-weight:700;transition:all .2s ease-out}.option-text{flex-grow:1;font-size:var(--font-size-base)}.trivia-option:hover{border-color:var(--color-primary);background-color:var(--color-card)}.trivia-option.selected{border-color:var(--color-primary);background-color:var(--color-primary-muted);box-shadow:0 0 15px rgba(var(--color-primary-rgb),.2)}.trivia-option.selected .option-letter{background-color:var(--color-primary);color:var(--color-on-primary);transform:scale(1.1)}.trivia-navigation{display:flex;justify-content:space-between;align-items:center;margin-top:var(--space-8);padding-top:var(--space-6);border-top:1px solid var(--color-border)}.trivia-results{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:var(--space-10);height:100%}.trivia-results .material-icons{font-size:5rem;color:var(--color-success)}.trivia-results h2{font-size:var(--font-size-3xl);margin-top:var(--space-4)}.trivia-results .score{font-size:var(--font-size-5xl);font-weight:700;color:var(--color-primary);margin:var(--space-2) 0}.trivia-results p{font-size:var(--font-size-lg);color:var(--color-text-muted);margin-bottom:var(--space-8)}.exam-list-view-container{width:100%;max-width:1100px;margin:0 auto;padding:var(--space-8)}.story-mode-header{display:flex;align-items:center;gap:var(--space-5);margin-bottom:var(--space-8)}.story-mode-header h1{font-size:var(--font-size-3xl);margin:0}.exam-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:var(--space-7)}.exam-card{background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-6);display:flex;flex-direction:column;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}.exam-card:not(.is-locked){cursor:pointer}.exam-card:not(.is-locked):hover{transform:translateY(-6px);box-shadow:0 10px 30px #0003;border-color:var(--color-primary)}.exam-card-header{display:flex;align-items:center;gap:var(--space-4);margin-bottom:var(--space-4)}.exam-card-header .material-icons{font-size:2rem;color:var(--color-primary)}.exam-card-title{font-size:var(--font-size-xl);font-weight:500}.exam-card-description{color:var(--color-text-muted);font-size:var(--font-size-sm);line-height:1.5;margin-bottom:var(--space-5);flex-grow:1}.exam-card-info{display:flex;justify-content:space-between;font-size:var(--font-size-sm);color:var(--color-text-muted);padding-top:var(--space-4);border-top:1px solid var(--color-border);margin-bottom:var(--space-6)}.exam-card-button{margin-top:auto;width:100%}.exam-card.is-locked{opacity:.6;filter:grayscale(80%);cursor:not-allowed}.exam-card.is-locked .exam-card-header .material-icons{color:var(--color-text-muted)}.exam-screen-view-container{width:100%;max-width:800px;margin:0 auto}.exam-header{display:flex;justify-content:space-between;align-items:center;padding:var(--space-4) var(--space-6);background-color:var(--color-bg-secondary);border-bottom:1px solid var(--color-border);position:sticky;top:64px;z-index:90}.exam-header__info,.exam-header__timer{font-size:var(--font-size-base)}.exam-header__timer{display:flex;align-items:center;gap:var(--space-2);background-color:var(--color-card);padding:var(--space-2) var(--space-4);border-radius:var(--radius-full);font-weight:700}.exam-header__timer .material-icons{color:var(--color-primary)}.exam-question-container{padding:var(--space-8) var(--space-6)}.exam-question-card .exam-header__info{color:var(--color-primary-muted, #9090A0);font-weight:500}.exam-question-text{font-size:var(--font-size-lg);line-height:1.7;margin-bottom:var(--space-8);color:#eaeaea}.exam-question-image{max-width:100%;border-radius:var(--radius-lg);margin:0 auto var(--space-8) auto;display:block}.exam-options-list{display:flex;flex-direction:column;gap:var(--space-4)}.exam-option{display:flex;align-items:center;gap:var(--space-5);border:2px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-4);cursor:pointer;transition:all .2s ease-out}.option-letter{flex-shrink:0;width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background-color:var(--color-border);font-weight:700;transition:all .2s ease-out;color:#1a1a1e}.option-text{flex-grow:1;color:#eaeaea}.exam-option:hover{border-color:var(--color-primary);background-color:var(--color-card)}.exam-option.selected{border-color:var(--color-primary);background-color:var(--color-primary-muted);box-shadow:0 0 15px rgba(var(--color-primary-rgb),.2)}.exam-option.selected .option-letter{background-color:var(--color-primary);color:var(--color-on-primary);transform:scale(1.1)}.exam-footer{display:flex;justify-content:space-between;align-items:center;gap:var(--space-6);padding:var(--space-4) var(--space-6);background:linear-gradient(to top,var(--color-bg) 60%,transparent);position:sticky;bottom:0;z-index:90}.exam-footer .button{flex-grow:1}@media (min-width: 640px){.exam-footer .button{flex-grow:0;width:auto;min-width:150px}}.live-class-view-container{width:100%;max-width:1100px;margin:0 auto;padding:var(--space-6)}.live-class-header{display:flex;align-items:center;gap:var(--space-5);margin-bottom:var(--space-6)}.live-class-header .back-button{background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:50%;width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background-color .2s ease}.live-class-header .back-button:hover{background-color:var(--color-card)}.live-class-header h1{font-size:var(--font-size-3xl);margin:0}.video-player-wrapper{position:relative;width:100%;padding-bottom:56.25%;background-color:#000;border-radius:var(--radius-lg);overflow:hidden;box-shadow:0 10px 30px #0003;border:1px solid var(--color-border)}.class-meta-info{margin-top:var(--space-6);padding:var(--space-4);background-color:var(--color-bg-secondary);border-radius:var(--radius-md);display:flex;align-items:center;gap:var(--space-3);color:var(--color-text-muted)}.recorded-class-list-view-container{width:100%;max-width:900px;margin:0 auto;padding:var(--space-8)}.view-header{display:flex;align-items:center;gap:var(--space-5);margin-bottom:var(--space-8)}.view-header h1{font-size:var(--font-size-3xl);margin:0}.recorded-class-list{display:flex;flex-direction:column;gap:var(--space-5)}.recorded-class-card{background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-4);display:flex;align-items:center;gap:var(--space-5);transition:transform .2s ease,box-shadow .2s ease}.recorded-class-card:not(.is-locked){cursor:pointer}.recorded-class-card:not(.is-locked):hover{transform:translateY(-4px);box-shadow:0 8px 25px #00000026}.class-thumbnail{flex-shrink:0;width:120px;height:70px;border-radius:var(--radius-md);background-color:var(--color-card);background-size:cover;background-position:center;position:relative;overflow:hidden}.class-thumbnail .play-icon-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#0006;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s ease}.class-thumbnail .play-icon-overlay .material-icons{font-size:2.5rem;color:#fff}.recorded-class-card:hover .play-icon-overlay{opacity:1}.class-details{flex-grow:1}.class-title{font-size:var(--font-size-lg);font-weight:500;margin-bottom:var(--space-1)}.class-meta{font-size:var(--font-size-sm);color:var(--color-text-muted)}.class-action-button{margin-left:auto;flex-shrink:0}.class-action-button .btn-secondary{display:flex;align-items:center;gap:var(--space-2)}.class-action-button .gem-cost{font-weight:700}.recorded-class-card.is-locked{opacity:.7}.recorded-class-card.is-locked .class-thumbnail{filter:grayscale(100%)}.store-view-container{width:100%;max-width:1200px;margin:0 auto;padding:var(--space-8)}.store-view-title{font-size:var(--font-size-4xl);font-weight:700;text-align:center;margin-bottom:var(--space-12);color:var(--color-text)}.store-section-title{font-size:var(--font-size-3xl);font-weight:600;color:var(--color-text);text-align:center;margin-bottom:var(--space-8);margin-top:var(--space-16)}.store-section-title:first-of-type{margin-top:0}.pricing-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--space-8);align-items:center}.plan-card{background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-xl);padding:var(--space-8);display:flex;flex-direction:column;text-align:center;transition:transform .2s ease,box-shadow .2s ease;position:relative}.plan-card:hover{transform:translateY(-8px);box-shadow:0 10px 30px #0003}.plan-card--highlighted{transform:scale(1.05);border:2px solid var(--color-primary);box-shadow:0 0 25px rgba(var(--color-primary-rgb),.3)}.highlight-badge{position:absolute;top:-15px;left:50%;transform:translate(-50%);background-color:var(--color-primary);color:var(--color-on-primary);padding:var(--space-2) var(--space-4);border-radius:var(--radius-full);font-size:var(--font-size-sm);font-weight:600;text-transform:uppercase}.plan-icon{font-size:2.5rem;color:var(--color-primary);margin-bottom:var(--space-4)}.plan-title{font-size:var(--font-size-xl);font-weight:600;margin-bottom:var(--space-2)}.plan-description{font-size:var(--font-size-sm);color:var(--color-text-muted);margin-bottom:var(--space-6);min-height:40px}.plan-price{font-size:var(--font-size-5xl);font-weight:700;margin-bottom:var(--space-1)}.plan-price span{font-size:var(--font-size-lg);font-weight:400;color:var(--color-text-muted)}.plan-button{background-color:var(--color-primary);color:var(--color-on-primary);border:none;border-radius:var(--radius-md);padding:var(--space-4) var(--space-6);font-size:var(--font-size-lg);font-weight:600;cursor:pointer;margin-top:var(--space-6);transition:background-color .2s ease}.plan-button:hover{background-color:var(--color-primary-dark)}.product-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--space-7)}.product-card{background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-xl);padding:var(--space-7);text-align:center;display:flex;flex-direction:column;transition:transform .2s ease,box-shadow .2s ease}.product-card:hover{transform:translateY(-8px);box-shadow:0 10px 30px #0003}.product-title{font-size:var(--font-size-xl);font-weight:600;margin-bottom:var(--space-2)}.product-description{font-size:var(--font-size-sm);color:var(--color-text-muted);flex-grow:1;margin-bottom:var(--space-6)}.product-button{background-color:var(--color-primary);color:var(--color-on-primary);border:none;border-radius:var(--radius-md);padding:var(--space-4) var(--space-6);font-size:var(--font-size-lg);font-weight:600;cursor:pointer;transition:background-color .2s ease}.product-button:hover{background-color:var(--color-primary-dark)}.premium-status-card{background:linear-gradient(145deg,#1a160d,#4d3a0a);border:2px solid #D4AF37;border-radius:var(--radius-xl);padding:var(--space-8);color:#fff;position:relative;overflow:hidden;box-shadow:0 10px 30px #00000080,0 0 20px #ffd70033;animation:premium-pulse 4s infinite ease-in-out}@keyframes premium-pulse{0%{box-shadow:0 10px 30px #00000080,0 0 20px #ffd70033;border-color:#d4af37}50%{box-shadow:0 10px 35px #0009,0 0 30px #ffd70066;border-color:gold}to{box-shadow:0 10px 30px #00000080,0 0 20px #ffd70033;border-color:#d4af37}}.premium-header .premium-icon{color:gold;font-size:2.5rem}.premium-badge .premium-label{color:#f0e6d2}.premium-badge .premium-status{background:#0d410d;color:#90ee90;border:1px solid #90ee90}.premium-title{color:gold;font-size:var(--font-size-2xl);text-shadow:0 0 10px rgba(255,215,0,.5)}.premium-expiry-label,.premium-description{color:var(--color-text-muted)}.premium-expiry-date{color:#f0e6d2;font-weight:600}.premium-countdown-number{color:#fff;font-size:1.5rem;font-weight:700}.premium-countdown-label{color:#d4af37;font-size:var(--font-size-xs);text-transform:uppercase}.premium-feature .material-icons{color:gold}.premium-feature span{color:#f0e6d2}.profile-view{background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-xl);padding:var(--space-8);box-shadow:var(--shadow-lg);max-width:600px;margin:0 auto;display:flex;flex-direction:column;gap:var(--space-8)}.profile-header{display:flex;align-items:center;gap:var(--space-6)}.profile-avatar{width:80px;height:80px;border-radius:50%;border:3px solid var(--color-primary);object-fit:cover}.profile-avatar.premium{box-shadow:0 0 15px var(--color-premium),0 0 5px var(--color-premium);animation:premium-glow 2s ease-in-out infinite}@keyframes premium-glow{0%,to{box-shadow:0 0 15px var(--color-premium),0 0 5px var(--color-premium)}50%{box-shadow:0 0 25px var(--color-premium),0 0 10px var(--color-premium)}}.profile-info{flex-grow:1}.profile-name{font-size:var(--font-size-2xl);font-weight:700;margin:0 0 var(--space-1) 0}.profile-rank{font-size:var(--font-size-lg);color:var(--color-text-muted);margin:0}.profile-level{display:flex;flex-direction:column;gap:var(--space-3)}.level-header{display:flex;justify-content:space-between;align-items:center;font-size:var(--font-size-sm);font-weight:500}.xp-counter{color:var(--color-text-muted)}.progress-bar-container{width:100%;height:12px;background-color:var(--color-bg);border-radius:var(--radius-full);overflow:hidden}.progress-bar{height:100%;background-image:linear-gradient(90deg,var(--color-secondary),var(--color-primary));border-radius:var(--radius-full);transition:width .5s ease-out}.profile-stats-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-4)}.stat-card{background-color:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-4);text-align:center}.stat-value{display:block;font-size:var(--font-size-xl);font-weight:700;color:var(--color-primary);margin-bottom:var(--space-1)}.stat-label{font-size:var(--font-size-sm);color:var(--color-text-muted)}.profile-actions{display:flex;justify-content:center}#my-acquisitions-btn{width:100%}.logout-container{margin-top:var(--space-4);border-top:1px solid var(--color-border);padding-top:var(--space-6);display:flex;justify-content:center}.logout-btn-profile{background-color:transparent;border:1px solid var(--color-error);color:var(--color-error);font-weight:600;padding:var(--space-3) var(--space-6);border-radius:var(--radius-md);cursor:pointer;transition:all .2s ease}.logout-btn-profile:hover{background-color:var(--color-error);color:#fff}.my-acquisitions-view-container{width:100%;max-width:800px;margin:0 auto;padding:var(--space-8)}.my-acquisitions-title{font-size:var(--font-size-3xl);font-weight:700;text-align:center;margin-bottom:var(--space-12)}.acquisitions-list{display:flex;flex-direction:column;gap:var(--space-4)}.terms-view-container{width:100%;height:100vh;display:flex;flex-direction:column;background-color:var(--color-bg-secondary)}.terms-content{flex-grow:1;overflow-y:auto;padding:var(--space-8)}.terms-text-container{max-width:75ch;margin:0 auto}.terms-text-container h1{font-size:var(--font-size-3xl);margin-bottom:var(--space-8);text-align:center}.terms-text-container h2{font-size:var(--font-size-xl);font-weight:700;color:var(--color-primary);margin-top:var(--space-8);margin-bottom:var(--space-4)}.terms-text-container p{font-size:var(--font-size-base);color:var(--color-text-muted);line-height:1.8;margin-bottom:var(--space-6)}.terms-text-container ul{padding-left:var(--space-6);margin-bottom:var(--space-6)}.terms-text-container li{margin-bottom:var(--space-4);line-height:1.8;color:var(--color-text-muted)}.terms-actions{flex-shrink:0;padding:var(--space-4);background-color:var(--color-bg);border-top:1px solid var(--color-border);box-shadow:0 -4px 20px #0000004d;display:flex;flex-direction:column;align-items:center;gap:var(--space-4)}@media (min-width: 768px){.terms-actions{flex-direction:row;justify-content:center}}.acceptance-checkbox{display:flex;align-items:center;gap:var(--space-3);cursor:pointer}.acceptance-checkbox input[type=checkbox]{appearance:none;-webkit-appearance:none;margin:0;width:20px;height:20px;border:2px solid var(--color-border);border-radius:var(--radius-md);display:grid;place-content:center;transition:background-color .2s,border-color .2s}.acceptance-checkbox input[type=checkbox]:before{content:"";width:12px;height:12px;transform:scale(0);transition:transform .1s ease-in-out;background-color:var(--color-primary);clip-path:polygon(14% 44%,0 65%,50% 100%,100% 16%,80% 0%,43% 62%)}.acceptance-checkbox input[type=checkbox]:checked{background-color:var(--color-primary);border-color:var(--color-primary)}.acceptance-checkbox input[type=checkbox]:checked:before{transform:scale(1);background-color:var(--color-bg)}.acceptance-checkbox label{color:var(--color-text);-webkit-user-select:none;user-select:none}.lesson-viewer-container{display:grid;grid-template-columns:1fr;gap:var(--space-6);width:100%;max-width:1400px;margin:0 auto;padding:var(--space-6)}@media (min-width: 992px){.lesson-viewer-container{grid-template-columns:minmax(0,3fr) minmax(300px,1fr);gap:var(--space-8)}}.lesson-viewer-header{grid-column:1 / -1;display:flex;align-items:center;gap:var(--space-5);margin-bottom:var(--space-6)}.lesson-viewer-header .back-button{background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:50%;width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background-color .2s ease}.lesson-viewer-header .back-button:hover{background-color:var(--color-card)}.lesson-viewer-header h1{font-size:var(--font-size-2xl);margin:0;color:#eaeaea}.lesson-main-content-pane{background-color:var(--color-bg-secondary);border-radius:var(--radius-lg);border:1px solid var(--color-border);padding:var(--space-4)}@media (min-width: 768px){.lesson-main-content-pane{padding:var(--space-6)}}.video-lesson-content,.pdf-lesson-content,.trivia-content{max-width:800px;margin:0 auto}.video-player-wrapper{position:relative;width:100%;padding-bottom:56.25%;background-color:#000;border-radius:var(--radius-md);overflow:hidden;margin-bottom:var(--space-6)}.video-player-wrapper iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:none}.lesson-details-section h2{font-size:var(--font-size-xl);margin-bottom:var(--space-3)}.lesson-actions-section{margin-top:var(--space-6);padding-top:var(--space-6);border-top:1px solid var(--color-border)}.lesson-sidebar-pane{display:none}@media (min-width: 992px){.lesson-sidebar-pane{display:block;background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-4);position:sticky;top:100px;align-self:start;max-height:calc(100vh - 120px);overflow-y:auto}}.sidebar-title{font-size:var(--font-size-lg);font-weight:600;margin-bottom:var(--space-4);padding:0 var(--space-2);color:#eaeaea}.sidebar-lesson-list{display:flex;flex-direction:column;gap:var(--space-1)}.sidebar-lesson-item{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3);border-radius:var(--radius-md);cursor:pointer;transition:background-color .2s ease;font-size:var(--font-size-sm)}.sidebar-lesson-item:hover{background-color:var(--color-card)}.sidebar-lesson-item.is-active{background-color:var(--color-primary-muted);color:var(--color-primary);font-weight:500}.sidebar-lesson-item.is-completed{opacity:.7}.sidebar-lesson-item .lesson-status-icon,.sidebar-lesson-item .lesson-type-icon{font-size:1rem;color:var(--color-text-muted)}.sidebar-lesson-item.is-active .material-icons{color:var(--color-primary)}.sidebar-lesson-item.is-completed .lesson-status-icon{color:var(--color-success)}.sidebar-lesson-item .lesson-title{flex-grow:1;color:#d1d1d1}.question-bank-view .app-layout{display:grid;grid-template-columns:300px 1fr 340px;gap:16px;padding:16px;min-height:calc(100vh - 80px)}.question-bank-view aside,.question-bank-view main{background:var(--panel, #121832);border:1px solid #1b2342;border-radius:var(--radius, 16px);color:var(--txt, #e9ecf4);display:flex;flex-direction:column}.question-bank-view header{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid #1b2342;flex-shrink:0}.question-bank-view header h1{font-size:18px;margin:0;letter-spacing:.3px}.question-bank-view .section{padding:16px}.question-bank-view .section h3{margin:0 0 12px;font-size:14px;color:var(--sub, #b8c0d9);font-weight:600;text-transform:uppercase;letter-spacing:.08em}.question-bank-view select,.question-bank-view input[type=number],.question-bank-view .btn{background:var(--muted, #222a4a);color:var(--txt, #e9ecf4);border:1px solid #293157;border-radius:12px;padding:10px 12px;font-size:14px;outline:none;transition:border-color .2s,background-color .2s;width:100%}.question-bank-view select:focus,.question-bank-view input[type=number]:focus{border-color:var(--acc, #7aa2ff)}.question-bank-view .btn{cursor:pointer;border:1px solid #2f3b6d;background:linear-gradient(180deg,#1e2750,#1a2346)}.question-bank-view .btn:hover{border-color:#3b467e}.question-bank-view .btn.acc{background:linear-gradient(180deg,#2a49a2,#223a86);border-color:#2d4fb2;font-weight:600}.question-bank-view .mode-switch{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}.question-bank-view .mode-switch .btn.acc{background:var(--soft, #2c3665);border-color:var(--acc, #7aa2ff);color:#fff}.question-bank-view .toolbar{display:flex;gap:10px;align-items:flex-end}.question-bank-view .toolbar .grow{flex-grow:1}.question-bank-view .control{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}.question-bank-view .control label{font-size:13px;color:var(--sub, #b8c0d9);padding-left:4px}.question-bank-view .chips{display:flex;flex-direction:column;align-items:flex-start;gap:8px}.question-bank-view .chip{display:inline-flex;align-items:center;gap:10px;background:var(--muted, #222a4a);border:1px solid #2a345f;padding:8px 12px;border-radius:999px;font-size:13px;color:var(--sub, #b8c0d9);cursor:pointer;-webkit-user-select:none;user-select:none;transition:border-color .2s}.question-bank-view .chip:hover{border-color:#3b467e}.question-bank-view .chip input[type=checkbox]{appearance:none;-webkit-appearance:none;margin:0;width:18px;height:18px;background-color:#121832;border:1px solid #2f3b6d;border-radius:6px;display:grid;place-content:center;cursor:pointer;transition:all .2s}.question-bank-view .chip input[type=checkbox]:before{content:"";width:10px;height:10px;transform:scale(0);transition:.12s transform ease-in-out;box-shadow:inset 1em 1em #fff;transform-origin:center;clip-path:polygon(14% 44%,0 65%,50% 100%,100% 16%,80% 0%,43% 62%)}.question-bank-view .chip input[type=checkbox]:checked{background-color:var(--acc, #7aa2ff);border-color:var(--acc, #7aa2ff)}.question-bank-view .chip input[type=checkbox]:checked:before{transform:scale(1)}.question-bank-view .empty{opacity:.7;text-align:center;padding:30px;margin:16px;border:1px dashed #2a335f;border-radius:16px}.question-bank-view .question-list{display:flex;flex-direction:column;gap:12px;padding:16px}.question-bank-view .stat{display:flex;justify-content:space-between;align-items:center;background:#121a38;border:1px solid #212a5b;padding:10px 14px;border-radius:12px;margin-bottom:10px}.question-bank-view .footer{padding:16px;font-size:12px;color:#9aa4cf;text-align:center;margin-top:auto;border-top:1px solid #1b2342}.loading-modal{border:1px solid #2b3566;border-radius:18px;padding:24px 32px;background:#0f1634;color:var(--txt);text-align:center;overflow:hidden}.loading-modal::backdrop{background:#03050f99;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.spinner{width:48px;height:48px;border:4px solid #2a335f;border-top-color:var(--acc, #7aa2ff);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.btn.ghost{background:transparent}.btn.circular{width:32px;height:32px;border-radius:50%;padding:0;font-size:16px;flex-shrink:0;display:flex;align-items:center;justify-content:center;border-color:#2a345f}.btn.circular:hover{background-color:var(--muted);border-color:var(--acc)}.info-modal{border:none;border-radius:var(--radius, 16px);padding:0;background:transparent;max-width:850px;width:90vw;color:var(--txt);overflow:hidden}.info-modal::backdrop{background:#03050f99;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.info-modal .modal-content{background:var(--panel, #121832);border:1px solid #1b2342;border-radius:var(--radius, 16px)}.info-modal .modal-header{display:flex;justify-content:space-between;align-items:center;padding:14px 24px;border-bottom:1px solid #1b2342;position:sticky;top:0;background:var(--panel, #121832);z-index:10}.info-modal .modal-header h2{display:flex;align-items:center;gap:8px;margin:0;font-size:18px}.info-modal .modal-body{padding:16px 40px 32px;max-height:75vh;overflow-y:auto;font-size:15px;line-height:1.7;color:var(--sub, #b8c0d9)}.info-modal .motivational-header{text-align:center;padding:24px 16px;margin:16px -40px;background:linear-gradient(180deg,rgba(122,162,255,.05),transparent);border-top:1px solid #1b2342;border-bottom:1px solid #1b2342}.info-modal .motivational-header h1{font-size:32px;color:var(--txt, #e9ecf4);margin:0 0 12px;background:-webkit-linear-gradient(45deg,#a0b9ff,var(--acc2, #4be3c2));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.info-modal .motivational-header p{max-width:500px;margin:0 auto}.info-modal h3{font-size:16px;color:var(--txt, #e9ecf4);margin-top:32px;margin-bottom:12px;border-bottom:1px solid #222a4a;padding-bottom:8px}.info-modal ul,.info-modal ol{padding-left:20px}.info-modal li{margin-bottom:12px}.info-modal .modal-footer{margin-top:32px;padding-top:24px;border-top:1px solid #222a4a;text-align:center;opacity:.8}.info-modal .modal-footer h4{margin:0 0 8px;color:var(--txt)}.info-modal .modal-body::-webkit-scrollbar{width:8px}.info-modal .modal-body::-webkit-scrollbar-track{background:#0003;border-radius:10px}.info-modal .modal-body::-webkit-scrollbar-thumb{background-color:var(--soft, #2c3665);border-radius:10px;border:2px solid transparent;background-clip:content-box}.info-modal .modal-body::-webkit-scrollbar-thumb:hover{background-color:var(--acc, #7aa2ff)}@media (max-width: 1100px){.question-bank-view .app-layout{grid-template-columns:1fr}.question-bank-view aside,.question-bank-view .right{order:2}.question-bank-view main{order:1}}
