:root{--font-display:"Outfit", -apple-system, BlinkMacSystemFont, sans-serif;--font-body:"Inter", -apple-system, BlinkMacSystemFont, sans-serif;--font-mono:"JetBrains Mono", monospace;--bg-primary:#0a0d14;--bg-secondary:#101626;--bg-surface:#141c2e;--bg-card:#141c2ed9;--bg-card-hover:#1c263ef2;--bg-card-glass:#12192aa6;--border-subtle:#ffffff14;--border-medium:#ffffff24;--border-highlight:#6366f159;--text-primary:#f8fafc;--text-secondary:#94a3b8;--text-muted:#64748b;--text-faint:#475569;--accent-primary:#6366f1;--accent-primary-hover:#4f46e5;--accent-primary-subtle:#6366f11f;--accent-primary-glow:#6366f147;--accent-success:#10b981;--accent-success-subtle:#10b98124;--accent-warning:#f59e0b;--accent-warning-subtle:#f59e0b24;--accent-danger:#f43f5e;--accent-danger-subtle:#f43f5e24;--accent-flame:#f97316;--accent-flame-subtle:#f9731624;--accent-gold:#fbbf24;--shadow-sm:0 2px 8px #0000004d;--shadow-md:0 8px 24px -4px #00000073;--shadow-lg:0 16px 36px -6px #0000008c;--shadow-glow:0 0 24px var(--accent-primary-glow);--radius-sm:8px;--radius-md:12px;--radius-lg:18px;--radius-xl:24px;--radius-full:9999px;--transition-fast:.15s cubic-bezier(.4, 0, .2, 1);--transition-normal:.25s cubic-bezier(.4, 0, .2, 1);--transition-bounce:.4s cubic-bezier(.34, 1.56, .64, 1)}[data-theme=light]{--bg-primary:#f8fafc;--bg-secondary:#f1f5f9;--bg-surface:#fff;--bg-card:#ffffffe6;--bg-card-hover:#fff;--bg-card-glass:#fffc;--border-subtle:#00000012;--border-medium:#0000001f;--border-highlight:#6366f14d;--text-primary:#0f172a;--text-secondary:#475569;--text-muted:#64748b;--text-faint:#94a3b8;--accent-primary-subtle:#6366f114;--accent-primary-glow:#6366f12e;--shadow-sm:0 2px 8px #0000000d;--shadow-md:0 8px 24px -4px #00000014;--shadow-lg:0 16px 36px -6px #0000001f}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0}html,body{width:100%;min-height:100%;font-family:var(--font-body);background-color:var(--bg-primary);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.5;overflow-x:hidden}body:before{content:"";pointer-events:none;z-index:0;background:radial-gradient(circle,#6366f11f 0%,#0000 70%);width:500px;height:500px;position:fixed;top:-150px;right:-100px}body:after{content:"";pointer-events:none;z-index:0;background:radial-gradient(circle,#f9731614 0%,#0000 70%);width:600px;height:600px;position:fixed;bottom:-200px;left:-100px}#root{z-index:1;flex-direction:column;min-height:100vh;display:flex;position:relative}.app-container{width:100%;max-width:960px;padding:0 1rem calc(5.5rem + env(safe-area-inset-bottom)) 1rem;flex:1;margin:0 auto}@media (width>=768px){.app-container{padding:0 2rem 4rem}}h1,h2,h3,h4,.font-display{font-family:var(--font-display);letter-spacing:-.02em;font-weight:700}.navbar{z-index:50;background:var(--bg-card-glass);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--border-subtle);margin-bottom:1.5rem;padding:.85rem 1.5rem;position:sticky;top:0}.nav-content{justify-content:space-between;align-items:center;max-width:960px;margin:0 auto;display:flex}.brand-logo{font-family:var(--font-display);color:var(--text-primary);cursor:pointer;align-items:center;gap:.65rem;font-size:1.25rem;font-weight:700;text-decoration:none;display:flex}.brand-badge{text-transform:uppercase;letter-spacing:.05em;border-radius:var(--radius-full);background:var(--accent-primary-subtle);color:var(--accent-primary);border:1px solid var(--border-highlight);padding:.15rem .45rem;font-size:.65rem;font-weight:600}.desktop-nav{align-items:center;gap:.35rem;display:none}@media (width>=768px){.desktop-nav{display:flex}}.nav-item{border-radius:var(--radius-md);color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast);background:0 0;border:none;align-items:center;gap:.45rem;padding:.5rem .85rem;font-size:.9rem;font-weight:500;display:flex}.nav-item:hover{color:var(--text-primary);background:#ffffff0d}.nav-item.active{color:var(--accent-primary);background:var(--accent-primary-subtle);font-weight:600}.nav-actions{align-items:center;gap:.5rem;display:flex}.mobile-bottom-nav{z-index:50;background:var(--bg-card-glass);-webkit-backdrop-filter:blur(20px);border-top:1px solid var(--border-subtle);padding:.5rem .5rem calc(.5rem + env(safe-area-inset-bottom));justify-content:space-around;display:flex;position:fixed;bottom:0;left:0;right:0}@media (width>=768px){.mobile-bottom-nav{display:none}}.mobile-nav-btn{border-radius:var(--radius-md);color:var(--text-muted);cursor:pointer;transition:all var(--transition-fast);background:0 0;border:none;flex-direction:column;align-items:center;gap:.2rem;padding:.35rem .75rem;font-size:.7rem;font-weight:500;display:flex}.mobile-nav-btn.active{color:var(--accent-primary)}.mobile-nav-btn.active svg{transform:translateY(-2px)}.card{background:var(--bg-card);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:transform var(--transition-normal), box-shadow var(--transition-normal), border-color var(--transition-normal);padding:1.5rem}.card:hover{border-color:var(--border-medium)}.card-elevated{box-shadow:var(--shadow-md);border-color:var(--border-medium)}.btn{font-family:var(--font-body);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);-webkit-user-select:none;user-select:none;border:1px solid #0000;justify-content:center;align-items:center;gap:.5rem;padding:.7rem 1.4rem;font-size:.95rem;font-weight:600;text-decoration:none;display:inline-flex}.btn:active{transform:scale(.98)}.btn-primary{background:linear-gradient(135deg, var(--accent-primary) 0%, #4338ca 100%);color:#fff;box-shadow:0 4px 14px var(--accent-primary-glow);border:1px solid #ffffff26}.btn-primary:hover{background:linear-gradient(135deg, #7073f3 0%, var(--accent-primary) 100%);box-shadow:0 6px 20px var(--accent-primary-glow)}.btn-secondary{color:var(--text-primary);border:1px solid var(--border-subtle);background:#ffffff0d}.btn-secondary:hover{border-color:var(--border-medium);background:#ffffff1a}.btn-success{background:var(--accent-success-subtle);color:var(--accent-success);border:1px solid #10b9814d}.btn-success:hover{background:#10b98140}.btn-danger{background:var(--accent-danger-subtle);color:var(--accent-danger);border:1px solid #f43f5e4d}.btn-danger:hover{background:#f43f5e40}.btn-icon{border-radius:var(--radius-md);width:2.5rem;height:2.5rem;color:var(--text-secondary);border:1px solid var(--border-subtle);cursor:pointer;background:#ffffff0a;justify-content:center;align-items:center;padding:0;display:flex}.btn-icon:hover{color:var(--text-primary);background:#ffffff17}.badge{border-radius:var(--radius-full);text-transform:capitalize;align-items:center;gap:.35rem;padding:.2rem .6rem;font-size:.75rem;font-weight:600;display:inline-flex}.badge-mastered{background:var(--accent-success-subtle);color:var(--accent-success);border:1px solid #10b98140}.badge-learning{background:var(--accent-warning-subtle);color:var(--accent-warning);border:1px solid #f59e0b40}.badge-practice{background:var(--accent-danger-subtle);color:var(--accent-danger);border:1px solid #f43f5e40}.badge-streak{background:var(--accent-flame-subtle);color:var(--accent-flame);font-family:var(--font-display);border:1px solid #f9731640}.sync-pill{border-radius:var(--radius-full);color:var(--text-muted);border:1px solid var(--border-subtle);cursor:pointer;transition:all var(--transition-fast);background:#ffffff0d;align-items:center;gap:.4rem;padding:.3rem .75rem;font-size:.75rem;display:inline-flex}.sync-pill:hover{color:var(--text-secondary);background:#ffffff14}.sync-dot{background:var(--accent-success);border-radius:50%;width:6px;height:6px}.sync-dot.syncing{background:var(--accent-warning);animation:1.2s ease-in-out infinite pulseDot}.sync-dot.offline{background:var(--text-muted)}@keyframes pulseDot{0%,to{opacity:.4;transform:scale(.9)}50%{opacity:1;transform:scale(1.2)}}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:.3s cubic-bezier(.16,1,.3,1) forwards fadeIn}.word-learning-card{background:var(--bg-card);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid var(--border-medium);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);text-align:center;transition:all var(--transition-normal);flex-direction:column;align-items:center;padding:2.5rem 2rem;display:flex;position:relative;overflow:hidden}.word-hero-title{font-family:var(--font-display);letter-spacing:-.03em;color:var(--text-primary);margin-bottom:.5rem;font-size:2.75rem;font-weight:800;line-height:1.15}@media (width>=640px){.word-hero-title{font-size:3.5rem}}.word-meaning-box{border:1px solid var(--border-subtle);border-radius:var(--radius-lg);text-align:left;background:#ffffff08;width:100%;margin-top:1.5rem;padding:1.5rem}.example-quote{color:var(--text-primary);border-left:3px solid var(--accent-primary);margin:.75rem 0;padding-left:1rem;font-size:1.05rem;font-style:italic;line-height:1.6}.usage-note{color:var(--text-secondary);border-radius:var(--radius-md);border:1px solid var(--border-highlight);background:#6366f10f;margin-top:.75rem;padding:.75rem 1rem;font-size:.9rem}.quiz-option-btn{text-align:left;border:1px solid var(--border-subtle);border-radius:var(--radius-lg);width:100%;color:var(--text-primary);cursor:pointer;transition:all var(--transition-fast);background:#ffffff08;align-items:center;gap:1rem;padding:1.1rem 1.25rem;font-size:1rem;font-weight:500;display:flex}.quiz-option-btn:hover:not(:disabled){border-color:var(--border-medium);background:#ffffff12;transform:translateY(-1px)}.quiz-option-btn.selected{border-color:var(--accent-primary);background:var(--accent-primary-subtle)}.quiz-option-btn.correct{border-color:var(--accent-success);background:var(--accent-success-subtle);color:var(--accent-success)}.quiz-option-btn.incorrect{border-color:var(--accent-danger);background:var(--accent-danger-subtle);color:var(--accent-danger)}.option-letter{border-radius:var(--radius-md);background:#ffffff0f;flex-shrink:0;justify-content:center;align-items:center;width:2rem;height:2rem;font-size:.85rem;font-weight:700;display:flex}.modal-overlay{z-index:100;-webkit-backdrop-filter:blur(8px);background:#000000bf;justify-content:center;align-items:flex-end;padding:0;display:flex;position:fixed;inset:0}.modal-content{background:var(--bg-surface);border:1px solid var(--border-medium);width:100%;max-width:560px;max-height:88vh;box-shadow:var(--shadow-lg);padding:1.5rem 1.25rem calc(1.5rem + env(safe-area-inset-bottom)) 1.25rem;border-radius:24px 24px 0 0;animation:.28s cubic-bezier(.16,1,.3,1) slideUpModal;position:relative;overflow-y:auto}@media (width>=640px){.modal-overlay{align-items:center;padding:1.5rem}.modal-content{border-radius:var(--radius-xl);padding:2rem;animation:.25s cubic-bezier(.16,1,.3,1) fadeIn}}@keyframes slideUpModal{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{border-radius:var(--radius-full);background:#ffffff1f}::-webkit-scrollbar-thumb:hover{background:#fff3}.today-hero-actions{flex-direction:column;gap:.75rem;width:100%;display:flex}.today-hero-actions .btn{width:100%;min-height:48px}@media (width>=640px){.today-hero-actions{flex-direction:row;align-items:center;width:auto}.today-hero-actions .btn{width:auto}}.learning-bottom-bar{flex-direction:column;gap:.75rem;width:100%;margin-top:.5rem;display:flex}.learning-confidence-btns{grid-template-columns:1fr 1fr;gap:.75rem;width:100%;display:grid}.learning-confidence-btns .btn{width:100%;min-height:48px;padding:.75rem .5rem;font-size:.92rem}.learning-nav-btns{grid-template-columns:1fr 1fr;gap:.75rem;width:100%;display:grid}.learning-nav-btns .btn{width:100%;min-height:44px}@media (width>=640px){.learning-bottom-bar{flex-direction:row;justify-content:space-between;align-items:center}.learning-confidence-btns{width:auto;display:flex}.learning-confidence-btns .btn{width:auto}.learning-nav-btns{gap:.75rem;width:auto;display:flex}.learning-nav-btns .btn{width:auto}}.review-action-btns{grid-template-columns:1fr 1fr;gap:.75rem;width:100%;margin-top:.5rem;display:grid}.review-action-btns .btn{width:100%;min-height:48px}@media (width>=640px){.review-action-btns{justify-content:center;gap:1rem;width:auto;display:flex}.review-action-btns .btn{width:auto;max-width:200px}}.quiz-summary-actions{flex-direction:column;gap:.75rem;width:100%;display:flex}.quiz-summary-actions .btn{width:100%;min-height:48px}@media (width>=640px){.quiz-summary-actions{flex-direction:row;justify-content:center;width:auto}.quiz-summary-actions .btn{width:auto}}@media (width<=768px){input[type=text],input[type=password],input[type=search],select,textarea{font-size:16px!important}.btn-icon{min-width:40px;min-height:40px}.mobile-nav-btn{min-height:48px}.card{padding:1.25rem 1rem}.word-learning-card{padding:1.75rem 1.25rem}.word-hero-title{font-size:clamp(2rem,9vw,2.75rem)}}