/* Cinematic chapter layout. Artwork stays separate from accessible controls. */
.jr-shell{width:100%;max-width:none;min-height:100dvh;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(300px,1fr) auto;padding:14px 20px max(16px,env(safe-area-inset-bottom));overflow:hidden;box-shadow:none}
.jr-header{grid-area:1/1;max-width:1400px;position:relative;top:auto;padding:0 0 10px;z-index:6}
.jr-header>span{font-size:18px}.jr-header>span small{font-size:12px;letter-spacing:3px}
.jr-header button{font-size:14px;min-height:44px;padding:10px 14px;background:#05101b99}
.jr-place{position:absolute;top:93px;left:24px;text-align:left;padding:0!important;z-index:3;max-width:240px}
.jr-place>span{font-size:12px!important;letter-spacing:2px!important;color:#d8d2c4}
.jr-place>p{font-size:16px!important;letter-spacing:4px;margin:6px 0!important}
.jr-world-image{inset:-6%;width:112%;height:112%;filter:brightness(.62) saturate(.8);object-position:50% 40%}
.jr-world:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#07111d55,transparent 20%,transparent 46%,#05101bc7 81%,#05101b),linear-gradient(90deg,#04101a4d,transparent 60%)}
.jr-dialog:not([data-phase="0"]) .jr-world-image{transform:scale(1.075) translateY(-1%);filter:brightness(.75) saturate(1)}
.jr-dialog[data-phase="2"] .jr-world-image,.jr-dialog[data-phase="3"] .jr-world-image{transform:scale(1.13) translateY(-1.5%)}
.jr-stage{grid-area:2/1;position:relative;width:100%;height:100%;min-height:310px;align-self:stretch;isolation:isolate;pointer-events:none;overflow:visible}
.jr-stage-canvas{display:block;position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.jr-actor-fallback{position:absolute;inset:-5% 0 -2%;margin:auto;width:clamp(190px,50%,330px);height:100%;mask-image:linear-gradient(#000 78%,transparent 100%);-webkit-mask-image:linear-gradient(#000 78%,transparent 100%);transition:opacity .4s;transform-origin:50% 90%;animation:jc-breathe 7s ease-in-out infinite}
.jr-actor-pose{position:absolute;inset:0;background-size:400% 100%;background-repeat:no-repeat;opacity:0;transition:opacity .7s;filter:drop-shadow(0 0 20px #77929b33)}
.jr-dialog[data-phase="0"] [data-pose="0"],.jr-dialog[data-phase="1"] [data-pose="1"],.jr-dialog[data-phase="2"] [data-pose="2"],.jr-dialog[data-phase="3"] [data-pose="3"]{opacity:1}
.jr-actor-ready .jr-actor-fallback{opacity:0}
.jr-dialog:has(.jr-gpu-ready) .jr-fan,.jr-dialog:has(.jr-gpu-ready) .jr-art,.jr-dialog:has(.jr-gpu-ready) .jr-stars{visibility:hidden}
.jr-playfield,.jr-dialog[data-phase="0"] .jr-playfield{grid-area:2/1;align-self:end;min-height:150px!important;height:180px;width:min(100%,460px);z-index:4;margin:0 auto 0;pointer-events:none}
.jr-playfield button{pointer-events:auto}
.jr-touch{width:100%;height:205px!important;margin-top:-36px;position:relative;border-radius:35%;outline-offset:-12px!important}
.jr-touch-label{bottom:16px;font-size:14px;letter-spacing:.6px;padding:8px 9px;margin:0 auto;width:max-content;max-width:100%;background:#04111dbd;border:1px solid #d6c3a126;border-radius:30px;backdrop-filter:blur(12px)}
.jr-touch-track{bottom:4px;height:3px;left:25%;right:25%;border-radius:5px;overflow:hidden}
.jr-dialogue{grid-area:3/1;width:min(100%,630px);margin:0 auto;padding:19px 22px 0;background:linear-gradient(145deg,#1a2934e8,#07121eed);border:1px solid #d4c6a840;border-bottom:1px solid #d4c6a822;border-radius:8px 8px 24px 8px;box-shadow:inset 0 1px #fff1,0 22px 60px #0009;z-index:5}
.jr-speaker{position:relative;display:flex;gap:10px;align-items:center;margin:-34px 0 14px;width:max-content;max-width:100%;padding:7px 16px;background:linear-gradient(110deg,#d5b786,#f0d9a8);border:1px solid #fff0ce;box-shadow:0 3px 0 #665234,0 8px 25px #0005;color:#162630;border-radius:2px 2px 12px 2px;font-size:12px}
.jr-speaker-name{font:500 19px/1.5 var(--f-display,serif);letter-spacing:3px}.jr-speaker>i{width:4px;height:4px;border:1px solid #6e5833;transform:rotate(45deg);margin-left:10px}
.jr-eyebrow{font-size:12px;margin:0 0 5px;letter-spacing:1.6px}
.jr-text h2{font-size:clamp(23px,3vw,34px);line-height:1.48;margin:0 0 9px;font-weight:400;letter-spacing:1px}
.jr-text p{font-size:16px!important;line-height:1.7;color:#d5dce3;min-height:0}
.jr-question{font-size:14px;margin:10px 0;line-height:1.65}.jr-question p{max-height:76px}
.jr-hint{font-size:14px;min-height:0;line-height:1.6;margin:10px 0}.jr-hint:empty{display:none}
.jr-intent{display:flex;gap:9px;margin:14px 0 17px}.jr-intent button{flex:1;min-height:43px;padding:8px 10px;border:1px solid #9cabb44d;border-radius:4px;background:#0813217a;color:#ced6df;font-size:14px;line-height:1.45}
.jr-intent button[aria-pressed=true]{background:#dbbf8930;border-color:#cfbb92;color:#ffebc5;box-shadow:inset 0 1px #ffffff19}
.jr-next{min-height:50px;padding:12px 14px;border-radius:4px 4px 14px 4px;font-size:16px;letter-spacing:.7px}
.jr-footer{padding:9px 0 8px;gap:10px}.jr-footer ol{font-size:12px;letter-spacing:.4px;gap:10px}.jr-skip{font-size:14px;min-height:44px}
.jr-seals{height:100%;gap:10px;padding:0;align-items:flex-end;margin-bottom:28px}
.jr-seal{max-width:92px;min-height:110px;padding:14px 8px;gap:12px;border-radius:4px;background:linear-gradient(#10223388,#061421df);backdrop-filter:blur(5px)}
.jr-seal span{font-size:24px}.jr-seal small{font-size:12px}.jr-dialog:has(.jr-gpu-ready) .jr-seal{min-height:70px;max-width:62px;margin-bottom:2px;border-radius:4px 4px 16px 4px;transform:none}
.jr-dialog[data-ritual=compat] .jr-seal{min-height:100px;max-width:120px;border-radius:50px 50px 5px 5px}
.jr-dialog:has(.jr-gpu-ready)[data-ritual=compat] .jr-seal{min-height:72px;max-width:98px;border-radius:4px 4px 16px 4px;transform:none}
.jr-reveal-row{padding:0 8px 14px;gap:18px;align-items:flex-end;transform:translateY(-5px)}
.jr-reveal{max-width:102px!important;filter:drop-shadow(0 8px 14px #0009)}.jr-card-label{font-size:14px;letter-spacing:0;margin:7px -8px 0;color:#f5e4c7}
.jr-flip{border-radius:6px;box-shadow:1px 2px 0 #e7c48a,3px 4px 0 #142c39,4px 5px 0 #95784e,0 16px 32px #000b}
.jr-dialog[data-phase="2"] .jr-flash{animation:jc-light-bloom 1.9s ease-out both}
.jr-dialog[data-phase="3"] .jr-touch-label{opacity:0}
.jr-dialog:has(.jr-gpu-ready) .jr-dust{opacity:.2}
@keyframes jc-breathe{0%,100%{transform:translateY(0) rotate(-.3deg)}50%{transform:translateY(-5px) rotate(.3deg)}}
@keyframes jc-light-bloom{0%{opacity:0;transform:scale(.4)}35%{opacity:.32}100%{opacity:0;transform:scale(1.4)}}
@media(min-width:850px){
 .jr-shell{grid-template-columns:minmax(420px,1.25fr) minmax(360px,.85fr);grid-template-rows:auto 1fr;padding:22px max(35px,calc((100vw - 1440px)/2));gap:0 15px}
 .jr-header{grid-area:1/1/2/3;max-width:none;padding-bottom:0}
 .jr-place{top:108px;left:max(38px,calc((100vw - 1440px)/2));max-width:300px}
 .jr-stage{grid-area:2/1;min-height:590px;height:calc(100dvh - 100px)}
 .jr-playfield,.jr-dialog[data-phase="0"] .jr-playfield{grid-area:2/1;margin-bottom:clamp(18px,6vh,75px);height:210px;max-width:440px}
 .jr-dialogue{grid-area:2/2;align-self:center;max-width:470px;padding:29px 30px 9px;margin:30px 0 25px}
 .jr-speaker{margin-top:-46px;margin-bottom:24px}.jr-text h2{margin-bottom:18px}.jr-text p{line-height:1.9}.jr-intent{margin:24px 0}.jr-hint{margin:18px 0}.jr-next{min-height:58px}.jr-footer{padding-top:18px}
 .jr-world:after{background:linear-gradient(90deg,#07111d33,transparent 25%,#05101b96 65%,#05101be8),linear-gradient(180deg,#05101b66,transparent 30%,#05101b7d)}
 .jr-world-image{object-position:45% 52%}.jr-stage .jr-actor-fallback{max-width:340px;width:49%;height:87%;top:4%}
 .jr-touch{height:240px!important}.jr-reveal{max-width:125px!important}.jr-reveal-row{gap:25px}
}
@media(max-width:380px){.jr-shell{padding-left:12px;padding-right:12px}.jr-dialogue{padding-left:17px;padding-right:17px}.jr-header button{padding:8px 10px}.jr-intent{gap:7px}.jr-footer ol{gap:6px}.jr-place{left:17px}.jr-stage{min-height:290px}.jr-reveal-row{gap:13px}}
@media(max-height:700px) and (max-width:849px){.jr-stage{min-height:285px}.jr-shell{grid-template-rows:auto minmax(285px,1fr) auto}.jr-dialogue{padding-top:16px}.jr-text h2{font-size:23px}.jr-speaker{margin-top:-30px;margin-bottom:9px}.jr-intent{margin:10px 0 13px}.jr-place{top:86px}}
@media(prefers-reduced-motion:reduce){.jr-actor-fallback,.jr-dialog *{animation:none!important;transition:none!important}.jr-world-image{transform:none!important}.jr-flash{display:none!important}}

/* The same cast accompanies the entrance, preparation, and result screens. */
.jy-atelier [hidden]{display:none!important}
.jy-atelier .jc-home-hero{background:linear-gradient(90deg,#06101bcc,#06101b22 52%,#06101b77),url('../assets/ui/ritual-moon-sanctum.webp') 58% 40%/cover;min-height:650px;border:1px solid #d9c7a633;border-radius:4px 4px 36px 4px;margin-top:24px;padding:50px 36px 40px;overflow:hidden;box-shadow:0 28px 85px #0006,inset 0 1px #f4debe18}
.jy-atelier .jc-home-hero .at-hero-art{width:100%;margin:0;min-height:500px;position:relative;z-index:1;isolation:isolate}
.jc-home-stage{position:absolute;inset:-30px -35px 10px;width:calc(100% + 70px);height:calc(100% + 20px);isolation:isolate}
.jc-home-stage .jr-actor-fallback{width:54%;max-width:300px;height:96%;top:0;bottom:0}.jc-home-caption{position:absolute;left:5%;right:0;bottom:5px;text-align:center;padding:12px 10px 0;text-shadow:0 2px 15px #000}
.jc-home-caption>span{font:500 22px/1.5 var(--f-display,serif);color:#f0d3a3;letter-spacing:2px}.jc-home-caption small{font:400 12px/1.5 var(--f-body,sans-serif);letter-spacing:1px;color:#c2cbd6}.jc-home-caption p{font-size:14px;line-height:1.7;color:#d2d8df;margin:5px 0}
.jy-atelier .jc-home-hero .at-hero-seal{display:none}.jy-atelier .jc-home-hero h1{font-size:clamp(36px,4.4vw,60px)}
.jy-atelier .jc-home-hero .at-primary{min-height:60px;box-shadow:inset 0 1px #fff8,0 5px 0 #836442,0 18px 36px #0009;letter-spacing:1px}
.jy-atelier .at-tool{isolation:isolate;transform-style:preserve-3d;transition:transform .35s,border-color .35s,box-shadow .35s!important;border-radius:5px 5px 25px 5px!important;overflow:hidden}
.jy-atelier .at-tool:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#04111b44,#04111bdb 70%),url('../assets/ui/ritual-moon-sanctum.webp') center 40%/cover;opacity:.42;transition:opacity .5s;pointer-events:none}
.jy-atelier .at-tool:is([data-tool=bazi],[data-tool=compat],[data-tool=ziwei]):before{background-image:linear-gradient(180deg,#04111b33,#04111bdd 70%),url('../assets/ui/ritual-celestial-observatory.webp')}
.jy-atelier .at-tool:is([data-tool=lenormand],[data-tool=meihua],[data-tool=oracle]):before{background-image:linear-gradient(180deg,#04111b33,#04111bdd 70%),url('../assets/ui/ritual-moon-garden.webp')}
.jy-atelier .at-tool:hover:before{opacity:.8}.jy-atelier .at-tool .at-art{transition:transform .5s,filter .5s}.jy-atelier .at-tool:hover .at-art{transform:translateY(-6px) scale(1.05);filter:drop-shadow(0 12px 20px #0008)}
.jy-atelier .at-tool:focus-visible{outline:2px solid #f6dcaa;outline-offset:5px}
.jy-atelier .jc-room-header{--jc-room:url('../assets/ui/ritual-moon-sanctum.webp');position:relative;display:block!important;min-height:255px!important;isolation:isolate;border-bottom:1px solid #d3bea547;margin:14px 0 27px!important;padding:28px 150px 18px 18px!important;overflow:hidden;box-shadow:0 18px 55px #0002;border-radius:4px 4px 24px 4px}
.jy-atelier .jc-room-header:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#07131bec,#07131b77),var(--jc-room) center 45%/cover}
.jy-atelier .jc-room-header:is([data-chapter=bazi],[data-chapter=compat],[data-chapter=ziwei]){--jc-room:url('../assets/ui/ritual-celestial-observatory.webp')}
.jy-atelier .jc-room-header:is([data-chapter=lenormand],[data-chapter=meihua],[data-chapter=oracle]){--jc-room:url('../assets/ui/ritual-moon-garden.webp')}
.jy-atelier .jc-room-header>.at-art{display:none!important}.jy-atelier .jc-room-header>div:not(.jc-guide){position:relative;z-index:2}
.jy-atelier .jc-room-header h1{font-size:30px!important;line-height:1.55;letter-spacing:1px;margin:8px 0 10px!important}.jy-atelier .jc-room-header h1 br{display:none}
.jy-atelier .jc-room-header p{font-size:16px!important;line-height:1.7!important}.jy-atelier .jc-room-header .at-eyebrow{font-size:12px;letter-spacing:1.5px}
.jc-portrait{position:absolute;right:0;top:14px;bottom:-12px;width:143px;min-height:238px;mask-image:linear-gradient(#000 73%,transparent);-webkit-mask-image:linear-gradient(#000 73%,transparent);transform-origin:50% 90%;animation:jc-breathe 8s ease-in-out infinite;z-index:1}
.jc-portrait>span{position:absolute;inset:0;background-size:400% 100%;background-repeat:no-repeat;opacity:0;transition:opacity .7s}
.jc-portrait [data-jc-pose="0"]{opacity:1}.jc-room-header:is([data-guide-state=listening],:focus-within) .jc-portrait [data-jc-pose="0"]{opacity:0}.jc-room-header:is([data-guide-state=listening],:focus-within) .jc-portrait [data-jc-pose="1"]{opacity:1}
.jc-room-header[data-guide-state=result] .jc-portrait [data-jc-pose="0"],.jc-room-header[data-guide-state=result] .jc-portrait [data-jc-pose="1"]{opacity:0}.jc-room-header[data-guide-state=result] .jc-portrait [data-jc-pose="3"]{opacity:1}
.jc-guide-line{position:relative;z-index:2;margin-top:21px;padding-top:12px;border-top:1px solid #c4ad842b}.jc-guide-line>span{font:500 18px/1.6 var(--f-display,serif);color:#e7cc9a;letter-spacing:2px}.jc-guide-line small{font:400 12px/1.6 var(--f-body,sans-serif);color:#b2c1ca;letter-spacing:.3px}.jy-atelier .jc-guide-line p{display:none}
.jy-atelier .at-input-head.jc-room-header{padding-top:86px!important;min-height:320px!important}.jy-atelier .at-input-head.jc-room-header>.at-back{position:absolute;top:20px;left:18px;z-index:3}.at-input-head.jc-room-header .jc-portrait{top:78px}
.jc-flow{margin:0 0 18px;color:#e7d7b5}.jc-flow-steps{display:flex;gap:4px;border-bottom:1px solid #c5b79433;padding-bottom:16px}.jc-flow-steps button{flex:1;border:0;background:transparent;color:#a6b5c4;font:400 14px/1.5 var(--f-body,sans-serif);min-height:52px;display:flex;flex-direction:column;align-items:center;gap:7px;cursor:pointer;padding:0 4px}
.jc-flow-steps button b{font-weight:400;border:1px solid #a7b8c955;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;color:#d4c29f;font-size:13px}.jc-flow-steps button[aria-current=step]{color:#f1d4a2}.jc-flow-steps button[aria-current=step] b{background:#dec08e;color:#162431;border-color:#f5d9a7;box-shadow:0 0 22px #d4b57533}.jc-flow-status{font-size:12px;line-height:1.7;color:#bcc9d5;padding:12px 2px 0}
.jy-atelier .jc-pane{scroll-margin-top:110px;background:linear-gradient(150deg,#1c2b36ce,#0c1923e8)!important;border:1px solid #a9bec439!important;border-radius:5px 5px 24px 5px!important;box-shadow:inset 0 1px #fff1,0 18px 42px #0004!important}
.jc-flow-actions{display:flex;flex-wrap:wrap;gap:12px;margin:18px 0 24px}.jc-flow-actions button{cursor:pointer;font:500 16px/1.5 var(--f-body,sans-serif);padding:13px 22px;min-height:50px;border:1px solid #b2c3cc4d;border-radius:4px 4px 14px 4px;background:#182936;color:#d9e3e8}.jc-flow-actions .jc-continue{flex:1;background:linear-gradient(110deg,#f5dfb1,#d1b17d);border-color:#edd2a0;color:#15232c;box-shadow:0 4px #6e583c}.jc-flow-actions .jc-all{flex-basis:100%;font-size:14px;background:transparent;border:0;color:#b7c6d2;min-height:44px;padding:7px}
.jy-atelier .jc-room-header .bzx-suite-entry{font-size:14px!important;min-height:44px;margin-top:13px;padding:8px 10px!important}
@media(min-width:900px){.jy-atelier .jc-room-header{padding:36px 235px 27px 28px!important;min-height:285px!important}.jc-portrait{right:20px;width:200px}.jy-atelier .jc-room-header h1{font-size:36px!important}.jy-atelier .jc-room-header .jc-guide-line p{display:block;margin:6px 0 0;color:#acbdca!important;font-size:14px!important}.jy-atelier .at-input-head.jc-room-header{min-height:340px!important;padding-left:28px!important}.jy-atelier .at-input-head.jc-room-header>.at-back{left:28px}}
@media(max-width:700px){.jy-atelier .jc-home-hero{margin-top:14px;padding:25px 16px 28px;min-height:0;background:linear-gradient(#04101b8a,#04101b44 45%,#04101be0),url('../assets/ui/ritual-moon-sanctum.webp') center 35%/cover;border-radius:4px 4px 30px 4px}.jy-atelier .jc-home-hero .at-hero-art{width:100%;margin:-15px 0 0;aspect-ratio:auto;min-height:330px;height:39svh;max-height:390px}.jc-home-stage{inset:-12px -20px 15px;width:calc(100% + 40px);height:calc(100% - 3px)}.jc-home-caption{left:0;bottom:8px}.jc-home-caption p{font-size:12px}.jy-atelier .jc-home-hero .at-hero-copy{z-index:2}.jy-atelier .jc-home-hero .at-hero-copy p{font-size:16px}.jy-atelier .jc-home-hero .at-hero-actions{padding:5px 0 0}.jy-atelier .jc-home-hero h1{font-size:34px}.jc-home-stage .jr-actor-fallback{width:48%;max-width:190px;top:4%;height:90%}}
@media(max-width:380px){.jy-atelier .jc-room-header{padding-left:14px!important;padding-right:123px!important}.jc-portrait{width:118px;right:-3px}.jy-atelier .jc-room-header h1{font-size:26px!important}.jy-atelier .jc-room-header .at-eyebrow{font-size:12px;letter-spacing:.7px}.jc-guide-line small{display:block}.jc-flow-steps button{font-size:14px}.jc-home-caption p{max-width:245px;margin:4px auto}.jy-atelier .jc-home-hero .at-hero-art{min-height:310px}}
@media(prefers-reduced-motion:reduce){.jc-portrait,.jc-portrait>span,.jy-atelier .at-tool,.jy-atelier .at-tool .at-art{animation:none!important;transition:none!important}}
.jc-reading-close{margin:28px 0 20px;padding:26px 24px;border-top:1px solid #c9b18344;border-bottom:1px solid #c9b18333;background:linear-gradient(130deg,#16272f,#0a151f);border-radius:4px 4px 24px 4px;text-align:left}
.jc-close-label{font-size:12px;letter-spacing:3px;color:#b9c4cc}.jc-reading-close h3{font:400 24px/1.5 var(--f-display,serif);color:#ecd3a3;margin:12px 0}.jc-reading-close p{font-size:16px!important;line-height:1.85!important;color:#c5d0da!important}.jc-reading-close details{margin-top:20px;padding-top:16px;border-top:1px solid #a6b7c329;font-size:14px;line-height:1.8}.jc-reading-close summary{cursor:pointer;color:#d8c7a1;min-height:44px}.jc-reading-close a{display:inline-flex;align-items:center;min-height:46px;padding:10px 18px;background:#dec293;color:#14222c;border-radius:4px 4px 12px 4px;font-size:16px;text-decoration:none;box-shadow:0 3px #716046}
.jc-oracle-companion{position:relative;isolation:isolate;min-height:148px;padding:22px 132px 22px 20px;margin:0 0 24px;border:1px solid #b7ccb231;background:linear-gradient(120deg,#192e2dce,#07161cb8);border-radius:5px 5px 22px 5px;overflow:hidden;text-align:left}
.jc-oracle-companion .jc-portrait{width:114px;min-height:190px;top:-4px;right:7px}.jc-oracle-companion>div>span{font:400 19px/1.5 var(--f-display,serif);color:#e6d2a9}.jc-oracle-companion small{font:400 12px/1.5 var(--f-body,sans-serif);color:#b7c9c6}.jc-oracle-companion p{font-size:16px!important;line-height:1.7!important;color:#cfdbd8!important;margin:9px 0}
.jc-oracle-companion[data-guide-state=result] [data-jc-pose="0"]{opacity:0}.jc-oracle-companion[data-guide-state=result] [data-jc-pose="3"]{opacity:1}
