@import"https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&display=swap";:root{--bg-dark: #09090b;--bg-gradient: radial-gradient(ellipse at top right, #2e1065 0%, #09090b 60%);--glass-bg: rgba(255, 255, 255, .03);--glass-border: rgba(255, 255, 255, .08);--glass-highlight: rgba(255, 255, 255, .15);--text-main: #fafafa;--text-muted: #a1a1aa;--accent-base: #a855f7;--accent-glow: #d8b4fe;--success: #34d399;--failure: #f87171;--surface-1: #18181b;--surface-2: #27272a;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--spacing-2xl: 3rem;--radius-sm: .5rem;--radius-md: 1rem;--radius-lg: 1.5rem;--radius-full: 9999px;--transition-fast: .15s ease-out;--transition-normal: .3s cubic-bezier(.4, 0, .2, 1);--transition-slow: .5s cubic-bezier(.4, 0, .2, 1);--font-family: "Outfit", system-ui, -apple-system, sans-serif}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;min-height:100vh;margin:0;font-family:var(--font-family);background-color:var(--bg-dark);background-image:var(--bg-gradient);background-attachment:fixed;color:var(--text-main);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.5;overflow-x:hidden}button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}ul,ol{list-style:none}a{color:inherit;text-decoration:none}.glass-panel{background:var(--glass-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--glass-border);box-shadow:0 8px 32px #0000005e;border-radius:var(--radius-md);transition:border-color var(--transition-normal),transform var(--transition-normal)}.glass-panel:hover{border-color:var(--glass-highlight)}.btn-primary{background:linear-gradient(135deg,#a855f7,#8b5cf6);color:#fff;padding:.75rem 1.5rem;border-radius:var(--radius-full);font-weight:600;letter-spacing:.5px;box-shadow:0 4px 15px #a855f766;transition:transform var(--transition-fast),box-shadow var(--transition-fast);display:inline-flex;align-items:center;justify-content:center;gap:.5rem}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 20px #a855f799}.btn-primary:active{transform:translateY(1px)}.btn-secondary{background:var(--glass-bg);border:1px solid var(--glass-border);color:var(--text-main);padding:.75rem 1.5rem;border-radius:var(--radius-full);font-weight:500;transition:all var(--transition-normal)}.btn-secondary:hover{background:var(--glass-highlight);border-color:var(--text-muted)}.btn-icon{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--glass-bg);border:1px solid var(--glass-border);color:var(--accent-glow);transition:all var(--transition-fast)}.btn-icon:hover{background:#a855f71a;border-color:var(--accent-base);color:#fff;transform:scale(1.05)}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:fadeIn .5s ease-out forwards}@keyframes pulse-glow{0%{box-shadow:0 0 #a855f766}70%{box-shadow:0 0 0 10px #a855f700}to{box-shadow:0 0 #a855f700}}.pulse-primary{animation:pulse-glow 2s infinite}.dashboard{width:100%;max-width:800px;margin:0 auto}.dashboard-hero{text-align:center;margin-bottom:2.5rem}.dashboard-title{font-size:2.75rem;font-weight:800;margin-bottom:1.5rem;background:linear-gradient(to right,#fafafa,#d8b4fe);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.dashboard-stats{display:flex;align-items:center;justify-content:center;gap:1.5rem;margin-bottom:1.25rem}.stat-item{display:flex;flex-direction:column;align-items:center;gap:.2rem}.stat-value{font-size:1.75rem;font-weight:700;color:var(--text-main)}.stat-label{font-size:.75rem;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);font-weight:600}.stat-divider{width:1px;height:2.5rem;background:var(--glass-border)}.dashboard-overall-progress{max-width:400px;margin:0 auto;display:flex;align-items:center;gap:.75rem}.overall-progress-bar{flex:1;height:6px;background:#ffffff0f;border-radius:var(--radius-full);overflow:hidden}.overall-progress-fill{height:100%;background:linear-gradient(90deg,#a855f7,#6366f1);border-radius:var(--radius-full);transition:width var(--transition-slow)}.overall-progress-label{font-size:.8rem;color:var(--text-muted);font-weight:500;white-space:nowrap}.dashboard-cta{width:100%;padding:2rem;margin-bottom:2.5rem;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:1.5rem;text-align:left;transition:border-color var(--transition-normal),transform var(--transition-fast);position:relative;overflow:hidden}.dashboard-cta:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 50%,rgba(168,85,247,.12),transparent 70%);opacity:0;transition:opacity var(--transition-normal)}.dashboard-cta:hover:before{opacity:1}.dashboard-cta:hover{border-color:#a855f766;transform:translateY(-2px)}.dashboard-cta:focus-visible,.refresh-card:focus-visible{outline:2px solid var(--accent-glow);outline-offset:3px}.dashboard-all-done{flex-direction:column;text-align:center;cursor:default}.dashboard-all-done:hover{transform:none}.all-done-icon{font-size:3rem;margin-bottom:.5rem}.cta-content{display:flex;align-items:center;gap:1.5rem;position:relative;z-index:1;min-width:0}.cta-progress-ring{position:relative;width:64px;height:64px;flex-shrink:0}.cta-ring-svg{width:100%;height:100%;transform:rotate(-90deg)}.cta-ring-text{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:.85rem;font-weight:700;color:var(--accent-glow)}.cta-text{min-width:0}.cta-module-level{display:inline-block;font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;color:var(--accent-glow);font-weight:700;margin-bottom:.25rem}.cta-module-title{font-size:1.35rem;font-weight:700;margin-bottom:.25rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cta-module-desc{font-size:.9rem;color:var(--text-muted);line-height:1.4}.cta-resume-hint{display:inline-block;margin-top:.35rem;font-size:.8rem;color:var(--accent-glow);font-weight:500}.cta-button{flex-shrink:0;position:relative;z-index:1;white-space:nowrap}.dashboard-section{margin-bottom:2.5rem}.section-title{font-size:1.1rem;font-weight:700;margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}.section-icon{font-size:1.25rem}.refresh-grid{display:flex;flex-direction:column;gap:.75rem}.refresh-card{width:100%;padding:1rem 1.25rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;cursor:pointer;text-align:left;transition:border-color var(--transition-fast),transform var(--transition-fast)}.refresh-card:hover{border-color:#a855f74d;transform:translate(4px)}.refresh-card-info{display:flex;flex-direction:column;gap:.2rem;min-width:0}.refresh-level{font-size:.65rem;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);font-weight:600}.refresh-title{font-size:1rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.refresh-confidence{font-size:.8rem;color:#fbbf24}.completed-badge{font-size:.8rem;color:var(--success);font-weight:500}.completed-card:hover{border-color:#34d3994d}.refresh-btn{flex-shrink:0;padding:.5rem 1rem;font-size:.85rem}.dashboard-browse{text-align:center;padding-top:.5rem;padding-bottom:2rem}.browse-all-btn{padding:.8rem 2rem;font-size:1rem}@media(max-width:600px){.dashboard-title{font-size:2rem}.dashboard-stats{gap:1rem}.stat-value{font-size:1.35rem}.dashboard-cta{flex-direction:column;align-items:stretch;text-align:center}.cta-content{flex-direction:column}.cta-module-title{white-space:normal}.cta-module-level,.refresh-level{display:none}}.module-selector{width:100%;max-width:1000px;margin:0 auto}.module-header{text-align:center;margin-bottom:3rem}.module-header-top{display:flex;justify-content:flex-start;margin-bottom:1rem;min-height:36px}.module-main-title{font-size:3rem;font-weight:800;margin-bottom:1rem;background:linear-gradient(to right,#fafafa,#d8b4fe);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.module-subtitle{color:var(--text-muted);font-size:1.125rem}.practice-mode-panel{margin:1.5rem auto 0;width:min(560px,100%);padding:1rem}.practice-mode-title{font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);font-weight:700;margin-bottom:.75rem}.practice-mode-toggle{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem}.practice-mode-btn{border-radius:var(--radius-full);border:1px solid var(--glass-border);background:#ffffff0a;color:var(--text-muted);font-size:.95rem;font-weight:600;padding:.65rem 1rem;transition:all var(--transition-fast)}.practice-mode-btn:hover{border-color:var(--glass-highlight);color:var(--text-main)}.practice-mode-btn.active{background:linear-gradient(135deg,#a855f7e6,#8b5cf6e6);color:#fff;border-color:#d8b4fea6;box-shadow:0 6px 18px #a855f759}.module-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:2rem}.module-card{width:100%;cursor:pointer;padding:2rem;display:flex;flex-direction:column;text-align:left;animation:fadeIn .5s ease-out forwards;opacity:0;position:relative;overflow:hidden}.module-card:focus-visible{outline:2px solid var(--accent-glow);outline-offset:3px}.module-card-content{display:flex;flex-direction:column;height:100%;position:relative;z-index:2}.module-card:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at top right,rgba(168,85,247,.15),transparent 70%);opacity:0;transition:opacity var(--transition-normal);z-index:1}.module-card:hover:before{opacity:1}.module-card-top-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem;gap:.5rem}.module-level{display:inline-block;padding:.25rem .75rem;background:#a855f733;color:var(--accent-glow);border-radius:var(--radius-full);font-size:.875rem;font-weight:600}.module-status-badge{display:inline-flex;align-items:center;gap:.3rem;padding:.2rem .6rem;border-radius:var(--radius-full);font-size:.75rem;font-weight:600}.status-completed{background:#34d39926;color:var(--success)}.status-refresh{background:#fbbf2426;color:#fbbf24}.status-in-progress{background:#a855f726;color:var(--accent-glow)}.module-title{font-size:1.5rem;font-weight:700;margin-bottom:.75rem}.module-description{color:var(--text-muted);margin-bottom:1rem;flex-grow:1;line-height:1.6}.module-progress-bar-wrapper{display:flex;align-items:center;gap:.5rem;margin-bottom:1rem}.module-progress-bar{flex:1;height:4px;background:#ffffff0f;border-radius:var(--radius-full);overflow:hidden}.module-progress-fill{height:100%;background:linear-gradient(90deg,#a855f7,#6366f1);border-radius:var(--radius-full);transition:width var(--transition-slow)}.module-progress-fill.fill-complete{background:linear-gradient(90deg,#34d399,#10b981)}.module-progress-fill.fill-refresh{background:linear-gradient(90deg,#fbbf24,#f59e0b)}.module-progress-label{font-size:.75rem;color:var(--text-muted);font-weight:600;min-width:2.5rem;text-align:right}.module-meta{display:flex;align-items:center;justify-content:space-between;margin-top:auto;gap:1rem}.sentence-count{font-size:.875rem;color:var(--text-muted);font-weight:500}.story-card{border-left:3px solid rgba(251,191,36,.6)}.story-card:before{background:radial-gradient(circle at top right,rgba(251,191,36,.12),transparent 70%)!important}.story-card:hover{border-left-color:#fbbf24e6}.status-story{background:#fbbf2426;color:#fbbf24}.review-card{border-left:3px solid rgba(45,212,191,.6)}.review-card:before{background:radial-gradient(circle at top right,rgba(45,212,191,.12),transparent 70%)!important}.review-card:hover{border-left-color:#2dd4bfe6}.status-review{background:#2dd4bf26;color:#2dd4bf}.module-badges-row{display:flex;align-items:center;gap:.4rem;flex-wrap:wrap}@media(max-width:700px){.practice-mode-toggle{grid-template-columns:1fr}.module-grid{grid-template-columns:1fr;gap:1.25rem}.module-card{padding:1.25rem}.module-level{display:none}.module-card-top-row{justify-content:flex-end;margin-bottom:.5rem}.module-title{font-size:1.25rem}.module-main-title{font-size:2.25rem}.module-meta{flex-direction:column;align-items:flex-start;gap:.75rem}.module-card-action{width:100%}}.tutorial-overlay{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;pointer-events:none;animation:tutorialFadeIn .4s ease-out}.tutorial-overlay:before{content:"";position:absolute;inset:0;background:#000000b3;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);z-index:-1}.tutorial-overlay.has-spotlight:before{display:none}@keyframes tutorialFadeIn{0%{opacity:0}to{opacity:1}}.tutorial-spotlight-svg{position:fixed;inset:0;z-index:0;pointer-events:none}.tutorial-spotlight-ring{stroke:#a855f799;animation:spotlightPulse 2s ease-in-out infinite}@keyframes spotlightPulse{0%,to{stroke-opacity:.5;stroke-width:2}50%{stroke-opacity:1;stroke-width:3}}.tutorial-pointer{z-index:10001;pointer-events:none;filter:drop-shadow(0 0 10px rgba(168,85,247,.7))}.tutorial-pointer-svg{color:var(--accent-glow, #c084fc)}.tutorial-pointer.points-up{animation:pointerBounceUp 1.2s ease-in-out infinite}.tutorial-pointer.points-down{animation:pointerBounceDown 1.2s ease-in-out infinite}@keyframes pointerBounceUp{0%,to{transform:translateY(0) rotate(180deg)}50%{transform:translateY(8px) rotate(180deg)}}@keyframes pointerBounceDown{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(8px) rotate(0)}}.tutorial-card{position:relative;z-index:10002;pointer-events:auto;max-width:380px;width:100%;padding:1.75rem 1.5rem 1.25rem;display:flex;flex-direction:column;align-items:center;gap:.9rem;border-radius:20px;background:linear-gradient(160deg,#191034f7,#0c0a16fa);border:1px solid rgba(168,85,247,.2);box-shadow:0 24px 80px #0009,0 0 0 1px #a855f71a,0 0 60px #a855f714,inset 0 1px #ffffff0d;animation:tutorialCardIn .5s cubic-bezier(.22,1,.36,1);overflow:hidden}@keyframes tutorialCardIn{0%{opacity:0;transform:translateY(20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.tutorial-card-border{position:absolute;inset:-1px;border-radius:21px;background:conic-gradient(from var(--border-angle, 0deg),rgba(168,85,247,.5),rgba(56,189,248,.3),rgba(168,85,247,.1),rgba(234,179,8,.3),rgba(168,85,247,.5));z-index:-1;animation:borderSpin 4s linear infinite;opacity:.7}@property --border-angle{syntax: "<angle>"; inherits: false; initial-value: 0deg;}@keyframes borderSpin{to{--border-angle: 360deg}}@supports not (background: conic-gradient(red,blue)){.tutorial-card-border{background:linear-gradient(135deg,#a855f766,#38bdf84d)}}.tutorial-skip{position:absolute;top:.6rem;right:.6rem;width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:50%;color:#ffffff59;transition:all .2s ease;z-index:2}.tutorial-skip:hover{background:#ffffff1a;color:#fffc}.tutorial-progress-track{width:100%;height:3px;background:#ffffff0f;border-radius:2px;overflow:hidden}.tutorial-progress-fill{height:100%;background:linear-gradient(90deg,var(--accent-base, #a855f7),var(--accent-glow, #c084fc),#38bdf8);border-radius:2px;transition:width .4s cubic-bezier(.22,1,.36,1)}.tutorial-step{display:flex;align-items:flex-start;gap:1rem;width:100%;min-height:80px}.tutorial-step-enter{animation:tutorialStepIn .35s ease-out}.tutorial-step-exit{opacity:0;transform:translate(-8px);transition:all .2s ease-in}@keyframes tutorialStepIn{0%{opacity:0;transform:translate(12px)}to{opacity:1;transform:translate(0)}}.tutorial-icon-wrapper{width:52px;height:52px;min-width:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;position:relative;transition:background .3s ease,border-color .3s ease}.tutorial-icon{font-size:1.5rem;position:relative;z-index:1}.tutorial-accent-listen{background:#38bdf81f;border:1px solid rgba(56,189,248,.3)}.tutorial-accent-speak{background:#eab3081f;border:1px solid rgba(234,179,8,.3)}.tutorial-accent-text{background:#a855f71f;border:1px solid rgba(168,85,247,.3)}.tutorial-accent-word{background:#34d3991f;border:1px solid rgba(52,211,153,.3)}.tutorial-accent-translate{background:#fb923c1f;border:1px solid rgba(251,146,60,.3)}.tutorial-accent-flow{background:linear-gradient(135deg,#a855f72e,#38bdf826);border:1px solid rgba(168,85,247,.35)}.tutorial-step-text{display:flex;flex-direction:column;gap:.35rem;flex:1}.tutorial-title{font-size:1.1rem;font-weight:700;color:#fff;line-height:1.3;margin:0}.tutorial-body{font-size:.88rem;color:#fff9;line-height:1.6;margin:0}.tutorial-dots{display:flex;gap:6px}.tutorial-dot{width:7px;height:7px;border-radius:50%;background:#ffffff1f;border:none;padding:0;cursor:pointer;transition:all .3s ease}.tutorial-dot.active{width:22px;border-radius:4px;background:linear-gradient(90deg,var(--accent-base, #a855f7),var(--accent-glow, #c084fc));box-shadow:0 0 12px #a855f780}.tutorial-dot.done{background:#a855f766}.tutorial-dot:hover:not(.active){background:#ffffff40}.tutorial-counter{font-size:.7rem;color:#fff3;font-weight:600;letter-spacing:.08em;text-transform:uppercase}.tutorial-nav{display:flex;align-items:center;justify-content:space-between;width:100%;gap:.5rem}.tutorial-btn-prev{padding:.5rem 1rem;font-size:.85rem;font-weight:500;color:#ffffff80;border-radius:10px;transition:all .2s ease;border:1px solid transparent}.tutorial-btn-prev:hover{color:#fff;background:#ffffff0f;border-color:#ffffff1a}.tutorial-btn-next{flex:1;padding:.6rem 1.25rem;font-size:.9rem;font-weight:600;color:#fff;background:linear-gradient(135deg,var(--accent-base, #a855f7) 0%,#7c3aed 100%);border:none;border-radius:10px;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 16px #a855f759;position:relative;overflow:hidden}.tutorial-btn-next:after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 40%,rgba(255,255,255,.1) 50%,transparent 60%);transform:translate(-100%);animation:shimmerBtn 3s ease-in-out infinite}@keyframes shimmerBtn{0%{transform:translate(-100%)}40%{transform:translate(100%)}to{transform:translate(100%)}}.tutorial-btn-next:hover{transform:translateY(-1px);box-shadow:0 6px 24px #a855f780}.tutorial-btn-next:active{transform:translateY(0)}.tutorial-btn-skip-text{color:#ffffff59;font-size:.85rem;font-weight:500;padding:.5rem 1rem;border-radius:10px;transition:all .2s ease}.tutorial-btn-skip-text:hover{color:#ffffffb3;background:#ffffff0d}.tutorial-sparkles{position:absolute;inset:-8px;pointer-events:none;z-index:0}.tutorial-sparkle{position:absolute;width:4px;height:4px;border-radius:50%;background:#c084fc;animation:sparkleFloat 2.5s ease-in-out infinite;animation-delay:calc(var(--i) * .4s);opacity:0}.tutorial-sparkle:nth-child(1){top:10%;left:20%;background:#38bdf8}.tutorial-sparkle:nth-child(2){top:50%;left:90%;background:#c084fc}.tutorial-sparkle:nth-child(3){top:85%;left:15%;background:#fbbf24}.tutorial-sparkle:nth-child(4){top:20%;left:80%;background:#34d399}.tutorial-sparkle:nth-child(5){top:70%;left:70%;background:#fb923c}.tutorial-sparkle:nth-child(6){top:40%;left:5%;background:#c084fc}@keyframes sparkleFloat{0%{opacity:0;transform:scale(0) translateY(0)}20%{opacity:1;transform:scale(1) translateY(-4px)}40%{opacity:.8;transform:scale(.7) translateY(-10px)}to{opacity:0;transform:scale(0) translateY(-20px)}}.btn-help{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#ffffff0d;border:1px solid var(--glass-border);color:var(--text-muted);font-size:.9rem;font-weight:700;font-family:var(--font-family);cursor:pointer;transition:all var(--transition-fast);flex-shrink:0}.btn-help:hover{background:#a855f726;border-color:#a855f766;color:var(--accent-glow);transform:scale(1.08)}@media(max-width:600px){.tutorial-card{max-width:calc(100vw - 2rem);padding:1.5rem 1.25rem 1rem;gap:.75rem;border-radius:16px}.tutorial-card-anchored{width:calc(100vw - 2rem)!important;left:1rem!important}.tutorial-step{min-height:60px}.tutorial-icon-wrapper{width:44px;height:44px;min-width:44px;border-radius:12px}.tutorial-icon{font-size:1.25rem}.tutorial-title{font-size:1rem}.tutorial-body{font-size:.82rem}.tutorial-btn-next{font-size:.85rem;padding:.55rem 1rem}.tutorial-pointer{display:none}}.lesson-player{width:100%;max-width:800px;margin:0 auto}.lesson-player.ser-estar-choice-player{max-width:760px}.lesson-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:2rem;gap:1rem}.ser-estar-choice-player .lesson-header{margin-bottom:1rem}.ser-estar-choice-player .lesson-nav-bar{margin-top:1rem}.btn-sm{padding:.5rem 1rem;font-size:.875rem}.lesson-progress{--lesson-progress: 0%;flex:1;min-width:180px;display:grid;grid-template-columns:auto minmax(120px,1fr) auto;align-items:center;gap:.85rem;padding:.45rem .65rem;border:1px solid rgba(255,255,255,.07);border-radius:var(--radius-full);background:linear-gradient(180deg,#ffffff0b,#ffffff05);box-shadow:inset 0 1px #ffffff0a}.lesson-progress-copy{display:flex;align-items:baseline;gap:.4rem;min-width:116px;white-space:nowrap}.lesson-progress-step{color:var(--text-muted);font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.lesson-progress-count,.lesson-progress-percent{color:var(--text-main);font-size:.86rem;font-weight:700;font-variant-numeric:tabular-nums}.lesson-progress-percent{min-width:2.65rem;text-align:right;color:#d8b4fef2}.lesson-progress-track{position:relative;height:12px;border-radius:var(--radius-full);background:linear-gradient(180deg,#ffffff17,#ffffff06),#ffffff0a;border:1px solid rgba(255,255,255,.07);overflow:visible}.lesson-progress-fill{position:absolute;inset:0 auto 0 0;width:var(--lesson-progress);min-width:0;border-radius:inherit;overflow:hidden;background:linear-gradient(90deg,#2dd4bfe6,#a855f7eb,#d8b4fefa);box-shadow:0 0 16px #a855f752;transition:width .52s cubic-bezier(.22,1,.36,1)}.lesson-progress-fill:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.34),transparent);transform:translate(-100%);animation:progress-sheen 1.1s ease-out}.lesson-progress-marker{position:absolute;top:50%;left:var(--lesson-progress);width:18px;height:18px;border-radius:999px;background:#f5f3ff;border:3px solid rgba(168,85,247,.9);box-shadow:0 0 0 4px #a855f729,0 0 18px #d8b4fe8c;transform:translate(-50%,-50%);transition:left .52s cubic-bezier(.22,1,.36,1);z-index:2}.lesson-progress-pips{position:absolute;inset:0 8px;display:flex;align-items:center;justify-content:space-between;pointer-events:none;z-index:1}.lesson-progress-pip{width:3px;height:3px;border-radius:999px;background:#fff3;transition:background var(--transition-normal),transform var(--transition-normal)}.lesson-progress-pip.is-filled{background:#ffffffbf;transform:scale(1.25)}@keyframes progress-sheen{0%{transform:translate(-100%)}to{transform:translate(100%)}}.lesson-content{padding:3rem 2rem;display:flex;flex-direction:column;align-items:center;gap:3rem}.lesson-finished{padding:3rem 2rem;text-align:center;max-width:680px;width:100%;margin:3rem auto 0;display:flex;flex-direction:column;align-items:center;gap:1.75rem}.finished-icon{font-size:4rem}.finished-title{font-size:2rem;font-weight:700}.finished-subtitle{color:var(--text-muted);font-size:1.125rem}.finished-actions{display:flex;gap:1rem;flex-wrap:wrap;justify-content:center;margin-top:.5rem}.vocab-section{width:100%;text-align:left}.vocab-heading{font-size:1.125rem;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;margin-bottom:.75rem;text-align:center}.vocab-table-wrapper{max-height:360px;overflow-y:auto;border-radius:var(--radius-md);border:1px solid var(--glass-border);scrollbar-width:thin;scrollbar-color:var(--glass-highlight) transparent}.vocab-table{width:100%;border-collapse:collapse;font-size:1rem}.vocab-table thead th{position:sticky;top:0;background:var(--surface-2);color:var(--text-muted);font-size:.8rem;text-transform:uppercase;letter-spacing:.06em;padding:.6rem 1rem;text-align:left;border-bottom:1px solid var(--glass-border)}.vocab-table tbody tr{border-bottom:1px solid rgba(255,255,255,.05);transition:background var(--transition-fast)}.vocab-table tbody tr:nth-child(2n){background:#ffffff05}.vocab-table tbody tr:hover{background:#a855f714}.vocab-table td{padding:.65rem 1rem;vertical-align:middle}.vocab-word{font-weight:600;color:var(--accent-glow);font-size:1.05rem;cursor:pointer;transition:color var(--transition-fast),transform var(--transition-fast)}.vocab-word:hover{color:var(--accent-base);text-decoration:underline}.vocab-meaning{color:var(--text-main)}.vocab-mnemonic{display:flex;flex-direction:column;gap:.2rem}.mnemonic-text{color:#fbbf24;font-size:.88rem;font-weight:500;line-height:1.4}.explanation-text{color:var(--text-muted);font-size:.82rem;font-style:italic;line-height:1.4}.audio-section{display:flex;justify-content:center;width:100%}.btn-play{position:relative;width:96px;height:96px;border-radius:50%;background:linear-gradient(135deg,var(--accent-base) 0%,#7c3aed 100%);color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 30px #a855f766;transition:transform var(--transition-fast),box-shadow var(--transition-fast)}.btn-play:hover{transform:scale(1.05);box-shadow:0 15px 40px #a855f780}.btn-play:active{transform:scale(.95)}.spanish-area{min-height:80px;display:flex;align-items:center;justify-content:center;width:100%}.btn-reveal{background:#ffffff0d;border:1px dashed var(--glass-highlight);padding:1rem 2rem;border-radius:var(--radius-md);color:var(--text-muted);font-size:1.125rem;transition:all var(--transition-fast);width:100%;max-width:300px}.btn-reveal:hover{background:#ffffff1a;color:var(--text-main);border-color:var(--accent-glow)}.spanish-sentence{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem;font-size:2rem;font-weight:500;line-height:1.5;text-align:center}.word-container{position:relative}.spanish-word{padding:.25rem .5rem;border-radius:var(--radius-sm);transition:all var(--transition-fast);cursor:default;display:inline-block}.spanish-word.has-meaning{cursor:pointer;border-bottom:2px dotted rgba(255,255,255,.3)}.spanish-word.has-meaning:hover{background:#ffffff1a;border-bottom-color:var(--accent-glow)}.spanish-word.active{background:#a855f733;color:var(--accent-glow);border-bottom-color:var(--accent-base)}.word-tooltip{position:absolute;top:100%;left:50%;transform:translate(-50%);margin-top:.5rem;background:var(--surface-2);border:1px solid var(--glass-highlight);padding:.4rem .8rem;border-radius:var(--radius-sm);font-size:.95rem;font-weight:600;color:#fff;white-space:nowrap;box-shadow:0 4px 15px #00000080;z-index:10;display:flex;align-items:center;gap:.5rem}.word-tooltip.has-mnemonic{flex-direction:column;align-items:flex-start;white-space:normal;min-width:220px;max-width:320px;padding:.6rem .9rem;gap:.35rem}.tooltip-meaning{font-weight:700;color:#fff;font-size:.95rem}.tooltip-mnemonic{font-weight:500;font-size:.82rem;color:#fbbf24;line-height:1.4;border-top:1px solid rgba(255,255,255,.08);padding-top:.3rem;width:100%}.tooltip-explanation{font-weight:400;font-size:.78rem;color:#fff9;font-style:italic;line-height:1.4}.word-tooltip:before{content:"";position:absolute;bottom:100%;left:50%;transform:translate(-50%);border-width:6px;border-style:solid;border-color:transparent transparent var(--surface-2) transparent}.tooltip-audio-btn{width:22px;height:22px;border-radius:50%;background:#a855f740;border:1px solid rgba(168,85,247,.5);color:var(--accent-glow);display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;cursor:pointer;transition:background var(--transition-fast);padding:0}.tooltip-audio-btn:hover{background:#a855f780}.translation-area{width:100%;text-align:center}.btn-text-reveal{color:var(--text-muted);font-size:.875rem;padding-bottom:.25rem;border-bottom:1px solid transparent;transition:all var(--transition-fast)}.btn-text-reveal:hover{color:var(--text-main);border-bottom-color:var(--text-main)}.english-translation{font-size:1.25rem;font-weight:500;color:var(--accent-glow);padding:1rem 1.5rem;background:#ffffff0d;border-radius:var(--radius-md);border:1px solid rgba(255,255,255,.1);display:inline-block;max-width:100%;word-wrap:break-word;overflow-wrap:break-word;box-sizing:border-box}.ser-estar-panel{gap:1rem;padding:1.4rem 1.6rem;min-height:530px;justify-content:start;overflow:visible}.ser-estar-choice-player.is-compact .ser-estar-panel{min-height:390px;justify-content:center}.ser-estar-choice-player.is-compact .ser-estar-audio{margin-bottom:.25rem}.ser-estar-choice-player.is-compact .ser-estar-sentence{min-height:78px}.ser-estar-rule-badge{align-self:flex-start;padding:.4rem .85rem;border-radius:var(--radius-full);border:1px solid rgba(45,212,191,.35);background:#2dd4bf14;color:#7dd3fc;font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.ser-estar-rule{width:100%;text-align:left;min-height:96px;padding:.8rem 1rem;border:1px solid rgba(255,255,255,.08);border-radius:var(--radius-md);background:#ffffff09}.ser-estar-rule h3{margin-bottom:.35rem;font-size:1.1rem;font-weight:750}.ser-estar-rule p{color:var(--text-muted);line-height:1.5}.ser-estar-audio{width:60px;height:60px}.ser-estar-sentence{display:flex;flex-wrap:wrap;justify-content:center;align-items:baseline;gap:.5rem;width:100%;min-height:88px;font-size:1.85rem;font-weight:650;line-height:1.35;text-align:center}.ser-estar-blank{display:inline-flex;align-items:baseline;justify-content:center;min-width:5.25rem;padding:.15rem .6rem .25rem;border-bottom:3px solid rgba(216,180,254,.7);color:var(--text-muted)}.ser-estar-blank.filled{color:var(--accent-glow);border-bottom-color:var(--accent-glow)}.ser-estar-answer-word{color:var(--accent-glow)}.ser-estar-clickable-answer{display:flex;flex-wrap:wrap;justify-content:center;gap:.4rem}.ser-estar-options{display:grid;grid-template-columns:repeat(2,minmax(120px,1fr));gap:.75rem;width:min(100%,360px)}.ser-estar-option{display:flex;align-items:center;justify-content:center;gap:.5rem;min-height:56px;padding:.8rem 1rem;border-radius:var(--radius-md);border:1px solid var(--glass-border);background:#ffffff0e;color:var(--text-main);font-size:1.25rem;font-weight:800;transition:background var(--transition-fast),border-color var(--transition-fast),transform var(--transition-fast)}.ser-estar-option:hover:not(:disabled){transform:translateY(-2px);border-color:var(--glass-highlight);background:#ffffff17}.ser-estar-option.correct{border-color:#34d399bf;background:#34d39924}.ser-estar-option.incorrect{border-color:#f87171bf;background:#f8717124}.ser-estar-feedback{display:flex;flex-direction:column;gap:.35rem;width:100%;min-height:86px;padding:.8rem 1rem;border-radius:var(--radius-md);line-height:1.5}.ser-estar-feedback-slot{width:100%;min-height:86px;opacity:0;visibility:hidden}.ser-estar-feedback-slot.is-visible{opacity:1;visibility:visible}.ser-estar-feedback-slot:not(.is-visible) .ser-estar-feedback{border-color:transparent;background:transparent}.ser-estar-feedback.correct{border:1px solid rgba(52,211,153,.35);background:#34d39914}.ser-estar-feedback.incorrect{border:1px solid rgba(248,113,113,.35);background:#f8717114}.ser-estar-feedback span,.ser-estar-translation-reason{color:var(--text-muted)}.ser-estar-translation-reason{max-width:560px;margin:.25rem auto 0;line-height:1.5}.lesson-nav-bar{display:flex;align-items:center;justify-content:center;gap:.75rem;margin-top:1.5rem;padding:0 .5rem}.btn-nav-next,.btn-nav-secondary,.btn-nav-mark{flex-shrink:0}.grammar-intro-panel{border:1px solid rgba(56,189,248,.25)!important;background:linear-gradient(135deg,#38bdf80d,#a855f70f)!important;align-items:flex-start!important;gap:1.25rem!important;max-height:65vh;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--glass-highlight) transparent}.grammar-intro-badge{display:inline-flex;align-items:center;gap:.5rem;padding:.45rem 1.2rem;border-radius:var(--radius-full, 50px);background:linear-gradient(135deg,#38bdf833,#a855f733);border:1px solid rgba(56,189,248,.35);font-size:.85rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#7dd3fc}.grammar-intro-icon{font-size:1.15rem}.grammar-intro-title{font-size:1.5rem;font-weight:700;color:var(--text-main);margin:0}.grammar-intro-body{font-size:1rem;line-height:1.7;color:var(--text-main);width:100%}.grammar-intro-body p{margin:.2em 0}.grammar-intro-body br{display:block;content:"";margin:.35em 0}.grammar-intro-body .grammar-bullet{padding-left:.5rem;color:#e0e7ff;font-family:JetBrains Mono,Fira Code,Consolas,monospace;font-size:.95rem;line-height:1.6;margin:.15em 0}.story-intro-panel{border-color:#fbbf2440!important;background:linear-gradient(135deg,#fbbf240f,#a855f70a)!important}.story-intro-badge{background:linear-gradient(135deg,#fbbf2433,#eab30833)!important;border-color:#fbbf2459!important;color:#fbbf24!important}.review-intro-panel{border-color:#2dd4bf40!important;background:linear-gradient(135deg,#2dd4bf0f,#a855f70a)!important}.review-intro-badge{background:linear-gradient(135deg,#2dd4bf33,#14b8a633)!important;border-color:#2dd4bf59!important;color:#2dd4bf!important}.challenge-panel{border:1px solid rgba(234,179,8,.25)!important;background:linear-gradient(135deg,#eab3080a,#a855f70f)!important}.challenge-badge{display:inline-flex;align-items:center;gap:.5rem;padding:.45rem 1.2rem;border-radius:var(--radius-full, 50px);background:linear-gradient(135deg,#eab30833,#a855f733);border:1px solid rgba(234,179,8,.35);font-size:.85rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#fbbf24}.challenge-badge.pure-testing{background:linear-gradient(135deg,#22c55e2e,#0ea5e933);border-color:#22c55e66;color:#86efac}.challenge-icon{font-size:1.15rem}.challenge-prompt{text-align:center;display:flex;flex-direction:column;gap:.75rem}.challenge-instruction{font-size:1rem;color:var(--text-muted);margin:0}.challenge-english{font-size:1.85rem;font-weight:600;color:var(--text-main);line-height:1.4;margin:0;padding:.5rem 1rem}.challenge-answer-area{display:flex;flex-direction:column;align-items:center;min-height:100px;justify-content:center;width:100%}.btn-reveal-answer{padding:1rem 2.5rem;font-size:1.1rem;font-weight:600;letter-spacing:.03em;border-radius:var(--radius-md, 12px)}.challenge-answer{display:flex;flex-direction:column;align-items:center;gap:1rem;width:100%}.challenge-spanish{font-size:2rem;font-weight:600;color:var(--accent-glow);margin:0;padding:1rem 1.5rem;background:#a855f71a;border:1px solid rgba(168,85,247,.25);border-radius:var(--radius-md, 12px);text-align:center;width:100%;max-width:500px}.btn-play-answer{display:inline-flex;align-items:center;gap:.5rem;padding:.6rem 1.4rem;border-radius:var(--radius-full, 50px);background:linear-gradient(135deg,var(--accent-base, #a855f7) 0%,#7c3aed 100%);color:#fff;font-size:.95rem;font-weight:600;border:none;cursor:pointer;box-shadow:0 4px 15px #a855f759;transition:transform var(--transition-fast),box-shadow var(--transition-fast)}.btn-play-answer:hover{transform:scale(1.05);box-shadow:0 6px 22px #a855f780}.btn-play-answer:active{transform:scale(.97)}.btn-mark-later{background:#ffffff0d;border:1px solid var(--glass-border);color:var(--text-muted);padding:.75rem 1.25rem;border-radius:var(--radius-md);font-size:.95rem;font-weight:500;transition:all var(--transition-fast);cursor:pointer}.btn-mark-later:hover{background:#a855f71a;color:var(--accent-glow);border-color:#a855f766}.review-badge{display:inline-flex;align-items:center;gap:.4rem;padding:.35rem .9rem;border-radius:var(--radius-full);background:#a855f726;border:1px solid rgba(168,85,247,.3);color:var(--accent-glow);font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;margin-bottom:-1rem}.kbd-hint{display:inline-flex;align-items:center;justify-content:center;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-bottom-width:3px;border-radius:4px;padding:1px 5px;font-family:inherit;font-size:.7rem;font-weight:700;color:var(--text-muted);margin-left:.5rem;text-transform:uppercase;min-width:1.5rem;box-shadow:0 2px #0003;transition:all var(--transition-fast)}.btn-primary:hover .kbd-hint,.btn-secondary:hover .kbd-hint,.btn-mark-later:hover .kbd-hint,.btn-play-answer:hover .kbd-hint{color:var(--text-main);border-color:#fff6;background:#fff3}.btn-play .kbd-hint{position:absolute;bottom:-.5rem;left:50%;transform:translate(-50%);margin-left:0;background:var(--surface-2);border-color:var(--glass-border);color:var(--accent-glow);font-size:.65rem;padding:2px 6px;border-bottom-width:2px}@media(max-width:600px){.kbd-hint{display:none!important}.lesson-player{display:flex;flex-direction:column;min-height:calc(100dvh - 120px);padding-bottom:130px}.lesson-header{margin-bottom:.75rem;gap:.5rem;flex-shrink:0;flex-wrap:wrap}.lesson-progress{flex:1 0 100%;order:3;grid-template-columns:minmax(0,1fr) auto;gap:.55rem;padding:.4rem .55rem}.lesson-progress-copy{min-width:0}.lesson-progress-track{grid-column:1 / -1;grid-row:2}.lesson-progress-percent{grid-column:2;grid-row:1}.lesson-progress-step{font-size:.68rem}.lesson-progress-count,.lesson-progress-percent{font-size:.78rem}.lesson-progress-marker{width:16px;height:16px}.lesson-content{padding:2.5rem 1rem 1.5rem;gap:1.5rem;flex:1;justify-content:flex-start}.btn-play{width:68px;height:68px}.btn-play svg{width:30px;height:30px}.spanish-sentence{font-size:1.4rem;gap:.3rem}.spanish-area{min-height:60px}.challenge-english{font-size:1.3rem;padding:.35rem .5rem}.challenge-spanish{font-size:1.4rem;padding:.75rem 1rem}.challenge-answer-area{min-height:70px}.lesson-nav-bar{position:fixed;bottom:0;left:0;right:0;margin:0;padding:.6rem .75rem;padding-bottom:calc(.6rem + env(safe-area-inset-bottom,0px));background:#09090bf2;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-top:1px solid var(--glass-border);z-index:100;display:flex;flex-wrap:wrap;gap:.4rem;justify-content:center}.btn-nav-next{order:-1;width:100%;padding:.8rem 1.25rem;font-size:1rem}.btn-nav-secondary,.btn-nav-mark{flex:1 1 0;text-align:center;padding:.5rem;font-size:.82rem}.lesson-finished{max-height:calc(100dvh - 5.75rem);min-height:0;margin-top:0;padding:1rem .8rem;gap:.6rem;overflow:hidden}.finished-icon{font-size:2.2rem;line-height:1}.finished-title{font-size:1.35rem;line-height:1.15}.finished-subtitle{font-size:.9rem;line-height:1.35;margin:0}.finished-actions{width:100%;gap:.5rem;margin-top:.2rem;flex-shrink:0}.finished-actions .btn-secondary,.finished-actions .btn-primary{flex:1 1 0;min-width:0;padding:.7rem .65rem;font-size:.9rem}.english-translation{font-size:1.05rem;padding:.75rem 1rem;display:block;max-width:100%}.grammar-intro-panel{max-height:60vh;gap:1rem!important}.grammar-intro-title{font-size:1.2rem}.grammar-intro-body{font-size:.92rem;line-height:1.6}.grammar-intro-body .grammar-bullet{font-size:.88rem}.word-tooltip{position:absolute;top:100%;left:50%;transform:translate(-50%);margin-top:.35rem;width:fit-content;max-width:calc(100vw - 2rem);white-space:normal;z-index:200;word-wrap:break-word;overflow-wrap:break-word}.word-tooltip.has-mnemonic{min-width:180px;max-width:calc(100vw - 2rem);width:fit-content}.vocab-section{display:flex;flex-direction:column;min-height:0;overflow:hidden}.vocab-heading{margin-bottom:.45rem;font-size:.8rem;line-height:1.2;letter-spacing:.06em;flex-shrink:0}.vocab-table-wrapper{max-height:min(32dvh,210px);overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch}.vocab-table,.vocab-table thead,.vocab-table tbody,.vocab-table tr,.vocab-table td{display:block}.vocab-table thead{display:none}.vocab-table tbody{display:grid;gap:.4rem;padding:.45rem}.vocab-table tbody tr{display:grid;grid-template-columns:minmax(5rem,.8fr) minmax(0,1.2fr);gap:.2rem .65rem;padding:.55rem .6rem;border:1px solid rgba(255,255,255,.06);border-radius:var(--radius-sm);background:#ffffff08}.vocab-table tbody tr:nth-child(2n){background:#ffffff0b}.vocab-table thead th,.vocab-table td{padding:0;font-size:.84rem;line-height:1.3}.vocab-word{font-size:.92rem;overflow-wrap:anywhere}.vocab-meaning{overflow-wrap:anywhere}.vocab-mnemonic{grid-column:1 / -1;font-size:.78rem;min-width:0;max-width:none;overflow-wrap:anywhere}.mnemonic-text,.explanation-text{font-size:.76rem;line-height:1.3}.self-assessment{padding:.85rem;max-width:100%}.assessment-title{font-size:1.05rem}.assessment-subtitle{margin-bottom:.75rem;line-height:1.35}.assessment-options{flex-direction:column;gap:.45rem}.assessment-btn{flex-direction:row;justify-content:center;padding:.6rem .8rem}.assessment-emoji{font-size:1.25rem}.resume-toast{font-size:.8rem;padding:.5rem 1rem}}.self-assessment{width:100%;max-width:500px;padding:1.5rem;border-radius:var(--radius-md);background:#ffffff08;border:1px solid var(--glass-border)}.assessment-title{font-size:1.3rem;font-weight:700;margin-bottom:.35rem;text-align:center}.assessment-subtitle{font-size:.85rem;color:var(--text-muted);margin-bottom:1.25rem;text-align:center}.assessment-options{display:flex;gap:.75rem;justify-content:center}.assessment-btn{display:flex;flex-direction:column;align-items:center;gap:.35rem;padding:1rem 1.25rem;border-radius:var(--radius-md);border:1px solid var(--glass-border);background:#ffffff08;cursor:pointer;transition:all var(--transition-fast);flex:1}.assessment-emoji{font-size:1.75rem}.assessment-label{font-size:.8rem;font-weight:600;color:var(--text-muted);text-align:center}.assessment-btn:hover{transform:translateY(-2px);border-color:var(--glass-highlight)}.assessment-confident:hover{background:#34d3991a;border-color:#34d39966}.assessment-confident:hover .assessment-label{color:var(--success)}.assessment-somewhat:hover{background:#fbbf241a;border-color:#fbbf2466}.assessment-somewhat:hover .assessment-label{color:#fbbf24}.assessment-needs-refresh:hover{background:#f871711a;border-color:#f8717166}.assessment-needs-refresh:hover .assessment-label{color:var(--failure)}.resume-toast{position:fixed;top:1rem;left:50%;transform:translate(-50%);background:#a855f7e6;color:#fff;padding:.6rem 1.5rem;border-radius:var(--radius-full);font-size:.85rem;font-weight:600;z-index:200;box-shadow:0 8px 24px #a855f766;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.lesson-player{overflow-x:hidden}.lesson-content{transform-origin:center center}.swipe-hint,.swipe-bookmark-indicator{display:none}@keyframes swipe-slide-in-right{0%{transform:translate(50%) rotate(3deg);opacity:0}to{transform:translate(0) rotate(0);opacity:1}}@keyframes swipe-slide-in-left{0%{transform:translate(-50%) rotate(-3deg);opacity:0}to{transform:translate(0) rotate(0);opacity:1}}@keyframes swipe-slide-in-below{0%{transform:translateY(40%) scale(.92);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}@media(max-width:600px){.swipe-hint{display:block;text-align:center;font-size:.7rem;font-weight:500;color:var(--text-muted);opacity:.3;padding:.5rem 0;letter-spacing:.04em;flex-shrink:0}.swipe-bookmark-indicator{display:block;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:#a855f7e0;color:#fff;padding:.6rem 1.25rem;border-radius:var(--radius-full);font-size:.85rem;font-weight:600;z-index:300;box-shadow:0 6px 24px #a855f766;pointer-events:none}.lesson-nav-bar.swipe-mode{display:none}.lesson-player:has(.lesson-nav-bar.swipe-mode){padding-bottom:1rem}.lesson-content{touch-action:pan-y}.ser-estar-choice-player{min-height:calc(100dvh - 112px);padding-bottom:1rem}.ser-estar-choice-player .lesson-header{margin-bottom:.6rem}.ser-estar-panel{min-height:auto;flex:1;padding:.85rem;gap:.65rem;justify-content:center}.ser-estar-choice-player.has-rule-hint .ser-estar-panel{justify-content:flex-start}.ser-estar-audio{display:none}.ser-estar-rule{min-height:auto;padding:.65rem .75rem}.ser-estar-rule h3{font-size:1rem}.ser-estar-rule p{font-size:.88rem}.ser-estar-sentence{min-height:92px;padding:.35rem 0;font-size:clamp(1.25rem,5.6vw,1.75rem);gap:.25rem .35rem;line-height:1.45}.ser-estar-sentence .spanish-word{padding:.05rem .12rem;border-radius:6px}.ser-estar-sentence .word-container{display:inline-flex}.ser-estar-blank{min-width:4.4rem;padding-inline:.35rem}.ser-estar-options{width:100%;grid-template-columns:repeat(2,minmax(0,1fr))}.ser-estar-option{min-height:52px;padding:.65rem .75rem;font-size:1.1rem}.ser-estar-feedback,.ser-estar-feedback-slot{min-height:112px}.ser-estar-feedback{padding:.75rem;font-size:.9rem}.swipe-hint.is-disabled{opacity:.55}}.settings-panel{width:100%;max-width:680px;margin:0 auto}.settings-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:2.5rem;gap:1rem}.settings-title{font-size:2rem;font-weight:800;background:linear-gradient(to right,#fafafa,#d8b4fe);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;text-align:center;flex:1}.btn-reset{padding:.5rem 1rem;font-size:.85rem;font-weight:600;border-radius:var(--radius-full);background:#f871711f;border:1px solid rgba(248,113,113,.3);color:#fca5a5;transition:all var(--transition-fast)}.btn-reset:hover{background:#f8717138;border-color:#f8717180;color:#fecaca}.settings-list{display:flex;flex-direction:column;gap:1.25rem}.setting-card{padding:1.5rem;display:flex;flex-direction:column;gap:1.25rem}.setting-info{display:flex;align-items:flex-start;gap:1rem}.setting-icon{font-size:1.75rem;flex-shrink:0;width:2.5rem;height:2.5rem;display:flex;align-items:center;justify-content:center}.setting-name{font-size:1.1rem;font-weight:700;color:var(--text-main);margin-bottom:.25rem}.setting-desc{font-size:.875rem;color:var(--text-muted);line-height:1.5}.setting-options{display:flex;flex-wrap:wrap;gap:.5rem}.setting-option-btn{padding:.55rem 1.15rem;border-radius:var(--radius-full);font-size:.9rem;font-weight:600;border:1px solid var(--glass-border);background:#ffffff0a;color:var(--text-muted);transition:all var(--transition-fast)}.setting-option-btn:hover{border-color:var(--glass-highlight);color:var(--text-main);background:#ffffff14}.setting-option-btn.active{background:linear-gradient(135deg,#a855f7e6,#8b5cf6e6);color:#fff;border-color:#d8b4fea6;box-shadow:0 4px 14px #a855f74d}@media(max-width:600px){.settings-title{font-size:1.5rem}.setting-card{padding:1.25rem 1rem}.setting-icon{font-size:1.4rem;width:2rem;height:2rem}.setting-name{font-size:1rem}.setting-option-btn{padding:.5rem .9rem;font-size:.82rem}}.reset-progress-card{border-color:#f8717126!important}.reset-progress-btn{color:#fca5a5!important;border-color:#f871714d!important;background:#f8717114!important}.reset-progress-btn:hover{background:#f871712e!important;border-color:#f8717180!important;color:#fecaca!important}.reset-confirm{display:flex;flex-direction:column;gap:.75rem}.reset-confirm-text{font-size:.9rem;color:#fca5a5;font-weight:500}.reset-confirm-actions{display:flex;gap:.5rem;flex-wrap:wrap}.reset-confirm-yes{background:#f8717133!important;border-color:#f8717180!important;color:#fecaca!important}.reset-confirm-yes:hover{background:#f8717159!important}.onboarding-container{display:flex;align-items:center;justify-content:center;flex:1;width:100%;min-height:100%;padding:.75rem}.onboarding-content{max-width:520px;width:min(100%,520px);padding:clamp(1rem,4vw,1.75rem);text-align:center;overflow:hidden}.onboarding-title{font-size:clamp(1.35rem,6vw,1.85rem);line-height:1.1;margin:0;color:var(--text-main)}.onboarding-intro{margin-bottom:1rem}.divider{display:flex;align-items:center;text-align:center;color:var(--text-muted);margin:.25rem 0}.divider:before,.divider:after{content:"";flex:1;border-bottom:1px solid rgba(255,255,255,.2)}.divider span{padding:0 10px;font-size:.72rem;font-weight:700;letter-spacing:.08em}.choose-module-btn{background:#ffffff09;justify-content:center;color:var(--text-main);font-style:italic;opacity:.9}.choose-module-btn:hover{background:#ffffff14}.onboarding-selection{display:flex;flex-direction:column;gap:1rem}.btn-back{align-self:flex-start;background:none;border:none;color:var(--accent-glow);cursor:pointer;font-size:1rem;padding:0;display:flex;align-items:center}.btn-back:hover{text-decoration:underline}.level-options{display:flex;flex-direction:column;gap:.65rem}.level-btn{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);color:var(--text-main);min-height:48px;padding:.75rem 1rem;border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1rem;font-weight:700;text-align:center;transition:all .2s ease}.level-btn:hover{background:#ffffff1a;border-color:#d8b4fe59}.level-btn.active{background:linear-gradient(135deg,#a855f73d,#6366f129);border-color:#a855f7;box-shadow:0 10px 28px #a855f729}.module-list{display:flex;flex-direction:column;gap:.5rem;max-height:min(42vh,320px);overflow-y:auto;margin-top:1rem;padding-right:.5rem}.module-list-btn{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);color:var(--text-main);padding:.85rem 1rem;border-radius:8px;font-size:1rem;cursor:pointer;transition:all .2s ease;text-align:left}.module-list-btn:hover{background:#ffffff1a}.module-list-btn.active{background:#a855f733;border-color:#a855f7}.module-list::-webkit-scrollbar{width:6px}.module-list::-webkit-scrollbar-track{background:#ffffff0d;border-radius:4px}.module-list::-webkit-scrollbar-thumb{background:#a855f780;border-radius:4px}.module-list::-webkit-scrollbar-thumb:hover{background:#a855f7cc}.start-journey-btn{width:100%;min-height:48px;padding:.75rem 1rem;font-size:1rem}@media(max-width:520px){.onboarding-container{align-items:stretch;padding:.25rem 0}.onboarding-content{width:100%;padding:1.25rem 1rem}.onboarding-intro{margin-bottom:1rem}.level-options{gap:.65rem}.level-btn,.start-journey-btn{min-height:52px;padding:.8rem 1rem}.module-selection h2{font-size:1.2rem}}.auth-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:70vh;width:100%}.auth-form{display:flex;flex-direction:column;gap:var(--spacing-md);padding:var(--spacing-xl);width:100%;max-width:400px;text-align:center}.auth-form h2{font-size:2rem;margin-bottom:var(--spacing-sm);background:linear-gradient(to right,#d8b4fe,#a855f7);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.auth-form p{color:var(--text-muted);margin-bottom:var(--spacing-md)}.auth-input{background:#ffffff0d;border:1px solid var(--glass-border);color:var(--text-main);padding:.75rem 1rem;border-radius:var(--radius-md);font-family:inherit;font-size:1rem;transition:all var(--transition-fast);outline:none}.auth-input:focus{border-color:var(--accent-base);background:#ffffff1a}.auth-error{color:var(--failure);font-size:.875rem;margin-top:-.5rem;text-align:left}.auth-msg{color:var(--success);font-size:.875rem;margin-top:-.5rem;text-align:left}.auth-button-group{display:flex;flex-direction:column;gap:var(--spacing-sm);margin-top:var(--spacing-sm)}.btn-guest{background:transparent;border:none;color:var(--text-muted);font-size:.95rem;padding:.5rem 1rem;transition:color var(--transition-fast);text-decoration:underline;text-underline-offset:4px;cursor:pointer}.btn-guest:hover{color:var(--text-main)}.app-container{max-width:1200px;margin:0 auto;padding:var(--spacing-2xl) var(--spacing-md);display:flex;flex-direction:column;min-height:100vh}.app-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--spacing-2xl)}.app-logo{font-size:1.75rem;font-weight:800;background:linear-gradient(to right,#d8b4fe,#a855f7);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;letter-spacing:-.5px}.btn-settings{width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--glass-bg);border:1px solid var(--glass-border);color:var(--text-muted);transition:all var(--transition-fast)}.btn-settings:hover{background:#a855f71f;border-color:var(--accent-base);color:var(--accent-glow);transform:rotate(45deg)}.main-content{flex:1;display:flex;flex-direction:column;align-items:center}@media(max-width:600px){.app-container{padding:var(--spacing-md) var(--spacing-sm)}.app-header{margin-bottom:var(--spacing-md)}.app-logo{font-size:1.4rem}}.modal-overlay{position:fixed;inset:0;background:#000000a6;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:1rem}.modal-content{max-width:400px;width:100%;padding:var(--spacing-xl);text-align:center}.modal-actions{display:flex;gap:var(--spacing-md);margin-top:var(--spacing-lg);justify-content:center}
