:root{font-family:Microsoft YaHei,Noto Sans SC,system-ui,sans-serif;color:#21342f;background:#e8fbf2;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible{outline:3px solid #ffb528;outline-offset:3px}.app-shell{min-height:100vh;padding:clamp(14px,3vw,42px);background:radial-gradient(circle at 10% 10%,#fafffd 0,transparent 24%),linear-gradient(135deg,#e7faf0,#f5fff9 58%,#e5f8ee)}.lesson-card{position:relative;width:min(1440px,100%);min-height:calc(100vh - clamp(28px,6vw,84px));margin:0 auto;padding:clamp(20px,3.4vw,54px);overflow:hidden;border:1px solid rgba(255,255,255,.9);border-radius:34px;background:#fff;box-shadow:0 18px 60px #1a725221}.topbar{display:flex;align-items:center;justify-content:space-between;gap:20px}.eyebrow{margin:0 0 7px;color:#57a27e;font-size:clamp(.74rem,1.4vw,.95rem);font-weight:700;letter-spacing:.06em}h1{margin:0;font-size:clamp(1.35rem,3vw,2.2rem);letter-spacing:-.03em}.reset-button{display:grid;width:46px;height:46px;place-items:center;border:0;border-radius:50%;color:#fff;background:#ed665b;box-shadow:0 5px #c84239;font-size:1.8rem;line-height:1}.reset-button:active{transform:translateY(3px);box-shadow:0 2px #c84239}.group-switcher{display:flex;gap:12px;margin-top:24px}.group-tab{display:inline-flex;align-items:center;gap:9px;padding:10px 17px;border:2px solid #c9eee0;border-radius:999px;color:#267a5a;background:#f7fffb;font-size:.95rem;font-weight:800;transition:.2s}.group-tab span{display:grid;width:23px;height:23px;place-items:center;border-radius:50%;color:#fff;background:#0bb97a;font-size:.78rem}.group-tab.active{border-color:#0bb97a;color:#fff;background:#0bb97a;box-shadow:0 5px 12px #0bb97a3d}.group-tab.active span{color:#0bb97a;background:#fff}.group-tab.locked{color:#9aa8a2;border-color:#e5ebe7;background:#f8faf9;cursor:not-allowed}.group-tab.locked span{background:#bac6c0}.stepper{display:flex;align-items:stretch;gap:8px;margin:28px 0 22px;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin}.step{display:flex;flex:1 0 150px;align-items:center;justify-content:center;gap:12px;min-height:58px;padding:10px 14px;border:0;border-radius:14px;color:#fff;background:#0bb97a;font-weight:800;white-space:nowrap;opacity:.38}.step.available{opacity:1}.step.current{outline:5px solid #ffb528;outline-offset:-5px}.step:disabled{cursor:not-allowed}.step b{margin-left:7px;color:#12bd81;font-size:2.8rem;font-weight:300;line-height:.3;transform:translate(17px)}.step:last-child b{display:none}.lesson-heading{display:flex;align-items:center;gap:14px;padding:20px 0;border-top:1px solid #e8f1ed;border-bottom:1px solid #e8f1ed}.badge{flex:0 0 auto;padding:8px 12px;border-radius:10px;color:#0a9e69;background:#dff8eb;font-weight:900}.lesson-heading h2{margin:0;font-size:clamp(1.06rem,2.1vw,1.42rem)}.lesson-heading p{margin:4px 0 0;color:#658179;font-size:.92rem}.progress-count{margin-left:auto;color:#0bb97a;font-weight:900}.stage-content{padding:clamp(24px,4vw,52px) 0 6px}.instruction-card,.review-title,.quiz-intro{display:flex;align-items:center;gap:16px;width:min(750px,100%);margin:0 auto 26px;padding:17px 21px;border:1px solid #d9f0e6;border-radius:18px;background:#f8fffb}.instruction-card strong,.review-title h3,.quiz-intro h3{color:#067a50;font-size:1.13rem}.instruction-card p,.review-title p,.quiz-intro p{margin:4px 0 0;color:#6c857d;font-size:.91rem}.instruction-number{display:grid;flex:0 0 35px;width:35px;height:35px;place-items:center;border-radius:50%;color:#fff;background:#ffb528;font-weight:900}.audio-list{width:min(900px,100%);margin:0 auto;border-top:1px solid #edf3f0}.preview-row{display:grid;grid-template-columns:38px max-content 1fr;align-items:center;gap:16px;min-height:88px;padding:14px 8px;border-bottom:1px solid #edf3f0}.sentence-index,.quiz-number{color:#6f827a;font-weight:900;text-align:center}.preview-sentence{min-width:0}.preview-sentence p{margin:5px 0 0;color:#73857e;font-size:.93rem}.reveal-button{justify-self:start;padding:10px 16px;border:1.5px dashed #86cdb0;border-radius:10px;color:#078457;background:#fff;font-weight:800}.audio-buttons{display:flex;align-items:center;justify-content:center;gap:8px}.audio-buttons.compact{justify-content:flex-start}.speaker,.slow-button{min-height:44px;padding:9px 15px;border:0;border-radius:12px;font-weight:800}.speaker{color:#fff;background:#0bb97a;box-shadow:0 4px #07885a}.speaker span{margin-right:6px}.slow-button{color:#067a50;background:#e3f9ee}.audio-buttons.compact .speaker{min-height:39px;padding:7px 11px;font-size:.86rem}.sentence-stage{text-align:center}.section-kicker{margin:0 0 18px;color:#0bb97a;font-size:.94rem;font-weight:900;letter-spacing:.09em}.listen-first{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;width:min(680px,100%);min-height:250px;margin:30px auto;border:2px dashed #70cdaa;border-radius:24px;color:#057b50;background:linear-gradient(135deg,#f5fff9,#e7faf0)}.listen-first span{font-size:3.5rem}.listen-first strong{font-size:clamp(1.13rem,2.4vw,1.42rem)}.listen-first small{color:#739187;font-size:.95rem}.sentence-display{width:min(1120px,100%);margin:24px auto 13px}.english-sentence{margin:0;font-size:clamp(1rem,2vw,1.35rem);font-weight:800;line-height:1.55}.english-sentence.large{font-size:clamp(1.65rem,4.1vw,3.25rem);letter-spacing:-.04em}.sentence-display>p{margin:10px 0 0;color:#4e6860;font-size:clamp(1.1rem,2.4vw,1.72rem);font-weight:800}.word-highlight{margin:0;padding:0;border:0;color:#057ec3;background:transparent;font:inherit;font-weight:900;text-decoration:underline 4px #fbce73;text-underline-offset:6px}.scene-card{position:relative;width:min(710px,100%);min-height:185px;margin:26px auto;overflow:hidden;border-radius:22px;background:linear-gradient(135deg,#d3f6e4,#e8f7ff);box-shadow:0 10px 24px #1c684c1c}.scene-card img{position:relative;z-index:1;display:block;width:100%;max-height:420px;object-fit:cover}.scene-fallback{display:grid;min-height:185px;place-content:center;color:#199870;text-align:center;background:radial-gradient(circle at 20% 30%,#fff 0 10%,transparent 11%),radial-gradient(circle at 78% 62%,#b6efda 0 16%,transparent 17%),linear-gradient(135deg,#e6fff1,#e4f2ff)}.scene-fallback span{font-size:3rem;color:#ffb528}.scene-fallback p{margin:8px 0 0;font-weight:900;letter-spacing:.08em}.scene-caption{position:absolute;z-index:2;right:12px;bottom:10px;padding:5px 8px;border-radius:99px;color:#356b58;background:#ffffffd1;font-size:.7rem}.practice-section{width:min(900px,100%);margin:30px auto;padding:24px;border-radius:20px;background:#f8fffb}.practice-section h3,.vocabulary-section h3{margin:0 0 16px;font-size:1.05rem}.chunk-row{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}.chunk-button{min-height:52px;padding:10px 16px;border:1px solid #b8e9d4;border-radius:12px;color:#196c50;background:#fff;font-weight:800}.chunk-button:hover{color:#fff;background:#0bb97a}.vocabulary-section{width:min(900px,100%);margin:0 auto;text-align:left}.vocabulary-cards{display:flex;flex-wrap:wrap;gap:12px}.vocabulary-card{position:relative;display:flex;flex:1 1 230px;flex-direction:column;align-items:flex-start;gap:3px;min-height:120px;padding:17px;overflow:hidden;border:1px solid #e1ece6;border-radius:15px;color:#39554c;background:#fff;text-align:left}.vocabulary-card:hover{border-color:#0bb97a;transform:translateY(-2px);box-shadow:0 8px 20px #0e8c5d1a}.vocab-word{color:#087d54;font-size:1.36rem;font-weight:900}.vocabulary-card small{color:#6f847c}.vocabulary-card i{position:absolute;right:14px;top:15px;font-size:1.25rem;font-style:normal}.mastery-row,.assessment-buttons{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px;margin:30px auto 0;color:#637a72;font-weight:800}.mastery{min-height:42px;padding:8px 15px;border:2px solid;border-radius:99px;background:#fff;font-weight:900}.mastery.review{border-color:#f5a2a2;color:#d94c52}.mastery.mastered{border-color:#55c899;color:#079765}.mastery.selected,.mastery:hover{color:#fff}.mastery.review.selected,.mastery.review:hover{background:#e95c62}.mastery.mastered.selected,.mastery.mastered:hover{background:#0bb97a}.review-title{margin-bottom:22px}.review-title>span,.quiz-intro>span{display:grid;width:52px;height:52px;place-items:center;border-radius:17px;background:#e4f8ec;font-size:1.8rem}.review-title h3,.quiz-intro h3{margin:0}.review-list{width:min(900px,100%);margin:0 auto;border-top:1px solid #e9f0ed}.review-row{display:grid;grid-template-columns:75px max-content minmax(0,1fr);align-items:center;gap:14px;padding:15px 8px;border-bottom:1px solid #e9f0ed}.review-row>span{color:#0b9a68;font-weight:900}.translation-stage{text-align:center}.translation-prompt{width:min(900px,100%);margin:0 auto;padding:clamp(25px,5vw,65px) 24px;border-radius:24px;color:#fff;background:linear-gradient(135deg,#0bb97a,#079764);box-shadow:0 15px 32px #048f5c33}.translation-prompt span{color:#d9fff0;font-size:.92rem;font-weight:800}.translation-prompt h3{margin:16px 0 0;font-size:clamp(1.6rem,4vw,3rem);line-height:1.35}.translation-answer{width:min(900px,100%);margin:24px auto;padding:28px 20px;border:1px solid #d8ebe2;border-radius:23px;background:#f9fffb}.translation-answer>p{margin:20px 0;color:#1e372e;font-size:clamp(1.34rem,3vw,2.25rem);font-weight:900;line-height:1.42}.quiz-intro{text-align:left}.quiz-list{width:min(1060px,100%);margin:0 auto;border-top:1px solid #e4ede9}.quiz-row{position:relative;display:grid;grid-template-columns:38px minmax(0,1fr) 42px 30px;align-items:center;gap:10px;padding:16px 6px;border-bottom:1px solid #e4ede9}.quiz-row p{margin:0;font-size:clamp(1rem,2.1vw,1.34rem);font-weight:800;line-height:1.85}.quiz-row input{width:clamp(82px,16vw,150px);padding:2px 8px;border:0;border-bottom:2px solid #57c79a;color:#0a8458;background:transparent;font-size:inherit;font-weight:900;text-align:center}.hint-button{display:grid;width:38px;height:38px;place-items:center;border:0;border-radius:50%;background:#fff5d9;font-size:1.05rem}.result-mark{font-size:1.65rem;font-weight:900}.quiz-row.correct .result-mark{color:#0bb97a}.quiz-row.incorrect .result-mark{color:#e95c62}.quiz-feedback{grid-column:2 / -1;padding:12px 15px;border-radius:10px;color:#79602b;background:#fff8df;line-height:1.65}.footer-action{display:flex;justify-content:flex-end;width:min(1060px,100%);margin:38px auto 0}.primary-button{min-height:52px;padding:10px 20px 10px 24px;border:0;border-radius:999px;color:#fff;background:#0bb97a;box-shadow:0 5px #078a5b;font-weight:900}.primary-button:hover{background:#079e68}.primary-button:active{transform:translateY(3px);box-shadow:0 2px #078a5b}.primary-button:disabled{cursor:not-allowed;opacity:.45;box-shadow:none;transform:none}.primary-button span{margin-left:9px;font-size:1.35rem}.word-spotlight{position:fixed;z-index:20;left:50%;bottom:max(26px,env(safe-area-inset-bottom));width:min(430px,calc(100vw - 32px));padding:25px;border:1px solid #d4eee2;border-radius:22px;color:#315246;background:#fff;box-shadow:0 18px 60px #0f4b3247;text-align:center;transform:translate(-50%)}.word-spotlight p{margin:0;color:#0bb97a;font-size:.83rem;font-weight:900;letter-spacing:.08em}.word-spotlight h3{margin:6px 0;color:#067c51;font-size:2rem}.word-spotlight strong{display:block;margin:11px 0 17px}.modal-close{position:absolute;right:13px;top:10px;border:0;color:#6f837a;background:transparent;font-size:1.7rem}.completion-overlay{position:fixed;z-index:30;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;padding:22px;background:#0c3b2875;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.completion-overlay>div{width:min(520px,100%);padding:46px 30px;border-radius:28px;background:#fff;text-align:center;box-shadow:0 25px 90px #00000040}.completion-overlay span{font-size:4rem}.completion-overlay h2{margin:14px 0 8px;color:#067b51}.completion-overlay p{margin:0 0 25px;color:#668279}.unit-subtitle{margin:8px 0 0;color:#658179;font-weight:700}.home-card{background:linear-gradient(180deg,#fff 0,#fff 76%,#f7fffb)}.offline-badge{display:inline-flex;align-items:center;gap:8px;margin-top:16px;padding:7px 11px;border-radius:999px;color:#62776f;background:#f0f5f3;font-size:.79rem;font-weight:800}.offline-badge i{width:9px;height:9px;border-radius:50%;background:#ffb528;box-shadow:0 0 0 4px #ffb5282b}.offline-badge.ready{color:#087a52;background:#e0f8ec}.offline-badge.ready i{background:#0bb97a;box-shadow:0 0 0 4px #0bb97a26}.offline-badge.offline{color:#2175a5;background:#e6f4fb}.offline-badge.offline i{background:#2697d5;box-shadow:0 0 0 4px #2697d526}.offline-badge.compact{flex:0 0 auto;margin:0}.home-hero{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(22px,5vw,80px);align-items:center;margin:30px 0;padding:clamp(28px,5vw,60px);overflow:hidden;border-radius:28px;color:#fff;background:radial-gradient(circle at 85% 10%,rgba(255,255,255,.22),transparent 20%),linear-gradient(135deg,#087b58,#0bb97a 56%,#6cd7ac);box-shadow:0 18px 42px #06825733}.hero-pill{display:inline-block;padding:7px 12px;border:1px solid rgba(255,255,255,.35);border-radius:999px;color:#e9fff5;background:#ffffff1f;font-size:.8rem;font-weight:900}.home-hero h2{margin:15px 0 12px;font-size:clamp(2rem,5vw,4rem);line-height:1.12;letter-spacing:-.055em}.home-hero p{max-width:700px;margin:0;color:#d9fff0;font-size:clamp(.95rem,1.7vw,1.1rem);line-height:1.7}.hero-stats{display:flex;flex-direction:column;align-items:center;justify-content:center;width:clamp(150px,18vw,220px);aspect-ratio:1;border:1px solid rgba(255,255,255,.35);border-radius:50%;background:#ffffff1f;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.hero-stats strong{font-size:clamp(2.5rem,6vw,4.8rem);line-height:1}.hero-stats small{font-size:.35em;opacity:.75}.hero-stats span{margin-top:9px;color:#e3fff2;font-size:.8rem;font-weight:800}.module-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.module-card{position:relative;min-width:0;padding:24px;overflow:hidden;border:1px solid #dcece5;border-radius:24px;background:#fff;box-shadow:0 10px 30px #165d4214}.module-card:before{position:absolute;inset:0 0 auto;height:5px;content:"";background:#0bb97a}.module-2:before{background:#2f91d0}.module-3:before{background:#f0a622}.module-topline{display:flex;align-items:center;justify-content:space-between;gap:10px;color:#0a8b5d;font-size:.75rem;font-weight:900;text-transform:uppercase}.module-topline div{display:flex;gap:7px}.module-topline b{padding:5px 7px;border-radius:999px;color:#60736c;background:#f2f6f4;font-size:.7rem}.module-card h3{margin:18px 0 4px;font-size:clamp(1.25rem,2.4vw,1.7rem)}.module-subtitle{margin:0 0 12px!important;color:#0b9e6a!important;font-weight:900}.module-card>p{min-height:42px;margin:0;color:#687e76;font-size:.88rem;line-height:1.55}.module-progress{height:7px;margin:19px 0;overflow:hidden;border-radius:99px;background:#edf3f0}.module-progress i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#0bb97a,#65d8aa);transition:width .35s ease}.home-group-list{display:grid;gap:9px}.home-group-list button{display:grid;grid-template-columns:37px minmax(0,1fr) 24px;align-items:center;gap:10px;min-height:68px;padding:10px;border:1px solid #e1ebe6;border-radius:14px;color:#29483d;background:#fbfefc;text-align:left;transition:.18s}.home-group-list button:hover{border-color:#76d2ad;background:#f1fff8;transform:translateY(-2px);box-shadow:0 8px 18px #0a885914}.home-group-list button>span{display:grid;width:34px;height:34px;place-items:center;border-radius:10px;color:#fff;background:#0bb97a;font-size:.73rem;font-weight:900}.home-group-list button>div{min-width:0}.module-2 .home-group-list button>span{background:#2f91d0}.module-3 .home-group-list button>span{background:#efa725}.home-group-list strong,.home-group-list small{display:block}.home-group-list strong{font-size:.91rem}.home-group-list small{margin-top:3px;overflow:hidden;color:#75877f;font-size:.72rem;text-overflow:ellipsis;white-space:nowrap}.home-group-list button>b{color:#0bb97a;font-size:1.4rem;text-align:center}.coverage-strip{display:grid;grid-template-columns:auto minmax(180px,1fr);align-items:center;gap:22px;margin-top:24px;padding:20px 23px;border-radius:18px;background:#eefaf4}.coverage-strip>div:first-child{display:flex;align-items:baseline;gap:6px}.coverage-strip strong{color:#078456;font-size:1.8rem}.coverage-strip span{color:#617970;font-size:.85rem;font-weight:800}.coverage-bar{height:10px;overflow:hidden;border-radius:99px;background:#d8e9e1}.coverage-bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#0bb97a,#ffb528)}.lesson-topbar{display:grid;grid-template-columns:170px minmax(0,1fr) auto}.lesson-title{text-align:center}.home-button{justify-self:start;min-height:45px;padding:8px 14px;border:1px solid #cfe8dd;border-radius:99px;color:#0a8057;background:#f6fffa;font-weight:900}.home-button:first-letter{font-size:1.5rem}.quiz-feedback-actions{display:flex;gap:8px;margin-top:9px}.quiz-feedback-actions button{padding:5px 10px;border:1px solid #eccf78;border-radius:99px;color:#71591c;background:#fff;font-size:.78rem;font-weight:900}.quiz-feedback p{margin:8px 0 0;font-size:.9rem;font-weight:500}.hint-button{width:auto;min-width:44px;min-height:44px;padding:6px 8px;border-radius:9px;font-size:.7rem;font-weight:900}@media(max-width:760px){.app-shell{padding:0}.lesson-card{min-height:100vh;padding:20px 16px 30px;border-radius:0}.group-switcher{margin-top:18px;overflow-x:auto;padding-bottom:4px}.group-tab{flex:0 0 auto}.stepper{margin:20px 0 18px}.step{flex-basis:136px;min-height:52px;font-size:.84rem}.step b{transform:translate(11px)}.lesson-heading{align-items:flex-start}.progress-count{font-size:.85rem}.preview-row{grid-template-columns:25px max-content 1fr;gap:9px}.preview-sentence{grid-column:2 / -1}.review-row{grid-template-columns:62px max-content 1fr;gap:8px}.review-row .english-sentence,.review-row .reveal-button{grid-column:2 / -1}.quiz-row{grid-template-columns:27px minmax(0,1fr) 39px 24px;gap:5px}.quiz-row p{font-size:1rem}.quiz-row input{width:88px}.footer-action{justify-content:center}.primary-button{min-width:min(320px,100%)}.mastery-row{font-size:.9rem}.home-hero{grid-template-columns:1fr}.hero-stats{width:132px;justify-self:center}.module-grid{grid-template-columns:1fr}.coverage-strip{grid-template-columns:1fr;gap:11px}.lesson-topbar{grid-template-columns:1fr auto}.lesson-title{grid-column:1 / -1;grid-row:2;margin-top:16px;text-align:left}.offline-badge.compact{justify-self:end}.home-button span{display:none}}@media(min-width:761px)and (max-width:1120px){.module-grid{grid-template-columns:1fr}.module-card{display:grid;grid-template-columns:minmax(220px,.7fr) 1.3fr;column-gap:26px}.module-topline,.module-card h3,.module-card>p,.module-progress{grid-column:1}.home-group-list{grid-column:2;grid-row:1 / span 6}}