:root{--green:#58a735;--green-dark:#397b25;--ink:#2e3c30;--muted:#7c8578;--cream:#fffdf7;--line:#e8eade;--soft:#f1f6e9;--lime:#e6f1c9;--coral:#e98664;--white:#fff;--shadow:#d6e6b7}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font-family:'Avenir Next','Trebuchet MS','PingFang SC','Microsoft YaHei',sans-serif;font-size:14px;line-height:1.65}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}button,a{ -webkit-tap-highlight-color:transparent}button{cursor:pointer}svg{overflow:visible}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #df9a3b;outline-offset:5px}.skip{position:absolute;top:-100px}.skip:focus{top:10px;left:250px;z-index:10;background:white;padding:10px}h1,h2,h3,p{margin:0}h1{font-size:28px;line-height:1.4;letter-spacing:-.8px}h2{font-size:22px;line-height:1.45;letter-spacing:-.6px}h3{font-size:16px}p{color:var(--muted)}.sidebar{position:fixed;inset:0 auto 0 0;width:228px;border-right:1px solid var(--line);padding:38px 23px;background:var(--cream);z-index:3;display:flex;flex-direction:column}.brand{display:flex;align-items:center;gap:12px;font-size:27px;font-weight:800;line-height:1.03;letter-spacing:-1px}.brand-mark{display:block;width:55px;height:62px;background:var(--green);border-radius:19px 19px 22px 12px;color:white;font-size:44px;text-align:center;position:relative;letter-spacing:-10px;padding-right:10px;line-height:1.5}.brand-mark span{color:#d4ed9e}.brand-mark i{position:absolute;font-size:16px;right:-2px;top:-5px;color:var(--coral);font-style:normal;letter-spacing:0}.brand-dot{color:var(--green)}.brand-caption{font-size:10px;letter-spacing:2px;color:var(--muted);margin:19px 0 40px 5px}.sidebar nav{display:flex;flex-direction:column;gap:12px}.nav-item{font-weight:700;display:flex;align-items:center;gap:16px;padding:12px 18px;border:2px solid transparent;border-radius:14px;color:#828b7c}.nav-item>span{width:23px;font-size:25px;line-height:1}.nav-item:hover{background:var(--soft)}.nav-item.active{border-color:#cae3ae;background:#f0f7e6;color:var(--green-dark)}.sidebar-foot{margin-top:auto;padding:35px 15px 0;border-top:1px dashed var(--line);position:relative}.sidebar-foot p{font-size:13px;line-height:1.8}.sidebar-foot>a{display:block;font-size:11px;color:#85917e;margin-top:25px}.tiny-buddy{position:absolute;right:0;bottom:32px;width:60px;height:80px;transform:rotate(8deg)}.page-shell{margin-left:228px;max-width:1620px}.topbar{height:78px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 46px;font-size:12px}.topbar-note{color:#7a8575}.live-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--green);margin-right:9px}.topbar-right{font-size:9px;letter-spacing:2px;color:#8b9384;display:flex;align-items:center;gap:20px}.sun{font-size:25px;color:#d6ac4e}main{padding:36px 46px 60px;max-width:1340px;margin:auto}.welcome-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:26px;gap:18px}.eyebrow{font-size:10px;font-weight:700;letter-spacing:2px;color:#8a957e;display:block;margin-bottom:7px}.welcome-heading p{margin-top:9px;font-size:13px}.coral{color:var(--coral)}.date-chip{border:1px solid var(--line);border-radius:30px;font-size:10px;letter-spacing:1px;padding:8px 14px;color:#8c937e;white-space:nowrap}.hero{display:flex;background:#eaf2d7;border-radius:25px;min-height:326px;position:relative;overflow:hidden;margin-bottom:38px}.hero-copy{padding:30px 35px;position:relative;z-index:1;min-width:46%}.pill{display:inline-block;font-size:10px;letter-spacing:1px;border-radius:20px;background:#fff9ed;padding:5px 12px;color:#6f8359;font-weight:600}.hero h2{font-size:39px;line-height:1.35;margin:14px 0 12px;font-weight:800;letter-spacing:-1.5px}.hero p{font-size:12px;color:#7d8b6c}.button{border-radius:13px;display:inline-flex;align-items:center;justify-content:center;gap:18px;padding:12px 22px;font-size:12px;font-weight:700;border:2px solid transparent;min-height:46px;transition:transform .15s,box-shadow .15s}.button.primary{background:var(--green);color:white;box-shadow:0 4px 0 var(--green-dark);margin-top:20px}.button:hover{transform:translateY(-2px)}.button:active{transform:translateY(3px);box-shadow:none}.button.secondary{border-color:#dce4d0;background:white;color:var(--green-dark)}.hero-illustration{position:relative;flex:1;min-width:390px;align-self:stretch}.grass{position:absolute;bottom:20px;left:8px;right:15px;height:68px;border-radius:50%;background:#d9e8b6;transform:rotate(-4deg)}.hero-grandpa{position:absolute;width:180px;height:240px;bottom:31px;left:122px}.hero-golden{position:absolute;width:164px;height:200px;bottom:21px;left:10px;transform:rotate(-5deg)}.hero-collie{position:absolute;width:153px;height:184px;bottom:17px;left:251px;transform:rotate(6deg)}.floating-note{background:white;padding:9px 16px;border-radius:15px 15px 15px 2px;font-size:12px;font-weight:700;position:absolute;color:#749357;box-shadow:0 3px 0 #dce8c5;z-index:2}.note-one{top:37px;left:29px;transform:rotate(-7deg)}.note-two{bottom:26px;right:27px;transform:rotate(6deg);font-size:10px}.doodle-star{position:absolute;color:#9fb870;font-size:35px}.star-one{top:54px;right:34px}.star-two{top:111px;left:6px;font-size:24px}.learning-layout{display:grid;grid-template-columns:minmax(0,1fr) 277px;gap:30px}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:18px}.section-heading h2{font-size:21px}.text-link{font-size:11px;color:#7c9c60;font-weight:700;white-space:nowrap}.unit-banner{background:var(--green);color:white;border-radius:14px;padding:17px 19px;display:flex;gap:14px;align-items:center;box-shadow:0 4px 0 #498e2c}.unit-banner span:not(.unit-icon):not(.unit-count){font-size:9px;letter-spacing:1px;opacity:.8}.unit-banner h3{font-size:15px;margin-top:3px}.unit-icon{font-size:26px;color:#d9efb7}.unit-count{margin-left:auto;font-size:12px;background:#ffffff21;border-radius:9px;padding:7px 10px;white-space:nowrap}.lesson-path{padding:30px 4px 0;position:relative}.lesson-path:before{content:'';position:absolute;width:4px;top:25px;bottom:80px;left:76px;background:repeating-linear-gradient(to bottom,#dbe5cc 0 8px,transparent 8px 15px);border-radius:4px}.path-row{display:flex;align-items:center;gap:26px;min-height:110px;position:relative;padding-left:34px}.path-row:nth-child(2n){padding-left:63px}.path-node{display:flex;justify-content:center;align-items:center;flex-shrink:0;width:77px;height:65px;border-radius:50%;background:#eef2e6;border:6px solid var(--cream);box-shadow:0 5px 0 #dfe5d5;font-size:25px;font-weight:800;color:#bdc8b1;position:relative;z-index:1;transition:transform .2s}.path-node:hover{transform:translateY(-4px)}.done .path-node{background:#e4edcf;color:#79a84a;box-shadow:0 5px 0 #b8cc92}.current .path-node{background:var(--green);color:#fff8d8;box-shadow:0 5px 0 var(--green-dark);outline:2px dashed #b6d88e;outline-offset:6px;font-size:28px}.path-label>span{font-size:9px;color:#9ca78e;font-weight:700;letter-spacing:1.5px}.path-label i{font-style:normal;font-size:9px;font-weight:400;margin-left:8px;letter-spacing:0}.path-label h3{font-size:15px;letter-spacing:0;margin:3px 0}.path-label p{font-size:10px;color:#98a18d;max-width:230px}.current{min-height:144px}.current .path-label>span{color:var(--green)}.small-cta{display:inline-block;margin-top:9px;color:var(--green-dark);font-size:11px;font-weight:800}.path-end{text-align:center;margin:28px 0}.path-end>span{font-size:36px;color:#b6c49f}.path-end p{font-size:11px;margin-top:5px}.journey-aside{display:flex;flex-direction:column;gap:20px;padding-top:7px}.panel{border:1.5px solid var(--line);border-radius:19px;padding:23px;background:var(--cream)}.compact{margin-bottom:21px}.compact h3{font-size:14px}.spark{font-size:25px;color:#b5c193}.progress-label{display:flex;justify-content:space-between;align-items:baseline;font-size:11px;margin-bottom:9px;color:#8c9582}.progress-label strong{font-size:20px;color:var(--green-dark)}.progress-label small{font-size:10px;color:#939e88;font-weight:400}.progress-track{height:10px;background:#eaf0e1;border-radius:10px;overflow:hidden}.progress-track span{height:100%;display:block;border-radius:10px;background:var(--green);min-width:0;transition:width .5s}.second{margin-top:20px}.progress-track.pale span{background:#b8cc85}.fine-print{font-size:10px;line-height:1.9;color:#9aa18e;margin-top:20px}.buddy-card{border-radius:20px;background:#f4eddf;padding:26px 20px 20px;position:relative;overflow:hidden;min-height:220px}.buddy-card>svg{position:absolute;right:-11px;bottom:-34px;width:112px;height:150px;transform:rotate(-9deg)}.buddy-card h3{font-size:18px;line-height:1.5;margin:9px 0}.buddy-card p{font-size:11px;line-height:1.9;color:#9c907c}.buddy-card .eyebrow{font-size:9px;letter-spacing:1px}.buddy-card-copy{position:relative;z-index:1}.badge-panel{text-align:center}.badge-panel .section-heading{text-align:left}.badge-preview{margin:5px auto 14px;border:2px dashed #e1d6bc;border-radius:50%;height:62px;width:62px;line-height:58px;color:#cebf9c;font-size:30px}.badge-panel p{font-size:11px}.badge-panel>small{font-size:9px;color:#a3aa97}.badge-mini{display:flex;align-items:center;gap:14px;text-align:left;margin-top:15px}.badge-mini>span{font-size:25px;color:#c2a554}.badge-mini strong{font-size:12px}.badge-mini small{display:block;color:var(--muted);font-size:10px}footer{padding:25px 46px 30px;border-top:1px solid var(--line);color:#99a18f;font-size:9px;letter-spacing:2px;display:flex;align-items:center;gap:25px}footer span{letter-spacing:1px;font-size:10px}footer>a{margin-left:auto;letter-spacing:0}.session-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.session-card{display:block;border:1.5px solid var(--line);border-radius:20px;padding:24px;transition:transform .2s,box-shadow .2s}.session-card:hover{transform:translateY(-4px);box-shadow:0 5px 0 #e8eddc}.card-meta{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px;font-size:10px;letter-spacing:1px;color:var(--green)}.state{font-size:10px;background:#edf3e3;border-radius:8px;color:#799657;padding:5px 10px;white-space:nowrap;letter-spacing:0}.state.prepared{background:#f7edcc;color:#b38d39}.session-card h2{font-size:18px;margin-bottom:9px}.session-card p{font-size:11px;min-height:36px}.card-bottom{margin-top:26px;display:flex;align-items:center;justify-content:space-between;font-size:10px;color:#9aa58a}.round-arrow{font-size:19px;color:var(--green);background:var(--soft);width:33px;height:33px;text-align:center;border-radius:50%}.stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:35px}.big-number{font-size:52px;color:var(--green);margin:15px 0 2px}.big-number small{font-size:20px;color:#b7c0a9}.stats-grid p{font-size:12px;margin-bottom:15px}.earned-badge{text-align:center}.badge-emblem{font-size:45px;color:#d1ae56;display:block}.empty-state{grid-column:1/-1;text-align:center;padding:35px}.empty-buddy{width:110px;height:130px;margin-bottom:15px}.empty-state h3{font-size:20px;margin-bottom:10px}.empty-state p{font-size:12px}.back-link{display:inline-block;font-size:11px;color:var(--green-dark);margin-bottom:23px}.goal-card{display:flex;align-items:center;gap:24px;border-radius:22px;background:#eaf2d7;padding:20px 30px;margin-bottom:28px}.goal-card>svg{width:95px;height:115px;flex-shrink:0}.goal-card h2{font-size:21px;margin-bottom:8px}.goal-card p{font-size:13px;max-width:650px;color:#81936a}.lesson-detail-grid{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:28px}.lesson-detail-grid h2{font-size:19px}.review-panel>p{font-size:11px;margin:9px 0 20px}.review-sentence{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding:11px 0;font-size:15px;gap:15px}.review-sentence:last-child{border-bottom:0}.audio-button{border:1px solid #dfE9d3;border-radius:10px;padding:7px 11px;background:#f3f8ed;color:var(--green-dark);font-size:11px;flex-shrink:0}.expressions-section,.activities-section{margin-top:30px}.text-button{background:none;border:0;color:var(--green-dark);font-size:11px;padding:8px}.expression-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.expression-card{border:1.5px solid var(--line);border-radius:17px;padding:22px;position:relative;background:#fff}.expression-number{font-size:10px;color:#b6c3a7;letter-spacing:2px}.expression-card h3{font-size:17px;margin:12px 0 7px;line-height:1.5}.expression-card p{font-size:11px}.expression-card .audio-button{margin-top:16px}.activity{border:1.5px solid var(--line);border-radius:15px;margin-bottom:13px;overflow:hidden}.activity summary{padding:17px;display:flex;align-items:center;gap:12px;cursor:pointer;list-style:none;font-weight:700;font-size:13px}.activity summary::-webkit-details-marker{display:none}.activity summary>small{margin-left:auto;font-weight:400;white-space:nowrap;color:#a0a992;font-size:10px}.step-number{width:30px;height:30px;border-radius:10px;display:flex;align-items:center;justify-content:center;color:var(--green-dark);background:#eaf2dc;flex-shrink:0}.chevron{color:#a4b48f}.activity[open] summary{background:#f4f8ed}.activity-body{padding:20px 23px;font-size:12px}.hint{background:#f8f4e9;border-radius:12px;padding:13px 16px;margin-top:15px;color:#b09a66;font-size:11px}.hint p{margin-top:6px;color:#a28e64}.task-output{border-left:3px solid #aad07c;padding-left:14px;margin-top:20px}.task-output>span{font-size:10px;letter-spacing:1px;color:var(--green)}.task-output p{margin-top:6px}.lesson-aside{display:flex;flex-direction:column;gap:20px}.lesson-aside .panel{padding:20px}.lesson-aside h3{margin-bottom:15px}.source-card{display:flex;flex-direction:column;background:#f2f6e9;border-radius:12px;padding:15px;margin-top:14px;gap:5px}.source-card span{font-size:9px;letter-spacing:1px;color:#9caf85}.source-card strong{font-size:12px}.source-card small{font-size:10px;color:var(--green)}.bilibili-link{display:block;margin-top:20px;font-size:11px;color:#81a7ad}.plan-b{border:1.5px dashed #dbcbaa;background:#fcf8ee;border-radius:19px;padding:20px}.plan-b .pill{font-size:9px;background:#f1e8d1;color:#ac9465}.plan-b h3{margin:12px 0}.plan-b p{font-size:12px;color:#a08f70}.grandpa-card{background:#eaf0ec;min-height:240px}.grandpa-card>svg{width:100px;bottom:-25px}.exit-card{background:#eaf2d7;border-radius:19px;margin-top:30px;padding:25px}.exit-card h2{margin-bottom:12px}.exit-card>p{font-size:12px;color:#83956c}.toast{position:fixed;bottom:28px;left:50%;transform:translate(-50%,20px);background:#374b30;color:white;padding:12px 22px;border-radius:12px;box-shadow:0 5px 25px #0002;opacity:0;transition:.2s;pointer-events:none;z-index:20;font-size:12px}.toast.visible{opacity:1;transform:translate(-50%,0)}.video-player{width:100%;max-height:72vh;background:#213125;border-radius:18px}.chapter-button{display:flex;text-align:left;gap:15px;width:100%;padding:13px;background:transparent;border:0;border-bottom:1px solid var(--line);color:var(--ink)}.chapter-button strong{color:var(--green)}.empty-text{padding:30px;font-size:12px}.recording-duration{font-size:11px;color:var(--muted);margin-top:10px}
@media(min-width:1500px){.hero-illustration{margin-right:50px}.hero-copy{padding-left:45px}.hero h2{font-size:46px}.hero-grandpa{left:150px}.hero-collie{left:290px}.hero-golden{left:38px}.hero{min-height:355px}}
@media(max-width:1200px){.sidebar{width:200px;padding:32px 17px}.page-shell{margin-left:200px}main{padding:30px}.topbar{padding:0 30px}.learning-layout{grid-template-columns:minmax(0,1fr) 245px;gap:22px}.hero-copy{padding:28px;min-width:44%}.hero-illustration{min-width:320px}.hero-grandpa{left:95px;width:155px}.hero-golden{left:0;width:140px}.hero-collie{left:210px;width:130px}.hero h2{font-size:34px}.note-two{right:10px}.session-grid{grid-template-columns:1fr 1fr}.lesson-detail-grid{grid-template-columns:minmax(0,1fr) 235px;gap:20px}.path-label p{max-width:175px}.path-row{gap:18px}}
@media(max-width:1000px){.learning-layout{grid-template-columns:1fr}.journey-aside{display:grid;grid-template-columns:1fr 1fr;align-items:start}.badge-panel{grid-column:1/-1}.hero-illustration{min-width:280px}.hero-grandpa{left:85px;width:135px;bottom:35px;height:210px}.hero-golden{width:125px;left:0;height:170px}.hero-collie{width:118px;left:185px;height:160px}.floating-note{font-size:10px}.note-one{left:10px;top:40px}.note-two{font-size:9px;bottom:14px}.hero h2{font-size:31px}.hero-copy{padding:25px}.hero p{font-size:11px}.hero .button{padding:10px 14px;font-size:11px;gap:10px}.date-chip{display:none}.lesson-detail-grid{grid-template-columns:1fr}.lesson-aside{display:grid;grid-template-columns:1fr 1fr;align-items:start}.lesson-path:before{left:50%}.path-row{padding-left:calc(50% - 70px)}.path-row:nth-child(2n){padding-left:calc(50% - 30px)}}
@media(max-width:760px){.sidebar{inset:auto 0 0;width:100%;height:76px;padding:0 8px;border:0;border-top:1px solid var(--line);background:#fffdf7f5;backdrop-filter:blur(14px)}.sidebar .brand,.brand-caption,.sidebar-foot{display:none}.sidebar nav{height:100%;flex-direction:row;gap:0;justify-content:space-around}.nav-item{font-size:9px;flex-direction:column;gap:4px;border:0!important;padding:10px 12px;border-radius:0;min-width:64px}.nav-item.active{background:transparent}.nav-item>span{font-size:24px}.page-shell{margin:0}.topbar{height:61px;padding:0 22px}.topbar-note{font-size:11px}.topbar-right{font-size:7px;letter-spacing:1px;gap:10px}main{padding:25px 20px 35px}h1{font-size:23px}.welcome-heading{margin-bottom:22px}.eyebrow{font-size:8px;letter-spacing:1.6px}.welcome-heading p{font-size:11px;max-width:90%}.hero{min-height:440px;border-radius:22px;display:block;margin-bottom:30px}.hero-copy{padding:25px;max-width:75%}.hero h2{font-size:31px;margin-top:12px;line-height:1.3}.hero p{display:none}.hero .button{margin-top:15px;position:relative;z-index:2}.hero-illustration{position:absolute;bottom:0;right:0;left:0;height:235px;min-width:0;pointer-events:none}.hero-grandpa{width:145px;height:200px;bottom:23px;left:calc(50% - 44px)}.hero-golden{width:130px;height:170px;left:calc(50% - 144px);bottom:16px}.hero-collie{width:122px;height:164px;left:calc(50% + 65px);bottom:8px}.grass{left:5%;right:5%;bottom:12px;height:50px}.note-one{right:15px;left:auto;top:13px;transform:rotate(7deg)}.note-two{display:none}.star-one{top:16px;left:25px}.star-two{top:74px;left:43px}.unit-banner{padding:15px}.unit-banner h3{font-size:13px}.unit-banner span:not(.unit-icon):not(.unit-count){font-size:8px}.unit-count{font-size:10px;padding:5px 8px}.unit-icon{font-size:22px}.section-heading h2{font-size:19px}.text-link{font-size:10px}.lesson-path:before{left:75px}.path-row{padding-left:26px;gap:19px;min-height:110px}.path-row:nth-child(2n){padding-left:54px}.path-label h3{font-size:14px}.path-label p{font-size:9px;max-width:205px}.path-row.current{min-height:150px}.path-node{width:72px;height:63px}.journey-aside{grid-template-columns:1fr;gap:18px}.badge-panel{grid-column:auto}.buddy-card{min-height:195px}.buddy-card>svg{width:127px;right:10px;bottom:-25px}.progress-panel{padding:24px}.progress-label{font-size:12px}.progress-label strong{font-size:24px}.progress-track{height:12px}footer{padding:22px 20px 100px;gap:10px;flex-wrap:wrap}footer span{font-size:9px}.session-grid{grid-template-columns:1fr}.session-card{padding:25px}.card-meta{margin-bottom:18px}.session-card p{min-height:0}.card-bottom{margin-top:18px}.stats-grid{gap:13px}.stats-grid .panel{padding:18px}.big-number{font-size:40px}.big-number small{font-size:14px}.stats-grid p{font-size:10px}.goal-card{gap:14px;padding:18px}.goal-card>svg{width:70px;height:100px}.goal-card h2{font-size:18px}.goal-card p{font-size:11px}.lesson-aside{grid-template-columns:1fr}.expression-grid{gap:12px}.expression-card{padding:17px}.expression-card h3{font-size:14px;overflow-wrap:anywhere}.expression-card p{font-size:10px}.activity summary{font-size:12px;padding:14px;gap:9px}.activity-body{padding:18px}.review-sentence{font-size:13px}.toast{width:85%;text-align:center;bottom:95px}.skip:focus{left:15px}.hero-copy .pill{font-size:9px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.practice-panel{margin-top:28px;background:#f5f8ee}.quiz-question{font-size:24px;font-weight:700;color:var(--ink);margin:25px 0 20px}.quiz-choices{display:grid;gap:10px}.quiz-choice{min-height:46px;background:#fff;border:1.5px solid #dfe8d3;border-radius:12px;text-align:left;padding:12px 16px;color:var(--ink);box-shadow:0 3px 0 #e1e8d6}.quiz-choice:hover{border-color:#99c871}.quiz-choice.correct{background:#e0f2cc;border-color:var(--green);color:var(--green-dark)}.quiz-choice.retry{background:#f8efdf;color:#9d937e}.quiz-feedback{font-size:12px;margin-top:18px;min-height:40px;color:#769257}[hidden]{display:none!important}