/* Raster artwork is generated with imagegen; CSS handles layout, hit targets and motion. */
.mg-companions{position:fixed;inset:0;z-index:4;pointer-events:none}
.mg-butterfly{position:absolute;left:0;top:0;width:68px;height:68px;pointer-events:none;will-change:transform}
.mg-sprite{position:relative;display:block;width:100%;height:100%;pointer-events:none}
.mg-sprite img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center bottom;pointer-events:none}
.mg-frame-1{opacity:0}.mg-flying .mg-frame-0{animation:mg-first .42s steps(1,end) infinite}.mg-flying .mg-frame-1{animation:mg-second .42s steps(1,end) infinite}
@keyframes mg-first{0%,49%{opacity:1}50%,100%{opacity:0}}@keyframes mg-second{0%,49%{opacity:0}50%,100%{opacity:1}}
.mg-companion{position:absolute;width:86px;height:90px;min-width:44px;min-height:44px;border:0;background:transparent;padding:0;cursor:pointer;pointer-events:auto;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.mg-bird{left:1.5%;bottom:26%}.mg-frog{right:1.3%;bottom:16%}.mg-flower{left:4%;bottom:3%;width:76px;height:85px}
.mg-bird .mg-frame-0{animation:mg-bird-idle 6s steps(1,end) infinite}.mg-bird .mg-frame-1{animation:mg-bird-alt 6s steps(1,end) infinite}
@keyframes mg-bird-idle{0%,82%,100%{opacity:1}83%,92%{opacity:0}}@keyframes mg-bird-alt{0%,82%,100%{opacity:0}83%,92%{opacity:1}}
.mg-flower .mg-sprite{animation:mg-flower-idle 4.5s ease-in-out infinite;transform-origin:50% 100%}@keyframes mg-flower-idle{50%{transform:rotate(5deg)}}
.mg-companion.mg-playing .mg-frame-0{opacity:0;animation:none}.mg-companion.mg-playing .mg-frame-1{opacity:1;animation:none}
.mg-bird.mg-playing .mg-sprite{animation:mg-wave .45s ease-in-out 3}.mg-flower.mg-playing .mg-sprite{animation:mg-flower .5s ease-in-out 3}
.mg-frog.mg-playing .mg-sprite{animation:mg-hop .65s cubic-bezier(.2,.8,.3,1) 2;transform-origin:50% 100%}
@keyframes mg-wave{50%{transform:rotate(-8deg)}}@keyframes mg-flower{25%{transform:rotate(-10deg)}75%{transform:rotate(8deg)}}@keyframes mg-hop{0%,100%{transform:translateY(0)}45%{transform:translateY(-43px) rotate(-5deg)}}
.mg-pet-bubble{position:absolute;bottom:calc(100% + 8px);left:0;min-width:150px;max-width:200px;border:2px solid var(--ink);border-radius:13px;background:#fff9df;box-shadow:0 3px 0 var(--ink);padding:7px 10px;font:700 13px/1.5 var(--f-body);color:var(--ink);pointer-events:none;opacity:0;transform:translateY(6px);transition:opacity .2s,transform .2s}
.mg-frog .mg-pet-bubble{left:auto;right:0}.mg-playing .mg-pet-bubble{opacity:1;transform:none}
.mg-companion:focus-visible{outline:3px solid #236880;border-radius:50%;outline-offset:3px}
/* Module book directory retains shared navigation and original record ids. */
#v-module-map #shelf .shelf-card{background:#fff8e5;border-color:#6b3e1f}
#v-module-map #shelf .library-thumbnail svg,#v-module-map #shelf .coverface svg{visibility:hidden}
#v-module-map #shelf .library-thumbnail{position:relative;background:#ffe7ae}
#v-module-map #shelf .library-thumbnail:after{content:'';position:absolute;inset:4px;background:url('../assets/module-map/v1/zh-island.webp') center/contain no-repeat}
#v-module-map #shelf .coverface:after{content:'';position:absolute;inset:18% 8% 8%;background:url('../assets/workbook-picker/v2/module-book.webp') center/contain no-repeat}
#v-module-map #shelf .lib-chhead{background:linear-gradient(100deg,#ffe8aa,#fff7e4)}
body.module-chinese-learning #bg{visibility:hidden}
body.module-chinese-learning #v-game{background:#fff0d1 url('../assets/module-learning/v4/classroom-background.webp') center/cover no-repeat}
body.module-chinese-learning .stage{--coachW:clamp(160px,17vw,230px);padding-top:8px;grid-template-columns:var(--coachW) minmax(0,1fr)}
body.module-chinese-learning .board{background:#fffaf0f2;border:3px solid #6b3e1f;border-radius:25px;box-shadow:0 6px 0 #724220;max-width:1120px}
body.module-chinese-learning .bk-card,body.module-chinese-learning .mt-card{background:#fffaf0;border-color:#926335;box-shadow:0 3px 0 #d9b578}
body.module-chinese-learning .bk-pic,body.module-chinese-learning .mt-pic{background:#fff8e7;border-color:#b9945f}
body.module-chinese-learning .bk-pic img,body.module-chinese-learning .mt-pic img{object-fit:contain}
body.module-chinese-learning .coach .bubble{background:#fffcf1;border:3px solid #6b3e1f;box-shadow:0 4px 0 #724220;font-size:15px}
body.module-chinese-learning #gBobo{position:relative;max-height:310px}
body.module-chinese-learning #gBobo>svg{visibility:hidden}
.mz-guide{position:absolute;inset:0;pointer-events:none;display:none}
body.module-chinese-learning .mz-guide{display:block}
.mz-guide img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center bottom}
.mz-guide-cheer{opacity:0}.mz-answer-cheer .mz-guide-idle{opacity:0}.mz-answer-cheer .mz-guide-cheer{opacity:1}.mz-answer-cheer .mz-guide{animation:mg-wave .45s ease-in-out 3}
.mz-reading{border:2px solid #bd9353;border-radius:16px;background:#fff4d5;margin:0 0 16px;overflow:hidden}
.mz-reading summary{cursor:pointer;display:flex;justify-content:space-between;gap:10px;align-items:center;padding:11px 14px;min-height:44px;font:800 17px/1.4 var(--f-body);color:#5a3216;list-style:none}
.mz-reading summary span{font-size:12px;white-space:nowrap;color:#7b6142}
.mz-reading p{margin:0;padding:3px 18px 12px;font:500 16px/1.9 var(--f-body);color:#432916;white-space:normal;user-select:text}
.mz-read-aloud{display:block;margin:0 16px 12px;min-height:44px;background:#ffe19a;border:2px solid #754820;border-radius:12px;padding:7px 13px;font:700 14px var(--f-body);cursor:pointer}
.mz-reading[open] summary span{font-size:0}.mz-reading[open] summary span:after{content:"上下滑动读全文";font-size:12px}
.mz-origin-word{font:700 14px var(--f-body);color:#6b492f;margin:0 0 12px}
.mz-writing{display:grid;grid-template-columns:minmax(160px,.75fr) minmax(0,1.3fr);gap:20px;align-items:start}
.mz-write-picture{margin:0;display:grid;place-items:center;background:#fff8e1;border:2px solid #c4a36f;border-radius:21px;padding:12px;min-height:160px}
.mz-write-picture img{display:block;width:100%;max-height:min(52dvh,480px);object-fit:contain;object-position:center}
.mz-write-panel{min-width:0}.mz-write-label{display:inline-block;background:#ffdea2;border-radius:8px;margin:0 0 9px;padding:4px 9px;color:#63431e;font:800 13px var(--f-body)}
.mz-write-prompt{font:700 19px/1.6 var(--f-body);margin:0 0 12px;color:#4c2c16}
.mz-word-hints{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:10px}.mz-word-hints span{padding:4px 10px;background:#dbefce;border:2px solid #7f985e;border-radius:9px;font:700 14px var(--f-body)}
.mz-input-label{display:block;color:#714f32;font:700 13px var(--f-body)}
.mz-draft{display:block;width:100%;min-height:110px;margin-top:6px;padding:11px;border:2px solid #a7804d;border-radius:13px;background:#fffdf8;color:#432b1b;font:500 18px/1.7 var(--f-body);resize:vertical;user-select:text}
.mz-checks{display:grid;gap:5px;margin:10px 0}.mz-checks label{display:flex;align-items:center;gap:9px;min-height:44px;padding:6px 10px;border-radius:10px;background:#f5eccf;font:600 14px/1.5 var(--f-body);cursor:pointer}
.mz-checks input{width:21px;height:21px;accent-color:#50892c;margin:0;flex-shrink:0}
.mz-write-status{font:600 13px/1.5 var(--f-body);margin:7px 0;color:#765c3e;min-height:20px}
.mz-reference{font:500 14px/1.8 var(--f-body);border:1px solid #cab187;border-radius:10px;margin:11px 0;background:#fff3db;padding:0 10px}
.mz-reference summary{cursor:pointer;font-weight:700;min-height:44px;display:flex;align-items:center}.mz-reference p{margin:5px 0}.mz-reference small{display:block;margin:8px 0;color:#79664f}
.mz-writing-done{min-height:48px;background:#e59451!important;color:#3e240f!important}.mz-writing-done:disabled{opacity:.55;cursor:default}
.mz-write-review{display:grid;gap:15px;font:500 15px/1.8 var(--f-body);padding:10px}
.mz-child-sentence,.mz-example-sentence{background:#fff5d7;border:2px solid #b8924f;border-radius:15px;padding:12px 14px}.mz-child-sentence{background:#e3f3d6;border-color:#8aa769}
.mz-write-review b{display:block;font-size:13px}.mz-write-review p{margin:5px 0}.mz-write-review small{color:#755d40}
body.module-chinese-learning .sheet{background:#fff8e7;border-color:#80512d}
@media(max-width:1000px){.mg-bird{left:8px;bottom:20%}.mg-companion{width:66px;height:72px}.mg-flower{width:58px;height:69px}.mg-butterfly{width:56px;height:56px}.mz-writing{grid-template-columns:minmax(130px,.65fr) minmax(0,1.3fr);gap:14px}}
@media(max-width:700px){
 .mg-bird{left:4px;bottom:9%;width:50px;height:58px}.mg-frog{right:4px;bottom:3%;width:55px;height:60px}.mg-flower{left:5px;bottom:2%;width:48px;height:55px}.mg-butterfly{width:45px;height:45px}.mg-pet-bubble{font-size:12px;min-width:130px}
 body.module-chinese-learning .stage{display:flex;flex-direction:column;padding-top:6px}body.module-chinese-learning .stage .coach{display:flex!important;height:auto;max-height:none;flex-direction:row;align-items:center;gap:10px;padding:0 0 8px;flex-shrink:0}
 body.module-chinese-learning .coach .bubble{font-size:13px;min-height:44px;flex:1;padding:7px 11px}.module-chinese-learning .coach .bubble:after{display:none}
 body.module-chinese-learning #gBobo{width:62px;height:70px;min-height:0;flex-shrink:0}body.module-chinese-learning #gBobo>svg{height:70px}
 body.module-chinese-learning .board{border-width:2px;padding:12px;border-radius:18px}.mz-reading summary{font-size:15px;padding:9px 11px}.mz-reading p{font-size:15px;padding:4px 13px 10px}
 .mz-writing{grid-template-columns:1fr;gap:12px}.mz-write-picture{min-height:100px;padding:8px}.mz-write-picture img{max-height:155px;width:auto;max-width:100%}.mz-write-prompt{font-size:16px}.mz-draft{font-size:16px;min-height:105px}.mz-checks label{font-size:13px}.mz-write-review{font-size:14px}
}
@media(prefers-reduced-motion:reduce){.mg-companions *,.mz-guide,.mz-writing *{animation:none!important;transition:none!important}.mg-butterfly{transform:translate(18px,180px)}.mg-playing .mg-pet-bubble{transform:none}}

body.module-chinese-learning .stage .play{flex:1;min-height:0}
.mz-reading p{max-height:145px;overflow:auto;line-height:1.7}
@media(max-width:700px){.mz-reading p{max-height:145px}}

/* Keep the illustration compact and preserve explicit tap-to-zoom. */
body.module-chinese-learning .mt-pic,body.module-chinese-learning .bk-pic{max-height:min(52dvh,480px);max-width:min(100%,calc(min(52dvh,480px) * var(--ar)))}
body.module-chinese-learning>.bk-peekimg{display:none}
body.module-chinese-learning #rBobo{position:relative}
body.module-chinese-learning #rBobo>svg{visibility:hidden}
body.module-chinese-learning #rBobo .mz-guide-idle{opacity:0}
body.module-chinese-learning #rBobo .mz-guide-cheer{opacity:1}
body.module-chinese-learning .mcard.reward{background:#fff8e5;border-color:#80512d}
#v-module-map #shelf .library-thumbnail>b{z-index:1}
#v-module-map #shelf .lib-ch[data-ch="1"] .library-thumbnail:after{background-image:url('../assets/module-learning/v4/bee.webp')}
#v-module-map #shelf .lib-ch[data-ch="2"] .library-thumbnail:after{background-image:url('../assets/module-learning/v4/family.webp')}
#v-module-map #shelf .lib-ch[data-ch="3"] .library-thumbnail:after{background-image:url('../assets/module-learning/v4/drawing.webp')}
#v-module-map #shelf .lib-ch[data-ch="4"] .library-thumbnail:after{background-image:url('../assets/module-learning/v4/soup.webp')}
#v-module-map #shelf .lib-ch[data-ch="5"] .library-thumbnail:after{background-image:url('../assets/module-learning/v4/fox-car.webp')}
#v-module-map #shelf .lib-ch[data-ch="6"] .library-thumbnail:after{background-image:url('../assets/module-learning/v4/torch.webp')}
#v-module-map #shelf .lib-ch[data-ch="7"] .library-thumbnail:after{background-image:url('../assets/module-learning/v4/birds-learn.webp')}
#v-module-map #shelf .lib-ch[data-ch="8"] .library-thumbnail:after{background-image:url('../assets/module-learning/v4/rose.webp')}
@media(max-width:700px){body.module-chinese-learning .mt-pic,body.module-chinese-learning .bk-pic{max-height:min(40dvh,260px);max-width:min(100%,calc(min(40dvh,260px) * var(--ar)))}}

/* The garden cast belongs to the scrollable scene, with grounded landing spots. */
#v-module-map .mg-companions{position:absolute;inset:0;overflow:clip}
#v-module-map .docks{pointer-events:none}
#v-module-map .docks button,#v-module-map .docks a{pointer-events:auto}
#v-module-map .mg-companions:not(.mg-awake) *{animation-play-state:paused!important}
.mg-ground{position:absolute;left:15%;right:15%;bottom:1%;height:10%;border-radius:50%;background:#42653150;filter:blur(1px);pointer-events:none}
.mg-bird .mg-ground,.mg-flower .mg-ground{display:none}
#v-module-map .mg-rabbit{left:calc(1.5% + 92px);bottom:16%;width:clamp(72px,7.2vw,112px);height:clamp(76px,7.6vw,118px)}
.mg-rabbit .mg-frame-0{animation:mg-rabbit-rest 8s steps(1,end) infinite}
.mg-rabbit .mg-frame-1{animation:mg-rabbit-look 8s steps(1,end) infinite}
@keyframes mg-rabbit-rest{0%,72%,100%{opacity:1}73%,90%{opacity:0}}
@keyframes mg-rabbit-look{0%,72%,100%{opacity:0}73%,90%{opacity:1}}
.mg-rabbit.mg-playing .mg-sprite{animation:mg-rabbit-hop .85s ease-in-out 2;transform-origin:50% 95%}
@keyframes mg-rabbit-hop{0%,16%,100%{transform:translate(0,0)}48%{transform:translate(12px,-28px) rotate(-4deg)}75%{transform:translate(3px,0) rotate(0)}}
.mg-rabbit.mg-playing .mg-ground,.mg-frog.mg-playing .mg-ground{animation:mg-ground-hop .85s ease-in-out 2}
@keyframes mg-ground-hop{48%{transform:scale(.65);opacity:.4}}
#v-module-map .mg-frog{bottom:11%;right:2.5%}
.mg-frog .mg-ground{left:2%;right:2%;height:17%;bottom:-2%;border:2px solid #577a40;background:#b5d77c;filter:none;box-shadow:0 3px 0 #647d45}
.mg-landing{position:absolute;inset:auto 0 -5%;height:17%;border:2px solid #d9faff;border-radius:50%;opacity:0;pointer-events:none}
.mg-frog.mg-playing .mg-landing{animation:mg-water-landing .65s ease-out 2}
@keyframes mg-water-landing{0%,60%{opacity:0;transform:scale(.6)}65%{opacity:.9}100%{opacity:0;transform:scale(1.5)}}
#v-module-map .mg-rabbit .mg-pet-bubble{left:0;min-width:160px}
@media(max-width:1000px){#v-module-map .mg-rabbit{width:90px;height:96px;left:5%;bottom:13%}#v-module-map .mg-bird{bottom:28%}}
@media(max-width:700px){
 #v-module-map .mg-rabbit{width:74px;height:80px;left:3%;bottom:13%}
 #v-module-map .mg-frog{bottom:5%;right:4%}
 #v-module-map .mg-bird{bottom:24%;left:2%}
 #v-module-map .mg-flower{bottom:3%;left:3%}
}
@media(prefers-reduced-motion:reduce){#v-module-map .mg-companions *{animation:none!important;transition:none!important}.mg-landing{display:none}}

/* Locomotion uses contact, flight and landing poses; the shadow stays on the ground. */
.mg-face{display:block;position:relative;width:100%;height:100%;transform-origin:50% 95%}
.mg-frame-air,.mg-frame-land{opacity:0}
#v-module-map .mg-rabbit .mg-face img{animation:none;opacity:0}
#v-module-map .mg-rabbit[data-pose=rest] .mg-frame-0,
#v-module-map .mg-rabbit[data-pose=look] .mg-frame-1,
#v-module-map .mg-rabbit[data-pose=air] .mg-frame-air,
#v-module-map .mg-rabbit[data-pose=land] .mg-frame-land{opacity:1}
#v-module-map .mg-rabbit.mg-playing .mg-frame-1{opacity:1}
#v-module-map .mg-rabbit.mg-playing .mg-frame-air,#v-module-map .mg-rabbit.mg-playing .mg-frame-land{opacity:0}
.mg-perch{position:absolute;inset:0;clip-path:inset(79% 0 0);pointer-events:none}
.mg-perch img{width:100%;height:100%;object-fit:contain;object-position:center bottom}
.mg-bird .mg-sprite{clip-path:inset(0 0 17%)}
.mg-auto-active .mg-frame-0{opacity:0;animation:none}.mg-auto-active .mg-frame-1{opacity:1;animation:none}
#v-module-map .mg-rabbit{will-change:transform}
@media(prefers-reduced-motion:reduce){.mg-face{transform:none!important}}