@import"https://fonts.googleapis.com/css2?family=Baloo+2:wght@500;700;800&family=Nunito:wght@400;600;700;800&display=swap";:root{--c-primary: #4361ee;--c-primary-dark: #3a0ca3;--c-primary-light: #a5b4fc;--c-secondary: #06d6a0;--c-accent: #ff9f1c;--c-accent-hot: #ef476f;--c-purple: #7209b7;--c-teal: #00b4d8;--c-success: #06d6a0;--c-warning: #ffd166;--c-danger: #ef476f;--c-text: #1a1a2e;--c-text-muted: #64748b;--c-card: rgba(255, 255, 255, .92);--c-card-border: rgba(99, 102, 241, .1);--font-heading: "Baloo 2", "Trebuchet MS", cursive;--font-body: "Nunito", "Segoe UI", sans-serif;--r-sm: 14px;--r-md: 20px;--r-lg: 28px;--r-pill: 999px;--shadow-card: 0 8px 30px rgba(67, 97, 238, .08);--shadow-hover: 0 14px 40px rgba(67, 97, 238, .16);--shadow-btn: 0 6px 20px rgba(67, 97, 238, .18);--ease: .2s ease}*{box-sizing:border-box}body{margin:0;min-height:100vh;font-family:var(--font-body);color:var(--c-text);background:radial-gradient(circle at 10% 10%,rgba(67,97,238,.08),transparent 40%),radial-gradient(circle at 90% 80%,rgba(255,159,28,.08),transparent 40%),linear-gradient(180deg,#eef2ff,#fef9ef)}button,input,select,textarea{font:inherit}button{cursor:pointer}#root{min-height:100vh}h1,h2,h3,h4{font-family:var(--font-heading);margin:0;line-height:1.2}p{margin:4px 0}a{color:var(--c-primary)}.eyebrow{text-transform:uppercase;letter-spacing:.12em;font-size:.7rem;font-weight:800;margin:0 0 6px;color:var(--c-primary)}.muted{color:var(--c-text-muted)}.app-shell{display:grid;grid-template-columns:260px 1fr;min-height:100vh}.sidebar{background:linear-gradient(180deg,#4361ee,#3a0ca3);color:#fff;padding:24px 20px;display:flex;flex-direction:column;gap:20px;position:sticky;top:0;height:100vh;overflow-y:auto}.sidebar .eyebrow{color:#fff9}.sidebar .muted{color:#ffffffb3}.brand h1{font-size:1.8rem;line-height:1;margin-bottom:4px}.mobile-toggle{display:none;position:fixed;top:12px;left:12px;z-index:200;background:var(--c-primary);color:#fff;border:none;border-radius:var(--r-sm);padding:10px 14px;font-size:1.3rem;box-shadow:var(--shadow-btn)}.sidebar-backdrop{display:none}.xp-panel{background:#ffffff1f;border-radius:var(--r-md);padding:14px}.xp-panel h3{font-size:1rem;margin-bottom:6px}.xp-bar{height:10px;background:#ffffff26;border-radius:var(--r-pill);overflow:hidden;margin:8px 0 4px}.xp-bar-fill{height:100%;border-radius:var(--r-pill);background:linear-gradient(90deg,var(--c-accent),var(--c-accent-hot));transition:width .6s ease}.xp-stats{display:flex;justify-content:space-between;font-size:.75rem;color:#fff9}.user-panel{background:#ffffff1a;border-radius:var(--r-md);padding:14px;display:grid;gap:6px}.user-panel h3{font-size:1rem}.nav-links{display:flex;flex-direction:column;gap:6px;flex:1}.nav-links a{color:#fff;text-decoration:none;padding:12px 14px;border-radius:var(--r-sm);font-weight:700;font-size:.95rem;display:flex;align-items:center;gap:10px;transition:background var(--ease),transform var(--ease),box-shadow var(--ease)}.nav-links a:hover{background:#ffffff24;transform:translate(3px)}.nav-links a.active{background:#ffffff38;box-shadow:0 4px 16px #00000026}.nav-emoji{font-size:1.2rem}.page-shell{padding:24px 28px;overflow-y:auto}.page-header{display:flex;justify-content:space-between;align-items:end;gap:16px;margin-bottom:20px}.page-grid{display:grid;gap:20px}.card,.hero,.stat-card{background:var(--c-card);border:1px solid var(--c-card-border);border-radius:var(--r-lg);padding:22px;box-shadow:var(--shadow-card);transition:box-shadow var(--ease),transform var(--ease)}.card:hover{box-shadow:var(--shadow-hover)}.hero{position:relative;overflow:hidden;background:linear-gradient(135deg,#667eea,#764ba2,#f093fb);color:#fff}.hero .eyebrow{color:#ffffffb3}.hero .muted{color:#fffc}.hero-emoji{position:absolute;right:20px;top:16px;font-size:2.5rem;opacity:.7}.child-hero{background:linear-gradient(135deg,#4361ee,#7209b7,#f72585)}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px}.stat-card{text-align:center;padding:18px;background:#fff}.stat-card .stat-icon{font-size:1.6rem;margin-bottom:4px}.stat-card h3{font-size:2rem;color:var(--c-primary)}.section-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:12px}.topic-list,.activity-list,.question-stack{display:grid;gap:12px}.topic-row,.activity-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px;border-radius:var(--r-md);background:#ffffffb3;border:1px solid var(--c-card-border);transition:transform var(--ease),box-shadow var(--ease)}.topic-row:hover,.activity-row:hover{transform:translateY(-2px);box-shadow:0 8px 24px #4361ee1a}.right-align{text-align:right}.pill,.chip{border-radius:var(--r-pill);padding:8px 14px;font-weight:800;font-size:.85rem;border:none;background:#e8ecff;color:var(--c-primary-dark)}.pill.success{background:#d4fae5;color:#0a6640}.pill.warning{background:#fff0cc;color:#7a5200}.pill.danger{background:#ffe0e6;color:#a8071a}.chip-row{display:flex;flex-wrap:wrap;gap:10px}.chip{padding:10px 18px;cursor:pointer;transition:transform var(--ease),background var(--ease),box-shadow var(--ease)}.chip:hover{transform:translateY(-2px);box-shadow:0 6px 18px #4361ee26}.chip.selected,.option.selected{background:linear-gradient(135deg,var(--c-primary),var(--c-primary-dark));color:#fff;box-shadow:0 6px 20px #4361ee4d}.question-topline{display:flex;justify-content:space-between;align-items:center;gap:16px}.practice-card h3{font-size:1.4rem}.option-list{display:grid;gap:10px;margin:16px 0}.option-list.compact{grid-template-columns:repeat(2,1fr)}.option{display:flex;gap:12px;align-items:center;width:100%;border:2px solid var(--c-card-border);background:#fff;color:inherit;border-radius:var(--r-md);padding:14px;text-align:left;font-weight:600;transition:transform var(--ease),border-color var(--ease),box-shadow var(--ease)}.option:hover:not(:disabled){transform:translateY(-2px);border-color:var(--c-primary-light);box-shadow:0 8px 24px #4361ee1f}.option:disabled{opacity:.7;cursor:default}.option strong{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#eef0ff;color:var(--c-primary);font-size:.85rem;flex-shrink:0}.option.selected strong{background:#ffffff40;color:#fff}.mini-question{border:1px solid var(--c-card-border);border-radius:var(--r-md);padding:16px;background:#fffc}.primary-button{border:none;border-radius:var(--r-sm);padding:14px 22px;font-weight:800;font-size:1rem;background:linear-gradient(135deg,var(--c-accent),#e68a00);color:#fff;box-shadow:0 6px 20px #ff9f1c4d;transition:transform var(--ease),box-shadow var(--ease)}.primary-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 10px 28px #ff9f1c66}.primary-button:disabled{opacity:.5}.secondary-button,.danger-button{border:none;border-radius:var(--r-sm);padding:10px 16px;font-weight:800;transition:transform var(--ease)}.secondary-button{background:linear-gradient(135deg,#e8ecff,#dbe4ff);color:var(--c-primary-dark)}.danger-button{background:linear-gradient(135deg,#ffe0e6,#ffd0d8);color:#a8071a}.secondary-button:hover,.danger-button:hover{transform:translateY(-1px)}.button-row{display:flex;gap:10px;flex-wrap:wrap}.feedback{border-radius:var(--r-md);padding:18px;animation:slideUp .3s ease}.feedback.correct{background:linear-gradient(135deg,#d4fae5,#b8f5d8);border:1px solid rgba(6,214,160,.2)}.feedback.incorrect{background:linear-gradient(135deg,#fff0cc,#ffe8b0);border:1px solid rgba(255,209,102,.3)}.feedback h4{font-size:1.2rem;margin-bottom:8px}.xp-earned{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:var(--r-pill);background:linear-gradient(135deg,var(--c-accent-hot),#d63384);color:#fff;font-weight:800;font-size:.9rem;animation:xpPop .5s ease;margin:8px 0}.timer-pill{padding:10px 16px;border-radius:var(--r-pill);background:#e8ecff;font-weight:800;font-size:1rem;font-family:var(--font-heading)}.timer-pill.danger{background:linear-gradient(135deg,#ffe0e6,#ffd0d8);color:#a8071a;animation:pulse 1s ease infinite}.stack-form{display:grid;gap:12px}.stack-form input,.stack-form select,.stack-form textarea{width:100%;border:2px solid var(--c-card-border);border-radius:var(--r-sm);padding:12px;background:#fff;transition:border-color var(--ease)}.stack-form input:focus,.stack-form select:focus,.stack-form textarea:focus{outline:none;border-color:var(--c-primary-light);box-shadow:0 0 0 3px #4361ee1a}.form-row{display:flex;gap:12px;align-items:center}.two-up{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:center}.toggle-row{display:flex;align-items:center;gap:10px}.toggle-row input{width:auto}.option-editor{display:grid;grid-template-columns:24px 1fr;gap:10px;align-items:center}.code-textarea{font-family:Consolas,Courier New,monospace;font-size:.85rem}.data-table{width:100%;border-collapse:collapse}.data-table th,.data-table td{text-align:left;padding:12px 10px;border-bottom:1px solid var(--c-card-border)}.data-table th{font-weight:800;color:var(--c-primary-dark);font-size:.85rem;text-transform:uppercase;letter-spacing:.05em}.admin-layout{align-items:start}.split-card{display:grid;grid-template-columns:1fr 1fr;gap:24px}.admin-list{display:grid;gap:12px;margin-top:16px}.admin-item{display:flex;justify-content:space-between;gap:16px;align-items:start;padding:14px;border-radius:var(--r-md);background:#fffc;border:1px solid var(--c-card-border)}.auth-screen{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 30% 20%,rgba(67,97,238,.12),transparent 40%),radial-gradient(circle at 70% 80%,rgba(255,159,28,.1),transparent 40%),linear-gradient(180deg,#eef2ff,#fef9ef)}.auth-card{width:min(100%,480px);padding:36px;border-radius:var(--r-lg);background:#fff;border:1px solid var(--c-card-border);box-shadow:0 20px 50px #4361ee1f;text-align:center}.auth-card h1{margin-bottom:8px;font-size:1.6rem}.auth-emoji{font-size:3rem;margin-bottom:8px}.auth-help{margin-top:20px;padding:14px 16px;border-radius:var(--r-sm);background:#f8f9ff;text-align:left}.auth-error{margin:0;color:var(--c-danger);font-weight:700}.loading-screen{min-height:100vh;display:grid;place-items:center;font-size:1.2rem;font-family:var(--font-heading);color:var(--c-primary)}.progress-ring{display:inline-block}.progress-ring circle{transition:stroke-dashoffset .6s ease}.lesson-list{display:grid;gap:14px}.lesson-card{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px;border-radius:var(--r-md);background:#fff;border:2px solid var(--c-card-border);cursor:pointer;transition:transform var(--ease),box-shadow var(--ease),border-color var(--ease)}.lesson-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-hover);border-color:var(--c-primary-light)}.lesson-card.completed{border-color:var(--c-secondary)}.lesson-card.completed .lesson-status{color:var(--c-secondary)}.lesson-status{font-size:1.5rem}.lesson-viewer{border-radius:var(--r-lg);background:#fff;border:1px solid var(--c-card-border);box-shadow:var(--shadow-card);overflow:hidden}.lesson-progress-bar{height:6px;background:#eef0ff}.lesson-progress-fill{height:100%;background:linear-gradient(90deg,var(--c-primary),var(--c-secondary));transition:width .4s ease;border-radius:0 3px 3px 0}.lesson-step{padding:28px;animation:fadeIn .3s ease}.step-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:var(--r-pill);font-weight:800;font-size:.8rem;margin-bottom:12px}.lesson-step h2{margin-bottom:12px}.lesson-content{font-size:1.05rem;line-height:1.8;white-space:pre-line}.hint-box{margin-top:16px;padding:16px;border-radius:var(--r-sm);background:#fff8e6;border:2px dashed var(--c-warning)}.lesson-nav{display:flex;justify-content:space-between;align-items:center;padding:18px 28px;border-top:1px solid var(--c-card-border);background:#fafbff}.step-counter{font-weight:700;color:var(--c-text-muted)}.action-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px}.action-card{display:flex;flex-direction:column;align-items:center;gap:8px;padding:22px 16px;border-radius:var(--r-lg);background:#fff;border:2px solid var(--c-card-border);text-decoration:none;color:var(--c-text);font-weight:700;text-align:center;transition:transform var(--ease),box-shadow var(--ease),border-color var(--ease)}.action-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-hover);border-color:var(--c-primary-light)}.action-card .action-emoji{font-size:2rem}.action-card h3{font-size:1rem}.streak-badge{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;border-radius:var(--r-pill);background:linear-gradient(135deg,#fff0cc,#ffe0b0);font-weight:800;font-size:.9rem}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes xpPop{0%{transform:scale(.5);opacity:0}60%{transform:scale(1.2)}to{transform:scale(1);opacity:1}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}@media (max-width: 900px){.mobile-toggle{display:block}.app-shell{grid-template-columns:1fr}.sidebar{position:fixed;top:0;right:0;bottom:0;left:0;z-index:150;width:280px;transform:translate(-100%);transition:transform .3s ease}.sidebar.open{transform:translate(0)}.sidebar-backdrop{display:block;position:fixed;top:0;right:0;bottom:0;left:0;z-index:140;background:#0006;opacity:0;pointer-events:none;transition:opacity .3s ease}.sidebar-backdrop.visible{opacity:1;pointer-events:auto}.page-shell{padding:60px 16px 24px}.stats-grid{grid-template-columns:1fr 1fr}.split-card,.option-list.compact{grid-template-columns:1fr}.action-grid{grid-template-columns:1fr 1fr}.two-up{grid-template-columns:1fr}.page-header,.section-header,.topic-row,.activity-row,.question-topline{flex-direction:column;align-items:start}.admin-item{flex-direction:column}}@media (max-width: 500px){.stats-grid,.action-grid{grid-template-columns:1fr}.auth-card{padding:24px 20px}}