:root{font-family:Forest Sans,Microsoft YaHei,sans-serif;color:#193c20;background:#fbf6eb;font-synthesis:weight;--orange:#ee7d16;--ink:#193c20;--ease:cubic-bezier(.16,1,.3,1);color-scheme:light}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;min-width:320px;background:#fbf6eb url(/assets/forest-paper.webp) center top/100% 100% no-repeat;min-height:100vh}button,a,select{-webkit-tap-highlight-color:transparent}button,select{font:inherit}button{cursor:pointer;color:inherit}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid #9a4f0d;outline-offset:5px}::selection{background:#dce7ad;color:#173e22}img{max-width:100%;display:block}h1,h2,h3,p{margin:0}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;z-index:100;top:12px;left:20px;transform:translateY(-160%);background:#fff;padding:12px 20px;border-radius:10px}.skip-link:focus{transform:translateY(0)}.header{height:90px;background:#fcf8efeb;border-bottom:1px solid #e8e0cc}.header-inner{max-width:1480px;height:100%;margin:auto;display:flex;align-items:center;padding:0 42px;gap:22px}.brand{display:flex;align-items:center;gap:12px;font-size:35px;font-weight:800;letter-spacing:-1px;white-space:nowrap}.brand-icon{position:relative;display:block;color:#457836;height:48px}.brand-icon>svg:last-child{position:absolute;top:-7px;left:11px;color:#6c9340;background:#fcf8ef}.forest-tag{font-size:17px;display:flex;align-items:center;gap:7px;background:#e1e8c8;padding:6px 12px;border-radius:18px;font-weight:800;white-space:nowrap}.header nav{display:flex;align-items:center;gap:42px;margin:auto;font-size:22px;font-weight:800}.nav-home{border:0;background:transparent;padding:9px 30px;border-radius:32px}.nav-home.is-selected{background:var(--orange);color:#fff}.header nav>a:hover{color:#a74c06}.header-tools{display:flex;align-items:center;gap:22px}.grade-picker select{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1.5px solid #385c2a;border-radius:30px;color:var(--ink);font-size:22px;font-weight:800;padding:8px 26px;background:#fcf8ef;cursor:pointer;min-width:160px}.avatar{height:58px;width:58px;border-radius:50%;background:#e4e9d4;overflow:hidden;flex-shrink:0}.avatar img{width:100%;height:100%;object-fit:cover;transform:scale(1.7);transform-origin:50% 30%}.page{max-width:1480px;padding:0 28px;margin:auto}.hero{min-height:244px;display:flex;align-items:center;justify-content:space-between;padding:22px 32px 0 46px;position:relative;gap:10px}.hero-copy{position:relative;z-index:2;flex-shrink:0}.hero h1{font-size:clamp(38px,4.35vw,65px);line-height:1.38;font-weight:800;letter-spacing:1px}.hero p{font-size:clamp(17px,1.65vw,25px);line-height:1.7;margin-top:13px;font-weight:500}.owl-scene{width:440px;height:244px;position:relative;flex-shrink:0;align-self:flex-end}.owl-button{border:0;background:transparent;padding:0;position:absolute;top:-38px;right:0;bottom:-26px;left:0;width:100%;border-radius:70px}.owl-body{height:100%;width:100%;display:block;position:relative;transform-origin:50% 80%}.owl-pose{position:absolute;width:100%;height:100%;top:0;right:0;bottom:0;left:0;object-fit:contain;opacity:0;pointer-events:none}.owl-pose.pose-visible{opacity:1}.is-alive .owl-body{animation:owl-breathe 4.7s ease-in-out infinite}.is-waving .owl-body{animation:owl-hello 1.3s var(--ease) both}.greet-hint{display:flex;align-items:center;justify-content:center;gap:6px;position:absolute;bottom:3px;left:50%;transform:translate(-50%);font-size:12px;white-space:nowrap;background:#fbf6ebdd;padding:4px 11px;border-radius:18px;opacity:0;transition:opacity .2s}.owl-button:hover .greet-hint,.owl-button:focus-visible .greet-hint{opacity:1}.owl-speech{position:absolute;z-index:4;right:30px;top:-16px;max-width:285px;background:#fffef6;border:1px solid #d9dfb8;border-radius:17px;padding:10px 15px;box-shadow:0 5px 18px #533b1410;font-size:15px;opacity:0;transform:translateY(6px);pointer-events:none;transition:opacity .2s,transform .2s}.owl-speech.is-visible{opacity:1;transform:translateY(0)}@keyframes owl-breathe{0%,to{transform:translateY(0) rotate(-.5deg)}50%{transform:translateY(-5px) rotate(.6deg)}}@keyframes owl-hello{0%{transform:rotate(0)}20%{transform:rotate(-5deg) translateY(-7px)}45%{transform:rotate(4deg) translateY(-4px)}70%{transform:rotate(-2deg)}to{transform:rotate(0)}}.subjects{scroll-margin-top:20px}.section-heading{height:76px;display:flex;align-items:center;gap:13px;padding-left:24px;color:#315b26}.section-heading>svg{color:#87a24d}.section-heading h2{font-size:35px;font-weight:800;letter-spacing:2px}.heading-trail{width:105px;height:1px;background:#bdcc92;margin:15px 0 0 6px}.subject-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.subject-card{min-height:248px;padding:26px 28px 24px;border:0;border-radius:30px;position:relative;overflow:hidden;text-align:left;isolation:isolate;transition:transform .22s var(--ease),box-shadow .22s var(--ease);display:block}.peach{background:#f9dfc6}.yellow{background:#faedba}.green{background:#e4ebc9}.pink{background:#f7dcd4}.subject-card:hover{transform:translateY(-4px);box-shadow:0 9px 20px #634c1610}.subject-card:active{transform:translateY(-1px)}.subject-card.active{box-shadow:inset 0 0 0 3px #648742}.subject-copy{position:relative;z-index:2;display:flex;flex-direction:column;align-items:flex-start;pointer-events:none}.subject-name{font-size:clamp(34px,3.6vw,54px);line-height:1.35;font-weight:800;letter-spacing:2px}.subject-description{font-size:clamp(15px,1.5vw,21px);margin-top:5px;font-weight:500;white-space:nowrap}.card-arrow{display:flex;align-items:center;justify-content:center;color:#fff;background:#ee7d16;border:1px solid #fff9;width:51px;height:43px;border-radius:25px;margin-top:37px;transition:transform .2s}.subject-card:hover .card-arrow{transform:translate(5px)}.subject-illustration{position:absolute;z-index:1;right:-7px;bottom:-15px;object-fit:contain;width:66%;height:98%;pointer-events:none}.subject-card:nth-child(2) .subject-illustration{right:-4px;width:61%}.subject-card:nth-child(4) .subject-illustration{right:0;width:64%}.subject-card:nth-child(6) .subject-illustration{width:65%;right:-7px}.subject-detail{margin:30px 0 20px;padding:32px;border-radius:26px;scroll-margin-top:22px}.detail-head{display:flex;justify-content:space-between;gap:20px;align-items:center}.detail-grade{font-size:15px;color:#486235;margin-bottom:6px}.detail-head h2{font-size:32px}.back-button{display:flex;align-items:center;gap:7px;border:1px solid #8e9a69;background:#fff9;padding:9px 15px;border-radius:24px;white-space:nowrap}.learning-content{display:grid;grid-template-columns:1fr 1.1fr;gap:35px;margin-top:15px}.learning-intro{display:flex;align-items:center;gap:12px}.learning-intro img{width:135px;height:150px;object-fit:contain}.learning-intro h3{font-size:21px;margin-bottom:10px}.learning-intro p{font-size:15px;line-height:1.8}.preview-note{color:#4b6141;margin-top:8px}.mini-question{padding:20px 0}.mini-question h3{font-size:21px;line-height:1.7}.answer-options{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}.answer-options button{padding:9px 22px;border:1px solid #75824a;border-radius:16px;background:#fff9;display:flex;align-items:center;gap:6px}.answer-options .correct{background:#d4e8b3;border-color:#3d6b29}.answer-options .try-again{background:#f5cbac;border-color:#a15b25}.answer-feedback{font-size:16px;line-height:1.8;min-height:29px;margin-top:17px}footer{min-height:105px;display:flex;align-items:center;justify-content:center;gap:18px;font-size:19px;letter-spacing:3px;padding:20px 20px 40px;color:#47632e}footer svg{color:#93a85c;flex-shrink:0}@media(min-width:1550px){.hero{min-height:270px}.subject-card{min-height:260px}}@media(max-width:1150px){.header-inner{padding:0 24px;gap:14px}.brand{font-size:27px}.forest-tag{font-size:13px;padding:5px 9px}.header nav{font-size:19px;gap:18px}.nav-home{padding:8px 20px}.header-tools{gap:12px}.grade-picker select{font-size:18px;min-width:130px;padding:8px 19px}.avatar{width:46px;height:46px}.hero{padding-left:20px}.owl-scene{width:340px}.hero-copy{flex-shrink:1}.hero h1{font-size:46px;letter-spacing:0}.hero p{font-size:20px}.subject-card{padding:24px 22px;min-height:225px}.subject-name{font-size:43px}.subject-description{font-size:17px}.subject-illustration{width:65%;height:90%;bottom:-10px;right:-12px}.section-heading h2{font-size:31px}.card-arrow{width:43px;height:37px;margin-top:36px}.subject-grid{gap:13px}footer{font-size:17px}}@media(max-width:850px){.header{height:78px}.header-inner{padding:0 22px}.forest-tag{display:none}.brand{font-size:27px;gap:8px}.brand-icon>svg:first-child{width:34px}.header nav{font-size:17px;gap:14px}.nav-home{padding:7px 19px}.header-tools{gap:10px}.avatar{display:none}.grade-picker select{min-width:120px;font-size:17px}.page{padding:0 22px}.hero{min-height:223px;padding:15px 10px 0}.hero h1{font-size:37px;max-width:440px;line-height:1.5}.hero p{font-size:17px;max-width:330px}.owl-scene{width:280px;height:210px;flex-shrink:0}.owl-button{top:-15px;right:-10px;bottom:-20px;left:-10px}.section-heading{padding-left:8px;height:68px}.subject-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.subject-card{min-height:215px;padding:24px}.subject-name{font-size:43px}.subject-description{font-size:17px}.subject-illustration{width:66%;height:95%}.learning-content{grid-template-columns:1fr;gap:0}.learning-intro img{width:110px;height:120px}footer{min-height:125px;font-size:16px;letter-spacing:1px;padding-bottom:50px}.owl-speech{font-size:13px;right:0;top:-10px;width:210px}}@media(max-width:560px){body{background-size:auto 100%;background-position:center top}.header{height:73px}.header-inner{padding:0 18px;gap:8px}.brand{font-size:25px;letter-spacing:-1px;gap:7px}.brand-icon{height:38px}.brand-icon>svg:first-child{height:37px;width:33px}.brand-icon>svg:last-child{width:18px;left:8px;top:-5px}.header nav{display:none}.header-tools{margin-left:auto}.grade-picker select{font-size:15px;min-width:100px;padding:7px 16px}.page{padding:0 16px}.hero{min-height:208px;padding:25px 3px 8px;align-items:flex-start;gap:0}.hero-copy{padding-top:9px;max-width:66%}.hero h1{font-size:clamp(26px,7.4vw,38px);letter-spacing:0;line-height:1.5;max-width:255px;text-wrap:balance}.hero p{font-size:14px;line-height:1.8;max-width:205px;margin-top:10px}.owl-scene{position:absolute;width:186px;height:194px;right:-12px;bottom:0}.owl-button{top:0;right:0;bottom:-9px;left:0}.owl-speech{top:-12px;right:10px;width:180px;font-size:12px;padding:8px 10px}.greet-hint{display:none}.section-heading{height:62px;gap:8px;padding-left:4px}.section-heading>svg{width:31px}.section-heading h2{font-size:26px}.heading-trail{width:65px}.subject-grid{gap:11px}.subject-card{border-radius:21px;min-height:208px;padding:18px 17px}.subject-name{font-size:35px;letter-spacing:1px}.subject-description{font-size:13px;margin-top:4px}.card-arrow{width:37px;height:32px;margin-top:56px}.card-arrow svg{width:23px}.subject-illustration{width:87%;height:66%;bottom:-4px;right:-11px}.subject-card:nth-child(2) .subject-illustration{width:82%;right:-5px}.subject-card:nth-child(4) .subject-illustration{width:83%;right:-3px}.subject-card:nth-child(6) .subject-illustration{width:87%;right:-9px}.subject-detail{padding:22px 18px;border-radius:20px;margin-top:22px}.detail-head h2{font-size:26px}.detail-grade{font-size:13px}.back-button{font-size:13px;padding:8px 11px}.learning-intro{gap:7px}.learning-intro img{width:83px;height:110px}.learning-intro h3{font-size:18px}.learning-intro p{font-size:13px}.mini-question h3{font-size:19px}.answer-options button{padding:9px 15px;font-size:15px}.answer-feedback{font-size:14px}footer{font-size:13px;gap:9px;letter-spacing:1px;min-height:100px;padding-bottom:35px}footer svg{width:17px}}.subject-card .subject-illustration{bottom:8px;height:90%}@media(max-width:560px){.subject-card .subject-illustration{bottom:5px;height:55%;width:82%}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.owl-speech,.subject-card:hover{transform:none}}
