/* Two golden wakes share the portrait's foreground and meet below its names. */
#story[data-couple-scene] .couple-garden{position:absolute;z-index:3;inset:0;overflow:hidden;pointer-events:none;contain:layout paint;opacity:clamp(0,calc(var(--couple-reveal,1)*1.2),1)}
#story[data-couple-scene] .couple-light-canvas{position:absolute;z-index:0;inset:0;display:block;width:100%;height:100%;pointer-events:none}
/* Slow roses gather into a heart interlocked with the existing golden one. */
#story[data-couple-scene] .couple-names{bottom:calc(10.5% + 56px)}
#story[data-couple-scene] .couple-petal-shower{position:absolute;z-index:1;inset:0;overflow:hidden;pointer-events:none;perspective:700px;mask-image:linear-gradient(to bottom,transparent 19%,#000 30%)}
#story[data-couple-scene] .couple-rose-petal{position:absolute;top:0;left:0;display:block;aspect-ratio:1;opacity:0;background:url('assets/couple-rose-petals-v81.webp') 0 0 / 300% 200% no-repeat;transform-origin:50% 52%;backface-visibility:visible;pointer-events:none}
#story[data-couple-scene] .couple-foil-ribbon{position:absolute;top:0;left:0;display:block;opacity:0;background:url('assets/couple-gold-ribbon.svg') center / 100% 100% no-repeat;transform-origin:50% 50%;backface-visibility:visible;pointer-events:none}
#story[data-couple-scene] .couple-portrait-fallback,#story[data-couple-scene] .story-art #story-photo{animation:couple-camera-breathe 22s ease-in-out infinite alternate paused;transform-origin:50% 50%}
#story[data-couple-scene][data-couple-motion="active"] .couple-portrait-fallback,#story[data-couple-scene][data-couple-motion="active"] .story-art #story-photo{animation-play-state:running}
@keyframes couple-camera-breathe{from{transform:scale(1)}to{transform:scale(1.012)}}
@media(max-width:699px){
  #story[data-couple-scene] .couple-names{bottom:calc(12% + 32px)}
}
@media(prefers-reduced-motion:reduce){
  #story[data-couple-scene] .couple-garden{display:none}
  #story[data-couple-scene] .couple-names{bottom:10.5%}
  #story[data-couple-scene] .couple-portrait-fallback,#story[data-couple-scene] .story-art #story-photo{animation:none;transform:none}
}
@media(prefers-reduced-motion:reduce) and (max-width:699px){
  #story[data-couple-scene] .couple-names{bottom:12%}
}
@media print{
  #story[data-couple-scene] .couple-garden{display:none}
  #story[data-couple-scene] .couple-names{bottom:10.5%}
  #story[data-couple-scene] .couple-portrait-fallback,#story[data-couple-scene] .story-art #story-photo{animation:none;transform:none}
}
