@font-face{font-family:'Jua';font-style:normal;font-weight:400;font-display:swap;src:url('assets/fonts/Jua-Regular.ttf') format('truetype')}
:root{font-family:'Jua',sans-serif;color:#254f43;background:#b6d4b1;--cream:#fff8e8;--green:#285d48;--muted:#637766;--yellow:#f5d677;--space:clamp(12px,2.5vw,32px)}
*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer;touch-action:manipulation;min-height:48px;border:0;font-weight:400;transition:background .15s,transform .15s}button:active{transform:translateY(2px)}button:disabled{opacity:.6;cursor:default}button:focus-visible{outline:3px solid #477cbd;outline-offset:4px}[hidden]{display:none!important}h1,h2,p{margin-top:0}h1,h2{font-weight:400;word-break:keep-all}em{font-style:normal;color:var(--green)}
.stage{position:relative;isolation:isolate;width:100%;height:100dvh;min-height:360px;overflow:hidden}.scenery,.scene-shade,#water{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.scenery{background:#90c9c2 url('assets/storybook-stream.png') center/cover}.scene-shade{background:linear-gradient(180deg,#fff8e866,transparent 30%,#1e5f541a)}#water{z-index:1}.topbar{position:absolute;z-index:25;inset:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px var(--space);height:76px}.brand{display:flex;align-items:center;gap:10px;font-size:21px}.brand-mark{width:42px;height:42px;object-fit:contain;border-radius:50%}.brand small{display:none}.top-actions{display:flex;align-items:center;gap:8px}.top-actions button{width:44px;min-height:44px;background:#fff8e8dd;border-radius:50%;color:var(--green);font-size:21px}.top-actions>span{font-size:13px;color:#365b4c;background:#fff8e8c9;padding:8px 12px;border-radius:20px}.screen{position:absolute;inset:86px var(--space) 20px;z-index:3}.primary{background:var(--yellow);color:#385135;padding:13px 24px;border-radius:18px;font-size:21px;box-shadow:0 3px 0 #b69a4f}.secondary{background:#e7eddc;color:var(--green);border-radius:14px;padding:10px 18px;font-size:17px}.eyebrow{display:block;color:var(--muted);font-size:15px;margin-bottom:10px}.centered{display:grid;place-items:center}.welcome{display:flex;align-items:center;justify-content:center;gap:4%;padding:0 4%;bottom:52px}.welcome-copy{padding:32px;max-width:620px;width:57%;background:#fff8e8ed;border-radius:32px}.welcome h1{font-size:clamp(36px,5.2vw,72px);line-height:1.16;margin-bottom:20px}.welcome p{font-size:22px;line-height:1.5;margin-bottom:24px}.welcome p strong{color:#357151;font-weight:400}.start-btn{display:flex;justify-content:space-between;gap:22px;width:100%}.journey{display:flex;justify-content:space-between;gap:6px;margin-top:24px;color:var(--muted);font-size:12px}.journey i{font-style:normal}.hero-character{width:32%;max-width:350px;align-self:center;text-align:center}.hero-character>img{width:100%;display:block;border-radius:45% 45% 28px 28px;background:var(--cream)}.speech-chip{display:block;font-size:19px;background:var(--cream);border-radius:20px;padding:10px 16px;margin-bottom:14px}.character-name{display:none}.welcome-foot{position:absolute;bottom:-30px;left:4%;right:4%;display:flex;justify-content:space-between;font-size:13px;color:#284c42}.chapter{display:inline-block;font-size:15px;background:#fff8e8df;color:var(--green);border-radius:24px;padding:9px 16px}
/* One portrait, one readable speech area; a shared baseline replaces nested badges. */
.dialogue.bottom{position:absolute;bottom:12px;left:4%;right:4%;display:grid;grid-template-columns:clamp(145px,23vw,270px) minmax(0,1fr);gap:clamp(12px,2.5vw,32px);align-items:stretch;min-height:245px;background:var(--cream);border-radius:30px;padding:20px 28px 16px 12px;box-shadow:0 8px 24px #204f4326}.sprite-slot{display:flex;align-items:flex-end;justify-content:center;overflow:hidden;border-radius:22px;min-width:0}.sprite-slot img{display:block;width:100%;height:240px;object-fit:contain;object-position:center bottom}.sprite-shadow,.emotion{display:none}.text-panel{min-width:0;display:grid;grid-template-rows:auto 1fr auto;gap:12px;align-self:stretch}.meta{display:flex;align-items:center;justify-content:space-between;gap:12px}.name{font-size:24px;color:#377457}.count{font-size:14px;color:#8a927d}.text{font-size:clamp(22px,2.5vw,32px);line-height:1.55;word-break:keep-all;overflow-wrap:anywhere;align-self:center}.next{justify-self:end;background:transparent;color:#6e8065;padding:4px 0;font-size:16px;min-height:40px}#adventure:not(.quiz-active){cursor:pointer;touch-action:manipulation;user-select:none;-webkit-user-select:none}
.quiz-active{display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:12px}.quiz-active .chapter{justify-self:start}.question-card{background:var(--cream);border-radius:26px;padding:22px 28px;width:min(780px,92%);margin:0 auto;text-align:center;overflow:auto;align-self:stretch}.question-card h2{font-size:clamp(22px,2.6vw,30px);margin-bottom:18px}.choices{display:grid;grid-template-columns:1fr 1fr;gap:12px}.choices button{background:#eaf0df;color:#365747;border-radius:14px;padding:12px 16px;font-size:20px;text-align:left;min-height:52px}.choices button.correct{background:#f6dc8e;opacity:1}.choices button.wrong{background:#f2e4da}.question-card #quiz-feedback{min-height:22px;margin:14px 0 8px;color:#58743e;font-size:17px}.quiz-active .dialogue.bottom{position:relative;inset:auto;margin:auto;width:min(780px,92%);min-height:88px;grid-template-columns:80px minmax(0,1fr);padding:8px 20px 8px 8px;gap:18px;border-radius:22px}.quiz-active .sprite-slot img{height:85px}.quiz-active .text-panel{grid-template-columns:auto minmax(0,1fr);grid-template-rows:1fr;align-items:center;gap:18px}.quiz-active .name{font-size:19px}.quiz-active .text{font-size:19px}.quiz-active .count{display:none}
.game-head{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:6px 12px}.game-head .eyebrow{margin-bottom:5px;color:#355b48}.game-head h2{font-size:clamp(22px,2.7vw,32px);margin:0;line-height:1.3}.rescued{display:flex;align-items:baseline;gap:8px;white-space:nowrap;background:#fff8e8e8;padding:10px 16px;border-radius:22px}.rescued strong{font-size:30px;font-weight:400}.rescued span{font-size:13px}.bubble-labels{position:absolute;inset:0;pointer-events:none}.bubble-word{position:absolute;transform:translate(-50%,-50%);color:#285c50;background:#fff8e8f5;padding:7px 20px;border-radius:22px;font-size:clamp(23px,3vw,36px);line-height:1.2;text-align:center;white-space:nowrap;box-shadow:0 2px 4px #286a5822}.bubble-word small{display:none}.bubble-word.special{background:#f9df92}.bubble-word.finale{font-size:clamp(34px,4.3vw,52px);padding:10px 28px}.voice-dock{position:absolute;inset:auto 4% 0;display:flex;align-items:center;gap:18px;padding:16px 22px;background:var(--cream);border-radius:26px;min-height:100px}.voice-dock img{display:none}.voice-copy{flex:1;min-width:0}.voice-copy p{font-size:22px;margin:0 0 7px;line-height:1.3}.voice-copy>span{display:block;color:#647564;font-size:15px;line-height:1.4;min-height:21px;overflow-wrap:anywhere}.mic{min-width:135px;flex-shrink:0}.mic.listening{background:#b9dda8;animation:breathe 1s ease-in-out infinite}.volume-track{height:4px;width:100%;background:#e4e8d8;border-radius:9px;margin-top:8px;overflow:hidden}.volume-track i{display:block;width:0;height:100%;background:#72a979;transition:width .07s}.rescue-tray{display:none}.assisted{position:absolute;bottom:112px;right:4%;font-size:12px;min-height:32px;background:#fff8e8c9;color:#687760;border-radius:12px;padding:6px 10px}.flat-bubble{min-width:var(--bubble-size);min-height:var(--bubble-size);border-radius:50%;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 30% 22%,#fff, #c1efefaa 45%,#a8d7e4cc);border:2px solid #e7ffff;scale:calc(1 + var(--voice-energy,0)*.13)}
.result-card,.photo-choice-panel{width:min(680px,96%);background:var(--cream);border-radius:30px;padding:32px;text-align:center;max-height:100%;overflow:auto}.result-card h1{font-size:clamp(34px,4vw,54px);line-height:1.2;margin-bottom:20px}.result-card h2,.photo-choice-panel h2{font-size:34px;line-height:1.3;margin-bottom:20px}.result-card p{font-size:20px;line-height:1.55;margin-bottom:22px}.friends{display:flex;justify-content:center;gap:8px;margin:14px 0}.friends canvas{width:52px;height:52px}.photo-choices{display:grid;grid-template-columns:1fr 1fr;gap:16px}.photo-choices button{display:flex;flex-direction:column;align-items:center;gap:12px;background:#eaf0df;color:var(--green);border-radius:22px;padding:22px 16px}.photo-choices strong{font-size:23px;font-weight:400}.photo-choices button>span:last-child{font-size:15px;line-height:1.4}.mode-symbol{font-size:44px}.photo-notice{font-size:13px;color:#71806c;line-height:1.5;margin:20px 0 14px}.camera-screen{display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:12px}.camera-top,.camera-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--cream);border-radius:18px;padding:10px 16px}.camera-top{font-size:21px}.camera-view{position:relative;min-height:0;overflow:hidden;background:#253c35;border-radius:24px}.camera-view video,.camera-view canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.camera-view video{transform:scaleX(-1)}#countdown{position:absolute;inset:0;display:grid;place-items:center;color:white;font-size:110px;text-shadow:0 3px 16px #16452e}#camera-loading{position:absolute;inset:0;display:grid;place-items:center;background:#213d35d9;color:var(--cream);font-size:22px;padding:24px;text-align:center}.camera-bottom strong{display:block;font-size:21px;font-weight:400}.camera-bottom span{display:block;font-size:14px;color:var(--muted);margin-top:5px}.review-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:28px;padding:26px;background:var(--cream);border-radius:28px;width:min(920px,96%);max-height:100%;overflow:auto}.review-layout>img{width:100%;max-height:65vh;object-fit:contain;border-radius:18px}.review-layout h2{font-size:32px;line-height:1.3;margin-bottom:16px}.review-layout p{font-size:16px;line-height:1.5;color:var(--muted)}.review-layout button{display:block;width:100%;margin-top:10px}.ticket{background:#eaf0df;border-radius:20px;padding:18px;margin:18px 0}.ticket span{display:block;font-size:15px;color:var(--muted)}.ticket strong{display:block;font-weight:400;font-size:46px;margin-top:6px;overflow-wrap:anywhere}.receipt-school{color:#45704e}.receipt-card p{font-size:18px}#toast{position:absolute;z-index:30;top:23%;left:50%;transform:translateX(-50%);background:#fff8e8f5;color:#315f45;border-radius:20px;padding:12px 22px;text-align:center;font-size:21px;white-space:pre-line;pointer-events:none;max-width:90%;box-shadow:0 4px 18px #204f4320}
#operator{border:0;border-radius:24px;padding:28px;background:var(--cream);color:var(--green);width:min(540px,94%);max-height:90dvh}#operator::backdrop{background:#143b36a8}#operator h2{font-size:28px}#operator p{font-size:14px;line-height:1.5;color:var(--muted)}#operator label{display:block;margin:14px 0}#operator input:not([type=checkbox]),#operator select{display:block;width:100%;padding:10px;margin-top:7px;border:1px solid #aebea4;border-radius:10px;background:#fff;color:var(--green);min-height:44px}#operator .check{display:flex;gap:10px;align-items:center}#operator input[type=checkbox]{width:22px;height:22px;accent-color:var(--green)}.operator-actions{display:flex;gap:10px}.audio-settings{border:1px solid #cad4ba;border-radius:16px;padding:12px}.audio-settings legend{padding:0 8px}.audio-settings output{float:right}.audio-settings input[type=range]{accent-color:#63874b}#operator hr{border:0;border-top:1px solid #cad4ba;margin:22px 0}
@keyframes breathe{50%{box-shadow:0 0 0 6px #a3cc8a40}}
/* Compact landscape: the main booth orientation, including 640×360. */
@media(max-height:620px) and (min-width:600px){.topbar{height:58px;padding-top:7px;padding-bottom:7px}.brand{font-size:18px}.brand-mark{width:36px;height:36px}.top-actions button{width:40px;min-height:40px}.screen{inset:64px 16px 12px}.welcome{bottom:34px;gap:5%}.welcome-copy{padding:20px 24px}.welcome .eyebrow{font-size:13px;margin-bottom:7px}.welcome h1{font-size:38px;margin-bottom:12px}.welcome p{font-size:17px;margin-bottom:14px}.primary{font-size:18px;padding:10px 18px;min-height:44px}.journey{margin-top:15px;font-size:11px}.hero-character{width:25%;max-width:220px}.speech-chip{font-size:15px;padding:7px;margin-bottom:6px}.welcome-foot{bottom:-24px;font-size:11px}.dialogue.bottom{bottom:0;left:3%;right:3%;min-height:180px;grid-template-columns:160px minmax(0,1fr);padding:12px 20px 10px 8px;gap:20px}.sprite-slot img{height:180px}.text{font-size:24px;line-height:1.45}.name{font-size:21px}.text-panel{gap:6px}.next{font-size:14px;min-height:34px}.chapter{font-size:13px;padding:7px 13px}.quiz-active{gap:6px}.question-card{padding:12px 20px}.question-card .eyebrow{font-size:12px;margin-bottom:5px}.question-card h2{font-size:22px;margin-bottom:10px}.choices{gap:8px}.choices button{font-size:17px;min-height:42px;padding:8px 12px}.question-card #quiz-feedback{font-size:15px;margin:8px 0 5px;min-height:18px}.quiz-active .dialogue.bottom{min-height:62px;grid-template-columns:55px minmax(0,1fr);padding:4px 14px 4px 6px;gap:10px}.quiz-active .sprite-slot img{height:54px}.quiz-active .name,.quiz-active .text{font-size:16px}.game-head{padding:0 8px}.game-head h2{font-size:22px}.game-head .eyebrow{font-size:12px}.rescued{padding:6px 12px}.rescued strong{font-size:24px}.voice-dock{min-height:82px;padding:12px 18px;gap:15px}.voice-copy p{font-size:19px;margin-bottom:4px}.voice-copy>span{font-size:13px}.volume-track{margin-top:5px}.mic{min-width:120px}.assisted{bottom:89px}.bubble-word{font-size:25px;padding:6px 16px}.bubble-word.finale{font-size:34px}.result-card,.photo-choice-panel{padding:20px 28px}.result-card h1{font-size:36px;margin-bottom:12px}.result-card h2,.photo-choice-panel h2{font-size:28px;margin-bottom:12px}.result-card p{font-size:17px;margin-bottom:14px}.friends{margin:8px 0}.friends canvas{height:40px;width:40px}.photo-choices button{padding:14px;gap:7px}.photo-choices strong{font-size:20px}.mode-symbol{font-size:30px}.photo-notice{font-size:11px;margin:12px 0 8px}.camera-top,.camera-bottom{padding:7px 12px}.camera-top,.camera-bottom strong{font-size:17px}.camera-bottom span{font-size:12px}.camera-top .secondary,.camera-bottom .secondary{min-height:38px;font-size:14px}.review-layout{padding:18px;gap:22px}.review-layout h2{font-size:26px;margin-bottom:10px}.review-layout p{font-size:13px;margin-bottom:10px}.review-layout button{font-size:15px;min-height:38px;margin-top:7px;padding:8px}.ticket{padding:12px;margin:12px 0}.ticket strong{font-size:34px}#toast{font-size:17px;padding:9px 18px}}
@media(max-width:599px){.topbar{height:64px;padding:10px 14px}.brand{font-size:18px}.brand-mark{width:36px;height:36px}.top-actions>span{display:none}.top-actions button{width:38px;min-height:38px}.screen{inset:74px 12px 14px}.welcome{flex-direction:column-reverse;gap:12px;padding:0;bottom:38px}.welcome-copy{width:100%;padding:22px;max-width:430px}.welcome h1{font-size:36px;margin-bottom:12px}.welcome p{font-size:18px;margin-bottom:18px}.welcome .eyebrow{font-size:13px}.hero-character{width:125px;max-height:22vh;display:flex;justify-content:center}.hero-character>img{width:100%;object-fit:contain}.speech-chip{display:none}.journey{font-size:10px;margin-top:17px}.welcome-foot{bottom:-25px;font-size:10px}.dialogue.bottom{left:0;right:0;bottom:0;grid-template-columns:105px minmax(0,1fr);gap:12px;padding:18px 16px 12px 6px;min-height:260px;border-radius:24px}.sprite-slot{align-items:center}.sprite-slot img{height:170px}.name{font-size:21px}.text{font-size:21px;line-height:1.5}.next{font-size:13px}.count{font-size:12px}.question-card{width:100%;padding:18px 14px}.question-card h2{font-size:24px}.choices{gap:9px}.choices button{font-size:17px;padding:12px 10px}.quiz-active .dialogue.bottom{width:100%;grid-template-columns:58px minmax(0,1fr);gap:10px;padding:8px;min-height:92px}.quiz-active .sprite-slot img{height:75px}.quiz-active .text-panel{grid-template-columns:1fr;grid-template-rows:auto 1fr;gap:3px}.quiz-active .name{font-size:16px}.quiz-active .text{font-size:17px}.game-head{padding:0;gap:8px}.game-head h2{font-size:21px}.game-head .eyebrow{font-size:12px}.rescued{display:block;padding:8px 11px;text-align:center}.rescued strong{font-size:25px}.rescued span{display:block;font-size:11px}.voice-dock{left:0;right:0;padding:15px;flex-wrap:wrap;gap:12px;border-radius:22px}.voice-copy{flex-basis:100%}.voice-copy p{font-size:20px}.voice-copy>span{font-size:13px}.mic{width:100%;min-height:48px}.assisted{right:0;bottom:175px}.bubble-word{font-size:24px;padding:7px 15px}.bubble-word.finale{font-size:34px}.result-card,.photo-choice-panel{width:100%;padding:25px 18px}.result-card h1{font-size:36px}.result-card p{font-size:18px}.photo-choices{grid-template-columns:1fr;gap:12px}.photo-choices button{padding:16px;gap:8px}.mode-symbol{font-size:32px}.photo-choices strong{font-size:22px}.photo-notice{font-size:12px}.camera-top{font-size:15px;padding:8px;gap:8px}.camera-top .secondary{font-size:13px;padding:8px;min-height:40px}.camera-bottom{flex-wrap:wrap;padding:12px}.camera-bottom strong{font-size:18px}.camera-bottom span{font-size:12px}.review-layout{grid-template-columns:1fr;width:100%;padding:18px;gap:16px}.review-layout>img{max-height:30vh}.review-layout h2{font-size:25px}.review-layout h2 br{display:none}.review-layout p{font-size:14px}.review-layout button{font-size:17px}.ticket strong{font-size:35px}#toast{font-size:18px;top:22%;width:max-content}}
@media(max-height:420px) and (min-width:600px){.welcome-copy{padding:14px 20px}.welcome .eyebrow,.welcome .journey{display:none}.welcome h1{font-size:32px;margin-bottom:10px}.welcome p{font-size:15px;margin-bottom:10px}.hero-character{width:21%;max-width:160px}.speech-chip{font-size:13px}.text{font-size:22px}.dialogue.bottom{grid-template-columns:145px minmax(0,1fr)}.sprite-slot img{height:165px}.photo-choice-panel .eyebrow{display:none}.photo-notice{margin:8px 0}.photo-choices button{padding:10px;gap:5px}.mode-symbol{font-size:26px}.result-card .eyebrow{margin-bottom:6px}.result-card h1{font-size:30px}.result-card p{font-size:15px}.friends canvas{width:32px;height:32px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;scroll-behavior:auto!important}}