:root{--ink:#292d28;--muted:#858a81;--line:#ebeae3;--paper:#f8f7f2;--green:#42604c;--coral:#e47b63}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--paper);color:var(--ink);font:14px 'DM Sans',sans-serif}button,input{font:inherit}button{cursor:pointer}.hidden{display:none!important}.app-shell{min-height:100vh;display:flex}.sidebar{width:242px;flex:0 0 242px;background:white;border-right:1px solid #eeede8;padding:25px 17px 14px;display:flex;flex-direction:column;min-height:100vh}.brand,.auth-brand{display:flex;align-items:center;gap:9px;color:var(--ink);text-decoration:none;font:800 22px Manrope,sans-serif;letter-spacing:-1.3px}.brand{margin:0 0 48px 9px}.brand-mark{width:30px;height:30px;border-radius:10px;background:var(--coral);color:white;display:grid;place-items:center;font:800 20px Manrope;transform:rotate(-8deg)}.sidebar-label{font-size:9px;font-weight:700;letter-spacing:1.2px;color:#a1a49c;margin:0 10px 10px}.main-nav{display:grid;gap:4px}.nav-item{height:42px;padding:0 12px;display:flex;gap:12px;align-items:center;border:0;border-radius:8px;background:transparent;color:#787e77;font-size:12px;font-weight:600;text-align:left}.nav-item.active{background:#f4f3ed;color:#3d5d48}.nav-icon{font-size:17px;width:17px;text-align:center;color:#899188}.side-divider{border-top:1px solid #f0efe9;margin:23px 4px 19px}.side-course{margin:0 4px;display:flex;align-items:center;gap:10px;padding:10px;border-radius:9px;background:#f8f7f3}.flag{font-size:22px}.side-course b,.profile b{display:block;font-size:11px}.side-course small,.profile small{display:block;color:#989b93;font-size:9px;margin-top:3px}.side-bottom{margin-top:auto}.streak-card{background:#f9f5eb;border-radius:9px;padding:11px 10px;display:flex;gap:9px;align-items:center;margin-bottom:13px}.streak-icon{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;background:#f2e3bd;color:#b8822b}.streak-card b{font-size:10px;display:block}.streak-card small{display:block;color:#a19b8c;font-size:9px;margin-top:3px}.profile{border:0;background:transparent;border-top:1px solid #f0efe9;padding:14px 3px 5px;display:flex;align-items:center;text-align:left;width:100%;gap:9px}.avatar{width:30px;height:30px;border-radius:50%;background:#e8c8ba;color:#885f52;display:grid;place-items:center;font-weight:700}.dots{margin-left:auto;color:#96988f}.signout-button{border:0;background:none;color:#9a9c95;font-size:10px;padding:8px 4px 0 42px;text-align:left}.main-content{flex:1;min-width:0}.topbar{height:61px;border-bottom:1px solid #efeee8;display:flex;align-items:center;justify-content:space-between;padding:0 5%;background:#ffffff70}.breadcrumb{font-size:11px;color:#999b95}.breadcrumb b{font-weight:600;color:#4b4d48;margin-left:14px;padding-left:14px;border-left:1px solid #ddd}.top-actions{display:flex;align-items:center;gap:10px}.streak-pill{background:#f9f3e5;color:#a77934;border-radius:20px;padding:7px 11px;font-size:11px}.streak-pill b{font-size:10px;color:#686351;margin-left:3px}.mobile-signout{display:none;border:0;background:transparent;color:#697268;font-size:20px}.content-wrap{max-width:1000px;margin:0 auto;padding:35px 40px 22px}.view{display:none}.view.active-view{display:block}.welcome-row{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:23px}.eyebrow{font-size:9px;font-weight:700;letter-spacing:1.2px;color:#999c94}.welcome-row h1,.page-heading h1{font:700 30px Manrope,sans-serif;letter-spacing:-1.35px;margin:7px 0 5px}.wave{font-size:17px;color:#e9a273}.welcome-row p,.page-heading p{margin:0;color:#8d908a;font-size:11px}.week-card{width:160px;padding:11px 13px;border:1px solid #ebe9e2;border-radius:10px;background:#ffffff90;display:flex;align-items:center;justify-content:space-between}.week-copy span{font-size:8px;letter-spacing:.9px;color:#9b9d96;display:block;font-weight:700}.week-copy>b{display:block;font:700 18px Manrope;margin-top:5px}.week-copy small{font:500 10px 'DM Sans';color:#9d9e97}.week-mark{width:30px;height:30px;border-radius:50%;background:#f4eedb;color:#b38a4d;display:grid;place-items:center}.hero-card{min-height:264px;display:flex;overflow:hidden;position:relative;border-radius:12px;background:#dfe9db;margin-bottom:28px}.hero-copy{padding:25px 0 21px 31px;position:relative;z-index:2;width:57%;max-width:475px}.lesson-tag{font-size:8px;font-weight:700;letter-spacing:1px;color:#637665;display:flex;align-items:center;gap:7px}.tag-dot{height:6px;width:6px;border-radius:50%;background:#739071}.hero-copy h2{font:700 32px/1.1 Manrope,sans-serif;letter-spacing:-1.3px;margin:17px 0 8px;color:#324638;max-width:360px}.hero-copy p{font-size:11px;line-height:1.6;color:#718174;margin:0;max-width:300px}.lesson-meta{display:flex;gap:16px;margin:14px 0;color:#728274;font-size:9px}.lesson-meta b{font-weight:500}.primary-button{border:0;background:#42604c;color:white;border-radius:6px;padding:10px 13px;font:600 10px 'DM Sans';transition:transform .15s,background .15s}.primary-button:hover{transform:translateY(-1px);background:#334e3d}.primary-button span{margin-left:18px;font-size:14px}.hero-art{position:absolute;right:0;top:0;width:45%;height:100%;overflow:hidden;background:linear-gradient(145deg,#e7eee2,#cad9c9)}.sun{position:absolute;width:100px;height:100px;border-radius:50%;background:#efd09d;right:70px;top:15px}.speech-bubble{position:absolute;z-index:4;right:21%;top:35px;border-radius:12px 12px 12px 2px;background:#fffdf6;padding:9px 13px;font:600 14px Georgia;color:#43614f;box-shadow:0 5px 16px #445c4420;transform:rotate(3deg)}.speech-bubble span{font-size:13px}.art-person{position:absolute;bottom:0;left:39%;width:130px;height:210px}.face{position:absolute;top:34px;left:30px;width:70px;height:78px;border-radius:45% 45% 47% 48%;background:#c77d60;z-index:2}.hair{position:absolute;z-index:3;top:22px;left:26px;width:77px;height:52px;border-radius:50% 48% 31% 34%;background:#41352f;transform:rotate(-3deg)}.hair:after{content:'';position:absolute;right:1px;top:27px;height:42px;width:20px;background:#41352f;border-radius:0 0 70% 40%;transform:rotate(-10deg)}.face i{position:absolute;top:37px;width:4px;height:5px;border-radius:50%;background:#42332d;left:18px}.face i:nth-child(2){left:auto;right:17px}.face b{position:absolute;width:13px;height:6px;left:29px;top:53px;border-bottom:1.5px solid #6c3733;border-radius:50%}.neck{position:absolute;top:102px;left:51px;width:29px;height:26px;background:#bd7357;z-index:1}.shirt{position:absolute;bottom:-18px;left:9px;width:116px;height:104px;background:#d87761;border-radius:44px 44px 0 0;z-index:2}.shirt:before{content:'';position:absolute;top:1px;left:34px;border-left:24px solid transparent;border-right:24px solid transparent;border-top:24px solid #f5ddc7}.arm{position:absolute;z-index:3;width:25px;height:72px;border-radius:18px;background:#c77d60;right:2px;top:97px;transform:rotate(-25deg)}.plant{position:absolute;z-index:4;bottom:12px;left:12%;width:42px;height:61px}.plant b{position:absolute;bottom:0;left:7px;width:27px;height:24px;background:#bd725b;border-radius:3px 3px 9px 9px}.plant i{position:absolute;bottom:19px;left:18px;width:10px;height:34px;border-radius:100% 0 100% 0;background:#61836c;transform:rotate(-35deg);transform-origin:bottom}.plant i:nth-child(2){transform:rotate(25deg);height:28px;left:19px}.plant i:nth-child(3){transform:rotate(-5deg);height:30px;left:11px}.art-floor{height:17px;position:absolute;bottom:0;width:100%;background:#8ea28c}.lower-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:18px}.section-heading{display:flex;justify-content:space-between;align-items:flex-end;margin:0 0 12px}.section-heading h3,.level-card h3{font:700 16px Manrope,sans-serif;letter-spacing:-.45px;margin:5px 0 0}.text-link{border:0;background:transparent;font-size:10px;color:#72776e}.text-link span{font-size:14px;margin-left:6px}.path-list{border:1px solid #eeece5;border-radius:10px;background:#fff;padding:2px 13px}.path-row{width:100%;border:0;background:transparent;display:flex;align-items:center;text-align:left;gap:9px;padding:10px 0;color:var(--ink);border-bottom:1px solid #f1f0eb}.path-row:last-child{border-bottom:0}.path-row.clickable{cursor:pointer}.path-icon{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;font-size:16px;flex-shrink:0}.path-icon.coral{background:#fae9e2;color:#d57760}.path-icon.lavender{background:#efedf8;color:#8b80af}.path-icon.butter{background:#fbf1d7;color:#c2964e}.path-text{min-width:0;flex:1}.path-text b{font-size:10px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.path-text small{font-size:9px;color:#9c9e97;display:block;margin-top:3px}.path-progress{height:4px;border-radius:5px;background:#efeee9;width:42px;overflow:hidden;flex-shrink:0}.path-progress i{height:100%;display:block;background:#789578;border-radius:5px}.path-percent{font-size:9px;color:#8d9089;width:22px;text-align:right}.path-arrow{font-size:19px;color:#aaaca5}.level-card{border:1px solid #eeece5;border-radius:10px;background:#fff;padding:15px 16px}.level-top{display:flex;justify-content:space-between;align-items:center}.level-spark{width:28px;height:28px;display:grid;place-items:center;background:#f4f1e6;border-radius:9px;color:#b79552;font-size:16px}.level-card>p{margin:8px 0 13px;color:#969891;font-size:10px;line-height:1.6}.course-facts{display:grid;gap:8px;padding:11px 0;border-top:1px solid #f1f0eb;border-bottom:1px solid #f1f0eb;color:#858980;font-size:9px}.course-facts b{color:#47614c;font-size:11px;margin-right:5px}.level-note{font-size:9px;line-height:1.55;color:#999b95;margin-top:10px}.page-heading{margin:4px 0 22px}.lesson-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.lesson-card{border:1px solid #ebeae3;border-radius:11px;background:#fff;padding:16px;display:flex;gap:12px;align-items:flex-start}.lesson-card-icon{width:39px;height:39px;border-radius:11px;background:#fae9e2;color:#c86c58;display:grid;place-items:center;font-size:18px;flex-shrink:0}.lesson-card:nth-child(3n+2) .lesson-card-icon{background:#efedf8;color:#8275ad}.lesson-card:nth-child(3n) .lesson-card-icon{background:#f8f0d9;color:#b18942}.lesson-card-body{min-width:0;flex:1}.lesson-card h3{font:700 13px Manrope;margin:1px 0 5px;line-height:1.4}.lesson-card p{font-size:10px;color:#91948c;margin:0 0 11px;line-height:1.5}.lesson-card-meta{font-size:9px;color:#8e938a;display:flex;gap:9px}.lesson-start{margin-left:auto;align-self:center;border:0;background:#f0f4ee;color:#48624e;border-radius:7px;padding:8px 10px;font-size:10px;font-weight:600;white-space:nowrap}.wordbook{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.word-card{background:#fff;border:1px solid var(--line);border-radius:9px;padding:14px}.word-card b{font:700 14px Manrope;color:#405b48}.word-card span{display:block;color:#555a52;font-size:11px;margin-top:5px}.word-card small{display:block;color:#9a9c95;font-size:9px;line-height:1.4;margin-top:6px}.lesson-view{max-width:760px;margin:0 auto}.back-button{border:0;background:transparent;color:#758071;font-size:12px;padding:0;margin:0 0 18px}.lesson-titlebar{background:#e5ede1;border-radius:12px;padding:22px;margin-bottom:18px}.lesson-titlebar .eyebrow{color:#687d6b}.lesson-titlebar h1{font:700 26px/1.2 Manrope;letter-spacing:-1px;margin:8px 0}.lesson-titlebar p{font-size:11px;color:#788578;margin:0}.lesson-titlemeta{display:flex;gap:12px;color:#728174;font-size:9px;margin-top:11px}.vocab-panel,.exercise-panel,.result-panel{border:1px solid var(--line);background:white;border-radius:11px;padding:19px;margin-bottom:14px}.panel-label{font-size:9px;font-weight:700;letter-spacing:1px;color:#999c94;margin-bottom:13px}.vocab-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.vocab-item{border-radius:8px;padding:11px;background:#faf9f5}.vocab-item b{font:700 13px Manrope;color:#42604c}.vocab-item span{display:block;font-size:10px;margin-top:3px}.vocab-item small{display:block;color:#95988f;font-size:9px;line-height:1.4;margin-top:5px}.start-practice{width:100%;border:0;background:var(--green);color:#fff;border-radius:8px;padding:13px;font-size:11px;font-weight:700}.exercise-top{display:flex;align-items:center;justify-content:space-between;color:#92958d;font-size:9px;margin-bottom:14px}.exercise-count{font-weight:700;letter-spacing:.6px}.exercise-progress{height:4px;background:#efeee9;border-radius:5px;margin-bottom:19px}.exercise-progress i{display:block;height:100%;background:#789578;border-radius:5px;transition:width .2s}.exercise-prompt{font:700 17px/1.4 Manrope;letter-spacing:-.3px;margin:0 0 8px}.exercise-subtitle{font-size:10px;color:#969990;line-height:1.5;margin:0 0 14px}.speak-button{border:1px solid #e9e8e1;background:#faf9f5;border-radius:7px;padding:8px 10px;color:#526a56;font-size:10px;margin-bottom:13px}.choice-list{display:grid;gap:8px}.choice-button{border:1px solid #e8e7df;background:#fff;border-radius:8px;padding:12px;text-align:left;font-size:11px;color:#4e524c}.choice-button.selected{border-color:#6d8c70;background:#f3f8f0;color:#3e5a43}.choice-button.correct{border-color:#73a077;background:#eff7ed}.choice-button.incorrect{border-color:#d99686;background:#fff4f1}.check-answer,.next-question,.finish-lesson{margin-top:14px;width:100%;border:0;background:#42604c;color:#fff;border-radius:7px;padding:12px;font-size:11px;font-weight:700}.check-answer:disabled{opacity:.45}.answer-explanation{padding:10px 12px;background:#f0f6ed;color:#4e6951;font-size:10px;line-height:1.5;border-radius:7px;margin-top:10px}.result-panel{text-align:center;padding:30px 20px}.result-icon{width:54px;height:54px;background:#f3edda;color:#a17c35;border-radius:50%;display:grid;place-items:center;font-size:24px;margin:0 auto 12px}.result-panel h2{font:700 23px Manrope;margin:0 0 5px}.result-panel p{font-size:11px;color:#858a81;line-height:1.6}.score-line{font:700 18px Manrope;color:#49634d;margin:12px}footer{border-top:1px solid #eeece6;margin-top:24px;padding-top:12px;color:#9b9c95;font:italic 10px Georgia}footer span{margin-left:5px;color:#b2b2aa}.footer-flower{float:right;font-size:14px;color:#d49b74}.auth-screen{min-height:100svh;display:flex;flex-direction:column;align-items:center;padding:clamp(25px,7vh,65px) 18px 20px;background:radial-gradient(ellipse at 48% 42%,#f1eee1 0%,#f8f7f2 60%)}.auth-brand{margin-bottom:clamp(30px,7vh,58px)}.auth-card{width:min(420px,100%);background:white;border:1px solid #efeee8;border-radius:15px;padding:clamp(23px,6vw,36px);box-shadow:0 15px 50px #373b3010}.auth-kicker{text-align:center;color:#8b9889;font-size:9px;font-weight:700;letter-spacing:1.35px}.auth-card h1{text-align:center;font:700 27px Manrope;letter-spacing:-1px;margin:10px 0 7px}.auth-card>p{text-align:center;color:#888c84;font-size:11px;line-height:1.6;margin:0 auto 22px;max-width:285px}.field{display:block;font-size:10px;font-weight:700;color:#575c55;margin-bottom:14px}.field input{display:block;margin-top:7px;width:100%;height:44px;border:1px solid #e6e5de;border-radius:7px;padding:0 12px;outline:none;font-size:12px;color:#363a35;background:white}.field input:focus{border-color:#829982;box-shadow:0 0 0 3px #82998220}.auth-submit{width:100%;height:45px;border:0;border-radius:7px;background:#42604c;color:white;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:space-between;padding:0 15px;margin-top:5px}.auth-submit:disabled{opacity:.6;cursor:wait}.auth-message{min-height:16px;text-align:center;color:#b34e42;font-size:10px;line-height:1.5;margin-top:10px}.auth-message.success{color:#4e7653}.auth-switch{text-align:center;font-size:10px;color:#8b8e87;margin-top:8px}.auth-switch button{border:0;background:none;color:#47624d;font-weight:700;padding:0 2px}.auth-note{border-top:1px solid #f0efe9;margin-top:21px;padding-top:16px;display:flex;align-items:flex-start;gap:8px;font-size:9px;color:#999c94;line-height:1.5}.auth-note span{color:#54745a;font-size:15px}.auth-footer{margin-top:auto;padding-top:25px;color:#a3a59e;font:italic 10px Georgia}.auth-footer span{color:#d49b74;margin-left:4px}.mobile-nav{display:none}
@media(max-width:900px){.sidebar{width:204px;flex-basis:204px}.content-wrap{padding:29px 25px 18px}.hero-art{width:46%}.hero-copy{width:60%}.lower-grid{grid-template-columns:1fr}.course-facts{grid-template-columns:repeat(3,1fr)}}
@media(max-width:640px){.sidebar{display:none}.main-content{width:100%;padding-bottom:calc(67px + env(safe-area-inset-bottom))}.topbar{height:51px;padding:0 17px}.mobile-signout{display:block}.content-wrap{padding:24px 16px 19px}.welcome-row{align-items:flex-start;gap:13px;flex-direction:column;margin-bottom:17px}.welcome-row h1,.page-heading h1{font-size:27px}.welcome-row p,.page-heading p{font-size:10px}.week-card{width:100%;padding:9px 12px}.week-mark{width:27px;height:27px}.hero-card{min-height:440px;display:block;margin-bottom:23px}.hero-copy{width:100%;padding:21px 19px 18px;max-width:none}.hero-copy h2{font-size:29px;margin:12px 0 6px;max-width:290px}.hero-copy p{font-size:10px}.lesson-meta{gap:12px;margin:10px 0;font-size:8px}.primary-button{padding:10px 12px}.hero-art{top:auto;bottom:0;width:100%;height:53%}.sun{width:82px;height:82px;right:16%;top:15px}.speech-bubble{right:14%;top:22px}.art-person{left:40%;transform:scale(.9);transform-origin:bottom}.plant{left:11%}.lower-grid{gap:15px}.section-heading h3,.level-card h3{font-size:15px}.path-list{padding:2px 10px}.path-row{gap:7px;padding:10px 0}.path-icon{width:30px;height:30px}.path-text b{font-size:9px}.path-text small{font-size:8px}.path-progress{width:32px}.course-facts{grid-template-columns:1fr 1fr;gap:7px}.course-facts span:last-child{grid-column:1/-1}.lesson-grid{grid-template-columns:1fr;gap:9px}.lesson-card{padding:13px;gap:10px}.lesson-card-icon{width:35px;height:35px}.lesson-card h3{font-size:12px}.lesson-card p{font-size:9px;margin-bottom:8px}.lesson-start{padding:8px 10px;font-size:9px}.wordbook{grid-template-columns:1fr 1fr;gap:7px}.word-card{padding:11px}.word-card b{font-size:12px}.word-card span{font-size:10px}.word-card small{font-size:8px}.lesson-view{margin:0}.back-button{margin-bottom:13px}.lesson-titlebar{padding:18px 16px;margin-bottom:11px}.lesson-titlebar h1{font-size:23px}.vocab-panel,.exercise-panel,.result-panel{padding:15px;margin-bottom:10px}.vocab-list{grid-template-columns:1fr 1fr;gap:6px}.vocab-item{padding:9px}.vocab-item b{font-size:11px}.vocab-item span{font-size:9px}.vocab-item small{font-size:8px}.exercise-prompt{font-size:16px}.choice-button{padding:12px;font-size:11px}.mobile-nav{position:fixed;bottom:0;left:0;right:0;z-index:4;display:grid;grid-template-columns:repeat(4,1fr);padding:7px 5px calc(7px + env(safe-area-inset-bottom));border-top:1px solid #eae9e2;background:white}.mobile-nav button{border:0;background:transparent;color:#90948c;display:grid;justify-items:center;gap:3px;font-size:9px;padding:3px}.mobile-nav button span{font-size:17px;line-height:19px}.mobile-nav button.active{color:#45634b;font-weight:700}footer{font-size:9px;margin-top:19px}.auth-screen{padding:25px 17px 18px;min-height:100svh;justify-content:flex-start}.auth-brand{margin-bottom:clamp(55px,13vh,100px)}.auth-card{padding:23px 20px;border-radius:13px}.auth-card h1{font-size:25px}.auth-card>p{font-size:10px}.auth-footer{margin-top:auto;text-align:center}}
@media(max-width:370px){.content-wrap{padding-left:12px;padding-right:12px}.hero-card{min-height:420px}.hero-copy{padding-left:16px}.lesson-meta{gap:8px}.path-progress{display:none}.path-percent{width:20px}.lesson-card{gap:8px}.mobile-nav button{font-size:8px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}}
.order-hint{display:block;font:400 10px 'DM Sans';color:#969990;margin-top:5px}.answer-input{width:100%;height:43px;border:1px solid #e8e7df;border-radius:8px;padding:0 12px;font-size:12px;outline:none}.answer-input:focus{border-color:#6d8c70;box-shadow:0 0 0 3px #82998220}
@media(max-width:640px){.mobile-nav{grid-template-columns:repeat(3,1fr)}}
.vocab-heading,.word-heading{display:flex;align-items:center;justify-content:space-between;gap:5px}.pronounce{width:22px;height:22px;border:1px solid #e6e8de;background:#fff;color:#55745d;border-radius:50%;font-size:9px;display:grid;place-items:center;flex-shrink:0}.pronounce:hover{background:#edf3e9}
@media(max-width:640px){.pronounce{width:26px;height:26px}}

/* Mobile-first shell and seasonal finish */
:root{--page:#f8f7f2;--surface:#fff;--surface-soft:#faf9f5;--border:#ebeae3;--text:#292d28;--subtle:#858a81;--accent:#42604c}
html{background:var(--page);overscroll-behavior:none;touch-action:manipulation;-webkit-text-size-adjust:100%}
body{background:var(--page);color:var(--text);overscroll-behavior-y:contain;touch-action:pan-y}
button,a,input{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.sidebar{display:none!important}
.app-shell{display:block;min-height:100vh;min-height:100dvh;background:var(--page)}
.main-content{width:100%;max-width:480px;min-height:100vh;min-height:100dvh;margin-inline:auto;padding-bottom:calc(76px + env(safe-area-inset-bottom));background:var(--page);box-shadow:0 0 55px #262b2410}
.topbar{position:sticky;top:0;z-index:5;height:56px;padding:0 16px;background:color-mix(in srgb,var(--surface) 92%,transparent);backdrop-filter:blur(14px);border-color:var(--border)}
.breadcrumb{color:var(--subtle);font-size:10px}.breadcrumb b{color:var(--text);font-size:10px}
.content-wrap{max-width:none;padding:22px 16px 24px}
.mobile-nav{position:fixed;display:grid;grid-template-columns:repeat(3,1fr);left:50%;right:auto;bottom:0;transform:translateX(-50%);width:min(100%,480px);z-index:20;padding:8px 12px calc(8px + env(safe-area-inset-bottom));border-top:1px solid var(--border);background:color-mix(in srgb,var(--surface) 96%,transparent);backdrop-filter:blur(18px);box-shadow:0 -8px 25px #25291c0d}
.mobile-nav button{min-height:44px;font-size:10px;color:var(--subtle)}.mobile-nav button span{font-size:20px;line-height:21px}.mobile-nav button.active{color:var(--accent)}
.top-actions{gap:8px}.theme-toggle{width:34px;height:34px;border:1px solid var(--border);border-radius:50%;background:var(--surface);color:var(--text);font-size:17px;display:grid;place-items:center}.streak-pill{padding:6px 9px}
.auth-screen{width:100%;max-width:480px;margin:0 auto;min-height:100vh;min-height:100dvh;padding-left:20px;padding-right:20px;background:radial-gradient(ellipse at 50% 38%,#f1eee1 0%,var(--page) 65%)}
.auth-brand{position:relative}.seasonal-mark{font-size:15px;margin-left:2px;transform:rotate(12deg)}
.seasonal-note{display:block;color:#a16e48;font-size:10px;margin-top:5px}
.week-card,.path-list,.level-card,.lesson-card,.word-card,.vocab-panel,.exercise-panel,.result-panel,.auth-card{background:var(--surface);border-color:var(--border)}
.path-list,.vocab-item,.answer-input{background:var(--surface-soft)}
.lesson-titlebar{background:#e5ede1}
@media(max-width:360px){.content-wrap{padding-left:13px;padding-right:13px}.breadcrumb b{margin-left:7px;padding-left:7px}.topbar{padding-inline:12px}.streak-pill{font-size:9px}.streak-pill b{font-size:9px}}
@media(min-width:641px){.content-wrap{padding:28px 20px 24px}.welcome-row{gap:12px}.welcome-row h1{font-size:27px}.hero-card{min-height:390px;display:block}.hero-copy{width:100%;max-width:none;padding:22px 19px}.hero-copy h2{font-size:29px}.hero-art{top:auto;bottom:0;width:100%;height:53%}.sun{width:82px;height:82px;right:16%;top:15px}.speech-bubble{right:14%;top:22px}.art-person{left:40%;transform:scale(.9);transform-origin:bottom}.plant{left:11%}.lower-grid{grid-template-columns:1fr}.lesson-grid{grid-template-columns:1fr}.mobile-nav{grid-template-columns:repeat(3,1fr)}}
html[data-theme="dark"]{--page:#151714;--surface:#20231f;--surface-soft:#272a25;--border:#343831;--text:#f1f0e9;--subtle:#a0a69d;--accent:#b9d1b8;color-scheme:dark}
html[data-theme="dark"] body,html[data-theme="dark"] .app-shell,html[data-theme="dark"] .main-content{background:var(--page);color:var(--text)}
html[data-theme="dark"] .topbar,html[data-theme="dark"] .mobile-nav{background:color-mix(in srgb,#20231f 96%,transparent);border-color:var(--border)}
html[data-theme="dark"] .auth-screen{background:radial-gradient(ellipse at 50% 38%,#262b24 0%,var(--page) 65%)}
html[data-theme="dark"] .auth-card,html[data-theme="dark"] .week-card,html[data-theme="dark"] .path-list,html[data-theme="dark"] .level-card,html[data-theme="dark"] .lesson-card,html[data-theme="dark"] .word-card,html[data-theme="dark"] .vocab-panel,html[data-theme="dark"] .exercise-panel,html[data-theme="dark"] .result-panel,html[data-theme="dark"] .mobile-nav,html[data-theme="dark"] .theme-toggle{background-color:var(--surface);border-color:var(--border);color:var(--text)}
html[data-theme="dark"] .breadcrumb b,html[data-theme="dark"] .path-row,html[data-theme="dark"] .choice-button,html[data-theme="dark"] .word-card span,html[data-theme="dark"] .vocab-item span,html[data-theme="dark"] .exercise-prompt,html[data-theme="dark"] .lesson-card h3{color:var(--text)}
html[data-theme="dark"] .vocab-item,html[data-theme="dark"] .path-row:hover,html[data-theme="dark"] .choice-button,html[data-theme="dark"] .answer-input,html[data-theme="dark"] .speak-button{background:var(--surface-soft);border-color:var(--border);color:var(--text)}
html[data-theme="dark"] .lesson-titlebar{background:#29352b}html[data-theme="dark"] .lesson-titlebar h1,html[data-theme="dark"] .lesson-titlebar p,html[data-theme="dark"] .lesson-titlebar .eyebrow{color:#dce8d9}
html[data-theme="dark"] .choice-button.selected{background:#304235;border-color:#78977a}html[data-theme="dark"] .choice-button.correct,html[data-theme="dark"] .answer-explanation{background:#263a2a;color:#d6ead7}html[data-theme="dark"] .choice-button.incorrect{background:#3a2825;color:#f1c4bb}
html[data-theme="dark"] .auth-submit,html[data-theme="dark"] .primary-button,html[data-theme="dark"] .start-practice,html[data-theme="dark"] .check-answer,html[data-theme="dark"] .next-question,html[data-theme="dark"] .finish-lesson{background:#64866a;color:#fff}
html[data-theme="dark"] .seasonal-note{color:#e3ae7a}

/* Readable mobile type and comfortable touch targets */
@media(max-width:640px){.content-wrap{padding-top:19px}.welcome-row h1,.page-heading h1{font-size:29px}.welcome-row p,.page-heading p{font-size:14px;line-height:1.5}.eyebrow,.lesson-tag{font-size:10px}.hero-copy p{font-size:14px;line-height:1.5}.lesson-meta{font-size:10px;flex-wrap:wrap}.primary-button{font-size:13px;padding:12px 14px}.section-heading h3,.level-card h3{font-size:17px}.path-text b{font-size:12px}.path-text small,.level-card>p,.level-note{font-size:11px;line-height:1.5}.path-row{min-height:52px}.lesson-card h3{font-size:14px}.lesson-card p{font-size:12px;line-height:1.5}.lesson-card-meta{font-size:10px}.lesson-start{font-size:12px;padding:10px}.word-card b{font-size:14px}.word-card span{font-size:12px}.word-card small{font-size:10px;line-height:1.5}.lesson-titlebar h1{font-size:25px}.lesson-titlebar p{font-size:13px;line-height:1.5}.panel-label{font-size:10px}.vocab-item b{font-size:13px}.vocab-item span{font-size:11px}.vocab-item small{font-size:10px;line-height:1.5}.exercise-prompt{font-size:19px}.exercise-subtitle{font-size:13px;line-height:1.5}.choice-button{font-size:14px;min-height:46px}.speak-button{font-size:13px;padding:11px}.check-answer,.next-question,.finish-lesson,.start-practice{font-size:14px;min-height:48px}.auth-card>p{font-size:13px}.auth-kicker{font-size:10px}.auth-submit{font-size:13px;min-height:49px}.auth-switch{font-size:12px}.auth-note{font-size:11px;line-height:1.55}.auth-footer{font-size:11px}}

.auth-theme-toggle{position:absolute;top:17px;right:max(17px,calc((100% - 445px)/2));z-index:2}
html[data-theme="dark"] .auth-theme-toggle{background:var(--surface);border-color:var(--border);color:var(--text)}

/* Searchable slang dictionary and ordered follow-on chapters */
.mobile-nav{grid-template-columns:repeat(4,1fr)}
.course-group-heading{grid-column:1/-1;padding:16px 3px 3px;margin-top:5px}.course-group-heading>span{font-size:9px;font-weight:800;letter-spacing:1px;color:#a16e48}.course-group-heading h2{font:700 19px Manrope;margin:5px 0;color:var(--text)}.course-group-heading p{font-size:12px;line-height:1.5;color:var(--subtle);margin:4px 0 8px}
.slang-intro{display:grid;gap:5px;padding:13px 14px;margin:0 0 18px;background:#fbf2e8;border:1px solid #f0dfcc;border-radius:10px;color:#685347;font-size:12px;line-height:1.5}.slang-intro span{font-size:11px;color:#86796c}
.slang-search-label{display:block;font-size:11px;font-weight:700;margin-bottom:6px}.slang-search{width:100%;height:46px;border:1px solid var(--border);border-radius:9px;background:var(--surface);color:var(--text);padding:0 13px;font-size:14px;outline:none}.slang-search:focus{border-color:#789578;box-shadow:0 0 0 3px #78957824}.slang-filters{display:flex;gap:7px;overflow-x:auto;padding:12px 0 5px;scrollbar-width:none}.slang-filter{flex:0 0 auto;border:1px solid var(--border);border-radius:20px;background:var(--surface);color:var(--subtle);padding:8px 12px;font-size:11px}.slang-filter.active{background:#e8eee4;border-color:#ced9ca;color:#42604c;font-weight:700}.slang-results-meta{font-size:10px;color:var(--subtle);padding:7px 1px 11px}.slang-dictionary{display:grid;gap:10px}.slang-card{border:1px solid var(--border);border-radius:11px;background:var(--surface);padding:13px}.slang-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:9px}.slang-category{text-transform:uppercase;letter-spacing:.8px;font-size:9px;font-weight:700;color:#9b8769}.slang-card h2{font:700 18px/1.25 Manrope;color:var(--text);margin:4px 0}.slang-standard{font-size:11px;line-height:1.45;color:var(--subtle);margin:0}.vulgarity-tag{display:inline-block;flex:0 0 auto;border-radius:12px;padding:5px 7px;font-size:9px;text-transform:capitalize;background:#edf3eb;color:#527254}.vulgarity-tag.mild{background:#f5f0e5;color:#927442}.vulgarity-tag.strong,.vulgarity-tag.very{background:#f9e9e4;color:#a25443}.slang-quick-meaning{font-size:12px;line-height:1.5;color:var(--text);margin:10px 0 3px}.slang-card-actions{display:flex;align-items:center;gap:8px;margin-top:8px}.slang-card-actions .pronounce{width:30px;height:30px}.mastery-label{flex:1;color:var(--subtle);font-size:10px}.slang-detail-toggle{border:0;background:transparent;color:var(--accent);font-weight:700;font-size:11px;padding:8px 3px}.slang-detail-toggle span{font-size:15px;margin-left:3px}.slang-details{border-top:1px solid var(--border);margin-top:8px;padding-top:12px}.slang-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px 10px}.slang-detail-grid b,.slang-examples>b,.slang-guidance b,.slang-citations>b,.review-prompt>b{font-size:10px;color:var(--text)}.slang-detail-grid p,.slang-guidance p{font-size:11px;line-height:1.5;color:var(--subtle);margin:4px 0 0}.slang-examples,.slang-guidance,.slang-citations{border-top:1px solid var(--border);margin-top:12px;padding-top:11px}.slang-examples p{display:grid;gap:3px;margin:8px 0}.slang-examples p span{font-size:12px;color:var(--text);font-weight:600}.slang-examples p small{font-size:10px;color:var(--subtle)}.slang-guidance{display:grid;gap:10px}.slang-citations a{font-size:10px;color:var(--accent)}.slang-citations p{line-height:1.6;margin:5px 0}.review-prompt{margin-top:12px;padding:11px;background:var(--surface-soft);border-radius:8px;display:grid;gap:5px}.review-prompt>span{font-size:10px;color:var(--subtle)}.review-prompt>div{display:flex;gap:8px;margin-top:4px}.review-button{flex:1;min-height:39px;border-radius:7px;border:1px solid var(--border);font-size:11px;font-weight:700}.review-again{background:var(--surface);color:#8c574a}.review-known{background:#42604c;color:#fff;border-color:#42604c}.review-button:disabled{opacity:.5}.review-status{min-height:0;color:var(--subtle);font-size:10px;line-height:1.4}.slang-empty{padding:24px 12px;text-align:center;color:var(--subtle);font-size:12px}.slang-sources{margin-top:19px;border-top:1px solid var(--border);padding:14px 1px;color:var(--subtle)}.slang-sources>b{font-size:11px;color:var(--text)}.slang-sources p{font-size:10px;line-height:1.55}.slang-sources a{display:block;font-size:10px;line-height:1.5;color:var(--accent);margin:5px 0}
html[data-theme="dark"] .slang-intro{background:#2b2721;border-color:#443a2e;color:#e6d2bf}html[data-theme="dark"] .slang-intro span{color:#b7a996}html[data-theme="dark"] .slang-filter.active{background:#2e4031;border-color:#455c48;color:#d5e5d3}html[data-theme="dark"] .vulgarity-tag{background:#263a29;color:#c7dfc5}html[data-theme="dark"] .vulgarity-tag.mild{background:#3a3325;color:#e7d4a6}html[data-theme="dark"] .vulgarity-tag.strong,html[data-theme="dark"] .vulgarity-tag.very{background:#422a26;color:#f0c4b8}html[data-theme="dark"] .review-known{background:#64866a;border-color:#64866a}html[data-theme="dark"] .review-again{background:var(--surface-soft);color:#efc4b9}html[data-theme="dark"] .course-group-heading>span{color:#e3ae7a}
@media(max-width:370px){.mobile-nav{padding-inline:5px}.mobile-nav button{font-size:8px}.slang-card{padding:11px}.slang-card h2{font-size:16px}}
@media(min-width:641px){.slang-dictionary{grid-template-columns:1fr}}
.slang-lock-card{display:grid;justify-items:start;gap:9px;padding:20px 16px;border:1px solid var(--border);border-radius:11px;background:var(--surface);color:var(--text)}.slang-lock-card>span{font-size:22px}.slang-lock-card h2{font:700 19px Manrope;margin:0}.slang-lock-card p{font-size:12px;line-height:1.55;color:var(--subtle);margin:0}.slang-lock-card>b{font-size:11px;color:var(--accent)}.slang-filter:disabled{opacity:.45}.lesson-locked{opacity:.68}.lesson-locked .lesson-card-icon{background:#f2f0e9;color:#858a81}
.slang-course-tabs{display:flex;gap:8px;padding:3px 0 12px;overflow-x:auto;scrollbar-width:none}.slang-course-tab{flex:0 0 auto;border:1px solid var(--border);border-radius:20px;background:var(--surface);color:var(--subtle);padding:9px 13px;font-size:11px;font-weight:650}.slang-course-tab.active{background:#e8eee4;border-color:#ced9ca;color:#42604c}.profanity-note{margin:12px 0;padding:12px;border:1px solid #dec8af;border-radius:9px;background:#faf3e9;color:var(--text)}.profanity-note b{font-size:11px}.profanity-note p{font-size:11px;line-height:1.55;color:var(--subtle);margin:5px 0 0}.listen-transcript{margin:10px 0;padding:10px 12px;border:1px solid var(--border);border-radius:8px;background:var(--surface-soft)}.listen-transcript summary{font-size:11px;font-weight:700;color:var(--accent);cursor:pointer}.listen-transcript p{font-size:14px;line-height:1.5;color:var(--text)}html[data-theme="dark"] .slang-course-tab.active{background:#2e4031;border-color:#455c48;color:#d5e5d3}html[data-theme="dark"] .profanity-note{background:#302820;border-color:#51402d}html[data-theme="dark"] .listen-transcript{background:var(--surface-soft)}@media(min-width:720px){.slang-course-tabs{padding-bottom:16px}.profanity-note{padding:14px}}
html[data-theme="dark"] .lesson-locked .lesson-card-icon{background:#30322d;color:#afb4aa}
@media(min-width:641px){.mobile-nav{grid-template-columns:repeat(4,1fr)}}
/* Reusable grammar teaching panel and accessible word-bank sentence builder */
.grammar-teach{display:grid;gap:8px;margin:13px 0 16px}.grammar-objective{padding:13px 14px;border:1px solid #dce6d8;border-radius:10px;background:#edf3eb}.grammar-objective span{font-size:9px;letter-spacing:1px;font-weight:800;color:#527254}.grammar-objective p{font-size:13px;line-height:1.5;font-weight:650;margin:6px 0 0}.grammar-section{border:1px solid var(--border);border-radius:9px;background:var(--surface);color:var(--text);overflow:hidden}.grammar-section summary{padding:12px 13px;cursor:pointer;font-size:12px;font-weight:700;list-style:none}.grammar-section summary::-webkit-details-marker{display:none}.grammar-section summary:after{content:'＋';float:right;color:var(--subtle)}.grammar-section[open] summary:after{content:'−'}.grammar-section>div{padding:0 13px 11px}.grammar-section p{font-size:12px;line-height:1.65;color:var(--subtle);margin:0 0 8px}.grammar-section p:last-child{margin-bottom:0}.grammar-section .grammar-example{padding:9px 10px;background:var(--surface-soft);border-radius:7px;color:var(--text);display:flex;align-items:center;justify-content:space-between;gap:6px}.grammar-example .pronounce{flex:0 0 30px}.grammar-region-note{font-size:10px;line-height:1.5;color:var(--subtle);padding:9px 11px;margin:0;background:var(--surface-soft);border-radius:8px}.grammar-source-links{font-size:10px;color:var(--subtle)}.grammar-source-links a{color:var(--accent);margin-right:8px}.builder-answer{min-height:58px;padding:9px;border:1px dashed #9fb29c;border-radius:9px;display:flex;flex-wrap:wrap;align-content:center;gap:6px;background:var(--surface)}.builder-answer>span{font-size:11px;color:var(--subtle);padding:5px}.builder-tiles{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.builder-tile,.builder-selected{border:1px solid var(--border);border-radius:8px;background:var(--surface-soft);color:var(--text);padding:10px 12px;min-height:42px;font-weight:650}.builder-tile.selected{opacity:.42}.builder-selected{background:#e7efe5;border-color:#cbd9c8;color:#354e39}.builder-selected span{margin-left:5px;color:#83947d}.builder-tile:disabled{cursor:default}
html[data-theme="dark"] .grammar-objective{background:#283429;border-color:#415345}html[data-theme="dark"] .builder-selected{background:#2d4030;border-color:#4c684f;color:#e2efe0}
@media(max-width:420px){.grammar-section summary{padding:12px}.grammar-section>div{padding:0 12px 10px}.grammar-objective{padding:12px}}

/* Keep the home path compact and let longer lesson names wrap within their row. */
.path-row{min-width:0;max-width:100%}.path-text{min-width:0;max-width:100%;overflow:hidden}.path-text b{white-space:normal;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;overflow-wrap:anywhere;text-overflow:ellipsis;line-height:1.35}.hero-copy,.hero-copy h2,#nextSubtitle{min-width:0;max-width:100%;overflow-wrap:anywhere}.path-arrow{flex:0 0 auto}
@media(max-width:640px){.content-wrap{overflow-x:clip}.hero-card{min-height:370px}.hero-art{height:46%}.hero-copy h2{max-width:100%;line-height:1.15}.path-list{padding-inline:12px}.path-row{gap:9px}.path-text b{font-size:12px}.path-text small{font-size:9px}.path-icon{flex:0 0 30px}.path-row:disabled{opacity:.7}}
@media(max-width:370px){.hero-card{min-height:350px}.hero-art{height:44%}.hero-copy h2{font-size:26px}.path-list{padding-inline:9px}.path-row{gap:7px}.path-icon{width:27px;height:27px;flex-basis:27px}}
.grammar-review-card{grid-column:1/-1;display:flex;align-items:center;gap:10px;padding:12px;border:1px solid #e8d7b8;border-radius:10px;background:#fbf5e9;color:var(--text);margin:0 0 6px}.grammar-review-card>span{width:30px;height:30px;flex:0 0 30px;display:grid;place-items:center;border-radius:9px;background:#f1e5ca;color:#9c7636;font-size:17px}.grammar-review-card>div{flex:1;min-width:0}.grammar-review-card b{font-size:11px}.grammar-review-card p{font-size:10px;line-height:1.4;color:var(--subtle);margin:4px 0 0}.grammar-review-card button{min-height:38px;padding:0 11px;border:0;border-radius:7px;background:#42604c;color:white;font-size:10px;font-weight:700}html[data-theme="dark"] .grammar-review-card{background:#322e24;border-color:#554832}

/* Put the vocabulary before teaching content and keep each entry easy to scan. */
.lesson-vocab-panel{margin:0 0 14px;padding:18px}.vocab-intro{margin:6px 0 13px;color:var(--subtle);font-size:13px;line-height:1.55}.lesson-vocab-panel .vocab-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.lesson-vocab-panel .vocab-item{min-width:0;padding:12px}.lesson-vocab-panel .vocab-heading{display:flex;align-items:center;justify-content:space-between;gap:8px}.lesson-vocab-panel .vocab-item b{overflow-wrap:anywhere;font-size:14px}.lesson-vocab-panel .vocab-item>span{display:block;margin-top:5px;font-size:12px;line-height:1.45}.lesson-vocab-panel .vocab-item>small{display:block;margin-top:5px;font-size:11px;line-height:1.45}.vocab-example{display:grid;gap:3px;border-top:1px solid var(--border);margin-top:9px;padding-top:8px}.vocab-example span{font-size:11px;line-height:1.45;color:var(--text)}.vocab-example small{font-size:10px;line-height:1.45;color:var(--subtle)}
@media(max-width:640px){.lesson-vocab-panel{padding:14px}.lesson-vocab-panel .vocab-list{grid-template-columns:1fr;gap:7px}.lesson-vocab-panel .vocab-item{padding:11px}.vocab-intro{font-size:13px}}
.spanish-word{display:inline;border:0;border-bottom:1px dashed currentColor;border-radius:0;padding:0;background:transparent;color:inherit;font:inherit;font-weight:inherit;cursor:pointer;text-decoration:none;text-underline-offset:3px}.spanish-word:hover,.spanish-word:focus-visible{color:var(--accent);outline:none;border-bottom-style:solid}.word-help{margin:12px 0 15px;padding:13px 15px;border:1px solid #b8d9eb;border-radius:11px;background:#eff8fc;color:var(--text)}.word-help-main{display:flex;justify-content:space-between;align-items:center;gap:12px}.word-help-main>div{display:grid;gap:3px}.word-help-label{font-size:9px;font-weight:800;letter-spacing:1px;color:#168bc5}.word-help-main b{font:700 21px/1.2 Manrope,sans-serif}.word-help-audio{flex:0 0 38px;width:38px;height:38px;border-radius:11px;background:#dceff8;color:#087eaf}.word-help-phonetic{margin-top:6px;color:#0788c1;font-size:17px;font-weight:700;letter-spacing:.2px}.word-help p{margin:8px 0 0;font-size:13px;line-height:1.5}.word-help p b{color:var(--text)}html[data-theme="dark"] .word-help{background:#122d38;border-color:#28586a}html[data-theme="dark"] .word-help-phonetic,html[data-theme="dark"] .word-help-label{color:#55caff}
@media(max-width:640px){.word-help{padding:12px}.word-help-main b{font-size:20px}.word-help-phonetic{font-size:16px}.word-help p{font-size:13px}}