/* Full-screen illustrated storytelling. All controls live inside their scene. */
body[data-scene="-1"] .story-panel h1{top:12%;font-size:clamp(48px,5vw,72px);color:#194d43;text-shadow:0 1px 0 #fff9e333,0 3px 18px #d8f0e433}body[data-scene="-1"] .story-panel>.eyebrow{top:9%;color:#315f4c;text-shadow:0 1px 6px #fff8dc77}body[data-scene="-1"] .story-panel .subtitle{top:32%;color:#244f44;text-shadow:0 1px 7px #fff8dca3}body[data-scene="-1"] .cover-start{left:53%}
html,body{width:100%;height:100%;overflow:hidden;background:#479eab}body::before{display:none}.page-shell{width:100%;height:100svh;max-width:none;margin:0;padding:0}.topbar{position:fixed;left:0;top:0;width:100%;height:90px;padding:0 4%;z-index:12;color:#fffaf0;background:linear-gradient(#1a51473d,transparent);pointer-events:none}.topbar>*{pointer-events:auto}.wordmark{font-size:23px;color:#fffbe9;text-shadow:0 1px 7px #22514370}.wordmark svg{stroke:#fffbe9;width:34px;height:34px}.wordmark small{color:#fffae3c7;font-size:8px}.header-actions{gap:24px}.quiet-button{font-size:11px;color:#fffbe9;text-shadow:0 1px 6px #244b4766}.quiet-button:hover{color:#ffe5ac}.page-footer{display:none}#main,.experience{position:absolute;inset:0;min-height:0;padding:0;display:block}.experience{overflow:hidden;isolation:isolate}.stage{position:absolute;inset:0;width:100%;height:100%;max-height:none;min-height:0;border-radius:0;box-shadow:none;overflow:hidden}.stage picture{position:absolute;inset:0}.scene-art,.stage.cover-stage .scene-art{object-fit:cover;object-position:center;transform:scale(1.015);animation:scene-breathe 16s ease-in-out infinite alternate}.stage .scene-shade{position:absolute;inset:0;background:linear-gradient(#1c52614d 0%,transparent 36%,transparent 48%,#164e4a33 66%,#123f42bf 100%);z-index:1}.stage-caption,.corner-mark{display:none}.story-panel{position:absolute;inset:0;padding:0;max-width:none;pointer-events:none;z-index:4}.story-panel button,.story-panel input,.story-panel a{pointer-events:auto}.chapter-kicker{position:absolute;left:4%;top:108px;gap:11px}.chapter-number{color:#fff7d5;font-size:22px}.chapter-line{background:#fff7b955;width:24px}.chapter-kicker .eyebrow{color:#fff9e1c7;font-size:9px;letter-spacing:2px}.story-panel h2{position:absolute;left:4%;top:144px;margin:0;font-size:32px;letter-spacing:5px;color:#fffaf0;text-shadow:0 2px 10px #164d5c44}.story-copy{position:absolute;left:50%;bottom:126px;transform:translateX(-50%);width:min(510px,82vw);text-align:center;color:#fffbea;font-size:14px;line-height:2;letter-spacing:1px;text-shadow:0 1px 8px #174a4f}.story-panel .mini-note{position:absolute;left:50%;bottom:82px;transform:translateX(-50%);color:#fffbe2ad;width:min(510px,82vw);font-size:10px;text-align:center;line-height:1.7;margin:0}.chapter-actions{position:absolute;left:50%;bottom:68px;transform:translateX(-50%);margin:0;width:auto;max-width:90vw}.chapter-actions .primary-button{min-height:44px;max-width:none;width:auto;min-width:205px;justify-content:center;gap:20px;padding:11px 24px;background:#fff8e6ed;color:#225a4c;font-size:12px;letter-spacing:2px;border:1px solid #fff9d888;border-radius:30px;box-shadow:0 5px 20px #1b4f461a}.chapter-actions .primary-button:hover{background:white;transform:translateY(-2px)}.chapter-actions .primary-button span{font-size:16px}.chapter-bottom{position:absolute;left:4%;right:4%;bottom:23px;margin:0;pointer-events:none}.chapter-bottom>*{pointer-events:auto}.progress-dots{gap:8px}.progress-dots button{background:#fff8c46b;height:3px;width:14px;border-radius:2px}.progress-dots button.active{width:34px;background:#fff9d8}.back-button{color:#fff9d8bd;font-size:10px;letter-spacing:2px}.back-button:hover{color:white}.text-button{color:#fff8dc}.story-panel .dialogue{position:absolute;left:50%;bottom:145px;transform:translateX(-50%);width:min(450px,84vw);padding:16px 21px;border:0;gap:13px;background:#fff9eced;border-radius:17px 17px 17px 3px;box-shadow:0 5px 20px #184a4826;font-size:13px;line-height:1.9;margin:0}.story-panel .dialogue strong{color:#b87345;font-size:10px}.story-panel .dialogue p{color:#315e4e}.dialogue::after{content:"";position:absolute;bottom:-9px;left:28px;border-top:10px solid #fff9eced;border-right:11px solid transparent}.selection-reply{position:absolute;bottom:142px;left:50%;transform:translateX(-50%);width:min(480px,82vw);margin:0;color:#fff8de;text-shadow:0 2px 6px #155457;font-size:14px;line-height:1.9;text-align:center;min-height:0}
/* The cover: the offered paddle itself is the entrance. */
.chapter--1 .story-panel>.eyebrow{position:absolute;top:15%;left:50%;transform:translateX(-50%);color:#fffce8;white-space:nowrap;letter-spacing:5px;font-size:10px;text-shadow:0 2px 7px #1f68896b}.story-panel h1{position:absolute;top:19%;left:50%;transform:translateX(-50%);font-size:clamp(45px,5.5vw,80px);line-height:1.25;letter-spacing:8px;font-weight:500;color:#fffdf2;text-align:center;text-shadow:0 3px 16px #21596c38;margin:0;width:90vw}.story-panel h1 span{display:block;white-space:nowrap}.story-panel .subtitle{position:absolute;top:41%;left:50%;transform:translateX(-50%);max-width:90vw;width:600px;text-align:center;color:#fffce8;font-size:13px;letter-spacing:2px;text-shadow:0 1px 7px #1c577e66;line-height:2}.cover-actions{position:absolute;inset:0;margin:0;pointer-events:none}.cover-start{position:absolute;left:64%;top:62%;transform:translate(-50%,-50%);width:88px;height:88px;border:1.5px solid #fffdf2;border-radius:50%;background:transparent;box-shadow:none;backdrop-filter:none;color:white;pointer-events:auto;animation:none}.paddle-glyph{font-size:55px;line-height:1;font-family:var(--serif);display:block;color:#fffdf2;-webkit-text-stroke:.25px currentColor;transform:rotate(10deg)}.handle-caption{position:absolute;top:105px;left:50%;transform:translateX(-50%);white-space:nowrap;font-size:16px;letter-spacing:4px;color:#fffdf2;font-weight:600;text-shadow:0 1px 4px #153f49a6;isolation:isolate}.handle-caption::before{content:"";position:absolute;inset:-5px -10px;z-index:-1;background:radial-gradient(ellipse,#124c5433 0%,#124c541a 45%,transparent 75%);filter:blur(3px);pointer-events:none}.cover-start small{position:absolute;top:137px;left:50%;transform:translateX(-50%);white-space:nowrap;font-size:10px;font-weight:400;letter-spacing:2px;color:#fffdf2ed;text-shadow:0 1px 4px #153f49b3}.cover-meta{position:absolute;bottom:35px;left:50%;transform:translateX(-50%);white-space:nowrap;color:#fff7dc9e;font-size:9px;letter-spacing:3px;margin:0}.cover-start:hover{background:transparent;box-shadow:none}.chapter--1 .stage .scene-shade{background:linear-gradient(#1e546d24,transparent 48%,#194c4b1a 70%,#143f4388)}
/* Finding a sound: small ripples and the appearing boat are actual targets. */
.hotspot{width:66px;height:66px;color:#fffaf0;border:1px solid #fff7dccc;background:#fff6ce18;box-shadow:0 0 0 10px #fffadd12;backdrop-filter:blur(2px);font-family:var(--serif);font-size:25px}.hotspot.visited{background:#edc66f55;color:#fff8cd}.hotspot::after{inset:-12px;border-color:#fff6cc40;animation:ring-out 3s ease-out infinite}.hotspot span{background:none;top:80px;color:#fff9e3;text-shadow:0 1px 8px #20585d;padding:0;font-size:11px;letter-spacing:3px}.hotspot.talk{top:30%;left:17%}.hotspot.water{top:58%;left:30%}.hotspot.drum{top:42%;right:21%}.hotspot.talk span{top:80px}.chapter-0 .story-copy{bottom:auto;top:210px;font-size:13px}.chapter-0 .dialogue{display:none}.chapter-0 .selection-reply{bottom:132px}.chapter-0 .chapter-actions{bottom:72px}.discovery-boat{position:absolute;left:27%;top:26%;width:48%;aspect-ratio:1;opacity:0;z-index:3;background-image:url(assets/paddling.webp);background-size:200% 200%;border:0;pointer-events:none}.discovery-boat.revealed{opacity:1;animation:boat-arrive 2s ease-out both;pointer-events:auto}.boat-invite{position:absolute;left:50%;top:91%;transform:translateX(-50%);white-space:nowrap;background:#fff8e8e8;padding:9px 15px;border-radius:20px;font-size:11px;letter-spacing:2px;color:#275c4c}
/* Wishes become thought bubbles; teammates become touch targets. */
.choices{position:absolute;left:14%;top:48%;display:flex;flex-direction:column;gap:13px;align-items:flex-start;margin:0}.choice{padding:13px 18px;max-width:270px;border:1px solid #fffbefb3;border-radius:20px 20px 20px 3px;box-shadow:0 4px 18px #24595018;background:#fff9edeb;gap:10px;backdrop-filter:blur(6px);transition:transform .25s,background .25s}.choice:hover{background:#fffdf5;transform:translateX(7px)}.choice.selected{border-color:#ffe7a4;background:#fff5d9;transform:translateX(8px)}.choice-mark{width:25px;height:25px;font-family:var(--serif);background:#dce7d5;border:0;color:#315f4c}.choice.selected .choice-mark{background:#bf8b48;color:white}.choice-title{font-family:var(--serif);font-size:18px;font-weight:400;letter-spacing:2px}.choice-description{display:none}.chapter-1 .story-copy{top:31%;bottom:auto}.chapter-1 .selection-reply{bottom:140px}.chapter-1 .chapter-actions{left:67%;bottom:92px}.people-tabs{position:absolute;inset:0;margin:0;display:block;pointer-events:none}.people-tabs .person-button{position:absolute;border:1px solid #fff8da96;background:#fff6d122;color:white;border-radius:50%;width:65px;height:65px;font-size:0;box-shadow:0 0 0 9px #fff7cb12;backdrop-filter:blur(1px);display:flex;align-items:center;justify-content:center;padding:0;pointer-events:auto}.person-button .portrait{display:none}.people-tabs .person-button::before{content:"…";font-family:var(--serif);font-size:30px;line-height:1;color:#fff9dd}.people-tabs .person-button::after{content:"听听这位队友";position:absolute;top:78px;left:50%;transform:translateX(-50%);white-space:nowrap;font-size:11px;letter-spacing:2px;text-shadow:0 1px 5px #2d5f4d}.people-tabs .person-button:first-child{left:64%;top:43%}.people-tabs .person-button:last-child{left:39%;top:62%}.people-tabs .person-button:first-child::after{content:"点一点阿杰"}.people-tabs .person-button.selected{background:#ffe8a34d;border-color:#fff2c2}.chapter-2 .story-copy{top:27%;bottom:auto}.chapter-2 .dialogue:nth-of-type(2){display:none}.chapter-2 .mini-note{display:none}.chapter-2 .chapter-actions{bottom:65px}
/* The river is the play area. Taps splash beside the paddles. */
.boat-sprite{left:calc(50% - min(42vw,390px) + var(--boat-travel,0%));top:18%;width:min(84vw,780px);height:auto;aspect-ratio:1;background-size:200% 200%;filter:drop-shadow(0 15px 3px #185d7326);transition:left .4s,filter .2s;z-index:2}.boat-sprite.highlight{filter:drop-shadow(0 0 14px #fff3ba)}.stage.train-stage .scene-art{animation:water-camera 12s ease-in-out infinite alternate;object-position:center 62%}.rhythm-zone{position:absolute;left:66%;top:59%;margin:0;padding:0;min-height:0;display:block;width:108px;height:108px}.tap-pad{width:108px;height:108px;border:1px solid #fff4d9ad;border-radius:50%;background:#f8f1bf14;color:#fff9df;font-size:28px;font-family:var(--serif);box-shadow:0 0 25px #fff9dd18}.tap-pad.success{background:#f7eab22b}.target-circle{inset:15px;border-color:#fff7bccc}.moving-circle{inset:15px;border-color:#ffe5a0;border-width:2px;filter:drop-shadow(0 0 5px #f9e7a3)}.beat-info{position:absolute;width:190px;left:-210px;top:21px;text-align:right;color:#fff7dece;line-height:1.9;font-size:10px;text-shadow:0 1px 7px #1c5b6d}.beat-count{font-size:23px;color:#fff7d8;margin:0 0 7px;line-height:1.3}.beat-feedback{color:#fff0bb;font-size:13px}.game-controls{position:absolute;inset:0;margin:0;pointer-events:none}.game-controls .primary-button{position:absolute;left:66%;top:59%;width:108px;min-width:0;height:108px;min-height:0;border-radius:50%;margin:0;display:flex;justify-content:center;align-items:center;padding:15px;font-size:13px;line-height:1.9;letter-spacing:2px;background:#fff8dedf;color:#295e4c;border:1px solid #fff9ed;box-shadow:0 0 0 12px #fff9d517;pointer-events:auto}.game-controls .primary-button span{display:none}.game-controls .text-button{position:absolute;right:4%;bottom:65px;font-size:10px;letter-spacing:2px;pointer-events:auto;color:#fff7d8b2}.game-controls .auto-experience{position:absolute;left:4%;bottom:65px;color:#fff8d9bb;font-size:10px;letter-spacing:2px;pointer-events:auto;padding:7px 0}.game-controls .auto-experience:hover{color:white}.speed-controls{position:absolute;left:4%;top:208px;gap:8px;margin:0;pointer-events:auto}.speed-controls button{border-color:#fff9d65c;color:#fff8dd;font-size:10px;padding:6px 13px;background:#28596622}.speed-controls button.selected{background:#fff6dcd9;color:#35614e;border-color:transparent}.speed-controls .mini-label{font-size:10px;color:#fff6d6a3}.chapter-3 .story-copy,.chapter-6 .story-copy{bottom:137px}.chapter-3 .mini-note,.chapter-6 .story-panel>.mini-note{display:none}.chapter-3 .chapter-actions,.chapter-6 .chapter-actions{bottom:68px}.cue-switch{position:absolute;right:4%;top:208px;margin:0;pointer-events:auto;gap:6px}.cue-switch .mini-label{display:none}.cue-switch button{font-size:10px;color:#fff9df;border-color:#fff7cb7a;background:#24556633}.cue-switch button.selected{background:#fff7d8df;color:#315d4c;border-color:transparent}.race-course{left:50%;right:auto;width:min(420px,62vw);transform:translateX(-50%);bottom:97px;height:2px;background:#fff9c93d}.race-course-label{display:none}.race-course-fill{background:#ffebad;box-shadow:0 0 10px #fce2a863;position:relative}.race-course-fill::after{content:"";position:absolute;right:-3px;top:-4px;width:6px;height:6px;border-radius:50%;background:#fff9d4}.stage-tag{top:153px;right:4%;padding:0;background:none;color:#fff1cd;font-size:12px;letter-spacing:3px;text-shadow:0 1px 5px #26616b}.race-voice{position:absolute;left:50%;top:30%;transform:translateX(-50%);max-width:80vw;color:#fff7db;font-family:var(--serif);font-size:22px;line-height:1.8;text-align:center;z-index:3;white-space:nowrap;text-shadow:0 2px 9px #24607788}.chapter-6 .speed-controls{top:255px}.chapter-6 .speed-controls .mini-note{position:static;transform:none;width:auto;margin:0;bottom:auto;left:auto;font-size:10px;color:#fff7d3a8}.water-drop{position:absolute;left:50%;top:50%;width:5px;height:11px;border-radius:50%;background:#fafff2;box-shadow:0 0 3px #fff;pointer-events:none;animation:splash-out .6s var(--delay) ease-out both}.stroke .boat-sprite{animation:boat-stroke .5s ease-out}.finished .boat-sprite{filter:drop-shadow(0 0 15px #fff5bb)}
/* Scrubbing directly on the illustration. */
.replay-stage{touch-action:none;cursor:grab}.replay-stage.dragging{cursor:grabbing}.replay-stage>.boat-sprite:not(.boat-sprite-ajie){clip-path:inset(0 48% 0 0)}.boat-sprite-ajie{clip-path:inset(0 0 0 52%)}.recorded{top:206px;left:4%;background:#fff8e6d6;color:#4f6758;font-size:9px;padding:6px 9px;letter-spacing:2px}.chapter-4 .stage-tag{top:206px}.drag-hint{position:absolute;left:50%;top:71%;transform:translateX(-50%);font-size:12px;letter-spacing:4px;color:#fff8d5b8;z-index:3;pointer-events:none}.chapter-4 .story-copy{top:29%;bottom:auto}.replay-controls{position:absolute;left:50%;bottom:250px;transform:translateX(-50%);width:min(480px,76vw);margin:0;pointer-events:auto}.replay-controls label{color:#fff8ddbb;font-size:10px;margin:0 0 5px;letter-spacing:2px}.replay-controls input{accent-color:#f8deb0;height:17px}.phase-buttons button{font-size:9px;border:0;color:#fff7d4b0;padding:4px 9px;letter-spacing:2px}.phase-buttons button.selected{background:#fff7d0b8;color:#396350}.chapter-4 .people-tabs .person-button{width:51px;height:51px;top:45%;background:#fff8df1f}.chapter-4 .people-tabs .person-button:first-child{left:35%}.chapter-4 .people-tabs .person-button:last-child{left:56%}.chapter-4 .people-tabs .person-button::after{font-size:9px;top:63px}.chapter-4 .people-tabs .person-button:first-child::after{content:"大卫的发现"}.chapter-4 .people-tabs .person-button:last-child::after{content:"阿杰的发现"}.chapter-4 .dialogue{bottom:133px;font-size:12px}.chapter-4 .chapter-actions{bottom:65px}
/* A few weekends, then a reminder in the boat. */
.montage{position:absolute;left:50%;top:30%;transform:translateX(-50%);width:min(400px,82vw);display:flex;gap:25px;margin:0;color:white}.montage span{font-size:14px;color:#fff8df;border-top-color:#fff5c951;padding-top:11px;letter-spacing:2px;white-space:nowrap}.montage span::before{color:#ffe8a6}.chapter-5 .story-copy{top:24%;bottom:auto}.chapter-5 .choices{position:absolute;inset:0;display:block}.chapter-5 .choice{position:absolute;top:53%;left:21%;padding:13px 17px}.chapter-5 .choice:last-child{top:64%;left:66%;border-radius:20px 20px 3px 20px}.chapter-5 .choice-description{display:none}.chapter-5 .choice-title{font-size:17px}.chapter-5 .choice-mark{font-size:15px}.chapter-5 .mini-note{bottom:132px;font-size:12px;color:#fff9e1}.chapter-5 .chapter-actions{bottom:65px}
/* A photograph taken inside the story. */
.group-stage{background:#38766c}.group-stage>.scene-art{object-fit:cover;object-position:center;animation:none}.group-stage .scene-shade{background:linear-gradient(#16484255,transparent 38%,#17463f2b 62%,#113f40ec)}.arrival-stamp{top:115px;right:4%;width:65px;height:65px;font-size:14px}.photo-button{position:absolute;left:50%;top:57%;transform:translateX(-50%);z-index:5;padding:12px 19px;border:1px solid #fff9d3;border-radius:25px;background:#fff8de33;color:#fff9e3;font-size:12px;letter-spacing:2px;backdrop-filter:blur(3px)}.photo-button:hover{background:#fff7d54d}.photo-flash{position:absolute;inset:0;background:#fffdf1;opacity:0;pointer-events:none;z-index:10}.photographed .photo-flash{animation:photo-flash .55s ease-out}.chapter-7 .story-copy{display:none}.chapter-7 .dialogue{display:none}.message{position:absolute;left:50%;bottom:265px;transform:translateX(-50%);width:min(370px,80vw);margin:0;padding:12px 16px;background:#fff8ebe0;border:0;box-shadow:0 4px 20px #183f3f18;border-radius:14px 14px 14px 3px;font-size:12px;color:#315b4a;letter-spacing:1px}.message span{color:#84917d;font-size:9px;letter-spacing:2px}.response-select{position:absolute;left:50%;bottom:206px;transform:translateX(-50%);width:90vw;display:flex;justify-content:center;gap:8px;margin:0}.response-select button{border-color:#fff8e078;background:#fff6de0a;color:#fff8e0;font-size:11px;letter-spacing:1px}.response-select button.selected{border-color:#fff8da;background:#fff6dbdf;color:#315d4b}.final-quote{position:absolute;left:50%;bottom:139px;transform:translateX(-50%);font-size:20px;line-height:1.7;width:min(590px,86vw);text-align:center;color:#fff9e1;margin:0}.chapter-7 .chapter-actions{bottom:72px}.chapter-7 .chapter-actions>div{display:none}
.paper-dialog{z-index:20}.paper-dialog .text-button{color:var(--muted)}.paper-dialog #about-button{display:block;margin-top:8px}.toast{bottom:45px;z-index:35;background:#fff9ebf0;color:#315e4d;border:1px solid #fff9de;box-shadow:0 7px 30px #103f432f;font-size:12px}
@keyframes scene-breathe{to{transform:scale(1.045)}}@keyframes paddle-beacon{50%{box-shadow:0 0 0 18px #fff9d418,0 0 0 36px #fff9d406}}@keyframes ring-out{from{transform:scale(.8);opacity:.8}to{transform:scale(1.5);opacity:0}}@keyframes boat-arrive{from{transform:translateX(-90px);opacity:0}to{transform:translateX(0);opacity:1}}@keyframes water-camera{to{transform:scale(1.05) translateX(-1%)}}@keyframes splash-out{0%{opacity:0;transform:translate(0,0) scale(.3)}15%{opacity:.9}100%{opacity:0;transform:translate(var(--dx),var(--dy)) scale(.3)}}@keyframes boat-stroke{50%{translate:3px -3px}}@keyframes photo-flash{0%{opacity:.7}100%{opacity:0}}
@media(min-width:1600px){.page-shell{padding:0}.experience{gap:0}.story-panel{max-width:none}}
@media(max-width:1000px) and (min-width:701px){.page-shell{padding:0}.experience{display:block;gap:0}.story-panel h1{font-size:65px}.stage{min-height:0}.story-panel h2{font-size:30px}}
@media(max-width:799px){.topbar{height:78px;padding:0 21px}.wordmark{font-size:19px;gap:8px;letter-spacing:2px}.wordmark svg{width:29px;height:29px}.wordmark small{font-size:6px;letter-spacing:1.3px}.header-actions{gap:16px}.quiet-button{font-size:9px;letter-spacing:1px;gap:5px}.quiet-button #sound-icon{font-size:18px}.quiet-button .menu-icon{font-size:14px}.chapter-kicker{left:25px;top:99px;gap:9px}.chapter-number{font-size:20px}.chapter-kicker .eyebrow{font-size:8px;letter-spacing:1px}.chapter-line{width:20px}.story-panel h2{left:25px;top:131px;font-size:26px;letter-spacing:3px}.story-copy{font-size:12px;line-height:1.9;width:82vw;bottom:140px;letter-spacing:.8px}.chapter-bottom{bottom:max(21px,env(safe-area-inset-bottom));left:21px;right:21px}.progress-dots{gap:5px}.progress-dots button{width:10px;height:3px}.progress-dots button.active{width:22px}.back-button{font-size:9px;padding:7px 0;letter-spacing:1px}.chapter-actions{bottom:68px}.chapter-actions .primary-button{min-height:42px;min-width:190px;font-size:11px;padding:10px 20px}.story-panel .dialogue{font-size:12px;line-height:1.8;bottom:142px;padding:14px 17px;width:84vw;gap:10px;border-radius:15px 15px 15px 3px}.story-panel .dialogue strong{font-size:9px}.chapter--1 .story-panel>.eyebrow{top:16%;font-size:8px;letter-spacing:3px}.story-panel h1{top:21%;font-size:48px;letter-spacing:5px;line-height:1.25;width:92vw}.story-panel .subtitle{top:38%;width:80vw;font-size:11px;line-height:2.1;letter-spacing:1.4px}.cover-start{left:57%;top:63%;width:70px;height:70px}.paddle-glyph{font-size:43px}.handle-caption{top:86px;font-size:15px;letter-spacing:3px}.cover-start small{top:116px;font-size:9px;letter-spacing:1px}.cover-meta{bottom:36px;letter-spacing:1.7px;font-size:8px}.stage .scene-art,.stage.cover-stage .scene-art{object-position:50% 55%}.chapter-0 .story-copy{top:205px;font-size:12px}.hotspot{width:49px;height:49px;font-size:21px}.hotspot span,.hotspot.talk span{top:65px;font-size:10px;letter-spacing:2px}.hotspot.talk{top:33%;left:14%}.hotspot.water{top:58%;left:21%}.hotspot.drum{top:43%;right:16%}.chapter-0 .selection-reply{bottom:138px;font-size:12px}.discovery-boat{left:15%;width:77%;top:32%}.boat-invite{top:91%;font-size:10px;padding:8px 12px}.chapter-1 .story-copy{top:26%;font-size:12px}.choices{left:7%;top:55%;gap:10px}.choice{padding:11px 14px;gap:9px;border-radius:17px 17px 17px 3px;max-width:210px}.choice-mark{width:23px;height:23px;font-size:13px}.choice-title{font-size:17px;letter-spacing:2px}.chapter-1 .selection-reply{bottom:113px;font-size:12px}.chapter-1 .chapter-actions{left:70%;bottom:61px}.chapter-1 .chapter-actions .primary-button{min-width:165px;font-size:10px}.people-tabs .person-button{width:50px;height:50px}.people-tabs .person-button::before{font-size:25px}.people-tabs .person-button::after{top:63px;font-size:10px;letter-spacing:1px}.people-tabs .person-button:first-child{top:45%;left:71%}.people-tabs .person-button:last-child{top:63%;left:41%}.chapter-2 .story-copy{top:26%;font-size:12px}.chapter-2 .dialogue{bottom:137px}.boat-sprite{width:96vw;left:calc(2vw + var(--boat-travel,0%));top:26%;aspect-ratio:1}.speed-controls{top:186px;left:25px;gap:7px}.speed-controls button{font-size:9px;padding:6px 11px}.speed-controls .mini-label{font-size:9px}.rhythm-zone{left:69%;top:60%;width:86px;height:86px}.tap-pad{width:86px;height:86px;font-size:23px}.target-circle,.moving-circle{inset:13px}.game-controls .primary-button{left:69%;top:60%;width:86px;height:86px;font-size:12px;letter-spacing:1px;padding:12px}.beat-info{left:-165px;top:14px;width:150px;font-size:9px}.beat-count{font-size:21px}.beat-feedback{font-size:12px;white-space:nowrap}.game-controls .text-button{bottom:67px;right:22px;font-size:9px}.game-controls .auto-experience{bottom:67px;left:22px;font-size:9px}.chapter-3 .story-copy,.chapter-6 .story-copy{bottom:138px;width:83vw;font-size:12px}.chapter-3 .chapter-actions,.chapter-6 .chapter-actions{bottom:67px}.stage-tag{top:179px;right:25px;font-size:10px;letter-spacing:1px}.race-voice{top:31%;font-size:17px;white-space:normal;width:80vw;line-height:1.9}.race-course{bottom:101px;width:53vw}.cue-switch{top:211px;right:25px;gap:5px}.cue-switch button{font-size:9px;padding:6px 10px}.chapter-6 .speed-controls{top:215px}.chapter-6 .speed-controls .mini-label{display:none}.chapter-6 .speed-controls .mini-note{font-size:9px;max-width:135px;line-height:1.8;text-align:left}.recorded{top:184px;left:25px;font-size:8px}.chapter-4 .stage-tag{top:190px}.chapter-4 .story-copy{top:28%;font-size:11px;line-height:2;width:82vw}.chapter-4 .people-tabs .person-button{top:46%;width:42px;height:42px}.chapter-4 .people-tabs .person-button:first-child{left:26%}.chapter-4 .people-tabs .person-button:last-child{left:58%}.chapter-4 .people-tabs .person-button::after{top:53px;font-size:9px}.drag-hint{top:65%;font-size:10px;letter-spacing:2px}.replay-controls{bottom:250px;width:81vw}.replay-controls label{font-size:9px}.phase-buttons button{font-size:8px;letter-spacing:1px}.chapter-4 .dialogue{bottom:135px;font-size:11px;line-height:1.9;min-height:76px}.chapter-4 .chapter-actions{bottom:65px}.montage{top:32%;gap:14px;width:83vw}.montage span{font-size:12px;letter-spacing:1px}.chapter-5 .story-copy{top:25%;font-size:12px}.chapter-5 .choice{left:8%;top:54%;padding:11px 13px}.chapter-5 .choice:last-child{left:auto;right:7%;top:65%;border-radius:17px 17px 3px 17px}.chapter-5 .choice-title{font-size:16px;letter-spacing:1px}.chapter-5 .choice-mark{font-size:13px}.chapter-5 .mini-note{bottom:134px;font-size:11px}.chapter-7 .stage>.scene-art{object-fit:contain;top:17%;width:100%;height:auto;max-height:55%;object-position:center;transform:none;background:#f5eedb;padding:9px 9px 25px;rotate:-2deg;box-shadow:0 12px 40px #0e40346b}.group-stage .scene-shade{background:linear-gradient(#5e958677,transparent 38%,#2a65530d 60%,#133d3be6);z-index:0}.group-stage::before{content:"";position:absolute;inset:0;background:url(assets/river.webp) center/cover;filter:blur(8px) brightness(.6);transform:scale(1.1);z-index:-1}.group-stage>.scene-art{z-index:1}.arrival-stamp{top:83px;right:21px;width:50px;height:50px;font-size:10px;z-index:2}.photo-button{top:53%;font-size:11px;z-index:5;padding:10px 16px}.message{bottom:268px;width:82vw;font-size:11px;padding:12px 15px}.message span{font-size:8px}.response-select{bottom:209px;width:95vw;gap:6px;flex-wrap:nowrap}.response-select button{font-size:9px;padding:8px 9px;letter-spacing:0;white-space:nowrap}.final-quote{bottom:137px;font-size:17px;width:85vw;line-height:1.9}.chapter-7 .chapter-actions{bottom:73px}.toast{max-width:88vw;font-size:11px;bottom:40px;white-space:normal;text-align:center}}
@media(max-width:360px){.page-shell{padding:0}.topbar{padding:0 17px;height:70px}.wordmark{font-size:17px}.wordmark small{font-size:5px}.header-actions{gap:13px}.quiet-button{font-size:8px}.story-panel h1{font-size:42px;top:21%;letter-spacing:4px}.story-panel .subtitle{font-size:10px;top:39%}.chapter-kicker{top:85px;left:20px}.story-panel h2{top:116px;left:20px;font-size:23px}.story-panel .dialogue{font-size:11px}.chapter-1 .choices{top:49%;gap:8px}.chapter-1 .choice{padding:9px 12px}.choice-title{font-size:15px}.chapter-1 .selection-reply{bottom:122px;font-size:11px}.chapter-1 .chapter-actions{left:67%}.story-copy{font-size:11px}.chapter-0 .story-copy{top:175px}.speed-controls{top:166px;left:20px}.chapter-3 .story-copy,.chapter-6 .story-copy{bottom:140px;font-size:11px}.rhythm-zone,.game-controls .primary-button{top:57%;left:69%}.rhythm-zone,.tap-pad,.game-controls .primary-button{width:76px;height:76px}.beat-info{left:-145px;width:130px;font-size:8px}.beat-feedback{font-size:11px}.boat-sprite{top:23%}.replay-controls{bottom:229px}.chapter-4 .dialogue{bottom:130px;min-height:75px}.recorded{top:165px}.chapter-4 .stage-tag{top:170px}.chapter-4 .story-copy{top:29%;font-size:10px}.drag-hint{top:62%}.chapter-4 .people-tabs .person-button{top:44%}.message{bottom:245px}.response-select{bottom:190px;gap:4px}.response-select button{padding:7px;font-size:8px}.final-quote{bottom:128px;font-size:15px}.photo-button{top:51%;font-size:10px}.chapter-7 .stage>.scene-art{top:21%}.chapter-7 .chapter-actions{bottom:67px}.chapter-6 .speed-controls{top:204px}.cue-switch{top:200px;right:20px}.race-voice{top:33%;font-size:15px}.stage-tag{top:166px}.montage{top:33%}.chapter-5 .choice{top:52%;padding:10px 11px}.chapter-5 .choice:last-child{top:65%;right:5%}.chapter-5 .choice-title{font-size:14px}}
@media(max-height:700px) and (min-width:361px) and (max-width:799px){.topbar{height:67px}.chapter-kicker{top:80px}.story-panel h2{top:112px;font-size:24px}.speed-controls{top:162px}.chapter-4 .recorded{top:160px}.chapter-4 .stage-tag{top:165px}.replay-controls{bottom:222px}.chapter-4 .dialogue{bottom:129px;min-height:69px}.chapter-4 .story-copy{top:29%;font-size:10px}.chapter-1 .choices{top:49%;gap:8px}.chapter-1 .choice{padding:9px 12px}.cover-start{top:62%;width:62px;height:62px}.handle-caption{top:76px}.cover-start small{top:103px}.message{bottom:240px}.response-select{bottom:185px}.final-quote{bottom:126px;font-size:16px}.chapter-7 .stage>.scene-art{top:20%}.photo-button{top:51%}.chapter-6 .speed-controls{top:196px}.cue-switch{top:193px}.stage-tag{top:160px}.story-panel .subtitle{top:40%;font-size:10px}.chapter-3 .story-copy,.chapter-6 .story-copy{font-size:11px}.rhythm-zone,.game-controls .primary-button{top:57%}.boat-sprite{top:23%}}
@media(prefers-reduced-motion:reduce){.scene-art,.stage.train-stage .scene-art,.cover-start,.hotspot::after,.water-drop,.stroke .boat-sprite{animation:none!important}.discovery-boat.revealed{animation:none;left:27%}}
@media(max-width:799px){body[data-scene="-1"] .story-panel h1{top:14%;font-size:46px;line-height:1.25}body[data-scene="-1"] .story-panel>.eyebrow{top:11%;font-size:8px;letter-spacing:2px}body[data-scene="-1"] .story-panel .subtitle{top:30%;font-size:10px;letter-spacing:1px;width:88vw}body[data-scene="-1"] .cover-start{left:64%;top:60%}}
@media(max-width:360px){body[data-scene="-1"] .story-panel h1{font-size:40px;top:15%}body[data-scene="-1"] .story-panel .subtitle{top:31%;font-size:9px}body[data-scene="-1"] .story-panel>.eyebrow{top:12%}}
.discovery-boat.revealed{animation:boat-arrive-safe 2s ease-out both}
@keyframes boat-arrive-safe{from{transform:translateX(-35px);opacity:0}to{transform:translateX(0);opacity:1}}
@media(min-width:800px){.discovery-boat{width:min(48vw,64svh);left:calc(50% - min(24vw,32svh))}}
@media(max-width:799px){.chapter-7 .stage>.scene-art{top:23%}.chapter-7 .photo-button{top:57%}.chapter-7 .message{bottom:245px}.chapter-7 .story-panel h2{top:129px}}
@media(max-height:700px) and (max-width:799px){.chapter-7 .stage>.scene-art{top:25%}.chapter-7 .photo-button{top:53%}.chapter-7 .message{bottom:235px}.chapter-7 .story-panel h2{top:113px}}

.progress-dots button::after{inset:-12px}
