/* Intro flow v2. Everything is scoped to body[data-intro=v2]; ?intro=v1 restores the original look. */
.intro-cue{display:none}
body[data-intro=v2] .intro-cue{display:flex;justify-content:center;margin:-6px 0 14px;position:relative;z-index:2;padding-inline:6.7cqw}
body[data-intro=v2] .intro-cue-button{min-height:44px;padding:8px 22px;border:1px solid #edce8caa;border-radius:999px;background:#0b0905d9;color:#f5e2b8;font:600 15px/1.4 system-ui,sans-serif;letter-spacing:.06em;cursor:pointer;box-shadow:0 0 12px #b2985340}
body[data-intro=v2] .intro-cue[data-mode=first] .intro-cue-button::after{content:' ↓'}
body[data-intro=v2] .intro-cue[data-mode=returning] .intro-cue-button{background:#382d1cf0;border-color:#edce8c}
body[data-intro=v2] .presentation-stage video{animation:intro-in .35s ease-out}
@keyframes intro-in{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){body[data-intro=v2] .presentation-stage video{animation:none}}
/* PC: side-by-side top page, and the portrait clip is fitted (not cropped) during the motion. */
@media(min-width:960px){
 body[data-intro=v2][data-integration-state=input] #app{max-width:920px}
 body[data-intro=v2] #entry-screen:not([hidden]) .entry-stage{display:grid;grid-template-columns:auto 430px;gap:40px;align-items:center;justify-content:center;min-height:100svh;padding:20px 0}
 /* The approved title image has a baked mock form below the logo; keep the same 100:151.3 crop as mobile. */
 body[data-intro=v2] .entry-art{--art-w:min(430px,calc((100svh - 40px)/1.513));width:var(--art-w);height:calc(var(--art-w)*1.513);grid-row:1/3}
 body[data-intro=v2] .entry-art img{width:100%;height:auto}
 body[data-intro=v2] .intro-cue{display:none}
 body[data-intro=v2] .fortune-form{container-type:inline-size;padding:0;align-self:center;grid-row:1/3}
 body[data-intro=v2] #entry-screen>footer,body[data-intro=v2] #entry-screen>.demo-tools,body[data-intro=v2] #partial-result{max-width:860px;margin-inline:auto}
 body[data-intro=v2]:is([data-integration-state=loading],[data-integration-state=playing],[data-integration-state=paused],[data-integration-state=fallback]) .presentation-stage{height:calc(100svh - 150px)}
 body[data-intro=v2]:is([data-integration-state=loading],[data-integration-state=playing],[data-integration-state=paused],[data-integration-state=fallback]) .presentation-stage video{height:calc(100svh - 150px);width:auto;left:50%;transform:translateX(-50%)}
}
/* Ritual lines during the 7s clip (text only, no new assets). */
.intro-ritual{position:absolute;left:50%;transform:translateX(-50%);max-width:88%;white-space:nowrap;padding:6px 16px;border-radius:999px;background:#000000b3;top:58%;z-index:4;margin:0;text-align:center;font:500 17px/1.6 "Hiragino Mincho ProN","Yu Mincho",serif;letter-spacing:.18em;color:#f6e6c2;text-shadow:0 0 10px #000,0 0 22px #c99a4a88;opacity:0;transition:opacity .45s ease;pointer-events:none}
.intro-ritual[data-on="1"]{opacity:1}
body[data-intro=v1] .intro-ritual{display:none}
@media(min-width:960px){body[data-intro=v2] .intro-ritual{top:52%;font-size:14px;letter-spacing:.08em}}
@media(prefers-reduced-motion:reduce){.intro-ritual{transition:none}}
.intro-mute{display:none}body[data-intro=v2] .intro-mute{display:inline-flex;min-height:44px;margin:2px 0 4px;font-size:14px}.intro-sound-option{margin-top:4px}