@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap";.app-layout{background:var(--color-surface);flex-direction:column;min-height:100vh;display:flex}.app-topbar{z-index:var(--z-sticky);background:var(--color-background);border-bottom:1px solid var(--color-border);height:var(--topbar-height);position:sticky;top:0}.app-topbar-inner{height:100%;padding:0 var(--space-4);max-width:var(--content-max-width);justify-content:space-between;align-items:center;margin:0 auto;display:flex}.app-topbar-left{align-items:center;gap:var(--space-2);display:flex}.app-topbar-logo{object-fit:cover;border-radius:50%;width:30px;height:30px}.app-topbar-title{font-size:var(--text-base);font-weight:var(--font-bold);color:var(--color-text)}.app-topbar-right{align-items:center;gap:var(--space-1);display:flex}.theme-toggle{cursor:pointer;background:0 0;border:none;border-radius:20px;align-items:center;gap:6px;padding:4px 8px;transition:background .2s;display:flex}.theme-toggle:hover{background:var(--color-border)}.theme-toggle-icon{font-size:14px;line-height:1;transition:transform .3s}.theme-toggle:hover .theme-toggle-icon{transform:rotate(20deg)scale(1.15)}.theme-toggle-track{background:var(--color-border);border-radius:10px;flex-shrink:0;width:34px;height:18px;transition:background .3s;position:relative}.theme-toggle:hover .theme-toggle-track{background:var(--color-primary);opacity:.5}.theme-toggle-thumb{background:var(--color-primary);border-radius:50%;width:14px;height:14px;transition:left .25s cubic-bezier(.4,0,.2,1),background .25s;position:absolute;top:2px;box-shadow:0 1px 4px #0000004d}.theme-toggle-thumb.dark{left:2px}.theme-toggle-thumb.light{left:calc(100% - 16px)}.app-main{padding:var(--space-4) var(--space-4) calc(var(--bottom-nav-height) + var(--space-4));max-width:var(--content-max-width);flex:1;width:100%;margin:0 auto}.app-bottom-nav{z-index:var(--z-sticky);height:var(--bottom-nav-height);background:var(--color-background);border-top:1px solid var(--color-border);padding:0 var(--space-4);padding-bottom:env(safe-area-inset-bottom,0px);justify-content:space-around;align-items:center;display:flex;position:fixed;bottom:0;left:0;right:0}.app-bottom-nav-item{padding:var(--space-1) var(--space-3);border-radius:var(--radius-md);transition:all var(--transition-fast);color:var(--color-text-muted);flex-direction:column;align-items:center;gap:2px;text-decoration:none;display:flex}.app-bottom-nav-item.active{color:var(--color-primary)}.app-bottom-nav-item:hover{background:var(--color-surface-alt)}.app-bottom-nav-icon{font-size:22px;line-height:1}.app-bottom-nav-label{font-size:11px;font-weight:var(--font-medium)}.app-sidebar{display:none}@media (width>=768px){.app-layout{flex-direction:row}.app-topbar,.app-bottom-nav{display:none}.app-sidebar{background:var(--color-background);border-right:1px solid var(--color-border);width:220px;height:100vh;min-height:100vh;z-index:var(--z-sticky);flex-direction:column;flex-shrink:0;gap:4px;padding:20px 12px;display:flex;position:sticky;top:0}.app-sidebar-logo{border-bottom:1px solid var(--color-border);align-items:center;gap:10px;margin-bottom:8px;padding:4px 12px 20px;display:flex}.app-sidebar-logo-img{object-fit:cover;border-radius:50%;flex-shrink:0;width:34px;height:34px}.app-sidebar-logo-name{color:var(--color-text);white-space:nowrap;text-overflow:ellipsis;font-size:14px;font-weight:700;overflow:hidden}.app-sidebar-links{flex-direction:column;flex:1;gap:2px;display:flex}.app-sidebar-item{border-radius:var(--radius-lg);color:var(--color-text-muted);cursor:pointer;text-align:left;background:0 0;border:none;align-items:center;gap:12px;width:100%;padding:10px 14px;font-size:14px;font-weight:500;text-decoration:none;transition:all .15s;display:flex}.app-sidebar-item:hover{background:var(--color-surface-alt);color:var(--color-text)}.app-sidebar-item.active{background:var(--color-primary-light,#10b9811a);color:var(--color-primary);font-weight:600}.app-sidebar-item.logout:hover{color:#f87171;background:#ef444414}.app-sidebar-icon{text-align:center;flex-shrink:0;width:22px;font-size:18px;line-height:1}.app-sidebar-label{white-space:nowrap}.app-sidebar-footer{border-top:1px solid var(--color-border);flex-direction:column;gap:2px;padding-top:12px;display:flex}.app-main{min-width:0;padding:var(--space-6) var(--space-8);padding-bottom:var(--space-8);flex:1;max-width:900px}}.whatsapp-fab{bottom:calc(var(--bottom-nav-height) + 16px);z-index:100;border-radius:var(--radius-full);width:56px;height:56px;transition:all var(--transition-fast);background:#25d366;flex-direction:column;justify-content:center;align-items:center;gap:2px;text-decoration:none;animation:3s ease-in-out 2s infinite fab-bounce;display:flex;position:fixed;right:16px;box-shadow:0 4px 16px #25d36666}.whatsapp-fab:hover{background:#20ba5a;transform:scale(1.1);box-shadow:0 6px 24px #25d36680}.whatsapp-fab:active{transform:scale(.95)}.whatsapp-fab-label{color:#fff;letter-spacing:.3px;font-size:8px;font-weight:700;line-height:1}@keyframes fab-bounce{0%,90%,to{transform:scale(1)}93%{transform:scale(1.08)}96%{transform:scale(1)}99%{transform:scale(1.05)}}@media (width>=768px){.whatsapp-fab{bottom:24px;right:24px}}.app-support-footer{bottom:var(--bottom-nav-height);z-index:90;justify-content:center;align-items:center;gap:var(--space-2);padding:8px var(--space-4);background:var(--color-background);border-top:1px solid var(--color-border);color:var(--color-text-muted);font-size:12px;display:flex;position:fixed;left:0;right:0}.app-support-email{color:var(--color-primary);font-weight:var(--font-semibold);text-decoration:none;transition:opacity .15s}.app-support-email:hover{opacity:.8;text-decoration:underline}@media (width>=768px){.app-support-footer{border-radius:var(--radius-xl) var(--radius-xl) 0 0;bottom:0}}body.lesson-mode .app-topbar,body.lesson-mode .app-bottom-nav,body.lesson-mode .app-sidebar,body.lesson-mode .whatsapp-fab,body.lesson-mode .app-support-footer{display:none!important}body.lesson-mode .app-main{max-width:100%!important;padding:0!important}.app-bottom-nav-item.install-btn{color:var(--color-primary);cursor:pointer;background:0 0;border:none}.app-sidebar-item.install-btn{color:var(--color-primary)}.app-sidebar-item.install-btn:hover{background:var(--color-primary-light,#10b9811a);color:var(--color-primary)}.pwa-ios-overlay{z-index:9999;padding-bottom:env(safe-area-inset-bottom,0px);background:#0000008c;justify-content:center;align-items:flex-end;animation:.2s fadeIn;display:flex;position:fixed;inset:0}.pwa-ios-modal{background:var(--color-background);border-radius:20px 20px 0 0;width:100%;max-width:500px;padding:28px 24px 32px;animation:.3s cubic-bezier(.34,1.56,.64,1) slideUp}.pwa-ios-title{color:var(--color-text);margin-bottom:20px;font-size:18px;font-weight:700}.pwa-ios-steps{flex-direction:column;gap:14px;margin-bottom:28px;padding-left:20px;display:flex}.pwa-ios-steps li{color:var(--color-text-muted);font-size:15px;line-height:1.5}.pwa-ios-steps li strong{color:var(--color-text)}.pwa-ios-share-icon{background:var(--color-primary);color:#fff;border-radius:6px;padding:1px 5px;font-size:13px;font-style:normal}.pwa-ios-close{background:var(--color-primary);color:#fff;border-radius:var(--radius-lg);cursor:pointer;border:none;width:100%;padding:14px;font-size:16px;font-weight:700;transition:opacity .15s}.pwa-ios-close:hover{opacity:.9}@keyframes slideUp{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}.adm-layout{background:var(--color-surface);min-height:100vh;display:flex}.adm-mobile-topbar{display:none}.adm-sidebar{background:linear-gradient(#0b1326f7 0%,#0f172afc 100%);border-right:1px solid #3b82f61a;flex-direction:column;flex-shrink:0;width:250px;height:100vh;min-height:100vh;display:flex;position:sticky;top:0;overflow-y:auto}.adm-sidebar-header{align-items:center;gap:var(--space-3);padding:var(--space-5) var(--space-4);border-bottom:1px solid #ffffff0f;display:flex}.adm-sidebar-title{color:#fff;font-weight:700;font-size:var(--text-sm);letter-spacing:-.01em}.adm-sidebar-sub{color:#ffffff73;text-overflow:ellipsis;white-space:nowrap;max-width:150px;font-size:11px;overflow:hidden}.adm-nav{padding:var(--space-3) var(--space-2);flex-direction:column;flex:1;gap:2px;display:flex}.adm-nav-item{align-items:center;gap:var(--space-3);color:#ffffff8c;font-size:var(--text-sm);cursor:pointer;border-radius:var(--radius-lg);background:0 0;border:none;width:100%;padding:10px 14px;font-weight:500;text-decoration:none;transition:all .18s;display:flex;position:relative}.adm-nav-item:hover{color:#ffffffe6;background:#3b82f61a}.adm-nav-item.active{color:#fff;background:linear-gradient(135deg,#3b82f62e,#3b82f61a);border:1px solid #3b82f638;box-shadow:0 0 16px #3b82f61a}.adm-nav-item.active:before{content:"";background:#3b82f6;border-radius:9999px;width:3px;position:absolute;top:20%;bottom:20%;left:0;box-shadow:0 0 8px #3b82f680}.adm-nav-icon{text-align:center;flex-shrink:0;width:20px;font-size:16px}.adm-nav-item.danger:hover{color:#fca5a5;background:#ef44441f}.adm-sidebar-footer{padding:var(--space-2);border-top:1px solid #ffffff0f;flex-direction:column;gap:2px;display:flex}.adm-main{padding:var(--space-6);flex:1;max-width:100%;overflow-x:hidden}.adm-overlay{display:none}.adm-hamburger{cursor:pointer;background:0 0;border:none;flex-direction:column;gap:5px;width:28px;padding:4px;display:flex}.adm-hamburger-line{background:var(--color-text);border-radius:2px;width:100%;height:2px;transition:transform .25s,opacity .25s;display:block}.adm-hamburger-line.open:first-child{transform:translateY(7px)rotate(45deg)}.adm-hamburger-line.open:nth-child(2){opacity:0}.adm-hamburger-line.open:nth-child(3){transform:translateY(-7px)rotate(-45deg)}@media (width<=768px){.adm-layout{flex-direction:column}.adm-mobile-topbar{padding:12px var(--space-4);background:var(--color-background);border-bottom:1px solid var(--color-border);z-index:1000;justify-content:space-between;align-items:center;display:flex;position:sticky;top:0}.adm-mobile-topbar-left{align-items:center;gap:var(--space-3);display:flex}.adm-mobile-title{font-weight:700;font-size:var(--text-base);color:var(--color-text)}.adm-mobile-back{border:1px solid var(--color-border);border-radius:var(--radius-lg);font-size:var(--text-xs);color:var(--color-text-muted);cursor:pointer;background:0 0;padding:6px 12px;font-weight:600;transition:all .18s}.adm-mobile-back:hover{background:var(--color-surface);color:var(--color-text)}.adm-sidebar{z-index:1001;width:280px;height:100vh;min-height:unset;transition:transform .3s cubic-bezier(.4,0,.2,1);position:fixed;top:0;bottom:0;left:0;transform:translate(-100%)}.adm-sidebar.open{transform:translate(0)}.adm-overlay{z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#00000080;animation:.2s adm-fadeIn;display:block;position:fixed;inset:0}@keyframes adm-fadeIn{0%{opacity:0}to{opacity:1}}.adm-main{padding:var(--space-4);min-height:calc(100vh - 52px)}}.onboarding{min-height:100vh;padding:var(--space-8) var(--space-4) var(--space-6);flex-direction:column;max-width:480px;margin:0 auto;display:flex}.onboarding-progress{gap:var(--space-2);margin-bottom:var(--space-8);justify-content:center;display:flex}.onboarding-dot{border-radius:var(--radius-full);background:var(--color-border);width:32px;height:6px;transition:all var(--transition)}.onboarding-dot.active{background:var(--color-primary);width:48px}.onboarding-content{text-align:center;flex-direction:column;flex:1;animation:.3s fadeIn;display:flex}.onboarding-emoji{margin-bottom:var(--space-6);font-size:72px}.onboarding-title{font-size:var(--text-2xl);margin-bottom:var(--space-2)}.onboarding-subtitle{font-size:var(--text-base);font-weight:var(--font-semibold);color:var(--color-primary);margin-bottom:var(--space-3)}.onboarding-description{color:var(--color-text-muted);margin-bottom:var(--space-6);line-height:1.7}.onboarding-features{gap:var(--space-3);text-align:left;flex-direction:column;display:flex}.onboarding-feature{align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:var(--color-surface);border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:var(--font-medium);cursor:default;pointer-events:none;-webkit-user-select:none;user-select:none;display:flex}.onboarding-feature-icon{text-align:center;width:32px;font-size:22px}.onboarding-actions{flex-direction:column;align-items:center;display:flex}.no-access-page{min-height:100vh;padding:var(--space-4);background:var(--color-surface);justify-content:center;align-items:center;display:flex}.no-access-inner{text-align:center;width:100%;max-width:480px}.no-access-icon{margin-bottom:var(--space-4);font-size:56px}.no-access-options{gap:var(--space-3);text-align:left;flex-direction:column;display:flex}.no-access-card{padding:var(--space-5);background:var(--color-background);border-radius:var(--radius-lg);border:2px solid var(--color-border);position:relative}.no-access-card.primary{border-color:var(--color-primary);box-shadow:var(--shadow-primary)}.no-access-badge{background:var(--color-primary);color:#fff;font-size:var(--text-xs);font-weight:var(--font-semibold);border-radius:var(--radius-full);white-space:nowrap;padding:2px 12px;position:absolute;top:-12px;left:50%;transform:translate(-50%)}.rl-wrap{flex-direction:column;align-items:center;gap:16px;padding:24px 16px 8px;display:flex}.rl-scene{width:140px;height:120px;position:relative}.rl-svg{filter:drop-shadow(0 6px 12px #00000021);width:120px;height:100px;position:absolute;bottom:0;left:10px;overflow:visible}.rl-body{fill:var(--color-primary)}.rl-lid{fill:var(--color-primary);filter:brightness(1.12)}.rl-clasp{fill:#ffffff38}.rl-clasp-inner{fill:#ffffff6b}.rl-handle{fill:none;stroke:var(--color-primary);filter:brightness(1.18)}.rl-side{stroke:var(--color-primary);stroke-width:4px;stroke-linecap:round;opacity:.55}.rl-lid-group{transform-box:fill-box;transform-origin:50% 100%;animation:.75s cubic-bezier(.34,1.4,.64,1) .35s both rl-lid-open}@keyframes rl-lid-open{0%{opacity:1;transform:translateY(0)scaleY(1)}to{opacity:0;transform:translateY(-28px)scaleY(.15)}}.rl-fi{opacity:0;pointer-events:none;font-size:22px;line-height:1;animation:2.3s ease-in-out infinite rl-float;position:absolute}.rl-fi-1{animation-delay:.9s;bottom:40px;left:14px}.rl-fi-2{animation-delay:1.15s;bottom:40px;left:56px}.rl-fi-3{animation-delay:1.4s;bottom:40px;right:14px}@keyframes rl-float{0%{opacity:0;transform:translateY(0)scale(.55)}18%{opacity:1;transform:translateY(-16px)scale(1.08)}60%{opacity:.75;transform:translateY(-42px)scale(1)}to{opacity:0;transform:translateY(-60px)scale(.8)}}.rl-msg{color:var(--color-text-muted);text-align:center;letter-spacing:.1px;margin:0;font-size:13px;font-weight:500;animation:.35s both rl-fade-in}@keyframes rl-fade-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}.rl-bar-track{background:var(--color-border);border-radius:var(--radius-full);width:160px;height:4px;overflow:hidden}.rl-bar-fill{background:linear-gradient(90deg, transparent 0%, var(--color-primary) 50%, transparent 100%);background-size:200% 100%;width:100%;height:100%;animation:1.5s linear infinite rl-shimmer}@keyframes rl-shimmer{0%{background-position:-100% 0}to{background-position:200% 0}}.dp-card{background:linear-gradient(135deg, var(--color-surface), var(--color-surface-alt));border:1px solid var(--color-border);border-left:4px solid var(--color-primary);border-radius:var(--radius-lg);padding:var(--space-4);gap:var(--space-2);flex-direction:column;display:flex}.dp-header{justify-content:space-between;align-items:center;margin-bottom:2px;display:flex}.dp-label{color:var(--color-primary);text-transform:uppercase;letter-spacing:.5px;font-size:12px;font-weight:700}.dp-ctx{color:var(--color-text-muted);background:var(--color-surface-alt);border:1px solid var(--color-border);border-radius:999px;padding:2px 8px;font-size:10px;font-weight:600}.dp-en{color:var(--color-text);margin:0;font-size:16px;font-style:italic;font-weight:600;line-height:1.5}.dp-es{color:var(--color-text-muted);margin:0;font-size:13px;line-height:1.5}.dp-speak-btn{background:var(--color-primary);color:#fff;border-radius:var(--radius-full);cursor:pointer;transition:all var(--transition-fast);border:none;justify-content:center;align-self:flex-start;align-items:center;gap:6px;min-width:110px;margin-top:4px;padding:7px 16px;font-size:13px;font-weight:600;display:flex}.dp-speak-btn:hover:not(:disabled){background:var(--color-primary-hover);transform:scale(1.03)}.dp-speak-btn:disabled{cursor:default}.dp-speak-btn.dp-speaking{background:var(--color-primary-hover)}.dp-wave{align-items:center;gap:2.5px;height:16px;display:flex}.dp-wave span{background:#fff;border-radius:2px;width:3px;animation:.9s ease-in-out infinite dp-wave-bar}.dp-wave span:first-child{height:6px;animation-delay:0s}.dp-wave span:nth-child(2){height:12px;animation-delay:.15s}.dp-wave span:nth-child(3){height:16px;animation-delay:.3s}.dp-wave span:nth-child(4){height:9px;animation-delay:.45s}@keyframes dp-wave-bar{0%,to{opacity:.7;transform:scaleY(.5)}50%{opacity:1;transform:scaleY(1)}}.fmb-banner{align-items:center;gap:var(--space-5);padding:var(--space-5);border-radius:var(--radius-xl);margin-bottom:var(--space-4);background:linear-gradient(135deg,#10b98114 0%,#3b82f60f 100%);border:1.5px dashed #10b98159;animation:.6s cubic-bezier(.34,1.56,.64,1) fmb-appear;display:flex}@keyframes fmb-appear{0%{opacity:0;transform:translateY(16px)scale(.97)}to{opacity:1;transform:none}}.fmb-figure{flex-direction:column;flex-shrink:0;align-items:center;gap:2px;display:flex}.fmb-head{animation:2.4s ease-in-out infinite fmb-nod;position:relative}.fmb-face{font-size:36px;line-height:1;display:block}@keyframes fmb-nod{0%,to{transform:rotate(0)}25%{transform:rotate(-6deg)}75%{transform:rotate(6deg)}}.fmb-body{align-items:center;gap:2px;margin-top:2px;display:flex}.fmb-torso{background:var(--color-primary);border-radius:4px 4px 6px 6px;width:20px;height:28px}.fmb-arm{font-size:20px;line-height:1}.fmb-arm-left{animation:1.8s ease-in-out infinite fmb-carry}@keyframes fmb-carry{0%,to{transform:translateY(0)}50%{transform:translateY(-3px)}}.fmb-arm-right.fmb-wave{transform-origin:bottom;animation:1.2s ease-in-out infinite fmb-wave-hand}@keyframes fmb-wave-hand{0%,to{transform:rotate(0)}30%{transform:rotate(-25deg)}60%{transform:rotate(15deg)}}.fmb-arrow-row{margin-top:6px}.fmb-arrow-bounce{color:var(--color-primary);font-size:20px;font-weight:800;animation:1s ease-in-out infinite fmb-bounce}@keyframes fmb-bounce{0%,to{transform:translateY(0)}50%{transform:translateY(6px)}}.fmb-content{gap:var(--space-2);flex-direction:column;flex:1;display:flex}.fmb-title{font-size:var(--text-base);font-weight:var(--font-bold);color:var(--color-text);margin:0}.fmb-tip{font-size:var(--text-sm);color:var(--color-text-muted);min-height:40px;margin:0;animation:.4s fmb-tip-fade}@keyframes fmb-tip-fade{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}.fmb-cta{background:var(--color-primary);color:#fff;border-radius:var(--radius-full);cursor:pointer;transition:all var(--transition-fast);border:none;align-self:flex-start;padding:9px 20px;font-size:13px;font-weight:700;box-shadow:0 4px 14px #10b98159}.fmb-cta:hover{background:var(--color-primary-hover);transform:translateY(-2px);box-shadow:0 6px 18px #10b98173}.fmb-cta:active{transform:translateY(0)}.badges-panel{margin-top:var(--space-5);background:var(--color-surface);border-radius:var(--radius-xl);padding:var(--space-4);border:1px solid var(--color-border)}.badges-header{margin-bottom:var(--space-3);justify-content:space-between;align-items:center;display:flex}.badges-title{font-size:var(--text-base);font-weight:var(--font-semibold);color:var(--color-text)}.badges-count{font-size:var(--text-sm);color:var(--color-primary);font-weight:var(--font-semibold);background:var(--color-primary-light);border-radius:var(--radius-full);padding:2px 10px}.badges-grid{gap:var(--space-2);grid-template-columns:repeat(auto-fill,minmax(80px,1fr));display:grid}.badge-item{padding:var(--space-2);border-radius:var(--radius-lg);text-align:center;cursor:default;border:1px solid #0000;flex-direction:column;align-items:center;gap:4px;transition:transform .2s,box-shadow .2s;display:flex}.badge-item:hover{transform:translateY(-2px)}.badge-earned{background:linear-gradient(135deg,#6366f11f,#10b98114);border-color:#6366f140;box-shadow:0 2px 8px #6366f11f}.badge-earned:hover{box-shadow:0 4px 16px #6366f133}.badge-locked{background:var(--color-surface-alt);border-color:var(--color-border);opacity:.5;cursor:pointer}.badge-locked:active{transform:scale(.95)}.badge-tooltip{border-radius:var(--radius-lg);margin-bottom:var(--space-2);cursor:pointer;padding:10px 14px;font-size:13px;line-height:1.4;animation:.25s badgeTipIn}.badge-tooltip-locked{color:#fbbf24;background:#f59e0b1a;border:1px solid #f59e0b4d}.badge-tooltip-earned{color:#34d399;background:#10b9811a;border:1px solid #10b9814d}@keyframes badgeTipIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.badge-emoji{font-size:24px;line-height:1}.badge-name{color:var(--color-text-muted);text-overflow:ellipsis;white-space:nowrap;max-width:70px;font-size:10px;line-height:1.2;overflow:hidden}.badge-earned .badge-name{color:var(--color-text);font-weight:500}.badge-xp{color:var(--color-primary);background:var(--color-primary-light);border-radius:var(--radius-full);padding:1px 5px;font-size:9px;font-weight:700}.badge-toast{border-radius:var(--radius-xl);z-index:2000;white-space:nowrap;background:linear-gradient(135deg,#1e293b,#0f172a);border:1px solid #6366f166;align-items:center;gap:12px;padding:14px 20px;animation:.4s forwards badgeToastIn,.4s 3.5s forwards badgeToastOut;display:flex;position:fixed;bottom:90px;left:50%;transform:translate(-50%)translateY(20px);box-shadow:0 8px 32px #0006}.badge-toast-text{flex-direction:column;display:flex}.badge-toast-label{color:#94a3b8;font-size:11px}@keyframes badgeToastIn{0%{opacity:0;transform:translate(-50%)translateY(20px)}to{opacity:1;transform:translate(-50%)translateY(0)}}@keyframes badgeToastOut{0%{opacity:1;transform:translate(-50%)translateY(0)}to{opacity:0;transform:translate(-50%)translateY(20px)}}.mc-dashboard{padding-bottom:var(--space-6)}.reset-overlay{z-index:9999;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#030712eb;justify-content:center;align-items:center;animation:2.2s ease-in-out forwards resetOverlayLife;display:flex;position:fixed;inset:0}.reset-modal{text-align:center;animation:.4s cubic-bezier(.34,1.56,.64,1) both resetScaleIn}.reset-icon{margin-bottom:var(--space-4);font-size:56px;animation:.8s ease-out resetSpin}.reset-counters{gap:var(--space-2);margin-bottom:var(--space-4);flex-direction:column;display:flex}.reset-counter-row{justify-content:space-between;align-items:center;gap:var(--space-6);border-radius:var(--radius-md);font-size:var(--text-sm);color:#ffffffb3;opacity:0;background:#ffffff0d;padding:8px 20px;animation:.35s ease-out forwards resetRowSlide;display:flex}.reset-counter-row:first-child{animation-delay:.2s}.reset-counter-row:nth-child(2){animation-delay:.35s}.reset-counter-row:nth-child(3){animation-delay:.5s}.reset-counter-row:nth-child(4){animation-delay:.65s}.reset-zero{font-weight:var(--font-bold);font-size:var(--text-lg);color:#34d399}.reset-msg{font-size:var(--text-base);font-weight:var(--font-semibold);color:#fff;opacity:0;animation:.4s ease-out 1s forwards resetFadeIn}@keyframes resetOverlayLife{0%,75%{opacity:1}to{opacity:0;pointer-events:none}}@keyframes resetScaleIn{0%{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}@keyframes resetSpin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes resetRowSlide{0%{opacity:0;transform:translate(-12px)}to{opacity:1;transform:translate(0)}}@keyframes resetFadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.mc-header{justify-content:flex-start;align-items:center;gap:var(--space-3);margin-bottom:var(--space-5);display:flex}.mc-user-avatar{flex-shrink:0;position:relative}.mc-user-avatar-img{object-fit:cover;background:linear-gradient(135deg,#3b82f626,#10b9811a);border:2px solid #6366f14d;border-radius:16px;width:56px;height:56px}.mc-user-avatar-online{border:3px solid var(--color-bg);background:#10b981;border-radius:50%;width:14px;height:14px;position:absolute;bottom:-2px;right:-2px;box-shadow:0 0 8px #10b98180}.mc-greeting{flex:1;min-width:0}.mc-hello{font-size:var(--text-2xl);font-weight:var(--font-bold);letter-spacing:-.02em;color:var(--color-text);margin-bottom:2px}.mc-subtitle{font-size:var(--text-sm);color:var(--color-text-muted)}.mc-streak-badge{background:linear-gradient(135deg,#fbbf242e,#f59e0b1f);border:1.5px solid #fbbf2466;border-radius:9999px;flex-shrink:0;align-items:center;gap:8px;padding:8px 16px;animation:2.5s ease-in-out infinite streak-pulse;display:flex}.mc-streak-fire{font-size:20px}.mc-streak-num{font-size:var(--text-xl);font-weight:var(--font-bold);color:#fbb924;line-height:1;display:block}.mc-streak-lbl{color:#fbb924bf;text-transform:uppercase;letter-spacing:.5px;font-size:10px;font-weight:600;display:block}@keyframes streak-pulse{0%,to{box-shadow:0 0 #fbbf2400}50%{box-shadow:0 0 16px #fbbf2440}}.mc-hero{align-items:center;gap:var(--space-5);padding:var(--space-5) var(--space-5);margin-bottom:var(--space-6);border-radius:var(--radius-xl);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:linear-gradient(135deg,#3b82f614 0%,#0b132600 100%);border:1px solid #3b82f624;display:flex;position:relative;overflow:hidden}.mc-hero:before{content:"";pointer-events:none;background:radial-gradient(circle,#3b82f61f 0%,#0000 70%);width:180px;height:180px;position:absolute;top:50%;left:0;transform:translateY(-50%)}.mc-ring-wrap{flex-shrink:0;width:180px;height:180px;position:relative}.progress-ring-svg{display:block}.mc-ring-inner{pointer-events:none;flex-direction:column;justify-content:center;align-items:center;gap:0;display:flex;position:absolute;inset:0}.mc-ring-num{color:var(--color-text);letter-spacing:-.04em;font-size:2.5rem;font-weight:800;line-height:1}.mc-ring-of{font-size:var(--text-xs);color:var(--color-text-muted);margin-top:2px}.mc-ring-label{text-transform:uppercase;letter-spacing:.6px;color:#3b82f6cc;margin-top:2px;font-size:10px;font-weight:600}.mc-hero-info{gap:var(--space-2);flex-direction:column;flex:1;display:flex}.mc-pct-badge{color:#fff;font-size:var(--text-sm);letter-spacing:.2px;background:linear-gradient(135deg,#3b82f6,#60a5fa);border-radius:9999px;align-items:center;width:fit-content;padding:6px 14px;font-weight:600;display:inline-flex;box-shadow:0 4px 16px #3b82f64d}.mc-hero-msg{font-size:var(--text-sm);color:var(--color-text-muted);line-height:1.5}.mc-section-title{font-size:var(--text-base);font-weight:var(--font-semibold);color:var(--color-text);margin-bottom:var(--space-3);letter-spacing:-.01em}.mc-routes{gap:var(--space-3);flex-direction:column;display:flex}.mc-continue-card{align-items:center;gap:var(--space-3);text-align:left;width:100%;padding:var(--space-4) var(--space-4);border-radius:var(--radius-xl);cursor:pointer;margin-bottom:var(--space-3);background:linear-gradient(135deg,#10b9811f 0%,#34d3990f 100%);border:1.5px solid #34d3994d;transition:transform .18s,box-shadow .18s,border-color .18s;animation:2.5s ease-in-out infinite continuePulse;display:flex;position:relative;overflow:hidden}.mc-continue-card:hover{border-color:#34d39980;transform:translateY(-2px);box-shadow:0 8px 32px #10b98133}.mc-continue-card:active{transform:translateY(0)}@keyframes continuePulse{0%,to{box-shadow:0 0 #34d39900}50%{box-shadow:0 0 20px 2px #34d3991f}}.mc-continue-icon{color:#fff;background:linear-gradient(135deg,#10b981,#34d399);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:48px;height:48px;font-size:20px;display:flex;box-shadow:0 4px 14px #10b9814d}.mc-continue-body{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.mc-continue-label{text-transform:uppercase;letter-spacing:.5px;color:#34d399;font-size:11px;font-weight:700}.mc-continue-title{color:var(--color-text);white-space:nowrap;text-overflow:ellipsis;font-size:15px;font-weight:600;overflow:hidden}.mc-continue-route{color:var(--color-text-muted);font-size:12px}.mc-route-card{align-items:center;gap:var(--space-3);text-align:left;width:100%;padding:var(--space-4);border-radius:var(--radius-xl);background:var(--color-surface);cursor:pointer;border:1px solid #3b82f614;transition:transform .18s,box-shadow .18s,border-color .18s;display:flex;position:relative;overflow:hidden}.mc-route-card:hover{border-color:var(--accent,#3b82f640);box-shadow:0 8px 32px var(--accent-glow,#3b82f626);transform:translateY(-2px)}.mc-route-card:active{transform:translateY(0)}.mc-route-left-bar{background:var(--accent,#3b82f6);border-radius:var(--radius-xl) 0 0 var(--radius-xl);width:4px;position:absolute;top:0;bottom:0;left:0}.mc-route-icon-pill{border-radius:var(--radius-lg);flex-shrink:0;justify-content:center;align-items:center;width:44px;height:44px;font-size:22px;display:flex}.mc-route-body{flex:1;min-width:0}.mc-route-name{font-size:var(--text-base);font-weight:var(--font-semibold);color:var(--color-text);white-space:nowrap;text-overflow:ellipsis;margin-bottom:2px;overflow:hidden}.mc-route-meta{font-size:var(--text-xs);color:var(--color-text-muted);margin-bottom:var(--space-2)}.mc-route-arrow{color:var(--color-text-subtle);flex-shrink:0;font-size:1.6rem;transition:transform .18s,color .18s}.mc-route-card:hover .mc-route-arrow{color:var(--accent,#3b82f6);transform:translate(3px)}.slim-bar-track{background:var(--color-border);border-radius:9999px;height:4px;overflow:hidden}.slim-bar-fill{border-radius:9999px;height:100%;transition:width .8s cubic-bezier(.4,0,.2,1)}.mc-tip{align-items:center;gap:var(--space-3);margin-top:var(--space-6);padding:var(--space-3) var(--space-4);font-size:var(--text-sm);color:var(--color-text-muted);background:linear-gradient(135deg,#3b82f614,#10b9810f);border:1px solid #3b82f61f;border-radius:9999px;animation:3s ease-in-out infinite tip-glow;display:flex}.mc-tip span{flex-shrink:0;font-size:16px}.mc-tip p{margin:0;line-height:1.5}.mc-tip strong{color:var(--color-text)}@keyframes tip-glow{0%,to{box-shadow:0 0 #3b82f600}50%{box-shadow:0 0 20px #3b82f61a}}.mc-xp-bar{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);margin-bottom:var(--space-4);align-items:center;gap:10px;padding:10px 16px;display:flex}.mc-xp-icon{flex-shrink:0;font-size:18px}.mc-xp-label{font-size:var(--text-sm);font-weight:var(--font-bold);color:#fbb924;min-width:54px}.mc-xp-track{background:var(--color-surface-alt);border-radius:var(--radius-full);flex:1;height:8px;overflow:hidden}.mc-xp-fill{border-radius:var(--radius-full);background:linear-gradient(90deg,#6366f1,#8b5cf6);height:100%;transition:width 1s cubic-bezier(.4,0,.2,1);box-shadow:0 0 8px #6366f180}.mc-xp-next{color:var(--color-text-muted);white-space:nowrap;flex-shrink:0;font-size:10px}.mc-daily-goal{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);margin-bottom:var(--space-5);align-items:center;gap:10px;padding:10px 16px;display:flex}.mc-daily-icon{flex-shrink:0;font-size:16px}.mc-daily-label{font-size:var(--text-sm);font-weight:var(--font-semibold);color:var(--color-text);white-space:nowrap}.mc-daily-track{background:var(--color-surface-alt);border-radius:var(--radius-full);flex:1;height:8px;overflow:hidden}.mc-daily-fill{border-radius:var(--radius-full);background:linear-gradient(90deg,#10b981,#34d399);height:100%;transition:width 1s cubic-bezier(.4,0,.2,1);box-shadow:0 0 8px #10b98166}.mc-daily-count{font-size:var(--text-xs);color:var(--color-text-muted);white-space:nowrap;flex-shrink:0}.mc-daily-done{flex-shrink:0;font-size:14px}.mc-flashcards-btn{align-items:center;gap:var(--space-3);text-align:left;width:100%;padding:var(--space-4);border-radius:var(--radius-xl);cursor:pointer;margin-top:var(--space-4);font-family:var(--font-family);background:linear-gradient(135deg,#6366f114,#8b5cf60d);border:1.5px solid #6366f133;transition:transform .18s,box-shadow .18s;display:flex}.mc-flashcards-btn:hover{border-color:#6366f166;transform:translateY(-2px);box-shadow:0 8px 24px #6366f126}.mc-flashcards-icon{flex-shrink:0;font-size:28px}.mc-flashcards-body{flex-direction:column;flex:1;gap:2px;display:flex}.mc-flashcards-title{font-size:var(--text-base);font-weight:var(--font-semibold);color:var(--color-text)}.mc-flashcards-sub{font-size:var(--text-xs);color:var(--color-text-muted)}.cert-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;background:#000000bf;justify-content:center;align-items:center;padding:16px;animation:.3s cert-fade-in;display:flex;position:fixed;inset:0}@keyframes cert-fade-in{0%{opacity:0}to{opacity:1}}.cert-modal{background:var(--color-surface);border-radius:20px;width:100%;max-width:600px;max-height:90vh;padding:24px;animation:.35s cubic-bezier(.34,1.56,.64,1) cert-slide-up;overflow-y:auto;box-shadow:0 24px 60px #0006}@keyframes cert-slide-up{0%{opacity:0;transform:translateY(32px)scale(.96)}to{opacity:1;transform:none}}.cert-modal-header{justify-content:space-between;align-items:center;margin-bottom:6px;display:flex}.cert-modal-title{color:var(--color-text);margin:0;font-size:20px;font-weight:800}.cert-modal-close{color:var(--color-text-muted);cursor:pointer;transition:background var(--transition-fast);background:0 0;border:none;border-radius:8px;padding:4px 8px;font-size:18px}.cert-modal-close:hover{background:var(--color-surface-alt)}.cert-modal-sub{color:var(--color-text-muted);margin:0 0 20px;font-size:14px}.cert-canvas-wrap{background:#0f172a;border-radius:12px;margin-bottom:20px;line-height:0;position:relative;overflow:hidden}.cert-canvas{border-radius:12px;width:100%;height:auto;display:block}.cert-canvas-loading{color:#94a3b8;justify-content:center;align-items:center;font-size:14px;display:flex;position:absolute;inset:0}.cert-actions{flex-wrap:wrap;gap:10px;display:flex}.cert-btn{cursor:pointer;min-width:120px;transition:all var(--transition-fast);border:none;border-radius:12px;flex:1;padding:11px 14px;font-size:13px;font-weight:700}.cert-btn:disabled{opacity:.5;cursor:default}.cert-btn:hover:not(:disabled){transform:translateY(-1px)}.cert-btn-download{background:var(--color-surface-alt);color:var(--color-text);border:1px solid var(--color-border)}.cert-btn-download:hover:not(:disabled){border-color:var(--color-primary)}.cert-btn-share{background:var(--color-primary);color:#fff;box-shadow:0 2px 12px #10b98159}.cert-btn-share:hover:not(:disabled){background:var(--color-primary-hover)}.cert-btn-linkedin{color:#fff;background:#0a66c2;box-shadow:0 2px 12px #0a66c259}.cert-btn-linkedin:hover:not(:disabled){background:#004182}.route-view{padding-bottom:var(--space-6)}.route-back{align-items:center;gap:var(--space-2);color:var(--color-text-muted);font-size:var(--text-sm);font-weight:var(--font-medium);padding:var(--space-2) 0;margin-bottom:var(--space-3);cursor:pointer;transition:color var(--transition-fast);background:0 0;border:none;display:inline-flex}.route-back:hover{color:var(--color-primary)}.route-header{margin-bottom:var(--space-6)}.route-cert-btn{margin-top:var(--space-4);color:#fff;border-radius:var(--radius-full);cursor:pointer;transition:all var(--transition-fast);background:linear-gradient(135deg,#f59e0b,#fbbf24);border:none;align-items:center;gap:8px;padding:10px 22px;font-size:14px;font-weight:700;display:inline-flex;box-shadow:0 4px 16px #f59e0b66}.route-cert-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #f59e0b80}.route-modules{gap:var(--space-6);flex-direction:column;display:flex}.route-module-header{align-items:center;gap:var(--space-3);margin-bottom:var(--space-3);display:flex}.route-module-number{border-radius:var(--radius-full);background:var(--color-primary);color:#fff;width:32px;height:32px;font-size:var(--text-sm);font-weight:var(--font-bold);flex-shrink:0;justify-content:center;align-items:center;display:flex}.route-module-title{font-size:var(--text-base)}.route-lessons{gap:var(--space-2);padding-left:var(--space-10);border-left:2px solid var(--color-border);flex-direction:column;margin-left:15px;display:flex}.route-lesson-card.locked{opacity:.5;cursor:not-allowed}.route-lesson-card.completed{border-left:3px solid var(--color-primary)}.route-lesson-status{border-radius:var(--radius-full);width:32px;height:32px;font-size:var(--text-xs);font-weight:var(--font-bold);flex-shrink:0;justify-content:center;align-items:center;display:flex}.route-lesson-status.done{background:var(--color-primary);color:#fff}.route-lesson-status.active{background:var(--color-surface-alt);color:var(--color-text)}.route-lesson-status.locked{background:var(--color-surface-alt);color:var(--color-text-subtle);font-size:14px}.route-lesson-title{font-size:var(--text-sm);font-weight:var(--font-medium)}.route-lesson-arrow{color:var(--color-text-subtle)}.route-sim-cta{margin-top:var(--space-6);border:2px dashed var(--color-border)}.route-sim-cta:hover{border-color:var(--color-primary)}@keyframes lesson-shake{0%,to{transform:translate(0)}20%{transform:translate(-6px)}40%{transform:translate(6px)}60%{transform:translate(-4px)}80%{transform:translate(4px)}}.route-lesson-card.shaking{animation:.5s lesson-shake}.route-locked-toast{bottom:calc(var(--bottom-nav-height,64px) + 16px);color:#f8fafc;white-space:nowrap;z-index:300;background:#1e293b;border-radius:999px;padding:10px 20px;font-size:13px;font-weight:600;animation:.3s cubic-bezier(.34,1.56,.64,1) toast-in;position:fixed;left:50%;transform:translate(-50%);box-shadow:0 4px 20px #00000040}@keyframes toast-in{0%{opacity:0;transform:translate(-50%)translateY(12px)scale(.9)}to{opacity:1;transform:translate(-50%)translateY(0)scale(1)}}.route-lesson-card.highlight-pulse{border-color:var(--color-primary);animation:.8s ease-in-out 4 highlightPulse;box-shadow:0 0 #34d39966}@keyframes highlightPulse{0%{transform:scale(1);box-shadow:0 0 #34d39980}50%{transform:scale(1.02);box-shadow:0 0 16px 4px #34d3994d}to{transform:scale(1);box-shadow:0 0 #34d39980}}.route-lesson-card.next-lesson{background:var(--color-surface);border-color:#34d39959;box-shadow:0 0 16px #34d3991a}.route-next-badge{border-radius:var(--radius-full);color:#fff;white-space:nowrap;background:linear-gradient(135deg,#10b981,#34d399);align-items:center;gap:4px;padding:3px 10px;font-size:11px;font-weight:700;animation:2s ease-in-out infinite badgePulse;display:inline-flex;box-shadow:0 2px 8px #10b9814d}@keyframes badgePulse{0%,to{opacity:1}50%{opacity:.75}}.xp-notification{z-index:9999;color:#fff;pointer-events:none;background:linear-gradient(135deg,#f59e0b,#fbbf24);border-radius:999px;align-items:center;gap:6px;padding:10px 18px;font-family:Manrope,system-ui,sans-serif;font-size:18px;font-weight:800;animation:2.2s cubic-bezier(.22,1,.36,1) forwards xp-rise;display:flex;position:fixed;top:100px;right:20px;box-shadow:0 4px 20px #f59e0b80}.xp-star{font-size:20px;animation:.5s ease-out xp-spin}.xp-text{letter-spacing:.5px}@keyframes xp-rise{0%{opacity:0;transform:translateY(0)scale(.6)}12%{opacity:1;transform:translateY(-6px)scale(1.1)}25%{transform:translateY(0)scale(1)}70%{opacity:1;transform:translateY(-10px)}to{opacity:0;transform:translateY(-30px)scale(.9)}}@keyframes xp-spin{0%{transform:rotate(-20deg)scale(.5)}60%{transform:rotate(15deg)scale(1.2)}to{transform:rotate(0)scale(1)}}.step-wrapper{flex-direction:column;gap:0;height:100%;font-family:Manrope,system-ui,sans-serif;display:flex}.step-wrapper-scroll{scrollbar-width:none;flex-direction:column;gap:0;height:100%;font-family:Manrope,system-ui,sans-serif;display:flex;overflow:hidden auto}.step-wrapper-scroll::-webkit-scrollbar{display:none}.step-card{background:var(--el-surface);border-radius:14px;flex-shrink:0;padding:16px}.step-card-glass{-webkit-backdrop-filter:blur(14px);background:#192540bf;border-radius:14px;padding:18px}.step-page-dots{flex-shrink:0;justify-content:center;align-items:center;gap:6px;padding:10px 0 4px;display:flex}.step-page-dot{background:var(--el-surface-highest);cursor:pointer;border:none;border-radius:50%;width:6px;height:6px;padding:0;transition:all .25s}.step-page-dot.active{background:var(--el-primary);border-radius:3px;width:16px}.step-page-dot.done{background:#10b98159}.step-page-dot.missed{background:#f59e0bbf;box-shadow:0 0 0 2px #f59e0b40}.step-counter{color:var(--el-text-muted);text-align:right;letter-spacing:.04em;flex-shrink:0;margin-bottom:8px;font-size:12px;font-weight:600}.phrase-main-text{color:var(--el-text);margin-bottom:10px;font-size:clamp(20px,5.5vw,26px);font-weight:700;line-height:1.3}.phrase-translation{color:var(--el-text-muted);font-size:clamp(14px,3.5vw,16px);font-style:italic}.step-btn-row{flex-shrink:0;justify-content:center;gap:20px;margin-top:16px;display:flex}.step-circle-btn{border:2px solid var(--el-primary);background:var(--el-surface-high);width:52px;height:52px;color:var(--el-primary);cursor:pointer;border-radius:50%;justify-content:center;align-items:center;font-size:22px;transition:background .2s,transform .1s;display:flex}.step-circle-btn:active{transform:scale(.94)}.step-circle-btn.primary{background:linear-gradient(135deg, var(--el-primary), #06b77f);color:#002919;border:none}.expl-icon-wrap{flex-shrink:0;justify-content:center;margin-bottom:8px;display:flex}.expl-icon-compact{margin-bottom:4px}.expl-bulb-svg{animation:3s ease-in-out infinite bulb-glow}@keyframes bulb-glow{0%,to{filter:drop-shadow(0 0 2px #10b98126)}50%{filter:drop-shadow(0 0 8px #10b98159)}}.expl-pin{color:var(--el-primary);text-transform:uppercase;letter-spacing:.08em;align-items:center;gap:6px;margin-bottom:8px;font-size:12px;font-weight:700;display:inline-flex}.expl-card-scroll{scrollbar-width:none;flex-direction:column;flex:1;min-height:0;display:flex;overflow-y:auto}.expl-card-scroll::-webkit-scrollbar{display:none}.expl-text{color:var(--el-text);margin-bottom:12px;font-size:clamp(16px,4vw,19px);line-height:1.55}.expl-text-lines{flex-direction:column;gap:6px;display:flex}.expl-line{margin:0;font-size:clamp(15px,3.8vw,17px);line-height:1.5}.expl-formatted{font-size:inherit}.expl-intro{color:var(--el-text);margin:0 0 10px;font-size:clamp(15px,3.8vw,17px);line-height:1.5}.expl-list{flex-direction:column;gap:8px;margin:0 0 10px;display:flex}.expl-list-item{align-items:flex-start;gap:10px;display:flex}.expl-list-num{width:24px;height:24px;color:var(--el-primary);background:#10b9812e;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;margin-top:2px;font-size:12px;font-weight:700;display:flex}.expl-list-content{color:var(--el-text);font-size:clamp(14px,3.6vw,16px);line-height:1.45}.expl-outro{color:var(--el-text-muted);border-top:1px solid #ffffff0f;margin:4px 0 0;padding-top:6px;font-size:clamp(13px,3.3vw,15px);font-style:italic;line-height:1.45}.expl-example{border-left:3px solid var(--el-primary);margin-top:8px;padding-left:12px}.expl-example-label{color:var(--el-primary);letter-spacing:.1em;text-transform:uppercase;margin-bottom:4px;font-size:11px;font-weight:700}.expl-example-text{color:var(--el-text);font-size:clamp(17px,4.2vw,19px);font-weight:600}.exercise-q-progress{color:var(--el-text-muted);flex-shrink:0;justify-content:space-between;align-items:center;margin-bottom:6px;font-size:10px;font-weight:700;display:flex}.exercise-q-bar{background:var(--el-surface-highest);border-radius:2px;flex-shrink:0;height:2px;margin-bottom:10px;overflow:hidden}.exercise-q-bar-fill{background:var(--el-primary);border-radius:2px;height:100%;transition:width .4s}.exercise-question-text{color:var(--el-text);margin-bottom:4px;font-size:clamp(15px,4vw,17px);font-weight:600;line-height:1.45}.exercise-context{color:var(--el-text-muted);margin-bottom:14px;font-size:12px;font-style:italic}.exercise-options-list{flex-direction:column;flex-shrink:0;gap:8px;display:flex}.exercise-option-btn{background:var(--el-surface);cursor:pointer;text-align:left;border:none;border-radius:10px;align-items:center;gap:10px;padding:11px 14px;font-family:Manrope,system-ui,sans-serif;transition:background .2s;display:flex}.exercise-option-btn:disabled{cursor:default}.exercise-option-badge{background:var(--el-surface-highest);width:26px;height:26px;color:var(--el-text-muted);border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;font-size:12px;font-weight:700;display:flex}.exercise-option-text{color:var(--el-text);font-size:clamp(13px,3.5vw,15px);line-height:1.35}.exercise-option-btn.selected{background:var(--el-surface-high)}.exercise-option-btn.selected .exercise-option-badge{background:var(--el-primary);color:#002919}.exercise-option-btn.correct{background:#10b9811f}.exercise-option-btn.correct .exercise-option-badge{background:var(--el-primary);color:#002919}.exercise-option-btn.wrong{background:#ef44441f}.exercise-option-btn.wrong .exercise-option-badge{color:#fff;background:#ef4444}.exercise-feedback{border-radius:10px;flex-shrink:0;margin-top:10px;padding:10px 14px;font-size:13px;font-weight:600;line-height:1.4}.exercise-feedback.correct{color:var(--el-primary-light);background:#10b9811f}.exercise-feedback.wrong{color:#fc8181;background:#ef44441a}.match-columns{flex:1;grid-template-columns:1fr 1fr;align-items:stretch;gap:10px;min-height:0;display:grid}.match-col{flex-direction:column;gap:10px;display:flex}.match-col-label{color:var(--el-text-muted);text-transform:uppercase;letter-spacing:.08em;text-align:center;margin-bottom:2px;font-size:11px;font-weight:700}.match-chip{background:var(--el-surface);color:var(--el-text);cursor:pointer;text-align:center;border:none;border-radius:10px;flex:1;justify-content:center;align-items:center;min-height:52px;padding:12px 10px;font-family:Manrope,system-ui,sans-serif;font-size:clamp(14px,3.8vw,16px);line-height:1.35;transition:background .18s,transform .1s,box-shadow .18s;display:flex;box-shadow:0 1px 3px #00000026}.match-chip:hover{box-shadow:0 2px 8px #0003}.match-chip:active{transform:scale(.97)}.match-chip.selected{background:var(--el-surface-highest);outline:2px solid var(--el-primary);box-shadow:0 0 0 4px #10b98126}.match-chip.matched{color:var(--el-primary-light);pointer-events:none;opacity:.7;background:#10b9811f}.match-chip.wrong{color:#fc8181;background:#ef44441f}.match-score{text-align:center;color:var(--el-text-muted);flex-shrink:0;padding:6px 0 0;font-size:12px}.practice-prompt-card{background:var(--el-surface);border-radius:10px;flex-shrink:0;margin-bottom:10px;padding:12px 14px}.practice-prompt-label{color:var(--el-text-muted);text-transform:uppercase;letter-spacing:.08em;margin-bottom:4px;font-size:11px;font-weight:700}.practice-prompt-text{color:var(--el-primary-light);margin:0;font-size:clamp(16px,4.2vw,18px);font-style:italic;line-height:1.4}.practice-prompt-es{color:var(--el-text-muted);margin:2px 0 0;font-size:clamp(12px,3vw,13px);font-style:italic;line-height:1.3}.practice-response-card{background:var(--el-surface-high);border-left:3px solid var(--el-primary);border-radius:12px;flex-shrink:0;padding:14px 16px}.practice-response-card.practice-response-collapsible{scrollbar-width:none;flex:1 1 0;min-height:0;overflow-y:auto}.practice-response-card.practice-response-collapsible::-webkit-scrollbar{display:none}.practice-response-label{color:var(--el-text-muted);text-transform:uppercase;letter-spacing:.08em;margin-bottom:6px;font-size:11px;font-weight:700}.practice-response-text{color:var(--el-text);margin-bottom:6px;font-size:clamp(18px,4.8vw,21px);font-weight:700;line-height:1.35}.practice-response-es{color:var(--el-text-muted);font-size:clamp(15px,3.8vw,16px);font-style:italic}.practice-actions-row{flex-shrink:0;align-items:flex-start;gap:12px;margin-top:12px;display:flex}.practice-pronun-inline{flex:1;min-width:0}.practice-pronun-inline .pronun-target{display:none}.practice-pronun-inline .pronun-wrap{margin-top:0}.practice-sentences{flex-direction:column;gap:6px;margin-top:4px;display:flex}.practice-sentence{cursor:pointer;opacity:.38;border:1px solid #0000;border-radius:10px;align-items:flex-start;gap:10px;padding:10px 12px;transition:background .2s,box-shadow .2s,opacity .2s,transform .15s;display:flex;transform:scale(.98)}.practice-sentence:hover{opacity:.6}.practice-sentence.active{opacity:1;background:#10b98124;border-color:#10b9818c;transform:scale(1);box-shadow:0 0 0 3px #10b9811f}.practice-sentence-num{background:var(--el-surface-highest);width:24px;height:24px;color:var(--el-text-muted);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;margin-top:2px;font-size:11px;font-weight:700;transition:background .2s,color .2s;display:flex}.practice-sentence.active .practice-sentence-num{background:var(--el-primary);color:#002919;width:26px;height:26px;font-size:12px}.practice-sentence-body{flex:1;min-width:0}.practice-sentence-en{color:var(--el-text-muted);margin:0 0 3px;font-size:clamp(16px,4.2vw,18px);font-weight:600;line-height:1.4}.practice-sentence.active .practice-sentence-en{color:var(--el-text)}.practice-sentence-es{color:var(--el-text-muted);margin:0;font-size:clamp(13px,3.3vw,14px);font-style:italic;line-height:1.35}.practice-response-collapsible .practice-sentences{gap:4px}.practice-response-collapsible .practice-sentence{opacity:.45;max-height:44px;padding:6px 10px;transition:background .2s,box-shadow .2s,opacity .2s,transform .15s,max-height .3s,padding .2s;overflow:hidden}.practice-response-collapsible .practice-sentence:hover{opacity:.65}.practice-response-collapsible .practice-sentence.active{opacity:1;max-height:300px;padding:10px 12px}.practice-response-collapsible .practice-sentence.practiced{opacity:.55}.practice-response-collapsible .practice-sentence-num{width:22px;height:22px;margin-top:1px;font-size:10px}.practice-response-collapsible .practice-sentence.active .practice-sentence-num{width:26px;height:26px;font-size:12px}.practice-response-collapsible .practice-sentence-en{white-space:nowrap;text-overflow:ellipsis;margin:0 0 2px;font-size:clamp(14px,3.5vw,16px);line-height:1.35;overflow:hidden}.practice-response-collapsible .practice-sentence.active .practice-sentence-en{white-space:normal;text-overflow:unset;font-size:clamp(16px,4.2vw,18px);overflow:visible}.practice-response-collapsible .practice-sentence-es{font-size:clamp(12px,3vw,13px);line-height:1.3}.practice-sentence-hint{color:var(--el-text-muted);text-align:center;opacity:.7;flex-shrink:0;margin-top:6px;font-size:10px}.practice-sentence.practiced{opacity:.6}.practice-sentence.practiced .practice-sentence-num{color:#10b981;background:#10b9814d}.practice-sentence-done{color:#10b981;flex-shrink:0;align-self:center;font-size:13px;font-weight:700}.practice-sentence.next-up{border-color:#10b98180;animation:1.4s ease-in-out infinite sentence-next-pulse}.practice-sentence.next-up .practice-sentence-num{color:#10b981;background:#10b98126}@keyframes sentence-next-pulse{0%,to{border-color:#10b98159;box-shadow:0 0 #10b98100}50%{border-color:#10b981b3;box-shadow:0 0 0 4px #10b98126}}.objective-title{color:var(--el-text);margin-bottom:6px;font-size:20px;font-weight:700;line-height:1.3}.objective-desc{color:var(--el-text-muted);margin-bottom:16px;font-size:clamp(13px,3.5vw,15px);line-height:1.55}.objective-list{flex-direction:column;gap:9px;display:flex}.objective-item{background:var(--el-surface);border-radius:10px;align-items:flex-start;gap:10px;padding:11px 14px;display:flex}.objective-check{width:20px;height:20px;color:var(--el-primary);background:#10b98126;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;margin-top:1px;font-size:11px;font-weight:700;display:flex}.objective-item-text{color:var(--el-text);font-size:clamp(14px,3.5vw,16px);line-height:1.4}.reinforcement-wrapper{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:6px;height:100%;display:flex}.completion-trophy{margin-bottom:4px;font-size:50px}.completion-emojis{letter-spacing:6px;margin-bottom:4px;font-size:22px}.completion-headline{background:linear-gradient(135deg, var(--el-primary), var(--el-primary-light));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-family:Manrope,system-ui,sans-serif;font-size:22px;font-weight:800}.completion-sub{color:var(--el-text-muted);margin-bottom:8px;font-size:13px}.completion-stats-row{justify-content:center;gap:8px;width:100%;display:flex}.completion-stat-chip{background:var(--el-surface);border-radius:10px;flex-direction:column;align-items:center;gap:2px;min-width:70px;padding:10px 12px;display:flex}.completion-stat-icon{font-size:16px}.completion-stat-value{color:var(--el-text);font-family:Manrope,system-ui,sans-serif;font-size:16px;font-weight:800}.completion-stat-label{color:var(--el-text-muted);font-size:10px;font-weight:600}.completion-takeaways{background:var(--el-surface);text-align:left;border-radius:12px;width:100%;margin-top:4px;padding:12px 14px}.completion-takeaways-title{color:var(--el-primary);text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px;font-size:10px;font-weight:700}.completion-takeaway-item{color:var(--el-text);align-items:flex-start;gap:8px;margin-bottom:6px;font-size:12px;line-height:1.4;display:flex}.completion-takeaway-check{color:var(--el-primary);flex-shrink:0;font-size:13px}.exercise-input{background:var(--el-surface);border:none;border-bottom:2px solid var(--el-primary);width:100%;color:var(--el-text);border-radius:8px 8px 0 0;outline:none;margin-bottom:10px;padding:12px 14px;font-family:Manrope,system-ui,sans-serif;font-size:15px}.exercise-input:focus{background:var(--el-surface-high)}.exercise-result{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:8px;height:100%;display:flex}.exercise-result-emoji{font-size:48px}.exercise-result-title{color:var(--el-text);font-family:Manrope,sans-serif;font-size:18px;font-weight:700}.exercise-result-sub{color:var(--el-text-muted);font-size:13px}.exercise-result-bar-wrap{background:var(--el-surface-highest);border-radius:3px;width:100%;height:6px;margin:4px 0;overflow:hidden}.exercise-result-bar-fill{border-radius:3px;height:100%;transition:width .8s}.match-complete{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:10px;height:100%;display:flex}.step-inline-nav{flex-shrink:0;justify-content:center;align-items:center;gap:20px;padding:8px 0 2px;display:flex}.step-inline-btn{background:var(--el-surface);width:36px;height:36px;color:var(--el-primary);cursor:pointer;border:none;border-radius:50%;justify-content:center;align-items:center;padding:0;font-size:22px;font-weight:700;line-height:1;transition:background .18s,opacity .18s;display:flex}.step-inline-btn:disabled{opacity:.25;cursor:default}.step-inline-btn:not(:disabled):active{background:var(--el-surface-high)}.step-inline-btn.pulse:not(:disabled){animation:1.6s ease-in-out infinite btn-pulse}@keyframes btn-pulse{0%,to{background:var(--el-surface);color:var(--el-primary);transform:scale(1);box-shadow:0 0 #10b98100}50%{color:#fff;background:#10b9812e;transform:scale(1.14);box-shadow:0 0 0 8px #10b9814d,0 0 16px #10b98173}}.step-inline-label{color:var(--el-text-muted);text-align:center;min-width:70px;font-size:12px;font-weight:500}.listen-speed-group{flex-direction:column;flex-shrink:0;align-items:center;gap:4px;display:flex}.speed-toggle-btn{background:var(--el-surface);color:var(--el-text-muted);cursor:pointer;letter-spacing:.02em;white-space:nowrap;border:none;border-radius:20px;padding:2px 8px;font-family:Manrope,system-ui,sans-serif;font-size:10px;font-weight:700;transition:background .15s,color .15s}.speed-toggle-btn:hover{background:var(--el-surface-high);color:var(--el-primary)}.incomplete-inline-list{flex-direction:column;gap:8px;width:100%;margin-top:8px;display:flex}.incomplete-inline-item{text-align:left;background:#f59e0b14;border:1px solid #f59e0b33;border-radius:12px;align-items:center;gap:10px;padding:10px 12px;display:flex}.incomplete-inline-icon{flex-shrink:0;font-size:22px}.incomplete-inline-text{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.incomplete-inline-label{color:var(--el-text);font-family:Manrope,system-ui,sans-serif;font-size:13px;font-weight:700}.incomplete-inline-detail{color:var(--el-text-muted);font-size:11px;line-height:1.3}.incomplete-inline-go{background:var(--el-primary);color:#fff;cursor:pointer;white-space:nowrap;border:none;border-radius:10px;flex-shrink:0;padding:8px 14px;font-family:Manrope,system-ui,sans-serif;font-size:13px;font-weight:700;transition:filter .15s}.incomplete-inline-go:hover{filter:brightness(1.1)}.incomplete-inline-actions{width:100%;margin-top:12px}.incomplete-inline-finish{width:100%;color:var(--el-text-muted);cursor:pointer;background:#ffffff0f;border:none;border-radius:14px;padding:13px 0;font-family:Manrope,system-ui,sans-serif;font-size:14px;font-weight:600;transition:background .15s}.incomplete-inline-finish:hover{background:#ffffff1a}.audio-player{align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:var(--color-surface);border-radius:var(--radius-lg);border:1px solid var(--color-border);transition:border-color var(--transition);display:flex}.audio-player:hover{border-color:var(--color-primary)}.audio-play-btn{border-radius:var(--radius-full);background:var(--color-primary);color:#fff;cursor:pointer;width:44px;height:44px;transition:all var(--transition);box-shadow:var(--shadow-primary);border:none;flex-shrink:0;justify-content:center;align-items:center;font-size:18px;display:flex}.audio-play-btn:hover{background:var(--color-primary-hover);transform:scale(1.05)}.audio-play-btn:active{transform:scale(.95)}.audio-play-btn.audio-playing{animation:1.5s ease-in-out infinite pulse-audio}.audio-info{flex-direction:column;flex:1;gap:4px;min-width:0;display:flex}.audio-label{font-size:var(--text-xs);color:var(--color-text-muted)}.audio-progress-track{background:var(--color-surface-alt);border-radius:var(--radius-full);cursor:pointer;height:6px;transition:height var(--transition-fast);overflow:hidden}.audio-progress-track:hover{height:8px}.audio-progress-fill{background:linear-gradient(90deg, var(--color-primary), var(--color-accent,#8b5cf6));border-radius:var(--radius-full);height:100%;transition:width .1s linear}.audio-time{color:var(--color-text-subtle);justify-content:space-between;font-size:10px;display:flex}.audio-speed-btn{border-radius:var(--radius-lg);border:1.5px solid var(--color-border);background:var(--color-surface);cursor:pointer;width:44px;height:44px;transition:all var(--transition-fast);flex-direction:column;flex-shrink:0;justify-content:center;align-items:center;gap:1px;display:flex}.audio-speed-btn:hover{border-color:var(--color-primary);transform:scale(1.08)}.audio-speed-btn:active{transform:scale(.95)}.audio-speed-emoji{font-size:18px;line-height:1}.audio-speed-label{color:var(--color-text-muted);font-size:9px;font-weight:700;line-height:1}.audio-speed-slow{background:#fffbeb;border-color:#f59e0b}.audio-speed-slow .audio-speed-label{color:#b45309}.audio-speed-normal{border-color:var(--color-primary);background:var(--color-primary-light)}.audio-speed-normal .audio-speed-label{color:var(--color-primary-hover)}.audio-speed-fast{background:#f5f3ff;border-color:#8b5cf6}.audio-speed-fast .audio-speed-label{color:#7c3aed}@keyframes pulse-audio{0%,to{box-shadow:0 0 #10b98166}50%{box-shadow:0 0 0 8px #10b98100}}.audio-wave{align-items:center;gap:2.5px;height:22px;display:flex}.audio-wave span{background:#fff;border-radius:2px;width:3px;animation:.9s ease-in-out infinite wave-bar}.audio-wave span:first-child{height:8px;animation-delay:0s}.audio-wave span:nth-child(2){height:14px;animation-delay:.15s}.audio-wave span:nth-child(3){height:20px;animation-delay:.3s}.audio-wave span:nth-child(4){height:12px;animation-delay:.45s}@keyframes wave-bar{0%,to{opacity:.7;transform:scaleY(.5)}50%{opacity:1;transform:scaleY(1)}}.speak-controls{align-items:center;gap:var(--space-2);margin-top:var(--space-2);display:flex}.speak-btn{border:1.5px solid var(--color-primary);background:var(--color-primary-light);color:var(--color-primary-hover);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:var(--font-semibold);cursor:pointer;transition:all var(--transition-fast);align-items:center;gap:6px;padding:6px 14px;display:flex}.speak-btn:hover{background:var(--color-primary);color:#fff;transform:scale(1.05)}.speak-btn.speaking{background:var(--color-primary);color:#fff;animation:1.5s ease-in-out infinite pulse-speak}.speak-icon{font-size:14px}.speak-label{font-size:11px}.speed-btn{border:1.5px solid var(--color-border);background:var(--color-surface);border-radius:var(--radius-full);cursor:pointer;transition:all var(--transition-fast);color:var(--color-text-muted);align-items:center;gap:3px;padding:4px 10px;font-size:10px;font-weight:700;display:flex}.speed-btn:hover{border-color:var(--color-primary);transform:scale(1.08)}.speed-btn:active{transform:scale(.95)}.speed-btn.slow{color:#b45309;background:#fffbeb;border-color:#f59e0b}.speed-btn.fast{color:#7c3aed;background:#f5f3ff;border-color:#8b5cf6}@keyframes pulse-speak{0%,to{box-shadow:0 0 #10b98166}50%{box-shadow:0 0 0 8px #10b98100}}.pronun-wrap{flex-direction:column;gap:10px;margin-top:12px;display:flex}.pronun-unsupported{border-radius:var(--radius-lg);background:#fbbf240f;border:1px solid #fbbf2433;align-items:flex-start;gap:10px;margin-top:10px;padding:12px 14px;display:flex}.pronun-unsupported-icon{opacity:.6;flex-shrink:0;font-size:20px}.pronun-unsupported-body{flex-direction:column;gap:4px;display:flex}.pronun-unsupported-title{font-size:var(--text-sm);color:var(--color-text-muted);margin:0;line-height:1.4}.pronun-unsupported-sub{color:var(--color-text-muted);opacity:.75;margin:0;font-size:11px}.pronun-browser-options{flex-wrap:wrap;gap:6px;margin-top:4px;display:flex}.pronun-browser-tag{color:#fbb924;border-radius:var(--radius-full);background:#fbbf241a;border:1px solid #fbbf2440;padding:2px 8px;font-size:11px;font-weight:600}.pronun-target{border-radius:var(--radius-lg);background:#6366f114;border-left:3px solid #6366f1;flex-direction:column;gap:3px;padding:10px 14px;display:flex}.pronun-target-label{color:#818cf8;text-transform:uppercase;letter-spacing:.05em;font-size:10px;font-weight:600}.pronun-target-text{font-size:var(--text-sm);color:var(--color-text);font-weight:500}.pronun-btn{color:#818cf8;border-radius:var(--radius-full);font-size:var(--text-sm);cursor:pointer;background:0 0;border:1.5px solid #6366f1;justify-content:center;align-self:flex-start;align-items:center;gap:8px;padding:10px 18px;font-weight:600;transition:all .2s;display:flex}.pronun-btn:hover{color:#a5b4fc;background:#6366f11f;transform:translateY(-1px)}.pronun-btn--listening{color:#f87171;background:#ef444414;border-color:#ef4444}.pronun-btn--processing{opacity:.7;cursor:default}.pronun-icon{font-size:16px}@keyframes pronun-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(1.3)}}.pronun-pulse{animation:.8s ease-in-out infinite pronun-pulse;display:inline-block}.pronun-error{font-size:var(--text-sm);color:#f87171;align-items:center;gap:8px;display:flex}.pronun-retry{color:#f87171;border-radius:var(--radius-full);cursor:pointer;background:0 0;border:1px solid #f87171;padding:2px 10px;font-size:11px}.pronun-result{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);flex-direction:column;gap:10px;padding:14px;animation:.3s fadeIn;display:flex}.pronun-score-ring{border:4px solid var(--score-color,#10b981);background:#0003;border-radius:50%;flex-direction:column;justify-content:center;align-self:center;align-items:center;width:72px;height:72px;display:flex;box-shadow:0 0 16px #0003}.pronun-score-num{font-size:var(--text-xl);font-weight:var(--font-bold);color:var(--score-color,#10b981);line-height:1}.pronun-score-lbl{color:var(--color-text-muted);font-size:9px}.pronun-score-info{flex-direction:column;gap:8px;display:flex}.pronun-feedback{font-size:var(--text-sm);align-items:center;gap:6px;font-weight:600;display:flex}.pronun-transcript{flex-direction:column;gap:2px;display:flex}.pronun-transcript-lbl{color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em;font-size:10px}.pronun-transcript-text{font-size:var(--text-sm);color:var(--color-text);font-style:italic}.pronun-missed{border-radius:var(--radius-md);background:#f59e0b12;border:1px solid #f59e0b33;flex-direction:column;gap:6px;padding:8px 10px;display:flex}.pronun-missed-lbl{color:#fcd34d;text-transform:uppercase;letter-spacing:.05em;font-size:10px;font-weight:700}.pronun-missed-words{flex-wrap:wrap;gap:6px;display:flex}.pronun-missed-word{font-size:var(--text-xs);color:#fff;border-radius:var(--radius-full);cursor:pointer;background:#b4530973;border:1px solid #f59e0b80;align-items:center;gap:4px;padding:4px 12px;font-style:italic;font-weight:700;transition:all .15s;display:inline-flex}.pronun-missed-word:hover{color:#fff;background:#b45309a6;border-color:#f59e0bbf;transform:scale(1.05)}.pronun-missed-word:active{transform:scale(.97)}.pronun-missed-speaker{font-size:12px;font-style:normal}[data-theme=dark] .pronun-missed-word{color:#fff;background:#d977064d;border-color:#f59e0b80}[data-theme=dark] .pronun-missed-word:hover{color:#fff;background:#d9770673;border-color:#f59e0bb3}.pronun-retry-btn{color:#818cf8;border-radius:var(--radius-full);font-size:var(--text-sm);cursor:pointer;background:#6366f11a;border:1.5px solid #6366f14d;align-self:flex-start;padding:8px 16px;font-weight:600;transition:all .2s}.pronun-retry-btn:hover{background:#6366f133;transform:translateY(-1px)}.pronun-result-compact{background:var(--color-surface,#192540bf);border:1px solid var(--color-border,#ffffff14);border-radius:50px;flex-wrap:wrap;align-items:center;gap:8px;margin-top:2px;padding:8px 12px;animation:.25s fadeIn;display:flex}.pronun-result-compact-score{white-space:nowrap;font-family:Manrope,system-ui,sans-serif;font-size:15px;font-weight:800}.pronun-result-compact-text{flex:1;min-width:80px;font-family:Manrope,system-ui,sans-serif;font-size:12px;font-weight:600}.pronun-result-compact-retry{color:#818cf8;cursor:pointer;white-space:nowrap;background:#6366f11f;border:1.5px solid #6366f14d;border-radius:50px;padding:5px 12px;font-family:Manrope,system-ui,sans-serif;font-size:12px;font-weight:700;transition:background .2s}.pronun-result-compact-retry:hover{background:#6366f13d}.clickable-phrase{line-height:1.8;display:inline;position:relative}.word-token{cursor:pointer;transition:background var(--transition-fast), color var(--transition-fast);border-radius:3px;padding:1px 2px;display:inline}.word-has-def{border-bottom:1.5px dotted var(--color-primary)}.word-has-def:hover{background:var(--color-primary-light);color:var(--color-primary-hover)}.word-has-def:active{background:var(--color-primary);color:#fff}.word-no-def{border-bottom:1px dotted #0000}.word-no-def:hover{background:#f8fafc;border-bottom-color:#cbd5e1}.word-no-def:active{background:#e2e8f0}.word-compound{border-bottom:1.5px dotted var(--color-secondary);background:#2563eb0d}.word-compound:hover{color:var(--color-secondary);background:#2563eb1f}.word-compound:active{background:var(--color-secondary);color:#fff}.word-bracket{color:#92400e;letter-spacing:.01em;cursor:default;white-space:nowrap;background:#fef3c7;border:1px solid #f59e0b;border-radius:4px;margin:0 1px;padding:0 4px;font-size:.92em;font-style:italic;font-weight:600;display:inline}[data-theme=dark] .word-bracket{color:#fcd34d;background:#f59e0b26;border-color:#f59e0b66}.word-bracket-marker{opacity:.5;font-style:normal}.word-token:focus-visible{outline:2px solid var(--color-primary);outline-offset:1px}.word-tooltip-portal{color:#fff;pointer-events:auto;box-sizing:border-box;background:#1e293b;border-radius:12px;flex-direction:column;align-items:center;gap:5px;padding:12px 16px;font-family:Manrope,system-ui,sans-serif;display:flex;box-shadow:0 8px 32px #00000059}.word-tooltip-arrow-portal{border-left:8px solid #0000;border-right:8px solid #0000;width:0;height:0;position:absolute;transform:translate(-50%)}.word-tooltip-arrow-portal.above{border-top:8px solid #1e293b;bottom:-7px}.word-tooltip-arrow-portal.below{border-bottom:8px solid #1e293b;top:-7px}.word-tooltip-word{color:#f1f5f9;letter-spacing:.3px;text-align:center;word-break:break-word;font-size:15px;font-weight:700}.word-tooltip-translation{color:#94a3b8;text-align:center;word-break:break-word;font-size:13px;font-style:italic}.word-tooltip-no-def{color:#f59e0b;font-size:11px;font-style:italic}.word-tooltip-actions{justify-content:center;gap:6px;width:100%;margin-top:6px;display:flex}.word-tooltip-speak{color:#67e8f9;cursor:pointer;transition:all var(--transition-fast);white-space:nowrap;background:0 0;border:1.5px solid #22d3ee;border-radius:20px;padding:5px 12px;font-size:11px;font-weight:600}.word-tooltip-speak:hover{color:#0f172a;background:#22d3ee}.word-tooltip-speak:active{transform:scale(.95)}.word-tooltip-save{color:#a5b4fc;cursor:pointer;transition:all var(--transition-fast);white-space:nowrap;background:0 0;border:1.5px solid #6366f1;border-radius:20px;padding:5px 12px;font-size:11px;font-weight:600}.word-tooltip-save:hover{color:#fff;background:#6366f1}.word-tooltip-save.saved{color:#6ee7b7;cursor:default;border-color:#10b981}.word-tooltip-save:disabled{opacity:.7;cursor:default}.phrase-clickable-hint{color:var(--color-primary);opacity:.7;letter-spacing:.2px;margin-top:2px;font-size:10px;display:block}:root{--el-bg:#060e20;--el-surface:#0f1930;--el-surface-high:#141f38;--el-surface-highest:#192540;--el-primary:#10b981;--el-primary-light:#4edea3;--el-primary-glow:#10b98133;--el-text:#dee5ff;--el-text-muted:#a3aac4;--el-outline:#40485d80;--el-radius:14px;--el-radius-sm:8px;--el-radius-full:9999px;--el-header-h:72px;--el-footer-h:72px;--el-font:"Manrope", system-ui, sans-serif}.lesson-shell{background:var(--el-bg);font-family:var(--el-font);color:var(--el-text);flex-direction:column;display:flex;position:fixed;inset:0;overflow:hidden}.lesson-header-fixed{height:var(--el-header-h);background:var(--el-bg);z-index:10;flex-direction:column;flex-shrink:0;justify-content:space-between;padding:10px 16px 0;display:flex}.lesson-header-top{align-items:center;gap:10px;display:flex}.lesson-back-btn{color:var(--el-primary-light);cursor:pointer;background:0 0;border:none;flex-shrink:0;padding:4px;font-size:18px;line-height:1}.lesson-title-fixed{color:var(--el-text);white-space:nowrap;text-overflow:ellipsis;font-size:13px;font-weight:600;font-family:var(--el-font);flex:1;overflow:hidden}.lesson-mute-btn{cursor:pointer;opacity:.45;background:0 0;border:none;flex-shrink:0;padding:4px;font-size:15px;line-height:1;transition:opacity .15s}.lesson-mute-btn:hover{opacity:.85}.lesson-dots-row{align-items:center;gap:6px;padding-bottom:8px;display:flex}.lesson-dot-new{border-radius:var(--el-radius-full);background:var(--el-surface-highest);cursor:default;border:none;flex-shrink:0;min-width:10px;height:10px;padding:0;transition:all .3s}.lesson-dot-new.active{background:var(--el-primary);width:24px;box-shadow:0 0 6px var(--el-primary-glow);cursor:default}.lesson-dot-new.done{cursor:pointer;background:#4edea373;width:10px}.lesson-dot-new.done:hover{background:var(--el-primary-light);transform:scaleY(1.3)}.lesson-dot-new.skipped{cursor:pointer;background:#f59e0b99;animation:1.5s ease-in-out infinite dot-pulse-warn}@keyframes dot-pulse-warn{0%,to{box-shadow:0 0 #f59e0b4d}50%{box-shadow:0 0 6px 2px #f59e0b66}}.lesson-progress-bar-fixed{background:var(--el-surface-high);height:2px;overflow:hidden}.lesson-progress-fill-fixed{background:linear-gradient(90deg, var(--el-primary), var(--el-primary-light));height:100%;transition:width .5s}.lesson-step-label{letter-spacing:.08em;color:var(--el-primary);text-transform:uppercase;font-size:10px;font-weight:700;font-family:var(--el-font);flex-shrink:0;padding:6px 16px 0}.lesson-body{flex-direction:column;flex:1;min-height:0;padding:8px 16px 0;display:flex;overflow:hidden}.lesson-footer-fixed{height:var(--el-footer-h);background:var(--el-bg);flex-shrink:0;align-items:center;padding:10px 16px;display:flex}.lesson-next-btn{background:linear-gradient(135deg, var(--el-primary), #06b77f);border-radius:var(--el-radius-full);color:#002919;width:100%;height:48px;font-size:15px;font-weight:700;font-family:var(--el-font);cursor:pointer;box-shadow:0 4px 16px var(--el-primary-glow);border:none;transition:opacity .2s,transform .1s}.lesson-next-btn:active{transform:scale(.98)}.lesson-next-btn:disabled{opacity:.35;cursor:not-allowed;transform:none}.lesson-loading-screen{background:var(--el-bg);font-family:var(--el-font);flex-direction:column;justify-content:center;align-items:center;gap:16px;display:flex;position:fixed;inset:0}.lesson-loading-spinner{width:56px;height:56px;position:relative}.lesson-loading-ring{border:3px solid var(--el-surface-highest);border-top-color:var(--el-primary);border-radius:50%;animation:.9s linear infinite spin;position:absolute;inset:0}.lesson-loading-icon{justify-content:center;align-items:center;font-size:24px;display:flex;position:absolute;inset:0}.lesson-loading-msg{color:var(--el-text-muted);text-align:center;font-size:13px}.lesson-loading-bar{background:var(--el-surface-high);border-radius:2px;width:140px;height:3px;overflow:hidden}.lesson-loading-bar-fill{background:var(--el-primary);height:100%;animation:1.5s ease-in-out infinite loading-bar}@keyframes loading-bar{0%{width:0}50%{width:80%}to{width:100%}}@keyframes spin{to{transform:rotate(360deg)}}.lesson-step-toast{background:var(--el-surface-highest);color:var(--el-primary-light);border-radius:var(--el-radius-full);font-size:13px;font-weight:600;font-family:var(--el-font);z-index:200;padding:8px 20px;animation:.2s fadeIn;position:fixed;top:80px;left:50%;transform:translate(-50%)}.badge-toast{background:var(--el-surface-highest);border-radius:var(--el-radius);font-family:var(--el-font);z-index:300;align-items:center;gap:12px;max-width:300px;padding:12px 20px;animation:.3s fadeIn;display:flex;position:fixed;top:16px;left:50%;transform:translate(-50%);box-shadow:0 8px 32px #0006}.badge-toast-emoji{font-size:28px}.badge-toast-text{flex-direction:column;gap:2px;display:flex}.badge-toast-label{color:var(--el-primary-light);letter-spacing:.06em;text-transform:uppercase;font-size:10px;font-weight:700}.badge-toast-name{color:var(--el-text);font-size:14px;font-weight:600}.streak-overlay{z-index:400;background:#060e20eb;justify-content:center;align-items:flex-end;padding:0 16px 24px;display:flex;position:fixed;inset:0}.streak-modal{background:var(--el-surface);text-align:center;border-radius:24px 24px 16px 16px;width:100%;max-width:400px;padding:28px 24px 24px;position:relative;overflow:hidden}.streak-confetti-wrap{pointer-events:none;position:absolute;inset:0;overflow:hidden}.streak-confetti-piece{font-size:20px;animation:2s ease-in both confetti-fall;position:absolute;top:-20px}@keyframes confetti-fall{to{opacity:0;top:110%}}.streak-fire-badge{margin-bottom:8px;font-size:40px}.streak-count-display{margin-bottom:8px}.streak-number{color:var(--el-primary);font-size:48px;font-weight:800;font-family:var(--el-font)}.streak-unit{color:var(--el-text-muted);margin-top:-4px;font-size:16px;display:block}.streak-main-msg{color:var(--el-text);font-size:18px;font-weight:700;font-family:var(--el-font);margin-bottom:8px}.streak-sub-msg{color:var(--el-text-muted);margin-bottom:20px;font-size:13px}.streak-continue-btn{background:linear-gradient(135deg, var(--el-primary), #06b77f);border-radius:var(--el-radius-full);color:#002919;width:100%;height:48px;font-size:15px;font-weight:700;font-family:var(--el-font);cursor:pointer;border:none}.el-card{background:var(--el-surface);border-radius:var(--el-radius);padding:16px}.el-card-glass{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:var(--el-radius);background:#192540b3;padding:16px}.el-page-dots{flex-shrink:0;justify-content:center;gap:6px;margin-top:12px;display:flex}.el-page-dot{background:var(--el-surface-highest);border:none;border-radius:50%;width:6px;height:6px;padding:0;transition:all .25s}.el-page-dot.active{background:var(--el-primary);border-radius:3px;width:16px}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.xp-notification{z-index:250;position:fixed;top:80px;right:16px}.incomplete-overlay{z-index:400;background:#060e20eb;justify-content:center;align-items:flex-end;padding:0 16px 24px;animation:.2s fadeIn;display:flex;position:fixed;inset:0}.incomplete-modal{background:var(--el-surface);text-align:center;border-radius:24px 24px 16px 16px;width:100%;max-width:400px;padding:28px 24px 24px;animation:.3s slideUp}.incomplete-icon{margin-bottom:8px;font-size:44px}.incomplete-title{color:var(--el-text);font-size:18px;font-weight:700;font-family:var(--el-font);margin:0 0 6px}.incomplete-sub{color:var(--el-text-muted);margin:0 0 16px;font-size:13px;line-height:1.4}.incomplete-list{flex-direction:column;gap:8px;margin-bottom:20px;display:flex}.incomplete-item{text-align:left;background:#ef444414;border:1px solid #ef444433;border-radius:12px;align-items:center;gap:12px;padding:12px 14px;display:flex}.incomplete-item-icon{flex-shrink:0;font-size:24px}.incomplete-item-text{flex-direction:column;gap:2px;display:flex}.incomplete-item-label{color:var(--el-text);font-size:14px;font-weight:700;font-family:var(--el-font)}.incomplete-item-detail{color:var(--el-text-muted);font-size:12px;line-height:1.3}.incomplete-actions{flex-direction:column;gap:10px;display:flex}.incomplete-btn-primary{background:linear-gradient(135deg, var(--el-primary), #06b77f);border-radius:var(--el-radius-full);color:#002919;width:100%;height:48px;font-size:15px;font-weight:700;font-family:var(--el-font);cursor:pointer;border:none;transition:transform .1s}.incomplete-btn-primary:active{transform:scale(.98)}.incomplete-btn-secondary{border:1px solid var(--el-outline);border-radius:var(--el-radius-full);width:100%;height:40px;color:var(--el-text-muted);font-size:13px;font-weight:600;font-family:var(--el-font);cursor:pointer;background:0 0;transition:background .2s}.incomplete-btn-secondary:hover{background:var(--el-surface-high)}.incomplete-modal-overlay{z-index:300;padding:0 0 env(safe-area-inset-bottom,0);background:#0000008c;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.incomplete-modal{background:var(--el-surface,#1e293b);border-radius:20px 20px 0 0;flex-direction:column;gap:12px;width:100%;max-width:520px;padding:24px 20px 28px;animation:.22s cubic-bezier(.34,1.3,.64,1) both sim-modal-in;display:flex}.incomplete-modal-icon{text-align:center;font-size:32px}.incomplete-modal-title{color:var(--el-text);text-align:center;font-size:17px;font-weight:800;font-family:var(--el-font);margin:0}.incomplete-modal-sub{color:var(--el-text-muted);text-align:center;margin:0;font-size:13px}.incomplete-modal-list{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.incomplete-modal-item{background:#ffffff0a;border-radius:12px;align-items:center;gap:12px;padding:10px 12px;display:flex}.incomplete-modal-item-icon{flex-shrink:0;font-size:22px}.incomplete-modal-item-text{flex-direction:column;flex:1;gap:2px;display:flex}.incomplete-modal-item-label{color:var(--el-text);font-size:14px;font-weight:700;font-family:var(--el-font)}.incomplete-modal-item-detail{color:var(--el-text-muted);font-size:12px}.incomplete-modal-go{background:var(--el-primary);color:#fff;cursor:pointer;font-size:13px;font-weight:700;font-family:var(--el-font);white-space:nowrap;border:none;border-radius:10px;flex-shrink:0;padding:8px 14px;transition:filter .15s}.incomplete-modal-go:hover{filter:brightness(1.1)}.incomplete-modal-btns{gap:10px;margin-top:4px;display:flex}.incomplete-modal-finish{color:var(--el-text-muted);cursor:pointer;font-size:14px;font-weight:600;font-family:var(--el-font);background:#ffffff0f;border:none;border-radius:14px;flex:1;padding:13px 0;transition:background .15s}.incomplete-modal-finish:hover{background:#ffffff1a}.incomplete-modal-cancel{background:var(--el-primary);color:#fff;cursor:pointer;font-size:14px;font-weight:700;font-family:var(--el-font);border:none;border-radius:14px;flex:1;padding:13px 0;transition:filter .15s}.incomplete-modal-cancel:hover{filter:brightness(1.08)}.sim-view{padding-bottom:var(--space-6)}.sim-title{font-size:var(--text-lg);margin-top:var(--space-2)}.sim-context{padding:var(--space-3) var(--space-4);background:var(--color-surface);border-radius:var(--radius-md);margin-bottom:var(--space-4);border-left:3px solid var(--color-secondary)}.sim-context-label{font-size:var(--text-xs);font-weight:var(--font-semibold);color:var(--color-secondary);margin-bottom:4px;display:block}.sim-prompt-card{margin-bottom:var(--space-4);background:var(--color-surface);border:none}.sim-avatar-row{align-items:center;gap:12px;margin-bottom:12px;display:flex;position:relative}.sim-avatar-circle{background:linear-gradient(135deg,#3b82f626,#10b9811a);border:2px solid #6366f140;border-radius:14px;flex-shrink:0;justify-content:center;align-items:center;width:56px;height:56px;font-size:24px;display:flex;overflow:hidden}.sim-avatar-img{object-fit:cover;border-radius:12px;width:100%;height:100%}.sim-avatar-name{color:var(--color-text);font-size:17px;font-weight:700;line-height:1.2}.sim-avatar-role{color:var(--color-text-muted);letter-spacing:.08em;text-transform:uppercase;margin-top:2px;font-size:11px;font-weight:600}.sim-avatar-online{border:2px solid var(--color-surface);background:#10b981;border-radius:50%;width:12px;height:12px;position:absolute;bottom:0;left:46px;box-shadow:0 0 6px #10b98180}.sim-prompt-text{font-size:var(--text-base);font-weight:var(--font-medium);color:var(--color-text);font-style:italic}.sim-options-header{font-size:var(--text-sm);font-weight:var(--font-semibold);margin-bottom:var(--space-2)}.sim-options{gap:var(--space-2);flex-direction:column;display:flex}.sim-option{padding:var(--space-3) var(--space-4);background:var(--color-surface);border:2px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--text-sm);color:var(--color-text);text-align:left;cursor:pointer;transition:all var(--transition-fast);width:100%}.sim-option:hover:not(:disabled),.sim-option.correct{border-color:var(--color-primary);background:var(--color-primary-light)}.sim-option.wrong{border-color:var(--color-error);background:var(--color-error-light)}.sim-feedback{padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);margin-top:var(--space-3);font-size:var(--text-sm);font-weight:var(--font-medium)}.sim-feedback.correct{background:var(--color-primary-light);color:var(--color-primary-hover)}.sim-feedback.wrong{background:var(--color-error-light);color:#b91c1c}.sim-typing-bubble{padding:var(--space-3) var(--space-4);background:var(--color-surface);border-radius:var(--radius-md);margin-bottom:var(--space-4);flex-direction:column;gap:6px;animation:.25s sim-bubble-in;display:flex}@keyframes sim-bubble-in{0%{opacity:0;transform:translateY(6px)scale(.97)}to{opacity:1;transform:none}}.sim-typing-speaker{font-size:var(--text-xs);font-weight:var(--font-semibold);color:var(--color-text-muted)}.sim-typing-dots{align-items:center;gap:5px;padding:2px 0;display:flex}.sim-typing-dots span{background:var(--color-primary);opacity:.4;border-radius:50%;width:8px;height:8px;animation:1.2s ease-in-out infinite typing-bounce}.sim-typing-dots span:nth-child(2){animation-delay:.2s}.sim-typing-dots span:nth-child(3){animation-delay:.4s}@keyframes typing-bounce{0%,60%,to{opacity:.4;transform:translateY(0)}30%{opacity:1;transform:translateY(-6px)}}.sim-modal-overlay{z-index:200;padding:0 0 env(safe-area-inset-bottom,0);background:#0000008c;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.sim-modal{background:var(--color-surface,#1e293b);border-radius:20px 20px 0 0;flex-direction:column;gap:10px;width:100%;max-width:520px;padding:24px 20px 28px;animation:.22s cubic-bezier(.34,1.3,.64,1) both sim-modal-in;display:flex}@keyframes sim-modal-in{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}.sim-modal-emoji{text-align:center;font-size:36px}.sim-modal-title{color:var(--color-text);text-align:center;font-size:18px;font-weight:800;font-family:var(--font-heading,var(--font-body));margin:0}.sim-modal-sub{color:var(--color-text-muted);text-align:center;margin:0;font-size:14px}.sim-modal-sub strong{color:var(--color-text)}.sim-modal-explanation{color:var(--color-text-muted);background:#ffffff0a;border-radius:10px;margin:0;padding:10px 12px;font-size:13px;line-height:1.5}.sim-modal-pronun-offer{border-top:1px solid #ffffff0f;flex-direction:column;gap:10px;padding-top:12px;display:flex}.sim-modal-pronun-label{color:var(--color-text);text-align:center;margin:0;font-size:14px;font-weight:600}.sim-modal-pronun-btns{gap:10px;display:flex}.sim-pronun-yes{background:var(--color-primary);color:#fff;cursor:pointer;font-size:14px;font-weight:700;font-family:var(--font-body);border:none;border-radius:12px;flex:1;padding:12px 0;transition:filter .15s}.sim-pronun-yes:hover{filter:brightness(1.08)}.sim-pronun-skip{color:var(--color-text-muted);cursor:pointer;font-size:14px;font-weight:600;font-family:var(--font-body);background:#ffffff0f;border:none;border-radius:12px;flex:1;padding:12px 0;transition:background .15s}.sim-pronun-skip:hover{background:#ffffff1a}.sim-modal-pronun-panel{border-top:1px solid #ffffff0f;padding-top:12px}.sim-modal-next{background:var(--color-primary);color:#fff;cursor:pointer;width:100%;font-size:15px;font-weight:700;font-family:var(--font-body);border:none;border-radius:14px;margin-top:4px;padding:14px 0;transition:filter .15s}.sim-modal-next:hover{filter:brightness(1.08)}.progress-page{padding-bottom:var(--space-4)}.progress-stats-grid{gap:var(--space-3);grid-template-columns:1fr 1fr;display:grid}.progress-stat-card{text-align:center}.progress-stat-number{font-size:var(--text-3xl);font-weight:var(--font-extrabold);color:var(--color-primary)}.progress-stat-label{font-size:var(--text-xs);color:var(--color-text-muted);margin-top:2px}.progress-routes{gap:var(--space-3);flex-direction:column;display:flex}.progress-motivation{background:linear-gradient(135deg, var(--color-primary-light), var(--color-surface));border:1px solid var(--color-primary)}.heatmap-header{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:4px;margin-bottom:12px;display:flex}.heatmap-title{color:var(--color-text);font-size:14px;font-weight:700}.heatmap-subtitle{color:var(--color-text-muted);font-size:11px}.heatmap-grid{grid-template-columns:repeat(13,1fr);gap:3px;display:grid}.heatmap-cell{aspect-ratio:1;border-radius:3px;min-width:0;transition:transform .1s}.heatmap-cell:hover{transform:scale(1.3)}.heatmap-cell.intensity-0{background:var(--color-border)}.heatmap-cell.intensity-1{background:color-mix(in srgb, var(--color-primary) 35%, transparent)}.heatmap-cell.intensity-2{background:color-mix(in srgb, var(--color-primary) 65%, transparent)}.heatmap-cell.intensity-3{background:var(--color-primary)}.heatmap-legend{justify-content:flex-end;align-items:center;gap:4px;margin-top:10px;display:flex}.heatmap-legend span{color:var(--color-text-subtle);font-size:10px}.heatmap-legend .heatmap-cell{width:11px;height:11px}.profile-page{padding-bottom:var(--space-4)}.profile-header{align-items:center;gap:var(--space-4);display:flex}.profile-info-row{padding:var(--space-3) 0;border-bottom:1px solid var(--color-border);justify-content:space-between;align-items:center;display:flex}.profile-info-row:last-child{border-bottom:none}.theme-toggle-switch{background:var(--color-surface-alt);border:2px solid var(--color-border);cursor:pointer;border-radius:15px;outline:none;flex-shrink:0;width:56px;height:30px;padding:0;transition:background .3s,border-color .3s;position:relative}.theme-toggle-switch.active{background:var(--color-primary);border-color:var(--color-primary)}.theme-toggle-switch:focus-visible{box-shadow:0 0 0 3px var(--color-primary-light)}.theme-toggle-thumb{background:#fff;border-radius:50%;justify-content:center;align-items:center;width:22px;height:22px;font-size:12px;line-height:1;transition:transform .3s cubic-bezier(.34,1.56,.64,1);display:flex;position:absolute;top:2px;left:2px;box-shadow:0 2px 6px #0003}.theme-toggle-switch.active .theme-toggle-thumb{transform:translate(26px)}.profile-danger-btn{align-items:center;gap:var(--space-2);width:100%;padding:10px var(--space-3);border-radius:var(--radius-md);color:#d97706;font-size:var(--text-sm);cursor:pointer;text-align:left;background:#f59e0b0f;border:1px solid #f59e0b40;font-weight:500;transition:all .18s;display:flex}.profile-danger-btn:hover{background:#f59e0b1f;border-color:#f59e0b73}.vocab-page{max-width:680px;padding:var(--space-6) var(--space-4) var(--space-10);margin:0 auto}.vocab-header{margin-bottom:var(--space-5);justify-content:space-between;align-items:flex-start;display:flex}.vocab-title{font-size:var(--text-2xl);font-weight:var(--font-bold);margin:0 0 4px}.vocab-subtitle{font-size:var(--text-sm);color:var(--color-text-muted)}.vocab-search{margin-bottom:var(--space-5)}.vocab-empty{text-align:center;padding:var(--space-10) var(--space-4);align-items:center;gap:var(--space-3);flex-direction:column;display:flex}.vocab-empty-icon{margin-bottom:var(--space-2);font-size:48px}.vocab-group{margin-bottom:var(--space-6)}.vocab-group-date{font-size:var(--text-xs);font-weight:var(--font-semibold);text-transform:capitalize;color:var(--color-text-muted);padding:var(--space-2) 0;border-bottom:1px solid var(--color-border);margin-bottom:var(--space-3)}.vocab-grid{gap:var(--space-3);grid-template-columns:repeat(auto-fill,minmax(200px,1fr));display:grid}.vocab-card{background:var(--color-surface);border:1.5px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-3) var(--space-4);transition:border-color var(--transition-fast), box-shadow var(--transition-fast);justify-content:space-between;align-items:center;gap:var(--space-2);display:flex}.vocab-card:hover{border-color:var(--color-primary);box-shadow:var(--shadow-sm)}.vocab-card-content{flex-direction:column;gap:2px;min-width:0;display:flex}.vocab-word{font-weight:var(--font-semibold);font-size:var(--text-sm);color:var(--color-text)}.vocab-translation{font-size:var(--text-xs);color:var(--color-text-muted);font-style:italic}.vocab-delete{border-radius:var(--radius-full);width:24px;height:24px;color:var(--color-text-subtle);cursor:pointer;transition:all var(--transition-fast);background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;font-size:18px;line-height:1;display:flex}.vocab-delete:hover{color:#ef4444;background:#fef2f2}.vocab-tip{align-items:flex-start;gap:var(--space-3);padding:var(--space-4);background:var(--color-primary-light);border-radius:var(--radius-lg);margin-top:var(--space-4);display:flex}.vocab-export-btn{white-space:nowrap;flex-shrink:0}.vocab-stats{gap:var(--space-4);padding:var(--space-3) var(--space-4);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);margin-bottom:var(--space-4);display:flex}.vocab-stat{flex-direction:column;align-items:center;gap:2px;display:flex}.vocab-stat-num{font-size:var(--text-xl);font-weight:var(--font-bold);color:var(--color-primary);line-height:1}.vocab-stat-label{color:var(--color-text-muted);text-align:center;font-size:10px}.vocab-card-actions{flex-shrink:0;align-items:center;gap:4px;display:flex}.vocab-translate-btn{border-radius:var(--radius-full);cursor:pointer;width:28px;height:28px;transition:all var(--transition-fast);opacity:.5;background:0 0;border:none;justify-content:center;align-items:center;font-size:15px;display:flex}.vocab-translate-btn:hover{opacity:1;background:#eff6ff}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;font-size:16px}body{font-family:var(--font-primary,"Inter"), -apple-system, BlinkMacSystemFont, sans-serif;background-color:var(--color-background,#fff);color:var(--color-text,#1e293b);-webkit-font-smoothing:antialiased;min-height:100vh;line-height:1.6}img,svg{max-width:100%;display:block}button{cursor:pointer;background:0 0;border:none;font-family:inherit}a{color:inherit;text-decoration:none}input,textarea,select{font-family:inherit}#root{min-height:100vh}:root{--color-primary:#10b981;--color-primary-hover:#059669;--color-primary-light:#d1fae5;--color-secondary:#2563eb;--color-secondary-hover:#1d4ed8;--color-accent:#f59e0b;--color-accent-hover:#d97706;--color-success:#10b981;--color-error:#ef4444;--color-error-light:#fef2f2;--color-warning:#f59e0b;--color-warning-light:#fffbeb;--color-background:#fff;--color-surface:#f8fafc;--color-surface-alt:#f1f5f9;--color-surface-hover:#e2e8f0;--color-text:#1e293b;--color-text-secondary:#334155;--color-text-muted:#64748b;--color-text-subtle:#94a3b8;--color-text-inverse:#fff;--color-border:#e2e8f0;--color-border-focus:#10b981;--font-primary:"Inter", -apple-system, BlinkMacSystemFont, sans-serif;--font-heading:"Inter", -apple-system, BlinkMacSystemFont, sans-serif;--text-xs:.75rem;--text-sm:.875rem;--text-base:1rem;--text-lg:1.125rem;--text-xl:1.25rem;--text-2xl:1.5rem;--text-3xl:1.875rem;--text-4xl:2.25rem;--font-normal:400;--font-medium:500;--font-semibold:600;--font-bold:700;--font-extrabold:800;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--space-16:64px;--space-20:80px;--radius-sm:6px;--radius-md:10px;--radius-lg:16px;--radius-xl:20px;--radius-2xl:28px;--radius-full:9999px;--shadow-xs:0 1px 2px #0000000d;--shadow-sm:0 1px 4px #00000014;--shadow-md:0 4px 16px #00000014;--shadow-lg:0 8px 32px #0000001a;--shadow-xl:0 16px 48px #0000001f;--shadow-primary:0 4px 20px #10b98140;--transition-fast:.15s ease;--transition:.2s ease;--transition-slow:.35s ease;--z-base:1;--z-dropdown:100;--z-sticky:200;--z-overlay:250;--z-modal:300;--z-toast:400;--sidebar-width:260px;--topbar-height:60px;--bottom-nav-height:64px;--content-max-width:680px}[data-theme=dark]{--color-background:#0f172a;--color-surface:#1e293b;--color-surface-alt:#1e293b;--color-surface-hover:#2d3748;--color-text:#f1f5f9;--color-text-secondary:#cbd5e1;--color-text-muted:#94a3b8;--color-text-subtle:#64748b;--color-text-inverse:#0f172a;--color-border:#334155;--color-border-focus:#10b981;--color-primary:#10b981;--color-primary-hover:#059669;--color-primary-light:#10b98126;--color-error-light:#ef444426;--color-warning-light:#f59e0b26;--shadow-xs:0 1px 2px #0000004d;--shadow-sm:0 1px 4px #0006;--shadow-md:0 4px 16px #0006;--shadow-lg:0 8px 32px #00000080;--shadow-xl:0 16px 48px #0009}body{transition:background-color .25s,color .25s}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);font-weight:var(--font-bold);color:var(--color-text);line-height:1.25}h1{font-size:clamp(1.75rem,5vw,2.5rem)}h2{font-size:clamp(1.4rem,4vw,2rem)}h3{font-size:clamp(1.1rem,3vw,1.375rem)}h4{font-size:var(--text-lg);font-weight:var(--font-semibold)}p{color:var(--color-text-secondary);line-height:1.7}.container{width:100%;max-width:1200px;padding:0 var(--space-4);margin:0 auto}.container-sm{max-width:480px;padding:0 var(--space-4);margin:0 auto}.container-md{max-width:720px;padding:0 var(--space-4);margin:0 auto}.container-app{max-width:var(--content-max-width);padding:0 var(--space-4);margin:0 auto}.btn{justify-content:center;align-items:center;gap:var(--space-2);border-radius:var(--radius-full);font-size:var(--text-sm);font-weight:var(--font-semibold);letter-spacing:.01em;transition:all var(--transition);cursor:pointer;white-space:nowrap;border:none;outline:none;padding:12px 24px;display:inline-flex}.btn:focus-visible{box-shadow:0 0 0 3px var(--color-primary-light)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--color-primary);color:var(--color-text-inverse);box-shadow:var(--shadow-primary)}.btn-primary:hover:not(:disabled){background:var(--color-primary-hover);transform:translateY(-1px);box-shadow:0 6px 24px #10b98159}.btn-primary:active{transform:translateY(0)}.btn-secondary{background:var(--color-secondary);color:var(--color-text-inverse)}.btn-secondary:hover:not(:disabled){background:var(--color-secondary-hover);transform:translateY(-1px)}.btn-outline{color:var(--color-primary);border:2px solid var(--color-primary);background:0 0}.btn-outline:hover:not(:disabled){background:var(--color-primary-light)}.btn-ghost{color:var(--color-text-muted);background:0 0}.btn-ghost:hover:not(:disabled){background:var(--color-surface-alt);color:var(--color-text)}.btn-sm{font-size:var(--text-xs);padding:8px 16px}.btn-lg{font-size:var(--text-base);padding:16px 32px}.btn-full{width:100%}.card{background:var(--color-background);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);border:1px solid var(--color-border);overflow:hidden}.card-body{padding:var(--space-5)}.card-hover{transition:all var(--transition);cursor:pointer}.card-hover:hover{box-shadow:var(--shadow-md);border-color:var(--color-primary);transform:translateY(-2px)}.input-group{gap:var(--space-1);flex-direction:column;display:flex}.input-label{font-size:var(--text-sm);font-weight:var(--font-medium);color:var(--color-text)}.input{border:2px solid var(--color-border);border-radius:var(--radius-md);width:100%;font-size:var(--text-base);color:var(--color-text);background:var(--color-background);transition:border-color var(--transition);outline:none;padding:12px 16px}.input:focus{border-color:var(--color-border-focus)}.input::placeholder{color:var(--color-text-subtle)}.input-error{border-color:var(--color-error)}.input-hint{font-size:var(--text-xs);color:var(--color-text-muted)}.input-error-msg{font-size:var(--text-xs);color:var(--color-error)}.input-has-toggle{padding-right:44px}.input-eye-toggle:hover{color:var(--color-text)!important}.input-password-wrapper{width:100%}.badge{border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:var(--font-semibold);align-items:center;gap:4px;padding:3px 10px;display:inline-flex}.badge-green{background:var(--color-primary-light);color:var(--color-primary-hover)}.badge-blue{color:#1d4ed8;background:#dbeafe}.badge-orange{background:var(--color-warning-light);color:#b45309}.badge-red{background:var(--color-error-light);color:#b91c1c}.badge-gray{background:var(--color-surface-alt);color:var(--color-text-muted)}.progress-bar{background:var(--color-surface-alt);border-radius:var(--radius-full);height:6px;overflow:hidden}.progress-fill{background:var(--color-primary);border-radius:var(--radius-full);height:100%;transition:width var(--transition-slow)}.avatar{border-radius:var(--radius-full);background:var(--color-primary-light);color:var(--color-primary);font-weight:var(--font-bold);flex-shrink:0;justify-content:center;align-items:center;display:flex}.avatar-sm{width:32px;height:32px;font-size:var(--text-sm)}.avatar-md{width:40px;height:40px;font-size:var(--text-base)}.avatar-lg{width:56px;height:56px;font-size:var(--text-xl)}.divider{background:var(--color-border);height:1px;margin:var(--space-4) 0}.divider-text{align-items:center;gap:var(--space-3);color:var(--color-text-muted);font-size:var(--text-sm);display:flex}.divider-text:before,.divider-text:after{content:"";background:var(--color-border);flex:1;height:1px}.spinner{border:3px solid var(--color-border);border-top-color:var(--color-primary);border-radius:50%;width:24px;height:24px;animation:.7s linear infinite spin}.spinner-lg{border-width:4px;width:40px;height:40px}.page-center{min-height:100vh;padding:var(--space-4);background:var(--color-surface);justify-content:center;align-items:center;display:flex}.flex{display:flex}.flex-col{flex-direction:column}.flex-1{flex:1}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-1{gap:var(--space-1)}.gap-2{gap:var(--space-2)}.gap-3{gap:var(--space-3)}.gap-4{gap:var(--space-4)}.gap-6{gap:var(--space-6)}.gap-8{gap:var(--space-8)}.w-full{width:100%}.h-full{height:100%}.text-center{text-align:center}.text-sm{font-size:var(--text-sm)}.text-xs{font-size:var(--text-xs)}.text-lg{font-size:var(--text-lg)}.text-muted{color:var(--color-text-muted)}.text-primary{color:var(--color-primary)}.text-error{color:var(--color-error)}.font-medium{font-weight:var(--font-medium)}.font-semibold{font-weight:var(--font-semibold)}.font-bold{font-weight:var(--font-bold)}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.rounded-full{border-radius:var(--radius-full)}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.animate-fadeIn{animation:.3s forwards fadeIn}.animate-slideUp{animation:.4s forwards slideUp}.animate-pulse{animation:2s infinite pulse}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--color-text-subtle)}*{-webkit-tap-highlight-color:transparent}.toast{bottom:calc(var(--bottom-nav-height) + var(--space-4));z-index:var(--z-toast);background:var(--color-text);color:#fff;border-radius:var(--radius-full);font-size:var(--text-sm);font-weight:var(--font-medium);box-shadow:var(--shadow-lg);white-space:nowrap;pointer-events:none;padding:12px 20px;animation:.3s slideUp;position:fixed;left:50%;transform:translate(-50%)}.toast-success{background:var(--color-primary)}.toast-error{background:var(--color-error)}