:root{font-family:"PingFang SC","Noto Sans CJK SC",sans-serif;color:#f6eddb;font-synthesis:none;color-scheme:dark;--cream:#f6eddb;--muted:#d6d4cd;--glass:rgba(35,46,61,.48)}*{box-sizing:border-box}body{margin:0;overflow:hidden;background:#263e50}button,input,textarea,select{font:inherit}button{cursor:pointer}button:disabled{cursor:wait;opacity:.45}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid #f3d99d;outline-offset:4px}[hidden]{display:none!important}button{color:inherit}button svg{pointer-events:none}button,input,textarea,select{-webkit-tap-highlight-color:transparent}.experience{position:relative;width:100%;height:100dvh;min-height:420px;overflow:hidden;isolation:isolate}.landscape,.scenery,.grain,.vignette{position:absolute;inset:0;width:100%;height:100%}.landscape{z-index:-3;transition:opacity .45s}.landscape.entering{animation:scene-enter .9s ease both}.scenery{display:block}.grain{z-index:-1;opacity:.07;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.62' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.55' filter='url(%23n)'/%3E%3C/svg%3E")}.vignette{z-index:-1;pointer-events:none;background:linear-gradient(0deg,rgba(9,26,36,.47),transparent 42%),radial-gradient(ellipse at 50% 38%,transparent 38%,rgba(20,31,47,.25))}.actor-layer{position:absolute;width:clamp(125px,14vw,200px);left:55%;bottom:31%;filter:drop-shadow(0 15px 28px #14252e22);animation:actor-arrive 1s ease both}.actor-layer svg,.prop-layer svg{width:100%;display:block}.actor-layer.home-actor{left:68%;bottom:42%;width:155px}.prop-layer{position:absolute;width:clamp(160px,20vw,290px);left:67%;bottom:34%;filter:drop-shadow(0 9px 15px #14252e22)}.prop-layer:has(+.home-actor){left:79%;bottom:42%;width:220px}.prop-boat{animation:boat-rock 7s ease-in-out infinite}.prop-star,.prop-lantern{animation:glow 6s ease-in-out infinite}.character-breathe{animation:breathe 5s ease-in-out infinite;transform-origin:50% 95%}.sky-stars{animation:glow 8s ease-in-out infinite}.cloud-drift{animation:clouds 40s ease-in-out infinite alternate}.firefly{animation:firefly 7s ease-in-out infinite}.water-shimmer{animation:shimmer 8s ease-in-out infinite alternate}.motion-paused *,.motion-paused *:before,.motion-paused *:after{animation-play-state:paused!important}.floating-header{position:absolute;top:max(25px,env(safe-area-inset-top));left:36px;right:36px;display:flex;align-items:center;gap:16px;z-index:6}.wordmark{display:flex;align-items:center;gap:13px;font-size:17px;letter-spacing:2px}.wordmark>span{font-size:39px;font-weight:200}.wordmark small{display:block;font-size:8px;letter-spacing:2.1px;margin-top:5px;color:#d9d9d4}.tools{display:flex;gap:10px;margin-left:auto}.round-button{border:1px solid #f5ead327;background:rgba(31,44,61,.18);backdrop-filter:blur(12px);width:43px;height:43px;display:grid;place-items:center;border-radius:50%;font-size:22px;transition:background .2s,transform .2s}.round-button:hover{background:#f5ead322;transform:translateY(-2px)}.round-button[aria-pressed=true]{background:#f4dba544;border-color:#eed5aa}.reader-heading{max-width:55%;font-size:14px;letter-spacing:1px}.reader-heading small{display:block;font-size:9px;opacity:.65;margin-top:6px;letter-spacing:2px}.home-intro{position:absolute;top:27%;left:15%;text-shadow:0 3px 22px #1c2d4622}.overline{font-size:9px;letter-spacing:3.5px;opacity:.68}.home-intro h1{font-family:"Songti SC","Noto Serif CJK SC",serif;font-weight:400;font-size:clamp(29px,3.3vw,47px);letter-spacing:4px;line-height:1.6;margin:12px 0}.home-intro>p:last-child{font-family:Georgia,serif;font-size:15px;letter-spacing:1px;opacity:.73}.story-dock{position:absolute;left:50%;bottom:7.5%;transform:translateX(-50%);width:min(750px,84vw);text-align:center}.story-choices{display:flex;justify-content:center;gap:27px}.story-choice{width:190px;border:1px solid #f3eddf4a;border-radius:12px;background:#283d4c69;padding:7px 7px 11px;text-align:left;box-shadow:0 16px 35px #10233528;backdrop-filter:blur(15px);transition:transform .25s,background .25s}.story-choice:nth-child(1){transform:rotate(-3deg)}.story-choice:nth-child(3){transform:rotate(3deg)}.story-choice:hover{transform:translateY(-12px) rotate(0);background:#48596199}.cover-image{border-radius:6px;overflow:hidden;aspect-ratio:1.62}.cover-image svg{display:block;width:100%;height:100%}.story-number{display:flex;justify-content:space-between;font-size:8px;letter-spacing:1.5px;color:#ede0c2b8;margin:11px 4px 6px}.story-choice strong{font-size:13px;font-weight:500;display:block;margin:0 4px;line-height:1.6;letter-spacing:.5px}.story-choice small{font-size:8px;display:block;margin:4px 4px 0;opacity:.58;line-height:1.4}.make-own{border:0;border-bottom:1px solid #e0dcca4a;background:transparent;font-size:12px;letter-spacing:1px;padding:12px 0 8px;margin-top:19px}.make-own span{display:block;opacity:.6;font-size:9px;letter-spacing:1px;margin-top:5px}.world-label{position:absolute;bottom:27px;left:36px;font-size:11px;opacity:.6;letter-spacing:2px}.world-label small{display:block;font-size:7px;margin-top:6px;letter-spacing:1.8px}.reader-view{position:absolute;inset:0}.reading-dock{position:absolute;bottom:max(16px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);width:min(780px,calc(100% - 120px));z-index:4}.subtitle-panel{background:linear-gradient(120deg,#203345b3,#23384ab8);border:1px solid #eee7d326;border-radius:14px;padding:14px 24px 15px;backdrop-filter:blur(15px);box-shadow:0 10px 35px #132b3822}.subtitle-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:10px;letter-spacing:2px;color:#d5ccb2}.subtitle-meta button{border:0;background:none;font-size:15px;padding:0 6px}.subtitle-panel>p{font-family:"Songti SC","Noto Serif CJK SC",serif;margin:8px 0 0;font-size:clamp(16px,1.65vw,20px);line-height:1.85;letter-spacing:.8px;max-height:116px;overflow:auto;scrollbar-width:thin}.subtitle-panel.expanded>p{max-height:35dvh}.subtitle-panel .english-subtitle{font-family:Georgia,serif;font-size:12px;opacity:.7;line-height:1.6;max-height:90px}.input-bar{display:flex;align-items:center;gap:8px;border:1px solid #efe8d529;border-radius:30px;padding:5px 7px;background:#203345a3;backdrop-filter:blur(12px);margin-top:10px}.input-bar input{min-width:0;flex:1;background:none;border:0;color:var(--cream);padding:9px 4px;font-size:12px;outline:none;letter-spacing:.4px}.input-bar input::placeholder{color:#e1e1d188}.mic-button,.send-button{border:0;border-radius:50%;width:35px;height:35px;flex-shrink:0;background:transparent;font-size:23px}.mic-button{font-family:Georgia,serif}.mic-button.recording{background:#b35a52;animation:glow 1s infinite}.send-button{background:#e4d5b7;color:#38444d;font-size:23px}.page-controls{display:flex;align-items:center;justify-content:space-between;margin-top:12px;gap:10px}.quiet-button{background:none;border:0;padding:5px 0;font-size:15px;opacity:.8}.quiet-button span{font-size:10px;letter-spacing:1px}.page-dots{display:flex;flex-wrap:wrap;justify-content:center;gap:7px}.page-dot{padding:5px;border:0;background:none;width:18px;height:18px;display:grid;place-items:center}.page-dot:after{content:'';height:4px;width:4px;border-radius:50%;background:#e4e0cc68}.page-dot.active:after{width:15px;border-radius:3px;background:#e4d9b4}.suggestions{display:flex;justify-content:center;gap:9px;margin-bottom:10px;flex-wrap:wrap}.suggestion{background:#364b5cb8;border:1px solid #ede1c63d;backdrop-filter:blur(12px);border-radius:25px;padding:8px 15px;font-size:11px;letter-spacing:.5px}.suggestion:hover{background:#7a8576b5}.hotspot{position:absolute;border:1px solid #eddfbe60;width:41px;height:41px;border-radius:50%;background:#f5e1af12;backdrop-filter:blur(3px);z-index:3;animation:glow 5s infinite}.hotspot span{font-size:20px;color:#eee0b9}.hero-hotspot{left:calc(55% + 5vw);bottom:calc(31% + 215px)}.prop-hotspot{left:calc(67% + 10vw);bottom:calc(34% + 190px)}.scene-bubble{position:absolute;left:51%;bottom:59%;max-width:260px;font-size:12px;line-height:1.8;border-radius:13px;background:#f0e5cd;color:#41545a;padding:15px 20px;box-shadow:0 10px 25px #162d3022;z-index:5}.scene-bubble:after{content:'';position:absolute;bottom:-7px;left:30px;border-top:9px solid #f0e5cd;border-left:6px solid transparent;border-right:6px solid transparent}.branch-note{position:absolute;left:50%;top:95px;transform:translateX(-50%);border:1px solid #e4d5b425;border-radius:20px;padding:8px 17px;background:#23374e7a;backdrop-filter:blur(12px);font-size:10px;max-width:80%;text-align:center;color:#ddd8c3}.generation-status{position:absolute;left:50%;top:18%;transform:translateX(-50%);display:flex;align-items:center;gap:13px;border-radius:16px;padding:15px 18px;background:#293e50e3;border:1px solid #e7dbbc46;box-shadow:0 15px 40px #1b2d442a;backdrop-filter:blur(16px);z-index:10;max-width:85%;width:355px}.generation-status strong{font-size:12px;font-weight:500;letter-spacing:1px}.generation-status small{font-size:9px;display:block;opacity:.6;margin-top:6px;line-height:1.7}.generation-status button{background:none;border:0;font-size:22px;margin-left:auto}.small-orbit{font-size:26px;animation:orbit 6s linear infinite}.sheet{color:#384652;color-scheme:light;width:min(480px,calc(100vw - 32px));border:1px solid #f8f0de8a;border-radius:24px;background:#f3eddf;padding:32px;box-shadow:0 30px 120px #172e3e60;max-height:85dvh;overflow:auto;scrollbar-width:thin}.sheet::backdrop{background:#122a386b;backdrop-filter:blur(9px)}.sheet .overline{font-size:8px;letter-spacing:2.2px;color:#75847d;opacity:1}.sheet h2{font-family:"Songti SC",serif;font-weight:400;font-size:24px;letter-spacing:1px;margin:15px 0 8px}.sheet-subtitle{font-family:Georgia,serif;color:#8b8f88;font-size:12px;margin:0 0 25px;line-height:1.6}.close-dialog{position:absolute;right:18px;top:14px;border:0;background:none;font-size:25px;color:#879286}.sheet label{display:block;font-size:12px;margin:19px 0 9px}.sheet label span{font-size:10px;color:#8b938c;margin-left:5px}.sheet textarea,.sheet select{width:100%;border:1px solid #c8c9bb;border-radius:12px;padding:12px;background:#f9f5eb;color:#445460;resize:vertical;line-height:1.8;font-size:12px}.sheet textarea{max-height:180px}.sheet select{width:110px}.topic-wrap{position:relative}.topic-wrap textarea{padding-bottom:35px}.topic-wrap .mic-button{position:absolute;right:9px;bottom:12px;color:#758479}.prompt-chips{display:flex;gap:6px;flex-wrap:wrap;margin:12px 0 20px}.prompt-chips button{background:#e9e6d9;border:0;border-radius:20px;padding:8px 10px;font-size:10px;color:#6a7a71}.primary{border:0;border-radius:12px;background:#617f77;color:#fffaf0;width:100%;padding:14px;font-size:12px;letter-spacing:.5px}.primary span{font-size:10px;margin-left:9px;opacity:.7}.tiny-note{font-size:9px;line-height:1.8;color:#8a9489;margin:16px 0 0}.settings-toggles{display:flex;flex-wrap:wrap;gap:10px;margin:15px 0 25px}.settings-toggles label{font-size:11px;margin:0;display:flex;align-items:center;gap:5px}.settings-toggles label span{font-size:8px;margin:0}.settings-toggles input{accent-color:#617f77}.text-button{border:0;background:none;color:#708678;margin:20px 0 0;padding:0;font-size:11px}.world-options{display:grid;grid-template-columns:1fr 1fr;gap:12px}.world-option{border:1px solid #c8c9bb;border-radius:12px;overflow:hidden;background:#fff7ea;text-align:left;padding:0 0 10px;color:#536560}.world-option svg{display:block;width:100%;height:90px}.world-option span,.world-option small{display:block;margin:10px 12px 0;font-size:12px}.world-option small{font-size:8px;opacity:.6;margin-top:4px;letter-spacing:1px}.world-option.selected{outline:2px solid #6e8b7c;outline-offset:2px}.saved-books{display:grid;gap:8px;margin-top:20px}.saved-book{background:#e5e6da;border:0;border-radius:10px;padding:14px;text-align:left;color:#4e675e}.saved-book small{display:block;font-size:9px;margin-top:6px;opacity:.6}#reveal-content{font-size:13px;line-height:1.9;color:#607167}#reveal-content details{font-size:11px;border-top:1px solid #d6d8c8;padding-top:15px;margin:20px 0}#reveal-content summary{cursor:pointer}.notice{position:fixed;top:96px;left:50%;transform:translateX(-50%);display:flex;gap:15px;align-items:center;max-width:90vw;width:max-content;background:#eee3cf;color:#415562;border-radius:12px;padding:14px 20px;font-size:11px;line-height:1.7;z-index:30;box-shadow:0 10px 35px #1a334522}.notice button{border:0;background:none;color:#738374;font-size:20px}.notice span{max-width:450px}@keyframes firefly{0%,100%{opacity:.2;transform:translateY(0)}50%{opacity:.95;transform:translate(6px,-11px)}}@keyframes glow{0%,100%{opacity:.65}50%{opacity:1}}@keyframes breathe{0%,100%{transform:scaleY(1)}50%{transform:scaleY(.986)}}@keyframes boat-rock{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-5px) rotate(1deg)}}@keyframes shimmer{to{transform:translateX(12px);opacity:.5}}@keyframes clouds{to{transform:translateX(60px)}}@keyframes orbit{to{transform:rotate(360deg)}}@keyframes scene-enter{from{opacity:0}to{opacity:1}}@keyframes actor-arrive{from{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:translateX(0)}}
@media(max-width:700px){.floating-header{left:20px;right:20px;top:max(18px,env(safe-area-inset-top));gap:9px}.wordmark{font-size:13px;gap:8px}.wordmark>span{font-size:30px}.wordmark small{font-size:6px;letter-spacing:1.5px}.tools{gap:7px}.round-button{width:35px;height:35px;font-size:18px}.home-intro{left:9%;top:23%}.home-intro h1{font-size:28px;letter-spacing:2px}.home-intro>p:last-child{font-size:12px}.overline{font-size:7px;letter-spacing:2px}.story-dock{width:calc(100% - 32px);bottom:10%}.story-choices{gap:9px}.story-choice{width:calc((100% - 18px)/3);padding:5px 5px 10px;border-radius:9px}.story-number{font-size:6px;letter-spacing:.5px;margin:9px 1px 6px}.story-choice strong{font-size:10px;margin:0 1px;line-height:1.6}.story-choice small{font-size:7px;margin:4px 1px 0;min-height:20px}.cover-image{aspect-ratio:1}.make-own{font-size:11px;margin-top:18px}.make-own span{font-size:8px}.world-label{left:20px;bottom:25px;font-size:9px}.world-label small{font-size:6px}.actor-layer.home-actor{left:57%;bottom:43%;width:110px}.prop-layer:has(+.home-actor){left:76%;bottom:43%;width:145px}.actor-layer{left:32%;width:126px;bottom:42%}.prop-layer{left:60%;width:156px;bottom:43%}.reading-dock{width:calc(100% - 32px);bottom:max(12px,env(safe-area-inset-bottom))}.subtitle-panel{padding:12px 16px}.subtitle-panel>p{font-size:16px;line-height:1.8;max-height:143px}.subtitle-meta{font-size:9px;letter-spacing:1px}.subtitle-panel .english-subtitle{max-height:72px;font-size:11px}.reader-heading{font-size:11px;max-width:42%}.reader-heading small{font-size:7px;letter-spacing:1px}.reader-heading+#unused{display:none}.reader-view .hotspot{width:33px;height:33px}.hero-hotspot{left:calc(32% + 48px);bottom:calc(42% + 157px)}.prop-hotspot{left:calc(60% + 63px);bottom:calc(43% + 124px)}.scene-bubble{left:22%;bottom:63%;max-width:220px;font-size:11px}.suggestions{gap:6px;margin-bottom:8px}.suggestion{font-size:10px;padding:7px 11px;max-width:100%;line-height:1.5}.input-bar input{font-size:11px}.input-bar{margin-top:8px}.page-controls{margin-top:7px}.quiet-button span{font-size:9px}.page-dots{gap:3px;max-width:55%}.page-dot{width:14px;height:18px;padding:3px}.page-dot.active:after{width:10px}.sheet{padding:27px 23px;border-radius:21px}.sheet h2{font-size:22px}.primary span{display:block;margin:5px 0 0}.branch-note{top:79px;width:max-content;max-width:88%;font-size:9px;padding:7px 12px}.generation-status{top:16%}.experience.reading #world-button{display:none}.experience.reading .tools{gap:7px}.subtitle-panel.expanded>p{max-height:33dvh}.settings-toggles{display:grid;gap:12px}}
@media(max-height:560px) and (min-width:701px){.home-intro{top:20%;left:10%}.story-dock{bottom:5%}.story-choice{width:145px}.story-choices{gap:20px}.make-own{margin-top:8px}.reading-dock{width:65%;bottom:8px}.subtitle-panel>p{max-height:72px;font-size:16px}.actor-layer{left:25%;bottom:31%;width:120px}.prop-layer{left:74%;width:160px}.hero-hotspot{left:28%;bottom:65%}.prop-hotspot{left:82%;bottom:68%}.suggestions{margin-bottom:5px}.page-controls{margin-top:4px}.floating-header{top:15px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
/* Keep the actors visible above the subtitle dock. */
.experience.reading .actor-layer{bottom:41%}.experience.reading .prop-layer{bottom:42%}.experience.reading .hero-hotspot{bottom:calc(41% + 215px)}.experience.reading .prop-hotspot{bottom:calc(42% + 190px)}
@media(max-width:700px){.experience.reading .actor-layer{bottom:46%}.experience.reading .prop-layer{bottom:47%}.experience.reading .hero-hotspot{bottom:calc(46% + 157px)}.experience.reading .prop-hotspot{bottom:calc(47% + 124px)}}

.experience.reading #world-button{display:none}.mic-button{display:grid;place-items:center}.firefly:nth-child(3n){animation-delay:-2s}.firefly:nth-child(3n+1){animation-delay:-4s}

.subtitle-panel>p{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}.subtitle-panel .english-subtitle{-webkit-line-clamp:2}.subtitle-panel.expanded>p{display:block;-webkit-line-clamp:unset;overflow:auto}
@media(max-width:700px){.scene-moon{transform:translate(-290px,16px)}.subtitle-panel>p{max-height:87px}.subtitle-panel .english-subtitle{max-height:38px}.subtitle-panel.expanded>p{max-height:33dvh}}
/* Pausing motion must not freeze an entrance transition at opacity zero. */
.motion-paused .landscape,.motion-paused .actor-layer{animation:none!important;opacity:1!important}

/* Children choose complete, prepared stories by their covers. */
.story-card{min-height:205px}.story-card strong{min-height:40px}.story-card small{min-height:27px}.story-card .cover-image{pointer-events:none}.empty-shelf{padding:22px;border:1px dashed #f3eddf4a;border-radius:16px;background:#283d4c50;backdrop-filter:blur(12px);font-size:13px;line-height:1.8}.empty-shelf>span{font-size:30px;color:#e8d8b7}.empty-shelf p{margin:7px 0}.empty-shelf small{font-family:Georgia,serif;opacity:.6;font-size:11px}.field-help{font-size:10px;line-height:1.8;color:#7e8d81;margin:8px 0}.sheet .prompt-chips{margin-bottom:15px}.sheet .prompt-chips button:disabled{opacity:.4}.generation-status{width:375px}.generation-status>div{min-width:0}.generation-status strong{line-height:1.7}
@media(max-width:700px){.story-card{min-height:193px}.story-card strong{min-height:51px}.story-card small{min-height:35px}.empty-shelf{font-size:12px}.home-intro>p:last-child{font-size:10px}}