:root{--paper: #FFFBF0;--card: #FFFFFF;--ink: #4A3F35;--ink-soft: #8A7A68;--ink-faint: #B6A78F;--line: #F0E4CC;--line-soft: #EFE5D3;--subj: #FF8A5B;--verb: #4CAF88;--obj: #4D9DE0;--mod: #C792EA;--time: #FFB84D;--warn: #EF767A;--radius: 22px;--shadow: 0 3px 0 #F5EBD9}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--paper);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;line-height:1.85;font-size:16px;-webkit-font-smoothing:antialiased}.wrap{max-width:880px;margin:0 auto;padding:8px 24px 120px}.content{margin-left:264px;transition:margin-left .25s ease}.toc{position:fixed;left:0;top:0;bottom:0;width:264px;padding:16px 12px 28px;overflow-y:auto;background:linear-gradient(180deg,#fffdf6,#fbf3e2);border-right:2px solid var(--line);z-index:40;transition:transform .25s ease}.toc.collapsed{transform:translate(-100%)}.content.toc-collapsed{margin-left:0}.toc::-webkit-scrollbar{width:8px}.toc::-webkit-scrollbar-thumb{background:#e7d9be;border-radius:8px}.toc-head{display:flex;align-items:center;justify-content:space-between;padding:0 8px 12px}.toc-title{font-weight:800;font-size:15px;color:var(--ink);padding:4px 2px;letter-spacing:1px}.toc-toggle{flex:none;width:26px;height:26px;display:flex;align-items:center;justify-content:center;border:2px solid var(--line);background:#fff;color:var(--ink-soft);border-radius:8px;cursor:pointer;font-size:16px;line-height:1;transition:.15s}.toc-toggle:hover{border-color:var(--verb);color:var(--verb)}.toc-reopen{position:fixed;top:12px;left:12px;z-index:60;border:2px solid var(--verb);background:var(--verb);color:#fff;border-radius:999px;padding:6px 14px;font:inherit;font-weight:700;font-size:13px;cursor:pointer;box-shadow:0 4px 12px #0000001f}.toc-unit{margin-bottom:16px}.toc-unit-h{width:100%;text-align:left;cursor:pointer;font:inherit;color:inherit;display:flex;align-items:center;gap:7px;padding:5px 10px;background:none;border:none;border-radius:8px;transition:background .15s}.toc-unit-h:hover{background:#fff}.toc-unit-id{font-size:11px;font-weight:700;color:#fff;white-space:nowrap;background:var(--subj);border-radius:999px;padding:2px 8px}.toc-unit-title{font-size:12.5px;font-weight:700;color:var(--ink-soft)}.toc-chevron{margin-left:auto;color:var(--ink-faint);font-size:11px;flex:none}.toc-lessons{list-style:none;margin:5px 0 0;padding:0}.toc-link{width:100%;text-align:left;display:flex;align-items:center;gap:8px;background:none;border:none;cursor:pointer;font:inherit;padding:7px 10px;border-radius:10px;color:var(--ink);font-size:13px;line-height:1.35;transition:background .15s,color .15s}.toc-link:hover{background:#fff}.toc-link.active{background:var(--verb);color:#fff}.toc-link.active .toc-no{background:#ffffff40;color:#fff}.toc-link.active .toc-name{color:#fff}.toc-no{flex:none;font-size:11px;font-weight:700;color:var(--ink-soft);background:#f0e4cc;border-radius:6px;padding:1px 6px;min-width:36px;text-align:center}.toc-name{flex:1}.toc-eq{flex:none;color:var(--warn);font-size:10px}.toc-soon{flex:none;font-size:10px;font-weight:700;color:var(--ink-faint);background:#f0e4cc;border-radius:6px;padding:1px 6px}.toc-link.soon .toc-name{color:var(--ink-faint)}.toc-intro{padding:2px 4px 10px;margin-bottom:8px;border-bottom:2px solid var(--line-soft)}.toc-link.intro .toc-no{background:var(--subj);color:#fff}.toc-link.intro.active{background:var(--subj)}.toc-link.intro.active .toc-name,.toc-link.intro.active .toc-no{color:#fff;background:#ffffff40}.lesson{scroll-margin-top:96px}.lesson-view{margin-top:8px}.lesson-nav-bar{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:12px 16px;margin-bottom:12px;background:linear-gradient(180deg,#fffdf6,#fbf3e2);border:2px solid var(--line);border-radius:16px;box-shadow:var(--shadow)}.lnb-unit{font-weight:800;font-size:15px;color:var(--ink)}.lnb-btns{display:flex;gap:8px}.lnb-btns button{border:2px solid var(--line);background:var(--card);color:var(--ink);border-radius:999px;padding:6px 14px;font-size:13px;cursor:pointer;transition:background .15s ease,border-color .15s ease}.lnb-btns button:hover:not(:disabled){background:#fff3df;border-color:#e7d9be}.lnb-btns button:disabled{opacity:.42;cursor:not-allowed}.lesson.stub{text-align:center;padding:64px 24px;background:var(--card);border:2.5px dashed var(--line);border-radius:var(--radius);margin:0 0 32px}.stub-inner{max-width:420px;margin:0 auto}.stub-inner h3{margin:12px 0 8px;font-size:22px}.stub-inner p{margin:6px 0;color:var(--ink-soft)}.stub-badge{display:inline-block;font-size:12px;font-weight:700;color:#fff;background:var(--ink-faint);border-radius:999px;padding:3px 14px;margin:0 auto}.stub-hint{font-size:13px;color:var(--ink-faint)}.intro-card{text-align:center;padding:44px 24px 32px}.intro-card h1{font-size:34px;margin:4px 0 8px;letter-spacing:2px}.intro-card .sub{color:var(--ink-soft);font-size:15px;letter-spacing:1px}.intro-card .meta{margin-top:18px;font-size:13px;color:var(--ink-faint)}.intro-card .welcome-desc{margin-left:auto;margin-right:auto}.intro-card .welcome-cta{justify-content:center}.intro-info{max-width:660px;margin:26px auto 0;text-align:left;display:grid;gap:16px}.intro-block{background:linear-gradient(180deg,#fffdf6,#fbf3e2);border:2px solid var(--line);border-radius:var(--radius);padding:16px 18px}.intro-block h3{margin:0 0 8px;font-size:16px;letter-spacing:1px;color:var(--ink)}.intro-block p{margin:0;font-size:14px;line-height:1.85;color:var(--ink-soft)}.intro-block ul{margin:0;padding-left:20px}.intro-block li{font-size:14px;line-height:1.85;color:var(--ink-soft);margin:2px 0}@media(max-width:980px){.lesson-nav-bar{position:static}}@media(max-width:980px){.content{margin-left:0}.toc{position:static;width:auto;height:auto;border-right:none;border-bottom:2px solid var(--line);max-height:38vh}.toc.collapsed{display:none}.content.toc-collapsed{margin-left:0}}.toolbar{position:sticky;top:0;z-index:50;display:flex;flex-direction:column;gap:8px;background:#fffbf0f5;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:2px solid var(--line);padding:10px 20px}.tb-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.tb-row.tb-voice{padding-top:2px}.toolbar .tb-title{font-weight:700;font-size:15px;margin-right:8px}.tb-label{font-size:12.5px;color:var(--ink-soft);font-weight:600}.tb-hint{font-size:11.5px;color:var(--ink-faint)}.now-voice{font-size:11.5px;color:var(--ink-faint);margin-left:4px}.now-voice b{color:var(--ink);font-weight:700}.now-voice .warn{color:#c0392b;font-style:normal;margin-left:4px}.toolbar button{font:inherit;font-size:13.5px;font-weight:600;border:2px solid var(--line);background:#fff;color:var(--ink);border-radius:999px;padding:5px 14px;cursor:pointer;transition:.15s}.toolbar button:hover:not(:disabled){border-color:var(--verb);color:var(--verb)}.toolbar button.solid{background:var(--verb);border-color:var(--verb);color:#fff}.toolbar button.solid:hover:not(:disabled){background:#3e9a76;color:#fff}.toolbar button.ghost{background:transparent;border-style:dashed;color:var(--ink-soft)}.toolbar button.ghost:hover:not(:disabled){border-color:var(--verb);color:var(--verb)}.toolbar button:disabled{opacity:.4;cursor:not-allowed}.sel{font:inherit;font-size:12.5px;padding:4px 8px;border:2px solid var(--line);border-radius:999px;background:#fff;color:var(--ink);max-width:220px}.sel.wide{max-width:320px}.slider{display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--ink-soft)}.slider b{color:var(--verb);font-variant-numeric:tabular-nums;min-width:30px}.toolbar input[type=range]{width:88px;accent-color:var(--verb)}.now-playing{font-size:13px;color:var(--verb);font-weight:700;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.unsupported{font-size:13px;color:var(--warn);font-weight:600}.welcome{display:flex;gap:30px;align-items:flex-start;text-align:left;padding:52px 20px 28px}.welcome-hero{flex:1;min-width:0;text-align:left}.welcome h1{font-size:34px;margin:4px 0 8px;letter-spacing:2px}.welcome .sub{color:var(--ink-soft);font-size:15px;letter-spacing:1px}.welcome-desc{max-width:620px;margin:18px 0 0;font-size:15px;line-height:1.9;color:var(--ink-soft)}.welcome .meta{margin-top:18px;font-size:13px;color:var(--ink-faint)}.welcome-cta{display:flex;gap:14px;justify-content:flex-start;margin:30px 0 8px}.welcome-cta .lg{border:2px solid var(--line);background:var(--card);color:var(--ink);border-radius:999px;padding:12px 26px;font-size:15px;font-weight:700;cursor:pointer;transition:background .15s ease,border-color .15s ease,transform .1s}.welcome-cta .lg:hover{background:#fff3df;border-color:#e7d9be}.welcome-cta .lg:active{transform:translateY(1px)}.welcome-cta .solid{background:var(--verb);border-color:var(--verb);color:#fff}.welcome-cta .solid:hover:not(:disabled){background:#3e9a76;border-color:#3e9a76;color:#fff}.welcome-dir{flex:0 0 264px;position:sticky;top:96px;max-height:calc(100vh - 120px);overflow-y:auto;background:linear-gradient(180deg,#fffdf6,#fbf3e2);border:2px solid var(--line);border-radius:var(--radius);padding:14px 14px 18px}.welcome-dir::-webkit-scrollbar{width:8px}.welcome-dir::-webkit-scrollbar-thumb{background:#e7d9be;border-radius:8px}.wd-title{font-weight:800;font-size:15px;letter-spacing:2px;padding:2px 6px 10px;margin-bottom:6px;border-bottom:2px solid var(--line-soft)}.wd-unit{margin-bottom:8px}.wd-unit-h{width:100%;display:flex;align-items:center;justify-content:space-between;gap:8px;background:none;border:none;cursor:pointer;font:inherit;color:var(--ink);padding:6px;border-radius:10px;transition:background .15s ease}.wd-unit-h:hover{background:#ffefd6}.wd-unit-name{font-size:13px;font-weight:700;color:var(--subj)}.wd-chevron{flex:none;font-size:11px;color:var(--ink-faint)}.wd-lessons{list-style:none;margin:4px 0 0;padding:0}.wd-lessons li{margin:0}.wd-lessons button{width:100%;text-align:left;display:flex;gap:8px;align-items:baseline;border:none;background:transparent;cursor:pointer;padding:6px 8px;border-radius:10px;font:inherit;color:var(--ink);font-size:13.5px;transition:background .15s ease}.wd-lessons button:hover{background:#ffefd6}.wd-no{font-weight:800;color:var(--ink-faint);font-size:12px;flex:none}.wd-lname{flex:1}.wd-soon{flex:none;font-size:10px;font-weight:700;color:var(--ink-faint);background:#f0e4cc;border-radius:6px;padding:1px 6px}.cover-art{width:100%;max-width:460px;height:auto;display:block;margin:0}@media(max-width:980px){.welcome{flex-direction:column}.welcome-dir{flex:none;width:100%;position:static;max-height:none}}.unit{margin:56px 0 26px;padding:22px 26px;background:linear-gradient(135deg,#ffe9d0,#fff6e6);border:2.5px solid #F2D9B8;border-radius:var(--radius)}.unit h2{margin:0;font-size:22px}.unit p{margin:6px 0 0;font-size:14px;color:var(--ink-soft)}.lesson{background:var(--card);border:2.5px solid var(--line);border-radius:var(--radius);margin:0 0 32px;overflow:hidden;box-shadow:var(--shadow);transition:border-color .2s}.lesson.is-playing{border-color:var(--verb)}.lesson-head{padding:22px 26px 14px}.lesson-no{display:inline-block;background:var(--subj);color:#fff;font-size:12px;font-weight:700;letter-spacing:1px;padding:4px 12px;border-radius:999px}.lesson-head h3{margin:10px 0 4px;font-size:21px}.goal{font-size:14.5px;color:var(--ink-soft);border-left:4px solid var(--verb);padding-left:12px;margin:10px 0 0}.goal b{color:var(--ink)}.scene{background:#fffdf6;border-top:2px dashed var(--line);border-bottom:2px dashed var(--line);padding:14px 12px 12px}.scene-stage{position:relative}.scene-svg svg{display:block;width:100%;height:auto}.scene-cap{text-align:center;font-size:12.5px;color:var(--ink-soft);padding:10px 12px 0;line-height:1.65}.chip{position:absolute;transform:translate(-50%,-50%);white-space:nowrap;font-size:12.5px;font-weight:700;line-height:1;padding:6px 12px;border-radius:999px;color:#fff;box-shadow:0 2px 5px #5c4b3a2e;pointer-events:none}.chip.t-subj{background:var(--subj)}.chip.t-verb{background:var(--verb)}.chip.t-obj{background:var(--obj)}.chip.t-mod{background:var(--mod)}.chip.t-time{background:var(--time)}.chip.t-plain{background:#fff;color:var(--ink);border:2px solid var(--line)}.chip.t-en{background:#fff;color:var(--ink);border:2px solid #DCCDB2;font-family:Segoe UI,PingFang SC,sans-serif;font-weight:600}.body{padding:20px 26px 26px}h4{font-size:15px;margin:26px 0 10px;display:flex;align-items:center;gap:7px}h4:before{content:"";width:9px;height:9px;border-radius:3px;background:var(--verb);transform:rotate(45deg);flex:none}p{margin:0 0 12px}.note{background:#fff8ec;border-radius:14px;padding:14px 18px;font-size:15px}.note b{color:var(--subj)}.ex{width:100%;border-collapse:collapse;margin:4px 0 6px;font-size:15px}.ex td{padding:8px 6px;border-bottom:1px dashed var(--line-soft);vertical-align:top}.ex td.en{font-weight:600;white-space:nowrap;padding-right:18px}.ex td.cn{color:var(--ink-soft)}.ex tr:last-child td{border-bottom:none}.cards{display:flex;flex-wrap:wrap;gap:10px;margin:6px 0 4px}.card{background:#fff;border:2px solid #E7DBFF;border-radius:12px;padding:9px 15px;font-size:14.5px;font-weight:600}.card .slot{color:var(--mod)}.diagram{background:#fbfaff;border:2px dashed #E3DCF5;border-radius:16px;padding:14px 10px 6px;margin:6px 0 4px}.diagram svg{display:block;width:100%;height:auto}.tip{background:#eaf7f1;border:2px solid #C9EBDC;border-radius:14px;padding:12px 18px;font-size:14px;color:#2f7a5c;margin:12px 0 4px}.tip b{color:#1f5f45}details.quiz{background:#fff4f4;border:2px solid #FBDCDC;border-radius:14px;padding:12px 18px;margin:6px 0 4px;font-size:15px}details.quiz summary{cursor:pointer;font-weight:600;outline:none}details.quiz .ans{margin-top:10px;padding-top:10px;border-top:1px dashed #F0CFCF;color:#c2545a;font-weight:600}.speech{margin-top:24px;border:2px solid var(--line);border-radius:16px;overflow:hidden}.speech-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;background:#fff6e6;padding:10px 14px;border-bottom:2px solid var(--line)}.speech-head .lbl{font-size:13px;font-weight:700;color:var(--ink-soft);margin-right:auto}.speech-head button{font:inherit;font-size:13px;font-weight:600;border:2px solid var(--line);background:#fff;color:var(--ink);border-radius:999px;padding:4px 13px;cursor:pointer;transition:.15s}.speech-head button:hover:not(:disabled){border-color:var(--verb);color:var(--verb)}.speech-head button.solid{background:var(--verb);border-color:var(--verb);color:#fff}.speech-head button.solid:hover:not(:disabled){background:#3e9a76;color:#fff}.speech-head button:disabled{opacity:.4;cursor:not-allowed}.speech-head button.ghost{background:transparent;border-style:dashed}.script{padding:10px 14px 14px;background:#fffdf8;max-height:340px;overflow-y:auto}.line{position:relative;display:block;padding:7px 12px 7px 22px;margin:2px 0;border-radius:8px;font-size:14.5px;line-height:1.8;color:var(--ink);cursor:pointer;transition:background .18s,color .18s;scroll-margin:140px}.line:hover{background:#f6efdf}.line.en{font-family:Segoe UI,PingFang SC,sans-serif;font-weight:600}.line.zh{color:#6b5c4a}.line .tag{display:inline-block;font-style:normal;font-size:10.5px;font-weight:800;line-height:1;padding:3px 5px;margin-right:8px;border-radius:5px;vertical-align:1px;background:#efe5d3;color:var(--ink-soft)}.line.en .tag{background:#dcebf9;color:#2e6da4}.line.speaking .tag{background:var(--subj);color:#fff}.line:before{content:"";position:absolute;left:8px;top:11px;bottom:11px;width:4px;border-radius:2px;background:transparent;transition:background .18s}.line.done{color:var(--ink-faint)}.line.done:before{background:#e6dcc6}.line.speaking{background:#ffefcb;color:var(--ink);box-shadow:inset 0 0 0 2px #ffdca0}.line.speaking:before{background:var(--subj);animation:caret 1s steps(2,jump-none) infinite}.line.en.speaking{color:#8a4a1e}@keyframes caret{0%,to{opacity:1}50%{opacity:.2}}.speakable{border-radius:12px;transition:background .18s,box-shadow .18s,border-color .18s;scroll-margin:150px}.speakable.speaking{background:#ffefcb;box-shadow:0 0 0 3px #ffdca0}.note.speakable.speaking{background:#ffefcb}tr.speakable.speaking>td{background:#ffefcb}tr.speakable.speaking>td.en{color:#8a4a1e}.diagram.speakable.speaking{border-color:#ffd08a}.tip.speakable.speaking{background:#ffefcb;border-color:#ffd08a}.card.speakable.speaking{background:#ffefcb;border-color:var(--time);box-shadow:0 0 0 3px #ffe3a8}details.quiz.speakable.speaking{background:#ffefcb;border-color:var(--time)}.scene.speakable.speaking{background:#fff6dc}.chip.speaking{box-shadow:0 0 0 3px #fff,0 0 0 6px var(--time);transform:translate(-50%,-50%) scale(1.12);z-index:2}.head-line.speakable{padding:4px 10px;margin-left:-10px;display:block}.head-line.speakable.speaking{background:#ffefcb}.note.speakable+.note.speakable{margin-top:8px}.scene [data-actor]{transform-box:fill-box;transform-origin:center;transition:opacity .35s ease,transform .45s cubic-bezier(.34,1.56,.64,1),filter .35s ease}.scene [data-actor].on{opacity:1;transform:scale(1.08);filter:drop-shadow(0 0 6px rgba(255,184,77,.9))}.scene [data-actor].dim{opacity:.32}.scene .chip{transition:opacity .35s ease,transform .35s cubic-bezier(.34,1.56,.64,1),box-shadow .2s,filter .35s ease}.teacher-wrap{position:absolute;top:1%;right:1%;width:11%;min-width:46px;max-width:68px;pointer-events:none}.teacher{display:block;width:100%;height:auto;transform-box:fill-box;transform-origin:center bottom;filter:drop-shadow(0 2px 3px rgba(92,75,58,.18))}.teacher-wrap.talking .teacher{animation:teacherBob .9s ease-in-out infinite}@keyframes teacherBob{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-4px) rotate(-1.6deg)}}.teacher-mouth{transform-box:fill-box;transform-origin:center}.teacher-wrap.talking .teacher-mouth{animation:mouthTalk .28s ease-in-out infinite alternate}@keyframes mouthTalk{0%{transform:scaleY(.45)}to{transform:scaleY(1.75)}}.speech-dots{position:absolute;top:-6px;left:-10px;display:flex;gap:3px;background:#fff;border:2px solid var(--line);border-radius:999px;padding:4px 8px;opacity:0;transition:opacity .3s}.teacher-wrap.talking .speech-dots{opacity:1}.speech-dots i{display:block;width:4px;height:4px;border-radius:50%;background:var(--subj);animation:dotBlink 1.1s infinite}.speech-dots i:nth-child(2){animation-delay:.18s}.speech-dots i:nth-child(3){animation-delay:.36s}@keyframes dotBlink{0%,60%,to{opacity:.25;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}.foot{text-align:center;color:var(--ink-faint);font-size:12.5px;margin-top:64px;line-height:2}.foot code{background:#f6efdf;padding:1px 6px;border-radius:5px;font-size:12px;color:var(--ink-soft)}@media(max-width:640px){.wrap{padding:8px 14px 100px}.body,.lesson-head{padding-left:18px;padding-right:18px}.chip{font-size:11px;padding:5px 9px}.cover h1{font-size:27px}}@media print{.toolbar,.speech-head{display:none}body{background:#fff}.lesson{box-shadow:none;page-break-inside:avoid}.unit{page-break-after:avoid}.line.speaking{background:none;box-shadow:none}.line.speaking:before{background:transparent;animation:none}.line.done{color:var(--ink)}}