.learningShell{padding:29px 0}.learningEyebrow{font-size:10px;letter-spacing:1.7px;color:#8f6ec1;font-weight:800}.learningHeader{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin:10px 0 24px}.learningHeader h1{font-size:29px;max-width:650px}.learningHeader p{font-size:13px;line-height:1.9;color:#79718e;margin-top:11px;max-width:660px}.learningTabs{display:flex;gap:8px;margin:23px 0;flex-wrap:wrap}.learningTabs button{padding:10px 16px;border:1px solid #e0d9ef;color:#806895;border-radius:8px;background:white;font-size:12px}.learningTabs button[aria-current=page]{background:#6550d6;color:white;border-color:#6550d6}.courseHero{display:grid;grid-template-columns:1fr auto;align-items:center;gap:24px;border-radius:15px;padding:25px;background:linear-gradient(115deg,#34305b,#6651b0);color:#fff;margin-bottom:25px}.courseHero h2{font-size:22px;color:white}.courseHero p{color:#ddd4f1;font-size:12px;line-height:1.9;margin-top:10px;max-width:580px}.courseHero .primary{background:#ffd18a;color:#604230}.learningPill{display:inline-block;border:1px solid #e5d9f5;background:#f7f2fc;color:#87699f;font-size:10px;padding:5px 9px;border-radius:5px}.learningGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px}.learningCard{background:#fff;border:1px solid #e4dfef;border-radius:13px;padding:24px;display:flex;flex-direction:column}.learningCardTop{display:flex;justify-content:space-between;gap:15px;align-items:center}.learningIcon{width:43px;height:43px;border-radius:12px;background:#eee7fa;color:#8b6db9;display:grid;place-items:center;font-size:22px}.learningCard:nth-child(2) .learningIcon{background:#fff0dc;color:#b78b4a}.learningCard:nth-child(3) .learningIcon{background:#e5f0fa;color:#7a98bb}.learningCard:nth-child(4) .learningIcon{background:#f9e8ef;color:#bb85a0}.learningCard h3{margin:18px 0 10px;font-size:17px;line-height:1.55}.learningCard p{font-size:12px;color:#80758f;line-height:1.9;flex:1}.learningMeta{margin:20px 0 17px;color:#9b88ab;font-size:10px;display:flex;gap:12px}.learningButtons{display:flex;gap:9px;flex-wrap:wrap}.learningButtons .primary,.learningButtons .outline{font-size:11px}.learningNote{color:#8d7b9b;font-size:11px;line-height:1.9;margin:21px 0}.learningNote a{color:#7c5ba6}.lessonPanel{border:1px solid #e3dced;border-radius:15px;background:#fff;padding:28px;max-width:900px;margin:0 auto}.lessonTrail{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:18px;font-size:11px;color:#937ca6}.lessonTrack{height:6px;background:#eee9f7;border-radius:8px;margin-bottom:27px;overflow:hidden}.lessonTrack i{display:block;height:100%;background:#9a7ed8;transition:width .2s}.lessonPanel h2{font-size:23px;line-height:1.5;margin-bottom:14px}.lessonPanel>p{font-size:13px;color:#81708f;line-height:1.9}.phraseStudy{padding:18px;background:#f8f5fc;border:1px solid #eee6f5;border-radius:10px;margin:15px 0}.phraseStudy strong{font-family:var(--font-display);font-size:17px;display:block;font-weight:600}.phraseStudy span{display:block;font-size:12px;color:#997fa9;margin-top:8px}.phraseStudy p{font-size:12px;color:#887395;line-height:1.8;margin-top:12px}.lessonControls{display:flex;align-items:center;gap:12px;margin-top:23px;flex-wrap:wrap}.lessonControls .textbtn{margin-left:auto;font-size:11px}.lessonQuestion{font-family:var(--font-display);font-size:25px;line-height:1.55;margin:26px 0;color:#5a4071}.lessonOptions{display:grid;gap:10px}.lessonOptions button{padding:16px 18px;background:white;border:1px solid #e1d9ed;text-align:left;border-radius:9px;color:#6b4f82;font-size:13px}.lessonOptions button:hover{background:#f7f2fd}.lessonOptions button[data-state=correct]{background:#f0f7e8;border-color:#b1c998;color:#617a48}.lessonOptions button[data-state=incorrect]{background:#fff3ee;border-color:#e3bcae;color:#a57b69}.answerInput{width:100%;padding:16px;border:1px solid #ded4ec;border-radius:9px;color:#674c7b;font-size:15px}.answerInput:focus{outline-color:#b5a1dd}.lessonFeedback{font-size:12px;line-height:1.9;color:#8c729b;min-height:25px;margin-top:18px}.lessonFeedback.good{color:#69824d}.lessonFeedback.retry{color:#a57b55}.lessonHint{margin-top:15px;border-left:3px solid #d7c49f;background:#fff9ed;color:#a38a61;padding:12px 15px;font-size:12px;line-height:1.8}.hostPrompt{background:#efe8fb;padding:20px;border-radius:0 13px 13px;margin:20px 0;color:#79548f;font-size:18px;line-height:1.8}.hostPrompt small{display:block;font-size:9px;letter-spacing:1.6px;color:#aa8bba;margin-bottom:7px}.learningStats{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-bottom:24px}.learningStat{padding:23px;border:1px solid #e4dced;border-radius:12px;background:#fff}.learningStat strong{display:block;font:600 26px var(--font-display);color:#7654a5}.learningStat span{display:block;color:#9b81ab;font-size:11px;margin-top:8px}.reviewRow{display:flex;justify-content:space-between;gap:20px;align-items:center;border-bottom:1px solid #eee6f5;padding:17px 0}.reviewRow strong{font-family:var(--font-display);font-size:14px;font-weight:500}.reviewRow span{display:block;color:#a086b0;font-size:11px;margin-top:6px}.reviewRow .learningPill{white-space:nowrap;font-size:9px}.learningSearch{background:#fff;padding:13px 15px;border:1px solid #e1d9ec;border-radius:8px;min-width:0;flex:1;font-size:12px;color:#79608d}.learningToolbar{display:flex;gap:10px;margin:20px 0}.learningEmpty{padding:30px;text-align:center;border:1px dashed #d7cbe5;border-radius:12px;background:#fcfaff}.learningEmpty h2{font-size:21px}.learningEmpty p{font-size:13px;color:#9d82ac;line-height:1.9;margin:14px 0}.learningRecap{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:22px 0}.learningRecap div{padding:20px;background:#f5effb;border-radius:10px;font-size:12px;color:#9981aa}.learningRecap strong{display:block;font:600 24px var(--font-display);color:#7c5a9e;margin-bottom:7px}.learningSaveNotice{background:#fff5e9;border:1px solid #eddabf;padding:14px;border-radius:9px;font-size:12px;color:#a08460;margin-bottom:18px}.hubBanner{border:1px solid #e4dced;background:#fff;border-radius:12px;padding:19px 22px;margin-top:22px;display:flex;align-items:center;gap:15px}.hubBanner img{width:48px}.hubBanner div{flex:1}.hubBanner h3{font-size:14px}.hubBanner p{font-size:11px;color:#9782a7;margin-top:5px}.reviewModeTag{font-size:10px;color:#9e85ad;margin:12px 0}.lessonPanel .outline{font-size:11px}.learningLegend{display:flex;gap:9px;flex-wrap:wrap;font-size:10px;color:#a28aaf;margin:15px 0}.learningLegend span{padding:5px 9px;background:#f5effa;border-radius:6px}@media(max-width:950px){.learningHeader{flex-direction:column}.courseHero{grid-template-columns:1fr}.courseHero .primary{justify-self:start}}@media(max-width:600px){.learningGrid{grid-template-columns:1fr}.learningHeader h1{font-size:25px}.lessonPanel{padding:21px}.lessonPanel h2{font-size:21px}.lessonQuestion{font-size:22px}.learningStats{gap:8px}.learningStat{padding:15px}.learningStat strong{font-size:21px}.learningStat span{font-size:10px}.learningToolbar{flex-wrap:wrap}.learningSearch{flex-basis:100%}.learningTabs{gap:5px}.learningTabs button{padding:9px 11px;font-size:11px}.hubBanner{flex-wrap:wrap}.hubBanner button{width:100%}.reviewRow{align-items:flex-start}.courseHero h2{font-size:21px}.lessonControls .primary{flex:1}.learningNote{font-size:11px}}
/* A continuous, responsive lesson trail. */
.trailSummary{display:flex;justify-content:space-between;gap:24px;align-items:center;padding:28px 32px;border:1px solid #e3d9f5;border-radius:22px;background:linear-gradient(115deg,#f4edff,#fff7e7);margin-bottom:24px}.trailSummary h2{font-size:24px;margin:10px 0;color:#3a285c}.trailSummary p{font-size:13px;line-height:1.8;color:#746387;max-width:580px;margin-bottom:18px}.trailScore{text-align:center;min-width:150px;border-left:1px solid #e4d8ee;padding-left:30px}.trailScore strong{font-family:var(--font-display);display:block;font-size:45px;color:#7454cc}.trailScore span,.trailScore small{display:block;font-size:11px;color:#7c678d;margin-top:6px}.trailScore small{font-size:10px;color:#9987a6}.pandaMap{position:relative;isolation:isolate;overflow:hidden;border:1px solid #d9e8dc;background:linear-gradient(180deg,#e9f4f0 0%,#f3f7ec 35%,#f8f3e8 70%,#edf4ed 100%);border-radius:25px;padding:35px 20px 20px}.mapHeading{text-align:center;position:relative;z-index:1;margin-bottom:58px}.mapHeading .learningEyebrow{color:#608176}.mapHeading h2{color:#314f46;font-size:22px;margin:12px 0}.mapHeading p{font-size:11px;color:#6d8b7f;letter-spacing:.4px}.mapStops{position:relative;list-style:none;padding:0;margin:0 auto;max-width:570px}.mapStops:before{content:'';position:absolute;left:calc(50% - 3px);top:20px;bottom:55px;width:6px;background:repeating-linear-gradient(to bottom,#b6ceb8 0 10px,transparent 10px 20px);border-radius:4px}.mapStop{position:relative;display:flex;align-items:center;gap:22px;min-height:158px;padding-left:calc(50% - 34px);isolation:isolate}.stopDotWrap{position:relative;flex-shrink:0}.stopDot{width:68px;height:68px;border-radius:50%;border:5px solid #fffdf5;background:#d6dfcc;box-shadow:0 5px 0 #b8c8af,0 8px 18px #607b6320;color:#7d9479;font-size:26px;font-weight:800;position:relative;z-index:1;cursor:pointer}.isDone .stopDot{background:#79b19a;box-shadow:0 5px 0 #548f76;color:white}.isCurrent .stopDot{background:#9770dd;box-shadow:0 5px 0 #6e45b6,0 0 0 8px #b39ad033;color:#fff}.isFuture .stopDot{cursor:default;opacity:1}.stopLabel{min-width:0;width:220px;flex-shrink:0}.stopLabel>span{font-size:9px;font-weight:800;letter-spacing:1px;color:#7c9180}.stopLabel h3{font-size:14px;line-height:1.55;color:#355445;margin:6px 0}.stopLabel p{font-size:10px;line-height:1.6;color:#7f8f7e}.stopLabel .textbtn{font-size:11px;color:#7751b6;padding-top:8px}.isCurrent .stopLabel>span{color:#8a5ac9}.swing1,.swing2{flex-direction:row-reverse;padding-left:0;padding-right:calc(50% - 34px)}.swing1 .stopLabel,.swing2 .stopLabel{text-align:right}.swing1 .stopDotWrap,.swing3 .stopDotWrap{transform:translateX(24px)}.swing1 .stopLabel{transform:translateX(24px)}.swing3 .stopLabel{transform:translateX(24px)}.swing2 .stopDotWrap,.swing0 .stopDotWrap{transform:translateX(-24px)}.swing2 .stopLabel,.swing0 .stopLabel{transform:translateX(-24px)}.trailPanda{position:absolute;z-index:3;width:88px;height:88px;object-fit:contain;bottom:49px;left:-10px;filter:drop-shadow(0 4px 3px #394e4020);animation:pandaHello 3s ease-in-out infinite;pointer-events:none}.mapBeyond{text-align:center;padding:30px 10px 20px;position:relative;color:#557961}.mapBeyond>span{display:block;font-size:28px;color:#b69c61;margin-bottom:12px}.mapBeyond strong{font-family:var(--font-display);font-size:15px}.mapBeyond p{font-size:11px;margin-top:10px;color:#82977d}.mapBackdrop{position:absolute;inset:0;z-index:-1;pointer-events:none}.mapCloud{position:absolute;font-size:110px;color:#fff9;top:100px}.cloudOne{left:4%}.cloudTwo{right:4%;top:400px;font-size:90px}.mapHill{position:absolute;width:280px;height:470px;border-radius:50%;background:#c7ddbd55;left:-160px;top:270px;transform:rotate(30deg)}.hillTwo{left:auto;right:-140px;top:830px;background:#e4d6aa55;transform:rotate(-25deg)}.mapBamboo{position:absolute;font-size:65px;color:#9ab99c77;right:9%;top:700px}.bambooTwo{left:8%;top:1120px;color:#c5b68799}.trailFooter{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:22px 0;font-size:11px;line-height:1.8;color:#8a7898}.trailFooter .outline{white-space:nowrap;font-size:11px}@keyframes pandaHello{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-5px) rotate(3deg)}}@media(prefers-reduced-motion:reduce){.trailPanda{animation:none}}@media(max-width:650px){.trailSummary{padding:22px;display:block}.trailScore{border:0;border-top:1px solid #e4d8ee;padding:14px 0 0;margin-top:20px;display:flex;align-items:center;justify-content:space-between;gap:12px}.trailScore strong{font-size:27px}.trailScore small{display:none}.pandaMap{padding:25px 12px 15px}.mapHeading h2{font-size:18px}.mapStops{max-width:380px}.mapStops:before{left:49px}.mapStop,.mapStop.swing1,.mapStop.swing2{padding:0 0 0 18px;flex-direction:row;gap:22px;min-height:148px}.mapStop .stopDotWrap,.mapStop .stopLabel{transform:none;text-align:left}.stopDot{width:64px;height:64px}.stopLabel{width:auto;flex-shrink:1}.stopLabel h3{font-size:13px}.trailPanda{width:80px;height:80px;bottom:48px;left:-7px}.mapCloud{font-size:65px;right:0;left:auto}.trailFooter{align-items:flex-start;flex-direction:column}.mapBamboo{right:0;opacity:.4}}
.countryFlag{display:inline-block;width:32px;height:22px;object-fit:cover;border-radius:4px;box-shadow:0 1px 4px #25203822;vertical-align:middle;flex-shrink:0}.flagGroup{display:inline-flex;align-items:center;gap:6px;vertical-align:middle;flex-shrink:0}.globeBadge{display:inline-grid;place-items:center;width:34px;height:28px;font-size:24px;color:#8e78b8}#languageSwitch{display:flex;align-items:center;gap:9px}#languageSwitch .countryFlag{width:25px;height:18px}.simpleLanguageCard{text-align:left;min-height:180px;padding:23px!important;display:flex;align-items:flex-start;flex-direction:column;gap:12px}.simpleLanguageCard .countryFlag{width:36px;height:25px}.simpleLanguageCard h3{margin:0!important;font-size:18px!important}.courseAvailability{font-size:11px;color:#96859f;line-height:1.6}.courseAvailability.available{color:#56826a}.languageChoose{font-size:12px;font-weight:700;color:#7952bf;margin-top:auto}.simpleLanguageCard:focus-visible{outline:3px solid #8f6cce;outline-offset:4px}.browsertools{gap:9px;flex-wrap:wrap}.browsertools .search{min-width:220px;flex:1}.filterchip{min-height:44px!important;font-size:12px!important;padding:10px 15px!important}.viewintro .flagGroup{margin-right:9px}.viewintro h1{line-height:1.5}.varietyrow .flagGroup{width:54px}.varietyrow .countryFlag{width:38px;height:26px}.varietyrow strong{font-size:15px}.varietyrow button{min-height:44px}.miniPandaTrail{position:relative;width:225px;min-height:190px;display:flex;align-items:center;flex-direction:column;justify-content:flex-end;padding:10px}.miniPandaTrail>img{width:112px;height:112px;object-fit:contain;position:absolute;left:2px;top:-6px;filter:drop-shadow(0 6px 5px #43365220)}.miniTrailDots{display:flex;align-items:center;gap:8px;margin-top:88px;position:relative}.miniTrailDots b{width:44px;height:44px;background:#eee4ff;border:4px solid #fff;border-radius:50%;display:grid;place-items:center;color:#8b6db5;font:700 14px var(--font-display);box-shadow:0 4px 0 #c8b8df}.miniTrailDots b:first-child{background:#9470d3;color:white;box-shadow:0 4px 0 #6f4ca8}.miniTrailDots i{width:18px;border-top:4px dotted #bba9ce}.miniPandaTrail>span{font-size:10px;color:#a086b5;margin-top:18px}.levelMapHero{min-height:240px}.levelMapHero h2{font-size:26px;line-height:1.45;max-width:520px}.levelMapHero .primary{font-size:13px;padding:14px 20px}.levelMapHero .heroart{background:none!important}.stopLabel h3{font-size:15px}.mapStop.isCurrent .stopLabel>span{font-size:10px}.mapStop.isCurrent .stopLabel h3{color:#60418e}.stopDot:focus-visible{outline:3px solid #7955b3;outline-offset:7px}.trailScore strong:before{content:'LEVEL ';display:block;font-size:10px;letter-spacing:2px;margin-bottom:8px}.trailScore strong{font-size:48px}.trailScore strong+span{font-size:12px}@media(max-width:720px){#languageSwitch>span:not(.flagGroup){display:none}.levelMapHero{display:block!important}.levelMapHero .heroart{margin:25px auto 0!important;width:225px!important}.levelMapHero h2{font-size:22px}.languagegrid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.simpleLanguageCard{padding:18px!important;min-height:185px}.simpleLanguageCard h3{font-size:16px!important}.varietyrow{gap:12px;flex-wrap:wrap}.varietyrow>div{min-width:130px}.varietyrow button{margin-left:auto}.browsertools .search{flex-basis:100%}.trailSummary h2{font-size:21px}}
