.theme-toggle{background:transparent;border:none;cursor:pointer;padding:0;display:flex;align-items:center}.theme-toggle-track{width:60px;height:30px;background:var(--toggle-bg, #e5e7eb);border-radius:15px;position:relative;transition:background-color .3s ease;border:2px solid var(--toggle-border, #d1d5db)}.theme-toggle:hover .theme-toggle-track{background:var(--toggle-bg-hover, #d1d5db)}.theme-toggle-thumb{position:absolute;top:50%;transform:translateY(-50%);width:24px;height:24px;background:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 2px 4px #0003;left:2px}[data-theme=dark] .theme-toggle-track{--toggle-bg: #374151;--toggle-bg-hover: #4b5563;--toggle-border: #4b5563}[data-theme=dark] .theme-toggle-thumb{left:calc(100% - 26px);background:#1f2937}.theme-toggle:focus{outline:none}.theme-toggle:focus-visible .theme-toggle-track{outline:2px solid var(--primary-color, #3b82f6);outline-offset:2px}.navbar{position:sticky;top:0;z-index:1000;background-color:var(--bg-secondary);padding:0;box-shadow:var(--shadow-md);border-bottom:1px solid var(--border-color);transition:background-color .3s ease}.navbar-container{max-width:1400px;margin:0 auto;padding:.75rem 2rem;display:flex;justify-content:space-between;align-items:center;gap:2rem}.navbar-brand{display:flex;align-items:center;gap:.75rem;text-decoration:none;transition:all .2s;flex-shrink:0}.navbar-brand:hover{opacity:.9;transform:translateY(-1px)}.navbar-logo-img{height:40px;width:auto}.navbar-brand-text{font-size:1.5rem;font-weight:700;background:linear-gradient(135deg,#c2f933,#22d3ee);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.navbar-center{flex:1;display:flex;justify-content:flex-start;margin-left:3rem}.navbar-links{display:flex;gap:.5rem;align-items:center}.navbar-link{color:var(--text-primary);text-decoration:none;font-size:1rem;font-weight:600;padding:.625rem 1.25rem;border-radius:8px;transition:all .25s ease;position:relative}.navbar-link:hover{background:var(--bg-tertiary);color:var(--primary-color);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.navbar-link:active{transform:translateY(0)}:root .navbar-link:hover{background:#c2f9331a;color:#c2f933}[data-theme=light] .navbar-link:hover{background:#0ea5e91a;color:#0284c7;box-shadow:0 2px 6px #0ea5e926}.navbar-user{color:var(--text-secondary);font-size:.95rem;font-weight:500;padding:0 .5rem}.navbar-button{background:none;border:none;cursor:pointer;padding:0}.logout-btn{background:#ef44441a;color:#ef4444;padding:.625rem 1.25rem;border-radius:8px;font-weight:600;transition:all .25s ease}.logout-btn:hover{background:#ef444433;transform:translateY(-1px)}[data-theme=light] .logout-btn{background:#dc262614;color:#dc2626}[data-theme=light] .logout-btn:hover{background:#dc262626}.navbar-right{display:flex;align-items:center;gap:1rem;flex-shrink:0}.navbar-actions{display:flex;align-items:center;gap:1rem}.mobile-menu-toggle{display:none;background:none;border:none;cursor:pointer;padding:.5rem;z-index:1001}.hamburger{display:flex;flex-direction:column;gap:5px;width:28px}.hamburger span{display:block;width:100%;height:3px;background:var(--text-primary);border-radius:2px;transition:all .3s ease}.hamburger.open span:nth-child(1){transform:rotate(45deg) translate(8px,8px)}.hamburger.open span:nth-child(2){opacity:0}.hamburger.open span:nth-child(3){transform:rotate(-45deg) translate(7px,-7px)}.mobile-menu-actions,.mobile-theme-toggle{display:none}@media (max-width: 768px){.navbar-container{padding:1rem}.navbar-logo-img{height:32px}.navbar-brand-text{font-size:1.25rem}.mobile-menu-toggle{display:block}.navbar-right{margin-left:auto;gap:1rem}.navbar-user{display:block;font-size:.9rem}.navbar-links{position:fixed;top:70px;right:-100%;width:250px;height:calc(100vh - 70px);background:var(--bg-secondary);flex-direction:column;align-items:flex-start;padding:2rem;gap:1.5rem;box-shadow:-2px 0 10px #0003;transition:right .3s ease;z-index:1000;border-left:2px solid var(--border-color)}.navbar-links.mobile-open{right:0}.navbar-link{font-size:1.1rem;width:100%;padding:.5rem 0}.desktop-only{display:none!important}.mobile-menu-actions{display:flex;flex-direction:column;gap:1.5rem;margin-top:2rem;padding-top:2rem;border-top:1px solid var(--border-color);width:100%}.mobile-menu-actions .logout-btn{width:100%;text-align:left;padding:.75rem 0}.mobile-theme-toggle{display:flex;justify-content:flex-start;align-items:center}}.chatbot-toggle{position:fixed;bottom:20px;right:20px;width:60px;height:60px;border-radius:50%;background:linear-gradient(135deg,#2563eb,#1d4ed8);border:none;cursor:pointer;box-shadow:0 4px 12px #2563eb66;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:all .3s ease;z-index:1000}.chatbot-toggle:hover{transform:scale(1.1);box-shadow:0 6px 16px #2563eb80}.chatbot-toggle.hidden{display:none}.chatbot-icon{font-size:1.5rem;margin-bottom:2px}.chatbot-badge{font-size:.65rem;color:#fff;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.chatbot-window{position:fixed;bottom:24px;right:24px;width:380px;height:550px;background:#fff;border-radius:16px;box-shadow:0 8px 32px #00000026;display:flex;flex-direction:column;z-index:1000;animation:slideUp .3s ease-out}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.chatbot-header{background:linear-gradient(135deg,#2563eb,#1d4ed8);color:#fff;padding:16px 20px;border-radius:16px 16px 0 0;display:flex;justify-content:space-between;align-items:flex-start}.chatbot-header-content{display:flex;flex-direction:column;gap:4px}.chatbot-title{font-size:1.1rem;font-weight:600}.chatbot-subtitle{font-size:.8rem;opacity:.9}.chatbot-close{background:none;border:none;color:#fff;font-size:1.5rem;cursor:pointer;padding:0;width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:background .2s}.chatbot-close:hover{background:#fff3}.chatbot-messages{flex:1;overflow-y:auto;padding:20px;display:flex;flex-direction:column;gap:12px;background:#f9fafb}.chatbot-messages::-webkit-scrollbar{width:6px}.chatbot-messages::-webkit-scrollbar-track{background:transparent}.chatbot-messages::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:3px}.chatbot-message{display:flex;animation:fadeIn .3s ease-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.message-content{max-width:75%;padding:12px 16px;border-radius:12px;font-size:.95rem;line-height:1.5;word-wrap:break-word}.bot-message .message-content{background:#fff;color:#1f2937;border:1px solid #e5e7eb;border-radius:12px 12px 12px 4px}.user-message{justify-content:flex-end}.user-message .message-content{background:#2563eb;color:#fff;border-radius:12px 12px 4px}.typing-indicator{display:flex;gap:4px;align-items:center;padding:12px 16px}.typing-indicator span{width:8px;height:8px;border-radius:50%;background:#9ca3af;animation:typing 1.4s infinite}.typing-indicator span:nth-child(2){animation-delay:.2s}.typing-indicator span:nth-child(3){animation-delay:.4s}@keyframes typing{0%,60%,to{transform:translateY(0);opacity:.7}30%{transform:translateY(-10px);opacity:1}}.chatbot-input-container{display:flex;gap:8px;padding:16px;border-top:1px solid #e5e7eb;background:#fff;border-radius:0 0 16px 16px}.chatbot-input{flex:1;padding:12px 16px;border:2px solid #e5e7eb;border-radius:24px;font-size:.95rem;outline:none;transition:border-color .2s;font-family:inherit}.chatbot-input:focus{border-color:#2563eb}.chatbot-input::placeholder{color:#9ca3af}.chatbot-send{width:44px;height:44px;border-radius:50%;background:#2563eb;color:#fff;border:none;cursor:pointer;font-size:1.2rem;display:flex;align-items:center;justify-content:center;transition:all .2s;flex-shrink:0}.chatbot-send:hover:not(:disabled){background:#1d4ed8;transform:scale(1.05)}.chatbot-send:disabled{background:#9ca3af;cursor:not-allowed;opacity:.5}@media (max-width: 768px){.chatbot-window{width:calc(100vw - 32px);height:calc(100vh - 100px);bottom:16px;right:16px}.chatbot-toggle{bottom:16px;right:16px;width:56px;height:56px}.message-content{max-width:85%}}.site-footer{border-top:1px solid rgba(194,249,51,.2);background:#00000005;padding:2rem 1rem;margin-top:auto}.footer-content{max-width:1200px;margin:0 auto;display:flex;flex-direction:column;gap:1rem;align-items:center}.footer-links{display:flex;flex-wrap:wrap;gap:.5rem 1rem;justify-content:center;align-items:center;font-size:.9rem}.footer-link{color:#64748b;text-decoration:none;transition:color .2s;position:relative}.footer-link:not(:last-child):after{content:"|";margin-left:1rem;color:#c2f9334d}.footer-link:hover{color:#0284c7}.footer-copyright{font-size:.85rem;color:#94a3b8;text-align:center}[data-theme=dark] .site-footer{border-top-color:#c2f9334d;background:#ffffff05}[data-theme=dark] .footer-link{color:#94a3b8}[data-theme=dark] .footer-link:hover{color:#c2f933}[data-theme=dark] .footer-link:not(:last-child):after{color:#c2f93380}[data-theme=dark] .footer-copyright{color:#64748b}@media (max-width: 768px){.site-footer{padding:1.5rem 1rem}.footer-links{font-size:.85rem;gap:.75rem}.footer-link:not(:last-child):after{margin-left:.75rem}.footer-copyright{font-size:.8rem}}.scratchpad-toggle-button img{width:24px;height:24px}.scratchpad-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1001;padding:20px}.scratchpad-container{background-color:#fff;border-radius:12px;box-shadow:0 8px 32px #0003;display:flex;flex-direction:column;width:90%;max-width:800px;height:85vh;max-height:700px}.scratchpad-header{display:flex;justify-content:space-between;align-items:center;padding:15px 20px;background:linear-gradient(135deg,#667eea,#764ba2);border-top-left-radius:12px;border-top-right-radius:12px}.scratchpad-header h3{margin:0;font-size:1.2rem;color:#fff;font-weight:600}.close-btn{background:#fff3;border:none;color:#fff;font-size:1.5rem;width:32px;height:32px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s}.close-btn:hover{background:#ffffff4d}.scratchpad-toolbar{display:flex;align-items:center;gap:15px;padding:12px 20px;background-color:#f8f9fa;border-bottom:2px solid #e0e0e0;flex-wrap:wrap}.tool-group{display:flex;align-items:center;gap:8px}.tool-group label{font-size:.9rem;font-weight:600;color:#555}.tool-group input[type=color]{width:40px;height:40px;border:2px solid #ddd;border-radius:8px;padding:2px;cursor:pointer}.tool-group input[type=color]:disabled{opacity:.5;cursor:not-allowed}.tool-group input[type=range]{width:100px;cursor:pointer}.size-indicator{font-weight:600;color:#667eea;min-width:20px}.tool-btn{padding:8px 16px;border:2px solid #ddd;background:#fff;border-radius:8px;cursor:pointer;font-size:.9rem;font-weight:600;transition:all .2s}.tool-btn:hover{border-color:#667eea;transform:translateY(-1px)}.tool-btn.active{background:#667eea;color:#fff;border-color:#667eea}.clear-btn:hover{border-color:#ef4444;color:#ef4444}.scratchpad-canvas{flex-grow:1;width:100%;border-bottom-left-radius:12px;border-bottom-right-radius:12px;cursor:crosshair;touch-action:none}.scratchpad-toggle-button{position:fixed;bottom:95px;right:20px;width:60px;height:60px;border-radius:50%;background-color:#007bff;color:#fff;border:none;cursor:pointer;display:flex;justify-content:center;align-items:center;font-size:24px;box-shadow:0 2px 4px #0003;z-index:1000}@media (max-width: 768px){.scratchpad-toggle-button{bottom:80px;right:16px;width:56px;height:56px}.scratchpad-overlay{padding:10px}.scratchpad-container{width:100%;height:90vh}.scratchpad-toolbar{padding:10px;gap:10px}.tool-group input[type=range]{width:60px}.tool-btn{padding:6px 12px;font-size:.85rem}}.layout{min-height:100vh;display:flex;flex-direction:column}.layout header{position:sticky;top:0;z-index:1000}.main-content{flex:1;max-width:1200px;width:100%;margin:0 auto;padding:2rem}@media (max-width: 768px){.main-content{padding:1rem}}.voice-chat-toggle-button{position:fixed;bottom:170px;right:20px;width:60px;height:60px;border-radius:50%;background:linear-gradient(135deg,#667eea,#764ba2);border:none;font-size:1.8rem;cursor:pointer;box-shadow:0 8px 30px #667eea80;transition:all .3s ease;z-index:9999;display:flex;align-items:center;justify-content:center;animation:bounce 2s ease-in-out infinite}.voice-chat-toggle-button:hover{transform:scale(1.1) translateY(0);box-shadow:0 10px 40px #667eeab3;animation:none}.voice-chat-toggle-button:active{transform:scale(.95)}@media (max-width: 768px){.voice-chat-toggle-button{bottom:150px;right:16px;width:56px;height:56px;font-size:1.6rem}}.landing-page{padding:2rem 0}.hero{text-align:center;padding:8rem 2rem 6rem;background-image:url(/assets/hero-Cvsax11J.jpg);background-size:cover;background-position:center;background-repeat:no-repeat;position:relative;margin:-2rem 0 0}.hero:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:#0d0d0d73;z-index:1}.hero>*{position:relative;z-index:2}.hero h1{font-size:3.5rem;background:linear-gradient(135deg,#c2f933,#22d3ee,#a855f7);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:1rem;text-shadow:0 4px 8px rgba(0,0,0,.3);font-weight:800}.hero h2{font-size:1.75rem;color:#fff;font-weight:500;margin-bottom:1.5rem;text-shadow:0 2px 4px rgba(0,0,0,.5)}.hero-description{font-size:1.25rem;color:#f3f4f6;max-width:700px;margin:0 auto 2.5rem;text-shadow:0 2px 4px rgba(0,0,0,.5);line-height:1.7}.hero-actions{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;margin-top:2rem}.btn-hero-primary{padding:1.25rem 2.5rem;background:linear-gradient(135deg,#c2f933,#22d3ee);color:#0d0d0d;text-decoration:none;border-radius:12px;font-size:1.2rem;font-weight:800;transition:all .3s ease;box-shadow:0 6px 20px #c2f93366;border:3px solid rgba(255,255,255,.2)}.btn-hero-primary:hover{transform:translateY(-3px) scale(1.05);box-shadow:0 8px 30px #c2f93399}.btn-hero-secondary{padding:1.25rem 2.5rem;background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;text-decoration:none;border-radius:12px;font-size:1.2rem;font-weight:800;border:3px solid rgba(255,255,255,.3);transition:all .3s ease}.btn-hero-secondary:hover{background:#fff3;border-color:#ffffff80;transform:translateY(-3px) scale(1.05);box-shadow:0 6px 20px #ffffff4d}.grade-levels{padding:3rem 2rem 4rem;max-width:1200px;margin:0 auto}.grade-levels h2{text-align:center;font-size:2rem;color:var(--text-primary);margin-bottom:1rem}.members-only-notice{text-align:center;font-size:1.1rem;color:var(--text-secondary);margin-bottom:2rem;padding:1rem;background:linear-gradient(135deg,#06b6d41a,#22d3ee1a);border:1px solid rgba(34,211,238,.2);border-radius:8px;max-width:600px;margin:0 auto 2rem}.grades-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.5rem;max-width:1100px;margin:0 auto}.grade-card{background:linear-gradient(135deg,var(--bg-secondary) 0%,var(--bg-tertiary) 100%);border:2px solid var(--border-color);border-radius:20px;padding:2rem;text-align:center;transition:all .4s cubic-bezier(.175,.885,.32,1.275);cursor:pointer;text-decoration:none;display:flex;flex-direction:column;align-items:center;position:relative;overflow:hidden}.grade-card:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle,rgba(194,249,51,.1) 0%,transparent 70%);opacity:0;transition:opacity .4s ease}.grade-card:hover:before{opacity:1}.grade-card:hover,.grade-card.active:hover{border-color:var(--primary-color);background:linear-gradient(135deg,#c2f9330d,#22d3ee0d);transform:translateY(-8px) scale(1.02);box-shadow:0 15px 40px #22d3ee4d}.grade-card.active{border-color:var(--primary-color);background:linear-gradient(135deg,#c2f93314,#22d3ee14)}.grade-card.coming-soon{opacity:.7;cursor:default}.grade-card.coming-soon:hover{transform:none}.grade-card.locked{border-color:var(--neutral-800);background:var(--neutral-900);position:relative;opacity:.8}.grade-card.locked:after{content:"🔒";position:absolute;top:1rem;right:1rem;font-size:1.5rem;opacity:.5}.grade-card.locked:hover{transform:translateY(-4px);box-shadow:0 10px 30px -10px #22d3ee1a;border-color:var(--text-tertiary);opacity:.9}.grade-badge{background:linear-gradient(135deg,#c2f933,#22d3ee);color:#0d0d0d;border-radius:12px;padding:14px 18px;width:fit-content;font-size:1.75rem;font-weight:800;display:flex;align-items:center;justify-content:center;margin-bottom:1rem;min-width:65px;box-shadow:0 4px 12px #c2f9334d;transition:all .3s ease}.grade-card:hover .grade-badge{transform:scale(1.1) rotate(-3deg);box-shadow:0 6px 16px #c2f93380}.grade-card h3{font-size:1.25rem;color:var(--text-primary);font-weight:600;margin-bottom:.5rem}.grade-card p{color:var(--text-secondary);font-size:.9rem;line-height:1.5;margin-bottom:1rem}.badge{display:inline-block;padding:.4rem .875rem;border-radius:20px;font-size:.8125rem;font-weight:600;background:var(--bg-tertiary);color:var(--text-secondary);margin-top:auto}.badge.active{background:var(--primary-color);color:#fff}.hero-buttons{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}.how-it-works{background-color:var(--bg-secondary);margin:0 -2rem;padding:4rem 2rem;transition:background-color .3s ease}.how-it-works h2{text-align:center;font-size:2.25rem;font-weight:800;color:var(--text-primary);margin-bottom:1rem}.how-subtitle{text-align:center;font-size:1.125rem;color:var(--text-secondary);max-width:700px;margin:0 auto 3rem;line-height:1.6}.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem;max-width:900px;margin:0 auto}.step{text-align:center;padding:2rem}.step-icon{font-size:3.5rem;margin:0 auto 1.5rem;display:block;text-align:center;filter:drop-shadow(0 4px 12px rgba(0,0,0,.15));transition:all .3s ease;animation:float 3s ease-in-out infinite}.step:nth-child(1) .step-icon{animation-delay:0s}.step:nth-child(2) .step-icon{animation-delay:.5s}.step:nth-child(3) .step-icon{animation-delay:1s}.step:hover .step-icon{transform:scale(1.15);filter:drop-shadow(0 6px 16px rgba(0,0,0,.25))}.step h3{font-size:1.25rem;color:var(--text-primary);margin-bottom:.75rem}.step p{color:var(--text-secondary);font-size:1rem;line-height:1.6}@media (max-width: 768px){.hero h1{font-size:2rem}.hero h2{font-size:1.25rem}.grades-grid{grid-template-columns:1fr;gap:1rem}.grade-levels{padding:2rem 1rem 3rem}.how-it-works{margin:0 -1rem;padding-left:1rem;padding-right:1rem}.steps{grid-template-columns:1fr}}[data-theme=light] .hero:before{background:#fff9}[data-theme=light] .hero h1{background:linear-gradient(135deg,#84cc16,#0ea5e9,#a855f7);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-shadow:none}[data-theme=light] .hero h2{color:#1e293b;text-shadow:0 2px 4px rgba(255,255,255,.5)}[data-theme=light] .hero-description{color:#334155;text-shadow:0 1px 2px rgba(255,255,255,.3)}[data-theme=light] .grade-card{background:linear-gradient(135deg,#fff,#f8fafc);border-color:var(--border-color);box-shadow:0 4px 12px #00000014}[data-theme=light] .grade-card:hover,[data-theme=light] .grade-card.active:hover{border-color:var(--primary-color);background:linear-gradient(135deg,#0ea5e90d,#a855f70d);box-shadow:0 15px 40px #0ea5e940}[data-theme=light] .grade-badge{background:linear-gradient(135deg,#84cc16,#0ea5e9);color:#fff}.learners-section{padding:5rem 2rem;background:var(--bg-primary)}.learners-content{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}.learners-text{max-width:600px}.learners-label{font-size:.875rem;font-weight:700;letter-spacing:1.5px;color:var(--text-tertiary);text-transform:uppercase;margin-bottom:1rem}.learners-title{font-size:3rem;font-weight:700;color:var(--text-primary);margin-bottom:1.5rem;line-height:1.2}.highlight-text{background:linear-gradient(135deg,#c2f933,#22d3ee);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;position:relative}.highlight-text:after{content:"";position:absolute;bottom:0;left:0;width:100%;height:8px;background:#c2f93333;z-index:-1}.learners-description{font-size:1.25rem;color:var(--text-secondary);line-height:1.7;margin-bottom:2rem}.learners-cta{display:inline-block;padding:1rem 2.5rem;background:linear-gradient(135deg,#0ea5e9,#3b82f6);color:#fff;font-size:1.125rem;font-weight:700;border-radius:8px;text-decoration:none;transition:all .3s ease;box-shadow:0 4px 15px #0ea5e966}.learners-cta:hover{transform:translateY(-2px);box-shadow:0 6px 25px #0ea5e999;background:linear-gradient(135deg,#0284c7,#2563eb)}.learners-visual{display:flex;align-items:center;justify-content:center;position:relative}.visual-icon{font-size:15rem;filter:drop-shadow(0 10px 30px rgba(34,211,238,.3));animation:float 3s ease-in-out infinite}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-20px)}}@media (max-width: 968px){.learners-content{grid-template-columns:1fr;gap:3rem;text-align:center}.learners-text{max-width:100%}.learners-title{font-size:2.5rem}.visual-icon{font-size:10rem}}@media (max-width: 768px){.learners-section{padding:3rem 1rem}.learners-title{font-size:2rem}.learners-description{font-size:1.125rem}.visual-icon{font-size:8rem}}.built-by-parents{padding:5rem 2rem;background:var(--bg-secondary);border-top:1px solid var(--border-color)}.built-by-parents-content{max-width:800px;margin:0 auto;text-align:center}.built-by-parents h2{font-size:2.5rem;font-weight:700;margin-bottom:1.5rem;color:var(--text-primary)}.built-by-parents-text{font-size:1.25rem;line-height:1.8;color:var(--text-secondary);margin-bottom:2rem;max-width:700px;margin-left:auto;margin-right:auto}.btn-about{display:inline-block;padding:1rem 2.5rem;background:linear-gradient(135deg,#a855f7,#ec4899);color:#fff;text-decoration:none;border-radius:12px;font-size:1.1rem;font-weight:700;transition:all .3s ease;box-shadow:0 4px 15px #a855f74d}.btn-about:hover{transform:translateY(-2px);box-shadow:0 6px 25px #a855f780}@media (max-width: 768px){.built-by-parents{padding:3rem 1rem}.built-by-parents h2{font-size:2rem}.built-by-parents-text{font-size:1.1rem}}.content-links-section{padding:4rem 2rem;background:var(--bg-primary);border-top:1px solid var(--border-color)}.content-links-container{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:3rem}.content-column h3{font-size:1.125rem;font-weight:700;color:var(--text-primary);margin-bottom:1.25rem;letter-spacing:.5px}.content-column ul{list-style:none;padding:0;margin:0}.content-column li{margin-bottom:.875rem}.content-column a{color:var(--text-secondary);text-decoration:none;font-size:.9375rem;transition:all .2s ease;display:inline-block}.content-column a:hover{color:var(--primary-color);transform:translate(4px)}@media (max-width: 968px){.content-links-container{grid-template-columns:repeat(2,1fr);gap:2.5rem}}@media (max-width: 640px){.content-links-section{padding:3rem 1rem}.content-links-container{grid-template-columns:1fr;gap:2rem}.content-column h3{font-size:1rem}.content-column a{font-size:.875rem}}.auth-container{min-height:calc(100vh - 120px);display:flex;align-items:center;justify-content:center;padding:2rem 1rem;background:linear-gradient(135deg,#667eea,#764ba2)}.auth-card{background:#fff;border-radius:16px;box-shadow:0 20px 60px #0000004d;padding:3rem 2.5rem;max-width:450px;width:100%}.auth-header{text-align:center;margin-bottom:2rem}.auth-header h1{font-size:2rem;color:#1f2937;margin-bottom:.5rem}.auth-header p{color:#6b7280;font-size:1rem}.auth-form{display:flex;flex-direction:column;gap:1.5rem}.form-group label{font-size:.95rem;font-weight:600;color:#374151}.form-group input{padding:.875rem 1rem;border:2px solid #e5e7eb;border-radius:8px;font-size:1rem;transition:all .2s ease}.form-group input:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.form-group input:disabled{background:#f3f4f6;cursor:not-allowed}.form-helper-text{font-size:.85rem;color:#6b7280;margin-top:.25rem;line-height:1.4}.auth-error{padding:.875rem 1rem;background:#fee2e2;border:1px solid #fecaca;border-radius:8px;color:#991b1b;font-size:.9rem;text-align:center}.btn-full{width:100%;padding:1rem;font-size:1.05rem;font-weight:600;margin-top:.5rem}.auth-footer{margin-top:2rem;text-align:center;padding-top:1.5rem;border-top:1px solid #e5e7eb}.auth-footer p{color:#6b7280;font-size:.95rem}.auth-footer a{color:#667eea;font-weight:600;text-decoration:none;transition:color .2s ease}.auth-footer a:hover{color:#764ba2;text-decoration:underline}@media (max-width: 768px){.auth-card{padding:2rem 1.5rem}.auth-header h1{font-size:1.75rem}}.practice-page{max-width:900px;margin:0 auto}.practice-header{text-align:center;margin-bottom:3rem}.practice-header h1{font-size:2.5rem;color:var(--text-primary);margin-bottom:.75rem}.practice-subtitle{font-size:1.125rem;color:var(--text-secondary);margin-bottom:2rem}.grade-filter{display:flex;flex-direction:column;align-items:center;gap:1rem;margin-top:2rem;padding:1.5rem;background:var(--bg-secondary);border-radius:12px;box-shadow:0 2px 8px #0000001a}.grade-filter label{font-weight:600;color:var(--text-primary);font-size:1.1rem}.grade-filter-buttons{display:flex;gap:.75rem;flex-wrap:wrap;justify-content:center}.filter-btn{padding:.75rem 1.5rem;background:var(--bg-primary);border:2px solid var(--border-color);border-radius:8px;color:var(--text-primary);font-weight:600;cursor:pointer;transition:all .3s ease;font-size:1rem}.filter-btn:hover{border-color:var(--primary-color);transform:translateY(-2px);box-shadow:0 4px 12px #22d3ee4d}.filter-btn.active{background:linear-gradient(135deg,#a855f7,#ec4899);color:#fff;border-color:transparent;box-shadow:0 4px 15px #a855f766}.filter-btn.active:hover{transform:translateY(-2px) scale(1.02);box-shadow:0 6px 20px #a855f799}.grade-cards{display:flex;flex-direction:column;gap:3rem;max-width:1000px;margin:0 auto}.grade-card{background:var(--bg-secondary);border-radius:16px;border:2px solid var(--border-color);padding:0;box-shadow:var(--shadow-md)}.grade-card-header{background:linear-gradient(135deg,#c2f933,#22d3ee);color:#0d0d0d;padding:1.5rem 2rem;border-radius:14px 14px 0 0}.grade-card-header h2{margin:0;font-size:1.75rem;font-weight:800}.grade-card-content{padding:2rem}.topic-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1rem}.course-link-wrapper{position:relative;display:flex;align-items:center;gap:.5rem}.course-link-wrapper .topic-link{flex:1}.bookmark-btn{background:var(--bg-secondary);border:2px solid var(--border-color);color:var(--text-secondary);font-size:1.75rem;width:50px;height:50px;border-radius:10px;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center;flex-shrink:0}.bookmark-btn:hover{transform:scale(1.1);border-color:#fbbf24;background:#fbbf241a}.bookmark-btn.saved{background:linear-gradient(135deg,#fbbf24,#f59e0b);border-color:#f59e0b;color:#000;box-shadow:0 4px 12px #fbbf2466}.bookmark-btn.saved:hover{background:linear-gradient(135deg,#fcd34d,#fbbf24);box-shadow:0 6px 20px #fbbf2480}.bookmark-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.topic-link{display:block;padding:1.5rem;background:linear-gradient(135deg,#a855f726,#ec489926);border-radius:12px;border:2px solid rgba(168,85,247,.4);text-decoration:none;color:var(--text-primary);transition:all .25s ease;cursor:pointer;position:relative}.topic-link:hover:not(.topic-link-disabled){background:linear-gradient(135deg,#a855f74d,#ec48994d);border-color:#a855f7b3;transform:translateY(-2px);box-shadow:0 6px 20px #a855f766}.topic-link:active{transform:translateY(0)}.topic-link-featured{background:linear-gradient(135deg,#fb923c,#f59e0b);border:3px solid rgba(251,146,60,.4);box-shadow:0 4px 15px #fb923c80}.topic-link-featured:hover{background:linear-gradient(135deg,#fbbf24,#f59e0b);border-color:#fb923c99;transform:translateY(-2px);box-shadow:0 8px 25px #fb923cb3}.topic-link-featured .topic-subject,.topic-link-featured .topic-name,.topic-link-featured .topic-arrow{color:#0d0d0d;font-weight:700}.topic-link-disabled{opacity:.6;cursor:not-allowed}.topic-subject{display:block;font-weight:700;color:#a855f7;font-size:.875rem;text-transform:uppercase;letter-spacing:.5px;margin-bottom:.5rem}.topic-link-featured .topic-subject{color:#78350f;font-weight:800}.topic-name{display:block;color:var(--text-primary);font-weight:600;font-size:1.125rem;margin-bottom:.5rem}.topic-arrow{position:absolute;right:1.5rem;top:50%;transform:translateY(-50%);font-size:1.5rem;color:#ec4899;transition:all .25s ease}.topic-link:hover .topic-arrow{color:#a855f7;transform:translateY(-50%) translate(5px)}.topic-badge{padding:.25rem .75rem;background-color:#fef3c7;color:#92400e;border-radius:12px;font-size:.875rem;font-weight:500}@media (max-width: 768px){.practice-header h1{font-size:2rem}.grade-cards{grid-template-columns:1fr}.grade-filter-buttons{flex-direction:column;width:100%}.filter-btn{width:100%}}.prek-home-page{max-width:1200px;margin:0 auto;padding:2rem}.prek-header{text-align:center;margin-bottom:3rem}.prek-header h1{font-size:2.5rem;color:var(--text-primary);margin-bottom:.5rem}.prek-header p{font-size:1.25rem;color:var(--text-secondary)}.prek-activities{display:grid;grid-template-columns:repeat(auto-fit,minmax(350px,1fr));gap:2rem;margin-top:2rem}.prek-activity-card{background:var(--bg-secondary);border:3px solid var(--border-color);border-radius:20px;padding:2.5rem;text-align:center;text-decoration:none;transition:all .3s ease;display:flex;flex-direction:column;align-items:center}.prek-activity-card:hover{transform:translateY(-8px);box-shadow:0 15px 40px #0003;border-color:var(--primary-color)}.prek-activity-card.featured{border-color:#fbbf24;background:linear-gradient(135deg,var(--bg-secondary) 0%,rgba(251,191,36,.1) 100%)}.prek-activity-card.featured:hover{border-color:#f59e0b}.activity-icon{font-size:5rem;margin-bottom:1.5rem}.prek-activity-card h3{color:var(--text-primary);font-size:1.75rem;margin-bottom:1rem}.prek-activity-card p{color:var(--text-secondary);font-size:1.1rem;margin-bottom:1.5rem;line-height:1.6}.activity-tag{display:inline-block;padding:.5rem 1.5rem;background:var(--primary-color);color:#fff;border-radius:20px;font-size:.9rem;font-weight:600}.prek-activity-card.featured .activity-tag{background:#f59e0b}@media (max-width: 768px){.prek-activities{grid-template-columns:1fr}.prek-activity-card{padding:2rem}}.letter-learning-page{min-height:calc(100vh - 120px);display:flex;align-items:center;justify-content:center;padding:1rem}.game-container{background:#ffffff26;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:20px;padding:10px;box-shadow:0 8px 32px #1f26875e;border:3px solid rgba(255,255,255,.3);max-width:100vw;width:100%;height:100vh;max-height:90vh;display:flex;flex-direction:column}@media (min-width: 768px){.game-container{padding:20px;max-width:900px;height:auto}}.header{text-align:center;margin-bottom:5px;flex-shrink:0}.title-score{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px}.header h1{font-size:1.5em;margin:0;text-shadow:2px 2px 4px rgba(0,0,0,.3);color:#ffe66d;flex:1;text-align:left}@media (min-width: 768px){.header h1{font-size:2em}}.score-board{display:flex;gap:10px;font-size:1em;font-weight:700;align-items:center}@media (min-width: 768px){.score-board{gap:15px;font-size:1.2em}}.score-item{background:#ffffff4d;padding:5px 10px;border-radius:10px;border:2px solid rgba(255,255,255,.5);white-space:nowrap}canvas{display:block;background:linear-gradient(180deg,#87ceeb,#e0f6ff);border-radius:15px;box-shadow:0 4px 20px #00000080;border:5px solid rgba(255,255,255,.5);cursor:pointer;touch-action:none;flex:1;max-height:calc(100vh - 200px)}@media (min-width: 768px){canvas{max-height:600px}}.modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:#fffffffa;padding:40px;border-radius:25px;text-align:center;border:5px solid #6c5ce7;z-index:1000;box-shadow:0 10px 50px #00000080;max-width:90vw}.modal h2{font-size:2.5em;margin-bottom:20px;color:#6c5ce7}.modal p{font-size:1.3em;margin:15px 0;color:#333}.modal .info{font-size:1.1em;color:#666}.modal button{font-size:1.5em;padding:20px 50px;background:linear-gradient(135deg,#ffe66d,#ff6b9d);color:#6c5ce7;border:none;border-radius:15px;cursor:pointer;font-weight:700;transition:transform .2s,box-shadow .2s;margin-top:20px;font-family:inherit}.modal button:hover{transform:scale(1.1);box-shadow:0 8px 30px #ffe66d99}.modal button:active{transform:scale(.95)}.game-over-stats{margin:20px 0;font-size:1.3em}.game-over-stats p{margin:10px 0}.feedback{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%) scale(0);background:#fffffff2;padding:40px 60px;border-radius:25px;text-align:center;border:5px solid #ffe66d;z-index:2000;transition:transform .3s ease}.feedback.show{transform:translate(-50%,-50%) scale(1)}.feedback-content h2{font-size:3em;margin-bottom:20px}.feedback-emoji{font-size:5em}[data-theme=dark] .modal{background:#1e293bfa;border-color:#ffe66d}[data-theme=dark] .modal h2{color:#ffe66d}[data-theme=dark] .modal p{color:#e2e8f0}[data-theme=dark] .modal .info{color:#94a3b8}@media (max-width: 768px){.modal{padding:30px 20px}.modal h2{font-size:2em}.modal p{font-size:1.1em}.modal button{font-size:1.2em;padding:15px 30px}.feedback{padding:30px 40px}.feedback-content h2{font-size:2em}.feedback-emoji{font-size:3.5em}}.prek-writing-page{display:flex;flex-direction:column;min-height:calc(100vh - 200px);padding:1rem;gap:1rem}.game-header{text-align:center}.title-score{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}.title-score h1{font-size:1.5rem;margin:0;background:linear-gradient(135deg,#c2f933,#22d3ee);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.score-board{display:flex;gap:.75rem;font-size:.9rem;font-weight:700;align-items:center;flex-wrap:wrap}.score-item{background:#c2f9331a;padding:.5rem .75rem;border-radius:10px;border:2px solid rgba(194,249,51,.3);white-space:nowrap}.instruction{background:linear-gradient(135deg,#c2f93326,#22d3ee26);padding:1rem;border-radius:15px;text-align:center;border:2px solid rgba(194,249,51,.3)}.instruction h2{font-size:1.5rem;margin:0;color:#0ea5e9}.drawing-canvas{display:block;background:#fff;border-radius:15px;box-shadow:0 4px 20px #0000001a;border:3px solid rgba(194,249,51,.3);cursor:crosshair;touch-action:none;margin:0 auto;flex:1;min-height:300px;max-height:500px;width:100%;max-width:600px}.controls{display:flex;gap:1rem;justify-content:center;margin-top:1rem}.btn{font-size:1rem;padding:.75rem 2rem;border:none;border-radius:12px;cursor:pointer;font-weight:700;transition:all .2s;font-family:inherit}.btn:hover{transform:scale(1.05)}.btn:active{transform:scale(.95)}.btn-primary{background:linear-gradient(135deg,#c2f933,#22d3ee);color:#1e293b}.btn-secondary{background:linear-gradient(135deg,#ec4899,#fb923c);color:#fff}.modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:#fffffffa;padding:2.5rem;border-radius:25px;text-align:center;border:5px solid #c2f933;z-index:1000;box-shadow:0 10px 50px #0000004d;max-width:90vw}.modal h2{font-size:2rem;margin-bottom:1rem;color:#6c5ce7}.modal p{font-size:1.2rem;margin:1rem 0;color:#333}.modal .info{font-size:1rem;color:#666}.game-over-stats{margin:1.5rem 0;font-size:1.2rem}.game-over-stats p{margin:.75rem 0;color:#333;font-weight:700}.feedback{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%) scale(0);background:#fffffffa;padding:2rem 3rem;border-radius:25px;text-align:center;border:5px solid #c2f933;z-index:2000;transition:transform .3s ease;animation:feedbackShow .3s forwards}@keyframes feedbackShow{to{transform:translate(-50%,-50%) scale(1)}}.feedback.correct{border-color:#3ae374}.feedback.wrong{border-color:#ff6b9d}.feedback-content h2{font-size:2.5rem;margin-bottom:1rem;color:#6c5ce7}.feedback-emoji{font-size:4rem}[data-theme=dark] .drawing-canvas{background:#f8fafc}[data-theme=dark] .modal{background:#1e293bfa;border-color:#c2f933}[data-theme=dark] .modal h2{color:#c2f933}[data-theme=dark] .modal p,[data-theme=dark] .game-over-stats p{color:#e2e8f0}[data-theme=dark] .modal .info{color:#cbd5e1}[data-theme=dark] .feedback{background:#1e293bfa}[data-theme=dark] .feedback-content h2,[data-theme=dark] .instruction h2{color:#c2f933}[data-theme=dark] .score-item{background:#c2f93326;border-color:#c2f93366}@media (max-width: 768px){.prek-writing-page{padding:.5rem;gap:.5rem}.title-score{flex-direction:column;gap:.5rem}.title-score h1{font-size:1.25rem}.score-board{font-size:.8rem;gap:.5rem}.instruction h2{font-size:1.25rem}.drawing-canvas{min-height:250px;max-height:400px}.btn{font-size:.9rem;padding:.6rem 1.5rem}.btn-large{font-size:1.1rem;padding:.85rem 2rem}.modal{padding:2rem;max-width:95vw}.modal h2{font-size:1.75rem}.modal p{font-size:1rem}.feedback{padding:1.5rem 2rem}.feedback-content h2{font-size:2rem}.feedback-emoji{font-size:3rem}}@media (min-width: 769px){.title-score h1{font-size:2rem}.score-board{font-size:1.1rem;gap:1rem}.instruction h2{font-size:2rem}}.prek-creator-page{max-width:1200px;margin:0 auto;padding:2rem}.creator-header{text-align:center;margin-bottom:3rem}.creator-header h1{font-size:2.5rem;color:var(--text-primary);margin-bottom:.5rem}.creator-header p{font-size:1.25rem;color:var(--text-secondary)}.activity-selector{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;margin-top:2rem}.activity-card{background:var(--bg-secondary);border:2px solid var(--border-color);border-radius:16px;padding:2rem;text-align:center;cursor:pointer;transition:all .3s ease}.activity-card:hover{transform:translateY(-5px);box-shadow:0 10px 30px #00000026;border-color:var(--primary-color)}.activity-icon{font-size:4rem;margin-bottom:1rem}.activity-card h3{color:var(--text-primary);margin-bottom:.75rem;font-size:1.5rem}.activity-card p{color:var(--text-secondary);font-size:1rem}.creator-form{max-width:800px;margin:0 auto;background:var(--bg-secondary);padding:2rem;border-radius:16px;border:2px solid var(--border-color)}.btn-back{background:transparent;border:none;color:var(--primary-color);font-size:1rem;cursor:pointer;padding:.5rem;margin-bottom:1rem;display:inline-flex;align-items:center;gap:.5rem}.btn-back:hover{text-decoration:underline}.creator-form h2{color:var(--text-primary);margin-bottom:1rem}.form-description{color:var(--text-secondary);margin-bottom:1.5rem}.examples{background:var(--bg-primary);padding:1rem;border-radius:8px;margin-bottom:1.5rem;border-left:4px solid var(--primary-color)}.examples strong{color:var(--text-primary);display:block;margin-bottom:.5rem}.examples ul{margin:0;padding-left:1.5rem;color:var(--text-secondary)}.examples li{margin-bottom:.25rem}.prompt-input{width:100%;padding:1rem;border:2px solid var(--border-color);border-radius:8px;font-size:1rem;font-family:inherit;background:var(--bg-primary);color:var(--text-primary);resize:vertical;margin-bottom:1.5rem}.prompt-input:focus{outline:none;border-color:var(--primary-color)}.case-selector{display:flex;gap:1rem;margin-bottom:1.5rem}.case-btn{flex:1;padding:.75rem;border:2px solid var(--border-color);background:var(--bg-primary);color:var(--text-primary);border-radius:8px;cursor:pointer;font-size:1rem;transition:all .2s}.case-btn.active{background:var(--primary-color);color:#fff;border-color:var(--primary-color)}.selection-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(50px,1fr));gap:.5rem;margin-bottom:1.5rem}.selection-grid.numbers{grid-template-columns:repeat(auto-fill,minmax(60px,1fr))}.selection-item{aspect-ratio:1;border:2px solid var(--border-color);background:var(--bg-primary);color:var(--text-primary);border-radius:8px;cursor:pointer;font-size:1.5rem;font-weight:700;transition:all .2s;display:flex;align-items:center;justify-content:center}.selection-item:hover{background:var(--primary-color);color:#fff;border-color:var(--primary-color)}.selection-item.selected{background:var(--primary-color);color:#fff;border-color:var(--primary-color);transform:scale(.95)}.selection-actions{display:flex;gap:1rem;margin-bottom:1.5rem}.generated-content{max-width:900px;margin:0 auto}.no-print{display:flex;gap:1rem;margin-bottom:2rem;justify-content:space-between;align-items:center}.worksheet-preview{background:#fff;padding:3rem;border-radius:8px;box-shadow:0 4px 20px #0000001a}.worksheet-title{text-align:center;color:#1e293b;margin-bottom:2rem;font-size:2rem;font-weight:700}.coloring-page img{width:100%;max-width:600px;margin:0 auto;display:block;border:2px solid #e2e8f0;border-radius:8px}.tracing-grid{display:flex;flex-direction:column;gap:2rem}.tracing-item{display:grid;grid-template-columns:120px 1fr;gap:2rem;align-items:center;padding:1.5rem;border:2px dashed #cbd5e1;border-radius:8px}.tracing-letter,.tracing-number{font-size:5rem;font-weight:700;color:#3b82f6;text-align:center}.tracing-lines{display:flex;flex-direction:column;gap:1rem}.dotted-letter,.dotted-number{font-size:3rem;font-weight:700;color:#cbd5e1;text-align:center;border-bottom:3px dashed #cbd5e1;padding-bottom:.5rem}.practice-line{height:60px;border-bottom:2px solid #cbd5e1;position:relative}.practice-line:before{content:"";position:absolute;left:0;right:0;top:50%;border-bottom:1px dashed #e2e8f0}.worksheet-footer{text-align:center;color:#64748b;margin-top:3rem;font-style:italic}@media print{.no-print{display:none!important}.worksheet-preview{box-shadow:none;padding:1rem}.creator-header,.prek-creator-page>*:not(.generated-content){display:none}}@media (max-width: 768px){.activity-selector{grid-template-columns:1fr}.selection-grid{grid-template-columns:repeat(auto-fill,minmax(45px,1fr))}.tracing-item{grid-template-columns:80px 1fr;gap:1rem;padding:1rem}.tracing-letter,.tracing-number{font-size:3rem}.dotted-letter,.dotted-number{font-size:2rem}.practice-line{height:50px}}.kindergarten-home-page{max-width:1400px;margin:0 auto;padding:2rem}.k-header{text-align:center;margin-bottom:3rem}.k-header h1{font-size:2.5rem;color:var(--text-primary);margin-bottom:.75rem}.k-header p{font-size:1.25rem;color:var(--text-secondary)}.k-sections{display:flex;flex-direction:column;gap:3rem}.k-section{background:var(--bg-secondary);padding:2rem;border-radius:20px;border:2px solid var(--border-color)}.section-title{font-size:1.75rem;color:var(--text-primary);margin-bottom:.5rem}.section-description{color:var(--text-secondary);margin-bottom:1.5rem;font-size:1.1rem}.k-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.5rem}.k-card{background:var(--bg-primary);border:2px solid var(--border-color);border-radius:16px;padding:1.5rem;text-decoration:none;transition:all .3s ease;display:flex;flex-direction:column;position:relative}.k-card:hover{transform:translateY(-5px);box-shadow:0 10px 30px #00000026;border-color:var(--primary-color)}.k-card.highlighted{border-color:#10b981;background:linear-gradient(135deg,var(--bg-primary) 0%,rgba(16,185,129,.05) 100%)}.k-card.featured{border-color:#fbbf24;background:linear-gradient(135deg,var(--bg-primary) 0%,rgba(251,191,36,.05) 100%)}.k-card-icon{font-size:3rem;margin-bottom:1rem}.k-card h3{color:var(--text-primary);font-size:1.25rem;margin-bottom:.5rem}.k-card p{color:var(--text-secondary);font-size:.95rem;margin-bottom:1rem;flex-grow:1}.feature-list{list-style:none;padding:0;margin:1rem 0;color:var(--text-secondary);font-size:.9rem}.feature-list li{padding:.25rem 0 .25rem 1.5rem;position:relative}.feature-list li:before{content:"✓";position:absolute;left:0;color:var(--primary-color);font-weight:700}.k-badge{display:inline-block;padding:.4rem .8rem;background:var(--primary-color);color:#fff;border-radius:12px;font-size:.8rem;font-weight:600;align-self:flex-start}.k-badge.special{background:#10b981}.k-card.featured .k-badge{background:#f59e0b}.learning-path{margin-top:3rem;background:linear-gradient(135deg,var(--bg-secondary) 0%,var(--bg-primary) 100%);padding:2rem;border-radius:20px;border:2px solid var(--border-color)}.learning-path h3{color:var(--text-primary);font-size:1.5rem;margin-bottom:1.5rem;text-align:center}.path-steps{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}.path-step{display:flex;align-items:center;gap:.75rem;color:var(--text-primary);font-weight:500;flex:1;min-width:200px}.step-number{display:flex;align-items:center;justify-content:center;width:36px;height:36px;background:var(--primary-color);color:#fff;border-radius:50%;font-weight:700;flex-shrink:0}@media (max-width: 1024px){.k-cards{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}.path-steps{flex-direction:column;align-items:flex-start}.path-step{width:100%}}@media (max-width: 768px){.k-cards{grid-template-columns:1fr}.k-header h1{font-size:2rem}.section-title{font-size:1.5rem}}.sight-words-page{max-width:1200px;margin:0 auto;padding:2rem}.sw-header{text-align:center;margin-bottom:3rem}.sw-header h1{font-size:2.5rem;color:var(--text-primary);margin-bottom:.5rem}.sw-header p{font-size:1.25rem;color:var(--text-secondary)}.sw-menu{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;max-width:800px;margin:0 auto}.mode-card{background:var(--bg-secondary);border:3px solid var(--border-color);border-radius:20px;padding:2.5rem;text-align:center;cursor:pointer;transition:all .3s ease}.mode-card:hover{transform:translateY(-8px);box-shadow:0 15px 40px #0003;border-color:var(--primary-color)}.mode-card h3{color:var(--text-primary);font-size:1.75rem;margin-bottom:1rem}.mode-card p{color:var(--text-secondary);font-size:1.1rem;margin-bottom:1.5rem}.mode-badge{display:inline-block;padding:.5rem 1.5rem;background:var(--primary-color);color:#fff;border-radius:20px;font-size:.9rem;font-weight:600}.audio-toggle{grid-column:1 / -1;padding:1rem 2rem;border:2px solid var(--border-color);background:var(--bg-primary);color:var(--text-primary);border-radius:12px;cursor:pointer;font-size:1.1rem;font-weight:600;transition:all .2s}.audio-toggle:hover{background:var(--primary-color);color:#fff;border-color:var(--primary-color)}.learn-mode{max-width:700px;margin:0 auto}.back-btn{padding:.75rem 1.5rem;background:transparent;border:2px solid var(--border-color);color:var(--text-primary);border-radius:10px;cursor:pointer;font-size:1rem;margin-bottom:2rem;transition:all .2s}.back-btn:hover{background:var(--bg-secondary);border-color:var(--primary-color)}.learn-card{background:var(--bg-secondary);border:3px solid var(--border-color);border-radius:24px;padding:4rem 2rem;text-align:center;margin-bottom:2rem}.word-display{font-size:6rem;font-weight:700;color:var(--primary-color);margin-bottom:2rem;text-transform:lowercase}.speak-btn{padding:1rem 2rem;background:var(--primary-color);color:#fff;border:none;border-radius:12px;font-size:1.25rem;cursor:pointer;transition:all .2s}.speak-btn:hover{transform:scale(1.05);box-shadow:0 5px 15px #4f46e54d}.learn-progress{text-align:center;font-size:1.1rem;color:var(--text-secondary);margin-bottom:1.5rem}.learn-controls{display:flex;gap:1rem;justify-content:center}.nav-btn{padding:1rem 2rem;background:var(--bg-secondary);border:2px solid var(--border-color);color:var(--text-primary);border-radius:12px;font-size:1.1rem;cursor:pointer;transition:all .2s}.nav-btn:hover{background:var(--primary-color);color:#fff;border-color:var(--primary-color)}.quiz-mode{max-width:1000px;margin:0 auto}.back-btn-small{padding:.5rem 1rem;background:transparent;border:2px solid var(--border-color);color:var(--text-primary);border-radius:8px;cursor:pointer;font-size:.9rem}.quiz-stats{display:flex;gap:1.5rem}.stat{padding:.5rem 1rem;border-radius:8px;font-weight:600;font-size:1rem}.stat.correct{background:#d1fae5;color:#065f46}.stat.wrong{background:#fee2e2;color:#991b1b}.stat.score{background:var(--primary-color);color:#fff}.quiz-instruction{text-align:center;font-size:1.5rem;color:var(--text-primary);margin-bottom:2rem;padding:1rem;background:var(--bg-secondary);border-radius:12px}.quiz-feedback{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:#fff;padding:2rem 3rem;border-radius:20px;box-shadow:0 10px 40px #0000004d;z-index:1000;text-align:center;animation:popIn .3s ease-out}.quiz-feedback.correct{border:4px solid #10b981}.quiz-feedback.wrong{border:4px solid #ef4444}.feedback-emoji{font-size:4rem;margin-bottom:1rem}.feedback-text{font-size:1.5rem;font-weight:700;color:var(--text-primary)}.quiz-game-area{position:relative;width:100%;height:600px;background:linear-gradient(180deg,#dbeafe,#bfdbfe);border-radius:16px;overflow:hidden;box-shadow:inset 0 2px 10px #0000001a}[data-theme=dark] .quiz-game-area{background:linear-gradient(180deg,#1e3a8a,#1e40af)}.word-card{position:absolute;padding:1.5rem 2rem;border-radius:16px;font-size:2.5rem;font-weight:700;cursor:pointer;transition:transform .2s;-webkit-user-select:none;user-select:none;box-shadow:0 4px 12px #00000026;text-transform:lowercase;min-width:150px;text-align:center}.word-card.target{background:linear-gradient(135deg,#f9a8d4,#fbcfe8);color:#831843;border:3px solid #ec4899}.word-card.decoy{background:linear-gradient(135deg,#fef08a,#fde047);color:#713f12;border:3px solid #eab308}.word-card:hover{transform:scale(1.1)}.word-card:active{transform:scale(.95)}@keyframes popIn{0%{transform:translate(-50%,-50%) scale(.5);opacity:0}to{transform:translate(-50%,-50%) scale(1);opacity:1}}@media (max-width: 768px){.sw-header h1{font-size:2rem}.word-display{font-size:4rem}.word-card{font-size:2rem;padding:1rem 1.5rem;min-width:120px}.quiz-game-area{height:500px}.quiz-stats{flex-wrap:wrap;gap:.5rem}.stat{font-size:.9rem;padding:.4rem .8rem}}.simple-math-page{padding:2rem;max-width:900px;margin:0 auto}.math-header{text-align:center;margin-bottom:2rem}.math-header h1{font-size:2.5rem;color:var(--primary-color);margin-bottom:.5rem}.math-header p{font-size:1.2rem;color:var(--text-secondary)}.math-stats{display:flex;justify-content:center;gap:2rem;margin-bottom:2rem;font-size:1.3rem;font-weight:600}.math-problem{background:var(--background-secondary);padding:3rem;border-radius:16px;box-shadow:0 4px 6px #0000001a;margin-bottom:2rem}.operation-badge{text-align:center;font-size:3rem;margin-bottom:2rem}.visual-representation{display:flex;justify-content:center;align-items:center;gap:1.5rem;margin-bottom:2rem;flex-wrap:wrap;min-height:120px}.number-group{display:flex;flex-wrap:wrap;gap:8px;max-width:300px;justify-content:center}.block{width:40px;height:40px;border-radius:8px;box-shadow:0 2px 4px #0000001a}.block.blue{background:linear-gradient(135deg,#3b82f6,#2563eb)}.block.green{background:linear-gradient(135deg,#10b981,#059669)}.block.red-fade{background:linear-gradient(135deg,#ef4444,#dc2626);opacity:.4}.operator-sign{font-size:3rem;font-weight:700;color:var(--primary-color)}.problem-equation{display:flex;justify-content:center;align-items:center;gap:1rem;font-size:3rem;font-weight:700;margin-bottom:2rem}.number{color:var(--text-primary);min-width:60px;text-align:center}.operator{color:var(--primary-color)}.equals{color:var(--text-secondary)}.answer-display{min-width:100px;font-size:3rem;text-align:center;border:3px solid var(--primary-color);border-radius:12px;padding:.5rem;background:var(--background-primary);color:var(--text-primary);font-weight:700;display:inline-block}.number-buttons{display:grid;grid-template-columns:repeat(7,1fr);gap:.75rem;margin-bottom:2rem;max-width:600px;margin-left:auto;margin-right:auto}.number-btn{padding:1rem;font-size:1.5rem;font-weight:700;border:2px solid var(--border-color);border-radius:12px;background:var(--background-primary);color:var(--text-primary);cursor:pointer;transition:all .2s ease}.number-btn:hover:not(:disabled){background:var(--primary-color);color:#fff;transform:scale(1.1);border-color:var(--primary-color)}.number-btn.selected{background:var(--primary-color);color:#fff;border-color:var(--primary-color);transform:scale(1.1)}.number-btn:disabled{opacity:.5;cursor:not-allowed}.feedback-box p{margin:.5rem 0}.new-problem-btn{display:block;margin:0 auto;padding:1rem 2rem;font-size:1.2rem;font-weight:600;background:var(--accent-color);color:#fff;border:none;border-radius:12px;cursor:pointer;transition:all .3s ease}.new-problem-btn:hover{background:var(--accent-hover);transform:scale(1.05)}@media (prefers-color-scheme: dark){.feedback-box.correct{background:#064e3b;border-color:#10b981;color:#d1fae5}.feedback-box.incorrect{background:#7f1d1d;border-color:#ef4444;color:#fee2e2}}@media (max-width: 768px){.simple-math-page{padding:1rem}.math-header h1{font-size:2rem}.math-problem{padding:2rem 1rem}.problem-equation{font-size:2rem}.answer-display{min-width:80px;font-size:2rem}.number-buttons{grid-template-columns:repeat(5,1fr);gap:.5rem}.number-btn{padding:.75rem;font-size:1.25rem}.block{width:30px;height:30px}}.shapes-page{max-width:1000px;margin:0 auto;padding:2rem 1rem}.shapes-header{text-align:center;margin-bottom:3rem}.shapes-header h1{font-size:2.2rem;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:.5rem}.shapes-header p{font-size:1.1rem;color:var(--text-secondary)}.shapes-menu,.phonics-menu{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem}.mode-card{background:var(--card-bg);border:3px solid var(--border-color);border-radius:16px;padding:2.5rem;cursor:pointer;text-align:center;transition:all .3s}.mode-card:hover{border-color:var(--primary-color);transform:translateY(-5px);box-shadow:0 8px 20px #667eea33}.mode-icon{font-size:4rem;margin-bottom:1rem}.mode-card h3{font-size:1.5rem;color:var(--text-primary);margin-bottom:.5rem}.mode-card p{color:var(--text-secondary);margin-bottom:1rem}.mode-badge{display:inline-block;padding:.5rem 1rem;background:var(--primary-color);color:#fff;border-radius:20px;font-size:.9rem;font-weight:600}.learn-mode{max-width:900px;margin:0 auto}.back-btn{background:var(--card-bg);border:2px solid var(--border-color);padding:.75rem 1.5rem;border-radius:8px;cursor:pointer;font-weight:600;margin-bottom:2rem;color:var(--text-primary)}.shapes-grid,.phonics-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1.5rem}.shape-card,.phonics-card{background:var(--card-bg);border:2px solid var(--border-color);border-radius:12px;padding:2rem;text-align:center;transition:all .3s;cursor:pointer}.shape-card:hover,.phonics-card:hover{border-color:var(--primary-color);transform:scale(1.05)}.shape-emoji{font-size:4rem;margin-bottom:1rem}.shape-card h3,.phonics-card .letter-display{font-size:1.5rem;color:var(--text-primary);margin-bottom:.5rem}.shape-card p{color:var(--text-secondary);font-size:.95rem}.quiz-mode{max-width:900px;margin:0 auto}.back-btn-small{padding:.5rem 1rem;background:var(--card-bg);border:2px solid var(--border-color);border-radius:8px;cursor:pointer;font-weight:600;color:var(--text-primary)}.quiz-progress{font-weight:600;color:var(--text-primary)}.quiz-score{background:var(--primary-color);color:#fff;padding:.5rem 1rem;border-radius:20px;font-weight:600}.question-container{background:var(--card-bg);border-radius:16px;padding:2.5rem}.shape-display{font-size:8rem;text-align:center;margin-bottom:2rem}.question-container h2{text-align:center;font-size:1.8rem;color:var(--text-primary);margin-bottom:2rem}.options-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin-bottom:2rem}.shape-option{padding:1.5rem;border:3px solid var(--border-color);background:var(--input-bg);border-radius:12px;font-size:1.2rem;font-weight:600;cursor:pointer;transition:all .2s;color:var(--text-primary)}.shape-option:hover:not(:disabled){border-color:var(--primary-color);transform:scale(1.05)}.shape-option.correct{border-color:#22c55e;background:#22c55e26}.shape-option.incorrect{border-color:#ef4444;background:#ef444426}.shape-option:disabled{cursor:not-allowed}.feedback{text-align:center;padding:1.5rem;border-radius:12px;margin-top:1.5rem}.feedback.correct{background:#22c55e26;border:3px solid #22c55e}.feedback.incorrect{background:#ef444426;border:3px solid #ef4444}.feedback-emoji{font-size:3rem;margin-bottom:.5rem}.feedback p{font-size:1.2rem;color:var(--text-primary);margin-bottom:1rem}.next-btn{padding:.75rem 2rem;background:var(--primary-color);color:#fff;border:none;border-radius:8px;font-weight:600;cursor:pointer;font-size:1rem}.next-btn:hover{opacity:.9}.quiz-summary h2{font-size:2rem;color:var(--text-primary);margin-bottom:1rem}.final-score{font-size:1.5rem;font-weight:600;color:var(--primary-color);margin-bottom:1rem}.encouragement{font-size:1.2rem;color:var(--text-secondary);line-height:1.6}@media (max-width: 768px){.shapes-grid,.phonics-grid{grid-template-columns:repeat(2,1fr)}.options-grid{grid-template-columns:1fr}}.phonics-page{max-width:800px;margin:0 auto;padding:2rem 1rem}.phonics-header{text-align:center;margin-bottom:2rem}.phonics-header h1{font-size:2.2rem;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:.5rem}.flashcard-container{display:flex;flex-direction:column;gap:2rem;align-items:center}.card-progress{font-size:1.2rem;font-weight:600;color:var(--text-secondary);text-align:center}.phonics-flashcard{width:100%;max-width:500px;padding:3rem 2rem;border:4px solid var(--border-color);border-radius:20px;background:var(--card-bg);box-shadow:0 8px 20px #0000001a;text-align:center;display:flex;flex-direction:column;gap:1.5rem;align-items:center}.letter-display{font-size:8rem;font-weight:700;color:var(--primary-color);line-height:1}.sound-display{font-size:1.8rem;color:var(--text-secondary);font-style:italic}.example-word{color:var(--text-primary);font-size:1.5rem;font-weight:600}.speaker-button{padding:1rem 2rem;background:linear-gradient(135deg,#9f7aea,#667eea);color:#fff;border:none;border-radius:12px;font-size:1.2rem;font-weight:600;cursor:pointer;transition:all .3s;box-shadow:0 4px 12px #9f7aea4d}.speaker-button:hover{transform:translateY(-2px);box-shadow:0 6px 16px #9f7aea66}.navigation-buttons{display:flex;gap:1rem;justify-content:center;width:100%;max-width:500px}.nav-btn{flex:1;padding:1rem 1.5rem;border:2px solid var(--primary-color);background:var(--card-bg);color:var(--primary-color);border-radius:12px;font-size:1.1rem;font-weight:600;cursor:pointer;transition:all .2s}.nav-btn:hover{background:var(--primary-color);color:#fff;transform:scale(1.05)}@media (max-width: 768px){.letter-display{font-size:6rem}.sound-display{font-size:1.4rem}.example-word{font-size:1.2rem}.speaker-button{padding:.8rem 1.5rem;font-size:1rem}.nav-btn{padding:.8rem 1rem;font-size:1rem}}.word-option.incorrect{border-color:#ef4444;background:#ef444426}.phonics-game-page{min-height:100vh;background:linear-gradient(135deg,#667eea,#764ba2);padding:2rem 1rem}.game-menu{max-width:600px;margin:0 auto;text-align:center;animation:fadeIn .5s ease-in}.game-header h1{font-size:3rem;color:#fff;text-shadow:3px 3px 6px rgba(0,0,0,.3);margin-bottom:.5rem;animation:bounce 1s infinite}.game-header p{font-size:1.5rem;color:#fffffff2;margin-bottom:2rem}.game-stats-display{display:flex;gap:1rem;justify-content:center;margin-bottom:2rem}.stat-box{background:#fffffff2;padding:1.5rem;border-radius:20px;box-shadow:0 8px 20px #0003;min-width:150px}.stat-emoji{font-size:2.5rem;display:block;margin-bottom:.5rem}.stat-box div{font-size:1.1rem;font-weight:600;color:#333}.start-game-btn{background:linear-gradient(135deg,#f093fb,#f5576c);color:#fff;border:none;padding:1.5rem 3rem;font-size:1.8rem;font-weight:700;border-radius:50px;cursor:pointer;box-shadow:0 10px 30px #f5576c66;transition:all .3s ease;margin-bottom:1rem}.start-game-btn:hover{transform:translateY(-5px) scale(1.05);box-shadow:0 15px 40px #f5576c99}.audio-toggle-menu{background:#fff3;color:#fff;border:2px solid white;padding:.8rem 1.5rem;font-size:1.1rem;font-weight:600;border-radius:25px;cursor:pointer;transition:all .3s}.audio-toggle-menu:hover{background:#ffffff4d}.game-container{max-width:800px;margin:0 auto;background:#fff;border-radius:30px;padding:2rem;box-shadow:0 20px 60px #0000004d;animation:slideUp .5s ease-out}.game-top-bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.exit-btn{background:#e0e0e0;border:none;padding:.5rem 1rem;border-radius:10px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s}.exit-btn:hover{background:#d0d0d0;transform:translate(-3px)}.game-stats{display:flex;gap:1.5rem;font-size:1.3rem;font-weight:700}.score{color:#f5576c}.lives{font-size:1.2rem}.progress-bar{height:12px;background:#e0e0e0;border-radius:10px;overflow:hidden;margin-bottom:2rem}.progress-fill{height:100%;background:linear-gradient(90deg,#667eea,#764ba2);transition:width .5s ease}.question-area{text-align:center;padding:2rem 1rem}.letter-display-big{font-size:8rem;font-weight:900;color:#667eea;margin-bottom:1rem;animation:pulse 1.5s ease-in-out infinite}.emoji-display{font-size:5rem;margin:1rem 0;animation:bounce 1s ease-in-out infinite}.listen-btn{background:linear-gradient(135deg,#9f7aea,#667eea);color:#fff;border:none;padding:1rem 2rem;font-size:1.2rem;font-weight:600;border-radius:15px;cursor:pointer;box-shadow:0 6px 15px #9f7aea4d;transition:all .3s;margin:1rem 0}.listen-btn:hover{transform:translateY(-3px);box-shadow:0 8px 20px #9f7aea80}.instruction{font-size:1.3rem;font-weight:600;color:#333;margin:1.5rem 0}.options-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem;margin-top:2rem}.option-btn{background:#fff;border:4px solid #667eea;padding:1.5rem;font-size:1.3rem;font-weight:700;color:#667eea;border-radius:20px;cursor:pointer;transition:all .3s;box-shadow:0 4px 10px #0000001a}.option-btn:hover:not(:disabled){background:#667eea;color:#fff;transform:scale(1.1);box-shadow:0 8px 20px #667eea66}.option-btn.correct-flash{background:#22c55e;border-color:#22c55e;color:#fff;animation:correctPulse .5s ease}.option-btn.disabled{opacity:.4;cursor:not-allowed}.feedback-overlay{position:fixed;top:0;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease}.feedback-overlay.correct{background:#22c55ee6}.feedback-overlay.wrong{background:#ef4444e6}.feedback-content{text-align:center;color:#fff;animation:scaleIn .5s ease}.celebration-emoji,.feedback-emoji{font-size:6rem;margin-bottom:1rem;animation:bounce .6s ease-in-out infinite}.feedback-content h2{font-size:3rem;margin-bottom:.5rem}.feedback-content p{font-size:2rem;font-weight:700}.confetti{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:999}.confetti-piece{position:absolute;width:10px;height:10px;top:-10px;animation:confettiFall 3s linear}@keyframes slideUp{0%{opacity:0;transform:translateY(50px)}to{opacity:1;transform:translateY(0)}}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes scaleIn{0%{transform:scale(0)}to{transform:scale(1)}}@keyframes correctPulse{0%,to{transform:scale(1)}50%{transform:scale(1.2)}}@keyframes confettiFall{to{transform:translateY(100vh) rotate(360deg);opacity:0}}@media (max-width: 768px){.game-header h1{font-size:2.2rem}.letter-display-big{font-size:5rem}.emoji-display{font-size:3.5rem}.start-game-btn{font-size:1.4rem;padding:1.2rem 2rem}.options-grid{grid-template-columns:1fr}.option-btn{font-size:1.1rem;padding:1.2rem}.feedback-content h2{font-size:2rem}.celebration-emoji,.feedback-emoji{font-size:4rem}}.reading-practice-page{padding:2rem;max-width:900px;margin:0 auto}.reading-header{text-align:center;margin-bottom:2rem}.header-content{display:flex;justify-content:space-between;align-items:center;gap:2rem}.reading-header h1{font-size:2.5rem;color:var(--primary-color);margin-bottom:.5rem}.reading-header p{font-size:1.2rem;color:var(--text-secondary)}.reset-button{padding:.75rem 1.5rem;font-size:1.1rem;font-weight:600;background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;border:none;border-radius:10px;cursor:pointer;transition:all .3s ease;white-space:nowrap;box-shadow:0 4px 12px #ef44444d}.reset-button:hover{background:linear-gradient(135deg,#dc2626,#b91c1c);transform:scale(1.05);box-shadow:0 6px 16px #ef444466}.reset-button:active{transform:scale(.98)}.reading-stats{display:flex;justify-content:center;gap:2rem;margin-bottom:2rem;font-size:1.3rem;font-weight:600}.stat.learned{color:#8b5cf6}.progress-fill{height:100%;background:linear-gradient(90deg,#10b981,#059669);transition:width .5s ease}.reading-card{background:var(--background-secondary);padding:3rem;border-radius:16px;box-shadow:0 4px 6px #0000001a;margin-bottom:2rem}.word-display{text-align:center;margin-bottom:3rem}.emoji-image{font-size:8rem;margin-bottom:1rem;animation:bounce 2s ease-in-out infinite}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-20px)}}.speaker-button:hover:not(:disabled){background:linear-gradient(135deg,#7c3aed,#6d28d9);transform:scale(1.05);box-shadow:0 6px 16px #8b5cf666}.speaker-button:active:not(:disabled){transform:scale(.98)}.speaker-button:disabled{background:var(--background-disabled);color:var(--text-secondary);cursor:not-allowed;opacity:.5;box-shadow:none}.target-word{font-size:5rem;font-weight:700;color:var(--primary-color);margin-bottom:1rem;text-transform:lowercase;animation:fadeInScale .5s ease}@keyframes fadeInScale{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.instruction{font-size:1.5rem;font-weight:600;color:var(--text-primary);margin:1rem 0}.category-hint{font-size:1.1rem;color:var(--text-secondary);font-style:italic}.word-options{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin-bottom:2rem}.word-option{padding:1.5rem;font-size:1.8rem;font-weight:700;border:3px solid var(--border-color);border-radius:12px;background:var(--background-primary);color:var(--text-primary);cursor:pointer;transition:all .3s ease}.word-option:hover:not(:disabled){transform:scale(1.05);border-color:var(--primary-color);box-shadow:0 4px 12px #6366f133}.word-option.selected{border-color:var(--primary-color);background:#6366f11a;transform:scale(1.05)}.word-option.correct-word{border-color:#10b981;background:#d1fae5;color:#065f46}.word-option.incorrect-word{border-color:#ef4444;background:#fee2e2;color:#991b1b}.word-option:disabled{cursor:not-allowed}.new-word-btn{display:block;margin:0 auto;padding:1rem 2rem;font-size:1.2rem;font-weight:600;background:var(--accent-color);color:#fff;border:none;border-radius:12px;cursor:pointer;transition:all .3s ease}.new-word-btn:hover{background:var(--accent-hover);transform:scale(1.05)}.set-complete-screen{text-align:center;padding:2rem}.set-complete-screen h1{font-size:3rem;color:var(--primary-color);margin-bottom:2rem}.results-summary{margin:3rem 0}.result-circle{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;width:200px;height:200px;border-radius:50%;background:linear-gradient(135deg,#10b981,#059669);color:#fff;margin-bottom:1rem;box-shadow:0 8px 20px #10b9814d}.result-number{font-size:4rem;font-weight:700}.result-total{font-size:2rem;opacity:.9}.result-percentage{font-size:2rem;font-weight:700;color:var(--text-primary);margin-top:1rem}.achievement-stats{display:flex;justify-content:center;gap:2rem;margin:3rem 0;flex-wrap:wrap}.achievement-item{display:flex;flex-direction:column;align-items:center;padding:1.5rem;background:var(--background-secondary);border-radius:12px;min-width:150px}.achievement-icon{font-size:3rem;margin-bottom:.5rem}.achievement-label{font-size:.9rem;color:var(--text-secondary);margin-bottom:.5rem}.achievement-value{font-size:2rem;font-weight:700;color:var(--primary-color)}.encouragement{padding:1.5rem;border-radius:12px;margin:2rem 0;font-size:1.3rem}.encouragement.excellent{background:#d1fae5;color:#065f46;border:3px solid #10b981}.encouragement.good{background:#dbeafe;color:#1e40af;border:3px solid #3b82f6}.encouragement.keep-going{background:#fef3c7;color:#92400e;border:3px solid #f59e0b}.set-complete-actions{display:flex;flex-direction:column;gap:1rem;margin-top:2rem;max-width:400px;margin-left:auto;margin-right:auto}.action-btn{padding:1rem 2rem;font-size:1.3rem;font-weight:700;border:none;border-radius:12px;cursor:pointer;transition:all .3s ease}.action-btn.primary{background:var(--primary-color);color:#fff}.action-btn.primary:hover{background:var(--primary-hover);transform:scale(1.05)}.action-btn.secondary{background:var(--background-secondary);color:var(--text-primary);border:2px solid var(--border-color)}.action-btn.secondary:hover{background:var(--background-primary);transform:scale(1.05)}@media (prefers-color-scheme: dark){.word-option.correct-word{background:#064e3b;border-color:#10b981;color:#d1fae5}.word-option.incorrect-word{background:#7f1d1d;border-color:#ef4444;color:#fee2e2}.feedback-box.correct{background:#064e3b;border-color:#10b981;color:#d1fae5}.feedback-box.incorrect{background:#7f1d1d;border-color:#ef4444;color:#fee2e2}}@media (max-width: 768px){.reading-practice-page{padding:1rem}.header-content{flex-direction:column;gap:1rem}.reading-header h1{font-size:2rem}.reset-button{font-size:1rem;padding:.6rem 1.2rem}.reading-card{padding:2rem 1rem}.target-word{font-size:3.5rem}.instruction{font-size:1.2rem}.achievement-stats{flex-direction:column;align-items:center}.result-circle{width:150px;height:150px}.result-number{font-size:3rem}.result-total{font-size:1.5rem}.word-options{grid-template-columns:1fr}.word-option{font-size:1.5rem;padding:1rem}.check-btn,.next-btn{font-size:1.2rem;padding:.8rem 2rem}}.sentence-reading-page{padding:2rem;max-width:900px;margin:0 auto}.sentence-header{text-align:center;margin-bottom:2rem}.sentence-header h1{font-size:2.5rem;color:var(--primary-color);margin-bottom:.5rem}.sentence-header p{font-size:1.2rem;color:var(--text-secondary)}.progress-container{margin-bottom:2rem}.progress-bar{height:20px;background:var(--background-secondary);border-radius:10px;overflow:hidden;margin-bottom:.5rem}.progress-fill{height:100%;background:linear-gradient(90deg,#8b5cf6,#7c3aed);transition:width .5s ease}.progress-text{text-align:center;font-size:1rem;font-weight:600;color:var(--text-secondary)}.sentence-stats{display:flex;justify-content:center;gap:2rem;margin-bottom:2rem;font-size:1.3rem;font-weight:600}.stat{padding:.5rem 1rem;border-radius:8px;background:var(--background-secondary)}.stat.correct{color:#10b981}.stat.wrong{color:#ef4444}.stat.score{color:var(--primary-color)}.sentence-card{background:var(--background-secondary);padding:3rem;border-radius:16px;box-shadow:0 4px 6px #0000001a;margin-bottom:2rem}.sentence-display{text-align:center;margin-bottom:3rem}.sentence-text{font-size:2.5rem;font-weight:600;line-height:1.6;color:var(--text-primary);margin-bottom:1.5rem;padding:2rem;background:var(--background-primary);border-radius:12px;border:3px solid var(--primary-color)}.speaker-button{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;font-size:1.3rem;font-weight:600;background:linear-gradient(135deg,#8b5cf6,#7c3aed);color:#fff;border:none;border-radius:12px;cursor:pointer;margin:1rem 0;transition:all .3s ease;box-shadow:0 4px 12px #8b5cf64d}.speaker-button:hover{background:linear-gradient(135deg,#7c3aed,#6d28d9);transform:scale(1.05);box-shadow:0 6px 16px #8b5cf666}.speaker-button:active{transform:scale(.98)}.question-section{margin-bottom:2rem}.question{font-size:1.8rem;font-weight:600;color:var(--text-primary);text-align:center;margin-bottom:2rem}.answer-options{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin-bottom:2rem}.option-btn{padding:1.5rem;font-size:1.5rem;font-weight:600;border:3px solid var(--border-color);border-radius:12px;background:var(--background-primary);color:var(--text-primary);cursor:pointer;transition:all .3s ease}.option-btn:hover:not(:disabled){transform:scale(1.05);border-color:var(--primary-color);box-shadow:0 4px 12px #6366f133}.option-btn.selected{border-color:var(--primary-color);background:#6366f11a;transform:scale(1.05)}.option-btn.correct-option{border-color:#10b981;background:#d1fae5;color:#065f46}.option-btn.incorrect-option{border-color:#ef4444;background:#fee2e2;color:#991b1b}.feedback-box{padding:1.5rem;border-radius:12px;text-align:center;margin-bottom:2rem;font-size:1.2rem;animation:fadeIn .3s ease-in}.feedback-box.correct{background:#d1fae5;border:3px solid #10b981;color:#065f46}.feedback-box.incorrect{background:#fee2e2;border:3px solid #ef4444;color:#991b1b}.feedback-box strong{display:block;font-size:1.5rem;margin-bottom:.5rem}.feedback-box p{margin:.5rem 0;font-size:1.2rem}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.button-controls{display:flex;justify-content:center}.check-btn,.next-btn{padding:1rem 3rem;font-size:1.5rem;font-weight:700;border:none;border-radius:12px;cursor:pointer;transition:all .3s ease}.check-btn{background:var(--primary-color);color:#fff}.check-btn:hover:not(:disabled){background:var(--primary-hover);transform:scale(1.05)}.check-btn:disabled{background:var(--background-disabled);cursor:not-allowed;opacity:.5}.next-btn{background:#10b981;color:#fff}.next-btn:hover{background:#059669;transform:scale(1.05)}@media (prefers-color-scheme: dark){.option-btn.correct-option{background:#064e3b;border-color:#10b981;color:#d1fae5}.option-btn.incorrect-option{background:#7f1d1d;border-color:#ef4444;color:#fee2e2}.feedback-box.correct{background:#064e3b;border-color:#10b981;color:#d1fae5}.feedback-box.incorrect{background:#7f1d1d;border-color:#ef4444;color:#fee2e2}}@media (max-width: 768px){.sentence-reading-page{padding:1rem}.sentence-header h1{font-size:2rem}.sentence-card{padding:2rem 1rem}.sentence-text{font-size:1.8rem;padding:1.5rem}.question{font-size:1.4rem}.answer-options{grid-template-columns:1fr}.option-btn{font-size:1.3rem;padding:1.2rem}.check-btn,.next-btn{font-size:1.2rem;padding:.8rem 2rem}}.early-reader-books-page{padding:2rem;max-width:1400px;margin:0 auto}.page-header h1{font-size:3rem;color:#6366f1;margin-bottom:.5rem}.page-header .subtitle{font-size:1.3rem;color:#64748b;margin-bottom:1rem}.book-count{display:inline-block;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:.5rem 1.5rem;border-radius:25px;font-size:1.1rem;font-weight:600;box-shadow:0 4px 12px #667eea4d}.bookshelf{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:2rem;margin-top:2rem}.book-card{display:flex;flex-direction:column;background:#fff;border-radius:20px;overflow:hidden;box-shadow:0 4px 15px #0000001a;transition:transform .3s ease,box-shadow .3s ease;cursor:pointer;text-decoration:none;color:inherit;border:3px solid transparent}.book-card:hover{transform:translateY(-8px) scale(1.02);box-shadow:0 8px 25px #6366f140;border-color:#6366f1}.book-cover{position:relative;background:linear-gradient(135deg,#fef3c7,#fde68a,#fcd34d);padding:2rem;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:200px;border-bottom:4px solid #f59e0b}.book-emoji{font-size:5rem;margin-bottom:1rem;animation:float 3s ease-in-out infinite}.book-theme-badge{position:absolute;top:10px;right:10px;background:#fffffff2;color:#6366f1;padding:.4rem .8rem;border-radius:15px;font-size:.75rem;font-weight:600;text-transform:capitalize;box-shadow:0 2px 8px #00000026}.book-theme-badge.animals{background:#dbeafe;color:#1e40af}.book-theme-badge.family{background:#fce7f3;color:#be185d}.book-theme-badge.nature{background:#dcfce7;color:#15803d}.book-theme-badge.food{background:#ffedd5;color:#c2410c}.book-theme-badge.toys{background:#e0e7ff;color:#4338ca}.book-info{padding:1.5rem;display:flex;flex-direction:column;gap:.5rem}.book-title{font-size:1.4rem;font-weight:700;color:#1e293b;margin:0;text-align:center}.book-level{text-align:center;font-size:.9rem;color:#64748b;margin:0;padding:.3rem .8rem;background:#f1f5f9;border-radius:10px;align-self:center}@media (max-width: 768px){.early-reader-books-page{padding:1rem}.page-header h1{font-size:2.2rem}.page-header .subtitle{font-size:1.1rem}.bookshelf{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:1.5rem}.book-emoji{font-size:4rem}.book-title{font-size:1.2rem}.book-cover{min-height:160px;padding:1.5rem}}@media (max-width: 480px){.bookshelf{grid-template-columns:repeat(2,1fr);gap:1rem}.book-emoji{font-size:3.5rem}.book-title{font-size:1.1rem}}.book-view-page{max-width:900px;margin:0 auto;padding:2rem}.book-controls-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;flex-wrap:wrap;gap:1rem}.back-to-shelf-btn{display:inline-flex;align-items:center;padding:.75rem 1.5rem;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;text-decoration:none;border-radius:25px;font-weight:600;font-size:1rem;box-shadow:0 4px 12px #667eea4d;transition:transform .2s ease,box-shadow .2s ease}.back-to-shelf-btn:hover{transform:translateY(-2px);box-shadow:0 6px 18px #667eea66}.book-navigation{display:flex;align-items:center;gap:1rem;flex:1;justify-content:center}.book-position{font-size:.95rem;color:#64748b;font-weight:600;padding:.5rem 1rem;background:#f1f5f9;border-radius:15px}.nav-book-btn{padding:.6rem 1rem;background:#fff;color:#6366f1;border:2px solid #6366f1;border-radius:20px;font-weight:600;font-size:.9rem;cursor:pointer;transition:all .2s ease}.nav-book-btn:hover{background:#6366f1;color:#fff;transform:scale(1.05)}.audio-toggle-btn{padding:.75rem 1.5rem;background:#fff;color:#6366f1;border:2px solid #6366f1;border-radius:25px;font-weight:600;font-size:1rem;cursor:pointer;transition:all .2s ease}.audio-toggle-btn.on{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-color:transparent}.audio-toggle-btn:hover{transform:scale(1.05);box-shadow:0 4px 12px #6366f14d}.book-container{background:#fff;border-radius:30px;box-shadow:0 8px 30px #0000001a;overflow:hidden;margin-bottom:2rem}.book-page{padding:3rem}.story-title{font-size:3rem;font-weight:800;color:#6366f1;text-align:center;margin-bottom:2rem;line-height:1.2}.book-image-container{display:flex;justify-content:center;align-items:center;margin-bottom:2rem;background:linear-gradient(135deg,#fef3c7,#fde68a,#fcd34d);border-radius:25px;padding:3rem;box-shadow:0 6px 20px #f59e0b33}.book-image-emoji{font-size:8rem;animation:bookBounce 2s ease-in-out infinite}@keyframes bookBounce{0%,to{transform:translateY(0) scale(1)}50%{transform:translateY(-15px) scale(1.05)}}.read-all-btn{display:block;margin:0 auto 2rem;padding:1rem 2rem;background:linear-gradient(135deg,#10b981,#059669);color:#fff;border:none;border-radius:25px;font-size:1.2rem;font-weight:700;cursor:pointer;box-shadow:0 4px 15px #10b9814d;transition:all .3s ease}.read-all-btn:hover{transform:translateY(-3px) scale(1.05);box-shadow:0 6px 20px #10b98166}.read-all-btn:active{transform:translateY(0) scale(1)}.story-text{margin-top:2rem;display:flex;flex-direction:column;gap:1.5rem}.sentence-line{display:flex;align-items:center;gap:1rem;padding:1.5rem;background:#f8fafc;border-radius:20px;border-left:5px solid #6366f1;transition:all .2s ease}.sentence-line:hover{background:#ede9fe;transform:translate(5px);box-shadow:0 4px 12px #6366f126}.sentence-speaker-btn{flex-shrink:0;width:50px;height:50px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:50%;font-size:1.5rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;box-shadow:0 4px 10px #667eea4d}.sentence-speaker-btn:hover{transform:scale(1.15);box-shadow:0 6px 15px #667eea80}.sentence-speaker-btn:active{transform:scale(.95)}.sentence-text{font-size:1.8rem;line-height:1.8;color:#1e293b;font-weight:500;margin:0;font-family:Comic Sans MS,Comic Neue,cursive,sans-serif}.book-metadata{display:flex;justify-content:center;gap:2rem;margin-top:3rem;padding-top:2rem;border-top:2px solid #e2e8f0}.theme-tag,.level-tag{padding:.6rem 1.5rem;border-radius:20px;font-weight:600;font-size:1rem}.theme-tag{background:#dbeafe;color:#1e40af}.level-tag{background:#fef3c7;color:#92400e}.book-controls-bottom{display:flex;justify-content:center;gap:2rem;margin-top:2rem}.nav-book-btn-large{padding:1.2rem 2.5rem;background:#fff;color:#6366f1;border:3px solid #6366f1;border-radius:30px;font-weight:700;font-size:1.2rem;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #6366f133}.nav-book-btn-large:hover{background:#6366f1;color:#fff;transform:translateY(-3px);box-shadow:0 6px 20px #6366f166}.nav-book-btn-large.primary{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-color:transparent}.nav-book-btn-large.primary:hover{transform:translateY(-3px) scale(1.05);box-shadow:0 8px 25px #667eea80}.book-not-found{text-align:center;padding:4rem 2rem}.book-not-found h2{font-size:2.5rem;color:#ef4444;margin-bottom:2rem}.book-not-found a{display:inline-block;padding:1rem 2rem;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;text-decoration:none;border-radius:25px;font-weight:600;font-size:1.1rem;box-shadow:0 4px 15px #667eea4d;transition:all .3s ease}.book-not-found a:hover{transform:translateY(-3px);box-shadow:0 6px 20px #667eea66}@media (max-width: 768px){.book-view-page{padding:1rem}.book-controls-top{flex-direction:column;align-items:stretch}.book-navigation{order:2;flex-direction:column}.back-to-shelf-btn{order:1;text-align:center;justify-content:center}.audio-toggle-btn{order:3;text-align:center}.book-page{padding:2rem 1.5rem}.story-title{font-size:2.2rem}.book-image-emoji{font-size:6rem}.sentence-text{font-size:1.5rem}.sentence-speaker-btn{width:45px;height:45px;font-size:1.3rem}.book-controls-bottom{flex-direction:column;gap:1rem}.nav-book-btn-large{width:100%}}@media (max-width: 480px){.story-title{font-size:1.8rem}.book-image-emoji{font-size:5rem}.book-image-container{padding:2rem}.sentence-text{font-size:1.3rem}.sentence-line{padding:1rem;gap:.75rem}.book-metadata{flex-direction:column;gap:1rem}}.universal-quiz-page{max-width:900px;margin:0 auto;padding:2rem 1rem}.quiz-page-header{text-align:center;margin-bottom:3rem}.quiz-page-header h1{font-size:2.2rem;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:.5rem}.quiz-page-header p{font-size:1.1rem;color:var(--text-secondary)}.quiz-setup{background:var(--card-bg);border-radius:16px;padding:2.5rem;text-align:center}.difficulty-selector label{display:block;font-weight:600;margin-bottom:.75rem;color:var(--text-primary);font-size:1.1rem}.difficulty-selector select{padding:.75rem 1.5rem;font-size:1rem;border:2px solid var(--border-color);border-radius:8px;background:var(--input-bg);color:var(--text-primary);cursor:pointer;min-width:200px}.start-quiz-btn{padding:1rem 2.5rem;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:12px;font-size:1.1rem;font-weight:600;cursor:pointer;transition:transform .2s}.start-quiz-btn:hover:not(:disabled){transform:scale(1.05)}.start-quiz-btn:disabled{opacity:.7;cursor:not-allowed}.error-message{margin-top:1rem;padding:1rem;background:#ef44441a;border:2px solid #ef4444;border-radius:8px;color:#ef4444}.quiz-container{background:var(--card-bg);border-radius:16px;padding:2rem}.quiz-progress{margin-bottom:2rem}.progress-bar{height:8px;background:var(--border-color);border-radius:10px;overflow:hidden;margin-bottom:.5rem}.progress-text{text-align:center;font-weight:600;color:var(--text-secondary)}.question-card{background:var(--input-bg);border-radius:12px;padding:2rem;position:relative;overflow:visible!important}.question-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem}.question-header h2{font-size:1.5rem;color:var(--text-primary)}.score-badge{background:var(--primary-color);color:#fff;padding:.5rem 1rem;border-radius:20px;font-weight:600}.question-text{font-size:1.3rem;font-weight:600;color:var(--text-primary);margin-bottom:2rem;line-height:1.6}.answer-option{display:flex;align-items:center;gap:1rem;padding:1.25rem;border:3px solid var(--border-color);border-radius:12px;background:var(--card-bg);cursor:pointer;text-align:left;transition:all .2s;font-size:1.1rem}.quiz-summary{text-align:center;margin-top:2rem;padding:2rem;background:var(--card-bg);border-radius:12px}.quiz-summary h2{font-size:2rem;color:var(--text-primary);margin-bottom:1.5rem}.final-score{margin-bottom:1.5rem}.score-circle{display:inline-flex;flex-direction:column;align-items:center;margin-bottom:1rem}.encouragement{font-size:1.2rem;color:var(--text-secondary);margin-bottom:2rem;line-height:1.6}.retry-btn{padding:1rem 2.5rem;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:12px;font-size:1.1rem;font-weight:600;cursor:pointer;transition:transform .2s}.retry-btn:hover{transform:scale(1.05)}.story-container{background:#fff;border-radius:16px;padding:2.5rem;box-shadow:0 4px 20px #00000014;max-width:800px;margin:2rem auto;animation:slideUp .5s ease-out}.story-header{text-align:center;margin-bottom:2rem;padding-bottom:1.5rem;border-bottom:2px solid #e0e7ff}.story-header h2{font-size:2rem;color:#6366f1;margin:0 0 .5rem}.story-instruction{color:#64748b;font-size:1.1rem;margin:0}.story-content{background:#f8fafc;border-radius:12px;padding:2rem;margin:2rem 0;border-left:4px solid #6366f1}.story-text{font-size:1.15rem;line-height:1.8;color:#1e293b;margin:0;white-space:pre-wrap}.story-actions{display:flex;justify-content:center;margin-top:2rem}.ready-btn{background:linear-gradient(135deg,#6366f1,#8b5cf6);color:#fff;border:none;border-radius:12px;padding:1rem 3rem;font-size:1.1rem;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #6366f14d}.ready-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #6366f166}.view-story-btn{background:#e0e7ff;color:#6366f1;border:2px solid #6366f1;border-radius:8px;padding:.75rem 1.5rem;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease;margin-bottom:1.5rem;width:100%}.view-story-btn:hover{background:#6366f1;color:#fff}body.dark-mode .story-container{background:#1e293b;box-shadow:0 4px 20px #0000004d}body.dark-mode .story-header{border-bottom-color:#334155}body.dark-mode .story-header h2{color:#818cf8}body.dark-mode .story-instruction{color:#94a3b8}body.dark-mode .story-content{background:#0f172a;border-left-color:#818cf8}body.dark-mode .story-text{color:#f1f5f9}body.dark-mode .view-story-btn{background:#334155;color:#818cf8;border-color:#818cf8}body.dark-mode .view-story-btn:hover{background:#818cf8;color:#fff}[data-theme=dark] .story-content{background:#0f172a;border-left-color:#818cf8}[data-theme=dark] .story-text{color:#e5e7eb}[data-theme=dark] .story-instruction{color:#d1d5db}[data-theme=dark] .view-story-btn{background:#334155;color:#818cf8;border-color:#818cf8}[data-theme=dark] .view-story-btn:hover{background:#818cf8;color:#fff}[data-theme=dark] .question-text{color:#f3f4f6}[data-theme=dark] .option-text{color:#e5e7eb}@media (max-width: 768px){.universal-quiz-page{padding:1rem}.quiz-page-header h1{font-size:1.8rem}.question-text{font-size:1.1rem}.answer-option{font-size:1rem;padding:1rem}.story-container{padding:1.5rem;margin:1rem}.story-header h2{font-size:1.5rem}.story-instruction{font-size:1rem}.story-content{padding:1.5rem}.story-text{font-size:1rem;line-height:1.7}.ready-btn{padding:.875rem 2rem;font-size:1rem}}.feedback-visible{display:block!important;opacity:1!important;visibility:visible!important;animation:none!important;transition:none!important}.story-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000;padding:1rem}.story-modal{background:var(--card-bg);border-radius:16px;max-width:700px;width:100%;max-height:80vh;display:flex;flex-direction:column;box-shadow:0 20px 60px #0000004d}.story-modal-header{display:flex;justify-content:space-between;align-items:center;padding:1.5rem;border-bottom:2px solid var(--border-color)}.story-modal-header h3{margin:0;font-size:1.5rem;color:var(--text-primary)}.close-modal-btn{background:none;border:none;font-size:1.5rem;color:var(--text-secondary);cursor:pointer;padding:.5rem;line-height:1;transition:color .2s}.close-modal-btn:hover{color:var(--text-primary)}.story-modal-content{padding:2rem;overflow-y:auto;flex:1}.story-modal-content p{font-size:1.1rem;line-height:1.8;color:var(--text-primary);margin:0}.close-story-btn{margin:1.5rem;padding:1rem 2rem;font-size:1rem;font-weight:600;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:12px;cursor:pointer;transition:transform .2s,box-shadow .2s}.close-story-btn:hover{transform:translateY(-2px);box-shadow:0 8px 20px #667eea66}.bookmark-btn{position:absolute;top:1rem;right:1rem;background:var(--bg-secondary);border:2px solid var(--border-color);border-radius:50%;width:40px;height:40px;display:flex;align-items:center;justify-content:center;font-size:1.5rem;cursor:pointer;transition:all .3s ease;z-index:10;box-shadow:0 2px 8px #0000001a}.bookmark-btn:hover:not(:disabled){transform:scale(1.1);border-color:var(--primary-color);box-shadow:0 4px 12px #c2f9334d}.bookmark-btn.bookmarked{background:linear-gradient(135deg,#c2f933,#22d3ee);border-color:transparent;animation:bookmarkPulse .4s ease}.bookmark-btn.loading{opacity:.6;cursor:not-allowed;animation:spin 1s linear infinite}.bookmark-btn:disabled{cursor:not-allowed;opacity:.5}@keyframes bookmarkPulse{0%{transform:scale(1)}50%{transform:scale(1.2)}to{transform:scale(1)}}[data-theme=light] .bookmark-btn{background:#fff;box-shadow:0 2px 8px #00000026}[data-theme=light] .bookmark-btn.bookmarked{background:linear-gradient(135deg,#84cc16,#0ea5e9)}[data-theme=light] .bookmark-btn:hover:not(:disabled){box-shadow:0 4px 12px #0ea5e94d}.grade-card{position:relative}.grade2-home-page{max-width:1200px;margin:0 auto;padding:2rem 1rem}.grade-header h1{font-size:2.5rem;background:linear-gradient(135deg,#f093fb,#f5576c);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:1rem}.grade-header p{font-size:1.2rem;color:var(--text-secondary);max-width:700px;margin:0 auto}.section-title{font-size:1.8rem;margin-bottom:.5rem;color:var(--text-primary)}.section-description{color:var(--text-secondary);margin-bottom:1.5rem;font-size:1.05rem}.grade-card{background:var(--bg-primary);border:2px solid var(--border-color);border-radius:12px;padding:1.5rem;text-decoration:none;color:var(--text-primary);transition:all .3s ease;display:flex;flex-direction:column;position:relative;overflow:hidden}.grade-card:hover{transform:translateY(-4px);box-shadow:0 8px 16px #00000026;border-color:#f5576c}.grade-card.highlighted{border-color:#f5576c;background:linear-gradient(135deg,#f5576c0d,#f093fb0d)}.grade-card.featured{border:3px solid #f5576c;background:linear-gradient(135deg,#f5576c1a,#f093fb1a)}.grade-card h3{margin:.5rem 0;font-size:1.25rem;color:var(--text-primary)}.grade-card p{color:var(--text-secondary);margin:.5rem 0 1rem;flex-grow:1;font-size:.95rem;line-height:1.5}.grade-badge{display:inline-block;padding:.35rem .75rem;background:var(--bg-secondary);border-radius:20px;font-size:.75rem;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px;margin-top:auto}.grade-badge.special{background:linear-gradient(135deg,#f093fb,#f5576c);color:#fff}.feature-list{list-style:none;padding:0;margin:.75rem 0}.feature-list li{padding:.25rem 0;color:var(--text-secondary);font-size:.9rem}.feature-list li:before{content:"✓ ";color:#10b981;font-weight:700;margin-right:.5rem}.learning-path{background:linear-gradient(135deg,#f5576c1a,#f093fb1a);border-radius:16px;padding:2rem;margin-top:3rem}.learning-path h3{font-size:1.8rem;margin-bottom:.5rem;text-align:center;color:var(--text-primary)}.path-description{text-align:center;color:var(--text-secondary);margin-bottom:2rem;font-size:1.05rem}.path-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1rem}.path-step{background:var(--card-bg);padding:1rem 1.5rem;border-radius:12px;display:flex;align-items:center;gap:1rem;box-shadow:0 2px 8px #00000014;transition:transform .2s ease}.path-step:hover{transform:translate(4px)}.step-number{background:linear-gradient(135deg,#f093fb,#f5576c);color:#fff;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1rem;flex-shrink:0}.path-step span:last-child{color:var(--text-primary);font-size:.95rem}.coming-soon-notice{background:var(--card-bg);border:2px dashed var(--border-color);border-radius:16px;padding:2rem;margin-top:3rem}.notice-content{display:flex;align-items:center;gap:1.5rem}.notice-icon{font-size:3rem;flex-shrink:0}.notice-text h4{margin:0 0 .5rem;color:var(--text-primary);font-size:1.3rem}.notice-text p{margin:0;color:var(--text-secondary);line-height:1.6}@media (max-width: 768px){.grade2-home-page{padding:1rem}.grade-header h1{font-size:2rem}.grade-header p{font-size:1rem}.section-title{font-size:1.5rem}.grade-cards{grid-template-columns:1fr;gap:1rem}.path-steps{grid-template-columns:1fr}.notice-content{flex-direction:column;text-align:center}.learning-path{padding:1.5rem}}@media (max-width: 480px){.grade-header h1{font-size:1.75rem}.grade-card{padding:1.25rem}.grade-card-icon{font-size:2.5rem}.section-title{font-size:1.3rem}}.problem-card{background:#fff;border-radius:12px;padding:2rem;box-shadow:0 4px 6px #0000001a;max-width:700px;margin:0 auto}.problem-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:2px solid #e5e7eb}.problem-counter{font-weight:600;color:#374151;font-size:1rem}.problem-difficulty{padding:.25rem .75rem;border-radius:20px;font-size:.875rem;font-weight:500;background-color:#dbeafe;color:#1e40af;text-transform:capitalize}.problem-question{margin-bottom:2rem}.problem-question p{font-size:1.25rem;line-height:1.6;color:#1f2937}.problem-hint-section{margin-bottom:1.5rem}.btn-hint{padding:.5rem 1rem;background:#fef3c7;border:2px solid #fbbf24;border-radius:8px;color:#92400e;font-size:.95rem;font-weight:600;cursor:pointer;transition:all .2s ease;width:100%;text-align:left;display:flex;align-items:center;justify-content:space-between}.btn-hint:hover{background:#fde68a;border-color:#f59e0b}.hint-content{margin-top:.75rem;padding:1rem;background:#fffbeb;border-left:4px solid #fbbf24;border-radius:8px}.hint-content p{font-size:1rem;color:#78350f;line-height:1.6;margin:0}.problem-answer-section{display:flex;gap:1rem;margin-bottom:1.5rem}.problem-input{flex:1;padding:.75rem;font-size:1rem;border:2px solid #d1d5db;border-radius:8px;transition:border-color .2s}.problem-input:focus{outline:none;border-color:#2563eb}.feedback{padding:1rem;border-radius:8px;margin-bottom:1rem}.feedback-correct{background-color:#d1fae5;color:#065f46;border:2px solid #10b981}.feedback-incorrect{background-color:#fee2e2;color:#991b1b;border:2px solid #ef4444}.feedback strong{display:block;margin-bottom:.5rem;font-size:1.1rem}.explanation{margin-top:.5rem;font-size:.95rem;line-height:1.5}@media (max-width: 768px){.problem-card{padding:1.5rem}.problem-question p{font-size:1.1rem}.problem-answer-section{flex-direction:column}}.grade2-page{max-width:900px;margin:0 auto}.page-description{font-size:1.125rem;color:#6b7280;max-width:600px;margin:0 auto 1.5rem;line-height:1.6}.difficulty-selector{margin:2rem auto 1.5rem;max-width:500px}.difficulty-selector label{display:block;font-size:1.1rem;font-weight:600;color:var(--text-primary);margin-bottom:1rem;text-align:center}.difficulty-dropdown:disabled{opacity:.5;cursor:not-allowed}.problem-container{margin-top:2rem}@media (max-width: 768px){.page-header h1{font-size:1.5rem}.page-description{font-size:1rem}}.score-tracker{margin-top:2rem;padding:1.5rem;background:#fff;border-radius:12px;box-shadow:0 2px 4px #0000001a}.score-dots{display:flex;gap:.5rem;justify-content:center;flex-wrap:wrap;margin-bottom:1rem}.score-dot{width:24px;height:24px;border-radius:50%;border:2px solid #d1d5db;background:#fff;cursor:pointer;transition:all .2s ease}.score-dot:hover{transform:scale(1.2);border-color:#9ca3af}.score-dot.unanswered{background:#fff;border-color:#d1d5db}.score-dot.correct{background:#10b981;border-color:#10b981}.score-dot.correct-with-attempts{background:#f59e0b;border-color:#f59e0b;position:relative;display:flex;align-items:center;justify-content:center}.score-dot.incorrect{background:#ef4444;border-color:#ef4444;position:relative;display:flex;align-items:center;justify-content:center}.attempt-count{font-size:.65rem;font-weight:700;color:#fff;line-height:1}.score-dot.current{border-width:3px;transform:scale(1.15);box-shadow:0 0 0 3px #3b82f633}.score-summary{display:flex;align-items:center;justify-content:center;gap:.75rem;font-size:1rem;color:#4b5563}.score-label{font-weight:600}.score-correct{color:#10b981;font-weight:600}.score-incorrect{color:#ef4444;font-weight:600}.score-separator{color:#d1d5db}.interactive-reading-page{max-width:900px;margin:0 auto;padding:2rem 1rem}.page-header h1{font-size:2.2rem;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:.75rem}.page-description{font-size:1.15rem;color:var(--text-secondary)}.choice-screen{text-align:center}.choice-screen h2{font-size:1.8rem;color:var(--text-primary);margin-bottom:2rem}.choice-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2rem;margin-bottom:2rem}.choice-card{background:var(--card-bg);border:3px solid var(--border-color);border-radius:16px;padding:2.5rem 2rem;cursor:pointer;transition:all .3s}.choice-card:hover{border-color:var(--primary-color);transform:translateY(-5px);box-shadow:0 8px 20px #667eea33}.card-icon{font-size:4rem;margin-bottom:1rem}.choice-card h3{font-size:1.4rem;color:var(--text-primary);margin-bottom:.5rem}.choice-card p{color:var(--text-secondary);font-size:1rem}.difficulty-section{background:var(--card-bg);padding:1.5rem;border-radius:12px;display:inline-block}.difficulty-section label{display:block;font-weight:600;margin-bottom:.75rem;color:var(--text-primary)}.difficulty-section select{padding:.75rem 1rem;font-size:1rem;border:2px solid var(--border-color);border-radius:8px;background:var(--input-bg);color:var(--text-primary);cursor:pointer;min-width:250px}.character-select-screen{text-align:center}.back-btn{background:var(--card-bg);border:2px solid var(--border-color);padding:.5rem 1rem;border-radius:8px;cursor:pointer;font-weight:600;margin-bottom:1rem}.back-btn:hover{border-color:var(--primary-color)}.selected-count{font-size:1.1rem;font-weight:600;color:var(--primary-color);margin-bottom:2rem}.character-categories{display:flex;flex-direction:column;gap:2rem;margin-bottom:2rem}.character-category{text-align:left}.character-category h3{font-size:1.3rem;margin-bottom:1rem;color:var(--text-primary)}.character-chips{display:flex;flex-wrap:wrap;gap:.75rem}.character-chip{padding:.75rem 1.5rem;border:2px solid var(--border-color);background:var(--card-bg);border-radius:25px;cursor:pointer;font-weight:600;transition:all .2s}.character-chip:hover:not(:disabled){border-color:var(--primary-color);transform:scale(1.05)}.character-chip.selected{background:var(--primary-color);color:#fff;border-color:var(--primary-color)}.character-chip:disabled{opacity:.5;cursor:not-allowed}.custom-character-input{display:flex;gap:.5rem;max-width:400px}.custom-character-input input{flex:1;padding:.75rem;border:2px solid var(--border-color);border-radius:8px;font-size:1rem;background:var(--input-bg);color:var(--text-primary)}.custom-character-input button{padding:.75rem 1.5rem;background:var(--primary-color);color:#fff;border:none;border-radius:8px;font-weight:600;cursor:pointer}.custom-character-input button:disabled{opacity:.5;cursor:not-allowed}.selected-characters{background:var(--card-bg);padding:1.5rem;border-radius:12px;margin-top:2rem}.selected-characters h4{font-size:1.2rem;margin-bottom:1rem;color:var(--text-primary)}.selected-list{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.5rem}.selected-tag{background:var(--primary-color);color:#fff;padding:.5rem 1rem;border-radius:20px;font-weight:600;display:flex;align-items:center;gap:.5rem}.selected-tag button{background:#ffffff4d;border:none;color:#fff;border-radius:50%;width:20px;height:20px;cursor:pointer;font-size:1.2rem;display:flex;align-items:center;justify-content:center}.create-story-btn{padding:1rem 2rem;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:12px;font-size:1.1rem;font-weight:600;cursor:pointer;transition:transform .2s}.create-story-btn:hover{transform:scale(1.05)}.loading-screen{text-align:center;padding:4rem 2rem}.spinner{width:60px;height:60px;border:6px solid var(--border-color);border-top-color:var(--primary-color);border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 1.5rem}.loading-screen p{font-size:1.2rem;color:var(--text-primary)}.error-screen{text-align:center;padding:3rem 2rem;background:var(--card-bg);border-radius:12px;border:2px solid #ef4444}.error-screen p{font-size:1.1rem;color:#ef4444;margin-bottom:1.5rem}.error-screen button{padding:.75rem 1.5rem;background:var(--primary-color);color:#fff;border:none;border-radius:8px;font-weight:600;cursor:pointer}.story-screen{display:flex;justify-content:center}.story-container{background:var(--card-bg);border:3px solid var(--border-color);border-radius:16px;padding:2.5rem;max-width:700px;width:100%}.story-container h2{font-size:1.8rem;color:var(--text-primary);margin-bottom:1.5rem;text-align:center}.story-text{font-size:1.25rem;line-height:1.8;color:var(--text-primary);margin-bottom:2rem;text-align:justify}.ready-btn{width:100%;padding:1.25rem;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:12px;font-size:1.2rem;font-weight:600;cursor:pointer;transition:transform .2s}.ready-btn:hover{transform:scale(1.02)}.questions-screen{max-width:800px;margin:0 auto}.progress-bar{height:8px;background:var(--border-color);border-radius:10px;margin-bottom:1.5rem;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,#667eea,#764ba2);transition:width .3s}.question-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;font-weight:600;color:var(--text-primary)}.score-badge{background:var(--primary-color);color:#fff;padding:.5rem 1rem;border-radius:20px}.question-container{background:var(--card-bg);border:3px solid var(--border-color);border-radius:16px;padding:2rem;position:relative;overflow:visible!important}.question-text{font-size:1.4rem;font-weight:600;color:var(--text-primary);margin-bottom:2rem;line-height:1.6}.answer-options{display:flex;flex-direction:column;gap:1rem;margin-bottom:1.5rem}.answer-option{display:flex;align-items:center;gap:1rem;padding:1.25rem;border:3px solid var(--border-color);border-radius:12px;background:var(--input-bg);cursor:pointer;text-align:left;transition:all .2s;font-size:1.1rem}.answer-option:hover:not(:disabled){border-color:var(--primary-color);transform:translate(5px)}.answer-option.selected{border-color:var(--primary-color);background:#667eea1a}.answer-option.correct{border-color:#22c55e!important;background:#22c55e26!important;border-width:3px!important}.answer-option.incorrect{border-color:#ef4444!important;background:#ef444426!important;border-width:3px!important}.answer-option:disabled{cursor:not-allowed}.option-letter{flex-shrink:0;width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:var(--primary-color);color:#fff;border-radius:50%;font-weight:700}.option-text{flex:1;color:var(--text-primary)}.next-question-btn:hover{transform:translateY(-3px);box-shadow:0 6px 16px #667eea66}.summary-screen{text-align:center;max-width:600px;margin:0 auto}.summary-screen h2{font-size:2.2rem;color:var(--text-primary);margin-bottom:2rem}.final-score{background:var(--card-bg);border:3px solid var(--border-color);border-radius:16px;padding:2.5rem;margin-bottom:2rem}.score-circle{display:flex;flex-direction:column;align-items:center;margin-bottom:1rem}.score-number{font-size:4rem;font-weight:700;color:var(--primary-color)}.score-total{font-size:2rem;color:var(--text-secondary)}.score-percentage{font-size:1.5rem;font-weight:600;color:var(--text-primary)}.encouragement{padding:1.5rem;border-radius:12px;margin-bottom:2rem;font-size:1.2rem;font-weight:600}.encouragement.excellent{background:#22c55e26;border:3px solid #22c55e;color:#22c55e}.encouragement.good{background:#3b82f626;border:3px solid #3b82f6;color:#3b82f6}.encouragement.keep-going{background:#f9731626;border:3px solid #f97316;color:#f97316}.summary-actions{display:flex;justify-content:center;gap:1rem}.action-btn{padding:1rem 2rem;border:none;border-radius:12px;font-size:1.1rem;font-weight:600;cursor:pointer;transition:transform .2s}.action-btn.primary{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.action-btn:hover{transform:scale(1.05)}@media (max-width: 768px){.interactive-reading-page{padding:1rem}.page-header h1{font-size:1.8rem}.choice-cards{grid-template-columns:1fr;gap:1.5rem}.card-icon{font-size:3rem}.story-container{padding:1.5rem}.story-text{font-size:1.1rem}.question-text{font-size:1.2rem}.answer-option{font-size:1rem;padding:1rem}}.story-writer{background:#fff;border-radius:12px;box-shadow:0 4px 6px #0000001a;padding:2rem}.story-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;padding-bottom:1rem;border-bottom:2px solid #e5e7eb}.story-header h3{font-size:1.5rem;color:#1f2937;margin:0}.story-progress{background:#dbeafe;color:#1e40af;padding:.5rem 1rem;border-radius:20px;font-size:.875rem;font-weight:600}.story-segments{margin-bottom:2rem}.story-segment{margin-bottom:2.5rem;animation:slideIn .5s ease-out}.segment-number{font-size:.875rem;font-weight:700;color:#6366f1;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.75rem}.segment-content{display:grid;grid-template-columns:1fr 1fr;gap:2rem;background:#f9fafb;padding:1.5rem;border-radius:10px;border-left:4px solid #6366f1}.segment-text{font-size:1.125rem;line-height:1.8;color:#1f2937;margin:0}.segment-image{display:flex;flex-direction:column;gap:.75rem}.segment-image img{width:100%;height:auto;border-radius:8px;box-shadow:0 4px 6px #0000001a}.image-caption{font-size:.875rem;color:#6b7280;font-style:italic;margin:0}.segment-image-placeholder{background:linear-gradient(135deg,#f3f4f6,#e5e7eb);border-radius:8px;display:flex;align-items:center;justify-content:center;min-height:200px}.image-loading{text-align:center;color:#6b7280;animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.story-input-section{background:#f9fafb;padding:2rem;border-radius:10px;border:2px dashed #d1d5db}.encouragement-message{margin-bottom:1rem}.encouragement-message p{font-size:1.0625rem;color:#4b5563;font-weight:500;margin:0}.story-textarea{width:100%;padding:1rem;font-size:1.0625rem;border:2px solid #d1d5db;border-radius:8px;resize:vertical;font-family:inherit;transition:border-color .2s;margin-bottom:1rem}.story-textarea:focus{outline:none;border-color:#6366f1;box-shadow:0 0 0 3px #6366f11a}.story-textarea::placeholder{color:#9ca3af}.story-actions{display:flex;gap:1rem;flex-wrap:wrap}.btn-success{background:linear-gradient(135deg,#10b981,#059669);color:#fff;border:none;padding:.75rem 1.5rem;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:transform .2s,box-shadow .2s}.btn-success:hover{transform:translateY(-2px);box-shadow:0 4px 12px #10b9814d}.btn-success:disabled{opacity:.5;cursor:not-allowed;transform:none}.story-complete{text-align:center;padding:3rem 2rem;background:linear-gradient(135deg,#fef3c7,#fde68a);border-radius:12px}.story-complete h2{font-size:2rem;color:#92400e;margin-bottom:1rem}.story-complete p{font-size:1.25rem;color:#78350f;margin-bottom:2rem}.complete-actions{display:flex;justify-content:center;gap:1rem}@media (max-width: 968px){.segment-content{grid-template-columns:1fr}.story-writer{padding:1.5rem}.story-header{flex-direction:column;gap:1rem;align-items:flex-start}}.story-writing-page{max-width:1100px;margin:0 auto}.page-header h1{font-size:2rem;color:#1f2937;margin-bottom:1rem}.page-description{font-size:1.125rem;color:#6b7280;max-width:700px;margin:0 auto;line-height:1.6}.story-container{margin-top:2rem}.loading-message,.error-message{text-align:center;padding:3rem 2rem;background:#fff;border-radius:12px;box-shadow:0 4px 6px #0000001a}.loading-message p{font-size:1.25rem;color:#4b5563}.error-message{color:#991b1b}.error-message p{font-size:1.125rem;margin-bottom:1.5rem}.story-prompt-card{background:linear-gradient(135deg,#667eea,#764ba2);padding:3rem;border-radius:16px;box-shadow:0 10px 20px #00000026;color:#fff}.story-prompt-card h2{font-size:2rem;margin-bottom:1.5rem;text-align:center}.prompt-content{background:#ffffff26;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:2rem;border-radius:12px;margin-bottom:2rem}.starting-prompt{font-size:1.25rem;line-height:1.8;margin-bottom:2rem;font-weight:300}.guiding-questions h3{font-size:1.125rem;margin-bottom:1rem;font-weight:600}.guiding-questions ul{list-style:none;padding:0}.guiding-questions li{padding:.75rem 0 .75rem 1.5rem;position:relative;font-size:1.0625rem;line-height:1.6}.guiding-questions li:before{content:"💭";position:absolute;left:0}.prompt-actions{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}.btn-large{font-size:1.25rem;padding:1rem 2.5rem}@media (max-width: 768px){.story-prompt-card{padding:2rem 1.5rem}.story-prompt-card h2{font-size:1.5rem}.starting-prompt{font-size:1.125rem}.prompt-actions{flex-direction:column}.btn-large{font-size:1.125rem;padding:.875rem 2rem}}.review-quiz-page{max-width:900px;margin:0 auto;padding:2rem 1rem}.review-quiz-header{text-align:center;margin-bottom:3rem}.review-quiz-header h1{font-size:2rem;color:var(--primary-color);margin-bottom:.5rem}.review-quiz-description{font-size:1.1rem;color:var(--text-secondary);line-height:1.6;max-width:700px;margin:0 auto}.quiz-setup{background:var(--card-bg);border-radius:12px;padding:3rem 2rem;box-shadow:0 2px 8px #0000001a;text-align:center;max-width:500px;margin:0 auto}.difficulty-selector label{display:block;font-size:1.1rem;font-weight:600;margin-bottom:.75rem;color:var(--text-primary)}.difficulty-dropdown{width:100%;max-width:300px;padding:.75rem 1rem;font-size:1rem;border:2px solid var(--border-color);border-radius:8px;background:var(--input-bg);color:var(--text-primary);cursor:pointer;transition:border-color .2s}.difficulty-dropdown:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #667eea1a}.start-quiz-btn{padding:1rem 3rem;font-size:1.1rem;font-weight:600;color:#fff;background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:8px;cursor:pointer;transition:transform .2s,box-shadow .2s}.start-quiz-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}.quiz-content{min-height:400px}.loading-message{text-align:center;padding:3rem;color:var(--text-secondary)}.spinner{border:4px solid var(--border-color);border-top:4px solid var(--primary-color);border-radius:50%;width:50px;height:50px;animation:spin 1s linear infinite;margin:0 auto 1rem}.error-message{text-align:center;padding:2rem;background:#fee;border:2px solid #fcc;border-radius:8px;color:#c00}.retry-btn{margin-top:1rem;padding:.75rem 2rem;background:var(--primary-color);color:#fff;border:none;border-radius:6px;cursor:pointer;font-weight:600}.quiz-question-container{background:var(--card-bg);border-radius:12px;padding:2.5rem;box-shadow:0 2px 12px #00000014}.question-progress{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:2px solid var(--border-color)}.question-number{font-size:1.1rem;font-weight:600;color:var(--primary-color)}.current-score{font-size:1rem;font-weight:600;color:var(--text-secondary);background:var(--hover-bg);padding:.5rem 1rem;border-radius:20px}.question-topic-badge{display:inline-block;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:.5rem 1rem;border-radius:20px;font-size:.9rem;margin-bottom:1.5rem;font-weight:500}.question-text{font-size:1.3rem;line-height:1.6;color:var(--text-primary);margin-bottom:2rem;font-weight:500}.answer-input-section{margin-bottom:1.5rem}.answer-input{width:100%;padding:1rem;font-size:1.1rem;border:2px solid var(--border-color);border-radius:8px;background:var(--input-bg);color:var(--text-primary);transition:border-color .2s}.answer-input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #667eea1a}.answer-input:disabled{opacity:.6;cursor:not-allowed}.feedback-message{padding:1.5rem;border-radius:8px;margin-bottom:1.5rem}.feedback-message.correct{background:#d4edda;border:2px solid #28a745;color:#155724}.feedback-message.incorrect{background:#f8d7da;border:2px solid #dc3545;color:#721c24}.feedback-message strong{display:block;font-size:1.1rem;margin-bottom:.5rem}.feedback-message .explanation{margin-top:.75rem;font-size:.95rem;line-height:1.5}.question-controls{display:flex;gap:1rem;justify-content:center}.check-answer-btn,.next-question-btn{padding:1rem 2.5rem;font-size:1.1rem;font-weight:600;border:none;border-radius:8px;cursor:pointer;transition:transform .2s,box-shadow .2s}.check-answer-btn{background:var(--primary-color);color:#fff}.check-answer-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #667eea4d}.next-question-btn{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.next-question-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}.quiz-complete{text-align:center;padding:3rem 2rem;background:var(--card-bg);border-radius:12px;box-shadow:0 2px 12px #00000014}.quiz-complete h2{font-size:2rem;color:var(--primary-color);margin-bottom:2rem}.final-score{font-size:3rem;font-weight:700;color:var(--text-primary);margin-bottom:1rem}.percentage-score{font-size:1.5rem;color:var(--text-secondary);margin-bottom:2.5rem}.restart-quiz-btn{padding:1rem 3rem;font-size:1.1rem;font-weight:600;color:#fff;background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:8px;cursor:pointer;transition:transform .2s,box-shadow .2s}.restart-quiz-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}@media (max-width: 768px){.review-quiz-page{padding:1rem}.review-quiz-header h1{font-size:1.5rem}.review-quiz-description{font-size:1rem}.quiz-setup{padding:2rem 1.5rem}.quiz-question-container{padding:1.5rem}.question-text{font-size:1.1rem}.final-score{font-size:2rem}}.final-review-page{max-width:1000px;margin:0 auto;padding:2rem 1rem}.final-review-header{text-align:center;margin-bottom:3rem}.final-review-header h1{font-size:2.2rem;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:.75rem}.final-review-description{font-size:1.15rem;color:var(--text-secondary);line-height:1.6}.subject-selection{text-align:center}.subject-selection h2{font-size:1.8rem;color:var(--text-primary);margin-bottom:2rem}.subject-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.5rem;max-width:900px;margin:0 auto}.subject-card{background:var(--card-bg);border:3px solid transparent;border-radius:16px;padding:2rem 1.5rem;cursor:pointer;transition:all .3s ease;text-align:center;box-shadow:0 4px 12px #00000014}.subject-card:hover{transform:translateY(-8px);box-shadow:0 8px 24px #00000026}.subject-card.english{border-color:#667eea}.subject-card.english:hover{background:linear-gradient(135deg,#667eea1a,#764ba21a)}.subject-card.science{border-color:#38bdf8}.subject-card.science:hover{background:linear-gradient(135deg,#38bdf81a,#3b82f61a)}.subject-card.social-studies{border-color:#22c55e}.subject-card.social-studies:hover{background:linear-gradient(135deg,#22c55e1a,#10b9811a)}.subject-card.math{border-color:#fb923c}.subject-card.math:hover{background:linear-gradient(135deg,#fb923c1a,#f973161a)}.subject-icon{font-size:4rem;margin-bottom:1rem}.subject-card h3{font-size:1.5rem;color:var(--text-primary);margin-bottom:.5rem}.subject-card p{font-size:1rem;color:var(--text-secondary);line-height:1.5}.quiz-setup{background:var(--card-bg);border-radius:16px;padding:3rem 2rem;box-shadow:0 4px 16px #0000001a;max-width:600px;margin:0 auto}.selected-subject-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;flex-wrap:wrap;gap:1rem}.selected-subject-header h2{font-size:1.8rem;color:var(--primary-color);margin:0}.change-subject-btn{padding:.5rem 1rem;background:var(--hover-bg);border:2px solid var(--border-color);border-radius:8px;color:var(--text-primary);cursor:pointer;font-weight:600;transition:all .2s}.change-subject-btn:hover{background:var(--border-color)}.difficulty-selector{margin-bottom:2rem}.difficulty-selector label{display:block;font-size:1.15rem;font-weight:600;margin-bottom:.75rem;color:var(--text-primary)}.difficulty-dropdown{width:100%;padding:1rem;font-size:1.05rem;border:2px solid var(--border-color);border-radius:10px;background:var(--card-bg);color:var(--text-primary);cursor:pointer;transition:border-color .2s}.difficulty-dropdown option{background:var(--card-bg);color:var(--text-primary);padding:.5rem}[data-theme=dark] .difficulty-dropdown{background:#2d3748;color:#e2e8f0;border-color:#4a5568}[data-theme=dark] .difficulty-dropdown option{background:#2d3748;color:#e2e8f0}[data-theme=dark] .difficulty-dropdown option:hover{background:#4a5568}.difficulty-dropdown:hover{border-color:var(--primary-color)}.difficulty-dropdown:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #667eea26}.start-quiz-btn{width:100%;padding:1.25rem 2rem;font-size:1.2rem;font-weight:700;color:#fff;background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:12px;cursor:pointer;transition:all .3s;box-shadow:0 4px 12px #667eea4d}.start-quiz-btn:hover{transform:translateY(-3px);box-shadow:0 8px 20px #667eea66}.quiz-stats{display:flex;gap:1rem;justify-content:center;margin:1.5rem 0;flex-wrap:wrap}.stat-item{display:flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;border-radius:12px;font-size:1.1rem;font-weight:600;box-shadow:0 2px 8px #0000001a}.stat-item.correct{background:linear-gradient(135deg,#d1fae5,#a7f3d0);color:#065f46;border:2px solid #10b981}.stat-item.wrong{background:linear-gradient(135deg,#fee2e2,#fecaca);color:#991b1b;border:2px solid #ef4444}[data-theme=dark] .stat-item.correct{background:linear-gradient(135deg,#10b98133,#0596694d);color:#6ee7b7;border-color:#10b981}[data-theme=dark] .stat-item.wrong{background:linear-gradient(135deg,#ef444433,#dc26264d);color:#fca5a5;border-color:#ef4444}.stat-label{font-weight:700}.stat-value{font-size:1.3rem;font-weight:800}.quiz-content{min-height:500px}.loading-message{text-align:center;padding:4rem 2rem}.spinner{border:5px solid var(--border-color);border-top:5px solid var(--primary-color);border-radius:50%;width:60px;height:60px;animation:spin 1s linear infinite;margin:0 auto 1.5rem}.loading-message p{font-size:1.2rem;color:var(--text-secondary)}.error-message{text-align:center;padding:2rem;background:#fee;border:3px solid #fcc;border-radius:12px;color:#c00;font-size:1.1rem}.retry-btn{margin-top:1rem;padding:.75rem 2rem;background:var(--primary-color);color:#fff;border:none;border-radius:8px;cursor:pointer;font-weight:600;font-size:1rem}.quiz-question-container{background:var(--card-bg);border-radius:16px;padding:2.5rem;box-shadow:0 4px 20px #0000001a}.question-progress{margin-bottom:2rem}.progress-text{font-size:1.1rem;font-weight:600;color:var(--primary-color);margin-bottom:.75rem;text-align:center}.progress-bar{width:100%;height:12px;background:var(--hover-bg);border-radius:20px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,#667eea,#764ba2);transition:width .4s ease;border-radius:20px}.question-topic-badge{display:inline-block;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:.6rem 1.2rem;border-radius:25px;font-size:.95rem;margin-bottom:1.5rem;font-weight:600}.reading-passage{background:var(--card-bg);border:2px solid var(--border-color);border-radius:12px;padding:1.5rem;margin-bottom:2rem}.reading-passage h3{font-size:1.15rem;color:var(--primary-color);margin-bottom:1rem;font-weight:600}.passage-text{font-size:1.1rem;line-height:1.8;color:var(--text-primary);white-space:pre-line}.question-text{font-size:1.35rem;line-height:1.7;color:var(--text-primary);margin-bottom:2rem;font-weight:500;white-space:pre-line}.answer-options{margin-bottom:2rem}.multiple-choice-options{display:grid;gap:1rem}.option-btn{width:100%;padding:1.25rem 1.5rem;font-size:1.05rem;text-align:left;background:var(--input-bg);border:3px solid var(--border-color);border-radius:12px;color:var(--text-primary);cursor:pointer;transition:all .2s;font-weight:500}.option-btn:hover:not(:disabled){border-color:var(--primary-color);background:var(--hover-bg);transform:translate(5px)}.option-btn.selected{border-color:var(--primary-color);background:#667eea1a;font-weight:600}.option-btn.correct-answer{border-color:#22c55e;background:#22c55e26}.option-btn.incorrect-answer{border-color:#ef4444;background:#ef444426}.option-btn:disabled{cursor:not-allowed}.answer-input{width:100%;padding:1.25rem;font-size:1.15rem;border:3px solid var(--border-color);border-radius:12px;background:var(--input-bg);color:var(--text-primary);transition:border-color .2s}.answer-input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #667eea26}.answer-input:disabled{opacity:.7;cursor:not-allowed}.feedback-message{padding:1.5rem;border-radius:12px;margin-bottom:1.5rem;font-size:1.05rem}.feedback-message.correct{background:linear-gradient(135deg,#22c55e26,#10b98126);border:3px solid #22c55e;color:#166534}.feedback-message.incorrect{background:linear-gradient(135deg,#f9731626,#fb923c26);border:3px solid #f97316;color:#9a3412}.feedback-message strong{display:block;font-size:1.2rem;margin-bottom:.75rem}.feedback-message .explanation{margin-top:.75rem;font-size:1rem;line-height:1.6;opacity:.9}.question-controls{display:flex;justify-content:center;gap:1rem}.check-answer-btn,.next-question-btn{padding:1rem 3rem;font-size:1.15rem;font-weight:700;border:none;border-radius:12px;cursor:pointer;transition:all .3s}.check-answer-btn{background:var(--primary-color);color:#fff;box-shadow:0 4px 12px #667eea4d}.check-answer-btn:hover:not(:disabled){transform:translateY(-3px);box-shadow:0 6px 16px #667eea66}.next-question-btn{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;box-shadow:0 4px 12px #667eea4d}.next-question-btn:hover{transform:translateY(-3px);box-shadow:0 6px 16px #667eea80}.quiz-complete{background:var(--card-bg);border-radius:16px;padding:3rem 2rem;box-shadow:0 4px 20px #0000001a;text-align:center}.celebration-header h2{font-size:2rem;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:2rem}.score-display{margin-bottom:2rem}.final-score{font-size:4rem;font-weight:800;color:var(--primary-color);margin-bottom:.5rem}.percentage-score{font-size:1.8rem;color:var(--text-secondary);font-weight:600}.performance-badges{display:flex;justify-content:center;gap:1rem;flex-wrap:wrap;margin-bottom:2.5rem}.badge{padding:.75rem 1.5rem;border-radius:25px;font-size:1.1rem;font-weight:700;color:#fff}.badge.gold{background:linear-gradient(135deg,#fbbf24,#f59e0b);box-shadow:0 4px 12px #fbbf2466}.badge.silver{background:linear-gradient(135deg,#94a3b8,#64748b);box-shadow:0 4px 12px #94a3b866}.badge.bronze{background:linear-gradient(135deg,#fb923c,#f97316);box-shadow:0 4px 12px #fb923c66}.badge.participation{background:linear-gradient(135deg,#667eea,#764ba2);box-shadow:0 4px 12px #667eea66}.topic-feedback{text-align:left;margin:1.5rem auto;max-width:600px;padding:1.5rem;border-radius:12px}.topic-feedback.strengths{background:#22c55e1a;border:2px solid #22c55e}.topic-feedback.improvements{background:#f973161a;border:2px solid #f97316}.topic-feedback h3{font-size:1.2rem;margin-bottom:1rem;color:var(--text-primary)}.topic-feedback ul{list-style:none;padding:0}.topic-feedback ul li{font-size:1.05rem;color:var(--text-primary);padding:.5rem 0 .5rem 1.5rem;position:relative}.topic-feedback ul li:before{content:"•";position:absolute;left:0;font-size:1.5rem;line-height:1}.action-buttons{display:flex;gap:1rem;justify-content:center;margin:2.5rem 0;flex-wrap:wrap}.action-btn{padding:1rem 2rem;font-size:1.1rem;font-weight:700;border:none;border-radius:12px;cursor:pointer;transition:all .3s}.action-btn.primary{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;box-shadow:0 4px 12px #667eea4d}.action-btn.primary:hover{transform:translateY(-3px);box-shadow:0 6px 16px #667eea80}.action-btn.secondary{background:var(--hover-bg);color:var(--text-primary);border:2px solid var(--border-color)}.action-btn.secondary:hover{background:var(--border-color);transform:translateY(-2px)}.encouragement-message{margin-top:2rem;padding:1.5rem;background:linear-gradient(135deg,#667eea1a,#764ba21a);border-radius:12px}.encouragement-message p{font-size:1.15rem;color:var(--text-primary);font-weight:600;margin:0}@media (max-width: 768px){.final-review-page{padding:1rem}.final-review-header h1{font-size:1.75rem}.subject-cards{grid-template-columns:1fr}.quiz-question-container{padding:1.5rem}.question-text{font-size:1.15rem}.final-score{font-size:3rem}.action-buttons{flex-direction:column}.action-btn{width:100%}}.multiplication-tables-page{max-width:1200px;margin:0 auto;padding:2rem 1rem}.page-header h1{font-size:2.5rem;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:.5rem}.page-description{font-size:1.2rem;color:var(--text-secondary)}.table-selection{text-align:center}.table-selection h2{font-size:1.8rem;color:var(--text-primary);margin-bottom:1rem}.selection-hint{text-align:center;font-size:1rem;color:var(--text-secondary);margin-bottom:2rem;padding:1rem;background:#667eea1a;border-radius:8px;border-left:4px solid #667eea}.selected-tables-display{background:var(--card-bg);border:2px solid #667eea;border-radius:12px;padding:1rem;margin-bottom:1.5rem;display:flex;align-items:center;gap:1rem;flex-wrap:wrap}.selected-label{font-weight:700;color:var(--text-primary);font-size:1rem}.selected-badges{display:flex;gap:.5rem;flex-wrap:wrap;flex:1}.selected-badge{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:.5rem .75rem;border-radius:8px;font-weight:700;font-size:1rem;display:flex;align-items:center;gap:.5rem;animation:slideIn .2s ease}.remove-badge{background:#ffffff4d;border:none;color:#fff;width:20px;height:20px;border-radius:50%;cursor:pointer;font-size:1.2rem;line-height:1;display:flex;align-items:center;justify-content:center;transition:all .2s}.remove-badge:hover{background:#ffffff80;transform:rotate(90deg)}.clear-all-btn{background:#ef4444;color:#fff;border:none;padding:.5rem 1rem;border-radius:6px;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .2s}.clear-all-btn:hover{background:#dc2626;transform:translateY(-1px)}.tables-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:1rem;max-width:900px;margin:0 auto 2rem}.table-card{background:var(--card-bg);border:3px solid var(--border-color);border-radius:16px;padding:1.5rem 1rem;cursor:pointer;transition:all .3s ease;display:flex;flex-direction:column;align-items:center;gap:.5rem;position:relative}.table-card:hover{transform:translateY(-5px);border-color:var(--primary-color);box-shadow:0 8px 20px #667eea4d}.table-card.selected{background:linear-gradient(135deg,#667eea33,#764ba233);border-color:#667eea;box-shadow:0 4px 15px #667eea66}.check-mark{position:absolute;top:.5rem;right:.5rem;background:#22c55e;color:#fff;width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1rem;font-weight:700;animation:checkPop .3s ease}@keyframes checkPop{0%{transform:scale(0)}50%{transform:scale(1.2)}to{transform:scale(1)}}.table-number{font-size:2.5rem;font-weight:700;color:var(--primary-color)}.table-label{font-size:.9rem;color:var(--text-secondary);font-weight:600}.start-practice-btn{width:100%;max-width:500px;margin:0 auto;display:block;padding:1.25rem 2rem;background:linear-gradient(135deg,#10b981,#059669);color:#fff;border:none;border-radius:12px;font-size:1.25rem;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #10b98166}.start-practice-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 25px #10b98199}.start-practice-btn:disabled{background:var(--bg-tertiary);color:var(--text-tertiary);cursor:not-allowed;box-shadow:none;transform:none}.practice-section{max-width:700px;margin:0 auto}.practice-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;flex-wrap:wrap;gap:1rem}.back-btn{background:var(--input-bg);color:var(--text-primary);border:2px solid var(--border-color);border-radius:8px;padding:.75rem 1.5rem;font-weight:600;cursor:pointer;transition:all .3s ease}.back-btn:hover{border-color:var(--primary-color);color:var(--primary-color)}.practice-stats{display:flex;gap:1.5rem;flex-wrap:wrap}.stat{background:var(--card-bg);border:2px solid var(--border-color);border-radius:12px;padding:.75rem 1.25rem;display:flex;align-items:center;gap:.5rem}.stat.streak{border-color:#f59e0b;background:#f59e0b1a}.stat-value{font-size:1.2rem;font-weight:700;color:var(--primary-color)}.stat.streak .stat-value{color:#f59e0b}.stat.level-stat{border-color:var(--primary-color);background:#667eea1a}.level-progress{background:var(--card-bg);border:2px solid var(--border-color);border-radius:16px;padding:1.5rem;margin-bottom:2rem}.earned-badges{margin-top:2rem;padding:1.5rem;background:var(--card-bg);border:2px solid var(--border-color);border-radius:16px;text-align:center}.badge-item{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:1rem;background:var(--input-bg);border:2px solid var(--primary-color);border-radius:12px;min-width:100px}.question-card{background:var(--card-bg);border-radius:20px;padding:3rem 2rem;box-shadow:0 4px 20px #0000001a;text-align:center}.question-display{display:flex;justify-content:center;align-items:center;gap:2rem;margin-bottom:2.5rem;font-size:4.5rem;font-weight:700}.question-number{color:var(--primary-color);font-size:1em}.question-operator,.question-equals,.question-mark{color:var(--text-secondary);font-size:1em}.question-mark{background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.answer-form{display:flex;flex-direction:column;gap:1.5rem;max-width:400px;margin:0 auto}.answer-input{font-size:2rem;padding:1rem;text-align:center;border:3px solid var(--border-color);border-radius:12px;background:var(--input-bg);color:var(--text-primary);font-weight:700;transition:all .3s ease}.answer-input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 4px #667eea1a}.feedback-message{padding:2rem;border-radius:16px;animation:slideIn .3s ease-out}.feedback-text{font-size:1.5rem;font-weight:700;margin-bottom:1rem;color:var(--text-primary)}.correct-answer{font-size:1.2rem;color:var(--text-primary);margin-bottom:1.5rem}.check-answer-btn{padding:1rem 2rem;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:12px;font-size:1.2rem;font-weight:600;cursor:pointer;transition:all .3s ease}.check-answer-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px #667eea66}.next-question-btn{padding:1rem 2.5rem;background:var(--primary-color);color:#fff;border:none;border-radius:12px;font-size:1.1rem;font-weight:600;cursor:pointer;transition:all .3s ease}.next-question-btn:hover{transform:translateY(-2px);box-shadow:0 4px 15px #667eea4d}.progress-summary{margin-top:2rem;padding:1.5rem;background:var(--input-bg);border-radius:12px;text-align:center}.progress-summary h3{color:var(--text-primary);margin-bottom:.5rem}.progress-summary p{color:var(--text-secondary);margin:.5rem 0}.perfect-score{font-size:1.2rem;font-weight:700;color:#22c55e!important;margin-top:1rem!important}@keyframes slideIn{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 768px){.multiplication-tables-page{padding:1rem}.page-header h1{font-size:2rem}.tables-grid{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:.75rem}.table-card{padding:1rem .75rem}.table-number{font-size:2rem}.question-display{font-size:2rem;gap:1rem}.question-number{min-width:70px;padding:.75rem 1rem}.answer-input{font-size:1.5rem}.practice-header{flex-direction:column;align-items:stretch}.practice-stats{justify-content:center}}.spelling-bee-page{max-width:900px;margin:0 auto;padding:2rem}.spelling-header{text-align:center;margin-bottom:3rem}.spelling-header h1{font-size:2.5rem;color:var(--text-primary);margin-bottom:.75rem}.spelling-subtitle{font-size:1.125rem;color:var(--text-secondary)}.spelling-setup{background:var(--bg-secondary);border-radius:20px;padding:3rem;text-align:center;border:2px solid var(--border-color)}.voice-mode-toggle{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:16px;padding:1.5rem;margin-bottom:2rem;text-align:center}.voice-mode-toggle .toggle-label{display:flex;align-items:center;justify-content:center;gap:.75rem;cursor:pointer;color:#fff}.voice-mode-toggle input[type=checkbox]{width:24px;height:24px;cursor:pointer}.voice-mode-toggle .toggle-text{font-size:1.2rem;font-weight:600}.voice-mode-toggle .toggle-description{margin-top:.75rem;font-size:.95rem;color:#ffffffe6;font-style:italic}.spelling-info .voice-mode-highlight{color:#667eea;font-weight:600;background:#667eea1a;padding:.5rem;border-radius:8px;margin-top:.5rem}.difficulty-selector label{display:block;font-size:1.25rem;font-weight:700;color:var(--text-primary);margin-bottom:1.5rem}.difficulty-buttons{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;margin-bottom:2rem}.difficulty-btn{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:1.5rem;background:var(--bg-primary);border:3px solid var(--border-color);border-radius:16px;cursor:pointer;transition:all .3s ease;font-size:1.125rem;font-weight:600;color:var(--text-primary)}.difficulty-btn:hover{transform:translateY(-4px);border-color:var(--primary-color);box-shadow:0 6px 20px #22d3ee4d}.difficulty-btn.active{background:linear-gradient(135deg,#a855f733,#ec489933);border-color:#a855f7;box-shadow:0 4px 15px #a855f766}.difficulty-emoji{font-size:2.5rem}.difficulty-desc{font-size:.875rem;color:var(--text-tertiary);font-weight:400}.start-btn{padding:1.25rem 3rem;background:linear-gradient(135deg,#c2f933,#22d3ee);color:#0d0d0d;border:none;border-radius:12px;font-size:1.25rem;font-weight:800;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #c2f93366;margin-bottom:2rem}.start-btn:hover:not(:disabled){transform:translateY(-2px) scale(1.05);box-shadow:0 6px 25px #c2f93399}.start-btn:disabled{opacity:.6;cursor:not-allowed}.spelling-info{background:var(--bg-primary);padding:2rem;border-radius:12px;text-align:left;max-width:500px;margin:0 auto}.spelling-info h3{color:var(--text-primary);margin-bottom:1rem}.spelling-info ul{list-style:none;padding:0}.spelling-info li{color:var(--text-secondary);padding:.5rem 0;font-size:1rem}.spelling-game{background:var(--bg-secondary);border-radius:20px;padding:3rem;border:2px solid var(--border-color)}.game-progress{margin-bottom:2rem}.progress-text{text-align:center;font-size:1.125rem;font-weight:600;color:var(--text-primary);margin-bottom:.75rem}.progress-bar-container{height:12px;background:var(--bg-tertiary);border-radius:10px;overflow:hidden;margin-bottom:1rem;border:2px solid var(--border-color)}.progress-bar-fill{height:100%;background:linear-gradient(135deg,#a855f7,#ec4899);transition:width .5s ease;border-radius:8px}.progress-stats{display:flex;justify-content:center;gap:1.5rem;flex-wrap:wrap}.progress-stats .stat{background:var(--bg-primary);padding:.5rem 1rem;border-radius:8px;font-size:.95rem;font-weight:600;color:var(--text-primary);border:2px solid var(--border-color)}.progress-stats .stat.streak{border-color:#f59e0b;background:#f59e0b1a;color:#f59e0b}.level-progress{background:var(--bg-primary);border:2px solid var(--border-color);border-radius:16px;padding:1.5rem;margin-bottom:2rem}.progress-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.progress-label{font-size:1.2rem;font-weight:700;color:var(--text-primary)}.progress-next{font-size:.9rem;color:var(--text-secondary);font-weight:600}.progress-bar{width:100%;height:24px;background:var(--input-bg);border-radius:12px;overflow:hidden;margin-bottom:.75rem;border:2px solid var(--border-color)}.progress-fill{height:100%;transition:width .5s ease;border-radius:10px}.progress-text{text-align:center;font-size:.95rem;color:var(--text-secondary);font-weight:600}.level-up-notification{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:1000;animation:levelUpAppear .5s ease-out}.level-up-content{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:3rem 4rem;border-radius:24px;text-align:center;box-shadow:0 20px 60px #0000004d}.level-up-badge{font-size:5rem;margin-bottom:1rem;animation:badgeBounce .6s ease-out}.level-up-content h2{font-size:2.5rem;margin-bottom:.5rem;text-shadow:0 2px 10px rgba(0,0,0,.2)}.level-up-content p{font-size:1.5rem;opacity:.95}@keyframes levelUpAppear{0%{opacity:0;transform:translate(-50%,-60%)}to{opacity:1;transform:translate(-50%,-50%)}}@keyframes badgeBounce{0%,to{transform:scale(1)}50%{transform:scale(1.2)}}.word-display{display:flex;justify-content:center;gap:1rem;flex-wrap:wrap;margin-bottom:2rem}.speaker-btn{padding:1.25rem 2rem;background:linear-gradient(135deg,#0ea5e9,#3b82f6);color:#fff;border:none;border-radius:12px;font-size:1.125rem;font-weight:700;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;gap:.75rem;box-shadow:0 4px 15px #0ea5e966}.speaker-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 25px #0ea5e999}.speaker-btn:disabled{opacity:.6;cursor:not-allowed}.speaker-icon{font-size:1.5rem}.repeat-btn{padding:.75rem 1.5rem;background:var(--bg-primary);color:var(--text-primary);border:2px solid var(--border-color);border-radius:8px;font-size:.95rem;font-weight:600;cursor:pointer;transition:all .3s ease}.repeat-btn:hover:not(:disabled){border-color:var(--primary-color);transform:translateY(-1px)}.repeat-btn:disabled{opacity:.6;cursor:not-allowed}.hint-btn{padding:.75rem 1.5rem;background:#fbbf2433;color:#f59e0b;border:2px solid #f59e0b;border-radius:8px;font-size:.95rem;font-weight:600;cursor:pointer;transition:all .3s ease}.hint-btn:hover:not(:disabled){background:#fbbf244d;transform:translateY(-1px)}.hint-btn:disabled{opacity:.6;cursor:not-allowed}.hint-display{background:linear-gradient(135deg,#fbbf2426,#f59e0b26);border:3px solid #f59e0b;border-radius:16px;padding:1.5rem;margin-bottom:1.5rem;animation:slideIn .4s ease}.hint-header{display:flex;align-items:center;gap:.5rem;margin-bottom:.75rem}.hint-icon{font-size:1.5rem}.hint-title{font-size:1.1rem;font-weight:700;color:#f59e0b;text-transform:uppercase;letter-spacing:.5px}.hint-content{font-size:1.1rem;color:var(--text-primary);margin:.75rem 0;font-weight:500;line-height:1.6}.hint-note{font-size:.9rem;color:var(--text-secondary);font-style:italic;margin:.5rem 0 0}.word-insights-expandable{margin-bottom:1rem}.expand-insights-btn{width:100%;display:flex;align-items:center;gap:.75rem;padding:.875rem 1.25rem;background:linear-gradient(135deg,#667eea1a,#764ba21a);border:2px solid #667eea;border-radius:12px;cursor:pointer;transition:all .3s ease;font-size:1rem;font-weight:600;color:var(--text-primary)}.expand-insights-btn:hover{background:linear-gradient(135deg,#667eea33,#764ba233);transform:translateY(-2px);box-shadow:0 4px 8px #667eea33}.expand-icon{font-size:.875rem;color:#667eea;transition:transform .3s ease}.expand-text{flex:1;text-align:left}.expand-badge{font-size:1.2rem}.word-insights{background:var(--bg-primary);border:2px solid #667eea;border-radius:12px;padding:1.5rem;margin-top:.75rem;animation:slideDown .3s ease}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.insights-content{color:var(--text-primary)}.hint-text{font-size:1.05rem;color:var(--text-primary);background:#fbbf241a;padding:1rem;border-radius:8px;border-left:4px solid #f59e0b;margin-bottom:1rem}.insight-item{padding:.75rem;margin-bottom:.75rem;background:var(--bg-secondary);border-radius:8px;font-size:.95rem}.insight-item strong{color:var(--text-primary);display:block;margin-bottom:.25rem}.insight-item.tip{background:#22c55e1a;border-left:4px solid #22c55e}.insight-item.fun{background:#a855f71a;border-left:4px solid #a855f7}.ella-mode{display:flex;flex-direction:column;gap:1rem;align-items:center}.ella-btn{padding:1.5rem 3rem;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:16px;font-size:1.3rem;font-weight:700;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;gap:1rem;box-shadow:0 6px 20px #667eea66;animation:pulse-ella 2s infinite}@keyframes pulse-ella{0%,to{transform:scale(1);box-shadow:0 6px 20px #667eea66}50%{transform:scale(1.02);box-shadow:0 8px 30px #667eea99}}.ella-btn:hover:not(:disabled){transform:translateY(-3px);box-shadow:0 10px 40px #667eea99}.ella-btn:disabled{opacity:.6;cursor:not-allowed;animation:none}.ella-icon{font-size:1.8rem}.speaker-btn-small{padding:.75rem 1.5rem;background:#0ea5e933;color:#0ea5e9;border:2px solid #0ea5e9;border-radius:8px;font-size:.95rem;font-weight:600;cursor:pointer;transition:all .3s ease}.speaker-btn-small:hover:not(:disabled){background:#0ea5e94d;transform:translateY(-1px)}.speaker-btn-small:disabled{opacity:.6;cursor:not-allowed}.voice-chat-wrapper{position:fixed;top:0;left:0;right:0;bottom:0;z-index:1001;display:flex;background:#000000b3}.spelling-context{width:350px;background:var(--bg-primary);border-right:2px solid var(--border-color);padding:2rem;overflow-y:auto}.context-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:2px solid var(--border-color)}.context-header h3{font-size:1.3rem;color:var(--text-primary);margin:0}.close-context{background:#ef4444;color:#fff;border:none;border-radius:50%;width:32px;height:32px;font-size:1.2rem;cursor:pointer;transition:all .2s}.close-context:hover{background:#dc2626;transform:rotate(90deg)}.context-info{color:var(--text-primary)}.word-to-spell{font-size:1.1rem;padding:1rem;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-radius:12px;margin-bottom:1.5rem;text-align:center}.word-to-spell strong{display:block;font-size:.9rem;opacity:.9;margin-bottom:.5rem}.ella-instructions{font-size:1rem;margin-bottom:.75rem;color:var(--text-secondary)}.ella-prompts{list-style:none;padding:0;margin:0}.ella-prompts li{padding:.75rem;margin-bottom:.5rem;background:#667eea1a;border-left:3px solid #667eea;border-radius:6px;font-size:.95rem;color:var(--text-primary)}.spelling-form{max-width:600px;margin:0 auto}.input-container{margin-bottom:1.5rem}.spelling-input{width:100%;padding:1.25rem;font-size:1.5rem;text-align:center;border:3px solid var(--border-color);border-radius:12px;background:var(--bg-primary);color:var(--text-primary);font-weight:600;letter-spacing:2px;transition:all .3s ease}.spelling-input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #22d3ee1a}.submit-btn{width:100%;padding:1.25rem;background:linear-gradient(135deg,#10b981,#059669);color:#fff;border:none;border-radius:12px;font-size:1.25rem;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #10b98166}.submit-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 25px #10b98199}.submit-btn:disabled{opacity:.5;cursor:not-allowed}.answer-section{max-width:600px;margin:0 auto}.check-answer-btn{width:100%;padding:1.25rem;background:linear-gradient(135deg,#10b981,#059669);color:#fff;border:none;border-radius:12px;font-size:1.25rem;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #10b98166}.check-answer-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 25px #10b98199}.check-answer-btn:disabled{opacity:.5;cursor:not-allowed}.feedback-message{text-align:center;padding:2rem;border-radius:16px;animation:slideIn .3s ease}@keyframes slideIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.feedback-message.correct{background:#22c55e26;border:3px solid #22c55e}.feedback-message.incorrect{background:#f9731626;border:3px solid #f97316}.feedback-icon{font-size:4rem;margin-bottom:1rem}.feedback-text h3{font-size:1.75rem;color:var(--text-primary);margin-bottom:.75rem}.feedback-text p{font-size:1.125rem;color:var(--text-secondary);margin-bottom:.5rem}.feedback-text strong{color:var(--text-primary);font-weight:700}.user-attempt{font-style:italic;color:var(--text-tertiary);margin-top:.5rem}.user-attempt span{text-decoration:line-through;color:#ef4444}.next-question-btn{margin-top:1.5rem;padding:1rem 2.5rem;background:linear-gradient(135deg,#a855f7,#ec4899);color:#fff;border:none;border-radius:12px;font-size:1.125rem;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #a855f766}.next-question-btn:hover{transform:translateY(-2px);box-shadow:0 6px 25px #a855f799}.spelling-results{background:var(--bg-secondary);border-radius:20px;padding:3rem;border:2px solid var(--border-color)}.results-header{text-align:center;margin-bottom:2rem}.results-header h2{font-size:2.5rem;color:var(--text-primary);margin-bottom:1rem}.final-score{display:flex;align-items:center;justify-content:center;gap:.5rem;margin-bottom:1rem}.score-large{font-size:4rem;font-weight:800;background:linear-gradient(135deg,#c2f933,#22d3ee);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.score-divider{font-size:3rem;color:var(--text-tertiary)}.score-total{font-size:3rem;font-weight:700;color:var(--text-secondary)}.score-message{font-size:1.25rem;color:var(--text-primary);font-weight:600}.accuracy-badge{display:flex;align-items:center;justify-content:center;gap:.5rem;margin:1rem 0;padding:.75rem 1.5rem;background:var(--bg-primary);border-radius:12px;width:fit-content;margin-left:auto;margin-right:auto}.accuracy-label{font-size:1rem;color:var(--text-secondary);font-weight:600}.accuracy-value{font-size:1.5rem;font-weight:800;color:var(--primary-color)}.earned-badges{margin-bottom:2rem;padding:1.5rem;background:var(--bg-primary);border:2px solid var(--border-color);border-radius:16px;text-align:center}.earned-badges h3{color:var(--text-primary);margin-bottom:1rem}.badges-list{display:flex;justify-content:center;gap:1.5rem;flex-wrap:wrap}.badge-item{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:1rem;background:var(--bg-secondary);border:2px solid var(--primary-color);border-radius:12px;min-width:100px}.badge-icon{font-size:3rem}.badge-name{font-size:.9rem;font-weight:700;color:var(--primary-color)}.session-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem;margin-bottom:2rem}.stat-card{background:var(--bg-primary);border:2px solid var(--border-color);border-radius:12px;padding:1.5rem;text-align:center;display:flex;flex-direction:column;align-items:center;gap:.5rem}.stat-icon{font-size:2rem}.stat-value{font-size:1.5rem;font-weight:700;color:var(--text-primary)}.stat-label{font-size:.9rem;color:var(--text-secondary);font-weight:600}.results-list{background:var(--bg-primary);padding:2rem;border-radius:12px;margin-bottom:2rem}.results-list h3{color:var(--text-primary);margin-bottom:1rem;font-size:1.25rem}.result-item{display:flex;align-items:center;gap:1rem;padding:1rem;border-radius:8px;margin-bottom:.5rem;transition:all .2s ease}.result-item.correct{background:#10b9811a;border-left:4px solid #10b981}.result-item.incorrect{background:#ef44441a;border-left:4px solid #ef4444}.result-number{font-weight:700;color:var(--text-tertiary);min-width:2rem}.result-word{font-weight:700;color:var(--text-primary);flex:1;font-size:1.125rem}.result-user{color:var(--text-tertiary);font-style:italic;font-size:.95rem}.result-icon{font-size:1.5rem;min-width:2rem;text-align:center}.result-attempts{font-size:.85rem;color:var(--text-tertiary);font-style:italic}.results-actions{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}.btn-primary{padding:1rem 2.5rem;background:linear-gradient(135deg,#c2f933,#22d3ee);color:#0d0d0d;border:none;border-radius:12px;font-size:1.125rem;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #c2f93366}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 25px #c2f93399}.btn-secondary{padding:1rem 2.5rem;background:var(--bg-primary);color:var(--text-primary);border:2px solid var(--border-color);border-radius:12px;font-size:1.125rem;font-weight:700;cursor:pointer;transition:all .3s ease}.btn-secondary:hover{border-color:var(--primary-color);transform:translateY(-2px);box-shadow:0 4px 15px #22d3ee4d}.btn-continue{padding:1rem 2.5rem;background:linear-gradient(135deg,#a855f7,#ec4899);color:#fff;border:none;border-radius:12px;font-size:1.125rem;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #a855f766}.btn-continue:hover{transform:translateY(-2px);box-shadow:0 6px 25px #a855f799}@media (max-width: 768px){.spelling-bee-page{padding:1rem}.spelling-setup,.spelling-game,.spelling-results{padding:2rem 1.5rem}.spelling-header h1{font-size:2rem}.difficulty-buttons{grid-template-columns:1fr}.spelling-input{font-size:1.25rem}.speaker-btn{font-size:1.125rem;padding:1.25rem 2rem}.results-actions{flex-direction:column}.btn-primary,.btn-secondary,.btn-continue{width:100%}}.coding-sequences-page{max-width:1400px;margin:0 auto;padding:2rem 1rem}.back-btn{position:absolute;left:0;top:0;padding:.75rem 1.5rem;background:var(--bg-secondary);border:2px solid var(--border-color);border-radius:8px;cursor:pointer;font-size:1rem;color:var(--text-primary);transition:all .3s ease}.back-btn:hover{background:var(--card-bg);transform:translate(-4px)}.coding-header h1{font-size:2.5rem;margin-bottom:.5rem;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.coding-header p{font-size:1.2rem;color:var(--text-secondary)}.progress-bar{display:flex;justify-content:center;align-items:center;gap:1rem;margin-bottom:2rem;padding:1.5rem;background:var(--card-bg);border-radius:12px}.progress-dot{width:40px;height:40px;border-radius:50%;background:var(--bg-secondary);border:3px solid var(--border-color);display:flex;align-items:center;justify-content:center;font-weight:700;color:var(--text-secondary);transition:all .3s ease}.progress-dot.active{background:linear-gradient(135deg,#667eea,#764ba2);border-color:#667eea;color:#fff;transform:scale(1.2)}.progress-dot.completed{background:#10b981;border-color:#10b981;color:#fff}.progress-dot.completed:after{content:"✓";font-size:1.2rem}.challenge-container{background:var(--card-bg);border-radius:16px;padding:2rem;box-shadow:0 4px 6px #0000001a;margin-bottom:2rem}.challenge-info{margin-bottom:2rem}.challenge-info h2{font-size:1.8rem;margin-bottom:.5rem;color:var(--text-primary)}.challenge-info .description{font-size:1.1rem;color:var(--text-secondary);margin-bottom:1rem}.goal-box{background:linear-gradient(135deg,#667eea1a,#764ba21a);border-left:4px solid #667eea;padding:1rem;border-radius:8px;font-size:1.05rem;color:var(--text-primary)}.coding-workspace{display:grid;grid-template-columns:1fr 1fr;gap:2rem}.grid-section h3,.commands-section h3{font-size:1.3rem;margin-bottom:1rem;color:var(--text-primary)}.grid{display:grid;gap:4px;background:var(--bg-secondary);padding:8px;border-radius:12px;max-width:400px;margin:0 auto}.grid-cell{aspect-ratio:1;background:#fff;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:2rem;position:relative;transition:all .3s ease}.grid-cell.obstacle{background:#ef4444}.robot{animation:bounce .5s ease}.target{animation:pulse 1.5s ease infinite}@keyframes bounce{0%,to{transform:scale(1)}50%{transform:scale(1.2)}}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.1);opacity:.8}}.available-commands{display:grid;grid-template-columns:repeat(4,1fr);gap:.75rem;margin-bottom:1.5rem}.command-btn{padding:1.5rem;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:12px;font-size:2rem;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 8px #667eea4d}.command-btn:hover:not(:disabled){transform:translateY(-4px);box-shadow:0 6px 12px #667eea66}.command-btn:disabled{opacity:.5;cursor:not-allowed}.sequence-display{margin-bottom:1.5rem}.sequence-container{background:var(--bg-primary);border:2px dashed var(--border-color);border-radius:12px;padding:1.5rem;min-height:150px}.empty-sequence{color:var(--text-secondary);text-align:center;font-style:italic;margin:0}.sequence-list{display:flex;flex-wrap:wrap;gap:.75rem}.sequence-item{background:var(--card-bg);border:2px solid #667eea;border-radius:8px;padding:.75rem 1rem;display:flex;align-items:center;gap:.5rem}.sequence-number{background:#667eea;color:#fff;width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.85rem;font-weight:700}.sequence-command{font-size:1.5rem}.control-buttons{display:flex;gap:.75rem}.control-btn{flex:1;padding:.875rem 1.5rem;border:2px solid var(--border-color);border-radius:8px;cursor:pointer;font-size:1rem;font-weight:600;transition:all .3s ease}.control-btn.undo{background:var(--bg-secondary);color:var(--text-primary)}.control-btn.clear{background:#ef4444;color:#fff;border-color:#ef4444}.control-btn.run{background:#10b981;color:#fff;border-color:#10b981}.control-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 8px #00000026}.control-btn:disabled{opacity:.5;cursor:not-allowed}.feedback-message{margin-top:1.5rem;padding:1.5rem;border-radius:12px;text-align:center}.feedback-message.correct{background:linear-gradient(135deg,#10b9811a,#0596691a);border:2px solid #10b981}.feedback-message.incorrect{background:linear-gradient(135deg,#ef44441a,#dc26261a);border:2px solid #ef4444}.feedback-icon{font-size:3rem;margin-bottom:.5rem}.feedback-message h3{margin:.5rem 0;color:var(--text-primary)}.feedback-message p{margin:.5rem 0 1rem;color:var(--text-secondary)}.next-btn,.retry-btn{padding:.75rem 2rem;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:8px;cursor:pointer;font-size:1rem;font-weight:600;transition:all .3s ease}.retry-btn{background:#ef4444}.next-btn:hover,.retry-btn:hover{transform:translateY(-2px);box-shadow:0 6px 12px #0003}.navigation-buttons{display:flex;justify-content:space-between;align-items:center;margin-top:2rem;padding-top:2rem;border-top:2px solid var(--border-color)}.nav-btn{padding:.75rem 1.5rem;background:var(--bg-secondary);border:2px solid var(--border-color);border-radius:8px;cursor:pointer;font-size:1rem;color:var(--text-primary);transition:all .3s ease}.nav-btn:hover:not(:disabled){background:var(--card-bg);transform:scale(1.05)}.nav-btn:disabled{opacity:.3;cursor:not-allowed}.challenge-counter{font-weight:600;color:var(--text-primary)}.learning-tips{background:var(--card-bg);border-radius:16px;padding:2rem;box-shadow:0 4px 6px #0000001a}.learning-tips h3{font-size:1.8rem;margin-bottom:1.5rem;text-align:center;color:var(--text-primary)}.tips-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.5rem}.tip-card{background:var(--bg-primary);border:2px solid var(--border-color);border-radius:12px;padding:1.5rem;text-align:center;transition:all .3s ease}.tip-card:hover{transform:translateY(-4px);box-shadow:0 6px 12px #0000001a}.tip-icon{font-size:2.5rem;margin-bottom:.75rem}.tip-card h4{margin:.5rem 0;color:var(--text-primary);font-size:1.2rem}.tip-card p{margin:0;color:var(--text-secondary);font-size:.95rem;line-height:1.5}@media (max-width: 1024px){.coding-workspace{grid-template-columns:1fr}.grid{max-width:100%}}@media (max-width: 768px){.coding-sequences-page{padding:1rem}.back-btn{position:static;margin-bottom:1rem;width:100%}.coding-header h1{font-size:2rem}.progress-bar{gap:.5rem;padding:1rem}.progress-dot{width:32px;height:32px;font-size:.85rem}.challenge-container{padding:1.5rem}.available-commands{grid-template-columns:repeat(2,1fr)}.control-buttons{flex-direction:column}.navigation-buttons{flex-direction:column;gap:1rem}.tips-grid{grid-template-columns:1fr}}@media (max-width: 480px){.coding-header h1{font-size:1.75rem}.grid-cell{font-size:1.5rem}.command-btn{padding:1rem;font-size:1.5rem}}.coding-loops-page{max-width:1000px;margin:0 auto;padding:2rem}.coding-header{text-align:center;margin-bottom:2rem;position:relative}.back-btn{position:absolute;left:0;top:0;padding:.5rem 1rem;background:var(--bg-secondary);border:2px solid var(--border-color);border-radius:8px;color:var(--text-primary);cursor:pointer;transition:all .3s ease}.back-btn:hover{border-color:var(--primary-color);transform:translate(-4px)}.coding-header h1{font-size:2.5rem;margin-bottom:.5rem;color:var(--text-primary)}.progress-bar{margin-bottom:2rem;text-align:center}.progress-text{font-weight:600;color:var(--text-secondary);margin-bottom:1rem}.progress-dots{display:flex;gap:.5rem;justify-content:center}.progress-dot{width:12px;height:12px;border-radius:50%;background:var(--bg-tertiary);border:2px solid var(--border-color);transition:all .3s ease}.progress-dot.active{background:var(--primary-color);border-color:var(--primary-color);transform:scale(1.3)}.progress-dot.completed{background:#22c55e;border-color:#22c55e}.challenge-container{margin-bottom:2rem}.challenge-card{background:var(--bg-secondary);border:2px solid var(--border-color);border-radius:20px;padding:2rem;margin-bottom:2rem}.challenge-card h2{font-size:1.75rem;margin-bottom:1rem;color:var(--text-primary)}.description{font-size:1.125rem;color:var(--text-secondary);margin-bottom:1.5rem}.goal-box{background:linear-gradient(135deg,#c2f9331a,#22d3ee1a);border:2px solid var(--primary-color);border-radius:12px;padding:1rem;margin-bottom:2rem;font-size:1rem}.pattern-display,.loop-builder{margin-bottom:2rem}.pattern-display h3,.loop-builder h3{font-size:1.25rem;margin-bottom:1rem;color:var(--text-primary)}.pattern-items,.result-items{display:flex;flex-wrap:wrap;gap:.5rem;padding:1rem;background:var(--bg-tertiary);border-radius:12px;min-height:60px;align-items:center}.pattern-item,.result-item{font-size:2rem;padding:.5rem;background:var(--bg-secondary);border:2px solid var(--border-color);border-radius:8px}.loop-syntax{background:var(--bg-tertiary);border:2px solid var(--border-color);border-radius:12px;padding:1.5rem;font-family:Courier New,monospace}.loop-line{display:flex;align-items:center;gap:.5rem;margin-bottom:1rem;font-size:1.125rem}.keyword{color:#f59e0b;font-weight:700}.loop-input{width:60px;padding:.5rem;font-size:1.125rem;text-align:center;background:var(--bg-secondary);border:2px solid var(--border-color);border-radius:8px;color:var(--text-primary);font-weight:700}.loop-input:focus{outline:none;border-color:var(--primary-color)}.loop-body{display:flex;align-items:center;gap:.5rem;padding-left:2rem;font-size:1.125rem}.indent{color:var(--text-tertiary)}.command-select{padding:.5rem 1rem;font-size:1.5rem;background:var(--bg-secondary);border:2px solid var(--border-color);border-radius:8px;color:var(--text-primary);cursor:pointer}.command-select:focus{outline:none;border-color:var(--primary-color)}.result-preview{margin-top:1.5rem;padding-top:1.5rem;border-top:2px dashed var(--border-color)}.result-preview h4{margin-bottom:1rem;color:var(--text-primary)}.action-buttons{display:flex;gap:1rem;margin-top:2rem}.btn{padding:.75rem 2rem;border:none;border-radius:12px;font-size:1rem;font-weight:700;cursor:pointer;transition:all .3s ease}.btn-primary{background:linear-gradient(135deg,#c2f933,#22d3ee);color:#0d0d0d}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-secondary{background:var(--bg-tertiary);color:var(--text-primary);border:2px solid var(--border-color)}.btn-secondary:hover{border-color:var(--primary-color)}.feedback{display:flex;align-items:center;gap:1rem;padding:1.5rem;border-radius:12px;margin-top:2rem;animation:slideIn .3s ease}.feedback-correct{background:#22c55e1a;border:2px solid #22c55e}.feedback-incorrect{background:#ef44441a;border:2px solid #ef4444}.feedback-icon{font-size:2.5rem}.feedback-text{flex:1}.feedback-text strong{display:block;margin-bottom:.5rem;font-size:1.125rem}.feedback-text small{opacity:.8}.navigation-buttons{display:flex;justify-content:space-between;gap:1rem;margin-top:2rem}.btn-nav{flex:1;padding:1rem 2rem;background:var(--bg-secondary);border:2px solid var(--border-color);border-radius:12px;color:var(--text-primary);font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease}.btn-nav:hover:not(:disabled){border-color:var(--primary-color);transform:translateY(-2px)}.btn-nav:disabled{opacity:.5;cursor:not-allowed}.completion-card{background:linear-gradient(135deg,#c2f9331a,#22d3ee1a);border:3px solid var(--primary-color);border-radius:20px;padding:3rem;text-align:center;margin-top:2rem;animation:slideIn .5s ease}.completion-card h2{font-size:2rem;margin-bottom:1rem}.completion-card p{font-size:1.25rem;margin-bottom:2rem;color:var(--text-secondary)}.learning-tip{background:var(--bg-secondary);border:2px solid var(--border-color);border-radius:20px;padding:2rem;margin-top:2rem}.learning-tip h3{font-size:1.5rem;margin-bottom:1rem;color:var(--text-primary)}.learning-tip p{font-size:1.125rem;line-height:1.6;color:var(--text-secondary);margin-bottom:1.5rem}.tip-example{display:grid;grid-template-columns:1fr 1fr;gap:2rem;margin-top:1.5rem}.tip-bad,.tip-good{padding:1.5rem;border-radius:12px}.tip-bad{background:#ef44441a;border:2px solid #ef4444}.tip-good{background:#22c55e1a;border:2px solid #22c55e}.tip-bad strong,.tip-good strong{display:block;margin-bottom:1rem;font-size:1.125rem}.tip-bad code,.tip-good code{display:block;padding:1rem;background:var(--bg-tertiary);border-radius:8px;font-family:Courier New,monospace;line-height:1.6}@media (max-width: 768px){.coding-loops-page{padding:1rem}.coding-header h1{font-size:2rem}.back-btn{position:static;margin-bottom:1rem;width:100%}.tip-example{grid-template-columns:1fr;gap:1rem}.action-buttons{flex-direction:column}.loop-line{flex-wrap:wrap}}[data-theme=light] .challenge-card{background:#fff}.block-coding-container{display:grid;grid-template-columns:1fr 2fr;gap:2rem;margin:2rem 0}.block-palette{background:linear-gradient(135deg,#f0f9ff,#e0f2fe);padding:1.5rem;border-radius:12px;box-shadow:0 2px 10px #0000000d}.block-palette h3{margin-top:0;margin-bottom:1.5rem;color:#0f172a}.block-category{margin-bottom:1.5rem}.block-category h4{margin:0 0 .75rem;font-size:1rem;color:#475569}.code-block{padding:.75rem 1rem;margin-bottom:.5rem;border-radius:8px;cursor:pointer;font-family:Courier New,monospace;font-weight:600;transition:all .2s ease;position:relative;-webkit-user-select:none;user-select:none}.code-block:hover{transform:translate(4px);box-shadow:0 4px 12px #00000026}.motion-block{background:linear-gradient(135deg,#60a5fa,#3b82f6);color:#fff}.looks-block{background:linear-gradient(135deg,#a78bfa,#8b5cf6);color:#fff}.control-block{background:linear-gradient(135deg,#fb923c,#f97316);color:#fff}.block-workspace{background:linear-gradient(135deg,#fefce8,#fef3c7);padding:1.5rem;border-radius:12px;box-shadow:0 2px 10px #0000000d;min-height:400px}.block-workspace h3{margin-top:0;margin-bottom:1.5rem;color:#0f172a}.workspace-empty{text-align:center;padding:3rem;color:#94a3b8;font-style:italic}.workspace-blocks{margin-bottom:1.5rem}.workspace-blocks .code-block{cursor:default;margin-bottom:.5rem;display:flex;justify-content:space-between;align-items:center}.remove-block-btn{background:#0003;border:none;color:#fff;width:24px;height:24px;border-radius:50%;cursor:pointer;font-size:1.2rem;line-height:1;transition:all .2s ease}.remove-block-btn:hover{background:#0006;transform:scale(1.1)}.workspace-actions{display:flex;gap:1rem;margin-top:1.5rem}@media (max-width: 768px){.block-coding-container{grid-template-columns:1fr}}.pixel-art-container{display:grid;grid-template-columns:1fr 1fr;gap:2rem;margin:2rem 0}.pixel-grid-section h3{margin-top:0;margin-bottom:1rem;text-align:center}.pixel-grid{display:grid;gap:2px;margin:0 auto;background:#e2e8f0;padding:2px;border-radius:8px;box-shadow:0 4px 12px #0000001a}.pixel-cell{width:50px;height:50px;position:relative;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.pixel-cell:hover{transform:scale(1.05);box-shadow:0 2px 8px #0003}.pixel-coord{font-size:.7rem;color:#64748b;opacity:.5;transition:opacity .2s ease}.pixel-cell:hover .pixel-coord{opacity:1}.color-palette{margin:2rem 0;text-align:center}.color-palette h3{margin-bottom:1rem}.palette-colors{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}.color-btn{width:60px;height:60px;border-radius:12px;border:3px solid transparent;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;position:relative;box-shadow:0 2px 8px #00000026}.color-btn:hover{transform:scale(1.1);box-shadow:0 4px 12px #00000040}.color-btn.selected{border-color:#0f172a;box-shadow:0 0 0 4px #0f172a33;transform:scale(1.15)}.selected-indicator{position:absolute;top:-8px;right:-8px;background:#0f172a;color:#fff;width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.875rem}.grid-cell{width:60px;height:60px;border:2px solid #cbd5e1;display:flex;align-items:center;justify-content:center;background:#f8fafc;transition:all .2s ease}.grid-cell:hover{background:#e2e8f0;transform:scale(1.05)}@media (max-width: 768px){.pixel-art-container{grid-template-columns:1fr}.pixel-cell{width:40px;height:40px}.grid-cell{width:50px;height:50px}}.stem-builder-page{min-height:100vh;background:linear-gradient(135deg,#1e293b,#0f172a);padding:2rem;color:#fff;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.stem-header{text-align:center;margin-bottom:2rem;position:relative}.stem-header h1{font-size:3rem;margin-bottom:.5rem;background:linear-gradient(to right,#60a5fa,#a78bfa);-webkit-background-clip:text;-webkit-text-fill-color:transparent;text-shadow:0 2px 10px rgba(0,0,0,.3)}.stem-header .subtitle{font-size:1.3rem;color:#94a3b8}.back-to-map-btn{position:absolute;left:0;top:50%;transform:translateY(-50%);background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:#fff;padding:.5rem 1rem;border-radius:8px;cursor:pointer;transition:all .2s}.back-to-map-btn:hover{background:#fff3}.mission-map-container{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:2rem;padding:2rem}.mission-card{background:#1e293bcc;border:2px solid #334155;border-radius:20px;padding:2rem;display:flex;flex-direction:column;align-items:center;text-align:center;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.mission-card:hover{transform:translateY(-5px);border-color:#60a5fa;box-shadow:0 10px 30px #60a5fa33}.mission-card.locked{opacity:.6;cursor:not-allowed;filter:grayscale(.8)}.mission-card.completed{border-color:#10b981;background:#10b9811a}.mission-icon{font-size:4rem;margin-bottom:1rem;transition:transform .3s}.mission-card:hover .mission-icon{transform:scale(1.1)}.mission-title{font-size:1.2rem;font-weight:700;margin-bottom:.5rem;color:#f1f5f9}.mission-concept{font-size:.9rem;color:#94a3b8;background:#0000004d;padding:.3rem .8rem;border-radius:12px}.mission-status-badge{position:absolute;top:1rem;right:1rem;font-size:1.2rem}.concept-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000c;display:flex;justify-content:center;align-items:center;z-index:1000;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.concept-card{background:#fff;color:#1e293b;width:90%;max-width:600px;border-radius:24px;padding:3rem;text-align:center;position:relative;box-shadow:0 25px 50px -12px #00000080;animation:slide-up .4s ease-out}@keyframes slide-up{0%{transform:translateY(50px);opacity:0}to{transform:translateY(0);opacity:1}}.concept-card h2{font-size:2.5rem;color:#3b82f6;margin-bottom:1rem}.concept-card .concept-icon{font-size:5rem;margin:1rem 0;display:block}.concept-card p{font-size:1.2rem;line-height:1.6;color:#475569;margin-bottom:2rem}.start-mission-btn{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border:none;padding:1rem 3rem;font-size:1.2rem;font-weight:700;border-radius:50px;cursor:pointer;transition:transform .2s;box-shadow:0 4px 15px #2563eb4d}.start-mission-btn:hover{transform:scale(1.05)}.mission-workspace{display:grid;grid-template-columns:180px 1fr 280px;gap:1rem;height:calc(100vh - 150px);max-width:1800px;margin:0 auto}.toolbox-panel{background:#1e293b;border-radius:16px;padding:1rem;border:1px solid #334155;overflow-y:auto}.toolbox-panel h3{font-size:.95rem;margin-bottom:.75rem}.toolbox-item{background:#334155;border:2px solid #475569;border-radius:10px;padding:.75rem;margin-bottom:.75rem;cursor:grab;display:flex;flex-direction:column;align-items:center;transition:all .2s}.toolbox-item:hover{border-color:#60a5fa;background:#475569}.toolbox-item span{font-size:1.75rem;margin-bottom:.35rem}.toolbox-item label{font-size:.8rem}.workbench-panel{background:#f8fafc;border-radius:16px;position:relative;overflow:hidden;border:4px solid #334155}.circuit-workbench{width:100%;height:100%;position:relative;background-image:linear-gradient(#e2e8f0 1px,transparent 1px),linear-gradient(90deg,#e2e8f0 1px,transparent 1px);background-size:40px 40px;min-height:500px}.circuit-component{position:absolute;width:60px;height:60px;background:#fff;border:3px solid #cbd5e1;border-radius:12px;display:flex;align-items:center;justify-content:center;cursor:move;transition:all .2s;box-shadow:0 2px 8px #00000026}.circuit-component:hover{border-color:#60a5fa;box-shadow:0 4px 12px #60a5fa4d;z-index:10}.circuit-component.powered{border-color:#fbbf24;background:#fffbeb;animation:pulse 1s infinite}.circuit-component.connecting{border-color:#3b82f6;box-shadow:0 0 0 4px #3b82f633}.component-icon-display{font-size:2rem;pointer-events:none}.component-remove-btn{position:absolute;top:-8px;right:-8px;width:24px;height:24px;background:#ef4444;border:2px solid white;border-radius:50%;color:#fff;font-size:1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s;z-index:5}.circuit-component:hover .component-remove-btn{opacity:1}.connections-layer{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.connections-layer line{pointer-events:all}@keyframes pulse{0%,to{box-shadow:0 0 #fbbf2466}50%{box-shadow:0 0 0 8px #fbbf2400}}.animation-panel{background:#1e293b;border-radius:16px;border:1px solid #334155;display:flex;flex-direction:column;overflow:hidden}.animation-display{flex:1;background:#0f172a;position:relative;overflow:hidden;border-bottom:1px solid #334155;display:flex;justify-content:center;align-items:center;min-height:200px}.animation-controls{padding:1rem;background:#1e293b}.mission-goal{background:#3b82f61a;border:1px solid rgba(59,130,246,.2);padding:.75rem;border-radius:8px;margin-bottom:.75rem}.mission-goal h3{color:#60a5fa;margin-bottom:.35rem;font-size:.9rem}.mission-goal p{font-size:.85rem;color:#cbd5e1;line-height:1.4}.power-button,.reset-button,.hint-button{width:100%;padding:.65rem .75rem;font-size:.95rem;font-weight:700;border:none;border-radius:8px;cursor:pointer;transition:all .2s;margin-bottom:.6rem}.power-button{background:linear-gradient(135deg,#10b981,#059669);color:#fff}.power-button:hover{background:linear-gradient(135deg,#059669,#047857)}.power-button.active{background:linear-gradient(135deg,#ef4444,#dc2626)}.reset-button{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff}.reset-button:hover{background:linear-gradient(135deg,#d97706,#b45309)}.hint-button{background:linear-gradient(135deg,#8b5cf6,#7c3aed);color:#fff}.hint-button:hover{background:linear-gradient(135deg,#7c3aed,#6d28d9)}.status-message{background:#3b82f61a;border:1px solid rgba(59,130,246,.3);padding:.6rem;border-radius:8px;text-align:center;color:#60a5fa;font-weight:500;margin-top:.75rem;font-size:.9rem;line-height:1.3}.anim-scene{width:100%;height:100%;position:relative}.car-track{position:absolute;bottom:20%;left:0;width:100%;height:4px;background:#475569}.anim-car{position:absolute;bottom:20%;left:10%;font-size:3rem;transition:left 2s linear}.anim-car.moving{left:80%;animation:car-bounce .5s infinite}@keyframes car-bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-2px)}}.anim-fan{font-size:5rem;color:#cbd5e1}.anim-fan.spinning{animation:spin .5s linear infinite;color:#60a5fa}.anim-bulb{font-size:5rem;color:#475569;transition:all .3s}.anim-bulb.lit{color:#fbbf24;filter:drop-shadow(0 0 30px #fbbf24);transform:scale(1.1)}.anim-house{font-size:6rem;position:relative}.anim-house .windows{position:absolute;top:40%;left:20%;width:60%;height:30%;background:#1e293b;transition:background .5s}.anim-house.lit .windows{background:#fbbf24;box-shadow:0 0 20px #fbbf24}.connections-layer line{cursor:pointer;transition:stroke-width .2s}.connections-layer line:hover{stroke-width:10!important;filter:brightness(1.2)}.vault-container{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center}.vault-background{position:relative;width:280px;height:320px;background:linear-gradient(135deg,#475569,#334155);border-radius:20px;border:8px solid #1e293b;box-shadow:0 10px 40px #00000080;display:flex;align-items:center;justify-content:center;overflow:hidden}.vault-door{width:240px;height:280px;background:linear-gradient(135deg,#64748b,#475569);border-radius:12px;border:6px solid #94a3b8;position:relative;display:flex;align-items:center;justify-content:center;transition:transform 1s ease-in-out;transform-origin:left center;box-shadow:inset 0 4px 20px #0006}.vault-door.open{transform:perspective(600px) rotateY(-120deg);box-shadow:0 10px 30px #0009}.vault-lock{font-size:5rem;position:absolute;z-index:2;transition:all .5s}.vault-door.open .vault-lock{transform:scale(.7);opacity:.5}.vault-handle{position:absolute;right:20px;width:40px;height:40px;background:#fbbf24;border-radius:50%;border:4px solid #f59e0b;box-shadow:0 4px 10px #0000004d}.vault-treasure{position:absolute;font-size:4rem;animation:treasure-glow 1.5s ease-in-out infinite;z-index:1}@keyframes treasure-glow{0%,to{transform:scale(1);filter:drop-shadow(0 0 10px #fbbf24)}50%{transform:scale(1.1);filter:drop-shadow(0 0 20px #fbbf24)}}@media (max-width: 1024px){.mission-workspace{grid-template-columns:1fr;grid-template-rows:auto 400px auto;height:auto}.toolbox-panel{display:flex;gap:1rem;overflow-x:auto;padding:1rem}.toolbox-item{min-width:100px;margin-bottom:0}.animation-panel{min-height:300px}}@media (max-width: 768px){.stem-builder-page{padding:1rem}.stem-header h1{font-size:2rem}.stem-header .subtitle{font-size:1rem}.back-to-map-btn{position:relative;left:auto;top:auto;transform:none;margin-bottom:1rem;display:block;width:100%;text-align:center}.mission-map-container{grid-template-columns:1fr;gap:1rem;padding:1rem}.mission-card{padding:1.5rem}.mission-icon{font-size:3rem}.concept-card{width:95%;padding:2rem 1.5rem;max-height:85vh;overflow-y:auto}.concept-card h2{font-size:1.8rem}.concept-card .concept-icon{font-size:3.5rem}.concept-card p{font-size:1rem}.start-mission-btn{width:100%;padding:1rem 2rem;font-size:1.1rem}.mission-workspace{grid-template-columns:1fr;grid-template-rows:auto auto 1fr;gap:1rem;height:auto}.toolbox-panel{order:1;display:block!important;padding:.75rem;-webkit-overflow-scrolling:touch}.toolbox-panel h3{display:none}.toolbox-panel>div[style*=margin-bottom]{display:none!important}.toolbox-panel>div[style*=maxHeight]{display:flex!important;flex-direction:row!important;overflow-x:auto!important;overflow-y:hidden!important;gap:.75rem!important;padding:.5rem 0!important;max-height:none!important;scroll-snap-type:x mandatory}.toolbox-item{min-width:85px!important;max-width:85px!important;padding:.75rem!important;margin-bottom:0!important;flex-shrink:0!important;scroll-snap-align:start}.toolbox-item span{font-size:2.5rem!important}.toolbox-item label{font-size:.7rem!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}.animation-panel{order:2;min-height:200px;max-height:280px}.animation-display{min-height:140px;max-height:180px}.animation-controls{padding:.75rem;max-height:100px;overflow-y:auto}.mission-goal{padding:.5rem}.mission-goal h3{font-size:.85rem;margin-bottom:.25rem}.mission-goal p{font-size:.75rem;line-height:1.3}.workbench-panel{order:3;min-height:450px;max-height:550px;border:3px solid #334155}.circuit-workbench{min-height:450px!important;max-height:550px!important}.circuit-component{width:70px!important;height:70px!important;touch-action:none}.circuit-component .component-icon-display{font-size:2.5rem!important}.component-remove-btn{width:28px!important;height:28px!important;font-size:1.2rem!important}.connections-layer line{stroke-width:8!important}.connections-layer line:hover,.connection-active{stroke-width:10!important}.power-button,.reset-button,.hint-button{width:100%;padding:.875rem!important;font-size:1rem!important;margin-bottom:.5rem!important;border-radius:10px!important}.status-message{font-size:.9rem!important;padding:.5rem!important;margin-top:.5rem!important;line-height:1.3!important}.vault-background{width:200px;height:240px}.vault-door{width:170px;height:210px}.vault-lock{font-size:3.5rem}.vault-treasure{font-size:3rem}}@media (max-width: 375px){.stem-header h1{font-size:1.75rem}.mission-card{padding:1rem}.mission-icon{font-size:2.5rem}.toolbox-item{min-width:80px;max-width:80px;padding:.5rem}.toolbox-item span{font-size:2rem}.circuit-component{width:60px!important;height:60px!important}.circuit-component .component-icon-display{font-size:2rem!important}.workbench-panel{min-height:450px}.animation-panel{min-height:220px;max-height:250px}.vault-background{width:160px;height:200px}.vault-door{width:140px;height:170px}.vault-lock{font-size:2.5rem}}@media (max-width: 896px) and (orientation: landscape){.mission-workspace{grid-template-columns:180px 1fr 250px;grid-template-rows:1fr;gap:.75rem;height:calc(100vh - 120px)}.toolbox-panel{order:1;display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden}.toolbox-item{min-width:auto;max-width:none;margin-bottom:.5rem}.animation-panel{order:3;min-height:auto;max-height:none}.workbench-panel{order:2;min-height:auto}.animation-display{min-height:auto}}@media (hover: none) and (pointer: coarse){.toolbox-item:active{transform:scale(.95);background:#60a5fa}.circuit-component:active{transform:scale(1.05)}.mission-card:active,button:active{transform:scale(.98)}}.circuit-builder-page{min-height:100vh;background:linear-gradient(135deg,#667eea,#764ba2);padding:2rem}.circuit-header{text-align:center;color:#fff;margin-bottom:2rem}.circuit-header h1{font-size:3rem;margin-bottom:.5rem;text-shadow:0 2px 10px rgba(0,0,0,.3)}.circuit-header .subtitle{font-size:1.3rem;opacity:.95}.circuit-game-container{display:grid;grid-template-columns:200px 1fr 300px;gap:1.5rem;max-width:1600px;margin:0 auto;height:75vh}.circuit-toolbox{background:#fff;border-radius:20px;padding:1.5rem;box-shadow:0 8px 30px #0003;overflow-y:auto}.circuit-toolbox h2{font-size:1.4rem;color:#6366f1;margin-bottom:.5rem}.toolbox-hint{font-size:.85rem;color:#64748b;margin-bottom:1rem}.component-library{display:flex;flex-direction:column;gap:.75rem}.toolbox-component{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:1rem;background:linear-gradient(135deg,#f8fafc,#e2e8f0);border:2px solid #cbd5e1;border-radius:15px;cursor:pointer;transition:all .2s ease}.toolbox-component:hover{transform:translateY(-3px) scale(1.05);border-color:#6366f1;box-shadow:0 4px 15px #6366f14d}.toolbox-component .component-icon{font-size:2.5rem}.toolbox-component .component-label{font-size:.85rem;font-weight:600;color:#475569;text-align:center}.circuit-workbench-container{background:#fff;border-radius:20px;padding:1rem;box-shadow:0 8px 30px #0003;overflow:hidden}.circuit-workbench{position:relative;width:100%;height:100%;background:repeating-linear-gradient(0deg,#f1f5f9 0px,#f1f5f9 1px,transparent 1px,transparent 40px),repeating-linear-gradient(90deg,#f1f5f9 0px,#f1f5f9 1px,transparent 1px,transparent 40px);background-color:#fff;border-radius:15px;border:3px dashed #cbd5e1;transition:all .5s ease}.circuit-workbench.powered{background:repeating-linear-gradient(0deg,#fef9e7 0px,#fef9e7 1px,transparent 1px,transparent 40px),repeating-linear-gradient(90deg,#fef9e7 0px,#fef9e7 1px,transparent 1px,transparent 40px);background-color:#fffef9;border-color:#fbbf24;box-shadow:inset 0 0 60px #fbbf241a,0 8px 30px #fbbf2433}.connections-layer{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:1}.connections-layer line{stroke-width:6;stroke:#3b82f6;stroke-linecap:round;transition:all .3s ease;filter:drop-shadow(0 2px 4px rgba(59,130,246,.3))}.connection-active{stroke:#fbbf24!important;stroke-width:8;filter:drop-shadow(0 0 12px #fbbf24) drop-shadow(0 0 20px #fbbf24);animation:pulse-line 1s ease-in-out infinite}@keyframes pulse-line{0%,to{opacity:1}50%{opacity:.6}}.circuit-component{position:absolute;width:60px;height:60px;background:#fff;border:3px solid #64748b;border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease;z-index:2;box-shadow:0 2px 8px #0000001a}.circuit-component:hover{transform:scale(1.1);border-color:#6366f1;box-shadow:0 4px 15px #6366f166}.circuit-component:hover:before,.circuit-component:hover:after{background:#6366f1;box-shadow:0 0 0 2px #6366f1,0 0 12px #6366f1cc;transform:translate(-50%) scale(1.3)}.circuit-component.connecting{border-color:#10b981;border-width:4px;animation:pulse-connect .8s ease-in-out infinite;box-shadow:0 0 0 4px #10b9814d,0 4px 15px #10b98199}.circuit-component.connecting:before,.circuit-component.connecting:after{background:#10b981;box-shadow:0 0 0 2px #10b981,0 0 16px #10b981;animation:pulse-connection-point .8s ease-in-out infinite}@keyframes pulse-connection-point{0%,to{transform:translate(-50%) scale(1)}50%{transform:translate(-50%) scale(1.5)}}@keyframes pulse-connect{0%,to{transform:scale(1)}50%{transform:scale(1.15)}}.component-icon-display{font-size:2rem}.component-remove-btn{position:absolute;top:-8px;right:-8px;width:20px;height:20px;background:#ef4444;color:#fff;border:2px solid white;border-radius:50%;font-size:10px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:100;transition:all .2s ease;opacity:0;transform:scale(0);pointer-events:none}.circuit-component:hover .component-remove-btn{opacity:1;transform:scale(1);pointer-events:auto}.component-remove-btn:hover{background:#dc2626;transform:scale(1.2);box-shadow:0 2px 8px #ef444466}.component-icon-display{cursor:pointer;pointer-events:auto}.circuit-component.bulb.powered{background:radial-gradient(circle,#fffbeb,#fef3c7 40%,#fff);border-color:#fbbf24;box-shadow:0 0 30px #fbbf24e6,0 0 60px #fbbf2499,0 0 90px #fbbf244d}.circuit-component.bulb.powered .component-icon-display{animation:glow-bulb .8s ease-in-out infinite;filter:drop-shadow(0 0 20px #fbbf24) drop-shadow(0 0 40px #fde68a) brightness(1.8);font-size:2.5rem}@keyframes glow-bulb{0%,to{opacity:1;transform:scale(1.1);filter:drop-shadow(0 0 20px #fbbf24) drop-shadow(0 0 40px #fde68a) brightness(1.8)}50%{opacity:.95;transform:scale(1.15);filter:drop-shadow(0 0 30px #fbbf24) drop-shadow(0 0 60px #fde68a) brightness(2)}}.circuit-component.motor.powered .component-icon-display{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.circuit-component.buzzer.powered{animation:shake .3s ease-in-out infinite}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-2px)}75%{transform:translate(2px)}}.circuit-component.battery.powered{border-color:#10b981;background:linear-gradient(135deg,#d1fae5,#a7f3d0)}.switch-state{font-size:.6rem;font-weight:700;color:#64748b;margin-top:.2rem}.circuit-component.switch.switch-on{background:linear-gradient(135deg,#dcfce7,#bbf7d0);border-color:#10b981}.circuit-component.switch.switch-on .switch-state{color:#10b981}.workbench-empty-state{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;color:#94a3b8;font-size:1.1rem;line-height:1.8}.circuit-instructions{background:#fff;border-radius:20px;padding:1.5rem;box-shadow:0 8px 30px #0003;overflow-y:auto;display:flex;flex-direction:column;gap:1.5rem}.mission-info h2{font-size:1.3rem;color:#6366f1;margin-bottom:.75rem}.mission-instructions{font-size:1rem;color:#475569;line-height:1.6;margin-bottom:1rem}.required-components{background:#f1f5f9;padding:1rem;border-radius:10px;font-size:.9rem}.required-components strong{color:#334155;display:block;margin-bottom:.5rem}.required-list{display:flex;flex-wrap:wrap;gap:.5rem}.required-chip{background:#fff;padding:.4rem .8rem;border-radius:15px;font-size:.85rem;border:2px solid #cbd5e1;display:inline-flex;align-items:center;gap:.3rem}.circuit-status{background:#f8fafc;padding:1rem;border-radius:12px;border:2px solid #e2e8f0}.status-indicator{font-size:1.2rem;font-weight:700;text-align:center;padding:.75rem;border-radius:10px;margin-bottom:.75rem}.status-indicator.off{background:#e2e8f0;color:#64748b}.status-indicator.on{background:linear-gradient(135deg,#fef3c7,#fde68a);color:#92400e;animation:pulse-status 1.5s ease-in-out infinite}@keyframes pulse-status{0%,to{box-shadow:0 0 #fbbf24b3}50%{box-shadow:0 0 0 10px #fbbf2400}}.status-message{font-size:.95rem;color:#475569;text-align:center;min-height:2rem;display:flex;align-items:center;justify-content:center}.mission-complete-badge{background:linear-gradient(135deg,#10b981,#059669);color:#fff;padding:1rem;border-radius:10px;text-align:center;font-size:1.2rem;font-weight:700;margin-top:.75rem;animation:celebrate .6s ease-in-out}@keyframes celebrate{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.circuit-controls{display:flex;flex-direction:column;gap:.75rem}.power-button,.reset-button,.next-mission-button{padding:1rem;border:none;border-radius:12px;font-size:1rem;font-weight:700;cursor:pointer;transition:all .2s ease}.power-button{background:linear-gradient(135deg,#10b981,#059669);color:#fff;box-shadow:0 4px 15px #10b9814d}.power-button.on{background:linear-gradient(135deg,#ef4444,#dc2626);box-shadow:0 4px 15px #ef44444d}.power-button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #10b98166}.reset-button{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff;box-shadow:0 4px 15px #f59e0b4d}.reset-button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #f59e0b66}.next-mission-button{background:linear-gradient(135deg,#6366f1,#4f46e5);color:#fff;box-shadow:0 4px 15px #6366f14d}.next-mission-button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #6366f166}.help-tips{background:#fef3c7;padding:1rem;border-radius:10px;border:2px solid #fde68a}.help-tips h3{font-size:1rem;color:#92400e;margin-bottom:.5rem}.help-tips ul{font-size:.85rem;color:#78350f;line-height:1.6;padding-left:1.2rem;margin:0}.help-tips li{margin-bottom:.25rem}@media (max-width: 1200px){.circuit-game-container{grid-template-columns:180px 1fr 280px;gap:1rem}.toolbox-component .component-icon{font-size:2rem}}@media (max-width: 968px){.circuit-game-container{grid-template-columns:1fr;grid-template-rows:auto 1fr auto;height:auto}.circuit-workbench-container{min-height:500px;order:2}.circuit-toolbox{order:1}.circuit-instructions{order:3}.component-library{flex-direction:row;flex-wrap:wrap}.toolbox-component{flex:0 0 calc(33.333% - .5rem)}}@media (max-width: 640px){.circuit-builder-page{padding:1rem}.circuit-header h1{font-size:2rem}.circuit-header .subtitle{font-size:1rem}.circuit-workbench-container{min-height:400px}.circuit-component{width:50px;height:50px}.component-icon-display{font-size:1.5rem}.toolbox-component{flex:0 0 calc(50% - .375rem)}}.science-lab-page{max-width:1200px;margin:0 auto;padding:2rem;min-height:80vh}.science-header{text-align:center;margin-bottom:3rem;background:linear-gradient(135deg,#3b82f6,#2563eb);padding:3rem;border-radius:20px;color:#fff;box-shadow:0 10px 25px #2563eb33}.science-header h1{font-size:3rem;margin-bottom:1rem;text-shadow:2px 2px 4px rgba(0,0,0,.2)}.science-subtitle{font-size:1.5rem;opacity:.9}.levels-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;padding:1rem}.level-card{background:#fff;border-radius:20px;padding:2rem;text-align:center;transition:all .3s ease;border:2px solid #e2e8f0;cursor:pointer;position:relative;overflow:hidden;text-decoration:none;color:inherit;display:block}.level-card:hover{transform:translateY(-10px);box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;border-color:#3b82f6}.level-badge{position:absolute;top:1rem;right:1rem;background:#dbeafe;color:#1e40af;padding:.5rem 1rem;border-radius:9999px;font-weight:700;font-size:.875rem}.level-icon{font-size:5rem;margin-bottom:1.5rem;display:inline-block;filter:drop-shadow(0 4px 6px rgba(0,0,0,.1))}.level-title{font-size:1.8rem;font-weight:800;color:#1e293b;margin-bottom:1rem}.level-description{color:#64748b;font-size:1.1rem;line-height:1.6;margin-bottom:2rem}.level-features{text-align:left;background:#f8fafc;padding:1.5rem;border-radius:12px;margin-bottom:1.5rem}.level-features h4{color:#475569;margin-bottom:.5rem;font-size:.9rem;text-transform:uppercase;letter-spacing:.05em}.level-features ul{list-style:none;padding:0;margin:0}.level-features li{margin-bottom:.5rem;padding-left:1.5rem;position:relative;color:#334155}.level-features li:before{content:"✓";position:absolute;left:0;color:#22c55e;font-weight:700}.start-btn{background:#3b82f6;color:#fff;padding:1rem 2rem;border-radius:12px;font-weight:700;font-size:1.1rem;border:none;width:100%;transition:background .2s}.level-card:hover .start-btn{background:#2563eb}.level-card.locked{opacity:.7;cursor:not-allowed;filter:grayscale(1)}.level-card.locked:hover{transform:none;box-shadow:none;border-color:#e2e8f0}.grade1-home-page{max-width:1200px;margin:0 auto;padding:2rem 1rem}.grade-header{text-align:center;margin-bottom:3rem}.grade-header h1{font-size:2.5rem;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:1rem}.grade-header p{font-size:1.2rem;color:var(--text-secondary)}.grade-sections{display:flex;flex-direction:column;gap:3rem}.grade-section{background:var(--card-bg);border-radius:16px;padding:2rem;box-shadow:0 4px 6px #0000001a}.section-title{font-size:1.8rem;color:var(--text-primary);margin-bottom:.5rem}.section-description{font-size:1.1rem;color:var(--text-secondary);margin-bottom:1.5rem}.grade-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.5rem}.grade-card{background:var(--input-bg);border:2px solid var(--border-color);border-radius:12px;padding:1.5rem;text-decoration:none;color:var(--text-primary);transition:all .3s;display:flex;flex-direction:column}.grade-card:hover{border-color:var(--primary-color);transform:translateY(-5px);box-shadow:0 8px 16px #667eea33}.grade-card-icon{font-size:3rem;margin-bottom:1rem}.grade-card h3{font-size:1.3rem;color:var(--text-primary);margin-bottom:.5rem}.grade-card p{font-size:1rem;color:var(--text-secondary);margin-bottom:1rem;flex-grow:1}.grade-badge{display:inline-block;padding:.5rem 1rem;background:var(--primary-color);color:#fff;border-radius:20px;font-size:.85rem;font-weight:600;align-self:flex-start}.grade-card.highlighted{border-color:var(--primary-color);background:#667eea0d}.grade-card.featured{grid-column:span 2}.grade-badge.special{background:linear-gradient(135deg,#f093fb,#f5576c)}.feature-list{list-style:none;padding:0;margin:1rem 0}.feature-list li{padding:.3rem 0;color:var(--text-secondary);font-size:.95rem}.feature-list li:before{content:"✓ ";color:var(--primary-color);font-weight:700;margin-right:.5rem}.learning-path{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:16px;padding:2rem;margin-top:3rem;color:#fff}.learning-path h3{font-size:1.5rem;margin-bottom:1.5rem;text-align:center}.path-steps{display:flex;flex-direction:column;gap:1rem}.path-step{display:flex;align-items:center;gap:1rem;background:#ffffff1a;padding:1rem 1.5rem;border-radius:10px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.step-number{width:40px;height:40px;background:#fff;color:var(--primary-color);border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.2rem;flex-shrink:0}@media (max-width: 768px){.grade-header h1{font-size:2rem}.grade-cards{grid-template-columns:1fr}.grade-card.featured{grid-column:span 1}.path-steps{flex-direction:column}}.grade3-home-page{max-width:1200px;margin:0 auto;padding:2rem 1rem}.placeholder-page{display:flex;align-items:center;justify-content:center;min-height:50vh}.placeholder-content{text-align:center;padding:3rem;background:#fff;border-radius:12px;box-shadow:0 4px 6px #0000001a;max-width:600px}.placeholder-content h1{font-size:2rem;color:#1f2937;margin-bottom:1rem}.placeholder-message{font-size:1.5rem;color:#6b7280;margin-bottom:1rem}.placeholder-subtitle{font-size:1.125rem;color:#9ca3af;line-height:1.6}@media (max-width: 768px){.placeholder-content{padding:2rem}.placeholder-content h1{font-size:1.5rem}.placeholder-message{font-size:1.25rem}.placeholder-subtitle{font-size:1rem}}.my-courses-page{max-width:1200px;margin:0 auto;padding:2rem}.page-header h1{font-size:2.5rem;font-weight:800;color:var(--text-primary);margin-bottom:.5rem}.page-description{font-size:1.125rem;color:var(--text-secondary);margin-top:.5rem}.loading-container{text-align:center;padding:4rem 2rem}.spinner{width:50px;height:50px;margin:0 auto 1rem;border:4px solid var(--border-color);border-top-color:var(--primary-color);border-radius:50%;animation:spin 1s linear infinite}.error-container{text-align:center;padding:4rem 2rem}.error-message{color:#ef4444;font-size:1.125rem;margin-bottom:1.5rem}.retry-btn{background:linear-gradient(135deg,#a855f7,#ec4899);color:#fff;border:none;padding:.75rem 2rem;border-radius:12px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease}.retry-btn:hover{transform:translateY(-2px);box-shadow:0 8px 20px #a855f766}.empty-state{text-align:center;padding:4rem 2rem;max-width:600px;margin:0 auto}.empty-icon{font-size:5rem;margin-bottom:1.5rem;animation:float 3s ease-in-out infinite}.empty-state h2{font-size:2rem;font-weight:700;color:var(--text-primary);margin-bottom:1rem}.empty-state p{font-size:1.125rem;color:var(--text-secondary);line-height:1.6;margin-bottom:2rem}.browse-btn{display:inline-block;background:linear-gradient(135deg,#c2f933,#22d3ee);color:#000;text-decoration:none;padding:1rem 2.5rem;border-radius:12px;font-size:1.125rem;font-weight:700;transition:all .3s ease;box-shadow:0 4px 15px #c2f9334d}.browse-btn:hover{transform:translateY(-3px);box-shadow:0 8px 25px #c2f93366}.courses-count{text-align:center;margin-bottom:2rem;font-size:1rem;color:var(--text-secondary);font-weight:500}.courses-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:2rem;margin-bottom:3rem}.course-card{background:var(--bg-secondary);border:2px solid var(--border-color);border-radius:16px;padding:1.5rem;transition:all .3s ease;display:flex;flex-direction:column;position:relative}.course-card:hover{transform:translateY(-5px);box-shadow:0 12px 30px #00000026;border-color:var(--primary-color)}.course-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1rem}.course-emoji{font-size:2.5rem}.remove-btn{background:#ef44441a;color:#ef4444;border:none;width:32px;height:32px;border-radius:50%;font-size:1.5rem;font-weight:700;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;line-height:1}.remove-btn:hover{background:#ef4444;color:#fff;transform:scale(1.1)}.remove-btn:disabled{opacity:.5;cursor:not-allowed}.course-content{flex:1;margin-bottom:1.5rem}.course-badge{display:inline-block;background:linear-gradient(135deg,#a855f7,#ec4899);color:#fff;padding:.25rem .75rem;border-radius:20px;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px;margin-bottom:.75rem}.course-title{font-size:1.25rem;font-weight:700;color:var(--text-primary);margin-bottom:.5rem;line-height:1.3}.course-subject{font-size:.95rem;font-weight:600;color:var(--primary-color);margin-bottom:.75rem}.course-description{font-size:.95rem;color:var(--text-secondary);line-height:1.5}.course-footer{margin-top:auto}.start-btn{display:block;width:100%;background:linear-gradient(135deg,#c2f933,#22d3ee);color:#000;text-decoration:none;text-align:center;padding:.875rem 1.5rem;border-radius:10px;font-size:1rem;font-weight:700;transition:all .3s ease;box-shadow:0 4px 12px #c2f93333}.start-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #c2f9334d}@media (max-width: 768px){.my-courses-page{padding:1rem}.page-header h1{font-size:2rem}.page-description{font-size:1rem}.courses-grid{grid-template-columns:1fr;gap:1.5rem}.empty-state{padding:3rem 1rem}.empty-icon{font-size:4rem}.empty-state h2{font-size:1.5rem}.empty-state p{font-size:1rem}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.voice-chat-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:10000;padding:1rem;animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.voice-chat-modal{background:#fff;border-radius:24px;max-width:600px;width:100%;max-height:90vh;display:flex;flex-direction:column;box-shadow:0 20px 60px #0000004d;animation:slideUp .3s ease}@keyframes slideUp{0%{transform:translateY(50px);opacity:0}to{transform:translateY(0);opacity:1}}.voice-chat-header{display:flex;justify-content:space-between;align-items:center;padding:1.5rem 2rem;border-bottom:2px solid #e5e7eb;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-radius:24px 24px 0 0}.voice-chat-header h2{margin:0;font-size:1.5rem}.close-btn{background:#fff3;border:none;color:#fff;font-size:1.5rem;width:40px;height:40px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.close-btn:hover{background:#ffffff4d;transform:scale(1.1)}.voice-chat-content{padding:2rem;flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:1.5rem}.voice-error{background:#fee2e2;border:2px solid #fecaca;border-radius:12px;padding:1rem;color:#991b1b;display:flex;align-items:center;gap:.5rem}.error-icon{font-size:1.5rem}.connecting{text-align:center;padding:3rem 0}.spinner{width:50px;height:50px;border:4px solid #e5e7eb;border-top-color:#667eea;border-radius:50%;margin:0 auto 1rem;animation:spin 1s linear infinite}.voice-visualizer{text-align:center;padding:2rem 0}.voice-circle-container{display:flex;flex-direction:column;align-items:center;gap:1rem}.voice-circle{width:150px;height:150px;border-radius:50%;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;align-items:center;justify-content:center;font-size:4rem;transition:all .3s ease;box-shadow:0 10px 40px #667eea4d}.voice-circle.listening{background:linear-gradient(135deg,#ff6b9d,#c06c84);animation:pulse 1.5s ease-in-out infinite}.voice-circle.speaking{background:linear-gradient(135deg,#4ecdc4,#44a08d);animation:pulse 1s ease-in-out infinite}@keyframes pulse{0%,to{box-shadow:0 10px 40px #667eea4d}50%{box-shadow:0 10px 60px #667eea99}}.voice-status{font-size:1.2rem;font-weight:600;color:#374151}.voice-controls{display:flex;justify-content:center;gap:1rem}.voice-btn{padding:1rem 2rem;border:none;border-radius:16px;font-size:1.1rem;font-weight:600;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:.5rem;font-family:inherit}.start-btn{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;box-shadow:0 4px 20px #667eea66}.start-btn:hover{transform:translateY(-2px);box-shadow:0 6px 30px #667eea99}.stop-btn{background:linear-gradient(135deg,#ff6b9d,#c06c84);color:#fff;box-shadow:0 4px 20px #ff6b9d66}.stop-btn:hover{transform:translateY(-2px);box-shadow:0 6px 30px #ff6b9d99}.voice-transcript{background:#f9fafb;border-radius:16px;padding:1.5rem;margin-top:1rem}.voice-transcript h3{margin:0 0 1rem;font-size:1.1rem;color:#374151}.messages{display:flex;flex-direction:column;gap:.75rem;max-height:200px;overflow-y:auto}.message{display:flex;align-items:flex-start;gap:.75rem;padding:.75rem;border-radius:12px;animation:slideIn .3s ease}@keyframes slideIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.message.user{background:#e0e7ff}.message.assistant{background:#d1fae5}.message-icon{font-size:1.5rem;flex-shrink:0}.message-content{flex:1;color:#374151;line-height:1.5}[data-theme=dark] .voice-chat-modal{background:#1e293b}[data-theme=dark] .voice-chat-header{border-bottom-color:#334155}[data-theme=dark] .voice-chat-content,[data-theme=dark] .voice-status{color:#e2e8f0}[data-theme=dark] .voice-transcript{background:#0f172a}[data-theme=dark] .voice-transcript h3{color:#e2e8f0}[data-theme=dark] .message.user{background:#1e40af}[data-theme=dark] .message.assistant{background:#065f46}[data-theme=dark] .message-content{color:#e2e8f0}@media (max-width: 768px){.voice-chat-modal{max-height:95vh;margin:0;border-radius:20px}.voice-chat-header{padding:1rem 1.5rem}.voice-chat-header h2{font-size:1.25rem}.voice-chat-content{padding:1.5rem}.voice-circle{width:120px;height:120px;font-size:3rem}.voice-btn{padding:.875rem 1.5rem;font-size:1rem}}.voice-practice-page{max-width:1200px;margin:0 auto;padding:2rem}.page-header{text-align:center;margin-bottom:3rem}.page-header h1{font-size:2.5rem;color:var(--text-primary);margin-bottom:.75rem}.page-description{font-size:1.125rem;color:var(--text-secondary)}.practice-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;margin-bottom:3rem}.practice-card{background:var(--bg-secondary);border:2px solid var(--border-color);border-radius:16px;padding:2rem;text-align:center;transition:all .3s ease}.practice-card:hover{transform:translateY(-4px);box-shadow:0 8px 24px #0000001a;border-color:var(--primary-color)}.card-icon{font-size:3.5rem;margin-bottom:1rem}.practice-card h2{font-size:1.5rem;color:var(--text-primary);margin-bottom:1rem}.practice-card p{font-size:1rem;color:var(--text-secondary);line-height:1.6;margin-bottom:1.5rem}.practice-btn{padding:1rem 2rem;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:12px;font-size:1.125rem;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px #667eea66}.practice-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #667eea99}.usage-info{background:linear-gradient(135deg,#667eea1a,#764ba21a);border:2px solid rgba(102,126,234,.3);border-radius:12px;padding:1.5rem;text-align:center;max-width:600px;margin:0 auto}.usage-info h3{font-size:1.25rem;color:var(--text-primary);margin-bottom:.5rem}.usage-info p{font-size:1rem;color:var(--text-secondary);margin:0}@media (max-width: 768px){.voice-practice-page{padding:1rem}.page-header h1{font-size:2rem}.practice-options{grid-template-columns:1fr;gap:1.5rem}.practice-card{padding:1.5rem}.card-icon{font-size:2.5rem}}.typing-practice-page{max-width:1400px;margin:0 auto;padding:1rem 2rem}.compact-header{background:var(--card-background);border-radius:12px;padding:1rem 1.5rem;margin-bottom:1.5rem;border:2px solid var(--border-color)}.header-content{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem;flex-wrap:wrap;gap:1rem}.header-content h1{font-size:1.8rem;color:var(--primary-color);margin:0}.lesson-select-inline{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}.lesson-select-inline label{font-weight:600;color:var(--text-primary)}.lesson-dropdown{padding:.5rem 1rem;font-size:1rem;border:2px solid var(--border-color);border-radius:8px;background:var(--background);color:var(--text-primary);cursor:pointer;font-weight:600}.lesson-dropdown:focus{outline:none;border-color:var(--primary-color)}.lesson-exercise-count{color:var(--text-secondary);font-size:.9rem}.stats-inline{display:flex;gap:2rem;flex-wrap:wrap;justify-content:center}.stat-item{display:flex;align-items:center;gap:.5rem}.stat-item .stat-label{color:var(--text-secondary);font-size:.9rem}.stat-item .stat-value{color:var(--primary-color);font-weight:700;font-size:1.1rem}.lesson-selector{margin-bottom:2rem}.lesson-selector h2{text-align:center;margin-bottom:1rem;color:var(--text-primary)}.lesson-buttons{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem}.lesson-btn{display:flex;flex-direction:column;gap:.25rem;padding:1rem;background:var(--card-background);border:2px solid var(--border-color);border-radius:12px;cursor:pointer;transition:all .3s ease}.lesson-btn:hover{transform:translateY(-2px);border-color:var(--primary-color);box-shadow:0 4px 12px #0000001a}.lesson-btn.active{border-color:var(--primary-color);background:linear-gradient(135deg,var(--primary-color) 0%,var(--secondary-color) 100%);color:#fff}.lesson-btn strong{font-size:1.1rem}.lesson-btn span{font-size:.9rem;opacity:.9}.typing-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem;margin-bottom:2rem}.stat-box{background:var(--card-background);padding:1.5rem;border-radius:12px;text-align:center;border:2px solid var(--border-color)}.stat-label{font-size:.9rem;color:var(--text-secondary);margin-bottom:.5rem;text-transform:uppercase;letter-spacing:1px}.stat-value{font-size:2rem;font-weight:700;color:var(--primary-color)}.stat-unit{font-size:1rem;font-weight:400;color:var(--text-secondary)}.typing-container{background:var(--card-background);padding:2rem;border-radius:16px;border:2px solid var(--border-color);margin-bottom:2rem}.exercise-info{text-align:center;margin-bottom:1.5rem}.exercise-info h3{color:var(--text-primary);margin-bottom:.5rem}.exercise-info p{color:var(--text-secondary);font-size:.9rem}.target-text{font-family:Courier New,monospace;font-size:1.5rem;line-height:2;padding:1.5rem;background:var(--background-secondary);border-radius:8px;margin-bottom:1rem;min-height:100px;letter-spacing:2px}.char-pending{color:var(--text-secondary);opacity:.4}.char-current{color:var(--text-primary);background-color:#6366f14d;border-bottom:3px solid var(--primary-color);animation:blink 1s infinite}@keyframes blink{0%,50%{opacity:1}51%,to{opacity:.7}}.char-correct{color:#10b981;background-color:#10b9811a}.char-incorrect{color:#ef4444;background-color:#ef444433;text-decoration:underline wavy}.typing-input{width:100%;font-family:Courier New,monospace;font-size:1.5rem;padding:1rem;border:2px solid var(--border-color);border-radius:8px;resize:none;min-height:100px;background:var(--background);color:var(--text-primary);letter-spacing:2px;line-height:2}.typing-input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #6366f11a}.typing-input:disabled{opacity:.6;cursor:not-allowed}.exercise-controls{display:flex;gap:1rem;justify-content:center;margin-top:1.5rem}.control-btn{padding:.75rem 1.5rem;font-size:1rem;font-weight:600;border:2px solid var(--border-color);border-radius:8px;background:var(--card-background);color:var(--text-primary);cursor:pointer;transition:all .3s ease}.control-btn:hover:not(:disabled){background:var(--primary-color);color:#fff;border-color:var(--primary-color);transform:translateY(-2px)}.control-btn:disabled{opacity:.4;cursor:not-allowed}.control-btn.reset{background:#f59e0b;color:#fff;border-color:#f59e0b}.control-btn.reset:hover{background:#d97706;border-color:#d97706}.control-btn.next{background:#10b981;color:#fff;border-color:#10b981}.control-btn.next:hover{background:#059669;border-color:#059669}.completion-message{margin-top:2rem;padding:2rem;background:linear-gradient(135deg,#10b981,#059669);color:#fff;border-radius:12px;text-align:center}.completion-message h3{font-size:1.8rem;margin-bottom:1rem}.final-stats{display:flex;justify-content:center;gap:2rem;margin-top:1rem}.final-stats p{font-size:1.1rem}.excellence-badge{margin-top:1rem;padding:1rem;background:#fff3;border-radius:8px;font-size:1.1rem;font-weight:600}.keyboard-section{margin-bottom:2rem}.keyboard-controls{display:flex;justify-content:center;gap:2rem;margin-bottom:1rem}.keyboard-toggle{display:inline-flex;align-items:center;gap:.5rem;font-size:1rem;cursor:pointer;color:var(--text-primary)}.keyboard-toggle input[type=checkbox]{width:18px;height:18px;cursor:pointer}.current-key-info{text-align:center;margin-bottom:1rem}.next-key-display{display:inline-flex;align-items:center;gap:1rem;background:linear-gradient(135deg,var(--primary-color) 0%,var(--secondary-color) 100%);color:#fff;padding:1rem 2rem;border-radius:12px;font-size:1.2rem;box-shadow:0 4px 12px #6366f14d;animation:pulse-info 1.5s infinite}@keyframes pulse-info{0%,to{transform:scale(1);box-shadow:0 4px 12px #6366f14d}50%{transform:scale(1.02);box-shadow:0 6px 16px #6366f166}}.next-key-display .label{font-weight:600;opacity:.9}.next-key-display .key-char{font-family:Courier New,monospace;font-size:1.8rem;font-weight:700;padding:.25rem .75rem;background:#fff3;border-radius:8px}.next-key-display .finger-name{font-weight:600;font-size:1.1rem}.virtual-keyboard{background:var(--card-background);padding:2rem;border-radius:16px;border:2px solid var(--border-color);max-width:900px;margin:0 auto;position:relative}.hand-overlay{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;height:100%;pointer-events:none;display:flex;justify-content:space-between;align-items:flex-end;padding:0 2rem 1rem;z-index:10}.hand{display:flex;gap:.5rem;align-items:flex-end;opacity:.6}.hand.left-hand{margin-right:auto;margin-left:2rem}.hand.right-hand{margin-left:auto;margin-right:2rem}.finger{display:flex;flex-direction:column;align-items:center;transition:all .3s ease}.finger-segment{width:30px;height:150px;background:linear-gradient(180deg,#fff6,#fff3);border-radius:15px 15px 8px 8px;border:2px solid rgba(255,255,255,.3);position:relative}.finger.pinky .finger-segment{height:120px;background:linear-gradient(180deg,#ef444480,#ef44444d);border-color:#ef444480}.finger.ring .finger-segment{height:140px;background:linear-gradient(180deg,#f9731680,#f973164d);border-color:#f9731680}.finger.middle .finger-segment{height:150px;background:linear-gradient(180deg,#22c55e80,#22c55e4d);border-color:#22c55e80}.finger.index .finger-segment{height:135px;background:linear-gradient(180deg,#3b82f680,#3b82f64d);border-color:#3b82f680}.finger-segment:before,.finger-segment:after{content:"";position:absolute;left:50%;transform:translate(-50%);width:80%;height:2px;background:#ffffff4d}.finger-segment:before{top:30%}.finger-segment:after{top:60%}.keyboard-row{display:flex;justify-content:center;gap:.5rem;margin-bottom:.5rem;position:relative;z-index:20}.key{min-width:50px;height:50px;display:flex;align-items:center;justify-content:center;background:var(--background);border:2px solid var(--border-color);border-radius:8px;font-weight:600;font-size:1.1rem;color:var(--text-primary);box-shadow:0 2px 4px #0000001a,0 0 0 1px #ffffff1a inset;transition:all .2s ease;position:relative}.key.home-key{border:3px solid var(--primary-color);font-weight:700}.key.finger-left-pinky{background:#ef444426}.key.finger-left-ring{background:#f9731626}.key.finger-left-middle{background:#eab30826}.key.finger-left-index{background:#22c55e26}.key.finger-right-index{background:#3b82f626}.key.finger-right-middle{background:#8b5cf626}.key.finger-right-ring{background:#ec489926}.key.finger-right-pinky{background:#a855f726}.key.key-highlight{background:linear-gradient(135deg,var(--primary-color) 0%,var(--secondary-color) 100%)!important;color:#fff!important;border-color:var(--primary-color)!important;transform:scale(1.1);box-shadow:0 4px 12px #6366f166;animation:pulse .8s infinite}@keyframes pulse{0%,to{transform:scale(1.1)}50%{transform:scale(1.15)}}.key.spacebar{min-width:300px}.typing-tips{background:var(--card-background);padding:2rem;border-radius:16px;border:2px solid var(--border-color)}.typing-tips h3{color:var(--text-primary);margin-bottom:1rem;text-align:center}.typing-tips ul{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1rem}.typing-tips li{background:var(--background-secondary);border-radius:8px;padding:.75rem .75rem .75rem 2rem;position:relative;color:var(--text-primary)}.typing-tips li:before{content:"✓";position:absolute;left:.75rem;color:var(--primary-color);font-weight:700}@media (max-width: 768px){.typing-practice-page{padding:.5rem}.compact-header{padding:1rem}.header-content{flex-direction:column;align-items:flex-start}.header-content h1{font-size:1.5rem}.stats-inline{gap:1rem;font-size:.9rem}.target-text,.typing-input{font-size:1.2rem}.lesson-buttons{grid-template-columns:1fr}.typing-stats{grid-template-columns:repeat(2,1fr)}.final-stats{flex-direction:column;gap:.5rem}.virtual-keyboard{padding:1rem}.hand-overlay{display:none}.keyboard-controls{flex-direction:column;gap:.5rem}.next-key-display{flex-direction:column;gap:.5rem;padding:.75rem 1.5rem;font-size:1rem}.next-key-display .key-char{font-size:1.5rem}.key{min-width:35px;height:35px;font-size:.9rem}.key.spacebar{min-width:200px}.typing-tips ul{grid-template-columns:1fr}}@media (prefers-color-scheme: dark){.char-correct{background-color:#10b98133}.char-incorrect{background-color:#ef444433}}.about-page{min-height:calc(100vh - 200px);padding:4rem 2rem}.about-container{max-width:900px;margin:0 auto}.about-title{font-size:3rem;font-weight:700;text-align:center;margin-bottom:3rem;background:var(--brand-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.about-section{margin-bottom:4rem;padding:2rem;background:var(--bg-secondary);border-radius:16px;box-shadow:var(--shadow-md);border:1px solid var(--border-color)}.about-section h2{font-size:2rem;margin-bottom:1.5rem;color:var(--text-primary)}.story-content{color:var(--text-secondary);line-height:1.9;font-size:1.125rem}.story-content p{margin-bottom:1.5rem}.story-content strong{color:var(--text-primary);font-weight:700}.story-content ul{margin:1.5rem 0;padding-left:2rem;list-style:disc}.story-content li{margin-bottom:.75rem;color:var(--text-secondary)}.highlight-moment{padding:1.5rem;background:linear-gradient(135deg,#c2f93314,#22d3ee14);border-left:4px solid var(--brand-lime);border-radius:12px;font-size:1.15rem;line-height:1.8}.kids-quote{padding:1.5rem;background:var(--bg-tertiary);border-radius:12px;font-size:1.15rem;text-align:center;font-style:italic;border-left:4px solid var(--brand-purple)}.kids-quote em{color:var(--primary-color);font-size:1.2rem;font-weight:600}.built-where{padding:1.5rem;background:var(--bg-tertiary);border-radius:12px;font-size:1.125rem;line-height:1.8;border-left:4px solid var(--brand-orange)}.family-photo{display:flex;justify-content:center;align-items:center;padding:3rem 2rem;background:transparent;border:none;box-shadow:none}.family-image{width:100%;max-width:700px;height:auto;border-radius:16px;box-shadow:var(--shadow-lg);border:3px solid var(--border-color)}.mission{background:linear-gradient(135deg,#c2f9330d,#22d3ee0d);border-left:4px solid var(--primary-color)}.mission-content{color:var(--text-secondary);line-height:1.9;font-size:1.125rem}.mission-content p{margin-bottom:1.5rem}.mission-lead{font-size:1.3rem;font-weight:600;color:var(--text-primary);line-height:1.7;margin-bottom:2rem}.mission-content h3{font-size:1.4rem;color:var(--text-primary);margin:2rem 0 1rem}.mission-beliefs{list-style:none;padding:0;margin:1.5rem 0}.mission-beliefs li{padding:1rem 1.5rem;margin-bottom:1rem;background:var(--bg-tertiary);border-left:4px solid var(--primary-color);border-radius:8px;font-size:1.1rem}.mission-closing{font-size:1.2rem;text-align:center;padding:2rem;background:linear-gradient(135deg,#a855f714,#ec489914);border-radius:12px;border-left:4px solid var(--brand-purple);margin-top:2rem}.mission-closing strong{color:var(--text-primary);font-size:1.3rem}@media (max-width: 768px){.about-page{padding:2rem 1rem}.about-title{font-size:2rem}.about-section{padding:1.5rem;margin-bottom:2rem}.about-section h2{font-size:1.5rem}.story-content{font-size:1rem}.highlight-moment,.kids-quote,.built-where{font-size:1rem;padding:1rem}.family-photo{padding:1.5rem 1rem}.family-image{max-width:100%}.mission-lead{font-size:1.1rem}.mission-content h3{font-size:1.2rem}.mission-beliefs li{font-size:1rem;padding:.75rem 1rem}.mission-closing{font-size:1.05rem;padding:1.5rem}.mission-closing strong{font-size:1.15rem}}[data-theme=dark] .story-content,[data-theme=dark] .mission-content{color:#e5e7eb}[data-theme=dark] .story-content p,[data-theme=dark] .mission-content p{color:#d1d5db}[data-theme=dark] .story-content strong,[data-theme=dark] .mission-content strong,[data-theme=dark] .mission-lead{color:#f3f4f6}[data-theme=dark] .story-content li,[data-theme=dark] .mission-beliefs li{color:#d1d5db}[data-theme=dark] .highlight-moment{background:linear-gradient(135deg,#c2f93326,#22d3ee26);color:#f3f4f6}[data-theme=dark] .kids-quote{background:#ffffff0d;color:#e5e7eb}[data-theme=dark] .kids-quote em{color:#22d3ee}[data-theme=dark] .built-where{background:#ffffff0d;color:#e5e7eb}[data-theme=dark] .mission-beliefs li{background:#ffffff0d}[data-theme=dark] .mission-closing{background:linear-gradient(135deg,#a855f726,#ec489926);color:#e5e7eb}[data-theme=dark] .mission-closing strong{color:#f3f4f6}.legal-page{padding:2rem 1rem;max-width:900px;margin:0 auto;min-height:calc(100vh - 200px)}.legal-container{background:#fff;border-radius:12px;padding:3rem;box-shadow:0 2px 8px #0000001a}.legal-container h1{font-size:2.5rem;margin-bottom:.5rem;background:linear-gradient(135deg,#c2f933,#22d3ee);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.last-updated{color:#64748b;font-size:.9rem;margin-bottom:2rem;font-style:italic}.legal-section{margin-bottom:2rem}.legal-section h2{font-size:1.5rem;color:#1e293b;margin-bottom:1rem;padding-bottom:.5rem;border-bottom:2px solid rgba(194,249,51,.3)}.legal-section p{color:#475569;line-height:1.8;margin-bottom:1rem}.legal-section ul{margin-left:1.5rem;margin-bottom:1rem}.legal-section li{color:#475569;line-height:1.8;margin-bottom:.5rem}.legal-section a{color:#0284c7;text-decoration:none;border-bottom:1px solid transparent;transition:border-color .2s}.legal-section a:hover{border-bottom-color:#0284c7}.legal-section strong{color:#1e293b;font-weight:600}[data-theme=dark] .legal-container{background:#ffffff0d;box-shadow:0 2px 8px #0000004d}[data-theme=dark] .legal-section h2{color:#f3f4f6;border-bottom-color:#c2f93380}[data-theme=dark] .legal-section p,[data-theme=dark] .legal-section li{color:#d1d5db}[data-theme=dark] .legal-section strong{color:#f3f4f6}[data-theme=dark] .legal-section a{color:#c2f933}[data-theme=dark] .legal-section a:hover{border-bottom-color:#c2f933}[data-theme=dark] .last-updated{color:#94a3b8}@media (max-width: 768px){.legal-page{padding:1rem .5rem}.legal-container{padding:2rem 1.5rem;border-radius:8px}.legal-container h1{font-size:2rem}.legal-section h2{font-size:1.25rem}.legal-section p,.legal-section li{font-size:.95rem}}.contact-page{padding:2rem 1rem;max-width:1200px;margin:0 auto;min-height:calc(100vh - 200px)}.contact-container{width:100%}.contact-header{text-align:center;margin-bottom:3rem}.contact-header h1{font-size:2.5rem;margin-bottom:1rem;background:linear-gradient(135deg,#c2f933,#22d3ee);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.contact-header p{font-size:1.2rem;color:#64748b}.contact-content{display:grid;grid-template-columns:1fr 1.5fr;gap:3rem;align-items:start}.contact-info{display:flex;flex-direction:column;gap:1.5rem}.info-card{background:#c2f9330d;border:2px solid rgba(194,249,51,.2);border-radius:15px;padding:1.5rem;transition:all .3s ease}.info-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px #c2f93326;border-color:#c2f93366}.info-icon{font-size:2.5rem;margin-bottom:.75rem}.info-card h3{font-size:1.25rem;margin-bottom:.5rem;color:#1e293b}.info-card p{color:#475569;margin-bottom:.25rem;line-height:1.6}.info-card a{color:#0284c7;text-decoration:none;font-weight:600;transition:color .2s}.info-card a:hover{color:#c2f933}.info-subtitle{font-size:.875rem;color:#64748b;font-style:italic}.contact-form-wrapper{background:#fff;border-radius:20px;padding:2.5rem;box-shadow:0 4px 20px #00000014;border:2px solid rgba(194,249,51,.2)}.success-message{background:linear-gradient(135deg,#3ae3741a,#22d3ee1a);border:2px solid #3ae374;border-radius:12px;padding:1.5rem;margin-bottom:2rem;display:flex;align-items:center;gap:1rem;animation:slideIn .3s ease}.success-icon{width:32px;height:32px;background:#3ae374;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;flex-shrink:0}.success-message p{margin:0;color:#166534;font-weight:500}.error-message{background:linear-gradient(135deg,#ef44441a,#dc26261a);border:2px solid #ef4444;border-radius:12px;padding:1.5rem;margin-bottom:2rem;display:flex;align-items:center;gap:1rem;animation:slideIn .3s ease}.error-icon{width:32px;height:32px;background:#ef4444;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;flex-shrink:0}.error-message p{margin:0;color:#991b1b;font-weight:500}.contact-form{display:flex;flex-direction:column;gap:1.5rem}.form-group label{font-weight:600;color:#1e293b;font-size:.95rem}.form-group input,.form-group select,.form-group textarea{padding:.875rem;border:2px solid #e2e8f0;border-radius:10px;font-size:1rem;font-family:inherit;transition:all .2s;background:#fff}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:#c2f933;box-shadow:0 0 0 3px #c2f9331a}.form-group textarea{resize:vertical;min-height:120px}.submit-btn{background:linear-gradient(135deg,#c2f933,#22d3ee);color:#1e293b;border:none;padding:1rem 2rem;border-radius:12px;font-size:1.1rem;font-weight:700;cursor:pointer;transition:all .3s ease;margin-top:.5rem}.submit-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #c2f9334d}.submit-btn:active{transform:translateY(0)}.submit-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.submit-btn:disabled:hover{transform:none;box-shadow:none}[data-theme=dark] .contact-header p{color:#94a3b8}[data-theme=dark] .info-card{background:#c2f93314;border-color:#c2f9334d}[data-theme=dark] .info-card:hover{border-color:#c2f93380;box-shadow:0 4px 12px #c2f93333}[data-theme=dark] .info-card h3{color:#f3f4f6}[data-theme=dark] .info-card p{color:#d1d5db}[data-theme=dark] .info-card a{color:#c2f933}[data-theme=dark] .info-card a:hover{color:#22d3ee}[data-theme=dark] .info-subtitle{color:#9ca3af}[data-theme=dark] .contact-form-wrapper{background:#1e293bcc;border-color:#c2f9334d}[data-theme=dark] .form-group label{color:#f3f4f6}[data-theme=dark] .form-group input,[data-theme=dark] .form-group select,[data-theme=dark] .form-group textarea{background:#0f172a80;border-color:#94a3b84d;color:#e2e8f0}[data-theme=dark] .form-group input::placeholder,[data-theme=dark] .form-group textarea::placeholder{color:#64748b}[data-theme=dark] .form-group input:focus,[data-theme=dark] .form-group select:focus,[data-theme=dark] .form-group textarea:focus{border-color:#c2f933;background:#0f172ab3}[data-theme=dark] .success-message{background:#3ae37426;border-color:#3ae374}[data-theme=dark] .success-message p{color:#86efac}[data-theme=dark] .error-message{background:#ef444426;border-color:#ef4444}[data-theme=dark] .error-message p{color:#fca5a5}@media (max-width: 968px){.contact-content{grid-template-columns:1fr;gap:2rem}.contact-info{order:2}.contact-form-wrapper{order:1}}@media (max-width: 768px){.contact-page{padding:1rem .5rem}.contact-header h1{font-size:2rem}.contact-header p{font-size:1rem}.contact-form-wrapper{padding:1.5rem}.info-card{padding:1.25rem}.submit-btn{padding:.875rem 1.5rem;font-size:1rem}}.my-news-page{max-width:1200px;margin:0 auto;padding:2rem}.news-header{text-align:center;margin-bottom:3rem}.news-header h1{font-size:3rem;font-weight:800;background:linear-gradient(135deg,#c2f933,#22d3ee);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:.5rem}.news-subtitle{font-size:1.25rem;color:var(--text-secondary);margin-top:.5rem}.favorite-teams-display{display:inline-flex;align-items:center;gap:.5rem;margin-top:1rem;padding:.75rem 1.25rem;background:linear-gradient(135deg,#c2f9331a,#22d3ee1a);border:2px solid var(--primary-color);border-radius:25px;font-size:.9375rem}.teams-icon{font-size:1.25rem}.teams-label{font-weight:700;color:var(--text-primary)}.teams-list{color:var(--text-secondary);font-weight:600}[data-theme=light] .favorite-teams-display{background:linear-gradient(135deg,#84cc161a,#0ea5e91a);border-color:#0ea5e9}.test-age-selector{text-align:center;margin-bottom:2rem;padding:1rem;background:linear-gradient(135deg,#ffc1071a,#ff98001a);border:2px dashed rgba(255,193,7,.5);border-radius:12px;max-width:600px;margin-left:auto;margin-right:auto}.test-age-selector label{font-weight:700;color:var(--text-primary);margin-right:1rem;font-size:.9375rem}.age-group-dropdown{padding:.5rem 1rem;background:var(--bg-secondary);border:2px solid var(--border-color);border-radius:8px;color:var(--text-primary);font-size:.9375rem;font-weight:600;cursor:pointer;min-width:250px;transition:all .3s ease}.age-group-dropdown:hover{border-color:var(--primary-color)}.age-group-dropdown:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #c2f93333}.category-filter{display:flex;gap:.75rem;flex-wrap:wrap;justify-content:center;margin-bottom:3rem;padding:0 1rem}.category-btn{padding:.625rem 1.25rem;background:var(--bg-secondary);border:2px solid var(--border-color);border-radius:25px;color:var(--text-secondary);font-size:.9375rem;font-weight:600;cursor:pointer;transition:all .3s ease}.category-btn:hover{border-color:var(--primary-color);color:var(--text-primary);transform:translateY(-2px)}.category-btn.active{background:linear-gradient(135deg,#c2f933,#22d3ee);color:#0d0d0d;border-color:transparent;font-weight:700}.news-loading,.news-error,.no-news{text-align:center;padding:4rem 2rem}.loading-spinner{width:50px;height:50px;border:4px solid var(--border-color);border-top-color:var(--primary-color);border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 1rem}@keyframes spin{to{transform:rotate(360deg)}}.news-error p,.no-news p{font-size:1.125rem;color:var(--text-secondary);margin-bottom:1.5rem}.news-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:2rem;margin-bottom:3rem}.news-card{background:var(--bg-secondary);border:2px solid var(--border-color);border-radius:20px;overflow:hidden;transition:all .3s ease;display:flex;flex-direction:column}.news-card:hover{transform:translateY(-8px);border-color:var(--primary-color);box-shadow:0 15px 40px #22d3ee33}.news-image{position:relative;width:100%;height:200px;overflow:hidden;background:var(--bg-tertiary)}.news-image img{width:100%;height:100%;object-fit:cover}.news-category-badge{position:absolute;top:1rem;right:1rem;background:#000000b3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;padding:.4rem .875rem;border-radius:20px;font-size:.8125rem;font-weight:600;text-transform:capitalize}.news-content{padding:1.5rem;display:flex;flex-direction:column;flex-grow:1}.news-meta{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;font-size:.8125rem;color:var(--text-tertiary)}.news-age-group{background:var(--bg-tertiary);padding:.25rem .625rem;border-radius:12px;text-transform:capitalize;font-weight:600}.news-title{font-size:1.75rem;font-weight:700;color:var(--text-primary);margin-bottom:.75rem;line-height:1.3}.news-summary{font-size:1.125rem;color:var(--text-secondary);margin-bottom:1rem;line-height:1.7;font-weight:600}.news-body{font-size:1.125rem;color:var(--text-secondary);line-height:1.8;margin-bottom:1.5rem;flex-grow:1}.news-actions{display:flex;gap:.75rem;margin-top:auto}.news-actions .btn{flex:1;text-align:center;padding:.75rem 1.25rem;font-size:.9375rem;text-decoration:none;display:inline-block}.news-actions .btn-secondary{background:var(--bg-tertiary);color:var(--text-primary);border:2px solid var(--border-color)}.news-actions .btn-secondary:hover{background:var(--bg-primary);border-color:var(--primary-color)}.news-actions .btn-primary{background:linear-gradient(135deg,#c2f933,#22d3ee);color:#0d0d0d;font-weight:700;border:none}.news-actions .btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 20px #c2f93366}.news-footer{text-align:center;padding:3rem 2rem;background:var(--bg-secondary);border-radius:20px;margin-top:2rem;border:2px solid var(--border-color)}.news-footer-info{margin-bottom:2rem}.news-footer-info p{font-size:1.125rem;font-weight:600;color:var(--text-primary)}.news-footer-actions{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}.news-footer .btn{padding:1rem 2.5rem;font-size:1rem;font-weight:700}.news-footer .btn-primary{background:linear-gradient(135deg,#c2f933,#22d3ee);color:#0d0d0d;border:none;box-shadow:0 4px 15px #c2f9334d}.news-footer .btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 20px #c2f93380}.news-footer .btn-secondary{background:var(--bg-tertiary);color:var(--text-primary);border:2px solid var(--border-color)}.news-footer .btn-secondary:hover{background:var(--bg-primary);border-color:var(--primary-color)}@media (max-width: 768px){.my-news-page{padding:1rem}.news-header h1{font-size:2rem}.news-subtitle{font-size:1rem}.news-grid{grid-template-columns:1fr;gap:1.5rem}.category-filter{gap:.5rem}.category-btn{font-size:.875rem;padding:.5rem 1rem}.news-title{font-size:1.5rem}.news-summary,.news-body{font-size:1.0625rem}.news-actions{flex-direction:column}.news-actions .btn{width:100%}}[data-theme=light] .news-card{background:#fff;box-shadow:0 4px 12px #00000014}[data-theme=light] .news-card:hover{box-shadow:0 15px 40px #0ea5e940}[data-theme=light] .category-btn{background:#f8fafc}[data-theme=light] .category-btn.active{background:linear-gradient(135deg,#84cc16,#0ea5e9);color:#fff}.quiz-page{max-width:800px;margin:0 auto;padding:2rem}.quiz-loading,.quiz-error,.quiz-complete{text-align:center;padding:4rem 2rem}.quiz-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem}.back-button{background:var(--bg-secondary);border:2px solid var(--border-color);border-radius:8px;padding:.5rem 1rem;color:var(--text-primary);font-weight:600;cursor:pointer;transition:all .3s ease}.back-button:hover{background:var(--bg-tertiary);border-color:var(--primary-color)}.quiz-progress{font-size:.9375rem;color:var(--text-secondary);font-weight:600}.quiz-content{background:var(--bg-secondary);border:2px solid var(--border-color);border-radius:20px;padding:2.5rem}.quiz-question{font-size:1.5rem;font-weight:700;color:var(--text-primary);margin-bottom:2rem;line-height:1.4}.quiz-options{display:flex;flex-direction:column;gap:1rem;margin-bottom:2rem}.quiz-option{background:var(--bg-primary);border:2px solid var(--border-color);border-radius:12px;padding:1.25rem;text-align:left;font-size:1rem;color:var(--text-primary);cursor:pointer;transition:all .3s ease}.quiz-option:hover:not(:disabled){border-color:var(--primary-color);transform:translate(8px)}.quiz-option.selected{background:linear-gradient(135deg,#c2f9331a,#22d3ee1a);border-color:var(--primary-color)}.quiz-option.correct{background:linear-gradient(135deg,#22c55e33,#4ade8033);border-color:#22c55e;font-weight:600}.quiz-option.incorrect{background:linear-gradient(135deg,#ef444433,#f8717133);border-color:#ef4444}.quiz-option:disabled{cursor:not-allowed;opacity:.7}.quiz-explanation{background:var(--bg-tertiary);border-left:4px solid var(--primary-color);border-radius:8px;padding:1.5rem;margin-bottom:2rem}.quiz-explanation h3{font-size:1.125rem;color:var(--text-primary);margin-bottom:.75rem}.quiz-explanation p{color:var(--text-secondary);line-height:1.6}.quiz-actions{display:flex;justify-content:center;gap:1rem}.quiz-actions .btn{padding:.875rem 2rem;font-size:1rem}.quiz-complete{max-width:600px;margin:0 auto}.quiz-complete h1{font-size:2.5rem;font-weight:800;background:linear-gradient(135deg,#c2f933,#22d3ee);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:2rem}.score-display{margin:3rem 0}.score-circle{width:200px;height:200px;border-radius:50%;background:linear-gradient(135deg,#c2f933,#22d3ee);display:flex;align-items:center;justify-content:center;margin:0 auto 1.5rem;box-shadow:0 10px 40px #22d3ee66}.score-percentage{font-size:4rem;font-weight:800;color:#0d0d0d}.score-text{font-size:1.375rem;color:var(--text-primary);font-weight:600;margin-bottom:.5rem}.article-count-text{font-size:1rem;color:var(--text-secondary);font-weight:500}.quiz-error h2{font-size:2rem;color:var(--text-primary);margin-bottom:1rem}.quiz-error p{font-size:1.125rem;color:var(--text-secondary);margin-bottom:2rem}@media (max-width: 768px){.quiz-page{padding:1rem}.quiz-content{padding:1.5rem}.quiz-question{font-size:1.25rem}.quiz-option{padding:1rem;font-size:.9375rem}.quiz-complete h1{font-size:2rem}.score-circle{width:150px;height:150px}.score-percentage{font-size:3rem}.score-text{font-size:1.125rem}}[data-theme=light] .quiz-content{background:#fff;box-shadow:0 4px 12px #00000014}[data-theme=light] .quiz-option{background:#f8fafc}[data-theme=light] .quiz-option.selected{background:linear-gradient(135deg,#84cc161a,#0ea5e91a)}[data-theme=light] .score-circle{background:linear-gradient(135deg,#84cc16,#0ea5e9)}[data-theme=light] .score-percentage{color:#fff}.profile-page{max-width:900px;margin:0 auto;padding:2rem}.profile-header{text-align:center;margin-bottom:3rem}.profile-header h1{font-size:3rem;font-weight:800;background:linear-gradient(135deg,#c2f933,#22d3ee);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:.5rem}.profile-subtitle{font-size:1.25rem;color:var(--text-secondary);margin-top:.5rem}.profile-content{display:flex;flex-direction:column;gap:2rem}.profile-info-card,.profile-settings-card,.profile-tips-card{background:var(--bg-secondary);border:2px solid var(--border-color);border-radius:20px;padding:2rem;transition:all .3s ease}.profile-info-card:hover,.profile-settings-card:hover{border-color:var(--primary-color);box-shadow:0 8px 25px #22d3ee26}.profile-info-card h2,.profile-settings-card h2{font-size:1.5rem;font-weight:700;color:var(--text-primary);margin-bottom:1.5rem}.info-row{display:flex;justify-content:space-between;align-items:center;padding:1rem;background:var(--bg-tertiary);border-radius:12px;margin-bottom:.75rem}.info-label{font-weight:700;color:var(--text-secondary);font-size:.9375rem}.info-value{font-weight:600;color:var(--text-primary);font-size:1rem}.section-description{color:var(--text-secondary);line-height:1.6;margin-bottom:2rem;font-size:.9375rem}.profile-form{display:flex;flex-direction:column;gap:1.5rem}.form-group{display:flex;flex-direction:column;gap:.5rem}.form-group label{font-weight:700;color:var(--text-primary);font-size:1rem;display:flex;flex-direction:column;gap:.25rem}.label-hint{font-weight:400;color:var(--text-tertiary);font-size:.875rem}.checkbox-label{flex-direction:row!important;align-items:center;gap:.75rem!important;cursor:pointer;-webkit-user-select:none;user-select:none}.checkbox-label input[type=checkbox]{width:20px;height:20px;cursor:pointer;accent-color:var(--primary-color)}.checkbox-label span{font-weight:600;font-size:.9375rem}.team-input{padding:1rem;background:var(--bg-tertiary);border:2px solid var(--border-color);border-radius:12px;color:var(--text-primary);font-size:1rem;font-family:inherit;transition:all .3s ease}.team-input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #c2f93333}.team-input:disabled{opacity:.6;cursor:not-allowed}.form-helper-text{font-size:.875rem;color:var(--text-tertiary);line-height:1.5}.current-teams{padding:1rem;background:linear-gradient(135deg,#c2f93314,#22d3ee14);border-radius:12px;border:2px solid var(--primary-color)}.current-teams-label{font-weight:700;color:var(--text-primary);display:block;margin-bottom:.75rem;font-size:.9375rem}.teams-tags{display:flex;flex-wrap:wrap;gap:.5rem}.team-tag{display:inline-flex;align-items:center;gap:.25rem;padding:.5rem 1rem;background:var(--bg-secondary);border:2px solid var(--border-color);border-radius:20px;font-weight:600;font-size:.875rem;color:var(--text-primary);transition:all .3s ease}.team-tag:hover{border-color:var(--primary-color);transform:translateY(-2px)}.alert{padding:1rem 1.25rem;border-radius:12px;font-weight:600;font-size:.9375rem;animation:slideIn .3s ease}.alert-success{background:#22c55e1a;color:#22c55e;border:2px solid #22c55e}.alert-error{background:#ef44441a;color:#ef4444;border:2px solid #ef4444}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.profile-tips-card{background:linear-gradient(135deg,#c2f9330d,#22d3ee0d)}.profile-tips-card h3{font-size:1.125rem;font-weight:700;color:var(--text-primary);margin-bottom:1rem}.tips-list{list-style:none;padding:0;display:flex;flex-direction:column;gap:.75rem}.tips-list li{padding-left:1.5rem;position:relative;color:var(--text-secondary);line-height:1.6;font-size:.9375rem}.tips-list li:before{content:"✓";position:absolute;left:0;color:var(--primary-color);font-weight:700}.btn-full{width:100%;padding:1rem 2rem;font-size:1rem;font-weight:700;margin-top:.5rem}.btn-primary{background:linear-gradient(135deg,#c2f933,#22d3ee);color:#0d0d0d;border:none;border-radius:12px;cursor:pointer;transition:all .3s ease}.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px #c2f93366}.btn-primary:disabled{opacity:.6;cursor:not-allowed}@media (max-width: 768px){.profile-page{padding:1rem}.profile-header h1{font-size:2rem}.profile-subtitle{font-size:1rem}.profile-info-card,.profile-settings-card,.profile-tips-card{padding:1.5rem}.info-row{flex-direction:column;align-items:flex-start;gap:.5rem}.teams-tags{flex-direction:column}.team-tag{width:100%;justify-content:center}}[data-theme=light] .profile-info-card,[data-theme=light] .profile-settings-card,[data-theme=light] .profile-tips-card{background:#fff;box-shadow:0 4px 12px #00000014}[data-theme=light] .profile-info-card:hover,[data-theme=light] .profile-settings-card:hover{box-shadow:0 8px 25px #0ea5e933}[data-theme=light] .info-row,[data-theme=light] .team-input{background:#f8fafc}[data-theme=light] .current-teams{background:linear-gradient(135deg,#84cc1614,#0ea5e914);border-color:#0ea5e9}[data-theme=light] .team-tag{background:#fff}[data-theme=light] .btn-primary{background:linear-gradient(135deg,#84cc16,#0ea5e9);color:#fff}*{margin:0;padding:0;box-sizing:border-box}:root{--brand-black: #0d0d0d;--brand-lime: #c2f933;--brand-cyan: #22d3ee;--brand-purple: #a855f7;--brand-orange: #fb923c;--brand-pink: #f472b6;--brand-white: #ffffff;--surface-dark: #171717;--surface-light: #f4f4f5;--neutral-800: #27272a;--neutral-900: #18181b;--neutral-200: #e4e4e7;--bg-primary: #0d0d0d;--bg-secondary: #1a1a1a;--bg-tertiary: #262626;--text-primary: #ffffff;--text-secondary: #d4d4d8;--text-tertiary: #a1a1aa;--border-color: #3f3f46;--border-color-focus: #52525b;--shadow-sm: 0 2px 4px rgba(0, 0, 0, .3);--shadow-md: 0 4px 12px rgba(0, 0, 0, .4);--shadow-lg: 0 10px 30px rgba(0, 0, 0, .5);--primary-color: #22d3ee;--primary-hover: #06b6d4;--secondary-color: #a855f7;--secondary-hover: #9333ea;--accent-color: #fb923c;--accent-hover: #f97316;--success-color: #10b981;--success-hover: #059669;--brand-gradient: linear-gradient(135deg, #c2f933 0%, #22d3ee 100%);--purple-gradient: linear-gradient(135deg, #a855f7 0%, #ec4899 100%);--orange-gradient: linear-gradient(135deg, #fb923c 0%, #f59e0b 100%)}[data-theme=light]{--neutral-800: #e4e4e7;--neutral-900: #ffffff;--neutral-200: #e4e4e7;--bg-primary: #ffffff;--bg-secondary: #f8fafc;--bg-tertiary: #f1f5f9;--text-primary: #0f172a;--text-secondary: #475569;--text-tertiary: #64748b;--border-color: #e2e8f0;--border-color-focus: #cbd5e1;--shadow-sm: 0 2px 4px rgba(0, 0, 0, .08);--shadow-md: 0 4px 12px rgba(0, 0, 0, .12);--shadow-lg: 0 10px 30px rgba(0, 0, 0, .15);--primary-color: #0ea5e9;--primary-hover: #0284c7;--secondary-color: #a855f7;--secondary-hover: #9333ea;--accent-color: #f97316;--accent-hover: #ea580c;--success-color: #10b981;--success-hover: #059669}html,body{height:100%}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--bg-primary);color:var(--text-primary);line-height:1.5;transition:background-color .3s ease,color .3s ease}#root{min-height:100vh;display:flex;flex-direction:column}h1,h2,h3,h4,h5,h6{font-weight:600;line-height:1.2}h1{font-size:2.5rem}h2{font-size:2rem}h3{font-size:1.5rem}p{margin-bottom:1rem}.btn{display:inline-block;padding:.875rem 1.75rem;font-size:1rem;font-weight:600;text-align:center;text-decoration:none;border:none;border-radius:12px;cursor:pointer;transition:all .3s cubic-bezier(.175,.885,.32,1.275);font-family:inherit}.btn:disabled{opacity:.6;cursor:not-allowed}.btn-primary{background:linear-gradient(135deg,var(--brand-lime) 0%,var(--brand-cyan) 100%);color:#0d0d0d;font-weight:700;border:2px solid rgba(255,255,255,.2);box-shadow:0 4px 12px #c2f9334d}.btn-primary:hover:not(:disabled){transform:translateY(-2px) scale(1.02);box-shadow:0 6px 20px #c2f93380}.btn-secondary{background:linear-gradient(135deg,var(--brand-purple) 0%,var(--brand-pink) 100%);color:#fff;font-weight:700;border:2px solid rgba(255,255,255,.2);box-shadow:0 4px 12px #a855f74d}.btn-secondary:hover:not(:disabled){transform:translateY(-2px) scale(1.02);box-shadow:0 6px 20px #a855f780}.btn-large{padding:1rem 2rem;font-size:1.125rem}input[type=text],input[type=number],input[type=email],textarea{font-family:inherit;font-size:1rem;padding:.875rem 1rem;border:2px solid var(--border-color);border-radius:12px;width:100%;transition:all .3s ease;background-color:var(--bg-secondary);color:var(--text-primary)}input:focus,textarea:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #c2f9331a;transform:translateY(-1px)}.text-center{text-align:center}.mt-1{margin-top:.5rem}.mt-2{margin-top:1rem}.mt-3{margin-top:1.5rem}.mb-1{margin-bottom:.5rem}.mb-2{margin-bottom:1rem}.mb-3{margin-bottom:1.5rem}@media (max-width: 768px){h1{font-size:2rem}h2{font-size:1.5rem}h3{font-size:1.25rem}.btn{padding:.625rem 1.25rem}.btn-large{padding:.875rem 1.75rem;font-size:1rem}}[data-theme=dark] .grade-card,[data-theme=dark] .problem-card,[data-theme=dark] .reading-card,[data-theme=dark] .story-writer,[data-theme=dark] .story-prompt-card{background:var(--bg-secondary);box-shadow:var(--shadow-md)}[data-theme=dark] .grade-card-header{background:var(--bg-tertiary);color:var(--text-primary)}[data-theme=dark] .loading-message,[data-theme=dark] .error-message{background:var(--bg-secondary);color:var(--text-primary)}[data-theme=dark] .error-message{background:#7f1d1d;color:#fecaca}[data-theme=dark] .topic-link{background:var(--bg-tertiary);border:1px solid var(--border-color)}[data-theme=dark] .topic-link:hover{background:#4b5563;border-color:var(--primary-color)}[data-theme=dark] .topic-link-disabled{background:var(--bg-tertiary);opacity:.6}[data-theme=dark] .problem-header,[data-theme=dark] .reading-header,[data-theme=dark] .story-header{border-bottom-color:var(--border-color)}[data-theme=dark] .problem-counter,[data-theme=dark] .reading-counter,[data-theme=dark] .story-progress{background:var(--bg-tertiary);color:var(--text-primary)}[data-theme=dark] .problem-difficulty{background:var(--bg-tertiary);color:var(--text-secondary)}[data-theme=dark] .problem-question,[data-theme=dark] .reading-question,[data-theme=dark] .passage-paragraph{color:var(--text-primary)}[data-theme=dark] .reading-divider{background:linear-gradient(to right,transparent,var(--border-color),transparent)}[data-theme=dark] .story-input-section{background:var(--bg-tertiary);border-color:var(--border-color)}[data-theme=dark] .segment-content{background:var(--bg-tertiary);border-left-color:var(--primary-color)}[data-theme=dark] .segment-image-placeholder{background:linear-gradient(135deg,var(--bg-tertiary) 0%,var(--border-color) 100%)}[data-theme=dark] .score-tracker{background:var(--bg-secondary);box-shadow:var(--shadow-sm)}[data-theme=dark] .score-dot.unanswered{background:var(--bg-tertiary);border-color:var(--border-color)}[data-theme=dark] .feedback-correct{background-color:#064e3b;border-color:#10b981;color:#d1fae5}[data-theme=dark] .feedback-incorrect{background-color:#7f1d1d;border-color:#ef4444;color:#fecaca}[data-theme=dark] .correct-answer{background:#0000004d}[data-theme=dark] .story-complete{background:linear-gradient(135deg,#78350f,#92400e);color:#fef3c7}[data-theme=dark] .story-complete h2,[data-theme=dark] .story-complete p{color:#fef3c7}[data-theme=dark] .chatbot-window{background:var(--bg-secondary);box-shadow:var(--shadow-lg)}[data-theme=dark] .chatbot-header{background:var(--primary-color)}[data-theme=dark] .chatbot-messages{background:var(--bg-tertiary)}[data-theme=dark] .bot-message .message-content{background:var(--bg-secondary);color:var(--text-primary)}[data-theme=dark] .user-message .message-content{background:var(--primary-color);color:#fff}[data-theme=dark] .chatbot-input-container{background:var(--bg-secondary);border-top-color:var(--border-color)}[data-theme=dark] .chatbot-input{background:var(--bg-tertiary);border-color:var(--border-color);color:var(--text-primary)}[data-theme=dark] .chatbot-input::placeholder{color:var(--text-tertiary)}[data-theme=dark] .hero-section{background:linear-gradient(135deg,#1e3a8a,#6366f1)}[data-theme=dark] .hero{background:transparent}[data-theme=dark] .hero h1,[data-theme=dark] .hero h2{color:var(--text-primary)}[data-theme=dark] .how-it-works{background-color:var(--bg-secondary)}[data-theme=dark] .cta-section{background:var(--bg-secondary)}[data-theme=dark] h1,[data-theme=dark] h2,[data-theme=dark] h3,[data-theme=dark] h4,[data-theme=dark] h5,[data-theme=dark] h6{color:var(--text-primary)}[data-theme=dark] p,[data-theme=dark] .page-description,[data-theme=dark] .practice-subtitle,[data-theme=dark] .encouragement-message p{color:var(--text-secondary)}[data-theme=dark] .prompt-content{background:#0000004d}[data-theme=dark] .starting-prompt,[data-theme=dark] .guiding-questions h3,[data-theme=dark] .guiding-questions li{color:#fff}[data-theme=dark] .btn-hint{background:#78350f;border-color:#f59e0b;color:#fde68a}[data-theme=dark] .btn-hint:hover{background:#92400e;border-color:#fbbf24}[data-theme=dark] .hint-content{background:#78350f4d;border-left-color:#f59e0b}[data-theme=dark] .hint-content p,[data-theme=dark] .hint{color:#fde68a}[data-theme=dark] .scratchpad-overlay{background-color:#000000b3}[data-theme=dark] .scratchpad-container{background:var(--bg-secondary);box-shadow:0 8px 32px #00000080}[data-theme=dark] .scratchpad-toolbar{background:var(--bg-tertiary);border-bottom-color:var(--border-color)}[data-theme=dark] .tool-group label{color:var(--text-primary)}[data-theme=dark] .tool-btn{background:var(--bg-secondary);border-color:var(--border-color);color:var(--text-primary)}[data-theme=dark] .tool-btn:hover{border-color:var(--primary-color)}[data-theme=dark] .tool-btn.active{background:var(--primary-color);color:#fff}