:root{font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;color:#393e32;background:#f3ecdf;color-scheme:light;--ink:#393e32;--muted:#707462;--accent:#576f4d;--paper:#fcf8ee;--line:#d9d4c4}
*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100dvh}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{color:inherit;cursor:pointer}button:disabled{cursor:default;opacity:.5}a{color:inherit;text-decoration:none}button:active:not(:disabled),a:active{transform:scale(.975)}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #739365;outline-offset:4px}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;clip-path:inset(50%);overflow:hidden;white-space:nowrap}
.topbar{height:80px;width:100%;padding:12px clamp(20px,4vw,64px);display:flex;align-items:center;gap:14px;position:relative;z-index:10}.wordmark{font-size:18px;font-weight:800;letter-spacing:.02em}.wordmark span{font-size:12px;font-weight:500;color:var(--muted);margin-left:14px}.icon-control{width:44px;height:44px;display:grid;place-items:center;background:#ffffff65;border:1px solid #ffffffa0;border-radius:50%}.icon-control svg{width:20px;height:20px}.original-link,#restart{margin-left:auto}.original-link{font-size:13px;color:var(--muted);padding:12px 0}
#experience{position:relative;width:100%;max-width:1680px;margin:auto;min-height:calc(100dvh - 80px)}.world-viewport{position:relative;overflow:hidden}.stage{width:100%;height:100%;min-height:300px}.stage canvas{width:100%;height:100%;display:block;touch-action:none}.stage-loading{position:absolute;inset:0;display:grid;align-content:center;justify-items:center;background:#eeede6;color:var(--muted);font-size:13px;transition:opacity .4s}.stage-loading span{width:95px;height:65px;background:#dae0d1;border-radius:50%;box-shadow:0 22px 0 -4px #c6d0ba;animation:arrival 1.2s ease-in-out infinite alternate}.stage-loading.is-ready{opacity:0;pointer-events:none}.stage-hint{position:absolute;bottom:15px;left:0;right:0;text-align:center;color:var(--muted);font-size:11px;margin:0;pointer-events:none}.camera-reset{position:absolute;right:24px;bottom:14px;border:0;background:#faf9f3bd;padding:9px 13px;border-radius:30px;font-size:11px;color:var(--muted)}
body[data-view=home] .world-viewport{position:absolute;right:0;top:0;width:66%;height:calc(100dvh - 95px)}.home-panel{position:relative;z-index:2;width:38%;max-width:520px;min-height:calc(100dvh - 100px);padding:clamp(28px,6vh,70px) 0 40px clamp(24px,6vw,90px);pointer-events:none}.home-panel>*{pointer-events:auto}.eyebrow{font-size:12px;letter-spacing:.1em;color:var(--accent);margin:0 0 20px}.home-panel h1{font-size:clamp(36px,4.5vw,62px);line-height:1.18;letter-spacing:-.04em;margin:0 0 20px}.home-intro{font-size:14px;line-height:1.8;color:var(--muted);max-width:23em;margin:0 0 30px}.story-list{display:grid;gap:0}.story-link{display:grid;grid-template-columns:1fr 26px;gap:4px 12px;padding:18px 0;border-top:1px solid var(--line)}.story-link strong{font-size:18px;font-weight:700}.story-link small{grid-column:1;color:var(--muted);font-size:11px;line-height:1.6}.story-link b{grid-column:2;grid-row:1/3;align-self:center;font-size:22px;font-weight:400;transition:transform .2s}.story-link:hover b{transform:translateX(4px)}.story-link:hover strong{color:var(--accent)}.studio-entry{display:grid;grid-template-columns:1fr auto;gap:6px;padding:20px 0 0;border-top:1px solid var(--line);margin-top:10px}.studio-entry span{font-size:14px;font-weight:700}.studio-entry small{font-size:11px;color:var(--muted);grid-column:1}.studio-entry b{grid-column:2;grid-row:1/3;font-weight:400;align-self:center}
body[data-view=story] #experience{display:grid;grid-template-rows:minmax(350px,1fr) auto;min-height:calc(100dvh - 80px)}body[data-view=story] .world-viewport{height:clamp(360px,55dvh,720px);width:100%}.scene-caption{position:absolute;top:8px;left:clamp(22px,5vw,80px);pointer-events:none}.scene-caption span{font-size:12px;color:var(--muted)}.scene-caption h1{font-size:23px;letter-spacing:-.025em;margin:7px 0 0}.story-panel{width:min(700px,calc(100% - 40px));margin:0 auto;padding:0 0 max(24px,env(safe-area-inset-bottom));position:relative;z-index:3}.story-topline{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}.story-topline p{font-size:12px;color:var(--muted);margin:0;line-height:1.5}.quiet-button{border:0;background:transparent;padding:10px 8px;min-height:44px;font-size:12px;color:var(--muted);white-space:nowrap}.quiet-button:hover{color:var(--ink)}#bag-count{display:inline-grid;place-items:center;min-width:18px;height:18px;border-radius:50%;background:#e0e5d8;font-size:10px}.speech-card{width:100%;min-height:112px;text-align:left;border:1px solid #fff;border-radius:24px;background:var(--paper);padding:20px 26px;position:relative;box-shadow:0 12px 38px #6572590b;display:grid;gap:9px}.speaker{font-size:12px;color:var(--accent);font-weight:700}.speech-text{font-size:19px;font-weight:600;line-height:1.6;letter-spacing:.005em;display:block;padding-right:17px}.speaking-bars{position:absolute;right:23px;top:23px;display:flex;gap:3px;height:13px;align-items:center}.speaking-bars i{display:block;width:3px;height:5px;background:var(--accent);border-radius:4px}.speech-card[data-speaking=true] .speaking-bars i{animation:voice-wave .65s ease-in-out infinite alternate}.speaking-bars i:nth-child(2){animation-delay:-.3s!important}.speaking-bars i:nth-child(3){animation-delay:-.5s!important}.story-start{display:grid;justify-items:center;gap:12px;margin-top:22px}.story-start p{font-size:11px;color:var(--muted);margin:0}.primary,.secondary{display:inline-flex;align-items:center;justify-content:center;min-height:47px;border-radius:30px;padding:0 24px;font-size:13px;font-weight:650;white-space:nowrap}.primary{background:var(--accent);color:#fff;border:1px solid var(--accent)}.primary:hover{background:#405c39}.secondary{background:var(--paper);color:var(--ink);border:1px solid var(--line)}.full{width:100%;margin-top:20px}.answer-dock{padding-top:14px}.answer-controls{display:flex;align-items:center;justify-content:center;gap:12px}.choices{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:15px}.choice-button{padding:12px 18px;min-height:45px;background:#f9f9f3;border:1px solid var(--line);border-radius:16px;font-size:13px}.choice-button:hover{border-color:var(--accent);background:#e4ebdc}.text-form{display:flex;gap:8px;margin-top:14px}.text-form input{min-width:0;flex:1}.text-form button{padding:0 16px}.ending{text-align:center;padding:26px 0 12px}.ending h2{font-size:28px;margin:0 0 16px}.ending p{font-size:14px;color:var(--muted);line-height:1.8}.ending blockquote{margin:18px 0 25px;font-size:18px;font-weight:650;line-height:1.6}.ending>a{display:block;margin-top:6px}
body[data-view=studio] #experience{display:grid;grid-template-columns:minmax(0,1fr) 350px;gap:20px;padding-right:clamp(24px,4vw,64px)}body[data-view=studio] .world-viewport{height:calc(100dvh - 90px);position:sticky;top:0}.studio-panel{padding:30px 0 45px}.studio-panel h1{font-size:27px;letter-spacing:-.03em;margin:0 0 9px}.panel-intro{font-size:12px;color:var(--muted);line-height:1.7;margin:0 0 22px}.studio-tabs{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid var(--line);margin-bottom:23px}.studio-tabs button{border:0;border-bottom:2px solid transparent;background:none;padding:12px;font-size:13px;color:var(--muted)}.studio-tabs button[aria-selected=true]{border-color:var(--accent);color:var(--accent);font-weight:700}.type-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.type-button{min-height:48px;padding:8px;border-radius:14px;border:1px solid var(--line);background:#faf9f3;font-size:12px}.type-button[aria-pressed=true],.control-grid button[aria-pressed=true],.world-options button[aria-pressed=true]{background:#dfe8d5;border-color:#90a57b;color:#344b2a}.field-label{display:block;font-size:12px;font-weight:650;margin:23px 0 10px}input:not([type=range]){min-height:44px;background:#faf9f3;border:1px solid var(--line);border-radius:13px;padding:10px 13px;color:var(--ink);font-size:13px}input::placeholder{color:#75806d}#character-name{width:100%}.color-field{padding:0;border:0;margin:20px 0}.color-field legend{font-size:12px;font-weight:650;margin-bottom:12px}.color-swatches{display:flex;gap:12px;flex-wrap:wrap}.color-swatch{width:36px;height:36px;border-radius:50%;border:3px solid #ffffffb3;outline:1px solid #bcc7b7}.color-swatch[aria-pressed=true]{outline:2px solid var(--accent);outline-offset:3px}.slider-label{display:flex;justify-content:space-between;font-size:12px;font-weight:650;margin:25px 0 8px}.slider-label output{color:var(--muted);font-weight:500}input[type=range]{width:100%;height:25px;accent-color:var(--accent)}.control-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.control-grid button,.world-options button{min-height:46px;padding:10px 8px;border-radius:13px;border:1px solid var(--line);background:var(--paper);font-size:12px}.world-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.studio-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:30px}.saved-characters{margin-top:20px;display:grid;gap:8px}.saved-character{border:0;border-radius:14px;padding:12px;background:#e4e8dd;display:flex;align-items:center;justify-content:space-between;font-size:12px}.saved-character span{color:var(--muted);font-size:11px}
.notice{position:fixed;z-index:100;bottom:max(24px,env(safe-area-inset-bottom));left:50%;transform:translate(-50%,15px);max-width:min(480px,calc(100vw - 35px));width:max-content;padding:14px 21px;border-radius:18px;background:#303c2eed;color:white;font-size:12px;line-height:1.6;opacity:0;transition:opacity .2s,transform .2s;pointer-events:none}.notice[data-visible=true]{opacity:1;transform:translate(-50%,0)}dialog{width:min(480px,calc(100% - 28px));max-height:80dvh;padding:25px;background:var(--paper);color:var(--ink);border:1px solid white;border-radius:24px;box-shadow:0 30px 80px #27302335}dialog::backdrop{background:#2330216b;backdrop-filter:blur(8px)}.dialog-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}.dialog-top h2{font-size:20px;margin:0}.bag-item{padding:15px 0;border-top:1px solid var(--line)}.bag-item h3{font-size:14px;margin:0 0 8px}.bag-item p,#bag-content>p{font-size:12px;line-height:1.7;color:var(--muted);margin:0}.transition{position:fixed;inset:0;z-index:90;background:#172019;pointer-events:none;clip-path:circle(0 at 50% 50%);transition:clip-path .52s cubic-bezier(.65,0,.35,1)}.transition.closed{clip-path:circle(76vmax at 50% 50%)}
@keyframes voice-wave{to{height:13px}}@keyframes arrival{to{transform:translateY(-9px) scale(.97,1.03)}}
@media(min-width:1450px){.home-panel{padding-top:8vh}.story-link{padding:23px 0}}
@media(max-width:900px){.wordmark span{display:none}.topbar{height:66px;padding:10px 20px}.home-panel{width:42%;padding-left:30px}.home-panel h1{font-size:42px}.home-panel .home-intro{font-size:13px}body[data-view=home] .world-viewport{width:62%}body[data-view=studio] #experience{grid-template-columns:1fr 310px;padding-right:24px;gap:5px}}
@media(max-width:680px){.topbar{height:62px;padding:8px 16px;gap:10px}.wordmark{font-size:16px}.original-link{font-size:11px}.icon-control{height:39px;width:39px}.icon-control svg{height:18px;width:18px}#experience{min-height:calc(100dvh - 62px)}body[data-view=home] #experience{display:flex;flex-direction:column}body[data-view=home] .world-viewport{position:relative;width:100%;height:clamp(265px,39dvh,430px);order:0}.home-panel{width:100%;max-width:none;min-height:0;padding:10px 27px 35px;order:1}.eyebrow{display:none}.home-panel h1{font-size:29px;line-height:1.25;margin:0 0 8px}.home-panel h1 br{display:none}.home-panel .home-intro{font-size:12px;margin:0 0 19px;max-width:none}.story-link{padding:13px 0;gap:2px 10px}.story-link strong{font-size:16px}.story-link small{font-size:10px}.studio-entry{margin-top:4px;padding-top:16px}.stage-hint{bottom:10px;font-size:10px}.camera-reset{bottom:7px;right:15px;font-size:10px;padding:8px 11px}body[data-view=home] .camera-reset{display:none}body[data-view=home] .stage-hint{bottom:8px}body[data-view=story] #experience{min-height:calc(100dvh - 62px);grid-template-rows:auto 1fr}body[data-view=story] .world-viewport{height:clamp(330px,49dvh,520px)}.scene-caption{top:8px;left:21px}.scene-caption span{font-size:10px}.scene-caption h1{font-size:20px;margin-top:6px}.story-panel{width:calc(100% - 30px);padding-bottom:max(20px,env(safe-area-inset-bottom))}.story-topline{gap:7px;margin-bottom:4px}.story-topline p{font-size:10px}.speech-card{padding:17px 20px;border-radius:21px;min-height:116px}.speaker{font-size:11px}.speech-text{font-size:17px;line-height:1.6;padding-right:0}.speaking-bars{right:18px;top:19px}.answer-controls{gap:8px}.quiet-button{font-size:11px;padding:10px 5px}.answer-dock{padding-top:15px}.choices{gap:8px}.choice-button{font-size:12px;padding:12px 16px}.story-start{margin-top:20px}.ending h2{font-size:25px}.ending p{font-size:13px}body[data-view=studio] #experience{display:block;padding:0}body[data-view=studio] .world-viewport{position:sticky;top:0;z-index:5;height:39dvh;min-height:270px;background:#eeede6}body[data-view=studio] .stage-hint{display:none}.studio-panel{padding:16px 24px 40px}.studio-panel h1{font-size:25px}.panel-intro{font-size:11px;margin-bottom:15px}.studio-tabs{margin-bottom:18px}.type-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.type-button{font-size:11px;min-height:43px}.field-label{margin-top:19px}.color-field{margin:18px 0}.studio-actions{margin-top:24px}.text-form input{font-size:12px}.text-form button{font-size:12px;padding:0 15px}.stage{min-height:0}}
@media(max-width:360px){.answer-controls{gap:3px}.speech-text{font-size:16px}.home-panel{padding-left:22px;padding-right:22px}.type-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
@media(prefers-reduced-transparency:reduce){dialog::backdrop{backdrop-filter:none}.speech-card,.camera-reset{background:#faf9f3}.icon-control{background:#faf9f3}}

/* The live 3D world floats on a warm picture-book page, not on a tabletop. */
.world-viewport{background:radial-gradient(ellipse at 50% 44%,#fbf6e880,transparent 72%)}
.stage{height:calc(100% - 26px)}
.stage-loading{background:#f3ecdf}
.stage-loading span{width:76px;height:76px;border-radius:50%;background:#bccb9c;box-shadow:inset -15px -10px 0 #91a984,0 0 0 8px #e9ead780}
.speech-card{border-color:#fff9ed;background:#fcf8ee;box-shadow:0 8px 24px #736e5408}
.camera-reset{background:#fcf8eec7}
@media(max-width:680px){body[data-view=home] .world-viewport{height:clamp(300px,43dvh,480px)}body[data-view=story] .world-viewport{height:clamp(365px,51dvh,550px)}body[data-view=studio] .world-viewport{height:43dvh;background:#f3ecdf}.stage-hint{letter-spacing:.025em}}

/* Lyric-style focus stays on a short clause, never a single highlighted box. */
.read-along__visual{display:inline;color:inherit}
.read-along__phrase{display:inline;opacity:.55;font-weight:650;transition:opacity 280ms ease,text-shadow 280ms ease;color:inherit}
.read-along__phrase .calligraph-glyph::before{font-weight:850}
.read-along__phrase.is-read{opacity:.7}
.read-along__phrase.is-current{opacity:1;font-weight:850;color:inherit;background:none;text-shadow:0 0 12px currentColor,0 0 24px color-mix(in srgb,currentColor 28%,transparent)}
@media(prefers-reduced-motion:reduce){.read-along__phrase{transition:none}}
@media(forced-colors:active){.read-along__phrase{opacity:1}.read-along__phrase.is-current{color:Highlight;text-shadow:none;text-decoration:underline}}

/* White subtitles with a restrained glow and a deep outline-like shadow. */
#speech-text,.speech-card .speech-text,#ending-line,.ending blockquote,.ending p,
.read-along__visual,.read-along__phrase,.read-along__phrase.is-current,.speech-card .speaker {
  color:#fff!important;
  text-shadow:0 2px 3px #142219,0 3px 9px #142219e6,0 0 2px #fff9,0 0 9px #ffffff65!important;
}
.read-along__phrase{opacity:.92}
.read-along__phrase.is-read{opacity:.95}
.read-along__phrase.is-current{opacity:1}
body[data-view=story] .answer-controls:has(#mic-button[hidden]){display:none}

.first-light-memory{position:absolute;top:100px;left:50%;transform:translateX(-50%);width:min(420px,75vw);display:grid;gap:5px;text-align:center;pointer-events:none;color:#f6e6ac;text-shadow:0 1px 9px #263146;font-size:12px;z-index:2;overflow-wrap:anywhere}.first-light-memory[hidden]{display:none}.first-light-memory strong{font-size:17px;max-height:4.5em;overflow:auto}.first-light-memory span:last-child{font-size:11px}@media(max-width:600px){.first-light-memory{top:112px;width:72vw}.first-light-memory strong{font-size:14px}}

body[data-first-light=true] .exploration-hud{display:none}body[data-first-light=true] .first-light-memory{top:90px}body[data-first-light=true] .first-light-memory strong{color:var(--ink);text-shadow:none}body[data-first-light=true] .first-light-memory span{color:var(--muted);text-shadow:none}