:root{--app-viewport-height:100lvh;--app-visual-viewport-bottom:0px;--text:#6b6375;--text-h:#08060d;--bg:#fff;--border:#e5e4e7;--code-bg:#f4f3ec;--color-brand-300:#9bbcff;--color-brand-500:#4d88ff;--color-brand-700:#1e55c8;--color-brand-bg-soft:#4d88ff1a;--accent:var(--color-brand-500);--accent-bg:var(--color-brand-bg-soft);--accent-border:#4d88ff80;--social-bg:#f4f3ec80;--shadow:#0000001a 0 10px 15px -3px, #0000000d 0 4px 6px -2px;--sans:system-ui, "Segoe UI", Roboto, sans-serif;--heading:system-ui, "Segoe UI", Roboto, sans-serif;--mono:ui-monospace, Consolas, monospace;font:18px/145% var(--sans);letter-spacing:.18px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media (width<=1024px){:root{font-size:16px}}html,body{min-height:var(--app-viewport-height)}body{color:var(--text);-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;overscroll-behavior:none;-webkit-touch-callout:none;background:#fff;margin:0}#root{text-align:start;width:100%;max-width:100%;min-height:var(--app-viewport-height);box-sizing:border-box;background:#fff;border:none;flex-direction:column;margin:0;display:flex}h1,h2{font-family:var(--heading);color:var(--text-h);font-weight:500}h1{letter-spacing:-1.68px;margin:32px 0;font-size:56px}@media (width<=1024px){h1{margin:20px 0;font-size:36px}}h2{letter-spacing:-.24px;margin:0 0 8px;font-size:24px;line-height:118%}@media (width<=1024px){h2{font-size:20px}}p{margin:0}code,.counter{font-family:var(--mono);color:var(--text-h);border-radius:4px;display:inline-flex}code{background:var(--code-bg);padding:4px 8px;font-size:15px;line-height:135%}.app-loading{background:var(--bg);z-index:10;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.app-loading-spinner{border:2px solid #4d88ff26;border-top-color:var(--accent);border-radius:50%;width:28px;height:28px;animation:.8s linear infinite app-loading-spin}@keyframes app-loading-spin{to{transform:rotate(360deg)}}.app-shell{min-height:var(--app-viewport-height);flex-direction:column;width:100%;display:flex}.app-shell--home{background:#fff}@media (width<=480px){.app-shell--home{height:var(--app-viewport-height);overflow:hidden}.app-shell--home .app-main{min-height:0;overflow:hidden}.app-shell--discover{height:var(--app-viewport-height);overflow:hidden}.app-shell--discover .app-main{min-height:0;overflow:hidden}}.app-shell--home .app-top{box-shadow:none;background:#e2e8f0;border-bottom:none}.app-shell--learn-all .app-top{background:#fff}.app-shell--learn-all .app-top-title,.app-shell--wordbook .app-top-title{margin:0;position:absolute;left:50%;transform:translate(-50%)}.app-shell--wordbook .app-top{background:#fff}.app-shell--wordbook .app-top:has(.wordbook-practice-progress-row){gap:14px}.app-shell--wordbook .wordbook-practice-progress-row{flex:auto;max-width:360px}.app-top{padding:calc(17px + env(safe-area-inset-top,0px)) 20px 17px;z-index:10;background:0 0;align-items:center;display:flex;position:sticky;top:0}.app-shell--lesson .app-top{-webkit-backdrop-filter:blur(18px)saturate(140%);background:#ffffffeb;gap:14px;box-shadow:0 1px #08060d0f}.app-shell--lesson{--accent:#08060d;--accent-bg:#08060d14;--accent-border:#08060d38;height:var(--app-viewport-height);overflow:hidden}.app-shell--lesson .app-main{min-height:0;overflow:hidden}.app-shell--lesson .app-back{border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px}.app-brand{color:#08060d;letter-spacing:-.02em;white-space:nowrap;align-items:center;font-weight:600;text-decoration:none;display:inline-flex}.app-brand:hover{color:#08060d}.app-brand-logo{width:auto;height:18px;display:block}.app-back{color:#08060d;align-items:center;gap:4px;font-size:15px;font-weight:500;text-decoration:none;display:flex}.app-back:hover{opacity:.75}.app-top-title{color:#08060d;letter-spacing:-.02em;margin:0 0 0 10px;font-size:17px;font-weight:800;line-height:1}.app-top-right{align-items:center;gap:10px;margin-left:auto;display:flex}.app-level-btn{background:#fff;border:1px solid #08060d0f;border-radius:999px;align-items:center;gap:5px;height:28px;padding:0 10px 0 8px;line-height:1;text-decoration:none;transition:background .15s,border-color .15s;display:inline-flex}.app-level-icon{color:#08060d}.app-level-btn:hover{background:#fff;border-color:#08060d1a}.app-level-btn.active{background:#fff;border-color:#08060d0f}.app-level-btn.active .app-level-label,.app-level-btn.active .app-level-cefr{color:#08060d}.app-level-label{color:#08060d;white-space:nowrap;font-size:13px;font-weight:600}.app-level-cefr{color:#08060d9e;opacity:.7;white-space:nowrap;font-size:11px;font-weight:500}.app-streak{background:#fff;border:1px solid #08060d0f;border-radius:999px;align-items:center;gap:4px;height:28px;padding:0 10px 0 8px;line-height:1;display:inline-flex}.app-streak-icon{color:#f97316}.app-streak-num{color:#f97316;font-size:13px;font-weight:700}.app-main{flex-direction:column;flex:1;display:flex}.app-tabbar-wrap{left:0;right:0;bottom:calc(100dvh - var(--app-viewport-height) + var(--app-visual-viewport-bottom,0px));pointer-events:none;z-index:50;justify-content:center;align-items:flex-end;padding:0;display:flex;position:fixed}.app-tabbar{pointer-events:auto;width:100%;max-width:none;padding:9px max(20px, calc((100vw - 390px) / 2)) calc(9px + env(safe-area-inset-bottom,0px));box-shadow:none;z-index:100;isolation:isolate;background:#18181c80;border:none;border-top:1px solid #e2e8f0;border-radius:0;justify-content:space-around;align-items:center;gap:20px;display:flex}.app-shell--discover .app-tabbar{box-shadow:none;background:0 0;border-top:none}.app-shell--home .app-tabbar{box-shadow:none;background:#e2e8f0}.app-shell--practice .app-tabbar,.app-shell--profile .app-tabbar{box-shadow:none;background:#fff}.tab-link{color:#ffffffb8;white-space:nowrap;touch-action:manipulation;-webkit-user-select:none;user-select:none;border-radius:8px;flex-direction:row;flex:1;justify-content:center;align-items:center;gap:6px;min-width:0;padding:9px 8px;font-size:15px;line-height:1;text-decoration:none;transition:color .18s,background .18s,transform .18s,box-shadow .18s;display:flex;position:relative}.tab-link:active{opacity:.85;transform:scale(.94)}.tab-link:before{content:"";border-radius:inherit;border:1px solid #0000;transition:border-color .18s;position:absolute;inset:0}.tab-link:hover{color:#ffffffe6;transform:translateY(-1px)}.app-shell--home .tab-link:not(.active),.app-shell--practice .tab-link:not(.active),.app-shell--profile .tab-link:not(.active){color:#334155}.app-shell--home .tab-link:not(.active):hover,.app-shell--practice .tab-link:not(.active):hover,.app-shell--profile .tab-link:not(.active):hover{color:#0f172a}.app-shell--discover .tab-link:not(.active),.app-shell--discover .tab-link:not(.active):hover{color:#08060d}.tab-link.active{color:#08060d;box-shadow:none;background:#fff}.app-shell--discover .tab-link.active,.app-shell--home .tab-link.active,.app-shell--practice .tab-link.active,.app-shell--profile .tab-link.active{background:#fff;box-shadow:0 2px #cbd5e1}.app-shell--discover .tab-link.active:active,.app-shell--home .tab-link.active:active,.app-shell--practice .tab-link.active:active,.app-shell--profile .tab-link.active:active{transform:translateY(1px);box-shadow:0 1px #cbd5e1}.tab-link.active:before{border-color:#08060d0f}.app-shell--discover .tab-link.active:before,.app-shell--home .tab-link.active:before,.app-shell--practice .tab-link.active:before,.app-shell--profile .tab-link.active:before{border:2px solid #cbd5e1}.tab-link-icon{color:inherit;background:0 0;justify-content:center;align-items:center;transition:background .18s,color .18s,transform .18s,box-shadow .18s;display:inline-flex}.tab-link-icon.active{color:#08060d}.tab-link-label{letter-spacing:.01em;font-weight:700}.page{text-align:start;padding:20px 20px calc(100px + env(safe-area-inset-bottom,0px));box-sizing:border-box;flex:1;width:100%;max-width:720px;margin:0 auto}@media (width>=900px){.page{max-width:960px;padding-bottom:32px}}.page-title{letter-spacing:-.5px;color:var(--text-h);margin:0 0 8px;font-size:28px}.page-lead{color:var(--text);margin:0 0 24px;line-height:150%}.home-kicker{text-transform:uppercase;letter-spacing:.12em;color:var(--accent);margin:0 0 8px;font-size:13px}.home-title{margin-bottom:12px}.home-lead{max-width:36em}.story-grid{grid-template-columns:repeat(2,1fr);gap:12px;display:grid}.story-card{color:inherit;border:1px solid var(--border);border-radius:12px;flex-direction:column;text-decoration:none;transition:border-color .2s,box-shadow .2s;display:flex;overflow:hidden}.story-card:hover{border-color:var(--accent-border);box-shadow:var(--shadow)}.story-card-cover{aspect-ratio:1;background:var(--accent-bg);justify-content:center;align-items:center;width:100%;font-size:52px;display:flex}.story-card-body{box-sizing:border-box;flex-direction:column;justify-content:space-between;height:80px;padding:10px 12px;display:flex}.story-card-title{color:var(--text-h);-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:0;font-size:16px;font-weight:600;line-height:1.45;display:-webkit-box;overflow:hidden}.story-card-body .tag{align-self:flex-start;margin-bottom:0}.episode-section-title{margin:24px 0 12px;font-size:20px}.episode-body{font-size:17px;line-height:160%}.episode-summary-zh{margin-bottom:20px;font-size:16px;line-height:165%}.story-detail-page{padding-top:20px}.story-detail-cover{background:var(--accent-bg);border:2px solid var(--accent-border);border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;width:88px;height:88px;font-size:40px;display:flex}.story-detail-info{flex-direction:column;flex:1;gap:6px;min-width:0;display:flex}.story-detail-header{text-align:center;border:1px solid var(--border);background:color-mix(in srgb, var(--bg) 92%, var(--code-bg));border-radius:8px;flex-direction:row;align-items:flex-start;gap:20px;padding:16px;display:flex;box-shadow:0 2px 12px #0000000f}.story-detail-title{letter-spacing:-.3px;color:var(--text-h);margin:0;font-size:24px;font-weight:600}.story-detail-header .tag{align-self:flex-start;margin-bottom:0}.story-detail-blurb{color:var(--text);font-size:15px;line-height:1.6}.script-section h2{margin-bottom:16px}.script-reader{text-align:start;border:1px solid var(--border);background:color-mix(in srgb, var(--bg) 88%, var(--code-bg));border-radius:12px;padding:18px 20px 22px}.script-line+.script-line{margin-top:18px}.script-narration{color:var(--text);margin:0;font-size:16px;font-style:italic;line-height:168%}.script-dialogue{margin:0}.script-dialogue-head{align-items:baseline;gap:8px;margin-bottom:4px;display:flex}.script-speaker{color:var(--accent);font-size:16px;font-weight:600}.script-speaker-zh{color:var(--text);opacity:.85;font-size:13px}.script-stage{color:var(--text);opacity:.9;margin:0 0 6px;font-size:14px;font-style:italic;line-height:150%}.script-words{color:var(--text-h);margin:0;font-size:16px;line-height:165%}.card-grid{grid-template-columns:repeat(2,1fr);gap:14px;display:grid}@media (width>=640px){.card-grid.stories{grid-template-columns:repeat(2,1fr)}}.card{border:1px solid var(--border);background:color-mix(in srgb, var(--bg) 92%, var(--code-bg));text-align:start;border-radius:12px;padding:16px 18px;text-decoration:none;transition:border-color .2s,box-shadow .2s}.card:hover{border-color:var(--accent-border);box-shadow:var(--shadow)}.card-emoji{margin-bottom:8px;font-size:32px;line-height:1}.roleplay-card{flex-direction:column;gap:6px;text-decoration:none;display:flex}.roleplay-card-title{color:var(--text-h);margin:0;font-size:16px;font-weight:600}.roleplay-card-desc{color:var(--text);-webkit-line-clamp:3;-webkit-box-orient:vertical;font-size:13px;line-height:1.5;display:-webkit-box;overflow:hidden}.card h3{color:var(--text-h);margin:0 0 6px;font-size:18px;font-weight:600}.card p{color:var(--text);margin:0;font-size:15px;line-height:145%}.practice-banner-wrap{margin:0 0 20px}@media (width>=768px){.practice-banner-wrap{max-width:520px;margin-bottom:20px;margin-left:auto;margin-right:auto}}.practice-banner-img{vertical-align:middle;width:100%;height:auto;display:block}.practice-entry-list{flex-direction:column;gap:12px;margin:0;padding:0;list-style:none;display:flex}.practice-entry-item{margin:0}.practice-entry{box-sizing:border-box;background:color-mix(in srgb, var(--bg) 92%, var(--code-bg));text-align:start;width:100%;color:inherit;border:2px solid #cbd5e1;border-radius:8px;align-items:center;gap:14px;padding:16px 18px;text-decoration:none;transition:border-color .2s,box-shadow .2s;display:flex}a.practice-entry--link:hover{border-color:var(--accent-border);box-shadow:var(--shadow)}.practice-entry--placeholder{cursor:default}.practice-entry-icon{color:var(--accent);flex-shrink:0;justify-content:center;align-items:center;display:flex}.practice-entry-text{flex-direction:column;flex:1;gap:4px;min-width:0;display:flex}.practice-entry-title{color:var(--text-h);font-size:17px;font-weight:600;line-height:1.3}.practice-entry-desc{color:var(--text);font-size:14px;line-height:1.45}.profile-hero{text-align:center;flex-direction:column;align-items:center;gap:10px;margin:8px 0 24px;display:flex}.profile-hero-lottie{width:min(220px,62vw);height:auto;max-height:min(220px,62vw)}.profile-greeting{color:var(--text-h);letter-spacing:-.4px;margin:0;font-size:28px;font-weight:700}.profile-account-card{text-align:center}.profile-account-card .btn-row{justify-content:center}.wordbook-page{padding-left:20px;padding-right:20px;padding-bottom:calc(102px + env(safe-area-inset-bottom,0px));flex-direction:column;gap:12px;display:flex}.wordbook-page-lead{text-align:center;margin-top:0;margin-bottom:4px}@media (width<=420px){.wordbook-page{padding-left:16px;padding-right:16px}}.wordbook-list{flex-direction:column;gap:14px;display:flex}.wordbook-card{cursor:pointer;border-width:2px;flex-direction:column;gap:10px;display:flex}.wordbook-card:hover,.wordbook-card--expanded,.wordbook-card--expanded:hover{box-shadow:none}.wordbook-card-head{align-items:center;gap:12px;display:flex}.wordbook-card-toggle{min-width:0;color:inherit;font:inherit;text-align:left;cursor:pointer;background:0 0;border:0;flex:1;padding:0}.wordbook-card-title{min-width:0}.wordbook-card-title h2{letter-spacing:0;color:var(--text-h);margin:0;font-size:18px;line-height:1.15}.wordbook-card-title p,.wordbook-example,.wordbook-translation,.wordbook-source{margin:0}.wordbook-card-title p{color:var(--text);margin-top:4px;font-size:14px;font-weight:700}.wordbook-card-details{flex-direction:column;gap:8px;padding-top:2px;display:flex}.wordbook-example{color:var(--text-h);font-size:15px;line-height:1.55}.wordbook-translation,.wordbook-source{color:var(--muted);font-size:13px;line-height:1.55}.grammarbook-card{box-shadow:none;background:#fff;border-width:2px;flex-direction:column;gap:0;display:flex}.grammarbook-card--expanded{box-shadow:none;border-width:2px;gap:9px}.grammarbook-card:hover,.grammarbook-card--expanded:hover{box-shadow:none}.grammarbook-card-toggle{width:100%;color:inherit;font:inherit;text-align:left;cursor:pointer;background:0 0;border:0;padding:0}.grammarbook-card-label{color:var(--text-h);align-items:center;gap:6px;font-size:16px;font-weight:800;line-height:1.15;display:flex}.grammarbook-card-details{flex-direction:column;gap:9px;display:flex}.grammarbook-card-content{color:color-mix(in srgb, var(--text-h) 88%, var(--color-brand-700));margin:0;font-size:14px;line-height:1.7}.grammarbook-card .grammarbook-card-source{color:#4d88ff;border-top:1px solid #4d88ff24;margin:0;padding-top:8px;font-size:13px;font-style:italic;line-height:1.55}.wordbook-practice-stage{width:100%;max-width:560px;margin:0 auto;padding:4px 0 12px}.wordbook-practice-header{text-align:center;flex-direction:column;align-items:center;gap:6px;margin-bottom:40px;display:flex}.wordbook-practice-header h2,.wordbook-practice-header p{margin:0}.wordbook-practice-header h2{letter-spacing:0;color:var(--text-h);font-size:24px;font-weight:800;line-height:1.15}.wordbook-practice-header p:not(.wordbook-practice-step){color:var(--text);font-size:15px;line-height:1.5}.wordbook-practice-header span,.wordbook-practice-step{color:#4d88ff;font-size:13px;font-weight:800;line-height:1.2}.wordbook-match-board{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;display:grid}.wordbook-match-column{flex-direction:column;gap:10px;display:flex}.wordbook-match-btn,.wordbook-fill-option{border:2px solid var(--border);min-height:60px;color:var(--text-h);font:inherit;text-align:center;cursor:pointer;background:#fff;border-radius:8px;padding:12px 14px;font-size:15px;font-weight:800;line-height:1.25;transition:border-color .15s,background .15s,color .15s,opacity .15s,transform .1s}.wordbook-match-btn{min-height:72px}.wordbook-fill-option{flex-direction:column;justify-content:center;align-items:center;gap:4px;display:flex}.wordbook-fill-option-word,.wordbook-fill-option-definition{display:block}.wordbook-fill-option-definition{color:currentColor;opacity:.78;font-size:12px;font-weight:700;line-height:1.3}.wordbook-match-btn:not(:disabled):active,.wordbook-fill-option:not(:disabled):active{transform:translateY(2px)}.wordbook-match-btn--selected,.wordbook-fill-option--selected{color:#1e55c8;background:#eff6ff;border-color:#4d88ff}.wordbook-match-btn--matched,.wordbook-fill-option--correct{color:#15803d;background:#dcfce7;border-color:#22c55e}.wordbook-match-btn--matched{opacity:.58;cursor:default}.wordbook-match-btn--wrong,.wordbook-fill-option--wrong{color:#b91c1c;background:#fef2f2;border-color:#ef4444}.wordbook-match-btn--wrong{animation:.42s wordbook-wrong-flash}@keyframes wordbook-wrong-flash{0%,to{border-color:var(--border);color:var(--text-h);background:#fff}35%,70%{color:#b91c1c;background:#fef2f2;border-color:#ef4444}}.wordbook-fill-card{background:0 0;border:0;padding:0}.wordbook-fill-sentence{letter-spacing:0;color:var(--text-h);text-align:center;margin:0;font-size:22px;font-weight:800;line-height:1.45}.wordbook-fill-translation{color:var(--muted);text-align:center;margin:12px 0 0;font-size:14px;line-height:1.55}.wordbook-fill-options{grid-template-columns:1fr;gap:12px;margin-top:32px;display:grid}.wordbook-practice-complete{min-height:calc(var(--app-viewport-height) - 220px);justify-content:center;align-items:center;display:flex}.wordbook-practice-complete-lottie{width:min(220px,58vw);height:min(220px,58vw);margin-bottom:18px}.lesson-nav.wordbook-practice-nav{max-width:none;padding:22px 24px calc(22px + env(safe-area-inset-bottom,0px));box-shadow:none;background:#4d88ff;border-radius:16px 16px 0 0;animation:.24s cubic-bezier(.2,.8,.2,1) both vocabulary-result-panel-in}.lesson-nav.wordbook-practice-nav--success{background:#22c55e}.lesson-nav.wordbook-practice-nav--retry{background:#4d88ff}.wordbook-practice-nav .lesson-continue-control{width:min(360px,100vw - 48px)}.wordbook-practice-nav .wordbook-practice-start-btn{border-radius:8px;width:100%;min-width:0;height:48px;min-height:48px}.wordbook-practice-nav .lesson-icon-btn.wordbook-practice-start-btn,.wordbook-practice-nav .lesson-icon-btn--accent.wordbook-practice-start-btn,.wordbook-practice-nav .lesson-icon-btn--accent.wordbook-practice-start-btn:not(:disabled):hover{--lesson-btn-shadow:#1e55c8;color:var(--text-h);box-shadow:0 4px 0 var(--lesson-btn-shadow);background:#fff;border:0}.wordbook-practice-nav .lesson-icon-btn.wordbook-practice-start-btn:not(:disabled):active{box-shadow:0 1px 0 var(--lesson-btn-shadow);transform:translateY(3px)}.wordbook-practice-nav--success .lesson-icon-btn.wordbook-practice-start-btn{--lesson-btn-shadow:#15803d}@media (width<=420px){.wordbook-match-board,.wordbook-fill-options{gap:10px}.wordbook-match-btn,.wordbook-fill-option{padding-left:10px;padding-right:10px;font-size:14px}}.tag{background:var(--accent-bg);color:var(--accent);font-size:12px;font-family:var(--sans);border-radius:999px;margin-bottom:8px;padding:2px 8px;display:inline-block}.tag-featured{background:color-mix(in srgb, var(--accent) 22%, var(--accent-bg));border:1px solid var(--accent-border)}.btn{font-size:15px;font-family:var(--sans);cursor:pointer;touch-action:manipulation;-webkit-user-select:none;user-select:none;border:2px solid #0000;border-radius:10px;justify-content:center;align-items:center;gap:8px;padding:10px 18px;text-decoration:none;transition:border-color .2s,background .2s,transform .1s,opacity .1s;display:inline-flex}.btn:active{opacity:.85;transform:scale(.97)}.btn-primary{background:var(--accent-bg);color:var(--accent);border-color:var(--accent-border)}.btn-primary:hover{border-color:var(--accent)}.btn-ghost{color:var(--text-h);border-color:var(--border);background:0 0}.btn-ghost:hover{border-color:var(--accent-border)}.btn-row{flex-wrap:wrap;gap:10px;margin-top:16px;display:flex}.chips{flex-wrap:wrap;gap:8px;margin-bottom:20px;display:flex}.chip{border:1px solid var(--border);background:var(--bg);color:var(--text);cursor:pointer;font-size:14px;font-family:var(--sans);border-radius:999px;padding:6px 12px}.chip[aria-pressed=true]{border-color:var(--accent);background:var(--accent-bg);color:var(--accent)}.episode-list{flex-direction:column;gap:10px;margin:0;padding:0;list-style:none;display:flex}.episode-list a{color:inherit;text-decoration:none;display:block}.episode-item{border:1px solid var(--border);border-radius:10px;padding:14px 16px;transition:border-color .2s}.episode-item:hover{border-color:var(--accent-border)}@keyframes pulse-ring{0%{box-shadow:0 0 0 0px color-mix(in srgb, var(--story-accent,var(--accent)) 40%, transparent)}70%{box-shadow:0 0 0 10px color-mix(in srgb, var(--story-accent,var(--accent)) 0%, transparent)}to{box-shadow:0 0 0 0px color-mix(in srgb, var(--story-accent,var(--accent)) 0%, transparent)}}.episode-action-panel{background:var(--bg);z-index:20;border:none;border-radius:20px;justify-content:center;align-items:center;gap:14px;width:max-content;min-width:min(320px,100vw - 56px);max-width:calc(100vw - 56px);padding:10px 10px 14px;animation:.15s popup-down;display:flex;position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%);box-shadow:0 10px 24px #00000014}.episode-action-panel:after{content:"";background:var(--bg);width:12px;height:12px;position:absolute;bottom:-6px;left:50%;transform:translate(-50%)rotate(45deg)}.episode-drawer-btn{--lesson-btn-shadow:#d1d5db;min-width:148px;height:52px;color:var(--text-h);font-size:16px;font-family:var(--sans);cursor:pointer;box-shadow:0 4px 0 var(--lesson-btn-shadow);white-space:nowrap;touch-action:manipulation;-webkit-user-select:none;user-select:none;background:#fff;border:2px solid #d1d5db;border-radius:16px;flex:1;padding:0 18px;font-weight:700;line-height:1;transition:background .15s,border-color .15s,box-shadow .15s,opacity .15s,color .15s,transform .1s}.episode-drawer-btn:hover:not(:disabled){color:var(--text-h);background:#f9fafb;border-color:#b8bec8}.episode-drawer-btn:not(:disabled):active{box-shadow:0 1px 0 var(--lesson-btn-shadow);transform:translateY(3px)}.episode-drawer-btn:disabled{opacity:.42;cursor:not-allowed;box-shadow:0 4px 0 var(--lesson-btn-shadow)}.episode-drawer-btn--stack{flex-direction:column;justify-content:center;align-items:center;gap:2px;line-height:1;display:flex}.episode-drawer-btn-title{justify-content:center;align-items:center;gap:4px;display:inline-flex}.episode-drawer-btn-desc{color:var(--text);font-size:10px;font-weight:500}.episode-drawer-btn-primary{--lesson-btn-shadow:#4d88ff73;color:var(--text-h);background:#fff;border-color:#4d88ff94}.episode-drawer-btn-primary:hover{color:var(--text-h);background:#4d88ff14;border-color:#4d88ffb8}@keyframes drawer-down{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}@keyframes popup-down{0%{opacity:0;transform:translate(-50%)translateY(6px)}to{opacity:1;transform:translate(-50%)translateY(0)}}.episode-meta{color:var(--text);margin-top:4px;font-size:13px}.section-block{border-top:1px solid var(--border);margin-top:28px;padding-top:20px}.home-page .section-block{border-top:none;margin-top:20px;padding-top:8px}.home-page{padding-left:0;padding-right:0;padding-bottom:calc(96px + env(safe-area-inset-bottom,0px));overscroll-behavior-y:none;flex-direction:column;gap:0;display:flex;overflow-x:clip}@media (width<=480px){.home-page{top:calc(env(safe-area-inset-top,0px) + 62px);overscroll-behavior-y:none;-webkit-overflow-scrolling:touch;width:100%;max-width:none;min-height:0;padding-top:0;position:fixed;bottom:0;left:0;right:0;overflow:hidden auto}}@media (width<=420px){.home-page--collapsed{padding-left:16px;padding-right:16px}}.all-stories-page{flex-direction:column;gap:12px;padding-left:20px;padding-right:20px;display:flex}.all-stories-list{flex-direction:column;gap:12px;display:flex}.all-story-card{width:100%;color:inherit;font:inherit;text-align:left;cursor:pointer;background:#f4f4f4;border:0;border-radius:8px;align-items:flex-start;gap:12px;padding:16px 20px;transition:transform .15s,background .15s;display:flex;position:relative}.all-story-card--current{border:2px solid var(--accent);padding:14px 18px}.all-story-card:hover{background:#eee;transform:translateY(-1px)}.all-story-card:active{transform:translateY(0)}.all-story-current-badge{background:var(--accent);color:#fff;border-radius:8px 0;padding:4px 9px 5px;font-size:11px;font-weight:800;line-height:1;position:absolute;top:-2px;left:-2px}.all-story-cover{aspect-ratio:3/4;background-color:#e9e9e9;background-position:50%;background-size:cover;border-radius:2px;flex-shrink:0;width:48px}.all-story-copy{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.all-story-copy h2{letter-spacing:-.2px;color:var(--text-h);margin:0;font-size:16px;font-weight:700;line-height:1.25}.all-story-copy p{max-width:80%;color:var(--text-2);margin:0;font-size:11.5px;line-height:1.25}.all-story-progress{color:#0000008c;flex-shrink:0;font-size:12px;font-weight:600}.all-story-dialog-actions.lp-node-popup-actions--two .lp-node-popup-cta:first-child,.all-story-dialog-actions.lp-node-popup-actions--two .lp-node-popup-cta:last-child{flex:1}@media (width<=420px){.all-stories-page{padding-left:16px;padding-right:16px}}.path-story-block{background:#f4f4f4;border:none;border-radius:18px;flex-direction:column;padding:14px 20px;scroll-margin-top:160px;transition:padding .25s,background .25s;display:flex}.path-quiz-block{scroll-margin-top:160px}.path-story-header{opacity:0;pointer-events:none;justify-content:space-between;align-items:flex-start;gap:12px;max-height:0;transition:max-height .3s,opacity .2s,transform .25s;display:flex;overflow:hidden;transform:translateY(-6px)}.path-story-header-cover{aspect-ratio:3/4;background-color:#e9e9e9;background-position:50%;background-size:cover;border-radius:2px;flex-shrink:0;align-self:flex-start;width:48px}.path-story-header-text{flex-direction:column;flex:1;align-self:flex-start;gap:2px;min-width:0;display:flex}.path-story-title{color:var(--text-h);letter-spacing:-.2px;margin:0;font-size:16px;font-weight:700;line-height:1.25}.path-story-title-en{color:var(--text-2);max-width:80%;margin:0;font-size:11.5px;line-height:1.25}.path-story-chip{color:#0000008c;flex-shrink:0;font-size:12px;font-weight:600}.path-story-body{opacity:1;flex-direction:column;gap:12px;max-height:1200px;transition:max-height .35s,opacity .22s,transform .28s;display:flex;overflow:visible;transform:translateY(0)}.path-story-block--collapsed{cursor:pointer;padding:16px 20px;transition:transform .15s,padding .25s,background .25s}.path-story-block--collapsed:hover{transform:translateY(-1px)}.path-story-block--collapsed:active{transform:translateY(0)}.path-story-block--collapsed .path-story-body{opacity:0;pointer-events:none;max-height:0;transform:translateY(8px)}.path-story-block--collapsed .path-story-header{opacity:1;pointer-events:auto;max-height:96px;transform:translateY(0)}.home-page--collapsed{padding-left:20px;padding-right:20px;padding-bottom:calc(24px + env(safe-area-inset-bottom,0px));flex:none;gap:12px}.home-page--collapsed .home-fab{align-self:center;margin-top:18px;position:static;transform:none}.home-page--collapsed .home-fab:hover{transform:translateY(-1px)}.home-page--collapsed .home-fab:active{transform:translateY(0)}.home-page--story-mode{gap:0;padding-left:20px;padding-right:20px}.home-page--story-mode .path-story-block{animation:.28s both story-panel-in}@media (width<=420px){.home-page--story-mode{padding-left:16px;padding-right:16px}}@keyframes story-panel-in{0%{opacity:.96;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.home-page--collapsed .path-story-block+.path-story-block,.home-page--collapsed .path-story-block+.path-quiz-block,.home-page--collapsed .path-quiz-block+.path-story-block,.home-page--collapsed .path-quiz-block+.path-quiz-block{margin-top:0}.home-page--collapsed .path-story-block,.home-page--collapsed .path-quiz-block{position:relative}.home-page--collapsed .path-story-block:first-child{z-index:1}.home-page--collapsed .path-story-block:nth-child(2),.home-page--collapsed .path-quiz-block:nth-child(2){z-index:2}.home-page--collapsed .path-story-block:nth-child(3),.home-page--collapsed .path-quiz-block:nth-child(3){z-index:3}.home-page--collapsed .path-story-block:nth-child(4),.home-page--collapsed .path-quiz-block:nth-child(4){z-index:4}.home-page--collapsed .path-story-block:nth-child(5),.home-page--collapsed .path-quiz-block:nth-child(5){z-index:5}.home-page--collapsed .path-story-block:nth-child(6),.home-page--collapsed .path-quiz-block:nth-child(6){z-index:6}.home-page--collapsed .path-story-block:nth-child(7),.home-page--collapsed .path-quiz-block:nth-child(7){z-index:7}.home-page--collapsed .path-story-block:nth-child(n+8),.home-page--collapsed .path-quiz-block:nth-child(n+8){z-index:8}.home-page--collapsed .path-quiz-block{cursor:pointer;justify-content:stretch;padding:0;transition:transform .15s}.home-page--collapsed .path-quiz-block:hover{transform:translateY(-1px)}.home-page--collapsed .path-quiz-block:active{transform:translateY(0)}.home-page--collapsed .path-quiz-block .quiz-card{background:#f4f4f4;border-radius:18px;justify-content:flex-start;width:100%;padding:16px 20px}.story-hero{flex-direction:column;align-items:center;gap:14px;padding:4px 0 6px;display:flex}.story-hero-cover{aspect-ratio:3/4;background-color:color-mix(in srgb, var(--text-h) 10%, transparent);background-position:50%;background-size:cover;border-radius:2px;width:34%;max-width:140px;overflow:hidden}.story-hero-meta{text-align:center;flex-direction:column;align-items:center;gap:6px;width:100%;display:flex}.story-hero-tag{color:#0000008c;letter-spacing:.02em;align-items:center;font-size:11px;font-weight:600;display:inline-flex}.story-hero-title{color:var(--text-h);letter-spacing:-.2px;margin:0;font-size:18px;font-weight:700;line-height:1.2}.story-hero-title-en{color:var(--text-2);margin:0;font-size:12.5px;line-height:1.25}.story-hero-blurb{color:var(--text-h);opacity:.78;max-width:32em;margin:4px 0 0;font-size:13px;line-height:1.5}.episode-list{flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.episode-list>li+li{border-top:1px solid color-mix(in srgb, var(--text-h) 10%, transparent)}.episode-row-wrapper{position:relative}.episode-row-wrapper--open{z-index:10}.episode-row{cursor:pointer;width:100%;min-height:52px;font-family:var(--sans);color:var(--text-h);text-align:left;background:0 0;border:none;border-radius:0;align-items:center;gap:10px;padding:12px 4px 8px;transition:opacity .15s;display:flex}.episode-row:hover:not(:disabled),.episode-row--selected{opacity:.7}.episode-row--dimmed{opacity:.45;cursor:not-allowed}.episode-row-num{color:var(--text-2);text-align:center;font-variant-numeric:tabular-nums;flex-shrink:0;min-width:20px;font-size:13px;font-weight:600;transform:translateY(2px)}.episode-row-text{flex-direction:column;flex:1;justify-content:center;gap:1px;min-width:0;display:flex;transform:translateY(2px)}.episode-row-name{color:var(--text-h);text-overflow:ellipsis;white-space:nowrap;font-size:14px;font-weight:600;line-height:1.3;overflow:hidden}.episode-row-name-en{color:var(--text-2);text-overflow:ellipsis;white-space:nowrap;font-size:11.5px;line-height:1.3;overflow:hidden}.episode-row-status{width:18px;height:18px;color:var(--text-2);opacity:.5;flex-shrink:0;justify-content:center;align-items:center;display:flex;transform:translateY(2px)}.episode-row-status--done{color:var(--text-h);opacity:.9}.episode-row-status--current{color:var(--text-h);opacity:1}.episode-row-status--locked{color:var(--text-2);opacity:.4}.path-quiz-block{padding:0;display:flex}.quiz-card{background:color-mix(in srgb, #fffbeb 85%, var(--bg));border:none;border-radius:14px;align-items:flex-start;gap:12px;width:100%;padding:12px 16px;display:flex}.path-quiz-block--collapsed .quiz-card{padding:10px 16px}.quiz-card-icon{aspect-ratio:3/4;color:#d97706;background:#f59e0b2e;border-radius:2px;flex-shrink:0;justify-content:center;align-self:flex-start;align-items:center;width:48px;display:flex}.quiz-card-info{flex-direction:column;gap:1px;display:flex}.quiz-card-title{color:#92400e;margin:0;font-size:14px;font-weight:700;line-height:1.3}.quiz-card-desc{color:#a16207;white-space:nowrap;margin:0;font-size:11px}@media (prefers-color-scheme:dark){.quiz-card{background:color-mix(in srgb, #1c1008 80%, var(--bg))}.quiz-card-title{color:#fcd34d}.quiz-card-desc{color:#fbbf24;opacity:.7}.quiz-card-icon{color:#fbbf24}}.home-fab{left:50%;bottom:calc(92px + env(safe-area-inset-bottom,0px));height:32px;color:var(--text-h);font-family:var(--sans);cursor:pointer;z-index:40;white-space:nowrap;background:#fff;border:none;border-radius:999px;align-items:center;gap:5px;padding:0 14px;font-size:12.5px;font-weight:600;transition:transform .15s,box-shadow .15s,background .15s;display:inline-flex;position:fixed;transform:translate(-50%);box-shadow:0 4px 14px #0000001a,0 1px 4px #0000000f}.home-fab:hover{transform:translate(-50%)translateY(-1px);box-shadow:0 10px 24px #00000024,0 2px 8px #00000014}.home-fab:active{transform:translate(-50%)translateY(0)}.home-fab-icon{flex-shrink:0;justify-content:center;align-items:center;width:14px;height:14px;display:inline-flex;position:relative}.home-fab-icon-in,.home-fab-icon-out{margin:auto;transition:opacity .25s,transform .25s;position:absolute;inset:0}.home-fab-icon-in{opacity:1;transform:rotate(0)}.home-fab-icon-out{opacity:0;transform:rotate(-90deg)}.home-fab--collapsed .home-fab-icon-in{opacity:0;transform:rotate(90deg)}.home-fab--collapsed .home-fab-icon-out{opacity:1;transform:rotate(0)}.home-fab-label{line-height:1;display:inline-grid;position:relative}.home-fab-label-text{white-space:nowrap;grid-area:1/1;transition:opacity .25s,transform .25s}.home-fab-label-text--expanded{opacity:1;transform:translateY(0)}.home-fab-label-text--collapsed{opacity:0;transform:translateY(4px)}.home-fab--collapsed .home-fab-label-text--expanded{opacity:0;transform:translateY(-4px)}.home-fab--collapsed .home-fab-label-text--collapsed{opacity:1;transform:translateY(0)}.section-block h2{margin-bottom:12px}.bullet-list{color:var(--text);margin:0;padding-left:1.2em;line-height:160%}.stat-bar{background:var(--border);border-radius:999px;height:8px;margin-top:6px;overflow:hidden}.stat-bar>span{background:linear-gradient(90deg, var(--accent), color-mix(in srgb, var(--accent) 60%, white));border-radius:999px;height:100%;display:block}.visual-row{flex-wrap:wrap;gap:16px;margin-top:12px;display:flex}.visual-box{border:1px dashed var(--border);text-align:center;border-radius:12px;flex:140px;min-height:100px;padding:12px}.visual-box strong{color:var(--text-h);margin-bottom:6px;display:block}.week-calendar{justify-content:space-between;gap:8px;display:flex}.week-day{flex-direction:column;flex:1;align-items:center;gap:6px;display:flex}.week-day-label{color:var(--text);font-size:12px;font-family:var(--sans)}.week-day-dot{border:2px solid var(--border);background:var(--bg);border-radius:50%;width:28px;height:28px;transition:background .2s,border-color .2s}.week-day.checked .week-day-dot{background:var(--accent);border-color:var(--accent)}.week-day.today .week-day-label{color:var(--accent);font-weight:600}.week-day.today:not(.checked) .week-day-dot{border-color:var(--accent)}.continue-card{color:inherit;align-items:center;gap:14px;text-decoration:none;display:flex}.continue-card .card-emoji{flex-shrink:0;margin-bottom:0;font-size:28px}.continue-card-info{flex-direction:column;flex:1;gap:2px;display:flex}.continue-card-info strong{color:var(--text-h);font-size:16px}.continue-arrow{color:var(--text);opacity:.4;flex-shrink:0;font-size:22px}.episode-lesson{padding:12px 24px;padding-bottom:calc(16px + env(safe-area-inset-bottom));box-sizing:border-box;flex-direction:column;flex:1;width:100%;max-width:480px;margin:0 auto;display:flex}.lesson-progress-row{align-items:center;gap:10px;margin-bottom:8px;display:flex}.lesson-progress-bar{background:var(--color-brand-bg-soft);border-radius:999px;flex:1;height:10px;overflow:hidden}.bgm-btn{width:22px;height:22px;color:var(--accent);cursor:pointer;opacity:.7;background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;padding:0;transition:opacity .2s;display:flex}.bgm-btn:hover{opacity:1}.bgm-btn--muted{opacity:.25}@keyframes bgm-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.bgm-spinning{animation:4s linear infinite bgm-spin}.lesson-progress-fill{background:var(--color-brand-500);border-radius:999px;height:100%;transition:width .35s cubic-bezier(.22,.61,.36,1)}.lesson-image-row{justify-content:center;width:100%;padding:10px 0 4px;display:flex}.lesson-image-stage{aspect-ratio:1;perspective:1800px;width:100%;transform-style:preserve-3d;position:relative}.lesson-image-frame{background:#120f1b;border-radius:2px;position:absolute;inset:0;overflow:hidden;box-shadow:0 10px 22px #08060d1f,0 3px 8px #08060d14}.lesson-image-card{border-radius:inherit;transform-style:preserve-3d;position:absolute;inset:0;overflow:hidden}.lesson-image-card--next{z-index:1}.lesson-image-book{z-index:2;transform-style:preserve-3d;position:absolute;inset:0}.lesson-image-half{z-index:1;background-repeat:no-repeat;background-size:200% 100%;width:50%;min-width:0;position:absolute;top:0;bottom:0}.lesson-image-half--left{background-position:0;left:0}.lesson-image-half--right{background-position:100%;right:0}.lesson-image-half--next-left,.lesson-image-half--next-right{z-index:1}.lesson-image-half--current-left{z-index:2}.lesson-image-page{transform-origin:0;width:50%;transform-style:preserve-3d;z-index:4;transition:transform .68s cubic-bezier(.22,.61,.36,1);position:absolute;top:0;bottom:0;right:0}.lesson-image-face{backface-visibility:hidden;background-repeat:no-repeat;background-size:200% 100%;position:absolute;inset:0}.lesson-image-face--front{background-position:100%;transform:translateZ(1px)}.lesson-image-face--back{background-position:0;transform:rotateY(180deg)}.lesson-image-page--left{transform-origin:100%;width:50%;transform-style:preserve-3d;z-index:4;transition:transform .68s cubic-bezier(.22,.61,.36,1);position:absolute;top:0;bottom:0;left:0}.lesson-image-face--front-left{background-position:0}.lesson-image-face--back-left{background-position:100%}.lesson-image-half--current-right{z-index:2}.lesson-image-stage--flipping.lesson-image-stage--forward .lesson-image-page--right{transform:rotateY(-179deg)}.lesson-image-stage--flipping.lesson-image-stage--backward .lesson-image-page--left{transform:rotateY(179deg)}.lesson-content{flex:1;justify-content:center;align-items:flex-start;padding:16px 0 8px;display:flex}.lesson-bubble{text-align:left;opacity:1;width:100%;transition:opacity .16s}.lesson-bubble--out{opacity:0}.lesson-bubble-speaker-row{align-items:center;gap:8px;margin:0 0 6px;display:flex}.lesson-bubble-avatar{object-fit:cover;border:1.5px solid #0000000f;border-radius:50%;flex-shrink:0;width:32px;height:32px}.lesson-bubble-speaker{color:var(--accent);text-transform:uppercase;letter-spacing:.05em;margin:0;font-size:11.5px;font-weight:600}.lesson-bubble-note{color:var(--text);margin:0 0 10px;font-size:13px;font-style:italic}.lesson-bubble-text{color:var(--text-h);margin:0;font-size:17px;line-height:2}.karaoke-text{text-align:left}.karaoke-word{color:color-mix(in srgb, var(--text-h) 35%, transparent);transition:color 80ms;display:inline}.karaoke-word--past{color:color-mix(in srgb, var(--text-h) 70%, transparent)}.karaoke-word--active{color:var(--accent)}.score-diff{text-align:left;border-top:0;margin-top:10px;padding-top:0}.score-badge{border-radius:8px;flex-direction:column;align-items:flex-start;gap:6px;margin-bottom:0;padding:14px;font-weight:700;display:flex}.score-badge--great{color:#16a34a;background:#22c55e1f}.score-badge--good{color:#ca8a04;background:#eab3081f}.score-badge--low{color:#dc2626;background:#ef44441f}.score-badge-num{font-size:22px}.score-badge-unit{font-size:13px}.score-badge-label{margin-left:6px;font-size:13px;font-weight:500}.score-badge-score{flex-shrink:0;align-items:baseline;gap:4px;display:inline-flex}.score-diff-words{margin:0;font-size:14px;font-weight:500;line-height:1.55}.score-word{display:inline}.score-word--correct{color:var(--text-h)}.score-word--wrong{color:#dc2626;-webkit-text-decoration:underline wavy #dc2626;text-decoration:underline wavy #dc2626}.score-word--missing{color:#dc2626;opacity:.45}.score-transcript{color:var(--text);margin:0;font-size:13px;font-style:italic}.lesson-ai-btn-row{justify-content:flex-end;padding-bottom:12px;display:flex}.lesson-ai-btn{width:54px;height:54px;color:var(--text);cursor:pointer;background:#fff;border:1px solid #0000001f;border-radius:50%;justify-content:center;align-items:center;transition:transform .15s,box-shadow .15s;display:flex;box-shadow:0 2px 8px #00000014}.lesson-ai-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.lesson-ai-btn--active{background:#fff;border-color:#0000002e;transform:translateY(0);box-shadow:0 2px 8px #00000014}.lesson-ai-btn-icon{width:38px;height:36px;display:block}.ai-float-panel{left:14px;right:14px;bottom:calc(90px + env(safe-area-inset-bottom,0px));z-index:101;background:var(--bg);border:1px solid var(--border);border-radius:20px;flex-direction:column;max-height:52vh;animation:.22s cubic-bezier(.34,1.4,.64,1) ai-float-in;display:flex;position:fixed;box-shadow:0 8px 40px #00000024,0 2px 10px #0000000f}@keyframes ai-float-in{0%{opacity:0;transform:translateY(10px)scale(.97)}to{opacity:1;transform:translateY(0)scale(1)}}.ai-float-header{border-bottom:1px solid var(--border);flex-shrink:0;justify-content:space-between;align-items:center;padding:12px 14px 10px;display:flex}.ai-float-title{color:var(--accent);letter-spacing:-.1px;align-items:center;gap:7px;font-size:14px;font-weight:700;display:flex}.ai-float-title:before{content:"";background:var(--accent);border-radius:50%;width:8px;height:8px;animation:1.8s ease-in-out infinite ai-dot-pulse}@keyframes ai-dot-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.7)}}.ai-panel-close{background:color-mix(in srgb, var(--text) 10%, transparent);width:26px;height:26px;color:var(--text);cursor:pointer;border:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:12px;display:flex}.ai-float-body{-webkit-overflow-scrolling:touch;flex-direction:column;gap:10px;padding:12px 14px 16px;display:flex;overflow-y:auto}.ai-panel-empty{color:var(--text);opacity:.55;text-align:center;padding:20px 0;font-size:13px}.ai-panel-state{min-height:92px;color:var(--text);flex-direction:column;justify-content:center;align-items:center;gap:10px;padding:16px 10px;display:flex}.ai-panel-state--error{color:#b42318}.ai-panel-spinner{color:var(--accent)}.ai-panel-state-text{text-align:center;margin:0;font-size:13px;line-height:1.5}.ai-panel-retry{border:1px solid color-mix(in srgb, var(--accent) 24%, transparent);background:color-mix(in srgb, var(--accent) 9%, var(--bg));color:var(--accent);cursor:pointer;border-radius:999px;padding:8px 14px;font-size:12px;font-weight:700;line-height:1}.ai-panel-retry:active{transform:translateY(1px)}.ai-point{border:1.5px solid color-mix(in srgb, var(--color-brand-500) 22%, transparent);background:#eef5ff;border-radius:8px;flex-direction:column;gap:7px;padding:12px 14px 13px;animation:.18s ai-bubble-in;display:flex}@keyframes ai-bubble-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.ai-point-head{justify-content:space-between;align-items:center;gap:10px;display:flex}.ai-point-label{min-width:0;color:var(--color-brand-700);letter-spacing:.01em;align-items:center;gap:5px;font-size:12px;font-weight:800;display:flex}.ai-point-icon{width:18px;height:18px;color:var(--color-brand-500);background:#4d88ff1f;border-radius:999px;flex-shrink:0;justify-content:center;align-items:center;font-size:11px;display:inline-flex}.ai-point-save{color:var(--color-brand-700);cursor:pointer;background:#fff;border:1px solid #4d88ff3d;border-radius:999px;flex-shrink:0;padding:6px 9px;font-size:11px;font-weight:700;line-height:1}.ai-point-save:disabled{cursor:default;opacity:.7}.ai-point-save--saved{color:var(--color-brand-700);background:#4d88ff1f}.ai-point-content{color:color-mix(in srgb, var(--text-h) 88%, var(--color-brand-700));margin:0;font-size:13.5px;line-height:1.72}.ai-cursor{background:var(--accent);vertical-align:text-bottom;border-radius:1px;width:2px;height:.9em;margin-left:2px;animation:.6s step-end infinite ai-blink;display:inline-block}@keyframes ai-blink{0%,to{opacity:1}50%{opacity:0}}.lesson-nav{justify-content:center;align-items:center;gap:14px;padding-top:16px;display:flex}.lesson-icon-btn{--lesson-btn-shadow:#d1d5db;min-width:200px;height:52px;color:var(--text-h);cursor:pointer;box-shadow:0 4px 0 var(--lesson-btn-shadow);touch-action:manipulation;-webkit-user-select:none;user-select:none;background:#fff;border:2px solid #d1d5db;border-radius:16px;flex-shrink:0;justify-content:center;align-items:center;padding:0 22px;transition:background .15s,border-color .15s,box-shadow .15s,opacity .15s,color .15s,transform .1s;display:flex}.lesson-icon-btn:not(:disabled):active{box-shadow:0 1px 0 var(--lesson-btn-shadow);transform:translateY(3px)}.lesson-icon-btn:disabled{opacity:.42;cursor:not-allowed;box-shadow:0 4px 0 var(--lesson-btn-shadow)}.lesson-icon-btn--ghost:not(:disabled):hover{color:var(--text-h);border-color:#b8bec8}.lesson-icon-btn--accent{--lesson-btn-shadow:#d1d5db;color:var(--text-h);background:#fff;border-color:#d1d5db}.lesson-icon-btn--accent:not(:disabled):hover{background:#f9fafb;border-color:#b8bec8}.lesson-icon-btn--danger{--lesson-btn-shadow:#d1d5db;color:#dc2626;background:#fff;border-color:#d1d5db}.lesson-icon-btn--danger:hover{background:#fef2f2;border-color:#fca5a5}.lesson-btn-label{letter-spacing:.02em;font-size:16px;font-weight:700;line-height:1}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.spin{animation:.9s linear infinite spin}.bubble-actions{gap:8px;margin-top:14px;display:flex}.bubble-action-btn{border:1px solid var(--border);width:30px;height:30px;color:color-mix(in srgb, var(--text) 55%, transparent);cursor:pointer;background:0 0;border-radius:50%;justify-content:center;align-items:center;transition:background .15s,color .15s,border-color .15s;display:flex}.bubble-action-btn:hover{background:color-mix(in srgb, var(--accent) 10%, transparent);color:var(--accent);border-color:var(--accent-border)}.lesson-overlay{z-index:200;background:#00000073;animation:.2s fade-in;position:fixed;inset:0}.lesson-complete{z-index:201;background:var(--bg);padding:28px 24px;padding-bottom:calc(28px + env(safe-area-inset-bottom));border-radius:20px 20px 0 0;animation:.25s cubic-bezier(.32,.72,0,1) slide-up;position:fixed;bottom:0;left:0;right:0;box-shadow:0 -4px 24px #0000001a}.lesson-complete-title{color:var(--text-h);text-align:center;margin:0 0 20px;font-size:18px;font-weight:600}.lesson-complete-actions{flex-direction:column;gap:10px;display:flex}.lesson-complete-btn{border:1px solid var(--border);background:color-mix(in srgb, var(--bg) 92%, var(--code-bg));width:100%;color:var(--text-h);font-size:16px;font-family:var(--sans);cursor:pointer;border-radius:12px;padding:14px;font-weight:500;transition:border-color .15s}.lesson-complete-btn:hover{border-color:var(--accent-border)}.lesson-complete-btn-primary{background:var(--accent-bg);border-color:var(--accent-border);color:var(--accent)}.lesson-complete-btn-primary:hover{background:var(--accent);color:#fff}.lesson-complete--chapter{box-shadow:none;background:#4d88ff;border-radius:16px 16px 0 0}.lesson-complete--chapter .lesson-complete-title{color:#fff;font-weight:800}.lesson-complete--chapter .lesson-complete-btn,.lesson-complete--chapter .lesson-complete-btn-primary,.lesson-complete--chapter .lesson-complete-btn:hover,.lesson-complete--chapter .lesson-complete-btn-primary:hover{color:var(--text-h);background:#fff;border:0;border-radius:8px;font-weight:900;transition:transform .1s,box-shadow .1s,opacity .1s;box-shadow:0 4px #1e55c8}.lesson-complete--chapter .lesson-complete-btn:active,.lesson-complete--chapter .lesson-complete-btn-primary:active{transform:translateY(3px);box-shadow:0 1px #1e55c8}.lesson-complete--chapter .lesson-complete-btn-grammar,.lesson-complete--chapter .lesson-complete-btn-grammar:hover{color:var(--text-h);background:#ffd400;border:0;box-shadow:0 4px #b89300}.lesson-complete--chapter .lesson-complete-btn-grammar:active{transform:translateY(3px);box-shadow:0 1px #b89300}.discover-join-sheet{z-index:201;padding-bottom:calc(28px + env(safe-area-inset-bottom,0px));border-radius:16px 16px 0 0;bottom:0;left:0;right:0}.chat-input{border:1px solid var(--border);background:var(--bg);color:var(--text-h);font-size:15px;font-family:var(--sans);border-radius:10px;outline:none;flex:1;padding:10px 14px}.chat-input:focus{border-color:var(--accent-border)}.chat-input:disabled{opacity:.5;cursor:not-allowed}.discover-page{box-sizing:border-box;flex-direction:column;flex:1;justify-content:center;align-items:center;min-height:0;padding:24px 20px 100px;display:flex;position:relative;overflow:hidden}.app-shell--discover .discover-page{margin-top:calc(-58px - env(safe-area-inset-top,0px));padding-top:calc(24px + 58px + env(safe-area-inset-top,0px))}.discover-bg{z-index:0;pointer-events:none;height:100lvh;transition:background .8s;position:fixed;inset:0}.discover-page>:not(.discover-bg):not(.discover-toast):not(.discover-sheet-mask){z-index:1;position:relative}.discover-toast{z-index:100}.discover-categories{scrollbar-width:none;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity;flex-shrink:0;gap:8px;width:100%;max-width:400px;padding:4px 2px 12px;display:flex;overflow-x:auto}.discover-categories::-webkit-scrollbar{display:none}.discover-cat-btn{border:1px solid var(--border);color:var(--text);font-size:14px;font-family:var(--sans);cursor:pointer;white-space:nowrap;background:0 0;border-radius:20px;flex-shrink:0;padding:6px 16px;transition:background .15s,color .15s,border-color .15s}.discover-cat-btn:hover{color:var(--text-h);border-color:var(--accent-border)}.discover-cat-btn--active{background:var(--accent);color:#fff;border-color:var(--accent);font-weight:600}.discover-toast{top:calc(20px + env(safe-area-inset-top,0px));background:var(--accent);color:#fff;white-space:nowrap;z-index:100;pointer-events:none;border-radius:20px;padding:8px 20px;font-size:13px;font-weight:600;animation:.25s toast-in;position:absolute;left:50%;transform:translate(-50%)}@keyframes toast-in{0%{opacity:0;transform:translate(-50%)translateY(-8px)}to{opacity:1;transform:translate(-50%)translateY(0)}}.discover-main{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:clamp(22px,4vh,44px);width:100%;min-height:0;display:flex}.discover-stack{flex-shrink:0;width:100%;max-width:300px;height:490px;transition:height .24s,max-height .24s;position:relative}@media (width<=480px){.discover-page{height:100%;min-height:calc(100dvh - 58px - env(safe-area-inset-top,0px) - 64px - env(safe-area-inset-bottom,0px));padding:clamp(10px, 2vh, 18px) 16px calc(70px + env(safe-area-inset-bottom,0px));overscroll-behavior:none;touch-action:none;overflow:hidden}.discover-main{flex:1;justify-content:center;gap:clamp(18px,3.4vh,34px);min-height:0;position:relative}.discover-stack{flex:0 auto;width:100%;max-width:min(268px,100vw - 72px);height:clamp(300px,52dvh,420px);min-height:260px;max-height:420px}.discover-stack--text-open{height:clamp(320px,54dvh,460px);max-height:min(460px, calc(100dvh - 250px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px)));max-width:min(286px,100vw - 72px)}.discover-stack .discover-card,.discover-stack .discover-card--front,.discover-stack .discover-card--behind1,.discover-stack .discover-card--behind2{border-radius:2px;height:100%}.discover-actions{z-index:10;flex-shrink:0;gap:24px;position:relative}.discover-actions .discover-btn{width:42px;height:42px}.discover-actions .discover-btn svg{width:24px;height:24px}.discover-btn--filter{height:32px;padding:0 8px}.discover-card-script{touch-action:pan-y}}@media (width>=768px) and (orientation:landscape){.discover-page{padding-top:calc(12px + 58px + env(safe-area-inset-top,0px));padding-bottom:calc(76px + env(safe-area-inset-bottom,0px))}.discover-main{justify-content:center;gap:clamp(12px,1.8vh,22px)}.discover-stack{max-width:300px;height:min(55vh,430px)}.discover-stack .discover-card,.discover-stack .discover-card--front,.discover-stack .discover-card--behind1,.discover-stack .discover-card--behind2{height:100%}.discover-stack--text-open{max-width:min(460px,100vw - 340px);height:min(58vh,460px)}.discover-text-layer-title{font-size:21px}.discover-text-layer-tag{font-size:14px}.discover-card-script-line{font-size:24px;line-height:1.68}.discover-card-script{gap:16px}.discover-actions{flex-shrink:0}}.discover-card{isolation:isolate;-webkit-user-select:none;user-select:none;touch-action:pan-y;background:#111;border:none;border-radius:2px;transition:background .6s,opacity .24s;position:absolute;left:0;right:0;overflow:hidden}.discover-card--text-open,.discover-stack--text-open .discover-card{opacity:0;pointer-events:none}.discover-text-layer{z-index:4;box-sizing:border-box;color:#08060d;opacity:0;pointer-events:none;background:0 0;border-radius:2px;flex-direction:column;padding:0;transition:opacity .28s,transform .28s;display:flex;position:absolute;inset:0 -24px;transform:translateY(6px)}.discover-text-layer--visible{opacity:1;pointer-events:auto;transform:translateY(0)}.discover-text-layer-header{align-items:center;gap:12px;margin-bottom:18px;display:flex}.discover-text-layer-cover{object-fit:cover;object-position:center;border-radius:8px;flex-shrink:0;width:48px;height:48px;display:block}.discover-text-layer-meta{flex-direction:column;gap:4px;min-width:0;display:flex}.discover-text-layer-title{color:#08060d;letter-spacing:-.02em;margin:0;font-size:18px;font-weight:800;line-height:1.25}.discover-text-layer-tag{color:#08060d8f;font-size:13px;font-weight:700;line-height:1.2}.discover-card--front{z-index:3;cursor:grab;height:490px;top:0}.discover-card--front:active{cursor:grabbing}.discover-card--behind1{z-index:2;transform-origin:top;pointer-events:none;height:490px;top:0}.discover-card--behind2{z-index:1;transform-origin:top;pointer-events:none;opacity:.7;height:490px;top:0}@media (width<=480px){.discover-card--front,.discover-card--behind1,.discover-card--behind2{height:100%}}.discover-card-img{object-fit:cover;object-position:center bottom;width:100%;height:100%;display:block;position:absolute;inset:0}.discover-card-body{text-align:center;background:linear-gradient(to top, #0006 0%, #00000054 11%, #00000047 22%, #00000040 33%, #0000001f 44%, transparent 55%), linear-gradient(to top, var(--card-tint,#1e1e23e6) 0%, color-mix(in srgb, var(--card-tint,#1e1e23) 75%, transparent) 17%, color-mix(in srgb, var(--card-tint,#1e1e23) 45%, transparent) 32%, color-mix(in srgb, var(--card-tint,#1e1e23) 20%, transparent) 44%, transparent 55%);flex-direction:column;align-items:center;gap:8px;padding:140px 22px 16px;transition:background .6s;display:flex;position:absolute;bottom:0;left:0;right:0}.discover-card-title{color:#fff;letter-spacing:-.3px;text-shadow:0 1px 2px #00000014;margin:0;font-size:19px;font-weight:700}.discover-card-desc{color:#ffffffeb;margin:0;font-size:12.5px;line-height:1.55}.discover-card-tag{-webkit-backdrop-filter:blur(12px)saturate(1.4);color:#fff;letter-spacing:.5px;background:#ffffff2e;border:1px solid #ffffff47;border-radius:20px;margin-top:2px;padding:4px 14px;font-size:11px;font-weight:600;display:inline-block}.discover-card-back-tag{color:#2d2926ad;background:#ffffff73;border-radius:999px;align-self:center;padding:4px 12px;font-size:12px;font-weight:700}.discover-card-back-title{text-align:center;letter-spacing:-.4px;margin:10px 0 2px;font-size:20px;line-height:1.2}.discover-card-back-hint{text-align:center;color:#2d292694;margin:0 0 12px;font-size:12px}.discover-card-script{scrollbar-width:none;touch-action:pan-y;-webkit-overflow-scrolling:touch;flex-direction:column;flex:1;gap:14px;min-height:0;padding:0;display:flex;overflow-y:auto}.discover-card-script--can-scroll-up{-webkit-mask-image:linear-gradient(#0000 0,#000 28px 100%);mask-image:linear-gradient(#0000 0,#000 28px 100%)}.discover-card-script--can-scroll-down{-webkit-mask-image:linear-gradient(#000 0 calc(100% - 28px),#0000 100%);mask-image:linear-gradient(#000 0 calc(100% - 28px),#0000 100%)}.discover-card-script--can-scroll-up.discover-card-script--can-scroll-down{-webkit-mask-image:linear-gradient(#0000 0,#000 28px calc(100% - 28px),#0000 100%);mask-image:linear-gradient(#0000 0,#000 28px calc(100% - 28px),#0000 100%)}.discover-card-script::-webkit-scrollbar{display:none}.discover-card-script-line{color:#08060d5c;background:0 0;margin:0;padding:0;font-size:14px;line-height:1.72;transition:color .2s,opacity .2s,transform .2s}.discover-card-script-line--active{color:#08060d5c;text-shadow:none;transform:translate(2px)}.discover-karaoke-word{color:#08060d5c;transition:color .1s}.discover-karaoke-word--past{color:#08060db8}.discover-karaoke-word--active{color:#08060d}.discover-card-script-speaker{color:inherit;font-weight:800}.discover-card-script-empty{text-align:center;color:#08060d;margin:auto 0;font-size:15px}@media (width<=480px){.discover-card-script-line{font-size:18px}.discover-card-script-empty{font-size:17px}}.discover-filter-row{flex-shrink:0;justify-content:center;align-items:center;width:100%;max-width:300px;display:flex}.discover-actions{flex-shrink:0;align-items:center;gap:48px;display:flex}.discover-btn{cursor:pointer;width:52px;height:52px;box-shadow:none;background:rgba(255, 255, 255, var(--p,0));border:2px solid rgba(0, 0, 0, calc(1 - var(--p,0)));color:#111;touch-action:manipulation;-webkit-user-select:none;user-select:none;border-radius:50%;justify-content:center;align-items:center;transition:transform .15s;display:flex;position:relative}.discover-btn--like{color:color-mix(in srgb, #ef4444 calc(var(--p,0) * 100%), #111)}.discover-btn:hover{transform:scale(1.06)}.discover-btn:active{transform:scale(.95)}.discover-btn--filter{color:#111;width:auto;height:32px;box-shadow:none;background:0 0;border:none;border-radius:0;gap:5px;padding:0 10px;position:relative}.discover-filter-label{font-size:16px;font-weight:600;font-family:var(--sans);letter-spacing:.2px;color:#111}.discover-sheet-mask{z-index:200;-webkit-backdrop-filter:blur(2px);background:#0006;animation:.2s fade-in;position:fixed;inset:0}.discover-sheet{background:var(--bg);padding:12px 24px calc(40px + env(safe-area-inset-bottom,0px));border-radius:24px 24px 0 0;animation:.28s cubic-bezier(.32,.72,0,1) sheet-up;position:absolute;bottom:0;left:0;right:0}@keyframes sheet-up{0%{transform:translateY(100%)}to{transform:translateY(0)}}.discover-sheet-handle{background:var(--border);border-radius:2px;width:36px;height:4px;margin:0 auto 20px}.discover-sheet-title{color:var(--text-h);text-align:center;margin:0 0 16px;font-size:15px;font-weight:600}.discover-sheet-grid{grid-template-columns:repeat(4,1fr);gap:10px;display:grid}.discover-sheet-btn{border:1px solid var(--border);color:var(--text);font-size:14px;font-family:var(--sans);cursor:pointer;white-space:nowrap;text-align:center;background:0 0;border-radius:14px;padding:10px 4px;transition:background .15s,color .15s,border-color .15s}.discover-sheet-btn:hover{border-color:var(--accent-border);color:var(--text-h)}.discover-sheet-btn--active{background:var(--accent);color:#fff;border-color:var(--accent);font-weight:600}@keyframes slide-up{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.phrase-group{border-bottom:1.5px solid color-mix(in srgb, var(--text) 20%, transparent);cursor:pointer;-webkit-box-decoration-break:clone;box-decoration-break:clone;border-radius:2px;padding-bottom:3px;transition:background .15s;display:inline}.phrase-group:active,.phrase-group--active{background:color-mix(in srgb, var(--accent) 10%, transparent)}.phrase-tooltip{z-index:91;background:var(--text-h);color:var(--bg);pointer-events:auto;cursor:pointer;border-radius:10px;flex-direction:column;gap:3px;padding:8px 12px;animation:.14s phrase-tooltip-in;display:flex;position:fixed;box-shadow:0 4px 20px #00000038}.phrase-tooltip--above:after{content:"";bottom:-6px;left:var(--phrase-tooltip-arrow-left,50%);border:6px solid #0000;border-bottom-width:0;border-top-color:var(--text-h);position:absolute;transform:translate(-50%)}.phrase-tooltip--below:before{content:"";top:-6px;left:var(--phrase-tooltip-arrow-left,50%);border:6px solid #0000;border-top-width:0;border-bottom-color:var(--text-h);position:absolute;transform:translate(-50%)}.phrase-tooltip--above{transform:translateY(-100%)}.phrase-tooltip-en{opacity:.65;font-size:12px;line-height:1.4}.phrase-tooltip-zh{font-size:15px;font-weight:600;line-height:1.35}@keyframes phrase-tooltip-in{0%{opacity:0;transform:translateY(calc(-100% - 4px))}to{opacity:1;transform:translateY(-100%)}}.phrase-tooltip--below{transform:translateY(0)}@keyframes phrase-tooltip-in-below{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.phrase-tooltip--below{animation-name:phrase-tooltip-in-below}.bubble-action-btn--dim{opacity:.3;cursor:default}.episode-lesson{box-sizing:border-box;flex-direction:column;flex:1;width:100%;max-width:520px;min-height:0;margin:0 auto;padding:0 18px;display:flex;overflow:hidden}.app-shell--lesson .episode-lesson{margin-top:-1px}.lesson-progress-row{flex:1;align-items:center;gap:10px;min-width:0;height:28px;margin:0;display:flex}.lesson-flow{overscroll-behavior:contain;-webkit-overflow-scrolling:touch;min-height:0;padding:14px 0 calc(112px + env(safe-area-inset-bottom,0px));scrollbar-width:none;flex-direction:column;flex:1;gap:18px;display:flex;overflow-y:auto}.lesson-flow::-webkit-scrollbar{display:none}.lesson-flow-item{flex-direction:column;gap:12px;display:flex}.lesson-flow-tail{flex-shrink:0;height:max(180px,100% - 96px)}.lesson-scene-card{aspect-ratio:16/9;background-color:#120f1b;background-position:50%;background-size:cover;border-radius:8px;flex-shrink:0;width:100%;margin-top:12px;transition:background-image .18s;box-shadow:0 10px 22px #08060d1a,0 3px 8px #08060d0f}.lesson-scene-card--empty{color:#ffffffb8;justify-content:center;align-items:center;display:flex}.lesson-message{width:100%}.lesson-message--speech{box-sizing:border-box;grid-template-columns:36px minmax(0,1fr);align-items:flex-start;gap:10px;display:grid}.lesson-replay-btn{width:20px;height:20px;color:var(--text);cursor:pointer;vertical-align:-4px;box-shadow:none;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;margin:0 8px 0 0;padding:0;transition:transform .12s,color .15s,border-color .15s,opacity .15s;display:inline-flex}.lesson-replay-btn:not(:disabled):active{transform:scale(.92)}.lesson-replay-btn:not(:disabled):hover{color:var(--accent)}.lesson-replay-btn:disabled{opacity:.24;cursor:not-allowed}.lesson-message-avatar{object-fit:cover;background:color-mix(in srgb, var(--accent) 10%, #fff);border:1.5px solid #0000000f;border-radius:50%;width:34px;height:34px}.lesson-message-avatar--empty{opacity:0}.lesson-message-body{min-width:0}.lesson-message .lesson-bubble{box-sizing:border-box;width:fit-content;min-width:0;max-width:100%;box-shadow:none;background:0 0;border:1.5px solid #e5e7eb;border-radius:16px;padding:13px 15px}.lesson-message--active .lesson-bubble{border-color:#d9dce2}.lesson-narration{padding:4px}.lesson-bubble-text{font-size:16px;line-height:1.8}.lesson-bubble-speaker-row{margin:0 0 5px;padding-left:2px}.lesson-bubble-avatar{display:none}.lesson-quiz-card{background:0 0;border:0;border-radius:0;margin-left:4px;padding:12px 0}.lesson-quiz-card--muted{color:var(--text)}.lesson-quiz-kicker{letter-spacing:.08em;color:#4d88ff;margin:0 0 6px;font-size:11px;font-weight:700}.lesson-quiz-question{color:#0f172a;margin:0 0 10px;font-size:14px;font-weight:600;line-height:1.55}.lesson-quiz-loading,.lesson-quiz-feedback{color:color-mix(in srgb, var(--text-h) 58%, transparent);margin:8px 0 0;font-size:12px;line-height:1.45}.lesson-quiz-options{flex-direction:column;gap:12px;display:flex}.lesson-quiz-option{width:min(360px,100%);max-width:100%;min-height:48px;color:var(--text-h);font:inherit;text-align:center;cursor:pointer;background:#fff;border:2px solid #e2e8f0;border-radius:8px;padding:0 18px;font-size:14px;font-weight:700;line-height:1.45;transition:background .15s,border-color .15s,transform .1s}.lesson-quiz-option:not(:disabled):hover{background:#f9fafb;border-color:#cbd5e1}.lesson-quiz-option:not(:disabled):active{transform:translateY(1px)}.lesson-quiz-option--selected{border-color:#334155}.lesson-quiz-option--correct{color:#15803d;background:#dcfce7;border-color:#22c55e}.lesson-quiz-option--wrong,.lesson-quiz-option--wrong:not(:disabled):hover,.lesson-quiz-option--wrong:not(:disabled):active{color:#b91c1c;background:#fee2e2;border-color:#ef4444}.lesson-quiz-option:disabled{cursor:default;opacity:1}.vocabulary-lesson-page{box-sizing:border-box;flex:1;width:100%;max-width:520px;min-height:0;margin:0 auto;padding:0 18px;overflow:hidden}.vocabulary-lesson-main{overscroll-behavior:contain;-webkit-overflow-scrolling:touch;height:100%;padding:14px 0 calc(112px + env(safe-area-inset-bottom,0px));box-sizing:border-box;scrollbar-width:none;overflow-y:auto}.vocabulary-lesson-main::-webkit-scrollbar{display:none}.vocabulary-lesson-main--intro{justify-content:center;align-items:center;display:flex}.vocabulary-intro{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:22px;display:flex}.vocabulary-loading-state{min-height:100%}.unified-lesson-loading{z-index:9999;padding:calc(24px + env(safe-area-inset-top,0px)) 0 0;box-sizing:border-box;color:#fff;text-align:center;background:#4d88ff;flex-direction:column;justify-content:flex-end;align-items:center;gap:40px;display:flex;position:fixed;inset:0}.unified-lesson-loading-back{top:calc(16px + env(safe-area-inset-top,0px));color:#fff;cursor:pointer;-webkit-backdrop-filter:blur(10px);background:#ffffff2e;border:0;border-radius:999px;justify-content:center;align-items:center;width:36px;height:36px;padding:0;display:inline-flex;position:absolute;left:20px}.unified-lesson-loading-back:active{transform:scale(.96)}.unified-lesson-loading-title{color:#fff;letter-spacing:-.01em;margin:0;padding:0 24px;font-size:18px;font-weight:600;line-height:1.35}.unified-lesson-loading-lottie{width:100vw;height:60dvh}.vocabulary-intro-lottie{width:min(260px,72vw);height:min(260px,72vw)}@media (width<=480px){.vocabulary-intro-lottie{width:min(220px,62vw);height:min(220px,62vw)}}.vocabulary-intro-copy{flex-direction:column;align-items:center;gap:6px;display:flex}.vocabulary-intro-line{letter-spacing:-.04em;color:var(--text-h);margin:0;font-size:22px;font-weight:700;line-height:1.35}.vocabulary-card{box-shadow:none;background:0 0;border:0;border-radius:0;margin:0;padding:0}.vocabulary-question-card{flex-direction:column;min-height:100%;display:flex}.vocabulary-card--muted{color:var(--text)}.vocabulary-status-title{color:var(--text-h);margin:0 0 6px;font-size:17px;font-weight:700}.vocabulary-status-desc{margin:0;font-size:14px;line-height:1.6}.vocabulary-question-prompt{text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;min-height:220px;padding:10px 0 28px;display:flex}.vocabulary-progress{color:color-mix(in srgb, var(--text-h) 62%, transparent);justify-content:space-between;gap:12px;margin:0 4px 10px;font-size:13px;font-weight:700;display:flex}.vocabulary-word{letter-spacing:-.03em;color:var(--text-h);margin:0;font-size:32px;font-weight:800;line-height:1.15}.vocabulary-word-row{justify-content:center;align-items:center;gap:10px;margin:0 0 8px;display:inline-flex}.vocabulary-word-audio-btn{width:36px;height:36px;color:var(--text-h);cursor:pointer;background:#fff;border:2px solid #d1d5db;border-radius:999px;justify-content:center;align-items:center;transition:background .15s,border-color .15s,box-shadow .15s,color .15s,transform .1s;display:inline-flex;box-shadow:0 3px #d1d5db}.vocabulary-word-audio-btn:not(:disabled):hover,.vocabulary-word-audio-btn--playing{color:#4d88ff;border-color:#4d88ff}.vocabulary-word-audio-btn:not(:disabled):active{transform:translateY(2px);box-shadow:0 1px #d1d5db}.vocabulary-word-audio-btn:disabled{color:color-mix(in srgb, var(--text-h) 32%, transparent);cursor:default;opacity:.55}.vocabulary-question{color:var(--text);margin:0;font-size:15px;line-height:1.55}.vocabulary-example-translation{min-height:44px;color:color-mix(in srgb, var(--text-h) 58%, transparent);opacity:0;margin:8px 0 0;font-size:14px;line-height:1.55;transition:opacity .16s}.vocabulary-example-translation--visible{opacity:1}.vocabulary-summary{min-height:100%;padding:18px 0 calc(132px + env(safe-area-inset-bottom,0px));box-sizing:border-box;flex-direction:column;gap:18px;display:flex}.vocabulary-summary-header{text-align:left;flex-direction:column;gap:8px;display:flex}.vocabulary-summary-eyebrow{color:#4d88ff;margin:0;font-size:13px;font-weight:800}.vocabulary-summary-title{letter-spacing:-.05em;color:var(--text-h);margin:0;font-size:26px;line-height:1.15}.vocabulary-summary-desc{color:var(--text);margin:0;font-size:14px;line-height:1.6}.vocabulary-summary-error{color:#dc2626;background:#ef444414;border-radius:12px;margin:0;padding:10px 12px;font-size:13px;font-weight:700}.vocabulary-summary-list{flex-direction:column;gap:12px;display:flex}.vocabulary-summary-word{width:100%;color:var(--text-h);font:inherit;text-align:left;box-shadow:none;cursor:pointer;background:#fff;border:2px solid #d1d5db;border-radius:8px;grid-template-columns:28px 1fr auto;align-items:center;gap:12px;padding:14px;display:grid}.vocabulary-summary-word--selected{box-shadow:none;background:#4d88ff14;border-color:#4d88ff}.vocabulary-summary-check{color:#fff;background:#4d88ff;border-radius:999px;justify-content:center;align-items:center;width:28px;height:28px;font-size:16px;font-weight:900;display:inline-flex}.vocabulary-summary-word:not(.vocabulary-summary-word--selected) .vocabulary-summary-check{color:#0000;background:#f3f4f6}.vocabulary-summary-word-copy{flex-direction:column;gap:4px;min-width:0;display:flex}.vocabulary-summary-word-text{letter-spacing:-.03em;font-size:18px;font-weight:800}.vocabulary-summary-definition{color:var(--text);font-size:13px;line-height:1.45}.vocabulary-summary-badge{color:#dc2626;white-space:nowrap;background:#ef444414;border-radius:999px;padding:5px 8px;font-size:12px;font-weight:800}.vocabulary-summary-actions{grid-template-columns:108px 1fr;gap:12px;width:min(360px,100vw - 48px);margin:0 auto;display:grid}.vocabulary-summary-action-btn{width:100%;min-width:0;margin-top:0}.vocabulary-summary-actions .vocabulary-summary-action-btn,.vocabulary-summary-actions .lesson-icon-btn{min-width:0}.vocabulary-summary-actions .lesson-btn-label{white-space:nowrap}.vocabulary-answer-area{flex-shrink:0;margin-top:auto;margin-bottom:104px}.vocabulary-options{flex-direction:column;align-items:center;gap:20px;display:flex}.vocabulary-option{width:min(360px,82vw);min-height:48px;color:var(--text-h);font:inherit;text-align:center;cursor:pointer;box-shadow:none;touch-action:manipulation;-webkit-user-select:none;user-select:none;background:#fff;border:2px solid #e2e8f0;border-radius:8px;padding:0 18px;font-size:15px;font-weight:700;line-height:1.45;transition:background .15s,border-color .15s,opacity .15s,color .15s,transform .1s}.vocabulary-option:not(:disabled):hover{background:#f9fafb;border-color:#cbd5e1}.vocabulary-option:not(:disabled):active{transform:translateY(1px)}.vocabulary-option--selected{border-color:#334155}.vocabulary-option--selected.vocabulary-option--wrong{border-color:#ef4444}.vocabulary-option--correct{background:#dcfce7;border-color:#22c55e}.vocabulary-option--wrong,.vocabulary-option--wrong:not(:disabled):hover,.vocabulary-option--wrong:not(:disabled):active{background:#fee2e2;border-color:#ef4444}.vocabulary-option:disabled{cursor:default}.vocabulary-feedback{color:color-mix(in srgb, var(--text-h) 58%, transparent);margin:12px 0 0;font-size:13px;line-height:1.5}.vocabulary-secondary-btn{color:var(--text-h);font:inherit;cursor:pointer;background:#fff;border:1px solid #d1d5db;border-radius:8px;margin-top:14px;padding:10px 14px;font-size:14px;font-weight:700}.vocabulary-secondary-btn:hover{background:#f9fafb;border-color:#b8bec8}.vocabulary-lesson-nav{max-width:520px;margin:0 auto}.lesson-nav.vocabulary-lesson-nav--result,.lesson-nav.vocabulary-lesson-nav--retry,.lesson-nav.vocabulary-lesson-nav--word.vocabulary-lesson-nav--success,.lesson-nav.vocabulary-lesson-nav--word.vocabulary-lesson-nav--revealed{max-width:none;padding:22px 24px calc(22px + env(safe-area-inset-bottom,0px));box-shadow:none;border-radius:16px 16px 0 0;animation:.24s cubic-bezier(.2,.8,.2,1) both vocabulary-result-panel-in}.lesson-nav.vocabulary-lesson-nav--result{background:#4d88ff}.lesson-nav.vocabulary-lesson-nav--retry{background:#fef1f1}.lesson-nav.vocabulary-lesson-nav--word.vocabulary-lesson-nav--success{background:#22c55e}.lesson-nav.vocabulary-lesson-nav--word.vocabulary-lesson-nav--retry{background:#ef4444}.lesson-nav.vocabulary-lesson-nav--word.vocabulary-lesson-nav--revealed{background:#4d88ff}.vocabulary-lesson-nav--result .lesson-continue-control,.vocabulary-lesson-nav--retry .lesson-continue-control,.vocabulary-lesson-nav--word.vocabulary-lesson-nav--success .lesson-continue-control,.vocabulary-lesson-nav--word.vocabulary-lesson-nav--revealed .lesson-continue-control{gap:14px;width:min(360px,100vw - 64px)}.vocabulary-result-text{letter-spacing:-.03em;color:#fff;text-align:center;margin:0;font-size:18px;font-weight:800;line-height:1.2}.vocabulary-lesson-nav--retry .vocabulary-result-text{color:#dc2626}.vocabulary-lesson-nav--word.vocabulary-lesson-nav--retry .vocabulary-result-text,.vocabulary-lesson-nav--word.vocabulary-lesson-nav--revealed .vocabulary-result-text{color:#fff}.vocabulary-lesson-nav--word .lesson-icon-btn{border-radius:8px;min-width:min(280px,100vw - 48px);height:48px;min-height:48px}.vocabulary-intro-actions{grid-template-columns:minmax(86px,.38fr) minmax(0,1fr);gap:12px;width:min(360px,100vw - 48px);display:grid}.vocabulary-intro-actions .lesson-icon-btn{width:100%;min-width:0;padding-left:12px;padding-right:12px}.vocabulary-lesson-nav--word .vocabulary-intro-skip-btn,.vocabulary-lesson-nav--word .vocabulary-intro-skip-btn:not(:disabled):hover{--lesson-btn-shadow:#334155;color:var(--text-h);background:#fff;border-color:#334155}.vocabulary-lesson-nav--word .lesson-icon-btn--accent{--lesson-btn-shadow:#1e55c8;color:#fff;background:#4d88ff;border-color:#1e55c8}.vocabulary-lesson-nav--word .lesson-icon-btn--accent:not(:disabled):hover{color:#fff;background:#4d88ff;border-color:#1e55c8}.vocabulary-lesson-nav--word.vocabulary-lesson-nav--summary .lesson-icon-btn--accent,.vocabulary-lesson-nav--word.vocabulary-lesson-nav--summary .lesson-icon-btn--accent:not(:disabled):hover{--lesson-btn-shadow:#334155;color:var(--text-h);background:#fff;border-color:#334155}.vocabulary-lesson-nav--word.vocabulary-lesson-nav--success .lesson-icon-btn,.vocabulary-lesson-nav--word.vocabulary-lesson-nav--retry .lesson-icon-btn,.vocabulary-lesson-nav--word.vocabulary-lesson-nav--revealed .lesson-icon-btn{color:var(--text-h);background:#fff;border:0}.vocabulary-lesson-nav--word.vocabulary-lesson-nav--success .lesson-icon-btn:not(:disabled):hover,.vocabulary-lesson-nav--word.vocabulary-lesson-nav--retry .lesson-icon-btn:not(:disabled):hover,.vocabulary-lesson-nav--word.vocabulary-lesson-nav--revealed .lesson-icon-btn:not(:disabled):hover{color:var(--text-h);background:#fff;border-color:#0000}.vocabulary-lesson-nav--word.vocabulary-lesson-nav--success .lesson-icon-btn{--lesson-btn-shadow:#15803d}.vocabulary-lesson-nav--word.vocabulary-lesson-nav--retry .lesson-icon-btn{--lesson-btn-shadow:#b91c1c}.vocabulary-lesson-nav--word.vocabulary-lesson-nav--revealed .lesson-icon-btn{--lesson-btn-shadow:#1e55c8}.onboarding-page{box-sizing:border-box;flex:1;width:100%;max-width:520px;min-height:0;margin:0 auto;padding:0 18px;overflow:hidden}.onboarding-main{overscroll-behavior:contain;-webkit-overflow-scrolling:touch;height:100%;padding:18px 0 calc(110px + env(safe-area-inset-bottom,0px));box-sizing:border-box;scrollbar-width:none;overflow-y:auto}.onboarding-main::-webkit-scrollbar{display:none}.onboarding-step{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:28px;min-height:100%;display:flex}.onboarding-visual{justify-content:center;align-items:center;width:min(310px,78vw);min-height:min(310px,78vw);display:flex}.onboarding-lottie{width:100%;height:100%}.onboarding-image{object-fit:contain;-webkit-user-select:none;user-select:none;width:100%;max-height:min(420px,58vh);display:block}.onboarding-copy{letter-spacing:0;width:min(360px,86vw);color:var(--text-h);margin:0;font-size:22px;font-weight:800;line-height:1.35}.onboarding-nav{max-width:520px;margin:0 auto}.onboarding-next-btn{min-width:min(280px,100vw - 48px)}@media (width<=480px){.onboarding-step{gap:24px}.onboarding-visual{width:min(280px,76vw);min-height:min(280px,76vw)}.onboarding-copy{font-size:20px}}.lesson-nav.vocabulary-lesson-nav--word.vocabulary-lesson-nav--summary{max-width:none;padding:22px 24px calc(22px + env(safe-area-inset-bottom,0px));box-shadow:none;background:#4d88ff;border-radius:16px 16px 0 0;animation:.24s cubic-bezier(.2,.8,.2,1) both vocabulary-result-panel-in}.vocabulary-lesson-nav--word.vocabulary-lesson-nav--summary .vocabulary-summary-actions{box-sizing:border-box;grid-template-columns:minmax(86px,.38fr) minmax(0,1fr);width:100%;max-width:420px}.vocabulary-lesson-nav--word.vocabulary-lesson-nav--summary .vocabulary-summary-action-btn,.vocabulary-lesson-nav--word.vocabulary-lesson-nav--summary .lesson-icon-btn.vocabulary-summary-action-btn{flex-shrink:1;width:100%;min-width:0;max-width:100%;padding-left:12px;padding-right:12px}.vocabulary-lesson-nav--word.vocabulary-lesson-nav--summary .lesson-icon-btn.vocabulary-summary-action-btn,.vocabulary-lesson-nav--word.vocabulary-lesson-nav--summary .lesson-icon-btn--accent.vocabulary-summary-action-btn,.vocabulary-lesson-nav--word.vocabulary-lesson-nav--summary .lesson-icon-btn--accent.vocabulary-summary-action-btn:not(:disabled):hover{--lesson-btn-shadow:#1e55c8;color:var(--text-h);box-shadow:0 4px 0 var(--lesson-btn-shadow);background:#fff;border:0}.vocabulary-lesson-nav--word.vocabulary-lesson-nav--summary .lesson-icon-btn.vocabulary-summary-action-btn:not(:disabled):active{box-shadow:0 1px 0 var(--lesson-btn-shadow);transform:translateY(3px)}@keyframes vocabulary-result-panel-in{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}.grammar-lesson-page{color:var(--text-h)}.grammar-lesson-page .vocabulary-lesson-main{padding-top:10px;padding-bottom:calc(94px + env(safe-area-inset-bottom,0px));overflow:hidden}.grammar-lesson-page .vocabulary-intro-lottie{width:min(160px,42vw);height:min(160px,42vw)}.grammar-intro{width:100%}.grammar-intro-subtitle{max-width:360px;color:var(--text);margin:0;font-size:15px;line-height:1.6}.grammar-sentence-card{box-sizing:border-box;letter-spacing:-.03em;text-align:center;overflow-wrap:anywhere;background:0 0;border:0;border-radius:0;width:min(430px,100%);max-width:100%;margin:0 auto;padding:0 4px;font-size:16px;font-weight:700;line-height:1.55}.grammar-segment-card{box-sizing:border-box;flex-direction:column;justify-content:center;align-items:center;gap:14px;height:100%;min-height:0;padding:4px 0;display:flex;overflow:hidden}.grammar-progress-label{color:#4d88ff;margin:0;font-size:13px;font-weight:800}.grammar-segment-lottie{flex-shrink:0;width:min(140px,38vw);height:min(140px,38vw)}.grammar-subtitle-card{text-align:center;box-sizing:border-box;background:#4d88ff14;border-radius:22px;width:min(430px,100%);padding:18px}.grammar-subtitle-kicker{color:#4d88ff;margin:0 0 8px;font-size:13px;font-weight:800}.grammar-subtitle-text{color:var(--text-h);margin:0;font-size:15px;font-weight:600;line-height:1.6}.grammar-segment-actions{grid-template-columns:.46fr 1fr;gap:12px;width:min(360px,100vw - 48px);display:grid}.grammar-segment-actions .grammar-action-btn,.lesson-nav.grammar-lesson-nav--double .lesson-icon-btn{border-radius:8px;width:100%;min-width:0;height:48px;min-height:48px}.grammar-lesson-nav .lesson-icon-btn{border-radius:8px;height:48px;min-height:48px}.grammar-lesson-nav .lesson-icon-btn--accent{--lesson-btn-shadow:#1e55c8;color:#fff;box-shadow:0 4px 0 var(--lesson-btn-shadow);background:#4d88ff;border:2px solid #1e55c8}.grammar-lesson-nav .lesson-icon-btn--accent:not(:disabled):hover{color:#fff;background:#4d88ff;border-color:#1e55c8}.grammar-lesson-nav .lesson-icon-btn--accent:not(:disabled):active{box-shadow:0 1px 0 var(--lesson-btn-shadow);transform:translateY(3px)}.grammar-lesson-nav .grammar-action-btn--replay,.grammar-lesson-nav .grammar-action-btn--replay:not(:disabled):hover{--lesson-btn-shadow:#334155;color:var(--text-h);background:#fff;border-color:#334155}.grammar-exercise-card{padding-top:18px}.grammar-exercise-card .vocabulary-question-prompt{transform:translateY(-18px)}.grammar-exercise-title{letter-spacing:0;max-width:420px;margin:0;font-size:16px;line-height:1.25}.grammar-fill-sentence{box-sizing:border-box;overflow-wrap:anywhere;background:#4d88ff14;border-radius:16px;width:min(420px,100%);max-width:420px;margin:16px 0 0;padding:14px 16px;font-size:15px;font-weight:600;line-height:1.6}.grammar-answer-area{justify-content:center;display:flex}.grammar-ordering{box-sizing:border-box;flex-direction:column;gap:8px;width:min(430px,100%);max-width:100%;display:flex;transform:translateY(-50px)}.grammar-order-slots,.grammar-order-parts{flex-wrap:wrap;justify-content:flex-start;gap:5px;display:flex}.grammar-order-slots{box-sizing:border-box;background:0 0;border:0;border-radius:18px;align-content:center;align-items:center;height:124px;max-height:124px;padding:10px;overflow:hidden;transform:translateY(-36px)}.grammar-order-placeholder{color:color-mix(in srgb, var(--text-h) 46%, transparent);font-size:14px;font-weight:700}.grammar-order-chip{min-height:40px;color:var(--text-h);font:inherit;box-shadow:none;cursor:pointer;background:#fff;border:2px solid #e2e8f0;border-radius:8px;padding:0 12px;font-size:13px;font-weight:800}.grammar-order-chip--selected{min-height:40px;box-shadow:none;background:#eef5ff;border-color:#4d88ff;border-radius:8px;padding:0 12px}.grammar-order-chip:disabled{opacity:1;cursor:default}.lesson-nav.grammar-lesson-nav--success,.lesson-nav.grammar-lesson-nav--retry{max-width:none;padding:22px 24px calc(22px + env(safe-area-inset-bottom,0px));box-shadow:none;border-radius:16px 16px 0 0;animation:.24s cubic-bezier(.2,.8,.2,1) both vocabulary-result-panel-in}.lesson-nav.grammar-lesson-nav--success{background:#22c55e}.lesson-nav.grammar-lesson-nav--retry{background:#ef4444}.grammar-lesson-nav--success .lesson-continue-control,.grammar-lesson-nav--retry .lesson-continue-control{gap:14px;width:min(360px,100vw - 64px)}.grammar-lesson-nav--success .vocabulary-result-text,.grammar-lesson-nav--retry .vocabulary-result-text{color:#fff}.grammar-lesson-nav--success .lesson-icon-btn,.grammar-lesson-nav--retry .lesson-icon-btn{color:var(--text-h);background:#fff;border:0}.grammar-lesson-nav--success .lesson-icon-btn{--lesson-btn-shadow:#15803d}.grammar-lesson-nav--retry .lesson-icon-btn{--lesson-btn-shadow:#b91c1c}.grammar-lesson-nav--success .lesson-icon-btn--accent:not(:disabled):hover,.grammar-lesson-nav--retry .lesson-icon-btn--accent:not(:disabled):hover{color:var(--text-h);background:#fff;border-color:#0000}.grammar-complete{width:100%}.lesson-ai-btn-row{right:18px;bottom:calc(92px + env(safe-area-inset-bottom,0px));z-index:80;padding:0;position:fixed}.lesson-nav{z-index:70;padding:14px 24px calc(18px + env(safe-area-inset-bottom,0px));pointer-events:none;background:linear-gradient(#fff0,#fffffffa 28%);justify-content:center;align-items:center;gap:14px;display:flex;position:fixed;bottom:0;left:0;right:0}.lesson-nav>*{pointer-events:auto}.lesson-record-control,.lesson-continue-control{pointer-events:auto;flex-direction:column;align-items:center;gap:8px;display:flex}.lesson-record-hint{color:var(--text-h);margin:0;font-size:13px;font-weight:600;line-height:1.3}.lesson-record-hint--error{color:#dc2626}.lesson-record-hint--success{color:#16a34a}.lesson-icon-btn--success{--lesson-btn-shadow:#86efac;color:#16a34a;border-color:#86efac}.lesson-icon-btn--success:not(:disabled):hover{background:#f0fdf4;border-color:#4ade80}.lesson-icon-btn.immersive-continue-btn,.lesson-icon-btn.immersive-continue-btn.lesson-icon-btn--success,.lesson-icon-btn.immersive-speak-btn{--lesson-btn-shadow:#1e55c8;color:#fff;height:48px;min-height:48px;box-shadow:0 4px 0 var(--lesson-btn-shadow);background:#4d88ff;border:2px solid #1e55c8;border-radius:8px}.lesson-icon-btn.immersive-continue-btn:not(:disabled):hover,.lesson-icon-btn.immersive-continue-btn.lesson-icon-btn--success:not(:disabled):hover,.lesson-icon-btn.immersive-speak-btn:not(:disabled):hover{color:#fff;background:#4d88ff;border-color:#1e55c8}.lesson-icon-btn.immersive-continue-btn:not(:disabled):active,.lesson-icon-btn.immersive-speak-btn:not(:disabled):active{box-shadow:0 1px 0 var(--lesson-btn-shadow);transform:translateY(3px)}.lesson-icon-btn.immersive-speak-btn{gap:8px;min-width:min(280px,100vw - 48px)}.immersive-speak-actions{justify-content:center;align-items:center;gap:10px;width:min(360px,100vw - 48px);display:flex}.lesson-icon-btn.immersive-skip-speak-btn{--lesson-btn-shadow:#cbd5e1;color:#64748b;min-width:104px;height:48px;min-height:48px;box-shadow:0 4px 0 var(--lesson-btn-shadow);background:#fff;border:2px solid #cbd5e1;border-radius:8px;padding:0 14px}.lesson-icon-btn.immersive-skip-speak-btn:not(:disabled):hover{color:#475569;background:#fff;border-color:#94a3b8}.lesson-icon-btn.immersive-skip-speak-btn:not(:disabled):active{box-shadow:0 1px 0 var(--lesson-btn-shadow);transform:translateY(3px)}.immersive-speak-actions .immersive-speak-btn{flex:1;min-width:0}.lesson-icon-btn.immersive-recording-btn,.lesson-icon-btn.immersive-transcribing-btn{min-width:min(280px,100vw - 48px);height:48px;min-height:48px;box-shadow:0 4px 0 var(--lesson-btn-shadow);border-radius:8px;gap:8px}.lesson-icon-btn.immersive-recording-btn{--lesson-btn-shadow:#b91c1c;color:#fff;background:#ef4444;border:2px solid #b91c1c}.recording-waveform{justify-content:flex-end;align-items:center;gap:3px;width:168px;height:28px;display:inline-flex;overflow:hidden}.recording-waveform-bar{opacity:.92;transform-origin:50%;background:#fff;border-radius:999px;width:3px;min-width:3px;transition:height 80ms linear}.lesson-icon-btn.immersive-recording-btn:not(:disabled):hover{color:#fff;background:#ef4444;border-color:#b91c1c}.lesson-icon-btn.immersive-recording-btn:not(:disabled):active{box-shadow:0 1px 0 var(--lesson-btn-shadow);transform:translateY(3px)}.lesson-icon-btn.immersive-transcribing-btn,.lesson-icon-btn.immersive-transcribing-btn:disabled{--lesson-btn-shadow:#334155;color:var(--text-h);opacity:1;box-shadow:0 4px 0 var(--lesson-btn-shadow);background:#fff;border:2px solid #334155}.lesson-nav.immersive-feedback-sheet{max-width:none;padding:22px 24px calc(22px + env(safe-area-inset-bottom,0px));box-shadow:none;background:#4d88ff;border-radius:16px 16px 0 0;animation:.24s cubic-bezier(.2,.8,.2,1) both vocabulary-result-panel-in}.lesson-nav.immersive-feedback-sheet--success{background:#22c55e}.lesson-nav.immersive-feedback-sheet--retry{background:#ef4444}.lesson-nav.immersive-feedback-sheet--revealed{background:#4d88ff}.immersive-feedback-sheet .lesson-continue-control{gap:14px;width:min(360px,100vw - 64px)}.immersive-feedback-text{color:#fff;letter-spacing:-.03em;text-align:center;margin:0;font-size:18px;font-weight:800;line-height:1.2}.immersive-feedback-sheet .lesson-icon-btn.immersive-continue-btn,.immersive-feedback-sheet .lesson-icon-btn.immersive-continue-btn.lesson-icon-btn--success,.immersive-feedback-sheet .lesson-icon-btn.immersive-speak-btn,.immersive-feedback-sheet .lesson-icon-btn.immersive-skip-speak-btn{color:var(--text-h);background:#fff;border:0}.immersive-feedback-sheet--success .lesson-icon-btn.immersive-continue-btn,.immersive-feedback-sheet--success .lesson-icon-btn.immersive-speak-btn{--lesson-btn-shadow:#15803d}.immersive-feedback-sheet--retry .lesson-icon-btn.immersive-continue-btn,.immersive-feedback-sheet--retry .lesson-icon-btn.immersive-speak-btn,.immersive-feedback-sheet--retry .lesson-icon-btn.immersive-skip-speak-btn{--lesson-btn-shadow:#b91c1c}.immersive-feedback-sheet--revealed .lesson-icon-btn.immersive-continue-btn,.immersive-feedback-sheet--revealed .lesson-icon-btn.immersive-speak-btn{--lesson-btn-shadow:#1e55c8}.immersive-feedback-sheet .lesson-icon-btn.immersive-continue-btn:not(:disabled):hover,.immersive-feedback-sheet .lesson-icon-btn.immersive-continue-btn.lesson-icon-btn--success:not(:disabled):hover,.immersive-feedback-sheet .lesson-icon-btn.immersive-speak-btn:not(:disabled):hover,.immersive-feedback-sheet .lesson-icon-btn.immersive-skip-speak-btn:not(:disabled):hover{color:var(--text-h);background:#fff;border-color:#0000}.ai-float-panel{bottom:calc(156px + env(safe-area-inset-bottom,0px))}@media (width<=480px){.episode-lesson{max-width:none;padding-left:18px;padding-right:18px}.lesson-flow{gap:20px;padding-top:12px}.lesson-message--speech{grid-template-columns:32px minmax(0,1fr);gap:8px}.lesson-message-avatar{width:32px;height:32px}.lesson-message .lesson-bubble{border-radius:16px;padding:11px 13px}.lesson-narration{padding-left:4px;padding-right:4px}.lesson-bubble-text{font-size:15.5px;line-height:1.75}.lesson-replay-btn{vertical-align:-4px;width:20px;height:20px;margin-right:7px}}.level-list{flex-direction:column;gap:12px;display:flex}.level-card{border:1px solid var(--border);background:color-mix(in srgb, var(--bg) 94%, var(--code-bg));border-radius:14px;padding:16px 18px;transition:border-color .2s,box-shadow .2s}.level-card--current{border-color:var(--accent-border);background:var(--accent-bg);box-shadow:0 4px 20px color-mix(in srgb, var(--accent) 12%, transparent);border-width:2px}.level-card-header{flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:8px;display:flex}.level-card-label{color:var(--text-h);letter-spacing:-.2px;flex-shrink:0;font-size:16px;font-weight:700}.level-cefr-badge{letter-spacing:.03em;border:1px solid;border-radius:20px;flex-shrink:0;padding:2px 8px;font-size:11px;font-weight:700}.level-current-tag{color:var(--accent);background:color-mix(in srgb, var(--accent) 12%, transparent);border-radius:20px;flex-shrink:0;align-items:center;gap:3px;padding:2px 8px;font-size:12px;font-weight:600;display:inline-flex}.level-vocab{color:var(--text);opacity:.65;white-space:nowrap;flex-shrink:0;margin-left:auto;font-size:12px}.level-speaking{color:var(--text);margin:0 0 4px;font-size:14px;line-height:1.6}.level-card--current .level-speaking{color:color-mix(in srgb, var(--text-h) 80%, var(--accent))}.level-detail-grid{border-top:1px solid var(--accent-border);flex-direction:column;gap:10px;margin-top:12px;padding-top:12px;display:flex}.level-detail-item{flex-direction:column;gap:3px;display:flex}.level-detail-label{text-transform:uppercase;letter-spacing:.08em;color:var(--accent);opacity:.8;font-size:11px;font-weight:600}.level-detail-value{color:var(--text-h);font-size:13px;line-height:1.55}.discover-page--exhausted{justify-content:center;align-items:center;display:flex}.discover-empty{z-index:1;text-align:center;max-width:320px;color:var(--text-h);padding:32px 24px;position:relative}.discover-empty-emoji{margin-bottom:16px;font-size:56px;line-height:1}.discover-empty-title{margin:0 0 12px;font-size:20px;font-weight:700;line-height:1.4}.discover-empty-desc{color:var(--text);opacity:.85;margin:0 0 24px;font-size:14px;line-height:1.6}.discover-empty-btn{appearance:none;background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:999px;padding:12px 32px;font-size:15px;font-weight:600;transition:transform .15s,opacity .15s}.discover-empty-btn:hover{opacity:.9}.discover-empty-btn:active{transform:translateY(1px)}.home-empty{text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;min-height:50vh;padding:32px 24px;display:flex}.home-empty-emoji{margin-bottom:16px;font-size:56px;line-height:1}.home-empty-title{color:var(--text-h);margin:0 0 12px;font-size:20px;font-weight:700;line-height:1.4}.home-empty-desc{color:var(--text);opacity:.85;max-width:300px;margin:0 0 24px;font-size:14px;line-height:1.6}.home-empty-btn{appearance:none;background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:999px;padding:12px 32px;font-size:15px;font-weight:600}.home-empty-btn:active{transform:translateY(1px)}.lp-root{isolation:isolate;width:100%;min-height:100dvh;padding:0 16px calc(var(--lp-dot-v,96px) * 2);box-sizing:border-box;flex-direction:column;flex-shrink:0;align-items:center;gap:0;display:flex;position:relative;overflow-x:clip}.lp-root:before{content:"";z-index:0;pointer-events:none;background-image:radial-gradient(circle,#e2e8f0 4px,#0000 4px);background-size:var(--lp-dot-h,80px) var(--lp-dot-v,96px);background-position:50% 0;background-repeat:repeat;position:absolute;inset:0}@media (width<=480px){.lp-root{padding:0 0 calc(var(--lp-dot-v,80px) * 2)}}.lp-story-card{top:calc(env(safe-area-inset-top,0px) + 74px);z-index:11;box-sizing:border-box;background:#e2e8f0;border-radius:16px;flex-direction:column;gap:10px;width:min(420px,100%);margin:0 auto;padding:8px;display:flex;position:sticky}.lp-story-head{justify-content:space-between;align-items:center;padding:2px 6px 0;display:flex}.lp-story-eyebrow{color:#fff;letter-spacing:-.01em;font-size:15px;font-weight:800}.lp-story-link{color:#fff;font:inherit;cursor:pointer;background:#ffffff2e;border:0;border-radius:999px;align-items:center;gap:6px;padding:6px 12px;font-size:12px;font-weight:800;transition:background .12s;display:inline-flex}.lp-story-link:hover{background:#ffffff47}.lp-story-link svg{flex-shrink:0}.lp-story-inner{box-sizing:border-box;cursor:pointer;background:#fff;border:0;border-radius:8px;grid-template-columns:72px minmax(0,1fr) 44px;align-items:start;gap:12px;width:100%;padding:8px;display:grid}.lp-story-cover{aspect-ratio:3/4;background-color:#f1f5f9;background-position:50%;background-repeat:no-repeat;background-size:cover;border-radius:6px;width:72px}.lp-story-copy{text-align:left;min-width:0;padding-top:6px}.lp-story-copy h2{color:#0f172a;letter-spacing:-.01em;margin:0;font-size:17px;font-weight:800;line-height:1.2}.lp-story-copy p{color:#475569;-webkit-line-clamp:3;-webkit-box-orient:vertical;margin:4px 0 0;font-size:12px;line-height:1.5;display:-webkit-box;overflow:hidden}.lp-story-more{color:#64748b;border-left:2px solid #e2e8f0;justify-content:center;align-self:stretch;align-items:center;display:flex}.lp-loading{width:100%;min-height:100dvh;padding:0 16px calc(var(--lp-dot-v,96px) * 2);box-sizing:border-box;flex-direction:column;justify-content:center;align-items:center;gap:12px;display:flex}.lp-loading-spinner{border:3px solid #4d88ff29;border-top-color:var(--color-brand-500);border-radius:999px;width:32px;height:32px;animation:.8s linear infinite lp-loading-spin}.lp-loading-text{color:var(--text);font-size:14px;font-weight:600}@keyframes lp-loading-spin{to{transform:rotate(360deg)}}.lp-map{z-index:1;margin:0 auto;position:relative}.lp-map-lines{pointer-events:none;z-index:1;position:absolute;inset:0}.lp-map-lines path{fill:none;stroke:#e2e8f0;stroke-width:4px;stroke-linecap:round;stroke-linejoin:round}.lp-map-node{z-index:2;font:inherit;cursor:pointer;background:0 0;border:0;padding:0;transition:transform .12s;position:absolute;transform:translate(-50%,-50%)}.lp-map-node:disabled{cursor:default}.lp-map-node:not(:disabled):hover{transform:translate(-50%,calc(-50% - 2px))}.lp-map-node:not(:disabled):active{transform:translate(-50%,-50%)}.lp-path-node,.lp-path-node-current{--path-node-bg:#4d88ff;--path-node-shadow:#1e55c8;--path-node-ring:#4d88ff}.lp-path-node{--path-node-size:70px;--path-node-depth:7px;width:var(--path-node-size);height:calc(var(--path-node-size) - var(--path-node-depth));border:2px solid var(--path-node-shadow);background:var(--path-node-bg);color:#fff;box-shadow:0 var(--path-node-depth) 0 var(--path-node-shadow);box-sizing:border-box;border-radius:8px;justify-content:center;align-items:center;padding:0;display:inline-flex}.lp-path-node-face{border-radius:6px;justify-content:center;align-items:center;width:100%;height:100%;display:inline-flex}.lp-path-node-face svg{color:#fff;display:block}.lp-path-node-current{border:4px solid var(--path-node-ring);padding:6px;padding-bottom:calc(6px + var(--path-node-depth,7px));transform-origin:50%;background:#fff;border-radius:16px;animation:1.8s ease-in-out infinite lp-current-ring-breathe;display:inline-flex}.lp-path-node-current .lp-path-node{--path-node-size:64px;--path-node-depth:6px}@keyframes lp-current-ring-breathe{0%,to{opacity:1;transform:scale(1)}50%{opacity:.72;transform:scale(1.06)}}.lp-path-node--chapter,.lp-path-node-current--chapter{--path-node-bg:#4d88ff;--path-node-shadow:#1e55c8;--path-node-ring:#4d88ff}.lp-path-node--grammar,.lp-path-node-current--grammar{--path-node-bg:#ffd400;--path-node-shadow:#b89300;--path-node-ring:#ffd400}.lp-path-node--locked{--path-node-bg:#94a3b8;--path-node-shadow:#475569}@media (width<=480px){.lp-path-node{--path-node-size:52px;--path-node-depth:5px}.lp-path-node-current{padding:4px;padding-bottom:calc(4px + var(--path-node-depth,5px));border-width:3px;border-radius:12px}.lp-path-node-current .lp-path-node{--path-node-size:46px;--path-node-depth:4px}.lp-story-card{border-radius:0;width:100%;top:0}}.lp-overlay{z-index:100;background:#0f172a7a;justify-content:center;align-items:center;padding:24px;animation:.15s lp-overlay-fade;display:flex;position:fixed;inset:0}.lp-overlay-popup{width:min(320px,100%);animation:.18s cubic-bezier(.22,.61,.36,1) lp-overlay-pop}@keyframes lp-overlay-fade{0%{opacity:0}to{opacity:1}}@keyframes lp-overlay-pop{0%{opacity:0;transform:translateY(8px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}.lp-node-popup{color:#fff;border-radius:16px;flex-direction:column;min-height:220px;padding:22px 22px 20px;display:flex;position:relative;overflow:hidden}.lp-node-popup-bg{aspect-ratio:1;z-index:0;pointer-events:none;opacity:.1;width:min(248px,92%);position:absolute;top:-52px;right:-52px}.lp-node-popup-lottie{object-fit:contain;object-position:top right;width:100%;height:100%;display:block}.lp-node-popup-foreground{z-index:1;flex-direction:column;flex:1;gap:8px;min-height:0;display:flex;position:relative}.lp-node-popup h4{letter-spacing:-.02em;margin:0;font-size:22px;font-weight:800;line-height:1.15}.lp-node-popup-desc{opacity:.92;flex:1;margin:0;font-size:14px;line-height:1.5}.lp-node-popup-actions{gap:10px;margin-top:16px;display:flex}.lp-node-popup-cta{color:#0f172a;min-height:44px;font:inherit;cursor:pointer;background:#fff;border:0;border-radius:8px;flex:1;padding:0 16px;font-size:14px;font-weight:800;transition:transform .1s,box-shadow .1s}.lp-node-popup-cta:active{transform:translateY(3px)}.lp-node-popup-actions--two .lp-node-popup-cta:first-child{flex:1}.lp-node-popup-actions--two .lp-node-popup-cta:last-child{flex:2}.lp-node-popup--chapter{background:#4d88ff}.lp-node-popup--chapter .lp-node-popup-cta{box-shadow:0 4px #1e55c8}.lp-node-popup--chapter .lp-node-popup-cta:active{box-shadow:0 1px #1e55c8}.lp-node-popup--grammar{color:#0f172a;background:#ffd400}.lp-node-popup--grammar .lp-node-popup-desc{opacity:.85}.lp-node-popup--grammar .lp-node-popup-cta{box-shadow:0 4px #b89300}.lp-node-popup--grammar .lp-node-popup-cta:active{box-shadow:0 1px #b89300}.landing-page{height:var(--app-viewport-height);color:var(--text-h);background:#fff;position:fixed;top:0;left:0;right:0;overflow:hidden}.landing-bg{box-sizing:border-box;pointer-events:none;grid-template-columns:repeat(3,1fr);gap:12px;display:grid;position:absolute;inset:0 -6%}.landing-col{will-change:transform;flex-direction:column;gap:14px;display:flex}.landing-col--up{animation:linear infinite landing-scroll-up}.landing-col--down{animation:linear infinite landing-scroll-down}.landing-col:nth-child(2){transform:translateY(-7%)}@keyframes landing-scroll-up{0%{transform:translateY(0)}to{transform:translateY(-50%)}}@keyframes landing-scroll-down{0%{transform:translateY(-50%)}to{transform:translateY(0)}}.landing-tile{aspect-ratio:3/4;background:#f4f3f7;border-radius:4px;flex:none;width:100%;position:relative;overflow:hidden;box-shadow:0 6px 18px #08060d14}.landing-tile img{object-fit:cover;width:100%;height:100%;display:block}@media (prefers-reduced-motion:reduce){.landing-col--up,.landing-col--down{animation:none}}.landing-fade{pointer-events:none;background:linear-gradient(#fff0 0% 8%,#ffffff59 28%,#fffc 48%,#fff 65% 100%);position:absolute;inset:0}.landing-content{z-index:1;min-height:var(--app-viewport-height);padding:calc(48px + env(safe-area-inset-top,0px)) 28px calc(8vh + env(safe-area-inset-bottom));box-sizing:border-box;flex-direction:column;justify-content:flex-end;align-items:center;gap:90px;display:flex;position:relative}.landing-hero{text-align:center;flex-direction:column;align-items:center;gap:28px;display:flex}.landing-logo-img{filter:drop-shadow(0 6px 16px #08060d1f);width:140px;height:auto;display:block}.landing-slogan{letter-spacing:.5px;color:var(--text-h);margin:0;font-size:20px;font-weight:600}.landing-start-btn{box-sizing:border-box;color:#fff;letter-spacing:.02em;cursor:pointer;touch-action:manipulation;-webkit-user-select:none;user-select:none;background:#4d88ff;border:2px solid #1e55c8;border-radius:8px;width:100%;max-width:320px;min-height:48px;padding:0 20px;font-family:inherit;font-size:16px;font-weight:700;transition:background .12s,border-color .12s,box-shadow .1s,transform .1s;box-shadow:0 4px #1e55c8}.landing-start-btn:hover{background:#4d88ff;border-color:#1e55c8}.landing-start-btn:active{transform:translateY(1px);box-shadow:0 1px #1e55c8}.auth-page{height:var(--app-viewport-height);background:#fff;flex-direction:column;padding:0;display:flex;position:fixed;top:0;left:0;right:0;overflow:hidden}.auth-page-scroll{overscroll-behavior:contain;-webkit-overflow-scrolling:touch;min-height:0;padding:calc(56px + env(safe-area-inset-top,0px)) 28px calc(24px + env(safe-area-inset-bottom,0px));box-sizing:border-box;flex-direction:column;flex:1;display:flex;overflow-y:auto}.auth-top-bar{z-index:4;box-sizing:border-box;padding:calc(env(safe-area-inset-top,0px) + 10px) 12px 10px;background:#fff;align-items:center;gap:8px;display:flex;position:fixed;top:0;left:0;right:0}.auth-top-bar-spacer{flex-shrink:0;width:36px;height:36px}.auth-footer-bar{background:#fff;flex-direction:column;flex-shrink:0;align-items:stretch;width:100%;max-width:360px;margin-top:auto;margin-left:auto;margin-right:auto;padding:16px 0 0;display:flex}.auth-footer-bar-inner{flex-direction:column;gap:12px;width:100%;max-width:360px;display:flex}.auth-footer-bar-inner .auth-submit{width:100%;margin-top:0}.auth-mode-switch{box-sizing:border-box;width:100%;min-height:52px;color:var(--text-h);letter-spacing:.02em;cursor:pointer;touch-action:manipulation;-webkit-user-select:none;user-select:none;background:#fff;border:2px solid #334155;border-radius:8px;padding:0 16px;font-family:inherit;font-size:16px;font-weight:700;transition:background .12s,border-color .12s,box-shadow .1s,transform .1s,opacity .12s;box-shadow:0 4px #334155}.auth-mode-switch:hover:not(:disabled){background:#fff;border-color:#334155}.auth-mode-switch:active:not(:disabled){transform:translateY(1px);box-shadow:0 1px #334155}.auth-mode-switch:disabled{opacity:.55;cursor:not-allowed;transform:none}.auth-back{width:36px;height:36px;color:var(--text-h);cursor:pointer;background:#0000000a;border:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;display:flex}.auth-back:hover{background:#00000014}.auth-container{flex-direction:column;gap:28px;width:100%;max-width:360px;margin:16px auto 0;display:flex}.auth-page-heading{letter-spacing:.02em;min-width:0;color:var(--text-h);text-align:center;flex:1;margin:0;font-size:17px;font-weight:700;line-height:36px}.auth-form{flex-direction:column;gap:24px;display:flex}.auth-field{display:block}.auth-input-wrap{box-sizing:border-box;background:#fff;border:2px solid #94a3b8;border-radius:8px;align-items:center;gap:8px;min-height:52px;padding:0 12px 0 14px;transition:border-color .2s;display:flex;position:relative}.auth-input-wrap:focus-within{border-color:#64748b}.auth-label{z-index:1;color:#94a3b8;letter-spacing:.2px;background:#fff;margin:0;padding:0 6px;font-size:12px;font-weight:700;line-height:1.2;position:absolute;top:0;left:14px;transform:translateY(-50%)}.auth-page input,.auth-page textarea,.auth-page select{font-size:16px}.auth-input{min-width:0;min-height:24px;color:var(--text-h);background:0 0;border:none;outline:none;flex:1;padding:14px 0;font-family:inherit;font-size:16px}.auth-input::placeholder{color:#6b637599}.auth-eye-btn{color:var(--text);cursor:pointer;background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;padding:4px;display:flex}.auth-row{justify-content:space-between;align-items:center;padding:2px 4px 0;font-size:13px;display:flex}.auth-checkbox{color:var(--text);cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:8px;display:flex}.auth-checkbox input{accent-color:#08060d;width:16px;height:16px}.auth-link{color:var(--text-h);text-underline-offset:3px;font-weight:500;-webkit-text-decoration:underline #08060d4d;text-decoration:underline #08060d4d}.auth-link:hover{-webkit-text-decoration-color:var(--text-h);text-decoration-color:var(--text-h)}.auth-submit{box-sizing:border-box;color:#fff;letter-spacing:.02em;cursor:pointer;touch-action:manipulation;-webkit-user-select:none;user-select:none;background:#4d88ff;border:2px solid #1e55c8;border-radius:8px;height:52px;margin-top:8px;font-size:16px;font-weight:700;transition:background .12s,border-color .12s,box-shadow .1s,transform .1s,opacity .12s;box-shadow:0 4px #1e55c8}.auth-submit:hover:not(:disabled){background:#4d88ff;border-color:#1e55c8}.auth-submit:active:not(:disabled){transform:translateY(1px);box-shadow:0 1px #1e55c8}.auth-submit:disabled{opacity:.55;cursor:not-allowed;transform:none}.auth-error{color:#d9375a;text-align:center;margin:4px 2px 0;font-size:13px;line-height:1.4}.auth-footer{text-align:center;color:var(--text);opacity:.8;margin-top:4px;font-size:12px;line-height:1.6}.dt-page{--dt-bg:#fff;--dt-canvas:#fafafa;--dt-text:#0f172a;--dt-text-muted:#475569;--dt-text-faint:#64748b;--dt-border:#e5e7eb;--dt-border-strong:#d4d4d8;--dt-accent:#4d88ff;--dt-mono:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;background:var(--dt-bg);min-height:100dvh;color:var(--dt-text-muted);grid-template-columns:240px minmax(0,1fr);gap:0;font-size:14px;line-height:1.6;display:grid}.dt-sidebar{border-right:1px solid var(--dt-border);background:var(--dt-bg);scrollbar-width:thin;align-self:start;height:100dvh;position:sticky;top:0;overflow-y:auto}.dt-sidebar-inner{flex-direction:column;gap:28px;padding:28px 20px;display:flex}.dt-sidebar-brand{color:var(--dt-text);flex-direction:column;gap:4px;text-decoration:none;display:flex}.dt-sidebar-eyebrow{letter-spacing:.14em;text-transform:uppercase;color:var(--dt-accent);font-size:11px;font-weight:700}.dt-sidebar-title{letter-spacing:-.01em;font-size:16px;font-weight:700}.dt-sidebar-nav{flex-direction:column;gap:22px;display:flex}.dt-sidebar-group{flex-direction:column;gap:6px;display:flex}.dt-sidebar-group-title{color:var(--dt-text-faint);letter-spacing:.12em;text-transform:uppercase;margin:0;padding:0 6px;font-size:11px;font-weight:700}.dt-sidebar-group ul{flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.dt-sidebar-group a{color:var(--dt-text-muted);border-radius:6px;padding:6px 8px 6px 14px;font-size:13px;font-weight:500;text-decoration:none;transition:background .12s,color .12s;display:block;position:relative}.dt-sidebar-group a:before{content:"";background:0 0;border-radius:2px;width:2px;height:14px;transition:background .12s;position:absolute;top:50%;left:4px;transform:translateY(-50%)}.dt-sidebar-group a:hover{color:var(--dt-text);background:#f4f4f5}.dt-sidebar-group a.is-active{color:var(--dt-accent);background:#4d88ff14;font-weight:600}.dt-sidebar-group a.is-active:before{background:var(--dt-accent)}@media (width<=768px){.dt-sidebar-group a:before{display:none}.dt-sidebar-group a{padding-left:8px}}.dt-content{box-sizing:border-box;flex-direction:column;gap:56px;min-width:0;max-width:960px;padding:56px 56px 96px;display:flex}.dt-intro{border-bottom:1px solid var(--dt-border);flex-direction:column;gap:16px;padding-bottom:32px;display:flex}.dt-eyebrow{color:var(--dt-text-faint);letter-spacing:.04em;align-items:center;gap:10px;margin:0;font-size:12px;font-weight:600;display:inline-flex}.dt-eyebrow-index{min-width:28px;height:20px;color:var(--dt-text);font-family:var(--dt-mono);letter-spacing:0;background:#f4f4f5;border-radius:4px;justify-content:center;align-items:center;padding:0 6px;font-size:11px;font-weight:600;display:inline-flex}.dt-intro h1{color:var(--dt-text);letter-spacing:-.02em;margin:0;font-size:40px;font-weight:700;line-height:1.1}.dt-intro-lead{max-width:64ch;color:var(--dt-text-muted);margin:0;font-size:16px;line-height:1.7}.dt-intro-lead code{color:var(--dt-text);background:#f4f4f5;border-radius:4px;padding:1px 6px;font-size:14px}.dt-intro-meta{border-top:1px solid var(--dt-border);grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;margin:12px 0 0;padding:16px 0;display:grid}.dt-intro-meta>div{flex-direction:column;gap:4px;display:flex}.dt-intro-meta dt{letter-spacing:.08em;text-transform:uppercase;color:var(--dt-text-faint);font-size:11px;font-weight:600}.dt-intro-meta dd{color:var(--dt-text);margin:0;font-size:13px}.dt-intro-meta code{font-family:var(--dt-mono);color:var(--dt-text);background:0 0;padding:0;font-size:12px}.dt-section{flex-direction:column;gap:24px;scroll-margin-top:24px;display:flex}.dt-section+.dt-section{border-top:1px solid var(--dt-border);padding-top:56px}.dt-sec-head{flex-direction:column;gap:10px;display:flex}.dt-sec-head h2{color:var(--dt-text);letter-spacing:-.02em;margin:0;font-size:26px;font-weight:700;line-height:1.2}.dt-sec-desc{max-width:64ch;color:var(--dt-text-muted);margin:0;font-size:15px;line-height:1.65}.dt-block{flex-direction:column;gap:12px;display:flex}.dt-block-title{color:var(--dt-text);letter-spacing:-.005em;margin:16px 0 0;font-size:15px;font-weight:600}.dt-block-desc{max-width:64ch;color:var(--dt-text-muted);margin:0 0 4px;font-size:14px;line-height:1.65}.dt-table-wrap{border:1px solid var(--dt-border);background:var(--dt-bg);border-radius:8px;overflow:hidden}.dt-table{border-collapse:collapse;width:100%;font-size:13px}.dt-col-swatch{width:56px}.dt-col-name{width:32%}.dt-col-value{width:28%}.dt-col-usage{width:auto}.dt-table thead th{border-bottom:1px solid var(--dt-border);color:var(--dt-text-faint);letter-spacing:.08em;text-transform:uppercase;text-align:left;background:#fafafa;padding:10px 14px;font-size:11px;font-weight:600}.dt-table tbody tr+tr{border-top:1px solid var(--dt-border)}.dt-table tbody tr:hover{background:#fafafa}.dt-table tbody td{vertical-align:middle;color:var(--dt-text-muted);padding:12px 14px}.dt-table tbody td:first-child{padding-right:8px}.dt-table code{color:var(--dt-text);font-family:var(--dt-mono);background:#f4f4f5;border-radius:4px;padding:2px 6px;font-size:12px;display:inline-block}.dt-table .dt-mono{font-family:var(--dt-mono);color:var(--dt-text);word-break:break-all;font-size:12px}.dt-swatch-dot{border:1px solid #0f172a14;border-radius:6px;width:28px;height:28px;display:block;box-shadow:inset 0 0 0 1px #fff6}.dt-palette-board{grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px;display:grid}.dt-palette-column{border:1px solid var(--dt-border);border-radius:8px;flex-direction:column;display:flex;overflow:hidden}.dt-palette-title{border-bottom:1px solid var(--dt-border);color:var(--dt-text);letter-spacing:.1em;text-transform:uppercase;background:#fafafa;padding:10px 12px;font-size:11px;font-weight:700}.dt-palette-step{color:#0f172a;box-sizing:border-box;justify-content:space-between;align-items:center;gap:8px;min-height:44px;padding:8px 12px;font-size:12px;display:flex}.dt-palette-step--dark{color:#fff}.dt-palette-step span{font-family:var(--dt-mono);font-weight:600}.dt-palette-step strong{font-family:var(--dt-mono);opacity:.85;font-size:11px;font-weight:500}.dt-brand-usage{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;display:grid}.dt-brand-card{box-sizing:border-box;border-radius:12px;flex-direction:column;gap:10px;min-height:170px;padding:20px;display:flex}.dt-brand-card span{letter-spacing:.1em;text-transform:uppercase;font-size:11px;font-weight:700}.dt-brand-card strong{letter-spacing:-.02em;margin-top:auto;font-size:20px;font-weight:700;line-height:1.1}.dt-brand-card p{margin:0;font-size:13px;line-height:1.55}.dt-brand-card--primary{color:#fff;background:#4d88ff}.dt-brand-card--primary span,.dt-brand-card--primary p{color:#ffffffd1}.dt-brand-card--soft{color:#10285c;background:#eef5ff;border:1px solid #4d88ff29}.dt-brand-card--soft span,.dt-brand-card--soft p{color:#10285ca6}.dt-brand-card--outline{color:#1e55c8;background:#fff;border:2px solid #4d88ff80}.dt-brand-card--outline span,.dt-brand-card--outline p{color:#1e55c8b3}.dt-path-matrix{border:1px solid var(--dt-border);background:var(--dt-bg);border-radius:8px;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;padding:24px;display:grid}.dt-path-matrix-col{flex-direction:column;align-items:center;gap:20px;display:flex}.dt-path-matrix-col+.dt-path-matrix-col{border-left:1px solid var(--dt-border);padding-left:16px}.dt-path-matrix-col h4{color:var(--dt-text);letter-spacing:.04em;text-transform:uppercase;margin:0;font-size:13px;font-weight:600}.dt-path-row{flex-direction:column;align-items:center;gap:10px;display:flex}.dt-path-row strong{color:var(--dt-text);font-size:12px;font-weight:500}.dt-path-node,.dt-path-node-current{--path-node-bg:#4d88ff;--path-node-shadow:#1e55c8;--path-node-ring:#4d88ff}.dt-path-node{--path-node-size:70px;--path-node-depth:7px;width:70px;height:calc(var(--path-node-size) - var(--path-node-depth));border:2px solid var(--path-node-shadow);background:var(--path-node-bg);color:#fff;box-shadow:0 7px 0 var(--path-node-shadow);box-sizing:border-box;border-radius:8px;justify-content:center;align-items:center;padding:0;display:inline-flex}.dt-path-node-face{border-radius:6px;justify-content:center;align-items:center;width:100%;height:100%;display:inline-flex}.dt-path-node-face svg{color:#fff;display:block}.dt-path-node-current{border:4px solid var(--path-node-ring);padding:6px;padding-bottom:calc(6px + var(--path-node-depth,7px));background:#fff;border-radius:16px;display:inline-flex}.dt-path-node-current .dt-path-node{--path-node-size:64px;--path-node-depth:6px;width:64px;height:calc(var(--path-node-size) - var(--path-node-depth));box-shadow:0 6px 0 var(--path-node-shadow)}.dt-path-node--chapter,.dt-path-node-current--chapter{--path-node-bg:#4d88ff;--path-node-shadow:#1e55c8;--path-node-ring:#4d88ff}.dt-path-node--grammar,.dt-path-node-current--grammar{--path-node-bg:#ffd400;--path-node-shadow:#b89300;--path-node-ring:#ffd400}.dt-path-node--quiz,.dt-path-node-current--quiz{--path-node-bg:#22c55e;--path-node-shadow:#15803d;--path-node-ring:#22c55e}.dt-path-node--locked{--path-node-bg:#94a3b8;--path-node-shadow:#475569}.dt-node-popup-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;display:grid}.dt-node-popup-col{flex-direction:column;gap:10px;min-width:0;display:flex}.dt-node-popup-label{color:var(--dt-text-faint);letter-spacing:.08em;text-transform:uppercase;margin:0;font-size:11px;font-weight:600}.dt-node-popup{color:#fff;border-radius:16px;flex-direction:column;gap:8px;min-height:220px;padding:22px 22px 20px;display:flex}.dt-node-popup h4{letter-spacing:-.02em;margin:0;font-size:22px;font-weight:800;line-height:1.15}.dt-node-popup-desc{opacity:.92;flex:1;margin:0;font-size:14px;line-height:1.5}.dt-node-popup-actions{gap:10px;margin-top:16px;display:flex}.dt-node-popup-cta{min-height:44px;color:var(--dt-text);font:inherit;cursor:pointer;background:#fff;border:0;border-radius:8px;flex:1;padding:0 16px;font-size:14px;font-weight:800;transition:transform .1s,box-shadow .1s}.dt-node-popup-cta:active{transform:translateY(3px)}.dt-node-popup-actions--two .dt-node-popup-cta:first-child{flex:1}.dt-node-popup-actions--two .dt-node-popup-cta:last-child{flex:2}.dt-node-popup--chapter{background:#4d88ff}.dt-node-popup--chapter .dt-node-popup-cta{box-shadow:0 4px #1e55c8}.dt-node-popup--chapter .dt-node-popup-cta:active{box-shadow:0 1px #1e55c8}.dt-node-popup--grammar{color:#0f172a;background:#ffd400}.dt-node-popup--grammar .dt-node-popup-desc{opacity:.85}.dt-node-popup--grammar .dt-node-popup-cta{box-shadow:0 4px #b89300}.dt-node-popup--grammar .dt-node-popup-cta:active{box-shadow:0 1px #b89300}.dt-node-popup--quiz{background:#22c55e}.dt-node-popup--quiz .dt-node-popup-cta{box-shadow:0 4px #15803d}.dt-node-popup--quiz .dt-node-popup-cta:active{box-shadow:0 1px #15803d}.dt-learning-demo{border:1px solid var(--dt-border);background:#fafafa;border-radius:8px;height:600px;position:relative;overflow:hidden}.dt-learning-scroll{background-color:#fafafa;background-image:radial-gradient(circle,#d4d4d8 2.5px,#0000 2.5px);background-position:50% 0;background-size:80px 96px;background-attachment:local;grid-template-rows:192px 1056px;grid-template-columns:1fr;justify-items:center;width:100%;height:100%;display:grid;overflow:auto}.dt-learning-story-card{z-index:5;box-sizing:border-box;background:#4d88ff;border-radius:16px;flex-direction:column;align-self:start;gap:10px;width:min(420px,100% - 48px);margin-top:12px;padding:8px;display:flex;position:sticky;top:12px;box-shadow:0 12px 28px #0f172a1f,0 4px 10px #0f172a0f}.dt-learning-story-head{justify-content:space-between;align-items:center;padding:2px 6px 0;display:flex}.dt-learning-story-eyebrow{color:#fff;letter-spacing:-.01em;font-size:15px;font-weight:800}.dt-learning-story-link{color:#fff;font:inherit;cursor:pointer;background:#ffffff2e;border:0;border-radius:999px;align-items:center;gap:6px;padding:6px 12px;font-size:12px;font-weight:800;transition:background .12s;display:inline-flex}.dt-learning-story-link:hover{background:#ffffff47}.dt-learning-story-link svg{flex-shrink:0}.dt-learning-story-inner{background:#fff;border-radius:8px;grid-template-columns:72px minmax(0,1fr);align-items:start;gap:12px;padding:8px;display:grid}.dt-learning-story-cover{aspect-ratio:3/4;background:linear-gradient(160deg,#4d88ffa6,#ffd4008c),linear-gradient(145deg,#9bbcff,#fdba74);border-radius:6px;width:72px}.dt-learning-story-copy{min-width:0;padding-top:6px}.dt-learning-story-copy h4{color:var(--dt-text);letter-spacing:-.01em;margin:0;font-size:17px;font-weight:800;line-height:1.2}.dt-learning-story-copy p{color:var(--dt-text-muted);-webkit-line-clamp:3;-webkit-box-orient:vertical;margin:4px 0 0;font-size:12px;line-height:1.5;display:-webkit-box;overflow:hidden}.dt-learning-map{background:0 0;align-self:start;margin:0;position:relative}.dt-learning-map-lines{pointer-events:none;position:absolute;top:0;left:0}.dt-learning-map-lines path{fill:none;stroke:#d4d4d8;stroke-width:2px;stroke-linecap:square;stroke-linejoin:miter}.dt-map-node{z-index:1;font:inherit;cursor:pointer;background:0 0;border:0;padding:0;transition:transform .12s;position:absolute;transform:translate(-50%,-50%)}.dt-map-node:disabled{cursor:default}.dt-map-node:not(:disabled):hover{transform:translate(-50%,calc(-50% - 2px))}.dt-map-node:not(:disabled):active{transform:translate(-50%,-50%)}.dt-learning-overlay{z-index:10;background:#0f172a7a;justify-content:center;align-items:center;padding:24px;animation:.15s dt-overlay-fade;display:flex;position:absolute;inset:0}.dt-learning-overlay-popup{width:min(320px,100%);animation:.18s cubic-bezier(.22,.61,.36,1) dt-overlay-pop}@keyframes dt-overlay-fade{0%{opacity:0}to{opacity:1}}@keyframes dt-overlay-pop{0%{opacity:0;transform:translateY(8px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}.dt-control-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;display:grid}.dt-control-panel{border:1px solid var(--dt-border);background:var(--dt-bg);border-radius:8px;flex-direction:column;gap:10px;padding:18px;display:flex}.dt-control-label{color:var(--dt-text-faint);letter-spacing:.1em;text-transform:uppercase;margin:0 0 4px;font-size:11px;font-weight:700}.dt-lesson-cta,.dt-answer-option{color:#0f172a;width:100%;min-height:44px;font:inherit;cursor:pointer;background:#fff;border:2px solid #e2e8f0;border-radius:8px;padding:0 16px;font-size:13px;font-weight:700;transition:background .12s,border-color .12s,box-shadow .1s,transform .1s}.dt-lesson-cta:active,.dt-answer-option:active{transform:translateY(1px)}.dt-lesson-cta--primary{color:#fff;background:#4d88ff;border-color:#1e55c8;box-shadow:0 4px #1e55c8}.dt-lesson-cta--secondary{border-color:#334155;box-shadow:0 4px #334155}.dt-lesson-cta--primary:active{box-shadow:0 1px #1e55c8}.dt-lesson-cta--secondary:active{box-shadow:0 1px #334155}.dt-answer-option--correct{background:#dcfce7;border-color:#22c55e}.dt-answer-option--wrong{background:#fee2e2;border-color:#ef4444}.dt-feedback-sample{color:#fff;border-radius:10px;flex-direction:column;gap:8px;padding:12px;display:flex}.dt-feedback-sample span{text-align:center;font-size:12px;font-weight:700}.dt-feedback-sample button{color:#0f172a;min-height:40px;font:inherit;background:#fff;border:0;border-radius:8px;font-size:13px;font-weight:700;transition:transform .1s,box-shadow .1s}.dt-feedback-sample button:active{transform:translateY(3px)}.dt-feedback-sample--success{background:#22c55e}.dt-feedback-sample--success button{box-shadow:0 4px #15803d}.dt-feedback-sample--success button:active{box-shadow:0 1px #15803d}.dt-feedback-sample--danger{background:#ef4444}.dt-feedback-sample--danger button{box-shadow:0 4px #b91c1c}.dt-feedback-sample--danger button:active{box-shadow:0 1px #b91c1c}.dt-feedback-sample--brand{background:#4d88ff}.dt-feedback-sample--brand button{box-shadow:0 4px #1e55c8}.dt-feedback-sample--brand button:active{box-shadow:0 1px #1e55c8}.dt-practice-phone{border:1px solid var(--dt-border);background:linear-gradient(#fff0 52%,#fffffffa 100%),radial-gradient(circle at 50% 26%,#4d88ff1a,#0000 34%),#fafafa;border-radius:8px;flex-direction:column;justify-content:flex-end;align-items:flex-end;min-height:320px;display:flex;position:relative;overflow:hidden}.dt-practice-prompt{text-align:center;flex-direction:column;gap:6px;display:flex;position:absolute;top:24px;left:24px;right:24px}.dt-practice-prompt span{color:#4d88ff;letter-spacing:.1em;text-transform:uppercase;font-size:11px;font-weight:700}.dt-practice-prompt strong{color:var(--dt-text);letter-spacing:-.02em;font-size:18px;line-height:1.2}.dt-practice-feedback-row{grid-template-columns:repeat(3,minmax(0,1fr));align-items:end;width:100%;display:grid}.dt-practice-feedback{box-sizing:border-box;border-radius:16px 16px 0 0;flex-direction:column;justify-content:center;gap:12px;min-height:132px;padding:22px 18px 24px;display:flex}.dt-practice-feedback p{letter-spacing:-.02em;text-align:center;margin:0;font-size:16px;font-weight:700;line-height:1.2}.dt-practice-feedback button{color:#0f172a;min-height:44px;font:inherit;background:#fff;border:0;border-radius:8px;font-size:13px;font-weight:700;transition:transform .1s,box-shadow .1s}.dt-practice-feedback button:active{transform:translateY(3px)}.dt-practice-feedback--success{color:#fff;background:#22c55e}.dt-practice-feedback--success button{box-shadow:0 4px #15803d}.dt-practice-feedback--success button:active{box-shadow:0 1px #15803d}.dt-practice-feedback--retry{color:#fff;background:#ef4444}.dt-practice-feedback--retry button{box-shadow:0 4px #b91c1c}.dt-practice-feedback--retry button:active{box-shadow:0 1px #b91c1c}.dt-practice-feedback--revealed{color:#fff;background:#4d88ff}.dt-practice-feedback--revealed button{box-shadow:0 4px #1e55c8}.dt-practice-feedback--revealed button:active{box-shadow:0 1px #1e55c8}.dt-pattern-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;display:grid}.dt-pattern-card{border:1px solid var(--dt-border);background:var(--dt-bg);border-radius:8px;padding:18px}.dt-pattern-card h3{color:var(--dt-text);margin:0 0 8px;font-size:15px;font-weight:600}.dt-pattern-card p{color:var(--dt-text-muted);margin:0;font-size:13px;line-height:1.6}@media (width<=1024px){.dt-page{grid-template-columns:200px minmax(0,1fr)}.dt-content{padding:40px 32px 80px}}@media (width<=768px){.dt-page{grid-template-columns:1fr}.dt-sidebar{border-right:0;border-bottom:1px solid var(--dt-border);height:auto;position:static}.dt-sidebar-inner{gap:16px;padding:20px}.dt-sidebar-nav{flex-flow:wrap;gap:12px}.dt-sidebar-group{flex:140px}.dt-content{gap:40px;padding:32px 20px 64px}.dt-section+.dt-section{padding-top:40px}.dt-intro h1{font-size:32px}.dt-control-grid,.dt-path-matrix,.dt-node-popup-grid{grid-template-columns:1fr}.dt-path-matrix-col+.dt-path-matrix-col{border-left:0;border-top:1px solid var(--dt-border);padding-top:20px;padding-left:0}.dt-practice-feedback-row{grid-template-columns:1fr}}@media (width<=520px){.dt-table-wrap{overflow-x:auto}.dt-table{min-width:520px}.dt-content{padding:24px 16px 56px}}