
/* Premium independent learning room; education-specific, responsive, keyboard and touch accessible. */
body.learning-open{background:#f6f7f3;overflow-x:hidden}
body.learning-open .app-shell{display:none}
.learning-app{--lg-ink:#1b2b22;--lg-muted:#77897a;--lg-line:#e2e8de;--lg-lime:#daef9b;--lg-dark:#192b21;--lg-bg:#f7f8f4;min-height:100svh;background:var(--lg-bg);color:var(--lg-ink);font-family:-apple-system,BlinkMacSystemFont,"PingFang TC",system-ui,sans-serif}
.learning-app *{box-sizing:border-box}.learning-app button,.learning-app input{font:inherit}.learning-app button{cursor:pointer}.learning-app button:disabled{cursor:not-allowed;opacity:.55}
.learn-header{position:sticky;top:0;z-index:90;display:flex;align-items:center;justify-content:space-between;gap:12px;height:70px;background:rgba(255,255,255,.93);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid var(--lg-line);padding:0 clamp(15px,5vw,70px)}
.learn-logo{display:flex;align-items:center;gap:9px;font-weight:800;letter-spacing:-.05em;font-size:14px}.learn-logo-mark{width:34px;height:34px;border-radius:11px;background:var(--lg-dark);display:grid;place-items:center;color:var(--lg-lime);font-size:18px}
.learn-header-links{display:flex;gap:8px;align-items:center}.learn-header-links button{border:0;background:transparent;padding:10px 12px;color:#6c826e;border-radius:10px;font-size:12px;font-weight:700}.learn-header-links button:hover{background:#edf3e8}
.learn-container{max-width:1220px;margin:0 auto;padding:38px clamp(17px,4.8vw,70px) 100px}
.learn-eyebrow{font-size:10px;font-weight:850;letter-spacing:.18em;color:#80a36c;margin:0 0 12px}.learn-title{font-size:clamp(33px,4.8vw,54px);letter-spacing:-.075em;margin:0 0 10px;line-height:1.18}.learn-desc{font-size:13px;color:var(--lg-muted);line-height:1.9;margin:0 0 26px;max-width:750px}
.learn-tabs{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin:23px 0}.learn-tab{border:1px solid #e0e8de;background:white;padding:12px 17px;border-radius:12px;font-size:12px;font-weight:740;color:#69816f;min-height:43px}.learn-tab.selected{border-color:#2e5d39;background:#244633;color:#fff}
.learn-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:20px 0 29px}.learn-kpi{background:white;border:1px solid var(--lg-line);border-radius:15px;padding:21px}.learn-kpi b{display:block;font-size:29px;letter-spacing:-.06em}.learn-kpi span{font-size:11px;color:#8a9b8d;display:block;margin-top:7px}
.learn-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.learn-feature{background:white;border:1px solid var(--lg-line);border-radius:20px;padding:30px;min-height:246px;display:flex;flex-direction:column;align-items:start}.learn-feature h2{font-size:24px;letter-spacing:-.05em;margin:12px 0 9px}.learn-feature p{font-size:12px;line-height:1.9;color:#7d907f;margin:0 0 22px}.learn-feature.lime{background:#e9f3df}.learn-feature.dark{background:var(--lg-dark);color:white}.learn-feature.dark p{color:#afc6b2}.learn-feature .feature-counter{font-size:11px;font-weight:830;letter-spacing:.1em;color:#65905f}.learn-feature.dark .feature-counter{color:#c2dda1}.learn-feature .feature-actions{margin-top:auto}
.learn-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:43px;border:1px solid transparent;border-radius:11px;padding:11px 17px;font-size:12px;font-weight:800;background:#d8f096;color:#1d3824}.learn-btn:hover{filter:brightness(.965)}.learn-btn.secondary{background:white;border-color:#dae6d5;color:#335b39}.learn-btn.dark{background:#224b30;color:white}.learn-btn.outline{background:transparent;border-color:#7e9780;color:#465e49}
.learn-section-title{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:25px 0 17px}.learn-section-title h2{font-size:21px;margin:0;letter-spacing:-.055em}.learn-section-title span{color:#819483;font-size:11px}
.learn-search-row{display:flex;gap:10px;flex-wrap:wrap;margin:15px 0}.learn-search{flex:1;min-width:170px;border:1px solid #dce6da;border-radius:12px;padding:13px 16px;background:#fff;color:#233b29;font-size:13px;outline:none}.learn-search:focus{border-color:#7faa67}.learn-filter{border:1px solid #dde6d9;background:white;border-radius:12px;padding:11px 14px;font-size:12px;color:#5d7462}.learn-filter.active{background:#244a32;color:#fff;border-color:#244a32}
.learn-category-strip{display:flex;gap:7px;overflow-x:auto;padding-bottom:9px;margin:6px 0 15px;-webkit-overflow-scrolling:touch}.learn-category-strip button{white-space:nowrap;flex:none;background:#fff;border:1px solid #e0e8de;border-radius:99px;padding:9px 13px;color:#698071;font-size:11px}.learn-category-strip button.active{background:#2a5136;color:#fff;border-color:#2a5136}
.learn-word-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.learn-word-item{border:1px solid #dfe8dc;border-radius:14px;background:white;padding:17px;text-align:left;display:flex;justify-content:space-between;gap:14px;align-items:center;min-height:82px}.learn-word-item:hover{border-color:#a1c58c;background:#fafff5}.learn-word-item .word-en{font-size:17px;font-weight:770;letter-spacing:-.045em}.learn-word-item .word-meta{font-size:11px;color:#91a291;margin-top:5px;line-height:1.5}.learn-word-item .word-zh{text-align:right;color:#526c57;font-size:12px;line-height:1.5}.learn-word-item .word-status{color:#93a88b;font-size:10px;margin-top:4px}
.learn-card{border:1px solid var(--lg-line);background:white;border-radius:23px;padding:clamp(24px,5vw,39px);box-shadow:0 12px 36px rgba(38,55,40,.045);margin:20px 0}.learn-card-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:28px}.learn-card-top span{color:#779477;font-size:11px;font-weight:800;letter-spacing:.06em}.learn-card-top button{font-size:11px;border:1px solid #e0e7dd;border-radius:10px;background:white;padding:8px 12px;color:#6b806d}
.learn-flash-prompt{color:#869988;font-size:12px;letter-spacing:.05em;text-align:center;margin:26px 0 15px}.learn-flash-word{font-size:clamp(38px,7vw,64px);font-weight:820;letter-spacing:-.08em;margin:0 0 12px;text-align:center;overflow-wrap:anywhere}.learn-flash-type{text-align:center;font-size:12px;color:#92a491;margin:0 0 30px}
.learn-card-reveal{text-align:center;min-height:210px;display:grid;align-content:center;gap:13px;border-radius:17px;background:#f2f7ed;padding:27px;color:#2e5033}.learn-card-reveal h3{font-size:29px;margin:0;letter-spacing:-.05em}.learn-card-reveal p{font-size:13px;line-height:1.8;margin:0}.learn-example{font-size:15px;font-weight:620;letter-spacing:0;color:#36543c}.learn-example-zh{color:#7d957d}.learn-center{text-align:center;margin:20px 0}.learn-review-ratings{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:18px}.learn-review-ratings button{border-radius:12px;border:1px solid #dfe8da;background:white;padding:15px 10px;font-size:12px;font-weight:720;color:#4f7254}.learn-review-ratings button:first-child{background:#fff3ef;color:#ab645a}.learn-review-ratings button:last-child{background:#e5f4d6;color:#48743c}
.learn-review-progress{height:5px;border-radius:30px;background:#e9efe5;overflow:hidden}.learn-review-progress>div{height:100%;background:#98c570}
.learn-lesson-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.learn-lesson{border:1px solid #dfe7db;border-radius:17px;background:white;text-align:left;padding:21px;min-height:137px}.learn-lesson:hover{border-color:#a8c78e;background:#fcfff8}.learn-lesson small{font-size:10px;color:#7c9c77;font-weight:800;letter-spacing:.13em}.learn-lesson h3{font-size:17px;letter-spacing:-.04em;margin:14px 0 6px}.learn-lesson p{font-size:11px;color:#8fa18f;margin:0;line-height:1.6}.learn-lesson.done{background:#f5fbef}
.learn-detail-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;flex-wrap:wrap;margin-bottom:18px}.learn-detail-heading h1{font-size:clamp(28px,4vw,40px);letter-spacing:-.06em;margin:4px 0}.learn-detail-heading small{font-size:11px;color:#8fa28f}
.learn-rule{font-size:14px;line-height:2;color:#34513a;margin:0 0 15px}.learn-lesson-note{font-size:13px;line-height:1.95;color:#67806b;background:#eef6e6;padding:19px;border-radius:14px}
.learn-rule-example{background:#f8faf6;border-left:3px solid #9bc879;padding:16px 19px;border-radius:0 12px 12px 0;font-size:15px;color:#34553b;line-height:1.8;margin:10px 0}.learn-option-list{display:grid;gap:9px;margin:22px 0}.learn-option{padding:15px;min-height:51px;border-radius:12px;background:white;border:1px solid #dce6da;text-align:left;font-size:13px;color:#344e39}.learn-option.selected{background:#e4f3d8;border-color:#99ca83}.learn-option.bad{background:#fff1ed;border-color:#e5aea1}.learn-option:disabled{cursor:default}.learn-feedback{background:#eaf4e2;border:1px solid #d9e9d1;padding:19px;border-radius:13px;line-height:1.9;color:#436d41;font-size:13px}.learn-feedback.bad{background:#fff4ef;border-color:#f0ded5;color:#995a43}
.learn-actions{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0}.learn-empty{background:white;border:1px solid #e1e9df;border-radius:18px;padding:50px 20px;text-align:center}.learn-empty p{color:#7d907f;font-size:13px;line-height:1.85}
.learn-progress-bars{display:grid;gap:11px}.learn-progress-row{display:grid;grid-template-columns:95px 1fr 50px;gap:10px;align-items:center;font-size:11px;color:#7b927d}.learn-progress-track{height:10px;background:#eef2eb;border-radius:30px;overflow:hidden}.learn-progress-track>i{display:block;height:100%;background:#9acb73;border-radius:30px}
.learn-small-note{font-size:11px;color:#91a092;line-height:1.9}
@media(max-width:800px){.learn-container{padding:27px 17px 105px}.learn-header{height:64px;padding:0 15px}.learn-header-links{gap:1px}.learn-header-links button{font-size:11px;padding:8px}.learn-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.learn-grid{grid-template-columns:1fr}.learn-feature{min-height:200px;padding:26px}.learn-lesson-list{grid-template-columns:1fr}.learn-word-list{grid-template-columns:1fr}}
@media(max-width:420px){.learn-title{font-size:33px}.learn-tab{padding:10px 12px;font-size:11px}.learn-kpi{padding:15px}.learn-review-ratings{gap:6px}.learn-review-ratings button{padding:13px 7px;font-size:11px}.learn-logo{font-size:12px}.learn-card{padding:21px 18px}.learn-progress-row{grid-template-columns:78px 1fr 42px}}
@media(prefers-reduced-motion:reduce){.learning-app *{animation:none!important;transition:none!important}}
