@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700;800;900&display=swap');:root{font-family:Nunito,system-ui,sans-serif;color:#15335b;background:#ccecb9}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0}button,select,input{font:inherit}button{cursor:pointer}button:focus-visible,select:focus-visible{outline:3px solid #1460b3;outline-offset:3px}a{text-decoration:none;color:inherit}.world{min-height:100vh;background:linear-gradient(180deg,#ffffff00 0,#ffffff00 420px,#d9f4ccbb 850px,#ccecb9 100%),url('forest.png') center top/cover fixed}.shell{max-width:1500px;padding:16px 28px;margin:auto}header{display:flex;align-items:center;gap:18px;justify-content:space-between}.brand,nav,.welcome{background:#fffffff5;border-radius:34px;box-shadow:0 10px 25px #1743681a}.brand{padding:9px 23px;min-width:250px}.brand strong{font-size:32px;letter-spacing:-2px;color:#934a19;font-weight:900}.brand strong span{color:#267bd3}.brand small{display:block;font-size:13px;font-weight:900;text-align:center}nav{display:flex;gap:3px;padding:7px}nav button{border:0;background:transparent;border-radius:23px;padding:12px 18px;color:#17375d;font-weight:900;white-space:nowrap}nav button:hover,nav button.current{background:#dff5e5;color:#08765a}.welcome{display:flex;align-items:center;gap:5px;padding:6px 17px;font-weight:900;line-height:1.1;white-space:nowrap}.welcome img{width:52px;height:58px;object-fit:contain}.view{display:none}.view.active{display:block}.hero{min-height:470px;display:flex;align-items:center;position:relative;padding:35px 6%}.hero-bear{width:min(32%,400px);max-height:470px;object-fit:contain;align-self:end;filter:drop-shadow(6px 15px 8px #23512b66);transform:rotate(-5deg)}.speech{background:#ffffffed;border-radius:45px;padding:30px 39px;max-width:540px;box-shadow:0 15px 30px #1b4b6420;transform:rotate(-2deg)}h1{font-size:clamp(32px,3.8vw,54px);line-height:1.1;margin:0 0 12px;font-weight:900}.speech p{font-size:21px;font-weight:800;margin:0 0 22px;line-height:1.4}.sun-button{border:4px solid white;background:linear-gradient(#ffdb68,#ffad28);color:#704009;border-radius:25px;padding:13px 23px;box-shadow:0 5px #c5771e;font-weight:900;font-size:20px}.wood-sign{position:absolute;top:60px;right:2%;background:#f9e0a7;border:8px solid #915325;border-radius:17px;box-shadow:5px 8px #55311555;padding:17px 22px;transform:rotate(3deg);font-size:24px;font-weight:900;color:#5a311b;text-align:center}.wood-sign small{font-size:13px;display:block;margin-top:8px}.intro-bar{display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap;margin:-12px 0 20px;position:relative;font-weight:900}.intro-bar>span:first-child{background:#fff;border-radius:20px;padding:10px 15px}.grades{display:flex;gap:8px;flex-wrap:wrap}.grades button{border:3px solid white;background:#f2bc58;color:#603812;border-radius:20px;padding:9px 18px;box-shadow:0 4px #a76c2c;font-weight:900}.grades button.active{background:#69c875;color:#15533e;box-shadow:0 4px #2b8a56}.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.feature{border:0;text-align:left;border-radius:28px;min-height:195px;padding:22px;box-shadow:0 12px 24px #185b3a24;color:#19375b;display:flex;flex-direction:column;align-items:flex-start}.feature.blue{background:#f4fbffed}.feature.green{background:#eafff2ed}.feature.pink{background:#fff0f9ed}.feature.amber{background:#fffaf0ed}.feature-icon{font-size:36px}.feature strong{font-size:23px;line-height:1.2}.feature small{font-size:15px;margin:11px 0;line-height:1.4}.feature em{font-size:15px;font-style:normal;color:#fff;background:#2685dc;padding:9px 17px;border-radius:20px;font-weight:900;margin-top:auto}.feature.green em{background:#159663}.feature.pink em{background:#d73d81}.feature.amber img{height:110px;max-width:100%;object-fit:contain;align-self:center}.feature.amber strong{font-size:19px}.map{background:#fffffff2;border-radius:26px;padding:23px;margin-top:22px}.map h2{margin:0 0 17px}.skill-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.skill-chip{border:2px solid #e1eee9;background:#f7fbfa;border-radius:20px;padding:13px;text-align:left;color:#19375b;font-weight:900;font-size:15px}.skill-chip span{font-size:26px;display:block}.skill-chip:hover{background:#e4f7ec}.workspace{max-width:1080px;margin:38px auto 0}.section-title{display:flex;align-items:center;gap:18px;background:#ffffffeb;border-radius:30px;padding:10px 23px;margin-bottom:16px}.section-title img{width:85px;height:90px;object-fit:contain}.section-title h1{font-size:34px;margin:0 0 5px}.section-title p{margin:0;font-weight:700;font-size:16px}.workspace-card{background:#fffffff7;border-radius:29px;padding:27px;min-height:420px;box-shadow:0 13px 30px #19564124}.toolbar{display:flex;gap:17px;align-items:center;flex-wrap:wrap;padding-bottom:18px;border-bottom:2px solid #e7f1e9;margin-bottom:20px;font-weight:900}.toolbar label{display:flex;gap:8px;align-items:center}select{border:2px solid #add6bc;border-radius:13px;padding:8px 12px;background:white;color:#15335b;font-weight:800;max-width:100%}.toolbar span{margin-left:auto}.action{border:0;border-radius:19px;background:#12875f;color:white;padding:11px 18px;font-weight:900}.action.secondary{background:#edf7f1;color:#126748}.action:disabled{opacity:.48;cursor:not-allowed}.lesson-list{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.lesson-card{border:2px solid #e1eee9;background:#f7fcf9;border-radius:17px;padding:15px;text-align:left;color:#17375d}.lesson-card strong{display:block;font-size:18px}.lesson-card small{font-size:13px}.lesson-card:hover{border-color:#40aa78}.reader{background:#f1f9ed;padding:20px;border-radius:20px;font-size:18px;line-height:1.7;white-space:pre-line;margin:15px 0 24px}.question-label{font-size:21px;font-weight:900}.answers{display:grid;gap:10px;margin:13px 0}.answers button{border:2px solid #bfdaca;background:white;color:#15335b;text-align:left;padding:13px 15px;border-radius:16px;font-weight:800;font-size:16px}.answers button:hover:not(:disabled){background:#e2f6eb}.answers button.correct{background:#e0f8e7;border-color:#24a662}.answers button.wrong{background:#ffe8e8;border-color:#df6c78}.feedback{font-weight:900;min-height:27px}.feedback.good{color:#12875f}.feedback.try{color:#ad4d53}.meta{color:#496b62;font-size:14px;font-weight:800}.pager{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-top:20px}.result-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:18px 0}.result-item{background:#f1f9f4;border-radius:18px;padding:17px}.result-item strong{display:block}.result-item p{margin:5px 0}.notice{background:#fff6dc;border-radius:16px;padding:15px;font-weight:800}.short-response{background:#f7faff;padding:15px;border-radius:16px;margin:15px 0}.short-response details{margin-top:7px}footer{text-align:center;padding:28px;color:#285842;font-weight:900}@media(max-width:1100px){header{flex-wrap:wrap}nav{order:3;flex:1;justify-content:center}.wood-sign{display:none}.feature-grid{grid-template-columns:repeat(2,1fr)}.skill-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:680px){.shell{padding:10px 12px}.brand{min-width:0;padding:7px 12px}.brand strong{font-size:25px}.brand small{font-size:10px}.welcome{font-size:12px;padding:5px 8px}.welcome img{width:33px;height:39px}nav{width:100%;overflow:auto;justify-content:flex-start;border-radius:20px}nav button{padding:9px;font-size:14px}nav button span{display:none}.hero{min-height:430px;display:block;padding:15px}.hero-bear{position:absolute;width:145px;max-height:185px;right:5px;top:0}.speech{position:relative;margin-top:133px;padding:22px;border-radius:27px}.speech p{font-size:17px}.sun-button{font-size:16px}.intro-bar{margin:5px 0 18px;gap:9px;font-size:14px}.grades button{padding:7px 10px;font-size:13px}.feature-grid{gap:9px}.feature{padding:14px;min-height:175px;border-radius:20px}.feature strong{font-size:17px}.feature small,.feature em{font-size:13px}.feature-icon{font-size:28px}.feature.amber img{height:85px}.skill-grid{grid-template-columns:repeat(2,1fr)}.skill-chip{font-size:13px}.workspace{margin-top:15px}.section-title{padding:8px 13px}.section-title img{width:60px;height:67px}.section-title h1{font-size:24px}.section-title p{font-size:14px}.workspace-card{padding:16px}.toolbar span{margin-left:0}.lesson-list,.result-grid{grid-template-columns:1fr}.reader{font-size:17px;padding:16px}}
/* Hồ sơ, lời dẫn của Mono và phần thưởng */
.welcome{border:0;color:#15335b;text-align:left;cursor:pointer}.profile-form{display:flex;align-items:end;gap:12px;flex-wrap:wrap;margin:15px 0}.profile-form label{font-weight:900;display:grid;gap:5px}.profile-form input{border:2px solid #add6bc;border-radius:13px;padding:9px 12px;min-width:220px;color:#15335b}.profile-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px}.profile-card{border:2px solid #cfe8dc;background:#f6fbf8;padding:15px;border-radius:18px;text-align:left;color:#15335b}.profile-card.selected{border-color:#159663;background:#e9f9ee}.profile-card strong,.profile-card span{display:block}.profile-card span{font-size:14px}.mono-guide{display:flex;align-items:center;gap:15px;background:#fff7df;border-radius:20px;padding:9px 16px;margin:12px 0;font-size:18px;color:#754116}.mono-guide img{width:78px;height:85px;object-fit:contain}.lesson-card.locked{opacity:.58;background:#eef1ee;cursor:not-allowed}.badge-row{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.badge{background:#eff1ee;border-radius:16px;padding:14px;filter:grayscale(1);opacity:.7}.badge.earned{background:#fff4d9;filter:none;opacity:1}.badge strong,.badge small{display:block}.badge-earned{display:inline-block;background:#fff0c9;padding:13px;border-radius:17px;font-size:18px;margin:10px 0}#confetti{position:fixed;inset:0;z-index:10;pointer-events:none;overflow:hidden}.confetti-bit{position:absolute;top:-25px;width:11px;height:18px;animation:fall 1.7s ease-in forwards;transform:rotate(20deg)}@keyframes fall{to{transform:translate(var(--drift),105vh) rotate(780deg);opacity:0}}@media(max-width:680px){.badge-row{grid-template-columns:repeat(2,1fr)}.mono-guide img{width:60px;height:67px}.mono-guide{font-size:16px}}
/* Thanh đầu trang và âm thanh */
header{gap:12px}.brand{min-width:235px;padding:8px 18px;flex:none}.brand small{line-height:1.18;margin-top:1px}.header-actions{display:flex;align-items:center;gap:8px;flex:none}.welcome{min-width:177px;padding:5px 12px;line-height:1.12}.welcome span{display:block;max-width:115px;overflow:hidden;text-overflow:ellipsis}.welcome strong{display:block;font-size:16px;color:#17375d;overflow:hidden;text-overflow:ellipsis}.sound-toggle{border:0;background:#fffffff5;color:#15335b;border-radius:50%;box-shadow:0 10px 25px #1743681a;width:45px;height:45px;font-size:23px;display:grid;place-items:center}.sound-toggle:hover{background:#e4f7ec}nav button{padding:10px 14px}@media(max-width:1100px){.header-actions{margin-left:auto}}@media(max-width:680px){.brand{min-width:0;padding:6px 10px}.brand strong{font-size:24px}.brand small{font-size:11px}.header-actions{gap:5px}.welcome{min-width:0;padding:4px 7px}.welcome img{width:30px;height:37px}.welcome span{max-width:92px;font-size:11px}.welcome strong{font-size:12px}.sound-toggle{width:35px;height:35px;font-size:18px}header{gap:6px}}
@media(max-width:380px){.brand strong{font-size:21px}.brand small{font-size:10px}.welcome img{display:none}.welcome span{max-width:88px}.sound-toggle{width:32px;height:32px}}

/* Mono chào đón trên trang chủ */
#home .hero-bear{transform-origin:55% 82%;animation:monoHello 3.8s ease-in-out infinite;will-change:transform}#home .hero-bear:hover{animation:monoHello 1.6s ease-in-out infinite}#home .feature.amber img{animation:monoBounce 4.2s ease-in-out infinite;transform-origin:50% 90%}@keyframes monoHello{0%,100%{transform:translateY(0) rotate(-5deg)}25%{transform:translateY(-12px) rotate(0deg)}50%{transform:translateY(-5px) rotate(-8deg)}75%{transform:translateY(-14px) rotate(1deg)}}@keyframes monoBounce{0%,100%{transform:translateY(0) rotate(0)}45%{transform:translateY(-8px) rotate(-3deg)}65%{transform:translateY(-4px) rotate(3deg)}}@media(prefers-reduced-motion:reduce){#home .hero-bear,#home .hero-bear:hover,#home .feature.amber img{animation:none}}

.music-button{display:inline-block;margin:10px 0 0 12px;border:3px solid #fff;background:#22885e;color:#fff;border-radius:22px;padding:12px 18px;font-size:17px;font-weight:900;box-shadow:0 4px #145e3c}.music-button:hover{background:#176d4a}@media(max-width:680px){.music-button{margin-left:0;font-size:15px;padding:9px 13px}}
.short-response textarea{display:block;width:100%;margin:14px 0 8px;padding:14px;border:2px solid #add6bc;border-radius:16px;background:#fff;color:#15335b;font:700 17px/1.5 Nunito,system-ui,sans-serif;resize:vertical;min-height:120px}.short-response textarea:focus-visible{outline:3px solid #1460b3;outline-offset:2px}.written-hint{background:#e6f7ed;border:2px solid #86d9a2;border-radius:16px;padding:14px;margin:15px 0}.written-hint p{margin:9px 0}.written-hint small{color:#315b45}
.encourage-teaser{display:flex;align-items:center;gap:15px;width:100%;margin:20px 0 0;padding:16px 23px;border:3px solid #fff;border-radius:25px;background:#fff5cfee;color:#634416;text-align:left;box-shadow:0 10px 22px #72500c22}.encourage-teaser span{font-size:34px}.encourage-teaser strong{font-size:20px}.encourage-teaser small{font-size:15px;font-weight:700;flex:1}.encourage-teaser em{font-style:normal;font-weight:900;color:#9a5a18}.feeling-choices{display:flex;flex-wrap:wrap;gap:11px;margin:16px 0 22px}.feeling-choice{border:2px solid #e2dabb;background:#fffdf5;color:#514329;border-radius:18px;padding:13px 17px;font-weight:900}.feeling-choice:hover,.feeling-choice.selected{background:#ffeaa5;border-color:#edbd51}.encouragement-message{background:#fff7d9;border-radius:23px;padding:17px 21px;margin-top:22px;border:2px solid #f2d48a}.encouragement-message #monoEncouragementText{font-size:21px;line-height:1.6;font-weight:800;color:#55401d}.encouragement-message .action{margin:5px 6px 5px 0}@media(max-width:680px){.encourage-teaser{flex-wrap:wrap;gap:8px;padding:13px}.encourage-teaser small{flex-basis:100%}.encourage-teaser em{margin-left:auto}.feeling-choice{width:100%;text-align:left}}
/* Góc đọc ebook */
.ebook-home-card{display:flex;align-items:center;gap:22px;margin:20px 0;padding:18px 26px;border:3px solid #fff;border-radius:28px;background:linear-gradient(115deg,#fff8df,#e5f7ec);box-shadow:0 10px 25px #25583b25}.ebook-home-illustration{position:relative;flex:0 0 142px;height:140px}.ebook-home-illustration img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 7px 5px #345a3344)}.ebook-home-illustration span{position:absolute;right:-14px;top:4px;font-size:32px}.ebook-home-card h2{margin:2px 0 6px;font-size:clamp(23px,2.3vw,32px);color:#1f6344}.ebook-home-card p{margin:4px 0 13px;line-height:1.45;font-weight:700}.ebook-view{max-width:1210px;margin:24px auto 0}.ebook-intro{display:flex;align-items:center;justify-content:space-between;gap:18px;background:#fffcf0f5;border:3px solid #fff;border-radius:27px;padding:13px 21px;margin-bottom:13px}.ebook-title{display:flex;align-items:center;gap:14px}.ebook-title img{width:85px;height:90px;object-fit:contain}.ebook-title h1{font-size:clamp(25px,2.8vw,38px);margin:2px 0}.ebook-title p{margin:3px 0;font-weight:700}.ebook-open{white-space:nowrap}.ebook-frame-wrap{padding:10px;border:6px solid #fff;border-radius:27px;background:#fff8e5;box-shadow:0 13px 28px #19564124;overflow:hidden}.ebook-frame-wrap iframe{display:block;width:100%;height:min(76vh,790px);min-height:580px;border:0;border-radius:17px;background:#fff}.ebook-help{padding:7px 13px;margin:9px 0;color:#285842;font-weight:800}@media(max-width:680px){.ebook-home-card{padding:13px;gap:10px}.ebook-home-illustration{flex-basis:85px;height:105px}.ebook-home-illustration span{font-size:22px;right:-8px}.ebook-home-card p{font-size:14px}.ebook-intro{align-items:flex-start;flex-wrap:wrap;padding:9px}.ebook-title img{width:62px;height:70px}.ebook-open{margin-left:auto}.ebook-frame-wrap{padding:3px;border-width:3px}.ebook-frame-wrap iframe{min-height:540px;height:78vh}}
/* Thanh điều hướng hai hàng, gọn cả trên máy tính và điện thoại */
header{display:grid;grid-template-columns:minmax(230px,1fr) minmax(520px,760px) auto;align-items:center;gap:12px}header nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:3px;width:100%;min-width:0;order:initial;flex:initial}header nav button{white-space:normal;line-height:1.15;min-height:42px;padding:8px 9px}header .header-actions{margin-left:0}@media(max-width:1200px){header{grid-template-columns:minmax(0,1fr) auto}header .brand{grid-column:1;grid-row:1}header .header-actions{grid-column:2;grid-row:1}header nav{grid-column:1/-1;grid-row:2;justify-self:center;max-width:760px}}@media(max-width:680px){header{gap:7px}header nav{overflow:visible;padding:5px;gap:2px}header nav button{font-size:17px;min-height:54px;padding:5px 3px}header nav button span{display:block;font-size:10px;line-height:1.05;white-space:normal;overflow-wrap:anywhere;margin-top:2px}}@media(max-width:380px){header nav button span{font-size:9px}}