/* 主题约会 · 沉浸式连续旅程增强层 */
.topbar-motion{flex:0 0 auto}.topbar-motion[aria-pressed="true"]{border-color:var(--mint);color:var(--mint)}
.story-screen[data-journey-step="2"] .scene,.story-screen[data-journey-step="3"] .scene{transform:scale(1.025) translateX(-.7%)}.story-screen[data-journey-step="4"] .scene,.story-screen[data-journey-step="5"] .scene{transform:scale(1.05) translateX(-1.4%)}.story-screen .scene{transition:transform 1.2s cubic-bezier(.2,.7,.2,1),opacity .55s ease}
.reduced-motion .story-screen .scene{transition:none!important}
@media (prefers-reduced-motion:reduce){.story-screen .scene{transition:none!important}}

/* V2.1 · 已确认关键帧驱动的演绎层 */
.date-poster{
  border:0;
  background:
    linear-gradient(180deg,transparent 54%,rgba(4,5,9,.88) 100%),
    url("./assets/keyframes/queue.png") center/cover no-repeat;
  background-position:center,82% center;
  box-shadow:0 28px 70px rgba(0,0,0,.42);
}
.date-poster::before{background:linear-gradient(90deg,rgba(255,255,255,.08),transparent 24%,transparent 78%,rgba(255,255,255,.06))}
.story-keyframe{
  position:absolute;
  inset:-2%;
  width:104%;
  height:104%;
  object-fit:cover;
  object-position:center;
  transform:scale(1.02);
  transition:opacity .48s ease,transform 5s ease;
}
.story-screen.active .story-keyframe{transform:scale(1.045)}
.story-screen .scene::after{
  position:absolute;
  inset:0;
  width:auto;
  content:"";
  background:linear-gradient(180deg,rgba(4,5,8,.06) 0 48%,rgba(4,5,8,.7) 86%,rgba(4,5,8,.9));
  pointer-events:none;
}
#app[data-world-state="story"] .brand,
#app[data-world-state="story"] .date-hud{display:none!important}
#app[data-world-state="story"] .topbar{background:linear-gradient(180deg,rgba(4,5,8,.42),transparent);backdrop-filter:none}
#advWrap.wq-dialogue-readability::before,
#interactionNarrative.wq-dialogue-readability::before{display:none!important}
#app.cinematic-keyframe .topbar,
#app.cinematic-keyframe .adv-wrap,
#app.cinematic-keyframe .choice-panel,
#app.cinematic-keyframe .scene-action{opacity:0;pointer-events:none}

.interaction-backdrop{
  background:
    linear-gradient(90deg,rgba(5,6,10,.74) 0 38%,rgba(5,6,10,.22) 65%,rgba(5,6,10,.34)),
    linear-gradient(180deg,transparent 50%,rgba(5,6,10,.72)),
    url("./assets/keyframes/fox-permission.png") center/cover no-repeat;
  transition:transform .8s cubic-bezier(.2,.7,.2,1);
}
.interaction-screen.is-close .interaction-backdrop{transform:scale(1.035)}
.interaction-screen[data-interaction-step="0"] .interaction-backdrop{
  background:
    linear-gradient(90deg,rgba(5,6,10,.74) 0 38%,rgba(5,6,10,.22) 65%,rgba(5,6,10,.34)),
    linear-gradient(180deg,transparent 50%,rgba(5,6,10,.72)),
    url("./assets/keyframes/fox-permission.png") center/cover no-repeat;
}
.interaction-screen[data-interaction-step="1"] .interaction-backdrop{
  background:
    linear-gradient(90deg,rgba(5,6,10,.74) 0 38%,rgba(5,6,10,.22) 65%,rgba(5,6,10,.34)),
    linear-gradient(180deg,transparent 50%,rgba(5,6,10,.72)),
    url("./assets/keyframes/fitting.png") center/cover no-repeat;
}
.interaction-screen[data-interaction-step="2"] .interaction-backdrop{
  background:
    linear-gradient(90deg,rgba(5,6,10,.74) 0 38%,rgba(5,6,10,.22) 65%,rgba(5,6,10,.34)),
    linear-gradient(180deg,transparent 50%,rgba(5,6,10,.72)),
    url("./assets/keyframes/fitting.png") center/cover no-repeat;
}
.interaction-brief{left:var(--narrative-left);top:50%;width:min(470px,42vw);transform:translateY(-50%);padding:24px;background:rgba(8,8,12,.78)}
.interaction-screen.is-briefing .interaction-backdrop{filter:saturate(.84) brightness(.82)}

.camera-frame{
  background:
    linear-gradient(180deg,transparent 58%,rgba(5,6,10,.56)),
    url("./assets/keyframes/complete.png") center/cover no-repeat;
}
.camera-screen[data-camera-beat="5"] .camera-frame,
.camera-screen[data-camera-beat="6"] .camera-frame{
  background:
    linear-gradient(180deg,transparent 58%,rgba(5,6,10,.56)),
    url("./assets/keyframes/camera-smile.png") center/cover no-repeat;
}
.camera-frame::before{z-index:4;pointer-events:none}
.heart-frame{z-index:5}
.camera-copy,.countdown,.flash{z-index:8}
.result-photo{overflow:hidden;background:#08090d}
.result-keyframe{
  position:absolute;
  inset:5%;
  background:
    linear-gradient(180deg,transparent 58%,rgba(5,6,10,.42)),
    url("./assets/keyframes/camera-smile.png") center/cover no-repeat;
  background-position:center,68% center;
  box-shadow:0 28px 70px rgba(0,0,0,.48);
}
.result-photo>small{z-index:2}

@media(max-width:1000px),(max-height:560px){
  .date-poster{right:4vw;width:48vw}
  .story-keyframe{inset:0;transform:none}
  .story-screen.active .story-keyframe{transform:scale(1.025)}
  .story-screen[data-presentation="queue"] .story-keyframe{object-position:center}
  .story-screen[data-presentation="close"] .story-keyframe{object-position:58% center}
  .story-screen[data-presentation="fitting"] .story-keyframe,
  .story-screen[data-presentation="complete"] .story-keyframe{object-position:center}
  .interaction-brief{left:max(20px,var(--safe-l));width:min(430px,54vw);padding:18px}
  .result-keyframe{inset:3%}
}
@media(prefers-reduced-motion:reduce){
  .story-keyframe,.interaction-backdrop{transition:none!important}
}