/* Third act only. Full native 941×1672 compositions; the camera owns intentional zooms. */
body:has(#theatre.journey-story-mode){padding:0;overflow:hidden}
.journey-story-mode{width:min(100vw,calc(100dvh * 941 / 1672),480px);height:auto;aspect-ratio:941/1672;max-height:100dvh;background:#181b12}
.journey-story-mode #app{position:absolute;inset:0;padding:0;display:block;overflow:hidden}
.journey-story-mode #scene-footer,.journey-story-mode .background-fx{display:none!important}
.journey-story-mode .mini-brand{visibility:hidden}.journey-story-mode .topbar{top:3%;z-index:25;pointer-events:none}.journey-story-mode .topbar>button{pointer-events:auto}.journey-story-mode .topbar>button:first-child{display:none}.journey-story-mode .sound-btn{width:8cqw;height:8cqw;background:#262519df;border-color:#c3a46b;box-shadow:none}.journey-story-mode .music-note{font-size:4.5cqw}
.s3-journey{position:absolute;inset:0;isolation:isolate;overflow:hidden;background:#161a12;color:#f6e4bd;touch-action:none;user-select:none;-webkit-user-select:none;container-type:inline-size}
.s3-journey [hidden]{display:none!important}.j-space{position:absolute;width:390px;height:844px;transform-origin:0 0;overflow:hidden}.j-camera{position:absolute;inset:0;transform-origin:0 0;will-change:transform}
.j-background-layer,.j-foreground-layer{position:absolute;inset:0;pointer-events:none}.j-background-layer{z-index:0}.j-bg,.j-foreground{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:fill;pointer-events:none;-webkit-user-drag:none}.j-bg:not(.j-bg-room){opacity:0}
.j-light-layer{position:absolute;left:0;top:0;width:390px;height:540px;transform-origin:0 0;pointer-events:none;z-index:2;opacity:0;mix-blend-mode:screen;background:radial-gradient(ellipse,#ffe7aa99 0%,#ffca6b55 30%,#df9f341c 57%,transparent 72%)}
.j-warrior-plane,.j-projection-layer{position:absolute;left:0;top:0;width:250px;height:406px;transform-origin:0 0;will-change:transform}.j-warrior-plane{z-index:4}.j-projection-layer{z-index:3;pointer-events:none;mix-blend-mode:multiply}.j-warrior-art,.j-shadow-art{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;display:block;pointer-events:none;-webkit-user-drag:none}.j-shadow-art{filter:brightness(.24) sepia(1) blur(1.5px)}
.j-warrior{position:absolute;inset:0;display:block;padding:0;margin:0;border:0;border-radius:0;background:transparent;box-shadow:none;touch-action:none;cursor:grab}.j-warrior:disabled{cursor:default;opacity:1}.j-warrior:focus-visible{outline:1px solid #f5d89d;outline-offset:8px}.j-warrior:hover,.j-warrior:active{background:transparent;transform:none}.is-dragging .j-warrior{cursor:grabbing;filter:drop-shadow(0 3px 4px #180e0844)}
.s3-journey[data-phase=DISCOVER] .j-warrior-art{animation:jGloss 3s ease-in-out infinite}
.j-foreground-layer{z-index:5}.j-front-room{clip-path:polygon(13% 62%,78% 68%,97% 55%,100% 100%,0 100%)}.j-front-box{clip-path:polygon(0 79%,100% 61.6%,100% 100%,0 100%)}.j-front-curtain{clip-path:polygon(0 74%,100% 74%,100% 100%,0 100%)}.j-front-water{clip-path:polygon(0 78%,100% 78%,100% 100%,0 100%)}
.j-curtain-target{position:absolute;z-index:6;left:145px;top:210px;width:170px;height:260px;border:1px dashed #fff0b08c;border-radius:48% 48% 8px 8px;color:#fff0bf;pointer-events:none;transition:background .2s,border-color .2s,box-shadow .2s;box-shadow:inset 0 0 32px #fff0bc12}.j-curtain-target i{position:absolute;inset:13px;border:1px solid #f8dc8b25;border-radius:48% 48% 2px 2px}.j-curtain-target span{position:absolute;left:0;right:0;bottom:16px;text-align:center;font:13px var(--serif);letter-spacing:2px;text-shadow:0 1px 3px #2f210c}.j-curtain-target.is-near{border-color:#fff3b5;background:#fce6a52b;box-shadow:0 0 25px #ffe5a65c,inset 0 0 30px #ffe8b334}
.j-tap-hint{position:absolute;left:0;top:0;z-index:8;white-space:nowrap;font:13px/1.4 var(--serif);color:#ffe3a8;text-shadow:0 1px 5px #190e05;pointer-events:none}.j-tap-hint i{display:inline-block;width:17px;height:17px;border:1px solid #ffe1a0;border-radius:50%;margin-right:6px;vertical-align:middle;box-shadow:0 0 12px #f9c56888;animation:jHint 2s ease-out infinite}
.j-heading{position:absolute;z-index:20;top:3.8%;left:7%;font:3.8cqw/1.6 var(--serif);letter-spacing:2px;color:#fbe3b7;text-shadow:0 2px 5px #100b04;pointer-events:none}.j-heading span{display:block;font:2.6cqw/1.6 var(--serif);letter-spacing:1px;color:#d0bb91}.j-loading{position:absolute;z-index:30;left:12%;right:12%;top:42%;padding:15px;text-align:center;background:#202319ed;border:1px solid #b19767;font:3.6cqw var(--serif);cursor:pointer}
.j-voice-layer{position:absolute;inset:0;z-index:6;pointer-events:none}.j-horn{position:absolute;top:21.5%;width:25.65%;height:42%;margin:0;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;color:#f4e0ad;pointer-events:auto;cursor:pointer;touch-action:manipulation;isolation:isolate}.j-horn-north{left:4.1%}.j-horn-haining{right:4.1%}.j-horn:hover,.j-horn:active{background:transparent;transform:none}.j-horn:focus-visible{outline:1px solid #f6d691;outline-offset:2px}.j-horn-glow{position:absolute;inset:0 -8px -8px;z-index:-1;border-radius:45% 45% 10px 10px;background:radial-gradient(ellipse at 50% 24%,#ffd56c55,transparent 67%);border:1px solid transparent;opacity:0;transition:opacity .25s,border-color .25s,box-shadow .25s}.j-horn.is-near .j-horn-glow,.j-horn.is-playing .j-horn-glow{opacity:1;border-color:#ffe2a49c;box-shadow:0 0 20px #ffc95a70}.j-horn.is-correct .j-horn-glow{opacity:1;border-color:#fce9a8;box-shadow:0 0 25px #ffe6a3cc;background:radial-gradient(ellipse,#ffd77866,transparent 75%)}.j-horn.is-wrong .j-horn-glow{opacity:1;border-color:#e99b6c;background:#c7652929;animation:jWrong .35s ease-in-out 2}
.j-horn-name{position:absolute;top:44%;left:0;right:0;margin:auto;writing-mode:vertical-rl;width:1.2em;font:17px/1.2 var(--serif);letter-spacing:4px;text-shadow:0 1px 2px #000}.j-horn-note{position:absolute;left:0;right:0;bottom:5px;font:8px/1.4 var(--serif);letter-spacing:1px;color:#ddc99c;text-shadow:0 1px 3px #15130b}.j-volume{position:absolute;top:81%;left:0;right:0;margin:auto;display:grid;place-items:center;width:23px;height:23px;border:1px solid #d2b26d;border-radius:50%;font:20px Georgia}.j-sound-wave{position:absolute;display:flex;align-items:center;gap:3px;justify-content:center;left:0;right:0;top:15%;height:22px;opacity:0}.j-sound-wave i{width:2px;height:7px;background:#ffe3a1;box-shadow:0 0 6px #ffcb60;transform:scaleY(.5)}.j-horn.is-playing .j-sound-wave{opacity:1}.j-horn.is-playing .j-sound-wave i{animation:jSound .6s ease-in-out infinite alternate}.j-sound-wave i:nth-child(2){animation-delay:-.2s!important}.j-sound-wave i:nth-child(3){animation-delay:-.4s!important}.j-sound-wave i:nth-child(4){animation-delay:-.1s!important}.j-correct-mark{position:absolute;left:320px;top:338px;width:34px;height:34px;display:grid;place-items:center;border:1px solid #ffe7a4;border-radius:50%;background:#74622bd9;color:#fff0bb;font:24px Georgia;box-shadow:0 0 20px #ffda8666}
.j-subtitle-scrim{position:absolute;z-index:12;bottom:0;left:0;right:0;height:20%;pointer-events:none;background:linear-gradient(transparent,#10170c88 50%,#0e130ce8)}.j-subtitle{position:absolute;z-index:22;left:7%;right:7%;bottom:4.2%;min-height:10%;display:flex;align-items:center;justify-content:center;padding:3% 6%;box-sizing:border-box;background:linear-gradient(110deg,#1c2922dc,#1f2b23e8 70%,#29352bd9);border:1px solid #b39762a3;border-radius:2px;box-shadow:0 3px 16px #0c0f0a55;pointer-events:none}.j-subtitle:before,.j-subtitle:after{content:'';position:absolute;width:9px;height:9px;border:1px solid #e2c990;transform:rotate(45deg);background:#34402a}.j-subtitle:before{left:-5px;top:calc(50% - 5px)}.j-subtitle:after{right:-5px;top:calc(50% - 5px)}.j-subtitle p{margin:0;white-space:pre-line;text-align:center;font:3.5cqw/1.9 var(--serif);letter-spacing:.5px;text-shadow:0 1px 3px #0b1309;color:#f8e8c7}
.j-recording-status{position:absolute;z-index:23;left:7%;right:7%;bottom:24%;margin:0;text-align:center;font:2.6cqw/1.5 var(--serif);letter-spacing:.5px;color:#ffe3ac;text-shadow:0 1px 4px #100b04;pointer-events:none}
.j-preview-enable,.j-next{position:absolute;z-index:25;left:20%;right:20%;bottom:17%;min-height:38px;padding:8px 14px;border:1px solid #d7b477;border-radius:2px;box-shadow:inset 0 0 0 3px #b58b4930,0 4px 14px #10130988;background:linear-gradient(110deg,#64402a,#825430);font:3.2cqw/1.5 var(--serif);letter-spacing:1px;color:#ffebc4;cursor:pointer}.j-preview-enable span,.j-next span{float:right;margin-left:8px}.j-next{left:22%;right:22%;background:linear-gradient(110deg,#663a21,#8a512d)}
.j-crossing-effects{position:absolute;inset:0;z-index:7;pointer-events:none;overflow:hidden}.j-passing-frame{position:absolute;inset:0;width:390px;height:844px;object-fit:fill;opacity:0;clip-path:polygon(0 0,17% 0,17% 100%,0 100%);mask-image:linear-gradient(to right,#000 12%,transparent 17%);transform-origin:0 0}.j-crossing-mist{position:absolute;left:-110px;width:650px;height:170px;opacity:0;background:radial-gradient(ellipse at 30% 50%,#ead9b4aa,transparent 62%),radial-gradient(ellipse at 78% 55%,#e7d6b2bb,transparent 60%);mix-blend-mode:screen}.j-mist-far{top:370px;height:120px}.j-mist-near{top:555px}.j-crossing-wash{position:absolute;left:0;top:150px;width:220px;height:525px;opacity:0;mix-blend-mode:screen;background:linear-gradient(100deg,transparent 15%,#f8d49040 40%,#ffe3a990 55%,transparent 85%)}.j-river-sheen{position:absolute;left:0;top:505px;width:390px;height:150px;color:#fff2c2;opacity:0;mask-image:radial-gradient(ellipse at 55% 65%,#000,transparent 64%)}.j-river-sheen svg{width:100%;height:100%}.s3-journey[data-phase=WATER_REVEAL] .j-river-sheen svg{animation:jRiverShimmer 3.8s ease-in-out infinite alternate}.fx-paused .j-crossing-effects *{animation:none!important}
@keyframes jRiverShimmer{from{transform:translateX(4px);opacity:.5}to{transform:translateX(-8px);opacity:1}}
@keyframes jGloss{0%,100%{filter:drop-shadow(0 0 1px #fbd58622)}50%{filter:drop-shadow(0 0 6px #ffda7788)}}@keyframes jHint{0%{transform:scale(.75);opacity:.9}100%{transform:scale(1.5);opacity:.15}}@keyframes jSound{to{transform:scaleY(2.5)}}@keyframes jWrong{25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}
@media(prefers-reduced-motion:reduce){.s3-journey *{animation:none!important;transition:none!important}}
