[hidden]{display:none!important}.demo-wrap{max-width:1100px}.demo-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:25px 0 22px}.demo-heading h1{font-size:34px}.demo-heading .module-tag{margin-bottom:7px}.demo-heading .text-link{white-space:nowrap}.demo-shell{border:1px solid #cfdfd0;border-radius:25px;overflow:hidden;background:#fff;margin-bottom:14px;box-shadow:0 10px 35px #294c3010}.demo-start{display:grid;grid-template-columns:.8fr 1.2fr;gap:42px;padding:40px;align-items:center;background:#eff8eb}.demo-start>img{width:100%;max-width:340px;border-radius:20px;margin:auto}.demo-start h2{font-size:31px}.demo-start p{font-size:17px}.demo-start .small{font-size:12px;color:#60715e}.demo-start .btn{cursor:pointer;border:0;margin-top:12px}.demo-toolbar{display:flex;align-items:center;justify-content:flex-end;gap:12px;padding:12px 18px;background:#f1f7ee;border-bottom:1px solid #dce7d6}.demo-toolbar>span{margin-right:auto;color:#365d3b;font-size:14px;font-weight:600}.demo-toolbar button,.reading-controls button{border:1px solid #bfd2b8;border-radius:50px;background:white;color:#2e6647;padding:9px 16px;min-height:44px;font-size:14px;cursor:pointer}.demo-toolbar button:hover,.reading-controls button:hover{background:#e3f0dd}.wash-play{display:grid;grid-template-columns:1.14fr 1fr;align-items:stretch}.wash-scene{position:relative;background:#e3f1ed url('/assets/media/wash-bathroom-sink-web-v1.webp') center/cover;min-width:0;display:flex;align-items:center;overflow:hidden}.bear-zone{position:relative;aspect-ratio:1;width:100%;touch-action:none;user-select:none;-webkit-user-select:none}.bear-zone>img#wash-bear{width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none}.sink-edge{position:absolute;bottom:0;left:0;width:100%;height:12%;background:#e0ceb1;border-top:8px solid #f8f5e9;pointer-events:none;z-index:1}.wash-guidance{padding:28px 26px;display:flex;flex-direction:column;align-items:flex-start}.wash-guidance h2{font-size:27px}.wash-guidance>p[lang=en]{font:22px/1.4 Georgia,serif;color:#2e6647;margin:12px 0 8px;min-height:31px}.demo-feedback{font-size:14px;min-height:48px;margin:4px 0 16px}.wash-tools{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;width:100%}.wash-tools button{background:#fff;border:2px solid #dae6d5;border-radius:14px;padding:7px 5px 8px;cursor:pointer;min-width:0;color:#36543c;min-height:78px}.wash-tools button[aria-pressed=true]{border-color:#31814a;background:#e8f6e5}.wash-tools button:disabled{opacity:.65;cursor:default}.wash-tools img{height:55px;width:100%;object-fit:contain;pointer-events:none}.wash-tools span{display:block;font-size:11px;line-height:1.4}.wash-tools button:hover{border-color:#72a76b}.wash-progress{width:100%;display:flex;align-items:center;gap:10px;margin:16px 0 14px;min-height:20px}.wash-progress progress{accent-color:#4c984a;height:10px;width:100%;border-radius:5px;flex:1}.wash-progress span{font-size:12px;white-space:nowrap}.wash-guidance>.btn{font-size:14px;padding:10px 18px;min-height:44px;cursor:pointer}.wash-guidance>.btn+.btn{margin-top:12px}#wash-target{position:absolute;z-index:4;bottom:4%;left:50%;transform:translateX(-50%);background:#fff9df;border:3px dashed #ad7730;color:#665022;border-radius:16px;min-height:58px;min-width:105px;padding:9px;font:600 15px/1.3 inherit;cursor:pointer}#wash-target[data-step="3"]{bottom:auto;top:57%;min-width:70px;min-height:55px;background:#dff5ff;border-color:#589abb}#moving-tool{position:absolute;z-index:5;pointer-events:none;width:28%;height:24%;object-fit:contain;transform:translate(-30%,-45%)}.wash-marks{position:absolute;inset:0;pointer-events:none}.dirt{position:absolute;border-radius:50%;background:#927455;opacity:.88;width:4%;height:2.8%;transform:translate(-50%,-50%);transition:opacity .2s}.dirt.face{width:7%;height:4%;background:#98623d}.demo-complete{text-align:center;padding:35px 24px 40px;background:#f2f9ed}.demo-complete>img{width:150px;height:150px;object-fit:contain;margin:0 auto 18px;border-radius:18px}.demo-complete h2{font-size:30px}.demo-complete p{font-size:17px}.demo-complete .actions{justify-content:center;margin:20px 0 0}.demo-complete button{cursor:pointer}.demo-note{font-size:12px;color:#65735f;margin:12px 0 35px}.book-stage{margin:0;background:#f1f5eb}.book-stage img{display:block;width:100%;aspect-ratio:16/9;object-fit:contain;max-height:540px}.reading-controls{display:grid;grid-template-columns:65px 1fr 65px;gap:14px;align-items:center;padding:17px 23px 8px;text-align:center}.reading-controls>button{font-size:23px;min-height:52px;width:52px;padding:4px}.reading-controls>button:last-child{justify-self:end}.reading-controls>button:disabled{opacity:.35;cursor:default}.reading-controls p{font:29px/1.3 Georgia,serif;color:#2d5339;margin:0 0 12px}.reading-controls div button{font-size:13px;min-height:44px;padding:6px 16px}.audio-status{font-size:12px;text-align:center;min-height:20px;color:#53644f;margin:0 10px 12px}.book-practice{text-align:center;padding-bottom:30px;background:#fafcf7}.book-practice h2{font-size:28px;margin:28px 20px 10px}.book-practice>p[lang=en]{font:27px Georgia,serif;color:#2d5339;margin:8px 15px 22px}.quiz-options{display:grid;grid-template-columns:1fr 1fr;gap:25px;margin:20px 30px}.quiz-options button{border:3px solid #d5e2ca;border-radius:19px;padding:0;overflow:hidden;background:white;cursor:pointer;position:relative}.quiz-options button img{width:100%;aspect-ratio:1.6;object-fit:contain}.quiz-options button.wrong{border-color:#c98854}.quiz-options button.correct{border-color:#36854f;box-shadow:0 0 0 4px #d6eed5}.quiz-options button.correct:after{content:'✓';position:absolute;right:9px;top:9px;background:#318052;color:white;width:36px;height:36px;border-radius:50%;font-size:22px;line-height:36px}#quiz-feedback{min-height:28px;font-size:16px;margin:12px 20px}#quiz-next{cursor:pointer}.playing{background:#e0f0ff!important;color:#215b88!important}.demo-loading{padding:20px;color:#7c4c31}
@media(max-width:780px){.wash-play{grid-template-columns:1fr 1fr}.wash-guidance{padding:23px 20px}.wash-guidance h2{font-size:23px}.wash-tools{grid-template-columns:repeat(2,1fr)}.wash-tools img{height:50px}.wash-tools button{min-height:78px}.wash-scene{align-items:center}.demo-start{padding:30px;gap:25px}.demo-start h2{font-size:27px}.demo-heading h1{font-size:31px}.reading-controls p{font-size:25px}}
@media(max-width:620px){.demo-wrap{width:calc(100% - 24px)}.demo-heading{padding:22px 3px 18px}.demo-heading h1{font-size:26px}.demo-heading .module-tag{font-size:11px}.demo-heading>.text-link{font-size:12px;gap:5px}.demo-shell{border-radius:18px}.demo-start{grid-template-columns:1fr;gap:20px;padding:24px;text-align:center}.demo-start>img{max-width:215px;border-radius:16px}.demo-start h2{font-size:25px}.demo-start p{font-size:15px;margin:12px 0}.demo-start .btn{margin-top:10px;font-size:15px;padding-inline:20px}.demo-start .small{font-size:11px}.demo-toolbar{gap:5px;padding:9px 8px}.demo-toolbar>span{font-size:11px}.demo-toolbar button{padding:7px 10px;font-size:11px;min-height:44px}.wash-play{grid-template-columns:1fr}.wash-scene{max-height:360px;align-items:flex-start}.bear-zone{max-width:340px;margin:auto;width:100%}.wash-guidance{padding:18px 18px 22px}.wash-guidance h2{font-size:24px}.wash-guidance>p[lang=en]{font-size:21px;min-height:0;margin:9px 0}.demo-feedback{font-size:13px;min-height:0;margin:4px 0 12px}.wash-tools{grid-template-columns:repeat(4,1fr);gap:8px}.wash-tools img{height:46px}.wash-tools button{min-height:77px}.wash-progress{margin:12px 0}.wash-guidance>.btn{width:100%;font-size:14px}.sink-edge{height:8%}.reading-controls{grid-template-columns:44px 1fr 44px;gap:8px;padding:16px 12px 7px}.reading-controls>button{width:44px;min-height:48px}.reading-controls p{font-size:22px;line-height:1.35;margin-bottom:11px}.book-stage img{aspect-ratio:16/9}.audio-status{font-size:11px}.book-practice h2{font-size:23px;margin:24px 15px 12px}.book-practice>p[lang=en]{font-size:23px}.quiz-options{gap:12px;margin:16px 14px}.quiz-options button{border-radius:13px}.quiz-options button img{aspect-ratio:1.2}.quiz-options button.correct:after{width:28px;height:28px;line-height:28px;font-size:17px;right:6px;top:6px}.demo-complete{padding:28px 18px}.demo-complete h2{font-size:25px}.demo-complete>img{width:130px;height:130px}.demo-complete .btn{font-size:14px}.demo-note{font-size:11px;margin-inline:3px}#wash-target{min-height:48px;min-width:90px;font-size:13px}.demo-heading>.text-link .arrow{font-size:16px}}
@media(prefers-reduced-motion:reduce){.dirt{transition:none}}
