: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}@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}}